@charset "utf-8";

/*
* File       : layout.css
* Author     : B-WORKER
* Dependency : css/reset.css
*      
 * SUMMARY:
 * 1) MAIN animation
 * 2) MAIN CONTENTS
*/

/* **************************************** *
 * 사이트 시작시 커버
 * **************************************** */
.main-cover{position:fixed; opacity:1; visibility:visible; top:0; left:0; z-index:999; width:100%; height:100%; background:#121212; transition:all 0.5s ease 0s}

.motion-on .main-cover{opacity:0; visibility:hidden}

/* **************************************** *
 * Main animation set
 * **************************************** */
[data-txt-motion]{}
[data-txt-motion="hidden"]{overflow:hidden}
[data-txt-motion="hidden"] > span{display:block; opacity:0}

.swiper-slide-active [data-txt-motion="hidden"] > span{animation:text_hidden_motion 1.6s ease 0.1s forwards}
.swiper-slide-active [data-txt-motion="left"]{animation:text_left_motion 1.6s ease 0.1s forwards}
.swiper-slide-active [data-txt-motion="right"]{animation:text_right_motion 1.6s ease 0.1s forwards}
.swiper-slide-active [data-txt-motion="up"]{animation:text_up_motion 1.6s ease 0.1s forwards}
.swiper-slide-active [data-txt-motion="down"]{animation:text_down_motion 1.6s ease 0.1s forwards}
.swiper-slide-active .main-visual__bg i{transform:scale(1)}

.main-visual__text [data-txt-motion="hidden"]{opacity:1}
.main-visual__bg i{transform:scale(1.2); transition:transform 15s ease}

@keyframes text_hidden_motion {
 from{opacity:0; transform:translateY(70rem);}
 to{opacity:1; transform:translateY(0);}
}

@keyframes text_left_motion {
 from{opacity:0; transform:translateX(70rem);}
 to{opacity:1; transform:translateX(0);}
}

@keyframes text_right_motion {
 from{opacity:0; transform:translateX(-70rem);}
 to{opacity:1; transform:translateX(0);}
}

@keyframes text_up_motion {
 from{opacity:0; transform:translateY(70rem);}
 to{opacity:1; transform:translateX(0);}    
}

@keyframes text_down_motion {
 from{opacity:0; transform:translateY(-70rem);}
 to{opacity:1; transform:translateX(0);}
}

/* **************************************** *
 * Site custom
 * **************************************** */

/* main title */
.main-title{display:flex; flex-direction:column; align-items:flex-start; gap:20rem}

@media (max-width:1200px){
	.main-title{gap:16rem}
}

@media (max-width:540px){
	.main-title{gap:16rem}
}

/* main visual */
.main-visual{position:relative; height:var(--height-full)}
.main-visual__bg{position:absolute; top:0; left:0; width:100%; height:100%}
.main-visual__bg i{display:block; height:100%; background-position:50% 50%; background-size:cover}
.main-visual__video{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover}
iframe.main-visual__video{top:50%; left:50%; transform:translate(-50%, -50%); pointer-events:none}
.main-visual-container, .main-visual-wrapper, .main-visual .swiper-slide{height:100% !important}
.main-visual__item{display:flex; align-items:center}
.main-visual__inner{z-index:2; flex:1}
.main-visual__fixed{position:absolute; top:0; left:0; z-index:5; display:flex; align-items:center; width:100%; height:100%; pointer-events:none}
.main-visual__text{display:flex; flex-direction:column; align-items:flex-start; gap:8rem; margin-bottom:41rem}
.main-visual__text h2{position:relative}
.main-visual__text .scatter_word{display:inline-block; white-space:nowrap}
.main-visual__text .scatter_char{display:inline-block; margin:-0.25em -0.1em; padding:0.25em 0.1em; opacity:0; filter:blur(30rem); transform:translate3d(0.25em, 1em, 0) skew(15deg, 30deg) scale(2); transform-origin:0 100%; transition:opacity 1.6s cubic-bezier(0.3, 0.19, 0.3, 1), filter 1.6s cubic-bezier(0.3, 0.19, 0.3, 1), transform 1.6s cubic-bezier(0.3, 0.19, 0.3, 1); transition-delay:0s; will-change:opacity, filter, transform}
.main-visual__text .scatter_char[data-r="1"]{transition-delay:0.06s}
.main-visual__text .scatter_char[data-r="2"]{transition-delay:0.12s}
.main-visual__text .scatter_char[data-r="3"]{transition-delay:0.18s}
.main-visual__text .scatter_char[data-r="4"]{transition-delay:0.24s}
.main-visual__text .scatter_char[data-r="5"]{transition-delay:0.3s}
.main-visual__text .scatter_char[data-r="6"]{transition-delay:0.36s}
.main-visual__text .scatter_char[data-r="7"]{transition-delay:0.42s}
.main-visual__text .scatter_char[data-r="8"]{transition-delay:0.48s}
.main-visual__text .scatter_char[data-r="9"]{transition-delay:0.54s}
.main-visual__text .scatter_char[data-r="10"]{transition-delay:0.6s}
.main-visual__text.is-in .scatter_char{opacity:1; filter:blur(0); transform:translate3d(0, 0, 0) skew(0deg, 0deg) scale(1)}
@media (prefers-reduced-motion: reduce){
	.main-visual__text .scatter_char{opacity:1; filter:none; transform:none; transition:none}
}
.main-visual__bottom{position:absolute; bottom:60rem; left:0; z-index:10; width:100%; pointer-events:none}
.main-visual__bottom-inner{display:flex; align-items:flex-end; justify-content:space-between}
.main-visual__bottom .main-visual__txt{display:flex; flex-direction:column; align-items:flex-start; gap:30rem; pointer-events:auto}
.main-visual__control{display:flex; align-items:center; gap:20rem}
.main-visual__btn{flex:none; width:20rem; height:20rem; background:url(../img/main/visual-arrow.svg) no-repeat 50% 50% / 16rem auto; cursor:pointer}
.main-visual__btn.button-next{transform:scaleX(-1)}
.main-visual__count{display:flex; align-items:center; gap:15rem}
.main-visual__count em{display:flex; align-items:center; gap:15rem}
.main-visual__count em::before{content:""; height:14rem; border-left:1px solid var(--op-w10)}
.main-visual__descs{display:grid; align-items:start; justify-items:start}
.main-visual__desc{grid-area:1 / 1; opacity:0; transform:translateY(20rem); transition:var(--trans-02); pointer-events:none}
.main-visual__desc.on{opacity:1; transform:translateY(0); pointer-events:auto}
.main-visual__side{position:absolute; top:0; left:0; z-index:10; display:flex; align-items:center; width:100%; height:100%; pointer-events:none}
.main-visual__side-inner{flex:1; display:flex; align-items:center; justify-content:flex-end; margin-bottom:42rem}
.main-visual__scroll{display:flex; align-items:center; gap:10rem; pointer-events:auto}
.main-visual__bar{position:relative; flex:none; width:18rem; height:200rem; margin:0 -5rem; overflow:hidden}
.main-visual__bar::before{content:""; position:absolute; top:0; left:8rem; width:2rem; height:100%; background:repeating-linear-gradient(to bottom, var(--w) 0 4rem, transparent 4rem 8rem); opacity:0.2; -webkit-mask:linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent); mask:linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent)}
.main-visual__bar i{position:absolute; top:75rem; left:8rem; width:2rem; height:50rem; background:var(--c-secondary)}
.main-visual__bar i::after{content:""; position:absolute; top:50%; left:50%; width:8rem; height:8rem; background:var(--w); border-radius:50%; box-shadow:0 3rem 5rem rgba(0, 0, 0, 0.5); transform:translate(-50%, -50%); animation:mv_scroll_dot 1.2s ease-in-out infinite alternate}
.main-visual__scroll-txt{writing-mode:vertical-rl; color:var(--w)}
.main-visual__scroll-txt span{opacity:0.3; animation:mv_scroll_txt 2.4s ease-in-out infinite}
@keyframes mv_scroll_dot{
	0%{top:0}
	100%{top:100%}
}
@keyframes mv_scroll_txt{
	0%, 40%, 100%{opacity:0.3}
	20%{opacity:1}
}
@media (prefers-reduced-motion: reduce){
	.main-visual__bar i::after{top:50%; animation:none}
	.main-visual__scroll-txt span{animation:none}
}

