* { -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; }
html, body {
  margin:0;
  padding:0;
  height:100%;
  width:100%;
  font-size: 90%;
  overflow: hidden
}

/*-------------------------------------------------------------------
 common
-------------------------------------------------------------------*/
.clearfix{ zoom:1}
.clearfix:after{ content:"";  display:block;  clear:both}


/* ------------------------------------------------------------------------
  Introduction
------------------------------------------------------------------------ */
#big-video-wrap { background: #000; z-index: 1500;}
#fake { background: #000; width: 100%; height: 100%; z-index: 3000; position: absolute;}

#intro_container {
  margin: 0 auto;
  display: table;
    width: 100%;
    height: 100%;
  z-index: 2000;
  position: fixed;
  background: url("../img/dotover.png");
}
  #intro {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    position: relative;
    z-index: 2000;
}
  
    #intro h1 { background: url(../img/intro_logo.png) no-repeat center top;}
    #youtube { cursor: pointer;}
      #youtube img {
        filter: alpha(opacity=0); /* IE lt 8 */
        -ms-filter: "alpha(opacity=0)"; /* IE 8 */
        opacity: 0;
      }
      #cboxWrapper { overflow: hidden}
    
    #intro p#gofoward {
      position: absolute;
      bottom: 60px;
      left: 50%;
      margin: 0 0 0 -105px;
      cursor: pointer;
    }
      #intro p#gofoward img {
      }

/* ------------------------------------------------------------------------
  container
------------------------------------------------------------------------ */
#fake2 { width: 100%; height: 100%; background: #fff; z-index: 100; position: absolute; top: 0; left: 0; overflow: hidden;}
#wrapper {
  z-index: 1;
  position: absolute;
  top: 0;
  width: 100%;
  
}

#container {
  width: 990px;
  margin: 0 auto;
}

/* ------------------------------------------------------------------------
  右側
------------------------------------------------------------------------ */
#main {
  float: right;
  width: 790px;
  border-left: 1px solid #bfbfbf;
  padding: 66px 0 100px 58px;
}
  /* ------------------------------------------------------------------------
    「利三」について
  ------------------------------------------------------------------------ */
  #top { background: url(../img/top_bg.png) no-repeat right top; padding: 537px 0 0;}
    #top h2 { margin: 0 0 15px;}

    #about {
      text-align: right;
      width: 810px;
      margin: 60px 0 30px;
      background: url(../img/about_bg.png) no-repeat right 200px;
    }
      #about1 {
        width: 732px;
        background: url(../img/about_bg1.png) no-repeat 80px 0;
        padding: 0 30px 0 0;
      }
      #about2 {
        width: 732px;
        background: url(../img/about_bg2.png) no-repeat 10px 0;
        padding: 0 100px 0 0;
        margin: -50px 0 0;
      }
        #about h3 { float: right; margin: 0 0 0 30px;}
        #about1 p,
        #about2 p { padding: 30px 0 0;}
      
      #about .imgs {
        margin: 50px -29px 0 0;
      }
        #about .imgs li {
          float: left;
          margin: 0 29px 0 0;
        }

  /* ------------------------------------------------------------------------
    オーダーバナー
  ------------------------------------------------------------------------ */
  .order_bnr {
    margin: 0 auto;
    width: 730px;
  }
    .order_bnr p {
      margin: 40px 0 10px;
    }
      .order_bnr a {
        display: block;
        width: 730px;
        height: 154px;
        background-image: url(../img/banner_order.png);
        background-position: 0 0;
        background-repeat: no-repeat;
      }
        .order_bnr a:hover {
          background-position: -730px 0;
        }


  /* ------------------------------------------------------------------------
    利島・三宅島
  ------------------------------------------------------------------------ */
  #place {
    padding: 20px 0 0;
    color: #535353;
    font-size: 90%;
  }
    #place h3 { margin: 0 0 20px;}
    #place > div {
      margin: 30px 0 0;
      padding: 35px 38px;
      background: url(../img/place_bg.jpg) no-repeat 0 0;
    }
      #toshima {}
      #miyakejima { text-align: right; margin: 170px 0 0;}
        #place h4 { margin: 0 0 7px}
          #toshima .img { float: left; margin: 5px 20px 0 0;}
          #miyakejima .img { float:right; margin: 5px 0 0 15px;}
          #toshima .txt,
          #miyakejima .txt { line-height: 1.9em;}

  /* ------------------------------------------------------------------------
    取扱店舗
  ------------------------------------------------------------------------ */       
  #shoplist {
    padding: 40px 0;
    font-size: 110%;
  }
    #shoplist h3 {
      border-bottom: 1px solid #d9d9d9;
      padding: 0 0 10px;
    }
    #shoplist ul {
      padding: 12px 20px 20px;
      list-style: none;
    }
      #shoplist ul li {
        border-bottom: 1px dotted #ccc;
        padding: 10px;
      }
        #shoplist h4 {
          font-weight: 700;
          font-size: 120%;
          margin: 5px 0;
          background: url(../img/arw1.png) 0 9px no-repeat;
          padding-left: 14px;
        }
          #shoplist h4 a:link,
          #shoplist h4 a:visited {
            text-decoration: none;
            color: #000;
          }
          #shoplist h4 a:hover {
            text-decoration: underline;
            color: #333;
            cursor: pointer;
          }

  /* ------------------------------------------------------------------------
    会社概要
  ------------------------------------------------------------------------ */
  #company { padding: 50px 0 20px;font-size: 110%;}
    #company h3 {
      border-bottom: 1px solid #d9d9d9;
      padding: 0 0 10px;
      line-height: 1.5em;
    }
    #company dl {
      width: 700px;
      float: right;
      overflow: hidden;
    }
      #company dt {
        float: left;
        width: 130px;
        border-top: 1px dotted #bfbfbf;
        margin: -1px 0 0;
        padding: 15px 45px 15px 0;
        text-align: right;
      }
      #company dd {
        border-top: 1px dotted #bfbfbf;
        margin: -1px 0 0 129px;
        padding: 15px 0;
      }
      
      #map {}
        #gotogooglemap {padding: 3px 0;}
          #gotogooglemap a,
          #gotogooglemap a:visited {
            display: block;
            float: right;
            color: #727272;
            background: url(../img/arw2.png) no-repeat left center;
            padding: 0 0 0 13px;
            font-size: 80%;
          }
  
  /* ------------------------------------------------------------------------
    お問い合わせ
  ------------------------------------------------------------------------ */
  #contact {
    padding: 50px 0 0;
  }
    #contact h3 {
      line-height: 1.5em;
    }
    #contact .txt {
      border: 1px solid #bfbfbf;
      background: #f5f5f5;
      padding: 12px 27px;
      margin: 10px 0 0;
      font-size: 90%;
      line-height: 1.8em;
    }
    #contact .must {}
    #contact .must:before {
      content: "* ";
      color: #a50000;
    }
    #contact dl {
      margin: 30px 0 0;
      font-size: 110%;
    }
      #contact dt {
        width: 170px;
        float: left;
        text-align: right;
        padding: 13px 20px 13px 0;
        clear: both;
      }
      #contact dd {
        width: 560px;
        float: right;
        padding: 13px 0;
      }
        #contact input,
        #contact textarea {
          border: 1px solid #d9d9d9;
          -webkit-box-shadow: 0 0 5px #d9d9d9 inset;
          -moz-box-shadow: 0 0 5px #d9d9d9 inset;
          -o-box-shadow: 0 0 5px #d9d9d9 inset;
          -ms-box-shadow: 0 0 5px #d9d9d9 inset;
          box-shadow: 0 0 5px #d9d9d9 inset;
          -webkit-border-radius: 3px;
          -moz-border-radius: 3px;
          -o-border-radius: 3px;
          -ms-border-radius: 3px;
          border-radius: 3px;
          padding: 2px 4px;
        }
        #contact input[type="radio"] { border: none;}
        #contact textarea {
          width: 300px;
          height: 100px;
        }
        /* 性別 */
        #sex {}
          #sex li {
            float: left;
            margin: 0 20px 0 0;
          }
        /* 送信ボタン */
        #form_submit {
          margin: 14px 0 0 170px;
          border: none;
          background: url(../img/btn_submit.png) no-repeat 0 0;
          width: 200px;
          height: 34px;
          cursor: pointer;
        }

