@charset "utf-8";
/* base.css が先に読み込まれていることが前提 */

/**
 * 1. Layout
 * 2. Font Settings
 * 3. Color Scheme
 * 4. Base Settings
 * 5. Class Settings
 * 6. ID Settings
 */

/*= Layout
-----------*/
body {}
#container {width:780px; margin:0 auto;}
  #header  {position:relative; height:80px; margin-top:10px;}
  #banner  {position:relative; height:332px;}
  #top-body   {position:relative; padding:0 10px 40px;}
    #leftcol  {float:left;  width:364px;}
    #rightcol {float:right; width:364px;}
  #body    {position:relative; padding:0 10px 40px;}
           /* mainとsubの高さが不定なので、float+clearfixを使用 */
    #main  {float:left; width:520px;}
    #sub   {float:right; width:200px;}
  #footer  {position:relative; padding-top:6px; padding-bottom:80px;}


/*= Font Settings
------------------*/
body {font:13px/1.385 'ヒラギノ角ゴ ProN W3','HiraKakuProN-W3','メイリオ',Meiryo,'ＭＳ ゴシック',sans-serif;}
body .lf {font-family:'ヒラギノ角ゴ ProN W3','HiraKakuProN-W3','メイリオ',Meiryo,'ＭＳ ゴシック',sans-serif;}
body .af {font-family:helvetica,arial,clean,sans-serif;} 
select,input,button,textarea {font:13px/1.16 'ヒラギノ角ゴ ProN W3','HiraKakuProN-W3','メイリオ',Meiryo,'ＭＳ ゴシック',sans-serif;}
select.lf,input.lf,button.lf,textarea.lf {font-family:'ヒラギノ角ゴ ProN W3','HiraKakuProN-W3','メイリオ',Meiryo,'ＭＳ ゴシック',sans-serif;}
select.af,input.af,button.af,textarea.af {font-family:helvetica,arial,clean,sans-serif;}
pre,code,kbd,samp,tt {font-family:'Osaka−等幅',Osaka-Mono,'メイリオ',Meiryo,'ＭＳ ゴシック',monospace;}
pre.lf,code.lf,kbd.lf,samp.lf,tt.lf {font-family:'Osaka−等幅',Osaka-Mono,'メイリオ',Meiryo,'ＭＳ ゴシック',monospace;}
pre.af,code.af,kbd.af,samp.af,tt.af {font-family:monospace;}


/*= Color Scheme
 白黒系: #000:黒 #bbbcba:深川鼠 #e5e4e6:白梅鼠 #f3f3f2:白練 #fff:白
 #e2041b:猩々緋
--------------------------------------------------------------------*/
html {background:#fff;}
body {}
#container{background:#fff; color:#000;}
  #header {background:#fff; color:#000;}
  #banner {background:#fff; color:#000;}
  #top-body   {background:#fff; color:#000;}
    #leftcol  {background:#fff; color:#000;}
    #rightcol {background:#fff; color:#000;}
  #body   {background:#fff; color:#000; border-top:1px solid #bbbcba;}
    #main {background:#fff; color:#000;}
    #sub  {background:#fff; color:#000;}
  #footer {background:#fff; color:#000; border-top:1px solid #bbbcba;}


/*= Base Settings
-------------------*/
a:hover {background:#e5e4e6;}
h1 a, h2 a, h3 a {text-decoration:none;}
th {white-space:nowrap;}


/*= Class Settings
-------------------*/
div.section {}

/*- clearfix hack -*/
.section:after {content:" "; display:block; height:0; visibility:hidden; clear:both;}
.section {display:inline-block;}
.section {display:block;}


/*= ID Settings
----------------*/
#header {}
  h1#site-title img {float:left;}
  h2#contact-info img {float:right;}

#banner {}
  #banner img {}

#top-body {font-size:108%;}
  #top-body h2 {margin-top:1em; font-size:167%;}
  #top-body h3 {font-size:108%;}
  #top-body p {margin-bottom:1em;}
    #top-body p img {float:left; margin:0 .5em;}
  #top-body ol {margin:1em;}
    #top-body ol li {list-style-position:inside;}
  #leftcol {}
  #rightcol {}
#body {font-size:108%;}
  #main {}
    #main div.page {margin-top:1em; margin-bottom:2em}
      #main h2.page-title {font-size:197%; line-height:1.16;}
      #main h2.page-title a {color:#000;}
      #main h3.page-section-title {margin-top:1em; font-size:153.9%;}
      #main h3.page-section-title a {color:#000;}
      #main ul.page-meta {font-size:85%; line-height:1.16;}
      #main ul.page-meta li {display:inline; list-style-type:none; padding-right:.5em;}
      #main div.page-body {padding:1em 0;}
      #main div.page-body p {margin-bottom:1em;}
      #main div.page-body ol {margin:0 1em 1em 1em;}
      #main div.page-body ul {margin:0 1em 1em 1em;}
      #main div.page-body li {margin-left:1em; list-style-position:inside;}
  #sub {}
    #sub div.side-menu {margin-bottom:1em;}

#footer {}
  #footer address {line-height:1; font-size:93%;}
  #footer address img {float:left; margin-left:5px; margin-right:.5em;}