/* quick-video */
.quick-video{--qv-h:70rem; display:flex; flex-direction:column; justify-content:flex-end; flex:none; width:260rem; height:var(--qv-h); overflow:hidden; border-radius:5rem; filter:drop-shadow(5rem 12rem 10rem rgba(0,0,0,0.25)); pointer-events:auto; transition:height 0.5s cubic-bezier(0.215, 0.61, 0.355, 1)}
.quick-video__box{flex:none; height:180rem; background:url(../img/main/quick-video-thumb.webp) no-repeat 50% 50% / cover}
.quick-video__btn{display:flex; align-items:center; justify-content:space-between; flex:none; box-sizing:border-box; width:100%; height:var(--qv-h); padding:0 20rem; background:var(--c-secondary); text-align:left; cursor:pointer; transition:var(--trans-01)}
.quick-video__btn::after{content:""; flex:none; width:16rem; height:16rem; background:url(../img/main/visual-arrow.svg) no-repeat 50% 50% / contain; transform:scaleX(-1)}
.quick-video__label{display:flex; align-items:center; gap:8rem}
.quick-video__label img{flex:none; width:22rem; height:auto}
.quick-video--catalog .quick-video__btn{background:var(--c-primary)}
.main-visual__actions{display:flex; align-items:flex-end; flex:none; gap:10rem}

