/* ==========================================================================
   dads.css — デジタル庁デザインシステム（DADS）HTML版からの部分導入
   出典: C:\main\private\90_公開サイト\dads-html\ (MIT License, Digital Agency)
   導入部品: breadcrumb / toc (link・list依存) / disclosure
   方針: global.css全体は持ち込まず使用変数のみ抽出。フォント・キーカラーは
         サイトのトーン（土色系）に上書き。末尾に「サイト適合上書き」あり。
   導入日: 2026-07-18
   ========================================================================== */

:root {
  --color-neutral-black: #000000;
  --color-neutral-solid-gray-420: #949494;
  --color-neutral-solid-gray-800: #333333;
  --color-neutral-solid-gray-900: #1a1a1a;
  --color-primitive-blue-900: #0017c1;
  --color-primitive-blue-1000: #00118f;
  --color-primitive-magenta-900: #8b008b;
  --color-primitive-orange-800: #c74700;
  --color-primitive-yellow-300: #ffd43d;
  /* キーカラーはサイトの土色系へ（DADS標準は blue-1000） */
  --color-key-1000: #8b5228;
  /* 本サイト既存フォントに合わせる（DADS標準は Noto Sans JP） */
  --font-family-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", sans-serif;
}

.dads-u-visually-hidden {
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  height: 1px !important;
  overflow: hidden !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

/* ===== breadcrumb ===== */
.dads-breadcrumb {
  display: flex;
  column-gap: calc(4 / 16 * 1rem);
  color: var(--color-neutral-solid-gray-800);
  font-weight: normal;
  font-size: calc(16 / 16 * 1rem);
  line-height: 1.7;
  font-family: var(--font-family-sans);
  letter-spacing: 0.02em;
}

.dads-breadcrumb__label {
  flex-shrink: 0;
}

.dads-breadcrumb__label::after {
  content: "：";
}

.dads-breadcrumb__list {
  list-style-type: "";
  margin: 0;
  padding: 0;
}

.dads-breadcrumb__item {
  display: inline;
  overflow-wrap: break-word;
}

.dads-breadcrumb__link:any-link {
  color: var(--color-primitive-blue-1000);
  text-decoration: underline;
  text-decoration-thickness: calc(1 / 16 * 1rem);
  text-underline-offset: calc(3 / 16 * 1rem);
}

@media (hover: hover) {
  .dads-breadcrumb__link:hover {
    color: var(--color-primitive-blue-900);
    text-decoration-thickness: calc(3 / 16 * 1rem);
  }
}

.dads-breadcrumb__link:active {
  color: var(--color-primitive-orange-800);
  text-decoration-thickness: calc(1 / 16 * 1rem);
}

.dads-breadcrumb__link:focus-visible {
  outline: calc(4 / 16 * 1rem) solid var(--color-neutral-black);
  outline-offset: calc(2 / 16 * 1rem);
  border-radius: calc(4 / 16 * 1rem);
  background-color: var(--color-primitive-yellow-300);
  box-shadow: 0 0 0 calc(2 / 16 * 1rem) var(--color-primitive-yellow-300);
}

.dads-breadcrumb__link-icon {
  display: inline-block;
  vertical-align: -0.15em;
  width: calc(16 / 16 * 1rem);
  height: calc(16 / 16 * 1rem);
}

.dads-breadcrumb__separator::before,
.dads-breadcrumb__separator::after {
  content: " ";
}

.dads-breadcrumb__separator-icon {
  display: inline-block;
  margin-right: calc(1 / 16 * 1rem);
  margin-left: calc(1 / 16 * 1rem);
  width: calc(12 / 16 * 1rem);
  height: calc(12 / 16 * 1rem);
  vertical-align: middle;
  color: var(--color-neutral-solid-gray-900);
}
/* ===== link ===== */
.dads-link:any-link {
  color: var(--color-primitive-blue-1000);
  text-decoration: underline;
  text-decoration-thickness: calc(1 / 16 * 1rem);
  text-underline-offset: calc(3 / 16 * 1rem);
}

.dads-link:visited {
  color: var(--color-primitive-magenta-900);
}

@media (hover: hover) {
  .dads-link:hover {
    color: var(--color-primitive-blue-900);
    text-decoration-thickness: calc(3 / 16 * 1rem);
  }
}

.dads-link:active {
  color: var(--color-primitive-orange-800);
  text-decoration-thickness: calc(1 / 16 * 1rem);
}

.dads-link:focus-visible {
  outline: calc(4 / 16 * 1rem) solid var(--color-neutral-black);
  outline-offset: calc(2 / 16 * 1rem);
  border-radius: calc(4 / 16 * 1rem);
  background-color: var(--color-primitive-yellow-300);
  box-shadow: 0 0 0 calc(2 / 16 * 1rem) var(--color-primitive-yellow-300);
}

.dads-link__icon {
  display: inline-block;
  width: calc(16 / 16 * 1rem);
  height: calc(16 / 16 * 1rem);
  vertical-align: -0.15em;
}
/* ===== list ===== */
.dads-list {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: calc(32 / 16 * 1rem);
  list-style-type: revert;
}

.dads-list > li {
  --_spacing: 0;
  padding-top: var(--_spacing);
  padding-bottom: var(--_spacing);
}

.dads-list[data-spacing="4"] > li {
  --_spacing: calc(4 / 16 * 1rem);
}

.dads-list[data-spacing="8"] > li {
  --_spacing: calc(8 / 16 * 1rem);
}

.dads-list[data-spacing="12"] > li {
  --_spacing: calc(12 / 16 * 1rem);
}

.dads-list[data-marker="number"] {
  padding-left: 0;
  list-style-type: none;
}

.dads-list[data-marker="number"] > li {
  padding-left: calc(32 / 16 * 1rem);
}

.dads-list[data-marker="number"] > li > a:only-child {
  margin-left: calc(-32 / 16 * 1rem);
  padding-left: calc(32 / 16 * 1rem);
}

.dads-list[data-marker="number"] > li > span:first-child,
.dads-list[data-marker="number"] > li > a:only-child > span:first-child {
  margin-left: calc(-32 / 16 * 1rem);
  display: inline-block;
  min-width: calc(32 / 16 * 1rem);
  white-space: nowrap;
}

.dads-list[data-marker="number"] > li > a:only-child > span:first-child {
  text-decoration: inherit;
}

.dads-list .dads-list {
  margin-top: var(--_spacing);
  margin-bottom: calc(-1 * var(--_spacing));
}
/* ===== toc ===== */
.dads-toc {
  width: fit-content;
  color: var(--color-neutral-solid-gray-800);
  font-weight: normal;
  font-size: calc(16 / 16 * 1rem);
  line-height: 1.7;
  font-family: var(--font-family-sans);
  letter-spacing: 0.02em;
}

.dads-toc[data-border] {
  border: 1px var(--color-neutral-solid-gray-420);
  padding-top: calc(12 / 16 * 1rem);
  padding-right: calc(24 / 16 * 1rem);
  padding-bottom: calc(24 / 16 * 1rem);
  padding-left: calc(20 / 16 * 1rem);
}

.dads-toc[data-border="dotted"] {
  border-style: dotted;
}

.dads-toc[data-border="solid"] {
  border-style: solid;
}

.dads-toc__heading {
  margin-top: 0;
  margin-bottom: calc(8 / 16 * 1rem);
  font: inherit;
  letter-spacing: inherit;
}

.dads-toc .dads-link:any-link {
  color: inherit;
}

.dads-toc > .dads-list:has(.dads-list) {
  padding-left: 0;
  list-style-type: none;
  font-weight: bold;
}

.dads-toc > .dads-list .dads-list {
  list-style-type: disc;
}

.dads-toc > .dads-list > li > .dads-list {
  margin-top: 0;
  font-weight: normal;
}

.dads-toc > .dads-list .dads-list .dads-list {
  list-style-type: circle;
}
/* ===== disclosure ===== */
.dads-disclosure__summary {
  display: flex;
  align-items: start;
  justify-content: start;
  gap: calc(8 / 16 * 1rem);
  width: fit-content;
  cursor: default;
  list-style-type: none;
}

@media (hover: hover) {
  .dads-disclosure__summary:hover {
    text-decoration: underline;
    text-underline-offset: calc(3 / 16 * 1rem);
  }
}

.dads-disclosure__summary:focus-visible {
  outline: calc(4 / 16 * 1rem) solid var(--color-neutral-black);
  outline-offset: calc(2 / 16 * 1rem);
  border-radius: calc(4 / 16 * 1rem);
  background-color: var(--color-primitive-yellow-300);
  box-shadow: 0 0 0 calc(2 / 16 * 1rem) var(--color-primitive-yellow-300);
}

.dads-disclosure__summary::marker {
  content: "";
}

.dads-disclosure__summary::-webkit-details-marker {
  display: none;
}

.dads-disclosure__icon {
  flex-shrink: 0;
  margin-top: calc((1lh - 24px) / 2);
  color: var(--color-key-1000);
}

@media (forced-colors: active) {
  .dads-disclosure__icon {
    color: inherit;
  }
}

.dads-disclosure[open] .dads-disclosure__icon {
  rotate: 180deg;
}

.dads-disclosure__icon-hover {
  display: none;
}

@media (hover: hover) {
  .dads-disclosure__summary:hover .dads-disclosure__icon-circle {
    fill: Canvas;
  }

  .dads-disclosure__summary:hover .dads-disclosure__icon-triangle {
    fill: currentcolor;
  }
}

.dads-disclosure__content {
  padding-left: calc(32 / 16 * 1rem);
  margin: calc(16 / 16 * 1rem) 0;
}

.dads-disclosure__back-link:any-link {
  display: flex;
  align-items: start;
  gap: calc(6 / 16 * 1rem);
  width: fit-content;
  color: var(--color-primitive-blue-1000);
  text-decoration: underline;
  text-decoration-thickness: calc(1 / 16 * 1rem);
  text-underline-offset: calc(3 / 16 * 1rem);
  text-spacing-trim: trim-start;
}

@media (hover: hover) {
  .dads-disclosure__back-link:hover {
    color: var(--color-primitive-blue-900);
    text-decoration-thickness: calc(3 / 16 * 1rem);
  }
}

.dads-disclosure__back-link:active {
  color: var(--color-primitive-orange-800);
  text-decoration-thickness: calc(1 / 16 * 1rem);
}

.dads-disclosure__back-link:focus-visible {
  outline: calc(4 / 16 * 1rem) solid var(--color-neutral-black);
  outline-offset: calc(2 / 16 * 1rem);
  border-radius: calc(4 / 16 * 1rem);
  background-color: var(--color-primitive-yellow-300);
  box-shadow: 0 0 0 calc(2 / 16 * 1rem) var(--color-primitive-yellow-300);
}

.dads-disclosure__back-link-icon {
  margin-top: calc((1lh - 24 / 16 * 1rem) / 2);
  flex-shrink: 0;
}

/* ==========================================================================
   サイト適合上書き（gbf-guide） — DADS部品を本サイトのトーンに合わせる
   ========================================================================== */

/* パンくず: 旧 .breadcrumb の控えめなトーンを踏襲 */
.dads-breadcrumb {
  font-size: .9em;
  margin-bottom: 1em;
  color: #999;
}
.dads-breadcrumb__link:any-link { color: #4a7dc8; }
.dads-breadcrumb__separator-icon { color: #bbb; }

/* 章の目次: サイトの白カード調 */
.dads-toc {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
  margin: 1em 0 1.5em;
}
.dads-toc[data-border] { border-color: #e5dcc8; }
.dads-toc__heading { color: #8b5228; font-weight: bold; }

/* 折りたたみ: summary の見出し色 */
.dads-disclosure__summary { color: #8b5228; font-weight: bold; cursor: pointer; }
