/* 공통 */
:root {
	--outfit: 'Outfit';
	--libre: "Libre Baskerville", serif;
	--f-gl: 'GmarketSansLight';
	--f-gm: 'GmarketSansMedium';
	--f-gb: 'GmarketSansBold';
	--pink: #E03B65;
}
body {-webkit-text-size-adjust:none; width: 100%; overflow: initial;}
p, dd{word-break:keep-all;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 30px #fff inset; -webkit-text-fill-color: #000;}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s;}
.pc{display:block !important;}
.mob{display:none !important;}
.inner{padding: 0 2.5rem;}
.f-out, .f-out *{font-family: var(--outfit) !important;}
.f-gl, .f-gl *{font-family: var(--f-gl) !important;}
.f-gm, .f-gm *{font-family: var(--f-gm) !important;}
.f-gb, .f-gb *{font-family: var(--f-gb) !important;}
.fs_20{font-size: 1.25rem; letter-spacing: -0.025rem; line-height: 150%;}
.fs_30{font-size: 1.875rem; letter-spacing: -0.03125rem; font-weight: 300;}
.fs_36{font-size: 2.25rem; letter-spacing: -0.03125rem;}
.fs_44{font-size: 2.75rem; letter-spacing: -0.09375rem; line-height: 126%;}
.fs_60{font-size: 3.75rem; letter-spacing: -0.09375rem; font-weight: 800; line-height: 126%;}
.mt_10{margin-top: 0.625rem;}
.mt_15{margin-top: 0.9375rem;}
.mt_20{margin-top: 1.25rem;}
.ta-c{text-align: center;}
.fw500{font-weight: 500;}
.fw600{font-weight: 600;}
.fw700{font-weight: 700;}
.fw800{font-weight: 800;}
.pink{color: var(--pink);}
.main_tit em{display: block;}


/* HEADER */
.header{height: 5.625rem; position:fixed; top: 0; z-index: 1000; width: 100%; border-bottom: 1px solid transparent; transition: all 0.2s;}
.header .inner{max-width: 80rem; height: 100%; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.header h1{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.header h1 a img{width: 12.5rem; display: block; transition: all 0.2s;}
.header .gnb{display: flex; gap: 9.375rem;}
.header .gnb a{font-size: 1.0625rem; letter-spacing: -0.03125rem; color: var(--pink); font-weight: 600; line-height: 130%; display: block; position: relative; white-space: nowrap; transition: all 0.2s;}
.header:hover, .header.fixed{background: var(--pink);}
.header:hover h1 a img, .header.fixed h1 a img{filter: brightness(0) invert(1);}
.header:hover .gnb a, .header.fixed .gnb a{color: #FFF;}
.all_menu{display:none !important;}

/* visual */
.visual{position: relative; aspect-ratio: 16/9; overflow: hidden;}
.visual::before{content: ''; display: block; width: 100%; height: 100%; top: 0; left: 0; position: absolute; z-index: 5;}
.visual iframe{width: 100%; height: 100%; object-fit: cover; transform: scale(1.22);}
.visual img{width: 100%; height: 100%; object-fit: cover;}
.visual .txt{position: absolute; left: 36.45%; top: 50%; transform: translateY(-50%); color: var(--pink);}
.visual .txt p{font-size: 1.46vw; letter-spacing: -0.05vw; line-height: 130%;}
.visual .txt .tit{margin-top: 1.04vw; font-size: 6.25vw; letter-spacing: -0.10vw; line-height: 1; font-family: var(--libre);}
.visual .txt .tit span::after{content: ''; display: inline-block; width: 13.02vw; height: 1px; background: var(--pink); vertical-align: middle; margin: -1.67vw 0 0 1.04vw;}
.visual .en_txt{font-size: 0.8125rem; letter-spacing: 0.625rem; font-weight: 700; line-height: 130%; color: var(--pink); transform: rotate(-90deg); position: absolute; left: 3rem; bottom: 3rem; transform-origin: left;}

/* sec1 */
.sec1{position: relative; height: 100vh; background: url(/img/main/sec1_bg.png) no-repeat center / cover;}
.sec1 .main_tit{position: absolute; top: 15.475rem; right: 19.27%;}
.sec1 .main_tit .tit{font-size: 5rem; letter-spacing: -0.09375rem;}

/* sec2 */
.sec2{position: relative; background: url(/img/main/sec2_bg.png) no-repeat center / cover; padding: 7.5rem 0 8.125rem;}
.sec2 .main_tit{color: #FFF;}
.sec2 .img{margin-top: 3.75rem; text-align: center;}

/* sec3 */
.sec3{padding-top: 8.125rem; position: relative; overflow: hidden;}
.sec3 canvas{display: block; width: 100%; height: 100%; position: absolute; left: 0; right: 0; bottom: 0; pointer-events: none; transform: scale(1.07);}
.sec3::before{content: ''; display: block; width: 70.75rem; aspect-ratio: 1/1; border-radius: 50%; background: radial-gradient(50% 50% at 50% 50%, #FFD8DE 0%, rgba(245, 221, 225, 0.00) 100%); opacity: 0.3; position: absolute; top: -2.2rem; left: 50%; transform: translateX(-50%); z-index: -1;}
.sec3 .cont{max-width: 105rem; height: 41.875rem; margin: 4.3rem auto 0; position: relative; opacity: 1 !important;}
.sec3 .cont img{position: absolute; bottom: 0; opacity: 0; transition: all 1.2s;}
.sec3 .cont .img1{right: 1.25rem; transform: translateX(50%);}
.sec3 .cont .img2{left: 1.25rem; transform: translateX(-50%); transition-delay: 0.3s;}
.sec3 .cont.aos-animate img{opacity: 1; transform: translateX(0);}

/* sec4 */
.sec4{background: url(/img/main/sec4_bg.png) no-repeat center / cover; position: relative; display: flex;}
.sec4::before{content: ''; display: block; width: 1px; height: 100%; background: #BEBEBE; position: absolute; left: 50%; top: 0; transform: translateX(-50%);}
.sec4 .box{width: 50%; padding: 8.125rem 2.5rem; transition: all 0.3s;}
.sec4 .box:hover{background: var(--pink);}
.sec4 .box:hover *{color: #FFF;}
/* .sec4 .box1{padding-left: 3.75rem;}
.sec4 .box2{padding-right: 3.75rem;} */
.sec4 .main_tit{min-height: 20.1875em;}

/* sec5 */
.sec5{position: relative; height: 100vh; overflow: hidden; z-index: 1;}
.sec5 .img{width: 100%; height: 100%;}
.sec5 .img img{width: 100%; height: 100%; object-fit: cover;}
.sec5 .move{width: 100%; height: 50%; background: #FFF; text-align: center; overflow: hidden; position: absolute;}
.sec5 .move p{font-size: 6.25rem; letter-spacing: -0.0625rem; font-weight: 700; color: var(--pink); position: absolute; left: 50%; transform: translateX(-50%); height: 100%; display: flex; align-items: center; justify-content: center; white-space: nowrap;}
.sec5 .move.top{top: 0;}
.sec5 .move.bot{bottom: 0;}
.sec5 .move.top p{bottom: -50%;}
.sec5 .move.bot p{top: -50%;}

/* sec6 */
.sec6 .inner{max-width: 105rem; margin: 0 auto;}
.sec6 .cont{display: flex; align-items: flex-start; gap: 5.625rem;}
.sec6 .img{width: 37.5%; height: 46.875rem; max-height: 48.06vw; position: relative;}
.sec6 .img img{position: absolute; left: 0; width: 100%; bottom: 0;}
.sec6 .cont .form_wrap{width: calc(62.5% - 5.625rem);}
.sec6 .cont .form{display: flex; flex-wrap: wrap; gap: 1.5rem;}
.sec6 .cont .form dl{width: calc(50% - (1.5rem / 2));}
.sec6 .cont .form .full{width: 100%;}
.sec6 .cont .form dl dt{font-size: 1rem; font-weight: 700; line-height: 1.5; margin-bottom: 0.625rem;}
.sec6 .cont .form dl dt .req{color: #000;}
.sec6 .cont .form dl dd input{width: 100%; height: 3.125rem; border: none; border-bottom: 1px solid rgba(0, 0, 0, 0.30); background: #FFF; font-size: 1rem; transition: all 0.3s; outline: none !important; color: var(--pink); font-weight: 500;}
.sec6 .cont .form dl dd textarea{width: 100%; padding: 0.8125rem 0.9375rem; border: 1px solid rgba(0, 0, 0, 0.30); background: #FFF; font-size: 1rem; height: 12.5rem; resize: none; transition: all 0.3s; color: var(--pink); font-weight: 500;}
.sec6 .cont .form dl dd input::placeholder,
.sec6 .cont .form dl dd textarea::placeholder{color: #8E8E8E;}
.sec6 .cont .form dl dd input:focus,
.sec6 .cont .form dl dd textarea:focus{border-color: var(--pink);}
.sec6 .cont .form dl.toggle dt{position: relative; cursor: pointer; padding-right: 2rem;}
.sec6 .cont .form dl.toggle dt::after{content: ''; display: block; width: 1.5rem; aspect-ratio: 1/1; background: url(/img/main/apply_arrow.svg) no-repeat center / contain; right: 0; top: 50%; transform: translateY(-50%); position: absolute; transition: all 0.3s;}
.sec6 .cont .form dl.toggle dt.on::after{transform: translateY(-50%) rotate(-180deg);}
.sec6 .cont .form dl dd .box{height: 7.8125rem; border: 1px solid rgba(0, 0, 0, 0.30); padding: 1.25rem 1.125rem; font-size: 0.875rem; letter-spacing: -0.0125rem; line-height: 1.4;}
.sec6 .cont .form dl dd .box .use_wrap{height: 100%; overflow-y: auto; padding-right: 0.75rem;}
.sec6 .cont .form dl dd .box .use_wrap::-webkit-scrollbar {width: 3px;}
.sec6 .cont .form dl dd .box .use_wrap::-webkit-scrollbar-thumb {height: 30%; background: #888; border-radius: 10px;}
.sec6 .cont .form dl dd .box .use_wrap::-webkit-scrollbar-track {background: #DDD; border-radius: 10px;}
.sec6 .cont .form dl dd .box .use_wrap h5{margin-bottom: 0.5rem;}
.sec6 .cont .form dl dd .box .use_wrap ul + .headline{margin-top: 1rem;}
.sec6 .cont .form dl dd .box .use_wrap ol{margin: 0.625rem 0; margin-left: 0.75rem; padding-left: 0;}
.sec6 .cont .form dl dd .box .use_wrap ol li{position: relative; padding-left: 0.75rem;}
.sec6 .cont .form dl dd .box .use_wrap ol li::before{content: ''; display: block; width: 0.25rem; aspect-ratio: 1/1; background: #999; border-radius: 50%; position: absolute; left: 0; top: 0.5rem;}
.sec6 .cont .form dl dd .box .use_wrap li,
.sec6 .cont .form dl dd .box .use_wrap p,
.sec6 .cont .form dl dd .box .use_wrap a{color: #999; font-weight: 300;}
.sec6 .cont .form .agree{display: flex; align-items: center; gap: 0.625rem;}
.sec6 .cont .form .agree input{width: 1.25rem; height: 1.25rem; border: 1px solid #D9D9D9 !important; -webkit-appearance: none; -moz-appearance: none; appearance: none; transition: none;}
.sec6 .cont .form .agree input:checked{background: #000 url(/img/main/chk_ic.svg) no-repeat center / 1rem; border-color: #000 !important;}
.sec6 .cont .form .agree label{font-size: 1rem; letter-spacing: -0.03125rem; font-weight: 500;}
.sec6 .cont .btn_wrap input{font-size: 1.25rem; font-weight: 500; color: #FFF; padding: 1.25rem 3.125rem; background: var(--pink); border: none; display: inline-block;}

/* footer */
.footer{background: #000; padding: 5.625rem 0 5.125rem; margin-top: 4.375rem;}
.footer *{color: #FFF;}
.footer .inner{display: flex; align-items: flex-start; gap: 10rem; max-width: 105rem; margin: 0 auto;}
.footer .logo{width: 18.75rem;}
.footer .logo img{width: 100%;}
.footer .flex{display: flex; align-items: flex-start; gap: 10.625rem;}
.footer .flex dl{font-size: 1.125rem; letter-spacing: -0.025rem; line-height: 150%;}
.footer .info p{margin-top: 3.06rem; font-size: 1rem; letter-spacing: -0.03125rem; line-height: 140%; color: #BEBEBE;}



@media screen and (max-width:1640px){

	/* footer */
	.footer .inner{gap: 6rem;}
	.footer .info{width: calc(100% - 18.75rem - 6rem);}
	.footer .flex{gap: 5rem;}

}


@media screen and (max-width:1440px){

	html{font-size: 85%;}

	/* sec1 */
	.sec1{height: auto; aspect-ratio: 192/95;}
	.sec1 .main_tit{top: 12.89vw; right: 11%;}
	.sec1 .main_tit .tit{font-size: 4.5rem; letter-spacing: -0.075rem;}

	/* sec3 */
	/* .sec3 canvas{bottom: -40%;} */
	.sec3 .cont{height: 41vw;}
	.sec3 .cont .img1{width: 60.24vw;}
	.sec3 .cont .img2{width: 59.41vw;}

	/* footer */
	.footer .inner{gap: 5rem;}
	.footer .logo{width: 13.75rem;}
	.footer .info{width: calc(100% - 13.75rem - 5rem);}
	.footer .flex{gap: 4rem;}

}


@media screen and (max-width:1024px){

	/* 공통 */
	.inner{padding: 0 1.25rem;}
	.fs_20{font-size: 1.125rem;}
	.fs_30{font-size: 1.5rem;}
	.fs_36{font-size: 1.875rem;}
	.fs_44{font-size: 2.25rem; letter-spacing: -0.075rem;}
	.fs_60{font-size: 2.75rem; letter-spacing: -0.075rem;}
	.mt_10{margin-top: 0.625rem;}
	.mt_15{margin-top: 0.9375rem;}
	.mt_20{margin-top: 1.25rem;}


	/* HEADER */
	.header{height: 5rem;}
	.header h1 a img{width: 10.5rem;}
	.header .gnb{gap: 3.5rem;}
	.header .gnb a{font-size: 1.0625rem;}

	/* visual */
	.visual .en_txt{font-size: 0.75rem; left: 2rem; bottom: 1.5rem;}

	/* sec1 */
	.sec1{background: url(/img/main/sec1_bg_m.png) no-repeat right center / cover; height: 34rem; aspect-ratio: initial;}
	.sec1 .main_tit{top: 50%; transform: translateY(-50%); right: initial; text-align: left; left: 1.25rem;}
	.sec1 .main_tit .tit{font-size: 3.5rem; letter-spacing: -0.05rem;}

	/* sec2 */
	.sec2{padding: 6.5rem 0;}
	.sec2 .img{margin-top: 3.75rem;}

	/* sec3 */
	.sec3{padding-top: 6.5rem;}
	.sec3::before{width: 70%;}
	/* .sec3 canvas{bottom: -40%;} */
	.sec3 .cont{height: 41vw; margin: 3.5rem auto 0;}
	.sec3 .cont .img1{width: 60.24vw;}
	.sec3 .cont .img2{width: 59.41vw;}

	/* sec4 */
	.sec4 .box{padding: 3.75rem 1.875rem;}
	.sec4 .main_tit{min-height: 16.1875em;}

	/* sec5 */
	.sec5 .move p{font-size: 5rem; letter-spacing: -0.05rem;}

	/* footer */
	.footer{padding: 4.5rem 0; margin-top: 4.375rem;}
	.footer .inner{flex-direction: column; gap: 2.5rem;}
	.footer .logo{width: 14.75rem;}
	.footer .info{width: 100%;}
	.footer .flex{gap: 4.625rem;}
	.footer .flex dl{font-size: 1.125rem;}
	.footer .info p{margin-top: 2rem; font-size: 1rem;}

}



@media screen and (max-width:768px){

	/* 공통 */
	html{font-size: 100%;}
	.pc{display:none !important;}
	.mob{display:block !important;}
	.fs_20{font-size: 1rem;}
	.fs_30{font-size: 1.25rem;}
	.fs_36{font-size: 1.5rem;}
	.fs_44{font-size: 1.875rem; letter-spacing: -0.075rem;}
	.fs_60{font-size: 2.125rem; letter-spacing: -0.075rem;}
	.mt_10{margin-top: 0.625rem;}
	.mt_15{margin-top: 0.75rem;}
	.mt_20{margin-top: 1rem;}


	/* HEADER */
	.header{height: 3.75rem;}
	.header h1 a img{width: 8.75rem;}
	.header .gnb{display: none;}
	.gnb.mob{display: flex !important; justify-content: center; gap: 1.875rem; padding: 1rem 1.5rem; background: rgba(255,255,255, 0.90); position: fixed; top: 3.75rem; left: 0; right: 0; z-index: 100; opacity: 0; transition: all 0.3s;}
	.header.fixed + .gnb.mob{opacity: 1;}
	.gnb.mob a{font-size: 0.875rem; color: var(--pink); font-weight: 600; line-height: 130%; letter-spacing: -0.03125rem;}

	/* visual */
	/* .visual{height: auto; aspect-ratio: 96/125;} */
	.visual iframe{transform: scale(1.47);}
	.visual .txt{left: 1.25rem; top: 22.92vw; transform: translateY(0);}
	.visual .txt p{font-size: 3.65vw;}
	.visual .txt .tit{margin-top: 2.74vw; font-size: 10.42vw;}
	.visual .txt .tit span::after{width: 26.04vw; margin: -1.67vw 0 0 2.74vw;}
	.visual .en_txt{font-size: 0.5rem; left: 1.5rem; bottom: 1.5rem; letter-spacing: 5.263px;}

	/* sec1 */
	.sec1{height: 26rem;}
	.sec1 .main_tit{/* top: 3.75rem; */ left: 1.25rem;}
	.sec1 .main_tit .tit{font-size: 2.125rem; letter-spacing: -0.05rem;}

	/* sec2 */
	.sec2{padding: 3.75rem 0;}
	.sec2 .img{margin-top: 2.5rem;}

	/* sec3 */
	.sec3{padding: 3.75rem 0;}
	.sec3::before{width: 100%; top: initial; bottom: -15%;}
	.sec3 .cont{height: 84.34vw; margin: 2.5rem auto 0; padding: 0 1.25rem;}
	.sec3 .cont .img1{width: 62.14vw; bottom: 5.61vw;}
	.sec3 .cont .img2{width: 80.21vw;}

	/* sec4 */
	.sec4{flex-direction: column;}
	.sec4::before{display: none;}
	.sec4 .box{width: 100%; padding: 3.75rem 1.25rem;}
	.sec4 .box1{border-bottom: 1px solid #BEBEBE;}
	.sec4 .main_tit{min-height: initial; margin-bottom: 2.5rem;}

	/* sec5 */
	.sec5 .move p{font-size: 2.5rem; letter-spacing: -0.05rem;}

	/* sec6 */
	.sec6 .cont{flex-direction: column-reverse; gap: 2.5rem; margin-top: 2.5rem;}
	.sec6 .img{width: 100%; display: none;}
	.sec6 .img img{position: initial;}
	.sec6 .cont .form_wrap{width: 100%;;}
	.sec6 .cont .form{gap: 1.5rem;}
	.sec6 .cont .form dl{width: 100%;}
	.sec6 .cont .form dl dt{font-size: 1rem; margin-bottom: 0.625rem;}
	.sec6 .cont .form dl dd input{height: 3.125rem; font-size: 1rem;}
	.sec6 .cont .form dl dd textarea{padding: 0.8125rem 0.9375rem; font-size: 1rem; height: 10.5rem;}
	.sec6 .cont .form dl.toggle dt{padding-right: 2rem;}
	.sec6 .cont .form dl.toggle dt::after{width: 1.5rem;}
	.sec6 .cont .form dl dd .box{height: 7.8125rem; padding: 1.25rem 1.125rem; font-size: 0.875rem;}
	.sec6 .cont .form dl dd .box .use_wrap{padding-right: 0.75rem;}
	.sec6 .cont .form dl dd .box .use_wrap h5{margin-bottom: 0.5rem;}
	.sec6 .cont .form dl dd .box .use_wrap ul + .headline{margin-top: 1rem;}
	.sec6 .cont .form dl dd .box .use_wrap ol{margin: 0.625rem 0; margin-left: 0.75rem;}
	.sec6 .cont .form dl dd .box .use_wrap ol li{padding-left: 0.75rem;}
	.sec6 .cont .form dl dd .box .use_wrap ol li::before{width: 0.25rem; top: 0.5rem;}
	.sec6 .cont .form .agree{gap: 0.625rem;}
	.sec6 .cont .form .agree input{width: 1.25rem; height: 1.25rem;}
	.sec6 .cont .form .agree input:checked{background-size: 1rem;}
	.sec6 .cont .form .agree label{font-size: 1rem;}
	.sec6 .cont .btn_wrap{margin-top: 2rem;}
	.sec6 .cont .btn_wrap input{font-size: 1.125rem; padding: 1rem 2.125rem;}

	/* footer */
	.footer{padding: 3.75rem 0; margin-top: 3.75rem;}
	.footer .inner{gap: 2.5rem;}
	.footer .logo{width: 10.75rem;}
	.footer .info{width: 100%;}
	.footer .flex{flex-wrap: wrap; gap: 1rem 2.5rem;}
	.footer .flex dl{font-size: 1rem;}
	.footer .info p{margin-top: 2.5rem; font-size: 0.875rem;}

}



@media screen and (max-width:500px){

	.visual .inner{align-items: flex-start;}

}