/* DHOME 광주 분양 — dhome.kr 전용 단지 사이트 디자인 층 (2026-10-16)
   원래 단지 사이트(carypact.xyz/<폴더>/) 위에 덧씌운다. 밤하늘 남색 + 금빛 그라데이션 + 유리 카드 + 빛 효과. */
/* ==== 목차 — 부품별 칸. 고칠 때는 그 부품 칸에서만 고친다 ====
   0. 설정값(토큰) : 색·금빛 그라데이션·단지별 테마값. 값만 바꾸면 모든 부품에 같이 반영
   1. 바탕 : 구역 배경·하위 쪽 바탕·테마색 번짐
   2. 머리글·메뉴 : 머리글·PC 메뉴·휴대폰 메뉴·하위 탭 메뉴(lnb)·쪽 제목
   3. 첫 화면 : 사진·큰 제목·칩·부제
   4. 글씨·제목 : 본문·제목 색과 금빛 글자
   5. 카드·상자 : 유리 카드·네 칸·맞춤견적 카드
   6. 표 : 사업 개요 표·하위 쪽 표·평면 표
   7. 금색 단추 : 금빛 단추와 누르거나 올렸을 때 효과
   8. 탭·칩 : 평형 탭·타입 칩·하위 쪽 탭
   9. 입력 폼 : 관심고객 등록·상담 폼·동의·입력칸
   10. 계산기·도구 : 분양가 계산기·서류 체크·맞춤견적
   11. 칼럼·DHOME 글·갤러리 : 홍보칼럼·분석 노트·갤러리
   12. 바닥글 : 아래 전체 메뉴·바닥글
   13. 단지별 따로 : 특정 단지에만 걸리는 값
   14. 기타 : 어느 부품에도 속하지 않는 것
   ※ 칸 순서는 화면 결과가 바뀌지 않게 정했다. 서로 같은 곳을 다투는 규칙은 원래 앞뒤를 지켜 한 칸이 앞 칸 뒤에 다시 나올 수 있다. */


/* ################################ 제1판 — 부품별 기본 모양 ################################ */

