@charset "utf-8";
/* ==========================================================================
   M&A FORCE  TOP
   - Navy #12314E / Deep navy #0C2035 / Gold #B08D57
   - 見出し: Noto Serif JP / 本文: Noto Sans JP
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 変数
   -------------------------------------------------------------------------- */
:root {
  --navy: #12314E;
  --navy-deep: #0C2035;
  --navy-mid: #1B4A7A;
  --gold: #B08D57;
  --gold-light: #C9A46B;
  --lightblue: #E9F0F7;
  --pale: #F6F7F9;
  --ink: #1A2A3A;
  --ink-sub: #55636F;
  --white: #FFFFFF;
  --line: #DCE3EA;

  --serif: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  --sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --garamond: "Cormorant Garamond", "Noto Serif JP", serif;

  --inner: 1200px;
  --header-h: 92px;
  --header-h-sm: 68px;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* --------------------------------------------------------------------------
   2. リセット・ベース
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-h);
}

body {
  margin: 0;
  font-family: var(--sans);
  font-size: 1.6rem;
  line-height: 1.9;
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* 本文は通常の日本語折り返し（keep-all + anywhere だと「M&A」が行末で分断される） */
  word-break: normal;
  line-break: strict;
  overflow-wrap: break-word;
}

/* 短い見出し・ラベルだけ文節で折る（泣き別れ防止）
   長文に keep-all を付けると折り返せず横に溢れるため、対象は短いものに限る。
   overflow-wrap: anywhere は「行に収まらないときだけ」効く保険。 */
.p-mv__title,
.c-heading,
.p-network__list-title,
.p-business__ribbon,
.p-talk__movies-title,
.p-talk__block-title,
.l-header__menu a,
.l-footer__col-title,
.l-footer__name {
  word-break: keep-all;
  overflow-wrap: anywhere;
}

body.is-nav-open { overflow: hidden; }

h1, h2, h3, h4, p, dl, dd, dt, figure, address { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
img { max-width: 100%; height: auto; vertical-align: middle; }
address { font-style: normal; }

a {
  color: inherit;
  text-decoration: none;
  transition: color .3s var(--ease), opacity .3s var(--ease), background-color .3s var(--ease), border-color .3s var(--ease);
}

button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

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

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

/* --------------------------------------------------------------------------
   3. レイアウト共通
   -------------------------------------------------------------------------- */
.l-inner {
  width: 100%;
  max-width: var(--inner);
  margin-inline: auto;
  padding-inline: 3rem;
}

.c-skip {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  padding: 1rem 2rem;
  background: var(--navy);
  color: var(--white);
}
.c-skip:focus { left: 0; }

/* --------------------------------------------------------------------------
   4. 共通コンポーネント
   -------------------------------------------------------------------------- */

/* 英字ラベル */
.c-label {
  margin-bottom: 2.2rem;
  font-family: var(--garamond);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: .18em;
  color: var(--gold);
  line-height: 1;
}
.c-label::after {
  content: "";
  display: block;
  width: 4.4rem;
  height: 1px;
  margin-top: 1.2rem;
  background: var(--gold);
}
.c-sec-head--center .c-label { display: inline-block; }
.c-sec-head--center .c-label::after { margin-inline: auto; }
.c-label--light { color: var(--gold-light); }
.c-label--light::after { background: var(--gold-light); }

/* 見出し */
.c-heading {
  font-family: var(--serif);
  font-size: clamp(2.8rem, 3.6vw, 4.4rem);
  font-weight: 500;
  line-height: 1.5;
  color: var(--navy);
}
.c-heading--wide { letter-spacing: .16em; }
.c-heading--light { color: var(--white); }

/* セクション見出しブロック */
.c-sec-head { margin-bottom: 5.6rem; }
.c-sec-head--center { text-align: center; }
.c-sec-head--between {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 3rem;
}

/* ボタン */
.c-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  min-height: 5.2rem;
  padding: 1.2rem 3.2rem;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: .06em;
  text-align: center;
  line-height: 1.5;
}
.c-btn--sm { min-height: 4.4rem; padding: 1rem 2rem; font-size: 1.4rem; }
.c-btn--lg { min-height: 6.6rem; min-width: 27rem; padding: 1.4rem 3.6rem; font-size: 1.6rem; }

.c-btn--gold { background: var(--gold); color: var(--white); }
.c-btn--gold:hover { background: #9d7c4b; }

.c-btn--navy { background: var(--navy); color: var(--white); }
.c-btn--navy:hover { background: var(--navy-deep); }

.c-btn--outline {
  background: rgba(255, 255, 255, .92);
  color: var(--navy);
  border: 1px solid var(--navy);
}
.c-btn--outline:hover { background: var(--navy); color: var(--white); }

.c-btn--outline-navy {
  background: transparent;
  color: var(--navy);
  border: 1px solid var(--navy);
}
.c-btn--outline-navy:hover { background: var(--navy); color: var(--white); }

.c-btn--outline-white {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255, 255, 255, .5);
}
.c-btn--outline-white:hover { background: var(--white); color: var(--navy); border-color: var(--white); }

.c-btn--outline-gold {
  background: rgba(255, 255, 255, .86);
  color: var(--gold);
  border: 1px solid var(--gold);
}
.c-btn--outline-gold:hover { background: var(--gold); color: var(--white); }

.c-btn__arrow {
  position: relative;
  width: 2.4rem;
  height: 1px;
  background: currentColor;
  flex: none;
  transition: transform .3s var(--ease);
}
.c-btn__arrow::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: .7rem;
  height: .7rem;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}
.c-btn:hover .c-btn__arrow { transform: translateX(4px); }

.c-btn__icon {
  width: 2.2rem;
  height: 2.2rem;
  flex: none;
  background: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.c-btn__icon--user {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm0 2c-3.9 0-7 2-7 4.5V20h14v-1.5C16 16 12.9 14 9 14Zm8.5-2a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm0 2c-.7 0-1.4.1-2 .3 1.5 1 2.5 2.4 2.5 4.2V20H22v-1.5c0-2.2-2-4.5-4.5-4.5Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm0 2c-3.9 0-7 2-7 4.5V20h14v-1.5C16 16 12.9 14 9 14Zm8.5-2a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm0 2c-.7 0-1.4.1-2 .3 1.5 1 2.5 2.4 2.5 4.2V20H22v-1.5c0-2.2-2-4.5-4.5-4.5Z'/%3E%3C/svg%3E");
}
.c-btn__icon--mail {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' d='M3 6h18v12H3z'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' d='m3 6 9 7 9-7'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' d='M3 6h18v12H3z'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' d='m3 6 9 7 9-7'/%3E%3C/svg%3E");
}

/* View More リンク */
.c-more {
  display: inline-flex;
  align-items: center;
  gap: 1.4rem;
  padding-bottom: .8rem;
  font-family: var(--garamond);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: .1em;
  color: var(--navy);
  border-bottom: 1px solid currentColor;
}
.c-more__arrow {
  position: relative;
  width: 2.6rem;
  height: 1px;
  background: currentColor;
  transition: transform .3s var(--ease);
}
.c-more__arrow::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: .6rem;
  height: .6rem;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}
.c-more:hover .c-more__arrow { transform: translateX(5px); }
.c-more--light { color: var(--white); }
.c-more--gold { color: var(--gold-light); }

/* ページトップボタンは 2026-08-18 に撤去（右下は追従CTAへ一本化）。
   マークアップは footer-newtop.php から、制御は script.js から削除済み。 */

/* --------------------------------------------------------------------------
   5. ヘッダー
   -------------------------------------------------------------------------- */
.l-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  background: var(--white);
  transition: box-shadow .3s var(--ease);
}
.l-header.is-scrolled { box-shadow: 0 2px 14px rgba(12, 32, 53, .1); }

.l-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 3rem;
  height: var(--header-h);
  padding-inline: 3rem;
  transition: height .3s var(--ease);
}
.l-header.is-scrolled .l-header__inner { height: 76px; }

.l-header__logo { flex: none; display: block; }
.l-header__logo img { width: auto; height: 5.2rem; transition: height .3s var(--ease); }
.l-header.is-scrolled .l-header__logo img { height: 4.4rem; }

.l-header__nav {
  display: flex;
  align-items: center;
  gap: 3.2rem;
  margin-left: auto;
}

.l-header__menu {
  display: flex;
  align-items: center;
  gap: 2.6rem;
}
.l-header__menu a {
  position: relative;
  display: block;
  padding: .6rem 0;
  font-size: 1.45rem;
  font-weight: 500;
  letter-spacing: .04em;
  white-space: nowrap;
  color: var(--ink);
}
.l-header__menu a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s var(--ease);
}
.l-header__menu a:hover { color: var(--gold); }
.l-header__menu a:hover::after { transform: scaleX(1); }

.l-header__cta { display: flex; gap: .8rem; flex: none; }

.l-header__toggle {
  display: none;
  position: relative;
  z-index: 110;
  width: 4.6rem;
  height: 4.6rem;
  flex: none;
}
.l-header__toggle span {
  position: absolute;
  left: 50%;
  width: 2.6rem;
  height: 1.5px;
  background: var(--navy);
  transform: translateX(-50%);
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}
.l-header__toggle span:nth-child(1) { top: 1.5rem; }
.l-header__toggle span:nth-child(2) { top: 2.25rem; }
.l-header__toggle span:nth-child(3) { top: 3rem; }
.l-header__toggle.is-active span:nth-child(1) { top: 2.25rem; transform: translateX(-50%) rotate(45deg); }
.l-header__toggle.is-active span:nth-child(2) { opacity: 0; }
.l-header__toggle.is-active span:nth-child(3) { top: 2.25rem; transform: translateX(-50%) rotate(-45deg); }

/* --------------------------------------------------------------------------
   6. メインビジュアル
   -------------------------------------------------------------------------- */
.p-mv {
  position: relative;
  display: flex;
  align-items: center;
  min-height: min(88vh, 78rem);
  padding-top: var(--header-h);
  overflow: hidden;
  background: var(--white);
}

.p-mv__media {
  position: absolute;
  inset: 0 0 0 auto;
  width: 66%;
  z-index: 1;
}
.p-mv__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; }
.p-mv__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, #fff 0%, rgba(255, 255, 255, .96) 22%, rgba(255, 255, 255, .5) 44%, rgba(255, 255, 255, 0) 66%);
}

.p-mv__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--inner);
  margin-inline: auto;
  padding: 6rem 3rem;
}

.p-mv__label {
  margin-bottom: 1.8rem;
  font-family: var(--garamond);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: .28em;
  color: var(--gold);
}

.p-mv__lead {
  margin-bottom: 1.6rem;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--ink-sub);
}

.p-mv__title {
  font-family: var(--serif);
  font-size: clamp(3.4rem, 4.6vw, 6rem);
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: .04em;
  color: var(--navy);
}

.p-mv__text {
  margin-top: 2.8rem;
  font-size: 1.55rem;
  line-height: 2;
  color: var(--ink);
}

.p-mv__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 1.6rem;
  margin-top: 4rem;
}

.p-mv__scroll {
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 3;
  transform: translateX(-50%);
  padding-bottom: 7rem;
  font-family: var(--garamond);
  font-size: 1.2rem;
  font-weight: 600;
  letter-spacing: .24em;
  color: var(--navy);
}
.p-mv__scroll::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 1px;
  height: 6rem;
  background: var(--navy);
  transform-origin: bottom;
  animation: scrollLine 2.2s var(--ease) infinite;
}
@keyframes scrollLine {
  0% { transform: scaleY(0); transform-origin: top; }
  45% { transform: scaleY(1); transform-origin: top; }
  55% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

/* --------------------------------------------------------------------------
   7. 拠点紹介（Network）
   -------------------------------------------------------------------------- */
.p-network {
  position: relative;
  padding: 11rem 0;
  background: linear-gradient(148deg, var(--navy-mid) 0%, #16406b 32%, var(--navy) 64%, var(--navy-deep) 100%);
  overflow: hidden;
}

.p-network__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr);
  align-items: center;
  gap: 4rem;
  width: 100%;
  max-width: var(--inner);
  margin-inline: auto;
  padding-inline: 3rem;
}

.p-network__lead {
  margin: 3rem 0 2rem;
  font-size: 1.9rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--white);
}

.p-network__text {
  font-size: 1.5rem;
  line-height: 2.1;
  color: rgba(255, 255, 255, .84);
}

.p-network__list { margin-top: 3.6rem; }
.p-network__list-title {
  padding-left: 1.4rem;
  border-left: 2px solid var(--gold);
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--white);
}
.p-network__cities {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem 0;
  margin-top: 1.6rem;
}
.p-network__cities li { display: flex; align-items: center; }
.p-network__cities li:not(:last-child)::after {
  content: "／";
  margin-inline: .6rem;
  color: rgba(255, 255, 255, .4);
  font-size: 1.4rem;
}
.p-network__cities a {
  font-size: 1.7rem;
  letter-spacing: .1em;
  color: var(--white);
}
.p-network__cities a:hover { color: var(--gold-light); }

.p-network__body .c-more { margin-top: 3.6rem; }

/* 地図 */
.p-network__map {
  position: relative;
  justify-self: end;
  width: 100%;
  max-width: 60rem;
}
/* 背景を透明化した地図（線・拠点の光のみ）をセクション背景の上に重ねる */
.p-network__map-img { width: 100%; }

/* 拠点は7つとも地図全体に重なる箱なので、板そのものはクリックを透過させる。
   透過しないと、DOM最後の拠点（福岡）の板が他6拠点のリンクを覆って
   クリックできなくなる。実際に反応するのはドットとラベルだけにする。 */
.p-network__pins { position: absolute; inset: 0; pointer-events: none; }
.p-network__pin { position: absolute; inset: 0; pointer-events: none; }
.p-network__link { display: block; position: absolute; inset: 0; pointer-events: none; }
/* リンク自体は地図全面サイズなので、既定のフォーカス枠が地図を囲んでしまう。
   代わりに下でラベルとドットへフォーカス表示を出す。 */
.p-network__link:focus-visible { outline: none; }

/* 光るドット（画像側の発光に重ねる）＝ここもリンクの当たり判定にする */
.p-network__dot {
  position: absolute;
  left: var(--pin-x);
  top: var(--pin-y);
  width: 1rem;
  height: 1rem;
  margin: -.5rem 0 0 -.5rem;
  border-radius: 50%;
  background: #FFD79A;
  box-shadow: 0 0 0 3px rgba(255, 199, 122, .35), 0 0 14px 4px rgba(255, 190, 100, .55);
  pointer-events: auto;
  cursor: pointer;
  transition: background-color .3s var(--ease), box-shadow .3s var(--ease);
}
/* 押せる範囲は発光リングぶんだけ広げる。名古屋と大阪は地図上で約18px しか
   離れておらず、これ以上広げると隣の拠点のクリックを奪ってしまう。 */
.p-network__dot::before {
  content: "";
  position: absolute;
  inset: -.35rem;
  border-radius: 50%;
}
.p-network__dot::after {
  content: "";
  position: absolute;
  inset: -.5rem;
  border-radius: 50%;
  border: 1px solid rgba(255, 205, 140, .8);
  animation: pinPulse 2.6s ease-out infinite;
  pointer-events: none;
}
@keyframes pinPulse {
  0% { transform: scale(.6); opacity: .9; }
  100% { transform: scale(2.6); opacity: 0; }
}

/* 拠点ラベル（クリックで下層の該当拠点へ） */
.p-network__label {
  position: absolute;
  left: var(--label-x);
  top: var(--label-y);
  transform: translateY(-50%);
  padding: .7rem 1.5rem;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: .12em;
  white-space: nowrap;
  color: var(--white);
  background: rgba(12, 32, 53, .78);
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 3px;
  backdrop-filter: blur(2px);
  pointer-events: auto;
  cursor: pointer;
  transition: background-color .3s var(--ease), border-color .3s var(--ease);
}
.p-network__link:hover .p-network__label {
  background: var(--gold);
  border-color: var(--gold);
}
.p-network__link:hover .p-network__dot {
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255, 214, 150, .5), 0 0 20px 7px rgba(255, 190, 100, .7);
}
/* キーボード操作時にどの拠点を選んでいるか分かるように */
.p-network__link:focus-visible .p-network__label {
  background: var(--gold);
  border-color: var(--gold);
  outline: 2px solid var(--white);
  outline-offset: 2px;
}
.p-network__link:focus-visible .p-network__dot {
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255, 214, 150, .5), 0 0 20px 7px rgba(255, 190, 100, .7);
}

/* --------------------------------------------------------------------------
   8. 私たちの事業（Our Business）
   -------------------------------------------------------------------------- */
.p-business { padding: 11rem 0; background: var(--white); }

.p-business__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4.4rem 3.6rem;
}

/* 本文の行数が違ってもリンク位置を揃える */
.p-business__item {
  display: flex;
  flex-direction: column;
}
.p-business__item .c-more { align-self: flex-start; margin-top: auto; }

.p-business__media {
  position: relative;
  margin-bottom: 3.2rem;
  overflow: hidden;
}
.p-business__media img {
  width: 100%;
  /* 画像は浅めに。帯が写真の下部をしっかり覆う比率 */
  aspect-ratio: 62 / 34;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.p-business__item:hover .p-business__media img { transform: scale(1.04); }

/* 斜めカットの濃紺帯（写真の下端を覆う） */
.p-business__ribbon {
  position: absolute;
  left: -1px;
  right: -1px;
  bottom: -1px;
  padding: 1.8rem 2rem;
  font-family: var(--serif);
  font-size: 1.9rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-align: center;
  color: var(--white);
  background: rgba(18, 49, 78, .86);
  clip-path: polygon(2.6rem 0, 100% 0, calc(100% - 2.6rem) 100%, 0 100%);
}

.p-business__text {
  margin-bottom: 2.6rem;
  font-size: 1.5rem;
  line-height: 2.05;
}

/* --------------------------------------------------------------------------
   10. ご支援事例（Works）
   -------------------------------------------------------------------------- */
.p-works {
  padding: 11rem 0 9rem;
  background: linear-gradient(160deg, var(--navy) 0%, #143A5E 45%, var(--navy-deep) 100%);
}

.p-works__lead {
  margin-top: 2.4rem;
  font-size: 1.6rem;
  color: rgba(255, 255, 255, .86);
}

.p-works__slider { position: relative; }

.p-works__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 3 * 2.6rem) / 4);
  gap: 2.6rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 1rem;
  scrollbar-width: none;
}
.p-works__track::-webkit-scrollbar { display: none; }

