﻿/* ===== 공통 ===== */
.main_visual { position: relative; width: 100%; background-position: center; background-size: cover; background-repeat: no-repeat; color: #fff; /* 기본: 어두운 배경 가정 */ display: flex; /* mv_inner 세로 중앙 */ align-items: center; min-height: 460px; }

/* 섹션별 배경 */
.mv01 { background-image: url('/images/main_visual01.jpg'); }
.mv02 { background-image: url('/images/main_visual02.jpg'); }
.mv03 { background-image: url('/images/main_visual03.jpg'); }

/* 내부 컨테이너 */
.mv_inner { width: 92%; margin: 0 auto; padding: clamp(48px, 8vh, 120px) 0; display: grid; align-content: center; transform: translateY(-3%); }

@media (min-width:1200px) {
    .mv_inner { width: 1200px; }
}

@media (max-width:1024px) {
    .mv_inner { width: 86%; }
}

/* 타이포 */
.mv_title { margin: 0; line-height: 1.1; padding-bottom: 15px; }
.mv_title p.bold { display: inline; margin: 0; }
.mv_line { display: block; font-weight: 300; font-size: clamp(28px, 5.2vw, 55px); letter-spacing: .5px; }
.mv_sub { font-weight: 200; margin: 0; font-size: clamp(14px, 1.8vw, 20px); line-height: 1.5; color: #fff; }

/* 밝은 배경 섹션용 */
.mv-dark { color: #111; }
.mv-dark .mv_sub { color: rgba(17,17,17,.85); }

/* 버튼 */
.mv_btn { display: inline-flex; align-items: center; justify-content: center; margin-top: clamp(14px, 3vh, 28px); padding: 14px 28px; width: 180px; border-radius: 30px; background: #44cc00; color: #fff; font-weight: 700; text-decoration: none; transition: background .3s ease; }
.mv_btn:hover { background: #333; }
.mv_btn:active { transform: translateY(1px) scale(.99); }

/* 스크롤 인디케이터 */
.scroll-down { position: absolute; left: 50%; bottom: 0px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 8px; text-decoration: none; font-size: 12px; color: rgba(255,255,255,.9); user-select: none; }
.sd-track { position: relative; width: 4px; height: 48px; overflow: hidden; border-radius: 1px; background: rgba(255,255,255,.35); }
.sd-thumb { position: absolute; left: 0; top: -40%; width: 100%; height: 40%; background: rgba(255,255,255,.9); animation: sdMove 1.6s cubic-bezier(.22,.61,.36,1) infinite; }

@keyframes sdMove {
    0% { top: -40%; opacity: 0 }
    20% { opacity: 1 }
    100% { top: 100%; opacity: 0 }
}
/* 밝은 섹션용 컬러 전환 */
.mv-dark .scroll-down { color: rgba(17,17,17,.9); }
.mv-dark .sd-track { background: rgba(17,17,17,.25); }
.mv-dark .sd-thumb { background: rgba(17,17,17,.9); }

/* ── 모바일 ── */
@media (max-width:767px) {
    .main_visual { height: 640px; }
    .scroll-down { display: none; }
    .mv_btn { padding: 10px 28px; max-width: 160px; }
    .navbar.navbar-inverse.navbar-fixed-top { position: fixed; top: 0; left: 0; width: 100%; z-index: 1050; }
}

/* ── 태블릿 ── */
@media (min-width:768px) and (max-width:1023px) {
    .main_visual { height: 720px; }
    .mv_btn { padding: 12px 30px; width: 160px; }
}

/* ── PC 뷰포트 높이 보정 ── */
@media (min-width:1024px) and (max-width:1399px) {
    .main_visual { height: calc(100vh - 72px); height: calc(100dvh - 72px); }
}

@media (min-width:1400px) {
    .main_visual { height: calc(100vh - 80px); height: calc(100dvh - 80px); }
}