/**
 * 事業紹介 — Figma MF_Web Business（PageHero / Three Drivers / 基盤行 / 工程）
 * トークン・変数のみ（HEX 直書き禁止）
 */

.business-page {
  --fs-business-driver-num: clamp(2rem, calc(24px + 2vw), 3rem); /* 32→48px · 行番号 */
  /* Figma .container / .numberssection2 — Three Drivers */
  --business-overview-head-gap: var(--space-8); /* 32px */
  --business-overview-head-min-h: 198px; /* 198px */
  --business-overview-display-min-h: 149px; /* 149px · Figma .numberssection */
  --business-overview-display-ls: -1px;
  --business-overview-display-lh: 72px;
  --business-overview-accent-top: 77px; /* Figma .of-growth */
  --business-overview-accent-color: var(--color-brand-primary); /* コンセプトブルー · of Growth */
  --business-overview-lead-top: 41px; /* Figma .paragraph */
  --business-overview-lead-left: 853px;
  --business-overview-lead-max: 387px; /* 387px */
  --business-overview-lead-h: 72px; /* 72px */
  --business-overview-title-max: 647px; /* 647px 相当 */
  /* Figma .link / .container2 — 3ドライバー行 */
  --business-driver-row-min-h: 140px; /* 140px */
  --business-driver-row-pad-y: 45px; /* 45px */
  --business-driver-inner-max: 1242px; /* 1242px */
  --business-driver-inner-gap: var(--space-6); /* 24px */
  --business-driver-head-w: 18rem; /* 288px */
  --business-driver-head-gap: 42px; /* 42px */
  --business-driver-num-size: 3rem; /* 48px */
  --business-driver-desc-w: 545px; /* 545px */
  --business-driver-desc-lh: 25px; /* 25px */
  --business-driver-foot-w: 314px; /* 314px */
  /* Figma .businesspage — セクション全体 */
  --business-overview-section-gap: 56px; /* 56px */
  --business-overview-content-max: 1240px; /* 1240px · .container */
  --business-overview-drivers-min-h: 421px; /* 421px · .container2 */
  /* Figma .businesspage — 基盤事業 .frame-parent / .container2 */
  --business-foundation-frame-max: 1241px; /* 1241px */
  --business-foundation-frame-gap: var(--space-5); /* 20px */
  --business-foundation-title-w: 139px; /* 139px */
  --business-foundation-lead-max: 42rem; /* 672px */
  --business-foundation-lead-min-h: 60px; /* 60px */
  --business-foundation-process-after-frame: 66px; /* 66px */
  --business-foundation-process-min-h: 171px; /* 171px */
  --business-foundation-process-pad-inline: 23px; /* 23px · .container2 left */
  --business-foundation-process-step-w: 226px; /* 226px */
  /* Figma .section / .backgroundborder — リサイクルフロー */
  --business-flow-section-max: 1234px; /* 1234px */
  --business-flow-section-pad-inline: 56px; /* 56px */
  --business-flow-head-gap: 18px; /* 18px */
  --business-flow-title-ls: 1px; /* 1px */
  --business-flow-canvas-pad-block-start: 102px; /* 102px */
  --business-flow-canvas-pad-inline: 56px; /* 56px */
  --business-flow-canvas-pad-block-end: 4rem; /* 64px */
  --business-flow-canvas-bg: color-mix(in srgb, var(--color-surface-paper) 88%, var(--color-line-border));
  --business-flow-canvas-border: color-mix(in srgb, var(--color-surface-paper) 50%, var(--color-surface-white));
  /* Figma .mf — エコシステム締めコピー */
  --business-ecosystem-closing-w: 42rem; /* 672px */
  --business-ecosystem-closing-h: 72px; /* 72px */
  /* Figma .container — 3つの種カード（01 PEOPLE / 03 TECHNOLOGY 等） */
  --business-seed-card-h: 369px;
  --business-seed-card-pad-block: 44px; /* 44px */
  --business-seed-card-pad-inline: 40px; /* 40px */
  --business-seed-card-gap: var(--space-4); /* 16px */
  --business-seed-inner-w: 297px; /* 297px */
  --business-seed-num-size: 40px; /* 40px */
  --business-seed-num-ls: -1px; /* -1px @ 40px */
  --business-seed-num-row-h: 40px; /* 40px */
  --business-seed-num-w-01: 40px; /* 40px */
  --business-seed-num-w-02: 49px; /* 49px */
  --business-seed-num-w-03: 49px; /* 49px · 03 */
  --business-seed-en-h: 24px; /* 24px */
  --business-seed-en-label-top: 7px;
  --business-seed-title-h: 30px; /* 30px · .heading-4 行ボックス */
  --business-seed-title-lh: 35px; /* 35px · 03 .b */
  --business-seed-desc-w: 286px; /* 286px */
  --business-seed-desc-h: 143px; /* 143px */
  --business-seed-desc-text-top: -3px;
}

/* ----- PageHero（Figma .pagehero · 378px） ----- */
.page-hero--business .page-hero__overlay-v {
  width: 100%;
  height: 100%;
  background: var(--page-hero-overlay-v);
}

.page-hero--business .page-hero__overlay-h {
  width: 100%;
  height: 100%;
  background: var(--page-hero-overlay-h);
}

.page-hero--business .page-hero__bottom-rule {
  height: 1px;
  background: var(--page-hero-bottom-rule);
}

/* Figma .dsc-7032-1-icon: 写真をやや上にオフセットしてトリミング */
.page-hero--business .page-hero__media-img--business {
  inset: auto;
  top: clamp(-260px, -30vw, -420px);
  left: clamp(-4px, -1vw, -15px);
  right: auto;
  width: 102%;
  height: clamp(416px, 78vw, 951px);
  max-width: none;
  object-fit: cover;
  object-position: center 18%;
}

@media (max-width: 1023px) {
  .page-hero--business .page-hero__media-img--business {
    inset: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-position: center 15%;
  }
}

/* ----- Three Drivers（Figma .businesspage / .container / .container2） ----- */
.business-page .business-overview {
  background-color: var(--color-surface-white);
}

/* Figma .businesspage — flex · gap 56 · padding 128 80 */
.business-page .business-overview__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--business-overview-section-gap);
  box-sizing: border-box;
  width: 100%;
  max-width: var(--layout-frame);
  margin-inline: auto;
}

/* Figma .container — 1240 × 198 · gap 32 */
.business-page .business-overview__header.section-head-stack--jp-en-md {
  flex-shrink: 0;
  gap: var(--business-overview-head-gap);
  width: 100%;
  max-width: var(--business-overview-content-max);
  margin-bottom: 0;
}

.business-page .business-overview__eyebrow.section-head-stack__eyebrow {
  display: flex;
  align-items: center;
  min-height: var(--history-section-eyebrow-height);
  margin: 0;
  padding: 0 3px;
  box-sizing: border-box;
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 900;
  line-height: var(--history-section-eyebrow-lh);
  letter-spacing: var(--history-section-eyebrow-tracking);
  text-transform: none;
  color: var(--color-brand-primary);
}

.business-page .business-overview__header-grid {
  display: flex;
  flex-direction: column;
  gap: var(--section-title-subtitle-gap);
}

.business-page .business-overview__title {
  margin: 0;
  font-family: var(--font-en);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.0167em;
  color: var(--color-ink-900);
}

.business-page .business-overview__title-line {
  display: block;
  font-size: var(--fs-display-en-xl);
  line-height: var(--business-overview-display-lh);
  letter-spacing: var(--business-overview-display-ls);
  color: var(--color-ink-900);
}

/* Figma .of-growth — 346×72 · コンセプトカラー（TOP One Mission 同型） */
.business-page .business-overview__title-line--accent,
.business-page .business-overview__header.section-head-stack--jp-en-md .business-overview__title-line--accent {
  color: var(--business-overview-accent-color);
}

.business-page .business-overview__title-line + .business-overview__title-line {
  margin-top: var(--global-teams-line-gap);
}

/* Figma .paragraph2 / .div2 — 15px / lh 36 */
.business-page .business-overview__lead {
  margin: 0;
  max-width: var(--business-overview-lead-max);
  font-family: var(--font-jp);
  font-size: 15px;
  font-weight: 400;
  line-height: 36px;
  color: var(--color-ink-500);
}

/* Figma .container2 — 421px · 3行 + 下線 */
.business-page .business-overview__drivers {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex-shrink: 0;
  width: 100%;
  max-width: var(--business-overview-content-max);
}

.business-page .business-page__driver-row {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: var(--business-driver-row-min-h);
  padding-block: var(--business-driver-row-pad-y);
  border-top: 1px solid color-mix(in srgb, var(--color-ink-900) 8%, transparent);
  text-decoration: none;
  color: inherit;
  transition: background-color 0.5s ease;
}

.business-page .business-page__driver-row:hover {
  background-color: color-mix(in srgb, var(--color-surface-paper) 50%, transparent);
}

.business-page .business-page__driver-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--business-driver-inner-gap);
  box-sizing: border-box;
  width: 100%;
  max-width: var(--business-driver-inner-max);
  padding-inline: var(--space-6);
}

/* Figma .container-parent — 288px · gap 42 */
.business-page .business-page__driver-head {
  display: flex;
  flex: 0 0 var(--business-driver-head-w);
  align-items: center;
  gap: var(--business-driver-head-gap);
  width: var(--business-driver-head-w);
  min-width: 0;
}

.business-page .business-page__driver-num {
  flex-shrink: 0;
  font-family: var(--font-en);
  font-size: var(--fs-business-driver-num);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.02em;
  color: color-mix(in srgb, var(--color-ink-900) 10%, transparent);
  transition: color 0.5s ease;
}

.business-page .business-page__driver-row:hover .business-page__driver-num {
  color: color-mix(in srgb, var(--color-ink-900) 40%, transparent);
}

/* Figma .heading-3 / .b — 22px / lh 33 / tracking 1px */
.business-page .business-page__driver-title {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-family: var(--font-jp);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.06em;
  color: var(--color-ink-900);
  transition: color 0.5s ease;
}

.business-page .business-page__driver-row:hover .business-page__driver-title {
  color: var(--color-brand-primary);
}

/* Figma .paragraph / .div2 — 14px / lh 25.2 */
.business-page .business-page__driver-desc {
  flex: 1 1 var(--business-driver-desc-w);
  margin: 0;
  max-width: var(--business-driver-desc-w);
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 400;
  line-height: var(--business-driver-desc-lh);
  color: var(--color-ink-500);
}

/* Figma .container4 — 314px · gap 16 · 右寄せ */
.business-page .business-page__driver-foot {
  display: flex;
  flex: 0 0 var(--business-driver-foot-w);
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-4);
  width: var(--business-driver-foot-w);
  min-height: 24px;
  margin-left: auto;
}

.business-page .business-page__driver-stat {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.08em;
}

/* Figma .container11 */
.business-page .business-overview__drivers-end {
  height: 0;
  border-top: 1px solid color-mix(in srgb, var(--color-ink-900) 8%, transparent);
}

.business-page .business-page__driver-row[data-accent="primary"] .business-page__driver-stat,
.business-page .business-page__driver-row[data-accent="primary"] .business-page__driver-arrow {
  color: var(--color-brand-primary);
}

.business-page .business-page__driver-row[data-accent="secondary"] .business-page__driver-stat,
.business-page .business-page__driver-row[data-accent="secondary"] .business-page__driver-arrow {
  color: var(--color-brand-secondary);
}

.business-page .business-page__driver-row[data-accent="accent"] .business-page__driver-stat,
.business-page .business-page__driver-row[data-accent="accent"] .business-page__driver-arrow {
  color: var(--color-brand-accent-orange);
}

.business-page .business-page__driver-arrow {
  opacity: 0.5;
  transition:
    opacity 0.5s ease,
    transform 0.5s ease;
}

.business-page .business-page__driver-row:hover .business-page__driver-arrow {
  opacity: 1;
  transform: translateX(var(--space-1));
}

/* タブレット(768〜1023): padding-block が未定義で 0 になりヒーロー直後が詰まるため補う
   （モバイル 64px と デスクトップ 128px の中間 96px） */
@media (min-width: 768px) and (max-width: 1023px) {
  .business-page .business-overview__inner {
    padding-block: var(--space-24);
  }

  /* 基盤事業リード → 工程リスト（1024px+ と同じ 66px · Figma .frame-parent → .container2） */
  .business-page .business-page__process-flow {
    margin-top: var(--business-foundation-process-after-frame);
  }
}

