/* ==========================================================
   Design tokens
   SP値を基準に定義し、1080px以上でPC（Figma 1920基準）の値に切り替える
   ========================================================== */
:root {
  /* Color */
  --c-navy: #0e1e2f;
  --c-navy-deep: #07131f;
  --c-navy-card: #14283b;
  --c-yellow: #ffff74;
  --c-white: #fff;
  --c-black: #000;
  --c-line: #707070;
  --c-muted: #76889a;
  --c-line-soft: rgba(255, 255, 255, 0.35);

  /* Font family */
  --ff-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --ff-en: "Roboto Condensed", "Noto Sans JP", "Arial Narrow", sans-serif;

  /* Font size (SP) */
  --fs-hero-top: 63px;
  --fs-hero: 48px;
  --fs-section: 60px;
  --fs-number: 88px;
  --fs-cta: 44px;
  --fs-display: 40px;   /* Sales Promotion Branding 等 */
  --fs-h2: 20px;
  --fs-h3: 22px;
  --fs-name: 26px;
  --fs-tagline: 23px;
  --fs-lead: 16px;
  --fs-body: 15px;
  --fs-small: 14px;
  --fs-label: 14px;
  --fs-caption: 12px;

  /* Line height / letter spacing */
  --lh-tight: 1.1;
  --lh-heading: 1.5;
  --lh-body: 1.9;
  --ls-jp: 0.08em;
  --ls-jp-bold: 0.1em;

  /* Spacing */
  --gutter: 20px;
  --content: 1000px;
  --col-gap: 42px;
  --section-y: 90px;
  --stack-s: 16px;
  --stack-m: 40px;
  --stack-l: 56px;

  /* Parts */
  --header-h: 69px;
  --radius-pill: 999px;
  --radius-card: 6px;
  --radius-tag: 4px;
}

/* タブレット：SP構造のまま内容幅を広げる */
@media (min-width: 768px) {
  :root {
    --gutter: 32px;
    --content: 680px;
  }
}

@media (min-width: 1080px) {
  :root {
    --content: 1000px;
    --fs-hero-top: 100px;
    --fs-hero: 85px;
    --fs-section: 65px;
    --fs-number: 180px;
    --fs-cta: 68px;
    --fs-display: 88px;
    --fs-h2: 36px;
    --fs-h3: 22px;
    --fs-name: 22px;
    --fs-tagline: 20px;
    --fs-lead: 18px;
    --fs-body: 16px;
    --fs-small: 13px;
    --fs-label: 13px;
    --fs-caption: 12px;

    --lh-body: 1.875;
    --ls-jp: 0.05em;

    --section-y: 110px;
    --stack-m: 48px;
    --stack-l: 64px;

    --header-h: 110px;
  }
}

/* 自前配信フォント（woff2のみ）。サブセット化は後工程 */
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/NotoSansJP-400.woff2") format("woff2");
}
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/NotoSansJP-700.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/RobotoCondensed-400.woff2") format("woff2");
}

/* ==========================================================
   Base
   ========================================================== */
*,
*::before,
*::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: var(--header-h);
}

body {
  margin: 0;
  padding-top: var(--header-h); /* 固定ヘッダー分 */
  background: var(--c-navy);
  color: var(--c-white);
  font-family: var(--ff-jp);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-jp);
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, svg, video, picture { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
address { font-style: normal; }

:focus-visible {
  outline: 2px solid var(--c-yellow);
  outline-offset: 3px;
}

.en { font-family: var(--ff-en); letter-spacing: 0; }
.bold { font-weight: 700; }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  left: 8px;
  top: -100px;
  z-index: 10000;
  padding: 8px 16px;
  background: var(--c-yellow);
  color: var(--c-navy);
}
.skip-link:focus { top: 8px; }

/* SP/タブレットでは日本語を文節単位で折り返す（対応ブラウザのみ。非対応は通常の折り返し） */
@media (max-width: 1079px) {
  body { word-break: auto-phrase; }
}

/* PC/SPで改行位置だけ変える */
.br-sp { display: inline; }
.br-pc { display: none; }
@media (min-width: 1080px) {
  .br-sp { display: none; }
  .br-pc { display: inline; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0.01ms;
    animation-duration: 0.01ms;
    scroll-behavior: auto;
  }
}

/* ==========================================================
   Layout
   ========================================================== */
.container {
  width: min(100% - var(--gutter) * 2, var(--content));
  margin-inline: auto;
}

.section { padding-block: var(--section-y); }

/* 見出し＋本文の2カラム（SP:縦積み / PC:左右） */
.split {
  display: grid;
  gap: var(--stack-m);
}
@media (min-width: 1080px) {
  .split {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: var(--col-gap);
    align-items: start;
  }
}

/* 本文の段落間 */
.prose > * + * { margin-top: 1.9em; }

/* 区切り線 */
.rule {
  border: 0;
  border-top: 1px solid var(--c-line);
  margin: 0;
}
.rule--dotted {
  border-top: 1px dashed rgba(255, 255, 255, 0.6);
}
.rule--bleed {
  width: calc(100% - var(--gutter) * 2);
  margin-inline: auto;
}
@media (min-width: 1080px) {
  .rule--bleed { width: calc(100% - 3.5%); }
}

/* ==========================================================
   Shared components
   ========================================================== */

