/**
 * 고객센터 문서·게시글 본문 SSOT
 *
 * 이전에는 홍보 현수막 상세용 `.pld-body`(본문 1fr + 사이드 300px 그리드)를 재사용해
 * 문서 텍스트가 960px 중 636px 만 쓰고 나머지는 빈 칸으로 남았다.
 * 문서 화면은 사이드 컬럼이 없으므로 본문이 컨테이너 폭(최대 960px)을 그대로 쓴다.
 */

.cs-doc-body {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 8px 0 0;
  font-size: var(--fs-base, 16px);
  line-height: 1.8;
  color: #1e293b;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.cs-doc-body > p,
.cs-doc-body > div {
  margin: 0 0 14px;
}

.cs-doc-body > p:last-child,
.cs-doc-body > div:last-child {
  margin-bottom: 0;
}

.cs-doc-body h2,
.cs-doc-body h3,
.cs-doc-body h4 {
  margin: 24px 0 10px;
  font-size: var(--fs-lg, 18px);
  font-weight: 700;
  line-height: 1.4;
  color: #0f172a;
}

.cs-doc-body ul,
.cs-doc-body ol {
  margin: 0 0 14px;
  padding-left: 20px;
}

.cs-doc-body li {
  margin: 0 0 6px;
}

.cs-doc-body a {
  color: var(--pub-accent, #0a4d8c);
  text-decoration: underline;
}

.cs-doc-body img {
  max-width: 100%;
  height: auto;
}

.cs-doc-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 14px;
  font-size: var(--fs-sm, 15px);
}

.cs-doc-body th,
.cs-doc-body td {
  border: 1px solid #e2e8f0;
  padding: 8px 10px;
  text-align: left;
}

/* 답변·부가 블록 — 본문과 같은 폭, 구분선만 추가 */
.cs-doc-body--reply {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #e2e8f0;
}

.cs-doc-body--reply > strong {
  display: block;
  margin-bottom: 8px;
  font-size: var(--fs-md, 17px);
  color: #0f172a;
}

@media (max-width: 768px) {
  .cs-doc-body {
    line-height: 1.7;
  }
}

html[data-theme="dark"] .cs-doc-body {
  color: #e2e8f0;
}

html[data-theme="dark"] .cs-doc-body h2,
html[data-theme="dark"] .cs-doc-body h3,
html[data-theme="dark"] .cs-doc-body h4 {
  color: #f8fafc;
}

html[data-theme="dark"] .cs-doc-body th,
html[data-theme="dark"] .cs-doc-body td {
  border-color: #334155;
}