/* 오송역 헬로우시티 — 밝은 흰 바탕 (2026-10-21 사장님 「전체를 밝게, 흰 바탕으로」)
   원본 CSS 뒤에 얹어 색만 바꿉니다. 구도·애니메이션·움직임(transition·transform·animation)은 건드리지 않습니다.
   어두운 바탕이던 칸: 인트로 · 첫 화면(MAIN·사업개요) · 프리미엄 · 홍보영상 · 언론보도 왼쪽 · 푸터 · 서브 페이지 머리 그림.
   글씨는 흰 바탕에서 대비 4.5 이상: 본문 #1b1d1f, 흐린 글씨 #555(7.5), 아주 흐린 잔글씨 #666(5.7). */
:root { --lt-ink: #1b1d1f; --lt-sub: #555; --lt-faint: #666; --lt-navy: #003c66; --lt-bg: #ffffff; --lt-bg2: #f4f6f8; --lt-line: #d5d9dd; }

/* ── 흰 글씨 그림 → 어두운 글씨로 (그림은 원본 그대로, 색만 뒤집음) ── */
.main_txt2, .intro_tit img, .pr_tit_img { filter: invert(1) brightness(.12); }

/* ── 인트로 ── */
.intro01::after, .intro_img_box, .intro_img { background-color: var(--lt-bg) !important; }
.intro_img_box::before { opacity: .12 !important; filter: grayscale(1); }
.intro_img.img04>div { opacity: .28 !important; }
.intro_tit { color: var(--lt-ink) !important; }
.intro_bt_box h5, .intro_bt_box p { color: var(--lt-ink) !important; }
.intro_bt { box-shadow: 0 0 0 1px rgba(0,0,0,.15); background: var(--lt-navy); }

/* ── 첫 화면 MAIN · 사업개요 ── */
.main_vd_box { background-color: var(--lt-bg) !important; }
/* 히어로 = 단지 조감도 (2026-10-21). 원본은 흑백 모델 사진(::before) — 그 자리를 밝은 막으로 바꿔 조감도 위 글씨가 읽히게 */
.os-hero { position: absolute; inset: 0; z-index: 0; display: block; }
.os-hero img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; display: block; }
.main_vd_box::before { background: linear-gradient(180deg, rgba(255,255,255,.80) 0%, rgba(255,255,255,.42) 38%, rgba(255,255,255,.42) 58%, rgba(255,255,255,.84) 100%) !important;
  opacity: 1 !important; filter: none !important; z-index: 1 !important; }
.main_bd { display: none !important; }   /* 원본 흑백 건물 그림 — 조감도와 겹쳐서 뺌 */
@media (max-width: 767px) { .os-hero img { object-position: 66% 50%; } }

/* ── 첫 화면은 선명한 조감도 한 장만 (2026-10-21 사장님 「효과 걷어내고 조감도가 잘 보이게」) ──
   흰 막·MAIN 글자·글자 속 영상·돌아가는 오픈 배지·줄무늬 가림(mask)을 뺍니다.
   ⚠ MAIN 영상 iframe 은 원본 min.js 가 Vimeo 플레이어로 잡고 있어 지우지 않고 안 보이게만 합니다. */
.main_vd_box::before { display: none !important; }
.main_vd_box, .main_vd_box>div { -webkit-mask: none !important; mask: none !important; clip-path: none !important; }
.main_vd_box.box02>div:first-child { visibility: hidden !important; opacity: 0 !important; }
.main_txt_box, .main_guest, .main_per, .main_txt2 { visibility: hidden !important; opacity: 0 !important; }
.os-hero img { filter: none !important; transform: none !important; }
/* 아래쪽 한 줄 안내 — 조감도를 가리지 않게 작은 띠로 */
.main_ori { bottom: 1.25rem !important; }
.main_ori p { display: inline-block; background: rgba(255,255,255,.88); color: #333 !important; opacity: 1 !important;
  padding: .35rem .9rem; border-radius: 2rem; font-size: .75rem; line-height: 1.5; }
.main_ori p br { display: none; }
/* ── 첫 화면 메인 문구 (PC 왼쪽 · 휴대폰 아래 — 4개동을 가리지 않는 자리) ──
   조감도 전체를 덮지 않고, 글씨 뒤쪽에만 옅은 어두운 그라데이션. 흰 글씨 대비는 그 그라데이션 위에서 4.5 이상 */
