@charset "utf-8";

.main-visual {position: relative; width: 100%;}
.main-visual .item {position: relative; width: 100%; height: 100vh;}
.main-visual .img-box {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; transform: scale(1.1); z-index: 1;}
.main-visual .item:nth-child(1) .img-box {background-image: url('../img/main/main-visual01.jpg');}
.main-visual .item:nth-child(2) .img-box {background-image: url('../img/main/main-visual02.jpg');}
.main-visual .item:nth-child(3) .img-box {background-image: url('../img/main/main-visual01.jpg');}
.main-visual .item.slick-active .img-box {transform: scale(1); transition: all 3.5s;}
.main-visual .text-box {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 1538px; width: 100%; padding: 0 15px; z-index: 5;}
.main-visual .text-box h2 {font-family: "Poppins", sans-serif; font-size: 110px; font-weight: 700; line-height: normal; letter-spacing: 2.2px; color: #56B9FF; margin-bottom: 6px;}
.main-visual .text-box p {font-size: 54px; font-weight: 200; line-height: 1.4em; color: #fff;}
.main-visual .text-box p b {font-weight: 700;}
.main-visual .slick-active .text-box h2 {animation: text-up 1.4s both 0.4s;}
.main-visual .slick-active .text-box p {animation: text-up 1.4s both 0.6s;}
@keyframes text-up {
    0% {
        filter: blur(5px);
        transform: translateY(60px);
        opacity: 0;
    }

    100% {
        filter: blur(0);
        transform: translateY(0);
        opacity: 1;
    }
}
.main-visual .controler {position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); max-width: 188px; width: 100%; display: flex; justify-content: center;}
.main-visual .controler .paging ul {display: flex; align-items: center; gap: 8px;}
.main-visual .controler .paging ul li button {display: block; width: 6px; height: 6px; background: rgba(204, 204, 204, 0.60); border-radius: 3px; font-size: 0; border: 0; transition: all 0.8s;}
.main-visual .controler .paging ul li.slick-active button {width: 80px; height: 6px; background: #fff;}
.main-visual .controler .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); display: block; width: 24px; height: 24px; background-color: transparent; background-repeat: no-repeat; background-position: center center; font-size: 0; border: 0;}
.main-visual .controler .slick-prev {left: 0; background-image: url('../img/main/icon-main-prev.png');}
.main-visual .controler .slick-next {right: 0; background-image: url('../img/main/icon-main-next.png');}

