@charset "utf-8";

html {
    overflow   : -moz-scrollbars-vertical ;
    overflow-y : scroll ;
}

body {
    padding : 5px ;
    background : url(../img/back.gif) #f8f8f8;
    min-width: 560px ;
}

body, th, td {
    font-family : 'ヒラギノ角ゴ Pro W3'
                , 'Hiragino Kaku Gothic Pro'
                , verdana, sans-serif, "MS UI Gothic"
                , Osaka, "MS Gothic", "MS PGothic" ;
    font-size : 15px ;
}
/*
body, th, td {
    font-family : verdana, sans-serif, "MS UI Gothic"
                , Osaka, "MS Gothic", "MS PGothic" ;
    font-size   : 15px ;
}
body, th, td {
    font-family : 'ヒラギノ角ゴ Pro W3'
                , 'Hiragino Kaku Gothic Pro'
                , 'メイリオ'
                , Meiryo
                , 'ＭＳ Ｐゴシック'
                , 'Arial Unicode MS'
                , Tahoma
                , Verdana
                , Arial
                , Helvetica
                , sans-serif;
    font-size   : 15px ;
}
*/

/* ---------------------------------------------------------
 *  header
 * ------------------------------------------------------ */
div#header {
    border-width : 0px 0px 1px 0px ;
    border-style : solid ;
    border-color : #808080 ;
    padding      : 0px 20px 10px 20px ;
    margin       : 0px 0px 10px 0px ;
}

/* ---------------------------------------------------------
 *  footer
 * ------------------------------------------------------ */
div#footer {
    border-width : 1px 0px 0px 0px ;
    border-style : solid ;
    border-color : #808080 ;
    margin       : 15px 0px 0px 0px ;
    padding      : 10px 10px 10px 20px ;
    clear        : both ;
    text-align   : right ;
}

/* ---------------------------------------------------------
 *  contents
 * ------------------------------------------------------ */
div#contents {
    padding : 5px 10px 0px 20px ;
}

/* ---------------------------------------------------------
 *  topcontents (adsence)
 * ------------------------------------------------------ */
div#topcontents {
    clear : both ;
    float : left ;
}

/* ---------------------------------------------------------
 *  bottomcontents (adsence)
 * ------------------------------------------------------ */
div#bottomcontents {
    clear   : both ;
    float   : left ;
}

/* ---------------------------------------------------------
 *  leftcontents (menu)
 * ------------------------------------------------------ */
div#leftcontents {
    clear        : both ;
    float        : left ;
    margin-right : 15px ;
}

/* ---------------------------------------------------------
 *  centercontents (body)
 * ------------------------------------------------------ */
div#centercontents {
    clear        : both ;
    float        : left ;
    margin-right : 15px ;
}

/* ---------------------------------------------------------
 *  rightcontents (menu2)
 * ------------------------------------------------------ */
div#rightcontents {
    clear   : both ;
    float   : left ;
}

/* ---------------------------------------------------------
 *  box frame
 * ------------------------------------------------------ */
div.menuarea, div.chapter, div.widechapter, div.specials, div.controller {
    border-width       : 1px 2px 2px 1px ;
    border-style       : solid ;
    border-color       : #808080 ;
    border-radius      : 6px ;
    -moz-border-radius : 6px ;
    -webkit-border-radius : 6px ;
    background-color   : #fefefe ;
}

/* ---------------------------------------------------------
 *  one menuarea
 * ------------------------------------------------------ */
div.menuarea {
    margin  : 0px 0px 15px 0px ;
    padding : 8px 10px 5px 10px ;
    width : 155px ;
}

/* ---------------------------------------------------------
 *  one chapter
 * ------------------------------------------------------ */
div.chapter {
    margin  : 0px 0px 15px 0px ;
    padding : 6px 15px 0px 10px ;
    width : 490px ;
}
div.chapter.wide {
    margin  : 0px 0px 15px 0px ;
    padding : 6px 15px 0px 10px ;
    width : 560px ;
}

/* ---------------------------------------------------------
 *  one specials
 * ------------------------------------------------------ */
div.specials {
    margin  : 0px 0px 15px 0px ;
    padding : 8px 10px 5px 10px ;
    width : 180px ;
}
div.specials iframe {
    margin : 0px 0px 5px 0px ;
}

