/* ══════════════════════════════════════════════════════════════
   글(블로그) 화면 전용 꾸밈 — 2026-08-27 신설
   ─────────────────────────────────────────────────────────────
   ★홈페이지(front-page)는 어두운 톤 그대로 두고, "글을 읽는 화면"만
     밝게 한다(미르 B안 확정). 긴 글을 오래 읽어야 하는 화면이라,
     어두운 배경은 눈이 쉽게 피로해진다.
   ★금색(--gold)은 그대로 써서 홈페이지와 같은 브랜드로 보이게 한다.
   ★본문 안쪽 이름표(report-…)는 발행 프로그램이 사이트마다 다르게
     붙여준다. 이 사이트 몫이 report- 다. 다른 사이트와 겹치지 않는다.
   ★목차는 항상 펼쳐둔다 — 여닫기 동작(JS)을 두지 않는다. 목차가 짧아
     접을 이유가 없고, 동작이 없으면 고장날 일도 없다.
   ══════════════════════════════════════════════════════════════ */

:root{
  --p-paper:   #fbf9f5;   /* 글 화면 바탕 */
  --p-card:    #ffffff;
  --p-cream:   #fdf7e9;   /* 요약 상자 */
  --p-edge:    #e6dfd0;
  --p-edge-2:  #ece7dc;
  --p-ink:     #1c1b19;
  --p-ink-2:   #4a4741;
  --p-ink-3:   #8a857c;
  --p-gold:    #c9a961;
  --p-gold-dk: #6d5522;   /* 밝은 바탕에서 읽히는 금색 */
  --p-ink-box: #1a1a1d;   /* 배너 바탕(어둡게 해서 눈에 띄게) */
}

/* ── 글 화면 전체 바탕 ───────────────────────────────── */
body.single,
body.blog,
body.archive,
body.search{
  background: var(--p-paper);
  color: var(--p-ink-2);
}

/* ── 글 하나를 감싸는 틀 ─────────────────────────────── */
/* ★2026-08-27 미르 발견 — 위쪽 메뉴줄이 글 제목을 덮고 있었다.
   메뉴줄은 화면에 붙어 다니는 방식(position:fixed)이라 높이 75px만큼 자리를 차지하는데,
   글 틀의 윗여백이 46px뿐이라 제목이 그 밑에 깔렸다. 여백을 메뉴줄보다 크게 준다.
   ★홈페이지는 첫 화면이 그 자리를 스스로 비워두므로 영향이 없다. */
.b-wrap{
  max-width: 800px;
  margin: 0 auto;
  padding: 118px 20px 72px;
}
/* 목차를 눌러 소제목으로 뛸 때도 같은 문제가 생긴다 — 뛴 자리가 메뉴줄 아래로
   들어가지 않도록 미리 자리를 비워둔다. */
.b-body h2,
.b-body h3{ scroll-margin-top: 92px; }
.b-head{
  padding-bottom: 22px;
  margin-bottom: 30px;
  border-bottom: 1px solid var(--p-edge);
}
.b-head h1{
  margin: 0 0 12px;
  font-size: 1.72rem;
  line-height: 1.42;
  font-weight: 800;
  color: var(--p-ink);
  letter-spacing: -.01em;
}
.b-meta{
  font-size: .86rem;
  color: var(--p-ink-3);
}
.b-back{
  display: inline-block;
  margin-top: 40px;
  font-size: .92rem;
  font-weight: 600;
  color: var(--p-gold-dk);
  text-decoration: none;
  border-bottom: 1px solid var(--p-edge);
  padding-bottom: 3px;
}
.b-back:hover{ border-bottom-color: var(--p-gold); }

/* ══════════════════════════════════════════════════════
   글 목록 화면 (/news/) — 2026-08-27 미르 발견
   ★제목이 안 보였다. 원인: 목록 제목은 링크(<a>)인데 이 화면 전용 색이 없어서
     홈페이지(어두운 톤)의 글자색 #f4f5f7을 그대로 물려받았다. 밝은 종이색
     배경 위에 흰 글씨라 사실상 보이지 않았다(실측으로 확인).
   ══════════════════════════════════════════════════════ */
