
.section{overflow: hidden;}

.open-rotate-btn{display: flex;flex-direction: column;align-items: center;justify-content: center; position : absolute; right : 77px; bottom : 58px; width : 98px; height : 98px;z-index: 1; color : #fff; transition : 1.4s; font-family: futura-pt, PT; font-family: 15px; font-weight: 700; transform: translateX(100px); opacity: 0; text-align: center; line-height: 1.4em; background: rgba(255,255,255,0.72); border-radius: 50%; padding-top: 0.5em;}
.open-rotate-btn.show{transform: translateX(0); opacity: 1;}
/* .open-rotate-btn b{font-size: 28px; font-size: 600;} */
.open-rotate-btn b{font-size: 24px; font-weight: 500; color : #02003C;}
.open-rotate-btn span{font-size: 18px;}
.open-rotate-btn::after{position : absolute; content : ''; width : 143px; height : 143px; background: url(../images/main/open-rotate-text.png)no-repeat center / contain; animation : rotate-text 8s infinite linear}
@keyframes rotate-text {
    100%{transform: rotate(360deg);}
}

.intro{display: flex;justify-content: center;align-items: center; position : absolute; width: 100%; gap :30px;top : 50%; transform: translateY(-50%); margin-left: 30px; font-size: 18px;letter-spacing: -0.04em; transition : 1.2s;}
.t2 .intro{gap : 700px;}
.intro-desc-01{font-family: GG;}
.intro-desc-02{font-family: PT; font-weight: 700; color :#1C1C1C;}
.intro-desc-02 span{color : #B49480}

.intro-desc-01 .char{opacity: 0; transform: translateY(-50px);}
.intro-desc-02 .char{opacity: 0; transform: translateY(50px);}


.visual-bg-slide{width : 100%; height : 100%;}

.visual-bg{position : absolute;left : 0;top : 0;width : 100%;height : 100%; z-index: 0; clip-path: inset(calc(50% - 25px) 50%); transition : 1.2s;}
.t2 .visual-bg{clip-path: inset(calc(50% - 25px) calc(50% - 320px));}
.t3 .visual-bg{clip-path: inset(0);}

.visual-bg::after{position : absolute; content : ''; width : 100%; height : 200px; background: linear-gradient(to bottom, rgba(0,0,0,0.4), transparent); left : 0;top : 0;}

.visual-bg > img,
.visual-bg > video{width : 100%;height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1.2s;}
.on .swiper-slide-active .visual-bg > img,
.on .swiper-slide-active .visual-bg > video{transform: scale(1); transition : 4s;}

.visual-inner{display: flex;justify-content: center; opacity: 1; position : relative; margin : 0 auto; max-width: 1460px; height : 100%; padding-top: 136px;}

.visual-tit-box{display: flex;flex-direction: column;align-items: center;}
.visual-desc-box{display: flex;align-items: center; gap : 15px; font-family: GG; margin-bottom: 32px;}
.visual-desc-01{font-size: 20px; color : #000;}
.white .visual-desc-01{color : #fff;}
.visual-desc-01 .char{opacity: 0; transition : 1s;}
.on .swiper-slide-active .visual-desc-01 .char{opacity: 1; transition : 1s; transition-delay: calc(var(--i) * .1s) !important;}

.visual-desc-line{width : 129px; height : 1px; background: rgba(0,0,0,0.3); background: rgba(0,0,0,0.3); clip-path: inset(0 100% 0 0); transition : 1s;}
.white .visual-desc-line{background: rgba(255,255,255,0.3);}
.on .swiper-slide-active .visual-desc-line{clip-path: inset(0); transition : 1s 1s;}
.visual-desc-02{font-size: 29px; font-weight: 700; transform: scale(1.5); opacity: 0; transition : 1s 1.4s; color : #0E033B;}
.white .visual-desc-02{color : #fff;}
.on .swiper-slide-active .visual-desc-02{transform: scale(1); opacity: 1;}

.visual-tit{}
.visual-tit path{fill:transparent;stroke:#0E033B;stroke-width:1;stroke-dasharray:500;stroke-dashoffset:500; transition : stroke-dashoffset 2s .4s, fill 1.4s 1.4s, stroke 1.4s 1.4s; stroke : #02003C;}
.on .swiper-slide-active .visual-tit path{stroke-dashoffset: 0; fill: #0E033B; fill : #02003C; stroke : transparent}

.visual-info{position : absolute; left : 30px; bottom : 16px; color : #02003C; font-size : 13px; font-family : PT; letter-spacing : -0.04em}

.visual-slide{width : 100%;height : 100%;}
.visual-container{position : absolute;width : 100%; height : 100%; left : 0;top : 0; display: flex; z-index: 1;}
.visual-container > div:not(.open-rotate-btn){width : 100%; height : 100%; flex-shrink: 0; position : absolute; left : 0;top : 0; z-index: 1;}

.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: 1; pointer-events: none;} 

.schedule-inner{display: flex; align-items: start; justify-content: space-between; width : 100%; max-width : 1570px;}

.show{
    .visual-02{opacity: 1; pointer-events: all;}
    .schedule-tit-box{transform: translateX(0); opacity: 1; transition : 1s .4s;}

    .schedule-table > li{transform: translateY(0); opacity: 1; transition : color .3s, background .3s, transform 1s calc(var(--i) * 0.1s + 0.4s), opacity 1s calc(var(--i) * 0.1s + 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{position : relative; transform: translateX(-100px); opacity: 0; transition : 0s 1s; margin-top: 120px;}
.schedule-tit{font-family: jost; font-size: 47px; letter-spacing: 0.25em; font-weight: 500; color : #fff;}
.schedule-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 400; color : #fff;}

.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(12,1fr);gap : 10px; margin-bottom: 26px; width : 100%;}
.schedule-table > li{display: flex;flex-direction: column;align-items: center;justify-content: center; grid-column: span 3; height : 169px; border-radius: 10px; border : 1px solid rgba(255,255,255,0.4); font-family: HG; font-size: 16px; font-weight: 500; color : #9D9D9D; transform: translateY(50px); opacity: 0; transition : color .3s, background .3s, transform 1s, opacity 1s;
    &.wide{grid-column: span 4;}
    &:hover, &.on{background: rgba(199,167,134,0.7); color : #fff;}
    &: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}
    &:nth-child(6){--i : 5}
    &:nth-child(7){--i : 6}
    &:nth-child(8){--i : 7}
}

.visual-bg-control{position :absolute; display: flex;align-items: center; left : 175px; bottom : 58px; z-index: 1; gap : 11px; transition : 1.2s; opacity: 0; transform: translateY(100px); pointer-events: none;;}
.on .visual-bg-control{transform: translateY(0); opacity: 1; pointer-events: all; transition : 1.2s 1s;}
.visual-bg-btn-box{display: flex;gap : 10px;}
.visual-bg-btn-box > li{width : 174px; height : 105px; overflow: hidden; cursor : pointer; filter: grayscale(1); transition : .5s;
    &.on{filter: grayscale(0);
        span.line:nth-child(1){width : 100%;}
        span.line:nth-child(2){height : 100%;}
        span.line:nth-child(3){width : 100%;}
        span.line:nth-child(4){height : 100%;}
    }
}
.visual-bg-btn-box > li > img{width : 100%;height : 100%;}
.visual-bg-prev,
.visual-bg-next{display: flex;align-items: center;justify-content: center; width : 28px;height : 28px; background: rgba(255,255,255,0.5); border-radius: 50%; cursor : pointer; padding-left: 2px;
    &::after{position : absolute; content: ''; width : 5px;height : 5px; border-top: 1px solid #000; border-left: 1px solid #000; transform: rotate(-45deg);}
}
.visual-bg-next{padding-left: 0; padding-right: 2px;}
.visual-bg-next::after{transform:rotate(135deg);}


.schedule-table > li b{color : #fff; font-size: 22px; font-weight: 700; margin-bottom: 6px;}

.schedule-btn-box{display: flex; gap: 19px; margin-left: auto; 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: #C7A786; color: #fff;}
.schedule-btn-box > a:nth-child(2) > .plus, .schedule-btn-box > a:nth-child(3) > .plus{background: #C7A786;}
.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;}

.schedule-obj{position :absolute; left : 50%; bottom : 0; transform: translateY(100%) translateX(-50%); transition : 0s 1s; width : 100%; max-width: 1570px; pointer-events: none;}


/* PREMIUM */
.premium-slide{width : 100%;height : 100%;}
.premium-container{display: flex; position : absolute; left : 0;top : 0; width : 100%;height : 100%; transition : 1.4s;}
.t3 .premium-container{transform: translateX(-100%);}
.premium-container > div{width : 100%;height : 100%; flex-shrink: 0; position : relative;}

.premium-bg{position : absolute; left : 0;top : 0; width : 100%;height : 100%; transition : 1.4s;z-index: -1; overflow: hidden;}
.premium-bg > img,
.premium-bg > video{transform: scale(1.5); transition : 0s 1.4s;}
.active .premium-01 .premium-bg > img,
.active .premium-01 .premium-bg > video{transform: scale(1); transition : 3s;}
.t3 .premium-02 .premium-bg > img,
.t3 .premium-02 .premium-bg > video{transform: scale(1); transition : 3s;}

.t2 .premium-01 .premium-bg,
.t3 .premium-01 .premium-bg{width : 33.3333%; filter: brightness(0.7);}
.premium-bg > img,
.premium-bg > video{width : 100%;height : 100%; object-fit: cover; object-position: center left;}

.premium-tit-box{padding : 0 225px 149px 0; color : #fff; position :absolute; bottom : 0; right : 0; transition : 1s;}
.t2 .premium-tit-box,
.t3 .premium-tit-box{opacity: 0; pointer-events: none;}
.premium-tit{font-family: jost; font-size: 75px; font-weight: 400; position : relative;}
.premium-tit .char{opacity: 0; transition : 0s 1.4s;}
.active .premium-tit .char{opacity: 1;}
.active .premium-tit .char:nth-child(1){transition : .7s 1s}
.active .premium-tit .char:nth-child(2){transition : .7s 1.1s}
.active .premium-tit .char:nth-child(3){transition : .7s 1.2s}
.active .premium-tit .char:nth-child(4){transition : .7s 1.3s}
.active .premium-tit .char:nth-child(5){transition : .7s 1.4s}
.active .premium-tit .char:nth-child(6){transition : .7s 1.5s}
.active .premium-tit .char:nth-child(7){transition : .7s 1.6s}
.active .premium-tit .char:nth-child(8){transition : .7s 1.7s}

.premium-tit > span{font-family: AV; font-size: 43px; font-weight: 700;position : absolute; white-space: nowrap; transform: rotate(-15deg) translateX(-100px); left : -80px; bottom : 70%; opacity: 0; transition : 0s 1.4s;}
.active .premium-tit > span{transform: rotate(-15deg) translateX(0); opacity: 1; transition : 1s 1s;}

.premium-list{display: grid;grid-template-columns: repeat(3, 1fr); position : absolute; left : 0;top : 0; width : 100%;height : 100%; transform: translateX(66.6666%); transition : 1.4s; opacity: 0; pointer-events: none;}
.t2 .premium-list,
.t3 .premium-list{transform: translateX(0); opacity: 1; pointer-events: all;}
.premium-list > li{position : relative;}
.premium-list > li::after{position : absolute; content : ''; width : 1px; height : 100%; top : 0; right : 0; background: rgba(0,0,0,0.1);}

.premium-con-tit-eng{font-family: jost; font-size: 30px; color : #B49480; margin-bottom: 24px; font-weight: 400; transform: translateY(-100px); opacity: 0; transition : 0s 1.4s;}
.t2 .premium-01 .premium-con-tit-eng{transform: translateY(0); opacity: 1; transition : 2s .4s;}
.t3 .premium-02 .premium-con-tit-eng{transform: translateY(0); opacity: 1; transition : 2s .4s;}


.premium-con-tit{font-family: GG; font-size: 20px; font-weight: 400; letter-spacing: -0.04em; color : #020202;margin-bottom: 27px; line-height: 1.5em; transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}
.t2 .premium-01 .premium-con-tit{transform: translateY(0); opacity: 1; transition : 2s .4s;}
.t3 .premium-02 .premium-con-tit{transform: translateY(0); opacity: 1; transition : 2s .4s;}

.white .premium-con-tit{color : #fff;}
.premium-con-desc{font-family: PT; letter-spacing: -0.04em; font-size: 15px; line-height: 1.6em; color : #5A5A5A; transform: translateX(100px); opacity: 0; transition : 0s 1.4s;}
.t2 .premium-01 .premium-con-desc{transform: translateY(0); opacity: 1; transition : 2s .4s;}
.t3 .premium-02 .premium-con-desc{transform: translateY(0); opacity: 1; transition : 2s .4s;}
.white .premium-con-desc{color : #fff;}

.premium-img{overflow: hidden; opacity: 0; transition : 0s 1.4s;}
.premium-list-02 .premium-img{transform: translateY(100px);}
.premium-list-03 .premium-img{transform: translateY(-100px);}
.premium-list-04 .premium-img{transform: translateY(100px);}
.premium-list-05 .premium-img{transform: translateY(-100px);}

.t2 .premium-01 .premium-img{transform: translateX(0); opacity: 1; transition : 2s .4s;}
.t3 .premium-02 .premium-img{transform: translateX(0); opacity: 1; transition : 2s .4s;}

.premium-img > img{transform: scale(1.5); transition : 0s 1.4s;}
.t2 .premium-01 .premium-img > img{transform: scale(1); transition : 3s;}
.t3 .premium-02 .premium-img > img{transform: scale(1); transition : 3s;}

.premium-list-01{display: flex; align-items: end; padding : 0 0 80px 92px;}
.premium-list-02{display: flex;justify-content: center; padding-top: 180px;}
.premium-list-02 .premium-con{display: flex;flex-direction: column; justify-content: center; height : 100%;}
.premium-list-02 .premium-img{margin-top: auto;}

.premium-list-03{display: flex;flex-direction: column; justify-content: start; padding : 148px 0 80px 90px;}
.premium-list-03 .premium-con{margin-top: auto;}
.premium-list-03 .premium-img{margin-left: auto;}

.premium-list-04{display: flex;flex-direction: column; padding-top: 217px;}
.premium-list-04 .premium-con{padding-left: 80px;}
.premium-list-04 .premium-img{margin-top: auto;}

.premium-list-05{display: flex;align-items: center;justify-content: center;}
.premium-list-05 .premium-img{margin-bottom: 67px;}
.premium-list-06{padding : 217px 0 0 92px}

.premium-text{font-family: jost; font-size: 15px; letter-spacing: 0.25em; writing-mode: vertical-lr; position :absolute; left : 7px;top : 129px; color : #222; opacity: 0; transition :1s;}
.t2 .premium-01 .premium-text,
.t3 .premium-02 .premium-text{opacity: 1;}

.premium-info{position : absolute; right : 30px; bottom : 16px; color : #fff; font-size : 13px; letter-spacing : -0.04em; font-family : PT;}

/* ENVI */
.envi-bg{position :absolute; left : 50%; top : 50%; transform: translateX(-50%) translateY(-50%) scale(1.5); z-index: -1; opacity: 0; transition : 0s 1.4s;}
.active .envi-bg{transform: scale(1) translateX(-50%) translateY(-50%); opacity: 1; transition : 3s;}
.envi-inner{display: flex;align-items: center; width : 100%; justify-content: center;max-width: 1920px; padding-top: 140px; margin : 0 auto;}
.envi-inner > div{width : 50%;}
.envi-left{display: flex;flex-direction: column;align-items: end;}
.envi-left .envi-list{display: flex;flex-direction: column; align-items: end;}

.envi-right{padding-left: 240px; transform: translateY(-52px);}
.envi-right .envi-list > li{display: flex;align-items: center;justify-content: space-between; width : 100%;}
.envi-con{width : 267px; white-space: nowrap;}
.envi-con-tit{font-family: GG; font-size: 20px; font-weight: 400; margin-bottom: 14px; color : #020202; transform: translateX(-50px); opacity: 0; transition : 0s 1.4s;}
.envi-con-desc{font-family: PT; font-size: 15px; letter-spacing: -0.04em; font-weight: 500; line-height: 1.5em; color : #5A5A5A; transform: translateX(50px); opacity: 0; transition : 0s 1.4s;}
.active .envi-con-tit,
.active .envi-con-desc{opacity: 1; transform: translateY(0); transition : 1.4s 1.8s;}

.envi-list > li{display: flex;}
.envi-list-01{gap : 60px}
.envi-list-02{gap : 60px; align-items: center;}
.envi-list-02 .envi-img{transform: translateX(-100%);}
.envi-list-03{gap : 60px; margin-bottom: 60px; align-items: end;}
.envi-list-04{gap : 60px; transform: translateX(-90%);}

.envi-list-05{margin-bottom: 52px;}
.envi-list-06{padding-right: 42px;}
.envi-list-07{padding-right: 220px; align-items: end !important;}
.envi-list-08{padding-left: 220px;transform: translateY(60px);align-items: start !important;}


.envi-img{opacity: 0; transition : 0s 1.4s;position : relative;}

.envi-list-01 .envi-img{top : -100px}
.envi-list-02 .envi-img{left : -100px}
.envi-list-03 .envi-img{left : 100px}
.envi-list-04 .envi-img{top : 100px}
.envi-list-05 .envi-img{top : -100px}
.envi-list-06 .envi-img{left : -100px}
.envi-list-07 .envi-img{left : 100px}
.envi-list-08 .envi-img{top : 100px}

/* .envi-list-06 .envi-img{transform: translateY(50%);} */
/* .envi-list-07 .envi-img{transform: translateY(30%);} */

.active .envi-img{opacity: 1; top : 0; left : 0;}
.active .envi-list-01 .envi-img{transition : 1.4s .4s;}
.active .envi-list-02 .envi-img{transition : 1.4s .55s;}
.active .envi-list-03 .envi-img{transition : 1.4s .7s;}
.active .envi-list-04 .envi-img{transition : 1.4s .85s;}
.active .envi-list-05 .envi-img{transition : 1.4s 1s;}
.active .envi-list-06 .envi-img{transition : 1.4s 1.15s;}
.active .envi-list-07 .envi-img{transition : 1.4s 1.3s;}
.active .envi-list-08 .envi-img{transition : 1.4s 1.45s;}


.envi-right .envi-list{display: flex;flex-direction: column;align-items: start;}

.envi-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: rgba(180,148,128,.34); white-space: nowrap; padding-left: 24px; transform: translateX(-50%) translateY(-50%) scale(.5); opacity: 0; transition : opacity 1s, transform 1s;}
.main-envi:hover .envi-btn{transform: translateX(-50%) translateY(-50%) scale(1); opacity: 1;}

/**/

.map-bg{width : 100%;height : 100%; position : absolute;left : 0;top : 0;}
.map-bg-img{width : 100%;height : 100%; object-fit: cover; object-position: center;}
.map-train{position : absolute; left : 0; bottom : 0; transform: translateX(-100%); opacity: 0; transition : 0s 1.4s;}
.active .map-train{transform: translateX(0); opacity: 1; transition :2s .4s;}

.map-subway{position : absolute; right : 39px; bottom : 0; transform: translateY(100%); opacity: 0; transition : 0s 1.4s;}
.active .map-subway{transform: translateY(0); opacity: 1; transition : 2s .4s;}

.map-inner{display: flex;align-items: center; justify-content: center;  position : relative; margin : 0 auto;gap : 80px;}

.map-tit-box{display: flex; align-items: center; margin-bottom: 145px; gap : 15px; font-family: PT;}
.map-tit-line{width : 80px; height :1px; background: #BFBFBF; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.active .map-tit-line{clip-path: inset(0); transition : 1s .8s;}
.map-desc{font-size: 32px; font-weight: 400;}
.map-desc .char{transform: translateY(-50px); opacity: 0; transition : 0s 1.4s;}
.active .map-desc .char{transform: translateY(0); opacity: 1;}
.active .map-desc .char:nth-child(1){transition : 1.2s .4s;}
.active .map-desc .char:nth-child(2){transition : 1.2s .5s;}
.active .map-desc .char:nth-child(3){transition : 1.2s .6s;}
.active .map-desc .char:nth-child(4){transition : 1.2s .7s;}
.active .map-desc .char:nth-child(5){transition : 1.2s .8s;}
.map-tit{font-size: 42px; font-weight: 700; color : #0E033B; transform: scale(1.5); opacity: 0; transition : 0s 1.4s;}
.active .map-tit{transform: scale(1); opacity: 1; transition : 1.2s 1s;}

.map-line{opacity: 0; transform: translateY(100px); transition : 0s 1.4s;}
.active .map-line{opacity: 1; transform: translateY(0);}
.active .map-line:nth-child(1){transition : 1.2s 1.2s;}
.active .map-line:nth-child(2){transition : 1.2s 1.4s;}
.active .map-line:nth-child(3){transition : 1.2s 1.6s;}
.map-line + .map-line{margin-top : 50px;}

.map-map{opacity: 0; transform: translateY(100px); transition : 0s 1.4s;}
.active .map-map{transform: translateY(0); opacity: 1; transition : 2s .4s;}
.map-img{box-shadow: 0 10px 20px rgba(0,0,0,0.16); position : relative;z-index: 1; border-radius: 20px; overflow: hidden; border : 2px solid #fff;}
.map-btn{display: flex;align-items: center;justify-content: space-between; width : 257px; height : 48px; border-radius: 0 0 21px 21px; color : #fff; background: #0E033B; padding : 0 29px 0 33px; font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 600; transform: translateY(-100%); transition : 0s 1.4s; position : relative;}

.map-btn::after{position : absolute; content : ''; width : 100%;height : 100%; bottom : 100%; background: #0E033B;left : 0;}
.active .map-btn{transform: translateY(0); transition : 1s 1.2s;}
.active .map-btn:hover{transform: translateY(10px); transition : .5s;}

/**/
.main-brand{background: url(../images/main/brand-bg.jpg)no-repeat center / cover;}
.brand-slide{width : 100%;height : 100%;}

.brand-slide .swiper-slide{display: grid; grid-template-columns: repeat(3, 1fr);}

.brand-left{display: flex;align-items: center;justify-content: center; padding-top : 120px; position : relative;}
.brand-left::after{position : absolute; content : ''; width :1px; height : 100%; background: #E0E0E0; right : 0; top : 0; clip-path: inset(0 0 100%); transition : 0s 1.4s;}
.active .swiper-slide-active .brand-left::after{clip-path: inset(0); transition : 2s 1s;}
.brand-left .brand-inner{display: flex;flex-direction: column; height : 100%;}
.brand-left .brand-img-box{margin-top: auto;}

.brand-tit-box{transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}
.active .swiper-slide-active .brand-tit-box{transform: translateX(0); opacity: 1; transition : 1.4s .4s;}
.brand-tit-eng{font-family: jost; font-size: 18px; letter-spacing: 0.25em; font-weight: 400; margin-bottom: 39px;}
.brand-tit{font-family: PT; font-size: 32px; letter-spacing: -0.04em; color : #0E033B; font-weight: 400;}

.brand-logo-01{margin-bottom: 34px;}

.brand-img{position : relative; overflow: hidden;z-index: 1;}
.brand-img > img{transform: scale(1.5); transition : 0s 1.4s;}
.active .swiper-slide-active .brand-img > img{transform: scale(1); transition : 3s;}
.brand-img-tag{position : absolute; top : 0; right : 0; background: rgba(0,0,0,0.45); color : #fff; font-family: PT; font-size: 17px; letter-spacing: -0.04em; padding : 7px 24px; transform: translateY(-100%); transition : 0s 1.4s;}
.active .swiper-slide-active .brand-img-tag{transform: translateY(0); transition : 1s 1s;}

.brand-left .brand-img-box{transform: translateY(100%); opacity: 0; transition : 0s 1.4s;}
.active .swiper-slide-active .brand-left .brand-img-box{opacity: 1; transform: translateY(0); transition : 1.4s .4s;}

.brand-center{display: flex;align-items: center;justify-content: center; position : relative;}
.brand-center::after{position : absolute; content : ''; width :1px; height : 100%; background: #E0E0E0; right : 0; top : 0; clip-path: inset(0 0 100%); transition : 0s 1.4s;}
.active .swiper-slide-active .brand-center::after{clip-path: inset(0); transition : 2s 1s;}
.brand-slide-02 .brand-center .brand-inner{width : 460px;}

.brand-sub-tit{padding-bottom: 16px; font-family: jost; font-size: 30px; font-weight: 400; position : relative;}
.brand-sub-tit > span{transform: translateY(-50px); opacity: 0; transition : 0s 1.4s; display: block;}
.active .swiper-slide-active .brand-sub-tit > span{transform: translateY(0); opacity: 1; transition : 1.4s 1s;}

.brand-sub-tit > img{position : absolute;right : 0; bottom :18px; opacity: 0; transition : 0s 1.4s;}
.active .swiper-slide-active .brand-sub-tit > img{opacity: 1; transition : 1s 1s;}

.brand-sub-tit::after{position :absolute; content : ''; width : 100%; height : 1px; background: #000; left : 0; bottom : 0; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.active .swiper-slide-active .brand-sub-tit::after{clip-path: inset(0); transition : 1s .4s;}

.brand-con-box{padding-top: 33px; font-family: PT; letter-spacing: -0.04em; margin-bottom: 100px;transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}
.active .swiper-slide-active .brand-con-box{transform: translateY(0); opacity: 1; transition : 1.4s 1s;}
.brand-con-desc{font-size: 18px; font-weight: 500; color : #A7A7A7; margin-bottom: 7px;}
.brand-con-tit{font-size: 36px; font-weight: 600; color : #0E033B;}

.brand-slide-02 .brand-list{margin-top: 69px;}

.brand-slide-01 .brand-list > li + li{margin-top: 60px;}
.brand-slide-02 .brand-list > li + li{margin-top: 30px;}

.brand-list-tit{font-family: jost; font-size: 20px; font-weight: 400; padding-bottom: 19px; position : relative;}

.brand-list-tit > span{transform: translateY(-50px); opacity: 0; transition : 0s 1.4s; display: block;}
.active .swiper-slide-active .brand-list-tit > span{transform: translateY(0); opacity: 1; transition : 1.4s 1s;}

.brand-list-tit > img{position : absolute;right : 0; bottom :18px; opacity: 0; transition : 0s 1.4s;}
.active .swiper-slide-active .brand-list-tit > img{opacity: 1; transition : 1s 1s;}

.brand-list-tit::after{position :absolute; content : ''; width : 100%; height : 1px; background: #D9D9D9; left : 0; bottom : 0; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.active .swiper-slide-active .brand-list-tit::after{clip-path: inset(0); transition : 1s .4s;}

.brand-list-desc{padding-top: 35px; font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 500; line-height: 1.5em; color : #383838; transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}
.active .swiper-slide-active .brand-list-desc{transform: translateY(0); opacity: 1; transition : 1.4s 1s;}
.brand-list-desc > b{display: block; font-size: 20px; font-weight: 600; margin-bottom: 19px; color : #1D2E55;}

.brand-right{display: flex;align-items: center;justify-content: center;}

.brand-img-list > li{opacity: 0; transition : 0s 1.4s;}
.brand-img-list > li + li{margin-top: 45px;}
.brand-img-list > li:nth-child(1){transform: translateX(-200px) translateY(-100px);}
.brand-img-list > li:nth-child(2){transform: translateX(200px) translateY(100px);}
.active .swiper-slide-active .brand-img-list > li{transform: translateX(0); opacity: 1; transition : 1.4s .4s;}
.brand-img-name{background: #000; color : #fff; text-align: center; padding : 7px 0; font-size: 17px; font-weight: 500; letter-spacing: -0.04em; font-family: PT; transform: translateY(-100%);z-index: -1;transition : 0s 1.4s;}
.active .swiper-slide-active .brand-img-name{transform: translateY(0); transition : 1s 1s;}



/**/

.contact-bg{position : absolute; left : 100%; transform: translateX(-100%); bottom : 0; width : 100%; height : 100%; overflow: hidden; transition : 1.4s;}
.contact-bg > img{width : 100%;height : 100%; object-fit: cover; object-position: center; transform: scale(1.5); transition : 3s;}
.fp-active .contact-bg > img{ transform: scale(1);}

.contact-tit-box{text-align : center; margin-bottom: 55px;}
.contact-tit{font-family : athena; font-size : 67px; font-weight : 400; margin-bottom: 29px; color : #B49480;}
.contact-tit .char{opacity : 0; transform : translateY(50px); transition : 1s;}
.fp-active .contact-tit .char{opacity : 1; transform : translateY(0)}
.fp-active .contact-tit .char:nth-child(1){transition-delay : .4s;}
.fp-active .contact-tit .char:nth-child(2){transition-delay : .5s;}
.fp-active .contact-tit .char:nth-child(3){transition-delay : .6s;}
.fp-active .contact-tit .char:nth-child(4){transition-delay : .7s;}
.fp-active .contact-tit .char:nth-child(5){transition-delay : .8s;}
.fp-active .contact-tit .char:nth-child(6){transition-delay : .9s;}
.fp-active .contact-tit .char:nth-child(7){transition-delay : 1s;}
.fp-active .contact-tit .char:nth-child(8){transition-delay : 1.1s;}

.contact-desc{padding : 12px 35px; font-size : 18px; font-family : pt; color : #fff; letter-spacing : -0.04em; border-top : 1px solid rgba(255,255,255,0.2); border-bottom : 1px solid rgba(255,255,255,0.2); opacity : 0; transform : translateY(50px); transition : 1.2s;}
.fp-active .contact-desc{transform : translateY(0); opacity : 1; transition : 1.2s .4s;}
.contact-inner{display : flex; flex-direction : column; align-items : center; position : relative;}
.contact-container{display : flex; gap : 43px;}

.contact-container > div{opacity : 0; transition : 1.2s;}
.contact-map-box:nth-child(1){transform : translateX(-100px);}
.contact-map-box:nth-child(2){transform : translateX(100px);}
.fp-active .contact-container > div{opacity : 1; transform : translateX(0); transition : 1.2s 1s;}

.contact-map{margin-bottom: 40px;}
.contact-address-box{display : flex; justify-content : space-between; align-items: center;}
.contact-address{display : flex; flex-direction : column; color : #fff; font-size : 16px; letter-spacing : -0.04em; font-weight : 500; }
.contact-address b{font-size : 25px; color : #B49480; margin-bottom: 5px; font-weight : 500;}
.contact-btn-box{display : flex;gap : 4px;}

/* NEW */

.main-complex{background: #02003C;}
.active{
    .complex-tit-box{transform: translateX(0); opacity: 1; transition : 2s .4s;}
    .complex-desc{transform: translateX(0); opacity: 1; transition : 2s .4s;}

    .complex-list > li{opacity: 1; transform: translateX(0) !important; transition : 2s .4s;}
    .complex-img > img{transform: scale(1); transition : 3s}
    .complex-img-name{transform: translateY(0); opacity: 1; transition : 2s .4s;
        &::after{clip-path: inset(0); transition : 2s 1s;}
    }
    .complex-btn{transform: translateX(0); transition : 2s 1.4s;
        &::after{clip-path: inset(0); transition :2s 1.4s;}
    }
    .complex-link{opacity: 1; transform: translateX(0); transition : 2s 1.4s;}

    .complex-tit-desc .char{opacity: 1; transition : 1s; transition-delay: calc(var(--i) * .1s);}
}
.main-complex .fp-tableCell{display: flex;align-items: center;justify-content: center; flex-direction: column;}
.complex-inner{display: flex;flex-direction: column;align-items: center; position : relative; padding-top: 100px;}
.complex-top{margin-bottom: 54px; width : 100%; display: flex; justify-content: space-between; align-items: end;}
.complex-tit-box{letter-spacing: -0.04em; transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}
.complex-tit-desc{font-family: GG; font-size: 20px; font-weight: 400; color : #fff; margin-bottom: 13px;}

.complex-tit-desc .char{opacity: 0; transition : 0s 1.4s;}

.complex-tit{font-family: PT; font-size: 42px; color : #C7A786; font-weight: 700;}
.complex-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 500; color : #aaa; white-space: nowrap; transform: translateX(100px); opacity: 0; transition : 0s 1.4s; line-height: 1.5em;}
.complex-list{display: flex; gap : 10px; margin-bottom: 80px;}
.complex-list > li{opacity: 0;transition : 0s 1.4s;
    &:nth-child(1){transform: translateX(-100px);}
    &:nth-child(3){transform: translateX(100px);}
}

.complex-img{overflow: hidden;}
.complex-img > img{transform: scale(1.5); transition : 0s 1.4s;}
.complex-img-name{padding : 10px 0; text-align: right; color : #fff; font-family: PT; position : relative; transform: translateY(50px); opacity: 0; transition : 0s 1.4s;
    &::after{position :absolute; content : ''; width : 100%; height : 1px; background: rgba(255,255,255,0.4); left : 0; bottom : 0; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
}

.complex-link{display: flex;align-items: center; gap : 16px; font-family: jost; font-size: 12px; font-size: 15px; color : #fff; align-self: end; transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}
.complex-link > .arrow{display: flex;align-items: center; position : relative;z-index: 1;}
.complex-link > .arrow::after{position : absolute; content : ''; width : 24px; height : 24px; background: #fff; border-radius: 50%; right : 0; transform: scale(1) translateX(30%);z-index: -1; transition : .3s;}
.complex-link:hover > .arrow::after{transform: scale(0.5) translateX(150%);}
.complex-link > .arrow > img{transition : .3s;}
.complex-link:hover .arrow > img{transform: translateX(10px);}

.complex-btn{display: flex;align-items: end; 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-btn > p{position : absolute; white-space: nowrap; transform: rotate(90deg) translateX(-100%) translateY(-50%); transform-origin: left bottom; font-family: PT; font-size: 15px; letter-spacing: -0.04em; color : #BCBCBC;}
.complex-btn > p > span{font-family: jost; font-size: 15px; font-weight: 500; letter-spacing: 0.25em; margin-right: 13px; color : #C7A786;}

/*  */

.main-com{background: #EFEDE8;}
.active{
    .com-tit-box{transform: translateX(0); opacity: 1; transition : 2s .4s;}
    .com-desc{transform: translateX(0); opacity: 1; transition : 2s .4s;}
    .com-tit-desc .char{opacity: 1; transition : 1s; transition-delay: calc(var(--i) * .1s);}

    .com-btn{transform: translateX(0); transition : 2s 1.4s;
        &::after{clip-path: inset(0); transition :2s 1.4s;}
    }
}
.active .swiper-slide-active{
    .com-list > li{transform: translateY(0); opacity: 1; transition : 1.2s;
        &:nth-child(1){transition-delay : .4s;}
        &:nth-child(2){transition-delay : .6s;}
        &:nth-child(3){transition-delay : .8s;}
    }
    .com-list-tit::after{clip-path: inset(0); transition : 1.2s 1s;}
    .com-list-desc{transform: translateY(0); opacity: 1; transition : 1.2s 1s;}

    .com-con-tit::after,
    .com-con-tit::before{clip-path: inset(0); transition : 1.2s 1s;}

    .com-con-tit > span{transform: translateY(0); opacity: 1; transition : 1.2s 1s;}

    .com-con-desc{transform: translateX(0); opacity: 1; transition : 1.2s 1s;}
}

.com-slide{width : 100%; height : 100%;}

.com-container{display: flex;justify-content: center; position :absolute; top : 0; left : 0; width : 100%; height : 100%;}
.com-tit-box{margin : 0 auto; width : 100%; max-width: 1570px; margin-top: 160px; transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}

.com-tit-desc{font-family: GG; font-size: 20px; font-weight: 400; color : #000; margin-bottom: 13px;}

.com-tit-desc .char{opacity: 0; transition : 0s 1.4s;}

.com-tit{font-family: PT; font-size: 42px; color : #84694E; font-weight: 700; margin-bottom: 36px;}
.com-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 500; color : #000; white-space: nowrap; transform: translateX(100px); opacity: 0; transition : 0s 1.4s; line-height: 1.5em;}

.com-btn{display: flex;align-items: end; position :absolute; right : 0; top : 0; width : 46px; height : 100%; color : #fff; padding-bottom: 28px; transform: translateX(100%); transition : 0s 1.4s; z-index: 1; background: #EFEDE8;;
    &::after{position : absolute; content : ''; width : 1px; height : 100%; background: #C6C6C6; left : 0;top : 0; clip-path: inset(0 0 100%); transition : 0s 1.4s;}
}
.com-btn > p{position : absolute; white-space: nowrap; transform: rotate(90deg) translateX(-100%) translateY(-50%); transform-origin: left bottom; font-family: PT; font-size: 15px; letter-spacing: -0.04em; color : #000;}
.com-btn > p > span{font-family: jost; font-size: 15px; font-weight: 500; letter-spacing: 0.25em; margin-right: 13px; color : #84694E;}

.com-inner{display: flex; align-items: start; justify-content: space-between; width : 100%; max-width: 1570px; margin : 0 auto; padding-top: 380px; height : 100%;}
.com-list{display: flex;gap : 19px;}
.com-list > li{transform: translateY(100px); opacity: 0; transition : 0s 1.4s;}
.com-img{position : relative; overflow: hidden;}
.com-img.img-cut::after{position : absolute; content : '이미지컷'; right : 13px; bottom : 6px; color : #fff; font-family: PT; font-weight: 500;}

.com-list-tit{padding : 20px 0; font-size: 20px; font-family: PT; font-weight: 500; letter-spacing: -0.04em; position :relative; width : 100%; text-align: center; margin-bottom: 20px;
    &::after{position : absolute; content : ''; width : 100%; height : 1px; left : 0; bottom : 0; background: #BEBEBE; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
}
.com-list-desc{font-size: 16px; font-family: PT; letter-spacing: -0.04em; font-weight: 400; color : #000; line-height: 1.5em; text-align: center; transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}

.com-con-tit{padding : 14px 0; font-size: 33px; font-family: jost; font-weight: 500; color : #070707; position : relative; margin-bottom: 24px; text-align: center;
    &::after{position :absolute; content :''; width : 100%; height : 1px; left : 0;top : 0; background: #BEBEBE; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
    &::before{position :absolute; content :''; width : 100%; height : 1px; left : 0;bottom : 0; background: #BEBEBE; clip-path: inset(0 0 0 100%); transition : 0s 1.4s;}
}
.com-con-tit > span{transform: translateY(50px); display: block; opacity: 0; transition : 0s 1.4s;}
.com-con-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 400; color : #000; line-height: 1.5em; margin-bottom: 90px; transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}
.com-slide-02 .com-con-desc{margin-bottom: 33px; text-align: right; transform: translateX(100px);}

/*  */

.active{
    .unit-side-btn{transform: translateX(0); transition : 2s 1.4s;
        &::after{clip-path: inset(0); transition :2s 1.4s;}
    }

    .unit-tit-box{transform: translateY(0); opacity: 1; transition : 2s .4s;}

    .unit-con-tit > b .char{opacity: 1; transition : 1s; transition-delay: calc(var(--i) * .1s + 1s);}
    .unit-link{opacity: 1; transform: translateY(0); transition :2s 1.4s;}

    .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 1s;}
    .unit-left{transform: translateX(0); transition :2s .4s;}
    .unit-container{transform: translateX(0); transition : 2s .4s;}
}
.unit-bg{position :absolute; left : 0;top: 0;width : 100%;height : 100%; filter: brightness(0.4);}
.unit-bg > video{width :100%;height : 100%; object-fit: cover; object-position: center;}
.unit-inner{display: flex; position :relative; width : 100%; height : 100%;}
.unit-left{display: flex; flex-direction: column;justify-content: space-between; background: #fff; padding : 220px 175px 120px 157px; transform: translateX(-100%); transition : 0s 1.4s;}

.unit-con-box{}
.unit-con-desc{font-family: PT; font-size: 15px; letter-spacing: -0.04em; font-weight: 500; color : #5A5A5A; line-height: 1.5em; margin-bottom: 43px;}
.unit-con-tit{font-family: GG; font-size: 20px; letter-spacing: -0.04em; color : #020202; font-weight: 400; line-height: 1.5em;}
.unit-con-tit > b .char{opacity: 0; transition : 0s 1.4s;}

.unit-right{display: flex;flex-direction: column;justify-content: space-between; align-items: start; padding:220px 0 120px 127px;}
.unit-tit-box{transform: translateY(-100px);opacity: 0; transition : 0s 1.4s;}
.unit-tit{font-family: jost; font-size: 37px; letter-spacing: 0.25em; color : #C7A786}
.unit-desc{font-family: PT; font-size: 15px; letter-spacing: -0.04em; color : #fff;}

.unit-link{display: flex;align-items: center; gap : 16px; font-family: jost; font-size: 12px; font-size: 15px; color : #fff; transform: translateY(50px); opacity: 0; transition : 0s 1.4s; letter-spacing: 0.25em;}
.unit-link > .arrow{display: flex;align-items: center; position : relative;z-index: 1;}
.unit-link > .arrow::after{position : absolute; content : ''; width : 24px; height : 24px; background: #fff; border-radius: 50%; right : 0; transform: scale(1) translateX(30%);z-index: -1; transition : .3s;}
.unit-link:hover > .arrow::after{transform: scale(0.5) translateX(150%);}
.unit-link > .arrow > img{transition : .3s;}
.unit-link:hover .arrow > img{transform: translateX(10px);}

.unit-container{display: flex;flex-direction: column; justify-content: center; gap : 150px; position : absolute; right : 0; height : 100%; top : 0; background: rgba(0,0,0,0.6); padding : 50px 175px 0 124px; transform: translateX(100%); transition :0s 1.4s;}

.unit-btn{transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}
.unit-btn-02{margin-left: 196px;}

.unit-btn-tit{font-family: jost; font-size: 20px; letter-spacing: 0.25em; font-weight: 400; color : #C7A786; margin-bottom: 7px;}

.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-desc{font-family: PT; font-size: 15px; letter-spacing: -0.08em; white-space: nowrap; color : #fff;}
.dark .unit-btn-desc{color : #000}


.unit-side-btn{display: flex;align-items: end; 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;}
}
.unit-side-btn > p{position : absolute; white-space: nowrap; transform: rotate(90deg) translateX(-100%) translateY(-50%); transform-origin: left bottom; font-family: PT; font-size: 15px; letter-spacing: -0.04em; color : #BCBCBC;}
.unit-side-btn > p > span{font-family: jost; font-size: 15px; font-weight: 500; letter-spacing: 0.25em; margin-right: 13px; color : #C7A786;}


.active{
    .unit-slide-bg > img{transform: scale(1); transition : 3s;}
    .unit-navigation{opacity: 1; transition : 1.2s 1s;}
    .unit-slide-btn-box > li{transform: translateY(0); opacity: 1;
        &:nth-child(1) {transition: color .3s, opacity 1.2s .4s, transform 1.2s .4s;}
        &:nth-child(2) {transition: color .3s, opacity 1.2s .5s, transform 1.2s .5s;}
        &:nth-child(3) {transition: color .3s, opacity 1.2s .6s, transform 1.2s .6s;}
        &:nth-child(4) {transition: color .3s, opacity 1.2s .7s, transform 1.2s .7s;}
        &:nth-child(5) {transition: color .3s, opacity 1.2s .8s, transform 1.2s .8s;}
        &:nth-child(6) {transition: color .3s, opacity 1.2s .9s, transform 1.2s .9s;}
        &:nth-child(7) {transition: color .3s, opacity 1.2s 1s, transform 1.2s 1s;}
        &:nth-child(8) {transition: color .3s, opacity 1.2s 1.1s, transform 1.2s 1.1s;}
        &:nth-child(9) {transition: color .3s, opacity 1.2s 1.2s, transform 1.2s 1.2s;}
        &:nth-child(10){transition: color .3s, opacity 1.2s 1.3s, transform 1.2s 1.3s;}
    }
}
.active .swiper-slide-active{
    .unit-slide-tit{transform: translateY(0); opacity: 1; transition : 1s .4s;}
    .unit-slide-desc{transform: translateY(0); opacity: 1; transition : 1s .6s;}
    .unit-slide-img{transform: translateY(0); opacity: 1; transition : 1s .8s;}
}
.unit-slide-box{display: flex;flex-direction: column;align-items: center;justify-content: center; flex : 1; background: pink; position :relative; overflow: hidden;}
.unit-slide-bg{position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.unit-slide-bg > img{width : 100%; height : 100%; object-fit: cover; object-position: center bottom; transform: scale(1.25); transition : 0s 1.4s;}

.unit-slide{display: flex;justify-content: center; width : 475px; margin-bottom: 90px; position : relative;}
.unit-slide .swiper-slide{display: flex;flex-direction: column;align-items: center; justify-content: center;}
.unit-slide-tit{font-family: futura-pt; font-weight: 700; font-size: 54px; margin-bottom: 18px; transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}
.unit-slide-desc{font-family: PT;font-size: 20px; letter-spacing: -0.04em; margin-bottom: 48px; transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}
.unit-slide-img{display : flex; align-items : center; justify-content : center; width :475px; height : 407px; transform: translateY(50px); opacity: 0; transition : 0s 1.4s;}
.unit-slide-img > img{width : 100%; height : 100%; object-fit: contain; object-position: center;}

.unit-slide-btn-box{display: flex; position :relative;}
.unit-slide-btn-box > li{display: flex;justify-content: center; width : 130px; padding-bottom: 12px; border-bottom : 1px solid #C9C9C9; color : #C9C9C9; transition :.3s; font-family: futura-pt; font-weight: 700; font-size: 18px; text-align: center; position : relative; transform: translateY(100px); opacity: 0; transition : 0s 1.4s; cursor : pointer;
    &.on, &:hover{color : #000;
        &::after{clip-path: inset(0);}
        &::before{transform: translateY(50%) scale(1);}
    }

    &::before{position : absolute; content : ''; width : 10px; height : 10px; border-radius: 50%; background: #000; bottom : -1px; transform: translateY(50%) scale(0); transition : .3s;}
    &::after{position : absolute; content : ''; width : 100%; height : 1px; background: #000; bottom: -1px; left : 0; clip-path: inset(0 100% 0 0); transition : .3s;}
}

.unit-navigation{display: flex;justify-content: space-between; position : absolute; width : 160%; top : 70%; transform: translateY(-50%); z-index: 1; opacity: 0; transition : 0s 1.4s;}
.unit-navigation > div{display: flex;flex-direction: column; font-family: jost; font-size: 14px; font-weight: 600; align-items: end; cursor : pointer;
    &.unit-next{align-items: start;
        img{transform: rotate(180deg);}
    }
}
.unit-navigation > div > img{transition : .5s;}
.unit-navigation > div:hover > img{transform: translateX(-10px);}
.unit-navigation > .unit-next:hover > img{transform: rotate(180deg) translateX(-10px);}