.p-works__item { scroll-snap-align: start; }

.p-works__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--white);
}

.p-works__media { position: relative; overflow: hidden; }
.p-works__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.p-works__card:hover .p-works__media img { transform: scale(1.05); }

.p-works__badge {
  position: absolute;
  left: 0;
  top: 0;
  padding: .6rem 1.6rem;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--white);
  background: var(--gold);
}

.p-works__play {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 5.6rem;
  height: 5.6rem;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
}
.p-works__play::after {
  content: "";
  position: absolute;
  left: 54%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: .9rem 0 .9rem 1.5rem;
  border-color: transparent transparent transparent var(--navy);
}

.p-works__title {
  margin: 2.2rem 2.2rem 1.8rem;
  font-family: var(--serif);
  font-size: 1.65rem;
  font-weight: 500;
  line-height: 1.7;
  color: var(--navy);
}

.p-works__meta {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem 1.4rem;
  margin: auto 2.2rem 2.2rem;
  padding-top: 1.6rem;
  border-top: 1px solid var(--line);
  font-size: 1.25rem;
  color: var(--ink-sub);
}
.p-works__meta > div { display: flex; align-items: center; gap: .4rem; }
.p-works__meta dt::after { content: "："; }
.p-works__meta dd { margin: 0; }

.p-works__dots {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 4rem;
}
.p-works__dot {
  width: 3.4rem;
  height: 3px;
  background: rgba(255, 255, 255, .32);
  transition: background-color .3s var(--ease);
}
.p-works__dot.is-active { background: var(--gold-light); }

/* --------------------------------------------------------------------------
   11. 特別対談・インタビュー動画（Special Talk）
   🔴 2026-08-20 クライアント指摘「白背景に単調に続く」への対応。
      ・記事入口は2件（3件から減った）＝1枚を大きく見せ、抜粋・通し番号・金の上辺で密度を上げる
      ・動画ブロックは濃紺の面にして、明→暗で節目を作る（動画は暗い面のほうが締まる）
      ・動画は3本。最新回（第二回）を上段いっぱいのleadにして、第一回part1/2を下段2カラムに置く
   -------------------------------------------------------------------------- */
.p-talk { padding: 11rem 0; background: var(--pale); }

.p-talk__lead {
  margin-top: 2.6rem;
  font-size: 1.55rem;
  line-height: 2;
  color: var(--ink-sub);
}

/* ブロック小見出し（対談レポート／特別対談動画で共通の組み） */
.p-talk__block { margin-top: 7rem; }
.p-talk__block-title,
.p-talk__movies-title {
  margin-bottom: 4rem;
  font-family: var(--serif);
  font-size: 2.4rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-align: center;
  color: var(--navy);
}
.p-talk__block-en {
  display: block;
  margin-bottom: .9rem;
  font-family: var(--garamond);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: .24em;
  color: var(--gold);
}
.p-talk__block-title::after,
.p-talk__movies-title::after {
  content: "";
  display: block;
  width: 3.6rem;
  height: 1px;
  margin: 1.6rem auto 0;
  background: var(--gold);
}

.p-talk__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3.6rem;
}
/* 記事入口が2件のときは1枚を大きく見せる */
.p-talk__list--duo { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4.4rem; }

.p-talk__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding-bottom: 2.8rem;
  background: var(--white);
}
.p-talk__list--duo .p-talk__card {
  padding-bottom: 0;
  border: 1px solid var(--line);
  border-top: 3px solid var(--gold);
  transition: box-shadow .4s var(--ease), transform .4s var(--ease);
}
.p-talk__list--duo .p-talk__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 1.4rem 3.6rem rgba(18, 49, 78, .12);
}

.p-talk__media { position: relative; overflow: hidden; }
.p-talk__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.p-talk__list--duo .p-talk__media img { aspect-ratio: 16 / 9; }
.p-talk__card:hover .p-talk__media img { transform: scale(1.05); }

.p-talk__badge {
  position: absolute;
  left: 0;
  top: 0;
  padding: .6rem 1.6rem;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--white);
  background: var(--gold);
}

/* 通し番号（画像の右下・濃紺のプレート） */
.p-talk__no {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: baseline;
  gap: .8rem;
  padding: .8rem 1.6rem;
  font-family: var(--garamond);
  font-size: 2.6rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .04em;
  color: var(--white);
  background: rgba(12, 32, 53, .78);
}
.p-talk__no span {
  font-family: var(--sans);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: .16em;
  color: var(--gold-light);
}

.p-talk__card-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 2.8rem 2.8rem 3rem;
}
.p-talk__title {
  margin: 2.4rem 2.4rem 2rem;
  font-family: var(--serif);
  font-size: 1.7rem;
  font-weight: 500;
  line-height: 1.7;
  color: var(--navy);
}
.p-talk__card-body .p-talk__title { margin: 0 0 1.6rem; font-size: 2rem; }
.p-talk__excerpt {
  margin-bottom: 2.6rem;
  font-size: 1.45rem;
  line-height: 1.95;
  color: var(--ink-sub);
}
.p-talk__card .c-more { align-self: flex-start; margin: auto 2.4rem 0; }
.p-talk__card-body .c-more { margin: auto 0 0; }

/* 動画（濃紺の面で節目を作る） */
.p-talk__movies {
  margin-top: 7.6rem;
  padding: 6rem 5rem;
  border-top: 3px solid var(--gold);
  background: linear-gradient(155deg, var(--navy) 0%, var(--navy-deep) 100%);
}
.p-talk__movies-title { color: var(--white); }

.p-talk__movie-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3.6rem 2.8rem;
}

.p-talk__frame {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--navy-deep);
  box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, .28);
}
.p-talk__frame iframe,
.p-talk__frame video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.p-talk__frame video { display: block; background: var(--navy-deep); }

/* 3本を同じ大きさで横並びにする（2026-09-01・先方指示）。
   最新回だけ大きくすると下段が2本になり「まだ下に続きがある」ように見えるため、
   サイズによる序列付けはやめた。最新回かどうかは「第二回特別対談」のラベルで分かるので、
   data/talk-movies.php の 'lead' => true は**TOPの見た目には効かない**（一覧側の並び順のみ）。
   🔴 枠線などで lead を目立たせるのは、先方指示の「3本を同じ大きさで」に反するので足さないこと。 */

.p-talk__movie-cap { margin-top: 2rem; }
.p-talk__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .8rem 1rem;
  margin-bottom: 1.2rem;
}
.p-talk__round {
  display: inline-block;
  padding: .2rem 1rem;
  font-size: 1.4rem;
  letter-spacing: .08em;
  color: var(--gold-light);
  border: 1px solid rgba(201, 164, 107, .55);
}
.p-talk__part {
  display: inline-block;
  padding: .2rem 1rem;
  font-family: var(--garamond);
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: .1em;
  color: var(--white);
  background: rgba(255, 255, 255, .16);
}
.p-talk__movie-title {
  font-family: var(--serif);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.7;
  color: var(--white);
}
.p-talk__movie-sub {
  margin-top: .8rem;
  font-size: 1.45rem;
  line-height: 1.9;
  color: rgba(255, 255, 255, .74);
}

.p-talk__foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.8rem 2.4rem;
  margin-top: 5rem;
  text-align: center;
}

/* --------------------------------------------------------------------------
   12. コラム一覧（Column）
   -------------------------------------------------------------------------- */
.p-column { padding: 11rem 0; background: var(--white); }

.p-column__lead {
  margin-top: 2.4rem;
  max-width: 62rem;
  font-size: 1.5rem;
  line-height: 2;
  color: var(--ink-sub);
}

.p-column__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3.6rem;
}

.p-column__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--white);
  box-shadow: 0 2px 18px rgba(12, 32, 53, .07);
}
.p-column__media { overflow: hidden; }
.p-column__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.p-column__card:hover .p-column__media img { transform: scale(1.05); }

.p-column__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 2.6rem 2.6rem 3rem;
}

.p-column__meta {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  margin-bottom: 1.6rem;
  font-size: 1.3rem;
  color: var(--ink-sub);
}
.p-column__cat {
  padding: .4rem 1.2rem;
  font-size: 1.25rem;
  letter-spacing: .06em;
  color: var(--white);
  background: var(--gold);
}

.p-column__title {
  margin-bottom: 2.4rem;
  font-size: 1.65rem;
  font-weight: 500;
  line-height: 1.75;
  color: var(--navy);
}
.p-column__body .c-more { align-self: flex-start; margin-top: auto; }

/* 資料ダウンロード導線 */
.p-column__bnr { margin-top: 7rem; }
.p-column__bnr-link {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.6rem 3.4rem;
  padding: 4rem 4rem;
  background: var(--lightblue);
  border-top: 2px solid var(--gold);
  text-align: center;
}
.p-column__bnr-label {
  font-family: var(--garamond);
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: .18em;
  color: var(--gold);
}
.p-column__bnr-title {
  font-family: var(--serif);
  font-size: clamp(1.8rem, 2.2vw, 2.3rem);
  font-weight: 500;
  letter-spacing: .06em;
  color: var(--navy);
}

/* --------------------------------------------------------------------------
   13. お問い合わせ（Contact）
   -------------------------------------------------------------------------- */
.p-contact {
  position: relative;
  padding: 11rem 0;
  overflow: hidden;
  background: var(--lightblue);
}
.p-contact__bg { position: absolute; inset: 0; z-index: 0; }
.p-contact__bg img { width: 100%; height: 100%; object-fit: cover; }
.p-contact__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  /* 街並みを淡く沈めて、明るく風通しのよい面をつくる */
  background:
    radial-gradient(90% 70% at 50% 40%, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .88) 55%, rgba(255, 255, 255, .74) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .6) 0%, rgba(233, 240, 247, .78) 100%);
}

.p-contact .l-inner { position: relative; z-index: 1; }
.p-contact__inner { text-align: center; }
.p-contact__inner .c-label { display: inline-block; }
.p-contact__inner .c-label::after { margin-inline: auto; }

.p-contact__ornament {
  position: relative;
  width: 22rem;
  height: 1px;
  margin: 3rem auto 0;
  background: var(--gold);
}
.p-contact__ornament::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: .7rem;
  height: .7rem;
  background: var(--gold);
  transform: translate(-50%, -50%) rotate(45deg);
}

.p-contact__lead {
  margin-top: 3.4rem;
  font-size: 1.6rem;
  line-height: 2.1;
  color: var(--ink);
}

.p-contact__btns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
  margin-top: 4.4rem;
}

.p-contact__tel { margin-top: 4.8rem; }
/* 🔴 2026-08-20 クライアント指摘「一般的で見やすい表記・フォントに」。
   Cormorant Garamond は **オールドスタイル数字**（0や2が小さく、6や8が上下にはみ出す）なので、
   電話番号が数字として読みにくかった。本文と同じサンセリフ＋等幅数字に変更する。
   装飾書体は見出し用。数字を読ませる場所には使わない。 */
.p-contact__tel a {
  display: inline-flex;
  align-items: center;
  gap: 1.6rem;
  font-family: var(--sans);
  font-size: clamp(3rem, 4vw, 4.2rem);
  font-weight: 700;
  letter-spacing: .04em;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
  color: var(--navy);
  line-height: 1.2;
  white-space: nowrap;
}
.p-contact__tel-label {
  display: block;
  margin-bottom: 1rem;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: .16em;
  color: var(--ink-sub);
}
.p-contact__tel a:hover { color: var(--gold); }
.p-contact__tel-icon {
  position: relative;
  width: 4.2rem;
  height: 4.2rem;
  flex: none;
  border: 1px solid currentColor;
  border-radius: 50%;
}
.p-contact__tel-icon::after {
  content: "";
  position: absolute;
  inset: 0;
  background: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.6 10.8c1 2 2.6 3.6 4.6 4.6l2.3-2.3c.3-.3.7-.4 1.1-.2 1.2.4 2.4.6 3.7.6.6 0 1 .4 1 1V19c0 .6-.4 1-1 1-8.3 0-15-6.7-15-15 0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.7.1.4 0 .8-.2 1.1l-2.3 2.3Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.6 10.8c1 2 2.6 3.6 4.6 4.6l2.3-2.3c.3-.3.7-.4 1.1-.2 1.2.4 2.4.6 3.7.6.6 0 1 .4 1 1V19c0 .6-.4 1-1 1-8.3 0-15-6.7-15-15 0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.7.1.4 0 .8-.2 1.1l-2.3 2.3Z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 55%;
  mask-size: 55%;
}

.p-contact__hours {
  margin-top: 1.4rem;
  font-size: 1.4rem;
  letter-spacing: .08em;
  color: var(--ink-sub);
}
.p-contact__hours::before {
  content: "";
  display: block;
  width: 6rem;
  height: 1px;
  margin: 0 auto 1.4rem;
  background: var(--gold);
}

/* --------------------------------------------------------------------------
   14. フッター
   -------------------------------------------------------------------------- */
.l-footer {
  padding: 7.6rem 0 3rem;
  background: var(--navy-deep);
  color: var(--white);
  border-top: 2px solid var(--gold);
}

.l-footer__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: 5rem;
  padding-bottom: 5.6rem;
}

.l-footer__logo img { width: auto; height: 4.6rem; display: block; }

/* 🔴 2026-08-20 フッターロゴをクライアント支給のカラー版へ差し替えたことによる処置。
      フッターの地は濃紺 #0C2035。支給ロゴの最頻色 #003070 は**コントラスト比 1.30:1**（実測）で、
      そのまま置くと「FORCE」の文字が地に沈んで読めない。
      → 白いプレートに載せる。ロゴの色は支給どおりのまま可読性を確保する。
      角丸は 3px（サイト内で使っている値にそろえる。ここだけ丸くしない）。 */
.l-footer__logo--plate {
  display: inline-block;
  padding: 1.4rem 1.8rem;
  background: var(--white);
  border-radius: 3px;
}
.l-footer__logo--plate img { height: 4rem; }
@media (max-width: 768px) {
  .l-footer__logo--plate { padding: 1.2rem 1.4rem; }
  .l-footer__logo--plate img { height: 3.4rem; }
}
.l-footer__name {
  margin-top: 2.6rem;
  font-family: var(--serif);
  font-size: 1.9rem;
  font-weight: 500;
  letter-spacing: .08em;
}
.l-footer__address {
  margin-top: 1.8rem;
  font-size: 1.4rem;
  line-height: 1.95;
  color: rgba(255, 255, 255, .78);
}
/* 2026-08-20 フッターのTEL/FAXも拠点一覧と同じ組みにそろえる（ラベル列＋番号列）。
   flex-wrap の1行流し込みだと FAX バッジだけ行末に残って番号が次行へ落ちる。 */
.l-footer__contact {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .8rem 1.2rem;
  margin-top: 2.2rem;
  font-size: 1.5rem;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
}
.l-footer__contact .l-footer__tag { justify-self: start; min-width: 4.4rem; text-align: center; }
.l-footer__contact a,
.l-footer__contact span:not(.l-footer__tag) { white-space: nowrap; }

.l-footer__tag {
  padding: .3rem 1rem;
  font-size: 1.4rem; /* 2026-08-20 12px→14px。TEL/FAXは読ませるラベルなので本文最小に合わせる */
  letter-spacing: .1em;
  border: 1px solid rgba(255, 255, 255, .5);
}

.l-footer__nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3rem;
}
.l-footer__col-title {
  padding-bottom: 1.4rem;
  margin-bottom: 1.8rem;
  font-size: 1.55rem;
  font-weight: 500;
  letter-spacing: .1em;
  border-bottom: 1px solid rgba(255, 255, 255, .22);
}
.l-footer__col-title::after {
  content: "";
  display: block;
  width: 3rem;
  height: 1px;
  margin-bottom: -1.5rem;
  background: var(--gold);
  transform: translateY(1.4rem);
}
.l-footer__links li { margin-bottom: 1rem; }
.l-footer__links a {
  position: relative;
  padding-left: 1.6rem;
  font-size: 1.4rem;
  color: rgba(255, 255, 255, .82);
}
.l-footer__links a::before {
  content: "";
  position: absolute;
  left: 0;
  top: .75em;
  width: .5rem;
  height: .5rem;
  border-top: 1px solid var(--gold);
  border-right: 1px solid var(--gold);
  transform: rotate(45deg);
}
.l-footer__links a:hover { color: var(--gold-light); }

.l-footer__copy {
  padding-top: 3rem;
  border-top: 1px solid rgba(255, 255, 255, .16);
  font-family: var(--garamond);
  font-size: 1.3rem;
  letter-spacing: .12em;
  text-align: center;
  color: rgba(255, 255, 255, .7);
}

/* --------------------------------------------------------------------------
   15. 下層ページ共通（ページヘッド・パンくず・本文組版）
   -------------------------------------------------------------------------- */

/* ページヘッド */
.l-pagehead {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 38rem;
  padding: calc(var(--header-h) + 6rem) 0 6rem;
  overflow: hidden;
  background: linear-gradient(148deg, var(--navy-mid) 0%, #16406b 34%, var(--navy) 66%, var(--navy-deep) 100%);
  color: var(--white);
}
.l-pagehead__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.l-pagehead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .34;
}
.l-pagehead__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(12, 32, 53, .82) 0%, rgba(18, 49, 78, .58) 52%, rgba(18, 49, 78, .22) 100%);
}
.l-pagehead__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--inner);
  margin-inline: auto;
  padding-inline: 3rem;
}
.l-pagehead__en {
  font-family: var(--garamond);
  font-size: clamp(3.6rem, 5vw, 6.4rem);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: .06em;
  color: var(--white);
}
.l-pagehead__ja {
  display: block;
  margin-top: 2.4rem;
  padding-top: 2.4rem;
  font-family: var(--serif);
  font-size: clamp(1.8rem, 2.2vw, 2.4rem);
  font-weight: 500;
  letter-spacing: .14em;
  color: var(--white);
  position: relative;
}
.l-pagehead__ja::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 4.4rem;
  height: 1px;
  background: var(--gold);
}