.b-list{ list-style: none; margin: 0; padding: 0; }
.b-card{
  background: var(--p-card);
  border: 1px solid var(--p-edge);
  border-radius: 8px;
  padding: 22px 24px;
  margin-bottom: 14px;
}
.b-card:hover{ border-color: var(--p-gold); }
.b-card h2{ margin: 0 0 8px; font-size: 1.16rem; font-weight: 800; line-height: 1.45; }
.b-card h2 a{
  color: var(--p-ink);          /* ★여기가 비어 있어서 안 보였다 */
  text-decoration: none;
}
.b-card h2 a:hover{ color: var(--p-gold-dk); }
.b-card .b-meta{ margin-bottom: 10px; }
.b-card p{ margin: 0; font-size: .93rem; line-height: 1.75; color: var(--p-ink-2); }
.b-nav{ margin-top: 28px; text-align: center; }
.b-nav a,
.b-nav span{
  display: inline-block;
  margin: 0 3px;
  padding: 7px 13px;
  border: 1px solid var(--p-edge);
  border-radius: 5px;
  font-size: .9rem;
  color: var(--p-ink-2);
  text-decoration: none;
}
.b-nav .current{ background: var(--p-gold); border-color: var(--p-gold); color: #12121a; }
.b-empty{ color: var(--p-ink-3); }

/* ── 본문 기본 ───────────────────────────────────────── */
.b-body{
  font-size: 16.5px;
  line-height: 1.9;
  color: var(--p-ink-2);
}
.b-body p{ margin: 0 0 16px; }
.b-body a{ color: var(--p-gold-dk); }
.b-body ul,
.b-body ol{ margin: 0 0 18px; padding-left: 22px; }
.b-body li{ margin-bottom: 7px; }

/* 대제목 — 아래로 짧게 뻗는 금색 밑줄 */
.b-body h2{
  position: relative;
  margin: 40px 0 14px;
  padding-bottom: 10px;
  font-size: 1.3rem;
  font-weight: 800;
  line-height: 1.45;
  color: var(--p-ink);
}
.b-body h2::after{
  content: "";
  position: absolute; left: 0; bottom: 0;
  width: 46px; height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, #a8863f, rgba(168,134,63,0));
}

/* 소제목 — 왼쪽 금색 막대 */
.b-body h3{
  margin: 28px 0 10px;
  padding-left: 12px;
  font-size: 1.06rem;
  font-weight: 700;
  line-height: 1.5;
  color: var(--p-gold-dk);
  border-left: 3px solid var(--p-gold);
}

/* 강조 — 굵기 대신 색으로 */
.b-body strong,
.b-body b{
  font-weight: 700;
  color: var(--p-gold-dk);
}

/* ── 맨 위 대표 사진 ─────────────────────────────────── */
.b-body .report-thumb{
  margin: 0 0 28px;
  text-align: center;
}
.b-body .report-thumb img{
  max-width: 100%;
  border-radius: 8px;
  display: block;
  margin: 0 auto;
}

/* ── 도입 문단 ───────────────────────────────────────── */
.b-body .report-intro{
  font-size: 1.02rem;
  line-height: 1.85;
  color: #3d3a35;
  margin-bottom: 24px;
}

/* ── 목차 (항상 펼침) ────────────────────────────────── */
.b-body .report-toc{
  background: var(--p-card);
  border: 1px solid var(--p-edge);
  border-radius: 8px;
  padding: 18px 20px;
  margin: 0 0 28px;
}
.b-body .report-toc-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
  font-size: .95rem;
  color: var(--p-gold-dk);
}
.b-body .report-toc-icon{ display: none; }   /* 여닫기 없음 */
.b-body .report-toc-body{ max-height: none !important; overflow: visible; }
.b-body .report-toc-list ul{
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}
.b-body .report-toc-list li{ margin: 0 0 9px; }
.b-body .report-toc-link{
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: var(--p-ink-2);
  font-size: .93rem;
  line-height: 1.6;
}
.b-body .report-toc-link:hover{ color: var(--p-gold-dk); }
.b-body .report-toc-h3{
  padding-left: 14px;
  font-size: .88rem;
  color: #6b6862;
}
.b-body .report-toc-dot{ width: 12px; height: 12px; flex: none; color: var(--p-gold); }

/* ── 요약 상자 ───────────────────────────────────────── */
.b-body .report-card{
  background: var(--p-cream);
  border: 1px solid #ecdfc0;
  border-left: 3px solid var(--p-gold);
  border-radius: 8px;
  padding: 18px 20px;
  margin: 26px 0;
  font-size: .95rem;
  line-height: 1.8;
}
.b-body .report-card b,
.b-body .report-card strong{ color: var(--p-gold-dk); font-weight: 800; }

