@charset "UTF-8";
/* =========================================================
   TRIVN CENTUM · sub.css (본페이지 서브 전체)
   ---------------------------------------------------------
   · 크기 : PC calc(N * var(--u)) = 1920 시안 px
            모바일 calc(N * var(--m)) = 750 시안 px
   · 등장 : [data-rv] 블록이 화면에 들어오면 sub.js 가 .is-in
   · 순서 : 글꼴 → 공통 → 서브 상단 → 유의사항
            → 사업개요(.bz) → 브랜드(.br) → 프리미엄(.pr)
            → 공원(.pk) → 센텀2지구(.cn) → 오시는길(.lc)
   · 페이지마다 PC 바로 아래에 그 페이지의 모바일이 있습니다
========================================================= */


/* =========================================================
   글꼴
========================================================= */
/* 서브 상단 영문 */
@font-face {
    font-family: 'Futura Light';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url('../font/futura-light.woff2') format('woff2');
}
/* 바탕체 타이틀 (센텀2지구) : 쓰는 글자만 담은 파일 */
@font-face {
    font-family: 'KoPub Batang';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url('../font/kopub-batang-light.woff2') format('woff2');
}


/* =========================================================
   공통
========================================================= */
.sub { position: relative; background: #fff; color: var(--ink); overflow: hidden; padding-bottom: calc(160 * var(--u)); }

/* 시안 컨텐츠 폭 1100 (PC) / 좌우 40 (모바일) */
.sub-in {
    width: calc(1100 * var(--u));
    max-width: calc(100% - 80px);
    margin-left: auto; margin-right: auto;
}

/* 헤더 : 스크롤하면 흰 배경 (sub.js 가 .is-solid) */
.is-sub .tv-hd { transition: background-color .4s ease, box-shadow .4s ease; }
.is-sub .tv-hd.is-solid { background-color: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, .06); }

/* 등장 : 아래에서 살짝 떠오르며 나타남 (style="--dl:지연") */
.js [data-rv] {
    opacity: 0;
    transform: translate3d(0, 40px, 0);
    transition: opacity 1s ease var(--dl, 0s), transform 1.2s var(--ease) var(--dl, 0s);
}
.js [data-rv].is-in { opacity: 1; transform: none; }

/* 사선 */
.s-slash { display: block; overflow: visible; }
.s-slash path { fill: none; stroke: #9b9b9b; stroke-width: 1; vector-effect: non-scaling-stroke; }

/* 「 」 괄호 : 왼쪽 위 / 오른쪽 아래 모서리 */
.s-br { position: relative; display: inline-block; }
.s-br::before, .s-br::after {
    content: ''; position: absolute;
    width: calc(14 * var(--u)); height: calc(14 * var(--u));
    min-width: 8px; min-height: 8px;
    border: 0 solid currentColor;
}
.s-br::before { left: 0; top: 0; border-left-width: 1px; border-top-width: 1px; }
.s-br::after { right: 0; bottom: 0; border-right-width: 1px; border-bottom-width: 1px; }

/* 모바일 하단 바 : 오픈 날짜의 한글 '월·일' */
.tv-mbar__soon small { font-size: .88em; font-weight: 700; }


/* =========================================================
   서브 공통 상단 (.sv)
   · 배경 : 처음부터 보임 · 천천히 줌아웃하며 제자리 + 빛줄기 한 번 → 고정
   · 영문 : 흩어진 글자가 가운데부터 모여듦 / 국문 : 한 글자씩 떠오름
========================================================= */
.sv {
    position: relative;
    height: calc(542 * var(--u)); min-height: 340px;
    overflow: hidden;
    background: #15181b;
    color: #fff;
}
.js .sv[data-rv] { opacity: 1; transform: none; }
.sv__bg { position: absolute; inset: 0; }
.sv__bg picture, .sv__bg img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    max-width: none;
    object-fit: cover;
}
.sv__bg img {
    transform: translate3d(2%, 0, 0) scale(1.14);
    backface-visibility: hidden;
    will-change: transform;
    transition: transform 5s cubic-bezier(.19, 1, .22, 1) .1s;
}
.sv.is-in .sv__bg img { transform: translate3d(0, 0, 0) scale(1); }
.sv__bg::before {
    content: ''; position: absolute; z-index: 1; top: 0; bottom: 0; left: 0;
    width: 55%;
    background: linear-gradient(100deg, rgba(255, 244, 228, 0) 0%, rgba(255, 244, 228, .14) 42%, rgba(255, 255, 255, .22) 50%, rgba(255, 244, 228, .14) 58%, rgba(255, 244, 228, 0) 100%);
    opacity: 0;
    transform: translate3d(-110%, 0, 0) skewX(-14deg);
    pointer-events: none;
}
.sv.is-in .sv__bg::before { animation: svSweep 3.6s cubic-bezier(.45, 0, .25, 1) 1.4s forwards; }
@keyframes svSweep {
    0%   { opacity: 0; transform: translate3d(-110%, 0, 0) skewX(-14deg); }
    18%  { opacity: 1; }
    82%  { opacity: 1; }
    100% { opacity: 0; transform: translate3d(260%, 0, 0) skewX(-14deg); }
}
.sv__bg::after {
    content: ''; position: absolute; inset: 0;
    background: #000;
    opacity: .55;
    transition: opacity 3.6s ease .3s;
}
.sv.is-in .sv__bg::after { opacity: .12; }

.sv__txt {
    position: absolute; z-index: 1; left: 0; right: 0;
    top: calc(234 * var(--u));
    text-align: center;
    text-shadow: 0 2px 18px rgba(0, 0, 0, .12);
}
.sv__en {
    padding-left: .28em;   /* 마지막 글자 뒤 자간 보정 → 가운데 정렬 */
    font-family: 'Futura Light', var(--ff-en);
    font-size: max(26px, calc(48 * var(--u)));
    font-weight: 300;
    line-height: 1;
    letter-spacing: .28em;
    white-space: nowrap;
}
.sv__en span {
    display: inline-block;
    opacity: 0;
    filter: blur(6px);
    will-change: transform, opacity, filter;
    transform: translate3d(calc(var(--x) * 1em), calc(var(--y) * .7em), 0) scale(1.5);
    transition:
        opacity 1.4s ease calc(1.2s + var(--d) * .09s),
        filter 1.6s ease calc(1.2s + var(--d) * .09s),
        transform 2.4s cubic-bezier(.19, 1, .22, 1) calc(1.2s + var(--d) * .09s);
}
.sv.is-in .sv__en span { opacity: 1; filter: none; transform: none; }
.sv__tit {
    margin-top: calc(33 * var(--u));
    font-size: max(15px, calc(27 * var(--u)));
    font-weight: 500;
    line-height: 1;
    letter-spacing: -.02em;
}
.sv__tit-in, .sv__tit-tx { display: inline-block; }
.sv__tit-tx span {
    display: inline-block;
    opacity: 0;
    filter: blur(5px);
    transform: translate3d(0, .45em, 0);
    will-change: transform, opacity, filter;
    transition:
        opacity 1.4s ease calc(2.6s + var(--k) * .09s),
        filter 1.6s ease calc(2.6s + var(--k) * .09s),
        transform 1.8s cubic-bezier(.19, 1, .22, 1) calc(2.6s + var(--k) * .09s);
}
.sv.is-in .sv__tit-tx span { opacity: 1; filter: none; transform: none; }

/* 우측 플로팅 (메인 섹션1 과 같은 크기 · 위치) */
.sv__float {
    position: absolute; z-index: 3;
    right: calc(58 * var(--u)); top: calc(116 * var(--u));
    display: flex; flex-direction: column; align-items: center;
    gap: calc(22 * var(--u));
}
.sv__float > * {
    opacity: 0;
    transform: scale(.5) rotate(-25deg);
    transition: opacity 1s ease 3.8s, transform 1.5s cubic-bezier(.2, 1.3, .3, 1) 3.8s;
}
.sv__float > * + * { transition-delay: 3.95s; }
.sv.is-in .sv__float > * { opacity: 1; transform: none; }
.sv__reg {
    position: relative;
    display: flex; align-items: center; justify-content: center;
    width: calc(148 * var(--u)); min-width: 108px;
    aspect-ratio: 1;
    color: #fff;
}
.sv__ring {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    overflow: visible;
    animation: svSpin 26s linear infinite;
}
@keyframes svSpin { to { transform: rotate(360deg); } }
.sv__ring text { fill: currentColor; font-family: var(--ff-en); font-weight: 600; font-size: 11.5px; letter-spacing: 3px; }
.sv__ring-line { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.sv__reg-txt {
    position: relative;
    font-size: max(12px, calc(16 * var(--u)));
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    letter-spacing: -.02em;
}
.sv__soon {
    display: flex; align-items: center; justify-content: center;
    width: calc(114 * var(--u)); min-width: 84px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--navy);
    font-family: var(--ff-en);
    font-weight: 700;
    font-size: max(15px, calc(21 * var(--u)));
    line-height: 1.12;
    letter-spacing: -.01em;
    text-align: center;
    padding-top: .08em;
    box-shadow: 0 10px 30px rgba(0, 10, 40, .25);
}
.sv__soon small { font-size: .88em; font-weight: 700; }


/* =========================================================
   서브 하단 유의사항 (.s-notes) · 위 간격은 페이지마다 따로
========================================================= */
.s-notes {
    display: flex; align-items: center;
    margin-top: calc(56 * var(--u));
    padding: calc(28 * var(--u)) calc(40 * var(--u)) calc(28 * var(--u)) 0;
    border: 1px solid #e4e4e4;
}
.s-notes__ico {
    flex: none;
    display: flex; align-items: center; justify-content: center;
    width: calc(74 * var(--u)); height: calc(74 * var(--u));
    min-width: 46px; min-height: 46px;
    margin: 0 calc(51 * var(--u)) 0 calc(44 * var(--u));
    border: 1px solid #cfcfcf;
    border-radius: 50%;
    font-size: max(18px, calc(30 * var(--u)));
    font-style: normal;
    font-weight: 700;
    line-height: 1;
    color: #222;
}
.s-notes ul {
    font-size: max(12px, calc(15 * var(--u)));
    line-height: 2.33;
    letter-spacing: -.03em;
    color: #555;
}
.s-notes li { position: relative; padding-left: .9em; }
.s-notes li::before {
    content: ''; position: absolute; left: 0; top: 1.165em;
    width: 5px; height: 5px; margin-top: -2.5px;
    border-radius: 50%;
    background: #444;
}


/* =========================================================
   공통 · 모바일
========================================================= */
@media (max-width: 1023px) {
    .sub { padding-bottom: calc(120 * var(--m)); }
    .sub-in { width: auto; max-width: none; margin-left: calc(40 * var(--m)); margin-right: calc(40 * var(--m)); }
    .s-br::before, .s-br::after { width: calc(16 * var(--m)); height: calc(16 * var(--m)); min-width: 0; min-height: 0; }

    /* 서브 상단 (sub_visual_mo.jpg 750x500) */
    .sv { height: calc(500 * var(--m)); min-height: 0; }
    .sv__txt { top: calc(var(--hd-h) + (500 * var(--m) - var(--hd-h)) / 2 - 42 * var(--m)); }
    .sv__en { font-size: calc(44 * var(--m)); }
    .sv__tit { margin-top: calc(24 * var(--m)); font-size: calc(28 * var(--m)); }
    .sv__float { display: none; }

    /* 유의사항 */
    .s-notes { align-items: center; margin-top: calc(80 * var(--m)); padding: calc(36 * var(--m)) calc(30 * var(--m)) calc(36 * var(--m)) 0; }
    .s-notes__ico { width: calc(60 * var(--m)); height: calc(60 * var(--m)); min-width: 0; min-height: 0; margin: 0 calc(24 * var(--m)) 0 calc(26 * var(--m)); font-size: calc(26 * var(--m)); }
    .s-notes ul { font-size: calc(19 * var(--m)); line-height: 1.75; }
    .s-notes li + li { margin-top: calc(8 * var(--m)); }
    .s-notes li::before { top: .875em; width: calc(7 * var(--m)); height: calc(7 * var(--m)); margin-top: calc(-3.5 * var(--m)); }

    /* 하단 바만큼 푸터 아래 여유 */
    .is-sub .tv-foot { padding-bottom: calc(70 * var(--m) + 80 * var(--m) + env(safe-area-inset-bottom, 0px)); }
}


/* =========================================================
   사업안내 > 사업개요 (.bz)
   · 1단지 / 2단지 : 버튼으로만 전환
   · 단지 안 : 썸네일 클릭 + 자동 전환 (sub.js)
========================================================= */
.bz { padding-top: calc(127 * var(--u)); }
.sub--business .s-notes { margin-top: calc(505 * var(--u)); }

