
#banner{padding-top:70px;z-index:3;position:relative;margin:0 30px;height:100%;width:-webkit-calc(100% - 70px);width:calc(100% - 60px)}
#banner .img{overflow:hidden;display:inline-block;position:relative;border-radius:70px}
#banner img{position:relative}
#banner .pos_abs{width:100vw;min-width:100vw;top:0;left:0}
#banner .info{padding-bottom:8vh;padding-top:100px}
#banner .info .txt *{color:var(--primary);opacity:0;-webkit-transform:translateY(15px);transform:translateY(25px)}
#banner .info .txt em{font-family:'Poppins',sans-serif;font-style:initial;margin-bottom:15px;letter-spacing:0.5px;font-weight:300}
#banner .info .txt h3{display:flex;flex-direction:column;align-items:center;font-weight:400;font-size:26px;letter-spacing:1.5px}
#banner .info .txt h3 b{letter-spacing:2px;font-size:64px;text-align:center;line-height:120%;font-weight:700;text-transform:uppercase;position:relative;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;animation:fadeIn 1s both;-webkit-animation:fadeIn 1s both}
#banner .slick-current .info .txt *{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px);transition-delay:.3s;-webkit-transition-delay:.3s;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#banner .info .txt{transition:all 0.7s ease;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:row;-webkit-box-pack:center;justify-content:space-between;z-index:2;align-items:flex-start;width:88%;display:flex}
#banner .info .txt h3,#banner .info .txt p{color:var(--primary);opacity:0;-webkit-transform:translateY(15px);transform:translateY(25px)}
#banner .info .txt article{text-align:center;font-family:'Roboto',sans-serif;font-size:22px;font-weight:600;text-transform:uppercase}
#banner .info .txt .bntoptitle{display:flex;align-items:flex-end}
#banner .info .txt p{font-weight:600;font-size:18px;display:flex;flex-direction:column;align-items:flex-start;text-transform:uppercase;font-family:'Archivo',sans-serif}
#banner .info .txt p:nth-child(2){padding:0 0 15px 10px;width:190px;text-align:justify;display:flex;align-items:flex-start;justify-content:space-around;align-content:space-between}
#banner .info .txt p font{font-weight:600;font-size:110px;letter-spacing:5px;line-height:110%;text-align:center;font-family:'Archivo',sans-serif}
#banner .info .txt p font:first-child{background:linear-gradient(to top left,var(--primary),var(--secondary));background-clip:text;-webkit-background-clip:text;color:transparent}
#banner .info .txt p font b{font-weight:500;font-size:36px;vertical-align:baseline;color:#90c31f}
#banner .info .txt .bannerBtn{opacity:0;margin-top:40px;display:block;width:220px;height:50px;pointer-events:auto;display:none}
#banner .info .txt .bannerBtn a{position:relative;color:#fff;display:block;width:100vw;min-width:100vw;letter-spacing:0.5px;overflow:hidden}
#banner .info .txt .bannerBtn .btnText:hover{color:#000}
#banner .info .txt .bannerBtn .btnText:hover::before{background-color:#eee}
#banner .info .txt .bannerBtn .btnText:hover span::before{border-color:transparent transparent transparent #000}
#banner .info .txt .bannerBtn .btnText:hover span::after{background-color:#000}
#banner .info .txt .bannerBtn .btnText::before{content:"";position:absolute;top:0;right:0;width:100vw;min-width:100vw;border:1px solid #fff;-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
#banner .info .txt .bannerBtn .btnText{position:relative;height:50px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0px 25px;z-index:1;font-family:'Poppins',sans-serif;text-transform:uppercase;text-align:center;justify-content:center;font-size:13px;font-weight:400}
#banner .info .txt .bannerBtn span{position:absolute;top:50%;right:-5px;width:45px;-webkit-animation:btnArrow 1s cubic-bezier(0.4,0,0.6,1) infinite;animation:btnArrow 1s cubic-bezier(0.4,0,0.6,1) infinite}
#banner .info .txt .bannerBtn span::after{content:"";position:absolute;top:30%;left:0;margin-top:-1px;width:calc(100% - 5px);height:1px;background-color:#fff;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
#banner a.pos_abs{z-index:2}

