/* ==========================================================================
   内池建設 新卒採用LP — hero 見本実装 (theme-v2)
   方針:
   - セクションは通常のドキュメントフロー。内部は grid / flex / gap で構成
   - position:absolute は「重なり装飾」だけに限定（各所にコメントで理由を明記）
   - 文字は全て実テキスト。固定高さに頼らず、文言が増えても崩れない
   - XD正本: PC_1366 アートボード上部768px / 配色・書体は fonts_colors 準拠
   - 見出し書体 A-SK大蘭明朝Min2 は WebFont 提供が無いため、指定書（fonts_colors
     アートボード「SVGで実装」）どおり XD由来のアウトラインSVGをインライン配置。
     実テキストは .sr-only で保持する
   ========================================================================== */

:root {
  --color-bg: #e5e9e9;
  --color-green: #005a3c;
  --color-green-soft: #5a927f;
  --color-yellow: #ffc02e;
  --color-ink: #212121;
  --color-badge: #181818;
  --font-sans: "YakuHanJP", "Noto Sans JP", sans-serif;
  --font-serif: "Noto Serif JP", serif; /* sr-onlyテキスト等のフォールバック用（見出し表示はアウトラインSVG） */
}

* { box-sizing: border-box; }

/* スクリーンリーダー専用テキスト（SVG見出しの実テキスト保持用） */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}

/* rem+calc等比スケール:
   〜767px  SP基準375px=16px  (100vw/23.4375)
   768px〜  PC基準1366px=16px (100vw/85.375)
   各基準幅で設計値と厳密一致し、間はビューポート比例 */
html { font-size: calc(100vw / 23.4375); }
@media (min-width: 768px) {
  html { font-size: calc(100vw / 85.375); }
}


body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-ink);
  font-family: var(--font-sans);
}

img { display: block; max-width: 100%; height: auto; }

/* --------------------------------------------------------------------------
   hero 全体
   -------------------------------------------------------------------------- */
.hero {
  position: relative; /* 装飾レイヤー(.hero__backdrop)の基準。本文配置には使わない */
  overflow: hidden;
  background: var(--color-bg);
}

/* --------------------------------------------------------------------------
   装飾レイヤー（斜め帯・三角・人物写真）
   ページ全面に敷く「背景美術」であり本文フローの外にあるため、
   このレイヤー内に限り absolute を使う
   -------------------------------------------------------------------------- */
.hero__backdrop {
  position: absolute; /* 理由: 本文の背後に敷く全面装飾レイヤー */
  inset: 0 auto 0 50%;
  width: 85.375rem;
  margin-left: -42.6875rem; /* 1366px(85.375rem)の背景キャンバスを中央固定 */
  pointer-events: none;
  isolation: isolate; /* 内部のz-indexを閉じ込め、本文レイヤーより手前に出さない */
}

/* 斜めグラデ帯（XD: 長方形20217 と 合体1）。三角と同じレイヤー内の一要素として
   置き、XDの描画順（三角a〜c → 帯 → 三角d〜f → 人物写真 → 三角g）を DOM 順で再現。
   高さはSVG実寸(1366x1173)。装飾アセットの実寸なので固定値でよい */
.hero__bars {
  position: absolute; /* 理由: 背景美術の一枚。backdrop内で完結 */
  left: 0;
  top: 0;
  width: 85.375rem;
  height: 73.3125rem;
  background: url("../assets/hero-background-bars.svg") 0 0 / 100% 100% no-repeat;
}

/* blur三角のあしらい = XDパッケージ実資産(blur_01a/01b/02/03.png)を
   AGC実測の shape実寸(w/h) + 回転matrix + 平行移動(tx/ty) でそのまま配置。
   transform-origin:0 0 なので left/top はXDの transform tx/ty と一対一。
   XDのぼかしはPNGに焼き込み済みのため CSS filter は持たない。
   クラス a〜g は XDアートボード直下の描画順。--g だけが XD で
   マスクグループ13(人物写真)より後に描かれるため DOM 上も写真の後ろに置く */
.hero__tri {
  position: absolute; /* 理由: 重なり装飾（XD blur_01〜03のぼかし三角PNG）。backdrop内で完結 */
  display: block;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  transform-origin: 0 0;
}
.hero__tri--a { left: 10.9855rem; top: 15.848rem;  width: 17.9431rem; height: 38.3604rem; transform: matrix(.707107, .707107, -.707107, .707107, 0, 0);   background-image: url("../assets/tri-blur-04.png"); opacity: .6; } /* XD[14] blur_01 bbox -258.23,253.57 637x637 */
.hero__tri--b { left: 67.8863rem; top: 19.6576rem; width: 15.6861rem; height: 33.5472rem; transform: matrix(-.121869, -.992546, .992546, -.121869, 0, 0); background-image: url("../assets/tri-blur-02.png"); } /* XD[15] blur_02 bbox 1055.59,0 563.34x314.52 */
.hero__tri--c { left: 5.4621rem;  top: 17.6717rem; width: 2.6165rem;  height: 5.5992rem;  transform: matrix(.587785, .809017, -.809017, .587785, 0, 0);   background-image: url("../assets/tri-blur-03.png"); } /* XD[16] blur_03 bbox 14.92,282.75 97.08x86.53 */
.hero__tri--d { left: 21.9631rem; top: 15.6282rem; width: 3.9361rem;  height: 8.4222rem;  transform: matrix(-.848048, .529919, -.529919, -.848048, 0, 0); background-image: url("../assets/tri-blur-02.png"); } /* XD[19] blur_02 bbox 226.59,135.77 124.82x147.65 */
.hero__tri--e { left: 64.9023rem; top: 16.7158rem; width: 2.6268rem;  height: 5.6196rem;  transform: matrix(-.981627, -.190809, .190809, -.981627, 0, 0); background-image: url("../assets/tri-blur-03.png"); } /* XD[20] blur_03 bbox 997.18,171.17 58.41x96.28 */
.hero__tri--f { left: 20.4076rem; top: 22.1803rem; width: 4.2227rem;  height: 9.0338rem;  transform: matrix(.5, -.866025, .866025, .5, 0, 0);             background-image: url("../assets/tri-blur-01.png"); } /* XD[21] blur_01 bbox 326.52,296.37 158.96x130.78 */
.hero__tri--g { left: 66.5306rem; top: 29.8089rem; width: 9.2505rem;  height: 19.7899rem; transform: matrix(.5, -.866025, .866025, .5, 0, 0);             background-image: url("../assets/tri-blur-01.png"); } /* XD[23] blur_01 bbox 1064.49,348.76 348.22x286.5（人物写真より前面） */

.hero__people {
  position: absolute; /* 理由: 背景美術（人物写真の見切りステージ）。backdrop内で完結 */
  left: 17.5625rem;
  top: 2.8125rem;
  width: 50.25rem;
  height: 45.25rem;
  overflow: hidden;
}
.hero__person {
  position: absolute; /* 理由: ステージ内で2枚の写真を重ねる装飾配置 */
  max-width: none;
}
.hero__person--woman { left: 11.4375rem;  top: 0;    width: 46.6875rem; height: 58.3125rem; }
.hero__person--man   { left: -11.625rem; top: 2.4375rem; width: 52.5625rem; height: 65.6875rem; z-index: 2; }

/* --------------------------------------------------------------------------
   本文レイヤー — grid で重なりを表現（absolute不使用）
   行構成: [1]ヘッダー / [2]本文（縦書きコピー・バッジ・見出し・円ボタンが
   グリッドセル重なりで共存）
   -------------------------------------------------------------------------- */
.hero__inner {
  position: relative; /* backdropより手前に置くための重ね基準 */
  z-index: 1;
  display: grid;
  grid-template-columns: 3.4375rem minmax(0, 1fr) auto 3.125rem;
  grid-template-rows: auto 1fr;
  max-width: 85.375rem;
  min-height: 48rem;
  margin: 0 auto;
}

/* ---- ヘッダー（通常フロー・flex） ---- */
.hero__header {
  grid-column: 1 / -1;
  grid-row: 1;
  display: flex;
  align-items: center;
  gap: 0.9375rem;
  margin: 1.25rem 1.5625rem 0;
  padding: 0.875rem 1.9375rem 0.875rem 1.8125rem;
  border: 0.0625rem solid #fff;
  border-radius: 0.625rem;
  /* XD: 塗り透明 + 背景ぼかし */
  backdrop-filter: blur(1.25rem) brightness(105%);
  -webkit-backdrop-filter: blur(1.25rem) brightness(105%);
}
.hero__logo { flex: none; }
.hero__logo img { width: 11.5rem; height: 2.125rem; }
.hero__edition {
  flex: none;
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.0625rem;
  letter-spacing: 0.0375rem;
}
.hero__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 2.125rem;
  margin-left: auto;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0437rem;
}
.hero__nav a { color: inherit; text-decoration: none; white-space: nowrap; }
.hero__entry {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 12.5rem;
  min-height: 2.5rem;
  padding: 0.5rem 1.25rem;
  border-radius: 1.5625rem;
  background: var(--color-green);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.0437rem;
  text-decoration: none;
  white-space: nowrap;
}

/* ---- 縦書きサイドコピー（左上・通常フロー） ---- */
.hero__side-copy {
  grid-column: 2;
  grid-row: 2;
  justify-self: start;
  align-self: start;
  margin: 2.6875rem 0 0 2.5625rem;
  writing-mode: vertical-rl;
  font-size: 1.0625rem;
  font-weight: 500;
  letter-spacing: .13em;
  line-height: 2.7;
}
.hero__side-copy span { display: block; inline-size: max-content; }

/* ---- 採用データバッジ（右・flex縦積み） ---- */
.hero__stats {
  grid-column: 3;
  grid-row: 2;
  z-index: 2; /* 見出しの尾と重なった場合はバッジを手前に */
  justify-self: end;
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1.6875rem;
  margin: 0 0 5.625rem; /* 光学中央: バッジ列はキャンバス上寄りに座る */
  padding: 0;
  list-style: none;
}
.hero__stat {
  position: relative; /* ::before チェックマーク装飾の基準 */
  margin: 0;
  padding: 0.125rem 1.75rem 0.125rem 2rem;
  background: var(--color-badge);
  clip-path: polygon(0.5rem 0, 100% 0, calc(100% - 0.5rem) 100%, 0 100%);
  transform: rotate(-7deg);
  color: #fff;
  font-size: 0.875rem;
  font-style: italic;
  font-weight: 700;
  line-height: 1.625rem;
  letter-spacing: .07em;
  white-space: nowrap;
}
.hero__stat--short { margin-right: 2.875rem; transform: rotate(-9deg); }
.hero__stat::before {
  content: "";
  position: absolute; /* 理由: バッジ左肩に重ねる黄色チェック装飾 */
  left: 0.75rem;
  top: -0.3125rem;
  width: 0.875rem;
  height: 0.4375rem;
  border-left: 0.1875rem solid var(--color-yellow);
  border-bottom: 0.1875rem solid var(--color-yellow);
  transform: rotate(-45deg);
}

/* ---- メイン見出し（大蘭明朝アウトラインSVG・grid重なりで写真の手前に）。
   回転・字組はXDのアウトラインパスに焼き込み済みのため、CSS側は配置と色のみ ---- */
.hero__headline {
  grid-column: 1 / -1;
  grid-row: 2;
  align-self: end;
  margin: 0 0 3.9222rem 3.125rem; /* XD: 見出しink左端 x=50 / 下端 y=705.25 (768−62.75) */
  color: #fff; /* SVGは fill=currentColor */
}
.hero__headline-svg {
  display: block;
  height: auto;
  filter: drop-shadow(0 0.1875rem 0.375rem rgb(0 0 0 / 16%)); /* XD: dy3 / blur6 / #000 16% */
}
.hero__headline-svg--pc { width: 69.7689rem; } /* XD: ink幅 1116.30px */
.hero__headline-svg--sp { display: none; }

/* ---- イベント誘導 円ラベル（grid重なりで右下に） ---- */
.hero__event {
  grid-column: 3 / 5;
  grid-row: 2;
  z-index: 3;
  align-self: end;
  justify-self: end;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  width: 11.875rem;
  height: 11.875rem; /* 真円ラベル。文言増はSP形状(ピル)で吸収する */
  margin: 0 3.125rem 2.1875rem 0;
  border: 0.125rem solid #fff;
  border-radius: 50%;
  background: var(--color-yellow);
  color: var(--color-ink);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.875rem;
  letter-spacing: 0.125rem;
  text-align: center;
  text-decoration: none;
}
.hero__event::after {
  content: "";
  width: 0.875rem;
  height: 0.875rem;
  border-right: 0.1875rem solid var(--color-ink);
  border-bottom: 0.1875rem solid var(--color-ink);
  transform: rotate(45deg) translate(-0.1875rem, -0.1875rem); /* 下向きシェブロン */
}

/* --------------------------------------------------------------------------
   SP (〜767px) — XD正本 SP_375 アートボード(SOURCE-01-hero)準拠。
   PCと同じ構図（縦書きコピー左上・見出しが写真に重なる・バッジ左下・
   イベント円右下）を375基準の値で再構成。rootのrem+calcで等比スケール
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  .hero__backdrop {
    /* SPも全面装飾。背景Xを375キャンバスに合わせて敷く。
       帯はPC版SVGの縮小ではなくSP正本（グループ86006 = 帯幅45.63px）を使う。
       SVGは375x576の等倍キャンバスなので 0 0 に等倍で置く */
    inset: 0 auto 0 50%;
    width: 23.4375rem;
    margin-left: -11.7188rem;
    overflow: hidden;
  }
  /* 帯はPC版SVGの縮小ではなくSP正本（グループ86006 = 帯幅45.632px）。
     SVGは375x576の等倍キャンバス */
  .hero__bars {
    width: 23.4375rem;
    height: 36rem;
    background-image: url("../assets/hero-background-bars-sp.svg");
  }
  /* SP正本(アートボード13a5744e)の blur三角。PCと同じ資産・同じ回転matrixで、
     位置と実寸だけSP_375の実測値。a〜g はPCと同じ資産に対応する */
  .hero__tri--a { left: 2.8949rem;  top: 28.3154rem; width: 5.8181rem; height: 12.4229rem; } /* XD SP[5]  bbox -94.23,453.05 206.37x206.37 */
  .hero__tri--b { left: 17.933rem;  top: 8.6468rem;  width: 4.3111rem; height: 9.1722rem;  } /* XD SP[6]  bbox 278.52,52 154.07x86.35 */
  .hero__tri--c { left: 0.6318rem;  top: 8.7861rem;  width: 1.1054rem; height: 2.3649rem;  } /* XD SP[12] bbox -20.5,140.58 41.01x36.55 */
  .hero__tri--d { left: 8.885rem;   top: 7.9228rem;  width: 1.6629rem; height: 3.5575rem;  } /* XD SP[13] bbox 89.43,78.49 52.73x62.37 */
  .hero__tri--e { left: 22.6508rem; top: 13.2752rem; width: 1.1098rem; height: 2.3741rem;  } /* XD SP[15] bbox 344.98,171.73 24.68x40.68 */
  .hero__tri--f { left: 8.2279rem;  top: 16.6463rem; width: 1.784rem;  height: 3.8165rem;  } /* XD SP[14] bbox 131.65,241.62 67.16x55.25 */
  .hero__tri--g { left: 17.6512rem; top: 28.1107rem; width: 3.9081rem; height: 8.3607rem;  } /* XD SP[17] bbox 282.42,395.62 147.11x121.04（人物写真より前面） */
  /* 人物写真は「PC版の縮小」ではなくSP正本(マスクグループ13)の実測値。
     ステージ実寸 375x667 = SP hero帯。SPでは写真下端(642.6)が帯内に収まるため
     クリップは発生しない */
  .hero__people {
    left: 0;
    top: 0;
    width: 23.4375rem;
    height: 41.6875rem;
    margin-left: 0;
    transform: none;
  }
  .hero__person--woman { left: 5.8376rem;  top: 9.9283rem;  width: 20.6493rem; height: 25.8024rem; } /* XD SP bbox 93.40,158.85 330.389x412.839 */
  .hero__person--man   { left: -4.4546rem; top: 10.9639rem; width: 23.368rem;  height: 29.1996rem; } /* XD SP bbox -71.27,175.42 373.888x467.193 */

  .hero__inner {
    grid-template-columns: 0.75rem minmax(0, 1fr) 0.75rem;
    grid-template-rows: auto 1fr;
    min-height: 41.6875rem; /* XD SP_375: 667px */
  }

  /* ヘッダー: ロゴ+期別+エントリーのみ（SP正本にナビは無い） */
  .hero__header {
    grid-column: 1 / -1;
    grid-row: 1;
    gap: 0.5rem;
    margin: 0.75rem;
    padding: 0.625rem 0.625rem 0.625rem 0.75rem;
  }
  .hero__nav { display: none; }
  .hero__logo img { width: 7.75rem; height: 1.4375rem; }
  .hero__edition { display: none; } /* SP正本のヘッダーは ロゴ+エントリー のみ */
  .hero__entry { min-width: 0; min-height: 2.125rem; margin-left: auto; padding: 0.375rem 1rem; border-radius: 1.0625rem; font-size: 0.75rem; letter-spacing: 0.0312rem; }

  /* 縦書きコピー: PC同様に左上（writing-mode はPC規則を継承） */
  .hero__side-copy {
    grid-column: 2;
    grid-row: 2;
    justify-self: start;
    align-self: start;
    margin: 0.5rem 0 0 0.25rem;
    font-size: 0.8125rem;
    line-height: 2.2;
  }

  /* 見出し: 写真に重ねる（SP用アウトラインSVGへ差し替え。回転はパスに焼き込み済み） */
  .hero__headline {
    grid-column: 1 / -1;
    grid-row: 2;
    align-self: end;
    margin: 0 0 11.9441rem 0.6965rem; /* XD SP: ink左端 x=11.14 / 下端 y=475.89 (667−191.11) */
  }
  .hero__headline-svg--pc { display: none; }
  .hero__headline-svg--sp { display: block; width: 22.0445rem; } /* XD SP: ink幅 352.71px */

  /* バッジ: 左下に斜め積み */
  .hero__stats {
    grid-column: 2;
    grid-row: 2;
    justify-self: start;
    align-self: end;
    align-items: flex-start;
    gap: 0.9375rem;
    margin: 0 0 1.375rem 0.125rem;
  }
  .hero__stat { font-size: 0.75rem; line-height: 1.375rem; padding: 0.125rem 1rem 0.125rem 1.5rem; transform: rotate(-7deg); }
  .hero__stat--short { margin-right: 0; margin-left: 0.375rem; transform: rotate(-8deg); }
  .hero__stat::before { left: 0.5rem; top: -0.25rem; width: 0.75rem; height: 0.375rem; border-left-width: 0.1875rem; border-bottom-width: 0.1875rem; }

  /* イベント誘導: 右下の円（PCと同形状の縮小） */
  .hero__event {
    grid-column: 2 / 4;
    grid-row: 2;
    justify-self: end;
    align-self: end;
    gap: 0.375rem;
    width: 7.5rem;
    height: 7.5rem;
    margin: 0 0.25rem 1.125rem 0;
    border-width: 0.125rem;
    font-size: 0.8125rem;
    line-height: 1.25rem;
    letter-spacing: 0.05em;
  }
  .hero__event::after { width: 0.5625rem; height: 0.5625rem; transform: rotate(45deg) translate(-0.125rem, -0.125rem); }
}

/* ==========================================================================
   WORK STYLE（仕事を知る） — XD正本: PC_1366 y=766..1886 / SP_375 y=667..2056
   hero と同じ方針: 本文はフロー+grid/flex+gap、absoluteは重なり装飾のみ。
   見出しはXDのアウトラインSVG（大蘭明朝＋筑紫ゴシック）をインライン配置。
   カード見出し等の実テキストは Noto Sans JP、欧文ラベルの DIN 2014→Roboto 代替
   ========================================================================== */

.ws {
  position: relative; /* 装飾レイヤー(.ws__backdrop)の基準。本文配置には使わない */
  overflow: hidden;
}

.ws__backdrop {
  position: absolute; /* 理由: heroから続く背景美術（斜め帯SVG）の継続描画レイヤー */
  inset: 0 auto 0 50%;
  width: 85.375rem;
  margin-left: -42.6875rem;
  /* hero と同じ 1366x1173 のXD帯SVGを、hero高さ768px(48rem)ぶん上へずらして継続 */
  background: url("../assets/hero-background-bars.svg") center -47.875rem / 85.375rem 73.3125rem no-repeat;
  pointer-events: none;
}

/* ガラス板パネル（XD: 塗り rgb(0 90 60 / 0%) + 背景ぼかし・白枠・角丸20px）。
   正本ではこの板が次セクションまで続くため、下辺は閉じずに次セクションへ渡す */
.ws__panel {
  position: relative;
  z-index: 1;
  max-width: 79.125rem; /* XD: 1266px */
  margin: 0 auto;
  padding: 0 4.375rem; /* XD: 本文左端 x=120 − パネル左端 x=50 */
  border: 0.0625rem solid #fff;
  border-bottom: 0;
  border-radius: 1.25rem 1.25rem 0 0;
  background: rgb(0 90 60 / 0%);
  backdrop-filter: blur(1.875rem) brightness(110%);
  -webkit-backdrop-filter: blur(1.875rem) brightness(110%);
}

/* ---- 導入部（見出し・装飾・リード文） ---- */
.ws__intro {
  position: relative; /* 見出しに重ねる黄色装飾(点・波線)の基準 */
  padding-top: 7.625rem; /* XD: 見出しink上端 y=123（+枠線1px） */
}
/* 見出しは大蘭明朝＋筑紫ゴシックを1グラフィックとして扱うアウトラインSVG。
   字組・字間はXDのパスに焼き込み済みのため、CSS側は配置と色のみ */
.ws__heading {
  margin: 0;
  color: #212121; /* SVGは fill=currentColor */
}
.ws__heading-svg { display: block; height: auto; }
.ws__heading-svg--pc { width: 53.165rem; } /* XD: ink幅 850.64px */
.ws__heading-svg--sp { display: none; }
.ws__accent-dots {
  position: absolute; /* 理由: 「建設業」上に重ねる黄点装飾 */
  left: 13.8125rem; /* XD: x341 − 本文左端120 */
  top: 6.25rem;     /* XD: y=100 */
  width: 10.75rem;  /* XD: 172px */
  height: auto;
  pointer-events: none;
}
.ws__accent-wave {
  position: absolute; /* 理由: 「残業を7割減」下に重ねる波線装飾 */
  left: -0.125rem;   /* XD: x118.27 − 120 */
  top: 17.5rem;      /* XD: y=280.17 */
  width: 29.4375rem; /* XD: 471px */
  height: auto;
  pointer-events: none;
}
.ws__lead {
  margin: 3.1075rem 0 0; /* XD: リード上端 y=350（見出しink下端 300.28 + 49.72px） */
  color: #1c1c1c;
  font-size: 1rem;
  letter-spacing: 0.1rem; /* XD: ls100 = 0.1em */
  line-height: 2.5rem;    /* XD: lh40 */
}

