/* ===== パンくずリスト ================================= */
/* ─ ラッパー ───────────────────────────── */
.breadcrumb{
  max-width:1100px;            /* 本文ブロックと同幅 */
  margin:.5rem auto 1.5rem;    /* 上0.5rem／下1.5rem */
  padding:0 1rem;
  font-size:.85rem;            /* やや小さめ */
  color:var(--color-text);
}

/* ─ <ol> を 1 行に並べる ───────────────── */
.breadcrumb ol{
  display:flex;                /* ← 重要：横並びにする */
  flex-wrap:wrap;              /* 狭い幅では折り返し */
  gap:.4rem;                   /* アイテム間すき間 */
  margin:0;
  padding:0;
  list-style:none !important;  /* デフォルト番号を完全除去 */
}

/* ─ <li> 個別 ─────────────────────────── */
.breadcrumb li{
  display:inline-flex;         /* 横方向に詰める */
  align-items:center;
  margin:0;
}

/* 区切り「›」：2 番目以降だけ表示 */
.breadcrumb li:not(:first-child)::before{
  content:"›";
  margin:0 .4rem 0 .2rem;
  color:var(--color-text);
}

/* ─ リンクスタイル ─────────────────────── */
.breadcrumb a{
  color:var(--color-link);
  text-decoration:none;
}
.breadcrumb a:hover{
  color:var(--color-link-hover);
  text-decoration:underline;
}
.breadcrumb a:focus-visible{
  outline:2px solid var(--color-link-hover);
  outline-offset:2px;
}