/* main intro */
.main-intro{--intro-gap:60rem; position:relative; z-index:0; padding-top:var(--space140); padding-bottom:calc(var(--space140) / 2); overflow-x:clip}
.main-intro__inner{display:flex; flex-direction:column; align-items:flex-start; gap:var(--intro-gap)}
.main-intro__photo{position:absolute; top:-145rem; left:589.5rem; z-index:-1; display:flex; align-items:center; justify-content:center; width:1183rem; aspect-ratio:1183 / 821; pointer-events:none}
.main-intro__photo-box{position:relative; flex:none; width:1146rem; aspect-ratio:3 / 2; transform:rotate(-2.92deg)}
.main-intro__photo-box img{display:block; width:100%; height:100%; object-fit:cover}
.main-intro__photo-box::after{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(248.71deg, rgba(255,255,255,0) 69.068%, rgba(255,255,255,0.96) 82.775%, var(--w) 101.09%)}
.main-intro__left{display:flex; flex-direction:column; align-items:flex-start; gap:30rem; width:535rem}
.main-intro__year{display:flex; flex-direction:column; align-items:flex-start; gap:4rem}
.main-intro__num{font-size:210rem}
.main-intro__front{position:absolute; top:0; left:0; z-index:5; width:100%; height:100%; visibility:hidden; pointer-events:none}
.main-intro__front-num{position:absolute; top:50%; left:50%; display:grid; place-items:center; line-height:1.1; white-space:nowrap; transform:translate(-50%, -50%)}
.main-intro__svg{grid-area:1 / 1; display:block; width:auto; height:1.1em; overflow:visible; fill:currentColor; fill-opacity:0; stroke:currentColor; stroke-width:14; stroke-linecap:round; stroke-linejoin:round}
.main-intro__front-text{grid-area:1 / 1; display:block; opacity:0}
.main-intro__digit{display:inline-block; height:1.1em; overflow:hidden; vertical-align:top}
.main-intro__digit-track{display:flex; flex-direction:column; align-items:flex-start}
.nowrap{white-space:nowrap}
.main-intro__txt{display:flex; flex-direction:column; align-items:flex-start; gap:18rem; width:100%}
.main-intro__txt p{white-space:nowrap}
.main-intro__slogan{width:100%; text-align:right}
.main-intro [data-intro-rise]{overflow:hidden}
.main-intro__rise{display:block}
.main-intro__rolling{margin-top:var(--intro-gap); overflow:hidden}
.main-intro__track{display:flex; align-items:flex-start; width:max-content; font-size:150rem}
.main-intro__track span{flex:none; padding-right:80rem; white-space:nowrap; opacity:0.05}
.main-intro__deco{position:absolute; top:538rem; left:-160rem; z-index:-1; display:flex; align-items:center; justify-content:center; width:591rem; height:591rem; pointer-events:none}
.main-intro__deco img{flex:none; width:478rem; height:auto; transform:rotate(16.03deg)}

@media (max-width:1480px){
	.main-intro{--intro-gap:52rem}
	.main-intro__photo{top:-125rem; left:540rem; width:1033rem}
	.main-intro__photo-box{width:1000rem}
	.main-intro__num{font-size:190rem}
	.main-intro__track{font-size:130rem}
	.main-intro__track span{padding-right:70rem}
	.main-intro__deco{top:470rem; left:-140rem; width:520rem; height:520rem}
	.main-intro__deco img{width:420rem}
}

