@charset "utf-8";

/* switching PC/SP
----------------------------------*/
@media only screen and (min-width: 641px) {
  .sp {
    display: none !important;
  }
}
@media only screen and (max-width: 640px) {
  .pc {
    display: none !important;
  }
}

/*------------------------------------PC---------------------------------------*/
@media only screen and (min-width: 641px) {
  #headerInner #htel a[href^="tel:"] {
    pointer-events: none;
  }
}

/*------------------------------------SP---------------------------------------*/
@media screen and  (max-width: 640px) {

  /*** keyframes fadein ***/
  @-webkit-keyframes fadein {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  @-moz-keyframes fadein {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  @-ms-keyframes fadein {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  @-o-keyframes fadein {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  @keyframes fadein {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }

  /*** keyframes slideIn ***/
  @-webkit-keyframes slideIn {
    0% {
      -moz-transform: translate(0, -67px);
      -ms-transform: translate(0, -67px);
      -webkit-transform: translate(0, -67px);
      transform: translate(0, -67px);
      opacity: 0;
    }
    100% {
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
      opacity: 1;
    }
  }
  @-moz-keyframes slideIn {
    0% {
      -moz-transform: translate(0, -67px);
      -ms-transform: translate(0, -67px);
      -webkit-transform: translate(0, -67px);
      transform: translate(0, -67px);
      opacity: 0;
    }
    100% {
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
      opacity: 1;
    }
  }
  @-ms-keyframes slideIn {
    0% {
      -moz-transform: translate(0, -67px);
      -ms-transform: translate(0, -67px);
      -webkit-transform: translate(0, -67px);
      transform: translate(0, -67px);
      opacity: 0;
    }
    100% {
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
      opacity: 1;
    }
  }
  @-o-keyframes slideIn {
    0% {
      -moz-transform: translate(0, -67px);
      -ms-transform: translate(0, -67px);
      -webkit-transform: translate(0, -67px);
      transform: translate(0, -67px);
      opacity: 0;
    }
    100% {
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
      opacity: 1;
    }
  }
  @keyframes slideIn {
    0% {
      -moz-transform: translate(0, -67px);
      -ms-transform: translate(0, -67px);
      -webkit-transform: translate(0, -67px);
      transform: translate(0, -67px);
      opacity: 0;
    }
    100% {
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
      opacity: 1;
    }
  }

  /*** keyframes spin ***/
  @-webkit-keyframes spin {
    0% {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);}
  }
  @-moz-keyframes spin {
    0% {-moz-transform: rotate(0deg);}
    100% {-moz-transform: rotate(360deg);}
  }
  @-ms-keyframes spin {
    0% {-ms-transform: rotate(0deg);}
    100% {-ms-transform: rotate(360deg);}
  }
  @-o-keyframes spin {
    0% {-o-transform: rotate(0deg);}
    100% {-o-transform: rotate(360deg);}
  }
  @keyframes spin {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
  }


  #HeadWrap #Wrap,
  #HeadWrap #Wrap #Main,
  #HeadWrap #Wrap #Main #Info {
    width: auto;
  }

  .header-logo_menu {
    position: relative;
    background: #fff;
    box-sizing: border-box;
    padding: 3% 3% 1% 3%;
  }
  #Logo {
    width: 200px;
  }
  #Logo img {
    width: auto;
    max-width: 100%;
    height: auto;
    vertical-align: top;
    -ms-interpolation-mode: bicubic;
  }
  #GlobalNavi {
    display: none; /* JSで制御 */
    position: relative;
    z-index: 999;
    color: #fff;
    box-sizing: border-box;
    padding: 2% 8%;
    padding-bottom: 55px;
  }
  #GlobalNavi a {
    display: block;
    color: #fff;
    text-decoration: none;
  }
  #GlobalNavi > ul {
    margin: 0.75em 0;
  }
  #GlobalNavi > p:first-child {
    text-align: right;
    line-height: 1.4;
  }
  #GlobalNavi > P:first-child > a {
    display: inline;
    color: #ddd;
  }
  #GlobalNavi li {
    text-align: center;
    font-size: 16px;
    padding: 0.5em 0;
    border-bottom: 1px solid #333;
  }
  #GlobalNavi > ul > li:first-child {
    border-top: 1px solid #333;
  }
  #GlobalNavi li > a > .remove {
    display: block;
  }
  #GlobalNavi .GNaviBG {
    display: none;
  }
  .header-closed-wrap {
    display: none; /* JSで制御 */
  }
  #HeadWrap #Wrap {
    padding-top: 0;
  }

  #BottomWrap {
    height: auto;
    padding-top: 10px;
    box-sizing: border-box;
    padding: 3%;
  }
  #BottomWrap #Foot {
    width: auto;
    text-align: center;
  }
  #BottomWrap #Foot #Logo_s {
    float: none;
    width: auto;
    height: auto;
    margin: 0.45em 0 0.25em 0;
  }
  #BottomWrap #Foot #Logo_s a {
    height: 15px;
    width: 120px;
    background-size: 100%;
    background-repeat: no-repeat;
    margin: 0 auto;
  }
  #BottomWrap #Foot #Copyright {
    float: none;
    margin-left: 0;
  }

  #Main {
    padding: 3%;
  }
  #HeadWrap #Wrap #Main {
    float: none;
  }

  #Flash2nd img {
    width: auto;
    max-width: 100%;
    height: auto;
    vertical-align: top;
    -ms-interpolation-mode: bicubic;
  }

  #HeadWrap #Wrap #Main #Info dl {
    margin-top: 1em;
    padding-right: 3%;
    padding-left: 3%;
    float: none;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
  }
  #HeadWrap #Wrap #Main #Info dt {
    margin-right: 0;
  }
  #HeadWrap #Wrap #Main #Info dd {
    float: left;
    width: calc(100% - 80px);
    padding-top: 6px;
    box-sizing: border-box;
    padding-top: 0;
    padding-left: 5%;
    text-align: justify;
  }

  body.Bg2nd {
    background: none !important;
  }
  body.Bg2nd #HeadWrap {
    background: none;
  }
  #HeadWrap #Wrap #Main #Contents {
    padding-top: 0;
  }
  #HeadWrap #Wrap #Main #Contents h2 {
    margin: 10px 0 15px 0;
  }
  #HeadWrap #Wrap #Main #Contents h3 {
    height: auto;
    margin-bottom: 15px;
  }
  #HeadWrap #Wrap #Main #Contents h3.lead1 {
    font-size: 13px;
  }

  #HeadWrap #Wrap #Main #Contents #Page {
    display: table;
    width: 100%;
    height: auto;
  }
  #HeadWrap #Wrap #Main #Contents #Page #PageNumber {
    width: auto;
    float: none;
    display: table-cell;
    box-sizing: border-box;
    padding: 0 10px;
  }
  #HeadWrap #Wrap #Main #Contents #Page #PageNumber > a {
    display: inline-block;
    font-size: 13px;
    margin: 0.25em 0.25em;
    padding: 0 0.25em;
  }
  #HeadWrap #Wrap #Main #Contents #Page .Prev,
  #HeadWrap #Wrap #Main #Contents #Page .Next {
    display: table-cell;
    vertical-align: middle;
    float: none;
  }
  #HeadWrap #Wrap #Main #Contents #Page #PageNumber:first-child {
    padding-left: 26px;
  }
  #HeadWrap #Wrap #Main #Contents #Page #PageNumber:last-child {
    padding-right: 26px;
  }


  /****** .header-group --- start --- ******/
  #js-header-group {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 100;
  }

  /*** #GlobalNavi.header-nav-active ***/
  #GlobalNavi.header-nav-active {
    display: block !important;
    -webkit-animation: fadein 0.5s linear 0s 1;
    -moz-animation: fadein 0.5s linear 0s 1;
    -ms-animation: fadein 0.5s linear 0s 1;
    -o-animation: fadein 0.5s linear 0s 1;
    animation: fadein 0.5s linear 0s 1;
  }
  #GlobalNavi.header-nav-active > ul {
    -webkit-animation: slideIn 0.5s linear 0s 1;
    -moz-animation: slideIn 0.5s linear 0s 1;
    -ms-animation: slideIn 0.5s linear 0s 1;
    -o-animation: slideIn 0.5s linear 0s 1;
    animation: slideIn 0.5s linear 0s 1;
  }
  #js-header-group.hg-fixed {
    /*
    -webkit-animation: slideIn 0.5s linear 0s 1;
    -moz-animation: slideIn 0.5s linear 0s 1;
    -ms-animation: slideIn 0.5s linear 0s 1;
    -o-animation: slideIn 0.5s linear 0s 1;
    animation: slideIn 0.5s linear 0s 1;
    */
  }
  #js-header-group.hg-fixed.hg-mini #js-header-logo_menu {
    border-bottom: 1px solid #ddd;
  }
  #js-header-group.hg-fixed.hg-mini #js-header-logo_menu #Logo {
    width: 170px;
  }
  #js-header-group.hg-fixed.hg-mini #js-header-logo_menu #Logo a img {
    -moz-transform: initial;
    -ms-transform: initial;
    -webkit-transform: initial;
    transform: initial; /* Safari ズレ防止 */
  }
  #js-header-group.hg-fixed.hg-mini .drawer-icon {
    width: 18px; /* 75% */
    height: 10.5px; /* 75% */
  }
  #js-header-group.hg-fixed.hg-mini .drawer-txt {
    -webkit-transform:scale(0.7);
    -moz-transform:scale(0.7);
    -ms-transform:scale(0.7);
    -o-transform:scale(0.7);
    transform:scale(0.7);
    margin: 4px 0 0 0;
  }
  #js-header-group.hg-maxhi {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    -webkit-animation: slideIn 0;
    -moz-animation: slideIn 0;
    -ms-animation: slideIn 0;
    -o-animation: slideIn 0;
    animation: slideIn 0;
  }
  #js-header-group.hg-opened {
    background: rgba(0,0,0,1);
    width: 100%;
    height: 100%;
    overflow-y: auto;
  }

  .header-drawer {
    position: absolute;
    right: 3%;
    top: 18%;
    z-index: 9999;
  }
  .drawer-icon {
    height: 14px;
  }
  .drawer-icon-bar {
    height: 2px;
    background: #000;
  }
  .drawer-txt {
    font-size: 13px;
    color: #000;
    font-weight: bold;
  }
  .header-closed-wrap {
    position: fixed;
    z-index: 2;
    left: 0;
    bottom: 0;
    width: 100%;
    background: #111;
    box-sizing: border-box;
    padding: 3px;
    -webkit-animation: fadein 1.5s linear 0s 1;
    -moz-animation: fadein 1.5s linear 0s 1;
    -ms-animation: fadein 1.5s linear 0s 1;
    -o-animation: fadein 1.5s linear 0s 1;
    animation: fadein 1.5s linear 0s 1;
  }
  .closed-icon-bar {
    height: 2px;
  }
  .closed-txt {
    font-size: 11px;
  }
  .accordion-icon {
    margin-right: 6%;
  }
  .accordion-icon-bar {
    background-color: #3F0433;
  }
  /****** .header-group --- end --- ******/

  /****** スマホでメニューを開いた時に後ろはスクロールしないようにするjQueryのための設定 --- start --- ******/
  .js-base-fixed {
    position: fixed;
    width: 100%;
    height: 100%;
  }
  /****** スマホでメニューを開いた時に後ろはスクロールしないようにするjQueryのための設定 --- end --- ******/


}
