#wrap{overflow: hidden;}
.section{position : relative;}
.section-inner{position :relative; max-width: 720px; margin : 0 auto; height : 100%;}
.main-section-visual{height : 100vh;overflow : hidden;}
.section-bg{width : 100%; height : 100%; overflow: hidden;z-index: -1;position : absolute; left : 0;top : 0;}
.section-bg > img{width : 100%;height : 100%; object-fit: cover; object-position: center;}


.quick-menu{display: grid;grid-template-columns: repeat(2, 1fr); position : fixed; left : 50%; transform: translateX(-50%);bottom : 0;z-index: 10;width : 100%; max-width: 720px;color : #fff;height : 80px; font-size: 27px; overflow: hidden; border-radius: 16px 16px 0 0; transition : transform .5s;}
.quick-menu.hide{transform: translateY(100%) translateX(-50%);}
.quick-menu .open{display: flex;align-items: center;justify-content: center; background: #092f57; font-family: Noto Sans KR; font-family : HG; font-weight : 300}
.quick-menu .open b{font-weight : 700;}
.quick-menu .customer{display: flex;align-items: center;justify-content: center;gap : 10px; background: #8b634a; font-family: PT; font-weight: 500; font-family : HG; font-weight : 400;}
.quick-menu .customer > img{width : 40px;}

.forena{font-family : forena !important}
/***************************
********* VISUAL ***********
***************************/

.visual-bg > img{animation : zoom-out 5s both;}
@keyframes zoom-out {
    0%{transform: scale(1.25);}
}

.visual-inner{display: flex; justify-content: center; align-items: center; width : 100%; max-width: 1200px;margin : 0 auto; position : relative; gap : 48px; padding-top: 217px;}

.visual-sub-tit{font-size: 26px; font-weight: 500; color : #fff; letter-spacing: -0.023em; margin-bottom: 32px; position : relative;z-index: 1;}
.visual-sub-tit .char{opacity: 0; transform: translateX(50px);}

.visual-tit{position : relative;z-index: 1; animation : visualTit 1.5s both 1.5s; width : 234px;}

@keyframes visualTit {
    0%{clip-path: inset(50% 66.6666% 50% 0);}
    50%{clip-path: inset(0% 66.6666% 0% 0);}
    100%{clip-path: inset(0);}
}

.subway{position : absolute; transform : translateY(100%); bottom : 0; animation : visual-subway 1s both; width : 5.4167vw; max-width : 39px;}
@keyframes visual-subway{
	100%{transform : translateY(0)}
}
.subway-01{left : 60px}
.subway-02{right : 60px; animation-delay : .2s;}

/*********************************************
****************    SCHEDULE    *******************
*********************************************/

.schedule-bg{width : 100%;height : 100%;position : absolute; left : 0;top : 0; width : 100%;height : 100%; overflow: hidden;}
.schedule-bg > img{width : 100%;height : 100%; object-fit: cover; object-position: center; transform: scale(1.25); transition : 0s 1s;}
.active .schedule-bg > img{transform: scale(1); transition : 3s}
.schedule-inner{display: flex;justify-content: space-between;align-items: center; width : 100%; max-width: 1440px; position : relative; margin : 0 auto;}

.schedule-table{display: grid; grid-template-columns: repeat(2, 1fr); width : 500px;height : 430px; gap : 20px 14px}
.schedule-table > li{display: flex;flex-direction: column;justify-content: center;align-items: center; color : rgba(255,255,255,0.5); position : relative; transition : background .3s, color .3s;}
.schedule-table > li:hover,
.schedule-table > li.on{background: rgba(139,99,75,0.9); color : #fff;}
.schedule-table > li.wide{grid-column: span 2;}

.schedule-table > li > span.line{background: rgba(255,255,255,0.5); position : absolute; transition : background .3s, clip-path 1s .4s;}
.schedule-table > li:hover > span.line,
.schedule-table > li.on > span.line{background: rgba(139,99,75,0.9);}

.schedule-table > li > span.line:nth-child(1){left : 0;top : 0;width : 100%;height : 1px; clip-path: inset(0 100% 0 0);}
.schedule-table > li > span.line:nth-child(2){right : 0;top : 0;width : 1px;height : 100%; clip-path: inset(0 0 100%);}
.schedule-table > li > span.line:nth-child(3){right : 0; bottom : 0;width : 100%;height : 1px; clip-path: inset(0 0 0 100%);}
.schedule-table > li > span.line:nth-child(4){left : 0;bottom : 0;width : 1px; height : 100%; clip-path: inset(100% 0 0);}

.active .schedule-table > li > span.line{clip-path: inset(0)}

.schedule-tit-box{display: flex;flex-direction: column;align-items: center;}
.schedule-day{font-family: HG; font-weight: 700; font-size: 30px; transform: translateY(50px); opacity: 0; transition :  color .3s, opacity 1.2s, transform 1.2s;}
.schedule-name{font-family: HG; font-weight: 300; font-size: 24px; transform: translateY(50px); opacity: 0; transition :  color .3s, opacity 1.2s, transform 1.2s;}

.active .schedule-day,
.active .schedule-name{transform: translateY(0); opacity: 1; transition-delay: 1s; transition : color .3s, opacity 1.2s 1s, transform 1.2s 1s;}

.schedule-tit{font-family: AV;font-size: 97px; color : #8b634b; font-weight: 400; transform: rotate(-5deg) translateX(-100px) translateY(30px); opacity: 0; transition : 1.2s;}
.active .schedule-tit{transform: translateX(0) translateY(0) rotate(0deg); opacity: 1;}

.schedule-desc{font-family: HG; font-weight:700; font-size: 22px; color : #fff; text-align: center; margin-bottom: 49px;line-height: 1.2em; transition : 1.2s; transform: translateY(50px); opacity: 0;}
.active .schedule-desc{transform: translateY(0); opacity: 1;}
.schedule-desc > span{font-family: HW; font-weight: 500;}
.schedule-desc > span > .forena{font-family: forena; font-weight: 400;}

.schedule-logo{opacity: 0; transition : 1s;}
.active .schedule-logo{opacity: 1; transition-delay: 1.2s;}

.schedule-btn{display: flex;flex-direction: column;align-items: center;justify-content: center; position : absolute; background: linear-gradient(to bottom, #9f765d, #6c4b38); border-radius: 50%; width : 162px;height : 162px; color : #fff; font-family: HG; font-weight: 700; font-size: 24px; left : 15px; bottom : 15px; transform: translateX(-100px); opacity: 0; transition : 1s;}
.active .schedule-btn{transform: translateX(0); opacity: 1; transition-delay: 1.2s;}
.schedule-btn > img{margin-top: 15px; transition : .3s;}
.schedule-btn:hover > img{transform: translateX(10px);}


/***************************
********* COMMUNITY ***********
***************************/

.community-bg{width : 100%;height : 100%;position : absolute; left : 0;top : 0; width : 100%;height : 100%; overflow: hidden;}
.community-bg > img{width : 100%;height : 100%; object-fit: cover; object-position: left bottom; transform: scale(1.25); transition : 0s 1s;}
.active .community-bg > img{transform: scale(1); transition : 3s}

.community-inner{display: flex;justify-content: space-between;align-items: center; position :relative;width : 100%; max-width: 1500px; margin : 0 auto;padding-top: 50px;}

.community-left{display: flex;flex-direction: column;align-items: center; padding-left: 100px;}

.community-tit{font-size: 80px; font-family: AV; font-weight: 400; font-weight: 700;transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.active .community-tit{transform: translateX(0); opacity: 1; transition-delay: .4s;}

.community-desc{font-size: 22px; font-family: HG; font-weight: 400; margin-bottom: 48px; text-align: center;transform: translateY(50px); opacity: 0; transition : 1.2s;}
.active .community-desc{transform: translateY(0); opacity: 1; transition-delay: .4s;}

.community-sub-tit{padding : 9px 72px 7px; background: #003057; color : #fff; font-family: HG; font-weight: 300; line-height: 1em; border-radius: 100px; margin-bottom: 15px; transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.active .community-sub-tit{transform: translateX(0); opacity: 1; transition-delay: .4s;}
.community-sub-tit b{font-weight: 700;}

.routine-box{position : absolute; left : 100px; bottom : 50px; mix-blend-mode: darken; transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.active .routine-box{transform: translateX(0); opacity: 1; transition-delay: .4s;}
.routine-box > img{position :absolute; left : 0;top : 0; opacity: 0; transition : opacity .5s;}
.routine-box > img.on{opacity: 1;}
.routine-box > img:first-child{position : static}

.community-right{display: flex;flex-direction: column;align-items: center;}


.community-btn-box{display: flex;gap : 10px; margin-bottom: 33px;;}
.community-btn-box > li{display: flex;flex-direction: column;align-items: center; cursor: pointer; width : 140px; height : 140px; background: #003057; border-radius: 50%; color : #fff; padding-top: 30px; padding-bottom: 24px; transform: translateY(-50px); opacity: 0; transition : background .5s, color .5s, transform 1s, opacity 1s; background: transparent; color : #003057; border : 1px solid #003057}
.community-btn-box > li.on{color : #fff; background: #003057;}
.active .community-btn-box > li:nth-child(1){transform: translateY(0); opacity: 1; transition : background .5s, color .5s, transform 1s .4s, opacity 1s .4s;}
.active .community-btn-box > li:nth-child(2){transform: translateY(0); opacity: 1; transition : background .5s, color .5s, transform 1s .5s, opacity 1s .5s;}
.active .community-btn-box > li:nth-child(3){transform: translateY(0); opacity: 1; transition : background .5s, color .5s, transform 1s .6s, opacity 1s .6s;}

.community-btn-floor{font-size: 25px; font-family: HG; font-weight: 500;}
.community-btn-desc{display: flex;flex-direction: column;justify-content: center; align-items: center; height : 100%; text-align: center; font-family: HG; font-weight: 300; font-size: 14px;}

.community-floor-box{position : relative; mix-blend-mode: darken;transform: translateY(100px); opacity: 0; transition : 1.2s;}
.active .community-floor-box{transform: translateY(0); opacity: 1; transition-delay: .4s;}

.community-floor-box > img{position :absolute;left : 0;top : 0;opacity: 0; transition : opacity .5s;}
.community-floor-box > img.on{opacity: 1;}
.community-floor-box > img:first-child{position : static; width: 47.5vw;}

/***************************
********* UNIT ***********
***************************/
.unit-bg{width : 100%;height : 100%;position : absolute; left : 0;top : 0; width : 100%;height : 100%; overflow: hidden;}
.unit-bg > img{width : 100%;height : 100%; object-fit: cover; object-position: left bottom; transform: scale(1.25); transition : 0s 1s;}
.active .unit-bg > img{transform: scale(1); transition : 3s}

.unit-inner{display: flex;justify-content: space-between; width : 100%;max-width: 1330px; margin : 0 auto; position : relative;}

.unit-left{display: flex;flex-direction: column;justify-content: center;align-items: center; color : #fff;}

.unit-tit{font-size: 80px; font-family: AV; font-weight: 700;transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.active .unit-tit{transform: translateX(0); opacity: 1; transition-delay: .4s;}

.unit-desc{font-size: 22px; font-family: HG; font-weight: 400; text-align: center;transform: translateY(50px); opacity: 0; transition : 1.2s; margin-bottom: 64px;}
.active .unit-desc{transform: translateY(0); opacity: 1; transition-delay: .4s;}

.unit-link-box{display: flex;gap : 8px; transform: translateY(100px); opacity: 0; transition :1.2s}
.active .unit-link-box{transform: translateY(0); opacity: 1; transition-delay: 1.2s;}
.unit-link-box > a{display: flex;align-items: center;justify-content: center; width : 110px;height : 110px; font-family: HG; font-weight: 300; font-size: 18px; border : 1px solid #fff; transition : .5s;}
.unit-link-box > a:hover{background: #fff; color : #111}

.unit-right{display: flex;flex-direction: column;justify-content: center;align-items: center; transform: translateX(100px); opacity: 0; transition :1.2s}
.active .unit-right{transform: translateX(0); opacity: 1; transition-delay: .4s;}

.unit-type-box{display: flex;justify-content: center; position : relative; width : 100%; overflow: hidden; margin-bottom: 36px;}
.unit-type-box > li{color : #fff; font-size: 33px; font-family: HG; position :absolute;top : 0; white-space: nowrap; transition : transform 0.5s; transform: translateY(100%);}

.unit-type-box > li.end{animation : unit-type-btn-end 0.5s both}
.unit-type-box > li.on{animation : unit-type-btn 0.5s both}

@keyframes unit-type-btn {
    0%{transform: translateY(-100%);}
    100%{transform: translateY(0%);}
}
@keyframes unit-type-btn-end {
    0%{transform: translateY(0%);}
    100%{transform: translateY(100%);}
}
.unit-type-box > li:nth-child(1){position :static;}
.unit-type-box > li > b{font-size: 60px;}
.unit-type-box > li > span{font-size: 35px; display: inline-block;}
.unit-type-box > li > span > small{font-size: 28px;}
.unit-type-box > li > span > b{font-size: 35px;}

.unit-btn-box{display: flex; margin-bottom: 36px;}
.unit-btn-box > li{width : 200px; text-align: center; font-family: HG; color : rgba(255,255,255,0.8); font-size: 22px; padding-bottom: 9px; border-bottom : 1px solid rgba(255,255,255,0.5); cursor : pointer; font-weight: 700; position :relative;}
.unit-btn-box > li::after{position : absolute; content : ''; width : 100%; height : 1px; background: #fff; bottom : 0; left : 0; clip-path: inset(0 100% 0 0); transition : clip-path .5s;}
.unit-btn-box > li.on{color : #fff;}
.unit-btn-box > li.on::after{clip-path: inset(0);}

.unit-img-box{display: flex;justify-content: center; align-items: center; position :relative; height : 404px; margin-bottom: 36px;}
.unit-img-box > img{position :absolute; white-space: nowrap; transition : 1s; opacity: 0;}
.unit-img-box > img:nth-child(1){position :static;}
.unit-img-box > img.on{opacity: 1;}

.unit-btn{display: flex;align-items: center;justify-content: center;gap : 20px; width : 140px; height : 32px; font-size: 12px; font-family: HG; color : #fff; border : 1px solid #fff; padding-left: 10px; position :relative;z-index: 1; transition  : color .3s;}
.unit-btn:hover{color : #111}
.unit-btn::after{position :absolute; content : ''; width : 100%;height : 100%; background: #fff; left : 0; top : 0; z-index: -1; clip-path: inset(100% 0 0);transition : clip-path .3s;}
.unit-btn:hover::after{clip-path: inset(0);}

.unit-btn > img{transition : filter .3s;}
.unit-btn:hover > img{filter : invert(1)}

/***************************
********* DESIGN ***********
***************************/
.main-section-design{background: #072c4a;}

.design-inner{display: flex;flex-direction: column; align-items: start; justify-content: center; width : 100%; max-width: 1440px; margin : 0 auto;position : relative; color : #fff;z-index: 1;}

.design-img-box{display: flex; align-items: center;  position :absolute; right : 0;gap : 10px;z-index: -1;padding-top: 80px;}
.design-img-right{display: flex;flex-direction: column; align-items: start; gap : 10px;}
.design-img-bottom{display: flex; gap : 10px; align-items: start;}

.design-sub-tit{font-size: 30px; font-family: HG; font-weight: 500; transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.active .design-sub-tit{transform: translateY(0); opacity: 1; transition-delay: .4s;}
.design-tit{font-size: 80px; font-family: AV; font-weight: 700; transform: rotate(-5deg);margin-bottom: 24px; transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.active .design-tit{transform: translateY(0) rotate(-5deg); opacity: 1; transition-delay: .5s;}

.design-desc{font-size: 22px; font-family: HG; font-weight: 400;transform: translateX(-100px); opacity: 0; transition : 1.2s; margin-bottom: 68px;}
.active .design-desc{transform: translateY(0); opacity: 1; transition-delay: .6s;}

.design-logo{transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.active .design-logo{transform: translateY(0); opacity: 1; transition-delay: .7s;}


.design-img-box img{transition : 1.2s; opacity: 0;}

.design-img-01{transform: translateX(-100px);}
.design-img-02{transform: translateY(-100px);}
.design-img-03{transform: translateY(100px);}
.design-img-04{transform: translateX(100px);}

.active .design-img-box img{transform: translateX(0px); opacity: 1; transition-delay: 1.2s;}

/***************************
********* ENVI ***********
***************************/

.main-section-envi .section-inner{background: #b1d2e4;}

.envi-inner{display: flex;flex-direction: column;justify-content: end; width : 100%; max-width: 1700px; height: 100%; padding : 200px 0 180px;}

.envi-tit{font-family: futura-pt; font-weight: 700;position : relative; font-size: 60px; line-height: 1em; margin-bottom: 16px;margin-left: 80px; font-family : HG;}
.envi-tit > span{font-family: AV;position : absolute; font-size: 50px; font-weight: 400; color : #002a4e; left : 0;top : 0; opacity: 0; transform: translateY(-80%) translateX(-50%) rotate(-5deg); transition : opacity 1s, transform 1s;}
.active .envi-tit > span{opacity: 1; transform: translateY(-80%) translateX(-20%) rotate(-5deg); transition : opacity 1s 1s, transform 1s 1s;}

.envi-tit .char{transform: translateY(100%); transition : transform 1s;}

.envi-sub-tit{font-family: HW; font-size: 32px; letter-spacing: -0.05em;font-weight: 400; margin-bottom: 12px; margin-left: 80px;}
.envi-sub-tit .hg{font-family : HG; font-weight : 700;}
.envi-sub-tit b{font-size: 40px; font-weight: 400;}

.envi-sub-tit .char{transform: translateY(120%); transition : transform 1s;}

.envi-desc{font-family: PT; color : #002a4e; font-size: 24px; letter-spacing: -0.05em; margin-bottom: 30px; margin-left: 80px; font-family : HG; font-weight : 300;}

.envi-desc .char{transform: translateY(100%); transition : transform 1s;}

.envi-bg{display: flex;justify-content: end; background: #b1d2e4;position : relative; width : 100%; height : auto; z-index: 1;}
.envi-bg > img{object-position: top right; transform: translateX(20%); opacity: 0; transition : transform 1s .4s, opacity 1s .4s;}
.active .envi-bg > img{transform: translateX(0);opacity: 1; transition : transform 1s 1s, opacity 1s 1s}

.envi-tit .line,
.envi-sub-tit .line,
.envi-desc .line{overflow: hidden;}

.active .envi-tit .char,
.active .envi-sub-tit .char,
.active .envi-desc .char{transform: translateY(0);}

.active .envi-tit .char{transition-delay: .4s;}
.active .envi-sub-tit .char{transition-delay: .6s;}
.active .envi-desc .char{transition-delay: .8s;}

.envi-map{transform:translateY(-20%) translateX(-50%);opacity: 0;transition : transform 1s, opacity 1s; width : 633px;position : relative;z-index: 1; left: 50%;position : absolute; bottom : 128px;}
.active .envi-map{transform: translateY(0%) translateX(-50%);opacity: 1; transition-delay: 1s;}

.envi-subway-box{display : flex; gap : 4px;position : absolute; bottom : 90%; right : 74px;z-index : -1; transform : translateY(100%); transition : transform 1s;}
.active .envi-subway-box{transform : translateY(0); transition-delay : 1s;}
.envi-subway{max-width : 34px; width : 4.7222vw}

/***************************
********* BRAND ***********
***************************/

.brand-bg > img{transform: scale(1.25);transition : transform 2s .4s;}
.active .brand-bg > img{transform: scale(1); transition : transform 4s;}

.brand-inner{display: flex;flex-direction: column; align-items: center;text-align: center; height: 100%;padding : 160px 0 423px;}

.brand-desc{font-family: HW; font-weight: 400;font-size: 22px; color : #454545; letter-spacing: -0.05em; line-height: 1.5em;margin-bottom: 45px; letter-spacing: -0.08em;}

.brand-desc .char{transform: translateY(100%); transition : transform 1s}
.brand-desc .line{overflow: hidden;}
.brand-desc .line:first-child{font-size : 28px; margin-bottom: 24px;}
.brand-desc .line:nth-child(4){margin-bottom: 12px;}

.active .brand-desc .line:nth-child(1) .char{transform: translateY(0); transition-delay: .4s;}
.active .brand-desc .line:nth-child(2) .char{transform: translateY(0); transition-delay: .5s;}
.active .brand-desc .line:nth-child(3) .char{transform: translateY(0); transition-delay: .6s;}
.active .brand-desc .line:nth-child(4) .char{transform: translateY(0); transition-delay: .7s;}
.active .brand-desc .line:nth-child(5) .char{transform: translateY(0); transition-delay: .8s;}

.brand-tit{font-size: 28px; color : #002852; padding-left: 1em; letter-spacing: 1em; margin-bottom: 30px; font-family: HW; font-weight: 400; opacity: 0;  white-space: nowrap; transition : opacity 1s .4s, letter-spacing 1s .4s, padding-left 1s .4s; font-family : HG; font-weight : 300;}
.active .brand-tit{padding-left: 0.1em; opacity: 1; letter-spacing: 0.7em; transition : opacity 1s 1s, letter-spacing 2s 1s, padding-left 2s 1s;}

.brand-line{width : 30px;height : 1px; margin-bottom: 38px; background: #002852; clip-path: inset(0 50%); transition : clip-path 1s}
.active .brand-line{clip-path: inset(0); transition-delay: 1s;}

.brand-logo{transform: translateY(100px);opacity: 0;transition : 2s; width : 53.3333vw; max-width : 384px;}
.active .brand-logo{transform: translateY(0); opacity: 1; transition-delay: 1s;}

/***************************
********* LOCATION *********
***************************/

.location-bg > img{object-position: center bottom; transition : object-position 3s}
.active .location-bg > img{object-position: center top;}

.location-tit{font-family: futura-pt; font-weight: 700;position : relative; font-size: 60px; line-height: 1em; margin-bottom: 76px; color : #fff;font-family : HG;}
.location-tit > span{font-family: AV;position : absolute; font-size: 50px; font-weight: 400; color : #002a4e; left : 0;top : 0; opacity: 0; transform: translateY(-80%) translateX(-50%) rotate(-5deg); transition : opacity 1s, transform 1s; color : #fff;}

.active .location-tit > span{opacity: 1; transform: translateY(-80%) translateX(-20%) rotate(-5deg); transition : opacity 1s 1s, transform 1s 1s;}

.location-tit .char{transform: translateY(100%); transition : transform 1s;}
.location-tit .line{overflow: hidden;}
.active .location-tit .char{transform: translateY(0); transition-delay: .4s;}

.location-inner{ display: flex;flex-direction: column;align-items: center;width : 100%; max-width: 1200px; margin : 0 auto; padding : 224px 0 80px;}

.location-map-container{display: flex;flex-direction: column; align-items: center; width : 100%;}

.location-map{margin-bottom: 60px;}

.location-map-box{transition : opacity 1s, transform 1s;padding : 50px 0;}
.location-map-box:nth-child(1){transform: translateX(-100px);opacity: 0;}
.location-map-box:nth-child(1)::after{position : absolute; content: '';width : 120%;height : 1px; background: #fff; bottom : 0;left : 50%; transform: translateX(-50%);}
.location-map-box:nth-child(2){transform: translateX(100px);opacity: 0; padding-top: 93px;}
.active .location-map-box{transform: translateX(0); opacity: 1; transition-delay: .4s;}

.location-map-footer{display: flex; justify-content: center; color : #fff;}
/* .location-map-box:nth-child(2) .location-map-footer{justify-content: space-between;} */
.location-address-box{display: flex;flex-direction: column;align-items: center; padding-left: 15px;position : relative;}

.location-address-name{font-size: 20px; font-weight: 700; margin-bottom: 14px; letter-spacing: -0.033em; transform: translateX(50px); opacity: 0; transition : transform 1s, opacity 1s;}
.active .location-address-name{transform: translateX(0); opacity: 1; transition-delay: 1s;}

.location-address{font-size: 15px; letter-spacing: -0.063em; margin-bottom: 13px;transform: translateX(50px); opacity: 0; transition : transform 1s, opacity 1s;}
.active .location-address{transform: translateX(0); opacity: 1; transition-delay: 1.1s;}

.location-btn-box{display: flex; gap : 5px;transform: translateX(50px); opacity: 0; transition : transform 1s, opacity 1s;}
.active .location-btn-box{transform: translateX(0); opacity: 1; transition-delay: 1.2s;}

/***************************
********* PREMIUM *********
***************************/

.main-section-premium .section-inner{padding : 163px 0 174px;}
.premium-inner{display: flex;align-items: center; width : 100%; max-width: 1600px;margin : 0 auto;position :relative;}

.premium-slide{width : 100%;}
.premium-slide .swiper-slide{display: flex;flex-direction: column;  justify-content: end; align-items: center;opacity: 1 !important;}
.premium-slide .swiper-slide-active{opacity: 1 !important;}

.premium-con{display: flex;flex-direction: column; width : 530px; padding-top: 36px; position :relative;order : 2;}

.premium-con-tit{font-family: futura-pt; font-weight: 700; font-size: 50px; letter-spacing: -0.06em; margin-bottom: 14px; font-family : HG;}
.premium-con-tit .char{transform: translateY(100%); transition : transform .7s;}
.premium-con-tit img{height : 4.8611vw; max-height : 35px; transform: translateY(105%); transition : transform .7s;}

.premium-con-sub-tit{font-size: 25px; font-family: PT; font-weight: 700;color : #002a4e; margin-bottom: 18px; font-family : HG;}
.premium-con-sub-tit .char{transform: translateY(100%); transition : transform .7s;}
.premium-con-sub-tit span{font-family : HW;}

.premium-con-desc{font-size: 18px; font-family: PT; letter-spacing: -0.02em; font-weight: 500; color : #818181; line-height: 1.5em; font-family : HG;}
.premium-con-desc .char{transform: translateY(100%); transition : transform .7s;}

.premium-con-tit .line,
.premium-con-sub-tit .line,
.premium-con-desc .line{overflow: hidden;}

.active .swiper-slide-active .premium-con-tit .char,
.active .swiper-slide-active .premium-con-tit img{transform: translateY(0); transition-delay: .7s;}
.active .swiper-slide-active .premium-con-sub-tit .char{transform: translateY(0); transition-delay: .9s;}
.active .swiper-slide-active .premium-con-desc .char{transform: translateY(0); transition-delay: 1.1s;}

.premium-img-box{display: flex;gap : 11px; position :relative;}

.premium-img{position : relative;z-index: 1; overflow: hidden; clip-path: inset(0 0 100% 0); transition : clip-path 0.7s cubic-bezier(0.65, 0, 0.35, 1); width : 336px;}
.active .swiper-slide-active .premium-img{clip-path: inset(0); transition-delay: 0.7s;}

.premium-img-small{transform: translateY(-15px);clip-path: inset(0 100% 0 0); transition : clip-path 0.7s cubic-bezier(0.65, 0, 0.35, 1); width : 185px}
.active .swiper-slide-active .premium-img-small{clip-path: inset(0); transition-delay: 1s;}

.premium-text{position : absolute; font-family: AV;font-size: 65px; color : #002a4e; left : 230px; bottom : 10px;transform: translateX(-200px) rotate(-10deg); line-height: 1em; opacity: 0; transition : opacity 1s, transform 1s;}
.active .swiper-slide-active .premium-text{transform: translateX(0) rotate(-10deg);opacity: 1;transition : opacity 1s 1s, transform 1s 1s;}
.premium-text.white{color : #fff;}


.premium-icon{display: flex;justify-content: center; align-items: center; width : 105px;height : 105px; background: rgba(0,42,78,0.8);border-radius: 50%;position : absolute;top : 0px;z-index: 10; transform: translateX(-50%) translateY(-50%) scale(0); transition : transform 1s;}
.active .swiper-slide-active .premium-icon{transform: translateX(-50%) translateY(-50%) scale(1); transition-delay: 1s;}

.premium-btn-box{display: flex;flex-direction: column;align-items: start; gap : 43px; position : absolute; font-family: roboto;z-index: 1;}
.premium-btn-box > li{position :relative; cursor: pointer; transform: translateX(-100px);opacity: 0; transition : transform 1s, opacity 1s;}
.active .premium-btn-box > li{transform: translateX(0); opacity: 1; transition-delay: calc(var(--i) * 0.1s + 0.4s);}
.premium-btn-box > li::after{position : absolute; content: ''; width : 100%; height : 1px; bottom : 0; background: #000; left : 0; clip-path: inset(0 100% 0 0);transition : clip-path .5s;}
.premium-btn-box > li:hover::after,
.premium-btn-box > li.on::after{clip-path: inset(0);}
.premium-btn-box > li:hover,
.premium-btn-box > li.on{font-weight: 900;}

.premium-navigation{display: flex; justify-content: end;align-items: end; position : absolute; gap : 6px;z-index: 1;bottom : 140px; opacity: 0; transition : opacity 1s; width : 530px;left : 50%; transform: translateX(-50%);height : 0; bottom : 0;}
.active .premium-navigation{opacity: 1; transition-delay: 1s;}
.premium-navigation > div{display: flex;align-items: center;justify-content: center; width : 53px; height : 53px; background: #fff; border : 1px solid #000; border-radius: 50%; cursor : pointer;}
.premium-navigation > div.swiper-button-disabled{opacity: 0.3; pointer-events: none;}
.premium-navigation > .premium-next{background: #000;}
.premium-next img{transform: rotate(180deg); filter: invert(1); -webkit-filter: invert(1);}

@media(max-width : 1200px){
    
    .quick-menu{height : 11.1111vw; font-size: 3.7500vw; border-radius: 2.2222vw 2.2222vw 0 0;}
    .quick-menu .customer{gap : 1.3889vw;}
    .quick-menu .customer > img{width : 5.5556vw;}

    /***************************
    ********* VISUAL ***********
    ***************************/

    .visual-inner{gap : 6.6667vw; padding-top: 30.1389vw;}

    .visual-sub-tit{font-size: 3.6111vw; margin-bottom: 4.4444vw;}

    .visual-tit{width : 32.5000vw;}

    .subway-01{left : 8.3333vw}
    .subway-02{right : 8.3333vw;}

    /* SCHEDULE */
    .schedule-inner{flex-direction:column;align-items:center;padding:14.1666vw 15.2777vw 11.8055vw;}
    .schedule-tit{font-size:10.4166vw;}
    .schedule-desc{font-size:3.0556vw;margin-bottom:7.0833vw;}
    .schedule-table{width:100%;height:auto;gap:1.3888vw;}
    .schedule-table>li{padding:3.0556vw;}
    .schedule-table-01{margin-bottom:1.3888vw;}
    .schedule-table-02>li.wide{grid-column:span 2;}
    .schedule-day{font-size:4.1667vw;}
    .schedule-name{font-size:3.3333vw;}
    .schedule-btn{position:relative;left:auto;bottom:auto;flex-direction:row;gap:1.3889vw;border-radius:13.8889vw;width:45.1388vw;height:8.0556vw;font-size:3.0556vw;margin:6.9444vw auto 0;background:linear-gradient(-100deg,#6e4d3a 0%,#9e755d 100%);transform:translateY(30px);}
    .active .schedule-btn{transform:translateY(0);}
    .schedule-btn>img{margin-top:0;width:5.5556vw;}

    /* COMMUNITY */
    .community-inner{flex-direction:column;align-items:center;padding:19.4444vw 2.5vw 13.8889vw;}
    .community-left{padding-left:0;margin-bottom:5vw;align-items:center;width:100%;order:1;}
    .community-right{width:100%;order:2;}
    .routine-box{width:100%;order:3;display:none !important;}
    .routine-box>img{width:100%;}
    .community-tit{font-size:9.7222vw;}
    .community-desc{font-size:3.0556vw;margin-bottom:3.8888vw;text-align:center;}
    .community-sub-tit{padding:2.0833vw 5.5556vw;font-size:3.3333vw;margin-bottom:0;text-align:center;}
    .community-btn-box{justify-content:center;gap:1.3888vw;margin-bottom:4.1667vw;}
    .community-btn-box>li{width:19.4444vw;height:19.4444vw;padding-top:4.1667vw;padding-bottom:3.3333vw;}
    .community-btn-floor{font-size:3.4722vw;}
    .community-btn-desc{font-size:2.0833vw;}
    .community-floor-box{display:flex;align-items:center;justify-content:center;width:100%;}
    .community-floor-box>img{width:100%;position:static !important;opacity:0 !important;display:none;}
    .community-floor-box>img.on{opacity:1 !important;display:block;}
    .community-info-box{width:100%;height:auto;order:4;margin-top:6.9444vw;overflow:hidden;}
    .community-info{display:none;}
    .community-info.on{display:block;}
    .community-info-tit{font-family:HG;font-weight:700;font-size:3.3333vw;letter-spacing:-0.05em;color:#00293f;margin-bottom:2.7778vw;text-align:center;}
    .community-info-desc{font-family:HG;font-weight:400;font-size:2.7778vw;color:#787878;text-align:center;margin-bottom:4.1666vw;}
    .community-info-time{display:flex;justify-content:center;gap:1vw;}
    .community-info-time>li{display:flex;flex-direction:row;align-items:center;gap:1.3338vw;}
    .community-info-time-img{width:10vw;flex-shrink:0;}
    .community-info-time-img2{width:14.8611vw;}
    .community-info-time-img3{width:15.1388vw;}
    .community-info-time-img4{width:9.3055vw;}
    .community-info-time-img5{width:11.0555vw;}
    .community-info-time-img6{width:12.7222vw;}
    .community-info-time-con{display:flex;flex-direction:column;gap:1.3889vw;}
    .community-info-time-label{font-family:HG;font-weight:700;font-size:3.3333vw;color:#00293f;}
    .community-info-time-desc{font-family:HG;font-weight:400;font-size:2.0833vw;color:#003057;}

    /* UNIT */
    .unit-inner{flex-direction:column;align-items:center;padding:19.4444vw 6.9444vw 13.8889vw;}
    .unit-left{width:100%;order:1;margin-bottom:6.9444vw;}
    .unit-right{width:100%;order:2;transform:translateX(0);opacity:1;}
    .active .unit-right{transform:translateX(0);opacity:1;transition-delay:.4s;}
    .unit-tit{font-size:11.1111vw;}
    .unit-desc{font-size:3.0556vw;margin-bottom:5.5556vw;}
    .unit-link-box{gap:1.1111vw;}
    .unit-link-box>a{width:auto;height:9.1666vw;padding:3.0556vw;font-size:2.5vw;}
    .unit-type-box{margin-bottom:5.5556vw;}
    .unit-type-box>li{font-size:5.5556vw;}
    .unit-type-box>li>b{font-size:11.1111vw;}
    .unit-type-box>li>span{font-size:5.5556vw;}
    .unit-type-box>li>span>small{font-size:4.1667vw;}
    .unit-type-box>li>span>b{font-size:5.5556vw;}
    .unit-btn-box{width:100%;margin-bottom:5.5556vw;}
    .unit-btn-box>li{width:25%;font-size:3.3333vw;text-align:center;}
    .unit-img-box{width:100%;height:auto;margin-bottom:5.5556vw;}
    .unit-img-box>img{width:100%;}
    .unit-img-box .unit-img_59{width:61.1111vw;}
    .unit-img-box .unit-img_84{width:76.3888vw;}
    .unit-img-box .unit-img_101{width:78.4722vw;}
    .unit-img-box .unit-img_115{width:78.4722vw;}
    .unit-btn{margin:0 auto;width:19.5833vw;height:4.4444vw;font-size:1.6667vw;gap:2.7778vw;}
    .unit-btn>img{width:1.6667vw;}

    /* DESIGN */
    .design-inner{align-items:center;text-align:center;padding:19.4444vw 0 23.6111vw;}
    .design-sub-tit{font-size:3.6111vw;margin-bottom:1.3889vw;}
    .design-tit{font-size:10.4166vw;margin-bottom:3.3333vw;}
    .design-desc{font-size:3.0556vw;margin-bottom:5.5556vw;}
    .design-logo{width:16.6667vw;margin-bottom:8.3333vw;}
    .design-img-box{position:relative;gap:1.3888vw;padding-top:7.2222vw;}
    .design-img-right{gap:1.3888vw;}
    .design-img-bottom{gap:1.3888vw;}
    .design-img-01{width:29.7222vw;height:30.8333vw;}
    .design-img-02{width:51.9444vw;height:34.4444vw;}
    .design-img-03{width:31.1111vw;height:32.5vw;}
    .design-img-04{width:29.8611vw;height:26.3888vw;}



    
    /***************************
    ********* ENVI ***********
    ***************************/

    .envi-inner{padding : 27.7778vw 0 25.0000vw;}

    .envi-tit{font-size: 8.3333vw; margin-bottom: 2.2222vw;margin-left: 11.1111vw;}
    .envi-tit > span{font-size: 6.9444vw;}

    .envi-sub-tit{font-size: 4.4444vw; margin-bottom: 1.6667vw; margin-left: 11.1111vw;}
    .envi-sub-tit b{font-size: 5.5556vw; }

    .envi-desc{font-size: 3.3333vw; margin-bottom: 4.1667vw; margin-left: 11.1111vw;}

    .envi-map{width : 87.9167vw;bottom : 17.7778vw;}

	.envi-subway-box{gap : 0.5556vw;right : 10.2778vw;}

    /***************************
    ********* BRAND ***********
    ***************************/

    .brand-inner{padding : 21.3333vw 0 58.7500vw;}

    .brand-desc{font-size: 3.0556vw;margin-bottom: 6.2500vw;}

	.brand-desc .line:first-child{font-size : 3.7333vw; margin-bottom: 3.2000vw;}
	.brand-desc .line:nth-child(4){margin-bottom: 1.6000vw;}

    .brand-tit{font-size: 3.8889vw; margin-bottom: 4.1667vw}

    .brand-line{width : 4.1667vw; margin-bottom: 5.2778vw;}

    /* .brand-logo{width : 50vw} */

    /***************************
    ********* LOCATION *********
    ***************************/

    .location-tit{font-size: 8.3333vw;margin-bottom: 10.5556vw;}
    .location-tit > span{font-size: 6.9444vw;}

    .location-inner{padding : 31.1111vw 0 11.1111vw;}

    .location-map{margin-bottom: 8.3333vw; width : 72.2222vw;}

    .location-map-box{padding : 6.9444vw 0;}
    .location-map-box:nth-child(2){padding-top: 12.9167vw;}

    .location-address-box{padding-left: 2.0833vw;}

    .location-address-name{font-size: 2.7778vw; margin-bottom: 1.9444vw;}

    .location-address{font-size: 2.0833vw; margin-bottom: 1.8056vw;}

    .location-btn-box{gap : 0.6944vw;}
    .location-btn-box > a{width: 4.7222vw;}

    /***************************
    ********* PREMIUM *********
    ***************************/

    .main-section-premium .section-inner{padding : 22.6389vw 0 24.1667vw;}

    .premium-con{width : 73.6111vw; padding-top: 5.0000vw;}

    .premium-con-tit{font-size: 6.9444vw; margin-bottom: 1.9444vw;}

    .premium-con-sub-tit{font-size: 3.4722vw; margin-bottom: 2.5000vw;}

    .premium-con-desc{font-size: 2.5000vw;}

    .premium-img-box{gap : 1.5278vw;}

    .premium-img{width : 46.6667vw;}

    .premium-img-small{transform: translateY(-2.0833vw);width : 25.6944vw}

    .premium-text{font-size: 9.0278vw;left : 31.9444vw; bottom : 1.3889vw;}

    .premium-icon{width : 14.5833vw;height : 14.5833vw;}
	.premium-icon > img{width : 50%;}
	.swiper-slide:first-child .premium-icon > img{width : 70%;}

    .premium-btn-box{gap : 5.9722vw;}

    .premium-navigation{gap : 0.8333vw;bottom : 19.4444vw; width : 73.6111vw;}
    .premium-navigation > div{width : 7.3611vw; height : 7.3611vw;}

}