/* ==========================================================================
   CSS Custom Properties — Figma Design Tokens
   ========================================================================== */
:root {
  /* Brand Colors */
  --color-primary:       #0047d3;
  --color-primary-mid:   #216cff;
  --color-primary-light: #0a96f4;
  --color-cyan:          #00bfff;
  --color-cyan-bright:   #00eaff;
  --color-dark:          #08348b;
  --color-dark-mid:      #6C83AF;
  --color-dark-light:    #D3DAEA;

  /* Text */
  --color-text-dark:  #222;
  --color-text-mid:   #333;
  --color-text-white: #ffffff;

  /* Backgrounds */
  --color-bg-white:   #ffffff;
  --color-bg-light:   #f5f5f5;
  --color-bg-lighter: #f6f7fa;

  /* Gradients */
  --grad-blue:       linear-gradient(90deg, #0047d3 0%, #216cff 50%, #0047d3 100%);
  --grad-blue-light: linear-gradient(270deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
  --grad-number:     linear-gradient(270deg, #00bfff 0%, #16f7ff 38%, #0fe5ff 61%, #00c0ff 100%);
  --grad-entry-btn:  linear-gradient(109deg, #02e8ff 0%, #216cff 100%);
  --grad-submit-btn: linear-gradient(90deg, #216cff 0%, #0047d3 100%);

  /* Typography */
  --font-base:   'Zen Kaku Gothic New', 'Noto Sans JP', sans-serif;
  --font-accent: 'Euphoria Script', cursive;
  --font-line:   'LINE Seed JP', 'Zen Kaku Gothic New', sans-serif;

  /* Layout */
  --container-max-width: 1100px;
  --header-height-pc:    90px;
  --header-height-sp:    68px;

  /* Transitions */
  --transition-base: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* ==========================================================================
   Base Reset
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  font-family: var(--font-base);
  font-size: 16px;
  line-height: 1.75;
  scroll-behavior: smooth;
  background-color: var(--color-bg-white);
  color: var(--color-text-mid);
  /* メニュー開閉でスクロールバーが消えても幅が変わらないようガターを常時確保
     → 固定ヘッダー等が左右にズレるのを防ぐ */
  scrollbar-gutter: stable;
}

body { overflow-x: hidden; }

a { color: inherit; text-decoration: none; transition: var(--transition-base); }

ul, ol { list-style: none; }

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

/* ==========================================================================
   Layout (l-*)
   ========================================================================== */
.l-wrapper { display: flex; flex-direction: column; min-height: 100vh; }

.l-container {
  width: 100%;
  max-width: var(--container-max-width);
  margin-right: auto;
  margin-left: auto;
}

/* ---- Header ---- */
.l-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: transparent;
  z-index: 1000;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}


.l-header__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  padding: 18px 20px 0;
  gap: 12px;
}

.l-header__right {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.l-header__logo { flex-shrink: 0; }

.l-header__logo-link {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  background: white;
  border-radius: 8px;
  padding: 10px 20px;
  height: 72px;
  box-shadow: 0 2px 8px rgba(8, 52, 139, 0.08);
  transition: var(--transition-base);
}

.l-header__logo-link:hover {
  box-shadow: 0 4px 14px rgba(8, 52, 139, 0.18);
}

.l-header__logo-img {
  height: 43px;
  width: auto;
  flex-shrink: 0;
}

.l-header__logo-fallback {
  font-size: 0.88rem;
  font-weight: bold;
  color: var(--color-dark);
  white-space: nowrap;
}

.l-header__logo-recruit {
  font-family: var(--font-line);
  font-size: 1rem;
  font-weight: bold;
  color: var(--color-dark);
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Main */
.l-main { flex: 1; }

/* Footer */
.l-footer {
  position: relative;
  min-height: 90px;
  background: linear-gradient(270deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
  color: var(--color-text-white);
  padding: 28px 0;
}

.l-footer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
}

.l-footer__links {
  position: absolute;
  right: 33px;
  bottom: 25px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: center;
}

.l-footer__links a {
  font-size: 0.88rem;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.l-footer__links a::after {
  content: '';
  width: 11px;
  height: 11px;
  background: url('assets/extlink.svg') no-repeat center / contain;
  flex-shrink: 0;
}

.l-footer__links a:hover { opacity: 1; text-decoration: underline; }

.l-footer__copyright {
  position: absolute;
  left: 33px;
  bottom: 25px;
  font-size: 0.88rem;
}

/* ==========================================================================
   Components (c-*)
   ========================================================================== */

/* ---- Section Heading ---- */
.c-section-head { margin: 0 0 30px 20px; }

.c-section-head--light .c-section-label { color: var(--color-cyan-bright); }
.c-section-head--dark .c-section-label  { color: var(--color-cyan-bright); }
.c-section-head--gray .c-section-label  { color: var(--color-cyan-bright); }

.c-section-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-line);
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 14px;
}

.c-section-label::before {
  content: '';
  display: inline-block;
  width: 29px;
  height: 29px;
  background: url('assets/icon-tithead.svg') no-repeat center / contain;
  flex-shrink: 0;
}

.c-section-title {
  font-size: 3.45rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

.c-section-title--white { color: var(--color-text-white); }
.c-section-title--dark  { color: var(--color-text-dark); }

/* ---- Hamburger Button (Group 33: white rounded square, 3 navy lines) ---- */
.c-btn-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  background: white;
  border: none;
  cursor: pointer;
  width: 72px;
  height: 72px;
  border-radius: 8px;
  z-index: 1150; /* ドロワー(1200)より下。開いたら背面に隠れ、閉じるは中のバツで行う */
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(8, 52, 139, 0.08);
  transition: var(--transition-base);
}

.c-btn-menu:hover {
  box-shadow: 0 4px 14px rgba(8, 52, 139, 0.18);
}

.c-btn-menu__line {
  display: block;
  position: relative;
  width: 24px;
  height: 14px;
}

.c-btn-menu__line::before,
.c-btn-menu__line::after {
  content: '';
  position: absolute;
  left: 0;
  width: 24px;
  height: 2px;
  background-color: var(--color-dark);
  transition: var(--transition-base);
}

.c-btn-menu__line::before { top: 0; }
.c-btn-menu__line::after  { bottom: 0; }

.c-btn-menu__mid {
  position: absolute;
  top: 6px;
  left: 0;
  width: 16px;
  height: 2px;
  background-color: var(--color-dark);
  transition: var(--transition-base);
}

.c-btn-menu:hover .c-btn-menu__mid {
  left: 8px;
}

.c-btn-menu[aria-expanded="true"] .c-btn-menu__mid {
  opacity: 0;
}
.c-btn-menu[aria-expanded="true"] .c-btn-menu__line::before {
  top: 6px;
  transform: rotate(45deg);
}
.c-btn-menu[aria-expanded="true"] .c-btn-menu__line::after {
  bottom: 6px;
  transform: rotate(-45deg);
}

/* ---- Entry Button (Header) ---- */
.c-btn-entry-header {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 34px;
  background: transparent;
  color: var(--color-text-white);
  font-family: var(--font-line);
  font-size: 1rem;
  font-weight: bold;
  padding: 24px 42px 24px 42px;
  border-radius: 8px;
  white-space: nowrap;
  letter-spacing: 0.06em;
  flex-shrink: 0;
  transition: var(--transition-base);
}

.c-btn-entry-header::before,
.c-btn-entry-header::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  z-index: -1;
}

.c-btn-entry-header::before { background: var(--grad-entry-btn); }

.c-btn-entry-header::after {
  background: #0b48bf;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.c-btn-entry-header:hover::after {
  opacity: 1;
}

.c-btn-entry-header .c-btn-entry-header__arrow {
  width: 14px;
  height: auto;
  display: inline-block;
  flex-shrink: 0;
}

/* ---- Tab Buttons ---- */
.c-btn-tab {
  padding: 8px 20px;
  background-color: var(--color-dark-light);
  color: var(--color-dark-mid);
  border: none;
  font-weight: 700;
  font-size: 1.12rem;
  cursor: pointer;
  transition: var(--transition-base);
  border-radius: 8px 8px 0 0;
}

.c-btn-tab.is-active {
  background: var(--color-primary-mid);
  color: var(--color-bg-white);
}

/* ---- Submit Button ---- */
.c-btn-submit {
  display: inline-block;
  background: var(--grad-submit-btn);
  color: var(--color-text-white);
  border: none;
  padding: 16px 60px;
  font-size: 1.05rem;
  font-weight: 700;
  cursor: pointer;
  border-radius: 8px;
  letter-spacing: 0.06em;
  transition: var(--transition-base);
  box-shadow: 0 4px 18px rgba(33, 108, 255, 0.3);
}

.c-btn-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(33, 108, 255, 0.45);
}

/* ---- Badges ---- */
.c-badge-required {
  font-size: 0.72rem;
  padding: 2px 7px;
  border-radius: 3px;
  font-weight: 700;
  background-color: var(--color-primary-light);
  color: #fff;
  vertical-align: middle;
  margin-left: 8px;
}

.c-badge-optional {
  font-size: 0.72rem;
  padding: 2px 7px;
  border-radius: 3px;
  font-weight: 700;
  background-color: #cbd5e1;
  color: #475569;
  vertical-align: middle;
  margin-left: 8px;
}

/* ==========================================================================
   Navigation Drawer (right-slide, 450px)
   ========================================================================== */
.l-header__nav {
  position: fixed;
  top: 0;
  right: 0;
  width: min(360px, 100vw);
  height: 100vh;
  padding: 0 20px 0 30px;
  background-color: var(--color-bg-white);
  overflow-y: auto;
  transform: translateX(min(360px, 100vw));
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1200;
}

.l-header__nav.is-open {
  transform: translateX(0);
}

.l-header__nav-head {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 18px 0 18px;
}

/* Figma: 角丸ダークブルーの正方形ボタン + 白いバツ (node 479:2294) */
.l-header__nav-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  background: #08348b;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  position: relative;
  transition: var(--transition-base);
}

.l-header__nav-close:hover { background: #0a3ea6; }

.l-header__nav-close span {
  display: block;
  width: 25px;
  height: 2px;
  background-color: #fff;
  position: absolute;
  border-radius: 1px;
}

.l-header__nav-close span:first-child { transform: rotate(30deg); }
.l-header__nav-close span:last-child  { transform: rotate(-30deg); }

.l-header__nav-list {
  display: flex;
  flex-direction: column;
  padding: 8px 0 40px;
}

/* Figma: 英語ラベル(シアン) + 日本語ラベル(濃色) + 右端に矢印 / 下線 */
.l-header__nav-item a {
  position: relative;
  display: block;
  padding: 12px 50px 12px 0;
  border-bottom: 1px solid var(--color-cyan-bright);
  color: var(--color-text-dark);
  transition: var(--transition-base);
}

.l-header__nav-en {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: #00eaff;
}

.l-header__nav-ja {
  display: block;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.05em;
  color: var(--color-text-dark);
}

/* 右端の矢印アイコン (Figma vector 82) */
.l-header__nav-item a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 18px;
  width: 16px;
  height: 9px;
  transform: translateY(-50%);
  transition: right 0.25s ease;
  background: url("assets/arrow2.svg") no-repeat center / contain;
}

.l-header__nav-item a:hover::after { right: 12px; }

.l-header__nav-item--sub {
  margin-top: 24px;
  padding: 0 18px;
  text-align: center;
}

/* サブ項目リンク：閉じるボタン(.c-modal__close)と同様のスタイル
   デフォルト：淡色地＋グラデ文字 / ホバー：グラデ地＋白文字 */
.l-header__nav-item--sub a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--color-primary-light);
  border-radius: 7px;
  background: var(--color-bg-lighter);
  padding: 14px;
  /* 背景はグラデ(補間不可で瞬時切替)のため、テキスト/アイコンと
     タイミングを揃えるべく全要素のtransitionは付けず同時に切り替える */
}

