@charset "UTF-8";
/* CSS Document */

/*ヘッダー*/
/*body,#head_wrapper,#wrapper,#wrapper_back {
	background-image: none!important;
}*/


/*******************
共通項目
********************/

body {
    font-family:'Noto Sans JP',sans-serif;
    font-weight: 300;
	line-height: 1;
	color: #000;
    font-size: 13px;
    text-align: left;
    font-feature-settings: "palt";
    letter-spacing:0.1em;
    -webkit-font-smoothing: antialiased; 
}

th {
    font-weight: 300;
}

.wrapper {
    width: 100%;
    overflow: hidden;
}

.inner {
    width: 83.333vw;
    max-width: 1200px;
    margin: 0 auto;
}

.inner_outside {
    width: 88.888vw;
    margin: 0 auto;
}

.clear_fix {
    clear:  both; 
}

p {
    line-height: 2em;
    font-size: 13px;
}

p:first-line {
    line-height: 1;
}

.underline {
   border-bottom: 1px solid #000;
}


/*SP-PC切り替え*/
.only-PC {
    display: block!important;
}

.only-SP {
    display: none!important;
}

.only-TB {
    display: none!important;    
}

.none-SP {
    display: block!important;
}

.mt150 {
    margin-top: 150px;
}

.mt100 {
    margin-top: 100px;
}

.mb150 {
    margin-bottom: 150px;
}

.mb100 {
    margin-bottom: 100px;
}

.mb62 {
    margin-bottom: 62px;
}


.acumin_Bold {
    font-family: acumin-pro, sans-serif;
    font-weight: 700;
    font-style: normal;
}

.acumin_Semibold {
    font-family: acumin-pro, sans-serif;
    font-weight: 600;
    font-style: normal;
}


.flex_box {
    display: flex;
    justify-content: space-between;
}

.imgWrap {
    width: 100%;
}


/*タイトル共通*/
h2 {
    font-family: acumin-pro, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 32px;
}

h2.jap {
    font-family:'Noto Sans JP',sans-serif;
    font-weight: 700;
    font-size: 22px;
    line-height: 1.3;
    flex-wrap: wrap;
    /* text-align: left;
    font-feature-settings: "palt";
    letter-spacing:0.1em;
    -webkit-font-smoothing: antialiased;  */
}

h3 {
    font-family: acumin-pro, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 16px;
    padding-left: 43px;
    border-left: solid 1px #000;
    margin-bottom: 30px;
    opacity: 0;
}


/****************************************************************************
セクション　タイトルアニメーション
****************************************************************************/
.title,
.title-delay,
.title-onload {
    display: flex;
    overflow: hidden;
    font-size: 32px;
}


.title span,
.title-onload span {
    display: block;
    transform: translate(0, 105%);
    transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 1s;
}
/*ディレイを入れるやつと入れないやつの記述を分ける*/

.title-delay span {
    display: block;
    transform: translate(0, 105%);
    transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 1s 0.2s;
}


.title.-visible span,
.title-onload.-visible span,
.title-delay.-visible span {
    transform: translate(0, 0);
}

.title span:nth-child(2),
.title-onload span:nth-child(2) {
    transition-delay: 0.06s;
}
.title span:nth-child(3),
.title-onload span:nth-child(3) {
    transition-delay: 0.12s;
}
.title span:nth-child(4),
.title-onload span:nth-child(4) {
    transition-delay: 0.18s;
}
.title span:nth-child(5),
.title-onload span:nth-child(5) {
    transition-delay: 0.24s;
}
.title span:nth-child(6),
.title-onload span:nth-child(6) {
    transition-delay: 0.30s;
}
.title span:nth-child(7),
.title-onload span:nth-child(7) {
    transition-delay: 0.36s;
}
.title span:nth-child(8),
.title-onload span:nth-child(8) {
    transition-delay: 0.42s;
}
.title span:nth-child(9),
.title-onload span:nth-child(9) {
    transition-delay: 0.48s;
}
.title span:nth-child(10),
.title-onload span:nth-child(10) {
    transition-delay: 0.54s;
}
.title span:nth-child(11),
.title-onload span:nth-child(11) {
    transition-delay: 0.6s;
}
.title span:nth-child(12),
.title-onload span:nth-child(12) {
    transition-delay: 0.66s;
}
.title span:nth-child(13),
.title-onload span:nth-child(13) {
    transition-delay: 0.72s;
}
.title span:nth-child(14),
.title-onload span:nth-child(14) {
    transition-delay: 0.78s;
}
.title span:nth-child(15),
.title-onload span:nth-child(15) {
    transition-delay: 0.84s;
}
.title span:nth-child(16),
.title-onload span:nth-child(16) {
    transition-delay: 0.9s;
}
.title span:nth-child(17),
.title-onload span:nth-child(17) {
    transition-delay: 0.96s;
}
.title span:nth-child(18),
.title-onload span:nth-child(18) {
    transition-delay: 1.02s;
}
.title span:nth-child(19),
.title-onload span:nth-child(19) {
    transition-delay: 1.08s;
}
.title span:nth-child(20),
.title-onload span:nth-child(20) {
    transition-delay: 1.14s;
}
.title span:nth-child(21),
.title-onload span:nth-child(21) {
    transition-delay: 1.2s;
}