/* ---------------------------------------------------------
 *  ono controller
 * ------------------------------------------------------ */
div.controller {
    clear : both ;
    margin  : 0px 0px 15px 0px ;
    padding : 5px 15px 5px 10px ;
    width : 490px ;
}

/* ---------------------------------------------------------
 *  contents title
 * ------------------------------------------------------ */
div#header h1 {
    color     : #000080 ;
    font-size : 36px ;
}

/* ---------------------------------------------------------
 *  contents sub title
 * ------------------------------------------------------ */
div#header p {
    margin    : 0px 0px 0px 20px ;
    color     : #000080 ;
    font-size : 18px ;
}

/* ---------------------------------------------------------
 *  page title
 * ------------------------------------------------------ */
div#header h2 {
    margin    : 10px 0px 0px 10px  ;
    color     : #000080 ;
    font-size : 24px ;
}
div#header h2 a {
    color : #000080 ;
}
div#header h2 span.contentpath {
    font-size : 14px ;
}

/* ---------------------------------------------------------
 *  chapter title
 * ------------------------------------------------------ */
div.chapter h3 {
    margin        : 0px 0px 10px 0px ;
    padding       : 0px 0px 2px 0px ;
    font-size     : 15px ;
    font-weight   : bold ;
    border-bottom : 1px solid #cccccc ;
}
div.chapter h3 a {
    color           : #000080 ;
    text-decoration : none ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.chapter h4 {
    margin      : 0px 20px 5px 10px ;
    font-weight : bold ;
}

/* ---------------------------------------------------------
 *  chapter status
 * ------------------------------------------------------ */
div.chapter div.statusbar {
    margin     : 0px 5px 15px 0px ;
    padding    : 0px 0px 0px 0px ;
    text-align : right ;
}

div.chapter div.detaillink p {
    margin      : 0px 5px 15px 0px ;
    text-align  : right ;
    font-size   : 12px ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.chapter iframe {
    margin  : 0px 5px 10px 20px ;
    padding : 0px ;
}
div.chapter table iframe {
    margin : 0px ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.chapter p {
    clear  : both ;
    margin : 0px 20px 10px 20px ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.chapter table {
    margin    : 0px 20px 10px 20px ;
}
div.chapter table.table {
}
div.chapter table.table tbody th,
div.chapter table.table tbody td,
div.chapter table.table th,
div.chapter table.table td {
    padding          : 3px 5px 5px 5px ;
    border           : 1px solid #8080ff ;
    background-color : #f0f0ff ;
    font-size        : 12px ;
}
div.chapter table.table thead th {
    background-color : #bebeff ;
}
div.chapter table.table tbody th {
    background-color : #bebeff ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.menuarea table.cal {
    margin : 2px auto 5px auto ;
}
div.menuarea table.cal caption {
    font-size : 12px ;
}
div.menuarea table.cal caption a {
    text-decoration : none ;
}
div.menuarea table.cal tbody th,
div.menuarea table.cal tbody td,
div.menuarea table.cal th,
div.menuarea table.cal td {
    padding          : 2px 2px 2px 2px ;
    border           : 1px solid #ffcc33 ;
    background-color : #fff8c0 ;
    text-align       : right ;
    font-size        : 12px ;
}
div.menuarea table.cal thead th {
    background-color : #ffc8a0 ;
}
div.menuarea table.cal tbody td.none {
    background-color : #f0f0f0 ;
}
div.menuarea table.cal tbody td.saturday {
    background-color : #e0e0ff ;
}
div.menuarea table.cal tbody td.sunday {
    background-color : #ffe0e0 ;
}
div.menuarea table.cal tbody td.holiday {
    background-color : #ffe0e0 ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.chapter pre.text,
div.chapter pre.command,
div.chapter pre.source {
    margin      : 0px 0px 10px 20px ;
    padding     : 6px 10px 4px 10px ;
    border      : 1px solid #808080 ;
    font-size   : 12px ;
    width       : 400px ;
    overflow-x  : auto ;
}
div.chapter pre.text {
    background-color : #eeffee ;
}
div.chapter pre.command {
    background-color : #cccccc ;
}
div.chapter pre.source {
    background-color : #eeeeff ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.chapter pre.text span.no,
div.chapter pre.command  span.no,
div.chapter pre.source  span.no {
    color : #0000ff ;
}

div.chapter pre.command span.prompt {
    color : #3333ff ;
}
div.chapter pre.command span.comment,
div.chapter pre.source span.comment {
    color : #008000 ;
}
div.chapter pre.command span.reversal {
    background : #000000 ;
    color      : #cccccc;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div.chapter form.example {
    border : 1px solid #808080 ;
    margin    : 10px 0px 15px 20px ;
    padding   : 6px 10px 4px 10px ;
    font-size : 11px ;
    width : 400px ;
}

div.menuarea h3, div.specials h3 {
    margin      : 0px 0px 5px 0px ;
    font-size   : 12px ;
    font-weight : bold ;
}


div.menuarea ul, div.specials ul {
    padding : 0px 0px 0px 18px ;
}

div.menuarea ul li, div.specials ul li {
    margin     : 0px 0px 5px 0px ;
    list-style : disc outside none ;
    font-size  : 12px ;
}

div.chapter dl {
    margin : 0px 0px 10px 30px ;
}
div.chapter dl dt {
    margin : 0px 0px 3px 0px ;
    text-decoration : underline ;
}
div.chapter dl dd {
    margin : 0px 0px 5px 20px ;
}

div.chapter ul {
    margin    : 0px 0px 15px 20px ;
}
div.chapter ul ul {
    margin    : 3px 0px 0px 10px ;
}
div.chapter ul li {
    margin          : 0px 0px 5px 20px ;
    list-style-type : disc ;
}
div.chapter ol {
    margin : 0px 20px 10px 23px ;
}
div.chapter ol li {
    margin          : 0px 0px 5px 20px ;
    list-style-type : decimal ;
}

div.chapter img.view {
    border : 1px solid #666666 ;
}

div.controller li.before,
div.controller li.after {
    font-size : 12px ;
}

div.controller li.before a,
div.controller li.after a {
    font-size : 12px ;
    color     : #333366 ;
    text-decoration : none ;
}

div.controller li.before {
    text-align    : left ;
}

div.controller li.after {
    text-align : right ;
    padding-top : 3px ;
    margin-top : 3px ;
    border-top : 1px solid #aaaaaa ;
}

/* ---------------------------------------------------------
 *  For "Amazon"
 * ------------------------------------------------------ */
div#amazon,
div#amazon_search,
div#amazon_affiliate {
    text-align : center ;
    padding-bottom : 15px ;
}
div#amazon h3,
div#amazon_search h3,
div#amazon_affiliate h3 {
    color : #880000 ;
}

/* ---------------------------------------------------------
 *  For "Google Adsense"
 * ------------------------------------------------------ */
div.google_adsense {
    background-color   : #fefefe ;
    border             : 1px solid #808080 ;
    margin-right       : 15px ;
    margin-bottom      : 15px ;
    float              : left ;
}
div.chapter div.google_adsense {
    border             : none ;
    margin-right       : 25px ;
    float              : none ;
}

/* ---------------------------------------------------------
 *  For "Google Search"
 * ------------------------------------------------------ */
div#google {
    padding-bottom : 10px ;
}
div#google h3 {
    color : #880000 ;
}
div#google h3 img {
    vertical-align : middle ;
    color : #880000 ;
}

/* ---------------------------------------------------------
 *  For "Discover Shiretoko"
 * ------------------------------------------------------ */
div#shiretoko {
    text-align : center ;
}
div#shiretoko h3 {
    color : #000088 ;
}


span.point {
    color : red ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div#blog_parts {
    padding-bottom : 10px ;
    text-align     : center ;
}
div#blog_parts h3 {
    color : #880000 ;
}
div#blog_parts div {
    margin : 0px auto 0px auto ;
}

/* ---------------------------------------------------------
 *  
 * ------------------------------------------------------ */
div#nakanohito {
    padding-bottom : 10px ;
    text-align     : center ;
}
div#nakanohito h3 {
    color : #880000 ;
}
div#nakanohito div {
    margin : 0px auto 0px auto ;
}