/* ── 광고 게재 모집(sponsor.html) — apply.css 의 폼·패널·완료 화면 위에 얹는다 ── */
.sponsor .sp-hero { padding-bottom: 12px; }
.sponsor .sp-hero .sec-title { font-size: clamp(38px, 6vw, 80px); }
.sp-edition { margin-top: 14px; font: 800 clamp(18px, 2vw, 24px) var(--cond); letter-spacing: .04em; color: var(--gold); }
.sp-lead { margin-top: 14px; max-width: 760px; font-size: 16px; line-height: 1.8; color: var(--text); opacity: .9; }
.sp-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.sp-actions .btn { padding: 13px 24px; font-size: 17px; }

.sp-sec { padding: clamp(48px, 7vw, 88px) 0 0; }
.sp-h { font-family: var(--cond); font-style: italic; font-weight: 900; font-size: clamp(32px, 4.4vw, 56px); line-height: 1; margin: 12px 0 26px; text-transform: uppercase; }
.sp-note, .sp-muted { color: var(--muted); font-size: 13px; line-height: 1.7; }
.sp-note { margin-top: 16px; }
/* 관리자 추가 안내(ad_settings.note) — 자유 텍스트라 줄바꿈 유지 */
.sp-extra { margin-top: 14px; padding: 14px 18px; border-left: 3px solid var(--gold); border-radius: 0 12px 12px 0; background: rgba(245,180,0,.06); font-size: 14px; line-height: 1.8; white-space: pre-line; }
/* 모집 안 함·마감·요금 미정 안내 */
.sp-closed { margin-top: 28px; }
.sp-closed .btn { margin-top: 20px; }