/* パンくず */
.c-breadcrumb {
  padding: 1.8rem 0;
  border-bottom: 1px solid var(--line);
  background: var(--white);
}
.c-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem 0;
  width: 100%;
  max-width: var(--inner);
  margin-inline: auto;
  padding-inline: 3rem;
  font-size: 1.3rem;
  color: var(--ink-sub);
}
.c-breadcrumb__list li { display: flex; align-items: center; }
.c-breadcrumb__list li:not(:last-child)::after {
  content: "";
  width: .5rem;
  height: .5rem;
  margin-inline: 1.2rem;
  border-top: 1px solid var(--ink-sub);
  border-right: 1px solid var(--ink-sub);
  transform: rotate(45deg);
}
.c-breadcrumb__list a:hover { color: var(--gold); }
.c-breadcrumb__list [aria-current="page"] { color: var(--navy); }

/* 下層本文 */
.p-lower { padding: 9rem 0 10rem; background: var(--white); }
.p-lower__block + .p-lower__block { margin-top: 8rem; }

.p-lower h2 {
  margin-bottom: 3.2rem;
  padding-bottom: 1.8rem;
  font-family: var(--serif);
  font-size: clamp(2.2rem, 2.8vw, 3rem);
  font-weight: 500;
  letter-spacing: .1em;
  line-height: 1.55;
  color: var(--navy);
  border-bottom: 1px solid var(--line);
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.p-lower h2::after {
  content: "";
  display: block;
  width: 6rem;
  height: 2px;
  margin-bottom: -1.9rem;
  background: var(--gold);
  transform: translateY(1.8rem);
}
.p-lower h3 {
  margin-bottom: 1.8rem;
  font-family: var(--serif);
  font-size: clamp(1.8rem, 2.2vw, 2.2rem);
  font-weight: 500;
  letter-spacing: .08em;
  line-height: 1.6;
  color: var(--navy);
}
.p-lower h4 {
  margin-bottom: 1.4rem;
  padding-left: 1.4rem;
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--navy);
  border-left: 2px solid var(--gold);
}
.p-lower p { margin-bottom: 2rem; font-size: 1.55rem; line-height: 2.05; }
.p-lower p:last-child { margin-bottom: 0; }
.p-lower a:not([class]) { color: var(--navy); text-decoration: underline; }
.p-lower a:not([class]):hover { color: var(--gold); }
.p-lower ul:not([class]) { margin-bottom: 2rem; }
.p-lower ul:not([class]) li {
  position: relative;
  margin-bottom: .8rem;
  padding-left: 1.8rem;
  font-size: 1.55rem;
  line-height: 1.95;
}
.p-lower ul:not([class]) li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .85em;
  width: .7rem;
  height: .7rem;
  background: var(--gold);
  transform: rotate(45deg);
}
.p-lower ol:not([class]) { margin-bottom: 2rem; padding-left: 2.2rem; list-style: decimal; }
.p-lower ol:not([class]) li { margin-bottom: .8rem; font-size: 1.55rem; line-height: 1.95; }

/* リード文 */
.p-lower__lead {
  margin-bottom: 5.2rem;
  font-family: var(--serif);
  font-size: clamp(1.8rem, 2.2vw, 2.2rem);
  font-weight: 500;
  line-height: 1.85;
  letter-spacing: .06em;
  color: var(--navy);
  word-break: keep-all;
  overflow-wrap: anywhere;
}
/* 🔴 ブロック内（h2 のすぐ下）に置くリード。**必ず .p-lower__lead の定義より後に置く**
   （同じ詳細度なので、前に書くと 5.2rem に負けて効かない）。 */
.p-lower__lead--inblock { margin-bottom: 1.8rem; }

/* カードグリッド（サービス等） */
.p-lower__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5rem 4.4rem;
}
.p-lower__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.p-lower__card-img {
  margin-bottom: 2.6rem;
  overflow: hidden;
}
.p-lower__card-img img {
  width: 100%;
  aspect-ratio: 62 / 36;
  object-fit: cover;
  transition: transform .6s var(--ease);
}

/* 定義テーブル（会社概要等） */
.c-table { width: 100%; margin-bottom: 2.4rem; border-collapse: collapse; }
.c-table th,
.c-table td {
  padding: 2rem 2.4rem;
  font-size: 1.5rem;
  line-height: 1.9;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
}
.c-table th {
  width: 26%;
  font-weight: 500;
  color: var(--navy);
  background: var(--lightblue);
  white-space: nowrap;
}
.c-table thead th {
  color: var(--white);
  background: var(--navy);
  white-space: normal;
  width: auto;
}
.c-table--fee th { white-space: normal; }
.c-table__note { font-size: 1.4rem; color: var(--ink-sub); }

/* 面付きブロック */
.p-lower__panel {
  padding: 4.4rem;
  background: var(--pale);
}
.p-lower__panel--blue { background: var(--lightblue); }

/* プロフィール（コンサルタント紹介） */
.p-member {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4.4rem 3.6rem;
}
.p-member__item { display: flex; flex-direction: column; }
.p-member__img { margin-bottom: 2.2rem; overflow: hidden; background: var(--lightblue); }
.p-member__img img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.p-member__role {
  margin-bottom: .8rem;
  font-size: 1.3rem;
  letter-spacing: .06em;
  color: var(--gold);
}
.p-member__name {
  margin-bottom: 1.6rem;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--navy);
}
.p-member__name span { margin-left: 1rem; font-size: 1.2rem; letter-spacing: .1em; color: var(--ink-sub); }
.p-member__text { font-size: 1.45rem; line-height: 1.95; }


/* 代表メッセージ */
.p-ceo {
  display: grid;
  grid-template-columns: 30rem minmax(0, 1fr);
  gap: 4rem;
  align-items: start;
  margin-bottom: 5rem;
}
/* 🔴 2026-08-18 代表写真の差し替えに伴い 3:4 → 4:3。
   支給された hosoda.jpg が 620x466 の横位置のため、3:4 で切ると 350x466 になり
   300px 幅のカラムに対して 1.17倍しか出ない（Retinaで甘い）。4:3 なら 620px を
   そのまま使えて 2.07倍。人物を切り落とさずに解像度を確保するための変更。 */
.p-ceo__img img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
/* 2026-08-20 現行HPの 2026-ceo-image.jpg（950x1200）へ戻したので縦位置の比率に。
   8/18 に入れた 620x466 の横位置写真に合わせて 4:3 にしていたのを差し戻した。 */
.p-ceo__role { margin-bottom: .6rem; font-size: 1.3rem; letter-spacing: .1em; color: var(--gold); }
.p-ceo__name {
  margin-bottom: 2.2rem;
  font-family: var(--serif);
  font-size: 2.6rem;
  font-weight: 500;
  letter-spacing: .12em;
  color: var(--navy);
}
.p-ceo__greeting h3 { margin-bottom: 2.8rem; }
.p-ceo__greeting h4 { margin-top: 3rem; }
.p-ceo__greeting h4:first-of-type { margin-top: 0; }

/* 拠点一覧 */
.p-office {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3.4rem;
  margin-top: 4rem;
}
.p-office__item {
  display: flex;
  flex-direction: column;
  padding: 3rem 2.6rem;
  background: var(--pale);
  border-top: 2px solid var(--gold);
  scroll-margin-top: calc(var(--header-h) + 2rem);
}
.p-office__name {
  margin-bottom: 1.6rem;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--navy);
}
.p-office__addr { margin-bottom: 1.6rem; font-size: 1.45rem; line-height: 1.9; }
/* 🔴 2026-08-20 クライアント指摘「並びやレイアウトを整えて見やすく」。
   旧実装は flex-wrap の1行流し込みだったため、**FAXバッジが行末に残って番号だけ次行へ落ちる**
   （「TEL 03-… FAX」／「03-…」と読めてしまう）。ラベル列と番号列の2列グリッドに変え、
   TEL行とFAX行が必ず縦にそろうようにした。数字は等幅にして桁位置を合わせる。 */
.p-office__tel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .8rem 1.2rem;
  margin-bottom: 2rem;
  font-size: 1.5rem;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
}
.p-office__tel .l-footer__tag {
  justify-self: start;
  min-width: 4.8rem;
  padding: .25rem 0;
  text-align: center;
  color: var(--navy);
  border-color: rgba(18, 49, 78, .4);
}
.p-office__tel a,
.p-office__tel span:not(.l-footer__tag) { letter-spacing: .02em; white-space: nowrap; }
.p-office__item .c-more { align-self: flex-start; margin-top: auto; font-size: 1.35rem; }


/* メンバーの経歴・メッセージ（開閉） */
.p-member__detail { margin-top: auto; }
.p-member__detail summary {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  padding-bottom: .6rem;
  font-size: 1.35rem;
  letter-spacing: .04em;
  color: var(--navy);
  border-bottom: 1px solid currentColor;
  cursor: pointer;
  list-style: none;
}
.p-member__detail summary::-webkit-details-marker { display: none; }
.p-member__detail summary::after {
  content: "";
  width: .7rem;
  height: .7rem;
  border-bottom: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform .3s var(--ease);
}
.p-member__detail[open] summary::after { transform: translateY(1px) rotate(-135deg); }
.p-member__detail summary:hover { color: var(--gold); }
.p-member__body { margin-top: 2rem; }
.p-member__msg {
  margin-top: 1.8rem;
  padding: 1.8rem 2rem;
  background: var(--lightblue);
}
.p-member__msg dt {
  margin-bottom: .6rem;
  font-size: 1.25rem;
  letter-spacing: .1em;
  color: var(--gold);
}
.p-member__msg dd { margin: 0; font-size: 1.4rem; line-height: 1.9; }

/* 求人（採用情報） */
.p-job + .p-job { margin-top: 4.4rem; }
.p-job__title {
  margin-bottom: 0;
  padding: 1.8rem 2.4rem;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--white);
  background: var(--navy);
}


/* 絞り込みフィルタ */
.c-filter { margin-bottom: 5rem; padding: 3rem; background: var(--pale); }
.c-filter__title {
  margin-bottom: 1.8rem;
  padding-left: 1.4rem;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--navy);
  border-left: 2px solid var(--gold);
}
.c-filter__list { display: flex; flex-wrap: wrap; gap: 1rem; }
.c-filter__list a {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .8rem 1.6rem;
  font-size: 1.35rem;
  color: var(--navy);
  background: var(--white);
  border: 1px solid var(--line);
}
.c-filter__list a span { font-size: 1.15rem; color: var(--ink-sub); }
.c-filter__list a:hover,
.c-filter__list a.is-current { color: var(--white); background: var(--navy); border-color: var(--navy); }
.c-filter__list a:hover span,
.c-filter__list a.is-current span { color: rgba(255, 255, 255, .7); }

/* 事例アーカイブ（カードは白背景の面に置く） */
.p-works__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3.4rem; }
.p-works__grid .p-works__card { border: 1px solid var(--line); }
.p-works__grid .p-works__title { color: var(--navy); }


/* プライバシーポリシー等の長文ページ */
.p-privacy .p-lower__center { margin-bottom: 4rem; text-align: center; }
.p-privacy .p-lower__center h2 { border-bottom: 0; }
.p-privacy .p-lower__center h2::after { margin: 1.8rem auto -1.9rem; }
.p-privacy .privacy-text-block { margin-bottom: 3.4rem; }
.p-privacy .privacy-text-block:last-child { margin-bottom: 0; }
.p-privacy h3 { margin-top: 4.4rem; padding-left: 1.6rem; border-left: 3px solid var(--gold); }
.p-privacy h4 { margin-top: 3rem; }
.p-privacy .number-list { margin-bottom: 2rem; }
.p-privacy .number-list > li {
  display: flex;
  gap: .8rem;
  margin-bottom: .8rem;
  font-size: 1.5rem;
  line-height: 1.95;
}
.p-privacy .number { flex: none; color: var(--navy); font-weight: 500; }
.p-privacy .circle_number_list { margin-bottom: 2rem; padding-left: 2rem; list-style: circle; }
.p-privacy .circle_number_list li { margin-bottom: .6rem; font-size: 1.5rem; line-height: 1.95; }
.p-privacy p { font-size: 1.5rem; }
.p-privacy a { color: var(--navy); text-decoration: underline; }
.p-privacy a:hover { color: var(--gold); }

/* 記事一覧（コラム・お知らせアーカイブ） */
.p-archive { padding: 8rem 0 10rem; background: var(--white); }
.p-archive__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4rem 3.6rem;
}
.c-pager {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  margin-top: 6.4rem;
}
.c-pager .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.6rem;
  height: 4.6rem;
  padding: 0 1.2rem;
  font-size: 1.5rem;
  color: var(--navy);
  border: 1px solid var(--line);
}
.c-pager .page-numbers:hover { color: var(--white); background: var(--gold); border-color: var(--gold); }
.c-pager .page-numbers.current { color: var(--white); background: var(--navy); border-color: var(--navy); }

/* --------------------------------------------------------------------------
   16. ユーティリティ
   -------------------------------------------------------------------------- */
.u-sp-only { display: none; }

/* 表示アニメーション
   opacity: 0 で隠すと、JSが発火しなかった場合に内容が読めなくなる。
   動き（translate）だけにして、最悪でもコンテンツは必ず見える状態を保つ。 */
.js-fade { transform: translateY(22px); transition: transform .9s var(--ease); }
.js-fade.is-inview { transform: none; }

/* --------------------------------------------------------------------------
   17. レスポンシブ
   -------------------------------------------------------------------------- */

/* ---- 1280px以下：ヘッダーの詰まり回避 ---- */
@media screen and (max-width: 1280px) {
  .l-header__menu { gap: 1.8rem; }
  .l-header__menu a { font-size: 1.35rem; }
  .l-header__nav { gap: 2rem; }
}