/* ======================== 0. 설정값(토큰) — 색·금빛 그라데이션·단지별 테마값. 값만 바꾸면 모든 부품에 같이 반영 ======================== */
:root { --dh-ink: #0b1020;
  --dh-ink2: #121a33;
  --dh-gold: #e3c27a;
  --dh-gold2: #b8893b;
  --dh-rose: #f2a7a0;
  --dh-glow: rgba(227, 194, 122, .45);
  --dh-glass: rgba(255, 255, 255, .06);
  --dh-line: rgba(227, 194, 122, .28);
  --dh-grad: linear-gradient(120deg, #fff6dc 0%, #f6dc9a 30%, #e9c472 55%, #fbe7b0 80%, #fffaea 100%);
  --dh-btn: linear-gradient(120deg, #f7e3b0 0%, #e3c27a 30%, #c9984a 55%, #f2d58f 80%, #fff1c9 100%); }
@keyframes dhShine { to { background-position: -220% 0; } }
@keyframes dhRing {
  0% { box-shadow: 0 0 0 1.5px var(--dh-gold) inset, 0 0 0 0 rgba(227, 194, 122, .7); }
  100% { box-shadow: 0 0 0 1.5px var(--dh-gold) inset, 0 0 0 14px rgba(227, 194, 122, 0); }
}
@keyframes dhSweep { 0%, 60% { left: -60%; } 100% { left: 130%; } }
/* ---- 배경에 단지 테마색 섞기 (2026-10-16): 단지마다 --c-primary(로고·버튼 색)를 남색 바탕에 은은하게 ---- */
body[data-dh] { --dh-t34: rgba(120,60,40,.34); --dh-t40: rgba(120,60,40,.40); --dh-b16: rgb(28,24,40); --dh-b7: rgb(18,19,34); --dh-b22: rgb(34,28,44); --dh-b10: rgb(22,22,38); }
/* 2026-10-16: 머리글·윗사진·탭 메뉴는 layout.js 가 붙인다. 붙기 전에는 제목부터 보였다가 위쪽이 생기며 밀려 "메뉴 윗부분이 사라졌다" 보이던 것
   → 머리글이 붙을 때까지 새 쪽을 그리지 않는다(브라우저가 그동안 이전 쪽을 보여 줌). 만일을 대비해 2.5초 뒤에는 그냥 보인다. */
/* 2026-10-16: 단지 테마색을 섞은 배경값 — 예전엔 쪽마다 프로그램이 계산했던 것을 미리 적어 둠 (프로그램 없음) */
/* 단지별 색 변수 (2026-10-18 정리: 같은 단지 줄이 여러 개였던 것을 한 줄로 — 뒤 값이 이기던 것 그대로) */
body[data-dh="championscity"] { --dh-t34: rgba(180,40,0,.14); --dh-t40: rgba(180,40,0,.17); --dh-b16: rgb(33,21,20); --dh-b7: rgb(18,13,14); --dh-b22: rgb(41,24,22); --dh-b10: rgb(23,15,16); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(13 45% 72%)); --dh-th: hsl(13 70% 62%); }
body[data-dh="hanyanglips"] { --dh-t34: rgba(15,74,38,.34); --dh-t40: rgba(15,74,38,.40); --dh-b16: rgb(12,25,33); --dh-b7: rgb(10,18,29); --dh-b22: rgb(14,32,40); --dh-b10: rgb(11,22,33); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(143 45% 72%)); --dh-th: hsl(143 70% 62%); }
body[data-dh="hillstate"] { --dh-t34: rgba(165,17,28,.16); --dh-t40: rgba(165,17,28,.19); --dh-b16: rgb(32,19,22); --dh-b7: rgb(17,12,14); --dh-b22: rgb(40,21,25); --dh-b10: rgb(23,14,18); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(356 45% 72%)); --dh-th: hsl(356 70% 62%); }
body[data-dh="hobansummit"] { --dh-t34: rgba(160,85,63,.15); --dh-t40: rgba(160,85,63,.18); --dh-b16: rgb(31,24,25); --dh-b7: rgb(17,15,16); --dh-b22: rgb(39,29,29); --dh-b10: rgb(22,18,19); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(14 45% 72%)); --dh-th: hsl(14 70% 62%); }
body[data-dh="iparkmudeung"] { --dh-t34: rgba(35,48,61,.34); --dh-t40: rgba(35,48,61,.40); --dh-b16: rgb(15,21,37); --dh-b7: rgb(12,16,30); --dh-b22: rgb(19,26,45); --dh-b10: rgb(13,19,35); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(210 45% 72%)); --dh-th: hsl(210 70% 62%); }
body[data-dh="jeilpunggyeong"] { --dh-t34: rgba(84,67,20,.34); --dh-t40: rgba(84,67,20,.40); --dh-b16: rgb(23,24,30); --dh-b7: rgb(15,18,27); --dh-b22: rgb(29,30,36); --dh-b10: rgb(18,21,31); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(44 45% 72%)); --dh-th: hsl(44 70% 62%); }
body[data-dh="lottecastle"] { --dh-t34: rgba(109,31,47,.22); --dh-t40: rgba(109,31,47,.26); --dh-b16: rgb(27,20,24); --dh-b7: rgb(15,13,15); --dh-b22: rgb(33,23,27); --dh-b10: rgb(20,15,19); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(348 45% 72%)); --dh-th: hsl(348 70% 62%); }
body[data-dh="lumitrie"] { --dh-t34: rgba(27,47,75,.34); --dh-t40: rgba(27,47,75,.40); --dh-b16: rgb(14,21,39); --dh-b7: rgb(11,16,31); --dh-b22: rgb(17,26,48); --dh-b10: rgb(13,19,36); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(215 45% 72%)); --dh-th: hsl(215 70% 62%); }
body[data-dh="seungwon"] { --dh-t34: rgba(31,94,91,.34); --dh-t40: rgba(31,94,91,.40); --dh-b16: rgb(14,28,41); --dh-b7: rgb(11,20,32); --dh-b22: rgb(18,36,51); --dh-b10: rgb(13,24,38); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(177 45% 72%)); --dh-th: hsl(177 70% 62%); }
body[data-dh="skview"] { --dh-t34: rgba(208,16,44,.13); --dh-t40: rgba(208,16,44,.16); --dh-b16: rgb(35,19,24); --dh-b7: rgb(19,12,15); --dh-b22: rgb(44,21,27); --dh-b10: rgb(25,14,18); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(351 45% 72%)); --dh-th: hsl(351 70% 62%); }
body[data-dh="theliv"] { --dh-t34: rgba(21,47,72,.34); --dh-t40: rgba(21,47,72,.40); --dh-b16: rgb(13,21,38); --dh-b7: rgb(11,16,31); --dh-b22: rgb(16,26,47); --dh-b10: rgb(12,19,36); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(209 45% 72%)); --dh-th: hsl(209 70% 62%); }
body[data-dh="viterra"] { --dh-t34: rgba(38,42,85,.34); --dh-t40: rgba(38,42,85,.40); --dh-b16: rgb(15,20,40); --dh-b7: rgb(12,16,32); --dh-b22: rgb(19,25,50); --dh-b10: rgb(14,19,37); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(235 45% 72%)); --dh-th: hsl(235 70% 62%); }
body[data-dh="wepark"] { --dh-t34: rgba(0,26,69,.34); --dh-t40: rgba(0,26,69,.40); --dh-b16: rgb(9,18,38); --dh-b7: rgb(9,15,31); --dh-b22: rgb(11,21,46); --dh-b10: rgb(10,17,36); --dh-l1: color-mix(in srgb, #e9d3a1 78%, hsl(217 45% 72%)); --dh-th: hsl(217 70% 62%); }
/* 10-16 주인 "모바일에서 테마색 비추는 효과": 휴대폰에서 화면 가운데 줄(dh-lit)에 테마색 빛 — 단지별 --dh-th */
/* 10-16 주인 "다른 단지는 기본 배경이 테마 어두운색인데 챔피언·롯데·힐스 다 보라색": 붉은 계열 테마는 남색과 섞여 보라가 됐던 것 → 테마색을 검정 쪽으로만 어둡게 (SK뷰·호반도 같은 문제) */
/* 10-16 주인 "이런느낌으로"(한양립스 PC): 바탕은 거의 검정, 테마색은 번짐으로만 — 붉은 계열 5곳 바탕을 무채색 검정에 테마색 살짝 */
/* 10-16 주인 "은은하게": 밝은 붉은 계열 5곳은 테마색 번짐이 한양립스보다 훨씬 진해 보이던 것 → 번짐 세기를 낮춰 비슷한 밝기로 */

/* ======================== 1. 바탕 — 구역 배경·하위 쪽 바탕·테마색 번짐 ======================== */
/* ---- 전체 바탕: 남색 + 은은한 금빛 별빛 ---- */
body[data-dh] { background: var(--dh-ink) !important; }
body[data-dh] .op-sec,
body[data-dh] .op-soft,
body[data-dh] .op-deal,
body[data-dh] .op-reg,
body[data-dh] .op-final,
body[data-dh] .k-more,
body[data-dh] .seo-sum,
body[data-dh] .k-imgtxt { background:
    radial-gradient(900px 420px at 12% 0%, rgba(227, 194, 122, .10), transparent 60%),
    radial-gradient(700px 380px at 92% 100%, rgba(120, 140, 255, .10), transparent 60%),
    linear-gradient(180deg, var(--dh-ink) 0%, var(--dh-ink2) 100%) !important;
  color: #e9e6df !important; }
body[data-dh] .op-soft { background:
    radial-gradient(800px 400px at 85% 10%, rgba(242, 167, 160, .10), transparent 60%),
    linear-gradient(180deg, #10172d 0%, #0b1020 100%) !important; }
body[data-dh] .op-sec img { border-radius: 12px; }
/* ---- 하위 쪽 ---- */
body[data-dh] .sub-content,
body[data-dh] main.sub,
body[data-dh] .sub-wrap { background: linear-gradient(180deg, #0f162c, var(--dh-ink)) !important; color: #e3ddcf; }
/* 실제 값은 dh-lux.js 가 단지 테마색으로 채움 */
body[data-dh] .op-sec, body[data-dh] .op-deal, body[data-dh] .op-reg, body[data-dh] .op-final, body[data-dh] .k-more, body[data-dh] .seo-sum, body[data-dh] .k-imgtxt { background:
    radial-gradient(900px 460px at 10% 0%, var(--dh-t34), transparent 62%),
    radial-gradient(760px 420px at 95% 100%, rgba(227,194,122,.14), transparent 60%),
    linear-gradient(180deg, var(--dh-b16) 0%, var(--dh-b7) 100%) !important; }
body[data-dh] .op-soft { background:
    radial-gradient(820px 420px at 88% 8%, var(--dh-t40), transparent 62%),
    radial-gradient(700px 380px at 5% 100%, rgba(227,194,122,.12), transparent 60%),
    linear-gradient(180deg, var(--dh-b22) 0%, var(--dh-b10) 100%) !important; }
body[data-dh] .sub-content, body[data-dh] main.sub, body[data-dh] .sub-wrap { background: linear-gradient(180deg, var(--dh-b16), var(--dh-b7)) !important; }
@media (max-width: 1024px) {
  /* 2026-10-16: 휴대폰 그래픽 부담 줄이기 — 칸마다 3겹 원형 빛 번짐 → 같은 색 한 겹, 금빛 그라데이션 글자(문단·목록까지 걸려 있던 것) → 같은 금색 한 색 */
  body[data-dh] .op-sec, body[data-dh] .op-deal, body[data-dh] .op-reg, body[data-dh] .op-final, body[data-dh] .k-more, body[data-dh] .seo-sum, body[data-dh] .k-imgtxt { background: linear-gradient(180deg, var(--dh-b16) 0%, var(--dh-b7) 100%) !important; }
  body[data-dh] .op-soft { background: linear-gradient(180deg, var(--dh-b22) 0%, var(--dh-b10) 100%) !important; }
}
/* 10-16 주인 "내용 가운데 정렬": 세대안내 등 1200px 그림이 더 넓은 칸(1309px) 왼쪽에 붙던 것 → 가운데 */
body[data-dh] .sub-content .panel > picture > img, body[data-dh] .sub-content .panel > img, body[data-dh] .sub-content .panel > picture, body[data-dh] .sub-content .panel .video-tit { margin-left: auto !important; margin-right: auto !important; }
body[data-dh] .sub-content .panel .video-tit { text-align: center; }
/* 10-16 주인 "가운데 정렬"(스마트시스템 등): 쪽 안 그림 전부 가운데 */
body[data-dh] .sub-content picture > img, body[data-dh] .sub-content > img, body[data-dh] .sub-content > div > img { margin-left: auto !important; margin-right: auto !important; }
@media (max-width: 1024px) {
  /* 10-16 주인 "테마색으로 모바일도 · 저걸 모바일에도": PC 구역 배경의 테마색 번짐(같은 색·같은 자리)을 휴대폰에도 — 화면이 좁아 크기만 줄임 */
  body[data-dh] .op-sec, body[data-dh] .op-deal, body[data-dh] .op-reg, body[data-dh] .op-final, body[data-dh] .k-more { background: radial-gradient(520px 360px at 10% 0%, var(--dh-t34), transparent 65%), radial-gradient(440px 320px at 95% 100%, rgba(227,194,122,.14), transparent 60%), linear-gradient(180deg, var(--dh-b16) 0%, var(--dh-b7) 100%) !important; }
  body[data-dh] .op-soft { background: radial-gradient(500px 340px at 88% 8%, var(--dh-t40), transparent 65%), radial-gradient(420px 300px at 5% 100%, rgba(227,194,122,.12), transparent 60%), linear-gradient(180deg, var(--dh-b22) 0%, var(--dh-b10) 100%) !important; }
}
/* 10-16 주인 "대각선 이걸 낮추라고 · 반대 대각선에서 올라오는 효과가 없어짐": 아래 모서리 금빛은 절반(.07, 주인 "방금 올린거 그것도 낮춰"), 왼쪽(오른쪽) 위에서 내려오는 테마색 번짐을 55%로 낮춤 — PC·휴대폰 · 주인 "지금에서 모두 절반" → 위 번짐 28%, 아래 금빛 .035/.03 */
body[data-dh] .op-sec, body[data-dh] .op-deal, body[data-dh] .op-reg, body[data-dh] .op-final, body[data-dh] .k-more, body[data-dh] .seo-sum, body[data-dh] .k-imgtxt { background: radial-gradient(900px 460px at 10% 0%, color-mix(in srgb, var(--dh-t34) 28%, transparent), transparent 62%), radial-gradient(760px 420px at 95% 100%, rgba(227,194,122,.035), transparent 60%), linear-gradient(180deg, var(--dh-b16) 0%, var(--dh-b7) 100%) !important; }
body[data-dh] .op-soft { background: radial-gradient(820px 420px at 88% 8%, color-mix(in srgb, var(--dh-t40) 28%, transparent), transparent 62%), radial-gradient(700px 380px at 5% 100%, rgba(227,194,122,.03), transparent 60%), linear-gradient(180deg, var(--dh-b22) 0%, var(--dh-b10) 100%) !important; }
@media (max-width: 1024px) {
  body[data-dh] .op-sec, body[data-dh] .op-deal, body[data-dh] .op-reg, body[data-dh] .op-final, body[data-dh] .k-more { background: radial-gradient(520px 360px at 10% 0%, color-mix(in srgb, var(--dh-t34) 28%, transparent), transparent 65%), radial-gradient(440px 320px at 95% 100%, rgba(227,194,122,.035), transparent 60%), linear-gradient(180deg, var(--dh-b16) 0%, var(--dh-b7) 100%) !important; }
  body[data-dh] .op-soft { background: radial-gradient(500px 340px at 88% 8%, color-mix(in srgb, var(--dh-t40) 28%, transparent), transparent 65%), radial-gradient(420px 300px at 5% 100%, rgba(227,194,122,.03), transparent 60%), linear-gradient(180deg, var(--dh-b22) 0%, var(--dh-b10) 100%) !important; }
  /* 10-16 주인 "PC는 됐어 · 모바일 오른쪽에서 오는 빛이 더 강해 · 아래쪽에서 올라오는 빛이 없어짐": 휴대폰만 — 오른쪽 위 테마 빛(번갈아 구역)만 작고 옅게, 아래에서 올라오는 금빛은 그대로 */
  body[data-dh] .op-sec, body[data-dh] .op-deal, body[data-dh] .op-reg, body[data-dh] .op-final, body[data-dh] .k-more { background: radial-gradient(520px 360px at 10% 0%, color-mix(in srgb, var(--dh-t34) 28%, transparent), transparent 65%), radial-gradient(440px 320px at 95% 100%, rgba(227,194,122,.035), transparent 60%), linear-gradient(180deg, var(--dh-b16) 0%, var(--dh-b7) 100%) !important; }
  body[data-dh] .op-soft { background: radial-gradient(300px 220px at 100% 0%, color-mix(in srgb, var(--dh-t40) 16%, transparent), transparent 70%), radial-gradient(420px 300px at 5% 100%, rgba(227,194,122,.03), transparent 60%), linear-gradient(180deg, var(--dh-b22) 0%, var(--dh-b10) 100%) !important; }
  /* 10-16 주인 "모바일 아래 모서리만 살짝 올려줘": 휴대폰 아래 모서리 금빛 3.5% → 6% (번갈아 구역 3% → 5%), 다른 빛은 그대로 */
  body[data-dh] .op-sec, body[data-dh] .op-deal, body[data-dh] .op-reg, body[data-dh] .op-final, body[data-dh] .k-more { background: radial-gradient(520px 360px at 10% 0%, color-mix(in srgb, var(--dh-t34) 28%, transparent), transparent 65%), radial-gradient(440px 320px at 95% 100%, rgba(227,194,122,.06), transparent 60%), linear-gradient(180deg, var(--dh-b16) 0%, var(--dh-b7) 100%) !important; }
  body[data-dh] .op-soft { background: radial-gradient(300px 220px at 100% 0%, color-mix(in srgb, var(--dh-t40) 16%, transparent), transparent 70%), radial-gradient(420px 300px at 5% 100%, rgba(227,194,122,.05), transparent 60%), linear-gradient(180deg, var(--dh-b22) 0%, var(--dh-b10) 100%) !important; }
}
/* 10-16 주인 "색 — 아래 전체 메뉴·바닥글은 테마색으로": 아래 전체 메뉴(seo-links, 바탕이 비어 body 남색이 보이던 것)·바닥글을 단지 테마 어두운색으로 — 위쪽 메뉴 줄은 남색 그대로 */
body[data-dh] { background-color: var(--dh-b7) !important; }
@media (min-width: 1025px) {
  /* 4-2. PC 평면도 그림이 화면을 다 채우던 것 → 최대 960px */
  body[data-dh] .sub-content .panel picture > img, body[data-dh] .sub-content .panel > img { max-width: 960px !important; height: auto !important; }
}

/* ======================== 2. 머리글·메뉴 — 머리글·PC 메뉴·휴대폰 메뉴·하위 탭 메뉴(lnb)·쪽 제목 ======================== */
/* ---- 머리글: 아래 금빛 선 ---- */
body[data-dh] .site-header { box-shadow: 0 1px 0 rgba(227, 194, 122, .6), 0 6px 24px rgba(11, 16, 32, .12); }
body[data-dh] .lnb, body[data-dh] .sub-tab { background: rgba(11, 16, 32, .9) !important; border-color: var(--dh-line) !important; }
/* ---- dhome 띠 (dh-lux.js 가 넣음) ---- */
.dh-ribbon { position: relative; z-index: 50; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 7px 14px;
  background: linear-gradient(90deg, #0b1020, #1d2547 50%, #0b1020); color: #f3ead6; font-size: 13px; letter-spacing: .02em; border-bottom: 1px solid var(--dh-line); }
.dh-ribbon b { background: var(--dh-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-weight: 800; letter-spacing: .14em; }
.dh-ribbon a { color: var(--dh-gold) !important; text-decoration: none; font-weight: 700; white-space: nowrap; }
.dh-spark { position: fixed; inset: 0; pointer-events: none; z-index: 0; }
@media (max-width: 760px) {
  .dh-ribbon { font-size: 12px; padding: 6px 10px; }
}
body[data-dh] button.menu-btn[class]::after, body[data-dh] button.menu-btn[class]:hover::after { display: none !important; }
body[data-dh] .menu-btn span { background: #2a241b !important; }
@media (max-width: 768px) {
  /* 2026-10-16: 휴대폰 아래 탭(흰 칸)이 처음엔 옅은 회색 글씨로 떴다가 진하게 바뀌며 깜박이던 것 → 처음부터 진한 글씨, 누를 때 색 바뀜 없음 */
  body[data-dh] .sub-visual .lnb a:not(.on):not([aria-current]),
  body[data-dh] .sub-visual .lnb a:not(.on):not([aria-current]):hover,
  body[data-dh] .sub-visual .lnb a:not(.on):not([aria-current]):active { color: #d9d4c8 !important; -webkit-text-fill-color: #d9d4c8 !important; background: #141a33 !important; border-color: rgba(227, 194, 122, .22) !important; transition: none !important; -webkit-tap-highlight-color: transparent; }
}
body[data-dh] .site-header { border-bottom: 1px solid rgba(227, 194, 122, .38) !important; box-shadow: 0 8px 28px rgba(0, 0, 0, .35) !important; }
body[data-dh] .site-header .logo img { filter: brightness(0) invert(1); opacity: .96; }
body[data-dh] .site-header .hd-tel .ico-tel { filter: brightness(0) invert(1) sepia(1) saturate(3) hue-rotate(5deg); }
body[data-dh] .site-header .menu-btn span { background: #e3c27a !important; }
@media (min-width: 1025px) {
  body[data-dh] .gnb > ul > li > a.d1 { color: #ece5d6 !important; letter-spacing: .04em; }
  body[data-dh] .gnb > ul > li > a.d1:hover, body[data-dh] .gnb > ul > li.active > a.d1 { color: #e3c27a !important; }
  body[data-dh] .gnb > ul > li > a.d1::after { background: #e3c27a !important; }
}
/* 하위 쪽 탭 메뉴(lnb): 흰 칸 → 어두운 칸, 고른 탭은 금색 그대로 */
body[data-dh] .lnb, body[data-dh] .lnb ul { background: #0f1428 !important; border-color: rgba(227, 194, 122, .22) !important; }
body[data-dh] .lnb li { border-color: rgba(227, 194, 122, .22) !important; }
/* 10-16 주인 "정렬": 쪽 제목 아래 세로선과 ◆ 가운데 맞춤 (margin -4px 로 ◆가 반 칸 비켜 있던 것) */
body[data-dh] .page-title .bar::after { left: 50% !important; margin-left: 0 !important; transform: translateX(-50%) rotate(45deg) !important; }
/* 7. 제목이 둘째 줄에 짧은 말만 남게 끊김 → 줄 길이를 고르게 */
body[data-dh] :is(.k-col-h, .k-col h2, .op-tit, .page-title h1, .sub-content h2, .sub-content h3) { text-wrap: balance; }
/* 10-16 주인 "CSS 똑같은 걸 쓰라고 · 효과": 맨 아래 '관심고객등록하기'(op-btn)에만 원래 사이트 CSS 가 더 걸려 있던 것 — isolation + 빛줄기 z-index:-1(빛이 글씨 뒤로 지나감)·누르면 1px 내려감 → 금색 단추 전부 같은 값 */
body[data-dh] :is(a[class*="btn"], button[class*="btn"], .op-submit, button[type="submit"]):not(.menu-btn) { isolation: isolate; }
body[data-dh] :is(a[class*="btn"], button[class*="btn"], .op-submit, button[type="submit"]):not(.menu-btn)::after { z-index: -1; transition: left .7s; }

/* ======================== 3. 첫 화면 — 사진·큰 제목·칩·부제 ======================== */
/* ---- 첫 화면: 사진 아래 금빛 띠 (사진·글 배치는 원래 그대로) ---- */
body[data-dh] .op-hero { box-shadow: 0 1px 0 rgba(227, 194, 122, .55), 0 18px 50px -20px rgba(227, 194, 122, .35); }
body[data-dh] .op-hero-tit { text-shadow: 0 2px 18px rgba(255, 255, 255, .35); }
@media (max-width: 1024px) {
  body[data-dh] .sub-content h2, body[data-dh] .page-tit, body[data-dh] .sub-visual h1, body[data-dh] .sub-visual h2, body[data-dh] .op-tit, body[data-dh] .op-hero-tit { animation: none !important; background-position: 0 0 !important; }
  body[data-dh] .op-hero, body[data-dh] .op-tit::after, body[data-dh] .sub-content h2::after { box-shadow: none !important; }
}
/* 첫 화면 사진: 원래 사이트와 다른 사진 + 깊고 차분한 색감 */
body[data-dh] .op-hero .dh-hbg img { width: 100%; height: 100%; object-fit: cover; object-position: center; filter: brightness(.8) saturate(.88) contrast(1.06); }
@media (max-width: 768px) {
  body[data-dh] .op-hero .dh-hbg img { aspect-ratio: 720 / 1185; height: auto; }
}
/* 첫 화면 글씨: 원래(진한 붉은 명조)와 다르게 — 흰 굵은 고딕 + 첫 줄 금색, 금색 머리말, 어두운 부제 상자 (2026-10-16 "문구도 다르게") */
body[data-dh] .op-hero .dh-hbg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(13, 16, 34, .62), rgba(13, 16, 34, .18) 62%, rgba(13, 16, 34, .35)); pointer-events: none; }
body[data-dh] .op-hero-copy .hc-chip::before, body[data-dh] .op-hero-copy .hc-chip::after { color: #e3c27a !important; }
body[data-dh] .op-hero-copy .hc-tit::first-line { color: #f0d18a; }
body[data-dh] .op-hero .dh-hbg::before { display: none !important; }
/* 첫 화면 제목 가독성: 그림자 강화, 휴대폰은 사진 위쪽을 어둡게 */
body[data-dh] .op-hero-copy .hc-tit { text-shadow: 0 0 2px rgba(0, 0, 0, .85), 0 2px 18px rgba(0, 0, 0, .75) !important; }
body[data-dh] .op-hero-copy .hc-tit .dh-l1 { display: inline; }
@media (max-width: 768px) {
  body[data-dh] .op-hero .dh-hbg::after { background: linear-gradient(180deg, rgba(13, 16, 34, .78) 0%, rgba(13, 16, 34, .55) 30%, rgba(13, 16, 34, .12) 55%, rgba(13, 16, 34, .3) 100%) !important; }
}
body[data-dh] .op-hero-copy .hc-tit .dh-l1 { color: var(--dh-l1, #f0d18a) !important; -webkit-text-fill-color: var(--dh-l1, #f0d18a) !important; }
body[data-dh] .op-hero-copy .hc-tit { text-shadow: 0 1px 2px rgba(0, 0, 0, .95), 0 2px 10px rgba(0, 0, 0, .55) !important; }
@media (max-width: 768px) {
  body[data-dh] .op-hero .dh-hbg::after { background: linear-gradient(180deg, rgba(13, 16, 34, .88) 0%, rgba(13, 16, 34, .72) 28%, rgba(13, 16, 34, .25) 52%, rgba(13, 16, 34, .3) 100%) !important; }
}
body[data-dh] .op-hero-copy .hc-tit, body[data-dh] .op-hero-copy .hc-tit .dh-l1 { text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0 0 1px #000, 0 2px 10px rgba(0, 0, 0, .6) !important; }
/* 10-16 주인 "글씨체 아래부분이랑 통일": 첫 화면 위 칩 글씨를 아래 줄(hc-sub)과 같은 글꼴·굵기·자간으로 */
body[data-dh] .op-hero-copy .hc-chip { font-family: "Pretendard Variable", Pretendard, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif !important; font-weight: 600 !important; letter-spacing: .01em !important; }
/* 10-16 주인 "똑같은데": 크기·글자색까지 아래 줄과 같게 (◆ 만 테마색) */
body[data-dh] .op-hero .op-hero-copy .hc-chip { font-size: 13.5px !important; color: #ece5d6 !important; -webkit-text-fill-color: #ece5d6 !important; }
/* 10-16 주인 "멘트 다른걸로 지금보다 2배 길게": 힐스테이트 첫 화면 제목이 길어져 크기 맞춤 */
body[data-dh] .op-hero .op-hero-copy .hc-tit { font-size: 27px !important; }
@media (min-width: 769px) {
  body[data-dh] .op-hero .op-hero-copy .hc-tit { font-size: clamp(32px, 3.2vw, 52px) !important; }
}
/* 10-16 주인 "이미지 경계선 하지말고 어두웠다가 밝아지는게 자연스럽게": 첫 화면 사진 위 어두운 띠(높이 226px, 아래 끝이 딱 끊김) → 더 길게, 아래로 갈수록 서서히 사라지게 */
body[data-dh] .op-hero .op-hero-bg::after, body[data-dh] .op-hero .dh-hbg::after { height: 70% !important; bottom: auto !important;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .85) 30%, rgba(0, 0, 0, .35) 65%, transparent 100%) !important;
  mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .85) 30%, rgba(0, 0, 0, .35) 65%, transparent 100%) !important; }
@media (max-width: 1024px) {
  /* 10-16 휴대폰에도 PC 와 같은 첫 화면 아래 금색 선 + 노란 빛 띠 (PC 값 그대로) */
  body[data-dh] .op-hero { box-shadow: 0 1px 0 rgba(227, 194, 122, .55), 0 18px 50px -20px rgba(227, 194, 122, .35) !important; }
}

/* ======================== 4. 글씨·제목 — 본문·제목 색과 금빛 글자 ======================== */
body[data-dh] .op-sec summary::marker, body[data-dh] .op-sec summary::before, body[data-dh] .op-sec summary::after { color: var(--dh-gold) !important; }
body[data-dh] .op-sec .eyebrow,
body[data-dh] .op-sec .op-en,
body[data-dh] .op-sec .op-en { color: var(--dh-gold) !important; letter-spacing: .28em; }
/* ---- 제목 아래 짧은 선: 밝은 금빛 (2026-10-16) ---- */
body[data-dh] .op-tit::after, body[data-dh] .sub-content h2::after { background: var(--dh-grad) !important; height: 2px !important; box-shadow: 0 0 10px rgba(246, 220, 154, .6); }
body[data-dh] .op-deal-list li { position: relative; transition: background-color .6s ease, box-shadow .6s ease; }
body[data-dh] .op-deal-list li::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .7s ease;
  background: radial-gradient(120% 140% at 0% 50%, color-mix(in srgb, var(--dh-th, #e3c27a) 30%, transparent) 0%, color-mix(in srgb, var(--dh-th, #e3c27a) 10%, transparent) 45%, transparent 75%); }
body[data-dh] .op-deal-list li.dh-lit::after { opacity: 1; }
@media (hover: hover) {
  /* 10-16 주인 "Pc에서 빛나는 효과도": PC 는 마우스를 올린 줄에 같은 테마색 빛 */
  body[data-dh] .op-deal-list li:hover::after { opacity: 1; }
}

/* ======================== 5. 카드·상자 — 유리 카드·네 칸·맞춤견적 카드 ======================== */
body[data-dh] .op-sec details[open] summary, body[data-dh] .op-sec summary:hover { color: var(--dh-gold) !important; }
body[data-dh] .op-sec [class*="card"]:hover,
body[data-dh] .op-sec [class*="item"]:hover { transform: translateY(-4px);
  border-color: var(--dh-gold) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .45), 0 0 24px var(--dh-glow); }
@media (max-width: 760px) {
  body[data-dh] .op-sec [class*="card"]:hover, body[data-dh] .op-sec [class*="item"]:hover { transform: none; }
}
body[data-dh] .op-docs a:hover, body[data-dh] .op-docs li:hover { box-shadow: inset 0 0 0 1px var(--dh-gold), 0 0 18px var(--dh-glow) !important; }
@media (max-width: 1024px) {
  /* 2026-10-16: 휴대폰에서 화려한 판만 느리던 것 — 카드·상자·목록 칸 수십~수백 개의 그림자·움직임 효과가 화면 그릴 때마다 부담 → 휴대폰에선 테두리·색은 그대로, 그림자·움직임만 뺌 */
  body[data-dh] .op-sec [class*="card"]:hover, body[data-dh] .op-sec [class*="item"]:hover { transform: none !important; box-shadow: none !important; }
  body[data-dh] .op-sec .op-cards li h3 { color: #f3ead6 !important; -webkit-text-fill-color: #f3ead6; }
  body[data-dh] .op-sec .op-cards li p { color: #d9d4c8 !important; -webkit-text-fill-color: #d9d4c8; }
}
body[data-dh] .op-cards li.op-card-cta h3 { color: #f3ead6 !important; -webkit-text-fill-color: #f3ead6 !important; }
/* 10-16 주인 "이것도 사각형으로": 첫 화면 카드 묶음(op-cards)·관심고객등록 카드 모서리 둥근 것 → 사각 */
body[data-dh] .op-sec .op-wrap ul.op-cards, body[data-dh] .op-sec .op-wrap ul.op-cards > li, body[data-dh] .op-sec ul.op-cards li.op-card-cta { border-radius: 0 !important; }
/* 표 아래 바로가기: 얇은 금색 테두리 칸 */
body[data-dh] .op-sec .op-more { gap: 10px !important; }

/* ======================== 6. 표 — 사업 개요 표·하위 쪽 표·평면 표 ======================== */
body[data-dh] .op-sec p,
body[data-dh] .op-sec li,
body[data-dh] .op-sec dd,
body[data-dh] .op-sec td,
body[data-dh] .seo-sum p { color: #d9d4c8 !important; }
/* 자주 묻는 질문 질문줄·용어 */
body[data-dh] .op-sec summary, body[data-dh] .op-sec summary *, body[data-dh] .op-sec dt, body[data-dh] .op-sec th { color: #f3ead6 !important; }
body[data-dh] .op-sec th { background: rgba(227, 194, 122, .14) !important; color: #f7e3b0 !important; }
body[data-dh] .op-sec td, body[data-dh] .op-sec th { border-color: rgba(227, 194, 122, .18) !important; }
/* ---- 하위 쪽 표 머리칸(사업명·위치 등): 밝은 판 위 밝은 글씨 → 금빛 비치는 어두운 칸 (2026-10-16) ---- */
body[data-dh] .sub-content th, body[data-dh] .sub-content thead td, body[data-dh] .info-table th, body[data-dh] main.sub table th { background: rgba(227, 194, 122, .14) !important; color: #f6dc9a !important; -webkit-text-fill-color: #f6dc9a; border-color: var(--dh-line) !important; }
body[data-dh] .sub-content td, body[data-dh] main.sub table td { border-color: var(--dh-line) !important; }
body[data-dh] table.info-table td > b { color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; }
/* 10-16 주인 "디자인 좀더 고급스럽게": 첫 화면 사업 개요 표(op-table) — 갈색 칸 대신 얇은 금색 틀·금색 작은 머리글·가는 구분선 */
body[data-dh] .op-sec table.op-table { border-collapse: collapse !important; border: 1px solid rgba(227, 194, 122, .38) !important; border-radius: 0 !important; overflow: visible !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .015)) !important; box-shadow: 0 24px 48px -28px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 244, 214, .06) !important; }
body[data-dh] .op-sec table.op-table tr { border-bottom: 1px solid rgba(227, 194, 122, .16) !important; }
body[data-dh] .op-sec table.op-table tr:last-child { border-bottom: 0 !important; }
body[data-dh] .op-sec table.op-table th, body[data-dh] .op-sec table.op-table td { border: 0 !important; background: none !important; }
body[data-dh] .op-sec table.op-table th { width: 180px; padding: 20px 10px 20px 28px !important; vertical-align: top; text-align: left;
  color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: .14em !important; }
body[data-dh] .op-sec table.op-table td { padding: 18px 28px 18px 10px !important; color: #f1ead9 !important; -webkit-text-fill-color: #f1ead9 !important; font-size: 15.5px !important; line-height: 1.75 !important; }
@media (max-width: 768px) {
  body[data-dh] .op-sec table.op-table tr { display: block; padding: 18px 20px 16px; }
  body[data-dh] .op-sec table.op-table th, body[data-dh] .op-sec table.op-table td { display: block; width: auto !important; padding: 0 !important; }
  body[data-dh] .op-sec table.op-table th { margin: 0 0 6px; font-size: 12px !important; display: flex; align-items: center; gap: 10px; }
  body[data-dh] .op-sec table.op-table th::before { content: ""; width: 14px; height: 1px; background: #e3c27a; flex: 0 0 auto; }
  body[data-dh] .op-sec table.op-table td { font-size: 15px !important; line-height: 1.7 !important; }
}
/* 10-16 주인 "폰트 크기": 사업 개요 표 — 왼쪽 이름이 너무 작던 것 키움, 내용도 조금 키움 */
body[data-dh] .op-sec table.op-table th { font-size: 15.5px !important; letter-spacing: .06em !important; }
body[data-dh] .op-sec table.op-table td { font-size: 17px !important; }
@media (max-width: 768px) {
  body[data-dh] .op-sec table.op-table th { font-size: 14px !important; letter-spacing: .06em !important; }
  body[data-dh] .op-sec table.op-table td { font-size: 16px !important; }
  /* 10-16 주인 "테이블 간격 불필요하게 넓어": 평면도 쪽 타입·면적·세대수·분양가 표(k-ptab) — 휴대폰에서 최소 너비 560px·넓은 칸 여백 때문에 옆으로 밀리고 줄이 높던 것 */
  body[data-dh] .k-ptab table, body[data-dh] .sub-content .info-table { min-width: 0 !important; width: 100% !important; }
  body[data-dh] .k-ptab th, body[data-dh] .k-ptab td, body[data-dh] .sub-content .info-table th, body[data-dh] .sub-content .info-table td { padding: 9px 8px !important; font-size: 14px !important; line-height: 1.45 !important; height: auto !important; }
  body[data-dh] .k-ptab th:first-child, body[data-dh] .k-ptab td:first-child { white-space: nowrap; }
}

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
body[data-dh] .op-sec a:not([class*="btn"]) { color: var(--dh-gold); }
/* ---- 버튼: 금빛 그라데이션 + 빛 지나감 ---- */
body[data-dh] a[class*="btn"],
body[data-dh] button[class*="btn"],
body[data-dh] .op-sec button[type="submit"],
body[data-dh] input[type="submit"] { position: relative; overflow: hidden;
  background: var(--dh-btn) !important; background-size: 200% 100% !important;
  color: #1b1405 !important; border: 0 !important; border-radius: 999px !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 22px rgba(184, 137, 59, .45), 0 0 0 1px rgba(255, 241, 201, .4) inset;
  transition: background .35s ease, color .35s ease, transform .25s ease, box-shadow .35s ease; }
/* 마우스를 올리면: 남색으로 뒤집히고 금빛 글씨·테두리, 바깥으로 금빛 고리가 퍼진다 */
body[data-dh] a[class*="btn"]:hover,
body[data-dh] button[class*="btn"]:hover,
body[data-dh] .op-sec button[type="submit"]:hover,
body[data-dh] input[type="submit"]:hover { background: #0b1020 !important; color: var(--dh-gold) !important;
  box-shadow: 0 0 0 1.5px var(--dh-gold) inset, 0 0 18px var(--dh-glow);
  transform: scale(1.04);
  animation: dhRing 1.1s ease-out; }
body[data-dh] a[class*="btn"]:hover *, body[data-dh] button[class*="btn"]:hover * { color: var(--dh-gold) !important; }
body[data-dh] a[class*="btn"]:hover::after, body[data-dh] button[class*="btn"]:hover::after { animation: none; opacity: 0; }
body[data-dh] a[class*="btn"]::after,
body[data-dh] button[class*="btn"]::after { content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .55), transparent);
  transform: skewX(-20deg); animation: dhSweep 3.6s ease-in-out infinite; pointer-events: none; }
@media (max-width: 1024px) {
  body[data-dh] a[class*="btn"]::after, body[data-dh] button[class*="btn"]::after { animation: none !important; display: none !important; }
}
@media(max-width:1024px) {
  /* 10-16 주인 "보기 pc처럼 가로가 길게": 휴대폰 동의 보기 단추가 44px 동그라미 → 가로로 긴 알약 */
  .op-check .op-terms-btn { min-height:0!important;height:auto!important;width:auto!important;padding:8px 20px!important;line-height:1.2!important;white-space:nowrap;flex:0 0 auto;align-self:center }
}
body[data-dh] .ccalc .pc-out :is(button, a)[class*="btn"]:not([class*="line"]):not([class*="ghost"]):not(:hover):not(:active), body[data-dh] .ccalc .pc-out :is(button, a)[class*="btn"]:not([class*="line"]):not([class*="ghost"]):not(:hover):not(:active) * { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
/* 10-16 주인 "여기 있는 걸 그대로 나머지에도": 맨 아래 '관심고객등록하기' 단추처럼 금빛이 지나가는 효과를 '관심고객 등록하기' 제출·'보기' 단추에도 (PC) */
body[data-dh] form :is(.op-submit, button[type="submit"], .op-terms-btn) { position: relative; overflow: hidden; }
body[data-dh] form :is(.op-submit, button[type="submit"], .op-terms-btn)::after { content: ""; display: block; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .55), transparent); transform: skewX(-20deg); animation: dhSweep 3.6s ease-in-out infinite; pointer-events: none; }
body[data-dh] form :is(.op-submit, button[type="submit"], .op-terms-btn):hover::after { animation: none; opacity: 0; }
@media (max-width: 1024px) {
  body[data-dh] form :is(.op-submit, button[type="submit"], .op-terms-btn)::after { animation: none !important; display: none !important; }
}

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
/* 평형·금액 고르기 단추 */
body[data-dh] .kp-chips button, body[data-dh] .kp-card button { background: rgba(255, 255, 255, .08) !important; color: #ece5d6 !important; border: 1px solid var(--dh-line) !important; }
body[data-dh] .kp-chips button[aria-selected="true"], body[data-dh] .kp-card button[aria-selected="true"], body[data-dh] .kp-chips button[aria-pressed="true"], body[data-dh] .kp-chips button.on, body[data-dh] .kp-card button[aria-pressed="true"], body[data-dh] .kp-card button.on { background: var(--dh-btn) !important; color: #1b1405 !important; border-color: transparent !important; }
body[data-dh] .op-tabs button.on::after, body[data-dh] .op-tabs button[aria-selected="true"]::after { background: #1b1405 !important; }
body[data-dh] .sub-content .tabs button.on::after, body[data-dh] .sub-content .tabs button[aria-selected="true"]::after { background: #1b1405 !important; }

/* ======================== 9. 입력 폼 — 관심고객 등록·상담 폼·동의·입력칸 ======================== */
/* 흰 판(상담 신청 칸 등) 안은 원래 어두운 글씨 그대로 */
body[data-dh] .op-form, body[data-dh] .op-form p, body[data-dh] .op-form span, body[data-dh] .op-form label,
body[data-dh] .op-form legend, body[data-dh] .op-form small, body[data-dh] .op-form li, body[data-dh] .op-form b, body[data-dh] .op-form strong { color: #3a3328 !important; }
body[data-dh] .op-form em { color: #b8893b !important; }
body[data-dh] .op-form [class*="box"], body[data-dh] .op-form [class*="item"] { background: transparent !important; border: 0 !important; box-shadow: none !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
/* ---- 선택칸·입력칸: 어디서든 흰 바탕 + 진한 글씨 (평형 비교·계산기·상담 신청) ---- */
body[data-dh] select, body[data-dh] input[type="text"], body[data-dh] input[type="tel"], body[data-dh] input[type="number"], body[data-dh] input[type="date"], body[data-dh] textarea { background-color: #fff !important; color: #2a241b !important; -webkit-text-fill-color: #2a241b; }
body[data-dh] select option { color: #2a241b; background: #fff; }
body[data-dh] input::placeholder, body[data-dh] textarea::placeholder { color: #8a8378 !important; -webkit-text-fill-color: #8a8378; }
body[data-dh] form.reg-form p.req-note { color: #5a4f3e !important; -webkit-text-fill-color: #5a4f3e !important; }
body[data-dh] form.op-form label > span, body[data-dh] form.reg-form label > span { border-color: rgba(227, 194, 122, .35) !important; }
/* 5. '(필수)·(선택)'·별표 글씨 → 어두운 카드 위 밝은 금색 */
body[data-dh] form em, body[data-dh] .op-check em, body[data-dh] form .req-note em { color: #e8c97f !important; -webkit-text-fill-color: #e8c97f !important; }
body[data-dh] form label > input:checked + span { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
/* 4 보충: 등록 폼 — legend 제목, 선택 칩(흰 칸) */
body[data-dh] form.reg-form legend, body[data-dh] form.op-form legend { color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] form.reg-form label > input + span, body[data-dh] form.op-form label > input + span { background: rgba(255, 255, 255, .06) !important; border: 1px solid rgba(227, 194, 122, .35) !important; color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] form.reg-form label > input:checked + span, body[data-dh] form.op-form label > input:checked + span { background: #2a1f12 !important; border-color: #e3c27a !important; color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
/* 4 보충(아이파크·루미·진도·비테라 틀): 동의 문구에 상자 테두리가 생기던 것 없앰, '보기' 단추는 13곳 모두 금색 단추 */
body[data-dh] form .op-check label > span, body[data-dh] form label.op-check > span, body[data-dh] form .op-check > span, body[data-dh] form .agree > label > span { border: 0 !important; background: none !important; padding: 0 !important; }
/* 4 보충: 아이파크 틀 동의 문구 상자 테두리(칩 규칙이 걸리던 것) 확실히 제거 */
body[data-dh] form.op-form label.op-check > input + span, body[data-dh] form.reg-form label.op-check > input + span, body[data-dh] form label[class*="check"] > input + span, body[data-dh] form .agree-box label > input + span { border: 0 !important; background: none !important; padding: 0 !important; border-radius: 0 !important; }
body[data-dh] form em { background: none !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
/* ---- 흰 판(맞춤견적·실거래가·더 알아보기 카드)도 어두운 유리로 — 글씨는 밝게 ---- */
body[data-dh] .k-mc, body[data-dh] .kp-card, body[data-dh] .kp-bars, body[data-dh] .kp-loan, body[data-dh] .kp-sec > div:not(.kp-img), body[data-dh] .kp-rows { background: rgba(255, 255, 255, .055) !important; border: 1px solid var(--dh-line) !important; border-radius: 14px !important;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 10px 30px rgba(0, 0, 0, .3); }
body[data-dh] .k-mc .k-mc-k, body[data-dh] .kp-card .kp-l, body[data-dh] .kp-bars .kp-lb { color: #e3c27a !important; }
body[data-dh] .kp-img { background: #fff !important; border-radius: 12px; }
/* ---- 맞춤견적 줄 정렬: 테두리 안쪽 여백 ---- */
body[data-dh] .kp-rows { padding: 4px 16px !important; }
body[data-dh] .kp-loan { padding: 14px 16px !important; }
/* ---- 맞춤견적·실거래가 바깥 상자 안쪽 여백 ---- */
body[data-dh] .kp-sec > .op-wrap { padding: 34px 38px 38px !important; }
@media (max-width: 760px) {
  body[data-dh] .kp-sec > .op-wrap { padding: 22px 16px 24px !important; }
}
/* ---- 표 머리칸은 진한 판(짙은 갈색) + 금빛 글씨: 어두운 바탕·흰 판 어디서든 읽히게 (위 규칙 덮어씀) ---- */
body[data-dh] .sub-content th, body[data-dh] .sub-content thead td, body[data-dh] .info-table th, body[data-dh] main.sub table th,
body[data-dh] .pc-out th, body[data-dh] .form th, body[data-dh] .ccalc th, body[data-dh] .op-sec th { background: #2b2418 !important; color: #f6dc9a !important; -webkit-text-fill-color: #f6dc9a; }
body[data-dh] .pc-out td small, body[data-dh] .pc-out td span, body[data-dh] .form td small, body[data-dh] .form td span { color: #6b6358 !important; -webkit-text-fill-color: #6b6358; }
body[data-dh] .op-sec .kp-card a.kp-img:hover, body[data-dh] .op-sec .kp-card a.kp-img:hover * { background-color: #fff !important; border-color: var(--dh-gold) !important; color: inherit !important; -webkit-text-fill-color: currentColor !important; }
body[data-dh] .op-sec .kp-card a.kp-img:hover span { background-color: rgba(0, 0, 0, .62) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; }
body[data-dh] .op-sec .kp-card .kp-r { transition: box-shadow .35s ease, transform .35s ease; }
body[data-dh] .op-sec .kp-card .kp-r:hover { box-shadow: 0 0 0 1px var(--dh-gold) inset, 0 0 24px var(--dh-glow); }
/* 10-16 주인 "앞전에 롤오버 효과 이뻤어": 예전 카드 효과(살짝 떠오름·금색 테두리·금빛 번짐·금빛 바탕)를 오른쪽(금액 쪽)에만 */
body[data-dh] .op-sec .kp-card .kp-r { border: 1px solid transparent; transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease, background-color .35s ease; }
body[data-dh] .op-sec .kp-card .kp-r:hover { transform: translateY(-4px); border-color: var(--dh-gold) !important; background-color: rgba(227, 194, 122, .14) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .45), 0 0 24px var(--dh-glow) !important; }
/* 10-16 주인 "위로 올리지말고 빛만 은은하게 · 안쪽으로 살짝": 맞춤견적 오른쪽 롤오버 — 떠오름 없음, 안쪽으로 옅은 금빛 */
body[data-dh] .op-sec .kp-card .kp-r:hover { transform: none !important; border-color: rgba(227, 194, 122, .55) !important; background-color: rgba(227, 194, 122, .05) !important;
  box-shadow: inset 0 0 26px rgba(227, 194, 122, .16) !important; }
/* 10-16 주인 "가운데까지 밝게 하지말고 가장자리에서 30%정도만 은은하게": 가운데는 그대로, 바깥 30% 띠에만 옅은 금빛 */
body[data-dh] .op-sec .kp-card .kp-r:hover { background-color: transparent !important; box-shadow: none !important;
  background-image: radial-gradient(ellipse at center, rgba(227, 194, 122, 0) 0%, rgba(227, 194, 122, 0) 58%, rgba(227, 194, 122, .07) 82%, rgba(227, 194, 122, .14) 100%) !important; }
/* 10-16 주인 "글씨색이 너무 연해": 흰 바탕 계산기·도구(hs-tool) 입력칸 글씨가 #e3ddcf 로 거의 안 보이던 것 → 진하게 */
body[data-dh] .hs-tool input, body[data-dh] .hs-tool select, body[data-dh] .hs-tool textarea { color: #2a241b !important; -webkit-text-fill-color: #2a241b !important; }
body[data-dh] .hs-tool input::placeholder, body[data-dh] .hs-tool textarea::placeholder { color: #8a8378 !important; -webkit-text-fill-color: #8a8378 !important; }
body[data-dh] form.op-form :is(input:not([type=checkbox]):not([type=radio]), select, textarea), body[data-dh] form.reg-form :is(input:not([type=checkbox]):not([type=radio]), select, textarea),
body[data-dh] .sub-content .hs-tool :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { background: rgba(255, 255, 255, .06) !important; border: 1px solid rgba(227, 194, 122, .35) !important; color: #f3ecdc !important; -webkit-text-fill-color: #f3ecdc !important; }
body[data-dh] form.op-form select option, body[data-dh] form.reg-form select option, body[data-dh] .sub-content .hs-tool select option { background: #1b1720; color: #f3ecdc; }
body[data-dh] form :is(input, textarea)::placeholder, body[data-dh] .hs-tool :is(input, textarea)::placeholder { color: #9a9282 !important; -webkit-text-fill-color: #9a9282 !important; }
body[data-dh] .ccalc select option { background: #1b1720; color: #f3ecdc; }

/* ======================== 11. 칼럼·DHOME 글·갤러리 — 홍보칼럼·분석 노트·갤러리 ======================== */
/* ---- DHOME 분양 분석 노트 · 새 질문·답 (dhome 전용 글, 2026-10-16) ---- */
body[data-dh] .dh-ana .op-lead { max-width: 820px; }
.dh-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 26px 0 30px; }
.dh-cards > div { padding: 16px 18px; border: 1px solid var(--dh-line); border-radius: 14px; background: rgba(255, 255, 255, .05); }
.dh-cards span { display: block; font-size: 12px; letter-spacing: .08em; color: var(--dh-gold) !important; margin-bottom: 4px; }
.dh-cards b { display: block; font-size: 19px; color: #fff4d6 !important; font-weight: 800; }
.dh-paras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.dh-p { padding: 20px 22px; border: 1px solid var(--dh-line); border-radius: 14px; background: rgba(255, 255, 255, .045); }
.dh-p h3, .dh-chk h3 { margin: 0 0 8px; font-size: 17px; color: #f6dc9a !important; }
.dh-p p { margin: 0; font-size: 15px; line-height: 1.8; color: #ebe5d8 !important; }
.dh-chk { margin-top: 18px; padding: 20px 22px; border-radius: 14px; border: 1px dashed var(--dh-line); }
.dh-chk ul { margin: 0; padding-left: 18px; }
.dh-chk li { margin: 4px 0; color: #ebe5d8 !important; }
.dh-src { margin: 14px 0 0; font-size: 12.5px; color: #b9b2a3 !important; }
.dh-faq { display: grid; gap: 10px; margin-top: 22px; }
.dh-faq details { border: 1px solid var(--dh-line); border-radius: 12px; background: rgba(255, 255, 255, .05); padding: 0 18px; }
.dh-faq summary { cursor: pointer; padding: 16px 0; font-weight: 700; color: #f3ead6 !important; list-style: none; position: relative; padding-right: 28px; }
.dh-faq summary::-webkit-details-marker { display: none; }
.dh-faq summary::after { content: "+"; position: absolute; right: 0; top: 13px; font-size: 20px; color: var(--dh-gold); }
.dh-faq details[open] summary::after { content: "–"; }
.dh-faq details p { margin: 0 0 16px; line-height: 1.8; color: #ebe5d8 !important; }
@media (max-width: 760px) {
  .dh-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dh-paras { grid-template-columns: 1fr; }
  .dh-cards b { font-size: 16px; }
}
/* ---- 하위 쪽 DHOME 해설 ---- */
.dh-sub { max-width: var(--maxw, 1100px); margin: 6px auto 34px; padding: 22px 26px; border: 1px solid var(--dh-line); border-radius: 16px;
  background: linear-gradient(135deg, rgba(227, 194, 122, .10), rgba(255, 255, 255, .03)); text-align: left; }
.dh-sub-k { margin: 0 0 4px; font-size: 12px; letter-spacing: .24em; color: var(--dh-gold) !important; }
.dh-sub p { margin: 0 0 8px; font-size: 15px; line-height: 1.8; color: #ebe5d8 !important; }
@media (max-width: 760px) {
  .dh-sub { margin: 4px 16px 26px; padding: 18px; }
}
/* ---- 주변 생활 시설 요약 표 · 입지 목록 주석 ---- */
.dh-around { margin: 18px 0 0; text-align: left; }
.dh-around p { margin: 0 0 14px; color: #ebe5d8 !important; }
.dh-around table { width: 100%; border-collapse: collapse; }
.dh-around th, .dh-around td { padding: 11px 12px; border-bottom: 1px solid var(--dh-line); text-align: left; font-size: 14.5px; color: #ebe5d8 !important; vertical-align: top; }
.dh-around thead th { color: var(--dh-gold) !important; font-weight: 700; }
.dh-around tbody th { color: #f6dc9a !important; white-space: nowrap; }
.dh-dl-n { font-size: 12px; color: #b9b2a3 !important; }
@media (max-width: 600px) {
  .dh-around th, .dh-around td { padding: 9px 6px; font-size: 13.5px; }
}
/* ---- 타입별 납부 금액 표 ---- */
.dh-paytb { margin-top: 16px; overflow-x: auto; }
.dh-paytb h3 { margin: 0 0 8px; font-size: 16px; color: #f6dc9a !important; }
.dh-paytb table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 14px; }
.dh-paytb th, .dh-paytb td { padding: 9px 8px; border-bottom: 1px solid var(--dh-line); text-align: left; color: #ebe5d8 !important; white-space: nowrap; }
.dh-paytb thead th { color: var(--dh-gold) !important; }
.dh-paytb-n { margin: 8px 0 0 !important; font-size: 12.5px !important; color: #b9b2a3 !important; }
body[data-dh] .k-col .info-table th, body[data-dh] .k-col .info-table td { border-color: rgba(227, 194, 122, .22) !important; background: transparent !important; }
body[data-dh] .k-col .info-table thead th { background: rgba(227, 194, 122, .18) !important; color: #fff4d6 !important; }
body[data-dh] .k-col-more { border-top-color: rgba(227, 194, 122, .28) !important; }
body[data-dh] .op-sec .dh-cards > div { transition: border-color .3s ease, background-color .3s ease, box-shadow .3s ease; }
body[data-dh] .op-sec .dh-cards > div:hover { background-color: rgba(227, 194, 122, .14) !important; border-color: var(--dh-gold) !important; box-shadow: 0 0 18px var(--dh-glow); }
/* 6. 갤러리 사진 제목만 명조 → 다른 카드처럼 고딕 */
body[data-dh] .gal-cap strong, body[data-dh] .gal-cap span, body[data-dh] .gal-grid figcaption { font-family: "Pretendard Variable", Pretendard, -apple-system, "Malgun Gothic", sans-serif !important; }

/* ======================== 12. 바닥글 — 아래 전체 메뉴·바닥글 ======================== */
/* ---- 바닥글 ---- */
body[data-dh] .site-footer, body[data-dh] footer { background: #070a15 !important; color: #b9b2a3 !important; border-top: 1px solid var(--dh-line); }
body[data-dh] .seo-links { border-top-color: var(--dh-line) !important; }
body[data-dh] nav.seo-links { background: var(--dh-b7) !important; }
body[data-dh] footer.site-footer { background: color-mix(in srgb, var(--dh-b7) 72%, #000) !important; }

/* ======================== 13. 단지별 따로 — 특정 단지에만 걸리는 값 ======================== */
/* 첫 화면 글씨 색: 단지 테마색의 색상은 두고 채도·밝기만 달리 (2026-10-16 주인 "테마색으로 채도 달리해서") */
body[data-dh="championscity"] .op-hero-copy .hc-tit::first-line { color: hsl(13 82% 76%); }
body[data-dh="hanyanglips"] .op-hero-copy .hc-tit::first-line { color: hsl(143 82% 76%); }
body[data-dh="hillstate"] .op-hero-copy .hc-tit::first-line { color: hsl(356 82% 76%); }
body[data-dh="hobansummit"] .op-hero-copy .hc-tit::first-line { color: hsl(14 82% 76%); }
body[data-dh="iparkmudeung"] .op-hero-copy .hc-tit::first-line { color: hsl(210 82% 76%); }
body[data-dh="jeilpunggyeong"] .op-hero-copy .hc-tit::first-line { color: hsl(44 82% 76%); }
body[data-dh="lottecastle"] .op-hero-copy .hc-tit::first-line { color: hsl(348 82% 76%); }
body[data-dh="lumitrie"] .op-hero-copy .hc-tit::first-line { color: hsl(215 82% 76%); }
body[data-dh="seungwon"] .op-hero-copy .hc-tit::first-line { color: hsl(177 82% 76%); }
body[data-dh="skview"] .op-hero-copy .hc-tit::first-line { color: hsl(351 82% 76%); }
body[data-dh="theliv"] .op-hero-copy .hc-tit::first-line { color: hsl(209 82% 76%); }
body[data-dh="viterra"] .op-hero-copy .hc-tit::first-line { color: hsl(235 82% 76%); }
body[data-dh="wepark"] .op-hero-copy .hc-tit::first-line { color: hsl(217 82% 76%); }
@media (min-width: 769px) {
  /* 힐스테이트: 원래 PC 첫 화면은 사진에 글자가 박혀 HTML 문구를 숨겼다 → dhome 은 글자 없는 사진이라 PC 에도 문구를 보인다 */
  body[data-dh="hillstate"] .op-hero-copy { display: block !important; position: absolute; z-index: 3; top: 4.6vw; left: max(24px, calc(50vw - 600px)); transform: none; max-width: 46vw; text-align: left; pointer-events: none; }
  body[data-dh="hillstate"] .op-hero-copy .hc-chip { font-size: clamp(13px, 1.05vw, 17px); }
  body[data-dh="hillstate"] .op-hero-copy .hc-tit { font-size: clamp(40px, 4.1vw, 66px); line-height: 1.18; margin: 16px 0 18px !important; }
  body[data-dh="hillstate"] .op-hero-copy .hc-sub { display: inline-block; font-size: clamp(15px, 1.25vw, 20px); padding: 9px 16px; }
  body[data-dh="hillstate"] .op-hero-copy .hc-notice { display: none !important; }
}
/* 바탕이 들어 있는 SVG 로고(진도·아이파크·루미): 흰 실루엣으로 하면 상자가 됨 → 반전 후 screen 섞기로 글자만 밝게, 바탕은 어두운 머리글에 묻힘 */
body[data-dh="seungwon"] .site-header .logo img, body[data-dh="iparkmudeung"] .site-header .logo img, body[data-dh="lumitrie"] .site-header .logo img { filter: grayscale(1) invert(1) brightness(1.1) !important; mix-blend-mode: screen; }
@media (min-width: 769px) {
  body[data-dh="hillstate"] .op-hero .op-hero-copy .hc-chip { font-size: clamp(15px, 1.25vw, 20px) !important; }
}

/* ======================== 14. 기타 — 어느 부품에도 속하지 않는 것 ======================== */
@media (prefers-reduced-motion: reduce) {
  /* 움직임 줄이기 설정을 켠 사람에게는 반짝임을 멈춘다 */
  body[data-dh] *, body[data-dh] *::after { animation: none !important; transition: none !important; }
}
/* 2026-10-16: 계산기 쪽 아래 버튼 묶음(div.k-more)에 구역용 붉은 배경이 깔려 흰 버튼 뒤로 비치던 것 → 배경 없음 */
body[data-dh] div.k-more { background: none !important; box-shadow: none !important; }
@media (max-width: 1024px) {
  /* ===== 10-16 에이전트 검수 7가지 (주인 "1~7") ===== */
  /* 1. 휴대폰: 떠 있는 '공유'·'↑%' 버튼이 표·탭 끝을 가림 → 공유는 휴대폰에서 숨김(아래 막대·브라우저 공유로 대신), 맨 위로는 작게 + 화면을 내리는 동안만 */
  body[data-dh] .hs-share-m { display: none !important; }
  body[data-dh] .hs-backtop.dh-show { opacity: .92; pointer-events: auto; }
  body[data-dh] .hs-backtop .hs-bt-count { font-size: 10px !important; }
}


/* ################################ 제2판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 2. 머리글·메뉴 — 머리글·PC 메뉴·휴대폰 메뉴·하위 탭 메뉴(lnb)·쪽 제목 ======================== */
/* ---- 제목: 금빛 그라데이션 글자 + 반짝임 ---- */
body[data-dh] .op-sec h2,
body[data-dh] .op-sec .op-tit,
body[data-dh] .op-sec .sec-tit,
body[data-dh] .sub-content h2,
body[data-dh] .page-tit,
body[data-dh] .sub-visual h1,
body[data-dh] .sub-visual h2 { background: var(--dh-grad);
  background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent !important;
  animation: dhShine 7s linear infinite;
  text-shadow: none !important; }
body[data-dh] .lnb a, body[data-dh] .sub-tab a { color: #d9d4c8 !important; }
body[data-dh] .lnb a[aria-current], body[data-dh] .lnb .on a, body[data-dh] .lnb a.on, body[data-dh] .sub-tab a.on { color: #1b1405 !important; background: var(--dh-grad) !important; }

/* ======================== 3. 첫 화면 — 사진·큰 제목·칩·부제 ======================== */
/* 10-16 주인 "글씨가 너무 작아": 첫 화면 칩·아래 줄 같이 키움 (같은 크기 유지) */
body[data-dh] .op-hero .op-hero-copy .hc-chip, body[data-dh] .op-hero .op-hero-copy .hc-sub { font-size: 15px !important; }
@media (min-width: 769px) {
  body[data-dh] .op-hero .op-hero-copy .hc-chip, body[data-dh] .op-hero .op-hero-copy .hc-sub { font-size: 17px !important; }
}

/* ======================== 4. 글씨·제목 — 본문·제목 색과 금빛 글자 ======================== */
body[data-dh] .op-sec h3,
body[data-dh] .op-sec h4,
body[data-dh] .op-sec strong,
body[data-dh] .op-sec b { color: #f3ead6 !important; }

/* ======================== 5. 카드·상자 — 유리 카드·네 칸·맞춤견적 카드 ======================== */
body[data-dh] .op-cards li.op-card-cta p { color: #d9d4c8 !important; -webkit-text-fill-color: #d9d4c8 !important; }

/* ======================== 6. 표 — 사업 개요 표·하위 쪽 표·평면 표 ======================== */
/* ---- 카드·표: 유리 + 금빛 테두리 + 떠오름 ---- */
body[data-dh] .op-sec [class*="card"],
body[data-dh] .op-sec [class*="item"],
body[data-dh] .op-sec [class*="box"],
body[data-dh] .op-sec details,
body[data-dh] .op-sec table,
body[data-dh] .sub-content [class*="card"],
body[data-dh] .sub-content table { background: var(--dh-glass) !important;
  border: 1px solid var(--dh-line) !important;
  border-radius: 14px !important;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .06);
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease; }
body[data-dh] .sub-content p, body[data-dh] .sub-content li, body[data-dh] .sub-content td { color: #d9d4c8 !important; }

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
/* ---- 마우스를 올렸을 때(롤오버): 밝은 판 대신 금빛이 비치는 어두운 판 + 밝은 글씨 (2026-10-16) ---- */
body[data-dh] .op-sec a:not([class*="btn"]):hover,
body[data-dh] .op-docs a:hover, body[data-dh] .op-docs li:hover,
body[data-dh] .op-sec [class*="item"]:hover, body[data-dh] .op-sec [class*="card"]:hover { background-color: rgba(227, 194, 122, .14) !important; background-image: none !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
/* 흰 판 위 금빛 그라데이션 제목 → 진한 금색 한 색 */
body[data-dh] .addr-list li h2, body[data-dh] .prem-list li h2, body[data-dh] .hs-tool > h2 { background: none !important; color: #7a5a1c !important; -webkit-text-fill-color: #7a5a1c !important; animation: none !important; }
body[data-dh] .sub-content section.hs-tool > h2, body[data-dh] section.hs-tool > h2 { background: none !important; color: #7a5a1c !important; -webkit-text-fill-color: #7a5a1c !important; animation: none !important; }
/* 10-16 주인 "롤오버시 오른쪽 부분만 효과": 맞춤견적 카드 전체가 들뜨고 빛나던 것 → 오른쪽(금액 쪽)만 */
body[data-dh] .op-sec .kp-card:hover { transform: none !important; border-color: var(--dh-line) !important; box-shadow: 0 10px 30px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .06) !important; background-color: rgba(255, 255, 255, .06) !important; }
body[data-dh] .ccalc .pc-out :is(hr, li, [class*="row"]) { border-color: rgba(227, 194, 122, .15) !important; }

/* ======================== 11. 칼럼·DHOME 글·갤러리 — 홍보칼럼·분석 노트·갤러리 ======================== */
.dh-sub h2 { margin: 0 0 10px; font-size: 20px; color: #fff4d6 !important; -webkit-text-fill-color: #fff4d6; background: none !important; animation: none !important; }
@media (max-width: 760px) {
  .dh-sub h2 { font-size: 18px; }
}
.dh-around h2 { margin: 0 0 8px; font-size: 22px; color: #fff4d6 !important; -webkit-text-fill-color: #fff4d6; background: none !important; animation: none !important; }
/* 갤러리 사진 제목·날짜 — 어두운 바탕 위 밝은 글씨 */
body[data-dh] .gal-cap strong { color: #f3ead6 !important; -webkit-text-fill-color: #f3ead6; }
body[data-dh] .k-col .kc-box { background: rgba(255, 255, 255, .05) !important; }
body[data-dh] .k-col .kc-cta { border-color: rgba(227, 194, 122, .55) !important; background: rgba(13, 16, 34, .5); }
/* 10-16 주인 "효과 한칸씩": 네 칸 묶음(dh-cards) 전체에 걸리던 롤오버(누름) 효과 → 묶음은 그대로, 칸 하나씩만 */
body[data-dh] .op-sec .dh-cards:hover { background: none !important; border-color: transparent !important; box-shadow: none !important; transform: none !important; }

/* ======================== 12. 바닥글 — 아래 전체 메뉴·바닥글 ======================== */
body[data-dh] .site-footer a, body[data-dh] footer a { color: #e3c27a !important; }
body[data-dh] .seo-links b { color: #f3ead6 !important; border-bottom-color: var(--dh-line) !important; }
body[data-dh] .seo-links a { color: #cfc6b3 !important; }

/* ======================== 13. 단지별 따로 — 특정 단지에만 걸리는 값 ======================== */
@media (min-width: 769px) {
  body[data-dh="hillstate"] .op-hero .op-hero-copy .hc-chip, body[data-dh="hillstate"] .op-hero .op-hero-copy .hc-sub { font-size: clamp(16px, 1.3vw, 21px) !important; }
}


/* ################################ 제3판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 2. 머리글·메뉴 — 머리글·PC 메뉴·휴대폰 메뉴·하위 탭 메뉴(lnb)·쪽 제목 ======================== */
/* 2026-10-16 주인 "다크버전은 사진·문구·메뉴디자인을 다르게": dhome 전용 어두운 머리글 (원래 사이트는 흰 머리글) */
body[data-dh] .site-header, body[data-dh] .site-header::before, body[data-dh] .site-header .gnb-bg { background: #0d1022 !important; }
body[data-dh] .site-header .hd-reg:hover { background: #e3c27a !important; color: #1b1405 !important; }

/* ======================== 4. 글씨·제목 — 본문·제목 색과 금빛 글자 ======================== */
body[data-dh] .op-tit b { color: #ffe9b0 !important; -webkit-text-fill-color: #ffe9b0; }

/* ======================== 5. 카드·상자 — 유리 카드·네 칸·맞춤견적 카드 ======================== */
body[data-dh] .op-sec .op-more a:hover { background: rgba(227, 194, 122, .12) !important; border-color: #e3c27a !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
body[data-dh] .k-mc p, body[data-dh] .k-mc h3, body[data-dh] .k-mc span, body[data-dh] .k-mc li, body[data-dh] .kp-card p, body[data-dh] .kp-card h3, body[data-dh] .kp-card span:not(.kp-img span), body[data-dh] .kp-card li, body[data-dh] .kp-card b, body[data-dh] .kp-card dt, body[data-dh] .kp-card dd,
body[data-dh] .kp-bars *, body[data-dh] .kp-loan * { color: #ece5d6 !important; -webkit-text-fill-color: currentColor; background-color: transparent; }
body[data-dh] .k-mc-maps a { background: rgba(255, 255, 255, .06) !important; border: 1px solid rgba(227, 194, 122, .5) !important; color: #f6dc9a !important; }
body[data-dh] form.op-form *, body[data-dh] form.reg-form *, body[data-dh] .sub-content .hs-tool *, body[data-dh] .sub-content .hs-check * { background-color: transparent; }
body[data-dh] .ccalc form * { background-color: transparent; }

/* ======================== 11. 칼럼·DHOME 글·갤러리 — 홍보칼럼·분석 노트·갤러리 ======================== */
/* 10-16 홍보칼럼(column.html) 다크판 */
body[data-dh] .k-col { color: #e6e0d3 !important; }
body[data-dh] .k-col-meta { color: var(--dh-gold, #e3c27a) !important; letter-spacing: .14em; }
body[data-dh] .k-col-h { color: #fff4d6 !important; -webkit-text-fill-color: #fff4d6; background: none !important; }
/* 10-16 주인 "빛 효과 빼줘" → "기존효과 똑같이 · 파장일어나는거": 동의 '보기' 단추는 다른 단추와 같은 효과(금빛·누르면 남색·파장 고리)를 두고, 위를 지나가는 광택만 뺌 */
/* 10-16 홍보칼럼 5편 목록·다른 칼럼 (다크판) */
body[data-dh] .k-col-intro { color: #cfc7b6 !important; }
body[data-dh] .k-col-list a { background: rgba(255, 255, 255, .04) !important; border-color: rgba(227, 194, 122, .28) !important; }
body[data-dh] .k-cl-n { color: var(--dh-gold, #e3c27a) !important; }
body[data-dh] .k-cl-d { color: #b9b2a3 !important; }
body[data-dh] .k-col-more-h { color: #fff4d6 !important; }
body[data-dh] .k-col-more a { color: #f3dfa8 !important; }


/* ################################ 제4판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 4. 글씨·제목 — 본문·제목 색과 금빛 글자 ======================== */
body[data-dh] .op-lead, body[data-dh] .op-sub, body[data-dh] .op-desc, body[data-dh] .op-sec .op-lead, body[data-dh] .op-sec [class$="-lead"], body[data-dh] .op-sec [class$="-sub"] { color: #f6f0e3 !important; opacity: 1 !important; }

/* ======================== 6. 표 — 사업 개요 표·하위 쪽 표·평면 표 ======================== */
/* ---- 본문·소제목 글씨 조금 더 밝게 ---- */
body[data-dh] .op-sec p, body[data-dh] .op-sec li, body[data-dh] .op-sec dd, body[data-dh] .op-sec td, body[data-dh] .seo-sum p { color: #ebe5d8 !important; }

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
body[data-dh] .k-mc a:not([class*="btn"]), body[data-dh] .k-mc-go { color: #f6dc9a !important; }
body[data-dh] .op-sec a:not([class*="btn"]):hover, body[data-dh] .op-sec a:not([class*="btn"]):hover *,
body[data-dh] .op-docs a:hover *, body[data-dh] .op-docs li:hover * { color: #fff4d6 !important; -webkit-text-fill-color: #fff4d6; }
body[data-dh] .ccalc :is(button, [type=submit]) { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
body[data-dh] .op-chips input:checked + span, body[data-dh] .chips input:checked + span, body[data-dh] .op-chip input:checked + span { background: #2a1f12 !important; border-color: #e3c27a !important; color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
body[data-dh] .kp-l .kp-pl-note { color: #5a4f3e !important; -webkit-text-fill-color: #5a4f3e !important; }
body[data-dh] .op-tabs button.on, body[data-dh] .op-tabs button[aria-selected="true"] { background: #e3c27a !important; border-color: #e3c27a !important; color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; font-weight: 700 !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
/* 흰 판 안의 표 값 칸은 진한 글씨 */
body[data-dh] .pc-out td, body[data-dh] .form td, body[data-dh] .ccalc td { color: #2a241b !important; -webkit-text-fill-color: #2a241b; background: #fff !important; }
body[data-dh] .ar-card button, body[data-dh] .ar-card .ar-n { color: #ece5d6 !important; }
body[data-dh] .ar-card .ar-d { color: #c9bfa8 !important; }

/* ======================== 11. 칼럼·DHOME 글·갤러리 — 홍보칼럼·분석 노트·갤러리 ======================== */
body[data-dh] .k-col .k-src, body[data-dh] .k-col span[style*="#888"] { color: #b9b2a3 !important; }


/* ################################ 제5판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 2. 머리글·메뉴 — 머리글·PC 메뉴·휴대폰 메뉴·하위 탭 메뉴(lnb)·쪽 제목 ======================== */
/* ---- 휴대폰 메뉴 버튼(≡/✕): 금빛 버튼 효과에서 빼고 원래 모양 (2026-10-16) ---- */
body[data-dh] button.menu-btn[class], body[data-dh] button.menu-btn[class]:hover, body[data-dh] button.menu-btn[class]:active, body[data-dh] button.menu-btn[class]:focus, body[data-dh] .menu-btn, body[data-dh] .menu-btn:hover { background: transparent none !important; box-shadow: none !important; border: 0 !important; transform: none !important; animation: none !important; color: inherit !important; }
/* 2026-10-16: 쪽 옮길 때 제목(BUSINESS·단지명·사업개요)이 잠깐 어두운 글씨로 떴다가 밝아지며 어긋나 보이던 것 → 처음부터 밝은 글씨 */
body[data-dh] .page-title .en, body[data-dh] .page-title h1, body[data-dh] .page-title .pt-brand { color: #f3ead6 !important; }
body[data-dh] .page-title .en { color: #e3c27a !important; }
body[data-dh] .quick .q-top { color: #f3ead6 !important; }
/* 2026-10-16: 글씨색 — 예전엔 쪽이 뜬 뒤 프로그램이 글자마다 바탕을 보고 바꿨던 자리(휴대폰·PC 266쪽에서 뽑음)를 처음부터 맞는 색으로. 프로그램은 껐다 */
/* 어두운 바탕 위 → 밝은 글씨 */
body[data-dh] .page-title .en, body[data-dh] .op-wrap .op-en, body[data-dh] .op-wrap > div .op-en, body[data-dh] .op-wrap .kp-lead,
body[data-dh] .ccalc .faq details summary, body[data-dh] .k-pr-meta b, body[data-dh] .op-checks li, body[data-dh] .notice-box .js-tel-num,
body[data-dh] figure figcaption b, body[data-dh] .map-btns a.map-n { color: #f3ead6 !important; }
body[data-dh] .page-title .en, body[data-dh] .op-wrap .op-en { color: #e3c27a !important; }
@media (max-width: 1024px) {
  body[data-dh] .op-sec h2, body[data-dh] .op-sec .op-tit, body[data-dh] .op-sec .sec-tit, body[data-dh] .sub-content h2, body[data-dh] .page-tit, body[data-dh] .sub-visual h1, body[data-dh] .sub-visual h2 { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; -webkit-text-fill-color: #f3dc9e !important; color: #f3dc9e !important; animation: none !important; }
}
body[data-dh] .site-header .hd-tel { color: #e3c27a !important; }
body[data-dh] .site-header .hd-reg { background: transparent !important; border: 1px solid #e3c27a !important; color: #e3c27a !important; border-radius: 999px !important; }

/* ======================== 3. 첫 화면 — 사진·큰 제목·칩·부제 ======================== */
/* 흰 판(입력칸·약관·표·카드·비교표) 위 → 진한 글씨 */
body[data-dh] form li > label > span, body[data-dh] .hs-check li > label > span, body[data-dh] .hc-col dl dd, body[data-dh] .hc-col h3, body[data-dh] .agree-box .terms p, body[data-dh] .agree-box .terms p b,
body[data-dh] .ccalc form.form .note-s, body[data-dh] .ht-ptable td.n, body[data-dh] .ht-ptable td b, body[data-dh] tbody td > b,
body[data-dh] .hs-tool h3, body[data-dh] .hs-tool .lead, body[data-dh] .hs-tool .ht-note, body[data-dh] .hs-tool .ht-range, body[data-dh] .hs-tool .ht-sub, body[data-dh] .hc-pick span,
body[data-dh] .addr-list li p, body[data-dh] .k-vis li p, body[data-dh] .prem-list li p,
body[data-dh] .op-cards li h3, body[data-dh] .op-cards li p, body[data-dh] .op-cards li .k,
body[data-dh] .op-form .op-opt-tit, body[data-dh] .op-form .op-note, body[data-dh] .doc-list a b, body[data-dh] .hb-kp b { color: #2a241b !important; -webkit-text-fill-color: #2a241b; }
body[data-dh] .op-hero-copy .hc-chip { color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; background: none !important; border: 0 !important; letter-spacing: .14em; text-shadow: 0 1px 10px rgba(0, 0, 0, .6); }
body[data-dh] .op-hero-copy .hc-tit { font-family: "Pretendard Variable", Pretendard, "Noto Sans KR", system-ui, sans-serif !important; font-weight: 800 !important; letter-spacing: -.02em; color: #fff !important; -webkit-text-fill-color: currentColor !important; background: none !important; text-shadow: 0 2px 22px rgba(0, 0, 0, .6); }
body[data-dh] .op-hero-copy .hc-tit * { color: inherit !important; -webkit-text-fill-color: currentColor !important; }
body[data-dh] .op-hero-copy .hc-chip { display: inline-block; padding: 7px 16px !important; border-radius: 999px !important; background: rgba(13, 16, 34, .6) !important; }
/* 10-16 주인 "명조체로": 다크판 첫 화면 큰 제목 → 나눔명조 700 (이미 받아 둔 굵기만 — 800 은 글자별 늦은 로딩으로 굵기 섞임) */
body[data-dh] .op-hero-copy .hc-tit, body[data-dh] .op-hero-copy .hc-tit .dh-l1 { font-family: "Nanum Myeongjo", "Noto Serif KR", "Batang", serif !important; font-weight: 700 !important; letter-spacing: -.01em !important; }
/* 10-16 주인 "이부분 진짜 고급지게 · 저 글씨가 전체 디자인을 망치는 느낌": 첫 화면 큰 제목 — 검정 테두리·진한 그림자 없앰, 첫 줄은 테마색이 살짝 밴 샴페인 골드, 둘째 줄 아이보리 */
body[data-dh] .op-hero-copy .hc-tit, body[data-dh] .op-hero-copy .hc-tit .dh-l1 { -webkit-text-stroke: 0 !important; text-shadow: 0 2px 28px rgba(8, 10, 22, .55), 0 1px 3px rgba(8, 10, 22, .45) !important; letter-spacing: .01em !important; }
body[data-dh] .op-hero-copy .hc-tit { color: #f7f2e8 !important; -webkit-text-fill-color: #f7f2e8 !important; }

/* ======================== 4. 글씨·제목 — 본문·제목 색과 금빛 글자 ======================== */
/* 제목 강조 글자(b)는 어두운 바탕 위 밝은 금색 */
body[data-dh] .op-tit b { color: #ffe9b0 !important; -webkit-text-fill-color: #ffe9b0 !important; }
@media (max-width: 1024px) {
  body[data-dh] .op-sec p, body[data-dh] .op-sec li { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; -webkit-text-fill-color: currentColor !important; color: #ebe5d8 !important; animation: none !important; }
  body[data-dh] .op-tit b { -webkit-text-fill-color: #ffe9b0 !important; color: #ffe9b0 !important; }
}
body[data-dh] .k-remn h3 { color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; }

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
body[data-dh] .map-btns a.map-n { color: #fff !important; -webkit-text-fill-color: #fff !important; }
/* 검수 보충: 금색 단추 안 하얀 '›' 화살표 → 글씨와 같은 진한 색, '(선택)' 뒤 어두운 사각형 제거 */
body[data-dh] form :is(button, [type=submit])[class] span, body[data-dh] form :is(button, [type=submit])::after, body[data-dh] .op-sec :is(a, button)[class*="btn"] span[aria-hidden], body[data-dh] form button span[aria-hidden] { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
body[data-dh] .kp-l .kp-pl button:not([aria-pressed="true"]) { background: #fff !important; color: #3a3328 !important; -webkit-text-fill-color: #3a3328 !important; border: 1px solid #ddd2bb !important; }
/* 10-16 주인 "선택된 박스가 너무 어두워": 평형 탭(op-tabs) 선택 칸 → 금색 바탕·진한 글씨, 나머지 칸 글씨도 밝게 */
body[data-dh] .op-tabs button { color: #d9cfbb !important; -webkit-text-fill-color: #d9cfbb !important; border-color: rgba(227, 194, 122, .45) !important; background: rgba(255, 255, 255, .03) !important; }
body[data-dh] form .op-chips button, body[data-dh] form label > input + span { color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }

/* ======================== 9. 입력 폼 — 관심고객 등록·상담 폼·동의·입력칸 ======================== */
body[data-dh] .op-terms b, body[data-dh] .op-terms strong { color: #7a5a1c !important; -webkit-text-fill-color: #7a5a1c !important; background: none !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
@media (max-width: 1024px) {
  /* 2026-10-16: 휴대폰에서 화려한 판만 느리던 것 — 카드마다 걸린 유리 흐림(backdrop-filter)과 계속 도는 반짝임(제목·버튼)이 화면 그리기를 무겁게 함 → 휴대폰에서는 멈춘 그림으로 */
  body[data-dh] .op-sec [class*="card"], body[data-dh] .op-sec [class*="item"], body[data-dh] .op-sec [class*="box"], body[data-dh] .op-sec details, body[data-dh] .op-sec table, body[data-dh] .sub-content [class*="card"], body[data-dh] .sub-content table, body[data-dh] .k-mc, body[data-dh] .kp-card, body[data-dh] .kp-bars, body[data-dh] .kp-loan, body[data-dh] .kp-rows { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; transition: none !important; }
}
body[data-dh] .ar-card .ar-h b { color: #f3e3b8 !important; }
body[data-dh] .ar-card .ar-h span { color: #e3c27a !important; }
body[data-dh] .kp-card .kp-r small, body[data-dh] .kp-card .kp-num small { color: #d4c9b2 !important; -webkit-text-fill-color: #d4c9b2 !important; }
/* 4. 어두운 화면 속 큰 흰 박스(상담 폼·등록 폼·계산기·서류 체크) → 어두운 카드 + 금색 테두리 */
body[data-dh] form.op-form, body[data-dh] form.reg-form, body[data-dh] .sub-content .hs-tool, body[data-dh] .sub-content .hs-check { background: rgba(255, 255, 255, .04) !important; border: 1px solid rgba(227, 194, 122, .3) !important; box-shadow: none !important; }

/* ======================== 11. 칼럼·DHOME 글·갤러리 — 홍보칼럼·분석 노트·갤러리 ======================== */
body[data-dh] .gal-cap span { color: #e3c27a !important; }
body[data-dh] .k-col h2 { color: var(--dh-gold, #e3c27a) !important; -webkit-text-fill-color: var(--dh-gold, #e3c27a); background: none !important; border-bottom-color: var(--dh-line, rgba(227, 194, 122, .3)) !important; }
body[data-dh] .k-col b { color: #fff !important; }
body[data-dh] .k-col .info-table th { background: rgba(255, 255, 255, .06) !important; color: #f3dfa8 !important; }
body[data-dh] .k-col .kc-more a, body[data-dh] .k-col .kc-cta a { color: #f3dfa8 !important; }
body[data-dh] .k-col-list strong { color: #fff4d6 !important; }
/* 10-16 주인 "따로따로": 지역·규모·분양가·입주 네 칸을 감싸던 바깥 테두리·바탕 없앰 — 칸만 따로 */
body[data-dh] .op-sec .dh-cards { border: 0 !important; background: none !important; box-shadow: none !important; padding: 0 !important; }

/* ======================== 13. 단지별 따로 — 특정 단지에만 걸리는 값 ======================== */
body[data-dh="championscity"] .op-hero-copy .hc-chip, body[data-dh="championscity"] .op-hero-copy .hc-chip::before, body[data-dh="championscity"] .op-hero-copy .hc-chip::after { color: hsl(13 42% 80%) !important; -webkit-text-fill-color: hsl(13 42% 80%) !important; }
body[data-dh="hanyanglips"] .op-hero-copy .hc-chip, body[data-dh="hanyanglips"] .op-hero-copy .hc-chip::before, body[data-dh="hanyanglips"] .op-hero-copy .hc-chip::after { color: hsl(143 42% 80%) !important; -webkit-text-fill-color: hsl(143 42% 80%) !important; }
body[data-dh="hillstate"] .op-hero-copy .hc-chip, body[data-dh="hillstate"] .op-hero-copy .hc-chip::before, body[data-dh="hillstate"] .op-hero-copy .hc-chip::after { color: hsl(356 42% 80%) !important; -webkit-text-fill-color: hsl(356 42% 80%) !important; }
body[data-dh="hobansummit"] .op-hero-copy .hc-chip, body[data-dh="hobansummit"] .op-hero-copy .hc-chip::before, body[data-dh="hobansummit"] .op-hero-copy .hc-chip::after { color: hsl(14 42% 80%) !important; -webkit-text-fill-color: hsl(14 42% 80%) !important; }
body[data-dh="iparkmudeung"] .op-hero-copy .hc-chip, body[data-dh="iparkmudeung"] .op-hero-copy .hc-chip::before, body[data-dh="iparkmudeung"] .op-hero-copy .hc-chip::after { color: hsl(210 42% 80%) !important; -webkit-text-fill-color: hsl(210 42% 80%) !important; }
body[data-dh="jeilpunggyeong"] .op-hero-copy .hc-chip, body[data-dh="jeilpunggyeong"] .op-hero-copy .hc-chip::before, body[data-dh="jeilpunggyeong"] .op-hero-copy .hc-chip::after { color: hsl(44 42% 80%) !important; -webkit-text-fill-color: hsl(44 42% 80%) !important; }
body[data-dh="lottecastle"] .op-hero-copy .hc-chip, body[data-dh="lottecastle"] .op-hero-copy .hc-chip::before, body[data-dh="lottecastle"] .op-hero-copy .hc-chip::after { color: hsl(348 42% 80%) !important; -webkit-text-fill-color: hsl(348 42% 80%) !important; }
body[data-dh="lumitrie"] .op-hero-copy .hc-chip, body[data-dh="lumitrie"] .op-hero-copy .hc-chip::before, body[data-dh="lumitrie"] .op-hero-copy .hc-chip::after { color: hsl(215 42% 80%) !important; -webkit-text-fill-color: hsl(215 42% 80%) !important; }
body[data-dh="seungwon"] .op-hero-copy .hc-chip, body[data-dh="seungwon"] .op-hero-copy .hc-chip::before, body[data-dh="seungwon"] .op-hero-copy .hc-chip::after { color: hsl(177 42% 80%) !important; -webkit-text-fill-color: hsl(177 42% 80%) !important; }
body[data-dh="skview"] .op-hero-copy .hc-chip, body[data-dh="skview"] .op-hero-copy .hc-chip::before, body[data-dh="skview"] .op-hero-copy .hc-chip::after { color: hsl(351 42% 80%) !important; -webkit-text-fill-color: hsl(351 42% 80%) !important; }
body[data-dh="theliv"] .op-hero-copy .hc-chip, body[data-dh="theliv"] .op-hero-copy .hc-chip::before, body[data-dh="theliv"] .op-hero-copy .hc-chip::after { color: hsl(209 42% 80%) !important; -webkit-text-fill-color: hsl(209 42% 80%) !important; }
body[data-dh="viterra"] .op-hero-copy .hc-chip, body[data-dh="viterra"] .op-hero-copy .hc-chip::before, body[data-dh="viterra"] .op-hero-copy .hc-chip::after { color: hsl(235 42% 80%) !important; -webkit-text-fill-color: hsl(235 42% 80%) !important; }
body[data-dh="wepark"] .op-hero-copy .hc-chip, body[data-dh="wepark"] .op-hero-copy .hc-chip::before, body[data-dh="wepark"] .op-hero-copy .hc-chip::after { color: hsl(217 42% 80%) !important; -webkit-text-fill-color: hsl(217 42% 80%) !important; }
body[data-dh="championscity"] .op-hero-copy .hc-chip { background: hsl(13 45% 10% / .66) !important; }
body[data-dh="hanyanglips"] .op-hero-copy .hc-chip { background: hsl(143 45% 10% / .66) !important; }
body[data-dh="hillstate"] .op-hero-copy .hc-chip { background: hsl(356 45% 10% / .66) !important; }
body[data-dh="hobansummit"] .op-hero-copy .hc-chip { background: hsl(14 45% 10% / .66) !important; }
body[data-dh="iparkmudeung"] .op-hero-copy .hc-chip { background: hsl(210 45% 10% / .66) !important; }
body[data-dh="jeilpunggyeong"] .op-hero-copy .hc-chip { background: hsl(44 45% 10% / .66) !important; }
body[data-dh="lottecastle"] .op-hero-copy .hc-chip { background: hsl(348 45% 10% / .66) !important; }
body[data-dh="lumitrie"] .op-hero-copy .hc-chip { background: hsl(215 45% 10% / .66) !important; }
body[data-dh="seungwon"] .op-hero-copy .hc-chip { background: hsl(177 45% 10% / .66) !important; }
body[data-dh="skview"] .op-hero-copy .hc-chip { background: hsl(351 45% 10% / .66) !important; }
body[data-dh="theliv"] .op-hero-copy .hc-chip { background: hsl(209 45% 10% / .66) !important; }
body[data-dh="viterra"] .op-hero-copy .hc-chip { background: hsl(235 45% 10% / .66) !important; }
body[data-dh="wepark"] .op-hero-copy .hc-chip { background: hsl(217 45% 10% / .66) !important; }


/* ################################ 제6판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 2. 머리글·메뉴 — 머리글·PC 메뉴·휴대폰 메뉴·하위 탭 메뉴(lnb)·쪽 제목 ======================== */
@media (min-width: 1025px) {
  body[data-dh] .gnb .d2 { background: #141a33 !important; border-color: rgba(227, 194, 122, .5) !important; box-shadow: 0 12px 30px rgba(0, 0, 0, .45) !important; }
  body[data-dh] .gnb .d2 a { color: #ece5d6 !important; }
}
body[data-dh] .lnb a:not(.on) { background: #141a33 !important; color: #d9d4c8 !important; -webkit-text-fill-color: #d9d4c8 !important; border-color: rgba(227, 194, 122, .22) !important; }
@media (min-width: 1025px) {
  /* 10-16 주인 "메뉴 내려오는 속도가 달라 그냥 칸같은거 없애줘": 묶음마다 깔리던 상자 없앰 — 머리글 바탕(gnb-bg) 하나로 */
  body[data-dh] .gnb .d2 { background: transparent !important; border: 0 !important; box-shadow: none !important; }
}

/* ======================== 3. 첫 화면 — 사진·큰 제목·칩·부제 ======================== */
body[data-dh] .op-hero-copy .hc-sub { background: rgba(13, 16, 34, .66) !important; color: #ece5d6 !important; -webkit-text-fill-color: #ece5d6 !important; border: 1px solid rgba(227, 194, 122, .55) !important; box-shadow: none !important; }

/* ======================== 5. 카드·상자 — 유리 카드·네 칸·맞춤견적 카드 ======================== */
body[data-dh] .op-sec .op-more a { min-height: 50px; padding: 0 18px !important; border: 1px solid rgba(227, 194, 122, .38) !important; border-radius: 0 !important;
  background: rgba(255, 255, 255, .025) !important; color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; font-size: 14px !important; letter-spacing: .04em; transition: background-color .3s ease, border-color .3s ease; }

/* ======================== 6. 표 — 사업 개요 표·하위 쪽 표·평면 표 ======================== */
@media (max-width: 1024px) {
  body[data-dh] [class*="card"], body[data-dh] details, body[data-dh] table { transition: none !important; }
}

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
body[data-dh] .addr-list .btns a:hover, body[data-dh] .addr-list .btns a:active, body[data-dh] .addr-list .btns a:hover *, body[data-dh] .addr-list .btns a:active * { color: #fff !important; -webkit-text-fill-color: #fff !important; }

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
/* 10-16 주인 "여기도 선택된버튼 어두워": 하위 쪽 탭(.tabs — 공급안내 2BL/3BL·세대안내 평형 등)도 첫 화면 평형 탭과 같게 */
body[data-dh] .sub-content .tabs button, body[data-dh] .sub-content .tabs a { background: rgba(255, 255, 255, .03) !important; border: 1px solid rgba(227, 194, 122, .45) !important; color: #d9cfbb !important; -webkit-text-fill-color: #d9cfbb !important; }
body[data-dh] .sub-content .tabs button *, body[data-dh] .sub-content .tabs a * { color: inherit !important; -webkit-text-fill-color: currentColor !important; }
/* 3. 첫 화면 '분양가 한눈에' 평형 탭만 빨강 → 다른 탭처럼 금색 */
body[data-dh] .kp-areas button[aria-pressed="true"], body[data-dh] .kp-areas button.on { background: #e3c27a !important; border-color: #e3c27a !important; color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
body[data-dh] .kp-areas button[aria-pressed="true"] *, body[data-dh] .kp-areas button.on * { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }

/* ======================== 9. 입력 폼 — 관심고객 등록·상담 폼·동의·입력칸 ======================== */
body[data-dh] .op-terms, body[data-dh] .op-terms p, body[data-dh] .op-terms li, body[data-dh] .op-terms span { color: #3a3328 !important; -webkit-text-fill-color: #3a3328 !important; }
body[data-dh] form.op-form .op-opt, body[data-dh] form.op-form [class*="opt"] { background: rgba(255, 255, 255, .03) !important; border-color: rgba(227, 194, 122, .2) !important; }
/* 4 보충: 등록 폼 안 개인정보 동의 상자(agree-box·terms, 흰 칸) · 서류 체크 제목 */
body[data-dh] form .agree-box, body[data-dh] form .terms { background: rgba(255, 255, 255, .03) !important; border: 1px solid rgba(227, 194, 122, .25) !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
body[data-dh] form.op-form :is(label, span, p, small, strong, b, h2, h3, h4, li, div, td, th), body[data-dh] form.reg-form :is(label, span, p, small, strong, b, h2, h3, h4, li, div, td, th),
body[data-dh] .sub-content .hs-tool :is(label, span, p, small, strong, b, h2, h3, h4, li, div, td, th), body[data-dh] .sub-content .hs-check :is(label, span, p, small, strong, b, h2, h3, h4, li, div, td, th) { color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] .sub-content .hs-tool h2, body[data-dh] .sub-content .hs-tool h3 { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
/* 4·5 보충: 분양가 계산기 쪽(.ccalc 흰 폼) — 5번 금색 글씨가 흰 칸 위 '원·%' 단위에 걸려 안 보이던 것 → 이 폼도 어두운 카드로 */
body[data-dh] .ccalc form, body[data-dh] .ccalc .form, body[data-dh] .ccalc [class*="result"], body[data-dh] .ccalc [class*="res"] { background: rgba(255, 255, 255, .04) !important; border-color: rgba(227, 194, 122, .3) !important; box-shadow: none !important; }

/* ======================== 11. 칼럼·DHOME 글·갤러리 — 홍보칼럼·분석 노트·갤러리 ======================== */
body[data-dh] .k-col p, body[data-dh] .k-col li, body[data-dh] .k-col td { color: #e6e0d3 !important; }

/* ======================== 13. 단지별 따로 — 특정 단지에만 걸리는 값 ======================== */
body[data-dh="championscity"] .op-hero-copy .hc-sub { border-color: hsl(13 60% 62% / .7) !important; background: hsl(13 45% 11% / .72) !important; }
body[data-dh="hanyanglips"] .op-hero-copy .hc-sub { border-color: hsl(143 60% 62% / .7) !important; background: hsl(143 45% 11% / .72) !important; }
body[data-dh="hillstate"] .op-hero-copy .hc-sub { border-color: hsl(356 60% 62% / .7) !important; background: hsl(356 45% 11% / .72) !important; }
body[data-dh="hobansummit"] .op-hero-copy .hc-sub { border-color: hsl(14 60% 62% / .7) !important; background: hsl(14 45% 11% / .72) !important; }
body[data-dh="iparkmudeung"] .op-hero-copy .hc-sub { border-color: hsl(210 60% 62% / .7) !important; background: hsl(210 45% 11% / .72) !important; }
body[data-dh="jeilpunggyeong"] .op-hero-copy .hc-sub { border-color: hsl(44 60% 62% / .7) !important; background: hsl(44 45% 11% / .72) !important; }
body[data-dh="lottecastle"] .op-hero-copy .hc-sub { border-color: hsl(348 60% 62% / .7) !important; background: hsl(348 45% 11% / .72) !important; }
body[data-dh="lumitrie"] .op-hero-copy .hc-sub { border-color: hsl(215 60% 62% / .7) !important; background: hsl(215 45% 11% / .72) !important; }
body[data-dh="seungwon"] .op-hero-copy .hc-sub { border-color: hsl(177 60% 62% / .7) !important; background: hsl(177 45% 11% / .72) !important; }
body[data-dh="skview"] .op-hero-copy .hc-sub { border-color: hsl(351 60% 62% / .7) !important; background: hsl(351 45% 11% / .72) !important; }
body[data-dh="theliv"] .op-hero-copy .hc-sub { border-color: hsl(209 60% 62% / .7) !important; background: hsl(209 45% 11% / .72) !important; }
body[data-dh="viterra"] .op-hero-copy .hc-sub { border-color: hsl(235 60% 62% / .7) !important; background: hsl(235 45% 11% / .72) !important; }
body[data-dh="wepark"] .op-hero-copy .hc-sub { border-color: hsl(217 60% 62% / .7) !important; background: hsl(217 45% 11% / .72) !important; }

/* ======================== 14. 기타 — 어느 부품에도 속하지 않는 것 ======================== */
@media (max-width: 1024px) {
  body[data-dh] .hs-backtop { width: 38px !important; height: 38px !important; right: 10px !important; opacity: 0; pointer-events: none; transition: opacity .3s ease !important; }
}


/* ################################ 제7판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 5. 카드·상자 — 유리 카드·네 칸·맞춤견적 카드 ======================== */
@media (max-width: 1024px) {
  body[data-dh] .op-sec .op-cards li .k { color: #e3c27a !important; -webkit-text-fill-color: #e3c27a; }
}

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
/* 4 보충: 어두운 카드 안 금색 단추(보기·제출 등) 글씨는 진하게 */
body[data-dh] form :is(button, .op-terms-btn, [type=submit]), body[data-dh] form :is(button, .op-terms-btn, [type=submit]) *, body[data-dh] .hs-tool :is(button, a[class*="btn"]), body[data-dh] .hs-tool :is(button, a[class*="btn"]) * { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
/* 검수 보충: 계산기 아래 바로가기 단추(흰 칸) → 첫 화면 바로가기와 같은 금색 테두리 칸 */
body[data-dh] .ccalc .k-more a, body[data-dh] .sub-content .k-more a, body[data-dh] .ccalc a[class*="more"] { background: rgba(255, 255, 255, .025) !important; border: 1px solid rgba(227, 194, 122, .38) !important; color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; }

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
body[data-dh] .hs-tool button[aria-pressed] { background: rgba(255, 255, 255, .05) !important; border: 1px solid rgba(227, 194, 122, .4) !important; color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] .hs-tool button[aria-pressed="true"] { background: #e3c27a !important; border-color: #e3c27a !important; color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
/* 4 보충: 분양가 계산기 최저·중간·최고 단추, 흰 구분선 */
body[data-dh] .ccalc .pc-quick button { background: rgba(255, 255, 255, .05) !important; border: 1px solid rgba(227, 194, 122, .4) !important; color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }

/* ======================== 9. 입력 폼 — 관심고객 등록·상담 폼·동의·입력칸 ======================== */
body[data-dh] form .terms, body[data-dh] form .terms * { color: #cfc7b6 !important; -webkit-text-fill-color: #cfc7b6 !important; }
/* 10-16 주인 "선없애 · 어둡게 하던가": 등록 폼 칸 사이 흰 구분선(reg-row) → 아주 옅은 어두운 금빛 */
body[data-dh] form .reg-row, body[data-dh] form fieldset.reg-row { border-bottom-color: rgba(227, 194, 122, .1) !important; border-top-color: transparent !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
body[data-dh] .ccalc em { color: #e8c97f !important; -webkit-text-fill-color: #e8c97f !important; }
body[data-dh] .ccalc .pc-loan, body[data-dh] .ccalc .faq, body[data-dh] .ccalc hr, body[data-dh] .ccalc [class*="divider"] { border-color: rgba(227, 194, 122, .14) !important; }
/* 4 보충: 분양가 계산기 결과 칸(.pc-out, 테마색 바탕 — SK뷰는 새빨강) → 13곳 모두 같은 어두운 카드 */
body[data-dh] .ccalc .pc-out, body[data-dh] .ccalc .score { background: rgba(255, 255, 255, .05) !important; border: 1px solid rgba(227, 194, 122, .35) !important; box-shadow: none !important; }


/* ################################ 제8판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 2. 머리글·메뉴 — 머리글·PC 메뉴·휴대폰 메뉴·하위 탭 메뉴(lnb)·쪽 제목 ======================== */
@media (min-width: 1025px) {
  body[data-dh] .gnb .d2 a:hover { color: #e3c27a !important; }
}
body[data-dh] .lnb a:not(.on):hover { color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; }

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
body[data-dh] .sub-content .tabs button:hover, body[data-dh] .sub-content .tabs a:hover { background: rgba(227, 194, 122, .14) !important; border-color: #e3c27a !important; color: #fff4d6 !important; -webkit-text-fill-color: #fff4d6 !important; }
body[data-dh] .sub-content .tabs button.on, body[data-dh] .sub-content .tabs button[aria-selected="true"], body[data-dh] .sub-content .tabs a.on { background: #e3c27a !important; border-color: #e3c27a !important; color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; font-weight: 700 !important; }
body[data-dh] .ccalc .pc-quick button[aria-pressed="true"] { background: #e3c27a !important; border-color: #e3c27a !important; color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }


/* ################################ 제9판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 4. 글씨·제목 — 본문·제목 색과 금빛 글자 ======================== */
body[data-dh] .op-deal-list li.dh-lit .n { color: color-mix(in srgb, var(--dh-th, #e3c27a) 55%, #f3dfa8) !important; -webkit-text-fill-color: color-mix(in srgb, var(--dh-th, #e3c27a) 55%, #f3dfa8) !important; text-shadow: 0 0 18px color-mix(in srgb, var(--dh-th, #e3c27a) 60%, transparent); transition: color .6s ease, text-shadow .6s ease; }
@media (hover: hover) {
  body[data-dh] .op-deal-list li:hover .n { color: color-mix(in srgb, var(--dh-th, #e3c27a) 55%, #f3dfa8) !important; -webkit-text-fill-color: color-mix(in srgb, var(--dh-th, #e3c27a) 55%, #f3dfa8) !important; text-shadow: 0 0 18px color-mix(in srgb, var(--dh-th, #e3c27a) 60%, transparent); transition: color .6s ease, text-shadow .6s ease; }
}

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
/* 3 보충: 선택 안 된 평형 탭도 아래 타입 탭처럼 어두운 칸 */
body[data-dh] .kp-areas button:not([aria-pressed="true"]):not(.on) { background: rgba(255, 255, 255, .06) !important; border: 1px solid rgba(227, 194, 122, .35) !important; color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] .kp-areas button:not([aria-pressed="true"]):not(.on) * { color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; background: rgba(255, 255, 255, .1) !important; }

/* ======================== 10. 계산기·도구 — 분양가 계산기·서류 체크·맞춤견적 ======================== */
/* 4 보충: 계산기 제목·최저/최고 단추 */
body[data-dh] .sub-content .hs-tool.hs-calc h2, body[data-dh] .sub-content .hs-tool h2[class], body[data-dh] main .hs-tool > h2, body[data-dh] main .hs-tool > h3 { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
body[data-dh] .sub-content .hs-check h2, body[data-dh] .sub-content .hs-check h3, body[data-dh] main .hs-check > h2 { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
body[data-dh] .hs-tool.hs-check h2, body[data-dh] .hs-tool.hs-check h3, body[data-dh] [class~="hs-check"] > h2, body[data-dh] .hs-tool > h2 { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
body[data-dh] .ccalc :is(label, span, p, small, strong, b, h2, h3, h4, li, div, td, th, dt, dd) { color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] .ccalc :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { background: rgba(255, 255, 255, .06) !important; border: 1px solid rgba(227, 194, 122, .35) !important; color: #f3ecdc !important; -webkit-text-fill-color: #f3ecdc !important; }
body[data-dh] .ccalc .pc-out :is(p, span, small, strong, b, div, li, dt, dd, h3, h4) { color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] .ccalc .pc-out strong, body[data-dh] .ccalc .pc-out b, body[data-dh] .ccalc .pc-out [class*="total"], body[data-dh] .ccalc .pc-out [class*="big"] { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
body[data-dh] .ccalc .pc-out :is(button, a):is([class*="line"], [class*="ghost"], [class*="shot"], [class*="save"]) { background: transparent !important; border: 1px solid rgba(227, 194, 122, .45) !important; color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
body[data-dh] .ccalc .pc-out :is(button, a):is([class*="line"], [class*="ghost"], [class*="shot"], [class*="save"]) * { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; stroke: #f3dfa8; }


/* ################################ 제10판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
body[data-dh] form .op-terms-btn { background: linear-gradient(120deg, #f7e3b0 0%, #e3c27a 30%, #c9984a 55%, #f2d58f 80%, #fff1c9 100%) !important; border: 0 !important; color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
body[data-dh] form button[type=submit] *, body[data-dh] form .op-submit, body[data-dh] form .op-submit * { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
body[data-dh] .ccalc .k-more a:hover, body[data-dh] .sub-content .k-more a:hover { background: rgba(227, 194, 122, .12) !important; border-color: #e3c27a !important; }
/* 검수 보충: 금색 단추를 누르거나 마우스를 올리면 남색 바탕 + 금색 글씨(원래 디자인) — 진한 글씨 고정이 누른 상태까지 덮어 안 보이던 것 */
body[data-dh] form :is(button, [type=submit]):not(.op-terms-btn):is(:hover, :active, :focus-visible), body[data-dh] form :is(button, [type=submit]):not(.op-terms-btn):is(:hover, :active, :focus-visible) *,
body[data-dh] .hs-tool :is(button, a[class*="btn"]):not([aria-pressed]):is(:hover, :active), body[data-dh] .hs-tool :is(button, a[class*="btn"]):not([aria-pressed]):is(:hover, :active) *,
body[data-dh] .ccalc :is(button, [type=submit]):not([aria-pressed]):is(:hover, :active), body[data-dh] .ccalc :is(button, [type=submit]):not([aria-pressed]):is(:hover, :active) * { color: #e3c27a !important; -webkit-text-fill-color: #e3c27a !important; }
/* 10-16 주인 "둘다 노랑색, 효과 기존": 상담 신청·계산기 단추 둘 다 금색, 제출 단추도 금색 — 마우스 올리면 기존대로 남색 + 금색 글씨 */
body[data-dh] .kp-card .kp-acts .kp-btn, body[data-dh] form :is(button[type=submit], .op-submit):not(.op-terms-btn) { background: var(--dh-btn) !important; background-size: 200% 100% !important; border: 0 !important; color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
body[data-dh] .kp-card .kp-acts .kp-btn *, body[data-dh] form :is(button[type=submit], .op-submit):not(.op-terms-btn) * { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
body[data-dh] .kp-card .kp-acts .kp-btn:is(:hover, :active), body[data-dh] form :is(button[type=submit], .op-submit):not(.op-terms-btn):is(:hover, :active) { background: #0b1020 !important; color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; }
body[data-dh] .kp-card .kp-acts .kp-btn:is(:hover, :active) *, body[data-dh] form :is(button[type=submit], .op-submit):not(.op-terms-btn):is(:hover, :active) * { color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; }
/* 10-16 주인 "그대로 적용": '보기' 단추도 맨 아래 '관심고객등록하기' 단추와 같은 효과 — 올리면 남색 바탕 + 금색 글씨 */
body[data-dh] form button.op-terms-btn.op-terms-btn:is(:hover, :active) { background: #0b1020 !important; color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; }
body[data-dh] form button.op-terms-btn.op-terms-btn:is(:hover, :active) * { color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; }

/* ======================== 8. 탭·칩 — 평형 탭·타입 칩·하위 쪽 탭 ======================== */
/* 10-16 주인 "동그라미 색": 선택된 금색 평형 탭 안 개수 동그라미 → 진한 바탕 + 금색 숫자 */
body[data-dh] .kp-areas button:is([aria-pressed="true"], .on) * { background: #2a1f10 !important; color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
/* 롤오버 시: 평형 탭이 금색으로 바뀔 때도 동그라미는 진한 바탕 + 금색 숫자 */
body[data-dh] .kp-areas button:not([aria-pressed="true"]):not(.on):hover *, body[data-dh] .kp-areas button:is([aria-pressed="true"], .on):hover * { background: #2a1f10 !important; color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }

/* ======================== 9. 입력 폼 — 관심고객 등록·상담 폼·동의·입력칸 ======================== */
body[data-dh] form .req-note, body[data-dh] form .req-note * { color: #cfc7b6 !important; -webkit-text-fill-color: #cfc7b6 !important; }
body[data-dh] form .req-note em { color: #e8c97f !important; -webkit-text-fill-color: #e8c97f !important; }


/* ################################ 제11판 — 앞 판의 일부를 덮어쓰는 보정 (앞 판과 같은 칸 이름을 따라가면 된다) ################################ */

/* ======================== 7. 금색 단추 — 금빛 단추와 누르거나 올렸을 때 효과 ======================== */
body[data-dh] form .op-terms-btn.op-terms-btn { background-size: 200% 100% !important; }
/* 10-16: 계산기 결과 칸 '이 조건으로 관심고객 등록'(op-btn) — 올렸을 때 다른 금색 단추처럼 금색 글씨 */
body[data-dh] .ccalc .pc-out a.op-btn.op-btn:is(:hover, :active), body[data-dh] .ccalc .pc-out a.op-btn.op-btn:is(:hover, :active) * { color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; }
/* 10-16: 계산기 칸(.ccalc) 안 표(평수 변환 비교표 등) — 흰 칸 위 밝은 글씨로 안 보이던 것 → 칸 바탕은 어두운 카드와 같게, 구분선은 옅은 금빛 */
body[data-dh] .ccalc table td { background: transparent !important; border-color: rgba(227, 194, 122, .15) !important; }
body[data-dh] .ccalc table tbody tr:nth-child(even) td { background: rgba(255, 255, 255, .025) !important; }
/* 10-16 계산기·등록 쪽 자동 대비 점검(13곳 × calc01~06·register)에서 나온 것 */
/* 연도별 상환표·평수 비교표를 감싼 흰 상자(.cmp-wrap) → 어두운 카드 */
body[data-dh] .ccalc .cmp-wrap { background: rgba(255, 255, 255, .03) !important; border-color: rgba(227, 194, 122, .3) !important; box-shadow: none !important; }
/* 상환 방식 고르기(원리금균등·원금균등·만기일시) 흰 칸 → 다른 선택 칸처럼 어두운 칸, 고른 칸은 금색 테두리 */
body[data-dh] .ccalc label.radio { background: rgba(255, 255, 255, .05) !important; border: 1px solid rgba(227, 194, 122, .35) !important; color: #e9e2d3 !important; -webkit-text-fill-color: #e9e2d3 !important; }
body[data-dh] .ccalc label.radio:has(input:checked) { background: #2a1f12 !important; border-color: #e3c27a !important; color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
body[data-dh] .ccalc label.radio input { accent-color: #e3c27a; }
/* 등록 쪽 '* 필수 입력 항목' · 서류 챙기기 제목: 어두운 카드 위 진한 글씨(예전 흰 폼용 색)가 남아 있던 것 */
body[data-dh] form.reg-form p.req-note.req-note { color: #cfc7b6 !important; -webkit-text-fill-color: #cfc7b6 !important; }
body[data-dh] form.reg-form p.req-note.req-note em { color: #e8c97f !important; -webkit-text-fill-color: #e8c97f !important; }
body[data-dh] .sub-content section.hs-tool.hs-tool > h2, body[data-dh] section.hs-tool.hs-tool > h2 { color: #f3dfa8 !important; -webkit-text-fill-color: #f3dfa8 !important; }
/* 10-16 주인 "글 뒤쪽에 고급스러운 박스나 어두운 흐림 박스 · 투명박스": 첫 화면 큰 제목 뒤 반투명 유리 상자(어두운 흐림 + 옅은 금색 테두리) */
body[data-dh] .op-hero .op-hero-copy .hc-tit { display: inline-block; padding: 14px 22px 16px !important; background: rgba(12, 12, 20, .34) !important; -webkit-backdrop-filter: blur(6px) saturate(1.1); backdrop-filter: blur(6px) saturate(1.1); border: 1px solid rgba(227, 194, 122, .26); border-radius: 6px; box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 244, 214, .08); }
@media (max-width: 768px) { body[data-dh] .op-hero .op-hero-copy .hc-tit { padding: 10px 14px 12px !important; max-width: calc(100% - 8px); } }
/* 투명 상자 보정: 칩·부제가 inline-block 인 틀(루미 등)에서 제목이 한 줄로 붙던 것 → 제목은 자기 줄(블록)에, 폭은 글자만큼. 가운데 정렬 틀은 dh-lux.js 가 dh-ctr 를 붙여 가운데로 */
body[data-dh] .op-hero .op-hero-copy .hc-tit { display: block !important; width: fit-content; max-width: 100%; margin-left: 0 !important; margin-right: 0 !important; }
body[data-dh] .op-hero .op-hero-copy.dh-ctr .hc-tit { margin-left: auto !important; margin-right: auto !important; }
/* 10-16 주인 "너무 흐린거 아니야": 밝은 사진 위에서 상자가 옅던 것 → 더 진하게(0.34→0.62), 흐림도 조금 더 */
body[data-dh] .op-hero .op-hero-copy .hc-tit { background: rgba(10, 10, 18, .62) !important; -webkit-backdrop-filter: blur(10px) saturate(1.1); backdrop-filter: blur(10px) saturate(1.1); border-color: rgba(227, 194, 122, .34); }
/* 2026-10-17 선택된 칩(금색 바탕)은 휴대폰에서 탭 뒤 hover·focus 가 남아도 글씨 진하게 (form 버튼 hover 금색 글씨 규칙이 덮던 것) */
body[data-dh] .ccalc form [aria-pressed="true"][aria-pressed="true"], body[data-dh] .ccalc form [aria-pressed="true"][aria-pressed="true"] *, body[data-dh] .ccalc [aria-pressed="true"][aria-pressed="true"], body[data-dh] .ccalc [aria-pressed="true"][aria-pressed="true"] * { color: #1b1405 !important; -webkit-text-fill-color: #1b1405 !important; }
/* 2026-10-17 계산기 상환 방식 동그라미: 휴대폰에서 선택된 것이 작은 점으로만 보이던 것 → 선택=금색 원 + 진한 가운데 점, 미선택=흰 원 */
body[data-dh] .ccalc label.radio input[type=radio] { -webkit-appearance: none !important; appearance: none !important; width: 15px !important; height: 15px !important; margin: 0 !important; border-radius: 50% !important; border: 2px solid #e9e2d3 !important; background: #f3ecdc !important; vertical-align: -3px; flex: none; }
body[data-dh] .ccalc label.radio input[type=radio]:checked { border-color: #e3c27a !important; background: #1b1405 !important; box-shadow: inset 0 0 0 3px #e3c27a !important; }
body[data-dh] .ccalc label.radio { gap: 5px !important; padding-left: 6px !important; padding-right: 6px !important; justify-content: center; }

/* ===== dhome 다크 사본 첫 화면: 단지 사이트와 같은 "큰 제목 + 세로선 + 흰 로고, 가운데" (2026-10-18 주인 "다크모드도") ===== */
html body[data-dh] .op-hero .op-hero-bg::before{top:0!important;bottom:0!important;left:0!important;right:0!important;width:auto!important;height:auto!important;background:linear-gradient(180deg,rgba(10,12,18,.58) 0%,rgba(10,12,18,.32) 42%,rgba(10,12,18,0) 66%)!important}
html body[data-dh] .op-hero .op-hero-copy{display:flex!important;flex-direction:column!important;align-items:center!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translateX(-50%)!important;width:min(900px,88vw)!important;max-width:none!important;top:clamp(56px,10vh,110px)!important;padding:0!important;border:0!important;text-align:center!important}
html body[data-dh] .op-hero .op-hero-copy .hc-chip,html body[data-dh] .op-hero .op-hero-copy .hc-sub,html body[data-dh] .op-hero .op-hero-copy .hc-deal,html body[data-dh] .op-hero .op-hero-copy .hc-notice{display:none!important}
html body[data-dh] .op-hero .op-hero-copy .hc-tit{order:1;margin:0!important;font-family:var(--font-serif,"Nanum Myeongjo",serif)!important;width:100%!important;text-wrap:wrap!important;font-size:clamp(34px,2.8vw,46px)!important;font-weight:700!important;line-height:1.42!important;letter-spacing:-.02em!important;color:#fff!important;-webkit-text-fill-color:#fff!important;filter:none!important;text-shadow:0 1px 2px rgba(0,0,0,.3)!important}
html body[data-dh] .op-hero .op-hero-copy .hc-tit::first-line{font-weight:400!important;color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.3)!important}
/* 가는 세로선: 위에서 아래로 그려짐 */
html body[data-dh] .op-hero .op-hero-copy::after{content:"";order:2;display:block;flex:0 0 auto;width:1px;height:96px;margin:30px 0 0;background:rgba(255,255,255,.85);transform-origin:50% 0;animation:hxDrop 1.2s .9s cubic-bezier(.2,.7,.2,1) both}
/* 흰 로고 */
html body[data-dh] .op-hero .op-hero-copy::before{content:"";order:3;display:block;flex:0 0 auto;width:min(300px,70vw);height:56px;margin:28px 0 0;background-position:center;background-size:contain;background-repeat:no-repeat;filter:grayscale(1) invert(1) brightness(2.2) drop-shadow(0 2px 10px rgba(0,0,0,.25));animation:hxFade 1s 1.6s ease both}
@keyframes hxDrop{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes hxFade{from{opacity:0}to{opacity:1}}
@media (max-width:1024px){
html body[data-dh] .op-hero .op-hero-copy{top:clamp(40px,9vh,80px)!important}
html body[data-dh] .op-hero .op-hero-copy .hc-tit{font-size:clamp(25px,7vw,34px)!important}
html body[data-dh] .op-hero .op-hero-copy::after{height:64px;margin-top:22px}
html body[data-dh] .op-hero .op-hero-copy::before{height:42px;margin-top:20px}
}
@media (prefers-reduced-motion:reduce){html body[data-dh] .op-hero .op-hero-copy::after,html body[data-dh] .op-hero .op-hero-copy::before{animation:none}}
/* 다크 사본은 첫 줄이 <span class="dh-l1"> 로 나뉨 → 그 줄만 가늘게 */
html body[data-dh] .op-hero .op-hero-copy .hc-tit .dh-l1{font-weight:400!important;font-family:inherit!important;color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important;text-shadow:0 1px 2px rgba(0,0,0,.3)!important;animation:none!important}
/* 다크 사본 제목에 붙어 있던 어두운 상자·폭 제한 없앰, 첫 줄 글꼴도 고딕 */
html body[data-dh] .op-hero .op-hero-copy .hc-tit{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;max-width:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-radius:0!important}

/* 비테라 다크 사본 첫 화면 사진 살짝 어둡게 (2026-10-18 주인 "다크모드는 살짝어둡게 편집해서") */
html body[data-dh="viterra"] .op-hero img{filter:brightness(.8) saturate(.95)}

/* 비테라 다크 사본 서브페이지 위쪽 사진 살짝 어둡게 */
html body[data-dh="viterra"] .sub-visual .sv-bg{filter:brightness(.78)}

/* 비테라 다크 휴대폰: 건물이 화면 가운데 오게 */
@media (max-width:1024px){html body[data-dh="viterra"] .op-hero .op-hero-bg img{object-position:68% 100%!important}}

/* 상무센트럴자이(어두운 글씨 로고): 히어로 가운데 로고 흰색으로 */
html body[data-dh="sangmucentralxi"] .op-hero .op-hero-copy .hc-logo.lg-inv{filter:brightness(0) invert(1) drop-shadow(0 2px 10px rgba(0,0,0,.25))!important}
/* 상무센트럴자이: 바닥글 로고도 흰색으로 */
html body[data-dh="sangmucentralxi"] .site-footer .ft-logo img{filter:brightness(0) invert(1)!important}
/* 다크 사본 본문 작은 제목(h3) 어두운 바탕에서 보이게 */
html body[data-dh] .sub-content .k-imgtxt h3{color:#f3dc9e!important;-webkit-text-fill-color:#f3dc9e!important}

/* ======================== 8. 단지 테마색 (2026-10-18 정리) ========================
   색은 아래 변수 한 곳만 고치면 위 메뉴·바닥글·서브 탭·오른쪽 스크롤 막대가 같이 바뀐다.
   --dh-hd  위 메뉴·바닥글·탭 줄 바탕 (단지 테마색을 어둡게)   --dh-tab  고르지 않은 탭 (조금 밝게)
   --dh-sbt 스크롤 막대 손잡이   --dh-tabline 탭 금색 밑선
   단지별로 다르게 할 때는 html:has(body[data-dh="단지"])[lang] { 변수 } 만 덧붙인다. */
html:has(body[data-dh]) { --dh-hd: color-mix(in srgb, var(--c-primary) 18%, #000); --dh-tab: color-mix(in srgb, var(--c-primary) 36%, #000); --dh-sbt: color-mix(in srgb, var(--c-primary) 80%, #fff); --dh-tabline: rgba(227,194,122,.35); scrollbar-color: var(--dh-sbt) var(--dh-hd); }
html:has(body[data-dh]) body * { scrollbar-color: auto; }   /* 페이지 오른쪽 막대만 — 문의사항·동의 상자 같은 안쪽 막대는 원래대로 */
html body[data-dh] .site-header, html body[data-dh] .site-header::before, html body[data-dh] .site-header .gnb-bg,
html body[data-dh] footer.site-footer, html body[data-dh] .site-footer,
html body[data-dh] .lnb, html body[data-dh] .lnb ul { background: var(--dh-hd) !important; }
html body[data-dh] .lnb a:not(.on):not([aria-current]), html body[data-dh] .sub-visual .lnb a:not(.on):not([aria-current]), html body[data-dh] .sub-visual .lnb a:not(.on):not([aria-current]):is(:hover,:active,:focus) { background: var(--dh-tab) !important; box-shadow: inset 0 -1px 0 var(--dh-tabline); }
/* 상무센트럴자이: 테마색 = 로고의 자이 남색, 어두운 칸 = 핵심 포인트 칸 남보라를 어둡게 (주인 "이색에서 어둡게") */
html:has(body[data-dh="sangmucentralxi"])[lang] { --c-primary: #102840; --lux-wine: #102840; --c-primary-dark: color-mix(in srgb, #102840 78%, #000); --lux-ink: color-mix(in srgb, rgb(28,24,40) 80%, #000); --dh-hd: color-mix(in srgb, rgb(28,24,40) 65%, #000); --dh-tab: color-mix(in srgb, rgb(28,24,40) 65%, #000); --dh-sbt: color-mix(in srgb, #102840 55%, #fff); }
html body[data-dh="sangmucentralxi"] .op-hero .op-hero-bg img { object-position: 50% 0 !important; }   /* 첫 화면 사진 하늘 보이게 */

/* ======================== 9. 금색 단추 보충 (2026-10-18 정리) ======================== */
/* 처음 모습: 금속 광택·윗면 빛·테두리 빛·깊은 그림자 (모양·롤오버는 그대로) */
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit):not(:hover):not(:focus-visible) {
  background-image: linear-gradient(180deg, rgba(255,255,255,.34) 0%, rgba(255,255,255,.08) 46%, rgba(0,0,0,0) 50%, rgba(80,50,10,.10) 100%), linear-gradient(120deg, #f7e3b0 0%, #e3c27a 30%, #c9984a 55%, #f2d58f 80%, #fff1c9 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 -1px 0 rgba(110,72,18,.45), 0 0 0 1px rgba(255,232,180,.38), 0 0 0 4px rgba(227,194,122,.08), 0 16px 32px -16px rgba(0,0,0,.75), 0 8px 22px -10px rgba(227,194,122,.5) !important;
  text-shadow: none;
}
/* 글씨 굵기 900, 마우스 올려도 글씨는 그대로 — 바탕(::before)만 남색으로 바뀌고 빛 퍼짐 */
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit), html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit) * { font-weight: 900 !important; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class]:hover { transform: none !important; background: transparent !important; box-shadow: none !important; animation: none !important; overflow: visible !important; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class]:hover::before { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: -1; background: #0b1020; box-shadow: 0 0 0 1.5px var(--dh-gold) inset, 0 0 18px var(--dh-glow); animation: dhRing 1.1s ease-out 1; pointer-events: none; }
html body[data-dh] :is(.ccalc .pc-out :is(.op-btn, .k-btn), .kp-calc-go .kp-btn) { font-size: 19px !important; }   /* 계산기 결과 단추 글씨 = 첫 화면 단추와 같은 19px */
html body[data-dh] .kp-acts { gap: 12px !important; }   /* 맞춤견적 두 단추 간격 = 방문 상담 칸(12px) */
/* 2026-10-19 위 메뉴 글씨 보통 굵기 (주인 "보통굵기") */
html body[data-dh] .site-header .gnb > ul > li:not(.gnb-reg-m) > a.d1 { font-weight: 400 !important; }
/* 2026-10-19 등록 단추: 원래 화살표(::after "→")가 빛 지나감 효과와 겹쳐 단추를 가로질러 지나감 (주인 "무슨 화살표가 지나가네") — 다른 금색 단추처럼 없앰 */
html body[data-dh] form .btn-submit::after { content: none !important; display: none !important; }
/* ===== 2026-10-19 디자인 점검 반영 (에이전트 점검 → 주인 "고쳐줘") ===== */
/* 1. 가운데 로고: 흰 건물·밝은 하늘 위에서도 읽히게 그림자를 진하게 */
html body[data-dh] .op-hero .op-hero-copy::before { filter: grayscale(1) invert(1) brightness(2.2) drop-shadow(0 2px 6px rgba(0,0,0,.6)) drop-shadow(0 0 22px rgba(0,0,0,.45)); }
/* 3·14. 선택된 타입 탭 = 위 탭과 같은 금속 금색, 글자 밑 검은 줄(::after) 흔적 없앰 */
html body[data-dh] .tabs button.on, html body[data-dh] .tabs button[aria-selected="true"] { background: var(--dh-grad) !important; color: #1b1405 !important; border-color: transparent !important; }
html body[data-dh] .tabs button.on::after, html body[data-dh] .tabs button[aria-selected="true"]::after { display: none !important; }
/* 4. TOP 버튼·맨 위 진행 막대: 옆 원형 버튼과 같은 어두운 테마색 + 금색 */
html body[data-dh] .hs-backtop { background: var(--dh-hd) !important; border: 1px solid rgba(227,194,122,.55) !important; color: var(--dh-gold) !important; }
html body[data-dh] .hs-prog { background: linear-gradient(90deg, #c9984a, #e3c27a 60%, #f2d58f) !important; }
/* 12. 휴대폰 아래 고정 바: 어두운 테마색으로 맞추고 '관심고객등록' 칸만 금색 */
html body[data-dh] .mobile-bar a:not(:nth-child(2)) { background: var(--dh-hd) !important; color: #e9e1cf !important; filter: none !important; border-color: rgba(227,194,122,.18) !important; }
/* 13. 갤러리 사진 칸 폭 = 위 탭·본문 폭 */
html body[data-dh] .sub-content .gal-grid { max-width: 1200px; margin-left: auto; margin-right: auto; }
/* 갤러리 크게 보기: 사진이 설명 글보다 좁을 때 왼쪽으로 쏠리던 것 → 가운데 (주인 "이미지가 가운데로 안불러와") */
html body .gal-lb figure img { margin-left: auto !important; margin-right: auto !important; }
html body .gal-lb figure figcaption { max-width: 900px; margin-left: auto !important; margin-right: auto !important; }
/* 가운데 로고 2배 (주인 "로고 지금보다 2배 크게") — PC 300×56 → 600×112, 휴대폰 42px → 84px 높이 (화면 폭 안에서) */
html body .op-hero .op-hero-copy::before { width: 600px !important; height: 112px !important; max-width: 90vw !important; }
@media (max-width: 768px) { html body .op-hero .op-hero-copy::before { width: 92vw !important; height: 84px !important; } }
/* 갤러리 쪽: 사진 칸을 본문 폭에 맞추자 양옆에 드러난 안쪽 상자 그라데이션(음영) 없앰 (주인 "음영생겼어") */
html body[data-dh] .sub-content:has(.gal-grid) { background: none !important; }
/* 가운데 로고: 은은한 그림자 (주인 "은은한 … 그림자 효과") */
html body[data-dh] .op-hero .op-hero-copy::before { filter: grayscale(1) invert(1) brightness(2.2) drop-shadow(0 2px 3px rgba(0,0,0,.35)) drop-shadow(0 6px 18px rgba(0,0,0,.32)); }
/* 다크 가운데 로고: 2배는 너무 커서 1.5배 (주인 "다크버전 2배는 너무 크다 1.5배") — PC 450×84, 휴대폰 63px 높이 */
html body[data-dh] .op-hero .op-hero-copy::before { width: 450px !important; height: 84px !important; max-width: 86vw !important; }   /* 1.5배 → 1.2배 (주인 "1.2배 로고") */
@media (max-width: 768px) { html body[data-dh] .op-hero .op-hero-copy::before { width: 70vw !important; height: 63px !important; } }   /* 휴대폰도 원래(폭 70vw·높이 42px)의 1.5배 — 폭은 화면 90% 안에서 */
/* 비테라 다크는 2배 유지 (주인 "비테라는 2배가 맞아") */
html body[data-dh="viterra"] .op-hero .op-hero-copy::before { width: 600px !important; height: 112px !important; max-width: 90vw !important; }
@media (max-width: 768px) { html body[data-dh="viterra"] .op-hero .op-hero-copy::before { width: 92vw !important; height: 84px !important; } }
/* 가운데 로고 그림자 없앰 (주인 "그림자 없애줘") — 흰색으로만 */
html body[data-dh] .op-hero .op-hero-copy::before { filter: grayscale(1) invert(1) brightness(2.2) !important; }
/* 가운데 로고 효과(은빛 그라데이션) 빼고 단색 흰색 (주인 "로고 효과 빼줘") */
html body[data-dh="viterra"] .op-hero .op-hero-copy::before { filter: brightness(0) invert(1) !important; }   /* 비테라만 은빛 효과 빼고 단색 흰색 — 다른 단지는 글자가 뚫린 로고가 있어 그대로 */
/* 10-19 주인 "글씨사이즈 크게": 아래 전체 메뉴 글씨 키움 (밝은 버전과 같은 15/16px, 휴대폰 14/15) */
body[data-dh] .seo-links p > * { font-size: 15px !important; }
body[data-dh] .seo-links p b { font-size: 16px !important; }
@media (max-width: 768px) { body[data-dh] .seo-links p > * { font-size: 14px !important; } body[data-dh] .seo-links p b { font-size: 15px !important; } }
/* 10-19 주인 "pc버전은 방금 효과 다 넣자 … 다크버전 포함": PC 가운데 로고에 밝은 버전과 같은 그림자 + 그림자만 오버레이(hard-light) */
@media (min-width: 769px) {
  html body[data-dh] .op-hero .op-hero-copy::before { filter: grayscale(1) invert(1) brightness(2.2) drop-shadow(0 2px 2px rgba(0,0,0,.48)) drop-shadow(0 4px 10px rgba(0,0,0,.45)) drop-shadow(0 8px 30px rgba(0,0,0,.4)) !important; mix-blend-mode: hard-light; }
  html body.op-body[data-dh="viterra"] .op-hero .op-hero-copy::before, html body.op-body[data-dh="hobansummit"] .op-hero .op-hero-copy::before, html body.op-body[data-dh="skview"] .op-hero .op-hero-copy::before, html body.op-body[data-dh="jeilpunggyeong"] .op-hero .op-hero-copy::before { filter: brightness(0) invert(1) drop-shadow(0 2px 2px rgba(0,0,0,.48)) drop-shadow(0 4px 10px rgba(0,0,0,.45)) drop-shadow(0 8px 30px rgba(0,0,0,.4)) !important; }
}
/* 10-19 주인 "루미트리에만 top색이 달라 통일": 맨 위로 단추의 진행 테두리·화살표가 루미트리에만 하늘색(#b5cddb) → 다른 다크 단지와 같은 금색(#dcc59f)으로, 다크 전체 고정 */
html body[data-dh] .hs-backtop .hs-bt-bar { stroke: #dcc59f !important; }
html body[data-dh] .hs-backtop .hs-bt-arrow { color: #dcc59f !important; }
/* 10-19 주인 "글자 넘어감" → "글자크기는 놔두고 받기만 빼": 계산기 결과 단추 글씨 19px 그대로, 문구에서 '받기'를 빼고 휴대폰에서만 양옆 여백을 줄여 한 줄 가운데 */
@media (max-width: 768px) { html body[data-dh] :is(.ccalc .pc-out :is(.op-btn, .k-btn), .kp-calc-go .kp-btn) { padding: 0 14px !important; white-space: nowrap; text-align: center; } }
/* 10-19 주인 "폰트크기": 관심고객 등록 쪽 금색 '관심고객 등록하기' 단추 글씨 16px → 다른 금색 단추(첫 화면·계산기)와 같은 19px */
html body[data-dh] .btn-submit { font-size: 19px !important; }
/* 10-19 주인 "다크버전 버튼 기본을 이디자인으로 하고 롤오버 클릭시 노랑으로 즉 뒤집기": 금색 단추 — 평소 = 남색 바탕 + 금색 테두리·글씨·빛, 마우스 올림·누름 = 금색 바탕 + 진한 글씨 */
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class][class]:not(:hover):not(:focus-visible):not(:active) { background: transparent !important; box-shadow: none !important; color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; overflow: visible !important; animation: none !important; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class][class]:not(:hover):not(:focus-visible):not(:active) * { color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class][class]:not(:hover):not(:focus-visible):not(:active)::before { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: -1; background: var(--dh-b16, #0b1020); box-shadow: 0 0 0 1.5px var(--dh-gold) inset, 0 0 7px var(--dh-glow); pointer-events: none; animation: none; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class][class]:is(:hover, :focus-visible, :active) { background-image: linear-gradient(180deg, rgba(255,255,255,.34) 0%, rgba(255,255,255,.08) 46%, rgba(0,0,0,0) 50%, rgba(80,50,10,.10) 100%), linear-gradient(120deg, #f7e3b0 0%, #e3c27a 30%, #c9984a 55%, #f2d58f 80%, #fff1c9 100%) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 -1px 0 rgba(110,72,18,.45), 0 0 0 1px rgba(255,232,180,.38), 0 4px 10px -6px rgba(227,194,122,.45) !important; color: #1d160a !important; -webkit-text-fill-color: #1d160a !important; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class][class]:is(:hover, :focus-visible, :active) * { color: #1d160a !important; -webkit-text-fill-color: #1d160a !important; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit)[class][class][class]:is(:hover, :focus-visible, :active)::before { content: none !important; display: none !important; }
/* (위 뒤집기) 광선 범위 줄임 — 주인 "광선효과 범위 줄여줘": 평소 테두리 빛 18px → 7px, 금색 상태 그림자도 좁게 */
/* 10-19 주인 "파랑색을 어두운 테마색으로": 금색 단추 평소 바탕 남색(#0b1020) → 단지별 어두운 테마색(--dh-b16) */
/* 10-19 주인 "보기는 사각 단순버튼": 개인정보 '보기' 단추 — 금색 알약 → 사각 테두리 단순 단추 (금색 테두리·글씨, 그림자·광택 없음) */
html body[data-dh] .op-terms-btn[class][class] { background: transparent !important; background-image: none !important; border: 1px solid rgba(227,194,122,.6) !important; border-radius: 4px !important; box-shadow: none !important; color: var(--dh-gold) !important; -webkit-text-fill-color: var(--dh-gold) !important; text-shadow: none !important; animation: none !important; font-weight: 500 !important; padding: 6px 14px !important; height: auto !important; min-height: 0 !important; font-size: 14px !important; }
html body[data-dh] .op-terms-btn[class][class]::before, html body[data-dh] .op-terms-btn[class][class]::after { content: none !important; display: none !important; }
html body[data-dh] .op-terms-btn[class][class]:hover { background: rgba(227,194,122,.12) !important; }
/* 10-19 주인 "드롭다운 메뉴들 아래 화살표 오른쪽 여백 없는거 넣어주기": 다크 고르기 칸 모두 밝은 금빛 아래 화살표(오른쪽 16px 여백) */
html body[data-dh] select:not([multiple]):not([data-a]):not([data-b]):not([data-c]) {   /* 계산기 칸 바탕 규칙(.ccalc …)보다 우선 */  -webkit-appearance: none !important; appearance: none !important; background-repeat: no-repeat !important; background-position: right 16px center !important; background-size: 14px 8px !important; padding-right: 44px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23e9dcc0' stroke-width='1.6'/%3E%3C/svg%3E") !important; }
/* 10-19 주인 "빛효과 없애줘": 단추 위를 지나가는 빛줄기(dhSweep) — 단추 밖으로 새어 나오던 것까지 모두 없앰 */
html body[data-dh] :is(a, button, .op-btn, .kp-btn, .op-submit, .btn-submit, .k-btn, .op-terms-btn)[class]::after { animation: none !important; }
html body[data-dh] :is(.op-btns .op-btn, .kp-acts .kp-btn, .kp-calc-go .kp-btn, .op-form .op-submit, .pc-out .op-btn, .pc-out .k-btn, form .btn-submit, form button, .op-terms-btn, .op-btn)[class][class]::after { content: none !important; display: none !important; }
html body[data-dh] :is(a, button)[class*="btn"][class]::after, html body[data-dh] form :is(.op-submit, button[type="submit"], .op-terms-btn)[class]::after { content: none !important; display: none !important; animation: none !important; }   /* 빛줄기 조각이 단추 옆에 남던 것까지 */
/* 10-19 주인 "롯데캐슬처럼 버튼 아래정렬": 첫 화면 정보 칸에 무순위 띠(op-hero-remn)가 한 줄 더 있는 단지(챔피언스시티)는 단추가 4줄까지만 걸쳐 가운데쯤 떠 있던 것 → 5줄 전체에 걸쳐 맨 아래에 붙게 */
.op-hero-panel .op-wrap:has(> .op-hero-remn) > .op-btns { grid-row: 1 / span 5 !important; }
/* 10-19 주인 "뒤에 음영이 있어": 아래 쪽들(계산기 등) 본문 칸(sub-content)에 바탕 그라데이션이 한 겹 더 깔려 가운데만 띠처럼 보이던 것 → 갤러리처럼 모든 쪽에서 뺌(바깥 main 바탕 하나만) */
html body[data-dh] main.sub > .sub-content, html body[data-dh] .sub .sub-content { background: none !important; background-image: none !important; }
/* 10-19 위파크 '장기일반민간임대' 쪽 다크 */
html body[data-dh] .rt-intro h2, html body[data-dh] .rt-h { color: #f3ead6 !important; } html body[data-dh] .rt-intro p { color: #d8cfbd !important; }
html body[data-dh] .rt-zero li { background: rgba(255,255,255,.05) !important; border-color: var(--dh-line) !important; } html body[data-dh] .rt-zero b { color: var(--dh-gold) !important; } html body[data-dh] .rt-zero span { color: #cfc6b3 !important; }
html body[data-dh] .rt-cmp thead th { background: rgba(227,194,122,.12) !important; color: #f3ead6 !important; }

/* ===== 2026-10-20 주인 "고쳐줘"(전 페이지 테스트에서 나온 다크판 밝은 부분) + "pc메뉴 하단 하얀선 모바일 선처럼" ===== */
/* PC 메뉴 아래 흰 선 = 드롭다운 바탕(.gnb-bg)의 연회색 윗선(#e2e2e2)이 머리 줄 아래 테마색 선(::after)을 덮던 것 → 윗선 투명, 휴대폰과 같은 테마색 선이 보이게 (10-20 주인 "PC도 테마색으로") */
html body[data-dh] .site-header .gnb-bg{border-top-color:transparent!important;box-shadow:none!important}
/* PC '고르는 이유' 카드(.op-cards li): 크림색 바탕에 연한 본문이라 안 읽히던 것 → 휴대폰처럼 어두운 바탕 + 금색 테두리, 제목·본문 밝게 */
html body[data-dh] .op-sec ul.op-cards > li:not(.op-card-cta){background:none!important}   /* 10-20 테두리 넣었던 것 뺌(주인 "테두리 다 넣어놓고") — 휴대폰과 같게 바탕만 투명 */
html body[data-dh] .op-sec ul.op-cards > li h3{color:#f3ead6!important;-webkit-text-fill-color:#f3ead6!important}
html body[data-dh] .op-sec ul.op-cards > li p{color:#d9d4c8!important;-webkit-text-fill-color:#d9d4c8!important}
/* 휴대폰 전체 메뉴 판(.gnb): 원래 사이트 style.css 의 흰 바탕이 남던 것 → 머리 줄과 같은 남색, 글씨 밝게, 줄은 금색 */
@media (max-width:1024px){
html body[data-dh] .gnb{background:#0d1022!important;color:#ebe5d8!important}
html body[data-dh] .gnb li{border-color:rgba(227,194,122,.18)!important}
html body[data-dh] .gnb a{color:#ebe5d8!important;-webkit-text-fill-color:#ebe5d8!important}
html body[data-dh] .gnb ul ul,html body[data-dh] .gnb .sub,html body[data-dh] .gnb .d2-wrap{background:rgba(255,255,255,.04)!important}
html body[data-dh] .gnb ul ul a,html body[data-dh] .gnb .sub a{color:#cfc6b4!important;-webkit-text-fill-color:#cfc6b4!important}
html body[data-dh] .gnb a:hover,html body[data-dh] .gnb a:focus-visible,html body[data-dh] .gnb .on > a{color:#e3c27a!important;-webkit-text-fill-color:#e3c27a!important}
}
/* 10-20 주인 "루미트리에 테마색이 청색이잖아 · 테마색으로": 머리 줄 아래·휴대폰 하단 메뉴 위 선을 단지 테마색(--dh-th)으로 — 루미트리에(청색)·SK뷰(주황)는 이미 테마색이라 그대로 */
html body[data-dh]:not([data-dh="lumitrie"]):not([data-dh="skview"]) .site-header::after{background:linear-gradient(90deg, transparent, var(--dh-th) 50%, transparent)!important}
@media (max-width:1024px){html body[data-dh]:not([data-dh="lumitrie"]):not([data-dh="skview"]) .mobile-bar::before{background:linear-gradient(90deg, transparent, var(--dh-th) 50%, transparent)!important}}
/* 10-20 주인 "가운데 경계선 어떤거는 테마색으로 맞추고 어떤거 놔두고": 바닥글 위 선·첫 화면 아래 패널 위 선도 머리 줄·하단 메뉴 선과 같은 테마색(--dh-th) — 루미트리에·SK뷰는 원래 테마색이라 그대로 */
html body[data-dh]:not([data-dh="lumitrie"]):not([data-dh="skview"]) .site-footer::before,html body[data-dh]:not([data-dh="lumitrie"]):not([data-dh="skview"]) .op-hero-panel::before{background:linear-gradient(90deg, transparent, var(--dh-th) 50%, transparent)!important}
/* 10-20 주인 "여기선도 어울리게": 하위 쪽 탭(.lnb) 사이 선 — 연한 금색 → 다른 경계선과 같은 테마색 (루미트리에·SK뷰는 다른 선과 같은 원래 테마 강조색) */
html body[data-dh]{--dh-lnb:var(--dh-th)}
html body[data-dh="lumitrie"],html body[data-dh="skview"]{--dh-lnb:var(--lux-gold)}
html body[data-dh] .lnb,html body[data-dh] .lnb ul{border-color:color-mix(in srgb, var(--dh-lnb) 40%, transparent)!important}
html body[data-dh] .lnb a:not(.on):not([aria-current]),html body[data-dh] .sub-visual .lnb a:not(.on):not([aria-current]){border-color:color-mix(in srgb, var(--dh-lnb) 40%, transparent)!important;box-shadow:none!important}   /* 10-20 "아래 선처럼 얇은선": 밑선 그림자 빼서 테두리 1px 만 */
html body[data-dh] .sub-visual .lnb{border-bottom-width:0!important}   /* 맨 아래 줄 탭 칸 밑선과 겹쳐 2px 되던 것 → 1px */
/* 10-20 주인 "타입비교 글 잘안보여": 평면 타입 비교(.hs-compare) 값(dd)이 어두운 글씨라 안 보이던 것 → 밝게, 이름(dt)도 조금 밝게 */
html body[data-dh] .hs-compare dd{color:#f3ead6!important;-webkit-text-fill-color:#f3ead6!important}
html body[data-dh] .hs-compare dt{color:#b9b2a3!important;-webkit-text-fill-color:#b9b2a3!important}
/* 10-20 주인 "안사라지고 계속 남아있어": 원본 .show(늘 보임)를 다크에선 덮음 — 스크롤 중(.dh-show)에만 보이고 그때 눌림 */
html body[data-dh] .hs-backtop.show:not(.dh-show){opacity:0!important;pointer-events:none!important}
html body[data-dh] .hs-backtop.dh-show{opacity:.92!important;pointer-events:auto!important}
/* 10-20 주인 "pc탭 하단에도 선": 모바일처럼 탭 아래 얇은 선 (색은 기존 탭 선 색 그대로) */
@media (min-width:1025px){html body[data-dh] .sub-visual .lnb a{border-bottom-width:1px!important;border-bottom-style:solid!important}}
/* 10-20 주인 "2번(지역 이름 한 줄) 전체 단지에, 광주만": 첫 화면 큰 제목 위 작은 한 줄 — 다크는 금색 */
html body[data-dh] .op-hero .op-hero-copy .hc-local{display:block!important;margin:0 0 10px!important;font-size:clamp(15px,1.2vw,19px)!important;font-weight:500!important;letter-spacing:.04em!important;line-height:1.4!important;color:#e3c27a!important;-webkit-text-fill-color:#e3c27a!important;text-shadow:0 1px 6px rgba(0,0,0,.55)!important;word-break:keep-all!important}