#banner{position:relative;overflow: hidden;}
#banner .btn{position:absolute;bottom: 0;padding: 0;height: 100%;display: flex;flex-direction: column;justify-content: center;left: 10%;align-items: center;}
#banner .btn:after{content:'';position: absolute;background: #fff;width: 1px;height: 100%;z-index: 0;opacity: .2;}
#banner .btn a{margin:10px 0;position: relative;z-index: 2;}
#banner .more_btn b, ＃#banner .more_btn{border-color:rgb(255 255 255 / 30%)}
#banner .more_btn{position:relative;z-index: 5;}
#banner_box , #banner_box .item , #banner_box .img_box { position: relative; min-width: 100vw; }
#banner_box .img_box img {width: 100vw;height: 90vh;}
#banner_box .info_box *{opacity:0;-webkit-transform:translateY(15px);transform:translateY(25px)}
#banner .slick-current .info_box *{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px);transition-delay:.6s;-webkit-transition-delay:.6s;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;-webkit-transform:translateX(0) scale(1);transform:translateX(0) scale(1);opacity:1;-webkit-transition:-webkit-transform 0.8s linear 0.5s,opacity 0.8s linear 0.5s;transition:transform 0.8s linear 0.5s,opacity 0.8s linear 0.5s}
#banner_box .slick-current .info_box em{-webkit-animation:tracking-in-expand .7s cubic-bezier(.215,.61,.355,1.000) both;animation:tracking-in-expand .7s cubic-bezier(.215,.61,.355,1.000) both}
@-webkit-keyframes tracking-in-expand{0%{letter-spacing:-.5em;opacity:0}40%{opacity:.6}100%{opacity:1}}@keyframes tracking-in-expand{0%{letter-spacing:-.5em;opacity:0}40%{opacity:.6}100%{opacity:1}}
#banner_box .info_box , #banner_box .atag_item { position: absolute; }
#banner_box .info_box{bottom:0;width: 100%;height: 100%;display: flex;justify-content: flex-start;align-items: center;flex-direction: column;top: 50%;left: 50%;transform: translate(-50%, -50%);padding: 100px 0 0;}
#banner_box .info_box em{font-family: "Lato", sans-serif;font-size: 100px;font-weight: 900;letter-spacing: 9px;font-style: unset;color: var(--primary);text-transform: uppercase;line-height: 130%;}
#banner_box .info_box h2{font-size: 28px;word-spacing: 100vw;font-weight: 800;letter-spacing: 3px;margin: 20px 0 20px;line-height: 90%;}
#banner_box .info_box p{color: #181616;font-size: 34px;letter-spacing: 6px;margin-bottom: 60px;line-height: 2;font-weight: 600;}
#banner_box .slick-dots { bottom: 20px; }
#banner_box .slick-dots li { opacity: .2; display: inline-flex; justify-content: center; align-items: center; }
#banner_box .slick-dots li.slick-active { opacity: 1; }
#banner_box .slick-dots li button { width: 10px; height: 10px; background: var(--info); border-radius: 50%; box-shadow: 0 0 5px #fff; }
#banner_box .slick-dots li button:before { content: ""; }
#banner video{position: absolute;width: 100%;height: auto;top: -50px;left:0;}
#banner #scrollDown{cursor:pointer;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-align:center;align-items:center;position:absolute;z-index:2;bottom: 6%;left: 50%;transform: translate(-50%, 0%);}
#banner .upDown{width:100%;height: 100%;bottom: 0;left: 0;z-index: 2;position: absolute;}
#banner #scrollDown span.text{display:block;color: var(--g_charcoal);letter-spacing:0.5px;font-size: 15px;font-family:"Lato", sans-serif;text-transform: uppercase;}
#banner #scrollDown span.scrollBtn{width:25px;height:44px;border-radius:12.5px;background-color: rgb(26 77 162 / 70%);position:relative;overflow:hidden;margin-bottom:12px}
#banner #scrollDown:hover span.scrollBtn:after{top:65%;width:7px;height:7px;}
#banner #scrollDown span.scrollBtn{position:absolute;right:0;background: rgb(163 163 163 / 50%);background-size:cover;background-repeat:no-repeat;width:1px;height: 80px;top: 150%;left:50%;transform:translate(-50%,0%);overflow:hidden}

