/* ==========================================================================
Base
========================================================================== */
/* iPhone 320px */
@media only screen and (min-width:320px){html{font-size: 72%;}}
/* Android 360px 1.125 */
@media only screen and (min-width:360px){html{font-size: 74%;}}
/* iPhone6 375px 117.1875 */
@media only screen and (min-width:375px){html{font-size: 85%;}}
/* iPhone6 plus 414px 1.29375 */
/*@media only screen and (min-width:412px){html{font-size: 73%;}}*/
/* sm */
@media(min-width: 576px){
  html{font-size: 72%;}
  .container {max-width: 100%;}
  .position-sm-absolute {position: absolute;}
  .bg-sm-none {background: none!important;}
  .bottomRight-md {bottom: 0; right: 0; left: auto!important;}
  .num-list:after {font-size: 2rem;}
}
/* md */
@media(min-width: 768px){
  html{font-size: 78%;}
  .bg-md-none {background: none!important;}
  .position-md-absolute {position: absolute;}
  .img-align-md-center{position:relative;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%)}
}
/* lg */
@media(min-width: 992px){
  html{font-size: 76%;}
  .position-lg-absolute {position: absolute;}
  .bg-lg-none {background: none!important;}
  .bg-right-long:before {content: "";position: absolute;top: 0;left: 0rem;margin: auto -14rem;width: 20rem;height: 100%;background: inherit; z-index: 0;}
  .mt-lg-0, .my-lg-0 {margin-top: 0!important;}
}
/*xl*/
@media(min-width:1200px){
  html{font-size: 78%;}
}
/*xl*/
@media(min-width:1366px){
  html{font-size: 85%;}
  .ob-left img {object-position: 0%!important;}
  .ob-right img {object-position: 0%!important;}
}
/*xxl*/
@media(min-width:1440px){
  .container {max-width: 1400px;}
}
@media(max-width: 575px){
  .brsp-sm-none br {display: none;}
}
@media(max-width: 768px){
  .brsp-md-none br {display: none;}
}
@media(max-width: 991px){
  .brsp-lg-none br {display: none;}
}

@media screen and (min-width:577px) and ( max-width:991px) {
}

@media screen and (min-width:577px) and ( max-width:1199px) {
}