/* ---- カード3枚（grid+gap。固定高なし・文言が増えても伸びる） ---- */
.ws__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2.6125rem; /* XD: 枠border-box間 41.8px */
  margin: 2.875rem 0.2813rem 0; /* 上=カード枠上端y476−リード下端 / 左右=角飾りぶん4.5px内へ */
  padding: 0;
  list-style: none;
}
.ws-card {
  position: relative; /* 四隅の黒角飾り(.ws-card__corners)の基準 */
  margin: 0;
  padding: 1.3438rem 1.2813rem 1.75rem; /* XD: ラベル上21.5 / 左右20.5 / 下28 */
  border: 0.0625rem solid #212121;
  background: #fff;
}
.ws-card__corners {
  position: absolute; /* 理由: 枠の四隅に重ねる10px黒角装飾（XD: 長方形8359〜8362） */
  inset: -0.2813rem;
  background-image:
    linear-gradient(#212121, #212121), linear-gradient(#212121, #212121),
    linear-gradient(#212121, #212121), linear-gradient(#212121, #212121);
  background-size: 0.625rem 0.625rem;
  background-position: 0 0, 100% 0, 0 100%, 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
}
.ws-card__label {
  margin: 0;
  color: rgb(33 33 33 / 40%);
  font-family: "din-2014", "DIN 2014", "Roboto", sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.2625rem; /* XD: ls300 = 0.3em */
  line-height: 1;
}
.ws-card__photo {
  display: block;
  width: 13.75rem;  /* XD: 円形写真 220px。文字ではなく画像のため固定寸法 */
  height: 13.75rem;
  margin: 1.1875rem auto 0; /* XD: 円上端 y=59（カード内） */
  border: 0.0625rem solid #212121;
  border-radius: 50%;
  overflow: hidden;
}
.ws-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* XD: 360x240素材のcover配置 */
}
.ws-card__title {
  margin: 1.125rem 0 0; /* XD: 見出し上端 y=297（カード内） */
  color: var(--color-green);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.15rem; /* XD: ls100 = 2.4px */
  line-height: 2.5rem;     /* XD: lh40 */
}
.ws-card__body {
  margin: 1.1875rem 0 0; /* XD: 本文上端 y=396（カード内） */
  color: #1c1c1c;
  font-size: 1rem;
  letter-spacing: 0.1rem;
  line-height: 1.875rem; /* XD: lh30 */
  line-break: strict; /* XDの禁則（小書きかな・長音を行頭に置かない）と折返しを揃える */
}

/* ---- セクション下端の点線（XD: 線529 y=1886 = セクション境界） ---- */
.ws__boundary {
  width: 100%;
  margin: 6.4375rem 0 0; /* XD: カード枠下端1016 → 点線1120 */
  border: 0;
  border-top: 0.0625rem dashed #212121;
}

/* PC/SP改行出し分け（DOMは単一のまま、brの表示だけ切り替える） */
.ws-br-sp { display: none; }

/* --------------------------------------------------------------------------
   WORK STYLE SP (〜767px) — XD正本 SP_375 y=667..2056。
   同一DOMのままメディアクエリで再構成。rootのrem+calcで等比スケール
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  .ws-br-sp { display: inline; }
  .ws-br-pc { display: none; }

  .ws__backdrop {
    width: 23.4375rem;
    margin-left: -11.7188rem;
    /* SP正本の斜め帯は artboard y=-39.49..575.20 で終わり、hero(〜667)内に収まる。
       WORK STYLE 帯には帯が無いので継続描画しない（AGC: SPのgradientノードは
       グループ86006の2本のみ） */
    background: none;
  }

  /* SPのパネルは全幅（XD: rect x=0 w=375） */
  .ws__panel {
    max-width: none;
    padding: 0 0.9375rem; /* XD: 本文左端 x=15 */
  }

  .ws__intro { padding-top: 2.875rem; } /* XD SP: 見出しink上端 y=47（+枠線1px） */
  .ws__heading-svg--pc { display: none; }
  .ws__heading-svg--sp { display: block; width: 21.5625rem; } /* XD SP: ink幅 345.00px */
  .ws__accent-dots { left: 5.4375rem; top: 2rem; width: 4.4375rem; } /* XD SP: x102 y32 幅71 */
  .ws__accent-dots circle { r: 7.27px; } /* 表示縮尺0.413で実寸r=3pxに戻す */
  .ws__accent-wave { left: -0.0625rem; top: 7.375rem; width: 12.1875rem; } /* XD SP: 波線幅195px */
  .ws__accent-wave path { stroke-width: 4.84; } /* 表示縮尺0.414で実寸stroke=2pxに戻す */
  .ws__lead {
    /* リード位置は従来検証済みの relY=131 を維持（見出しink下端 118.9 + 12.1px） */
    margin-top: 0.7563rem;
    font-size: 0.875rem;
    letter-spacing: 0.0875rem; /* XD: ls100 = 0.1em (14px基準) */
    line-height: 2.1875rem; /* XD SP: lh35 */
  }

  .ws__cards {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.75rem; /* XD SP: 枠border-box間28px */
    margin: 3.125rem 0.2813rem 0; /* XD SP: カード群上端 y=357 */
  }
  .ws-card { padding: 1.0625rem 0.9688rem 2.5625rem; } /* XD SP: ラベル上17 / 左右15.5 / 下41 */
  .ws-card__label { font-size: 0.75rem; letter-spacing: 0.225rem; }

  /* SPは 円形写真(左) + 緑見出し(右) の横並び（XD SP: 円x35 / 見出しx160） */
  .ws-card__media {
    display: flex;
    align-items: flex-start;
    gap: 0.9375rem;
    margin-top: 0.625rem; /* XD SP: 円上端 y=44（カード内） */
  }
  .ws-card__photo {
    flex: none;
    width: 6.875rem; /* XD SP: 円110px */
    height: 6.875rem;
    margin: 0;
  }
  .ws-card__title {
    margin: 1.375rem 0 0; /* XD SP: 見出しベースライン y=91（カード内） */
    font-size: 1rem;
    letter-spacing: 0.1rem;
    line-height: 1.875rem; /* XD SP: lh30 */
  }
  .ws-card__body {
    margin: -0.3125rem 0 0; /* XD SP: 本文行箱上端144は円下端149の半leading内に食い込む */
    font-size: 0.875rem;
    letter-spacing: 0.0875rem; /* XD: ls100 = 0.1em (14px基準) */
    line-height: 1.875rem;
  }

  .ws__boundary { margin-top: 3.375rem; } /* XD SP: カード枠下端1334.5 → 点線1389 */
}

/* ==========================================================================
   YOUTH GROWTH（若いうちから挑戦できる。） — XD正本: PC_1366 y=1886..2532(高さ646)
   / SP_375 セクション375x520。work-styleのガラス板がここで閉じる（下角丸）。
   本文はフロー+grid/flex+gapのみ。このセクションに position:absolute は無い
   ========================================================================== */

.yg { padding-bottom: 7.5rem; } /* XD: パネル下端526 → セクション境界646 の背景地 */

/* ガラス板の続き（XD: パネル下端 doc y=2412 → セクション内526 / 下角丸20px）。
   ws__panel と同じ幅・左右余白で辺が途切れず連続する */
.yg__panel {
  max-width: 79.125rem; /* XD: 1266px（ws__panelと同値） */
  margin: 0 auto;
  padding: 3.0313rem 4.375rem 6.25rem; /* 上=見出し行箱上端48.5 / 下=帯下端426→パネル下端526 */
  border: 0.0625rem solid #fff;
  border-top: 0; /* 上辺は ws__panel から連続 */
  border-radius: 0 0 1.25rem 1.25rem;
  background: rgb(0 90 60 / 0%);
  backdrop-filter: blur(1.875rem) brightness(110%);
  -webkit-backdrop-filter: blur(1.875rem) brightness(110%);
}

/* 見出し（XD: Noto Sans JP Bold 40px / ls100 / lh60 / #212121 / 行baseline 96・156） */
.yg__heading {
  margin: 0;
  color: #212121;
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: 0.25rem; /* XD: ls100 = 4px */
  line-height: 3.75rem;    /* XD: lh60 */
}

/* ---- 成長支援の帯（XD: #e1e5e4 x=120 y=203 w=1126 h=223）。
   高さは固定せず padding+行gap の合算がXD実測223pxに一致する構成 ---- */
.yg__list {
  display: grid;
  grid-template-columns: 23.25rem 23.25rem auto; /* XD: 列起点 178/550/922（帯左から58+372k） */
  grid-template-rows: repeat(2, auto);
  grid-auto-flow: column; /* DOM順（列優先）をXDの左中右×上下に展開 */
  row-gap: 1.625rem;      /* XD: 行1角箱下端288 → 行2上端314 */
  margin: 2.1563rem 0 0;  /* XD: 見出し行箱下端168.5 → 帯上端203 */
  padding: 3.125rem 0 3.0938rem 3.625rem; /* XD: 帯上端203→角箱253 / 左120→178 / 下端計423+α=426 */
  background: #e1e5e4;
  list-style: none;
}
.yg-item {
  display: flex;
  align-items: flex-start; /* XD: チェック角箱に1行目だけを揃え、2行目は下へぶら下げる */
  gap: 0.9375rem; /* XD: 角箱右端213 → テキスト左端228 */
  margin: 0;
}
.yg-item__check {
  flex: none;
  width: 2.1875rem;  /* XD: 白角箱 35px */
  height: 2.1875rem;
  background: #fff;
}
.yg-item__check svg { display: block; width: 100%; height: 100%; }
.yg-item__text {
  margin: 0.1563rem 0 0; /* XD: 行箱上端255.5（角箱253との光学センター差2.5px） */
  color: #212121;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: 0.125rem; /* XD: ls100 = 2px */
  line-height: 1.875rem;    /* XD: 2行項目のbaseline間隔 340→370 = lh30 */
}

/* --------------------------------------------------------------------------
   YOUTH GROWTH SP (〜767px) — XD正本 SP_375 375x520。
   パネル全幅・下角丸、帯345px、項目は縦積み6行（角箱25px・テキスト16px）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  .yg-br-pc { display: none; } /* SP正本は「キャリアプランによる育成制度」1行 */

  .yg { padding-bottom: 4.375rem; } /* XD SP: パネル下端450 → セクション境界520 */

  .yg__panel {
    max-width: none; /* XD SP: パネル x=0 w=375 */
    margin: 0;
    padding: 2.9688rem 0.9375rem 2.1875rem; /* 上=見出し行箱上端47.5 / 下=帯下端415→450 */
  }

  .yg__heading {
    font-size: 1.5rem;
    letter-spacing: 0.15rem; /* XD SP: ls100 = 2.4px */
    line-height: 2.5rem;     /* XD SP: lh40（baseline 78・118） */
  }

  .yg__list {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    grid-auto-flow: row;
    row-gap: 0.625rem;     /* XD SP: 行間隔40 − 行高30 */
    margin: 1.4063rem 0 0; /* XD SP: 見出し行箱下端127.5 → 帯上端150 */
    padding: 1.0938rem 0 1.0938rem 1.25rem; /* XD SP: 帯150→行167.5 / 左15→35 / 下397.5→415 */
  }
  .yg-item { gap: 0.625rem; } /* XD SP: 角箱右端60 → テキスト左端70 */
  /* SPは行箱30px > 角箱25pxのため、逆に角箱側を2.5px下げて光学センター
     （XD SP: 角箱上端170・テキストbaseline190） */
  .yg-item__check {
    width: 1.5625rem;  /* XD SP: 白角箱 25px */
    height: 1.5625rem;
    margin-top: 0.1563rem;
  }
  /* viewBox35→表示25の縮尺0.714で実寸stroke=3pxに戻す（ws__accent-waveと同じ手法） */
  .yg-item__check path { stroke-width: 4.2; }
  .yg-item__text {
    margin-top: 0;
    font-size: 1rem;
    letter-spacing: 0.1rem; /* XD SP: ls100 = 1.6px */
    line-height: 1.875rem;
  }
}

/* ==========================================================================
   共通コンポーネント CTAバナー（.ctab） — XD共有シンボル
   PC: PC_cta 55832242-0b63-400f-b7f4-afe64801f4c6（1366x334）
   SP: SP_cta fddebb29-f65c-4c20-bf6d-039bfe018ef2（375x375）
   同一シンボルが2箇所に配置されている（PC doc y=2532 と y=8223 /
   SP doc y=2576 と y=10121）。セクション04（.ec）とセクション10（.nc）で
   このブロックを共有し、外側の余白だけを各セクションが持つ
   ========================================================================== */

/* 緑グラデバナー（XD: 長方形20235 (0.037,1)→(0.988,0.022) #0c684a→#2ca87f。
   角度はPC 1366x333キャンバス換算で75.93deg） */
.ctab {
  position: relative; /* 装飾レイヤー(.ctab__art)の基準。本文配置には使わない */
  overflow: hidden;   /* 装飾SVG(334px)の下端1px超過をバナー内に収める */
  background: linear-gradient(75.93deg, #0c684a, #2ca87f);
  color: #fff;
}
.ctab__art {
  position: absolute; /* 理由: バナー背面に敷く背景美術レイヤー */
  inset: 0;
  pointer-events: none;
}
.ctab__deco { width: 100%; height: auto; } /* XD: マスクグループ4（白X帯）1366x334 */
.ctab__photo {
  position: absolute; /* 理由: 背景美術（人物写真の見切りステージ） */
  left: 1.8125rem; /* XD: _DSC5434 x=29 */
  top: 0;
  width: 31.1875rem;  /* XD: 499px */
  height: 20.8125rem; /* XD: 333px（写真素材のため固定寸法） */
  overflow: hidden;
}
.ctab__photo img {
  position: absolute; /* 理由: ステージ内クロップ（XD pattern scale1.11+offset） */
  left: -3.1635rem;
  top: -2.2859rem;
  width: 34.6623rem;
  height: 23.0984rem;
  max-width: none;
}

/* 本文列（XD: 左端 x=528。上=ロゴink上端48.5 / 下=ボタン下端283→バナー下端333） */
.ctab__body {
  position: relative; /* .ctab__art より手前に置くための重ね基準 */
  z-index: 1;
  padding: 3.0313rem 0 3.125rem 33rem;
}
.ctab__brand {
  display: flex;
  align-items: flex-start;
  margin: 0;
}
.ctab__logo { width: 16.125rem; height: 2.875rem; } /* XD: 258x46 */
.ctab__edition {
  margin: 0.3238rem 0 0 1.2375rem; /* XD: x=805.8（ロゴ右端786+19.8）/ 行箱上端53.7 */
  font-size: 0.875rem;
  line-height: 1.25rem;      /* XD: lh20 */
  letter-spacing: 0.0438rem; /* XD: ls50 = 0.05em */
}
.ctab__heading {
  /* XD: baseline 176（帯上端から）。行箱上端から逆算せずベースラインを直接合わせる。
     Blink は lh60/fs40 の行箱内で baseline を 上端+47.44px に置く（Noto Sans JP の
     ascent1.16em+descent0.288em を half-leading で中央寄せ）ので、行箱上端130.8だと
     baseline 177.797 と 1.797px 下がっていた（final-v2/C-MEASURE.json で4幅実測）。
     同量を .ctab__actions の margin-top に足してボタン以降は動かさない */
  margin: 2.1565rem 0 0; /* 34.504px = 行箱上端128.6 → baseline 176.000 */
  font-size: 2.5rem;     /* XD: Noto Sans JP Bold 40px */
  font-weight: 700;
  letter-spacing: 0.25rem; /* XD: ls100 = 4px */
  line-height: 3.75rem;    /* XD: lh60 */
}
.ctab__actions {
  display: flex;
  gap: 1.5625rem;        /* XD: ボタン間 848→873 = 25px */
  margin: 2.1248rem 0 0; /* XD: ボタン上端 y=223。見出しを1.797px上げたぶんを足し戻して据え置き */
}
.ctab__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20rem;        /* XD: 320px */
  min-height: 3.75rem; /* XD: 60px（固定高にせず文言増は伸びで吸収） */
  border-radius: 1.875rem;
  color: var(--color-ink);
  font-size: 1.25rem; /* XD: Noto Sans JP Bold 20px */
  font-weight: 700;
  letter-spacing: 0.0625rem; /* XD: ls50 = 0.05em */
  text-decoration: none;
  transition: filter .2s;
}
.ctab__button--experience { background: var(--color-yellow); }
.ctab__button--entry { background: #fff; }
/* hover仕様はXDに無いため控えめな明度変化で実装（自由裁量） */
.ctab__button:hover { filter: brightness(.94); }

/* PC/SP改行出し分け（DOMは単一のまま） */
.ctab-br-sp { display: none; }

/* ---- SP（〜767px）: 共通コンポーネント SP_cta（375x375・写真とX帯は無し） ---- */
@media (max-width: 767px) {
  .ctab-br-sp { display: inline; }

  /* SPはグラデのみ（375x375キャンバス換算で44.2deg） */
  .ctab { background: linear-gradient(44.2deg, #0c684a, #2ca87f); }
  .ctab__art { display: none; } /* SP正本(SP_cta)に写真・X帯は無い */

  .ctab__body { padding: 2.25rem 0 2.1875rem; } /* XD SP: ロゴ上端36 / ボタン下端340→375 */
  .ctab__brand { margin-left: 2.2566rem; }      /* XD SP: ロゴ x=36.1 */
  .ctab__logo { width: 12.8125rem; height: 2.285rem; } /* XD SP: 205px幅（PC比0.795） */
  .ctab__edition { margin: 0 0 0 1.3063rem; }   /* XD SP: x=262 / 行箱上端35.7≒ロゴ上端36 */
  .ctab__heading {
    margin-top: 1.3753rem;    /* XD SP: baseline128 直合わせ（行箱上端98.9 だと baseline 128.875 と0.875px下） */
    font-size: 1.5rem;        /* XD SP: 24px */
    letter-spacing: 0.15rem;  /* XD: ls100 = 2.4px */
    line-height: 2.5rem;      /* XD SP: lh40 */
    text-align: center;       /* XD SP: x=70 = (375−字幅)/2 の中央置き */
  }
  .ctab__actions {
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;          /* XD SP: ボタン間 260→280 = 20px */
    margin-top: 1.3747rem; /* XD SP: ボタン上端 y=200。見出しを0.875px上げたぶんを足し戻して据え置き */
  }
  .ctab__button { font-size: 1rem; letter-spacing: 0.05rem; } /* XD SP: 16px / ls50 */
}

/* ==========================================================================
   04 EXPERIENCE CTA（中間CTA／1DAY仕事体験） — XD正本: PC_1366 y=2532..3188 /
   SP_375 y=2576..3159（スロット高583）。
   バナーは共通コンポーネント .ctab。本セクション固有は移行ゾーン
   （散り三角・キャッチ見出し・境界線）のみ。absoluteは重なり装飾だけ
   ========================================================================== */

/* ---- 移行ゾーン（散り三角・キャッチ見出し・境界線）。地はbody背景 ---- */
.ec__transition {
  position: relative; /* 散り三角(absolute)の基準 */
  /* flow-root: 子(.ec__catch)のmargin-topが親を突き抜ける相殺を止める。
     相殺すると transition 自体が下がり、基準にしている散り三角が
     まるごとキャッチ余白ぶん(PC135px/SP70px)ズレる実害があった */
  display: flow-root;
}
/* 散り三角の描画キャンバス。回転で生じる左右のはみ出しをXDアートボード同様に
   切る。上はバナーへの重なりぶん余白を広げ、下はXD正本どおり
   セクション境界（線12）でクリップする（次セクション05側に三角は出ない） */
.ec__scatter {
  position: absolute; /* 理由: 重なり装飾レイヤー（本文フロー外の背景美術） */
  inset: -3.75rem 0 0;
  overflow: hidden;
  pointer-events: none;
}
.ec__tri {
  position: absolute; /* 理由: 重なり装飾（XD blur_01〜03のぼかし三角PNGをmatrix配置そのまま） */
  background-size: 100% 100%;
  transform-origin: 0 0;
}
/* top はXD値 + キャンバス上余白3.75rem */
.ec__tri--a { left: 71.4581rem; top: 4.9344rem;  width: 4.2227rem; height: 9.0338rem; background-image: url("../assets/tri-blur-01.png"); transform: matrix(.5, -.86603, .86603, .5, 0, 0); }
.ec__tri--b { left: 46.7219rem; top: 14.9756rem; width: 9.2505rem; height: 19.7899rem; background-image: url("../assets/tri-blur-01.png"); transform: matrix(-.51504, .85717, -.85717, -.51504, 0, 0); }
.ec__tri--c { left: 71.3581rem; top: 15.8394rem; width: 3.9361rem; height: 8.4222rem; background-image: url("../assets/tri-blur-02.png"); transform: matrix(.19081, .98163, -.98163, .19081, 0, 0); }
.ec__tri--d { left: 4.5163rem;  top: 11.3819rem; width: 2.6268rem; height: 5.6196rem; background-image: url("../assets/tri-blur-03.png"); transform: matrix(-.98163, -.19081, .19081, -.98163, 0, 0); }
.ec__tri--e { left: 79.855rem;  top: 21.31rem;   width: 2.6165rem; height: 5.5992rem; background-image: url("../assets/tri-blur-03.png"); transform: matrix(.58779, .80902, -.80902, .58779, 0, 0); }

/* キャッチ見出し（アウトラインSVG。字組・ジャンプ率はパスに焼き込み済み）。
   position:relative は散り三角(positioned)より手前に出すための重ね基準 */
.ec__catch {
  position: relative;
  margin: 8.4375rem 0 0 3.125rem; /* XD: ink上端 y=468（バナー下333から135）/ ink左端 x=50 */
  color: #212121; /* SVGは fill=currentColor */
}
.ec__catch-svg { display: block; height: auto; }
.ec__catch-svg--pc { width: 55.0625rem; } /* XD: ink幅 881px */
.ec__catch-svg--sp { display: none; }

/* 境界線（XD: 線12 y=3188 全幅 #212121 1px。本セクションが所有し、
   次セクション(job-day)はリード文 y=3238 から始める） */
.ec__boundary {
  margin: 1.875rem 0 0; /* XD: キャッチink下端626 → 線656 */
  border: 0;
  border-top: 0.0625rem solid #212121;
}

/* --------------------------------------------------------------------------
   EXPERIENCE CTA SP (〜767px) — XD正本 SP_375 y=2576..3159
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  /* 散り三角 SPインスタンス（回転はPCと同一、位置・寸法のみ差し替え。top=XD値+3.75rem） */
  .ec__tri--a { left: 18.71rem;    top: 4.5906rem;  width: 2.285rem;  height: 4.8463rem; }
  .ec__tri--b { left: 15.9913rem;  top: 8.6931rem;  width: 3.6256rem; height: 7.79rem; }
  .ec__tri--c { left: 10.7269rem;  top: 15.4394rem; width: 1.2488rem; height: 2.6725rem; }
  .ec__tri--d { left: 1.2831rem;   top: 8.2413rem;  width: 1.1894rem; height: 2.4944rem; }
  .ec__tri--e { left: 21.4688rem;  top: 15.2088rem; width: 1.0538rem; height: 2.2869rem; }

  .ec__catch { margin: 4.375rem 0 0 0.9375rem; } /* XD SP: ink上端445（バナー下375から70）/ 左15 */
  .ec__catch-svg--pc { display: none; }
  .ec__catch-svg--sp { display: block; width: 21.5rem; } /* XD SP: ink幅 344px */

  .ec__boundary { margin: 1.25rem 0.9375rem 0; } /* XD SP: 線831 x=15 w=345 / ink下端563→線583 */
}

/* ==========================================================================
   05 JOB DAY（施工管理の一日） — XD正本: PC_1366 y=3188..4460（高1272）/
   SP_375 y=3159..（本文リード＋タイムライン。SP項目文言はXD側プレースホルダー）。
   リード文＋タイムライン5項目。カードは実テキストのフロー（固定高なし）、
   項目は grid 3列（時刻ピル/ドット/カード）。absolute はドット連結の
   点線（重なり装飾）のみ
   ========================================================================== */

/* セクション器。flow-root: リード文のmargin-topがセクション外へ相殺で逃げて
   セクション箱がXD境界(y=3188)からズレるのを防ぐ（ec__transitionと同じ実害対策） */
.jd { display: flow-root; }

/* リード文（XD PC: x=50 baseline 3257/3297 fs16 lh40 ls1.6 #212121） */
.jd__intro {
  margin: 2.6875rem 3.125rem 0; /* XD: baseline y=3238+19 − 行箱換算（実測合わせ） */
  color: #212121;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0.1rem;  /* XD: ls100 = 1.6px */
  line-height: 2.5rem;     /* XD: lh40 */
}

/* タイムライン（XD PC: カード y=3352 から165pxピッチ×5 = カード130+間35） */
.jd__timeline {
  margin: 2.5688rem 0 0; /* XD: リード文行箱下端→カード1上端 y=3352 */
  padding: 0 3.125rem 19.875rem; /* 下=XD 最終カード下端4142→セクション末4460 の地余白318 */
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 2.1875rem; /* XD: カード間 35px */
}

/* 項目: [時刻ピル200 | ドット帯124(中心x=312) | カード942]（XD: ピルx=50 / ドットcx=312 / カードx=374） */
.jd__item {
  position: relative; /* ドット連結点線(::before 重なり装飾)の描画基準 */
  z-index: 0;         /* 点線(z:-1)を項目内容の背面・body背景の手前に閉じ込める */
  display: grid;
  grid-template-columns: 12.5rem 7.75rem 1fr;
  align-items: start;
}

/* ドット連結の点線（XD: 線 x=312 幅5 #a7a7a7 破線0/16 線端丸 = 径5ドット16pxピッチ）。
   absolute理由: 隣接ドット中心同士を結ぶ重なり装飾で、本文フローに寸法を持たない。
   各項目が「自ドット中心→次ドット中心」の1区間を描く（最終項目は描かない） */
.jd__item:not(:last-child)::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 16.2188rem;                /* XD: 線中心x=312 − timeline左pad50 − 幅5/2（項目基準） */
  top: 3.125rem;                   /* 自ドット中心（カード上端+50） */
  bottom: -5.3125rem;              /* 次項目ドット中心まで（間35+50） */
  width: 0.3125rem;
  background-image: radial-gradient(circle closest-side, #a7a7a7 98%, transparent);
  background-size: 0.3125rem 1rem; /* ドット径5 / ピッチ16 */
  background-repeat: repeat-y;
}

/* 時刻ピル（XD: x=50 y=カード+26 200x40 r20 #f8fcfb / DIN2014 Bold 24 ls4.8 #005a3c centred） */
.jd__time {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 1.625rem;  /* XD: ピル上端 = カード上端+26 */
  width: 12.5rem;
  min-height: 2.5rem;    /* XD: 40px（固定高にせず文字増は伸びで吸収） */
  border-radius: 1.25rem;
  background: #f8fcfb;
  color: var(--color-green);
  font-family: "din-2014", "DIN 2014", "Roboto", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.3rem; /* XD: ls200 = 4.8px */
  text-indent: 0.3rem;    /* 末尾字送りぶんを相殺してXD同様の光学センター */
  line-height: 1;
}

/* ドット（XD: cx=312 cy=カード+50 r12 #005a3c。グリッド帯250..374の中央=312） */
.jd__dot {
  justify-self: center;
  margin-top: 2.375rem; /* XD: 円上端 = カード上端+38 */
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--color-green);
}

/* カード（XD: 942x130 r10 #ecf0ef 白枠1px。高さは実テキスト＋paddingで130に一致。
   枠はborderでなくinset影: border 0.0625remは中間幅で整数pxにスナップされ
   カード5枚分の高さ誤差(768で+4px/1920で-4px)が出るため、レイアウト非干渉の影で描く） */
.jd__card {
  box-shadow: inset 0 0 0 0.0625rem #fff;
  border-radius: 0.625rem;
  background: #ecf0ef;
  padding: 2.0313rem 1.875rem 1.7563rem 3.125rem; /* XD: 題x=424(左50) / 題baseline+57 / 全高130 */
}
.jd__title {
  margin: 0;
  color: #212121;
  font-size: 1.75rem;        /* XD: Noto Sans JP Bold 28px */
  font-weight: 700;
  letter-spacing: 0.175rem;  /* XD: ls100 = 2.8px */
  line-height: 1.75rem;      /* XD: 単行28（行送り情報なし） */
}
.jd__copy {
  margin: 1.5875rem 0 0; /* XD: 題baseline→コピーbaseline差43（コピーbaseline=カード+100）の行箱換算 */
  color: #212121;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1rem;
}

/* --------------------------------------------------------------------------
   JOB DAY SP (〜767px) — XD正本 SP_375 y=3159..。リードx=15 fs14 lh35、
   ピル70x20・ドットr5(cx=98)・カードx=111 w249。XD項目はダミー文言のため
   カード実高はXDの組み立て式（padding14.5/題lh25/コピーlh25）から導出
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  .jd__intro {
    margin: 1.7625rem 0.9375rem 0; /* XD SP: baseline 3159+51 − 行箱換算 / x=15 幅345 */
    color: #1c1c1c;                /* XD SP: rgb(28,28,28)（PCの#212121と別指定） */
    font-size: 0.875rem;
    letter-spacing: 0.0875rem;     /* XD SP: ls100 = 1.4px */
    line-height: 2.1875rem;        /* XD SP: lh35 */
  }

  .jd__timeline {
    margin-top: 2.6125rem;        /* XD SP: リード文行箱下端→カード1上端 y=3159+245 */
    padding: 0 0.9375rem 0;       /* 下余白0: 次セクション(career)の緑山形が最終カード直下 y≒997 から始まる */
    gap: 0.9375rem;               /* XD SP: カード間 15px */
  }

  /* [ピル70 | ドット帯26(中心x=98) | カード249] */
  .jd__item { grid-template-columns: 4.375rem 1.625rem 1fr; }

  /* 点線（XD SP: 線 x=98 幅3 #95a4b8 破線0/13 = 径3ドット13pxピッチ） */
  .jd__item:not(:last-child)::before {
    left: 5.0938rem;               /* XD SP: 線中心x=98 − timeline左pad15 − 幅3/2（項目基準） */
    top: 1.6875rem;                /* 自ドット中心（カード上端+27） */
    bottom: -2.625rem;             /* 次項目ドット中心まで（間15+27） */
    width: 0.1875rem;
    background-image: radial-gradient(circle closest-side, #95a4b8 98%, transparent);
    background-size: 0.1875rem 0.8125rem; /* ドット径3 / ピッチ13 */
  }

  .jd__time {
    margin-top: 1.0625rem;   /* XD SP: ピル上端 = カード上端+17 */
    width: 4.375rem;
    min-height: 1.25rem;     /* XD SP: 20px */
    border-radius: 0.625rem;
    font-size: 1rem;
    letter-spacing: 0.2rem;  /* XD SP: ls200 = 3.2px */
    text-indent: 0.2rem;
  }

  .jd__dot {
    margin-top: 1.375rem; /* XD SP: 円上端 = カード上端+22 */
    width: 0.625rem;
    height: 0.625rem;
  }

  /* カード（XD SP: w249 r5 #ecf0ef 白枠1px。単行54/題2行79/題+コピー2行106 の組み立て式に一致） */
  /* jd__itemのz:0 contextを波形clip-pathのcontext(z:auto/0)より前へ。
     子cardだけのz-indexでは祖先contextを越せないため、SPの祖先itemを1にする。 */
  .jd__item { z-index: 1; }

  .jd__card {
    border-radius: 0.3125rem;
    padding: 0.9063rem 0.9375rem 0.6875rem; /* XD SP: 単行カード54=上14.5+lh25+下14.5 由来 / 左右15 */
  }
  .jd__title {
    font-size: 1rem;          /* XD SP: Noto Sans JP Bold 16px */
    letter-spacing: 0;
    line-height: 1.5625rem;   /* XD SP: lh25（2行題 79px カードの行送り） */
  }
  .jd__copy {
    margin-top: 0.3438rem;    /* XD SP: 題baseline417→コピーbaseline446 の差29 の行箱換算 */
    font-size: 0.75rem;       /* XD SP: 12px */
    line-height: 1.5625rem;   /* XD SP: lh25 */
  }
}

