#april{
 width:100%;
 clear:both;
}

.april{
 float:left;
 width:90px;
 text-align:center;
 font-size:0.7em;
}

.april p{
 margin:0px;
 clear:both;
}

.april img{
 float:left;
 margin:0px 12px;
}

.april a{
 border-bottom:0px;
}

.sol{
 width:40px !important;
}

.sol .view_solution{
 margin:0px 5px;
}

/* #################################################################################### */

/* テーマカラー */
/* ffff99 */
/* eecc33 */
/* bb9911 */
/* 777755 */

/* 日英共通のスタイル */
/* 使用フォントなど日英の相違部分は、ja.cssとen.cssで指定 */

/* スタイル一括指定 */
*{
 margin:0px 0px;
 padding:0px 0px;
 border:0px;
 line-height:1.35em;
}

/* #################################################################################### */

/* 一時的な指定は、ここで。 */
#opening_schedule{
 margin:5px 20px;
}

#opening_schedule td{
 padding:5px;
 vertical-align:top;
}

#opening_schedule .caution{
 font-size:0.9em;
}

/* #################################################################################### */

/* リンクの下線を指定 */
a{
 color:#663300;
 text-decoration:none;
 border-bottom:1px dotted #663300;
}

/* リンクが画像の場合は、ボーダー無し */
a.pict,a.pict:hover{
 border:0px;
 background:none;
}

/* マウスカーソルがリンクに重なったとき */
a:hover{
 color:#000000;
 background-color: #ffff00;
 border-bottom:1px solid #000000;
}

/* #################################################################################### */

.both{
 clear: both;
}

.nobr{
 white-space: nowrap;
}

/* 左右位置 */
p.r,div.r{
 text-align:right;
}
p.c,div.c{
 text-align:center;
}
p.l,div.l{
 text-align:left;
}

table.r,ul.r{
 margin-left:auto;
}
table.c,ul.c{
 margin-left:auto;
 margin-right:auto;
}
table.l,ul.l{
 margin-right:auto;
}

/* エラーメッセージなどの赤字 */
.caution{
 color:#cc0000;
}

/* #################################################################################### */

/* メイン部分の段落 */

#main p{
 margin:2px 10px 5px 10px;
}

/* #################################################################################### */

/* 見出し */

h1{
 color:#663300;
 font-size:180%;
 background-repeat:repeat-x;
 background-image:url(/images/h1_background_10x40.gif);
 text-align:center;
}

h1 span{
 font-size:70%;
}

h2{
 background-color:#bb9911;
 color:#ffffff;
 font-size:150%;
 padding:2px 5px;
 margin-bottom:5px
}

h3{
 font-size:120%;
 color:#663300;
 border-top:1px solid #bb9911;
 border-left:5px solid #bb9911;
 padding:2px 5px;
}

h4{
 font-size:105%;
 background-color:#ffff99;
 color:#000000;
 padding:2px 5px;
 margin:0px 20px 5px 0px;
}

/* #################################################################################### */

/* フォーム */
/* inputにボーダーを指定するとIEでラジオボタンにまでボーダーが付く */

.form_text,.form_text_login,textarea,.form_select{
 border-top:solid 2px #777755;
 border-right:solid 1px #ccccaa;
 border-bottom:solid 1px #eeeedd;
 border-left:solid 2px #999977;
 padding:0.2em 0.2em;
 background-color:#ffffcc;
 font-size:1em;
}

/* ログインページ以外は幅を指定 */
.form_text,textarea{
 width:90%;
}

.form_select{
 padding:0px;
}

/* ラジオボタン inputを囲むspanに指定 */
.form_radio{
 background-color:#ddffff;
 margin-right:10px;
 white-space:nowrap;
}

/* 出っぱったボタン */
.form_button{
/*  font-size:80%; */
 color: #000000;
 background-color:#bbbbbb;
 border-top:2px solid #dddddd;
 border-right:2px solid #666666;
 border-bottom:2px solid #444444;
 border-left:2px solid #bbbbbb;
/*  height:1.6em; */
 vertical-align:top;
 cursor:pointer;
 padding:0px 10px;
 letter-spacing: 0.1em;
 font-size:1em;
}

/* #################################################################################### */

/* テーブルの初期値 tdに背景色は指定しない */
table,th,tr,td{
 border:solid 1px #bb9911;
 border-collapse:collapse;
 line-height:1.2em;
}

td,td *{
 line-height:1.2em;
}

table{
 background-color:#ffffff;
}

th{
 background-color:#ddbb33;
 border:solid 1px #bb9911;
 font-weight:bold;
 color:#ffffff;
 white-space:nowrap;
 padding:2px 5px;
}

td{
 padding:5px 5px;
}

