/* =========================================================
   ブログ記事（投稿詳細）読みやすさ改善
   - functions.php で is_singular('post') のときだけ styles.css の後に読み込む
   - 対象は single.php の本文まわりのみ。ヘッダー／フッター／CTA／関連記事／著者ボックスには影響させない
   - 著者ボックス（.saboxplugin-wrap）も .p-single__content の中にあるため、
     p・画像・リスト・表は「本文直下（>）」に限定している
   - 目次は Table of Contents Plus（#toc_container）
   ========================================================= */

/* ---------- 本文カラム幅（PC 800px） ---------- */
@media screen and (min-width: 768px) {
  .p-single > .inner {
    max-width: 840px;
  }
}

/* ---------- カテゴリラベル ---------- */
.p-single__label {
  margin-bottom: 14px;
}

/* ---------- ① タイトル h1 ---------- */
.p-single__title {
  margin: 0 0 14px;
  color: #0F2A4A;
  font-weight: 700;
  font-size: 32px;
  line-height: 1.4;
  letter-spacing: 0.04em;
}

/* ---------- ② 更新日（公開日は single.php で出力をやめた） ---------- */
.p-single__date {
  display: block;
  margin: 0 0 28px;
  color: #767676;
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

/* ---------- ③⑦ 本文 ---------- */
.p-single__content {
  color: #333333;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 0.02em;
}

.p-single__content > p {
  margin: 0 0 1.5em;
  color: #333333;
  font-size: 16px;
  line-height: 1.9;
}

.p-single__content > p a,
.p-single__content > ul a,
.p-single__content > ol a,
.p-single__content > figure.wp-block-table a {
  color: #0A6CC2;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.p-single__content > figure.wp-block-image,
.p-single__content > p > img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 32px 0;
}

.p-single__content > figure.wp-block-image img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* 出典・注釈（<em> だけの段落、または .p-single__note） */
.p-single__content > p > em:only-child,
.p-single__content .p-single__note {
  display: block;
  color: #666666;
  font-style: normal;
  font-size: 13px;
  line-height: 1.7;
}

/* 表の直後に来る出典は表に寄せる */
.p-single__content > figure.wp-block-table + p > em:only-child,
.p-single__content > .p-single__table-wrap + p > em:only-child {
  margin-top: -24px;
}

/* ---------- ③⑦ 見出し ---------- */
.p-single__content h2 {
  margin: 80px 0 28px;
  padding: 6px 0 14px 18px;
  border: 0;
  border-bottom: 1px solid #D5DEE8;
  border-left: 6px solid #0F3A5F;
  background: none;
  color: #0F2A4A;
  font-weight: 700;
  font-size: 25px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}

.p-single__content h3 {
  margin: 44px 0 18px;
  padding: 2px 0 2px 14px;
  border: 0;
  border-left: 3px solid #5B8DB8;
  background: none;
  color: #0F2A4A;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: 0.02em;
}

/* 見出し内の <strong> による太さの二重指定を無効化 */
.p-single__content h2 strong,
.p-single__content h3 strong {
  font-weight: inherit;
}

/* ---------- ⑤ 箇条書き（reset CSS の list-style:none を本文内だけ上書き） ---------- */
.p-single__content > ul,
.p-single__content > ol {
  margin: 0 0 1.5em;
  padding-left: 1.5em;
}

.p-single__content > ul {
  list-style: disc outside;
}

.p-single__content > ol {
  list-style: decimal outside;
}

.p-single__content > ul ul,
.p-single__content > ol ul {
  margin: 0.4em 0 0;
  padding-left: 1.5em;
  list-style: circle outside;
}

.p-single__content > ol ol {
  margin: 0.4em 0 0;
  padding-left: 1.5em;
  list-style: decimal outside;
}

.p-single__content > ul li,
.p-single__content > ol li {
  display: list-item;
  padding-left: 0.2em;
}

/* reset CSS が li 自体に list-style-type:none を当てているので li にも指定する */
.p-single__content > ul > li {
  list-style-type: disc;
}

.p-single__content > ol > li {
  list-style-type: decimal;
}

.p-single__content > ul ul > li,
.p-single__content > ol ul > li {
  list-style-type: circle;
}

.p-single__content > ol ol > li {
  list-style-type: decimal;
}

.p-single__content > ul li + li {
  margin-top: 0.5em;
}

.p-single__content > ol li + li {
  margin-top: 0.6em;
}

.p-single__content > ul li > strong:first-child,
.p-single__content > ol li > strong:first-child {
  color: #0F2A4A;
}

/* ---------- ⑥ 表 ---------- */
/* ブロックエディタの figure.wp-block-table、またはJSで付与する .p-single__table-wrap */
.p-single__content > figure.wp-block-table,
.p-single__content .p-single__table-wrap {
  margin: 8px 0 44px;
  border: 1px solid #DDDDDD;
  border-radius: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.p-single__content > figure.wp-block-table table,
.p-single__content .p-single__table-wrap table {
  width: 100%;
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  color: #333333;
  font-size: 15px;
  line-height: 1.7;
}

.p-single__content > figure.wp-block-table th,
.p-single__content > figure.wp-block-table td,
.p-single__content .p-single__table-wrap th,
.p-single__content .p-single__table-wrap td {
  padding: 14px 16px;
  border: 0;
  border-top: 1px solid #DDDDDD;
  background: #FFFFFF;
  text-align: left;
  vertical-align: middle;
}

.p-single__content > figure.wp-block-table tr > * + *,
.p-single__content .p-single__table-wrap tr > * + * {
  border-left: 1px solid #DDDDDD;
}

/* 1行目のセルは上罫線なし（外枠と重ならないように） */
.p-single__content > figure.wp-block-table tr:first-child > *,
.p-single__content .p-single__table-wrap tr:first-child > * {
  border-top: 0;
}

.p-single__content > figure.wp-block-table thead + tbody tr:first-child > *,
.p-single__content .p-single__table-wrap thead + tbody tr:first-child > * {
  border-top: 1px solid #DDDDDD;
}

/* 左端の項目列 */
.p-single__content > figure.wp-block-table tbody tr > :first-child,
.p-single__content .p-single__table-wrap tbody tr > :first-child {
  width: 24%;
  background: #EAF0F6;
  color: #1F3F5F;
  font-weight: 700;
}

/* ゼブラ（データ行の偶数行） */
.p-single__content > figure.wp-block-table thead + tbody tr:nth-child(even) > :not(:first-child),
.p-single__content .p-single__table-wrap thead + tbody tr:nth-child(even) > :not(:first-child),
.p-single__content > figure.wp-block-table table:not(:has(thead)) tr:nth-child(odd):not(:first-child) > :not(:first-child),
.p-single__content .p-single__table-wrap table:not(:has(thead)) tr:nth-child(odd):not(:first-child) > :not(:first-child) {
  background: #F7F9FB;
}

/* ヘッダー行：thead がある場合 / ない場合（1行目） */
.p-single__content > figure.wp-block-table thead th,
.p-single__content > figure.wp-block-table thead td,
.p-single__content .p-single__table-wrap thead th,
.p-single__content .p-single__table-wrap thead td,
.p-single__content > figure.wp-block-table table:not(:has(thead)) tr:first-child > *,
.p-single__content .p-single__table-wrap table:not(:has(thead)) tr:first-child > * {
  background: #0F3A5F;
  color: #FFFFFF;
  font-weight: 700;
}

.p-single__content > figure.wp-block-table thead tr > * + *,
.p-single__content .p-single__table-wrap thead tr > * + *,
.p-single__content > figure.wp-block-table table:not(:has(thead)) tr:first-child > * + *,
.p-single__content .p-single__table-wrap table:not(:has(thead)) tr:first-child > * + * {
  border-left-color: #2E5778;
}

.p-single__content > figure.wp-block-table thead strong,
.p-single__content .p-single__table-wrap thead strong,
.p-single__content > figure.wp-block-table table:not(:has(thead)) tr:first-child strong,
.p-single__content .p-single__table-wrap table:not(:has(thead)) tr:first-child strong {
  color: inherit;
}

/* ---------- ④ 目次（Table of Contents Plus・h2のみ表示） ---------- */
#toc_container {
  margin: 40px 0 0;
  padding: 28px 32px 20px;
  border: 1px solid #DDE5EE;
  border-radius: 6px;
  background: #F5F8FB;
}

#toc_container .toc_title {
  margin: 0 0 12px;
  color: #0F2A4A;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

#toc_container .toc_list {
  margin: 0;
  padding: 0;
  list-style: none;
}