/* ==========================================================================
   06 CAREER（キャリアパス） — XD正本: PC_1366 careerローカル原点 doc y=4173
   （緑山形の基準上端。workmap境界4460より287px上に食い込む）/ SP_375 は
   jd最終カード直下 doc y=4169 開始・山形谷底〜ウォーターマークまで。
   緑山形は「通常フローのブロック＋負マージン」で本文の背面に敷く（absolute
   不使用）。山頂はXD上さらに上（PC doc4135 / SP doc4149）まで尖り、前セク
   ションjdの不透明カードの背後に隠れて途中から見える構図。jdカードは
   positioned(z:0)でフロー背景より後に描画されるため、この重なりはXDどおり
   カード側が勝つ
   ========================================================================== */

/* セクション器。flow-root: 山形の負margin-topが.crのmarginと相殺合体して
   セクション原点がズレるのを防ぐ（jdと同じ実害対策）。
   margin-top -287px: XD上、山形がjdの空白テール（doc4173..4460）に重なるため
   セクションごと引き上げる（v1 --uchiike-career-overlap と同値） */
.cr {
  display: flow-root;
  margin-top: -17.9375rem;
  padding-bottom: 1.875rem; /* XD: ウォーターマーク下端850 → セクション末880 */
}

/* 緑の山形（XD: パス342659 #5a927f。六角形ポリゴン、上辺=山なり・下辺=V字）。
   通常フローのブロックとして高さぶん場所を取り、margin-bottomの負値で後続
   本文をこの上に重ねる（背景レイヤーをabsoluteにしない代替）。
   margin-top -38px: 山頂はセクション原点より38px上（doc4135）にある */
.cr__wave {
  margin-top: -2.375rem;
  height: 52.54rem; /* XD: 山頂-38 → 谷底802.64 の840.64px */
  margin-bottom: -50.165rem; /* 後続本文をセクション原点(=山形ボックス内y38px)へ戻す */
  background: var(--color-green-soft);
  /* 頂点座標はAGCパス実測値（山形ボックス基準） */
  clip-path: polygon(
    0 11.835rem,
    53.8219rem 0,
    85.375rem 9.7463rem,
    85.375rem 42.0081rem,
    28.0394rem 52.54rem,
    0 47.185rem
  );
}

/* ---- 見出し: 支給XDのPC/SPアウトラインを単一pictureで表示。既存の通常flowスロットを維持 ---- */
.cr__heading {
  position: relative;  /* 黄波線(装飾)の重ね基準 */
  isolation: isolate;  /* 波線のz:-1を見出し内に閉じ込める */
  margin: 0 0 0 3.125rem;   /* XD: 行2 ink左端 x=50 */
  padding-top: 10.0188rem;  /* XD: 行1ボックス上端160.3（baseline238/334をlh96で再現） */
  color: #fff;
  font-weight: 700;
  font-size: 4.25rem;
}
.cr__title-art { display: block; width: 43.75rem; height: 12rem; }
.cr__title-art img { display: block; width: 100%; height: 100%; }

/* 黄波線（XD: パス342671 stroke#ffc02e、2度回転はSVG内transformに保持）。
   absolute理由: 見出し行2に重なる装飾で本文フローに寸法を持たない。
   z:-1: AGCの重ね順（波線di=95 < 見出しdi=96）どおり文字の背面に敷く */
.cr__squiggle {
  position: absolute;
  z-index: -1;
  height: auto;
  pointer-events: none;
}
.cr__squiggle--pc {
  left: -5.6969rem;   /* XD: bbox x=-41.15（見出し左端50基準） */
  top: 18.0163rem;    /* XD: bbox y=288.26（careerローカル=見出しボックス上端基準） */
  width: 48.5069rem;  /* XD: bbox 776.11px */
}
.cr__squiggle--sp { display: none; }

/* ---- カード3枚（grid+gap。x=50/484/918 w398 gap36が margin50+列398×3+gap36×2
   =1266で厳密一致。固定高なし・文言増は伸びで吸収） ---- */
.cr__cards {
  display: grid;
  grid-template-columns: repeat(3, 24.875rem);
  gap: 2.25rem;
  margin: 2.2313rem 3.125rem 0; /* XD: 見出しボックス下端352.3 → カード上端388 */
  padding: 0;
  list-style: none;
}

/* ガラスカード（XD: 長方形20239/20240/20242 白塗り0%+背景ぼかし30/明度105%・
   白枠1px・角丸10）。枠はjdと同じくborderでなくinset影（中間幅での整数px
   スナップによる内部座標ズレ防止・レイアウト非干渉）。
   行構成: [1]絵ゾーン169.28px固定（タグ・アイコンの重なりセル。実テキスト行は
   auto）/ [2]題 / [3]本文。align-content:start で余り高さを行に配らない。
   backdrop-filterにblurを使わない: XDスペックはぼかし30だがXDレンダー実測
   （SOURCE-PC x1290縦断面）は緑→白地の境界がポリゴン辺位置でクリスプ＝
   ぼかし不描画。CSS blur(30px)だと白地がカード3右下へ±45px滲んで白被りに
   見える。ガラス色味はXD実測（緑90/146/127→98/152/134・白229→224の明部
   圧縮+微増光）を contrast(90%) brightness(104%) で再現（誤差≤2/ch） */
.cr-card {
  position: relative; /* カード間シェブロン(重なり装飾)の基準 */
  display: grid;
  grid-template-rows: 10.58rem auto auto;
  align-content: start;
  margin: 0;
  padding-bottom: 2.0875rem; /* XD: 本文3行下端280.6 → カード下端314 */
  border-radius: 0.625rem;
  box-shadow: inset 0 0 0 0.0625rem #fff;
  background: rgb(255 255 255 / 0%);
  backdrop-filter: contrast(90%) brightness(104%);
  -webkit-backdrop-filter: contrast(90%) brightness(104%);
}

/* 年次タグ（XD: ピル h20 r10 #ffc02e、カード右上から15/15、幅70/93/98） */
.cr-card__tag {
  grid-area: 1 / 1;
  justify-self: end;
  align-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0.9375rem 0.9375rem 0 0;
  min-height: 1.25rem;
  padding: 0 0.875rem;
  border-radius: 0.625rem;
  background: var(--color-yellow);
  color: var(--color-ink);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25rem;
  white-space: nowrap;
}
.cr-card:nth-child(1) .cr-card__tag { min-width: 4.375rem; }
.cr-card:nth-child(2) .cr-card__tag { min-width: 5.8125rem; }
.cr-card:nth-child(3) .cr-card__tag { min-width: 6.125rem; }

/* 線画アイコン（XD AGCマスクグループの natural size/位置。画像のため固定寸法。
   タグと同じ絵ゾーンセルにgrid重なりで共存（absolute不使用） */
.cr-card__icon {
  grid-area: 1 / 1;
  justify-self: center;
  align-self: start;
}
.cr-card__icon--1 { width: 4.875rem;  height: 5.375rem;  margin-top: 2.0688rem; margin-left: 0.1875rem; } /* XD: ink左161.5（中央160比+1.5） */
.cr-card__icon--2 { width: 5.6125rem; height: 4.8875rem; margin-top: 2.2438rem; }
.cr-card__icon--3 { width: 5.4188rem; height: 5.6688rem; margin-top: 1.8563rem; }

/* 題（XD: Noto Sans JP Bold 20 ls2 白 baseline=カード+188。lh1箱上端169.28で一致） */
.cr-card__title {
  margin: 0 1.5625rem;
  color: #fff;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: 0.125rem;
  line-height: 1;
  white-space: nowrap;
}

/* 本文（XD: Noto Sans JP 14 lh25 白 1行目baseline=カード+225。改行はXD焼き込み。
   AGC実測: テキスト箱ty=カード+209は箱上端で、1行目baselineは行内y+16の225） */
.cr-card__body {
  margin: 1.02rem 1.5625rem 0;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.5625rem;
}

/* カード間シェブロン（XD: 線画14x26.8 stroke3 白、gap36の光学中央 x460/894
   y519.5）。absolute理由: 隣接カードの間隙に重ねる送り装飾でフロー寸法なし */
.cr-card__chevron {
  position: absolute;
  display: block;
}
.cr-card__chevron--pc {
  left: calc(100% + 0.6563rem); /* XD: カード右端448 → svg箱左端458.5（geom460-線1.5） */
  top: 8.125rem;                /* XD: svg箱上端518（geom519.5-線1.5） */
  width: 1.0625rem;
  height: 1.8625rem;
}
.cr-card__chevron--sp { display: none; }

/* 横マーキー共通。トラック（同一文字列3枚）をちょうど1枚分ぶんだけ左へ送る。
   3枚目が抜けきる前に1枚目が同じ位置へ戻るので、継ぎ目もリセットの飛びも出ない。
   translateX の % はトラック自身の幅（＝3枚分）に対する割合なので 100%/3 = 1枚分。
   transform だけを動かすのでレイアウトもペイントも発生しない（合成のみ） */
@keyframes marquee-flow {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(-100% / 3)); }
}

/* 1周（＝文字列1本ぶんの移動）に要する時間。文字サイズも移動距離も rem 基準で
   ビューポート幅に比例するため、どの幅でも見かけの速さは同じになる */
.cr__marquee-track,
.fq__wordmark-track {
  display: flex;
  width: max-content;
  animation: marquee-flow 30s linear infinite;
}

/* OSで「視差効果を減らす」を選んでいる利用者には流さない。
   停止位置は中央の1枚がクリップ中央＝XDの見え方そのもの */
@media (prefers-reduced-motion: reduce) {
  .cr__marquee-track,
  .fq__wordmark-track { animation: none; }
}

/* ウォーターマーク（XD: DIN 2014 Bold 116 ls23.2 白1px抜き輪郭 中央anchor683。
   はみ出す欧文はXDアートボード同様この帯内でクリップ） */
.cr__marquee-clip {
  display: flex;
  justify-content: center;
  /* overflow:clip はスクロールコンテナを作らないので、幅を超えたトラックの
     flex 中央寄せがそのまま効く（hidden だとスクロール可能領域の算入で歪む） */
  overflow: clip;
  margin: 2rem 0 0; /* XD: カード下端702 → 文字箱上端734 */
}
.cr__marquee {
  /* 末尾の字送りアキを margin で打ち消し、左右へ 0.5em ずつの間隔を padding で持たせる。
     こうすると1枚の外寸＝インク幅＋1em で左右対称になり、
     ①中央の1枚のインクがXDどおり帯の中央に来る ②複製どうしの間隔が常に1em になる */
  margin-right: -0.2em;
  padding: 0 0.5em;
  color: transparent;
  -webkit-text-stroke: 0.0625rem #fff;
  font-family: "din-2014", "DIN 2014", "Roboto", sans-serif;
  font-size: 7.25rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 1.45rem;
  white-space: nowrap;
  opacity: 0.85; /* v1検証値（薄グレー地でほぼ不可視のデザイン） */
}

/* PC/SP改行出し分け（DOMは単一のまま） */
.cr-br-sp { display: none; }

/* --------------------------------------------------------------------------
   CAREER SP (〜767px) — XD正本 SP_375（SOURCE-06-career）。カードは
   追加承認により背景ぼかしを有効化。下向きシェブロン。カード文言はXD側が「1年目」3枚複製の
   プレースホルダのためPC正本の3枚を採用（書式fs20/14 lh30はXD SP実測値）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  .cr { margin-top: 0; padding-bottom: 0; } /* jd側が下余白0でここが doc4169 */

  /* 山形（XD SP: 山頂doc4149=セクション原点-20 → 谷底doc5304=+1135.33） */
  .cr__wave {
    margin-top: -1.25rem;
    height: 72.2081rem;
    margin-bottom: -70.9581rem;
    clip-path: polygon(
      0 3.2488rem,
      14.7756rem 0,
      23.4375rem 2.6756rem,
      23.4375rem 69.3169rem,
      7.6975rem 72.2081rem,
      0 70.7375rem
    );
  }

  /* 見出し（XD SP: PCの0.5倍系。行2 ink x=15 / run幅87.5/95.5/191.5/151） */
  .cr__heading {
    margin-left: 0.9375rem;
    padding-top: 2.9169rem; /* baseline1=87.5をlh48で再現（インク照合で-2px補正済み） */
    font-size: 2.125rem;
  }
  .cr__title-art { width: 21.875rem; height: 6rem; }

  .cr__squiggle--pc { display: none; }
  .cr__squiggle--sp {
    display: block;
    left: -1.4156rem;  /* XD SP: bbox x=-7.65（見出し左端15基準） */
    top: 7.2663rem;    /* XD SP: bbox y=116.26（careerローカル） */
    width: 22.9781rem; /* XD SP: bbox 367.65px */
  }

  /* カード縦積み（XD SP: x15 w345 上端172 ピッチ323=高279+間44） */
  .cr__cards {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.75rem;
    margin: 1.7081rem 0.9375rem 0; /* 見出しボックス下端144.67 → カード上端172 */
  }

  /* SP限定: 追加承認によりガラスを復元。緑の透過tintで白文字の可読性を保つ。PCは変更しない */
  .cr-card {
    grid-template-rows: 8.2363rem auto auto; /* 題baseline=カード+153をlh25で再現 */
    padding-bottom: 1.2563rem; /* XD SP: 本文3行下端258.9 → カード下端279 */
    background: rgb(20 68 53 / 60%);
    backdrop-filter: blur(1.875rem) brightness(105%);
    -webkit-backdrop-filter: blur(1.875rem) brightness(105%);
  }

  /* タグはPCと同寸（XD SP実測: ピル70x20 fs14、右上15/15で一致） */

  /* アイコン（XD SP実測: icon1 64.67x72.42 上端+28.69。icon2/3はSP正本が
     プレースホルダ複製のためPC寸×0.842で導出し光学センター合わせ） */
  .cr-card__icon--1 { width: 4.0419rem; height: 4.5263rem; margin-top: 1.7931rem; margin-left: 0; }
  .cr-card__icon--2 { width: 4.7263rem; height: 4.1156rem; margin-top: 1.9938rem; }
  .cr-card__icon--3 { width: 4.5638rem; height: 4.7738rem; margin-top: 1.6688rem; }

  /* 題（XD SP: fs20 ls2 白 baseline=カード+153。lh25で改行時（題15字カード）も
     行送り確保。nowrap解除: 実文言はXD SPダミーより長く345px内で自然折返し */
  .cr-card__title {
    margin: 0 1.25rem;
    line-height: 1.5625rem;
    white-space: normal;
  }

  /* 本文（XD SP: fs14 lh30 x=カード+20 1行目baseline=カード+190。
     PC焼き込み改行は解除し、305px幅の自然折返しがXD SPの21字改行と一致） */
  .cr-card__body {
    margin: 0.7575rem 1.25rem 0;
    line-height: 1.875rem;
  }
  .cr .cr-br-pc { display: none; }
  /* SP題の折返しは文節指定（XD SPはダミー1行のため準拠先なし。345px内の
     自然折返しだと「任され/る」の語中改行になる実害の対策） */
  .cr-br-sp { display: inline; }

  /* 下向きシェブロン（XD SP: 線画26.77x14 stroke3 白、カード間隙44の中央、
     水平センター187.4） */
  .cr-card__chevron--pc { display: none; }
  .cr-card__chevron--sp {
    display: block;
    left: 9.8438rem;               /* XD SP: svg箱左端172.5（カード左15基準157.5） */
    top: calc(100% + 0.8438rem);   /* XD SP: カード下端+15 − 線1.5 */
    width: 1.8606rem;
    height: 1.0625rem;
  }

  /* ウォーターマーク（XD SP: fs64 ls12.8 白1px輪郭。中央でなくx=-249.13起点の
     見切り配置。クリップ帯の左端で見切るのはXDアートボードと同じ） */
  .cr__marquee-clip {
    justify-content: flex-start;
    margin-top: 0.2688rem; /* カード列下端1097 → 文字箱上端1101.3（baseline1162） */
  }
  /* XD SP の起点 x=-249.13 はトラック側に持たせる。3枚の複製は等幅のままなので
     1周＝1枚分という関係が崩れない（＝停止位置がXDの見切り、流れは継ぎ目なし） */
  .cr__marquee-track { margin-left: -17.5706rem; } /* -249.13px − 左padding 0.5em(=32px) */
  .cr__marquee {
    font-size: 4rem;
    letter-spacing: 0.8rem;
  }
}


/* --------------------------------------------------------------------------
   07 WORKS（施工実績） — XD正本: PC_1366 doc y=5053..6013.9 / SP_375 doc y=5366.5..6858
   構成: 見出し(A-SK大蘭明朝アウトラインSVG) → 全幅罫線 → 3カード(眉DIN/写真/緑帯題/本文)。
   v1が保留した AGCグループ86002(見出し)と線534(罫線 doc5316)を本セクションが所有。
   線535(doc6106)と「人を大事にした、制度と環境」見出し(グループ86001, ink6013.9)は
   次セクション(benefits)のリードインなので描かない。
   背景はAGC実測 #e1e5e4（bodyの#e5e9e9とは別。careerゾーンも正本は#e1e5e4だが既実装は
   body色のまま=Δ≤5/ch、申し送り）
   -------------------------------------------------------------------------- */
.wk {
  display: flow-root;
  /* position+z-index: SPでcr末尾へ重ねる際、crマーキー(白輪郭ストローク)の
     グリフ下端ブリードが後続背景より上に描かれるのを防ぐ（スタッキング
     コンテキスト化で.wk全体をcrのinline contentより後に原子的に描画）。
     オフセットは持たない */
  position: relative;
  z-index: 0;
  padding-top: 4.721rem; /* XD: セクション上端5053 → 見出しink上端5128.54 */
  padding-bottom: 7.9938rem; /* XD: カード3本文箱下端5886 → 次見出しink上端6013.9 */
  background: #e1e5e4;
}

/* 見出し（XD: A-SK大蘭明朝アウトライン グループ86002。ink x=50.06 w851.95 h157.44。
   WebFont提供が無いためXD由来アウトラインSVG+sr-only実テキスト＝hero/ec catchと同方式） */
.wk__heading { margin: 0 0 0 3.129rem; }
.wk__heading-svg { display: block; height: auto; }
.wk__heading-svg--pc { width: 53.247rem; }
.wk__heading-svg--sp { display: none; }

/* 全幅罫線（XD: 線534 doc5316 #212121。見出しブロック下の区切り） */
.wk__rule {
  height: 0.0625rem;
  margin: 1.8765rem 0 0; /* XD: 見出しink下端5285.98 → 罫線5316 */
  border: 0;
  background: #212121;
}