/* #################################################################################### */

/* hrの初期値 */
hr{
 height:1px;
 background-color:#bb9911;
 border:solid 1px #bb9911;
}

/* #################################################################################### */

/* fieldset、legendの初期値 */

fieldset{
 margin-bottom:10px;
 padding:10px 10px;
 border:solid #bb9911 1px;
}

legend{
 padding:2px 5px;
 background-color:#bb9911;
 color:#ffffff;
 font-weight:bold;
 font-size:1.2em;
}

/* #################################################################################### */

/* ヘッダ */
#header{
 padding-top:5px; /* #header_contents内で指定するとIEが変な解釈をする */
 float:left;
 width:100%;
 background-color:#bb9911;
 clear:both;
}

/* 背景画像 */
.header_background_image_index{
 height:190px;
 background-repeat:repeat-x;
 background-image:url(/images/index_800x190.gif);
}

#header p{
 color:#ffffff;
}

/* 国旗 */
.flag{
 border:solid 1px #999999;
}

/* padding-topを指定するとIEが変な解釈をする */
/* padding-bottomを取るとIEが変な解釈をする */
#header_contents{
 padding:0px 5px 5px 5px;
}

#header_contents p{
 margin-bottom:5px;
}

/* ヘッダの左側 */
#header_left{
 width:80%;
 float:left;
}

/* メンバーズホームのリンク */
#members_home{
 width:19%;
 float:left;
 text-align:right;
 white-space:nowrap;
}

#members_home a{
 color:#ffffff;
 border-bottom:1px dotted #ffffff;
}

#members_home a:hover{
 color:#000000;
 background-color:#ffff00;
 border-bottom:1px solid #000000;
}


#page_title{
 clear:both;
}


/* #################################################################################### */

/* ブレッドクラム */
#bread_crumbs{
 width:100%;
 background-repeat:repeat-x;
 background-image:url(/images/bread_crumbs_background_10x30.gif);
 background-color:#ffffff;
 clear:both;
}

#bread_crumbs_contents{
 padding:2px 5px;
}

/* #################################################################################### */

/* タブ部分 */
#navi_tab{
 background-color:#ffff99;
 width:100%;
 clear:both;
 border-bottom:solid 5px #bb9911;
}

ul#navi_tab_ul{
 font-size:85%;
 text-align:center;
 padding:4px 4px 2px 4px; /* bottomはborderの1/2の値 Operaは隙間ができる */
}

ul#navi_tab_ul li{
 display:inline;
 list-style-type:none;
 margin:0px 2px;
/*  padding:0px 0px; */
}

/* タブがオンの場合 */
.tab_on{
 background-color:#bb9911;
 border:solid 4px #bb9911;
}

.tab_on a,#extra_tab a{
 color:#ffffff;
}

/* タブがオフの場合 */
.tab_off{
 background-color:#eecc33;
 border:solid 4px #eecc33;
}


ul#navi_tab_ul a,ul#navi_tab_ul span{
 white-space: nowrap; /* liに指定するとIEで困る */
 border-bottom:none;
 margin-left:2px;
}

ul#navi_tab_ul a:hover{
 color:#000000;
 background-color: #ffff00;
}

ul#navi_tab_ul span{
 color:#999999;
}

/* 追加タブ部分 */
#extra_tab{
 background-color:#bb9911;
 padding:5px 30px 0px 30px;
 font-weight:bold;
 font-size:90%;
 margin-top:-5px; /* 追加タブが無い場合の線幅を打ち消し */
 border-bottom:solid 2px #bb9911;
 height:1.5em;
}

#extra_tab a{
 margin:0px 2px;
 padding:1px 2px;
 border-bottom:dotted 1px #ffffff;
}

#extra_tab a:hover{
 color:#000000;
}

/* #################################################################################### */

/* お知らせ */
#oshirase{
 width:100%;
 clear:both;
}

#oshirase h3{
 clear:both;
}

#oshirase h3 span{
 font-size:0.8em;
 color:#bb9911;
 margin-left:10px;
}

#oshirase p img{
 float:right;
 margin-left:10px;
 margin-bottom:5px;
}

#oshirase ul{
 margin-bottom:10px;
}

/* 作家インタビューなどの引用 */
#oshirase .talked{
 color:#bb9911;
 margin:0px 5px;
}

/* #################################################################################### */

/* メイン */

#main{
 float:left;
 width:100%;
 margin-right:-250px;
}

#main_contents{
 margin:5px 250px 5px 10px;
}

#main ul{
 margin-left:20px;
 list-style-type:circle;
}

.num li{
 margin-bottom:5px;
 margin-left:20px;
 list-style-type:decimal;
}

