/* セクションごとの見た目。上から Figma の順（01_fv〜99_footer） */

/* ---------- 01_fv ----------
   背景画像とコピーのSVGは同じ縦横比（PC 1440×900／SP 375×621）なので、
   箱の縦横比をそろえて重ねれば、どの画面幅でも位置がずれない */
.fv {
  position: relative;
  aspect-ratio: 1440 / 900;
  overflow: hidden;
  background: var(--color-blue-50);
}
.fv__bg img,
.fv__copy img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fv__copy { position: absolute; inset: 0; margin: 0; }

/* SPの絵：スマホ（〜767px）と、タブレットの縦向き（〜1023px・縦長）。2026-10-16 本人決定
   タブレット縦だとSPの絵は画面より縦に長くなるので、高さを画面の高さまでに抑えて上下を切る。
   背景とコピーは同じ箱・同じ object-position なので、切っても位置はずれない */
@media (max-width: 767px), (max-width: 1023px) and (orientation: portrait) {
  /* aspect-ratio と max-height を併用すると横幅まで縮むので、高さを直接決める */
  .fv { aspect-ratio: auto; height: min(calc(100vw * 621 / 375), 100svh); }
  .fv__bg img, .fv__copy img { object-position: 50% 60%; }
}
/* 大きい画面（1440px超）はPCの絵をそのまま拡大する（2026-10-16 本人決定） */

/* PCの絵の下のボタン2つ（10/27 Figma 2470:11109／11110）。位置と大きさは 1440 幅の px を絵の幅に合わせて伸び縮み
   募集職種＝紺75%＋背景ぼかし8／お問い合わせ＝白65%＋背景ぼかし10。どちらも紺の線2px。modal.css より後に読まれても負けないよう .fv から書く */
.fv { container-type: inline-size; --s: calc(100cqw / 1440); }
.fv .fv__btns { position: absolute; left: calc(78 * var(--s)); top: calc(751 * var(--s)); display: flex; gap: calc(15 * var(--s)); }   /* 10/28 本人：2つ並びのボタンの間は全部15 */
.fv .fv__btn { --modal-accent: var(--color-blue); --h: calc(75 * var(--s)); width: calc(390 * var(--s)); height: var(--h); margin: 0; border: 0; font-size: calc(18 * var(--s)); }   /* 10/28 本人「FVのボタンは枠線なし」＝Figma 2470:9961 も線なし */
.fv .fv__btn.pill-btn--fill { background: rgb(0 61 166 / .8); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }   /* 10/28 本人：比較 tools/glass_1028.html の B（青75%・ぼかし12） */
.fv .fv__btn.pill-btn--fill:hover { background: var(--color-blue-500); }
.fv .fv__btn.fv__btn--contact { background: rgb(255 255 255 / .6); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); letter-spacing: .1em; }
@media (max-width: 767px), (max-width: 1023px) and (orientation: portrait) { .fv .fv__btns { display: none; } }
/* 10/28 夜：PCは FV を画面の高さに収める（おりちゃん「低い画面だとボタンが見えない」）。
   箱の高さ＝min（絵の高さ, 画面の高さ）。背景は上そろえで下を切る／文字とボタンは「幅か高さの小さい方」の倍率（--s）で縮めて左上に置く／ロゴは右上（Figma 1290,35・幅115） */
@media (min-width: 1024px), (min-width: 768px) and (orientation: landscape) {
  .fv { aspect-ratio: auto; height: min(calc(100vw * 900 / 1440), 100svh); --s: min(calc(100cqw / 1440), calc(100svh / 900)); }
  .fv__bg img { object-position: 50% 0; }
  .fv__copy img { object-fit: contain; object-position: 0 0; }
  .fv .fv__logo { display: block; position: absolute; top: calc(35 * 100cqw / 1440); right: calc(35 * 100cqw / 1440); width: calc(115 * 100cqw / 1440); height: auto; }
}   /* SPの絵のときは出さない（追従ボタンがある） */
.fv__logo { display: none; }
@media (max-width: 767px), (max-width: 1023px) and (orientation: portrait) {
  .fv { --sp: calc(100cqw / 375); }
  .fv__logo { display: block; position: absolute; top: calc(12 * var(--sp)); right: calc(12 * var(--sp)); width: calc(62.25 * var(--sp)); height: auto; }   /* 10/29 Figma 2538:59460：右上から12・12 */
}

/* iPad縦（768〜1023px・縦長）だけ、コピーを92%に縮めて下に余裕を作る（2026-10-16 本人決定・B案）
   写真は切り方を変えない（顔まわりをこれ以上切らないため） */
@media (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
  /* 11/2 本人（公開後・iPadで顔の上とボタンが切れていた）：比較 tools/shots/fv_compare_label.png の A。
     写真は上そろえで顔を全部見せる／コピーだけ60%に縮めて、左下（SPの絵の x20・y540＝コピーの左下）を基準にボタンの上へ置く */
  .fv__bg img { object-position: 50% 0; }
  .fv__copy img { top: auto; bottom: -40px; height: auto; aspect-ratio: 375 / 621; object-fit: fill; transform: scale(.6); transform-origin: 5.33% 86.96%; }
  .fv { --sp: 1px; }   /* 10/28 本人：iPadではロゴを大きくしない（SPと同じ62px・右上20/18） */
}

/* ---------- 02_introduction ----------
   PC（768px〜）：見出し（幅1066）と本文（幅536）を中央の列に置く。背景の筆は幅いっぱいに敷く
   SP（〜767px）：Figma（375幅）の比率のまま拡大縮小。拡大は1.3倍まで */
.intro { position: relative; overflow: hidden; background: var(--color-white); padding: 111px 32px 80px; }
.intro__bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.intro__inner { position: relative; width: min(1066px, 100%); margin: 0 auto; }
.intro__head img { width: 100%; }
.intro__body { margin-top: 70px; width: 536px; max-width: 100%; }
.intro__body img { width: 100%; }
.intro__brush { display: none; }
.intro__bg { display: none; }

/* PC（1024px〜）：筆は左・右の2枚（2026-10-20 本人「1920以上で寂しい」）
   Figmaの筆（img_graphic+++ 4 2・texture_RGB）を枠の外まで書き出した＝デザインの枠（1440）の左右へ560pxずつ、2560幅ぶん
   位置はデザインの枠の左端（画面の中心−720px）から測る。広い画面ほど枠の外の筆が見え、2560より広いと外側は白
   左＝枠の左端から−560〜365／右＝830〜2000（間は筆のない白なので切った） */
.intro__pcbrush { position: absolute; display: block; top: 0; }
.intro__pcbrush img { display: block; width: 100%; height: auto; }
.intro__pcbrush--tl { width: 925px; left: calc(50% - 720px - 560px); }
.intro__pcbrush--r { width: 1170px; left: calc(50% - 720px + 830px); }
@media (max-width: 1023px) { .intro__pcbrush { display: none; } }

/* 中くらいの幅（768〜1023px）：見出しを2行（SPの見出し）にして大きく出す。本文は真ん中にそろえる */
@media (min-width: 768px) and (max-width: 1023px) {
  .intro__head { width: min(560px, 100%); margin: 0 auto; }
  .intro__body { margin: 64px auto 0; }
  /* 背景はSPの筆を角ごとに置く（1枚の絵だと縦横比の違いで左上か右下が切れるため）。原図の2.6倍（本人「もう少し筆見せたい」） */
  .intro__brush { display: block; position: absolute; }
  .intro__brush--tl { top: 0; left: 0; width: 294px; }
  /* 右下は本文にかからない大きさ（本人 10/16）。筆の形から計算した上限＝768で幅240・1000で幅324。
     画面が狭いほど右へはみ出させる（768で-60px、1000以上で0） */
  .intro__brush--br { bottom: 0; right: min(0px, calc((100vw - 1000px) * .26)); width: min(330px, calc(240px + (100vw - 768px) * .36)); }
}

@media (max-width: 767px) {
  .intro__bg { display: block; }
  .intro { --u: min(calc(100vw / 375), 1.3px); padding: calc(45 * var(--u)) 0 calc(38 * var(--u)); }
  .intro__inner { width: calc(375 * var(--u)); }
  .intro__head { width: calc(262 * var(--u)); margin-left: calc(57 * var(--u)); }  /* Figmaの位置そのまま（左57・幅262） */
  .intro__body { margin: calc(40 * var(--u)) 0 0 calc(32 * var(--u)); width: calc(323 * var(--u)); }
}

/* ---------- 共通：セクションの英字見出し（Figma 部品 PC_title_eng／SP_title_eng） ---------- */
.sec-title {
  display: flex; align-items: center; gap: 20px;
  font: 500 26px/1 var(--font-en); letter-spacing: .08em;
}
.sec-title__bar { width: 8px; height: 30px; background: url(../assets/common/title_bar.png) center / cover; }
/* 日本語の見出し（Figma 部品 PC_title_ja：Noto Sans JP Bold 25・字間7%／SPは Medium 13・字間8%） */
.sec-title--ja { font: 500 25px/1 var(--font-sans); letter-spacing: .07em; }   /* Figma 部品 PC_title_ja＝Medium（10/26 本人「書体が太い」で照合。前は700） */
@media (max-width: 1023px) {
  .sec-title { gap: calc(10.7 * var(--u, 1px)); font-size: calc(14 * var(--u, 1px)); letter-spacing: .05em; }
  .sec-title__bar { width: calc(4.3 * var(--u, 1px)); height: calc(16 * var(--u, 1px)); }
  .sec-title--ja { font-weight: 500; font-size: calc(13 * var(--u, 1px)); letter-spacing: .08em; }
}
/* 画像の上に重ねる見出し（07）。--x/--y は Figma に対する% */
.numbers__title { position: absolute; left: var(--x); top: var(--y); margin: 0; z-index: 1; }
.numbers__title--a { --x: 8.333%; --y: 4.739%; }
.numbers__title--b { --x: 8.333%; --y: 79.242%; }
@media (max-width: 1023px) {
  .numbers__title--a { --x: 8.533%; --y: 2.102%; }
  .numbers__title--b { --x: 8.533%; --y: 62.169%; }
}

/* ---------- 03_SHE（パーツごとの画像で組む・2026-10-16 本人決定） ----------
   PC（1024px〜）：見出し＋実績｜カード・図・カードの3列（Figma 1440幅で 430｜340｜430。10/25 Figma 2030:35003 の新しい組み＝学ぶはSHElikesを大きく・図は小さく36px下げる）
   SP・iPad（〜1023px）：縦並び。Figma（375幅）の比率のまま拡大縮小（最大1.5倍） */
.she { background: var(--color-white); padding: 80px 32px 79px; }   /* Figma 1889:6174 で高さ868に（10/21 実績の数字と注釈が入った版） */
.she__inner { width: min(1200px, 100%); margin: 0 auto; }
.she__lead { margin-top: 45px; }
.she__lead img { width: 100%; }
/* 注釈：箱の高さはFigmaの枠（PC 26px／SP 82px）に合わせ、カードまでの間はFigmaどおり */
.she__note { height: 26px; margin-top: 25px; font-size: 12px; line-height: 1.4; color: rgb(7 8 77 / .5); }   /* Figmaは不透明度50% */
.she__cards {
  display: grid; grid-template-columns: minmax(0, 430fr) minmax(0, 340fr) minmax(0, 430fr);
  align-items: start; margin-top: 51px;
}
.she__fig { width: 96.06%; margin: 0 auto; }   /* 図 326.6px を340の列のまん中に。10/28 Figma 2491:24650：吹き出しを大きくして図は327×427・カードの上端にそろえる */
.she__fig img, .svc-card img { width: 100%; }
.svc-card { display: block; width: 100%; -webkit-tap-highlight-color: transparent; }
/* マウスを乗せると少し浮く＝サイト内の押せるカードと同じ動き（本人 10/20。tokens.css の --card-*）
   浮かせるのは中の画像。ボタン自体は出方のモーション（motion.css の transform: none）が上書きするため */