.title-delay span:nth-child(2) {
    transition-delay: 0.26s;
}
.title-delay span:nth-child(3) {
    transition-delay: 0.32s;
}
.title-delay span:nth-child(4) {
    transition-delay: 0.38s;
}
.title-delay span:nth-child(5) {
    transition-delay: 0.44s;
}
.title-delay span:nth-child(6) {
    transition-delay: 0.50s;
}
.title-delay span:nth-child(7) {
    transition-delay: 0.56s;
}
.title-delay span:nth-child(8) {
    transition-delay: 0.62s;
}
.title-delay span:nth-child(9) {
    transition-delay: 0.68s;
}
.title-delay span:nth-child(10) {
    transition-delay: 0.74s;
}
.title-delay span:nth-child(11) {
    transition-delay: 0.80s;
}
.title-delay span:nth-child(12) {
    transition-delay: 0.96s;
}
.title-delay span:nth-child(13) {
    transition-delay: 1.02s;
}
.title-delay span:nth-child(14) {
    transition-delay: 1.08s;
}



/****************************************************************************
カーテンアニメーション
****************************************************************************/
/*カーテンアニメーションスクロールレフト*/
.curtain {
  position: relative;
	display:inline-block;
}
/* span要素 最初は非表示 */
.curtain span {
  transition: all 0s 0.5s ease;
  opacity: 0;
  padding: 0;
}

.curtain.active {
    opacity: 1;
}
/* .curtainに.activeがついたらspanを表示（この場合は1s後に表示させる） */
.curtain.active span {
  opacity: 1;
  color:#333;
}
/* .curtainに擬似要素を追加して、transformで横幅を0にしておく scaleX(0)
		あと、position→left:0 でスタート位置を左にしておく
*/
.curtain:after {
  display: inline;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  background: #000;
    z-index: 1000;
}
/* .curtainに.activeがついたら擬似要素のアニメーションを開始させる */
.curtain.active:after {
  animation: curtainEffect 1s ease-in-out 0s 1 normal both running;
}
/* アニメーションname duration 変化の度合い delay 回数 再生方向 アニメーションの開始前、終了後のスタイル アニメーションの再生・停止*/

/*　transform-originで変形における原点を設定（最初は左・上下の中央にセット）
		そのままscaleX(1)で右側いっぱいまで要素を伸ばし、
		伸ばした状態で原点を右・上下中央にセットし直す。
		原点が右に変わったことでscaleX(0)に戻る際、右側に消えるように流れる*/

@keyframes curtainEffect {
  0% {
    transform-origin: left center;
    transform: scaleX(0);
  }
  49.999% {
    transform-origin: left center;
    transform: scaleX(1);
  }
  50% {
    transform-origin: right center;
    transform: scaleX(1);
  }
  100% {
    transform-origin: right center;
    transform: scaleX(0);
  }
}




/*カーテンアニメーションスクロールライト*/
.curtainRight {
  position: relative;
	display:inline-block;
}
/* span要素 最初は非表示 */
.curtainRight span {
  transition: all 0s 0.5s ease;
  opacity: 0;
  padding: 0;
}

.curtainRight.active {
    opacity: 1;
}
/* .curtainに.activeがついたらspanを表示（この場合は1s後に表示させる） */
.curtainRight.active span {
  opacity: 1;
  color:#333;
}
/* .curtainに擬似要素を追加して、transformで横幅を0にしておく scaleX(0)
		あと、position→left:0 でスタート位置を左にしておく
*/
.curtainRight:after {
  display: inline;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  background: #000;
    z-index: 1000;
}
/* .curtainに.activeがついたら擬似要素のアニメーションを開始させる */
.curtainRight.active:after {
  animation: curtainRight 1s ease-in-out 0s 1 reverse both running;
}
/* アニメーションname duration 変化の度合い delay 回数 再生方向 アニメーションの開始前、終了後のスタイル アニメーションの再生・停止*/

/*　transform-originで変形における原点を設定（最初は左・上下の中央にセット）
		そのままscaleX(1)で右側いっぱいまで要素を伸ばし、
		伸ばした状態で原点を右・上下中央にセットし直す。
		原点が右に変わったことでscaleX(0)に戻る際、右側に消えるように流れる*/

@keyframes curtainRight {
  0% {
    transform-origin: left center;
    transform: scaleX(0);
  }
  49.999% {
    transform-origin: left center;
    transform: scaleX(1);
  }
  50% {
    transform-origin: right center;
    transform: scaleX(1);
  }
  100% {
    transform-origin: right center;
    transform: scaleX(0);
  }
}

/*カーテンアニメーションここまで*/



/****************************************************************************
スライドインアニメーション
****************************************************************************/
/*スクロールレフト*/
.slideIn-left.active {
  animation: slideInLeft 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
}
 