/* ----- スマホ: Three Drivers 行 + 基盤事業セクション ----- */
@media (max-width: 767px) {
  /* TOP .top-numbers__wrap と同型（64px 24px） */
  .business-page .business-overview__inner.layout-inset {
    gap: var(--space-10);
    padding: var(--space-16) var(--space-6);
  }

  .business-page .business-overview__header.section-head-stack--jp-en-md {
    gap: var(--stack-gap-label-heading);
  }

  .business-page .business-overview__header-grid {
    gap: var(--space-6);
  }

  .business-page .business-overview__lead {
    max-width: none;
    font-size: var(--fs-lead-fluid);
    line-height: 1.7;
  }

  .business-page .business-overview__lead br {
    display: none;
  }

  .business-page .business-page__driver-row {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .business-page .business-page__driver-inner {
    display: grid;
    grid-template-columns: 3rem minmax(0, 1fr);
    column-gap: var(--space-4);
    row-gap: var(--space-3);
    align-items: center;
    padding-inline: 0;
  }

  .business-page .business-page__driver-head {
    display: contents;
  }

  .business-page .business-page__driver-num {
    grid-column: 1;
    grid-row: 1;
    font-size: 28px;
  }

  .business-page .business-page__driver-title {
    grid-column: 2;
    grid-row: 1;
    font-size: var(--fs-h4-fluid);
    line-height: 1.45;
    letter-spacing: 0.04em;
  }

  .business-page .business-page__driver-desc {
    grid-column: 1 / -1;
    grid-row: 2;
    max-width: none;
    font-size: var(--fs-body-fluid);
    line-height: var(--fs-body-lh-fluid);
  }

  .business-page .business-page__driver-foot {
    grid-column: 1 / -1;
    grid-row: 3;
    flex: none;
    width: 100%;
    justify-content: space-between;
    padding-top: var(--space-3);
    margin-top: var(--space-1);
    margin-left: 0;
    border-top: 1px solid color-mix(in srgb, var(--color-ink-900) 6%, transparent);
  }

  .business-page .business-foundation {
    padding-top: var(--space-16);
    padding-bottom: var(--space-16);
  }

  .business-page .business-foundation__title-stack {
    gap: var(--space-4);
  }

  .business-page .business-foundation__lead {
    font-size: var(--fs-lead-fluid);
    line-height: 1.7;
    max-width: none;
  }

  .business-page .business-foundation__lead br {
    display: none;
  }

  .business-page .business-foundation__inner {
    padding-block: var(--space-16);
  }

  .business-page .business-foundation__frame {
    gap: var(--space-5);
  }

  .business-page .business-foundation__lead br {
    display: none;
  }

  .business-page .business-page__process-flow {
    margin-bottom: var(--space-10);
  }

  .business-page .business-flow {
    margin-bottom: var(--space-10);
    padding: var(--space-8) var(--space-4) var(--space-10);
  }

  .business-page .business-flow__title {
    font-size: var(--fs-h3-m);
    line-height: 1.45;
  }

  .business-page .business-flow__lead {
    font-size: var(--fs-body-fluid);
    line-height: var(--fs-body-lh-fluid);
  }

  .business-page .business-flow__canvas {
    padding: var(--space-6) var(--space-4);
    gap: var(--space-6);
  }

  .business-page .business-page__foundation-strips {
    margin-top: var(--space-10);
  }

  .business-page .business-page__foundation-strip-row {
    gap: var(--space-3);
  }

  .business-page .business-page__foundation-strip-icon {
    width: 20px;
    height: 20px;
    margin-top: 2px;
  }

  .business-page .business-page__foundation-strip-title {
    font-size: var(--fs-h4-m);
    line-height: 1.45;
  }

  .business-page .business-page__foundation-strip-desc {
    font-size: var(--fs-caption-m);
    line-height: 1.65;
  }

  .business-page .business-page__foundation-strip-detail {
    padding: var(--space-4) 0 0;
    font-size: var(--fs-body-fluid);
    line-height: var(--fs-body-lh-fluid);
  }

  /* エコシステム — 見出し・締めは Web と同型（中央）・サイズのみ段階 */
  .business-page #ecosystem {
    padding-top: var(--space-16);
    padding-bottom: var(--space-16);
  }

  .business-page .business-page__ecosystem-head {
    margin-bottom: var(--space-12);
    text-align: center;
  }

  .business-page .business-page__ecosystem-title {
    font-size: var(--fs-h2);
    line-height: 1.35;
    letter-spacing: -0.005em;
  }

  .business-page .business-page__ecosystem-lead {
    font-size: var(--fs-lead-fluid);
    line-height: 1.7;
    max-width: none;
  }

  .business-page .business-page__ecosystem-lead br {
    display: none;
  }

  .business-page .business-page__ecosystem-closing {
    margin-top: var(--space-12);
    padding-top: var(--space-8);
  }

  .business-page .business-page__ecosystem-closing-text {
    font-size: var(--fs-h4-m);
    line-height: 1.6;
    min-height: 0;
  }
}

/* ----- 基盤事業 見出し帯（Figma .container33 .foundation） ----- */
.business-page .business-page__section-eyebrow-dm {
  margin: 0;
  padding: 0 var(--space-1);
  font-family: var(--font-en);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: 0.171875rem;
  text-transform: uppercase;
  color: var(--color-brand-primary);
}

.business-page .business-page__section-eyebrow-dm--secondary {
  font-weight: 800;
  letter-spacing: 0.15em; /* 1.65px @ 11px · Figma .value-creation */
  color: var(--color-brand-secondary);
}

/* ----- 基盤事業（Figma .businesspage #fafdff · .frame-parent） ----- */
.business-page .business-foundation {
  background-color: color-mix(in srgb, var(--color-surface-paper) 50%, #fafdff);
}

.business-page .business-foundation__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--layout-frame);
  margin-inline: auto;
}

/* Figma .frame-parent — gap 20 */
.business-page .business-foundation__frame {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--business-foundation-frame-gap, var(--space-5));
  width: 100%;
  max-width: var(--business-foundation-frame-max);
}

/* Figma .container-parent — gap 16 */
.business-page .business-foundation__title-stack.section-head-stack--en-jp-title {
  align-items: flex-start;
  gap: var(--space-4);
  width: 100%;
  margin: 0;
}

/* Figma .container — 17px 行 */
.business-page .business-foundation__eyebrow-row {
  display: flex;
  align-self: stretch;
  align-items: center;
  box-sizing: border-box;
  height: var(--history-section-eyebrow-height);
  padding: 0 3px;
}

/* Figma .text / .foundation — 13px / 3px / 900 */
.business-page .business-foundation__eyebrow.section-head-stack__eyebrow {
  margin: 0;
  padding: 0 3px;
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 900;
  line-height: var(--history-section-eyebrow-lh);
  letter-spacing: var(--history-section-eyebrow-tracking);
  text-transform: uppercase;
  color: var(--color-brand-primary);
}

/* Figma .heading-2 / .b — 32px / lh 48 / top 0 */
.business-page .business-foundation__title {
  position: relative;
  align-self: flex-start;
  width: auto;
  min-width: var(--business-foundation-title-w);
  margin: 0;
  padding: 0;
  top: 0;
  font-family: var(--font-jp);
  font-size: var(--fs-h2-md);
  font-weight: 700;
  line-height: var(--section-title-jp-min-height);
  min-height: var(--section-title-jp-min-height);
  letter-spacing: 0;
  color: var(--color-ink-900);
}

.business-page .business-foundation__title::after {
  display: none;
}

@media (min-width: 1024px) {
  .business-page .business-foundation__title {
    font-size: var(--section-title-jp-size);
    line-height: var(--section-title-jp-line-height);
    min-height: var(--section-title-jp-line-height);
  }
}

/* Figma .paragraph — 672px / 15px / lh 36 */
.business-page .business-foundation__lead {
  margin: 0;
  max-width: var(--business-foundation-lead-max);
  font-family: var(--font-jp);
  font-size: 15px;
  font-weight: 400;
  line-height: 36px;
  color: var(--color-ink-500);
}

/* Figma .container2 — 6工程 */
.business-page .business-page__process-flow {
  width: 100%;
  max-width: var(--business-foundation-frame-max);
  margin-bottom: var(--space-16);
}

.business-page .business-page__process-steps--desktop {
  position: relative;
  display: none;
  align-items: flex-start;
  justify-content: space-between;
  box-sizing: border-box;
  width: 100%;
  min-height: var(--business-foundation-process-min-h, 171px);
  padding-inline: var(--business-foundation-process-pad-inline, var(--space-6));
  color: color-mix(in srgb, var(--color-brand-primary) 60%, transparent);
}

@media (min-width: 1024px) {
  .business-page .business-page__process-steps--desktop {
    display: flex;
  }
}

.business-page .business-page__process-step {
  position: relative;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  max-width: var(--business-foundation-process-step-w);
  min-height: 150px; /* 150px */
}

.business-page .business-page__process-step-icon {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  color: color-mix(in srgb, var(--color-brand-primary) 60%, transparent);
}

.business-page .business-page__process-step-track {
  position: relative;
  width: 100%;
  height: 44px; /* 44px */
  margin-top: 20px; /* 42 − 22 icon */
}

.business-page .business-page__process-step-connector {
  position: absolute;
  top: 18px; /* 18px · ライン縦位置 */
  left: calc(50% + 22px);
  right: calc(-50% - 2px);
  z-index: 0;
  display: flex;
  align-items: center;
  pointer-events: none;
}

.business-page .business-page__process-step-connector-line {
  flex: 1;
  border-top: 1px solid color-mix(in srgb, var(--color-brand-primary) 25%, transparent);
}

.business-page .business-page__process-step-connector-arrow {
  flex-shrink: 0;
  margin-left: -1px;
  color: color-mix(in srgb, var(--color-brand-primary) 30%, transparent);
}

.business-page .business-page__process-step-node {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid color-mix(in srgb, var(--color-brand-primary) 20%, transparent);
  border-radius: 50%;
  background-color: var(--color-surface-white);
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--color-brand-primary) 3%, transparent);
  transform: translateX(-50%);
}

.business-page .business-page__process-step-dot {
  width: 8px;
  height: 8px;
  border: 1px solid color-mix(in srgb, var(--color-brand-primary) 30%, transparent);
  border-radius: 50%;
  background-color: var(--color-surface-white);
}

.business-page .business-page__process-step .business-page__process-num {
  margin-top: 20px;
}

.business-page .business-page__process-step .business-page__process-label {
  margin-top: var(--space-1);
  font-size: 14px;
  font-weight: 700;
  line-height: 21px;
  text-align: center;
  color: var(--color-ink-900);
}

.business-page .business-page__process-step .business-page__process-sublabel {
  margin-top: 2px;
  max-width: 81px; /* 81px · Figma .text7 */
  font-size: 9px;
  font-weight: 700;
  line-height: 21px;
  text-align: center;
  color: color-mix(in srgb, var(--color-ink-500) 60%, transparent);
}

/* ----- 価値創造事業ヒーロー（Figma .businesspage · .container9 + .container2） ----- */
.business-page .business-value-creation__shell {
  width: 100%;
  box-sizing: border-box;
}

.business-page .business-value-creation__inner {
  display: flex;
  flex-direction: column;
}

.business-page .business-value-creation__media {
  position: relative;
  width: 100%;
  height: 320px;
  overflow: hidden;
}

.business-page .business-value-creation__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.95) saturate(1.08) contrast(1.02);
}

.business-page .business-value-creation__copy {
  padding: var(--space-10) 0 var(--space-12);
}

/* Figma .container-parent — gap 16px · #18769f */
.business-page .business-value-creation__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4); /* 16px */
  min-width: 0;
}

/* Figma .container — 17px · padding 0 3px */
.business-page .business-value-creation__eyebrow-wrap {
  display: flex;
  align-self: stretch;
  align-items: center;
  box-sizing: border-box;
  height: 17px; /* 17px */
  padding: 0 3px;
}

/* Figma .value-creation — 11px · 800 · letter-spacing 2px */
.business-page .business-value-creation__eyebrow {
  margin: 0;
  line-height: 17px;
}

/* Figma .heading-2 .b — 32px · line-height 48px */
.business-page .business-value-creation__title {
  position: relative;
  margin: 0;
  padding: 0;
  font-family: var(--font-jp);
  font-size: var(--fs-h2-md);
  font-weight: 700;
  line-height: var(--section-title-jp-min-height);
  min-height: var(--section-title-jp-min-height);
  letter-spacing: 0;
  color: var(--color-ink-900);
}

.business-page .business-value-creation__title::after {
  display: none;
}

@media (min-width: 1024px) {
  .business-page .business-value-creation__title {
    font-size: var(--section-title-jp-size);
    line-height: var(--section-title-jp-line-height);
    min-height: var(--section-title-jp-line-height);
  }
}