/* カード3列（XD: x=50/484/918 w398 gap36。罫線 → 眉ボックス上端まで50） */
.wk__cards {
  display: grid;
  grid-template-columns: repeat(3, 24.875rem);
  column-gap: 2.25rem;
  margin: 3.125rem 3.125rem 0;
  padding: 0;
  list-style: none;
}
.wk-card { margin: 0; }

/* 眉ラベル（XD: DIN2014-Bold 14 ls4.2 #212121 baseline5380。lh1で箱5367..5381） */
.wk-card__eyebrow {
  margin: 0;
  color: var(--color-ink);
  font-family: "din-2014", "DIN 2014", "Roboto", sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.2625rem;
  line-height: 0.875rem;
  white-space: nowrap;
}

/* 施工写真（XD: 5395..5695 398x300、pattern fill cover:center） */
.wk-card__photo { margin: 0.875rem 0 0; } /* XD: 眉箱下端5381 → 写真上端5395 */
.wk-card__photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 398 / 300;
  object-fit: cover;
}

/* 緑帯タイトル（XD: 帯#005a3c h40 上端5676=写真下端5695へ19px重なり。
   Noto Sans JP Bold 28 白 ls0 baseline=帯上端+32、テキストx=帯+5。
   帯幅はXD実測値固定（末尾の句読点emボックスは帯からはみ出すがinkは内側=XDと同じ）。
   position:relative の理由: 後続ブロックの背景は置換要素(img)の下に描かれるため、
   写真の上に帯を重ねるスタッキング確保。オフセットは持たない */
.wk-card__title {
  position: relative;
  margin: -1.1875rem 0 0;
  color: #fff;
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: 0;
}
.wk-card__title-line {
  display: block;
  padding-left: 0.3125rem;
  background: var(--color-green);
  line-height: 2.5rem;
  white-space: nowrap;
}
.wk-card__title-line + .wk-card__title-line { margin-top: 0.3125rem; } /* XD: 帯間5 */
.wk-card:nth-child(1) .wk-card__title-line { width: 22.3125rem; } /* XD: 357 */
.wk-card:nth-child(2) .wk-card__title-line { width: 22.3125rem; } /* XD: 357 */
.wk-card__title-line--1 { width: 18.8125rem; } /* XD: 301 */
.wk-card__title-line--2 { width: 17rem; }      /* XD: 272 */

/* 本文（XD: Noto Sans JP 16 lh35 #212121、AGC箱上端=帯下端+25(card1 doc5741)。
   ブラウザの行箱はXDよりinkが5px下に出るためmargin20でink照合一致
   (SOURCE line1 ink上端 doc5747=LIVE)。改行はPC正本焼き込み(wk-br-pc) */
.wk-card__copy {
  margin: 1.25rem 0 0;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 2.1875rem;
}

/* PC/SP改行出し分け（DOMは単一のまま） */
.wk-br-sp { display: none; }

/* --------------------------------------------------------------------------
   WORKS SP (〜767px) — XD正本 SP_375。カード縦積みピッチ425。
   SP正本のカード文言はWORKS 01×3のプレースホルダ重複のためPC正本3種を採用
   （書式 fs12/20/14・帯h30・写真345x260 はXD SP実測値）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  /* cr実測末尾(doc5382.2=マーキー行箱のスラック込み)より見出しink上端(5366.5)が
     上にあるため、その差分だけ引き上げる（マーキーink下端5334とは重ならない） */
  .wk {
    margin-top: -0.9781rem;
    padding-top: 0;
    padding-bottom: 1.9188rem; /* XD: カード3本文下端 → benefits見出しink上端6858 */
  }

  /* 見出し（XD SP: ink x15 y5366.54 345x126.22 3行） */
  .wk__heading { margin-left: 0.9375rem; }
  .wk__heading-svg--pc { display: none; }
  .wk__heading-svg--sp { display: block; width: 21.5625rem; }

  /* 罫線（XD SP: 線832 doc5513 x15 w345=SPは全幅でなくインセット） */
  .wk__rule { margin: 1.265rem 0.9375rem 0; } /* XD: 見出しink下端5492.76 → 罫線5513 */

  /* カード縦積み（XD SP: x15 w345 眉baseline5560 ピッチ425） */
  .wk__cards {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 2.1563rem; /* XD: 本文下端 → 次カード眉箱上端(ピッチ425の残余) */
    margin: 2.3438rem 0.9375rem 0; /* XD: 罫線5514 → 眉箱上端5551.5(baseline5560-lh下駄) */
  }

  /* 眉（XD SP: DIN 12 ls3.6 baseline5560） */
  .wk-card__eyebrow {
    font-size: 0.75rem;
    letter-spacing: 0.225rem;
    line-height: 0.75rem;
  }

  /* 写真（XD SP: 5569..5829 345x260） */
  .wk-card__photo { margin-top: 0.3438rem; } /* XD: 眉箱下端5563.5 → 写真5569 */
  .wk-card__photo img { aspect-ratio: 345 / 260; }

  /* 緑帯（XD SP: h30 上端5813=写真下端5829へ16px重なり、fs20 baseline=帯+23、
     帯幅はcard1実測258。card3はSP正本がプレースホルダのためPC実測式
     (5+全角送り+句読点ink13)から218/198を導出 */
  .wk-card__title { margin-top: -1rem; font-size: 1.25rem; }
  .wk-card__title-line { line-height: 1.875rem; }
  .wk-card__title-line + .wk-card__title-line { margin-top: 0.3125rem; }
  .wk-card:nth-child(1) .wk-card__title-line { width: 16.125rem; } /* XD SP: 258 */
  .wk-card:nth-child(2) .wk-card__title-line { width: 16.125rem; }
  .wk-card__title-line--1 { width: 13.625rem; } /* 派生: 218 */
  .wk-card__title-line--2 { width: 12.375rem; } /* 派生: 198 */

  /* 本文（XD SP: fs14 lh30 ink1行目上端5862。PC焼き込み改行は解除し345px幅の
     自然折返し=XD SPの改行位置と一致） */
  .wk-card__copy {
    margin-top: 0.5813rem; /* XD: 帯下端5843 → 本文箱上端(ink5862へ実測合わせ) */
    font-size: 0.875rem;
    line-height: 1.875rem;
  }
  .wk .wk-br-pc { display: none; }
}

/* --------------------------------------------------------------------------
   08 BENEFITS（制度と環境） — XD正本: PC_1366 doc y=6013.9..7462.6 / SP_375 doc y=6858..8722
   構成: リードイン見出し(A-SK大蘭明朝アウトラインSVG グループ86001/86019) → 全幅罫線(線535/線833)
   → 緑見出し → カード3枚(写真/題/本文/破線) → 緑見出し → 制度リスト(PC3列/SP2列・破線)。
   線535(doc6106)とリードイン見出しは works v2 の申し送りどおり本セクションが所有。
   「数字で知る内池建設」見出し(グループ86000/86020)・線786/線845・blur三角は
   次セクション(numbers)のリードイン・装飾なので描かない。
   背景はアートボード地 #e1e5e4（worksと同じ。bodyの#e5e9e9とは別物）。
   カード下破線・リスト破線はAGC実測 dash[4]（4px実/4px空）を
   repeating-linear-gradient で再現（border:dashed はChrome実測3/3比になるため不使用）
   -------------------------------------------------------------------------- */
.bn {
  display: flow-root;
  padding-bottom: 8.35rem; /* XD: リスト3行目破線下端7329 → 次見出しink上端7462.6 */
  background: #e1e5e4;
}

/* リードイン見出し（XD: グループ86001 ink x=50.704 y=6013.896 w808.336 h61.12。
   A-SK大蘭明朝アウトライン → XD由来SVG+sr-only実テキスト＝works/hero/ec catchと同方式。
   セクション上端=ink上端なのでmargin-top 0 */
.bn__heading { margin: 0 0 0 3.169rem; }
.bn__heading-svg { display: block; height: auto; }
.bn__heading-svg--pc { width: 50.521rem; }
.bn__heading-svg--sp { display: none; }

/* 全幅罫線（XD: 線535 doc6106 #212121 solid。見出しブロック下の区切り） */
.bn__rule {
  height: 0.0625rem;
  margin: 1.9365rem 0 0; /* XD: 見出しink下端6075.016 → 罫線6106 */
  border: 0;
  background: #212121;
}

/* 緑見出し（XD: Noto Sans JP Bold 28 #005a3c ls100=2.8px、x=50
   baseline doc6244(1つ目)/6873(2つ目)。lh1箱で余白を上下に持たせない） */
.bn__green {
  margin: 6.8975rem 0 0 3.125rem; /* XD: 罫線下端6107 → 文字箱上端6217.36（baseline6244。ink照合で-2px補正） */
  color: var(--color-green);
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: 0.175rem;
  line-height: 1;
}
.bn__green--list { margin-top: 6.5225rem; } /* XD: カード破線下端6742 → 文字箱上端6846.36（baseline6873。ink照合で-2px補正） */

/* カード3列（XD: x=50/484/918 w398 gap36。行stretchで3枚が同高になり、
   破線を margin-top:auto で行下端に揃える=XDの3本とも doc6741 一致と同じ構造） */
.bn__cards {
  display: grid;
  grid-template-columns: repeat(3, 24.875rem);
  column-gap: 2.25rem;
  margin: 2.6025rem 3.125rem 0; /* XD: 緑見出し箱下端6245.36 → 写真上端6287 */
  padding: 0;
  list-style: none;
}
.bn-card {
  display: flex;
  flex-direction: column;
  margin: 0;
}

/* 制度写真（XD: 6287..6532 398x245、pattern fill cover:center。正本の原寸は360x240） */
.bn-card__photo { margin: 0; }
.bn-card__photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 398 / 245;
  object-fit: cover;
}

/* カード題（XD: Noto Sans JP Bold 24 #212121 箱上端6557 lh40） */
.bn-card__title {
  margin: 1.375rem 0 0; /* XD: 写真下端6532 → 題箱上端6554（ink照合でXD題ink6563に-3px合わせ） */
  color: var(--color-ink);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 2.5rem;
}

/* カード本文（XD: Noto Sans JP 16 lh35 #212121 箱上端6612 w398自然折返し） */
.bn-card__body {
  margin: 0.8125rem 0 1.8125rem; /* 上: 題箱下端6594 → 本文箱上端6607（ブラウザ行箱はXDよりinkが
    5px下に出るためink照合で-5px、works本文と同種） / 下: 最長カード(card1,3行)本文箱下端6712 →
    破線6741（カード2,3はrule側のauto marginが余りを吸収） */
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 2.1875rem;
}

/* カード下破線（XD: 線771/813/814 doc6741 w398 #212121 dash[4]。
   margin-top:auto で行下端揃え=本文行数が違ってもXDどおり3本同高） */
.bn-card__rule {
  height: 0.0625rem;
  margin: auto 0 0;
  border: 0;
  background: repeating-linear-gradient(90deg, #212121 0 0.25rem, transparent 0.25rem 0.5rem);
}

/* 制度リスト（XD: 破線x=50/484/918 w398、文字x=+10 Noto Sans JP Bold 20、
   行baseline 6939/7118/7297、破線=各baseline+31。破線はセル下端に敷く） */
.bn__list {
  display: grid;
  grid-template-columns: repeat(3, 24.875rem);
  column-gap: 2.25rem;
  row-gap: 8.0875rem; /* XD: 破線下端6971 → 次行文字箱上端7100.4 */
  margin: 2.94rem 3.125rem 0; /* XD: 緑見出し箱下端6874.36 → 1行目文字箱上端6921.4 */
  padding: 0;
  list-style: none;
}
.bn__list-item {
  padding: 0 0 1.85rem 0.625rem; /* 下: 文字箱下端6941.4 → 破線下端6971 / 左: 文字x60-線x50 */
  color: var(--color-ink);
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
  background:
    repeating-linear-gradient(90deg, #212121 0 0.25rem, transparent 0.25rem 0.5rem)
    left bottom / 100% 0.0625rem no-repeat;
}
/* 「他」（XD: 線784欠番=破線なし） */
.bn__list-item--last {
  padding-bottom: 0;
  background: none;
}
/* PC: 「1万円自由に使ってOK制度」は1行（改行はSPのみ） */
.bn__list-break { display: inline; }

/* --------------------------------------------------------------------------
   BENEFITS SP (〜767px) — XD正本 SP_375 doc y=6858..8722。
   カード縦積み(写真345x212・破線ピッチ411)、リスト2列(線w164 x15/196・文字x=+5)。
   SP正本の本文はプレースホルダ重複のためPC正本を採用（カード3は2行に減り、
   以降はXDプレースホルダ基準より約30px上がる=既知の正本起因差）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .bn { padding-bottom: 4.5675rem; } /* XD: 「他」文字箱下端8648.92 → 次見出しink上端8722 */

  /* 見出し（XD SP: グループ86019 ink x15 y6858 235.635x77.877 2行） */
  .bn__heading { margin-left: 0.9375rem; }
  .bn__heading-svg--pc { display: none; }
  .bn__heading-svg--sp { display: block; width: 14.7272rem; }

  /* 罫線（XD SP: 線833 doc6956 x15 w345 solid=SPは全幅でなくインセット） */
  .bn__rule { margin: 1.2577rem 0.9375rem 0; } /* XD: 見出しink下端6935.877 → 罫線6956 */

  /* 緑見出し（XD SP: fs20 ls100=2px baseline 7014/8336） */
  .bn__green {
    margin: 2.4625rem 0 0 0.9375rem; /* XD: 罫線下端6957 → 文字箱上端6996.4(baseline7014) */
    font-size: 1.25rem;
    letter-spacing: 0.125rem;
  }
  .bn__green--list { margin-top: 4.65rem; } /* XD: カード3破線下端8244 → 文字箱上端8318.4(baseline8336) */

  /* カード縦積み（XD SP: x15 w345 写真上端7045/7456/7867 ピッチ411） */
  .bn__cards {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 2.125rem; /* XD: 破線下端7422 → 次写真上端7456 */
    margin: 1.7875rem 0.9375rem 0; /* XD: 緑見出し箱下端7016.4 → 写真上端7045 */
  }

  /* 写真（XD SP: 7045..7257 345x212） */
  .bn-card__photo img { aspect-ratio: 345 / 212; }

  /* 題（XD SP: fs20 Bold baseline7300。lh1箱で写真下端7257から25.4） */
  .bn-card__title {
    margin-top: 1.5875rem; /* XD: 写真下端7257 → 題箱上端7282.4(baseline7300) */
    font-size: 1.25rem;
    line-height: 1.25rem;
  }

  /* 本文（XD SP: fs14 lh30 箱上端7321 → 破線7421まで3行+10） */
  .bn-card__body {
    margin-top: 0.9125rem; /* XD: 題箱下端7302.4 → 本文箱上端7317（ink照合で-4px、PC本文と同種） */
    margin-right: 0;
    margin-bottom: 0.875rem; /* XD: 本文箱下端7407 → 破線7421 */
    font-size: 0.875rem;
    line-height: 1.875rem;
  }

  /* 制度リスト2列（XD SP: 線x15/196 w164 gap17、文字x20/201、
     行baseline 8386/8445/8504 ピッチ59、破線=baseline+20） */
  .bn__list {
    grid-template-columns: repeat(2, 10.25rem);
    column-gap: 1.0625rem;
    row-gap: 1.495rem; /* XD: 破線下端8407 → 次行文字箱上端8430.92 */
    margin: 2.095rem 0.9375rem 0; /* XD: 緑見出し箱下端8338.4 → 1行目文字箱上端8371.92 */
  }
  .bn__list-item {
    padding: 0 0 1.1925rem 0.3125rem; /* 下: 文字箱下端+18.08 → 破線下端 / 左: 文字x20-線x15。
      11字項目(面談〜/持株〜=176px)は列幅164に収まらないため.bn__list-breakで文節2行化
      （右列だと375を2px超えて横スクロールになる。SP正本はプレースホルダのため準拠先なし） */
    font-size: 1rem;
  }
  /* 「他」はSPでも破線なし（メディア内の.bn__list-itemが後勝ちになるため再指定） */
  .bn__list-item--last { padding-bottom: 0; }
  /* 「お菓子食べ放題制度」（XD SP: baseline8576=行上端8548.92+13px。
     右隣「1万円〜」2行に対しXDは13px下げで置いている） */
  .bn__list-item--snack { padding-top: 0.8125rem; }
  /* リスト項目の2行目（1万円〜=XD SP実測 baseline 8563→8588 ピッチ25、
     面談〜/持株〜も同じ文節2行化。行箱16のままmargin 9pxで行送り25を再現し、
     破線=最終baseline+20の律動を保つ） */
  .bn__list-break { display: block; margin-top: 0.5625rem; }
  /* 「他」（XD SP: x201=右列。左列セルは空けて右列へ） */
  .bn__list-item--last { grid-column: 2; }
}

/* --------------------------------------------------------------------------
   09 NUMBERS（数字で知る内池建設） — XD正本: PC_1366 doc y=7462.6..8223 / SP_375 doc y=8722..10121
   構成: リードイン見出し(A-SK大蘭明朝アウトラインSVG グループ86000/86020) → 全幅罫線(線786/線845)
   → 統計カード6枚(PC 3列x2行グリッド / SP 縦積み)。
   カードはXDのグラスモーフィズム: fill白はfillOpacity0で不可視、uxdesign#blur
   (blurAmount30, brightness+5, backgroundEffect) → backdrop-filter: blur(30px) brightness(1.05)、
   白2px内側stroke → border、角丸r20。SOURCE実測カード面 #ecf0ef = 地#e1e5e4 x1.05 と一致。
   blur緑三角は正本PNG資産(tri-blur-01/02/03)をAGC実測の回転matrix+shape実寸で配置
   （PNG自体がボケ画像なのでCSS filter:blurは不使用。拡大でボケ・縮小でシャープになる
   見え方もXDと同一）。数字はDIN 2014 Bold実テキスト、単位・注記はNoto Sans JP実テキスト
   -------------------------------------------------------------------------- */
.nm {
  position: relative; /* 理由: blur三角装飾レイヤー(.nm__tris)の座標基準 */
  display: flow-root;
  overflow-x: clip; /* SP tri--a(右端402.9>375)/tri--c(左端-7.5)のXDキャンバス外はみ出しを
    アートボードと同様に横だけ切る。縦はvisibleのままなので隣接セクションへの食い込みは保つ */
  padding-bottom: 6.25rem; /* XD: カード2行目下端8123 → CTA帯上端8223 */
  background: #e1e5e4; /* アートボード地（benefits/worksと同じ） */
}

/* blur緑三角レイヤー。上端側はbenefits帯へ、下端側はnumbers-cta帯へはみ出す
   （XDの重なりをそのまま描く。ぼけ具合はPNG資産に焼き込み済み） */
.nm__tris {
  position: absolute; /* 理由: 重なり装飾レイヤー（本文フロー外の背景美術） */
  inset: 0;
  pointer-events: none;
}
.nm__tri {
  position: absolute; /* 理由: 重なり装飾（XD blur_01〜03のぼかし三角PNGをmatrix配置そのまま） */
  background-size: 100% 100%;
  transform-origin: 0 0;
}
/* 各三角 = AGC実測 shape実寸(w/h) + 回転matrix(単位行列化済み) + transform平行移動(tx/ty)。
   top はセクション上端(PC doc7462.6 / SP doc8722)基準。負topはbenefits帯への食い込み。
   XDのblur半径はPNG資産に焼き込み（blurAmount指定のCSS filterは持たない） */
.nm__tri--a { left: 72.3152rem; top: -5.0681rem; width: 4.2227rem; height: 9.0338rem; background-image: url("../assets/tri-blur-01.png"); transform: matrix(.5, -.866025, .866025, .5, 0, 0); }        /* PC[147] doc bbox 1157.04/7323 158.96x130.78 */
.nm__tri--b { left: 60.6651rem; top: 6.4206rem;  width: 9.2505rem; height: 19.7899rem; background-image: url("../assets/tri-blur-01.png"); transform: matrix(-.515038, .857167, -.857167, -.515038, 0, 0); } /* PC[11] doc bbox 623/7402.25 347.64x289.95（カード2の背後） */
.nm__tri--c { left: 11.3925rem; top: -6.022rem;  width: 3.9361rem; height: 8.4222rem; background-image: url("../assets/tri-blur-02.png"); transform: matrix(.190809, .981627, -.981627, .190809, 0, 0); }   /* PC[146] doc bbox 50/7366.25 144.3x87.53 */
.nm__tri--d { left: 71.1488rem; top: 6.1156rem;  width: 2.6165rem; height: 5.5992rem; background-image: url("../assets/tri-blur-03.png"); transform: matrix(-.819152, .573576, -.573576, -.819152, 0, 0); } /* PC[145] doc bbox 1052.7/7487.06 85.68x97.4 */
.nm__tri--e { left: 56.8693rem; top: 42.8611rem; width: 3.9361rem; height: 8.4222rem; background-image: url("../assets/tri-blur-02.png"); transform: matrix(-.707107, .707107, -.707107, -.707107, 0, 0); } /* PC[10] doc bbox 770.09/8053.09 139.82x139.82（カード5の背後） */
/* この三角だけ次セクション numbers-cta の帯へ食い込む（XD塗り順 blur_03 direct[144]
   > PC_cta direct[120]、SPも [197] > SP_cta [51] で三角が帯の手前）。z-index は不要：
   .nm も .ctab も積層文脈を作らないため、絶対配置のこの三角は帯の背景より後に塗られる。
   final-v2/TRIF-TRUTH.json で三角インク doc 8196..8239 ＝ 帯上端 8228.27 より 11px 下まで
   出ていることを実測済み */
.nm__tri--f { left: 72.3996rem; top: 43.65rem;   width: 2.6165rem; height: 5.5992rem; background-image: url("../assets/tri-blur-03.png"); transform: matrix(.587785, .809017, -.809017, .587785, 0, 0); }   /* PC[144] doc bbox 1085.92/8161 97.09x86.53（下端24.5pxはCTA帯側へ） */

/* 本文レイヤー（blur三角より手前に重ねる基準。z-index autoのままなので
   カードのbackdrop-filterは背後の三角＋地色を正しく拾う） */
.nm__inner { position: relative; }

/* リードイン見出し（XD: グループ86000 ink x=51.472 y=7462.6 w563.312 h61.056。
   A-SK大蘭明朝アウトライン → XD由来SVG+sr-only実テキスト＝benefits/worksと同方式。
   セクション上端=ink上端なのでmargin-top 0 */
.nm__heading { margin: 0 0 0 3.217rem; }
.nm__heading-svg { display: block; height: auto; }
.nm__heading-svg--pc { width: 35.207rem; }
.nm__heading-svg--sp { display: none; }

/* 全幅罫線（XD: 線786 doc7554 #212121 solid。見出しブロック下の区切り） */
.nm__rule {
  height: 0.0625rem;
  margin: 1.8965rem 0 0; /* XD: 見出しink下端7523.656 → 罫線7554 */
  border: 0;
  background: #212121;
}

/* カード3列x2行（XD: x=50/484/918 w398 gap36、行 y7604 h243 / y7882 h241 gap35。
   行stretchで同一行のカードは同高（キャプション無しのカード4/6は
   カード5の高さに揃う=XDどおり）。固定heightなし */
.nm__cards {
  display: grid;
  grid-template-columns: repeat(3, 24.875rem);
  column-gap: 2.25rem;
  row-gap: 2.1875rem;
  margin: 3.0625rem 3.125rem 0; /* XD: 罫線下端7555 → カード上端7604 */
  padding: 0;
  list-style: none;
}

/* グラスカード（XD: 白stroke2px内側・r20・fillOpacity0+背景blur30/明度+5%。
   border-boxなのでborderがXDの内側strokeと同じ食い方になる） */
.nm-card {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 1.9063rem 0.125rem 1.7563rem; /* XD: カード上端7604 → ラベル箱上端7634.5 /
    下: 最深コンテンツ(注記キャプション)下端 → カード下端（行1=7847・行2=8123 両行この一定値で一致）。
    XDの白2px内側strokeはborderでなくinset box-shadowで描く（Chromeがborder2.81pxを2pxへ
    切り捨てて1920の等比が-1.6px/枚崩れるため）。strokeぶん0.125remはpaddingへ算入 */
  box-shadow: inset 0 0 0 0.125rem #fff;
  border-radius: 1.25rem;
  backdrop-filter: blur(1.875rem) brightness(1.05);
  -webkit-backdrop-filter: blur(1.875rem) brightness(1.05);
}

/* カードラベル（XD: Noto Sans JP Bold 24 #212121 左揃え x=カード+30、baseline=カード上端+53） */
.nm-card__label {
  margin: 0 0 0 1.75rem; /* XD: 文字x80-カードx50-border2 */
  color: var(--color-ink);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.5rem;
}
/* カード2/3のみラベル・注記のインセットが38（XD: 大卒初任給x522/賞与x956=カード+38） */
.nm-card--inset38 .nm-card__label { margin-left: 2.25rem; }
.nm-card--inset38 .nm-card__cap--note { margin-left: 2.25rem; } /* ラベルと同じ+38（字下げなし。上記コメント参照） */
/* カード6「赤字決算」のみXD実測baseline7933=他カード-2px */
.nm-card__label--up2 { margin-top: -0.125rem; margin-bottom: 0.125rem; } /* 下marginで数値行baseline8042は他カードと同位置に保つ */

/* 数値行（XD: DIN 2014 Bold、行1カード1/2=fs72 baseline+162、それ以外=fs80 baseline+160。
   カード内センタリングはXD実測ink中心=カード中心（text-align:center）。
   行箱はlh=fsで固定し、単位spanはlh0+vertical-alignで行箱を伸ばさない） */
.nm-card__value {
  margin: 2.8688rem 0 0; /* XD: ラベル箱下端 → 数値行箱上端（fs72 baseline7766。ink照合で-4px補正） */
  font-family: "din-2014", "DIN 2014", "Roboto", sans-serif;
  font-size: 4.5rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 4.5rem;
  color: var(--color-green);
  text-align: center;
}
.nm-card__value--fs80 {
  margin-top: 2.3438rem; /* XD: fs80 baseline=カード上端+160（ink照合で-4px補正） */
  font-size: 5rem;
  line-height: 5rem;
}
/* 数字⇔単位の字間（XD: 各テキストはtspan x負値の右揃え配置で、
   単位アンカー(左端)-数字アンカー(右端)=10px（c1時間/c3回/c5名/c6回）、
   c2円～=5px、c4日=4px、先行単位(年/創業46年間)→数字=9px。SPは全て10px・c6のみ14px） */
.nm-card__pre { margin-right: 0.625rem; }
.nm-card__num + .nm-card__unit { margin-left: 0.625rem; }
.nm-card__unit + .nm-card__num { margin-left: 0.5625rem; }
.nm__cards li:nth-child(2) .nm-card__num + .nm-card__unit { margin-left: 0.3125rem; }
.nm__cards li:nth-child(4) .nm-card__num + .nm-card__unit { margin-left: 0.25rem; }
/* 数値行の中心オフセット（XDアンカー実測: c2=+8.5px/c5=+4.5px/c6=+3.5px カード中心より右。
   text-align:center行のmargin-leftで中心を2:1シフト） */
.nm__cards li:nth-child(2) .nm-card__value { margin-left: 1.0625rem; }
.nm__cards li:nth-child(5) .nm-card__value { margin-left: 0.5625rem; }
.nm__cards li:nth-child(6) .nm-card__value { margin-left: 0.4375rem; }

/* 単位・接頭辞（XD: Noto Sans JP Bold 24 ls50 #005a3c、baseline=数字baseline-2px） */
.nm-card__unit {
  font-family: var(--font-sans);
  font-size: 1.5rem;
  letter-spacing: 0.075rem; /* XD: ls50 = 0.05em */
  line-height: 0; /* 行箱を数字のlh(4.5/5rem)のまま保つ */
  vertical-align: 0.125rem;
}
/* 「日」のみXD実測baseline8034=数字baseline-8px（カード4。SPは-2px=通常） */
.nm-card__unit--day { vertical-align: 0.5rem; }
/* 「約」（XD: fs24 Bold、baseline=数字baseline-36px の上付き） */
.nm-card__pre {
  font-family: var(--font-sans);
  font-size: 1.5rem;
  letter-spacing: 0.075rem;
  line-height: 0;
  vertical-align: 2.25rem;
}

/* キャプション（緑=Noto Sans JP Bold 24 #005a3c センタリング baseline+211 /
   注記=Noto Sans JP Regular 14 #212121 ラベルと同じ左インセット baseline+214(行1)・+212(行2)） */
.nm-card__cap { margin: 0; }
.nm-card__cap--green {
  margin-top: 1rem; /* XD: 数値行箱下端 → 緑キャプション箱上端（baseline7815。ink照合で+4px補正） */
  color: var(--color-green);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.5rem;
  text-align: center;
}
.nm-card__cap--note {
  margin: 1.7813rem 0 0 1.75rem; /* XD: 数値行箱下端 → 注記箱上端（baseline7818、ink照合+4px） /
    左: anchorX=ラベルと同じ（AGC実測。SOURCE PNGの見かけ+15pxはfs14「※」のAA濃度が
    暗閾値を割るink欠落アーティファクトで、SVG DOM実測はanchor+0・幅182=字下げなし） */
  color: var(--color-ink);
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 0.875rem;
}
.nm-card__cap--note-r2 { margin-top: 1.6813rem; } /* XD: カード5のみbaseline8094=カード上端+212（ink照合+4px） */

/* --------------------------------------------------------------------------
   NUMBERS SP (〜767px) — XD正本 SP_375 doc y=8722..10121。
   カード縦積み(w345 x15、高さは自然高: 緑cap209/注記cap197/capなし170、gap20)、
   数字は全カードfs64 baseline+129、ラベルbaseline+43、緑cap baseline+183、注記baseline+174。
   SP正本のラベル・注記はプレースホルダ重複のためPC正本を採用（既知の正本起因差）
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .nm { padding-bottom: 4.375rem; } /* XD: カード6下端10051 → SP_cta上端10121 */

  /* blur三角 SP配置（AGC SP実測。回転matrixはPCと同一、実寸・位置のみ差し替え） */
  .nm__tri--a { left: 20.8184rem; top: -6.6498rem; width: 1.8477rem; height: 3.9713rem; } /* SP[170] doc bbox 333.1/8590 69.81x57.37 */
  .nm__tri--b { left: 16.2988rem; top: 4.5272rem;  width: 4.1255rem; height: 8.7899rem; } /* SP[3] doc bbox 106.23/8722 154.55x129.01 */
  .nm__tri--c { left: 2.6837rem;  top: -3.3876rem; width: 1.5019rem; height: 3.213rem; }  /* SP[171] doc bbox -7.52/8667.8 55.05x33.4 */
  .nm__tri--d { left: 20.0794rem; top: -1.1904rem; width: 1.2415rem; height: 2.6617rem; } /* SP[169] doc bbox 280.57/8668.07 40.7x46.28 */
  .nm__tri--e { left: 12.9588rem; top: 84.2513rem; width: 2.0611rem; height: 4.3597rem; } /* SP[2] doc bbox 134.7/10020.7 72.64x72.64 */
  .nm__tri--f { left: 22.2003rem; top: 85.3884rem; width: 1.3934rem; height: 3.0624rem; } /* SP[197] doc bbox 315.56/10088.22 52.75x46.84（下端14pxはSP_cta側へ） */

  /* 見出し（XD SP: グループ86020 ink x15 y8722 306.271x33.196 1行） */
  .nm__heading { margin-left: 0.9375rem; }
  .nm__heading-svg--pc { display: none; }
  .nm__heading-svg--sp { display: block; width: 19.1419rem; }

  /* 罫線（XD SP: 線845 doc8776 x15 w345 solid=SPは全幅でなくインセット） */
  .nm__rule { margin: 1.3rem 0.9375rem 0; } /* XD: 見出しink下端8755.196 → 罫線8776 */

  /* カード縦積み（XD SP: x15 w345 上端8811/9040/9257/9474/9664/9881 gap20） */
  .nm__cards {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 1.25rem;
    margin: 2.125rem 0.9375rem 0; /* XD: 罫線下端8777 → カード1上端8811 */
  }

  /* カード（XD SP: ラベルbaseline+43。下パディングはキャプション種別ごと=自然高が
     XDの209/197/170になる） */
  .nm-card { padding: 1.5125rem 0.125rem 2.0375rem; } /* pb: capなしカード=自然高170（stroke0.125rem込み） */
  .nm-card:has(.nm-card__cap--green) { padding-bottom: 1.5125rem; } /* 自然高209 */
  .nm-card:has(.nm-card__cap--note) { padding-bottom: 1.5125rem; }  /* 自然高197 */

  /* ラベル（XD SP: fs20 Bold x=カード+20） */
  .nm-card__label { margin-left: 1.125rem; font-size: 1.25rem; line-height: 1.25rem; }
  /* SPはインセット差・ラベル-2pxの個体差なし（プレースホルダ正本のため位置律動はカード共通） */
  .nm-card--inset38 .nm-card__label,
  .nm-card--inset38 .nm-card__cap--note { margin-left: 1.125rem; }
  .nm-card__label--up2 { margin-top: 0; margin-bottom: 0; } /* PCの-2px個体差はSPに無い(下margin残しは高さ+2px事故) */

  /* 数値行（XD SP: 全カードfs64 baseline=カード上端+129） */
  .nm-card__value,
  .nm-card__value--fs80 {
    margin-top: 1.825rem; /* XD: fs64 baseline=カード上端+129（ink照合で-6px補正） */
    font-size: 4rem;
    line-height: 4rem;
  }
  /* 単位（XD SP: fs20 ls50、baseline-2px。「日」もSPは-2px） */
  .nm-card__unit { font-size: 1.25rem; letter-spacing: 0.0625rem; }
  .nm-card__unit--day { vertical-align: 0.125rem; }
  .nm-card__pre { font-size: 1.25rem; letter-spacing: 0.0625rem; }

  /* キャプション（XD SP: 緑fs20 baseline+183 / 注記fs12 baseline+174 x=カード+20） */
  .nm-card__cap--green { margin-top: 1.7125rem; font-size: 1.25rem; line-height: 1.25rem; } /* XD: baseline+183（ink照合+15px） */
  .nm-card__cap--note { margin: 1.4563rem 0 0 1.125rem; font-size: 0.75rem; line-height: 0.75rem; } /* XD: 注記ink上端=カード+164（SPは字下げなし） */
  .nm-card__cap--note-r2 { margin-top: 1.4563rem; }
  /* 数字⇔単位ギャップ（XD SP tspan実測: 全カード10px、創業46年間→0のみ14px。中心オフセットはSPなし） */
  .nm__cards li:nth-child(2) .nm-card__num + .nm-card__unit { margin-left: 0.625rem; }
  .nm__cards li:nth-child(4) .nm-card__num + .nm-card__unit { margin-left: 0.625rem; }
  .nm__cards li:nth-child(6) .nm-card__unit + .nm-card__num { margin-left: 0.875rem; }
  .nm__cards li:nth-child(2) .nm-card__value { margin-left: 0; }
  .nm__cards li:nth-child(5) .nm-card__value { margin-left: 0; }
  .nm__cards li:nth-child(6) .nm-card__value { margin-left: 0; }
}

