/* Service directory, graphic service and shared footer: 2026-09-28. */
.zz-service-directory {
  width: min(88vw, 75rem);
  margin-inline: auto;
  padding-top: calc(var(--hh) + clamp(3rem, 5.5556vw, 5rem));
  padding-bottom: clamp(4rem, 6.9444vw, 6.25rem);
  line-height: 2.2;
}
.zz-service-directory h1 {
  margin: 0;
  font-size: clamp(1.75rem, 3.0556vw, 2.75rem);
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: .02em;
}
.zz-service-directory h2 {
  margin: 0;
  font-size: clamp(1.25rem, 1.8056vw, 1.625rem);
  font-weight: 700;
  line-height: 2;
}
.zz-service-directory p { margin: 0; line-height: 2.2; }
.zz-service-directory a { color: #262627; text-underline-offset: .3em; }
.zz-service-directory a:focus-visible,
.zz-footer-main--services a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.zz-service-directory__lead { max-width: 44rem; margin-top: clamp(1.5rem, 2.7778vw, 2.5rem); }
.zz-service-directory__nav {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem clamp(1.5rem, 2.2222vw, 2rem);
  margin: clamp(2rem, 3.3333vw, 3rem) 0 clamp(3rem, 5.5556vw, 5rem);
}
.zz-service-directory__nav a {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  min-height: 2.75rem;
  border-bottom: 1px solid rgba(38,38,39,.25);
  font-size: .8125rem;
  text-decoration: none;
}
.zz-service-directory__section {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(2rem, 6.9444vw, 6.25rem);
  padding-block: clamp(3rem, 5.5556vw, 5rem);
  border-top: 1px solid rgba(38,38,39,.14);
  scroll-margin-top: calc(var(--hh) + 1rem);
}
.zz-service-directory__intro p { margin-top: 1.25rem; }
.zz-service-directory__more { display: inline-flex; min-height: 2.75rem; align-items: center; margin-top: 1.25rem; }
.zz-service-directory__items { margin: 0; padding: 0; list-style: none; }
.zz-service-directory__items li { padding: 1rem 0; border-bottom: 1px solid rgba(38,38,39,.1); }
.zz-service-directory__items li:first-child { padding-top: 0; }
.zz-service-directory__items li:last-child { border-bottom: 0; }
.zz-service-directory__items h3 { margin: 0; font-size: 1rem; font-weight: 700; line-height: 2.2; }
.zz-service-directory__items h3 a { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; min-height: 2.75rem; padding-block: .25rem; text-decoration: none; }
.zz-service-directory__items h3 a span { display: inline; flex: 0 0 auto; }
.zz-service-directory__items h3 a:hover { text-decoration: underline; }
.zz-service-directory__items p { margin-top: .25rem; font-size: .8125rem; color: rgba(38,38,39,.76); }
.zz-service-directory__tags { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; padding: 0; margin: 0; list-style: none; }
.zz-service-directory__tags li { line-height: 2.2; }
.zz-service-directory__section ol { margin: 0; padding-left: 1.5rem; list-style: decimal; }
.zz-service-directory__section ol li { padding-bottom: .75rem; }
.zz-service-directory__section details { border-bottom: 1px solid rgba(38,38,39,.14); padding-block: 1rem; }
.zz-service-directory__section summary { cursor: pointer; font-weight: 700; line-height: 2.2; }
.zz-service-directory__section details p { padding-top: 1rem; font-size: .875rem; }
.zz-service-directory__contact { border-top: 1px solid rgba(38,38,39,.14); padding-top: clamp(3rem,5.5556vw,5rem); }
.zz-service-directory__contact p { margin-top: 1rem; }
.zz-service-directory__contact .zz-svc-ctas { margin-top: 1.5rem; }
.zz-footer .zz-footer-main--services { grid-template-columns: 1fr; gap: clamp(2rem,3.3333vw,3rem); }
.zz-footer-main--services .zz-footer-logo { justify-self: start; }
.zz-footer-main--services .zz-footer-meta { grid-column: 1; }
.zz-footer-site-nav { display: flex; flex-wrap: wrap; gap: .75rem clamp(1rem,2.7778vw,2.5rem); font-family: var(--en_sans); font-size: .8125rem; }
.zz-footer-site-nav a { display: inline-flex; align-items: center; min-height: 2.75rem; }
.zz-footer-service-nav {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: clamp(1.5rem,3.3333vw,3rem);
  border-top: 1px solid rgba(255,255,255,.2);
  padding-top: clamp(2rem,3.3333vw,3rem);
}
.zz-footer-service-nav h2 { margin: 0 0 1rem; font-size: clamp(.875rem,1.25vw,1.125rem); font-weight: 700; line-height: 2.2; }
.zz-footer-service-nav ul { list-style: none; margin: 0; padding: 0; }
.zz-footer-service-nav li { margin: .25rem 0; font-size: .8125rem; line-height: 2.2; }
.zz-footer-service-nav a { display: inline-block; padding-block: .25rem; }
.zz-footer-service-nav a:hover,.zz-footer-site-nav a:hover { text-decoration: underline; text-underline-offset: .3em; }
@media(max-width:768px) {
  .zz-service-directory { width: calc(100% - 2.5rem); padding-top: calc(var(--hh) + 2.5rem); }
  .zz-service-directory h1 { font-size: clamp(1.5rem,6.4vw,2rem); line-height: 1.9; }
  .zz-service-directory__lead { margin-top: 1.5rem; }
  .zz-service-directory__nav { gap: .5rem 1.25rem; margin-block: 2rem 3rem; }
  .zz-service-directory__section { grid-template-columns: 1fr; gap: 1.5rem; padding-block: 3rem; }
  .zz-service-directory__intro p { margin-top: .75rem; }
  .zz-footer-service-nav { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem 1.25rem; }
  .zz-footer-service-nav h2 { font-size: .875rem; }
  .zz-footer-service-nav li { font-size: .75rem; }
}
@media(prefers-reduced-motion:reduce) {
  .zz-service-directory *, .zz-footer-main--services * { scroll-behavior: auto; transition: none; }
}

/* ─── フッター:サービス群が2列のときも間延びしないレイアウト(2026-09-28) ─── */
@media (min-width: 1100px) {
  .zz-footer .zz-footer-main--services {
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: clamp(2rem, 4vw, 4rem);
    align-items: start;
  }
  /* 1段目:ロゴ左・サイト内ナビ右 */
  .zz-footer-main--services .zz-footer-logo { grid-column: 1; grid-row: 1; }
  .zz-footer-main--services .zz-footer-site-nav {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: center;
  }
  /* 2段目:罫線は全幅のまま、サービス列は内容幅で左に寄せる */
  .zz-footer-main--services .zz-footer-service-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    justify-content: start;
    column-gap: clamp(3rem, 6vw, 6.5rem);
  }
  /* 空いた右側に社名・事業表記を置く */
  .zz-footer-main--services .zz-footer-meta {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: end;
    align-self: start;
    text-align: right;
    padding-top: clamp(2rem, 3.3333vw, 3rem);
    max-width: 22rem;
  }
}
@media (min-width: 769px) and (max-width: 1099px) {
  .zz-footer-service-nav {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    justify-content: start;
    column-gap: clamp(2.5rem, 6vw, 5rem);
  }
}