.svc-card { transition: filter var(--card-hover-dur) ease; }
.svc-card__inner { position: relative; display: block; transition: transform var(--card-hover-dur) ease; }
.svc-card picture { display: block; }
@media (hover: hover) {
  /* 03のカードは面が大きいので、影は他のカードより控えめ（本人 10/20） */
  .svc-card:hover { filter: drop-shadow(0 6px 10px rgb(0 61 166 / .1)); }
  .svc-card[data-modal-open="she-learn"]:hover { filter: drop-shadow(0 6px 10px rgb(235 78 128 / .12)); }   /* 学ぶはピンクの影（本人 10/20） */
  .svc-card:hover .svc-card__inner { transform: var(--card-lift); }
}
/* 「もっと見る →」の矢印は画像から消して文字（SVG）で重ねる＝ホバーで動かすため（本人 10/20）。位置は画像に対する% */
.svc-card__arrow { position: absolute; left: 63.1%; top: 93.57%; width: 2.44%; color: var(--color-white); }   /* 10/25 カード幅430の位置（Figma icon_yazirushi x271） */
.svc-card__arrow svg { display: block; width: 100%; height: auto; aspect-ratio: 1; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
@media (max-width: 1023px) {
  .svc-card__arrow { left: 61.09%; top: 83.53%; width: 2.39%; }
  .svc-card[data-modal-open="she-work"] .svc-card__arrow { left: 59.6%; top: 83.24%; }
}
.svc-card:focus-visible { outline: 2px solid var(--color-blue); outline-offset: 4px; }

@media (max-width: 1023px) {
  .she { --u: min(calc(100vw / 375), 1.5px); background: var(--color-blue-200); padding: 0; }
  /* 白い面の下の角だけ丸い（次のセクションの水色がのぞく） */
  .she__inner {
    width: auto; background: var(--color-white);
    border-radius: 0 0 calc(15 * var(--u)) calc(15 * var(--u));
    padding: calc(30 * var(--u)) 0 calc(34.5 * var(--u));
  }
  .she .sec-title { width: calc(311 * var(--u)); margin: 0 auto; }
  .she__lead { width: calc(311 * var(--u)); margin: calc(20 * var(--u)) auto 0; }
  .she__note { width: calc(311 * var(--u)); height: calc(82 * var(--u)); margin: calc(12 * var(--u)) auto 0; font-size: calc(10 * var(--u)); line-height: 1.5; }
  .she__cards { display: block; width: calc(335 * var(--u)); margin: calc(30 * var(--u)) auto 0; }
  .she__fig { width: calc(252 / 335 * 100%); margin: 0 auto; }   /* 10/26 Figma：図は252幅で中央・カードとの間はなし（PCの図の大きさ・位置は使わない） */
  /* 10/26 Figma：カードの組みが変わった（学ぶ＝SHElikesを1段目に大きく）。SPは「もっと見る →」の矢印ごと画像にしたので、重ねる矢印は出さない */
  .svc-card__arrow { display: none; }
  .she__inner { padding-bottom: calc(51 * var(--u)); }   /* カードの下端→白い面の下端 51（Figma 1061→1112） */
}

/* ---------- 04_next SHE（画像で組む） ----------
   Figma で01と02が1枚の枠になった（PC 1440×2759・SP 375×2108。10/22）。位置は全部この枠に対する%
   中身の画像は幅1440まで画面幅に合わせて縮む。背景の地図（2400幅）も同じ比率で縮めて中央に置く
   白い面：PC は y1160 から下（上30.7%で透明→白・下の角30）、SP は y681 から下（上19.7%・角15）。広い画面では左右いっぱい
   SP・iPad（〜1023px）：SPの画像を375幅基準で拡大縮小（最大1.5倍）。左右は水色→白 */
.next01 { position: relative; overflow: hidden; background: var(--color-blue-200); }
.next01::before {
  content: ""; position: absolute; left: 0; right: 0; top: 44.4956%; bottom: 0;   /* 1160 / 2607（10/27 Figma で枠が2607に） */
  background: linear-gradient(rgb(255 255 255 / 0), #fff 30.7%);
  border-radius: 0 0 30px 30px;
}
.next01__inner { position: relative; width: min(1440px, 100%); margin: 0 auto; }
.next01__bg { position: absolute; inset: 0; pointer-events: none; }
.next01__bg img {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: calc(100% * 2400 / 1440); max-width: none; height: auto;
}
/* タイトルの重ね画像（光彩のにじみ込み）。PC・SPとも「生き方のインフラ」を1枚で（Group 15552）
   PC は 10/20 の書き出しのまま（x-7・y293.5・幅1481）。SP は 10/22 に1枚で書き出し直した（x-2・y134・幅390.7。前の2枚は位置がずれていた） */
.next01__title { position: absolute; left: var(--x); top: var(--y); width: var(--w); pointer-events: none; }
.next01__title img { width: 100%; height: auto; }
.next01__title--infra   { --x: -.4861%; --y: 11.2582%; --w: 102.8472%; }
/* 10/29 夕 本人「エフィカシー経営・美しい、だけど泥臭いと同じレスポンシブに」：1440より広い画面ではタイトルを画面幅に合わせて大きくする（1920まで）。上下に均等に広げる */
@media (min-width: 1024px) {
  .next01__title--infra { --tw: max(102.8472%, min(100vw, 1920px) * 1.028472); left: calc(50.9375% - var(--tw) / 2); width: var(--tw); margin-top: calc((var(--tw) - 102.8472%) * -.03); }
  /* 10/29 夕 本人「大きくなったとき下の帯にかぶらないように」：タイトルが大きくなった分（高さの増え）だけ、下の中身を下げ、04の枠も伸ばす */
  .next01__inner { --g: max(0px, (min(100vw, 1920px) - 1440px) * .2181); margin-bottom: var(--g); }
  .next01__inner > .next01__title ~ * { translate: 0 var(--g); }
  .next01__inner > .next01__sub { translate: 0 calc(-50% + var(--g)); }   /* 説明文はもとから translate で中央に置いている */
}
@media (min-width: 768px) and (max-width: 1023px) { .next01 .next01__bg { overflow: visible; } }   /* iPad：日本地図を列（562）の外まで見せる */

@media (max-width: 1023px) {
  .next01::before { top: 0; background: linear-gradient(#c1d5fe 52%, #fff1f5 64.44%); border-radius: 0 0 15px 15px; }   /* 10/27 Figma SP 2470:9545：青→ピンク（1128→1398 / 2170）。白はなし */
  .next01__inner { width: min(100%, 562px); }
  .next01__bg { overflow: hidden; }   /* SP の地図は Figma の枠（375幅）で切る */
  .next01__bg img { left: -16.48%; top: 6.3594%; width: 146.3557%; transform: none; }   /* bg_japan：x-61.8・y138・幅548.8 */
  .next01__title--infra   { --x: -1.9733%; --y: 6.1751%; --w: 104.2133%; }   /* 10/29 夕：Figma 2538:59925 を枠で切らずに書き出し直した（x-7.4・y134・390.8×101.2）。iPadで左右の字と光彩が切れないように */
}

/* ---------- 04 のパーツ（10/22 夜：中身の1枚の画像をブロックごとに分けた） ----------
   .np＝Figma の px で置くパーツ。--x・--y・--w・--h に Figma の値を書くと、親（--pw×--ph）に対する%になる
   枠全体は PC 1440×2607・SP 375×2170（10/27 Figma）。カードなどのまとまりは .n4-in の中が「そのまとまりの左上が0」の座標
   文字の大きさは --u（Figma の 1px。広い画面・iPad では大きくならない＝README 10/20 のきまり）
   1行の文字は「Figma の文字の箱（字の高さで切った箱）の中央」にそろえる */
.next01__inner { --pw: 1440; --ph: 2607; aspect-ratio: 1440 / 2607; --u: min(1px, 100cqw / var(--b)); }
.np { position: absolute; margin: 0; padding: 0;
  left: calc(var(--x) / var(--pw) * 100%); top: calc(var(--y) / var(--ph) * 100%);
  width: calc(var(--w) / var(--pw) * 100%); height: calc(var(--h) / var(--ph) * 100%); }
picture.np, img.np { display: block; height: auto; }   /* 画像の高さは幅から決まる（--h は親から受け継がれてしまうので使わない） */
.np img { width: 100%; height: auto; }
.np img { border-radius: inherit; }
.n4-in { position: absolute; inset: 0; --pw: var(--w); --ph: var(--h); }
.n4-tags { margin: 0; padding: 0; list-style: none; }
/* 中央にそろえる1行のラベル（タイトルの白い箱・タグ・吹き出し） */
.n4-pill, .n4-chart__label, .n4-ttl, .n4-tag { display: flex; align-items: center; justify-content: center; white-space: nowrap; line-height: 1;
  box-sizing: border-box; padding-bottom: .14em; }   /* Noto Sans JP は字の中心が少し下にあるので .07em 上げる */
/* 下のそろえ線（ベースライン）で置く文字：--y はベースラインの位置。Poppins は 行の高さ1 のとき上から .85em、Noto Sans JP は .936em */
.n4-val, .n4-year { height: auto; line-height: 1; white-space: nowrap; text-align: center; margin-top: -.85em; }
/* 複数行の文字：--y は1行目の字の上端（Figma の箱の上）。Noto Sans JP の行の上の余白の分だけ上げる */
.n4-desc, .n4-chart__src { height: auto; margin-top: calc(.297em - .5lh); }

.n4-sheis { --x: 122; --y: 197; --w: 933; }

/* 円と約440万人（Figma 10/26：グラフと左右が入れ替わって右へ。Group 1991355163：634,664 687×687） */
.n4-ring { --x: 634; --y: 664; --w: 687; --h: 687; }
.n4-ring__circles { --x: 0; --y: 0; --w: 687; }
.n4-ring__circles { border-radius: 50%; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }   /* 10/28 Figma：いちばん外の円に背景のぼかし（PC 10・SP 5。CSSのblurはFigmaの半分で近くなる） */
.n4-ring__num { --x: 170.81; --y: 324.02; --w: 342.37; }   /* 光彩の分だけ文字の箱より大きい（render bounds） */
.n4-pill { --x: 207; --y: 275; --w: 273; --h: 38; border-radius: 999px; background: var(--color-white);
  color: var(--color-blue); font: 700 calc(18 * var(--u))/1 var(--font-sans); letter-spacing: .02em; }

/* 棒グラフ（Figma 10/26 えりさん確認後の版：左へ。台紙＝Group 15340：120,891 472×390＋円へつながる線と点で幅702）
   2040年の棒の上に「減る440万人」の点線の箱。数字・年は下のそろえ線（ベースライン）の位置 */
.n4-chart { --x: 120; --y: 891; --w: 702; --h: 390; margin: 0; }
.n4-chart__card { --x: 0; --y: 0; --w: 702; filter: drop-shadow(0 0 calc(5 * var(--u)) rgb(0 61 166 / .2)); }
.n4-chart__label { --x: 65; --y: 28; --w: 343; --h: 38; border-radius: 999px; background: var(--color-white); color: var(--color-blue);
  font: 700 calc(18 * var(--u))/1 var(--font-sans); letter-spacing: .08em; box-shadow: 0 0 calc(8 * var(--u)) rgb(0 61 166 / .2); }
.n4-bar { background: #89adf4; }
.n4-bar--2022 { --x: 69; --y: 95; --w: 145; --h: 204; }
.n4-bar--2040 { --x: 258; --y: 156; --w: 145; --h: 143; }
.n4-gap { --x: 258; --y: 95; --w: 145; --h: 58; box-sizing: border-box; background: #f5f8ff; border: calc(1.08 * var(--u)) dashed var(--color-blue); border-radius: calc(1.08 * var(--u)); }
.n4-axis { --x: 69; --y: 298.5; --w: 334; --h: 1.08; background: var(--color-navy); }
.n4-val { color: var(--color-white); font: 500 calc(23.7 * var(--u))/1 var(--font-en); letter-spacing: .02em; }
.n4-val small { font-size: calc(17.24 * var(--u)); letter-spacing: .06em; }
.n4-val--2022 { --x: 69; --y: 129; --w: 145; }
.n4-val--2040 { --x: 258; --y: 192; --w: 145; }
.n4-val--gap { --x: 258; --y: 136; --w: 145; color: var(--color-blue); font-size: calc(33.18 * var(--u)); }
.n4-val--gap small { font-size: calc(21.54 * var(--u)); letter-spacing: 0; }
.n4-arrow2 { --x: 199; --y: 106; --w: 60; }
.n4-year { --x: 69; --y: 322; --w: 145; color: var(--color-navy); font: 500 calc(17.24 * var(--u))/1 var(--font-en); letter-spacing: .02em; }
.n4-year--2040 { --x: 258; }
.n4-chart__src { --x: 75; --y: 345; --w: 330; color: var(--color-navy-60); font: 400 calc(11 * var(--u))/1.2 var(--font-sans); letter-spacing: .08em; white-space: nowrap; }

/* カード共通：タイトルの白い箱・タグ・説明・「不足」ラベル */
.n4-ttl { background: var(--color-white); border-radius: 2px; box-shadow: 0 0 calc(22.62 * var(--u)) var(--n4-glow);
  color: var(--n4-ink); font: 700 calc(30 * var(--u))/1 var(--font-sans); letter-spacing: .07em; }
.n4-tag { border-radius: 999px; background: var(--n4-tag-bg); color: var(--n4-tag-ink); font: 500 calc(19 * var(--u))/1 var(--font-sans); letter-spacing: .05em; }
.n4-desc { color: var(--color-navy); font: 400 calc(16 * var(--u))/1.563 var(--font-sans); letter-spacing: 0; text-align: justify; line-break: strict; }   /* 「ー」で行を始めない（Figma と同じ改行） */
.n4-lack { display: block; background: var(--color-white); box-shadow: 0 0 calc(10 * var(--u)) rgb(0 61 166 / .2);
  padding: calc(11.5 * var(--u)) 0 0 calc(18 * var(--u)); box-sizing: border-box; white-space: nowrap;
  color: var(--color-navy); font: 500 calc(24 * var(--u))/1 var(--font-en); letter-spacing: .02em; }
.n4-lack b { font-weight: 500; font-size: calc(30 * var(--u)); color: var(--color-pink-500); }
.n4-lack sup { position: relative; top: -.95em; font-size: .5em; line-height: 0; vertical-align: baseline; margin-left: .1em; }

/* AS IS（PC：Group 15238 の左上 120,1497 を0に。台紙のSVGは下の矢印まで入って 1200×501） */
.n4-asis { --x: 120; --y: 1517; --w: 1200; --h: 225; background: #c2d6ff; border-radius: 4px; --n4-glow: rgb(0 61 166 / .2); --n4-ink: var(--color-blue); --n4-tag-bg: #5d8ae2; --n4-tag-ink: var(--color-white); }
.next01 .n4-asis__bg { display: none; }   /* 10/27 Figma：矢印つきの台紙をやめて単色の箱に */
.n4-asis .n4-photo { --x: 675; --y: 0; --w: 525; --h: 225; border-radius: 0 4px 4px 0; }
.n4-asis__head { --x: 954.58; --y: 27; --w: 211.42; }
.n4-asis__sub { --x: 1038.79; --y: 117.48; --w: 127.21; }
.n4-asis .n4-ttl { --x: 40; --y: 39; --w: 328; --h: 82; }
.n4-asis .n4-tag { --y: 34; --h: 40; }
.n4-asis .n4-tag--1 { --x: 390; --w: 143; }
.n4-asis .n4-tag--2 { --x: 543; --w: 143; }
.n4-asis .n4-tag--3 { --x: 390; --y: 84; --w: 296; }
.n4-asis .n4-desc { --x: 40; --y: 146; --w: 596; }
.next01 .n4-arrow { display: none; }

/* TO BE（436,1823 を0に） */
.n4-tobe { --x: 212; --y: 1730; --w: 1017; --h: 190; }
.next01 .n4-card { z-index: 1; }   /* Figma と同じく、×の丸はカードの下にもぐらせる（10/27） */

/* AIXワーカー（120,2037 1200×224）・アドバンスト（120,2286 1200×280） */
.n4-aix, .n4-adv { background: var(--color-pink-50); border-radius: 4px; --n4-glow: rgb(235 78 128 / .2); --n4-ink: var(--color-pink-500); --n4-tag-bg: var(--color-pink-200); --n4-tag-ink: var(--color-pink-500); }
.n4-aix { --x: 120; --y: 1907; --w: 1200; --h: 224; }
.n4-aix .n4-photo { --x: 675; --y: 0; --w: 525; --h: 224; border-radius: 0 4px 4px 0; }
.n4-aix .n4-ttl { --x: 40; --y: 38; --w: 330; --h: 82; }
.n4-aix .n4-tag { --h: 40; }
.n4-aix .n4-tag--1 { --x: 400; --y: 35; --w: 222; }
.n4-aix .n4-tag--2 { --x: 632; --y: 35; --w: 82; }
.n4-aix .n4-tag--3 { --x: 400; --y: 85; --w: 317; }
.n4-aix .n4-desc { --x: 43; --y: 147; --w: 584; }
.n4-aix .n4-lack { --x: 884; --y: 146; --w: 316; --h: 53; border-radius: 2px 0 0 2px; }
.n4-adv { --x: 120; --y: 2156; --w: 1200; --h: 280; }
.n4-adv .n4-photo { --x: 0; --y: 0; --w: 525; --h: 280; border-radius: 4px 0 0 4px; }
.n4-adv .n4-ttl { --x: 500; --y: 35; --w: 660; --h: 82; }
.n4-adv .n4-tag { --h: 40; --y: 142; --w: 98; }
.n4-adv .n4-tag--1 { --x: 500; }
.n4-adv .n4-tag--2 { --x: 608; }
.n4-adv .n4-tag--3 { --x: 716; }
.n4-adv .n4-tag--4 { --x: 500; --y: 192; --w: 166; }
.n4-adv .n4-tag--5 { --x: 676; --y: 192; --w: 138; }
.n4-adv .n4-desc { --x: 844; --y: 153; --w: 316; line-height: 1.75; text-align: left; }
.n4-adv .n4-lack { --x: 0; --y: 201; --w: 319; --h: 53; border-radius: 0 2px 2px 0; }

@media (max-width: 1023px) {
  .next01__inner { --pw: 375; --ph: 2170; aspect-ratio: 375 / 2170; }
  .n4-sheis { --x: 44; --y: 105.24; --w: 299; }
  .n4-ring { --x: 20; --y: 255; --w: 335; --h: 335; }   /* 10/26 Figma：268→255 */
  .n4-ring__circles { --w: 335; -webkit-backdrop-filter: blur(2.5px); backdrop-filter: blur(2.5px); }
  .n4-ring__num { --x: 61.01; --y: 161.42; --w: 213.07; }
  .n4-pill { --x: 61; --y: 121; --w: 213; --h: 32; font-size: calc(14 * var(--u)); letter-spacing: .05em; }

  .n4-chart { --x: 44; --y: 492; --w: 287; --h: 299; }   /* 台紙は上に円へつながる線と点（Figma 10/26） */
  .n4-chart__card { --w: 287; filter: drop-shadow(0 0 calc(3 * var(--u)) rgb(0 61 166 / .2)); }
  .n4-chart__label { --x: 16; --y: 54; --w: 255; --h: 26.9; font-size: calc(14 * var(--u)); letter-spacing: .08em; box-shadow: 0 0 calc(5.6 * var(--u)) rgb(0 61 166 / .2); }
  .n4-bar--2022 { --x: 25.5; --y: 95.9; --w: 102.5; --h: 143.4; }
  .n4-bar--2040 { --x: 158.3; --y: 139.2; --w: 102.5; --h: 100.1; }
  .n4-gap { --x: 158.3; --y: 95.9; --w: 102.5; --h: 41; border-width: calc(.76 * var(--u)); border-radius: calc(.8 * var(--u)); }
  .n4-axis { --x: 25.5; --y: 239; --w: 235.3; --h: .76; }
  .n4-val { font-size: calc(16.7 * var(--u)); }
  .n4-val small { font-size: calc(12.14 * var(--u)); }
  .n4-val--2022 { --x: 25.5; --y: 120.1; --w: 102.5; }
  .n4-val--2040 { --x: 158.3; --y: 164.1; --w: 102.5; }
  .n4-val--gap { --x: 158.3; --y: 124.8; --w: 102.5; font-size: calc(23.38 * var(--u)); }
  .n4-val--gap small { font-size: calc(15.18 * var(--u)); }
  .n4-arrow2 { --x: 117.1; --y: 104; --w: 42.1; }
  .n4-year { --x: 25.5; --y: 255.7; --w: 102.5; font-size: calc(12.14 * var(--u)); }
  .n4-year--2040 { --x: 158.3; }
  .n4-chart__src { --x: 24; --y: 266.7; --w: 250; font-size: calc(8 * var(--u)); line-height: 1.375; }

  .n4-ttl { font-size: calc(16 * var(--u)); box-shadow: 0 0 calc(22.62 * var(--u)) var(--n4-glow); }
  .n4-tag { font-size: calc(12 * var(--u)); letter-spacing: 0; }
  .n4-desc { font-size: calc(12 * var(--u)); line-height: 1.5; }
  .n4-card { border-radius: 0; overflow: visible; }   /* 10/28 本人：タイトルの白い箱を写真の幅に広げたので、光彩が切れないよう枠で隠さない */
  .n4-card .n4-photo { --x: 0; --y: 0; --w: 335; border-radius: 1px; }   /* 10/28 本人：写真の四隅を1pxの角丸に */
  .n4-card .n4-ttl { --x: 0; --w: 335; --h: 34; border-radius: 1px; }   /* 10/28 Figma SP：白い箱を写真と同じ幅に・角丸1px */
  .n4-card .n4-tag { --h: 23; }
  .n4-card .n4-desc { --x: 12; --w: 311; text-align: justify; line-height: 1.5; }   /* 10/27 Figma SP 2470:9544：カードの面をなくして本文を写真の幅に */
  .n4-lack { padding: calc(6.1 * var(--u)) 0 0 calc(9.4 * var(--u)); box-shadow: 0 0 calc(2.625 * var(--u)) rgb(0 61 166 / .2); font-size: calc(14 * var(--u)); }
  .n4-lack b { font-size: calc(18 * var(--u)); }
  .n4-card .n4-lack { --x: 0; --y: 118; --h: 29.8; border-radius: 0 2px 2px 0; }
  /* 10/29 本人：393・430 で白い箱だけ広がり文字とずれた（文字は1pxで止まり、箱は画面に合わせて伸びていた）。箱も --u で測り、下端を写真の下端（118+29.8）に固定する */
  .n4-card .n4-lack { width: calc(var(--w) * var(--u)); height: calc(29.8 * var(--u)); top: calc(147.8 / var(--ph) * 100% - 29.8 * var(--u)); }

  .n4-asis { --x: 20; --y: 931; --w: 335; --h: 320; background: none; --n4-glow: rgb(0 61 166 / .15); }   /* 10/27 Figma SP：青い面なし */
  .next01 .n4-asis__bg { display: none; }
  .n4-asis__head { --x: 221; --y: 17; --w: 99; }
  .n4-asis__sub { --x: 239.2; --y: 61.3; --w: 81.1; }
  .n4-asis .n4-ttl { --y: 168; }
  .n4-asis .n4-tag { --y: 212; }
  .n4-asis .n4-tag--1 { --x: 16; --w: 88; }
  .n4-asis .n4-tag--2 { --x: 108; --w: 87; }
  .n4-asis .n4-tag--3 { --x: 199; --w: 120; }
  .n4-asis .n4-desc { --y: 250; }
  .next01 .n4-arrow { display: none; }   /* 10/27 Figma：矢印をなくした */

  .n4-tobe { --x: 31.59; --y: 1229.48; --w: 333.33; --h: 169; }   /* 10/27 Figma SP 2470:9716（×・丸なし）＋2470:9719（TOBE・AI）を1枚に。白い光彩の分だけ大きい */

  .n4-aix, .n4-adv { --w: 335; --h: 316; background: none; --n4-glow: rgb(235 78 128 / .15); }   /* 10/27 Figma SP：ピンクの面なし */
  .n4-aix { --x: 20; --y: 1411.07; }
  .n4-adv { --x: 20; --y: 1739.07; }
  .n4-aix .n4-ttl, .n4-adv .n4-ttl { --y: 168; }
  .n4-adv .n4-ttl { letter-spacing: 0; }
  .n4-aix .n4-tag, .n4-adv .n4-tag { --y: 212; }
  .n4-aix .n4-tag--1 { --x: 15; --w: 127; }
  .n4-aix .n4-tag--2 { --x: 146; --w: 42; }
  .n4-aix .n4-tag--3 { --x: 192; --w: 128; }
  .n4-adv .n4-tag--1 { --x: 17; --w: 49; }
  .n4-adv .n4-tag--2 { --x: 70; --w: 49; }
  .n4-adv .n4-tag--3 { --x: 123; --w: 49; }
  .n4-adv .n4-tag--4 { --x: 176; --w: 77; }
  .n4-adv .n4-tag--5 { --x: 257; --w: 61; }
  .n4-aix .n4-desc, .n4-adv .n4-desc { --y: 250; }
  .n4-aix .n4-lack { --w: 183.9; }
  .n4-adv .n4-lack { --w: 184.9; }
}

/* ---------- 05_SHE project ----------
   白の上に水色の面（下の角が丸い：PC30・SP15）。見出し画像は Figma の位置（PC x73・幅1297）
   カルーセル：横スクロール＋吸着。PCで真ん中のカードを大きく見せる動きは次回 */
.project { background: var(--color-white); }
.project__panel { background: var(--color-blue-200); border-radius: 0 0 30px 30px; padding: 80px 0 111px; overflow: hidden; }
.project__head { width: min(1297px, 100% - 64px); margin: 0 auto; }
.project__head img { width: 100%; }
.project__intro { width: min(1200px, 100% - 64px); margin: 79px auto 0; }
.project__lead { margin-top: calc(35px + (1em - 1lh) / 2); font: 500 18px/1.89 var(--font-sans); letter-spacing: .05em; }   /* Figma：Medium 18・行間34・字間5%。上は行間の余白を切って置く（10/20） */
/* カルーセル（ぐるぐる自動で回る・2026-10-16 本人）。位置は JS が transform で動かす
   --w：カード1枚の幅（画像は影の余白込み）／--g：すき間／--m：真ん中の大きいカードの左右の余白／--scale：真ん中の拡大率
   --anchor：center＝真ん中に合わせる、start＝左の --start に合わせる */
.carousel {
  position: relative; margin-top: 31px; overflow: hidden;
  /* 送り：2秒ごと（index.html の data-interval）・0.9秒かけて流れる（本人 11/2 C案＝比較 tools/carousel_1102.html。前は10/21の2.5秒ごと・0.35秒） */
  --cr-dur: .9s; --cr-ease: cubic-bezier(.45, 0, .25, 1);
  --w: 494px; --g: 0px; --m: 65px; --scale: 1.2227; --start: 0px;
}
.carousel__track {
  display: flex; gap: var(--g); align-items: center;
  height: 480px; margin: 0; padding: 0;
  transition: transform var(--cr-dur, .6s) var(--cr-ease, ease); will-change: transform;
  touch-action: pan-y;
}
.carousel.is-jumping .carousel__track, .carousel.is-jumping .pj-card { transition: none; }
.pj-card { flex: 0 0 var(--w); transition: transform var(--cr-dur, .6s) var(--cr-ease, ease), margin var(--cr-dur, .6s) var(--cr-ease, ease); }
/* PC：真ん中のカードだけ大きく（Figma 大584×450／通常474×368。見た目のすき間＝大きいカードの両隣30・ほか20） */
.pj-card.is-active { transform: scale(var(--scale)); margin: 0 var(--m); position: relative; z-index: 1; }
.pj-card img { width: 100%; height: auto; }
.pj-card a { display: block; }
.carousel__arrow {
  position: absolute; top: 240px; transform: translateY(-50%); z-index: 2;
  width: 65px; height: 65px; border-radius: 50%;
  display: grid; place-items: center;
  color: var(--color-blue);
  background: var(--glass-bg); border: var(--glass-border); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); box-shadow: var(--glass-shadow);   /* すりガラス（10/20） */
  transition: background .25s, color .25s, transform .15s;
}
/* 押せることが分かるように：マウスを乗せると白を少し足す（すりガラスのまま。青く塗るのはやめた・本人 10/20「押した時も透明感を保つ」）／押した瞬間に少し縮む */
@media (hover: hover) { .carousel__arrow:hover { background: rgb(255 255 255 / .62); } }
.carousel__arrow:active { transform: translateY(-50%) scale(.9); }
.carousel__arrow:focus-visible { outline: 2px solid var(--color-blue); outline-offset: 3px; }
/* カードもマウスを乗せると少し持ち上がる */
.pj-card a { transition: transform var(--card-hover-dur) ease, filter var(--card-hover-dur) ease; }
@media (hover: hover) { .pj-card a:hover { transform: var(--card-lift); filter: drop-shadow(var(--card-hover-shadow)); } }
/* 10/30 本人 A案：矢印の真ん中を、真ん中のカード（見た目の幅＝--w × --scale）の左右の端に置く＝隣のカードの文字にかからない */
.carousel__arrow--prev { left: calc(50% - var(--w) * var(--scale) / 2 - 32.5px); }
.carousel__arrow--next { right: calc(50% - var(--w) * var(--scale) / 2 - 32.5px); }
/* ドット：Figma PC＝直径16.5・間隔23／SP＝5.6・8。色は #edf0f8 と青 */
.carousel__dots { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 18px; }
/* 丸は小さく（16.5→10。本人 10/19）。今のカードは丸のまま色だけ切り替わる（本人 10/21 B案） */
/* 色はFigma（10/21 本人が調整）：今以外＝05 #f0f0f0／07 #c8cbd3、今＝blue。05と07で色が違ってよい（本人 10/21） */
.carousel__dots span { width: 10px; height: 10px; border-radius: 999px; background: #f0f0f0; transition: background .35s ease; }
.carousel--work .carousel__dots span { background: #c8cbd3; }
.carousel__dots span.is-active { background: var(--color-blue); }

@media (max-width: 1023px) {
  .project { --u: min(calc(100vw / 375), 1.5px); }
  .project__panel { border-radius: 0 0 calc(15 * var(--u)) calc(15 * var(--u)); padding: calc(35 * var(--u)) 0 calc(40 * var(--u)); }
  .project__head { width: calc(327 * var(--u)); }
  .project__intro { width: calc(311 * var(--u)); margin-top: calc(35 * var(--u)); }
  .project .sec-title { width: auto; }
  .project__lead { margin-top: calc(17.5px + (1em - 1lh) / 2); font-weight: 400; font-size: 13px; line-height: 1.7; letter-spacing: 0; }   /* 10/28 本人：08の会社説明資料と同じ余白・行間に */
  .project__lead { margin-right: calc(-12 * var(--u)); }   /* 10/30 本人「す。」だけ落ちる：2行目が列（311）より11px長い＝右だけ12はみ出してよいことにして2行に収める（右の余白は32→20＝カードの端と同じ） */
  /* SP：大きくしない・左寄せ（カードの左＝20。画像に影の余白3pxずつ込み） */
  /* SPも今のカードを真ん中に・真ん中だけ大きく（本人 10/21）。大きくなったときに前の大きさ（306）になるよう、元は260 */
  .carousel { margin-top: calc(24 * var(--u)); --w: calc(260 * var(--u)); --g: calc(10 * var(--u)); --m: calc(23 * var(--u)); --scale: 1.177; --start: calc(17 * var(--u)); }
  .carousel__track { height: auto; align-items: center; padding: calc(20 * var(--u)) 0; }
  .carousel__arrow { display: none; }
  .carousel__dots { margin-top: calc(20 * var(--u)); gap: calc(6 * var(--u)); }
  .carousel__dots span { width: calc(5 * var(--u)); height: calc(5 * var(--u)); }
  /* 10/30 本人「SPで丸が横長になっているものがある」：端数の大きさ・間隔（5.24pxなど）だと画面の点に合わせるときに幅と高さが別々に丸められて楕円に見える＝整数のpxにそろえる */
  .carousel__dots { gap: round(calc(6 * var(--u)), 1px); }
  .carousel__dots span { flex: none; width: round(calc(5 * var(--u)), 1px); height: round(calc(5 * var(--u)), 1px); }
}

/* ---------- 06_update_Organization（丸ごと1枚の画像） ----------
   画像の下の角は丸く、角の外は #f5f8ff（07の背景）。PCは最大1440幅で中央、SP・iPadはSPの絵を最大562幅で中央 */
.org { background: #f5f8ff; }
/* パーツを重ねる台（Figma の縦横比のまま、画面の幅いっぱいに広げる。下の角は丸く、角の外は07の背景色） */
.org__stage { position: relative; aspect-ratio: 1440 / 1331; overflow: hidden; background: var(--color-white); border-radius: 0 0 30px 30px; }
.org__part { position: absolute; left: var(--x); top: var(--y); width: var(--w); }
.org__part img { width: 100%; height: auto; }
.org__tex    { --x: 53.68%; --y: -11.195%; --w: 73.33%; }
.org__band   { --x: 0%;     --y: 41.698%; --w: 100%; }   /* 10/27 Figma：帯は y555（書き出し直し pc_band2） */
/* タイトルは Figma では左右に少しはみ出していた（-11〜1442）。切れないよう幅の中に収めた（本人 10/19「幅が足りてない」） */
.org__title  { --x: 0;      --y: 16.566%; --w: 100%; }   /* Figma と同じく左右の端で見切れる（書き出しを枠で切った・本人 10/20） */
.org__head   { --x: 8.333%; --y: 9.016%;  --w: 39.65%; }
.org__lead   { --x: 22.5%;  --y: 35.763%; --w: 69.375%; }
.org__way    { --x: 29.79%; --y: 47.333%; --w: 27.85%; }   /* 10/28 Figma 2491:23024：y630 */
.org__values { --x: 62.5%;  --y: 46.807%; --w: 29.17%; --i: 1; }   /* --i：SHE WAY の少しあとに出す／10/28：y623・420×467（「私たちならできる」を大きく） */
@media (max-width: 1023px) {
  .org__stage { aspect-ratio: 375 / 1321;   /* 10/28 Figma 2491:23307（「私たちならできる」を大きくして1305→1321） */
                width: min(100%, 562px); margin: 0 auto; border-radius: 0 0 15px 15px; }
  .org__band   { --x: 0%;     --y: 0%;     --w: 100%; z-index: 0; }
  .org__tex    { --x: 21.6%;  --y: 23.240%; --w: 100.53%; z-index: 1; }
  .org__title  { --x: 0;      --y: 7.442%; --w: 100%; z-index: 2; }
  .org__head   { --x: 8.53%;  --y: 3.785%;  --w: 79.2%; }
  .org__lead   { --x: 8.53%;  --y: 19.985%; --w: 56.53%; }
  .org__way    { --x: 11.73%; --y: 37.926%; --w: 68.27%; }
  .org__values { --x: 11.73%; --y: 60.787%; --w: 80.533%; }   /* 10/28：302×318 */
}

/* ---------- 07_numbers_SHE ----------
   前半＝1枚の画像（背景 #f5f8ff）／後半＝「私たちの働く姿」カルーセル（05の仕組みを使う。大きくしない・左寄せ） */
.numbers { background: #f5f8ff; padding-bottom: 80px; }
.numbers__top { display: block; width: min(1440px, 100%); margin: 0 auto; }
/* 07のカード（パーツ）。--x/--y/--w は Figma に対する% */
.numbers__top { position: relative; }
.numbers__base img { width: 100%; }
.numbers__part { position: absolute; left: var(--x); top: var(--y); width: var(--w); }
.numbers__part picture { display: block; }
.numbers__part img { width: 100%; height: auto; }
/* 並んだカードは少しずつ遅らせて出す（--i × 0.11秒） */
.numbers__part--heat, .numbers__part--s2 { --i: 1; }
.numbers__part--s3 { --i: 2; }
.numbers__part--jobs { --x: 6.944%; --y: 8.531%; --w: 86.111%; }
.numbers__part--agehead { --x: 8.264%; --y: 44.028%; --w: 83.472%; }
.numbers__part--age { --x: 6.944%; --y: 47.251%; --w: 43.75%; }
.numbers__part--heat { --x: 49.306%; --y: 47.251%; --w: 44.861%; }
.numbers__part--s1 { --x: 8.333%; --y: 82.085%; --w: 27.604%; }
.numbers__part--s2 { --x: 36.528%; --y: 82.654%; --w: 27.014%; }
.numbers__part--s3 { --x: 64.722%; --y: 82.701%; --w: 26.944%; }
@media (max-width: 1023px) {
  .numbers__part--jobs { --x: 2.667%; --y: 3.657%; --w: 94.667%; }
  .numbers__part--agehead { --x: 8.533%; --y: 25.347%; --w: 82.933%; }
  .numbers__part--age { --x: 2.667%; --y: 27.533%; --w: 94.667%; }
  .numbers__part--heat { --x: 2.667%; --y: 43.043%; --w: 94.667%; }
  .numbers__part--s1 { --x: 5.333%; --y: 63.262%; --w: 89.387%; }
  .numbers__part--s2 { --x: 11.733%; --y: 76.377%; --w: 77.173%; }
  .numbers__part--s3 { --x: 11.733%; --y: 88.230%; --w: 76.533%; }
}

/* 07の文字（2026-10-20 本人「全部テキストに」）。画像から文字を消して、パーツの中に重ねる＝カードと一緒に出る
   位置はパーツに対する%（縦は行の真ん中）。文字の大きさは Figma の px が上限（狭い画面でだけ縮む） */
.numbers__top { container-type: inline-size; }
.numbers__part > :is(p, h3) { position: absolute; margin: 0; transform: translateY(-50%); }
.n-quote { left: var(--tx); top: var(--ty); width: var(--tw); text-align: center; color: var(--color-blue);
  font: 700 min(calc(35 * var(--cap)), calc(35 / var(--b) * 100cqw))/1.76 var(--font-sans); letter-spacing: .07em; }
.n-quote--jobs { --tx: 1.613%; --ty: 4.724%; --tw: 96.774%; }
.n-quote--age { --tx: .083%; --ty: 66.019%; --tw: 99.834%; }
.n-sys__title { left: 0; top: var(--t1); white-space: nowrap; color: var(--color-blue);
  font: 700 min(calc(20 * var(--cap)), calc(20 / var(--b) * 100cqw))/1.6 var(--font-sans); letter-spacing: .07em; }
.n-sys__title small { font-size: .7em; letter-spacing: .05em; }
.n-sys__desc { left: 0; top: var(--t2); white-space: nowrap; color: var(--color-navy);
  font: 400 min(calc(14 * var(--cap)), calc(14 / var(--b) * 100cqw))/1.55 var(--font-sans); letter-spacing: .05em; }
.numbers__part--s1 { --t1: 80.948%; --t2: 95.131%; }
.numbers__part--s2 { --t1: 80.267%; --t2: 94.955%; }
.numbers__part--s3 { --t1: 80.212%; --t2: 94.945%; }
@media (max-width: 1023px) {
  .n-quote { font-size: min(calc(16 * var(--cap)), calc(16 / var(--b) * 100cqw)); line-height: 1.45; letter-spacing: .02em; }
  .n-quote--jobs { --tx: 9.577%; --ty: 5.094%; --tw: 80.845%; }
  .n-quote--age { --tx: 3.859%; --ty: 56.081%; --tw: 92.283%; }
  /* 10/30 本人「ちょんちょんの離れ具合を iPhone 15 に合わせて」：引用符は画像から消して文字に付けた（文字は16pxで止まるのに画像は大きくなり、幅で離れ方が変わっていた）
     文字の箱は一番長い行の幅。引用符の大きさ・距離は iPhone 15（393幅）の実測を em にしたもの */
  .numbers__part > .n-quote { left: 50%; width: max-content; transform: translate(-50%, -50%); }
  .n-quote::before, .n-quote::after { content: ""; position: absolute; top: -.156em; width: 1.146em; height: .917em; background: rgb(189 209 246 / .7);
    -webkit-mask: url(../assets/modal/quote_open_solid.svg) no-repeat 0 0 / 100% 100%; mask: url(../assets/modal/quote_open_solid.svg) no-repeat 0 0 / 100% 100%; }
  .n-quote::after { -webkit-mask-image: url(../assets/modal/quote_close_solid.svg); mask-image: url(../assets/modal/quote_close_solid.svg); }
  .n-quote--jobs::before { left: -2.028em; }
  .n-quote--jobs::after { right: -1.995em; }
  .n-quote--age::before { left: -1.764em; width: 1.135em; }   /* 10/30 本人「下のちょんちょんを少し広げて」：文字との間 6px→10px（どの幅でも同じ） */
  .n-quote--age::after { right: -1.735em; width: 1.135em; }
  .numbers__part--agehead picture { visibility: hidden; }   /* SPの画像は引用符だけ＝文字側に付けたので隠す */
  .n-sys__title { translate: 0 max(calc(-1 * var(--cap)), calc(-1 / var(--b) * 100cqw));   /* 10/28 本人「タイトルと説明が開きすぎ」：Figma SP（写真→タイトル17・タイトル→説明14）に合わせて4px下げた */ font-weight: 500; font-size: min(calc(16 * var(--cap)), calc(16 / var(--b) * 100cqw)); line-height: 1.8; letter-spacing: 0; }   /* 16px・Medium（Figma 10/22）。説明文との間はFigmaの文字の中心どうしで約33px */
  .n-sys__title small { font-size: min(calc(14 * var(--cap)), calc(14 / var(--b) * 100cqw)); }
  .n-sys__desc { translate: 0 max(calc(-3 * var(--cap)), calc(-3 / var(--b) * 100cqw)); width: var(--tw); white-space: normal; font-size: min(calc(13 * var(--cap)), calc(13 / var(--b) * 100cqw)); line-height: 1.67; letter-spacing: .02em; }
  .numbers__part--s1 { --t1: 80.487%; --t2: 94.049%; --tw: 89.2%; }
  .numbers__part--s1 > :is(p, h3) { left: 7.16%; }
  .numbers__part--s2 { --t1: 78.275%; --t2: 93.427%; --tw: 103.318%; }
  .numbers__part--s3 { --t1: 78.013%; --t2: 93.228%; --tw: 104.182%; }
}

.numbers__work { margin-top: 40px; }
.numbers__work .sec-title { width: min(1200px, 100% - 64px); margin: 0 auto; }
/* PC：カード458幅（画像は影の余白10px込みで478）。すき間20。左端は1440幅の中で x208 */
/* PC：05と同じく真ん中のカードを大きく（本人 10/19）。拡大1.15倍・大きいカードの左右に --m の余白 */
.carousel--work { margin-top: 50px; }   /* 10/28：カードを新しいデザイン（500×370）にしたので、大きさ・動きは05（SHE PROJECTS）と同じ */
.carousel--work .pj-card a { --pad: 10px; position: relative; padding: var(--pad); }   /* 05のカード画像は影の余白10px込み＝見た目の大きさをそろえる */
/* MORE の矢印（10/29 本人「カーソルを当てたら動いてほしい」）：画像から消してSVGで重ねた。Figma 2538:65160（カード500×370の x446.67・y345・幅12.22） */
.pj-card__arrow { position: absolute; left: calc(var(--pad) + (100% - 2 * var(--pad)) * .8933); top: calc(var(--pad) + (100% - 2 * var(--pad)) * .9324); width: calc((100% - 2 * var(--pad)) * .02444); color: var(--color-white); }
.pj-card__arrow svg { display: block; width: 100%; height: auto; aspect-ratio: 1; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
@media (hover: hover) { .pj-card a:hover .pj-card__arrow svg { animation: arrow-through .6s ease; } }
.carousel--work .pj-card img { border-radius: 4px; box-shadow: 0 0 10px rgb(0 61 166 / .2); }
@media (max-width: 1023px) {
  .numbers { --u: min(calc(100vw / 375), 1.5px); padding-bottom: calc(40 * var(--u)); border-radius: 0 0 calc(15 * var(--u)) calc(15 * var(--u)); }   /* 下の角だけ丸い（Figma SP 15px・本人 10/21） */
  .numbers__top { width: min(100%, 562px); }
  .numbers__work { margin-top: calc(46 * var(--u)); }   /* 10/28 Figma SP：ボタンの下→「私たちの働く姿」46 */
  .numbers__work .sec-title { width: calc(311 * var(--u)); }
  /* SP：カード279幅（画像は余白込み289）。左端20 */
  /* 働く姿もSHE PROJECTSと同じ形（本人 10/21「カードが切れてる・でかい」）。元236・真ん中で276 */
  .carousel--work { margin-top: calc(14 * var(--u)); }
  .carousel--work .pj-card a { --pad: calc(3 * var(--u)); }   /* 05のSPの画像は影の余白3px込み */
  .carousel--work .pj-card img { border-radius: 2px; box-shadow: 0 0 7px rgb(0 61 166 / .2); }
}

/* 始まりの状態では、今のカードより左（前の組の複製）を見せない */
.carousel.is-start .pj-card:nth-child(-n+3) { visibility: hidden; }

/* ---------- 08_update_team（文字で組む・10/22 組み直し） ----------
   数値は Figma の px（PC 1440幅／SP 375幅）。
   PC：--s＝1px（1440より狭い画面ではその比率で縮む）。SP：--u＝余白・幅（最大1.5倍＝iPad）／--t＝文字（Figma の px が上限） */
.team { background: #f5f8ff; --s: min(1px, calc(100vw / 1440)); }
.team__wrap { position: relative; z-index: 0; isolation: isolate; width: min(1440px, 100%); margin: 0 auto; padding-bottom: calc(120 * var(--s)); background: #fff; }
/* 広い画面でも白い面を画面の左右の端まで（本人 10/21）。10/26 本人「カルチャーデックの右側に白が塗られてない」＝下端まで白にする */
.team__wrap::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; z-index: -1; width: 100vw; transform: translateX(-50%); background: #fff; }
/* 背景の筆（PC・10/28 夕 Figma 2470:10890）：筆は枠の (-146, 331) から（10/28 夕に左下の小さい筆はなくなった）。白地の画像なので乗算で重ねる
   1440の外（広い画面の左右）は筆の続きを見せる＝横は切らない（上下だけ台の高さで切る） */
.team__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; clip-path: inset(0 -100vw); }
.team__bg picture { position: absolute; left: 0; width: 100%; }
.team__bg .team__bg-top { left: calc(55 * var(--s)); top: calc(-424 * var(--s) + var(--title-grow)); width: calc(3219 * var(--s));
  --title-grow: max(0px, (min(100vw, 2560px) - 1440px) * .0696);   /* 1440より広い画面ではタイトルが大きくなり、下の文章も下がる（2560で77）。筆も同じだけ下げる */
  -webkit-mask: linear-gradient(transparent calc(866 * var(--s)), #000 calc(1026 * var(--s))); mask: linear-gradient(transparent calc(866 * var(--s)), #000 calc(1026 * var(--s))); }   /* 10/29 夕 Figma 2538:76553：筆を小さく（3218×3147）・右へ（x55・y-424）。タイトルの下端より上の筆はぼかして消す（本人「広げた時に文字にかぶってほしくない」） */
.team__bg-sp, .team__tex { display: none; }
.team__bg img { width: 100%; mix-blend-mode: multiply; }
.team__bg .team__bg-top img { mix-blend-mode: normal; }   /* 透ける画像なので乗算しない（Figma も通常） */
.team__ext { display: none; }   /* 10/28：PCの筆を新しくしたので、1440の外の古い筆は使わない */

.team__intro, .team__block { position: relative; z-index: 1; }

/* 上：03の見出し・タイトル・リード文（Figma の位置そのまま） */
.team__intro { height: calc(586 * var(--s)); }
.team__intro > .team__part { position: absolute; margin: 0; }
.team__part--head { left: calc(120 * var(--s)); top: calc(100 * var(--s)); }
.team__part--title { left: 0; top: calc(201 * var(--s)); width: 100%; }
.team__part--title img { width: 100%; height: auto; }
.team__part--lead { left: calc(120 * var(--s)); top: calc(449 * var(--s)); }
/* タイトルは画面の左右の端で見切れる（本人 10/21）。1440より広い画面では画面幅に合わせて大きくする（2560幅まで。10/22 本人「1920より広い画面で端が切れていない」）
   上下には均等に広げて、上の「03」と下の文章の間に収める（画像の高さ＝幅×0.1392 の半分ずつ） */
@media (min-width: 1441px) {
  .team__part--title {
    --tw: min(100vw, 2560px);
    left: calc((100% - var(--tw)) / 2); width: var(--tw);
    top: calc(201px - (var(--tw) - 1440px) * .0696);
  }
  /* 下に広がった分だけ文章と枠の高さも下げる＝タイトルと文章の間は1440のとき（Figma）と同じ（本人 10/26「ここめっちゃ近い」） */
  .team__intro { height: calc(586px + (min(100vw, 2560px) - 1440px) * .0696); }
  .team__part--lead { top: calc(449px + (min(100vw, 2560px) - 1440px) * .0696); }
}

.team__block { padding: 0 calc(120 * var(--s)); }
.team__block--msg { margin-top: calc(80 * var(--s)); }
.team__block--deck { margin-top: calc(67 * var(--s)); }

/* 募集ポジション：カード 850×130・間15（Figma） */
.team-pos { display: grid; gap: calc(15 * var(--s)); width: calc(850 * var(--s)); margin: calc(50 * var(--s)) auto 0; }
.team-pos__card {
  display: grid; grid-template-columns: calc(262 * var(--s)) 1fr calc(26 * var(--s)); align-items: center;   /* 左の列 230→262：いちばん長い職種名（222）＋間40。説明文の右端は動かさず左端だけ右へ（本人 10/25） */
  min-height: calc(130 * var(--s)); padding: calc(17 * var(--s)) calc(52 * var(--s));
  border-radius: calc(4 * var(--s)); box-shadow: 0 0 10px rgb(0 61 166 / .2);
  background: rgb(255 255 255 / .8); -webkit-backdrop-filter: blur(7.5px); backdrop-filter: blur(7.5px);   /* すりガラス：白80%（10/28 本人。Figma は75%）＋背景ぼかし15。PC・SP共通 */
  color: var(--color-blue); -webkit-tap-highlight-color: transparent;
  transition: transform .3s ease, box-shadow .3s ease;
}
.team-pos__name { font: 700 calc(16 * var(--s))/1.75 var(--font-sans); }
.team-pos__br { display: block; }
/* 事業部の名前（10/25）：職種名の上に小さく。枠なし・左づめ・12px（本人 10/25） */
.team-pos__unit { display: block; margin-bottom: calc(4 * var(--s)); color: rgb(0 61 166 / .7); font: 500 calc(12 * var(--s))/1.6 var(--font-sans); letter-spacing: .05em; }   /* 事業名は青70%（Figma 10/26） */
.team-pos__sub { display: block; margin-top: calc(4 * var(--s)); font: 700 calc(13 * var(--s))/1.45 var(--font-sans); }   /* オープンポジションの2行目（Figma 2547:1794・13px／行送り18.85・PCは2行） */
.team-pos__desc { padding-right: calc(40 * var(--s)); font: 400 calc(14 * var(--s))/1.7 var(--font-sans); text-align: justify; line-break: strict; }   /* 10/29 Figma：説明文を両端そろえに */
.team-pos__desc--tight { letter-spacing: -.01em; }   /* オープンポジションだけ字間を詰める（Figma -0.14／-0.12） */
/* 行き先は外（HERP）なので丸なしの斜めの矢印「↗」（本人 10/22 tools/posarrow.html の C）。カーソルを合わせると斜めに抜けて戻る */
.team-pos__arrow { display: grid; place-items: center; width: calc(26 * var(--s)); height: calc(26 * var(--s)); }
.team-pos__arrow svg { width: calc(12 * var(--s)); height: calc(12 * var(--s)); fill: none; stroke: currentColor; stroke-width: 1.4; }
@media (hover: hover) { .team-pos__card:hover .team-pos__arrow svg { animation: arrow-through-ne .6s ease; } }
/* 動き（本人 10/21 D案）：出るときは動かさない。カーソルを合わせたら少し浮く・押すと少し縮む。PC・SP同じ */
@media (hover: hover) { .team-pos__card:hover { transform: var(--card-lift); box-shadow: var(--card-hover-shadow); } }
.team-pos__card:active { transform: scale(.98); }
.team-pos__card:focus-visible { outline: 2px solid var(--color-blue); outline-offset: 3px; }

/* 下のボタン2つ：390×75・間15（10/28 本人「2つ並びは全部15」）。見た目はモーダルの丸いボタン（.pill-btn）と同じ。modal.css より後に読まれても負けないよう .team__btns から書く */
.team__btns { display: flex; justify-content: center; gap: calc(15 * var(--s)); margin-top: calc(50 * var(--s)); }
.team__btns .team__btn { --modal-accent: var(--color-blue); --h: calc(75 * var(--s)); width: calc(390 * var(--s)); height: var(--h); margin: 0; font-size: calc(18 * var(--s)); }
/* 10/28 本人「ボタンは透ける仕様に（TOPのCTAと同じ見え方）」：青90%＋ぼかし8／白65%＋ぼかし10（Figma FV 2470:9961）。お問い合わせの線は残す（Figma 06 2491:24458） */
.team__btns .team__btn.pill-btn--fill { border-color: transparent; background: rgb(0 61 166 / .8); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.team__btns .team__btn.pill-btn--fill:hover { background: var(--color-blue-500); }
.team__btns .team__btn.team__btn--contact { background: rgb(255 255 255 / .6); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.team__btn-lines { display: flex; flex-direction: column; align-items: center; gap: calc(8 * var(--s)); line-height: 1; letter-spacing: .06em; }
.team__btn-sub { font-size: calc(14 * var(--s)); letter-spacing: 0; }   /* Figma の字間2.8の指定は描画に効いていない（文字の箱114幅）＝見た目に合わせて0 */

/* 代表メッセージ（10/25 Figma 2030:36476・本人 C-2）：白い板 1000 を左100に。写真と名前の札（500×210）は板の上端から30はみ出して中央に重ねる
   見出し（SVG 755）と本文（800・中央そろえ・16/30）は板の中央。板の上から見出しまで239・本文の下68 */
.team-msg { position: relative; width: calc(1000 * var(--s)); margin: calc(50 * var(--s)) 0 0 calc(100 * var(--s)); padding-top: calc(30 * var(--s)); }
.team-msg__person {
  position: absolute; left: calc(281 * var(--s)); top: 0; z-index: 1; display: flex; width: calc(437 * var(--s)); height: calc(210 * var(--s)); margin: 0;
}   /* 10/29 夕 Figma 2538:76675：白い札をなくして、写真（210）だけを板の上端からはみ出させる。肩書きと名前は写真の右35・板の中 */
.team-msg__photo img { box-shadow: 0 0 6px rgb(0 61 166 / .2); }
.team-msg__photo img { width: calc(210 * var(--s)); height: calc(210 * var(--s)); object-fit: cover; }
.team-msg__who { display: flex; flex-direction: column; justify-content: flex-start; gap: calc(11.2 * var(--s)); padding: calc(132 * var(--s)) 0 0 calc(35 * var(--s)); color: var(--color-blue); }   /* 10/29 夕 Figma：肩書きの字の頭が写真の上から135・名前の字の頭が168 */   /* 10/29 Figma 2538:76678：肩書きと名前の間を8広げる（肩書きの位置はそのまま＝上に8足して中央そろえ） */
.team-msg__role { order: -1; font: 500 calc(17 * var(--s))/1 var(--font-sans); letter-spacing: -.01em; }
.team-msg__en { font-family: "Noto Sans", var(--font-sans); }
.team-msg__name { font: 400 calc(39.24 * var(--s))/1 var(--font-serif); letter-spacing: .05em; white-space: nowrap; }   /* 10/29 夕 Figma 35→39.24 */
.team-msg__card { padding: calc(239 * var(--s)) 0 calc(68 * var(--s)); border-radius: calc(4 * var(--s)); background: rgb(255 255 255 / .8); -webkit-backdrop-filter: blur(7.5px); backdrop-filter: blur(7.5px); box-shadow: 0 0 10px rgb(0 61 166 / .2); }
.team-msg__catch { width: calc(755 * var(--s)); margin: 0 auto; }
.team-msg__catch img { width: 100%; height: auto; }
/* Figma は文字の箱の上下で行間の余白を切って置いている＝その分（(1em − 1行) ÷ 2）だけ上下を詰める */
.team-msg__body { width: calc(800 * var(--s)); margin: calc(50 * var(--s) + (1em - 1lh) / 2) auto calc((1em - 1lh) / 2); color: var(--color-navy); font: 400 calc(16 * var(--s))/1.875 var(--font-sans); text-align: center; }

/* 会社説明資料：16:9 の枠（Figma 1000×562・角丸5・影）。中身は Speaker Deck の iframe（10/28） */
.team__h--deck { font-size: calc(25 * var(--s)); }   /* 英語の見出し（Figma Poppins 500 25） */
.team-deck__lead { margin: calc(35 * var(--s) + (1em - 1lh) / 2) 0 calc((1em - 1lh) / 2); color: var(--color-navy); font: 500 calc(18 * var(--s))/1.89 var(--font-sans); letter-spacing: .05em; }   /* Figma：Medium 18・行間34・字間5% */
.team-deck { width: calc(1000 * var(--s)); margin: calc(50 * var(--s)) 0 0 calc(100 * var(--s)); }
.team-deck__note { width: calc(1000 * var(--s)); margin: calc(19 * var(--s)) 0 0 calc(100 * var(--s)); color: var(--color-navy); opacity: .5; font: 500 calc(14 * var(--s))/1.4 var(--font-sans); letter-spacing: .05em; text-align: center; }   /* Figma：不透明度50% */
.team-deck__embed {
  position: relative; aspect-ratio: 1000 / 562; overflow: hidden;
  border-radius: calc(5 * var(--s)); background: #fff; box-shadow: 0 0 20px rgb(0 61 166 / .15);
  transition: transform .3s ease, box-shadow .3s ease;
}
.team-deck__embed > * { display: block; width: 100%; height: 100%; border: 0; }
.team-deck__cover img { width: 100%; height: 100%; object-fit: cover; }
@media (hover: hover) { .team-deck__embed:has(> .team-deck__cover:hover) { transform: var(--card-lift); box-shadow: var(--card-hover-shadow); } }
.team-deck__cover:focus-visible { outline: 2px solid var(--color-blue); outline-offset: -2px; }

@media (max-width: 1023px) {
  .team { --u: min(calc(100vw / 375), 1.5px); --t: min(1px, var(--u)); }
  .team__wrap { width: min(100%, 562px); padding-bottom: calc(46 * var(--u)); }   /* 10/28 Figma：注記→セクションの下 */
  .team__wrap::before { bottom: calc(15 * var(--u)); }
  .team__intro { height: calc(359 * var(--u)); }
  .team__part--head { left: calc(32 * var(--u)); top: calc(50 * var(--u)); }
  .team__part--title { top: calc(102.3 * var(--u)); }
  .team__part--lead { left: calc(32 * var(--u)); top: calc(248 * var(--u)); width: calc(323 * var(--u)); }
  /* 10/28 Figma SP：背景の筆は1枚（列の上から214.9）／カードと代表メッセージの板・お問い合わせボタンはすりガラス（白の半透明＋背景のぼかし） */
  .team__bg .team__bg-top, .team__bg .team__bg-btm { display: none; }
  /* 10/28 夕 Figma SP：上の筆 (59.7, 214.9) 幅881.4／真ん中 (-316.4) 幅660.1／下 (46) 幅1205.7。SPは画面の外を切る */
  .team__bg { overflow: hidden; clip-path: none; }
  .team__bg .team__bg-sp { display: block; top: calc(214.875 * 100cqw / 375); left: calc(59.7 * 100cqw / 375); width: calc(881.4 * 100cqw / 375); }
  .team__bg .team__tex--c { left: calc(46 * 100cqw / 375); width: calc(1205.7 * 100cqw / 375); }
  .team__bg .team__tex { display: block; top: var(--top, 0); }   /* 真ん中と下の筆：--top は js/main.js が中身の位置から計算（Figma 10/28 夕：ボタンの下端1646→筆の下端1701／筆の上端1816→会社説明資料の見出し2396） */
  .team__block { padding: 0; }
  .team__h { margin-left: calc(32 * var(--u)); }
  .team__block--deck .team__h { margin-left: calc(20 * var(--u)); }   /* Figma で会社説明資料だけ左20 */
  .team__block--msg, .team__block--deck { margin-top: calc(50 * var(--u)); }

  .team-pos { gap: calc(10 * var(--u)); width: auto; margin: calc(15 * var(--u)) calc(20 * var(--u)) 0; }
  .team-pos__card {
    grid-template-columns: 1fr calc(26 * var(--t)); column-gap: calc(20 * var(--u)); row-gap: calc(12 * var(--t)); align-items: end;
    min-height: 0; padding: calc(20 * var(--u)); border-radius: calc(2 * var(--u)); box-shadow: 0 0 10px rgb(0 61 166 / .15);
  }
  .team-pos__name { grid-column: 1 / -1; font-size: calc(15 * var(--t)); line-height: 1.45; letter-spacing: .02em; }   /* 10/30 本人（Figma 2538:60915）：7%は開きすぎ＝2% */
  .team-pos__br:not(.team-pos__br--keep) { display: none; }   /* 長い名前（CA/RA）だけはSPでも「/」のあとで改行 */
  .team-pos__unit { margin-bottom: calc(4 * var(--t)); font-size: calc(12 * var(--t)); }
  .team-pos__sub { margin-top: 0; font-size: calc(13 * var(--t)); line-height: 1.65; }
  .team-pos__desc { padding-right: 0; font-size: calc(12 * var(--t)); line-height: 1.65; }
  .team-pos__arrow { width: calc(26 * var(--t)); height: calc(26 * var(--t)); }
  .team-pos__arrow svg { width: calc(11 * var(--t)); height: calc(11 * var(--t)); }

  .team__btns { flex-direction: column; align-items: center; gap: calc(10 * var(--u)); margin-top: calc(20 * var(--u)); }
  .team__btns .team__btn { --h: calc(50 * var(--u)); width: calc(287 * var(--u)); font-size: calc(14 * var(--t)); letter-spacing: .19em; }
  .team__btns .team__btn--contact { border-width: 1px; }
  .team__btn-lines { gap: calc(4 * var(--t)); letter-spacing: .16em; }
  .team__btn-sub { font-size: calc(12 * var(--t)); letter-spacing: 0; }

  /* 代表メッセージ（SP・10/25 Figma 1559:12839）：写真 100×100 を板の左上に重ねる（板の上端から 82.5 上・左28）。名前と役職は写真の右 */
  .team-msg { width: auto; margin: calc(20 * var(--u)) calc(32 * var(--u)) 0; padding-top: calc(85 * var(--u)); }   /* 10/29 Figma 2538:60970：板の上端は写真の上から85 */
  .team-msg__person { left: calc(28 * var(--u)); width: auto; height: auto; gap: calc(15 * var(--u)); background: none; box-shadow: none; }
  .team-msg__photo img { width: calc(100 * var(--u)); height: calc(100 * var(--u)); border-radius: calc(2 * var(--u)); box-shadow: var(--shadow-sp-m); }
  .team-msg__who { justify-content: flex-start; gap: calc(5 * var(--u)); padding: calc(26.5 * var(--u)) 0 0; }   /* 10/26 本人「名前と肩書きが近すぎ」→ 間5。10/29 本人「名前と下の板が近すぎ」→ Figma 2538:60976 の字の上端（写真の上から29）に合わせて34→26.5 */
  .team-msg__name { font-weight: 500; font-size: calc(22 * var(--t)); line-height: 1.05; letter-spacing: .07em; }   /* SPだけ1段階太く＝Medium（Figma 10/27） */
  .team-msg__role { order: 0; font: 400 calc(13 * var(--t))/1.6 var(--font-en), var(--font-sans); letter-spacing: 0; }
  .team-msg__en { font-family: inherit; }
  .team-msg__card { padding: calc(47 * var(--u)) calc(23.5 * var(--u)) calc(37 * var(--u));   /* 10/29 本人：板の長さをFigmaに（本文の下 32→37・本文の上 20→25） */
    border-radius: calc(2 * var(--u)); box-shadow: var(--shadow-sp-m); }
  .team-msg__catch { width: auto; margin: 0 calc(-23.5 * var(--u)); }
  .team-msg__body { width: auto; margin: calc(25 * var(--u) + (1em - 1lh) / 2) 0 calc((1em - 1lh) / 2); font-size: calc(12 * var(--t)); line-height: 1.65; text-align: justify; }

  .team__h--deck { font-size: calc(14 * var(--u)); }
  .team-deck__lead { margin: calc(17.5 * var(--u) + (1em - 1lh) / 2) calc(56 * var(--u)) calc((1em - 1lh) / 2) calc(20 * var(--u)); font-weight: 400; font-size: calc(13 * var(--t)); line-height: 1.7; letter-spacing: 0; }   /* 10/28 Figma 1559:12903：幅299（右の筆にかからない）・行間22.1 */
  .team-deck { width: auto; margin: calc(28 * var(--u)) calc(20 * var(--u)) 0; }   /* 10/28 Figma：本文→表紙30（文字の箱から） */
  .team-deck__note { width: auto; margin: calc(5 * var(--u)) calc(20 * var(--u)) 0; font-size: calc(10 * var(--t)); line-height: 1.5; }
  .team-deck__embed { border-radius: calc(2 * var(--u)); box-shadow: 0 0 10px rgb(0 61 166 / .15); }
}

/* ---------- 99_footer（HTMLで組む） ----------
   Figma に合わせ直した（2026-10-20 本人「Figmaのデザインに寄せて」）。数値は Figma の px そのまま（伸び縮みしない）
   PC（1440幅）：中身1200。運営会社＋ロゴ（左上）／サービス6つ（左から638）／規約3つ・SNS（左から998）／コピーライト（左下）。高さ411
   SP（375幅）：中身311。ロゴ→リンク2列（左0・左164）→SNS→コピーライト。高さ335
   10/22 Figma の直し：英字のサービス名は Poppins（「SHElikes PRO デザイナー」と規約3つは Noto Sans JP のまま）
   SPは文字を大きく（英字12px・日本語11px／元は全部10px）・2列目を左164へ・行の間隔を広く */
.site-footer { background: var(--color-navy); color: var(--color-white); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }   /* 濃い地の白文字が太って見えないように（Figmaと同じ Regular 400） */
.site-footer__inner {
  position: relative; width: min(1200px, 100% - 64px); margin: 0 auto; padding: 65px 0 85px;
  display: grid; grid-template-columns: minmax(0, 1fr) 360px 202px; row-gap: 0;
  font: 400 18px/1 var(--font-sans); letter-spacing: .05em;
}
.site-footer__brand { display: flex; align-items: center; gap: 25px; align-self: start; }
.site-footer__brand img:first-child { width: 67px; height: auto; }
.site-footer__brand img:last-child { width: 83px; height: auto; }
.site-footer__services, .site-footer__legal { display: flex; flex-direction: column; gap: 30px; padding-top: 3px; }
.site-footer__services { grid-column: 2; grid-row: 1 / 3; }
.site-footer__legal { grid-column: 3; grid-row: 1; }
.site-footer li { white-space: nowrap; }
.site-footer li.is-en { position: relative; top: 2px; font-family: var(--font-en); }   /* Poppins は Noto より字面が上に出るので2px下げて Figma の位置に */
.site-footer a:hover { opacity: .7; }
.site-footer__sns { grid-column: 3; grid-row: 2; align-self: end; display: flex; gap: 15px; margin-bottom: 1px; }
.site-footer__sns img { width: 20px; height: 20px; object-fit: contain; }
.site-footer__copy { position: absolute; left: 3px; top: 299.5px; margin: 0; font: 500 14px/1 var(--font-en); letter-spacing: .13em; }
.site-footer__copy small { font-size: inherit; }
/* 中くらいのPC幅：2列目の位置を詰める */
@media (min-width: 1024px) and (max-width: 1279px) { .site-footer__inner { grid-template-columns: minmax(0, 1fr) 300px 230px; } }
@media (max-width: 1023px) {
  .site-footer__inner {
    width: min(311px, 100% - 64px); padding: 30px 0 31px;
    grid-template-columns: 164px 1fr; font-size: 11px; letter-spacing: .02em;
  }
  .site-footer__brand { grid-column: 1 / 3; gap: 18px; }
  .site-footer__brand img:first-child { width: 54px; }
  .site-footer__brand img:last-child { width: 48px; }
  .site-footer__services, .site-footer__legal { margin-top: 26px; gap: 14px; padding-top: 0; }   /* 指で押しやすいよう行の間隔を広げた（Figma 10/22 昼：サービス26px・規約27px送り） */
  .site-footer__legal { gap: 15px; }
  .site-footer li { line-height: 12px; }
  .site-footer li.is-en { top: 0; font-size: 12px; }
  .site-footer__services { grid-column: 1; grid-row: 2; }
  .site-footer__legal { grid-column: 2; grid-row: 2; }   /* 10/30 Figma：SPもPCと同じ順（コーポレートサイト→利用規約→情報セキュリティ→プライバシー）。サービスも SHEshares が最後 */
  .site-footer__sns { grid-column: 1 / 3; grid-row: 3; margin-top: 43px; margin-bottom: 0; }
  .site-footer__copy { position: static; grid-column: 1 / 3; margin-top: 14px; font-size: 10px; letter-spacing: .02em; }
}

/* iPad（768〜1023px）：フッターもSPの組みのまま1.5倍に（ほかのセクションの「SPの絵を最大1.5倍」と同じ倍率・10/22） */
@media (min-width: 768px) and (max-width: 1023px) {
  .site-footer__inner { width: 311px; zoom: 1.5; }
}

/* ---------- 画像から文字に組み直したところ（2026-10-20 本人「全部テキストに」） ----------
   文字の大きさは Figma の px を上限にする（本人 10/20「フォントサイズを守って・伸び縮みしない方が嬉しい」）
   広い画面では大きくならない。Figma の幅（--b＝PC 1440・SP 375）より狭い画面でだけ、画像に収まるよう縮む
   文字の大きさは min(calc(Figmaのpx * var(--cap)), calc(Figmaのpx / var(--b) * 100cqw)) で書く。--cap＝上限（ふだんは Figma の 1px）
   iPad（768〜1023px）だけは上限なし＝SPの絵と同じ倍率（最大1.5倍）で文字も大きくなる（本人 10/22「箱に対して文字が小さい」）
   位置は Figma に対する% */
.next01__inner, .org__stage, .team__wrap, .numbers__top { container-type: inline-size; --b: 1440; --cap: 1px; }
@media (max-width: 1023px) { .next01__inner, .org__stage, .team__wrap, .numbers__top { --b: 375; } }
.br-sp { display: none; }
@media (max-width: 1023px) { .br-sp { display: block; } }

/* 番号つきの見出し（01 事業をアップデートする／Update the Business）Figma：Frame 15083 */
.upd-head { display: flex; align-items: center; gap: min(calc(35 * var(--cap)), calc(35 / var(--b) * 100cqw)); color: var(--color-blue-500); }
.upd-head__num { font: 500 min(calc(60 * var(--cap)), calc(60 / var(--b) * 100cqw))/.7 var(--font-en); letter-spacing: .01em; }   /* 行の高さは Figma の文字の箱（60→42）＝行全体が下にずれない */
.upd-head__text { display: flex; flex-direction: column; justify-content: center; gap: min(calc(11 * var(--cap)), calc(11 / var(--b) * 100cqw));
  height: min(calc(50 * var(--cap)), calc(50 / var(--b) * 100cqw)); padding-left: min(calc(35 * var(--cap)), calc(35 / var(--b) * 100cqw)); border-left: min(calc(2 * var(--cap)), calc(2 / var(--b) * 100cqw)) solid currentColor; }
.upd-head__ja { font: 700 min(calc(24 * var(--cap)), calc(24 / var(--b) * 100cqw))/1 var(--font-sans); letter-spacing: .07em; white-space: nowrap; }
.upd-head__en { font: 500 min(calc(16 * var(--cap)), calc(16 / var(--b) * 100cqw))/1 var(--font-en); letter-spacing: .08em; white-space: nowrap; }
@media (max-width: 1023px) {
  .upd-head { gap: min(calc(15 * var(--cap)), calc(15 / var(--b) * 100cqw)); }
  .upd-head__num { font-size: min(calc(30 * var(--cap)), calc(30 / var(--b) * 100cqw)); }
  .upd-head__text { gap: min(calc(5 * var(--cap)), calc(5 / var(--b) * 100cqw)); height: min(calc(25 * var(--cap)), calc(25 / var(--b) * 100cqw)); padding-left: min(calc(15 * var(--cap)), calc(15 / var(--b) * 100cqw)); border-left-width: max(1px, min(calc(1 * var(--cap)), calc(1 / var(--b) * 100cqw))); }
  .upd-head__ja { font-size: min(calc(12 * var(--cap)), calc(12 / var(--b) * 100cqw)); letter-spacing: .05em; }
  .upd-head__en { font-size: min(calc(10 * var(--cap)), calc(10 / var(--b) * 100cqw)); letter-spacing: .07em; }
}
.org__head, .team__part--head { width: auto; }

/* 04：見出しと青い帯の文字（帯の青い面は画像のまま。文字だけ上に重ねる）
   色地の上の白文字は太って見えるので描き方を整える（太さは Figma と同じ Medium 500・本人 10/20「フォント太い」） */
.band, .next01__sub { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.next01__head, .band, .next01__sub, .next01__notes { position: absolute; margin: 0; }
.band, .next01__sub { z-index: 1; }   /* Figma と同じく円より上に重ねる */
.next01__head { left: 8.333%; top: 3.8358%; }
.band { display: flex; align-items: center; justify-content: center; left: var(--x); top: var(--y); width: var(--w); height: var(--h);
  color: var(--color-white); font: 500 min(calc(34 * var(--cap)), calc(34 / var(--b) * 100cqw))/1 var(--font-sans); letter-spacing: .05em; white-space: nowrap;
  background: var(--color-blue); border-radius: 2px; }   /* 青い面も CSS（10/22 夜に中身の画像を分けたので） */
.next01__band1 { --x: 33.6806%; --y: 27.3878%; --w: 32.7083%; --h: 2.8769%; }    /* Frame 15000：485,714 471×75（10/26「AIで事務職が減る時代へ」） */
.next01__band2 { --x: 15.0347%; --y: 53.9701%; --w: 69.931%; --h: 2.8769%; }    /* Frame 15052：216.5,1407 1007×75（10/27） */
.next01__band2sp { display: none; }
.next01__sub { left: 20.903%; top: 31.7606%; width: 58.194%; translate: 0 -50%;   /* transform はふわっとの動きが使うので translate で中央に */
  text-shadow: 0 0 min(calc(10 * var(--cap)), calc(10 / var(--b) * 100cqw)) rgb(0 61 166 / .5);   /* Figma の光彩（ドロップシャドウ 10・紺50%） */
  text-align: center;
  color: var(--color-white); font: 500 min(calc(24 * var(--cap)), calc(24 / var(--b) * 100cqw))/1.75 var(--font-sans); letter-spacing: .05em; }
/* 出典の注釈：PC は1つの文字ボックス（120,2591・幅1199・12px・行の高さ16.8）。Figma は上下を字の高さで切っているので、その分だけ上げる */
.next01__notes { left: 8.333%; top: 94.3997%; width: 83.264%; padding: 0; list-style: none;
  margin-top: max(calc(-4.4 * var(--cap)), calc(-4.4 / var(--b) * 100cqw));
  color: rgb(7 8 77 / .5); font: 400 min(calc(12 * var(--cap)), calc(12 / var(--b) * 100cqw))/1.4 var(--font-sans); letter-spacing: 0; }   /* Figma は紺の不透明度50% */
.next01__notes-mk { margin-right: 1em; }
@media (max-width: 1023px) {
  .next01__head { left: 8.533%; top: 2.3041%; }
  .band { font-size: min(calc(18 * var(--cap)), calc(18 / var(--b) * 100cqw)); letter-spacing: .02em; }
  .next01__band1 { --x: 19.2%; --y: 12.2581%; --w: 61.8667%; --h: 1.7051%; }    /* 72,266 232×37（10/26「AIで事務職が減る時代へ」） */
  .next01__band2 { display: none; }
  .next01__band2sp { display: flex; --x: 11.733%; --w: 76.533%; --h: 1.7051%; }
  .next01__band2sp--1 { --y: 38.2949%; }   /* 44,831（10/26） */   /* 44,832（Figma 10/23：グラフの枠が伸びた分30下がった） */
  .next01__band2sp--2 { --y: 40.2304%; }   /* 44,873（10/26） */
  .next01__sub { left: 5.333%; top: 15.4378%; width: 89.333%; font-size: min(calc(14 * var(--cap)), calc(14 / var(--b) * 100cqw)); line-height: 1.43; letter-spacing: .02em; }
  /* SP：＊印（20）と本文（45）の2列。1つ目 y2008・2つ目 y2038、10px・行の高さ13 */
  .next01__notes { left: 5.333%; top: 95.3949%; width: 88.8%; margin-top: max(calc(-3.5 * var(--cap)), calc(-3.5 / var(--b) * 100cqw));
    font-size: min(calc(10 * var(--cap)), calc(10 / var(--b) * 100cqw)); line-height: 1.3; text-align: justify; }   /* Figma は両端そろえ */
  .next01__notes li { display: grid; grid-template-columns: min(calc(25 * var(--cap)), calc(25 / var(--b) * 100cqw)) 1fr; }
  .next01__notes li + li { margin-top: min(calc(4 * var(--cap)), calc(4 / var(--b) * 100cqw)); }
  .next01__notes-mk { margin-right: 0; }
}
/* 10/29 本人「iPhone 15以上だと注釈の上下が開いて見える」：SP（〜767px）の注釈の位置と04の枠の下端は js/main.js が説明文の下端から決める */


/* 06・08 のリード文 */
.lead-text { margin: calc((1em - 1lh) / 2) 0 0;   /* Figma は行間の上の余白を切って置いている＝その分だけ上げる */
  color: var(--color-navy); font: 500 min(calc(18 * var(--cap)), calc(18 / var(--b) * 100cqw))/1.89 var(--font-sans); letter-spacing: .05em; white-space: nowrap; }
.org__leadtext { text-align: right; }
@media (max-width: 1023px) {
  .lead-text { font-weight: 400; font-size: min(calc(13 * var(--cap)), calc(13 / var(--b) * 100cqw)); line-height: 1.69; letter-spacing: 0; white-space: normal; }
  .team__leadtext { line-height: 1.69; }
  .org__leadtext { text-align: left; line-height: 1.85; white-space: nowrap; }
}

/* ---------- iPad（768〜1023px）：文字もSPの絵と同じ倍率で大きくする（本人 10/22「ちょっと大きくしてほしい」） ----------
   SP（〜767px）・PC は Figma の px が上限のまま。iPad だけ上限を外す＝箱と文字の比率がSPと同じになる */
@media (min-width: 768px) and (max-width: 1023px) {
  .next01__inner, .org__stage, .team__wrap, .numbers__top { --cap: 1000px; }   /* 上限を外す＝画面の幅に合わせて伸びる */
  .next01__inner { --u: calc(100cqw / var(--b)); }   /* 04のパーツの文字 */
  .team { --t: var(--u); }                            /* 08の文字 */
  .team__btns.org__btns, .team__btns.numbers__btns { --t: var(--u); }       /* 10/30 本人「iPadでボタンの文字の大きさがそろっていない」：06・07のボタンの文字も08と同じく1.5倍（14→21） */
  .project__lead { margin-top: calc(17.5 * var(--u) + (1em - 1lh) / 2); font-size: calc(13 * var(--u)); }   /* 05のリード文 */
}

/* ---------- iPad（768〜1023px）：白い面を画面の左右の端まで（本人 10/22「白背景のところがうまくいってない」） ----------
   中身はSPの絵（最大562幅）のまま中央。白い面だけ画面いっぱいに敷く（PCの08と同じ考え方） */
@media (min-width: 768px) and (max-width: 1023px) {
  /* 06：白い台を画面幅に。上下は台の高さで切り、左右ははみ出したパーツ（筆）を画面の端まで見せる */
  .org__stage { overflow: visible; clip-path: inset(0 -100vw); background: none; isolation: isolate; }
  .org__stage::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: 50%; z-index: -1; width: 100vw; transform: translateX(-50%);
    background: var(--color-white); border-radius: 0 0 calc(15 * 1.5px) calc(15 * 1.5px);   /* 03・05の下の角（15×1.5）とそろえる */
  }
  /* 08：白い面を下の端まで（前は下15×倍率の分だけ左右に水色が出ていた） */
  .team__wrap::before { bottom: 0; }
}

/* ---------- iPad（768〜1023px）：06のタイトル・08の筆を列（562幅）の所でまっすぐ切らない（10/22） ----------
   06「エフィカシー経営」：SPの枠で切らずに書き出した絵（title_sp_wide＝左4・右9はみ出す）。SP（〜767px）は今までの絵のまま
   08の筆：SPの筆の画像（tex_top_sp＝上・tex_btm_sp＝下）を列の外側だけに置く。列の中は今までの絵のまま
   位置は今までの絵（bgtop_sp・bgbtm_sp）と重ねて合わせた SP の px（--u＝SPの1px） */
@media (min-width: 768px) and (max-width: 1023px) {
  .org__title { --x: -1.0667%; --w: 103.4667%; }   /* 388÷375・左へ4 */
  /* 10/28 本人「iPadは筆の横幅が足りない」：SPの筆3枚を Figma のマスク（375幅）で切らずに書き出した版（tex_ipad_*）にして、列の外まで続ける。古い筆（team__ext）は出さない */
  .team__ext { display: none; }
  .team__bg { overflow: visible; clip-path: inset(0 -100vw); }
  /* 10/28 本人「切れ目が見えるのがいや」：筆の画像は上の縁・右上がまっすぐ切れている（SPでは画面の外）。iPadでは見えるので、縁をなじませて消す */
  .team__bg :is(.team__bg-sp, .team__tex) { -webkit-mask: linear-gradient(transparent, #000 9%, #000 91%, transparent); mask: linear-gradient(transparent, #000 9%, #000 91%, transparent); }
  .team__bg .team__bg-sp { -webkit-mask: linear-gradient(transparent, #000 12%, #000 90%, transparent), linear-gradient(to left, transparent 4%, #000 22%); -webkit-mask-composite: source-in; mask: linear-gradient(transparent, #000 12%, #000 90%, transparent), linear-gradient(to left, transparent 4%, #000 22%); mask-composite: intersect; }
  .team__bg { overflow: visible; clip-path: inset(0 -100vw); }   /* iPad：列の外まで筆を見せる（位置はSPと同じ） */
}

.n4-tobe picture, .n4-tobe img { display: block; width: 100%; height: auto; }
/* 10/27 役員レビュー：数字で見るSHEの上の「募集ポジションを見る」ボタン（仮置き。08のボタンと同じ形） */

/* 06の下のボタン2つ。PC：10/27 Figma（294,1156）／SP：10/28 Figma 2491:23576（44,1161・287幅・間10） */
.org__btns { --s: min(1px, calc(100vw / 1440)); --x: 20.417%; --y: 86.852%; --w: 55.139%; margin: 0; }

@media (max-width: 1023px) { .org__btns { --u: calc(100cqw / 375); --t: min(1px, var(--u)); --x: 11.733%; --y: 87.888%; --w: 76.533%; margin: 0; } }
/* 10/28 Figma SP（07 2491:11822）：組織施策・制度の下にボタン2つ。上の土台は 375×2379 として%で置き直した（数字で見るSHE より下が20〜25下がった） */
/* PC（10/28 Figma 2470:10020）：組織施策・制度の下にボタン2つ＝土台（2110）の下51・間15。ボタンの下→「私たちの働く姿」100 */
.numbers__btns { --s: min(1px, calc(100vw / 1440)); margin-top: calc(51 * var(--s)); }
@media (min-width: 1024px) { .numbers__work { margin-top: calc(100 * min(1px, 100vw / 1440)); } }
@media (max-width: 1023px) {
  .numbers__top { aspect-ratio: 375 / 2379; overflow: hidden; }
  .numbers__base { position: absolute; inset: 0; }
  .numbers__base img { height: 100%; object-fit: cover; }
  .numbers__btns { --u: min(calc(100vw / 375), 1.5px); --t: min(1px, var(--u)); display: flex; width: min(100%, 562px); margin: 0 auto; }
}

/* SPの絵のときのFVのボタン2つ（10/28 夜 Figma SP 2526:54755）：x20 y552・164×46・間8。募集要項＝紺80%＋ぼかし／お問い合わせ＝白70%＋ぼかし・影
   iPad縦はFVの上下を切っている（object-position 60%）ので、その切った分だけ上にずらす */
.fv__spbtns { display: none; }
@media (max-width: 767px), (max-width: 1023px) and (orientation: portrait) {
  .fv__spbtns { --fsp: calc(100cqw / 375); display: flex; gap: calc(8 * var(--fsp)); position: absolute; z-index: 2; left: calc(20 * var(--fsp));
    top: min(calc(552 * var(--fsp) - (621 * var(--fsp) - min(621 * var(--fsp), 100svh)) * .6), calc(min(621 * var(--fsp), 100svh) - 69 * var(--fsp)));   /* 下を切ったときも画面内に（下から23残す） */ width: calc(336 * var(--fsp)); }
  .fv__spbtns .sticky-cta__btn { flex: 1 1 0; height: calc(46 * var(--fsp)); border: 0; border-radius: 2px; font-size: calc(14 * var(--fsp)); }
  .fv__spbtns .sticky-cta__btn--primary { background: rgb(0 61 166 / .8); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); letter-spacing: .09em; }
  .fv__spbtns .sticky-cta__btn--secondary { background: rgb(255 255 255 / .6); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 0 5px rgb(0 61 166 / .14); letter-spacing: .02em; }
}
/* 10/29 本人「iPad縦でコピーとボタンがかぶる」：iPad縦はボタンが画面幅に合わせて大きくなりすぎていた（高さ100px）。大きさをSPの1.45倍までにして、FVの下から24に置く */
@media (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
  .fv__spbtns { --fsp: 1.45px; top: auto; bottom: 40px; left: calc(20 * 100cqw / 375); }   /* 11/2 A案：FVの下から40・左はコピーの左端（x20）。コピーの下端はボタンの上30 */
  .fv__spbtns .sticky-cta__btn { padding: 0 0 .1em; }   /* 字の真ん中を箱の真ん中に（Noto Sans JP は字が少し下に寄る） */
  .fv__spbtns .sticky-cta__btn--primary { padding-left: .09em; }   /* 字間の分だけ右に＝左右の真ん中に */
  .fv__spbtns .sticky-cta__btn--secondary { padding-left: .02em; }   /* 10/29 本人：左端を「New MISSION」の左端（SPの絵の x20 を92%に縮めた位置）にそろえる */
}

/* 10/28 夜 本人：すりガラスを2つのグループにそろえる（比較 tools/glass_groups_1028.html）
   A＝ボタン：青80%＋ぼかし10／白60%＋ぼかし12（A2）　B＝文字の下の白い面：白80%（B1） */

/* ---------- 10/30 本人「PCの狭い幅（1024〜1439）で文字が小さすぎる」：本文・説明・注釈は 12px より小さくしない ----------
   PC は 1440 の組みを画面の幅に合わせて縮めるので、1024 では説明文が 10px・事業名が 8.5px になっていた。
   見出し・飾り・画像の中の文字は今のまま。肩書き・名前は説明より小さくならないよう 13px を下限に。
   04 のグラフの出典（.n4-chart__src）はグラフの枠の中で1行に収める作りなので対象外 */
@media (min-width: 1024px) {
  .upd-head__en { font-size: max(12px, min(calc(16 * var(--cap)), calc(16 / var(--b) * 100cqw))); }
  .next01__notes { font-size: max(12px, min(calc(12 * var(--cap)), calc(12 / var(--b) * 100cqw))); }
  .n-sys__desc { font-size: max(12px, min(calc(14 * var(--cap)), calc(14 / var(--b) * 100cqw))); }
}
@media (min-width: 1024px) and (max-width: 1099px) {
  .n-sys__desc { letter-spacing: 0; }   /* 12px で止めると1行（手で改行した長さ）が列の幅を越えて隣の説明とくっつく＝字間だけ詰める */
  .n-sys__title small { font-size: max(12px, .7em); }
  /* 募集ポジション：文字だけ大きくすると説明が4行になり事業名も折り返す＝カードごと（幅・余白・列）説明文が12pxになる倍率（12/14）までしか縮めない */
  .team-pos { --s: max(min(1px, 100vw / 1440), 12px / 14); }
  .team-pos__unit { font-size: max(12px, calc(12 * var(--s))); }
  .team-pos__sub { font-size: max(12px, calc(13 * var(--s))); }
  .team-msg__body { width: max(calc(800 * var(--s)), 45em); font-size: max(14px, calc(16 * var(--s))); }   /* 14pxで止めた分、箱も広げて手で改行した1行が折り返さないように（いちばん長い行＝約43字） */   /* 10/30 本人「12pxだとぎりぎり読めない」：代表メッセージは14・注釈は13 */
  .team-deck__note { font-size: max(13px, calc(14 * var(--s))); }
}