/* #################################################################################### */

/* サイドメニュー */
#sidebar{
 float : right;
 width: 205px;
 margin:5px 10px 20px 10px;
 padding-left:10px;
 padding-bottom:50px;
 border-left:dotted 5px #bb9911;
}

#sidebar ul{
 margin-left:15px;
 list-style-type:circle;
 font-size:90%;
}

#sidebar ul ul{
 margin-top:5px;
 list-style-type:disc;
}

#sidebar li{
 margin-bottom:5px;
}

#sidebar h2{
 clear:both;
 font-size:110%;
}

#sidebar p{
 line-height:1.1em;
 margin-bottom:10px;
 font-size:90%;
}

#sidebar .sidebar img{
 background-color:#bb9911;
}

#sidebar .sidebar{
 border:none;
}

#sidebar .sidebar a:hover{
 background-color:#ff0000;
}

#sample_problems_sidebar img,#take_a_break img{
 float:left;
 margin:0px 5px 5px 0px;
}

#sample_problems_sidebar h3,#take_a_break h3{
 border:none;
 padding:0px;
 font-size:1em;
}

#sample_problems_sidebar h3 a,#take_a_break h3 a{
 border:none;
 display:block;
 width:100%;
}

#sample_problems_sidebar h3 a:hover,#take_a_break h3 a:hover{
 background-color:#ffff00;
 border:none;
}

#sample_problems_sidebar p,#take_a_break p{
 font-size:0.9em;
}

/* #################################################################################### */

/* レベルマーク 背景画像を一つ */

.levelid_mark{
 background-repeat:no-repeat; background-position:center;
}

.levelid_mark p{
 padding-top:35px;
 font-size:0.9em;
 text-align:center;
}

.levelid_1{background-image:url(/images/levelid_1_40x50.gif);}
.levelid_2{background-image:url(/images/levelid_2_40x50.gif);}
.levelid_3{background-image:url(/images/levelid_3_40x50.gif);}
.levelid_4{background-image:url(/images/levelid_4_40x50.gif);}

/* #################################################################################### */

/* おためし問題 */

#sample_problems td{
 text-align:center;
}

#sample_problems img{
 margin-bottom:2px;
}

#sample_problems a{
 border-bottom:none;
}

/* #################################################################################### */

/* 最近の問題 */
#latest_problems{
 width:100%;
 background-color:#99ffff;
 border-top:solid 2px #666666;
 clear:both;
}

#latest_problems_contents{
}

#latest_problems th{
 vertical-align:bottom;
}

#latest_problems td,#latest_problems th{
 padding:2px 5px;
 text-align:center;
 white-space: nowrap;
}

/* レベル */
.latest_difficulty_td{
}

.latest_type_td a,.latest_played_loaded_td a{
 display:block;
 width:100%;
 border-bottom:none;
 font-weight:bold;
}

/* マウスオーバーで行の高さが変わらない様に */
.latest_type_td a:hover,.latest_played_loaded_td a:hover{
 border-bottom:none;
 background-color: #ffff00;
}

/* 解答状況によって背景色を変更 */
/* 
0…未着手
1…開いた
2…とちゅう
3…解いた(非公開)
4…解いた(公開)
 */
#history_statex span{
 border:solid 1px #666666;
 margin-left:20px;
}
.history_state0,.history_state1{
 background-color:#ccccff;
}
.history_state2{
 background-color:#ffffcc;
}
.history_state3,.history_state4{
 background-color:#ffcccc;
}

/* 問題をはじめから解く */
.play_new_problem{
 border-top:3px solid #ffffdd;
 border-right:3px solid #444400;
 border-bottom:3px solid #222200;
 border-left:3px solid #ffffbb;
 background-color:#bb9911;
}

/* 解答例 */
.view_solution{
 border-top:3px solid #ffffdd;
 border-right:3px solid #444400;
 border-bottom:3px solid #222200;
 border-left:3px solid #ffffbb;
 background-color:#ddbb33;
}


/* #################################################################################### */

/* フッタ上のGoogle広告 */
#google_footer_01{
 clear:both;
 float:left;
 width:98%;
 margin:50px 0px 20px 0px;
 padding-top:10px;
 text-align:center;
}

/* #################################################################################### */

/* フッタ */
#footer{
 background-color:#bb9911;
 padding-top:5px;
 padding-bottom:5px;
 border-top:solid #ffffff 10px;
 clear:both;
 text-align:center;
}

#footer #footer_logo{
 float:left;
}

#footer #arrow{
 float:right;
 margin:5px 5px 0px 100px;
 margin-right:5px;
}

#footer *{
 color:#ffffff;
 border-bottom:none;
}

#footer a:hover{
 color:#000000;
}