@charset "utf-8";
/*------------------------------------------------------------------*/
/*     共通設定用CSS                                                */
/*     対象：Clearfix、全体包括                                     */
/*------------------------------------------------------------------*/


/* clearfix 設定
------------------------------------------------------------------- */
/* For modern browsers */
.clearfix:before,
.clearfix:after {
  content:"";
  display:table;
}

.clearfix:after {
  clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.clearfix {
  zoom:1;
}


/* グローバルヘッダ領域
--------------------------------------------------------- */
/* headerField */
#headerField {
  height: 100px;
  position: relative;
  z-index: 100;
}


  /* ヘッダナビゲーション領域
  ------------------------------ */
  #headerNaviArea {
    width: 100%;
    height: 30px;
    top: 0;
    left: 0;
    text-align: center;
    background: url("../img/gheader/bg_black.png") repeat-x 0 0;
    position: fixed;
    z-index: 100;
  }

    #navigation {
      width: 980px;
      height: 30px;
      margin: 0 auto;
      text-align: left;
      position: relative;
    }

      #navigation h1 a {
        width: 120px;
        height: 85px;
        text-indent: -9999px;
        background: url("../img/gheader/logo.png");
        display: block;
        float: left;
      }

      #navigation ul {
        float: right;
      }

      #navigation ul li {
        margin:0 12px 0px 0px;
        float: left;
        display: inline;
      }

        #navigation ul li#mhlLi {
          margin: 0;
        }

        #navigation ul li a {
          height: 28px;
          text-indent: -9999px;
          display: block;
        }

        #navigation ul li#oReserveLi a {
          width: 107px;
          background: url("../img/gheader/btn_onlinereserve.png") no-repeat 0 0;
        }

        #navigation ul li#oReserveLi a:hover {
          background: url("../img/gheader/btn_onlinereserve.png") no-repeat 0 -28px;
        }

        #navigation ul li#vacancyLi a {
          width: 70px;
          height: 28px;
          background: url("../img/gheader/btn_vacancy.png") no-repeat 0 0;
        }

          #navigation ul li#vacancyLi a:hover {  background: url("../img/gheader/btn_vacancy.png") no-repeat 0 -28px;  }

        #navigation ul li#cReserveLi a {
          width: 110px;
          height: 28px;
          background: url("../img/gheader/btn_corporationreserve.png") no-repeat 0 0;
        }

          #navigation ul li#cReserveLi a:hover { background: url("../img/gheader/btn_corporationreserve.png") no-repeat 0 -28px; }

        #navigation ul li#infoLi a {
          width: 83px;
          height: 28px;
          background: url("../img/gheader/btn_infomation.png") no-repeat 0 0;
        }

          #navigation ul li#infoLi a:hover { background: url("../img/gheader/btn_infomation.png") no-repeat 0 -28px; }

        #navigation ul li#membershipLi a {
          width: 113px;
          height: 28px;
          background: url("../img/gheader/btn_membership.png") no-repeat 0 0;
        }

          #navigation ul li#membershipLi a:hover { background: url("../img/gheader/btn_membership.png") no-repeat 0 -28px; }

        #navigation ul li#institutionLi a {
          width: 138px;
          height: 28px;
          background: url("../img/gheader/btn_institution.png") no-repeat 0 0;
        }

          #navigation ul li#institutionLi a:hover { background: url("../img/gheader/btn_institution.png") no-repeat 0 -28px; }

        #navigation ul li#mhlLi a {
          width: 132px;
          height: 28px;
          background: url("../img/gheader/btn_myhv.png") no-repeat 0 0;
        }

          #navigation ul li#mhlLi a:hover { background: url("../img/gheader/btn_myhv.png") no-repeat 0 -28px; }


  /* メインビジュアル＠情報領域
  ------------------------------ */
  #headerDataArea {
    width: 100%;
    text-align: center;
  }

    #headerDataArea .dataFrame {
      width: 980px;
      margin: 0 auto;
      position: relative;
    }

      #headerDataArea .dataFrame #facilityName {
        position: absolute;
        top: 40px;
        left: 135px;
      }

        #headerDataArea .dataFrame #facilityName span {
          color: #fff;
          padding: 5px 10px;
          background: url("../img/bg_bread.png");
        }

      #headerDataArea .dataFrame #facilityTitle {
        position: absolute;
        top: 300px;
        left: 0;
      }


  /* メインビジュアル＠ログイン領域
  ------------------------------ */
  #headerLoginArea {
    width: 100%;
    text-align: center;
    position: fixed;
    z-index: 100;
  }

    #headerLoginArea .rangeBase {
      width: 980px;
      margin: 0 auto;
      position: relative;
    }

  /* My Harvest Login領域
  ------------------------------ */
  #loginWindow {
    width: 300px;
    height: 210px;
    text-align: center;
    background: url("../img/mhl/bg_mh.png") 0 0;
    display: none;
    position: absolute;
    top: 40px;
    _top: -40px;
    right: 0;
  }

    #loginWindow a.close {
      width: 20px;
      height: 20px;
      text-indent: -9999px;
      background: url("../img/mhl/btn_close.png") no-repeat 0 0;
      display: block;
      position: absolute;
      right: 5px;
      top: 5px;
    }

    #loginWindow .titleFrame  {
      width: 260px;
      height: 25px;
      margin: 15px auto 20px auto;
      text-indent: -9999px;
      background: url("../img/mhl/title_login.png") no-repeat center top;
      border-bottom: 1px solid #000;
    }

    #loginWindow table {
      width: 260px;
      margin: 0 auto 10px auto;
      border-bottom: 1px dotted #ddd;
    }

      #loginWindow table th {
        width: 95px;
        padding: 5px 0;
      }

        #loginWindow table tr#mailTr th span {
          width: 85px;
          height: 15px;
          text-indent: -9999px;
          background: url("../img/mhl/img_mail.png") no-repeat 0 0;
          display: block;
        }

        #loginWindow table tr#passTr th span {
          width: 65px;
          height: 15px;
          text-indent: -9999px;
          background: url("../img/mhl/img_pass.png") no-repeat 0 0;
          display: block;
        }

      #loginWindow table td {
        width: 165px;
        padding: 5px 0;
      }

        #loginWindow table td input {
          width: 160px;
          padding: 2px 0;
          border: 1px solid #000;
        }

        #loginWindow table tr#btnTr td  {
          width: 260px;
          padding: 15px 0;
          text-align: center;
        }

          #loginWindow table td input#login {
            width: 132px;
            height: 24px;
            margin: 0 auto;
            text-indent: -9999px;
            border: none;
            cursor: pointer;
            background: url("../img/mhl/btn_login.png") no-repeat 0 0;
            display: block;
          }

    #loginWindow .otherLinksFrame {
      width: 260px;
      margin: 0 auto;
    }

      #loginWindow .otherLinksFrame .signinBase {
        width: 80px;
        float: left;
      }

        #loginWindow .otherLinksFrame .signinBase a {
          width: 61px;
          height: 13px;
          margin: 0 0 0 10px;
          text-indent: -9999px;
          background: url("../img/mhl/img_signin.png") no-repeat 0 0;
          display: block;
        }

      #loginWindow .otherLinksFrame .lostBase {
        width: 160px;
        float: right;
      }

        #loginWindow .otherLinksFrame .lostBase a {
          width: 148px;
          height: 13px;
          margin: 0 10px 0 0;
          text-indent: -9999px;
          background: url("../img/mhl/img_lost.png") no-repeat 0 0;
          display: block;
        }





