@charset "utf-8";
/* ============================================================
   더한 에비뉴 — 현장 전용 스타일
   2026-09-28 제작. 레퍼런스 템플릿 위에 덮어쓰는 층이다.
   브랜드: 남색 #1E2A59 / 배경남색 #2F2E58 / 금색 #E3B965 / 브라운 #3E2E1F
   ============================================================ */
:root{
  /* ── 브랜드 팔레트 (전단 실측) ── */
  --brand-navy:#1E2A59;
  --brand-navy-deep:#2F2E58;
  --brand-gold:#E3B965;
  --brand-gold-light:#FFDA89;
  --brand-brown:#3E2E1F;
  --brand-ivory:#DFD7C8;

  /* ── 레이아웃 (레퍼런스가 쓰기만 하고 정의 안 한 것) ── */
  --page-margin: 40px;
  --header-height: 88px;
  --main-inner-size: 1680px;
  --width: 1920;
  --device-width: 100vw;

  /* 🔴 아래 9종도 레퍼런스가 쓰기만 하고 정의하지 않았다.
     특히 --primary-color 는 39곳에서 쓰여, 없으면 「GRAND OPEN」 강조 카드·
     버튼 hover·활성 탭의 배경색이 통째로 사라진다. */
  --primary-color: #1E2A59;
  --point_color: #E3B965;
  --default-transition: .3s cubic-bezier(.22,1,.36,1);
  --slow-transition: .6s cubic-bezier(.22,1,.36,1);
  --ease-out: cubic-bezier(.22,1,.36,1);
  /* 2026-10-13: 영문 제목(SALES SCHEDULE·Unit Plan·COMMUNITY·서브 배너)은 레퍼런스와 같은
     Gilda Display 세리프로 복구. 9/28 에 Pretendard 로 덮어써 고딕으로 보이던 것 */
  --font-en: "Gilda Display", 'Noto Serif KR', serif;
  --en-font: "Gilda Display", 'Noto Serif KR', serif;
  --location_nav_menubg: #1E2A59;
  --location_nav_menuhover: #E3B965;
}

/* ══════════════════════════════════════════════════════════════
   🔴 레퍼런스가 쓰기만 하고 정의하지 않은 CSS 변수들 (2026-09-28)
   `--page-margin` `--header-height` `--main-inner-size` `--width`
   `--device-width` 는 레퍼런스 CSS 4개 어디에도 정의가 없다(전수 확인).
   정의가 없으면 `padding: 0 var(--page-margin)` 같은 규칙이 통째로 무효가 되어
   헤더 여백이 0 이 되고 로고가 화면 왼쪽 끝에 붙는다.
   ══════════════════════════════════════════════════════════════ */
:root{
  --page-margin: 40px;
  --header-height: 88px;
  --main-inner-size: 1680px;
  --width: 1920;
  --device-width: 100vw;
}
@media (max-width:1024px){
  :root{
    --page-margin: 20px;
    --header-height: 62px;
    --width: 768;
  }
}
@media (max-width:600px){
  :root{ --page-margin: 16px; --header-height: 56px; --width: 390; }
}


/* ── 히어로 타이틀 (레퍼런스의 SVG 로고타입 대체) ── */
.hero_title--text{
  display:flex; flex-direction:column; gap:.06em;
  margin:0; padding:0;
  font-family:'Pretendard Variable',Pretendard,'Noto Sans KR',sans-serif;
  color:#fff;
  font-weight:800;
  font-size:clamp(34px,4.6vw,68px);
  line-height:1.16;
  letter-spacing:-.035em;
  text-shadow:0 2px 24px rgba(10,12,26,.45);
  white-space:nowrap;
}
.hero_title--text .hero_title_ln{ display:block; }
.hero_title--text em{
  font-style:normal;
  color:var(--brand-gold);
}
@media (max-width:1024px){
  .hero_title--text{ font-size:clamp(28px,7.4vw,44px); letter-spacing:-.04em; }
}
@media (max-width:360px){
  .hero_title--text{ font-size:26px; }
}

/* ── 히어로 포인트 ── */
.hero_points b{ color:var(--brand-gold); font-weight:800; }