.os-herotxt { position: absolute; z-index: 11; left: 0; top: 0; bottom: 0; width: 46%; box-sizing: border-box;
  display: flex; flex-direction: column; justify-content: center; padding: 0 0 0 6.5%;
  background: linear-gradient(90deg, rgba(4,20,38,.62) 0%, rgba(4,20,38,.42) 55%, rgba(4,20,38,0) 100%);
  color: #fff; text-align: left; transition: opacity .5s; }
.os-herotxt__eye { font-size: 1.125rem; font-weight: 600; letter-spacing: .04em; color: #e6eef6; text-shadow: 0 1px 8px rgba(0,0,0,.55); }
.os-herotxt__t { font-size: 4.25rem; line-height: 1.1; font-weight: 800; letter-spacing: -.03em; margin: .6rem 0 1rem; color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.5); }
.os-herotxt__d { font-size: 1.25rem; line-height: 1.6; color: #f1f5f9; text-shadow: 0 1px 8px rgba(0,0,0,.6); }
.os-herotxt__btns { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.25rem; }
.os-hbtn { display: inline-flex; align-items: center; justify-content: center; min-height: 3.25rem; padding: 0 1.6rem; border-radius: 3rem;
  font-size: 1.0625rem; font-weight: 700; cursor: pointer; transition: .25s; white-space: nowrap; }
.os-hbtn--fill { background: #fff; color: #003c66 !important; }
.os-hbtn--fill:hover { background: #e9f1f8; }
.os-hbtn--line { border: 1.5px solid rgba(255,255,255,.9); color: #fff !important; background: rgba(4,20,38,.25); }
.os-hbtn--line:hover { background: rgba(255,255,255,.15); }
@media (max-width: 1000px) {
  .os-herotxt { top: auto; bottom: 0; width: 100%; height: auto; padding: 5rem 1.25rem 4.25rem;
    background: linear-gradient(0deg, rgba(4,20,38,.72) 0%, rgba(4,20,38,.5) 60%, rgba(4,20,38,0) 100%); }
  .os-herotxt__eye { font-size: .9375rem; }
  .os-herotxt__t { font-size: 2.5rem; margin: .4rem 0 .6rem; }
  .os-herotxt__d { font-size: 1rem; }
  .os-herotxt__btns { margin-top: 1.25rem; gap: .5rem; }
  .os-hbtn { min-height: 2.875rem; padding: 0 1.15rem; font-size: .9375rem; }
  .main_ori { bottom: .75rem !important; }
}

/* ── 사업개요 = 흰 바탕의 따로 된 화면 (2026-10-21 사장님 「조감도 위에 덮어 올리지 말고」) ──
   원본은 같은 칸 안에서 요약을 조감도 위로 겹쳐 올립니다(on2). PC 에선 그 순간 조감도·문구를 바로 걷고 흰 바탕만 남깁니다.
   제목은 표 위에 따로 (원본은 절대 위치라 화면 높이에 따라 대지위치 칸과 겹쳤다). */
.main_wrap.on2 .os-hero, .main_wrap.on2 .os-herotxt, .main_wrap.on2 .main_ori { opacity: 0 !important; visibility: hidden !important; transition: none !important; }
.main_wrap.on2 .main_vd_box { background: #fff !important; }
@media (min-width: 1001px) {
  .main02 { background: #fff; }
  .main02>div { position: relative !important; display: flex; flex-direction: column; justify-content: center; align-items: center;
    padding: 5.5rem 8% 4rem; box-sizing: border-box; }
  .main02>div { padding-top: 7.5rem !important; }   /* 머리글(약 6rem) 아래로 */
  .main02 .sum_tit { width: 100%; max-width: 1100px; height: auto !important; position: static !important; text-align: left; }
  .main02 .sum_tit h4 { position: static !important; font-size: 2.25rem !important; font-weight: 800; color: #003c66 !important; margin: 0 0 3rem; text-align: left; }
  .main02 .sum_tit h4::after { content: ''; display: block; width: 3rem; height: 3px; background: #003c66; margin-top: 1.1rem; }
  .sum_sum { position: static !important; width: 100%; max-width: 1100px; }
  .sum_sum ul { justify-content: flex-start; }
  .sum_ori { position: static !important; margin-top: 3rem; max-width: 1100px; }
}
.main_txt_box { color: var(--lt-ink) !important; }
.main_txt_box p { color: var(--lt-sub) !important; opacity: 1 !important; }
.main_svg svg path { fill: var(--lt-navy); }
.main_ori p, .sum_ori p { color: var(--lt-sub) !important; opacity: 1 !important; }
.main02 .sum_tit h4, .main02 .sum_tit h2, .sum_sum { color: var(--lt-ink) !important; }
.sum_sum ul li h3 { color: var(--lt-navy) !important; opacity: 1 !important; }
.sum_sum ul li p { color: var(--lt-ink) !important; opacity: 1 !important; border-top-color: var(--lt-line) !important; }
.main_guest p { color: var(--lt-ink) !important; }
/* 태블릿·휴대폰에서 사업개요는 검은 바탕 칸으로 따로 나온다 (pad.css max-width:1000px) */
@media all and (max-width: 1000px) {
  .main02 { background-color: var(--lt-bg2) !important; color: var(--lt-ink) !important; }
  .main02 .sum_tit h2, .main02 .sum_tit h4 { color: var(--lt-ink) !important; }
}

/* ── 프리미엄 ── */
.premium_wrap { background-color: var(--lt-bg2) !important; color: var(--lt-ink) !important; }
.pre_txt p, .pre_ori p { color: var(--lt-sub) !important; opacity: 1 !important; }
.pre_txt h4 { color: var(--lt-ink) !important; }

/* ── 홍보영상 ── */
.pr_wrap { background-color: var(--lt-bg) !important; color: var(--lt-ink) !important; }
.pr_wrap::before { opacity: .08 !important; }
.pr_tit_box p { color: var(--lt-sub) !important; opacity: 1 !important; }
.pr_tit_box h4 { color: var(--lt-ink) !important; }
/* 원본 TV CF 화면 오른쪽 위에 원본 대표번호가 박혀 있어 우리 번호로 덮습니다 */
/* 원본 배지 자리(영상 너비 기준 왼쪽 79%·오른쪽 4.6%·위 4.4%·높이 4.9%)보다 조금 크게 덮고, 모양도 원본 배지처럼 */
.pr_vd_box { container-type: inline-size; }
.os-prnum { position: absolute; right: 4%; top: 3.9%; width: 18%; height: 6.2%; z-index: 3; pointer-events: none; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center; gap: .35em; background: #eef2ef; color: #1d5236; border-radius: .35em;
  font-weight: 800; font-size: 1.75cqw; line-height: 1; letter-spacing: -.01em; white-space: nowrap; }
.os-prnum small { font-size: .82em; font-weight: 700; }

/* ── 언론보도 ── */
.news_wrap { background-color: var(--lt-bg2) !important; }
.news_img_box { background-color: var(--lt-bg) !important; }
.news_img_box>div::before { opacity: .22 !important; filter: grayscale(1); }
.news_tit { color: var(--lt-ink) !important; }
.news_arrow .swiper-pagination { color: var(--lt-ink) !important; }
.news_arrow .swiper-pagination .slash { background-color: var(--lt-ink) !important; }
.news_arrow .swiper-button-prev::after, .news_arrow .swiper-button-next::after { border-color: var(--lt-ink) !important; }

/* ── 오시는 길 오른쪽 하늘 그림 위 글씨는 원본도 어두운 글씨라 그대로 ── */

/* ── 푸터 ── */
.footer { background-color: var(--lt-bg2) !important; color: var(--lt-ink) !important; border-top: 1px solid var(--lt-line); }
.footer_info span, .footer_right .footer_info li, .footer h6, .footer_tel h2, .footer_unit span, .footer_praivacy h5 { color: var(--lt-ink) !important; }
.footer_info li::before, .footer_info li::after, .footer_const li:after { background-color: #9aa1a7 !important; }
.footer_bottom::before, .footer_bottom::after { background-color: #b9c0c6 !important; opacity: 1 !important; }
.footer p, .footer_bottom .footer_left .footer_info { color: var(--lt-sub) !important; opacity: 1 !important; }
.footer_ad_box { background-color: #e3ece7 !important; color: var(--lt-ink) !important; }
.footer_ad_qual, .footer_ad_qual * { color: var(--lt-ink) !important; }
.footer a { color: var(--lt-navy); }
.os-run { color: var(--lt-sub) !important; }
.os-run a, .os-made a { color: var(--lt-navy) !important; }
.os-made a { color: var(--lt-faint) !important; }

/* ── 서브 페이지 머리 그림 ── */
.sub_top { background-color: var(--lt-bg2) !important; }
.sub_top:after { opacity: .16 !important; }
.sub_top_txt, .sub_top_txt h2 { color: var(--lt-ink) !important; }