.l-header__nav-item--sub a span {
  font-family: var(--font-base);
  font-weight: 500;
  font-size: 0.9rem;
  background: linear-gradient(-90deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* 親の矢印(a::after)はサブ項目では非表示 */
.l-header__nav-item--sub a::after { display: none; }

/* 外部リンクアイコン：インラインSVGを currentColor で色替え
   （デフォルト #00bfff / ホバー 白）— テキストのグラデとは別に色制御 */
.l-header__extlink {
  flex-shrink: 0;
  color: #00bfff;
}

.l-header__nav-item--sub a:hover,
.l-header__nav-item--sub a:focus-visible {
  background: linear-gradient(-90deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
}

.l-header__nav-item--sub a:hover span,
.l-header__nav-item--sub a:focus-visible span {
  -webkit-text-fill-color: var(--color-text-white);
  color: var(--color-text-white);
}

.l-header__nav-item--sub a:hover .l-header__extlink,
.l-header__nav-item--sub a:focus-visible .l-header__extlink {
  color: var(--color-text-white);
}

/* Overlay */
.l-header__overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 1100;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}

.l-header__overlay.is-visible {
  opacity: 1;
  visibility: visible;
}

/* ==========================================================================
   Project Sections (p-*)
   ========================================================================== */

/* ---- MV (Hero) ---- */
.p-mv {
  position: relative;
  /* -15px のマージン分を足して、初期表示は100vhちょうどヒーローだけにする */
  min-height: calc(100vh + 15px);
  overflow: hidden;
  background: #0a50b8;
  /* p-message の角丸の裏にヒーロー背景を回り込ませる */
  margin-bottom: -15px;
}

/* Slideshow */
.p-mv__slideshow {
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* 背景スタック / 切抜スタック（各画像を個別にフェード） */
.p-mv__bgs   { position: absolute; inset: 0; z-index: 1; }
.p-mv__fronts { position: absolute; inset: 0; z-index: 3; pointer-events: none; }

.p-mv__bg,
.p-mv__front {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  opacity: 0;
  transition: opacity 1.2s ease-in-out;
}

.p-mv__bg.is-active,
.p-mv__front.is-active { opacity: 1; }

/* 全スライド共通のラインレイヤー（背景の上・切抜の下で固定） */
.p-mv__lines {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.p-mv__line-svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* dash セグメントが線上を流れる */
.p-mv__line-glow {
  stroke-dasharray: 2 4;
  stroke-dashoffset: 1;
  animation: p-mv-line-flow 8s linear infinite;
}

@keyframes p-mv-line-flow {
  from { stroke-dashoffset: 8; }
  to   { stroke-dashoffset: 4; }
}

@media (prefers-reduced-motion: reduce) {
  .p-mv__line-glow { animation: none; stroke-dasharray: none; opacity: 0.6; }
}

/* Inner content */
.p-mv__inner {
  position: relative;
  z-index: 5;
  min-height: 100vh;
  display: flex;
  align-items: end;
  padding-top: 100px;
  /* 下端からの距離を画面高さ基準で指定（1280×810時に120px = 120/810） */
  padding-bottom: 7vh;
}

/* ヒーローコピーの左オフセット（タブレット以下すべて。デスクトップは992pxで0にリセット） */
.p-mv__content { max-width: 500px; margin-left: 3vh; }

/* コピーSVG1はPCのみ表示（モバイルはテキスト） */
.p-mv__copy-svg { display: none; }

/* コピーSVG2はモバイルでも表示。p-mv__content の上に重ねて配置 */
.p-mv__copy-svg2 {
  position: absolute;
  z-index: 6; /* .p-mv__inner の z-index:5 より上に積み重なる */
  right: 24px;
  bottom: 22vh;
  width: auto;
  height: auto;
  max-width: 55%;
  max-height: 45%;
  pointer-events: none;
  filter: drop-shadow(0 4px 12px rgba(8, 52, 139, 0.35));
}


.p-mv__main-copy {
  font-size: clamp(2rem, 5.5vw, 3.6rem);
  font-weight: 700;
  color: var(--color-text-white);
  line-height: 1.25;
  letter-spacing: -0.03em;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.35);
  margin-bottom: 20px;
}

.p-mv__num { display: inline-block; }

.p-mv__en-copy {
  font-size: 0.8rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.75);
  letter-spacing: 0.06em;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}


/* ---- Message ---- */
.p-message {
  position: relative;
  z-index: 1;
  background: linear-gradient(270deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
  padding: 150px 100px;
  border-radius: 15px 15px 0 0;
}

/* 右下端：次セクション(p-strengths)のグレーが凹型にはみ出す */
.p-message::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 130px;
  height: 130px;
  background: radial-gradient(circle 130px at top left, transparent 0 129px, var(--color-bg-light) 130px);
  pointer-events: none;
  z-index: 2;
}

.p-message__inner { position: relative; z-index: 1; }

/* グラデ背景の上に配置する装飾画像（個別にゆっくり上下動） */
.p-message__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.p-message__bg-item {
  position: absolute;
  height: auto;
  will-change: transform;
  animation: p-message-float 6s ease-in-out infinite;
}

/* 上段中央 */
.p-message__bg-item--1 {
  width: min(200px, 15.625vw);
  top: min(80px, 6.25vw);
  left: calc(50% - min(150px, 11.71875vw));
  animation-duration: 7s;
}

/* 中段右 */
.p-message__bg-item--2 {
  width: min(280px, 21.875vw);
  top: 55%;
  right: min(50px, 3.90625vw);
  animation-duration: 8s;
  animation-delay: -2s;
}

/* 下段左 */
.p-message__bg-item--3 {
  width: min(180px, 14.0625vw);
  bottom: min(270px, 21.09375vw);
  left: min(90px, 7.03125vw);
  animation-duration: 6.5s;
  animation-delay: -1s;
}

@keyframes p-message-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-20px); }
}

.p-message__left,
.p-message__right {
  display: flex;
  flex-direction: column;
}