/* ==========================================================================
   10 NUMBERS CTA（数字で知る／セクションCTA） — XD正本:
   PC_1366 doc y=8223..8690.768（高467.768）/ SP_375 doc y=10121..10566（高445）。
   下端は次セクション voices のリードイン見出し（PC グループ85945 ink上端 8690.768 /
   SP グループ86026 ink上端 10566）＝benefits→numbers と同じ lead-in パターン。
   境界線 線787(doc8783) / 線846(doc10663) も voices の所有物。
   帯は共通コンポーネント .ctab（セクション04と同一シンボルの2つ目のインスタンス）。
   本セクション固有の指定は帯下の余白だけ。
   absolute・擬似要素・固定高さは一切なし
   ========================================================================== */
.nc {
  /* XD PC: 帯の実体は 長方形20235 = 1366x333（experience-cta/SOURCE-SPEC.json layers[0]）で
     下端は doc8556。シンボル箱の334はマスクグループ4（装飾）の外形であって帯ではない。
     8556 → voices見出しink上端 doc8690.768 = 134.768px。
     旧値 133.768rem相当は帯下端を8557と取っていたため、セクション10だけ通しで1px短かった
     （final-v2/C-MEASURE.json: 帯上端→voicesインク上端 466.75 / XD 467.768） */
  padding-bottom: 8.423rem;
  /* アートボード地（benefits/works/numbersと同じ #e1e5e4。body の --color-bg #e5e9e9 とは別物）。
     XDレンダー実測: PC verify/numbers-cta/SOURCE.png doc8568..8782 と
     SP SOURCE-10-numbers-cta.png doc10321..10565 がいずれも 225,229,228 = #e1e5e4 */
  background: #e1e5e4;
}

@media (max-width: 767px) {
  /* XD SP: 帯下端 doc10496 → voices見出しink上端 doc10566 = 70px */
  .nc { padding-bottom: 4.375rem; }
}

/* ==========================================================================
   11 VOICES（先輩社員のビフォーアフター） — XD正本:
   PC_1366 doc y=8690.768..9673（高982.232）/ SP_375 doc y=10566..12009（高1443）。
   上端は本セクションのリードイン見出し（PC グループ85945 ink上端 8690.768 /
   SP グループ86026 ink上端 10566）＝benefits→numbers→numbers-cta と同じ lead-in パターン。
   下端は次セクション events の全幅背景 長方形48230(PC doc9673) / 長方形48281(SP doc12009) 上端。
   本セクションが所有: リードイン見出し・罫線(PC 線787 / SP 線846)・証言カード2枚。
   （PC 線788 doc9879 は events の背景の上に乗る events 側の罫線なので描かない）
   カード2 = カード1 の PC +385px / SP +638px 平行移動（AGC実測で全要素一致）。
   地はアートボード地 #e1e5e4、緑は #005a3c、本文は #212121。文字はすべて実テキスト
   （A-SK大蘭明朝の見出しのみXD由来アウトラインSVG）。固定高さは写真のクロップ枠のみ
   ========================================================================== */
.vo {
  display: flow-root;
  padding-bottom: 7.5rem; /* XD PC: カード2下端(写真下端) doc9553 → events背景上端 doc9673 = 120px */
  background: #e1e5e4; /* アートボード地（benefits/works/numbers/numbers-cta と同じ） */
}

/* リードイン見出し（XD: PC グループ85945 ink 50/8690.768 817.696x61.312 /
   SP グループ86026 ink 15/10566 270.792x77.462（2行）。
   A-SK大蘭明朝アウトライン → XD由来SVG+sr-only実テキスト＝numbers/benefits と同方式。
   セクション上端=ink上端なので margin-top 0 */
.vo__heading { margin: 0 0 0 3.125rem; }
.vo__heading-svg { display: block; height: auto; }
.vo__heading-svg--pc { width: 51.106rem; }
.vo__heading-svg--sp { display: none; }

/* 全幅罫線（XD: PC 線787 doc8783 x0 w1366 #212121 solid 1px） */
.vo__rule {
  height: 0.0625rem;
  margin: 1.9325rem 0 0; /* XD: 見出しink下端8752.08 → 罫線8783 = 30.92px */
  border: 0;
  background: #212121;
}

/* 証言カード2枚（XD: PC 写真上端 8833 / 9218、行間50px） */
.vo__list {
  display: grid;
  row-gap: 3.125rem; /* XD: カード1下端(写真下端)9168 → カード2上端9218 = 50px */
  margin: 3.0625rem 3.125rem 0; /* XD: 罫線下端8784 → カード1上端8833 = 49px、左右50px */
  padding: 0;
  list-style: none;
}

/* 1枚のカード = 写真列(305) + 本文列(911)、間隔50。固定高さなし＝本文が増えれば伸びる */
.vc {
  display: grid;
  grid-template-columns: 19.0625rem 56.9375rem;
  column-gap: 3.125rem;
  align-items: start;
}

.vc__photo { margin: 0; }
.vc__photo img {
  display: block;
  width: 100%;
  height: 20.9375rem; /* XD PC: 写真枠 305x335。素材(360x240)のクロップ枠のため寸法固定 */
  object-fit: cover;
  object-position: 40.547% 50%; /* XD pattern scaleBehavior:cover + offsetX 0.0612（frame幅比）
    → 描画画像502.5x335・横あふれ197.5px のうち左80.08px = 40.547%。中央coverではない */
}

/* 本文列。XDのテキストはベースライン基準なので、行送りと上マージンは
   Noto Sans JP の実メトリクス（ascent1.16em / descent0.288em）から逆算した値 */
.vc__body { margin-top: 0.181rem; } /* XD: 写真上端8833 → 話者名の行ボックス上端8835.896 */

.vc__speaker {
  margin: 0;
  font-size: 0.875rem; /* XD 14px NotoSansJP-Bold #005a3c */
  font-weight: 700;
  line-height: 1;
  color: #005a3c;
}

.vc__before {
  margin: 0.8525rem 0 0; /* XD: 話者名baseline8849 → 見出しbaseline8886 */
  font-size: 1.5rem; /* XD 24px NotoSansJP-Bold #212121 */
  font-weight: 700;
  line-height: 1;
  color: #212121;
}
.vc__br-sp { display: none; } /* PCは1行（XD PC: 単一行のpositionedテキスト） */

.vc__text {
  margin: 1.5618rem 0 0; /* XD: 見出しbaseline8886 → 本文1行目baseline8937 */
  font-size: 1rem; /* XD 16px NotoSansJP-Regular #212121 / lineHeight35 / frame幅911で自動折返し2行 */
  line-height: 2.1875rem;
  color: #212121;
}

/* 白枠のコールアウト（XD: 長方形48229 白fill + #212121 1px inside stroke。
   strokeはborderでなくinset box-shadowで描く＝レイアウト寸法に影響させないため。
   固定高さなし＝中身が増えれば伸びる） */
.vc__callout {
  position: relative; /* 理由: 四隅の黒角(.vc__corner)の座標基準 */
  margin: 2.15475rem 0.3125rem 0; /* XD: 本文2行目baseline8972 → 枠上端9017。枠は本文列(x405 w911)から左右5px内寄せ＝x410 w901 */
  padding: 2.1425rem 2rem 1.52975rem; /* XD: 枠上端9017 → 見出しbaseline9070 / 本文baseline9110 → 枠下端9145、左右32px(x442) */
  background: #fff;
  box-shadow: inset 0 0 0 0.0625rem #212121;
}

/* 四隅の黒角（XD: 長方形48225〜48228 10x10 #212121、枠の角を中心に配置＝-5px） */
.vc__corner {
  position: absolute; /* 理由: 枠線に重ねる装飾（フローに影響させない） */
  width: 0.625rem;
  height: 0.625rem;
  background: #212121;
}
.vc__corner--tl { top: -0.3125rem; left: -0.3125rem; }
.vc__corner--tr { top: -0.3125rem; right: -0.3125rem; }
.vc__corner--bl { bottom: -0.3125rem; left: -0.3125rem; }
.vc__corner--br { bottom: -0.3125rem; right: -0.3125rem; }

.vc__callout-title {
  margin: 0;
  font-size: 1.25rem; /* XD 20px NotoSansJP-Bold #005a3c */
  font-weight: 700;
  line-height: 1;
  color: #005a3c;
}
.vc__callout-text {
  margin: 0.89025rem 0 0; /* XD: 見出しbaseline9070 → 本文baseline9110 */
  font-size: 1rem; /* XD 16px NotoSansJP-Regular #212121 / lineHeight35 */
  line-height: 2.1875rem;
  color: #212121;
}

@media (max-width: 767px) {
  /* XD SP: カード2の枠下端 doc11934 → events背景上端 doc12009 = 75px
     （四隅の黒角は枠外へ5pxはみ出す装飾なので、XDの見た目上の余白は70px） */
  .vo { padding-bottom: 4.6875rem; }

  .vo__heading { margin-left: 0.9375rem; }
  .vo__heading-svg--pc { display: none; }
  .vo__heading-svg--sp { display: block; width: 16.9245rem; }

  /* XD SP: 線846 doc10663 x15 w345（全幅ではなく左右15pxの内寄せ） */
  .vo__rule { margin: 1.2211rem 0.9375rem 0; } /* 見出しink下端10643.462 → 罫線10663 */

  .vo__list {
    row-gap: 2.5rem; /* XD: カード1枠下端11296 → カード2写真上端11336 = 40px */
    margin: 2.125rem 0.9375rem 0; /* XD: 罫線下端10664 → 写真上端10698 = 34px */
  }

  /* SPは写真の下に本文が積む単列 */
  .vc {
    grid-template-columns: 1fr;
    column-gap: 0;
  }
  .vc__photo img { height: 12.5rem; object-position: 50% 50%; } /* XD SP: 写真枠345x200・offset指定なし＝中央cover */
  /* 支給写真「T様」はPC用610x670のcoverだと胸元まで入らないため、SPでは <picture> で
     素材全幅から345:200に切り出した voices-photo-t-sp.jpg（1035x600・枠と同比率）に差し替え。
     比率一致なので object-position は中央のまま */
  .vc__photo--t img { object-position: 50% 50%; }

  .vc__body { margin-top: 1.431rem; } /* XD: 写真下端10898 → 話者名の行ボックス上端10920.896 */

  .vc__before {
    margin-top: 0.4615rem; /* XD: 話者名baseline10934 → 見出し1行目baseline10966 */
    font-size: 1.25rem; /* XD 20px / lineHeight30 / 2行 */
    line-height: 1.875rem;
  }
  .vc__br-sp { display: inline; } /* XD SPは2行。文節境界で折る */

  .vc__text {
    margin-top: 1.226rem; /* XD: 見出し2行目baseline10996 → 本文1行目baseline11043 */
    font-size: 0.875rem; /* XD 14px / lineHeight30 / frame幅345で自動折返し4行 */
    line-height: 1.875rem;
  }

  .vc__callout {
    margin: 1.569rem 0.3125rem 0; /* XD: 本文4行目baseline11133 → 枠上端11167。枠は左右5px内寄せ(x20 w335) */
    padding: 1.5015rem 0.9375rem 0.944rem; /* XD: 枠上端11167 → 見出しbaseline11206 / 本文2行目baseline11272 → 枠下端11296 */
  }
  .vc__callout-title { font-size: 1rem; } /* XD 16px */
  .vc__callout-text {
    margin-top: 0.867rem; /* XD: 見出しbaseline11206 → 本文1行目baseline11242 */
    font-size: 0.875rem; /* XD 14px / lineHeight30 / frame幅305で2行 */
    line-height: 1.875rem;
  }
}

/* ==========================================================================
   12 EVENTS（仕事体験・会社説明会） — XD正本:
   PC_1366 doc y=9673..10607.64（高934.64）/ SP_375 doc y=12009..13688.984（高1679.984）。
   ★ lead-in パターンではない。上端＝全幅の緑背景 長方形48230(PC doc9673) /
   長方形48281(SP doc12009) の上端。下端＝次セクション13 requirements の
   リードイン見出し パス342790(PC ink 10607.64) / パス342859(SP ink 13688.984) の ink 上端。
   緑背景 #5a927f 自体は requirements と共有するので、ここではセクション要素に
   background を明示する（body の --color-bg は使わない）。
   本セクションが所有: 見出し・白罫線(PC 線788 / SP 線847)・イベントカード。
   ★ カード1「夏の1DAY仕事体験」/ カード2「秋の現場まるわかり体験」は XD の制作メモ
   direct[248]/[249]「公開時は非表示で実装」に従い出力しない（2026-09-04 ろく指示で削除。
   マークアップは commit 810cb90a 時点の index.html に残っている）。
   出力するのはカード3「オンライン会社説明会」のみ。grid は3列のまま＝カード幅398pxを保持。
   固定 height はゼロ（サムネイルは aspect-ratio、タグは padding、カードは中身で伸びる）。
   ========================================================================== */
.ev {
  display: flow-root;
  padding-top: 7.1185rem; /* XD PC: 背景上端9673 → 見出しink上端9786.896 = 113.896px */
  padding-bottom: 8.3525rem; /* XD PC: カード下端10474 → 次セクション見出しink上端10607.64 = 133.64px */
  background: #5a927f; /* XD 長方形48230/48281 の全面ベタ。地色をセクション側で明示 */
}

/* リードイン見出し（XD: PC パス342791 ink 50.768/9786.896 638.464x62.016 /
   SP パス342858 ink 15/12058.984 345x34.572）。
   A-SK大蘭明朝アウトライン → XD由来SVG＋sr-only実テキスト＝他セクションと同方式。
   viewBox は Chromium の getBBox() 実測値（doc座標ではない） */
.ev__heading { margin: 0 0 0 3.173rem; }
.ev__heading-svg { display: block; height: auto; }
.ev__heading-svg--pc { width: 39.904rem; }
.ev__heading-svg--sp { display: none; }