/* ---- 1100px以下：ヘッダーをドロワーへ ---- */
@media screen and (max-width: 1100px) {
  :root { --header-h: 72px; }

  .l-header__toggle { display: block; }

  .l-header__nav {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 105;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0;
    width: min(88%, 42rem);
    padding: calc(var(--header-h) + 3rem) 3rem 4rem;
    background: var(--white);
    box-shadow: -6px 0 30px rgba(12, 32, 53, .16);
    overflow-y: auto;
    transform: translateX(100%);
    /* 閉じている間はレイアウト・読み上げから外す（横スクロール発生の防止） */
    visibility: hidden;
    transition: transform .45s var(--ease), visibility .45s var(--ease);
  }
  .l-header__nav.is-open { transform: none; visibility: visible; }

  .l-header__menu { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
  .l-header__menu li { border-bottom: 1px solid var(--line); }
  .l-header__menu a { padding: 1.8rem .4rem; font-size: 1.6rem; }
  .l-header__menu a::after { display: none; }

  .l-header__cta { flex-direction: column; width: 100%; margin-top: 3rem; gap: 1.2rem; }
  .l-header__cta .c-btn { width: 100%; min-height: 5.4rem; font-size: 1.5rem; }

  .l-header.is-scrolled .l-header__inner { height: var(--header-h); }
  .l-header__logo img { height: 4.4rem; }
  .l-header.is-scrolled .l-header__logo img { height: 4rem; }
}

/* ---- 1024px以下 ---- */
@media screen and (max-width: 1024px) {
  .p-network { padding: 8rem 0; }
  .p-network__inner { grid-template-columns: 1fr; gap: 5rem; }
  .p-network__map { justify-self: center; max-width: 54rem; }

  .p-business { padding: 8rem 0; }
  .p-business__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-business__item:last-child { grid-column: 1 / -1; max-width: 56rem; margin-inline: auto; }


  .p-works { padding: 8rem 0 7rem; }
  .p-works__track { grid-auto-columns: calc((100% - 2 * 2.4rem) / 3); }

  .p-talk { padding: 8rem 0; }
  .p-talk__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* 3件並びのときだけ最後の1件を中央寄せで広げる。2件並び（--duo）は対象外。 */
  .p-talk__list:not(.p-talk__list--duo) .p-talk__item:last-child { grid-column: 1 / -1; max-width: 52rem; margin-inline: auto; }
  .p-talk__block { margin-top: 5.6rem; }
  .p-talk__list--duo { gap: 3rem; }
  .p-talk__card-body { padding: 2.4rem 2.4rem 2.6rem; }
  .p-talk__movies { padding: 4rem 3rem; margin-top: 6rem; }
  .p-talk__movie-list { grid-template-columns: 1fr; gap: 3.4rem; }
  .p-talk__movie--lead { width: 100%; }

  .p-column { padding: 8rem 0; }
  .p-column__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-column__item:last-child { grid-column: 1 / -1; max-width: 52rem; margin-inline: auto; }

  .p-contact { padding: 8rem 0; }

  .l-footer__top { grid-template-columns: 1fr; gap: 4.4rem; }

  /* 下層 */
  .l-pagehead { min-height: 30rem; padding: calc(var(--header-h) + 4.4rem) 0 4.4rem; }
  .p-lower { padding: 6.4rem 0 7.2rem; }
  .p-lower__block + .p-lower__block { margin-top: 6rem; }
  .p-lower__grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-member { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-office { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-works__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-archive__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-lower__panel { padding: 3.2rem; }
}

/* ---- 768px以下（SP） ---- */
@media screen and (max-width: 768px) {
  body { font-size: 1.5rem; }

  .l-inner { padding-inline: 2rem; }
  .u-sp-only { display: inline; }

  .c-sec-head { margin-bottom: 4rem; }
  .c-sec-head--between { flex-direction: column; align-items: flex-start; gap: 2.4rem; }
  .c-heading { font-size: 2.7rem; }
  .c-heading--wide { letter-spacing: .1em; }

  .c-btn--lg { min-width: 100%; min-height: 6rem; }

  /* MV */
  .p-mv {
    min-height: 0;
    flex-direction: column;
    padding-top: var(--header-h);
  }
  .p-mv__media {
    position: relative;
    inset: auto;
    width: 100%;
    order: 2;
  }
  .p-mv__media img { aspect-ratio: 4 / 3; object-position: center 20%; }
  .p-mv__media::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .9) 0%, rgba(255, 255, 255, 0) 34%);
  }
  .p-mv__inner { order: 1; padding: 4.4rem 2rem 3.6rem; }
  .p-mv__title { font-size: 3rem; letter-spacing: .02em; }
  .p-mv__lead { font-size: 1.35rem; }
  .p-mv__text { margin-top: 2rem; font-size: 1.45rem; }
  .p-mv__text br { display: none; }
  .p-mv__btns { flex-direction: column; gap: 1.2rem; margin-top: 3rem; }
  .p-mv__scroll { display: none; }

  /* Network */
  .p-network { padding: 6.4rem 0; }
  .p-network__inner { padding-inline: 2rem; }
  .p-network__lead { font-size: 1.7rem; margin: 2.4rem 0 1.6rem; }
  .p-network__text { font-size: 1.4rem; line-height: 2; }
  .p-network__map { max-width: 100%; }
  .p-network__label { padding: .5rem 1rem; font-size: 1.2rem; letter-spacing: .06em; }
  .p-network__dot { width: .8rem; height: .8rem; margin: -.4rem 0 0 -.4rem; }
  .p-network__cities a { font-size: 1.5rem; }

  /* Business */
  .p-business { padding: 6.4rem 0; }
  .p-business__list { grid-template-columns: 1fr; gap: 4rem; }
  .p-business__item:last-child { max-width: 100%; }
  .p-business__media { margin-bottom: 2.4rem; }
  .p-business__ribbon { font-size: 1.7rem; padding: 1.2rem 1.6rem; }
  .p-business__text { font-size: 1.45rem; margin-bottom: 2rem; }

  /* Feature */

  /* Works */
  .p-works { padding: 6.4rem 0 5.6rem; }
  .p-works__lead { font-size: 1.45rem; margin-top: 1.8rem; }
  .p-works__track { grid-auto-columns: 82%; gap: 1.8rem; }
  .p-works__title { font-size: 1.55rem; margin: 1.8rem 1.8rem 1.4rem; }
  .p-works__meta { margin: auto 1.8rem 1.8rem; }
  .p-works__dots { margin-top: 3rem; }
  .p-works__dot { width: 2.6rem; }

  /* Talk */
  .p-talk { padding: 6.4rem 0; }
  .p-talk__lead { font-size: 1.45rem; margin-top: 2rem; }
  .p-talk__list { grid-template-columns: 1fr; gap: 2.8rem; }
  .p-talk__list--duo { grid-template-columns: 1fr; gap: 2.8rem; }
  .p-talk__item:last-child { max-width: 100%; }
  .p-talk__block { margin-top: 4.8rem; }
  .p-talk__block-title,
  .p-talk__movies-title { font-size: 2rem; margin-bottom: 3rem; }
  .p-talk__block-en { font-size: 1.4rem; }
  .p-talk__title { font-size: 1.6rem; margin: 2rem 2rem 1.6rem; }
  .p-talk__card-body { padding: 2.2rem 2rem 2.4rem; }
  .p-talk__card-body .p-talk__title { font-size: 1.75rem; margin: 0 0 1.2rem; }
  .p-talk__excerpt { margin-bottom: 2rem; font-size: 1.4rem; }
  .p-talk__no { font-size: 2.2rem; padding: .6rem 1.2rem; }
  .p-talk__card .c-more { margin-inline: 2rem; }
  .p-talk__card-body .c-more { margin-inline: 0; }
  .p-talk__movies { padding: 3.4rem 2rem; margin-top: 4.8rem; }
  .p-talk__movie-title { font-size: 1.6rem; }
  .p-talk__movie-sub { font-size: 1.4rem; }
  .p-talk__foot { margin-top: 3.4rem; gap: 1.4rem; }
  .p-talk__foot .c-btn { width: 100%; }

  /* Column */
  .p-column { padding: 6.4rem 0; }
  .p-column__list { grid-template-columns: 1fr; gap: 2.8rem; }
  .p-column__item:last-child { max-width: 100%; }
  .p-column__lead { font-size: 1.4rem; margin-top: 1.8rem; }
  .p-column__body { padding: 2.2rem 2rem 2.6rem; }
  .p-column__title { font-size: 1.55rem; margin-bottom: 2rem; }
  .p-column__bnr { margin-top: 4.8rem; }
  .p-column__bnr-link { padding: 3rem 2rem; gap: 1.6rem; }

  /* Contact */
  .p-contact { padding: 6.4rem 0; }
  .p-contact__lead { margin-top: 2.6rem; font-size: 1.45rem; }
  .p-contact__lead br { display: none; }
  .p-contact__btns { flex-direction: column; gap: 1.4rem; margin-top: 3.4rem; }
  .p-contact__tel { margin-top: 3.6rem; }
  .p-contact__tel a { font-size: 3rem; gap: 1.2rem; }
  .p-contact__tel-icon { width: 3.4rem; height: 3.4rem; }
  .p-contact__ornament { width: 16rem; }

  /* Footer */
  .l-footer { padding: 5.6rem 0 2.4rem; }
  .l-footer__top { padding-bottom: 4rem; }
  .l-footer__nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.8rem; }
  .l-footer__name { font-size: 1.7rem; margin-top: 2rem; }

  /* 下層 */
  .l-pagehead { min-height: 22rem; padding: calc(var(--header-h) + 3.4rem) 0 3.4rem; }
  .l-pagehead__inner { padding-inline: 2rem; }
  .l-pagehead__ja { margin-top: 1.8rem; padding-top: 1.8rem; letter-spacing: .08em; }
  .c-breadcrumb { padding: 1.2rem 0; }
  .c-breadcrumb__list { padding-inline: 2rem; font-size: 1.2rem; }
  .p-lower { padding: 4.8rem 0 5.6rem; }
  .p-lower__block + .p-lower__block { margin-top: 4.8rem; }
  .p-lower__lead { margin-bottom: 3.4rem; }
  .p-lower__grid, .p-lower__grid--3 { grid-template-columns: 1fr; gap: 3.4rem; }
  .p-lower p, .p-lower ul:not([class]) li, .p-lower ol:not([class]) li { font-size: 1.45rem; }
  .p-member { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3rem 2rem; }
  .p-ceo { grid-template-columns: 1fr; gap: 2.4rem; margin-bottom: 3.4rem; }
  .p-ceo__img { max-width: 24rem; }
  .p-ceo__name { font-size: 2.2rem; margin-bottom: 1.6rem; }
  .p-office { grid-template-columns: 1fr; gap: 2rem; margin-top: 2.8rem; }
  .p-office__item { padding: 2.4rem 2rem; }
  .p-member__name { font-size: 1.7rem; }
  .p-archive { padding: 4.8rem 0 5.6rem; }
  .p-archive__list { grid-template-columns: 1fr; gap: 2.8rem; }
  .p-works__grid { grid-template-columns: 1fr; gap: 2.4rem; }
  .c-filter { margin-bottom: 3.4rem; padding: 2rem 1.8rem; }
  .c-filter__list a { padding: .7rem 1.2rem; font-size: 1.25rem; }
  .p-lower__panel { padding: 2.4rem 2rem; }
  .p-job__title { padding: 1.4rem 1.8rem; font-size: 1.7rem; }

  /* テーブルは縦積みにする（横スクロールを出さない） */
  .c-table, .c-table tbody, .c-table tr, .c-table th, .c-table td { display: block; width: 100%; }
  .c-table thead { display: none; }
  .c-table tr { margin-bottom: 1.6rem; border: 1px solid var(--line); }
  .c-table th { width: 100%; white-space: normal; border-bottom: 1px solid var(--line); }
  .c-table td { border-bottom: 0; }
}

/* ---- 480px以下 ---- */
@media screen and (max-width: 480px) {
  .p-mv__title { font-size: 2.6rem; }
  .c-heading { font-size: 2.4rem; }
  .p-works__track { grid-auto-columns: 88%; }
  .l-footer__nav { grid-template-columns: 1fr; }
  .p-network__label { font-size: 1.1rem; padding: .4rem .8rem; }
}


/* ==========================================================================
   9. 下層ページ 追加コンポーネント（2026-08 追加分）
   - よくあるご質問 / ご相談の流れ / 強み・特徴 / フォーム / 資料DL
   - 特別対談コーナー（一覧・詳細）／成約実績 詳細
   - コンサルタント紹介（一覧・詳細）
   - CV強化用CTA（記事内・記事下・追従）
   ここより下のルールは、既存セクションを上書きしないよう新しいクラス名で完結させている。
   例外的に上書きするものは、対応するメディアクエリも本ブロック末尾で再定義している。
   ========================================================================== */

.l-inner--narrow { max-width: 92rem; }
.p-lower--tight { padding-top: 0; }

/* --------------------------------------------------------------------------
   よくあるご質問（アコーディオン）
   -------------------------------------------------------------------------- */
.c-faq { border-top: 1px solid var(--line); }
.c-faq__item { border-bottom: 1px solid var(--line); }
.c-faq__q {
  display: flex;
  align-items: flex-start;
  gap: 1.6rem;
  padding: 2.6rem 4.4rem 2.6rem 0;
  position: relative;
  font-family: var(--serif);
  font-size: 1.75rem;
  font-weight: 500;
  line-height: 1.7;
  color: var(--navy);
  cursor: pointer;
  list-style: none;
}
.c-faq__q::-webkit-details-marker { display: none; }
.c-faq__q::after {
  content: "";
  position: absolute;
  right: .6rem;
  top: 3.4rem;
  width: .9rem;
  height: .9rem;
  border-bottom: 1px solid var(--gold);
  border-right: 1px solid var(--gold);
  transform: rotate(45deg);
  transition: transform .3s var(--ease);
}
.c-faq__item[open] .c-faq__q::after { transform: translateY(4px) rotate(-135deg); }
.c-faq__q:hover { color: var(--gold); }
.c-faq__mark {
  flex: none;
  width: 3.4rem;
  height: 3.4rem;
  display: grid;
  place-items: center;
  font-family: var(--garamond);
  font-size: 1.9rem;
  color: var(--white);
  background: var(--navy);
}
.c-faq__mark--a { background: var(--gold); }
.c-faq__a {
  display: flex;
  align-items: flex-start;
  gap: 1.6rem;
  padding: 0 4.4rem 3rem 0;
}
.c-faq__a-body { flex: 1 1 auto; min-width: 0; }
.c-faq__a-body p { margin-bottom: 1.6rem; font-size: 1.55rem; line-height: 2.05; }
.c-faq__a-body p:last-child { margin-bottom: 0; }
.c-faq__a-body .c-table { margin-top: 2.4rem; margin-bottom: 0; }

/* --------------------------------------------------------------------------
   ご相談の流れ
   -------------------------------------------------------------------------- */
.c-flow { position: relative; margin-bottom: 2rem; }
.c-flow__item {
  position: relative;
  display: grid;
  grid-template-columns: 26rem minmax(0, 1fr);
  gap: 3.4rem;
  padding: 3.4rem 0;
  border-bottom: 1px solid var(--line);
}
.c-flow__item:first-child { border-top: 1px solid var(--line); }
.c-flow__head { position: relative; }
.c-flow__step {
  display: flex;
  align-items: baseline;
  gap: .8rem;
  margin-bottom: 1rem;
  font-family: var(--garamond);
  font-size: 3.4rem;
  line-height: 1;
  color: var(--gold);
}
.c-flow__step span {
  font-family: var(--sans);
  font-size: 1.2rem;
  letter-spacing: .18em;
  color: var(--ink-sub);
}
.c-flow__title {
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6;
  color: var(--navy);
}
.c-flow__body p { font-size: 1.55rem; line-height: 2.05; }
/* /ma-consulting/ 内の「ご相談の流れ」は見出しが h3。素の .c-flow__title(0,1,0) では
   .p-lower h3(0,1,1) に負けて余白と字送りが崩れるので、詳細度を上げて打ち消す。 */
.p-lower .c-flow__title { margin-bottom: 0; font-size: 2rem; letter-spacing: normal; }

/* --------------------------------------------------------------------------
   強み・特徴
   -------------------------------------------------------------------------- */
.p-feature__block { padding: 5rem 0; }
.p-feature__block:nth-child(odd) { background: var(--pale); }
.p-feature__inner {
  display: grid;
  grid-template-columns: minmax(0, 46%) minmax(0, 1fr);
  gap: 5rem;
  align-items: center;
}
.p-feature__block--rev .p-feature__inner { direction: rtl; }
.p-feature__block--rev .p-feature__inner > * { direction: ltr; }
.p-feature__media { position: relative; }
.p-feature__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.p-feature__en {
  position: absolute;
  right: -1.2rem;
  bottom: -2.4rem;
  font-family: var(--garamond);
  font-size: 5.6rem;
  font-style: italic;
  line-height: 1;
  color: rgba(176, 141, 87, .35);
  pointer-events: none;
}
.p-feature__title {
  margin: 1.4rem 0 2.4rem;
  font-family: var(--serif);
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.75;
  color: var(--navy);
}
.p-feature__text { font-size: 1.55rem; line-height: 2.1; }

/* 🔴 2026-08-18 見出しの折り返しを文節で確定させる（クライアント指摘「変な改行」）
   原因は .p-lower h2 の `word-break: keep-all` + `overflow-wrap: anywhere`。
   短い見出し向けの指定で、この4本のような長い見出しに当たると
   「1行に収まらない＝どこで割ってもよい」に転び、語中で切れていた。
   実測（Playwright／1440px）：
     旧 …プロフェッショナ|ルな支援で ／ …満足いただけるM|&Aを実現します
        WebKitとChromiumで改行位置も食い違っていた
   対処は3点セット。
     1. HTML側に <wbr>（BudouXの文節境界）を入れて折り返せる位置を明示
     2. M&A は <span class="u-nb"> で分断を封じる（& が改行機会になるため）
     3. 文字サイズと字送りを詰めて、1文節が行に収まるようにする
   ⚠️ 見出しの文言を差し替えたら <wbr> も入れ直すこと。入れ忘れると語中改行に戻る。 */
.p-lower .p-feature__title {
  font-size: clamp(1.9rem, 2.2vw, 2.3rem);
  letter-spacing: .04em;
  line-height: 1.7;
}
.u-nb { white-space: nowrap; }

/* --------------------------------------------------------------------------
   フォーム（Contact Form 7）
   -------------------------------------------------------------------------- */
.c-form { margin-bottom: 6rem; }
.c-form__head { margin-bottom: 3rem; text-align: center; }
.c-form__title {
  margin-bottom: 1.6rem;
  font-family: var(--serif);
  font-size: 2.6rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--navy);
}
.c-form__note-lead { font-size: 1.5rem; line-height: 2; color: var(--ink-sub); }
.c-form__trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem 2.4rem;
  margin-bottom: 3.6rem;
  padding: 2rem 2.4rem;
  background: var(--lightblue);
}
.c-form__trust li {
  display: flex;
  align-items: center;
  gap: .8rem;
  font-size: 1.4rem;
  color: var(--navy);
}
.c-form__trust li span {
  flex: none;
  width: 1.8rem;
  height: 1.8rem;
  position: relative;
  border-radius: 50%;
  background: var(--gold);
}
.c-form__trust li span::after {
  content: "";
  position: absolute;
  left: .55rem;
  top: .3rem;
  width: .5rem;
  height: .9rem;
  border-right: 2px solid var(--white);
  border-bottom: 2px solid var(--white);
  transform: rotate(45deg);
}

.c-form__body .form_row { margin-bottom: 2.4rem; }
.c-form__body .form_row > p { margin: 0; }
.c-form__body label {
  display: block;
  margin-bottom: .8rem;
  font-size: 1.45rem;
  font-weight: 500;
  color: var(--navy);
}
.c-form__body label .required {
  display: inline-block;
  margin-left: 1rem;
  padding: .2rem 1rem;
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: .06em;
  color: var(--white);
  background: #B4483F;
}
.c-form__body input[type="text"],
.c-form__body input[type="tel"],
.c-form__body input[type="email"],
.c-form__body textarea,
.c-form__body select {
  width: 100%;
  padding: 1.4rem 1.6rem;
  font-family: var(--sans);
  font-size: 1.55rem;
  line-height: 1.7;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 0;
  transition: border-color .2s var(--ease);
  -webkit-appearance: none;
  appearance: none;
}
.c-form__body input:focus,
.c-form__body textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(176, 141, 87, .15);
}
.c-form__body textarea { min-height: 18rem; resize: vertical; }
.c-form__body ::placeholder { color: #9AA6B1; }
.c-form__body .wpcf7-form-control-wrap { display: block; }
.c-form__body .text--center { text-align: center; }
.c-form__body .mt20 { margin-top: 2rem; }
.c-form__body .form_btn_wrap { margin-top: 3.4rem; text-align: center; }
.c-form__body .form_btn,
.c-form__body input[type="submit"] {
  min-width: 30rem;
  padding: 1.8rem 3rem;
  font-family: var(--sans);
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--white);
  background: var(--gold);
  border: 1px solid var(--gold);
  cursor: pointer;
  transition: background-color .3s var(--ease), color .3s var(--ease);
  -webkit-appearance: none;
  appearance: none;
}
.c-form__body .form_btn:hover,
.c-form__body input[type="submit"]:hover { background: var(--navy); border-color: var(--navy); }
.c-form__body .wpcf7-not-valid-tip { margin-top: .6rem; font-size: 1.3rem; color: #B4483F; }
.c-form__body .wpcf7-response-output {
  margin: 2.4rem 0 0;
  padding: 1.6rem 2rem;
  font-size: 1.45rem;
  border: 1px solid var(--line);
}
.c-form__body .wpcf7-spinner { margin-left: 1rem; }

.c-form__foot { margin-top: 3rem; }
.c-form__note { margin-bottom: .8rem; font-size: 1.3rem; line-height: 1.9; color: var(--ink-sub); }
.c-form__note a { color: var(--navy); text-decoration: underline; }
.c-form__note a:hover { color: var(--gold); }

.c-form__tel {
  margin-top: 3.4rem;
  padding: 2.8rem 2rem;
  text-align: center;
  background: var(--pale);
}
.c-form__tel-lead { margin-bottom: 1rem; font-size: 1.4rem; color: var(--ink-sub); }
/* 🔴 2026-08-20 クライアント指摘「無料相談・お問い合わせページの電話番号が見づらい」。
      原因はTOPのときと同じ **Cormorant Garamond のオールドスタイル数字**。
      0と2が小さく6と8が上下にはみ出すので、桁の高さが揃わず数字として読めない。
      **装飾セリフは見出し用。読ませる数字には使わない。**
      本文と同じサンセリフ＋等幅ライニング数字にそろえた（TOPの .p-contact__tel と同じ扱い）。 */
.c-form__tel-num a {
  font-family: var(--sans);
  font-size: 3.4rem;
  font-weight: 700;
  letter-spacing: .04em;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
  color: var(--navy);
  white-space: nowrap;
}
.c-form__tel-num a:hover { color: var(--gold); }
.c-form__tel-hours { font-size: 1.3rem; color: var(--ink-sub); }

.c-form__alt { margin-top: 5rem; }
.c-form__alt-title {
  margin-bottom: 2rem;
  font-family: var(--serif);
  font-size: 1.9rem;
  font-weight: 500;
  color: var(--navy);
}
.c-form__alt-list { display: grid; gap: 1.2rem; }
.c-form__alt-list a {
  display: block;
  position: relative;
  padding: 2rem 5rem 2rem 2.4rem;
  font-size: 1.55rem;
  font-weight: 500;
  color: var(--navy);
  background: var(--pale);
  transition: background-color .3s var(--ease);
}
.c-form__alt-list a span {
  display: block;
  margin-top: .4rem;
  font-size: 1.35rem;
  font-weight: 400;
  color: var(--ink-sub);
}
.c-form__alt-list a::after {
  content: "";
  position: absolute;
  right: 2.4rem;
  top: 50%;
  width: .8rem;
  height: .8rem;
  border-top: 1px solid var(--gold);
  border-right: 1px solid var(--gold);
  transform: translateY(-50%) rotate(45deg);
}
.c-form__alt-list a:hover { background: var(--lightblue); }

/* 申し込みまでの3ステップ */
.c-ministep {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
  margin-bottom: 5rem;
}
.c-ministep__item {
  position: relative;
  padding: 2.4rem 2rem;
  text-align: center;
  background: var(--pale);
}
.c-ministep__item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -1.4rem;
  top: 50%;
  width: .9rem;
  height: .9rem;
  border-top: 1px solid var(--gold);
  border-right: 1px solid var(--gold);
  transform: translateY(-50%) rotate(45deg);
  z-index: 1;
}
.c-ministep__num {
  width: 3rem;
  height: 3rem;
  margin: 0 auto .8rem;
  display: grid;
  place-items: center;
  font-family: var(--garamond);
  font-size: 1.7rem;
  color: var(--white);
  background: var(--navy);
  border-radius: 50%;
}
.c-ministep__title {
  margin-bottom: .6rem;
  font-family: var(--serif);
  font-size: 1.7rem;
  font-weight: 500;
  color: var(--navy);
}
.c-ministep__text { font-size: 1.35rem; line-height: 1.85; color: var(--ink-sub); }

