/* =========================================================
   공통 레이어 (모든 페이지) — 헤더 고정, 진행 바, 맨 위로 버튼, 푸터
   색: 레드 #FF2B3E / 블루 #2F6BFF / 배경 #0E1015
   ========================================================= */
html{scroll-behavior:auto}

/* 헤더: 스크롤해도 위에 고정 */
header.m-head{position:sticky!important;top:0;z-index:60!important;transition:padding .3s}
header.m-head::before{content:"";position:absolute;inset:0 calc(50% - 50vw);z-index:-1;background:rgba(14,16,21,0);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);border-bottom:1px solid transparent;transition:background .3s,border-color .3s}
header.m-head.cx-scrolled::before{background:rgba(14,16,21,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom-color:rgba(255,255,255,.08)}
header.top.cx-scrolled{box-shadow:0 8px 24px rgba(0,0,0,.35)}

/* 스크롤 진행 바 */
.cx-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:100;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#FF2B3E,#2F6BFF);pointer-events:none}

/* 맨 위로 버튼 */
.cx-top{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));z-index:90;width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(14,16,21,.88);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;font:700 10px/1 'Saira Condensed','Arial Narrow',sans-serif;letter-spacing:.12em;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .3s,transform .3s,visibility .3s,background .2s,border-color .2s}
.cx-top.show{opacity:1;visibility:visible;transform:none}
.cx-top:hover{background:#FF2B3E;border-color:#FF2B3E}
.cx-top:focus-visible{outline:3px solid #FF2B3E;outline-offset:3px}
@media (max-width:860px){body:has(.dock) .cx-top{bottom:calc(92px + env(safe-area-inset-bottom))}}

/* ---------- 푸터 ---------- */
footer.cx-foot{padding:0!important;border-top:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7);font-size:15px;word-break:keep-all}
.cx-fwrap{max-width:1280px;margin:0 auto;padding:56px 32px 40px;box-sizing:border-box}
.cx-fgrid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px}
.cx-brand{display:flex;flex-direction:column;gap:14px}
.cx-brand a{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.cx-brand img{width:40px;height:40px;border-radius:5px;object-fit:contain;background:#fff;padding:2px;box-sizing:border-box}
.cx-brand b{font-family:'Saira Condensed','Arial Narrow',sans-serif;font-weight:800;font-size:22px}
.cx-brand b i{font-style:normal;color:#FF2B3E}
.cx-brand p{margin:0;font-size:14px;color:rgba(255,255,255,.55)}
.cx-col{display:flex;flex-direction:column;gap:10px}
footer.cx-foot h2{margin:0 0 4px;font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.12em;color:rgba(255,255,255,.5)}
.cx-col a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);text-underline-offset:3px}
.cx-col a:hover{text-decoration-color:#FF2B3E}
.cx-copyrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.cx-copyrow code{font-family:'Inter',sans-serif;font-size:15px;color:#fff}
.cx-copy{height:30px;padding:0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;font-size:12px;cursor:pointer}
.cx-copy:hover{border-color:#FF2B3E}
.cx-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}
.cx-menu a{text-decoration:none;color:rgba(255,255,255,.8)}
.cx-menu a:hover{color:#fff}

.cx-legal{border-top:1px solid rgba(255,255,255,.08);margin-top:40px;padding-top:24px;display:flex;flex-direction:column;gap:12px;font-size:13px;line-height:1.7;color:rgba(255,255,255,.5)}
.cx-policy{display:flex;flex-wrap:wrap;gap:6px 18px}
.cx-policy a{color:rgba(255,255,255,.75);text-decoration:none}
.cx-policy a.cx-privacy{color:#fff;font-weight:700}
.cx-policy a:hover{text-decoration:underline}
.cx-biz{margin:0;display:flex;flex-wrap:wrap;gap:2px 0}
.cx-biz span{white-space:nowrap}
.cx-biz span:not(:last-child)::after{content:"|";margin:0 10px;color:rgba(255,255,255,.2)}
.cx-legal p{margin:0}
.cx-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px}
.cx-bottom em{font-style:normal;font-family:'Saira Condensed','Arial Narrow',sans-serif;font-weight:700;font-size:14px;letter-spacing:.1em}

@media (max-width:860px){
  .cx-fgrid{grid-template-columns:1fr 1fr}
  .cx-brand{grid-column:1/-1}
  footer.cx-foot{padding-bottom:84px!important}
  body:not(:has(.dock)) footer.cx-foot{padding-bottom:0!important}
}
@media (max-width:560px){
  .cx-fwrap{padding:44px 20px 32px}
  .cx-fgrid{grid-template-columns:1fr}
  .cx-biz{flex-direction:column}
  .cx-biz span{white-space:normal}
  .cx-biz span::after{display:none}
}

/* ---------- 개인정보처리방침 페이지 ---------- */
.cx-doc{max-width:var(--wrap,1200px);margin:0 auto;padding:8px max(16px,env(safe-area-inset-left,0px)) 96px;box-sizing:border-box;line-height:1.8;font-size:16px;color:rgba(255,255,255,.82);word-break:keep-all}
.cx-doc>*{max-width:860px}
.cx-doc .cx-meta{margin:0 0 28px;color:rgba(255,255,255,.55);font-size:14px}
.cx-doc .cx-toc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 24px;padding:20px 24px;margin:0 0 40px;border:1px solid rgba(255,255,255,.1);border-radius:7px;background:rgba(255,255,255,.03);list-style:none;font-size:14px}
.cx-doc .cx-toc a{color:rgba(255,255,255,.8);text-decoration:none}
.cx-doc .cx-toc a:hover{color:#fff;text-decoration:underline}
.cx-doc h2{margin:44px 0 12px;font-size:20px;color:#fff;font-weight:700;font-family:inherit;scroll-margin-top:96px}
.cx-doc p,.cx-doc ul,.cx-doc ol{margin:0 0 12px}
.cx-doc ul,.cx-doc ol{padding-left:20px}
.cx-doc li{margin:4px 0}
.cx-doc strong{color:#fff}
.cx-doc a{color:#fff}
.cx-doc .cx-tbl{overflow-x:auto;margin:8px 0 16px}
.cx-doc table{width:100%;min-width:520px;border-collapse:collapse;font-size:14px}
.cx-doc th,.cx-doc td{border:1px solid rgba(255,255,255,.14);padding:10px 12px;text-align:left;vertical-align:top}
.cx-doc th{background:rgba(255,255,255,.05);color:#fff;font-weight:600;white-space:nowrap}
@media (max-width:560px){.cx-doc{padding:0 16px 72px;font-size:15px}.cx-doc .cx-toc{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){.cx-top,header.m-head::before{transition:none}}