.p-message__left { gap: 46px; }
.p-message__right { gap: 32px; margin-top: 40px; }

.p-message__logo-3d {
  width: 100%;
  height: auto;
  margin-inline: auto;
}

.p-message__img-wrap {
  position: relative;
  flex-shrink: 0;
  border-radius: 8px;
}

.p-message__ceo {
  width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
}

.p-message__text-area { color: var(--color-text-white); }

.p-message__deco-script {
  position: absolute;
  bottom: 12px;
  left: -22px;
  z-index: 2;
  font-family: var(--font-accent);
  font-size: clamp(36px, 8vw, 94px);
  background: linear-gradient(90deg, #b2f9ff, #00d0ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  transform: rotate(-6deg);
  transform-origin: left;
  line-height: 1;
  pointer-events: none;
}

.p-message__text {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.9;
  color: rgba(255, 255, 255, 0.92);
}

.p-message__sig {
  font-size: 18px;
  font-weight: 700;
  color: var(--color-text-white);
  text-align: right;
  padding-top: 36px;
}

/* ---- 当社の強み ---- */
.p-strengths {
  position: relative;
  background-color: var(--color-bg-light);
  padding: 70px 0;
}

/* p-message と p-strengths の境界に配置する人物画像（中央・1280px時 幅1120px） */
.p-strengths__people {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, -50%);
  width: 87.5vw;
  max-width: 1120px;
  z-index: 5;
  pointer-events: none;
}

.p-strengths__people img {
  width: 100%;
  height: auto;
}

/* 背景を流れるアニメーションライン（中央・レスポンシブ） */
.p-strengths > .l-container {
  position: relative;
  z-index: 1;
}

.p-strengths__lines {
  position: absolute;
  left: -4%;
  top: 50%;
  transform: translateY(-50%);
  width: 105%;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.p-strengths__line-svg {
  display: block;
  width: 100%;
  height: auto;
}

/* 下地ラインは非表示 */
/* .p-strengths__line-base {
  display: none;
} */

/* 光るセグメントが線上を流れる */
.p-strengths__line-glow {
  stroke-dasharray: 4 2;
  stroke-dashoffset: 1;
  animation: p-strengths-line-flow 8s linear infinite;
}

@keyframes p-strengths-line-flow {
  from { stroke-dashoffset: 6; }
  to   { stroke-dashoffset: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .p-strengths__line-glow {
    animation: none;
    stroke-dasharray: none;
    opacity: 0.5;
  }
}

/* 左上端：前セクション(p-message)の青が凹型にはみ出す */
.p-strengths::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 130px;
  height: 130px;
  background: radial-gradient(circle 130px at bottom right, transparent 0 129px, #0a96f4 130px);
  pointer-events: none;
  z-index: 2;
}

/* 右下端：次セクション(p-numbers)の青が凹型にはみ出す */
.p-strengths::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 130px;
  height: 130px;
  background: radial-gradient(circle 130px at top left, transparent 0 129px, #0047d3 130px);
  pointer-events: none;
  z-index: 2;
}

.p-strengths__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 60px;
  margin: 0 20px;
}

.c-card-strength {
  position: relative;
  background-color: var(--color-bg-white);
  border-radius: 10px;
  margin-top: 120px;
  padding: 150px 16px 30px 26px;
  filter: drop-shadow(0 0 15px rgba(8, 52, 139, 0.20));
  transition: var(--transition-base);
}

.c-card-strength:nth-child(1),
.c-card-strength:nth-child(3) { margin: 160px 0 0; }
.c-card-strength:nth-child(2) { margin: 80px 0; }

/* 上部の白い円盤＋グラデーションリング */
.c-card-strength__ring {
  position: absolute;
  top: -120px;
  left: 50%;
  transform: translateX(-50%);
  width: 84%;
  max-width: 265px;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: var(--color-bg-white);
  display: flex;
  align-items: center;
  justify-content: center;
}

.c-card-strength__ring::before {
  content: '';
  position: absolute;
  inset: 6.2%;
  background: url('assets/strength-ring.svg') no-repeat center / contain;
  pointer-events: none;
}

.c-card-strength__num {
  position: absolute;
  top: 50%;
  left: 9.4%;
  transform: translate(-50%, -50%);
  width: 14.3%;
  height: 14.3%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--color-primary-mid);
  color: var(--color-text-white);
  font-size: 1.25rem;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 3px;
}

.c-card-strength__title {
  position: relative;
  z-index: 1;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-dark);
  text-align: center;
  line-height: 1.45;
}

.c-card-strength__title-num {
  font-weight: 900;
  font-size: 1.5rem;
}

.c-card-strength__text {
  font-size: 1rem;
  font-weight: 500;
  color: var(--color-text-mid);
  line-height: 1.875;
}

/* ---- 数字で知る ---- */
.p-numbers {
  position: relative;
  /* 左上端に前セクション(p-strengths)のグレーを凹型ではみ出させる背景レイヤー＋本体グラデ */
  background:
    radial-gradient(circle 130px at bottom right, transparent 0 129px, var(--color-bg-light) 130px) left top / 130px 130px no-repeat,
    var(--grad-blue);
  padding: 70px 0;
  overflow: hidden;
}

/* 背景の装飾円：1280px時に元サイズ(775px)、以降は画面幅に比例して拡大 */
.p-numbers::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('assets/bg-circle1.svg') no-repeat right -100px top;
  background-size: 60.5% auto;
  opacity: 0;
  transition: opacity 1.2s ease;
  pointer-events: none;
  z-index: 0;
}

.p-numbers.is-inview::before {
  opacity: 1;
}

.p-numbers > .l-container {
  position: relative;
  z-index: 1;
}

/* ==========================================================================
   セクション間のインターロック角丸（p-numbers 以下）
   上セクションの右下に下セクションの色、下セクションの左上に上セクションの色を
   凹型(半径130px)ではみ出させ、境界をS字にかみ合わせる
   ========================================================================== */
.p-numbers::after,
.p-member::before, .p-member::after,
.p-environment::before, .p-environment::after,
.p-recruit::before,
.p-entry::before {
  content: '';
  position: absolute;
  width: 130px;
  height: 130px;
  pointer-events: none;
  z-index: 2;
}

/* 右下端（下セクションの色がはみ出す） */
.p-numbers::after,
.p-member::after,
.p-environment::after {
  right: 0;
  bottom: 0;
}

/* 左上端（上セクションの色がはみ出す） */
.p-member::before,
.p-environment::before,
.p-recruit::before,
.p-entry::before {
  left: 0;
  top: 0;
}