.section-title {text-align: center;}
.section-title-left {text-align: left;}
.section-title .eng-title {font-family: "Poppins", sans-serif; font-size: 28px; font-weight: 600; line-height: normal; letter-spacing: 0.56px; color: #56B9FF; margin-bottom: 12px;}
.section-title .kor-title {font-size: 50px; font-weight: 700; line-height: 1.4em; color: #222;}
.section-title .kor-title span {font-weight: 200;}
.section-title .details {font-size: 20px; line-height: 1.6em;}
.section-title-wh .kor-title {color: #fff;}
.section-title-wh .details {color: #fff;}

.section-service {position: relative; height: 100vh;}
.section-service .backdrop {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; overflow: hidden; background: #000;}
.section-service .backdrop .bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center center; opacity: 0; transition: opacity 0.5s ease;}
.section-service .backdrop .bg01 {opacity: 1; background-image: url('../img/main/section-service-bg01.jpg');}
.section-service .backdrop .bg02 {background-image: url('../img/main/section-service-bg02.jpg');}
.section-service .backdrop .bg03 {background-image: url('../img/main/section-service-bg03.jpg');}
.section-service .backdrop .bg04 {background-image: url('../img/main/section-service-bg04.jpg');}
.section-service .backdrop .bg05 {background-image: url('../img/main/section-service-bg05.jpg');}
.section-service .backdrop .bg06 {background-image: url('../img/main/section-service-bg06.jpg');}

.section-service .text-box {height: 100%;}
.section-service .section-title-wrap {position: absolute; top: 180px; left: 50%; transform: translateX(-50%); width: 100%;  z-index: 10;}
.section-service .section-title {opacity: 0; position: absolute; top: 0; left: 0; width: 100%; padding: 0 15px; transition: all 0.5s;}
.section-service .section-title01 {opacity: 1;}
.section-service .section-title .kor-title {display: flex; justify-content: center; align-items: center; gap: 12px; margin-bottom: 6px;}

.section-service .text-box ul {position: relative; display: flex; height: 100%; z-index: 5;}
.section-service .text-box ul li {flex: 1;}
.section-service .text-box ul li:not(:last-child) {border-right: 1px solid rgba(153,153,153,0.2);}
.section-service .text-box ul li a {position: relative; display: flex; justify-content: center; align-items: flex-end; width: 100%; height: 100%; padding: 66px 10px; overflow: hidden;}
.section-service .text-box ul li h4 {position: relative; display: inline-block; font-size: 26px; font-weight: 600; line-height: 1.4em; color: #999; text-align: center; transition: all 0.5s;}
.section-service .text-box ul li.active h4,
.section-service .text-box ul li a:hover h4 {color: #fff;}
.section-service .text-box ul li h4:after {position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%); content: ''; width: 0; height: 2px; background: #fff; transition: all 0.6s;}
.section-service .text-box ul li.active h4:after,
.section-service .text-box ul li a:hover h4:after {width: 100%;}
.section-service .text-box ul li .num {position: absolute; bottom: 32px; right: -30px; display: block; font-family: "Tektur", sans-serif; font-size: 160px; font-weight: 700; line-height: normal; letter-spacing: 3.2px; color: #fff; opacity: 0; transform: translateY(20px); transition: all 0.5s;}
.section-service .text-box ul li.active .num,
.section-service .text-box ul li a:hover .num {opacity: 0.06; transform: translateY(0);}

.section-overview {position: relative; background: #f7f7f7; }
.section-overview .line {position: absolute; top: 0; width: 1px; height: 100%; background: rgba(153,153,153,0.2);}
.section-overview .line01 {left: 16.666%;}
.section-overview .line02 {left: 33.332%;}
.section-overview .line03 {left: 49.999%;}
.section-overview .line04 {left: 66.665%;}
.section-overview .line05 {left: 83.31%;}
.section-system {padding: 260px 0 288px;}
.section-system .section-title {margin-bottom: 100px;}
.section-system ul {display: flex; gap: 20px;}
.section-system ul li {flex: 1; text-align: center;}
.section-system ul li .icon {margin-bottom: 20px;}
.section-system ul li .num {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin-bottom: 24px;}
.section-system ul li .num span {display: inline-block;}
.section-system ul li .num .title {font-size: 22px; line-height: 1.6em; color: #444; margin-right: 16px;}
.section-system ul li .num .counting {font-size: 50px; font-weight: 700; line-height: 1.2em; color: #359FF4; margin-right: 8px;}
.section-system ul li .num .unit {font-size: 26px; font-weight: 600; line-height: 1.6em; color: #444;}
.section-system ul li .details {font-size: 26px; font-weight: 600; line-height: 1.6em; color: #444;}
.section-system ul li .certification {display: flex; justify-content: center; gap: 10px; margin-top: 10px;}
.section-system ul li .certification span {display: inline-block; padding: 0 12px; border-radius: 100px; background: #999; font-size: 18px; font-weight: 600; line-height: 1.6em; color: #fff; text-align: center;}

.section-point {position: relative; padding-bottom: 414px;}
.section-point:before {position: absolute; top: 0; right: 0; content: ''; width: 1879px; height: 1103px; background: url('../img/main/section-point-bg.png') no-repeat right center;}
.section-management {position: relative; padding-bottom: 300px;}
.section-management:before {position: absolute; bottom: 0; right: 0; content: ''; width: 1439px; height: 530px; background: url('../img/main/section-management-bg.png') no-repeat right bottom;}
.section-overview .flex-box {display: flex; justify-content: space-between; align-items: center;}
.section-management .flex-box {flex-direction: row-reverse;}
.section-overview .flex-box .text-box {width: 51.5%;}
.section-point .flex-box .text-box {padding-right: 110px;}
.section-management .flex-box .text-box {padding-left: 110px;}
.section-overview .flex-box .img-box {width: 48.5%;}
.section-overview .flex-box .section-title {margin-bottom: 30px;}
.section-overview .flex-box .details {font-size: 28px; line-height: 1.6em; color: #444;}
.section-overview .flex-box .details:not(:last-child) {margin-bottom: 24px;}

.section-premium {padding: 202px 0 194px;}
#main .section-premium .container {max-width: 1646px; padding: 0 71px;}
.section-premium .section-title {margin-bottom: 70px;}
.section-premium .slide-items {margin: 0 -30px;}
.section-premium .slide-item {padding: 0 30px;}
.section-premium .slide-item .img-box {position: relative; padding: 0 40px; z-index: 5;}
.section-premium .slide-item .img-box .before-img,
.section-premium .slide-item .img-box .after-img {position: relative;}
.section-premium .slide-item .img-box .pic {position:relative; height:0; padding-bottom:57.89%; overflow:hidden; transition:all 0.6s;}
.section-premium .slide-item .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition: all 0.6s;}
.section-premium .slide-item a:hover .img-box .pic img {transform: scale(1.1) translateY(-50%);}
.section-premium .slide-item .img-box span {position: absolute; bottom: 0; left: 0; width: 100%; display: block; font-family: "Tektur", sans-serif; font-size: 20px; font-weight: 600; line-height: normal; letter-spacing: 0.4px; color: #fff; text-align: center; padding: 2px 10px; background: rgba(0, 0, 0, 0.30);}
.section-premium .slide-item .text-box {margin-top: -66px; padding: 97px 40px 40px; background: #fff; transition: all 0.5s;}
.section-premium .slide-item a:hover .text-box {background: #F3F7FA;}
.section-premium .slide-item .text-box .cate {font-size: 20px; font-weight: 600; line-height: 1.6em; color: #1F2E5F;}
.section-premium .slide-item .text-box .address {font-size: 24px; font-weight: 600; line-height: 1.8em; color: #222; margin-bottom: 12px;}
.section-premium .slide-item .text-box .arrow {width: 40px; height: 40px; background: #fff url('../img/main/icon-premium-arrow-gray.png') no-repeat center center; border: 1px solid #eee; transition: all 0.5s;}
.section-premium .slide-item a:hover .text-box .arrow {background: #1F2E5F url('../img/main/icon-premium-arrow-white.png') no-repeat center center; border: 1px solid #1F2E5F;}
.section-premium .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; border-radius: 50%; border: 1px solid #bbb; background: #fff; background-repeat: no-repeat; background-position: center center; font-size: 0; z-index: 10; transition: all 0.5s;}
.section-premium .slick-prev {left: -26px; background-image: url('../img/main/icon-premium-prev.png');}
.section-premium .slick-next {right: -26px; background-image: url('../img/main/icon-premium-next.png');}
.section-premium .slick-arrow:hover {background-color: #1F2E5F; border: 1px solid #1F2E5F;}
.section-premium .slick-prev:hover {background-image: url('../img/main/icon-premium-prev-active.png');}
.section-premium .slick-next:hover {background-image: url('../img/main/icon-premium-next-active.png');}

.section-inquiry {position: relative; height: 570px;}
.section-inquiry .text-box {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 1530px; width: 100%; padding: 0 15px;}
.section-inquiry .text-box .inner {width: 50%;}
.section-inquiry .text-box h3 {font-size: 46px; font-weight: 800; line-height: 1.4em; color: #fff; margin-bottom: 30px;}
.section-inquiry .text-box h3 span {font-weight: 100;}
.section-inquiry .text-box a {position: relative; display: flex; justify-content: space-between; align-items: center; width: 274px; height: 50px; padding: 0 4px 0 16px; border-bottom: 2px solid #fff; transition: all 0.5s;}
.section-inquiry .text-box a:hover {padding: 0;}
.section-inquiry .text-box a span {font-size: 22px; font-weight: 600; line-height: 1.6em; color: #fff;}

.section-inquiry .backdrop {display: flex; height: 100%;}
.section-inquiry .backdrop .bg {width: 50%;}
.section-inquiry .backdrop .bg-color {background: #1F2E5F;}
.section-inquiry .backdrop .bg-img {background: url('../img/main/section-inquiry-bg.jpg') no-repeat center center/cover;}