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

.translate,.translate *{
 font-weight:bold;
 color:#000000;
}



h1,h2,h3,h4,h5,p,ul,ol{
 color:#884400;
}

h1{
 font-size:1.5em;
 text-align:center;
 background-repeat:repeat-x;
 background-image:url(h1_background_120x20.gif);
 background-color:#bb9911;
 font-weight:bold;
 padding:5px 0px;
 margin-bottom:20px;
}

h2{
 font-size:1.4em;
 background-color:#bb9911;
 color:#ffffff;
 padding:2px 5px;
 margin:10px 0px;
 clear:both;
}

h3{
 font-size:1.3em;
 border-top:solid 1px #bb9911;
 border-left:solid 5px #bb9911;
 padding:2px 5px;
 margin:10px 0px;
 clear:both;
}

h4{
 font-size:1.2em;
 margin:10px 0px;
 clear:both;
}

h1,h2,h3{
 clear:both;
}

ul,ol{
 margin-left:2em;
}

ul{
 margin-top:10px;
 margin-bottom:20px;
 list-style-type:circle;
}

li{
 margin-bottom:15px;
}

hr{
 width:100%;
 height:1px;
 border:dotted 1px #339966;
 margin:10px 0px;
 clear:both;
}

p{
 margin-bottom:10px;
 max-width:600px;
 -webkit-text-size-adjust:150%;
}

p a{
 margin:0px 5px;
}

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

#breadcrumb{
 width:90%;
 float:left;
 padding:5px 0px 0px 0px;
 margin:0px 0px 0px 10px;
}

#flag{
 width:90%;
 float:left;
 padding:5px 0px 0px 5px;
}

#flag a{
 border:0px;
}

#flag img{
 margin-right:20px;
}


#main{
 background-color:#ffffff;
/*  background-color:#ffffcc; */
 padding-bottom:200px;
}

#main_contents{
 margin:5px 10px;
}

#rule{
}

#footer{
 background-color:#bb9911;
 clear:both;
 text-align:center;
}

#footer_contents{
 width:600px;
 margin:0px auto;
 padding:5px 0px;
}

#footer .c{
 color:#ffffff;
}

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

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

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

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


#footer a{
 color:#ffffff;
 text-decoration:none;
 border-bottom:1px dotted #ffffff;
}

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

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

.r{
 text-align:right;
}

img.r{
 float:right;
 margin:10px;
}

.c{
 text-align:center;
}

.i{
 font-style:italic;
}

/* スクリーン全体のキャプチャ */
.whole_screen{
 float:left;
 clear:both;
 margin:10px;
 padding:5px;
 background-color:#999999;
 border:solid 5px #cccccc;
}

.tutorial_image,.operation_image{
 float:left;
 clear:both;
 margin:10px;
}

strong.alphabet{
 font-weight:bold;
 font-family:'Arial';
}

#example_and_solution{
 width:620px;
 height:400px;
 margin:10px auto;
}

#example_and_solution img{
 margin:0px auto;
}

#example{
 width:310px;
 float:left;
 margin-left:auto;
 text-align:center;
}


#solution{
 width:310px;
 float:left;
 margin-right:auto;
 text-align:center;
}

.caution{
 color:#cc0000;
}

.pickup{
 font-weight:bold;
 font-size:1.2em;
 border:solid 5px #ffdd44;
 padding:5px;
 margin:20px 0px 30px 30px;
 background-color:#ffffcc;
}

.difficulty_marks{
 background-color:#ffffff;
}