.bz-tabs { display: flex; justify-content: center; gap: calc(12 * var(--u)); }
.bz-tab {
    width: calc(216 * var(--u)); min-width: 140px;
    height: calc(73 * var(--u)); min-height: 46px;
    border: 1px solid #d2d2d2;
    font-size: max(14px, calc(20 * var(--u)));
    font-weight: 600;
    letter-spacing: -.02em;
    color: #111;
    transition: background-color .4s ease, color .4s ease, border-color .4s ease;
}
.bz-tab.is-on { background: var(--navy); border-color: var(--navy); color: #fff; }
.bz-tab:not(.is-on):hover { border-color: var(--navy); color: var(--navy); }

.bz-panel { display: none; }
.bz-panel.is-on { display: block; animation: bzIn .8s ease both; }
@keyframes bzIn { from { opacity: 0; } to { opacity: 1; } }

/* 큰 이미지 890x556 + 오른쪽 썸네일 188 (아래 끝 맞춤) */
.bz-view { display: flex; align-items: flex-end; gap: calc(22 * var(--u)); margin-top: calc(61 * var(--u)); }
.bz-main {
    position: relative;
    flex: none;
    width: calc(890 * var(--u));
    aspect-ratio: 890 / 556;
    margin: 0;
    overflow: hidden;
    background: #eef0f2;
}
.bz-main img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    max-width: none;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1s ease;
}
.bz-main img.is-on { opacity: 1; }
.bz-thumbs { display: flex; flex-direction: column-reverse; gap: calc(12 * var(--u)); width: calc(188 * var(--u)); }
.bz-thumb { display: block; width: 100%; aspect-ratio: 890 / 556; overflow: hidden; }
.bz-thumb img { width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform .8s var(--ease); }
.bz-thumb:hover img { transform: scale(1.06); }
.bz-thumb.is-on { display: none; }   /* 지금 보이는 이미지의 썸네일은 숨김 (시안) */

/* 정보 3칸 */
.bz-info {
    display: grid;
    grid-template-columns: repeat(3, calc(339 * var(--u)));
    column-gap: calc(41 * var(--u));
    row-gap: calc(66 * var(--u));
    margin-top: calc(68 * var(--u));
}
.bz-info dt {
    padding-bottom: calc(16 * var(--u));
    border-bottom: 1px solid #a9b0bf;
    font-size: max(15px, calc(22 * var(--u)));
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.03em;
    color: #111;
}
.bz-info dd {
    margin-top: calc(20 * var(--u));
    font-size: max(13px, calc(17 * var(--u)));
    line-height: 1.25;
    letter-spacing: -.02em;
    color: #555;
}

@media (max-width: 1023px) {
    .bz { padding-top: calc(172 * var(--m)); }
    .sub--business .s-notes { margin-top: calc(230 * var(--m)); }
    .bz-tab { width: calc(215 * var(--m)); min-width: 0; height: calc(71 * var(--m)); min-height: 0; font-size: calc(24 * var(--m)); }
    .bz-tabs { gap: calc(12 * var(--m)); }

    .bz-view { display: block; margin-top: calc(57 * var(--m)); }
    .bz-main { width: 100%; }
    .bz-thumbs { flex-direction: row-reverse; gap: calc(12 * var(--m)); width: auto; margin-top: calc(23 * var(--m)); }
    .bz-thumb { width: calc(205 * var(--m)); }

    .bz-info { grid-template-columns: 1fr 1fr; column-gap: calc(32 * var(--m)); row-gap: calc(67 * var(--m)); margin-top: calc(85 * var(--m)); }
    .bz-info dt { padding-bottom: calc(18 * var(--m)); font-size: calc(22 * var(--m)); }
    .bz-info dd { margin-top: calc(21 * var(--m)); font-size: calc(17 * var(--m)); line-height: 1.3; letter-spacing: -.04em; }
}


/* =========================================================
   사업안내 > 브랜드 소개 (.br)
========================================================= */
.br-intro { padding-top: calc(127 * var(--u)); }
.br-head { text-align: center; }
.br-logo { width: calc(463 * var(--u)); margin: 0 auto; }
.br-logo img { width: 100%; height: auto; }
.br-tit {
    margin-top: calc(48 * var(--u));
    font-size: max(22px, calc(38 * var(--u)));
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.03em;
    color: #05205f;
}
.br-desc {
    margin-top: calc(24 * var(--u));
    font-size: max(13px, calc(18 * var(--u)));
    line-height: 1.95;
    letter-spacing: -.03em;
    color: #333;
}

