/* 셀러닷컴 약관·정책 문서(terms.php · privacy.php · marketing.php) — 로그인·랜딩 v3 와 같은 톤.
   [2026-10-11] 1단계: 겉모습만 바꿈. 문서 글자와 HTML 구조(클래스 이름)는 예전 그대로이고, 이 파일이 예전 페이지 안 <style> 을 대신한다.
   ・ 글꼴 Pretendard, 먹색 글자, 옅은 회색 바탕 위 흰 카드(로그인 카드와 같은 둥글기·그림자).
   ・ 조 제목은 색 상자 대신 굵은 글자, 목록·안내 상자는 옅은 회색 판으로 통일(실제 서비스 약관 화면처럼 차분하게).
   ・ 다크모드: html[data-theme="dark"] (사이트 다른 화면과 같은 저장값 theme). 색은 전부 아래 변수로. */
:root{
  --ink:#111115;--t2:#4D4D57;--t3:#8A8A94;--line:rgba(17,17,21,.08);--line2:rgba(17,17,21,.14);
  --bg:#F5F5F7;--card:#fff;--soft:#F5F5F7;--warm:#F6F4F0;--brand:#6B6198;--brand-t:rgba(107,97,152,.10);
  --sh2:0 0 0 1px rgba(17,17,21,.05),0 8px 24px rgba(17,17,21,.08);
}
html[data-theme="dark"]{
  --ink:#F0F3F6;--t2:#B4BAC4;--t3:#8A8F9C;--line:rgba(240,243,246,.08);--line2:rgba(240,243,246,.16);
  --bg:#0D1117;--card:#161B22;--soft:#21262D;--warm:#262420;--brand:#A99FE0;--brand-t:rgba(169,159,224,.14);
  --sh2:0 0 0 1px rgba(240,243,246,.08);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{background:var(--bg)}
body{color:var(--ink);font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;font-size:15px;line-height:1.75;letter-spacing:-.01em;word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
a{color:var(--brand)}
strong,b{font-weight:700}

/* 위쪽 막대 — 로고 + 세 문서 탭(includes/legal_nav.php) */
.lg-top{position:sticky;top:0;z-index:10;background:var(--card);background:color-mix(in srgb,var(--card) 88%,transparent);-webkit-backdrop-filter:saturate(180%) blur(12px);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)}
.lg-top-in{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:880px;margin:0 auto;padding:12px 20px}
.lg-brand{display:inline-flex;align-items:center;gap:10px;flex:none;font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink)!important;text-decoration:none}
.lg-brand img{display:block;width:30px;height:30px;border-radius:8px;object-fit:contain}
.sc-wordmark{display:block;flex:none;width:auto;height:.86em;overflow:visible}
.lg-tabs{display:flex;gap:4px}
.lg-tabs a{padding:7px 13px;border-radius:999px;font-size:13.5px;font-weight:600;color:var(--t2);text-decoration:none;white-space:nowrap;transition:background-color 150ms cubic-bezier(.3,0,0,1)}
.lg-tabs a:hover{background:var(--soft)}
.lg-tabs a.on{background:var(--ink);color:var(--card)}

/* 문서 카드 */
.container{max-width:880px;margin:32px auto 72px;padding:48px 52px;background:var(--card);border:0;border-radius:24px;box-shadow:var(--sh2)}
.header{margin:0 0 28px;padding:0 0 24px;border-bottom:1px solid var(--line);text-align:left}
.header h1{margin:0;font-size:30px;line-height:1.3;font-weight:700;letter-spacing:-.025em;color:var(--ink)}
.header p{margin-top:8px;font-size:14px;color:var(--t3)}
.intro{margin:0 0 32px;padding:18px 20px;border:0;border-radius:16px;background:var(--soft);color:var(--t2);font-size:14.5px}
.intro p{margin:0}

/* 조(제1조 …) — 색 상자 대신 굵은 제목 */
.article{margin:0 0 36px}
.article-title{margin:0 0 12px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;font-size:18px;line-height:1.45;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.article-content{padding:0}
.article-content p,.article-content > p{margin:0 0 10px;text-align:left}
.article-content ol,.article-content ul{margin:8px 0 14px 22px}
.article-content li{margin-bottom:6px}
.clause{margin:0 0 10px;padding-left:0}
.clause-number{display:inline-block;margin-right:6px;font-weight:600;color:var(--t3)}

/* 정의·목록 — 옅은 회색 판 */
.definition-list,.restriction-list,.service-list,.bad-post-list,.list,.remedy-list,.cookie-guide{margin:12px 0;padding:16px 20px;border:0;border-radius:16px;background:var(--soft)}
.definition-item{margin:0;padding:10px 0;border:0;border-bottom:1px solid var(--line)}
.definition-item:first-child{padding-top:0}
.definition-item:last-child{padding-bottom:0;border-bottom:0}
.definition-item .number{margin-right:6px;font-weight:600;color:var(--t3)} /* ① 처럼 이미 동그라미 숫자라 배경 원은 안 씀 */
.definition-item .term{font-weight:700;color:var(--ink)}
.restriction-list .item,.service-list .item,.bad-post-list .item,.list .item{position:relative;margin:0 0 6px;padding-left:16px}
.restriction-list .item:last-child,.service-list .item:last-child,.bad-post-list .item:last-child,.list .item:last-child{margin-bottom:0}
.service-list .item::before,.bad-post-list .item::before,.list .item::before{content:"";position:absolute;left:3px;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--t3)}
.restriction-list .item{padding-left:0}
.restriction-list .item::before{content:none}