/*xxl*/
/*@media(min-width:1600px){html{font-size: 104%;}}*/
html,html a{text-shadow: 1px 1px 1px rgba(0,0,0,0.004); }
html,body{overflow-x: hidden;height: 100%;}
body{position: relative;background-color: #EBEBEB; min-height: 100%;height: auto; color: #000;font-family:Helvetica, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;letter-spacing: .005rem;font-weight: 300;}

p{line-height: 1.6; letter-spacing:.04rem;}
h1,h2,h3,h4,h5,h6{line-height: 1.6;}

.container {padding-left:0; padding-right:0;}

/* font */
.fwb {font-weight: bold;}
.font-damion {font-family: 'Damion', cursive;}
.font-NotoSeri{&family=font-family: 'Noto Serif SC', serif;}
.font-NotoSeri{font-family: 'Noto Serif', serif;}
.font-NotoSeriSC{font-family: 'Noto Serif SC', serif;}

.clr-red{color: #e70000}
.clr-orange{color: #eb804d !important}
/*.clr-orange{color: #EB6C2D !important}*/

.ls-0105{letter-spacing: 0.15rem;}
.ls-0305{letter-spacing: 0.35rem;}

.z-0{z-index: 0;}
.z-50{z-index: 50;}
.z-100{z-index: 100;}

.h-0 {height:0;}
.h-05rem{height: .5rem;}
.h-13vh{height: 13vh;}
.h-23vh{height: 23vh;}
.h-45vh{height: 45vh;}
.h-77vh{height: 77vh;}
.mh-5rem{min-height: 5rem;}
.mh-6rem{min-height: 6rem;}
.mh-20rem{min-height: 20rem;}
.mh-30rem{min-height: 30rem;}
.mh-40rem{min-height: 40rem;}
.mh-50rem{min-height: 50rem;}
.mah-20rem{max-height: 20rem;}
.mah-21rem{max-height: 21rem;}
.mah-22rem{max-height: 22rem;}
.mah-23rem{max-height: 23rem;}
.mah-24rem{max-height: 24rem;}
.mah-26rem{max-height: 26rem;}
.mah-28rem{max-height: 28rem;}
.mah-35rem{max-height: 35rem;}
.mah-60rem{max-height: 60rem;}
.mah-64rem{max-height: 64rem;}
.mah-80vh{max-height: 80vh;}
.mw-100{max-width:100%!important;}
.mw-1400{max-width:1400px!important;}

.pt-100 {padding-top: 100%;}
.pb-100 {padding-bottom: 100%;}
.pb-01 {padding-bottom: .1rem;}
.mt--02 {margin-top: -.2rem;}
.mb--10{margin-bottom:-6rem!important;}
.mb--20{margin-bottom:-12rem!important;}
.mt--10{margin-top:-6rem!important;}
.mt--20{margin-top:-12rem!important;}
.word-break{word-break: break-word;}
.mr-auto{margin-left: auto;}

.txt-nowrap{white-space: nowrap;}
.txt-ellipsis{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mix-blend-screen {mix-blend-mode: screen;}

.font-mincho {font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}

a,.page-link{color: #000;}
a:hover{color:initial;text-decoration: none;}
a:active,a:focus {color: inherit; text-decoration: none;}

.img-align-bottom {position: relative;z-index: 1;top: 100%;left: 50%;transform: translate(-50%,-100%);}
.outline-none {outline:none;}
.c-p{cursor: pointer;}

.bg-stripe {background: linear-gradient(-45deg,#e6e6e6 50%, #F8F8F8 50%,#F8F8F8);}
.bg-stripe-grn {background: linear-gradient(-45deg,#009133 50%, #00A73B 50%,#00A73B);}
.bg-stripe-grn-2 {background: linear-gradient(45deg,#00A73B 40%, #009133 40%,#009133);}
.bg-stripe-beige {background: linear-gradient(-45deg,#f3f0df 50%, #dfdcca 50%,#dfdcca);}
.bg-stripe-beige-2 {background: linear-gradient(45deg,#dfdcca 40%, #f3f0df 40%,#009133);}
.bg-beige {background: #f3f0df;}
.bg-blk {background: #000;}
.bg-dark{background-color: #313639}
.bg-green{background-color: #00A73B;}
.bg-green-light{background-color: #C3D600;}
.bg-gray-light{background-color: #f5f5f5;}
.bg-gray-mid{background-color: #e6e6e6;}
.bg-yellow{background-color: #F6AB00}
.bg-blue{background-color: #003487}
.bg-blue-dark{background-color: #00002E}
.bg-gray-dark{background-color: #3f3f3f}
.bg-wht{background-color: #fff}
.bg-tx-1{background-image: url("../img/global/bg-tx-1.png");background-repeat: repeat;}
.bg-tx-2{background-image: url("../img/global/bg-tx-2.png");background-repeat: repeat;}
.bg-tx-3{background-image: url("../img/global/bg-tx-3.png");background-repeat: repeat; height: 150px;}
.bg-tx-4{background-image: url("../img/global/bg-tx-4.png");background-repeat: repeat;}
.bg-tx-5{background-image: url("../img/global/bg-tx-5.png");background-repeat: repeat;}
.bg-tx-6{background-image: url("../img/global/bg-tx-6.png");background-repeat: repeat;}

.txt-under{text-decoration: underline;}
.bg-blue-light{background-color: #D3E1E9;}

.bg-under-shadow:before {content:""; width: 100%; height: 8rem; position: absolute; bottom: 0;left: 0; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=0 ); }


.bc-blk{border-color: #000!important}
.bc-dark{border-color: #313639!important}
.bc-red{border-color: #e61919 !important;}
.bc-gray{border-color: #ccc !important}
.bc-gray-light{border-color: #dedcdc !important}
.bc-gray-dark{border-color: #333 !important}
.bc-orange{border-color: #eb804d !important}
.bc-brown{border-color: #ddc76b !important}

.bg-blk-op07{background:rgba(0,0,0,.7)}
.bg-wht-op01{background:rgba(255,255,255,.1)}

.txt-line-wht {background: linear-gradient(transparent 13%, #fff 0%);}
.txt-line-blk {background: linear-gradient(transparent 13%, #000 0%);}

.liComment{padding-left: 1rem;}
  .liComment>li{position: relative;padding-left: .25rem;}
    .liComment>li::before{position: absolute;content: "*";top:0;left:-1.15rem;color: #191919;vertical-align: middle;font-size: 1em;}

.topLeft{top: 0;left: 0;}
.topRight{top: 0;right: 5%;}
.bottomCenter{bottom: 0;left: 0;right: 0; margin: auto;}
.bottomLeft{bottom: 0;left: 0%;}
.bottomRight{bottom: 0;right: 5%;}
.middleLeft{top: 38%;left: 5%;}
.middleRight{top: 38%;right: 5%;}
.middleCenter{top: 50%;left: 50%;transform: translate(-50%, -50%);}

.text-vertical {
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  display: inline-block;
}



a.btn-sp {
display: block;
position: relative;
text-decoration: none;
}

a.btn-sp:after {
display: block;
content: "";
position: absolute;
top: 50%;
right: 10px;
width: 6px;
height: 6px;
margin: -4px 0 0 0;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
}

.dd-sub-menu {
  display: none; /* ← ここ追加 */
  background: white;
}

 /* マウスホバー時に表示させる */

.dd-menu:hover .dd-sub-menu {
  display: block;
}


/* loading
------------------------------------------*/
#loading {position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; height: 100%;-moz-transition-property: color; -o-transition-property: color; -webkit-transition-property: color; transition-property: color; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s;background: rgba(255, 255, 255,1)}
  #load-wrap {position: relative;left: -.35rem;width: 30rem; height: 6rem;-moz-transition: -moz-transform 0.2s; -webkit-transition: -webkit-transform 0.2s; -o-transition: -o-transform 0.2s; -ms-transition: -ms-transform 0.2s; transition: transform 0.2s;}
  #loading.active {opacity: 0; z-index: -100;visibility: hidden;-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-o-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}

.spinner {position: relative;width: 3rem;height: 1.2rem;text-align: center;}
  .spinner > div {background-color: #999;height: 100%;margin-right: .15rem;width: 2px;display: inline-block;-webkit-animation: sk-stretchdelay 1.3s infinite ease-in-out;animation: sk-stretchdelay 1.3s infinite ease-in-out;}
  .spinner .rect2 {-webkit-animation-delay: -1.1s;animation-delay: -1.1s;}
  .spinner .rect3 {-webkit-animation-delay: -1.0s;animation-delay: -1.0s;}
  .spinner .rect4 {-webkit-animation-delay: -0.9s;animation-delay: -0.9s;}
  .spinner .rect5 {-webkit-animation-delay: -0.8s;animation-delay: -0.8s;}
  @-webkit-keyframes sk-stretchdelay {0%, 40%, 100% { -webkit-transform: scaleY(0.55) } 20% { -webkit-transform: scaleY(1.0) }}
  @keyframes sk-stretchdelay {0%, 40%, 100% { transform: scaleY(0.55);  -webkit-transform: scaleY(0.55);}  20% { transform: scaleY(1.0);  -webkit-transform: scaleY(1.0);}}


 /*pagetop*/
 #pagetop{position:fixed;right:0; bottom:0;z-index:500;display: none;}
   #pagetop:hover{opacity:1;cursor: pointer;}

/* header
------------------------------------------*/
#logo {transition: .9s cubic-bezier(.165,.84,.44,1);}

  .obfit img {width: 100%;height:100%;object-fit: cover; font-family: 'object-fit: cover; object-position: center;'}
  .ob-left img {object-position: 0 100%}
  .ob-right img {object-position: 100% 0}

  #header-menu {transition: 1s cubic-bezier(.165,.84,.44,1);}
    #header-menu.active {opacity: 0; transform:translateY(-2rem);}

  .loadshow {opacity: 0; transition: 1s;}
    .loadshow.open {opacity: 1;}
    #nav-header.open {transition-delay: .3s;}
    #copy.open {transition-delay: .4s;}
    #top-contact.open {transition-delay: .8s;}

  #menu {position: fixed; top: 0; right: -10%; height: 100%; z-index: -10; opacity: 0; visibility: hidden; transition: .9s cubic-bezier(.165,.84,.44,1);box-shadow: 15px 15px 20px 5px rgba(0, 0, 0, 0.8);}
    #menu.open {opacity: 1; z-index: 80; right: 0; visibility: visible;}
    #menu #menu-logo {opacity:0; transition: .5s cubic-bezier(.165,.84,.44,1);}
    #menu-logo a {position: fixed; top: 50%; left:16.5%; transform:translate(-50%,-50%)}
    #menu ul:before {content:""; position: absolute; top: 0; left: 0; width: 1px; height: 0; background: #FFF; transition: .9s cubic-bezier(.165,.84,.44,1);}
    #menu li {position: relative;}
    #menu .fade {margin-left: -.5rem; opacity: 0; transition: .5s cubic-bezier(.165,.84,.44,1);}
      #menu li:before {content:""; width: 0rem; height: 1px; background: #fff; position: absolute; left: 0; top: 40%; transition: 2s cubic-bezier(.165,.84,.44,1);}

    #menu.open ul:before {height:100%; transition-delay: .3s;}
    #menu.open #menu-logo {opacity: 1; transition-delay: .2s;}
    #menu.open #menu-1:before {transition-delay: .2s;}
    #menu.open #menu-2:before {transition-delay: .3s;}
    #menu.open #menu-3:before {transition-delay: .4s;}
      #menu.open #menu-1 li:before {width: 7rem; transition-delay: .5s;}
      #menu.open #menu-2 li:before {width: 7rem; transition-delay: .6s;}
      #menu.open #menu-3 li:before {width: 7rem; transition-delay: .7s;}
    @media(min-width:1200px){
      #menu.open #menu-1 li:before {width: 10rem;}
      #menu.open #menu-2 li:before {width: 10rem;}
      #menu.open #menu-3 li:before {width: 10rem;}
    }
    #menu.open #menu-1 .fade {opacity: 1; margin-left: 0; transition-delay: .5s;}
    #menu.open #menu-2 .fade {opacity: 1; margin-left: 0; transition-delay: .6s;}
    #menu.open #menu-3 .fade {opacity: 1; margin-left: 0; transition-delay: .7s;}

  #hd-menu li {position: relative;}
    #hd-menu li:before {content:""; width: 0; height: 1px; background: #000; position: absolute; left: 0; top: 50%; transition: 1s cubic-bezier(.165,.84,.44,1);}
    #hd-menu a {display: block; background: #FFF; position: relative; z-index: 1; }
    #hd-menu a div {opacity: 0; margin-left: -.5rem; transition: 1s;}

    #mv a,#mv img {opacity: 1!important;}
    #mv.open #hd-menu-1:before {width: 5rem; transition-delay: .5s;}
    #mv.open #hd-menu-2:before {width: 5rem; transition-delay: .6s;}
    #mv.open #hd-menu-3:before {width: 5rem; transition-delay: .7s;}
    #mv.open #hd-menu-4:before {width: 5rem; transition-delay: .8s;}
    #mv.open a div {opacity: 1; margin: 0;}
    #mv.open #hd-menu-1 a div {transition-delay: .6s;}
    #mv.open #hd-menu-2 a div {transition-delay: .7s;}
    #mv.open #hd-menu-3 a div {transition-delay: .8s;}
    #mv.open #hd-menu-4 a div {transition-delay: .9s;}


  /* menu-toggle */
  #menu-toggle {position: relative;z-index: 100; transition: .5s cubic-bezier(.165,.84,.44,1);}
    /*#menu-toggle {width: 3rem; height: 3rem; position: relative; cursor: pointer; border-radius:100%;z-index: 100; transition: .5s cubic-bezier(.165,.84,.44,1);}*/
    /*#menu-toggle.open {background: none;}
    #menu-toggle span {transition: .15s cubic-bezier(.165,.84,.44,1);box-sizing: border-box; display: block;background: #fff;border-radius: 1px;}
    #menu-toggle #hamburger {position: absolute;height: 100%;width: 100%;}
    #menu-toggle #hamburger span {height: 2px; width:3rem; position: relative; top:0rem; right:0rem;margin: .7rem 0 .7rem auto;}
    #menu-toggle #hamburger span:nth-child(1) {transition-delay: .5s;}
    #menu-toggle #hamburger span:nth-child(2) {transition-delay: .625s;}
    #menu-toggle #hamburger span:nth-child(3) {transition-delay: .75s;}
    #menu-toggle #cross {position: absolute;height: 100%;width: 100%;transform: rotate(45deg);}
    #menu-toggle #cross span:nth-child(1) {left: 1.7rem; height: 0%;width: 2px;position: absolute;top: 20%;transition-delay: 0s;}
    #menu-toggle #cross span:nth-child(2) {top: 1.7rem; width: 0%;height: 2px;position: absolute;left: 20%;transition-delay: .25s;}
    #menu-toggle.open #hamburger span {width: 0%;}
    #menu-toggle.open #hamburger span:nth-child(1) {transition-delay: 0s;}
    #menu-toggle.open #hamburger span:nth-child(2) {transition-delay: .125s;}
    #menu-toggle.open #hamburger span:nth-child(3) {transition-delay: .25s;}
    #menu-toggle.open #cross span:nth-child(1) {height: 80%;transition-delay: .625s;}
    #menu-toggle.open #cross span:nth-child(2) {width: 80%;transition-delay: .375s;}*/
    #menu-toggle.open #hamburger {display: none;}
    #menu-toggle #cross {display: none;}
    #menu-toggle.open #cross {display: block;}

  /* label */
  .p-gram {position: relative; z-index: 1;}
  .p-gram:before {position: absolute; top: 0; left: 0; z-index: -1; content:""; width: 100%; height: 100%; background: #000; -webkit-transform: skew(-20deg); -moz-transform: skew(-20deg); -o-transform: skew(-20deg);}
  .label-slash:after {content: ''; position: absolute; display: inline-block; width: 4rem; height: 1px; margin-left: -1rem; background-color: #949494; -webkit-transform: rotate(-40deg); transform: rotate(-40deg); }
  .col-stripe,.col-stripe:before {position: absolute; top: 0;  width: 100%; height: 100%;}
  .col-stripe {background: rgb(255,255,255); background: linear-gradient(-45deg, rgba(0,0,0,.2) 50%, rgba(0,79,84,0) 50%, rgba(0,0,0,0) 100%); z-index: 2; left:0;}
  .col-stripe.red {background: rgb(255,255,255); background: linear-gradient(-45deg, rgba(181,0,0,1) 50%, rgba(0,79,84,0) 50%, rgba(0,0,0,0) 100%); z-index: 2; left:0;}
  .col-stripe:before {content:""; background: linear-gradient(-45deg, rgba(255,255,255,1) 50%, rgba(0,79,84,0) 50%, rgba(0,0,0,0) 100%); z-index: 1; left:1px;}

  .balloon {position: relative;}
  .balloon:before {content: "";position: absolute;top: 100%;left: 50%;margin-left: -15px;border: 15px solid transparent;border-top: 15px solid #000;}

  /* hvr */
    .img-link img {-webkit-transform: scale(1);transform: scale(1); transition: .8s cubic-bezier(.165,.84,.44,1); opacity: 1!important;}
    .img-link:hover img,.img-link.hover img {-webkit-transform: scale(1.06); transform: scale(1.06);}
    .img-link2 img {-webkit-transform: scale(1);transform: scale(1); transition: 4s cubic-bezier(.165,.84,.44,1); }
    .img-link2:hover img,.img-link2.hover img {-webkit-transform: scale(1.06); transform: scale(1.06);}

    .hvr-a:hover {color: rgba(0,0,0,.8);}
    .a-line {position: relative; display: inline-block;}
      .a-line:after {content:"";  height:1px; background: #000; position: absolute; left: 0; bottom:-.2rem; animation: aline-out .2s ease forwards;}
      .hvr-a:hover .a-line::after, .a-line:hover::after, .hvr-a.active .a-line::after {left:auto;right: 0; animation: aline .2s ease forwards;}
      .hvr-a:hover .a-line, .a-line:hover, .hvr-a.active .a-line {opacity: .4;transition: .5s cubic-bezier(.165,.84,.44,1);}
      @keyframes aline {0% { width:100%;} 100% {width: 0%;}}
      @keyframes aline-out {0% {width:0%;} 100% {width: 100%;}}

    .a-line-r {position: relative; display: inline-block;}
      .a-line-r:after {content:"";  height:1px; background: #fff; position: absolute; right: 0; bottom:-.2rem; animation: aline-out-r .2s ease forwards;}
      .hvr-a:hover .a-line-r::after, .a-line-r:hover::after, .a-line-r.active::after {right:auto;left: 0; animation: aline-r .2s ease forwards;}
      @keyframes aline-r {0% { width:0%;} 100% {width: 100%;}}
      @keyframes aline-out-r {0% {width:100%;} 100% {width: 0%;}}

    .hvr-bg-blk:hover{background-color: #000 !important; color: #FFF!important;}
    .hvr-bg-wht:hover{background-color: #fff !important; color: #000!important;}
    .hvr-bc-blk:hover{border-color: #000!important;}

    .hvr-op-3:hover {opacity: 0.3!important;}
    .hvr-op-8:hover {opacity: 0.8!important;}

    .btn-share-twitter:hover{color:#55ACEE!important;}
    .btn-share-line:hover{color:#00C300!important;}
    .btn-share-facebook:hover{color:#3B5999!important;}

    .hvr-a.active {box-shadow: 0 0 0 0.3rem #ccc;}

    .hvr-text:hover{text-decoration: underline;}

/* parts
------------------------------------------*/
  .num-row {counter-reset: number 0; }
  .num-list {position: relative;}
  .num-list:after {counter-increment: number 1;content:"0" counter(number) " "; position: absolute; top: -.6rem; right:-.3rem; color: rgba(0,0,0,.15); font-size:1.5rem; font-weight: bold;}

  .question {position: relative;}
    .question:before {position: absolute; content:""; width: 2rem; height: 1px; background: #000; top: 50%; left: 0; transform:translateY(-50%);}

  .kakko-box {position: relative;}
    .kakko-box:before,.kakko-box:after{ content:'';width: 20px;height: 30px;position: absolute;display: inline-block; transition: 1.8s cubic-bezier(.165,.84,.44,1);transition-delay: .3s; opacity: 0;}
    .kakko-box:before{border-left: solid .1rem #000;border-top: solid .1rem #000;top:0;left: 0; transform:translate(2rem,2rem)}
    .kakko-box:after{border-right: solid .1rem #000;border-bottom: solid .1rem #000;bottom:0;right: 0; transform:translate(-2rem,-2rem)}
    .kakko-box.active:before,.kakko-box.active:after {transform:translate(0,0); opacity: 1;}

  .vision-line {position: relative;overflow: hidden; width: 100%;}
    .vision-line::after {content:""; position: absolute; top: -100%; left: 50%; width: .1rem; height: 100%; background: #000;transition: .8s cubic-bezier(.165,.84,.44,1);}
    .vision-line.active::after {top: 0;}


  .side-fixed {position: fixed!important; top: 40px;}
  .side-fixed.bottom {position: absolute!important; top: auto; bottom:0;}

/* ==========================================================================
animation
========================================================================== */

  /* text-ani */

  [class*="fadeSet"] {opacity: 0; transition: 1.8s cubic-bezier(.165,.84,.44,1);}
  [class*="fadeSet"].active {opacity: 1;}
  [class*="fadeSet"].ani-letter {letter-spacing: 5rem!important;}

  [class*="fadeSet"].sepa-tl::before {left: -3%;}
  [class*="fadeSet"].sepa-tl::after {left:3%;}
  [class*="fadeSet"].sepa-tl::before,[class*="fadeSet"].sepa-tl::after {transition: 1.8s cubic-bezier(.165,.84,.44,1);}
  [class*="fadeSet"].sepa-tl.active::before,[class*="fadeSet"].sepa-tl.active::after {left: 0%;}

  [class*="fadeSet"].slideUp {transform: translateY(3rem);}
  [class*="fadeSet"].slideLeft {transform: translateX(3rem);}
  [class*="fadeSet"].slideRight {transform: translateX(-3rem);}
  [class*="slide"][class*="fadeSet"].active {transform: translate(0rem,0rem);}

  [class*="fadeSet"].scaleUp {transform:scale(.5);}
  [class*="fadeSet"].scaleDown {transform:scale(1.5);}
  [class*="scale"][class*="fadeSet"].active {transform:scale(1);}

  [class*="fadeSet"].scaleRotate {transform:scale(.5) rotate(-20deg);}
  [class*="fadeSet"].scaleRotate.active {transform:scale(1) rotate(0deg);}

  #top-banner [class*="tbLoad-"] {opacity: 0; transition: 1.5s cubic-bezier(.165,.84,.44,1);}
  #top-banner.active [class*="tbLoad-"] {opacity: 1;}
  #top-banner .tbLoad-0 {transform: translateX(3rem);}
  #top-banner .tbLoad-1,#top-banner .tbLoad-4 {transform: translateX(-3rem);}
  #top-banner .tbLoad-2,#top-banner .tbLoad-3 {transform: translateY(3rem);}
  #top-banner .tbLoad-5,#top-banner .tbLoad-6,#top-banner .tbLoad-7 {transform: translateY(-1rem);}
  #top-banner .tbLoad-2 {transition-delay: .2s;}
  #top-banner .tbLoad-3 {transition-delay: .4s;}
  #top-banner .tbLoad-4 {transition-delay: .6s;}
  #top-banner .tbLoad-5 {transition-delay: 1s;}
  #top-banner .tbLoad-6 {transition-delay: 1.2s;}
  #top-banner .tbLoad-7 {transition-delay: 1.4s;}
  #top-banner.active [class*="tbLoad-"] {transform: translate(0rem);}

  .fadeLeft {transform: translate(-3rem,-3rem);}
  .fadeRight {transform: translate(3rem,3rem);}
  .fadeLeft.active,.fadeRight.active {transform: translate(0rem,0rem);}

  /* delay */
  .delay-01 {transition-delay: .1s;}
  .delay-02 {transition-delay: .2s;}
  .delay-03 {transition-delay: .3s;}
  .delay-04 {transition-delay: .4s;}
  .delay-05 {transition-delay: .5s;}
  .delay-06 {transition-delay: .6s;}
  .delay-07 {transition-delay: .7s;}
  .delay-08 {transition-delay: .8s;}
  .delay-08 {transition-delay: .8s;}
  .delay-1 {transition-delay: 1s;}
  .delay-015 {transition-delay: 1.5s;}
  .delay-2 {transition-delay: 2s;}
  .delay-3 {transition-delay: 3s;}

  /* duration */
  .duration-05 {transition-duration: .5s;}
  .duration-1 {transition-duration: 1s;}
  .duration-015 {transition-duration: 1.5s;}
  .duration-2 {transition-duration: 2s;}
  .duration-3 {transition-duration: 3s;}


/* ==========================================================================
wp plugin
========================================================================== */
  .wp-pagenavi,.wp-pagenavi * {display: inline-block;}
  .wp-pagenavi {font-family: DINNextLTPro-MediumCond; border-right:2px solid #000; font-size: 1.5rem;}
  .wp-pagenavi .current,.wp-pagenavi a, .wp-pagenavi .extend {padding:.2rem 1rem .1rem!important; margin: 0rem!important; border:2px solid #000!important; background: #FFF!important; border-right: none!important;}
  .wp-pagenavi .current {font-weight: 500!important; color: #aaaaaa!important;}
  .wp-pagenavi .pages {display: none; border: none; font-size: 1.5rem; margin-right:.5rem;}
  .wp-pagenavi a { -webkit-transition: .3s;transition: .3s;}
  .wp-pagenavi a:hover {color: #FFF!important; background: #000!important;}

  #pager a {display: block; width: 100%; padding:.5rem 0 ;}


/* ==========================================================================
plugin
========================================================================== */


/* mv */
  .mv-txt {opacity: 0; transform:translateY(2rem); transition: 1s cubic-bezier(.165,.84,.44,1); transition-delay: 1s;}
  .slick-active .mv-txt {opacity: 1; transform:translateY(0rem);}

/*! slick */
.slick-slide {outline: none!important;}
.slick-dots {position: relative !important; top:-3rem; bottom: 0; line-height: 1; z-index:1;}
.loop-dots .slick-dots {top:0rem;}
  .slick-dots li{margin: 0 !important;}
.slider-nav button{background: none;}
.slider-nav .slick-current button{color: #19b7bd;}
.slick-dotted.slick-slider {margin-top: 0!important; margin-bottom: 0!important;}
.slick-dots li.slick-active button:before {opacity: 1!important;}

.mv-arrows {position: absolute; bottom: 1.5rem; width: 100%; z-index: 90;}
  .mv-arrows .slide-prev,.mv-arrows .slide-next {background: none; position: absolute;}
  .mv-arrows .slide-prev {left:5rem;}
  .mv-arrows .slide-next {right:5rem;}

.arrows {position: absolute; bottom: 1.5rem; width: 100%;}
  .arrows .slide-prev,.arrows .slide-next {background: none; position: absolute;}
  .arrows .slide-prev {left:-.5rem;}
  .arrows .slide-next {right:-.5rem;}

.env-arrow {
  display: inline-block;
  height: 50px;
  width: 100px;
  background-color: #eb804d;
  position: relative;
}
.env-arrow:before {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border: 100px solid transparent;
    border-top: 50px solid #eb804d;
    left: -50px;
    top: 50px;
}

button:hover {
  transition: all 0.5s;
}

  @media(min-width: 576px){
    .arrows {bottom: auto; top: 50%;}
    .arrows .slide-prev {left:-1.6rem;}
    .arrows .slide-next {right:-1.6rem;}
    #slide .slick-list {border: 1.5rem solid #fff;}
  }

#slide .slick-slide {opacity: 0.2; transition: .8s cubic-bezier(.165,.84,.44,1);}
#slide .slick-current {opacity: 1;}
#slide .slick-list {border: 1rem solid #fff;}


.slide-animation picture{animation: fadezoom 14s 0s forwards;}


@keyframes fadezoom {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.16);
  }
}