/* ------------------------------------------------------------------------
  左側
------------------------------------------------------------------------ */
#side {
  float: left;
  width: 150px;
  padding: 66px 0 0 30px;
}
  #side h2 { text-align: center;}

  /* ------------------------------------------------------------------------
    メニュー
  ------------------------------------------------------------------------ */
  #nav {
    margin: 30px 0;
  }
    #nav li {
      background: url(../img/arw1.png) no-repeat 0 14px;
      padding: 12px 0 10px 12px;
      line-height: 1em;
    }

  /* ------------------------------------------------------------------------
    カタログ
  ------------------------------------------------------------------------ */
  #catalogue {}
    #catalogue h3 { line-height: 1.5em;}
    #catalogue ul { margin: 5px 0 0;}
      #catalogue li {
        height: 26px;
        width: 130px;
        margin: 0 0 10px;
      }

  /* ------------------------------------------------------------------------
    ソーシャルボタン
  ------------------------------------------------------------------------ */
  #social {}
    #social ul {}
      #social li {}


  @media screen and (max-height:680px) {
    #side {
      padding-top: 30px;
    }
    #nav {
      margin: 20px 0;
    }
    #nav li {
      padding: 9px 0 9px 12px;
    }
  }


/* ------------------------------------------------------------------------
  フッター
------------------------------------------------------------------------ */
#footer {
    background: #000; 
}

  #footer_inner {
    width: 960px;
    margin: 0 auto;
    color: #808080;
    font-size: 70%;
    line-height: 2;
  }

    #footerlink {
      padding: 4px 0;
      width: 500px;
      float: left;
    }

      #footerlink a:link, #footerlink a:visited {
        text-decoration: none;
        color: #fff;
      } 
      #footerlink a:hover {
        text-decoration: underline;
      } 

    #copy {
      padding: 4px 0;
      width: 400px;
      float: right;
      text-align: right;
    }



/* ------------------------------------------------------------------------
  Thanks
------------------------------------------------------------------------ */
#thanks_wrapper {
  height: 100%;
  width: 100%;
  display: table;
}
  #thanks {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
  }
    #thanks h1 { margin: 0 0 40px}
    #thanks p {
      margin: 30px 0;
    }
      #thanks p a,
      #thanks p a:visited {
        color: #717171;
      }