body.fixed{overflow : hidden;}
.section{position : relative; overflow : hidden;}
.swiper-wrapper{transition-timing-function : cubic-bezier(0.4, 0, 0.2, 1) !important;}

.skip-btn{display: flex;align-items: center;justify-content: center; position : absolute; width: 80px; font-family: jost; right : 16px; bottom : 20px; z-index: 1000; transform: translateX(-50%) translateY(-50%) scale(0); border-radius: 50%; color : #fff; letter-spacing: 0.1em; font-weight: 600; font-size: 24px; transition : transform .5s; padding : 10px 10px;}
.skip-btn.on{transform: scale(1);}
.end .skip-btn{transform: scale(0); pointer-events: none;}
.skip-btn::after{position : absolute; content : ''; width : 100%;height : 100%; background: rgba(0,0,0,0.2); border-radius: 50%; animation : skip-btn 1s infinite}
@keyframes skip-btn {
    0%{opacity: 1; transform: scale(1);}
    100%{opacity: 0; transform: scaleX(1.5) scaleY(1.5);}
}

/* intro */
#intro{display: flex;flex-direction : column;align-items: center;justify-content: center; position : fixed; left : 0;top : 0; width : 100%; height : 100%; z-index: 10000; background: #0f3a30; perspective: 1000px; transition : 1s;
    &.on{
		.intro-bg > img{transform : scale(1)}
	}
    &.end{opacity: 0; pointer-events: none;}
	&.t2{
		.intro-logo-text{opacity: 1; transform: translateX(0);}
	}
}

.intro-bg{display: flex;flex-direction: column;justify-content: center;align-items: center; position : absolute; left : 0;top : 0; overflow: hidden; width : 100%; height : 100%; perspective: 1000px;}
.intro-bg > img{transform : scale(1.5); transition : 5s; width : 100%; height : 100%; object-fit : cover; object-position : center;}