/* ── 금색 강조 테마 (레퍼런스 theme-pink 를 대체) ── */
.premium_item.theme-gold .premium_label span,
.premium_item.theme-gold strong{ color:var(--brand-gold); }
.premium_item.theme-gold .premium_line{ background:var(--brand-gold); }
@media (max-width:1024px){
  .premium_item.theme-mo-gold .premium_label span,
  .premium_item.theme-mo-gold strong{ color:var(--brand-gold); }
  .premium_item.theme-mo-gold .premium_line{ background:var(--brand-gold); }
}

/* ── 푸터 시행/시공/분양대행 텍스트화 ── */
.footer_company_item{ display:inline-flex; align-items:center; gap:.35em; }
.footer_company_item em{ font-style:normal; opacity:.72; }
.footer_logo{ height:auto; max-height:46px; width:auto; }


/* ── 헤더 로고 ────────────────────────────────────────────────
   히어로 위(투명 헤더)  : 금색판 logo_hero.png
   흰 배경 헤더(.bk/.on/.active) : 원본 남색판 logo.png
   🔴 filter:invert 를 쓰면 「로고」 캡슐이 흰색으로 채워져 글자가 사라진다.
      그래서 이미지 자체를 바꾼다(content:url).                      */
/* 2026-10-13 대표님 지시 「배경이 있을 땐 로고를 하얀색으로」
   사진·어두운 배경 위 = 흰색판 / 흰 배경 헤더 = 남색판.
   로고는 원본 벡터(petname_full.svg)에서 다시 뽑은 v2 — 옛 logo_white.png 는
   「로고」 상자와 글자가 둘 다 흰색이라 글자가 사라져 있었다. */
.temp_header_skin1 .header_logo{
  height:27px; width:auto; display:block;
  content:url('/assets/img/logo/logo_white_v2_thehan.png');
  filter:none;
}
.temp_header_skin1.bk .header_logo,
.temp_header_skin1.on .header_logo,
.temp_header_skin1.active .header_logo{
  content:url('/assets/img/logo/logo_navy_v2_thehan.png');
  filter:none;
}
@media (max-width:1024px){
  .temp_header_skin1 .header_logo{ height:22px; }
  /* 모바일 스크롤 중 투명 헤더(.on 이지만 .bk 아님)는 사진 위다 → 흰색 */
  body.is-mobile-native-scroll .temp_header_skin1.on:not(.bk) .header_logo{
    content:url('/assets/img/logo/logo_white_v2_thehan.png');
  }
}


/* ══════════════════════════════════════════════════════════════
   인트로 — 더한 에비뉴 전용 (2026-09-28 신설)
   레퍼런스의 「착.」 글자 아트 연출을 걷어내고 우리 문구로 새로 짰다.
   남색 바탕 + 금색 강조. 총 약 3.4초, SKIP 가능.
   ══════════════════════════════════════════════════════════════ */
