/* =====================================================================
   SITEMAP - page-specific styles (サイトマップ)
   Shared chrome (header/footer/lead/breadcrumb/reset) lives in main.css.
   Groups flow in a responsive multi-column grid; each group is a headed
   link list, so the page stays readable however many types the site gains.
   ===================================================================== */

.smap__main {
  background: #fff;
}

.smap__section {
  background: #fff;
}

.smap__box {
  max-width: var(--og-content, 1280px);
  margin: 0 auto;
  padding: 72px 24px 88px;
  /* auto-fit rather than a fixed column count: one content type or six, the
     row fills without leaving a ragged gap at the end. */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 48px 40px;
  align-items: start;
}

/* ---------- Group ---------- */

.smap__group {
  min-width: 0;
}

.smap__title {
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 2px solid #0C2D5E;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.5;
  letter-spacing: 0.01em;
  color: #061629;
}

.smap__title-link {
  color: inherit;
  text-decoration: none;
  transition: color .15s ease;
}

.smap__title-link:hover,
.smap__title-link:focus-visible {
  color: #C8102E;
}

/* ---------- Section page: intro row + grouped headings ----------
   A section page (/sitemap/{type}/) lists every entry of one content type,
   bucketed by country, series or year. The intro row spans the whole grid; the
   buckets then flow as ordinary groups. */

.smap__intro {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 20px;
  margin: -8px 0 8px;
  padding-bottom: 16px;
  border-bottom: 2px solid #0C2D5E;
}

.smap__count {
  margin: 0;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.5;
  color: #061629;
}

.smap__intro .smap__more {
  margin-top: 0;
}

.smap__subtitle {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid #E3E7EE;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  font-weight: 700;
  font-size: 15.5px;
  line-height: 1.5;
  color: #0C2D5E;
}

/* Decorative count beside a bucket heading. aria-hidden in the markup, so it is
   never read as part of the heading. */
.smap__num {
  flex: none;
  min-width: 22px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #F4F7FC;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  color: #4A5568;
}

.smap__empty {
  margin: 0 0 12px;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  font-size: 14.5px;
  line-height: 1.7;
  color: #4A5568;
}

/* ---------- Link lists ---------- */

.smap__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.smap__list--sub {
  margin: 6px 0 6px 16px;
  padding-left: 12px;
  border-left: 1px solid #E3E7EE;
}

.smap__item {
  margin: 0;
}

.smap__link {
  display: block;
  padding: 7px 0;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  font-size: 14.5px;
  line-height: 1.6;
  color: #1A1A1A;
  text-decoration: none;
  transition: color .15s ease, padding-left .15s ease;
}

.smap__link:hover,
.smap__link:focus-visible {
  color: #C8102E;
  padding-left: 4px;
}

.smap__link--sub {
  font-size: 14px;
  color: #4A5568;
}

/* ---------- Taxonomy chips ---------- */

.smap__terms {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.smap__term {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border: 1px solid #E3E7EE;
  border-radius: 999px;
  background: #F4F7FC;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  font-size: 12.5px;
  line-height: 1.4;
  color: #0C2D5E;
  text-decoration: none;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.smap__term:hover,
.smap__term:focus-visible {
  background: #fff;
  border-color: #0C2D5E;
  color: #0C2D5E;
}

/* ---------- "See all" ---------- */

.smap__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  font-family: 'Noto Sans JP', system-ui, sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  color: #0C2D5E;
  text-decoration: none;
  transition: gap .2s ease, color .15s ease;
}

.smap__more::after {
  content: '→';
}

.smap__more:hover,
.smap__more:focus-visible {
  gap: 10px;
  color: #C8102E;
}

/* ---------- Mobile ---------- */

@media (max-width: 767px) {
  .smap__box {
    padding: 48px 20px 64px;
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .smap__title {
    font-size: 17px;
  }
}