@media (max-width:1200px){
	.main-intro{--intro-gap:44rem}
	.main-intro__left{gap:26rem}
	.main-intro__photo{top:-100rem; left:430rem; width:888rem}
	.main-intro__photo-box{width:860rem}
	.main-intro__num{font-size:160rem}
	.main-intro__track{font-size:110rem}
	.main-intro__track span{padding-right:60rem}
	.main-intro__deco{top:430rem; left:-110rem; width:420rem; height:420rem}
	.main-intro__deco img{width:340rem}
}

@media (max-width:1023px){
	.main-intro{--intro-gap:38rem}
	.main-intro__left{gap:22rem}
	.main-intro__txt{gap:14rem}
	.main-intro__year{gap:3rem}
	.main-intro__photo{top:-60rem; left:340rem; width:740rem}
	.main-intro__photo-box{width:716rem}
	.main-intro__num{font-size:130rem}
	.main-intro__track{font-size:90rem}
	.main-intro__track span{padding-right:50rem}
	.main-intro__deco{top:430rem; left:-90rem; width:340rem; height:340rem}
	.main-intro__deco img{width:270rem}
}

@media (max-width:860px){
	.main-intro{--intro-gap:32rem}
	.main-intro__txt p{white-space:normal}
	.main-intro__txt p br{display:none}
	.main-intro__photo{top:200rem; left:auto; right:-220rem; width:700rem}
	.main-intro__photo-box{width:678rem}
	.main-intro__num{font-size:110rem}
	.main-intro__track{font-size:76rem}
	.main-intro__track span{padding-right:40rem}
	.main-intro__deco{top:auto; bottom:80rem; width:260rem; height:260rem}
	.main-intro__deco img{width:210rem}
}

@media (max-width:540px){
	.main-intro{--intro-gap:72rem}
	.main-intro__left{gap:20rem; width:100%}
	.main-intro__txt{gap:14rem}
	.main-intro__year{gap:4rem}
	.main-intro__photo{top:301.76rem; left:105rem; right:auto; width:278.825rem}
	.main-intro__photo-box{width:270rem}
	.main-intro__num{font-size:var(--font-210)}
	.main-intro__rolling{margin-top:36rem}
	.main-intro__track{font-size:var(--font-150)}
	.main-intro__track span{padding-right:40rem}
	.main-intro__deco{top:501rem; bottom:auto; left:-30rem; width:185.6rem; height:185.6rem}
	.main-intro__deco img{width:150rem}
}