#banner #scrollDown span.scrollBtn:after{content:"";position:absolute;top:-10px;right:0;z-index:1;width:1px;height: 70px;background: #7c7c7c;background-size:cover;background-repeat:no-repeat;animation:scrollarrow1 2.8s cubic-bezier(.86,0,.07,1) infinite;-webkit-animation:scrollarrow1 2.8s cubic-bezier(.86,0,.07,1) infinite}
@keyframes scrollarrow1{0%{transform:translateY(-150%)}
50%{transform:translateY(0%)}
to{transform:translateY(500%)}
}
@-webkit-keyframes scrollarrow1{0%{-webkit-transform:translateY(-150%)}
50%{-webkit-transform:translateY(0%)}
to{-webkit-transform:translateY(500%)}
}
.page-scroll.style01 a span{position:absolute;right:0;background: rgb(255 255 255 / 70%);background-size:cover;background-repeat:no-repeat;width:1px;height: 200px;top: 180%;left:50%;transform:translate(-50%,0%);overflow:hidden}
#banner .bannerImgBox{width:100%;height:100%;margin:auto;position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}
#banner .bannerImgBox .img{position:absolute;width: auto;bottom: 0;}
#banner .bannerImgBox .img img{min-width:auto;height:auto;width:auto;background:none}
#banner .bannerImgBox .bannerBg-green{z-index: 1;left: 58%;animation: treeSwing 8s 0.1s both alternate infinite;}
@keyframes treeSwing { 0% { transform: rotate(0)}
20% { transform: rotate(5deg)}
40% { transform: rotate(-5deg)}
60% { transform: rotate(3deg)}
100% { transform: rotate(-3deg)}
}
#banner .bannerImgBox .bannerBg-white:before {width: 297px;height: 91px;background-image: url(/images/01/img_bn_BG_03.png);background-size: contain;background-repeat: no-repeat;display: block;content: "";animation: runAnimation 20s linear infinite;top: 0;position: absolute;}


@keyframes runAnimation {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(850%);
  }
}
@media screen and (max-width: 1366px){
	#banner .btn{left:5%;}
	#banner_box .info_box em{font-size: 60px;}
    #banner_box .info_box p{font-size: 28px;}
}
@media screen and (max-width: 1280px){
	#banner_box .img_box img {height: 85vh;}
}
@media screen and (max-width: 1160px){
	#banner_box .info_box{padding: 70px 0 0;}
	#banner .btn{display: none;}
}
@media screen and (max-width: 980px){
	#banner video{width: auto;height: 100%;top: 0;}
    #banner #scrollDown{display:none;}
	#banner_box .info_box p{margin-bottom: 20px;font-size: 24px;letter-spacing: 3px;}
	#banner_box .img_box img {height: 65vh;}
	#banner_box .info_box em{font-size: 37px;letter-spacing: 6px;}
    #banner .bannerImgBox .bannerBg-white:before{width: 167px;height: 91px;}
    #banner .bannerImgBox .bannerBg-green{left: 68%;}
	#banner_box .item{display:flex;flex-direction: column;}
}
@media screen and (max-width: 640px){
	#banner video{left: -50px;}
	#banner_box .info_box p{font-size:16px;}
	#banner_box .info_box h2{font-size: 25px;}
	#banner_box .info_box{padding: 30px;}
	#banner_box .img_box img {height: 46vh;}
    #banner .bannerImgBox .bannerBg-white:before{width: 117px;height: 81px;}
}