/* 円＋矢印アイコン（CTA / Teamsボタン / メニュー） */
.icon-arrow { flex: none; width: 50px; height: 50px; }
.icon-arrow__bg { fill: var(--icon-bg, var(--c-navy)); }
.icon-arrow__fg { fill: none; stroke: var(--icon-fg, #e6e6e6); stroke-width: 2; }

/* ---------- Section heading（英字見出し＋[ラベル]） ---------- */
.section-heading__title {
  font-family: var(--ff-en);
  font-size: var(--fs-section);
  font-weight: 400;
  line-height: var(--lh-tight);
  letter-spacing: 0;
}
.section-heading__label {
  margin-top: 12px;
  font-size: var(--fs-label);
  line-height: 1.6;
}
.section-heading--center { text-align: center; }

/* ---------- Pill badge（黄色アウトライン） ---------- */
.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: min(167px, 100%);
  max-width: 100%;
  min-height: 40px;
  padding: 6px 18px;
  text-align: center;
  border: 1px solid var(--c-yellow);
  border-radius: var(--radius-pill);
  color: var(--c-yellow);
  font-family: var(--ff-en);
  font-size: 17px;
  line-height: 1;
  letter-spacing: 0;
}
@media (min-width: 1080px) {
  .badge {
    min-width: 150px;
    min-height: 34px;
    white-space: nowrap;
    font-size: 16px;
  }
}

/* ---------- 黄色ピルボタン（Teams） ---------- */
.btn-pill {
  --icon-bg: var(--c-navy);
  --icon-fg: var(--c-yellow);
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 220px;
  height: 50px;
  padding: 5px 5px 5px 20px;
  border-radius: var(--radius-pill);
  background: var(--c-yellow);
  color: var(--c-navy);
  font-family: var(--ff-en);
  font-size: 20px;
  line-height: 1;
  letter-spacing: 0;
  transition: opacity 0.2s;
}
.btn-pill .icon-arrow { width: 40px; height: 40px; }
.btn-pill:hover { opacity: 0.85; }
@media (min-width: 1080px) {
  .btn-pill {
    width: 235px;
    height: 40px;
    padding: 4px 4px 4px 18px;
    font-size: 18px;
  }
  .btn-pill .icon-arrow { width: 32px; height: 32px; }
}

/* ---------- More ↗（外部リンク） ---------- */
.more-link {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  color: var(--c-yellow);
  font-family: var(--ff-en);
  font-size: 17px;
  line-height: 1;
  letter-spacing: 0;
}
.more-link img { width: 35px; height: 35px; }
.more-link:hover { opacity: 0.8; }
@media (min-width: 1080px) {
  .more-link { font-size: 16px; gap: 8px; }
  .more-link img { width: 31px; height: 31px; }
}

/* ---------- 番号付きブロック（01 / 02 / 03） ---------- */
.numbered__number {
  display: block;
  color: var(--c-yellow);
  font-family: var(--ff-en);
  font-size: var(--fs-number);
  line-height: 1;
  letter-spacing: 0;
}
.numbered__tagline {
  margin-top: 16px;
  color: var(--c-yellow);
  font-family: var(--ff-en);
  font-size: var(--fs-tagline);
  line-height: 1.35;
  letter-spacing: 0;
}
.numbered__title {
  margin-top: 16px;
  font-size: var(--fs-h2);
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: var(--ls-jp-bold);
}
.numbered__text {
  margin-top: 12px;
  font-size: 16px;
  line-height: 1.6;
}
@media (min-width: 1080px) {
  .numbered__number { margin-left: -0.05em; }
  .numbered__tagline { margin-top: 24px; }
  .numbered__title { margin-top: 10px; line-height: 1.3; letter-spacing: 0.02em; }
  .numbered__text { margin-top: 16px; font-size: 20px; line-height: 1.55; letter-spacing: 0.02em; }
}

/* ---------- 罫線リスト ---------- */
.rule-list { border-top: 1px solid var(--c-line); }
.rule-list__item {
  display: flex;
  align-items: center;
  min-height: 94px;
  padding-block: 20px;
  border-bottom: 1px solid var(--c-line);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: var(--ls-jp-bold);
}
@media (min-width: 1080px) {
  .rule-list__item {
    min-height: 100px;
    font-size: 20px;
    letter-spacing: 0.02em;
  }
}

/* ---------- タググリッド ---------- */
.tag-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 15px;
}
.tag-grid__item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  border: 1px solid var(--c-white);
  border-radius: var(--radius-tag);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.06em;
  text-align: center;
}
@media (min-width: 1080px) {
  .tag-grid {
    grid-template-columns: repeat(2, 235px);
    gap: 20px;
  }
  .tag-grid__item {
    height: 40px;
    border-width: 0.5px;
    font-size: 17px;
    letter-spacing: 0.02em;
  }
}

/* ---------- 写真の共通 ---------- */
.photo img,
.photo picture { width: 100%; height: 100%; }
.photo img { object-fit: cover; }

/* ==========================================================
   Site header（固定）
   ========================================================== */
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 1000;
  height: var(--header-h);
  background: var(--c-navy);
}
.site-header__inner {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-inline: var(--gutter) var(--gutter);
}
.site-header__brand { display: block; flex: none; }
.site-header__logo { width: clamp(140px, 44vw, 168px); height: auto; }

.site-nav {
  display: flex;
  align-items: center;
  gap: 12px;
}
.site-nav__list { display: none; }
.site-nav__link {
  font-family: var(--ff-en);
  font-size: 18px;
  line-height: 1;
  letter-spacing: 0;
  color: var(--c-white);
  transition: color 0.2s;
}
.site-nav__link:hover { color: var(--c-yellow); }
.site-nav__link[aria-current="page"] { color: var(--c-yellow); }

.btn-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding-inline: 13px;
  border-radius: var(--radius-pill);
  background: var(--c-yellow);
  color: var(--c-black);
  font-family: var(--ff-en);
  font-size: 15px;
  line-height: 1;
  letter-spacing: 0;
  transition: opacity 0.2s;
}
.btn-contact:hover { opacity: 0.85; }