/* ─── フッター:サービス群を「見出し+リンク」の1行×2行に(2026-09-28) ─── */
@media (min-width: 769px) {
  .zz-footer-service-nav {
    display: flex;
    flex-direction: column;
    gap: clamp(.6rem, 1vw, 1rem);
  }
  .zz-footer-service-nav > div {
    display: flex;
    align-items: baseline;
    gap: clamp(1.25rem, 2.5vw, 2.25rem);
  }
  .zz-footer-service-nav h2 {
    flex: 0 0 auto;
    min-width: 9.5rem;
    margin: 0;
    line-height: 1.9;
  }
  .zz-footer-service-nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: .1rem clamp(1rem, 1.8vw, 1.6rem);
  }
  .zz-footer-service-nav li {
    margin: 0;
    line-height: 1.9;
  }
  .zz-footer-service-nav a { padding-block: .15rem; }
}
@media (min-width: 1100px) {
  .zz-footer-main--services .zz-footer-service-nav {
    grid-auto-flow: row;
    grid-auto-columns: auto;
    column-gap: 0;
  }
  .zz-footer-main--services .zz-footer-meta { max-width: 20rem; }
}

@media (min-width: 1100px) {
  .zz-footer-main--services .zz-footer-meta { max-width: none; white-space: nowrap; }
}

/* 1100〜1279px では社名を右に置くと重なるため下段へ戻す(2026-09-28) */
@media (min-width: 1100px) and (max-width: 1279px) {
  .zz-footer-main--services .zz-footer-meta {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: start;
    text-align: left;
    padding-top: 0;
    white-space: normal;
  }
}
