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

.slideConts {
  -webkit-transition: .8s;
  -o-transition: .8s;
  transition: .8s;
}
}
.slideContsL {
  transform: translate(-2000px, 0);
}
.slideContsR {
  transform: translate(2000px, 0);
}
.slideContsL.show {
  transform: translate(0, 0) !important;
}
.slideContsR.show {
  transform: translate(0, 0) !important;
}
.siideDelay01{transition-delay : .5s;}
.siideDelay02{transition-delay : .6s;}
.siideDelay03{transition-delay : .7s;}


.slideTxt{ opacity:0;}
.fade-in{ 
　opacity:0;
  animation-name:sample01;
  animation-duration:.6s; 
  animation-fill-mode: forwards;
}
@keyframes sample01 {
0% {
 opacity: 0;
transform: translateX(-20px);
}
 100% {
 opacity:1;
 transform: translateX(0);
 }
}
.slideTxt01{animation-delay : .7s;}
.slideTxt02{animation-delay : .8s;}
.slideTxt03{animation-delay : .9s;}
.slideTxt04{animation-delay : 1s;}
.slideTxt05{animation-delay : 1.1s;}
.slideTxt06{animation-delay : 1.3s;}

.slideFade{ opacity: 0;}



body:not(.access) .cap img{opacity: 0;animation:2s fadeInCopy01 forwards; animation-delay: 0.6s;animation-iteration-count: 1;}
body:not(.access) .cap02{opacity: 0;animation: 1s fadeInCopy01 forwards; animation-delay: 1.2s;animation-iteration-count: 1;}
body:not(.access) .scrollBtn{opacity: 0;animation: 2s fadeInCopy01 forwards; animation-delay: 2.8s;animation-iteration-count: 1;}
body:not(.access) .headerWrap:after{ opacity: 1; animation: 2s fadeInBorderBottom forwards; animation-delay: 2.2s; overflow: hidden;animation-iteration-count: 1;}
body.access .headerWrap:after{opacity: 0.4;}
body:not(.access) #header{ opacity: 0;animation: 2s fadeInHeader forwards; animation-delay: 2.8s; animation-iteration-count: 1;}
.headerSub #header{ opacity: 1; animation: none;}
/* .spLanMenu{opacity: 0;animation: 2s fadeInCopy01 forwards; animation-delay: 2.8s;animation-iteration-count: 1;} */
.spLanMenu.spLanMenuSub{ opacity: 1; animation: none;}

.fadeUp{animation: 2s fadeIn forwards; animation-delay: 2.8s;animation-iteration-count: 1;}



@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1.0; }
}
@keyframes fadeInTop{
  from { opacity: 0; transform: matrix(1.1, 0, 0, 1.1, 0, 0);}
  to { opacity: 1.0; transform: matrix(1, 0, 0, 1, 0, 0);}
}
@keyframes fadeInBorderTop {
  from { opacity: 0; transform: translate(0, -50px);}
  to { opacity: 1.0; transform: translate(0,0);}
}
@keyframes fadeInBorderBottom {
  from { opacity: 1.0; transform: translate(0,0);}
  to { opacity: 0.4; transform: translate(0,0);}
 }
 @keyframes fadeInHeader {
  from { opacity: 0; transform: translate(0, 0);}
  to { opacity: 1.0; transform: translate(0,0);}
 }
@keyframes fadeInCopy01 {
  from { opacity: 0; }
  to { opacity: 1.0;}
 }