/* ハンバーガー */
.menu-toggle {
  position: relative;
  width: 44px;
  height: 44px;
  margin-right: -10px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.menu-toggle__bar {
  position: absolute;
  left: 10px;
  width: 24px;
  height: 1px;
  background: var(--c-white);
  transition: transform 0.2s, opacity 0.2s;
}
.menu-toggle__bar:nth-child(1) { top: 10px; }
.menu-toggle__bar:nth-child(2) { top: 21.5px; }
.menu-toggle__bar:nth-child(3) { top: 33px; }
.menu-toggle[aria-expanded="true"] .menu-toggle__bar:nth-child(1) { transform: translateY(11.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle__bar:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] .menu-toggle__bar:nth-child(3) { transform: translateY(-11.5px) rotate(-45deg); }

@media (min-width: 768px) {
  .site-header__inner { padding-inline: 32px; }
  .site-nav { gap: 40px; }
  .site-nav__list {
    display: flex;
    align-items: center;
    gap: 40px;
  }
  .menu-toggle { display: none; }
}

@media (min-width: 1080px) {
  .site-header__inner { padding-inline: 51px 55px; }
  .site-header__logo { width: 222px; }
  .btn-contact {
    height: 34px;
    padding-inline: 20px;
    font-size: 18px;
  }
}

/* ==========================================================
   Mobile menu（767px以下で使用）
   ========================================================== */
.mobile-menu {
  position: fixed;
  inset: var(--header-h) 0 0 0;
  z-index: 999;
  overflow-y: auto;
  padding: 16px var(--gutter) 48px;
  background: var(--c-navy);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s, visibility 0.15s;
}
.mobile-menu.is-open {
  opacity: 1;
  visibility: visible;
}
.mobile-menu__list { border-top: 1px solid var(--c-line); }
.mobile-menu__item { border-bottom: 1px solid var(--c-line); }
.mobile-menu__link {
  display: flex;
  align-items: center;
  min-height: 64px;
  font-family: var(--ff-en);
  font-size: 28px;
  line-height: 1.2;
  letter-spacing: 0;
}
.mobile-menu__link[aria-current="page"] { color: var(--c-yellow); }
.mobile-menu__contact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 40px;
  height: 56px;
  padding-inline: 24px 8px;
  border-radius: var(--radius-pill);
  background: var(--c-yellow);
  color: var(--c-navy);
  font-family: var(--ff-en);
  font-size: 20px;
  letter-spacing: 0;
}
.mobile-menu__contact .icon-arrow { width: 40px; height: 40px; }
.mobile-menu__mail {
  margin-top: 16px;
  font-family: var(--ff-en);
  font-size: 15px;
  letter-spacing: 0;
  color: var(--c-muted);
  text-align: center;
}
html.is-menu-open { overflow: hidden; }

@media (min-width: 768px) {
  .mobile-menu { display: none; }
}

/* ==========================================================
   Contact CTA（黄色帯）
   ========================================================== */
.contact-cta { background: var(--c-yellow); color: var(--c-navy); }
.contact-cta__link {
  --icon-bg: var(--c-navy);
  --icon-fg: #e6e6e6;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  min-height: 160px;
  padding-inline: var(--gutter);
}
.contact-cta__title {
  display: block;
  font-family: var(--ff-en);
  font-size: var(--fs-cta);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: 0;
}
.contact-cta__sub {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 0.08em;
}
.contact-cta .icon-arrow { transition: transform 0.2s; }
.contact-cta__link:hover .icon-arrow { transform: translate(2px, -2px); }
@media (min-width: 1080px) {
  .contact-cta__link { min-height: 240px; gap: 56px; }
  .contact-cta__sub { margin-top: 8px; font-size: 18px; letter-spacing: 0.02em; }
  .contact-cta .icon-arrow { width: 77px; height: 77px; }
}

/* ==========================================================
   Site footer
   ========================================================== */
.site-footer {
  padding-block: 45px 32px;
  background: var(--c-navy);
  font-family: var(--ff-en);
  letter-spacing: 0;
}
.site-footer__main {
  display: grid;
  grid-template-columns: 115px minmax(0, 1fr);
  gap: 55px 0;
}
.site-footer__brand { grid-column: 1 / -1; }
.site-footer__logo { width: 200px; height: auto; }
.site-footer__nav { display: grid; gap: 14px; align-content: start; }
.site-footer__nav-link,
.site-footer__nav-text { font-size: 19px; line-height: 1.25; }
.site-footer__nav-link:hover { color: var(--c-yellow); }
.site-footer__info { display: grid; gap: 34px; }
.site-footer__label {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.04em;
}
.site-footer__value {
  margin-top: 8px;
  font-size: 17px;
  line-height: 1.27;
  font-weight: 300;
}
.site-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 24px;
  margin-top: 64px;
  padding-top: 26px;
  border-top: 1px solid var(--c-white);
  font-size: 14px;
  line-height: 1.4;
}
.site-footer__legal { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.site-footer__legal a:hover { text-decoration: underline; }

@media (min-width: 768px) {
  .site-footer__main { grid-template-columns: 170px minmax(0, 1fr); }
  .site-footer__info {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0 24px;
  }
}
@media (min-width: 1080px) {
  .site-footer__main {
    grid-template-columns: 255px 170px minmax(0, 1fr);
    gap: 0;
  }
  .site-footer__brand { grid-column: auto; }
  .site-footer__info { grid-template-columns: 255px minmax(0, 1fr); gap: 0; }
  .site-footer { padding-block: 50px 64px; }
  .site-footer__logo { width: 180px; }
  .site-footer__nav { gap: 13px; }
  .site-footer__nav-link,
  .site-footer__nav-text { font-size: 16px; line-height: 1.2; }
  .site-footer__label { font-size: 16px; line-height: 1.2; }
  .site-footer__value { margin-top: 7px; font-size: 15px; line-height: 1.6; }
  .site-footer__bottom {
    margin-top: 40px;
    padding-top: 22px;
    border-top-width: 0.5px;
    font-size: 12px;
  }
  .site-footer__copy { font-size: 11px; }
}

/* ==========================================================
   Teams（addnewpopup.html）
   ========================================================== */

/* ---------- Hero ---------- */
.teams-hero {
  position: relative;
  overflow: hidden;
  color: var(--c-navy);
}
.teams-hero__bg {
  position: absolute;
  inset: 0;
}
.teams-hero__bg img { object-position: 60% center; }
.teams-hero__inner {
  position: relative;
  padding-block: 57px 75px;
}
.teams-hero__head { padding-left: 20px; }
.teams-hero__kicker {
  font-size: 15px;
  line-height: 1.2;
}
.teams-hero__title {
  margin-top: 20px;
  font-size: var(--fs-hero);
  font-weight: 400;
  line-height: 1.15;
}
.teams-hero__upper { text-transform: uppercase; } /* C4: SPのみ大文字 */
.teams-hero__body {
  margin-top: 150px;
  font-size: var(--fs-lead);
  line-height: 1.75;
  letter-spacing: 0.06em;
}
.teams-hero__body.prose > * + * { margin-top: 1.75em; }

@media (min-width: 1080px) {
  .teams-hero { height: 700px; }
  .teams-hero__bg img { object-position: center; }
  .teams-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 468px);
    column-gap: var(--col-gap);
    padding-block: 71px 0;
  }
  .teams-hero__head { padding-left: 0; }
  .teams-hero__kicker { font-size: 20px; }
  .teams-hero__title { margin-top: 13px; line-height: 1.1; }
  .teams-hero__upper { text-transform: none; }
  .teams-hero__body {
    margin-top: 57px;
    line-height: 1.78;
    letter-spacing: 0.02em;
  }
}