@media (min-width: 1024px) {
  .business-page .business-value-creation__inner {
    display: grid;
    grid-template-columns: minmax(0, 621px) minmax(0, 1fr);
    column-gap: 64px;
    align-items: center;
    min-height: 492px;
  }

  .business-page .business-value-creation__media {
    height: 492px;
    max-width: 621px;
  }

  /* Figma .dsc-7632-2-icon — トリミング位置 */
  .business-page .business-value-creation__photo {
    top: -40px;
    right: auto;
    bottom: auto;
    left: -134px;
    width: 890px;
    height: 593px;
    max-width: none;
    object-fit: cover;
  }

  .business-page .business-value-creation__copy {
    max-width: 512px;
    padding: 0;
  }
}

.business-page .business-page__value-creation-desc {
  margin: var(--space-6) 0 var(--space-8);
  max-width: 32rem; /* 512px */
  font-family: var(--font-jp);
  font-size: 15px;
  font-weight: 400;
  line-height: 2.4; /* 36px */
  color: var(--color-ink-500);
}

.business-page .business-page__value-creation-stats {
  max-width: 32rem;
}

.business-page .business-page__value-creation-stats-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  min-height: 37px; /* 37px */
  margin-bottom: var(--space-2);
}

.business-page .business-page__value-creation-stat-num {
  font-family: var(--font-en);
  font-size: 36px; /* 36px */
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.01em;
  color: var(--color-brand-secondary);
}

.business-page .business-page__value-creation-stat-label {
  font-family: var(--font-en-body);
  font-size: var(--fs-caption);
  font-weight: 700;
  line-height: 1.5;
  color: color-mix(in srgb, var(--color-brand-secondary) 60%, transparent);
}

.business-page .business-page__value-creation-brands {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 12px;
  line-height: 1.5;
  color: color-mix(in srgb, var(--color-ink-500) 50%, transparent);
}

/* ----- BRAND STORY（Figma .businesspage · .brand-story / .heading-3） ----- */
.business-page .business-brand-story__inner {
  display: flex;
  flex-direction: column;
  gap: var(--stack-gap-label-heading);
  box-sizing: border-box;
  width: 100%;
  padding-top: var(--space-24);
  padding-bottom: var(--space-24);
}

@media (min-width: 1024px) {
  .business-page .business-brand-story__inner {
    padding-top: var(--space-32); /* 128px */
    padding-bottom: var(--space-32);
  }
}

.business-page .business-brand-story__intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
  width: 100%;
}

/* Figma .container-parent — gap 16px · #18769f */
.business-page .business-brand-story__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4); /* 16px */
  width: 100%;
  max-width: 32rem; /* 512px */
  min-width: 0;
}

/* Figma .container — 15px · padding 0 3px */
.business-page .business-brand-story__eyebrow-wrap {
  display: flex;
  align-self: stretch;
  align-items: center;
  box-sizing: border-box;
  height: 15px; /* 15px */
  padding: 0 3px;
}

/* Figma .brand-story — DM Sans 900 · 13px · letter-spacing 2px · #18769f */
.business-page .business-brand-story__eyebrow {
  margin: 0;
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 900;
  line-height: 17px;
  letter-spacing: 0.15625rem; /* 2.5px */
  text-transform: uppercase;
  color: var(--color-brand-secondary);
}

/* Figma .heading-3 .b — 32px / line-height 48px · width 512px */
.business-page .business-brand-story__title {
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 32rem;
  font-family: var(--font-jp);
  font-size: var(--fs-h2-md);
  font-weight: 700;
  line-height: var(--section-title-jp-min-height);
  min-height: var(--section-title-jp-min-height);
  letter-spacing: 0;
  color: var(--color-ink-900);
}

.business-page .business-brand-story__title::after {
  display: none;
}

@media (min-width: 1024px) {
  .business-page .business-brand-story__title {
    font-size: var(--section-title-jp-size);
    line-height: var(--section-title-jp-line-height);
    min-height: var(--section-title-jp-line-height);
  }
}

/* Figma .paragraph — 14px / 30px · max 768px */
.business-page .business-brand-story__lead {
  margin: 0;
  max-width: 48rem; /* 768px */
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 400;
  line-height: 2.142857; /* 30px */
  color: var(--color-ink-500);
}

.business-page .business-brand-story__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-16);
  width: 100%;
}

/* 768px未満・768–1023px は1カラム（2列＋80px gap だとカード約296pxで窮屈） */
@media (min-width: 768px) and (max-width: 1023px) {
  .business-page .business-brand-story__grid {
    gap: var(--space-12);
  }
}

@media (min-width: 1024px) {
  .business-page .business-brand-story__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--space-20); /* 80px · 1240 − 580×2 */
    row-gap: var(--space-16);
  }
}

/* Figma .container — 580×410.3 */
.business-page .business-brand-story__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  max-width: 580px; /* 580px */
  box-sizing: border-box;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .business-page .business-brand-story__card {
    max-width: none;
  }
}

/* Figma .container2 — 580×229.9 · メイン 344.8 + 8px + サブ 227.2 */
.business-page .business-brand-story__photos {
  position: relative;
  width: 100%;
  height: auto;
  margin: 0 0 var(--space-6);
}

.business-page .business-brand-story__photo {
  overflow: hidden;
  border-radius: 2px;
  min-width: 0;
}

.business-page .business-brand-story__photo-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Figma .asset-8144x-1-icon 等 — カード右下・写真列と見出しの間（1024px+） */
.business-page .business-brand-story__brand-mark {
  position: absolute;
  top: 243px;
  right: 0;
  z-index: 2;
  flex-shrink: 0;
  width: 59px;
  height: 62px;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
}

/* Figma .fujiyama-logo-1-icon — 88×42 · top 264 */
.business-page .business-brand-story__brand-mark--fujiyama {
  top: 264px;
  width: 88px;
  height: 42px;
}

/* Figma .doubt — 13px · 900 · letter-spacing 2px */
.business-page .business-brand-story__brand-tag {
  margin: 0;
  min-height: 20px; /* 20px */
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 900;
  line-height: 20px;
  letter-spacing: 0.12em; /* 1.56px @ 13px */
  color: var(--color-brand-primary);
}

/* Figma .heading-4 .b — 18px · line-height 36px · top −3px */
.business-page .business-brand-story__brand-title {
  margin: var(--space-2) 0 0;
  font-family: var(--font-jp);
  font-size: 18px;
  font-weight: 700;
  line-height: 36px;
  color: var(--color-ink-900);
  transform: translateY(-3px);
}

/* Figma .paragraph2 .div — 14px · line-height 30px · 580px */
.business-page .business-brand-story__brand-desc {
  margin: var(--space-3) 0 0;
  width: 100%;
  max-width: 580px;
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 400;
  line-height: 30px;
  color: var(--color-ink-500);
}

@media (min-width: 1024px) {
  .business-page .business-brand-story__card {
    min-height: 410px; /* 410px */
  }

  .business-page .business-brand-story__photos {
    height: 230px; /* 230px */
    margin-bottom: 24px; /* 24px · 253.86 − 229.9 */
  }

  .business-page .business-brand-story__photo--main {
    position: absolute;
    top: 0;
    left: 0;
    width: 59%; /* 344.8 / 580 */
    height: 100%;
  }

  .business-page .business-brand-story__photo--sub {
    position: absolute;
    top: 0;
    left: calc(59% + var(--space-2)); /* 353px */
    width: 39%; /* 227.2 / 580 */
    height: 152px; /* 152px */
  }

  /* Figma .icon — 258×193 · offset −13 / −13.8 */
  .business-page .business-brand-story__photo--sub .business-brand-story__photo-img--sub {
    width: 114%;
    max-width: none;
    height: 127%;
    margin-top: -13px;
    margin-left: -14px;
    object-fit: cover;
  }

  .business-page .business-brand-story__brand-title {
    margin-top: var(--space-2); /* 8px · 281.36 − 273.36 */
  }

  .business-page .business-brand-story__brand-desc {
    margin-top: var(--space-3); /* 12px · 322.16 − 310.16 */
  }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .business-page .business-brand-story__brand-mark {
    top: 228px;
    width: 50px;
    height: 52px;
  }

  .business-page .business-brand-story__brand-mark--fujiyama {
    top: 248px;
    width: 72px;
    height: 34px;
  }
}

@media (max-width: 1023px) {
  .business-page .business-brand-story__photos {
    display: grid;
    grid-template-columns: minmax(0, 1.52fr) minmax(0, 1fr);
    gap: var(--space-2);
    margin-bottom: var(--space-5);
  }

  .business-page .business-brand-story__photo--main {
    aspect-ratio: 344.8 / 229.9;
  }

  .business-page .business-brand-story__photo--sub {
    aspect-ratio: 227.2 / 151.5;
    align-self: start;
  }

  /* ロゴを本文と重ねない — タグライン右端に配置 */
  .business-page .business-brand-story__card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto auto;
    column-gap: var(--space-3);
    row-gap: 0;
    align-items: start;
  }

  .business-page .business-brand-story__photos {
    grid-column: 1 / -1;
  }

  .business-page .business-brand-story__brand-tag {
    grid-column: 1;
    grid-row: 2;
    align-self: center;
    min-width: 0;
  }

  .business-page .business-brand-story__brand-mark {
    position: static;
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    justify-self: end;
    top: auto;
    right: auto;
    width: clamp(2.375rem, 11vw, 3rem);
    height: auto;
    max-height: 2.75rem;
  }

  .business-page .business-brand-story__brand-mark--fujiyama {
    top: auto;
    width: clamp(3rem, 14vw, 4.25rem);
    max-height: 2rem;
    height: auto;
  }

  .business-page .business-brand-story__brand-title {
    grid-column: 1 / -1;
    grid-row: 3;
  }

  .business-page .business-brand-story__brand-desc {
    grid-column: 1 / -1;
    grid-row: 4;
    max-width: none;
  }
}

@media (max-width: 767px) {
  .business-page .business-brand-story__card {
    column-gap: var(--space-2);
  }

  .business-page .business-brand-story__brand-mark {
    width: clamp(2rem, 9.5vw, 2.375rem);
    max-height: 2.375rem;
  }

  .business-page .business-brand-story__brand-mark--fujiyama {
    width: clamp(2.625rem, 12vw, 3.25rem);
    max-height: 1.625rem;
  }

  .business-page .business-brand-story__brand-title {
    font-size: var(--fs-h4-m);
    line-height: 1.6;
    transform: none;
  }
}

@media (max-width: 479px) {
  .business-page .business-brand-story__brand-mark {
    width: 2rem;
    max-height: 2.125rem;
  }

  .business-page .business-brand-story__brand-mark--fujiyama {
    width: 2.625rem;
    max-height: 1.375rem;
  }
}

/* ----- 工程ステップ（〜1023px 縦リスト · Figma 1400 には無し） ----- */
@media (max-width: 1023px) {
  .business-page .business-page__process-list {
    list-style: none;
    margin: 0;
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: 0;
    border-radius: var(--space-2);
    background-color: var(--color-surface-white);
    border: 1px solid color-mix(in srgb, var(--color-ink-900) 8%, transparent);
  }
}

@media (min-width: 1024px) {
  .business-page .business-page__process-list {
    display: none !important;
  }
}

@media (max-width: 1023px) {
.business-page .business-page__process-list-item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  column-gap: var(--space-4);
  align-items: start;
  padding: var(--space-4) 0;
  border-bottom: 1px solid color-mix(in srgb, var(--color-ink-900) 6%, transparent);
}

.business-page .business-page__process-list-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.business-page .business-page__process-list-item:first-child {
  padding-top: 0;
}

.business-page .business-page__process-list-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding-top: 2px;
}

.business-page .business-page__process-list-icon {
  color: var(--color-brand-primary);
  flex-shrink: 0;
}

.business-page .business-page__process-list-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--color-brand-primary) 30%, transparent);
  background-color: var(--color-surface-white);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-brand-primary) 4%, transparent);
}

.business-page .business-page__process-list-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-1);
  min-width: 0;
  text-align: left;
}

.business-page .business-page__process-list-body .business-page__process-label {
  margin-top: 0;
}

.business-page .business-page__process-list-body .business-page__process-sublabel {
  margin-top: 0;
  max-width: none;
  text-align: left;
}
}

/* ----- 工程ステップ番号（Figma .div2） ----- */
.business-page .business-page__process-num {
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.5; /* 20px */
  letter-spacing: 0.05em; /* 0.65px @ 13px */
  color: color-mix(in srgb, var(--color-brand-primary) 60%, transparent);
}

.business-page .business-page__process-label {
  font-family: var(--font-jp);
  font-size: var(--fs-caption);
  font-weight: 600;
  line-height: 1.5;
  color: var(--color-ink-900);
}

