/* #main-slide{width : 100%;height : 100%; position : fixed; overflow: hidden;} */
#main-slide{display: none;}
.main-container{display: none;}
/* 메인 */
.sec1, .page1 .main-container{--x : 1; --y : 1} 

/* 브랜드1~2 */
.sec2, .page2 .main-container{--x : 1; --y : 2} 

/* 브랜드2 */
.sec3, .page3 .main-container{--x : 1; --y : 2} 

/* 브랜드3 */
.sec4, .page4 .main-container{--x : 2; --y : 2} 

/* 입지1~2 */
.sec5, .page5 .main-container{--x : 2; --y : 3} 

/* 입지2 */
.sec6, .page6 .main-container{--x : 2; --y : 3} 

/* 입지3 */
.sec7, .page7 .main-container{--x : 3; --y : 3} 

/* 갤러리1~2 */
.sec8, .page8 .main-container{--x : 3; --y : 4} 

/* 갤러리2 */
.sec9, .page9 .main-container{--x : 3; --y : 4} 

/* 갤러리3 */
.sec10, .page10 .main-container{--x : 4; --y : 4}

/* 커뮤니티1-1 */
.sec11, .page11 .main-container{--x : 4; --y : 5}

/* 커뮤니티1-2 */
.sec12, .page12 .main-container{--x : 5; --y : 5}

/* 커뮤니티2-1 ~ 2-2 */
.sec13, .page13 .main-container{--x : 5; --y : 6}

/* 커뮤니티2-2 */
.sec14, .page14 .main-container{--x : 5; --y : 6}

/* 커뮤니티2-3 */
.sec15, .page15 .main-container{--x : 6; --y : 6}

/* 인테리어1 */
.sec16, .page16 .main-container{--x : 6; --y : 7}

/* 인테리어2 */
.sec17, .page17 .main-container{--x : 7; --y : 7}

/* 오시는길 */
.sec18, .page18 .main-container{--x : 7; --y : 8}

/* 푸터 */
.sec19, .page19 .main-container{--x : 7; --y : 8}

.page19 .main-container{transform: translateX(calc(-100vw * (var(--x) - 1))) translateY(calc(-100vh * (var(--y) - 1) - 476px));}
.sec.sec19{height : 476px; transform: translateX(calc(100vw * (var(--x) - 1))) translateY(calc(100vh * (var(--y))));}

.main-container{width : 100%;height : 100%; position :absolute; left : 0;top : 0; transition : 1.6s ease;
; transform: translateX(calc(-100vw * (var(--x) - 1))) translateY(calc(-100vh * (var(--y) - 1))); z-index: 1; will-change: transform;}


.sec{width : 100%;height : 100%; position : absolute; transform: translateX(calc(100vw * (var(--x) - 1))) translateY(calc(100vh * (var(--y) - 1))); overflow: hidden;}

.sec-bg{position :absolute; left : 0;top : 0; overflow: hidden;z-index: 0; width : 100%;height : 100%;}
.sec-bg > img,
.sec-bg > video{width : 100%;height : 100%; object-fit: cover; object-position: center;}

/* sec1 메인 */

.sec1 .sec-bg > img{transform: scale(1.5); transition : 5s;}
.on .sec1 .sec-bg > img{transform: scale(1);}