/* slick-current */
#banner .slick-current .info .txt *{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px);transition-delay:.3s;-webkit-transition-delay:.3s}
#banner .slick-current .info .txt p{transition-delay:.6s;-webkit-transition-delay:.6s;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;animation:fadeIn 1s both;-webkit-animation:fadeIn 1s both}
#banner .slick-current .info .txt *{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px);transition-delay:.3s;-webkit-transition-delay:.3s;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}

/* arrow_bg */
#banner .arrow_bg{width:450px;height:140px;left:auto;bottom:-140px;transform-origin:100% 100% 0;display:none}
.page-scroll{-webkit-transform:translateY(-50%);display:inline-block;position:absolute;top:0;right:100px;width:176px;height:176px;transform:translateY(-50%);border-radius:50%;background-color:#fff;-webkit-transform:translate(-1px,-1px);position:absolute;top:31.5%;left:84%;transform:translate(-1px,-1px)}
.page-scroll .btn-radius-left{-webkit-transform:translate(1px,-1px);position:absolute;top:50%;right:100%;transform:translate(1px,-6px)}
.page-scroll .btn-radius-right{-webkit-transform:translate(-1px,-1px);position:absolute;top:50%;left:100%;transform:translate(-3px,-3px)}
#scrollBtn{-webkit-transform:translate(-50%,-50%) scale(.85);display:inline-block;position:absolute;top:50%;left:50%;width:100%;height:100%;transform:translate(-50%,-50%) scale(.85);border-radius:50%;background:linear-gradient(to top left,var(--primary),var(--secondary));transition-duration:.5s;transition-timing-function:cubic-bezier(.165,.84,.44,1)}
#scrollBtn .btn-arrow{-webkit-transform:translate(-50%,-50%);-webkit-animation:arrow_down 3s linear 0s infinite;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);animation:arrow_down 3s linear 0s infinite}
#scrollBtn .btn-arrow path{fill:#fff}
@-webkit-keyframes arrow_down{0%{margin-top:-10px;opacity:0}
20%{margin-top:0;opacity:1}
70%{margin-top:0;opacity:1}
to{margin-top:10px;opacity:0}
}@keyframes arrow_down{0%{margin-top:-10px;opacity:0}
20%{margin-top:0;opacity:1}
70%{margin-top:0;opacity:1}
to{margin-top:10px;opacity:0}
}


@media screen and (max-width: 1440px) {
	.page-scroll{top: 38%;left: 80%;width: 120px;height: 120px;}
}

@media screen and (max-width: 1280px) {
	#banner .info .txt p font{font-size: 66px;}
}

@media (max-width: 1180px) {
	#banner .info .txt h3{margin-top: 20px;}
	#banner .info .txt{display: flex;flex-direction: column;align-items: flex-start;width: 100%;}
	#banner .img{border-radius: 26px;}
	#banner img {height: 50vh;}
	#banner .info .txt p:nth-child(2) {padding: 0 0 5px 20px;font-size: 14px;line-height: 130%;width: 150px;}
}



@media screen and (max-width: 960px) {
	#banner .info {padding-bottom: 3vh;padding-top: 40px;}
	.page-scroll{top: 32%;left: 76%;}
}

@media screen and (max-width: 560px) {
	#banner .info .txt p font{font-size: 40px;letter-spacing: 3px;}
	#banner .info .txt p:nth-child(2){width: 150px;}
	#banner .info .txt h3{font-size: 19px;}
	.page-scroll{top: 34%;left: 67%;width: 80px;height: 80px;}
}

@media screen and (max-width: 420px) {
	#banner .info .txt p font{font-size: 36px;letter-spacing: 3px;}
	#banner .info .txt p:nth-child(2){width: 110px;}
	#banner .info .txt h3{font-size: 18px;margin-top: 15px;}
	.page-scroll{top: 33%;left: 66%;width: 80px;height: 80px;}
}