/* 見出し下の白罫線（XD: PC 線788 doc9879 x0 w1366 全幅 #ffffff 1px） */
.ev__rule {
  height: 0.0625rem;
  margin-top: 1.8805rem; /* XD PC: 見出しink下端9848.912 → 罫線9879 = 30.088px */
  background: #ffffff;
}

/* カード（XD: PC x50/484/918 幅398・ピッチ434 / SP 1列 幅345・行間35）。
   カード1/2は「公開時は非表示」で出力しないが、3列grid は維持して残る1枚の幅を XD の398px に保つ */
.ev__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 2.25rem; /* XD PC: カード右端448 → 次カード左端484 = 36px */
  margin: 3.0625rem 3.125rem 0; /* XD PC: 罫線下端9880 → カード上端9929 = 49px、左右50px */
  padding: 0;
  list-style: none;
}

/* 1枚のカード。XD は fillOpacity 0 ＋ backdrop blur30/brightness+5 ＋ 白2px inside stroke。
   枠線は border ではなく inset box-shadow（1920幅で Chrome が小数pxを切り捨てないため） */
.ev-card {
  position: relative; /* 枠線オーバーレイ(::after)の座標基準のみ。矢印マーカーの基準は .ev-card__head で変わらない */
  display: flow-root;
  min-width: 0; /* grid item の auto 最小幅（日時1行の min-content）で列が広がらないようにする */
  border-radius: 1.25rem; /* XD r20（内側のサムネイルは上2隅のみ r20） */
  backdrop-filter: blur(1.875rem) brightness(1.05); /* XD uxdesign#blur blurAmount30 / brightnessAmount5 / fillOpacity0 */
}

/* 白2px inside stroke を子要素より前面に描く重なり装飾。
   .ev-card 自身の inset box-shadow だと子（サムネイル画像）がその上に描かれ、
   サムネイル部分の枠線が消える。XD正本は stroke をサムネイルの上に描いているため
   オーバーレイにして一致させる。レイアウト寸法には影響しない（inset:0 / pointer-events:none） */
.ev-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 0.125rem #ffffff; /* XD: 白 2px inside stroke */
  pointer-events: none;
}

/* サムネイル枠。固定heightではなく XD の枠比で aspect-ratio 指定 */
.ev-card__thumb {
  overflow: hidden;
  aspect-ratio: 398 / 225; /* XD PC: 398x225 */
  border-radius: 1.25rem 1.25rem 0 0; /* XD r[20,20,0,0] */
  background: #d1d1d1; /* XD 長方形48237/48238: 画像未入稿のフラット placeholder */
}
.ev-card__thumb-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; /* XD pattern scaleBehavior cover、offset指定なし＝中央 */
}

.ev-card__body { padding: 1.5625rem 1.5625rem 1.875rem; } /* XD PC: 左右25px。下は本文CSS箱下端10444 → カード下端10474 = 30px */

/* 開催地タグ（XD: PC 長方形48231/48232 51x25・48233 101x25 #005a3c、ラベル Bold14 ls2.8）。
   XD の幅は手描きの固定値だが、ここは文字数×(fs+ls)＋padding で決まる可変幅にした。
   XD値 51/101 に対し実測 50.8/101.2。XD の 51/101 は手描きで 1文字あたり 0.4px
   食い違うため単一の padding では両立せず、右padding 7.2px で誤差を ±0.2px に等分した */
.ev-card__tag {
  display: block;
  width: fit-content; /* 文字数ぶんに収縮。inline-block だと親の strut に基線を揃えられて箱が下へずれる */
  margin: 0;
  padding: 0.31319rem 0.4507rem 0.37431rem 0.625rem; /* XD: 箱10179..10204(h25) / ラベルbaseline 10197 / 左10px。上下は baseline 実測から逆算(5.011/5.989) */
  background: #005a3c;
  color: #ffffff;
  font-size: 0.875rem; /* XD 14px NotoSansJP-Bold */
  font-weight: 700;
  letter-spacing: 0.175rem; /* XD letterSpacing 200/1000em × 14px */
  line-height: 1;
}

/* タイトル行。矢印マーカーの重なり基準にするだけで、レイアウトは通常フロー */
.ev-card__head {
  display: flow-root; /* 子タイトルの負マージン(card3の1px差)が親へ collapse しないように BFC 化 */
  position: relative;
  margin-top: 1.62725rem; /* XD PC: タグ箱下端10204 → タイトル baseline 10252 から逆算 26.036px */
}
.ev-card__title {
  margin: 0;
  color: #ffffff;
  font-size: 1.5rem; /* XD 24px NotoSansJP-Bold */
  font-weight: 700;
  letter-spacing: 0.075rem; /* XD letterSpacing 50/1000em × 24px */
  line-height: 1;
}

/* 矢印マーカー = タイトル行に重なる装飾（XD でもタイトル文字の右に食い込む）。
   position:absolute はこの重なり装飾のためだけに使用し、基準はタイトル行（XD座標の写しではない） */
.ev-card__marker {
  position: absolute;
  right: 0;
  bottom: -0.5rem; /* XD PC: 円 bbox 上端10217(45x45) をタイトルCSS箱下端から逆算 = 8px */
  display: block;
}
.ev-card__marker-svg { display: block; width: 2.8125rem; height: 2.8125rem; } /* XD PC: 楕円形661 r22.5 = 45x45 */
.ev-card__marker-svg--sp { display: none; }

/* カード内の白罫線（XD: PC 線60/789/790 348px 2px / SP 線790 305px 2px） */
.ev-card__rule {
  height: 0.125rem;
  margin-top: 1.31219rem; /* XD PC: タイトルCSS箱下端 → 罫線10275 = 20.995px */
  background: #ffffff;
}

/* 日時行（XD: ラベル Bold20 x75 / 値 Regular20 x141、同一baseline 10323） */
.ev-card__meta {
  display: flex;
  gap: 1.5rem; /* XD PC: ラベル送り幅42（2文字×(20+1)）→ 値の左端141 まで 24px */
  margin: 1.75rem 0 0; /* XD PC: 罫線下端10277 → 日時baseline 10323 から逆算した箱上端10305 = 28px */
  color: #ffffff;
  font-size: 1.25rem; /* XD 20px */
  letter-spacing: 0.0625rem; /* XD letterSpacing 50/1000em × 20px */
  line-height: 1;
}
/* XD はラベル・値とも1行。日時の文字列は幅348のカード内幅にぎりぎり収まる長さなので、
   flex の既定 shrink に任せると折り返して2行になる → 収縮も改行も禁止する */
.ev-card__meta-label { flex: none; white-space: nowrap; font-weight: 700; } /* XD NotoSansJP-Bold */
.ev-card__meta-value { flex: none; white-space: nowrap; margin: 0 -0.0625rem 0 0; font-weight: 400; } /* XD NotoSansJP-Regular。右マージンで末尾 letter-spacing 1px を相殺（XDのink幅と揃える） */

/* 日時の注記（2026-09-15 先方指示「※ご希望に応じ調整可能です。」）。XD に無い要素。
   20pxの値の続きだと幅348で語中折れするため、本文と同じ 14px/Regular で日時行の直下に1行で出す */
.ev-card__note {
  margin: 0.75rem 0 0;
  color: #ffffff;
  font-size: 0.875rem;
  line-height: 1.5;
  letter-spacing: 0.04375rem; /* 50/1000em × 14px */
}

/* 本文（XD: Regular14 / lineHeight30 / opacity .8 / autoHeight 幅348 で3行に自動折返し） */
.ev-card__text {
  margin: 1.8125rem 0 0; /* XD PC: 日時CSS箱下端10325 → 本文1行目baseline 10375 から逆算した箱上端10354 = 29px */
  color: #ffffff;
  font-size: 0.875rem; /* XD 14px NotoSansJP-Regular */
  line-height: 1.875rem; /* XD lineHeight 30px */
  opacity: 0.8; /* XD opacity 0.8 */
  /* SP で XD より1文字多く1行目に載り、行頭に小書き仮名「ャ」が来ていた（禁則違反）。
     Blink の既定 line-break:auto は小書き仮名の前での改行を許すが、XD は許さない。
     strict にすると SP の3行が XD SP 正本と1文字単位で一致する
     （events-v2/SP-WRAP-CHECK.json）。PC は元から一致していて strict でも変わらない */
  line-break: strict;
}

/* card3 のみ XD のタイトル baseline が 10251（他は 10252）。XD側の1px差をそのまま再現 */
@media (min-width: 768px) {
  /* タイトル箱だけを1px上げる。上下マージンの和を0にしてあるので head の高さも
     矢印マーカー・罫線・日時・本文の位置も動かない（XD でもズレているのは字面だけ） */
  .ev-card--online .ev-card__title { margin-top: -0.0625rem; margin-bottom: 0.0625rem; }
}

@media (max-width: 767px) {
  .ev {
    padding-top: 3.124rem; /* XD SP: 背景上端12009 → 見出しink上端12058.984 = 49.984px */
    padding-bottom: 4.374rem; /* XD SP: カード下端13619 → 次セクション見出しink上端13688.984 = 69.984px */
  }

  .ev__heading { margin-left: 0.9375rem; } /* XD SP: ink左端15px */
  .ev__heading-svg--pc { display: none; }
  .ev__heading-svg--sp { display: block; width: 21.5625rem; } /* XD SP: ink幅345px */

  .ev__rule {
    margin: 1.27775rem 0.9375rem 0; /* XD SP: 見出しink下端12093.556 → 罫線12114 = 20.444px、左右15px */
  }

  .ev__list {
    grid-template-columns: 1fr;
    row-gap: 2.1875rem; /* XD SP: カード1下端12605 → カード2上端12640 = 35px */
    margin: 2.125rem 0.9375rem 0; /* XD SP: 罫線下端12115 → カード上端12149 = 34px、左右15px */
  }

  .ev-card__thumb { aspect-ratio: 345 / 195; } /* XD SP: 345x195 */

  .ev-card__body { padding: 1.25rem 1.25rem 1.875rem; } /* XD SP: 左右20px。下は本文CSS箱下端12575 → カード下端12605 = 30px */

  .ev-card__tag {
    padding: 0.2521rem 0.1875rem 0.2479rem 0.3125rem; /* XD SP: 箱12364..12384(80x20) / ラベルbaseline12379 / 左5px・右3px。上下は baseline 実測から逆算 */
    font-size: 0.75rem; /* XD 12px */
    letter-spacing: 0.15rem; /* XD 200/1000em × 12px */
  }

  .ev-card__head { margin-top: 0.94031rem; } /* XD SP: タグ箱下端12384 → タイトル baseline 12417 から逆算 15.045px */
  .ev-card__title { font-size: 1.25rem; letter-spacing: 0.0625rem; } /* XD SP 20px / ls 50/1000em×20 */

  .ev-card__marker {
    right: -0.0625rem; /* XD SP: 円の右端341 は本文右端340 を1px超える */
    bottom: -0.4365rem; /* XD SP: 円 bbox 上端12391(35x35) をタイトルCSS箱下端から逆算 = 6.984px */
  }
  .ev-card__marker-svg--pc { display: none; }
  .ev-card__marker-svg--sp { display: block; width: 2.1875rem; height: 2.1875rem; } /* XD SP: 楕円形740 r17.5 = 35x35 */

  .ev-card__rule { margin-top: 1.06163rem; } /* XD SP: タイトルCSS箱下端 → 罫線12436 = 16.986px */

  .ev-card__meta {
    gap: 1.2125rem; /* XD SP: ラベル送り幅33.6 → 値の左端88（本文左35から53）まで 19.4px */
    margin-top: 1.0625rem; /* XD SP: 罫線下端12438 → 日時baseline12470 から逆算した箱上端12455 = 17px */
    font-size: 1rem; /* XD 16px */
    letter-spacing: 0.05rem; /* XD 50/1000em × 16px */
  }

  .ev-card__note { margin-top: 0.625rem; } /* 文字サイズは本文(SP)と同じ14pxのまま */

  .ev-card__text { margin-top: 0.875rem; } /* XD SP: 日時CSS箱下端12471 → 本文1行目baseline12506 から逆算した箱上端12485 = 14px */
}

/* ==========================================================================
   13 REQUIREMENTS（募集要項） — XD正本:
   PC_1366 doc y=10607.64..11811.64（高1204）/ SP_375 doc y=13688.984..15084.984（高1396）。
   上端＝自分のリードイン見出し パス342790(PC ink 10607.64) / パス342859(SP ink 13688.984)。
   下端＝次セクション14 faq のリードイン見出し パス342832(PC ink 11811.64) /
   パス342860(SP ink 15084.984) の ink 上端。
   ★ events と共有する緑背景 長方形48230(PC) / 長方形48281(SP) は本セクションの
   「内側」PC 11691 / SP 15015 で終わる。残り PC120.64px / SP69.984px は
   アートボード地色 #e1e5e4。よって .rq が地色、子の .rq__band が緑を持つ。
   本セクションが所有: 見出し・白罫線(PC 線791 ※SPには無い)・タブ(パス332582 +
   長方形20205 + グループ85728)・募集要項テーブル(グループ31624)・
   LINE CTA(長方形48261 + グループ63321 + 長方形48271 + テキスト2本)。
   ★ SPアートボードの表(グループ35042)は別会社「株式会社TONMANA」の会社概要が
   そのまま残ったプレースホルダ。PC正本の7行を採用し、行の寸法だけSP実測を使う。
   固定 height はゼロ（タブ・行・ボタンいずれも padding + line-height で中身が決める）。
   ★ baseline配置の定数 B(font,line-height)＝行box上端からbaselineまでの距離は
     Blinkが ascent/descent/half-leading を整数丸めするため計算式では出ない。
     本セクションは Chromium 実測値で padding を逆算している:
       B(16,35)=24 / B(20,35)=26 / B(14,35)=23 / B(12,20)=15 / B(16,24)=19 /
       B(14,30)=21 / B(16,39)=26（いずれも Noto Sans JP、残差 ≤0.021px）。
   ========================================================================== */
.rq {
  display: flow-root;
  padding-bottom: 7.54rem; /* XD PC: 緑下端11691 → セクション下端11811.64 = 120.64px */
  background: #e1e5e4; /* XD アートボード地色（body の #e5e9e9 とは別物） */
}

/* 緑帯。上端は events から continuous、下端は XD 11691 で切れる */
.rq__band {
  display: flow-root;
  padding-bottom: 6.25rem; /* XD PC: ボタン下端11591 → 緑下端11691 = 100px */
  background: var(--color-green-soft); /* XD 長方形48230 #5a927f の続き */
}

/* リードイン見出し（XD: PC パス342790 ink 51.28/10607.64 252.416x61.312 /
   SP パス342859 ink 15/13688.983 142.33x34.572）。
   A-SK大蘭明朝アウトライン → XD由来SVG＋sr-only実テキスト＝他セクションと同方式。
   viewBox は Chromium の getBBox() 実測値（doc座標ではない） */
.rq__heading { margin: 0 0 0 3.205rem; }
.rq__heading-svg { display: block; height: auto; }
.rq__heading-svg--pc { width: 15.776rem; }
.rq__heading-svg--sp { display: none; }

/* 見出し下の白罫線（XD: PC 線791 doc10700 x0 w1366 全幅 #ffffff 1px）。
   ★ SPアートボードには対応する罫線が無い（白罫線は events の12114 と後続16007のみ）
   → SP では非表示。events-v2 と同じく「線ノードのy＝1px箱の上端」で置く */
.rq__rule {
  height: 0.0625rem;
  margin-top: 1.9405rem; /* XD PC: 見出しink下端10668.952 → 罫線10700 = 31.048px */
  background: #ffffff;
}

/* 内側カラム（XD PC: x50..1316 幅1266 / SP: x15..360 幅345） */
.rq__inner {
  display: flow-root;
  margin: 3.015625rem 3.125rem 0; /* XD PC: 罫線下端10701 → タブ箱上端10749.25 = 48.25px */
}

/* --- タブ（道内・仙台／埼玉） ------------------------------------------------
   XD パス332582 は fill:none・stroke #ffffff 1.5px の「∩＋右下辺」1本パス:
   M(x50,y10810.2) → 上へ(y10750.2) → 右へ(x320) → 下へ(y10810.2) → 右へ(x1316)。
   = アクティブタブの左/上/右だけ線があり、タブ下辺は非アクティブ側だけ引かれる。
   これを「コンテナの inset 下線」＋「アクティブタブの不透明な緑背景で下線を隠す」
   ＋「アクティブタブの inset 上/左/右」で再現する（position:absolute 不使用）。
   ★ XDのストロークは中央揃え(±0.75px)。inset box-shadow は箱の内側に描かれるので、
     箱を上下左右へ0.75pxずつ広げて（doc y10749.25..10810.75 / x49.25..1316.75）
     線の実インクをXDと完全一致させている。 */
.rq__tabs {
  display: flex;
  margin: 0 -0.046875rem; /* ストローク中央揃え分 0.75px を左右に張り出す */
  padding: 0;
  list-style: none;
  box-shadow: inset 0 -0.09375rem 0 #ffffff; /* XD stroke 1.5px のタブ下辺 */
}

/* タブ箱。XD タブ1 = x50..320 / タブ2 = グループ85728 x335..605 でどちらも 270px。
   ストローク中央揃え分1.5pxを足した 271.5px が箱の実寸 */
.rq__tab {
  width: 16.96875rem;
  line-height: 2.1875rem; /* XD lineHeight 35 */
  font-size: 1.25rem; /* XD 20px */
  font-weight: 700; /* XD NotoSansJP-Bold */
  color: #ffffff;
}

.rq__tab--hokkaido {
  padding-left: 5.359375rem; /* XD: 「道内・仙台」ink左端135 − 箱左端49.25 = 85.75px */
}

.rq__tab--saitama {
  margin-left: 0.84375rem; /* XD: タブ1右端320 → タブ2左端335 の15px − ストローク1.5px = 13.5px */
  margin-right: auto; /* 残りの余白はタブ列の右へ逃がす（下線はコンテナが全幅で持つ） */
  padding-left: 7.484375rem; /* XD: 「埼玉」ink左端454 − 箱左端334.25 = 119.75px */
}

/* ラベルの箱を文字幅ちょうどに縮めておく（黄インジケータをインク中心に置くため）。
   縦の padding はここが持ち、タブ箱の高さ 61.5px はラベルの高さで決まる */
.rq__tab-label {
  position: relative; /* ::after の黄色インジケータ（重なり装飾）の座標基準 */
  display: block;
  width: fit-content;
  padding: 0.859375rem 0 0.796875rem; /* XD: 箱上端10749.25 → baseline10789（13.75 + B20/35=26）。計 61.5px */
  cursor: pointer;
}

/* 黄色インジケータ（XD 長方形20205 60x5 #ffc02e）。
   ラベルのインク中心に置くと XD の x155..215（SP x72..132）と一致する。
   SPではタブ下辺より下へはみ出す＝純粋な重なり装飾なので absolute で置く */
.rq__tab-label::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0.046875rem; /* XD PC: バー下端10810 − 箱下端10810.75 = -0.75px 分を戻す */
  transform: translateX(-50%);
  width: 3.75rem;
  height: 0.3125rem;
  background: transparent;
}

/* --- アクティブ状態（ラジオの :checked を後続兄弟へ配る。JSなし） ----------------
   XD パス332582 の∩形状（左・上・右だけ線があり下辺は開く）を
   「コンテナの inset 下線」＋「不透明な緑背景で自分の下線だけ隠す」＋「inset 上/左/右」で再現。
   タブ2がアクティブのときは同じ形状が XD のタブ2箱（グループ85728）へそのまま乗る */
#rq-area-hokkaido:checked ~ .rq__tabs .rq__tab--hokkaido,
#rq-area-saitama:checked ~ .rq__tabs .rq__tab--saitama {
  background: var(--color-green-soft); /* コンテナの下線をこのタブの幅だけ隠す（XD どおり下辺が開く） */
  box-shadow:
    inset 0.09375rem 0.09375rem 0 #ffffff,  /* 左辺・上辺 */
    inset -0.09375rem 0 0 #ffffff;          /* 右辺 */
  color: var(--color-yellow); /* XD #ffc02e */
}

#rq-area-hokkaido:checked ~ .rq__tabs .rq__tab--hokkaido .rq__tab-label::after,
#rq-area-saitama:checked ~ .rq__tabs .rq__tab--saitama .rq__tab-label::after {
  background: var(--color-yellow);
}

/* ラジオ本体は sr-only なのでフォーカスリングが見えない。ラベル側へ出す */
#rq-area-hokkaido:focus-visible ~ .rq__tabs .rq__tab--hokkaido .rq__tab-label,
#rq-area-saitama:focus-visible ~ .rq__tabs .rq__tab--saitama .rq__tab-label {
  outline: 0.125rem solid var(--color-yellow);
  outline-offset: 0.125rem;
}

/* 非アクティブ側の表は落とす（支援技術からも隠れる） */
#rq-area-hokkaido:checked ~ .rq__table--saitama,
#rq-area-saitama:checked ~ .rq__table--hokkaido {
  display: none;
}

/* --- 募集要項テーブル -------------------------------------------------------
   XD グループ31624。行の区切りは破線 stroke #ffffff 1px dash[4,4] x50 w1266。
   破線は border / box-shadow では描けないため repeating-linear-gradient を
   行の下端に敷く。セル高は固定せず line-height と padding で中身が決める */
.rq__table { margin: 1.203125rem 0 0; } /* XD PC: タブ箱下端10810.75 → 表上端10830 = 19.25px */

.rq__row {
  display: grid;
  grid-template-columns: 14.375rem 1fr; /* XD: ラベルink左端113 → 値ink左端343 = 230px */
  padding: 1.5625rem 0 1.5rem 3.9375rem; /* XD: 行上端10830 → baseline10879（25 + B16/35=24 = 49）、行高84px、左端は x50 から63px */
  background-image: repeating-linear-gradient(
    to right,
    #ffffff 0 0.25rem,
    rgba(255, 255, 255, 0) 0.25rem 0.5rem
  ); /* XD dash [4,4] */
  background-repeat: no-repeat;
  background-size: 100% 0.0625rem;
  background-position: left bottom;
  line-height: 2.1875rem; /* XD lineHeight 35 */
  font-size: 1rem; /* XD 16px */
}

.rq__label {
  margin: 0;
  font-weight: 700; /* XD NotoSansJP-Bold */
  color: #ffffff;
}

.rq__value {
  margin: 0;
  color: #ffffff;
}

.rq__value--bold { font-weight: 700; } /* XD「週休二日制（土日祝）」だけ Bold */

/* 注記行（勤務地）。XD は注記のぶん行高が84→129px に伸びる */
.rq__row--note { padding-bottom: 1.375rem; } /* XD: 行高129px = 25 + 35 + 12 + 35 + 22 */

.rq__note {
  display: block;
  margin-top: 0.75rem; /* XD: 注記baseline11093 = 行上端10830 + 25 + 35 + 12 + B14/35=23 */
  font-size: 0.875rem; /* XD 14px */
}

/* --- LINE CTA ---------------------------------------------------------------
   XD 長方形48261(320x60 r30 #ffffff) ＋ グループ63321(LINEマーク 32.933x31.377)
   ＋ 長方形48271(190x25 r13 #ffc02e バッジ、ボタン上端に7px重なる)。
   interactions.json にリンク先が無い（hyperlinkUrl 空）ため href は作らない */
.rq__cta {
  position: relative; /* バッジ（ボタンに重なる装飾）の座標基準としてのみ使用 */
  width: 20rem; /* XD 320px */
  margin: 4.25rem auto 0; /* XD PC: 最終破線11463 → ボタン上端11531 = 68px、x523 = 中央 */
}

.rq__cta-badge {
  position: absolute; /* XD 長方形48271 はボタン上端に7px重なる純粋な装飾 */
  top: -1.125rem; /* XD: ボタン上端11531 → バッジ上端11513 = -18px */
  left: 50%;
  transform: translateX(-50%); /* XD: バッジ中心683 ＝ ボタン中心683 */
  width: 11.875rem; /* XD 190px */
  margin: 0;
  padding: 0.125rem 0 0.1875rem 0.875rem; /* XD: バッジ上端11513 → baseline11530（2 + B12/20=15 = 17）、高25px、ink左端14px */
  border-radius: 0.8125rem; /* XD r13 */
  background: var(--color-yellow);
  color: var(--color-ink);
  font-size: 0.75rem; /* XD 12px */
  line-height: 1.25rem;
  letter-spacing: 0.05em; /* XD charSpacing 50/1000em */
}

