/*──────────── 0. 変数 ────────────*/
:root{
  --max-width     : 1280px;
  --sidebar-width : 24%;
  --gap           : 2rem;
  --bg-global     : #f3f3f3;
  --bg-card       : #ffffff;

  --color-meta : #666;
  --color-h1   : #031764;
  --color-h2   : #031764;
  --color-h3   : #000000;
}

/*──────────── 1. PC ベース ────────────*/
body.single,
body.single-post {
  background: var(--bg-global);
}

.article-wrapper{
  max-width: var(--max-width);
  padding  : 2rem 1rem;
  margin   : 0 auto;
}
/* 背景打ち消し */
body.single .article-wrapper,
body.single-post .article-wrapper{
  background: transparent !important;
}

.container{
  display:flex;
  flex-direction:row;
  gap: var(--gap);
  align-items: flex-start;      /* ★ 新規：カード高だけで止める */
}

/* パンくず */
.breadcrumb{
  font-size: .85rem;
  margin-bottom: 1rem;
  text-align: left;
}

/*────────────────  白カード  ───────────────*/
.entry.card-white{
  /* ★ 幅指定を flex-basis→width に置き換え   */
  width: calc(100% - var(--sidebar-width) - var(--gap));
  flex: 0 0 auto;              /* 高さは本文分だけ（サイドバーに伸びない） */
  background: var(--bg-card);
  padding: 3rem;
  border-radius: 10px;
  box-sizing: border-box;
  /* かぶりが不安なら ↓ を付けておく */
  /* z-index: 1; */
}

/* H1 */
.entry-title{
  font-size: 35px;
  font-weight: 700;
  color: var(--color-h1);
  margin: 0 0 .6rem;
  line-height: 1.4;
  text-align: left;
}

/* 更新日 */
.entry-date{
  font-size: .9rem;
  color: var(--color-meta);
  margin-bottom: 1.2rem;
  text-align: left;
}

/* アイキャッチ */
.entry-thumb img{
  width: 100%;
  height: auto;
  margin-bottom: 1.5rem;
}

/* 本文 */
.entry-content{ text-align: left; }

.entry-content p{
  font-size: 17px;
  margin: 0 0 1.5em;
  line-height: 1.8;
}

/* ★ 箇条書き・番号付きリスト（ネスト対応） */
body.single .entry-content ul,
body.single .entry-content ol{
  list-style-position: outside;   /* マーカー行外 */
  margin-left: 1.4em;             /* 左インデント */
  text-indent: -1.4em;            /* ぶら下げ */
  padding-left: 0;
  font-size: 17px;
  line-height: 1.8;
  margin-bottom: 1.5em;
}

/* ネストごとのマーカー */
body.single .entry-content ul       { list-style-type: disc;   }
body.single .entry-content ul ul    { list-style-type: circle; }
body.single .entry-content ul ul ul { list-style-type: square; }

body.single .entry-content ol       { list-style-type: decimal;      }
body.single .entry-content ol ol    { list-style-type: lower-alpha;  }
body.single .entry-content ol ol ol { list-style-type: lower-roman;  }

