@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&family=Marcellus&family=Poppins&display=swap');

.inner{width:1720px;margin:0 auto;}

.tit-zone h3{font-family: "Archivo";font-size:3.5rem;color:#333333;font-weight:bold;}
.tit-zone p{font-size:1.1rem;color:rgba(102,102,102,0.8);font-weight:500;margin-top:2rem;line-height:1.3;}
.tit-zone  .char{opacity:0;}
.active .tit-zone  .char{-webkit-animation: text-active-animation-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation: text-active-animation-up 0.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: calc(0.1s + (var(--char-index) - 1) * 0.03s);}

.visual{height:100vh;position:relative;}

@media (max-width:1720px){
	.inner{width:100%;padding:0 1rem;}
}
@media (max-width:1500px){
	.tit-zone h3 {font-size:3rem}
}
@media (max-width:1030px){
	 .tit-zone h3 {font-size:2.75rem;}
}

/*스크롤바*/
.scroll {position:absolute;left:50%;bottom:0;transform:translateX(-50%);color:rgba(255,255,255,0.6);font-weight:bold;font-size:12px;text-align:center;padding-bottom:3.5rem;}
.scroll span{width:3px;height:3rem;background:rgba(255,255,255,0.5);display:inline-block;position:absolute;left:50%;bottom:0;transform:translateX(-50%);}
.scroll span:after{content:'';display:block;position:absolute;width:3px;height:1.25rem;background:#2a9863;left:0;top:0;animation: scroll 2s ease-in-out infinite;}
@keyframes scroll {
    0% {
        top: 0; /* 초기 위치 */
    }
    50% {
        top: calc(3rem - 1.25rem); /* 아래로 이동 */
    }
    100% {
        top: 0; /* 다시 원래 위치로 */
    }
}



/*메인 비주얼*/
.slick-list,
.slick-track{height: 100% !important;}
.visual{ position:relative; overflow:hidden;}
.visual-wrap {width: 100%; height: 100%;}
.visual-item {width: 100%; height: 100%; overflow:hidden; position:relative;}
.visual-item:before {content:''; display:inline-block; vertical-align:middle; width:0; height:100%; font-size:0;}
.visual-inner {position:relative; display: flex; width: 1600px; margin: 0 auto; color:#fff; z-index:10;padding-top:4.5rem;}
.visual-inner .ptext {position:relative; width: 100%;text-align:center;}
.visual-inner .ptext .txt{font-size:1.2rem; font-weight: 600; color:#fff;  margin-top:1.5rem;text-shadow: 3px 0px 20px rgb(0 0 0 / 40%);}
.visual-inner .ptext .tit{font-size:3.5rem; font-weight: 600; color:#fff; line-height: 1.22; text-shadow: 3px 0px 20px rgb(0 0 0 / 40%);font-weight:800;}
@media (max-width:1030px){
    .visual-inner .ptext .tit{font-size:2.5rem;}
	
}

/* 메인 비주얼 :: 텍스트 :: active효과 */
.visual-inner .ptext .word-split.splitting .word{overflow:visible;}
.visual-inner .ptext .word-split.splitting .char{animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.slick-current .visual-inner .ptext .word-split.splitting .word{}
.slick-current .visual-inner .ptext .word-split.splitting .char{animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation-delay: calc(0.3s + (var(--char-index) - 1) * 0.03s);}
@keyframes text-fade-out {
    from {
        opacity:1.0;filter:Alpha(opacity=100);
    }
    to {
        opacity:0;filter:Alpha(opacity=0);
    }
}
@keyframes text-active-animation {
    from {
        opacity:0;filter:Alpha(opacity=0);
        -webkit-transform: translateX(50px);
        transform: translateX(50px);
    }
    to {
        opacity:1.0;filter:Alpha(opacity=100);
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
@keyframes text-active-animation-up {
    from {
        opacity:0;filter:Alpha(opacity=0);
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
    }
    to {
        opacity:1.0;filter:Alpha(opacity=100);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}


/*메인 페이징바*/
.page-wrap{position: absolute; display: flex; flex-direction: column; align-items: center;  top:35%; overflow: hidden; z-index: 10; width:1600px;left:50%;transform:translateX(-50%);}
.page_num{width:9.2rem;}
.num-wrap{display: flex; align-items: center; justify-content: space-between; position: relative; margin-bottom:1rem;}
.page_num .prev{margin-right:.5rem; cursor:pointer;}
.page_num .next{margin-left:.5rem; cursor:pointer;}
.page_num .prev img,
.page_num .next img{width:1.4rem;}
.page_num .num{position: relative ; color:#fff; font-size:0.8rem; font-weight: 500; padding:0 1rem;}
.page_num .num.now{padding-left:0;}
.page_num .num.total{padding-right:0;}
.page_num .num.now span{display: block; position: relative;}
.num-wrap:after{content:''; display:block; position:absolute; width:1px; height:60%; background:#fff;  top: 50%; left: 50%; transform: translate(-50%, -50%);}
.page_num .bar{position:relative; width: 100%; height:2px; background:rgba(255,255,255,0.4)}
.page_num .bar .line{position:absolute; display:block; content:""; top:0; left:0; width:0; height:2px; background:#fff; z-index:1;}
@media (max-width:1600px){
    .page-wrap{width:100%; padding: 0 3rem 0 2rem;top:25%;}
}
@media (max-width:1030px){
	.page-wrap{    align-items: center;bottom:30%;top:25%;}
}

@media (max-width:500px){
	.page-wrap {bottom:20%;}
}
	

/*비주얼 백그라운드*/
.visual-item > .bg {position:absolute; height:100%; width:100%; top:50%; left:50%; overflow:hidden; transform:translate(-50%, -50%); z-index:-1;}
.visual-item > .bg .visual-img{-webkit-transition:all 6s ease-in-out; -webkit-transform:scale(1);-ms-transition:transform 6s ease-in-out ; -ms-transform: scale(1); transition:all 6s ease-in-out;transform:scale(1);}
.slick-active > .bg .visual-img.is-scale{-webkit-transition:all 10s ease-in-out; -webkit-transform:scale(1.1);-ms-transition:transform 10s ease-in-out ; -ms-transform: scale(1.1); transition:all 10s ease-in-out;transform:scale(1.1);}
.visual-img,
.visual-img span{display: block; width:100%; height:100%;}
@media (max-width:1600px){
    .visual-inner {width: 100%; padding: 0 3rem 0 2rem;}
}
@media (max-width:1030px){
	.visual-inner {padding:0 1rem;}
}

/********ctn01***********/
.ctn01{padding:7.5rem 0 8.25rem 0;}
.ctn01 .about-con{display:flex;justify-content:space-between;align-items:flex-end;}
.ctn01 .about-con ul {display:flex;}
.ctn01 .about-con ul li {padding:0 3.5rem;text-align:center;position:relative; }
.ctn01 .about-con ul li:not(:last-child):after{content:'';display:block;position:absolute;width:1px;height:3rem;background:#cccccc;top:50%;right:0;transform:translateY(-50%);}
.ctn01 .about-con ul li p{color:#2a9863;font-weight:bold;font-size:1rem;margin-bottom:1.5rem;line-height:1;}
.ctn01 .about-con ul li div {font-size:1.5rem;color:#666;font-weight:500;line-height:1;}
.ctn01 .about-con ul li div b{font-family: "Archivo";color:#333;font-weight:bold;font-size:2.75rem;}

.ctn01 .about-list{margin-top:3.5rem;display:flex;}
.ctn01 .about-list > div{background:#014d39;width:22.2rem;}
.ctn01 .about-list > div a {padding:4.5rem 2rem 4.5rem 2.75rem ;display:inline-block;width:100%;height:100%;position:relative;z-index:1;}
.ctn01 .about-list > div a .tit img{   transition: transform 0.5s;}
.ctn01 .about-list > div:nth-child(2){background:#2a9863;}
.ctn01 .about-list > div:nth-child(3){width:calc(100% - 44.4rem);}
.ctn01 .about-list > div .tit{display:flex;justify-content:space-between;align-items:center;font-size:1.5rem;color:#fff;font-weight:bold;position:relative;z-index:1;}
.ctn01 .about-list > div .txt{font-size:1rem;color:rgba(255,255,255,0.7);font-size:1rem;margin-top:4.5rem;line-height:1.3;font-weight:500;position:relative;z-index:1;}
.ctn01 .about-list > div a:hover .tit img{transform: scaleX(-1);}


.ctn01 .about-list > div:nth-child(3) a{
    position: relative;
    overflow: hidden; /* 확대될 때 이미지가 부모 영역을 벗어나지 않도록 설정 */
}

.ctn01 .about-list > div:nth-child(3) a .bg{
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(/images/default/main/about-bg.jpg) no-repeat center center;
    background-size: cover;
    transition: transform 0.7s ease; /* 부드럽게 확대 */
    transform: scale(1); /* 초기 배율 */
	position:absolute;
}

.ctn01 .about-list > div:nth-child(3):hover a .bg {
    transform: scale(1.1); /* 10% 확대 */
}
 

@media (max-width:1500px){
	.ctn01 .about-list > div{width:calc(100% / 3 ) !important;}
	.ctn01 .about-list > div a{padding:2.5rem 1rem;}
	.ctn01 .about-list > div .txt{margin-top:2rem;}
	.ctn01 .about-list > div .txt br{display:none;}
	.ctn01 .about-list > div .tit img{height:2rem;}
}
@media (max-width:1030px){
	.ctn01 .about-con{display:block;}
	.ctn01 .about-con ul{margin-top:1.5rem;}
	.ctn01 .about-con ul li{width:calc(100% / 3 );}
	.ctn01 .about-list{margin-top:1.5rem;}
	.ctn01{padding:5rem 0;}
}
@media (max-width:767px){
	.ctn01 .about-list {flex-wrap:wrap;}
	.ctn01 .about-list > div{width:100% !important;}
	.ctn01 .about-con ul li{padding:0 1rem;}
	.ctn01 .about-con ul li div b{font-size:2rem;}
	
}
@media (max-width:500px){
	.ctn01 .about-con ul li p {margin-bottom:1rem;font-size:0.95rem;}
	.ctn01 .about-con ul li div{line-height:1;font-size:1.2rem;}
	.ctn01 .about-con ul li div b{font-size:1.75rem;}
}

/********ctn02***********/
.ctn02{background:url(/images/default/main/ctn02-bg.jpg)no-repeat center bottom;padding:9.25rem 0 8rem 0;background-size:cover;}
.ctn02 .tit-zone h3{color:#fff;margin-bottom:5rem;}
.ctn02 .product-zone{display:flex;max-width:1720px;margin:0 auto;}
.ctn02 .product-zone .pro-tab{}
.ctn02 .product-zone .pro-tab a{display:block;width:26rem;line-height:5.5rem;color:#aaaaaa;height:5.5rem;font-size:1.4rem;font-weight:700;position:relative;z-index:1;cursor:pointer;padding-left:5rem;}
.ctn02 .product-zone .pro-tab a:after{
width: 12px;height: 12px;content: "";border: 2px solid #fff;border-width: 2px 2px 0 0;transform: translateY(-50%) rotate(45deg);position: absolute;top: 50%;right: 2rem;opacity: 0;transition: all 0.5s;z-index:1;
	}
.ctn02 .product-zone .pro-tab a.on{color:#fff;}
.ctn02 .product-zone .pro-tab a:hover{color:#fff;}
.ctn02 .product-zone .pro-tab a.on:after{opacity:1;}
.ctn02 .product-zone .pro-tab a:hover:after{opacity:1;}
.ctn02 .product-zone .pro-tab a span{position:relative;z-index:1;}
.ctn02 .product-zone .pro-tab a.on .bg{opacity:1;width:26rem;transition-duration: 0.5s;}
.ctn02 .product-zone .pro-tab a .bg{display:block;position:absolute;width:0;height:100%;background: linear-gradient(90deg, #014d39 0%, #2a9863 100%);top:0;z-index:0;left:0;opacity:0;transition-duration: 0.5s;border-radius: 0 2.75rem 2.75rem 0;}
.ctn02 .product-zone .pro-tab a:hover .bg{opacity:1;width:26rem;transition-duration: 0.5s;}
.ctn02 .product-zone .pro-tab a:not(:last-child){margin-bottom:1rem;}
.ctn02 .product-zone .pro-con {margin-left:4.5rem;width:calc(100% - 26rem - 9.5rem);overflow:visible;}
.ctn02 .product-zone .pro-con .txt-bx {width:calc(100% - 555px);}
.ctn02 .product-zone .pro-con .txt-bx .stxt{color:#fff;font-size:0.9rem;}
.ctn02 .product-zone .pro-con .txt-bx strong{font-size:2rem;font-weight:bold;color:#fff;margin:0 0 3.5rem 0;display:block;}
.ctn02 .product-zone .pro-con .txt-bx .txtbx{font-size:1.1rem;color:rgba(255,255,255,0.7);line-height:1.3;font-weight:600;}
.ctn02 .product-zone .pro-con .txt-bx a {width:13.5rem;height:3.75rem;display:inline-block;border:2px solid #fff;border-radius:1.875rem;line-height:calc(3.75rem - 4px);padding:0 2rem;font-size:0.9rem;font-weight:bold;color:#fff;margin-top:3.25rem;}


.ctn02 .product-zone .pro-con .txt-bx a{padding:0 1.6rem; color:#fff;  border:solid 1px #fff; position:relative;}
.ctn02 .product-zone .pro-con .txt-bx a:before,
.ctn02 .product-zone .pro-con .txt-bx a:after{content:''; display:block; position:absolute; width:1.15rem; height:0.8rem; background:url(/images/default/main/arrow-right.png)no-repeat center center;top:50%; transform:translateY(-50%); transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); will-change: transform;background-size:cover;}
.ctn02 .product-zone .pro-con .txt-bx a:before{left:0; opacity:0; transform: translate(0, -50%);}
.ctn02 .product-zone .pro-con .txt-bx a:after{right:1.6rem;}
.ctn02 .product-zone .pro-con .txt-bx a:hover{padding:0 1rem; padding-left:3.5rem;}
.ctn02 .product-zone .pro-con .txt-bx a:hover:before{opacity: 1; transform: translate(1.6rem, -50%);}
.ctn02 .product-zone .pro-con .txt-bx a:hover:after{opacity: 0; right:0;}


.ctn02 .product-zone .pro-con .pro-bx{display:flex;}
.ctn02 .product-zone .pro-con .img-bx {width:27.75rem;height:27.75rem;display:flex;justify-content:center;align-items:center;position:relative;margin-top:-5rem;}
.ctn02 .product-zone .pro-con .img-bx:after{content:'';display:block;position:absolute;width:28.45rem;height:28.5rem;background:url(/images/default/main/one-point.png)no-repeat center center;background-size:cover;transition-duration: 0.5s;}
.ctn02 .product-zone .pro-con .img-bx p {position:absolute;left:-31.5%;top:12.5%;color:#2a9863;font-weight:500;}
.ctn02 .pro-tab .swiper-wrapper{flex-direction:column;}
.ctn02 .product-zone .pro-con .img-bx .circle_box{width:100%;height:100%;position: absolute;top:0;left:0;transition:all 1s;transition-delay:0.2s}
.ctn02 .product-zone .pro-con .img-bx .circle_box span{display: block;width:12px;height:12px;border-radius:100%;background:#2a9863;position: absolute;}
.ctn02 .product-zone .pro-con .img-bx .circle_box span:before{width:calc(100% + 12px);height:calc(100% + 12px);content:"";border-radius:100%;box-sizing:border-box;background:rgba(42, 152, 99, 0.5);position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
.ctn02 .product-zone .pro-con .img-bx .circle_box span:nth-child(1){top:13%;left:14%;}
.ctn02 .product-zone .pro-con .img-bx .circle_box span:nth-child(2){top:38%;right:0;}
.ctn02 .product-zone .pro-con .img-bx .circle_box span:nth-child(3){bottom:1.5%;left:34%;}
.ctn02 .product-zone .pro-con .pro-bx.swiper-slide-active .circle_box{transform:rotate(116deg);}
.ctn02 .product-zone .pro-con .pro-bx.reverse .circle_box{transform:rotate(-123deg);}

@media (max-width:1720px){
	.ctn02 .product-zone .pro-con{width: calc(100% - 22rem - 3rem);margin-left:2rem;margin-right:1rem;}
	.ctn02 .product-zone .pro-tab a{padding-left:1rem;width:22rem;}
	.ctn02 .product-zone .pro-tab a.on .bg{opacity:1;width:22rem;transition-duration: 0.5s;}
	.ctn02 .product-zone .pro-tab a:hover .bg{opacity:1;width:22rem;transition-duration: 0.5s;}

}
@media (max-width:1500px){
	.ctn02 .product-zone .pro-con .img-bx{width:22rem;height:22rem;}
	.ctn02 .product-zone .pro-con .img-bx:after{width:22rem;height:22rem;}
	.ctn02 .product-zone .pro-con .img-bx .img img {height:18rem;}
	.ctn02 .product-zone .pro-con .txt-bx{width:calc(100% - 22rem);}
}
@media (max-width:1300px){
	.ctn02 .product-zone .pro-con{width: calc(100% - 15rem - 3rem);margin-left:2rem;margin-right:1rem;}
	.ctn02 .product-zone .pro-tab a em{display:none;}
	.ctn02 .product-zone .pro-tab a{padding-left:1rem;width:15rem;}
	.ctn02 .product-zone .pro-tab a.on .bg{opacity:1;width:15rem;transition-duration: 0.5s;}
	.ctn02 .product-zone .pro-tab a:hover .bg{opacity:1;width:15rem;transition-duration: 0.5s;}
	.ctn02 .product-zone .pro-con .txt-bx strong{font-size:1.75rem;}
}
@media (max-width:1200px){
	.ctn02 .product-zone .pro-con .pro-bx {display:block;}
	.ctn02 .product-zone .pro-con .txt-bx{width:100%;}
	.ctn02 .product-zone .pro-con .img-bx{margin-top:2rem;}

	.ctn02 .product-zone .pro-con .img-bx{width:25rem;height:25rem;text-align:center;margin:0 auto;margin-top:2rem;}
	.ctn02 .product-zone .pro-con .img-bx:after{width:25rem;height:25rem;}
	.ctn02 .product-zone .pro-con .img-bx .img img {height:18rem;}
	.ctn02 .tit-zone h3{margin-bottom:2.5rem;}

}
@media (max-width:1030px){
	.ctn02{padding:5rem 0 ;}
	.ctn02 .product-zone{display:block;padding:0 1rem;}
	.ctn02 .pro-tab .swiper-wrapper{  justify-content:center;  flex-direction: row;gap:1rem;}
	.ctn02 .product-zone .pro-tab a.on .bg{
	background: linear-gradient(90deg, #014d39 0%, #2a9863 100%);}
	.ctn02 .product-zone .pro-tab a{width:auto;padding:0 2rem;line-height:3rem;height:3rem;border-radius:30px;overflow:hidden;}
	.ctn02 .product-zone .pro-tab a.on .bg{width:100%;}
	.ctn02 .product-zone .pro-tab a:hover .bg{width:100%;}
	.ctn02 .product-zone .pro-con{width:100%;margin-left:0;margin-right:0;margin-top:1.5rem;}
	.ctn02 .product-zone .pro-con .img-bx{width:80%;height:0;padding-bottom: 80%;}
	.ctn02 .product-zone .pro-con .img-bx:after{width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%;}
	.ctn02 .product-zone .pro-con .img-bx .img {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:80%;padding-bottom:80%;}
	.ctn02 .product-zone .pro-con .img-bx .img img{    width: 100%;height:100%;position: absolute;top: 50%;left: 50%;
    transform: translate(-50%, -50%);}
	.ctn02 .product-zone .pro-con .img-bx p{left:-10%;top:5%;}
	.ctn02 .product-zone .pro-con .txt-bx strong{margin-bottom:2rem}
	.ctn02 .product-zone .pro-con .txt-bx a{margin-top:2rem;}
	.ctn02 .product-zone .pro-tab a:after{display:none;}
}

@media (max-width:500px){
	.ctn02 .product-zone .pro-tab a {padding:0 1rem;}
}

.ctn03 {text-align:center;height:100vh;display:flex;justify-content:center;align-items:center;background:url(/images/default/main/ctn03-bg.jpg)no-repeat center center;background-size:cover;}
.ctn03 .tit-zone h3{color:#fff;}
.ctn03 .tit-zone p{color:rgba(255,255,255,0.7)}
.ctn03 .tit-zone a {display:block;width:13.5rem;line-height:calc(3.75rem - 4px);border:2px solid #fff;border-radius:1.875rem;color:#fff;font-size:0.9rem;font-weight:bold;padding:0 2rem;text-align:left;margin:0 auto;margin-top:3.75rem;background:url(/images/default/main/ctn03-btn-bg.png)no-repeat center center;position:relative;
}


.ctn03 .tit-zone a:before,
.ctn03 .tit-zone a:after{content:''; display:block; position:absolute; width:1.15rem; height:0.8rem; background:url(/images/default/main/arrow-right.png)no-repeat center center;top:50%; transform:translateY(-50%); transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); will-change: transform;background-size:cover;}
.ctn03 .tit-zone a:before{left:0; opacity:0; transform: translate(0, -50%);}
.ctn03 .tit-zone a:after{right:1.6rem;}
.ctn03 .tit-zone a:hover{padding:0 1rem; padding-left:3.5rem;}
.ctn03 .tit-zone a:hover:before{opacity: 1; transform: translate(1.6rem, -50%);}
.ctn03 .tit-zone a:hover:after{opacity: 0; right:0;}



@media (max-width:500px){
	.ctn03{height:auto;padding:5rem 0;}
}



/*메인 팝업*/
.video-popup {position: fixed;top: 50%;left: 50%;width: 93%;max-width: 1000px;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);z-index: 99992;}
.video-popup .pop-inner {width: 100%;overflow: hidden;    padding-top: 56.25%;}
.video-popup iframe {position: absolute;width: 100%;height: 100%;top: 0;left: 0;border-radius:1rem;}
.video-popup .close_box {position: absolute;top: -35px;right: 0;width: 100%;display: flex;flex-wrap: wrap;align-items: center;justify-content: flex-end;}
.video-popup .close_box .today {font-size: 22px;color: #fff;font-weight: 400;display: inline-block;line-height: 1em;margin-top: -5px;margin-right: 30px;}
.video-popup .close {position: relative;width: 20px;height: 20px;display: block;}

.video-popup .close:before, .video-popup .close:after {display: block;content: "";position: absolute;top: 8px;left: -3px;width: 25px;height: 2px;background: #fff;transition: 0.3s;display: block;margin: 0 auto;transform: rotate(45deg);}

.video-popup .close:after {transform: rotate(-45deg);}
.pop-video .popup-bg {position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 99991;}