@charset "UTF-8";
#puyotop { max-width: 60em; min-width: 30em; }
#puyomain { margin: 1em 1em 1em 0 ; width: 63%; float:left; border: 2px solid #AAAAFF;
           min-width: 300px; }
#puyomain h2 { position: relative; top: -1.2em; left: 2em; z-index: 9;
              width: 6.4em; text-align: center; background-color: #ECF2F9; }
#puyomain dl { margin-bottom: .7em; }
#puyomain dt { width: 6em; padding-left: .9em;  color: #006400; font-size: 140%;
              line-height: 1; float: left; }
#puyomain dd { margin: 0; }
#puyomain h2+p { margin: -1.2em 12px 12px; padding: .5em; border: 1px solid #9999FF;
                background-color: white; font-size: 90%; }
#puyomain dd p { margin: 0 6px; padding: 0.75em 0 0; font-size: 80%;
         line-height: 1; background-color: transparent;
         border: solid #00B000; border-width: 0 0 1px; }
#puyomain ol,#puyomain ul { list-style-type: none; margin: 0 .5em; }
#puyomain li { margin:.3em; display: inline; line-height: 1.6; }
#puyomain li a { white-space: nowrap; }
#puyosub { margin: 1em 0; padding: 0 12px; width: 30%; min-width: 200px;
          float: left; border: 2px solid #AAAAFF; }
#puyosub h2 { position: relative; top: -1.2em; left: 1em; z-index: 9;
              width: 4em; text-align: center; background-color: #ECF2F9; }
#puyosub h2+dl { margin-top: -1.2em; }
#puyolink { max-width: 60em; }
#puyolink h2 { margin: 0; }
#puyolink dt,#useful li,#movie li
                            { font-size: 80%; color: black; }
#puyolink dt a:first-child,#useful li a:first-child,
                 #movie li a:first-child { font-size: 130%; }
#useful { float: left; width: 48%; }
#movie { float: right; width: 48%; }
.related { margin: 0; color: black; font-size: 100%; }
#footer { margin: 10em -10px -9em -25px; padding-left: 20px;
         border: solid #DDDDFF; border-width: 1px 0;
         clear: both; }
/* 講座ページ --------------------*/
#course { background-image: url(/puyobg.png);
         background-repeat: repeat-y; margin-left: 186px; }
#puyonav { font-size: 95%; position: absolute;
          top: 3em; left: 0; width: 180px; }
#puyonav h2 { text-align: center; }
#puyonav dl { padding: 5px; }
#puyonav dt { padding: 3px; color: black; text-align: center;
             background-color: #DDDDFF; font-weight: bold;
             border: solid #333399; border-width: 1px 1px 0; }
#puyonav dd { margin: 0 0 7px; border: 1px solid #333399; color: black;
             background-color: white; padding-top: 8px; }
#puyonav li { list-style-type: none; margin: 0; padding-left: 18px; }
.current { background: url(/crown.gif) 1px 33% no-repeat white; color: red; min-height: 16px; }
#puyonav form p { margin: 1em 1em 0; }
* html .current { height: 16px; }      /* IE6以前用ハック */
#puyonav div { width: 160px; margin: 0 auto; }
#puyointro dt { color: #000099; font-weight: bold; }
#puyointro dt+dd { color: red; font-weight: bold; }
#puyointro dt+dd+dd { margin-bottom: .7em; }
/* ぷよぷよの図 ----------------------*/
.figure a img,.with-figure a img { border-bottom: 2px blue solid; margin-bottom: 3px;
                                 padding-bottom: 1px; }
.figure { margin: 0; }
.with-figure img { float: left; margin-right: 5px; }
/* clearfixハック --------------------*/
.with-figure:after { content: "."; display: block; clear: both; visibility: hidden;
                    height: 0; }
.with-figure { display: inline-block; }   /* IE5.5以降用 */
* html .with-figure { height: 1%; }       /* IE5.0用 */
.with-figure { display: block; margin-bottom: .7em; }
/* 初手の置き方 ---------------------*/
#syote { margin-left: 114px; }
#syote h1 img { margin: .5em; border: 1px black solid; }
#syote223 h2 img { border: 1px black solid; }
#syotenav { width: 100px; position: fixed; top: 2em; left: 10px; padding: 10px 0;
           border: #AAAAFF 2px solid; list-style: none; text-align: center; }
#syotenav li { margin: 0; }
#syotenav a>img { margin-bottom: 3px; border: black 1px solid; }
#syotenav li>img { margin: -2px 0 1px; border: blue 3px solid; }
#syoteenter { list-style: none; }
#syoteenter img { margin-bottom: 3px; border: 1px black solid; }
/* 自作ぷよ動画 ---------------------*/
.puyomovie { padding-bottom: 1px; border: solid black;
          border-width: 0 1px 1px; }
.puyomovie dt { border-top: 1px solid black; clear: both; }
.puyomovie dt img { margin-right: 5px; float: left; }
.puyomovie dd { margin-left: 205px; }
dl.puyomovie:after { content: "."; display: block;
          clear: both; visibility: hidden; height: 0; }
/* ニコぷよまとめ -------------------*/
#nicopuyo { margin-left: 13em; }
#nicopuyo ul { list-style: none; }
#nicopuyo ul li { margin: 0; }
#nicopuyo #niconav { list-style: disc; }
#nicopuyo #niconav li { margin-left: 20px; }
#niconav { padding: .5em; position: fixed;  font-size: 90%;
        top: 70px; left: .5em; width: 12em;
        border: solid #333399 1px; background-color: white; }
/* コメント -------------------------*/
#comments { margin-top: 4em; }
#comments h2 { background-color: #DDDDFF; color: black;
         text-align: center; margin: 0; padding: 3px;
         font-size: 100%;
         border: solid #333399; border-width:  1px 1px 0; }
#comments ol,#comments h2+p { border: 1px solid #333399;
         margin: 0 0 7px; background-color: white; padding: 8px; }
#comments li { list-style-position: inside; margin: 0; }
#comments li p { margin-left: 1em; }
#comments ol h3 { font-size: 90%; font-weight: normal;
         color: black; display: inline; margin: 0; }
#comments form { width: 400px; max-width: 100%; }