@keyframes slideInLeft {
  0% {
    transform: translateX(-10%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}


/*スクロールライト*/
.slideIn-right.active {
  animation: slideInRight 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
}
 
@keyframes slideInRight {
  0% {
    transform: translateX(100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}



/*スクロールボトム*/
.slideIn-bottom {
    opacity: 0;
}
.slideIn-bottom.active {
  animation: slideInBottom 1s cubic-bezier(0.25, 1, 0.5, 1)  1 forwards;
}
 
@keyframes slideInBottom {
  0% {
    transform: translateY(50%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
  }
  40%,100% {
    opacity: 1;
  }
}


/*オンロードボトム*/
.slideInOnload-bottom {
    opacity: 0;
}
.slideInOnload-bottom.active {
    animation: slideInOnloadbottom 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
  }
   
  @keyframes slideInOnloadbottom {
    0% {
      transform: translateY(30%);
      opacity: 0;
    }
    100% {
      transform: translateY(0);
      opacity: 1;
    }
  }


/*オンロードレフト*/
.slideInOnload-left.active {
  animation: slideInOnloadLeft 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
}
 
@keyframes slideInOnloadLeft {
  0% {
    transform: translateX(-100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}



/*オンロードライト*/
.slideInOnload-right.active {
  animation: slideInOnloadright 1s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
}
 
@keyframes slideInOnloadright {
  0% {
    transform: translateX(100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}



/*ディレイ*/
.delay-01 {
    animation-delay: 0.1s!important;   
}
.delay-02 {
    animation-delay: 0.2s!important;   
}
.delay-03 {
    animation-delay: 0.3s!important;   
}
.delay-04 {
    animation-delay: 0.4s!important;   
}
.delay-05 {
    animation-delay: 0.5s!important;   
}
.delay-06 {
    animation-delay: 0.6s!important;   
}
.delay-07 {
    animation-delay: 0.7s!important;   
}
.delay-08 {
    animation-delay: 0.8s!important;   
}
.delay-085 {
    animation-delay: 0.85s!important;   
}
.delay-09 {
    animation-delay: 0.9s!important;   
}
.delay-095 {
    animation-delay: 0.95s!important;   
}
.delay-10 {
    animation-delay: 1s!important;   
}
.delay-105 {
    animation-delay: 1.05s!important;   
}
.delay-11 {
    animation-delay: 1.1s!important;   
}
.delay-115 {
    animation-delay: 1.15s!important;   
}
.delay-12 {
    animation-delay: 1.2s!important;   
}
.delay-125 {
    animation-delay: 1.25s!important;   
}
.delay-13 {
    animation-delay: 1.3s!important;   
}
.delay-135 {
    animation-delay: 1.35s!important;   
}
.delay-14 {
    animation-delay: 1.4s!important;   
}
.delay-145 {
    animation-delay: 1.45s!important;   
}
.delay-15 {
    animation-delay: 1.5s!important;   
}
.delay-155 {
    animation-delay: 1.55s!important;   
}
.delay-16 {
    animation-delay: 1.6s!important;   
}
.delay-165 {
    animation-delay: 1.65s!important;   
}
.delay-17 {
    animation-delay: 1.7s!important;   
}
.delay-175 {
    animation-delay: 1.75s!important;   
}
.delay-18 {
    animation-delay: 1.8s!important;   
}
.delay-185 {
    animation-delay: 1.85s!important;   
}
.delay-19 {
    animation-delay: 1.9s!important;   
}
.delay-20 {
    animation-delay: 2.0s!important;   
}
.delay-22 {
    animation-delay: 2.2s!important;   
}
.delay-24 {
    animation-delay: 2.4s!important;   
}
.delay-26 {
    animation-delay: 2.6s!important;   
}
.delay-28 {
    animation-delay: 2.8s!important;   
}
.delay-30 {
    animation-delay: 3.0s!important;   
}




/****************************************************************************
マウスホバーアニメーション
****************************************************************************/
a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
a::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #FFF;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .3s;
}
a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);

}

a:hover {
    opacity: 0.6;
}

/* モーダル */

.lb-container {
    padding: 0!important;

  }

  .lightbox .lb-image {
    border-radius: none!important;
  }

  .lb-data .lb-close::after {
    content: none!important;
  }

  .lb-nav a.lb-prev {
    opacity: 1!important;
  }
  
  .lb-nav a.lb-next {
    opacity: 1!important;
  }
  
  .lb-nav a.lb-prev::after,
  .lb-nav a.lb-next::after {
    content: none;

  }


/****************************************************************************
ドロワーメニュー
****************************************************************************/
/* Navigation */
#navBar {
    position: fixed;
    margin: 0;
    width: 100%;
    height: 80px;
    z-index: 9999;
}


/* Name on Nav Bar */
.drawer-menu ul a {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 7em;
    font-family: arial;
    letter-spacing: .3em;
}


/* drawer menu */
.drawer-menu {
    box-sizing: border-box;
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    padding: 120px 0;
    background: #222;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .5s;
    transition-duration: .5s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0;
    box-shadow: 0px 0px 5px #1E1E1E;
}


.drawer-menu h2 {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 1s;
    transition-duration: 1s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0;
}


.drawer-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .5s;
    transition-duration: .5s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: translateY(20%);
    transform: translateY(20%);
    opacity: 0;
}

.drawer-menu .imgWrap {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .5s;
    transition-duration: .5s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%);
    opacity: 0;
}




.drawer-menu .inner {
    width: 89.3vw;
    height: 100%;
    align-items: center;
    justify-content: flex-start;
}

.drawer-menu .inner h2 {
    width: 100px;
    margin-right: 100px;
}

.drawer-menu .inner .imgWrap {
    width: 377px;
    margin-right: 100px;
}

.drawer-menu li {
    text-align: left;
}

.drawer-menu li a {
/*    display: block;*/
/*    height: 50px;*/
    font-size: 32px;
    color: #fff;
    font-family: acumin-pro, sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1em;
    padding: 16px 0;
}

.drawer-menu li a.situation {
    line-height: 1.6em;
    padding: 6.4px 0;
}

.drawer-menu li a::after {
    background: #FFF;
}

.drawer-menu li a:hover {
    opacity: 1;
}

/*.drawer-menu li a:hover {
    color: #1a1e24;
    background: #96908D;
}*/


/* checkbox */
.check {
    display: none;
}

/* menu button - label tag */
.menu-btn {
    position: fixed;
    display: block;
    top: 28px;
    right: 40px;
    width: 56px;
    height: 40px;
    font-size: 10px;
    text-align: center;
    cursor: pointer;
    z-index: 3;
}

.bar {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 56px;
    height: 3px;
    background: #000;
    -webkit-transition: all .5s;
    transition: all .5s;
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

.bar.middle {
    top: 12px;
    opacity: 1;
    width:34px;
}

.bar.bottom {
    top: 24px;
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    width:21px;
}

.menu-btn__text {
    position: absolute;
    bottom: -15px;
    left: 0;
    right: 0;
    margin: auto;
    color: #000;
    -webkit-transition: all .5s;
    transition: all .5s;
    display: block;
    visibility: visible;
    opacity: 1;
}


/* Hover Effects */
/*.menu-btn:hover .bar {
  background: white;
}*/


.menu-btn:hover .menu-btn__text {
    color: #999;
}

.menu-btn:hover .bar.middle {
    width: 100%;
}

.menu-btn:hover .bar.bottom {
    width: 100%;
}

.close-menu {
    position: fixed;
    top: 0;
    right: 300px;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0);
    -webkit-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    visibility: hidden;
    opacity: 0;
}


/* checked */
.check:checked ~ .drawer-menu {
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    opacity: 1;
    z-index: 2;
}

.check:checked ~ .drawer-menu ul,
.check:checked ~ .drawer-menu .imgWrap{
     -webkit-transition-delay: .8s;
    transition-delay: .8s;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    opacity: 1;
    z-index: 2;
}

.check:checked ~ .drawer-menu h2 {
     -webkit-transition-delay: 1.3s;
    transition-delay: 1.3s;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    opacity: 1;
    z-index: 2;
}


.check:checked ~ .contents {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: translateX(-300px);
    -ms-transform: translateX(-300px);
    transform: translateX(-300px);
}

.check:checked ~ .menu-btn .menu-btn__text {
    visibility: hidden;
    opacity: 0;
}

.check:checked ~ .menu-btn .bar.top {
    width: 56px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    background: #FFF;
}

.check:checked ~ .menu-btn .bar.middle {
    opacity: 0;
    background: #FFF;
}

.check:checked ~ .menu-btn .bar.bottom {
    width: 56px;
    top: 40px;
    background: #FFF;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.check:checked ~ .close-menu {
    -webkit-transition-duration: 1s;
    transition-duration: 1s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
    background: #FFF;
    visibility: visible;
    opacity: 1;
    z-index: 3;
}



/****************************************************************************
MV
****************************************************************************/
#mv {
    width: 100%;
    height: 100vh;
    background-image: url("../images/mv.jpg");
    background-position: 29% 15%;
    background-repeat: no-repeat;
    background-size: 160%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/*#mv .wrap {
    width: 100%;
    height: 100%;
}

#mv .wrap span{
}
*/
#mv .inner_outside {
    position: relative;
    height: 100%;
}

#mv .inner_outside h1 {
    width: 147px;
    margin: 43px auto 0 0;
    opacity: 0;
}

#mv .inner_outside h3 {
    width: 150px;
    margin: 50px auto 0 0;
    border-left: none;
    padding-left: 0;
    opacity: 0;
}

