/* ============================================================
variations_v5.css — V5 Final
─────────────────────────────────────────────────────────────
/* ============================================================
── 공통 (모든 v5 변형 적용) ──
============================================================ */
html[data-cv="v5"] body { background: #fff !important; }
html[data-cv="v5"][data-index] header:not(.fixed) {
background: transparent !important;
background-color: transparent !important;
box-shadow: none !important;
}
html[data-cv="v5"][data-index] header:not(.fixed) .gnb_1da,
html[data-cv="v5"][data-index] header:not(.fixed) .hd_wrap .hd_tel,
html[data-cv="v5"][data-index] header:not(.fixed) .gnb_menu_btn { color: var(--ht, #fff) !important; }
html[data-cv="v5"] header.fixed { background: var(--p-97, rgba(20,20,30,0.97)) !important; }
/* 헤더 데코 라인/border 일괄 제거 (사용자: border 효과 없음 = 고급) */
html[data-cv="v5"] header,
html[data-cv="v5"] header.fixed { border: none !important; }
html[data-cv="v5"] header::before,
html[data-cv="v5"] header::after,
html[data-cv="v5"] header.fixed::before,
html[data-cv="v5"] header.fixed::after { display: none !important; content: none !important; }
/* 우측 플로팅 — form 숨기고 quick_menu 우측 하단 고정 (데스크탑) */
html[data-cv="v5"] #quick #fwrite2,
html[data-cv="v5"] #quick form[name="fwrite"] { display: none !important; }
html[data-cv="v5"] #quick .quick_menu { display: block !important; }
html[data-cv="v5"] #quick .quick_menu ul { display: flex !important; flex-direction: column !important; gap: 0 !important; list-style: none !important; margin: 0 !important; padding: 0 !important; }
html[data-cv="v5"] #quick .quick_menu a { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 100% !important; gap: 4px !important; text-decoration: none !important; }
html[data-cv="v5"] #ft, html[data-cv="v5"] footer { background: var(--fp) !important; color: var(--ft-ht, #fff) !important; }
html[data-cv="v5"] .sub_title > h2.tit03 { color: var(--text-sub, #555) !important; }
/* 공통 보조 슬롯 (5색 강제 활용) */
html[data-cv="v5"] .h2-tit.tit02 { color: var(--visual-txt, rgba(255,255,255,0.92)) !important; }
html[data-cv="v5"] .wz-tablink.active { color: var(--a2) !important; }
html[data-cv="v5"] .custom-tablink.active { background: var(--a2) !important; color: var(--a1t, #fff) !important; }
html[data-cv="v5"] .sub-con { background: transparent; }
html[data-cv="v5"] .property-container .category { background: var(--a3) !important; color: var(--p) !important; }
@media(max-width:768px){
html[data-cv="v5"] .wz-loc-wrap { grid-template-columns:1fr !important; }
}
/* v5 전체 — 모바일 플로팅 메뉴 하단 고정 바 (quick_menu li 33.333% 고정) */
@media(max-width:860px) {
/* 좌측 플로팅 wz-side-btn 숨김 (데스크탑 전용) */
html[data-cv="v5"] .wz-side-btn { display:none !important; }
/* 우측 quick_menu → 하단 전체 바 */
html[data-cv="v5"] #quick { right:0 !important; left:0 !important; bottom:0 !important; top:auto !important; width:100% !important; z-index:9999 !important; }
html[data-cv="v5"] #quick .quick_menu { width:100% !important; }
html[data-cv="v5"] #quick .quick_menu ul { flex-direction:row !important; gap:0 !important; }
html[data-cv="v5"] #quick .quick_menu ul > li { flex:1 !important; width:33.3333% !important; max-width:33.3333% !important; height:56px !important; border-radius:0 !important; border:none !important; border-top:2px solid var(--p) !important; border-right:1px solid rgba(0,0,0,.08) !important; box-sizing:border-box !important; background:#fff !important; }
html[data-cv="v5"] #quick .quick_menu ul > li:last-child { border-right:none !important; }
html[data-cv="v5"] #quick .quick_menu a { color:var(--p) !important; gap: 2px 0 !important; }
html[data-cv="v5"] #quick .quick_menu a i { font-size:1.4rem !important; }
html[data-cv="v5"] #quick .quick_menu a strong { font-size:.9rem !important; font-weight:700 !important; }
}
/* v5 전체 — 호버 이동 효과 일괄 제거 */
html[data-cv="v5"] .wz-premium-item:hover,
html[data-cv="v5"][data-index] .wz-premium-item:hover { transform:none !important; translate:none !important; scale:none !important; }
html[data-cv="v5"] .wz-premium-item:hover *,
html[data-cv="v5"][data-index] .wz-premium-item:hover * { transform:none !important; translate:none !important; scale:none !important; }
/* v5 전체 — sub_premium dd 기본 레이아웃 */
/* ============================================================
[01] fullhero — 거대 워터마크 임팩트
============================================================ */
html[data-v="fullhero"] .gnb_1da { font-weight:500!important; }
html[data-v="fullhero"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="fullhero"] #ctt table th, html[data-v="fullhero"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; font-weight:700!important; }
html[data-v="fullhero"] .btn_submit, html[data-v="fullhero"] button[type="submit"] { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; padding:0 40px!important; font-weight:700!important; letter-spacing:2px!important; }
html[data-v="fullhero"] .btn_submit:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; }
html[data-v="fullhero"] #submenu { background: var(--p)!important; }
html[data-v="fullhero"] .sub_bc_home { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:0!important; }
html[data-v="fullhero"] .sub_bc_btn:hover, html[data-v="fullhero"] .sub_bc_btn.open { background: var(--a1)!important; color: var(--a1t, #111)!important; }
@media(min-width:861px){
html[data-v="fullhero"] #quick { width:88px!important; right:0!important; }
html[data-v="fullhero"] #quick .quick_menu ul > li { background: var(--p)!important; border-radius:0!important; width:88px!important; height:88px!important; position:relative; overflow:hidden; transition:all .3s; }
html[data-v="fullhero"] #quick .quick_menu ul > li::after { content:""!important; position:absolute; left:0; top:0; width:0; height:100%; background: var(--a1)!important; transition:width .3s; z-index:0; }
html[data-v="fullhero"] #quick .quick_menu ul > li:hover::after { width:100%; }
html[data-v="fullhero"] #quick .quick_menu ul > li > * { position:relative; z-index:1; }
html[data-v="fullhero"] #quick .quick_menu a i { color: var(--a1)!important; font-size:1.7rem!important; }
html[data-v="fullhero"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
html[data-v="fullhero"] #quick .quick_menu a strong { color: var(--ht, #fff)!important; font-size:.9rem!important; }
}
html[data-v="fullhero"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[02] cinema — 21:9 와이드 + 좌측 사이드 정보
============================================================ */
html[data-v="cinema"] .gnb_1da { font-weight: 500 !important; letter-spacing: 1px !important; text-transform: uppercase !important; font-size: 1.1rem !important; }
html[data-v="cinema"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="cinema"] #ctt table th, html[data-v="cinema"] #ctt table td:first-child { background: var(--p)!important; color: var(--a1)!important; padding:16px 22px!important; font-weight:300!important; letter-spacing:3px!important; text-transform:uppercase!important; }
html[data-v="cinema"] #fwrite, html[data-v="cinema"] .contact-form { padding:50px!important; background:#fff!important; }
html[data-v="cinema"] .btn_submit { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:0!important; font-weight:300!important; letter-spacing:4px!important; text-transform:uppercase!important; }
html[data-v="cinema"] .sub_bc_home { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:0!important; }
@media(min-width:861px){
html[data-v="cinema"] #quick { width:80px!important; right:20px!important; }
html[data-v="cinema"] #quick .quick_menu ul > li { background: var(--p)!important; border-radius:0!important; width:80px!important; height:80px!important; box-shadow:none!important; border:1px solid var(--a1-20)!important; border-top:none!important; }
html[data-v="cinema"] #quick .quick_menu ul > li:first-child { border-top:1px solid var(--a1-20)!important; }
html[data-v="cinema"] #quick .quick_menu ul > li:hover { background: var(--a1)!important; }
html[data-v="cinema"] #quick .quick_menu a i { color: var(--a1)!important; }
html[data-v="cinema"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
html[data-v="cinema"] #quick .quick_menu a strong { color: var(--ht, #fff)!important; text-transform:uppercase!important; font-size:.95rem!important; }
}
html[data-v="cinema"] .sub_bg { height:350px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[03] splithero — 좌측 컬러바 강조
============================================================ */
html[data-v="splithero"] .gnb_1da { font-weight:600!important; letter-spacing:.5px!important; }
html[data-v="splithero"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="splithero"] #ctt table th, html[data-v="splithero"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; }
html[data-v="splithero"] .btn_submit { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:4px!important; padding:16px 36px!important; font-weight:700!important; }
html[data-v="splithero"] .sub_bc_home { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:4px!important; }
html[data-v="splithero"] .wz-side-btn__item:hover { background: var(--p)!important; color: var(--ht, #fff)!important; max-width:80px !important; width: 80px !important;; }
@media(min-width:861px){
html[data-v="splithero"] #quick { width:86px!important; right:20px!important; }
html[data-v="splithero"] #quick .quick_menu ul > li { background: var(--p)!important; border-radius:4px!important; width:86px!important; height:86px!important; box-shadow:0 4px 16px var(--a1-12)!important; position:relative; }
html[data-v="splithero"] #quick .quick_menu ul > li::before { content:""!important; position:absolute; left:0; top:0; bottom:0; width:4px; background: var(--a1)!important; }
html[data-v="splithero"] #quick .quick_menu ul > li:hover { background: var(--a1)!important; }
html[data-v="splithero"] #quick .quick_menu ul > li:hover::before { background: var(--p)!important; }
html[data-v="splithero"] #quick .quick_menu a i { color: var(--a1)!important; }
html[data-v="splithero"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
html[data-v="splithero"] #quick .quick_menu a strong { color: var(--ht, #fff)!important; font-size:.9rem!important; }
}
html[data-v="splithero"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[04] mosaic — 그리드 모자이크 카드
============================================================ */
html[data-v="mosaic"] .gnb_1da { font-weight:500!important; }
html[data-v="mosaic"] .gnb_1da:hover { color: var(--a1)!important; }
@media(max-width:768px){
html[data-v="mosaic"] .wz-premium-wrap { grid-template-columns:1fr!important; }
}
html[data-v="mosaic"] .wz-premium-item:hover { transform:none!important; box-shadow:0 12px 32px var(--a1-20)!important; }
@media(max-width:768px){
html[data-v="mosaic"] .sub_premium ul { grid-template-columns:1fr!important; }
}
html[data-v="mosaic"] #ctt table { border-radius:8px!important; overflow:hidden!important; }
html[data-v="mosaic"] #ctt table th, html[data-v="mosaic"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; }
html[data-v="mosaic"] #ctt table td { background: var(--a3)!important; padding:14px 18px!important; }
html[data-v="mosaic"] #fwrite, html[data-v="mosaic"] .contact-form { background: var(--a3)!important; padding:40px!important; border-radius:12px!important; }
html[data-v="mosaic"] .btn_submit { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:8px!important; padding:16px 36px!important; font-weight:700!important; }
html[data-v="mosaic"] .btn_submit:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; }
html[data-v="mosaic"] #submenu { background: var(--submenu-bg, #fff)!important; box-shadow:0 4px 16px var(--a1-12)!important; }
html[data-v="mosaic"] .sub_bc_link, html[data-v="mosaic"] .sub_bc_btn { color: var(--p)!important; }
html[data-v="mosaic"] .sub_bc_home { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:8px!important; }
html[data-v="mosaic"] .wz-side-btn__item:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; max-width:80px !important; width: 80px !important;; }
@media(min-width:861px){
html[data-v="mosaic"] #quick { right:20px!important; }
html[data-v="mosaic"] #quick .quick_menu ul { display:grid!important; }
html[data-v="mosaic"] #quick .quick_menu { }
html[data-v="mosaic"] #quick .quick_menu ul > li { background: var(--p)!important; border-radius:8px!important; width:80px!important; height:80px!important; box-shadow:0 4px 16px var(--a1-12)!important; }
html[data-v="mosaic"] #quick .quick_menu ul > li:hover { background: var(--a1)!important; }
html[data-v="mosaic"] #quick .quick_menu a i { color: var(--a1)!important; font-size:1.6rem!important; }
html[data-v="mosaic"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
html[data-v="mosaic"] #quick .quick_menu a strong { color: var(--ht, #fff)!important; font-size:.9rem!important; }
}
html[data-v="mosaic"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[05] typography — 거대 헤드라인 타이포 위주
============================================================ */
html[data-v="typography"] .wz-loc-wrap{ grid-template-columns: auto;}
html[data-v="typography"] .gnb_1da { font-weight:300!important; letter-spacing:2px!important; }
html[data-v="typography"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="typography"] .inner_wrap > h2.tit { font-size:3.5rem!important; font-weight:200!important; letter-spacing:-1px!important; }
html[data-v="typography"] .wz-pm-desc { font-size:1.05rem!important; font-weight:400!important; margin-top:8px!important; color:var(--text-sub, #555)!important; }
html[data-v="typography"] #ctt table th, html[data-v="typography"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; font-weight:700!important; }
html[data-v="typography"] #ctt table td { background:#fff!important; padding:14px 18px!important; }
html[data-v="typography"] .btn_submit { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; padding:22px 60px!important; font-weight:200!important; letter-spacing:5px!important; text-transform:uppercase!important; }
html[data-v="typography"] .sub_bc_home { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; }
@media(min-width:861px){
html[data-v="typography"] #quick { width:80px!important; right:20px!important; }
html[data-v="typography"] #quick .quick_menu ul > li { background:#fff!important; border:1px solid var(--a1-12)!important; border-top:none!important; border-radius:0!important; width:80px!important; height:80px!important; box-shadow:none!important; }
html[data-v="typography"] #quick .quick_menu ul > li:first-child { border-top:1px solid var(--a1-12)!important; }
html[data-v="typography"] #quick .quick_menu ul > li:hover { background: var(--p)!important; }
html[data-v="typography"] #quick .quick_menu a i { color: var(--p)!important; }
html[data-v="typography"] #quick .quick_menu ul > li:hover a i { color: var(--a1)!important; }
html[data-v="typography"] #quick .quick_menu a strong { color: var(--p)!important; text-transform:uppercase!important; font-size:.9rem!important; }
html[data-v="typography"] #quick .quick_menu ul > li:hover a strong { color: var(--ht, #fff)!important; }
}
html[data-v="typography"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[07] monoline — 흑백 라인 모더니즘
============================================================ */
html[data-v="monoline"] .gnb_1da { letter-spacing:4px!important; text-transform:uppercase!important; font-size:.78rem!important; }
html[data-v="monoline"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="monoline"] .inner_wrap > h2.tit::after { content:''!important; display:block!important; width:24px!important; height:1px!important; background: var(--a1)!important; margin:16px auto 0!important; }
html[data-v="monoline"] #ctt table th, html[data-v="monoline"] #ctt table td:first-child { background:#fff!important; color: var(--p)!important; padding:18px 22px!important; font-weight:300!important; letter-spacing:3px!important; text-transform:uppercase!important; }
html[data-v="monoline"] #ctt table td { background:#fff!important; color: var(--p)!important; padding:18px 22px!important; font-weight:400!important; }
html[data-v="monoline"] .btn_submit { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; padding:0 50px!important; font-weight:300!important; letter-spacing:5px!important; text-transform:uppercase!important; }
html[data-v="monoline"] .sub_bc_home { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; }
html[data-v="monoline"] .wz-side-btn__item:hover { background: var(--p)!important; color: var(--a1)!important; max-width:80px !important; width: 80px !important;; letter-spacing:3px; text-transform:uppercase; }
@media(min-width:861px){
html[data-v="monoline"] #quick { width:80px!important; right:20px!important; }
html[data-v="monoline"] #quick .quick_menu ul > li { background:#fff!important; border:1px solid var(--a1-12)!important; border-top:none!important; border-radius:0!important; width:80px!important; height:80px!important; box-shadow:none!important; }
html[data-v="monoline"] #quick .quick_menu ul > li:first-child { border-top:1px solid var(--a1-12)!important; }
html[data-v="monoline"] #quick .quick_menu ul > li:hover { background: var(--p)!important; }
html[data-v="monoline"] #quick .quick_menu a i { color: var(--p)!important; font-size:1.5rem!important; }
html[data-v="monoline"] #quick .quick_menu ul > li:hover a i { color: var(--a1)!important; }
html[data-v="monoline"] #quick .quick_menu a strong { color: var(--p)!important; text-transform:uppercase!important;}
html[data-v="monoline"] #quick .quick_menu ul > li:hover a strong { color: var(--ht, #fff)!important; }
}
html[data-v="monoline"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[08] parallax — 패럴랙스 깊이감
============================================================ */
html[data-v="parallax"] .gnb_1da { font-weight:500!important; }
html[data-v="parallax"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="parallax"] #ctt table { border-radius:8px!important; overflow:hidden!important; box-shadow:0 4px 16px var(--a1-12)!important; }
html[data-v="parallax"] #ctt table th, html[data-v="parallax"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; }
html[data-v="parallax"] #ctt table td { background: var(--a3)!important; padding:14px 18px!important; }
html[data-v="parallax"] #fwrite, html[data-v="parallax"] .contact-form { background: var(--a3)!important; padding:40px!important; border-radius:12px!important; box-shadow:0 8px 24px var(--a1-12)!important; }
html[data-v="parallax"] .btn_submit { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:8px!important; padding:0 40px!important; font-weight:700!important; transition:transform .2s; }
html[data-v="parallax"] .btn_submit:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; transform:translateY(-2px); }
html[data-v="parallax"] #submenu { background: var(--submenu-bg, #fff)!important; box-shadow:0 4px 16px var(--a1-12)!important; }
html[data-v="parallax"] .sub_bc_link, html[data-v="parallax"] .sub_bc_btn { color: var(--p)!important; }
html[data-v="parallax"] .sub_bc_home { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:8px!important; }
@media(min-width:861px){
html[data-v="parallax"] #quick { width:84px!important; right:20px!important; }
html[data-v="parallax"] #quick .quick_menu ul > li { background: var(--p)!important; border-radius:8px!important; width:84px!important; height:84px!important; box-shadow:0 8px 24px var(--a1-20)!important; transition:transform .3s; }
html[data-v="parallax"] #quick .quick_menu ul > li:hover { background: var(--a1)!important; transform:translateY(-4px) scale(1.05); }
html[data-v="parallax"] #quick .quick_menu a i { color: var(--a1)!important; font-size:1.7rem!important; }
html[data-v="parallax"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
html[data-v="parallax"] #quick .quick_menu a strong { color: var(--ht, #fff)!important; font-size:.7rem!important; }
}
html[data-v="parallax"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[09] luxury — 좌측 고정 사이드 + 우측 콘텐츠
============================================================ */
html[data-v="luxury"] .gnb_1da { font-weight:500!important; }
html[data-v="luxury"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="luxury"] #ctt table th, html[data-v="luxury"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; }
html[data-v="luxury"] #ctt table td { background:#fff!important; padding:14px 18px!important; }
html[data-v="luxury"] .btn_submit { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; padding:0 40px!important; font-weight:700!important; }
html[data-v="luxury"] .btn_submit:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; }
html[data-v="luxury"] .sub_bc_home { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:0!important; }
/* 좌측 플로팅 — 큰 사이드 패널 */
html[data-v="luxury"] .wz-side-btn__item:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; max-width:160px!important; }
/* 우측 플로팅 — 작은 컴팩트 */
@media(min-width:861px){
html[data-v="luxury"] #quick { width:60px!important; right:0!important; }
html[data-v="luxury"] #quick .quick_menu ul > li {
background: var(--a3) !important;
border: 1px solid var(--a1-12) !important;
border-right: none !important;
border-radius: 8px !important;
width: 70px !important;
height: 70px !important;
box-shadow: none !important;
}
html[data-v="luxury"] #quick .quick_menu ul > li:hover { background: var(--a1)!important; }
html[data-v="luxury"] #quick .quick_menu a i { color: var(--p)!important; font-size:1.4rem!important; }
html[data-v="luxury"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
}
html[data-v="luxury"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[10] minimal — 우측 고정 + 좌측 콘텐츠 (v2 다크오션/에보니 우측 플로팅 흡수)
============================================================ */
html[data-v="minimal"] .gnb_1da { font-weight:500!important; }
html[data-v="minimal"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="minimal"] #ctt table th, html[data-v="minimal"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; }
html[data-v="minimal"] #ctt table td { background: var(--a3)!important; padding:14px 18px!important; }
html[data-v="minimal"] .btn_submit { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:0!important; padding:0 40px!important; font-weight:700!important; }
html[data-v="minimal"] .sub_bc_home { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:0!important; }
/* 좌측 플로팅 — 작은 컴팩트 */
html[data-v="minimal"] .wz-side-btn__item:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; max-width:80px !important; width: 80px !important;; }
/* 우측 플로팅 — 큰 사이드 패널 (v2 흡수) */
@media(min-width:861px){
html[data-v="minimal"] #quick { width:88px!important; right:0!important; height:auto!important; }
html[data-v="minimal"] #quick .quick_menu ul > li { background: var(--p)!important; border-radius:0!important; width:88px!important; height:88px!important; box-shadow:none!important; position:relative; transition:all .3s; }
html[data-v="minimal"] #quick .quick_menu ul > li:hover { background: var(--a1)!important; padding-left:8px; }
html[data-v="minimal"] #quick .quick_menu a i { color: var(--a1)!important; font-size:1.8rem!important; }
html[data-v="minimal"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
html[data-v="minimal"] #quick .quick_menu a strong { color: var(--ht, #fff)!important; }
html[data-v="minimal"] #quick .quick_menu h2 { background: var(--a1)!important; color: var(--a1t, #111)!important; font-weight:800!important; }
}
html[data-v="minimal"] .sub_bg { height:350px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[12] timeline — 좌측 수직선 + 도트
============================================================ */
html[data-v="timeline"] .gnb_1da { font-weight:500!important; letter-spacing:1px!important; }
html[data-v="timeline"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="timeline"] .wz-premium-wrap { padding-left:48px!important; position:relative!important; }
html[data-v="timeline"] #ctt table th, html[data-v="timeline"] #ctt table td:first-child { background: var(--p)!important; color: var(--ht, #fff)!important; padding:14px 18px!important; }
html[data-v="timeline"] #ctt table td { background:#fff!important; padding:14px 18px!important; border-bottom:1px solid var(--a1-12)!important; }
html[data-v="timeline"] .btn_submit { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; padding:0 40px!important; font-weight:700!important; }
html[data-v="timeline"] #submenu { background: var(--submenu-bg, #fff)!important; box-shadow:0 4px 16px var(--a1-12)!important; }
html[data-v="timeline"] .sub_bc_home { background: var(--a1)!important; color: var(--a1t, #111)!important; border-radius:0!important; }
html[data-v="timeline"] .wz-side-btn__item:hover { background: var(--p)!important; color: var(--ht, #fff)!important; max-width:80px !important; width: 80px !important;; }
@media(min-width:861px){
html[data-v="timeline"] #quick { width:86px!important; right:20px!important; }
html[data-v="timeline"] #quick .quick_menu ul > li { background: var(--p)!important; border-radius:0!important; width:86px!important; height:86px!important; transition:all .3s; position:relative; }
html[data-v="timeline"] #quick .quick_menu ul > li::before { content:''!important; position:absolute; left:-12px; top:50%; transform:translateY(-50%); width:8px; height:8px; border-radius:50%; background: var(--a1)!important; }
html[data-v="timeline"] #quick .quick_menu ul > li:hover { background: var(--a1)!important; }
html[data-v="timeline"] #quick .quick_menu a i { color: var(--a1)!important; }
html[data-v="timeline"] #quick .quick_menu ul > li:hover a i { color: var(--a1t, #111)!important; }
html[data-v="timeline"] #quick .quick_menu a strong { color: var(--ht, #fff)!important; font-size:.7rem!important; }
}
html[data-v="timeline"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
/* ============================================================
[15] editorial — 잡지 표지 스타일
============================================================ */
html[data-v="editorial"] .gnb_1da { font-weight:400!important; letter-spacing:2px!important; font-size:.85rem!important; }
html[data-v="editorial"] .gnb_1da:hover { color: var(--a1)!important; }
html[data-v="editorial"] .inner_wrap > h2.tit { text-align:left!important; font-size:3rem!important; font-weight:800!important; letter-spacing:-1px!important; }
html[data-v="editorial"] .wz-premium-item:last-child { border-bottom:none!important; }
html[data-v="editorial"] .wz-premium-item,html[data-v="editorial"] .wz-premium-item * { transition:none!important; }
html[data-v="editorial"] .wz-premium-item:hover { background:transparent!important; transform:none!important; box-shadow:none!important; border:inherit!important; }
html[data-v="editorial"] .wz-premium-item:hover *,html[data-v="editorial"] .wz-premium-item:hover::before,html[data-v="editorial"] .wz-premium-item:hover::after { transform:none!important; translate:none!important; color:inherit!important; }
html[data-v="editorial"] .sub_premium ul li dl dt::after { content:none!important; display:none!important; }
html[data-v="editorial"] #ctt table { border-top:5px solid var(--p)!important; border-bottom:2px solid var(--p)!important; border-collapse:collapse!important; margin-top:40px!important; }
html[data-v="editorial"] #ctt table tr:first-child th,html[data-v="editorial"] #ctt table tr:first-child td { border-top:5px solid var(--p)!important; }
html[data-v="editorial"] #ctt table th { background:rgba(0,0,0,.08)!important; color:var(--p)!important; padding:18px 24px!important; font-weight:700!important; border:1px solid rgba(0,0,0,.08)!important; border-bottom:1px solid var(--a1-20)!important; letter-spacing:-.5px!important; }
html[data-v="editorial"] #ctt table td:first-child { background:#fff!important; color:var(--p)!important; padding:18px 24px!important; font-weight:800!important; letter-spacing:-.5px!important; border-bottom:1px solid var(--a1-20)!important; }
html[data-v="editorial"] #ctt table td { background:#fff!important; color: var(--p)!important; padding:18px 24px!important; border-bottom:1px solid var(--a1-12)!important; }
html[data-v="editorial"] #fwrite, html[data-v="editorial"] .contact-form { background:#fff!important; padding:50px!important; }
html[data-v="editorial"] .btn_submit { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; padding:0 50px!important; font-weight:800!important; letter-spacing:1px!important; }
html[data-v="editorial"] .btn_submit:hover { background: var(--a1)!important; color: var(--a1t, #111)!important; }
html[data-v="editorial"] #submenu { background:#fff!important; box-shadow:none!important; }
html[data-v="editorial"] .sub_bc_home { background: var(--p)!important; color: var(--ht, #fff)!important; border-radius:0!important; }
html[data-v="editorial"] .sub_bg { height:320px!important; position:relative!important; overflow:hidden!important; }
@media(min-width:861px) {
html[data-v="editorial"] #quick { width:80px!important; right:0!important; }
html[data-v="editorial"] #quick .quick_menu ul > li { background:#fff!important; border:2px solid var(--p)!important; border-radius:0!important; width:80px!important; height:80px!important; box-shadow:none!important; display:flex!important; align-items:center!important; justify-content:center!important; }
html[data-v="editorial"] #quick .quick_menu ul > li:hover { background:var(--p)!important; }
html[data-v="editorial"] #quick .quick_menu a i { color:var(--p)!important; font-size:1.6rem!important; }
html[data-v="editorial"] #quick .quick_menu ul > li:hover a i { color:var(--a1)!important; }
html[data-v="editorial"] #quick .quick_menu a strong { color:var(--p)!important; font-size:.9rem!important; }
html[data-v="editorial"] #quick .quick_menu ul > li:hover a strong { color:var(--ht, #fff)!important; }
}
/* ============================================================
섹션 메인/서브 타이틀 — 15 변형 강한 차별화 (override)
============================================================ */
/* 01 fullhero — 정렬:가운데 / 상단 두꺼운 강조선 */ㄴ
/* 02 cinema — 위아래 가는 라인 + 극세 대문자 와이드 */
/* 03 splithero — 좌측 두꺼운 컬러바 + 좌정렬 큰 볼드 */
/* 04 mosaic — 다이아몬드 디바이더 ◆ */
html[data-v="mosaic"] .sub_title > h2.tit02::before,
html[data-v="mosaic"] .sub_title > h2.tit02::after { content:"◆"!important; display:inline-block!important; margin:0 14px!important; color:var(--a1)!important; vertical-align:middle!important; }
@media (max-width: 768px) {
html[data-v="mosaic"] .sub_title > h2.tit02::before,
html[data-v="mosaic"] .sub_title > h2.tit02::after { margin:0 5px !important; }
}
/* 05 typography — 극단 대비: 작은 eyebrow + 거대한 헤드라인 */
/* 07 monoline — 가운데 / 짧은 하단 라인 */
/* 08 parallax — 그림자 레이어 */
/* 09 luxury — 좌정렬 + 좌측 가로바 */
/* 10 minimal — 우정렬 + 우측 가로바 */
/* 12 timeline — 좌측 동그라미 마커 */
/* 15 editorial — 매거진 좌정렬 거대 헤드 (border-bottom 없음) */
/* ============================================================
메인 정보 섹션 (content_wrap / wz-blk-tit / wz-blk-sub)
15변형 박스 + 타이포 차별화
============================================================ */
/* fullhero — 좌측 컬러바 + 깨끗한 카드 */
html[data-v="fullhero"] .content_wrap { padding:48px 32px !important; background:#fff !important; border-left:none !important; box-shadow:0 4px 24px var(--a1-12) !important; margin-bottom:36px !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
/* cinema — 어두운 시네마 박스 */
/* splithero — 좌측 두꺼운 컬러바 [라운드44에서 border-left 제거] */
/* mosaic — 라운드 카드 */
html[data-v="mosaic"] .content_wrap { padding:40px 32px !important; background:#fff !important; border-radius:14px !important; box-shadow:0 8px 28px rgba(0,0,0,.08) !important; margin-bottom:28px !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
/* typography — 거대 헤드 + 미니 라벨 */
html[data-v="typography"] .content_wrap { padding:60px 0 !important; background:transparent !important; border-top:1px solid var(--a1-20) !important; margin-bottom:0 !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
/* monoline — 가운데 + 짧은 하단선 */
html[data-v="monoline"] .content_wrap { padding:48px 0 !important; background:transparent !important; margin-bottom:24px !important; text-align:center !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
/* parallax — 그림자 + hover */
html[data-v="parallax"] .content_wrap { padding:40px 32px !important; background:#fff !important; box-shadow:0 12px 40px var(--a1-20) !important; transition:transform .3s !important; margin-bottom:48px !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
html[data-v="parallax"] .content_wrap:hover { transform:translateY(-4px) !important; }
/* luxury — 좌정렬 + 좌측 라인 */
html[data-v="luxury"] .content_wrap { padding:36px 32px 36px 48px !important; background:#fff !important; margin-bottom:28px !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
/* minimal — 우정렬 + 우측 라인 */
html[data-v="minimal"] .content_wrap { padding:0 !important; background:#fff !important; margin-bottom:0 !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
/* timeline — 좌측 마커 점 */
html[data-v="timeline"] .content_wrap { padding:32px 32px 32px 60px !important; background:#fff !important; border-radius:8px !important; margin-bottom:20px !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; position:relative !important; box-shadow:0 2px 12px var(--a1-12) !important; }
/* editorial — 매거진 가로 룰 */
html[data-v="editorial"] .content_wrap { padding:48px 0 !important; background:transparent !important; border-top:3px solid var(--p) !important; border-bottom:1px solid var(--a1-20) !important; margin-bottom:0 !important; max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; }
/* ============================================================
헤더 미세 차별화 (히어로/메인비주얼 안 건드림 — 헤더 패딩/높이/그림자만)
============================================================ */
html[data-v="fullhero"] header { padding:0 56px !important; }
html[data-v="cinema"] header { padding:0 64px !important; }
html[data-v="splithero"] header { padding:0 32px 0 60px !important; }
html[data-v="mosaic"] header { padding:0 48px !important; }
html[data-v="typography"] header { padding:0 80px !important; }
html[data-v="monoline"] header { padding:0 48px !important; }
html[data-v="parallax"] header { padding:0 56px !important; }
html[data-v="luxury"] header { padding:0 32px 0 56px !important; }
html[data-v="minimal"] header { padding:0 56px 0 32px !important; }
html[data-v="timeline"] header { padding:0 56px !important; }
html[data-v="editorial"] header { padding:0 24px !important; }
/* 변형별 fixed header 미세 두께 차이 (스크롤 후) */
html[data-v="typography"] header.fixed{ backdrop-filter:blur(20px) !important; }
html[data-v="cinema"] header.fixed { box-shadow:0 1px 0 var(--a1) !important; }
html[data-v="editorial"] header.fixed { box-shadow:0 2px 0 var(--p) !important; }
/* ============================================================
메인 방문예약 (.main_sec03 / #fwrite2)
15변형 박스 + 헤딩 + 입력 필드 + 버튼 차별화 (12 규칙 #9)
============================================================ */
/* fullhero — 좌측 컬러바 카드 */
html[data-v="fullhero"] .main_sec03 ul li { background:#fff !important; padding:48px 36px !important; border-left:none !important; box-shadow:0 6px 28px var(--a1-12) !important; max-width:900px !important; margin:0 auto !important; }
html[data-v="fullhero"] .main_sec03 h3 { font-size:1.8rem !important; font-weight:800 !important; color:var(--p) !important; margin-bottom:24px !important; padding-bottom:14px !important; border-bottom:2px solid var(--a1) !important; }
html[data-v="fullhero"] .main_sec03 input[type="text"], html[data-v="fullhero"] .main_sec03 .fselect { background:#fff !important; border:1px solid var(--a1-20) !important; border-radius:0 !important; padding:14px 18px !important; }
html[data-v="fullhero"] .main_sec03 .btn_submit { background:var(--p) !important; color:var(--ht,#fff) !important; border-radius:0 !important; padding:16px 40px !important; font-weight:800 !important; letter-spacing:2px !important; }
/* cinema — 어두운 시네마 박스 + 흰 텍스트 */
html[data-v="cinema"] .main_sec03 .btn_submit { background:var(--a1) !important; color:var(--a1t,#111) !important; border-radius:0 !important; padding:18px 48px !important; font-weight:300 !important; letter-spacing:6px !important; text-transform:uppercase !important; }
/* splithero — 두꺼운 좌측 라인 */
html[data-v="splithero"] .main_sec03 ul li { background:var(--a3) !important; padding:40px 32px 40px 36px !important; border-left:none; max-width:900px !important; margin:0 auto !important; }
html[data-v="splithero"] .main_sec03 h3 { font-size:1.7rem !important; font-weight:800 !important; color:var(--p) !important; margin-bottom:24px !important; }
html[data-v="splithero"] .main_sec03 input[type="text"], html[data-v="splithero"] .main_sec03 .fselect { background:#fff !important; border:1px solid var(--a1-20) !important; padding:14px 18px !important; }
html[data-v="splithero"] .main_sec03 .btn_submit { background:var(--a1) !important; color:var(--a1t,#111) !important; padding:16px 40px !important; font-weight:700 !important; }
/* mosaic — 라운드 카드 */
html[data-v="mosaic"] .main_sec03 ul li { background:#fff !important; padding:40px 32px !important; border-radius:14px !important; box-shadow:0 8px 30px rgba(0,0,0,.08) !important; max-width:900px !important; margin:0 auto !important; }
html[data-v="mosaic"] .main_sec03 h3 { font-size:1.6rem !important; font-weight:800 !important; color:var(--p) !important; text-align:center !important; margin-bottom:24px !important; }
html[data-v="mosaic"] .main_sec03 input[type="text"], html[data-v="mosaic"] .main_sec03 .fselect { background:#f9fafb !important; border:1px solid #e5e7eb !important; border-radius:8px !important; padding:14px 18px !important; }
html[data-v="mosaic"] .main_sec03 .btn_submit { background:var(--a1) !important; color:var(--a1t,#111) !important; border-radius:8px !important; padding:16px 40px !important; font-weight:700 !important; }
/* typography — 거대 헤드 + underline 입력 */
html[data-v="typography"] .main_sec03 ul li { background:#fff !important; padding:64px 0 !important; border-top:1px solid var(--a1-20) !important; border-bottom:1px solid var(--a1-20) !important; max-width:1100px !important; margin:0 auto !important; }
html[data-v="typography"] .main_sec03 h3 { font-size:2.4rem !important; font-weight:200 !important; letter-spacing:-1.5px !important; color:var(--p) !important; text-align:center !important; margin-bottom:36px !important; }
html[data-v="typography"] .main_sec03 input[type="text"], html[data-v="typography"] .main_sec03 .fselect { background:transparent !important; border:none !important; border-bottom:1px solid var(--a1-30) !important; padding:14px 4px !important; border-radius:0 !important; }
html[data-v="typography"] .main_sec03 .btn_submit { background:transparent !important; color:var(--p) !important; border:2px solid var(--p) !important; border-radius:0 !important; padding:16px 56px !important; font-weight:800 !important; letter-spacing:4px !important; }
/* monoline — 가운데 + 짧은 라인 */
html[data-v="monoline"] .main_sec03 ul li { background:#fff !important; padding:48px 32px !important; border-top:1px solid var(--a1-20) !important; border-bottom:1px solid var(--a1-20) !important; max-width:900px !important; margin:0 auto !important; }
html[data-v="monoline"] .main_sec03 h3 { font-size:1.6rem !important; font-weight:300 !important; color:var(--p) !important; text-align:center !important; padding-bottom:14px !important; margin-bottom:28px !important; position:relative !important; }
html[data-v="monoline"] .main_sec03 h3::after { content:""; display:block; width:60px; height:1px; background:var(--a1); margin:14px auto 0; }
html[data-v="monoline"] .main_sec03 input[type="text"], html[data-v="monoline"] .main_sec03 .fselect { background:#fff !important; border:1px solid var(--a1-20) !important; padding:13px 16px !important; border-radius:0 !important; }
html[data-v="monoline"] .main_sec03 .btn_submit { background:#fff !important; color:var(--p) !important; border:1px solid var(--p) !important; border-radius:0 !important; padding:14px 40px !important; font-weight:400 !important; letter-spacing:6px !important; text-transform:uppercase !important; transition:all .2s; }
html[data-v="monoline"] .main_sec03 .btn_submit:hover { background:var(--p) !important; color:var(--ht,#fff) !important; }
/* parallax — 큰 그림자 + hover */
html[data-v="parallax"] .main_sec03 ul li { background:#fff !important; padding:40px 32px !important; box-shadow:0 12px 40px var(--a1-20) !important; max-width:900px !important; margin:0 auto !important; transition:transform .3s !important; }
html[data-v="parallax"] .main_sec03 ul li:hover { transform:translateY(-4px) !important; }
html[data-v="parallax"] .main_sec03 h3 { font-size:1.7rem !important; font-weight:900 !important; color:var(--p) !important; margin-bottom:24px !important; text-shadow:2px 2px 0 var(--a1-20) !important; }
html[data-v="parallax"] .main_sec03 input[type="text"], html[data-v="parallax"] .main_sec03 .fselect { background:var(--a3) !important; border:none !important; padding:14px 18px !important; border-radius:6px !important; }
html[data-v="parallax"] .main_sec03 .btn_submit { background:var(--a1) !important; color:var(--a1t,#111) !important; border-radius:6px !important; padding:16px 40px !important; font-weight:700 !important; box-shadow:0 4px 12px var(--a1-30) !important; }
/* luxury — 좌정렬 + 좌측 라인 */
html[data-v="luxury"] .main_sec03 ul li { background:#fff !important; padding:36px 32px 36px 48px !important; border-left:2px solid var(--a1) !important; max-width:900px !important; margin:0 auto !important; box-shadow:0 2px 12px var(--a1-12) !important; }
html[data-v="luxury"] .main_sec03 input[type="text"], html[data-v="luxury"] .main_sec03 .fselect { background:#f9fafb !important; border:1px solid #e5e7eb !important; padding:13px 16px !important; }
html[data-v="luxury"] .main_sec03 .btn_submit { background:var(--p) !important; color:var(--ht,#fff) !important; padding:14px 36px !important; font-weight:700 !important; letter-spacing:1px !important; }
/* minimal — 우정렬 + 우측 라인 */
html[data-v="minimal"] .main_sec03 ul li { background:#fff !important; padding:36px 48px 36px 32px !important; border-right:2px solid var(--a1) !important; max-width:900px !important; margin:0 auto !important; box-shadow:0 2px 12px var(--a1-12) !important; }
html[data-v="minimal"] .main_sec03 h3 { font-size:1.6rem !important; font-weight:700 !important; color:var(--p) !important; text-align:right !important; margin-bottom:24px !important; }
html[data-v="minimal"] .main_sec03 input[type="text"], html[data-v="minimal"] .main_sec03 .fselect { background:#f9fafb !important; border:1px solid #e5e7eb !important; padding:13px 16px !important; }
html[data-v="minimal"] .main_sec03 .btn_submit { background:var(--p) !important; color:var(--ht,#fff) !important; padding:14px 36px !important; font-weight:700 !important; letter-spacing:1px !important; }
/* timeline — 좌측 마커 + 카드 */
html[data-v="timeline"] .main_sec03 ul li { background:#fff !important; padding:36px 32px 36px 60px !important; border-radius:8px !important; box-shadow:0 4px 16px var(--a1-12) !important; max-width:900px !important; margin:0 auto !important; position:relative !important; }
html[data-v="timeline"] .main_sec03 h3 { font-size:1.5rem !important; font-weight:700 !important; color:var(--p) !important; text-align:left !important; margin-bottom:24px !important; }
html[data-v="timeline"] .main_sec03 input[type="text"], html[data-v="timeline"] .main_sec03 .fselect { background:#f9fafb !important; border:1px solid #e5e7eb !important; border-radius:6px !important; padding:13px 16px !important; }
html[data-v="timeline"] .main_sec03 .btn_submit { background:var(--a1) !important; color:var(--a1t,#111) !important; border-radius:6px !important; padding:14px 36px !important; font-weight:700 !important; }
/* editorial — 매거진 가로 라인 */
html[data-v="editorial"] .main_sec03 ul li { background:#fff !important; padding:48px 0 !important; border-top:3px solid var(--p) !important; border-bottom:1px solid var(--a1-20) !important; max-width:1100px !important; margin:0 auto !important; }
html[data-v="editorial"] .main_sec03 h3 { font-size:2.2rem !important; font-weight:900 !important; letter-spacing:-1.5px !important; color:var(--p) !important; text-align:left !important; padding-bottom:14px !important; margin-bottom:28px !important; border-bottom:1px solid var(--a1-12) !important; }
html[data-v="editorial"] .main_sec03 input[type="text"], html[data-v="editorial"] .main_sec03 .fselect { background:transparent !important; border:none !important; border-bottom:2px solid var(--p) !important; padding:14px 4px !important; border-radius:0 !important; font-weight:600 !important; }
html[data-v="editorial"] .main_sec03 .btn_submit { background:var(--p) !important; color:var(--ht,#fff) !important; border-radius:0 !important; padding:18px 56px !important; font-weight:900 !important; letter-spacing:4px !important; text-transform:uppercase !important; }
/* ============================================================
푸터 변형별 차별화 (12 규칙 #11)
v5 base에서 background var(--fp) + color var(--ft-ht) 적용된 위에 추가 시그니처
============================================================ */
html[data-v="fullhero"] footer { padding:48px 0 !important; }
html[data-v="mosaic"] footer { padding:48px 0 !important; box-shadow:0 -8px 32px rgba(0,0,0,.12) !important; }
html[data-v="monoline"] footer .cinner::before { content:""; display:block; width:60px; height:1px; background:var(--a1); margin:0 auto 28px; }
html[data-v="parallax"] footer { padding:48px 0 !important; box-shadow:0 -12px 40px var(--a1-30) !important; }
html[data-v="luxury"] footer { padding:48px 0 48px 64px !important; text-align:left !important; }
html[data-v="timeline"] footer { padding:48px 0 !important; }
/* ============================================================
라운드 3 fix — 사용자 직접 지적
1. sub_bg 헤로 텍스트 가독성
2. 사업개요 #ctt 테이블 가독성
3. 입지환경 .wz-loc-cat 강한 차별화
4. 메인/서브 프리미엄 여백 통일
5. 프리미엄 ::after PREMIUM N 영어 라벨
============================================================ */
/* [1] 서브 페이지 .sub_bg 위 헤로 (방문예약신청 등) — 흰색 강제 */
html[data-cv="v5"] .sub_bg #sub_menu_title,
html[data-cv="v5"] .sub_bg #sub_menu_title strong { color:#fff !important; text-shadow:0 2px 8px rgba(0,0,0,.4) !important; }
html[data-cv="v5"] .sub_bg #sub_menu_title .sub-title { color:rgba(255,255,255,.85) !important; text-shadow:0 1px 4px rgba(0,0,0,.3) !important; }
/* [3] 입지환경 .wz-loc-cat 강한 시그니처 차별화 (15변형) */
html[data-v="monoline"] .wz-loc-cat-header::after { content:""; display:block; width:40px; height:1px; background:var(--a1); margin:14px auto 0; }
/* [4] 메인/서브 프리미엄 여백 통일 */
html[data-cv="v5"] .wz-premium-wrap,
html[data-cv="v5"] .sub_premium { max-width:1100px !important; margin-left:auto !important; margin-right:auto !important; box-sizing:border-box !important; }
/* ============================================================
라운드 4 fix — 한국어 가독성 + PREMIUM 라벨 강화
============================================================ */
/* [4-2] cinema / noirpremium 입지환경 본문 가독성 강화 */
/* [4-3] PREMIUM N ::after 라벨 — 더 크게/뚜렷하게 */
html[data-v="cinema"] .wz-premium-item::after,
html[data-v="cinema"] .sub_premium ul li dl::after{ color:var(--a1) !important; opacity:.95 !important; }
/* ============================================================
라운드 5 fix
1. cinema / noirpremium 어두운 배경 풀 채움 제거
2. sub_title h2.tit01 / tit02 크기 강화 (메인+서브)
3. 입지환경 strong 빨간색 충돌 해결 (어두운 배경엔 흰색 강제)
4. .wz-loc-wrap 변형별 컬럼 수 차별화 (2열 일괄 → 1/2/3 분기)
============================================================ */
/* [5-1] cinema 어두운 박스 → 흰 배경 + 액센트 라인 */
html[data-v="cinema"] .main_sec03 ul li { background:#fff !important; padding:48px 36px !important; border-top:1px solid var(--a1) !important; border-bottom:1px solid var(--a1) !important; max-width:900px !important; margin:0 auto !important; }
html[data-v="cinema"] .main_sec03 h3 { color:var(--p) !important; }
html[data-v="cinema"] .main_sec03 input[type="text"], html[data-v="cinema"] .main_sec03 .fselect { color:var(--p) !important; border-bottom:1px solid var(--p) !important; }
html[data-v="cinema"] .main_sec03 input::placeholder { color:rgba(0,0,0,.4) !important; }
html[data-v="cinema"] .main_sec03 .inp_chk strong { color:var(--p) !important; }
html[data-v="cinema"] .content_wrap { background:#fff !important; border:1px solid var(--a1) !important; }
html[data-v="cinema"] .content_wrap img { filter:none !important; border:none !important; }
html[data-v="cinema"] .wz-premium-wrap { background:transparent !important; padding:0 24px !important; }
html[data-v="cinema"] .wz-loc-items li,
html[data-v="cinema"] .wz-loc-items li * { color:var(--text-sub, #555) !important; }
html[data-v="cinema"] .wz-loc-items strong { color:var(--p) !important; }
/* [5-2] sub_title 크기 강화 — 메인 + 서브 (모든 변형 공통 베이스) */
html[data-cv="v5"] .sub_title > h2.tit01 { font-size:clamp(1.8rem, 4vw, 3rem) !important; line-height:1.3 !important; }
html[data-cv="v5"] .sub_title > h2.tit02 { font-size:clamp(.95rem, 1.6vw, 1.15rem) !important; line-height:1.5 !important; }
/* 변형별 더 큰 변형 명시 */
/* 서브 페이지 본문 sub_title — h2.tit01 / tit02 더 강조 */
html[data-cv="v5"] #bo_w .sub_title > h2.tit01,
html[data-cv="v5"] #ctt .sub_title > h2.tit01,
html[data-cv="v5"] .sub-con .sub_title > h2.tit01 { font-size:clamp(1.7rem, 3.5vw, 2.6rem) !important; font-weight:700 !important; }
html[data-cv="v5"] #bo_w .sub_title > h2.tit02,
html[data-cv="v5"] #ctt .sub_title > h2.tit02,
html[data-cv="v5"] .sub-con .sub_title > h2.tit02 { font-size:clamp(.9rem, 1.4vw, 1.05rem) !important; }
/* [5-3] 입지환경 strong / 빨강 텍스트 충돌 방지 — 어두운 배경 변형엔 흰색 강제 */
/* (위 cinema/noirpremium에서 흰 배경으로 변경했으므로 다른 어두운 변형 점검) */
html[data-v="parallax"] .wz-loc-cat-header * { color:#fff !important; }
/* [5-4] .wz-loc-wrap 컬럼 수 변형별 차별화 (2열 일괄 → 변형별 1/2/3) */
/* 1열 (단정/세로 흐름) */
/* 3열 (그리드 임팩트) */
html[data-v="mosaic"] .wz-loc-wrap,
html[data-v="parallax"] .wz-loc-wrap{ grid-template-columns:repeat(3,1fr) !important; gap:16px !important; }
@media(max-width:900px) {
html[data-v="mosaic"] .wz-loc-wrap,
html[data-v="parallax"] .wz-loc-wrap{ grid-template-columns:repeat(2,1fr) !important; }
}
@media(max-width:600px) {
html[data-v="mosaic"] .wz-loc-wrap,
html[data-v="parallax"] .wz-loc-wrap{ grid-template-columns:1fr !important; }
}
/* 나머지(fullhero/cinema/splithero/gallery/noirpremium)는 2열 기본 유지 */
/* ============================================================
라운드 6 — bg-effect / visual-effect / title-effect 충돌 방지
============================================================ */
/* [6-1] .sub_bg 폴백 (bg-effect 없을 때만) — v5 변형은 background 제거됐으므로 base 폴백 필요 */
html[data-cv="v5"] .sub_bg { background: var(--p); }
/* bg-effect-XX 클래스가 있으면 layout.css 룰이 그대로 적용 (specificity 동일, !important 없음 → 우선순위 균형) */
/* [6-2] visual-effect (메인 비주얼 swiper 효과) — v5 변형은 .main-v 안 건드림 (이미 보장됨) */
/* 추가 보장: 변형별 룰이 .main-v 또는 .swiper에 적용되지 않음 확인 — 이미 그대로 */
/* [6-3] title-effect (메인 타이틀 텍스트 효과) — body[data-te] JS 기반, .main-v 텍스트
v5 변형은 메인 타이틀 안 건드리므로 충돌 없음 */
/* ============================================================
라운드 8 — 서브 방문예약 (#fwrite) 전면 재디자인
기존 박스 컨셉 → 모던/단정 통일 베이스 + 변형별 좌측 라인/입력/버튼만 차별
============================================================ */
/* 베이스 — 모든 변형 공통 (흰 카드 + 좌측 라인 + 모던 input + 풀폭 버튼) */
html[data-cv="v5"] #fwrite .write_div { margin-bottom:18px !important; }
html[data-cv="v5"] #fwrite label { display:block !important; margin-bottom:6px !important; }
html[data-cv="v5"] #fwrite input[type="text"],
html[data-cv="v5"] #fwrite input[type="tel"],
html[data-cv="v5"] #fwrite input[type="email"],
html[data-cv="v5"] #fwrite textarea {
width:100% !important;
padding:13px 0 !important;
background:transparent !important;
border:none !important;
border-bottom:1px solid var(--a1-30) !important;
border-radius:0 !important;
box-shadow:none !important;
outline:none !important;
transition:border-color .2s !important;
}
html[data-cv="v5"] #fwrite select {
width:100% !important;
padding:13px 36px 13px 0 !important;
background-color:#fff !important;
border:1px solid #ddd !important;
border-radius:4px !important;
-webkit-appearance:none !important;
-moz-appearance:none !important;
appearance:none !important;
background-image:url("data:image/svg+xml;utf8,") !important;
background-repeat:no-repeat !important;
background-position:right 14px center !important;
background-size:12px !important;
box-shadow:none !important;
outline:none !important;
transition:border-color .2s !important;
}
html[data-cv="v5"] #fwrite input:focus,
html[data-cv="v5"] #fwrite select:focus,
html[data-cv="v5"] #fwrite textarea:focus { border-bottom-color:var(--a1) !important; }
html[data-cv="v5"] #fwrite .btn_confirm { display:flex !important; gap:8px !important; margin-top:32px !important; padding:20px 0 !important; border-top:1px solid var(--a1-12) !important; }
html[data-cv="v5"] #fwrite .btn_submit,
html[data-cv="v5"] #fwrite button[type="submit"] {
flex:1 !important;
padding:16px 24px !important;
background:var(--p) !important;
color:var(--ht, #fff) !important;
border:none !important;
border-radius:0 !important;
font-size:.95rem !important;
font-weight:700 !important;
letter-spacing:2px !important;
cursor:pointer !important;
transition:background .2s !important;
}
html[data-cv="v5"] #fwrite .btn_submit:hover,
html[data-cv="v5"] #fwrite button[type="submit"]:hover { background:var(--a1) !important; color:var(--a1t, #111) !important; }
/* 변형별 좌측 라인 굵기/색/스타일 분기 */
/* 변형별 버튼 스타일 살짝 차별 */
html[data-v="cinema"] #fwrite .btn_submit:hover { background:var(--p) !important; color:var(--ht, #fff) !important; }
html[data-v="typography"] #fwrite .btn_submit:hover { background:var(--p) !important; color:var(--ht, #fff) !important; }
/* ============================================================
라운드 9 — 서브 방문예약 #fwrite 변형별 박스 모양 완전 다르게
(라운드 8 통일 베이스를 덮어씀 — 마지막이 이김)
============================================================ */
/* 베이스 reset (라운드 8 통일 무력화 — 변형별 명시 룰이 모두 덮어씀) */
/* 01 fullhero — 좌측 두꺼운 컬러바 + 흰 카드 + 큰 그림자 */
html[data-v="fullhero"] #fwrite { background:#fff !important; max-width:780px !important; margin:0 auto !important; padding:56px 48px 48px 56px !important; border-radius:0 !important; box-shadow:0 16px 48px var(--a1-20) !important; }
html[data-v="fullhero"] #fwrite .btn_submit { background:var(--p) !important; color:var(--ht, #fff) !important; padding:18px 48px !important; border-radius:0 !important; font-weight:800 !important; letter-spacing:3px !important; }
/* 02 cinema — 어두운 와인 박스 + 흰 텍스트 + 골드 라인 입력 */
html[data-v="cinema"] #fwrite .btn_submit { background:var(--a1) !important; color:var(--a1t, #111) !important; border-radius:0 !important; padding:18px 56px !important; font-weight:300 !important; letter-spacing:8px !important; text-transform:uppercase !important; }
/* 03 splithero — 좌측 6px 컬러바 + 베이지 박스 [라운드44에서 border-left 제거] */
html[data-v="splithero"] #fwrite .btn_submit { background:var(--a1) !important; color:var(--a1t, #111) !important; padding:18px 48px !important; font-weight:800 !important; }
/* 04 mosaic — 큰 라운드 카드 + 그림자 + pill 라벨 */
html[data-v="mosaic"] #fwrite { background:#fff !important; max-width:760px !important; margin:0 auto !important; padding:48px 40px !important; border-radius:24px !important; box-shadow:0 20px 60px rgba(0,0,0,.1) !important; }
html[data-v="mosaic"] #fwrite .btn_submit { background:var(--a1) !important; color:var(--a1t, #111) !important; border-radius:12px !important; padding:18px 48px !important; font-weight:700 !important; }
/* 05 typography — 박스 없음 + 거대 좌정렬 헤드 + underline 미니멀 */
html[data-v="typography"] #fwrite { background:transparent !important; max-width:1100px !important; margin:0 auto !important; padding:80px 0 !important; border-radius:0 !important; box-shadow:none !important; }
html[data-v="typography"] #fwrite::before { content:""; display:block; width:80px; height:2px; background:var(--p); margin-bottom:32px; }
html[data-v="typography"] #fwrite .btn_submit { background:transparent !important; color:var(--p) !important; border:2px solid var(--p) !important; border-radius:0 !important; padding:20px 64px !important; font-size:1rem !important; font-weight:300 !important; letter-spacing:8px !important; }
/* 07 monoline — 가운데 + 짧은 단선 + 가는 폰트 + outline 버튼 */
html[data-v="monoline"] #fwrite { background:#fff !important; max-width:1000px !important; margin:0 auto !important; border-radius:0 !important; box-shadow:none !important; text-align:center !important; }
html[data-v="monoline"] #fwrite::before { content:""; display:block; width:40px; height:1px; background:var(--a1); margin:0 auto 32px; }
html[data-v="monoline"] #fwrite .btn_submit { background:transparent !important; color:var(--p) !important; border:1px solid var(--p) !important; border-radius:0 !important; padding:16px 48px !important; font-weight:300 !important; letter-spacing:8px !important; text-transform:uppercase !important; }
html[data-v="monoline"] #fwrite .btn_submit:hover { background:var(--p) !important; color:var(--ht, #fff) !important; }
/* 08 parallax — 큰 그림자 + hover 부유 */
html[data-v="parallax"] #fwrite { background:#fff !important; max-width:900px !important; margin:0 auto !important; border-radius:8px !important; box-shadow:0 20px 60px var(--a1-30) !important; transition:transform .3s !important; }
html[data-v="parallax"] #fwrite:hover { transform:translateY(-6px) !important; }
html[data-v="parallax"] #fwrite .btn_submit { background:var(--a1) !important; color:var(--a1t, #111) !important; border-radius:8px !important; padding:18px 48px !important; font-weight:800 !important; box-shadow:0 8px 24px var(--a1-30) !important; }
/* 09 luxury — 좌정렬 + 좌측 라인 */
html[data-v="luxury"] #fwrite { background:#fff !important; max-width:780px !important; margin:0 auto !important; padding:40px 36px 40px 60px !important; border-radius:0 !important; box-shadow:0 4px 16px var(--a1-12) !important; text-align:left !important; }
html[data-v="luxury"] #fwrite .btn_submit { background:var(--p) !important; color:var(--ht, #fff) !important; padding:14px 36px !important; }
/* 10 minimal — 우정렬 + 우측 라인 */
html[data-v="minimal"] #fwrite { background:#fff !important; max-width:780px !important; margin:0 auto !important; padding:40px 60px 40px 36px !important; border-radius:0 !important; box-shadow:0 4px 16px var(--a1-12) !important; text-align:right !important; }
html[data-v="minimal"] #fwrite label { text-align:right !important; }
html[data-v="minimal"] #fwrite .btn_submit { background:var(--p) !important; color:var(--ht, #fff) !important; padding:14px 36px !important; }
/* 12 timeline — 좌측 동그라미 마커 + 카드 */
html[data-v="timeline"] #fwrite { background:#fff !important; max-width:900px !important; margin:0 auto !important; padding:48px 40px 48px 72px !important; border-radius:12px !important; box-shadow:0 8px 24px var(--a1-12) !important; position:relative !important; }
html[data-v="timeline"] #fwrite .btn_submit { background:var(--a1) !important; color:var(--a1t, #111) !important; border-radius:12px !important; padding:16px 40px !important; font-weight:700 !important; }
/* 15 editorial — 매거진 상하 라인 + 좌정렬 거대 헤드 */
html[data-v="editorial"] #fwrite { background:transparent !important; max-width:1080px !important; margin:0 auto !important; padding:60px 0 !important; border-radius:0 !important; box-shadow:none !important; text-align:left !important; }
html[data-v="editorial"] #fwrite .btn_submit { background:var(--p) !important; color:var(--ht, #fff) !important; border-radius:0 !important; padding:20px 64px !important; font-weight:900 !important; letter-spacing:5px !important; text-transform:uppercase !important; }
/* ============================================================
라운드 10 — 프리미엄 카드 간격/정렬 일관 (사용자: 간격 이상한거 다 맞추고)
============================================================ */
/* 모든 변형 공통 — 카드 간 gap, item 정렬, 텍스트 margin 통일 */
html[data-cv="v5"] .wz-pm-num { line-height:1 !important; }
html[data-cv="v5"] .wz-pm-title { margin:0 0 10px 0 !important; line-height:1.4 !important; }
html[data-cv="v5"] .wz-pm-desc { margin:0 !important; }
html[data-cv="v5"] .wz-pm-body { padding-top:0 !important; }
/* mosaic — 좌측 숫자 + 우측 본문 grid 명시 (이전엔 display 없어서 들쭉날쭉) */
/* cinema — grid 정렬 통일 */
/* splithero — 좌측바 align */
/* typography — 큰 숫자 + 본문 baseline 통일 */
/* monoline — 1열 가운데 정렬 일관 */
/* parallax — grid 명시 */
/* luxury — 좌숫자 align center */
/* minimal — 우측 라인 정렬 */
/* timeline — 마커 align */
/* editorial — 매거진 큰 숫자 + 본문 baseline */
/* 서브 프리미엄 dl도 동일 정렬 — gap, padding, align */
/* 메인+서브 PREMIUM N 라벨 line-height 명시 (카드 흐름 영향 없게) */
html[data-cv="v5"] .wz-premium-item::after,
html[data-cv="v5"] .sub_premium ul li dl::after { line-height:1 !important; pointer-events:none !important; }
/* ============================================================
라운드 11 — 서브 방문예약 배경색 제거 + 헤더 메뉴 폰트 1.2rem
============================================================ */
/* [11-1] #fwrite 배경색 일괄 흰색/투명 (cinema/noirpremium 와인박스, splithero 베이지 모두 제거) */
html[data-cv="v5"] #fwrite { background:#fff !important; }
html[data-v="typography"] #fwrite,
html[data-v="editorial"] #fwrite { background:transparent !important; }
/* cinema — 흰 배경 + 어두운 텍스트로 변경 (라운드 9 어두운 박스 덮어씀) */
html[data-v="cinema"] #fwrite { background:#fff !important; box-shadow:0 6px 24px var(--a1-12) !important; }
/* splithero 베이지 → 흰 */
html[data-v="splithero"] #fwrite { background:#fff !important; }
/* [11-2] 헤더 메뉴 .gnb_1da 폰트 사이즈 1.2rem 강제 (15변형 모두) — 사용자: 1.2rem 아래로 내리지 마 */
html[data-cv="v5"] .gnb_1da { font-size: 1.2rem !important; }
/* ============================================================
라운드 12 — 입지환경(.wz-loc-cat) 카드 간격/내부 패딩 통일
============================================================ */
/* 카드 사이 gap 통일 */
/* 1열 변형은 gap 더 — 수직 호흡 */
html[data-v="typography"] .wz-loc-wrap,
html[data-v="monoline"] .wz-loc-wrap,
html[data-v="timeline"] .wz-loc-wrap,
html[data-v="editorial"] .wz-loc-wrap,
html[data-v="luxury"] .wz-loc-wrap,
html[data-v="minimal"] .wz-loc-wrap{ gap:20px !important; }
/* 카드 본문 영역 (.wz-loc-items) 패딩/리스트 정렬 통일 */
html[data-cv="v5"] .wz-loc-items {
padding:18px 24px 22px !important;
margin:0 !important;
list-style:none !important;
}
html[data-cv="v5"] .wz-loc-items li:first-child { padding-top:0 !important; }
html[data-cv="v5"] .wz-loc-items li:last-child { border-bottom:none !important; padding-bottom:0 !important; }
/* 카드 헤더 라벨 + 제목 사이 마진 통일 */
/* 어두운 카드 변형(이전 cinema/noirpremium은 라운드 5에서 흰 배경 변경) — items 보더 색만 미세 */
html[data-v="cinema"] .wz-loc-items li { border-bottom:1px solid var(--a1-12) !important; }
/* parallax 헤더 (와인 배경) — 본문은 흰 → padding 통일 */
html[data-v="parallax"] .wz-loc-items li { color:var(--text-sub, #555) !important; }
html[data-v="parallax"] .wz-loc-items strong { color:var(--p) !important; }
/* ============================================================
라운드 14 — 서브 프리미엄(.sub_premium ul li dl) 전면 재디자인
숫자 위치를 변형마다 완전 다르게: 위/아래/좌/우/안/밖/워터마크/마커/라벨
============================================================ */
/* 베이스 reset — 라운드 1의 단순 grid 룰 무력화 */
html[data-cv="v5"] .sub_premium ul li { position:relative !important; padding:0 !important; margin:0 !important; }
/* === 변형별 숫자 위치 다양화 === */
/* 02 cinema — 박스 위 라벨 (자막 스타일) */
/* 03 splithero — 좌측 외부 큰 + 좌측 컬러바 */
/* 04 mosaic — 카드 우상단 pill 라벨 */
/* 05 typography — 거대 좌측 + 박스 없음 (단선만) */
html[data-v="typography"] .sub_premium ul { gap:0 !important; padding:0 !important; }
html[data-v="typography"] .sub_premium ul li { border-top:1px solid var(--a1-30) !important; }
html[data-v="typography"] .sub_premium ul li:last-child { border-bottom:1px solid var(--a1-30) !important; }
/* 07 monoline — 박스 위 가운데 작은 + 짧은 단선 */
/* 08 parallax — 좌측 외부 큰 + 그림자 + hover */
/* 09 luxury — 좌측 외부 박스 밖 + 좌측 라인 카드 */
html[data-v="luxury"] .sub_premium ul li { padding-left:90px !important; }
/* 10 minimal — 우측 외부 박스 밖 + 보더 없음 */
/* 12 timeline — 좌측 동그라미 마커 (숫자 텍스트 안 보임 — 마커만) */
html[data-v="timeline"] .sub_premium ul { padding-left:60px !important; }
/* 15 editorial — 좌측 외부 거대 매거진 + 가로 단선 (보더 통일) */
/* ============================================================
라운드 15 — 서브 프리미엄 레이아웃 다양화 + specific fix
사용자: 굳이 계속 2열로 처리하고싶냐? 다양하게 뽑으라
============================================================ */
/* === 컬럼 수 다양화 === */
/* 2열 — mosaic, gallery */
/* 3열 — parallax (큰 그림자 카드 그리드) */
@media(max-width:1100px){
html[data-v="parallax"] .sub_premium ul { grid-template-columns:repeat(2,1fr) !important; }
}
@media(max-width:700px){
html[data-v="parallax"] .sub_premium ul { grid-template-columns:1fr !important; }
}
/* === 4가지 specific fix === */
/* [15-1] minimal 새 디자인 — 우측 외부 큰 숫자 제거 → 박스 안 우상단 inline 숫자 + 우측 4px 라인 */
html[data-v="minimal"] .sub_premium ul li { padding-right:0 !important; padding-left:0 !important; }
/* [15-4] editorial — 보더 모두 제거, padding 통일 */
html[data-v="editorial"] .sub_premium ul { gap:32px !important; padding:32px 0 !important; }
html[data-v="editorial"] .sub_premium ul li { border:none !important; padding:0 !important; }
html[data-v="editorial"] .sub_premium ul li:first-child { border:none !important; }
html[data-v="editorial"] .sub_premium ul li:last-child { border:none !important; }
/* ============================================================
라운드 16 — mosaic 서브 프리미엄 카드 안 보임 fix (grid → flex wrap)
============================================================ */
html[data-v="mosaic"] .sub_premium { display:block !important; }
html[data-v="mosaic"] .sub_premium ul {
display:flex !important;
flex-wrap:wrap !important;
flex-direction:row !important;
gap:20px !important;
padding:24px 0 !important;
list-style:none !important;
margin:0 !important;
}
html[data-v="mosaic"] .sub_premium ul li {
display:block !important;
flex:1 1 calc(50% - 10px) !important;
min-width:280px !important;
list-style:none !important;
padding:0 !important;
margin:0 !important;
position:relative !important;
}
/* parallax 3열도 안전 패턴 */
html[data-v="parallax"] .sub_premium ul {
display:flex !important;
flex-wrap:wrap !important;
flex-direction:row !important;
gap:24px !important;
padding:24px 0 !important;
}
html[data-v="parallax"] .sub_premium ul li {
display:block !important;
flex:1 1 calc(33.333% - 16px) !important;
min-width:260px !important;
padding:0 !important;
margin:0 !important;
position:relative !important;
}
/* ============================================================
라운드 17 — mosaic .wz-premium-wrap grid가 서브 페이지 sub_premium 깨뜨림
메인 페이지 한정 ([data-index]만)
============================================================ */
/* 서브 페이지에선 wz-premium-wrap grid 무력화 */
html[data-v="mosaic"] .wz-premium-wrap { display:block !important; grid-template-columns:none !important; gap:0 !important; }
/* 메인 페이지에서만 grid 적용 */
@media(max-width:768px){
html[data-v="mosaic"][data-index] .wz-premium-wrap { grid-template-columns:1fr !important; }
}
/* ============================================================
라운드 18 — 프리미엄 카드 간격/패딩 강제 정렬 (사용자 화남)
============================================================ */
/* 메인 프리미엄 카드 — gap/padding/min-height 강제 */
html[data-cv="v5"] .wz-premium-wrap { gap:10px !important; }
/* mosaic — 본문 정렬 강화 */
html[data-v="mosaic"][data-index] .wz-premium-wrap { gap:14px !important; }
html[data-v="mosaic"] .wz-pm-body { padding-top:2px !important; }
html[data-v="mosaic"] .wz-pm-desc { margin:0 !important; }
/* PREMIUM N 라벨 모든 변형 위치/크기 통일 — 작고 일관 */
html[data-v="mosaic"] .wz-premium-item::after,
html[data-v="parallax"] .wz-premium-item::after{ top:12px !important; right:16px !important; }
/* cinema — 어두운 박스 카드 padding 통일 */
/* splithero — 좌측바 padding 통일 */
/* typography — 1열 거대 패딩 */
/* monoline — 가운데 단정 */
/* parallax — 카드 그림자 */
/* luxury — 좌숫자 카드 */
/* minimal — 우측 라인 */
/* timeline — 좌측 마커 */
/* editorial — 매거진 좌측 거대 */
/* ============================================================
라운드 19 — 방문예약 라벨 가독성 + 별표 정리 + 한국어 친화 (고급스럽게)
============================================================ */
/* 별표(.star) — 작고 단정 */
/* 체크박스 라벨 (개인정보 동의 등) */
html[data-cv="v5"] .inp_chk,
html[data-cv="v5"] .inp_chk strong,
html[data-cv="v5"] label[for="wr_privacy"] {
font-size: .9rem !important;
color: var(--p) !important;
letter-spacing: 0 !important;
font-weight: 500 !important;
text-transform: none !important;
}
/* 폼 placeholder 일관 */
html[data-cv="v5"] #fwrite input::placeholder,
html[data-cv="v5"] #fwrite select option,
html[data-cv="v5"] #fwrite textarea::placeholder,
html[data-cv="v5"] .main_sec03 input::placeholder,
html[data-cv="v5"] .main_sec03 select option {
color: rgba(0,0,0,.4) !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
text-transform: none !important;
}
/* ============================================================
라운드 20 — 방문예약 라벨 별표 줄바꿈 방지 + 색 정돈
============================================================ */
/* 라벨 별표 줄바꿈 방지 (white-space:nowrap) + 색 어두운 회색으로 정돈 */
html[data-cv="v5"] #fwrite label.label,
html[data-cv="v5"] #fwrite label,
html[data-cv="v5"] .main_sec03 label.label,
html[data-cv="v5"] .main_sec03 label,
html[data-cv="v5"] .main_sec03 dl dt {
white-space: nowrap !important;
color: #2a2a2a !important;
font-size: .92rem !important;
font-weight: 600 !important;
}
/* 별표(.star) 자체도 inline 흐름 끊지 않게 */
html[data-cv="v5"] #fwrite .star,
html[data-cv="v5"] .main_sec03 .star {
white-space: nowrap !important;
vertical-align: middle !important;
}
/* 메인 페이지 .wz-premium-item 통째 교체 */
/* 서브 페이지 .sub_premium 통째 교체 */
/* ============================================================
라운드 22 — 사용자 직접 지적 3건
1. timeline 메인페이지 sub_title 동그라미 마커 제거
2. 방문예약 입력 필드 글씨 강제 어두운 검정 + placeholder 가독
3. 서브 프리미엄 카드 padding/gap 축소
============================================================ */
/* [22-1] timeline sub_title::before 좌측 동그라미 마커 제거 */
/* [22-2] 방문예약 입력 필드 가독성 강화 (글씨 검정 + placeholder 진하게) */
html[data-cv="v5"] #fwrite input[type="text"],
html[data-cv="v5"] #fwrite input[type="tel"],
html[data-cv="v5"] #fwrite input[type="email"],
html[data-cv="v5"] #fwrite textarea,
html[data-cv="v5"] .main_sec03 input[type="text"],
html[data-cv="v5"] .main_sec03 textarea {
color: #000 !important;
font-size: 1rem !important;
font-weight: 500 !important;
}
html[data-cv="v5"] #fwrite input::placeholder,
html[data-cv="v5"] #fwrite textarea::placeholder,
html[data-cv="v5"] .main_sec03 input::placeholder,
html[data-cv="v5"] .main_sec03 textarea::placeholder {
color: #888 !important;
font-weight: 400 !important;
opacity: 1 !important;
}
/* [22-3] 서브 프리미엄 카드 사이 gap 설정 */
html[data-cv="v5"] .sub_premium ul { gap:25px !important; }
/* ============================================================
라운드 24 — 자율 검수 발견 이슈 fix
1. cinema/noirpremium 사업개요 #ctt 가독성 강화 (자식 inherit 강제)
2. fullpage 메인 .wz-premium-wrap 좁은 width fix
============================================================ */
/* fullhero/splithero/luxury/minimal/editorial 사업개요 자식 inherit 강제 */
html[data-v="fullhero"] #ctt table th *,
html[data-v="splithero"] #ctt table th *,
html[data-v="luxury"] #ctt table th *,
html[data-v="minimal"] #ctt table th *,
html[data-v="editorial"] #ctt table th * { color: #fff !important; }
/* ============================================================
라운드 25 — 서브메뉴 (sub_bc_btn / sub_bc_link) 가독성 강제
============================================================ */
/* 베이스 — 모든 변형 어두운 텍스트 + 흰 배경 */
html[data-cv="v5"] .sub_bc_btn,
html[data-cv="v5"] .sub_bc_link {
color: #2a2a2a !important;
font-weight: 600 !important;
background: #fafafa !important;
border: 1px solid #e5e7eb !important;
letter-spacing: 0 !important;
text-transform: none !important;
}
html[data-cv="v5"] .sub_bc_btn:hover,
html[data-cv="v5"] .sub_bc_link:hover {
background: #fff !important;
border-color: var(--a1) !important;
color: var(--p) !important;
}
/* 어두운 변형 — 호버 색상 */
html[data-v="fullhero"] .sub_bc_btn:hover{
background: rgba(255,255,255,.1) !important;
border-color: var(--a1) !important;
color: var(--a1) !important;
}
/* 기존 라운드 14 max-width:760 / 라운드 21 [data-index] 명시 → 부모 컨테이너 width 한정 추정 */
/* ============================================================
라운드 29 — 고급 톤 강화 (분양 업계 평균~중상 / 드라마틱 X)
범위: 9 영역 (변형 선택 시 고급 디자인 차별 대상)
1. 좌/우 플로팅 (#quick, .wz-side-btn)
2. 메인 wz-blk-tit / wz-blk-sub
3. 서브 sub_title h2.tit01/tit02
4. 메인·서브 프리미엄
5. 입지환경 .wz-loc-cat
6. 사업개요 #ctt table / .wz-info-table
7. 메인·서브 방문예약
8. 푸터 footer .cinner
9. 서브메뉴 #submenu / sub_bc_*
원칙: 한글 letter-spacing 절제, 여백 호흡 증가, 그림자 변형별 시그니처,
타이포 점프 강화, 모든 색 var() 유지
============================================================ */
/* === 29-A. 공통 한글 친화 베이스 (모든 v5 변형) === */
html[data-cv="v5"] .wz-blk-tit,
html[data-cv="v5"] .sub_title > h2.tit01,
html[data-cv="v5"] .wz-pm-title,
html[data-cv="v5"] .sub_premium ul li dl dt strong,
html[data-cv="v5"] .wz-loc-cat-title,
html[data-cv="v5"] form label {
font-family: var(--site-font, 'Pretendard','Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic','맑은 고딕',sans-serif) !important;
word-break: keep-all !important;
}
html[data-cv="v5"] .wz-blk-sub,
html[data-cv="v5"] .sub_title > h2.tit02,
html[data-cv="v5"] .sub_title > h2.tit03,
html[data-cv="v5"] .wz-pm-desc,
html[data-cv="v5"] .sub_premium ul li dl dd {
word-break: keep-all !important;
}
/* 공통: 한글 wz-blk-tit / sub_title h2.tit01 (한글 본문 타이틀)에 letter-spacing 강제 절제 */
html[data-cv="v5"] .wz-blk-tit,
html[data-cv="v5"] .sub_title > h2.tit01 {
letter-spacing: -.3px !important;
text-transform: none !important;
}
/* === 29-B. 메인 wz-blk-tit / wz-blk-sub 톤 강화 (15변형) === */
/* 한글 헤드 가독성 + 영문 라벨 페어링 + 변형별 시그니처 마진/라인 */
html[data-v="fullhero"] .wz-blk-tit { font-size:2rem !important; font-weight:800 !important; line-height:1.25 !important; padding-left:0 !important; border-left:none !important; margin:0 0 8px !important; }
html[data-v="fullhero"] .wz-blk-sub { font-size:1.1rem !important; letter-spacing:3px !important; font-weight:600 !important; color:var(--a2) !important; margin-bottom:28px !important; padding-left:14px !important; }
html[data-v="cinema"] .wz-blk-tit { font-size:2.4rem !important; font-weight:200 !important; letter-spacing:-.3px !important; text-align:center !important; padding:18px 0 !important; border-top:1px solid var(--a1-30) !important; border-bottom:1px solid var(--a1-30) !important; margin:0 auto 10px !important; max-width:fit-content !important; }
html[data-v="cinema"] .wz-blk-sub { font-size:1.2rem !important; letter-spacing:5px !important; text-transform:uppercase !important; text-align:center !important; color:var(--a2) !important; margin-bottom:32px !important; }
html[data-v="splithero"] .wz-blk-tit { font-size:2.2rem !important; font-weight:800 !important; line-height:1.2 !important; text-align:left !important; padding:0 0 12px 18px !important; border-left:none; margin:0 0 6px !important; }
html[data-v="splithero"] .wz-blk-sub { font-size:1.1rem !important; letter-spacing:3px !important; font-weight:600 !important; text-transform:uppercase !important; text-align:left !important; padding-left:18px !important; margin-bottom:28px !important; }
html[data-v="mosaic"] .wz-blk-tit { font-size:1.9rem !important; font-weight:700 !important; line-height:1.3 !important; text-align:center !important; margin:0 auto 8px !important; }
html[data-v="mosaic"] .wz-blk-sub { font-size:1.2rem !important; letter-spacing:3px !important; text-transform:uppercase !important; text-align:center !important; color:var(--a2) !important; padding:5px 14px !important; border-radius:999px !important; background:var(--a1-12) !important; display:inline-block !important; margin:0 auto 28px !important; font-weight:700 !important; }
html[data-v="mosaic"] .content_wrap > .inner_wrap { text-align:center !important; }
html[data-v="typography"] .wz-blk-tit { font-size:3rem !important; font-weight:200 !important; letter-spacing:-2px !important; line-height:1.1 !important; margin:0 0 14px !important; }
html[data-v="typography"] .wz-blk-sub { font-size:1.2rem !important; letter-spacing:7px !important; text-transform:uppercase !important; font-weight:600 !important; color:var(--a2) !important; padding-bottom:6px !important; border-bottom:1px solid var(--p) !important; display:inline-block !important; margin-bottom:36px !important; }
html[data-v="monoline"] .wz-blk-tit { font-size:1.9rem !important; font-weight:300 !important; letter-spacing:-.5px !important; text-align:center !important; margin:0 auto 12px !important; padding-bottom:16px !important; position:relative !important; }
html[data-v="monoline"] .wz-blk-tit::after { content:'' !important; display:block !important; width:48px !important; height:1px !important; background:var(--a1) !important; margin:14px auto 0 !important; }
html[data-v="monoline"] .wz-blk-sub { font-size:1.2rem !important; text-transform:uppercase !important; font-weight:400 !important; text-align:center !important; color:var(--a2) !important; margin-bottom:28px !important; }
html[data-v="parallax"] .wz-blk-tit { font-size:2.1rem !important; font-weight:800 !important; line-height:1.25 !important; color:var(--p) !important; text-shadow:none !important; margin:0 0 8px !important; }
html[data-v="parallax"] .wz-blk-sub { font-size:1.1rem !important; letter-spacing:2.5px !important; text-transform:uppercase !important; font-weight:600 !important; color:var(--a2) !important; margin-bottom:28px !important; }
html[data-v="timeline"] .wz-blk-tit { font-size:1.8rem !important; font-weight:700 !important; line-height:1.3 !important; text-align:left !important; padding-left:28px !important; position:relative !important; margin:0 0 6px !important; }
html[data-v="timeline"] .wz-blk-tit::before { content:'' !important; position:absolute !important; left:0 !important; top:50% !important; transform:translate(-2px,-50%) !important; width:14px !important; height:14px !important; border-radius:50% !important; background:transparent !important; border:2px solid var(--a1) !important; }
html[data-v="timeline"] .wz-blk-sub { font-size:1.1rem !important; letter-spacing:2px !important; font-weight:500 !important; color:var(--a2) !important; text-align:left !important; padding-left:28px !important; margin-bottom:24px !important; }
html[data-v="editorial"] .wz-blk-tit { font-size:2.6rem !important; font-weight:900 !important; letter-spacing:-1.5px !important; line-height:1.1 !important; text-align:left !important; padding-bottom:10px !important; border-bottom:1px solid var(--p) !important; margin:0 0 10px !important; }
html[data-v="editorial"] .wz-blk-sub {letter-spacing:3.5px !important; text-transform:uppercase !important; font-weight:700 !important; color:var(--a2) !important; text-align:left !important; margin-bottom:32px !important; }
/* === 29-C. 서브 본문 타이틀 sub_title h2.tit01/tit02 톤 강화 (15변형) === */
/* 한글 가독성 우선: tit01(한글 본문) letter-spacing -.5~0px, tit02(영문 라벨) 유지 */
html[data-v="fullhero"] .sub_title > h2.tit01 { font-size:2.6rem !important; font-weight:800 !important; letter-spacing:-1px !important; line-height:1.2 !important; margin-bottom:10px !important; }
html[data-v="fullhero"] .sub_title > h2.tit02 { font-size:.9rem !important; letter-spacing:3px !important; text-transform:uppercase !important; font-weight:600 !important; color:var(--a2) !important; }
html[data-v="cinema"] .sub_title > h2.tit01 { font-size:2.8rem !important; font-weight:200 !important; letter-spacing:0 !important; text-transform:none !important; padding:22px 0 !important; border-top:1px solid var(--a1-30) !important; border-bottom:1px solid var(--a1-30) !important; max-width:fit-content !important; margin:0 auto 10px !important; line-height:1.3 !important; }
html[data-v="cinema"] .sub_title > h2.tit02 { font-size:1.2rem !important; letter-spacing:6px !important; text-transform:uppercase !important; font-weight:400 !important; color:var(--a2) !important; }
html[data-v="splithero"] .sub_title > h2.tit01 { font-size:2.6rem !important; font-weight:800 !important; letter-spacing:-.5px !important; line-height:1.2 !important; border-left:none; margin-bottom:10px !important; }
html[data-v="splithero"] .sub_title > h2.tit02 { font-size:.9rem !important; letter-spacing:3px !important; text-transform:uppercase !important; font-weight:600 !important; }
html[data-v="mosaic"] .sub_title > h2.tit01 { font-size:2.6rem !important; font-weight:700 !important; letter-spacing:-.5px !important; line-height:1.2 !important; margin-bottom:10px !important; }
html[data-v="mosaic"] .sub_title > h2.tit02 { font-size:.82rem !important; letter-spacing:3.5px !important; text-transform:uppercase !important; font-weight:700 !important; color:var(--a2) !important; padding:6px 16px !important; border-radius:999px !important; background:var(--a1-12) !important; display:inline-block !important; }
html[data-v="typography"] .sub_title > h2.tit01 { font-size:4rem !important; font-weight:200 !important; letter-spacing:-2.5px !important; line-height:1.1 !important; text-transform:none !important; margin-bottom:18px !important; }
html[data-v="typography"] .sub_title > h2.tit02 { font-size:1.2rem !important; letter-spacing:8px !important; text-transform:uppercase !important; font-weight:600 !important; color:var(--a2) !important; padding-bottom:8px !important; border-bottom:1px solid var(--p) !important; display:inline-block !important; }
html[data-v="monoline"] .sub_title > h2.tit01 { font-size:2.6rem !important; font-weight:200 !important; letter-spacing:-.5px !important; padding-bottom:18px !important; position:relative !important; margin-bottom:14px !important; }
html[data-v="monoline"] .sub_title > h2.tit01::after { content:'' !important; position:absolute !important; left:50% !important; bottom:0 !important; transform:translateX(-50%) !important; width:32px !important; height:1px !important; background:var(--a1) !important; }
html[data-v="monoline"] .sub_title > h2.tit02 { font-size:1.2rem !important; letter-spacing:7px !important; text-transform:uppercase !important; font-weight:400 !important; color:var(--a2) !important; }
html[data-v="parallax"] .sub_title > h2.tit01 { font-size:2.6rem !important; font-weight:800 !important; letter-spacing:-.8px !important; line-height:1.2 !important; margin-bottom:10px !important; }
html[data-v="parallax"] .sub_title > h2.tit02 { text-transform:uppercase !important; font-weight:700 !important; color:var(--a2) !important; }
html[data-v="timeline"] .sub_title { position:relative !important; }
html[data-v="timeline"] .sub_title > h2.tit01 { font-size:2.4rem !important; font-weight:700 !important; letter-spacing:-.5px !important; padding-left:0 !important; position:relative !important; margin-bottom:10px !important; }
html[data-v="timeline"] .sub_title > h2.tit01::before { content:'' !important; position:absolute !important; left:-7px !important; top:50% !important; transform:translateY(-50%) !important; width:16px !important; height:16px !important; border-radius:50% !important; background:#fff !important; border:2px solid var(--a1) !important; }
html[data-v="timeline"] .sub_title > h2.tit02 { font-size:1.1rem !important; letter-spacing:2px !important; font-weight:500 !important; color:var(--a2) !important; padding-left:24px !important; }
html[data-v="editorial"] .sub_title > h2.tit01 { font-size:3.2rem !important; font-weight:900 !important; letter-spacing:-2px !important; line-height:1.05 !important; padding-bottom:14px !important; border-bottom:1px solid var(--p) !important; margin-bottom:14px !important; max-width:fit-content !important; }
html[data-v="editorial"] .sub_title > h2.tit02 { font-size:1.1rem !important; letter-spacing:4px !important; text-transform:uppercase !important; font-weight:700 !important; color:var(--a2) !important; }
/* === 29-D. 메인·서브 프리미엄 톤 강화 (카드 호흡 + 그림자 시그니처 + 숫자 위계) === */
/* 공통: 한글 카드 제목 letter-spacing 0, 본문 line-height 1.7 */
html[data-cv="v5"] .wz-pm-title,
html[data-cv="v5"] .sub_premium ul li dl dt strong {
letter-spacing: -.3px !important;
text-transform: none !important;
}
html[data-cv="v5"] .wz-pm-desc,
html[data-cv="v5"] .sub_premium ul li dl dd {
letter-spacing: 0 !important;
line-height: 1.75 !important;
}
/* PREMIUM N::after 라벨 — 한글 영역에서 영문 라벨로 인상만 (작게 절제) */
html[data-cv="v5"] .wz-premium-item::after { font-size:.62rem !important; letter-spacing:3px !important; opacity:.55 !important; font-weight:600 !important; }
/* 변형별 카드 톤 시그니처 */
html[data-v="cinema"] .wz-pm-num { font-size:1rem !important; font-weight:400 !important; color:var(--a1) !important; letter-spacing:3px !important; opacity:1 !important; }
html[data-v="cinema"] .wz-pm-title { font-size:1.4rem !important; font-weight:300 !important; letter-spacing:0 !important; }
html[data-v="mosaic"] .wz-premium-item { padding:36px !important; border-radius:18px !important; box-shadow:0 16px 40px rgba(0,0,0,.08) !important; background:#fff !important; }
html[data-v="mosaic"] .wz-pm-num { font-size:1.2rem !important; font-weight:700 !important; padding:5px 12px !important; border-radius:999px !important; background:var(--a1-12) !important; color:var(--a1) !important; letter-spacing:2px !important; display:inline-block !important; }
html[data-v="mosaic"] .wz-pm-title { font-size:1.2rem !important; font-weight:700 !important; }
html[data-v="typography"] .wz-pm-num { font-size:6rem !important; font-weight:200 !important; color:var(--a1) !important; opacity:.85 !important; letter-spacing:-3px !important; line-height:1 !important; }
html[data-v="typography"] .wz-pm-title { font-size:1.3rem !important; font-weight:300 !important; letter-spacing:-.3px !important; }
html[data-v="monoline"] .wz-pm-title { font-size:1.2rem !important; font-weight:300 !important; }
html[data-v="parallax"] .wz-premium-item:hover { transform:none !important; box-shadow:0 8px 18px rgba(0,0,0,.06), 0 28px 60px rgba(0,0,0,.14) !important; }
html[data-v="parallax"] .wz-pm-num { font-size:2.4rem !important; font-weight:800 !important; color:var(--a1) !important; }
html[data-v="parallax"] .wz-pm-title { font-size:1.2rem !important; font-weight:700 !important; }
html[data-v="timeline"] .wz-pm-num { background: var(--a1); font-size: 1.5rem !important; border-radius: 10px; padding: 10px; margin-bottom: 10px; display: inline-block; color: var(--white);}
html[data-v="timeline"] .wz-pm-title { font-size:1.2rem !important; font-weight:700 !important; }
html[data-v="editorial"] .wz-premium-item { padding:40px 0 40px 0 !important; box-shadow:none !important; background:transparent !important; display:grid !important; grid-template-columns:120px 1fr !important; gap:40px !important; }
html[data-v="editorial"] .wz-pm-num { font-size:5rem !important; font-weight:900 !important; color:var(--p) !important; letter-spacing:-3px !important; line-height:.9 !important; }
html[data-v="editorial"] .wz-pm-title { font-size:1.4rem !important; font-weight:800 !important; letter-spacing:-.3px !important; padding-bottom:8px !important; border-bottom:1px solid var(--p) !important; margin-bottom:10px !important; max-width:fit-content !important; }
/* === 29-E. 입지환경 .wz-loc-cat 톤 강화 === */
html[data-cv="v5"] .wz-loc-wrap { gap:24px !important; }
html[data-cv="v5"] .wz-loc-cat-title { letter-spacing:-.3px !important; text-transform:none !important; font-weight:700 !important; }
html[data-cv="v5"] .wz-loc-items li { padding:14px 0 !important; line-height:1.65 !important; letter-spacing:0 !important; }
html[data-v="fullhero"] .wz-loc-items { padding:20px 0 !important; }
html[data-v="cinema"] .wz-loc-cat-header { padding:28px 32px !important; background:#fff !important; border-bottom:1px solid var(--a1-30) !important; text-align:center !important; }
html[data-v="cinema"] .wz-loc-cat-title { color:var(--p) !important; font-size:1.3rem !important; font-weight:300 !important; letter-spacing:0 !important; }
html[data-v="cinema"] .wz-loc-items { padding:24px 32px !important; }
html[data-v="splithero"] .wz-loc-items { padding:22px 28px !important; }
html[data-v="mosaic"] .wz-loc-cat-header { padding:28px !important; background:var(--a3) !important; }
html[data-v="mosaic"] .wz-loc-cat-name { padding:4px 12px !important; background:#fff !important; border-radius:999px !important; display:inline-block !important; }
html[data-v="mosaic"] .wz-loc-cat-title { color:var(--p) !important; font-size:1.3rem !important; margin-top:10px !important; }
html[data-v="mosaic"] .wz-loc-items { padding:24px 28px !important; }
html[data-v="monoline"] .wz-loc-cat-name { letter-spacing:5px !important; }
html[data-v="monoline"] .wz-loc-cat-title { font-size:1.2rem !important; font-weight:300 !important; margin-top:8px !important; }
html[data-v="monoline"] .wz-loc-items { padding:24px !important; }
html[data-v="parallax"] .wz-loc-cat-header { padding:24px 28px !important; background:var(--p) !important; }
html[data-v="parallax"] .wz-loc-cat-title { font-size:1.25rem !important; }
html[data-v="parallax"] .wz-loc-items { padding:22px 28px !important; }
/* === 29-F. 사업개요 #ctt table 톤 강화 === */
/* === 29-G. 메인·서브 방문예약 (.main_sec03 #fwrite2 / #fwrite) 톤 강화 === */
html[data-cv="v5"] #fwrite2 label,
html[data-cv="v5"] #fwrite label,
html[data-cv="v5"] .main_sec03 label { letter-spacing:.3px !important; font-weight:600 !important; font-size:.92rem !important; color:var(--p) !important; text-transform:none !important; }
html[data-cv="v5"] #fwrite2 input, html[data-cv="v5"] #fwrite2 select,
html[data-cv="v5"] #fwrite input, html[data-cv="v5"] #fwrite select,
html[data-cv="v5"] .main_sec03 input, html[data-cv="v5"] .main_sec03 select,
html[data-cv="v5"] .main_sec03 .fselect { font-size:.95rem !important; color:#1a1a1a !important; }
html[data-cv="v5"] #fwrite2 input::placeholder, html[data-cv="v5"] #fwrite input::placeholder,
html[data-cv="v5"] .main_sec03 input::placeholder { color:#888 !important; font-weight:400 !important; }
html[data-cv="v5"] .btn_submit, html[data-cv="v5"] button[type="submit"] { letter-spacing:1.5px !important; font-weight:700 !important; transition:opacity .25s, transform .25s !important; }
html[data-cv="v5"] .btn_submit:hover { opacity:.9 !important; transform:translateY(-1px) !important; }
/* === 29-H. 푸터 footer .cinner 톤 강화 (변형별 시그니처) === */
html[data-v="fullhero"] footer .cinner { padding-left:32px !important; max-width:1200px !important; margin:0 auto !important; }
html[data-v="cinema"] footer { padding:80px 0 50px !important; text-align:center !important; }
html[data-v="cinema"] footer .cinner { padding:32px 24px !important; max-width:900px !important; margin:0 auto !important; letter-spacing:.5px !important; }
html[data-v="splithero"] footer .cinner { padding-left:28px !important; max-width:1200px !important; margin:0 auto !important; }
html[data-v="mosaic"] footer .cinner { background:rgba(255,255,255,.04) !important; padding:32px 36px !important; max-width:1100px !important; margin:0 auto !important; }
html[data-v="typography"] footer { padding:80px 0 60px !important; }
html[data-v="typography"] footer .cinner { font-size:1.1rem !important; letter-spacing:1px !important; max-width:1100px !important; margin:0 auto !important; padding:0 24px !important; }
html[data-v="monoline"] footer { text-align:center !important; padding:80px 0 60px !important; }
html[data-v="monoline"] footer .cinner { font-size:1.1rem !important; letter-spacing:1px !important; max-width:900px !important; margin:0 auto !important; padding:32px 24px !important; }
html[data-v="parallax"] footer .cinner { background:rgba(0,0,0,.18) !important; padding:32px 36px !important; box-shadow:0 12px 36px rgba(0,0,0,.20) !important; max-width:1100px !important; margin:0 auto !important; }
html[data-v="luxury"] footer .cinner { padding-left:32px !important; max-width:1200px !important; margin:0 auto !important; }
html[data-v="timeline"] footer .cinner { padding-left:36px !important; position:relative !important; max-width:1200px !important; margin:0 auto !important; }
html[data-v="timeline"] footer .cinner::before { content:'' !important; position:absolute !important; left:-7px !important; top:24px !important; width:14px !important; height:14px !important; background:var(--fp) !important; border:2px solid var(--a1) !important; }
html[data-v="editorial"] footer { padding:80px 0 60px !important; }
html[data-v="editorial"] footer .cinner { padding-bottom:24px !important; max-width:1200px !important; margin:0 auto !important; padding-left:24px !important; padding-right:24px !important; }
/* === 29-I. 서브메뉴 #submenu / sub_bc_* 톤 강화 (변형별 시그니처 보강) === */
html[data-cv="v5"] .sub_bc_link, html[data-cv="v5"] .sub_bc_btn { font-size:.9rem !important; padding:14px 18px !important; transition:all .25s !important; }
html[data-cv="v5"] .sub_bc_home { padding:14px 18px !important; transition:all .25s !important; }
html[data-v="fullhero"] .sub_bc_link, html[data-v="fullhero"] .sub_bc_btn { letter-spacing:.5px !important; }
html[data-v="cinema"] .sub_bc_link, html[data-v="cinema"] .sub_bc_btn { letter-spacing:3px !important; text-transform:uppercase !important; padding:16px 20px !important; }
html[data-v="splithero"] .sub_bc_link, html[data-v="splithero"] .sub_bc_btn { letter-spacing:.5px !important; font-weight:600 !important; }
html[data-v="mosaic"] .sub_bc_btn:hover, html[data-v="mosaic"] .sub_bc_btn.open { background:var(--a1-12) !important; color:var(--p) !important; border-radius:8px !important; }
html[data-v="typography"] .sub_bc_link, html[data-v="typography"] .sub_bc_btn { letter-spacing:4px !important; padding:16px 20px !important; }
html[data-v="monoline"] .sub_bc_link, html[data-v="monoline"] .sub_bc_btn { letter-spacing:4px !important; text-transform:uppercase !important; padding:16px 20px !important; }
html[data-v="parallax"] .sub_bc_btn:hover, html[data-v="parallax"] .sub_bc_btn.open { transform:translateY(-1px) !important; }
html[data-v="luxury"] .sub_bc_link, html[data-v="luxury"] .sub_bc_btn { letter-spacing:.5px !important; padding-left:20px !important; }
html[data-v="minimal"] .sub_bc_link, html[data-v="minimal"] .sub_bc_btn { letter-spacing:.5px !important; padding-right:20px !important; text-align:right !important; }
html[data-v="timeline"] .sub_bc_link, html[data-v="timeline"] .sub_bc_btn { letter-spacing:.5px !important; }
html[data-v="editorial"] .sub_bc_link, html[data-v="editorial"] .sub_bc_btn { font-weight:700 !important; letter-spacing:1px !important; }
/* === 29-J. 좌/우 플로팅 #quick / .wz-side-btn 절제 === */
html[data-cv="v5"] .wz-side-btn__item { transition:max-width .35s, background .25s !important; }
html[data-v="cinema"] .wz-side-btn__item:hover { max-width:80px; width:80px; background:var(--a1) !important; color:var(--a1t,#111) !important; }
html[data-v="typography"] .wz-side-btn__item:hover { background:var(--a1) !important; color:var(--a1t,#111) !important; }
html[data-v="parallax"] .wz-side-btn__item:hover { transform:translateX(2px) !important; }
/* ============================================================
라운드 30 — fullpage / parallax 방문예약 input 배경 var(--a3) 빨강 채움 fix
원인: --a3가 와인 빨강 팔레트(p179 등)에서 진한 빨강이라 input 배경 채우면 가독성 0
해결: input bg를 안전한 옅은 그레이(#f7f7f8)로 고정 + 가는 보더 추가
(input은 어느 팔레트에서도 옅게 유지되어야 안전)
============================================================ */
html[data-v="parallax"] .main_sec03 input[type="text"],
html[data-v="parallax"] .main_sec03 .fselect,
html[data-v="parallax"] #fwrite2 input[type="text"],
html[data-v="parallax"] #fwrite2 .fselect {
background: #f7f7f8 !important;
border: 1px solid var(--a1-20) !important;
color: #1a1a1a !important;
border-radius: 6px !important;
}
html[data-v="parallax"] .main_sec03 input::placeholder,
html[data-v="parallax"] #fwrite2 input::placeholder { color:#888 !important; }
/* ============================================================
라운드 31 — 사용자 직접 지적 메인 fix + luxury/minimal 폐기 후 새 컨셉
메인 페이지([data-index]) 한정
1. splithero 메인 프리미엄 보더 덕지덕지 → 좌측 6px 바 1개만
2. typography 메인 방문예약 padding 추가
3. fullpage 메인 여백 너무 커서 줄임 (디자인 자체는 호평)
4. timeline 메인 wz-blk-tit 동그라미 제거
5. gallery 메인 프리미엄 숫자-타이틀 간격 추가
6. editorial 메인 방문예약 padding 추가
7. luxury → "PLATE" (좌상단 plate 라벨 시그니처)
8. minimal → "FRAMED" (가는 보더 액자 + 모서리 짧은 라인)
============================================================ */
html[data-cv="v5"][data-index] .main_sec03 { background: var(--p) !important; }
html[data-cv="v5"][data-index] .main_sec03 ul li h3{color: var(--a2);}
html[data-v="splithero"][data-index] .wz-premium-item { box-shadow:0 6px 22px var(--a1-12) !important; background:#fff !important; padding:32px 32px 32px 28px !important; }
/* === 31-2. typography 메인 방문예약 padding === */
html[data-v="typography"][data-index] .main_sec03 ul li { padding:48px 24px !important; }
html[data-v="typography"][data-index] .main_sec03 #fwrite2 { padding:0 !important; }
html[data-v="typography"][data-index] .main_sec03 h3 { margin-bottom:32px !important; padding-bottom:14px !important; }
/* === 31-4. timeline 메인 wz-blk-tit 동그라미 제거 === */
html[data-v="timeline"][data-index] .wz-blk-tit::before { display:none !important; }
html[data-v="timeline"][data-index] .wz-blk-tit { padding-left:0 !important; }
/* === 31-6. editorial 메인 방문예약 padding === */
html[data-v="editorial"][data-index] .main_sec03 ul li { padding:40px 20px !important; }
html[data-v="editorial"][data-index] .main_sec03 #fwrite2 { padding:0 !important; }
html[data-v="editorial"][data-index] .main_sec03 h3 { margin-bottom:30px !important; padding-bottom:14px !important; }
/* === 31-7. luxury 새 컨셉 = PLATE (좌상단 plate 라벨 시그니처) === */
/* 기존 좌측 라인 + 좌정렬 → 좌상단 plate 라벨로 시그니처 교체 */
html[data-v="luxury"][data-index] .wz-blk-tit::before { display:none !important; }
html[data-v="luxury"][data-index] .wz-blk-tit { padding-left:0 !important; font-size:2.2rem !important; font-weight:700 !important; letter-spacing:-.5px !important; line-height:1.2 !important; text-align:left !important; margin:0 0 14px !important; }
html[data-v="luxury"][data-index] .wz-blk-sub { padding:6px 14px !important; background:var(--a1) !important; color:var(--a1t, #fff) !important; display:inline-block !important; font-size:1.2rem !important; letter-spacing:3px !important; font-weight:700 !important; text-transform:uppercase !important; text-align:left !important; border-radius:2px !important; margin-bottom:18px !important; }
html[data-v="luxury"][data-index] .wz-premium-item { border:none !important; border-left:none !important; border-bottom:none !important; position:relative !important; }
html[data-v="luxury"][data-index] .wz-pm-num { position:static !important; left:auto !important; right:auto !important; top:auto !important; padding:5px 12px !important; background:var(--a1) !important; color:var(--a1t, #fff) !important; font-size:1.2rem !important; font-weight:700 !important; letter-spacing:2px !important; line-height:1.4 !important; border-radius:2px !important; display:inline-block !important; margin:0 0 14px !important; width:auto !important; height:auto !important; }
html[data-v="luxury"][data-index] .wz-pm-title { font-size:1.25rem !important; font-weight:700 !important; letter-spacing:-.3px !important; margin:0 0 8px !important; }
html[data-v="luxury"][data-index] .wz-pm-body { padding-left:0 !important; }
/* 메인 방문예약 폼 plate 시그니처 보강 */
html[data-v="luxury"][data-index] .main_sec03 ul li { padding:40px 20px !important; background:#fff !important; box-shadow:0 8px 24px var(--a1-12) !important; max-width:900px !important; margin:0 auto !important; position:relative !important; }
html[data-v="luxury"][data-index] .main_sec03 ul li::before { content:'CONTACT' !important; position:absolute !important; left:20px !important; top:20px !important; padding:5px 12px !important; background:var(--a1) !important; color:var(--a1t, #fff) !important; font-size:.7rem !important; letter-spacing:3px !important; font-weight:700 !important; border-radius:2px !important; }
html[data-v="luxury"][data-index] .main_sec03 h3 { padding-top:28px !important; margin-bottom:24px !important; }
/* === 31-8. minimal 새 컨셉 = FRAMED (가는 보더 액자 + 모서리 짧은 라인) === */
html[data-v="minimal"][data-index] .wz-blk-tit::after { display:none !important; }
html[data-v="minimal"][data-index] .wz-blk-tit { padding-right:0 !important; font-size:2.2rem !important; font-weight:600 !important; letter-spacing:-.5px !important; line-height:1.2 !important; text-align:center !important; margin:0 auto 12px !important; }
html[data-v="minimal"][data-index] .wz-blk-sub { text-align:center !important; padding:0 !important; font-size:1.1rem !important; letter-spacing:3px !important; text-transform:uppercase !important; font-weight:500 !important; color:var(--a2) !important; margin-bottom:32px !important; }
html[data-v="minimal"][data-index] .wz-premium-wrap { max-width:1100px !important; margin:0 auto !important; padding:0 24px !important; }
html[data-v="minimal"][data-index] .wz-premium-item { display:flex !important; flex-direction:column !important; gap:0 !important; padding:32px 36px !important; border:1px solid var(--a1-30) !important; border-right:1px solid var(--a1-30) !important; background:#fff !important; box-shadow:none !important; text-align:left !important; position:relative !important; }
/* 좌상단 짧은 컬러 라인 + 우하단 짧은 컬러 라인 (대각 모서리 강조) — FRAMED 시그니처 */
html[data-v="minimal"][data-index] .wz-premium-item::before { content:'' !important; position:absolute !important; left:-1px !important; top:-1px !important; width:48px !important; height:3px !important; background:var(--a1) !important; }
html[data-v="minimal"][data-index] .wz-pm-num { position:static !important; left:auto !important; right:auto !important; top:auto !important; padding:0 !important; background:transparent !important; font-size:2.4rem !important; font-weight:200 !important; color:var(--a1) !important; line-height:1 !important; margin:0 0 12px !important; width:auto !important; height:auto !important; letter-spacing:-1px !important; }
html[data-v="minimal"][data-index] .wz-pm-title { font-size:1.25rem !important; font-weight:700 !important; letter-spacing:-.3px !important; text-align:left !important; margin:0 0 8px !important; }
html[data-v="minimal"][data-index] .wz-pm-body { text-align:left !important; padding-right:0 !important; }
/* 메인 방문예약 폼 FRAMED 시그니처 */
html[data-v="minimal"][data-index] .main_sec03 ul li { padding:60px 48px !important; background:#fff !important; border:1px solid var(--a1-30) !important; box-shadow:none !important; max-width:900px !important; margin:0 auto !important; position:relative !important; text-align:left !important; }
html[data-v="minimal"][data-index] .main_sec03 ul li::before { content:'' !important; position:absolute !important; left:-1px !important; top:-1px !important; width:64px !important; height:3px !important; background:var(--a1) !important; }
html[data-v="minimal"][data-index] .main_sec03 ul li::after { content:'' !important; position:absolute !important; right:-1px !important; bottom:-1px !important; width:64px !important; height:3px !important; background:var(--a1) !important; }
html[data-v="minimal"][data-index] footer { text-align:left !important; }
html[data-v="minimal"][data-index] .main_sec03 h3 { text-align:center !important; }
/* ============================================================
라운드 32 — 사용자 대량 피드백 4개 영역 일괄 fix
대상: 프리미엄(서브) / 사업개요 / 입지환경 / 방문예약
============================================================ */
/* === 32-A. 프리미엄(서브) — 베이스 reset + 변형별 시그니처 명확화 ===*/
m ul li dl dd {
margin: 0 !important;
padding: 0 !important;
line-height: 1.7 !important;
}
html[data-cv="v5"] .sub_premium ul li dl dd strong {
display: block !important;
margin: 0 0 8px !important;
letter-spacing: -.3px !important;
}
/* PREMIUM N::after counter 라벨 일괄 우하단 작은 라벨로 통일 (충돌 방지) */
html[data-cv="v5"] .sub_premium ul li::after,
html[data-cv="v5"] .sub_premium ul li dl::after {
top: auto !important;
bottom: 14px !important;
right: 18px !important;
left: auto !important;
font-size: .62rem !important;
letter-spacing: 3px !important;
opacity: .35 !important;
font-weight: 600 !important;
color: var(--a2) !important;
}
/* var(--a3) 빨강 배경 → 흰 배경 일괄 fix */
html[data-v="cinema"] .sub_premium ul li dl,
html[data-v="splithero"] .sub_premium ul li dl,
html[data-v="parallax"] .sub_premium ul li dl{
background: #fff !important;
color: var(--p) !important;
}
/* 변형별 .sub_premium 카드 톤 강화 (높이 축소 + 시그니처 명확화) */
html[data-v="timeline"] .sub_premium ul li dl::before {
content: '' !important;
position: absolute !important;
left: 15px !important;
top: 30px !important;
width: 16px !important;
height: 16px !important;
border-radius: 50% !important;
background: #fff !important;
border: 2px solid var(--a1) !important;
}
/* === 32-B. 사업개요 — #ctt table td 배경 제거 + 가독성 강화 ===
- 모든 변형 td 배경 transparent (var(--a3) 빨강 채움 fix)
- 글씨색 명시 (자식 노드 inherit 강제)
- 헤더(th/첫번째 td) 색만 var(--a1)/var(--p)로 강조
- 라인은 헤어라인(1px var(--a1-12))으로 절제
*/
/* 공통 베이스 — 모든 #ctt table td 배경 투명 + 자식 노드 색상 inherit */
/* === 32-C. 입지환경 fix (splithero/typography/fullpage/timeline/editorial) === */
/* splithero — 어두운 헤더 위 글씨 흰색 명시 */
html[data-v="splithero"] .wz-loc-cat-header { background: var(--p) !important; padding: 22px 28px !important; }
html[data-v="splithero"] .wz-loc-cat-title { color: var(--ht, #fff) !important; font-size: 1.3rem !important; font-weight: 700 !important; }
html[data-v="splithero"] .wz-loc-cat-header * { color: var(--ht, #fff) !important; }
html[data-v="splithero"] .wz-loc-cat-header .wz-loc-cat-name { color: var(--a1) !important; }
/* typography — padding 통일 */
html[data-v="typography"] .wz-loc-cat-header { padding: 0 0 18px !important; background: transparent !important; border-bottom: 1px solid var(--a1-12) !important; }
html[data-v="typography"] .wz-loc-cat-name { letter-spacing: 5px !important; }
html[data-v="typography"] .wz-loc-cat-title { color: var(--p) !important; font-size: 1.8rem !important; font-weight: 200 !important; letter-spacing: -1px !important; margin-top: 8px !important; }
html[data-v="typography"] .wz-loc-items { padding: 18px 0 0 !important; }
html[data-v="typography"] .wz-loc-items li { padding: 12px 0 !important; border-bottom: 1px solid var(--a1-12) !important; }
/* timeline — 좌측 라인 + 동그라미 마커 명확화 */
html[data-v="timeline"] .wz-loc-wrap { gap: 28px !important; }
html[data-v="timeline"] .wz-loc-cat-header { padding: 0 0 14px !important; background: transparent !important; border-bottom: none !important; }
html[data-v="timeline"] .wz-loc-cat-name { letter-spacing: 1.5px !important; text-transform: uppercase !important; color: var(--a1);}
html[data-v="timeline"] .wz-loc-cat-title { color: var(--p) !important; font-size: 1.25rem !important; font-weight: 700 !important; margin-top: 6px !important; }
html[data-v="timeline"] .wz-loc-items { padding: 0 !important; }
html[data-v="timeline"] .wz-loc-items li { padding: 10px 0 !important; border-bottom: 1px solid var(--a1-12) !important; }
/* editorial — 보더 정리, 매거진 grid 깔끔하게 */
html[data-v="editorial"] .wz-loc-cat-header { padding: 0 !important; background: transparent !important; border: none !important; }
html[data-v="editorial"] .wz-loc-cat-name { letter-spacing: 3px !important; text-transform: uppercase !important; color: var(--a1); padding: 0;}
html[data-v="editorial"] .wz-loc-cat-title { color: var(--p) !important; font-size: 1.8rem !important; font-weight: 900 !important; letter-spacing: -.8px !important; line-height: 1.15 !important; margin-top: 8px !important; margin-bottom: 10px;}
html[data-v="editorial"] .wz-loc-items { padding: 0 !important; }
html[data-v="editorial"] .wz-loc-items li { padding: 10px 0 !important; border-bottom: 1px solid var(--a1-12) !important; }
/* === 32-D. 방문예약 fix (별표/select/input/datepicker 가독성 통일) === */
/* 모든 변형 .star 가독성 강제 (특히 mosaic) */
html[data-cv="v5"] .star,
html[data-cv="v5"] label .star,
html[data-cv="v5"] .required,
html[data-cv="v5"] .main_sec03 .star,
html[data-cv="v5"] #fwrite .star,
html[data-cv="v5"] #fwrite2 .star {
color: var(--a1) !important;
font-weight: 700 !important;
font-size: .9em !important;
margin-left: 3px !important;
display: inline !important;
visibility: visible !important;
opacity: 1 !important;
}
/* 어두운 배경 변형은 별표 더 진하게 (a1이 어두우면 배경에 묻힐 수 있음) */
html[data-v="cinema"] .main_sec03 .star{ color: var(--a1) !important; opacity: 1 !important; }
/* 모든 select / .fselect 가독성 통일 (배경 흰색, 글씨 진하게, 화살표 명시) */
html[data-cv="v5"] select,
html[data-cv="v5"] .fselect,
html[data-cv="v5"] .main_sec03 select,
html[data-cv="v5"] .main_sec03 .fselect,
html[data-cv="v5"] #fwrite select,
html[data-cv="v5"] #fwrite .fselect,
html[data-cv="v5"] #fwrite2 select,
html[data-cv="v5"] #fwrite2 .fselect {
color: #1a1a1a !important;
font-weight: 500 !important;
-webkit-appearance: none !important;
-moz-appearance: none !important;
appearance: none !important;
background-image: url("data:image/svg+xml;utf8,") !important;
background-repeat: no-repeat !important;
background-position: right 14px center !important;
background-size: 12px !important;
padding-right: 36px !important;
padding-left: 15px !important;
}
html[data-cv="v5"] select option { color: #1a1a1a !important; background: #fff !important; }
/* 어두운 배경 변형 (cinema/noirpremium 메인 sec03)은 select도 배경/글씨 흰 톤 */
html[data-v="cinema"] .main_sec03 select,
html[data-v="cinema"] .main_sec03 .fselect {
color: var(--ht, #fff) !important;
background-image: url("data:image/svg+xml;utf8,") !important;
}
/* 모든 input 글씨색 강제 (실 입력값 #1a1a1a) */
html[data-cv="v5"] input[type="text"],
html[data-cv="v5"] input[type="email"],
html[data-cv="v5"] input[type="tel"],
html[data-cv="v5"] input[type="password"],
html[data-cv="v5"] input[type="number"],
html[data-cv="v5"] input[type="search"],
html[data-cv="v5"] input[type="date"],
html[data-cv="v5"] textarea {
color: #1a1a1a !important;
font-weight: 500 !important;
padding: 8px 5px;
}
/* 어두운 배경 폼은 흰 글씨 */
html[data-v="cinema"] .main_sec03 input[type="text"],
html[data-v="cinema"] .main_sec03 input[type="email"],
html[data-v="cinema"] .main_sec03 input[type="tel"],
html[data-v="cinema"] .main_sec03 textarea { color: var(--ht, #fff) !important; }
/* 모든 placeholder 색 강제 */
html[data-cv="v5"] input::placeholder,
html[data-cv="v5"] textarea::placeholder { color: #999 !important; opacity: 1 !important; font-weight: 400 !important; }
html[data-v="cinema"] .main_sec03 input::placeholder,
html[data-v="cinema"] .main_sec03 textarea::placeholder { color: rgba(255,255,255,.55) !important; }
/* 데이트피커 — jQuery UI / 일반 datepicker / flatpickr 공통 톤 강화 */
.ui-datepicker,
.datepicker,
.flatpickr-calendar {
background: #fff !important;
border: 1px solid var(--a1-30, rgba(0,0,0,.12)) !important;
border-radius: 8px !important;
padding: 12px !important;
box-shadow: 0 16px 40px rgba(0,0,0,.18) !important;
font-family: var(--site-font, 'Pretendard','Noto Sans KR','Apple SD Gothic Neo',sans-serif) !important;
z-index: 9999 !important;
}
.ui-datepicker .ui-datepicker-header,
.ui-datepicker-header,
.flatpickr-months {
background: var(--p, #2a2a2a) !important;
color: #fff !important;
border-radius: 6px !important;
padding: 8px !important;
border: none !important;
}
.ui-datepicker .ui-datepicker-title,
.ui-datepicker-title,
.flatpickr-current-month { color: #fff !important; font-weight: 600 !important; font-size: .92rem !important; }
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next,
.flatpickr-prev-month,
.flatpickr-next-month { color: #fff !important; cursor: pointer !important; }
.ui-datepicker table { border-collapse: collapse !important; width: 100% !important; margin-top: 8px !important; }
.ui-datepicker th { padding: 8px 4px !important; color: var(--a1, #c0392b) !important; font-size: .72rem !important; font-weight: 700 !important; letter-spacing: 1px !important; text-transform: uppercase !important; }
.ui-datepicker td { padding: 2px !important; }
.ui-datepicker td a,
.ui-datepicker td span,
.flatpickr-day {
display: block !important;
padding: 8px 4px !important;
text-align: center !important;
color: var(--p, #2a2a2a) !important;
border-radius: 4px !important;
font-size: 1.1rem !important;
text-decoration: none !important;
border: none !important;
background: transparent !important;
}
.ui-datepicker td a:hover,
.flatpickr-day:hover { background: var(--a1-12, rgba(192,57,43,.12)) !important; color: var(--a1, #c0392b) !important; }
.ui-datepicker .ui-state-active,
.flatpickr-day.selected,
.flatpickr-day.startRange { background: var(--a1, #c0392b) !important; color: #fff !important; font-weight: 600 !important; }
.flatpickr-day.today { border: 1px solid var(--a1, #c0392b) !important; }
/* ============================================================
라운드 33 — sub_premium dt 위치 reset (mosaic/splithero 숫자 안 보임 fix)
원인: 라운드 14에서 mosaic dt(position:absolute top:24 left:36),
splithero dt(position:absolute left:32 top:50%) 잔존
→ 32-A 인라인 시그니처 룰이 position 명시 안 해서 absolute 그대로 작동
해결: 모든 변형 dt position:static + offset 0 + transform 무력화 (32-A 의도대로)
============================================================ */
html[data-cv="v5"] .sub_premium ul li dl dt {
position: static !important;
left: auto !important;
right: auto !important;
top: auto !important;
bottom: auto !important;
transform: none !important;
}
/* grid 사용 변형은 grid item 위치 회복 */
html[data-v="fullhero"] .sub_premium ul li dl dt,
html[data-v="typography"] .sub_premium ul li dl dt,
html[data-v="editorial"] .sub_premium ul li dl dt{
position: static !important;
}
/* ============================================================
라운드 34 — luxury / minimal 진짜 새 컨셉 강하게 (사용자 재요청)
라운드 31 PLATE/FRAMED가 너무 약함 → BADGE/CORNER 강한 시그니처로
적용 범위: 메인 + 서브 모든 페이지 (data-index 한정 X)
- luxury = "BADGE" : 좌측 정사각 컬러 배지 + 본문 우측 split
- minimal = "CORNER" : 우상단 대각 컷 컬러 corner (크게)
============================================================ */
/* === 34-LEFT. luxury = "BADGE" === */
/* 메인 wz-blk 영역 — 좌측 사각 배지 + 헤드 우측 */
html[data-v="luxury"] .wz-blk-tit::before { display: none !important; }
html[data-v="luxury"] .wz-blk-tit { padding-left: 0 !important; font-size: 2.2rem !important; font-weight: 700 !important; letter-spacing: -.5px !important; text-align: left !important; line-height: 1.25 !important; margin: 0 0 8px !important; }
html[data-v="luxury"] .wz-blk-sub { padding: 8px 18px !important; background: var(--a1) !important; color: var(--a1t, #fff) !important; display: inline-block !important; font-size: 1.2rem !important; letter-spacing: 3px !important; font-weight: 800 !important; text-transform: uppercase !important; border-radius: 0 !important; margin-bottom: 22px !important; text-align: left !important; }
/* 서브 sub_title — 좌측 사각 배지 + 헤드 */
html[data-v="luxury"] .sub_title > h2.tit01 { font-size: 2.6rem !important; font-weight: 700 !important; letter-spacing: -.5px !important; line-height: 1.2 !important; padding: 0 !important; margin-bottom: 14px !important; }
html[data-v="luxury"] .sub_title > h2.tit02 { padding: 8px 18px !important; background: var(--a1) !important; color: var(--a1t, #fff) !important; display: inline-block !important; font-size: .8rem !important; letter-spacing: 3px !important; font-weight: 800 !important; text-transform: uppercase !important; }
/* 메인 프리미엄 카드 = 좌측 사각 배지 (큰 숫자) + 본문 split */
html[data-v="luxury"] .wz-premium-item .wz-pm-num {
background: var(--a1) !important;
color: var(--a1t, #fff) !important;
font-size: 2rem !important;
font-weight: 800 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
position: static !important;
left: auto !important;
top: auto !important;
right: auto !important;
transform: none !important;
width: auto !important;
height: auto !important;
border-radius: 0 !important;
text-align: center !important;
}
html[data-v="luxury"] .wz-premium-item .wz-pm-body { padding: 24px 0 !important; align-self: center !important; }
/* 서브 프리미엄 카드 — 동일 BADGE 시그니처 */
/* 입지환경 카드 = 좌측 큰 컬러 헤더 + 우측 본문 split */
html[data-v="luxury"] .wz-loc-cat-title { color: var(--a1t, #fff) !important; font-size: 1.2rem !important; font-weight: 700 !important; line-height: 1.25 !important; }
html[data-v="luxury"] .wz-loc-items { padding: 0 !important; }
html[data-v="luxury"] .wz-loc-items li { padding: 10px 0 !important; border-bottom: 1px solid var(--a1-12) !important; }
/* 방문예약 폼 — 좌상단 BADGE 라벨 (메인 + 서브 모두) */
html[data-v="luxury"] .main_sec03 ul li, html[data-v="luxury"] #fwrite {
background: #fff !important;
box-shadow: 0 6px 20px var(--a1-12) !important;
border: none !important;
padding: 60px 48px !important;
max-width: 900px !important;
margin: 0 auto !important;
position: relative !important;
}
html[data-v="luxury"] .main_sec03 h3 { padding-top: 28px !important; margin-bottom: 24px !important; }
/* === 34-RIGHT. minimal = "CORNER" === */
/* 메인 wz-blk 영역 — 우상단 대각 컷 corner */
html[data-v="minimal"] .wz-blk-tit::after { display: none !important; }
html[data-v="minimal"] .wz-blk-tit { padding-right: 0 !important; text-align: left !important; font-size: 2.2rem !important; font-weight: 600 !important; letter-spacing: -.5px !important; line-height: 1.25 !important; margin: 0 0 10px !important; }
html[data-v="minimal"] .wz-blk-sub { text-align: left !important; padding: 0 !important; font-size: 1.1rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; font-weight: 600 !important; color: var(--a2) !important; margin-bottom: 28px !important; }
/* 서브 sub_title — 우상단 대각 corner */
html[data-v="minimal"] .sub_title { position: relative !important; }
html[data-v="minimal"] .sub_title > h2.tit01 { font-size: 2.6rem !important; font-weight: 700 !important; letter-spacing: -.5px !important; line-height: 1.2 !important; margin-bottom: 14px !important; }
html[data-v="minimal"] .sub_title > h2.tit01::after { display: none !important; }
html[data-v="minimal"] .sub_title > h2.tit02 { font-size: 1.1rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; font-weight: 600 !important; color: var(--a2) !important; }
/* 메인 프리미엄 카드 — 가는 보더 + 우상단 대각 컷 corner */
html[data-v="minimal"] .wz-premium-item::before { display: none !important; }
html[data-v="minimal"] .wz-premium-item::after {
content: '' !important;
position: absolute !important;
top: -1px !important;
right: -1px !important;
width: 0 !important;
height: 0 !important;
border-style: solid !important;
border-width: 0 40px 40px 0 !important;
border-color: transparent var(--a1) transparent transparent !important;
background: transparent !important;
}
html[data-v="minimal"] .wz-pm-body { text-align: left !important; padding-right: 0 !important; }
/* 서브 프리미엄 카드 — 동일 CORNER 시그니처 */
html[data-v="minimal"] .sub_premium ul li dl::before { display: none !important; }
html[data-v="minimal"] .sub_premium ul li dl::after {
content: '' !important;
position: absolute !important;
top: -1px !important;
right: -1px !important;
width: 0 !important;
height: 0 !important;
border-style: solid !important;
border-width: 0 40px 40px 0 !important;
border-color: transparent var(--a1) transparent transparent !important;
background: transparent !important;
}
/* 입지환경 — 가는 보더 + 우상단 대각 컷 corner */
html[data-v="minimal"] .wz-loc-cat::after {
content: '' !important;
position: absolute !important;
top: -1px !important;
right: -1px !important;
width: 0 !important;
height: 0 !important;
border-style: solid !important;
border-width: 0 40px 40px 0 !important;
border-color: transparent var(--a1) transparent transparent !important;
z-index: 1 !important;
}
html[data-v="minimal"] .wz-loc-cat-header { padding: 22px 28px !important; background: transparent !important; border-bottom: 1px solid var(--a1-30) !important; }
html[data-v="minimal"] .wz-loc-cat-header .wz-loc-cat-name{color: var(--a1); padding: 10px 0;}
html[data-v="minimal"] .wz-loc-cat-title { color: var(--p) !important; font-size: 1.2rem !important; font-weight: 700 !important; }
html[data-v="minimal"] .wz-loc-items { padding: 18px 28px !important; }
html[data-v="minimal"] .wz-loc-items li { text-align: left !important; padding: 10px 0 !important; border-bottom: 1px solid var(--a1-12) !important; }
/* 사업개요 — 가는 보더 + 우상단 대각 corner (table 자체) */
/* 방문예약 폼 — 우상단 대각 컷 corner */
html[data-v="minimal"] .main_sec03 ul li, html[data-v="minimal"] #fwrite {
background: #fff !important;
border: 1px solid var(--a1-30) !important;
box-shadow: none !important;
padding: 60px 48px !important;
max-width: 900px !important;
margin: 0 auto !important;
position: relative !important;
text-align: left !important;
overflow: hidden !important;
}
html[data-v="minimal"] .main_sec03 ul li::before, html[data-v="minimal"] #fwrite::before { display: none !important; }
html[data-v="minimal"] .main_sec03 ul li::after, html[data-v="minimal"] #fwrite::after {
content: '' !important;
position: absolute !important;
top: -1px !important;
right: -1px !important;
width: 0 !important;
height: 0 !important;
border-style: solid !important;
border-width: 0 60px 60px 0 !important;
border-color: transparent var(--a1) transparent transparent !important;
}
html[data-v="minimal"] footer { text-align: left !important; }
html[data-v="minimal"] footer .cinner { padding-right: 32px !important; padding-left: 32px !important; }
/* ============================================================
라운드 35 — 능동 검수에서 발견한 잔존 이슈 5건 fix
1. mosaic 프리미엄(서브) dt 숫자 안 보임 → 진한 빨강 채움 강화
2. gallery 프리미엄(서브) dt 숫자 안 보임 → 강한 시그니처
3. fullpage 프리미엄(서브) 위 빈 공간 축소 + PREMIUM N 가시화
4. cinema 사업개요 어두운 박스 잔존 → 모든 자식 노드 background 강제 transparent
5. mosaic 방문예약 빨간 둥근 박스 8개 → 의심 셀렉터 일괄 무력화
============================================================ */
/* 35-1. mosaic 프리미엄(서브) dt 강한 pill 라벨 */
/* 35-4. cinema 사업개요 어두운 박스 잔존 fix (자식 wrapper 모두 transparent 강제) */
html[data-v="cinema"] #ctt,
html[data-v="cinema"] #ctt > *,
html[data-v="cinema"] #ctt table,
html[data-v="cinema"] #ctt table > *,
html[data-v="cinema"] #ctt table tbody,
html[data-v="cinema"] #ctt table tr,
html[data-v="cinema"] #ctt div,
html[data-v="cinema"] #ctt p {
background: transparent !important;
background-color: transparent !important;
}
/* 셀 자체 다시 명시 (혹시 본문 컨텐츠 div가 어두운 배경) */
html[data-v="cinema"] #ctt table th,
html[data-v="cinema"] #ctt table td {
background: #fff !important;
color: var(--p) !important;
}
html[data-v="cinema"] #ctt table th *,
html[data-v="cinema"] #ctt table td * {
background: transparent !important;
color: inherit !important;
}
/* 35-5. mosaic 방문예약 빨간 둥근 박스 의심 셀렉터 일괄 무력화 */
html[data-v="mosaic"] .main_sec03 .star,
html[data-v="mosaic"] .main_sec03 .required,
html[data-v="mosaic"] .main_sec03 input::before,
html[data-v="mosaic"] .main_sec03 input::after,
html[data-v="mosaic"] .main_sec03 select::before,
html[data-v="mosaic"] .main_sec03 select::after,
html[data-v="mosaic"] .main_sec03 li::before:not(.inp_chk),
html[data-v="mosaic"] .main_sec03 form::before,
html[data-v="mosaic"] .main_sec03 form::after,
html[data-v="mosaic"] .main_sec03 label:not(.inp_chk)::before,
html[data-v="mosaic"] .main_sec03 label:not(.inp_chk)::after {
background: transparent !important;
background-color: transparent !important;
border-radius: 0 !important;
width: auto !important;
height: auto !important;
box-shadow: none !important;
}
/* mosaic .main_sec03 .star만 텍스트 별표로 명확 */
html[data-v="mosaic"] .main_sec03 .star {
background: transparent !important;
color: var(--a1) !important;
font-weight: 700 !important;
font-size: .9em !important;
display: inline !important;
padding: 0 !important;
margin-left: 3px !important;
border: none !important;
border-radius: 0 !important;
width: auto !important;
height: auto !important;
}
/* 보너스: 모든 변형 .star 일괄 inline 텍스트만 (빨간 둥근 박스 만들지 않게) */
html[data-cv="v5"] .star,
html[data-cv="v5"] .required {
background: transparent !important;
background-color: transparent !important;
border-radius: 0 !important;
border: none !important;
box-shadow: none !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin-left: 3px !important;
}
/* ============================================================
라운드 36 — 라이브 inspect 후 정확한 잔존 fix
1. mosaic #fwrite label 빨간 둥근 캡슐 fix (라인 1489 무력화)
원인: mosaic 라운드 9에서 #fwrite label에 background:var(--a3) + border-radius:999px
→ 빨강 팔레트에서 라벨 5개가 빨간 동그란 캡슐로 보임 (가독성 0)
해결: 라벨을 평범한 텍스트로 (background transparent + radius 0)
2. fullpage 프리미엄(서브) 위 빈 공간 추가 축소
============================================================ */
/* 36-1. mosaic #fwrite label 빨간 둥근 캡슐 → 일반 텍스트 */
html[data-v="mosaic"] #fwrite label,
html[data-v="mosaic"] #fwrite label.label,
html[data-v="mosaic"] #fwrite2 label,
html[data-v="mosaic"] #fwrite2 label.label {
background: transparent !important;
background-color: transparent !important;
color: var(--p) !important;
padding: 0 !important;
border-radius: 0 !important;
border: none !important;
box-shadow: none !important;
font-weight: 600 !important;
letter-spacing: .3px !important;
width: auto !important;
height: auto !important;
display: inline-block !important;
font-size: .92rem !important;
margin-bottom: 6px !important;
}
/* inp_chk(체크박스 라벨) 시그니처 보존 */
html[data-v="mosaic"] #fwrite label.inp_chk,
html[data-v="mosaic"] #fwrite2 label.inp_chk {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
}
/* ════════════════════════════════════════════════════════════════
── 38. 전체 15개 변형 border 제거 및 고급화 재작업 ──
목표: border 163개 → 0개. 여백·그림자·투명도로 고급스럽게
════════════════════════════════════════════════════════════════ */
/* ── 38-1. 전체 변형 공통: wz-premium-item border 제거 ── */
html[data-cv="v5"] .wz-premium-item {
border: none !important;
border-bottom: none !important;
border-top: none !important;
margin-bottom: 24px !important;
}
html[data-cv="v5"] .wz-premium-item:last-child {
border-bottom: none !important;
margin-bottom: 0 !important;
}
/* ── 38-2. 전체 변형 공통: 테이블 기본 설정 ── */
html[data-cv="v5"] #ctt table {
border-collapse: collapse !important;
width: 100% !important;
}
html[data-cv="v5"] #ctt table th,
html[data-cv="v5"] #ctt table td {
border: 1px solid var(--a1-20) !important;
padding: 14px 18px !important;
}
html[data-cv="v5"] #ctt table th {
background: var(--p) !important;
color: var(--ht, #fff) !important;
font-weight: 700 !important;
}
/* ── 38-3. 전체 변형 공통: 폼 border 제거 ── */
html[data-cv="v5"] #fwrite,
html[data-cv="v5"] .contact-form {
border: none !important;
border-top: none !important;
border-bottom: none !important;
border-left: none !important;
border-right: none !important;
box-shadow: 0 2px 24px rgba(0,0,0,.04) !important;
}
/* ── 38-4. 전체 변형 공통: 서브메뉴 border 제거 ── */
html[data-cv="v5"] #submenu {
border: none !important;
border-bottom: none !important;
border-left: none !important;
border-right: none !important;
box-shadow: 0 1px 0 0 rgba(0,0,0,.04) !important;
position: relative !important;
z-index: 10 !important;
}
/* ── 38-5. 전체 변형 공통: quick 메뉴 border 제거 ── */
html[data-cv="v5"] #quick .quick_menu ul > li + li {
box-shadow: 0 -1px 0 0 rgba(255,255,255,.1) inset !important;
}
/* ── 38-6. luxury (이전 leftfloat) 고급화: border → 여백+그림자 ── */
html[data-v="luxury"] #ctt table {
border: none !important;
background: #fff !important;
box-shadow: 0 2px 20px rgba(0,0,0,.05) !important;
border-radius: 2px !important;
overflow: hidden !important;
}
html[data-v="luxury"] .sub_premium ul li dl .num {
font-size: 3.2rem !important;
font-weight: 200 !important;
color: var(--p) !important;
opacity: .12 !important;
display: block !important;
margin-bottom: 16px !important;
line-height: 1 !important;
}
/* ── 38-7. minimal (이전 rightfloat) 극도 간결화: border 0개 ── */
html[data-v="minimal"] #fwrite,
html[data-v="minimal"] .contact-form {
background: transparent !important;
padding: 64px 0 !important;
box-shadow: none !important;
border: none !important;
}
html[data-v="minimal"] #submenu {
box-shadow: none !important;
border: none !important;
backdrop-filter: blur(20px) !important;
background: rgba(255,255,255,.85) !important;
}
html[data-v="minimal"] .sub_premium ul li dl .num {
font-size: .75rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
opacity: .4 !important;
letter-spacing: 4px !important;
text-transform: uppercase !important;
display: block !important;
margin-bottom: 20px !important;
line-height: 1 !important;
}
/* ── 38-8. fullhero border 제거 ── */
html[data-v="fullhero"] .wz-premium-item::after {
content: '' !important;
position: absolute !important;
bottom: 0 !important;
left: 80px !important;
right: 0 !important;
height: 1px !important;
background: linear-gradient(90deg, var(--a1-12) 0%, transparent 100%) !important;
}
html[data-v="fullhero"] .wz-premium-item:last-child::after {
display: none !important;
}
html[data-v="fullhero"] #fwrite,
html[data-v="fullhero"] .contact-form {
border-top: none !important;
box-shadow: 0 -3px 0 0 var(--a1) !important;
}
/* ── 38-9. cinema border 제거 ── */
html[data-v="cinema"] .wz-premium-item {
border-bottom: none !important;
margin-bottom: 20px !important;
background: var(--p, #1a1a2e) !important;
padding: 30px;
border-radius: 10px;
}
html[data-v="cinema"] .wz-premium-item:last-child {
margin-bottom: 0 !important;
}
html[data-v="cinema"] #submenu {
border-bottom: none !important;
box-shadow: 0 1px 0 0 rgba(255,255,255,.08) !important;
}
html[data-v="cinema"] #quick .quick_menu ul > li:first-child {
border-top: none !important;
}
/* ── 38-10. splithero border 제거 ── */
html[data-v="splithero"] .wz-premium-item::before {
content: '' !important;
position: absolute !important;
left: 0 !important;
top: 8px !important;
bottom: 8px !important;
width: 4px !important;
background: linear-gradient(180deg, var(--a1) 0%, transparent 100%) !important;
opacity: .3 !important;
}
/* ── 38-11. mosaic는 패턴 특성상 border 유지 (최소화) ── */
/* ── 38-12. typography border 제거 ── */
html[data-v="typography"] .wz-premium-item {
border-bottom: none !important;
margin-bottom: 72px !important;
}
html[data-v="typography"] #ctt table {
border-top: none !important;
}
html[data-v="typography"] #fwrite,
html[data-v="typography"] .contact-form {
border-top: none !important;
border-bottom: none !important;
box-shadow: 0 -1px 0 0 rgba(0,0,0,.05), 0 1px 0 0 rgba(0,0,0,.05) !important;
}
html[data-v="typography"] #submenu {
border-bottom: none !important;
box-shadow: 0 1px 0 0 rgba(0,0,0,.04) !important;
}
html[data-v="typography"] #quick .quick_menu ul > li:first-child {
border-top: none !important;
}
/* ── 38-14. monoline border 제거 ── */
html[data-v="monoline"] .wz-loc-cat-header {
border-bottom: none !important;
box-shadow: 0 1px 0 0 rgba(0,0,0,.04) !important;
background: var(--a1);
}
html[data-v="monoline"] #ctt table {
border-top: none !important;
border-bottom: none !important;
box-shadow: 0 -1px 0 0 rgba(0,0,0,.05), 0 1px 0 0 rgba(0,0,0,.05) !important;
}
html[data-v="monoline"] #fwrite,
html[data-v="monoline"] .contact-form {
box-shadow: 0 -1px 0 0 rgba(0,0,0,.05), 0 1px 0 0 rgba(0,0,0,.05) !important;
}
html[data-v="monoline"] #quick .quick_menu ul > li:first-child {
border-top: none !important;
}
/* ── 38-15. parallax border 제거 (사용자: 이쁘다 → 최대한 유지) ── */
html[data-v="parallax"] .wz-premium-item {
border-bottom: none !important;
margin-bottom: 44px !important;
}
/* ── 38-17. timeline border 제거 ── */
html[data-v="timeline"] .wz-premium-item {
border-bottom: none !important;
margin-bottom: 50px !important;
display: flex;
gap: 0 30px;
align-items: center;
}
html[data-v="timeline"] #ctt table {
border-left: none !important;
box-shadow: -4px 0 0 0 var(--a1) !important;
}
/* ── 38-20. editorial border 제거 ── */
/* ════════════════════════════════════════════════════════════════
── 39. luxury 빨간 배경 완전 제거 + 고급화 최종 ──
════════════════════════════════════════════════════════════════ */
/* luxury 입지환경: 빨간 헤더 제거, 흰색 카드만 */
html[data-v="luxury"] .wz-loc-cat-header {
background: transparent !important;
padding: 0 0 16px 0 !important;
border: none !important;
border-bottom: none !important;
border-right: none !important;
display: block !important;
}
html[data-v="luxury"] .wz-loc-cat-name {
letter-spacing: -.5px !important;
margin-bottom: 10px !important;
color: var(--a1);
padding: 0;
}
html[data-v="luxury"] .wz-loc-cat-icon {
font-size: 2.4rem !important;
color: var(--p) !important;
opacity: .15 !important;
margin-bottom: 12px !important;
}
html[data-v="luxury"] .wz-loc-cat-body {
padding: 0 !important;
background: transparent !important;
}
/* ── 39-2. 전체 변형 input/select border 최소화 ── */
html[data-cv="v5"] input[type="text"],
html[data-cv="v5"] input[type="email"],
html[data-cv="v5"] input[type="tel"],
html[data-cv="v5"] input[type="date"],
html[data-cv="v5"] select,
html[data-cv="v5"] textarea,
html[data-cv="v5"] .fselect {
border: 1px solid rgba(0,0,0,.08) !important;
}
html[data-cv="v5"] input:focus,
html[data-cv="v5"] select:focus,
html[data-cv="v5"] textarea:focus {
border-color: var(--a1) !important;
box-shadow: 0 0 0 3px var(--a1-12) !important;
}
/* ── 39-3. minimal input border 완전 제거 ── */
/* ── 40. cinema/fullhero 어두운 카드 제거 및 고급화 ── */
/* ── 41. 풀히어로/시네마/스플릿히어로 오류 수정 ── */
/* 풀히어로: 메인 프리미엄 번호 겹침 수정 */
/* 풀히어로: 입지환경 글씨 색상 수정 */
/* 풀히어로: 사업개요 테이블 보더 추가 */
html[data-v="fullhero"] #ctt table {
border-top: 2px solid var(--p) !important;
}
html[data-v="fullhero"] #ctt table td {
border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
/* 시네마: 푸터 좌측 정렬 */
html[data-v="cinema"] footer .foot_copy {
text-align: left !important;
}
/* 시네마: 사업개요 테이블 보더 추가 */
html[data-v="cinema"] #ctt table {
border-top: 2px solid var(--p) !important;
}
html[data-v="cinema"] #ctt table td {
border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
/* 스플릿히어로: content_wrap border-left 제거 */
html[data-v="splithero"] .content_wrap {
border-left: none !important;
}
/* 스플릿히어로: 사업개요 테이블 보더 추가 */
html[data-v="splithero"] #ctt table {
border-top: 2px solid var(--p) !important;
border-left: 4px solid var(--a1) !important;
}
html[data-v="splithero"] #ctt table td {
border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
/* ════════════════════════════════════════════════════════════════
── 43. 6가지 확실한 개선 ──
1. 사업개요 테이블 패딩 간격 조절
2. 우측 플로팅 메뉴 확실하게 차별화
3. 좌측 플로팅 메뉴 확실하게 차별화
4. 입지환경 타이틀 안 보이는 부분 개선
5. 서브메뉴 15종별 다양화 (탭 아닌 형태 포함)
6. 서브타이틀 정렬 전체 개선
════════════════════════════════════════════════════════════════ */
/* ── 43-2. 우측 플로팅 메뉴(#quick) 15종 확실한 차별화 — 데스크탑 전용 ── */
@media(min-width:861px){
/* 기본: 우측 20px, 그림자 제거 */
html[data-cv="v5"] #quick {
right: 20px !important;
box-shadow: none !important;
}
} /* end @media(min-width:861px) 43-2 */
/* ── 43-3. 좌측 플로팅 메뉴(.wz-side-btn) 15종 확실한 차별화 ── */
/* 기본: 좌측 0px */
html[data-cv="v5"] .wz-side-btn {
left: 0 !important;
bottom: 120px !important;
}
/* fullhero: 정사각형 + 호버 확장 */
html[data-v="fullhero"] .wz-side-btn__item {
width: 60px !important;
height: 60px !important;
border-radius: 0 8px 8px 0 !important;
}
html[data-v="fullhero"] .wz-side-btn__item:hover {
width: 180px !important;
}
/* cinema: 상단 컬러 바 (좌측 border는 viewport 뒤로 숨어 보이지 않음) */
html[data-v="cinema"] .wz-side-btn__item {
max-width: 52px;
width: 52px;
border-left: none !important;
border-top: none !important;
box-shadow: inset 0 3px 0 var(--a1), 2px 2px 12px rgba(0,0,0,.18) !important;
}
/* splithero: 컬러 배경 */
html[data-v="splithero"] .wz-side-btn__item {
background: var(--a1) !important;
width: 52px !important;
}
/* mosaic: 라운드 */
html[data-v="mosaic"] .wz-side-btn__item {
border-radius: 0 12px 12px 0 !important;
}
/* typography: 흰 배경 */
html[data-v="typography"] .wz-side-btn__item {
background: #fff !important;
border: 1px solid rgba(0,0,0,.08) !important;
}
/* monoline: 라인 */
html[data-v="monoline"] .wz-side-btn__item {
border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
/* parallax: 그림자 */
html[data-v="parallax"] .wz-side-btn__item {
box-shadow: 0 4px 16px rgba(0,0,0,.15) !important;
}
/* luxury: 좌측 고정, 정사각형 */
html[data-v="luxury"] .wz-side-btn {
left: 0 !important;
}
html[data-v="luxury"] .wz-side-btn__item {
width: 68px !important;
height: 68px !important;
border-radius: 0 !important;
}
/* minimal: 연한 배경 + 우측 라운드 */
html[data-v="minimal"] .wz-side-btn__item {
background: rgba(0,0,0,.02) !important;
border-radius: 0 12px 12px 0 !important;
display:none;
}
/* timeline: 컬러 배경 */
html[data-v="timeline"] .wz-side-btn__item {
background: var(--a1) !important;
}
/* editorial: 굵은 border */
html[data-v="editorial"] .wz-side-btn__item {
border: 2px solid var(--p) !important;
border-left: none !important;
}
/* ── 43-4. 입지환경 타이틀 전체 색상 개선 ── */
html[data-cv="v5"] .wz-loc-cat-name {
font-weight: 700 !important;
font-size: 1.2rem !important;
}
html[data-cv="v5"] .wz-loc-cat-body,
html[data-cv="v5"] .wz-loc-cat-body * {
color: var(--p) !important;
}
/* ── 43-5. 서브메뉴 15종별 다양화 (탭 아닌 형태 포함) ── */
/* fullhero: 언더라인 */
html[data-v="fullhero"] #submenu .submenu_list {
display: flex !important;
justify-content: center !important;
gap: 40px !important;
border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
html[data-v="fullhero"] #submenu .submenu_list a {
padding: 20px 0 !important;
border-bottom: 3px solid transparent !important;
transition: all .3s !important;
}
html[data-v="fullhero"] #submenu .submenu_list a.on {
border-bottom-color: var(--a1) !important;
}
/* cinema: 버튼 스타일 */
html[data-v="cinema"] #submenu .submenu_list {
display: flex !important;
justify-content: center !important;
gap: 12px !important;
}
html[data-v="cinema"] #submenu .submenu_list a {
padding: 12px 28px !important;
border-radius: 6px !important;
background: transparent !important;
}
/* splithero: 좌측 바 */
html[data-v="splithero"] #submenu .submenu_list {
display: flex !important;
flex-direction: column !important;
max-width: 240px !important;
}
html[data-v="splithero"] #submenu .submenu_list a {
padding: 16px 24px !important;
border-left: 4px solid transparent !important;
}
html[data-v="splithero"] #submenu .submenu_list a.on {
border-left-color: var(--a1) !important;
background: rgba(0,0,0,.02) !important;
}
/* mosaic: 그리드 */
html[data-v="mosaic"] #submenu .submenu_list {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
gap: 12px !important;
}
html[data-v="mosaic"] #submenu .submenu_list a {
padding: 16px !important;
text-align: center !important;
border-radius: 8px !important;
}
html[data-v="mosaic"] #submenu .submenu_list a.on {
background: var(--a1) !important;
}
/* typography: 미니멀 언더라인 */
html[data-v="typography"] #submenu .submenu_list {
display: flex !important;
justify-content: center !important;
gap: 48px !important;
}
html[data-v="typography"] #submenu .submenu_list a {
padding: 24px 0 !important;
font-weight: 300 !important;
letter-spacing: 2px !important;
}
html[data-v="typography"] #submenu .submenu_list a.on {
font-weight: 700 !important;
}
/* monoline: 라인 구분 */
html[data-v="monoline"] #submenu .submenu_list {
display: flex !important;
justify-content: center !important;
}
html[data-v="monoline"] #submenu .submenu_list a {
padding: 20px 32px !important;
border-right: 1px solid rgba(0,0,0,.08) !important;
}
html[data-v="monoline"] #submenu .submenu_list a:last-child {
border-right: none !important;
}
/* parallax: 카드 */
html[data-v="parallax"] #submenu .submenu_list {
display: flex !important;
justify-content: center !important;
gap: 16px !important;
}
html[data-v="parallax"] #submenu .submenu_list a {
padding: 14px 24px !important;
border-radius: 8px !important;
box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
}
html[data-v="parallax"] #submenu .submenu_list a.on {
background: var(--a1) !important;
transform: translateY(-2px) !important;
}
/* luxury: 넓은 여백 */
html[data-v="luxury"] #submenu .submenu_list {
display: flex !important;
justify-content: center !important;
gap: 56px !important;
}
html[data-v="luxury"] #submenu .submenu_list a {
padding: 28px 0 !important;
font-size: 1.1rem !important;
}
html[data-v="luxury"] #submenu .submenu_list a.on {
color: var(--a1) !important;
}
/* minimal: 최소 스타일 */
html[data-v="minimal"] #submenu .submenu_list {
display: flex !important;
justify-content: flex-start !important;
gap: 40px !important;
padding-left: 40px !important;
}
html[data-v="minimal"] #submenu .submenu_list a {
padding: 20px 0 !important;
opacity: .5 !important;
}
html[data-v="minimal"] #submenu .submenu_list a.on {
opacity: 1 !important;
font-weight: 700 !important;
}
/* timeline: 좌측 정렬 + 점 */
html[data-v="timeline"] #submenu .submenu_list {
display: flex !important;
flex-direction: column !important;
max-width: 280px !important;
}
html[data-v="timeline"] #submenu .submenu_list a {
padding: 16px 24px 16px 40px !important;
position: relative !important;
}
html[data-v="timeline"] #submenu .submenu_list a::before {
content: '' !important;
position: absolute !important;
left: 16px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 8px !important;
height: 8px !important;
border-radius: 50% !important;
background: rgba(0,0,0,.2) !important;
}
html[data-v="timeline"] #submenu .submenu_list a.on::before {
background: var(--a1) !important;
width: 12px !important;
height: 12px !important;
}
/* editorial: 굵은 타이포 */
html[data-v="editorial"] #submenu .submenu_list {
display: flex !important;
justify-content: center !important;
gap: 32px !important;
}
html[data-v="editorial"] #submenu .submenu_list a {
padding: 22px 0 !important;
font-weight: 300 !important;
font-size: 1.05rem !important;
}
html[data-v="editorial"] #submenu .submenu_list a.on {
font-weight: 800 !important;
}
/* ── 43-6. 서브타이틀 정렬 전체 개선 ── */
html[data-cv="v5"] .sub_title {
padding: 40px 0 20px !important;
text-align: center !important;
}
html[data-cv="v5"] .sub_title h2 {
margin: 0 auto !important;
}
html[data-cv="v5"] .sub_title .sub_title_desc {
margin-top: 16px !important;
text-align: center !important;
}
/* cinema 프리미엄(서브): 어두운 긴 카드 → 흰 카드 + 그림자 */
/* fullhero 입지환경: 어두운 카드 → 흰 카드 + 그림자 */
html[data-v="fullhero"] .wz-loc-cat-header {
background: transparent !important;
padding: 0 0 16px 0 !important;
border-bottom: 2px solid var(--a1) !important;
}
html[data-v="fullhero"] .wz-loc-cat-name {
color: var(--p) !important;
font-size: 1.3rem !important;
font-weight: 600 !important;
padding: 0 0 5px;
}
html[data-v="fullhero"] .wz-loc-cat-body {
padding: 0 !important;
}
html[data-v="minimal"] input[type="text"],
html[data-v="minimal"] input[type="email"],
html[data-v="minimal"] input[type="tel"],
html[data-v="minimal"] input[type="date"],
html[data-v="minimal"] select,
html[data-v="minimal"] textarea,
html[data-v="minimal"] .fselect {
border-bottom: 1px solid rgba(0,0,0,.12) !important;
border-radius: 0 !important;
background: transparent !important;
}
html[data-v="minimal"] input:focus,
html[data-v="minimal"] select:focus,
html[data-v="minimal"] textarea:focus {
border-bottom-color: var(--p) !important;
box-shadow: none !important;
}
/* ═══════════════════════════════════════════
── 라운드 44: splithero 좌측 레드선 전면 제거 (border-left + ::before)
═══════════════════════════════════════════ */
/* splithero: 모든 요소의 border-left 제거 - 우선순위 최상 */
html[data-v="splithero"] .content_wrap,
html[data-v="splithero"] .main_inner > .content_wrap,
html[data-v="splithero"] .main_inner,
html[data-v="splithero"] #wrap,
html[data-v="splithero"] body,
html[data-v="splithero"] #submenu,
html[data-v="splithero"] footer,
html[data-v="splithero"] footer .cinner,
html[data-v="splithero"] .sub_premium ul li dl,
html[data-v="splithero"] .wz-loc-cat,
html[data-v="splithero"] #ctt table,
html[data-v="splithero"] #ctt table th,
html[data-v="splithero"] #ctt table td,
html[data-v="splithero"] #fwrite,
html[data-v="splithero"] .contact-form,
html[data-v="splithero"] .wz-premium-item,
html[data-v="splithero"] .wz-blk-tit,
html[data-v="splithero"] .sub_title > h2 {
border-left: none !important;
}
/* splithero: 모든 ::before 가상요소의 좌측 레드 바 제거 */
html[data-v="splithero"] .wz-premium-item::before,
html[data-v="splithero"] #quick .quick_menu ul > li::before {
content: none !important;
display: none !important;
width: 0 !important;
background: transparent !important;
}
/* splithero: padding 조정 */
html[data-v="splithero"] footer .cinner,
html[data-v="splithero"] .sub_title > h2,
html[data-v="splithero"] .sub_title {
padding-left: 0 !important;
position: relative !important;
}
/* splithero: 메인 페이지([data-index]) border-left 제거 */
html[data-v="splithero"][data-index] .wz-premium-item,
html[data-v="splithero"][data-index] * {
border-left: none !important;
}
html[data-v="splithero"][data-index] .wz-premium-item::before {
content: none !important;
display: none !important;
width: 0 !important;
background: transparent !important;
}
/* ════════════════════════════════════════════════════════════════
── Round 45: 메인 프리미엄 고급화
splithero 신설계 / luxury 숫자 가시성 / minimal 구조 강화
════════════════════════════════════════════════════════════════ */
/* ─ splithero: round44 ::before/border-left 전면 제거 후 신설계
컬러 넘버 칩 + 스트라이프 레이아웃 ─ */
html[data-v="splithero"] .wz-premium-wrap {
background: rgba(0,0,0,.025) !important;
padding: 0 !important;
border-radius: 4px !important;
overflow: hidden !important;
max-width: 1100px !important;
}
html[data-v="splithero"] .wz-premium-item {
display: grid !important;
grid-template-columns: 64px 1fr !important;
gap: 0 !important;
padding: 0 !important;
margin-bottom: 3px !important;
border: none !important;
border-bottom: none !important;
background: transparent !important;
align-items: stretch !important;
}
html[data-v="splithero"] .wz-premium-item:last-child {
margin-bottom: 0 !important;
}
html[data-v="splithero"] .wz-pm-num {
background: var(--a1) !important;
color: var(--a1t, #fff) !important;
font-size: 1.3rem !important;
font-weight: 800 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
opacity: 1 !important;
letter-spacing: -1px !important;
padding: 0 !important;
border: none !important;
position: static !important;
transform: none !important;
}
html[data-v="splithero"] .wz-pm-body {
padding: 22px 28px !important;
background: #fff !important;
}
html[data-v="splithero"] .wz-pm-title {
font-size: 1.2rem !important;
font-weight: 700 !important;
color: var(--p) !important;
margin-bottom: 6px !important;
letter-spacing: -.3px !important;
}
html[data-v="splithero"] .wz-pm-desc {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
line-height: 1.65 !important;
opacity: .85 !important;
}
/* ─ luxury: 숫자 opacity .12 → solid 컬러, 카드+그리드 ─ */
html[data-v="luxury"] .wz-premium-item {
display: grid !important;
grid-template-columns: 56px 1fr !important;
gap: 0 24px !important;
align-items: center !important;
padding: 28px 36px !important;
margin-bottom: 12px !important;
background: #fff !important;
box-shadow: 0 1px 16px rgba(0,0,0,.07) !important;
border-radius: 2px !important;
border: none !important;
}
html[data-v="luxury"] .wz-pm-num {
font-size: 2.2rem !important;
font-weight: 800 !important;
color: var(--a1) !important;
opacity: 1 !important;
border: none !important;
padding: 0 !important;
margin-bottom: 0 !important;
display: block !important;
line-height: 1 !important;
letter-spacing: -1px !important;
text-align: center !important;
}
html[data-v="luxury"] .wz-pm-title {
font-size: 1.15rem !important;
font-weight: 700 !important;
color: var(--p) !important;
margin-bottom: 5px !important;
}
html[data-v="luxury"] .wz-pm-desc {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
line-height: 1.65 !important;
opacity: 1 !important;
}
/* ─ minimal: 큰 컬러 넘버 + 그리드 + 얇은 하단 구분선 ─ */
html[data-v="minimal"] .wz-premium-item {
display: grid !important;
grid-template-columns: 60px 1fr !important;
gap: 0 20px !important;
align-items: start !important;
padding: 36px 0 !important;
margin-bottom: 0 !important;
background: transparent !important;
box-shadow: none !important;
border: none !important;
border-bottom: 1px solid rgba(0,0,0,.07) !important;
position: static !important;
}
html[data-v="minimal"] .wz-premium-item:last-child {
border-bottom: none !important;
}
html[data-v="minimal"] .wz-pm-num {
font-size: 2rem !important;
font-weight: 800 !important;
color: var(--a1) !important;
opacity: 1 !important;
letter-spacing: -1px !important;
display: block !important;
margin-bottom: 0 !important;
text-transform: none !important;
border: none !important;
line-height: 1.2 !important;
padding: 0 !important;
text-align: right !important;
}
html[data-v="minimal"] .wz-pm-title {
font-size: 1.15rem !important;
font-weight: 700 !important;
color: var(--p) !important;
margin-bottom: 6px !important;
letter-spacing: -.3px !important;
}
html[data-v="minimal"] .wz-pm-desc {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
line-height: 1.65 !important;
font-weight: 400 !important;
opacity: .8 !important;
}
/* ─ fullhero: 유령 숫자 더 크고 진하게 (opacity .25 → .4, 5rem → 6rem) ─ */
/* ─ monoline: 숫자에 var(--a1) 더 강하게, 구분선 명확히 ─ */
html[data-v="monoline"] .wz-premium-item {
border-bottom: 1px solid rgba(0,0,0,.06) !important;
margin-bottom: 0 !important;
padding: 44px 0 !important;
}
html[data-v="monoline"] .wz-premium-item:last-child {
border-bottom: none !important;
}
html[data-v="monoline"] .wz-pm-num {
font-size: .75rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
opacity: 1 !important;
letter-spacing: 5px !important;
text-transform: uppercase !important;
display: block !important;
margin-bottom: 14px !important;
}
/* ══════════════════════════════════════════════════════════════
ROUND 46 — 명세 누락·오버라이드 수정
══════════════════════════════════════════════════════════════ */
/* ── 46-1. cinema 배경 복구 (line 1310 transparent 오버라이드 무력화) ── */
html[data-v="cinema"][data-cv="v5"] .wz-premium-wrap {
display: flex;
flex-direction: column;
gap: 15px 0 !important;
}
html[data-v="cinema"][data-cv="v5"] .wz-pm-title {
color: var(--ht, #fff) !important;
}
html[data-v="cinema"][data-cv="v5"] .wz-pm-desc {
color: rgba(255,255,255,.7) !important;
}
html[data-v="cinema"][data-cv="v5"] .wz-pm-num {
color: var(--a1) !important;
opacity: 1 !important;
margin-bottom: 10px;
display: block;
}
/* ── 46-2. luxury 메인 [data-index] 오버라이드 — triple-attr specificity ── */
html[data-v="luxury"][data-cv="v5"][data-index] .wz-premium-item {
display: grid !important;
grid-template-columns: 80px 1fr !important;
gap: 0 32px !important;
align-items: center !important;
padding: 32px 40px !important;
background: #fff !important;
box-shadow: 0 4px 24px rgba(0,0,0,.07) !important;
margin-bottom: 16px !important;
}
html[data-v="luxury"][data-cv="v5"][data-index] .wz-pm-num {
font-size: 3rem !important;
font-weight: 800 !important;
color: var(--a1) !important;
background: none !important;
padding: 0 !important;
opacity: 1 !important;
text-align: center !important;
letter-spacing: -2px !important;
width: auto !important;
height: auto !important;
border-radius: 0 !important;
}
html[data-v="luxury"][data-cv="v5"][data-index] .wz-pm-body,
html[data-v="luxury"][data-cv="v5"][data-index] .wz-pm-title,
html[data-v="luxury"][data-cv="v5"][data-index] .wz-pm-desc {
text-align: left !important;
}
/* ── 46-4. monoline 수평 행 레이아웃 — noirpremium과 명확히 차별화 ── */
html[data-v="monoline"][data-cv="v5"] .wz-premium-item {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
padding: 20px 24px !important;
margin-bottom: 0 !important;
border-bottom: 1px solid rgba(0,0,0,.06) !important;
gap: 24px !important;
background: #fff !important;
}
html[data-v="monoline"][data-cv="v5"] .wz-premium-item:last-child {
border-bottom: none !important;
}
html[data-v="monoline"][data-cv="v5"] .wz-pm-num {
font-size: 1.4rem !important;
font-weight: 300 !important;
color: var(--a1) !important;
min-width: 48px !important;
text-align: right !important;
border-right: 2px solid var(--a1) !important;
padding-right: 16px !important;
flex-shrink: 0 !important;
letter-spacing: 0 !important;
text-transform: none !important;
margin-bottom: 0 !important;
opacity: 1 !important;
}
html[data-v="monoline"][data-cv="v5"] .wz-pm-body,
html[data-v="monoline"][data-cv="v5"] .wz-pm-title,
html[data-v="monoline"][data-cv="v5"] .wz-pm-desc {
text-align: left !important;
}
/* ── 46-5. parallax 다크 패널 좌측 + 그리드 레이아웃 ── */
html[data-v="parallax"][data-cv="v5"] .wz-premium-item {
display: grid !important;
grid-template-columns: 90px 1fr !important;
gap: 0 !important;
align-items: stretch !important;
margin-bottom: 12px !important;
padding: 0 !important;
box-shadow: 0 2px 12px rgba(0,0,0,.05) !important;
}
html[data-v="parallax"][data-cv="v5"] .wz-pm-num {
background: var(--p) !important;
color: var(--ht, #fff) !important;
font-size: 1.8rem !important;
font-weight: 800 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
opacity: 1 !important;
width: auto !important;
height: auto !important;
border-radius: 0 !important;
padding: 0 !important;
}
html[data-v="parallax"][data-cv="v5"] .wz-pm-body {
padding: 24px 28px !important;
text-align: left !important;
}
html[data-v="parallax"][data-cv="v5"] .wz-pm-title {
text-align: left !important;
color: var(--p) !important;
}
html[data-v="parallax"][data-cv="v5"] .wz-pm-desc {
text-align: left !important;
}
/* ── 46-6. typography 설명 오버플로 수정 ── */
html[data-v="typography"][data-cv="v5"] .wz-pm-desc {
white-space: normal !important;
word-break: keep-all !important;
overflow: visible !important;
}
/* ── 47. fullhero 반응형 + 프리미엄 최종 정리 ── */
@media(max-width:1028px) {
html[data-v="fullhero"] header { padding: 0 15px !important; }
}
@media(max-width:768px) {
html[data-v="fullhero"] .wz-blk-tit { font-size:1.35rem !important; }
html[data-cv="v5"] .wz-premium-wrap { padding: 0 !important; }
html[data-cv="v5"] .sub_title > h2.tit01 { font-size:1.6rem !important; }
html[data-v="fullhero"] #quick .quick_menu ul > li { width:60px !important; height:60px !important; }
/* quick 모바일 그림자 — 우측 엣지 밀착형 */
html[data-v="fullhero"] #quick,
html[data-v="luxury"] #quick,
html[data-v="minimal"] #quick,
html[data-v="editorial"] #quick{ box-shadow: -4px 0 20px rgba(0,0,0,.18) !important; }
/* quick 모바일 그림자 — 플로팅형 */
html[data-v="cinema"] #quick,
html[data-v="splithero"] #quick,
html[data-v="mosaic"] #quick,
html[data-v="typography"] #quick,
html[data-v="monoline"] #quick,
html[data-v="parallax"] #quick,
html[data-v="timeline"] #quick{ box-shadow: 0 4px 20px rgba(0,0,0,.18) !important; }
}
/* ── 48. submenu_list 텍스트 색상 가시성 보장 ── */
/* 어두운 배경(var(--p)) 변형 → ht 색상 */
html[data-v="fullhero"] #submenu .submenu_list a,
html[data-v="cinema"] #submenu .submenu_list a,
html[data-v="splithero"] #submenu .submenu_list a,
html[data-v="minimal"] #submenu .submenu_list a{
color: var(--ht, #fff) !important;
opacity: 1 !important;
}
html[data-v="fullhero"] #submenu .submenu_list a:hover,
html[data-v="fullhero"] #submenu .submenu_list a.on,
html[data-v="cinema"] #submenu .submenu_list a:hover,
html[data-v="cinema"] #submenu .submenu_list a.on,
html[data-v="splithero"] #submenu .submenu_list a:hover,
html[data-v="splithero"] #submenu .submenu_list a.on,
html[data-v="minimal"] #submenu .submenu_list a:hover,
html[data-v="minimal"] #submenu .submenu_list a.on{
color: var(--a1) !important;
opacity: 1 !important;
}
/* 밝은 배경(#fff) 변형 → 항상 진한색 */
html[data-v="mosaic"] #submenu .submenu_list a,
html[data-v="typography"] #submenu .submenu_list a,
html[data-v="monoline"] #submenu .submenu_list a,
html[data-v="parallax"] #submenu .submenu_list a,
html[data-v="luxury"] #submenu .submenu_list a,
html[data-v="timeline"] #submenu .submenu_list a,
html[data-v="editorial"] #submenu .submenu_list a{
color: #222 !important;
opacity: 1 !important;
}
html[data-v="mosaic"] #submenu .submenu_list a:hover,
html[data-v="mosaic"] #submenu .submenu_list a.on,
html[data-v="typography"] #submenu .submenu_list a:hover,
html[data-v="typography"] #submenu .submenu_list a.on,
html[data-v="monoline"] #submenu .submenu_list a:hover,
html[data-v="monoline"] #submenu .submenu_list a.on,
html[data-v="parallax"] #submenu .submenu_list a:hover,
html[data-v="parallax"] #submenu .submenu_list a.on,
html[data-v="luxury"] #submenu .submenu_list a:hover,
html[data-v="luxury"] #submenu .submenu_list a.on,
html[data-v="timeline"] #submenu .submenu_list a:hover,
html[data-v="timeline"] #submenu .submenu_list a.on,
html[data-v="editorial"] #submenu .submenu_list a:hover,
html[data-v="editorial"] #submenu .submenu_list a.on{
color: var(--a1) !important;
opacity: 1 !important;
}
/* cinema .on 탭: 배경=var(--a1)이므로 텍스트는 a1t로 대비 필요 (Section 48 color:var(--a1) 덮어쓰기) */
html[data-v="cinema"] #submenu .submenu_list a.on {
color: var(--a1t, #fff) !important;
}
/* mosaic/parallax .on 탭: 배경=var(--a1)이므로 텍스트는 a1t로 대비 필요 (color:var(--a1) 덮어쓰기) */
html[data-v="mosaic"] #submenu .submenu_list a.on,
html[data-v="parallax"] #submenu .submenu_list a.on {
color: var(--a1t, #fff) !important;
}
/* ── 49. sub_bc 텍스트 색상 15종 팔레트 대응 ── */
/* 어두운 배경(var(--p)) 변형 — var(--ht)로 팔레트 자동 대응 */
html[data-v="fullhero"] .sub_bc_btn,
html[data-v="fullhero"] .sub_bc_link,
html[data-v="cinema"] .sub_bc_btn,
html[data-v="cinema"] .sub_bc_link,
html[data-v="splithero"] .sub_bc_btn,
html[data-v="splithero"] .sub_bc_link,
html[data-v="minimal"] .sub_bc_btn,
html[data-v="minimal"] .sub_bc_link{
color: var(--a1) !important;
background: transparent !important;
border: 1px solid rgba(128,128,128,.2) !important;
}
/* 밝은 배경(#fff) 변형 — 항상 진한색 */
html[data-v="mosaic"] .sub_bc_btn,
html[data-v="mosaic"] .sub_bc_link,
html[data-v="typography"] .sub_bc_btn,
html[data-v="typography"] .sub_bc_link,
html[data-v="monoline"] .sub_bc_btn,
html[data-v="monoline"] .sub_bc_link,
html[data-v="parallax"] .sub_bc_btn,
html[data-v="parallax"] .sub_bc_link,
html[data-v="luxury"] .sub_bc_btn,
html[data-v="luxury"] .sub_bc_link,
html[data-v="timeline"] .sub_bc_btn,
html[data-v="timeline"] .sub_bc_link,
html[data-v="editorial"] .sub_bc_btn,
html[data-v="editorial"] .sub_bc_link{
color: #222 !important;
background: #fafafa !important;
border: 1px solid #e5e7eb !important;
}
/* ══════════════════════════════════════════════════════════════════
── 51. wz-info-table 15종 완전 재설계 ──
기준: html[data-cv="v5"] 공통 베이스 → 변형별 override
══════════════════════════════════════════════════════════════════ */
/* 공통 베이스 */
/* ── fullhero: 좌측 컬러바 언더라인형 ── */
/* ── cinema: 다크 배경 + 대문자 레이블 ── */
/* ── splithero: 좌측바 그라데이션 강조 ── */
/* ── mosaic: 둥근 카드형 셀 ── */
/* ── typography: 미니멀 라인 + 대문자 ── */
/* ── monoline: 점선 구분 ── */
/* ── parallax: 그림자 카드형 ── */
/* ── luxury: 골드 포인트 언더라인 ── */
/* ── minimal: 우측정렬 + 투명 ── */
/* ── timeline: 좌측 점 타임라인형 ── */
/* ── editorial: 굵은 타이포 + 하단 라인 ── */
/* ── 51-R. wz-info-table 모바일 반응형 ── */
@media (max-width: 768px) {
/* mosaic: 반응형에서 border-radius 유지 */
/* typography/monoline: 반응형에서 패딩 보정 */
/* minimal: 우측정렬 모바일에서 해제 */
/* timeline: 가상요소 위치 보정 */
}
/* ══════════════════════════════════════════════════════════════════
── 52. 입지환경·평면안내·방문예약 폼 15종 완전 재설계 ──
══════════════════════════════════════════════════════════════════ */
/* ──────────────────────────────────────────────────────────────────
52-A. .wz-loc-cat 입지환경 카드 — 15종 시그니처 처리
──────────────────────────────────────────────────────────────────
이미 라운드3/5에서 기본 룰이 있음 — 이 섹션은 추가 내부 간격,
내부 리스트(.wz-loc-cat-list), 카테고리 레이블 색·폰트를 완성함
────────────────────────────────────────────────────────────────── */
/* ── VARIANT: 01 fullhero ── */
html[data-v="fullhero"] .wz-loc-cat {
overflow: hidden !important;
border-top: 4px solid var(--a1) !important;
border-radius: 0 !important;
background: #fff !important;
box-shadow: 0 6px 28px var(--a1-20) !important;
transition: box-shadow .3s !important;
padding: 20px;
}
html[data-v="fullhero"] .wz-loc-cat:hover {
box-shadow: 0 12px 40px var(--a1-30) !important;
}
html[data-v="fullhero"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 12px 20px 16px !important;
}
html[data-v="fullhero"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: baseline !important;
padding: 7px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="fullhero"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="fullhero"] .wz-loc-cat-list .wz-loc-name {
font-size: .9rem !important;
font-weight: 600 !important;
color: var(--p) !important;
flex: 1 !important;
}
html[data-v="fullhero"] .wz-loc-cat-list .wz-loc-dist {
font-size: .82rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
white-space: nowrap !important;
background: var(--a1-12) !important;
padding: 2px 8px !important;
border-radius: 2px !important;
}
/* ── VARIANT: 02 cinema ── */
html[data-v="cinema"] .wz-loc-cat {
overflow: hidden !important;
border: 1px solid var(--a1-30) !important;
border-radius: 0 !important;
background: #fff !important;
}
html[data-v="cinema"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 8px 24px 20px !important;
}
html[data-v="cinema"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 8px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="cinema"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="cinema"] .wz-loc-cat-list .wz-loc-name {
font-size: 1.1rem !important;
font-weight: 300 !important;
color: var(--p) !important;
letter-spacing: 1px !important;
flex: 1 !important;
}
html[data-v="cinema"] .wz-loc-cat-list .wz-loc-dist {
font-size: .8rem !important;
font-weight: 300 !important;
color: var(--a1) !important;
letter-spacing: 2px !important;
white-space: nowrap !important;
}
/* ── VARIANT: 03 splithero ── */
html[data-v="splithero"] .wz-loc-cat {
overflow: hidden !important;
border-left: 6px solid var(--a1) !important;
border-radius: 0 0 4px 0 !important;
background: #fff !important;
box-shadow: 0 4px 20px var(--a1-12) !important;
}
html[data-v="splithero"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 10px 20px 18px !important;
}
html[data-v="splithero"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 7px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="splithero"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="splithero"] .wz-loc-cat-list .wz-loc-name {
font-size: .9rem !important;
font-weight: 700 !important;
color: var(--p) !important;
flex: 1 !important;
}
html[data-v="splithero"] .wz-loc-cat-list .wz-loc-dist {
font-size: .82rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
white-space: nowrap !important;
}
/* ── VARIANT: 04 mosaic ── */
html[data-v="mosaic"] .wz-loc-cat {
overflow: hidden !important;
border-radius: 14px !important;
background: #fff !important;
box-shadow: 0 8px 28px rgba(0,0,0,.09) !important;
transition: transform .3s, box-shadow .3s !important;
}
html[data-v="mosaic"] .wz-loc-cat:hover {
transform: translateY(-4px) !important;
box-shadow: 0 16px 40px rgba(0,0,0,.14) !important;
}
html[data-v="mosaic"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 12px 20px 18px !important;
}
html[data-v="mosaic"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 7px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="mosaic"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="mosaic"] .wz-loc-cat-list .wz-loc-name {
font-size: 1.1rem !important;
font-weight: 600 !important;
color: var(--p) !important;
flex: 1 !important;
}
html[data-v="mosaic"] .wz-loc-cat-list .wz-loc-dist {
font-size: .8rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
background: var(--a3) !important;
padding: 3px 10px !important;
border-radius: 999px !important;
white-space: nowrap !important;
}
/* ── VARIANT: 05 typography ── */
html[data-v="typography"] .wz-loc-cat {
overflow: hidden !important;
border: none !important;
border-top: 1px solid var(--a1-30) !important;
border-radius: 0 !important;
background: #fff !important;
box-shadow: none !important;
padding: 35px 10px 0;
}
html[data-v="typography"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 16px 0 24px !important;
}
html[data-v="typography"] .wz-loc-cat-list li {
display: grid !important;
grid-template-columns: 1fr auto !important;
align-items: baseline !important;
padding: 10px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 12px !important;
}
html[data-v="typography"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="typography"] .wz-loc-cat-list .wz-loc-name {
font-size: 1rem !important;
font-weight: 300 !important;
color: var(--p) !important;
letter-spacing: -.3px !important;
}
html[data-v="typography"] .wz-loc-cat-list .wz-loc-dist {
font-size: 1.2rem !important;
font-weight: 600 !important;
color: var(--a2) !important;
letter-spacing: 3px !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
/* ── VARIANT: 07 monoline ── */
html[data-v="monoline"] .wz-loc-cat {
overflow: hidden !important;
border: none !important;
border-bottom: 1px solid var(--a1-30) !important;
border-radius: 0 !important;
background: #fff !important;
box-shadow: none !important;
text-align: center !important;
}
html[data-v="monoline"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 8px 28px 24px !important;
text-align: left !important;
}
html[data-v="monoline"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 8px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="monoline"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="monoline"] .wz-loc-cat-list .wz-loc-name {
font-size: 1.1rem !important;
font-weight: 300 !important;
color: var(--p) !important;
letter-spacing: .5px !important;
flex: 1 !important;
}
html[data-v="monoline"] .wz-loc-cat-list .wz-loc-dist {
font-size: 1.2rem !important;
font-weight: 300 !important;
color: var(--a2) !important;
letter-spacing: 3px !important;
white-space: nowrap !important;
}
/* ── VARIANT: 08 parallax ── */
html[data-v="parallax"] .wz-loc-cat {
overflow: hidden !important;
border-radius: 10px !important;
background: #fff !important;
box-shadow: 0 12px 40px var(--a1-20) !important;
transition: transform .3s, box-shadow .3s !important;
}
html[data-v="parallax"] .wz-loc-cat:hover {
transform: translateY(-6px) !important;
box-shadow: 0 20px 52px var(--a1-30) !important;
}
html[data-v="parallax"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 10px 20px 20px !important;
}
html[data-v="parallax"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 8px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="parallax"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="parallax"] .wz-loc-cat-list .wz-loc-name {
font-size: .9rem !important;
font-weight: 700 !important;
color: var(--p) !important;
flex: 1 !important;
}
html[data-v="parallax"] .wz-loc-cat-list .wz-loc-dist {
font-size: .82rem !important;
font-weight: 800 !important;
color: var(--a1) !important;
white-space: nowrap !important;
text-shadow: 1px 1px 0 var(--a1-20) !important;
}
/* ── VARIANT: 09 luxury ── */
html[data-v="luxury"] .wz-loc-cat {
overflow: hidden !important;
border-left: 3px solid var(--a1) !important;
background: #fff !important;
box-shadow: 0 2px 14px var(--a1-12) !important;
border-radius: 8px;
padding: 20px;
}
html[data-v="luxury"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 10px 20px 18px 24px !important;
}
html[data-v="luxury"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 7px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="luxury"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="luxury"] .wz-loc-cat-list .wz-loc-name {
font-size: .9rem !important;
font-weight: 500 !important;
color: var(--p) !important;
flex: 1 !important;
}
html[data-v="luxury"] .wz-loc-cat-list .wz-loc-dist {
font-size: .82rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
white-space: nowrap !important;
border-bottom: 1px solid var(--a1) !important;
padding-bottom: 1px !important;
}
/* ── VARIANT: 10 minimal ── */
html[data-v="minimal"] .wz-loc-cat {
overflow: hidden !important;
border-right: 3px solid var(--a1) !important;
border-left: none !important;
border-radius: 0 !important;
background: #fff !important;
box-shadow: 0 2px 14px var(--a1-12) !important;
}
html[data-v="minimal"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 10px 24px 18px 20px !important;
text-align: right !important;
}
html[data-v="minimal"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 7px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="minimal"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="minimal"] .wz-loc-cat-list .wz-loc-name {
font-size: .9rem !important;
font-weight: 500 !important;
color: var(--p) !important;
flex: 1 !important;
text-align: left !important;
}
html[data-v="minimal"] .wz-loc-cat-list .wz-loc-dist {
font-size: .82rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
white-space: nowrap !important;
}
/* ── VARIANT: 12 timeline ── */
html[data-v="timeline"] .wz-loc-cat {
overflow: hidden !important;
border-radius: 8px !important;
background: #fff !important;
box-shadow: 0 4px 18px var(--a1-12) !important;
position: relative !important;
padding: 30px;
}
}
html[data-v="timeline"] .wz-loc-cat::before {
content: '' !important;
position: absolute !important;
left: 0 !important;
top: 0 !important;
bottom: 0 !important;
width: 3px !important;
background: var(--a1) !important;
}
html[data-v="timeline"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 10px 20px 18px 22px !important;
position: relative !important;
}
html[data-v="timeline"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 7px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
position: relative !important;
}
html[data-v="timeline"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="timeline"] .wz-loc-cat-list .wz-loc-name {
font-size: .9rem !important;
font-weight: 600 !important;
color: var(--p) !important;
flex: 1 !important;
}
html[data-v="timeline"] .wz-loc-cat-list .wz-loc-dist {
font-size: .82rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
white-space: nowrap !important;
padding: 2px 8px !important;
background: var(--a1-12) !important;
border-radius: 4px !important;
}
/* ── VARIANT: 15 editorial ── */
html[data-v="editorial"] .wz-loc-wrap{ grid-template-columns:auto;}
html[data-v="editorial"] .wz-loc-cat {
overflow: hidden !important;
border: none !important;
border-top: 3px solid var(--p) !important;
border-bottom: 1px solid var(--a1-30) !important;
border-radius: 0 !important;
background: #fff !important;
box-shadow: none !important;
padding: 15px;
}
html[data-v="editorial"] .wz-loc-cat-list {
list-style: none !important;
margin: 0 !important;
padding: 8px 0 20px !important;
}
html[data-v="editorial"] .wz-loc-cat-list li {
display: flex !important;
justify-content: space-between !important;
align-items: baseline !important;
padding: 9px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
gap: 8px !important;
}
html[data-v="editorial"] .wz-loc-cat-list li:last-child {
border-bottom: none !important;
}
html[data-v="editorial"] .wz-loc-cat-list .wz-loc-name {
font-size: .95rem !important;
font-weight: 800 !important;
color: var(--p) !important;
letter-spacing: -.3px !important;
flex: 1 !important;
}
html[data-v="editorial"] .wz-loc-cat-list .wz-loc-dist {
font-size: .82rem !important;
font-weight: 600 !important;
color: var(--a2) !important;
white-space: nowrap !important;
letter-spacing: 1px !important;
text-transform: uppercase !important;
}
/* ──────────────────────────────────────────────────────────────────
52-B. .sub_premium 평면안내/단지안내 dl — 15종 dt/dd 완전 재설계
──────────────────────────────────────────────────────────────────
dt = "PREMIUM 01" 타입 번호 표현 방식
dd strong = 타입명, dd span = 면적
────────────────────────────────────────────────────────────────── */
/* ── VARIANT: 01 fullhero ── */
html[data-v="fullhero"] .sub_premium ul li dl {
display: grid !important;
grid-template-columns: 100px 1fr !important;
gap: 0 36px !important;
padding: 40px 20px !important;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.0), rgba(245, 242, 239, 0.35)) !important;
align-items: start !important;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.5) !important;
border-radius: 0 0 30px !important;
position: relative !important;
}
html[data-v="fullhero"] .sub_premium ul li dl::before {
content: '' !important;
position: absolute !important;
inset: 0 !important;
border-radius: inherit !important;
background: transparent !important;
pointer-events: none !important;
z-index: 1 !important;
}
html[data-v="fullhero"] .sub_premium ul li dl dt {
font-size: 3.2rem !important;
font-weight: 200 !important;
color: var(--a1) !important;
letter-spacing: -2px !important;
line-height: 1 !important;
padding-top: 4px !important;
opacity: .7 !important;
}
html[data-v="fullhero"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
border-left: 3px solid var(--a1) !important;
padding-left: 18px !important;
}
html[data-v="fullhero"] .sub_premium ul li dl dd strong {
font-size: 1.4rem !important;
font-weight: 800 !important;
color: var(--p) !important;
line-height: 1.3 !important;
}
html[data-v="fullhero"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
font-weight: 400 !important;
}
/* ── VARIANT: 02 cinema ── */
html[data-v="cinema"] .sub_premium ul li dl {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 0 !important;
padding: 0 !important;
margin-bottom: 16px !important;
border-bottom: none !important;
border-radius: 0 !important;
background: var(--a3) !important;
border: 1px solid var(--a1-30) !important;
border-top: 3px solid var(--a1) !important;
overflow: hidden !important;
}
html[data-v="cinema"] .sub_premium ul li dl dt {
font-size: 1.2rem !important;
font-weight: 300 !important;
color: var(--a1) !important;
letter-spacing: 6px !important;
text-transform: uppercase !important;
padding: 16px 24px 10px !important;
background: var(--p) !important;
display: block !important;
}
html[data-v="cinema"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
padding: 16px 24px 20px !important;
}
html[data-v="cinema"] .sub_premium ul li dl dd strong {
font-size: 1.25rem !important;
font-weight: 300 !important;
color: var(--p) !important;
letter-spacing: 1px !important;
}
html[data-v="cinema"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
font-weight: 400 !important;
}
/* ── VARIANT: 03 splithero ── */
html[data-v="splithero"] .sub_premium ul li dl {
display: flex !important;
flex-direction: row !important;
gap: 0 !important;
padding: 0 !important;
margin-bottom: 14px !important;
border-bottom: none !important;
border-radius: 0 2px 2px 0 !important;
background: #fff !important;
box-shadow: 0 3px 14px var(--a1-12) !important;
overflow: hidden !important;
align-items: stretch !important;
}
html[data-v="splithero"] .sub_premium ul li dl dt {
background: var(--a1) !important;
color: var(--a1t, #111) !important;
writing-mode: vertical-rl !important;
text-orientation: mixed !important;
font-size: 1.2rem !important;
font-weight: 700 !important;
letter-spacing: 3px !important;
text-transform: uppercase !important;
padding: 20px 10px !important;
min-width: 40px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
html[data-v="splithero"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
padding: 22px 24px !important;
flex: 1 !important;
}
html[data-v="splithero"] .sub_premium ul li dl dd strong {
font-size: 1.25rem !important;
font-weight: 800 !important;
color: var(--p) !important;
line-height: 1.3 !important;
}
html[data-v="splithero"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
}
/* ── VARIANT: 04 mosaic ── */
html[data-v="mosaic"] .sub_premium ul li dl {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
padding: 28px 24px !important;
margin-bottom: 0 !important;
border-bottom: none !important;
border-radius: 12px !important;
background: #fff !important;
box-shadow: 0 6px 24px rgba(0,0,0,.07) !important;
border-top: 4px solid var(--a1) !important;
transition: transform .3s, box-shadow .3s !important;
}
html[data-v="mosaic"] .sub_premium ul li dl:hover {
transform: translateY(-4px) !important;
box-shadow: 0 14px 36px rgba(0,0,0,.12) !important;
}
html[data-v="mosaic"] .sub_premium ul li dl dt {
font-size: .72rem !important;
font-weight: 700 !important;
color: var(--a1) !important;
letter-spacing: 3px !important;
text-transform: uppercase !important;
margin-bottom: 10px !important;
display: inline-block !important;
background: var(--a1-12) !important;
padding: 3px 10px !important;
border-radius: 999px !important;
}
html[data-v="mosaic"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
padding: 0 !important;
}
html[data-v="mosaic"] .sub_premium ul li dl dd strong {
font-size: 1.2rem !important;
font-weight: 700 !important;
color: var(--p) !important;
}
html[data-v="mosaic"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
}
/* ── VARIANT: 05 typography ── */
html[data-v="typography"] .sub_premium ul li dl {
display: grid !important;
grid-template-columns: 160px 1fr !important;
gap: 0 48px !important;
padding: 56px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
border-radius: 0 !important;
background: transparent !important;
align-items: start !important;
}
html[data-v="typography"] .sub_premium ul li dl dt {
font-size: 5rem !important;
font-weight: 100 !important;
color: var(--a1) !important;
letter-spacing: -4px !important;
line-height: .9 !important;
opacity: .6 !important;
}
html[data-v="typography"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 8px 0 !important;
padding: 0 !important;
border: none !important;
padding-top: 8px !important;
}
html[data-v="typography"] .sub_premium ul li dl dd strong {
font-size: 1.6rem !important;
font-weight: 300 !important;
color: var(--p) !important;
letter-spacing: -.5px !important;
line-height: 1.3 !important;
}
html[data-v="typography"] .sub_premium ul li dl dd span {
font-size: .9rem !important;
color: var(--text-sub, #666) !important;
font-weight: 300 !important;
letter-spacing: 2px !important;
}
/* ── VARIANT: 07 monoline ── */
html[data-v="monoline"] .sub_premium ul li dl {
display: grid !important;
grid-template-columns: 100px 1fr !important;
gap: 0 32px !important;
padding: 30px 15px !important;
border-bottom: 1px solid var(--a1-12) !important;
border-radius: 0 !important;
background: transparent !important;
align-items: start !important;
}
html[data-v="monoline"] .sub_premium ul li dl dt {
font-size: 3rem !important;
font-weight: 300 !important;
color: var(--a2) !important;
letter-spacing: 6px !important;
text-transform: uppercase !important;
padding-top: 8px !important;
line-height: 1.6 !important;
}
html[data-v="monoline"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
padding: 0 !important;
}
html[data-v="monoline"] .sub_premium ul li dl dd strong {
font-size: 1.25rem !important;
font-weight: 400 !important;
color: var(--p) !important;
letter-spacing: .5px !important;
}
html[data-v="monoline"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
font-weight: 300 !important;
letter-spacing: 2px !important;
}
/* ── VARIANT: 08 parallax ── */
html[data-v="parallax"] .sub_premium ul li dl {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
padding: 32px 28px !important;
margin-bottom: 16px !important;
border-bottom: none !important;
border-radius: 10px !important;
background: var(--a3) !important;
box-shadow: 0 8px 28px var(--a1-12) !important;
transition: transform .3s, box-shadow .3s !important;
border-left: 4px solid var(--a1) !important;
}
html[data-v="parallax"] .sub_premium ul li dl:hover {
transform: translateY(-6px) !important;
box-shadow: 0 18px 48px var(--a1-20) !important;
}
html[data-v="parallax"] .sub_premium ul li dl dt {
font-size: 2.8rem !important;
font-weight: 800 !important;
color: var(--a1) !important;
line-height: 1 !important;
margin-bottom: 12px !important;
text-shadow: 2px 2px 0 var(--a1-20) !important;
}
html[data-v="parallax"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
padding: 0 !important;
}
html[data-v="parallax"] .sub_premium ul li dl dd strong {
font-size: 1.25rem !important;
font-weight: 700 !important;
color: var(--p) !important;
}
html[data-v="parallax"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
}
/* ── VARIANT: 09 luxury ── */
html[data-v="luxury"] .sub_premium ul li dl {
display: grid !important;
grid-template-columns: 72px 1fr !important;
gap: 0 28px !important;
padding: 30px 15px !important;
border-bottom: 1px solid var(--a1-12) !important;
border-radius: 0 !important;
background: transparent !important;
align-items: center !important;
border-left: 2px solid var(--a1) !important;
}
html[data-v="luxury"] .sub_premium ul li dl dt {
background: var(--a1) !important;
color: var(--a1t, #111) !important;
width: 56px !important;
height: 56px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 1.5rem !important;
font-weight: 800 !important;
border-radius: 2px !important;
flex-shrink: 0 !important;
}
html[data-v="luxury"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 5px 0 !important;
padding: 0 !important;
}
html[data-v="luxury"] .sub_premium ul li dl dd strong {
font-size: 1.2rem !important;
font-weight: 700 !important;
color: var(--p) !important;
}
html[data-v="luxury"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
}
/* ── VARIANT: 10 minimal ── */
html[data-v="minimal"] .sub_premium ul li dl {
display: grid !important;
grid-template-columns: 1fr 72px !important;
gap: 0 28px !important;
padding: 32px 24px 32px 0 !important;
border-bottom: 1px solid var(--a1-12) !important;
border-radius: 0 !important;
background: transparent !important;
align-items: center !important;
border-right: 2px solid var(--a1) !important;
border-left: none !important;
}
html[data-v="minimal"] .sub_premium ul li dl dt {
order: 2 !important;
background: var(--a1) !important;
color: var(--a1t, #111) !important;
width: 56px !important;
height: 56px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 1.4rem !important;
font-weight: 800 !important;
border-radius: 2px !important;
flex-shrink: 0 !important;
}
html[data-v="minimal"] .sub_premium ul li dl dd {
order: 1 !important;
display: flex !important;
flex-direction: column !important;
gap: 5px 0 !important;
padding: 0 0 0 20px !important;
}
html[data-v="minimal"] .sub_premium ul li dl dd strong {
font-size: 1.2rem !important;
font-weight: 700 !important;
color: var(--p) !important;
}
html[data-v="minimal"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
}
/* ── VARIANT: 12 timeline ── */
html[data-v="timeline"] .sub_premium ul li dl {
display: block !important;
padding: 25px 50px !important;
border-bottom: 1px solid var(--a1-12) !important;
border-radius: 0 !important;
background: transparent !important;
position: relative !important;
}
html[data-v="timeline"] .sub_premium ul li dl dt {
position: absolute !important;
left: -52px !important;
top: 26px !important;
width: 40px !important;
height: 40px !important;
border-radius: 50% !important;
background: var(--a1) !important;
color: var(--a1t, #fff) !important;
font-size: .9rem !important;
font-weight: 700 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 0 !important;
letter-spacing: 0 !important;
text-transform: none !important;
}
html[data-v="timeline"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
padding: 0 !important;
}
html[data-v="timeline"] .sub_premium ul li dl dd strong {
font-size: 1.2rem !important;
font-weight: 700 !important;
color: var(--p) !important;
}
html[data-v="timeline"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--text-sub, #666) !important;
}
/* ── VARIANT: 15 editorial ── */
html[data-v="editorial"] .sub_premium ul li dl {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
padding: 36px 28px !important;
border-radius: 0 !important;
background: #fff !important;
border-top: 3px solid var(--p) !important;
border-bottom: 1px solid var(--a1-20) !important;
box-shadow: none !important;
margin-bottom: 0 !important;
}
html[data-v="editorial"] .sub_premium ul li dl dt {
font-size: 5.5rem !important;
font-weight: 900 !important;
color: var(--a1) !important;
letter-spacing: -5px !important;
line-height: .85 !important;
margin-bottom: 16px !important;
}
html[data-v="editorial"] .sub_premium ul li dl dd {
display: flex !important;
flex-direction: column !important;
gap: 6px 0 !important;
padding: 0 !important;
border-top: 1px solid var(--a1-12) !important;
padding-top: 14px !important;
}
html[data-v="editorial"] .sub_premium ul li dl dd strong {
font-size: 1.5rem !important;
font-weight: 900 !important;
color: var(--p) !important;
letter-spacing: -1px !important;
}
html[data-v="editorial"] .sub_premium ul li dl dd span {
font-size: 1.1rem !important;
color: var(--a2) !important;
font-weight: 600 !important;
letter-spacing: 2px !important;
text-transform: uppercase !important;
}
/* sub_premium 그리드 레이아웃 — 변형별 컬럼 수 */
html[data-v="mosaic"] .sub_premium ul{
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 30px !important;
}
html[data-v="editorial"] .sub_premium ul,
html[data-v="typography"] .sub_premium ul,
html[data-v="cinema"] .sub_premium ul {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 30px !important;
}
/* ──────────────────────────────────────────────────────────────────
52-C. #fwrite input / select / textarea 입력 필드 — 15종 완전 재설계
──────────────────────────────────────────────────────────────────
라운드9에서 #fwrite 박스 레이아웃은 완성됨.
여기서는 필드 자체(배경·보더·포커스·placeholder·폰트)만 덮어씀.
────────────────────────────────────────────────────────────────── */
/* ── VARIANT: 01 fullhero — 흰 배경 + 실선 보더 + 직각 ── */
html[data-v="fullhero"] #fwrite input[type="text"],
html[data-v="fullhero"] #fwrite input[type="tel"],
html[data-v="fullhero"] #fwrite input[type="email"],
html[data-v="fullhero"] #fwrite textarea {
background: #fff !important;
border: 1px solid var(--a1-20) !important;
border-bottom: 2px solid var(--a1-30) !important;
border-radius: 0 !important;
padding: 0 16px !important;
color: var(--p) !important;
font-size: .95rem !important;
transition: border-color .2s, box-shadow .2s !important;
box-shadow: none !important;
}
html[data-v="fullhero"] #fwrite input:focus:focus,
html[data-v="fullhero"] #fwrite textarea:focus {
border-bottom-color: var(--a1) !important;
outline: none !important;
box-shadow: 0 4px 12px var(--a1-12) !important;
}
html[data-v="fullhero"] #fwrite input::placeholder,
html[data-v="fullhero"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
font-weight: 400 !important;
}
/* ── VARIANT: 02 cinema — 흰 배경 + 언더라인 + 검정 텍스트 ── */
html[data-v="cinema"] #fwrite input[type="text"],
html[data-v="cinema"] #fwrite input[type="tel"],
html[data-v="cinema"] #fwrite input[type="email"],
html[data-v="cinema"] #fwrite textarea {
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(0,0,0,.15) !important;
border-radius: 0 !important;
padding: 14px 4px !important;
color: #000 !important;
font-size: .95rem !important;
font-weight: 300 !important;
letter-spacing: .5px !important;
transition: border-color .2s !important;
box-shadow: none !important;
}
html[data-v="cinema"] #fwrite select {
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(0,0,0,.15) !important;
border-radius: 0 !important;
padding: 0 36px 0 8px !important;
font-weight: 300 !important;
letter-spacing: .5px !important;
box-shadow: none !important;
}
html[data-v="cinema"] #fwrite input:focus:focus,
html[data-v="cinema"] #fwrite textarea:focus {
border-bottom-color: var(--a1) !important;
outline: none !important;
}
html[data-v="cinema"] #fwrite input::placeholder,
html[data-v="cinema"] #fwrite textarea::placeholder {
color: rgba(0,0,0,.35) !important;
font-weight: 300 !important;
letter-spacing: 1px !important;
}
/* ── VARIANT: 03 splithero — 흰 카드 안 + 1px 라인 + 강조 포커스 ── */
html[data-v="splithero"] #fwrite input[type="text"],
html[data-v="splithero"] #fwrite input[type="tel"],
html[data-v="splithero"] #fwrite input[type="email"],
html[data-v="splithero"] #fwrite textarea {
background: #fff !important;
border: 1px solid var(--a1-20) !important;
border-radius: 2px !important;
padding: 13px 16px !important;
color: var(--p) !important;
font-size: .95rem !important;
font-weight: 500 !important;
transition: border-color .2s !important;
box-shadow: none !important;
}
html[data-v="splithero"] #fwrite input:focus:focus,
html[data-v="splithero"] #fwrite textarea:focus {
border-color: var(--a1) !important;
outline: none !important;
box-shadow: inset 3px 0 0 var(--a1) !important;
}
html[data-v="splithero"] #fwrite input::placeholder,
html[data-v="splithero"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
}
/* ── VARIANT: 04 mosaic — 둥근 라운드 필드 + 라이트 그레이 배경 ── */
html[data-v="mosaic"] #fwrite input[type="text"],
html[data-v="mosaic"] #fwrite input[type="tel"],
html[data-v="mosaic"] #fwrite input[type="email"],
html[data-v="mosaic"] #fwrite textarea {
background: var(--a3) !important;
border: 1px solid transparent !important;
border-radius: 10px !important;
padding: 14px 18px !important;
color: var(--p) !important;
font-size: .95rem !important;
transition: border-color .2s, background .2s !important;
box-shadow: none !important;
}
html[data-v="mosaic"] #fwrite input:focus:focus,
html[data-v="mosaic"] #fwrite textarea:focus {
background: #fff !important;
border-color: var(--a1) !important;
outline: none !important;
box-shadow: 0 0 0 3px var(--a1-12) !important;
}
html[data-v="mosaic"] #fwrite input::placeholder,
html[data-v="mosaic"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
}
/* ── VARIANT: 05 typography — 투명 배경 + 굵은 하단 라인 + 큰 폰트 ── */
html[data-v="typography"] #fwrite input[type="text"],
html[data-v="typography"] #fwrite input[type="tel"],
html[data-v="typography"] #fwrite input[type="email"],
html[data-v="typography"] #fwrite textarea {
background: transparent !important;
border: none !important;
border-bottom: 1px solid var(--p) !important;
border-radius: 0 !important;
padding: 18px 4px !important;
color: var(--p) !important;
font-size: 1.05rem !important;
font-weight: 300 !important;
letter-spacing: -.3px !important;
transition: border-color .2s !important;
box-shadow: none !important;
}
html[data-v="typography"] #fwrite input:focus:focus,
html[data-v="typography"] #fwrite textarea:focus {
border-bottom: 2px solid var(--a1) !important;
outline: none !important;
}
html[data-v="typography"] #fwrite input::placeholder,
html[data-v="typography"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
font-weight: 200 !important;
letter-spacing: 1px !important;
}
/* ── VARIANT: 07 monoline — 투명 + 중앙정렬 + 언더라인만 ── */
html[data-v="monoline"] #fwrite input[type="text"],
html[data-v="monoline"] #fwrite input[type="tel"],
html[data-v="monoline"] #fwrite input[type="email"],
html[data-v="monoline"] #fwrite textarea {
background: transparent !important;
border: none !important;
border-bottom: 1px solid var(--a1-30) !important;
border-radius: 0 !important;
padding: 13px 0 !important;
color: var(--p) !important;
font-size: .92rem !important;
font-weight: 300 !important;
text-align: center !important;
letter-spacing: .5px !important;
transition: border-color .2s !important;
box-shadow: none !important;
}
html[data-v="monoline"] #fwrite input:focus:focus,
html[data-v="monoline"] #fwrite textarea:focus {
border-bottom-color: var(--a2) !important;
outline: none !important;
}
html[data-v="monoline"] #fwrite input::placeholder,
html[data-v="monoline"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
letter-spacing: 3px !important;
font-weight: 300 !important;
}
/* ── VARIANT: 08 parallax — 연한 배경 + 라운드 + 그림자 포커스 ── */
html[data-v="parallax"] #fwrite input[type="text"],
html[data-v="parallax"] #fwrite input[type="tel"],
html[data-v="parallax"] #fwrite input[type="email"],
html[data-v="parallax"] #fwrite textarea {
background: var(--a3) !important;
border: 1px solid transparent !important;
border-radius: 8px !important;
padding: 14px 18px !important;
color: var(--p) !important;
font-size: .95rem !important;
font-weight: 500 !important;
transition: border-color .2s, box-shadow .2s !important;
box-shadow: none !important;
}
html[data-v="parallax"] #fwrite input:focus:focus,
html[data-v="parallax"] #fwrite textarea:focus {
border-color: var(--a1) !important;
outline: none !important;
box-shadow: 0 4px 16px var(--a1-20) !important;
}
html[data-v="parallax"] #fwrite input::placeholder,
html[data-v="parallax"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
}
/* ── VARIANT: 09 luxury — 실선 직각 + 포커스 좌측바 ── */
html[data-v="luxury"] #fwrite input[type="text"],
html[data-v="luxury"] #fwrite input[type="tel"],
html[data-v="luxury"] #fwrite input[type="email"],
html[data-v="luxury"] #fwrite textarea {
background: #f9fafb !important;
border: 1px solid var(--a1-20) !important;
border-left: 2px solid var(--a1-20) !important;
border-radius: 0 !important;
padding: 13px 16px !important;
color: var(--p) !important;
font-size: .95rem !important;
transition: border-color .2s !important;
box-shadow: none !important;
}
html[data-v="luxury"] #fwrite input:focus:focus,
html[data-v="luxury"] #fwrite textarea:focus {
border-left-color: var(--a1) !important;
border-color: var(--a1-20) !important;
border-left: 2px solid var(--a1) !important;
outline: none !important;
}
html[data-v="luxury"] #fwrite input::placeholder,
html[data-v="luxury"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
}
/* ── VARIANT: 10 minimal — 실선 직각 + 포커스 우측바 ── */
html[data-v="minimal"] #fwrite input[type="text"],
html[data-v="minimal"] #fwrite input[type="tel"],
html[data-v="minimal"] #fwrite input[type="email"],
html[data-v="minimal"] #fwrite textarea {
background: #f9fafb !important;
border: 1px solid var(--a1-20) !important;
border-right: 2px solid var(--a1-20) !important;
border-radius: 0 !important;
padding: 13px 16px !important;
color: var(--p) !important;
font-size: .95rem !important;
transition: border-color .2s !important;
box-shadow: none !important;
text-align: left !important;
}
html[data-v="minimal"] #fwrite input:focus:focus,
html[data-v="minimal"] #fwrite textarea:focus {
border-right-color: var(--a1) !important;
border-right: 2px solid var(--a1) !important;
outline: none !important;
}
html[data-v="minimal"] #fwrite input::placeholder,
html[data-v="minimal"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
}
/* ── VARIANT: 12 timeline — 둥근 필드 + 배경 + 라운드 포커스링 ── */
html[data-v="timeline"] #fwrite input[type="text"],
html[data-v="timeline"] #fwrite input[type="tel"],
html[data-v="timeline"] #fwrite input[type="email"],
html[data-v="timeline"] #fwrite textarea {
background: #f9fafb !important;
border: 1px solid var(--a1-20) !important;
border-radius: 10px !important;
padding: 14px 18px !important;
color: var(--p) !important;
font-size: .95rem !important;
transition: border-color .2s, box-shadow .2s !important;
box-shadow: none !important;
}
html[data-v="timeline"] #fwrite input:focus:focus,
html[data-v="timeline"] #fwrite textarea:focus {
border-color: var(--a1) !important;
outline: none !important;
box-shadow: 0 0 0 3px var(--a1-12) !important;
}
html[data-v="timeline"] #fwrite input::placeholder,
html[data-v="timeline"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
}
/* ── VARIANT: 15 editorial — 투명 + 굵은 하단 2px + 거대 폰트 ── */
html[data-v="editorial"] #fwrite input[type="text"],
html[data-v="editorial"] #fwrite input[type="tel"],
html[data-v="editorial"] #fwrite input[type="email"],
html[data-v="editorial"] #fwrite textarea {
background: transparent !important;
border: none !important;
border-bottom: 2px solid var(--p) !important;
border-radius: 0 !important;
padding: 14px 4px !important;
color: var(--p) !important;
font-size: 1rem !important;
font-weight: 700 !important;
letter-spacing: -.2px !important;
transition: border-color .2s !important;
box-shadow: none !important;
}
html[data-v="editorial"] #fwrite input:focus:focus,
html[data-v="editorial"] #fwrite textarea:focus {
border-bottom-color: var(--a1) !important;
outline: none !important;
}
html[data-v="editorial"] #fwrite input::placeholder,
html[data-v="editorial"] #fwrite textarea::placeholder {
color: var(--a1-30) !important;
font-weight: 300 !important;
letter-spacing: 2px !important;
}
/* ── 52-C-R. 공통 textarea 높이 보정 ── */
html[data-cv="v5"] #fwrite textarea {
resize: vertical !important;
line-height: 1.6 !important;
}
/* ── 52-R. 모바일 반응형 — 52 전체 ── */
@media (max-width: 768px) {
/* A: loc-cat 리스트 폰트 소폭 축소 */
html[data-cv="v5"] .wz-loc-cat-list li {
padding: 6px 0 !important;
}
html[data-cv="v5"] .wz-loc-cat-list .wz-loc-name {
font-size: .84rem !important;
}
html[data-cv="v5"] .wz-loc-cat-list .wz-loc-dist {
font-size: .76rem !important;
}
/* B: sub_premium 2열 그리드를 1열로 */
html[data-v="mosaic"] .sub_premium ul,
html[data-v="editorial"] .sub_premium ul,
html[data-v="typography"] .sub_premium ul,
html[data-v="cinema"] .sub_premium ul{
grid-template-columns: 1fr !important;
}
/* splithero 세로쓰기 dt 모바일 처리 */
html[data-v="splithero"] .sub_premium ul li dl {
flex-direction: column !important;
}
html[data-v="splithero"] .sub_premium ul li dl dt {
writing-mode: horizontal-tb !important;
text-orientation: mixed !important;
min-width: auto !important;
padding: 12px 18px 8px !important;
font-size: 2rem !important;
}
/* minimal dt/dd order 모바일 해제 */
html[data-v="minimal"] .sub_premium ul li dl {
grid-template-columns: 1fr !important;
padding: 24px 12px !important;
}
html[data-v="minimal"] .sub_premium ul li dl dt {
order: 1 !important;
width: 48px !important;
height: 48px !important;
}
html[data-v="minimal"] .sub_premium ul li dl dd {
order: 2 !important;
text-align: left !important;
}
/* timeline dt absolute는 모바일에서 static으로 */
html[data-v="timeline"] .sub_premium ul li dl dt {
position: static !important;
margin-bottom: 10px !important;
}
html[data-v="timeline"] .sub_premium ul {
padding-left: 0 !important;
}
html[data-v="timeline"] .sub_premium ul::before {
display: none !important;
}
/* C: 폼 필드 가로 여백 보정 */
html[data-v="fullhero"] #fwrite,
html[data-v="splithero"] #fwrite,
html[data-v="luxury"] #fwrite {
padding-left: 24px !important;
}
html[data-v="minimal"] #fwrite {
padding-right: 24px !important;
text-align: left !important;
}
html[data-v="minimal"] #fwrite label,
html[data-v="minimal"] #fwrite input[type="text"],
html[data-v="minimal"] #fwrite textarea {
text-align: left !important;
}
html[data-v="monoline"] #fwrite input[type="text"],
html[data-v="monoline"] #fwrite textarea {
text-align: left !important;
}
html[data-v="typography"] #fwrite {
padding-left: 20px !important;
padding-right: 20px !important;
}
}
/* ══════════════════════════════════════════════════════════════════
── 53. 종합 반응형 — 15종 완전 반응형 보강 ──
1200px / 860px / 768px / 640px
══════════════════════════════════════════════════════════════════
원칙:
- html[data-cv="v5"] = 15종 공통 변경
- html[data-v="VARIANT"] = 변형별 명시 변경
- 이미 존재하는 규칙(wz-loc-wrap 1col@768, mosaic wz-premium-wrap 1col@768,
quick 하단바@860, wz-info-table block@768)은 재선언하지 않음
- 데스크탑 레이아웃 대비 변화하는 것만 작성
══════════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════════
A. @media (max-width: 1200px) — 태블릿 가로 / 큰 노트북
══════════════════════════════════════════════════════════════════ */
@media (max-width: 1200px) {
/* ── A-1. 공통 컨테이너 너비 / 여백 ── */
html[data-cv="v5"] .wz-premium-wrap,
html[data-cv="v5"] .sub_premium { max-width: 100% !important; padding-left: 20px !important; padding-right: 20px !important; }
html[data-cv="v5"] header { padding: 0 24px !important; }
/* ── A-2. 헤더 패딩 변형별 축소 ── */
html[data-v="fullhero"] header { padding: 0 36px !important; }
html[data-v="cinema"] header { padding: 0 40px !important; }
html[data-v="splithero"] header { padding: 0 20px 0 36px !important; }
html[data-v="mosaic"] header { padding: 0 28px !important; }
html[data-v="typography"] header { padding: 0 48px !important; }
html[data-v="monoline"] header { padding: 0 28px !important; }
html[data-v="parallax"] header { padding: 0 32px !important; }
html[data-v="luxury"] header { padding: 0 20px 0 36px !important; }
html[data-v="minimal"] header { padding: 0 36px 0 20px !important; }
html[data-v="timeline"] header { padding: 0 32px !important; }
html[data-v="editorial"] header { padding: 0 20px !important; }
/* ── A-3. sub_title h2.tit01 폰트 축소 (변형별) ── */
/* typography / editorial / fullpage — 극대비 변형, 조금만 줄임 */
html[data-v="typography"] .sub_title > h2.tit01 { font-size: clamp(2.4rem, 5vw, 3.6rem) !important; }
html[data-v="editorial"] .sub_title > h2.tit01 { font-size: clamp(2.4rem, 4.5vw, 3.2rem) !important; }
html[data-v="cinema"] .sub_title > h2.tit01 { font-size: clamp(2rem, 3.8vw, 2.6rem) !important; }
/* 나머지 변형 — 2.2rem 상한 */
html[data-v="fullhero"] .sub_title > h2.tit01 { font-size: clamp(1.9rem, 3.5vw, 2.4rem) !important; }
html[data-v="splithero"] .sub_title > h2.tit01 { font-size: clamp(1.9rem, 3.5vw, 2.4rem) !important; }
html[data-v="mosaic"] .sub_title > h2.tit01 { font-size: clamp(1.9rem, 3.5vw, 2.4rem) !important; }
html[data-v="monoline"] .sub_title > h2.tit01 { font-size: clamp(1.8rem, 3.2vw, 2.2rem) !important; }
html[data-v="parallax"] .sub_title > h2.tit01 { font-size: clamp(1.9rem, 3.5vw, 2.4rem) !important; }
html[data-v="luxury"] .sub_title > h2.tit01 { font-size: clamp(1.9rem, 3.3vw, 2.3rem) !important; }
html[data-v="minimal"] .sub_title > h2.tit01 { font-size: clamp(1.9rem, 3.3vw, 2.3rem) !important; }
html[data-v="timeline"] .sub_title > h2.tit01 { font-size: clamp(1.8rem, 3.2vw, 2.2rem) !important; }
/* ── A-4. .wz-premium-wrap 패딩 축소 ── */
html[data-cv="v5"] .wz-premium-wrap { padding: 0 20px !important; }
/* cinema / noirpremium — 이미 큰 내부 패딩 있는 변형 */
html[data-v="cinema"] .wz-premium-wrap { padding: 16px 24px !important; }
/* ── A-5. 사업개요 테이블 overflow 처리 ── */
html[data-cv="v5"] #ctt { max-width: 100%; }
/* ── A-6. typography / editorial wz-blk-tit 글씨 축소 ── */
html[data-v="typography"] .wz-blk-tit { font-size: 2.4rem !important; }
html[data-v="editorial"] .wz-blk-tit { font-size: 2.2rem !important; }
/* ── A-7. editorial / typography sub_premium 좌측 외부 숫자 — 여백 축소 ── */
html[data-v="typography"] .sub_premium ul li dl { padding-left: 160px !important; }
html[data-v="editorial"] .sub_premium ul li dl { padding-left: 160px !important; }
html[data-v="editorial"] .sub_premium ul li dl dt { font-size: 4rem !important; }
html[data-v="typography"] .sub_premium ul li dl dt { font-size: 5.5rem !important; }
/* ── A-8. editorial .wz-premium-item 좌측 숫자 컬럼 축소 ── */
html[data-v="editorial"] .wz-premium-item { grid-template-columns: 100px 1fr !important; gap: 0 40px !important; }
html[data-v="editorial"] .wz-pm-num { font-size: 4rem !important; }
/* ── A-10. #fwrite 대형 패딩 변형 축소 ── */
html[data-v="typography"] #fwrite { padding: 60px 0 !important; }
html[data-v="editorial"] #fwrite { padding: 48px 0 !important; }
html[data-v="monoline"] #fwrite { padding: 48px 36px !important; }
html[data-v="cinema"] #fwrite { padding: 44px 36px !important; }
}
/* ══════════════════════════════════════════════════════════════════
B. @media (max-width: 860px) — 태블릿 / 큰 모바일
══════════════════════════════════════════════════════════════════ */
@media (max-width: 860px) {
/* ── B-1. 공통: sub_premium 2열/3열 → 1열 ── */
/* mosaic 2열 → 1열 */
html[data-v="mosaic"] .sub_premium ul li { flex: 1 1 100% !important; min-width: unset !important; width: 100% !important; }
/* parallax 3열 → 1열 */
html[data-v="parallax"] .sub_premium ul li { flex: 1 1 100% !important; min-width: unset !important; width: 100% !important; }
/* ── B-2. .wz-loc-wrap: 3열 → 2열 (이미 @media(max-width:900px)에서 적용됨, 860px에서 재확인) ── */
/* 추가로 1열 변형도 gap 줄임 */
html[data-v="typography"] .wz-loc-wrap,
html[data-v="monoline"] .wz-loc-wrap,
html[data-v="timeline"] .wz-loc-wrap,
html[data-v="editorial"] .wz-loc-wrap,
html[data-v="luxury"] .wz-loc-wrap,
html[data-v="minimal"] .wz-loc-wrap{ gap: 14px !important; }
/* ── B-3. .wz-info-table-wrap / #ctt 테이블 overflow ── */
/* ── B-4. splithero wz-premium 모바일 ── */
html[data-v="splithero"] .wz-premium-item { grid-template-columns: 48px 1fr !important; }
html[data-v="splithero"] .wz-pm-num { font-size: 1rem !important; }
/* ── B-5. header 패딩 전반 축소 ── */
html[data-cv="v5"] header { padding: 0 16px !important; }
html[data-v="typography"] header{ padding: 0 24px !important; }
/* ── B-6. sub_bg 모바일 200px 통일 ── */
html[data-cv="v5"] .sub_bg { min-height:200px !important; height:200px !important; }
/* ── B-7. editorial / typography wz-premium-item 그리드 붕괴 방지 ── */
html[data-v="editorial"] .wz-premium-item { grid-template-columns: 80px 1fr !important; gap: 0 24px !important; }
html[data-v="editorial"] .wz-pm-num { font-size: 3.2rem !important; }
html[data-v="typography"] .wz-premium-item { grid-template-columns: 100px 1fr !important; gap: 0 32px !important; }
html[data-v="typography"] .wz-pm-num { font-size: 4.5rem !important; }
/* editorial 홈페이지 헤드라인 */
html[data-v="editorial"][data-index] .main_title h2 { font-size:2rem !important; line-height:1.3 !important; }
html[data-v="editorial"][data-index] .main_title p { font-size:.9rem !important; line-height:1.6 !important; }
html[data-v="editorial"][data-index] .wz-premium-item { grid-template-columns:1fr !important; gap:16px !important; }
html[data-v="editorial"][data-index] .wz-premium-item .wz-pm-num { font-size:2.5rem !important; }
html[data-v="editorial"][data-index] .wz-premium-item .wz-pm-title { font-size:1rem !important; }
/* ── B-8. luxury / minimal — 외부 숫자 겹침 방지 ── */
html[data-v="luxury"] .sub_premium ul li { padding-left: 64px !important; }
html[data-v="minimal"] .sub_premium ul li { padding-right: 64px !important; }
html[data-v="luxury"] .sub_premium ul li dl dt { font-size: 2rem !important; }
html[data-v="minimal"] .sub_premium ul li dl dt { font-size: 1.1rem !important; }
/* ── B-10. fullhero sub_premium — 세로형 (dt 위 / dd 아래) ── */
html[data-v="fullhero"] .sub_premium ul li dl { grid-template-columns: 1fr !important; gap: 8px 0 !important; }
html[data-v="fullhero"] .sub_premium ul li dl dt { position: static !important; font-size: 2.4rem !important; opacity: .35 !important; display: block !important; line-height: 1 !important; }
html[data-v="fullhero"] .sub_premium ul li dl dd { border-left: none !important; padding-left: 0 !important; border-top: 3px solid var(--a1) !important; padding-top: 10px !important; }
/* ── B-11. sub_title 여백 축소 ── */
html[data-v="fullhero"] .sub_title { padding: 56px 0 40px !important; }
html[data-v="cinema"] .sub_title { padding: 64px 0 48px !important; }
html[data-v="splithero"] .sub_title { padding: 56px 0 40px !important; }
html[data-v="mosaic"] .sub_title { padding: 56px 0 40px !important; }
html[data-v="typography"] .sub_title { padding: 72px 0 48px !important; }
html[data-v="monoline"] .sub_title { padding: 64px 0 40px !important; }
html[data-v="parallax"] .sub_title { padding: 56px 0 40px !important; }
html[data-v="luxury"] .sub_title { padding: 56px 0 40px !important; padding-left: 48px !important; }
html[data-v="minimal"] .sub_title { padding: 56px 0 40px !important; padding-right: 48px !important; }
html[data-v="timeline"] .sub_title { padding: 56px 0 40px !important; padding-left: 36px !important; }
html[data-v="editorial"] .sub_title { padding: 56px 0 40px !important; padding-left: 24px !important; }
/* ── B-12. #fwrite 모바일 패딩 ── */
html[data-cv="v5"] #fwrite { padding: 36px 24px !important; }
html[data-v="editorial"] #fwrite { padding: 40px 0 !important; }
html[data-v="typography"] #fwrite { padding: 48px 0 !important; }
html[data-v="luxury"] #fwrite { padding: 32px 28px 32px 36px !important; }
html[data-v="minimal"] #fwrite { padding: 32px 36px 32px 28px !important; }
html[data-v="monoline"] #fwrite { padding: 48px 24px !important; }
/* ── B-13. main_sec03 패딩 축소 ── */
html[data-cv="v5"] .main_sec03 ul li { padding: 36px 24px !important; }
html[data-v="typography"][data-index] .main_sec03 ul li { padding: 56px 40px !important; }
html[data-v="editorial"][data-index] .main_sec03 ul li { padding: 52px 40px !important; }
/* ── B-15. editorial .wz-loc-cat grid → block (2컬 → 1컬) ── */
html[data-v="editorial"] .wz-loc-cat { grid-template-columns: 1fr !important; display: block !important; gap: 0 !important; }
html[data-v="editorial"] .wz-loc-cat-header { padding: 20px 0 16px !important; }
}
/* ══════════════════════════════════════════════════════════════════
C. @media (max-width: 768px) — 모바일 / 패블릿
══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
/* ── C-1. 공통 sub_title h2.tit01 ── */
html[data-cv="v5"] .sub_title > h2.tit01 { font-size: clamp(1.6rem, 5.5vw, 2rem) !important; line-height: 1.3 !important; letter-spacing: -.3px !important; }
html[data-cv="v5"] .sub_title > h2.tit02 { font-size: .82rem !important; }
/* 변형별 세밀 조정 */
html[data-v="typography"] .sub_title > h2.tit01 { font-size: clamp(2rem, 7vw, 3rem) !important; letter-spacing: -2px !important; }
html[data-v="editorial"] .sub_title > h2.tit01 { font-size: clamp(1.8rem, 6.5vw, 2.6rem) !important; letter-spacing: -1.5px !important; }
html[data-v="cinema"] .sub_title > h2.tit01 { font-size: clamp(1.6rem, 5.5vw, 2.2rem) !important; letter-spacing: 0 !important; }
/* ── C-2. 공통 .wz-premium-item 레이아웃 ── */
/* grid 사용 변형 → 컬럼 1개로 (숫자가 너무 커서 모바일에서 찌그러짐 방지) */
html[data-v="cinema"] .wz-premium-item { grid-template-columns: 1fr !important; gap: 8px !important; }
html[data-v="typography"] .wz-premium-item { grid-template-columns: 1fr !important; gap: 0 !important; padding: 36px 0 !important; }
html[data-v="editorial"] .wz-premium-item { grid-template-columns: 1fr !important; gap: 12px !important; padding: 32px 0 !important; }
/* fullhero 절대 워터마크 — 모바일 패딩 축소 */
html[data-v="fullhero"] .wz-premium-item { padding: 24px 0 24px 72px !important; }
html[data-v="fullhero"] .wz-pm-num { font-size: 3.5rem !important; top: 22px !important; width: 60px !important; }
/* splithero 좌측 바 패딩 */
html[data-v="splithero"] .wz-premium-item { padding: 20px 0 20px 20px !important; }
html[data-v="splithero"] .wz-premium-item::before { top: 20px !important; bottom: 20px !important; }
/* timeline 마커 */
html[data-v="timeline"] .wz-premium-item { padding: 16px 0 16px 28px !important; }
/* luxury / minimal 숫자 — 절대 위치 겹침 방지 */
html[data-v="luxury"] .wz-premium-item { padding: 24px 0 24px 56px !important; }
html[data-v="luxury"] .wz-pm-num { font-size: 2rem !important; left: -10px !important; }
html[data-v="minimal"] .wz-premium-item { padding: 24px 56px 24px 0 !important; }
html[data-v="minimal"] .wz-pm-num { font-size: 2rem !important; right: -10px !important; }
/* ── C-3. 공통 .wz-pm-num 폰트 축소 ── */
html[data-cv="v5"] .wz-pm-num { font-size: clamp(1.4rem, 4vw, 2.2rem) !important; }
/* 변형별 예외 */
html[data-v="fullhero"] .wz-pm-num { font-size: 3.5rem !important; } /* 워터마크 유지 */
html[data-v="typography"] .wz-pm-num { font-size: 4rem !important; } /* 타이포 컨셉 */
html[data-v="editorial"] .wz-pm-num { font-size: 3rem !important; }
html[data-v="cinema"] .wz-pm-num { font-size: .9rem !important; }
html[data-v="parallax"] .wz-pm-num { font-size: 2rem !important; }
/* ── C-4. 공통 .wz-pm-title 폰트 ── */
html[data-cv="v5"] .wz-pm-title { font-size: 1.05rem !important; }
html[data-v="typography"] .wz-pm-title { font-size: 1.1rem !important; }
html[data-v="editorial"] .wz-pm-title { font-size: 1.15rem !important; }
/* ── C-5. PREMIUM N ::after 라벨 모바일 숨김 (너무 좁아서 겹침) ── */
html[data-cv="v5"] .wz-premium-item::after,
html[data-cv="v5"] .sub_premium ul li dl::after { display: none !important; }
/* ── C-6. #fwrite, .contact-form 패딩 ── */
html[data-cv="v5"] #fwrite { padding: 28px 20px !important; max-width: 100% !important; }
html[data-v="editorial"] #fwrite { padding: 36px 0 !important; }
html[data-v="typography"] #fwrite { padding: 40px 0 !important; }
html[data-v="monoline"] #fwrite { padding: 40px 20px !important; }
html[data-v="luxury"] #fwrite { padding: 28px 20px 28px 28px !important; }
html[data-v="minimal"] #fwrite { padding: 28px 28px 28px 20px !important; }
html[data-v="cinema"] #fwrite { padding: 36px 24px !important; }
html[data-cv="v5"] .contact-form { padding: 28px 20px !important; }
/* ── C-7. 공통 서브 프리미엄 — 외부 숫자 숨김 or 인라인화 ── */
/* typography — 좌측 거대 절대 숫자 → 인라인 상단으로 */
html[data-v="typography"] .sub_premium ul li dl { padding: 28px 0 28px 100px !important; }
html[data-v="typography"] .sub_premium ul li dl dt { font-size: 4rem !important; }
/* editorial — 좌측 거대 절대 숫자 → 인라인 상단으로 */
html[data-v="editorial"] .sub_premium ul li dl { padding: 28px 0 28px 100px !important; }
html[data-v="editorial"] .sub_premium ul li dl dt { font-size: 3rem !important; }
/* luxury — 외부 패딩 축소 */
html[data-v="luxury"] .sub_premium ul li { padding-left: 52px !important; }
html[data-v="minimal"] .sub_premium ul li { padding-right: 52px !important; }
/* splithero — 외부 숫자 → 인라인 */
html[data-v="splithero"] .sub_premium ul li dl { padding: 24px 20px 24px 80px !important; }
html[data-v="splithero"] .sub_premium ul li dl dt { left: 20px !important; }
/* parallax */
html[data-v="parallax"] .sub_premium ul li dl { padding: 24px 20px 24px 80px !important; }
html[data-v="parallax"] .sub_premium ul li dl dt { font-size: 2.5rem !important; left: 16px !important; }
/* ── C-8. .wz-premium-wrap 공통 여백 ── */
html[data-cv="v5"] .wz-premium-wrap { padding: 0 16px !important; }
/* ── C-9. sub_title 패딩 추가 축소 ── */
html[data-cv="v5"] .sub_title { padding: 0 !important; }
html[data-v="splithero"] .sub_title { padding: 0 !important; }
html[data-v="timeline"] .sub_title { padding: 0 !important; }
html[data-v="luxury"] .sub_title { padding: 0!important; }
html[data-v="minimal"] .sub_title { padding: 0 !important; }
html[data-v="editorial"] .sub_title { padding: 0!important; }
html[data-v="typography"] .sub_title { padding: 0 !important; }
html[data-v="cinema"] .sub_title { padding: 0 !important; }
/* ── C-11. #bo_w 패딩 ── */
html[data-cv="v5"] #bo_w { }
/* ── C-12. main_sec03 패딩 축소 ── */
html[data-cv="v5"] .main_sec03 ul li { padding: 28px 20px !important; }
/* ── C-14. wz-blk-tit 폰트 축소 ── */
html[data-cv="v5"] .wz-blk-tit { font-size: clamp(1.4rem, 4.5vw, 1.8rem) !important; }
html[data-v="typography"] .wz-blk-tit { font-size: clamp(1.8rem, 6vw, 2.4rem) !important; }
html[data-v="editorial"] .wz-blk-tit { font-size: clamp(1.6rem, 5.5vw, 2rem) !important; }
/* ── C-15. content_wrap 패딩 축소 ── */
html[data-cv="v5"] .content_wrap { }
html[data-v="typography"] .content_wrap { padding: 40px 0 !important; }
html[data-v="editorial"] .content_wrap { padding: 40px 0 !important; }
/* ── C-16. sub_premium 공통 padding 보정 ── */
html[data-cv="v5"] .sub_premium ul li dl { }
/* 외부 숫자 변형은 위에서 이미 개별 지정했으므로 제외 */
html[data-v="mosaic"] .sub_premium ul li dl { padding: 28px 20px !important; }
html[data-v="monoline"] .sub_premium ul li dl { padding: 36px 20px !important; }
html[data-v="cinema"] .sub_premium ul li dl { padding: 28px 16px !important; }
html[data-v="timeline"] .sub_premium ul li dl { padding: 20px 0 20px 28px !important; }
/* ── C-17. footer 패딩 ── */
html[data-cv="v5"] footer { padding: 40px 0 28px !important; }
html[data-v="typography"] footer,
html[data-v="cinema"] footer,
html[data-v="monoline"] footer,
html[data-v="editorial"] footer{ padding: 48px 0 32px !important; }
html[data-v="luxury"] footer { padding: 36px 0 24px 0 !important; }
html[data-v="minimal"] footer { padding: 36px 0 24px 0 !important; text-align: left !important; }
html[data-cv="v5"] footer .cinner { padding: 0 16px !important; }
html[data-v="luxury"] footer .cinner { padding-left: 16px !important; }
html[data-v="minimal"] footer .cinner { padding-right: 16px !important; text-align: left !important; }
}
/* ══════════════════════════════════════════════════════════════════
D. @media (max-width: 640px) — 스마트폰 세로
══════════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
/* ── D-1. sub_title h2.tit01 최소 크기 보장 ── */
html[data-cv="v5"] .sub_title > h2.tit01 { font-size: clamp(1.4rem, 6vw, 1.8rem) !important; }
html[data-v="typography"] .sub_title > h2.tit01 { font-size: clamp(1.8rem, 8vw, 2.4rem) !important; }
html[data-v="editorial"] .sub_title > h2.tit01 { font-size: clamp(1.6rem, 7vw, 2.2rem) !important; padding-bottom: 10px !important; }
html[data-v="cinema"] .sub_title > h2.tit01 { font-size: clamp(1.4rem, 6.5vw, 1.9rem) !important; }
/* ── D-2. .wz-premium-item 완전 block 레이아웃 ── */
html[data-cv="v5"] .wz-premium-item { display: block !important; grid-template-columns: none !important; }
/* fullhero — 워터마크 숫자 크기 더 줄임 */
html[data-v="fullhero"] .wz-premium-item { padding: 20px 0 20px 56px !important; }
html[data-v="fullhero"] .wz-pm-num { font-size: 2.6rem !important; width: 48px !important; top: 18px !important; }
/* editorial — 좌숫자 숨기고 인라인화 */
html[data-v="editorial"] .wz-premium-item { padding: 24px 0 !important; }
html[data-v="editorial"] .wz-pm-num { font-size: 2rem !important; margin-bottom: 8px !important; display: block !important; position: static !important; line-height: 1 !important; }
/* typography — 좌숫자 인라인화 */
html[data-v="typography"] .wz-premium-item { padding: 28px 0 !important; }
html[data-v="typography"] .wz-pm-num { font-size: 3rem !important; display: block !important; margin-bottom: 10px !important; line-height: 1 !important; }
/* cinema */
html[data-v="cinema"] .wz-premium-item { padding: 20px 10px !important; }
/* parallax */
html[data-v="parallax"] .wz-premium-item { }
/* luxury / minimal */
html[data-v="luxury"] .wz-premium-item { }
html[data-v="luxury"] .wz-pm-num { font-size: 1.6rem !important; left: -8px !important; padding: 0 8px !important; }
html[data-v="minimal"] .wz-premium-item { }
html[data-v="minimal"] .wz-pm-num { font-size: 1.6rem !important; right: -8px !important; padding: 0 8px !important; }
/* timeline 마커 */
html[data-v="timeline"] .wz-premium-item { margin-bottom: 20px !important;}
/* ── D-3. .wz-pm-num / .wz-pm-title 스몰 스크린 ── */
html[data-cv="v5"] .wz-pm-num { font-size: clamp(1.2rem, 4vw, 1.8rem) !important; }
html[data-cv="v5"] .wz-pm-title { font-size: 1rem !important; }
/* 예외 유지 */
html[data-v="editorial"] .wz-pm-num { font-size: 2rem !important; }
html[data-v="fullhero"] .wz-pm-num { font-size: 2.6rem !important; }
/* ── D-4. .wz-info-table th, td 폰트/패딩 ── */
/* block 레이아웃(이미 768에서 적용) 패딩 추가 보정 */
/* #ctt 테이블 */
html[data-cv="v5"] #ctt table th,
html[data-cv="v5"] #ctt table td { font-size: .83rem !important; padding: 10px 12px !important; }
/* ── D-5. .sub_premium ul li dl — 세로 쌓임 강제 ── */
/* 외부 숫자(absolutely positioned dt) 변형 → block 인라인화 */
/* splithero */
html[data-v="splithero"] .sub_premium ul li dl { padding: 20px 16px !important; }
html[data-v="splithero"] .sub_premium ul li dl dt { position: static !important; font-size: 1.6rem !important; margin-bottom: 6px !important; display: block !important; transform: none !important; }
/* typography */
html[data-v="typography"] .sub_premium ul li dl { padding: 24px 0 !important; grid-template-columns: auto !important; padding: 20px 15px !important;}
html[data-v="typography"] .sub_premium ul li dl dt { position: static !important; font-size: 3rem !important; display: block !important; transform: none !important; margin-bottom: 10px !important; opacity: .85 !important; letter-spacing: -2px !important; }
html[data-v="typography"] .sub_premium ul li dl dd strong { font-size: 1.2rem !important; }
/* editorial */
html[data-v="editorial"] .sub_premium ul li dl { padding: 20px 10px !important; }
html[data-v="editorial"] .sub_premium ul li dl dt { position: static !important; font-size: 2.4rem !important; display: block !important; transform: none !important; margin-bottom: 8px !important; letter-spacing: -2px !important; }
html[data-v="editorial"] .sub_premium ul li dl dd strong { font-size: 1.2rem !important; }
/* parallax */
html[data-v="parallax"] .sub_premium ul li dl { padding: 20px 16px !important; border-radius: 10px !important; }
html[data-v="parallax"] .sub_premium ul li dl dt { position: static !important; font-size: 2rem !important; display: block !important; transform: none !important; margin-bottom: 8px !important; text-shadow: none !important; }
/* luxury */
html[data-v="luxury"] .sub_premium ul li { padding-left: 0 !important; }
html[data-v="luxury"] .sub_premium ul li dl { padding: 20px 16px !important; border-left: 3px solid var(--a1) !important; }
html[data-v="luxury"] .sub_premium ul li dl dt { position: static !important; font-size: 1.6rem !important; display: block !important; transform: none !important; margin-bottom: 6px !important; padding-bottom: 4px !important; border-bottom: 1px solid var(--a1) !important; }
/* minimal */
html[data-v="minimal"] .sub_premium ul li { padding-right: 0 !important; }
html[data-v="minimal"] .sub_premium ul li dl { padding: 20px 16px !important; border-right: none !important; border-left: 3px solid var(--a1) !important; text-align: left !important; }
html[data-v="minimal"] .sub_premium ul li dl dt { position: static !important; font-size: 1.1rem !important; display: block !important; transform: none !important; margin-bottom: 6px !important; border: 1px solid var(--a1) !important; padding: 4px 10px !important; width: fit-content !important; }
html[data-v="minimal"] .sub_premium ul li dl dd strong { text-align: left !important; }
/* cinema dt 라벨 (absolute 상단) → static */
html[data-v="cinema"] .sub_premium ul li dl { padding: 20px 16px !important; margin-top: 0 !important; border-top: 1px solid var(--a1) !important; }
html[data-v="cinema"] .sub_premium ul li dl dt { position: static !important; transform: none !important; background: transparent !important; color: var(--a1) !important; padding: 0 !important; font-size: 2rem !important; letter-spacing: 3px !important; text-transform: uppercase !important; margin-bottom: 8px !important; display: block !important; }
/* mosaic dt (pill) → 크기 축소 */
html[data-v="mosaic"] .sub_premium ul li dl { padding: 40px 16px 20px !important; border-radius: 12px !important; }
html[data-v="mosaic"] .sub_premium ul li dl dt { top: 14px !important; left: 16px !important; font-size: .75rem !important; }
/* monoline */
html[data-v="monoline"] .sub_premium ul li dl { padding: 28px 16px !important; }
/* timeline dt (마커) — 위치 유지 (이미 hidden border형) */
html[data-v="timeline"] .sub_premium ul { padding-left: 36px !important; }
html[data-v="timeline"] .sub_premium ul li dl { padding: 16px 0 16px 24px !important; }
/* ── D-6. #quick 모바일 — 이미 하단 바이지만 height 조정 ── */
html[data-cv="v5"] #quick .quick_menu ul > li { height: 60px !important; }
html[data-cv="v5"] #quick .quick_menu a i { font-size: 1.25rem !important; }
html[data-cv="v5"] #quick .quick_menu a strong { font-size: 1rem !important; margin: 0; }
/* ── D-7. sub_premium dt/dd 세로 gap ── */
html[data-cv="v5"] .sub_premium ul li dl dt { margin-bottom: 8px !important; }
html[data-cv="v5"] .sub_premium ul li dl dd strong { font-size: 1rem !important; margin-bottom: 6px !important; }
/* ── D-8. 방문예약 버튼 풀폭 ── */
html[data-cv="v5"] #fwrite .btn_confirm { flex-direction: column !important; gap: 10px !important; }
html[data-cv="v5"] #fwrite .btn_submit,
html[data-cv="v5"] #fwrite button[type="submit"] { padding: 14px 20px !important; font-size: .9rem !important; width: 100% !important; }
html[data-cv="v5"] .main_sec03 .btn_submit { width: 100% !important; padding: 14px 20px !important; }
/* ── D-9. 푸터 텍스트 ── */
html[data-cv="v5"] footer .cinner { font-size: .82rem !important; padding: 0 16px !important; }
/* 디자인 장식 해제 (모바일에서 겹침 방지) */
html[data-v="parallax"] footer .cinner { background: none !important; box-shadow: none !important; padding: 0 16px !important; }
html[data-v="mosaic"] footer .cinner { background: none !important; border-radius: 0 !important; padding: 0 16px !important; }
html[data-v="timeline"] footer .cinner::before { display: none !important; }
/* ── D-10. content_wrap 패딩 ── */
html[data-cv="v5"] .content_wrap { }
html[data-v="typography"] .content_wrap { padding: 32px 0 !important; }
html[data-v="editorial"] .content_wrap { padding: 20px !important; }
/* ── D-11. 사업개요 테이블 ── */
html[data-cv="v5"] #ctt { }
html[data-cv="v5"] #ctt table { width: 100% !important; }
/* ── D-12. #fwrite max-width 100% ── */
html[data-cv="v5"] #fwrite { max-width: 100% !important; box-sizing: border-box !important; }
/* ── D-14. sub_title 장식 요소 모바일 정리 ── */
/* luxury / minimal 세로 가는 선 숨김 */
html[data-v="luxury"] .sub_title::before { display: none !important; }
html[data-v="minimal"] .sub_title::after { display: none !important; }
text-align: left !important;
}
/* timeline sub_title 세로 라인 + 마커 숨김 (이미 line 2329에서 ::before display:none, 모바일 재확인) */
html[data-v="timeline"] .sub_title::before { display: none !important; }
html[data-v="timeline"] .sub_title > h2.tit01::before { display: none !important; }
/* splithero sub_title 좌측 바 */
html[data-v="splithero"] .sub_title::before { display: none !important; }
html[data-v="splithero"] .sub_title > h2.tit01 { padding-left: 0 !important; }
/* ── D-15. main_sec03 여백 ── */
html[data-cv="v5"] .main_sec03 ul li { }
/* ── D-17. sub_premium ul gap 축소 ── */
html[data-v="editorial"] .sub_premium ul { gap: 16px !important; }
}
html[data-cv="v5"] .sub_title::before,
html[data-cv="v5"] .sub_title::after,
html[data-cv="v5"] .sub_title > h2::before,
html[data-cv="v5"] .sub_title > h2::after,
html[data-cv="v5"] .sub_title > h3::before,
html[data-cv="v5"] .sub_title > h3::after {
content: none !important;
display: none !important;
}
/* ── 58-F. footer 보더 + 가상요소 전체 제거 ── */
html[data-cv="v5"] footer {
border-top: none !important;
border-bottom: none !important;
border-left: none !important;
border-right: none !important;
}
html[data-cv="v5"] footer .cinner {
border-top: none !important;
border-bottom: none !important;
border-left: none !important;
border-right: none !important;
}
html[data-cv="v5"] footer::before,
html[data-cv="v5"] footer::after,
html[data-cv="v5"] footer .cinner::before,
html[data-cv="v5"] footer .cinner::after {
content: none !important;
display: none !important;
}
/* ══════════════════════════════════════════════════════════════════
── 59. 방문예약 폼 (#fwrite) — 15종 전체 폰트/셀렉트 검정 보장 ──
══════════════════════════════════════════════════════════════════ */
html[data-cv="v5"] #fwrite select option {
background: #fff !important;
color: #1a1a1a !important;
}
html[data-cv="v5"] #fwrite th,
html[data-cv="v5"] #fwrite td,
html[data-cv="v5"] #fwrite .label,
html[data-cv="v5"] #fwrite .privacy_wrap,
html[data-cv="v5"] #fwrite .privacy_wrap * {
color: #1a1a1a !important;
}
html[data-cv="v5"] #fwrite .star { color: #e53e3e !important; }
html[data-cv="v5"] #fwrite .btn_submit { color: #fff !important; }
/* ── footer address 좌측 정렬 (15종 공통) ── */
html[data-cv="v5"] footer address > ul > li,
html[data-cv="v5"] footer address > ul > li > ul > li {
text-align: left !important;
}
/* ── fullhero 메인 프리미엄 완전 정의 ── */
html[data-v="fullhero"] .wz-premium-item {
display: block !important;
position: relative !important;
padding: 36px 0 36px 120px !important;
border-bottom: 1px solid var(--a1-12) !important;
border-radius: 0 !important;
background: transparent !important;
}
html[data-v="fullhero"] .wz-premium-item:last-child {
border-bottom: none !important;
}
html[data-v="fullhero"] .wz-pm-num {
position: absolute !important;
left: 0 !important;
top: 24px !important;
width: 100px !important;
text-align: center !important;
font-size: 5rem !important;
font-weight: 200 !important;
color: var(--a1) !important;
opacity: .18 !important;
line-height: 1 !important;
letter-spacing: -3px !important;
}
html[data-v="fullhero"] .wz-pm-title {
font-size: 1.4rem !important;
font-weight: 800 !important;
color: var(--p) !important;
line-height: 1.3 !important;
margin-bottom: 6px !important;
padding-left: 16px !important;
text-align: left;
}
html[data-v="fullhero"] .wz-pm-desc {
font-size: .95rem !important;
color: var(--text-sub, #555) !important;
line-height: 1.75 !important;
margin-top: 6px !important;
padding-left: 19px !important;
text-align: left;
}
/* 입지환경 .wz-loc-cat-title */
html[data-v="fullhero"] .wz-loc-cat-title {
color: var(--a2) !important;
}
@media (max-width: 768px) {
html[data-v="fullhero"] #quick .quick_menu a strong {
font-size: .9rem !important;
margin-top: 0;
}
}
/* ══════════════════════════════════════════════════════════════════
59. 모바일 gnb 서브메뉴 링크 색상 — v5 전체 (패널 배경=var(--p2) 어두움)
══════════════════════════════════════════════════════════════════ */
html[data-cv="v5"] #gnb_all .gnb_al_li > ul > li > a {
color: rgba(255,255,255,0.65) !important;
}
html[data-cv="v5"] #gnb_all .gnb_al_li > ul > li > a:hover,
html[data-cv="v5"] #gnb_all .gnb_al_li > ul > li > a.on {
color: var(--a1) !important;
opacity: 1 !important;
}
/* ══════════════════════════════════════════════════════════════════
60. wz-info-table 모바일 — 15종 팔레트 기반 디자인
기존 768px block 전환 이후 th/td 색상 팔레트로 통일
(per-variant 하드코딩 불필요 — var(--p)/var(--ht) 자동 적용)
══════════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════════
wz-info-table 사업개요 테이블 — 완전 정의
규칙: th=var(--p) 팔레트 배경 / 폰트 최소 1rem / 모바일 block 전환
══════════════════════════════════════════════════════════════════ */
/* 공통 베이스 */
html[data-cv="v5"] #ctt .wz-info-table {
width: 100% !important;
border-collapse: collapse !important;
table-layout: auto !important;
}
html[data-cv="v5"] #ctt .wz-info-table th,
html[data-cv="v5"] #ctt .wz-info-table td {
padding: 16px 20px !important;
border: none !important;
border-bottom: 1px solid rgba(0,0,0,.08) !important;
vertical-align: middle !important;
line-height: 1.65 !important;
font-size: 1rem !important;
}
html[data-cv="v5"] #ctt .wz-info-table th {
background: var(--p) !important;
color: var(--ht, #fff) !important;
font-weight: 700 !important;
white-space: nowrap !important;
width: 22% !important;
min-width: 100px !important;
text-align: left !important;
color: var(--a2, #fff) !important;
border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
}
html[data-cv="v5"] #ctt .wz-info-table td {
background: #fff !important;
color: #333 !important;
font-weight: 400 !important;
}
/* 모바일 block 전환 @ 768px */
@media (max-width: 768px) {
html[data-cv="v5"] #ctt .wz-info-table,
html[data-cv="v5"] #ctt .wz-info-table tbody,
html[data-cv="v5"] #ctt .wz-info-table tr,
html[data-cv="v5"] #ctt .wz-info-table th,
html[data-cv="v5"] #ctt .wz-info-table td {
display: block !important;
width: 100% !important;
box-sizing: border-box !important;
}
html[data-cv="v5"] #ctt .wz-info-table th {
border-bottom: none !important;
white-space: normal !important;
width: 100% !important;
min-width: unset !important;
padding: 10px 16px !important;
font-size: 1rem !important;
}
html[data-cv="v5"] #ctt .wz-info-table td {
padding: 12px 16px !important;
font-size: 1rem !important;
border-bottom: 1px solid rgba(0,0,0,.07) !important;
}
html[data-cv="v5"] #ctt .wz-info-table tr:last-child td {
border-bottom: none !important;
}
}