@charset 'utf-8';
/* --------------------------------------------------
 *  サイト内共通のCSSの宣言
 *
 *  ・共通
 *  ・ヘッダー
 *  ・グローバルナビ
 *  ・コンテンツ
 *  ・フッター
 *
 *  メディアクエリは下記ブレークポイントで指定
 *      -(min-width: 641px)
 *      -(max-width:1200px) and (min-width:641px)
 *      -(max-width:1024px) and (min-width:641px)
 *      -(max-width: 768px) and (min-width:641px)
 *      -(max-width: 640px)
 *      -(max-width: 375px)
 * -------------------------------------------------- */
@import url('./hover-min.css');
/*----- Font -----*/
@font-face {
  font-family: 'logotype';
  src: url('./../fonts/logotype.woff');
}
/*----- リンク -----*/
a:link {
  text-decoration: none;
  color: #0096B4;
}
a:visited {
  color: #0096B4;
}
a:hover {
  text-decoration: none;
  color: #036EB8;
}
a.white:link {
  text-decoration: none;
  color: #fff;
  outline: none;
}
a.white:visited {
  color: #fff;
  outline: none;
}
a.white:hover {
  text-decoration: underline;
  color: #fff;
  outline: none;
}
/*----- Clearfix -----*/
.clearfix:after {
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  content: '.';
}
.clearfix {
  display: inline-block;
  min-height: 1%;
  /* for IE 7*/
}
/* Hides from IE-mac */
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}
/* End hide from IE-mac */
/* section-padding */
.section-padding {
  padding: 5% 0;
}
/*fedeIn*/
.fade-in {
  -webkit-transition: opacity 2s;
     -moz-transition: opacity 2s;
       -o-transition: opacity 2s;
          transition: opacity 2s;
  opacity: 0;
}
@media print,
screen and (min-width: 641px) {
/* --------------------------------------------------
    共通
-------------------------------------------------- */
  body {
    font-family: 'logotype', 'a-otf-jun-pro', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    font-size: 14px;
    line-height: 1;
    margin: 0;
    padding: 0;
    color: #595757;
  }
  .pcBox {
    display: block;
  }
  .tbBox {
    display: none;
  }
  .spBox {
    display: none;
  }
  .br-pc {
    display: block;
  }
  .br-tb {
    display: none;
  }
  .br-sp {
    display: none;
  }
/* --------------------------------------------------
    ヘッダー
-------------------------------------------------- */
  #header {
    z-index: 9999;
    width: 100%;
    border-top: #0096B4 solid 4px;
    }
    #header-top-wrap {
      width: 100%;
      }
      #header-top-wrap #header-top-box {
        max-width: 1000px;
        margin: 0 auto;
        padding: 10px 0 0;
        }
        #header-top-wrap #header-top-box #header-site-desc {
          text-align: right;
          font-size: 12px;
          color: #0096B4;
        }
    #header-box-wrap {
      width: 100%;
      }
      #header-box {
        width: 100%;
        max-width: 1000px;
        margin: 0 auto;
        padding: 0 0 20px;
      }
      #header-left {
        float: left;
      }
      #header-left #office-no {
        font-size: 15px;
        display: block;
        padding-left: 2%;
      }
      #header-left #logo {
        float: left;
        width: 311px;
        height: 46px;
        }
        #header-left #logo a {
          display: block;
        }
      #header-right {
        float: right;
        padding-top: 15px;
        }
        #header-right #header-tel {
          float: left;
          color: #036EB8;
          font-size: 22px;
          font-weight: bold;
          }
          #header-right #header-tel {
            float: left;
            margin-right: 15px;
            padding: 2px 0;
            }
            #header-right #header-tel:before {
              content: '';
              padding-left: 25px;
              background: url(./../img/common/icon_tel.png) left center no-repeat;
              background-size: 17px 14px;
            }
            #header-right #header-tel a {
              color: #036EB8;
            }
        #header-right #header-btn-box {
          float: left;
          }
          #header-right #header-btn-box .btn {
            display: inline-block;
            margin-right: 5px;
            color: #FFF100;
            font-size: 12px;
            border: solid 1px #24479C;
            }
            #header-right #header-btn-box .btn a {
              display: block;
              padding: 7px 20px;
              color: #FFF100;
              background-color: #24479C;
            }
    #spHeaderMenuBox {
      display: none;
    }