#mv .inner_outside h2 {
    width: 365px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    opacity: 0;
}

#mv .inner_outside h2 div {
    width: 241px;
    margin: 0 0 38px auto;
}

#mv .inner_outside h2 p {
    width: 100%;
    font-size: 19px;
    text-align: right;
    white-space: nowrap;
}

.imgWrap {
    position: relative;
}

.imgWrap .inner {
    position: absolute;
    top: 80px;
    left:50%;
    transform: translateX(-50%);
}

.imgWrap .inner h2 {
    opacity: 0;
    line-height: 0;
}

.imgWrap .inner h2 p {
    width: auto;
    font-size: 19px;
    text-align: left;
    white-space: nowrap;
    display: inline-block;
    background-color: #000;
    color: #FFF;
    padding: 10px 11px;
    line-height: 1;
    margin: 0;
}


/****************************************************************************
lead
****************************************************************************/
#lead h3 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 25px;
    padding-left: 0;
    border: none;
}

#lead h3,
#lead .lead{
    opacity: 0;
}

#lead .lead,
#service .inner .articleWrap p {
    display: inline;
}




/****************************************************************************
recommended
****************************************************************************/
#recommended .inner .caption {
    line-height: 1em;
    margin-top: 16px;
    font-family: acumin-pro, sans-serif;
    font-style: normal;
    font-weight: 300;
    opacity: 0;
}