body.single .entry-content li::marker{ color:#000; }

/* ネストした <ul>・<ol> の下余白をゼロに ------------------------ */
body.single .entry-content ul ul,
body.single .entry-content ol ol{
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/*══════════ 見出しデザイン 2025-07-11 ══════════*/
/* H2 ─ 22px / bold / #031764 / 下線あり */
body.single .entry-content h2{
  font-size:22px;
  font-weight:700;
  color:#031764;
  margin:2.5rem 0 2rem;
  line-height:1.5;
  position:relative;           /* 下線用 */
}
body.single .entry-content h2::after{
  content:'';
  position:absolute;
  left:0; bottom:-10px;
  width:100%;
  height:2px;
  background:#031764;          /* 同色下線 */
}

/* H3 ─ 22px / bold / #031764 */
body.single .entry-content h3{
  font-size:22px;
  font-weight:700;
  color:#031764;
  margin:2rem 0 1rem;
  line-height:1.5;
}

/* H4 ─ 22px / medium / #031764 */
body.single .entry-content h4{
  font-size:22px;
  font-weight:500;             /* medium 相当 */
  color:#031764;
  margin:1.8rem 0 1rem;
  line-height:1.5;
}


/*────────────────  サイドバー  ───────────────*/
.sidebar{
  width: var(--sidebar-width);       /* 念のため明示 */
  max-width: var(--sidebar-width);   /* ★ はみ出し防止 */
  flex: 0 0 var(--sidebar-width);    /* 幅固定で縮まない */
}
.sidebar-banner + .sidebar-banner{ margin-top: 1.5rem; }
.sidebar-banner img{
  display: block;                    /* ★ inline-gap防止 */
  width: 100%;                       /* ★ 横いっぱい */
  height: auto;                      /* ★ 比率保持 */
  object-fit: cover;                 /* 万一画像が大きい場合もトリム */
  border-radius: 4px;
}


/* ────────── TABLE DESIGN ────────── */
body.single .entry-content table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  margin:1.5rem 0;
  font-size:16px;
  background:#F1F1F1;
}

/* ★ 行間も確保 */
body.single .entry-content th,
body.single .entry-content td{
  border:2px solid #FFF;
  padding:.75em .85em;
  color:#000;
  line-height:1.6;          /* ← 追加 */
}

/* ─ ヘッダー行：全列紺色＋白文字 ─ */
body.single .entry-content thead th{
  background:#031764;
  color:#FFF;
  text-align:center;
  font-weight:700;
}

/* ─ データ行の左端列のみ水色 ─ */
body.single .entry-content tbody td:first-child{
  background:#E7EDFA;
  text-align:center;
  font-weight:600;
}

/* その他セル */
body.single .entry-content tbody td:not(:first-child){
  background:#F1F1F1;
  text-align:left;
}

/*════════════  TOC（目次）デザイン  ════════════*/
/* コンテナ本体 ─ ライトグレー背景 */
#toc_container{
  background:#F1F1F1;                 /* ← 指定どおり */
  border:none;
  box-shadow:0 0 0 1px #E5E5E5 inset; /* 薄い内枠：お好みで調整可 */
  padding:0;
  margin:2.5rem 0;
}

/* タイトルバー ─ 濃紺ベタ塗り／白抜き文字 */
#toc_container .toc_title{
  background:#031764;                 /* ← 指定どおり */
  color:#FFF;
  font-weight:700;
  font-size:16px;
  line-height:1.4;
  padding:.6em 1rem;
  margin:0;
}

/* リスト全体 */
#toc_container .toc_list{
  list-style:none;
  margin:0;
  padding:1.2rem 1.6rem;
}

/* 各項目 */
#toc_container .toc_list li{
  margin:0 0 .65em;
}

#toc_container .toc_list a{
  display:block;
  color:#000;
  text-decoration:none;
  line-height:1.8;
  font-size:15px;
}

#toc_container .toc_list a:hover{
  opacity:.7;
  text-decoration:underline;
}

/* 番号だけ濃紺で強調 */
#toc_container .toc_number{
  color:#031764;
  font-weight:700;
  margin-right:.4em;
}
/*––– 目次の ● ポチを完全に消す –––*/
#toc_container .toc_list,
#toc_container .toc_list ul,
#toc_container .toc_list li{
  list-style:none !important;   /* マーカー自体を無効化 */
  margin:0;                     /* 余計なスペースも除去 */
  padding:0;
}

/* ブラウザによっては ::marker が残る場合があるため念のため */
#toc_container .toc_list li::marker{
  content:none;                 /* Safari 等対策 */
}

/*––– リンク文字サイズを 17px に –––*/
#toc_container .toc_list a{
  font-size:17px !important;    /* 既存より強めて確実に反映 */
}