.business-page .business-page__process-sublabel {
  font-family: var(--font-jp);
  font-size: 9px; /* 9px Figma .text7 */
  line-height: 1.5;
  color: color-mix(in srgb, var(--color-ink-500) 60%, transparent);
}

/* ----- Foundation strip（Figma .container / .container2 / .container5） ----- */
.business-page .business-foundation {
  --foundation-strip-accent-duration: 0.18s;
  --foundation-strip-accent-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --foundation-strip-color-duration: 0.12s;
}

.business-page .business-page__foundation-strips {
  width: 100%;
  max-width: 1241px;
  margin: 0;
  border-top: 1px solid color-mix(in srgb, var(--color-ink-900) 8%, transparent);
}

/* Figma .container2 — 135px · 下ボーダー */
.business-page .business-page__foundation-strip {
  position: relative;
  box-sizing: border-box;
  min-height: 135px;
  overflow: hidden;
  border-bottom: 1px solid color-mix(in srgb, var(--color-ink-900) 8%, transparent);
}

/* Figma .container5 — 左 3px · 通常時は 40% ink */
.business-page .business-page__foundation-strip::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 3px;
  height: 134px;
  background-color: color-mix(in srgb, var(--color-ink-900) 40%, transparent);
  clip-path: inset(0 0 0 0);
  pointer-events: none;
}

/* ホバー / 展開 — 行背景が上から降りる */
.business-page .business-page__foundation-strip::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  clip-path: inset(0 0 100% 0);
  transition: clip-path var(--foundation-strip-accent-duration) var(--foundation-strip-accent-ease);
  pointer-events: none;
}

.business-page .business-page__foundation-strip--hover[data-accent="primary"]:hover::after,
.business-page .business-page__foundation-strip.is-open[data-accent="primary"]::after {
  clip-path: inset(0 0 0 0);
  background: color-mix(in srgb, var(--color-brand-primary) 7%, transparent);
}

.business-page .business-page__foundation-strip--hover[data-accent="secondary"]:hover::after,
.business-page .business-page__foundation-strip.is-open[data-accent="secondary"]::after {
  clip-path: inset(0 0 0 0);
  background: color-mix(in srgb, var(--color-brand-secondary) 7%, transparent);
}

.business-page .business-page__foundation-strip--hover[data-accent="orange"]:hover::after,
.business-page .business-page__foundation-strip.is-open[data-accent="orange"]::after {
  clip-path: inset(0 0 0 0);
  background: color-mix(in srgb, var(--color-brand-accent-orange) 9%, transparent);
}

.business-page .business-page__foundation-strip--hover::before {
  transition:
    height var(--foundation-strip-accent-duration) var(--foundation-strip-accent-ease),
    background-color var(--foundation-strip-color-duration) ease;
}

.business-page .business-page__foundation-strip--hover:not(:hover):not(.is-open)::before {
  height: 134px;
  background-color: color-mix(in srgb, var(--color-ink-900) 40%, transparent);
  transition: none;
}

.business-page .business-page__foundation-strip--hover[data-accent="primary"]:hover::before,
.business-page .business-page__foundation-strip.is-open[data-accent="primary"]::before {
  height: 100%;
  background-color: var(--color-brand-primary);
}

.business-page .business-page__foundation-strip--hover[data-accent="secondary"]:hover::before,
.business-page .business-page__foundation-strip.is-open[data-accent="secondary"]::before {
  height: 100%;
  background-color: var(--color-brand-secondary);
}

.business-page .business-page__foundation-strip--hover[data-accent="orange"]:hover::before,
.business-page .business-page__foundation-strip.is-open[data-accent="orange"]::before {
  height: 100%;
  background-color: var(--color-brand-accent-orange);
}

.business-page .business-page__foundation-strip-inner {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  padding: 40px var(--space-6) 0 calc(3px + var(--space-8)); /* 40 24 0 32+border */
  background-color: transparent;
}

/* ----- WIPING CLOTH（Figma .container · 1240×360 · 横80pxは .layout-inset） ----- */
.business-page .business-page__wiping {
  background-color: var(--color-surface-white);
}

.business-page .business-page__wiping-shell {
  width: 100%;
  box-sizing: border-box;
  padding-block: var(--space-12);
}

@media (min-width: 768px) {
  .business-page .business-page__wiping-shell {
    padding-block: var(--space-16);
  }
}

/* Figma .container — 360px · shadow · border */
.business-page .business-page__wiping-panel {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-height: 260px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-ink-900) 8%, transparent);
  background-color: var(--color-surface-white);
  box-shadow:
    0 2px 8px color-mix(in srgb, var(--color-ink-900) 4%, transparent),
    0 12px 40px color-mix(in srgb, var(--color-brand-primary) 6%, transparent);
}

.business-page .business-page__wiping-visual {
  position: relative;
  min-height: 260px;
  overflow: hidden;
  background-color: var(--color-surface-paper);
}

.business-page .business-page__wiping-photo {
  width: 100%;
  height: 100%;
  min-height: 260px;
  object-fit: cover;
  object-position: 45% 35%;
}

.business-page .business-page__wiping-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.3));
  pointer-events: none;
}

.business-page .business-page__wiping-copy {
  padding: var(--space-10) var(--space-6);
  background-color: var(--color-surface-white);
}

/* Figma .frame-parent — 512×215 · コピー縦スタック */
.business-page .business-page__wiping-frame {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  max-width: 32rem; /* 512px */
  box-sizing: border-box;
}

/* Figma .container-parent — gap 12px */
.business-page .business-page__wiping-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3); /* 12px */
  min-width: 0;
}

/* Figma .container — 17px · padding 0 3px */
.business-page .business-page__wiping-eyebrow-wrap {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 17px; /* 17px */
  padding: 0 3px;
}

/* Figma .wiping-cloth — 11px · 800 · letter-spacing 2px · #283594 */
.business-page .business-page__wiping-eyebrow {
  margin: 0;
  font-family: var(--font-en);
  font-size: 11px;
  font-weight: 800;
  line-height: 17px;
  letter-spacing: 0.103125rem; /* 1.65px */
  text-transform: uppercase;
  color: var(--color-brand-primary);
}

/* Figma .heading-3 .b — 24px · line-height 36px · #0d0d1a */
.business-page .business-page__wiping-title {
  margin: 0;
  font-family: var(--font-jp);
  font-size: var(--fs-h3);
  font-weight: 700;
  line-height: 1.5; /* 36px */
  color: var(--color-ink-900);
}

/* Figma .paragraph — 14px · line-height 30px · #4a4a68 · 512×58.8 */
.business-page .business-page__wiping-desc {
  margin: var(--space-5) 0 0;
  width: 100%;
  max-width: 32rem;
}

.business-page .business-page__wiping-desc p {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 400;
  line-height: 30px;
  color: var(--color-ink-500);
}

@media (max-width: 768px) {
  .business-page .business-page__wiping-title {
    font-size: var(--fs-h3-m);
  }

  .business-page .business-page__wiping-desc p {
    font-size: var(--fs-body-m);
  }
}

.business-page .business-page__wiping-desc p + p {
  margin-top: 0;
}

/* Figma .link — 152×37 · padding 8px 20px · #283594 */
.business-page .business-page__wiping-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: var(--space-5); /* 20px · モバイル */
  width: 152px; /* 152px */
  min-width: 152px;
  height: 37px; /* 37px */
  padding: 8px 20px;
  box-sizing: border-box;
  background-color: var(--color-brand-primary);
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 700;
  line-height: 21px;
  color: var(--color-surface-white);
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.business-page .business-page__wiping-cta:hover {
  background-color: var(--color-ink-900);
}

.business-page .business-page__wiping-cta:focus-visible {
  outline: var(--focus-ring);
  outline-offset: 3px;
}

@media (min-width: 1024px) {
  .business-page .business-page__wiping-panel {
    height: 360px; /* 360px */
    min-height: 360px;
    display: grid;
    /* 24 + 540 + 60 + 512 + 余白 = 1240（Figma 絶対配置の再現） */
    grid-template-columns: 24px minmax(0, 540px) 60px minmax(0, 32rem) minmax(0, 1fr);
    grid-template-rows: 24px 313px 23px; /* 313px + 24 + 23 */
  }

  /* Figma .container4 — left 24px · 540×313 */
  .business-page .business-page__wiping-visual {
    grid-column: 2;
    grid-row: 2;
    min-height: 0;
    height: 313px;
  }

  .business-page .business-page__wiping-photo {
    min-height: 100%;
    height: 100%;
  }

  /* Figma .container2 — left 624px · top 73px · 512×215 */
  .business-page .business-page__wiping-copy {
    grid-column: 4;
    grid-row: 2;
    align-self: start;
    margin-top: 49px; /* 73 − 24 */
    padding: 0;
    width: 100%;
    max-width: 32rem;
    background-color: var(--color-surface-white);
  }

  /* Figma .frame-parent — height 215px */
  .business-page .business-page__wiping-frame {
    min-height: 215px;
  }

  /* 98.75 − (16.5 + 12 + 36) = 34px */
  .business-page .business-page__wiping-desc {
    margin-top: 34px;
    min-height: 59px; /* 59px */
  }

  /* 177.53 − 98.75 − 58.8 ≈ 20px */
  .business-page .business-page__wiping-cta {
    margin-top: var(--space-5);
  }
}

/* ----- VISION NARRATIVE（Figma .businesspage · 1240 内 写真+コピー） ----- */
.business-page .business-page__vision-narrative {
  background-color: var(--color-surface-white);
}

.business-page .business-page__vision-narrative-inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-10);
  box-sizing: border-box;
  width: 100%;
  max-width: var(--layout-frame);
  margin-inline: auto;
  padding-block: var(--space-24);
}

/* Figma .container — 560.4×760.8 */
.business-page .business-page__vision-narrative-media {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.business-page .business-page__vision-narrative-visual {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 560.4 / 761;
}

.business-page .business-page__vision-narrative-photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 55% 20%;
}

/* タブレット(768〜1023): 縦長(560/761)のままだとフル幅で 900px 超になり
   写真が大きすぎるため、横長比率にして高さを約半分に抑える */
@media (min-width: 768px) and (max-width: 1023px) {
  .business-page .business-page__vision-narrative-visual {
    aspect-ratio: 3 / 2;
  }
}

.business-page .business-page__vision-narrative-panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  width: 100%;
}

.business-page .business-page__vision-narrative-panel-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-8);
  width: 100%;
}

/* Figma .businesspage-parent — gap 16px */
.business-page .business-page__vision-narrative-head {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4); /* 16px */
  width: 100%;
  box-sizing: border-box;
}

/* Figma .businesspage — 15px · padding 0 3px */
.business-page .business-page__vision-narrative-eyebrow-row {
  display: flex;
  align-self: stretch;
  align-items: center;
  box-sizing: border-box;
  height: 15px; /* 15px */
  padding: 0 3px;
}

/* Figma .vision-narrative — 13px · 900 · 2px · #e28818 */
.business-page .business-page__vision-narrative-eyebrow {
  margin: 0;
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 900;
  line-height: 17px;
  letter-spacing: 0.15625rem; /* 2.5px */
  text-transform: uppercase;
  color: var(--color-brand-accent-orange);
}

/* Figma .businesspage2 — 32px · 93px */
.business-page .business-page__vision-narrative-title {
  position: relative;
  align-self: stretch;
  margin: 0;
  padding: 0;
  font-family: var(--font-jp);
  font-size: var(--fs-h2-md);
  font-weight: 700;
  color: var(--color-ink-900);
}

.business-page .business-page__vision-narrative-title-line {
  display: block;
  line-height: 1.5;
}

.business-page .business-page__vision-faq {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  width: 100%;
}

.business-page .business-page__vision-faq-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-3); /* 12px */
  width: 100%;
}

.business-page .business-page__vision-faq-q {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 700;
  line-height: 30px;
  color: var(--color-brand-primary);
}

.business-page .business-page__vision-faq-a {
  margin: 0;
  padding-left: var(--space-6); /* 24px */
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 400;
  line-height: 30px;
  color: var(--color-ink-500);
}

