@charset "utf-8";



/* =========================================================
  マスタークリーニング 業務委託型FCパートナー募集LP
   ========================================================= */
:root {
  /* Colors */
  --color-white: #FFFFFF;
  --color-light-gray: #F5F5F5;
  --color-text: #0a2033;
  --color-text-sub: #5F6C72;
  --color-text-sub2: #444;
  --color-border: #E0E0E0;

  --color-btn-outline: #104b8f;

  --color-blue-lightest02: #f4fbff;
  --color-blue-lightest: #e8f6ff;
  --color-blue-light: #b1d8f1;
  --color-blue: #3b91d1;
  --color-blue-dark: #104b8f;
  --color-blue-deep:#091f51;

  --color-btn-outline: #104b8f;

  --color-green-lightest: #e6fffa;
  --color-green-light: #b3f5ec;
  --color-green: #20b8a6;
  --color-green-dark: #0b7062;
  --color-line: #06C755;
  --color-line-dark: #05A647;

  --color-orange-lightest: #fff3e6;
  --color-orange-light: #ffd9ae;
  --color-orange: #ff971a;
  --color-orange-dark: #d16200;

  --color-yellow-lightest: #fffcf0;
  --color-yellow-light: #ffedb5;
  --color-yellow: #ffc83d;
  --color-yellow-dark: #d29d00;
  --color-cta: #f6c945;

  --color-caution: #ed7a07;
  --color-caution-bg: #fffaf5;

  --gradient-brand: linear-gradient(120deg, var(--color-blue) 0%, var(--color-green) 100%);

  /* Type */
  --font-heading:"Noto Sans JP", sans-serif;
  --font-body: "Noto Sans JP", sans-serif;

  /* Layout */
  --max-width: 1200px;
  --header-height: 72px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-card: 0 4px 20px rgba(38, 50, 56, 0.08);
  --shadow-card-hover: 0 8px 28px rgba(38, 50, 56, 0.14);
}

/* Breakpoints: sm 600px / md 960px / lg 1280px（メディアクエリで直接指定） */

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: calc(var(--header-height) + 12px); }
body, h1, h2, h3, h4, p, ul, ol, figure, fieldset, legend { margin: 0; padding: 0; }
fieldset { border: 0; }
ul, ol { list-style: none; }
img, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; background: none; border: none; cursor: pointer; }
input, select, textarea { font: inherit; }
table { border-collapse: collapse; }

body {
  font-family: var(--font-body);
  color: var(--color-text);
  background: var(--color-white);
  font-size: 16px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}
@media (max-width: 799px){
body{
    min-width: 480px;
}
}
/* @media (min-width: 600px) { body { font-size: 17px; } } */

h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: 700; line-height: 1.4; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--color-accent-blue-dark);
  outline-offset: 2px;
}

.skip-link {
  position: absolute; left: -9999px; top: 0;
  background: var(--color-white); color: var(--color-text);
  padding: 12px 20px; z-index: 1000; border-radius: 0 0 8px 0;
}
.skip-link:focus { left: 0; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
.container { max-width: var(--max-width); margin: 0 auto; padding: 0 20px; }
.container-narrow { max-width: 1000px; }

@media (min-width: 800px) {
  .sp-only { display: none; }
  .pc-only {}
  a[href^="tel:"]{ pointer-events:none; }

}
@media (max-width: 799px) {
  .sp-only {}
  .pc-only { display: none;}
}
.arrow-down {position: relative;}
.arrow-down::after {
  content: "";position: absolute;left: 50%;transform: translateX(-50%);
  bottom: -12px;width: 40px;height: 20px;background: var(--color-blue);
  clip-path: polygon(0 0, 100% 0, 50% 100%);z-index: 2;
}
.arrow-down:last-child::after {
  display: none;
}
.arrow-right-line {position: relative;}
.arrow-right-line::after {
  content: ""; position: absolute;
  right: 4px;top: 50%;width: 8px;height: 8px;
  transform: translateY(-50%) rotate(45deg);
  border-top: 2px solid; border-right: 2px solid;color: var(--color-blue);}
.mark { display: inline-flex;background:linear-gradient(transparent 70%, var(--color-orange-light) 50%); padding: 0 6px;}
/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  flex-direction: column; 
  font-weight: 700; border-radius: 999px;
  padding: 14px 28px; min-height: 48px; min-width: 48px;
  text-align: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.btn-cta {
  background: var(--color-cta); color: var(--color-text);border: 1px solid var(--color-yellow);
  /* box-shadow: 0 6px 16px rgba(255, 112, 67, 0.35); */
}
.btn-cta:hover { color:var(--color-yellow-dark);background: var(--color-white); transform: translateY(-2px); ;}
.btn-outline {
  background: var(--color-white); color: var(--color-btn-outline);
  border: 2px solid var(--color-btn-outline);
}
.btn-outline:hover { background: var(--color-blue);color:var(--color-white); transform: translateY(-2px); }
.btn-outline[href^="https://lin.ee/"] {
  color: var(--color-line);
  border-color: var(--color-line);
}
.btn-outline[href^="https://lin.ee/"]:hover {
  background: var(--color-line);
  color: var(--color-white);
  border-color: var(--color-line);
}
.btn-large {  font-size: 1.05rem; line-height: 1.4;}
.btn-large .btn-sub { font-weight: 400; font-size:0.875rem; margin-top: 2px; opacity: 0.95; }
.btn-small { padding: 10px 20px; min-height: 40px; font-size: 0.875rem; }
/* ---------- Header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 500;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--color-border);
}
.header-inner {
  max-width: var(--max-width); margin: 0 auto;
  height: var(--header-height); padding: 0 20px;
  display: flex; align-items: center; gap: 18px;
}
.logo {
  display: flex; align-items: center; gap: 8px;
  font-weight: 800; font-family: var(--font-heading);
  font-size: 1.05rem; margin-right: auto; white-space: nowrap;
}
.main-nav ul { display: flex; gap: 18px; }
.main-nav a { font-size: 0.875rem; font-weight: 500; white-space: nowrap; }
.main-nav a:hover { color: var(--color-blue); }
.header-cta { font-size: 0.875rem; padding: 10px 18px; min-height: 40px; white-space: nowrap; }

.hamburger {
  display: none; flex-direction: column; justify-content: center;
  align-items: center; gap: 5px; width: 44px; height: 44px;  position: relative;
  z-index: 700;
}
.hamburger span {
  display: block; width: 24px; height: 2px; background: var(--color-text);
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.mobile-nav { position: fixed;inset: 0;  z-index: 600; height: 100dvh;
  border-top: 1px solid var(--color-border); background: var(--color-white);}
.mobile-nav ul { padding: 12px 20px 20px; padding: 40px 40px 20px;display: flex; flex-direction: column; gap: 20px; }
.mobile-nav a { font-weight: 500; display: block;}
.mobile-nav ul li { border-bottom: solid 1px var(--color-blue-light);padding-bottom: 10px;}
.mobile-nav-logo .logo{
  display: flex;justify-content: center;align-items: center;gap: 8px;
  font-weight: 800;font-size: 1.05rem;padding-top: 60px;
}
.mobile-cta{
    display: flex;flex-direction: column;gap: 14px;align-items: stretch;
    width: 70%; margin: auto;
}
.mobile-cta .btn-sub{display: block;}
/* PC */
.main-nav,
.header-cta {
  display: flex;
}
.hamburger {
  display: none;
}
/* SP */
@media (max-width: 799px) {
  .main-nav,
  .header-cta {
    display: none;
  }
  .hamburger {
    display: flex;
  }
}
/* ---------- Hero ---------- */
.hero {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 600px;
  overflow: hidden;
  background: var(--color-blue);
  background-image: linear-gradient(90deg, var(--color-blue), var(--color-white));
}
.hero .container {
  position: relative;
  max-width: var(--max-width);
  height: 100%;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}
.hero-mv {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  mask-image: linear-gradient(
    90deg, transparent 0%, #000 20%, #000 80%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 20%, #000 80%, transparent 100%);
}
.hero-mv img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-heading{
  background: var(--color-blue);color: var(--color-white);text-align: center;padding: 2px 0; font-weight: 700;
}
.hero-title {
  position: absolute;
  top: 3%;
  left: 7%;
  width: 550px;
}
.hero-txtwrap {
  position: absolute;
  top: 25%;
  left: 7%;
  width: 80%;
}

.hero-txtbox {
width: 100%;
  max-width: 400px;
}

.hero-txtbox img {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}
.hero-cta {
  display: flex;
  gap: 14px;
  margin-top: 20px;
}
.hero-cta .btn {
  width: 100%;
  max-width: 340px;
}
@media (max-width: 799px) {

  .hero {
    height: 830px; background-position: 60%;
    background: var(--color-blue);
  }
    .hero-mv {
    mask-image: linear-gradient( 180deg, #000 0%, #000 40%, transparent 100%);
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 40%, transparent 100%);
  }
  .hero-title {
    position: absolute;
    top: 2%;
    left: 50%;
    width: 90%;
    transform: translateX(-50%);
    max-width: 500px;
  }
  .hero-txtwrap {
    top: 21%; left: 5%;
  }
.hero-txtbox{
    width: 73%;
}
  .hero-cta {
    flex-direction: column; margin-top: 20px;
  }
  .hero-cta .btn {
  white-space: nowrap;
}
}
.scroll-cue {
  position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 1;
  width: 30px; height: 46px; border: 2px solid rgba(255,255,255,0.7); border-radius: 999px;
}
.scroll-cue span {
  position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
  width: 4px; height: 8px; background: var(--color-white); border-radius: 2px;
  animation: scrollcue 1.6s infinite;
}
@keyframes scrollcue {
  0% { opacity: 1; top: 8px; }
  100% { opacity: 0; top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-cue span { animation: none; }
  html { scroll-behavior: auto; }
}

/* ---------- Highlight strip ---------- */
.highlight-strip { background: var(--color-blue-dark); padding: 22px 0; }
.highlight-list {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 12px;
}
.highlight-list li {
  color: var(--color-white); font-size: 0.875rem; font-weight: 700;
  background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.3);
  border-radius: 999px; padding: 6px 16px;
}
@media (max-width: 799px) {
.highlight-list li {
    padding: 6px 12px;gap: 10px 12px;
}
}
/* ---------- Sections ---------- */
.section { padding: 84px 0; }
/* .section-alt { background: var(--color-blue-lightest); } */
section:not(.hero):nth-of-type(odd) {
  background: var(--color-blue-lightest);
}
section:not(.hero):nth-of-type(odd).section-white {
  background: #fff;
}
section.section-gray {
  background: var(--color-light-gray);
}
.chapter-label {
  text-align: center; font-size:1.125rem; font-weight: 700; letter-spacing: 0.08em;
  color: var(--color-blue-dark); margin-bottom: 32px;
}
.chapter-label-en {
  color: var(--color-blue);
  font-size: 0.8125rem;
  letter-spacing: 0.15em;
  font-weight: 700;
  display: block;
}
.section-title { font-size: clamp(1.6rem, 3.2vw, 2.1rem); text-align: center; margin-bottom: 16px; }
.section-title:not(:has(+ .section-lead)) { margin-bottom: 44px;}
.section-lead {
  text-align: center; 
  max-width: 800px; margin: 0 auto 44px;
}
.sub-title { font-size: 1.25rem; text-align: center; margin: 56px 0 24px; }
/* ---------- Grids & Cards ---------- */
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px;}
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px;}
@media (max-width: 799px) {
  .grid-3 ,.grid-4 {
    grid-template-columns: 1fr;
  }
}
.card {
  background: var(--color-white); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); padding: 28px;
}
.card-flush{
  background: var(--color-white);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}