.rq__cta-button {
  display: flex;
  align-items: center;
  margin: 0;
  text-decoration: none; /* 2026-09-09 <p> → <a>（LINEリンク https://line.me/ti/p/zxa57r60S7 ）化。見た目は据え置き */
  padding: 0.8125rem 0 0.75rem 1.301125rem; /* XD: 高60px = 13 + 35 + 12。baseline11570 = 上端11531 + 13 + B20/35=26 = 39 */
  gap: 1.8905625rem; /* XD: マークink右端576.751 → 文字ink左端607 = 30.249px */
  border-radius: 1.875rem; /* XD r30 */
  background: #ffffff;
  color: var(--color-ink);
  line-height: 2.1875rem; /* XD lineHeight 35。ボタン高60pxは padding 13/12 と合わせて作る */
  font-size: 1.25rem; /* XD 20px */
  font-weight: 700;
  letter-spacing: 0.05em; /* XD charSpacing 50/1000em */
}

/* XD グループ63321（LINEマーク）。viewBox は Chromium getBBox() 実測 0 0.001 32.933 31.379 */
.rq__cta-mark {
  flex: none;
  align-self: flex-start; /* 中央揃えではXD位置に来ない。上端基準＋実測オフセットで置く */
  margin-top: 0.0819375rem; /* XD: ボタン上端11531 → マークink上端11545.311 = 14.311px（padding-top 13 + 1.311） */
  width: 2.0583125rem; /* XD ink幅 32.933px（高さは viewBox 比で 31.379px） */
  height: auto;
}

@media (max-width: 767px) {
  .rq {
    padding-bottom: 4.374rem; /* XD SP: 緑下端15015 → セクション下端15084.984 = 69.984px */
  }

  .rq__band {
    padding-bottom: 3.125rem; /* XD SP: ボタン下端14965 → 緑下端15015 = 50px */
  }

  .rq__heading { margin-left: 0.9375rem; } /* XD SP ink左端15px */
  .rq__heading-svg--pc { display: none; }
  .rq__heading-svg--sp { display: block; width: 8.8955625rem; } /* XD SP ink幅142.329px */

  .rq__rule { display: none; } /* XD SPアートボードには見出し下の白罫線が無い */

  .rq__inner {
    margin: 2.168375rem 0.9375rem 0; /* XD SP: 見出しink下端13723.556 → タブ箱上端13758.25 = 34.694px、左右15px */
  }

  /* XD SP グループ86032: タブ1 = x15..185.7285 / タブ2 = ..360 で隣り合う（PCのような15px空きは無い） */
  .rq__tab {
    width: 10.76428125rem; /* XD SP 170.7285px ＋ ストローク1.5px */
    font-size: 1rem; /* XD SP 16px */
  }

  .rq__tab--hokkaido {
    padding-left: 2.984375rem; /* XD SP: ink左端62 − 箱左端14.25 = 47.75px */
  }

  .rq__tab--saitama {
    flex: 1; /* 残り（XD SP 186.4785..360.75）がそのままタブ2の箱 */
    width: auto;
    margin-left: 0;
    padding-left: 4.47009375rem; /* XD SP: 「埼玉」ink左端258 − タブ2箱左端186.4785 = 71.5215px */
  }

  .rq__tab-label {
    padding: 0.171875rem 0 0.105625rem; /* XD SP: 箱上端13758.25 → baseline13785（2.75 + B16/35=24）、箱高39.44px */
  }

  .rq__tab-label::after {
    bottom: -0.144375rem; /* XD SP: バー 13797..13800、箱下端13797.69 → -2.31px */
    height: 0.1875rem; /* XD SP 3px */
  }

  .rq__table { margin-top: 1.394375rem; } /* XD SP: タブ箱下端13797.69 → 表上端13820 = 22.31px */

  /* SPは1カラム積み。行高は XD SP 実測「84px ＋ 値の追加行 × 30px」に一致する */
  .rq__row {
    grid-template-columns: 1fr;
    padding: 0.9375rem 0 0.625rem; /* XD SP: 行上端13820 → ラベルbaseline13854（15 + B16/24=19 = 34）、行高84px */
    line-height: 1.875rem; /* XD SP lineHeight 30 */
  }

  .rq__label {
    line-height: 1.5; /* XD SP: ラベル箱高24px（16px × 1.5） */
  }

  .rq__value {
    margin-top: 0.3125rem; /* XD SP: 値baseline13885 = 行上端 + 15 + 24 + 5 + B14/30=21 = 65 */
    font-size: 0.875rem; /* XD SP 14px */
  }

  .rq__row--note { padding-bottom: 0.625rem; } /* SPでは注記も同じ行内の1行として流れる */

  .rq__note {
    margin-top: 0;
    font-size: 0.75rem; /* PC の 値16px/注記14px と同じ差分をSPの値14pxに適用 */
  }

  .rq__cta {
    margin: 3.3125rem 0.75rem 0 0.8125rem; /* XD SP: 最終破線 → ボタン上端14905 = 53px、x28..348 */
  }

  .rq__cta-button {
    gap: 2.7655625rem; /* XD SP: マークink右端81.751 → 文字ink左端126 = 44.249px */
    padding-bottom: 0.5rem; /* XD SP: 高60px = 13 + 39 + 8 */
    line-height: 2.4375rem; /* 39px。baseline = 上端 + 13 + B16/39=26 = 39（XD 1255.016−1216.016） */
    font-size: 1rem; /* XD SP 16px */
  }
}

/* ==========================================================================
   14 FAQ（よくある質問）
   XD doc座標: PC 11811.64..13025.28（h1213.64） / SP 15084.984..15907（h822.016）
   上端＝自分のリードイン見出しの ink 上端（PC パス342832 x50 374.464x62.208 /
   SP パス342860 x15 208.107x34.572）。下端＝セクション15 entry のリードイン見出し
   ink 上端（パス342789）。faq が持つノードは全てその上にある（PC 最終カード下端12811 /
   SP 15786）。
   地色は XD アートボードの塗り #e1e5e4（body の #e5e9e9 とは別物・AGC 実測）。
   Chromium 実測の baseline 定数（BASELINE-CONSTANTS.json）から padding を逆算:
     Noto Sans JP B(28,50)=37 / B(16,40)=27 / B(16,25)=19 / B(12,25)=18
     DIN 2014 Bold B(64,50)=48 / B(32,25)=23 / B(116,116)=99 / B(64,64)=55
   ========================================================================== */
.fq {
  display: flow-root; /* .fq__outro の負マージンを親の外へ逃がさない */
  background: #e1e5e4;
}

/* リードイン見出し。A-SK大蘭明朝アウトライン → XD由来SVG＋sr-only実テキスト＝他セクションと同方式。
   viewBox は Chromium の getBBox() 実測値（doc座標ではない） */
.fq__heading { margin: 0 0 0 3.125rem; } /* XD PC: ink左端 x50 */
.fq__heading-svg { display: block; height: auto; }
.fq__heading-svg--pc { width: 23.404rem; } /* XD PC ink 374.464px */
.fq__heading-svg--sp { display: none; }

/* 見出し下の罫線。★ XD 線792 / 線848 は #ffffff ではなく #212121（requirements の線791と別） */
.fq__rule {
  height: 0.0625rem; /* XD 1px */
  margin-top: 1.8845rem; /* XD PC: 見出しink下端11873.848 → 罫線11904 = 30.152px */
  background: #212121;
}

/* アコーディオン一覧（XD 長方形48073/48074/48075/48076/48262 #ffffff）。
   position:relative + z-index は「最背面の緑クサビ（di=0）より前面に置く」ためだけの指定で、
   座標には一切使っていない（カードはフロー＋grid で積む） */
.fq__list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 1.5625rem; /* XD PC カード間 25px */
  margin: 3.0625rem 3.125rem 0; /* XD PC: 罫線下端11905 → カード1上端11954 = 49px、左右 x50（幅1266） */
}

/* 排他開閉は details の name 属性（同一 name のグループ内で常に1枚だけ open）で行う。
   JS を持たないので高さも状態も DOM 側で固定されず、未対応ブラウザでは
   「個別に開ける普通のアコーディオン」に落ちるだけで内容は読める */
