body{position : relative;}
body.fixed{overflow : hidden;}
.section{overflow: hidden;}
.swiper-wrapper{transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important}

/**/
#intro{display: flex;align-items: center;justify-content: center; position : fixed; left : 0;top : 0; width : 100vw; height : 100vh;z-index: 1000; background: #004E50; transition : 1s; overflow: hidden;;
    &.t1{
        .intro-bg{transform: scale(1); opacity: 1; clip-path: inset(0);}
        .intro-obj-box > span{clip-path: inset(0); transition : ease 0.8s;}
        .intro-obj-box:nth-child(1) > span:nth-child(1){transition-delay: 0s;}
        .intro-obj-box:nth-child(1) > span:nth-child(2){transition-delay: 0.1s;}
        .intro-obj-box:nth-child(2) > span:nth-child(1){transition-delay: 0.2s;}
        .intro-obj-box:nth-child(2) > span:nth-child(2){transition-delay: 0.3s;}
        .intro-obj-box:nth-child(2) > span:nth-child(3){transition-delay: 0.4s;}

        .intro-tit > p{opacity: 1; transition : 1.2s;
            &:nth-child(1){transform: translateY(-80px) translateX(-90px);}
            &:nth-child(2){transform: translateY(160px) translateX(120px);}
        }
    }
    &.t2{
        .intro-bg{mask-size: 300vmax; transition :2s;}
        .intro-tit > p{transform: translateX(0) !important; transition : 1.2s;}
    }
    &.t3{
        .intro-tit-box{transform: translateX(-110px);}
        .intro-line{width : 157px; margin-left: 10px;}
        .intro-logo{transform: translateX(0); opacity: 1;}
    }
    &.end{opacity: 0; pointer-events: none;}
}