/* ---------- Core Members ---------- */
.core-members { padding-block: 90px 90px; }
.core-members__lead {
  margin-top: 85px;
  padding-bottom: 40px;
  border-bottom: 1px solid var(--c-line);
  line-height: 1.85;
}
.member { padding-block: 40px; }
.member + .member { border-top: 1px solid var(--c-line); }
.member__heading {
  display: flex;
  flex-direction: column;
  margin-top: 18px;
}
.member__role {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
}
.member__role--en { letter-spacing: 0.04em; }
.member__name {
  margin-top: 2px;
  font-size: var(--fs-name);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.06em;
}
.member__bio {
  margin-top: 26px;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

@media (min-width: 1080px) {
  .core-members { padding-block: 95px 90px; }
  .core-members__head {
    display: grid;
    grid-template-columns: 680px minmax(0, 320px);
  }
  .core-members__lead {
    margin-top: 7px;
    padding-bottom: 0;
    border-bottom: 0;
    font-size: 14px;
    line-height: 1.86;
  }
  .member-list {
    display: grid;
    grid-template-columns: 235px repeat(3, 255px);
    margin-top: 100px;
  }
  .member {
    padding: 0 12px 20px 0;
  }
  .member + .member {
    padding-left: 20px;
    border-top: 0;
    border-left: 0.5px solid var(--c-white);
  }
  .member__heading { margin-top: 25px; }
  .member__role { font-size: 12px; line-height: 1.3; letter-spacing: 0; white-space: nowrap; }
  .member__name { margin-top: 6px; line-height: 1.25; letter-spacing: 0; white-space: nowrap; }
  .member__bio {
    margin-top: 40px;
    font-size: 14px;
    line-height: 1.85;
    letter-spacing: 0.02em;
  }
}

/* ---------- Co-operation ---------- */
.co-operation__rule {
  width: calc(100% - var(--gutter) * 2);
  margin-inline: auto;
}
.co-operation > .container { padding-block: 92px 82px; }
.co-feature { margin-top: 75px; }
.co-category {
  margin-top: 100px;
  font-size: 21px;
  font-weight: 400;
  line-height: 1.3;
}
.co-category + * { margin-top: 45px; }
.partner-card + .co-category,
.partner-grid + .co-category { margin-top: 82px; }

.partner-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 25px; }
.partner-card { min-width: 0; }
.partner-card {
  display: flex;
  flex-direction: column;
  padding: 0 22px 22px;
  border-radius: var(--radius-tag);
  background: var(--c-navy-card);
}
.partner-card__logo {
  display: grid;
  place-items: center;
  height: 186px;
  padding-top: 20px;
}
.partner-card__logo img { max-width: 100%; height: auto; }
.partner-card__company {
  font-size: 16px;
  line-height: 1.5;
}
.partner-card__badge {
  align-self: flex-start;
  margin-top: 12px;
}
.partner-card__service {
  margin-top: 36px;
  font-size: var(--fs-h3);
  font-weight: 700;
  line-height: 1.36;
  letter-spacing: 0.06em;
}
.partner-card__desc {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.75;
  letter-spacing: 0.04em;
}
.partner-card__more {
  align-self: flex-end;
  margin-top: 28px;
}

.co-operation__divider { width: calc(100% - var(--gutter) * 2); margin-inline: auto; border-top-style: solid; border-top-color: var(--c-line); }

/* 02 / 03 */
.co-split { padding-block: 88px 68px; }
.co-split__text { padding-inline: var(--gutter); }
.co-split__list { margin-top: 75px; }
.co-split__tags { margin-top: 36px; }
.co-split__tags + .co-split__list { margin-top: 62px; }
.co-split__photo {
  margin-top: 72px;
  aspect-ratio: 865 / 800;
}
.co-split--photo-right .co-split__photo { margin-top: 62px; }

@media (min-width: 768px) and (max-width: 1079px) {
  .partner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .co-split__text,
  .co-split__photo { width: min(100% - var(--gutter) * 2, var(--content)); margin-inline: auto; padding-inline: 0; }
}

@media (min-width: 1080px) {
  .co-operation__rule {
    width: calc(100% - 3.5%);
    border-top-color: var(--c-white);
  }
  .co-operation > .container { padding-block: 99px 81px; }
  .co-feature { margin-top: 65px; }
  .co-feature .numbered__tagline { margin-top: 34px; }
  .co-category { margin-top: 90px; font-size: 30px; }
  .co-category + * { margin-top: 31px; }
  .partner-card + .co-category,
  .partner-grid + .co-category { margin-top: 60px; }

  .partner-grid {
    grid-template-columns: repeat(3, 320px);
    gap: 20px;
  }
  .partner-card {
    min-height: 580px;
    padding: 0 20px 19px 22px;
    border-radius: 0;
  }
  .partner-card__logo { height: 236px; padding-top: 0; }
  .partner-card__badge { margin-top: 19px; }
  .partner-card__service {
    min-height: calc(29px * 3);
    margin-top: 17px;
    line-height: 29px;
    letter-spacing: 0.02em;
  }
  .partner-card__desc { margin-top: 18px; line-height: 24px; letter-spacing: 0.02em; }
  .partner-card__more { margin-top: auto; padding-top: 24px; }

  .partner-card--media {
    display: grid;
    grid-template-columns: 548px minmax(0, 1fr);
    align-items: center;
    min-height: 204px;
    padding: 34px 20px 32px 0;
  }
  .partner-card--media .partner-card__logo {
    height: auto;
    padding-left: 57px;
    place-items: center start;
  }
  .partner-card--media .partner-card__content { display: flex; flex-direction: column; }
  .partner-card--media .partner-card__badge { order: -2; margin-top: 0; }
  .partner-card--media .partner-card__service { order: -1; min-height: 0; margin-top: 14px; }
  .partner-card--media .partner-card__company { margin-top: 6px; font-size: 15px; }
  .partner-card--media .partner-card__desc { margin-top: 14px; }

  .co-operation__divider {
    width: calc(100% - 3.5%);
    border-top: 1px dashed rgba(255, 255, 255, 0.9);
  }

  .co-split {
    display: grid;
    align-items: start;
    padding-block: 100px;
  }
  .co-split__text { padding-inline: 0; }
  .co-split__photo { margin-top: 0; }
  .co-split__list { margin-top: 71px; }
  .co-split__tags { margin-top: 39px; }
  .co-split__tags + .co-split__list { margin-top: 77px; }

  .co-split--photo-left {
    grid-template-columns: 45.05% 4.95% minmax(0, 500px) minmax(var(--gutter), 1fr);
  }
  .co-split--photo-left .co-split__photo { grid-column: 1; grid-row: 1; }
  .co-split--photo-left .co-split__text { grid-column: 3; grid-row: 1; padding-top: 40px; }
  .co-split--photo-left .co-split__list { width: calc(100% - 10px); margin-left: 10px; }

  .co-split--photo-right {
    grid-template-columns: max(var(--gutter), calc((100% - var(--content)) / 2)) minmax(0, 490px) 1fr 45.05%;
    padding-block: 87px 119px;
  }
  .co-split--photo-right .co-split__text { grid-column: 2; grid-row: 1; }
  .co-split--photo-right .co-split__photo { grid-column: 4; grid-row: 1; margin-top: 13px; }
}

/* ==========================================================
   About us（record.html）
   ========================================================== */

/* ---------- Hero ---------- */
.about-hero {
  position: relative;
  overflow: hidden;
  min-height: 500px;
  background: #05070a;
}
.about-hero__bg { position: absolute; inset: 0; }
.about-hero__bg img { object-position: 30% center; }
.about-hero__inner { position: relative; padding-block: 57px 60px; }
.about-hero__kicker { font-size: 15px; line-height: 1.2; }
.about-hero__title {
  margin-top: 14px;
  font-size: 50px;
  font-weight: 400;
  line-height: 1.1;
}
.about-hero__sub {
  margin-top: 20px;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.08em;
}
@media (min-width: 1080px) {
  .about-hero { min-height: 720px; }
  .about-hero__bg img { object-position: center 40%; }
  .about-hero__inner { padding-block: 82px; }
  .about-hero__kicker { font-size: 20px; }
  .about-hero__title { margin-top: 13px; font-size: var(--fs-hero); }
  .about-hero__sub { margin-top: 24px; font-size: 22px; letter-spacing: 0.04em; }
}

