/* banner */
#banner {padding: 100px 0 0;width: 100vw;z-index: 5;}
#banner:before{content: '';background-image: url(/images/44/banner-bot.png);position: absolute;background-size: contain;background-repeat: no-repeat;width: 100%;height: 130px;bottom: -40px;right: 0;z-index: 2;}
#banner .item {height: 90vh;}
#banner .main-slider { }
#banner .item .clip >* { min-width: 100vw; width: 100vw; }
#banner .item .clip:before{content:'';width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: linear-gradient(90deg, var(--primary) 25%, hsl(160deg 32.31% 25.49% / 0%));z-index: 2;}
#banner .item .clip .bgBox { }
#banner .item .clip iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
#banner .item .clip video {overflow: hidden;position: absolute;width: 100%;height: auto;top: 50%;left: 70%;transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);}
#banner .item .info{z-index:5}
#banner .item .info >div {margin: auto;width: calc(85% - 100px);}
#banner .item .info >div .txt >* {font-size: 20px;color: var(--secondary);font-weight: 400;letter-spacing: 2px;}
#banner .item .info >div .txt p{font-size: 58px;font-weight: bold;letter-spacing: 4px;margin: 15px 0 25px;color: #fff;word-spacing: 100vw;line-height: 120%;}
#banner .item .info >div .txt h3 {margin-bottom: 15px;line-height: 160%;font-size: max(4 * (1vw + 1vh) / 2, 35px);width: 29%;}
#banner .item .info >div .txt article{margin-bottom: 60px;}

.headline{width: 40%;}
.text-js{opacity:0;font-size: 30px;color: var(--white);font-weight: 500;text-transform: uppercase;line-height: 1.6;letter-spacing: 2px;}

#banner .more_btn{color:#fff;}
#banner .more_btn b{border-color:#fff;}
#banner .more_btn:hover b{background:#fff}
#banner .more_btn svg{fill:#fff;}
#banner .more_btn:hover svg{fill:var(--secondary)}
#banner .more_btn:after{background: var(--white);}

@media screen and (max-width: 1440px){
	#banner:before{}
}
@media screen and (max-width: 1280px){
	#banner:before{zoom: 100%;bottom: -50px;}
	.headline{width:50%;}
	#banner { padding-top: 70px; }
	#banner .item{
    height: 80vh;
}
	#banner .item .info >div .txt p{font-size:27px;}
}
@media screen and (max-width: 1024px){
	#banner .item { height: 65vh; }
	#banner:before{
    display: none;
}
}
@media screen and (max-width: 980px){
	#banner .item .info >div .txt >*{font-size:15px;}
	#banner .item .info >div{width: calc(95% - 60px);}
}
@media screen and (max-width: 768px){
	#banner{z-index:1}
	#banner .item { height: 80vh; }
	#banner .item .clip video{-webkit-transform: unset;top: 0;left: -70%;width: auto;height: 100%;}
	#banner .item .info >div{margin-bottom: 15%;}
	#banner .item .info >div .txt p{font-size: 25px;margin: 0 0 5px;line-height: 1.5;letter-spacing: 0;}
	#banner .item .info >div .txt article{margin-bottom: 20px;}
	#banner .item .clip:before{background: linear-gradient(0deg, var(--primary) 25%, hsl(160deg 32.31% 25.49% / 0%));}
	.headline{width:100%;}
	#banner:before{content:url(/images/44/banner-bottommb.png);zoom: 80%;bottom: -120px;}
	.text-js{
    word-spacing: 100vw;
    line-height: 1.3;
    margin-bottom: 10px;
}
}