#recommended .inner .articleWrap {
    width: 100%;
    align-items: flex-start;
    justify-content: flex-start;
}

#recommended .inner .articleWrap h3 {
    padding-left: 42px;
    position: relative;
    width: 226px;
    border-left: none;
    opacity: 0;
}

#recommended .inner .articleWrap h3::before {
    content: '';
    display: inline-block;
    width: 15px;
    height: 20px;
    background-image: url("../images/slash.png");
    background-size: contain;
    position: absolute;
    top: 0;
    left: 0;
}

#recommended .inner .articleWrap .txtWrap p {
    padding-left: 1em;
    position: relative;
}

#recommended .inner .articleWrap .txtWrap p::before {
    content: '■';
    font-size: 1em;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 1;
}

/* Firefox */
@-moz-document url-prefix() {
    #recommended .inner .articleWrap .txtWrap p::before {
        line-height: 1.5;
    }
}

#recommended .inner .articleWrap .txtWrap p:nth-child(1){
    margin-top: -5px;
}

#recommended .inner .articleWrap p {
    font-size: 40px;
    line-height: 1em;
    line-height: 1.5em;
/*    margin-top: -20px;*/
    opacity: 0;
    margin-bottom: 40px;
}

#recommended .inner .articleWrap p span {
/*    font-weight: 500;*/
    font-weight: bold;
}

#recommended .inner .articleWrap .txtWrap {
    width: calc(100% - 226px);
    margin-top: -.75em;
}




/****************************************************************************
slider
****************************************************************************/
.sliderWrap {
    width: 100%;
}

/****************************************************************************
contact
****************************************************************************/
#contact .inner .articleWrap {
    width: 100%;
    align-items: flex-start;
    justify-content: flex-start;
}

#contact .inner .articleWrap h3 {
    font-weight: 400;
    margin-right: 159px;
    border-left: none;
    padding-left: 0;
    opacity: 0;
    white-space: nowrap;
    margin-top: 0;
}

#contact .inner .articleWrap .article {
    margin-top: -7px;
    opacity: 0;
}

#contact .inner .articleWrap .article  .tel,
#contact .inner .articleWrap .article  .email {
    font-family: acumin-pro, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 32px;
    line-height: 1;
    margin-bottom: 20px;
    margin-top: 0;
}

#contact .inner .articleWrap .article  .email:after {
    content: none;
}

#contact .inner .articleWrap .article  .email {
    font-size: 28px;
    line-height: 1;
    margin-bottom: 28px;
    margin-top: 0;
}

#contact .inner .articleWrap .article  .address {
    margin-bottom: 18px;
}

#contact .inner .articleWrap .article  .attention {
    font-size: 11px;
    line-height: 2em;
}

#contact .inner .articleWrap .imgWrap {
    width: 213px;
    margin-left: 295px;
    opacity: 0;
}

#contact .inner .articleWrap .imgWrap .logo_buzz {
    width: 69px
}

#contact .inner .articleWrap .imgWrap .logo_airbase {
    width: 58px;
}



/****************************************************************************
map
****************************************************************************/
#map .inner .articleWrap {
    justify-content: flex-start;
}

#map .inner .articleWrap .access {
    margin-right: 103px;
    width: 183px;
    white-space: nowrap;
}

#map .inner .articleWrap .access h3,
#map .inner .articleWrap .spot h3 {
    opacity: 0;
}

#map .inner .articleWrap .spot .flex_box {
    flex-wrap: wrap;
    justify-content: flex-start;
}

#map .inner .articleWrap .access ul,
#map .inner .articleWrap .spot ul {
    opacity: 0;
}

#map .inner .articleWrap li {
    padding-left: 40px;
    position: relative;
}

#map .inner .articleWrap li span {
    font-weight: 500;
}

#map .inner .articleWrap li::before {
    content: '';
    display: inline-block;
    width: 12.5px;
    height: 18px;
    background-image: url("../images/pin.png");
    background-size: contain;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

#map .inner .articleWrap .access li:nth-child(1), 
#map .inner .articleWrap .spot .flex_box li:nth-child(1),
#map .inner .articleWrap .spot .flex_box li:nth-child(2){
    margin-bottom: 30px;
}

#map .inner .articleWrap .spot .flex_box li:nth-child(odd) {
    width: 419px;
}


.ggmap {
    position: relative;
    padding-top: 38.8%;
    overflow: hidden;
    width: 88.75vw;
    max-width: 1278px;
    margin-right: auto;
    margin-left: auto;
    opacity: 0;
}

.ggmap iframe,
.ggmap object,
.ggmap embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



/****************************************************************************
service
****************************************************************************/
#service .inner .articleWrap {
    line-height: 2em;
}

#service .inner .articleWrap table {
    opacity: 0;
}

tr th {
    width: 170px;
}