/* 사업 분야 4칸 : 세로선은 칸 높이만큼, 가로선은 두 줄 사이 */
.br-biz {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: calc(48 * var(--u));
    width: calc(984 * var(--u));
    margin: calc(93 * var(--u)) auto 0;
}
.br-biz__item { position: relative; padding: calc(17 * var(--u)) 0 calc(16 * var(--u)) calc(40 * var(--u)); }
.br-biz__item:nth-child(odd) { border-right: 1px solid #b2b2b2; }
.br-biz__item:nth-child(3)::before {
    content: ''; position: absolute; left: 0; top: calc(-24 * var(--u));
    width: 200%; height: 1px;
    background: #b2b2b2;
}
.br-biz__ico { display: block; width: auto; height: calc(52 * var(--u)); min-height: 34px; }
.br-biz__tit {
    margin-top: calc(19 * var(--u));
    font-family: var(--ff-en);
    font-size: max(18px, calc(28 * var(--u)));
    font-weight: 600;
    line-height: 1.2;
    color: #05205f;
}
.br-biz__desc {
    margin-top: calc(16 * var(--u));
    font-size: max(12px, calc(15 * var(--u)));
    line-height: 1.87;
    letter-spacing: -.03em;
    color: #444;
    white-space: nowrap;
}

/* 서울숲 · 부산숲 */
.br-strip { margin: calc(75 * var(--u)) 0 0; aspect-ratio: 1100 / 170; overflow: hidden; }
.br-strip img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.br-forest {
    position: relative;
    display: grid;
    grid-template-columns: calc(341 * var(--u)) 1fr;
    column-gap: calc(61 * var(--u));
    min-height: calc(1036 * var(--u));
    padding: calc(82 * var(--u)) calc(75 * var(--u)) 0;
    overflow: hidden;
    background: linear-gradient(180deg, #a4caf8 0%, #bbcff3 100%);
}
.br-forest__l, .br-forest__r { position: relative; z-index: 1; }
.br-forest__tit {
    font-size: max(36px, calc(63 * var(--u)));
    font-weight: 700;
    line-height: 1.38;
    letter-spacing: -.04em;
    color: #05205f;
}
.br-forest__pic { margin: calc(58 * var(--u)) 0 0; aspect-ratio: 341 / 199; overflow: hidden; }
.br-forest__pic img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.br-forest__lead {
    margin-top: calc(40 * var(--u));
    font-size: max(14px, calc(22 * var(--u)));
    font-weight: 600;
    line-height: 1.82;
    letter-spacing: -.03em;
    color: #05205f;
    white-space: nowrap;
}
.br-forest__r { padding-top: calc(184 * var(--u)); }
.br-forest__r p {
    font-size: max(13px, calc(18 * var(--u)));
    line-height: 1.95;
    letter-spacing: -.03em;
    color: #333;
    white-space: nowrap;
}
.br-forest__r p + p { margin-top: calc(35 * var(--u)); }
.br-forest__r p.is-b { margin-top: calc(40 * var(--u)); font-weight: 600; color: #1b2440; }
.br-forest__bld { position: absolute; right: 0; bottom: 0; width: calc(407 * var(--u)); margin: 0; }
.br-forest__bld img { display: block; width: 100%; height: auto; }

/* 주요사업 실적 */
.br-perf {
    position: relative;
    min-height: calc(1199 * var(--u));
    padding: calc(112 * var(--u)) calc(75 * var(--u)) 0;
    overflow: hidden;
    background: #d6d9db;
}
.br-perf__head, .br-perf__cols { position: relative; z-index: 1; }
.br-perf__tit {
    font-family: var(--ff);   /* Pretendard ExtraBold : Futura 의 j 가 i 처럼 보여서 변경 */
    font-size: max(28px, calc(46 * var(--u)));
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.35;
    color: #05205f;
}
.br-perf__sub { margin-top: calc(16 * var(--u)); font-size: max(13px, calc(19 * var(--u))); letter-spacing: -.03em; color: #222; }
.br-perf__cols { display: grid; grid-template-columns: calc(667 * var(--u)) 1fr; margin-top: calc(84 * var(--u)); }
.br-perf__lists { display: grid; grid-template-columns: calc(334 * var(--u)) 1fr; margin-top: calc(24 * var(--u)); }
.br-perf__grp--office .br-perf__lists { grid-template-columns: 1fr; }
.br-perf__grp h3 {
    font-size: max(14px, calc(20 * var(--u)));
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.03em;
    color: #05205f;
}
.br-perf__lists li {
    position: relative;
    padding-left: calc(17 * var(--u));
    font-size: max(12px, calc(15 * var(--u)));
    line-height: 2.4;
    letter-spacing: -.03em;
    color: #333;
    white-space: nowrap;
}
.br-perf__lists li::before {
    content: ''; position: absolute; left: 0; top: 50%;
    width: 6px; height: 6px; margin-top: -3px;
    border-radius: 50%;
    background: #0066b3;
}
.br-work { display: none; }   /* 모바일 전용 사진 */
.br-perf__bg { position: absolute; z-index: 0; left: 0; right: 0; bottom: 0; height: calc(458 * var(--u)); margin: 0; }
.br-perf__bg img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 100%; }

@media (max-width: 1023px) {
    .br-intro { padding-top: calc(110 * var(--m)); }
    .br-logo { width: calc(460 * var(--m)); }
    .br-tit { margin-top: calc(40 * var(--m)); font-size: calc(40 * var(--m)); line-height: 1.4; }
    .br-desc { margin-top: calc(24 * var(--m)); font-size: calc(21 * var(--m)); line-height: 1.8; }

    .br-biz { width: auto; margin-top: calc(70 * var(--m)); row-gap: calc(50 * var(--m)); }
    .br-biz__item { padding: calc(20 * var(--m)) calc(10 * var(--m)) calc(20 * var(--m)) calc(24 * var(--m)); }
    .br-biz__item:nth-child(odd) { padding-left: 0; padding-right: calc(20 * var(--m)); }
    .br-biz__item:nth-child(3)::before { top: calc(-25 * var(--m)); }
    .br-biz__ico { height: calc(44 * var(--m)); min-height: 0; }
    .br-biz__tit { margin-top: calc(16 * var(--m)); font-size: calc(28 * var(--m)); }
    .br-biz__desc { margin-top: calc(12 * var(--m)); font-size: calc(17 * var(--m)); line-height: 1.7; white-space: normal; }
    .br-biz__desc br { display: none; }

    .br-strip { margin: calc(80 * var(--m)) calc(-40 * var(--m)) 0; aspect-ratio: auto; }
    .br-strip img { height: auto; }

    .br-forest { display: block; min-height: 0; margin: 0 calc(-40 * var(--m)); padding: calc(100 * var(--m)) calc(40 * var(--m)) 0; }
    .br-forest__tit { font-size: calc(70 * var(--m)); }
    .br-forest__pic { width: calc(420 * var(--m)); margin-top: calc(50 * var(--m)); aspect-ratio: auto; }
    .br-forest__pic img { height: auto; }
    .br-forest__lead { margin-top: calc(40 * var(--m)); font-size: calc(26 * var(--m)); }
    .br-forest__r { padding-top: 0; margin-top: calc(60 * var(--m)); }
    .br-forest__r p { font-size: calc(21 * var(--m)); line-height: 1.8; }
    .br-forest__r p + p { margin-top: calc(32 * var(--m)); }
    .br-forest__bld { position: relative; width: calc(500 * var(--m)); margin: calc(40 * var(--m)) calc(-40 * var(--m)) 0 auto; }

    .br-perf { min-height: 0; margin: 0 calc(-40 * var(--m)); padding: calc(110 * var(--m)) calc(40 * var(--m)) calc(380 * var(--m)); }
    .br-perf__tit { font-size: calc(60 * var(--m)); }
    .br-perf__sub { margin-top: calc(16 * var(--m)); font-size: calc(24 * var(--m)); }
    .br-perf__cols { display: block; margin-top: calc(70 * var(--m)); }
    .br-perf__grp h3 { font-size: calc(26 * var(--m)); }
    .br-perf__lists { grid-template-columns: 1fr 1fr; margin-top: calc(24 * var(--m)); }
    .br-perf__lists li { padding-left: calc(20 * var(--m)); font-size: calc(21 * var(--m)); line-height: 2.1; letter-spacing: -.04em; }
    .br-perf__lists li::before { width: calc(8 * var(--m)); height: calc(8 * var(--m)); margin-top: calc(-4 * var(--m)); }

    /* 업무시설 : 왼쪽 목록 + 오른쪽 사진 2장 → 아래 사진 묶음 */
    .br-perf__grp--office { display: grid; grid-template-columns: 1fr calc(320 * var(--m)); column-gap: calc(20 * var(--m)); margin-top: calc(60 * var(--m)); }
    .br-perf__grp--office h3 { grid-column: 1; grid-row: 1; }
    .br-perf__grp--office .br-perf__lists { grid-column: 1; grid-row: 2; grid-template-columns: 1fr; }
    .br-work { display: block; margin: 0; }
    .br-work img { display: block; width: 100%; height: auto; }
    .br-work--side { grid-column: 2; grid-row: 1 / span 2; }
    .br-work--side img + img { margin-top: calc(29 * var(--m)); }
    .br-work--grid { margin-top: calc(25 * var(--m)); }
    .br-perf__bg { height: calc(400 * var(--m)); }
}


/* =========================================================
   프리미엄 > 프리미엄 (.pr)
   · 사진과 글이 좌우로 번갈아 (짝수 행 = 사진 오른쪽)
========================================================= */
.pr { padding-top: calc(126 * var(--u)); }
.sub--premium .s-notes { margin-top: calc(110 * var(--u)); }

.pr-en { font-family: var(--ff-en); font-size: max(16px, calc(25 * var(--u))); font-weight: 600; line-height: 1; letter-spacing: .02em; color: #111; }
.pr-sub { margin-top: calc(26 * var(--u)); font-size: max(14px, calc(21 * var(--u))); line-height: 1.2; letter-spacing: -.03em; color: #444; }
.pr-tit { margin-top: calc(28 * var(--u)); font-size: max(26px, calc(46 * var(--u))); font-weight: 700; line-height: 1; letter-spacing: -.04em; color: #111; }

.pr-rows { margin-top: calc(103 * var(--u)); }
.pr-row {
    display: grid;
    grid-template-columns: calc(272 * var(--u)) 1fr;
    grid-template-rows: auto 1fr;
    column-gap: calc(49 * var(--u));
}
.pr-row + .pr-row { margin-top: calc(131 * var(--u)); }
.pr-row__pic { position: relative; grid-column: 1; grid-row: 1 / span 2; margin: 0; aspect-ratio: 272 / 342; overflow: hidden; }
.pr-row__pic img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.pr-row__pic figcaption {
    position: absolute; right: calc(10 * var(--u)); bottom: calc(8 * var(--u));
    font-size: max(10px, calc(12 * var(--u)));
    color: #fff;
    text-shadow: 0 0 6px rgba(0, 0, 0, .35);
}

/* 「 제목 」 */
.pr-row__tit {
    grid-column: 2; grid-row: 1;
    justify-self: start;
    margin-top: calc(28 * var(--u));
    padding: calc(9.5 * var(--u)) calc(19.5 * var(--u));
    font-family: var(--ff-serif);
    font-size: max(24px, calc(42 * var(--u)));
    font-weight: 300;
    line-height: 1;
    letter-spacing: -.04em;
    color: #111;
}
.pr-row__info { grid-column: 2; grid-row: 2; display: flex; align-items: flex-start; margin-top: calc(30 * var(--u)); }
.pr-row__ico {
    flex: none;
    width: calc(93 * var(--u)); height: calc(93 * var(--u));
    margin: calc(-4 * var(--u)) 0 0 calc(-4 * var(--u));
    overflow: visible;
    fill: none; stroke: #b1b1b1; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.pr-row__ico .dot { stroke-dasharray: 1.2 3; }
.pr-row__body { margin-left: calc(23 * var(--u)); }
.pr-row__head { margin-top: 0; font-size: max(18px, calc(30 * var(--u))); font-weight: 500; line-height: 1.2; letter-spacing: -.03em; color: #111; white-space: nowrap; }
.pr-row__head i { font-style: italic; padding-right: .05em; }
.pr-row__list { width: calc(592 * var(--u)); margin: calc(17 * var(--u)) 0 0 calc(-11 * var(--u)); }
.pr-row__list li {
    padding: calc(12 * var(--u)) 0 calc(12 * var(--u)) calc(11 * var(--u));
    font-size: max(13px, calc(20 * var(--u)));
    line-height: 1.45;
    letter-spacing: -.03em;
    color: #555;
    white-space: nowrap;
}
.pr-row__list li + li { border-top: 1px solid #b5b5b5; }
.pr-row__list li::before { content: '• '; }

/* 사진 오른쪽 행 */
.pr-row--r { grid-template-columns: 1fr calc(272 * var(--u)); }
.pr-row--r .pr-row__pic { grid-column: 2; }
.pr-row--r .pr-row__tit { grid-column: 1; justify-self: end; margin-right: calc(-2 * var(--u)); }
.pr-row--r .pr-row__info { grid-column: 1; justify-self: end; flex-direction: row-reverse; text-align: right; }
.pr-row--r .pr-row__ico { margin: calc(-4 * var(--u)) calc(-4 * var(--u)) 0 0; }
.pr-row--r .pr-row__body { margin: 0 calc(28 * var(--u)) 0 0; }
.pr-row--r .pr-row__list { margin: calc(17 * var(--u)) calc(-12 * var(--u)) 0 0; width: calc(591 * var(--u)); }
.pr-row--r .pr-row__list li { padding: calc(12 * var(--u)) calc(12 * var(--u)) calc(12 * var(--u)) 0; }

@media (max-width: 1023px) {
    .pr { padding-top: calc(168 * var(--m)); }
    .sub--premium .s-notes { margin-top: calc(100 * var(--m)); }
    .pr-en { font-size: calc(27 * var(--m)); }
    .pr-sub { margin-top: calc(22 * var(--m)); font-size: calc(23 * var(--m)); }
    .pr-tit { margin-top: calc(26 * var(--m)); font-size: calc(42 * var(--m)); }

    .pr-rows { margin-top: calc(61 * var(--m)); }
    .pr-row { grid-template-columns: calc(272 * var(--m)) 1fr; grid-template-rows: auto auto; column-gap: calc(28 * var(--m)); }
    .pr-row + .pr-row { margin-top: calc(75 * var(--m)); }
    .pr-row__pic { grid-row: 1; }
    .pr-row__pic figcaption { right: calc(10 * var(--m)); bottom: calc(8 * var(--m)); font-size: calc(14 * var(--m)); }
    .pr-row__tit { grid-row: 1; align-self: end; margin: 0 0 calc(-3 * var(--m)); padding: calc(8 * var(--m)) calc(18 * var(--m)); font-size: calc(41 * var(--m)); }
    .pr-row__info { grid-column: 1 / -1; grid-row: 2; margin-top: calc(46 * var(--m)); }
    .pr-row__ico { width: calc(75 * var(--m)); height: calc(75 * var(--m)); margin-left: calc(10 * var(--m)); }
    .pr-row__body { flex: 1; margin-left: calc(33 * var(--m)); }
    .pr-row__head { margin-top: calc(4 * var(--m)); font-size: calc(29 * var(--m)); white-space: normal; }
    .pr-row__list { width: auto; margin: calc(18 * var(--m)) 0 0 calc(-11 * var(--m)); }
    .pr-row__list li { padding: calc(13 * var(--m)) 0 calc(13 * var(--m)) calc(6 * var(--m)); font-size: calc(18 * var(--m)); white-space: normal; letter-spacing: -.05em; }

    .pr-row--r { grid-template-columns: 1fr calc(272 * var(--m)); }
    .pr-row--r .pr-row__tit { margin-right: calc(4 * var(--m)); }
    .pr-row--r .pr-row__info { grid-column: 1 / -1; justify-self: stretch; }
    .pr-row--r .pr-row__body { margin-right: calc(41 * var(--m)); margin-left: calc(43 * var(--m)); }
    .pr-row--r .pr-row__list { margin: calc(18 * var(--m)) calc(-11 * var(--m)) 0 0; width: auto; }
    .pr-row--r .pr-row__list li { padding: calc(17 * var(--m)) calc(11 * var(--m)) calc(17 * var(--m)) 0; }
}


/* =========================================================
   프리미엄 > 공원 프로젝트 (.pk)
========================================================= */
.pk { padding-top: calc(255 * var(--u)); }
.sub--park .s-notes { margin-top: calc(66 * var(--u)); }
.pk-sub { font-size: max(14px, calc(25 * var(--u))); line-height: 1.2; letter-spacing: -.03em; color: #333; }
.pk-tit { margin-top: calc(16 * var(--u)); font-size: max(30px, calc(58 * var(--u))); font-weight: 700; line-height: 1.241; letter-spacing: -.03em; color: #05205f; }

/* 지도 + 왼쪽 위 사업 정보 */
.pk-map { position: relative; margin-top: calc(41 * var(--u)); }
.pk-video { position: relative; margin-top: calc(50 * var(--u)); aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.pk-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.pk-video + .pk-map { margin-top: calc(90 * var(--u)); }
.pk-map__img { margin: calc(38 * var(--u)) 0 0; }   /* park_map.png 1100x943 · 왼쪽 위 투명 */
.pk-map__img img { display: block; width: 100%; height: auto; }
.pk-info { position: absolute; z-index: 1; left: 0; top: calc(2 * var(--u)); letter-spacing: -.02em; }
.pk-info__tit {
    display: inline-block;
    padding: 0 calc(16 * var(--u));
    background: #05205f;
    font-size: max(14px, calc(21 * var(--u)));
    font-weight: 700;
    line-height: calc(45 * var(--u));
    color: #fff;
    white-space: nowrap;
}
.pk-info__list { position: relative; margin-top: calc(14 * var(--u)); padding-left: calc(18 * var(--u)); }
.pk-info__list::before { content: ''; position: absolute; left: calc(5 * var(--u)); top: calc(4 * var(--u)); bottom: calc(4 * var(--u)); width: 1px; background: #999; }
.pk-info__list li { font-size: max(12px, calc(17.5 * var(--u))); line-height: 1.5; color: #555; white-space: nowrap; }
.pk-info__list li small { margin-left: .2em; font-size: .68em; font-weight: 400; color: #666; }   /* (변경절차 이행중) */
.pk-info__list li.is-b {
    font-size: max(13px, calc(20 * var(--u)));
    font-weight: 600;
    line-height: 1.35;
    color: #111;
}


/* 사진 타일 (348x232) + 문구 */
.pk-grid {
    position: relative; z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas: "t1 t2 t3" "tx t4 t5" "zn zn t6" "zn zn t7";
    gap: calc(26 * var(--u));
    margin-top: calc(66 * var(--u));
}
.pk-tile { margin: 0; aspect-ratio: 348 / 232; overflow: hidden; }
.pk-tile img { width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform 1.2s var(--ease); }
@media (hover: hover) and (pointer: fine) { .pk-tile:hover img { transform: scale(1.05); } }
.pk-tile--1 { grid-area: t1; } .pk-tile--2 { grid-area: t2; } .pk-tile--3 { grid-area: t3; }
.pk-tile--4 { grid-area: t4; } .pk-tile--5 { grid-area: t5; } .pk-tile--6 { grid-area: t6; } .pk-tile--7 { grid-area: t7; }
.pk-txt {
    grid-area: tx;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    aspect-ratio: 348 / 232;
    background: #dcddde;
    text-align: center;
    letter-spacing: -.03em;
}
.pk-txt p { font-size: max(13px, calc(19.5 * var(--u))); line-height: 1.38; color: #333; }
.pk-txt strong { display: block; margin-top: calc(12 * var(--u)); font-size: max(20px, calc(33 * var(--u))); font-weight: 700; line-height: 1.36; color: #2661b8; }

.pk-zones { grid-area: zn; padding: calc(88 * var(--u)) 0 0 calc(70 * var(--u)); letter-spacing: -.03em; }
.pk-zones__lead { font-size: max(18px, calc(33 * var(--u))); font-weight: 700; line-height: 1.3; color: #8c734c; }
.pk-zones__lead i { font-style: italic; padding-right: .05em; }
.pk-zones dl { margin-top: calc(16 * var(--u)); }
.pk-zones dl > div + div { margin-top: calc(11 * var(--u)); }
.pk-zones dt { font-size: max(14px, calc(22 * var(--u))); font-weight: 700; line-height: 1.5; color: #05205f; }
.pk-zones dd { margin-top: 0; font-size: max(13px, calc(19.3 * var(--u))); line-height: 1.6; color: #444; white-space: nowrap; }

/* 하단 배경 (1100x1245) : 파크라이프 문구 · 오른쪽 사진 2장 뒤까지 깔림 */
.pk-pano { position: relative; z-index: 0; margin: calc(-490 * var(--u)) 0 0; }
.pk-pano img { display: block; width: 100%; height: auto; }

@media (max-width: 1023px) {
    .pk { padding-top: calc(172 * var(--m)); }
    .sub--park .s-notes { margin-top: calc(70 * var(--m)); }
    .pk-sub { font-size: calc(25 * var(--m)); }
    .pk-tit { margin-top: calc(16 * var(--m)); font-size: calc(58 * var(--m)); }

    .pk-map { margin-top: calc(48 * var(--m)); }
    .pk-video { margin-top: calc(56 * var(--m)); }
    .pk-video + .pk-map { margin-top: calc(80 * var(--m)); }
    .pk-info { position: relative; top: auto; }
    .pk-info__tit { padding: 0 calc(16 * var(--m)); font-size: calc(21 * var(--m)); line-height: calc(46 * var(--m)); }
    .pk-info__list { margin-top: calc(16 * var(--m)); padding-left: calc(20 * var(--m)); }
    .pk-info__list::before { left: calc(5 * var(--m)); }
    .pk-info__list li { font-size: calc(17 * var(--m)); }
    .pk-info__list li.is-b { font-size: calc(19 * var(--m)); }
    .pk-map__img { width: calc(732 * var(--m)); margin: calc(62 * var(--m)) 0 0 calc(-63 * var(--m)); }

    .pk-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "tx t2" "t1 t4" "t5 t3" "t6 t7" "zn zn";
        column-gap: calc(26 * var(--m)); row-gap: calc(24 * var(--m));
        margin-top: calc(86 * var(--m));
    }
    .pk-txt p { font-size: calc(19.5 * var(--m)); }
    .pk-txt strong { margin-top: calc(12 * var(--m)); font-size: calc(33 * var(--m)); }
    .pk-zones { padding: calc(31 * var(--m)) 0 0 calc(15 * var(--m)); }
    .pk-zones__lead { font-size: calc(37 * var(--m)); }
    .pk-zones dl { margin-top: calc(22 * var(--m)); }
    .pk-zones dl > div + div { margin-top: calc(16 * var(--m)); }
    .pk-zones dt { font-size: calc(24.5 * var(--m)); }
    .pk-zones dd { margin-top: calc(4 * var(--m)); font-size: calc(22 * var(--m)); line-height: 1.6; white-space: normal; }
    .pk-zones dd br { display: none; }
    .pk-pano { margin-top: calc(-430 * var(--m)); }   /* 670x904 : 파크라이프 문구 뒤부터 */
}


/* =========================================================
   프리미엄 > 센텀2지구 개발현황 (.cn)
========================================================= */
.cn { padding-top: calc(122 * var(--u)); }
.sub--centum .s-notes { margin-top: calc(193 * var(--u)); }
.cn-lead { font-size: max(14px, calc(23 * var(--u))); line-height: 1.435; letter-spacing: -.03em; color: #666; }
.cn-tit, .cn-big { font-family: 'KoPub Batang', var(--ff-serif); font-weight: 300; letter-spacing: 0; color: #111; }
.cn-tit { margin-top: calc(20 * var(--u)); font-size: max(30px, calc(54 * var(--u))); line-height: 1.333; }
.cn-script { width: calc(444 * var(--u)); margin-top: calc(70 * var(--u)); }
.cn-script img { width: 100%; height: auto; }
.cn-desc { margin-top: calc(12 * var(--u)); font-size: max(13px, calc(22 * var(--u))); line-height: 1.82; letter-spacing: -.03em; color: #222; }
.cn-view { margin: calc(51 * var(--u)) 0 0; aspect-ratio: 1100 / 594; overflow: hidden; }
.cn-view picture, .cn-aerial picture { display: block; height: 100%; }
.cn-view img, .cn-aerial img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.cn-big { margin-top: calc(81 * var(--u)); font-size: max(24px, calc(46 * var(--u))); line-height: 1.413; }

/* 왼쪽 사선 + 설명 / 오른쪽 교수 소개 */
.cn-mid { display: flex; justify-content: space-between; margin-top: calc(40 * var(--u)); }
.cn-mid .s-slash { width: calc(62 * var(--u)); height: calc(64 * var(--u)); }
.cn-mid__txt { margin-top: calc(33 * var(--u)); font-size: max(14px, calc(24 * var(--u))); font-weight: 500; line-height: 1.46; letter-spacing: -.03em; color: #222; white-space: nowrap; }
.cn-prof { text-align: right; }
.cn-prof__pic { width: calc(252 * var(--u)); margin: 0 0 0 auto; aspect-ratio: 252 / 284; overflow: hidden; }
.cn-prof__pic img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.cn-prof__name { margin-top: calc(24 * var(--u)); font-size: max(14px, calc(20 * var(--u))); font-weight: 700; line-height: 1.2; letter-spacing: -.03em; color: #111; }
.cn-prof__bio { margin-top: calc(14 * var(--u)); }
.cn-prof__bio p { font-size: max(12px, calc(18.5 * var(--u))); line-height: 1.556; letter-spacing: -.03em; color: #777; white-space: nowrap; }
.cn-prof__bio p + p { margin-top: calc(28 * var(--u)); }

.cn-aerial { margin: calc(69 * var(--u)) 0 0; aspect-ratio: 1100 / 290; overflow: hidden; }

/* 사업 정보 2x2 */
.cn-facts {
    display: grid;
    grid-template-columns: calc(607 * var(--u)) 1fr;
    grid-template-areas: "a b" "c d";
    row-gap: calc(90 * var(--u));
    margin-top: calc(108 * var(--u));
}
.cn-fact--a { grid-area: a; } .cn-fact--b { grid-area: b; } .cn-fact--c { grid-area: c; } .cn-fact--d { grid-area: d; }
.cn-fact { position: relative; }
.cn-fact h3 { font-size: max(16px, calc(25 * var(--u))); font-weight: 700; line-height: 1.2; letter-spacing: -.03em; color: #05205f; }
.cn-fact ul { margin-top: calc(16 * var(--u)); }
.cn-fact li {
    position: relative;
    padding-left: calc(14 * var(--u));
    font-size: max(12px, calc(18.5 * var(--u)));
    line-height: 1.97;
    letter-spacing: -.03em;
    color: #555;
    white-space: nowrap;
}
.cn-fact li::before {
    content: ''; position: absolute; left: 0; top: 50%;
    width: 7px; height: 7px; margin-top: -3.5px;
    border-radius: 50%;
    background: #777;
}
.cn-fact--c ul { display: grid; grid-template-columns: calc(127 * var(--u)) 1fr; }
.cn-fact__pic { display: block; margin: 0 0 0 auto; }
.cn-fact__pic img { display: block; width: 100%; height: auto; }
.cn-fact__pic--ai { width: calc(206 * var(--u)); margin-top: calc(29 * var(--u)); }
.cn-fact__pic--esc { width: calc(492 * var(--u)); margin-top: calc(28 * var(--u)); }
.cn-fact__pic.is-mo { display: none; }

@media (max-width: 1023px) {
    .cn { padding-top: calc(170 * var(--m)); }
    .sub--centum .s-notes { margin-top: calc(130 * var(--m)); }
    .cn-lead { font-size: calc(23 * var(--m)); }
    .cn-tit { margin-top: calc(14 * var(--m)); font-size: calc(54 * var(--m)); }
    .cn-script { width: calc(444 * var(--m)); margin-top: calc(70 * var(--m)); }
    .cn-desc { margin-top: calc(9 * var(--m)); font-size: calc(22 * var(--m)); }
    .cn-view { margin-top: calc(50 * var(--m)); aspect-ratio: auto; }
    .cn-view img, .cn-aerial img { height: auto; }
    .cn-big { margin-top: calc(57 * var(--m)); font-size: calc(46 * var(--m)); }

    .cn-mid { display: block; margin-top: calc(40 * var(--m)); }
    .cn-mid .s-slash { width: calc(62 * var(--m)); height: calc(64 * var(--m)); }
    .cn-mid__txt { margin-top: calc(28 * var(--m)); font-size: calc(24 * var(--m)); }
    .cn-prof { margin-top: calc(87 * var(--m)); }
    .cn-prof__pic { width: calc(252 * var(--m)); }
    .cn-prof__name { margin-top: calc(24 * var(--m)); font-size: calc(20 * var(--m)); }
    .cn-prof__bio { margin-top: calc(18 * var(--m)); }
    .cn-prof__bio p { font-size: calc(18 * var(--m)); }
    .cn-prof__bio p + p { margin-top: calc(28 * var(--m)); }

    .cn-aerial { margin-top: calc(65 * var(--m)); aspect-ratio: auto; }

    .cn-facts { display: block; margin-top: calc(53 * var(--m)); }
    .cn-fact + .cn-fact { margin-top: calc(70 * var(--m)); }
    .cn-fact h3 { font-size: calc(26 * var(--m)); }
    .cn-fact ul { margin-top: calc(22 * var(--m)); }
    .cn-fact li { padding-left: calc(16 * var(--m)); font-size: calc(20 * var(--m)); line-height: 2.2; letter-spacing: -.04em; }
    .cn-fact li::before { width: calc(8 * var(--m)); height: calc(8 * var(--m)); margin-top: calc(-4 * var(--m)); }
    .cn-fact--c ul { grid-template-columns: calc(155 * var(--m)) 1fr; }
    .cn-fact__pic.is-pc { display: none; }
    .cn-fact__pic.is-mo { display: block; position: absolute; right: 0; margin: 0; }
    .cn-fact__pic--ai { width: calc(168 * var(--m)); bottom: 0; }
    .cn-fact__pic--esc { width: calc(246 * var(--m)); top: calc(-28 * var(--m)); }
}


/* =========================================================
   사업안내 > 오시는길 (.lc)
========================================================= */
.lc { padding-top: calc(116 * var(--u)); }
.sub--location .s-notes { margin-top: calc(160 * var(--u)); }
.lc-tit { font-size: max(24px, calc(45 * var(--u))); font-weight: 300; line-height: 1.333; letter-spacing: -.04em; color: #05205f; }
.lc-tit strong { font-weight: 700; }
.lc-maps { display: flex; justify-content: space-between; margin-top: calc(37 * var(--u)); }
.lc-map { width: calc(536 * var(--u)); margin: 0; aspect-ratio: 536 / 360; overflow: hidden; }
.lc-map img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.lc-places { display: grid; grid-template-columns: repeat(3, calc(320 * var(--u))); justify-content: space-between; margin-top: calc(68 * var(--u)); }
.lc-place__head { display: flex; align-items: center; padding-bottom: calc(20 * var(--u)); border-bottom: 1px solid #a3a9b4; }
.lc-place h3 { margin-right: auto; font-size: max(16px, calc(24 * var(--u))); font-weight: 700; line-height: 1.2; letter-spacing: -.03em; color: #05205f; }
.lc-ico { display: block; flex: none; transition: transform .4s var(--ease), opacity .3s ease; }
.lc-ico img { display: block; width: 100%; height: 100%; }
.lc-ico--n   { width: calc(25 * var(--u)); height: calc(22 * var(--u)); min-width: 20px; min-height: 18px; }
.lc-ico--pin { width: calc(21 * var(--u)); height: calc(24 * var(--u)); min-width: 17px; min-height: 19px; margin-left: calc(26 * var(--u)); }
.lc-ico:hover, .lc-ico:focus-visible { transform: translate3d(0, -4px, 0); opacity: .75; }
.lc-place__addr { margin-top: calc(19 * var(--u)); font-size: calc(20.5 * var(--u)); letter-spacing: -.02em; color: #333; white-space: nowrap; }

@media (max-width: 1023px) {
    .lc { padding-top: calc(158 * var(--m)); }
    .sub--location .s-notes { margin-top: calc(150 * var(--m)); }
    .lc-tit { font-size: calc(45 * var(--m)); }
    .lc-maps { display: block; margin-top: calc(56 * var(--m)); }
    .lc-map { width: 100%; }
    .lc-map + .lc-map { margin-top: calc(23 * var(--m)); }
    .lc-places { grid-template-columns: 1fr; row-gap: calc(71 * var(--m)); width: calc(447 * var(--m)); margin: calc(76 * var(--m)) auto 0; }
    .lc-place__head { padding-bottom: calc(26 * var(--m)); }
    .lc-place h3 { font-size: calc(34 * var(--m)); }
    .lc-ico--n   { width: calc(31 * var(--m)); height: calc(27 * var(--m)); min-width: 0; min-height: 0; }
    .lc-ico--pin { width: calc(25 * var(--m)); height: calc(29 * var(--m)); min-width: 0; min-height: 0; margin-left: calc(36 * var(--m)); }
    .lc-place__addr { margin-top: calc(30 * var(--m)); font-size: calc(26 * var(--m)); }
}


/* =========================================================
   사업안내 > 입지환경 (.ps)
========================================================= */
.ps { padding-top: calc(122 * var(--u)); }
.sub--position .s-notes { margin-top: calc(82 * var(--u)); }
.ps-head { position: relative; z-index: 2; text-align: center; }
.ps-sub { font-size: max(18px, calc(35 * var(--u))); line-height: 1.2; letter-spacing: -.03em; color: #1c2f6e; }
.ps-tit { margin-top: calc(16 * var(--u)); font-family: var(--ff-en); font-size: max(36px, calc(71 * var(--u))); font-weight: 700; line-height: 1; letter-spacing: 0; color: #05205f; }
.ps-desc { margin-top: calc(30 * var(--u)); font-size: max(14px, calc(24 * var(--u))); line-height: 1.79; letter-spacing: -.03em; color: #666; }
.ps-illust { margin: calc(-22 * var(--u)) auto 0; width: calc(1096 * var(--u)); }   /* 위쪽 흰 번짐이 설명 문구 아래와 겹침 */
.ps-illust img, .ps-pic img { display: block; width: 100%; height: auto; }

/* 공원을 가진 「새로운 센텀시티」 가 되다! + 키워드 */
.ps-mid { width: calc(738 * var(--u)); margin: calc(56 * var(--u)) auto 0; }
.ps-mid__tit, .ps-mid__slogan { display: inline; }
.ps-mid__l1 { display: block; margin-left: calc(3 * var(--u)); font-size: max(28px, calc(53 * var(--u))); font-weight: 700; line-height: 1; letter-spacing: -.04em; color: #1b0933; }
.ps-mid__key {
    margin: calc(21 * var(--u)) 0 0 calc(132 * var(--u));
    padding: calc(12 * var(--u)) calc(20 * var(--u)) calc(14 * var(--u)) calc(14 * var(--u));
    color: #1b0933;
}
.ps-mid__key::before, .ps-mid__key::after { width: calc(18 * var(--u)); height: calc(18 * var(--u)); border-width: 0; }
.ps-mid__key::before { border-left-width: 1.5px; border-top-width: 1.5px; }
.ps-mid__key::after { border-right-width: 1.5px; border-bottom-width: 1.5px; }
.ps-mid__key em { display: block; font-family: var(--ff-serif); font-size: max(34px, calc(55 * var(--u))); font-style: normal; font-weight: 300; line-height: 1; letter-spacing: -.02em; white-space: nowrap; }
.ps-mid__slogan { margin-left: calc(12 * var(--u)); font-size: max(28px, calc(55 * var(--u))); font-weight: 700; letter-spacing: -.04em; color: #1b0933; white-space: nowrap; }
.ps-mid__slogan i { display: inline-block; font-style: italic; padding-right: .05em; }

.ps-keys { margin-top: calc(35 * var(--u)); border-top: 1px solid #bdbdbd; }
.ps-keys li {
    display: flex; align-items: center;
    gap: calc(18 * var(--u));
    height: calc(72 * var(--u));
    padding-left: calc(84 * var(--u));
    border-bottom: 1px solid #bdbdbd;
}
.ps-keys b { font-family: var(--ff-en); font-size: max(18px, calc(30 * var(--u))); font-weight: 700; line-height: 1; letter-spacing: .12em; color: #0066b1; }
.ps-keys span { font-size: max(14px, calc(22 * var(--u))); letter-spacing: -.02em; color: #2a2238; white-space: nowrap; }

.ps-pic { margin: 0; }
.ps-pic--aerial { margin-top: calc(62 * var(--u)); }
.ps-pic--map { margin-top: calc(41 * var(--u)); }

@media (max-width: 1023px) {
    .ps { padding-top: calc(150 * var(--m)); }
    .sub--position .s-notes { margin-top: calc(80 * var(--m)); }
    .ps-sub { font-size: calc(32 * var(--m)); }
    .ps-tit { margin-top: calc(18 * var(--m)); font-size: calc(62 * var(--m)); }
    .ps-desc { margin-top: calc(30 * var(--m)); font-size: calc(23 * var(--m)); line-height: 1.8; word-break: keep-all; }
    .ps-desc br { display: none; }
    .ps-illust { width: auto; margin: calc(30 * var(--m)) calc(-40 * var(--m)) 0; }

    .ps-mid { width: auto; margin-top: calc(60 * var(--m)); text-align: center; }
    .ps-mid__l1 { margin: 0; font-size: calc(55 * var(--m)); }
    .ps-mid__key { margin: calc(40 * var(--m)) 0 0; padding: calc(14 * var(--m)) calc(20 * var(--m)) calc(16 * var(--m)) calc(14 * var(--m)); }
    .ps-mid__key::before, .ps-mid__key::after { width: calc(20 * var(--m)); height: calc(20 * var(--m)); }
    .ps-mid__key em { font-size: calc(62 * var(--m)); }
    .ps-mid__slogan { margin-left: calc(12 * var(--m)); font-size: calc(46 * var(--m)); }

    .ps-keys { margin-top: calc(60 * var(--m)); text-align: left; }
    .ps-keys li { gap: calc(18 * var(--m)); height: calc(80 * var(--m)); padding-left: calc(30 * var(--m)); }
    .ps-keys b { font-size: calc(30 * var(--m)); }
    .ps-keys span { font-size: calc(21 * var(--m)); letter-spacing: -.04em; }

    .ps-pic--aerial { margin-top: calc(70 * var(--m)); }
    .ps-pic--map { margin-top: calc(30 * var(--m)); }
}


/* =========================================================
   홍보센터 공통 · 사각 탭 (.s-tabs) / 관심고객등록 안내 (.s-cta) / 빈 목록
   · 탭 : PC 한 줄 4칸 · 모바일 2칸, 넘치면 한 줄씩 더 쌓임 (칸은 꽉 채움)
========================================================= */
.s-tabs { display: flex; flex-wrap: wrap; padding: 1px 0 0 1px; }
.s-tab {
    flex: 1 0 25%;
    min-width: 0;
    height: calc(64 * var(--u)); min-height: 46px;
    margin: -1px 0 0 -1px;
    padding: 0 calc(16 * var(--u));
    border: 1px solid #d2d2d2;
    background: #fff;
    font-size: max(13px, calc(18 * var(--u)));
    font-weight: 500;
    letter-spacing: -.03em;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background-color .35s ease, color .35s ease, border-color .35s ease;
}
.s-tab:hover { color: var(--navy); }
.s-tab.is-on { position: relative; z-index: 1; border-color: var(--navy); background: var(--navy); font-weight: 600; color: #fff; }
.pv-tabs .s-tab { flex-basis: calc(100% / var(--cols, 4)); }   /* 줄마다 꽉 차게 (남는 줄은 넓어짐) */

.s-empty { padding: calc(120 * var(--u)) 0; text-align: center; font-size: max(14px, calc(18 * var(--u))); color: #888; }

.s-cta { margin-top: calc(140 * var(--u)); padding: calc(84 * var(--u)) calc(40 * var(--u)); background: #f3f5f8; text-align: center; }
.s-cta__txt { font-size: max(18px, calc(30 * var(--u))); font-weight: 600; line-height: 1.45; letter-spacing: -.03em; color: #111; }
.s-cta__btn {
    display: inline-flex; align-items: center; gap: calc(10 * var(--u));
    height: calc(62 * var(--u)); min-height: 46px;
    margin-top: calc(30 * var(--u));
    padding: 0 calc(40 * var(--u));
    background: var(--navy);
    font-size: max(14px, calc(18 * var(--u)));
    font-weight: 600;
    letter-spacing: -.02em;
    color: #fff;
    transition: background-color .35s ease;
}
.s-cta__btn svg { width: calc(12 * var(--u)); min-width: 10px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.s-cta__btn:hover { background: #0a3291; }


@media (max-width: 1023px) {
    .s-tab { flex-basis: 50%; height: calc(88 * var(--m)); min-height: 0; padding: 0 calc(12 * var(--m)); font-size: calc(23 * var(--m)); }
    .pv-tabs .s-tab { flex-basis: 50%; }   /* 모바일은 한 줄 2칸 */
    .s-empty { padding: calc(140 * var(--m)) 0; font-size: calc(24 * var(--m)); }
    .s-cta { margin-top: calc(120 * var(--m)); padding: calc(100 * var(--m)) calc(40 * var(--m)); }
    .s-cta__txt { font-size: calc(36 * var(--m)); }
    .s-cta__btn { gap: calc(12 * var(--m)); height: calc(88 * var(--m)); min-height: 0; margin-top: calc(40 * var(--m)); padding: 0 calc(50 * var(--m)); font-size: calc(25 * var(--m)); }
    .s-cta__btn svg { width: calc(16 * var(--m)); min-width: 0; }
}


/* =========================================================
   홍보센터 > 언론보도 (.pn)
========================================================= */
.pn { padding-top: calc(120 * var(--u)); }
.pn-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(30 * var(--u)); }   /* 긴 글자가 있어도 3칸 같은 폭 */
.pn-item { min-width: 0; }
.pn-item a {
    display: flex; flex-direction: column;
    height: 100%;
    padding: calc(38 * var(--u)) calc(34 * var(--u)) calc(32 * var(--u));
    border: 1px solid #e1e3e7;
    background: #fff;
    transition: border-color .4s ease, box-shadow .5s var(--ease), transform .5s var(--ease);
}
.pn-item a:not(.is-nolink):hover { border-color: var(--navy); box-shadow: 0 18px 40px rgba(5, 32, 95, .1); transform: translate3d(0, -6px, 0); }
.pn-item__media { font-size: max(12px, calc(15 * var(--u))); font-weight: 600; letter-spacing: -.02em; color: var(--navy); }
.pn-item__media, .pn-item__tit, .pn-item__desc { overflow-wrap: anywhere; word-break: keep-all; }   /* 띄어쓰기 없는 긴 글자도 칸 안에서 줄바꿈 */
.pn-item__tit {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    margin-top: calc(14 * var(--u));
    font-size: max(15px, calc(21 * var(--u)));
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: -.03em;
    color: #111;
}
.pn-item__desc {
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    margin-top: calc(16 * var(--u));
    font-size: max(13px, calc(16 * var(--u)));
    line-height: 1.65;
    letter-spacing: -.03em;
    color: #666;
}
.pn-item__date { margin-top: auto; padding-top: calc(24 * var(--u)); font-size: max(12px, calc(14 * var(--u))); color: #999; }

.pn-paging { display: flex; justify-content: center; align-items: center; gap: calc(6 * var(--u)); margin-top: calc(70 * var(--u)); }
.pn-paging a {
    position: relative;
    display: flex; align-items: center; justify-content: center;
    width: calc(40 * var(--u)); height: calc(40 * var(--u)); min-width: 32px; min-height: 32px;
    font-size: max(13px, calc(16 * var(--u)));
    color: #888;
    transition: color .3s ease;
}
.pn-paging__no.is-on { font-weight: 700; color: var(--navy); }
.pn-paging__no.is-on::after { content: ''; position: absolute; left: 25%; right: 25%; bottom: 4px; height: 2px; background: var(--navy); }
.pn-paging a:hover { color: var(--navy); }
/* 화살표 : CSS 로 그림 (« ‹ › ») */
.pn-paging__arw::before, .pn-paging__arw::after {
    content: ''; position: absolute; top: 50%; left: 50%;
    width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px;
    border: solid currentColor; border-width: 0 0 1.5px 1.5px;
}
.pn-paging__arw--prev::before, .pn-paging__arw--first::before, .pn-paging__arw--first::after { transform: translateX(1px) rotate(45deg); }
.pn-paging__arw--next::before, .pn-paging__arw--last::before, .pn-paging__arw--last::after { transform: translateX(-1px) rotate(-135deg); }
.pn-paging__arw--prev::after, .pn-paging__arw--next::after { display: none; }
.pn-paging__arw--first::before { margin-left: -6.5px; } .pn-paging__arw--first::after { margin-left: -.5px; }
.pn-paging__arw--last::before { margin-left: -6.5px; } .pn-paging__arw--last::after { margin-left: -.5px; }

@media (max-width: 1023px) {
    .pn { padding-top: calc(100 * var(--m)); }
    .pn-list { grid-template-columns: minmax(0, 1fr); gap: calc(24 * var(--m)); }
    .pn-item a { padding: calc(40 * var(--m)) calc(36 * var(--m)) calc(34 * var(--m)); }
    .pn-item__media { font-size: calc(20 * var(--m)); }
    .pn-item__tit { margin-top: calc(14 * var(--m)); font-size: calc(28 * var(--m)); }
    .pn-item__desc { margin-top: calc(16 * var(--m)); font-size: calc(21 * var(--m)); }
    .pn-item__date { padding-top: calc(26 * var(--m)); font-size: calc(19 * var(--m)); }
    .pn-paging { gap: calc(4 * var(--m)); margin-top: calc(70 * var(--m)); }
    .pn-paging a { width: calc(60 * var(--m)); height: calc(60 * var(--m)); min-width: 0; min-height: 0; font-size: calc(23 * var(--m)); }
}


/* =========================================================
   홍보센터 > 홍보영상 (.pv) · 탭이 영상 위에 딱 붙음
========================================================= */
.pv { padding-top: calc(120 * var(--u)); }
.pv-stage { position: relative; aspect-ratio: 16 / 9; background: #000; }
.pv-player, .pv-stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.pv-sound {
    position: absolute; z-index: 2; right: calc(24 * var(--u)); top: calc(24 * var(--u));
    display: inline-flex; align-items: center; gap: calc(8 * var(--u));
    height: calc(46 * var(--u)); min-height: 38px;
    padding: 0 calc(18 * var(--u));
    border-radius: 999px;
    background: rgba(0, 0, 0, .55);
    font-size: max(12px, calc(15 * var(--u)));
    font-weight: 600;
    color: #fff;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.pv-sound[hidden] { display: none; }
.pv-sound svg { width: calc(20 * var(--u)); min-width: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pv-sound svg path:first-child { fill: currentColor; }

@media (max-width: 1023px) {
    .pv { padding-top: calc(100 * var(--m)); }
    /* 플레이어 높이 : 일반 16:9 → 숏폼 9:16 (화면 높이 78% 까지) · 부드럽게 바뀜 */
    .pv-stage { aspect-ratio: auto; height: calc((100vw - 80 * var(--m)) * 9 / 16); transition: height .6s var(--ease); }
    .pv-box.is-short .pv-stage { height: min(calc((100vw - 80 * var(--m)) * 16 / 9), 78svh); }
    .pv-sound { right: calc(16 * var(--m)); top: calc(16 * var(--m)); gap: calc(8 * var(--m)); height: calc(54 * var(--m)); min-height: 0; padding: 0 calc(20 * var(--m)); font-size: calc(20 * var(--m)); }
    .pv-sound svg { width: calc(24 * var(--m)); min-width: 0; }
}


/* =========================================================
   홍보센터 > 이벤트 당첨자 (.pw) · 티저 통이미지 위에 명단
========================================================= */
.pw { padding-top: calc(120 * var(--u)); }
.pw-panels { margin-top: calc(40 * var(--u)); }
.pw-panel[hidden] { display: none; }
.pw-panel.is-on { animation: pwIn .7s var(--ease); }
@keyframes pwIn { from { opacity: 0; transform: translate3d(0, 16px, 0); } to { opacity: 1; transform: none; } }

/* 흰 카드 위치 (티저 실측값 그대로) */
.pw-board { position: relative; --wSide: 11%; --wTop: 25%; --wBottom: 6%; }
.pw-board__bg, .pw-board__bg img { display: block; width: 100%; height: auto; }
.pw-board__body {
    position: absolute;
    left: var(--wSide); right: var(--wSide); top: var(--wTop); bottom: var(--wBottom);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.pw-guide { margin-bottom: calc(22 * var(--u)); font-size: max(13px, calc(19 * var(--u))); line-height: 1.6; letter-spacing: -.03em; color: #4a4f57; }
.pw-key {
    display: inline-block;
    min-width: calc(34 * var(--u));
    padding: calc(2 * var(--u)) calc(8 * var(--u));
    border: 1px solid #c7ccd3; border-radius: 5px;
    background: #f5f6f8;
    font-size: max(12px, calc(18 * var(--u)));
    font-weight: 600;
    line-height: 1.4;
    color: #333;
    text-align: center;
    vertical-align: middle;
}
.pw-cols { display: flex; gap: calc(20 * var(--u)); }
.pw-cols.is-mo { display: none; }
.pw-table { flex: 1 1 50%; width: 100%; border-collapse: collapse; }
.pw-table th { padding: calc(12 * var(--u)) calc(8 * var(--u)); background: #dfe7f5; font-size: max(12px, calc(16 * var(--u))); font-weight: 600; letter-spacing: .05em; color: var(--navy); text-align: center; }
.pw-table td { padding: calc(7 * var(--u)) calc(8 * var(--u)); border-bottom: 1px solid #eceef1; font-size: max(12px, calc(15 * var(--u))); letter-spacing: .01em; color: #14161a; text-align: center; }
.pw-table tbody tr:hover td { background: #f6f8fb; }
.pw-notice { margin-top: calc(15 * var(--u)); font-size: max(12px, calc(14 * var(--u))); line-height: 1.6; letter-spacing: -.02em; color: #8b9098; text-align: right; }

@media (max-width: 1023px) {
    .pw { padding-top: calc(100 * var(--m)); }
    .pw-panels { margin-top: calc(40 * var(--m)); }
    .pw-board { --wSide: 9%; --wTop: 15%; --wBottom: 4%; }
    .pw-guide { margin-bottom: calc(26 * var(--m)); font-size: calc(21 * var(--m)); }
    .pw-key { min-width: calc(46 * var(--m)); padding: calc(3 * var(--m)) calc(10 * var(--m)); border-radius: 6px; font-size: calc(18 * var(--m)); }
    .pw-cols.is-pc { display: none; }
    .pw-cols.is-mo { display: flex; }
    .pw-table th { padding: calc(16 * var(--m)) calc(6 * var(--m)); font-size: calc(23 * var(--m)); }
    .pw-table td { padding: calc(8 * var(--m)) calc(6 * var(--m)); font-size: calc(22 * var(--m)); }
    .pw-notice { margin-top: calc(18 * var(--m)); font-size: calc(18 * var(--m)); }
}


/* =========================================================
   홍보센터 > 관심고객등록 (.rg) · 폼 마크업(t3s5-)은 티저 그대로
========================================================= */
.rg { padding-top: calc(120 * var(--u)); }
.rg-en { font-family: var(--ff-en); font-size: max(13px, calc(18 * var(--u))); font-weight: 600; letter-spacing: .2em; color: var(--navy); }
.rg-tit { margin-top: calc(14 * var(--u)); font-size: max(26px, calc(46 * var(--u))); font-weight: 700; letter-spacing: -.04em; color: #111; }
.rg-desc { font-size: max(15px, calc(21 * var(--u))); line-height: 1.6; letter-spacing: -.03em; color: #444; }
.rg-body { width: calc(900 * var(--u)); max-width: 100%; margin: 0 auto 0; letter-spacing: -.03em; }
.rg .t3s5-submit:not(.t3s5-submit-btm) { display: none; }   /* 티저 왼쪽 버튼 (사용 안 함) */
.rg .nav-arw { display: none; }

/* 동의 */
.rg .t3s5-agree h4, .rg .t3s5-inhead h4 { font-size: max(16px, calc(22 * var(--u))); font-weight: 700; color: #111; }
.rg .t3s5-terms {
    height: calc(230 * var(--u)); min-height: 180px;
    margin-top: calc(16 * var(--u));
    padding: calc(24 * var(--u)) calc(28 * var(--u));
    overflow-y: auto;
    border: 1px solid #dcdfe4;
    background: #fafbfc;
    font-size: max(12px, calc(14.5 * var(--u)));
    line-height: 1.75;
    color: #666;
}
.rg .t3s5-terms b { color: #333; }
.rg .t3s5-terms p + p b { display: inline-block; margin-top: calc(10 * var(--u)); }
.rg .t3s5-radio { display: flex; flex-wrap: wrap; gap: calc(12 * var(--u)) calc(34 * var(--u)); margin-top: calc(18 * var(--u)); }
.rg .t3s5-radio label { display: inline-flex; align-items: center; gap: calc(10 * var(--u)); font-size: max(13px, calc(16 * var(--u))); color: #333; cursor: pointer; }
.rg .t3s5-radio em { font-style: normal; color: #999; }
.rg .t3s5-radio input, .rg .t3s5-choice input { position: absolute; opacity: 0; pointer-events: none; }
.rg .t3s5-radio i {
    position: relative; flex: none;
    width: calc(22 * var(--u)); height: calc(22 * var(--u)); min-width: 18px; min-height: 18px;
    border: 1px solid #b5bac2; border-radius: 50%;
    transition: border-color .3s ease;
}
.rg .t3s5-radio i::after { content: ''; position: absolute; inset: 25%; border-radius: 50%; background: var(--navy); transform: scale(0); transition: transform .3s var(--ease); }
.rg .t3s5-radio input:checked + i { border-color: var(--navy); }
.rg .t3s5-radio input:checked + i::after { transform: scale(1); }
.rg .t3s5-radio input:focus-visible + i { outline: 2px solid var(--navy); outline-offset: 2px; }

/* 고객정보 */
.rg .t3s5-input { margin-top: calc(64 * var(--u)); }
.rg .t3s5-inhead { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: calc(14 * var(--u)); border-bottom: 2px solid #111; }
.rg .t3s5-inhead span { font-size: max(12px, calc(14 * var(--u))); color: #888; }
.rg .t3s5-inhead em, .rg .t3s5-row > label b { font-style: normal; font-weight: 700; color: #d6402f; }
.rg .t3s5-row {
    display: grid; grid-template-columns: calc(160 * var(--u)) 1fr; align-items: center;
    column-gap: calc(20 * var(--u));
    padding: calc(22 * var(--u)) 0;
    border-bottom: 1px solid #e6e8ec;
}
.rg .t3s5-row > label { font-size: max(14px, calc(17 * var(--u))); font-weight: 600; color: #222; }
.rg .t3s5-field input[type="text"], .rg .t3s5-field input[type="tel"] {
    width: 100%;
    height: calc(54 * var(--u)); min-height: 42px;
    padding: 0 calc(18 * var(--u));
    border: 1px solid #cfd3d9;
    border-radius: 0;
    background: #fff;
    font: inherit;
    font-size: max(14px, calc(16 * var(--u)));
    color: #111;
    transition: border-color .3s ease;
}
.rg .t3s5-field input:focus { outline: none; border-color: var(--navy); }
.rg .t3s5-field input.is-error { border-color: #d6402f; }
.rg .t3s5-tel { display: flex; align-items: center; gap: calc(10 * var(--u)); }
.rg .t3s5-tel input { flex: 1; text-align: center; }
.rg .t3s5-dash { color: #999; }

/* 선택 버튼 (관심 타입 · 연령 · 성별 · 지역 · 청약통장) */
.rg .t3s5-choice-group { display: flex; flex-wrap: wrap; gap: calc(10 * var(--u)); }
.rg .t3s5-choice {
    position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    min-width: calc(96 * var(--u));
    height: calc(46 * var(--u)); min-height: 38px;
    padding: 0 calc(18 * var(--u));
    border: 1px solid #cfd3d9;
    background: #fff;
    font-size: max(13px, calc(15.5 * var(--u)));
    color: #444;
    cursor: pointer;
    transition: background-color .3s ease, border-color .3s ease, color .3s ease;
}
.rg .t3s5-choice i { display: none; }
.rg .t3s5-choice:hover { border-color: var(--navy); color: var(--navy); }
.rg .t3s5-choice:has(input:checked) { border-color: var(--navy); background: var(--navy); color: #fff; }
.rg .t3s5-choice:has(input:focus-visible) { outline: 2px solid var(--navy); outline-offset: 2px; }
.rg .t3s5-choice-group--type2 { flex-direction: column; gap: calc(10 * var(--u)); }
.rg .t3s5-unit { display: flex; align-items: center; gap: calc(14 * var(--u)); }
.rg .t3s5-unit-tit { flex: none; width: calc(52 * var(--u)); font-size: max(13px, calc(15 * var(--u))); font-weight: 700; color: var(--navy); }
.rg .t3s5-unit-list { display: flex; flex-wrap: wrap; gap: calc(10 * var(--u)); }

.rg .t3s5-error { min-height: 1.6em; margin-top: calc(20 * var(--u)); font-size: max(13px, calc(15 * var(--u))); color: #d6402f; text-align: center; }
.rg .t3s5-submit-btm {
    display: flex; align-items: center; justify-content: center;
    width: calc(340 * var(--u)); min-width: 220px;
    height: calc(72 * var(--u)); min-height: 52px;
    margin: calc(20 * var(--u)) auto 0;
    background: var(--navy);
    font-size: max(15px, calc(20 * var(--u)));
    font-weight: 700;
    color: #fff;
    transition: background-color .35s ease;
}
.rg .t3s5-submit-btm:hover { background: #0a3291; }

@media (max-width: 1023px) {
    .rg { padding-top: calc(100 * var(--m)); }
    .rg-en { font-size: calc(22 * var(--m)); }
    .rg-tit { margin-top: calc(14 * var(--m)); font-size: calc(54 * var(--m)); }
    .rg-desc { font-size: calc(25 * var(--m)); }
    .rg-body { width: auto; margin-top: calc(70 * var(--m)); }
    .rg .t3s5-agree h4, .rg .t3s5-inhead h4 { font-size: calc(28 * var(--m)); }
    .rg .t3s5-terms { height: calc(320 * var(--m)); min-height: 0; margin-top: calc(18 * var(--m)); padding: calc(26 * var(--m)) calc(28 * var(--m)); font-size: calc(19 * var(--m)); }
    .rg .t3s5-radio { flex-direction: column; gap: calc(16 * var(--m)); margin-top: calc(24 * var(--m)); }
    .rg .t3s5-radio label { gap: calc(12 * var(--m)); font-size: calc(22 * var(--m)); }
    .rg .t3s5-radio i { width: calc(30 * var(--m)); height: calc(30 * var(--m)); min-width: 0; min-height: 0; }
    .rg .t3s5-input { margin-top: calc(80 * var(--m)); }
    .rg .t3s5-inhead { padding-bottom: calc(16 * var(--m)); }
    .rg .t3s5-inhead span { font-size: calc(19 * var(--m)); }
    .rg .t3s5-row { grid-template-columns: 1fr; row-gap: calc(16 * var(--m)); padding: calc(30 * var(--m)) 0; }
    .rg .t3s5-row > label { font-size: calc(23 * var(--m)); }
    .rg .t3s5-field input[type="text"], .rg .t3s5-field input[type="tel"] { height: calc(80 * var(--m)); min-height: 0; padding: 0 calc(22 * var(--m)); font-size: calc(24 * var(--m)); }
    .rg .t3s5-tel { gap: calc(12 * var(--m)); }
    .rg .t3s5-choice-group { gap: calc(12 * var(--m)); }
    .rg .t3s5-choice { min-width: calc(140 * var(--m)); height: calc(70 * var(--m)); min-height: 0; padding: 0 calc(20 * var(--m)); font-size: calc(22 * var(--m)); }
    .rg .t3s5-choice-group--age .t3s5-choice, .rg .t3s5-choice-group--region .t3s5-choice { flex: 1 0 calc(33% - 12 * var(--m)); min-width: 0; }
    .rg .t3s5-choice-group--gender .t3s5-choice, .rg .t3s5-choice-group--bank .t3s5-choice { flex: 1 0 calc(25% - 12 * var(--m)); min-width: 0; }
    .rg .t3s5-unit { flex-direction: column; align-items: flex-start; gap: calc(10 * var(--m)); }
    .rg .t3s5-unit-tit { width: auto; font-size: calc(21 * var(--m)); }
    .rg .t3s5-unit-tit:empty { display: none; }
    .rg .t3s5-unit-list { gap: calc(12 * var(--m)); }
    .rg .t3s5-choice-group--type2 { gap: calc(20 * var(--m)); }
    .rg .t3s5-error { margin-top: calc(24 * var(--m)); font-size: calc(22 * var(--m)); }
    .rg .t3s5-submit-btm { width: 100%; min-width: 0; height: calc(100 * var(--m)); min-height: 0; margin-top: calc(24 * var(--m)); font-size: calc(28 * var(--m)); }
}



/* =========================================================
   모션 줄이기 설정 사용자
========================================================= */
@media (prefers-reduced-motion: reduce) {
    .sv *, .sv *::before { transition: none !important; animation: none !important; }
    .js [data-rv] { opacity: 1; transform: none; transition: none; }
}

















/* =========================================================
   단지안내 · 세대안내 · 분양안내 공통 : 탭 + 통이미지
   · .s-pg     : 서브 상단 아래 첫 간격 (시안 PC 128 / 모바일 170)
   · .s-ptabs  : 띄어진 사각 탭 (5칸 = 세대안내 / 2칸 = 1단지·2단지)
   · .s-ppanel : 탭 내용 · 바꿀 때 살짝 페이드 (sub.js 10번이 .is-show)
   · 탭 아래 간격 = 페이지마다 --tg
   · 순서 : 공통 → 단지설계(.ds) → 커뮤니티(.cm) → 시스템(.sy) → 모집공고(.nt)
========================================================= */
.s-pg { padding-top: calc(128 * var(--u)); }
.s-full { margin: 0; }
.s-full picture, .s-full img { display: block; width: 100%; height: auto; }

.s-ptabs { display: flex; flex-wrap: wrap; justify-content: center; gap: calc(13 * var(--u)); }
.s-ptab {
    width: calc(187 * var(--u)); min-width: 96px;
    height: calc(73 * var(--u)); min-height: 44px;
    padding: 0 calc(10 * var(--u));
    border: 1px solid #d5d5d5;
    background: #fff;
    font-size: max(14px, calc(20 * var(--u)));
    font-weight: 600;
    letter-spacing: -.02em;
    color: #111;
    white-space: nowrap;
    transition: background-color .35s ease, border-color .35s ease, color .35s ease;
}
.s-ptab:hover { border-color: var(--navy); color: var(--navy); }
.s-ptab.is-on { border-color: var(--navy); background: var(--navy); color: #fff; }
.s-ptab:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }
.s-ptabs--n2 { gap: calc(12 * var(--u)); }
.s-ptabs--n2 .s-ptab { width: calc(217 * var(--u)); min-width: 130px; font-size: max(13px, calc(18 * var(--u))); }

.s-ppanels { margin-top: var(--tg, calc(60 * var(--u))); }
.s-ppanel[hidden] { display: none; }
.s-ppanel:focus { outline: none; }
.s-ppanel.is-show { animation: sPanelIn .7s var(--ease) both; }
@keyframes sPanelIn {
    from { opacity: 0; transform: translate3d(0, 20px, 0); }
    to   { opacity: 1; transform: none; }
}

/* 탭 아래 간격 (시안) */
.sub--unit .s-ppanels,
.sub--supply .s-ppanels { --tg: calc(123 * var(--u)); }
.sub--dongho .s-ppanels { --tg: calc(66 * var(--u)); }
.sub--place .s-ppanels  { --tg: calc(63 * var(--u)); }
.sub--design .s-ppanels { --tg: calc(61 * var(--u)); }

/* 유의사항 위 간격 */
.sub--unit .s-notes, .sub--schedule .s-notes, .sub--supply .s-notes,
.sub--notice .s-notes, .sub--system .s-notes, .sub--finish .s-notes, .sub--community .s-notes { margin-top: calc(120 * var(--u)); }
.sub--dongho .s-notes { margin-top: calc(63 * var(--u)); }
.sub--place .s-notes  { margin-top: calc(98 * var(--u)); }


/* ---------- 단지설계 (.ds) : 사진 1100x616 + 왼쪽 아래 캡션 ---------- */
.ds-pic { position: relative; margin: 0; overflow: hidden; }
.ds-pic + .ds-pic { margin-top: calc(49 * var(--u)); }
.ds-pic img { display: block; width: 100%; height: auto; aspect-ratio: 1100 / 616; object-fit: cover; }
.ds-pic figcaption {
    position: absolute; left: calc(18 * var(--u)); bottom: calc(16 * var(--u));
    font-size: max(13px, calc(19 * var(--u)));
    font-weight: 500;
    letter-spacing: -.02em;
    color: #fff;
    text-shadow: 0 0 10px rgba(0, 0, 0, .35);
}


/* ---------- 커뮤니티 (.cm) ---------- */
/* 왼쪽 : 타이틀(위) + 1단지 라벨(아래) / 오른쪽 : 시설 목록 */
.cm-head {
    display: grid;
    grid-template-columns: calc(534 * var(--u)) 1fr;
    grid-template-areas: "tit list" "lab list";
}
.cm-copy { grid-area: tit; }
.cm-tit { margin-top: calc(-9 * var(--u)); font-size: max(26px, calc(52 * var(--u))); font-weight: 400; line-height: 1.38; letter-spacing: -.04em; color: #0066b3; }
.cm-tit b { font-weight: 700; }
.cm-desc { margin-top: calc(28 * var(--u)); font-size: max(14px, calc(19 * var(--u))); line-height: 1.65; letter-spacing: -.03em; color: #555; }
.cm-list { grid-area: list; padding-left: calc(28 * var(--u)); border-left: 1px solid var(--navy); }
.cm-list li { font-size: max(13px, calc(19 * var(--u))); line-height: 2.37; letter-spacing: -.03em; color: #111; }
.cm-list b { margin-right: .45em; font-weight: 700; color: var(--navy); }

.cm-lab {
    display: flex; align-items: center; justify-content: center;
    width: calc(216 * var(--u)); min-width: 140px;
    height: calc(72 * var(--u)); min-height: 44px;
    margin: 0;
    background: #0066b3;
    font-size: max(13px, calc(18 * var(--u)));
    font-weight: 600;
    letter-spacing: -.02em;
    color: #fff;
}
.cm-head .cm-lab { grid-area: lab; align-self: end; margin-top: calc(50 * var(--u)); }

.cm-cx + .cm-cx { margin-top: calc(69 * var(--u)); }
.cm-plan { margin-top: calc(75 * var(--u)); }
.cm-lab + .cm-plan { margin-top: calc(65 * var(--u)); }

.cm-pics { display: grid; grid-template-columns: repeat(3, calc(353 * var(--u))); justify-content: space-between; margin-top: calc(79 * var(--u)); }
.cm-pic { margin: 0; }
.cm-pic img { display: block; width: 100%; height: auto; aspect-ratio: 353 / 195; object-fit: cover; }
.cm-pic figcaption {
    margin-top: calc(18 * var(--u));
    padding-left: calc(12 * var(--u));
    border-left: 3px solid #111;
    font-size: max(13px, calc(19 * var(--u)));
    line-height: 1.5;
    letter-spacing: -.03em;
    color: #111;
}


/* ---------- 시스템 (.sy) ---------- */
.sy { padding-top: calc(118 * var(--u)); text-align: center; }
.sy-tit { font-family: var(--ff-en); font-size: max(36px, calc(72 * var(--u))); font-weight: 700; line-height: 1; letter-spacing: .01em; color: var(--navy); }
.sy-sub { margin-top: calc(34 * var(--u)); font-size: max(15px, calc(24 * var(--u))); font-weight: 500; letter-spacing: -.03em; color: var(--navy); }
.sy-box { margin-top: calc(58 * var(--u)); }


/* ---------- 모집공고 (.nt) : 통이미지 위 % 링크 (이미지맵) ---------- */
.nt { position: relative; max-width: 1100px; margin-left: auto; margin-right: auto; }   /* 이미지 원래 크기(1100)보다 크게 늘리지 않음 */
.nt picture, .nt img { display: block; width: 100%; height: auto; }
.nt > picture { position: relative; z-index: 1; margin-top: -9%; }   /* 버튼 이미지(1100x562)가 투시도 아래 99px 겹쳐 올라감 */

/* 투시도 롤링 : 사진 영역 1100x664 (모바일 750x412) */
.nt-roll { position: relative; z-index: 0; width: 100%; aspect-ratio: 1100 / 664; overflow: hidden; }
.nt-roll img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.2s ease; }
.nt-roll img.is-on { opacity: 1; }
.nt-hot {
    position: absolute; z-index: 2;
    left: calc(var(--x) * 1%); top: calc(var(--y) * 1%);
    width: calc(var(--w) * 1%); height: calc(var(--h) * 1%);
}
.nt-hot::after { content: ''; position: absolute; inset: 0; background: #fff; opacity: 0; transition: opacity .3s ease; }
.nt-hot--reader::after { background: #000; }
.nt-hot:hover::after { opacity: .12; }
.nt-hot--reader:hover::after { opacity: .05; }
.nt-hot:focus-visible { outline: 2px solid #fff; outline-offset: -5px; }
.nt-hot--reader:focus-visible { outline-color: var(--navy); }


@media (max-width: 1023px) {
    .s-pg { padding-top: calc(170 * var(--m)); }

    /* 탭 : 5칸 = 한 줄 3칸 왼쪽부터 / 2칸 = 가운데 */
    .s-ptabs { gap: calc(14 * var(--m)) calc(15 * var(--m)); }
    .s-ptabs--n5 { justify-content: flex-start; }
    .s-ptab { width: calc(213 * var(--m)); min-width: 0; height: calc(84 * var(--m)); min-height: 0; padding: 0 calc(10 * var(--m)); font-size: calc(24 * var(--m)); }
    .s-ptabs--n2 { gap: calc(12 * var(--m)); }
    .s-ptabs--n2 .s-ptab { width: calc(217 * var(--m)); min-width: 0; height: calc(73 * var(--m)); font-size: calc(22 * var(--m)); }

    .s-ppanels { --tg: calc(60 * var(--m)); }
    .sub--unit .s-ppanels   { --tg: calc(71 * var(--m)); }
    .sub--supply .s-ppanels { --tg: calc(60 * var(--m)); }
    .sub--dongho .s-ppanels { --tg: calc(121 * var(--m)); }
    .sub--place .s-ppanels  { --tg: calc(58 * var(--m)); }
    .sub--design .s-ppanels { --tg: calc(107 * var(--m)); }

    .sub--unit .s-notes, .sub--schedule .s-notes, .sub--supply .s-notes,
    .sub--notice .s-notes, .sub--system .s-notes, .sub--finish .s-notes, .sub--community .s-notes,
    .sub--dongho .s-notes, .sub--place .s-notes { margin-top: calc(100 * var(--m)); }

    /* 단지설계 */
    .ds-pic + .ds-pic { margin-top: calc(30 * var(--m)); }
    .ds-pic figcaption { left: calc(14 * var(--m)); bottom: calc(12 * var(--m)); font-size: calc(26 * var(--m)); }

    /* 커뮤니티 : 타이틀 → 목록 → 1단지 라벨 */
    .cm-head { grid-template-columns: 1fr; grid-template-areas: "tit" "list" "lab"; }
    .cm-tit { margin-top: calc(-10 * var(--m)); font-size: calc(60 * var(--m)); line-height: 1.4; }
    .cm-desc { margin-top: calc(30 * var(--m)); font-size: calc(24 * var(--m)); }
    .cm-list { margin-top: calc(66 * var(--m)); padding-left: calc(33 * var(--m)); }
    .cm-list li { font-size: calc(23 * var(--m)); line-height: 2.26; letter-spacing: -.04em; }
    .cm-head .cm-lab { margin-top: calc(83 * var(--m)); }
    .cm-lab { width: calc(216 * var(--m)); min-width: 0; height: calc(72 * var(--m)); min-height: 0; font-size: calc(22 * var(--m)); }
    .cm-cx + .cm-cx { margin-top: calc(93 * var(--m)); }
    .cm-plan { margin-top: calc(89 * var(--m)); }
    .cm-lab + .cm-plan { margin-top: calc(117 * var(--m)); }
    .cm-pics { grid-template-columns: 1fr; row-gap: calc(46 * var(--m)); margin-top: calc(71 * var(--m)); }
    .cm-pic img { aspect-ratio: 670 / 367; }
    .cm-pic figcaption { margin-top: calc(22 * var(--m)); padding-left: calc(12 * var(--m)); border-left-width: 2px; font-size: calc(25 * var(--m)); }

    /* 시스템 : 회색 박스 화면 꽉 차게 */
    .sy { padding-top: calc(160 * var(--m)); }
    .sy-tit { font-size: calc(72 * var(--m)); }
    .sy-sub { margin-top: calc(34 * var(--m)); font-size: calc(24 * var(--m)); }
    .sy-box { margin: calc(58 * var(--m)) calc(-40 * var(--m)) 0; }

    /* 화면 꽉 차게 · 단 모바일 이미지 원래 크기(750)보다 크게 늘리지 않음 */
    .nt { --ntw: min(750px, calc(100% + 80 * var(--m))); width: var(--ntw); max-width: none; margin-left: calc((100% - var(--ntw)) / 2); margin-right: 0; }
    .nt-hot { left: calc(var(--mx) * 1%); top: calc(var(--my) * 1%); width: calc(var(--mw) * 1%); height: calc(var(--mh) * 1%); }
    .nt-roll { aspect-ratio: 750 / 412; }
    .nt > picture { margin-top: -6.8%; }   /* 모바일 버튼 이미지(750x704)가 투시도 아래 51px 겹침 */
}

@media (prefers-reduced-motion: reduce) {
    .s-ppanel.is-show { animation: none; }
}

















/* =========================================================
   이미지 크게 보기 (모바일) : [data-zoom] 누르면 전체 화면 + 확대 상태로 열림
   · 손가락으로 상하좌우 이동 · 핀치로 더 확대 가능 · sub.js 11번
========================================================= */
.s-zoom__hint { display: none; }

.s-zoomer {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(0, 0, 0, .92);
    opacity: 0; visibility: hidden;
    transition: opacity .3s ease, visibility 0s .3s;
}
.s-zoomer.is-open { opacity: 1; visibility: visible; transition: opacity .3s ease; }
.s-zoomer__in {
    display: flex;
    width: 100%; height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-x pan-y pinch-zoom;
}
.s-zoomer__in img { display: block; flex: none; width: 1150px; max-width: none; height: auto; margin: auto; background: #fff; }
.s-zoomer__close {
    position: fixed; z-index: 1;
    top: calc(env(safe-area-inset-top, 0px) + 14px); right: 14px;
    width: 44px; height: 44px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .3);
}
.s-zoomer__close::before, .s-zoomer__close::after {
    content: ''; position: absolute; left: 50%; top: 50%;
    width: 20px; height: 2px; margin: -1px 0 0 -10px;
    background: #111;
    transform: rotate(45deg);
}
.s-zoomer__close::after { transform: rotate(-45deg); }
html.is-zoom, html.is-zoom body { overflow: hidden; }

@media (max-width: 1023px) {
    /* 이미지 오른쪽 위 돋보기 표시 */
    .s-zoom { position: relative; cursor: zoom-in; }
    .s-zoom::after {
        content: '';
        position: absolute; top: calc(14 * var(--m)); right: calc(14 * var(--m));
        width: calc(64 * var(--m)); height: calc(64 * var(--m));
        border-radius: 50%;
        background: var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5 20 20M10.5 7.8v5.4M7.8 10.5h5.4'/%3E%3C/svg%3E") center / 54% no-repeat;
        box-shadow: 0 calc(4 * var(--m)) calc(14 * var(--m)) rgba(5, 32, 95, .3);
        pointer-events: none;
    }

    /* 아래 안내 : 돋보기 아이콘 + 문구 알약 버튼 */
    .s-zoom__hint { display: flex; justify-content: center; margin-top: calc(30 * var(--m)); }
    .s-zoom__hint span {
        display: inline-flex; align-items: center; gap: calc(12 * var(--m));
        height: calc(68 * var(--m));
        padding: 0 calc(34 * var(--m)) 0 calc(28 * var(--m));
        border: 1px solid var(--navy);
        border-radius: calc(34 * var(--m));
        background: #fff;
        font-size: calc(24 * var(--m));
        font-weight: 600;
        letter-spacing: -.03em;
        color: var(--navy);
    }
    .s-zoom__hint span::before {
        content: '';
        width: calc(28 * var(--m)); height: calc(28 * var(--m));
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2305205f' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5 20 20M10.5 7.8v5.4M7.8 10.5h5.4'/%3E%3C/svg%3E") center / contain no-repeat;
    }
}






















/* =========================================================
   E모델하우스 (.em) : 타입 탭 + VR iframe
========================================================= */
.sub--emodel .s-notes { margin-top: calc(120 * var(--u)); }

.em-vr { position: relative; aspect-ratio: 16 / 9; background: #111; overflow: hidden; }
.em-vr iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.em-vr--ready { display: flex; align-items: center; justify-content: center; background: #f4f5f7; border: 1px solid #e3e5e9; }
.em-vr--ready p { font-size: max(14px, calc(20 * var(--u))); letter-spacing: -.03em; color: #777; }

.em-foot { display: flex; align-items: center; justify-content: space-between; gap: calc(20 * var(--u)); margin-top: calc(24 * var(--u)); }
.em-hint { font-size: max(13px, calc(17 * var(--u))); letter-spacing: -.03em; color: #777; }
.em-full {
    display: inline-flex; align-items: center; gap: calc(10 * var(--u));
    height: calc(56 * var(--u)); min-height: 40px;
    padding: 0 calc(28 * var(--u));
    background: var(--navy);
    font-size: max(13px, calc(17 * var(--u)));
    font-weight: 600;
    letter-spacing: -.02em;
    color: #fff;
    transition: background-color .3s ease;
}
.em-full::after {
    content: '';
    width: 1em; height: 1em;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6M20 4l-8 8M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.em-full:hover { background: #0b2f86; }
.em-full:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }

@media (max-width: 1023px) {
    .sub--emodel .s-notes { margin-top: calc(100 * var(--m)); }
    .em-vr { aspect-ratio: auto; height: calc(900 * var(--m)); }
    .em-vr--ready p { font-size: calc(24 * var(--m)); }
    .em-foot { flex-direction: column; gap: calc(24 * var(--m)); margin-top: calc(30 * var(--m)); }
    .em-hint { font-size: calc(22 * var(--m)); text-align: center; }
    .em-full { justify-content: center; width: 100%; height: calc(90 * var(--m)); min-height: 0; padding: 0; font-size: calc(26 * var(--m)); }
}



























/* =========================================================
   단지배치도 (.pl) : 문구(코드) + 지도(2배 이미지)
   · PC 가운데 정렬 + 특징 3칸 / 모바일 왼쪽 정렬 + 특징 세로
========================================================= */
.pl-head { text-align: center; }
.pl-sub { font-size: max(14px, calc(24 * var(--u))); line-height: 1.2; letter-spacing: -.03em; color: #111; }
.pl-tit { margin-top: calc(16 * var(--u)); font-size: max(24px, calc(42 * var(--u))); font-weight: 700; line-height: 1.2; letter-spacing: -.03em; color: var(--navy); }

.pl-feats { display: grid; grid-template-columns: calc(417 * var(--u)) calc(404 * var(--u)) 1fr; margin-top: calc(74 * var(--u)); }
.pl-feat__tit {
    display: inline-block;
    padding: 0 calc(10 * var(--u));
    background: #8c734c;
    font-size: max(14px, calc(21 * var(--u)));
    font-weight: 700;
    line-height: max(32px, calc(45 * var(--u)));
    letter-spacing: -.03em;
    color: #fff;
    white-space: nowrap;
}
.pl-feat__desc {
    margin: calc(20 * var(--u)) 0 0 calc(5 * var(--u));
    padding-left: calc(17 * var(--u));
    border-left: 1px solid #555;
    font-size: max(13px, calc(20 * var(--u)));
    line-height: 1.55;
    letter-spacing: -.03em;
    color: #111;
    white-space: nowrap;
}
/* 지도 : 화면 비율 계산 없이 1100px 그대로 1:1 (1~2px만 줄어도 글자가 번져서) · 화면이 좁을 때만 줄어듦 */
.pl-map {
    --plw: min(1100px, calc(100vw - 80px));
    width: var(--plw);
    max-width: none;
    margin-top: calc(52 * var(--u));
    margin-left: calc((100% - var(--plw)) / 2);
}

@media (max-width: 1023px) {
    .pl-head { text-align: left; }
    .pl-sub { font-size: calc(28 * var(--m)); }
    .pl-tit { margin-top: calc(14 * var(--m)); font-size: calc(48 * var(--m)); }
    .pl-feats { grid-template-columns: 1fr; row-gap: calc(36 * var(--m)); margin-top: calc(43 * var(--m)); }
    .pl-feat__tit { padding: 0 calc(14 * var(--m)); font-size: calc(24 * var(--m)); line-height: calc(53 * var(--m)); }
    .pl-feat__desc { margin: calc(26 * var(--m)) 0 0 calc(7 * var(--m)); padding-left: calc(21 * var(--m)); font-size: calc(24 * var(--m)); white-space: normal; }
    .pl-map { width: auto; margin-top: calc(75 * var(--m)); margin-left: 0; }
}















/* =========================================================
   분양안내 > 청약안내 (.sb)
   · PC : 시안 크기 그대로 (탭·타이틀 1100 / 안내문 이미지는 원본 크기 1:1)
   · 모바일 : 같은 이미지 · 누르면 크게 보기
========================================================= */
@media (min-width: 1024px) {
    .sb { --imgw: min(1100px, calc(100vw - 80px)); width: var(--imgw); margin-left: calc((100% - var(--imgw)) / 2); }
}
.sb .s-ppanels { margin-top: 0; }

/* 일반공급 / 특별공급 */
.sb-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.sb-tab {
    height: 73px;
    border: 1px solid #d5d5d5;
    background: #fff;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -.02em;
    color: #111;
    transition: background-color .35s ease, border-color .35s ease, color .35s ease;
}
.sb-tab:hover { border-color: var(--navy); color: var(--navy); }
.sb-tab.is-on { border-color: var(--navy); background: var(--navy); color: #fff; }

/* 특별공급 7개 */
.sb-subtabs { display: flex; gap: 17px; margin-top: 22px; }
.sb-subtab {
    flex: 1 1 0; min-width: 0;
    height: 60px;
    background: #d5d5d5;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -.03em;
    color: #222;
    white-space: nowrap;
    transition: background-color .35s ease, color .35s ease;
}
.sb-subtab:hover { background: #c4c4c4; }
.sb-subtab.is-on { background: #0066b3; color: #fff; }
.sb-tab:focus-visible, .sb-subtab:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }



/* 안내문 통이미지 : 원본 크기 그대로 */
.sb-doc { margin: 80px 0 0; }
.sb-doc img { display: block; width: auto; max-width: 100%; height: auto; margin: 0 auto; }

@media (max-width: 1023px) {
    .sb-tabs { gap: calc(14 * var(--m)); }
    .sb-tab { height: calc(84 * var(--m)); font-size: calc(26 * var(--m)); }
    /* 한 줄 4칸 · 남는 줄은 칸이 늘어나서 꽉 참 (4 + 3) */
    .sb-subtabs { display: flex; flex-wrap: wrap; gap: calc(10 * var(--m)); margin-top: calc(20 * var(--m)); }
    .sb-subtab { flex: 1 0 calc((100% - 30 * var(--m)) / 4); height: calc(70 * var(--m)); font-size: calc(22 * var(--m)); }
    .sb-doc { display: flex; flex-direction: column; margin-top: calc(60 * var(--m)); }
    .sb-doc::after { display: none; }   /* 오른쪽 위 돋보기 표시 숨김 (로고 가림) */
    .sb-doc .s-zoom__hint { order: -1; margin: 0 0 calc(24 * var(--m)); }   /* 「눌러서 크게 보기」 버튼을 이미지 위로 */
}