/* ==========================================================================
   components-breadcrumb.css：パンくずリスト
   目的：現在地の補助UI
   方針：
   - レイアウト依存を持たない
   - 見た目はここで完結
   ========================================================================== */

/* ==========================================================================
   01) Breadcrumb
   ========================================================================== */

.c-breadcrumbArea {
  border-bottom: 1px solid var(--breadcrumb-border-color);
}

.c-breadcrumb {
  max-width: var(--site-max);
  margin: 0 auto;

  padding-block: var(--breadcrumb-pad-y);
  padding-inline: calc(var(--site-pad-x) + var(--breadcrumb-pad-x));

  /* これが本当のXツマミ */
  font-size: var(--breadcrumb-font-size);
  color: var(--breadcrumb-text-color);
}

.c-breadcrumb__link {
  color: var(--brand-primary);
  text-decoration: none;
}

.c-breadcrumb__link:visited {
  color: var(--brand-primary);
}

.c-breadcrumb__link:hover {
  text-decoration: underline;
}

.c-breadcrumb__sep {
  margin: 0 var(--breadcrumb-sep-x);
}

.c-breadcrumb__current {
  font-weight: var(--breadcrumb-current-weight);
}