/* コンテンツ領域
-------------------------------------------------- */
#contentsField {
  width: 100%;
  height: auto;
  text-align: center;
  background: #fff url("../img/bg_contents.jpg") no-repeat center top;
  z-index: 50;
}

  #contentsField .rangeArea {
    width: 980px;
    margin: 0 auto;
    text-align: left;
    position: relative;
  }





/* フッタ領域
-------------------------------------------------- */
#footerField {
  width: 100%;
  height: auto;
  text-align: center;
  background: #fff url("../img/gfooter/bg_footer.png") no-repeat center bottom;
}


  /* 文字サイズ＆検索領域
  ------------------------------ */
  #functionArea {
    width: 1064px;
    margin: 0 auto;
    padding: 0 0 10px 0;
  }

    #functionArea p.footerInformation{
      color: #666;
      font-size: 100%;
      text-align: center;
      padding: 12px 0 0 0;
    }

    #functionArea .rangeFrame {
      width: 980px;
      margin: 0 auto;
    }

    #functionArea .textBase {
      width: 565px;
      float: left;
    }

      #functionArea .textBase .logoBox {
        width: 130px;
        height: 30px;
        margin: 10px 0 0 0;
        text-indent: -9999px;
        background: url("../img/gfooter/logo_footer.png") no-repeat 0 0;
        float: left;
      }

      #functionArea .textBase .textBox {
        width: 430px;
        margin: 23px 0 0 0;
        float: left;
      }

        #functionArea .textBase .textBox span {
          font-size: 0.9em;
        }

    #functionArea .fontBase {
      width: 145px;
      float: left;
      margin-right: 20px;
    }

      #functionArea .fontBase ul {
        margin: 20px 0 0;
      }

        #functionArea .fontBase ul li {
          margin: 0 5px 0 0;
          float: left;
        }

          #functionArea .fontBase ul li span {
            width: 68px;
            height: 20px;
            text-indent: -9999px;
            background: url("../img/gfooter/img_textsize.png") no-repeat 0 0;
            display: block;
          }

          #functionArea .fontBase ul li a {
            width: 16px;
            height: 20px;
            text-indent: -9999px;
            display: block;
          }

          #functionArea .fontBase ul li#sizeSLi a { background: url("../img/gfooter/btn_sizes.gif") no-repeat 0 0; }
          #functionArea .fontBase ul li#sizeMLi a { background: url("../img/gfooter/btn_sizem.gif") no-repeat 0 0; }
          #functionArea .fontBase ul li#sizeLLi a { background: url("../img/gfooter/btn_sizel.gif") no-repeat 0 0; }

          #functionArea .fontBase ul li#sizeSLi a:hover,
          #functionArea .fontBase ul li#sizeSLi.active a {
            background: url("../img/gfooter/btn_sizes.gif") no-repeat 0 -20px;
          }

          #functionArea .fontBase ul li#sizeMLi a:hover,
          #functionArea .fontBase ul li#sizeMLi.active a {
            background: url("../img/gfooter/btn_sizem.gif") no-repeat 0 -20px;
          }

          #functionArea .fontBase ul li#sizeLLi a:hover,
          #functionArea .fontBase ul li#sizeLLi.active a {
            background: url("../img/gfooter/btn_sizel.gif") no-repeat 0 -20px;
          }

    #functionArea .serachBase {
      width: 250px;
      float: left;
    }

      #functionArea .serachBase table,
      #functionArea .serachBase tr,
      #functionArea .serachBase th,
      #functionArea .serachBase td {
        border: none;
        margin: 0;
      }

      #functionArea .serachBase span {
        width: 102px;
        height: 20px;
        margin: 20px 5px 0 0;
        text-indent: -9999px;
        background: url("../img/gfooter/img_search.png") no-repeat 0 0;
        display: block;
        float: left;
      }

      #functionArea .serachBase #gcseBox {
        width: 143px;
        float: left;
        margin: 20px 0 0 0;
      }

      #functionArea .serachBase form.gsc-search-box {
        margin-bottom: 0;
      }

      #functionArea .serachBase table.gsc-search-box {
        margin-bottom: 0;
      }

      #functionArea .serachBase td.gsc-input {
        width: 86px;
        margin: 0 5px 0 0;
        padding: 0;
        float: left;
      }

        #functionArea .serachBase td.gsc-input input {
          width: 74px;
          margin: 0;
          padding: 2px 5px;
          border: 1px solid #7e7e7e;
        }

      #functionArea .serachBase td.gsc-search-button {
        width: 46px;
        margin: 0;
        padding: 0;
        float: left;
      }

        #functionArea .serachBase td.gsc-search-button input {
          display: block;
          width: 46px;
          height: 20px;
          text-indent: -9999px;
          margin: 0;
          padding: 0;
          border: none;
          cursor: pointer;
          background: url("../img/gfooter/btn_search.jpg") no-repeat 0 0;
        }

      #functionArea .serachBase td.gsc-clear-button {
        display: none;
      }


  /* その他リンク領域
  ------------------------------ */
  #linksArea {
    width: 1064px;
    margin: 0 auto;
    background: url("../img/gfooter/bg_links.png") repeat-x 0 0;
  }

    #linksArea .rangeFrame {
      width: 980px;
      margin: 0 auto;
    }

    #linksArea .siteDirBase {
      width: 150px;
      height: 45px;
      float: left;
    }

      #linksArea .siteDirBase a {
        width: 148px;
        height: 45px;
        text-indent: -9999px;
        background: url("../img/gfooter/btn_sitedirectory.png") no-repeat 0 0;
        display: block;
      }

    #linksArea .institutionListBase {
      width: 120px;
      height: 45px;
      float: left;
    }

      #linksArea .institutionListBase a {
        width: 113px;
        height: 45px;
        text-indent: -9999px;
        background: url("../img/gfooter/btn_institutionlist.png") no-repeat 0 0;
        display: block;
      }

    #linksArea ul {
      width: 710px;
      margin: 12px 0 0 0;
      float: left;
    }

      #linksArea ul li {
       margin: 0 0 0 8px;
       padding: 1px 0;
       float: left;
      }

        #linksArea ul li a {
          color: #fff;
        }


  /* コピーライト領域
  ------------------------------ */
  #copyrightArea {
    width: 1064px;
    margin: 0 auto;
  }

    #copyrightArea .rangeFrame {
      width: 980px;
      height: 80px;
      margin: 0 auto;
      position: relative;
    }

      #copyrightArea .rangeFrame span {
        width: 262px;
        height: 11px;
        text-indent: -9999px;
        background: url("../img/gfooter/img_copyright.png") no-repeat 0 0;
        display: block;
        position: absolute;
        top: 10px;
        right: 10px;
      }