#toc_container .toc_list > li {
  margin: 0;
  padding: 0;
  border-top: 1px solid #DDE5EE;
  border-bottom: 0;
}

/* h3 以下の項目は出さない */
#toc_container .toc_list ul {
  display: none;
}

#toc_container .toc_list a {
  display: block;
  padding: 11px 4px;
  color: #1F3F5F;
  font-size: 15px;
  line-height: 1.6;
  text-decoration: none;
  transition: color 0.15s ease;
}

#toc_container .toc_list a:hover,
#toc_container .toc_list a:focus-visible {
  color: #0A6CC2;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* プラグインの自動番号（「1 1.」の重複）を非表示。見出し側の「1.」を番号として使う */
#toc_container .toc_number {
  display: none;
}

/* =========================================================
   スマホ（〜767px）
   ========================================================= */
@media screen and (max-width: 767px) {
  .p-single > .inner {
    padding-right: 20px;
    padding-left: 20px;
  }

  .p-single__label {
    margin-bottom: 12px;
  }

  .p-single__title {
    margin-bottom: 12px;
    font-size: 23px;
    line-height: 1.45;
    letter-spacing: 0.03em;
  }

  .p-single__date {
    margin-bottom: 24px;
    font-size: 13px;
  }

  .p-single__content,
  .p-single__content > p {
    font-size: 16px;
    line-height: 1.85;
  }

  .p-single__content > figure.wp-block-image,
  .p-single__content > p > img {
    margin: 24px 0;
  }

  .p-single__content h2 {
    margin: 72px 0 24px;
    padding: 4px 0 12px 14px;
    border-left-width: 5px;
    font-size: 21px;
  }

  .p-single__content h3 {
    margin: 40px 0 16px;
    padding-left: 12px;
    font-size: 18px;
  }

  .p-single__content > figure.wp-block-table,
  .p-single__content .p-single__table-wrap {
    margin-bottom: 40px;
  }

  .p-single__content > figure.wp-block-table table,
  .p-single__content .p-single__table-wrap table {
    min-width: 520px;
    font-size: 13.5px;
    line-height: 1.65;
  }

  .p-single__content > figure.wp-block-table th,
  .p-single__content > figure.wp-block-table td,
  .p-single__content .p-single__table-wrap th,
  .p-single__content .p-single__table-wrap td {
    padding: 12px 14px;
  }

  .p-single__content > figure.wp-block-table tbody tr > :first-child,
  .p-single__content .p-single__table-wrap tbody tr > :first-child {
    width: 28%;
  }

  #toc_container {
    margin-top: 32px;
    padding: 20px 18px 12px;
  }

  #toc_container .toc_title {
    margin-bottom: 8px;
    font-size: 17px;
  }

  #toc_container .toc_list a {
    padding: 10px 2px;
    font-size: 14px;
  }
}