/* --------------------------------------------------------------------------
   資料ダウンロード一覧
   -------------------------------------------------------------------------- */
.p-doc__free {
  display: inline-block;
  margin-top: 1.4rem;
  padding: .5rem 1.6rem;
  font-size: 1.3rem;
  color: var(--navy);
  background: var(--lightblue);
}
.p-doc__list { display: grid; gap: 4.4rem; }
.p-doc__item {
  display: grid;
  grid-template-columns: minmax(0, 38%) minmax(0, 1fr);
  gap: 3.4rem;
  align-items: center;
  padding: 3rem;
  background: var(--pale);
  border-top: 2px solid var(--gold);
}
.p-doc__media { display: block; overflow: hidden; background: var(--white); }
.p-doc__media img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: contain;
  transition: transform .5s var(--ease);
}
.p-doc__media:hover img { transform: scale(1.04); }
.p-doc__label {
  display: inline-block;
  margin-bottom: 1.2rem;
  padding: .4rem 1.4rem;
  font-size: 1.2rem;
  letter-spacing: .08em;
  color: var(--white);
  background: var(--gold);
}
.p-doc__title {
  margin-bottom: 1.4rem;
  font-family: var(--serif);
  font-size: 2.1rem;
  font-weight: 500;
  line-height: 1.6;
  color: var(--navy);
}
.p-doc__title a { color: inherit; text-decoration: none; }
.p-doc__title a:hover { color: var(--gold); }
.p-doc__lead { margin-bottom: 1.6rem; font-size: 1.5rem; line-height: 1.95; }
.p-doc__points { margin-bottom: 2.2rem; }
.p-doc__points li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: .6rem;
  font-size: 1.4rem;
  line-height: 1.8;
}
.p-doc__points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .95rem;
  width: .8rem;
  height: 1px;
  background: var(--gold);
}
.p-doc__btn { margin: 0; }

/* --------------------------------------------------------------------------
   CV強化CTA（記事内インライン）
   -------------------------------------------------------------------------- */
.c-ctainline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.6rem 2.4rem;
  margin: 4.4rem 0;
  padding: 2.4rem 2.8rem;
  background: var(--lightblue);
  border-left: 3px solid var(--gold);
}
.c-ctainline__text { flex: 1 1 32rem; margin: 0; font-size: 1.5rem; line-height: 1.85; }
.c-ctainline__text strong { color: var(--navy); }
.c-ctainline__btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 1.2rem;
  padding: 1.3rem 2.6rem;
  font-size: 1.45rem;
  font-weight: 500;
  letter-spacing: .06em;
  color: var(--white);
  background: var(--navy);
  transition: background-color .3s var(--ease);
}
.c-ctainline__btn:hover { background: var(--gold); }

/* CV強化CTA（記事下ブロック） */
.p-ctadoc { padding: 8rem 0; background: var(--pale); }
.p-ctadoc__head { margin-bottom: 4.4rem; text-align: center; }
.p-ctadoc__head .c-label { display: inline-block; }
.p-ctadoc__head .c-label::after { margin-inline: auto; }
.p-ctadoc__lead { margin-top: 2rem; font-size: 1.5rem; line-height: 2; }
.p-ctadoc__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2.4rem;
  align-items: stretch;
}
.p-ctadoc__item {
  display: flex;
  flex-direction: column;
  padding: 3rem 2.6rem;
  background: var(--white);
  border-top: 3px solid var(--line);
}
.p-ctadoc__item--doc { border-top-color: var(--gold); box-shadow: 0 1.2rem 3rem rgba(18, 49, 78, .09); }
.p-ctadoc__step {
  margin-bottom: 1.4rem;
  font-family: var(--garamond);
  font-size: 1.5rem;
  letter-spacing: .12em;
  color: var(--gold);
}
.p-ctadoc__step span {
  display: block;
  margin-top: .4rem;
  font-family: var(--sans);
  font-size: 1.3rem;
  letter-spacing: .04em;
  color: var(--ink-sub);
}
.p-ctadoc__title {
  margin-bottom: 1.4rem;
  font-family: var(--serif);
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 1.6;
  color: var(--navy);
}
.p-ctadoc__text { margin-bottom: 2.4rem; font-size: 1.4rem; line-height: 1.95; }
.p-ctadoc__text strong { color: var(--navy); }
.p-ctadoc__btn { margin: auto 0 0; }
.p-ctadoc__btn .c-btn { width: 100%; justify-content: center; }
.p-ctadoc__tel { margin-top: 1.4rem; text-align: center; }
/* 🔴 資料ダウンロードCTAの電話番号も同じ理由でサンセリフへ。指摘は無料相談・お問い合わせの
      2ページだったが、**同じ電話番号を別コンポーネントでガラモンドのまま出していた**ので
      あわせて直した（残すと同じ指摘が次に来る）。 */
.p-ctadoc__tel a {
  font-family: var(--sans);
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: .04em;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
  color: var(--navy);
  white-space: nowrap;
}
.p-ctadoc__tel span { display: block; font-size: 1.25rem; color: var(--ink-sub); }

/* CV強化CTA（追従） */
.c-sticky {
  position: fixed;
  right: 2rem;
  bottom: 2rem;
  z-index: 60;
  display: flex;
  flex-direction: column;
  gap: .8rem;
  width: 20rem;
}
.c-sticky a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  padding: 1.4rem 1.6rem;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: .04em;
  text-align: center;
  box-shadow: 0 .6rem 2rem rgba(12, 32, 53, .22);
  transition: opacity .3s var(--ease);
}
.c-sticky a:hover { opacity: .88; }
.c-sticky__doc { color: var(--navy); background: var(--white); border: 1px solid var(--navy); }
.c-sticky__consult { color: var(--white); background: var(--gold); }
.c-sticky__label {
  padding: .2rem .8rem;
  font-size: 1.1rem;
  color: var(--white);
  background: var(--gold);
}
.c-sticky__doc .c-sticky__label { background: var(--navy); }

/* --------------------------------------------------------------------------
   特別対談・成約実績 詳細
   -------------------------------------------------------------------------- */
.p-iv { padding: 7rem 0 0; }
.p-iv__head { margin-bottom: 3rem; }
.p-iv__badge {
  display: inline-block;
  margin-bottom: 1.6rem;
  padding: .5rem 1.6rem;
  font-size: 1.3rem;
  letter-spacing: .08em;
  color: var(--white);
  background: var(--gold);
}
.p-wk__cat {
  display: inline-block;
  margin-bottom: 1.6rem;
  padding: .5rem 1.6rem;
  font-size: 1.3rem;
  letter-spacing: .08em;
  color: var(--navy);
  background: var(--lightblue);
}
.p-iv__title {
  margin-bottom: 1.6rem;
  font-family: var(--serif);
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .04em;
  color: var(--navy);
}
.p-iv__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.6rem;
  margin-bottom: 2rem;
  font-size: 1.35rem;
  color: var(--ink-sub);
}
.p-iv__industry { padding: .3rem 1.2rem; background: var(--pale); }
.p-iv__lead { font-size: 1.6rem; line-height: 2.05; }
.p-iv__hero { margin-bottom: 4rem; }
.p-iv__hero img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.p-iv__body { padding: 0; }
.p-iv__body h2 { margin-top: 4.4rem; }
.p-iv__body h2:first-child { margin-top: 0; }

.p-wk__talklink { margin-top: 1.6rem; }
.p-wk__talklink a {
  display: inline-flex;
  align-items: center;
  gap: 1.2rem;
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--navy);
}
.p-wk__talklink a:hover { color: var(--gold); }
.p-talk__badge--inline { position: static; }
.p-wk__detail { padding: 0; margin-top: 4rem; }

/* 企業データ */
.p-ivdata {
  margin-bottom: 4rem;
  padding: 3.4rem 3rem;
  background: var(--pale);
}
.p-ivdata__title {
  margin-bottom: 2.4rem;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--navy);
  text-align: center;
}
.p-ivdata__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(28rem, 1fr));
  gap: 2.4rem;
}
.p-ivdata__col {
  padding: 2.4rem;
  background: var(--white);
  border-top: 2px solid var(--navy);
}
.p-ivdata__col--buyer { border-top-color: var(--gold); }
.p-ivdata__label {
  margin-bottom: 1.2rem;
  font-size: 1.3rem;
  letter-spacing: .1em;
  color: var(--gold);
}
.p-ivdata__col--seller .p-ivdata__label { color: var(--navy); }
.p-ivdata__name {
  margin-bottom: 1.6rem;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  color: var(--navy);
}
.p-ivdata__rows > div {
  display: grid;
  grid-template-columns: 8rem minmax(0, 1fr);
  gap: 1.2rem;
  padding: .9rem 0;
  border-bottom: 1px dashed var(--line);
}
.p-ivdata__rows dt { font-size: 1.3rem; color: var(--ink-sub); }
.p-ivdata__rows dd { margin: 0; font-size: 1.45rem; font-weight: 500; color: var(--ink); }
.p-ivdata__note { margin-top: 1.6rem; padding-top: 1.6rem; border-top: 1px solid var(--line); }
.p-ivdata__note-title { margin-bottom: .6rem; font-size: 1.3rem; color: var(--gold); }
.p-ivdata__note-text { font-size: 1.4rem; line-height: 1.9; }

/* 対談動画 */
.p-ivmovie { margin: 5rem 0; }
.p-ivmovie--archive { margin: 0; padding: 8rem 0; background: var(--pale); }
.p-ivmovie__title {
  margin-bottom: 2.6rem;
  font-family: var(--serif);
  font-size: 2.2rem;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--navy);
}
.p-ivmovie__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(32rem, 1fr));
  gap: 3rem;
}
.p-ivmovie__frame {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--navy-deep);
}
.p-ivmovie__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.p-ivmovie__cap { margin-top: 1.2rem; font-size: 1.45rem; font-weight: 500; line-height: 1.7; color: var(--navy); }
.p-ivmovie__sub { margin-top: .6rem; font-size: 1.4rem; line-height: 1.85; color: var(--ink-sub); }
.p-ivmovie__from { margin-top: 1rem; font-size: 1.4rem; }
.p-ivmovie__from a { display: inline-flex; align-items: center; gap: .8rem; color: var(--ink-sub); }
.p-ivmovie__from a:hover { color: var(--gold); }

/* 対談 ↔ 実績の相互リンク */
.p-ivworks { margin: 4rem 0 2rem; }
.p-ivworks__label { margin-bottom: 1rem; font-size: 1.3rem; letter-spacing: .08em; color: var(--gold); }
.p-ivworks__card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.2rem 2.4rem;
  padding: 2.2rem 2.6rem;
  background: var(--lightblue);
  transition: background-color .3s var(--ease);
}
.p-ivworks__card:hover { background: #DCE8F4; }
.p-ivworks__title { font-family: var(--serif); font-size: 1.7rem; font-weight: 500; color: var(--navy); }

/* 対談カード（一覧・関連） */
.p-talk__list--archive { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.p-talk__body { padding: 2.4rem 2.4rem 0; }
.p-talk__body .p-talk__title { margin: 0 0 1.2rem; }
.p-talk__tags { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.2rem; }
.p-talk__tags span {
  padding: .3rem 1rem;
  font-size: 1.4rem; /* 2026-08-20 12px は本文最小14pxの規程に反するので引き上げ（一覧・TOP共通） */
  color: var(--navy);
  background: var(--lightblue);
}
.p-talk__lead-text { margin-bottom: 1.6rem; font-size: 1.4rem; line-height: 1.9; color: var(--ink-sub); }
.p-talk__more { margin-top: 4rem; text-align: center; }
.p-talk--related { background: var(--white); padding-top: 0; }

/* サムネイル画像が無い記事の自動生成カード（バナー作成を不要にするための代替表示） */
.p-talk__media--gen {
  display: grid;
  place-content: center;
  gap: .8rem;
  aspect-ratio: 16 / 10;
  padding: 2rem;
  text-align: center;
  background:
    radial-gradient(circle at 20% 15%, rgba(176, 141, 87, .28), transparent 55%),
    linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
}
.p-talk__gen-en {
  font-family: var(--garamond);
  font-size: 2.6rem;
  font-style: italic;
  letter-spacing: .08em;
  color: var(--gold-light);
}
.p-talk__gen-ja {
  font-family: var(--serif);
  font-size: 1.6rem;
  letter-spacing: .1em;
  color: var(--white);
}
.p-talk__play {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 5.6rem;
  height: 5.6rem;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
}
.p-talk__play::after {
  content: "";
  position: absolute;
  left: 54%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: .9rem 0 .9rem 1.5rem;
  border-color: transparent transparent transparent var(--navy);
}

/* --------------------------------------------------------------------------
   コンサルタント紹介（一覧カード／詳細）
   -------------------------------------------------------------------------- */
.p-member__link { display: flex; flex-direction: column; height: 100%; }
.p-member__head { margin-bottom: 1.2rem; }
.p-member__link .p-member__name { margin-bottom: 0; }
.p-member__tags { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.2rem; }
.p-member__tags span {
  padding: .3rem 1rem;
  font-size: 1.2rem;
  color: var(--navy);
  background: var(--lightblue);
}
.p-member__tags .p-member__deals { color: var(--white); background: var(--gold); }
.p-member__link .p-member__msg {
  margin-bottom: 1.6rem;
  font-size: 1.4rem;
  line-height: 1.9;
  color: var(--ink-sub);
}
.p-member__link .c-more { margin-top: auto; align-self: flex-start; font-size: 1.35rem; }
.p-member__link:hover .p-member__name { color: var(--gold); }
.p-member__img { position: relative; }
.p-member__link .p-member__img img { transition: transform .6s var(--ease); }
.p-member__link:hover .p-member__img img { transform: scale(1.05); }

/* メイン写真が無い場合のプレースホルダー（レイアウトを崩さない） */
.p-member__img--gen {
  display: grid;
  place-items: center;
  aspect-ratio: 3 / 4;
  background:
    radial-gradient(circle at 30% 20%, rgba(176, 141, 87, .25), transparent 60%),
    linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
}
.p-member__initial {
  font-family: var(--serif);
  font-size: 5.6rem;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .82);
}
.p-member--related { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.4rem; }
.p-member--related .p-member__img { margin-bottom: 1.4rem; }

.p-mem__hero { padding: 6rem 0; background: var(--pale); }
.p-mem__hero-inner {
  display: grid;
  grid-template-columns: 32rem minmax(0, 1fr);
  gap: 4.4rem;
  align-items: start;
}
.p-mem__photo { overflow: hidden; background: var(--lightblue); }
.p-mem__photo img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.p-mem__photo--gen {
  display: grid;
  place-items: center;
  aspect-ratio: 3 / 4;
  background:
    radial-gradient(circle at 30% 20%, rgba(176, 141, 87, .25), transparent 60%),
    linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
}
.p-mem__initial {
  font-family: var(--serif);
  font-size: 8rem;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .82);
}
.p-mem__role { margin-bottom: .6rem; font-size: 1.4rem; color: var(--ink-sub); }
.p-mem__name {
  margin-bottom: 2.4rem;
  font-family: var(--serif);
  font-size: 3.4rem;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--navy);
}
.p-mem__msg {
  margin: 0 0 2.6rem;
  padding: 1.8rem 2.2rem;
  font-family: var(--serif);
  font-size: 1.7rem;
  line-height: 1.9;
  color: var(--navy);
  background: var(--white);
  border-left: 3px solid var(--gold);
}
.p-mem__spec { margin-bottom: 2.6rem; }
.p-mem__spec > div {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr);
  gap: 1.6rem;
  padding: 1.1rem 0;
  border-bottom: 1px solid var(--line);
}
.p-mem__spec dt { font-size: 1.35rem; color: var(--ink-sub); }
.p-mem__spec dd { margin: 0; font-size: 1.5rem; }
.p-mem__spec .p-mem__tags { display: flex; flex-wrap: wrap; gap: .6rem; }
.p-mem__spec .p-mem__tags span {
  padding: .3rem 1rem;
  font-size: 1.25rem;
  color: var(--navy);
  background: var(--lightblue);
}
.p-mem__deals { font-family: var(--garamond); font-size: 2rem; color: var(--gold); }
.p-mem__cta { margin: 0; }
.p-mem__body { margin-bottom: 4.4rem; }
.p-mem__body h2 { margin-bottom: 2.4rem; }
.p-mem__link { margin-top: 1.6rem; font-size: 1.4rem; }
.p-mem__link a { color: var(--navy); text-decoration: underline; }
.p-mem__link a:hover { color: var(--gold); }

