#banner{position: relative;z-index: 100;margin-top: 100px;padding: 0px 110px;}
#banner .item {overflow: hidden;position: relative;background: #fff;z-index: 100;border-radius: 50px;}
#banner .item a {background: rgb(85 184 187);display: flex;align-items: center;padding: 15px 20px;color: #fff;font-size: 25px;gap: 10px;border-radius: 50px;letter-spacing: 1px;}
#banner .item a:hover{background: rgb(231 144 53);}
#banner .item .info-btn {display: flex;flex-direction: column;width: fit-content;gap: 15px;margin-top: 15px;}
#banner .info {position: absolute;width: 35%;top: 30vh;left: 150px;z-index: 3;}
#banner .info >* { -webkit-transition-duration: .5s; -moz-transition-duration: .5s; -ms-transition-duration: .5s; -o-transition-duration: .5s; transition-duration: .5s; }
#banner .info h3 {display: block;line-height: 1.3;text-align: left;font-size: max(3.5 * (1vw + 1vh) / 2, 26px);font-weight: 600;color: #121212;-webkit-transform: translateY(-30px);transform: translateY(-30px);opacity: 0;word-spacing: 100vw;}
#banner .info h3.c-primary{color: #55b8bb;margin-bottom: 10px;}
#banner .info article{margin-bottom: 5px;font-size: 22px;letter-spacing: 4px;}
#banner .info span,#banner .info p {text-align: left;line-height: 160%;font-weight: 400;font-size: 20px;color: #121212;}
#banner .img { position: relative; width: 100vw; height: 100vh; background: no-repeat 50% / cover; }
#banner .img video , #banner .img iframe { position: absolute; width: 100vw; height: 100vh; top: 0; left: 0; }

#banner .slick-active .img { -webkit-transform: scale(1); transform: scale(1); animation: banerBg 6s infinite linear; -webkit-animation: banerBg 6s infinite linear; }
#banner .slick-active .info >* { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#banner .deco1{position:absolute;left: 0;bottom: -18%;z-index: -1;}

/* scrollBtn */
#scrollBtn {position: absolute;align-items: center;letter-spacing: .3em;font-weight: 300;font-size: 12px;color: #000;left: 4%;white-space: nowrap;transform: rotate(90deg);transform-origin: top left;display: flex;bottom: 30%;padding: 0px 10px;animation: godown 1s infinite linear;-webkit-animation: godown 1s infinite linear;text-transform: uppercase;z-index: 10;flex-direction: row-reverse;}
#scrollBtn span{font-size: 16px;font-weight: 400;padding: 13px;letter-spacing: 2px;}
#scrollBtn::after {content: "";width: 130px;height: 1px;display: block;background: #000;margin: 0px 0px;}

@-webkit-keyframes godown { 0% , 100% { padding: 0 0 0px 0px; } 50% { padding: 0px 0 0px 0px; } }
@keyframes godown { 0% , 100% { padding: 0px 0 0px 0px; } 50% { padding: 0px 0 0px 10px; } }

@-webkit-keyframes banerBg { 0% { -webkit-transform: scale(1); } 100% { -webkit-transform: scale(1.1); } }
@keyframes banerBg { 0% { transform: scale(1); } 100% { transform: scale(1.1); } }
@media screen and (max-width: 1470px){
	#banner{padding: 0px 67px;}
}
@media screen and (max-width: 1280px){
	#banner{padding: 0;margin-top: 0;}
	#banner .item{border-radius:0;}
	#scrollBtn{display:none;}
	#banner .deco1{display:none;}
}
@media screen and (max-width: 768px){
	#banner .item .img{height: 70vh;background-position: 75% 50%;}
	#banner .item:before{content:'';position: absolute;width: 100%;height: 100%;top: 0;background: linear-gradient(0deg, rgb(255 255 255 / 30%), rgb(255 255 255 / 60%));z-index: 1;}
	#banner .info{width: calc(100% - 80px);left: 40px;top: unset;bottom: 10%;}
	#banner .item a, #banner .info p, #banner .info span, #banner .info article{font-size: 16px;letter-spacing: 0;}
    #banner .item a{font-size:14px;}
    #banner .item .info-btn{gap: 8px;}
}