@charset "UTF-8";

/* ページ内目次：まとまり（左に紺の太字）と、その中の項目（右に丸い枠のボタン）を1行ずつ並べる */
.gi-legacy--entry .legacy-toc__groups {
  display: block;
}

.gi-legacy--entry .legacy-toc__group {
  display: grid;
  grid-template-columns: 14em minmax(0, 1fr);
  gap: 8px 28px;
  align-items: start;
  min-width: 0;
  padding: 14px 0;
  border-bottom: 1px solid var(--gi-line-soft);
}

/* 企業向けは、まとまりの名前が長いため左の列を広げる */
.gi-legacy--business .legacy-toc__group {
  grid-template-columns: 19em minmax(0, 1fr);
}

.gi-legacy--entry .legacy-toc__group:last-child {
  border-bottom: 0;
}

.gi-legacy--entry .legacy-content .legacy-toc__group > p {
  margin: 0;
  padding: 7px 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.6;
}

/* 中の項目が無いまとまりは、名前を1行に伸ばす */
.gi-legacy--entry .legacy-content .legacy-toc__group > p:only-child {
  grid-column: 1 / -1;
}

.gi-legacy--entry .legacy-content .legacy-toc__group > p a {
  color: var(--gi-navy);
  text-decoration: none;
}

.gi-legacy--entry .legacy-content .legacy-toc__group > p a::after {
  content: "↓";
  margin-left: 8px;
  color: var(--gi-accent);
  font-size: 13px;
}

.gi-legacy--entry .legacy-content .legacy-toc__group > p a:hover {
  color: var(--gi-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.gi-legacy--entry .legacy-toc__group ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.gi-legacy--entry #main > h2 {
  margin-top: 2.5rem;
}

.gi-legacy--entry .legacy-service + .legacy-service {
  margin-top: 1rem;
}

.gi-legacy--entry .legacy-service h3 {
  scroll-margin-top: 7rem;
}

@media (max-width: 700px) {
  /* まとまりの名前を上、項目のボタンを下に積む */
  .gi-legacy--entry .legacy-toc__group {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 12px 0 14px;
  }

  .gi-legacy--entry .legacy-content .legacy-toc__group > p {
    padding: 0;
  }
}