@charset "utf-8";
/* =====================================================
   메인 — main/css/main.css  (main.png 시안)
   ===================================================== */

header .headerWrap h1 a {color:#fff;}
nav .gnb .dep1>li>a {color:#fff;}
header .headerWrap .gnbView {background:url(/images/common/menu-main.svg)center /22px no-repeat;}

.main-hero {position:relative; width:100%; overflow:hidden;}
.main-hero .hero-bg {
	width:100%; height:100vh;
	/* background:url(/images/main/hero.png) center top / cover no-repeat; */
}
.main-hero .hero-bg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 우측 플로팅 신청 CTA */
.main-hero .hero-cta {
	position:absolute; right:4vw; top:50%; transform:translateY(-50%);
	display:flex; flex-direction:column; gap:16px; z-index:5; 
}
.main-hero .cta-item {
	display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
	width:130px;padding:10px 0; height:135px; background:#fff; border-radius:16px; line-height:1.2;
	box-shadow:0 12px 30px rgba(0,0,0,.18); transition:all .25s;text-align:center;
}
.main-hero .cta-item:hover {transform:translateY(-4px); box-shadow:0 16px 36px rgba(0,0,0,.24);}
.main-hero .cta-item .lb {font-size:var(--fs16); font-weight:700; color:#1a1a1a;}
.main-hero .cta-item .ico {width:31px; height:30px; background:center / contain no-repeat;}
.main-hero .cta-item .ico-person {
	background-image:url("/images/main/icon_main_apply_01.svg");
}
.main-hero .cta-item .ico-group {
	width:38px; height:35px;
	background-image:url("/images/main/icon_main_apply_02.svg");
}

/* ── 태블릿 (~1199px) ── */
@media screen and (max-width: 1199px) {
	.headerH {height:70px;}
	header .headerWrap h1 a {color:#222;}
	header .headerWrap .gnbView {background-image:url(/images/common/menu.svg);}
	
	.main-hero .hero-bg {height:100%;}
	.main-hero .hero-bg video {}
	.main-hero .hero-cta {right:20px; gap:12px;}
	.main-hero .cta-item {width:92px; height:92px;}
}

/* ── 모바일 (~767px) ── */
@media screen and (max-width: 767px) {
	.headerH {height:60px;}
	.main-hero .hero-bg {aspect-ratio: 1.5 / 1;}
	.main-hero .hero-cta {right:12px; top:auto; bottom:20px; transform:none; flex-direction:row;}
	.main-hero .cta-item {width:76px; height:76px; border-radius:12px; gap:6px;}
	.main-hero .cta-item .ico {width:26px; height:26px;}
}