/* --------------------------------------------------
    グローバルナビ
-------------------------------------------------- */
  #gnav-area {
    width: 100%;
    background-color: #0096B4;
    z-index: 9999;
    }
    #gnav {
      display: table;
      width: 100%;
      max-width: 1000px;
      margin: 0 auto;
      }
      #gnav li {
        display: table-cell;
        font-size: 16px;
        text-align: center;
        border-left: solid 1px rgba(255,255,255,0.6);
        }
        #gnav li:last-of-type {
          border-right: solid 1px rgba(255,255,255,0.6);
        }
        #gnav li a {
          display: block;
          padding: 18px 0;
          color: #FFF;
        }
        #gnav li a:hover {
          color: #0096B4;
          background-color: #E1F1F9;
        }
  /* スクロール時のスタイル */
  #gnav-area.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-box-shadow: 0 5px 3px -3px rgba(0,0,0,.6);
    -moz-box-shadow: 0 5px 3px -3px rgba(0,0,0,.6);
    box-shadow: 0 5px 3px -3px rgba(0,0,0,.6);
  }
/* --------------------------------------------------
    フッター
-------------------------------------------------- */
  /*----- ページトップへ -----*/
  #page-top {
    position: relative;
    z-index: 9998;
    display: none;
    width: 100%;
    height: 0;
    margin: 0 auto;
    }
    #page-top a {
      position: fixed;
      right: 20px;
      bottom: 0;
      display: block;
    }
    #page-top a img {
      width: 60px;
    }
  #footer {
    z-index: 8888;
    width: 100%;
    background-color: #0096B4;
    }
    #footer-nav-block #footer-nav-inner {
      padding: 0 20px;
      }
      #footer-nav-block {
        position: relative;
        z-index: 8887;
        width: 100%;
        padding: 40px 0;
        }
        #footer-nav-block #footernav {
          padding: 0 20px;
          text-align: center;
          }
          #footer-nav-block #footernav ul {
            display: inline-block;
            width: auto;
            text-align: left;
            }
            #footer-nav-block #footernav li {
              display: inline-block;
              margin: 0 20px 10px 0;
              text-align: left;
              font-size: 14px;
              }
              #footer-nav-block #footernav ul li a {
                color: #FFF;
              }
              #footer-nav-block #footernav ul li a:before {
                content: '';
                padding-left: 15px;
                background-size: 8px 9px;
                background-image: url(./../img/common/arrow_white.png);
                background-position: left center;
                background-repeat: no-repeat;
              }
    #footer-info-block {
      width: 100%;
      z-index: 8886;
      padding: 20px 0 10px;
      text-align: center;
      background-color: #FFF;
      }
      #footer-info-block .inner {
        display: inline-block;
        text-align: center;
        }
        #footer-logo {
          display: block;
          margin: 0 auto 10px;
          }
          #footer-logo a {
            display: block;
            width :100%;
          }
        #footer-address {
          display: block;
          margin-bottom: 10px;
          font-size: 16px;
          text-align: center;
          line-height: 1.2;
          font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
        }
        #footer-tel {
          display: block;
          font-size: 22px;
          color: #036EB8;
          }
          #footer-tel:before {
            content: '';
            padding-left: 25px;
            background: url(./../img/common/icon_tel.png) left center no-repeat;
            background-size: 17px 14px;
          }
          #footer-tel a {
            color: #036EB8;
          }
      /*copylight*/
      #copyrightArea {
        width: 100%;
        }
        #copyright {
          width: 100%;
          margin: 0 auto;
          padding: 20px 0;
          text-align: center;
          font-size: 12px;
          color: #FFF;
        }
}
@media screen and (max-width: 640px) {
/* --------------------------------------------------
    共通
-------------------------------------------------- */
  body {
    font-family: 'logotype', 'a-otf-jun-pro', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    font-size: 100%;
    line-height: 1;
    color: #595757;
    -webkit-text-size-adjust: 100%;
    }
    img {
        max-width: 100%;
        height: auto;
    }
    .pcBox {
        display: none;
    }
    .tbBox {
        display: none;
    }
    .spBox {
        display: block;
    }
    .br-pc {
        display: none;
    }
    .br-tb {
        display: none;
    }
    .br-sp {
        display: block;
    }
/* --------------------------------------------------
    ヘッダー
-------------------------------------------------- */
  #header {
    position: fixed;
    z-index: 3000;
    top: 0 !important;
    left: 0;
    width: 100%;
    padding: 4% 0 6%;
    border-top: #0096B4 solid 4px;
    background-color: #fff;
    -webkit-box-shadow: 0 5px 3px -3px rgba(0,0,0,.6);
       -moz-box-shadow: 0 5px 3px -3px rgba(0,0,0,.6);
            box-shadow: 0 5px 3px -3px rgba(0,0,0,.6);
    }
    #header-top-wrap {
      display: none;
    }
    #header-box {
      position: relative;
      width: 100%;
      margin: 0 auto;
    }
    #header-box #header-left {
      width: 62%;
      }
      #header-box #logo {
        width: 100%;
        padding-left: 3%;
        }
        #header-box #logo a {
          display: block;
          height: auto;
        }
    #spHeaderMenuBox {
    }
    #spHeaderTelBtn {
      position: absolute;
      top: 50%;
      right: 12%;
      width: 16%;
      margin: auto;
      -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
              transform: translateY(-50%);
    }
    #spHeaderMenuBox #spHeaderMenuOpenBtnBox {
      position: absolute;
      top: 60%;
      right: 0;
      width: 15%;
      margin: auto;
      -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
              transform: translateY(-50%);
    }
    #header-tel {
      display: none;
    }