/* ── 표 ──────────────────────────────────────────────── */
.b-body .report-table-wrap{ overflow-x: auto; margin: 22px 0; }
.b-body table{
  width: 100%;
  border-collapse: collapse;
  font-size: .9rem;
  background: var(--p-card);
  border: 1px solid var(--p-edge);
  border-radius: 8px;
  overflow: hidden;
}
.b-body th,
.b-body td{ padding: 11px 13px; text-align: left; }
.b-body th{
  background: #f1ece0;
  color: #4a3d1e;
  font-weight: 700;
  border-bottom: 1px solid #e0d7c4;
}
.b-body td{ border-bottom: 1px solid var(--p-edge-2); }
.b-body tbody tr:last-child td{ border-bottom: none; }

/* ── 인용 ────────────────────────────────────────────── */
.b-body blockquote{
  margin: 22px 0;
  padding: 14px 18px;
  background: var(--p-card);
  border-left: 3px solid var(--p-gold);
  border-radius: 0 6px 6px 0;
  color: var(--p-ink-2);
}
.b-body blockquote p:last-child{ margin-bottom: 0; }

/* ── 본문 속 사진 ────────────────────────────────────── */
.b-body img:not(.emoji):not(.wp-smiley){
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
  margin: 22px auto;
}
.b-body img.emoji,
.b-body img.wp-smiley{
  display: inline; margin: 0 .1em; width: 1em; height: 1em; border-radius: 0;
}

/* ── 자주 묻는 질문 ──────────────────────────────────── */
.b-body .report-faq-q{
  margin: 22px 0 6px;
  font-weight: 800;
  color: var(--p-ink);
}
.b-body .report-faq-a{ margin: 0 0 16px; }

/* ── 함께 보면 좋은 글 ───────────────────────────────── */
.b-body .report-related-list{ margin-top: 14px; }
.b-body .report-related{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--p-card);
  border: 1px solid var(--p-edge);
  border-radius: 7px;
  padding: 14px 16px;
  margin-bottom: 9px;
  font-size: .94rem;
  font-weight: 600;
  color: #3d3a35;
  text-decoration: none;
}
.b-body .report-related:hover{ border-color: var(--p-gold); }
.b-body .report-related-arrow{ color: var(--p-gold-dk); flex: none; }

/* ══════════════════════════════════════════════════════
   재경 안내 배너 2개 (미르 확정, 2026-08-27)
   ★밝은 본문 위에 어두운 상자를 올려 눈에 띄게 한다.
   ══════════════════════════════════════════════════════ */

/* 글 중간 — 홈페이지로 보내는 배너 */
.b-body .report-lead{
  margin: 34px 0;
  padding: 20px 22px;
  background: var(--p-ink-box);
  border-left: 3px solid var(--p-gold);
  border-radius: 7px;
}
.b-body .report-lead .report-lead-eyebrow{
  margin-bottom: 8px;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .15em;
  color: var(--p-gold);
}
.b-body .report-lead .report-lead-title{
  margin-bottom: 7px;
  font-size: 1.06rem;
  font-weight: 800;
  line-height: 1.5;
  color: #f4f5f7;
}
.b-body .report-lead .report-lead-sub{
  margin-bottom: 16px;
  font-size: .92rem;
  line-height: 1.7;
  color: #b9bcc4;
}
.b-body .report-lead a{
  display: inline-block;
  padding: 11px 22px;
  background: var(--p-gold);
  color: #12121a;
  font-size: .94rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: 4px;
}

/* 글 맨 아래 — 전화 버튼 */
.b-body .report-call{
  margin: 38px 0 0;
  padding-top: 26px;
  border-top: 1px solid #e0d7c4;
  text-align: center;
}
.b-body .report-call .report-call-msg{
  margin-bottom: 14px;
  font-size: .94rem;
  line-height: 1.7;
  color: var(--p-ink-2);
}
.b-body .report-call a{
  display: block;
  padding: 16px 20px;
  background: var(--p-ink-box);
  color: #e3c98a;
  font-size: 1.14rem;
  font-weight: 800;
  text-decoration: none;
  border-radius: 6px;
}
.b-body .report-call .report-call-fine{
  margin-top: 10px;
  font-size: .8rem;
  color: var(--p-ink-3);
}

/* ── 좁은 화면 ───────────────────────────────────────── */
@media (max-width: 640px){
  .b-wrap{ padding: 104px 16px 56px; }   /* 메뉴줄 높이는 모바일에서도 75px (실측) */
  .b-head h1{ font-size: 1.36rem; }
  .b-body{ font-size: 16px; }
  .b-body h2{ font-size: 1.18rem; margin-top: 32px; }
  .b-body h3{ font-size: 1rem; }
  .b-body .report-lead{ padding: 18px 17px; }
  .b-body .report-lead a{ display: block; text-align: center; }
  .b-body .report-call a{ font-size: 1.06rem; }
}