/* ---------- Message ---------- */
.message { padding-block: 90px 60px; }
.about-columns {
  display: grid;
  gap: 1.9em;
  margin-top: 80px;
}
.about-columns--after { margin-top: 58px; }
.about-columns .prose > * + * { margin-top: 1.9em; }

.quote-band {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 360px;
  margin-top: 62px;
  overflow: hidden;
  padding: 40px var(--gutter);
  text-align: center;
}
.quote-band__bg { position: absolute; inset: 0; }
.quote-band__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(7, 19, 31, 0.35);
}
.quote-band__text {
  position: relative;
  margin: 0;
  font-size: 21px;
  line-height: 1.8;
  letter-spacing: 0.06em;
}

@media (min-width: 1080px) {
  .message { padding-block: 97px 78px; }
  .about-columns {
    grid-template-columns: 448px 448px;
    column-gap: 82px;
    margin-top: 95px;
  }
  .about-columns--after { margin-top: 76px; }
  .quote-band { min-height: 400px; margin-top: 80px; }
  .quote-band__bg::after { background: rgba(7, 19, 31, 0.15); }
  .quote-band__text { font-size: 28px; line-height: 54px; letter-spacing: 0.08em; }
}

/* ---------- Profile ---------- */
.profile {
  padding-block: 64px 75px;
  background: var(--c-navy-deep);
}
.profile__inner { padding-inline: 20px; }
.profile__heading { display: flex; flex-direction: column; }
.profile__role {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.06em;
}
.profile__name {
  margin-top: 4px;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.06em;
}
.profile__bio {
  margin-top: 22px;
  font-size: 15px;
  line-height: 1.67;
  letter-spacing: 0.06em;
}
.profile__photo { width: 200px; margin-top: 40px; }
@media (min-width: 1080px) {
  .profile { min-height: 480px; padding-block: 85px 80px; }
  .profile__inner {
    display: grid;
    grid-template-columns: 312px 235px;
    column-gap: 113px;
    padding-inline: 170px 0;
  }
  .profile__role { font-size: 18px; line-height: 22px; letter-spacing: 0.02em; }
  .profile__name { margin-top: 5px; line-height: 35px; letter-spacing: 0.02em; }
  .profile__bio { margin-top: 35px; font-size: 13px; line-height: 23px; letter-spacing: 0.02em; }
  .profile__photo { width: 235px; margin-top: -5px; }
}

/* ---------- Brand Identity ---------- */
.brand-identity { padding-block: 90px 77px; }
.bi-rule {
  width: min(100% - var(--gutter) * 2, var(--content));
  margin: 50px auto 0;
}
.bi-item { padding-block: 25px 81px; }
.bi-item__head {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  font-family: var(--ff-en);
  font-weight: 400;
  letter-spacing: 0;
}
.bi-item__num { font-size: 40px; line-height: 1.2; }
.bi-item__title { font-size: 34px; line-height: 1.2; }
.bi-item__photo {
  margin-top: 22px;
  aspect-ratio: 335 / 282;
}
.bi-item__label {
  margin-top: 51px;
  font-size: 13px;
  line-height: 1.6;
}
.bi-item__text {
  margin-top: 16px;
  font-size: 17px;
  line-height: 1.82;
  letter-spacing: 0.04em;
}
.bi-rule + .bi-item { padding-top: 25px; }
.bi-rule--dotted { margin-top: 0; }

.wellbeing {
  display: grid;
  gap: 80px;
  padding-top: 88px;
}
.wellbeing__body.prose > * + * { margin-top: 1.82em; }
.wellbeing__text {
  font-size: 16px;
  line-height: 1.82;
  letter-spacing: 0.04em;
}
.wellbeing__chart { width: 100%; max-width: 560px; margin-inline: auto; }
.wb-chart { width: 100%; height: auto; overflow: visible; }
.wb-chart text { font-family: var(--ff-jp); letter-spacing: 0; }
.wb-chart__vertical { writing-mode: vertical-rl; font-size: 15px; font-weight: 700; }
.wb-chart__axis { font-size: 13px; font-weight: 700; }
.wb-chart__band { font-size: 17px; letter-spacing: 0.1em; }
.wb-chart__sign { font-family: var(--ff-en); font-size: 24px; }
.wb-chart__states circle { fill: #f5f5f5; }
.wb-chart__states text { fill: #111; font-size: 13px; font-weight: 700; }
.wb-chart__area { font-family: var(--ff-en); font-size: 24px; }
.wb-chart__small { font-size: 14px; }
.wb-chart__label { font-size: 15px; font-weight: 700; }

.sales-branding { margin-top: 105px; }
.sales-branding__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 26px 16px;
  background: var(--c-white);
  color: var(--c-navy);
  text-align: center;
}
.sales-branding__small { font-size: 16px; line-height: 1.5; letter-spacing: 0.06em; }
.sales-branding__main { font-size: 24px; line-height: 1.4; letter-spacing: 0.06em; }

.connect-diagram {
  --box-w: 142px;
  --box-h: 37px;
  display: grid;
  grid-template-columns: 1fr 50px 1fr;
  justify-items: center;
  margin-top: 48px;
  text-align: center;
}
.connect-diagram__col { display: flex; flex-direction: column; align-items: center; width: 100%; }
.connect-diagram__box {
  display: grid;
  place-items: center;
  width: 100%;
  max-width: var(--box-w);
  height: var(--box-h);
  border: 1px solid var(--c-white);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.connect-diagram__en {
  margin-top: 16px;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 400;
}
.connect-diagram__times {
  position: relative;
  width: 18px;
  height: var(--box-h);
}
.connect-diagram__times::before,
.connect-diagram__times::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 24px;
  height: 1px;
  background: var(--c-white);
}
.connect-diagram__times::before { transform: translate(-50%, -50%) rotate(45deg); }
.connect-diagram__times::after { transform: translate(-50%, -50%) rotate(-45deg); }
/* 2つの列の中心から下へ伸び、中央で合流する線 */
.connect-diagram__bracket {
  grid-column: 1 / -1;
  position: relative;
  width: calc(50% + 25px);
  height: 44px;
  margin-top: 12px;
}
.connect-diagram__bracket::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 16px;
  border: 1px solid var(--c-white);
  border-top: 0;
}
.connect-diagram__bracket::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 16px;
  bottom: 0;
  border-left: 1px solid var(--c-white);
}
.connect-diagram__box--connect {
  grid-column: 1 / -1;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0;
}

.sales-branding__list {
  width: fit-content;
  margin: 48px auto 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.02em;
}
.sales-branding__list li {
  padding-left: 1.2em;
  text-indent: -1.2em;
}
.sales-branding__list li::before { content: "・"; }