#service .inner .articleWrap table tr td span {
/*    font-weight: 500;*/
    font-weight: bold;
}

#service .inner .articleWrap p {
    width: 856px;
    margin: 0;
    opacity: 0; 
}

.btn_rbs {
    width: 560px;
    display: block;
    margin-top: 30px;
    opacity: 0;
}

.btn_rbs::after {
    content: none;
}

.btn_rbs:hover img{
    opacity: .6;
}



/****************************************************************************
attention
****************************************************************************/
#attention .inner .articleWrap .service_title {
    margin-bottom: 60px;
}


#attention .inner .articleWrap .alcohol_label {
    margin-bottom: 28px;
    opacity: 0;
}

/*#attention .inner .articleWrap .alcohol_label,
#attention .inner .articleWrap .alcohol_article,
#attention .inner .articleWrap .service_article,
#attention .inner .articleWrap .number {
    opacity: 0;
}*/

#attention .inner .articleWrap .alcohol_label,
#attention .inner .articleWrap .alcohol_article{
    opacity: 0;
}

#attention .inner .articleWrap .termsWrap {
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 63px;
    opacity: 0;
}

#attention .inner .articleWrap .termsWrap .arrowWrap {
    width: 40px;
}

#attention .inner .articleWrap .service_label {
    font-weight: 300;
    margin-left: 40px;
    position: relative;
}

/*#attention .inner .articleWrap .service_label::before {
    content: '';
    display: inline-block;
    width: 40px;
    height: 40px;
    background-image: url("../images/arrow_under.png");
    background-size: contain;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}*/

#attention .inner .articleWrap .service_label span {
    color: #ff0000;
}

#attention .inner .articleWrap .alcohol_label {
    font-weight: 400;
    font-size: 16px;
}

#attention .inner .articleWrap .number {
    margin-left: 43px;
    line-height: 2em;
    position: relative;
}

#attention .inner .articleWrap .hideWrap .number {
    margin-left: 0;
}

#attention .inner .articleWrap .number ol.parentheses1 {
	margin-left: 43px; /* サイトに合せて調整 */
}

#attention .inner .articleWrap .number ol li {
    list-style-type: none;
    counter-increment: cnt;
}



#attention .inner .articleWrap .number ol li::before {
 	content:  counter(cnt) ;  
    display:inline-block;
    margin-left:-43px; /* サイトに合せて調整 */
	width: 43px;;
}

#attention .inner .articleWrap .hideWrap .number ol {
    counter-reset:item 3;
}

#attention .inner .articleWrap .hideWrap .number ol li::before  {
 	content:  counter(item) ;  
    counter-increment: item;
}


/*もっと読むボタン*/
.hideWrap {
    display: none;
    padding-bottom: 60px;
}
 
 
button {
    border: none; 
    outline: none; 
    background: transparent; 
}

button.more {
    position: relative;
    height: 40px;
    width: 40px;
    display: block;
    background-color: transparent;
    transition: .5s;
    -erbkit-transition: .5s;
}
 
button.more::after {
    content: " ";
    display: inline-block;
    background-image: url("../images/arrow_under.png");
    background-size: contain;
    vertical-align: middle;
    position: absolute;
    width: 40px;
    height: 40px;
    left: 0;
    top: 0;
    transition: .5s;
    -erbkit-transition: .5s;
}

button:hover {
    opacity: 0.6;
}

.on-click {
    color: transparent!important;
}
 
.on-click {
    transform-origin:center center;
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
}

button.more.on-click::after {
    content: " ";
    display: inline-block;
    background-image: url("../images/close02.png");
    background-size: contain;
    vertical-align: middle;
    position: absolute;
    width: 40px;
    height: 40px;
}


#attention .inner .articleWrap .number label {
	position: absolute;
	z-index: 1;
	bottom: 0;
    margin: 0 calc(50% - 50vw);
    width: 100vw;
	height: 100px; /*グラデーションで隠す高さ*/
	cursor: pointer;
	text-align: center;
	background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 90%);
}




/****************************************************************************
footer
****************************************************************************/
#footer .inner .articleWrap .menu,
#footer .inner .articleWrap .contactWrap .contact .tellWrap {
    opacity: 0;
}


#footer .inner .articleWrap .menu,
#footer .inner .articleWrap .contactWrap .contact .tellWrap .tell {
    font-family: acumin-pro, sans-serif;
    font-weight: 500;
    font-style: normal;
}

#footer .inner .articleWrap .menu li {
    margin-bottom: 18px;
}

#footer .inner .articleWrap .menu li a::after {
    background: #000;
    bottom: -4px;
}

#footer .inner .articleWrap .menu li a:hover {
    opacity: 1;
}



#footer .inner .articleWrap .contactWrap .contact,
#footer .inner .articleWrap .contactWrap .about {
    justify-content: flex-start;
    align-items: flex-start;
}
  
#footer .inner .articleWrap .contactWrap .contact h3,
#footer .inner .articleWrap .contactWrap .about h3 {
    width: 127px;
    padding-left: 0;
    border-left: none;
}

#footer .inner .articleWrap .contactWrap .about p {
    margin-top: -5px;
    opacity: 0;
}

#footer .inner .articleWrap .contactWrap .contact {
    margin-bottom: 24px;
}

