@charset "UTF-8";
/* e2R Career LP 確定版スタイル（トップ・下層ページ共通） */


/* =========================================================
   e2R Career LP  style.css
   ========================================================= */

/* ---------- Tokens ---------- */

/* =========================================================
   カラーパレット（bodyのclassで切り替え：palette-1 / palette-2 / palette-3）
   --g：Source（集める）／--b：Secure（逃さない）／--p：Select（見極める）
   ========================================================= */
:root, .palette-1 {
  --ink: #0B1622; --text: #24313F; --sub: #3A4757; --muted: #5E6B78; --line: #E2E8EE; --line-2: #D2DBE3;
  --surface: #F2F6F9; --white: #FFFFFF; --dark-2: #1B2B3A; --dark-text: #CAD6E0; --danger: #B42318;
  --g: #14B8A6; --g-d: #0F766E; --g-t: #E6F8F5; --g-rgb: 20,184,166;
  --b: #0B6BD8; --b-d: #08519F; --b-t: #E7F1FC; --b-rgb: 11,107,216;
  --p: #0EA5E9; --p-d: #0369A1; --p-t: #E6F5FD; --p-rgb: 14,165,233;
  --accent: #14B8A6; --accent-rgb: 20,184,166; --accent-2: #0F766E;
  --grad: linear-gradient(120deg, #14B8A6, #0EA5E9 50%, #0B6BD8);
  --grad-text: linear-gradient(90deg, #0F766E, #0B6BD8);
  --pastel: linear-gradient(135deg, #E6F8F5 0%, #E8F5FD 52%, #E7F1FC 100%);
  --brand-dark: linear-gradient(120deg, #0F766E 0%, #08519F 100%);
  --radius-xl: clamp(28px, 3vw, 44px);
  --font: 'Noto Sans JP', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
  --font-en: 'Outfit', 'Noto Sans JP', sans-serif;
}
.palette-2 {
  --ink: #111827; --text: #1F2937; --sub: #374151; --muted: #6B7280; --line: #E5E9F0; --line-2: #CDD5E0;
  --surface: #F3F6FA; --dark-2: #1F2A3D; --dark-text: #D1D9E6;
  --g: #00C2B2; --g-d: #00857A; --g-t: #E0FAF6; --g-rgb: 0,194,178;
  --b: #2F8CFF; --b-d: #0B5ED7; --b-t: #E8F2FF; --b-rgb: 47,140,255;
  --p: #1D5FD6; --p-d: #0F3F99; --p-t: #E7EEFC; --p-rgb: 29,95,214;
  --accent: #FF8A00; --accent-rgb: 255,138,0; --accent-2: #8B5CF6;
  --grad: linear-gradient(120deg, #00C2B2, #2F8CFF 50%, #1D5FD6);
  --grad-text: linear-gradient(90deg, #00857A, #1D5FD6);
  --pastel: linear-gradient(135deg, #E0FAF6 0%, #E8F2FF 52%, #E7EEFC 100%);
  --brand-dark: linear-gradient(120deg, #00857A 0%, #0F3F99 100%);
}
.palette-3 {
  --ink: #0A1428; --text: #1F2937; --sub: #374151; --muted: #6B7280; --line: #E2E2E2; --line-2: #D1D5DB;
  --surface: #F2F3F5; --dark-2: #172036; --dark-text: #CBD5E1;
  --g: #00C8F4; --g-d: #0083A3; --g-t: #E5F9FE; --g-rgb: 0,200,244;
  --b: #007DFE; --b-d: #0058B8; --b-t: #E5F2FF; --b-rgb: 0,125,254;
  --p: #0050D0; --p-d: #003A9C; --p-t: #E6EEFB; --p-rgb: 0,80,208;
  --accent: #FE8920; --accent-rgb: 254,137,32; --accent-2: #94D227;
  --grad: linear-gradient(120deg, #00C8F4, #007DFE 50%, #0050D0);
  --grad-text: linear-gradient(90deg, #00A9D0, #0050D0);
  --pastel: linear-gradient(135deg, #E5F9FE 0%, #E5F2FF 52%, #E6EEFB 100%);
  --brand-dark: linear-gradient(120deg, #0083A3 0%, #003A9C 100%);
}

/* カラー4（color_05）：Electric Blue／Cyan Pop／Mint Flash／Deep Cobalt */
.palette-4 {
  --ink: #0A1433; --text: #1F2A44; --sub: #3A4560; --muted: #5F6B85; --line: #E1E7F0; --line-2: #CFD8E6;
  --surface: #F1F5FB; --dark-2: #142050; --dark-text: #C9D3EA;
  --g: #4DF5E4; --g-d: #00827E; --g-t: #E7FDFA; --g-rgb: 77,245,228;
  --b: #006BFF; --b-d: #1034A6; --b-t: #E6F0FF; --b-rgb: 0,107,255;
  --p: #00D9FF; --p-d: #0072A3; --p-t: #E5FAFF; --p-rgb: 0,217,255;
  --accent: #4DF5E4; --accent-rgb: 77,245,228; --accent-2: #1034A6;
  --grad: linear-gradient(120deg, #4DF5E4, #00D9FF 50%, #006BFF);
  --grad-text: linear-gradient(90deg, #0090B8, #1034A6);
  --pastel: linear-gradient(135deg, #E7FDFA 0%, #E5FAFF 52%, #E6F0FF 100%);
  --brand-dark: linear-gradient(120deg, #006BFF 0%, #1034A6 100%);
  --wave-1: #4DF5E4; --wave-2: #00D9FF; --wave-3: #006BFF;
}
/* カラー5（color_04の10番）：#0B3D91／#1976D2／#4DB6AC／#B0BEC5／#ECEFF1 */
.palette-5 {
  --ink: #0B1F3A; --text: #263238; --sub: #37474F; --muted: #607D8B; --line: #DDE3E7; --line-2: #C5D0D6;
  --surface: #ECEFF1; --dark-2: #12305E; --dark-text: #CFD8DC;
  --g: #4DB6AC; --g-d: #00796B; --g-t: #E6F4F2; --g-rgb: 77,182,172;
  --b: #1976D2; --b-d: #0B3D91; --b-t: #E8F1FB; --b-rgb: 25,118,210;
  --p: #0B3D91; --p-d: #0B3D91; --p-t: #E7ECF5; --p-rgb: 11,61,145;
  --accent: #4DB6AC; --accent-rgb: 77,182,172; --accent-2: #0B3D91;
  --grad: linear-gradient(120deg, #4DB6AC, #1976D2 55%, #0B3D91);
  --grad-text: linear-gradient(90deg, #00796B, #0B3D91);
  --pastel: linear-gradient(135deg, #E6F4F2 0%, #E8F1FB 52%, #E7ECF5 100%);
  --brand-dark: linear-gradient(120deg, #1976D2 0%, #0B3D91 100%);
}

/* カラー6（color_04の6番）：#1E3A8A／#3B82F6／#06B6D4／#67E8F9／#E0F2FE */
.palette-6 {
  --ink: #0F1B3D; --text: #1E293B; --sub: #334155; --muted: #64748B; --line: #E2E8F0; --line-2: #CBD5E1;
  --surface: #F1F7FD; --dark-2: #1E3A8A; --dark-text: #CBD5E1;
  --g: #06B6D4; --g-d: #0E7490; --g-t: #E0F7FB; --g-rgb: 6,182,212;
  --b: #3B82F6; --b-d: #1E3A8A; --b-t: #E0F2FE; --b-rgb: 59,130,246;
  --p: #1E3A8A; --p-d: #1E3A8A; --p-t: #E0F2FE; --p-rgb: 30,58,138;
  --accent: #06B6D4; --accent-rgb: 6,182,212; --accent-2: #1E3A8A;
  --grad: linear-gradient(120deg, #06B6D4, #3B82F6 55%, #1E3A8A);
  --grad-text: linear-gradient(90deg, #0E7490, #1E3A8A);
  --pastel: linear-gradient(135deg, #E0F7FB 0%, #E0F2FE 52%, #EAF0FB 100%);
  --brand-dark: linear-gradient(120deg, #3B82F6 0%, #1E3A8A 100%);
  --wave-1: #67E8F9; --wave-2: #06B6D4; --wave-3: #3B82F6;
}


/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; font-family: var(--font); font-size: 16px; line-height: 1.8; color: var(--text); background: var(--white); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--b-d); }
a:hover { color: #0E3F86; }
:focus-visible { outline: 3px solid var(--b); outline-offset: 2px; }
h1, h2, h3, p, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button { font-family: inherit; }
.en { font-family: var(--font-en); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; }

/* ---------- Layout ---------- */
.container { max-width: 1240px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 48px); }
.section { padding: clamp(80px, 9vw, 140px) 0; }
.section--flush-top { padding-top: 0; }
.inset { padding: 0 clamp(12px, 1.6vw, 24px); }
.block { position: relative; overflow: hidden; border-radius: var(--radius-xl); padding: clamp(64px, 8vw, 112px) clamp(20px, 4vw, 64px); }
.block--surface { background: var(--surface); }
.block--dark { background: var(--ink); color: var(--white); }
.block__inner { position: relative; max-width: 1240px; margin: 0 auto; }

.sec-label { display: flex; align-items: center; gap: 12px; font-family: var(--font-en); font-size: 16px; font-weight: 600; color: var(--ink); }
.sec-label span { width: 36px; height: 36px; border-radius: 50%; background: var(--ink); color: var(--white); display: flex; align-items: center; justify-content: center; font-size: 14px; }
.h2 { margin-top: 22px; font-size: clamp(30px, 3.6vw, 48px); font-weight: 800; line-height: 1.4; color: var(--ink); }
.h2--white { color: var(--white); }
.lead { font-size: 16px; color: var(--sub); }
.lead--white { color: var(--dark-text); }
.head-row { display: flex; flex-wrap: wrap; gap: 20px 48px; align-items: flex-end; justify-content: space-between; }
.head-row > :first-child { flex: 1 1 520px; }
.head-row > .lead { flex: 1 1 360px; }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 24px; border: 0; border-radius: 999px; font-size: 15px; font-weight: 700; line-height: 1.4; text-decoration: none; cursor: pointer; transition: background-color .2s, color .2s, box-shadow .2s; }
.btn svg { flex: none; }
.btn--dark { background: var(--ink); color: var(--white); }
.btn--dark:hover { background: #33353A; color: var(--white); }
.btn--light { background: var(--surface); color: var(--ink); }
.btn--light:hover { background: var(--line); color: var(--ink); }
.btn--white { background: var(--white); color: var(--ink); }
.btn--white:hover { background: var(--surface); color: var(--ink); }
.btn--outline-white { border: 1px solid var(--white); color: var(--white); background: transparent; }
.btn--outline-white:hover { background: rgba(255,255,255,0.1); color: var(--white); }
.btn--lg { min-height: 56px; padding: 0 30px; font-size: 16px; }
.btn--block { display: flex; width: 100%; }

/* ---------- Notice bar / Header ---------- */
.notice { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 14px; padding: 10px 20px; background: var(--ink); color: var(--white); text-decoration: none; font-size: 14px; font-weight: 700; }
.notice:hover { color: var(--white); }
.notice__date { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-en); }
.notice__date::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--grad); }
.notice__link { text-decoration: underline; text-underline-offset: 3px; color: var(--dark-text); font-weight: 500; }

.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,0.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.site-header__inner { max-width: 1320px; margin: 0 auto; padding: 14px clamp(20px, 3vw, 40px); display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.site-header__logo { display: flex; align-items: center; min-height: 44px; }
.site-header__logo img { height: 28px; width: auto; }
.site-nav { display: flex; gap: 28px; flex-wrap: wrap; font-size: 14px; font-weight: 700; }
.site-nav a { color: var(--ink); text-decoration: none; }
.site-nav a:hover { color: var(--b-d); }
.site-header__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.site-header__actions .btn { min-height: 46px; padding: 0 22px; font-size: 14px; }

/* ---------- Decoration (arcs / shapes / spheres) ---------- */
.has-deco { position: relative; overflow: hidden; }
.has-deco > :not(.deco) { position: relative; }
.deco { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.deco--top { bottom: auto; height: 900px; }
.deco svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.sphere { position: absolute; border-radius: 50%; }
.sphere--gb { background: radial-gradient(circle at 32% 28%, #FFFFFF 0%, #C4EEE0 12%, #4CC3A0 40%, var(--b) 100%); }
.sphere--bp { background: radial-gradient(circle at 32% 28%, #FFFFFF 0%, #CFE0FB 12%, #5E95EE 42%, var(--p) 100%); }
.sphere--pp { background: radial-gradient(circle at 32% 28%, #FFFFFF 0%, #E4D9FB 12%, #9C7BEA 45%, var(--p-d) 100%); }
.sphere--blur { filter: blur(6px); opacity: 0.85; }
.dot { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--b); opacity: 0.75; }
.watermark { position: absolute; left: -12px; bottom: -0.18em; font-family: var(--font-en); font-size: clamp(80px, 12vw, 190px); font-weight: 600; line-height: 1; letter-spacing: -0.02em; color: rgba(255,255,255,0.06); white-space: nowrap; }

/* ---------- KV ---------- */
.kv { background: var(--pastel); padding: clamp(40px, 5vw, 80px) 0 clamp(32px, 4vw, 56px); }
.kv__grid { display: flex; flex-wrap: wrap; gap: clamp(32px, 4vw, 64px); align-items: center; }
.kv__main { flex: 1 1 620px; min-width: 0; }
.kv__tag { display: inline-flex; align-items: center; gap: 8px; background: var(--white); border-radius: 999px; padding: 6px 16px; font-size: 14px; font-weight: 700; color: var(--ink); }
.kv__title { margin-top: 28px; font-size: clamp(40px, 5vw, 76px); font-weight: 900; line-height: 1.18; letter-spacing: -0.01em; color: var(--ink); }
.kv__line { display: flex; flex-wrap: wrap; align-items: center; gap: 0.2em; }
.kv__pill { font-family: var(--font-en); font-size: 0.24em; font-weight: 600; letter-spacing: 0.02em; color: var(--white); border-radius: 999px; padding: 0.15em 0.8em; line-height: 1.4; }
.kv__pill--g { background: var(--g); } .kv__pill--b { background: var(--b); } .kv__pill--p { background: var(--p); }
.kv__lead { margin-top: 28px; max-width: 36em; font-size: 17px; line-height: 2; color: var(--text); }
.release { margin-top: 32px; display: inline-flex; align-items: stretch; background: var(--white); border-radius: 20px; overflow: hidden; box-shadow: 0 16px 36px -22px rgba(24,25,27,0.45); }
.release__date { background: var(--ink); color: var(--white); padding: 12px 20px; text-align: center; font-family: var(--font-en); }
.release__year { font-size: 12px; font-weight: 600; color: #B7BAC2; line-height: 1.4; }
.release__day { font-size: 32px; font-weight: 700; line-height: 1.1; }
.release__text { padding: 12px 22px; display: flex; flex-direction: column; justify-content: center; }
.release__text strong { font-size: 16px; font-weight: 900; color: var(--ink); line-height: 1.5; }
.release__text span { font-size: 14px; font-weight: 700; color: var(--sub); line-height: 1.6; }
.kv__notices { margin-top: clamp(40px, 4vw, 64px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.mini-card { background: var(--white); border-radius: 22px; padding: 18px 20px; display: flex; align-items: center; gap: 14px; box-shadow: 0 16px 32px -24px rgba(24,25,27,0.4); }
.mini-card__icon { flex: none; width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; }
.mini-card__title { font-size: 14px; font-weight: 700; color: var(--ink); }
.mini-card__bar { display: block; margin-top: 6px; height: 6px; width: 70%; border-radius: 3px; background: var(--line); }
.chips { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; font-size: 11px; font-weight: 700; }
.chips span { border-radius: 4px; padding: 0 7px; }

/* ---------- Forms ---------- */
.form-card { background: var(--white); border-radius: 28px; padding: clamp(24px, 3vw, 36px); box-shadow: 0 40px 80px -36px rgba(24,25,27,0.45); display: flex; flex-direction: column; gap: 14px; }
.kv .form-card { flex: 0 1 430px; min-width: 300px; }
.form-card__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.form-card__title { font-size: 22px; font-weight: 900; line-height: 1.4; color: var(--ink); }
.form-card__badge { flex: none; font-size: 12px; font-weight: 700; color: var(--ink); background: var(--surface); border-radius: 999px; padding: 3px 12px; }
.form-card__text { font-size: 14px; line-height: 1.8; color: var(--sub); }
.sf-form { display: flex; flex-direction: column; gap: 14px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label, .field legend { font-size: 13px; font-weight: 700; color: var(--ink); padding: 0; }
.req { font-size: 11px; font-weight: 700; color: var(--danger); margin-left: 4px; }
.field input, .field select, .field textarea { width: 100%; min-height: 48px; border: 1px solid transparent; border-radius: 12px; padding: 0 14px; font-family: inherit; font-size: 15px; color: var(--text); background: var(--surface); }
.field textarea { padding: 12px 14px; line-height: 1.7; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--b); background: var(--white); }
.field-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
fieldset.field { margin: 0; border: 0; padding: 0; }
.check-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 2px 16px; margin-top: 4px; }
.check { display: flex; align-items: center; gap: 10px; min-height: 40px; font-size: 14px; color: var(--text); }
.check input { width: 18px; height: 18px; margin: 0; flex: none; }
.agree { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; font-size: 13px; line-height: 1.7; color: var(--sub); }
.agree input { width: 20px; height: 20px; margin: 2px 0 0; flex: none; }
.certs { display: flex; align-items: center; gap: 10px; }
.certs img { width: 40px; height: 40px; flex: none; }
.certs p { font-size: 12px; line-height: 1.6; color: var(--muted); }

/* ---------- Issue ---------- */
.issue-grid { margin-top: 44px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 20px; }
.issue-card { background: var(--white); border: 1px solid var(--line); border-radius: 28px; overflow: hidden; display: flex; flex-direction: column; }
.issue-card__ill { aspect-ratio: 16 / 9; padding: 12px 24px; }
.issue-card__ill svg { width: 100%; height: 100%; display: block; }
.issue-card__body { padding: 26px 30px 30px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.issue-card__title { font-size: clamp(20px, 1.9vw, 24px); font-weight: 900; line-height: 1.5; color: var(--ink); }
.issue-card__text { font-size: 15px; line-height: 1.85; color: var(--sub); flex: 1; }
.issue-card__solve { margin-top: 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--ink); }
.badge { border-radius: 999px; padding: 4px 16px; }

/* tint helpers */
.t-g { background: var(--g-t); } .t-b { background: var(--b-t); } .t-p { background: var(--p-t); } .t-k { background: var(--surface); }
.c-g { color: var(--g-d); } .c-b { color: var(--b-d); } .c-p { color: var(--p-d); } .c-k { color: var(--ink); }
.bg-g { background: var(--g); } .bg-b { background: var(--b); } .bg-p { background: var(--p); } .bg-k { background: var(--ink); }

/* ---------- Concept hub ---------- */
.concept__title { margin-top: 24px; font-size: clamp(32px, 4.6vw, 64px); font-weight: 900; line-height: 1.35; color: var(--ink); }
.concept__lead { margin-top: 24px; max-width: 40em; }
.hub { margin-top: 56px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1fr); grid-template-areas: "a c d" "b c e" "f c g"; gap: 16px 28px; align-items: center; }
.hub__a { grid-area: a; } .hub__b { grid-area: b; } .hub__c { grid-area: c; } .hub__d { grid-area: d; } .hub__e { grid-area: e; } .hub__f { grid-area: f; } .hub__g { grid-area: g; }
.role-chip { background: var(--white); border-radius: 20px; padding: 18px 20px; display: flex; gap: 14px; align-items: center; }
.role-chip--dark { background: var(--ink); }
.role-chip__icon { flex: none; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.role-chip__name { font-size: 15px; font-weight: 700; color: var(--ink); }
.role-chip__desc { font-size: 12px; line-height: 1.6; color: var(--sub); }
.role-chip--dark .role-chip__name { color: var(--white); }
.role-chip--dark .role-chip__desc { color: var(--dark-text); }
.hub__core { justify-self: center; width: min(100%, 400px); aspect-ratio: 1 / 1; border-radius: 50%; padding: 6px; background: var(--grad); }
.hub__core-inner { width: 100%; height: 100%; border-radius: 50%; background: var(--ink); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 12%; text-align: center; }
.hub__core-inner img { width: 70%; }
.hub__modules { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.hub__modules span { background: var(--dark-2); color: var(--white); border-radius: 999px; padding: 3px 12px; font-size: 12px; font-weight: 700; }

/* ---------- Value ---------- */
.value-list { margin-top: 44px; display: flex; flex-direction: column; gap: 20px; }
.value { border-radius: 36px; padding: clamp(28px, 4vw, 64px); display: flex; flex-wrap: wrap; gap: clamp(28px, 4vw, 64px); align-items: center; }
.value--reverse { flex-direction: row-reverse; }
.value__text { flex: 1 1 440px; min-width: 0; }
.value__media { flex: 1 1 460px; min-width: 0; position: relative; }
.value__label { display: inline-flex; align-items: center; gap: 10px; background: var(--white); border-radius: 999px; padding: 5px 16px 5px 5px; font-size: 14px; font-weight: 700; color: var(--ink); }
.value__label-icon { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.value__en { margin-top: 20px; font-family: var(--font-en); font-size: clamp(56px, 7vw, 104px); font-weight: 700; line-height: 0.95; letter-spacing: -0.02em; }
.value__en--g { color: var(--g); } .value__en--b { color: var(--b); } .value__en--p { color: var(--p); }
.value__title { margin-top: 22px; font-size: clamp(24px, 2.6vw, 34px); font-weight: 900; line-height: 1.45; color: var(--ink); }
.value__desc { margin-top: 14px; font-size: 16px; color: var(--text); }
.ba { margin-top: 24px; background: var(--white); border-radius: 22px; padding: 6px 22px; }
.ba__row { display: flex; gap: 14px; padding: 16px 0; }
.ba__row + .ba__row { border-top: 1px solid var(--line); }
.ba__label { flex: none; width: 76px; font-size: 13px; font-weight: 700; color: var(--muted); }
.ba__row p { font-size: 14px; line-height: 1.8; color: var(--sub); }
.ba__row--after p { font-weight: 700; color: var(--ink); }
.browser { background: var(--white); border-radius: 18px; overflow: hidden; box-shadow: 0 40px 70px -36px rgba(24,25,27,0.5); }
.browser__bar { display: flex; gap: 6px; padding: 10px 14px; background: var(--surface); }
.browser__bar span { width: 10px; height: 10px; border-radius: 50%; background: var(--line-2); }
.browser img { width: 100%; aspect-ratio: 16 / 11; object-fit: cover; }
.float-badge { position: absolute; left: -18px; bottom: -22px; background: var(--ink); color: var(--white); border-radius: 16px; padding: 14px 18px; font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 10px; box-shadow: 0 20px 40px -18px rgba(24,25,27,0.6); }
.float-badge i { width: 10px; height: 10px; border-radius: 50%; }

/* ---------- Experience ---------- */
.exp-list { margin-top: 40px; display: flex; flex-direction: column; gap: 14px; }
.exp { background: var(--white); border: 1px solid var(--line); border-radius: 28px; overflow: hidden; display: flex; flex-wrap: wrap; align-items: stretch; }
.exp__role { flex: 1 1 200px; padding: 24px 28px; display: flex; align-items: center; gap: 16px; }
.exp__icon { flex: none; width: 64px; height: 64px; border-radius: 50%; background: var(--white); display: flex; align-items: center; justify-content: center; box-shadow: 0 12px 26px -16px rgba(24,25,27,0.45); }
.exp__name { font-size: 17px; font-weight: 900; line-height: 1.5; color: var(--ink); }
.exp__body { flex: 5 1 560px; min-width: 0; padding: 26px clamp(20px, 3vw, 36px); display: flex; flex-wrap: wrap; gap: 16px 40px; align-items: center; }
.exp__title { flex: 1 1 260px; font-size: clamp(19px, 1.8vw, 23px); font-weight: 900; line-height: 1.55; color: var(--ink); }
.exp__points { flex: 1.3 1 340px; display: flex; flex-direction: column; gap: 8px; }
.check-list li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; line-height: 1.7; color: var(--text); }
.check-list svg { flex: none; margin-top: 4px; }

/* ---------- Applicant steps ---------- */
.apply-steps { margin-top: 56px; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px; }
.apply-step { display: flex; flex-direction: column; align-items: center; text-align: center; }
.phone { width: 190px; border-radius: 34px; background: var(--dark-2); padding: 10px; box-shadow: 0 30px 60px -30px rgba(0,0,0,0.8); }
.phone img { width: 100%; aspect-ratio: 1 / 2; object-fit: cover; border-radius: 26px; }
.apply-step__num { margin-top: 22px; font-family: var(--font-en); font-size: 14px; font-weight: 600; color: #B7BAC2; }
.apply-step__title { margin-top: 4px; font-size: 19px; font-weight: 900; color: var(--white); }
.apply-step__text { margin-top: 8px; font-size: 14px; line-height: 1.8; color: var(--dark-text); }

/* ---------- Features ---------- */
.split { display: flex; flex-wrap: wrap; gap: 40px clamp(40px, 6vw, 96px); }
.split__side { flex: 1 1 320px; }
.split__main { flex: 1.6 1 560px; min-width: 0; }
.stat-row { margin-top: 28px; display: flex; gap: 12px; }
.stat { flex: 1; background: var(--surface); border-radius: 22px; padding: 18px 20px; }
.stat__num { font-family: var(--font-en); font-size: 48px; font-weight: 700; line-height: 1; color: var(--ink); }
.stat__label { margin-top: 8px; font-size: 13px; font-weight: 700; color: var(--sub); }
.media-note { margin-top: 12px; background: var(--pastel); border-radius: 22px; padding: 20px 22px; }
.media-note strong { display: block; font-size: 15px; font-weight: 900; color: var(--ink); }
.media-note p { margin-top: 6px; font-size: 13px; line-height: 1.8; color: var(--text); }
.media-note small { display: block; margin-top: 6px; font-size: 11px; line-height: 1.7; color: var(--sub); }
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; align-content: start; }
.feature { background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 18px 20px; display: flex; gap: 14px; align-items: flex-start; }
.feature__icon { flex: none; width: 44px; height: 44px; border-radius: 14px; display: flex; align-items: center; justify-content: center; }
.feature__title { font-size: 16px; font-weight: 900; color: var(--ink); }
.feature__items { margin-top: 4px; font-size: 13px; line-height: 1.7; color: var(--sub); }
.feature__note { margin-top: 6px; display: inline-block; background: var(--surface); border-radius: 6px; padding: 0 8px; font-size: 11px; font-weight: 700; color: var(--sub); }

/* ---------- Security ---------- */
.sec-grid { display: flex; flex-wrap: wrap; gap: 48px clamp(40px, 6vw, 96px); align-items: center; }
.sec-grid__side { flex: 1 1 380px; }
.sec-grid__main { flex: 1.4 1 520px; display: flex; flex-direction: column; gap: 12px; }
.shield { margin-top: 40px; width: 220px; height: 220px; border-radius: 64px; background: var(--white); display: flex; align-items: center; justify-content: center; box-shadow: 0 30px 60px -36px rgba(24,25,27,0.5); }
.shield__inner { width: 150px; height: 150px; border-radius: 44px; background: var(--ink); display: flex; align-items: center; justify-content: center; position: relative; }
.shield__lock { position: absolute; right: -14px; top: -14px; width: 44px; height: 44px; border-radius: 50%; background: var(--grad); display: flex; align-items: center; justify-content: center; }
.sec-item { background: var(--white); border-radius: 26px; padding: 26px 28px; display: flex; gap: 20px; align-items: flex-start; }
.sec-item__tag { flex: none; font-size: 15px; font-weight: 700; color: var(--white); background: var(--ink); border-radius: 12px; padding: 8px 12px; line-height: 1.4; }
.sec-item__tag--ai { background: var(--p); font-family: var(--font-en); }
.sec-item__title { font-size: 19px; font-weight: 900; color: var(--ink); }
.sec-item__text { margin-top: 6px; font-size: 14px; line-height: 1.85; color: var(--sub); }
.pills { margin-top: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--ink); }
.pills span { background: var(--surface); border-radius: 999px; padding: 3px 12px; }
.pills .pill--dark { background: var(--ink); color: var(--white); }
.pills .pill--p { background: var(--p-t); color: var(--p-d); }
.todo { margin-top: 10px; display: inline-block; border: 1px dashed #B7BAC2; border-radius: 6px; padding: 4px 10px; font-size: 13px; color: var(--muted); }

/* ---------- Price ---------- */
.plan-grid { margin-top: 44px; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.plan { position: relative; border-radius: 28px; padding: 30px 26px; background: var(--surface); color: var(--ink); display: flex; flex-direction: column; }
.plan--rec { background: var(--ink); color: var(--white); }
.plan__rec { position: absolute; right: 22px; top: 22px; background: var(--white); color: var(--ink); border-radius: 999px; padding: 2px 12px; font-size: 12px; font-weight: 700; }
.plan__en { font-family: var(--font-en); font-size: 15px; font-weight: 600; color: var(--sub); }
.plan--rec .plan__en { color: var(--dark-text); }
.plan__name { margin-top: 2px; font-size: 20px; font-weight: 900; }
.plan__price { margin-top: 28px; line-height: 1.1; }
.plan__price b { font-family: var(--font-en); font-size: 64px; font-weight: 700; letter-spacing: -0.02em; }
.plan__price span { font-size: 18px; font-weight: 900; }
.plan__price small { font-size: 14px; color: var(--sub); }
.plan--rec .plan__price small { color: var(--dark-text); }
.plan__cap { margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line-2); font-size: 14px; color: var(--sub); }
.plan--rec .plan__cap { border-color: #3A3C41; color: var(--dark-text); }
.plan__cap b { font-family: var(--font-en); font-size: 20px; font-weight: 600; color: var(--ink); }
.plan--rec .plan__cap b { color: var(--white); }
.price-foot { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 14px 32px; align-items: center; justify-content: space-between; }
.price-foot p { flex: 1 1 560px; font-size: 14px; line-height: 1.9; color: var(--sub); }

/* ---------- Flow ---------- */
.flow-steps { margin-top: 44px; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.flow-step { background: var(--surface); border-radius: 28px; padding: 28px 26px; }
.flow-step__num { font-family: var(--font-en); font-size: 56px; font-weight: 700; line-height: 1; }
.flow-step__title { margin-top: 18px; font-size: 18px; font-weight: 900; color: var(--ink); }
.flow-step__text { margin-top: 8px; font-size: 14px; line-height: 1.85; color: var(--sub); }
.release-banner { margin-top: 16px; border-radius: 32px; background: var(--pastel); padding: clamp(28px, 4vw, 48px); display: flex; flex-wrap: wrap; gap: 24px 40px; align-items: center; justify-content: space-between; }
.release-banner__main { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; }
.release-banner__date { background: var(--ink); color: var(--white); border-radius: 22px; padding: 14px 24px; text-align: center; font-family: var(--font-en); }
.release-banner__date .release__day { font-size: 44px; line-height: 1.05; }
.release-banner__title { font-size: clamp(22px, 2.6vw, 30px); font-weight: 900; line-height: 1.45; color: var(--ink); }
.release-banner__sub { margin-top: 2px; font-size: 16px; font-weight: 700; color: var(--text); }

/* ---------- Document slider ---------- */
.doc-grid { display: flex; flex-wrap: wrap; gap: 40px clamp(40px, 6vw, 80px); align-items: center; }
.doc-grid__side { flex: 1 1 360px; }
.doc-grid__main { flex: 1.4 1 520px; min-width: 0; }
.doc-title { margin-top: 22px; font-size: clamp(28px, 3.2vw, 42px); font-weight: 900; line-height: 1.4; color: var(--ink); }
.slider { background: var(--white); border-radius: 24px; padding: 14px; box-shadow: 0 40px 70px -40px rgba(24,25,27,0.5); }
.slider__viewport { border-radius: 14px; overflow: hidden; aspect-ratio: 16 / 9; background: var(--surface); }
.slider__slide { width: 100%; height: 100%; object-fit: cover; }
.slider__slide[hidden] { display: none; }
.slider__nav { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 6px; }
.slider__btn { width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--surface); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.slider__btn--next { background: var(--ink); }
.slider__count { font-family: var(--font-en); font-size: 15px; font-weight: 600; color: var(--ink); }

/* ---------- FAQ ---------- */
.faq-list { border-top: 2px solid var(--ink); }
.faq { border-bottom: 1px solid var(--line-2); }
.faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 18px; min-height: 76px; padding: 18px 0; font-size: 17px; font-weight: 700; color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq__q { flex: none; width: 44px; font-family: var(--font-en); font-size: 18px; font-weight: 700; }
.faq__text { flex: 1; }
.faq__icon { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--surface); display: flex; align-items: center; justify-content: center; transition: transform .2s ease; }
.faq[open] .faq__icon { transform: rotate(45deg); }
.faq__a { padding: 0 54px 26px 62px; font-size: 15px; line-height: 1.95; color: var(--sub); }
@media (prefers-reduced-motion: reduce) { .faq__icon { transition: none; } }

/* ---------- Closing CTA ---------- */
.cta { background: var(--ink); padding: clamp(80px, 9vw, 128px) 0; }
.cta__grid { display: flex; flex-wrap: wrap; gap: 40px; align-items: center; justify-content: space-between; }
.cta__main { flex: 1 1 560px; }
.cta__main img { height: 30px; width: auto; }
.cta__title { margin-top: 28px; font-size: clamp(30px, 4vw, 52px); font-weight: 900; line-height: 1.4; color: var(--white); }
.cta__lead { margin-top: 18px; font-size: 16px; color: var(--dark-text); }
.cta__buttons { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 12px; }
.cta__buttons .btn { border-radius: 10px; }
.contact-card { flex: 0 1 400px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: 20px; padding: 28px; font-size: 14px; line-height: 2; color: var(--dark-text); }
.contact-card__label { font-size: 13px; font-weight: 700; color: #B7BAC2; }
.contact-card__name { margin-top: 10px; font-size: 16px; font-weight: 700; color: var(--white); }
.contact-card__rows { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.contact-card__rows p { display: flex; align-items: center; gap: 10px; }
.contact-card__tel { font-family: var(--font-en); font-size: 18px; font-weight: 600; color: var(--white); }
.contact-card a { color: var(--white); }

/* ---------- Footer ---------- */
.site-footer { padding: 36px 0 44px; }
.site-footer__inner { display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: center; justify-content: space-between; }
.site-footer__inner img { height: 22px; width: auto; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: 13px; }
.site-footer nav a { color: var(--sub); }
.site-footer small { flex-basis: 100%; font-size: 12px; color: var(--muted); }

/* ---------- Sub pages ---------- */
.page-hero { background: var(--pastel); padding: clamp(40px, 5vw, 72px) 0 clamp(48px, 6vw, 88px); }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; font-size: 13px; color: var(--sub); }
.breadcrumb a { color: var(--sub); }
.breadcrumb li + li::before { content: "/"; margin-right: 8px; color: var(--muted); }
.page-title { margin-top: 20px; font-size: clamp(30px, 3.8vw, 48px); font-weight: 900; line-height: 1.4; color: var(--ink); }
.page-lead { margin-top: 14px; max-width: 40em; font-size: 16px; color: var(--text); }
.page-body { padding: clamp(40px, 5vw, 72px) 0 clamp(80px, 9vw, 120px); }
.page-body--overlap { margin-top: clamp(-56px, -4vw, -32px); padding-top: 0; }
.two-col { display: flex; flex-wrap: wrap; gap: 40px clamp(40px, 5vw, 80px); align-items: flex-start; }
.two-col__side { flex: 1 1 380px; min-width: 0; }
.two-col__main { flex: 1 1 520px; min-width: 300px; }
.info-title { display: flex; align-items: center; gap: 14px; font-size: 18px; font-weight: 900; color: var(--ink); }
.info-title span { flex: none; width: 52px; height: 52px; border-radius: 14px; background: var(--ink); display: flex; align-items: center; justify-content: center; }
.info-list { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.info-chips { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 12px; }
.info-chip { flex: 1 1 150px; background: var(--surface); border-radius: 18px; padding: 16px 18px; }
.info-chip small { display: block; font-size: 12px; font-weight: 700; color: var(--muted); }
.info-chip b { font-size: 16px; color: var(--ink); }
.contact-box { margin-top: 28px; border-top: 1px solid var(--line); padding-top: 24px; font-size: 14px; line-height: 2; color: var(--sub); }
.contact-box strong { color: var(--ink); }
.done-mark { width: 76px; height: 76px; border-radius: 50%; padding: 3px; background: var(--grad); }
.done-mark span { width: 100%; height: 100%; border-radius: 50%; background: var(--ink); display: flex; align-items: center; justify-content: center; }
.next-steps { margin-top: 20px; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.next-step { background: var(--surface); border-radius: 22px; padding: 24px; }
.next-step__num { font-family: var(--font-en); font-size: 28px; font-weight: 700; line-height: 1; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.next-step__title { margin-top: 12px; font-size: 16px; font-weight: 900; color: var(--ink); }
.next-step__text { margin-top: 4px; font-size: 14px; color: var(--sub); }
.sub-cta { margin-top: 40px; border-radius: 28px; background: var(--pastel); padding: clamp(24px, 3vw, 36px); display: flex; flex-wrap: wrap; gap: 16px 24px; align-items: center; justify-content: space-between; }
.sub-cta p { font-size: 14px; color: var(--text); }
.sub-cta strong { display: block; font-size: 18px; font-weight: 900; color: var(--ink); }
.sub-cta--dark { background: var(--ink); }
.sub-cta--dark strong { color: var(--white); }
.sub-cta--dark p { color: var(--dark-text); }
.back-link { margin-top: 32px; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 15px; font-weight: 700; color: var(--ink); }
.doc-cover { border-radius: 24px; padding: clamp(18px, 3vw, 28px); background: var(--white); box-shadow: 0 30px 60px -36px rgba(24,25,27,0.45); }
.doc-cover img { border-radius: 12px; }
.doc-meta { margin-top: 16px; font-size: 13px; color: var(--muted); }
.viewer { margin-top: 36px; border-radius: 28px; padding: clamp(14px, 2.4vw, 28px); background: var(--white); box-shadow: 0 40px 70px -40px rgba(24,25,27,0.5); }
.viewer__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; font-size: 14px; font-weight: 700; color: var(--ink); }
.viewer iframe { display: block; width: 100%; height: clamp(420px, 60vw, 760px); border: 0; border-radius: 14px; background: var(--surface); }

/* ---------- Mobile fixed CTA ---------- */
.sp-cta { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .site-nav { display: none; }
}
@media (max-width: 860px) {
  .kv__notices { display: none; }
  .hub { grid-template-columns: minmax(0, 1fr); grid-template-areas: "c" "a" "b" "f" "d" "e" "g"; }
  .float-badge { display: none; }
  .value--reverse { flex-direction: row; }
}
@media (max-width: 760px) {
  .notice__link { display: none; }
  .site-header__actions .btn--light { display: none; }
  .faq__a { padding: 0 0 22px 62px; }
  .sp-cta { display: flex; position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 60; }
  .sp-cta .btn { flex: 1; box-shadow: 0 16px 32px -12px rgba(24,25,27,0.6); }
  body.has-sp-cta { padding-bottom: 84px; }
}

/* =========================================================
   v2 additions
   ========================================================= */
/* 見出しの改行位置を<wbr>で制御 */
.h2, .kv__title, .concept__title, .issue-card__title, .value__title, .exp-card__to, .cta__title, .page-title, .release-banner__title { word-break: keep-all; overflow-wrap: anywhere; }

/* ---------- KV（ファーストビューに収める版） ---------- */
.kv--compact { padding: clamp(28px, 3.2vw, 48px) 0 clamp(32px, 3.2vw, 48px); }
.kv--compact .kv__grid { align-items: center; gap: clamp(28px, 3.4vw, 56px); }
.kv__badges { display: flex; flex-wrap: wrap; gap: 8px; }
.kv__release { display: inline-flex; align-items: center; gap: 8px; background: var(--ink); color: var(--white); border-radius: 999px; padding: 6px 16px; font-size: 14px; font-weight: 700; text-decoration: none; }
.kv__release:hover { color: var(--white); background: #33353A; }
.kv__release b { font-family: var(--font-en); font-size: 16px; }
.kv--compact .kv__title { margin-top: 20px; font-size: clamp(34px, 3.9vw, 56px); line-height: 1.22; }
.kv--compact .kv__lead { margin-top: 16px; font-size: 16px; line-height: 1.85; max-width: 36em; }
.kv__screen { position: relative; margin-top: 26px; }
.browser--kv { box-shadow: 0 30px 60px -30px rgba(24,25,27,0.45); }
.browser--kv img { aspect-ratio: 16 / 7; object-fit: cover; object-position: top; }
.float-chip { position: absolute; display: flex; align-items: center; gap: 10px; background: var(--white); border-radius: 14px; padding: 10px 16px 10px 10px; font-size: 13px; font-weight: 700; color: var(--ink); box-shadow: 0 16px 32px -14px rgba(24,25,27,0.4); }
.float-chip__icon { flex: none; width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.float-chip--a { right: -14px; top: -18px; }
.float-chip--b { left: -14px; bottom: -16px; }
.form-card--compact { padding: 24px 28px; gap: 10px; }
.form-card--compact .form-card__title { font-size: 20px; }
.form-card--compact .sf-form { gap: 10px; }
.form-card--compact .field input, .form-card--compact .field select { min-height: 44px; }
.form-card--compact .agree { min-height: 36px; }

/* ---------- Issue 見出し ---------- */
.head-stack .lead { margin-top: 16px; }
.issue-card__solve a.badge { text-decoration: none; }
.issue-card__solve a.badge:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- 4つの特徴 ---------- */
.feat-list { margin-top: 44px; display: flex; flex-direction: column; gap: 20px; }
.feat { scroll-margin-top: 100px; }
.feat__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.feat__num { font-family: var(--font-en); font-size: 15px; font-weight: 600; color: var(--sub); }
.feat__num b { font-size: 34px; font-weight: 700; margin-left: 4px; color: var(--ink); }
.feat__name { margin-top: 14px; font-size: clamp(30px, 3.4vw, 46px); font-weight: 900; line-height: 1.25; letter-spacing: 0.01em; }
.feat__name--g { color: var(--g-d); } .feat__name--b { color: var(--b-d); } .feat__name--p { color: var(--p-d); } .feat__name--k { color: var(--ink); }
.feat .value__title { margin-top: 10px; font-size: clamp(20px, 2vw, 26px); }
.func-chips { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 6px; }
.func-chips li { background: var(--white); border-radius: 999px; padding: 4px 14px; font-size: 13px; font-weight: 700; color: var(--ink); }
.func-chips li small { font-size: 11px; color: var(--muted); margin-left: 4px; }

/* ---------- Experience（2列＋主役カード） ---------- */
.exp-grid { margin-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.exp-card { background: var(--white); border: 1px solid var(--line); border-radius: 28px; overflow: hidden; display: flex; flex-direction: column; }
.exp-card__head { display: flex; align-items: center; gap: 14px; padding: 18px 24px; }
.exp-card__head .exp__icon { width: 52px; height: 52px; }
.exp-card__role { font-size: 16px; font-weight: 900; color: var(--ink); }
.exp-card__body { padding: 22px 28px 28px; display: flex; flex-direction: column; gap: 16px; flex: 1; }
.exp-card__from { font-size: 14px; color: var(--muted); }
.exp-card__from span, .exp-card__to-label { display: inline-block; margin-right: 8px; font-size: 12px; font-weight: 700; border-radius: 6px; padding: 1px 8px; }
.exp-card__from span { background: var(--surface); color: var(--muted); }
.exp-card__arrow { margin: -6px 0; }
.exp-card__to { font-size: clamp(20px, 2vw, 26px); font-weight: 900; line-height: 1.5; color: var(--ink); }
.exp-card__to-label { vertical-align: middle; color: var(--white); }
.exp-card .check-list { display: flex; flex-direction: column; gap: 8px; padding-top: 14px; border-top: 1px solid var(--line); }
.exp-card--wide { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
.exp-card--wide .exp-card__head { flex: 1 1 260px; flex-direction: column; align-items: flex-start; justify-content: center; padding: 32px; }
.exp-card--wide .exp-card__head .exp__icon { width: 72px; height: 72px; }
.exp-card--wide .exp-card__role { font-size: 20px; }
.exp-card--wide .exp-card__head p { font-size: 14px; color: var(--sub); font-weight: 500; }
.exp-card--wide .exp-card__body { flex: 3 1 560px; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 20px 40px; padding: 32px clamp(24px, 3vw, 40px); }
.exp-card--wide .exp-card__change { flex: 1 1 300px; display: flex; flex-direction: column; gap: 14px; }
.exp-card--wide .check-list { flex: 1 1 300px; border-top: 0; padding-top: 0; }
.exp-card--wide .exp-card__to { font-size: clamp(22px, 2.3vw, 30px); }
.exp-card__change { display: flex; flex-direction: column; gap: 14px; }

/* ---------- 応募者ステップ：ブランドグラデーション背景 ---------- */
.block--brand { background: linear-gradient(120deg, var(--g) 0%, var(--b) 48%, var(--p-d) 100%); color: var(--white); }
.block--brand .lead--white { color: rgba(255,255,255,0.88); }
.block--brand .apply-step__num { color: rgba(255,255,255,0.75); }
.block--brand .apply-step__text { color: rgba(255,255,255,0.9); }
.block--brand .phone { background: var(--ink); }

@media (max-width: 860px) {
  .float-chip { display: none; }
  .exp-grid { grid-template-columns: minmax(0, 1fr); }
  .exp-card--wide .exp-card__head { flex-direction: row; align-items: center; padding: 18px 24px; }
}

/* =========================================================
   v3 additions
   ========================================================= */
.site-header__logo img { height: 36px; }

/* MVの見出し：Source/Secure/Selectのバッジを縦にそろえる */
.kv__title--grid { display: grid; grid-template-columns: max-content max-content; column-gap: 0.32em; row-gap: 0.04em; align-items: center; justify-content: start; }
.kv__title--grid .kv__pill { justify-self: start; }

/* Value：4つの特徴の早見 */
.feat-map { margin-top: 36px; background: var(--surface); border-radius: 28px; padding: 22px clamp(18px, 2.4vw, 28px) 24px; }
.feat-map__title { font-size: 14px; font-weight: 900; color: var(--ink); }
.feat-map__list { margin-top: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.feat-map__item { height: 100%; display: flex; align-items: center; gap: 12px; background: var(--white); border-radius: 18px; padding: 14px 16px; text-decoration: none; color: var(--ink); transition: box-shadow .2s; }
.feat-map__item:hover { color: var(--ink); box-shadow: 0 12px 26px -16px rgba(24,25,27,0.45); }
.feat-map__icon { flex: none; width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.feat-map__text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.feat-map__text b { font-size: 15px; font-weight: 900; }
.feat-map__text small { font-size: 12px; line-height: 1.6; color: var(--sub); }
.feat-map__to { flex: none; font-family: var(--font-en); font-size: 12px; font-weight: 600; color: var(--sub); border: 1px solid var(--line-2); border-radius: 999px; padding: 1px 10px; }

/* Value：この成果を支える特徴 */
.value { scroll-margin-top: 100px; }
.support { margin-top: 16px; background: rgba(255,255,255,0.6); border: 1px solid rgba(255,255,255,0.9); border-radius: 22px; padding: 16px 20px 18px; }
.support__head { font-size: 12px; font-weight: 700; color: var(--muted); }
.support__item { margin-top: 10px; }
.support__item + .support__item { padding-top: 12px; border-top: 1px dashed var(--line-2); }
.support__name { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 900; color: var(--ink); }
.support__icon { width: 26px; height: 26px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.support__text { margin-top: 4px; font-size: 14px; line-height: 1.75; color: var(--text); }
.support .func-chips { margin-top: 8px; }

/* Experience：上段3枚・下段2枚（中央寄せ・同じ幅） */
.exp-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.exp-grid > .exp-card { flex: 0 1 calc((100% - 32px) / 3); min-width: 0; }
@media (max-width: 1080px) { .exp-grid > .exp-card { flex-basis: calc((100% - 16px) / 2); } }
@media (max-width: 680px) { .exp-grid > .exp-card { flex-basis: 100%; } }
.exp-card .exp-card__to { font-size: clamp(19px, 1.7vw, 23px); }
.feat-map__item { position: relative; flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px 18px 18px; }
.feat-map__to { position: absolute; right: 14px; top: 16px; }

/* =========================================================
   v4：Value 別案（3つの切り口） index_b.html
   ========================================================= */
.angles { margin-top: 44px; display: flex; flex-direction: column; gap: 24px; }
.angle { border-radius: 36px; padding: clamp(28px, 4vw, 64px); scroll-margin-top: 100px; }
.angle__top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.angle__num { font-family: var(--font-en); font-size: 15px; font-weight: 600; color: var(--sub); }
.angle__num b { font-size: 34px; font-weight: 700; margin-left: 4px; color: var(--ink); }
.angle__cat { font-size: 14px; font-weight: 700; color: var(--ink); background: var(--white); border-radius: 999px; padding: 4px 14px; }
.angle__title { margin-top: 16px; font-size: clamp(28px, 3.2vw, 44px); font-weight: 900; line-height: 1.35; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.angle__lead { margin-top: 14px; max-width: 46em; font-size: 16px; color: var(--text); }
.angle__sub { margin-top: 36px; font-size: 18px; font-weight: 900; color: var(--ink); display: flex; align-items: center; gap: 10px; }
.angle__sub::before { content: ""; width: 6px; height: 22px; border-radius: 3px; background: currentColor; opacity: 0.9; }
.angle__sub--g { color: var(--g-d); } .angle__sub--b { color: var(--b-d); } .angle__sub--p { color: var(--p-d); }
.angle__sub span { color: var(--ink); }

/* AI：4つの機能 */
.ai-grid { margin-top: 18px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 16px; }
.ai-card { background: var(--white); border-radius: 24px; padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.ai-card--soon { background: rgba(255,255,255,0.55); border: 2px dashed rgba(var(--p-rgb),0.5); }
.ai-card__img { border-radius: 14px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); }
.ai-card__img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: top; }
.ai-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.ai-card__no { font-family: var(--font-en); font-size: 13px; font-weight: 700; color: var(--white); background: var(--p); border-radius: 8px; padding: 2px 10px; }
.ai-card__soon { font-size: 12px; font-weight: 700; color: var(--p-d); background: var(--p-t); border-radius: 999px; padding: 2px 10px; }
.ai-card__name { font-size: 21px; font-weight: 900; color: var(--ink); }
.ai-card__catch { font-size: 13px; font-weight: 700; color: var(--p-d); }
.ai-card dl { margin: 0; display: grid; grid-template-columns: 44px 1fr; gap: 8px 12px; font-size: 14px; line-height: 1.75; }
.ai-card dt { font-size: 12px; font-weight: 700; color: var(--muted); padding-top: 2px; }
.ai-card dd { margin: 0; color: var(--text); }
.ai-card dd.is-effect { font-weight: 700; color: var(--ink); }
.ai-note { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; background: var(--white); border-radius: 18px; padding: 14px 20px; font-size: 14px; font-weight: 700; color: var(--ink); }
.ai-note span { display: inline-flex; align-items: center; gap: 6px; }
.evidence { margin-top: 18px; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.evidence__item { background: rgba(255,255,255,0.65); border-radius: 20px; padding: 18px 20px; display: flex; gap: 16px; align-items: center; }
.evidence__num { flex: none; font-family: var(--font-en); font-size: 40px; font-weight: 700; line-height: 1; color: var(--ink); }
.evidence__num small { font-size: 18px; }
.evidence__text { font-size: 14px; line-height: 1.7; color: var(--text); }
.evidence__text b { color: var(--ink); }
.src { margin-top: 10px; font-size: 11px; line-height: 1.7; color: var(--muted); }

/* 母集団：エージェント専用画面 */
.agent-split { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 24px 40px; align-items: center; }
.agent-split__text { flex: 1 1 420px; min-width: 0; }
.agent-split__media { flex: 1.2 1 480px; min-width: 0; }
.agent-split__desc { font-size: 15px; line-height: 1.85; color: var(--text); }
.agent-steps { margin-top: 18px; display: flex; flex-direction: column; gap: 8px; counter-reset: st; }
.agent-steps li { display: flex; gap: 14px; align-items: flex-start; background: var(--white); border-radius: 16px; padding: 12px 16px; }
.agent-steps__n { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--g); color: var(--white); font-family: var(--font-en); font-size: 14px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.agent-steps b { display: block; font-size: 15px; color: var(--ink); }
.agent-steps small { display: block; font-size: 13px; line-height: 1.6; color: var(--sub); }
.intake { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; }
.intake__group { flex: 1.2 1 260px; display: flex; flex-direction: column; gap: 8px; }
.intake__src { background: var(--white); border-radius: 14px; padding: 10px 14px; font-size: 14px; font-weight: 700; color: var(--ink); display: flex; justify-content: space-between; gap: 10px; }
.intake__src small { font-size: 12px; font-weight: 700; color: var(--g-d); }
.intake__arrow { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
.intake__db { flex: 1 1 220px; background: var(--white); border: 2px solid var(--g); border-radius: 20px; padding: 18px; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.intake__db b { font-size: 17px; color: var(--ink); }
.intake__db p { font-size: 13px; line-height: 1.7; color: var(--sub); }
.intake__goal { flex: 1 1 220px; background: var(--ink); color: var(--white); border-radius: 20px; padding: 18px; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.intake__goal b { font-size: 17px; }
.intake__goal p { font-size: 13px; line-height: 1.7; color: var(--dark-text); }

/* 選考を止めない：ワンアクション・分業体制 */
.oneaction { margin-top: 18px; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; }
.oneaction li { background: var(--white); border-radius: 20px; padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; }
.oneaction__task { font-size: 13px; font-weight: 700; color: var(--b-d); }
.oneaction__before { font-size: 13px; line-height: 1.6; color: var(--muted); }
.oneaction__after { font-size: 20px; font-weight: 900; line-height: 1.45; color: var(--ink); }
.duo { margin-top: 18px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 16px; }
.duo-card { background: var(--white); border-radius: 24px; padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.duo-card__img { border-radius: 14px; overflow: hidden; border: 1px solid var(--line); }
.duo-card__img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: top; }
.duo-card__tag { align-self: flex-start; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 2px 12px; }
.duo-card__name { font-size: 21px; font-weight: 900; color: var(--ink); }
.duo-card__text { font-size: 14px; line-height: 1.8; color: var(--text); }
.duo-card .check-list { display: flex; flex-direction: column; gap: 6px; }
.duo-card .check-list li { font-size: 14px; }
.oneaction__after { word-break: keep-all; overflow-wrap: anywhere; }
.ai-card, .duo-card { gap: 10px; }
.ai-card__img, .duo-card__img { margin-bottom: 6px; }

/* =========================================================
   v5
   ========================================================= */
h4 { margin: 0; }

/* MV：ボタンと区別するため、角丸のピルをやめる */
.kv__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.kv__eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--ink); padding-bottom: 6px; border-bottom: 2px solid transparent; border-image: var(--grad) 1; }
.kv__release { display: inline-flex; align-items: stretch; border: 1px solid var(--ink); border-radius: 4px; background: rgba(255,255,255,0.7); overflow: hidden; }
.kv__release-date { display: flex; align-items: center; padding: 4px 12px; background: var(--ink); color: var(--white); font-family: var(--font-en); font-size: 20px; font-weight: 700; line-height: 1; }
.kv__release-text { display: flex; flex-direction: column; justify-content: center; padding: 4px 12px; font-size: 12px; font-weight: 500; line-height: 1.5; color: var(--sub); }
.kv__release-text b { font-size: 13px; font-weight: 900; color: var(--ink); }
.kv__en { justify-self: start; font-family: var(--font-en); font-size: 0.3em; font-weight: 600; letter-spacing: 0.04em; line-height: 1.2; padding-bottom: 0.12em; border-bottom: 2px solid currentColor; }
.kv__en--g { color: var(--g-d); } .kv__en--b { color: var(--b-d); } .kv__en--p { color: var(--p-d); }
.form-card__meta { flex: none; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--muted); }

/* Value：カード内の説明と効果・ポイントを区別 */
.ai-card { gap: 8px; }
.ai-card__head { margin-top: 4px; }
.ai-card__name { font-size: 21px; line-height: 1.4; }
.ai-card__catch { margin-top: -2px; }
.ai-card__desc { margin-top: 4px; font-size: 14px; line-height: 1.8; color: var(--text); }
.effect { margin-top: 8px; border-radius: 14px; padding: 12px 14px; }
.effect__label { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 900; }
.effect p { margin-top: 2px; font-size: 14px; font-weight: 700; line-height: 1.7; color: var(--ink); }
.duo { grid-template-columns: minmax(0, 1fr); }
.duo-card { flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 20px 32px; padding: 24px; }
.duo-card__img { flex: 1 1 380px; min-width: 0; margin-bottom: 0; }
.duo-card__body { flex: 1.2 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.duo-card__name { font-size: 22px; line-height: 1.4; }
.points { margin-top: 8px; background: var(--surface); border-radius: 16px; padding: 14px 16px 16px; }
.points__title { font-size: 12px; font-weight: 900; color: var(--muted); margin-bottom: 8px; }
.patterns { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.patterns li { background: var(--white); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.patterns b { font-size: 14px; color: var(--b-d); }
.patterns b small { margin-left: 6px; font-size: 11px; color: var(--muted); background: var(--surface); border-radius: 4px; padding: 0 6px; }
.patterns span { font-size: 13px; line-height: 1.6; color: var(--text); }

/* Experience：これまで→これから */
.shift { display: flex; flex-direction: column; align-items: stretch; }
.shift__before { background: var(--surface); border-radius: 16px; padding: 12px 16px 16px; }
.shift__before p { font-size: 14px; color: var(--muted); }
.shift__after { border-radius: 16px; padding: 18px 16px 14px; }
.shift__after p { font-size: clamp(19px, 1.7vw, 22px); font-weight: 900; line-height: 1.45; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.shift__label { display: block; font-size: 11px; font-weight: 900; letter-spacing: 0.04em; color: var(--muted); }
.shift__arrow { position: relative; z-index: 1; align-self: center; width: 32px; height: 32px; margin: -10px 0; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 4px var(--white); }

/* Price：プラン名が2行になっても行をそろえる */
.plan-grid { align-items: stretch; }
@supports (grid-template-rows: subgrid) {
  .plan { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; align-items: start; }
  .plan__name { align-self: start; }
}
.kv__release { padding: 0; gap: 0; color: var(--ink); }
.kv__release:hover { background: rgba(255,255,255,0.7); color: var(--ink); }
.plan__name { word-break: keep-all; overflow-wrap: anywhere; }

/* Salesforceフォーム（iframe） */
.sf-embed { margin: 0 -6px; }
.sf-embed iframe { display: block; width: 100%; min-height: 500px; border: 0; }

/* =========================================================
   v6
   ========================================================= */
/* 画面キャプチャは切り取らずに全体を表示 */
.browser img, .duo-card__img img, .agent-split__media img { aspect-ratio: auto; height: auto; object-fit: contain; }
.duo-card__img { background: var(--surface); display: flex; align-items: center; justify-content: center; }

/* ---------- AI機能の画面（HTMLで再現） ---------- */
.ai-card__ui { margin-bottom: 6px; }
.ui { background: #F6F7F9; border: 1px solid var(--line); border-radius: 14px; padding: 14px; font-size: 12px; line-height: 1.6; color: var(--text); }
.ui__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; font-weight: 900; color: var(--ink); }
.ui__head span { display: inline-flex; align-items: center; gap: 6px; }
.ui__btn { font-size: 11px; font-weight: 700; color: var(--sub); background: var(--white); border: 1px solid var(--line-2); border-radius: 6px; padding: 1px 8px; }
.ui__note { margin-top: 4px; font-size: 10px; color: #8A8D95; }
.ui__panel { margin-top: 8px; background: var(--white); border: 1px solid var(--line); border-top: 3px solid #1E88E5; border-radius: 10px; padding: 10px 12px; }
.ui__title { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 900; color: #1E78D2; }
.ui__sub { margin-top: 8px; font-size: 11px; font-weight: 900; color: var(--ink); }
.ui__box { margin-top: 6px; background: #F4F5F7; border-radius: 8px; padding: 8px 10px; }
.ui__row { display: grid; grid-template-columns: 9em 1fr; gap: 8px; font-size: 11px; }
.ui__row b { font-weight: 700; }
.ui__text { margin-top: 4px; font-size: 11px; line-height: 1.7; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.ui__tags { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; }
.ui__tag { font-size: 11px; font-weight: 700; border-radius: 999px; padding: 1px 10px; border: 1px solid; }
.ui__tag--ok { color: #1E9E6B; background: #E8F6F0; border-color: #BFE6D4; }
.ui__tag--ng { color: #E0474C; background: #FDEEEE; border-color: #F5C6C8; }
.ui__tag--blue { color: #1E78D2; background: #EAF3FC; border-color: #B9D8F5; border-radius: 4px; }
.ui__tag--purple { color: #6B46D6; background: #F1ECFC; border-color: #D3C5F5; border-radius: 4px; }
.ui__cols { margin-top: 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ui__point { border-radius: 10px; padding: 8px 10px; font-size: 11px; line-height: 1.6; }
.ui__point b { display: block; font-size: 12px; margin-bottom: 2px; }
.ui__point--good { background: #E6F5EF; } .ui__point--good b { color: #1E9E6B; }
.ui__point--check { background: #FCECEC; } .ui__point--check b { color: #E0474C; }
.ui__point--warn { margin-top: 8px; background: #FCF5E3; } .ui__point--warn b { color: #B98A0B; }
.ui__group { margin-top: 8px; background: var(--white); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.ui__group-head { display: flex; align-items: center; gap: 8px; padding: 6px 10px; font-size: 12px; font-weight: 900; color: var(--ink); }
.ui__group-head i { width: 20px; height: 20px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-style: normal; }
.ui__q { display: flex; align-items: flex-start; gap: 8px; padding: 6px 10px; border-top: 1px solid #EEF0F3; font-size: 11px; }
.ui__q em { flex: none; width: 16px; height: 16px; border-radius: 4px; font-style: normal; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.ui__q span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.q-blue .ui__group-head { background: #F1F7FD; } .q-blue i, .q-blue em { background: #E1EEFB; color: #1E78D2; }
.q-yellow .ui__group-head { background: #FBF6EA; } .q-yellow i, .q-yellow em { background: #F7EBCD; color: #B98A0B; }
.q-green .ui__group-head { background: #EEF8F3; } .q-green i, .q-green em { background: #D9F0E5; color: #1E9E6B; }
.q-red .ui__group-head { background: #FDF1F1; } .q-red i, .q-red em { background: #F9DCDD; color: #E0474C; }
.ui__tabs { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; }
.ui__tabs span { font-size: 11px; font-weight: 700; border: 1px solid var(--line-2); border-radius: 999px; padding: 2px 10px; background: var(--white); }
.ui__tabs .is-on { border-color: #1E88E5; color: #1E78D2; background: #F1F7FD; }
.ui__card { margin-top: 6px; background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; }
.ui__card-head { display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 900; color: var(--ink); }
.ui__pass { font-size: 10px; font-weight: 700; color: #1E9E6B; background: #E8F6F0; border: 1px solid #BFE6D4; border-radius: 999px; padding: 0 8px; }
.ui__meta { font-size: 10px; color: #8A8D95; }
.ui--modal { background: #FFFFFF; box-shadow: 0 10px 24px -14px rgba(24,25,27,0.4); }
.ui__field { margin-top: 6px; }
.ui__field b { display: block; font-size: 11px; font-weight: 900; color: var(--ink); }
.ui__field p { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ui__foot { margin-top: 10px; display: flex; gap: 6px; }
.ui__foot span { font-size: 11px; font-weight: 700; border-radius: 6px; padding: 4px 12px; }
.ui__foot .is-primary { background: var(--p); color: var(--white); }
.ui__foot .is-sub { border: 1px solid var(--line-2); color: var(--sub); }

/* ---------- MV：フォームの見出しを白枠の外に ---------- */
.kv-form { flex: 0 1 430px; min-width: 300px; display: flex; flex-direction: column; gap: 12px; }
.kv-form__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.kv-form__title { font-size: 22px; font-weight: 900; color: var(--ink); line-height: 1.4; }
.kv-form__meta { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--sub); }
.kv-form__frame { background: var(--white); border-radius: 20px; padding: 6px 8px; box-shadow: 0 30px 60px -30px rgba(24,25,27,0.4); }
.kv-form__frame iframe { display: block; width: 100%; border: 0; }
.kv-form .certs p { color: var(--sub); }
.kv-form--on-dark .kv-form__title { color: var(--white); }
.kv-form--on-dark .kv-form__meta, .kv-form--on-dark .certs p { color: rgba(255,255,255,0.85); }

/* ---------- MV案2：ダーク ---------- */
.kv--dark { background: #121316; color: var(--white); }
.kv--dark .kv__eyebrow { color: var(--white); }
.kv--dark .kv__title { color: var(--white); }
.kv--dark .kv__lead { color: rgba(255,255,255,0.82); }
.kv--dark .kv__en--g { color: #5AD3A9; } .kv--dark .kv__en--b { color: #7FB0F7; } .kv--dark .kv__en--p { color: #B49BF5; }
.kv--dark .kv__release { border-color: rgba(255,255,255,0.6); background: rgba(255,255,255,0.08); }
.kv--dark .kv__release-date { background: var(--white); color: var(--ink); }
.kv--dark .kv__release-text, .kv--dark .kv__release-text b { color: var(--white); }
.kv--dark .browser--kv { box-shadow: 0 0 0 1px rgba(255,255,255,0.12), 0 40px 80px -30px rgba(var(--b-rgb),0.55); }

/* ---------- MV案3：スプリット ---------- */
.kv-split { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); min-height: calc(100vh - 72px); }
.kv-split__main { position: relative; overflow: hidden; padding: clamp(32px, 4vw, 56px) clamp(20px, 4vw, 56px) clamp(28px, 3vw, 40px) max(clamp(20px, 4vw, 48px), calc((100vw - 1240px) / 2 + 48px)); background: #FFFFFF; }
.kv-split__side { position: relative; overflow: hidden; background: linear-gradient(150deg, var(--g) 0%, var(--b) 52%, var(--p-d) 100%); padding: clamp(32px, 4vw, 56px) max(clamp(20px, 4vw, 48px), calc((100vw - 1240px) / 2 + 48px)) clamp(28px, 3vw, 40px) clamp(24px, 3vw, 48px); display: flex; align-items: center; }
.kv-split__side .kv-form { flex: 1 1 auto; max-width: 440px; }
.kv-feats { margin-top: 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-width: 560px; }
.kv-feats li { display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; font-size: 14px; font-weight: 700; color: var(--ink); }
.kv-feats i { flex: none; width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.kv-split .kv__screen { margin-top: 24px; max-width: 640px; }
@media (max-width: 960px) { .kv-split { grid-template-columns: minmax(0, 1fr); min-height: 0; } .kv-split__main, .kv-split__side { padding-left: 20px; padding-right: 20px; } }
.browser--kv img { aspect-ratio: 16 / 8; object-fit: cover; object-position: top; }
.kv-split { min-height: 0; }
.kv-split .kv__title { margin-top: 18px; font-size: clamp(34px, 3.6vw, 52px); line-height: 1.22; }
.kv-split .kv__lead { margin-top: 14px; font-size: 15px; line-height: 1.85; max-width: 36em; }
.kv-split .kv-feats { margin-top: 16px; }
.kv-split .kv-feats li { padding: 8px 12px; }
.kv-split .browser--kv img { aspect-ratio: 16 / 6; }
.kv-split .kv__screen { margin-top: 22px; }
.kv-split__side { align-items: flex-start; }
.ui__row { grid-template-columns: max-content 1fr; column-gap: 12px; }
.ui__row b { white-space: nowrap; }

/* =========================================================
   v7
   ========================================================= */
/* MV：フォームの白枠の高さ（固定）。数値を変えるだけで調整できます */
:root { --kv-form-height: 600px; }
.kv--compact .kv__grid { align-items: flex-start; }
.kv-form { padding-top: 0; }
.kv-form__head { min-height: 38px; align-items: center; }
.kv-form__frame iframe { height: var(--kv-form-height); }

/* AI機能：画面の大きさとテキストの位置をそろえる */
:root { --ai-ui-height: 540px; }
.ai-card__ui .ui { height: var(--ai-ui-height); overflow: hidden; position: relative; }
@supports (grid-template-rows: subgrid) {
  .ai-grid { align-items: stretch; }
  .ai-card { display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 8px; align-content: start; }
  .ai-card > * { margin-top: 0; margin-bottom: 0; }
  .ai-card__ui { margin-bottom: 6px; }
}

/* エージェント連携：画面とステップの配置 */
.agent-split { align-items: flex-start; gap: 24px 36px; }
.agent-split__text { flex: 1 1 400px; }
.agent-split__media { flex: 1.25 1 480px; }
.agent-steps li { padding: 10px 14px; }

/* ---------- MVデザイン案B：メタ情報を1行に・コピー左に英字ラベル ---------- */
.kv-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font-size: 13px; font-weight: 700; color: var(--sub); min-height: 38px; }
.kv-meta__ai { display: inline-flex; align-items: center; gap: 6px; color: var(--ink); }
.kv-meta__sep { width: 1px; height: 16px; background: var(--line-2); }
.kv-meta__release { display: inline-flex; align-items: baseline; gap: 6px; }
.kv-meta__release b { font-family: var(--font-en); font-size: 17px; font-weight: 700; color: var(--ink); }
.kv-meta__release span { color: var(--ink); }
.kv-meta__release i { font-style: normal; font-size: 12px; color: var(--b-d); background: var(--b-t); border-radius: 3px; padding: 1px 6px; }
.kv-lines { margin-top: 20px; display: grid; grid-template-columns: max-content max-content; column-gap: 18px; row-gap: 4px; align-items: center; justify-content: start; }
.kv-lines__label { display: flex; flex-direction: column; align-items: flex-end; text-align: right; padding-right: 14px; border-right: 3px solid currentColor; line-height: 1.25; }
.kv-lines__label b { font-family: var(--font-en); font-size: 15px; font-weight: 600; }
.kv-lines__label small { font-size: 11px; font-weight: 700; color: var(--muted); }
.kv-lines__text { font-size: clamp(34px, 3.9vw, 56px); font-weight: 900; line-height: 1.22; color: var(--ink); }
.c-gb { color: var(--g-d); } .c-bb { color: var(--b-d); } .c-pb { color: var(--p-d); }

/* ---------- MVデザイン案C：グラデーション文字・リリースの丸スタンプ・マーカー ---------- */
.kv-c { position: relative; }
.kv-c__eyebrow { display: flex; align-items: center; gap: 8px; min-height: 38px; font-size: 20px; font-weight: 900; color: var(--ink); }
.grad-text { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kv-seal { position: absolute; right: 6px; top: 0; width: 118px; height: 118px; border-radius: 50%; background: var(--ink); color: var(--white); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; transform: rotate(-8deg); box-shadow: 0 0 0 6px rgba(255,255,255,0.7); }
.kv-seal small { font-family: var(--font-en); font-size: 11px; font-weight: 600; letter-spacing: 0.08em; color: #B7BAC2; }
.kv-seal b { font-family: var(--font-en); font-size: 30px; font-weight: 700; line-height: 1.05; }
.kv-seal span { margin-top: 2px; font-size: 10px; font-weight: 700; line-height: 1.35; }
.kv-c .kv__title { margin-top: 18px; font-size: clamp(34px, 3.9vw, 56px); line-height: 1.24; }
.kv-c .kv__title span { display: block; }
.hl { background-repeat: no-repeat; background-size: 100% 0.32em; background-position: 0 88%; }
.hl--g { background-image: linear-gradient(rgba(var(--g-rgb),0.35), rgba(var(--g-rgb),0.35)); }
.hl--b { background-image: linear-gradient(rgba(var(--b-rgb),0.30), rgba(var(--b-rgb),0.30)); }
.hl--p { background-image: linear-gradient(rgba(var(--p-rgb),0.32), rgba(var(--p-rgb),0.32)); }
.kv-s { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 13px; font-weight: 700; color: var(--sub); }
.kv-s li { display: inline-flex; align-items: baseline; gap: 6px; }
.kv-s b { font-family: var(--font-en); font-size: 15px; font-weight: 600; }
.kv-s i { width: 8px; height: 8px; border-radius: 50%; align-self: center; }
@media (max-width: 860px) { .kv-seal { width: 92px; height: 92px; } .kv-seal b { font-size: 22px; } }

.ui__foot .is-primary { background: #7B4FE0; }

/* =========================================================
   再検討版（index_c.html）
   ========================================================= */
/* 装飾：球体・点はなし。やわらかい色面のみ */
.sphere, .dot { display: none; }
.deco svg g { opacity: 0.35; }
.grad-text { background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kv-seal { background: var(--ink); }
.kv-seal small { color: rgba(255,255,255,0.7); }
.kv-seal::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--accent); opacity: 0.85; }
.block--brand { background: var(--brand-dark); }
.plan--rec { background: var(--ink); }

/* ---------- MV（共通） ---------- */
.kv-new { position: relative; overflow: hidden; background: #FFFFFF; }
.kv-new .kv-aurora { position: absolute; inset: 0; pointer-events: none; }
.kv-new .kv-aurora i { position: absolute; border-radius: 50%; filter: blur(70px); }
.kv-new .kv-icons { display: none; }
.kv-new .kv-panel { position: relative; }
.kv-new .browser--kv { border: 1px solid rgba(255,255,255,0.8); box-shadow: 0 30px 60px -30px rgba(var(--b-rgb),0.35); }
.kv-new .kv-form__frame { background: rgba(255,255,255,0.86); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 30px 60px -30px rgba(var(--b-rgb),0.35); }
.kv-new .float-chip { background: rgba(255,255,255,0.88); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.9); }

/* MV案A：オーロラ（白地にやわらかい色のにじみ） */
.mv-a .kv-new { background: #F8FAFC; }
.mv-a .kv-aurora .a1 { width: 620px; height: 520px; right: -120px; top: -140px; background: rgba(var(--b-rgb),0.30); }
.mv-a .kv-aurora .a2 { width: 560px; height: 460px; left: -160px; bottom: -200px; background: rgba(var(--g-rgb),0.32); }
.mv-a .kv-aurora .a3 { width: 460px; height: 380px; left: 42%; bottom: -220px; background: rgba(var(--p-rgb),0.22); }

/* MV案B：グラス（すりガラスのパネルの中に配置） */
.mv-b .kv-new { background: linear-gradient(160deg, rgba(var(--g-rgb),0.16), rgba(var(--b-rgb),0.18) 55%, rgba(var(--p-rgb),0.16)); padding-top: clamp(20px, 2.4vw, 32px); padding-bottom: clamp(24px, 2.6vw, 36px); }
.mv-b .kv-aurora .a1 { width: 700px; height: 600px; right: 8%; top: -260px; background: rgba(255,255,255,0.75); filter: blur(90px); }
.mv-b .kv-aurora .a2 { width: 520px; height: 420px; left: -120px; top: 30%; background: rgba(var(--g-rgb),0.35); }
.mv-b .kv-aurora .a3 { width: 520px; height: 420px; right: -120px; bottom: -160px; background: rgba(var(--b-rgb),0.35); }
.mv-b .kv-panel { background: rgba(255,255,255,0.55); -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); border: 1px solid rgba(255,255,255,0.85); border-radius: 32px; padding: clamp(24px, 2.8vw, 40px) clamp(20px, 3vw, 44px); box-shadow: 0 40px 80px -50px rgba(var(--b-rgb),0.45); }
.mv-b .kv-new .container { max-width: 1320px; }

/* MV案C：グロー（下から立ちのぼる光＋機能アイコン） */
.mv-c .kv-new { background: #FFFFFF; }
.mv-c .kv-aurora .a1 { width: 900px; height: 360px; left: 10%; bottom: -230px; background: rgba(var(--b-rgb),0.45); filter: blur(80px); }
.mv-c .kv-aurora .a2 { width: 560px; height: 300px; left: -140px; bottom: -180px; background: rgba(var(--g-rgb),0.45); filter: blur(80px); }
.mv-c .kv-aurora .a3 { width: 560px; height: 300px; right: -140px; bottom: -170px; background: rgba(var(--p-rgb),0.40); filter: blur(80px); }
.mv-c .kv-new .kv-icons { display: block; position: absolute; inset: 0; pointer-events: none; }
.kv-icons span { position: absolute; width: 52px; height: 52px; border-radius: 16px; background: rgba(255,255,255,0.92); box-shadow: 0 16px 30px -16px rgba(var(--b-rgb),0.45); display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.9); }
.kv-icons .i1 { left: 3%; top: 22%; } .kv-icons .i2 { left: 5.5%; top: 58%; } .kv-icons .i3 { right: 2.5%; top: 70%; } .kv-icons .i4 { left: 46%; top: 6%; }
@media (max-width: 1280px) { .kv-icons { display: none !important; } }

/* ---------- Value 共通：課題チップ・体験ブロック ---------- */
.issue-chips { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.issue-chips > b { font-size: 13px; font-weight: 900; color: var(--sub); margin-right: 4px; }
.issue-chips span { display: inline-flex; align-items: center; gap: 6px; background: var(--white); border: 1px solid var(--line-2); border-radius: 999px; padding: 4px 14px; font-size: 13px; font-weight: 700; color: var(--ink); }
.xp-grid { margin-top: 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 14px; }
.xp { background: var(--white); border-radius: 22px; padding: 22px 24px; }
.xp h4 { display: flex; align-items: center; gap: 10px; font-size: 18px; font-weight: 900; line-height: 1.5; color: var(--ink); }
.xp h4::before { content: ""; flex: none; width: 4px; height: 22px; border-radius: 2px; background: var(--grad); }
.xp p { margin-top: 8px; font-size: 14px; line-height: 1.85; color: var(--text); }
.xp ul { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.xp li { display: flex; gap: 8px; font-size: 14px; line-height: 1.7; color: var(--text); }
.xp li svg { flex: none; margin-top: 4px; }

/* AIの働く場面（プロセス） */
.process { margin-top: 24px; background: var(--white); border-radius: 22px; padding: 20px 22px; }
.process__title { font-size: 14px; font-weight: 900; color: var(--ink); }
.process__row { margin-top: 14px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.process__step { display: flex; flex-direction: column; gap: 6px; text-align: center; }
.process__name { position: relative; border: 1px solid var(--line-2); border-radius: 10px; padding: 8px 4px; font-size: 13px; font-weight: 700; color: var(--ink); background: var(--white); }
.process__step:not(:last-child) .process__name::after { content: ""; position: absolute; right: -8px; top: 50%; width: 8px; height: 1px; background: var(--line-2); }
.process__ai { border-radius: 10px; padding: 6px 4px; font-size: 12px; font-weight: 700; line-height: 1.45; color: var(--white); background: var(--p); }
.process__human { border-radius: 10px; padding: 6px 4px; font-size: 12px; font-weight: 700; line-height: 1.45; color: var(--ink); background: var(--white); border: 1.5px solid var(--ink); }
.process__note { margin-top: 12px; font-size: 13px; font-weight: 700; color: var(--sub); text-align: center; }
@media (max-width: 860px) { .process__row { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* 立場ごとの効果 */
.persona { margin-top: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.persona__item { background: rgba(255,255,255,0.7); border: 1px solid rgba(255,255,255,0.95); border-radius: 18px; padding: 16px 18px; }
.persona__who { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 900; color: var(--ink); }
.persona__who i { width: 30px; height: 30px; border-radius: 50%; background: var(--white); display: flex; align-items: center; justify-content: center; }
.persona__item p { margin-top: 6px; font-size: 13px; line-height: 1.8; color: var(--text); }

/* AI機能カード：テキストを上、画面を下 */
.ai-grid2 { margin-top: 18px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 16px; }
.ai-card2 { background: var(--white); border-radius: 24px; padding: 22px; display: flex; flex-direction: column; gap: 10px; }
.ai-card2--soon { border: 2px dashed rgba(var(--p-rgb),0.45); }
.ai-card2__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ai-card2__no { font-family: var(--font-en); font-size: 13px; font-weight: 700; color: var(--white); background: var(--p-d); border-radius: 8px; padding: 2px 10px; }
.ai-card2__scene { font-size: 12px; font-weight: 700; color: var(--p-d); background: var(--p-t); border-radius: 999px; padding: 2px 10px; }
.ai-card2__soon { font-size: 12px; font-weight: 700; color: var(--muted); background: var(--surface); border-radius: 999px; padding: 2px 10px; }
.ai-card2__name { font-size: 22px; font-weight: 900; line-height: 1.4; color: var(--ink); }
.change { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.change__from, .change__to { border-radius: 12px; padding: 8px 12px; font-size: 13px; line-height: 1.55; }
.change__from { background: var(--surface); color: var(--muted); }
.change__to { background: var(--p-t); color: var(--ink); font-weight: 900; }
.change small { display: block; font-size: 10px; font-weight: 700; letter-spacing: 0.04em; color: var(--muted); }
.change__to small { color: var(--p-d); }
.change__arrow { width: 26px; height: 26px; border-radius: 50%; background: var(--p); display: flex; align-items: center; justify-content: center; }
.effect2 { display: flex; gap: 10px; align-items: flex-start; border-top: 1px solid var(--line); padding-top: 10px; }
.effect2 b { flex: none; font-size: 12px; font-weight: 900; color: var(--white); background: var(--ink); border-radius: 6px; padding: 1px 8px; margin-top: 2px; }
.effect2 p { font-size: 14px; font-weight: 700; line-height: 1.7; color: var(--ink); }
.ai-card2 .ui { height: var(--ai-ui-height); overflow: hidden; margin-top: 4px; }
@supports (grid-template-rows: subgrid) {
  .ai-card2 { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 10px; }
  .ai-card2 > * { margin: 0; }
}

/* エージェント連携：体験の対比と好循環 */
.agent-xp { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: flex-start; }
.agent-xp__text { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.agent-xp__media { flex: 1.2 1 480px; min-width: 0; }
.xp--who { position: relative; padding-top: 18px; }
.xp__tag { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 900; color: var(--g-d); background: var(--g-t); border-radius: 999px; padding: 2px 12px; }
.xp--who h4 { margin-top: 8px; }
.result-chips { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.result-chips span { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--ink); background: var(--white); border-radius: 999px; padding: 6px 14px; }
.cycle { margin-top: 22px; background: var(--white); border-radius: 22px; padding: 20px 22px; }
.cycle__title { font-size: 14px; font-weight: 900; color: var(--ink); }
.cycle__row { margin-top: 12px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; counter-reset: c; }
.cycle__row li { position: relative; border-radius: 14px; background: var(--g-t); padding: 12px 14px; font-size: 14px; font-weight: 900; line-height: 1.5; color: var(--ink); }
.cycle__row li small { display: block; font-family: var(--font-en); font-size: 11px; font-weight: 700; color: var(--g-d); }
.cycle__row li:not(:last-child)::after { content: ""; position: absolute; right: -9px; top: 50%; width: 8px; height: 8px; border-top: 2px solid var(--g-d); border-right: 2px solid var(--g-d); transform: translateY(-50%) rotate(45deg); }
.cycle__row li:last-child { background: var(--g-d); color: var(--white); }
.cycle__row li:last-child small { color: rgba(255,255,255,0.8); }
@media (max-width: 860px) { .cycle__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cycle__row li::after { display: none; } }

/* 日程調整：共通の流れ・三者の体験・調整パターン */
.sched { margin-top: 28px; background: var(--white); border-radius: 26px; padding: clamp(20px, 3vw, 32px); }
.sched__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 20px; }
.sched__title { font-size: clamp(22px, 2.4vw, 30px); font-weight: 900; line-height: 1.4; color: var(--ink); }
.sched__title span { color: var(--b-d); }
.sched__lead { margin-top: 8px; font-size: 14px; line-height: 1.85; color: var(--text); max-width: 52em; }
.sched__sub { margin-top: 26px; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; font-size: 16px; font-weight: 900; color: var(--ink); }
.sched__sub small { font-size: 13px; font-weight: 700; color: var(--b-d); }
.flow5 { margin-top: 12px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.flow5 li { position: relative; border-radius: 14px; background: var(--b-t); padding: 12px 12px 14px; text-align: center; }
.flow5 li:not(:last-child)::after { content: ""; position: absolute; right: -9px; top: 50%; width: 8px; height: 8px; border-top: 2px solid var(--b-d); border-right: 2px solid var(--b-d); transform: translateY(-50%) rotate(45deg); }
.flow5 small { display: block; font-size: 12px; font-weight: 700; color: var(--b-d); }
.flow5 b { display: block; margin-top: 2px; font-size: 14px; line-height: 1.5; color: var(--ink); }
.flow5 li:last-child { background: var(--b-d); } .flow5 li:last-child small, .flow5 li:last-child b { color: var(--white); }
@media (max-width: 860px) { .flow5 { grid-template-columns: minmax(0, 1fr); } .flow5 li::after { display: none; } }
.party { margin-top: 12px; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.party__card { border: 1px solid var(--line); border-radius: 20px; padding: 18px 20px; display: flex; flex-direction: column; gap: 10px; }
.party__who { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; color: var(--sub); }
.party__who i { width: 34px; height: 34px; border-radius: 50%; background: var(--b-t); display: flex; align-items: center; justify-content: center; }
.party__do { font-size: 19px; font-weight: 900; line-height: 1.45; color: var(--ink); }
.party__card ul { display: flex; flex-direction: column; gap: 6px; }
.party__card li { display: flex; gap: 8px; font-size: 13px; line-height: 1.7; color: var(--text); }
.party__card li svg { flex: none; margin-top: 3px; }
.party__effect { margin-top: auto; border-radius: 12px; background: var(--surface); padding: 10px 12px; font-size: 13px; font-weight: 700; line-height: 1.6; color: var(--ink); }
.party__effect b { color: var(--b-d); margin-right: 6px; }
.patterns3 { margin-top: 12px; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.pattern { border-radius: 18px; background: var(--surface); padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.pattern__name { align-self: flex-start; font-size: 13px; font-weight: 900; color: var(--white); background: var(--b-d); border-radius: 6px; padding: 2px 10px; }
.pattern__desc { font-size: 15px; font-weight: 900; line-height: 1.55; color: var(--ink); }
.pattern__fit { margin-top: auto; border-top: 1px dashed var(--line-2); padding-top: 8px; font-size: 13px; line-height: 1.7; color: var(--text); }
.pattern__fit b { display: block; font-size: 12px; color: var(--b-d); }
.pattern--soon { background: var(--white); border: 1px dashed var(--line-2); }
.pattern--soon .pattern__name { background: var(--muted); }
.sched__shot { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; }
.sched__shot .duo-card__img { flex: 1 1 360px; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); }
.sched__shot p { flex: 1 1 320px; font-size: 14px; line-height: 1.85; color: var(--text); }
.mv-a .kv-aurora .a1 { background: rgba(var(--b-rgb),0.38); }
.mv-a .kv-aurora .a2 { background: rgba(var(--g-rgb),0.40); bottom: -120px; }
.mv-c .kv-new::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 55%; pointer-events: none; background: linear-gradient(to top, rgba(var(--b-rgb),0.16), rgba(var(--g-rgb),0.06) 50%, transparent); }
.mv-c .kv-aurora .a1 { bottom: -140px; height: 420px; }
.mv-c .kv-aurora .a2 { bottom: -100px; }
.mv-c .kv-aurora .a3 { bottom: -100px; }
.kv-icons .i4 { left: auto; right: 2.5%; top: 26%; }
.kv-new .kv-panel { z-index: 1; }
.party__do, .pattern__desc, .change__to, .xp h4 { word-break: keep-all; overflow-wrap: anywhere; }
.patterns3 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.process__name { min-height: 54px; display: flex; align-items: center; justify-content: center; }
.sched__shot .duo-card__img { background: var(--surface); }
.ai-grid2 > * { min-width: 0; }
.ai-card2 .ui { max-width: 100%; }
.change { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
@media (max-width: 520px) { .change { grid-template-columns: minmax(0, 1fr); } .change__arrow { justify-self: center; transform: rotate(90deg); } .ui__row { grid-template-columns: minmax(0, 1fr); } }
.ai-card2, .ai-card { grid-template-columns: minmax(0, 1fr); }

/* AI機能：テキストの4カード＋画面イメージ2点 */
.ai-grid4 { margin-top: 18px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 14px; }
.ai-grid4 > * { min-width: 0; }
.ai-grid4 .ai-card2 { padding: 20px; }
.ai-grid4 .ai-card2__name { font-size: 19px; word-break: keep-all; overflow-wrap: anywhere; }
@supports (grid-template-rows: subgrid) { .ai-grid4 .ai-card2 { grid-row: span 4; } }
.change--v { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.change--v .change__arrow { justify-self: center; width: 22px; height: 22px; }
.effect2--v { flex-direction: column; gap: 6px; }
.effect2--v b { align-self: flex-start; }
.effect2--v p { font-size: 13px; }
.ai-shots { margin-top: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 16px; }
.ai-shots > * { min-width: 0; }
.ai-shot { margin: 0; background: var(--white); border-radius: 24px; padding: 18px; display: flex; flex-direction: column; gap: 12px; }
.ai-shot figcaption { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 900; color: var(--ink); }
.ai-shot .ui { height: var(--ai-ui-height); overflow: hidden; max-width: 100%; }

/* AI機能：カード2列・画面にポイント番号 */
.ai-grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ai-grid4 .ai-card2__name { font-size: 21px; }
.ai-grid4 .effect2 p { font-size: 14px; }
@media (max-width: 760px) { .ai-grid4 { grid-template-columns: minmax(0, 1fr); } }
.ai-points { margin-top: 20px; display: flex; flex-direction: column; gap: 16px; }
.ai-point { background: var(--white); border-radius: 24px; padding: clamp(18px, 2.4vw, 28px); display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: center; }
.ai-point--rev { flex-direction: row-reverse; }
.ai-point__media { flex: 1.15 1 440px; min-width: 0; }
.ai-point__media .ui { height: auto; max-width: 100%; }
.ai-point__text { flex: 1 1 320px; min-width: 0; }
.ai-point__title { display: flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 900; color: var(--ink); }
.pins { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.pins li { display: flex; gap: 12px; align-items: flex-start; }
.pins li p { font-size: 15px; font-weight: 900; color: var(--ink); line-height: 1.5; }
.pins li span { display: block; margin-top: 2px; font-size: 13px; line-height: 1.75; color: var(--text); }
.pin { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--accent-pin, #F59E0B); color: #FFFFFF; font-family: var(--font-en); font-size: 12px; font-weight: 700; line-height: 1; box-shadow: 0 0 0 3px rgba(255,255,255,0.9); }
.ui .pin { width: 16px; height: 16px; font-size: 10px; margin-right: 5px; vertical-align: -3px; box-shadow: 0 0 0 2px #FFFFFF; }
.ui__group-head .pin { margin-right: 0; }
.ui__point .pin { display: inline-flex; }
.pins .pin { margin-top: 1px; }
@media (max-width: 860px) { .ai-point--rev { flex-direction: row; } }

/* AI機能：画面イメージを横に2つ・ポイントは一言 */
.ai-shots2 { margin-top: 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 860px) { .ai-shots2 { grid-template-columns: minmax(0, 1fr); } }
.ai-shot2 { margin: 0; background: var(--white); border-radius: 24px; padding: 18px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ai-shot2__media .ui { height: var(--ai-ui-height); overflow: hidden; max-width: 100%; }
.ai-shot2 figcaption p { font-size: 15px; font-weight: 900; color: var(--ink); }
.pins-s { margin-top: 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; }
.pins-s li { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--ink); line-height: 1.5; }
@media (max-width: 520px) { .pins-s { grid-template-columns: minmax(0, 1fr); } }
.ai-shot2__media .ui { height: 560px; }

/* 応募者の操作：スマホでは横スクロール（カルーセル） */
.carousel { position: relative; }
.carousel__btn, .carousel__dots { display: none; }
@media (max-width: 760px) {
  .carousel { margin: 0 calc(-1 * clamp(20px, 4vw, 64px)); }
  .carousel .apply-steps { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 28px; padding: 4px 28px 8px; margin-top: 36px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .carousel .apply-steps::-webkit-scrollbar { display: none; }
  .carousel .apply-step { flex: 0 0 78%; scroll-snap-align: start; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.22); border-radius: 24px; padding: 22px 18px 24px; }
  .carousel .phone { width: 170px; }
  .carousel__btn { display: flex; position: absolute; top: 42%; z-index: 2; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255,255,255,0.95); color: var(--ink); font-size: 22px; line-height: 1; align-items: center; justify-content: center; box-shadow: 0 10px 24px -10px rgba(0,0,0,0.45); cursor: pointer; }
  .carousel__btn--prev { left: 6px; } .carousel__btn--next { right: 6px; }
  .carousel__btn:disabled { opacity: 0; pointer-events: none; }
  .carousel__dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
  .carousel__dots span { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.4); transition: width .2s, background .2s; }
  .carousel__dots span.is-on { width: 22px; border-radius: 4px; background: #FFFFFF; }
}
@media (prefers-reduced-motion: reduce) { .carousel__dots span { transition: none; } }

/* スマホではMVのフォームを非表示（画面下の固定ボタンからお問い合わせページへ） */
@media (max-width: 760px) { .kv-new .kv-form { display: none; } }

/* AI機能カード：番号のみ・バッジは右寄せ・これまで→これからはExperienceと同じ表現 */
.ai-card2__head { justify-content: space-between; }
.ai-card2__num { font-family: var(--font-en); font-size: 30px; font-weight: 700; line-height: 1; color: var(--p-d); }
.ai-card2__badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.ai-card2 .shift__before { padding: 10px 14px 14px; }
.ai-card2 .shift__after { padding: 14px 14px 12px; }
.ai-card2 .shift__after p { font-size: clamp(16px, 1.5vw, 19px); }
.ai-card2--soon { border: 0; background: linear-gradient(180deg, rgba(var(--p-rgb),0.10) 0%, #FFFFFF 46%); box-shadow: inset 0 0 0 1px rgba(var(--p-rgb),0.25); }
.ai-card2--soon .ai-card2__soon { color: #FFFFFF; background: var(--ink); }
.ai-card2--soon .ai-card2__num { color: var(--muted); }

/* 画面イメージ（KARTEの「効果検証」型：画面＋ラベル＋一言＋短文） */
.scr-cards { margin-top: 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 860px) { .scr-cards { grid-template-columns: minmax(0, 1fr); } }
.scr-card { margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.scr-card__frame { border-radius: 24px; padding: clamp(16px, 2.2vw, 28px) clamp(16px, 2.2vw, 28px) 0; background: linear-gradient(160deg, rgba(var(--g-rgb),0.18), rgba(var(--b-rgb),0.16) 60%, rgba(var(--p-rgb),0.14)); overflow: hidden; height: 440px; }
.scr-card__frame .ui { border-radius: 12px 12px 0 0; border-bottom: 0; box-shadow: 0 20px 40px -24px rgba(var(--b-rgb),0.45); height: auto; max-width: 100%; }
.scr-card__label { font-size: 13px; font-weight: 700; color: var(--p-d); }
.scr-card__title { margin: 4px 0 0; font-size: clamp(18px, 1.8vw, 22px); font-weight: 900; line-height: 1.5; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.scr-card__text { margin-top: 6px; font-size: 14px; line-height: 1.8; color: var(--text); }

/* =========================================================
   Value（案2ベース：色の帯＋白地）
   ========================================================= */
.vsec { padding: clamp(80px, 9vw, 140px) 0 0; }
.vsec__head { margin-bottom: clamp(40px, 5vw, 64px); }
.vart + .vart { margin-top: clamp(72px, 8vw, 112px); }
.vband { position: relative; overflow: hidden; padding: clamp(56px, 6vw, 88px) 0; }
.vband--p { background: linear-gradient(120deg, rgba(var(--p-rgb),0.14), rgba(var(--b-rgb),0.12) 55%, rgba(var(--g-rgb),0.10)); }
.vband--g { background: linear-gradient(120deg, rgba(var(--g-rgb),0.16), rgba(var(--p-rgb),0.10) 55%, rgba(var(--b-rgb),0.10)); }
.vband--b { background: linear-gradient(120deg, rgba(var(--b-rgb),0.14), rgba(var(--p-rgb),0.10) 55%, rgba(var(--g-rgb),0.10)); }
.vband__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 32px clamp(32px, 5vw, 72px); align-items: center; }
.vtag { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; color: var(--sub); }
.vtag b { font-family: var(--font-en); font-size: 15px; font-weight: 700; color: var(--ink); }
.vtag span { background: rgba(255,255,255,0.75); border-radius: 999px; padding: 3px 12px; font-size: 13px; }
.vband__title { margin-top: 16px; font-size: clamp(28px, 3.2vw, 44px); font-weight: 900; line-height: 1.35; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.vband__lead { margin-top: 14px; font-size: 15px; line-height: 1.9; color: var(--text); }
.vband .issue-chips span { background: rgba(255,255,255,0.8); border-color: rgba(255,255,255,0.9); }
.vband__visual { min-width: 0; }
.vband__visual .browser img { aspect-ratio: auto; }
.vshot { border-radius: 18px; overflow: hidden; background: #FFFFFF; box-shadow: 0 30px 60px -30px rgba(var(--b-rgb),0.5); }
.vshot img { width: 100%; height: auto; display: block; }
.vshot--flat { box-shadow: none; border: 1px solid var(--line); }
.vproc { background: rgba(255,255,255,0.75); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: 1px solid rgba(255,255,255,0.9); border-radius: 24px; padding: 24px 28px; box-shadow: 0 30px 60px -36px rgba(var(--b-rgb),0.5); }
.vproc__title { font-size: 15px; font-weight: 900; color: var(--ink); }
.vproc__list { margin-top: 14px; display: flex; flex-direction: column; border-left: 2px solid var(--line-2); }
.vproc__list li { position: relative; padding: 0 0 14px 20px; font-size: 15px; color: var(--sub); }
.vproc__list li:last-child { padding-bottom: 0; }
.vproc__list li::before { content: ""; position: absolute; left: -7px; top: 7px; width: 12px; height: 12px; border-radius: 50%; background: var(--white); border: 2px solid var(--line-2); }
.vproc__list li.ai::before { background: var(--p); border-color: var(--p); }
.vproc__list li.human::before { background: var(--ink); border-color: var(--ink); }
.vproc__list b { font-weight: 900; color: var(--ink); }
.vproc__list span { margin-left: 10px; font-size: 12px; font-weight: 700; color: var(--p-d); background: var(--p-t); border-radius: 999px; padding: 1px 10px; }
.vproc__list li.human span { color: var(--white); background: var(--ink); }
.vband__flow { margin-top: 36px; }
.vband__flow-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; font-size: 17px; font-weight: 900; color: var(--ink); }
.vband__flow-title small { font-size: 13px; font-weight: 700; color: var(--b-d); }
.vflow { margin-top: 12px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.vflow li { position: relative; background: rgba(255,255,255,0.8); border-radius: 14px; padding: 12px; text-align: center; }
.vflow li:not(:last-child)::after { content: ""; position: absolute; right: -9px; top: 50%; width: 8px; height: 8px; border-top: 2px solid var(--b-d); border-right: 2px solid var(--b-d); transform: translateY(-50%) rotate(45deg); }
.vflow small { display: block; font-size: 12px; font-weight: 700; color: var(--b-d); }
.vflow b { display: block; margin-top: 2px; font-size: 14px; line-height: 1.5; color: var(--ink); }
.vflow li:last-child { background: var(--b-d); } .vflow li:last-child small, .vflow li:last-child b { color: var(--white); }

.vbody { padding-top: clamp(44px, 5vw, 64px); }
.vsub { margin: clamp(44px, 5vw, 64px) 0 0; display: flex; align-items: center; gap: 10px; font-size: 18px; font-weight: 900; color: var(--ink); }
.vsub::before { content: ""; width: 20px; height: 3px; border-radius: 2px; background: var(--grad); }
.vpoints { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 48px; }
.vpoint { border-top: 2px solid var(--ink); padding-top: 16px; }
.vpoint h4 { margin: 0; font-size: 19px; font-weight: 900; line-height: 1.5; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.vpoint p { margin-top: 8px; font-size: 14px; line-height: 1.9; color: var(--text); }
.vpoint__tag { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 900; color: var(--g-d); margin-bottom: 6px; }
.vchecks { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.vchecks li { display: flex; gap: 8px; font-size: 14px; line-height: 1.7; color: var(--text); }
.vchecks li svg { flex: none; margin-top: 4px; }
.vper { margin-top: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 32px; }
.vper__who { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 900; color: var(--ink); }
.vper__who i { width: 34px; height: 34px; border-radius: 50%; background: var(--p-t); display: flex; align-items: center; justify-content: center; }
.vper__text { margin-top: 8px; font-size: 14px; line-height: 1.85; color: var(--text); }

/* 4つのAI機能（リスト型） */
.ailist { margin-top: 12px; border-top: 1px solid var(--line); }
.ailist__row { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 0 20px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.ailist__num { font-family: var(--font-en); font-size: 34px; font-weight: 700; line-height: 1; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ailist__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
.ailist__name { margin: 0; font-size: 20px; font-weight: 900; color: var(--ink); }
.ailist__badges { display: flex; flex-wrap: wrap; gap: 6px; }
.ailist__scene { font-size: 12px; font-weight: 700; color: var(--p-d); background: var(--p-t); border-radius: 999px; padding: 2px 12px; }
.ailist__soon { font-size: 12px; font-weight: 700; color: var(--white); background: var(--ink); border-radius: 999px; padding: 2px 12px; }
.ailist__grid { margin-top: 14px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 14px 28px; align-items: center; }
.ailist__change { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; }
.ailist__from, .ailist__to { margin: 0; border-radius: 14px; padding: 10px 14px; font-size: 14px; line-height: 1.55; }
.ailist__from { background: var(--surface); color: var(--muted); padding-right: 22px; }
.ailist__to { background: var(--p-t); color: var(--ink); font-weight: 900; padding-left: 22px; }
.ailist__from small, .ailist__to small, .ailist__effect small { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; color: var(--muted); }
.ailist__to small { color: var(--p-d); }
.ailist__arrow { position: relative; z-index: 1; width: 32px; height: 32px; margin: 0 -12px; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 4px var(--white); }
.ailist__effect { display: flex; gap: 12px; align-items: flex-start; }
.ailist__effect-icon { flex: none; width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.ailist__effect p { margin: 0; font-size: 14px; font-weight: 700; line-height: 1.7; color: var(--ink); }
.ailist__row.is-soon .ailist__num { background: none; color: var(--muted); }
.vnote { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 14px; font-weight: 700; color: var(--ink); }
.vnote span { display: inline-flex; align-items: center; gap: 6px; }

/* ワンアクション・三者・パターン・分業 */
.voa { margin-top: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.voa li { border-top: 3px solid var(--b); padding-top: 12px; }
.voa__task { font-size: 13px; font-weight: 700; color: var(--b-d); }
.voa__after { margin-top: 4px; font-size: 19px; font-weight: 900; line-height: 1.45; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.voa__before { margin-top: 6px; font-size: 12px; line-height: 1.6; color: var(--muted); }
.vrow-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.vrow__nav { display: flex; gap: 8px; }
.vrow__nav button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line-2); background: var(--white); cursor: pointer; font-size: 18px; color: var(--ink); }
.vrow-wrap { margin-top: 14px; }
.vrow { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: none; }
.vrow::-webkit-scrollbar { display: none; }
.vrow > * { flex: 0 0 calc((100% - 32px) / 2.5); scroll-snap-align: start; }
.vparty { border: 1px solid var(--line); border-radius: 22px; padding: 22px; background: var(--white); display: flex; flex-direction: column; gap: 8px; }
.vparty__who { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; color: var(--sub); }
.vparty__who i { width: 32px; height: 32px; border-radius: 50%; background: var(--b-t); display: flex; align-items: center; justify-content: center; }
.vparty__do { font-size: 20px; font-weight: 900; line-height: 1.45; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.vparty__eff { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); font-size: 14px; font-weight: 700; color: var(--ink); }
.vparty__eff b { color: var(--b-d); margin-right: 8px; }
.vpat { margin-top: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.vpat li { border-top: 3px solid var(--b); padding-top: 12px; }
.vpat li.is-soon { border-top-color: var(--line-2); }
.vpat b { font-size: 16px; color: var(--ink); }
.vpat p { margin-top: 4px; font-size: 14px; line-height: 1.7; color: var(--text); }
.vpat small { display: block; margin-top: 8px; font-size: 12px; line-height: 1.6; color: var(--muted); }
.vsplit { margin-top: 14px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 40px; align-items: center; }
.vsplit__lead { font-size: 15px; line-height: 1.9; color: var(--text); }
.vband .cycle__row li, .vbody .cycle__row { }
.vbody .cycle__row { margin-top: 14px; }

@media (max-width: 960px) {
  .vband__grid, .vpoints, .vsplit { grid-template-columns: minmax(0, 1fr); }
  .vper, .voa, .vpat { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .vrow > * { flex-basis: 82%; }
  .vflow { grid-template-columns: minmax(0, 1fr); } .vflow li::after { display: none; }
  .ailist__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .vper, .voa, .vpat { grid-template-columns: minmax(0, 1fr); }
  .ailist__row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .ailist__change { grid-template-columns: minmax(0, 1fr); }
  .ailist__arrow { margin: -10px auto; transform: rotate(90deg); }
  .ailist__from { padding-right: 14px; padding-bottom: 16px; } .ailist__to { padding-left: 14px; padding-top: 16px; }
}

/* Value：見出しボックス＋本文の一部をボックスにして強弱をつける */
.vhead { border-radius: var(--radius-xl); padding: clamp(36px, 5vw, 64px) clamp(24px, 5vw, 64px); }
.vhead.vband--p { background: linear-gradient(120deg, rgba(var(--p-rgb),0.16), rgba(var(--b-rgb),0.12) 60%, rgba(var(--g-rgb),0.10)); }
.vhead.vband--g { background: linear-gradient(120deg, rgba(var(--g-rgb),0.18), rgba(var(--p-rgb),0.10) 60%, rgba(var(--b-rgb),0.10)); }
.vhead.vband--b { background: linear-gradient(120deg, rgba(var(--b-rgb),0.16), rgba(var(--p-rgb),0.10) 60%, rgba(var(--g-rgb),0.10)); }
.vhead .vtag span { background: rgba(255,255,255,0.8); }
.vhead__title { margin-top: 16px; font-size: clamp(30px, 3.6vw, 48px); font-weight: 800; line-height: 1.35; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.vhead__lead { margin-top: 16px; max-width: 56em; font-size: 16px; line-height: 1.95; color: var(--text); }
.vhead .issue-chips span { background: rgba(255,255,255,0.85); border-color: rgba(255,255,255,0.95); }
.vbody { padding-top: clamp(40px, 4.5vw, 56px); }
.vbox { margin-top: clamp(40px, 4.5vw, 56px); border-radius: 24px; padding: clamp(22px, 3vw, 36px); background: var(--surface); }
.vbox--p { background: var(--p-t); } .vbox--b { background: var(--b-t); } .vbox--g { background: var(--g-t); }
.vbox__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; font-size: 18px; font-weight: 900; color: var(--ink); }
.vbox__title small { font-size: 13px; font-weight: 700; color: var(--b-d); }
.vbox__note { margin-top: 12px; font-size: 13px; font-weight: 700; color: var(--sub); text-align: center; }
.vbox .process__row { margin-top: 16px; }
.vbox .process__name { background: #FFFFFF; border-color: transparent; }
.vbox--split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 28px 40px; align-items: center; }
.vpoints--stack { grid-template-columns: minmax(0, 1fr); gap: 24px; }
.vbox .vpoint { border-top-color: var(--g-d); }
.vbox__media .browser { box-shadow: 0 24px 48px -28px rgba(var(--g-rgb),0.6); }
.vbox .vflow { margin-top: 14px; }
.vbox .vflow li { background: #FFFFFF; }
.vbox .vflow li:last-child { background: var(--b-d); }
.vbox__pair { margin-top: 20px; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); gap: 20px 32px; align-items: center; }
.vbox__pair p { font-size: 15px; line-height: 1.9; color: var(--text); }
.vbox__pair .vshot { box-shadow: 0 20px 40px -24px rgba(var(--b-rgb),0.45); }
.vbox.vsplit { margin-top: 14px; }
.vbox .vshot--flat { border: 0; }
@media (max-width: 960px) { .vbox--split, .vbox__pair { grid-template-columns: minmax(0, 1fr); } }
.vbox__pair { grid-template-columns: minmax(0, 0.75fr) minmax(0, 1fr); } .vbox__pair .vshot { max-width: 460px; }

/* ---------- AI：選考プロセス（横フロー） ---------- */
.pflow__row { margin-top: 26px; position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.pflow__row::before { content: ""; position: absolute; left: calc(100% / 12); right: calc(100% / 12); top: 27px; height: 3px; border-radius: 2px; background: linear-gradient(90deg, var(--line-2), var(--p) 20%, var(--p) 80%, var(--ink)); opacity: 0.55; }
.pflow__step { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.pflow__node { position: relative; width: 56px; height: 56px; border-radius: 50%; background: #FFFFFF; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 5px var(--p-t), 0 12px 24px -14px rgba(var(--p-rgb),0.6); }
.pflow__step.is-ai .pflow__node { background: var(--grad); }
.pflow__step.is-human .pflow__node { background: var(--ink); }
.pflow__name { font-size: 15px; font-weight: 900; line-height: 1.4; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.pflow__chip { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; border-radius: 12px; padding: 8px 10px; font-size: 12px; font-weight: 700; line-height: 1.45; color: var(--white); background: var(--p-d); box-shadow: 0 10px 20px -12px rgba(var(--p-rgb),0.8); }
.pflow__chip b { font-family: var(--font-en); font-size: 11px; letter-spacing: 0.06em; opacity: 0.85; }
.pflow__chip--human { flex-direction: row; background: var(--ink); }
.pflow__chip svg { flex: none; }
@media (max-width: 860px) {
  .pflow__row { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .pflow__row::before { left: 27px; right: auto; top: 28px; bottom: 28px; width: 3px; height: auto; background: linear-gradient(180deg, var(--line-2), var(--p) 20%, var(--p) 80%, var(--ink)); }
  .pflow__step { flex-direction: row; flex-wrap: wrap; text-align: left; gap: 8px 14px; }
  .pflow__chip { flex-direction: row; }
}

/* ---------- AI：左右2列（説明／導入すると） ---------- */
.vduo { margin-top: clamp(40px, 4.5vw, 56px); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 24px 40px; align-items: stretch; }
.vduo__left { display: flex; flex-direction: column; justify-content: space-between; gap: 28px; }
.vduo__left .vpoint { flex: 1; }
.vduo__right { display: flex; flex-direction: column; border-radius: 24px; background: var(--surface); padding: 24px 26px; }
.vduo__title { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 900; color: var(--ink); }
.vduo__title::before { content: ""; width: 20px; height: 3px; border-radius: 2px; background: var(--grad); }
.vper--stack { margin-top: 12px; flex: 1; grid-template-columns: minmax(0, 1fr); gap: 0; display: flex; flex-direction: column; justify-content: space-between; }
.vper--stack li { padding: 14px 0; border-bottom: 1px solid var(--line); }
.vper--stack li:last-child { border-bottom: 0; padding-bottom: 0; }
.vper--stack .vper__who i { background: #FFFFFF; }
@media (max-width: 960px) { .vduo { grid-template-columns: minmax(0, 1fr); } }

/* ---------- AI 4機能：リスト内の表現の案（A〜D） ---------- */
.ailist[data-ail] { display: none; }
body:not(.ail-b):not(.ail-c):not(.ail-d) .ailist--a, .ail-b .ailist--b, .ail-c .ailist--c, .ail-d .ailist--d { display: block; }
/* 案B：テキスト対比 */
.lb__vs { margin-top: 12px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 24px; }
.lb__old, .lb__new { margin: 0; position: relative; padding-left: 30px; font-size: 15px; line-height: 1.6; }
.lb__old { color: var(--muted); }
.lb__new { color: var(--ink); font-weight: 900; }
.lb__vs small { display: block; font-size: 11px; font-weight: 700; color: var(--muted); }
.lb__new small { color: var(--p-d); }
.lb__mark { position: absolute; left: 0; top: 4px; width: 20px; height: 20px; border-radius: 50%; background: var(--p); color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.lb__mark--old { background: var(--line-2); color: var(--white); }
.lb__eff { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; font-size: 14px; line-height: 1.75; color: var(--ink); }
.lb__eff b { font-size: 12px; color: var(--p-d); }
.lb__eff span { font-weight: 700; background: linear-gradient(transparent 64%, rgba(var(--p-rgb),0.22) 64%); }
/* 案C：効果を見出しに */
.lc__name { font-size: 14px; font-weight: 900; color: var(--p-d); }
.lc__eff { margin: 8px 0 0; font-size: clamp(19px, 2vw, 24px); font-weight: 900; line-height: 1.5; color: var(--ink); }
.lc__sub { margin-top: 2px; font-size: 14px; line-height: 1.7; color: var(--text); }
.lc__chg { margin-top: 10px; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; border-radius: 999px; background: var(--surface); padding: 6px 8px 6px 16px; font-size: 13px; }
.lc__chg span { color: var(--muted); }
.lc__chg i { width: 22px; height: 22px; border-radius: 50%; background: var(--p); display: inline-flex; align-items: center; justify-content: center; }
.lc__chg b { color: var(--ink); background: #FFFFFF; border-radius: 999px; padding: 2px 12px; }
/* 案D：これまで→これから→期待効果の3ステップ */
.ld__track { margin-top: 14px; position: relative; display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 0.9fr) minmax(0, 1.3fr); gap: 12px; }
.ld__track::before { content: ""; position: absolute; left: 6px; right: 6px; top: 6px; height: 2px; background: linear-gradient(90deg, var(--line-2), var(--p) 45%, var(--p-d)); }
.ld__s { position: relative; padding-top: 20px; }
.ld__s::before { content: ""; position: absolute; left: 0; top: 0; width: 14px; height: 14px; border-radius: 50%; background: #FFFFFF; border: 3px solid var(--line-2); }
.ld__s--new::before { border-color: var(--p); }
.ld__s--eff::before { border-color: var(--p-d); background: var(--p-d); }
.ld__s small { font-size: 11px; font-weight: 700; color: var(--muted); }
.ld__s--new small, .ld__s--eff small { color: var(--p-d); }
.ld__s p { margin-top: 2px; font-size: 14px; line-height: 1.65; }
.ld__s--old p { color: var(--muted); }
.ld__s--new p { font-weight: 900; color: var(--ink); }
.ld__s--eff p { font-weight: 700; color: var(--ink); }
@media (max-width: 760px) {
  .lb__vs { grid-template-columns: minmax(0, 1fr); }
  .ld__track { grid-template-columns: minmax(0, 1fr); padding-left: 22px; }
  .ld__track::before { left: 6px; right: auto; top: 6px; bottom: 6px; width: 2px; height: auto; background: linear-gradient(180deg, var(--line-2), var(--p) 45%, var(--p-d)); }
  .ld__s { padding-top: 0; } .ld__s::before { left: -22px; top: 3px; }
}
.vduo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.vpoint--ic { display: flex; gap: 18px; align-items: flex-start; border-top: 0; padding: 0; }
.vpoint__ic { flex: none; width: 56px; height: 56px; border-radius: 18px; background: var(--grad); display: flex; align-items: center; justify-content: center; box-shadow: 0 14px 28px -16px rgba(var(--p-rgb),0.7); }
.vpoint--ic h4 { font-size: 20px; }
.vpoint--ic p { font-size: 15px; }
.vduo__left { justify-content: center; gap: 36px; }
.vduo__left .vpoint { flex: 0 0 auto; }
.pflow__chip { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 2px 6px; max-width: 150px; }
.pflow__chip b { margin-right: 2px; }

/* 選考プロセス：背景なし */
.pflow--plain { margin-top: 0; }
.pflow--plain .vbox__title { font-size: 18px; font-weight: 900; color: var(--ink); display: flex; align-items: center; gap: 10px; }
.pflow--plain .vbox__title::before { content: ""; width: 20px; height: 3px; border-radius: 2px; background: var(--grad); }
.pflow--plain .pflow__node { box-shadow: 0 0 0 5px #FFFFFF, 0 0 0 6px var(--line), 0 12px 24px -14px rgba(var(--p-rgb),0.5); }
.pflow--plain .vbox__note { margin-top: 18px; }

/* 4つのAI機能：タイトル → 期待効果 → これまで・これから */
.ailist__effect--lead { margin-top: 12px; align-items: center; }
.ailist__effect--lead p { font-size: 16px; font-weight: 900; line-height: 1.6; }
.ailist__effect--lead small { font-weight: 700; }
.ailist__change--sub { margin-top: 14px; max-width: 720px; }
.ailist__change--sub .ailist__from, .ailist__change--sub .ailist__to { padding-top: 8px; padding-bottom: 8px; font-size: 13px; }
.ailist__change--sub .ailist__arrow { width: 28px; height: 28px; }

/* 説明エリア（肩代わり・基準／導入すると）：デザイン案1〜4 */
/* 案2：上下2段（上＝2列の説明、下＝グレーの帯に3列） */
.duo-2 .vduo { grid-template-columns: minmax(0, 1fr); gap: 32px; }
.duo-2 .vduo__left { flex-direction: row; gap: 40px; }
.duo-2 .vduo__left .vpoint { flex: 1 1 0; }
.duo-2 .vduo__right { padding: 24px 28px 26px; }
.duo-2 .vper--stack { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.duo-2 .vper--stack li { padding: 4px 24px 0; border-bottom: 0; border-left: 1px solid var(--line-2); }
.duo-2 .vper--stack li:first-child { border-left: 0; padding-left: 0; }
/* 案3：上下2段（上＝枠付きカード2枚、下＝背景なしの3列） */
.duo-3 .vduo { grid-template-columns: minmax(0, 1fr); gap: 36px; }
.duo-3 .vduo__left { flex-direction: row; gap: 16px; }
.duo-3 .vduo__left .vpoint { flex: 1 1 0; position: relative; border: 1px solid var(--line); border-radius: 22px; padding: 26px 26px 24px; flex-direction: column; gap: 14px; overflow: hidden; }
.duo-3 .vduo__left .vpoint::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--grad); }
.duo-3 .vduo__right { background: transparent; padding: 0; }
.duo-3 .vduo__title { justify-content: center; }
.duo-3 .vduo__title::after { content: ""; width: 20px; height: 3px; border-radius: 2px; background: var(--grad); }
.duo-3 .vper--stack { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.duo-3 .vper--stack li { border: 0; padding: 0; text-align: center; }
.duo-3 .vper--stack .vper__who { flex-direction: column; gap: 8px; }
.duo-3 .vper--stack .vper__who i { width: 52px; height: 52px; background: var(--p-t); }
.duo-3 .vper--stack .vper__who i svg { width: 22px; height: 22px; }
/* 案4：左右（左＝色付きボックスの説明、右＝背景なしの一覧） */
.duo-4 .vduo__left { border-radius: 24px; background: var(--p-t); padding: 30px 30px; }
.duo-4 .vduo__left .vpoint__ic { background: #FFFFFF; box-shadow: none; }
.duo-4 .vduo__left .vpoint__ic svg path { stroke: var(--p-d); }
.duo-4 .vduo__right { background: transparent; padding: 6px 0 0; }
.duo-4 .vper--stack li { border-bottom: 1px solid var(--line); }
.duo-4 .vper--stack .vper__who i { background: var(--p-t); }
@media (max-width: 960px) {
  .duo-2 .vduo__left, .duo-3 .vduo__left { flex-direction: column; }
  .duo-2 .vper--stack, .duo-3 .vper--stack { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .duo-2 .vper--stack li { border-left: 0; padding: 0; }
}

/* 選考プロセス：グラデーションはAIのラベルに、アイコンは白地 */
.pflow__step.is-ai .pflow__node { background: #FFFFFF; box-shadow: 0 0 0 5px #FFFFFF, 0 0 0 7px rgba(var(--p-rgb),0.45), 0 12px 24px -14px rgba(var(--p-rgb),0.5); }
.pflow__step.is-ai .pflow__node svg path { stroke: var(--p-d); }
.pflow__chip { background: var(--grad); box-shadow: 0 12px 24px -12px rgba(var(--b-rgb),0.7); font-size: 13px; padding: 9px 12px; }
.pflow__chip--human { background: var(--ink); box-shadow: none; }
.vai { display: block; }

/* 説明エリア 案5：左に縦の選考プロセス・右に説明2つ・下に「導入すると」 */
.duo-5 .vai { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); grid-template-areas: "proc left" "right right"; gap: 40px clamp(32px, 5vw, 72px); align-items: stretch; }
.duo-5 .vduo { display: contents; }
.duo-5 .pflow { grid-area: proc; }
.duo-5 .vduo__left { grid-area: left; justify-content: center; gap: 40px; }
.duo-5 .vduo__right { grid-area: right; padding: 24px 28px 26px; }
.duo-5 .pflow__row { grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 22px; }
.duo-5 .pflow__row::before { left: 27px; right: auto; top: 28px; bottom: 28px; width: 3px; height: auto; background: linear-gradient(180deg, var(--line-2), var(--p) 20%, var(--p) 80%, var(--ink)); }
.duo-5 .pflow__step { flex-direction: row; flex-wrap: wrap; align-items: center; text-align: left; gap: 8px 14px; }
.duo-5 .pflow__name { min-width: 7.5em; }
.duo-5 .pflow__chip { flex-direction: row; max-width: none; }
.duo-5 .pflow .vbox__note { text-align: left; }
.duo-5 .vper--stack { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.duo-5 .vper--stack li { padding: 4px 24px 0; border-bottom: 0; border-left: 1px solid var(--line-2); }
.duo-5 .vper--stack li:first-child { border-left: 0; padding-left: 0; }
@media (max-width: 960px) {
  .duo-5 .vai { grid-template-columns: minmax(0, 1fr); grid-template-areas: "proc" "left" "right"; }
  .duo-5 .vper--stack { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .duo-5 .vper--stack li { border-left: 0; padding: 0; }
}

/* 説明エリア 案5の調整 */
.duo-5 .pflow__row { gap: 10px; margin-top: 18px; }
.duo-5 .pflow__row::before { left: 17px; top: 18px; bottom: 18px; width: 2px; }
.duo-5 .pflow__node { width: 36px; height: 36px; flex: none; }
.duo-5 .pflow__node svg { width: 18px; height: 18px; }
.duo-5 .pflow__step:not(.is-ai):not(.is-human) .pflow__node { box-shadow: 0 0 0 4px #FFFFFF, 0 0 0 5px var(--line); }
.duo-5 .pflow__step.is-ai .pflow__node { box-shadow: 0 0 0 4px #FFFFFF, 0 0 0 6px rgba(var(--p-rgb),0.45); }
.duo-5 .pflow__step.is-human .pflow__node { box-shadow: 0 0 0 4px #FFFFFF; }
.duo-5 .pflow__step { flex-wrap: nowrap; gap: 14px; }
.duo-5 .pflow__name { flex: none; width: 9em; min-width: 0; font-size: 15px; }
.duo-5 .pflow__chip { padding: 6px 12px; font-size: 13px; }
.duo-5 .vduo__left { gap: 16px; justify-content: center; }
.duo-5 .vduo__left .vpoint__ic { display: none; }
.duo-5 .vduo__left .vpoint { border: 1px solid var(--line-2); border-radius: 20px; padding: 24px 26px; }
.duo-5 .vduo__left .vpoint h4 { font-size: 19px; }
.duo-5 .vduo__right { background: transparent; padding: 0; }
.duo-5 .vper--stack { gap: 14px; margin-top: 14px; }
.duo-5 .vper--stack li, .duo-5 .vper--stack li:first-child { border: 0; border-radius: 20px; background: var(--surface); padding: 20px 22px; }
.duo-5 .vper--stack .vper__who i { background: #FFFFFF; }
@media (max-width: 560px) { .duo-5 .pflow__step { flex-wrap: wrap; } .duo-5 .pflow__chip { margin-left: 50px; } }

/* AI機能の画面イメージ：中の文字を小さく（全体の縮小表示） */
.scr-card__frame { height: 400px; }
.scr-card__frame .ui { width: 133.4%; max-width: none; transform: scale(0.75); transform-origin: top left; }

/* 案5：選考プロセスの丸を小さく・同じ大きさに・線でつなぐ */
.duo-5 .pflow__row { gap: 14px; }
.duo-5 .pflow__row::before { left: 11px; top: 12px; bottom: 12px; width: 2px; opacity: 1; background: linear-gradient(180deg, var(--line-2) 0%, rgba(var(--p-rgb),0.7) 18%, rgba(var(--p-rgb),0.7) 82%, var(--ink) 100%); }
.duo-5 .pflow__node, .duo-5 .pflow__step.is-ai .pflow__node, .duo-5 .pflow__step.is-human .pflow__node, .duo-5 .pflow__step:not(.is-ai):not(.is-human) .pflow__node { width: 24px; height: 24px; box-shadow: 0 0 0 4px #FFFFFF; border: 2px solid var(--line-2); background: #FFFFFF; }
.duo-5 .pflow__step.is-ai .pflow__node { border-color: var(--p); }
.duo-5 .pflow__step.is-human .pflow__node { border-color: var(--ink); background: var(--ink); }
.duo-5 .pflow__node svg { width: 12px; height: 12px; }
.duo-5 .pflow__name { width: 9.5em; }
.duo-5 .pflow__chip { padding: 5px 12px; }
@media (max-width: 560px) { .duo-5 .pflow__chip { margin-left: 38px; } }

/* 案5：右側の説明のデザイン（a〜d） */
.vpoint__no { display: none; }
/* b：番号＋上の細線（枠なし） */
.duo-5.exp-b .vduo__left .vpoint { border: 0; border-top: 1px solid var(--line-2); border-radius: 0; padding: 18px 0 0; }
.duo-5.exp-b .vpoint__no { display: block; font-family: var(--font-en); font-size: 14px; font-weight: 700; color: var(--p-d); margin-bottom: 4px; }
/* c：見出しに小さなチェック（線のアイコン）＋点線区切り */
.duo-5.exp-c .vduo__left { gap: 0; }
.duo-5.exp-c .vduo__left .vpoint { border: 0; border-radius: 0; padding: 20px 0; }
.duo-5.exp-c .vduo__left .vpoint + .vpoint { border-top: 1px dashed var(--line-2); }
.duo-5.exp-c .vduo__left .vpoint h4 { display: flex; align-items: center; gap: 10px; }
.duo-5.exp-c .vduo__left .vpoint h4::before { content: ""; flex: none; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--p); background: radial-gradient(circle, var(--p) 0 3px, transparent 3.5px); }
/* d：淡いグレーの面（枠線なし） */
.duo-5.exp-d .vduo__left .vpoint { border: 0; background: var(--surface); }

/* AI機能の画面イメージ：背景をシンプルなグレーに */
.scr-card__frame { background: var(--surface); }
.duo-5 .pflow__row { gap: 22px; padding-left: 2px; }
.duo-5 .pflow__row::before { left: 13px; width: 3px; border-radius: 2px; }
.duo-5 .pflow__node, .duo-5 .pflow__step.is-ai .pflow__node, .duo-5 .pflow__step.is-human .pflow__node, .duo-5 .pflow__step:not(.is-ai):not(.is-human) .pflow__node { box-shadow: 0 0 0 3px #FFFFFF; }
.duo-5 .pflow__step:not(:last-child)::after { content: ""; position: absolute; left: 10px; bottom: -15px; width: 6px; height: 6px; border-right: 2px solid rgba(var(--p-rgb),0.8); border-bottom: 2px solid rgba(var(--p-rgb),0.8); transform: rotate(45deg); background: #FFFFFF; }

:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:light}
.site-header{top:env(safe-area-inset-top,0px)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:rgba(255,255,255,0.94)}
.pv{position:relative;z-index:70;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 24px;background:#0B1220;color:#fff;padding:10px 16px;font:700 13px/1.4 'Noto Sans JP',sans-serif}
.pv p{margin:0;color:#CBD5E1;font-weight:500;font-size:12px}
.pv div{display:flex;align-items:center;gap:6px}.pv span{color:#CBD5E1;margin-right:2px}
.pv button{min-width:44px;min-height:36px;border:0;border-radius:9px;background:#1E293B;color:#fff;font:inherit;cursor:pointer}
.pv button[aria-pressed="true"]{background:#fff;color:#0B1220}


/* =========================================================
   AI機能×画面イメージ（index_c_ai.html）
   画面イメージと説明を左右交互に配置。ポイントの番号は画面内のピンと対応
   ========================================================= */
.aif-head { margin-top: clamp(72px, 9vw, 120px); text-align: center; }
.aif-head__label { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 900; color: var(--p-d); }
.aif-head__label::before, .aif-head__label::after { content: ""; width: 20px; height: 3px; border-radius: 2px; background: var(--grad); }
.aif-head__title { margin: 14px 0 0; font-size: clamp(26px, 3vw, 40px); font-weight: 900; line-height: 1.45; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.aif-head__lead { margin: 18px auto 0; max-width: 40em; font-size: 16px; line-height: 1.9; color: var(--sub); }
@media (max-width: 760px) { .aif-head { text-align: left; } .aif-head__label::after { display: none; } .pc-only { display: none; } }
.aif { margin-top: clamp(48px, 6vw, 80px); }
.aif__row { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 32px clamp(36px, 5vw, 80px); align-items: center; }
.aif__row + .aif__row { margin-top: clamp(72px, 9vw, 128px); }
.aif__row:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); }
.aif__row:nth-of-type(even) .aif__media { order: 2; }
.aif__media { margin: 0; min-width: 0; }
.aif__frame { position: relative; height: clamp(440px, 44vw, 580px); border-radius: 28px; background: var(--surface); padding: clamp(24px, 3vw, 44px) clamp(20px, 3vw, 44px) 0; overflow: hidden; }
.aif__frame::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 56px; background: linear-gradient(180deg, rgba(242,246,249,0), var(--surface)); pointer-events: none; }
.aif__frame .ui { height: auto; max-width: 100%; background: #FFFFFF; border-radius: 14px 14px 0 0; border-bottom: 0; box-shadow: 0 28px 56px -30px rgba(11,22,34,0.38); padding: 18px; }
.aif__frame .ui__box { background: #F4F5F7; }
.aif-clamp2 { -webkit-line-clamp: 2 !important; }
.ui__field p.aif-wrap { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; line-height: 1.7; }
.aif__caption { margin-top: 10px; font-size: 12px; color: var(--muted); }
.aif__body { min-width: 0; }
.aif__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.aif__num { font-family: var(--font-en); font-size: 40px; font-weight: 700; line-height: 1; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.aif__row.is-soon .aif__num { background: none; color: var(--muted); }
.aif__badges { display: flex; flex-wrap: wrap; gap: 6px; }
.aif__name { margin: 14px 0 0; font-size: clamp(22px, 2.3vw, 30px); font-weight: 900; line-height: 1.45; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.aif__intro { margin-top: 12px; font-size: 15px; line-height: 1.9; color: var(--text); }
.aif__label { margin-top: 22px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 13px; font-weight: 900; color: var(--ink); }
.aif__label small { font-size: 12px; font-weight: 500; color: var(--muted); }
.aif__points { margin-top: 10px; display: grid; gap: 10px; }
.aif__points li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; font-weight: 700; line-height: 1.7; color: var(--ink); }
.aif__chk { flex: none; margin-top: 3px; color: var(--p); }
.aif__result { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.aif__result .ailist__effect--lead { margin-top: 0; }
.aif__result .ailist__effect--lead p { font-size: 15px; }
.aif__result .ailist__change--sub { margin-top: 16px; }
@media (max-width: 960px) {
  .aif__row, .aif__row:nth-of-type(even) { grid-template-columns: minmax(0, 1fr); }
  .aif__row:nth-of-type(even) .aif__media { order: 0; }
  .aif__frame { height: 400px; }
}
@media (max-width: 560px) {
  .aif__frame { height: 460px; padding: 16px 12px 0; border-radius: 20px; }
  .aif__frame .ui { zoom: 0.78; }
  .aif__num { font-size: 34px; }
}

/* Value 01：標準搭載などの注記を見出しボックスの下部に */
.vnote--inbox { margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.9); }

/* 4つのAI機能：小見出しの前後の線はなし */
.aif-head__label::before, .aif-head__label::after { display: none; }

/* 説明エリア 案4：左はボックスなし（アイコンは上揃え・背景はValue 01の見出しボックスと同じ色）、右は担当者ごとに罫線のボックス */
.duo-4 .vduo__left { background: transparent; padding: 0; gap: 36px; justify-content: center; }
.duo-4 .vduo__left .vpoint { flex: 0 0 auto; align-items: flex-start; background: transparent; padding: 0; }
.duo-4 .vduo__left .vpoint__ic { background: linear-gradient(120deg, rgba(var(--p-rgb),0.16), rgba(var(--b-rgb),0.12) 60%, rgba(var(--g-rgb),0.10)); box-shadow: none; }
.duo-4 .vper--stack { justify-content: flex-start; gap: 12px; margin-top: 14px; }
.duo-4 .vper--stack li, .duo-4 .vper--stack li:last-child { border: 1px solid var(--line-2); border-radius: 20px; background: transparent; padding: 18px 22px; }

/* スマホ：選考プロセスを案5と同じ大きさ・並びに（全案共通） */
@media (max-width: 860px) {
  .vai .pflow { grid-area: proc; }
  .vai .pflow__row { grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 22px; }
  .vai .pflow__row::before { left: 27px; right: auto; top: 28px; bottom: 28px; width: 3px; height: auto; background: linear-gradient(180deg, var(--line-2), var(--p) 20%, var(--p) 80%, var(--ink)); }
  .vai .pflow__step { flex-direction: row; flex-wrap: wrap; align-items: center; text-align: left; gap: 8px 14px; }
  .vai .pflow__name { min-width: 7.5em; }
  .vai .pflow__chip { flex-direction: row; max-width: none; }
  .vai .pflow .vbox__note { text-align: left; }
  .vai .pflow__row { gap: 10px; margin-top: 18px; }
  .vai .pflow__row::before { left: 17px; top: 18px; bottom: 18px; width: 2px; }
  .vai .pflow__node { width: 36px; height: 36px; flex: none; }
  .vai .pflow__node svg { width: 18px; height: 18px; }
  .vai .pflow__step:not(.is-ai):not(.is-human) .pflow__node { box-shadow: 0 0 0 4px #FFFFFF, 0 0 0 5px var(--line); }
  .vai .pflow__step.is-ai .pflow__node { box-shadow: 0 0 0 4px #FFFFFF, 0 0 0 6px rgba(var(--p-rgb),0.45); }
  .vai .pflow__step.is-human .pflow__node { box-shadow: 0 0 0 4px #FFFFFF; }
  .vai .pflow__step { flex-wrap: nowrap; gap: 14px; }
  .vai .pflow__name { flex: none; width: 9em; min-width: 0; font-size: 15px; }
  .vai .pflow__chip { padding: 6px 12px; font-size: 13px; }
  @media (max-width: 560px) { .vai .pflow__step { flex-wrap: wrap; } .vai .pflow__chip { margin-left: 50px; } }
  .vai .pflow__row { gap: 14px; }
  .vai .pflow__row::before { left: 11px; top: 12px; bottom: 12px; width: 2px; opacity: 1; background: linear-gradient(180deg, var(--line-2) 0%, rgba(var(--p-rgb),0.7) 18%, rgba(var(--p-rgb),0.7) 82%, var(--ink) 100%); }
  .vai .pflow__node, .vai .pflow__step.is-ai .pflow__node, .vai .pflow__step.is-human .pflow__node, .vai .pflow__step:not(.is-ai):not(.is-human) .pflow__node { width: 24px; height: 24px; box-shadow: 0 0 0 4px #FFFFFF; border: 2px solid var(--line-2); background: #FFFFFF; }
  .vai .pflow__step.is-ai .pflow__node { border-color: var(--p); }
  .vai .pflow__step.is-human .pflow__node { border-color: var(--ink); background: var(--ink); }
  .vai .pflow__node svg { width: 12px; height: 12px; }
  .vai .pflow__name { width: 9.5em; }
  .vai .pflow__chip { padding: 5px 12px; }
  @media (max-width: 560px) { .vai .pflow__chip { margin-left: 38px; } }
  .vai .pflow__row { gap: 22px; padding-left: 2px; }
  .vai .pflow__row::before { left: 13px; width: 3px; border-radius: 2px; }
  .vai .pflow__node, .vai .pflow__step.is-ai .pflow__node, .vai .pflow__step.is-human .pflow__node, .vai .pflow__step:not(.is-ai):not(.is-human) .pflow__node { box-shadow: 0 0 0 3px #FFFFFF; }
  .vai .pflow__step:not(:last-child)::after { content: ""; position: absolute; left: 10px; bottom: -15px; width: 6px; height: 6px; border-right: 2px solid rgba(var(--p-rgb),0.8); border-bottom: 2px solid rgba(var(--p-rgb),0.8); transform: rotate(45deg); background: #FFFFFF; }
}

/* スマホ・タブレット：説明エリアを1列に（後から指定した2列指定が優先されていたため） */
@media (max-width: 960px) { .vduo { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .duo-4 .vduo__left { gap: 28px; } .duo-4 .vduo__left .vpoint { flex-direction: column; gap: 14px; } .duo-4 .vduo__left .vpoint__ic { width: 44px; height: 44px; border-radius: 14px; } .duo-4 .vper--stack li, .duo-4 .vper--stack li:last-child { padding: 16px 18px; } }

/* 説明エリア 案2：アイコンの背景は案4と同じ色、「導入すると」は担当者ごとのブロックに分ける */
.duo-2 .vduo__left .vpoint__ic { background: linear-gradient(120deg, rgba(var(--p-rgb),0.16), rgba(var(--b-rgb),0.12) 60%, rgba(var(--g-rgb),0.10)); box-shadow: none; }
.duo-2 .vduo__left .vpoint__ic svg path { stroke: var(--p-d); }
.duo-2 .vduo__right { background: transparent; padding: 0; border-radius: 0; }
.duo-2 .vper--stack { gap: 16px; margin-top: 14px; }
.duo-2 .vper--stack li, .duo-2 .vper--stack li:first-child, .duo-2 .vper--stack li:last-child { border: 0; border-radius: 20px; background: var(--surface); padding: 20px 22px; }
@media (max-width: 960px) { .duo-2 .vper--stack { gap: 12px; } .duo-2 .vper--stack li, .duo-2 .vper--stack li:first-child, .duo-2 .vper--stack li:last-child { padding: 18px 20px; } }

/* 説明エリア：選考プロセス／説明2つ／導入すると の上下の間隔を広げる */
.vai .vduo { margin-top: clamp(56px, 6vw, 80px); row-gap: clamp(48px, 5vw, 64px); }
.duo-2 .vduo, .duo-3 .vduo { row-gap: clamp(56px, 6vw, 80px); }
.duo-5 .vai { row-gap: clamp(56px, 6vw, 80px); }
@media (max-width: 960px) { .vai .vduo, .duo-2 .vduo, .duo-3 .vduo { margin-top: 56px; row-gap: 56px; } .duo-5 .vai { row-gap: 56px; } }
.ui__pass.aif-tag-gray { color: #5E6B78; background: #F1F3F5; border-color: #D9DEE3; }
.aif__intro { margin-top: 14px; }
.aif__result { margin-top: 28px; }

/* =========================================================
   MVの調整
   ========================================================= */
/* 案C：まわりのアイコンはなし */
.mv-c .kv-new .kv-icons { display: none; }
/* 見出しの下線（マーカー）はなし */
.kv-c .hl { background-image: none; }
/* 下部をウェーブで区切る */
.kv-new { padding-bottom: clamp(72px, 8vw, 120px); }
.kv-wave { position: absolute; left: 0; right: 0; bottom: -1px; height: clamp(48px, 7vw, 110px); z-index: 1; pointer-events: none; }
.kv-wave svg { display: block; width: 100%; height: 100%; }
.kv-wave__back { fill: rgba(255,255,255,0.55); }
.kv-wave__front { fill: #FFFFFF; }
.kv-new .kv-panel { z-index: 2; }
.mv-b .kv-new { padding-bottom: clamp(72px, 8vw, 120px); }

/* ダッシュボード（HTMLで再現）：760px幅で組み、枠の幅に合わせて縮小 */
.dsb-wrap { position: relative; aspect-ratio: 16 / 8.6; overflow: hidden; background: #F6F8FA; }
.dsb { width: 760px; padding: 14px 18px; font-size: 11px; line-height: 1.5; color: #24313F; transform-origin: top left; }
.dsb p { margin: 0; }
.dsb svg { flex: none; }
.dsb__top { display: flex; align-items: center; justify-content: space-between; }
.dsb__h1 { display: flex; align-items: center; gap: 7px; font-size: 16px; font-weight: 900; color: #0B1622; }
.dsb__btns { display: flex; gap: 6px; }
.dsb__btn { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; background: #FFFFFF; border: 1px solid #D2DBE3; border-radius: 6px; padding: 4px 10px; }
.dsb__btn.is-blue { background: #DCEBFA; border-color: #DCEBFA; color: #1E78D2; padding: 4px 16px; }
.dsb__time { margin-top: 2px !important; text-align: right; font-size: 9px; color: #8A94A0; }
.dsb__cols { margin-top: 4px; display: grid; grid-template-columns: 0.72fr 1fr; gap: 14px; }
.dsb__h2row { display: flex; align-items: center; justify-content: space-between; }
.dsb__h2 { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 900; color: #0B1622; margin-bottom: 6px !important; }
.dsb__h2--mt { margin-top: 14px !important; }
.dsb__link { font-size: 10px; font-weight: 700; color: #1E78D2; margin-bottom: 6px; }
.dsb__card { display: flex; align-items: center; gap: 10px; background: #FFFFFF; border-radius: 10px; padding: 9px 12px; box-shadow: 0 1px 3px rgba(11,22,34,0.08); }
.dsb__card + .dsb__card { margin-top: 7px; }
.dsb__ico { flex: none; width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.dsb__ico.is-blue { background: #E3EFFB; } .dsb__ico.is-purple { background: #EDE9FB; } .dsb__ico.is-green { background: #E2F4EC; }
.dsb__lbl { font-size: 10px; font-weight: 700; }
.dsb__num { font-size: 20px; font-weight: 900; line-height: 1.2; color: #0B1622; }
.dsb__num small { margin-left: 3px; font-size: 10px; font-weight: 700; }
.dsb__num i { margin-left: 8px; font-size: 9px; font-weight: 700; font-style: normal; color: #5E6B78; }
.dsb__num em { font-style: normal; color: #E0474C; }
.dsb__sch { display: grid; grid-template-columns: 62px 1fr; background: #FFFFFF; border-radius: 10px; overflow: hidden; box-shadow: 0 1px 3px rgba(11,22,34,0.08); }
.dsb__day { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px 0 6px; border-bottom: 1px solid #EEF1F4; }
.dsb__day b { font-size: 18px; font-weight: 900; line-height: 1.1; color: #0B1622; }
.dsb__day small { font-size: 9px; font-weight: 700; }
.dsb__day.is-today { background: #FFF8EE; } .dsb__day.is-today b, .dsb__day.is-today small { color: #B4690E; }
.dsb__day.is-next { background: #F1F6FC; } .dsb__day.is-next b, .dsb__day.is-next small { color: #1E78D2; }
.dsb__badge { position: absolute; left: 0; top: 0; font-size: 8.5px; font-weight: 700; color: #FFFFFF; padding: 1px 6px; border-radius: 0 0 6px 0; }
.is-today .dsb__badge { background: #F2A516; } .is-next .dsb__badge { background: #1E88E5; }
.dsb__evs { display: flex; flex-direction: column; justify-content: center; gap: 5px; padding: 6px 8px; border-bottom: 1px solid #EEF1F4; }
.dsb__ev { display: grid; grid-template-columns: 72px 74px 1fr auto; align-items: center; gap: 6px; background: #FFFFFF; border-radius: 7px; padding: 6px 8px; box-shadow: 0 1px 3px rgba(11,22,34,0.1); }
.dsb__ev b { font-weight: 900; color: #0B1622; }
.dsb__kind { font-size: 9.5px; color: #5E6B78; white-space: nowrap; }
.dsb__who { display: inline-flex; align-items: center; gap: 4px; font-weight: 900; color: #0B1622; }
.dsb__none { font-size: 9.5px; color: #8A94A0; padding: 4px 6px; }
.dsb__job { background: #FFFFFF; border-radius: 10px; padding: 10px 12px 12px; box-shadow: 0 1px 3px rgba(11,22,34,0.08); }
.dsb__jt { font-size: 12px; font-weight: 900; color: #0B1622; }
.dsb__stages { margin-top: 8px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.dsb__stage { border: 1px solid #E2E8EE; border-radius: 8px; padding: 7px 9px; }
.dsb__st { display: flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 900; color: #0B1622; }
.dsb__sn { display: flex; align-items: center; justify-content: space-between; margin: 4px 0 4px; padding-bottom: 5px; border-bottom: 1px solid #EEF1F4; }
.dsb__sn > b { font-size: 18px; font-weight: 900; color: #0B1622; }
.dsb__sn small { margin-left: 2px; font-size: 9px; }
.dsb__rate { font-size: 8.5px; font-weight: 700; color: #1E78D2; background: #E3EFFB; border-radius: 999px; padding: 1px 7px; }
.dsb__rate.is-green { color: #1E9E6B; background: #E2F4EC; }
.dsb__today { font-size: 9px; font-weight: 700; } .dsb__today em { font-style: normal; color: #1E78D2; }
.dsb__sr { display: flex; justify-content: space-between; font-size: 9px; color: #3A4757; padding-left: 8px; position: relative; }
.dsb__sr::before { content: ""; position: absolute; left: 0; top: 6px; width: 4px; height: 4px; border-radius: 50%; background: #C8D0D8; }
.dsb__sr.is-head { padding-left: 0; font-size: 10.5px; font-weight: 900; color: #0B1622; margin-bottom: 1px; }
.dsb__sr.is-head::before { display: none; }
.dsb__sr .c-blue { color: #1E78D2; } .dsb__sr .c-red { color: #E0474C; }

/* MV 案D：全体を横切るグラデーションの波（ふんわり流れる） */
.kv-flow { display: none; position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.kv-flow svg { position: absolute; left: -5%; top: 0; width: 110%; height: 100%; }
.mv-d .kv-new { background: #FFFFFF; }
.mv-d .kv-flow { display: block; }
.mv-d .kv-aurora, .mv-d .kv-icons { display: none; }
.kv-flow__a { opacity: 0.8; }
.kv-flow__b { opacity: 0.35; }
@media (prefers-reduced-motion: no-preference) {
  .mv-d .kv-flow svg { animation: kvFlow 18s ease-in-out infinite alternate; }
}
@keyframes kvFlow { from { transform: translate3d(-2%, 0, 0) scaleY(1); } to { transform: translate3d(2%, -2.5%, 0) scaleY(1.06); } }
.mv-d .kv-new .browser--kv, .mv-d .kv-new .kv-form__frame { box-shadow: 0 30px 60px -30px rgba(var(--b-rgb),0.45); }
@media (max-width: 760px) { .kv-flow svg { left: -40%; width: 180%; } }
/* 濃い色のパレットでは波を淡く */
.palette-5 .kv-flow__a, .palette-3 .kv-flow__a, .palette-2 .kv-flow__a { opacity: 0.6; }
/* カラー4：案Dの波の緑を控えめに（左端だけミント、青の層を強める） */
.palette-4 .kv-flow__a { opacity: 0.9; }
.palette-4 .kv-flow__b { opacity: 0.75; }
/* MV下部のウェーブ：縁をぼかしてふんわり（下端は区切りの外まで伸ばして、境目を出さない） */
.kv-wave { bottom: -60px; height: calc(clamp(48px, 7vw, 110px) + 60px); }
.kv-wave svg { position: absolute; left: -10%; width: 120%; height: 100%; overflow: visible; }
/* ぼかしはSVG全体にかける（iPhoneのSafariはSVG内の要素へのCSSのぼかしに未対応のため） */
.kv-flow svg { filter: blur(32px); }
.kv-wave svg { filter: blur(11px); }
@media (max-width: 760px) { .kv-flow svg { filter: blur(22px); } }
/* カラー4：案Dの波は青の範囲を広めに */
.palette-4 .kv-flow__a path { fill: url(#kfA4); }
.palette-4 .kv-flow__b path { fill: url(#kfB4); }
/* MV：サブタイトル（チラシのコピー） */
.kv-sub { margin-top: clamp(18px, 2vw, 26px); font-size: clamp(17px, 1.6vw, 22px); font-weight: 500; line-height: 1.6; color: var(--sub); letter-spacing: 0.02em; word-break: keep-all; overflow-wrap: anywhere; }
/* 01 Issue：枠なし。イラストとテキストを横に並べる */
.issue-list { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px clamp(24px, 3vw, 40px); }
.issue-item { display: flex; flex-direction: column; min-width: 0; }
.issue-item__ill { aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; }
.issue-item__ill { position: relative; }
.issue-item__ill svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.issue-item__title { margin-top: 20px; font-size: clamp(18px, 1.5vw, 20px); font-weight: 900; line-height: 1.55; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.issue-item__text { margin-top: 10px; font-size: 14px; line-height: 1.85; color: var(--sub); flex: 1; }
.issue-item__solve { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--ink); }
.issue-item__solve a.badge { text-decoration: none; }
.issue-item__solve a.badge:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1080px) { .issue-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px 40px; } }
@media (max-width: 600px) { .issue-list { grid-template-columns: minmax(0, 1fr); gap: 48px; } .issue-item__ill { aspect-ratio: auto; height: 210px; } .issue-item__title { margin-top: 16px; } }
/* 01 Issueのイラスト：色の調整
   ill-1：全点同じ色（青をやわらかく）／ill-2：4つの特徴の色に合わせる */
.palette-4 {
  --ill-main: #4A85EC; --ill-tint: #E8F0FD;
  --ill-ai: #2EB6E3; --ill-ai-t: #E3F7FD;
  --ill-one: #4A85EC; --ill-one-t: #E8F0FD;
  --ill-agent: #2FC9B4; --ill-agent-t: #E2F8F5;
  --ill-split: #4F5D80; --ill-split-t: #ECEFF5;
}
.ill-2 .issue-item:nth-child(1) { --ill-main: var(--ill-ai, color-mix(in srgb, var(--p) 82%, #8792A2)); --ill-tint: var(--ill-ai-t, var(--p-t)); }
.ill-2 .issue-item:nth-child(2) { --ill-main: var(--ill-one, color-mix(in srgb, var(--b) 82%, #8792A2)); --ill-tint: var(--ill-one-t, var(--b-t)); }
.ill-2 .issue-item:nth-child(3) { --ill-main: var(--ill-agent, color-mix(in srgb, var(--g) 82%, #8792A2)); --ill-tint: var(--ill-agent-t, var(--g-t)); }
.ill-2 .issue-item:nth-child(4) { --ill-main: var(--ill-split, color-mix(in srgb, var(--ink) 75%, #FFFFFF)); --ill-tint: var(--ill-split-t, var(--surface)); }


/* 06 Security：体制の認証マーク */
.sec-cert { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); display: flex; align-items: center; gap: 14px; }
.sec-cert__marks { display: flex; gap: 8px; flex: none; }
.sec-cert__marks img { width: 56px; height: 56px; object-fit: contain; }
.sec-cert__text { font-size: 12px; line-height: 1.7; color: var(--muted); }
@media (max-width: 520px) { .sec-cert { flex-direction: column; align-items: flex-start; } }

/* 08 Flow：前回のデザインのまま、右側に三角を付けてフローに（スマホは下向き） */
.flow-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; }
.flow-step { position: relative; }
.flow-step:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: -24px; width: 24px; height: 60px; transform: translateY(-50%); background: inherit; clip-path: polygon(0 0, 100% 50%, 0 100%); }
@media (max-width: 960px) {
  .flow-steps { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .flow-step:not(:last-child)::after { top: auto; right: auto; bottom: -24px; left: 50%; width: 60px; height: 24px; transform: translateX(-50%); clip-path: polygon(0 0, 100% 0, 50% 100%); }
}

/* 認証マーク画像（3点を1枚にまとめたもの） */
.sec-cert__marks img { width: auto; height: 56px; }
.certs img.certs__img { width: auto; height: 40px; }
.sec-cert { flex-wrap: wrap; }
.sec-cert__text { flex: 1 1 240px; }

/* 08 Flow：三角をボックスの天地いっぱいに */
.flow-steps { gap: 40px; }
.flow-step:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.flow-step:not(:last-child)::after { top: 0; bottom: 0; right: -32px; width: 32px; height: auto; transform: none; }
@media (max-width: 960px) {
  .flow-steps { gap: 36px; }
  .flow-step:not(:last-child) { border-top-right-radius: 28px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
  .flow-step:not(:last-child)::after { top: auto; left: 0; right: 0; bottom: -28px; width: auto; height: 28px; transform: none; clip-path: polygon(0 0, 100% 0, 50% 100%); }
}
.certs { flex-wrap: wrap; row-gap: 6px; } .certs p { white-space: nowrap; } .certs img.certs__img { height: 36px; }

/* =========================================================
   Value 02 の調整
   ========================================================= */
/* 体験の説明：背景なし・文章で説明／画面はグレーの背景ボックスに */
.vbox--plain { background: transparent; padding: 0; border-radius: 0; }
.vbox--plain .vpoint { border-top: 2px solid var(--g-d); }
.vpoint__text { margin-top: 10px; font-size: 15px; line-height: 1.9; color: var(--text); }
.pool-frame { position: relative; height: clamp(380px, 38vw, 520px); border-radius: 28px; background: var(--surface); padding: clamp(24px, 3vw, 40px) clamp(20px, 3vw, 40px) 0; overflow: hidden; }
.pool-frame img { display: block; width: 100%; height: auto; border-radius: 14px 14px 0 0; box-shadow: 0 28px 56px -30px rgba(11,22,34,0.38); }
.pool-frame::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 48px; background: linear-gradient(180deg, rgba(242,246,249,0), var(--surface)); pointer-events: none; }
@media (max-width: 560px) { .pool-frame { height: 300px; border-radius: 20px; padding: 16px 14px 0; } }

/* 好循環：円形のループ図 */
.loop-wrap { margin-top: 20px; display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr); gap: 32px clamp(32px, 5vw, 72px); align-items: center; }
.loop-copy__title { font-size: clamp(22px, 2.2vw, 28px); font-weight: 900; line-height: 1.5; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.loop-copy__text { margin-top: 14px; font-size: 15px; line-height: 1.9; color: var(--text); }
.loop { position: relative; width: 100%; max-width: 520px; aspect-ratio: 1; margin: 0 auto; }
.loop__ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.loop__center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; }
.loop__center b { display: block; font-size: clamp(22px, 2.4vw, 30px); font-weight: 900; color: var(--g-d); line-height: 1.3; }
.loop__center span { display: block; margin-top: 4px; font-size: 13px; font-weight: 700; color: var(--sub); }
.loop__node { position: absolute; transform: translate(-50%, -50%); width: 36%; background: var(--white); border: 1px solid var(--line-2); border-radius: 16px; padding: 10px 12px; font-size: 14px; font-weight: 900; line-height: 1.5; color: var(--ink); text-align: center; box-shadow: 0 12px 24px -18px rgba(11,22,34,0.35); word-break: keep-all; overflow-wrap: anywhere; }
.loop__node small { display: block; font-family: var(--font-en); font-size: 11px; font-weight: 700; color: var(--g-d); }
.loop__node--t { left: 50%; top: 15.6%; }
.loop__node--r { left: 84.4%; top: 50%; }
.loop__node--b { left: 50%; top: 84.4%; }
.loop__node--l { left: 15.6%; top: 50%; }
.loop__node.is-goal { background: var(--g-d); border-color: var(--g-d); color: var(--white); }
.loop__node.is-goal small { color: rgba(255,255,255,0.8); }
@media (max-width: 960px) { .loop-wrap { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 520px) { .loop__node { width: 38%; padding: 8px 8px; font-size: 12px; border-radius: 12px; } .loop__node--r { left: 81%; } .loop__node--l { left: 19%; } .loop__center span { font-size: 11px; } }

/* 求人媒体：左側も1つずつボックスに */
.intake__src { border: 1px solid var(--line-2); padding: 12px 16px; align-items: center; }
@media (max-width: 520px) { .loop__center span { display: none; } .loop__center b { font-size: 18px; } }
@media (max-width: 760px) { .intake { flex-direction: column; } .intake__group, .intake__db, .intake__goal { flex: none; } .intake__arrow { transform: rotate(90deg); padding: 2px 0; } }

/* Value 02：紹介を増やす3つの機能（画面イメージ＋説明） */
.agt3 { margin-top: clamp(40px, 4.5vw, 56px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px clamp(20px, 2.4vw, 32px); }
.agt3__card { margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.agt3__frame { position: relative; height: 290px; border-radius: 24px; background: var(--surface); padding: 22px 20px 0; overflow: hidden; }
.agt3__frame::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 36px; background: linear-gradient(180deg, rgba(242,246,249,0), var(--surface)); pointer-events: none; }
.agt3__frame .ui { width: 117.7%; max-width: none; transform: scale(0.85); transform-origin: top left; background: #FFFFFF; border-radius: 12px 12px 0 0; border-bottom: 0; box-shadow: 0 22px 44px -28px rgba(11,22,34,0.38); }
.agt3__label { font-size: 13px; font-weight: 700; color: var(--g-d); }
.agt3__title { margin: 4px 0 0; font-size: clamp(17px, 1.6vw, 20px); font-weight: 900; line-height: 1.5; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.agt3__text { margin-top: 6px; font-size: 14px; line-height: 1.85; color: var(--text); }
@media (max-width: 960px) { .agt3 { grid-template-columns: minmax(0, 1fr); gap: 40px; } .agt3__frame { height: 280px; } }
/* 画面モック：エージェント別実績 */
.agt-avg { margin-top: 8px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.agt-avg div { background: #F4F5F7; border-radius: 8px; padding: 6px 8px; }
.agt-avg small { display: block; font-size: 10px; color: #5E6B78; }
.agt-avg b { font-size: 17px; font-weight: 900; color: #0B1622; } .agt-avg i { font-style: normal; font-size: 10px; margin-left: 2px; }
.agt-table { margin-top: 8px; width: 100%; border-collapse: collapse; font-size: 11px; }
.agt-table th, .agt-table td { padding: 6px 4px; border-bottom: 1px solid #EEF0F3; text-align: right; white-space: nowrap; }
.agt-table thead th { font-size: 10px; color: #5E6B78; font-weight: 700; }
.agt-table th:first-child { text-align: left; font-weight: 900; color: #0B1622; }
.agt-table thead th:first-child { color: #5E6B78; font-weight: 700; }
.agt-table td { color: #24313F; }
/* 画面モック：メッセージ */
.msg-thread { margin-top: 8px; font-size: 11px; font-weight: 900; color: #1E78D2; background: #F1F7FD; border-radius: 6px; padding: 5px 8px; }
.msg { margin-top: 8px; max-width: 86%; border-radius: 10px; padding: 7px 10px; font-size: 11px; line-height: 1.6; }
.msg b { display: block; font-size: 9.5px; color: #5E6B78; font-weight: 700; }
.msg--in { background: #F4F5F7; }
.msg--out { margin-left: auto; background: #E3EFFB; }
.msg__file { margin-top: 4px; display: inline-flex; align-items: center; gap: 4px; font-size: 10px; background: #FFFFFF; border: 1px solid #D2DBE3; border-radius: 6px; padding: 1px 6px; }
/* 画面モック：公開先エージェント */
.pub-list { margin-top: 8px; border: 1px solid #EEF0F3; border-radius: 10px; }
.pub-list p { display: flex; align-items: center; gap: 8px; padding: 7px 10px; font-size: 11px; font-weight: 700; color: #0B1622; }
.pub-list p + p { border-top: 1px solid #EEF0F3; }
.pub-list em { margin-left: auto; font-style: normal; font-size: 10px; color: #1E9E6B; background: #E8F6F0; border-radius: 999px; padding: 0 8px; }
.pub-list em.is-off { color: #5E6B78; background: #F1F3F5; }
.pub-sw { width: 24px; height: 14px; border-radius: 999px; background: #C8D0D8; position: relative; flex: none; }
.pub-sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 10px; height: 10px; border-radius: 50%; background: #FFFFFF; }
.pub-sw.is-on { background: #1E88E5; } .pub-sw.is-on::after { left: 12px; }
.pub-secret { margin-top: 8px; background: #FCF5E3; border-radius: 10px; padding: 8px 10px; font-size: 11px; line-height: 1.6; }
.pub-secret b { display: block; font-size: 11px; color: #B98A0B; margin-bottom: 2px; }

/* Value 02：ダッシュボード（公開中のエージェント）を実際の画面に近いデザインで */
.agt3__frame .ui.ad { background: #F6F8FA; }
.ad__h { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 900; color: #0B1622; }
.ad__card { margin-top: 8px; background: #FFFFFF; border-radius: 10px; padding: 10px 12px 12px; box-shadow: 0 1px 3px rgba(11,22,34,0.08); }
.ad__job { font-size: 12px; font-weight: 900; color: #0B1622; }
.ad__bar { margin-top: 8px; display: flex; align-items: center; gap: 6px; padding: 8px 0; border-top: 1px solid #EEF1F4; border-bottom: 1px solid #EEF1F4; font-size: 11.5px; font-weight: 700; color: #24313F; }
.ad__bar b { font-size: 13px; font-weight: 900; color: #0B1622; margin-left: 2px; }
.ad__unit { font-size: 10px; }
.ad__bar i { margin-left: auto; display: flex; }
.ad__avg { margin-top: 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 10px; }
.ad__avg > span { font-weight: 700; color: #5E6B78; margin-right: 2px; }
.ad__avg em { font-style: normal; font-weight: 700; color: #1E78D2; background: #E3EFFB; border-radius: 999px; padding: 1px 8px; }
.ad__avg em.is-g { color: #1E9E6B; background: #E2F4EC; }
.ad__table { margin-top: 6px; width: 100%; border-collapse: collapse; font-size: 10.5px; }
.ad__table th, .ad__table td { padding: 6px 3px; border-bottom: 1px solid #EEF1F4; text-align: right; white-space: nowrap; }
.ad__table thead th { font-size: 9.5px; font-weight: 700; color: #5E6B78; background: #F6F8FA; }
.ad__table thead th:first-child { padding-left: 6px; text-align: left; }
.ad__table tbody th { text-align: left; font-weight: 900; color: #0B1622; padding-left: 6px; }
.ad__table td { color: #5E6B78; font-size: 9.5px; }
.ad__table td b { font-size: 12px; font-weight: 900; color: #1E78D2; margin-right: 1px; }

/* =========================================================
   Value 02：紹介を増やす3つの機能（ダイジェスト版9ページの実画面をHTMLで再現）
   ========================================================= */
.fitbox { position: relative; width: 100%; }
.fitbox__inner { width: 520px; transform-origin: top left; }
.agt3__frame { height: 300px; padding: 20px 18px 0; }
.rx { background: #FFFFFF; border-radius: 12px 12px 0 0; box-shadow: 0 22px 44px -28px rgba(11,22,34,0.38); font-size: 12px; line-height: 1.5; color: #24313F; overflow: hidden; }
.rx p { margin: 0; }
.rx svg { flex: none; }
.rx em { font-style: normal; }
.rx-btn { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; color: #24313F; background: #FFFFFF; border: 1px solid #C9D2DC; border-radius: 6px; padding: 3px 9px; white-space: nowrap; }
/* 1. ダッシュボード */
.rx-bar { display: flex; align-items: center; gap: 7px; padding: 12px 14px; font-size: 12.5px; font-weight: 700; border-bottom: 1px solid #EEF1F4; }
.rx-bar b { font-weight: 900; color: #0B1622; }
.rx-bar i { margin-left: auto; display: flex; }
.rx-table { width: 100%; border-collapse: collapse; }
.rx-table th { font-size: 10px; font-weight: 700; color: #5E6B78; text-align: left; padding: 6px 6px; border-bottom: 1px solid #EEF1F4; white-space: nowrap; }
.rx-table td { vertical-align: top; padding: 9px 6px; border-bottom: 1px solid #EEF1F4; border-left: 1px solid #F2F4F6; }
.rx-table td.rx-no, .rx-table td.rx-name { border-left: 0; }
.rx-no { font-size: 11px; color: #5E6B78; width: 14px; }
.rx-name { font-size: 11px; font-weight: 900; color: #0B1622; width: 118px; }
.rx-ctop { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.rx-ctop b { font-size: 16px; font-weight: 900; color: #0B1622; }
.rx-today { font-size: 9.5px; font-weight: 700; } .rx-today em { color: #1E78D2; margin-left: 2px; }
.rx-pill { font-size: 9px; font-weight: 700; color: #1E78D2; background: #E3EFFB; border-radius: 999px; padding: 0 6px; white-space: nowrap; }
.rx-pill.is-g { color: #1E9E6B; background: #E2F4EC; }
.rx-csub { display: flex; justify-content: space-between; gap: 4px; margin-top: 3px !important; font-size: 9.5px; color: #3A4757; white-space: nowrap; }
.rx-csub em { font-weight: 900; color: #1E78D2; } .rx-csub em.is-zero { color: #8A94A0; }
/* 2. メッセージ */
.rx--msg { display: grid; grid-template-columns: 150px 1fr; }
.rx-side { border-right: 1px solid #E5E9EE; padding: 10px 0 0; background: #FFFFFF; }
.rx-side__h { display: flex; align-items: center; gap: 6px; padding: 0 10px; font-size: 11.5px; font-weight: 900; color: #0B1622; }
.rx-tabs { margin: 8px 10px 0 !important; display: flex; background: #EEF1F4; border-radius: 999px; padding: 2px; font-size: 10px; font-weight: 700; }
.rx-tabs span { flex: 1; text-align: center; border-radius: 999px; padding: 2px 0; color: #5E6B78; }
.rx-tabs .is-on { background: #FFFFFF; color: #0B1622; box-shadow: 0 1px 2px rgba(0,0,0,0.08); }
.rx-tabs em { display: inline-flex; align-items: center; justify-content: center; width: 13px; height: 13px; margin-left: 3px; border-radius: 50%; background: #E0474C; color: #FFFFFF; font-size: 8.5px; }
.rx-count { padding: 6px 10px; font-size: 9px; color: #8A94A0; }
.rx-th { padding: 7px 10px; border-top: 1px solid #EEF1F4; }
.rx-th.is-on { background: #F1F7FD; border-left: 3px solid #1E88E5; padding-left: 7px; }
.rx-th__top { display: flex; justify-content: space-between; align-items: center; }
.rx-tag { display: inline-flex; align-items: center; gap: 3px; font-size: 8.5px; font-weight: 700; color: #1E78D2; background: #E3EFFB; border-radius: 4px; padding: 0 5px; }
.rx-th__date { font-size: 8.5px; font-weight: 700; color: #3A4757; }
.rx-th__name { margin-top: 3px !important; display: flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 900; color: #0B1622; }
.rx-th__name i { width: 6px; height: 6px; border-radius: 50%; background: #E0474C; }
.rx-th__job { font-size: 9px; color: #5E6B78; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-main { background: #F6F8FA; padding: 10px 12px; min-width: 0; }
.rx-main__head { display: flex; align-items: center; gap: 8px; }
.rx-main__head b { display: block; font-size: 12px; font-weight: 900; color: #0B1622; }
.rx-main__head small { font-size: 9.5px; color: #1E78D2; }
.rx-ava { width: 24px; height: 24px; border-radius: 50%; background: #EEF1F4; display: flex; align-items: center; justify-content: center; flex: none; font-size: 10px; font-weight: 700; color: #7B61D9; }
.rx-ava--s { width: 20px; height: 20px; background: #EDE9FB; }
.rx-status { margin-top: 8px; background: #FFFFFF; border: 1px solid #E5E9EE; border-radius: 8px; padding: 6px 8px; }
.rx-status__h { display: flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 900; color: #0B1622; }
.rx-status__h > span { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 500; color: #5E6B78; }
.rx-status__h i { width: 6px; height: 6px; border-radius: 50%; background: #1E9E6B; margin-left: 4px; }
.rx-status__h b { color: #0B1622; }
.rx-status__row { margin-top: 5px !important; display: flex; gap: 8px; align-items: center; font-size: 9.5px; border-top: 1px solid #EEF1F4; padding-top: 5px; }
.rx-status__row em { color: #1E78D2; } .rx-ok { color: #1E9E6B; font-weight: 700; } .rx-dim { margin-left: auto; color: #5E6B78; }
.rx-sys { margin-top: 8px !important; font-size: 9px; color: #5E6B78; background: #EEF1F4; border-radius: 999px; padding: 3px 10px; text-align: center; }
.rx-m { margin-top: 8px; display: flex; gap: 6px; }
.rx-m small { font-size: 9px; color: #5E6B78; }
.rx-bubble { margin-top: 2px; background: #FFFFFF; border: 1px solid #E5E9EE; border-radius: 10px; padding: 7px 9px; font-size: 10.5px; max-width: 250px; }
.rx-file { margin-top: 6px !important; padding-top: 6px; border-top: 1px solid #EEF1F4; display: flex; align-items: center; gap: 5px; font-size: 9.5px; }
.rx-file em { color: #1E78D2; }
.rx-fix { margin-top: 4px !important; display: flex; align-items: center; gap: 4px; font-size: 9.5px; font-weight: 700; color: #D98A0B; }
.rx-m--out { justify-content: flex-end; text-align: right; }
.rx-bubble--out { background: #1976D2; border-color: #1976D2; color: #FFFFFF; text-align: left; }
.rx-input { margin-top: 10px; background: #FFFFFF; border: 1px solid #E5E9EE; border-radius: 8px; padding: 6px 8px; }
.rx-input > p { font-size: 10px; color: #8A94A0; }
.rx-input > div { margin-top: 6px; display: flex; align-items: center; gap: 8px; }
.rx-attach { margin-left: auto; display: inline-flex; align-items: center; gap: 3px; font-size: 9.5px; color: #3A4757; }
.rx-send { font-size: 10px; font-weight: 700; color: #FFFFFF; background: #1E88E5; border-radius: 5px; padding: 3px 10px; }
/* 3. 募集要項の公開と非公開情報 */
.rx--job { background: #F6F8FA; }
.rx-job { background: #FFFFFF; padding: 12px 14px; border-bottom: 1px solid #E5E9EE; }
.rx-job__top { display: flex; justify-content: space-between; align-items: center; }
.rx-badge { font-size: 9px; font-weight: 700; color: #1E9E6B; background: #E2F4EC; border-radius: 4px; padding: 1px 7px; }
.rx-job__title { margin-top: 4px !important; font-size: 13px; font-weight: 900; color: #0B1622; }
.rx-job__id { font-size: 9px; color: #5E6B78; }
.rx-job__row { margin-top: 4px !important; display: grid; grid-template-columns: 14px 90px 1fr; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; color: #24313F; }
.rx-job__row b { display: flex; align-items: center; gap: 6px; font-weight: 700; }
.rx-job__row b > i { width: 6px; height: 6px; border-radius: 50%; background: #7B61D9; }
.rx-recv { font-size: 9px; color: #1E78D2; background: #E3EFFB; border-radius: 999px; padding: 0 10px; }
.rx-link { color: #1E78D2; }
.rx-add { font-size: 9.5px; border: 1px solid #C9D2DC; border-radius: 999px; padding: 0 8px; font-weight: 700; }
.rx-agent { padding: 10px 14px; background: #FFFFFF; margin: 10px; border-radius: 10px; }
.rx-agent__h { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 900; color: #0B1622; padding-bottom: 8px; border-bottom: 1px solid #EEF1F4; }
.rx-btns { margin-left: auto; display: flex; gap: 5px; }
.rx-sub { margin-top: 9px !important; display: flex; align-items: center; justify-content: space-between; font-size: 11px; font-weight: 900; color: #0B1622; }
.rx-stats { margin-top: 6px; display: flex; gap: 8px; }
.rx-stats p { flex: 1; border: 1px solid #D9DFE6; border-radius: 6px; padding: 4px 0 5px; text-align: center; }
.rx-stats small { display: block; font-size: 9px; color: #3A4757; }
.rx-stats b { font-size: 13px; font-weight: 900; color: #0B1622; } .rx-stats i { font-style: normal; font-size: 9px; margin-left: 2px; }
.rx-note { margin-top: 3px !important; font-size: 9px; color: #5E6B78; }
.rx-shares { margin-top: 6px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rx-share { border: 1px solid #D9DFE6; border-radius: 8px; padding: 6px 8px; font-size: 9.5px; line-height: 1.6; }
.rx-share__h { display: flex; justify-content: space-between; align-items: center; gap: 6px; font-size: 10px; font-weight: 900; color: #0B1622; padding-bottom: 4px; margin-bottom: 4px !important; border-bottom: 1px solid #EEF1F4; }
.rx-share__h span { display: flex; gap: 4px; }

/* ダッシュボード：上部の選考進捗 */
.rx-jt { display: flex; align-items: center; gap: 4px; padding: 10px 14px 0; font-size: 12px; font-weight: 900; color: #0B1622; }
.rx-stages { display: flex; align-items: center; gap: 3px; padding: 8px 14px 0; }
.rx-st { flex: 1; min-width: 0; border: 1px solid #DDE3EA; border-radius: 8px; padding: 6px 7px; }
.rx-st__h { display: flex; align-items: center; gap: 3px; font-size: 9.5px; font-weight: 900; color: #0B1622; white-space: nowrap; }
.rx-st__n { margin-top: 3px; display: flex; align-items: center; justify-content: space-between; gap: 3px; padding-bottom: 3px; border-bottom: 1px solid #EEF1F4; }
.rx-st__n b { font-size: 16px; font-weight: 900; color: #0B1622; line-height: 1.2; } .rx-st__n small { font-size: 9px; font-weight: 700; margin-left: 1px; }
.rx-st__n .rx-pill { font-size: 8px; padding: 0 5px; }
.rx-st__sub { margin-top: 3px !important; display: flex; justify-content: space-between; font-size: 9.5px; font-weight: 900; color: #0B1622; }
.rx-st__sub em { color: #1E78D2; }
.rx-st__arrow { flex: none; display: flex; }
.rx-ng { padding: 4px 14px 6px; text-align: right; font-size: 9px; color: #5E6B78; } .rx-ng b { color: #0B1622; }
.rx--dash .rx-bar { border-top: 1px solid #EEF1F4; }

/* ダッシュボード：外側に余白を持たせる */
.rx--dash { padding-bottom: 12px; }
.rx--dash .rx-jt { padding: 20px 24px 0; font-size: 13px; }
.rx--dash .rx-stages { padding: 12px 24px 0; gap: 6px; }
.rx--dash .rx-st { padding: 8px 10px; }
.rx--dash .rx-ng { padding: 8px 24px 12px; }
.rx--dash .rx-bar { padding: 12px 24px; background: #F8F9FB; border-bottom: 1px solid #EEF1F4; }
.rx--dash .rx-table { width: calc(100% - 48px); margin: 6px 24px 0; }
.rx--dash .rx-table th:first-child, .rx--dash .rx-table td.rx-no { padding-left: 4px; }
.rx--dash .rx-table td { padding: 10px 8px; }
.rx--dash .rx-name { width: 124px; }

/* Value 02：エージェント専用画面で完結する流れ（チラシ「A エージェント活用」より） */
.aflow-wrap .vsub { margin-top: 0; }
.aflow-lead { margin-top: 10px; font-size: 15px; line-height: 1.9; color: var(--text); max-width: 52em; }
.aflow { margin-top: 22px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; counter-reset: none; }
.aflow__step { position: relative; border: 1px solid var(--line-2); border-radius: 20px; padding: 18px 18px 20px; background: var(--white); }
.aflow__step:not(:last-child)::after { content: ""; position: absolute; right: -11px; top: 30px; width: 8px; height: 8px; border-top: 2px solid var(--g-d); border-right: 2px solid var(--g-d); transform: rotate(45deg); }
.aflow__head { display: flex; align-items: center; gap: 10px; }
.aflow__num { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--g-d); color: #FFFFFF; font-family: var(--font-en); font-size: 14px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.aflow__head b { font-size: 16px; font-weight: 900; line-height: 1.4; color: var(--ink); }
.aflow__text { margin-top: 10px; font-size: 13.5px; line-height: 1.8; color: var(--sub); }
.aflow-wrap + .vbox { margin-top: clamp(56px, 6vw, 80px); }
@media (max-width: 1080px) { .aflow { grid-template-columns: repeat(2, minmax(0, 1fr)); } .aflow__step::after { display: none; } }
@media (max-width: 640px) {
  .aflow { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .aflow__step:not(:last-child)::after { display: block; right: auto; left: 50%; top: auto; bottom: -15px; transform: translateX(-50%) rotate(135deg); }
}

/* Value 02の流れ：PCでは説明文を少し小さく */
@media (min-width: 1081px) { .aflow__text { font-size: 12.5px; line-height: 1.75; } .aflow__step { padding: 18px 16px 18px; } }
/* 案2：左にステップを縦に、右に専用画面のイメージ */
.aflow2 { display: none; }
.aflow-2 .aflow { display: none; }
.aflow-2 .aflow2 { margin-top: 26px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 32px clamp(32px, 4vw, 64px); align-items: center; }
.aflow2__list { position: relative; display: flex; flex-direction: column; gap: 0; }
.aflow2__step { position: relative; display: flex; gap: 16px; padding-bottom: 22px; }
.aflow2__step:last-child { padding-bottom: 0; }
.aflow2__step:not(:last-child)::before { content: ""; position: absolute; left: 15px; top: 34px; bottom: 4px; width: 2px; border-radius: 2px; background: rgba(var(--g-rgb), 0.55); }
.aflow2__num { flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--g-d); color: #FFFFFF; font-family: var(--font-en); font-size: 14px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.aflow2__title { padding-top: 4px; font-size: 16px; font-weight: 900; line-height: 1.5; color: var(--ink); }
.aflow2__text { margin-top: 4px; font-size: 13.5px; line-height: 1.8; color: var(--sub); }
.pool-frame--tall { height: clamp(420px, 40vw, 560px); }
.aflow2__cap { margin-top: 10px; font-size: 12px; color: var(--muted); text-align: center; }
@media (max-width: 960px) { .aflow-2 .aflow2 { grid-template-columns: minmax(0, 1fr); } .pool-frame--tall { height: 340px; } }

/* Value 02：流れは案2で確定（常に表示） */
.aflow2 { margin-top: 26px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 32px clamp(32px, 4vw, 64px); align-items: center; }
@media (max-width: 960px) { .aflow2 { grid-template-columns: minmax(0, 1fr); } }
/* 体験：画面なし・2列のカード */
.exp2 { margin-top: clamp(56px, 6vw, 80px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.exp2__card { border: 1px solid var(--line-2); border-radius: 20px; padding: 24px 26px 26px; background: var(--white); }
.exp2__tag { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 900; color: var(--g-d); background: var(--g-t); border-radius: 999px; padding: 4px 12px; }
.exp2__title { margin: 12px 0 0; font-size: 19px; font-weight: 900; line-height: 1.5; color: var(--ink); }
.exp2__text { margin-top: 8px; font-size: 14px; line-height: 1.85; color: var(--sub); }
.exp2 + .agt3 { margin-top: clamp(40px, 4.5vw, 56px); }
@media (max-width: 760px) { .exp2 { grid-template-columns: minmax(0, 1fr); } }

/* =========================================================
   Value 03 の再構成
   ========================================================= */
/* ワンアクション：4案（bodyのclass oa-1〜oa-4 で切り替え） */
.oa { display: none; }
.oa-1 .oa1, .oa-3 .oa3, .oa-4 .oa4 { display: grid; }
.oa-2 .oa2 { display: block; }
/* 案2：これまで→これからの比較表 */
.oa2 { margin-top: 18px; }
.oa2__head, .oa2 li { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.2fr) 36px minmax(0, 1fr); align-items: center; gap: 0 14px; }
.oa2__head { font-size: 12px; font-weight: 700; color: var(--muted); padding: 0 18px 8px; }
.oa2__head span:last-child { color: var(--b-d); }
.oa2 ul { display: flex; flex-direction: column; gap: 8px; }
.oa2 li { border: 1px solid var(--line-2); border-radius: 18px; padding: 14px 18px; background: var(--white); }
.oa2__task { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 900; color: var(--ink); }
.oa2__task svg { color: var(--b-d); }
.oa2__before { font-size: 13px; line-height: 1.6; color: var(--muted); text-decoration: line-through; text-decoration-color: rgba(94,107,120,0.45); }
.oa2__arrow { width: 30px; height: 30px; border-radius: 50%; background: var(--b); display: flex; align-items: center; justify-content: center; }
.oa2__after { font-size: 17px; font-weight: 900; color: var(--b-d); }
/* 案3：「〜だけ」を大きく見せるカード */
.oa3 { margin-top: 18px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.oa3 li { border-radius: 20px; padding: 22px 20px 20px; background: var(--b-t); display: flex; flex-direction: column; }
.oa3__ic { width: 44px; height: 44px; border-radius: 12px; background: #FFFFFF; color: var(--b-d); display: flex; align-items: center; justify-content: center; }
.oa3__task { margin-top: 14px; font-size: 13px; font-weight: 700; color: var(--b-d); }
.oa3__after { margin-top: 4px; font-size: 21px; font-weight: 900; line-height: 1.45; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; flex: 1; }
.oa3__before { margin-top: 14px; padding-top: 12px; border-top: 1px dashed rgba(var(--b-rgb),0.35); font-size: 12px; line-height: 1.6; color: var(--sub); }
.oa3__before small { display: block; font-size: 11px; font-weight: 700; color: var(--muted); }
/* 案4：手順の数 vs 1アクション */
.oa4 { margin-top: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.oa4 li { border: 1px solid var(--line-2); border-radius: 20px; padding: 20px 22px 22px; background: var(--white); }
.oa4__task { font-size: 16px; font-weight: 900; color: var(--ink); }
.oa4__cmp { margin-top: 12px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 10px; }
.oa4__cmp small { display: block; font-size: 11px; font-weight: 700; color: var(--muted); }
.oa4__cmp small b { font-family: var(--font-en); font-size: 15px; }
.oa4__before { background: var(--surface); border-radius: 14px; padding: 10px 12px; }
.oa4__before p { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; }
.oa4__before span { position: relative; font-size: 11.5px; font-weight: 700; color: var(--sub); background: #FFFFFF; border-radius: 6px; padding: 2px 8px; }
.oa4__after { background: var(--b-d); border-radius: 14px; padding: 10px 14px; display: flex; flex-direction: column; justify-content: center; }
.oa4__after small { color: rgba(255,255,255,0.75); }
.oa4__after p { margin-top: 4px; font-size: 16px; font-weight: 900; line-height: 1.45; color: #FFFFFF; }
@media (max-width: 1080px) { .oa3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .oa2__head { display: none; }
  .oa2 li { grid-template-columns: minmax(0, 1fr) 30px; grid-template-areas: "t t" "b b" "a ar"; gap: 6px 10px; }
  .oa2__task { grid-area: t; } .oa2__before { grid-area: b; } .oa2__after { grid-area: a; } .oa2__arrow { display: none; }
  .oa3, .oa4 { grid-template-columns: minmax(0, 1fr); }
}

/* 調整パターン：簡単な図 */
.vpat--d { gap: 16px; }
.vpat--d li { border-top: 0; padding: 0; display: flex; flex-direction: column; }
.vpat__fig { border-radius: 18px; background: var(--surface); padding: 18px 12px 12px; margin-bottom: 14px; }
.pd { display: flex; align-items: center; justify-content: center; gap: 4px; }
.pd__actor { flex: none; font-size: 12px; font-weight: 900; border-radius: 999px; padding: 5px 10px; background: #FFFFFF; border: 1px solid var(--line-2); color: var(--ink); }
.pd__actor--a { color: var(--g-d); border-color: rgba(var(--g-rgb),0.6); }
.pd__actor--i { color: var(--b-d); border-color: rgba(var(--b-rgb),0.5); }
.pd__actor--c { color: var(--sub); }
.pd__ar { color: var(--muted); display: flex; }
.pd__dates, .pd__match { display: flex; flex-direction: column; gap: 3px; }
.pd__dates i, .pd__match i { display: block; width: 30px; height: 9px; border-radius: 3px; background: #FFFFFF; border: 1px solid var(--line-2); }
.pd__dates i.is-ok, .pd__match i.is-ok { background: var(--b); border-color: var(--b); }
.pd__match i.is-ok { background: var(--g-d); border-color: var(--g-d); }
.pd__cap { margin-top: 10px; font-size: 12px; font-weight: 700; color: var(--sub); text-align: center; line-height: 1.5; }
.vpat--d b { font-size: 16px; }
.vpat--d small { margin-top: 6px; }
.vpat--d li.is-soon .vpat__fig { opacity: 0.75; }

/* 三者：3列のカード＋画面イメージ */
.vparty-grid { margin-top: 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.vparty__frame { margin: 6px 0 4px; height: 230px; border-radius: 16px; background: var(--surface); padding: 16px 14px 0; overflow: hidden; position: relative; }
.vparty__frame::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 30px; background: linear-gradient(180deg, rgba(242,246,249,0), var(--surface)); }
@media (max-width: 1080px) { .vparty-grid { grid-template-columns: minmax(0, 1fr); } .vparty__frame { height: 280px; } }
/* 画面モック共通（三者） */
.sx { background: #FFFFFF; border-radius: 10px 10px 0 0; box-shadow: 0 20px 40px -26px rgba(11,22,34,0.4); padding: 14px 16px; font-size: 12px; line-height: 1.5; color: #24313F; }
.sx p { margin: 0; }
.sx svg { flex: none; }
.sx-h { display: flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 900; color: #0B1622; padding-bottom: 10px; border-bottom: 1px solid #EEF1F4; }
.sx-h--s { font-size: 13px; border-left: 3px solid #1E88E5; padding: 0 0 0 7px; border-bottom: 0; }
.sx-info { margin-top: 10px !important; display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: #1E78D2; background: #E8F2FC; border-radius: 6px; padding: 7px 10px; }
.sx-t { margin-top: 8px !important; font-size: 11px; color: #3A4757; }
.sx-l { margin-top: 10px !important; display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 900; color: #0B1622; }
.sx-l em { color: #E0474C; font-style: normal; }
.sx-all { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; }
.sx-cb { margin-top: 5px !important; display: flex; align-items: flex-start; gap: 8px; background: #F4F6F8; border-radius: 6px; padding: 6px 9px; font-size: 11px; font-weight: 700; color: #0B1622; }
.sx-cb i { flex: none; width: 13px; height: 13px; border-radius: 3px; border: 1.5px solid #9AA4AE; background: #FFFFFF; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.sx-cb.is-on i { background: #1E88E5; border-color: #1E88E5; }
.sx-cb small { display: block; font-weight: 500; color: #24313F; }
.sx-cards .sx-cb { background: #FFFFFF; border: 1px solid #E5E9EE; }
.sx-tag { font-size: 10px; color: #FFFFFF; background: #1E88E5; border-radius: 999px; padding: 0 8px; }
.sx-ppl { margin-top: 6px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.sx-ppl p { display: flex; align-items: center; gap: 6px; border: 1px solid #8CC0F0; background: #F1F7FD; border-radius: 6px; padding: 6px 8px; font-size: 11px; }
.sx-ppl svg { background: #1E88E5; border-radius: 3px; padding: 1px; }
.sx-ppl small { margin-left: auto; font-size: 9.5px; color: #5E6B78; }
.sx-foot { margin-top: 12px !important; padding-top: 10px; border-top: 1px solid #EEF1F4; display: flex; gap: 8px; }
.sx-primary { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: #FFFFFF; background: #1E88E5; border-radius: 6px; padding: 5px 12px; }
.sx-sub { font-size: 11px; font-weight: 700; color: #3A4757; border: 1px solid #C9D2DC; border-radius: 6px; padding: 4px 12px; }
.sx--form { display: grid; grid-template-columns: 150px 1fr; gap: 12px; padding: 12px; }
.sx-dl { margin-top: 6px !important; font-size: 10px; color: #B4690E; }
.sx-l span { margin-left: auto; font-size: 10px; font-weight: 500; color: #5E6B78; }
.sx-chip { margin-top: 4px !important; font-size: 10px; color: #1E78D2; background: #EAF3FC; border: 1px solid #B9D8F5; border-radius: 5px; padding: 3px 6px; }
.sx-next { margin-top: 8px !important; text-align: center; font-size: 10.5px; font-weight: 700; color: #FFFFFF; background: #1E88E5; border-radius: 5px; padding: 4px 0; }
.sx-cal__h { font-size: 11.5px; font-weight: 900; color: #0B1622; margin-bottom: 6px !important; }
.sx-row { display: grid; grid-template-columns: 34px repeat(5, 1fr); }
.sx-row > span { font-size: 9px; color: #5E6B78; padding-top: 2px; }
.sx-row > i { height: 22px; border: 1px solid #EEF1F4; border-width: 0 0 1px 1px; font-style: normal; font-size: 9px; color: #1E78D2; display: flex; align-items: center; justify-content: center; }
.sx-row > i.is-off { background: repeating-linear-gradient(45deg, #F4F5F7, #F4F5F7 4px, #EBEDF0 4px, #EBEDF0 8px); }
.sx-row > i.is-sel { background: #D6E8FA; border-left: 2px solid #1E88E5; }
.sx-row--h b { font-size: 11px; font-weight: 900; color: #0B1622; text-align: center; padding: 3px 0; background: #F4F6F8; border-left: 1px solid #EEF1F4; }
.sx-row--h b small { display: block; font-size: 8.5px; font-weight: 500; color: #5E6B78; }

/* 分業体制：ルート管理の画面（HTMLで再現） */
.vsplit--route { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.route-frame { height: clamp(320px, 30vw, 420px); border-radius: 20px; background: #FFFFFF; padding: 20px 18px 0; overflow: hidden; position: relative; }
.route-frame::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 36px; background: linear-gradient(180deg, rgba(255,255,255,0), #FFFFFF); }
.rt { background: #F6F7F9; border-radius: 10px 10px 0 0; box-shadow: 0 20px 40px -26px rgba(11,22,34,0.4); padding: 14px 16px; font-size: 12px; color: #24313F; }
.rt p { margin: 0; }
.rt-top { display: flex; justify-content: space-between; align-items: center; }
.rt-title { font-size: 16px; font-weight: 900; color: #0B1622; border-left: 3px solid #1E3A8A; padding-left: 8px; }
.rt-btn { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; color: #24313F; background: #FFFFFF; border: 1px solid #C9D2DC; border-radius: 6px; padding: 4px 12px; white-space: nowrap; }
.rt-bar { margin-top: 10px; display: flex; align-items: center; gap: 8px; }
.rt-chk { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; }
.rt-chk i { width: 13px; height: 13px; border-radius: 3px; background: #1E88E5; display: flex; align-items: center; justify-content: center; }
.rt-sel { margin-left: auto; font-size: 11px; background: #FFFFFF; border: 1px solid #C9D2DC; border-radius: 6px; padding: 4px 26px 4px 10px; position: relative; }
.rt-sel::after { content: ""; position: absolute; right: 9px; top: 50%; border: 4px solid transparent; border-top-color: #3A4757; margin-top: -1px; }
.rt-body { margin-top: 10px; display: grid; grid-template-columns: 1fr 210px; gap: 10px; align-items: start; }
.rt-tree { background: #FFFFFF; border-radius: 8px; padding: 10px 12px; }
.rt-tree__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px !important; }
.rt-link { font-size: 10.5px; color: #1E78D2; }
.rt-n { display: grid; grid-template-columns: 1fr 40px 46px; align-items: center; gap: 6px; margin-top: 5px; }
.rt-box { display: flex; align-items: center; gap: 8px; border-radius: 6px; padding: 5px 8px; }
.rt-l1 .rt-box { margin-left: 22px; background: #F4F5F7; }
.rt-l2 .rt-box { margin-left: 44px; background: #F7F8FA; border: 1px solid #EEF1F4; }
.rt-l3 .rt-box { margin-left: 66px; background: #F4F5F7; }
.rt-n.is-sel .rt-box { background: #EAF3FC; box-shadow: inset 0 0 0 1.5px #8CC0F0; }
.rt-box p b { display: block; font-size: 11.5px; font-weight: 900; color: #0B1622; line-height: 1.3; }
.rt-box p small { font-size: 9.5px; color: #8A94A0; }
.rt-tg { flex: none; width: 13px; height: 13px; border: 1px solid #5E6B78; border-radius: 2px; font-style: normal; font-size: 10px; line-height: 11px; text-align: center; color: #3A4757; background: #FFFFFF; }
.rt-tg--none { border: 0; background: transparent; }
.rt-n em { font-style: normal; font-size: 12px; font-weight: 900; color: #1E78D2; text-align: right; }
.rt-st { font-size: 10.5px; display: flex; align-items: center; gap: 4px; }
.rt-st i, .rt-side dd i { width: 6px; height: 6px; border-radius: 50%; background: #1E9E6B; display: inline-block; }
.rt-side { background: #FFFFFF; border-radius: 8px; padding: 12px; }
.rt-bc { font-size: 10px; color: #5E6B78; }
.rt-name { margin-top: 3px !important; font-size: 14px; font-weight: 900; color: #0B1622; }
.rt-badge { display: inline-block; margin-top: 4px; font-size: 9.5px; font-weight: 700; color: #B98A0B; background: #FCF2D6; border-radius: 999px; padding: 1px 9px; }
.rt-side dl { margin: 10px 0 0; display: grid; grid-template-columns: 82px 1fr; gap: 6px 4px; font-size: 11px; }
.rt-side dt { font-weight: 900; color: #0B1622; } .rt-side dd { margin: 0; display: flex; align-items: center; gap: 5px; }
.rt-wbtn { margin-top: 8px !important; display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 11px; font-weight: 700; color: #24313F; border: 1px solid #C9D2DC; border-radius: 6px; padding: 5px 0; }
.rt-wbtn--b { color: #1E78D2; margin-top: 12px !important; }
@media (max-width: 960px) { .vsplit--route { grid-template-columns: minmax(0, 1fr); } .route-frame { height: 300px; } }
.vpat__fig { min-height: 118px; display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 1080px) { .vpat__fig { min-height: 0; } }

/* 調整パターン：水色ボックスの中に（図の説明は外） */
.vbox__sub { margin-top: 28px; padding-top: 24px; border-top: 1px solid rgba(var(--b-rgb),0.18); font-size: 18px; font-weight: 900; color: var(--ink); }
.vpat--in { margin-top: 14px; }
.vpat--in li { background: #FFFFFF; border-radius: 18px; padding: 14px 14px 18px; }
.vpat--in .vpat__fig { background: var(--surface); border-radius: 12px; margin-bottom: 12px; min-height: 96px; padding: 14px 8px; }
.vpat--in b { font-size: 16px; }
.vpat--in p { margin-top: 4px; font-size: 13.5px; line-height: 1.7; color: var(--text); }
.vpat--in small { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line-2); }
@media (max-width: 1080px) { .vpat--in .vpat__fig { min-height: 0; } }

/* 三者：1文＋効果を強調 */
.vparty__text { margin-top: 4px; font-size: 14px; line-height: 1.8; color: var(--text); flex: 1; }
.vparty__eff2 { margin-top: 8px; display: flex; align-items: center; gap: 12px; background: var(--b-t); border-radius: 14px; padding: 12px 14px; }
.vparty__eff2-ic { flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--b); display: flex; align-items: center; justify-content: center; }
.vparty__eff2 p { margin: 0; font-size: 15px; font-weight: 900; line-height: 1.55; color: var(--ink); }
.vparty__eff2 small { display: block; font-size: 11px; font-weight: 700; color: var(--b-d); }

/* 分業体制：入れ子のルート（グレー・白・グレー） */
.rt-area { position: relative; margin-right: 112px; }
.rt-r { position: relative; display: flex; align-items: center; gap: 8px; padding: 6px 8px; }
.rt-r p b { display: block; font-size: 11.5px; font-weight: 900; color: #0B1622; line-height: 1.3; }
.rt-r p small { font-size: 9.5px; color: #8A94A0; }
.rt-cols { position: absolute; top: 50%; transform: translateY(-50%); width: 112px; display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 10px; }
.rt-cols em { font-style: normal; font-size: 12px; font-weight: 900; color: #1E78D2; text-align: right; }
.rt-kids { position: relative; margin-left: 14px; padding-left: 16px; border-left: 1px dotted #B7C0CA; display: flex; flex-direction: column; gap: 6px; padding-bottom: 2px; }
.rt-g, .rt-w { border-radius: 6px; padding: 0 8px 0 0; }
.rt-g { background: #F3F4F6; }
.rt-w { background: #FFFFFF; }
.rt-g > .rt-kids, .rt-w > .rt-kids { margin-bottom: 8px; }
.rt-tree { background: #FFFFFF; }
.sx-l .sx-tag { margin-left: 0; font-size: 10px; font-weight: 700; color: #FFFFFF; }

/* 日程調整：タイトルを大きく */
.vbox--b > .vbox__title { font-size: clamp(21px, 2vw, 26px); }
.vbox--b > .vbox__title small { font-size: 14px; }
/* 調整パターン：図をやめてアイコンで装飾 */
.vpat--ic li { padding: 20px 18px 20px; position: relative; overflow: hidden; }
.vpat--ic li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--grad); }
.vpat--ic li.is-soon::before { background: var(--line-2); }
.vpat__head { display: flex; align-items: center; gap: 10px; }
.vpat__ic { flex: none; width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: var(--b-d); background: linear-gradient(120deg, rgba(var(--p-rgb),0.16), rgba(var(--b-rgb),0.12) 60%, rgba(var(--g-rgb),0.10)); }
.vpat--ic li.is-soon .vpat__ic { color: var(--muted); background: var(--surface); }
.vpat--ic .vpat__head b { font-size: 16px; line-height: 1.4; }
.vpat--ic p:not(.vpat__head) { margin-top: 10px; }
/* 三者：スマホでは横スクロールのカード */
@media (max-width: 760px) {
  .vparty-grid { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; scrollbar-width: none; margin-right: calc(clamp(20px, 4vw, 48px) * -1); padding-right: clamp(20px, 4vw, 48px); }
  .vparty-grid::-webkit-scrollbar { display: none; }
  .vparty-grid > .vparty { flex: 0 0 84%; scroll-snap-align: start; }
  .vparty__frame { height: 230px; }
}
/* 分業体制と 04 Experience の間の余白 */
#experience { padding-top: clamp(96px, 10vw, 160px); }
.vpat__soon { margin-left: 6px; font-style: normal; font-size: 11px; font-weight: 700; color: #FFFFFF; background: var(--ink); border-radius: 999px; padding: 1px 8px; vertical-align: 2px; white-space: nowrap; }
.vparty, .vparty__frame, .fitbox { min-width: 0; } .fitbox { overflow: hidden; }
@media (max-width: 760px) { .vparty__frame { height: 200px; } }
/* Value 03：調整パターンの上の線・流れとの区切り線をなくす */
.vpat--ic li::before { display: none; }
.vbox__sub { border-top: 0; padding-top: 0; margin-top: 36px; }

/* =========================================================
   04 Experience：コンパクトに（背景なし・1文・これまで→これから）
   ========================================================= */
#experience .h2 { margin-top: 18px; }
.xp-grid { margin-top: 32px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.xp { border: 1px solid var(--line-2); border-radius: 20px; padding: 18px 16px 16px; background: var(--white); display: flex; flex-direction: column; min-width: 0; }
.xp__head { display: flex; align-items: center; gap: 10px; }
.xp__ic { flex: none; width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.xp__ic svg { width: 20px; height: 20px; }
.xp--g .xp__ic { background: var(--g-t); } .xp--b .xp__ic { background: var(--b-t); } .xp--p .xp__ic { background: var(--p-t); }
.xp__role { font-size: 15px; font-weight: 900; line-height: 1.4; color: var(--ink); }
.xp__text { margin-top: 10px; font-size: 13px; line-height: 1.75; color: var(--sub); flex: 1; }
.xp__shift { margin-top: 12px; display: flex; flex-direction: column; align-items: stretch; }
.xp__before, .xp__after { margin: 0; border-radius: 10px; padding: 7px 10px; font-size: 12.5px; line-height: 1.5; }
.xp__before { background: var(--surface); color: var(--muted); }
.xp__after { font-size: 14.5px; font-weight: 900; color: var(--ink); }
.xp--g .xp__after { background: var(--g-t); } .xp--b .xp__after { background: var(--b-t); } .xp--p .xp__after { background: var(--p-t); }
.xp small { display: block; font-size: 10px; font-weight: 700; color: var(--muted); }
.xp--g .xp__after small { color: var(--g-d); } .xp--b .xp__after small { color: var(--b-d); } .xp--p .xp__after small { color: var(--p-d); }
.xp__arrow { align-self: center; margin: -4px 0; position: relative; z-index: 1; width: 22px; height: 22px; border-radius: 50%; background: var(--white); border: 1px solid var(--line-2); color: var(--sub); display: flex; align-items: center; justify-content: center; }
@media (max-width: 1180px) { .xp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .xp-grid { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; scrollbar-width: none; margin-right: calc(clamp(20px, 4vw, 48px) * -1); padding-right: clamp(20px, 4vw, 48px); }
  .xp-grid::-webkit-scrollbar { display: none; }
  .xp { flex: 0 0 72%; scroll-snap-align: start; }
}
#experience { padding-bottom: clamp(64px, 7vw, 100px); }

/* 応募者の操作：明るく淡い背景に */
section[aria-labelledby="apply-title"] .block--brand { background: linear-gradient(135deg, #EEF7FF 0%, #E9F6FB 50%, #EEF3FF 100%); color: var(--ink); }
section[aria-labelledby="apply-title"] .deco { opacity: 0.35; }
section[aria-labelledby="apply-title"] .sphere { display: none; }
section[aria-labelledby="apply-title"] .h2--white { color: var(--ink); }
section[aria-labelledby="apply-title"] .lead--white { color: var(--sub); }
section[aria-labelledby="apply-title"] .apply-step__num { color: var(--b-d); }
section[aria-labelledby="apply-title"] .apply-step__title { color: var(--ink); }
section[aria-labelledby="apply-title"] .apply-step__text { color: var(--sub); }
section[aria-labelledby="apply-title"] .phone { box-shadow: 0 30px 60px -34px rgba(11,22,34,0.45); }
@media (max-width: 760px) {
  section[aria-labelledby="apply-title"] .carousel .apply-step { background: rgba(255,255,255,0.75); border-color: rgba(255,255,255,0.95); }
  section[aria-labelledby="apply-title"] .carousel__dots span { background: rgba(11,22,34,0.18); }
  section[aria-labelledby="apply-title"] .carousel__dots span.is-on { background: var(--b-d); }
}

/* Value 03：見出し→流れ→調整パターンの間隔を広げる */
.vbox--b > .vflow { margin-top: 26px; }
.vbox--b > .vbox__sub { margin-top: 52px; }

/* 04 Experience：文字を少し小さく、矢印をAI機能と同じデザインに */
.xp__text { font-size: 12.5px; line-height: 1.75; }
.xp__before { font-size: 11.5px; }
.xp small { font-size: 9.5px; }
.xp__arrow { width: 28px; height: 28px; margin: -8px 0; border: 0; color: #FFFFFF; box-shadow: 0 0 0 4px var(--white); }
.xp__arrow svg { width: 14px; height: 14px; }
.xp--g .xp__arrow { background: var(--g-d); } .xp--b .xp__arrow { background: var(--b); } .xp--p .xp__arrow { background: var(--p-d); }
.xp__before { padding-bottom: 12px; } .xp__after { padding-top: 12px; }
/* 囲いなしの3案（bodyのclass xpd-1〜3） */
.xpd-1 .xp, .xpd-2 .xp, .xpd-3 .xp { border: 0; border-radius: 0; }
/* 案1：縦の区切り線で並べる */
.xpd-1 .xp-grid { gap: 0; }
.xpd-1 .xp { padding: 6px 20px 8px; }
.xpd-1 .xp + .xp { border-left: 1px solid var(--line); }
.xpd-1 .xp:first-child { padding-left: 0; } .xpd-1 .xp:last-child { padding-right: 0; }
/* 案2：淡いグレーの面で並べる */
.xpd-2 .xp { background: var(--surface); border-radius: 20px; padding: 20px 16px 16px; }
.xpd-2 .xp__ic { background: var(--white) !important; }
.xpd-2 .xp__before { background: var(--white); }
.xpd-2 .xp__arrow { box-shadow: 0 0 0 4px var(--surface); }
/* 案3：上に色の線＋白地 */
.xpd-3 .xp { padding: 18px 4px 4px; border-top: 3px solid var(--line-2); }
.xpd-3 .xp--g { border-top-color: var(--g); } .xpd-3 .xp--b { border-top-color: var(--b); } .xpd-3 .xp--p { border-top-color: var(--p); }
.xpd-3 .xp-grid { gap: 20px; }
@media (max-width: 1180px) { .xpd-1 .xp:nth-child(3n+1) { border-left: 0; padding-left: 0; } .xpd-1 .xp-grid { row-gap: 24px; } }
@media (max-width: 760px) {
  .xpd-1 .xp, .xpd-1 .xp:first-child, .xpd-1 .xp:nth-child(3n+1) { padding: 4px 16px 6px; border-left: 1px solid var(--line); }
  .xpd-1 .xp:first-child { border-left: 0; padding-left: 0; }
}

/* 応募者の操作：グラデーションをはっきり＋スマホはガラス風のカード */
section[aria-labelledby="apply-title"] .block--brand { background:
  radial-gradient(60% 70% at 8% 10%, rgba(var(--g-rgb),0.30), transparent 70%),
  radial-gradient(55% 65% at 95% 90%, rgba(var(--b-rgb),0.28), transparent 70%),
  radial-gradient(45% 55% at 80% 5%, rgba(var(--p-rgb),0.26), transparent 70%),
  linear-gradient(135deg, #EAF6FF 0%, #E8F0FF 50%, #E9FBF7 100%); }
@media (max-width: 760px) {
  section[aria-labelledby="apply-title"] .carousel .apply-step { background: rgba(255,255,255,0.38); border: 1px solid rgba(255,255,255,0.75); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); box-shadow: 0 18px 40px -24px rgba(11,22,34,0.35), inset 0 1px 0 rgba(255,255,255,0.8); }
}

/* 調整パターン：向いている運用を削除したので下の余白を調整 */
.vpat--ic li { padding-bottom: 22px; }
/* 06 Security：背景はグレーのみ */
#security .deco { display: none; }
#security .block--surface { background: var(--surface); }
/* 04 Experience：古い .xp p の指定に負けていた文字サイズ・余白を修正 */
.xp .xp__text { margin-top: 10px; font-size: 12.5px; line-height: 1.75; color: var(--sub); }
.xp .xp__before, .xp .xp__after { margin: 0; line-height: 1.5; }
.xp .xp__before { font-size: 11.5px; color: var(--muted); }
.xp .xp__after { font-size: 14px; font-weight: 900; color: var(--ink); }
/* 08 Flow：三角は箱と一体の形で描く（JSでclip-path） */
.flow-step:not(:last-child) { border-radius: 0; padding-right: calc(30px + 22px); }
.flow-step:not(:last-child)::after { display: none; }
.flow-steps { gap: 10px; }
@media (max-width: 960px) {
  .flow-steps { gap: 10px; }
  .flow-step:not(:last-child) { border-radius: 0; padding-right: 26px; padding-bottom: calc(30px + 22px); }
}

/* =========================================================
   全体調整（2026/10/28）
   ========================================================= */
/* 06 Security：スマホで体制カードの下にできていた余白を解消 */
@media (max-width: 520px) { .sec-cert__text { flex: none; } }

/* AIアシスタント：選考プロセスは矢印なし・線のみ */
.pflow__step::after, .vai .pflow__step:not(:last-child)::after, .duo-5 .pflow__step:not(:last-child)::after { display: none !important; }
/* 4つのAI機能の番号：グラデーションではなく単色の青 */
.aif__num { background: none; -webkit-background-clip: border-box; background-clip: border-box; color: var(--b); }
.aif__row.is-soon .aif__num { color: var(--muted); }

/* 小見出しの印：グラデーションをやめてシンプルに（bodyのclass hd-1〜3） */
.vsub::before, .vduo__title::before, .pflow--plain .vbox__title::before { background: var(--ink); }
/* 案1：濃紺の短い線 */
.hd-1 .vsub::before, .hd-1 .vduo__title::before, .hd-1 .pflow--plain .vbox__title::before { width: 18px; height: 3px; border-radius: 2px; background: var(--ink); }
/* 案2：青い小さな四角 */
.hd-2 .vsub::before, .hd-2 .vduo__title::before, .hd-2 .pflow--plain .vbox__title::before { width: 8px; height: 8px; border-radius: 2px; background: var(--b); }
/* 案3：縦の青い線 */
.hd-3 .vsub::before, .hd-3 .vduo__title::before, .hd-3 .pflow--plain .vbox__title::before { width: 4px; height: 1.1em; border-radius: 2px; background: var(--b); }

/* 07 Price：スマホでは2列のコンパクトなカード */
@media (max-width: 600px) {
  .plan-grid { margin-top: 28px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .plan { padding: 18px 14px 16px; border-radius: 20px; }
  .plan__en { font-size: 11px; }
  .plan__name { font-size: 15px; line-height: 1.4; }
  .plan__price { margin-top: 12px; }
  .plan__price b { font-size: 40px; }
  .plan__price span { font-size: 14px; }
  .plan__price small { font-size: 11px; }
  .plan__cap { margin-top: 12px; padding-top: 10px; font-size: 11px; }
  .plan__cap b { font-size: 15px; }
  .plan__rec { right: 10px; top: 10px; font-size: 10px; padding: 1px 8px; }
  .price-foot p { font-size: 13px; line-height: 1.8; }
}

/* 08 Flow：スマホでは縦幅を小さく */
@media (max-width: 960px) {
  .flow-step, .flow-step:first-child { padding: 18px 20px 20px; display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: baseline; }
  .flow-step:not(:last-child) { padding-bottom: calc(30px + 16px); }
  .flow-step__num { grid-row: span 2; font-size: 30px !important; line-height: 1; }
  .flow-step__title { margin-top: 0; font-size: 16px; }
  .flow-step__text { margin-top: 4px; font-size: 13px; line-height: 1.75; }
}

/* =========================================================
   最終調整（2026/10/28）
   ========================================================= */
/* 06 Security：スマホでは盾のアイコンを小さく */
@media (max-width: 760px) {
  .shield { margin-top: 24px; width: 120px; height: 120px; border-radius: 36px; }
  .shield__inner { width: 82px; height: 82px; border-radius: 24px; }
  .shield__inner > svg { width: 42px; height: 42px; }
  .shield__lock { right: -9px; top: -9px; width: 28px; height: 28px; }
  .shield__lock svg { width: 14px; height: 14px; }
}

/* Value 01〜03：それぞれ1つの色の系統にまとめる
   Value 01 AIアシスタント＝シアン系／Value 02 エージェント連携＝ミント系／Value 03 ワンアクション・分業体制＝ブルー系 */
#v-ai   { --vt: var(--p); --vt-d: var(--p-d); --vt-t: var(--p-t); --vt-rgb: var(--p-rgb); }
#v-pool { --vt: var(--g); --vt-d: var(--g-d); --vt-t: var(--g-t); --vt-rgb: var(--g-rgb); }
#v-flow { --vt: var(--b); --vt-d: var(--b-d); --vt-t: var(--b-t); --vt-rgb: var(--b-rgb); }
/* 見出しボックス：3色のグラデーションをやめ、その系統の淡い色だけに */
.vart .vhead.vband--p, .vart .vhead.vband--g, .vart .vhead.vband--b { background: linear-gradient(120deg, rgba(var(--vt-rgb),0.18), rgba(var(--vt-rgb),0.06)); }
/* Value 01 */
#v-ai .pflow__row::before { background: rgba(var(--vt-rgb),0.55); }
#v-ai .pflow__chip:not(.pflow__chip--human) { background: var(--vt-d); box-shadow: none; }
#v-ai .pflow__step.is-ai .pflow__node { border-color: var(--vt-d); box-shadow: 0 0 0 4px #FFFFFF, 0 0 0 6px rgba(var(--vt-rgb),0.45); }
#v-ai .pflow__step.is-ai .pflow__node svg path { stroke: var(--vt-d); }
#v-ai .vduo__left .vpoint__ic { background: var(--vt-t); }
#v-ai .vduo__left .vpoint__ic svg path { stroke: var(--vt-d); }
#v-ai .vper__who i { background: var(--vt-t); }
#v-ai .aif__num { color: var(--vt-d); }
#v-ai .bg-p, #v-ai .bg-b, #v-ai .bg-g { background: var(--vt-d); }
#v-ai .ailist__to { background: var(--vt-t); }
#v-ai .ailist__to small, #v-ai .ailist__scene, #v-ai .aif-head__label { color: var(--vt-d); }
#v-ai .ailist__scene { background: var(--vt-t); }
/* Value 02 */
#v-pool .aflow2__num { background: var(--vt-d); }
#v-pool .aflow2__step:not(:last-child)::before { background: rgba(var(--vt-rgb),0.6); }
#v-pool .exp2__tag { color: var(--vt-d); background: var(--vt-t); }
#v-pool .exp2__tag svg { stroke: var(--vt-d) !important; }
#v-pool .agt3__label, #v-pool .intake__src small { color: var(--vt-d); }
#v-pool .intake__db { border-color: var(--vt); }
/* Value 03 */
#v-flow .vpat__ic { color: var(--vt-d); background: var(--vt-t); }
#v-flow .vpat--ic li.is-soon .vpat__ic { color: var(--muted); background: var(--surface); }
#v-flow .vparty__who i { background: var(--vt-t); }
#v-flow .vparty__eff2-ic { background: var(--vt-d); }
#v-flow .vparty__eff2 small { color: var(--vt-d); }
#v-flow .voa li { border-top-color: var(--vt); }
.contact-card__hours { margin-top: -4px; padding-left: 28px; font-size: 12px; color: var(--dark-text); }

/* =========================================================
   最終調整2（2026/10/28）
   ========================================================= */
/* 小見出し：濃いグレー系（ページの濃紺になじむ少し青みのあるグレー） */
:root { --heading-sub: #2E3747; }
.vsub, .vduo__title, .pflow--plain .vbox__title, .vbox__title, .vbox__sub, .aif-head__label { color: var(--heading-sub); }
.hd-1 .vsub::before, .hd-1 .vduo__title::before, .hd-1 .pflow--plain .vbox__title::before { background: var(--heading-sub); }

/* Value 01：明るい水色に戻す */
#v-ai { --vt-d: #0AA6DA; --vt-txt: #0090C2; }
#v-ai .ailist__to small, #v-ai .ailist__scene, #v-ai .aif-head__label { color: var(--vt-txt); }
#v-ai .aif-head__label { color: var(--vt-txt); }
/* 選考プロセスのAIラベルは以前どおりグラデーション */
#v-ai .pflow__chip:not(.pflow__chip--human) { background: var(--grad); box-shadow: 0 12px 24px -12px rgba(var(--b-rgb),0.7); }
/* 導入すると、こう変わる：アイコンの背景は白 */
#v-ai .vper__who i { background: #FFFFFF; }

/* 選考プロセスのAIラベル：青の範囲を多めに */
#v-ai .pflow__chip:not(.pflow__chip--human) { background: linear-gradient(120deg, var(--g) 0%, var(--p) 18%, var(--b) 58%, var(--b) 100%); }
/* ワンアクション：案A（背景なし・線なし、大きな文字で「〜だけ」） */
#v-flow .oaA { margin-top: 20px; }
.oaA { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px clamp(24px, 3vw, 44px); }
.oaA__ic { color: var(--vt-d); display: flex; }
.oaA__task { margin-top: 14px; font-size: 13px; font-weight: 700; color: var(--muted); }
.oaA__after { margin-top: 4px; font-size: clamp(20px, 1.9vw, 24px); font-weight: 900; line-height: 1.45; color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; }
.oaA__before { margin-top: 10px; font-size: 12.5px; line-height: 1.7; color: var(--muted); }
@media (max-width: 960px) { .oaA { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .oaA { grid-template-columns: minmax(0, 1fr); gap: 24px; } }

/* =========================================================
   下層ページ（お問い合わせ・完了）：トップのテイストに合わせる
   ========================================================= */
.page-hero--wave { position: relative; overflow: hidden; background: #FFFFFF; padding: clamp(40px, 5vw, 72px) 0 clamp(80px, 8vw, 120px); }
.page-hero--wave > .container { position: relative; z-index: 2; }
.page-hero--wave .kv-flow { opacity: 0.55; }
.page-hero--wave .kv-flow svg { left: -10%; width: 120%; top: -5%; height: 170%; }
.page-hero--wave .kv-wave { z-index: 1; }
.page-body { position: relative; }
/* 見出しのアイコン：淡い色の角丸＋青い線 */
.info-title span { background: linear-gradient(120deg, rgba(var(--p-rgb),0.16), rgba(var(--b-rgb),0.12) 60%, rgba(var(--g-rgb),0.10)); }
.info-title span svg path, .info-title span svg { stroke: var(--b-d); }
.info-chip { background: #FFFFFF; border: 1px solid var(--line-2); }
.form-card { border: 1px solid rgba(255,255,255,0.9); box-shadow: 0 30px 60px -30px rgba(var(--b-rgb),0.35); }
.contact-box { border-top: 0; padding-top: 0; }
.contact-box p:first-child strong { display: block; margin-bottom: 4px; font-size: 15px; }
/* 完了ページ：このあとの流れ（トップのステップと同じ形） */
.done-mark span { background: var(--b); }
.next-steps { counter-reset: none; }
.next-step { background: #FFFFFF; border: 1px solid var(--line-2); border-radius: 20px; padding: 22px 22px 24px; }
.next-step__num { width: 32px; height: 32px; border-radius: 50%; background: var(--b); -webkit-background-clip: border-box; background-clip: border-box; color: #FFFFFF; font-size: 14px; display: flex; align-items: center; justify-content: center; }
.next-step__title { margin-top: 14px; }

/* MV：フォームの白枠の上端を「応募が増える。」の文字の高さにそろえる（枠の大きさは変えない） */
@media (min-width: 1190px) { .kv-new .kv-form { margin-top: calc(56px + clamp(34px, 3.9vw, 56px) * 0.12); } }
/* 02 Concept：案B（見出しと説明を横に並べ、図を小さく） */
.cpt-b #concept .block { padding-top: clamp(44px, 5vw, 72px); padding-bottom: clamp(44px, 5vw, 72px); }
.cpt-b .role-chip { padding: 12px 14px; gap: 10px; border-radius: 16px; }
.cpt-b .role-chip__icon { width: 36px; height: 36px; }
.cpt-b .role-chip__icon svg { width: 18px; height: 18px; }
.cpt-b .role-chip__name { font-size: 14px; }
.cpt-b .role-chip__desc { font-size: 11.5px; }
@media (min-width: 961px) {
  .cpt-b #concept .block__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: clamp(32px, 5vw, 72px); align-items: end; }
  .cpt-b #concept .sec-label { grid-column: 1 / -1; }
  .cpt-b #concept .concept__title { grid-column: 1; font-size: clamp(28px, 3vw, 42px); margin-top: 18px; }
  .cpt-b #concept .concept__lead { grid-column: 2; margin-top: 0; font-size: 14.5px; }
  .cpt-b #concept .hub { grid-column: 1 / -1; margin-top: 36px; gap: 10px 20px; }
  .cpt-b #concept .hub__core { width: min(100%, 260px); }
  .cpt-b #concept .hub__core-inner { gap: 12px; }
}

/* 02 Concept：スマホでは丸を小さく、役割は2列にして縦幅を抑える */
@media (max-width: 960px) {
  .cpt-b #concept .hub { margin-top: 28px; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "c c" "a d" "b e" "f g"; gap: 8px; }
  .cpt-b #concept .hub__core { width: min(100%, 190px); padding: 4px; }
  .cpt-b #concept .hub__core-inner { gap: 8px; padding: 12%; }
  .cpt-b #concept .hub__modules { gap: 4px; }
  .cpt-b #concept .hub__modules span { font-size: 9.5px; padding: 2px 7px; }
  .cpt-b #concept .role-chip { padding: 10px; gap: 8px; border-radius: 14px; }
  .cpt-b #concept .role-chip__icon { width: 30px; height: 30px; }
  .cpt-b #concept .role-chip__icon svg { width: 16px; height: 16px; }
  .cpt-b #concept .role-chip__name { font-size: 12.5px; line-height: 1.4; }
  .cpt-b #concept .role-chip__desc { display: none; }
  .cpt-b #concept .concept__lead { margin-top: 16px; font-size: 14px; }
}
/* MVの波：左右反転（左が青、右がミント） */
body.wave-r.palette-4 .kv-flow__a path { fill: url(#kfA4r); }
body.wave-r.palette-4 .kv-flow__b path { fill: url(#kfB4r); }

/* お問い合わせ：フォームはスクロールなしで全体を表示 */
.sf-embed iframe { display: block; height: var(--contact-form-height, 1100px); }
/* 完了ページ：このあとの流れ（グレーの面・番号・アイコン） */
.next-step { background: var(--surface); border: 0; padding: 24px 24px 26px; }
.next-step__head { display: flex; align-items: center; justify-content: space-between; }
.next-step__num { width: auto; height: auto; border-radius: 0; background: none; color: var(--b); font-size: 13px; font-weight: 700; letter-spacing: 0.04em; display: block; }
.next-step__num b { font-size: 26px; margin-left: 4px; }
.next-step__ic { width: 44px; height: 44px; border-radius: 12px; background: #FFFFFF; color: var(--b); display: flex; align-items: center; justify-content: center; }

/* =========================================================
   ヘッダー：ボタン名の変更・スマホ／タブレットのハンバーガーメニュー
   ========================================================= */
.nav-toggle { display: none; }
.sp-menu[hidden] { display: none; }
@media (max-width: 960px) {
  .site-header__inner { flex-wrap: nowrap; }
  .nav-toggle { display: inline-flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 46px; height: 46px; border: 1px solid var(--line-2); border-radius: 12px; background: var(--white); cursor: pointer; padding: 0; flex: none; }
  .nav-toggle span { display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--ink); transition: transform .2s, opacity .2s; }
  .nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .site-header__actions { margin-left: auto; }
  .sp-menu { position: fixed; left: 0; right: 0; top: var(--sp-menu-top, 74px); bottom: 0; z-index: 80; overflow-y: auto; background: var(--white); border-top: 1px solid var(--line); padding: 8px clamp(20px, 4vw, 48px) calc(32px + env(safe-area-inset-bottom, 0px)); }
  .sp-menu__list { display: flex; flex-direction: column; }
  .sp-menu__list a { display: flex; align-items: center; justify-content: space-between; min-height: 54px; border-bottom: 1px solid var(--line); font-size: 16px; font-weight: 700; color: var(--ink); text-decoration: none; }
  .sp-menu__list a::after { content: ""; width: 8px; height: 8px; border-top: 2px solid var(--muted); border-right: 2px solid var(--muted); transform: rotate(45deg); margin-right: 4px; }
  .sp-menu .btn { margin-top: 24px; }
  body.menu-open { overflow: hidden; }
  body.menu-open .sp-cta { display: none; }
}
@media (max-width: 760px) {
  .site-header__actions { display: none; }
  .nav-toggle { margin-left: auto; }
}
@media (prefers-reduced-motion: reduce) { .nav-toggle span { transition: none; } }

/* ハンバーガーメニュー：調整（枠線なし・半透明の背景・区切り線と矢印なし・4つの特徴は階層表示） */
@media (max-width: 960px) {
  .nav-toggle { border: 0; background: transparent; width: 44px; height: 44px; }
  .nav-toggle span { width: 22px; }
  .sp-menu { background: rgba(255,255,255,0.78); -webkit-backdrop-filter: blur(20px) saturate(140%); backdrop-filter: blur(20px) saturate(140%); border-top: 0; padding: 20px clamp(24px, 6vw, 48px) calc(40px + env(safe-area-inset-bottom, 0px)); }
  .sp-menu__list { gap: 4px; }
  .sp-menu__list > li > a { min-height: 0; padding: 12px 0; border-bottom: 0; font-size: 18px; font-weight: 700; color: var(--ink); }
  .sp-menu__list a::after { display: none; }
  .sp-menu__sub { margin: 0 0 6px; padding-left: 16px; display: flex; flex-direction: column; gap: 2px; border-left: 2px solid rgba(var(--b-rgb),0.18); }
  .sp-menu__sub a { display: block; min-height: 0; padding: 8px 0; border-bottom: 0; font-size: 15px; font-weight: 500; color: var(--sub); text-decoration: none; }
  .sp-menu .btn { margin-top: 28px; }
}

/* ==========================================================
   フッター（2段構成：上＝ロゴとメニュー／下＝運営会社とプライバシーポリシー）
   ========================================================== */
.site-footer.ft { padding: 44px 0 32px; }
.ft p { margin: 0; }
.ft a:focus-visible { outline: 2px solid var(--b); outline-offset: 4px; border-radius: 4px; }
.ft__top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 24px 48px; padding-bottom: 28px; border-bottom: 1px solid var(--line); }
.ft__brand img { display: block; height: 28px; width: auto; }
.ft__brand p { margin-top: 12px; font-size: 13px; color: var(--sub); }
.ft__nav ul { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 0; padding: 4px 0 0; font-size: 13px; }
.site-footer.ft .ft__nav a { color: var(--ink); font-weight: 500; text-decoration: none; }
.ft__nav a:hover, .ft__meta a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ft__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; padding-top: 22px; }
.ft__op { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.ft__label { font-size: 12px; font-weight: 700; color: var(--muted); letter-spacing: 0.06em; }
.ft__wj { display: inline-block; line-height: 0; transition: opacity 0.2s ease; }
.ft__wj:hover { opacity: 0.72; }
.ft__wj img { display: block; height: 15px; width: auto; }
.ft__name { font-size: 13.5px; font-weight: 700; color: var(--ink); }
.ft__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px; }
.ft__meta a { font-size: 13px; color: var(--sub); text-decoration: none; }
.ft__meta small { flex-basis: auto; font-family: var(--font-en); font-size: 12px; letter-spacing: 0.02em; color: var(--muted); }
@media (max-width: 760px) {
  .ft__top { flex-direction: column; }
  .ft__nav { width: 100%; }
  .ft__nav ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
  .ft__bottom, .ft__meta { flex-direction: column; align-items: flex-start; }
}
/* MVの「生成AI標準搭載の中途採用ATS」：スマホでは右上のRELEASEバッジと重ならないよう少し小さく */
@media (max-width: 520px) { .kv-c__eyebrow { font-size: 15px; padding-right: 100px; } }
@media (min-width: 521px) { .kv-c__eyebrow svg { width: 20px; height: 20px; } }