@media (min-width: 1080px) {
  .brand-identity { padding-block: 77px 118px; }
  .bi-rule { width: 100%; margin-top: 75px; }
  .bi-item { padding-block: 39px 67px; }
  .bi-rule + .bi-item { padding-top: 39px; }
  .bi-item__num { font-size: 80px; }
  .bi-item__title { font-size: 70px; }
  .bi-item__photo { margin-top: 38px; aspect-ratio: 1000 / 580; }
  .bi-item__label { margin-top: 56px; font-size: 13px; }
  .bi-item__text { margin-top: 24px; font-size: 20px; line-height: 42px; letter-spacing: 0.02em; }

  .wellbeing {
    grid-template-columns: 552px minmax(0, 1fr);
    column-gap: 43px;
    align-items: center;
    padding-top: 104px;
  }
  .wellbeing__body { grid-column: 2; grid-row: 1; }
  .wellbeing__text { font-size: 18px; line-height: 34px; letter-spacing: 0.02em; }
  .wellbeing__body.prose > * + * { margin-top: 34px; }
  .wellbeing__chart { grid-column: 1; grid-row: 1; max-width: none; }

  .sales-branding { margin-top: 130px; }
  .sales-branding__title { padding: 22px 16px 24px; }
  .sales-branding__small { font-size: 18px; letter-spacing: 0.04em; }
  .sales-branding__main { font-size: 30px; letter-spacing: 0.04em; }
  .connect-diagram {
    --box-w: 232px;
    --box-h: 60px;
    grid-template-columns: 232px 82px 232px;
    justify-content: center;
    margin-top: 60px;
  }
  .connect-diagram__box { font-size: 22px; }
  .connect-diagram__en { margin-top: 11px; font-size: 18px; line-height: 21px; }
  .connect-diagram__times { width: 30px; }
  .connect-diagram__times::before,
  .connect-diagram__times::after { width: 36px; }
  .connect-diagram__bracket { width: 314px; height: 84px; margin-top: 16px; }
  .connect-diagram__bracket::before { height: 30px; }
  .connect-diagram__bracket::after { top: 30px; }
  .connect-diagram__box--connect { font-size: 30px; }
  .sales-branding__list { margin-top: 23px; font-size: 18px; line-height: 34px; letter-spacing: 0.04em; }
}

/* ---------- Company Profile ---------- */
.company {
  padding-block: 90px 80px;
  background: var(--c-navy-deep);
}
.company-table {
  margin-top: 62px;
  border-bottom: 1px solid var(--c-line);
}
.company-table__row {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  column-gap: 21px;
  align-items: center;
  padding-block: 17px;
  border-top: 1px solid var(--c-line);
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.company-table dt {
  font-weight: 700;
  letter-spacing: 0;
  text-align: justify;
  text-align-last: justify;
}
.company-table dd { margin: 0; }
@media (min-width: 1080px) {
  .company { padding-block: 95px 80px; }
  .company__inner {
    display: grid;
    grid-template-columns: 510px minmax(0, 490px);
    align-items: start;
  }
  .company-table { margin-top: 3px; }
  .company-table__row {
    grid-template-columns: 60px minmax(0, 1fr);
    column-gap: 32px;
    padding-block: 18px;
    font-size: 15px;
    line-height: 25px;
    letter-spacing: 0.02em;
  }
}

/* ==========================================================
   Privacy Policy（website-landing-page.html）
   PC: Figma「PC_PrivacyPolicy」（白地・紺文字） / SP: 他ページSPの共通ルールで構成
   ========================================================== */
.page-privacy main {
  background: var(--c-white);
  color: var(--c-navy);
}
.privacy { padding-block: 56px 96px; word-break: normal; } /* 規約文は文節改行より行の詰まりを優先 */
.privacy__inner { --content: 830px; }
.privacy__header { text-align: center; }
.privacy__title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
}
.privacy__subtitle {
  margin-top: 4px;
  font-size: 15px;
  line-height: 1.6;
}
.privacy__lead,
.privacy__section { font-size: 15px; line-height: 1.85; letter-spacing: 0.04em; }
.privacy__lead { margin-top: 40px; }
.privacy__section { margin-top: 40px; }
.privacy__section h2 {
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
}
.privacy__info > div { display: flex; }
.privacy__info dt { flex: none; }
.privacy__info dd { margin: 0; }
.privacy__list li {
  padding-left: 1em;
  text-indent: -1em;
}
.privacy__list li::before { content: "・"; }
.privacy__section > p + .privacy__list { margin-left: 1em; }
.privacy__address { margin-top: 1.85em; }

@media (min-width: 1080px) {
  .privacy { padding-block: 77px 120px; }
  .privacy__title { font-size: 26px; line-height: 30px; letter-spacing: 0.04em; }
  .privacy__subtitle { margin-top: 7px; font-size: 18px; line-height: 22px; }
  .privacy__lead { margin-top: 45px; }
  .privacy__lead,
  .privacy__section { font-size: 15px; line-height: 28px; letter-spacing: 0.02em; }
  .privacy__section { margin-top: 38px; }
  .privacy__section h2 { margin-bottom: 0; font-size: 16px; line-height: 28px; letter-spacing: 0.02em; }
  .privacy__address { margin-top: 28px; }
}

/* ==========================================================
   Top（index.html）
   ========================================================== */

/* 旧 .top ラッパーと同じ条件（flex縦積み＋はみ出し非表示）で動画領域を包む */
.hero-frame {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: hidden;
}

/* ---------- Hero ----------
   【変更禁止】動画の表示領域（.hero のサイズ・背景・動画・オーバーレイ）は
   旧 index.css の値をそのまま移植している。変更するのは上に重なる文字の配置のみ。 */
.hero {
  position: relative;
  min-height: clamp(700px, 90vh, 1040px);
  aspect-ratio: 16 / 9;
  display: grid;
  align-items: center;
  background-image: url("/public/WC-web-top-mov@2x.png");
  background-size: cover;
  background-position: center 30%;
  background-repeat: no-repeat;
  color: var(--c-white);
}
.hero .hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
@media (prefers-reduced-motion: reduce) {
  .hero .hero__video { display: none; }
}
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.25) 60%, rgba(0, 0, 0, 0.4) 100%);
  z-index: 0;
}
@media (min-width: 1600px) {
  .hero { min-height: 980px; background-position: center 28%; }
}
@media (max-width: 1024px) {
  .hero { min-height: clamp(640px, 88vh, 960px); }
}
@media (max-width: 480px) {
  .hero {
    align-items: start;
    /* 旧CSSは min-height:100svh に上余白 120px（旧ヘッダー64px＋56px）が加算されていたため同値にする */
    min-height: calc(100svh + 120px);
    aspect-ratio: auto;
    background-position: center 38%;
  }
}
/* ---- ここまで動画領域（旧CSSと同値） ---- */