/* numbers(青) ↔ member(淡グレー) */
.p-numbers::after    { background: radial-gradient(circle 130px at top left,     transparent 0 129px, var(--color-bg-lighter) 130px); }
.p-member::before    { background: radial-gradient(circle 130px at bottom right, transparent 0 129px, #0047d3 130px); }
/* member(淡グレー) ↔ environment(青) */
.p-member::after     { background: radial-gradient(circle 130px at top left,     transparent 0 129px, #0047d3 130px); }
.p-environment::before { background: radial-gradient(circle 130px at bottom right, transparent 0 129px, var(--color-bg-lighter) 130px); }
/* environment(青) ↔ recruit(淡グレー) */
.p-environment::after { background: radial-gradient(circle 130px at top left,     transparent 0 129px, var(--color-bg-light) 130px); }
.p-recruit::before   { background: radial-gradient(circle 130px at bottom right, transparent 0 129px, #0047d3 130px); }
/* recruit(淡グレー) ↔ entry(淡青) */
.p-entry::before     { background: radial-gradient(circle 130px at bottom right, transparent 0 129px, var(--color-bg-light) 130px); }

.p-numbers__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin: 70px 20px 0;
}

.c-card-number {
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: var(--color-bg-white);
  background-image: var(--num-icon, none);
  background-repeat: no-repeat;
  background-position: var(--num-icon-pos, right 18px bottom 18px);
  background-size: var(--num-icon-size, 40%);
  border-radius: 10px;
  padding: 12px 22px 12px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

/* カードごとのアイコン（背景画像）— 位置・サイズは個別に調整可 */
.c-card-number:nth-child(1)  { --num-icon: url('assets/num-founded.png');   --num-icon-size: 28%; --num-icon-pos: left 46px bottom 20px; }
.c-card-number:nth-child(2)  { --num-icon: url('assets/num-makers.png');    --num-icon-size: 30%; --num-icon-pos: left 20px bottom 22px; }
.c-card-number:nth-child(3)  { --num-icon: url('assets/num-locations.png'); --num-icon-size: 42%; --num-icon-pos: right 10px top 10px; }
.c-card-number:nth-child(4)  { --num-icon: url('assets/num-holidays.png');  --num-icon-size: 22%; --num-icon-pos: left 30px bottom 18px; }
.c-card-number:nth-child(5)  { --num-icon: url('assets/num-employees.png'); --num-icon-size: 28%; --num-icon-pos: left 10px bottom 0px; }
.c-card-number:nth-child(6)  { --num-icon: url('assets/num-gender.png');    --num-icon-size: 45%; --num-icon-pos: right 20px top 20px; }
.c-card-number:nth-child(7)  { --num-icon: url('assets/num-tenure.png');    --num-icon-size: 36%; --num-icon-pos: right 30px top 0px; }
.c-card-number:nth-child(8)  { --num-icon: url('assets/num-paidleave.png'); --num-icon-size: 34%; --num-icon-pos: left 12px bottom 10px; }
.c-card-number:nth-child(9)  { --num-icon: url('assets/num-childcare.png'); --num-icon-size: 30%; --num-icon-pos: right 12px top 10px; }
.c-card-number:nth-child(10) { --num-icon: url('assets/num-age.png');       --num-icon-size: 16%; --num-icon-pos: right 28px top 16px; }

.c-card-number__head {
  margin-bottom: 6px;
}

.c-card-number:nth-child(n+3) .c-card-number__head {
  margin-bottom: 10px;
}

.c-card-number__label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--color-text-mid);
}

.c-card-number__label::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-primary-mid);
  flex-shrink: 0;
}

.c-card-number__note {
  display: block;
  font-size: 1rem;
  color: var(--color-text-mid);
  margin-top: -4px;
  padding-left: 16px;
}

.c-card-number__body {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 8px;
  flex: 1;
  padding: 0 10px 10px;
}

/* カードごとの数値の揃え位置 */
.c-card-number:nth-child(1) .c-card-number__body,
.c-card-number:nth-child(2) .c-card-number__body,
.c-card-number:nth-child(4) .c-card-number__body,
.c-card-number:nth-child(5) .c-card-number__body,
.c-card-number:nth-child(8) .c-card-number__body {
  justify-content: flex-end;
}

.c-card-number__val {
  font-family: var(--font-line);
  font-size: clamp(4rem, 9vw, 8rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.3rem;
  background: var(--grad-number);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  white-space: nowrap;
}

.c-card-number:nth-child(3) .c-card-number__val {
  letter-spacing: 5px;
}
/*
.c-card-number:nth-child(n+3) .c-card-number__val {
  font-size: clamp(4rem, 9vw, 8rem);
}
*/
.c-card-number__unit {
  font-family: var(--font-base);
  font-size: 2.19rem;
  font-weight: 700;
  letter-spacing: 0;
  padding-left: 0.3rem;
  color: var(--color-primary-mid);
  -webkit-text-fill-color: var(--color-primary-mid);
}

.c-card-number__unit--sep {
  font-size: 0.85em;
  color: inherit;
  -webkit-text-fill-color: transparent;
  margin-left: -20px;
  margin-right: -20px;
}

/* 男女比の円グラフ */
.c-card-number__pie {
  position: relative;
  width: 40%;
  max-width: 120px;
  aspect-ratio: 1;
  flex-shrink: 0;
  border-radius: 50%;
  background: conic-gradient(var(--color-primary-mid) 0 60%, #2ebfff 60% 100%);
}

.c-card-number__pie-male,
.c-card-number__pie-female {
  position: absolute;
  font-family: var(--font-line);
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--color-text-white);
  line-height: 1;
}

.c-card-number__pie-male   { top: 58%; left: 26%; transform: translate(-50%, -50%); }
.c-card-number__pie-female { top: 34%; left: 68%; transform: translate(-50%, -50%); }

.c-card-number__pie small { font-size: 0.55em; }

/* ---- 社員を知る ---- */
.p-member {
  position: relative;
  background-color: var(--color-bg-lighter);
  padding: 70px 0;
}

/* l-container 右上の装飾テキスト（上に20pxはみ出す） */
.p-member > .l-container {
  position: relative;
  z-index: 1;
}

/* 背景を流れるアニメーションライン（中央・レスポンシブ） */
.p-member__lines {
  position: absolute;
  left: -4%;
  top: 50%;
  transform: translateY(-50%);
  width: 105%;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.p-member__line-svg {
  display: block;
  width: 100%;
  height: auto;
}

/* 光るセグメントが線上を流れる */
.p-member__line-glow {
  stroke-dasharray: 4 2;
  stroke-dashoffset: 1;
  animation: p-member-line-flow 6s linear infinite;
}

@keyframes p-member-line-flow {
  from { stroke-dashoffset: 6; }
  to   { stroke-dashoffset: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .p-member__line-glow {
    animation: none;
    stroke-dasharray: none;
    opacity: 0.5;
  }
}

.p-member__deco-txt {
  position: absolute;
  top: -50px;
  right: 0;
  width: 127px;
  height: auto;
  z-index: 1;
  pointer-events: none;
}

.p-member__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 50px;
  margin: 70px 20px 0;
}

/* Figma staff-card (node 495:3422): 全面写真＋下部グラデ＋白帯クオート */
.c-card-member {
  position: relative;
  aspect-ratio: 317 / 410;
  border-radius: 10px;
  overflow: hidden;
  transition: var(--transition-base);
  cursor: pointer;
}

/* 写真（フルブリード） */
.c-card-member__photo {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #b0c8f0;
  overflow: hidden;
}

.c-card-member__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* ホバー：カードは動かさず画像のみ5%拡大 */
.c-card-member:hover .c-card-member__photo img {
  transform: scale(1.05);
}

/* 下部のグラデーションオーバーレイ（透明→濃青） */
.c-card-member::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(33, 108, 255, 0) 50%, #0b48bf 100%);
  pointer-events: none;
}

/* テキストオーバーレイ */
.c-card-member__overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: 0 5px 18px;
}

/* クオート：白帯＋青グラデ文字（1行ずつ帯） */
.c-card-member__quote {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 24px;
}

.c-card-member__quote span {
  position: relative;
  display: inline-block;
  padding: 0 4px;
  font-family: var(--font-base);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.2;
  background: linear-gradient(90deg, var(--color-dark), var(--color-primary-mid));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 白い帯（文字の背面） */
.c-card-member__quote span::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--color-bg-white);
}

.c-card-member__meta {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
}

.c-card-member__year,
.c-card-member__dept {
  font-size: 0.875rem;
  line-height: 1.2;
  color: var(--color-text-white);
  font-weight: 500;
}

.c-card-member__arrow {
  position: relative;
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 27px;
  border-radius: 8px;
  background: var(--grad-entry-btn);
  flex-shrink: 0;
  overflow: hidden;
}

/* 反転グラデ（青→シアン）を重ね、ホバーで opacity フェード */
.c-card-member__arrow::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(109deg, #216cff 0%, #02e8ff 100%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.c-card-member:hover .c-card-member__arrow::before {
  opacity: 1;
}

.c-card-member__arrow img {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 9px;
}

/* ==========================================================================
   c-modal — 社員を知るポップアップ（Figma node 347:18）
   ========================================================================== */
.c-modal {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: none;
  overflow-y: auto;
  padding: 20px;
}

.c-modal.is-open {
  display: grid;
  /* 収まる時は中央、はみ出す時は上寄せにフォールバック（上部が切れない） */
  align-items: safe center;
  justify-items: center;
}

.c-modal__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(4, 20, 60, 0.6);
  animation: c-modal-fade 0.25s ease;
}

.c-modal__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  width: min(985px, 100%);
  background: var(--color-bg-lighter);
  border-radius: 30px;
  padding: 56px 56px 130px 65px;
  box-shadow: 0 24px 60px rgba(4, 20, 60, 0.35);
  animation: c-modal-pop 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* 写真＋本文の2カラム（ダイアログは内容の高さに伸びる） */
.c-modal__scroll {
  display: flex;
  gap: 44px;
  align-items: flex-start;
}

@keyframes c-modal-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes c-modal-pop {
  from { opacity: 0; transform: translateY(16px) scale(0.98); }
  to   { opacity: 1; transform: none; }
}

/* 背景リング（左下・番号の後ろ） */
.c-modal__ring {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 300px;
  height: auto;
  z-index: 0;
  pointer-events: none;
}

/* 番号（左下・シアン） */
.c-modal__number {
  position: absolute;
  left: 26px;
  bottom: 30px;
  z-index: 1;
  font-family: 'Alexandria', sans-serif;
  font-weight: 500;
  font-size: 75px;
  line-height: 1;
  color: var(--color-cyan-bright);
}

/* Member 縦ラベル＋アイコン（右上） */
.c-modal__side {
  position: absolute;
  top: 20px;
  right: 16px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11px;
}

.c-modal__side-icon {
  width: 29px;
  height: auto;
  transform: rotate(90deg);
}

.c-modal__side-label {
  writing-mode: vertical-rl;
  font-family: var(--font-line);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.14em;
  color: var(--color-cyan-bright);
}

/* 写真カード（左・葉っぱ型角丸） */
.c-modal__photo {
  position: relative;
  z-index: 1;
  flex: 0 0 317px;
  width: 317px;
  max-width: 40%;
  aspect-ratio: 317 / 410;
  border-radius: 82px 10px 82px 10px;
  overflow: hidden;
}