/* ---------- Lists ---------- */
.check-list li, .cross-list li, .caution-list li {
  position: relative; padding-left: 32px; margin-bottom: 14px; line-height: 1.7;
}
.check-list li::before {
  content: "\2713"; position: absolute; left: 0; top: 2px;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--gradient-brand); color: var(--color-white); font-size: 0.875rem;
  display: flex; align-items: center; justify-content: center;
}
.cross-list li::before {
  content: "×"; position: absolute; left: 0; top: 2px;
  width: 22px; height: 22px; border-radius: 50%;
  background: #B0BEC5; color: var(--color-white); font-size: 0.8rem;
  display: flex; align-items: center; justify-content: center;
}
.check-list li, .caution-list li{ font-size: 1.125rem;}
.caution-list li::before {
  content: "!"; position: absolute; left: 0; top: 2px;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--color-yellow); color: var(--color-text);
  font-size: 0.78rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.plain-list li { margin-bottom: 10px; padding-left: 18px; position: relative; }
.plain-list li::before {
  content: ""; position: absolute; left: 0; top: 12px;
  width: 6px; height: 6px; border-radius: 50%; background: var(--color-blue);
}

/* ---------- 業務委託型FCとは ---------- */
.about-card { margin-bottom: 32px; }
.card.about-card{
  background: none;box-shadow:none; text-align: center;
} 
.about-card p + p { 
  /* margin-top: 14px;  */
}
.about-card strong { color: var(--color-accent-green-dark); }

.contrast-grid {  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px;}
@media (max-width: 799px) {
  .contrast-grid {
    grid-template-columns: 1fr;
  }
}
.contrast-box { border-radius: var(--radius-md); overflow: hidden; background: var(--color-white);}
.contrast-box h3 { font-size: 1.25rem; text-align: center; padding: 14px 0;}
.contrast-no { color: var(--color-text-sub); 
  /* border: 1px solid var(--color-blue); */
}
.contrast-yes {
  border: 1px solid var(--color-blue); box-shadow: var(--shadow-card);
}
.contrast-no h3 { background: var(--color-text-sub); color: var(--color-white);}
.contrast-yes h3 { background: var(--gradient-brand); color: var(--color-white);font-size: 1.375rem;}
.contrast-box ul{
  padding: 24px;
}
/* ---------- Stats ---------- */
.stat-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.stat-card {
  background: var(--color-white); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); padding: 28px 24px; text-align: center;
}
.stat-value { font-weight: 800;font-size: 2.5rem; color: var(--color-blue); line-height: 1.3;
}
.stat-unit { font-size: 1rem; margin-left: 2px; }
.stat-label { font-size: 1rem; font-weight: 700; margin: 10px 0 12px; line-height: 1.6;}
.stat-source { font-size: 0.875rem; line-height: 1.6; }
@media (max-width: 799px) {
  .stat-row {
    grid-template-columns: 1fr;
  }
}
/* ---------- Mechanism ---------- */
.mechanism { max-width: 1000px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
.mech-step {
  display: grid;grid-template-columns: 100px 60px 1fr;
  align-items: center; gap: 16px;background: var(--color-white); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); padding: 28px 24px;border: 1px solid var(--color-blue);
}
.mech-hq { background: var(--color-blue-lightest02); }
/* .mech-partner { background: var(--color-blue-lightest);} */
.mech-lane {
  font-size: 0.875rem; font-weight: 700; text-align: center;
  border-radius: 8px; padding:10px 8px;
}
.mech-hq .mech-lane { background: var(--color-blue); color: var(--color-white); }
.mech-partner .mech-lane { background: var(--color-green); color: var(--color-white); }
.mech-body h3 { font-size: 1.25rem; margin-bottom: 6px; }
.mech-num {
  display: inline-block; font-size: 0.8rem; color: var(--color-blue);
  margin-right: 8px; letter-spacing: 0.04em;  border-bottom: 1px solid var(--color-blue); padding: 2px;}
.mech-body p { font-size: 1rem; }
@media (max-width: 799px) {
  .mechanism { gap: 24px; }
  .mech-step { grid-template-columns: 78px 1fr; grid-template-areas: "lane body" "icon body"; 
    gap: 10px 16px; padding: 24px 18px;
  }
  .mech-lane { grid-area: lane; padding:4px;
    /* justify-self: start;  */
  }
  .mech-icon { grid-area: icon; width: 78px; height: 78px; }
  .mech-body { grid-area: body; }
  .mech-num { display: block;width: fit-content;margin-bottom: 4px;}
} 

/* ---------- Task cards ---------- */
.task-card { text-align: center; padding: 0;overflow: hidden;}
.task-img {width: 100%;aspect-ratio: 4 / 3;object-fit: cover;}
.task-img img { width: 100%; height: 100%; object-fit: cover;}
.task-card h3 { font-size: 1.125rem; margin-bottom: 8px; }
.task-card p { font-size: 1rem; text-align: left;}
.service-card-content{padding: 20px;}
/* ---------- Timeline (1日の流れ) ---------- */
.timeline { max-width: 800px; margin: 0 auto; position: relative; }
.timeline::before {
  content: ""; position: absolute; left: 130px; top: 14px; bottom: 14px;
  width: 2px; background: var(--color-blue-lightest02);
}
.tl-item { position: relative; display: flex; gap: 24px; padding-bottom: 24px; }
.tl-item:last-child { padding-bottom: 0; }
.tl-time {
  flex: 0 0 120px; display: flex;justify-content: center;align-items: center;font-weight: 700; font-size: 0.875rem;
  color: var(--color-accent-blue-dark); text-align: center; padding-top: 2px;background: var(--color-blue-light);
    border-radius: var(--radius-md);
}
.tl-body {
  position: relative; z-index: 1; flex: 1; min-width: 0;
  background: var(--color-white); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); padding: 18px 22px;
}
.tl-body h4 { font-size: 1.125rem; margin-bottom: 6px; }
.tl-body p {  color: var(--color-text-sub); }
@media (max-width: 799px) {
  .timeline::before { display: none; }
  .tl-item { flex-direction: column; gap: 6px; }
  .tl-time { text-align: left; flex-basis: auto; }
  .tl-time {  padding: 4px 0; border-radius: var(--radius-md) var(--radius-md) 0 0;}
.tl-body { border-radius:0 0 var(--radius-md) var(--radius-md);}
}
/* ---------- Vehicle ---------- */
.vehicle-card { display: flex; gap: 24px; align-items: flex-start; }
.vehicle-card p + p { margin-top: 12px; }
.vehicle-card strong { color: var(--color-blue); }

/* ---------- Tables ---------- */
.table-wrap { overflow-x: auto; margin: 0 auto; max-width: 900px; }
.spec-table, .cost-table, .sim-table { width: 100%; min-width: 520px; border-collapse: collapse; border-spacing: 0;}
.spec-table th, .spec-table td,
.cost-table th, .cost-table td,
.sim-table th, .sim-table td {
  border: 1px solid var(--color-blue-dark); padding: 13px 16px;
  text-align: left; font-size: 1.125rem; vertical-align: top;
  line-height:1.6;
}
.sim-table tbody th {
  background: #FFFFFF; font-weight: 700;
  color: var(--color-accent-green-dark); 
}
.spec-table th {
background: var(--color-blue); font-weight: 700; color: #FFFFFF;
}
.cost-table tr > :not(:last-child){
	white-space:nowrap;
}
.cost-table tbody th,
.cost-table tbody td,
.sim-table tbody th,
.sim-table tbody td {
  border-top: none;
  background: #FFFFFF;
}
.cost-table thead th, .sim-table thead th {
  background: var(--color-blue); font-weight: 700; color: #FFFFFF;
}
.spec-table td{
background: #FFFFFF;
}
.cost-free { color: var(--color-accent-green-dark); font-weight: 700; }
.cost-self { color: var(--color-caution); font-weight: 700; }
.cost-tbd, .tbd-cell { color: var(--color-text-sub); }
.sim-table .sim-value { font-weight: 800; color: var(--color-orange); white-space: nowrap;font-size: 1.375rem; }
.cost-table tbody tr:nth-child(even) th,.cost-table tbody tr:nth-child(even) td {
  background-color:var(--color-blue-lightest02);
}
#cost .section-title{line-height: 1.2;}
.costtitle{
  font-size: 2rem;
  background: var(--color-blue);
  color: var(--color-white);
  padding: 0px 8px;
  border-radius: 4px;
}
.costtitle-num{
  font-size: 5rem; vertical-align: sub; color: var(--color-blue); padding-left: 10px;}
@media (max-width: 799px) {
  .spec-table, .cost-table, .sim-table { min-width: 720px;}
  .spec-table th, .spec-table td,
  .cost-table th, .cost-table td,
  .sim-table th, .sim-table td {font-size: 1rem; padding: 10px 10px;}
.spec-table th { white-space: nowrap;}
}
.peak-box {
  max-width: 900px; margin: 32px auto 0;
  background: var(--color-white); 
  border-radius: var(--radius-lg); padding: 20px;
}
.peak-title {
  font-weight: 800;
  color: var(--color-orange); margin-bottom: 12px;
}
.peak-box p { line-height: 1.9; }
.peak-box strong { color: var(--color-orange); }
.peak-days {display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0;
}
.peak-days li {
  font-family: var(--font-heading); font-weight: 800; font-size: 0.95rem;
  color: var(--color-white); background: var(--color-orange);
  border-radius: 8px; padding: 8px 18px;
}
.peak-note { color: var(--color-text-sub); }
/* ---------- Formula ---------- */
.formula {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 22px 14px; max-width: 820px; margin: 0 auto 50px;
}
.formula-item {
  background: var(--color-white); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); padding: 14px 22px; text-align: center;
}
.formula-result { border: 2px solid var(--color-orange); }
.formula-label { font-size: 0.78rem; color: var(--color-text-sub); margin-bottom: 4px; }
.formula-value { font-family: var(--font-heading); font-weight: 800; font-size: 2rem;
  color: var(--color-accent-green-dark); line-height: 1.2;
}
.formula-result .formula-value { color: var(--color-orange); }
.formula-value span { font-size: 0.9rem; margin-left: 2px; }
.formula-op { font-size: 1.4rem; font-weight: 700; color: var(--color-text-sub); }
@media (max-width: 799px) {
  .formula { gap: 20px 10px;}
  .formula-item{padding: 14px 18px; }
}
.bonus-box {
  position: relative;  max-width: 820px; margin: 24px auto 0;
  background: var(--color-blue-lightest02); border: 1px dashed var(--color-blue);
  border-radius: var(--radius-md); padding:30px 22px 26px; text-align: center;
}
.bonus-title { font-weight: 700;margin-bottom: 8px;font-size:1.25rem ; }
.additional-em{
  display: block;
}
.additional-em {
  position: absolute; top: -25px; left: 50%; transform: translateX(-50%); display: flex;
  justify-content: center; align-items: center; color: #333333; font-size: 1.75rem;
  font-weight: 800; background: linear-gradient(to bottom, var(--color-white) 50%, var(--color-blue-lightest02) 50%);;
}
.additional-em::before,
.additional-em::after { width: 3px; height: 30px; background-color: #2589d0; content: '';}
.additional-em::before { transform: rotate(-35deg);margin-right: 15px;}
.additional-em::after {transform: rotate(35deg);margin-left:2px;}

.bonus-value { font-family: var(--font-heading); font-size: 1.25rem; font-weight: 700; }
.bonus-value strong { font-size: 1.55rem; color: var(--color-accent-green-dark); }
.bonus-value .bonus-value-em{ background: var(--color-blue); padding: 0 8px;color: var(--color-white);margin: 0 2px;
border-radius: 4px;}
.bonus-note { font-size: 0.78rem; color: var(--color-text-sub); margin-top: 8px; }

/* ---------- Notice box ---------- */
.notice-box {
  max-width: 900px; margin: 28px auto 0;
  background: var(--color-caution-bg); border: 1px solid rgba(178, 101, 0, 0.3);
  border-radius: var(--radius-md); padding: 22px 26px;
}
.notice-box p { font-size: 0.9rem; line-height: 1.8; }
.notice-box strong { color: var(--color-caution); }
.notice-link { margin-top: 10px; }
.notice-link a { color: var(--color-caution); font-weight: 700; text-decoration: underline; }

/* ---------- Support ---------- */
.support-card { text-align: center; padding: 0; overflow: hidden;}
.support-icon { width: 160px;height: 160px;margin: 0 auto 40px; }
.support-img{    width: 100%; aspect-ratio: 4 / 3; object-fit: cover;}
.support-img img { width: 100%; height: 100%; object-fit: cover;}
.support-card-content{ padding: 20px;}
.support-card h3 {font-size: 1.25rem; margin-bottom: 16px; }
.support-card .plain-list { text-align: left; }
.support-badge{    display: inline-block; margin-top: 14px; font-size: 0.9375rem; 
  font-weight: 700; color: var(--color-green-dark);background: var(--color-green-lightest);
  border-radius: var(--radius-md);padding: 5px 14px;}

  /* ---------- rate-steps ---------- */
.rate-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  max-width: 1000px; margin: 48px auto 0; padding: 0; list-style: none;
}
.rate-step {
  position: relative; min-width: 0; padding: 24px 18px 28px 32px;
}
/* ---------- 各ステップの背景色 ---------- */
.rate-step:nth-child(1) { background: var(--color-blue-lightest02);}
.rate-step:nth-child(2) { background: var(--color-blue-lightest);}
.rate-step:nth-child(3) { background: var(--color-blue-light);}
.rate-step:nth-child(4) { background: var(--color-blue-dark); color: #fff;}

/* ---------- PC：右向き三角 ---------- */
.rate-step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -20px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 55px solid transparent;
  border-bottom: 55px solid transparent;
  z-index: 2;
}
/* 三角の色を各ステップに合わせる */
.rate-step:nth-child(1)::after { border-left: 22px solid var(--color-blue-lightest02);}
.rate-step:nth-child(2)::after { border-left: 22px solid var(--color-blue-lightest);}
.rate-step:nth-child(3)::after { border-left: 22px solid var(--color-blue-light);}

