@charset "utf-8";
body .hdl {position:relative;}

.apply {}
.apply .bg {width:50%; height:100%; background:var(--sky); position:absolute; left:0; top:0; z-index:-1;}
.apply .wrap {display:flex;}
.apply .con {width:50%; height:100vh; padding: 150px 0 0; position: sticky; top: 0; align-self: start;}
.apply .con {}
.apply .con h3 {font-size:var(--fontSize10); font-weight: 400;line-height: 120%; color:#fff;}
.apply .con h3 b {font-weight:800; display:block;}
.apply .con p {padding:20px 0 0; margin:100px 0 0; color:#fff; font-size: var(--fontSize4);font-weight: 400;line-height: 140%; position:relative;}
.apply .con p:before {width:50px; height:2px; background:#fff; left:0; top:0; position:absolute; content:''; display:block;}

.apply .form {padding:150px 0 150px 100px; width:50%;}
.apply .form .privacy {}
.apply .form .privacy p {color: #000; font-size: var(--fontSize4); font-weight: 600; line-height: 140%;}
.apply .form .privacy .agreeBox {margin:10px 0; padding:20px; height:200px; overflow-y:auto; border: 1px solid var(--bgcGray2);background: #FAFAFA;}
.apply .form .privacy .agreeBox pre {}

.apply .deco {width:518px; height:487px; position:absolute; left:-260px; bottom:0; overflow:hidden; z-index:-1;}
.apply .deco img {}
.apply .deco  span {position:absolute; display:block; z-index:1; border-radius:50%; aspect-ratio:1/1;  }
.apply .deco .deco1 {left:0; bottom:0; width:800px; border:200px solid #fff; transform:translate(-405px,405px)}
.apply .deco .deco2 {left:192px;top:22px;width:200px;border: 50px solid var(--sky); opacity: 0.2; mix-blend-mode: multiply;}
.apply .deco .deco3 {left:386px; top:36px; width:14px; background:rgba(255, 255, 255, 0.50);}
.apply .deco .deco4 {left:397px; top:0; width:14px; background:var(--sky); mix-blend-mode: multiply;}
.apply .deco .deco5 {right:0; top:105px; width:30px; background:#fff;}




/* 전체 화면 로딩 오버레이 START*/
#loadingOverlay {
	display: none;
	position: fixed;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 9999;
	text-align: center;
	color: white;
	font-size: 24px;
	font-weight: bold;
	padding-top: 20%;
}
.spinner {
	margin: 0 auto 20px;
	border: 8px solid #f3f3f3;
	border-top: 8px solid #ffffff;
	border-radius: 50%;
	width: 60px;
	height: 60px;
	animation: spin 1s linear infinite;
}
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}
/* 전체 화면 로딩 오버레이 END*/



/* ************************ 태블릿 이하(~1199) ************************ */
@media (max-width: 1024px) {

	.apply .wrap {display:block;}
	.apply .con {width:100%; padding:80px 20px; height:auto; position:static; background:var(--sky);}
	.apply .con p {margin:60px 0 0;}
	.apply .form {width:100%; padding:80px 20px;}





}

/* ************************ 모바일 ************************ */
@media (max-width: 767px) {

	.apply .con {padding:50px 20px;}
	.apply .con p {margin:30px 0 0; padding:10px 0 0;}
	.apply .con p:before {width:40px;}
	.apply .form {padding:50px 20px}

}