@font-face {
  font-family: "Legal Pretendard";
  src: url("/shared-header/pretendard.9599f12fd42fc0bc.woff2") format("woff2"), url("/shared-header/pretendard.woff2") format("woff2");
  font-style: normal; font-weight: 100 900; font-display: swap;
}
.legal-page {
  color-scheme: light;
  --legal-bg: #efeef3; --legal-panel: #fbfafd; --legal-raised: #eae9ef;
  --legal-hair: #e4e3ea; --legal-sep: #d3d2db;
  --legal-ink: #26252c; --legal-muted: #4d4c55; --legal-title: #16151b; --legal-body: #24232a;
  --legal-lav: #2d0a4b; --legal-lav-t: #62309f; --legal-on-lav: #fff;
  --mint: var(--legal-lav-t);
  margin: 0; min-width: 0; min-height: 100svh;
  background: var(--legal-bg); color: var(--legal-ink);
  font-family: "Legal Pretendard", "Pretendard Variable", Pretendard, -apple-system,
    BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 16px; line-height: 1.8; letter-spacing: -0.015em;
  -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%;
}
.dark .legal-page, [data-theme="dark"] .legal-page, .legal-page.dark {
  color-scheme: dark;
  --legal-bg: #131317; --legal-panel: #1e1e23; --legal-raised: #26262d;
  --legal-hair: #2e2e35; --legal-sep: #44444e;
  --legal-ink: #d3d3da; --legal-muted: #bdbdc6; --legal-title: #e2e2e8; --legal-body: #d6d6dc;
  --legal-lav: #b285ea; --legal-lav-t: #c89fff; --legal-on-lav: #000;
}
.legal-page *, .legal-page *::before, .legal-page *::after { box-sizing: border-box; }
.legal-page a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
.legal-page h1, .legal-page h2, .legal-page h3, .legal-page p, .legal-page ul { margin: 0; }
.legal-page a:focus-visible, .legal-page [tabindex]:focus-visible {
  outline: 2px solid var(--legal-lav-t); outline-offset: 4px;
}
.legal-page ::selection { background: var(--legal-lav); color: var(--legal-on-lav); }
/* 좌우 끝은 머리글·뉴스 피드·앱 설치와 같다(웹: 1152px 안에서 25.6px, 1180px 미만: 16px) */
.legal-page .legal-layout { width: 100%; max-width: 1152px; margin: 0 auto; padding: 36px 25.6px 56px; }
.legal-page .back {
  display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 20px;
  padding: 8px 14px; border: 1px solid var(--legal-hair); border-radius: 8px;
  background: var(--legal-panel); color: var(--legal-muted); font-size: 14px; font-weight: 650;
}
.legal-page .back:hover { border-color: var(--legal-sep); background: var(--legal-raised); color: var(--legal-ink); }
.legal-page .legal-document, .legal-page .legal-archive > :is(.wrap, .policy) {
  min-width: 0; padding: 40px 52px; border: 1px solid var(--legal-hair); border-radius: 12px;
  background: var(--legal-panel); color: var(--legal-body); word-break: keep-all; overflow-wrap: anywhere;
}
.legal-page .legal-document > h1, .legal-page .legal-archive > :is(.wrap, .policy) > h1 {
  color: var(--legal-title); font-size: 34px; font-weight: 800; letter-spacing: -0.035em; line-height: 1.4;
}
.legal-page .legal-terms > h1 { margin-bottom: 28px; padding-bottom: 24px; border-bottom: 1px solid var(--legal-hair); }
.legal-page .legal-document .updated, .legal-page .legal-archive > :is(.wrap, .policy) .updated {
  margin: 12px 0 32px; padding-bottom: 24px; border-bottom: 1px solid var(--legal-hair);
  color: var(--legal-muted); font-size: 13px; font-weight: 500; line-height: 1.7;
}
.legal-page .legal-document h2, .legal-page .legal-archive > :is(.wrap, .policy) h2 {
  margin: 40px 0 18px; padding-left: 14px; border-left: 3px solid var(--legal-lav);
  color: var(--legal-title); font-size: 22px; font-weight: 750; letter-spacing: -0.025em; line-height: 1.55;
}
.legal-page .legal-terms > h1 + .section > h2 {
  margin-top: 0; padding-left: 0; border-left: 0; color: var(--legal-ink); font-size: 20px;
}
.legal-page .legal-document h3, .legal-page .legal-archive > :is(.wrap, .policy) h3 {
  margin: 32px 0 14px; color: var(--legal-title); font-size: 18px; font-weight: 750;
  letter-spacing: -0.02em; line-height: 1.65;
}
.legal-page .legal-document p, .legal-page .legal-document li, .legal-page .legal-archive > :is(.wrap, .policy) p, .legal-page .legal-archive > :is(.wrap, .policy) li {
  color: var(--legal-body); font-size: 16px; line-height: 1.95;
}
.legal-page .legal-document p, .legal-page .legal-archive > :is(.wrap, .policy) p { margin-bottom: 18px; }
.legal-page .legal-document ul, .legal-page .legal-archive > :is(.wrap, .policy) ul { margin-bottom: 20px; padding-left: 24px; }
.legal-page .legal-document li, .legal-page .legal-archive > :is(.wrap, .policy) li { margin-bottom: 10px; padding-left: 2px; }
.legal-page .legal-document strong, .legal-page .legal-archive > :is(.wrap, .policy) strong { color: var(--legal-title); font-weight: 750; }
.legal-page .legal-document a, .legal-page .legal-archive > :is(.wrap, .policy) a {
  color: var(--legal-lav-t); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.legal-page .legal-document a:hover, .legal-page .legal-archive > :is(.wrap, .policy) a:hover { text-decoration-thickness: 2px; }
.legal-page .legal-document .section, .legal-page .legal-archive > :is(.wrap, .policy) .section { margin: 0; padding: 0; border: 0; background: transparent; }
.legal-page .legal-document .operator-info, .legal-page .legal-archive > :is(.wrap, .policy) .operator-info {
  margin: 24px 0 32px; padding: 20px 24px;
  border: 1px solid var(--legal-hair); border-radius: 8px; background: var(--legal-raised);
}
.legal-page .legal-document .operator-info p, .legal-page .legal-archive > :is(.wrap, .policy) .operator-info p { margin-bottom: 8px; font-size: 14px; line-height: 1.85; }
.legal-page .legal-document .operator-info p:last-child, .legal-page .legal-archive > :is(.wrap, .policy) .operator-info p:last-child { margin-bottom: 0; }
.legal-page .legal-document .divider, .legal-page .legal-archive > :is(.wrap, .policy) .divider { margin: 40px 0; border: 0; border-top: 1px solid var(--legal-hair); }
.legal-page .legal-document .divider + .section > h2, .legal-page .legal-archive > :is(.wrap, .policy) .divider + .section > h2 { margin-top: 0; }
.legal-page .legal-terms > p:last-child {
  margin-top: 28px; margin-bottom: 0; padding-top: 24px; border-top: 1px solid var(--legal-hair); font-size: 14px;
}
.legal-page .legal-privacy > p:last-child { margin-bottom: 0; }
/* 이전 약관·방침(/legal/history) — 문서 본문은 시행 당시 마크업 그대로라 바깥(.legal-archive)에서 같은 모양을 입힌다 */
.legal-page .legal-archive-note {
  margin: 0 0 16px; padding: 12px 16px; border: 1px solid var(--legal-hair); border-radius: 8px;
  background: var(--legal-raised); color: var(--legal-ink); font-size: 14px; font-weight: 600; line-height: 1.7;
}
.legal-page .legal-archive-note a {
  color: var(--legal-lav-t); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}
/* 옛 본문 안의 '돌아가기'(첫 화면으로)는 숨기고, 바깥 '돌아가기'(현재 이용약관)를 쓴다 — 두 이전 문서가 같은 모양 */
.legal-page .legal-archive > .wrap > .back { display: none; }
.legal-page .legal-archive > .wrap > h1 { margin-bottom: 28px; padding-bottom: 24px; border-bottom: 1px solid var(--legal-hair); }
.legal-page .legal-archive > .wrap > h1 + .section > h2 {
  margin-top: 0; padding-left: 0; border-left: 0; color: var(--legal-ink); font-size: 20px;
}
.legal-page .legal-table-scroll {
  max-width: 100%; margin: 24px 0; overflow-x: auto; overscroll-behavior-x: contain;
  border: 1px solid var(--legal-hair); border-radius: 8px;
  scrollbar-width: thin; scrollbar-color: var(--legal-sep) transparent;
}
.legal-page .legal-document table, .legal-page .legal-archive > :is(.wrap, .policy) table {
  width: 100%; min-width: 680px; margin: 0; border-collapse: collapse;
  color: var(--legal-body); font-size: 14px; line-height: 1.8; letter-spacing: -0.015em;
}
.legal-page .legal-document th, .legal-page .legal-document td, .legal-page .legal-archive > :is(.wrap, .policy) th, .legal-page .legal-archive > :is(.wrap, .policy) td {
  padding: 14px 16px; border-bottom: 1px solid var(--legal-hair); text-align: left; vertical-align: top;
}
.legal-page .legal-document th, .legal-page .legal-archive > :is(.wrap, .policy) th {
  background: var(--legal-raised); color: var(--legal-muted);
  font-size: 13px; font-weight: 700; line-height: 1.7;
}
.legal-page .legal-document th:first-child, .legal-page .legal-document td:first-child, .legal-page .legal-archive > :is(.wrap, .policy) th:first-child, .legal-page .legal-archive > :is(.wrap, .policy) td:first-child { width: 20%; min-width: 130px; }
.legal-page .legal-document th:nth-child(2), .legal-page .legal-document td:nth-child(2), .legal-page .legal-archive > :is(.wrap, .policy) th:nth-child(2), .legal-page .legal-archive > :is(.wrap, .policy) td:nth-child(2) { width: 45%; }
.legal-page .legal-document tbody tr:last-child td, .legal-page .legal-archive > :is(.wrap, .policy) tbody tr:last-child td { border-bottom: 0; }
/* 이전 방침의 표는 가로 스크롤 틀이 없어 폰에서는 칸 안에서 줄을 바꾼다 */
.legal-page .legal-archive > .policy table { min-width: 0; margin: 24px 0; border: 1px solid var(--legal-hair); }
.legal-page .g-footer {
  padding: 28px 24px 36px; border-top: 1px solid var(--legal-hair);
  color: var(--legal-muted); font-size: 12px; line-height: 1.8; text-align: center;
}
.legal-page .g-footer-links {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: 4px 20px; margin-bottom: 12px;
}
.legal-page .g-footer-links a {
  display: inline-flex; align-items: center; min-height: 36px;
  color: var(--legal-muted); font-size: 13px; font-weight: 500;
}
.legal-page .g-footer-links a:hover {
  color: var(--legal-lav-t); text-decoration: underline; text-underline-offset: 4px;
}
@media (max-width: 767.98px) {
  /* 폰: 이전 방침 표는 칸을 짓누르지 않고 표 자체를 옆으로 민다(현재 방침의 스크롤 틀과 같은 효과) */
  .legal-page .legal-archive > .policy table { display: block; overflow-x: auto; overscroll-behavior-x: contain; }
  .legal-page .legal-archive > .policy table :is(th, td):nth-child(n) { width: auto; min-width: 150px; }
}
@media (max-width: 1179.98px) {
  .legal-page .legal-layout { padding-right: 16px; padding-left: 16px; }
}
@media (max-width: 767.98px) {
  .legal-page .legal-layout { padding: 24px 16px 36px; }
  .legal-page .back { margin-bottom: 16px; }
.legal-page .legal-document, .legal-page .legal-archive > :is(.wrap, .policy) { padding: 28px 24px; }
.legal-page .legal-document > h1, .legal-page .legal-archive > :is(.wrap, .policy) > h1 { font-size: 28px; }
.legal-page .legal-document .updated, .legal-page .legal-archive > :is(.wrap, .policy) .updated { margin-bottom: 28px; }
.legal-page .legal-document h2, .legal-page .legal-archive > :is(.wrap, .policy) h2 { margin-top: 32px; padding-left: 12px; font-size: 20px; }
  .legal-page .legal-terms > h1 + .section > h2 { font-size: 18px; }
.legal-page .legal-document h3, .legal-page .legal-archive > :is(.wrap, .policy) h3 { margin-top: 28px; font-size: 17px; }
.legal-page .legal-document p, .legal-page .legal-document li, .legal-page .legal-archive > :is(.wrap, .policy) p, .legal-page .legal-archive > :is(.wrap, .policy) li { font-size: 15.5px; }
.legal-page .legal-document .operator-info, .legal-page .legal-archive > :is(.wrap, .policy) .operator-info { margin: 20px 0 28px; padding: 18px; }
.legal-page .legal-document .divider, .legal-page .legal-archive > :is(.wrap, .policy) .divider { margin: 32px 0; }
  .legal-page .g-footer { padding: 24px 20px 32px; }
}
@media (max-width: 359.98px) {
  .legal-page .legal-layout { padding-top: 20px; padding-bottom: 32px; }
.legal-page .legal-document, .legal-page .legal-archive > :is(.wrap, .policy) { padding: 24px 20px; }
.legal-page .legal-document > h1, .legal-page .legal-archive > :is(.wrap, .policy) > h1 { font-size: 26px; }
}