:root {
  --axa: #1f3366;
  --axa-dark: #172750;
  --blue: #5a7bb5;
  --blue-soft: #d6deee;
  --red: #ff1721;
  --text: #333;
  --text-sub: #555;
  --gray: #efeff1;
  --gray-light: #f7f7f8;
  --line: #ccc;

  --f-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --f-en: "Source Sans 3", "Helvetica Neue", Arial, sans-serif;

  --wrap: 1040px;
  --fv: 540px;
  --u: calc(min(100vw, var(--fv)) / 390);
  --gutter: calc(20 * var(--u));
  --header-h: 0;
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
body {
  font-family: var(--f-jp);
  font-size: calc(15 * var(--u));
  line-height: 2;
  letter-spacing: .05em;
  color: var(--text);
  background: #d5d9e1;
  -webkit-font-smoothing: antialiased;
}
main, .footer { max-width: var(--fv); margin: 0 auto; background: var(--gray); }
main { box-shadow: 0 0 calc(24 * var(--u)) rgba(0, 0, 40, .08); }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }

.wrap { max-width: calc(var(--wrap) + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }
.num { font-family: var(--f-en); font-weight: 700; letter-spacing: .01em; }
.pc { display: none; }
@media (min-width: 99999px) {
  .pc { display: inline; }
  .sp { display: none; }
  :root { --gutter: 40px; --fv: 900px; }
}
h1, h2, h3, h4, summary { word-break: auto-phrase; }

.icon-tel { width: calc(18 * var(--u)); height: calc(18 * var(--u)); fill: currentColor; flex: none; }

.note { margin-top: calc(20 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.8; color: #666; letter-spacing: .03em; }
.note--light { color: rgba(255, 255, 255, .75); }
.note--center { text-align: center; }

/* ---------- CTA ---------- */
.cta {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin: calc(14 * var(--u)) auto 0;
  padding: calc(22 * var(--u)) calc(16 * var(--u)) calc(14 * var(--u));
  border-radius: calc(12 * var(--u));
  background: linear-gradient(180deg, #ff2a36 0%, #e60012 100%);
  box-shadow: 0 calc(5 * var(--u)) 0 #a3000d, 0 calc(8 * var(--u)) calc(18 * var(--u)) rgba(230, 0, 18, .25);
  color: #fff;
  transition: transform .15s, box-shadow .15s;
}
.cta { animation: cta-pulse 1.6s ease-in-out infinite; }
.cta:active { animation: none; transform: translateY(calc(4 * var(--u))); box-shadow: 0 calc(1 * var(--u)) 0 #a3000d, 0 calc(3 * var(--u)) calc(8 * var(--u)) rgba(230, 0, 18, .2); }
@keyframes cta-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}
@media (prefers-reduced-motion: reduce) {
  .cta { animation: none; }
}
.cta::after {
  content: "";
  position: absolute;
  right: calc(18 * var(--u));
  top: 50%;
  width: calc(10 * var(--u));
  height: calc(10 * var(--u));
  margin-top: calc(-2 * var(--u));
  border-top: calc(3 * var(--u)) solid #fff;
  border-right: calc(3 * var(--u)) solid #fff;
  transform: rotate(45deg);
}
.cta__label {
  position: absolute;
  top: calc(-12 * var(--u));
  left: 50%;
  transform: translateX(-50%);
  padding: calc(3 * var(--u)) calc(16 * var(--u));
  border: calc(2 * var(--u)) solid #e60012;
  border-radius: calc(999 * var(--u));
  background: #fff;
  color: #e60012;
  font-size: calc(12 * var(--u));
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .06em;
  white-space: nowrap;
}
.cta__main { display: flex; align-items: center; gap: calc(8 * var(--u)); }
.cta .icon-tel { width: calc(28 * var(--u)); height: calc(28 * var(--u)); }
.cta__text { font-size: calc(22 * var(--u)); font-weight: 700; line-height: 1.4; letter-spacing: 0; white-space: nowrap; }
.cta-wrap { margin-top: calc(28 * var(--u)); }

/* ---------- KV ---------- */
.kv { background: linear-gradient(90deg, #dfe9f6 0%, #f4f7fb 50%, #dfe9f6 100%); }
.kv__inner { max-width: var(--fv); margin: 0 auto; }
.kv__inner img { width: 100%; }

/* ---------- FV stats ---------- */
.purpose { background: #fff; text-align: center; padding: calc(20 * var(--u)) 0 calc(32 * var(--u)); }
.stats { display: grid; grid-template-columns: 1fr 1fr; gap: calc(10 * var(--u)); max-width: calc(560 * var(--u)); margin: 0 auto; }
.stat { overflow: hidden; border: calc(2 * var(--u)) solid var(--axa); border-radius: calc(10 * var(--u)); background: #fff; }
.stat__label { padding: calc(5 * var(--u)) calc(4 * var(--u)); background: var(--axa); color: #fff; font-size: calc(12 * var(--u)); font-weight: 700; line-height: 1.5; letter-spacing: .08em; }
.stat__value { display: flex; align-items: baseline; justify-content: center; padding: calc(18 * var(--u)) calc(4 * var(--u)) calc(12 * var(--u)); color: var(--axa); font-weight: 700; line-height: 1; white-space: nowrap; }
.stat__value .num { font-size: calc(38 * var(--u)); color: #e60012; }
.stat__value .unit { font-size: calc(15 * var(--u)); margin: 0 calc(2 * var(--u)); }
.purpose .stats { margin-top: calc(24 * var(--u)); }
.purpose .cta { margin-top: calc(6 * var(--u)); }
.purpose .note { margin-top: calc(10 * var(--u)); text-align: center; }

.yen { position: relative; display: inline-block; font-weight: 700; line-height: 1; }
.yen__tax {
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translateX(-50%);
  margin-bottom: .08em;
  font-size: .42em;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
}
.from { font-size: .5em; font-weight: 700; margin-left: calc(1 * var(--u)); }
.stat__value .yen { font-size: calc(20 * var(--u)); margin-left: calc(2 * var(--u)); }
.stat__value .from { font-size: calc(13 * var(--u)); }
.card__price-value .yen { font-size: calc(20 * var(--u)); }
.card__price-value .from { font-size: calc(13 * var(--u)); }

@media (min-width: 99999px) {
  .purpose { padding: calc(32 * var(--u)) 0 calc(44 * var(--u)); }
  .stats { gap: calc(20 * var(--u)); }
  .stat { border-radius: calc(12 * var(--u)); }
  .stat__label { padding: calc(8 * var(--u)); font-size: calc(15 * var(--u)); }
  .stat__value { padding: calc(26 * var(--u)) calc(8 * var(--u)) calc(18 * var(--u)); }
  .stat__value .num { font-size: calc(60 * var(--u)); }
  .stat__value .unit { font-size: calc(22 * var(--u)); }
  .stat__value .yen { font-size: calc(30 * var(--u)); }
  .stat__value .from { font-size: calc(18 * var(--u)); }
  .purpose .btn { margin-top: calc(28 * var(--u)); }
}

/* ---------- Section ---------- */
.sec { padding: calc(56 * var(--u)) 0; }
.sec--tight { padding-top: 0; }
.sec--gray { background: var(--gray); }
.sec--line { border-top: calc(1 * var(--u)) solid #dcdee4; }
.sec--white { background: #fff; }
.sec--blue { background: var(--axa); color: #fff; }
.sec__lead { margin-top: calc(20 * var(--u)); font-size: calc(14 * var(--u)); color: var(--text-sub); line-height: 1.9; text-align: center; }
.sec__lead--light { color: rgba(255, 255, 255, .85); }

.ttl {
  position: relative;
  padding-bottom: calc(20 * var(--u));
  font-size: calc(22 * var(--u));
  font-weight: 700;
  line-height: 1.5;
  color: var(--axa);
  letter-spacing: .06em;
  text-align: center;
}
.ttl::before, .ttl::after { content: ""; position: absolute; bottom: 0; height: calc(1 * var(--u)); }
.ttl::before { left: 0; right: 0; background: #ddd; }
.ttl::after { left: 50%; width: calc(34 * var(--u)); height: calc(2 * var(--u)); bottom: calc(-.5 * var(--u)); margin-left: calc(-17 * var(--u)); background: var(--red); }
.ttl--light { color: #fff; }
.ttl--light::before { background: rgba(255, 255, 255, .7); }
.ttl--sub { margin-top: calc(56 * var(--u)); font-size: calc(18 * var(--u)); }

@media (min-width: 99999px) {
  .sec { padding: calc(80 * var(--u)) 0; }
  .sec--tight { padding-top: 0; }
  .ttl { font-size: calc(24 * var(--u)); }
  .ttl--sub { font-size: calc(20 * var(--u)); margin-top: calc(72 * var(--u)); }
  .sec__lead { font-size: calc(15 * var(--u)); }
  }

/* ---------- Worry (症状) ---------- */
.worry__head { text-align: center; }
.worry__badge {
  position: relative;
  display: inline-block;
  margin-bottom: calc(18 * var(--u));
  padding: calc(7 * var(--u)) calc(22 * var(--u));
  border-radius: calc(999 * var(--u));
  background: var(--axa);
  color: #fff;
  font-size: calc(13 * var(--u));
  font-weight: 700;
  letter-spacing: .08em;
}
.worry__badge::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: calc(-6 * var(--u));
  margin-left: calc(-6 * var(--u));
  border: calc(6 * var(--u)) solid transparent;
  border-bottom: 0;
  border-top-color: var(--axa);
}
.worry { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: calc(10 * var(--u)); margin-top: calc(28 * var(--u)); }
.worry__item {
  container-type: inline-size;
  aspect-ratio: 1 / 1;
  border-radius: calc(12 * var(--u));
  background: #fff;
  box-shadow: 0 calc(2 * var(--u)) calc(10 * var(--u)) rgba(0, 0, 60, .08);
}
.worry__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 6cqw;
  text-align: center;
}
.worry__icon { width: 40cqw; height: 40cqw; }
.worry__text {
  margin-top: 5cqw;
  font-size: 7cqw;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0;
  color: var(--text);
  white-space: nowrap;
}
.worry__text em { font-style: normal; color: var(--axa); }
.worry__foot { margin-top: calc(28 * var(--u)); text-align: center; }
.worry__arrow { display: block; width: calc(16 * var(--u)); height: calc(36 * var(--u)); margin: 0 auto; color: var(--axa); fill: currentColor; overflow: visible; }
.worry__arrow circle { animation: arrow-dot 1.4s ease-in-out infinite; }
.worry__arrow circle:nth-of-type(2) { animation-delay: .15s; }
.worry__arrow circle:nth-of-type(3) { animation-delay: .3s; }
.worry__arrow path { animation: arrow-drop 1.4s ease-in-out .45s infinite; }
@keyframes arrow-dot {
  0%, 60%, 100% { opacity: .25; }
  20% { opacity: 1; }
}
@keyframes arrow-drop {
  0%, 60%, 100% { transform: translateY(0); }
  25% { transform: translateY(calc(5 * var(--u))); }
}
@media (prefers-reduced-motion: reduce) {
  .worry__arrow circle, .worry__arrow path { animation: none; }
}
.worry__lead { margin-top: calc(14 * var(--u)); padding: calc(18 * var(--u)) calc(12 * var(--u)) calc(20 * var(--u)); border-radius: calc(12 * var(--u)); background: #fff; box-shadow: 0 calc(2 * var(--u)) calc(10 * var(--u)) rgba(0, 0, 60, .08); font-weight: 700; color: var(--axa); line-height: 1.5; }
.worry__lead-sub { display: block; font-size: calc(15 * var(--u)); color: var(--text); letter-spacing: .06em; }
.worry__lead-main { display: block; margin-top: calc(6 * var(--u)); font-size: calc(21 * var(--u)); letter-spacing: .04em; }
.worry__lead strong {
  color: var(--red);
  font-size: 1.2em;
  background: linear-gradient(transparent 68%, rgba(255, 23, 33, .16) 68%);
  padding: 0 calc(2 * var(--u));
}

@media (min-width: 99999px) {
  .worry { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: calc(760 * var(--u)); margin: calc(36 * var(--u)) auto 0; gap: calc(14 * var(--u)); }
  .worry__item { border-radius: calc(14 * var(--u)); box-shadow: 0 calc(4 * var(--u)) calc(16 * var(--u)) rgba(0, 0, 60, .08); }
  .worry__foot { margin-top: calc(24 * var(--u)); }
  .worry__lead-sub { font-size: calc(17 * var(--u)); }
  .worry__lead-main { font-size: calc(32 * var(--u)); }
}

/* ---------- Panel (対応方法) ---------- */
.panel { margin: calc(28 * var(--u)) calc(var(--gutter) * -1) 0; background: #e4e9f3; padding: calc(24 * var(--u)) calc(10 * var(--u)) calc(12 * var(--u)); }
.panel__title { color: var(--axa); text-align: center; font-size: calc(19 * var(--u)); font-weight: 700; line-height: 1.4; letter-spacing: .08em; }
.panel__title em { font-style: normal; font-size: 1.5em; color: #e60012; margin: 0 calc(2 * var(--u)); }
.panel__cards { display: grid; gap: calc(20 * var(--u)); margin-top: calc(20 * var(--u)); }
.card { display: flex; flex-direction: column; background: #fff; }
.card__body { flex: 1; display: flex; flex-direction: column; }
.card__head {
  background: var(--blue);
  color: #fff;
  text-align: center;
  font-size: calc(17 * var(--u));
  font-weight: 700;
  padding: calc(10 * var(--u));
  border-bottom: calc(3 * var(--u)) solid var(--axa);
  letter-spacing: .06em;
}
.card__body { padding: calc(14 * var(--u)) calc(14 * var(--u)) calc(18 * var(--u)); }
.card__img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.card__lead {
  margin: calc(16 * var(--u)) 0 calc(18 * var(--u));
  text-align: center;
  font-size: calc(15 * var(--u));
  letter-spacing: .02em;
  font-weight: 700;
  color: var(--axa);
  line-height: 1.7;
}
.card__lead .nb { display: block; white-space: nowrap; }
.card__price {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: calc(4 * var(--u)) calc(12 * var(--u));
  min-height: calc(64 * var(--u));
  margin-top: auto;
  padding-top: calc(14 * var(--u));
  border-top: calc(1 * var(--u)) solid #dcdce4;
  color: var(--axa);
}
.card__price-label { font-size: calc(12 * var(--u)); color: var(--text-sub); }
.card__price-value { margin-left: auto; font-weight: 700; font-size: calc(16 * var(--u)); line-height: 1.2; white-space: nowrap; }
.card__price-value .num { font-size: calc(36 * var(--u)); margin-right: calc(2 * var(--u)); }
.card__price-value--text { font-size: calc(26 * var(--u)); color: #e60012; letter-spacing: .04em; }

@media (min-width: 99999px) {
  .panel { padding: calc(36 * var(--u)) calc(28 * var(--u)) calc(28 * var(--u)); margin-top: calc(36 * var(--u)); }
  .panel__title { font-size: calc(18 * var(--u)); }
  .panel__cards { grid-template-columns: 1fr 1fr; gap: calc(28 * var(--u)); margin-top: calc(26 * var(--u)); }
  .card__head { font-size: calc(18 * var(--u)); padding: calc(12 * var(--u)); }
  .card__body { padding: calc(24 * var(--u)) calc(28 * var(--u)) calc(26 * var(--u)); }
}

/* ---------- Reason ---------- */
.reason-img { background: #fff; padding-bottom: calc(8 * var(--u)); }
/* 画像内の固定番号を含む下部を表示せず、連絡先はHTMLで表示する。 */
.reason-img__visual { aspect-ratio: 1024 / 675; overflow: hidden; }
.reason-img img { width: 100%; }
.reason-img__contact { padding: calc(14 * var(--u)) var(--gutter); background: linear-gradient(135deg, #0059a9, #003879); color: #fff; text-align: center; }
.reason-img__lead { margin-bottom: calc(22 * var(--u)); font-size: calc(13 * var(--u)); font-weight: 700; }
.reason-img__benefits { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: calc(16 * var(--u)); font-size: calc(10 * var(--u)); font-weight: 700; line-height: 1.6; }
.reason-img__benefits li { padding: 0 calc(4 * var(--u)); }
.reason-img__benefits li + li { border-left: 1px solid rgba(255, 255, 255, .4); }
.reason-img__benefits span { display: block; font-size: calc(8 * var(--u)); }
.reason-img .note { margin: calc(10 * var(--u)) var(--gutter) 0; }

/* ---------- Quiz ---------- */
.quiz__head { text-align: center; }
.quiz__sub { margin-top: calc(14 * var(--u)); font-size: calc(14 * var(--u)); font-weight: 700; line-height: 1.7; color: var(--text-sub); }

/* ---------- Popup ---------- */
.pop {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(24 * var(--u));
  background: rgba(10, 20, 50, .6);
  animation: pop-fade .25s ease;
}
.pop[hidden] { display: none; }
.pop__card {
  position: relative;
  width: 100%;
  max-width: calc(340 * var(--u));
  padding: calc(34 * var(--u)) calc(22 * var(--u)) calc(18 * var(--u));
  border-radius: calc(16 * var(--u));
  background: #fff;
  text-align: center;
  box-shadow: 0 calc(12 * var(--u)) calc(40 * var(--u)) rgba(0, 0, 40, .3);
  animation: pop-in .35s cubic-bezier(.2, 1.4, .4, 1);
}
.pop__close { position: absolute; top: calc(10 * var(--u)); right: calc(10 * var(--u)); width: calc(32 * var(--u)); height: calc(32 * var(--u)); border: 0; border-radius: 50%; background: var(--gray); cursor: pointer; }
.pop__close::before, .pop__close::after { content: ""; position: absolute; top: 50%; left: 50%; width: calc(14 * var(--u)); height: calc(2 * var(--u)); margin: calc(-1 * var(--u)) 0 0 calc(-7 * var(--u)); background: var(--text-sub); transform: rotate(45deg); }
.pop__close::after { transform: rotate(-45deg); }
.pop__title { font-size: calc(23 * var(--u)); font-weight: 700; line-height: 1.4; color: var(--axa); }
.pop__choices { display: grid; grid-template-columns: 1fr 1fr; gap: calc(10 * var(--u)); margin-top: calc(18 * var(--u)); }
.pop__choices li { display: flex; flex-direction: column; align-items: center; padding: calc(10 * var(--u)) calc(4 * var(--u)) calc(12 * var(--u)); border: calc(2 * var(--u)) solid var(--blue-soft); border-radius: calc(12 * var(--u)); }
.pop__choices img { width: 72%; }
.pop__choices span { margin-top: calc(6 * var(--u)); font-size: calc(14 * var(--u)); font-weight: 700; line-height: 1.4; color: var(--axa); white-space: nowrap; }
.pop__text { margin-top: calc(16 * var(--u)); font-size: calc(16 * var(--u)); font-weight: 700; line-height: 1.6; color: var(--text); }
.pop__text em { font-style: normal; font-size: 1.2em; color: #e60012; }
.pop__btn { display: block; margin-top: calc(18 * var(--u)); padding: calc(14 * var(--u)); border-radius: calc(10 * var(--u)); background: linear-gradient(180deg, #ff2a36 0%, #e60012 100%); box-shadow: 0 calc(4 * var(--u)) 0 #a3000d; color: #fff; font-size: calc(17 * var(--u)); font-weight: 700; letter-spacing: .06em; }
.pop__later { margin-top: calc(10 * var(--u)); padding: calc(6 * var(--u)) calc(12 * var(--u)); border: 0; background: none; font: inherit; font-size: calc(13 * var(--u)); color: var(--text-sub); text-decoration: underline; cursor: pointer; }
@keyframes pop-fade { from { opacity: 0; } }
@keyframes pop-in { from { opacity: 0; transform: scale(.85); } }
@media (prefers-reduced-motion: reduce) {
  .pop, .pop__card { animation: none; }
}
.quiz__q, .quiz__result { margin-top: calc(28 * var(--u)); transition: opacity .35s, filter .35s; }
.quiz__q[data-q="2"],
.quiz__q[data-q="3"],
.quiz__result { opacity: .3; filter: grayscale(1) brightness(.85); pointer-events: none; user-select: none; }
.quiz__result { filter: grayscale(1) brightness(.85) blur(calc(3 * var(--u))); }
#quiz:has(input[name="q1"]:checked) .quiz__q[data-q="2"],
#quiz:has(input[name="q2"]:checked) .quiz__q[data-q="3"],
#quiz:has(input[name="q3"]:checked) .quiz__result { opacity: 1; filter: none; pointer-events: auto; user-select: auto; }
.quiz__title { font-size: calc(17 * var(--u)); font-weight: 700; line-height: 1.5; color: var(--axa); letter-spacing: .04em; }
.quiz__no { margin-right: calc(4 * var(--u)); font-family: var(--f-en); font-size: calc(20 * var(--u)); color: #e60012; }
.quiz__opts { display: grid; grid-template-columns: 1fr 1fr; gap: calc(10 * var(--u)); margin-top: calc(12 * var(--u)); }
.quiz__opt {
  position: relative;
  display: flex;
  text-align: center;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
  padding: 0 0 calc(10 * var(--u));
  border: calc(2 * var(--u)) solid var(--blue-soft);
  border-radius: calc(10 * var(--u));
  background: #fff;
  font: inherit;
  color: var(--text);
  cursor: pointer;
  box-shadow: 0 calc(3 * var(--u)) 0 var(--blue-soft);
  transition: border-color .2s, box-shadow .2s, transform .1s;
}
.quiz__opt:active { transform: translateY(calc(2 * var(--u))); box-shadow: 0 calc(1 * var(--u)) 0 var(--blue-soft); }
.quiz__opt-label {
  align-self: stretch;
  padding: calc(7 * var(--u)) calc(4 * var(--u));
  background: var(--blue);
  color: #fff;
  font-size: calc(14 * var(--u));
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .02em;
  transition: background-color .2s;
}
.quiz__opt-img { width: 58%; margin-top: calc(6 * var(--u)); }
.quiz__opt-sub { margin-top: calc(10 * var(--u)); font-size: calc(12 * var(--u)); font-weight: 500; line-height: 1.4; color: var(--text-sub); }
.quiz__opt input { position: absolute; opacity: 0; pointer-events: none; }
.quiz__opt:has(input:checked) { border-color: #e60012; box-shadow: 0 calc(3 * var(--u)) 0 #e60012; }
.quiz__opt:has(input:checked) .quiz__opt-label { background: #e60012; }
.quiz__opt:has(input:focus-visible) { outline: calc(2 * var(--u)) solid var(--axa); outline-offset: calc(2 * var(--u)); }
.result[data-type="change"] { display: none; }
#quiz:has(input[value="old"]:checked, input[value="often"]:checked) .result[data-type="jump"] { display: none; }
#quiz:has(input[value="old"]:checked, input[value="often"]:checked) .result[data-type="change"] { display: block; }
.where[data-w] { display: none; }
#quiz:has(input[name="q3"]:checked) .where--default { display: none; }
#quiz:has(input[value="home"]:checked) .where[data-w="home"],
#quiz:has(input[value="work"]:checked) .where[data-w="work"],
#quiz:has(input[value="outside"]:checked) .where[data-w="outside"],
#quiz:has(input[value="road"]:checked) .where[data-w="road"] { display: inline; }

.quiz__thanks { text-align: center; font-size: calc(16 * var(--u)); font-weight: 700; color: var(--axa); }
.result { position: relative; margin-top: calc(22 * var(--u)); padding: calc(26 * var(--u)) calc(16 * var(--u)) calc(20 * var(--u)); border: calc(2 * var(--u)) solid #e60012; border-radius: calc(12 * var(--u)); background: #fff; text-align: center; }
.result__tag {
  position: absolute;
  top: calc(-13 * var(--u));
  left: 50%;
  transform: translateX(-50%);
  padding: calc(2 * var(--u)) calc(16 * var(--u));
  border-radius: calc(999 * var(--u));
  background: #e60012;
  color: #fff;
  font-size: calc(13 * var(--u));
  font-weight: 700;
  line-height: 1.6;
  white-space: nowrap;
}
.result__name { font-size: calc(19 * var(--u)); font-weight: 700; line-height: 1.5; color: var(--axa); }
.result__price { display: flex; align-items: baseline; justify-content: center; margin-top: calc(18 * var(--u)); color: #e60012; font-weight: 700; line-height: 1; }
.result__price .num { font-size: calc(52 * var(--u)); }
.result__price .yen { font-size: calc(26 * var(--u)); margin-left: calc(2 * var(--u)); }
.result__price .from { font-size: calc(16 * var(--u)); }
.result__price--text { margin-top: calc(10 * var(--u)); font-size: calc(32 * var(--u)); letter-spacing: .04em; }
.result__text { margin-top: calc(14 * var(--u)); font-size: calc(14 * var(--u)); font-weight: 500; line-height: 1.8; color: var(--text-sub); }
.quiz__where { margin-top: calc(18 * var(--u)); text-align: center; font-size: calc(15 * var(--u)); font-weight: 700; color: var(--axa); }
.quiz__where b { color: #e60012; }
.quiz__result .cta { margin-top: calc(24 * var(--u)); }

/* ---------- Points ---------- */
.points { margin-top: calc(28 * var(--u)); }
.point { padding: calc(28 * var(--u)) 0; border-bottom: calc(1 * var(--u)) solid #ddd; }
.point:first-child { padding-top: 0; }
.point:last-child { border-bottom: 0; padding-bottom: 0; }
.point__img { position: relative; padding-top: calc(18 * var(--u)); }
.point__img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.point__num {
  position: absolute; top: 0; left: 0; z-index: 1;
  padding: calc(6 * var(--u)) calc(30 * var(--u)) calc(5 * var(--u)) calc(18 * var(--u));
  background: var(--axa); color: #fff;
  font-family: var(--f-en); font-size: calc(20 * var(--u)); font-weight: 600; line-height: 1.2; letter-spacing: .04em;
  clip-path: polygon(0 0, 100% 0, calc(100% - calc(16 * var(--u))) 100%, 0 100%);
}
.point__body { margin-top: calc(20 * var(--u)); }
.point__title { display: flex; flex-direction: column; align-items: flex-start; gap: calc(6 * var(--u)); }
.point__sub { font-size: calc(15 * var(--u)); font-weight: 700; color: var(--blue); letter-spacing: .05em; }
.point__main {
  font-size: calc(22 * var(--u)); font-weight: 700; color: var(--axa); line-height: 1.4; letter-spacing: .04em;
  background: linear-gradient(transparent 62%, var(--blue-soft) 62%, var(--blue-soft) 92%, transparent 92%);
  padding: 0 calc(2 * var(--u));
}
.point__text { margin-top: calc(16 * var(--u)); font-size: calc(14 * var(--u)); line-height: 1.9; color: var(--text); }
.point__note { margin-top: calc(6 * var(--u)); font-size: calc(11 * var(--u)); line-height: 1.7; color: var(--text-sub); }

@media (min-width: 99999px) {
  .points { margin-top: calc(40 * var(--u)); }
  .point { display: grid; grid-template-columns: 40% 1fr; gap: calc(32 * var(--u)); align-items: start; padding: calc(32 * var(--u)) 0; }
  .point__body { margin-top: calc(18 * var(--u)); }
  .point__main { font-size: calc(26 * var(--u)); }
  .point__text { margin-top: calc(26 * var(--u)); font-size: calc(15 * var(--u)); }
  .point__num { font-size: calc(24 * var(--u)); padding: calc(6 * var(--u)) calc(36 * var(--u)) calc(5 * var(--u)) calc(22 * var(--u)); }
}
@media (min-width: 99999px) {
  .point { gap: calc(40 * var(--u)); }
  .point__main { font-size: calc(30 * var(--u)); }
}

/* ---------- Steps ---------- */
.steps { display: grid; gap: calc(14 * var(--u)); margin-top: calc(28 * var(--u)); }
.step { background: #fff; border: calc(1 * var(--u)) solid var(--axa); padding: calc(22 * var(--u)) calc(22 * var(--u)) calc(20 * var(--u)); }
.step__img { width: 100%; max-width: calc(240 * var(--u)); margin: calc(-6 * var(--u)) auto calc(14 * var(--u)); aspect-ratio: 4 / 3; object-fit: contain; }
.step__num { font-family: var(--f-en); font-weight: 600; font-size: calc(13 * var(--u)); letter-spacing: .1em; color: var(--axa); }
.step__title { margin-top: calc(2 * var(--u)); font-size: calc(18 * var(--u)); font-weight: 500; color: var(--axa); letter-spacing: .06em; }
.step__text { margin-top: calc(8 * var(--u)); font-size: calc(14 * var(--u)); color: var(--text-sub); line-height: 1.85; }

@media (max-width: 767px) {
  .step { display: grid; grid-template-columns: calc(112 * var(--u)) 1fr; column-gap: calc(16 * var(--u)); align-items: center; padding: calc(18 * var(--u)) calc(18 * var(--u)) calc(18 * var(--u)) calc(14 * var(--u)); }
  .step__img { grid-row: 1 / 4; margin: 0; }
  .step__title { font-size: calc(17 * var(--u)); }
  .step__text { margin-top: calc(4 * var(--u)); font-size: calc(13 * var(--u)); line-height: 1.75; }
}
@media (min-width: 99999px) {
  .steps { grid-template-columns: repeat(4, 1fr); gap: calc(12 * var(--u)); margin-top: calc(36 * var(--u)); }
  .step { padding: calc(22 * var(--u)) calc(14 * var(--u)) calc(20 * var(--u)); text-align: center; }
  .step__title { font-size: calc(16 * var(--u)); letter-spacing: .02em; }
  .step__text { font-size: calc(13 * var(--u)); text-align: left; }
}
@media (min-width: 99999px) {
  .steps { gap: calc(20 * var(--u)); }
  .step { padding: calc(28 * var(--u)) calc(22 * var(--u)) calc(26 * var(--u)); }
  .step__title { font-size: calc(18 * var(--u)); letter-spacing: .06em; }
  .step__text { font-size: calc(14 * var(--u)); text-align: center; }
}

/* ---------- FAQ ---------- */
.faq { margin-top: calc(28 * var(--u)); border-top: calc(1 * var(--u)) solid #ddd; }
.faq__item { border-bottom: calc(1 * var(--u)) solid #ddd; }
.faq__item summary {
  position: relative;
  display: block;
  list-style: none;
  cursor: pointer;
  padding: calc(18 * var(--u)) calc(40 * var(--u)) calc(18 * var(--u)) calc(34 * var(--u));
  font-weight: 700;
  font-size: calc(15 * var(--u));
  line-height: 1.7;
  color: var(--axa);
}
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::before {
  content: "Q";
  position: absolute;
  left: calc(2 * var(--u));
  top: calc(16 * var(--u));
  font-family: var(--f-en);
  font-weight: 700;
  font-size: calc(19 * var(--u));
  color: var(--axa);
}
.faq__item summary::after {
  content: "";
  position: absolute;
  right: calc(8 * var(--u));
  top: 50%;
  width: calc(9 * var(--u));
  height: calc(9 * var(--u));
  margin-top: calc(-7 * var(--u));
  border-right: calc(2 * var(--u)) solid var(--axa);
  border-bottom: calc(2 * var(--u)) solid var(--axa);
  transform: rotate(45deg);
  transition: transform .25s;
}
.faq__item[open] summary::after { transform: rotate(-135deg); margin-top: calc(-2 * var(--u)); }
.faq__item p { padding: 0 calc(8 * var(--u)) calc(22 * var(--u)) calc(34 * var(--u)); font-size: calc(14 * var(--u)); line-height: 1.95; color: var(--text-sub); }

@media (min-width: 99999px) {
  .faq { margin-top: calc(36 * var(--u)); }
  .faq__item summary { font-size: calc(16 * var(--u)); padding: calc(22 * var(--u)) calc(48 * var(--u)) calc(22 * var(--u)) calc(40 * var(--u)); }
  .faq__item summary::before { top: calc(20 * var(--u)); }
  .faq__item p { padding-left: calc(40 * var(--u)); font-size: calc(15 * var(--u)); }
}

/* ---------- Banner ---------- */
.banner {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(180deg, rgba(31, 51, 102, .92) 0%, rgba(31, 51, 102, .8) 55%, rgba(31, 51, 102, .6) 100%),
    url(img/cta-banner-sp.jpg) 60% center / cover no-repeat;
}
.banner-img { display: none; }
.banner-img img { width: 100%; }
@media (min-width: 99999px) {
  .banner { display: none; }
  .banner-img { display: block; transition: opacity .2s; }
  .banner-img:hover { opacity: .9; }
}
.banner__body { padding: calc(36 * var(--u)) calc(22 * var(--u)) calc(32 * var(--u)); }
.banner__title { font-size: calc(22 * var(--u)); font-weight: 700; line-height: 1.6; letter-spacing: .06em; }
.banner__text { display: flex; flex-direction: column; gap: calc(4 * var(--u)); margin: calc(16 * var(--u)) 0 calc(22 * var(--u)); font-size: calc(15 * var(--u)); font-weight: 700; }
.banner__row { line-height: 1.3; white-space: nowrap; }
.banner__row .num { margin: 0 calc(2 * var(--u)); font-size: calc(26 * var(--u)); }
.banner__row:first-child { padding-top: calc(6 * var(--u)); }
.banner__row:first-child .num { margin-left: calc(6 * var(--u)); font-size: calc(32 * var(--u)); }
.banner__row .yen { font-size: calc(17 * var(--u)); }
.banner__row .from { font-size: calc(13 * var(--u)); }
@media (min-width: 99999px) {
  .banner__body { padding: calc(52 * var(--u)) calc(56 * var(--u)) calc(44 * var(--u)); max-width: calc(640 * var(--u)); }
  .banner__title { font-size: calc(30 * var(--u)); }
  .banner__text { font-size: calc(17 * var(--u)); margin: calc(18 * var(--u)) 0 calc(28 * var(--u)); }
}

/* ---------- Footer ---------- */
.footer { background: #fff; padding: calc(40 * var(--u)) 0 calc(calc(96 * var(--u)) + env(safe-area-inset-bottom)); }
.footer__logo { height: calc(36 * var(--u)); width: auto; margin: 0 auto; }
.footer__copy {
  margin-top: calc(24 * var(--u));
  padding: 0 var(--gutter);
  text-align: center;
  font-family: var(--f-en);
  font-size: calc(12 * var(--u));
  color: #777;
}
@media (min-width: 99999px) {
  .footer { padding-bottom: calc(32 * var(--u)); }
}

/* ---------- Dock ---------- */
.dock {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 60;
  display: block;
  max-width: var(--fv);
  margin: 0 auto;
  padding: calc(6 * var(--u)) calc(8 * var(--u)) calc(calc(6 * var(--u)) + env(safe-area-inset-bottom));
  background: transparent;
  transition: transform .35s ease;
}
.js .dock { transform: translateY(110%); }
.js .dock.is-visible { transform: none; }
.dock__inner { position: relative; display: block; overflow: hidden; border-radius: calc(6 * var(--u)); filter: drop-shadow(0 calc(4 * var(--u)) calc(10 * var(--u)) rgba(0, 0, 40, .18)); }
.dock img { width: 100%; }
.dock__inner::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -40%;
  width: 30%;
  background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, .75) 50%, transparent 100%);
  transform: skewX(-20deg);
  animation: dock-shine 3s ease-in-out infinite;
  pointer-events: none;
}
@keyframes dock-shine {
  0% { left: -40%; }
  35%, 100% { left: 130%; }
}
@media (prefers-reduced-motion: reduce) {
  .dock__inner::after { animation: none; display: none; }
}

.nb { display: inline-block; }

/* ---------- Payment logos ---------- */
.paylogos { display: grid; grid-template-columns: repeat(5, 1fr); gap: calc(6 * var(--u)); margin-top: calc(14 * var(--u)); }
.paylogos li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(40 * var(--u));
  padding: calc(6 * var(--u));
  border: calc(1 * var(--u)) solid #dcdee4;
  border-radius: calc(6 * var(--u));
  background: #fff;
}
.paylogos img { max-width: 100%; max-height: 100%; width: auto; height: auto; }

/* ---------- Marquee (endless scroll) ---------- */
.marquee { overflow: hidden; }
.marquee__track { display: flex; width: max-content; animation: marquee 60s linear infinite; }
.marquee__track--rev { animation-direction: reverse; }
.marquee:active .marquee__track { animation-play-state: paused; }
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .marquee { overflow-x: auto; }
  .marquee__track { animation: none; }
}

/* ---------- Works (出動実績) ---------- */
.works { background: linear-gradient(180deg, var(--axa) 0%, var(--axa-dark) 100%); }
.works__head { text-align: center; }
.works__eyebrow { margin-bottom: calc(6 * var(--u)); font-family: var(--f-en); font-size: calc(12 * var(--u)); font-weight: 700; letter-spacing: .2em; color: rgba(255, 255, 255, .6); }
.record {
  margin-top: calc(28 * var(--u));
  padding: calc(22 * var(--u)) calc(16 * var(--u)) calc(20 * var(--u));
  border-radius: calc(12 * var(--u));
  background: #fff;
  color: var(--axa);
  text-align: center;
  box-shadow: 0 calc(6 * var(--u)) calc(18 * var(--u)) rgba(0, 0, 30, .25);
}
.record__label { display: inline-block; padding: calc(4 * var(--u)) calc(16 * var(--u)); border-radius: calc(999 * var(--u)); background: var(--axa); color: #fff; font-size: calc(13 * var(--u)); font-weight: 700; letter-spacing: .08em; }
.record__value { margin-top: calc(6 * var(--u)); font-size: calc(24 * var(--u)); font-weight: 700; line-height: 1.2; }
.record__value .num { margin-right: calc(4 * var(--u)); font-family: var(--f-en); font-size: calc(60 * var(--u)); color: #e60012; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.record__tags { display: flex; justify-content: center; margin-top: calc(10 * var(--u)); }
.record__tags li { font-size: calc(12 * var(--u)); font-weight: 700; color: var(--text-sub); white-space: nowrap; }
.record__tags li + li::before { content: "／"; margin: 0 calc(1 * var(--u)); color: #bbb; font-weight: 400; }
.works__sub { margin-top: calc(36 * var(--u)); font-size: calc(18 * var(--u)); font-weight: 700; color: #fff; letter-spacing: .08em; text-align: center; }
.works__sub::after { content: ""; display: block; width: calc(34 * var(--u)); height: calc(2 * var(--u)); margin: calc(10 * var(--u)) auto 0; background: var(--red); }
.works__gallery { display: grid; gap: calc(8 * var(--u)); margin-top: calc(20 * var(--u)); }
.works__photo { flex: none; width: calc(148 * var(--u)); margin-right: calc(8 * var(--u)); }
.works__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: calc(6 * var(--u)); }

/* ---------- Voice (お客様の声 / Googleクチコミ風) ---------- */
.voice__score { display: flex; align-items: center; justify-content: center; gap: calc(14 * var(--u)); margin-top: calc(24 * var(--u)); }
.voice__score-num { font-size: calc(24 * var(--u)); font-weight: 700; color: #e60012; line-height: 1; }
.voice__score-num .num { font-family: var(--f-en); font-size: calc(56 * var(--u)); }
.voice__score-text { font-size: calc(14 * var(--u)); line-height: 1.6; color: var(--text); }
.voice__score-text b { color: var(--axa); font-size: calc(16 * var(--u)); }
.voice__score-note { margin-top: calc(4 * var(--u)); font-size: calc(10.5 * var(--u)); color: #888; text-align: center; }
.marquee--voice { margin-top: calc(22 * var(--u)); padding: calc(4 * var(--u)) 0 calc(10 * var(--u)); }
.marquee--voice .marquee__track { animation-duration: 90s; }
.review {
  flex: none;
  width: calc(270 * var(--u));
  margin-right: calc(12 * var(--u));
  padding: calc(16 * var(--u));
  border: calc(1 * var(--u)) solid #dadce0;
  border-radius: calc(10 * var(--u));
  background: #fff;
  box-shadow: 0 calc(1 * var(--u)) calc(3 * var(--u)) rgba(60, 64, 67, .15);
  font-family: Roboto, "Hiragino Sans", "Noto Sans JP", sans-serif;
  color: #202124;
}
.review__head { display: flex; align-items: center; gap: calc(10 * var(--u)); }
.review__avatar { display: grid; place-items: center; flex: none; width: calc(36 * var(--u)); height: calc(36 * var(--u)); border-radius: 50%; color: #fff; font-size: calc(16 * var(--u)); font-weight: 500; }
.review__who { display: flex; flex-direction: column; line-height: 1.35; }
.review__who b { font-size: calc(14 * var(--u)); font-weight: 500; }
.review__who span { font-size: calc(12 * var(--u)); color: #70757a; }
.review__rate { display: flex; align-items: center; gap: calc(8 * var(--u)); margin-top: calc(10 * var(--u)); }
.review__stars { font-size: calc(14 * var(--u)); color: #fbbc04; letter-spacing: .05em; line-height: 1; }
.review__tags { display: flex; gap: calc(4 * var(--u)); }
.review__tags span { padding: calc(1 * var(--u)) calc(7 * var(--u)); border-radius: calc(999 * var(--u)); background: #f1f3f4; font-size: calc(10.5 * var(--u)); color: #5f6368; white-space: nowrap; }
.review__title { margin-top: calc(8 * var(--u)); font-size: calc(14 * var(--u)); font-weight: 700; line-height: 1.5; }
.review__text { margin-top: calc(4 * var(--u)); font-size: calc(13 * var(--u)); line-height: 1.7; color: #3c4043; }