.intro-bg{position : absolute;width : 100%;height : 100%; mask-image: url(../images/main/intro-mask.svg); mask-repeat: no-repeat;  mask-size : 435px; mask-position: center; clip-path: inset(100% 0 0); opacity: 0; transform: scale(1.25); transition : transform .5s, opacity 1.8s, clip-path 1.5s; z-index: 1;}
.intro-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center;}
.intro-obj{display: flex;align-items: center;justify-content: center; position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.intro-obj-box{display: flex;align-items: center; justify-content: center; position : absolute;
    &:nth-child(1){margin-right: 500px; margin-top: 280px;
        > span:nth-child(1){width : 16px; height : 300px; margin-right: 5px;margin-bottom: 30px; background: #166A6C;}
        > span:nth-child(2){width : 3px; height : 180px; margin-top: 160px; margin-right: 80px; background: #7AD9DD;}
        > span:nth-child(3){width : 8px; height : 180px; margin-left: 35px; background: #43C4CF;}
    }
    &:nth-child(2){margin-left: 420px; margin-bottom: 160px;
        > span:nth-child(1){width : 3px; height : 280px; margin-left: 78px; margin-bottom: 200px; background: #fff;}
        > span:nth-child(2){width : 16px; height : 300px; background: #166A6C;}
    }
}
.intro-obj-box > span{width : 10px; height : 100px; background: pink; position : absolute; transform: rotate(29.5deg); border-radius: 100px; clip-path: inset(100% 0 0);}

.intro-tit-box{display: flex; align-items: center; position : absolute; z-index: 1; color : #fff; transition : 1.2s;}
.intro-tit{display: flex; font-family: NM; font-size: 26px; font-weight: 400;}
.intro-tit > p{opacity: 0; transition : 1.2s;
    &:nth-child(1){transform: translateY(-80px) translateX(-240px);}
    &:nth-child(2){transform: translateY(160px) translateX(300px);}
}

.intro-line{width : 157px;width : 0;  height : 1px; background: rgba(255,255,255,0.4); transition : 1.2s;}
.intro-logo{font-family: PT; font-size: 24px; font-weight: 600; letter-spacing: -0.06em; position : absolute;left : calc(100% + 10px); white-space: nowrap; transform: translateX(100px); opacity: 0; transition : 1.2s;}
/**/
.main-top-icon { position : absolute; margin-left: 340px; margin-top: 4px; width: 160px; }

.main-icon { position : absolute; top: 110px; right: 90px; z-index: 0; width: 130px; height: 130px; }

.open-rotate-btn{display: flex;flex-direction: column;align-items: center;justify-content: center; background: #004E50; width : 98px; height : 98px;right : 89px; position : fixed; bottom : 48px; z-index: 1; border-radius: 50%; transition : 1.2s; opacity: 0; transform: translateX(80px); z-index: 10000; font-size: 14px; font-family: PT; color : #ccc; letter-spacing: -0.04em;

    &::before{position : absolute; content : ''; border : 1px solid #fff; border-radius: 50%; transform: scale(0.9); width : 100%;height : 100%;}

    &::after{position : absolute; content : ''; width : 132px; height : 132px;  background: url(../images/main/open-rotate-text.png)no-repeat center / contain; animation : rotate-text 8s infinite linear;}

    &.show{opacity: 1; transform: translateX(0);}
    &.hide{opacity: 0; transform: translateX(80px);}

    b{font-family: jost, PT; font-size: 22px; font-weight: 700; color : #fff;}
}
@keyframes rotate-text {
    100%{transform: rotate(360deg);}
}

.skip-btn{display: flex;align-items: center;justify-content: center; position : absolute; font-family: jost; background: #fff; width : 64px; height : 64px; top : 50%; left : 50%;z-index: 1000; transform: translateX(-50%) translateY(-50%) scale(0); border-radius: 50%; color : #004E50; letter-spacing: 0.1em; font-weight: 600; font-size: 16px; transition : transform .5s;}
.skip-btn.on{transform: translateX(-50%) translateY(-50%) scale(1);}
.end .skip-btn{transform: translateX(-50%) translateY(-50%) scale(0); pointer-events: none;;}
.skip-btn::after{position : absolute; content : ''; width : 100%;height : 100%; background: rgba(255,255,255,0.5); border-radius: 50%; animation : skip-btn 1s infinite}
@keyframes skip-btn {
    0%{opacity: 1; transform: scale(1);}
    100%{opacity: 0; transform: scale(1.5);}
}

/**/
/* .main-visual.on{
    .visual-tit > p{transform: translateX(0); opacity: 1;}
    .visual-logo{transform: translateY(0); opacity: 1; transition : 1.2s 1s;}
}
.visual-bg{position : absolute;width : 100%;height : 100%; left : 0;top : 0; filter: brightness(0.7);}
.visual-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center;}

.visual-inner{display: flex;justify-content: center; position : relative;}
.visual-tit-box{display: flex;flex-direction: column; align-items: center; color : #fff; margin : 0 auto;}
.visual-tit{display: flex; font-family: NM; font-size: 38px; font-weight: 400; margin-bottom: 12px;}
.visual-tit > p{opacity: 0; transition : 1.2s;
    &:nth-child(1){transform: translateX(-100px)}
    &:nth-child(2){transform: translateX(100px)}
}
.visual-logo{font-family: PT; font-size: 24px; font-weight: 600; letter-spacing: -0.06em; transform: translateY(80px); opacity: 0; transition : 1.2s;} */

/**/

.main-tip.active{
    .tip-tit-box{opacity: 1; transform: translateX(0);; transition : 1.2s .4s;}
    .tip-left::after{clip-path: inset(0); transition : 1.2s .4s;}
    .tip-list-tit{transform: translateX(0); opacity: 1; transition : 1.2s 1s}
    .tip-list > li{transform: translateX(0); opacity: 1; transition : 1.2s calc(var(--i) * 0.1s + 1s)}
}
.tip-bg{position : absolute;width : 100%;height : 100%; left : 0;top : 0; filter: brightness(0.7);}
.tip-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center;}

.tip-container{display: flex;justify-content: center; position : relative; padding-bottom: 200px;}
.tip-tit-box{display: flex; align-items: center; color : #fff; margin-bottom: 18px; transform: translateX(-100px);opacity: 0; transition : 0s 1.2s;}

.tip-logo{font-family: PT; font-size: 20px; font-weight: 600; letter-spacing: -0.06em; margin-right: 8px; margin-bottom: 1em;}
.tip-tit{font-family: NM, Cormorant Garamond; font-weight: 700; font-size: 45px;}
.tip-tit span{transform: translateY(-50%);}

.tip-box{display: flex;}
.tip-left{padding-right: 74px; position : relative;
    &::after{position : absolute; content : ''; width : 1px; height : 100%; right : 0;top : 0; background: rgba(255,255,255,0.3); clip-path: inset(0 0 100%); transition : 0s 1.2s;}
}
.tip-right{padding-left: 74px;}
.tip-list > li{display: flex; align-items: center; color : #fff; font-family: PT; letter-spacing: -0.03em; font-weight: 700; font-size: 20px;}
.tip-list > li .color{color : #FFF899}

.tip-list-01 > li{gap : 14px; transform: translateX(-100px); opacity: 0; transition : 0s 1.2s;
    &:nth-child(1){--i : 0;}
    &:nth-child(2){--i : 1;}
    &:nth-child(3){--i : 2;}
    &:nth-child(4){--i : 3;}
    &:nth-child(5){--i : 4;}
}
.tip-list-01 > li + li{margin-top: 33px;}

.tip-list > li small{font-size: 16px; font-weight: 500;}
.tip-num{display: flex;align-items: center;justify-content: center; width : 112px; height : 48px; border : 1px solid #fff; border-radius: 100px; line-height: 1em; font-family: jost; font-size: 22px; font-weight: 500;} 

.tip-list-tit{display: flex; align-items: center;  font-family: NM; font-size: 25px; gap : 7px; margin-bottom: 36px; color : #fff; line-height: 1em; transform: translateX(100px); opacity: 0; transition : 0s 1.2s;}
.tip-list-tit > span{font-family: AV; font-size: 32px;}
.tip-list-02 > li{gap : 4px; align-items: end; transform: translateX(100px); opacity: 0; transition : 0s 1.2s;
    &:nth-child(1){--i : 1;}
    &:nth-child(2){--i : 2;}
    &:nth-child(3){--i : 3;}
    &:nth-child(4){--i : 4;}
    &:nth-child(5){--i : 5;}
    &:nth-child(6){--i : 6;}
}

.tip-list-02 > li + li{margin-top: 25px;}


/**/

.main-train.active{
    .train-bg > video{transform: scale(1); transition : 3s;}    
    .train-subway > img{transform: translateY(0);
        &:nth-child(1){transition : 1s 1s;}
        &:nth-child(2){transition : 1s 1.2s;}
    }

    .train-tit-01{transform: translateX(0);opacity: 1; transition : 1s 1.4s;
        span{transform: scale(1);opacity: 1; transition : 1s 1.8s;}
    }
    .train-line{clip-path: inset(0); transition : 1s 2.2s;}
    .train-tit-02{transform: translateX(0);opacity: 1; transition : 1s 2.6s;
        span{transform: scale(1);opacity: 1; transition : 1s 3s;}
    }
}
.train-bg{position : absolute;width : 100%;height : 100%; left : 0;top : 0;
    &::after{position :absolute; content : ''; width : 100%; height : 100%; background: linear-gradient(-45deg, rgba(0,0,0,0.6), transparent, rgba(0,0,0,0.6)); left : 0;top : 0;}
}
.train-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1.2s;}

.train-subway{display: flex; position :absolute; left : 113px; bottom : 0; gap : 6px; overflow: hidden;
    > img{transform: translateY(100%); transition : 0s 1.2s;}
}
.train-tit-box{display: flex; align-items: center; position : relative; padding : 0 0 60px 294px; color : #fff; position : absolute; bottom : 0; left : 0; gap : 16px;}
.train-line{width : 156px; height : 1px; background: rgba(255,255,255,0.7); clip-path: inset(0 100% 0 0); transition : 0s 1.2s;}

.train-tit{display: flex;align-items: center; font-family: NM; font-size: 38px; font-weight: 700; transform: translateX(-50px); opacity: 0; transition : 0s 1.2s;}
.train-tit span{display: flex;align-items: center; transform: scale(1.25); opacity: 0; transition : 0s 1.2s;}
.train-tit b{font-family: jost; font-size: 48px; font-weight: 700;}

.train-info{display: flex;align-items: center;gap : 5px; position : absolute; color : #fff; left : 294px; bottom : 16px; font-size: 14px; letter-spacing: -0.04em;}
.train-info::before{display: flex;align-items: center;justify-content: center; position : relative; content : '!'; width : 24px; height : 24px; border : 1px solid rgba(255,255,255,0.5); font-weight: 500; border-radius: 50%; font-size: 16px; font-size: 14px;}
/**/

.main-traffic{background: #fff; font-family: PT;
    &.active{
        .traffic-map{opacity: 1; transform: translateX(0); transition : 2s;}
        /* .traffic-bg-img{transform: translateX(0); opacity: 1; transition : 2s;} */
        .traffic-map > img{
            &:nth-child(2){opacity: 1; clip-path: inset(16% 0 0% 0); transition : 2s 1s}
            &:nth-child(3){opacity: 1; clip-path: inset(0 60% 84% 0); transition : 1s 0.4s}
            &:nth-child(4){opacity : 1; clip-path: inset(0); transition : 3s 0.4s}
            &:nth-child(5){opacity : 1; clip-path : inset(0); transition : 3s 1s;}
            &:nth-child(6){opacity : 1; transform: translateY(0px); transition : 1s 2s;}
        }
        .traffic-obj{transform: translateX(0); opacity: 1; transition : 1.6s;}
        .traffic-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
        .traffic-name{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}
        .traffic-line > *{opacity: 1; transform: translateX(0) scale(1); clip-path: inset(0); transition : 1s calc(var(--i) * 0.1s + 1s);}
        .traffic-btn{opacity: 1; transform: translateY(0); transition : opacity 1.2s 1s, transform 1.2s 1s, background .3s, color .3s;;}
    }
}
.traffic-bg{position : absolute; left : 0;top : 0;width : 100%;height : 100%; }
.traffic-bg-img{width : 100%; height : 100%; object-fit: contain; object-position: left bottom; transform: translateX(-50%); opacity: 0; transition : 0s 1.2s;}

.traffic-obj{position : absolute; bottom : 0; right : 0; opacity: 0; transition : 0s 1.2s; pointer-events: none;
    &.traffic-obj-01{left : 97px; transform: translateX(-100%); }
    &.traffic-obj-02{left : 40px; transform: translateY(100%);}
}

.traffic-left{display: flex;align-items: center;justify-content: center; position : relative; width : 36vw;}
.traffic-tit-box{margin-bottom: 60px; transform: translateY(-100px); opacity: 0; transition : 0s 1.2s;}
.traffic-desc{font-family: PT; letter-spacing: -0.03em; font-size: 22px; font-weight: 500; margin-bottom: 11px;}
.traffic-tit{font-family: NM; font-weight: 700; color : #004E50; letter-spacing: -0.06em; font-size: 37px;}

.traffic-list{margin-bottom: 100px;}
.traffic-list > li{
    &:nth-child(1){
        .traffic-dot{border-color : #0C3388;}
        .point{color : #0C3388}
    }
    &:nth-child(2){
        .traffic-dot{border-color : #997B29;}
        .point{color : #997B29}
    }
    &+li{margin-top: 21px;}
}
.traffic-name{display: flex; align-items: center; font-size: 20px; gap : 9px; margin-bottom: 15px; transform: translateX(-60px); opacity: 0; transition : 0s 1.2s;}

.traffic-line{display: flex; align-items: center;gap : 11px;}
.traffic-line > span{font-size : 20px; font-weight: 700; letter-spacing: -0.06em; opacity: 0; transition : 0s 1.2s;
    &.point{font-size: 21px; font-family: PT;}
    &.point b{font-size: 30px; font-family: PT; font-weight: 700;}

    &:nth-of-type(1){transform: scale(1) translateX(-30px);}
    &:nth-of-type(2){transform: scale(1.5) translateX(0px);}
    &:nth-of-type(3){transform: scale(1) translateX(30px);}
}
.traffic-dot{width : 24px; height : 24px; border : 5px solid #0C3388; background: #fff; border-radius: 50%; opacity: 0; transition : 0s 1.2s;}
.traffic-dot-line{width : 64px; height : 1.5px; border : 1px dashed #707070; clip-path: inset(0 100% 0 0); transition : 0s 1.2s;}

.traffic-btn{display: flex;align-items: center; justify-content: start; width : 234px; height : 65px; padding-left: 23px; border : 1px solid #E0E0E0; position : relative; font-size: 16px; font-family: PT; font-weight: 500; border-radius: 100px; gap : 9px; transition : 0s 1.2s; transform: translateY(80px); opacity: 0;
    &:hover{background: #000; color : #fff;
        .traffic-arrow{filter: invert(1);}
    }
}
.traffic-arrow{display: flex;align-items: center; position : relative; z-index: 1; transition : .3s;
    &::after{position : absolute; content : ''; width : 24px; height : 24px; background: #DEDEDE; border-radius: 50%; transform: translateX(40%); right : 0; z-index: -1; }
}

.traffic-map{position : absolute; right : 0; bottom : 0; width : 66.6146vw; transform: translateX(50%); opacity: 0; transition : 0s 1.2s; margin-bottom: 40px;}
.traffic-map-img{position : absolute; left : 0;top : 0; width : 100%; height : 100%; object-fit: contain; object-position: center; transition : 0s 1.2s;
    &:first-child{position : static;}
    &:nth-child(2){opacity: 1; clip-path: inset(16% 0 84% 0);}
    &:nth-child(3){opacity: 1; clip-path: inset(0 100% 84% 0);}
    &:nth-child(4){opacity : 0; clip-path: inset(0 100% 0 0);}
    &:nth-child(5){opacity : 0; clip-path : inset(0 100% 0 0);}
    &:nth-child(6){opacity : 0; transform: translateY(-50px);}
}

.traffic-info{font-family : PT; font-size : 14px; display : flex; align-items : center; gap : 5px; position : absolute; right : 80px; bottom : 24px; padding : 6px 16px 6px 6px;border-radius : 100px; font-weight : 500; letter-spacing : -0.04em; background: #efefef;}
/* .traffic-info:hover{background: #fff;} */
.traffic-info > p{position : relative; text-shadow : 0 0 10px rgba(255,255,255,0.5); color : #999;
    >b{color : #004E50; font-weight: 600;}
}
.traffic-info > span{display : flex; align-items : center; justify-content : center; color : #fff; background: #004E50; font-family : PT; font-weight : 600; width : 30px;height : 30px; font-size : 20px; border-radius : 50%;}

.traffic-info-container{display : flex; align-items : center; justify-content : center; position : fixed; left : 0;top : 0; z-index : 100000;width : 100%;height : 100%; opacity : 0; pointer-events : none;transition : 0.5s;}
.traffic-info-container.on{opacity : 1; pointer-events : all;}
.traffic-info-bg{position : absolute; background: rgba(0,0,0,0.5); width : 100%;height : 100%; left : 0;top : 0; z-index : -1;}
.traffic-info-inner{display : flex; align-items : center; justify-content : center; gap : 24px; background: #fff; border-radius : 16px; padding : 120px 80px 50px; letter-spacing : -0.04em; font-weight : 500; font-size : 18px; position : relative; max-width : 60%;}
.traffic-info-inner::after{position : absolute; content : ''; width : 90%; height : 1px; background: rgba(0,0,0,0.2);top : 80px;}

.traffic-info-inner li{
    position : relative; padding-left: 16px;
    &+li{margin-top: 5px;}
    &::before{position : absolute; content : '※'; left : 0;top : 0;}
}
.traffic-info-inner > span{display : flex; align-items : center; justify-content : center; background: #004E50; color : #fff; font-family : PT; font-weight : 700; width : 36px;height : 36px; font-size : 20px; border-radius : 50%; flex-shrink : 0;}
.traffic-info-close{font-size : 30px; position : absolute; top : 16px; right : 24px;}


/**/
.main-premium.active{
    .premium-slide::after{transition : clip-path 2s, background .5s; clip-path: inset(0);}
    .premium-slide::before{transition : clip-path 2s, background .5s; clip-path: inset(0);}
}
.premium-slide{width : 100%; height : 100%;
    &::after{position : absolute; content : ''; width : 1px; height : calc(50% - 100px); background: rgba(0,0,0,0.12); top : 0; left : 50%; transform: translateX(-50%); z-index: 10; pointer-events: none; clip-path: inset(0 0 100%); transition : 0s 1.2s;}
    &::before{position : absolute; content : ''; width : 1px; height : calc(50% - 100px); background: rgba(0,0,0,0.12);  bottom : 0; left : 50%; transform: translateX(-50%); z-index: 10; pointer-events: none; clip-path: inset(100% 0 0); transition : 0s 1.2s;}
    &.t2{
        &::after{background:rgba(255,255,255,0.2);}
        &::before{background:rgba(255,255,255,0.2);}
    }
}
.premium-container{display: flex;justify-content: center;align-items: center; position :absolute; left : 0;top : 0; z-index: 1; width : 100%; height : 100%;}
.premium-container > div:not(.premium-tit-box){display: flex;align-items: center;justify-content: center; width : 100%; height : 100%; transition : 1.2s; padding-top: 60px;}
.premium-02{position : absolute; left : 100%;top : 0;}
.t2 .premium-01{transform: translateX(-50%) scale(0.8);}
.t2 .premium-02{transform: translateX(-100%);}

.premium-inner{display: grid;grid-template-columns: repeat(2, 1fr); max-width : 1600px; width : 100%; height : 768px; position : relative;}

.premium-bg{position : absolute; left : 0;top: 0;width : 100%; height : 100%; overflow: hidden;}
.premium-bg > img{width : 100%; height : 100%; object-fit: cover; object-position: center bottom; transform: scale(1.25); transition : 0s 1.4s;}
.active .premium-bg > img{transform: scale(1); transition :3s;}

.premium-con{display: flex; justify-content: start; align-items: start;}

.premium-con-02{margin-top: 23px; justify-content: end;}
.premium-con-03{margin-left: 120px; margin-bottom: 80px; align-items: end;}
.premium-con-04{align-items: end; justify-content: end; margin-right: 131px;}

.premium-con-06{margin-top: 23px; justify-content: end;}
.premium-con-07{margin-left: 120px; margin-bottom: 80px; align-items: end;}
.premium-con-08{align-items: end; justify-content: end; margin-right: 131px;}

.premium-con-inner{display: flex; align-items: end; gap : 66px;}
.premium-img{position : relative;}
.premium-img > img{opacity: 0; transition : 1.2s .4s;}

.active .t1 .premium-01 .premium-img > img,
.active .t2 .premium-02 .premium-img > img{opacity: 1; transform: translateX(0);}

.active .t1 .premium-01 .premium-con:nth-child(1) .premium-img > img,
.active .t2 .premium-02 .premium-con:nth-child(1) .premium-img > img{transition : 1.2s .4s;}

.active .t1 .premium-01 .premium-con:nth-child(2) .premium-img > img,
.active .t2 .premium-02 .premium-con:nth-child(2) .premium-img > img{transition : 1.2s .6s;}

.active .t1 .premium-01 .premium-con:nth-child(3) .premium-img > img,
.active .t2 .premium-02 .premium-con:nth-child(3) .premium-img > img{transition : 1.2s .8s;}

.active .t1 .premium-01 .premium-con:nth-child(4) .premium-img > img,
.active .t2 .premium-02 .premium-con:nth-child(4) .premium-img > img{transition : 1.2s 1s;}

.premium-img > img:nth-child(1){transform: translateX(-50px) translateY(-50px);}
.premium-img-text{position : absolute;right : -23px; bottom : -17px; transform: translateX(50px) translateY(50px);}

.premium-con-box{padding-bottom: 16px; font-family: PT; letter-spacing: -0.03em; opacity: 0; transform: translateX(100px); transition : 1s .4s;}

.active .t1 .premium-01 .premium-con-box,
.active .t2 .premium-02 .premium-con-box{transform: translateX(0); opacity: 1; transition : 1.2s 1.4s;}

.premium-con-tit{font-size: 20px; line-height: 1.5em; color : #004E50; font-weight: 700; margin-bottom: 18px; letter-spacing: -0.03em;}
.premium-02 .premium-con-tit{color : #BCB3AF}
.premium-con-desc{font-size: 16px; font-weight: 500; line-height: 1.5em; color : #121212; letter-spacing: -0.03em;}
.premium-02 .premium-con-desc{color : #BEBEBE}

.premium-tit-box{display: flex;flex-direction: column;align-items: center;justify-content: center; position :absolute;z-index: 10;}

.premium-tit-desc{font-family: Asta Sans; letter-spacing: -0.06em; font-weight: 700; color : #004E50; font-size: 20px; margin-bottom: 10px; margin-left: auto; transform: translateX(100px); opacity: 0; transition : transform 0s 1.4s, opacity 0s 1.4s, color 1s;}
.t2 .premium-tit-desc{color : #9A9A9A;}
.active .premium-tit-desc{transform: translateY(0); opacity: 1; transition : 2s .4s;}

.premium-tit-desc > span{font-family: AV; font-size: 54px; position : absolute;right : 90%; bottom : 0; transform: rotate(-15deg) translateX(-50%);}

.premium-tit{font-family: jost; font-size: 75px; color : #000; line-height: 1em; position : relative; overflow: hidden; font-weight: 500;}

.premium-tit .char{transform: translateY(-100%); transition : 1s;}
.premium-tit > p:nth-child(2) .char{transform: translateY(100%);}
.premium-tit > p:nth-child(2){color : #fff; position : absolute; left : 0;top : 0;}

.active .t1 .premium-tit > p:nth-child(1) .char{transform: translateY(0);}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(1){transition :  .7s .4s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(2){transition :  .7s .45s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(3){transition :  .7s .4s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(4){transition :  .7s .55s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(5){transition :  .7s .6s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(6){transition :  .7s .65s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(7){transition :  .7s .7s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(8){transition :  .7s .75s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(9){transition :  .7s .8s}
.active .t1 .premium-tit > p:nth-child(1) .char:nth-child(10){transition : .7s .85s}

.t2 .premium-tit > p:nth-child(1) .char{transform: translateY(-100%);}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(1){transition :  .7s .4s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(2){transition :  .7s .45s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(3){transition :  .7s .4s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(4){transition :  .7s .55s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(5){transition :  .7s .6s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(6){transition :  .7s .65s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(7){transition :  .7s .7s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(8){transition :  .7s .75s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(9){transition :  .7s .8s}
.t2 .premium-tit > p:nth-child(1) .char:nth-child(10){transition : .7s .85s}

.active .t1 .premium-tit > p:nth-child(2) .char{transform: translateY(100%);}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(1){transition :  .7s .4s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(2){transition :  .7s .45s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(3){transition :  .7s .4s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(4){transition :  .7s .55s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(5){transition :  .7s .6s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(6){transition :  .7s .65s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(7){transition :  .7s .7s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(8){transition :  .7s .75s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(9){transition :  .7s .8s}
.active .t1 .premium-tit > p:nth-child(2) .char:nth-child(10){transition : .7s .85s}

.t2 .premium-tit > p:nth-child(2) .char{transform: translateY(0%);}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(1){transition :  .7s .4s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(2){transition :  .7s .45s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(3){transition :  .7s .4s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(4){transition :  .7s .55s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(5){transition :  .7s .6s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(6){transition :  .7s .65s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(7){transition :  .7s .7s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(8){transition :  .7s .75s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(9){transition :  .7s .8s}
.t2 .premium-tit > p:nth-child(2) .char:nth-child(10){transition : .7s .85s}


.premium-btn{display: flex;align-items: center; position : absolute; font-family: jost; font-size: 14px; letter-spacing: 0.15em;z-index: 10;width : 56px; height : 56px; border-radius: 50%; background: #08423A; white-space: nowrap; padding-left: 6px; transform: translateX(-50%) translateY(-50%) scale(.5); opacity: 0; transition : opacity 1s, transform 1s; color : #818181; pointer-events: none;}
.premium-btn b{color : #fff;}
.main-premium:hover .premium-btn{transform: translateX(-50%) translateY(-50%) scale(1); opacity: 1;}

.premium-navigation{display: none !important;}

/**/
.main-contact.active{
    .contact-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
    .contact-map{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
    .contact-con{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
    .contact-address-box::after{clip-path: inset(0); transition : 2s .4s;}

    .contact-line-tit{transform: translateX(0); opacity: 1; transition :1.2s 1s;}
    .contact-line-img{clip-path: inset(0); transition : 2.3s 1s;}
    .contact-line-con{transform: translateY(0); opacity: 1}
    .contact-line-con-01{transition : 1s 1.2s;}
    .contact-line-con-02{transition : 1s 1.5s;}
    .contact-line-con-03{transition : 1s 1.8s;}
    .contact-line-con-04{transition : 1s 2.1s;}

    .contact-qr{transform: scale(1); opacity: 1; transition : 1s 3s;}
}
.contact-bg{position : absolute; left : 0;top: 0;width : 100%; height : 100%; overflow: hidden;}
.contact-bg > img{width : 100%; height : 100%; object-fit: cover; object-position: center bottom; transform: scale(1.25); transition : 0s 1.2s;}
.active .contact-bg > img{transform: scale(1); transition :3s;}

.contact-inner{display: flex;flex-direction: column;align-items: center;justify-content: center; position : relative; padding-top: 60px;}

.contact-tit-box{display: flex;flex-direction: column;align-items: center; margin-bottom: 40px; transform: translateY(-100px);opacity: 0; transition : 0s 1.2s;}
.contact-tit{font-family: futura-pt; font-size: 59px; font-weight: 500; color : #294F51; margin-bottom: 10px;}
.contact-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; color : #242424; font-weight: 300;
    > b{font-weight: 600;}
}

.contact-container{display: flex; align-items: end; gap : 38px; margin-bottom: 80px;}
.contact-map{transform: translateX(-100px);opacity: 0; transition : 0s 1.2s;}

.contact-con{width : 369px; transform: translateX(100px);opacity: 0; transition : 0s 1.2s;}
.contact-address-box{display: flex; justify-content: space-between; padding-bottom: 36px; position : relative;
    &::after{position : absolute; content : ''; width : 100%; height : 1px; bottom : 0; left : 0; background: rgba(0,0,0,0.27); clip-path: inset(0 100% 0 0); transition : 0s 1.2s;}
    &+.contact-address-box{margin-top: 40px;}
}
.contact-address{font-family: PT; letter-spacing: -0.04em; font-size: 16px; font-weight: 500; color : #1F1F1F;
    > b{display: block; font-size: 20px; color : #294F51; margin-bottom: 10px;}
}

.contact-btn-box{display: flex; gap : 4px;}

.contact-line-box{display: flex; align-items: start;gap : 22px;}
.contact-line-tit{font-family: PT; font-size: 18px; letter-spacing: -0.03em; color : #004E50; margin-bottom: 48px; transform: translateX(-100px); opacity: 0; transition : 0s 1.2s;}
.contact-line{position : relative;}
.contact-line-img{clip-path: inset(0 100% 0 0); transition : 0s 1.2s;}
.contact-line-con{display: flex;flex-direction: column;align-items: center;justify-content: start; font-family: PT; gap : 6px; font-size: 17px; letter-spacing: -0.04em; font-weight: 600; color : #1C1C1C; position : absolute;  width : 0px; white-space: nowrap; top : calc(0% - 10px); transform: translateY(16px); opacity: 0; transition : 0s 1.2s;
    &.contact-line-con-01{left : 11%;}
    &.contact-line-con-02{left : 34%;}
    &.contact-line-con-03{left : 58%;}
    &.contact-line-con-04{left : 84%;}
}
.contact-icon{flex-shrink: 0; max-width: none;}

.contact-qr{transform: scale(1.5);opacity: 0; transition : 0s 1.2s}

/* NEW */
.on{
    .visual-bg > video{transform: scale(1);}
    .visual-apt{transform: scale(1.05) translateY(0); opacity: 1;}
    .visual-tit{transform: translateX(0); opacity: 1; transition : 1.4s}
    .visual-line{clip-path: inset(0); transition : 1.4s .7s}
    .visual-logo{transform: translateX(0); opacity: 1; transition : 1.4s 1.4s;}
}
.visual-slide{width : 100%; height : 100%;}
.visual-container{width : 100%; height : 100%; position : absolute; left : 0;top : 0;}
.visual-container > div{width : 100%; height : 100%; position : absolute; left : 0;top : 0;}

.visual-01{display: flex; align-items: start; justify-content: center;}
.visual-bg{position : absolute; left : 0;top : 0; width : 100%; height : 100%; overflow: hidden;}
.visual-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition :3s;}

.visual-apt{position :absolute; width : 100%; bottom : 0; left : 0; transform: scale(1.05) translateY(50%); opacity: 0; transition : 2s;}

.visual-tit-box{display: flex;align-items: center; position :relative; color : #fff; gap : 18px; padding-top: 18vh;}
.visual-tit{display: flex; font-family: NM; font-weight: 400; transform: translateX(-160px); opacity: 0; transition : 1.2s}
.visual-line{width : 156px; height : 1px; background: rgba(255,255,255,0.5); clip-path: inset(0 100% 0 0); transition : 1.2s}
.visual-logo{font-family: PT; font-size: 24px; font-weight: 600; letter-spacing: -0.06em; transform: translateX(160px); opacity: 0; transition : 1.2s;}

.visual-02{opacity: 0; transition : 1s; background: linear-gradient(45deg, rgba(0,0,0,0.9), rgba(0,0,0,0.7), rgba(0,0,0,0.9)); display: flex; align-items: center; justify-content: center; transition : 1s; z-index: 10; pointer-events: none;} 

.schedule-inner{display: flex; align-items: center; justify-content: space-between; width : 100%; max-width : 1570px; font-family: PT; padding-top: 100px;}

.t2{
    .visual-02{opacity: 1; pointer-events: all;}
    .schedule-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}

    .schedule-table > li{transform: translateY(0); opacity: 1; transition : color .3s, background .3s, transform 0.8s calc(var(--i) * 0.15s + 0.4s), opacity 0.8s calc(var(--i) * 0.15s + 0.4s);}
    .schedule-btn-box{transform: translateY(0px); opacity: 1; transition: transform 1.2s 1s, opacity 1.2s 1s;}
    .schedule-obj{transform: translateY(0) translateX(-50%); transition : 2s;}
}

.schedule-tit-box{display: flex;flex-direction: column;align-items: center; position : relative; transform: translateY(-100px); opacity: 0; transition : 0s 1.2s;}
.schedule-tit{font-family: jost; font-size: 62px; letter-spacing: 0.25em; font-weight: 500; color : #fff; padding-left: 0.25em; margin-bottom: 6px;}
.schedule-desc{font-family: PT; font-size: 18px; letter-spacing: -0.04em; font-weight: 400; color : #fff; margin-bottom: 74px;}

.schedule-table-box{display: flex;flex-direction: column;align-items: end; position : relative; width : 705px; transition : opacity 1s;}
.schedule-table{display: grid;grid-template-columns: repeat(2,1fr);gap : 10px; width : 460px; height : 545px;}
.schedule-table > li{display: flex;flex-direction: column;align-items: start;justify-content: start; border-radius: 10px; border : 1px solid rgba(255,255,255,0.4); font-family: HG; font-size: 18px; font-weight: 500; color : #D9D9D9; transform: translateY(50px); opacity: 0; transition : color .3s, background .3s, transform 1s, opacity 1s; padding : 30px;
    &.wide{grid-column: span 2;}
    &:hover, &.on{background: #fff; color : #9A9A9A;
        b{color : #025050}
    }
}

.schedule-table > li b{color : #fff; font-size: 22px; font-weight: 700; margin-bottom: 11px; transition :.3s;}

.schedule-btn-box{display: flex; gap: 10px; transform: translateY(100px); opacity: 0; transition: transform 1.2s 0.4s, opacity 1.2s 0.4s;}

.schedule-btn-box > a{display: flex; align-items: center; height: 45px;}
.schedule-btn-box > a > p{display: flex; align-items: center; justify-content: center; background: #fff; width: 168px; height: 100%; border-radius: 100px; font-family: HG; font-size: 15px; font-weight: 700; color : #02003C;}
.schedule-btn-box > a > .plus{display: flex; align-items: center; justify-content: center; width: 45px; height: 100%; border-radius: 50%; position: relative; background: #fff; transition: transform 0.3s;}
.schedule-btn-box > a:hover > .plus{transform: rotate(90deg);}
.schedule-btn-box > a > .plus::after{position: absolute; content: ''; width: 15px; height: 1px; background: #02003C;}
.schedule-btn-box > a > .plus::before{position: absolute; content: ''; width: 1px; height: 15px; background: #02003C;}
.schedule-btn-box > a:nth-child(2) > p, .schedule-btn-box > a:nth-child(3) > p{background: #004E50; color: #fff;}
.schedule-btn-box > a:nth-child(2) > .plus, .schedule-btn-box > a:nth-child(3) > .plus{background: #004E50;}
.schedule-btn-box > a:nth-child(2) > .plus::after, .schedule-btn-box > a:nth-child(2) > .plus::before, .schedule-btn-box > a:nth-child(3) > .plus::after, .schedule-btn-box > a:nth-child(3) > .plus::before{background: #fff;}


/*  */

.active{
    .complex-tit-box{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}
    .complex-img-01 img{transform: scale(1); transition : 3s;}
}
.complex-slide.t2{
    .complex-01{width : 58%; height : 55%}
    .complex-tit-box{transform: translateX(-160px); opacity: 0; transition : 1.2s;}
    .complex-img::after{opacity: 0;}
    .complex-con-tit-box{transform: translateX(0px); opacity: 1; transition : 1.2s;}

    .side-btn{transform: translateX(0); transition : 1.2s 1s;
        &::after{clip-path: inset(0); transition :1.2s 1s;}
    }

    .complex-right{transform: translateX(0);}
    .complex-img-name > span{transform: translateY(0); opacity: 1; transition : 1s .4s;}

    .complex-02 .complex-img img{transform: scale(1); transition : 3s;}
    .complex-list > li{transform: translateX(0); opacity: 1;
        &:nth-child(1){transition-delay: .4s;}
        &:nth-child(2){transition-delay: .6s;}
        &:nth-child(3){transition-delay: .8s;}
    }
}
.complex-slide{width : 100%;height : 100%;}

.complex-container{display: flex; position : absolute; left : 0;top : 0; z-index: 1; width : 100%; height : 100%;}
.complex-01,
.complex-02{width : 100%; height : 100%; position : absolute; transition : 1.2s; left : 0; bottom : 0;}

.complex-01{z-index: 1;}
.complex-02{display: flex; justify-content: space-between;}

.complex-img{overflow: hidden; position : relative;
    &.complex-img-01{width : 100%; height : 100%; position : absolute;
        &::after{position: absolute; content : ''; width : 100%; height : 100%; background: linear-gradient(45deg, rgba(0,0,0,0.9), rgba(0,0,0,0), rgba(0,0,0,0.9)); left : 0;top : 0; transition : 1s;}
    }
}
.complex-img img{width : 100%; height : 100%; transform: scale(1.25); object-fit: cover; object-position: center; transition : 0s 1.4s;}

.complex-tit-box{position : absolute; left : 176px; bottom : 135px; color : #fff; transform: translateX(-160px); opacity: 0; transition :0s 1.4s;}
.complex-tit{font-family: futura-pt; font-size: 62px; font-weight: 600; letter-spacing: 0.3em; margin-bottom: 10px;}
.complex-desc{font-family: PT; font-size: 18px; letter-spacing: -0.04em;}

.complex-con-tit-box{padding : 174px 0 0 118px; transform: translateX(-160px); opacity: 0; transition :1.2s;}
.complex-con-desc{font-family: PT; font-size: 20px; letter-spacing: -0.04em; color : #000612; margin-bottom: 36px;}
.complex-con-tit{font-family: NM;font-size: 38px; font-weight: 400; letter-spacing: -0.04em; color : #025050; line-height: 1.25em;}

.side-btn{display: flex;flex-direction: column;justify-content: end; align-items: center; gap : 10px; position :absolute; right : 0; top : 0; width : 46px; height : 100%; color : #fff; padding-bottom: 28px; transform: translateX(100%); transition : 0s 1.4s;
    &::after{position : absolute; content : ''; width : 1px; height : 100%; background: rgba(255,255,255,0.35); left : 0;top : 0; clip-path: inset(0 0 100%); transition : 0s 1.4s;}
    &.complex{background: #025050;}
    &.com{background: #877D77;}
    &.unit{background: #877D77;}
}
.side-btn > p{white-space: nowrap; transform: rotate(90deg) translateX(-50%) translateY(0%); transform-origin: center; font-family: PT; font-size: 15px; letter-spacing: -0.04em; color : #fff;}
.side-btn > p > span{font-family: jost; font-size: 15px; font-weight: 500; letter-spacing: 0.25em; margin-right: 13px; color : #fff;}

.complex-right{display: flex;flex-direction: column;justify-content: center; background: #F5F5F5;padding: 0 118px 0 476px; transform: translateX(100%); transition : 1.2s;}
.complex-list{margin-top: 42px;}
.complex-list > li{display: flex;flex-direction: column;align-items: start; padding-left: 18px; border-left: 1px solid #3E3E3E;font-size: 15px; letter-spacing: -0.04em; font-family: PT; gap : 6px; transform: translateX(-50px); opacity: 0; transition : 1.2s;
    &+li{margin-top: 38px;}
}
.complex-list > li > b{font-size: 17px; font-weight: 500; color : #025050;}

.complex-img-02,
.complex-img-03{display: flex;flex-direction: column;align-items: end; gap : 6px}
.complex-img + .complex-img{margin-top: 22px;}

.complex-img-inner{overflow: hidden;}

.complex-img-name{display: flex;align-items: center;justify-content: center; width : 110px; border-left : 1px solid #000; border-right: 1px solid #000; height : 18px;}
.complex-01 .complex-img-name{position :absolute; right : 0; bottom: 100%; margin-bottom: 12px;}
.complex-img-name > span{transform: translateY(100%); opacity: 0; transition : 1s; font-size: 15px; font-weight: 500; letter-spacing: -0.03em; font-family: PT;}

/*  */
.main-com.active{
    .com-tit-box{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}    
    .com-con-tit-box{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}
    .side-btn{transform: translateX(0); transition : 1.2s 1s;
        &::after{clip-path: inset(0); transition :1.2s 1s;}
    }
}
.active .swiper-slide-active{
    .com-list > li{transform: translateY(0); opacity: 1; transition : 1s;
        &:nth-child(1){transition-delay: .4s;}
        &:nth-child(2){transition-delay: .6s;}
        &:nth-child(3){transition-delay: .8s;}
    }
    .com-img{transform: translateY(0); opacity: 1; transition: 1s;
        &:nth-child(1){transition-delay: .8s;}
        &:nth-child(2){transition-delay: 1s;}
        &:nth-child(3){transition-delay: 1.2s;}
    }
    .com-obj{opacity: 1; transition : 1.2s;}
}
.main-com{background: #EFEDE8;}
.com-slide{width : 100%;height : 100%; mix-blend-mode: darken;}

.com-container{display: flex;align-items: start; flex-direction: column; position : absolute; left : 0;top : 0; z-index: 1; width : 100%; height : 100%; padding : 160px 0 0 118px;}

.com-slide .swiper-slide{display: flex; justify-content: space-between; padding : 0 118px;}

.com-tit-box{transform: translateX(-160px); opacity: 0; transition :1.2s; margin-bottom: 100px;}
.com-desc{font-family: PT; font-size: 20px; letter-spacing: -0.04em; color : #000612; margin-bottom: 36px;}
.com-tit{font-family: NM;font-size: 38px; font-weight: 400; letter-spacing: -0.04em; color : #025050; line-height: 1.25em;}

.com-con-tit-box{display: flex;flex-direction: column;align-items: start; transform: translateY(100px); opacity: 0; transition :1.2s;}
.com-con-tit{font-family: jost; padding : 14px 0; font-size: 33px; font-weight: 500; position : relative; text-transform: uppercase; margin-bottom: 24px;
    &::after{position : absolute; content : ''; left : 0;top : 0; width : 100%; height : 1px; background: #BEBEBE}
    &::before{position : absolute; content : ''; left : 0;bottom : 0; width : 100%; height : 1px; background: #BEBEBE}
}
.com-con-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; line-height: 1.5em;}

.com-obj{position : absolute; bottom : 0; opacity: 0; transition : 1s;}
.com-right{display: flex;flex-direction: column;align-items: end;justify-content: space-between;  padding : 180px 0 80px; }
.com-list{display: flex; gap : 24px;}
.com-list > li{display: flex;flex-direction: column;align-items: start; transform: translateY(50px); opacity: 0; transition : 1s;}
.com-list-tit-box{width : 100%; letter-spacing: -0.04em; font-family: PT; margin-bottom: 50px;}
.com-list-tit{ font-size: 20x; font-weight: 500; margin-bottom: 17px; border-left: 4px solid #877D77; padding-left: 15px;}
.com-list-desc{font-size: 16px; padding-left: 19px;}
.com-list-img{margin-left: 19px;}

.com-img-box{display: flex; gap : 9px;}
.com-img{position : relative; transform: translateY(50px); opacity: 0; transition : 1s;
    &.img-cut::after{position : absolute; content : '이미지컷'; right: 12px; bottom : 7px; color : #fff; font-size: 14px; letter-spacing: -0.04em; font-family: PT;}
}

/*  */
.active{
    .unit-bg > img,
    .unit-bg > video{transform: scale(1); transition :3s;}
    .unit-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
    .unit-right{transform: translateX(0); transition : 2s;}

    .side-btn{transform: translateX(0); transition : 1.2s 1s;
        &::after{clip-path: inset(0); transition :1.2s 1s;}
    }

    .unit-btn{transform: translateY(0); opacity: 1; transition : 1.2s;
        &.unit-btn-01{transition-delay: 1s;}
        &.unit-btn-02{transition-delay: 1.2s;}
        &.unit-btn-03{transition-delay: 1.4s;}
    }

	.unit-img > img,
	.unit-img > video{transform : scale(1); transition : 3s;}
}

.active .swiper-slide-active{
    .unit-slide-img{transform: translateY(0); opacity: 1; transition : 1s .4s;}
    .unit-slide-tit{transform: translateY(0); opacity: 1; transition : 1s .6s;}
    .unit-slide-line{transform: translateY(0); clip-path: inset(0); transition : 1s .8s;}
    .unit-slide-desc{transform: translateY(0); opacity: 1; transition : 1s 1s;}
}
.main-unit .fp-tableCell{display:block}
.unit-bg{position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.unit-bg > img,
.unit-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1.4s; filter: brightness(0.5);}

.unit-tit-box{position : absolute; padding : 237px 0 0 118px; color : #fff; transform: translateX(-160px); opacity: 0; transition :0s 1.4s;}
.unit-tit{font-family: futura-pt; font-size: 62px; font-weight: 600; letter-spacing: 0.3em; margin-bottom: 10px; color : #877D77;}
.unit-desc{font-family: PT; font-size: 18px; letter-spacing: -0.04em; color : #BEBEBE;}

.unit-right{display: flex;align-items: center; position : absolute; right : 0;top : 0; height :100%;background: rgba(0,0,0,0.5); overflow: hidden; padding : 0 118px 0 147px; transform: translateX(100%); transition : 0s 1.4s;}
.unit-right-inner{display: flex;align-items: end;gap : 157px;}

.unit-slide{display: flex;justify-content: center; width : 440px;}
.unit-slide-box{position :relative; display: flex;justify-content: center; width : 440px;}
.unit-navigation{position : absolute; top : 220px; display: flex; justify-content: space-between; color : #fff; width :145%; font-family: montserrat; font-size: 12px; font-weight: 600; letter-spacing: 0.25em;}
.unit-navigation > div{cursor : pointer;
    &.swiper-button-disabled{opacity: 0.5; pointer-events: none;}
}
.unit-navigation > div > img{transition : .5s;}

.unit-prev{display: flex;flex-direction: column;align-items: end;
    &:hover > img{transform: rotate(180deg) translateX(10px);}
}
.unit-prev > img{transform: rotate(180deg);}
.unit-next{
    &:hover > img{transform:translateX(10px);}
}

.unit-slide .swiper-slide{display: flex;flex-direction: column;align-items: center; pointer-events: none;}

.unit-slide-img{display: flex;align-items: center;justify-content: center; width : 100%; aspect-ratio: 1/1; background: #fff; border-radius: 50%; overflow: hidden; margin-bottom: 19px; transform: translateY(50px); opacity: 0; transition :1s;}
.unit-slide-img > img{max-width: 80%; max-height: 80%; object-fit: contain; object-position: center;}

.unit-slide-tit{font-family: jost; font-size: 33px; font-weight: 500; color : #fff; letter-spacing: -0.04em; margin-bottom: 5px; transform: translateY(50px); opacity: 0; transition :1s;}
.unit-slide-line{width : 100px; height : 1px; background: rgba(255,255,255,0.5); margin-bottom: 11px; transform: translateY(50px); clip-path: inset(0 100% 0 0); transition :1s;}
.unit-slide-desc{font-family: PT;font-size: 25px; letter-spacing: -0.04em; font-weight: 500; color : #fff; transform: translateY(50px); opacity: 0; transition :1s;}

.unit-slide-btn-tit{font-family: jost; font-size: 20px; letter-spacing: 0.25em; font-weight: 500; color : #C7A786; margin-bottom: 36px;}
.unit-slide-btn-box{display: grid;grid-template-columns: repeat(3, 1fr); gap : 19px 10px;}
.unit-slide-btn-box > li{width : 133px; border-bottom: 1px solid rgba(255,255,255,0.5); color : rgba(255,255,255,0.5); transition : .3s; text-align: center; padding-bottom: 6px; font-family: jost; font-size: 18px; font-weight: 500; letter-spacing: -0.04em; cursor : pointer; position : relative;
    &::after{position :absolute; content : ''; left : 0; bottom : -1px; background: #fff; width : 100%; height : 1px; clip-path: inset(0 100% 0 0); transition : .5s;}
    &.on, &:hover{color : #fff;
        &::after{clip-path: inset(0);}
    }
}

.unit-btn{transform: translateY(50px); opacity: 0; transition : 0s 1.4s; position :absolute;
    &.unit-btn-01{left : 118px; bottom : 104px;}
    &.unit-btn-02{right : 118px; top : 145px;}
}

.unit-img{width : 277px;height : 211px; margin-bottom: 19px; overflow: hidden; position : relative;}
.unit-img.img-cut::after{position : absolute; content : '이미지컷'; right : 13px; bottom : 6px; color : #fff; font-family: PT; font-weight: 500;}
.unit-img > img,
.unit-img > video{width : 100%;height : 100%; object-fit: cover; object-position: center; transform: scale(1.5); transition : 0s 1.4s;}

.unit-btn-tit{font-family: jost; font-size: 20px; letter-spacing: 0.25em; font-weight: 400; color : #C7A786; margin-bottom: 7px;}

.unit-btn-desc{font-family: PT; font-size: 15px; letter-spacing: -0.08em; white-space: nowrap; color : #fff;}
.dark .unit-btn-desc{color : #000}


@media(max-width : 1200px){
    #fullpage{overflow: hidden; width : 100vw;}
    .section{position : relative; overflow: hidden;}

    body.fixed{overflow : hidden;}
    /**/
    #intro{display: flex;align-items: center;justify-content: center; position : fixed; left : 0;top : 0; width : 100vw; height : 100vh;z-index: 1000; background: #004E50; perspective: 1000px; transition : 1s; overflow: hidden;
        &.t1{
            .intro-tit > p{opacity: 1; transition : 1.2s;
                &:nth-child(1){transform: translateY(-110px) translateX(0);}
                &:nth-child(2){transform: translateY(130px) translateX(0);}
            }
        }
        &.t2{
            .intro-bg{mask-size: 300vmax; transition :2s;}
            .intro-tit > p{transform: translateX(0) !important; transition : 1.2s;}
        }
        &.t3{
            .intro-tit-box{transform: translateX(0px);}
            .intro-line{width : 1px; height : 36px; margin-top : 10px;}
            .intro-logo{transform: translateX(0); opacity: 1;}
        }
        &.end{opacity: 0; pointer-events: none;}
    }
	
	.skip-btn{top : auto !important; left : 16px !important; right : auto !important; bottom : 16px !important; transform : translateX(0) !important; width : auto; height : auto; padding : 10px 20px; border-radius : 100px;
		&::after{border-radius: 100px; animation : skip-btn 1s infinite}
	}
	@keyframes skip-btn {
		0%{opacity: 1; transform: scaleX(1) scaleY(1);}
		100%{opacity: 0; transform: scaleX(1.25) scaleY(1.75); border-radius : 50%;}
	}

    .intro-bg{position : absolute;width : 100%;height : 100%; mask-image: url(../images/main/intro-mask.svg); mask-repeat: no-repeat;  mask-size : 200px; mask-position: center; clip-path: inset(100% 0 0); opacity: 0; transform: scale(1.25); transition : transform .5s, opacity 1.8s, clip-path 1.5s; z-index: 1;}
    .intro-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center;}
    .intro-obj{display: flex;align-items: center;justify-content: center; position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
    .intro-obj-box{display: flex;align-items: center; justify-content: center; position : absolute;
        &:nth-child(1){margin-right: 280px; margin-top: 160px;
            > span:nth-child(1){width : 16px; height : 240px; margin-right: 5px;margin-bottom: 30px; background: #166A6C;}
            > span:nth-child(2){width : 3px; height : 120px; margin-top: 160px; margin-right: 80px; background: #7AD9DD;}
            > span:nth-child(3){width : 8px; height : 120px; margin-left: 35px; background: #43C4CF;}
        }
        &:nth-child(2){margin-left:250px; margin-bottom: 120px;
            > span:nth-child(1){width : 3px; height : 220px; margin-left: 78px; margin-bottom: 200px; background: #fff;}
            > span:nth-child(2){width : 16px; height : 240px; background: #166A6C;}
        }
    }
    .intro-obj-box > span{width : 10px; height : 100px; background: pink; position : absolute; transform: rotate(29.5deg); border-radius: 100px; clip-path: inset(100% 0 0);}

    .intro-tit-box{display: flex;flex-direction: column; justify-content: center; align-items: center; position : relative; z-index: 1; color : #fff; transition : 1.2s;}
    .intro-tit{display: flex; flex-direction: column; align-items: center;  font-family: NM; font-size: 24px; font-weight: 400; line-height: 1.25em;}
    .intro-tit > p{opacity: 0; transition : 1.2s;
        &:nth-child(1){transform: translateY(-180px) translateX(0);}
        &:nth-child(2){transform: translateY(180px) translateX(0px);}
    }

    .intro-line{width : 1px;height: 0; transition : 1.2s; margin-bottom: 10px;}
    .intro-logo{font-family: PT; font-size: 16px; font-weight: 600; letter-spacing: -0.06em; position : static; transform: translateY(100px); opacity: 0; transition : 1.2s;}
    /**/

    .open-rotate-btn{width : 80px; height : 80px; right : 24px; bottom : 36px; font-size: 12px; 
        &::after{width : 100px; height : 100px; border-radius: 50%; overflow: hidden;}
        b{font-size: 18px;}
    }
    @keyframes rotate-text {
        100%{transform: rotate(360deg);}
    }
	
	.main-top-icon { position : absolute; margin-left: 20px; left: 0; top: 70px; width: 120px; }

    .main-icon {flex-direction: column;align-items: center;justify-content: center;width: 80px;height: 80px;right: 24px;position: fixed;top: auto;bottom: 140px;z-index: 100;font-size: 14px;font-family: PT;color: #ccc;letter-spacing: -0.04em; transition : 1s; pointer-events: none;;
        &.hide{transform: translateX(100px); opacity: 0;}
    }

    /**/
    /* .main-visual.on{
        .visual-tit > p{transform: translateX(0); opacity: 1;}
        .visual-logo{transform: translateY(0); opacity: 1; transition : 1.2s 1s;}
    }
    .visual-bg{position : absolute;width : 100%;height : 100%; left : 0;top : 0; filter: brightness(0.7);}
    .visual-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center;}

    .visual-inner{display: flex;justify-content: center; position : relative; padding-top: 20vh;}
    .visual-tit-box{text-align: center;}
    .visual-tit{flex-direction: column; font-size: 24px; margin-bottom: 12px; line-height: 1.4em;}
    .visual-logo{font-size: 16px;} */

    /**/

    .main-tip.active{
        .tip-tit-box{opacity: 1; transform: translateX(0);; transition : 1.2s .4s;}
        .tip-left::after{clip-path: inset(0); transition : 1.2s .4s;}
        .tip-list-tit{transform: translateX(0); opacity: 1; transition : 1.2s 1s}
        .tip-list > li{transform: translateX(0); opacity: 1; transition : 1.2s calc(var(--i) * 0.1s + 1s)}
    }
    .tip-bg{filter: brightness(0.5);}
    .tip-container{padding : 80px 12px;}
    .tip-inner{width : 100%;}
    .tip-tit-box{margin-bottom: 18px; transform: translateX(-100px);opacity: 0; transition : 1s; justify-content: center;}

    .tip-logo{font-size: 16px;}
    .tip-tit{font-size: 30px;}
    .tip-box{flex-direction: column; width : 100%;}
    .tip-left{padding-right: 0; position : relative; padding-bottom: 36px;
        &::after{position : absolute; content : ''; width : 100%; height : 1px; right : 0;top : auto; bottom : 0; background: rgba(255,255,255,0.3); clip-path: inset(0 100% 0 0); transition : 1s;}
    }
    .tip-right{padding-left: 0; padding-top: 36px;}
    .tip-list > li{color : #fff; font-family: PT; letter-spacing: -0.03em; font-weight: 700; font-size: 14px;}

    .tip-list-01 > li{flex-direction: column; justify-content: start;align-items: start;  gap : 14px; transform: translateX(-100px); opacity: 0; transition : 1s;
        &:nth-child(1){--i : 0;}
        &:nth-child(2){--i : 1;}
        &:nth-child(3){--i : 2;}
        &:nth-child(4){--i : 3;}
        &:nth-child(5){--i : 4;}
    }
    .tip-list-01 > li + li{margin-top: 18px;}

    .tip-list > li small{font-size: 12px;}
    .tip-num{width : 64px; height : 30px; font-size: 15px;} 

    .tip-list-tit{font-size: 16px; gap : 7px; margin-bottom: 36px; transition :1s;}
    .tip-list-tit > span{font-size: 24px;}
    .tip-list-02 > li{gap : 4px; transition :1s;}

    .tip-list-02 > li + li{margin-top: 18px;}
    .tip-check{width: 16px;}

    /**/
    .main-train{height : 480px; margin-top: 60px;}
    .main-train.active{
        .train-bg > video{transform: scale(1); transition : 3s;}    
        .train-subway > img{transform: translateY(0);
            &:nth-child(1){transition : 1s 1s;}
            &:nth-child(2){transition : 1s 1.2s;}
        }

        .train-tit-01{transform: translateX(0);opacity: 1; transition : 1s 1.4s;
            span{transform: scale(1);opacity: 1; transition : 1s 1.8s;}
        }
        .train-line{clip-path: inset(0); transition : 1s 2.2s;}
        .train-tit-02{transform: translateX(0);opacity: 1; transition : 1s 2.6s;
            span{transform: scale(1);opacity: 1; transition : 1s 3s;}
        }
    }
    .train-bg{filter: brightness(0.7);
        &::after{display: none;}
    }
    .train-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 1s;}

    .train-subway{display: flex; position :absolute; left : 10px; bottom : 0; gap : 6px; overflow: hidden;
        > img{transform: translateY(100%); transition : 1s; width : 36px;}
    }
    .train-tit-box{display: flex; flex-direction: column; align-items: center; position : relative; padding : 80px 0 0; color : #fff; position : relative; gap : 16px;}
    .train-line{width : 1px; height : 48px; background: rgba(255,255,255,0.7); clip-path: inset(0 0 100%); transition : 1s;}

    .train-tit{font-size: 24px; transition : 1s;}
    .train-tit span{transition : 1s;}
    .train-tit b{font-size: 36px;}

    .train-info{left : 98px; font-size: 9px; bottom : 5px; letter-spacing: -0.06em; gap : 3px;
        &::before{width : 14px; height : 14px; font-size: 8px;}
    }
    /**/


    .main-traffic{padding : 80px 12px 0;}
    .active{
        &.traffic-map{opacity: 1; transform: translateX(0); transition : 2s;}
        /* .traffic-bg-img{transform: translateX(0); opacity: 1; transition : 2s;} */
        &.traffic-map > img{
            &:nth-child(2){opacity: 1; clip-path: inset(16% 0 0% 0); transition : 2s 1s}
            &:nth-child(3){opacity: 1; clip-path: inset(0 60% 84% 0); transition : 1s 0.4s}
            &:nth-child(4){opacity : 1; clip-path: inset(0); transition : 3s 0.4s}
            &:nth-child(5){opacity : 1; clip-path : inset(0); transition : 3s 1s;}
            &:nth-child(6){opacity : 1; transform: translateY(0px); transition : 1s 2s;}
        }        
        .traffic-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
        .traffic-name{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}
        .traffic-line > *{opacity: 1; transform: translateX(0) scale(1) !important; clip-path: inset(0); transition : 1s calc(var(--i) * 0.1s + 1s);}
        .traffic-btn{opacity: 1; transform: translateY(0); transition : opacity 1.2s 1s, transform 1.2s 1s, background .3s, color .3s;;}
    }
    .traffic-map.active ~ .traffic-obj{transform: translateX(0); opacity: 1; transition : 1.6s;}

    .traffic-obj{position : absolute; bottom : 0; right : 0; opacity: 0; transition : 1s;
        &.traffic-obj-01{left : 12px;width : 240px; transform: translateX(-100%); }
        &.traffic-obj-02{left : 5px; width : 24px; transform: translateY(100%);}
    }

    .traffic-left{width : 100%; margin-bottom: 24px;}
    .traffic-left-inner{width : 100%;}
    .traffic-tit-box{margin-bottom: 48px;}
    .traffic-desc{font-size: 16px; margin-bottom: 6px;}
    .traffic-tit{font-size: 24px;}
    .traffic-list{margin-bottom: 36px;}
    .traffic-list > li{
        &+li{margin-top: 12px;}
    }
    .traffic-name{font-size: 15px; gap : 5px; margin-bottom: 8px;
        > img{width : 24px}
    }

    .traffic-line{display: flex; align-items: center;gap : 5px;}
    .traffic-line > span{font-size : 13px;
        &.point{font-size: 14px;}
        &.point b{font-size: 16px;}
    }
    .traffic-dot{width : 16px; height : 16px; border : 3px solid #0C3388;}
    .traffic-dot-line{flex : 1;}

    .traffic-btn{width : 174px; height : 48px; padding-left: 12px; font-size: 14px; gap : 5px; transition : 1s; transform: translateY(80px); opacity: 0;
        &:hover{background: #000; color : #fff;
            .traffic-arrow{filter: invert(1);}
        }
    }
    .traffic-arrow{width : 48px; transition : .3s;
        &::after{position : absolute; content : ''; width : 24px; height : 24px; background: #DEDEDE; border-radius: 50%; transform: translateX(40%); right : 0; z-index: -1; }
    }

    .traffic-map{position : relative; width : 100%; transform: translateY(50%); opacity: 0; transition : 1s; margin-bottom: 40px;}
    .traffic-map-img{position : absolute; left : 0;top : 0; width : 100%; height : 100%; object-fit: contain; object-position: center; transition : 1s;}

    .traffic-info{font-size : 11px; gap : 3px; right : 10px; bottom : 10px; padding : 3px 12px 3px 3px;}
    .traffic-info > span{width : 24px;height : 24px; font-size : 16px;}    
    .traffic-info-inner{gap : 16px;border-radius : 8px; padding : 80px 16px 24px; font-size : 14px; position : relative; max-width : 90%;}
    .traffic-info-inner::after{position : absolute; content : ''; width : 90%; height : 1px; background: rgba(0,0,0,0.2);top : 48px;}

    .traffic-info-inner li{
        position : relative; padding-left: 12px; font-size: 13px; line-height: 1.2em;
        &+li{margin-top: 3px;}
    }
    .traffic-info-inner > span{display: none;}
    .traffic-info-close{font-size : 30px; position : absolute; top : 10px; right : 16px;}


    /**/
    .main-premium{margin-top: 80px; height : 700px;}
    .premium-slide{width : 100%;
        &::before{display: none;}
        &::after{display: none;}
    }
    .premium-container{display: flex;justify-content: center;align-items: center; position :absolute; left : 0;top : 0; z-index: 1; width : 100%; height : 100%;}
    .premium-container > div:not(.premium-tit-box){display: flex;align-items:start;padding-top: 180px; padding : 140px 12px 0;}
    .premium-02{position : absolute; left : 100%;top : 0;}
    .active .t2 .premium-01{transform: translateX(-50%) scale(0.8);}
    .active .t2 .premium-02{transform: translateX(-100%);}

    .premium-inner{display: grid;grid-template-columns: repeat(1, 1fr); width : auto;position : relative; gap :16px; margin-bottom: 36px; height : auto; width : 100%;}

    .premium-bg{position : absolute; left : 0;top: 0;width : 100%; height : 100%; overflow: hidden;}
    .premium-bg > img{width : 100%; height : 100%; object-fit: cover; object-position: center bottom; transform: scale(1.25); transition : 1s;}
    .active .premium-bg > img{transform: scale(1); transition :3s;}

    .premium-con{display: flex; justify-content: start; align-items: start; padding : 0; margin : 0;}

    .premium-con-inner{display: flex; align-items: center; gap : 20px; margin : 0; padding : 0; white-space: nowrap;}
    .premium-img{position : relative; width : 136px; flex-shrink: 0;}
    .premium-img > img{opacity: 0; transition : 1.2s .4s;}

    .active .t1 .premium-01 .premium-img > img,
    .active .t2 .premium-02 .premium-img > img{opacity: 1; transform: translateX(0);}

    .active .t1 .premium-01 .premium-con:nth-child(1) .premium-img > img,
    .active .t2 .premium-02 .premium-con:nth-child(1) .premium-img > img{transition : 1.2s .4s;}

    .active .t1 .premium-01 .premium-con:nth-child(2) .premium-img > img,
    .active .t2 .premium-02 .premium-con:nth-child(2) .premium-img > img{transition : 1.2s .6s;}

    .active .t1 .premium-01 .premium-con:nth-child(3) .premium-img > img,
    .active .t2 .premium-02 .premium-con:nth-child(3) .premium-img > img{transition : 1.2s .8s;}

    .active .t1 .premium-01 .premium-con:nth-child(4) .premium-img > img,
    .active .t2 .premium-02 .premium-con:nth-child(4) .premium-img > img{transition : 1.2s 1s;}

    .premium-img > img:nth-child(1){transform: translateX(-50px) translateY(-50px);}
    .premium-img-text{position : absolute;right : -9px; bottom : -8px; transform: translateX(50px) translateY(50px);}

    .premium-con-01 .premium-img-text{width : 56px;}
    .premium-con-02 .premium-img-text{width : 56px;}
    .premium-con-03 .premium-img-text{width : 40px;}
    .premium-con-04 .premium-img-text{width : 56px;}
    .premium-con-05 .premium-img-text{width : 30px;}
    .premium-con-06 .premium-img-text{width : 50px;}
    .premium-con-07 .premium-img-text{width : 48px;}
    .premium-con-08 .premium-img-text{width : 42px;}

    .premium-con-box{padding-bottom: 16px; font-family: PT; letter-spacing: -0.03em; opacity: 0; transform: translateX(100px); transition : 1s .4s;}

    .active .t1 .premium-01 .premium-con-box,
    .active .t2 .premium-02 .premium-con-box{transform: translateX(0); opacity: 1; transition : 1.2s 1.4s;}

    .premium-con-tit{font-size: 14px; margin-bottom: 8px;}
    .premium-02 .premium-con-tit{color : #fff}
    .premium-con-desc{font-size: 12px; letter-spacing: -0.06em;}
    .premium-02 .premium-con-desc{color : #9A9A9A}

    .premium-tit-box{display: flex;flex-direction: column;align-items: center;justify-content: center; position :absolute;z-index: 10; top : 0; padding :40px 24px;}

    .premium-tit-desc-01{font-size: 16px;}
    .premium-tit-desc-02{font-size: 16px;}

    .active .premium-tit-desc-01,
    .active .premium-tit-desc-02{transform: translateY(0); opacity: 1; transition : 2s .4s;}

    .premium-tit{font-size: 46px; white-space: nowrap; margin-bottom: 10px;}

    .premium-tit .char{transform: translateY(-100%); transition : 1s;}
    .premium-tit > p:nth-child(2) .char{transform: translateY(100%);}
    .premium-tit > p:nth-child(2){color : #A5A5A5; position : absolute; left : 0;top : 0;}

    .active .t1 .premium-tit > p:nth-child(1) .char{transform: translateY(0);}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(1){transition :  .7s .4s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(2){transition :  .7s .45s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(3){transition :  .7s .4s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(4){transition :  .7s .55s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(5){transition :  .7s .6s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(6){transition :  .7s .65s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(7){transition :  .7s .7s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(8){transition :  .7s .75s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(9){transition :  .7s .8s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(10){transition : .7s .85s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(11){transition : .7s .9s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(12){transition : .7s 1s}
    .active .t1 .premium-tit > p:nth-child(1) .char:nth-child(13){transition : .7s 1.05s}

    .t2 .premium-tit > p:nth-child(1) .char{transform: translateY(-100%);}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(1){transition :  .7s .4s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(2){transition :  .7s .45s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(3){transition :  .7s .4s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(4){transition :  .7s .55s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(5){transition :  .7s .6s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(6){transition :  .7s .65s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(7){transition :  .7s .7s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(8){transition :  .7s .75s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(9){transition :  .7s .8s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(10){transition : .7s .85s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(11){transition : .7s .9s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(12){transition : .7s 1s}
    .t2 .premium-tit > p:nth-child(1) .char:nth-child(13){transition : .7s 1.05s}

    .active .t1 .premium-tit > p:nth-child(2) .char{transform: translateY(100%);}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(1){transition :  .7s .4s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(2){transition :  .7s .45s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(3){transition :  .7s .4s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(4){transition :  .7s .55s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(5){transition :  .7s .6s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(6){transition :  .7s .65s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(7){transition :  .7s .7s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(8){transition :  .7s .75s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(9){transition :  .7s .8s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(10){transition : .7s .85s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(11){transition : .7s .9s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(12){transition : .7s 1s}
    .active .t1 .premium-tit > p:nth-child(2) .char:nth-child(13){transition : .7s 1.05s}

    .t2 .premium-tit > p:nth-child(2) .char{transform: translateY(0%);}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(1){transition :  .7s .4s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(2){transition :  .7s .45s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(3){transition :  .7s .4s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(4){transition :  .7s .55s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(5){transition :  .7s .6s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(6){transition :  .7s .65s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(7){transition :  .7s .7s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(8){transition :  .7s .75s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(9){transition :  .7s .8s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(10){transition : .7s .85s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(11){transition : .7s .9s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(12){transition : .7s 1s}
    .t2 .premium-tit > p:nth-child(2) .char:nth-child(13){transition : .7s 1.05s}

    .premium-tit-desc {font-size: 15px;margin-bottom: 5px;position : relative;}
    .premium-tit-desc > span {font-family: AV;font-size: 24px;position: absolute;right: 100%;bottom: -50%;transform: rotate(-15deg) translateX(-50%);}

    .premium-btn{display: none;}
    .premium-navigation{position : absolute; bottom : 0; left : 50%; transform: translateX(-50%);z-index: 10; height : auto !important; width : 100% !important; display: grid !important; grid-template-columns: repeat(2,1fr);}
    .premium-navigation > div{display: flex;align-items: center; justify-content: center; height : 36px; background: #A5A5A5;}
    .premium-navigation > div::after{position : absolute; content : ''; width : 7px; height : 7px; border-top : 1px solid #fff; border-left : 1px solid #fff}
    .premium-prev{border-radius: 10px 10px 0 0;}
    .premium-prev::after{transform: rotate(-45deg);}

    .premium-navigation .swiper-button-disabled{opacity : 0.5;}

    .premium-next{border-radius: 10px 10px 0 0; background: #004E50 !important;}
    .premium-next::after{transform: rotate(135deg); border-color: #fff !important;}

    /**/
    .main-contact.active{
        .contact-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
        .contact-map{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
        .contact-con{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
        .contact-address-box::after{clip-path: inset(0); transition : 2s .4s;}

        .contact-line-tit{transform: translateX(0); opacity: 1; transition :1.2s 1s;}
        .contact-line-img{clip-path: inset(0); transition : 2.3s 1s;}
        .contact-line-con{transform: translateY(0); opacity: 1}
        .contact-line-con-01{transition : 1s 1.2s;}
        .contact-line-con-02{transition : 1s 1.5s;}
        .contact-line-con-03{transition : 1s 1.8s;}
        .contact-line-con-04{transition : 1s 2.1s;}

        .contact-qr{transform: scale(1); opacity: 1; transition : 1s 3s;}
    }
    .contact-bg{transition : 1s;}
    .active .contact-bg > img{transition :3s;}

    .contact-inner{padding : 48px 16px;}

    .contact-tit-box{margin-bottom: 24px; transition : 1s;}
    .contact-tit{font-size: 40px; margin-bottom: 6px;}
    .contact-desc{font-size: 14px;}
    .contact-container{display: flex; flex-direction: column; align-items: center; gap : 38px; margin-bottom: 48px;}
    .contact-map{transform: translateX(-100px);opacity: 0; transition : 1s;}

    .contact-con{width : 100%; transform: translateX(100px);opacity: 0; transition : 1s;}
    .contact-address-box{display: flex; justify-content: space-between; padding-bottom: 24px; position : relative;
        &::after{position : absolute; content : ''; width : 100%; height : 1px; bottom : 0; left : 0; background: rgba(0,0,0,0.27); clip-path: inset(0 100% 0 0); transition : 1s;}
        &+.contact-address-box{margin-top: 24px;}
    }
    .contact-address{font-family: PT; letter-spacing: -0.04em; font-size: 14px; font-weight: 500; color : #1F1F1F;
        > b{display: block; font-size: 16px; margin-bottom: 6px;}
    }

    .contact-btn-box{display: flex; gap : 4px;
        img{width : 30px}
    }

    .contact-line-box{display: flex;flex-direction: column;  align-items: center;gap : 48px;}
    .contact-line-tit{font-family: PT; font-size: 16px; letter-spacing: -0.03em; color : #004E50; margin-bottom: 36px; transform: translateX(-100px); opacity: 0; transition : 1s; text-align: center;}
    .contact-line{position : relative;}
    .contact-line-img{clip-path: inset(0 100% 0 0); transition : 1s;}
    .contact-line-con{display: flex;flex-direction: column;align-items: center;justify-content: start; font-family: PT; gap : 6px; font-size: 12px; letter-spacing: -0.04em; font-weight: 600; color : #1C1C1C; position : absolute;  width : 0px; white-space: nowrap; top : calc(0% - 10px); transform: translateY(16px); opacity: 0; transition : 1s;
        &.contact-line-con-01{left : 11%;}
        &.contact-line-con-02{left : 34%;}
        &.contact-line-con-03{left : 58%;}
        &.contact-line-con-04{left : 84%;}
        img{height : 30px;}
    }
    .contact-icon{flex-shrink: 0; max-width: none;}

    .contact-qr{transform: scale(1.5);opacity: 0; transition : 1s; width : 80px;}

    
    /* NEW */
    .main-visual{margin-bottom: 60px;}
    .on{
        .visual-bg > video{transform: scale(1);}
        .visual-apt{transform: scale(1.05) translateY(0); opacity: 1;}
        .visual-tit{transform: translateX(0); opacity: 1; transition : 1.4s}
        .visual-line{clip-path: inset(0); transition : 1.4s .7s}
        .visual-logo{transform: translateX(0); opacity: 1; transition : 1.4s 1.4s;}
    }
    .visual-container{width : 100%; height : 100%; position : static; left : 0;top : 0;}
    .visual-container > div{width : 100%; height : 100%; position : relative; left : 0;top : 0;}

    .visual-01{display: flex; align-items: start; justify-content: center;}
    .visual-apt{position :absolute; width : 100%; bottom : 0; left : 0; transform: scale(1.05) translateY(50%); opacity: 0; transition : 2s;}

    .visual-tit-box{display: flex;flex-direction: column; gap : 18px; padding-top: 24vh;}
    .visual-tit{transform: translateY(-100px); font-size: 18px;}
    .visual-line{width : 1px; height : 24px; background: rgba(255,255,255,0.5); clip-path: inset(0 0 100%); transition : 1.2s}
    .visual-logo{font-size: 16px; transform: translateY(100px);}

    .visual-02{opacity: 1; transition : 1s; background: #111; display: flex; align-items: center; justify-content: center; transition : 1s; z-index: 10; pointer-events: none;} 

    .schedule-inner{display: flex;flex-direction: column;  align-items: center; justify-content: space-between; width : 100%; max-width : 1570px; font-family: PT; padding : 0 16px 48px;}

    .visual-02.active{opacity: 1; pointer-events: all;
        .schedule-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}

        .schedule-table > li{transform: translateY(0); opacity: 1; transition : color .3s, background .3s, transform 0.8s calc(var(--i) * 0.15s + 0.4s), opacity 0.8s calc(var(--i) * 0.15s + 0.4s);}
        .schedule-btn-box{transform: translateY(0px); opacity: 1; transition: transform 1.2s 1s, opacity 1.2s 1s;}
        .schedule-obj{transform: translateY(0) translateX(-50%); transition : 2s;}
    }

    .schedule-tit-box{display: flex;flex-direction: column;align-items: center; position : relative; transform: translateY(-100px); opacity: 0; transition : 1s; order : 0;padding : 80px 0 24px;}
    .schedule-tit{font-family: jost; font-size: 36px; letter-spacing: 0.25em; font-weight: 500; color : #fff; padding-left: 0.25em; margin-bottom: 6px;}
    .schedule-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 400; color : #fff; margin-bottom: 0px; margin-bottom: 24px;}

    .schedule-table-box{display: flex;flex-direction: column;align-items: end; position : relative; width : 100%; transition : opacity 1s;}
    .schedule-table{display: grid;grid-template-columns: repeat(1,1fr);gap : 6px; width : 100%; height : auto; order : 2;
        &+.schedule-table{margin-top: 6px;}
    }
    .schedule-table > li{display: flex;flex-direction: column;align-items: start;justify-content: start; border-radius: 10px; border : 1px solid rgba(255,255,255,0.4); font-family: HG; font-size: 14px; font-weight: 500; color : #D9D9D9; transform: translateY(50px); opacity: 0; transition : color .3s, background .3s, transform 1s, opacity 1s; padding : 16px;
        &.wide{grid-column: span 1;}
        &:hover, &.on{background: #fff; color : #9A9A9A;
            b{color : #025050}
        }
    }

    .schedule-table > li b{color : #fff; font-size: 17px; font-weight: 700; margin-bottom: 6px; transition :.3s;}

    .schedule-btn-box{display: flex; gap: 5px; transform: translateY(100px); opacity: 0; transition: transform 1.2s 0.4s, opacity 1.2s 0.4s;}

    .schedule-btn-box > a{display: flex; align-items: center; height: 36px;}
    .schedule-btn-box > a > p{display: flex; align-items: center; justify-content: center; background: #fff; width: 120px; height: 100%; border-radius: 100px; font-family: HG; font-size: 13px; font-weight: 700; color : #02003C;}
    .schedule-btn-box > a > .plus{display: flex; align-items: center; justify-content: center; width: 36px; height: 100%; border-radius: 50%; position: relative; background: #fff; transition: transform 0.3s;}
    .schedule-btn-box > a:hover > .plus{transform: rotate(90deg);}
    .schedule-btn-box > a > .plus::after{position: absolute; content: ''; width: 15px; height: 1px; background: #02003C;}
    .schedule-btn-box > a > .plus::before{position: absolute; content: ''; width: 1px; height: 15px; background: #02003C;}
    .schedule-btn-box > a:nth-child(2) > p, .schedule-btn-box > a:nth-child(3) > p{background: #004E50; color: #fff;}
    .schedule-btn-box > a:nth-child(2) > .plus, .schedule-btn-box > a:nth-child(3) > .plus{background: #004E50;}
    .schedule-btn-box > a:nth-child(2) > .plus::after, .schedule-btn-box > a:nth-child(2) > .plus::before, .schedule-btn-box > a:nth-child(3) > .plus::after, .schedule-btn-box > a:nth-child(3) > .plus::before{background: #fff;}


    /*  */
    .main-complex{overflow: hidden; margin-bottom: 60px;
        &.active{
            .side-btn{transform: translateX(0); transition : 1.2s 1s;
                &::after{clip-path: inset(0); transition :1.2s 1s;}
            }
        }
    }
    
    .complex-01.active{
        .complex-tit-box{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}
        .complex-img-01 img{transform: scale(1); transition : 3s;}
        .complex-img-name > span{transform: translateY(0); opacity: 1; transition : 1s .4s;}
    }
    .complex-02.active{
        /* .complex-01{width : 58%; height : 55%} */
        .complex-tit-box{transform: translateX(-160px); opacity: 0; transition : 1.2s;}
        .complex-img::after{opacity: 0;}
        .complex-con-tit-box{transform: translateX(0px); opacity: 1; transition : 1.2s;} 

        .complex-right{transform: translateX(0);}
        .complex-img-name > span{transform: translateY(0); opacity: 1; transition : 1s .4s;}

        .complex-02 .complex-img img{transform: scale(1); transition : 3s;}
        .complex-list > li{transform: translateX(0); opacity: 1;
            &:nth-child(1){transition-delay: .4s;}
            &:nth-child(2){transition-delay: .6s;}
            &:nth-child(3){transition-delay: .8s;}
        }
    }
    .complex-slide{width : 100%;height : 100%;}

    .complex-container{display: flex; flex-direction: column; position : relative; z-index: 1; width : 100%; height : 100%;}
    .complex-01,
    .complex-02{width : 100%; height : 100%; position : relative; transition : 1.2s; left : 0; bottom : 0;}
    .complex-02{padding-bottom: 36px;}

    .complex-01{z-index: 1;}
    .complex-02{display: flex;flex-direction: column;justify-content: start;}

    .complex-img{overflow: hidden; position : relative;
        &.complex-img-01{width : 100%; height : 100%; position : relative;
            &::after{position: absolute; content : ''; width : 100%; height : 100%; background: linear-gradient(45deg, rgba(0,0,0,0.9), rgba(0,0,0,0), rgba(0,0,0,0.9)); left : 0;top : 0; transition : 1s;}
        }
    }
    .complex-img img{width : 100%; height : 100%; transform: scale(1.25); object-fit: cover; object-position: center; transition : 1s;}

    .complex-tit-box{position : absolute; left : 24px; bottom : 18px; color : #fff; transform: translateX(-160px); opacity: 0; transition :1s;}
    .complex-tit{font-family: futura-pt; font-size: 30px; font-weight: 600; letter-spacing: 0.3em; margin-bottom: 10px;}
    .complex-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em;}

    .complex-con-tit-box{padding : 48px 24px 0; transform: translateX(-160px); opacity: 0; transition :1.2s;}
    .complex-con-desc{font-family: PT; font-size: 15px; letter-spacing: -0.04em; color : #000612; margin-bottom: 24px;}
    .complex-con-tit{font-family: NM;font-size: 20px; font-weight: 400; letter-spacing: -0.04em; color : #025050; line-height: 1.25em; white-space: nowrap;}

    .side-btn{display: flex;flex-direction: row; justify-content: center; align-items: center; gap : 10px; position :absolute; right : 0; top : auto; bottom :0; width : 100%; height : 36px; color : #fff; padding-bottom: 0; transform: translateY(100%); transition : 1s;
        &::after{position : absolute; content : ''; width : 1px; height : 100%; background: rgba(255,255,255,0.35); left : 0;top : 0; clip-path: inset(0 0 100%); transition : 1s;}
        &.complex{background: #025050;}
        &.com{background: #877D77;}
        &.unit{background: #877D77;}
        
        img{transform: rotate(-90deg); height : 24px; margin-left: 10px;}
    }
    .side-btn > p{white-space: nowrap; transform: translateX(0); font-family: PT; font-size: 13px; letter-spacing: -0.04em; color : #fff;}
    .side-btn > p > span{font-family: jost; font-size: 14px; margin-right: 10px;}

    .complex-right{display: flex;flex-direction: column;justify-content: center; background: #F5F5F5;padding: 24px 24px 36px 24px; transform: translateY(100%); transition : 1.2s; margin-top: 24px;}
    .complex-list{margin-top: 42px;}
    .complex-list > li{display: flex;flex-direction: column;align-items: start; padding-left: 14px; border-left: 1px solid #3E3E3E;font-size: 14px; letter-spacing: -0.04em; font-family: PT; gap : 4px; transform: translateX(-50px); opacity: 0; transition : 1.2s;
        &+li{margin-top: 24px;}
    }
    .complex-list > li > b{font-size: 16px; font-weight: 500; color : #025050;}

    .complex-img-02,
    .complex-img-03{display: flex;flex-direction: column;align-items: end; gap : 6px}
    .complex-img + .complex-img{margin-top: 22px;}

    .complex-img-inner{overflow: hidden;}

    .complex-img-name{display: flex;align-items: center;justify-content: center; width : 110px; border-left : 1px solid #000; border-right: 1px solid #000; height : 12px;}
    .complex-01 .complex-img-name{position :absolute; right : 12px; bottom : auto; top : 100%; margin : 10px 0 0;}
    .complex-img-name > span{transform: translateY(100%); opacity: 0; transition : 1s; font-size: 13px; font-weight: 500; letter-spacing: -0.03em; font-family: PT;}

    /*  */
    .main-com{margin-bottom: 60px;}
    .main-com.active{
        .com-tit-box{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}    
        .com-con-tit-box{transform: translateX(0); opacity: 1; transition : 1.2s .4s;}
        .side-btn{transform: translateX(0); transition : 1.2s 1s;
            &::after{clip-path: inset(0); transition :1.2s 1s;}
        }
    }
    .swiper-slide.active{
        .com-list > li{transform: translateY(0); opacity: 1; transition : 1s;
            &:nth-child(1){transition-delay: .4s;}
            &:nth-child(2){transition-delay: .6s;}
            &:nth-child(3){transition-delay: .8s;}
        }
        .com-img{transform: translateY(0); opacity: 1; transition: 1s;
            &:nth-child(1){transition-delay: .8s;}
            &:nth-child(2){transition-delay: 1s;}
            &:nth-child(3){transition-delay: 1.2s;}
        }
        .com-obj{opacity: 1; transition : 1.2s;}
    }
    .main-com{background: #EFEDE8; padding-bottom: 36px;}
    .com-slide{display: flex;flex-direction: column; width : 100%;height : 100%; mix-blend-mode: darken;}
    .com-slide .swiper-wrapper{display: block !important; order : 2;}

    .com-container{display: flex;align-items: start; flex-direction: column; position : relative; left : 0;top : 0; z-index: 1; width : 100%; height : 100%; padding : 48px 24px; order : 1;}

    .com-slide .swiper-slide{display: flex; justify-content: space-between; padding : 0 16px;}

    .com-tit-box{transform: translateX(-160px); opacity: 0; transition :1.2s; margin-bottom: 36px;}
    .com-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; color : #000612; margin-bottom: 24px;}
    .com-tit{font-family: NM;font-size: 24px; font-weight: 400; letter-spacing: -0.04em; color : #025050; line-height: 1.25em; white-space: nowrap;}

    .com-con-tit-box{display: flex;flex-direction: column;align-items: start; transform: translateY(100px); opacity: 0; transition :1.2s;}
    .com-con-tit{font-family: jost; padding : 14px 0; font-size: 24px; font-weight: 500; position : relative; text-transform: uppercase; margin-bottom: 16px;
        &::after{position : absolute; content : ''; left : 0;top : 0; width : 100%; height : 1px; background: #BEBEBE}
        &::before{position : absolute; content : ''; left : 0;bottom : 0; width : 100%; height : 1px; background: #BEBEBE}
    }
    .com-con-desc{font-family: PT; font-size: 15px; letter-spacing: -0.04em; line-height: 1.5em;}

    .com-obj{position : absolute; bottom : 0; opacity: 0; transition : 1s; display: none;}
    .com-right{display: flex;flex-direction: column;align-items: end;justify-content: space-between;  padding : 36px 0; }
    .com-list{display: flex; flex-direction: column; gap : 24px;}
    .com-list > li{display: flex;flex-direction: column;align-items: start; transform: translateY(50px); opacity: 0; transition : 1s;}
    .com-list-tit-box{width : 100%; letter-spacing: -0.04em; font-family: PT; margin-bottom: 50px;}
    .com-list-tit{ font-size: 18px; font-weight: 500; margin-bottom: 12px; border-left: 3px solid #877D77; padding-left: 14px;}
    .com-list-desc{font-size: 14px; padding-left: 17px;}
    .com-list-img{margin-left: 17px; max-width: 80%;;}

    .com-img-box{display: flex; gap : 5px; margin-top: 36px;}
    .com-img{position : relative; transform: translateY(50px); opacity: 0; transition : 1s;
        &.img-cut::after{position : absolute; content : '이미지컷'; right: 5px; bottom : 5px; color : #fff; font-size: 10px; letter-spacing: -0.04em; font-family: PT;}
    }

    /*  */
    .main-unit{margin-bottom: 60px;}
    .active{
        .unit-bg > img,
        .unit-bg > video{transform: scale(1); transition :3s;}
        .unit-tit-box{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
        .unit-right{transform: translateX(0); transition : 2s;}

        .side-btn{transform: translateX(0); transition : 1.2s 1s;
            &::after{clip-path: inset(0); transition :1.2s 1s;}
        }

        .unit-btn{transform: translateY(0); opacity: 1; transition : 1.2s;
            &.unit-btn-01{transition-delay: 1s;}
            &.unit-btn-02{transition-delay: 1.2s;}
            &.unit-btn-03{transition-delay: 1.4s;}
        }
    }

    .active .swiper-slide-active{
        .unit-slide-img{transform: translateY(0); opacity: 1; transition : 1s .4s;}
        .unit-slide-tit{transform: translateY(0); opacity: 1; transition : 1s .6s;}
        .unit-slide-line{transform: translateY(0); clip-path: inset(0); transition : 1s .8s;}
        .unit-slide-desc{transform: translateY(0); opacity: 1; transition : 1s 1s;}
    }
    .main-unit .fp-tableCell{display:block}
    .unit-bg{position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
    .unit-bg > img,
    .unit-bg > video{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 1s; filter: brightness(0.5);}

    .unit-tit-box{position : static; padding : 36px 24px; color : #fff; transform: translateX(-160px); opacity: 0; transition :1s;}
    .unit-tit{font-family: futura-pt; font-size: 30px; font-weight: 600; letter-spacing: 0.3em; margin-bottom: 6px; color : #877D77;}
    .unit-desc{font-family: PT; font-size: 15px; letter-spacing: -0.04em; color : #BEBEBE;}

    .unit-right{display: flex; flex-direction: column; justify-content: center; align-items: center; position : static; right : 0;top : 0; height :100%;background: rgba(0,0,0,0.5); overflow: hidden; padding : 36px 24px; transform: translateY(100%); transition : 1s;}
    .unit-right-inner{display: flex; flex-direction: column; justify-content: center; align-items: center; gap : 48px; position :relative; width : 100%;}

    .unit-slide{display: flex;justify-content: center; width : 65vw}
    .unit-slide-box{position :relative; display: flex;justify-content: center; width : 100%;}
    .unit-navigation{position : absolute; top : 35%; display: flex; justify-content: space-between; color : #fff; width :92vw; font-family: montserrat; font-size: 9px; font-weight: 600; letter-spacing: 0.25em;}
    .unit-navigation > div{cursor : pointer;
        &.swiper-button-disabled{opacity: 0.5; pointer-events: none;}
    }
    .unit-navigation > div > img{transition : .5s; width : 38px;}

    .unit-prev{display: flex;flex-direction: column;align-items: end;
        &:hover > img{transform: rotate(180deg) translateX(0);}
    }
    .unit-prev > img{transform: rotate(180deg);}
    .unit-next{
        &:hover > img{transform:translateX(0);}
    }

    .unit-slide .swiper-slide{display: flex;flex-direction: column;align-items: center; pointer-events: none;}

    .unit-slide-img{display: flex;align-items: center;justify-content: center; width : 100%; aspect-ratio: 1/1; background: #fff; border-radius: 50%; overflow: hidden; margin-bottom: 19px; transform: translateY(50px); opacity: 0; transition :1s;}
    .unit-slide-img > img{max-width: 80%; max-height: 80%; object-fit: contain; object-position: center;}

    .unit-slide-tit{font-family: jost; font-size: 24px; font-weight: 500; color : #fff; letter-spacing: -0.04em; margin-bottom: 3px; transform: translateY(50px); opacity: 0; transition :1s;}
    .unit-slide-line{width : 80px; height : 1px; background: rgba(255,255,255,0.5); margin-bottom: 6px; transform: translateY(50px); clip-path: inset(0 100% 0 0); transition :1s;}
    .unit-slide-desc{font-family: PT;font-size: 16px; letter-spacing: -0.04em; font-weight: 500; color : #fff; transform: translateY(50px); opacity: 0; transition :1s;}

    .unit-slide-btn-container{width : 100%;}
    .unit-slide-btn-tit{font-family: jost; font-size: 18px; letter-spacing: 0.25em; font-weight: 500; color : #C7A786; margin-bottom: 24px;}
    .unit-slide-btn-box{display: grid;grid-template-columns: repeat(3, 1fr); gap : 19px 10px; width: 100%;}
    .unit-slide-btn-box > li{width : auto;; border-bottom: 1px solid rgba(255,255,255,0.5); color : rgba(255,255,255,0.5); transition : .3s; text-align: center; padding-bottom: 6px; font-family: jost; font-size: 16px; font-weight: 500; letter-spacing: -0.04em; cursor : pointer; position : relative;
        &::after{position :absolute; content : ''; left : 0; bottom : -1px; background: #fff; width : 100%; height : 1px; clip-path: inset(0 100% 0 0); transition : .5s;}
        &.on, &:hover{color : #fff;
            &::after{clip-path: inset(0);}
        }
    }

    .unit-btn{display: flex;flex-direction: column;align-items: start; transform: translateY(50px); opacity: 0; transition : 1s; position :relative; padding : 0; display : inline-block;width : 49%;
        &.unit-btn-01{left : auto; bottom : auto; padding-left: 24px; padding-right: 3px;}
        &.unit-btn-02{right :auto; top : auto; margin-top: 24px; margin-bottom: 64px; padding-right: 24px; padding-left: 3px;}
    }

    .unit-img{width : 100%;height : auto; aspect-ratio : 16/10; margin-bottom: 19px; overflow: hidden; position : relative;}
    .unit-img.img-cut::after{position : absolute; content : '이미지컷'; right : 13px; bottom : 6px; color : #fff; font-family: PT; font-weight: 500;}
    .unit-img > img,
    .unit-img > video{width : 100%;height : 100%; object-fit: cover; object-position: center; transform: scale(1.5); transition : 1s;}

    .unit-btn-tit{font-family: jost; font-size: 15px; letter-spacing: 0.2em; font-weight: 400; color : #C7A786; margin-bottom: 7px; white-space : nowrap;}

    .unit-btn-desc{font-family: PT; font-size: 13px; letter-spacing: -0.08em; white-space: nowrap; color : #fff;}
    .dark .unit-btn-desc{color : #000}

}