/* main product */
.main-product{display:grid; padding-bottom:var(--space140)}
.main-product__left{grid-area:1 / 1; display:flex; align-items:center; pointer-events:none}
.main-product__left-wrap{flex:1; display:flex; align-items:center}
.main-product__info{display:flex; flex-direction:column; align-items:flex-start; gap:80rem; pointer-events:auto}
.main-product__txt{display:flex; flex-direction:column; align-items:flex-start; gap:42rem}
.main-product__ctrl{display:flex; align-items:center; gap:24rem}
.main-product__bar{position:relative; flex:none; width:120rem; height:2rem; background:var(--op-t10)}
.main-product__bar i{position:absolute; top:0; left:0; width:100%; height:100%; background:var(--c-secondary); transform:scaleX(var(--mp-p, 0.5)); transform-origin:0 50%}
.main-product__control{display:flex; align-items:center; gap:20rem}
.main-product__btn{position:relative; flex:none; width:20rem; height:20rem; background:url(../img/main/product-arrow.svg) no-repeat 50% 50% / 16rem auto; cursor:pointer}
.main-product__btn--next{transform:scaleX(-1)}
.main-product__count{display:flex; align-items:center; gap:15rem}
.main-product__count em{display:flex; align-items:center; gap:15rem}
.main-product__count em::before{content:""; height:14rem; border-left:1px solid var(--br-default)}
.main-product__descs{display:grid; align-items:start; overflow:hidden}
.main-product__desc{grid-area:1 / 1; box-sizing:border-box; width:100%; display:flex; flex-direction:column; align-items:flex-start; gap:30rem; visibility:hidden; transform:translateX(100%); transition:transform 1s cubic-bezier(0.215, 0.61, 0.355, 1), visibility 0s linear 1s}
.main-product__desc.on{visibility:visible; transform:translateX(0); transition-delay:0s}
.main-product__desc.prev, .main-product__desc.out-l{transform:translateX(-100%)}
.main-product__desc .btn-basic{flex:none; white-space:nowrap}
.main-product__head{display:flex; flex-direction:column; align-items:flex-start; gap:20rem}
.main-product__sub{display:flex; flex-direction:column; align-items:flex-start; gap:8rem}
.main-product__inner{grid-area:1 / 1; display:flex; align-items:center; justify-content:flex-end; width:100%; pointer-events:none}
.main-product__list{--mp-w:1000rem; --mp-gap:20rem; --mp-a:calc((100% - var(--mp-gap) * 2) / 2); position:relative; flex:none; width:var(--mp-w); aspect-ratio:1000 / 600; overflow:hidden; pointer-events:auto}
.main-product__card{position:absolute; top:0; left:100%; width:calc(var(--mp-a) / 2); height:100%; overflow:hidden; border-radius:20rem; transition:var(--trans-02)}
.main-product__card img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover}
.main-product__shade{position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; pointer-events:none; transition:opacity 1s ease}
.main-product__shade--a{background:linear-gradient(139.7deg, rgba(226,233,244,0.5) 1.0947%, rgba(238,238,238,0) 26.359%)}
.main-product__shade--b{background:linear-gradient(-90deg, rgba(226,233,244,0.3) 0%, rgba(238,238,238,0) 15.833%); mix-blend-mode:multiply}
.main-product__shade--c{background:linear-gradient(141.86deg, rgba(0,0,0,0.11) 3.3773%, rgba(0,0,0,0) 30.548%)}
.main-product__shade--n{background:linear-gradient(to right, rgba(219,223,235,0.5), rgba(219,223,235,0) 34.583%); mix-blend-mode:multiply}
.main-product__card.on{left:0; width:var(--mp-a)}
.main-product__card.on .main-product__shade--a, .main-product__card.on .main-product__shade--b, .main-product__card.on .main-product__shade--c, .main-product__card.next .main-product__shade--n{opacity:1}
.main-product__card.next{left:calc(var(--mp-a) + var(--mp-gap))}
.main-product__card.next2{left:calc(var(--mp-a) * 1.5 + var(--mp-gap) * 2)}
.main-product__card.prev, .main-product__card.out-l{left:calc((var(--mp-a) + var(--mp-gap)) * -1); width:var(--mp-a)}
.main-product__list .is-jump, .main-product__descs .is-jump{transition:none}

@media (max-width:1919px){
	.main-product__inner{width:auto}
}

@media (max-width:1600px){
	.main-product__list{--mp-w:900rem; --mp-gap:18rem}
}

@media (max-width:1480px){
	.main-product__list{--mp-w:820rem; --mp-gap:16rem}
	.main-product__info{gap:60rem}
	.main-product__txt{gap:36rem}
	.main-product__desc{gap:26rem}
	.main-product__card{border-radius:18rem}
}

@media (max-width:1200px){
	.main-product__list{--mp-w:640rem; --mp-gap:14rem}
	.main-product__info{gap:50rem}
	.main-product__txt{gap:32rem}
	.main-product__ctrl{gap:20rem}
	.main-product__desc{gap:22rem}
	.main-product__head{gap:16rem}
	.main-product__card{border-radius:16rem}
}

@media (max-width:1023px){
	.main-product{display:flex; flex-direction:column; gap:50rem}
	.main-product__left{pointer-events:auto}
	.main-product__left-wrap{align-items:flex-start}
	.main-product__info{gap:40rem}
	.main-product__txt{gap:30rem}
	.main-product__inner{justify-content:flex-start}
	.main-product__list{--mp-w:100%; --mp-gap:14rem; aspect-ratio:1000 / 520}
	.main-product__card{border-radius:14rem}
	.main-product__shade--b, .main-product__shade--n{mix-blend-mode:normal}
}

@media (max-width:860px){
	.main-product{gap:44rem}
	.main-product__list{--mp-gap:12rem; aspect-ratio:1000 / 560}
}