.c-modal__photo-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.c-modal__photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(33, 108, 255, 0) 50%, #0b48bf 100%);
  pointer-events: none;
}

.c-modal__photo-meta {
  position: absolute;
  left: 20px;
  bottom: 16px;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--color-text-white);
  font-size: 16px;
}

/* 本文エリア（右） */
.c-modal__content {
  flex: 1 1 auto;
  min-width: 0;
}

/* クオート：青グラデ帯＋白文字 */
.c-modal__quote {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 20px;
}

.c-modal__quote span {
  display: inline-block;
  padding: 2px 8px;
  background: linear-gradient(90deg, var(--color-primary-mid), var(--color-primary));
  color: var(--color-text-white);
  font-family: var(--font-base);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
}

.c-modal__body {
  color: var(--color-text-mid);
  font-size: 16px;
  line-height: 1.75;
}

/* 閉じるボタン（デフォルト：淡色地＋グラデ文字 / ホバー：グラデ地＋白文字） */
.c-modal__close {
  position: absolute;
  left: 50%;
  bottom: 40px;
  transform: translateX(-50%);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 42px;
  border: 1px solid var(--color-primary-light);
  border-radius: 7px;
  background: var(--color-bg-lighter);
  cursor: pointer;
  transition: background 0.3s ease;
}

.c-modal__close span {
  font-family: var(--font-base);
  font-weight: 500;
  font-size: 16px;
  background: linear-gradient(-90deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: color 0.3s ease;
}

/* ホバー：グラデ地＋白文字（閉じるコンポーネント バリアント2） */
.c-modal__close:hover,
.c-modal__close:focus-visible {
  background: linear-gradient(-90deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
}

.c-modal__close:hover span,
.c-modal__close:focus-visible span {
  -webkit-text-fill-color: var(--color-text-white);
  color: var(--color-text-white);
}

/* レスポンシブ：狭い画面では縦積み */
@media screen and (max-width: 767px) {
  .c-modal__dialog {
    padding: 48px 24px 96px;
  }

  .c-modal__scroll {
    flex-direction: column;
    gap: 24px;
  }

  .c-modal__photo {
    flex-basis: auto;
    width: 100%;
    max-width: none;
    margin: 0 auto;
  }

  /* スマホ：ダイアログ左上（写真より上のフレーム部分）に横並びで配置。
     アイコンは無回転(0deg)の横向きに、ラベルは通常の横書きに戻す */
  .c-modal__side {
    top: 14px;
    left: 24px;
    right: auto;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    z-index: 2; /* 写真(z-index:1)と重なる時は side を前面に */
  }

  .c-modal__side-icon {
    transform: rotate(0deg);
  }

  .c-modal__side-label {
    writing-mode: horizontal-tb;
  }

  .c-modal__number {
    font-size: 56px;
    bottom: 24px;
  }

  .c-modal__quote span {
    font-size: 17px;
  }
}

/* ---- 環境を知る ---- */
.p-environment {
  position: relative;
  background: var(--grad-blue);
  padding: 70px 0;
}

.p-environment__inner {
  display: flex;
  flex-direction: column;
  gap: 160px;
}

.p-environment__media {
  flex: 1 1 48%;
  min-width: 0;
}

.p-environment__pic {
  width: 100%;
  height: auto;
  border-radius: 16px;
  margin-left: 20px;
}

.p-environment__content {
  flex: 1 1 50%;
  min-width: 0;
}

.p-environment__content .c-section-head {
  margin-left: 0;
}

/* 福利厚生：シンプルなリスト */
.c-benefit-list {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.c-benefit-list__item {
  color: var(--color-text-white);
}

.c-benefit-list__term {
  display: block;
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 4px;
}

.c-benefit-list__desc {
  display: block;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.75;
}

/* ---- 募集要項 ---- */
.p-recruit {
  position: relative;
  background-color: var(--color-bg-light);
  padding: 70px 0;
}

/* 背景を流れるアニメーションライン（セクション下端から上に50px） */
.p-recruit > .l-container {
  position: relative;
  z-index: 1;
}

.p-recruit__lines {
  position: absolute;
  right: 0;
  left: auto;
  bottom: 0;
  width: 100vw;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.p-recruit__line-svg {
  display: block;
  width: 100%;
  height: auto;
}

.p-recruit__line-glow {
  stroke-dasharray: 4 2;
  stroke-dashoffset: 1.5;
  animation: p-recruit-line-flow 8s linear infinite;
}

@keyframes p-recruit-line-flow {
  from { stroke-dashoffset: 6; }
  to   { stroke-dashoffset: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .p-recruit__line-glow {
    animation: none;
    stroke-dasharray: none;
    opacity: 0.5;
  }
}

.p-recruit__tabs {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 40px;
  margin-bottom: 0;
  padding-right: 70px;
}

.p-recruit__content { display: none; padding: 0 20px; }
.p-recruit__content.is-active { display: block; }

.c-table-recruit {
  width: 100%;
  background-color: var(--color-bg-white);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 10px;
  overflow: hidden;
}

.c-table-recruit th,
.c-table-recruit td {
  padding: 25px;
  border-bottom: 1px solid #d3d3d3;
  text-align: left;
  vertical-align: top;
  font-weight: 500;
  font-size: 1rem;
}

.c-table-recruit tr:last-child th,
.c-table-recruit tr:last-child td {
  border-bottom: none;
}

.c-table-recruit th {
  display: block;
  width: 100%;
  background: linear-gradient(90deg, #216cff 0%, #0b48bf 100%);
  color: var(--color-text-white);
  font-weight: 700;
  font-size: 1.13rem;
}

.c-table-recruit td { display: block; width: 100%; }

.c-table-recruit ul { padding: 0; list-style: none; }

.c-table-recruit ul li {
  margin-bottom: 6px;
  font-size: 1rem;
}

.c-table-recruit ul li:last-child { margin-bottom: 0; }

.c-table-recruit__note {
  font-size: 0.82rem;
  color: #64748b;
  margin-top: 6px;
}

/* ---- エントリー ---- */
.p-entry {
  position: relative;
  background: linear-gradient(270deg, #0a97f4 0%, #00bfff 50%, #0a96f4 100%);
  padding: 70px 0;
}

/* l-container 右上の装飾テキスト（上に50pxはみ出す・member と同様） */
.p-entry > .l-container {
  position: relative;
}

.p-entry__deco-txt {
  position: absolute;
  top: -200px;
  right: 30px;
  width: 180px;
  height: auto;
  z-index: 1;
  pointer-events: none;
}

.p-entry__lead {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.88);
  margin: 0 0 30px 20px;
  line-height: 1.8;
}

.p-entry__form {
  background-color: var(--color-bg-white);
  border-radius: 12px;
  padding: 30px 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}

.p-entry__form-row {
  display: grid;
  grid-template-columns: 200px 1fr;
  align-items: start;
  gap: 0;
  border-bottom: 1px solid rgba(8, 52, 139, 0.08);
  min-height: 72px;
}

.p-entry__form-row:last-of-type { border-bottom: none; }

.p-entry__form-label {
  display: flex;
  align-items: center;
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--color-text-mid);
  padding: 18px 16px 18px 0;
  background-color: var(--color-bg-lighter);
  padding-left: 20px;
}

.p-entry__form-input {
  padding: 14px 14px 14px 20px;
  display: flex;
  align-items: center;
}

.p-entry__form-input input[type="text"],
.p-entry__form-input input[type="email"],
.p-entry__form-input input[type="tel"],
.p-entry__form-input textarea {
  width: 100%;
  background-color: #f8fafc;
  border: 1px solid #d1d5db;
  color: var(--color-text-mid);
  padding: 10px 14px;
  font-size: 0.95rem;
  border-radius: 6px;
  font-family: var(--font-base);
  transition: var(--transition-base);
}

.p-entry__form-input input:focus,
.p-entry__form-input textarea:focus {
  outline: none;
  border-color: var(--color-primary-light);
  background-color: #fff;
  box-shadow: 0 0 0 3px rgba(10, 150, 244, 0.15);
}

.p-entry__form-input textarea { resize: vertical; min-height: 120px; }

.c-input-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 28px;
  align-items: center;
}

.c-input-radio-group label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  font-size: 0.92rem;
}

.c-input-radio-group input[type="radio"] {
  width: 18px;
  height: 18px;
  accent-color: var(--color-primary-light);
}

.c-input-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 0.92rem;
}

.c-input-checkbox input[type="checkbox"] {
  width: 22px;
  height: 22px;
  accent-color: var(--color-primary-light);
}

.p-entry__form-submit {
  text-align: center;
  padding: 32px 0 20px;
}

.p-entry__policy-link {
  text-align: center;
  font-size: 0.82rem;
  margin-top: 12px;
  color: var(--color-primary-light);
  text-decoration: underline;
}

/* ==========================================================================
   Entry Form — Movable Type AForm（Figma node 510:10565 準拠 / CSS のみで整形）
   ========================================================================== */
.p-entry .aform {
  margin-top: 40px;
  color: var(--color-text-mid);
}

/* Figma に無いヘッダー/チェック中表示は非表示 */
.p-entry .aform-header,
.p-entry .aform-checking { display: none; }

/* パネル背景は透明：行のdt/ddが白/グレーを担う。角丸は最初/最後のdlで付与 */
.p-entry .aform-content {
  background: transparent;
}

/* 最初のdl上端・最後のdl下端を角丸（モバイル＝縦積み） */
#aform-form-3 dl:first-of-type dt { border-radius: 10px 10px 0 0; }
#aform-form-3 dl:last-of-type dd { border-radius: 0 0 10px 10px; }

/* 各行（デフォルト＝モバイルは縦積み） */
#aform-form-3 dl {
  margin: 0 20px;
  border-bottom: 1px solid #e5e8ee;
}

#aform-form-3 dl:last-of-type { border-bottom: none; }

/* ラベル列 */
#aform-form-3 dt {
  background: var(--color-bg-lighter);
  padding: 18px 24px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.aform-label {
  font-family: var(--font-base);
  font-weight: 700;
  font-size: 18px;
  color: var(--color-text-mid);
  line-height: 1.4;
}

.aform-label a { text-decoration: underline; }
.aform-label img { display: inline; margin-left: 4px; }

/* ※必須 */
.aform-required {
  font-size: 16px;
  font-weight: 700;
  color: var(--color-primary-light);
  margin-left: 0.3rem;
  white-space: nowrap;
}
.aform-required::before { content: '※'; }

/* 入力列 */
#aform-form-3 dd {
  margin: 0;
  padding: 16px 24px;
  background: var(--color-bg-white);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
}