/* 仕事風景（0〜3枚。枚数に応じて列数が変わるので、何枚でも崩れない） */
.p-mem__scenes h2 { margin-bottom: 2.4rem; }
.p-mem__scene-list {
  display: grid;
  grid-template-columns: repeat(min(var(--n, 1), 3), minmax(0, 1fr));
  gap: 2.4rem;
}
.p-mem__scene figure { margin: 0; }
.p-mem__scene img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.p-mem__scene figcaption { margin-top: .8rem; font-size: 1.3rem; line-height: 1.8; color: var(--ink-sub); }

/* --------------------------------------------------------------------------
   レスポンシブ（本ブロックの追加分。既存のメディアクエリより後に置くこと）
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1024px) {
  .c-flow__item { grid-template-columns: 20rem minmax(0, 1fr); gap: 2.4rem; }
  .p-feature__inner { grid-template-columns: 1fr; gap: 3.4rem; }
  .p-feature__block--rev .p-feature__inner { direction: ltr; }
  .p-ctadoc__list { grid-template-columns: 1fr; }
  .p-talk__list--archive { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-talk__list--archive .p-talk__item:last-child { grid-column: auto; max-width: none; margin-inline: 0; }
  .p-doc__item { grid-template-columns: 1fr; gap: 2.4rem; }
  .p-mem__hero-inner { grid-template-columns: 24rem minmax(0, 1fr); gap: 3rem; }
  .p-member--related { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .c-sticky { width: 17rem; right: 1.4rem; bottom: 1.4rem; }
}

@media screen and (max-width: 767px) {
  .c-faq__q { font-size: 1.5rem; padding: 2rem 3.4rem 2rem 0; gap: 1.2rem; }
  .c-faq__q::after { top: 2.8rem; }
  .c-faq__mark { width: 2.8rem; height: 2.8rem; font-size: 1.6rem; }
  .c-faq__a { padding: 0 0 2.4rem; gap: 1.2rem; }
  .c-faq__a-body p { font-size: 1.45rem; }

  .c-flow__item { grid-template-columns: 1fr; gap: 1.2rem; padding: 2.6rem 0; }
  .c-flow__step { font-size: 2.8rem; }
  .c-flow__title { font-size: 1.75rem; }
  .c-flow__body p { font-size: 1.45rem; }

  .p-feature__block { padding: 3.4rem 0; }
  .p-feature__title { font-size: 1.9rem; }
  .p-feature__text { font-size: 1.45rem; }
  .p-feature__en { font-size: 4rem; right: 0; bottom: -1.6rem; }

  .c-form__title { font-size: 2.1rem; }
  .c-form__trust { flex-direction: column; align-items: flex-start; gap: .8rem; padding: 1.8rem; }
  .c-form__body .form_btn,
  .c-form__body input[type="submit"] { min-width: 100%; }
  .c-form__tel-num a { font-size: 2.8rem; }
  .c-ministep { grid-template-columns: 1fr; gap: 1.2rem; }
  .c-ministep__item:not(:last-child)::after {
    right: 50%;
    top: auto;
    bottom: -1.4rem;
    transform: translateX(50%) rotate(135deg);
  }

  .p-doc__item { padding: 2rem; }
  .p-doc__title { font-size: 1.8rem; }

  .c-ctainline { flex-direction: column; align-items: stretch; padding: 2rem; }
  .c-ctainline__btn { justify-content: center; }
  .p-ctadoc { padding: 5.6rem 0; }
  .p-ctadoc__item { padding: 2.4rem 2rem; }

  .c-sticky {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    flex-direction: row;
    gap: 0;
  }
  .c-sticky a { flex: 1 1 50%; padding: 1.4rem .8rem; font-size: 1.3rem; box-shadow: none; }
  .c-sticky__doc { border: 0; border-top: 1px solid var(--line); }
  body:has(.c-sticky) { padding-bottom: 5.6rem; }

  .p-iv { padding: 4.8rem 0 0; }
  .p-iv__title { font-size: 2.2rem; }
  .p-iv__lead { font-size: 1.5rem; }
  .p-ivdata { padding: 2.4rem 1.8rem; }
  .p-ivdata__grid { grid-template-columns: 1fr; }
  .p-ivdata__col { padding: 2rem 1.8rem; }
  .p-ivdata__rows > div { grid-template-columns: 7rem minmax(0, 1fr); gap: .8rem; }
  .p-ivmovie--archive { padding: 5.6rem 0; }
  .p-ivmovie__list { grid-template-columns: 1fr; }
  .p-ivmovie__title { font-size: 1.9rem; }
  .p-ivworks__card { padding: 1.8rem; }
  .p-ivworks__title { font-size: 1.5rem; }

  .p-talk__list--archive { grid-template-columns: 1fr; }
  .p-talk__body { padding: 2rem 2rem 0; }
  .p-talk__body .p-talk__title { font-size: 1.6rem; margin: 0 0 1.2rem; }
  .p-talk__gen-en { font-size: 2.1rem; }
  .p-talk__gen-ja { font-size: 1.4rem; }

  .p-mem__hero { padding: 3.4rem 0; }
  .p-mem__hero-inner { grid-template-columns: 1fr; gap: 2.4rem; }
  .p-mem__photo { max-width: 24rem; }
  .p-mem__name { font-size: 2.6rem; margin-bottom: 1.8rem; }
  .p-mem__msg { font-size: 1.5rem; padding: 1.4rem 1.6rem; }
  .p-mem__spec > div { grid-template-columns: 9rem minmax(0, 1fr); gap: 1rem; }
  .p-mem__scene-list { grid-template-columns: 1fr; }
  .p-member--related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-member__initial { font-size: 4.4rem; }
}

/* 成約実績カードの「▶ 特別対談はこちら」ボタン（資料 TOP-07 準拠） */
.p-works__talkbtn { margin-top: 1.2rem; }
.p-works__talkbtn a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  padding: 1.1rem 1.6rem;
  font-size: 1.35rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--white);
  background: var(--gold);
  transition: background-color .3s var(--ease);
}
.p-works__talkbtn a:hover { background: var(--navy); }
.p-works__talkbtn span { font-size: 1.1rem; }
.p-works__item { display: flex; flex-direction: column; }
.p-works__item .p-works__card { flex: 1 1 auto; }


/* ==========================================================================
   10. 下層ページのトーン調整（2026-08-04）
   方針：既存サイトの品質を土台に、下層は「白＋ベージュ」の落ち着いた面で構成する。
        情報量より可読性を優先し、読み進めた先にCTAが自然に現れる流れをつくる。
   TOP（front-page）の配色は承認済みのため変更しない。ここで差し替えるのは下層で使う面だけ。
   ========================================================================== */

:root {
  --beige: #F8F5EF;       /* 下層の基調となる淡いベージュ */
  --beige-deep: #F0EADF;  /* 一段濃い面・境界に使う */
  --beige-line: #E4DACA;  /* ベージュ面上の罫線 */
}

/* 下層で使っている面をベージュへ寄せる（TOPで使う .p-talk / .p-business 等は対象外） */
.p-feature__block:nth-child(odd),
.c-filter,
.c-form__tel,
.p-doc__item,
.c-ministep__item,
.p-ctadoc,
.p-mem__hero,
.p-ivdata,
.p-ivmovie--archive,
.p-iv__industry { background: var(--beige); }

.p-ctadoc__item { border-top-color: var(--beige-line); }
.p-ivdata__col { border-radius: 2px; }
.c-form__alt-list a { background: var(--beige); }
.c-form__alt-list a:hover { background: var(--beige-deep); }

/* 信頼バッジ帯はライトブルーのままだと強いのでベージュ寄りに */
.c-form__trust { background: var(--beige-deep); }

/* 記事内インラインCTAは「読んでいる流れを止めない」濃度に */
.c-ctainline { background: var(--beige-deep); border-left-color: var(--gold); }

/* パネルはベージュ／ブルーの2種類を使い分ける（--blue は結論・CTA用に温存） */
.p-lower__panel { background: var(--beige); }
.p-lower__panel--blue { background: var(--lightblue); }

/* --------------------------------------------------------------------------
   可読性（精読率）
   -------------------------------------------------------------------------- */

/* 本文の行間をわずかに広げ、1行の文字数を抑える */
.p-lower p,
.c-faq__a-body p,
.p-feature__text { line-height: 2.15; }
/* 🔴 ch は「0」の字幅基準なので日本語では極端に狭くなる（62ch≒480px）。
   コンテナ側（l-inner--narrow 920px）で行長を制御し、本文に max-width は掛けない。 */

/* 見出し前後のリズム（節の切れ目を意識させる） */
.p-lower h2 { margin-top: 0; }
.p-lower__block + .p-lower__block { margin-top: 7rem; }

/* 読み取り対象になる小さな文字は14px下限に揃える（KEI STUDIO 規程） */
.p-works__meta dt,
.p-works__meta dd { font-size: 1.4rem; }
.p-ivmovie__from,
.p-ivmovie__from a { font-size: 1.4rem; }
/* CF7が本文中にインラインstyleで12pxを直書きしている箇所の是正 */
.c-form__body .form_row p[style*="font-size"] { font-size: 1.4rem !important; color: var(--ink-sub); }

/* --------------------------------------------------------------------------
   スクロールに合わせたフェードアップ
   JSが動いたときだけ透明にする（JS無効でも本文が消えないようにするため）
   -------------------------------------------------------------------------- */
html.js-fade-on .js-fade {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
  will-change: opacity, transform;
}
html.js-fade-on .js-fade.is-inview {
  opacity: 1;
  transform: none;
}

/* 動きを減らす設定の環境ではアニメーションしない */
@media (prefers-reduced-motion: reduce) {
  html.js-fade-on .js-fade {
    opacity: 1;
    transform: none;
    transition: none;
  }
  html { scroll-behavior: auto; }
}

@media screen and (max-width: 767px) {
  .p-lower__block + .p-lower__block { margin-top: 5rem; }
  .p-lower p, .c-faq__a-body p, .p-feature__text { line-height: 2.05; }
  html.js-fade-on .js-fade { transform: translateY(16px); }
}

/* バッジ類も本文と同じ下限（14px）に揃える */
.p-talk__badge,
.p-works__badge { font-size: 1.4rem; }

/* .p-lower a:not([class]) の下線指定より詳細度を上げて打ち消す */
.p-lower .p-doc__title a,
.p-lower .p-mem__link a,
.p-lower .p-ivworks__card { text-decoration: none; }
.p-lower .p-doc__title a:hover { color: var(--gold); text-decoration: none; }


/* ==========================================================================
   11. 追加調整（2026-08-04 指摘対応）
   ========================================================================== */

/* --------------------------------------------------------------------------
   サービス・料金：TOPの「私たちの事業」と同じ斜め紺帯＋通し番号
   -------------------------------------------------------------------------- */
.p-svc__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5rem 3.4rem;
}
.p-svc__item { display: flex; flex-direction: column; }
.p-svc__media {
  position: relative;
  overflow: hidden;
  margin-bottom: 2.4rem;
  background: var(--lightblue);
}
.p-svc__media img {
  width: 100%;
  aspect-ratio: 62 / 34;
  object-fit: cover;
  transition: transform .7s var(--ease);
}
.p-svc__item:hover .p-svc__media img { transform: scale(1.04); }

/* 通し番号（画像の左上。ゴールドの罫を添えて記号的に見せる） */
.p-svc__num {
  position: absolute;
  left: 1.8rem;
  top: 1.2rem;
  padding-bottom: .6rem;
  font-family: var(--garamond);
  font-size: 4.6rem;
  font-style: italic;
  line-height: 1;
  letter-spacing: .04em;
  color: var(--gold-light);
  text-shadow: 0 .2rem 1.6rem rgba(12, 32, 53, .65);
  pointer-events: none;
}
.p-svc__num::after {
  content: "";
  position: absolute;
  left: .2rem;
  bottom: 0;
  width: 2.6rem;
  height: 2px;
  background: var(--gold-light);
  box-shadow: 0 .1rem .6rem rgba(12, 32, 53, .5);
}

/* 斜めに切った紺帯（TOP p-business__ribbon と同じ形）
   左右は clip-path で削られるので、その分だけ内側に余白を取って文字が欠けないようにする */
/* 🔴 .p-lower h3（詳細度0,1,1）が color:navy と margin-bottom を当ててくるため、
   ここは必ず .p-lower を含めた詳細度で打ち消す。
   打ち消さないと「紺帯の上に紺文字」で読めなくなり、帯の位置も margin 分ずれる。 */
.p-lower .p-svc__ribbon {
  position: absolute;
  left: -1px;
  right: -1px;
  bottom: -1px;
  padding: 1.4rem 3.8rem;
  font-family: var(--serif);
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: .06em;
  line-height: 1.45;
  text-align: center;
  color: var(--white);
  background: rgba(18, 49, 78, .93);
  clip-path: polygon(2.2rem 0, 100% 0, calc(100% - 2.2rem) 100%, 0 100%);
  word-break: keep-all;
  overflow-wrap: anywhere;
  margin: 0;
}
.p-lower .p-svc__text { margin-bottom: 0; }
.p-svc__text { font-size: 1.5rem; line-height: 2.05; }

/* --------------------------------------------------------------------------
   直前がベージュ帯のときにパネルが密着していた問題
   -------------------------------------------------------------------------- */
.p-feature .p-lower__panel,
.p-lower__panel.p-lower__block { margin-top: 7rem; }

/* --------------------------------------------------------------------------
   特別対談の本文（話者の区別・埋め込み動画）
   -------------------------------------------------------------------------- */

/* 本文に直接置かれた YouTube を 16:9 に矯正（元は width/height="100%" で潰れていた） */
.p-iv__embed {
  position: relative;
  aspect-ratio: 16 / 9;
  max-width: 76rem;
  margin: 3rem auto;
  background: var(--navy-deep);
}
.p-iv__embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* 発言の行 */
.p-iv__body .p-iv__line {
  position: relative;
  margin: 0;
  padding: 1.8rem 0 1.8rem 0;
  font-size: 1.55rem;
  line-height: 2.1;
  border-top: 1px solid var(--line);
}
.p-iv__body .p-iv__line:first-child { border-top: 0; }