/* --------------------------------------------------
    グローバルナビ
-------------------------------------------------- */
  #gnav-area {
    display: none;
  }
  /* スマホ用ドロワーメニュー */
  #slidenav {
    overflow: scroll;
    height: 100%;
    background-color: rgba(0,150,180,0.8);
    -webkit-overflow-scrolling: touch;
    }
    #sp-nav-ul {
      clear: both;
      width: 100%;
      margin: 0;
      padding: 0;
      list-style-type: none;
      border-top: 1px solid #fff;
      }
      #sp-nav-ul .menu-item {
        text-align: left;
        border-bottom: 1px solid #fff;
        }
        #sp-nav-ul .menu-item a {
          display: block;
          padding: 6% 5%;
        }
        #sp-nav-ul .menu-item > a:link,
        #sp-nav-ul .menu-item > a:visited {
          text-decoration: none;
          color: #fff;
        }
    #menuopen {
      float: right;
      width: 4em;
      padding: 4% 0;
      color: #fff;
      border-left: solid 1px #fff;
    }
    #menuclose {
      overflow: hidden;
      padding: 10px;
    }
    /* 開閉ボタン */
    .btn--slidenav {
      display: block;
      box-sizing: border-box;
      text-align: center;
      text-decoration: none;
      border-radius: 3px;
    }
  
    #menuclose__btn {
      padding: 2% 0;
      color: #fff;
      border: 1px solid #fff;
    }
    #sp-sns-box {
      padding: 5%;
      text-align: center;
      }
      #sp-sns-box .sp-sns-icon {
        display: inline-block;
      }
      #sp-sns-box #sp-fb {
        margin-right:1%;
      }
/* --------------------------------------------------
    フッター
-------------------------------------------------- */
  /*----- ページトップへ -----*/
  #page-top {
    position: relative;
    z-index: 9999;
    width:100%;
    height: 0;
    margin: 0 auto;
    }
    #page-top a {
      position: fixed;
      display: block;
      width: 11%;
      margin-left:100%;
      bottom: 0px;
      right: 3%;
      margin: 0 0 0 100%;
    }
  #footer {
    width: 100%;
    z-index: 8888;
    margin-top: 0;
    border-top: solid 10px #E1F1F9;
    background-color: #FFF;
    }
  
    #footer-nav-block {
      display: none;
    }
  
    #footer #footer-info-block {
      width: 100%;
      margin: 0 auto;
      text-align: center;
      }
      #footer #footer-info-block .inner {
        display: inline-block;
        padding: 5% 0;
        }
        #footer-logo {
          width: 100%;
          margin: 0 auto;
          text-align: center;
          }
          #footer-logo a {
            display: block;
          }
      #footer-address {
        padding: 3% 0 5%;
        font-size: 100%;
        text-align: center;
        font-weight: bold;
      }
        #footer-tel {
          display: block;
          line-height: 1;
          font-size: 120%;
          font-weight: bold;
          color: #036EB8;
          }
          #footer-tel a {
            color: #036EB8;
          }
          #footer-tel:before {
            content: '';
            padding-left: 10%;
            background: url(./../img/common/icon_tel.png) left center no-repeat;
            background-size: 80%;
          }
      /*copylight*/
      #copyrightArea {
        width: 100%;
        background-color: #0096B4;
        }
        #copyright {
          width: 100%;
          margin: 0 auto;
          padding: 3% 0;
          text-align: center;
          font-size: 70%;
          color: #FFF;
        }
}