@media (max-width:540px){
	.main-product{gap:26rem}
	.main-product__left, .main-product__left-wrap, .main-product__info{display:contents}
	.main-product__info{gap:26rem}
	.main-product .main-title{order:1; margin:0 20rem}
	.main-product .main-product__inner{order:2; margin-right:0}
	.main-product__txt{order:3; margin:0 20rem; gap:26rem}
	.main-product__ctrl{gap:18rem}
	.main-product__control{gap:16rem}
	.main-product__count{gap:12rem}
	.main-product__count em{gap:12rem}
	.main-product__desc{gap:20rem}
	.main-product__head{gap:16rem}
	.main-product__sub{gap:8rem}
	.main-product__list{--mp-gap:16rem; --mp-a:240rem; aspect-ratio:auto; height:300rem}
	.main-product__card{border-radius:12rem}
}

@media (pointer:coarse), (max-width:1023px){
	.main-product__btn::before{content:""; position:absolute; top:50%; left:50%; width:max(44rem, 5.8vw); height:max(44rem, 5.8vw); transform:translate(-50%, -50%)}
}

@media (prefers-reduced-motion:reduce){
	.main-product__card, .main-product__desc{transition:none}
}

/* main slider */
.main-slider{position:relative; height:var(--height-full); overflow:hidden}
.main-slider__item{position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; clip-path:polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%)}
.main-slider__item:first-child{clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)}
.main-slider__item--01{--ms-img:url(../img/main/main-slider01.webp); --ms-ov:var(--op-b10); --ms-blend:normal}
.main-slider__item--02{--ms-img:url(../img/main/main-slider02.webp); --ms-ov:rgba(10,41,119,0.4)}
.main-slider__bg{position:absolute; top:0; left:0; width:100%; height:100%; background:var(--ms-img) no-repeat 50% 50% / cover}
.main-slider__video{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover}
.main-slider__bg::after{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:var(--ms-ov); mix-blend-mode:var(--ms-blend, hard-light)}
.main-slider__title{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:30rem; text-align:center}
.main-slider__side{position:absolute; top:0; left:0; z-index:2; display:flex; align-items:center; width:100%; height:100%; pointer-events:none}
.main-slider__side-inner{flex:1; display:flex; align-items:center; justify-content:flex-start}
.main-slider__control{display:flex; flex-direction:column; align-items:center; gap:20rem; pointer-events:auto}
.main-slider__btn{position:relative; flex:none; width:20rem; height:20rem; background:url(../img/main/visual-arrow.svg) no-repeat 50% 50% / 16rem auto; cursor:pointer}
.main-slider__btn--prev{transform:rotate(90deg)}
.main-slider__btn--next{transform:rotate(-90deg)}
.main-slider__btn:focus-visible{outline:2rem solid var(--w); outline-offset:4rem; border-radius:4rem}
.main-slider__count{display:flex; flex-direction:column; align-items:center; gap:15rem}
.main-slider__count em{display:flex; flex-direction:column; align-items:center; gap:15rem}
.main-slider__count em::before{content:""; width:14rem; border-top:1px solid var(--op-w30)}

@media (max-width:1480px){
	.main-slider__title{gap:26rem}
}

@media (max-width:1200px){
	.main-slider__title{gap:22rem}
}

@media (max-width:1023px){
	.main-slider__bg::after{mix-blend-mode:normal}
	.main-slider__title{gap:20rem; padding:0 70rem}
	.main-slider__control{gap:16rem}
	.main-slider__count{gap:12rem}
	.main-slider__count em{gap:12rem}
}

@media (max-width:540px){
	.main-slider__title{gap:20rem; padding:0 64rem}
	.main-slider__side-inner{margin-left:16rem}
	.main-slider__video{object-position:70% 50%}
	.main-slider__item--01 .main-slider__bg{background-position:70% 50%}
	.main-slider__control{gap:16rem}
	.main-slider__count{gap:12rem}
	.main-slider__count em{gap:12rem}
}

@media (pointer:coarse), (max-width:1023px){
	.main-slider__btn::before{content:""; position:absolute; top:50%; left:50%; width:max(44rem, 5.8vw); height:max(44rem, 5.8vw); transform:translate(-50%, -50%)}
}

@media (prefers-reduced-motion:reduce){
	.main-slider{height:auto}
	.main-slider__item, .main-slider__item:first-child{position:relative; height:var(--height-full); clip-path:none}
	.main-slider__side{display:none}
}