@media (min-width: 1024px) {
  /* Figma .businesspage — padding 128×80 · space-between */
  .business-page .business-page__vision-narrative-inner.layout-inset {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0;
    max-width: var(--layout-frame);
    padding: var(--space-32) var(--layout-inline-lg);
  }

  .business-page .business-page__vision-narrative-media {
    flex-shrink: 0;
    width: 35rem; /* 560px */
    height: 761px; /* 761px */
  }

  .business-page .business-page__vision-narrative-visual {
    width: 100%;
    height: 761px; /* 761px */
    max-width: none;
    aspect-ratio: auto;
  }

  /* Figma .dsc-7737-1-icon */
  .business-page .business-page__vision-narrative-photo {
    position: absolute;
    width: 205%;
    max-width: none;
    height: 767px; /* 767px */
    top: -6px; /* -6px */
    right: -74%;
    left: -31%;
    object-fit: cover;
    object-position: center;
  }

  /* Figma .container3 — 761×761 · padding-left 64px */
  .business-page .business-page__vision-narrative-panel {
    flex-shrink: 0;
    align-items: center;
    box-sizing: border-box;
    width: 761px;
    height: 761px;
    padding: 0 0 0 var(--space-16);
  }

  /* Figma .container4 — 577×682 */
  .business-page .business-page__vision-narrative-panel-inner {
    position: relative;
    flex-shrink: 0;
    width: 577px; /* 577px */
    height: 682px; /* 682px */
    gap: 0;
  }

  /* Figma .businesspage-parent — 576px 幅（.container4 内） */
  .business-page .business-page__vision-narrative-head {
    max-width: 36rem;
  }

  /* Figma .businesspage2 · .b / .b2 */
  .business-page .business-page__vision-narrative-title {
    height: 93px; /* 93px */
    font-size: var(--section-title-jp-size);
  }

  .business-page .business-page__vision-narrative-title-line {
    position: absolute;
    left: 0;
    line-height: 3rem; /* 48px */
  }

  .business-page .business-page__vision-narrative-title-line:first-child {
    top: 0;
  }

  .business-page .business-page__vision-narrative-title-line:last-child {
    top: 45px; /* 45px */
  }

  /* Figma .businesspage4 — top 161px · 576×520 · gap 32px */
  .business-page .business-page__vision-faq {
    position: absolute;
    top: 161px; /* 161px */
    left: 0;
    width: 36rem;
    height: 520px;
    gap: var(--space-8);
  }
}

/* ----- 未来事業ヒーロー（Figma .businesspage4） ----- */
.business-page .business-page__future-hero {
  position: relative;
  overflow: hidden;
  background-color: var(--color-ink-900);
  color: var(--color-surface-white);
  min-height: clamp(28rem, 50vw, 683px); /* 683px @ 1440 */
}

/* Figma .vector-icon — 1402×683 · opacity は SVG 内 0.15 */
.business-page .business-page__future-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  pointer-events: none;
}

.business-page .business-page__future-hero-vector {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  overflow: hidden;
  object-fit: cover;
  object-position: center;
}

@media (min-width: 1024px) {
  .business-page .business-page__future-hero-bg {
    height: 683px; /* 683px */
  }

  .business-page .business-page__future-hero-vector {
    height: 683px;
  }
}

@media (max-width: 1023px) {
  .business-page .business-page__future-hero-bg {
    inset: 0;
    height: auto;
  }

  .business-page .business-page__future-hero-vector {
    position: absolute;
    inset: 0;
    height: 100%;
  }
}

.business-page .business-page__future-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 69rem; /* 1104px Figma .container198 */
  margin: 0 auto;
  padding: clamp(var(--space-16), 11vw, 10rem) var(--space-6) clamp(var(--space-16), 8vw, var(--space-20));
}

@media (min-width: 1024px) {
  .business-page .business-page__future-hero-inner {
    padding-left: var(--space-20);
    padding-right: var(--space-20);
  }
}

.business-page .business-page__future-hero-content {
  max-width: 69rem;
}

/* Figma .container-parent — gap 16px · #e28818 */
.business-page .business-page__future-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4); /* 16px */
  margin-bottom: var(--space-10);
  min-width: 0;
}

/* Figma .container — 17px · padding 0 3px */
.business-page .business-page__future-eyebrow-wrap {
  display: flex;
  align-self: stretch;
  align-items: center;
  box-sizing: border-box;
  height: 17px; /* 17px */
  padding: 0 3px;
}

/* Figma .future-innovation — 800 · letter-spacing 2px · lh 16.5 */
.business-page .business-page__future-eyebrow {
  margin: 0;
  font-family: var(--font-en);
  font-size: 11px;
  font-weight: 800;
  line-height: 17px;
  letter-spacing: 0.1375rem; /* 2.2px */
  text-transform: uppercase;
  color: var(--color-brand-accent-orange);
}

/* Figma .paragraph .b — 32px · line-height 48px · #fff */
.business-page .business-page__future-title {
  margin: 0;
  font-family: var(--font-jp);
  font-size: var(--fs-h2-md);
  font-weight: 700;
  line-height: var(--section-title-jp-line-height);
  min-height: var(--section-title-jp-min-height);
  color: var(--color-ink-inv-900);
}

.business-page .business-page__future-title::after {
  display: none;
}

@media (min-width: 1024px) {
  .business-page .business-page__future-title {
    font-size: var(--section-title-jp-size);
    line-height: var(--section-title-jp-line-height);
    min-height: var(--section-title-jp-line-height);
  }
}

.business-page .business-page__future-headline {
  margin: 0 0 var(--space-10);
  font-family: var(--font-jp);
  font-size: var(--fs-h2-hero-jp);
  font-weight: 700;
  line-height: 1.5; /* 78px @ 52px */
  letter-spacing: 0.04em; /* 2.08px @ 52px */
  color: var(--color-ink-inv-900);
}

.business-page .business-page__future-headline-line {
  display: block;
}

.business-page .business-page__future-lead {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 42rem; /* 672px · Figma .paragraph29 */
  margin: 0;
}

.business-page .business-page__future-lead p {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 15px;
  font-weight: 400;
  line-height: 2.4; /* 36px */
  color: var(--color-ink-inv-500); /* rgba(255,255,255,0.6) */
}

/* ----- 3つの種（Figma .businesspage10 · #fafdff · 80px .layout-inset） ----- */
.business-page .business-page__seed-section {
  background-color: color-mix(in srgb, var(--color-surface-paper) 50%, #fafdff);
}

.business-page .business-page__seed-inner {
  box-sizing: border-box;
  width: 100%;
  max-width: 75rem; /* 1200px · Figma .container2 */
  margin-inline: auto;
  padding-block: var(--space-24);
}

.business-page .business-page__seed-title {
  margin: 0 0 var(--space-20);
  text-align: center;
  font-family: var(--font-jp);
  font-size: var(--fs-h2-lg);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-ink-900);
}

.business-page .business-page__seed-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-8);
  margin-bottom: var(--space-20);
}

@media (min-width: 768px) {
  .business-page .business-page__seed-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem; /* ≈32px · Figma 410.66−378.7 */
  }
}

/* Figma .container — 369px · flex · gap 16 · pad 44/40 */
.business-page .business-page__seed-card {
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--business-seed-card-gap);
  width: 100%;
  min-height: var(--business-seed-card-h);
  padding: var(--business-seed-card-pad-block) var(--business-seed-card-pad-inline);
  background-color: var(--color-surface-white);
  border: 1px solid color-mix(in srgb, var(--color-line-border) 60%, transparent);
  text-align: left;
  font-family: var(--font-jp);
  font-size: var(--business-seed-num-size);
}

/* Figma .container2 */
.business-page .business-page__seed-card-num-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  flex-shrink: 0;
  width: var(--business-seed-inner-w);
  max-width: 100%;
  height: var(--business-seed-num-row-h);
  margin: 0;
  font-family: var(--font-en);
  font-size: inherit;
  text-align: left;
}

/* Figma .div — 40% brand（01 / 02 / 03） */
.business-page .business-page__seed-card[data-accent="primary"] .business-page__seed-card-num-row {
  color: color-mix(in srgb, var(--color-brand-primary) 40%, transparent);
}

.business-page .business-page__seed-card[data-accent="secondary"] .business-page__seed-card-num-row {
  color: color-mix(in srgb, var(--color-brand-secondary) 40%, transparent);
}

.business-page .business-page__seed-card[data-accent="orange"] .business-page__seed-card-num-row {
  color: color-mix(in srgb, var(--color-brand-accent-orange) 40%, transparent);
}

/* Figma .text */
.business-page .business-page__seed-card-num-text {
  position: relative;
  flex-shrink: 0;
  height: var(--business-seed-num-row-h);
  width: var(--business-seed-num-w-01);
}

.business-page .business-page__seed-card[data-accent="secondary"] .business-page__seed-card-num-text {
  width: var(--business-seed-num-w-02);
}

.business-page .business-page__seed-card[data-accent="orange"] .business-page__seed-card-num-text {
  width: var(--business-seed-num-w-03);
}

/* Figma .div */
.business-page .business-page__seed-card-num {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: 900;
  line-height: var(--business-seed-num-row-h);
  letter-spacing: var(--business-seed-num-ls);
  color: inherit;
}

/* Figma .container3 */
.business-page .business-page__seed-card-en-wrap {
  position: relative;
  flex-shrink: 0;
  width: var(--business-seed-inner-w);
  max-width: 100%;
  height: var(--business-seed-en-h);
  min-height: var(--business-seed-en-h);
  margin: 0;
  font-size: 10px;
  color: color-mix(in srgb, var(--color-ink-900) 25%, transparent);
  font-family: var(--font-num);
}

/* Figma .technology */
.business-page .business-page__seed-card-en {
  position: absolute;
  top: var(--business-seed-en-label-top);
  left: 0;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: 700;
  line-height: 15px;
  letter-spacing: 0.125rem; /* 2px */
  text-transform: uppercase;
  color: inherit;
}

/* Figma .heading-4 */
.business-page .business-page__seed-card-title {
  display: flex;
  align-items: flex-start;
  flex-shrink: 0;
  width: var(--business-seed-inner-w);
  max-width: 100%;
  min-height: var(--business-seed-title-h);
  margin: 0;
  font-family: var(--font-jp);
  font-size: 20px; /* 20px · 01/02 */
  font-weight: 700;
  line-height: var(--business-seed-title-h);
  color: var(--color-ink-900);
}

.business-page .business-page__seed-card[data-accent="orange"] .business-page__seed-card-title {
  font-size: 22px; /* 22px */
  line-height: var(--business-seed-title-lh);
}

/* Figma .paragraph */
.business-page .business-page__seed-card-desc-wrap {
  position: relative;
  flex-shrink: 0;
  width: var(--business-seed-inner-w);
  max-width: 100%;
  min-height: var(--business-seed-desc-h);
  margin: 0;
  text-align: left;
  font-family: var(--font-jp);
  font-size: 13px;
  color: var(--color-ink-500);
}

/* Figma .ai */
.business-page .business-page__seed-card-desc {
  position: absolute;
  top: var(--business-seed-desc-text-top);
  left: 0;
  margin: 0;
  display: inline-block;
  width: var(--business-seed-desc-w);
  max-width: 100%;
  font-family: inherit;
  font-size: inherit;
  font-weight: 400;
  line-height: 26px;
  color: inherit;
}

@media (min-width: 1024px) {
  .business-page .business-page__seed-card {
    height: var(--business-seed-card-h);
    min-height: var(--business-seed-card-h);
  }
}

/* タブレット(768〜1023): 固定369px + absolute desc だと狭い3カラムで本文が
   カード枠を越えて下の文と重なる。flow 化し、内側パディングも詰めて可読性を確保 */
@media (min-width: 768px) and (max-width: 1023px) {
  .business-page .business-page__seed-card {
    height: auto;
    min-height: 0;
    padding: var(--space-8) var(--space-6);
  }

  .business-page .business-page__seed-card-num-row,
  .business-page .business-page__seed-card-en-wrap,
  .business-page .business-page__seed-card-title,
  .business-page .business-page__seed-card-desc-wrap {
    width: 100%;
  }

  .business-page .business-page__seed-card-en-wrap {
    height: auto;
    min-height: 0;
  }

  .business-page .business-page__seed-card-en {
    position: static;
    top: auto;
  }

  .business-page .business-page__seed-card-desc-wrap {
    min-height: 0;
  }

  .business-page .business-page__seed-card-desc {
    position: static;
    width: 100%;
  }
}