.tel-footer a,
.email-foooter a{
    font-family: acumin-pro, sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 28px;
}

.tel-footer a {
    margin-bottom: 12px;
}

#footer .inner .logoWrap {
    width: 250px;
    align-items: flex-end;
    opacity: 0;
}

#footer .inner .logoWrap .logo_buzz {
    width: 53px;
}

#footer .inner .logoWrap .logo_airbase {
    width: 45px;
}

#footer .inner .logoWrap p {
    font-size: 8px;
    line-height: 1;
}






/**********************************
PC中
***********************************/
@media screen and (max-width: 1350px) {

    /**********
    ドロワーメニュー
    **********/  
    .drawer-menu .inner h2 {
        width: 80px;
        margin-right: 80px;
    }
    .drawer-menu .inner .imgWrap {
        width: 290px;
        margin-right: 80px;
    }
    
    .drawer-menu li a {
        font-size: 26px;
    }
    
    
    
    /**********
    recommended
    **********/  
    #recommended .inner .articleWrap h3 {
        width: 19%;
    }
    
    #recommended .inner .articleWrap p {
        font-size: 30px;
    }
    
    
    /**********
    contact 
    **********/     
    #contact .inner .articleWrap .article {
        /*white-space: nowrap;*/
        width: 50%;
    }
    
    #contact .inner .articleWrap h3 {
        margin-right: 10%;
    }
    
    #contact .inner .articleWrap .imgWrap {
        margin-left: auto;
        width: 13.5%;
        min-width: 105px;
    }
    
    #contact .inner .articleWrap .imgWrap .logo_buzz {
        width: 48%;
        min-width: 50px;
    }
    
    #contact .inner .articleWrap .imgWrap .logo_airbase {
        width: 43%;
        min-width: 45px;
    }

}


@media screen and (max-width: 1280px) {
    #map .inner .articleWrap .spot .flex_box {
        display: block;
    }
    
    #map .inner .articleWrap .access li:nth-child(1),
    #map .inner .articleWrap .spot .flex_box li:nth-child(1),
    #map .inner .articleWrap .spot .flex_box li:nth-child(2),
    #map .inner .articleWrap .spot .flex_box li:nth-child(3) {
        margin-bottom: 15px;
    }
    
    #contact .inner .articleWrap {
        flex-wrap: wrap;
    }
}



/**********************************
タブレット
***********************************/
@media screen and (max-width: 1024px) {
    

    /**********
    共通項目
    **********/  
    .inner {
        padding-right:50px!important;
        padding-left:50px!important;
        width: auto;
    }
    
    .imgWrap .inner {
        padding: 0!important;
        width: 100%;
        bottom: 20px;
    }

    .imgWrap .inner h2 {
    padding-left: 50px;
    }
    
    /**********
    mv
    **********/    
    #mv {
        background-position: 42% 15%;
        background-size: cover;
    }
    

    
    /**********
    ドロワーメニュー
    **********/
    .drawer-menu .inner h2 {
        width: 8%;
        margin-right: 8%;
    }
    
    .drawer-menu .inner .imgWrap {
        width: 30%;
        margin-right: 8%;
    }
    
    .drawer-menu li a {
        font-size: 18px;
    }

    
    /**********
    recommended
    **********/   
    #recommended .inner .articleWrap p {
        font-size: 24px;
        /* line-height: 1em; */
        margin-bottom: 25px;
    }
    
    #recommended .inner .articleWrap .txtWrap p:last-child {
        margin-bottom: 0;
    }
    
    
    /**********
    contact
    **********/ 
    #contact .inner .articleWrap {
        justify-content: space-between;
        flex-wrap: wrap;
    }
    
    #contact .inner .articleWrap h3 {
        margin-right: 0;
    }
    
    #contact .inner .articleWrap .imgWrap {
        margin-left: 0;
        margin-top: 0;
    }
    


    /**********
    map
    **********/     
    #map .inner .articleWrap .access li:nth-child(1),
    #map .inner .articleWrap .spot .flex_box li:nth-child(1),
    #map .inner .articleWrap .spot .flex_box li:nth-child(2),
    #map .inner .articleWrap .spot .flex_box li:nth-child(3) {
        margin-bottom: 15px;
    }
    
    
    
    
    .more.on-click::after {
        bottom: -1010px;
    }
    
    
    /**********
    footer
    **********/   
    #footer .inner .articleWrap .contactWrap .contact, 
    #footer .inner .articleWrap .contactWrap .about {
        display: block;
    }
         
 }



 @media screen and (max-width: 650px) {
    .btn_rbs {
        width: auto;
    }
}



