@charset "UTF-8";

/* 主役の3本(/service/advisory/・/service/assessment/・/service/ai/)と、代表の帯(技術顧問のページとトップ)。
   1画面目は共通部品(corporate-parts.css)、CTA 帯は corporate.css の1か所。ここでは本文の節だけを組む。
   色・角丸・書体・寸法は --corp-* トークンだけ。ブレークポイントは 780 / 781 / 1024 / 1025 だけ。 */
body .corp-advisory-page {
  overflow: clip;
  background: var(--corp-white);
  color: var(--corp-ink);
  font-family: var(--corp-font);
}

body .corp-advisory-page .contents-wrap,
body .corp-advisory-band .contents-wrap {
  width: var(--corp-content-w);
  margin: 0 auto;
}

/* メニュー名が1行に収まらない幅でも切れないよう、この3本だけ句で折り返す */
body main.corp-advisory-page .corp-statement_line {
  white-space: normal;
  text-wrap: balance;
  word-break: auto-phrase;
}

/* corporate.css は main 直下の section に上余白を当てるので、同じ詳細度に揃えて後ろで勝つ */
body main.corp-advisory-page > section:not(.corp-statement):not(.corporate-cta-sec),
body .corp-advisory-band {
  margin: 0;
  padding: var(--corp-section-y) 0;
  border-top: 1px solid var(--corp-rule);
}

body main.corp-advisory-page > section.corp-advisory-section--tinted,
body .corp-advisory-band {
  background: var(--corp-grain), var(--corp-paper);
}

/* 節のラベル(等幅・Title Case)と日本語の見出し。about の節と同じ見た目 */
body .corp-advisory-eyebrow,
body .corp-advisory-steps_num {
  display: block;
  margin: 0;
  color: var(--corp-sky-text);
  font-family: var(--corp-mono);
  font-size: var(--corp-label-size);
  font-weight: 400;
  letter-spacing: var(--corp-label-ls);
  line-height: 1.5;
}

body .corp-advisory-title {
  margin: 12px 0 0;
  color: var(--corp-ink);
  font-size: var(--corp-h2);
  font-weight: 900;
  letter-spacing: var(--corp-h2-ls);
  line-height: var(--corp-h2-lh);
  text-wrap: pretty;
  word-break: auto-phrase;
}

body .corp-advisory-form {
  margin: 16px 0 0;
  color: var(--corp-soft);
  font-family: var(--corp-mono);
  font-size: var(--corp-label-size);
  letter-spacing: var(--corp-label-ls);
}

/* 状況・お渡しするもの・実績: 左に水色の線を引いた行 */
body .corp-advisory-list {
  display: grid;
  gap: 12px;
  max-width: 48em;
  margin: clamp(24px, 3vw, 36px) 0 0;
  padding: 0;
  list-style: none;
}

body .corp-advisory-list > li {
  padding: 14px 18px;
  border: 1px solid var(--corp-rule);
  border-left: 3px solid var(--corp-sky);
  border-radius: var(--corp-radius);
  background: var(--corp-white);
  color: var(--corp-ink);
  font-size: 16px;
  line-height: var(--corp-body-lh-tight);
  text-wrap: pretty;
  word-break: auto-phrase;
}

body .corp-advisory-note {
  margin: 16px 0 0;
  color: var(--corp-soft);
  font-size: 14px;
  line-height: var(--corp-body-lh-tight);
}

/* 進め方と、相談から始めるまで: 番号つきの段 */
body .corp-advisory-steps {
  display: grid;
  gap: 16px;
  margin: clamp(24px, 3vw, 36px) 0 0;
  padding: 0;
  list-style: none;
}

body .corp-advisory-steps > li,
body .corp-advisory-example {
  padding: 20px 22px 22px;
  border: 1px solid var(--corp-rule);
  border-radius: var(--corp-radius-lg);
  background: var(--corp-white);
}

body .corp-advisory-steps h3,
body .corp-advisory-example h3 {
  margin: 8px 0 0;
  color: var(--corp-ink);
  font-size: var(--corp-h3-sm);
  font-weight: 700;
  line-height: 1.45;
  word-break: auto-phrase;
}

body .corp-advisory-steps p,
body .corp-advisory-example p {
  margin: 10px 0 0;
  color: var(--corp-ink);
  font-size: 15px;
  line-height: var(--corp-body-lh-tight);
  text-wrap: pretty;
}

/* AI の実装例: 3件のカード */
body .corp-advisory-examples {
  display: grid;
  gap: 16px;
  margin-top: clamp(24px, 3vw, 36px);
}

body .corp-advisory-example h3 {
  margin-top: 0;
  font-size: var(--corp-h3);
}

/* 代表の帯: 名前・資格・数字3つ・経歴へのリンク。写真は置かない */
body .corp-advisory-band_inner {
  display: grid;
  gap: clamp(24px, 3vw, 40px);
}

body .corp-advisory-band_person {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 16px;
  margin: 20px 0 0;
}

body .corp-advisory-band_name {
  color: var(--corp-ink);
  font-size: var(--corp-h3-lg);
  font-weight: 900;
}

body .corp-advisory-band_role {
  color: var(--corp-soft);
  font-size: 15px;
}

body .corp-advisory-band_credentials {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

body .corp-advisory-band_credentials > li {
  padding: 4px 10px;
  border: 1px solid var(--corp-rule);
  border-radius: var(--corp-radius);
  background: var(--corp-white);
  color: var(--corp-ink);
  font-family: var(--corp-mono);
  font-size: var(--corp-label-size);
  letter-spacing: var(--corp-label-ls);
  line-height: 1.5;
}

body .corp-advisory-band_figures {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  margin: 0;
}

body .corp-advisory-band_figures > div {
  padding: 18px 20px;
  border-top: 3px solid var(--corp-sky);
  background: var(--corp-white);
}

body .corp-advisory-band_figures dt {
  color: var(--corp-ink);
  font-size: clamp(24px, 2.6vw, 32px);
  font-weight: 900;
  line-height: 1.3;
}

body .corp-advisory-band_figures dd {
  margin: 8px 0 0;
  color: var(--corp-ink);
  font-size: 15px;
  line-height: var(--corp-body-lh-tight);
  word-break: auto-phrase;
}

body .corp-advisory-band_link {
  justify-self: start;
  color: var(--corp-sky-text);
  font-weight: 700;
}

@media (min-width: 781px) {
  body .corp-advisory-list--grid,
  body .corp-advisory-steps--four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body .corp-advisory-band_figures {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1025px) {
  body .corp-advisory-steps,
  body .corp-advisory-examples {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body .corp-advisory-steps--four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}