/* 의무·면책 조항 — 줄로 나눈 목록 */
.duty-list,.disclaimer-list{margin:12px 0}
.duty-item,.disclaimer-item{margin:0;padding:10px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;font-size:15px}
.duty-item:first-child,.disclaimer-item:first-child{padding-top:0}
.duty-item:last-child,.disclaimer-item:last-child{border-bottom:0}
.duty-item .number,.disclaimer-item .number{margin-right:6px;font-weight:600;color:var(--t3)}

/* 안내 상자 */
.notice-box,.info-box,.contact-box{margin:14px 0;padding:16px 18px;border:0;border-radius:16px;background:var(--soft);color:var(--ink)}
.notice-box.warning,.info-box{background:var(--warm)}
.notice-box.info,.info-box.blue{background:var(--brand-t)}
.info-box.gray{background:var(--soft)}
.notice-box p,.info-box p{margin:0 0 6px}
.notice-box p:last-child,.info-box p:last-child{margin-bottom:0}
.contact-box h4{margin:0 0 8px;font-size:15px;font-weight:700;color:var(--ink)}
.contact-box p{margin:0 0 4px;font-size:14px;color:var(--t2)}
.cookie-guide h5{margin:0 0 8px;font-size:14px;font-weight:700;color:var(--ink)}
.cookie-guide ul{list-style:none;margin:0 0 10px}
.cookie-guide ul:last-child{margin-bottom:0}
.cookie-guide li{margin:0;padding:6px 0;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--t2)}
.cookie-guide li:last-child{border-bottom:0}
.remedy-list ol{margin:0 0 0 20px}
.remedy-list li{margin:0;padding:6px 0;border-bottom:1px solid var(--line)}
.remedy-list li:last-child{border-bottom:0}
.sub-item{margin:8px 0 0 2px;padding-left:14px;border-left:2px solid var(--line2)}
.sub-item p{margin:0 0 6px;font-size:14px;color:var(--t2)}

/* 표(위탁 업체 등) */
.delegation-table{width:100%;margin:12px 0;border-collapse:separate;border-spacing:0;border-radius:14px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line2);font-size:14px}
.delegation-table td{padding:11px 14px;border:0;border-bottom:1px solid var(--line);vertical-align:top}
.delegation-table tr:last-child td{border-bottom:0}
.delegation-table td:first-child{width:30%;background:var(--soft);font-weight:600;color:var(--t2)}
.re-delegation{margin-top:12px;padding:14px 16px;border-radius:14px;background:var(--soft)}
.re-delegation strong{color:var(--ink)}
.example-text{font-style:normal;color:var(--t3)}
.comment{display:none}
.marker{display:inline-block;width:6px;height:6px;margin-right:8px;border-radius:50%;background:var(--brand);vertical-align:2px}

/* 부칙·시행일 */
.addendum,.effective-date{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);text-align:left}
.addendum-title{margin:0 0 6px;font-size:18px;font-weight:700;text-align:left;color:var(--ink)}
.addendum-content,.addendum p,.effective-date,.effective-date p{text-align:left;font-size:15px;color:var(--t2)}
.highlight{padding:0 4px;border-radius:4px;background:var(--brand-t)}

/* 휴대폰: 탭은 로고 아래 한 줄(넘치면 옆으로 밀어 보기), 카드 여백 줄이기 */
@media (max-width:640px){
  body{font-size:14.5px}
  .lg-top-in{flex-wrap:wrap;gap:8px;padding:10px 14px}
  .lg-tabs{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .lg-tabs::-webkit-scrollbar{display:none}
  .lg-tabs a{padding:6px 11px;font-size:13px}
  .container{margin:16px 12px 48px;padding:28px 20px;border-radius:20px}
  .header h1{font-size:24px}
  .article-title{font-size:16.5px}
  .definition-list,.restriction-list,.service-list,.bad-post-list,.list,.remedy-list,.cookie-guide{padding:14px 16px}
  .delegation-table{font-size:13.5px}
  .delegation-table td{padding:9px 11px}
  .delegation-table td:first-child{width:36%}
}
@media (prefers-reduced-motion:reduce){.lg-tabs a{transition:none}}
@media print{.lg-top{display:none}.container{margin:0;padding:0;box-shadow:none}}
/* [2026-10-12] 회원가입 '보기' 창 안(?embed=1): 카드 테두리·그림자·바깥 여백을 빼서 창 안에 꽉 차게 */
html.lg-embed,html.lg-embed body{background:var(--card)}
.lg-embed .container{max-width:none;margin:0;padding:4px 6px 16px;border-radius:0;box-shadow:none}