.hero__inner {
  position: relative;
  z-index: 1;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  padding: 50px 16px 110px 40px;
}
.hero__title {
  font-size: var(--fs-hero-top);
  font-weight: 400;
  line-height: 1.07;
}
.hero__jp {
  margin-top: 32px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.85;
  letter-spacing: 0.07em;
  white-space: nowrap;
}
.hero__en {
  margin-top: auto;
  max-width: 290px;
  font-size: 13px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  opacity: 0.9;
}
.hero__scroll {
  position: absolute;
  right: 20px;
  bottom: 20px;
  z-index: 1;
  width: 40px;
  height: 40px;
  transition: transform 0.2s;
}
.hero__scroll svg { width: 100%; height: 100%; }
.hero__scroll circle { fill: var(--c-yellow); }
.hero__scroll path { fill: none; stroke: var(--c-navy); stroke-width: 1.5; }
.hero__scroll:hover { transform: translateY(3px); }

@media (min-width: 768px) {
  .hero__inner { justify-content: center; padding: 60px 64px; }
  .hero__en { margin-top: 32px; max-width: 420px; }
}
@media (min-width: 1080px) {
  .hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-content: center;
    column-gap: 40px;
    padding: 0 7.3vw;
  }
  .hero__title { grid-row: 1 / span 2; align-self: center; font-size: clamp(64px, 5.2vw, 100px); }
  .hero__jp {
    white-space: normal;
    grid-column: 2;
    align-self: end;
    margin-top: 0;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.95;
    letter-spacing: 0.02em;
  }
  .hero__en {
    grid-column: 2;
    max-width: 380px;
    margin-top: 16px;
    font-size: 15px;
    line-height: 1.8;
    letter-spacing: 0;
  }
  .hero__scroll { right: 20px; bottom: 10px; width: 51px; height: 51px; }
}

/* ---------- Intro band ---------- */
.intro {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 276px;
  padding: 40px var(--gutter);
  overflow: hidden;
  text-align: center;
}
.intro__bg { position: absolute; inset: 0; }
.intro__bg img { object-position: center 64%; }
.intro__inner { position: relative; }
.intro__lead { font-size: 13px; line-height: 1.7; letter-spacing: 0.1em; }
.intro__ja {
  margin-top: 6px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.1em;
}
.intro__en {
  margin-top: 12px;
  font-size: var(--fs-display);
  line-height: 1.12;
}
@media (min-width: 1080px) {
  .intro { min-height: 560px; }
  .intro__lead { font-size: 24px; line-height: 1.2; letter-spacing: 0.04em; }
  .intro__lead br { display: none; }
  .intro__ja { margin-top: 17px; font-size: 30px; letter-spacing: 0.04em; }
  .intro__en { margin-top: 18px; }
}

/* ---------- Our Business ---------- */
.business { padding-block: 90px 60px; overflow: hidden; }
.business .split { gap: 80px; }
.business__text { font-size: var(--fs-lead); line-height: 1.85; letter-spacing: 0.06em; }
@media (min-width: 1080px) {
  .business { padding-block: 95px 120px; }
  .business__text { line-height: 32px; letter-spacing: 0.02em; }
  .business__text.prose > * + * { margin-top: 32px; }
}

/* Business circle（1000×1000 基準。SPは画面より大きく表示して左右を切る） */
.circle-wrap {
  display: flex;
  justify-content: center;
  margin-top: 60px;
}
.bcircle {
  --k: 1.3; /* SPでは文字を相対的に大きく */
  container-type: inline-size;
  position: relative;
  flex: none;
  width: 174vw;
  max-width: 1000px;
  aspect-ratio: 1;
  margin: 0;
  border-radius: 50%;
  background: var(--c-navy-card);
  color: var(--c-navy);
  text-align: center;
}
.bcircle__core {
  position: absolute;
  left: 22.3%;
  top: 22.3%;
  width: 55.4%;
  aspect-ratio: 1;
  border: 0.5px solid var(--c-white);
  border-radius: 50%;
  background: var(--c-navy);
}
.bcircle__field {
  position: absolute;
  left: 0;
  right: 0;
  top: 6.4%;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--c-white);
}
.bcircle__field-ja { font-size: calc(1.6cqw * var(--k)); letter-spacing: 0.06em; line-height: 1.6; }
.bcircle__field-en { font-size: calc(2.6cqw * var(--k)); line-height: 1.3; }
.bcircle__center {
  position: absolute;
  left: 30%;
  right: 30%;
  top: 44%;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--c-white);
}
.bcircle__center-en { font-size: calc(1.5cqw * var(--k)); line-height: 1.4; }
.bcircle__center-ja {
  margin-top: 1.6cqw;
  font-size: calc(2.4cqw * var(--k));
  font-weight: 700;
  line-height: 1.75;
  letter-spacing: 0.06em;
}
.bcircle__item {
  position: absolute;
  width: 26.2%;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 1.2cqw;
  border-radius: 50%;
  background: var(--c-white);
}
.bcircle__item--tl { left: 17.6%; top: 12.8%; }
.bcircle__item--tr { left: 56.3%; top: 12.8%; }
.bcircle__item--ml { left: 6%; top: 44%; }
.bcircle__item--mr { left: 68%; top: 44%; }
.bcircle__item--b { left: 37%; top: 66.2%; }
.bcircle__en { font-size: calc(1.2cqw * var(--k)); line-height: 1.3; }
.bcircle__title {
  margin-top: 0.8cqw;
  font-size: calc(2.2cqw * var(--k));
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.04em;
}
.bcircle__desc {
  margin-top: 1cqw;
  font-size: calc(1.3cqw * var(--k));
  line-height: 1.55;
}
/* SP：はみ出す構成は維持しつつ、左右の白い円の文字が読めるよう全体を縮小し、左右の円を中央寄りに */
@media (max-width: 767px) {
  .bcircle { width: 145vw; }
  .bcircle__item--ml { left: 6.5%; }
  .bcircle__item--mr { left: 67.3%; }
  /* 中央の見出しは縮小前とほぼ同じ実寸を保つ（字間のみ詰めて左右の円との接触を回避） */
  .bcircle__center-ja { font-size: calc(2.4cqw * 1.46); letter-spacing: 0.02em; }
}
@media (min-width: 768px) {
  .bcircle { --k: 1.1; width: 120vw; }
}
@media (min-width: 1080px) {
  .circle-wrap { margin-top: 97px; }
  .bcircle { --k: 1; width: 1000px; }
}