.sec1-inner{display: flex; justify-content: center; max-width: 1740px; height : 100%; margin : 0 auto; position : relative; z-index: 1;}
.sec1-tit-box{display: flex;flex-direction: column; align-items: center; padding-top: 150px; font-family: times-new-roman; color : #897158;}

.sec1-tit{font-weight: 400; font-size: 26px; margin-bottom: 37px; letter-spacing: 0.3em; padding-left: 0.3em; transition : 1.5s;}
.on .sec1-tit{padding-left: 1.2em; letter-spacing: 1.2em; transition-delay: 1.2s;}

.sec1-tit .char{opacity: 0;}

.sec1-logo{font-weight: 400; font-size: 26px; transform: translateY(100px); opacity: 0; transition : 1.5s;}
.on .sec1-logo{transform: translateY(0); opacity: 1; transition-delay: 1.2s;}

.open-rotate-btn{display: flex;flex-direction: column;align-items: center;justify-content: center; color : #fff; font-family: PT; width : 164px; height : 164px; position :absolute; right : 0; bottom : 46px; font-family: PT; font-size: 19px; font-weight: 700; letter-spacing: -0.04em; transform: translateX(100px); opacity: 0; transition : 1.5s;}
.on .open-rotate-btn{transform: translateX(0); opacity: 1; transition-delay: 1.5s;}
.open-rotate-btn::after{position : absolute; content : ''; width : 100%;height : 100%; background: url(../images/main/sec1-rotate-text.png)no-repeat center / contain; animation : rotate-text 8s linear infinite}

@keyframes rotate-text {
    100%{transform: rotate(360deg);}
}

/* sec5,6 입지1 ~ 2 */
.premium-slide{width : 100%;height : 100%;position : relative;}
.premium-container{display: flex; position :absolute; left : 0;top : 0;width : 100%;height : 100%; z-index: 1; transition : 1.4s;}
.t3 .premium-container{transform: translateX(-100%);}
.t4 .premium-container{transform: translateX(-200%);}
.premium-container > div{width : 100%;height : 100%; flex-shrink: 0; position : relative;}
.premium-01{}
.sec5 .sec-bg{transition : 1.5s; top : auto; bottom : 0;}
.sec5 .t2 .sec-bg,
.sec5 .t3 .sec-bg{height : calc(100% - 413px);}

.sec5 .sec-bg > img{transform: scale(1.5); transition : 5s;}
.active.sec5 .sec-bg > img{transform: scale(1); transition : 5s}

.sec5-inner{display: flex;flex-direction: column;justify-content: end;align-items: end; width : 100%; max-width: 1624px;height : 100%; margin : 0 auto; padding : 138px 0 64px; position :relative;}
.sec5-tit{color : #fff; font-family: times-new-roman; font-size: 30px; letter-spacing: 0.3em; font-weight: 400;}
.sec5-tit .char{opacity: 0;}

.sec5-sub-tit{margin-left: auto; color : #fff; font-family: times-new-roman; font-size: 15px; font-weight: 400; letter-spacing: 1.2em;}
.sec5-sub-tit .char{opacity: 0;}

.sec6-box{display: flex;justify-content: center;align-items: end; position : absolute; left : 0;top : 0; width : 100%; height : 413px; padding-bottom: 63px; transform: translateY(-100%); transition : 1.5s;}
.t2 .sec6-box,
.t3 .sec6-box{transform: translateY(0);}

.sec6-tit-box{display: flex;flex-direction: column;align-items: center; transform: translateY(-100px); opacity: 0; transition : 1.5s;}
.t2 .sec6-tit-box,
.t3 .sec6-tit-box{transform: translateY(0); opacity: 1;}

.sec6-sub-tit{display: flex;justify-content: center; font-family: times-new-roman; font-size: 15px; font-weight: 400; letter-spacing: 0.6em; margin-bottom: 35px; padding-left: 0.6em;position : relative;}
.sec6-sub-tit::after{position : absolute; content : ''; width : 95%;height : 1px; background: #000; bottom : 0; transform: translateX(-1.5%);}
.sec6-tit{font-family: PT; font-size: 30px; letter-spacing: -0.03em; line-height: 1.4em; font-weight: 500; text-align: center;}

/**/

.premium-02{display: flex; justify-content: space-between;}
.premium-center{display: flex; justify-content: center; align-items: center; flex : 1; padding : 0 70px 0 95px;}
.premium-center-inner{display: flex; justify-content: space-between; height : 615px; width : 100%;}
.premium-02-left-img{display: flex;align-items: center; opacity: 0; transform: translateY(100px); transition : 1.5s;}
.active .t3 .premium-02-left-img{transform: translateY(0); opacity: 1; transition-delay: .4s;}
.premium-02-right-img{display: flex; align-items: center;justify-content: end;gap : 27px}
.premium-02-right-img > img{opacity: 0; transition : 1.5s;}
.premium-02-right-img > img:nth-child(1){transform: translateY(-100px);}
.premium-02-right-img > img:nth-child(2){transform: translateY(100px);}
.active .t3 .premium-02-right-img > img{transform: translateY(0); opacity: 1; transition-delay: .4s;;}
.premium-tit-box{display: flex;flex-direction: column;align-items: start; transform: translateX(-100px); opacity: 0; transition : 1.2s;}
.t3 .premium-02 .premium-tit-box,
.t4 .premium-03 .premium-tit-box{opacity: 1; transform: translateX(0); transition : 1.5s 0.4s;}

.premium-sub-tit{font-family: times-new-roman; font-size: 15px; letter-spacing: 0.3em; font-weight: 400; color : #897158; margin-bottom: 35px;}

.premium-tit{font-family: PT; font-size: 30px; letter-spacing: -0.03em; line-height: 1.4em; color : #897158; margin-bottom: 34px; font-weight: 500;}

.premium-line{width : 319px; height : 1px; background: #BEBEBE; margin-bottom: 34px; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.t3 .premium-02 .premium-line{clip-path: inset(0); transition : 1.5s 1s;}

.premium-con-box{transform: translateY(200px); opacity: 0; transition : 0s 1.4s;}
.t3 .premium-02 .premium-con-box{transform: translateY(0); opacity: 1; transition : 1.5s 1s;}
.premium-con-tit{font-family: PT; font-size: 24px; font-weight: 500; letter-spacing: -0.03em; color : #0D0D0D; margin-bottom: 14px;}

.premium-con-desc{font-family: PT; font-size: 15px; font-weight: 400; letter-spacing: -0.03em; color : #0D0D0D; line-height: 1.8em;}

.premium-list{text-align: right; font-family: PT; font-size: 20px; font-weight: 500; letter-spacing: -0.03em; font-size: 15px; line-height: 1.5em; color : #080808; margin-top: 110px;}

.premium-list-con{transform: translateY(100px); opacity: 0; transition : 1.5s;}
.active .t3 .premium-list-con{transform: translateY(0); opacity: 1; transition-delay: calc(var(--i) * 0.1s + 0.4s);}
.premium-list-con > h4{color : #897158; margin-bottom: 17px; font-size: 20px; font-weight: 500;}
.premium-list-con + .premium-list-con{margin-top: 50px;}

/**/
.premium-03{display: flex;justify-content: start; background: #EFEBE7;}

.premium-map{position :absolute; left : 0;top : 0; width : 100%;height : 100%; transform: translateX(50%); opacity: 0; transition : 2s;}
.t4 .premium-map{transform: translateX(0); opacity: 1; transition-delay: .4s;}
.premium-map > img{width : 100%;height : 100%; object-fit: cover; object-position: center;}

.premium-map-left{display: flex;flex-direction: column;align-items: center; height : 100%; position : relative; padding-left: 156px; justify-content: center;}
.premium-03 .premium-tit-box{ display: flex;flex-direction: column;align-items: center; text-align: center; color : #000; margin-bottom: 113px;}
.premium-03 .premium-tit{color : #000; margin-bottom: 0;}
.premium-03 .premium-sub-tit{display: flex;justify-content: center; color : #000; position  : relative;}
.premium-03 .premium-sub-tit::after{position : absolute; content : ''; width : 95%;height : 1px; background: #000; bottom : 0; transform: translateX(-1.5%);}

.premium-link{display: flex;flex-direction: column;align-items: center;justify-content: center; line-height: 1.5em; font-size: 19px; width : 132px; height : 132px; border-radius: 50%; background: #897158; color : #fff; text-align: center; font-family: PT; opacity: 0; transform: scale(0.5); transition : 1.5s;}
.t4 .premium-link{transform: scale(1); opacity: 1; transition-delay: 1s;}


.int-slide{width: 100%;height : 100%;}
/* 인테리어1 sec16 */
.int-slide .sec-bg > img{transform: scale(1.5); transition : 0s 1.4s; object-position: center right;}
.active .int-slide .sec-bg > img{transform: scale(1); transition : 3s;}

.sec16-inner{display: flex; align-items: end; padding-bottom: 100px; margin : 0 auto; width : 100%; max-width: 1624px; height : 100%; position :relative; z-index: 1;}

.sec16-tit{color : #fff; font-family: times-new-roman; font-size: 30px; letter-spacing: 0.3em; font-weight: 400;}
.sec16-tit .char{opacity: 0;}

.sec16-img-name{display: flex;align-items: center; justify-content: center; padding : 0 16px; height : 13px; font-family: PT; font-weight: 500; letter-spacing: -0.03em; position : absolute; color : #fff; right : 80px; bottom : 64px; z-index: 1; transition : 1.5s;}

.sec16-img-name::after{position :absolute; content : ''; width : 1px; height : 100%; background: #fff; left : 0;clip-path: inset(50% 0); transition : clip-path .5s, left .5s .5s, background .5s;}
.sec16-img-name::before{position :absolute; content : ''; width : 1px; height : 100%; background: #fff; left : 0;clip-path: inset(50% 0); transition : clip-path .5s, left .5s .5s, background .5s;}

.active .sec16-img-name::after{clip-path: inset(0); transition : clip-path 1.4s .5s, left 1.6s .5s, transform 1.6s .5s, background .5s;}

.active .sec16-img-name::before{clip-path: inset(0); left : 100%; transform: translateX(-100%); transition : clip-path 1.4s .5s, left 1.6s .5s, transform 1.6s .5s, background .5s;}

.sec16-img-name > span{opacity: 0; transform: translateY(100%); transition :opacity 0s 1.4s, transform 0s 1.4s, color .5s;}
.active .sec16-img-name > span{opacity: 1; transform: translateY(0); transition : opacity 1s 1s, transform 1s 1s, color .5s;}

/* 인테리어2 sec17*/
.int-slide-02{display: flex;}
.sec17-left{display: flex;flex-direction: column;justify-content: space-between; align-items: center;  background: #EFEBE7; flex-shrink: 0; padding : 170px 60px 80px;}

.sec17-tit-box{display: flex;flex-direction: column;align-items: start;  transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}
.swiper-slide-active .sec17-tit-box{opacity: 1; transform: translateX(0); transition : 1.5s 0.4s;}

.sec17-sub-tit{font-family: times-new-roman; font-size: 15px; letter-spacing: 0.3em; font-weight: 400; color : #897158; margin-bottom: 35px;}

.sec17-tit{font-family: PT; font-size: 30px; letter-spacing: -0.03em; line-height: 1.4em; color : #897158; margin-bottom: 32px; font-weight: 500;}

.sec17-line{width : 257px; height : 1px; background: #BEBEBE; margin-bottom: 32px; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.swiper-slide-active .sec17-line{clip-path: inset(0); transition : 1.5s 1s;}

.sec17-con-box{transform: translateY(200px); opacity: 0; transition : 0s 1.4s;}
.swiper-slide-active .sec17-con-box{transform: translateY(0); opacity: 1; transition : 1.5s 1s;}
.sec17-con-tit{font-family: PT; font-size: 24px; font-weight: 500; letter-spacing: -0.03em; color : #0D0D0D; margin-bottom: 14px;}

.sec17-con-desc{font-family: PT; font-size: 15px; font-weight: 400; letter-spacing: -0.03em; color : #0D0D0D; line-height: 1.8em;}

.sec17-btn-box{display: flex;gap : 6px;}
.sec17-btn-box > a{transition : 0s 1.4s; opacity: 0; transform: translateY(200px);}
.swiper-slide-active .sec17-btn-box > a:nth-child(1){opacity: 1; transform: translateY(0); opacity: 1; transition : 1.5s 1s}
.swiper-slide-active .sec17-btn-box > a:nth-child(2){opacity: 1; transform: translateY(0); opacity: 1; transition : 1.5s 1.1s}

.sec17-btn-img{margin-bottom: 15px;overflow: hidden; position : relative;}
.sec17-btn-img > video{width : 100%; height : 100%; left : 0;top : 0; position :absolute; object-fit: cover; object-position: center;}
.sec17-btn-tit{font-family: futura-pt; font-size: 20px; font-weight: 500; margin-bottom: 4px;}
.sec17-btn-desc{font-family: PT; font-size: 15px; letter-spacing: -0.04em; font-weight: 400;}


.sec17-right{display: flex;flex-direction: column; align-items: center;justify-content: center; flex : 1;}

.sec17-img-box{display: flex;gap : 19px; margin-bottom: 65px;  transform: translateY(-100px); opacity: 0; transition : 0s 1.4s;}
.swiper-slide-active .sec17-img-box{transform: translateY(0); opacity: 1; transition : 1.5s 1s;}

.sec17-img-box > li{display: flex;flex-direction: column;align-items: end;gap : 13px;}

.sec17-img-name{display: flex;align-items: center; justify-content: center; padding : 0 16px; height : 13px; font-family: PT; font-weight: 500; letter-spacing: -0.03em; color : #A0A0A0; z-index: 1; transition : 1.5s; position : relative;}

.sec17-img-name::after{position :absolute; content : ''; width : 1px; height : 100%; background: #A0A0A0; left : 0;clip-path: inset(50% 0); transition : clip-path .5s, left .5s .5s, background .5s;}
.sec17-img-name::before{position :absolute; content : ''; width : 1px; height : 100%; background: #A0A0A0; left : 0;clip-path: inset(50% 0); transition : clip-path .5s, left .5s .5s, background .5s;}

.swiper-slide-active .sec17-img-name::after{clip-path: inset(0); transition : clip-path 1.4s .5s, left 1.6s .5s, transform 1.6s .5s, background .5s;}

.swiper-slide-active .sec17-img-name::before{clip-path: inset(0); left : 100%; transform: translateX(-100%); transition : clip-path 1.4s .5s, left 1.6s .5s, transform 1.6s .5s, background .5s;}

.sec17-img-name > span{opacity: 0; transform: translateY(100%); transition :opacity 0s 1.4s, transform 0s 1.4s, color .5s;}
.swiper-slide-active .sec17-img-name > span{opacity: 1; transform: translateY(0); transition : opacity 1s 1s, transform 1s 1s, color .5s;}

.sec17-vr-btn{display: flex;flex-direction: column;align-items: center;justify-content: center; position : absolute; width : 84px;height : 84px; background: #000; color : #A99270; font-family: brown; text-align: center; border-radius: 50%; transform: translateX(50%) translateY(-50%); line-height: 1.2em;}

.sec17-list-tit{font-family: PT; font-size: 24px; font-weight: 500; letter-spacing: -0.03em; color : #0D0D0D; margin-bottom: 57px; transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}
.swiper-slide-active .sec17-list-tit{opacity: 1; transform: translateX(0); opacity: 1; transition : 1.5s 1s}

.sec17-list{display: grid;grid-template-columns: repeat(3, 1fr); width : 100%;gap : 50px 0;}
.sec17-list > li{position :relative; transition :0s 1.4s; transform: translateY(200px); opacity: 0;}

.swiper-slide-active .sec17-list > li{transform: translateY(0); opacity: 1; transition: 1.5s calc(var(--i) * 0.15s + 1s);}
.sec17-list .sec17-img{margin-bottom: 38px; overflow: hidden; position : relative}
.sec17-list .sec17-img .img-cut{color : #fff; position : absolute; bottom : 12px; right : 16px; font-size : 13px; font-family : PT; letter-spacing : -0.04em}
.sec17-list .sec17-img > img{transition : 2s}
.sec17-list > li:hover .sec17-img > img{transform: scale(1.2);}
.sec17-list-con{font-family: PT; letter-spacing: -0.033em; color : #2B2B2B; padding-left: 35px; position :relative;}

.sec17-list-con::after{position : absolute; content : ''; width : 1px; height : 100%; left : 0;top : 0; background: #B2B2B2; clip-path: inset(0 0 100%); transition : 0s 1.4s}
.swiper-slide-active .sec17-list-con::after{clip-path: inset(0); transition : 1s 1.4s;}

.sec17-list-con h4{font-size: 22px; margin-bottom: 14px; font-weight: 500; opacity: 0; transition : 0s 1.4s; color : #897158;}
.swiper-slide-active .sec17-list-con h4{opacity: 1; transition : 1s 1.4s;}

.sec17-list-con p{font-size: 15px; font-weight: 500; line-height: 1.5em;}

.sec17-list-con p .line{transform: translateX(-100px); opacity: 0; transition : 0s 1.4s;}
.swiper-slide-active .sec17-list-con p .line:nth-child(1){transform: translateX(0); opacity: 1; transition : 1.4s 1.4s;}
.swiper-slide-active .sec17-list-con p .line:nth-child(2){transform: translateX(0); opacity: 1; transition : 1.4s 1.5s;}
.swiper-slide-active .sec17-list-con p .line:nth-child(3){transform: translateX(0); opacity: 1; transition : 1.4s 1.6s;}
.swiper-slide-active .sec17-list-con p .line:nth-child(4){transform: translateX(0); opacity: 1; transition : 1.4s 1.7s;}

/* 오시는길 sec18 */
.sec18{display: flex;flex-direction: column; align-items: center;justify-content: center;}
.sec18 .sec-bg > img{transform: scale(1.5); transition : 0s 1.4s;}
.fp-active .sec18 .sec-bg > img{transform: scale(1); transition : 5s;}

.sec18-tit{display: flex;flex-direction: column;align-items: center; font-family: times-new-roman; font-size: 36px; letter-spacing: 0.3em; color : #897158; font-weight: 400; position : relative; margin-bottom: 90px;}
.sec18-tit .char{opacity: 0;}

.sec18-container{display: flex;flex-direction: column;align-items: center;justify-content: center; width : 100%;height : 100%;;}
.sec18-inner{display: flex; align-items: center;gap : 78px; position : relative;}

.sec18-map{transform: translateX(-200px); opacity: 0; transition : 0s 1.4s;}
.fp-active .sec18-map{transform: translateX(0);opacity: 1; transition : 1.5s 1s;}

.sec18-address-tit{font-family: PT; font-size: 25px; letter-spacing: -0.04em; color : #897158; font-weight: 500; margin-bottom: 26px; transform: translateX(100px); opacity: 0; transition : 0s 1.4s;}
.fp-active .sec18-address-tit{transform: translateX(0); opacity: 1; transition : 1.5s 1s;}

.sec18-address-desc{font-family: PT; font-size: 16px; letter-spacing: -0.04em; font-weight: 500; color : #000; margin-bottom: 26px; transform: translateX(100px); opacity: 0; transition : 0s 1.4s;}
.fp-active .sec18-address-desc{transform: translateX(0); opacity: 1; transition : 1.5s 1.1s;}

.sec18-btn-box{display: flex;gap : 4px; transform: translateX(100px); opacity: 0; transition : 0s 1.4s;}
.fp-active .sec18-btn-box{transform: translateX(0); opacity: 1; transition : 1.5s 1.2s;}

.sec18-line{width : 338px; height : 1px; background: #7B7B7B; margin : 30px 0; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.fp-active .sec18-line{clip-path: inset(0); transition : 1.5s .4s;}

.contact-tel{margin-top: 50px; transform: translateY(100px); opacity: 0; transition : 1.5s;}
.fp-active .contact-tel{transform: translateY(0); opacity: 1; transition : 1.5s 1s;}

/* 푸터 sec19 */
.sec19{background: #000;}

/**/

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

.t2 .com-bg,
.t3 .com-bg{ width : 814px; height : 506px;}

.com-container{display: flex; position :absolute; left : 0;top : 0; width : 100%; height : 100%; transition : 1.4s;}
.t3 .com-container{transform: translateX(-100%);}
.t4 .com-container{transform: translateX(-200%);}
.t5 .com-container{transform: translateX(-300%);}
.com-container > div{width : 100%;height : 100%; flex-shrink: 0; position : relative;}


.com-inner{display: flex; width : 100%;height : 100%; margin : 0 auto; position :relative; padding-top: 160px;}
.com-img-box-01{padding-left: 832px; position :absolute; bottom : 0;}

.com-right{display: flex;flex-direction: column;justify-content: space-between; margin-left: auto; padding : 0 100px 0 70px; border-left : 1px solid rgba(0,0,0,0.15); padding-bottom: 80px; opacity: 0; transition : 1s;}
.t2 .com-right{opacity: 1;}
.com-img-box-02{display: flex;gap : 18px;}
.com-img-inner{position : relative;}
.com-img-inner .com-img-name{position : absolute; right : 22px; bottom : 18px;}

.com-page-tit{color : #fff; font-family: times-new-roman; font-size: 30px; letter-spacing: 0.3em; font-weight: 400; transition : 1s; position : absolute; left : 148px; bottom :100px;}
.t2 .com-page-tit,
.t3 .com-page-tit{opacity: 0;}
.com-page-tit .char{opacity: 0;}

.com-img-name{display: flex;align-items: center; justify-content: center; padding : 0 16px; height : 13px; font-family: PT; font-weight: 500; letter-spacing: -0.03em; position : absolute; color : #fff; right : 80px; bottom : 64px; z-index: 1; transition : 1.5s; white-space: nowrap; flex-shrink: 0;}
.com-03 .com-img-name{position : relative; right : auto; bottom : auto; margin-left: auto; margin-top: 15px;}

.com-04-img-01 .com-img-name{bottom : calc(100% + 10px); right : 0; left : auto; top : auto;}
.com-04-img-02 .com-img-name{bottom : 10px; right : 260px; left : auto; top : auto;}
.com-04-img-03 .com-img-name{bottom : 10px; left : 285px; right: auto; top : auto;}
.com-04-img-04 .com-img-name{top : calc(100% + 10px); right : 0; left : auto; bottom : auto;}

.com-img-name::after{position :absolute; content : ''; width : 1px; height : 100%; background: #fff; left : 0;clip-path: inset(50% 0); transition : clip-path .5s, left .5s .5s, background .5s;}
.com-img-name::before{position :absolute; content : ''; width : 1px; height : 100%; background: #fff; left : 0;clip-path: inset(50% 0); transition : clip-path .5s, left .5s .5s, background .5s;}

.com-img-name > span{opacity: 0; transform: translateY(100%); transition :opacity 0s 1.4s, transform 0s 1.4s, color .5s;}

.active .com-bg .com-img-name::after,
.t2 .com-img-inner .com-img-name::after,
.t4 .com-03 .com-img-name::after,
.t5 .com-04 .com-img-name::after{clip-path: inset(0); transition : clip-path 1.4s .5s, left 1.6s .5s, transform 1.6s .5s, background .5s;}

.active .com-bg .com-img-name::before,
.t2 .com-img-inner .com-img-name::before,
.t4 .com-03 .com-img-name::before,
.t5 .com-04 .com-img-name::before{clip-path: inset(0); left : 100%; transform: translateX(-100%); transition : clip-path 1.4s .5s, left 1.6s .5s, transform 1.6s .5s, background .5s;}

.active .com-bg .com-img-name > span,
.t2 .com-img-inner .com-img-name > span,
.t4 .com-03 .com-img-name > span,
.t5 .com-04 .com-img-name > span{opacity: 1; transform: translateY(0); transition : opacity 1s 1s, transform 1s 1s, color .5s;}

.com-left-con{display: flex; padding-left: 105px; gap : 214px;}

.com-tit-box{display: flex;flex-direction: column;align-items: start;  transform: translateX(-100px); opacity: 0; transition : 1.5s}
.t2 .com-tit-box{opacity: 1; transform: translateX(0); transition : 1.5s .8s;}

.com-sub-tit{font-family: times-new-roman; font-size: 15px; letter-spacing: 0.3em; font-weight: 400; color : #897158; margin-bottom: 35px;}

.com-tit{font-family: PT; font-size: 30px; letter-spacing: -0.03em; line-height: 1.4em; color : #897158; margin-bottom: 32px; font-weight: 500;}

.com-line{width : 257px; height : 1px; background: #BEBEBE; margin-bottom: 32px; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.com-line{clip-path: inset(0); transition : 1s .8s;}

.com-desc-box{transform: translateX(100px); opacity: 0; transition : 1.5s; margin-top: 60px;font-family: PT; font-size: 15px; font-weight: 400; letter-spacing: -0.03em; color : #0D0D0D; line-height: 1.8em;}
.t2 .com-desc-box{transform: translateX(0); opacity: 1;transition : 1.5s .8s;}


.com-list{font-family: PT; font-size: 20px; font-weight: 500; letter-spacing: -0.03em; font-size: 15px; line-height: 1.5em; color : #080808;}

.com-list > li{display: flex;flex-direction: column; transform: translateY(100px); opacity: 0; transition : 1s; padding-left: 28px; border-left : 1px solid #676767;}
.t2 .com-list > li{transform: translateY(0); opacity: 1; transition-delay: calc(var(--i) * 0.1s + .8s);}
.com-list > li > b{color : #897158; margin-bottom: 7px; font-size: 20px; font-weight: 500;}
.com-list > li + li{margin-top: 50px;}

.com-obj{position : absolute; right : 100px; bottom : 100px; z-index: 0; opacity: 0; transition : 1s;}
.t2 .com-obj{opacity: 1; transition : 1s .4s;}

.com-img{opacity: 0;transform: scale(0.7); transition : .8s;}
.t2 .com-img-01{opacity: 1; transform: scale(1); transition : .8s .8s}
.t2 .com-img-02{opacity: 1; transform: scale(1); transition : .8s 1s}
.t2 .com-img-03{opacity: 1; transform: scale(1); transition : .8s 1.2s}

.com-02{display: flex;flex-direction: column;align-items: center;justify-content: center; background: #EFEBE7; padding-top: 100px;}
.com-02-tit-box{display: flex;flex-direction: column;align-items: center;  transform: translateY(-100px); opacity: 0; transition : 0s 1.4s; text-align: center; margin-bottom: 124px;}
.t3 .com-02-tit-box{opacity: 1; transform: translateX(0); transition : 1.5s 0.4s;}

.com-02-sub-tit{display : flex; justify-content: center; font-family: times-new-roman; font-size: 15px; letter-spacing: 0.3em; font-weight: 400; color : #897158; margin-bottom: 35px; position : relative;}
.com-02-sub-tit::after{position : absolute; content : ''; width : 95%;height : 1px; background: #897158; bottom : 0; transform: translateX(-1.5%);}

.com-02-tit{font-family: PT; font-size: 30px; letter-spacing: -0.03em; line-height: 1.4em; color : #897158; margin-bottom: 32px; font-weight: 500;}

.com-02-con-desc{font-family: PT; font-size: 15px; font-weight: 400; letter-spacing: -0.03em; color : #0D0D0D; line-height: 1.8em;}

.com-img-list{display: flex;gap : 18px;}
.com-img-list > li{display: flex;flex-direction: column;align-items: center; transform: translateY(100px); opacity: 0; transition : 1.5s;}
.t3 .com-img-list > li{transform: translateY(0); opacity: 1; transition : 1.5s calc(var(--i) * 0.1s + 1s)}


.com-img-inner{margin-bottom: 30px;}
.com-img-list-name{display: flex;align-items: center; justify-content: center; width : 238px; height : 13px; color : #A0A0A0; border-left : 1px solid #A0A0A0; border-right : 1px solid #A0A0A0; font-family: PT; font-size: 15px; letter-spacing: -0.04em;}

.com-container .sec-bg{filter: brightness(0.3);}

.com-03-inner{display: flex;position : relative; justify-content: center;align-items: center; gap : 122px; height : 100%; padding-top: 80px;}

.com-03-left{display: flex;flex-direction: column;gap : 80px;}
.com-03-right{max-width: 60.5208%;}
.com-03-bg{display: flex;flex-direction: column;align-items: end;}
.com-03-bg-inner > img{max-height: 79.7938vh;}
.com-03-tit-box{display: flex;flex-direction: column;align-items: center; transform: translateX(-100px); opacity: 0; transition : 1.2s; text-align: center;}
.t4 .com-03-tit-box{opacity: 1; transform: translateX(0); transition : 1.5s 0.4s;}

.com-03-sub-tit{display: flex;justify-content: center; font-family: times-new-roman; font-size: 15px; letter-spacing: 0.3em; font-weight: 400; color : #897158; margin-bottom: 35px; position : relative;}
.com-03-sub-tit::after{position : absolute; content : ''; width : 95%;height: 1px; background: #897158; bottom : 0; transform: translateX(-1.5%);}

.com-03-tit{font-family: PT; font-size: 30px; letter-spacing: -0.03em; line-height: 1.4em; color : #897158; margin-bottom: 34px; font-weight: 500;}

.com-03-line{width : 100%; height : 1px; background: #404040; margin-bottom: 34px; clip-path: inset(0 100% 0 0); transition : 0s 1.4s;}
.t4 .com-03-line{clip-path: inset(0); transition : 1.5s 1s;}

.com-03-con-desc{font-family: PT; font-size: 15px; font-weight: 400; letter-spacing: -0.03em; color : #0D0D0D; line-height: 1.8em; color : #696969;}
.com-03-con-desc span{color :#fff;}

.com-03-img{transform: translateY(100px); opacity: 0; transition : 1.5s;}
.t4 .com-03-img{transform: translateY(0); opacity: 1; transition :1.5s 1s;}

.com-03-bg-inner{overflow: hidden;}
.com-03-bg-inner > img{transform: scale(1.5); transition : 3s;}
.t4 .com-03-bg-inner > img{transform: scale(1);}

/**/
.com-04-inner{display: flex;justify-content: center; align-items: center;  position : relative; height : 100%;gap : 28px;padding-top: 100px;}
.com-04-img-box{display: flex;gap : 10px;}
.com-04-img-box > div{display: flex;flex-direction: column;gap : 10px;}
.com-04-img-left{align-items: end; }
.com-04-img-right{align-items: start; transform: translateY(-60px);}
.com-04-img-01,
.com-04-img-02,
.com-04-img-03,
.com-04-img-04{position : relative; transition : 1.5s; opacity: 0;}
.com-04-img-01{transform: translateX(-200px);}
.com-04-img-02{transform: translateY(200px);}
.com-04-img-03{transform: translateY(-200px);}
.com-04-img-04{transform: translateX(200px);}

.t5 .com-04-img-01,
.t5 .com-04-img-02,
.t5 .com-04-img-03,
.t5 .com-04-img-04{transform: translateX(0);opacity: 1; transition : 1.5s .4s;}

.com-04-list{font-family: PT; font-size: 20px; font-weight: 500; letter-spacing: -0.03em; font-size: 15px; line-height: 1.5em; color : #080808;}
.com-04-list-01{align-self: start; padding-top: 180px;;}
.com-04-list-02{align-self: end; padding-bottom: 140px;}

.com-04-list > li{display: flex;flex-direction: column; transform: translateY(100px); opacity: 0; transition : 1s; padding-left: 28px; border-left : 1px solid #676767; color : #fff;}
.t5 .com-04-list > li{transform: translateY(0); opacity: 1; transition-delay: calc(var(--i) * 0.1s + .8s);}
.com-04-list > li > b{color : #897158; margin-bottom: 7px; font-size: 20px; font-weight: 500;}
.com-04-list > li + li{margin-top: 50px;}