/* 話者名（丸アイコン＋氏名） */
.p-iv__speaker {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  margin-right: 1.2rem;
  vertical-align: baseline;
}
.p-iv__avatar {
  display: inline-grid;
  place-items: center;
  width: 2.8rem;
  height: 2.8rem;
  flex: none;
  font-family: var(--serif);
  font-size: 1.4rem;
  line-height: 1;
  color: var(--white);
  background: var(--navy);
  border-radius: 50%;
}
.p-iv__spname {
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--navy);
}
/* 人ごとに濃淡を変える */
.p-iv__speaker--0 .p-iv__avatar { background: var(--navy); }
.p-iv__speaker--0 .p-iv__spname { color: var(--navy); }
.p-iv__speaker--1 .p-iv__avatar { background: var(--gold); }
.p-iv__speaker--1 .p-iv__spname { color: #8A6C3D; }
.p-iv__speaker--2 .p-iv__avatar { background: var(--navy-mid); }
.p-iv__speaker--2 .p-iv__spname { color: var(--navy-mid); }
.p-iv__speaker--3 .p-iv__avatar { background: #7C8A99; }
.p-iv__speaker--3 .p-iv__spname { color: var(--ink-sub); }

/* 対談本文の小見出し（話題の切れ目） */
.p-iv__body h3 {
  margin: 4.4rem 0 1.6rem;
  padding-bottom: 1rem;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: .06em;
  color: var(--navy);
  border-bottom: 1px solid var(--gold);
}
.p-iv__body h3:first-child { margin-top: 0; }
/* 親テーマ由来のラッパーが余白を持っていても崩れないように */
.p-iv__body .interview-block__inner,
.p-iv__body .section-heading--center { margin: 0; padding: 0; }

/* --------------------------------------------------------------------------
   追従CTA
   2026-08-18 まではPCで出していなかった（固定ヘッダーにCTAがあり、ページトップとも
   重なるため）。クライアント要望でPCでも常時出す方針に変更。
   重なりの解消と、PC2案の出し分けは custom.css 末尾の「追従CTA」ブロックで行う。
   -------------------------------------------------------------------------- */
.c-sticky { display: flex; }

@media screen and (max-width: 1024px) {
  .p-svc__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4rem 2.6rem; }
}

@media screen and (max-width: 767px) {
  .p-svc__list { grid-template-columns: 1fr; gap: 3.4rem; }
  .p-svc__ribbon { font-size: 1.55rem; padding: 1.2rem 1.6rem; }
  .p-svc__num { font-size: 4.2rem; left: 1.2rem; }
  .p-feature .p-lower__panel,
  .p-lower__panel.p-lower__block { margin-top: 4.8rem; }
  .p-iv__embed { margin: 2.4rem auto; }
  .p-iv__body .p-iv__line { padding: 1.4rem 0; font-size: 1.45rem; }
  .p-iv__body h3 { font-size: 1.75rem; margin-top: 3.4rem; }

  /* スマホは画面下部に固定して出す */
  .c-sticky { display: flex; }
}

/* 印刷・PDF化のときはフェード前提の透明を無効にする */
@media print {
  html.js-fade-on .js-fade { opacity: 1 !important; transform: none !important; }
  .c-sticky { display: none !important; }
}

/* 日付・カテゴリ・ラベル類も14px下限に揃える（読み取り対象のため） */
.p-column__meta,
.p-iv__badge,
.p-iv__meta,
.p-ivdata__label,
.p-ivworks__label,
.p-wk__cat { font-size: 1.4rem; }

/* スマホ幅で13.5pxまで縮んでいた箇所を14px下限に戻す
   既存のブレークポイントが 768px なので、こちらも 768px に合わせないと効かない */
@media screen and (max-width: 768px) {
  .p-mv__lead,
  .p-talk__movie-cap { font-size: 1.4rem; }
}

/* 対談本文の写真・補足ボックス */
.p-iv__fig { margin: 3rem 0; }
.p-iv__fig img { width: 100%; max-width: 52rem; height: auto; display: block; margin-inline: auto; }
.p-iv__fig figcaption {
  max-width: 52rem;
  margin: 1rem auto 0;
  font-size: 1.35rem;
  line-height: 1.8;
  color: var(--ink-sub);
  text-align: center;
}
.p-lower .p-iv__note {
  margin: 3rem 0;
  padding: 2.4rem 2.6rem;
  background: var(--beige);
  border-left: 3px solid var(--gold);
}
.p-lower .p-iv__note p { margin-bottom: 1.4rem; font-size: 1.45rem; line-height: 1.95; }
.p-lower .p-iv__note p:last-child { margin-bottom: 0; }
.p-lower .p-iv__note .p-iv__fig { margin: 1.6rem 0; }
.p-lower .p-iv__note .p-iv__fig img { max-width: 26rem; }

@media screen and (max-width: 768px) {
  .p-iv__fig { margin: 2.4rem 0; }
  .p-lower .p-iv__note { padding: 1.8rem; }
}

/* 企業データの補足見出しも14px下限に */
.p-ivdata__note-title { font-size: 1.4rem; }

/* --------------------------------------------------------------------------
   記事系ページのセクション間の余白（2026-08-04 指摘対応）
   本文コンテナに下余白が無く、次のセクションの背景帯と本文が接していた。
   -------------------------------------------------------------------------- */

/* 本文の終わり → 次の帯（Next Step / 関連セクション） */
.p-iv > .l-inner--narrow { padding-bottom: 7rem; }

/* 「この対談の成約実績」カードが帯に接していた */
.p-ivworks { margin: 4.4rem 0 0; }

/* 「ほかの特別対談」を padding-top: 0 にしていたため見出しが帯の直下にあった */
.p-talk--related { padding-top: 7rem; }

/* 事例詳細も同じ構造なので、関連事例の前後に余白を持たせる */
.p-wk + .p-lower--tight,
.p-lower--tight { padding-top: 7rem; }

/* 本文最後の段落が詰まって見えないように */
.p-iv__body > *:last-child,
.p-wk__detail > *:last-child { margin-bottom: 0; }

@media screen and (max-width: 768px) {
  .p-iv > .l-inner--narrow { padding-bottom: 4.8rem; }
  .p-ivworks { margin-top: 3.4rem; }
  .p-talk--related { padding-top: 4.8rem; }
  .p-lower--tight { padding-top: 4.8rem; }
}


/* ==========================================================================
   12. コラム／お知らせ 詳細（2026-08-04 追加）
   旧デザインは記事を青い枠に載せていたが、他ページと同じ「白地＋節の区切り」に統一する。
   ========================================================================== */
.p-post { padding: 7rem 0 0; }
.p-post__head { margin-bottom: 3.4rem; }
.p-post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.2rem 1.6rem;
  margin-bottom: 1.8rem;
  font-size: 1.4rem;
  color: var(--ink-sub);
}
.p-post__cat {
  padding: .5rem 1.6rem;
  font-size: 1.35rem;
  letter-spacing: .06em;
  color: var(--white);
  background: var(--navy);
  transition: background-color .3s var(--ease);
}
.p-post__cat:hover { background: var(--gold); }
.p-post__updated { font-size: 1.35rem; }
.p-post__title {
  font-family: var(--serif);
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .03em;
  color: var(--navy);
}
.p-post__hero { margin-bottom: 4rem; }
.p-post__hero img { width: 100%; height: auto; }

/* 本文 */
.p-post__body { padding: 0; }
.p-post__body > h2 {
  margin: 6rem 0 2.4rem;
  padding: 0 0 1.4rem;
  font-family: var(--serif);
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .04em;
  color: var(--navy);
  border-bottom: 1px solid var(--line);
  position: relative;
}
.p-post__body > h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 6rem;
  height: 2px;
  background: var(--gold);
}
.p-post__body > h2:first-child { margin-top: 0; }
.p-post__body h3 {
  margin: 4rem 0 1.8rem;
  padding-left: 1.4rem;
  font-family: var(--serif);
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6;
  color: var(--navy);
  border-left: 3px solid var(--gold);
}
.p-post__body h4 {
  margin: 3rem 0 1.4rem;
  padding-left: 0;
  font-size: 1.7rem;
  font-weight: 700;
  color: var(--navy);
  border-left: 0;
}
.p-post__body p { margin-bottom: 2.4rem; font-size: 1.6rem; line-height: 2.15; }
.p-post__body img { height: auto; }
.p-post__body figure { margin: 3rem 0; }
.p-post__body ul:not([class]) li,
.p-post__body ol:not([class]) li { font-size: 1.55rem; line-height: 2; }
.p-post__body blockquote {
  margin: 3rem 0;
  padding: 2rem 2.4rem;
  font-size: 1.5rem;
  line-height: 2;
  color: var(--ink-sub);
  background: var(--beige);
  border-left: 3px solid var(--gold);
}
.p-post__body a { color: var(--navy); text-decoration: underline; }
.p-post__body a:hover { color: var(--gold); }

/* 目次（Easy Table of Contents）を他ページと同じトーンに */
.p-post__body #ez-toc-container,
.p-post__body .ez-toc-v2_0_74 {
  margin: 0 0 4rem;
  padding: 2.4rem 2.8rem;
  background: var(--beige);
  border: 0;
  border-left: 3px solid var(--gold);
  border-radius: 0;
  box-shadow: none;
  width: 100%;
}
.p-post__body #ez-toc-container .ez-toc-title {
  font-family: var(--serif);
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: .06em;
  color: var(--navy);
}
.p-post__body #ez-toc-container ul { margin: 1.4rem 0 0; }
.p-post__body #ez-toc-container li { margin-bottom: .8rem; font-size: 1.45rem; line-height: 1.8; }
.p-post__body #ez-toc-container a { color: var(--ink); text-decoration: none; }
.p-post__body #ez-toc-container a:hover { color: var(--gold); text-decoration: underline; }

/* ==========================================================================
   13. プライバシーポリシー／ガイドライン遵守宣言のリスト
   親テーマのクラス（number-list / circle_number_list / brackets_number_list）に
   子テーマ側のスタイルが無く、入れ子のたびに字下げが積み上がって
   本文が階段状に細くなっていた。
   ========================================================================== */
/* 🔴 display:flex のままだと入れ子リストが flex item になり shrink-to-fit で
   幅が階段状に痩せる。番号は ::before 相当の絶対配置に切り替えて block に戻す。 */
.p-lower.p-privacy .number-list > li {
  display: block;
  position: relative;
  margin-bottom: 1.8rem;
  padding-left: 3.4rem;
  font-size: 1.55rem;
  line-height: 2.05;
}
.p-lower.p-privacy .number-list > li > .number {
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 700;
  color: var(--gold);
}
.p-lower.p-privacy .circle_number_list > li,
.p-lower.p-privacy .brackets_number_list > li {
  margin-bottom: 1.2rem;
  padding-left: 0;
  font-size: 1.5rem;
  line-height: 2;
  list-style: none;
}
.p-lower.p-privacy .circle_number_list > li::before,
.p-lower.p-privacy .brackets_number_list > li::before { content: none; }

/* 入れ子リストは字下げを一定にし、幅が痩せないようにする */
.p-lower.p-privacy ul ul,
.p-lower.p-privacy ul ol,
.p-lower.p-privacy ol ul,
.p-lower.p-privacy ol ol {
  width: auto;
  margin: 1rem 0 1.4rem;
  padding-left: 1.6rem;
}
.p-lower.p-privacy ul ul > li,
.p-lower.p-privacy ol ul > li {
  position: relative;
  margin-bottom: .8rem;
  padding-left: 1.6rem;
  font-size: 1.45rem;
  line-height: 1.95;
}
.p-lower.p-privacy ul ul > li::before,
.p-lower.p-privacy ol ul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.15em;
  width: .8rem;
  height: 1px;
  background: var(--gold);
}
.p-privacy .privacy-text-block { margin-bottom: 3.4rem; }
.p-privacy h3 { margin-top: 4rem; }
.p-privacy h4 { margin-top: 2.6rem; }

@media screen and (max-width: 768px) {
  .p-post { padding: 4.8rem 0 0; }
  .p-post__title { font-size: 2.2rem; }
  .p-post__body > h2 { font-size: 2rem; margin-top: 4.4rem; }
  .p-post__body h3 { font-size: 1.75rem; margin-top: 3rem; }
  .p-post__body p { font-size: 1.5rem; line-height: 2.05; }
  .p-post__body #ez-toc-container { padding: 1.8rem; }
  .p-lower.p-privacy .number-list > li { padding-left: 2.8rem; font-size: 1.45rem; }
  .p-privacy ul ul, .p-privacy ul ol, .p-privacy ol ul, .p-privacy ol ol { padding-left: 1rem; }
}

/* --------------------------------------------------------------------------
   記事を読み進めたときに現れる資料請求のオーバーレイCTA
   邪魔をしないことを優先：小さめ・半透明の影・閉じられる・記事下CTAと重ならない
   -------------------------------------------------------------------------- */
.c-float {
  position: fixed;
  right: 2.4rem;
  bottom: 2.4rem;
  z-index: 55;
  width: 30rem;
  padding: 2.2rem 2.2rem 2rem;
  background: rgba(255, 255, 255, .97);
  border-top: 3px solid var(--gold);
  box-shadow: 0 1.2rem 3.6rem rgba(12, 32, 53, .18);
  opacity: 0;
  visibility: hidden;
  transform: translateY(1.6rem);
  transition: opacity .5s var(--ease), transform .5s var(--ease), visibility .5s;
  backdrop-filter: blur(2px);
}
.c-float.is-show { opacity: 1; visibility: visible; transform: none; }
.c-float.is-closed { opacity: 0; transform: translateY(1.6rem); }

.c-float__close {
  position: absolute;
  right: .6rem;
  top: .6rem;
  width: 3rem;
  height: 3rem;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
}
.c-float__close::before,
.c-float__close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1.3rem;
  height: 1px;
  background: var(--ink-sub);
}
.c-float__close::before { transform: translate(-50%, -50%) rotate(45deg); }
.c-float__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.c-float__close:hover::before,
.c-float__close:hover::after { background: var(--gold); }

.c-float__label {
  display: inline-block;
  margin-bottom: 1rem;
  padding: .3rem 1.2rem;
  font-size: 1.2rem;
  letter-spacing: .06em;
  color: var(--white);
  background: var(--gold);
}
.c-float__title {
  margin-bottom: .8rem;
  font-family: var(--serif);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.55;
  color: var(--navy);
}
.c-float__text { margin-bottom: 1.6rem; font-size: 1.3rem; line-height: 1.85; color: var(--ink-sub); }
.c-float__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 1.2rem 1.4rem;
  font-size: 1.45rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--white);
  background: var(--navy);
  transition: background-color .3s var(--ease);
}
.c-float__btn:hover { background: var(--gold); }
.c-float__note { margin-top: .8rem; font-size: 1.2rem; text-align: center; color: var(--ink-sub); }

@media screen and (max-width: 1024px) {
  .c-float { width: 26rem; right: 1.6rem; bottom: 1.6rem; padding: 1.8rem; }
  .c-float__title { font-size: 1.6rem; }
  .c-float__text { display: none; }
}

@media screen and (max-width: 768px) {
  /* スマホは画面下部の帯にして、本文の読みを邪魔しない */
  .c-float {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem 1.2rem;
    padding: 1.2rem 4rem 1.2rem 1.6rem;
    border-top-width: 2px;
    transform: translateY(100%);
  }
  .c-float.is-show { transform: none; }
  .c-float.is-closed { transform: translateY(100%); }
  .c-float__label { margin-bottom: 0; }
  .c-float__title { flex: 1 1 12rem; margin-bottom: 0; font-size: 1.4rem; line-height: 1.5; }
  .c-float__title br { display: none; }
  .c-float__btn { flex: none; padding: 1rem 1.6rem; font-size: 1.35rem; }
  .c-float__note { display: none; }
  .c-float__close { right: .2rem; top: 50%; transform: translateY(-50%); }
  /* 追従バーと重ならないよう、コラム詳細では下部バーを出さない */
  body:has(.c-float) .c-sticky { display: none; }
}

@media print { .c-float { display: none !important; } }

/* ==========================================================================
   コンサルタント紹介：カードの締め感を上げる（2026-08-07 クライアント要望）
   ねらい＝白バックで抜かれた人物写真が白地に溶けて輪郭が消えていたので、
   ①カードを面として立てる ②写真の下に紺のグラデを敷いて人物を浮かせる
   ③氏名まわりに金の罫を入れて視線の止まりどころを作る、の3点。
   PHP・マークアップは変更していない（CSSのみ）。
   ========================================================================== */

.p-member__item {
  position: relative;
  background: var(--white);
  border: 1px solid var(--line);
  border-top: 2px solid var(--gold);
  box-shadow: 0 1px 2px rgba(18, 49, 78, .04);
  transition: border-color .35s var(--ease), box-shadow .35s var(--ease), transform .35s var(--ease);
}
.p-member__item:hover {
  border-color: var(--navy);
  box-shadow: 0 12px 28px rgba(18, 49, 78, .13);
  transform: translateY(-3px);
}

/* 画像はカード上端までフルブリード。テキストだけ内側に寄せる。 */
.p-member__link { padding-bottom: 2.2rem; }
.p-member__link .p-member__head,
.p-member__link .p-member__tags,
.p-member__link .c-more,
.p-member__detail { padding-inline: 2rem; }

/* 白抜き写真を沈ませないための地。上が明るく下が紺で、人物の足元が締まる。 */
.p-member__img {
  margin-bottom: 1.8rem;
  background: linear-gradient(180deg, #F4F7FB 0%, #DCE6F1 55%, #B9CBDE 100%);
}
.p-member__img::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 1px;
  background: var(--line);
}
/* 写真は白バックで抜かれているため、下に敷いた地の色は写真に覆われて見えない。
   写真そのものに薄い陰を掛け算で重ねて、人物の足元を締める。 */
.p-member__img::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(18, 49, 78, 0) 42%, rgba(18, 49, 78, .13) 100%);
  mix-blend-mode: multiply;
}

/* 役職＝金の小文字／氏名＝明朝で大きく。あいだに金の短い罫を1本。 */
.p-member__head { position: relative; margin-bottom: 1.4rem; padding-bottom: 1.4rem; }
.p-member__head::after {
  content: "";
  position: absolute;
  left: 2rem;
  bottom: 0;
  width: 3.2rem;
  height: 2px;
  background: var(--gold);
}
.p-member__link .p-member__role { margin-bottom: .6rem; font-size: 1.25rem; letter-spacing: .1em; }
.p-member__link .p-member__name { font-size: 2rem; letter-spacing: .1em; }

/* タグは枠線だけの控えめな形にして、成約件数バッジ（金ベタ）だけを目立たせる */
.p-member__tags span {
  background: transparent;
  border: 1px solid var(--line);
  color: var(--ink-sub);
}
.p-member__tags .p-member__deals { border-color: var(--gold); color: var(--white); background: var(--gold); }

/* ひとことは面をベージュに変えて、左に金の縦線。カード内の「引用」として読ませる。 */
.p-member__link .p-member__msg {
  margin-inline: 2rem;
  padding: 1.2rem 1.4rem;
  background: var(--beige);
  border: 0;
  border-left: 2px solid var(--gold);
}

/* 導線はカード下端。ホバーで下線が左から伸びる。 */
.p-member__link .c-more { margin-top: 1.8rem; }
.p-member__link:hover .p-member__name { color: var(--navy); }
.p-member__link:hover .c-more { color: var(--gold); }

/* 写真なしのイニシャル面も、写真ありと同じ重さに揃える */
.p-member__img--gen { background: linear-gradient(180deg, #F4F7FB 0%, #DCE6F1 55%, #B9CBDE 100%); }
.p-member__initial { color: var(--navy); opacity: .38; }

/* 関連コンサルタント（詳細ページ下部）は小さいので、枠だけ効かせて影は出さない */
.p-member--related .p-member__item { box-shadow: none; }
.p-member--related .p-member__item:hover { transform: none; box-shadow: 0 8px 18px rgba(18, 49, 78, .1); }

@media (max-width: 768px) {
  .p-member__link .p-member__head,
  .p-member__link .p-member__tags,
  .p-member__link .c-more,
  .p-member__detail { padding-inline: 1.4rem; }
  .p-member__link .p-member__msg { margin-inline: 1.4rem; }
  .p-member__head::after { left: 1.4rem; }
  .p-member__link .p-member__name { font-size: 1.8rem; }
}

/* ==========================================================================
   TOP：案2「入口を分ける」本採用（2026-08-18 クライアント承認）
   --------------------------------------------------------------------------
   出どころ＝ top-plans/top-plans.css の共通部＋案2ブロック。
   比較ページでは body[data-plan="2"] でスコープしていたが、本番TOPは
   header-newtop.php が body に .maf-top を付けるので、そちらへ移し替えている。
   案1・案3でしか使わない規則（x-mv__slide / x-wall / x-strip / x-two /
   x-feat / x-biz / x-reason / x-switch）は持ち込んでいない。
   ========================================================================== */

:root {
  --beige: #F8F5EF;
  --beige-deep: #F0EADF;
  --beige-line: #E4DACA;
}

/* --- 面の色。白／ベージュ／淡い青を交互に置いて区切りを作る -----------------
   🔴 .p-works / .p-column などが元から background を持っているため、
      body を1つ噛ませて詳細度を上げないと勝てない。 */
body .x-tone--white { background: var(--white); }
body .x-tone--beige { background: var(--beige); }
body .x-tone--blue  { background: var(--lightblue); }

/* 上端の細罫。ベタ面を変えずに「ここから別の話」を示す。 */
.x-rule { position: relative; }
.x-rule::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: min(1200px, calc(100% - 6rem));
  height: 1px;
  transform: translateX(-50%);
  background: var(--beige-line);
}

/* 見出しの上に置く細い金の縦線。/company/ の h4 と同じ語彙。 */
.x-sec-mark {
  display: block;
  width: 1px;
  height: 4.4rem;
  margin: 0 auto 2.6rem;
  background: linear-gradient(180deg, rgba(176, 141, 87, 0) 0%, var(--gold) 100%);
}
.c-sec-head--between .x-sec-mark { margin-left: 0; }

/* --- 会社概要（TOPの新規ブロック） --------------------------------------- */
.x-company { padding: 11rem 0; }
.x-company__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: center;
  gap: 6rem;
}
.x-company__body { max-width: 56rem; }
.x-company .x-sec-mark { margin-left: 0; }
.x-company__text {
  margin-top: 2.8rem;
  font-size: 1.55rem;
  line-height: 2.15;
  color: var(--ink-sub);
}
.x-company__btn { margin-top: 3.4rem; }
.x-company__media { position: relative; }
.x-company__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
/* 写真の角に金の枠線をずらして重ねる。装飾は線1本にとどめる。 */
.x-company__media::after {
  content: "";
  position: absolute;
  right: -1.6rem;
  bottom: -1.6rem;
  width: 62%;
  height: 62%;
  border-right: 1px solid var(--gold);
  border-bottom: 1px solid var(--gold);
  pointer-events: none;
}
@media (max-width: 1024px) {
  .x-company { padding: 8rem 0; }
  .x-company__inner { grid-template-columns: 1fr; gap: 4rem; }
  .x-company__body { max-width: none; }
}
@media (max-width: 768px) {
  .x-company { padding: 6.4rem 0; }
  .x-company__media::after { right: -.8rem; bottom: -.8rem; }
}