/* テキスト系入力・テキストエリア */
#aform-form-3 dd input[type="text"],
#aform-form-3 dd input[type="email"],
#aform-form-3 dd input[type="tel"],
#aform-form-3 dd textarea {
  width: 100%;
  border: 1px solid #c4c4c4;
  border-radius: 4px;
  padding: 12px 14px;
  font-family: var(--font-base);
  font-size: 16px;
  color: var(--color-text-mid);
  background: var(--color-bg-white);
  transition: border-color 0.2s ease;
}

#aform-form-3 dd textarea { resize: vertical; min-height: 130px; line-height: 1.7; }

#aform-form-3 dd input::placeholder,
#aform-form-3 dd textarea::placeholder { color: #c8c8c8; }

#aform-form-3 dd input:focus,
#aform-form-3 dd textarea:focus,
#aform-form-3 dd select:focus {
  outline: none;
  border-color: var(--color-primary-light);
}

/* セレクト（生年月日・訪問希望日など） */
#aform-form-3 dd select {
  border: 1px solid #c4c4c4;
  border-radius: 4px;
  padding: 10px 12px;
  font-family: var(--font-base);
  font-size: 15px;
  color: var(--color-text-mid);
  background: var(--color-bg-white);
  margin-right: 6px;
}

/* 生年月日・訪問希望日（年月日）は横並び */
#aform-form-3 .dl_parts-4 dd,
#aform-form-3 .dl_parts-20 dd {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 4px;
}

/* 氏名・フリガナ（姓名の2分割） */
.aform-name-ul,
.aform-kana-ul {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
}
.aform-name-ul li,
.aform-kana-ul li {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 180px;
}
.aform-name-ul li label,
.aform-kana-ul li label {
  font-size: 0.85rem;
  color: #64748b;
  flex-shrink: 0;
}

/* ラジオ・チェックボックスのリスト */
.aform-radio-ul,
.aform-checkbox-ul {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 28px;
}
.aform-radio-ul.aform-vertical-ul,
.aform-checkbox-ul.aform-vertical-ul { flex-direction: column; }

.aform-radio-ul li,
.aform-checkbox-ul li {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ラジオボタン（選択時 #0a96f4） */
#aform-form-3 input[type="radio"].aform-radio {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  margin: 0;
  border: 1.5px solid #c4c4c4;
  border-radius: 50%;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
}
#aform-form-3 input[type="radio"].aform-radio:checked { border-color: var(--color-primary-light); }
#aform-form-3 input[type="radio"].aform-radio:checked::after {
  content: '';
  position: absolute;
  inset: 4px;
  background: var(--color-primary-light);
  border-radius: 50%;
}

/* チェックボックス（選択時 青地＋白チェック） */
#aform-form-3 input[type="checkbox"].aform-checkbox {
  appearance: none;
  -webkit-appearance: none;
  width: 22px;
  height: 22px;
  margin: 0;
  border: 1px solid #c4c4c4;
  border-radius: 3px;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
}
#aform-form-3 input[type="checkbox"].aform-checkbox:checked {
  background: var(--color-primary-light);
  border-color: var(--color-primary-light);
}
#aform-form-3 input[type="checkbox"].aform-checkbox:checked::after {
  content: '';
  position: absolute;
  left: 7px;
  top: 3px;
  width: 6px;
  height: 11px;
  border: solid var(--color-bg-white);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* 入力例・エラー表示 */
.aform-input-example {
  font-size: 0.8rem;
  color: #c8c8c8;
}
.aform-error {
  font-size: 0.82rem;
  color: #e03131;
}
.aform-error:empty { display: none; }

/* 送信ボタン */
.aform-button-area {
  display: flex;
  justify-content: center;
  padding: 60px 0 8px;
}
.aform-button-area input[type="submit"] {
  min-width: 180px;
  padding: 15px 40px;
  border: none;
  border-radius: 8px;
  background: linear-gradient(90deg, #216cff 0%, #0047d3 100%);
  color: var(--color-text-white);
  font-family: var(--font-base);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: var(--transition-base);
}
.aform-button-area input[type="submit"]:hover {
  opacity: 0.92;
  transform: translateY(-2px);
}

/* ---- Privacy Policy ---- */
.p-policy {
  position: relative;
  background-color: var(--color-bg-lighter);
  padding: 50px 0;
}

.p-policy__title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--color-text-dark);
  margin-bottom: 16px;
}

.p-policy__text {
  font-size: 0.88rem;
  color: #64748b;
  line-height: 1.85;
}

/* ==========================================================================
   Responsive — Tablet (768px+)
   ========================================================================== */
@media screen and (min-width: 768px) {

  .p-message__inner {
    display: flex;
    align-items: flex-start;
    gap: 90px;
  }

  .p-message__left  { flex: 0 0 42%; }
  .p-message__right { flex: 1; margin-top: 0; }

  .p-message__logo-3d { margin-inline: 0; }

  .p-strengths__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .p-numbers__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }

  .p-member__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .p-environment__inner {
    flex-direction: row;
    align-items: center;
    gap: 100px;
  }

  .p-member__deco-txt {
    width: 370px;
  }

  .p-entry__deco-txt {
    width: clamp(320px, 40%, 400px);
  }

  .c-table-recruit th {
    display: table-cell;
    width: 220px;
    background: linear-gradient(90deg, #216cff 0%, #0b48bf 100%);
  }

  .c-table-recruit td { display: table-cell; width: auto; }

  .p-entry__form { padding: 0; }

  .p-entry__form-row {
    grid-template-columns: 220px 1fr;
  }

  /* AForm: ラベル列｜入力列の2カラム */
  #aform-form-3 dl {
    display: grid;
    grid-template-columns: 28% 1fr;
    align-items: stretch;
  }

  #aform-form-3 dt { padding: 22px 26px; }
  #aform-form-3 dd { padding: 22px 26px; }

  /* 2カラム時の角丸：最初の行の上端・最後の行の下端 */
  #aform-form-3 dl:first-of-type dt { border-radius: 10px 0 0 0; }
  #aform-form-3 dl:first-of-type dd { border-radius: 0 10px 0 0; }
  #aform-form-3 dl:last-of-type dt  { border-radius: 0 0 0 10px; }
  #aform-form-3 dl:last-of-type dd  { border-radius: 0 0 10px 0; }

}

/* ==========================================================================
   Responsive — Mobile only (〜767px)
   ========================================================================== */
@media screen and (min-width: 768px) and (max-width: 1139.98px) {

  /* コンテナ幅が画面幅いっぱいになる範囲は左右30px確保 */
  .l-container {
    padding-left: 30px;
    padding-right: 30px;
  }

}