/* スマホ(320〜767): Figma 固定 297px + absolute 本文でカードが右にはみ出すのを防ぐ */
@media (max-width: 767px) {
  .business-page .business-page__seed-inner {
    padding-block: var(--space-16);
  }

  .business-page .business-page__seed-inner > * {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .business-page .business-page__seed-title {
    margin-bottom: var(--space-10);
  }

  .business-page .business-page__seed-grid {
    width: 100%;
    min-width: 0;
    justify-items: stretch;
    margin-bottom: var(--space-12);
  }

  .business-page .business-page__seed-card {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: var(--space-8) var(--space-6);
    overflow: hidden;
    align-self: stretch;
  }

  .business-page .business-page__seed-card-num-row,
  .business-page .business-page__seed-card-en-wrap,
  .business-page .business-page__seed-card-title,
  .business-page .business-page__seed-card-desc-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .business-page .business-page__seed-card-en-wrap {
    height: auto;
    min-height: 0;
  }

  /* absolute のままだと en-wrap が高さ 0 になり PEOPLE と見出しが密着する */
  .business-page .business-page__seed-card-en {
    position: static;
    top: auto;
  }

  .business-page .business-page__seed-card-title {
    line-height: 1.5;
    min-height: 0;
  }

  .business-page .business-page__seed-card-desc-wrap {
    min-height: 0;
  }

  .business-page .business-page__seed-card-desc {
    position: static;
    display: block;
    width: 100%;
    max-width: 100%;
  }

  .business-page .business-page__seed-card-num {
    position: relative;
  }
}

.business-page .business-page__seed-footnote {
  max-width: 42rem; /* 672px */
  margin: 0 auto;
  text-align: center;
}

.business-page .business-page__seed-footnote p {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 14px; /* Figma .paragraph5 */
  font-weight: 400;
  line-height: 30px;
  color: var(--color-ink-500);
}

.business-page .business-page__seed-footnote p + p {
  margin-top: 0;
}

/* ----- 新規事業紹介（Figma .businesspage · 1280px+ 横スライド / 〜1279 縦積み） ----- */
.business-page__new-biz {
  --new-biz-card-width: 588px; /* 588px */
  --new-biz-card-gap: var(--space-8); /* 32px */
  /* Figma .paragraph / .div — 新規事業紹介 */
  --business-new-biz-eyebrow-h: 17px;
  --business-new-biz-eyebrow-w: 97px;
  --business-new-biz-eyebrow-ls: 3px;
  --business-new-biz-eyebrow-lh: 17px;
  /* Figma .new-business / .initiatives */
  --business-new-biz-title-brand-color: var(--color-brand-primary); /* コンセプトブルー */
  --business-new-biz-title-size: 72px;
  --business-new-biz-title-lh: 72px;
  --business-new-biz-title-ls: -1px;
  --business-new-biz-title-brand-w: 478px;
  --business-new-biz-title-brand-h: 72px;
  --business-new-biz-title-stack-h: 149px;
  --business-new-biz-title-accent-top: 77px;
  /* Figma .container — 新規事業カード */
  --business-new-biz-card-h: 588px;
  --business-new-biz-card-pad: 24px;
  --business-new-biz-card-gap: 16px;
  --business-new-biz-card-media-h: 312px;
  --business-new-biz-card-body-h: 166px;
  --business-new-biz-card-body-pad-x: 16px;
  --business-new-biz-card-title-h: 30px;
  --business-new-biz-card-copy-h: 90px;
  --business-new-biz-card-desc-w: 506px;
  --business-new-biz-card-desc-lh: 30px;
  /* Figma .container — 枠線・ドロップシャドウ */
  --business-new-biz-card-border: color-mix(in srgb, var(--color-ink-900) 8%, transparent);
  --business-new-biz-card-shadow:
    0 2px 8px color-mix(in srgb, var(--color-ink-900) 4%, transparent),
    0 12px 40px color-mix(in srgb, var(--color-brand-primary) 6%, transparent);
  /* Figma box-shadow — クリップしない余白 */
  --new-biz-shadow-pad-y: var(--space-12);
  --new-biz-shadow-pad-x: var(--space-6);
  background-color: var(--color-surface-white);
}

.business-page__new-biz-inner {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--layout-frame);
  margin-inline: auto;
  padding-block: var(--space-24);
}

/* Figma .container — 198px · gap 32px */
.business-page__new-biz-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--section-eyebrow-title-gap);
  width: 100%;
  margin-bottom: clamp(var(--space-10), 5vw, 54px);
  font-family: var(--font-en);
  font-size: 13px;
  color: var(--color-brand-primary);
}

/* Figma .paragraph — 新規事業紹介 */
.business-page__new-biz-eyebrow-row {
  display: flex;
  align-self: stretch;
  align-items: flex-start;
  box-sizing: border-box;
  width: 100%;
  height: var(--business-new-biz-eyebrow-h);
  padding: 0 3px;
}

.business-page__new-biz-eyebrow-wrap {
  display: flex;
  align-items: flex-start;
  box-sizing: border-box;
  height: var(--business-new-biz-eyebrow-h);
  width: var(--business-new-biz-eyebrow-w);
  max-width: var(--business-new-biz-eyebrow-w);
  padding: 0 3px;
}

/* Figma .div */
.business-page__new-biz-eyebrow {
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  width: var(--business-new-biz-eyebrow-w);
  margin: 0;
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 900;
  line-height: var(--business-new-biz-eyebrow-lh);
  letter-spacing: var(--business-new-biz-eyebrow-ls);
  color: var(--color-brand-primary);
}

/* Figma .numberssection2 */
.business-page__new-biz-title-stack {
  position: relative;
  align-self: stretch;
  width: 100%;
  min-height: var(--business-new-biz-title-stack-h);
  font-family: var(--font-en);
  font-size: var(--business-new-biz-title-size);
  text-align: left;
}

.business-page__new-biz-title {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
}

.business-page__new-biz-title-line {
  display: inline-block;
  font-family: var(--font-en);
  font-size: var(--fs-display-en-xl);
  font-weight: 900;
  line-height: 1;
  letter-spacing: var(--business-new-biz-title-ls);
  text-align: left;
}

/* Figma .new-business — コンセプトカラー（TOP Three Engines の accent 同型） */
.business-page .business-page__new-biz-header .business-page__new-biz-title-line--brand,
.business-page__new-biz-title-line--brand {
  color: var(--business-new-biz-title-brand-color);
}

/* Figma .initiatives */
.business-page__new-biz-title-line:not(.business-page__new-biz-title-line--brand) {
  display: block;
  color: var(--color-ink-900);
}

/* モバイル — 縦積み */
.business-page__new-biz-title-line + .business-page__new-biz-title-line {
  margin-top: var(--top-numbers-gap-title-lines);
}

@media (min-width: 1280px) {
  .business-page__new-biz-header {
    min-height: 198px; /* 198px */
    margin-bottom: 54px; /* 54px */
  }

  .business-page__new-biz-title-stack {
    height: var(--business-new-biz-title-stack-h);
    min-height: var(--business-new-biz-title-stack-h);
  }

  .business-page__new-biz-title-line {
    position: absolute;
    left: 0;
    font-size: var(--business-new-biz-title-size);
    line-height: var(--business-new-biz-title-lh);
    letter-spacing: var(--business-new-biz-title-ls);
  }

  .business-page__new-biz-title-line--brand {
    top: 0;
    width: var(--business-new-biz-title-brand-w);
    height: var(--business-new-biz-title-brand-h);
    color: var(--business-new-biz-title-brand-color);
  }

  .business-page__new-biz-title-line:not(.business-page__new-biz-title-line--brand) {
    top: var(--business-new-biz-title-accent-top);
    color: var(--color-ink-900);
  }

  .business-page__new-biz-title-line + .business-page__new-biz-title-line {
    margin-top: 0;
  }
}

.business-page__new-biz-content {
  width: 100%;
  min-width: 0;
}

.business-page__new-biz-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  width: 100%;
  min-width: 0;
}

/* 〜1023px: 縦積み */
.business-page__new-biz-viewport {
  width: 100%;
  min-width: 0;
}

.business-page__new-biz-viewport__stage {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding-block: var(--new-biz-shadow-pad-y);
  padding-inline: var(--new-biz-shadow-pad-x);
}

.business-page__new-biz-track {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  margin: 0;
  padding: 0;
  will-change: auto;
}

.business-page__new-biz-track-item {
  width: 100%;
  min-width: 0;
}

.business-page__new-biz-track .business-page__new-biz-card {
  min-height: auto;
}

@media (min-width: 1024px) {
  /* 1024px+: 横スライド — 画面幅いっぱいに表示、シャドウは余白内でクリップしない */
  .business-page__new-biz-body {
    overflow: visible;
  }

  /* layout-inset の外までカルーセル行だけ広げる（Figma .container-parent 相当） */
  .business-page__new-biz-viewport--slider {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    margin-inline: calc(50% - 50vw);
    overflow: visible;
    cursor: grab;
    touch-action: pan-y;
  }

  .business-page__new-biz-viewport--slider.business-page__new-biz-viewport--paused {
    cursor: pointer;
  }

  .business-page__new-biz-viewport--slider.business-page__new-biz-viewport--dragging {
    cursor: grabbing;
    touch-action: none;
    user-select: none;
  }

  .business-page__new-biz-viewport__stage {
    box-sizing: border-box;
    overflow: hidden;
    padding-block: var(--new-biz-shadow-pad-y);
    padding-inline: calc(var(--layout-inline-lg) + var(--new-biz-shadow-pad-x));
  }

  .business-page__new-biz-track--auto-drift {
    flex-direction: row;
    align-items: stretch;
    gap: var(--new-biz-card-gap);
    width: max-content;
    will-change: transform;
    backface-visibility: hidden;
    padding-inline: var(--new-biz-shadow-pad-x);
    box-sizing: content-box;
  }

  .business-page__new-biz-viewport--slider .business-page__new-biz-track-item {
    flex: 0 0 var(--new-biz-card-width);
    width: var(--new-biz-card-width);
    box-sizing: border-box;
  }

  .business-page__new-biz-viewport--slider .business-page__new-biz-track .business-page__new-biz-card {
    min-height: var(--business-new-biz-card-h);
    height: var(--business-new-biz-card-h);
  }
}


@media (min-width: 1024px) {
  /* ===== 新規事業: 1〜2枚は静的横並び（Figma .container-parent / カード588px・gap32px・件数ぶんのみ） ===== */
  /* 内寸1240px(=1400 − 80×2)に 588×2 + gap32 = 1208px が収まる。3枚以上は --slider が担当 */
  .business-page__new-biz-viewport--static .business-page__new-biz-viewport__stage {
    overflow: visible; /* full-bleed用クリップ不要。影はインセット余白へ柔らかく出す */
    padding-inline: 0; /* インセットは inner(.layout-inset 80px) で確保済み */
  }

  .business-page__new-biz-viewport--static .business-page__new-biz-track--static {
    flex-direction: row;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: var(--new-biz-card-gap); /* 32px */
  }

  .business-page__new-biz-viewport--static .business-page__new-biz-track-item {
    /* [修正] 中間幅(1024-1368px)でinner幅を超え2枚目が見切れるため、固定588px→縮小可(上限588px)に */
    flex: 1 1 0;
    min-width: 0;
    max-width: var(--new-biz-card-width);
    width: auto;
    box-sizing: border-box;
  }

  .business-page__new-biz-viewport--static .business-page__new-biz-track .business-page__new-biz-card {
    min-height: var(--business-new-biz-card-h); /* 588px */
    height: var(--business-new-biz-card-h);
  }
}

/* Figma .container */
.business-page__new-biz-card {
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--business-new-biz-card-gap);
  width: 100%;
  min-height: var(--business-new-biz-card-h);
  padding: var(--business-new-biz-card-pad);
  border: 1px solid var(--business-new-biz-card-border);
  background-color: var(--color-surface-white);
  box-shadow: var(--business-new-biz-card-shadow);
  overflow: hidden;
  text-align: left;
  font-family: var(--font-jp);
  font-size: 20px;
  color: var(--color-ink-900);
}

/* Figma .container-icon */
.business-page__new-biz-card-media {
  align-self: stretch;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  height: var(--business-new-biz-card-media-h);
  overflow: hidden;
  position: relative;
}

.business-page__new-biz-card-media--placeholder {
  background-color: color-mix(in srgb, var(--color-ink-300) 55%, var(--color-surface-paper));
}

/* scroll-rise-photo と同系 — ホバーで停止＋写真わずかに拡大 */
.business-page__new-biz-card-media-zoom {
  width: 100%;
  height: 100%;
  transform-origin: center center;
}

.business-page__new-biz-card-media-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: transform 0.85s var(--anim-ease-out);
}

.business-page__new-biz-card:hover .business-page__new-biz-card-media-img,
.business-page__new-biz-card:focus-within .business-page__new-biz-card-media-img {
  transform: scale(1.04);
}

@media (prefers-reduced-motion: reduce) {
  .business-page__new-biz-card-media-img {
    transition: none;
  }

  .business-page__new-biz-card:hover .business-page__new-biz-card-media-img,
  .business-page__new-biz-card:focus-within .business-page__new-biz-card-media-img {
    transform: none;
  }
}