/*==========  目次の余白とインセット調整  ==========*/
#toc_container{
  margin:3rem 0 !important;
  box-sizing:border-box;
}

#toc_container .toc_title{
  padding:.8em 1.4rem !important;
}

#toc_container .toc_list{
  padding:1.4rem 2.8rem 1.8rem !important;
}

#toc_container .toc_list li{
  padding-left:.2rem;
}


/*──────────── 3. タブレット以下 (〜1023px) ────────────*/
@media(max-width:1023px){

  /* サイドバーを完全に隠す */
  .sidebar{
    display:none !important;
  }
  
  /* 文字サイズ */
  .entry-content p{
    font-size: 15px;
    margin: 0 0 1.5em;
    line-height: 1.8;
  }

  body.single .entry-content ul,
  body.single .entry-content ol{
    font-size: 15px;
  }

  body.single .entry-content table{
    font-size:15px;
  }


  /* 本文カードを全幅に */
  .entry.card-white{
    width:100% !important;
    flex:1 0 100% !important;   /* 幅固定＋縦に伸びる */
    padding: 1rem;
  }

  /* 横並びで不要になった gap をゼロに（任意） */
  .container{
    gap:0 !important;
  }
}

/*──────────── 4. モバイル (〜599px) ────────────*/
@media(max-width:599px){
  .container{ flex-direction: column; }
  .entry.card-white,
  .sidebar{ flex: 1 0 100%; }
  .sidebar{ margin-top: 2rem; }

  .entry-title{ font-size: 28px; }
  .entry-content h2,
  .entry-content h3{ font-size: 20px; }
}


/* === 強制リストスタイル : 子サイト限定 =============================== */
body.single .entry-content li{
  list-style-position: inside !important;
}
body.single .entry-content ul > li{
  list-style-type: disc !important;          /* ● */
}
body.single .entry-content ul ul > li{
  list-style-type: circle !important;        /* ○ */
}
body.single .entry-content ul ul ul > li{
  list-style-type: square !important;        /* ■ */
}
body.single .entry-content ol > li{
  list-style-type: decimal !important;       /* 1. 2. 3. */
}
body.single .entry-content ol ol > li{
  list-style-type: lower-alpha !important;   /* a. b. c. */
}
body.single .entry-content ol ol ol > li{
  list-style-type: lower-roman !important;   /* i. ii. iii. */
}
body.single .entry-content li::marker{
  color: #000;                               /* マーカーを黒に固定 */
}

/* === 1カラム用 === */
.onecol .entry.card-white {
  width: 100%;
  max-width: 100%;
}
/* 背景色だけ共有で良ければ body クラスを共通に */
body.single,
body.single-post { background:#f3f3f3; }



/* === front-archive：3カラムカード === */
.front-archive {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2rem 1rem;
}
.grid-3col {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
}
.card {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0,0,0,.08);
  transition: transform .2s;
}
.card-link:hover { text-decoration: none; }
.card:hover      { transform: translateY(-4px); }

.card-thumb { width: 100%; height: auto; display: block; }
.card-title {
  font-size: 16px;
  font-weight: 700;
  color: #031764;
  margin: 1rem;
  line-height: 1.5;
}

/* === 見出し＋総件数行 === */
.archive-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 1.5rem;          /* 見出しとカードグリッドの間隔 */
}
.archive-title {
  font-size: 28px;
  font-weight: 800;
  margin: 0;
}
.archive-count {
  font-size: 14px;
  color: #666;
}

/* === pagination === */
.pagination {
  text-align: center;
  margin: 3rem 0;
}
.pagination ul {
  display: inline-flex;
  gap: .5rem;
  list-style: none;
  padding: 0;
}
.pagination a,
.pagination span {
  display: block;
  padding: .5rem .75rem;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-weight: 600;
  color: #031764;
  text-decoration: none;
}
.pagination .current {
  background: #031764;
  color: #fff;
  border-color: #031764;
}