/* ---------- Advantage ---------- */
.advantage { background: var(--c-navy-card); }
.advantage__body {
  width: min(100% - var(--gutter) * 2, var(--content));
  margin-inline: auto;
  padding-block: 90px 80px;
}
.advantage__text {
  margin-top: 80px;
  font-size: var(--fs-lead);
  line-height: 1.85;
  letter-spacing: 0.06em;
}
.advantage__btn { margin-top: 48px; }
.advantage__photo { aspect-ratio: 375 / 400; }
@media (min-width: 1080px) {
  .advantage {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 800px;
  }
  .advantage__body {
    width: auto;
    margin: 0;
    padding: 75px 40px 80px max(var(--gutter), calc(50vw - var(--content) / 2));
  }
  .advantage__text {
    max-width: 394px;
    margin-top: 124px;
    line-height: 32px;
    letter-spacing: 0.02em;
  }
  .advantage__text.prose > * + * { margin-top: 32px; }
  .advantage__btn { margin-top: 48px; }
  .advantage__photo { aspect-ratio: auto; }
}

/* ---------- Client ---------- */
.client {
  padding-block: 64px 56px;
  background: var(--c-white);
  color: var(--c-navy);
  text-align: center;
}
.client__title {
  font-size: var(--fs-section);
  font-weight: 400;
  line-height: 1.1;
}
.client__logos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 36px 24px;
  margin-top: 48px;
}
.client__logos li { display: grid; place-items: center; }
.client__logos img { width: auto; max-width: 100%; max-height: 52px; }
/* 個別調整：縦長・横長で上限サイズに縮められ小さく見える2社のみ拡大表示。
   transform はレイアウトに影響しないため、行高・列幅・他社ロゴの位置は不変 */
.client__logos .client__logo--toda { transform: scale(1.5); }
.client__logos .client__logo--mitsui { transform: scale(1.15); }
/* 帝人：赤・太字・横長で他社より強く見えるため、視覚バランス上わずかに縮小 */
.client__logos .client__logo--teijin { transform: scale(0.92); }
@media (min-width: 1080px) {
  .client__logos .client__logo--mitsui { transform: scale(1.2); }
}
.client__more {
  margin-top: 44px;
  font-size: 16px;
  color: #555;
}
@media (min-width: 768px) {
  .client__logos { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 1080px) {
  .client { padding-block: 68px 60px; }
  .client__logos { gap: 44px 56px; margin-top: 40px; }
  .client__logos img { max-height: 64px; }
  .client__more { margin-top: 36px; font-size: 18px; }
}

/* ---------- Boost Your Business ---------- */
.boost { padding-top: 90px; }
.boost__head { gap: 64px; }
.boost__text { font-size: var(--fs-lead); line-height: 1.85; letter-spacing: 0.06em; }
.boost__rule { margin-top: 56px; }

.pill-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 167px;
  height: 40px;
  border: 1px solid var(--c-white);
  border-radius: var(--radius-pill);
  font-family: var(--ff-en);
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
}
.pill-label--yellow { border-color: var(--c-yellow); color: var(--c-yellow); }

.issue { padding-block: 30px 0; }
.issue__list {
  display: grid;
  gap: 44px;
  margin-top: 60px;
  padding-left: 18px;
}
.issue__item {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.08em;
}
.issue__item img { flex: none; width: 30px; height: auto; }
/* 課題 → 解決 の矢印 */
.issue::after {
  content: "";
  display: block;
  width: 12px;
  height: 70px;
  margin: 44px 0 0 52px;
  background: url("/assets/icons/arrow-1.svg") no-repeat left bottom / 12px 70px;
}

.solution {
  padding-block: 36px 80px;
  background: var(--c-navy-card);
}
.solution__flow {
  --gap: 32px;
  --arrow-x: 43%;
  position: relative;
  display: grid;
  gap: var(--gap);
  margin-top: 26px;
}
.solution-card {
  position: relative;
  padding: 24px 22px 20px;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-tag);
}
.solution-card--product { width: 86.6%; }
.solution-card__title { display: flex; flex-direction: column; font-weight: 400; }
.solution-card__en {
  font-size: 28px;
  line-height: 1.15;
}
.solution-card__ja {
  margin-top: 6px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.12em;
}
.solution-card__desc {
  margin-top: 18px;
  font-size: 13px;
  line-height: 1.7;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.75);
}
/* 前のカードからの短い矢印 */
.solution-card + .solution-card::before {
  content: "";
  position: absolute;
  left: var(--arrow-x);
  top: calc(-1 * var(--gap) - 1px);
  width: 9px;
  height: calc(var(--gap) + 1px);
  background: url("/assets/icons/arrow-2.svg") no-repeat left bottom / 9px 100%;
}
/* Brand Building → Marketing & Sales の長い矢印（Product Development の右側） */
.solution-card--product::after {
  content: "";
  position: absolute;
  left: 107.4%; /* = 93% ÷ 86.6%（カード群の93%の位置） */
  top: calc(-1 * var(--gap) - 1px);
  bottom: calc(-1 * var(--gap) - 1px);
  width: 10px;
  background:
    linear-gradient(var(--c-yellow), var(--c-yellow)) no-repeat 0.5px 0 / 1px calc(100% - 1px),
    url("/assets/icons/arrow-3.svg") no-repeat left bottom / 10px 12px;
}

@media (min-width: 1080px) {
  .boost { padding-top: 110px; }
  .boost__head { row-gap: 0; }
  .boost__text { padding-top: 13px; line-height: 32px; letter-spacing: 0.02em; }
  .boost__rule { margin-top: 32px; }
  .pill-label { width: 150px; height: 34px; }
  .issue { position: relative; padding-top: 66px; }
  .issue__list {
    grid-template-columns: 1fr 1fr;
    column-gap: 60px;
    row-gap: 40px;
    margin-top: 41px;
    padding-left: 10px;
  }
  .issue__item { align-items: flex-start; gap: 20px; font-size: 18px; line-height: 1.7; letter-spacing: 0.02em; }
  .issue__item img { width: 28px; margin-top: 2px; }
  .issue::after { margin: 60px 0 0 75px; }

  .solution { padding-block: 121px 78px; }
  .solution__flow { --gap: 40px; --arrow-x: 23.8%; margin-top: 37px; }
  .solution-card {
    display: grid;
    grid-template-columns: 565px minmax(0, 1fr);
    align-items: center;
    min-height: 150px;
    padding: 20px 40px 20px 30px;
  }
  .solution-card--product {
    width: 49%;
    display: block;
    min-height: 270px;
    padding: 27px 30px;
  }
  .solution-card--connect::before { left: 49.6%; }
  .solution-card__en { font-size: 44px; line-height: 1.2; }
  .solution-card__ja { margin-top: 4px; font-size: 16px; letter-spacing: 0.02em; }
  .solution-card__desc { margin-top: 0; font-size: 14px; line-height: 25px; letter-spacing: 0.02em; }
  .solution-card--product .solution-card__desc { margin-top: 36px; }
  /* 長い矢印：カード群の左端から72.2%の位置 */
  .solution-card--product::after { left: 147.3%; } /* = 72.2% ÷ 49% */
}