.intro-bg-01{display: flex; background: #0f3a30; width : 100%; flex : 0.72 0 0; flex-shrink: 0;}
.intro-bg-01 > b{background: #6d8878; height : 100%; flex-shrink: 0; width : 6vw;
    &:first-child{margin-left: 34.5000vw;}
    &:nth-child(2n + 1){margin-right: 17.7000vw;}
}

.intro-bg-02{display: flex; background: #0f3a30; width : 100%; flex : 1 0 0; flex-shrink: 0;}
.intro-bg-02 > b{background: #6d8878; height : 100%; flex-shrink: 0; width : 6vw;
    &:first-child{margin-left: 34.5000vw;}
    &:nth-child(2n + 1){margin-right: 17.7000vw;}
    &:nth-child(2){margin-right: 50vw;}
}
.intro-bg b{opacity: 0; transform: scale(0);}

.intro-logo{position : absolute; left : 50%; top : 50%; transform: translate(-50%,-50%) scale(0.7); opacity: 0; z-index: 1; transition : 0s 1.4s;
    &.on{transform: translate(-50%,-50%) scale(1); opacity: 1; transition : 1.4s;}
}
.intro-logo > img{width : 100%; height : 100%; object-fit: contain; display: block;}

.logo-ani{position : relative; width : 36vw; transform: scale(1.25) rotateY(-45deg); transition : 0s 1.4s;
    &.on{transform: scale(1) rotateY(0deg); transition : 2s;}
}
.logo-ani > img{position : absolute; opacity: 0; left : 0;top : 0; width : 100%; transition : 0s 1.4s;
    &:first-child{position : static;}
    &:nth-child(2){transform: translateX(-6.6667vw);}
    &:nth-child(3){transform: translateY(-6map-more-btn.6667vw);}
    &:nth-child(4){transform: translateX(6.6667vw);}
    &:nth-child(5){transform: translateY(6.6667vw);}
    &:nth-child(6){transform: translateY(-6.6667vw);}
    &:nth-child(7){transform: translateY(6.6667vw);}
}
.logo-ani.on > img{opacity: 1; transform: translateX(0); transition : 2s;}

.intro-logo-text{transform :translateY(80px); opacity : 0; transition : 2s; width : 70vw; margin-top: 10vw;}

.intro-dim{display: flex;flex-direction: column; position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.intro-dim > span{background: #fff; width : 100%; height : 20%; transform: scaleX(1.25);
    &:nth-child(2n + 1){border-radius: 40vw 0 0 40vw; transform: scaleX(1.25) translateX(100%);}
    &:nth-child(2n + 2){border-radius: 0 40vw 40vw 0; transform: scaleX(1.25) translateX(-100%);}
}

.logo-02.big {
	margin-top: 7px;
    margin-left: -3px;
}
.logo-02.small {
	margin-top: 5px;
    margin-left: -2px;
}

/* common */
.more-btn{display: flex;align-items: center;justify-content: center; width : 26.6667vw; height : 8.5333vw; border : 1px solid rgba(20,56,47,0.4); border-radius: 100px; font-family: 'IBM Plex Sans KR', PT, sans-serif; font-size: 2.9333vw; letter-spacing: -0.05em; color : #14382f; position : relative;
    &::after{content : ''; width : 1.6000vw; height : 1.6000vw; border-top : 1px solid #14382f; border-right : 1px solid #14382f; transform: rotate(45deg); margin-left: 1.3333vw;}
}

/* quick */
.quick-menu{ position : fixed; left : 0; bottom : 0; width : 100%; z-index: 500;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(2, 1fr);
}
.quick-open,
.quick-open2,
.quick-open3,
.quick-open4 a,
.quick-open5 a { display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px;
  box-sizing: border-box;}
.quick-open{background: #dce8d8;}
.quick-open2{background: #ffffff;}
.quick-open3{background: #14382f;}
.quick-open4{background: #6e8a7a;}
.quick-open5{background: #9a7640;}
.quick-open > img{ height: 15px; }
.quick-open2 > img{ height: 15px; }
.quick-open3 > img{ height: 26px; }
.quick-open4 > a > img{ height: 15px; }
.quick-open5 > a > img{ height: 15px; }

.quick-menu > *:nth-child(1) {
    grid-column: 1 / 4;
    grid-row: 1;
}

.quick-menu > *:nth-child(2) {
    grid-column: 4 / 7;
    grid-row: 1;
}

.quick-menu > *:nth-child(3) {
    grid-column: 1 / 4;
    grid-row: 2;
}

.quick-menu > *:nth-child(4) {
    grid-column: 4 / 7;
    grid-row: 2;
	display: flex;
    align-items: center;
    justify-content: center;
}

.quick-menu > *:nth-child(5) {
    grid-column: 5 / 7;
    grid-row: 2;
	display: flex;
    align-items: center;
    justify-content: center;
}

/* visual */
.main-visual{height : 100vh; min-height: 133.3333vw; background: #000;
    &.active{
        .visual-tit > img{transform: translateX(0); opacity: 1;}
        .visual-logo{transform: translateY(0); opacity: 1; transition : 2s 1.8s;}
    }
}
.visual-slide{position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.visual-slide .swiper-wrapper{width : 100%; height : 100%;}
.visual-slide .swiper-slide{width : 100%; height : 100%;}
.visual-slide .visual-bg-img{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1.4s; display: block;}
.main-visual.active .visual-slide .swiper-slide-active .visual-bg-img{transform: scale(1); transition : 4s;}

.visual-inner{display: flex;flex-direction: column;align-items: center; width : 100%; height : 100%; padding-top: 37.3333vw; position : relative; z-index: 1;}
.visual-tit-box{display: flex;flex-direction: column;align-items: center; position : relative;}
.visual-tit{display: flex;justify-content: center; position : relative; width : 56vw; margin-bottom: 6.6667vw;}
.visual-tit > img{width : 100%; position : absolute; left : 0;top : 0; opacity: 0; transition : 2s;
    &:first-child{left : auto; width: 29.0667vw; margin-left: 2.6667vw; transform: translateY(-10.6667vw);}
    &:nth-child(2){position : static; margin-top: 2.6667vw; transform: translateX(-10.6667vw);}
    &:nth-child(3){transform: translateX(10.6667vw);}
}
.visual-tit-svg{width : 36.5333vw; height : auto; position : absolute; left : 50%; bottom : 0; transform: translateX(-50%);}
svg path{stroke : #fff; stroke-width: 15px; stroke-dasharray : var(--length); stroke-dashoffset: var(--length); fill: transparent;}

.visual-logo{width : 37.3333vw; transform: translateY(4.8000vw); opacity: 0; transition : 1s;}

.visual-btn-box{display: flex; position : absolute; left : 0; bottom : 0; width : 100%; z-index: 2; background: rgba(20,56,47,0.92); transform: translateY(100%); opacity: 0; transition : 0s 1.4s;}
.visual-btn{display: flex;align-items: center;justify-content: center; width : 50%; height : 14.6667vw; color : #fff; font-family: 'IBM Plex Sans KR', PT, sans-serif; font-size: 3.4667vw; letter-spacing: -0.05em; position : relative;
    &:last-child{font-weight: 700;}
    &+.visual-btn::before{position : absolute; content : ''; width : 1px; height : 4vw; background: rgba(255,255,255,0.3); left : 0; top : 50%; transform: translateY(-50%);}
}
.visual-btn > b{font-weight: 700; margin-right: 1.0667vw;}
.open-rotate-btn{display: flex;align-items: center;justify-content: center; background: #14382f; width : 15.4667vw; height : 15.4667vw; position : absolute; right : 5.3333vw; top : 20.6667vw; z-index: 1; border-radius: 50%; transition : 1.2s; opacity: 0; transform: translateX(10.6667vw);}
.open-rotate-btn::after{position : absolute; content : ''; width : 19.6000vw; height : 19.6000vw;  background: url(/assets/images/main/open-rotate-text.png)no-repeat center / contain; animation : rotate-text 8s infinite linear;}
.open-rotate-btn>img {width: 10vw;}
@keyframes rotate-text{
    100%{transform: rotate(360deg);}
}
.main-visual.active .open-rotate-btn{opacity: 1; transform: translateX(0);}

/* overview */
.main-overview{background: #fff; padding : 10.8000vw 6.6667vw;
    &.active{
        .overview-tit{transform: translateX(0); opacity: 1;}
        .overview-desc{transform: translateX(0); opacity: 1; transition : 1.4s .4s;}
        .logo-ani{transform: scale(1) rotateY(0deg); transition : 2s .6s;}
        .logo-ani > img{opacity: 1; transform: translateX(0); transition : 2s .6s;}
		.visual-02-logo{transform : translateY(0); opacity : 1; transition : 2s .6s;}
    }
}
.overview-inner{position : relative; color : #14382f;}
.overview-tit{font-family: MM; font-weight: 400; font-size: 9.3333vw; line-height: 1.2em; letter-spacing: -0.02em; transform: translateX(-13.3333vw); opacity: 0; transition : 1.4s;}
.overview-tit span{color : #d9bd86;}
.overview-desc{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 500; font-size: 3.2000vw; letter-spacing: -0.05em; line-height: 2em; margin-top: 7.3333vw; transform: translateX(13.3333vw); color: #0f3a30; opacity: 0; transition : 0s 1.4s;}
.overview-desc small{font-size: 2.4000vw;}
.main-overview .logo-ani{width : 30.2000vw; margin: 20vw calc((100% - 30.2vw) / 2 - 3vw) 5vw calc((100% - 30.2vw) / 2 - 3vw);}
.visual-02-logo{width : 100%; transform : translateY(10vw); opacity : 0; transition :2s;}
/* map */
.main-map{padding : 10vw 0 0;
    &.active{
        .map-tit-box{transform: translateY(0); opacity: 1; transition : 1.4s;}
        .map-subway{transform: translateY(0); opacity: 1; transition : 1.4s .3s;}
    }
}
.map-bg{position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.map-bg > img{width : 100%; height : 100%; object-fit: cover; object-position: center;}
.map-inner{display: flex;flex-direction: column;align-items: center; position : relative; padding : 0 5.3333vw;}

.map-tit-box{text-align: center; transform: translateY(-10.6667vw); opacity: 0; transition : 0s 1.4s;}
.map-small-tit{font-family: BS; font-weight: 400; font-size: 2.9333vw; color : #163d33; letter-spacing: 0.2em; padding-left: 0.2em; line-height: 1em; margin-bottom: 1.3333vw;}
.map-tit{font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 8.5333vw; color : #163d33; line-height: 1em; margin-bottom: 6.6667vw;}
.map-desc{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 300; font-size: 3.4667vw; color : #fff; letter-spacing: -0.05em; margin-bottom: 2.6667vw;}
.map-tit-kor{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 700; font-size: 6.4000vw; color : #fff; letter-spacing: -0.05em; line-height: 1.3em;}

.map-subway{width : 54vw; margin-top: 9.3333vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}

.main-map2{
    &.active{
        .map-map{transform: scale(1); opacity: 1; transition : 1.4s .5s;}
        .map-more-btn{opacity: 1; transition : 1s .9s;}
    }
}
.map-map{width : 100%; transform: scale(1.2); opacity: 0; transition : 0s 1.4s;}
.map-more-btn{position: absolute; right: 0; bottom: 0; width: 24.4000vw; opacity: 0; transition : 0s 1.4s;}

/* envi */
.main-envi{background: #fef8ec; padding : 14.1333vw 0px;
    &.active{
        .envi-tit-img > img{transform: translateY(0); opacity: 1;
            &:nth-child(1){transition : 1.4s .1s;}
            &:nth-child(2){transition : 1.4s .2s;}
						&:nth-child(3){transition : 1.4s 1.2s;}
        }
        .envi-map{opacity: 1; transition : 1.2s .5s;}
        .envi-map > img{
            &:nth-child(2){animation : envi-map 1s infinite alternate 1.6s;}
            &:nth-child(3){transform: translateY(0); opacity: 1; transition : 1.2s 1.2s;}
        }
        .envi-more-btn{opacity: 1; transition : 1s 1.4s;}
    }
}
.envi-inner{position : relative;}
.envi-left{position: relative;display: flex;flex-direction: column;align-items: center; padding : 0 2vw;}

.envi-tit-img{display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap : 2.6667vw 1.8vw; width : 100%;}
.envi-tit-img > img{width: 24.9333vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;
    &:nth-child(2){width: 47.4667vw;}
    &:nth-child(3){width: 43.7333vw;}
}

.envi-map{width : 100%; margin-top: 8vw; position : relative; opacity: 0; transition : 0s 1.4s;}
.envi-map > img{width : 100%;
    &:nth-child(2),
    &:nth-child(3){position : absolute; left : 0;top : 0; height : 100%; object-fit: contain; opacity: 0;}
    &:nth-child(3){transform: translateY(2.4000vw); transition : 0s 1.4s;}
}
@keyframes envi-map{
    0%{opacity : 0;}100%{opacity : 1;}
}
.envi-map > img {
    &:nth-child(2) {
        height: 47%;
        margin-top: 75px;
        margin-left: 17px;
    }
}
.envi-more-btn{position: absolute; bottom:2vw; right: 5.4667vw; align-self: flex-end; width: 24.4000vw; opacity: 0; transition : 0s 1.4s;}

.envi-right{margin-top: 14.1333vw; padding : 0 5.3333vw;
    &.active{
        .envi-right-tit .char{transform: translateY(0); transition : 1.4s;}
        .envi-right-desc{opacity: 1; transition : 1s .6s;}
        .envi-slide{transform: translateY(0); opacity: 1; transition : 1.4s .6s;}
        .envi-pagination{opacity: 1; transition : 1s .8s;}
    }
}
.envi-right-inner{display: flex;flex-direction: column;align-items: center; padding: 11.2000vw 6.9333vw 6.9333vw; background-color: #fff; border-radius: 5.3333vw;}
.envi-right-tit-box{text-align: center; margin-bottom: 4.5333vw;}
.envi-right-tit{font-family: MM; font-weight: 400; font-size: 8.5333vw; color : #6e8a7a; letter-spacing: -0.03em; line-height: 1em; margin-bottom: 3.4667vw;}
.envi-right-tit .line{overflow: hidden;
    &+.line{margin-top: 1.6000vw;}
}
.envi-right-tit .char{transform: translateY(100%); transition : 0s 1.4s;}
.envi-right-desc{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 300; font-size: 3.4667vw; color : #404042; letter-spacing: -0.05em; opacity: 0; transition : 0s 1.4s;}
.envi-right-desc > b{font-weight: 700;}

.envi-slide{width : 100%; height : 74.6667vw; margin-bottom: 5.3333vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}
.envi-slide .swiper-slide{display: flex;flex-direction: column;align-items: center;justify-content: flex-start; text-align: center; padding-top: 7.4667vw; background: #eef4ec; border-radius: 5.3333vw; overflow: hidden;
    &.swiper-slide-active{
        .envi-slide-num{transform: translateY(0); opacity: 1; transition : 1.2s .4s;}
        .envi-slide-img{transform: translateY(0); opacity: 1; transition : 1.2s .5s;}
        .envi-slide-tit{transform: translateY(0); opacity: 1; transition : 1.2s .6s;}
        .envi-slide-desc{transform: translateY(0); opacity: 1; transition : 1.2s .7s;}
    }
}
.envi-slide-num{font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 4.5333vw; color : #6e8a7a; margin-bottom: 3.4667vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}
.envi-slide-img{width : 20.5333vw; height : 18.1333vw; object-fit: contain; object-position: center; margin-bottom: 3.4667vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}
.envi-slide-tit{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 400; font-size: 4.2667vw; color : #14382f; letter-spacing: -0.05em; line-height: 1.3em; margin-bottom: 3.4667vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}
.envi-slide-tit > b{font-weight: 700;}
.envi-slide-desc{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 300; font-size: 3.0667vw; color : #565759; letter-spacing: -0.05em; line-height: 1.6em; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}

.envi-pagination{display: flex;justify-content: center; gap : 1.0667vw; margin-bottom: 5.2000vw; opacity: 0; transition : 0s 1.4s;}
.envi-pagination .swiper-pagination-bullet{margin : 0; width : 2.6667vw; height : 2.6667vw; background: url(/assets/images/main/envi-bullet.png)no-repeat center / contain; opacity: 0.3; transition : .3s;
    &.swiper-pagination-bullet-active{opacity: 1;}
}

/* premium */
.main-premium{background: #fff; padding : 14.1333vw 0 0;
    &.active{
        .premium-desc{transform: translateY(0); opacity: 1; transition : 1.4s;}
        .premium-logo{transform: translateY(0); opacity: 1; transition : 1.4s .1s;}
        .premium-tit{transform: translateY(0); opacity: 1; transition : 1.4s .2s;}
    }
}
.premium-inner {padding: 0 5.6000vw;}
.premium-tit-box{text-align: center; margin-bottom: 12vw;}
.premium-desc{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 300; font-size: 3.2000vw; color : #565759; letter-spacing: -0.05em; margin-bottom: 3.4667vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}
.premium-logo{width : 45.3333vw; margin: auto; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}
.premium-tit{font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 8.5333vw; color : #6e8a7a; line-height: 1em; margin-top: 2.6667vw; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;}

.premium-list > li{position : relative;
    &.active{
        .premium-img > img{transform: scale(1); transition : 3s;}
        .premium-con{transform: translateY(0); opacity: 1; transition : 1.4s .3s;}
        .premium-icon{transform: translateY(0); opacity: 1; transition : 1.4s .5s;}
    }
    &:not(:last-child){margin-bottom: 1px;}
		&:nth-child(2n-1) .premium-con-num {color: #14382f;}
		&:nth-child(2n) .premium-con {color: #6e8a7a;}
}
.premium-img{width : 100%; overflow: hidden;}
.premium-img > img{width : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1.4s; display: block;}

.premium-content{display: flex;align-items: flex-start;justify-content: space-between; gap : 4vw; background: #fff; padding: 6.0000vw 0 13.3333vw;}
.premium-con{color : #14382f; transform: translateY(5.3333vw); opacity: 0; transition : 0s 1.4s;}
.premium-con-num{font-family: BS; font-weight: 400; font-size: 2.6667vw; letter-spacing: 0.2em; color : #6e8a7a; margin-bottom: 2.6667vw;}
.premium-con-desc{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 700; font-size: 4vw; letter-spacing: -0.05em; line-height: 1.4em;}
.premium-con-desc .col {display: inline-flex;flex-direction: column;align-items: center;}
.premium-con-desc small{font-size: 3.2000vw;}
.premium-info{display: block; font-weight: 400; font-size: 2.6667vw; margin-top: 1.6000vw; color : #9a9a9a;}

.premium-icon{flex-shrink: 0; width : 7.6000vw; transform: translateY(5.3333vw); opacity: 0; transition : 0s 1.4s;}
.premium-icon > img{width : 100%;}

/* traffic */
.main-traffic{padding : 14.1333vw 0 14.1333vw;
    &.active{
        .traffic-bg > img{transform: scale(1); transition : 3s;}
        .traffic-tit-box{transform: translateY(0); opacity: 1; transition : 1.4s;}
        .traffic-line{transform: scale(1); opacity: 1; transition : 1.4s .4s;}
        .traffic-list > li{transform: translateY(0); opacity: 1;
            &:nth-child(1){transition : 1.2s .8s;}
            &:nth-child(2){transition : 1.2s .9s;}
            &:nth-child(3){transition : 1.2s 1s;}
        }
    }
}
.traffic-bg{position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.traffic-bg > img{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1.4s;}

.traffic-inner{display: flex;flex-direction: column;align-items: center; position : relative; padding : 0 6.4000vw;}
.traffic-tit-box{text-align: center; transform: translateY(-10.6667vw); opacity: 0; transition : 0s 1.4s;}
.traffic-tit{font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 9.3333vw; color : #163d33; line-height: 1em; margin-bottom: 6.6667vw;}
.traffic-tit > span{display: block; font-family: BS; font-size: 2.9333vw; letter-spacing: 0.23em; line-height: 1em; margin-bottom: 2.1333vw;}
.traffic-desc{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 500; font-size: 4.5333vw; color : #444244; letter-spacing: -0.05em; line-height: 1.3em; margin-bottom: 3.4667vw;}
.traffic-desc small{font-size: 2.6667vw; font-weight: 300; color : #565759;}
.traffic-tit-kor{font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 700; font-size: 6.1vw; color : #14382f; letter-spacing: -0.05em; line-height: 1.3em;}

.traffic-line{width : 100%; margin-top: 10.6667vw; transform: scale(1.15); opacity: 0; transition : 0s 1.4s;}
.traffic-list{width : 100%; margin-top: 8vw; padding: 0 2.933vw;}
.traffic-list > li{transform: translateY(8vw); opacity: 0; transition : 0s 1.4s;
    &+li{margin-top: 3.2000vw;}
}

/* contact */
.main-contact{padding : 14.1333vw 0 14.1333vw;
    &.active{
        .contact-bg-img{transform: scale(1); transition : 3s;}
        .contact-leaf{transform: translateX(0) translateY(0); transition : 3s;}
        .contact-tit-box{transform: translateY(0); opacity: 1; transition : 1.4s .2s;}
        .contact-box{transform: translateY(0); opacity: 1;
            &:nth-child(1){transition : 1.4s .4s;}
            &:nth-child(2){transition : 1.4s .6s;}
        }
        .contact-map > img{transform: scale(1); transition : 3s;}
        .contact-address-box::after{clip-path: inset(0); transition : 1.2s .9s;}
        .contact-address{transform: translateY(0); opacity: 1; transition : 1.2s 1.2s;}
        .contact-btn-box{transform: translateY(0); opacity: 1; transition : 1.2s 1.2s;}
    }
}
.contact-bg{position : absolute; left : 0;top : 0; width : 100%; height : 100%;}
.contact-bg-img{width : 100%; height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1.4s;}
.contact-leaf{width : 30.3333vw; position : absolute; right : 0; top: -2vw; transform: translateX(50%) translateY(-30%); transition : 0s 1.4s;}

.contact-inner{display: flex;flex-direction: column;align-items: center; position : relative; padding : 0 15.0667vw;}
.contact-tit-box{display: flex;flex-direction: column;align-items: center; margin-bottom: 9.3333vw; transform: translateY(-10.6667vw); opacity: 0; transition : 0s 1.4s;}
.contact-logo{width : 34.6667vw; margin-bottom: 4vw;}
.contact-tit{font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 8.5333vw; color : #fff; line-height: 1em;}

.contact-container{width : 100%;}
.contact-box{width : 100%; transform: translateY(10.6667vw); opacity: 0; transition : 0s 1.4s;
    &+.contact-box{margin-top: 8vw;}
}
.contact-map{margin-bottom: 3.4667vw; overflow: hidden;}
.contact-map > img{width : 100%; transform: scale(1.25); transition : 0s 1.4s;}
.contact-address-box{display: flex;justify-content: space-between;align-items: center; padding-bottom: 3.4667vw; position : relative;
    &::after{position : absolute; content : ''; width : 100%; height : 1px; left : 0; bottom : 0; background: #fff; clip-path: inset(0 50%); transition : 0s 1.4s;}
}
.contact-address{display: flex;align-items: center; font-family: 'IBM Plex Sans KR', PT, sans-serif; font-weight: 300; font-size: 3.0667vw; color : #fff; letter-spacing: -0.05em; transform: translateY(100%); opacity: 0; transition : 0s 1.4s;}
.contact-address > span{padding-right: 2.1333vw; margin-right: 2.1333vw; position : relative;
    &::after{position : absolute; content : ''; width : 1px; height : 2.6667vw; background: rgba(255,255,255,0.5); right : 0; top : 50%; transform: translateY(-40%);}
}
.contact-btn-box{display: flex;align-items: center; transform: translateY(100%); opacity: 0; transition : 0s 1.4s;}
.contact-btn-box > a{display: flex;align-items: center;justify-content: center; width : 6vw; position : relative;
    &:first-child::after{position : absolute; content : ''; width : 1px; height : 3.2000vw; background: rgba(255,255,255,0.5); right : 0; top : 50%; transform: translateY(-40%) translateX(100%);}
}
.contact-btn-box > a > img{width : 3vw;}

/*  */
.main-three{height : 158.6111vw;}
.active{
    .three-bg > img{transform : scale(1); transition : 5s;}
    .three-bubble{filter: blur(0px); opacity: 1; transform: translateY(0);
        &.three-bubble-01{transition : 2s 1s;}
        &.three-bubble-02{transition : 2s 1.4s;}
    }
    .three-con-img{transform: translateY(0); opacity: 1; transition : 2s 1s}
    .three-list > li{transform: translateX(0); opacity: 1; 
        &:nth-child(1){transition : 1.2s 1.4s;}
        &:nth-child(2){transition : 1.2s 1.6s;}
        &:nth-child(3){transition : 1.2s 1.8s;}
        .char{opacity: 1; transition : 1.2s calc(var(--i)*0.1s + 1.4s)}
    }
}
.three-bg{position : absolute; left : 0;top : 0; overflow: hidden; width : 100%; height : 100%;}
.three-bg > img{width : 100%; height : 100%; transform : scale(1.5); transition : 1s}

.three-con{display: flex;align-items: center; justify-content: center; position :absolute; margin : 0 auto; bottom : 11.6667vw; width : 100%; gap : 5.5556vw; }

.three-con-img{transform: translateY(-100px);opacity: 0; transition : 1s; width : 19.4444vw;}
.three-con > li{display: flex;gap : 3.3333vw; align-items: center;}

.three-list > li{font-family: Appld SD Gothic Neo; color : #fff; font-size: 4.8611vw; letter-spacing: -0.05em; font-weight: 600; transform: translateX(50px); opacity: 0; transition : 1s;
    small{font-size: 2.7778vw; font-weight: 500;}
    .char{opacity: 0; transition : 1s}
}

.three-bubble{position :absolute; filter: blur(10px); opacity: 0; transform: translateY(-100px); transition : 0s 1.4s;
    &.three-bubble-01{width : 35vw; left : 11.8056vw; top : 21.6667vw}
    &.three-bubble-02{width : 35vw; left : 43.8889vw; bottom : 63.6111vw}
}

.pin-img{position :absolute; filter: blur(10px); opacity: 0; transform: translateY(-100px); transition : 0s 1.4s;
	&.pin-img-01 { width: 20vw; left: 3.208vw;  top: 50.306vw; }
	&.pin-img-02 { width: 20vw; left: 5.806vw; top: 22.375vw; }
	&.pin-img-03 { width: 20vw; left: 27.431vw; top: 36.667vw; }
	&.pin-img-04 { width: 20vw; left: 45.708vw; top: 42.139vw; }
	&.pin-img-05 { width: 20vw; left: 50.444vw; top: 26.639vw; }
	&.pin-img-06 { width: 25vw; left: 71.639vw; top: 28.806vw; }
	&.pin-img-07 { width: 20vw; left: 80.389vw; top: 47.444vw; }
	&.pin-img-08 { width: 22vw; left: 62.106vw; top: 64.028vw; }
	&.pin-img-09 { width: 20vw; left: 47.056vw; top: 74.542vw; }
	&.pin-img-10 { width: 20vw; left: 4vw;  bottom: 4vw; }
}

.active{
    .pin-img{filter: blur(0px); opacity: 1; transform: translateY(0);
        &.pin-img-01{transition : 2s 0.5s;}
        &.pin-img-02{transition : 2s 0.7s;}
        &.pin-img-03{transition : 2s 1.0s;}
        &.pin-img-04{transition : 2s 1.3s;}
        &.pin-img-05{transition : 2s 1.6s;}
        &.pin-img-06{transition : 2s 1.9s;}
        &.pin-img-07{transition : 2s 2.2s;}
        &.pin-img-08{transition : 2s 2.5s;}
        &.pin-img-09{transition : 2s 2.8s;}
        &.pin-img-10{transition : 2s 3.1s;}
    }
}




.calendar-section{
    position:relative;
	padding: 100px 10px;
    background:url("/assets/images/main/calendar-bg.jpg") center/cover no-repeat;
    overflow:hidden;
}

.calendar-section .overlay{
    position:absolute;
    inset:0;
    /* background:rgba(0,0,0,.48);
    backdrop-filter:blur(1px); */
}

.calendar-inner{
    position:relative;
    z-index:2;
    max-width:100%;
    margin:auto;
}

.sub-title{
    color:#fff;
    text-align:center;
    font-size: 20px;
    font-weight:500;
    margin-bottom:0px;
    letter-spacing:-1px;
	transform: translateX(-140px); opacity: 0; transition : 1.0s;
}

.calendar-inner h2{
    text-align:center;
    color:#fff;
    font-size:50px;
	font-family: MM;
    font-weight:300;
    letter-spacing:2px;
    margin-bottom:40px;
	transform: translateX(-140px); opacity: 0; transition : 1.4s;
}

.calendar-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:8px;
}

.calendar-card{
    position:relative;
    padding:15px 16px 35px;
    border:1px solid rgba(255,255,255,.45);
    border-radius:10px;
    color:#fff;
    background:rgba(255,255,255,.04);
    backdrop-filter:blur(6px);
    transition:
        background-color .2s ease,
        border-color .2s ease,
        transform .35s ease,
        opacity .35s ease;
}

.calendar-card:nth-child(1){
	transform: translateY(140px); opacity: 0; transition : transform 1.4s, opacity 1.4s;
}
.calendar-card:nth-child(2){
	transform: translateY(140px); opacity: 0; transition : transform 1.4s 0.3s, opacity 1.4s 0.3s;
}
.calendar-card:nth-child(3){
	transform: translateY(140px); opacity: 0; transition : transform 1.4s 0.6s, opacity 1.4s 0.6s;
}
.calendar-card:nth-child(4){
	transform: translateY(140px); opacity: 0; transition : transform 1.4s 0.9s, opacity 1.4s 0.9s;
}
.calendar-card:nth-child(5){
	transform: translateY(140px); opacity: 0; transition : transform 1.4s 1.2s, opacity 1.4s 1.2s;
}
.calendar-card{
    grid-column:span 2;   /* 기본 2칸 */
}

.calendar-card strong{
    display:block;
    font-size:16px;
    font-weight:500;
}

.calendar-card span{
    font-size:12px;
    opacity:.95;
	font-weight: 400;
}

.calendar-card:hover{
    background-color: #01b1ed;
    border-color: #01b1ed;
	transition : .4s;
}

.calendar-card img{
    position:absolute;
    right:10px;
    bottom:10px;
    color:#fff;
	width: 18px;
}

.calendar-card.wide{
    grid-column:span 3;
}

.calendar-btns{
    display:flex;
    gap:10px;
    margin-top:35px;
}
.calendar-btns{
	transform: translateY(140px); opacity: 0; transition : 1.4s 1.5s;
}

.btn{
    flex:1;
    height:36px;
    border:1px solid rgba(255,255,255,.5);
    border-radius:50px;
    display:flex;
    align-items:center;
	justify-content: space-evenly;
    color:#fff;
    text-decoration:none;
    font-size:12px;
    transition:.3s;
}

.btn img{
    width: 13px;
}

.btn:hover{
    background:#F35D9B;
    border-color:#F35D9B;
    color:#fff;
}


.calendar-section.active {
    .sub-title {
        transform: translateX(0);
        opacity: 1;
    }
	.calendar-inner h2{
        transform: translateX(0);
        opacity: 1;
    }
	.calendar-card {
        transform: translateY(0);
        opacity: 1;
    }
	.calendar-btns {
        transform: translateY(0);
        opacity: 1;
	}
}