@media screen and (max-width: 767.98px) {

  /* セクション共通の左右余白 */
  .l-container {
    padding-left: 30px;
    padding-right: 30px;
  }

  /* セクション見出し（30px = 1.875rem） */
  .c-section-title { font-size: 1.875rem; }
  .c-section-head { margin: 0 0 30px 0; }

  /* メインビジュアル */
  .p-mv__inner { padding-bottom: 12vh; }
  .p-mv__copy-svg2 {
    bottom: 32vh;
    right: 18px;
  }
  .p-mv__content { margin-left: 0; }
  .p-mv__main-copy {
    font-size: clamp(1.8rem, 5.5vw, 3.6rem);
    margin-bottom: 10px;
    text-shadow: none;
  }
  .p-mv__en-copy {
    font-size: 0.625rem;
    text-shadow: none;
  }

  /* 社長メッセージ */
  .p-message { padding: 46px 0 120px; }
  .p-message__sig { font-size: 0.875rem; }
  .p-message__logo-3d { display: none; }
  .p-message__left { gap: 0; }
  .p-message__deco-script {
    font-size: clamp(45px, 8vw, 94px);
    bottom: 5px;
  }

  .p-message__bg-item--1 {
    width: min(200px, 23vw);
    top: min(80px, 14vw);
    left: calc(50% - min(150px, -18vw));
  }
  .p-message__bg-item--2 {
    width: min(280px, 42vw);
    top: 32%;
    right: min(50px, 8vw);
  }
  .p-message__bg-item--3 {
    width: min(180px, 30vw);
    bottom: 84%;
    left: min(90px, 10vw);
  }

  /* 当社の強み */
  .p-strengths {
    padding: 580px 0 70px;
    /* アンカー遷移時、上部の人物画像余白(580px)を飛ばして
       l-container 上端が固定ヘッダー(約92px)直下に来るようにする */
    scroll-margin-top: -480px;
  }
  .p-strengths__people { top: 10%; }
  .p-strengths__grid { margin: 0 -4px; gap: 40px; }
  .c-card-strength:nth-child(1),
  .c-card-strength:nth-child(2),
  .c-card-strength:nth-child(3) { margin: 120px 0 0; }
  .c-card-strength { padding: 0 20px 30px; }
  .c-card-strength__title { font-size: 1.125rem; }
  /* リング(最大265px, top:-120px)がカード内へ約145px食い込むため、
     テキストはそれより下(155px)から開始してリング下部との重なりを回避 */
  .c-card-strength__text { padding-top: 155px; }

  /* 数字で知る */
  .p-numbers__grid { margin: 0 -4px; }
  .p-numbers::before {
    background: url('assets/bg-circle1.svg') no-repeat right -50px top;
    background-size: 70% auto;
  }

  .c-card-number {
    min-height: 145px;
    padding: 12px 16px 12px;
  }
  .c-card-number__val,
  .c-card-number:nth-child(n+3) .c-card-number__val { font-size: 5.3rem; }

  .c-card-number:nth-child(1) {
    --num-icon-size: 26%;
    --num-icon-pos: left 16% bottom 15%;
  }
  .c-card-number:nth-child(2) {
    --num-icon-size: 34%;
    --num-icon-pos: right 6% top 5%;
  }
  .c-card-number:nth-child(2) .c-card-number__body { justify-content: flex-start; }
  .c-card-number:nth-child(3) {
    --num-icon-size: 40%;
    --num-icon-pos: right 10% top 8%;
  }

  /* note をラベルの後ろに回り込ませて表示 */
  .c-card-number__head {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    column-gap: 8px;
  }
  .c-card-number__note {
    margin-top: 0;
    padding-left: 0;
  }

  .c-card-number:nth-child(4) {
    --num-icon-size: 22%;
    --num-icon-pos: left 6% bottom 12%;
  }
  .c-card-number:nth-child(5) {
    --num-icon-size: 30%;
    --num-icon-pos: left 10% bottom 8%;
  }
  .c-card-number:nth-child(6) {
    --num-icon-size: 48%;
    --num-icon-pos: right 5% top 52%;
  }
  .c-card-number:nth-child(6) .c-card-number__val { font-size: 4rem; }
  .c-card-number__unit--sep {
    margin-left: -16px;
    margin-right: -16px;
  }

  .c-card-number:nth-child(7) {
    --num-icon-size: 30%;
    --num-icon-pos: right 5% top 5%;
  }
  .c-card-number:nth-child(8) {
    --num-icon-size: 36%;
    --num-icon-pos: left 18% bottom 10%;
  }
  .c-card-number:nth-child(9) {
    --num-icon-pos: right 2% top 8%;
  }
  .c-card-number:nth-child(10) {
    --num-icon-size: 18%;
    --num-icon-pos: right 8% top 8%;
  }

  /* 社員を知る */
  .p-member { padding: 100px 0 70px; }
  .p-member__grid { gap: 40px; margin: 0; }
  .c-card-member__overlay { padding: 0 16px 10px; }

  /* モーダル: リングを本文の背面へ（縦積み時にテキストへ重なるのを防ぐ）
     dialog をスタッキングコンテキスト化しないと z-index:-1 が背景の裏に隠れて消えるため isolation を付与 */
  .c-modal__dialog { isolation: isolate; }
  .c-modal__ring { z-index: -1; }

  /* 環境を知る: 見出し → メディア → 福利厚生リスト の順に並べ替え
     （media は content の兄弟なので content を display:contents で平坦化し order で制御） */
  .p-environment__inner { gap: 0; }
  .p-environment__content { display: contents; }
  .p-environment .c-section-head { order: 1; }
  .p-environment__media { order: 2; }
  .p-environment .c-benefit-list { order: 3; }

  .p-environment { padding: 90px 0 70px; }
  .p-environment__pic { width: 90%; margin: auto; }
  .c-benefit-list { margin-top: 20px; }
  .c-benefit-list__term { font-size: 1.125rem; }
  .c-benefit-list__desc { font-size: 0.875rem; }

  /* 募集要項 */
  .p-recruit { padding: 90px 0 70px; }
  .p-recruit__content { padding: 0; margin: 0 -5px; }
  .p-recruit__tabs { padding-right: 16px; }

  /* タブ */
  .c-btn-tab {
    padding: 4px 10px;
    font-size: 0.875rem;
  }

  .c-table-recruit th,
  .c-table-recruit td {
    padding: 10px 20px 20px;
    font-size: 0.875rem;
  }
  .c-table-recruit th {
    padding: 10px 20px;
    font-size: 1rem;
  }
  .c-table-recruit ul li { font-size: 0.875rem; }

  /* エントリー */
  .p-entry { padding: 90px 0 100px; }
  .p-entry__deco-txt {
    top: -135px;
    right: 20px;
    width: 170px;
  }
  .p-entry__lead {
    font-size: 0.875rem;
    margin: 0 0 30px 0;
  }

  /* 本文・各種テキストのフォントサイズ */
  .p-message__text { font-size: 0.875rem; }
  .c-card-strength__text { font-size: 0.875rem; }
  .c-card-number__label { font-size: 0.875rem; }
  .c-card-number__note { font-size: 0.75rem; }

  /* エントリーフォーム */
  #aform-form-3 dl { margin: 0; }

  /* フッター */
  .l-footer__links {
    right: auto;
    left: 30px;
    bottom: 80px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .l-footer__links a { font-size: 0.75rem; }
  .l-footer__copyright {
    left: 30px;
    font-size: 0.75rem;
  }

  /* セクション間インターロック角丸 80px */
  .p-message::after,
  .p-strengths::before,
  .p-strengths::after,
  .p-numbers::after,
  .p-member::before,
  .p-member::after,
  .p-environment::before,
  .p-environment::after,
  .p-recruit::before,
  .p-entry::before {
    width: 80px;
    height: 80px;
  }

  .p-message::after      { background: radial-gradient(circle 80px at top left,     transparent 0 79px, var(--color-bg-light) 80px); }
  .p-strengths::before   { background: radial-gradient(circle 80px at bottom right, transparent 0 79px, #0a96f4 80px); }
  .p-strengths::after    { background: radial-gradient(circle 80px at top left,     transparent 0 79px, #0047d3 80px); }
  .p-numbers::after      { background: radial-gradient(circle 80px at top left,     transparent 0 79px, var(--color-bg-lighter) 80px); }
  .p-member::before      { background: radial-gradient(circle 80px at bottom right, transparent 0 79px, #0047d3 80px); }
  .p-member::after       { background: radial-gradient(circle 80px at top left,     transparent 0 79px, #0047d3 80px); }
  .p-environment::before { background: radial-gradient(circle 80px at bottom right, transparent 0 79px, var(--color-bg-lighter) 80px); }
  .p-environment::after  { background: radial-gradient(circle 80px at top left,     transparent 0 79px, var(--color-bg-light) 80px); }
  .p-recruit::before     { background: radial-gradient(circle 80px at bottom right, transparent 0 79px, #0047d3 80px); }
  .p-entry::before       { background: radial-gradient(circle 80px at bottom right, transparent 0 79px, var(--color-bg-light) 80px); }

  /* p-numbers 左上（疑似要素でなく背景で描く対の角）も合わせて 80px に */
  .p-numbers {
    background:
      radial-gradient(circle 80px at bottom right, transparent 0 79px, var(--color-bg-light) 80px) left top / 80px 80px no-repeat,
      var(--grad-blue);
  }

  /* エントリーボタン非表示 */
  .c-btn-entry-header { display: none; }

  /* ヘッダー外周の余白（旧: inner の margin） */
  .l-header { padding: 10px; }

  /* ロゴエリア(白枠)を画面幅に広げ、ロゴ左/ハンバーガー右端に。シャドウ無し */
  .l-header__inner {
    width: auto; /* 100%だとヘッダー内容幅を超えて左右に揺れるため auto で収める */
    height: 72px;
    padding: 0 16px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fff;
    border-radius: 8px;
    box-shadow: none;
    position: relative;
    z-index: 1250; /* ドロワー(1200)より前面。開いてもロゴ/Xが残る */
  }

  .l-header__right { margin-left: 0; }

  /* ハンバーガーは白枠内なのでホバー影も無し */
  .c-btn-menu:hover { box-shadow: none; }

  /* ロゴ本体は白枠内に。自前の白背景・影・角丸は解除 */
  .l-header__logo-link {
    height: auto;
    padding: 8px 0 0 0;
    gap: 5px;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
  }
  .l-header__logo-img { height: 28px; }
  .l-header__logo-recruit { font-size: 9px; }

  /* ハンバーガーは白枠右端に追従。自前の白背景・影は解除 */
  .c-btn-menu {
    width: 44px;
    height: 44px;
    background: transparent;
    box-shadow: none;
  }

  /* ドロワー: PC同様の右スライド。ただし全幅・角丸なし */
  .l-header__nav {
    top: 0;
    right: 0;
    left: auto;
    width: 100%;
    height: 100vh;
    max-height: none;
    padding: 84px 20px 28px; /* 72pxバーの下からリスト開始 */
    transform: translateX(100%); /* 右外へ隠す */
    border-radius: 0;
    box-shadow: -4px 0 24px rgba(8, 52, 139, 0.15);
  }
  .l-header__nav.is-open { transform: translateX(0); }

  /* ハンバーガーがXになり閉じるため、ドロワー内の閉じるボタンは非表示 */
  .l-header__nav-head { display: none; }

}

/* ==========================================================================
   Responsive — Mobile wide (426px–767px)
   ========================================================================== */
@media screen and (min-width: 426px) and (max-width: 767.98px) {

  .p-strengths {
    padding: 140px 0 80px;
    scroll-margin-top: -40px; /* 上部余白140px分を飛ばし l-container 上端に着地 */
  }
  .p-strengths__people { top: 0; }

}

/* ==========================================================================
   Responsive — Mobile wide grid (580px–767px)
   ========================================================================== */
@media screen and (min-width: 580px) and (max-width: 767.98px) {

  .p-numbers__grid { grid-template-columns: repeat(2, 1fr); }

}

/* ==========================================================================
   Responsive — Tablet only (768px–991px)
   ========================================================================== */
@media screen and (min-width: 768px) and (max-width: 991.98px) {

  .p-message { padding: 100px 50px 150px; }
  .p-message__inner { gap: 60px; }
  .p-message__left { flex: 0 0 30%; }
  .c-section-title { font-size: 2.8rem; }

  .p-strengths { padding: 140px 0 80px; }
  .p-strengths__grid { gap: 30px; margin: 0; }
  .c-card-strength__title { font-size: 1rem; line-height: 1.3; }
  .c-card-strength { padding: 110px 16px 16px; }
  .c-card-strength__num { height: 14.3%; }

  .p-numbers { padding: 120px 0 100px; }
  .p-numbers__grid { margin: 40px 40px 0; }

  .c-card-number:nth-child(1) {
    --num-icon-size: 26%;
    --num-icon-pos: left 20px bottom 20px;
  }
  .c-card-number:nth-child(2) {
    --num-icon-size: 28%;
    --num-icon-pos: left 15px bottom 22px;
  }
  .c-card-number:nth-child(4) {
    --num-icon-size: 20%;
    --num-icon-pos: left 20px bottom 18px;
  }
  .c-card-number:nth-child(6) {
    --num-icon-size: 45%;
    --num-icon-pos: right 10px top 14px;
  }
  .c-card-number:nth-child(7) {
    --num-icon-size: 32%;
    --num-icon-pos: right 16px top 0px;
  }

  .p-entry__deco-txt { top: -132px; }

  .p-environment__inner { gap: 80px; }

  .p-member__grid { gap: 24px; margin: 70px 0 0; }
  .c-card-member__overlay { padding: 0 2px 18px; }
  .c-card-member__quote span { font-size: 1rem; }
  .c-card-member__meta { gap: 4px; padding: 0 6px; }

}

/* ==========================================================================
   Responsive — Desktop (992px+)
   ========================================================================== */
@media screen and (min-width: 992px) {

  /* MV content — Figma 1280px design (node 390:1674) */
  /* PC: テキストをSVGに差し替え */
  .p-mv__main-copy,
  .p-mv__en-copy { display: none; }

  .p-mv__copy-svg,
  .p-mv__copy-svg2 { display: block; }

  .p-mv__inner {
    /* SVG1: 1280px時=158px（現状サイズ）。幅拡大で最大1.5倍(237px)まで */
    --copy-h: clamp(158px, 12.34vw, 237px);
    /* SVG2: 元の高さ242px基準。幅拡大で最大1.5倍(363px)まで */
    --copy-h2: clamp(200px, 18.906vw, 363px);
    max-width: none;
    margin-inline: 0;
    /* 左端からの距離を一定に保つ（1280px時のl-container左と同じ90px） */
    padding-left: 5vw;
    /* 画面右端からのSVG2の距離 */
    padding-right: 8vw;
    gap: 48px;
    align-items: end;
  }

  .p-mv__content { max-width: none; margin-left: 0; }

  /* 高さ基準でスケール（1280px時 158px→幅472px、最大1.5倍） */
  .p-mv__copy-svg {
    height: var(--copy-h);
    width: auto;
    filter: drop-shadow(0 4px 12px rgba(8, 52, 139, 0.35));
  }

  /* SVG2: 元比率のまま拡大し、右端側（end）にアンカー */
  .p-mv__copy-svg2 {
    /* モバイルの重ね配置を解除してフレックス行に戻す */
    position: static;
    z-index: auto;
    right: auto;
    bottom: auto;
    max-width: none;
    max-height: none;
    height: var(--copy-h2);
    width: auto;
    flex-shrink: 0;
    margin-left: auto;
    filter: drop-shadow(0 4px 12px rgba(8, 52, 139, 0.35));
  }

  /* Sections */
  .p-message { padding: 150px 0 200px; }
  .p-strengths { padding: 250px 0 130px; }
  .p-numbers { padding: 100px 0 130px; }
  .p-member { padding: 130px 0; }
  .p-environment { padding: 100px 0; }
  .p-recruit { padding: 100px 0 150px; }
  .p-entry { padding: 100px 0 30px; }

  /* 数字で知る — Figma bento レイアウト (node 467:11832) */
  .p-numbers__grid {
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: minmax(200px, auto);
    gap: 18px;
  }

  .c-card-number:nth-child(1)  { grid-column: span 5; }  /* 創業 */
  .c-card-number:nth-child(2)  { grid-column: span 7; }  /* 取扱メーカー */
  .c-card-number:nth-child(3)  { grid-column: span 3; }  /* 拠点数 */
  .c-card-number:nth-child(4)  { grid-column: span 5; }  /* 年間休日 */
  .c-card-number:nth-child(5)  { grid-column: span 4; }  /* 従業員数 */
  .c-card-number:nth-child(6)  { grid-column: span 6; }  /* 男女比 */
  .c-card-number:nth-child(7)  { grid-column: span 6; }  /* 平均勤続年数 */
  .c-card-number:nth-child(8)  { grid-column: span 3; }  /* 有休平均取得日数 */
  .c-card-number:nth-child(9)  { grid-column: span 4; }  /* 育休取得率 */
  .c-card-number:nth-child(10) { grid-column: span 5; }  /* 平均年齢 */

  .p-entry__form-row {
    grid-template-columns: 240px 1fr;
  }

}

/* ==========================================================================
   Responsive — Desktop narrow (992px–1279px)
   ========================================================================== */
@media screen and (min-width: 992px) and (max-width: 1279.98px) {

  /* .c-card-strength__num {
    top: 49.2%;
    width: 16%;
    height: 16%;
    padding-bottom: 1px;
  } */

  .c-card-strength__title { font-size: 1rem; }

  .c-card-strength { padding: 140px 21px 30px 23px; }

  .c-card-number:nth-child(8) {
    --num-icon-size: 30%;
    --num-icon-pos: left 12px bottom 25px;
  }

  .c-card-number:nth-child(6) {
    --num-icon-size: 48%;
    --num-icon-pos: right 20px top 20px;
  }

  .c-card-member__overlay { padding: 0 3px 18px; }

  .c-card-member__quote span { font-size: clamp(1.05rem, 2.4vw, 1.1rem); }

}