/* 게재 가치 */
.sp-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.sp-values.has-reach { grid-template-columns: 1.3fr repeat(3, 1fr); }
@media (max-width: 1000px) { .sp-values, .sp-values.has-reach { grid-template-columns: repeat(2, 1fr); } .sp-values:not(.has-reach) .sp-value:first-child { grid-column: 1 / -1; } }
@media (max-width: 520px) { .sp-values { grid-template-columns: 1fr; } }
.sp-value { border: 1px solid var(--line); border-radius: 20px; padding: 22px; background: rgba(255,255,255,.02); }
.sp-value .num { display: block; font-family: var(--display); font-weight: 400; font-size: 48px; line-height: 1; color: var(--gold); }
.sp-value.reach { border-color: color-mix(in srgb, var(--gold) 45%, transparent); background: linear-gradient(160deg, #1c1a2a, #0b0f24); }
.sp-value.reach .num { font-size: clamp(34px, 3.4vw, 48px); line-height: 1.1; overflow-wrap: anywhere; }
.sp-value .num.sm { font-family: var(--cond); font-weight: 800; font-size: 26px; line-height: 1.15; }
.sp-value h3 { margin-top: 12px; font-size: 15px; }
.sp-value p { margin-top: 6px; color: var(--muted); font-size: 13px; line-height: 1.7; }

/* 페이지 비율 도식(A4) */
.pg { position: relative; flex: none; width: 58px; aspect-ratio: 1 / 1.414; border-radius: 4px; border: 1.5px solid rgba(255,255,255,.45); background: rgba(255,255,255,.04); overflow: hidden; }
.pg i { position: absolute; left: 4px; right: 4px; bottom: 4px; border-radius: 2px; background: var(--gold); }
.pg-full i, .pg-cover i { top: 4px; }
.pg-half i { height: calc(50% - 6px); }
.pg-third i { height: calc(33.33% - 5.3px); }
.pg-sixth i { right: auto; width: calc(50% - 6px); height: calc(33.33% - 5.3px); }
/* 표지(表2・3・4): 가장 눈에 띄는 자리 — 금색 광택 + 뒤쪽 장 겹침 */
.pg-cover { border-color: var(--gold); box-shadow: 4px 4px 0 -1px rgba(245,180,0,.35), 8px 8px 0 -2px rgba(245,180,0,.18); overflow: visible; }
.pg-cover i { background: linear-gradient(135deg, #ffd65a, var(--gold) 45%, #c98f00); }

/* 웹 광고 도식: 인쇄 지면(A4 세로)과 구분되게 가로 브라우저 창 + 아래쪽 3:1 광고 띠 */
.wb { position: relative; flex: none; width: 96px; aspect-ratio: 4 / 3; border-radius: 6px; border: 1.5px solid rgba(255,255,255,.45); background: rgba(255,255,255,.04); overflow: hidden; }
.wb s { position: absolute; left: 0; right: 0; top: 0; height: 14%; background: rgba(255,255,255,.14); text-decoration: none; }
.wb .bar { position: absolute; left: 8%; height: 5%; border-radius: 2px; background: rgba(255,255,255,.22); }
.wb .bar:nth-of-type(1) { top: 24%; width: 46%; }
.wb .bar:nth-of-type(2) { top: 36%; width: 70%; }
.wb i { position: absolute; left: 8%; right: 8%; bottom: 9%; aspect-ratio: 3 / 1; border-radius: 3px; background: repeating-linear-gradient(135deg, var(--gold) 0 6px, #ffcf40 6px 12px); }

/* 광고 메뉴 */
.sp-plans { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 14px; align-items: stretch; }
@media (max-width: 1100px) { .sp-plans { grid-template-columns: repeat(2, 1fr); } .sp-plan.premium { grid-column: 1 / -1; } }
@media (max-width: 480px) { .sp-plans { grid-template-columns: 1fr; } }
.sp-plan { display: flex; gap: 18px; align-items: flex-end; border: 1px solid var(--line); border-radius: 20px; padding: 20px; background: linear-gradient(160deg, #0d1633, #070d22); }
.sp-plan.premium { border-color: color-mix(in srgb, var(--gold) 55%, transparent); background: linear-gradient(160deg, #1c1a2a, #0b0f24); }
.sp-plan.premium .pg { width: 84px; }
.sp-plan-body { min-width: 0; }
.sp-plan h3 { font: 800 22px var(--cond); letter-spacing: .03em; text-transform: uppercase; }
.sp-plan p { margin-top: 4px; font-size: 13px; color: var(--muted); line-height: 1.6; }
.sp-plan .price { display: block; margin-top: 10px; font-family: var(--display); font-weight: 400; font-size: 30px; color: var(--text); letter-spacing: .02em; }
.sp-plan.premium .price { font-size: 38px; color: var(--gold); }
.sp-badge { display: inline-block; margin-bottom: 8px; padding: 3px 10px; border-radius: 999px; background: var(--gold); color: var(--bg); font: 800 12px var(--cond); letter-spacing: .12em; text-transform: uppercase; }

/* 웹사이트 광고: 인쇄 지면 요금표 아래 가로로 긴 별도 카드 */
.sp-plan.web { margin-top: 22px; align-items: center; gap: clamp(16px, 3vw, 32px); border-color: rgba(120,160,255,.35); background: linear-gradient(120deg, #0d1a3d, #081029 55%, #0b0f24); }
.sp-plan.web .wb { width: clamp(96px, 12vw, 150px); }
.sp-plan.web .sp-plan-body { flex: 1; }
.sp-plan.web .price { margin: 0 0 0 auto; align-self: center; white-space: nowrap; }
.sp-badge.line { background: none; border: 1px solid rgba(120,160,255,.6); color: #aac4ff; }
.sp-plan .sp-spec { margin-top: 8px; color: var(--text); opacity: .85; }
@media (max-width: 640px) { .sp-plan.web { flex-wrap: wrap; } .sp-plan.web .price { margin-left: 0; width: 100%; } }
.sp-choice .wb { width: 40px; border-width: 1px; border-radius: 4px; }

/* 게재 예시(가상 지면) */
.sp-examples { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media (max-width: 1100px) { .sp-examples { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .sp-examples { grid-template-columns: 1fr; } }
.sp-ex { margin: 0; display: flex; flex-direction: column; gap: 14px; }
.mock { aspect-ratio: 1 / 1.414; width: 100%; max-width: 300px; margin: 0 auto; border-radius: 6px; background: #f6f4ee; color: #1b2233; padding: 7%; box-shadow: 0 24px 50px -24px rgba(0,0,0,.9), 0 0 0 1px rgba(255,255,255,.06); overflow: hidden; font-family: var(--body); }
.mock .bar { display: block; height: 6px; margin-top: 6px; border-radius: 3px; background: #d8dbe3; }
.sp-ex figcaption h3 { font: 800 21px var(--cond); letter-spacing: .03em; text-transform: uppercase; }
.sp-ex figcaption p { margin-top: 6px; font-size: 14px; color: var(--muted); line-height: 1.7; }
.sp-fits { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.sp-fits span { font-size: 12px; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--line); color: var(--text); }

/* 5) 웹 슬라이드: 신청 페이지(브라우저 창) 아래쪽에 실제 슬라이드 모듈(js/ad-slider.js)을 그대로 */
.sp-ex-web { margin-top: 28px; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 40px); align-items: center; }
@media (max-width: 900px) { .sp-ex-web { grid-template-columns: 1fr; } }
.mock-web { border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); background: var(--bg); box-shadow: 0 24px 50px -24px rgba(0,0,0,.9); }
.mw-bar { display: flex; align-items: center; gap: 6px; padding: 9px 12px; background: #141b33; }
.mw-bar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.22); }
.mw-bar span { flex: 1; height: 14px; margin-left: 10px; border-radius: 7px; background: rgba(255,255,255,.08); }
.mw-page { padding: clamp(14px, 2.4vw, 26px); }
.mw-page > b { display: block; font: 900 italic clamp(18px, 2vw, 26px) var(--cond); letter-spacing: .04em; text-transform: uppercase; color: var(--text); }
.mw-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 12px 0 18px; }
.mw-form span { height: 22px; border-radius: 6px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.03); }
.mw-slot > small { display: block; margin-bottom: 8px; font: 800 11px var(--cond); letter-spacing: .24em; color: var(--muted); text-transform: uppercase; }
.mw-slot .ad-viewport { border-radius: 10px; outline: 2px solid var(--gold); outline-offset: 3px; }
.mw-slot .ad-nav { width: 30px; height: 30px; }
.mw-slot .ad-dots { margin-top: 6px; }

/* 1) 이미지 광고(전면) */
.mk-ad { height: 100%; display: flex; flex-direction: column; }
.mk-photo { height: 46%; border-radius: 4px; background: linear-gradient(160deg, #3aa6c9, #1f5bff 60%, #173a9e); overflow: hidden; }
.mk-photo svg { width: 100%; height: 100%; display: block; }
.mk-headline { margin-top: 10%; font-family: var(--cond), var(--body); font-weight: 900; font-style: italic; font-size: clamp(18px, 1.8vw, 24px); line-height: 1.1; color: #173a9e; text-transform: uppercase; }
.mk-tagline { margin-top: 6px; font-size: 11px; color: #4a5470; }
.mk-foot { margin-top: auto; padding-top: 8px; border-top: 2px solid #173a9e; display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: center; }
.mk-foot b { font-size: 12px; }
.mk-foot .bar { grid-column: 1 / -1; height: 5px; }
.mk-logo { width: 20px; height: 20px; border-radius: 50%; background: conic-gradient(#1f5bff 0 60%, #3aa6c9 0); }
.mk-logo.sq { border-radius: 4px; background: conic-gradient(#e8202e 0 50%, #f5b400 0); }

/* 2) 인물 소개·축사 */
.mk-profile .mk-band { margin: -7.5% -7.5% 8%; padding: 8px 7.5%; background: #1b2233; color: #f5b400; font: 800 13px var(--cond); letter-spacing: .2em; text-transform: uppercase; }
.mk-person { display: flex; gap: 10px; align-items: center; }
.mk-person svg { width: 34%; aspect-ratio: 1; border-radius: 6px; flex: none; }
.mk-person small { display: block; font-size: 10px; color: #4a5470; }
.mk-person b { display: block; margin: 2px 0; font-size: 16px; }
.mk-quote { margin: 10% 0 4%; font-size: 11px; line-height: 1.6; font-weight: 700; color: #1b2233; border-left: 3px solid #f5b400; padding-left: 8px; }

/* 3) 소형 광고(1/6 칸) */
.mk-small { height: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr); gap: 6px; }
.mk-small .cell { border: 1px dashed #c3c8d4; border-radius: 3px; padding: 8%; }
.mk-small .cell.on { border: 2px solid #f5b400; background: #fff; position: relative; box-shadow: 0 4px 14px -6px rgba(0,0,0,.35); }
.mk-shop { display: flex; gap: 5px; align-items: center; }
.mk-shop .mk-logo { width: 14px; height: 14px; flex: none; }
.mk-shop b { font-size: 10px; line-height: 1.1; }
.mk-small .qr { position: absolute; right: 8%; bottom: 8%; width: 34%; }

/* 4) 응원 문구 */
.mk-support { height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.mk-support .slot { border: 1px dashed #c3c8d4; border-radius: 3px; padding: 8%; }
.mk-support .slot.on { border: 2px solid #f5b400; background: #fff; text-align: center; padding: 12% 8%; }
.mk-support .slot.on p { font-size: 12px; font-weight: 700; line-height: 1.6; }
.mk-support .slot.on small { display: block; margin-top: 10px; font-size: 10px; color: #4a5470; }
.mk-support .slot.on b { display: block; font-size: 12px; margin-top: 2px; }

/* 진행 흐름 */
.sp-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; counter-reset: none; }
@media (max-width: 1000px) { .sp-flow { grid-template-columns: 1fr; } }
.sp-flow li { position: relative; border: 1px solid var(--line); border-radius: 18px; padding: 18px; background: rgba(255,255,255,.02); }
.sp-flow .n { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--gold); color: var(--bg); font-family: var(--display); font-size: 18px; }
.sp-flow b { display: block; margin-top: 12px; font: 800 20px var(--cond); letter-spacing: .03em; text-transform: uppercase; }
.sp-flow p { margin-top: 6px; font-size: 13px; color: var(--muted); line-height: 1.7; overflow-wrap: anywhere; }

/* 신청 폼 */
.sp-sub-h { margin-top: 28px; }
.sp-choices { display: grid; gap: 10px; }
.sp-choices.plans { grid-template-columns: repeat(var(--n, 5), 1fr); }
.sp-choices.styles { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1000px) { .sp-choices.plans { grid-template-columns: repeat(3, 1fr); } .sp-choices.styles { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .sp-choices.plans { grid-template-columns: 1fr 1fr; } }
.sp-choices.invalid { border-radius: 16px; }
.sp-choice { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.03); cursor: pointer; transition: border-color .2s, background .2s; }
.sp-choice:hover { border-color: rgba(255,255,255,.4); }
.sp-choice input { position: absolute; opacity: 0; pointer-events: none; }
.sp-choice .pg { width: 30px; border-width: 1px; }
.sp-choice .pg i { left: 2px; right: 2px; bottom: 2px; }
.sp-choice .pg-full i, .sp-choice .pg-cover i { top: 2px; }
.sp-choice .pg-sixth i { right: auto; }
.sp-choice .pg-cover { box-shadow: 2px 2px 0 -1px rgba(245,180,0,.35); }
.sp-choice b { display: block; font-size: 14px; }
.sp-choice em { display: block; font-style: normal; font-size: 13px; color: var(--muted); margin-top: 2px; }
.sp-choice.text { justify-content: center; text-align: center; }
.sp-choice:has(input:checked) { border-color: var(--gold); background: rgba(245,180,0,.08); }
.sp-choice:has(input:checked) em { color: var(--gold); }
.sp-choice:has(input:focus-visible) { box-shadow: 0 0 0 3px rgba(245,180,0,.3); }
.sp-note-field { margin-top: 24px; }
.sp-note-field em { font-style: normal; font-weight: 500; color: var(--muted); font-size: 12px; margin-left: 6px; }
.sponsor .field > span em { margin-left: 6px; }
.sp-submit { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 20px; }
.sp-submit .btn[disabled] { opacity: .5; pointer-events: none; }
.sp-submit .sp-muted { flex: 1 1 260px; }
.sp-submit .form-err { flex-basis: 100%; }
.sp-submit .form-err:empty { display: none; }
/* 오류 시 대체 신청 경로(설정된 이메일·전화·FAX) */
.sp-alt { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; }
.sp-alt a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }

/* 문의처 */
.sp-contact { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; border: 1px solid var(--line); border-radius: 22px; padding: clamp(20px, 3vw, 32px); background: rgba(255,255,255,.02); }
@media (max-width: 820px) { .sp-contact { grid-template-columns: 1fr; } }
.sp-contact.solo { grid-template-columns: 1fr; }
.sp-contact dl { display: grid; gap: 10px; margin: 0; }
.sp-contact dl > div { display: grid; grid-template-columns: 9em 1fr; gap: 12px; font-size: 15px; }
.sp-contact dt { color: var(--muted); font-size: 13px; padding-top: 2px; }
.sp-contact dd { margin: 0; overflow-wrap: anywhere; }
.sp-contact a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.sp-contact-note p { font-size: 14px; line-height: 1.8; color: var(--muted); }
.sp-contact-note p + p { margin-top: 10px; }
@media (max-width: 420px) { .sp-contact dl > div { grid-template-columns: 1fr; gap: 2px; } }

/* 완료 화면 */
.sp-done { padding-bottom: 20px; }
.sp-done-code small { display: block; margin-top: 22px; color: var(--muted); font-size: 13px; }
.sp-done-code .code { margin-top: 6px; }
.sp-done-plan b { color: var(--text); }
.sp-done-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 36px auto 16px; max-width: 1100px; text-align: left; }
@media (max-width: 820px) { .sp-done-grid { grid-template-columns: 1fr; } }
.sp-done .sp-contact { max-width: 1100px; margin: 0 auto; text-align: left; }
.sp-steps { margin: 0; padding-left: 20px; display: grid; gap: 12px; font-size: 15px; line-height: 1.7; }
.sp-steps .sp-amount-note { display: block; margin-top: 4px; font-size: 12.5px; line-height: 1.6; }
.sp-steps .tool { margin-top: 8px; padding: 8px 14px; font-size: 13px; }
.sp-bank { white-space: pre-line; color: var(--text); font-size: 16px; line-height: 1.9; overflow-wrap: anywhere; } /* 관리자 입력 자유 텍스트 */
.sp-done .sp-bank + .sp-muted { margin-top: 14px; }