/* --- 実績の帯 -------------------------------------------------------------
   🔴 出してよい数値は資料・現行サイトで裏が取れているものだけ。
      2026-08-18 クライアント指示により「拠点7／着手金0／中間報酬0」の3項目。
      件数200は先方の指示で載せない。 */
.x-fact { padding: 6.4rem 0; }
.maf-top .x-fact { padding: 8.4rem 0 9rem; }
.x-fact__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
}
.x-fact--2 .x-fact__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.x-fact__item {
  position: relative;
  padding: 0 3rem;
  text-align: center;
}
.x-fact__item + .x-fact__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 6.4rem;
  transform: translateY(-50%);
  background: var(--beige-line);
}
/* アイコンは数字の上。インラインSVGなので外部CDNには依存しない。 */
.x-fact__icon {
  display: block;
  margin: 0 auto 1.4rem;
  color: var(--gold);
}
.x-fact__icon svg {
  display: block;
  width: 2.6rem;
  height: 2.6rem;
  margin: 0 auto;
  fill: currentColor;
}
/* 🔴 2026-08-20 クライアント指摘：
      「0がゼロでなく英大文字のOに見える／幅の狭いフォントに見える」
      「7と0の線が細く、拠点・円・完全成功報酬型に比べて浮いている」
      「中央列だけアイコンと文字の間隔が詰まって見える」
   原因はすべて **Cormorant Garamond のオールドスタイル数字**。
     ・0 は x-height の小さな楕円なので、隣の漢字に対して「小文字のo」に見える
     ・7 はベースラインより下へ抜ける。線も細い（高コントラストのディスプレイ書体）
     ・**桁ごとに字面の高さが違うので、アイコンとの間隔も列ごとにズレて見える**
       （間隔の指定自体は3列とも同じ 1.4rem。ズレていたのは字面のほう）
   → 見出しと同じ Noto Serif JP（--serif）＋ライニング数字＋600 にそろえた。
      これで3列とも同じ書体・同じ字面高になり、太さも「完全成功報酬型」と釣り合う。
   ⚠️ 数字を読ませる場所に装飾セリフを使わない、という判断は電話番号のときと同じ。 */
.x-fact {
  --fact-num-size: clamp(3.4rem, 4.4vw, 5rem);
  --fact-num-lh: 1.15;
}
.x-fact__num {
  font-family: var(--serif);
  font-size: var(--fact-num-size);
  font-weight: 600;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
  line-height: var(--fact-num-lh);
  color: var(--navy);
}
.x-fact__num small { font-family: var(--serif); font-size: .46em; margin-left: .5rem; }
/* 🔴 2026-08-20 3枠目がクライアント指定で数字→言葉（「完全成功報酬型」）になった。
      数字用のサイズのままだと7文字が枠からはみ出すので、明朝で1段落として組む。
      数字2枠と高さがそろうよう line-height を詰め、上下に余白を足して重心を合わせている。 */
.x-fact__num--text {
  font-size: clamp(2.2rem, 2.5vw, 2.9rem);
  letter-spacing: .04em;
  /* 🔴 3列目だけ文字サイズが小さいので、**行の高さを数字2枠と同じ実寸に固定**する。
        こうするとアイコンとの間隔も、下のラベルの位置も3列で自動的にそろう。
        （line-height に長さを渡している。比率では列ごとにズレる） */
  line-height: calc(var(--fact-num-size) * var(--fact-num-lh));
}
.x-fact__label {
  margin-top: 1rem;
  font-size: 1.4rem;
  letter-spacing: .08em;
  color: var(--ink-sub);
}
@media (max-width: 768px) {
  .x-fact { padding: 4.4rem 0; }
  .maf-top .x-fact { padding: 5.4rem 0 6rem; }
  .x-fact__list { grid-template-columns: 1fr; gap: 2.8rem; }
  .x-fact__item { padding: 0; }
  .x-fact__item + .x-fact__item::before { left: 50%; top: -1.4rem; width: 8rem; height: 1px; transform: translateX(-50%); }
}

/* --- 濃紺ベタを減らすための上書き（Works を明るい面へ） -------------------- */
.x-works--light { background-image: none; }
.x-works--light .c-label--light { color: var(--gold); }
.x-works--light .c-heading--light { color: var(--navy); }
.x-works--light .c-heading--light::after { background: var(--gold); }
.x-works--light .p-works__lead { color: var(--ink-sub); }
.x-works--light .c-more--gold { color: var(--navy); }
.x-works--light .c-more--gold::after { background: var(--gold); }
.x-works--light .p-works__card { border: 1px solid var(--line); }
.x-works--light .p-works__card:hover { border-color: var(--navy); }
.x-works--light .p-works__dot { background: rgba(18, 49, 78, .18); }
.x-works--light .p-works__dot.is-active { background: var(--gold); }

/* 拠点セクションはページ唯一の濃紺として残すので、上下を金の細罫で締める */
.x-network--framed { padding: 9rem 0; }
.x-network--framed::before,
.x-network--framed::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, rgba(176, 141, 87, 0) 0%, var(--gold) 50%, rgba(176, 141, 87, 0) 100%);
}
.x-network--framed::before { top: 0; }
.x-network--framed::after { bottom: 0; }

/* --- MV（案2＝縦3枚の写真ストライプ＋下3割は濃紺のベタ） ------------------ */
.x-mv {
  position: relative;
  display: flex;
  align-items: center;
  min-height: min(92vh, 82rem);
  padding-top: var(--header-h);
  overflow: hidden;
  background: var(--navy-deep);
}
.x-mv__inner { position: relative; z-index: 3; width: 100%; }
.x-mv__label {
  margin-bottom: 2rem;
  font-family: var(--garamond);
  font-size: 1.5rem;
  letter-spacing: .34em;
  color: var(--gold-light);
}
.x-mv__title {
  font-family: var(--serif);
  font-size: clamp(3rem, 4.4vw, 5.4rem);
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: .08em;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.x-mv__text { margin-top: 2.8rem; font-size: 1.5rem; line-height: 2.05; }
.x-mv__scroll {
  position: absolute;
  right: 4rem;
  bottom: 3rem;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  font-family: var(--garamond);
  font-size: 1.2rem;
  letter-spacing: .28em;
}
.x-mv__scroll::after {
  content: "";
  width: 1px;
  height: 5rem;
  background: currentColor;
  animation: x-scrollline 2.4s var(--ease) infinite;
  transform-origin: top;
}
@keyframes x-scrollline {
  0%   { transform: scaleY(0); opacity: 0; }
  40%  { transform: scaleY(1); opacity: 1; }
  100% { transform: scaleY(1); opacity: 0; }
}

/* 🔴 固定ヘッダーは position:fixed。MVを 0 から始めると上端が隠れるので、
      「写真＋濃紺の帯」というひとつの塊ごとヘッダーの高さぶん下げる。 */
.maf-top .x-mv--band {
  display: block;
  min-height: 0;
  margin-top: var(--header-h);
  padding: 0;
  color: var(--white);
  background: var(--navy-deep);
}
/* 写真は上側だけ。下 30% は濃紺のベタで、そこに入口カードが乗る。 */
.maf-top .x-mv__stripes {
  position: absolute;
  inset: 0 0 30% 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  background: var(--navy-deep);
}
.maf-top .x-mv__stripe { position: relative; overflow: hidden; }
.maf-top .x-mv__stripe img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.06);
  transition: transform 1.6s var(--ease);
}
.maf-top.is-mv-ready .x-mv__stripe img { transform: none; }
/* 立ち上がりは左から順に。カーテンを上げるように見せる。 */
.maf-top .x-mv__stripe::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--navy-deep);
  transform-origin: bottom;
  transition: transform 1.1s var(--ease);
}
.maf-top.is-mv-ready .x-mv__stripe::before { transform: scaleY(0); }
.maf-top.is-mv-ready .x-mv__stripe:nth-child(2)::before { transition-delay: .16s; }
.maf-top.is-mv-ready .x-mv__stripe:nth-child(3)::before { transition-delay: .32s; }
/* コピーを読ませるための陰。下へいくほど濃くしてベタ面へつなげる。 */
.maf-top .x-mv__stripes::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  background: linear-gradient(180deg, rgba(12, 32, 53, .74) 0%, rgba(12, 32, 53, .56) 46%, rgba(12, 32, 53, .96) 100%);
}
.maf-top .x-mv__inner {
  display: flex;
  align-items: center;
  min-height: min(74vh, 62rem);
  padding-top: 6rem;
  padding-bottom: 22rem;
}
.maf-top .x-mv__body { max-width: 92rem; margin-inline: auto; text-align: center; }
.maf-top .x-mv__label { margin-bottom: 2.4rem; }
.maf-top .x-mv__title { font-size: clamp(3rem, 4.6vw, 5.6rem); }
.maf-top .x-mv__rule {
  display: block;
  width: 8rem;
  height: 1px;
  margin: 3.4rem auto;
  background: var(--gold);
}
.maf-top .x-mv__text { margin-top: 0; color: rgba(255, 255, 255, .84); }
.maf-top .x-mv__scroll { right: 4rem; bottom: 22rem; }

/* MVコピーの入り。JSが is-mv-ready を付けるまで伏せておく。 */
.maf-top .x-in { opacity: 0; transform: translateY(1.8rem); }
.maf-top.is-mv-ready .x-in {
  opacity: 1;
  transform: none;
  transition: opacity 1.1s var(--ease), transform 1.1s var(--ease);
}
.maf-top.is-mv-ready .x-in:nth-child(1) { transition-delay: .42s; }
.maf-top.is-mv-ready .x-in:nth-child(2) { transition-delay: .56s; }
.maf-top.is-mv-ready .x-in:nth-child(3) { transition-delay: .7s; }
.maf-top.is-mv-ready .x-in:nth-child(4) { transition-delay: .84s; }

@media (prefers-reduced-motion: reduce) {
  .maf-top .x-in { opacity: 1 !important; transform: none !important; transition: none !important; }
  .maf-top .x-mv__stripe img { transform: none !important; transition: none !important; }
  .maf-top .x-mv__stripe::before { display: none; }
  .x-mv__scroll::after { animation: none; }
}

@media (max-width: 768px) {
  .x-mv { min-height: 62rem; }
  .x-mv__scroll { display: none; }
  /* 🔴 SPで margin-top を --header-h-sm(68px) に差し替えてはいけない。
        --header-h は 768px以下で 72px へ切り替わるのに対し --header-h-sm は 68px のままで、
        差の4pxぶんMVの上端がヘッダーの下へ潜り込む（比較ページから持ち込んだ設定の誤り）。
        --header-h だけで全幅とも正しく合うので、ここでは上書きしない。 */
  .maf-top .x-mv__stripes { inset: 0 0 26% 0; gap: 2px; }
  .maf-top .x-mv__inner { min-height: 52rem; padding-top: 4rem; padding-bottom: 14rem; }
  .maf-top .x-mv__rule { margin: 2.6rem auto; }
  .maf-top .x-mv__scroll { display: none; }
}

/* --- 2つの入口。MVの濃紺ベタの上に重ねる ---------------------------------- */
.x-doors { position: relative; z-index: 5; padding: 0 0 10rem; margin-top: -16rem; }
.x-doors__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3.2rem;
}
.x-doors__card {
  display: block;
  height: 100%;
  background: var(--white);
  border: 1px solid var(--line);
  border-top: 3px solid var(--gold);
  box-shadow: 0 18px 44px rgba(12, 32, 53, .22);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.x-doors__card:hover {
  transform: translateY(-4px);
  border-color: var(--navy);
  box-shadow: 0 26px 56px rgba(12, 32, 53, .28);
}
.x-doors__media { overflow: hidden; }
.x-doors__media img {
  width: 100%;
  aspect-ratio: 16 / 8;
  object-fit: cover;
  transition: transform .7s var(--ease);
}
.x-doors__card:hover .x-doors__media img { transform: scale(1.05); }
.x-doors__body { padding: 3.4rem 3.4rem 3.8rem; }

/* 見出しまわりは中央寄せ。本文だけ左揃えのまま読ませる。 */
.x-doors__en {
  margin-bottom: 1.2rem;
  font-family: var(--garamond);
  font-size: 1.4rem;
  font-style: italic;
  letter-spacing: .12em;
  text-align: center;
  color: var(--gold);
}
.x-doors__title {
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  font-family: var(--serif);
  font-size: clamp(2rem, 2.3vw, 2.5rem);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .04em;
  text-align: center;
  color: var(--navy);
  border-bottom: 1px solid var(--beige-line);
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.x-doors__text {
  margin-bottom: 2.8rem;
  font-size: 1.5rem;
  line-height: 2.05;
  color: var(--ink-sub);
}
@media (max-width: 1024px) {
  .x-doors { margin-top: -12rem; padding-bottom: 7rem; }
  .x-doors__list { gap: 2.4rem; }
  .x-doors__body { padding: 2.8rem 2.4rem 3rem; }
}
@media (max-width: 768px) {
  .x-doors { margin-top: -9rem; padding-bottom: 5.4rem; }
  .x-doors__list { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
}

/* ==========================================================================
   追従CTA（2026-08-18 クライアント要望）
   --------------------------------------------------------------------------
   SP … 画面下部いっぱいの帯（既存の実装のまま）。浮かせず帯にすることで本文を隠さない。
   PC … 右下に固定。ボタン数は body の cta-a / cta-b で決まる。
        cta-a＝「M&A無料相談」1本／cta-b＝資料と合わせて2本。
   🔴 2026-08-20 クライアント判断で **案2（cta-b＝2ボタン）に確定**。
      比較用スイッチャー（.x-ctaswitch / _cta-switch.php）は削除した。
   🔴 マークアップは両案とも同じ。出し分けはこのCSSだけで行う。
   ========================================================================== */

/* 目立たせる。ヘッダーのCTAと同じ金を使い、影で面から浮かせる。 */
.c-sticky__consult {
  font-size: 1.5rem;
  letter-spacing: .06em;
  box-shadow: 0 .8rem 2.4rem rgba(176, 141, 87, .42);
}

/* --- 出るタイミング -------------------------------------------------------
   読み込み直後は出さず、少しスクロールしてから ふわっと出す。
   最初から見えていると常設の広告に見えて視線が慣れる（＝押されなくなる）ため。
   閾値は script.js の STICKY_SHOW_AT（px）。
   🔴 JSが動かない環境では出したままにする（html.js-sticky-on が付いたときだけ伏せる）。
      CVの導線なので、演出のために消える事故を作らない。 */
html.js-sticky-on .c-sticky {
  opacity: 0;
  visibility: hidden;
  transform: translateY(1.2rem);
  transition: opacity .5s var(--ease), transform .5s var(--ease), visibility .5s;
}
html.js-sticky-on .c-sticky.is-show {
  opacity: 1;
  visibility: visible;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  html.js-sticky-on .c-sticky { transition: none; transform: none; }
  html.js-sticky-on .c-sticky.is-show { transform: none; }
}

@media screen and (min-width: 768px) {
  /* 案1＝相談1本にする指定。現在は maf_cta_variant() が 'b' 固定なので効いていないが、
     1本へ戻す判断が出たときに関数の 1文字だけで切り替えられるよう残してある。 */
  .cta-a .c-sticky__doc { display: none; }
}

/* 🔴 コラム詳細は資料DLのオーバーレイCTA（.c-float）が右下に出る。
      同じ場所に2つ重なるので、そのページでは追従CTAを出さない。
      （SP側には既に同じ主旨の指定があるが、PCにも要る） */
body:has(.c-float) .c-sticky { display: none; }


/* ==========================================================================
   2026-08-18 クライアント指摘への対応
   ========================================================================== */

/* Our Business の見出しは現行サイトの一文をそのまま使う。
   短いセクション名ではないので、通常の c-heading の大きさだと文字が暴れる。
   行間と最大幅を与えて「リード見出し」として成立させる。 */
.c-heading--lead {
  max-width: 88rem;
  margin-inline: auto;
  font-size: clamp(1.9rem, 2.1vw, 2.6rem);
  line-height: 1.75;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.p-business__lead {
  max-width: 88rem;
  margin: 2.4rem auto 0;
  font-size: 1.5rem;
  line-height: 2.05;
  text-align: left;
  color: var(--ink-sub);
}
@media screen and (max-width: 767px) {
  .c-heading--lead { font-size: 1.75rem; line-height: 1.7; }
  .p-business__lead { font-size: 1.4rem; line-height: 1.95; margin-top: 2rem; }
}

/* 🔴 ご支援事例カードの「業種／エリア」が、値の短いカードだけ1行に収まって
      他のカードと行数が揃わない（例：建設業＋北海道は1行、卸売・小売業＋中国・四国は2行）。
      折り返し任せをやめ、常に1項目1行にして全カードの見え方を揃える。 */
.p-works__meta { flex-direction: column; }