.fq__item { background: #ffffff; }

/* 質問行。XD: Q ink左端＝カード+40 / 質問ink左端＝カード+120 → 1列目 80px。
   山形 ink 右端＝カード右端−61.896px。閉時カード高 133 = 41 + 行50 + 42 */
.fq__q {
  display: grid;
  grid-template-columns: 5rem 1fr auto;
  align-items: start;
  padding: 2.5625rem 3.8685rem 2.625rem 2.5rem;
  cursor: pointer;
  list-style: none;
}

.fq__q::-webkit-details-marker { display: none; }

/* キーボード操作。summary は既定でフォーカス可・Enter/Space で開閉するので JS もタブ順の
   細工も要らないが、既定のフォーカスリングは list-style:none と白カードの上で見失いやすい。
   :focus-visible に限定して出すのでポインタ操作時のクリック跡にはならない。
   outline-offset を負にしてカード内側に描き、隣のカードとの 25px の間隔を侵さない */
.fq__q:focus-visible {
  outline: 0.1875rem solid #005a3c; /* Q マークと同じ XD の緑 */
  outline-offset: -0.1875rem;
}

/* Q マーク。XD lineHeight 80 は positioned フレームなので位置に影響しない
   （ty がそのまま baseline）。行送りは質問文と同じ50pxに合わせ、
   padding-top 41 + B(64,50)=48 で XD の baseline（カード上端+89）に一致させる */
.fq__mark {
  font-family: "din-2014", "DIN 2014", "Roboto", sans-serif;
  font-weight: 700;
  font-size: 4rem; /* XD 64px */
  line-height: 3.125rem; /* 50px */
  color: #005a3c; /* XD fill */
}

.fq__qtext {
  font-size: 1.75rem; /* XD 28px */
  font-weight: 700; /* XD NotoSansJP-Bold */
  line-height: 3.125rem; /* XD 50px */
  color: #212121;
}

.fq__br { display: none; } /* SP だけで効かせる明示改行 */

.fq__chev { display: block; margin-top: 1.125rem; } /* XD PC: 山形上端＝カード+59 − padding-top41 = 18px */

/* XD パス342619〜342622/342778。ストロークは中央揃えでパスbboxの外へ出るので overflow:visible。
   vector-effect:non-scaling-stroke により線幅が viewBox 倍率ではなく rem スケールで決まる */
.fq__chev-svg {
  display: block;
  width: 1.38116455rem; /* XD 22.0986328125px */
  height: 0.69507599rem; /* XD 11.1212158203125px */
  overflow: visible;
  fill: none;
  stroke: #212121;
  stroke-width: 0.25rem; /* XD 4px */
}

.fq__chev-svg path { vector-effect: non-scaling-stroke; }

/* 開閉状態は details[open] だけで切り替える（JSで高さを固定しない）。
   XD も Q1 だけ ∧（開）、Q2〜Q5 は ∨（閉）で描かれている */
.fq__chev-up { display: none; }
.fq__item[open] .fq__chev-up { display: inline; }
.fq__item[open] .fq__chev-down { display: none; }

/* 開時の質問行高 108 = 41 + 行50 + 17（＝回答1行目の行箱上端） */
.fq__item[open] .fq__q { padding-bottom: 1.0625rem; }

/* 回答。XD: frame x170（＝カード+120）幅1022 → 右padding 124px。
   1行目 baseline ＝ カード上端 + 135 = 質問行108 + B(16,40)=27。
   カード高 225 = 108 + 40×2 + 37 */
.fq__a { padding: 0 7.75rem 2.3125rem 7.5rem; }

.fq__atext {
  margin: 0;
  font-size: 1rem; /* XD 16px */
  line-height: 2.5rem; /* XD 40px */
  color: #212121;
}

/* 緑クサビ（XD パス342672 #5a927f・di=0＝最背面）と中抜きワードマーク。
   クサビは faq の中（PC 12723.001）から始まって entry まで続く共有ノード。
   負マージンでカード列に重ねるのは「重なり装飾」に該当するのでフロー要素のまま扱い、
   位置は absolute ではなくマージンと clip-path で決めている。
   clip-path 頂点（XD）: (0,12926.848) (861.147,12723.001) (1366,12890.875)
   → 箱上端12723.001 からの相対で 203.847px / 63.0415% / 167.874px */
.fq__outro {
  /* ★ ワードマークの中央揃えに flex を使う理由: Blink は text-align:center の行が
     コンテナ幅を超えると寄せ量を 0 にクランプし、行頭が左端に張り付く（＝左右対称に
     食み出さない）。flex の align-items:center は超過分を左右へ均等に食み出させるので
     XD の「アートボード中央 x683 に中心を置き左右へ448pxずつブリード」を再現できる */
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: -5.4999375rem; /* XD PC: カード下端12811 → クサビ最上点12723.001 = -87.999px */
  padding: 6.6249375rem 0 5.0175rem; /* baseline 12928 = 12723.001 + 105.999 + B(116,116)=99 / 下端13025.28 */
  /* ワードマークがアートボード幅から左右へ448pxずつ食み出すのを切る。
     ★ overflow:hidden だとスクロールコンテナになり、Chrome が「はみ出した中央揃え行を
       スクロールで辿れなくなる」のを避けて行頭を左端へ寄せてしまう（＝中央揃えが壊れる）。
       overflow:clip はスクロールコンテナを作らないので中央揃えがXDどおり効く */
  overflow: clip;
  background: #5a927f;
  clip-path: polygon(0 12.7404375rem, 63.0415% 0, 100% 10.492125rem, 100% 100%, 0 100%);
}

.fq__wordmark {
  /* 末尾の字送りアキを margin で打ち消し、左右へ 0.5em ずつの間隔を padding で持たせる。
     1枚の外寸＝インク幅＋1em の左右対称になるので、中央の1枚のインクがXDどおり
     帯の中央（アートボード中央 x683）に来て、複製どうしの間隔も常に1em で一定になる */
  margin: 0 -0.2em 0 0;
  padding: 0 0.5em;
  font-family: "din-2014", "DIN 2014", "Roboto", sans-serif;
  font-weight: 700;
  font-size: 7.25rem; /* XD 116px */
  line-height: 7.25rem;
  letter-spacing: 0.2em; /* XD letterSpacing 200 */
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: 0.0625rem #ffffff; /* XD fill:none / stroke #ffffff 1px の中抜き */
}

@media (max-width: 767px) {
  .fq__heading { margin-left: 0.9375rem; } /* XD SP: ink左端 x15 */
  .fq__heading-svg--pc { display: none; }
  .fq__heading-svg--sp { display: block; width: 13.0066875rem; } /* XD SP ink 208.107px */

  .fq__rule { margin: 1.27775rem 0.9375rem 0; } /* XD SP: 見出しink下端15119.556 → 罫線15140 = 20.444px、x15 w345 */

  .fq__list {
    gap: 1.25rem; /* XD SP カード間 20px */
    margin: 2.125rem 0.9375rem 0; /* XD SP: 罫線下端15141 → カード1上端15175 = 34px */
  }

  /* XD SP: Q ink左端＝カード+15 / 質問ink左端＝カード+45 → 1列目 30px。
     閉時カード高 74 = 25 + 行25 + 24（質問2行のカードは自動で99になる） */
  .fq__q {
    grid-template-columns: 1.875rem 1fr auto;
    padding: 1.5625rem 0.9375rem 1.5rem;
  }

  .fq__mark {
    font-size: 2rem; /* XD SP 32px */
    line-height: 1.5625rem; /* 25px。padding-top25 + B(32,25)=23 → baseline カード+48 */
  }

  .fq__qtext {
    font-size: 1rem; /* XD SP 16px */
    line-height: 1.5625rem; /* 25px。padding-top25 + B(16,25)=19 → baseline カード+44 */
  }

  .fq__br { display: inline; }

  .fq__chev { margin-top: 0.540375rem; } /* XD SP: 山形上端＝カード+33.646 − 25 = 8.646px */

  .fq__chev-svg {
    width: 0.83318222rem; /* XD SP 13.3309154510498px */
    height: 0.41929880rem; /* XD SP 6.708780765533447px */
    stroke-width: 0.125rem; /* XD SP 2px */
  }

  .fq__item[open] .fq__q { padding-bottom: 0.875rem; } /* 開時の質問行高 64 = 25 + 25 + 14 */

  /* XD SP: 回答 frame x30（＝カード+15）幅315 → 右padding 15px。
     1行目 baseline ＝ カード+82 = 質問行64 + B(12,25)=18。カード高 185 = 64 + 25×4 + 21 */
  .fq__a { padding: 0 0.9375rem 1.3125rem; }

  .fq__atext {
    font-size: 0.75rem; /* XD SP 12px */
    line-height: 1.5625rem; /* XD SP 25px */
  }

  .fq__outro {
    margin-top: -1.125rem; /* XD SP: カード下端15786 → クサビ最上点15768 = -18px */
    padding: 1.75rem 0 2.9375rem; /* baseline 15851 = 15768 + 28 + B(64,64)=55 / 下端15907 */
    clip-path: polygon(0 3.4975625rem, 63.0415% 0, 100% 2.8803125rem, 100% 100%, 0 100%);
  }

  .fq__wordmark {
    font-size: 4rem; /* XD SP 64px */
    line-height: 4rem;
  }
}

/* =========================================================
   セクション15 entry（イベント参加・エントリー）
   XD: PC doc 13025.28..14652 / SP doc 15907..17667
   背景の緑 #5a927f は パス342672（di=0）で faq と共有するノード。
   クサビ先端は faq 側（.fq__outro）が clip-path で描き切っているため、
   ここは平坦な緑地をセクション16 footer の緑帯まで continue するだけ。
   ========================================================= */
.et {
  padding-bottom: 6.25rem;            /* カード下端14552 → セクション下端14652 */
  background: #5a927f;
  /* Chromium の既定は約物の詰めが有効で、隣り合う「。）」を 24px→18px に詰める。
     XD は詰めないので 1行に入る文字数がずれる（個人情報保護方針 SP で 88行目以降が
     全部ずれた）。XD と同じ全角送りに揃える */
  text-spacing-trim: space-all;
}
.et__inner { padding: 0 3.125rem; }   /* XD 左右余白 50 */

.et__heading { margin: 0; }
.et__heading-svg { display: block; height: auto; }
/* viewBox は XD の ink bbox を Chromium getBBox() で実測した値。
   要素上端＝インク上端なので、セクション上端 13025.28 とそのまま一致する */
.et__heading-svg--pc { width: 47.604rem; }
.et__heading-svg--sp { display: none; width: 15.10025rem; }

/* 線796（PC は x0 w1366 の全幅罫）。Chrome が 1920 で小数 border を潰すため
   border ではなく背景色の要素で引く */
.et__rule {
  height: 0.0625rem;
  margin: 1.93725rem -3.125rem 0;     /* インク下端 13085.504 → 罫線上端 13116.5 */
  background: #ffffff;
}

.et__cols {
  display: grid;
  grid-template-columns: 24.0625rem 49.3125rem;  /* 385 / 789 */
  gap: 5.75rem;                                   /* 435 → 527 */
  margin-top: 2.84375rem;                         /* 罫線下端 13117.5 → 13163 */
}
/* グリッド項目の既定 min-width:auto だと、個人情報保護方針に含まれる URL の
   min-content 幅がトラックを押し広げてカードが 5px 太る（375 実測 350 vs XD 345） */
.et__cols > * { min-width: 0; }
/* overflow-wrap: 本文中の URL（http://www.uchiike-co.com/）が枠から溢れるのを防ぐ。
   anywhere だと禁則ごと無効になるので break-word にとどめる。
   line-break: 既定の normal は行頭の長音符 ー を許すため「個人デ|ータ」と割れる。
   XD は厳格禁則なので strict を明示する（SP 375 で XD と折返しが1行ずれていた） */
.et__privacy-body { overflow-wrap: break-word; line-break: strict; }

/* --- 左カラム：マイナビ導線 --- */
.et__mynavi {
  position: relative;                 /* ::after のボーダー用（下の理由参照） */
  padding: 1.6875rem 0 2.1875rem;     /* 上27 / 下35 */
  border-radius: 1.25rem;
  text-align: center;
  /* XD uxdesign#blur（backgroundEffect / blurAmount 30 / brightness +15 / fillOpacity 0）＝すりガラス */
  background: transparent;
  backdrop-filter: blur(1.875rem) brightness(1.15);
  -webkit-backdrop-filter: blur(1.875rem) brightness(1.15);
}
/* inset box-shadow は子要素の下に塗られ、中のボタン画像に罫線が隠れる。
   position:absolute はこの重なり装飾のためだけに使う */
.et__mynavi::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 0.0625rem #ffffff;
  pointer-events: none;
}
.et__mynavi-copy {
  margin: 0;
  font-size: 1rem;
  line-height: 2.5rem;
  color: #ffffff;
}
.et__mynavi-btn { display: block; width: 12.1875rem; margin: 1.0625rem auto 0; }
.et__mynavi-btn img { display: block; width: 12.1875rem; height: 3.75rem; box-sizing: border-box; object-fit: contain; padding: 0 0.6875rem; border: 0.0625rem solid #00a5e8; background: #ffffff; }

.et__intro {
  width: 24.5rem;
  margin: 2.625rem 0 0;
  font-size: 1rem;
  line-height: 2.5rem;
  color: #ffffff;
}

/* --- 右カラム：エントリーフォーム --- */
.et__card {
  padding: 3.3125rem 3.125rem 2.875rem;
  border-radius: 1.25rem;
  background: transparent;
  backdrop-filter: blur(1.875rem) brightness(1.15);
  -webkit-backdrop-filter: blur(1.875rem) brightness(1.15);
  box-shadow: inset 0 0 0 0.0625rem #ffffff;
}
.et__row--event[hidden] { display: none; }
.et__row + .et__row { margin-top: 2.125rem; }
.et__row--first + .et__row,
.et__row--first ~ .et__row--event { margin-top: 2.0625rem; }  /* XD は1行目だけ 33（他は34） */

.et__row-head { display: flex; align-items: flex-start; }
.et__badge {
  flex: none;
  width: 2.5rem;
  margin: 0.15625rem 0.9375rem 0 0;
  font-size: 0.875rem;
  line-height: 1.25rem;
  text-align: center;
  color: #ffffff;
}
.et__row--first .et__badge { margin-top: 0.21875rem; }
.et__badge--req { background: #005a3c; }
.et__badge--opt { background: #707070; }
/* XD 側でバッジのウェイトが行ごとに Bold / Medium と揺れている。そのまま再現する */
.et__badge--w700 { font-weight: 700; }
.et__badge--w500 { font-weight: 500; }
.et__label {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.625rem;
  color: #212121;
}

.et__control {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-top: 0.5625rem;
  padding: 0.75rem 1.875rem;
  border: 0;
  border-radius: 0;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.625rem;
  color: #212121;
}
.et__control--f5 { background: #f5f5f5; }
.et__control--wh { background: #ffffff; }
.et__control::placeholder { color: #d3d3d3; opacity: 1; }
.et__control--area {
  min-height: 12.25rem;               /* XD 196。min なので内容が増えれば伸びる */
  padding: 1.3125rem 1.875rem;
  resize: vertical;
}

.et__select { position: relative; }
.et__select .et__control {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 4rem;
  /* 山形はパス342673（XD の d をそのまま埋め込み。手起こし近似はしない） */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14.422" height="7.258" viewBox="-1 -1 16.422 9.258"><path d="M 0 0.0001220703125 C 0.5855672359466553 0.5092872977256775 7.19162654876709 7.258056640625 7.19162654876709 7.258056640625 L 14.42218112945557 0.0001220703125" fill="none" stroke="%23212121" stroke-width="2"/></svg>');
  background-repeat: no-repeat;
  background-position: right 1.25rem center;
  background-size: 0.901375rem 0.453625rem;
}

/* 1行目のラジオ */
.et__radios { display: flex; flex-wrap: wrap; margin-top: 0.875rem; gap: 1.5625rem; }
.et__radio { display: flex; align-items: center; cursor: pointer; }
.et__radio[hidden] { display: none; } /* 2026-09-09 イベント休止中の「1DAY仕事体験に参加」を非表示（display:flex が [hidden] に勝つため明示） */
.et__radio input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.et__radio-mark {
  flex: none;
  width: 1.25rem;
  height: 1.25rem;
  margin-right: 0.3125rem;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: inset 0 0 0 0.0625rem #212121;
}
.et__radio input:checked + .et__radio-mark {
  background: radial-gradient(circle, #212121 0 0.3125rem, #ffffff 0.3125rem);
}
.et__radio input:focus-visible + .et__radio-mark { outline: 0.125rem solid #212121; outline-offset: 0.125rem; }
.et__radio-text { font-size: 1rem; line-height: 1.5625rem; color: #212121; }

/* 個人情報保護方針。XD は SHAPE_SCROLLABLE_GROUP（viewportHeight 130）＝実スクロール枠。
   高さ固定はこのクリップ枠だけに限定する */
.et__privacy {
  height: 10rem;
  margin-top: 3.125rem;
  /* 右34 = XD のテキストフレーム右端1232 と枠右端1266 の差（軌道1256..1265を含む）。
     ここを詰めると本文の折返し幅が XD の 630 を超え、折返し位置がずれる（WRAP-CHECK で検出） */
  padding: 1.0625rem 2.125rem 1.0625rem 1.5625rem;
  box-sizing: border-box;
  overflow-y: auto;
  background: #ffffff;
  box-shadow: inset 0 0 0 0.0625rem #212121;
}
/* 長方形48263/48264 はネイティブのスクロールバー軌道とつまみをそのまま描いたもの */
.et__privacy::-webkit-scrollbar { width: 0.5625rem; }
.et__privacy::-webkit-scrollbar-track { background: #cccccc; }
.et__privacy::-webkit-scrollbar-thumb { background: #8d8d8d; border-left: 0.0625rem solid #cccccc; border-right: 0.0625rem solid #cccccc; }
.et__privacy-body {
  font-size: 0.875rem;
  line-height: 1.625rem;
  color: #212121;
  white-space: pre-wrap;
}

.et__agree { display: flex; justify-content: center; margin-top: 1.5625rem; }
.et__agree-label { display: flex; align-items: flex-start; cursor: pointer; }
.et__agree-label input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.et__agree-mark {
  flex: none;
  width: 1.25rem;
  height: 1.25rem;
  margin: 0.0625rem 0.3125rem 0 0;
  background: #ffffff;
  box-shadow: inset 0 0 0 0.0625rem #cccccc;
}
.et__agree-label input:checked + .et__agree-mark {
  background: #ffffff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M4 10.5 L8.5 15 L16 5.5" fill="none" stroke="%23212121" stroke-width="2"/></svg>') no-repeat center / 100% 100%;
}
.et__agree-label input:focus-visible + .et__agree-mark { outline: 0.125rem solid #212121; outline-offset: 0.125rem; }
.et__agree-text { font-size: 0.875rem; line-height: 1.25rem; color: #212121; }

.et__submit-wrap { display: flex; justify-content: center; margin-top: 3.125rem; }
.et__submit {
  flex: none;            /* SP のカード内寸315に対しXDのボタンは320＝左右へ2.5ずつ食み出す */
  width: 20rem;
  padding: 1.3125rem 0 1.1875rem;
  border: 0;
  border-radius: 1.875rem;
  background: #ffc02e;
  font-family: inherit;
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.25rem;
  letter-spacing: 0.05em;
  color: #212121;
  cursor: pointer;
}

@media (max-width: 767px) {
  .et { padding-bottom: 3.1875rem; }          /* カード下端17616 → 17667 */
  .et__inner { padding: 0 0.9375rem; }
  .et__heading-svg--pc { display: none; }
  .et__heading-svg--sp { display: block; }
  .et__rule { margin: 1.1939375rem 0 0; }     /* SP の 線849 は内側揃え（x15 w345） */
  .et__cols { grid-template-columns: 1fr; gap: 0; margin-top: 2.15625rem; }

  .et__mynavi { padding: 1.5625rem 0 1.875rem; border-radius: 0.625rem; }
  .et__mynavi-copy { font-size: 0.875rem; line-height: 1.875rem; }
  .et__mynavi-btn { margin-top: 1.25rem; }
  .et__intro { width: auto; margin-top: 1.875rem; font-size: 0.875rem; line-height: 1.875rem; }

  .et__card { margin-top: 2.8125rem; padding: 2rem 0.9375rem 3.125rem; border-radius: 0.625rem; }
  .et__row + .et__row { margin-top: 1.375rem; }
  .et__row--first + .et__row,
  .et__row--first ~ .et__row--event { margin-top: 1.1875rem; }
  .et__badge {
    width: 2.21794rem;
    margin: 0.25rem 0.59456rem 0 0;
    font-weight: 500;                          /* SP は全行 Medium 12 */
    font-size: 0.75rem;
    line-height: 1.109rem;
  }
  .et__row--first .et__badge { margin-top: 0.25rem; }
  .et__label { font-size: 0.875rem; }
  /* iOS Safari は入力欄の font-size が 16px 未満だとフォーカス時に画面を自動ズームする。
     デザインは 0.875rem(375px幅で14px) だが、入力欄だけ 16px を下限にしてズームを防ぐ（2026-09-18 ろく指摘） */
  .et__control { margin-top: 0.4375rem; padding: 0.6875rem 0.5625rem 0.8125rem; font-size: max(0.875rem, 16px); background: #ffffff; }
  .et__control--area { min-height: 10.625rem; padding: 0.6875rem 0.5625rem 0.8125rem; }
  .et__select .et__control { padding-right: 2rem; background-position: right 0.6875rem center; }
  .et__radios { margin-top: 0.5rem; }
  .et__radio-mark { width: 0.9375rem; height: 0.9375rem; }
  .et__radio input:checked + .et__radio-mark { background: radial-gradient(circle, #212121 0 0.21875rem, #ffffff 0.21875rem); }
  .et__radio-text { font-size: 0.875rem; line-height: 1.5625rem; }
  /* 右20 = XD SP のテキストフレーム右端325 と枠右端345 の差（軌道335..344を含む）。折返し幅280 */
  .et__privacy { margin-top: 1.5625rem; padding: 0.6875rem 1.25rem 0.6875rem 0.9375rem; }
  .et__privacy-body { font-size: 0.75rem; }
  .et__agree { margin-top: 1.5625rem; }
  .et__submit-wrap { margin-top: 2.1875rem; }
  .et__submit { padding: 1.375rem 0; font-size: 1rem; line-height: 1rem; }
}

/* ==========================================================================
   16 FOOTER — XD正本:
   PC_1366 doc y=14652..14792（高140）/ SP_375 doc y=17667..17900（高233）。
   アートボード末尾。所有ノードは PC di216 帯 / di217 header-logo / di218 会社情報 /
   di219 コピーライト、SP di243 帯 / di244 header-logo＋会社情報 / di245 コピーライト。
   ★ 緑クサビ パス342672 は faq が clip-path＋負マージンで描画済み。ここは平坦な
     #005a3c 帯だけを継ぎ、クサビを再描画しない。
   ★ position:absolute は 1 箇所も使わない。高さは padding＋中身で決まり固定 height なし。
   ========================================================================== */
.ft {
  background: var(--color-green);   /* XD 長方形48240 / 長方形48283 #005a3c */
  color: #ffffff;
  /* entry で効いた text-spacing-trim / line-break は footer では入れない。
     実測（width-probe）で「本社：室蘭　拠点：札幌・仙台・埼玉」238px・
     「© 2026 株式会社内池建設.」143px が既定でもツメ有無で同値、かつ footer の
     テキストは全行が明示 <br> と nowrap で折返し自体が起きないため、
     この2プロパティは1つも文字送りを変えない。効かない指定は置かない。 */
}

.ft__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* 上33  = 住所ブロック上端14685（XD baseline14703 − Blink の先頭baseline 18）− 帯上端14652
     左右50 = ロゴ ink 左端50 / コピーライト右端1316（1366−50）
     下32  = 帯下端14792 − 住所ブロック下端14760（14685+25×3） */
  padding: 2.0625rem 3.125rem 2rem;
}

.ft__brand {
  display: flex;
  align-items: center;
  gap: 3.1516875rem;   /* XD: ロゴ ink 右端307.573 → 住所テキスト左端358 */
}

.ft__logo {
  flex: none;
  width: 16.0983125rem;      /* XD ink 257.573（viewBox を ink にタイトに合わせた SVG） */
  height: 2.72575rem;        /* XD ink 43.612 */
  /* XD のロゴ ink 中心14722 は住所ブロック中心14722.5 より 0.5 上。
     align-items:center 下では 1px の下マージンが 0.5px の上シフトになる */
  margin-bottom: 0.0625rem;
}

.ft__meta {
  margin: 0;
  font-weight: 400;
  font-size: 0.875rem;       /* XD 14 */
  line-height: 1.5625rem;    /* XD 25 */
}

.ft__copy {
  align-self: flex-end;
  /* XD: コピーライトの行ボックス下端14761 は住所ブロック下端14760 より 1 下 */
  margin: 0 0 -0.0625rem;
  font-weight: 400;
  font-size: 0.75rem;        /* XD 12 */
  line-height: 1.5625rem;    /* XD 25 */
  white-space: nowrap;
}

@media (max-width: 767px) {
  .ft__inner {
    display: block;
    /* 上35.195 = ロゴ ink 上端17702.195 − 帯上端17667
       左右15   = ロゴ ink / 住所テキスト左端15
       下31     = 帯下端17900 − コピーライト行ボックス下端17869 */
    padding: 2.1996875rem 0.9375rem 1.9375rem;
  }

  .ft__brand { display: block; }

  .ft__logo {
    width: 12.3340625rem;    /* XD SP ink 197.345 */
    height: 2.088375rem;     /* XD SP ink 33.414 */
    margin-bottom: 0;
  }

  .ft__meta {
    margin-top: 1.0244375rem;  /* ロゴ ink 下端17735.609 → 住所ブロック上端17752 */
    font-size: 0.75rem;        /* XD SP 12 */
  }

  .ft__copy {
    /* 住所ブロック下端17827 → コピーライト行ボックス上端17844 */
    margin: 1.0625rem 0 0;
    /* XD SP は x117 幅141 で ink 中心が 187.5＝375 の中央 */
    text-align: center;
  }
}

/* ==========================================================================
   インタラクション追加分（アコーディオン開閉アニメーション／イベント詳細モーダル）
   assets/app.js と対になる。JS が無い環境でも
   - FAQ は details/summary の既定動作で開閉できる
   - dialog は開かないがカードの情報は読める
   という縮退で成立する（このファイル単体でレイアウトを壊さない）。
   ========================================================================== */

/* --- FAQ アコーディオンの開閉アニメーション ------------------------------
   高さは JS が毎回実測して animate するので CSS には書かない（固定 height ゼロ）。
   ここでは「質問行の padding」と「山形の向き」を同じ時間軸で連動させるだけ。
   .is-closing は閉アニメーション中だけ JS が付けるフラグで、[open] はまだ立っている。 */
.fq__q { transition: padding-bottom 320ms cubic-bezier(0.33, 0.7, 0.3, 1); }

/* 閉アニメーション中は「閉じたときの質問行」へ向かって padding を戻す
   （PC 閉時 padding-bottom 42px ＝ .fq__q の元値と同じ） */
.fq__item.is-closing .fq__q { padding-bottom: 2.625rem; }

/* 山形は [open] ではなく実際の見え方に合わせて即座に反転させる */
.fq__item.is-closing .fq__chev-up { display: none; }
.fq__item.is-closing .fq__chev-down { display: inline; }

@media (prefers-reduced-motion: reduce) {
  .fq__q { transition: none; }
}

/* --- イベントカードを押せるようにする -------------------------------------
   矢印マーカーを span から button にした。位置・寸法は元のまま（display:block /
   line-height:0）で、ブラウザ既定のボタン装飾だけを消している。 */
.ev-card--online { cursor: pointer; }

.ev-card__marker {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  line-height: 0;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.ev-card__marker:focus-visible {
  outline: 0.1875rem solid #ffc02e; /* 矢印マーカーの黄と同じ XD 値 */
  outline-offset: 0.25rem;
  border-radius: 50%;
}

/* --- イベント詳細モーダル -------------------------------------------------
   XD正本: アートボード b67cb481「PC_modal」（origin 920,6079）
     スクリム #000000 opacity .6 / パネル (50,100) 1266x696 r20 fillOpacity0
     + backdrop blur15 brightness+9 + 白2px inside stroke
     画像 (120,150) 475x360（角丸なし）/ 本文列 x655 幅591 / ✕ (1286,35) 30x30 白3px
   高さ固定はゼロ。パネルの高さは中身が決める（XD の 696px は再現の対象にしない）。 */
.evm {
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.evm::backdrop { background: rgba(0, 0, 0, 0.6); } /* XD 長方形48256 #000000 opacity .6 */

.evm__inner {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 2.1875rem 3.125rem 3.125rem; /* XD: ✕上端 y35 / パネル左右 50px */
}

/* ✕ はパネルの外・右上（XD も y35..65 でパネル上端100より上にある） */
.evm__close {
  align-self: flex-end;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  line-height: 0;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.evm__close-svg {
  display: block;
  width: 1.875rem;  /* XD 30px */
  height: 1.875rem;
  overflow: visible; /* ストロークが中央揃えで bbox の外へ出るぶん */
  fill: none;
  stroke: #ffffff;
  stroke-width: 0.1875rem; /* XD 3px */
}

.evm__close-svg path { vector-effect: non-scaling-stroke; }

.evm__close:focus-visible {
  outline: 0.1875rem solid #ffc02e;
  outline-offset: 0.25rem;
}

.evm__panel {
  display: grid;
  grid-template-columns: 29.6875rem 1fr; /* XD: 画像475 ／ 本文591（＝罫線803の長さ） */
  column-gap: 3.75rem; /* XD: 画像右端595 → 本文左端655 = 60px */
  margin-top: 2.1875rem; /* XD: ✕下端65 → パネル上端100 = 35px */
  /* 上70…ではなく上50。XD はパネル上端100 → 画像・本文の上端150 = 50px、左右は 70px。
     下は XD の下段ブロック（未支給のため未出力）が無いぶん、上と同じ 50px で閉じる */
  padding: 3.125rem 4.375rem;
  border-radius: 1.25rem; /* XD r20 */
  box-shadow: inset 0 0 0 0.125rem #ffffff; /* XD 白2px inside stroke。border ではなく box-shadow */
  backdrop-filter: blur(0.9375rem) brightness(1.09); /* XD uxdesign#blur blurAmount15 / brightnessAmount9 */
}

/* 写真枠。XD 475x360 を比で持ち、実画像 360x240 を cover 配置（カードと同じ1枚） */
.evm__figure {
  overflow: hidden;
  aspect-ratio: 475 / 360;
}

.evm__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; /* XD pattern scaleBehavior cover */
}

.evm__main { min-width: 0; }

/* 開催地タグ。XD モーダル用は 55x29 / Bold16 / ls3.2（カードの 51x25 / Bold14 / ls2.8 とは別サイズ）。
   幅はカードと同じく文字数から決まる padding で組む */
.evm__tag {
  display: block;
  width: fit-content;
  margin: 0;
  padding: 0.3765rem 0.4125rem 0.436rem 0.625rem; /* XD: 箱150..179(h29) / ラベル baseline 171 / 左10px */
  background: #005a3c;
  color: #ffffff;
  font-size: 1rem; /* XD 16px */
  font-weight: 700;
  letter-spacing: 0.2rem; /* XD 200/1000em × 16px */
  line-height: 1;
}

.evm__title {
  margin: 0.39375rem 0 0; /* XD: タグ箱下端179 → タイトル行box上端185.3 */
  color: #ffffff;
  font-size: 2.25rem; /* XD 36px */
  font-weight: 700;
  letter-spacing: 0.1125rem; /* XD 50/1000em × 36px */
  line-height: 3.75rem; /* XD 60px */
}

.evm__rule {
  height: 0.125rem; /* XD 線803 2px */
  margin-top: 0.35625rem; /* XD: タイトル行box下端245.3 → 罫線251 */
  background: #ffffff;
}

.evm__meta {
  display: flex;
  gap: 1.5rem; /* XD: ラベル送り幅42 → 値の左端721 まで 24px（カードと同値） */
  margin: 1.33rem 0 0; /* XD: 罫線下端253 → 日時 baseline 299 から逆算した行box上端274.3 */
  color: #ffffff;
  font-size: 1.25rem; /* XD 20px */
  letter-spacing: 0.0625rem; /* XD 50/1000em × 20px */
  line-height: 2rem;
}

.evm__meta-label { font-weight: 700; white-space: nowrap; } /* XD Bold20 */
.evm__meta-value { margin: 0; white-space: nowrap; }        /* XD Regular20。dd の既定 margin を消す */

/* 日時の注記（2026-09-15 先方指示）。カードの .ev-card__note と同じ扱い、リード文と同じ16px */
.evm__note {
  margin: 0.5rem 0 0;
  color: #ffffff;
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0.05rem;
}

.evm__lead {
  margin: 1.6075rem 0 0; /* XD: 日時行box下端306.3 → リード1行目 baseline 354 から逆算した行box上端332 */
  color: #ffffff;
  font-size: 1rem;   /* XD 16px */
  line-height: 1.875rem; /* XD 30px */
}

@media (max-width: 767px) {
  /* SP 閉時 padding-bottom 24px（.fq__q の SP 値と同じ） */
  .fq__item.is-closing .fq__q { padding-bottom: 1.5rem; }

  /* ★ SP のモーダルは XD に正本が無い（SPアートボードにモーダル図版なし）。
     PC を縦1列へ落とし、文字サイズ・余白は同セクションの SP カードの値に合わせた実装判断。
     非表示にすると SP からイベント詳細に到達できなくなるため出している */
  .evm__inner { padding: 1.25rem 0.9375rem 1.875rem; }

  .evm__close-svg {
    width: 1.375rem;
    height: 1.375rem;
    stroke-width: 0.125rem;
  }

  .evm__panel {
    grid-template-columns: 1fr;
    row-gap: 1.25rem;
    margin-top: 1.25rem;
    padding: 1.25rem;
  }

  .evm__figure { aspect-ratio: 345 / 195; } /* SP カードのサムネイル比に合わせる */

  .evm__tag {
    padding: 0.2521rem 0.1875rem 0.2479rem 0.3125rem;
    font-size: 0.75rem;
    letter-spacing: 0.15rem;
  }

  .evm__title {
    margin-top: 0.94031rem;
    font-size: 1.25rem;
    letter-spacing: 0.0625rem;
    line-height: 1.875rem;
  }

  .evm__rule { margin-top: 1.0625rem; }

  .evm__meta {
    gap: 1.2125rem;
    margin-top: 1.0625rem;
    font-size: 1rem;
    letter-spacing: 0.05rem;
    line-height: 1.5625rem;
  }

  .evm__lead {
    margin-top: 0.875rem;
    font-size: 0.75rem;
    line-height: 1.5625rem;
  }
}

/* ==========================================================================
   モーション（2026-09-08 追加）
   ・html.has-motion は <head> のインラインスクリプトが JS 有効かつ
     prefers-reduced-motion でない時だけ付ける。JS 無効/失敗時はこのブロックが
     丸ごと効かず、全要素が最初から表示される
   ・使うのは opacity と transform だけ。幅・高さ・余白は一切動かさないので
     文書高（scrollHeight）は JS 有無で変わらない
   ・XD に動きの定義は無いため、控えめな実装判断。派手にしない
   ========================================================================== */

/* ---- 1. hero 入場: 三角ブラー → 帯 → 人物写真 → キャッチコピー の順送り ----
   `to` を書かないキーフレーム = 終点は各要素本来の値（tri--a の opacity .6、
   各要素の transform matrix 等をそのまま活かす） */
@keyframes hero-fade { from { opacity: 0; } }
@keyframes hero-rise { from { opacity: 0; transform: translateY(1rem); } }
@keyframes hero-rise-lg { from { opacity: 0; transform: translateY(1.5rem); } }

html.has-motion .hero__tri,
html.has-motion .hero__bars {
  animation: hero-fade 0.6s ease-out both;
}
html.has-motion .hero__bars { animation-delay: 0.12s; }
html.has-motion .hero__people { animation: hero-rise-lg 0.6s cubic-bezier(0.33, 0.7, 0.3, 1) 0.28s both; }
html.has-motion .hero__headline { animation: hero-rise 0.6s cubic-bezier(0.33, 0.7, 0.3, 1) 0.45s both; }
html.has-motion .hero__side-copy { animation: hero-rise 0.5s ease-out 0.55s both; }
html.has-motion .hero__stats { animation: hero-rise 0.5s ease-out 0.62s both; }
html.has-motion .hero__event { animation: hero-rise 0.5s ease-out 0.7s both; }

/* ---- 2. スクロール時の若干のフェード（[data-fx] は index.html で見出し・主要ブロックに付与）
   app.js の IntersectionObserver が画面に入った要素へ is-in を付ける（1回だけ・戻さない）。
   終点は transform:none なので、表示後は非JSと同じ描画・重なり順に戻る */
html.has-motion [data-fx] {
  opacity: 0;
  transform: translateY(1rem);
}
html.has-motion [data-fx].is-in {
  opacity: 1;
  transform: none;
  transition: opacity 0.55s ease-out, transform 0.55s cubic-bezier(0.33, 0.7, 0.3, 1);
}

/* ---- 3. イベント詳細モーダルのエントリー導線 ----
   色・書体・角丸・padding は .et__submit の値をそのまま流用。<a> なので表示形式だけ整える */
.evm__cta {
  display: block;
  max-width: 100%;         /* SP: パネル内寸(295px)が 20rem(320px) より狭いので収める */
  margin: 2.5rem 0 0;      /* リード文との間隔（XD に該当要素なし・実装判断） */
  text-align: center;
  text-decoration: none;
}
@media (max-width: 767px) {
  .evm__cta { margin-top: 1.5rem; }
}

/* OSで「視差効果を減らす」を選んでいる利用者には、head 側でフラグを付けないが
   念のため CSS でも静止させる（JS が先にフラグを付けた後で設定が変わった場合の保険） */
@media (prefers-reduced-motion: reduce) {
  html.has-motion .hero__tri,
  html.has-motion .hero__bars,
  html.has-motion .hero__people,
  html.has-motion .hero__headline,
  html.has-motion .hero__side-copy,
  html.has-motion .hero__stats,
  html.has-motion .hero__event { animation: none; }
  html.has-motion [data-fx] { opacity: 1; transform: none; transition: none; }
}

/* モーダルの導線から #entry へ移った際にセクションへプログラム的にフォーカスを置く（tabindex=-1）。
   セクション枠に輪郭を出さない（フォーム内の各コントロールは従来どおり focus-visible で輪郭が出る） */
.et:focus { outline: 0; }

/* ====================================================================
   2026-09-09 エントリーフォーム 確認／完了表示（通知メール実装に伴う追加。XD に該当画面は無い）
   既存の .et__label / .et__control / .et__submit と同じ寸法・色を流用し、初期表示（フォーム）
   の寸法・余白には一切触れない。hidden の間は display:none で高さを持たない。
   ==================================================================== */
.et__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.et__form[hidden], .et__confirm[hidden], .et__done[hidden], .et__confirm-error[hidden] { display: none; }
.et__confirm-lead { margin: 0; font-size: 1rem; line-height: 1.625rem; color: #212121; }
.et__confirm-list { margin: 1.5rem 0 0; }
.et__confirm-list > div + div { margin-top: 1.25rem; }
.et__confirm-list dt { font-weight: 700; font-size: 1rem; line-height: 1.625rem; color: #212121; }
.et__confirm-list dd {
  margin: 0.5625rem 0 0;
  padding: 0.75rem 1.875rem;
  background: #f5f5f5;
  font-size: 1rem;
  line-height: 1.625rem;
  color: #212121;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.et__confirm-error {
  margin: 1.5rem 0 0;
  padding: 0.75rem 1.25rem;
  background: #fff3f3;
  border-left: 0.25rem solid #c0392b;
  font-size: 0.9375rem;
  line-height: 1.5rem;
  color: #8b1e12;
  white-space: pre-wrap;
}
.et__confirm-actions { flex-direction: column; align-items: center; gap: 1.25rem; }
.et__submit[disabled] { opacity: 0.6; cursor: default; }
.et__back {
  padding: 0.25rem;
  border: 0;
  background: none;
  font-family: inherit;
  font-size: 0.9375rem;
  line-height: 1.5rem;
  color: #212121;
  text-decoration: underline;
  cursor: pointer;
}
.et__done { padding: 2rem 0; text-align: center; outline: 0; }
.et__done-title { margin: 0; font-weight: 700; font-size: 1.5rem; line-height: 2.25rem; color: #005a3c; }
.et__done-text { margin: 1rem 0 0; font-size: 1rem; line-height: 1.625rem; color: #212121; }
@media (max-width: 767px) {
  .et__confirm-lead, .et__confirm-list dt, .et__done-text { font-size: 0.875rem; line-height: 1.5rem; }
  .et__confirm-list dd { margin-top: 0.4375rem; padding: 0.6875rem 0.5625rem 0.8125rem; font-size: 0.875rem; background: #ffffff; }
  .et__done-title { font-size: 1.25rem; line-height: 1.875rem; }
}