/* BASIC css start */
/* ===================== 모바일 Q&A 목록 (리뉴얼) ===================== */
/* 변수(--ink-xxx, --f-serif, --f-mono)는 상단(header) 디자인 :root 에서 상속 */

#container.m-nt-page { background: #fff; padding: 0 0 40px; }
.m-nt-page *, .m-nt-page *:before, .m-nt-page *:after { box-sizing: border-box; }
.m-nt-page a { text-decoration: none; }
.m-nt-page ul, .m-nt-page li { list-style: none; margin: 0; padding: 0; }

/* ===== HERO ===== */
.m-nt-hero { padding: 24px 16px 18px; background: #fff; }
.m-nt-lead-en { font-family: var(--f-mono); font-size: 11px; font-weight: 600; letter-spacing: .22em; color: var(--ink-500); margin: 0 0 6px; text-transform: uppercase; }
.m-nt-headline { font-family: var(--f-serif); font-size: 32px; font-weight: 900; line-height: 1.15; letter-spacing: -.03em; color: var(--ink-950); margin: 0 0 10px; }
.m-nt-lead { font-size: 13px; line-height: 1.6; color: var(--ink-700); margin: 0; letter-spacing: -.01em; }

/* ===== 고객센터 서브 탭 ===== */
.m-nt-tabs { display: flex; gap: 7px; padding: 0 16px 16px; overflow-x: auto; white-space: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.m-nt-tabs::-webkit-scrollbar { display: none; }
.m-nt-tab { flex-shrink: 0; padding: 8px 14px; border: 1px solid var(--ink-100); border-radius: 999px; font-size: 13px; font-weight: 500; color: var(--ink-700); letter-spacing: -.01em; line-height: 1.2; }
.m-nt-tab.is-active { background: var(--ink-950); border-color: var(--ink-950); color: #fff; font-weight: 700; }

/* ===== 섹션 헤드 ===== */
.m-nt-sect-head { padding: 0 16px 12px; margin: 0 0 14px; border-bottom: 1px solid var(--ink-950); }
.m-nt-sect-kicker { font-family: var(--f-mono); font-size: 10.5px; font-weight: 600; letter-spacing: .22em; color: var(--ink-500); margin: 0 0 8px; text-transform: uppercase; }
.m-nt-sect-title { font-family: var(--f-serif); font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--ink-950); margin: 0; line-height: 1.25; }

/* ===== 액션 버튼 (나의 문의 내역 / 문의하기) ===== */
.m-qa-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 16px 14px; }
.m-qa-btn { display: inline-flex; align-items: center; justify-content: center; height: 44px; border: 1px solid var(--ink-950); border-radius: 2px; font-size: 13px; font-weight: 600; color: var(--ink-950); letter-spacing: -.01em; background: #fff; }
.m-qa-btn.is-primary { background: var(--ink-950); color: #fff; }

/* ===== 답변시간 안내 ===== */
.m-qa-notice { margin: 0 16px 16px; padding: 16px 16px 15px; background: var(--ink-050); border-left: 3px solid var(--ink-950); border-radius: 0 6px 6px 0; }
.m-qa-notice .n-h { font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: .22em; color: var(--ink-950); margin: 0 0 7px; text-transform: uppercase; }
.m-qa-notice p { margin: 0; font-size: 12.5px; line-height: 1.65; color: var(--ink-700); letter-spacing: -.01em; }
.m-qa-notice p strong { color: var(--ink-950); font-weight: 700; }

/* ===== 카운트 ===== */
.m-nt-count { display: flex; justify-content: space-between; align-items: baseline; padding: 0 16px 10px; font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .1em; color: var(--ink-500); text-transform: uppercase; }
.m-nt-count .v { color: var(--ink-950); font-weight: 700; }

/* ===== 리스트 ===== */
.m-nt-list { margin: 0 16px; border-top: 1px solid var(--ink-950); }
.m-nt-row { position: relative; display: block; padding: 15px 2px; border-bottom: 1px solid var(--ink-100); }
.m-nt-row.is-reply { padding-left: 14px; }
.m-nt-line { display: flex; align-items: baseline; gap: 10px; }
.m-nt-tag { display: inline-flex; align-items: center; padding: 3px 8px; border: 1px solid var(--ink-300); border-radius: 2px; font-size: 11px; font-weight: 600; color: var(--ink-700); line-height: 1.3; letter-spacing: -.01em; }
.m-nt-new { display: inline-flex; align-items: center; justify-content: center; min-width: 15px; height: 15px; padding: 0 4px; margin-left: 5px; border-radius: 2px; background: var(--signal); color: #fff; font-family: var(--f-mono); font-size: 9.5px; font-weight: 700; line-height: 1; vertical-align: 1px; }
.m-nt-re { font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: .12em; color: var(--ink-400); margin-right: 4px; white-space: nowrap; }
/* 글번호는 총 건수 계산용으로만 두고 화면에서는 감춤 */
.m-nt-num { display: none; }
.m-nt-title { flex: 1; min-width: 0; margin: 0; font-size: 14px; font-weight: 500; line-height: 1.5; color: var(--ink-900); letter-spacing: -.01em; }
.m-nt-title a { color: var(--ink-900); display: inline; }
.m-nt-title a:after { content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; }
.m-nt-row.is-reply .m-nt-title, .m-nt-row.is-reply .m-nt-title a { color: var(--ink-700); }
.m-nt-del { display: block; font-size: 11px; color: var(--ink-500); margin-bottom: 4px; }
.m-nt-cmt { font-family: var(--f-mono); font-size: 11px; font-weight: 500; color: var(--ink-500); margin-left: 5px; }
.m-nt-cmt:before { content: "("; color: var(--ink-300); }
.m-nt-cmt:after { content: ")"; color: var(--ink-300); }
.m-nt-meta { display: flex; align-items: center; gap: 7px; margin-top: 8px; font-family: var(--f-mono); font-size: 10.5px; color: var(--ink-500); letter-spacing: .04em; }
.m-nt-writer { font-family: var(--f-serif); font-style: italic; font-weight: 700; font-size: 11px; color: var(--ink-950); letter-spacing: -.02em; }
.m-nt-sep { color: var(--ink-300); }
.m-nt-empty { padding: 48px 0; text-align: center; font-size: 13px; color: var(--ink-500); border-bottom: 1px solid var(--ink-100); }

/* ===== 답변 상태 배지 ===== */
.m-qa-stat { flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; color: var(--ink-900); }
.m-qa-stat:before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ink-900); flex-shrink: 0; }
.m-qa-stat.is-done { color: var(--ink-500); }
.m-qa-stat.is-done:before { background: var(--ink-400); }
.m-qa-stat.is-wait { color: var(--signal); }
.m-qa-stat.is-wait:before { background: var(--signal); }
.m-qa-stat span { display: inline; }

/* ===== 페이지네이션 ===== */
.m-nt-pager { display: flex; justify-content: center; align-items: center; gap: 3px; padding: 24px 16px 6px; }
.m-nt-pager a { min-width: 34px; height: 34px; padding: 0 9px; display: inline-flex; align-items: center; justify-content: center; font-family: var(--f-mono); font-size: 12px; font-weight: 600; color: var(--ink-700); border: 1px solid transparent; border-radius: 2px; }
.m-nt-pager a.is-current { background: var(--ink-950); color: #fff; border-color: var(--ink-950); }
.m-nt-pager .pg-arrow { color: var(--ink-400); }
.m-nt-pager .pg-arrow svg { display: block; }

/* BASIC css end */