/* Figma .heading-3-parent */
.business-page__new-biz-card-body {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  box-sizing: border-box;
  width: 100%;
  min-height: var(--business-new-biz-card-body-h);
  gap: var(--business-new-biz-card-gap);
  padding: 0 var(--business-new-biz-card-body-pad-x);
  min-width: 0;
  text-align: left;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

/* Figma .heading-3 */
.business-page__new-biz-card-heading {
  align-self: stretch;
  position: relative;
  height: var(--business-new-biz-card-title-h);
  min-height: var(--business-new-biz-card-title-h);
}

/* Figma .xxxxxxxxx */
.business-page__new-biz-card-title {
  position: relative;
  top: 0;
  left: 0;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: 700;
  line-height: var(--business-new-biz-card-title-h);
  color: inherit;
}

/* Figma .paragraph */
.business-page__new-biz-card-copy {
  align-self: stretch;
  position: relative;
  min-height: var(--business-new-biz-card-copy-h);
  font-size: 14px;
  color: var(--color-ink-500);
}

/* Figma .div */
.business-page__new-biz-card-desc {
  position: relative;
  top: 0;
  left: 0;
  display: inline-block;
  width: min(var(--business-new-biz-card-desc-w), 100%);
  max-width: 100%;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: 400;
  line-height: var(--business-new-biz-card-desc-lh);
  color: inherit;
  flex-shrink: 0;
  white-space: pre-line;
}

@media (min-width: 1280px) {
  .business-page__new-biz-card-body {
    height: var(--business-new-biz-card-body-h);
    min-height: var(--business-new-biz-card-body-h);
  }

  .business-page__new-biz-card-title {
    position: absolute;
  }

  .business-page__new-biz-card-copy {
    height: var(--business-new-biz-card-copy-h);
    min-height: var(--business-new-biz-card-copy-h);
  }

  .business-page__new-biz-card-desc {
    position: absolute;
    width: var(--business-new-biz-card-desc-w);
    max-width: var(--business-new-biz-card-desc-w);
  }
}

/* 新規事業紹介 — 320〜767px（写真 312px 固定は縦長すぎ・stage 余白で右寄りに見える） */
@media (max-width: 767px) {
  /* 実績紹介・企業理念（TOP）・Three Drivers と同型のラベル→英字見出し段間 */
  .business-page__new-biz-header {
    gap: var(--stack-gap-label-heading);
  }

  .business-page__new-biz-title-stack {
    min-height: 0;
    height: auto;
    font-size: inherit;
  }

  .business-page__new-biz-title-line {
    position: static;
    top: auto;
    width: auto;
    height: auto;
  }

  .business-page__new-biz-viewport__stage {
    padding-inline: 0;
    padding-block: var(--space-4);
  }

  .business-page__new-biz-track {
    gap: var(--space-8);
  }

  .business-page__new-biz-track-item,
  .business-page__new-biz-track .business-page__new-biz-card {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
  }

  .business-page__new-biz-card {
    align-items: stretch;
    box-sizing: border-box;
    min-height: 0;
    padding: var(--space-5);
  }

  .business-page__new-biz-card-media {
    height: auto;
    max-height: none;
    aspect-ratio: 3 / 2;
  }

  .business-page__new-biz-card-media-zoom {
    height: 100%;
  }

  .business-page__new-biz-card-body {
    min-height: 0;
    height: auto;
  }

  .business-page__new-biz-card-heading {
    height: auto;
    min-height: 0;
  }

  .business-page__new-biz-card-title {
    font-size: var(--fs-h4-m);
    line-height: 1.45;
  }

  .business-page__new-biz-card-copy {
    min-height: 0;
    height: auto;
  }

  .business-page__new-biz-card-desc {
    display: block;
    font-size: var(--fs-body-m);
    line-height: var(--fs-body-lh-fluid);
  }
}

/* ----- エコシステム（Figma .container-parent） ----- */
.business-page .business-page__ecosystem-head {
  margin-bottom: var(--space-20);
  text-align: center;
}

.business-page .business-page__ecosystem-title {
  margin: 0;
}

.business-page .business-page__ecosystem-lead {
  margin: 0 auto;
  max-width: 42rem; /* 672px · Figma .paragraph42 */
  font-family: var(--font-jp);
  font-size: 15px;
  font-weight: 400;
  line-height: 2.2; /* ~33px with br */
  color: var(--color-ink-500);
}

.business-page .business-page__ecosystem-closing {
  max-width: var(--business-ecosystem-closing-w);
  margin: var(--space-20) auto 0;
  padding-top: clamp(var(--space-10), 4vw, 49px); /* 49px Figma */
  border-top: 1px solid color-mix(in srgb, var(--color-ink-900) 8%, transparent);
  text-align: center;
}

/* Figma .mf — 672×72 · 24px / lh 36 · 中央 */
.business-page .business-page__ecosystem-closing-text {
  display: inline-block;
  width: 100%;
  max-width: var(--business-ecosystem-closing-w);
  min-height: var(--business-ecosystem-closing-h);
  margin: 0;
  font-family: var(--font-jp);
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
  letter-spacing: 0;
  text-align: center;
  color: var(--color-ink-900);
}

/* Figma .foundationstrip — top 40 left 32 · gap 32 · 高さ 54 */
.business-page .business-page__foundation-strip-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-8);
  width: 100%;
  max-width: 1209px; /* 1209px */
  min-height: 54px;
}

/* ----- Foundation strip 行（アコーディオン） ----- */

.business-page .business-page__foundation-strip-row {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: var(--space-8); /* 32px */
}

.business-page .business-page__foundation-strip--hover:not(.is-open) .business-page__foundation-strip-inner {
  cursor: default;
}

.business-page .business-page__foundation-strip-inner[role="button"] {
  cursor: pointer;
}

.business-page .business-page__foundation-strip-inner[role="button"]:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-radius: 2px;
}

.business-page .business-page__foundation-strip-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  color: color-mix(in srgb, var(--color-ink-900) 70%, transparent);
  transition: color var(--foundation-strip-color-duration) ease 0.05s;
}

.business-page .business-page__foundation-strip-copy {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2); /* 8px · .container2 */
}

/* Figma .heading-3 / .b — 18px / lh 36 / tracking 0px */
.business-page .business-page__foundation-strip-title {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 18px;
  font-weight: 700;
  line-height: 36px;
  letter-spacing: 0.02em;
  color: var(--color-ink-900);
  transition: color var(--foundation-strip-color-duration) ease 0.05s;
}

.business-page .business-page__foundation-strip--hover[data-accent="primary"]:hover .business-page__foundation-strip-title,
.business-page .business-page__foundation-strip.is-open[data-accent="primary"] .business-page__foundation-strip-title {
  color: var(--color-brand-primary);
}

.business-page .business-page__foundation-strip--hover[data-accent="secondary"]:hover .business-page__foundation-strip-title,
.business-page .business-page__foundation-strip.is-open[data-accent="secondary"] .business-page__foundation-strip-title {
  color: var(--color-brand-secondary);
}

.business-page .business-page__foundation-strip--hover[data-accent="orange"]:hover .business-page__foundation-strip-title,
.business-page .business-page__foundation-strip.is-open[data-accent="orange"] .business-page__foundation-strip-title {
  color: var(--color-brand-accent-orange);
}

.business-page .business-page__foundation-strip--hover[data-accent="primary"]:hover .business-page__foundation-strip-icon,
.business-page .business-page__foundation-strip.is-open[data-accent="primary"] .business-page__foundation-strip-icon {
  color: var(--color-brand-primary);
}

.business-page .business-page__foundation-strip--hover[data-accent="secondary"]:hover .business-page__foundation-strip-icon,
.business-page .business-page__foundation-strip.is-open[data-accent="secondary"] .business-page__foundation-strip-icon {
  color: var(--color-brand-secondary);
}

.business-page .business-page__foundation-strip--hover[data-accent="orange"]:hover .business-page__foundation-strip-icon,
.business-page .business-page__foundation-strip.is-open[data-accent="orange"] .business-page__foundation-strip-icon {
  color: var(--color-brand-accent-orange);
}

/* Figma .paragraph / .div — 13px / lh 26 */
.business-page .business-page__foundation-strip-desc {
  position: relative;
  top: -2px;
  margin: 0;
  font-family: var(--font-jp);
  font-size: 13px;
  font-weight: 400;
  line-height: 26px;
  color: color-mix(in srgb, var(--color-ink-500) 60%, transparent);
}

/* ＋/× — 開閉でボタン枠を固定しアイコン位置を揃える（＋を45°で×） */
.business-page .business-page__foundation-strip-toggle {
  flex-shrink: 0;
  align-self: flex-start;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border: none;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  color: color-mix(in srgb, var(--color-ink-900) 15%, transparent);
}

.business-page .business-page__foundation-strip-toggle-icon {
  display: block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  transform-origin: center center;
  transition:
    transform 0.25s var(--anim-ease-out),
    color 0.25s ease;
}

/* 開時 — 枠サイズは変えず色と回転のみ */
.business-page .business-page__foundation-strip.is-open .business-page__foundation-strip-toggle {
  color: var(--color-ink-900);
}

.business-page .business-page__foundation-strip.is-open .business-page__foundation-strip-toggle-icon {
  transform: rotate(45deg);
}

.business-page .business-page__foundation-strip-toggle:hover {
  color: var(--color-ink-900);
}

.business-page .business-page__foundation-strip.is-open .business-page__foundation-strip-toggle:hover {
  opacity: 0.75;
}

.business-page .business-page__foundation-strip-toggle:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-radius: 2px;
}

.business-page .business-page__foundation-strip-detail-wrap {
  overflow: hidden;
}

.business-page .business-page__foundation-strip-detail {
  margin: 0;
  padding: var(--space-8) 56px var(--space-2) 47px; /* 32px top · 47px left icon offset */
  max-width: 884px; /* 884px Figma */
  font-family: var(--font-jp);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 2.14; /* 30px / 14px */
  color: var(--color-ink-500);
}

@media (max-width: 767px) {
  .business-page .business-page__foundation-strip {
    min-height: 0;
  }

  .business-page .business-page__foundation-strip:not(.is-open) {
    min-height: 5.5rem;
  }

  /* Figma 135px 用の 134px 固定だと、折り返し・展開時に左ラインが途中で切れる */
  .business-page .business-page__foundation-strip::before {
    top: 0;
    bottom: 0;
    height: auto;
  }

  .business-page .business-page__foundation-strip--hover:not(:hover):not(.is-open)::before {
    top: 0;
    bottom: 0;
    height: auto;
  }

  .business-page .business-page__foundation-strip.is-open {
    overflow: visible;
  }

  .business-page .business-page__foundation-strip-header {
    align-items: flex-start;
    gap: var(--space-3);
  }

  .business-page .business-page__foundation-strip-row {
    align-items: flex-start;
    min-width: 0;
  }

  .business-page .business-page__foundation-strip-copy {
    min-width: 0;
  }

  .business-page .business-page__foundation-strip-title {
    line-height: 1.45;
    overflow-wrap: anywhere;
  }

  .business-page .business-page__foundation-strip-desc {
    top: 0;
    margin: 0;
    color: var(--color-ink-500);
  }

  /* ベース .foundation-strip-inner（padding-bottom:0）より後に置き 768px 相当の下余白を確保 */
  .business-page .business-page__foundation-strip-inner {
    padding: var(--space-5) var(--space-4) var(--space-6) calc(3px + var(--space-4));
  }

  .business-page .business-page__foundation-strip-copy {
    gap: var(--space-3);
  }

  .business-page .business-page__foundation-strip-detail-wrap {
    position: relative;
    z-index: 2;
    overflow: visible;
  }

  .business-page .business-page__foundation-strip-detail {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding: var(--space-4) var(--space-4) var(--space-6) calc(3px + var(--space-4));
  }

  /* 展開時 — 説明文下の余白を 768px（min-height 135px）相当まで確保 */
  .business-page .business-page__foundation-strip.is-open .business-page__foundation-strip-inner {
    padding-bottom: var(--space-8);
  }
}

@media (prefers-reduced-motion: reduce) {
  .business-page .business-page__foundation-strip::after,
  .business-page .business-page__foundation-strip::before,
  .business-page .business-page__foundation-strip-title,
  .business-page .business-page__foundation-strip-icon {
    transition: none;
  }

  .business-page .business-page__foundation-strip--hover:hover::after,
  .business-page .business-page__foundation-strip.is-open::after {
    clip-path: inset(0 0 0 0);
  }
}

/* ----- リサイクルフロー（Figma .section / .backgroundborder） ----- */
.business-page .business-flow {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--business-flow-head-gap);
  box-sizing: border-box;
  width: 100%;
  max-width: var(--business-flow-section-max);
  margin-bottom: var(--space-16);
  padding: 0 var(--space-6) var(--space-16);
}

.business-page .business-flow__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  max-width: 45rem;
  margin: 0;
  padding-top: 8px; /* 8px · .container33 */
}