.sv-intro{
  position:fixed; inset:0; z-index:100100;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  background:#1E2A59;
}
.sv-intro__bg{
  position:absolute; inset:0;
  background:
    radial-gradient(1100px 620px at 18% 12%, rgba(227,185,101,.13), transparent 62%),
    radial-gradient(900px 520px at 86% 88%, rgba(227,185,101,.09), transparent 62%),
    linear-gradient(160deg,#243059 0%,#1E2A59 48%,#181F42 100%);
}
.sv-intro__stage{
  position:relative; text-align:center; padding:0 24px;
  color:#fff;
  font-family:'Pretendard Variable',Pretendard,-apple-system,'Apple SD Gothic Neo',sans-serif;
}
/* 상단 마크 */
.sv-intro__mark{
  display:block; margin:0 auto 26px; width:54px;
  opacity:0; transform:translateY(10px) scale(.92);
}
.sv-intro__mark img{ width:100%; height:auto; display:block; }
/* 리드 문구 (교체형) */
.sv-intro__lead{
  position:relative; height:1.6em; margin-bottom:18px;
  font-size:clamp(13px,1.55vw,17px); font-weight:600;
  letter-spacing:.06em; color:rgba(255,255,255,.66);
}
.sv-intro__lead-item{
  position:absolute; left:50%; top:0; transform:translate(-50%,8px);
  white-space:nowrap; opacity:0;
}
/* 메인 타이틀 */
.sv-intro__title{
  display:flex; flex-direction:column; gap:.08em;
  font-size:clamp(30px,5.0vw,66px); font-weight:800;
  line-height:1.2; letter-spacing:-.04em; margin:0 0 26px;
}
.sv-intro__ln{ display:block; white-space:nowrap; }
.sv-intro__w{ display:inline-block; opacity:0; transform:translateY(16px); }
/* inline-block 은 끝 공백을 먹는다 → 금색 어절 앞에 간격을 직접 준다 */
.sv-intro__title em.sv-intro__w{ margin-left:.24em; }
.sv-intro__title em{ font-style:normal; color:#E3B965; }
/* 구분선 + 서명 */
.sv-intro__rule{
  display:block; width:0; height:2px; margin:0 auto 18px;
  background:#E3B965; opacity:.9;
}
.sv-intro__sig{
  font-size:clamp(12px,1.35vw,15px); font-weight:600;
  letter-spacing:.16em; color:rgba(255,255,255,.72);
  opacity:0; transform:translateY(8px);
}
/* SKIP */
.sv-intro__skip{
  position:absolute; right:clamp(18px,3vw,46px); bottom:clamp(18px,3vw,46px);
  width:74px; height:74px; border-radius:50%;
  border:1px solid rgba(227,185,101,.5); background:rgba(255,255,255,.04);
  color:#E3B965; font-size:12px; font-weight:700; letter-spacing:.14em;
  cursor:pointer; opacity:0;
  transition:background .2s ease,border-color .2s ease;
}
.sv-intro__skip:hover{ background:rgba(227,185,101,.14); border-color:#E3B965; }
@media (max-width:1024px){
  .sv-intro__mark{ width:44px; margin-bottom:20px; }
  .sv-intro__title{ font-size:clamp(26px,7.4vw,40px); }
  .sv-intro__skip{ width:60px; height:60px; font-size:11px; }
}
@media (max-width:360px){
  .sv-intro__title{ font-size:24px; }
}
/* 인트로 동안 본문 스크롤 잠금 */
body.is-intro{ overflow:hidden; }
/* 모션 최소화 선호 */
@media (prefers-reduced-motion:reduce){
  .sv-intro__mark,.sv-intro__w,.sv-intro__sig,.sv-intro__skip{ opacity:1 !important; transform:none !important; }
  .sv-intro__rule{ width:56px !important; }
}


/* ══════════════════════════════════════════════════════════════
   🔴 정의 없이 쓰이던 유틸 클래스 (2026-09-28)
   레퍼런스 CSS 에 규칙이 없어서 `.hidden` 이 붙은 스크린리더용 제목이
   화면에 32px 검은 글씨로 그대로 노출되고 있었다(헤더 위에 겹쳐 보임).
   `.m-only` 도 정의가 없어 PC 에서 모바일 전용 줄바꿈이 그대로 먹었다.
   ══════════════════════════════════════════════════════════════ */
.hidden{
  position:absolute !important;
  width:1px !important; height:1px !important;
  margin:-1px !important; padding:0 !important; border:0 !important;
  clip:rect(0 0 0 0) !important; clip-path:inset(50%) !important;
  overflow:hidden !important; white-space:nowrap !important;
}
.m-only{ display:none; }
@media (max-width:1024px){
  .m-only{ display:inline; }
  br.m-only{ display:block; }
}

/* ── 모집공고 준비중 버튼 (자료 대기 중) ── */
.sansu_gonggo_wait .gonggo_btn.is-wait{
  cursor:default; pointer-events:none; opacity:.72;
}
.sansu_gonggo_wait .gonggo_btn.is-wait h3{
  font-size:14px; letter-spacing:.02em; opacity:.9;
}


/* ══════════════════════════════════════════════════════════════
   히어로 재배치 (2026-09-28)
   레퍼런스는 히어로 타이틀이 453px 짜리 SVG 글자아트였고,
   `.hero_points` 는 그 옆(left:512px)에 절대좌표로 붙어 있었다.
   우리는 타이틀을 텍스트로 바꿨으므로 그 좌표가 전부 어긋난다
   (모바일에서는 화면 밖으로 나가 세 줄이 한 줄에 겹쳐 보였다).
   → 절대배치를 풀고 타이틀 아래 세로 배치로 바꾼다.
   ══════════════════════════════════════════════════════════════ */
.section_hero .hero_inner{
  position:relative;
  display:flex; flex-direction:column; align-items:flex-start;
  justify-content:center;
  height:100%;
  padding:0 var(--page-margin);
  max-width:var(--main-inner-size); margin:0 auto;
}
.section_hero .hero_copy{
  position:static !important;
  transform:none !important;
  margin-top:30px;
}
.section_hero .hero_points{
  position:static !important;
  transform:none !important;
  align-items:flex-start !important;
  gap:11px !important;
}
.section_hero .hero_points li{
  /* 2026-10-13: opacity:1 !important 제거 — !important 는 등장 애니메이션을 영영 막는다.
     보이기·등장 연출은 맨 아래 「전면 개편」 절에서 처리 */
  font-size:clamp(14px,1.45vw,19px) !important;
  color:rgba(255,255,255,.94) !important;
  font-weight:500;
  text-shadow:0 1px 12px rgba(10,12,26,.55);
  white-space:nowrap;
}
.section_hero .hero_points li b{ color:#E3B965 !important; font-weight:800; }
/* 타이틀 옆 장식선은 좌표 기반이라 우리 구조에선 어긋난다 → 숨김 */
.section_hero .hero_copy_line{ display:none !important; }

@media (max-width:1024px){
  .section_hero .hero_inner{ justify-content:flex-start; padding-top:22vh; }
  .section_hero .hero_copy{ margin-top:24px; }
  .section_hero .hero_points li{ font-size:14px !important; }
}
@media (max-width:360px){
  .section_hero .hero_points li{ font-size:13px !important; }
}

/* 🔴 모바일에서 레퍼런스는 hero_points 를 flex-direction:row 로 눕힌다.
   원본 문구는 「광명의 중심에 착」처럼 짧아 한 줄에 들어갔지만,
   우리 문구(「무등산을 품은 숲세권」…)는 434px 라 390px 화면을 넘쳐
   세 줄이 타이틀 위에 겹쳐 보였다. → 모바일에서도 세로 유지. */
@media (max-width:1024px){
  .section_hero .hero_points{
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:9px !important;
  }
  .section_hero .hero_points li{ white-space:normal !important; }
}

/* 🔴 `.hero_title` `.hero_copy` 는 레퍼런스에서 둘 다 position:absolute 였다
   (SVG 글자아트 454px + 그 옆 641px 카피를 좌표로 붙이는 구조).
   텍스트 타이틀로 바꾼 우리 구조에서는 두 덩어리가 같은 자리에 겹친다.
   → 절대배치를 풀고 폭 제한도 해제해 일반 흐름으로 쌓는다. */
.section_hero .hero_title,
.section_hero .hero_title--text{
  position:static !important;
  width:auto !important; max-width:none !important;
  margin:0 !important;
}
.section_hero .hero_copy{
  position:static !important;
  width:auto !important; max-width:none !important;
}

/* ══════════════════════════════════════════════════════════════
   프리미엄 페이지 헤드 (2026-09-28)
   🔴 레퍼런스 `head.svg` 에는 「광명 시티프라디움 에듀하임 PREMIUM 6」 이
   글자가 아니라 path 로 굳어 박혀 있었다 — 문자열 검사로는 절대 안 잡힌다.
   우리 문구·개수(7가지)로 텍스트 마크업을 새로 만들어 교체했다.
   ══════════════════════════════════════════════════════════════ */
.sansu_prem_head{ text-align:center; margin-bottom:56px; }
.sansu_prem_head p{ margin:0; }
.sansu_prem_eyebrow{
  font-size:clamp(12px,1.05vw,15px); font-weight:600;
  letter-spacing:.02em; color:var(--brand-navy); opacity:.72; margin-bottom:6px !important;
}
.sansu_prem_title{
  font-size:clamp(34px,4.0vw,58px); font-weight:800;
  letter-spacing:.06em; color:var(--brand-navy); line-height:1.05;
}
.sansu_prem_num{
  font-size:clamp(52px,6.4vw,92px); font-weight:800; line-height:1;
  color:var(--brand-gold); margin-top:2px !important;
}
.sansu_prem_sub{
  margin-top:12px !important;
  font-size:clamp(13px,1.2vw,17px); font-weight:600;
  letter-spacing:-.01em; color:var(--brand-navy); opacity:.86;
}
@media (max-width:1024px){ .sansu_prem_head{ margin-bottom:34px; } }

/* ── E-모델하우스: VR 투어 대신 3D 평면 (2026-09-29) ── */
.sansu_emodel_view{ position:relative; text-align:center; }
.sansu_emodel_view img{
  width:100%; height:auto; display:block;
  border-radius:8px; background:#f6f6f8;
}
.sansu_emodel_view .image_cut{
  position:absolute; right:12px; bottom:10px;
  font-size:11px; color:rgba(0,0,0,.42); letter-spacing:-.01em;
}

/* ══════════════════════════════════════════════════════════════
   신규 이식 페이지 (2026-09-29)
   레퍼런스에 있는데 처음에 안 가져왔던 페이지들 — 우리 자료로 채웠다.
   ══════════════════════════════════════════════════════════════ */
/* ── 공급안내 : 타입별 면적표 ── */
.sansu_supply{ max-width:1100px; margin:0 auto; }
.sansu_supply_tbl{
  width:100%; border-collapse:collapse; font-size:15px;
  border-top:2px solid var(--brand-navy);
}
.sansu_supply_tbl caption{
  text-align:left; font-size:20px; font-weight:800; color:var(--brand-navy);
  padding-bottom:14px; letter-spacing:-.02em;
}
.sansu_supply_tbl caption span{ font-size:13px; font-weight:500; opacity:.6; margin-left:6px; }
.sansu_supply_tbl th,.sansu_supply_tbl td{
  padding:14px 10px; text-align:center; border-bottom:1px solid #e6e6ec;
  letter-spacing:-.01em;
}
.sansu_supply_tbl thead th{
  background:#f5f5f8; color:var(--brand-navy); font-weight:700; font-size:14px;
}
.sansu_supply_tbl tbody td strong{ color:var(--brand-navy); font-weight:800; }
.sansu_supply_tbl tfoot td{ background:#fafafc; font-weight:600; }
.sansu_supply_note{ margin-top:14px; font-size:13px; color:#777; line-height:1.7; }

/* ── 동호수 : 동별 구성표 ── */
.sansu_dong_tbl{ max-width:900px; margin:0 auto; }
.sansu_dong_tbl table{
  width:100%; border-collapse:collapse; font-size:15px;
  border-top:2px solid var(--brand-navy);
}
.sansu_dong_tbl caption{
  text-align:left; font-size:20px; font-weight:800; color:var(--brand-navy);
  padding-bottom:14px;
}
.sansu_dong_tbl th,.sansu_dong_tbl td{
  padding:15px 10px; text-align:center; border-bottom:1px solid #e6e6ec;
}
.sansu_dong_tbl thead th{ background:#f5f5f8; color:var(--brand-navy); font-weight:700; font-size:14px; }
.sansu_dong_note{ margin-top:14px; font-size:13px; color:#777; }

@media (max-width:1024px){
  .sansu_supply_tbl, .sansu_dong_tbl table{ font-size:12.5px; }
  .sansu_supply_tbl th,.sansu_supply_tbl td,
  .sansu_dong_tbl th,.sansu_dong_tbl td{ padding:10px 4px; }
  .sansu_supply_tbl caption,.sansu_dong_tbl caption{ font-size:17px; }
}

/* ── 입지환경 : 주변시설 목록 ── */
.location_info_list{ max-width:1100px; margin:34px auto 0; padding:0; list-style:none; }
.location_info_list li{
  display:flex; gap:18px; align-items:flex-start;
  padding:15px 4px; border-bottom:1px solid #ececf1;
}
.location_info_list li strong{
  flex:0 0 96px; color:var(--brand-navy); font-weight:800; font-size:15px;
}
.location_info_list li span{ color:#555; font-size:15px; line-height:1.65; letter-spacing:-.015em; }
@media (max-width:1024px){
  .location_info_list li{ flex-direction:column; gap:6px; padding:13px 2px; }
  .location_info_list li strong{ flex:none; font-size:14px; }
  .location_info_list li span{ font-size:13.5px; }
}

/* ── 커뮤니티 페이지 : 6종 카드 ── */
.sansu_comm{ max-width:1240px; margin:0 auto; }
.sansu_comm_head{ text-align:center; margin-bottom:46px; }
.sansu_comm_eyebrow{
  font-size:13px; font-weight:700; letter-spacing:.32em; color:var(--brand-gold);
  margin:0 0 12px; padding-left:.32em;
}
.sansu_comm_title{
  font-size:clamp(24px,2.9vw,40px); font-weight:800; line-height:1.34;
  letter-spacing:-.035em; color:var(--brand-navy); margin:0;
}
.sansu_comm_list{
  display:grid; grid-template-columns:repeat(3,1fr); gap:30px 26px;
  list-style:none; padding:0; margin:0;
}
.sansu_comm_list li{ text-align:left; }
.sansu_comm_thumb{ position:relative; border-radius:10px; overflow:hidden; }
.sansu_comm_thumb img{ width:100%; height:auto; display:block; }
.sansu_comm_thumb .image_cut{
  position:absolute; right:10px; bottom:8px;
  font-size:11px; color:rgba(255,255,255,.72); text-shadow:0 1px 4px rgba(0,0,0,.4);
}
.sansu_comm_list strong{
  display:block; margin-top:16px; font-size:19px; font-weight:800;
  color:var(--brand-navy); letter-spacing:-.025em;
}
.sansu_comm_list p{ margin-top:6px; font-size:14.5px; color:#666; letter-spacing:-.015em; }
@media (max-width:1024px){
  .sansu_comm_list{ grid-template-columns:repeat(2,1fr); gap:22px 16px; }
  .sansu_comm_list strong{ font-size:16px; margin-top:12px; }
  .sansu_comm_list p{ font-size:13px; }
  .sansu_comm_head{ margin-bottom:30px; }
}
@media (max-width:600px){
  .sansu_comm_list{ grid-template-columns:1fr; }
}

/* ── 입지환경 : 입지 가치 6블록 ── */
.sansu_loc_values{ max-width:1180px; margin:70px auto 0; }
.sansu_loc_values_head{ text-align:center; margin-bottom:42px; }
.sansu_loc_eyebrow{
  font-size:12.5px; font-weight:700; letter-spacing:.34em; color:var(--brand-gold);
  margin:0 0 12px; padding-left:.34em;
}
.sansu_loc_title{
  font-size:clamp(22px,2.6vw,36px); font-weight:800; line-height:1.36;
  letter-spacing:-.035em; color:var(--brand-navy); margin:0;
}
.sansu_loc_list{
  display:grid; grid-template-columns:repeat(3,1fr); gap:26px 24px;
  list-style:none; padding:0; margin:0;
}
.sansu_loc_list li{
  padding:28px 24px 26px; border:1px solid #e8e8ee; border-radius:10px;
  background:#fbfbfd;
}
.sansu_loc_no{
  display:block; font-size:13px; font-weight:800; letter-spacing:.06em;
  color:var(--brand-gold); margin-bottom:12px;
}
.sansu_loc_list strong{
  display:block; font-size:18px; font-weight:800; color:var(--brand-navy);
  letter-spacing:-.03em; line-height:1.35;
}
.sansu_loc_list p{
  margin-top:10px; font-size:14px; color:#666; line-height:1.72; letter-spacing:-.015em;
}
@media (max-width:1024px){
  .sansu_loc_values{ margin-top:44px; }
  .sansu_loc_list{ grid-template-columns:1fr; gap:14px; }
  .sansu_loc_list li{ padding:20px 18px; }
  .sansu_loc_list strong{ font-size:16px; }
  .sansu_loc_list p{ font-size:13.5px; }
}


/* ══════════════════════════════════════════════════════════════
   디자인 교정 1 — 그림자 제거 · 글자 대비 (2026-09-29)
   대표님 지적: "텍스트 뒤 그림자 없는 게 더 깔끔" / "글씨 색 가시성이 안 좋다"

   🔑 색 규칙: 금색(#E3B965)은 **어두운 배경 전용**이다.
      금색 on 남색 = 대비 5.4 ✅ / 금색 on 흰색 = 대비 1.8 🔴
      흰 배경에서 강조가 필요하면 남색(#1E2A59, 대비 12.4)을 쓴다.
   ══════════════════════════════════════════════════════════════ */

/* ── 1) 그림자 전면 제거 ── */
.hero_title--text,
.section_hero .hero_points li,
.temp_header_skin1 .header_logo,
.unit_caption,
.environment_layer_item_caption,
.image_cut,
.sansu_comm_thumb .image_cut,
.sansu_emodel_view .image_cut{
  text-shadow:none !important;
}
.temp_header_skin1 .header_logo{ filter:none !important; }
.temp_header_skin1.bk .header_logo,
.temp_header_skin1.on .header_logo,
.temp_header_skin1.active .header_logo{ filter:none !important; }

/* 사진 위 글자는 그림자 대신 어두운 그라데이션으로 읽힘을 확보한다 */
.section_hero .hero_bg::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(100deg, rgba(14,18,38,.62) 0%, rgba(14,18,38,.34) 42%, rgba(14,18,38,0) 72%);
}

/* ── 2) 흰 배경 위 금색 → 남색 ── */
.sansu_loc_eyebrow,
.sansu_comm_eyebrow,
.sansu_prem_eyebrow{
  color:var(--brand-navy) !important;
  opacity:.9;
}
.sansu_loc_no{
  color:var(--brand-navy) !important;
  opacity:.88;
}
/* 프리미엄: 금색 계열 테마를 남색+금색 밑줄 조합으로 */
.premium_item.theme-gold .premium_label span,
.premium_item.theme-gold strong,
.premium_item.theme-mo-gold .premium_label span,
.premium_item.theme-mo-gold strong{
  color:var(--brand-navy) !important;
}
.premium_item.theme-gold .premium_line,
.premium_item.theme-mo-gold .premium_line{
  background:var(--brand-gold) !important;   /* 선은 금색 유지 — 장식이라 대비 기준 밖 */
}
.sansu_prem_num{
  color:var(--brand-navy) !important;
}
.sansu_prem_num::after{
  content:''; display:block; width:52px; height:3px; margin:14px auto 0;
  background:var(--brand-gold);
}

/* ── 3) 「이미지컷」 라벨 — 흰 글자가 흰 배경에 묻히던 것 ── */
.image_cut,
.sansu_comm_thumb .image_cut,
.sansu_emodel_view .image_cut{
  color:#fff !important;
  background:rgba(20,24,44,.52);
  padding:3px 8px; border-radius:3px;
  font-size:11px; letter-spacing:-.01em; line-height:1.3;
}
.unit_caption,
.environment_layer_item_caption{
  color:rgba(255,255,255,.9) !important;
  background:rgba(20,24,44,.42);
  padding:3px 8px; border-radius:3px;
}

/* ── 4) 세대 타입 색 — 레퍼런스 분홍 계열을 우리 팔레트로 ── */
:root{
  --type-84A:#1E2A59;   /* 흰 글자 대비 12.4 */
  --type-84B:#3E5C8A;   /* 6.0 */
  --type-84C:#7A6A4A;   /* 5.6 */
  --type-113:#8A6E3A;   /* 5.2 */
  --type-59A:#1E2A59;
  --type-59B:#3E5C8A;
  --type-84D:#7A6A4A;
  --type-84E:#8A6E3A;
  --unit-title-bg:#2F2E58;
}

/* ── 5) 본문 회색 글자 대비 올리기 (#777 → #5A5A63, 4.48 → 6.4) ── */
.sansu_supply_note,
.sansu_dong_note,
.location_info_list li span,
.sansu_loc_list p,
.sansu_comm_list p{
  color:#5A5A63 !important;
}

/* 이미지컷 라벨 — 밝은 사진 위에서도 읽히게 배경을 조금 더 진하게 */
.image_cut,
.sansu_comm_thumb .image_cut,
.sansu_emodel_view .image_cut,
.unit_caption,
.environment_layer_item_caption,
.community_caption{
  background:rgba(18,22,40,.62) !important;
  color:#fff !important;
  text-shadow:none !important;
}

/* ══════════════════════════════════════════════════════════════
   디자인 교정 2 — 여백·정렬 통일 (2026-09-29)
   대표님 지적: "선이나 간격 등이 안 맞는 부분이 있다"

   실측: PC 좌우여백이 120 / 170 / 130 / 265px 네 종류로 섞여 있었다.
   원인은 내가 만든 블록들이 부모 `.page_container` 의 여백을 따르지 않고
   각자 max-width(1100·1180·1240·900px)를 들고 있었던 것.
   → 자체 max-width 를 걷고 부모 폭을 그대로 쓴다. 기준 한 줄로 통일.
   ══════════════════════════════════════════════════════════════ */
.sansu_supply,
.sansu_comm,
.sansu_loc_values,
.sansu_dong_tbl,
.location_info_list{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
/* 세로 리듬도 하나로 — 블록 사이 간격 */
.sansu_loc_values{ margin-top:72px !important; }
.sansu_comm_head{ margin-bottom:44px !important; }
.sansu_loc_values_head{ margin-bottom:40px !important; }
@media (max-width:1024px){
  .sansu_loc_values{ margin-top:42px !important; }
  .sansu_comm_head{ margin-bottom:26px !important; }
  .sansu_loc_values_head{ margin-bottom:24px !important; }
}

/* 표는 안쪽에서 넓게 — 단 컨테이너 여백은 부모를 따른다 */
.sansu_supply_tbl,
.sansu_dong_tbl table{ width:100%; }

/* ── 전 페이지 컨테이너 폭 통일 ──────────────────────────────
   레퍼런스는 스킨마다(.temp_overview_skin1 / .temp_community_skin /
   .temp_changeinfo_skin …) `.page_container` 폭이 달라 페이지를 넘길 때마다
   좌우 여백이 120px ↔ 170px 로 튄다. 기준을 하나로 고정한다.
   PC 콘텐츠 폭 1200px(1440 화면에서 좌우 120px) · 모바일 좌우 20px      */
.page_content .page_container{
  max-width:1200px !important;
  width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
  box-sizing:border-box;
}
.page_content .page_inner,
.page_content .page_cont_wrap{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
/* 프리미엄 목록도 같은 기준으로 */
.premium_box,
.premium_list{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
@media (max-width:1024px){
  .page_content .page_container{
    max-width:none !important;
    padding-left:20px !important;
    padding-right:20px !important;
  }
}

/* 프리미엄 카드 안쪽 여백도 기준에 맞춘다 (265px·43px 로 혼자 튀던 것) */
.premium_item{
  padding-left:0 !important;
  padding-right:0 !important;
}
.premium_item .premium_top{ padding-left:0 !important; padding-right:0 !important; }


/* ══════════════════════════════════════════════════════════════
   인트로 개선 (2026-09-29) — 대표님 "인트로 애니메이션 좀 더 연구"
   바꾼 것
     · 글자 그림자 제거 (깔끔하게)
     · 배경에 아주 느린 빛 이동을 넣어 정지화면 느낌 제거
     · 마크는 위에서 내려오며 살짝 커지는 대신 «선이 그어지고» 나타나게
     · 총 길이 약 5.0초 → 3.6초로 단축 (첫 화면 대기는 짧을수록 좋다)
   ══════════════════════════════════════════════════════════════ */
.sv-intro__bg{
  background:
    radial-gradient(1100px 620px at 18% 12%, rgba(227,185,101,.15), transparent 62%),
    radial-gradient(900px 520px at 86% 88%, rgba(227,185,101,.10), transparent 62%),
    linear-gradient(160deg,#243059 0%,#1E2A59 48%,#181F42 100%);
  background-size:160% 160%, 160% 160%, 100% 100%;
  animation:svIntroDrift 14s ease-in-out infinite alternate;
}
@keyframes svIntroDrift{
  from{ background-position:0% 0%, 100% 100%, 0 0; }
  to  { background-position:22% 14%, 78% 86%, 0 0; }
}
.sv-intro__stage{ text-shadow:none; }
.sv-intro__title{ text-shadow:none !important; }
/* 마크 위 짧은 금색 선 — 브랜드 인장 느낌 */
.sv-intro__mark::before{
  content:''; display:block; width:var(--line-w, 0px); height:2px;
  background:var(--brand-gold); margin:0 auto 18px;
}
.sv-intro__mark{ opacity:1; transform:none; }
.sv-intro__mark img{ opacity:0; transform:translateY(8px); }
@media (prefers-reduced-motion:reduce){
  .sv-intro__bg{ animation:none; }
  .sv-intro__mark::before{ width:36px; }
  .sv-intro__mark img{ opacity:1 !important; transform:none !important; }
}