/* ══════════════════════════════════════════════════════════════ 콘텐츠 출력 스타일 — 에디터로 작성한 본문(.svx-content)의 외부/미리보기 렌더. 대상: svndex_content_page_render 가 출력하는 .svx-content (개인정보·약관·환자권리 등). 에디터(.svx-editor-content, svndex-editor.css)와 동일 타이포 — · 제목 = Paperlogy(폴백 Pretendard), 4단(h2~h5), 줄간격 1.3, 상단 여백 넉넉히 · 본문 = 줄간격 1.5, 본문 변형(보조 2단 / 주석) 로드: 콘텐츠를 노출하는 외부 페이지 <head> + 에디터 미리보기 모달. ※ 외부 사이트 기본 글꼴은 Pretendard. 에디터 콘텐츠 제목만 Paperlogy(.svx-content 스코프). ══════════════════════════════════════════════════════════════ */
.svx-content { font-size: 1.125rem; line-height: 1.5; color: #0f172a; }
/* ── 제목 (h2~h5) — Paperlogy, 크기 내림차순, 상단 여백 넉넉 ── */
/* 상위 2종 — 실제 태그는 h2 그대로(문서개요 유지), 크기만 클래스로 얹는다. */
.svx-content h2.svx-h-2xl { font-family: 'Paperlogy','Pretendard',-apple-system,sans-serif; font-size: 2.5rem; font-weight: 600; line-height: 1.3; margin: 1.8em 0 0.5em; }
.svx-content h2.svx-h-xl { font-family: 'Paperlogy','Pretendard',-apple-system,sans-serif; font-size: 2.25rem; font-weight: 600; line-height: 1.3; margin: 1.8em 0 0.5em; }
.svx-content h2 { font-family: 'Paperlogy','Pretendard',-apple-system,sans-serif; font-size: 1.8rem; font-weight: 600; line-height: 1.3; margin: 1.8em 0 0.5em; }
.svx-content h3 { font-family: 'Paperlogy','Pretendard',-apple-system,sans-serif; font-size: 1.6rem; font-weight: 600; line-height: 1.3; margin: 1.7em 0 0.5em; }
.svx-content h4 { font-family: 'Paperlogy','Pretendard',-apple-system,sans-serif; font-size: 1.4rem; font-weight: 500; line-height: 1.3; margin: 1.7em 0 0.5em; }
.svx-content h5 { font-family: 'Paperlogy','Pretendard',-apple-system,sans-serif; font-size: 1.25rem; font-weight: 500; line-height: 1.3; margin: 1.6em 0 0.5em; }
.svx-content h6 { font-size: 0.875rem; font-weight: 400; line-height: 1.5; margin: 1.4em 0 0.4em; color: #475569; }
.svx-content > :first-child { margin-top: 0; }
/* ── 본문 + 변형 (보조 2단 / 주석) ── */
.svx-content p { font-size: 1.125rem; font-weight: 400; line-height: 1.5; margin: 0.7em 0; }
.svx-content p.svx-body-xl { font-size: 1.375rem; }
.svx-content p.svx-body-lg { font-size: 1.25rem; }
.svx-content p.svx-sub { font-size: 1rem; color: #475569; }
.svx-content p.svx-sub2 { font-size: 0.9rem; color: #475569; }
.svx-content p.svx-note { font-size: 0.85rem; color: #475569; }
/* 반응형 — 대형 크기만 축소, 본문 기본·보조/주석은 유지(가독성 유지 목적) */
@media (max-width: 1024px) { .svx-content h2.svx-h-2xl { font-size: 2.2rem; } .svx-content h2.svx-h-xl { font-size: 2rem; } .svx-content h2 { font-size: 1.6rem; } .svx-content p.svx-body-xl { font-size: 1.25rem; } .svx-content p.svx-body-lg { font-size: 1.15rem; } }
@media (max-width: 640px) { .svx-content h2.svx-h-2xl { font-size: 1.9rem; } .svx-content h2.svx-h-xl { font-size: 1.75rem; } .svx-content h2 { font-size: 1.4rem; } .svx-content h3 { font-size: 1.3rem; } .svx-content h4 { font-size: 1.15rem; } .svx-content p.svx-body-xl { font-size: 1.2rem; } .svx-content p.svx-body-lg { font-size: 1.1rem; } }
/* ── 목록 ── */
.svx-content ul { padding-left: 1.6em; margin: 0.7em 0; list-style: disc; }
.svx-content ol { padding-left: 1.6em; margin: 0.7em 0; list-style: decimal; }
.svx-content ul ul { list-style: circle; }
.svx-content ul ul ul { list-style: square; }
.svx-content li { margin: 0.25em 0; line-height: 1.5; }
.svx-content li > p { margin: 0; }
.svx-content li::marker { color: #475569; }
/* 체크 목록(할 일) — 게시판·고객지원 보기와 같은 모양(§2026-10-05 작성 화면 = 보기 화면). 종전엔 점 + 체크 칸 + 다음 줄 글로 깨져 보였다(편집 칸도 같이).
   법정 고지(policy.css)의 목록 점 규칙(.svx-policy .svx-content ul · li)보다 한 단계 높게 — 속성 선택자([data-type]) */
.svx-content ul.svx-editor-tasklist[data-type="taskList"] { list-style: none; padding-left: 0.2em; }
.svx-content ul.svx-editor-tasklist[data-type="taskList"] > li.svx-editor-taskitem { display: grid; grid-template-columns: 20px minmax(0, 1fr); column-gap: 6px; align-items: start; list-style: none; }
.svx-content ul.svx-editor-tasklist[data-type="taskList"] > li.svx-editor-taskitem > label { display: flex; align-items: center; padding-top: 4px; }
.svx-content ul.svx-editor-tasklist[data-type="taskList"] > li.svx-editor-taskitem > label > span { display: none; }
.svx-content ul.svx-editor-tasklist[data-type="taskList"] > li.svx-editor-taskitem > div > p { margin: 0; }
.svx-content ul.svx-editor-tasklist[data-type="taskList"] > li.svx-editor-taskitem > div > ul.svx-editor-tasklist { padding-left: 1.2em; margin: 4px 0; }
/* ── 기타 인라인/블록 ── */
.svx-content blockquote { padding: 8px 16px; margin: 0.9em 0; border-left: 3px solid #cbd5e1; color: #64748b; }
.svx-content hr { border: 0; border-top: 1px solid #e2e8f0; margin: 1.6em 0; }
.svx-content a { color: var(--brand-color, var(--c-primary, #4f46e5)); text-decoration: underline; text-underline-offset: 2px; }
.svx-content mark { background: #fef3c7; color: #92400e; padding: 0 3px; border-radius: 3px; }
.svx-content sup { vertical-align: super; font-size: 0.75em; }
/* 코드 블록 — 긴 줄은 접는다(에디터도 접는다 · 작성 화면 = 보기 화면 §2026-10-05) */
.svx-content pre { white-space: pre-wrap; }
.svx-content sub { vertical-align: sub; font-size: 0.75em; }
/* ── 이미지 (폭 옵션) ── */
.svx-content img.svx-editor-img { max-width: 100%; height: auto; border-radius: 6px; margin: 0.7em 0; display: block; }
.svx-content img.svx-editor-img.svx-img-w-25 { width: 25%; max-width: 25%; }
.svx-content img.svx-editor-img.svx-img-w-50 { width: 50%; max-width: 50%; }
.svx-content img.svx-editor-img.svx-img-w-75 { width: 75%; max-width: 75%; }
.svx-content img.svx-editor-img.svx-img-w-100 { width: 100%; max-width: 100%; }
/* ── 표 (일반 콘텐츠) ── */
.svx-content table { width: 100%; border-collapse: collapse; margin: 1em 0; background: #fff; }
.svx-content th, .svx-content td { border: 1px solid #e2e8f0; padding: 10px 12px; text-align: left; vertical-align: middle; word-break: break-word; }
.svx-content th { background: #f8fafc; font-weight: 600; }
/* ── 문단 정렬 (inline style 보존) ── */
.svx-content [style*="text-align:center"], .svx-content [style*="text-align: center"] { text-align: center; }
.svx-content [style*="text-align:right"], .svx-content [style*="text-align: right"] { text-align: right; }
.svx-content [style*="text-align:justify"], .svx-content [style*="text-align: justify"] { text-align: justify; }
/* ── 서식 다운로드 (svndex_download_render) — 외부 페이지 다운로드 버튼 ── */
.svx-downloads { margin: 2em 0 1em; }
.svx-downloads-title { font-family: 'Paperlogy','Pretendard',-apple-system,sans-serif; font-size: 1.25rem; font-weight: 600; line-height: 1.3; margin: 0 0 0.7em; }
.svx-downloads-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.svx-download-item { margin: 0; flex: 0 1 300px; max-width: 360px; }
@media (max-width: 480px) { .svx-download-item { flex-basis: 100%; max-width: none; } }
.svx-download-link { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; color: #0f172a; text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.svx-download-link:hover { border-color: var(--brand-color, var(--c-primary, #7c3aed)); box-shadow: 0 4px 14px rgba(var(--brand-rgb, 124,58,237),.12); transform: translateY(-1px); }
.svx-download-link .svx-dl-icon { font-size: 1.9rem; color: var(--brand-color, var(--c-primary, #7c3aed)); display: inline-flex; flex: 0 0 auto; }
.svx-download-link .svx-dl-text { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.svx-download-link .svx-dl-name { font-size: 1rem; font-weight: 600; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.svx-download-link .svx-dl-meta { font-size: .8rem; color: #64748b; margin-top: 2px; }
.svx-download-link .svx-dl-arrow { font-size: 1.3rem; color: #94a3b8; display: inline-flex; flex: 0 0 auto; }
.svx-download-link:hover .svx-dl-arrow { color: var(--brand-color, var(--c-primary, #7c3aed)); }
/* ── 동영상 임베드 (반응형) — PC 본문 80% · 모바일 100%, 16:9 ── */
.svx-content .svx-video { position: relative; width: 100%; max-width: 100%; margin: 1.4em auto; aspect-ratio: 16 / 9; background: #000; border-radius: 8px; overflow: hidden; }
.svx-content .svx-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 640px) { .svx-content .svx-video { max-width: 100%; } }
/* ── 버튼 삽입 — 박스 버튼(모서리 5px). 흰/회색 배경=검정 글씨, 나머지=흰 글씨 ── */
.svx-btn { display: inline-block; padding: 10px 22px; border-radius: 5px; font-size: 1rem; font-weight: 600; font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Malgun Gothic', sans-serif; line-height: 1.2; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: opacity .15s ease; }
.svx-btn:hover { opacity: .88; }
.svx-btn-white { background: #ffffff; color: #111827; border-color: #d1d5db; }
.svx-btn-gray { background: #e5e7eb; color: #111827; border-color: #d1d5db; }
.svx-btn-black { background: #1a1d24; color: #ffffff; }
.svx-btn-red { background: #dc2626; color: #ffffff; }
.svx-btn-blue { background: #2563eb; color: #ffffff; }
.svx-btn-green { background: #16a34a; color: #ffffff; }
.svx-btn-purple { background: #7c3aed; color: #ffffff; }