/**********************************
SP
***********************************/
@media screen and (max-width: 599px) {
    
    .only-PC {
        display: none!important;
    }
    
    .only-SP {
        display: block!important;
    }
    
    .none-SP {
        display: none!important;
    }
    
    .inner {
        padding-right:20px!important;
        padding-left:20px!important;
    }
    
    .inner_outside {
        width: 100%;
        padding-right:20px!important;
        padding-left:20px!important;
        box-sizing: border-box;
    }
    
    .mb150 {
        margin-bottom: 70px;
    }
    
    .mt150 {
        margin-top: 70px;
    }
    
    .mt100 {
        margin-top: 50px;
    }
    
    .mb100 {
        margin-bottom: 50px;
    }
    
    
    .title, .title-delay {
        font-size: 24px;
    }
    
    h3 {
        padding-left: 18px;
    }
    
    /**********
    ドロワーメニュー
    **********/
    .menu-btn {
        right: 20px;
    }
    
 
    
    /**********
    mv
    **********/
    #mv {
    background-position: 37% center;
    }
    
    #mv .inner_outside h3,
    #mv .inner_outside h1 {
        width: 26.4vw;
    }
    
    #mv .inner_outside h3 {
        margin: 9.85% auto 0 0;
    }

    #mv .inner_outside h2 {
        width: 65.97%;
        top: auto;
        right: 20px;
        bottom: 18%;
    }
    
    #mv .inner_outside h2 p {
        font-size: 12px;
    }
    
    #mv .inner_outside h2 div {
        width: 69.68%;
        margin: 0 0 10px auto;
    }
    
  /*  
    .bar {
        width: 100%;
    }
    
    .bar.middle {
        width: 60%;
    }
    
    .bar.bottom {
        width: 37.5%;
    }
    
    .check:checked ~ .menu-btn .bar.top {
        width: 14.93vw;
    }


    .check:checked ~ .menu-btn .bar.bottom {
        width: 14.93vw;
    }
    */

    .imgWrap .inner {
        width: 100%;
        top: 20px;
        bottom: auto;
    }

    .imgWrap .inner h2 {
        padding-left: 20px;
    }
    
    .imgWrap .inner h2 p {
        font-size: 12px;
        padding: 6px 6px;
    }
    
    
    
    /**********
    lead
    **********/    
    #lead h3 {
        line-height: 1.5em;
    }
    
    
    /**********
    recommended
    **********/    
    #recommended .inner .caption {
        margin-top: 8px;
        font-size: 10px;
        line-height: 1.5em;
    }
    
    #recommended .inner .articleWrap h3 {
        padding-left: 30px;
    }
    
    #recommended .inner .articleWrap {
        display: block;
    }
    
    #recommended .inner .articleWrap p {
        font-size: 21px;
        line-height: 1.5em;
        margin-bottom: 12px;
    }

    #recommended .inner .articleWrap .txtWrap {
        width: auto;
        margin-top: 0;
      }
    
    #recommended .inner .articleWrap .txtWrap p:last-child {
        margin-bottom: 0;
    }


    
    /**********
    contact
    **********/      
    #contact .inner .articleWrap .article {
        white-space: normal;
        width: auto;
    }
    
    #contact .inner .articleWrap .imgWrap {
        margin-top: 30px;
    }

    
    /**********
    map
    **********/   
    #map .inner .articleWrap {
        display: block;
    }
    
    #map .inner .articleWrap .access {
        margin-bottom: 50px;
    }
    
    #map .inner .articleWrap .spot .flex_box {
        line-height: 1.5em;
    }
    
    
    /**********
    map
    **********/
    tr th,
    tr td {
        width: 100%;
        display: block;
    }
    
    tr th {
        font-weight: bold;
        margin-top: 15px;
    }
    
    #map .inner .articleWrap .spot li span {
        display: block;
    }
    
    
    /**********
    service
    **********/
    #service .inner .articleWrap p {
        width: 100%;
    }
    
    
    
    /**********
    attention
    **********/
    #attention .inner .articleWrap .service_label {
        line-height: 1.5em;
        margin-left: 30px;
    }
    
    
    #attention .inner .articleWrap .number {
        margin-left: 30px;
    }
    
    #attention .inner .articleWrap .termsWrap {
        margin-bottom: 40px;
    }
    
    #attention .inner .articleWrap .number ol li::before {
        margin-left: -30px;
        width: 30px;
    }
    
    #attention .inner .articleWrap .termsWrap .arrowWrap {
        width: 60px;
    }
    
    .more.on-click::after {
        bottom: -2130px;
        width: 40px;
    }

    #contact .inner .articleWrap .article .email {
        font-size: 22px;
    }
    
    
    /**********
    footer
    **********/
    #footer .inner {
        padding-top: 0;
    }
    
    #footer .inner .articleWrap {
        display: block;
    }
    
    #footer .inner .articleWrap .contactWrap .contact, 
    #footer .inner .articleWrap .contactWrap .about {
        margin-top: 50px;
    }
    
    
        
    /**********
    slider
    **********/
    .slider01 .slick-prev,
    .slider02 .slick-prev {
        left: 10vw;
    }

    .slider01 .slick-next,
    .slider02 .slick-next {
        right: 10vw;
    }
    
    .slider01 .slick-prev, 
    .slider01 .slick-next,
    .slider02 .slick-prev, 
    .slider02 .slick-next {
        width: 30px;
        height: 30px;
    }
    
    .slider01 .slick-next::before,
    .slider01 .slick-prev::before,
    .slider02 .slick-next::before,
    .slider02 .slick-prev::before {
        width: 30px;
        height: 30px;
    }
    

    .lb-nav a.lb-next ,
    .lb-nav a.lb-prev {
        background-size: 10vw!important;
      }
    
}