.business-page .business-flow__title {
  margin: 0;
  max-width: 45rem;
  font-family: var(--font-jp);
  font-size: var(--fs-h3);
  font-weight: 700;
  line-height: 2;
  letter-spacing: var(--business-flow-title-ls);
  color: var(--color-ink-900);
}

.business-page .business-flow__lead {
  margin: 0;
  max-width: 760px; /* 760px */
  padding-top: 6px; /* 6px · .container35 */
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 400;
  line-height: 30px;
  color: var(--color-ink-700);
}

.business-page .business-flow__canvas {
  align-self: stretch;
  border-radius: var(--space-2);
  background-color: var(--business-flow-canvas-bg);
  border: 1px solid var(--business-flow-canvas-border);
  padding: clamp(var(--space-10), 6vw, var(--space-16)) clamp(var(--space-5), 4vw, var(--space-12));
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}

.business-page .business-flow__consumer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
}

.business-page .business-flow__consumer-card {
  width: min(100%, 380px);
  padding: var(--space-5) var(--space-7);
  border-radius: 999px;
  background: var(--color-surface-white);
  border: 2px solid var(--color-brand-primary);
  text-align: center;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--color-ink-900) 2%, transparent);
}

.business-page .business-flow__consumer-label {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
  color: var(--color-ink-900);
}

.business-page .business-flow__consumer-tag {
  padding: var(--space-2) var(--space-4);
  border-radius: var(--space-1);
  border: 1px solid var(--color-ink-900);
  background: var(--color-surface-white);
}

.business-page .business-flow__consumer-tag p {
  margin: 0;
  font-size: 12px;
  line-height: 1.8;
  color: var(--color-ink-900);
}

.business-page .business-flow__collectors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
}

@media (min-width: 768px) {
  .business-page .business-flow__collectors {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .business-page .business-flow__collectors {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.business-page .business-flow__collector-card {
  min-height: 110px;
  padding: var(--space-3) var(--space-2) var(--space-10);
  border-radius: var(--space-2);
  border: 1px solid var(--color-line-border);
  background: var(--color-surface-white);
  text-align: center;
}

.business-page .business-flow__collector-card p {
  margin: 0;
  font-family: var(--font-jp);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--color-ink-900);
}

.business-page .business-flow__material-bar {
  text-align: center;
}

.business-page .business-flow__material-bar p {
  margin: 0;
  display: inline-block;
  padding: var(--space-2) var(--space-5);
  border-radius: var(--space-1);
  background: var(--color-ink-900);
  font-size: 12px;
  font-weight: 700;
  color: var(--color-surface-white);
}

.business-page .business-flow__pickup {
  text-align: center;
}

.business-page .business-flow__pickup p {
  margin: 0;
  display: inline-flex;
  align-items: center;
  padding: var(--space-2) var(--space-4);
  border-radius: 6px;
  background: var(--color-surface-white);
  font-size: var(--fs-body);
  font-weight: 700;
  color: var(--color-ink-900);
}

.business-page .business-flow__hub {
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 768px) {
  .business-page .business-flow__hub {
    grid-template-columns: minmax(10rem, 178px) 1fr;
    align-items: start;
  }
}

.business-page .business-flow__hub-brand {
  padding: var(--space-7) var(--space-6);
  border-radius: var(--space-2);
  background: var(--color-brand-primary);
  text-align: center;
  box-shadow: 0 16px 40px -22px color-mix(in srgb, var(--color-brand-primary) 60%, transparent);
}

.business-page .business-flow__hub-name {
  margin: 0;
  font-family: var(--font-jp);
  font-size: var(--fs-body);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.06em;
  color: var(--color-surface-white);
}

.business-page .business-flow__hub-process {
  position: relative;
  padding: var(--space-6) var(--space-4);
  border-radius: 6px;
  border: 1px solid var(--color-line-border);
  background: var(--color-surface-white);
}

.business-page .business-flow__hub-process-title {
  margin: 0 0 var(--space-3);
  font-family: var(--font-jp);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--color-brand-primary);
}

.business-page .business-flow__process-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-2);
}

@media (min-width: 640px) {
  .business-page .business-flow__process-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .business-page .business-flow__process-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.business-page .business-flow__process-item {
  padding: var(--space-2) var(--space-3);
  border-radius: 6px;
  border: 1px solid var(--color-line-border);
  background: color-mix(in srgb, var(--color-surface-paper) 85%, var(--color-surface-white));
}

.business-page .business-flow__process-item-title {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--color-ink-900);
}

.business-page .business-flow__process-item-desc {
  margin: var(--space-1) 0 0;
  font-size: 10px;
  line-height: 1.4;
  color: var(--color-ink-500);
}

.business-page .business-flow__outputs {
  display: grid;
  gap: var(--space-4);
}

@media (min-width: 640px) {
  .business-page .business-flow__outputs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .business-page .business-flow__outputs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.business-page .business-flow__output-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  text-align: center;
}

.business-page .business-flow__output-tag {
  margin: 0;
  padding: var(--space-1) var(--space-3);
  border-radius: 3px;
  background: var(--color-ink-900);
  font-size: 11px;
  color: var(--color-surface-white);
}

.business-page .business-flow__output-product {
  width: 100%;
  min-height: 6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-3);
  border-radius: 999px;
  border: 2px solid var(--color-brand-primary);
  background: var(--color-surface-white);
}

.business-page .business-flow__output-product p {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--color-ink-900);
}

.business-page .business-flow__output-material {
  margin: 0;
  padding: var(--space-1) var(--space-3);
  border-radius: 3px;
  background: color-mix(in srgb, var(--color-ink-900) 90%, transparent);
  font-size: 11px;
  color: var(--color-surface-white);
}

.business-page .business-flow__output-markets {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-2);
  width: 100%;
}

.business-page .business-flow__market-chip {
  display: block;
  width: 100%;
  max-width: 9rem;
  padding: var(--space-3) var(--space-2);
  border: 1px solid var(--color-ink-900);
  border-radius: var(--space-1);
  background: var(--color-surface-white);
  font-size: var(--fs-caption);
  line-height: 1.5;
  color: var(--color-ink-900);
}

.business-page .business-flow__note {
  margin: 0;
  text-align: right;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10px;
  line-height: 2;
  color: var(--color-ink-500);
}

/* ----- Partnership CTA（Figma .contactctaphoto） ----- */
.business-page__partnership.surface-photo::after {
  display: none;
}

.business-page__partnership-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background-color: color-mix(in srgb, var(--color-ink-900) 55%, transparent);
  pointer-events: none;
}

.business-page__partnership-inner {
  position: relative;
  z-index: 2;
  max-width: 45rem;
  margin: 0 auto;
  text-align: center;
}

.business-page__partnership-eyebrow {
  margin: 0 0 var(--space-6);
  font-family: var(--font-en);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--color-brand-accent-yellow);
}

.business-page__partnership-title {
  margin: 0 0 var(--space-6);
  font-family: var(--font-jp);
  font-size: var(--fs-h2-md);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-ink-inv-900);
}

.business-page__partnership-lead {
  margin: 0 auto var(--space-10);
  max-width: 32rem;
  font-family: var(--font-jp);
  font-size: var(--fs-body);
  line-height: 2.14;
  color: var(--color-ink-inv-700);
}

.business-page__partnership-rule {
  width: 40px;
  height: 1px;
  margin: 0 auto var(--space-5);
  background-color: color-mix(in srgb, var(--color-surface-white) 20%, transparent);
}

.business-page__partnership-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  margin-bottom: var(--space-10);
}

@media (min-width: 640px) {
  .business-page__partnership-actions {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.business-page__partnership-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  min-width: min(100%, 287px);
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--color-brand-accent-yellow);
  font-family: var(--font-jp);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--color-surface-white);
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.business-page__partnership-btn:hover {
  background-color: color-mix(in srgb, var(--color-brand-accent-yellow) 12%, transparent);
}

.business-page__partnership-btn:focus-visible {
  outline: var(--focus-ring-light);
  outline-offset: 3px;
}

.business-page__partnership-meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-6);
}

@media (min-width: 640px) {
  .business-page__partnership-meta {
    flex-direction: row;
    gap: var(--space-10);
  }
}

.business-page__partnership-meta-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.business-page__partnership-meta-label {
  font-family: var(--font-jp);
  font-size: 11px;
  font-weight: 700;
  color: var(--color-ink-inv-500);
}

.business-page__partnership-meta-value {
  font-family: var(--font-jp);
  font-size: 13px;
  color: var(--color-ink-inv-700);
}

/* ≤1023px — ベース固定pxの本文・リード段落を流体化（1024px+ の指定は不変） */
@media (max-width: 1023px) {
  .business-page .business-brand-story__brand-desc,
  .business-page .business-page__value-creation-desc,
  .business-page .business-page__vision-faq-q,
  .business-page .business-page__seed-card-desc-wrap,
  .business-page .business-page__seed-card-desc,
  .business-page .business-page__seed-footnote p,
  .business-page .business-page__future-lead p,
  .business-page__partnership-lead {
    font-size: var(--fs-body-fluid);
    line-height: var(--fs-body-lh-fluid);
  }
}


/* ==========================================================
   [Excel指摘 まとめ修正 / 事業紹介ページ Overview]
   ========================================================== */

/* row2/r23/r24 : React business-page-1440.css 準拠。
   1024px+ は __inner(.layout-inset) に上下128px(space-32)・左右80px(layout-inline-lg)。
   ※768-1023(padding-block 96px)と ~767(64/24)は本ファイル既存ルールで対応済み。 */
@media (min-width: 1024px) {
  .business-page .business-overview__inner.layout-inset {
    padding-block: var(--space-32);
    padding-inline: var(--layout-inline-lg);
  }
}

/* row25: 1024px以上で説明文(lead)を右側に寄せる
   （タイトル左／説明文右の2カラム。現状は縦積みで右にずれなかった） */
@media (min-width: 1024px) {
  .business-page .business-overview__header-grid {
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 48px;
  }
  .business-page .business-overview__title {
    max-width: var(--business-overview-title-max, 647px);
  }
  .business-page .business-overview__lead {
    margin-bottom: 6px;
  }
}

/* ==========================================================
   [画像指摘] Three Drivers 各行のフッター(資源を活かす等)が
   下に折り返して縦に伸び、高さがバラつく問題。
   原因: driver-desc に min-width:0 が無く、日本語テキストが
   min-content 以下に縮まないためフッターが次行へ折り返していた。
   対応: 768px+ は1行固定(nowrap)、descを縮小可能に、footを右端インラインへ。
   ※767px以下は既存の grid 縦積みレイアウトを維持。
   ========================================================== */
@media (min-width: 1024px) {
  .business-page .business-page__driver-inner {
    flex-wrap: nowrap;
    align-items: center;
  }
  .business-page .business-page__driver-desc {
    min-width: 0;
    flex: 1 1 auto;
  }
  .business-page .business-page__driver-foot {
    flex: 0 0 auto;
    margin-left: auto;
  }
}

/* ==========================================================
   [再適用] 768〜1023px で driver 説明文が1文字ずつ縦に潰れる問題。
   原因: この幅では BASE 横一列＋nowrap対処で head(288)+foot(314)固定により
         desc が0幅(min-content=1文字)に潰れる。
   対応: 768〜1023 は ≤767 と同じ縦積みグリッドへ統一（≥1024 横一列は不変）。
   ※ .business-page__driver-* のみに作用。フロー図等には無関係。
   ========================================================== */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .business-page .business-page__driver-row {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .business-page .business-page__driver-inner {
    display: grid;
    grid-template-columns: 3rem minmax(0, 1fr);
    column-gap: var(--space-4);
    row-gap: var(--space-3);
    align-items: center;
    padding-inline: 0;
  }

  .business-page .business-page__driver-head { display: contents; }

  .business-page .business-page__driver-num {
    grid-column: 1;
    grid-row: 1;
    font-size: 28px;
  }

  .business-page .business-page__driver-title {
    grid-column: 2;
    grid-row: 1;
    font-size: var(--fs-h4-fluid);
    line-height: 1.45;
    letter-spacing: 0.04em;
  }

  .business-page .business-page__driver-desc {
    grid-column: 1 / -1;
    grid-row: 2;
    min-width: 0;
    max-width: none;
    width: auto;
    flex: none;
    font-size: var(--fs-body-fluid);
    line-height: var(--fs-body-lh-fluid);
  }

  .business-page .business-page__driver-foot {
    grid-column: 1 / -1;
    grid-row: 3;
    flex: none;
    width: 100%;
    justify-content: space-between;
    padding-top: var(--space-3);
    margin-top: var(--space-1);
    margin-left: 0;
    border-top: 1px solid color-mix(in srgb, var(--color-ink-900) 6%, transparent);
  }
}