/* main facility */
.main-facility{padding-top:var(--space150); padding-bottom:var(--space140)}
.main-facility__inner{display:flex; flex-direction:column; align-items:stretch; gap:60rem}
.main-facility .main-title{align-items:center; text-align:center}

@media (max-width:1480px){
	.main-facility__inner{gap:52rem}
}

@media (max-width:1200px){
	.main-facility__inner{gap:44rem}
}

@media (max-width:1023px){
	.main-facility__inner{gap:40rem}
}

@media (max-width:860px){
	.main-facility .main-title p br{display:none}
	.main-facility__inner{gap:36rem}
}

@media (max-width:540px){
	.main-facility__inner{gap:36rem}
}

/* main notice */
.main-notice{padding-bottom:var(--space140)}
.main-notice__inner{display:flex; flex-direction:column; align-items:center; gap:42rem}
.main-notice .main-title{align-items:center; text-align:center}
.main-notice__list{align-self:stretch; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); align-items:stretch; gap:42rem}
.main-notice__card{display:flex; flex-direction:column; align-items:stretch; gap:30rem; height:100%; box-sizing:border-box; padding:30rem 24rem 24rem; background:var(--w); transition:var(--trans-04)}
.main-notice__head{display:flex; align-items:center; justify-content:space-between; gap:12rem; white-space:nowrap}
.main-notice__cate{transition:var(--trans-04)}
.main-notice__txt{display:flex; flex-direction:column; align-items:stretch; gap:10rem; min-width:0}
.main-notice__txt h3{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.main-notice__txt p{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; min-height:2.7em}
.main-notice__thumb{display:flex; align-items:center; justify-content:center; aspect-ratio:389 / 260}
.main-notice__thumb img:not(.main-notice__logo){display:block; width:100%; height:100%; object-fit:cover}
.main-notice__logo{width:127rem; height:auto; opacity:.15; mix-blend-mode:luminosity}
.main-notice__empty{grid-column:1 / -1; text-align:center}

@media (hover: hover) and (pointer: fine){
	.main-notice__card:hover{border-color:var(--c-secondary); filter:drop-shadow(0 0 10rem var(--op-p10))}
	.main-notice__card:hover .main-notice__cate{color:var(--c-secondary)}
}

@media (max-width:1480px){
	.main-notice__inner{gap:36rem}
	.main-notice__list{gap:36rem}
	.main-notice__card{gap:26rem; padding:26rem 20rem 20rem}
	.main-notice__txt{gap:9rem}
}

@media (max-width:1200px){
	.main-notice__inner{gap:30rem}
	.main-notice__list{gap:30rem}
	.main-notice__card{gap:22rem; padding:22rem 18rem 18rem}
	.main-notice__head{gap:8rem}
	.main-notice__txt{gap:8rem}
}

@media (max-width:1023px){
	.main-notice__inner{gap:28rem}
	.main-notice__list{gap:24rem}
	.main-notice__card{gap:20rem; padding:26rem 24rem 24rem}
	.main-notice__logo{mix-blend-mode:normal}
}

@media (max-width:860px){
	.main-notice__inner{gap:26rem}
	.main-notice__list{grid-template-columns:minmax(0, 1fr); gap:20rem}
	.main-notice__thumb{aspect-ratio:3 / 1}
	.main-notice__card{gap:18rem; padding:24rem 22rem 22rem}
}

@media (max-width:540px){
	.main-notice__inner{gap:26rem}
	.main-notice__list{display:flex; align-items:stretch; gap:26rem; margin-right:-20rem; padding-right:20rem; overflow-x:auto; scroll-snap-type:x proximity; scrollbar-width:none}
	.main-notice__list::-webkit-scrollbar{display:none}
	.main-notice__item{flex:none; width:280rem; scroll-snap-align:start}
	.main-notice__card{gap:20rem; padding:20rem 18rem 18rem}
	.main-notice__txt{gap:10rem}
	.main-notice__thumb{aspect-ratio:242 / 162}
}

/* main bottom */
.main-bottom{position:relative; overflow-x:clip; padding-top:var(--space140); padding-bottom:var(--space140); background:var(--bg-navy)}
.main-bottom__bg{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; object-position:50% 100%; mix-blend-mode:overlay; pointer-events:none}
.main-bottom__inner{display:flex; align-items:flex-start; justify-content:space-between; gap:60rem}
.main-bottom .main-title .btn-basic{margin-top:20rem}
.main-bottom__list{flex:none; display:flex; flex-direction:column; align-items:stretch; gap:20rem; width:700rem}
.main-bottom__item{display:flex; align-items:center; justify-content:space-between; gap:20rem; box-sizing:border-box; padding:40rem; background:var(--op-t30); backdrop-filter:blur(2rem)}
.main-bottom__item p{white-space:nowrap}
.main-bottom__item p + p{text-align:right}

@media (max-width:1480px){
	.main-bottom__inner{gap:50rem}
	.main-bottom__list{gap:18rem}
	.main-bottom__item{padding:36rem}
}

@media (max-width:1200px){
	.main-bottom__inner{gap:40rem}
	.main-bottom__list{width:600rem; gap:16rem}
	.main-bottom__item{padding:30rem}
}

@media (max-width:1023px){
	.main-bottom__inner{flex-direction:column; align-items:stretch; gap:50rem}
	.main-bottom__bg{mix-blend-mode:normal; opacity:.08}
	.main-bottom__list{width:auto; gap:14rem}
	.main-bottom__item{padding:28rem; backdrop-filter:none}
}

@media (max-width:860px){
	.main-bottom__inner{gap:44rem}
	.main-bottom__item{padding:26rem}
}

@media (max-width:540px){
	.main-bottom__inner{gap:26rem}
	.main-bottom .main-title .btn-basic{margin-top:16rem}
	.main-bottom__list{gap:10rem}
	.main-bottom__item{gap:12rem; padding:22rem}
}

/* 호버 */
@media (hover: hover) and (pointer: fine){
	.quick-video:not(.quick-video--catalog):hover, .quick-video:not(.quick-video--catalog):has(.quick-video__btn:focus-visible){height:calc(var(--qv-h) + 180rem)}
	.quick-video:hover .quick-video__btn, .quick-video:has(.quick-video__btn:focus-visible) .quick-video__btn{background:var(--c-primary)}
}

@media (max-width:1023px){
	.main-visual{min-height:600rem}
	.main-visual__text{margin-bottom:30rem}
	.main-visual__bottom{bottom:40rem}
	.main-visual__bottom-inner{gap:24rem}
	.main-visual__bottom .main-visual__txt{gap:24rem}
	.main-visual__control{gap:16rem}
	.main-visual__count{gap:12rem}
	.main-visual__count em{gap:12rem}
	.main-visual__side-inner{margin-bottom:30rem}
}

@media (max-width:860px){
	.main-visual__bottom-inner{flex-wrap:wrap; row-gap:44rem}
	.quick-video{width:300rem}
}

@media (max-width:540px){
	.main-visual__text{margin-bottom:8rem}
	.main-visual__text h2[data-heading-en]{font-size:48rem}
	.main-visual__text h2[data-heading]{font-size:var(--font-36)}
	.main-visual__descs{display:none}
	.main-visual__bg i{background-position:72% 50%}
	.main-visual__bg::after{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:var(--op-b20); pointer-events:none}
	.main-visual__side{display:none}
	.main-visual__bottom{bottom:40rem}
	.main-visual__bottom-inner{flex-direction:column; align-items:flex-start; gap:40rem}
	.main-visual__bottom .main-visual__txt{gap:20rem}
	.main-visual__control{gap:16rem}
	.main-visual__count{gap:12rem}
	.main-visual__count em{gap:12rem}
	.main-visual__actions{flex-direction:column; align-items:stretch; width:100%}
	.quick-video{--qv-h:58rem; width:100%}
	.quick-video__btn{padding:0 16rem}

	[fullpage-ani]{opacity:1 !important; transform:none !important}
}

/* 메인비주얼 PC/모바일 미디어 스왑 */
.main-visual .mv-mob{display:none}
@media (max-width:767px){
	.main-visual .mv-pc{display:none}
	.main-visual .mv-mob{display:block}
}

/* iframe 16:9 크롭 */
@media (min-aspect-ratio:16/9){
	iframe.main-visual__video{width:100vw; height:56.25vw}
}
@media (max-aspect-ratio:16/9){
	iframe.main-visual__video{width:177.78vh; height:100vh}
}

.form-area > em{font-size:20rem; font-weight:600; color:var(--b-title); display:block}
.form-area > em{min-width:178rem}