/* 이용약관 · 개인정보처리방침 (KO / en/ / ja/)
   Buy the Rumor의 도트 문법: Endesga 32 색, 테두리 없는 어두운 판, 호박색 제목과 링크.
   글꼴은 자기 픽셀 크기의 정수배에서만(번짐 없음): Galmuri14 = 15px(본문), Galmuri11 = 12·24·48px(작은 글씨·제목·한국어 로고),
   Tiny5 = 8의 배수(SHOBO 로고), Silkscreen = 16px(KO/EN/JA). 가짜 굵게는 쓰지 않고 강조는 흰색으로.
   글꼴 파일은 약관에 쓰인 글자만 잘라 둔 것: 글을 고치면 tools/legal_fonts.py를 다시 돌린다 */
@font-face { font-family:'Galmuri14'; src:url(fonts/galmuri14.woff2) format('woff2'); font-display:swap; }
@font-face { font-family:'Galmuri11'; src:url(fonts/galmuri11.woff2) format('woff2'); font-display:swap; }
@font-face { font-family:'Tiny5'; src:url(fonts/tiny5.woff2) format('woff2'); font-display:swap; }
@font-face { font-family:'Silkscreen'; src:url(fonts/silkscreen.woff2) format('woff2'); font-display:swap; }

:root {
  --bg:#181425; --panel:#262b44; --panel2:#3a4466; --line:#3a4466;
  --tx:#c0cbdc; --hi:#ffffff; --mut:#8b9bb4;
  --acc:#feae34; --blue:#0099db; --warn-bg:#3e2731; --warn:#f6757a;
  --body:'Galmuri14','Galmuri11',system-ui,sans-serif;
  --small:'Galmuri11',system-ui,sans-serif;
}
*, *::before, *::after { box-sizing:border-box; }
html { background:var(--bg); }
body { margin:0; padding:0; background:var(--bg); color:var(--tx); min-height:100dvh;
  font-family:var(--body); font-size:15px; line-height:26px; font-weight:400; font-synthesis:none;
  -webkit-font-smoothing:none; -moz-osx-font-smoothing:auto; text-rendering:optimizeSpeed; }
html:lang(ko) body { word-break:keep-all; overflow-wrap:anywhere; }
html:lang(ja) body { line-break:strict; }
/* 독일어는 합성어가 길어(Datenschutzbeauftragter 등) 좁은 폰에서 줄 밖으로 나가므로 음절에서 끊는다 */
html:lang(de) body, html:lang(es) body { overflow-wrap:break-word; hyphens:auto; -webkit-hyphens:auto; }
strong, b { font-weight:400; color:var(--hi); }

a { color:var(--acc); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
a:hover { color:var(--hi); }
a:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }

.wrap { max-width:720px; margin:0 auto;
  padding:calc(32px + env(safe-area-inset-top)) 22px calc(48px + env(safe-area-inset-bottom)); }

/* 머리 */
.top { margin-bottom:36px; }
.back { display:inline-flex; align-items:center; height:32px; padding:0 12px; margin:0 10px 24px 0; vertical-align:middle;
  font-family:var(--small); font-size:12px; line-height:12px; color:var(--tx); background:var(--panel); text-decoration:none; }
.back:hover { color:var(--hi); background:var(--panel2); }
.lang-sw { display:inline-flex; vertical-align:middle; margin:0 0 24px; background:var(--panel); }
.lang-sw a, .lang-sw span { display:flex; align-items:center; height:32px; padding:0 10px;
  font-family:'Silkscreen',var(--small); font-size:16px; line-height:16px; color:var(--mut); text-decoration:none; }
.lang-sw a:hover { color:var(--hi); }
.lang-sw .on { background:var(--acc); color:var(--bg); }
.logo { font-family:'Tiny5','Galmuri11',sans-serif; font-size:48px; line-height:48px; color:var(--acc); margin:0 0 12px; }
.page-title { font-family:var(--small); font-size:24px; line-height:32px; color:var(--hi); margin:0 0 8px; }
.updated { font-family:var(--small); font-size:12px; line-height:20px; color:var(--mut); }
.rev { margin-top:16px; padding:12px 14px; background:var(--warn-bg); font-family:var(--small); font-size:12px; line-height:20px; color:var(--tx); }
.rev b { color:var(--acc); margin-right:6px; }

/* 조항 판 */
.card { background:var(--panel); padding:24px 22px; margin-bottom:16px; }
.card h2 { font-family:var(--small); font-size:24px; line-height:32px; font-weight:400; color:var(--acc); margin:0 0 14px; }
.card h3 { font-family:var(--body); font-size:15px; line-height:26px; font-weight:400; color:var(--hi); margin:22px 0 8px; }
.card p, .card li { margin:0 0 10px; }
.card ul, .card ol { padding-left:22px; margin:8px 0 12px; }
.card li { margin-bottom:6px; }
.card li::marker { color:var(--mut); }
.hl { color:var(--acc); }
.tag { display:inline-block; padding:0 8px; margin-right:6px; vertical-align:1px;
  font-family:var(--small); font-size:12px; line-height:24px; color:var(--hi); background:var(--panel2); }
.note { margin-top:14px; padding:12px 14px; background:var(--bg); font-family:var(--small); font-size:12px; line-height:20px; color:var(--mut); }
.warn { margin:4px 0 16px; padding:14px 16px; background:var(--warn-bg); color:var(--warn); }
.warn strong { color:var(--hi); }

/* 처리 위탁 표 */
.tbl { overflow-x:auto; margin:8px 0 14px; }
.card table { width:100%; border-collapse:collapse; font-size:15px; line-height:24px; overflow-wrap:normal; word-break:keep-all; }
.card th, .card td { padding:8px 10px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line); }
.card th { font-weight:400; color:var(--hi); background:var(--panel2); border-bottom:0; }

/* 바닥 */
.foot { text-align:center; margin-top:36px; padding-top:24px; font-family:var(--small); font-size:12px; line-height:20px; color:var(--mut); }
.foot .logo-sm { font-family:'Tiny5','Galmuri11',sans-serif; font-size:24px; line-height:24px; color:var(--acc); margin-bottom:10px; }

@media (max-width:480px) {
  .wrap { padding-left:16px; padding-right:16px; }
  .card { padding:20px 16px; }
  .card table { font-family:var(--small); font-size:12px; line-height:20px; }
  .card th, .card td { padding:8px 6px; }
}