/* ---------- 期間 ---------- */
.rate-period {
  margin: 0 0 14px; padding: 4px 0; font-size: 14px; line-height: 1.6;
  font-weight: 700; color: var(--color-blue); text-align: center;
  background: #fff; border-radius: 8px;}

/* ---------- 報酬率 ---------- */
.rate-value { display: flex; align-items: baseline; justify-content: center;
  margin: 0 0 18px; color: var(--color-blue); line-height: 1;}
.rate-num { font-size: 4rem; font-weight: 800; letter-spacing: -0.04em;}
.rate-unit { margin-left: 3px; font-size: 1.75rem; font-weight: 700;}

/* ---------- 説明 ---------- */
.rate-desc { margin: 0; font-size: 0.875rem;}

/* ---------- 最終ステップ ---------- */
.rate-step-goal {
  background: #104b8f; color: var(--color-white);}
.rate-step-goal .rate-value,
.rate-step-goal .rate-desc { color: var(--color-white);}
/* ==================================================
  スマホ
================================================== */
@media (max-width: 799px) {
  .rate-steps { display: flex;flex-direction: column;gap: 0; margin-top: 32px; padding: 0 16px;}
  .rate-step { width: 100%; box-sizing: border-box; padding: 45px 24px 20px; text-align: center;}
  .rate-step:nth-child(1) { padding-top: 26px;}

  /* ---------- 下向き三角 ---------- */
  .rate-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: auto;
    right: 50%;
    bottom: -25px;
    transform: translateX(50%);
    width: 0;
    height: 0;
    border-top: 30px solid;
    border-right: 80px solid transparent;
    border-left: 80px solid transparent;
    border-bottom: 0; z-index: 2;
  }
  .rate-step:nth-child(1)::after {border-top-color: var(--color-blue-lightest02);}
  .rate-step:nth-child(2)::after { border-top-color: var(--color-blue-lightest);}
  .rate-step:nth-child(3)::after { border-top-color: var(--color-blue-light);}
  /* ---------- 期間 ---------- */
  .rate-period {margin-bottom: 10px;font-size: 0.875rem;}
  /* ---------- 報酬率 ---------- */
  .rate-num {font-size: 44px;}
  .rate-step-goal .rate-num {font-size: 50px;}
  .rate-unit {font-size: 20px;}
  .rate-value { margin-bottom: 14px;}
  /* ---------- 説明 ---------- */
  .rate-desc { font-size: 0.875rem;line-height: 1.75;}
}
/* ---------- Pull quote ---------- */
.pullquote {
  max-width: 820px; margin: 36px auto 0;
  background: var(--color-green-lightest); border-left: 4px solid var(--color-green);
  padding: 24px 28px;
}
.pullquote p { font-size: 0.95rem; line-height: 1.9; }
.pullquote footer { margin-top: 10px; font-size: 0.8rem; color: var(--color-text-sub); }
.roadmap-content-feature { border: 2px solid var(--color-accent-green); }
.roadmap-highlight {
  margin-top: 16px; background: var(--color-blue-lightest02);
  border-radius: var(--radius-md); padding: 16px 18px;
}
.roadmap-highlight-label {
  font-weight: 700; letter-spacing: 0.04em;
  color: var(--color-accent-green-dark); margin-bottom: 6px;
}
.roadmap-highlight-value { line-height: 1.8; }
.roadmap-highlight-value strong {
  font-family: var(--font-heading); font-size: 1.5rem; font-weight: 800;
  color: var(--color-orange); margin: 0 4px;
}
.roadmap-highlight-note { font-size: 0.76rem; color: var(--color-text-sub); margin-top: 6px; }

/* ---------- Roadmap (キャリアステップ) ---------- */
.roadmap { position: relative; display: flex; flex-direction: column; gap: 32px; }
.roadmap::before {
  content: ""; position: absolute; left: 27px; top: 28px; bottom: 28px;
  width: 2px; background: var(--color-white);
}
.roadmap-item { position: relative; z-index: 1; display: flex; gap: 20px; align-items: flex-start; }
.roadmap-marker {
  flex: 0 0 56px; width: 56px; height: 56px; border-radius: 50%;
  background: var(--color-white); box-shadow: var(--shadow-card);
  display: flex; align-items: center; justify-content: center;
}
.roadmap-content {
  flex: 1; min-width: 0; background: var(--color-white);
  border-radius: var(--radius-md); box-shadow: var(--shadow-card); padding: 22px 24px;
}
.roadmap-period {
  display: inline-block; font-size:0.875rem; font-weight: 700;
  color: var(--color-white); background: var(--color-blue);
  padding: 4px 14px; border-radius: 8px; margin-bottom: 8px; letter-spacing: 0.05em;
}
.roadmap-content h3 { font-size: 1.25rem; margin-bottom: 6px; }
.roadmap-desc { font-size: 1rem; }

/* ---------- 案件実績（営業不要の根拠） ---------- */
.section-track {
  background:
    radial-gradient(circle at 12% 0%, rgba(79, 195, 247, 0.16) 0%, transparent 45%),
    linear-gradient(140deg, #b9e2f8 0%, #bfe9ff 58%, #b9e2f8 100%);
}

.section-track .section-lead { color: var(--color-text); }
.section-track .disclaimer { color: var(--color-text-sub2); filter: drop-shadow(2px 2px 6px #fff); }

.track-grid { display: grid; gap: 20px; max-width: 1060px; margin: 0 auto;grid-template-columns: repeat(3, minmax(0, 1fr)); }
.track-basis { text-align: center; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em;
  color: var(--color-text-sub); margin: -28px 0 24px;
}
@media (max-width: 799px) { .track-grid { grid-template-columns: 1fr; } } 
.track-card {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--radius-lg); padding: 30px 24px; text-align: center;
  backdrop-filter: blur(2px);
}
.track-card-main { background: rgba(255, 255, 255, 0.8); border-color: rgba(16, 75, 143, 0.5); }
.track-label {
  font-size: 1.25rem; font-weight: 700; letter-spacing: 0.03em;
  color: var(--color-blue-dark); margin-bottom: 10px;
}
.track-value {
  font-family: var(--font-heading); font-weight: 800; line-height: 1;
  display: flex; align-items: baseline; justify-content: center; gap: 2px;
  margin-bottom: 14px;
}
.track-num { font-size: clamp(3rem, 8vw, 4.4rem); letter-spacing: -0.02em; }
.track-card-main .track-num { color: var(--color-yellow); }
.track-plus { font-size: clamp(1.6rem, 4vw, 2.2rem); color: var(--color-yellow); }
.track-unit { font-size: clamp(0.95rem, 2vw, 1.15rem); font-weight: 700; }
.track-desc { font-size: 0.875rem; line-height: 1.8; color: var(--color-text); }

.track-conclusion {
  max-width: 900px; margin: 32px auto 0;
  color: var(--color-text);
  padding: 28px 30px; text-align: center;
}

.track-conclusion p { font-size: 1rem; line-height: 1.9; }
.track-conclusion .track-conclusion-title {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(1.25rem, 3vw, 1.5rem);
  color: var(--color-accent-green-dark); margin-bottom: 12px;
}
.track-conclusion strong { color: var(--color-blue-dark); font-size: clamp(1.125rem, 2.6vw, 1.375rem);

}
.section-track .review-note { background: rgba(255, 243, 224, 0.94); }
@media (max-width: 799px) { 
.track-card {
    padding: 20px 24px;
}
} 

/* ---------- 初期費用0円の理由 ---------- */
.reason-grid { margin-bottom: 40px; }
.reason-card {padding: 28px; }
.reason-wrap{ border: 1px solid var(--color-blue); overflow: hidden;}
.reason-num {
  display: block; font-weight: 800; padding: 10px 0;text-align: center;
  font-size:0.875rem; letter-spacing: 0.08em;color: var(--color-white);
  background: var(--color-blue); margin-bottom: 12px;
}
.reason-icon { width: 140px; height: 140px;margin:0 auto 20px;}
.reason-card h3 { font-size: 1.25rem; margin-bottom: 12px; }
.reason-card p { font-size: 1rem; color: var(--color-text); text-align: left;}
.reason-media { max-width: 900px; margin: 0 auto; }
.notice-box-tight { margin-top: 32px; }

/* ---------- Photo slots（撮影素材の差し込み枠） ----------
   assets/img/ に指定ファイル名の画像を置くと、JS が読み込み成功を検知して
   .is-loaded を付与し、プレースホルダーが自動で写真に切り替わります。 */
.photo-slot {
  position: relative; margin: 0;
  border-radius: var(--radius-md); overflow: hidden;
  background: var(--color-white); box-shadow: var(--shadow-card);
}
.photo-slot img { width: 100%; height: 100%; object-fit: cover; display: none; }
.photo-slot.is-loaded img { display: block; }
.photo-slot.is-loaded .photo-pending { display: none; }

.hero-photo img { display: none; }
.hero-photo.is-loaded img { display: block;    position: relative; z-index: 5; }
.hero-photo.is-loaded .photo-pending-hero { display: none; }
.photo-pending-hero {
  position: absolute; inset: 0; z-index: 0;
  aspect-ratio: auto;
  background: repeating-linear-gradient(-45deg, rgba(255,255,255,0.06) 0 14px, rgba(255,255,255,0.02) 14px 28px);
  border-bottom: 0;
}
.photo-pending-hero .photo-pending-title,
.photo-pending-hero .photo-pending-desc { color: rgba(255,255,255,0.72); }
.photo-pending-hero code {
  font-size: 0.76rem; background: rgba(255,255,255,0.14);
  border-radius: 4px; padding: 1px 6px;
}
.photo-slot figcaption {
  font-size: 0.875rem; color: var(--color-text-sub);
  padding: 12px 16px; line-height: 1.6; background: var(--color-white);
}
.photo-pending {
  aspect-ratio: 4 / 3;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; padding: 24px 20px; text-align: center;
  background:
    repeating-linear-gradient(-45deg, #ECEFF1 0 12px, #E4E8EA 12px 24px);
  border-bottom: 1px solid var(--color-border);
}
.photo-slot-wide .photo-pending { aspect-ratio: 16 / 9; }
.photo-slot-tall .photo-pending { aspect-ratio: 1 / 1; }
.photo-pending-badge {font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em;
  color: var(--color-white); background: var(--color-blue-dark);
  border-radius: 999px; padding: 3px 12px;
}
.photo-pending-title {font-family: var(--font-heading); font-weight: 700;
  font-size: 0.95rem; color: var(--color-text-sub);
}
.photo-pending-desc { font-size: 0.78rem; color: var(--color-text-sub); line-height: 1.6; }
.photo-pending-dark { background: repeating-linear-gradient(-45deg, #E3E7E9 0 12px, #D8DDE0 12px 24px);
}

.photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 1000px; margin: 0 auto; }
@media (max-width: 799px) {
  .photo-grid {
    grid-template-columns: 1fr;
  }
}
/* ---------- Before / After ---------- */
.beforeafter {
  display: grid;grid-template-columns: 1fr auto 1fr; gap: 14px;
  align-items: center; max-width: 900px; margin: 0 auto;
}
.ba-arrow {
  font-size: 1.8rem; font-weight: 700; color: var(--color-accent-green);
  text-align: center; line-height: 1;
}
@media (max-width: 799px) { .beforeafter { grid-template-columns: 1fr; }.ba-arrow { transform: rotate(90deg); } }
.ba-item figcaption { display: flex; align-items: center; gap: 10px; font-weight: 700; color: var(--color-text); }
.ba-tag {
  font-family: var(--font-heading); font-size: 0.68rem; font-weight: 800;
  letter-spacing: 0.08em; color: var(--color-white);
  border-radius: 4px; padding: 2px 10px;
}
.ba-tag-before { background:var(--color-blue-deep); }
.ba-tag-after { background: var(--color-orange); }

/* ---------- Vehicle layout ---------- */
.vehicle-layout {
  display: grid; grid-template-columns: 340px 1fr; gap: 24px;
  max-width: 1200px; margin: 0 auto 40px; align-items: start;
}
.vehicle-list { margin-top: 16px; background:var(--color-blue-lightest02);border-radius: var(--radius-md);
  font-weight: 700; padding: 20px 24px;}
@media (max-width: 799px) {
  .vehicle-layout  {
    grid-template-columns: 1fr;
  }
}
.vehicle-scheme{
  max-width: 900px; margin: 0 auto;
  background: var(--color-white); border: 2px solid var(--color-blue);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card); overflow: hidden;
}
.vehicle-scheme .sub-title{ margin: 0; padding:10px 0;background:var(--color-blue);color: var(--color-white);font-size: 1.375rem;
}
.scheme-card {
padding: 30px 28px;
}
.scheme-lead { margin-bottom: 20px; text-align: center; line-height: 1.9; font-size: 1.125rem; }
.scheme-lead strong { color: var(--color-accent-blue-dark); }
.scheme-list { display: flex; flex-direction: column; gap: 2px; }
.scheme-list li {
  display: grid; grid-template-columns: 1fr; gap: 4px;
  padding: 14px 0; border-bottom: 1px dotted var(--color-border);
}
@media (min-width: 800px) { .scheme-list li { grid-template-columns: 130px 1fr; gap: 18px; align-items: baseline; } }
.scheme-label {
  font-weight: 700; font-size: 1.125rem; color: var(--color-accent-blue-dark);
  background: var(--color-blue-lightest); color: var(--color-blue-deep); text-align: center; padding: 4px 0;}
.scheme-body {  line-height: 1.8; }
.scheme-body strong { color: var(--color-orange); }
.scheme-note { font-size: 0.8rem; color: var(--color-text-sub); margin-top: 16px; text-align: left;}
@media (max-width: 799px) { 
.scheme-label{
  margin-bottom: 10px;}
}

/* ---------- Support media ---------- */
.support-media { max-width: 820px; margin: 36px auto 0; }
.support-grid{ margin-bottom: 90px;}

/* ---------- CTA band ---------- */
.cta-band {
  max-width: 950px; margin: 44px auto 0; color: var(--color-white); padding: 28px 24px;
  background: var(--color-blue-dark); border: 2px solid var(--color-accent-green);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card);text-align: center;
}
.cta-band-text { font-size: 1.25rem; font-weight: 700; padding-bottom: 20px;}
.cta-band-buttons { display: flex; flex-direction: row; gap: 12px; justify-content: center; align-items: center; }
.cta-band-buttons .btn { width: 100%; max-width: 320px; }
.cta-band figure {  width: 220px; margin-top: -70px; z-index: 1;
}
.cta-band figure img {display: block; width: 100%; height: auto;}

.cta-band-contact {display: flex;margin: 100px auto 0;}
.cta-band-contact.cta-band{padding-bottom: 0;}
.cta-band-contact > div{ padding: 28px 24px; flex: 3;}
/* .cta-band-contact figure{flex: 1;} */

@media (max-width: 799px) {
  .cta-band-buttons { flex-direction: column; }
  .cta-band-contact {
  display: flex; flex-direction: column; margin: 80px auto 0;}
  .cta-band-contact figure { display: none;}
}

/* ---------- パートナーの声（顔出しなし・コメントのみ） ---------- */
.section-voice {
  background: var(--color-blue-dark);color: var(--color-white);
}
.section-voice .chapter-label { color: #7FE3D3; }
.section-voice .section-lead { color: rgba(255, 255, 255, 0.82); }

.voice-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 800px) { .voice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/*
@media (min-width: 700px) { .voice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .voice-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .voice-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
*/
.voice-featured {
  margin: 0 0 24px; background: var(--color-white); color: var(--color-text);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card);
  padding: 32px 30px; border-top: 5px solid var(--color-accent-green);
}
.voice-featured-head {
  display: flex; align-items: center; gap: 16px;
  padding-bottom: 20px; margin-bottom: 22px; border-bottom: 1px solid var(--color-border);
}
.voice-featured-title {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(1.02rem, 2.4vw, 1.3rem); line-height: 1.5; margin-bottom: 4px;
}
.voice-featured-meta { font-size: 0.82rem; color: var(--color-text-sub); }
.voice-qa-grid { display: grid; grid-template-columns: 1fr; gap: 18px; }
@media (min-width: 799px) { .voice-qa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.voice-qa {
  background: var(--color-light-gray); border-radius: var(--radius-md); padding: 18px 20px;
}
.voice-qa-caution { background: var(--color-caution-bg); }
.voice-qa-q {
  font-weight: 700; color: var(--color-accent-green-dark);
  margin-bottom: 8px;
}
.voice-qa-caution .voice-qa-q { font-size:1.125rem; color: var(--color-caution); }
.voice-qa-a { line-height: 1.85; }
.voice-featured-quote {
  position: relative; margin-top: 22px; padding: 22px;
  background: rgba(77, 182, 172, 0.09); border-radius: var(--radius-md);
  font-size: 0.95rem; line-height: 1.9;
}

.voice-facts-row {
  display: grid; grid-template-columns: 1fr; gap: 8px; margin-top: 20px;
}
@media (min-width: 799px) { .voice-facts-row { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.voice-card {
  margin: 0; display: flex; flex-direction: column;
  background: var(--color-white); color: var(--color-text);
  border-radius: var(--radius-md); box-shadow: var(--shadow-card);
  padding: 24px 22px 20px; border-top: 4px solid var(--color-accent-green);
}
.voice-card-caution { border-top-color: var(--color-caution); }
.voice-theme {
  font-weight: 700; letter-spacing: 0.04em;
  color: var(--color-accent-green-dark); margin-bottom: 12px;
}
.voice-card-caution .voice-theme { color: var(--color-caution); }
.voice-quote { position: relative; flex: 1; margin:0 20px; font-size: 0.9rem; line-height: 1.9; }

.voice-card-caution .voice-quote::before { color: rgba(178, 101, 0, 0.3); }
.voice-quote.is-pending p {
  color: var(--color-text-sub); font-size: 0.85rem;
  border: 1px dashed var(--color-border); border-radius: 8px;
  padding: 18px 14px; text-align: center; background: var(--color-light-gray);
}
.voice-profile {
  display: flex; align-items: center; gap: 12px;
  margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--color-border);
}
.voice-initial {
  flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%;
  background: var(--gradient-brand); color: var(--color-white);
  font-family: var(--font-heading); font-weight: 800; font-size: 0.9rem;
  display: flex; align-items: center; justify-content: center;
}
.voice-card-caution .voice-initial { background: linear-gradient(120deg, #FFB74D 0%, var(--color-caution) 100%); }
.voice-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.voice-name { font-weight: 700; font-size: 0.88rem; }
.voice-sub { font-size: 0.78rem; color: var(--color-text-sub); }
.voice-facts { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.voice-facts li {
  display: flex; justify-content: space-between; align-items: center; gap: 10px; background: var(--color-light-gray);
  border-radius: 6px; padding: 7px 12px;
}
.voice-fact-label { color: var(--color-text-sub); }
.voice-fact-value { font-weight: 700; }
.voice-note {
  max-width: 900px; margin: 24px auto 0; text-align: center;
  font-size: 0.875rem; line-height: 1.8; color: rgba(255, 255, 255, 0.75);
}
/* ---------- インタビュー ---------- */
.interview {
  max-width: 900px; margin: 56px auto 0;
  background: var(--color-white); color: var(--color-text);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card);
  padding: 36px 28px;
}
.interview-label {
  display: inline-block; font-family: var(--font-heading); font-weight: 800;
  font-size: 0.72rem; letter-spacing: 0.14em; color: var(--color-white);
  background: var(--color-blue-dark); border-radius: 999px;
  padding: 4px 16px; margin-bottom: 12px;
}
.interview-title { font-size: clamp(1.15rem, 2.6vw, 1.5rem); margin-bottom: 12px; }
.interview-plan {
  font-size: 0.875rem; line-height: 1.8; color: var(--color-text-sub);
  background: var(--color-light-gray); border-radius: var(--radius-md);
  padding: 14px 18px; margin-bottom: 26px;
}
.interview-plan strong { color: var(--color-accent-green-dark); }
.interview-head {
  display: grid; grid-template-columns: 1fr; gap: 24px;
  padding-bottom: 28px; margin-bottom: 28px; border-bottom: 1px solid var(--color-border);
}
@media (min-width: 799px) { .interview-head { grid-template-columns: 260px 1fr; align-items: start; } }
.interview-profile { display: flex; flex-direction: column; gap: 0; }
.interview-profile > div {
  display: flex; gap: 14px; padding: 10px 4px; border-bottom: 1px dotted var(--color-border);
}
.interview-profile > div:last-child { border-bottom: 0; }
.interview-profile dt {
  flex: 0 0 96px; font-size: 0.82rem; font-weight: 700; color: var(--color-accent-green-dark);
}
.interview-profile dd { margin: 0; font-size: 0.88rem; }

.interview-qa { display: flex; flex-direction: column; gap: 26px; counter-reset: qa; }
.interview-qa > li { counter-increment: qa; }
.interview-q {
  position: relative; padding-left: 38px; font-weight: 700;
  line-height: 1.7; margin-bottom: 10px;
}
.interview-q::before {
  content: "Q" counter(qa); position: absolute; left: 0; top: 1px;
  width: 28px; height: 28px; border-radius: 8px;
  background: var(--color-accent-green-dark); color: var(--color-white);
  font-family: var(--font-heading); font-size: 0.72rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
.interview-a { padding-left: 38px; font-size: 0.9rem; color: var(--color-text-sub); line-height: 1.9; }
.interview-a.is-pending {
  margin-left: 38px; padding: 16px 18px;
  border: 1px dashed var(--color-border); border-radius: 8px;
  background: var(--color-light-gray); font-size: 0.85rem;
}
.interview-hint { display: inline-block; margin-top: 6px; font-size: 0.875rem; color: #6D4C41; }
.section-voice .review-note { background: rgba(255, 243, 224, 0.94); }

@media (max-width: 799px) {
  .interview { padding: 28px 20px; }
  .interview-profile dt { flex-basis: 84px; }
  .interview-a, .interview-a.is-pending { padding-left: 0; margin-left: 0; }
  .interview-a.is-pending { padding: 14px 16px; }
}

/* ---------- area ---------- */
.section-area{
  background: var(--color-blue-lightest02);
}
.area-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
/*
@media (min-width: 600px) { .area-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .area-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
*/
.area-card { padding: 24px 22px; }
.area-name {
  font-size: 1.05rem; text-align: center; color: var(--color-accent-green-dark);
  padding-bottom: 12px; margin-bottom: 14px; border-bottom: 2px solid var(--color-blue);
}
.area-list { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.area-list li {
  font-size: 0.85rem; background: var(--color-light-gray);
  border-radius: 6px; padding: 5px 12px;
}
/* ---------- Placeholder block ---------- */
.placeholder-block {
  max-width: 760px; margin: 0 auto;
  border: 2px dashed var(--color-border); border-radius: var(--radius-md);
  padding: 32px 28px; background: var(--color-light-gray); text-align: center;
}
.placeholder-title {
  font-family: var(--font-heading); font-weight: 700;
  color: var(--color-text-sub); margin-bottom: 12px;
}
.placeholder-block > p { font-size: 0.9rem; color: var(--color-text-sub); }
.placeholder-items {
  text-align: left; max-width: 480px; margin: 18px auto;
  font-size: 0.88rem; color: var(--color-text-sub);
}
.placeholder-items li { padding-left: 18px; position: relative; margin-bottom: 8px; }
.placeholder-items li::before {
  content: ""; position: absolute; left: 0; top: 11px;
  width: 6px; height: 6px; border-radius: 50%; background: #B0BEC5;
}
.placeholder-note { font-size: 0.875rem; color: var(--color-text-sub); margin-top: 16px; }

/* ---------- Fit / Caution ---------- */

.fit-wrap{
  margin-bottom:72px ;
}
.fit-card { max-width: 900px; margin: 0 auto;  position: relative; overflow: hidden;}
.check-list-2col { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 0 32px; }
.caution-card {
  max-width: 900px; margin: 0 auto;
  background: var(--color-yellow-lightest); 
}
.fit-card {
  background-image: url("../assets/img/fit-bg.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.fit-card.card {
  padding: 48px;
}
.fit-person {
  position: absolute;
  right: 5%;
  bottom: 0;
  width: 250px;
  margin: 0;
}
.fit-person img {
  display: block;
  width: 100%;
  height: auto;
}
.caution-title{
  margin-bottom: 44px;  padding: 20px 0; 
  background-image: repeating-linear-gradient(-45deg, var(--color-yellow-light) 0 10px, var(--color-white) 10px 20px);
}
.caution-title .sub-title{
  margin: 0px 0 10px;  font-size: 1.75rem;color: var(--color-yellow-dark);
}
.caution-title .section-lead{
      margin: 0 auto 0; color: var(--color-text-sub);
}
.caution-title-wrap{
  position: relative;padding:14px 0; background: #fff;
}
@media (max-width: 799px) {
  .fit-person img{ display: none;}
  .fit-card.card{ padding: 28px;}
  .check-list-2col { grid-template-columns: 1fr;}
  .fit-card {
  background-image: url("../assets/img/fit-bg-sp.webp");
}
}

/* ---------- Steps ---------- */
.steps { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }

.step {
  position: relative;display: flex;flex-direction: column; background: var(--color-white); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); padding: 24px 16px; text-align: center; border: 1px solid var(--color-blue);
}
.step-num {
  width: 42px; height: 42px; border-radius: 50%; margin: -40px auto 0;
  background: var(--color-blue); color: var(--color-white); font-weight: 800;
  display: flex; align-items: center; justify-content: center; 
}
.step-icon{ width: 70px;height: 70px; margin:20px auto 20px;}
.step-icon img { width: 100%; height: 100%; object-fit: contain;}
.step-text{display: flex; flex-direction: column;}
.step h3 { font-size: 1.125rem; margin-bottom: 8px;  min-height: 3rem;}
.step p { font-size: 1rem;}
@media (max-width: 799px) {
  .steps {gap: 32px;}
  .steps-7 { grid-template-columns: 1fr; }
  .step-icon{ width: 60px;height: 60px; margin:10px auto 20px;flex: 0 0 90px;}
  .step {flex-direction: row;gap: 10px;}
  .step h3 { min-height: 0;}
  .step-text{text-align: left;flex: 1;}
  .step-num {margin: -30px 0 0 -20px;}
}
/* ---------- FAQ ---------- */
.faq-list { display: flex; flex-direction: column; gap: 12px; }
.faq-item {
  background: var(--color-white); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); overflow: hidden;
}
.faq-item summary {
  cursor: pointer; list-style: none; padding: 20px 56px 20px 24px;
  font-weight: 700; font-size: 1.125rem; position: relative;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: ""; position: absolute; right: 24px; top: 50%;
  width: 10px; height: 10px; margin-top: -7px;
  border-right: 2px solid var(--color-blue);
  border-bottom: 2px solid var(--color-blue);
  transform: rotate(45deg); transition: transform 0.2s ease;
}
.faq-item[open] summary::after { transform: rotate(-135deg); margin-top: -2px;  border-top: 1px solid #e5e5e5;}
.faq-body { padding: 10px 24px 22px 24px; }
.faq-body p { font-size: 1rem; color: var(--color-text-sub); }
.faq-item summary::before {
  content: "Q"; display: inline-flex; align-items: end; justify-content: center;
  width: 28px; height: 28px; margin-right: 12px; border-radius: 8px;
  background: var(--color-blue); color: var(--color-white); font-weight: 700;
}
.faq-body::before {
  content: "A"; display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; margin-right: 12px; border-radius: 8px;
  background: var(--color-blue-light); color: var(--color-blue-dark); font-weight: 700;
}
.faq-item[open] .faq-body {  border-top: 1px solid var(--color-blue-lightest);}
.faq-item summary {
  display: flex;
  align-items: center;
  gap: 12px;
}

.faq-item summary::before {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  margin-right: 0;
}
.faq-body {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 24px 22px;
}

.faq-body::before {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  margin-right: 0;
}
/* ---------- TBD / review markers（公開前に削除） ---------- */
.tbd, .tbd-inline {
  display: inline-block; font-size: 0.875rem; font-weight: 700;
  color: #8D6E63; background: #EFEBE9; border: 1px dashed #A1887F;
  border-radius: 4px; padding: 1px 8px;
}
.tbd-inline { margin-left: 6px; }
.review-note {
  max-width: 900px; margin: 24px auto 0;
  font-size: 0.8rem; line-height: 1.7; color: #6D4C41;
  background: #FFF3E0; border-left: 4px solid #FFB74D;
  border-radius: 0 8px 8px 0; padding: 12px 18px;
}

/* ---------- Disclaimer ---------- */
.disclaimer {
  margin: 28px auto 0; font-size: 0.875rem; color: var(--color-text-sub);
  text-align: center; max-width: 1000px; line-height: 1.7;
}
.chart-note { font-size: 0.875rem; color: var(--color-text-sub); margin-top: 16px; }
.chart-note.center { text-align: center; }

/* ---------- Form ---------- */
.form-section { background: var(--color-light-gray); }
.lead-form {
  background: var(--color-white); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card); padding: 36px 28px;
  display: flex; flex-direction: column; gap: 22px;
}
.form-field { display: flex; flex-direction: column; gap: 8px; }
.form-field label, .form-field legend { font-weight: 700; font-size: 0.9rem; }
.required { color: var(--color-cta-dark); }
.form-field input, .form-field select, .form-field textarea {
  border: 1px solid var(--color-border); border-radius: 8px;
  padding: 14px 16px; font-size: 1rem; background: var(--color-white);
  width: 100%;
}
.form-field textarea { resize: vertical; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  border-color: var(--color-accent-blue-dark);
}
.field-note { font-size: 0.78rem; color: var(--color-text-sub); }
.form-row { flex-direction: row; gap: 16px; }
.form-row > div { flex: 1; display: flex; flex-direction: column; gap: 8px; }
@media (max-width: 799px) { .form-row { flex-direction: column; } }

.form-purpose legend { margin-bottom: 10px; }
.radio-group { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 800px) { .radio-group { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.radio-card {
  display: flex; align-items: flex-start; gap: 10px; cursor: pointer;
  border: 2px solid var(--color-border); border-radius: var(--radius-md);
  padding: 16px; transition: border-color 0.15s ease, background-color 0.15s ease;
}
.radio-card:hover { background: var(--color-light-gray); }
.radio-card input { width: auto; margin-top: 4px; flex-shrink: 0; accent-color: var(--color-cta); }
.radio-card:has(input:checked) {
  border-color: var(--color-cta); background: rgba(255, 112, 67, 0.06);
}
.radio-body { display: flex; flex-direction: column; gap: 2px; }
.radio-title { font-weight: 700; font-size: 0.92rem; }
.radio-desc { font-size: 0.78rem; color: var(--color-text-sub); line-height: 1.6; }

.form-mode { display: flex; flex-direction: column; gap: 22px; padding: 0; margin: 0; }
.form-mode[hidden] { display: none; }

.form-intro {
  background: var(--color-light-gray); border-radius: var(--radius-md);
  padding: 18px 20px;
}
.form-intro-title {
  font-family: var(--font-heading); font-weight: 700;
  font-size: 0.95rem; margin-bottom: 8px;
}
.form-intro p { font-size: 0.85rem; line-height: 1.8; color: var(--color-text-sub); }
.form-intro-note { margin-top: 8px; font-size: 0.8rem; }

.form-group-title {
  font-family: var(--font-heading); font-weight: 800; font-size: 0.9rem;
  color: var(--color-accent-green-dark);
  padding-bottom: 8px; margin-top: 8px;
  border-bottom: 2px solid var(--color-accent-green);
}

.form-note-box {
  background: var(--color-caution-bg); border: 1px solid rgba(178, 101, 0, 0.3);
  border-radius: var(--radius-md); padding: 16px 18px;
}
.form-note-box p { font-size: 0.85rem; line-height: 1.8; }
.form-note-box strong { color: var(--color-caution); }

/* form-conditional  */
.form-conditional {
  border-left: 3px solid var(--color-accent-blue); padding-left: 16px;
}
.form-conditional[hidden] { display: none; }

.btn-submit { width: 100%; margin-top: 8px; }
.form-privacy { font-size: 0.8rem; color: var(--color-text-sub); text-align: center; }
.form-privacy a { text-decoration: underline; }

.form-complete {
  background: var(--color-white); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card); padding: 48px 28px; text-align: center;
}
.complete-icon {
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--gradient-brand); color: var(--color-white); font-size: 1.6rem;
  display: flex; align-items: center; justify-content: center; margin: 0 auto 20px;
}
.form-complete h3 { margin-bottom: 12px; }
.form-complete p { color: var(--color-text-sub); }
/* ---------- Sticky CTA (mobile) ---------- */
.sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 400;
  display: flex; justify-content:center; gap: 10px; padding: 10px 14px;
  background: rgba(255, 255, 255, 0.96); backdrop-filter: blur(6px);
  border-top: 1px solid var(--color-border);
  box-shadow: 0 -4px 16px rgba(38, 50, 56, 0.1);
}
/* クラスの display:flex が UA の [hidden] を上書きするため、明示的に打ち消す */
.sticky-cta[hidden] { display: none; }
.sticky-cta .btn {
  flex: 1; font-size: 0.875rem; padding: 12px 8px; min-height: 46px; box-shadow: none; max-width: 30em;
}

/* ---------- Footer ---------- */
.site-footer { background: var(--color-blue-deep); color: rgba(255,255,255,0.85); padding: 56px 0 24px; }
.footer-inner { display: grid; grid-template-columns: 2fr 1fr; gap: 32px; margin-bottom: 32px; align-items: start; }
@media (max-width: 799px) {
  .footer-inner { grid-template-columns: 1fr; }
}
.footer-col:last-child { display: flex; flex-direction: column; align-items: flex-end; }
.footer-logo {
  font-family: var(--font-heading); font-weight: 800; font-size: 1.2rem;
  color: var(--color-white); margin-bottom: 16px;
}
.footer-address { font-style: normal; font-size: 0.875rem; line-height: 1.9; color: rgba(255,255,255,0.7); }
.footer-links { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; margin-bottom: 20px; font-size: 0.875rem; }
.footer-links span { color: rgba(255,255,255,0.7); }
.footer-links a:hover { text-decoration: underline; }
.copyright { text-align: center; font-size: 0.875rem; color: rgba(255,255,255,0.5); }
@media (max-width: 799px) {
  .footer-col:last-child,
  .footer-links { align-items: flex-start; }
}

/* @media (min-width: 1280px) { .container { padding: 0 40px; } } */

/* =========================================================
   2026-08-26 クライアント修正反映分
   ========================================================= */

/* ---------- ① ファーストビュー直下のハイライト（5項目） ---------- */
.highlight-list-5 li {
  font-size: 0.95rem; padding: 8px 20px;
  background: rgba(255, 255, 255, 0.18);
}
@media (max-width: 799px) {
  .highlight-list-5 li { font-size: 0.85rem; padding: 7px 14px; }
}

/* ---------- ② 案件実績：数字を一目で認識させる ---------- */
.track-hook { font-weight: 700; }
.track-conclusion-sub {
  margin-top: 14px; font-size: 0.85rem; color: var(--color-text-sub); line-height: 1.8;
}

/* ---------- ③ 報酬：中心となる稼働スタイル（週5日） ---------- */
.model-main {
  max-width: 880px; margin: 0 auto 40px;
  background: var(--color-white); border: 3px solid var(--color-orange);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card);
  padding: 34px 28px 30px; position: relative;
}
.model-main-label {
  position: absolute; top: -18px; left: 50%; transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: 10px; white-space: nowrap;
  font-family: var(--font-heading); font-weight: 800; font-size: 0.95rem;
  color: var(--color-white); background: var(--color-orange);
  border-radius: 999px; padding: 7px 22px;
}
.model-main-badge {
  font-size: 0.85rem; background: var(--color-white); color: var(--color-orange-dark);
  border-radius: 999px; padding: 2px 12px;
}
.model-main .formula { margin-bottom: 26px; }

.model-main-result {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding-top: 24px; border-top: 2px dashed var(--color-orange-light);
}
.model-main-result-label { font-size: 0.9rem; font-weight: 700; color: var(--color-text-sub); }
.model-main-result-value {
  font-family: var(--font-heading); font-weight: 800; line-height: 1.1;
  font-size: clamp(2.6rem, 7vw, 4rem); color: var(--color-orange-dark);
}
.model-main-result-value span { font-size: 0.4em; margin: 0 2px; }

/* 補足のモデルケース */
.model-sub {
  display: grid; grid-template-columns: 1fr; gap: 18px;
  max-width: 880px; margin: 0 auto;
}
@media (min-width: 800px) { .model-sub { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.model-sub-card {
  background: var(--color-white); border: 1px solid var(--color-border);
  border-radius: var(--radius-md); box-shadow: var(--shadow-card);
  padding: 22px 20px; text-align: center;
}
.model-sub-pattern { font-weight: 700; font-size: 0.95rem; margin-bottom: 6px; }
.model-sub-formula { font-size: 0.82rem; color: var(--color-text-sub); margin-bottom: 10px; }
.model-sub-value {
  font-family: var(--font-heading); font-weight: 800; line-height: 1.1;
  font-size: 2rem; color: var(--color-blue-dark);
}
.model-sub-value span { font-size: 0.5em; margin: 0 2px; }
.model-sub-card-min { background: var(--color-light-gray); box-shadow: none; }
.model-sub-card-min .model-sub-value { font-size: 1.5rem; color: var(--color-text-sub); }
.model-sub-note { margin-top: 8px; font-size: 0.76rem; color: var(--color-text-sub); }

/* ---------- ⑥ FAQ内の注記 ---------- */
.faq-note { display: inline-block; margin-top: 8px; font-size: 0.82rem; color: var(--color-text-sub); }

/* ---------- ⑦ 相談方法の選択（LINE / 個別説明） ---------- */
.entry-choice {
  display: grid; grid-template-columns: 1fr; gap: 20px;
  max-width: 900px; margin: 0 auto 48px;
}
@media (min-width: 800px) { .entry-choice { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.entry-card {
  display: flex; flex-direction: column;
  background: var(--color-white); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card); padding: 28px 24px;
  border-top: 5px solid var(--color-border);
}
.entry-card-line { border-top-color: var(--color-line); }
.entry-card-form { border-top-color: var(--color-orange); }
.entry-badge {
  align-self: flex-start; font-size: 0.75rem; font-weight: 700;
  color: var(--color-line); background: rgba(6, 199, 85, 0.1);
  border-radius: 999px; padding: 4px 14px; margin-bottom: 12px;
}
.entry-badge-main { color: var(--color-orange-dark); background: var(--color-orange-lightest); }
.entry-title { font-size: 1.15rem; margin-bottom: 10px; }
.entry-desc {
  flex: 1; font-size: 0.88rem; line-height: 1.85;
  color: var(--color-text-sub); margin-bottom: 20px;
}
.entry-card .btn { width: 100%; }

/* LINEボタン */
.btn-line {
  background: var(--color-line); color: var(--color-white);
  border: 2px solid var(--color-line);
}
.btn-line:hover {
  background: var(--color-white); color: var(--color-line);
  transform: translateY(-2px);
}

/* ---------- ⑦ 簡素化したフォーム ---------- */
.form-lead-title {
  font-family: var(--font-heading); font-weight: 800; font-size: 1.1rem;
  text-align: center;
}
.form-lead-desc {
  font-size: 0.85rem; color: var(--color-text-sub);
  text-align: center; line-height: 1.8; margin-top: -12px;
}

/* ---------- 2026-08-26 FV見出しの強弱調整 ---------- */
/* 「未経験」を強調（金額とは別の強さで、色は白のまま太く大きく） */
.hero-lead-strong {
  font-size: 1.22em; font-weight: 900; letter-spacing: 0.01em;
  padding: 0 2px;
}
/* 「も狙える」は強調しない */
.hero-lead-plain {
  font-size: 0.86em; font-weight: 700; letter-spacing: 0;
}

/* ---------- 2026-08-26 報酬：稼働習熟による推移 ---------- */
.model-main-desc {
  margin-top: 14px; font-size: 0.9rem; color: var(--color-text-sub); text-align: center;
}
.model-range-sep { font-size: 0.6em; margin: 0 4px; }

.model-steps {
  display: grid; grid-template-columns: 1fr; gap: 18px;
  max-width: 980px; margin: 0 auto; counter-reset: mstep;
}
@media (min-width: 800px) { .model-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.model-step {
  position: relative; background: var(--color-white);
  border: 1px solid var(--color-border); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); padding: 26px 22px; text-align: center;
}
.model-step-main { border: 3px solid var(--color-orange); }
.model-step-peak { border: 2px solid var(--color-blue); }
.model-step-phase {
  display: inline-block; font-size: 0.8rem; font-weight: 700;
  color: var(--color-text-sub); background: var(--color-light-gray);
  border-radius: 999px; padding: 4px 14px; margin-bottom: 12px;
}
.model-step-main .model-step-phase { color: var(--color-white); background: var(--color-orange); }
.model-step-peak .model-step-phase { color: var(--color-white); background: var(--color-blue); }
.model-step-value {
  font-family: var(--font-heading); font-weight: 800; line-height: 1.1;
  font-size: 2.2rem; color: var(--color-text); margin-bottom: 10px;
}
.model-step-value span { font-size: 0.45em; margin: 0 2px; }
.model-step-main .model-step-value { font-size: 2.5rem; color: var(--color-orange-dark); }
.model-step-peak .model-step-value { color: var(--color-blue-dark); }
.model-step-formula { font-size: 0.8rem; color: var(--color-text-sub); margin-bottom: 10px; }
.model-step-desc { font-size: 0.84rem; line-height: 1.75; color: var(--color-text-sub); }
.model-steps-note { max-width: 900px; margin-left: auto; margin-right: auto; }

/* 推移を示す矢印（PCのみ） */
@media (min-width: 800px) {
  .model-step + .model-step::before {
    content: ""; position: absolute; left: -13px; top: 50%;
    width: 0; height: 0; transform: translateY(-50%);
    border-left: 9px solid var(--color-blue-light);
    border-top: 7px solid transparent; border-bottom: 7px solid transparent;
  }
}

/* ---------- 2026-08-26 法人参加・社内展開 ---------- */
.roadmap-corp {
  margin-top: 18px; background: var(--color-blue-lightest);
  border: 1px solid var(--color-blue-light); border-radius: var(--radius-md);
  padding: 20px 22px;
}
.roadmap-corp-title {
  font-family: var(--font-heading); font-weight: 800; font-size: 1rem;
  color: var(--color-blue-dark); margin-bottom: 10px;
}
.roadmap-corp-desc { font-size: 0.9rem; line-height: 1.85; margin-bottom: 16px; }
.roadmap-corp-desc strong { color: var(--color-orange-dark); }
.roadmap-corp-steps { display: flex; flex-direction: column; gap: 8px; }
.roadmap-corp-steps li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 0.86rem; line-height: 1.7;
  background: var(--color-white); border-radius: 8px; padding: 10px 14px;
}
.roadmap-corp-num {
  flex: 0 0 22px; width: 22px; height: 22px; margin-top: 1px;
  border-radius: 50%; background: var(--color-blue); color: var(--color-white);
  font-size: 0.72rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.roadmap-corp-note { margin-top: 12px; font-size: 0.78rem; color: var(--color-text-sub); }

/* =========================================================
   2026-08-26 クライアント回答反映（報酬の段階・車両購入制度・チーム化）
   ========================================================= */

/* ---------- 報酬：担当件数と報酬の対応表 ---------- */
.rate-table { width: 100%; min-width: 480px; }
.rate-table th, .rate-table td {
  border: 1px solid var(--color-border); padding: 14px 16px;
  text-align: left; font-size: 0.95rem;
}
.rate-table thead th { background: var(--color-light-gray); font-weight: 700; }
.rate-table tbody th {
  font-family: var(--font-heading); font-weight: 800; font-size: 1.15rem;
  color: var(--color-orange-dark); white-space: nowrap;
}
.rate-row-main { background: var(--color-orange-lightest); }

/* ---------- 繁忙期手当 ---------- */
.bonus-box-peak { margin-top: 20px; border-style: solid; border-color: var(--color-orange-light); background: var(--color-orange-lightest); }
.bonus-peak-desc { font-size: 0.92rem; line-height: 1.85; }

/* ---------- 上位実績（100万円）は通常モデルと分離 ---------- */
.top-record {
  max-width: 900px; margin: 36px auto 0;
  background: var(--color-white); border: 2px dashed var(--color-blue);
  border-radius: var(--radius-lg); padding: 28px 26px; position: relative;
}
.top-record-label {
  position: absolute; top: -14px; left: 24px;
  font-size: 0.78rem; font-weight: 800; letter-spacing: 0.08em;
  color: var(--color-white); background: var(--color-blue);
  border-radius: 999px; padding: 4px 16px;
}
.top-record-body { display: grid; grid-template-columns: 1fr; gap: 20px; align-items: start; }
@media (min-width: 800px) { .top-record-body { grid-template-columns: 230px 1fr; } }
.top-record-value {
  font-family: var(--font-heading); font-weight: 800; line-height: 1.1;
  font-size: 2.6rem; color: var(--color-blue-dark); text-align: center;
}
.top-record-value span { display: block; font-size: 0.3em; color: var(--color-text-sub); margin-bottom: 4px; }
.top-record-value span + span { display: inline; font-size: 0.38em; margin: 0 0 0 2px; color: var(--color-blue-dark); }
.top-record-text p { font-size: 0.9rem; line-height: 1.9; }
.top-record-text strong { color: var(--color-blue-dark); }
.top-record-note {
  margin-top: 12px; padding-top: 12px; border-top: 1px dotted var(--color-border);
  font-size: 0.85rem; color: var(--color-text-sub);
}
.top-record-note a { color: var(--color-blue-dark); font-weight: 700; text-decoration: underline; }

/* ---------- 車両購入制度：契約終了時の注意 ---------- */
.scheme-label-caution { color: var(--color-caution) !important; }

/* ---------- チーム化：品質責任 ---------- */
.roadmap-caution {
  margin-top: 16px; background: var(--color-caution-bg);
  border: 1px solid var(--color-orange-light); border-radius: var(--radius-md);
  padding: 16px 18px;
}
.roadmap-caution-title {
  font-weight: 800; font-size: 0.92rem; color: var(--color-caution); margin-bottom: 8px;
}
.roadmap-caution p { font-size: 0.86rem; line-height: 1.85; }
.roadmap-caution strong { color: var(--color-caution); }

/* ---------- 365日体制の補足 ---------- */
.roadmap-highlight-goal { background: var(--color-blue-lightest); }
.roadmap-corp-subtitle {
  font-weight: 700; font-size: 0.88rem; color: var(--color-blue-dark);
  margin: 16px 0 10px;
}
.roadmap-corp-text { flex: 1; min-width: 0; }
.roadmap-corp-text strong { color: var(--color-orange-dark); }
/* 365日の定義は長文のため、55%用の大きな強調を打ち消す */
.roadmap-highlight-goal .roadmap-highlight-value strong {
  font-size: inherit; font-family: inherit; font-weight: 800;
  color: var(--color-blue-dark);
}

/* =========================================================
   人物カット＋吹き出し（アクセント配置用コンポーネント）
   .say                 … 基本（人物が右・吹き出しが左）
   .say--flip           … 人物が左・吹き出しが右
   .say--dark           … 濃色セクション用（吹き出しを白のまま浮かせる）
   .say--sm / --lg      … 人物サイズ
   ========================================================= */
.say {
  display: grid; grid-template-columns: 1fr auto;
  align-items: end; gap: 0 24px;
  max-width: 980px; margin: 40px auto 0;
}
.say--flip { grid-template-columns: auto 1fr; }
.say--flip .say-person { order: -1; }

.say--crop {
  align-items: stretch;
}
.say--crop .say-person {
  height: 270px;
  max-height: 100%;
  overflow: hidden;
  margin: 0;
  align-self: stretch;
}
/* 吹き出し */
.say-bubble {
  position: relative; align-self: center;
  background: var(--color-white); border: 2px solid var(--color-blue-light);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card);
  padding: 26px 30px;
}
.say-bubble::before,
.say-bubble::after {
  content: ""; position: absolute; top: 50%; width: 0; height: 0;
  border-top: 12px solid transparent; border-bottom: 12px solid transparent;
}
/* 人物が右 → しっぽは右向き */
.say-bubble::before { right: -16px; margin-top: -12px; border-left: 16px solid var(--color-blue-light); }
.say-bubble::after  { right: -12px; margin-top: -12px; border-left: 16px solid var(--color-white); }
/* 人物が左 → しっぽは左向き */
.say--flip .say-bubble::before { right: auto; left: -16px; border-left: 0; border-right: 16px solid var(--color-blue-light); }
.say--flip .say-bubble::after  { right: auto; left: -12px; border-left: 0; border-right: 16px solid var(--color-white); }

.say-title {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(1.2rem, 2.6vw, 1.4rem); line-height: 1.55;
  color: var(--color-blue-dark); margin-bottom: 10px;
}
.say-bubble p { font-size: 0.92rem; line-height: 1.9; }
.say-bubble strong { color: var(--color-orange-dark); }
.say-note {
  margin-top: 12px; padding-top: 12px; border-top: 1px dotted var(--color-border);
  font-size: 0.82rem; color: var(--color-text-sub);
}

/* 人物 */
.say-person { margin: 0; width: 210px; }
.say-person img { width: 100%; height: auto; display: block; }
.say--sm .say-person { width: 160px; }
.say--lg .say-person { width: 260px; }
/* 人物を左右反転して使い回す */
.say--mirror .say-person img { 
  /* transform: scaleX(-1);  */
}

/* 濃色セクション用 */
.say--dark .say-bubble { border-color: rgba(255, 255, 255, 0.55); }
.say--dark .say-bubble::before { border-left-color: rgba(255, 255, 255, 0.55); }
.say--dark.say--flip .say-bubble::before { border-right-color: rgba(255, 255, 255, 0.55); }

/* SP：人物を小さくして横並びのまま維持 */
@media (max-width: 799px) {
.say-person img , .model-credit ,
.say-bubble::before,.say-bubble::after {display: none;}
.say { grid-template-columns: 1fr;}
}
@media (max-width: 799px) {
  .say { gap: 0 10px; margin-top: 28px; }
  .say-person { width: 108px; }
  .say--sm .say-person { width: 92px; }
  .say--lg .say-person { width: 124px; }
  .say-bubble { padding: 18px 16px; border-radius: var(--radius-md); }
  .say-bubble::before, .say-bubble::after {
    border-top-width: 9px; border-bottom-width: 9px;
  }
  .say-bubble::before { right: -13px; margin-top: -9px; border-left-width: 13px; }
  .say-bubble::after  { right: -10px; margin-top: -9px; border-left-width: 13px; }
  .say--flip .say-bubble::before { left: -13px; border-right-width: 13px; }
  .say--flip .say-bubble::after  { left: -10px; border-right-width: 13px; }
  .say-bubble p { line-height: 1.8; }
}

/* 素材注記 */
.model-credit {
  max-width: 940px; margin: 10px auto 0;
  font-size: 0.72rem; color: var(--color-text-sub); text-align: right;
}
.say--dark + .model-credit { color: rgba(255, 255, 255, 0.7); }

/* 移管予定エリアの表示 */
.area-move { display: inline-flex; align-items: center; gap: 6px; }
.area-move-note {
  font-size: 0.68rem; font-weight: 700; color: var(--color-white);
  background: var(--color-blue); border-radius: 999px; padding: 1px 8px;
}

/* ---------- キャリアステップ：基本／希望者の区切り ---------- */
.roadmap-divider {
  position: relative; z-index: 1;
  margin: 6px 0; padding: 22px 24px;
  background: var(--color-orange-lightest);
  border: 2px dashed var(--color-orange-light);
  border-radius: var(--radius-lg); text-align: center;
}
.roadmap-divider-text {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(1rem, 2.6vw, 1.3rem); line-height: 1.5;
  color: var(--color-orange-dark);
}
.roadmap-divider-text::before { content: "＼ "; }
.roadmap-divider-text::after { content: " ／"; }
.roadmap-divider-note {
  margin-top: 10px; font-size: 0.84rem; line-height: 1.8; color: var(--color-text-sub);
}
/* 費用テーブル内の注意注記 */
.cost-note-caution {
  display: inline-block; margin-top: 6px;
  font-size: 0.8rem; line-height: 1.7; color: var(--color-caution);
}

/* ---------- 申し込み後のご連絡について ---------- */
.form-reply-note {
  background: var(--color-blue-lightest); border: 1px solid var(--color-blue-light);
  border-radius: var(--radius-md); padding: 16px 18px; text-align: center;
}
.form-reply-title {
  font-weight: 800; font-size: 0.85rem; color: var(--color-blue-dark); margin-bottom: 6px;
}
.form-reply-note p { font-size: 0.88rem; line-height: 1.8; }
.form-reply-note strong { color: var(--color-orange-dark); }
.form-complete-sub { margin-top: 12px; font-size: 0.85rem; color: var(--color-text-sub); }

/* ---------- フォーム：スパム対策・送信エラー ---------- */
.form-honeypot {
  position: absolute; left: -9999px; width: 1px; height: 1px;
  overflow: hidden;
}
.form-error {
  background: #fdecea; border: 1px solid #e5867d; border-radius: var(--radius-md);
  color: #a3231a; font-size: 0.88rem; line-height: 1.8; padding: 14px 16px;
}
.form-error[hidden] { display: none; }

/* =========================================================
   FCパートナーインタビュー（動画カード）
   ========================================================= */
.interview-lead {
  font-size: 0.92rem; line-height: 1.9; color: var(--color-text-sub);
  margin-bottom: 26px;
}
.interview-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 800px) { .interview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.iv-card {
  display: flex; flex-direction: column;
  background: var(--color-white); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card); overflow: hidden;
  border: 1px solid var(--color-border);
}

/* サムネイル部分 */
.iv-video {
  position: relative; display: block; aspect-ratio: 16 / 9;
  background: #0a2033; overflow: hidden;
}
.iv-thumb { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.iv-video:hover .iv-thumb { transform: scale(1.03); }

/* 再生ボタン */
.iv-play {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 64px; height: 64px; border-radius: 50%;
  background: rgba(0, 0, 0, 0.62); border: 2px solid rgba(255, 255, 255, 0.9);
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.iv-play::after {
  content: ""; position: absolute; top: 50%; left: 54%;
  transform: translate(-50%, -50%);
  border-left: 20px solid var(--color-white);
  border-top: 12px solid transparent; border-bottom: 12px solid transparent;
}
.iv-video:hover .iv-play { background: #ff0000; transform: translate(-50%, -50%) scale(1.06); }
.iv-duration {
  position: absolute; right: 10px; bottom: 10px;
  font-size: 0.72rem; font-weight: 700; color: var(--color-white);
  background: rgba(0, 0, 0, 0.7); border-radius: 4px; padding: 3px 10px;
}

/* 再生後の iframe */
.iv-video iframe { width: 100%; height: 100%; border: 0; display: block; }

/* 公開準備中 */
.iv-video-pending {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; text-align: center;
  background: repeating-linear-gradient(-45deg, #eceff1 0 12px, #e4e8ea 12px 24px);
}
.iv-pending-badge {
  font-size: 0.72rem; font-weight: 700; color: var(--color-white);
  background: var(--color-text-sub); border-radius: 999px; padding: 4px 14px;
}
.iv-pending-text { font-size: 0.85rem; line-height: 1.7; color: var(--color-text-sub); }

/* 本文 */
.iv-body { display: flex; flex-direction: column; flex: 1; padding: 22px 20px; }
.iv-title {
  font-family: var(--font-heading); font-weight: 800;
  font-size: 1rem; line-height: 1.6; margin-bottom: 16px;
}
.iv-meta {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;
  margin-bottom: 18px;
}
.iv-meta li {
  display: flex; flex-direction: column; gap: 2px;
  background: var(--color-light-gray); border-radius: 8px; padding: 8px 12px;
}
.iv-meta-label { font-size: 0.72rem; color: var(--color-text-sub); }
.iv-meta-value { font-size: 0.88rem; font-weight: 700; }

.iv-quote {
  position: relative; margin-top: auto;
  background: var(--color-blue-lightest); border-radius: var(--radius-md);
  padding: 18px 20px 16px 44px;
}
.iv-quote::before {
  content: "“"; position: absolute; left: 14px; top: 4px;
  font-family: var(--font-heading); font-size: 2.4rem; line-height: 1;
  color: var(--color-blue-light);
}
.iv-quote p { font-size: 0.92rem; line-height: 1.9; }
.iv-quote strong { color: var(--color-orange-dark); }
.iv-quote footer {
  margin-top: 8px; font-size: 0.78rem; color: var(--color-text-sub);
}
.iv-quote-pending { background: var(--color-light-gray); }
.iv-quote-pending::before { color: var(--color-border); }
.iv-quote-pending p { color: var(--color-text-sub); font-size: 0.85rem; }

.iv-note {
  margin-top: 22px; font-size: 0.78rem; line-height: 1.8; color: var(--color-text-sub);
}

/* ---------- CTA直前の補足（人物カットなし） ---------- */
.pre-cta-note {
  max-width: 820px; margin: 40px auto 0;
  text-align: center;
}
.pre-cta-title {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(1.05rem, 2.6vw, 1.35rem);
  color: var(--color-blue-dark); margin-bottom: 10px;
}
.pre-cta-note p { font-size: 0.92rem; line-height: 1.9; color: var(--color-text-sub); }
.pre-cta-note strong { color: var(--color-orange-dark); }

/* インタビュー：動画公開前のスクリーンショット表示 */
.iv-video-static { position: relative; }
.iv-video-static .iv-thumb { display: none; }
.iv-video-static.is-loaded .iv-thumb { display: block; }
.iv-video-static.is-loaded .iv-video-pending { display: none; }
.iv-video-static .iv-video-pending {
  position: absolute; inset: 0; aspect-ratio: auto;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; text-align: center; border-bottom: 0;
}
.iv-video-static code {
  font-size: 0.72rem; background: rgba(0,0,0,0.06); border-radius: 4px; padding: 1px 6px;
}

/* =========================================================
   ロゴ（2026-09-04 差し替え）
   logo.png は 400×272。縦横比を保ったまま高さで制御する。
   ========================================================= */
.logo-mark { width: auto; height: 40px; }

/* モバイルメニュー内は余白があるため少し大きく */
.mobile-nav-logo .logo-mark { height: 44px; }

/* フッターは濃紺背景。ロゴの黒い輪郭が沈むため白いプレートに載せる */
.footer-logo-mark {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--color-white); border-radius: 10px;
  padding: 10px 14px; margin-bottom: 14px;
}
.footer-logo-mark img { width: auto; height: 44px; display: block; }

@media (max-width: 799px) {
  .logo-mark { height: 34px; }
  .footer-logo-mark { padding: 8px 12px; }
  .footer-logo-mark img { height: 38px; }
}

/* =========================================================
   2026-09-04 UI調整
   ・ボタンに押し込む立体感を追加
   ・追従CTAの高さを拡大
   ・ページ上部へ戻るボタンを追加
   ========================================================= */

/* ---------- ボタン：押せることが分かる立体感 ---------- */
.btn-cta,
.btn-line,
.btn-outline {
  position: relative;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background-color 0.15s ease, color 0.15s ease;
}
.btn-cta { box-shadow: 0 4px 0 var(--color-yellow-dark); }
.btn-line { box-shadow: 0 4px 0 var(--color-line-dark); }
.btn-outline { box-shadow: 0 4px 0 var(--color-blue-dark); }

.btn-cta:hover,
.btn-line:hover,
.btn-outline:hover { transform: translateY(-2px); }
.btn-cta:hover { box-shadow: 0 6px 0 var(--color-yellow-dark); }
.btn-line:hover { box-shadow: 0 6px 0 var(--color-line-dark); }
.btn-outline:hover { box-shadow: 0 6px 0 var(--color-blue-dark); }

/* 押し込み */
.btn-cta:active,
.btn-line:active,
.btn-outline:active {
  transform: translateY(4px);
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

/* 追従CTA内は影を抑えつつ押し込みは残す */
.sticky-cta .btn-cta { box-shadow: 0 3px 0 var(--color-yellow-dark); }
.sticky-cta .btn-line { box-shadow: 0 3px 0 var(--color-line-dark); }
.sticky-cta .btn-cta:hover { box-shadow: 0 5px 0 var(--color-yellow-dark); }
.sticky-cta .btn-line:hover { box-shadow: 0 5px 0 var(--color-line-dark); }
.sticky-cta .btn:active { transform: translateY(3px); box-shadow: 0 0 0 rgba(0,0,0,0); }

/* ---------- 追従CTA：高さを拡大 ---------- */
.sticky-cta { padding: 14px 16px 16px; gap: 12px; }
.sticky-cta .btn {
  font-size: 1rem; padding: 14px 10px; min-height: 58px; line-height: 1.35;
}
@media (max-width: 799px) {
  .sticky-cta { padding: 12px 12px 14px; gap: 8px; }
  .sticky-cta .btn { font-size: 0.92rem; min-height: 54px; padding: 12px 6px; }
}
/* 追従CTAでフッター末尾が隠れないように余白を確保 */
.site-footer { padding-bottom: 110px; }

/* ---------- ページ上部へ戻るボタン ---------- */
.to-top {
  position: fixed; right: 20px; bottom: 20px; z-index: 401;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  width: 56px; height: 56px; padding: 0;
  border-radius: 50%; cursor: pointer;
  background: var(--color-white); color: var(--color-blue-dark);
  border: 2px solid var(--color-blue-dark);
  box-shadow: 0 4px 0 var(--color-blue-dark), 0 6px 14px rgba(9, 31, 81, 0.18);
  transition: transform 0.12s ease, box-shadow 0.12s ease, bottom 0.2s ease;
}
.to-top[hidden] { display: none; }
.to-top:hover { transform: translateY(-2px); box-shadow: 0 6px 0 var(--color-blue-dark), 0 8px 16px rgba(9, 31, 81, 0.22); }
.to-top:active { transform: translateY(4px); box-shadow: 0 0 0 rgba(0,0,0,0); }

.to-top-arrow {
  width: 11px; height: 11px; margin-top: 4px;
  border-top: 3px solid currentColor; border-right: 3px solid currentColor;
  transform: rotate(-45deg);
}
.to-top-text {
  font-family: var(--font-heading); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.04em;
}

/* 追従CTAが出ているときは、その上へ退避 */
.to-top.is-raised { bottom: 106px; }
@media (max-width: 799px) {
  .to-top { right: 14px; bottom: 14px; width: 50px; height: 50px; }
  .to-top.is-raised { bottom: 96px; }
}

/* =========================================================
   2026-09-04 ヒーロー：ワイド画面のレイアウト修正
   問題
     1. ビジュアルが .hero .container（最大1200px）の中に閉じ込められ、
        画面が広いほど左右に余白ができて細く見えていた。
     2. 余白部分に .hero の背景グラデーション（青→白）が露出し、
        左側に不自然な青い帯が出ていた。
     3. マスクの減衰幅が % 指定のため、広い画面ほど左右のぼかしが
        巨大になり、写真が画面端まで届かなかった。
     4. テキストが1200pxコンテナ基準のため、広い画面では中央寄りに見えていた。
   対応
     ・写真は画面幅いっぱいに敷き、青い帯が出ないようにする
     ・マスクは左端のみ 240px の固定幅でぼかし、右端は画面端までベタで出す
     ・テキストは最大1400pxのコンテナ基準にし、通常セクションの
       コンテナ左端（1920pxで360px）とほぼ揃うようにする
   ========================================================= */
@media (min-width: 1200px) {
  .hero .container { max-width: 1400px; }

  .hero-mv {
    left: calc((100vw - min(100vw, 1400px)) / -2);
    right: auto;
    width: 100vw;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 240px, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 240px, #000 100%);
  }

  .hero-mv img { object-position: 62% 26%; }

  /* -------------------------------------------------------
     ヒーローの高さ
     height:100vh のままだと、
       ・縦長の画面（1400px等）：コンテンツ下に31%もの空白ができる
       ・縦が短い画面（800px等）：CTAボタンが19px見切れる
     コンテンツは高さが固定（約620px）で top:25% 起点のため、
     画面の高さに追従させると両端で破綻する。
     コンテンツが収まる範囲（880～940px）に収める。
     ------------------------------------------------------- */
  .hero {
    height: min(100vh, 940px);
    min-height: 880px;
  }
}


section#track {
	background:url(../images/bg/bg01.jpg) 100% 100% no-repeat #a1c5e5;
}
section#reason {
	background:url(../images/bg/bg02.jpg) 0 100% no-repeat;
	background-size:cover;
}
section#about {
	background:url(../images/bg/bg03.jpg) 50% 50% no-repeat;
	background-size:cover;
}
section#market {
	background:url(../images/bg/bg04.png) 50% 0 repeat;
}
section#voice {
	background:url(../images/bg/bg15.jpg) 50% 100% no-repeat #104b8f;
}

@media (min-width: 800px) {
	section#track {
		background-size:cover;
	}
}

.policy-actions {
	padding:1em 0 0.5em;
	display:flex;
	justify-content:center;
	gap:1em;
}
.policy-block {
	padding:1em 1.5em;
}
.policy-block .plain-list li {
	margin-bottom:0;
}
@media (min-width: 800px) {
	.policy-block > :not(h2) {
		padding-left:1.6em
	}
}
@media (max-width: 799px) {
	.policy-block > h2 {
		font-size: 105%;
	}
	.policy-block > :not(h2) {
		font-size:80%;
		line-height:1.5;
	}
	.card.policy-card {
		padding:1em;
	}
}