:root {
  --color-text-dark: #453d37;
  --color-text-darker: #332d28;
  --color-orange: #e37401;
  --color-orange2: #e57604;
  --color-green: #00bc90;
  --color-cream: #fff8ef;
  --font-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

* { box-sizing: border-box; }

/* 装飾などの横方向はみ出しで右端に余白(横スクロール)が出るのを防ぐ */
html { overflow-x: hidden; }

body {
  margin: 0;
  font-family: var(--font-jp);
  background: #fff;
  position: relative;
  order: 0;
  overflow-x: hidden;
}

.sp-disp {
  display: none;
}
.pc-disp {
  display: inherit;
}
@media screen and (max-width: 500px) {

  .sp-disp {
    display: inherit;
  }
  .pc-disp {
    display: none;
  }

}

.fv {
  position: relative;
  width: 100%;
  height: 1400px;
  margin: 0 auto;
  background-color: var(--color-cream);
  background-image: url("assets/FV_bg02.webp"), url("assets/FV_bg01.webp");
  background-repeat: no-repeat, no-repeat;
  background-size: 48% auto, 42.4% auto;
  background-position: right -0.7vw top 0, left -2vw top 22.2vw;
  overflow: hidden;
}

.fv-inner {
  position: relative;
  width: 1440px;
  max-width: 100%;
  height: 100%;
  margin: 0 auto;
}

/* ===== ヘッダー ===== */
.fv-header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 74px;
  background: var(--color-text-dark);
  z-index: 2;
}

.fv-header__inner {
  width: 1440px;
  max-width: 100%;
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.fv-header__text {
  margin: 0;
  padding-left: 245px;
  color: #fff;
  font-size: 24px;
  font-weight: 500;
}

.fv-header__text .accent {
  color: #ffae30;
  font-weight: 700;
  font-size: 32px;
}

/* =========================================================
   FV 登場アニメーション（順番にふわっと表示）
   ① .fv-titlebadge  ② .fv-hero  ③ .fv-headline--1 / --2
   ①③は画面左側からフェードイン
   ========================================================= */
@keyframes fvFadeInLeft {
  from { opacity: 0; transform: translateX(-60px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes fvFadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

.fv-titlebadge,
.fv-hero,
.fv-headline--1,
.fv-headline--2,
.fv-stat--1,
.fv-stat--2,
.fv-stat--3{
  opacity: 0;
  animation-duration: 0.9s;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
  animation-fill-mode: forwards;
}

/* ① タイトルリボン（左からフェードイン） */
.fv-titlebadge  { animation-name: fvFadeInLeft; animation-delay: 0.2s; }
/* ② ヒーロー（ふわっと上へ） */
.fv-hero        { animation-name: fvFadeInUp;   animation-delay: 0.8s; }
.fv-stat--1{ animation-name: fvFadeInUp;   animation-delay: 1.8s; }
.fv-stat--2{ animation-name: fvFadeInUp;   animation-delay: 2s; }
.fv-stat--3{ animation-name: fvFadeInUp;   animation-delay: 2.2s; }
/* ③ 見出し（左からフェードイン） */
.fv-headline--1 { animation-name: fvFadeInLeft; animation-delay: 1.4s; }
.fv-headline--2 { animation-name: fvFadeInLeft; animation-delay: 1.7s; }

/* アニメーションを控えたいユーザー設定に配慮 */
@media (prefers-reduced-motion: reduce) {
  .fv-titlebadge,
  .fv-hero,
  .fv-headline--1,
  .fv-headline--2 {
    opacity: 1;
    animation: none;
  }
}


.fv-titlebadge {
  position: absolute;
  top: 117px;
  left: 0;
  width: 678px;
  height: auto;
}

.fv-headline {
  position: absolute;
  height: auto;
}
.fv-headline--1 { top: 291px; left: 87px; width: 588px; }
.fv-headline--2 {top: 380px;left: 138px;width: 682px;}

/* ===== AIアイコン ===== */
.fv-ai-icon {
  position: absolute;
  top: 107px;
  left: 697px;
  width: 292px;
  height: 292px;
}

/* ===== ヒーロー画像 ===== */
.fv-hero-image {
  position: absolute;
  top: 192px;
  left: 791px;
  width: 509px;
  height: 503px;
}

/* ===== 実績スタッツ ===== */
.fv-stat {
  position: absolute;
  top: 483px;
  width: 198px;
  height: 181px;
}
.fv-stat--1 { left: 194px; }
.fv-stat--2 { left: 379px; }
.fv-stat--3 { left: 564px; }

/* ===== プログラムカード ===== */
.fv-card {
  position: absolute;
  top: 782px;
  left: 50%;
  transform: translateX(-50%);
  width: 1100px;
  max-width: calc(100% - 40px);
  background: #fff;
  border-radius: 40px;
  box-shadow: 0 4px 10px rgba(69, 61, 55, 0.2), inset 0 0 6px rgba(69, 61, 55, 0.2);
  padding: 84px 60px 62px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.fv-card__badge {
  position: absolute;
  top: -36px;
  left: 50%;
  transform: translateX(-50%);
  width: 649px;
  height: auto;
}

.fv-card__title {
  margin: 0;
  font-size: 34px;
  font-weight: 700;
  color: var(--color-text-dark);
}

.fv-card__title .accent-text { color: #e47502; }

.fv-card__divider {
  width: 100%;
  /* max-width: 720px; */
  margin: 10px 0 15px;
  border: none;
  border-top: 2px solid var(--color-text-darker);
}

.fv-card__lead {
  margin: 0;
  font-size: 24px;
  font-weight: 500;
  color: var(--color-text-dark);
  line-height: 1.8;
}

.fv-card__lead .accent-text {
  color: var(--color-orange2);
  font-family: "Arial Black", sans-serif;
  font-size: 30px;
}

.fv-card__sub {
  margin: 26px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  font-size: 20px;
  font-weight: 500;
  color: var(--color-text-darker);
}

.fv-card__slash {
  width: 2px;
  height: 28px;
  background: var(--color-text-darker);
  flex: none;
}
.fv-card__slash--l { transform: rotate(-22deg); }
.fv-card__slash--r { transform: rotate(22deg); }

.fv-cta {
  margin-top: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  width: 653px;
  height: 116px;
  background: var(--color-green);
  color: #fff;
  border-radius: 300px;
  text-decoration: none;
  font-weight: 700;
  font-size: 36px;
  box-shadow: 0 8px 0 #009b78, 0 14px 20px rgba(0, 155, 120, 0.35);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.fv-cta:hover {
  transform: translateY(3px);
  box-shadow: 0 5px 0 #009b78, 0 8px 14px rgba(0, 155, 120, 0.35);
}

.fv-cta__arrow {
  font-size: 22px;
  transform: translateY(1px);
}

/* =========================================================
   共通コンポーネント(フロー型セクション用)
   ========================================================= */
.container {
  width: 100%;
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 40px;
  position: relative;
  z-index: 0;
}

/* オレンジのリボンバッジ(両端が矢印状) */
.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}
.badge--orange {
  background: linear-gradient(90deg, #e37401, #ff982d 50%, #ffbf33);
  font-size: 24px;
  padding: 14px 44px;
  clip-path: polygon(
    14px 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%,
    14px 100%, 0 50%
  );
}

/* 両端スラッシュ付き見出し */
.slash-heading {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  margin: 28px 0 0;
  font-size: 40px;
  font-weight: 700;
  color: var(--color-text-darker);
  text-align: center;
}
.slash-heading::before,
.slash-heading::after {
  content: "";
  width: 3px;
  height: 60px;
  background: #b7c3ba;
  background: var(--color-text-darker);
  flex: none;
}
.slash-heading::before { transform: rotate(-22deg); }
.slash-heading::after  { transform: rotate(22deg); }

/* 黄色の波線ハイライト */
.wave {
  text-decoration: underline;
  text-decoration-style: wavy;
  text-decoration-color: #ffcf3f;
  text-decoration-thickness: 2px;
  /* text-underline-offset: 5px; */
}

/* マーカー風ハイライト(オレンジ文字+黄下地) */
.marker {
  color: var(--color-orange);
  background: linear-gradient(transparent 58%, #FEF085 58%);
  padding: 0 2px;
}

/* プレースホルダー(画像差し替え予定) */
.ph {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.worry {
  background-image: url(assets/sec02_bg.webp);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto;
  padding: 80px 0 0 0;
  text-align: center;
	overflow: hidden;
}

.check-list {
  list-style: none;
  margin: 56px auto 0;
  padding: 0;
  max-width: 880px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.check-bubble {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  background: #fff;
  border-radius: 0 0 20px 0;
  padding: 20px 30px 20px 0;
  box-shadow: 0 4px 10px rgba(69, 61, 55, 0.2), inset 0 0 6px rgba(69, 61, 55, 0.2);
  text-align: left;
  width: 420px;
  max-width: 48%;
}
/* 左右2列に分け、縦を詰めて互い違いに配置 */
.check-bubble--a { align-self: flex-start; }
.check-bubble--b {align-self: flex-end;margin-top: -42px; position: relative; top: -24px;}
.check-bubble--c { align-self: flex-start; margin-top: -32px; }
.check-bubble--d {align-self: flex-end;margin-top: -42px; position: relative; top: -24px;}
.check-bubble--e {align-self: center;margin-top: 20px; position: relative; top: -24px;}

.check-bubble__icon {
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ff982d, #e37401);
  position: relative;
  left: -20px;
}
.check-bubble__icon::after {
  content: "";
  position: absolute;
  left: 11px;
  top: 8px;
  width: 10px;
  height: 18px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}
.check-bubble__text {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-text-dark);
}

.worry__statement {
  margin: 50px 0 0;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-text-darker);
}

.worry__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  margin-top: 40px;
  text-align: left;
}
.worry__notes {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-bottom: 20px;
  /* justify-content: flex-end; */
  margin-top: 60px;
}
.worry__note {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.9;
  white-space: nowrap;
}
.hl-green {
  background: #58c29e;
  color: #fff;
  padding: 4px 12px;
  border-radius: 2px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.hl-green .wave { text-decoration-color: #fff3b0; }

/* お悩みノートのハイライトは緑→オレンジのグラデーション */
.worry__note .hl-green {
  background: linear-gradient(90deg, #61CEB5, #FFA032);
}

.worry__illust {
  flex: none;
  width: 500px;
  max-width: 46%;
  margin-top: -30px;
}
.worry__illust img {
  display: block;
  width: 100%;
  height: auto;
}

/* =========================================================
   壁 / 99% セクション
   ========================================================= */
.badge--green {
  background: linear-gradient(90deg, #12b98a, #46d0a6);
  font-size: 20px;
  padding: 12px 40px;
  clip-path: polygon(
    14px 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%,
    14px 100%, 0 50%
  );
}

.wall {
  width: 100%;
}
.wall__img,
.wall__img img {
  display: block;
  width: 100%;
  height: auto;
}

.wave--orange {
  text-decoration-color: var(--color-orange);
}

/* =========================================================
   ステージ診断セクション
   ========================================================= */
.stage {
  background-image: url(assets/bg_pattern_tile01.png);
  background-repeat: repeat;
  padding: 280px 0 90px;
  /* text-align: center; */
  margin-top: -200px;
}
.stage__eyebrow {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--color-text-darker);
  text-align: center;
}
.stage__title {
  margin: 14px 0 0;
  font-size: 38px;
  font-weight: 700;
  color: var(--color-text-darker);
  line-height: 1.4;
  text-align: center;
}
.stage__lead {
  margin: 26px 0 0;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.9;
  color: var(--color-text-dark);
  text-align: center;
}
.stage__lead .accent-text { color: var(--color-orange); font-weight: 700; }

/* タイムライン */
.stage-list {
  position: relative;
  list-style: none;
  max-width: 940px;
  margin: 56px auto 0;
  padding: 0;
}
.stage-list::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 20px;
  bottom: 20px;
  width: 50px;
  background: linear-gradient(180deg, #96CABE, #E7BE94);
  transform: translateX(-50%);
  z-index: 0;
}

.stage-item {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(69, 61, 55, 0.1);
  overflow: hidden;
  margin-bottom: 44px;
}
.stage-item:last-child { margin-bottom: 0; }

.stage-item__head {
  position: relative;
  padding: 16px 20px;
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0.02em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  line-height: 0;
}
.stage-item--green .stage-item__head { background: linear-gradient(180deg, #1cc79c, #14b085); }
.stage-item--orange .stage-item__head { background: linear-gradient(180deg, #f18a1c, #e37401); }
.stage-item__no {
  font-family: "Arial", sans-serif;
  font-weight: 700;
  /* margin-right: 8px; */
  letter-spacing: 0.08em;
}

.stage-goal-tag {
  position: absolute;
  left: 32px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
}
.stage-goal-tag::before,
.stage-goal-tag::after {
  content: "";
  width: 4px;
  height: 32px;
  background: #FEF085;
}
.stage-goal-tag::before { transform: rotate(-20deg); }
.stage-goal-tag::after  { transform: rotate(20deg); }

.stage-item__body {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 24px 34px;
  text-align: left;
}
.stage-item__icon {
  flex: none;
  width: 150px;
  height: 120px;
  object-fit: contain;
}
.stage-item__desc {
  margin: 0;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-text-dark);
}
.stage-item__note {
  margin: 12px 0 0;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.7;
  color: #7d756e;
}

/* 高い壁バースト */
.stage-wall {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 150px;
  margin: -18px 0;
}

.stage-wall strong { font-size: 30px; }

/* 変化への導線 */
.stage__after1 {
  margin: 64px 0 0;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-text-darker);
  text-align: center;
}
.hl-yellow {
  background: linear-gradient(transparent 58%, #ffe884 58%);
  padding: 0 4px;
}
.stage__tri {
  /* width: 0; */
  /* height: 0; */
  margin: -9vw auto 40px auto;
  /* border-left: 26px solid transparent; */
  /* border-right: 26px solid transparent; */
  /* border-top: 30px solid var(--color-orange); */
  position: relative;
  order: 10;
  text-align: center;
}
.stage__eyebrow2 {
  margin: 30px 0 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--color-text-darker);
}
.stage__after2 {
  margin: 18px 0 0;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-text-darker);
}
.stage__after2 .accent-text { color: var(--color-orange); }

/* =========================================================
   Now → After 比較セクション
   ========================================================= */
.compare {
  background-image: url(assets/bg_pattern_tile02.png);
  padding: 70px 0 80px;
  position: relative;
  order: 0;
}
.compare__eyebrow {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--color-text-darker);
  text-align: center;
}
.compare__title {
  margin: 14px 0 0;
  font-size: 38px;
  font-weight: 700;
  color: var(--color-text-darker);
  line-height: 1.4;
  text-align: center;
}

.compare__head,
.compare-row {
  display: grid;
  grid-template-columns: 1fr 64px 1fr;
  align-items: center;
}

.compare__head {
  margin-bottom: 22px;
}
.compare__col-head {
  position: relative;
  height: 96px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.compare__watermark {
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  font-family: "Arial", sans-serif;
  font-weight: 900;
  font-size: 92px;
  line-height: 1;
  color: #e5e2dc;
  z-index: 0;
  white-space: nowrap;
}
.compare__col-head--after .compare__watermark { color: #f9dfc6; }
.compare__label {
  position: relative;
  z-index: 1;
  font-size: 23px;
  font-weight: 700;
  color: var(--color-text-darker);
}
.compare__label--after { color: var(--color-orange); }

.compare__rows {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.compare-card {
  border-radius: 12px;
  padding: 20px 26px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-text-dark);
}
.compare-card--now {
  background: #fff;
  border: 1.5px solid #d7d2ca;
}
.compare-card--after {
  background: #fff;
  border: 2px solid var(--color-orange);
}
.compare-card--after .accent-text { color: var(--color-orange); }

.compare-arrow {
  width: 0;
  height: 0;
  margin: 0 auto;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-left: 26px solid var(--color-orange);
}

.compare__illusts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  /* margin-top: 30px; */
}
.compare__illust {
  /* height: 260px; */
}

.compare__banner {
  margin-top: 44px;
  text-align: center;
}
.compare__banner-line1,
.compare__banner-line2 {
  display: inline-block;
  margin: 0;
  background: #16b78b;
  font-size: 28px;
  font-weight: 700;
  padding: 12px 30px;
}
.compare__banner-line1 { color: #fff; }
.compare__banner-line2 { color: #ffe14d; margin-top: 12px; }


/* =========================================================
   プログラムの特徴(比較マトリクス)セクション
   ========================================================= */
.matrix {
  background: #fff;
  padding: 74px 0 80px;
  /* text-align: center; */
  position: relative;
  max-width: 100vw;
}
.matrix:before {
    content: "";
    display: block;
    position: absolute;
    background: url(assets/kikagaku_bg.svg) no-repeat;
    width: 32vw;
    height: 590px;
    top: -50px;
    left: -80px;
    z-index: 100;
}
.matrix:after {
    content: "";
    display: block;
    position: absolute;
    background: url(assets/kikagaku_bg.svg) no-repeat;
    width: 32vw;
    height: 590px;
    top: 80%;
    right: -40px;
    z-index: 100;
}
.matrix .container{
	padding: 0;
	/* max-width: 100vw; */
}
.matrix__title {
  margin: 0;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-text-darker);
  text-align: center;
}
.matrix__title .accent-text { color: var(--color-orange); }

.matrix__sub {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 44px 0 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--color-text-darker);
}
.matrix__sub::before,
.matrix__sub::after {
  content: "";
  width: 90px;
  height: 2px;
  background: #b9b2a7;
}
.matrix__img,
.matrix__img img {
  display: block;
  width: 100vw;
  height: auto;
  /* margin-top: 40px; */
  margin: 40px;
  margin: 40px calc(50% - 50vw) 0  calc(50% - 50vw);」と「
  width: 100vw;
}

/* テーブル */
.matrix-table {
  display: grid;
  grid-template-columns: 132px repeat(3, 1fr);
  max-width: 1000px;
  margin: 40px auto 0;
}
.matrix-table > div {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 20px 14px;
  /* font-size: 18px; */
  /* font-weight: 500; */
  line-height: 1.5;
  /* color: var(--color-text-dark); */
  /* font-weight: 700; */
}
/* 列見出し */
.matrix-colhead {
  font-weight: 700;
  background: #fbe7d7;
  border-radius: 12px 12px 0 0;
  font-size: 20px;
}
.matrix-colhead--main {
  color: #fff;
  background: var(--color-orange);
  border: 2px solid var(--color-orange);
  border-bottom: none;
}
.matrix-cell--corner { background: transparent; }
/* 行ラベル */
.matrix-rowlabel {
  font-weight: 700;
  background: #e4f3ec;
  color: var(--color-text-darker);
  margin: 4px 0;
  border-radius: 8px;
}
/* 通常セルの点線区切り */
.matrix-cell:not(.matrix-cell--corner) {
  border-bottom: 1px dotted #d3ccc2;
  background: #fff;
  font-size: 18px;
}
/* 中央(当プログラム)列の強調枠 */
.matrix-cell--main {
  border-left: 2px solid var(--color-orange);
  border-right: 2px solid var(--color-orange);
  border-bottom: 1px dotted #f0c9a2;
  background: #fff;
}
.matrix-table > .matrix-cell--main:last-child {
  border-bottom: 2px solid var(--color-orange);
  border-radius: 0 0 12px 12px;
}
.matrix-cell--main .accent-text {
  color: var(--color-orange);
  font-weight: 700;
  font-size: 19px;
}

/* テーブル下の矢印 */
.matrix-arrows {
  display: grid;
  grid-template-columns: 132px repeat(3, 1fr);
  max-width: 1000px;
  margin: 0 auto;
}
.matrix-arrow {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 14px;
}
.matrix-arrow__mark {
  width: 0;
  height: 0;
  border-left: 16px solid transparent;
  border-right: 16px solid transparent;
  border-top: 20px solid var(--color-orange);
}
.matrix-arrow__mark--lg {
  border-left-width: 26px;
  border-right-width: 26px;
  border-top-width: 32px;
}
.matrix-arrow__cap {
  margin: 10px 0 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-text-dark);
}

/* 結果(六角形+イラスト) */
.matrix-result {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 20px;
}
.matrix-result__illust {
  flex: none;
  width: 300px;
  height: 220px;
}
.matrix-result__body {
  text-align: center;
}
.matrix-hexes {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.hex {
  position: relative;
  width: 150px;
  height: 168px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #cdb489;
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.hex::after {
  content: "";
  position: absolute;
  inset: 3px;
  background: #fff;
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.hex span {
  position: relative;
  z-index: 1;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.3;
}
.hex--a span { color: var(--color-orange); }
.hex--b span { color: var(--color-green); }
.hex-x {
  font-size: 30px;
  font-weight: 700;
  color: var(--color-text-dark);
}
.matrix-result__cap {
  margin: 18px 0 0;
  font-size: 24px;
  font-weight: 500;
  color: var(--color-text-darker);
}
.matrix-result__cap strong { font-size: 30px; }

/* 注記(緑ボックス) */
.matrix-note {
  max-width: 1000px;
  margin: 30px auto 0;
  background: #16b78b;
  color: #fff;
  border-radius: 14px;
  padding: 26px 34px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.9;
  text-align: left;
}

/* =========================================================
   共通:セクション見出し(透かし+ラベル+スラッシュ罫)
   ========================================================= */
.sec-head {
  margin-bottom: 26px;
}
.watermark {
  position: absolute;
  top: -74px;
}
.stage .watermark,
.movie .watermark,
.curriculum .watermark,
.faq .watermark {
  right: auto;
  left: 0;
  /* width: 40%; */
  text-align: left;
  z-index: -1;
}
.matrix .watermark,
.pillars .watermark,
.voice .watermark {
  right: auto;
  right: 0;
  /* width: 40%; */
  text-align: right;
}

.eyebrow {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--color-text-darker);
  text-align: center;
}
.eyebrow--orange { color: var(--color-text-darker); }
.eyebrow--white { color: #fff; }
.eyebrow-deco {
  position: relative;
  display: block;
  width: 190px;
  height: 24px;
  margin: 10px auto 0;
  background: url(assets/sub_tit_fukidashi.svg) center / contain no-repeat;
}
.eyebrow-deco-wht {
  position: relative;
  display: block;
  width: 190px;
  height: 24px;
  margin: 10px auto 0;
  background: url("assets/sub_tit_fukidashi_wht.svg") center / contain no-repeat;
}

/* 黄色ハイライト(下地バー) */
.hl-y {
  background: linear-gradient(transparent 58%, #ffe14d 58%);
  padding: 0 2px;
}

/* =========================================================
   無料公開動画
   ========================================================= */
.movie {
  background: #fff;
  padding: 90px 0 80px;
  /* text-align: center; */
}
.movie__title {
  margin: 0;
  font-size: 38px;
  font-weight: 700;
  color: var(--color-text-darker);
  text-align: center;
}
.movie__title .accent-text { color: var(--color-orange); }
.movie__lead {
  margin: 20px 0 0;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.9;
  color: var(--color-text-dark);
  text-align: center;
}
.movie__video {
  position: relative;
  max-width: 720px;
  margin: 44px auto 0;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  overflow: hidden;
  background: #0d1b2a;
  border: none;
  color: rgba(255,255,255,0.6);
  flex-direction: column;
  gap: 18px;
}
.movie__video iframe,
.movie__video img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
  object-fit: cover;
}
.movie__cta {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 0 40px;
  height: 68px;
  background: var(--color-green);
  color: #fff;
  border-radius: 300px;
  text-decoration: none;
  font-weight: 700;
  font-size: 22px;
  white-space: nowrap;
  box-shadow: 0 8px 0 #009b78, 0 14px 24px rgba(0, 155, 120, 0.4);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.movie__cta:hover {
  transform: translate(-50%, calc(-50% + 3px));
  box-shadow: 0 5px 0 #009b78, 0 8px 14px rgba(0, 155, 120, 0.35);
}
.movie__cta-arrow {
  font-size: 16px;
  transform: translateY(1px);
}

@media (max-width: 767px) {
  .movie__cta { height: 56px; font-size: 17px; padding: 0 28px; bottom: 16px; gap: 8px; }
  .movie__cta-arrow { font-size: 13px; }
}

.movie__play {
  width: 84px;
  height: 60px;
  border-radius: 14px;
  background: #ff0000;
  position: relative;
}
.movie__play::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-40%, -50%);
  border-left: 22px solid #fff;
  border-top: 13px solid transparent;
  border-bottom: 13px solid transparent;
}
.movie__vlabel { font-size: 14px; }

/* =========================================================
   3つの柱
   ========================================================= */
.pillars {
    padding: 84px 0 90px;
    /* text-align: center; */
    background-image: url(assets/bg_pattern_tile01.png);
    position: relative;
}
.pillars .container{
	z-index: 10;
}
.pillars:before {
    content: "";
    display: block;
    position: absolute;
    background: url(assets/kikagaku_bg.svg) no-repeat;
    width: 32vw;
    height: 590px;
    top: -50px;
    left: -80px;
    z-index: 100;
}
.pillars:after {
    content: "";
    display: block;
    position: absolute;
    background: url(assets/kikagaku_bg.svg) no-repeat;
    width: 32vw;
    height: 400px;
    bottom: -40px;
    right: -40px;
    z-index: 0;
}

.pillars__title {
  margin: 0 0 50px;
  font-size: 38px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-text-darker);
  text-align: center;
}
.pillars__title .accent-text { color: var(--color-orange); font-size: 46px; }

.pillar-list {
  list-style: none;
  max-width: 980px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 46px;
}
.pillar {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 30px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 10px 26px rgba(69, 61, 55, 0.1);
  padding: 34px 40px 0 34px;
  text-align: left;
  justify-content: center;
}
.pillar__content {
    width: 58%;
    padding: 0 0 4vw 0;
}
.pillar__no {
  position: absolute;
  top: -22px;
  left: -14px;
  width: 66px;
  height: 74px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Arial", sans-serif;
  font-weight: 900;
  font-size: 32px;
  color: #fff;
  background: linear-gradient(135deg, #ff9d2e, #e37401);
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.pillar__illust {
  flex: none;
  /* width: 210px; */
  /* height: 200px; */
  width: 40%;
}
.pillar__head {
  margin: 0 0 12px;
  font-size: 24px;
  font-weight: 700;
  color: var(--color-text-darker);
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.pillar__tag {
  background: #16b78b;
  color: #fff;
  font-size: 19px;
  padding: 6px 18px;
  border-radius: 8px;
}
.pillar__desc {
  margin: 0;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.8;
  color: var(--color-text-dark);
}

/* =========================================================
   個別サポートの実例
   ========================================================= */
.example {
  /*background: linear-gradient(110deg, #35b48f 0%, #7bbf72 45%, #eaa64a 100%);*/
  padding: 60px 0 66px;
  color: #fff;
  text-align: center;
background-image: url("assets/gradation_bg.webp");
}
.example .badge--orange { box-shadow: 0 6px 16px rgba(0,0,0,0.15); }
.example__title {
  margin: 26px 0 0;
  font-size: 34px;
  font-weight: 700;
  color: #fff;
}
.example__title .hl-y {
  background: none;
  color: #FEF085;
  padding: 0;
}
.example__body {
  display: flex;
  gap: 34px;
  align-items: flex-start;
  margin-top: 34px;
  text-align: left;
}
.example__text { flex: 1; }
.example__text p {
  margin: 0 0 14px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.9;
}
.example__text .accent-w { color: #fff; font-weight: 700; }
.example__photo {
  flex: none;
  width: 440px;
  height: 320px;
  border-radius: 10px;
  overflow: hidden;
}
.example__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.example__note {
  margin: 26px 0 0;
  text-align: left;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.9;
  color: rgba(255,255,255,0.92);
}

/* =========================================================
   カリキュラム
   ========================================================= */
.curriculum {
    padding: 84px 0 90px;
    text-align: center;
    background-image: url(assets/bg_pattern_tile02.png);
}
.curriculum__title {
  margin: 0;
  font-size: 40px;
  font-weight: 700;
  color: var(--color-text-darker);
}
.curriculum__title .accent-text { color: var(--color-orange); font-size: 50px; }
.curriculum__lead {
  margin: 22px 0 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.9;
  color: var(--color-text-dark);
}
.curr-part {
  max-width: 960px;
  margin: 48px auto 0;
  text-align: left;
}
.curr-part__head {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: var(--color-text-darker);
  display: flex;
  align-items: center;
  gap: 14px;
}
.curr-tag {
  background: #16b78b;
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  padding: 6px 16px;
  border-radius: 6px;
}
.curr-part__desc {
  margin: 12px 0 18px;
  font-size: 16px;
  font-weight: 500;
  color: var(--color-text-dark);
}
.curr-lessons {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 18px;
}
.curr-lessons li {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border: 1px solid #e4ded4;
  border-radius: 8px;
  padding: 14px 18px;
  font-size: 16px;
  font-weight: 500;
  color: var(--color-text-dark);
}
.curr-no {
  color: var(--color-orange);
  font-weight: 700;
  flex: none;
}
.curr-box {
  max-width: 960px;
  margin: 44px auto 0;
  background: #16b78b;
  color: #fff;
  border-radius: 14px;
  padding: 26px 30px;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.9;
}
.curr-part_icons{
	display: flex;
    align-items: center;
    gap: 10px;
}
/* =========================================================
   伴走の価値
   ========================================================= */
.accompany {
  padding: 60px 0 66px;
  text-align: center;
background-image: url("assets/sec11_bg.webp");
}
.accompany__title {
  margin: 24px 0 0;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
}
.accompany__title .hl-y {background: linear-gradient(transparent 58%, #FEF085 58%);}
.accompany__body {
  display: flex;
  align-items: center;
  gap: 40px;
  margin-top: 34px;
  text-align: left;
}
.accompany__illust {
  flex: none;
  width: 420px;
  height: 280px;
  border-radius: 10px;
}
.accompany__text {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 2;
}
.accompany__banner {
  display: inline-block;
  margin: 36px 0 0;
  background: #16b78b;
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  padding: 14px 34px;
}
.accompany__banner .accent-y {color: #FEF085;}

/* =========================================================
   受講者の声
   ========================================================= */
.voice {
  background: var(--color-cream);
  padding: 84px 0 90px;
  text-align: center;
}
.voice__title {
  margin: 0 0 50px;
  font-size: 40px;
  font-weight: 700;
  color: var(--color-text-darker);
}
.voice__title .accent-text { color: var(--color-orange); }
.voice-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  max-width: 1000px;
  margin: 0 auto;
}
.voice-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(69, 61, 55, 0.08);
  padding: 40px 30px;
  text-align: left;
}
.voice-card__avatar {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  margin: 0 auto 24px;
}
.voice-card__text {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.9;
  color: var(--color-text-dark);
}

/* =========================================================
   FAQ
   ========================================================= */
.faq {
  background: #fff;
  padding: 84px 0 90px;
  text-align: center;
}
.faq__title {
  margin: 0 0 40px;
  font-size: 40px;
  font-weight: 700;
  color: var(--color-text-darker);
}
.faq__title .accent-text { color: var(--color-orange); }
.faq-list {
  list-style: none;
  max-width: 760px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.faq-item {
  background: #fff;
  border: 1px solid #e7e2d9;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(69, 61, 55, 0.05);
}
.faq-item summary {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  cursor: pointer;
  list-style: none;
  text-align: left;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: "";
  margin-left: auto;
  width: 12px;
  height: 12px;
  border-right: 2px solid #9a938a;
  border-bottom: 2px solid #9a938a;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.faq-item details[open] summary::after { transform: rotate(-135deg); }
.faq-q {
  flex: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #16b78b;
  color: #fff;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.faq-text {
  font-size: 16px;
  font-weight: 700;
  color: var(--color-text-darker);
}
.faq-a {
  padding: 0 24px 22px 70px;
  text-align: left;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.8;
  color: var(--color-text-dark);
}

/* =========================================================
   最終CTA(無料相談)
   ========================================================= */
.cta-final {
  background-image: url("assets/gradation_bg.webp");

  padding: 64px 0 80px;
  color: #fff;
  text-align: center;
}
.cta-final__title {
  margin: 22px 0 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
}
.cta-final__lead {
  margin: 24px 0 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.9;
}
.cta-final__emph {
  margin: 28px 0 0;
  font-size: 22px;
  font-weight: 700;
}
.cta-final__btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
  background: #fff;
  color: var(--color-orange);
  font-size: 26px;
  font-weight: 700;
  text-decoration: none;
  padding: 24px 60px;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(0,0,0,0.18);
}
.cta-final__btn span { font-size: 24px; }
.cta-final__note {
  margin: 22px 0 0;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.9);
}

/* =========================================================
   FV ヘッダー:中間幅(768〜1439px)は 1440px レイアウトを
   vw で比例縮小し、常に1行に収める
   ========================================================= */
@media (min-width: 768px) and (max-width: 1439px) {
  /* バー高さを可変にして上下余白を約半分に */
  .fv-header { height: auto; }
  .fv-header__inner { padding-block: 0.7vw; }
  .fv-header__text {
    padding-left: 17vw;      /* 245/1440 */
    font-size: 1.667vw;      /* 24/1440 */
    white-space: nowrap;
  }
  .fv-header__text .accent {
    font-size: 2.222vw;      /* 32/1440 */
  }
}

/* =========================================================
   流体タイポグラフィ:コンテナが縮む幅(768〜1240px)で
   主要テキストを vw(画面幅比)にして画面サイズに合わせて縮小
   (基準はコンテナ上限=1160px時にデザイン寸法。px/1160*100=vw)
   ※ FV は独自のJS縮小、≤767px は既存モバイル指定が担当
   ========================================================= */
@media (min-width: 768px) and (max-width: 1240px) {
  /* 共通見出し */
  .slash-heading { font-size: 3.45vw; }
  .badge--orange { font-size: 2.07vw; }
  .badge--green { font-size: 1.72vw; }
  .eyebrow {/* font-size: 1.72vw; */}

  /* お悩み */
  .check-bubble__text {font-size: 1.75vw;}
  .worry__statement { font-size: 3.10vw; }
  .worry__note { font-size: 2.07vw; }

  /* ステージ */
  .stage__eyebrow { font-size: 1.90vw; }
  .stage__title { font-size: 3.28vw; }
  .stage__lead {font-size: 2vw;}
  .stage-item__head { font-size: 2.24vw; }
  .stage-item__desc {font-size: 2vw;}
  .stage-item__note { font-size: 1.29vw; }
  .stage-goal-tag { font-size: 2.07vw; }
  .stage__after1 { font-size: 2.93vw; }
  .stage__eyebrow2 { font-size: 1.72vw; }
  .stage__after2 { font-size: 3.45vw; }

  /* Now→After 比較 */
  .compare__eyebrow { font-size: 1.90vw; }
  .compare__title { font-size: 3.28vw; }
  .compare__label { font-size: 1.98vw; }
  .compare-card {font-size: 2vw;}
  .compare__banner-line1, .compare__banner-line2 { font-size: 2.41vw; }

  /* マトリクス */
  .matrix__title { font-size: 2.93vw; }
  .matrix__sub { font-size: 1.90vw; }
  .matrix-note { font-size: 1.38vw; }

  /* 無料公開動画 */
  .movie__title { font-size: 3.28vw; }
  .movie__lead {font-size: 2vw;}

  /* 3つの柱 */
  .pillars__title { font-size: 3.28vw; }
  .pillars__title .accent-text { font-size: 3.97vw; }
  .pillar__head { font-size: 2.07vw; }
  .pillar__tag { font-size: 1.64vw; }
  .pillar__desc {font-size: 2vw;}

  /* 個別サポートの実例 */
  .example__title { font-size: 2.93vw; }
  .example__text p {/* font-size: 1.75vw; */}

  /* カリキュラム */
  .curriculum__title { font-size: 3.45vw; }
  .curriculum__title .accent-text { font-size: 4.31vw; }
  .curriculum__lead {font-size: 2vw;}
  .curr-part__head { font-size: 2.07vw; }
  .curr-tag { font-size: 1.47vw; }
  .curr-lessons li {font-size: 1.75vw;}
  .curr-box {/* font-size: 1.75vw; */}

  /* 伴走の価値 */
  .accompany__title { font-size: 3.45vw; }
  .accompany__text {/* font-size: 1.47vw; */}
  .accompany__banner { font-size: 2.24vw; }

  /* 受講者の声 */
  .voice__title { font-size: 3.45vw; }
  .voice-card__text {/* font-size: 1.38vw; */}

  /* FAQ */
  .faq__title { font-size: 3.45vw; }
  .faq-text {/* font-size: 1.55vw; */}

  /* 最終CTA */
  .cta-final__title { font-size: 3.79vw; }
  .cta-final__lead {/* font-size: 1.64vw; */}
  .cta-final__emph { font-size: 1.90vw; }
  .cta-final__btn { font-size: 2.24vw; }

  /* セクションの上下padding も画面幅に合わせて縮小(基準1240px=デザイン寸法。px/1240*100=vw) */
  .worry      {padding-top: 6.45vw;background-size: 100vw 93vw;}
  .stage      { padding-bottom: 7.26vw; }        /* 上は 24vw の食い込み維持 */
  .compare    { padding-top: 5.65vw; padding-bottom: 6.45vw; }
  .matrix     {padding-top: 10vw;padding-bottom: 6.45vw;}
  .movie      { padding-top: 7.26vw; padding-bottom: 6.45vw; }
  .pillars    {padding-top: 10vw;padding-bottom: 7.26vw;}
  .example    { padding-top: 4.84vw; padding-bottom: 5.32vw; }
  .curriculum {padding-top: 10vw;padding-bottom: 7.26vw;}
  .accompany  { padding-top: 4.84vw; padding-bottom: 5.32vw; }
  .voice      {padding-top: 10vw;padding-bottom: 7.26vw;}
  .faq        {padding-top: 10vw;padding-bottom: 7.26vw;}
  .cta-final  { padding-top: 5.16vw; padding-bottom: 6.45vw; }

  /* お悩みの余白・千鳥オフセットも vw で縮小(基準1240px) */
  .check-list       {margin-top: 3.8vw;}   /* 56px */
  .check-bubble--b  { margin-top: -3.39vw; top: -1.94vw; }  /* -42 / -24 */
  .check-bubble--c  { margin-top: -2.58vw; }  /* -32 */
  .check-bubble--d  { margin-top: -3.39vw; top: -1.94vw; }
  .check-bubble--e  { margin-top: 1.61vw; top: -1.94vw; }   /* 20 / -24 */
  .worry__statement { margin-top: 4.03vw; }   /* 50px */
  .worry__bottom    { margin-top: 3.23vw; }   /* 40px */
  .worry__notes     { margin-top: 4.84vw; }   /* 60px */
}

/* =========================================================
   レスポンシブ(タブレット:〜1023px)
   横並び(画像+テキスト)を縦積みにして見切れ・横スクロールを防ぐ
   ========================================================= */
@media (max-width: 1023px) {

  .example__body { flex-direction: column; }
  .example__photo { width: 100%; }

  .accompany__body { flex-direction: column; }
  .accompany__illust { width: 100%; max-width: 480px; }

  .pillar {
	  /* min-height: 220px; */
	  padding-bottom: 5vw;
}

  .matrix-result { flex-direction: column; }
.watermark img {
    width: 80%;
}

.pillar__content {
    width: 50%;
    padding: 0;
}
.pillar__illust {
	width: 40%;
}
.pillar__illust img {
    width: 100%;
}
}
/* =========================================================
   レスポンシブ(スマホ:〜767px)
   ========================================================= */
@media (max-width: 767px) {
	img{
		max-width: 100%;
	}
  .container { padding: 0 18px; }

  /* ---- FV(絶対配置 → 縦積みフロー) ---- */
  .fv {
    height: auto;
    background-size: 62% auto, 58% auto;
    background-position: right -8px top 40px, left -8px top 440px;
  }
  .fv-header { position: static; height: auto; }
  .fv-header__inner {width: 100%;padding: 12px 16px;justify-content: center;}
  .fv-header__text { padding-left: 0; text-align: center; font-size: 14px; line-height: 1.5; }
  .fv-header__text .accent { font-size: 16px; }

  .fv-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: auto;
    padding: 0 16px 44px;
  }
  .fv-titlebadge {/* position: absolute; */order: 1;/* width: 82%; */max-width: 360px;align-self: flex-start;top: 4vw;left: -14vw;}
  .fv-headline { position: static; }
  .fv-headline--1 {order: 2;/* width: 100%; */margin-top: 24vw;align-self: flex-start;}
  .fv-headline--2 {order: 3;/* width: 90%; */margin-top: 10px;}
  .fv-stats {order: 4;display: flex;justify-content: center;gap: 0;width: 95%;margin-top: 26px;align-items: center;}
  .fv-stat {position: static;left: auto;top: auto;width: 38%;max-width: 150px;height: auto;}
  .fv-hero {order: 5;position: relative;width: 100%;/* margin-top: 24px; */z-index: 0;}
  .fv-hero-image {position: static;top: auto;left: auto;width: 76%;height: auto;margin-left: auto;display: block;/* z-index: 100; */}
  .fv-ai-icon {position: absolute;left: 0;/* bottom: 8%; */top: auto;width: 45%;height: auto;z-index: -1;}
  .fv-card {
    position: relative;
    order: 6;
    left: auto;
    transform: none;
    width: 100%;
    max-width: 100%;
    /* margin-top: 34px; */
    padding: 30px 20px;
    top: 8vw;
    border-radius: 20px;
  }
  .fv-card__badge { width: 94%; max-width: 380px; top: -26px; }
  .fv-card__title {font-size: 22px;line-height: 1.5;}
  .fv-card__divider {/* margin: 20px 0 18px; */}
  .fv-card__lead {font-size: 20px;line-height: 1.5;}
  .fv-card__lead .accent-text { font-size: 21px; }
  .fv-card__sub {font-size: 13px;gap: 10px;margin: 16px 0 0;}
  .fv-card__slash {height: 30px;width: 1px;}
  .fv-cta {width: 100%;max-width: 440px;height: 84px;font-size: 24px;gap: 10px;margin-top: 10px;}
  .fv-cta__arrow { font-size: 15px; }

  /* ---- 共通 ---- */
  .slash-heading {font-size: 25px;gap: 34px;}
  .slash-heading::before, .slash-heading::after {height: 60px;width: 2px;/* transform: rotate(-32deg); */}
  .badge--orange { font-size: 17px; padding: 10px 26px; }
  .badge--green { font-size: 15px; padding: 10px 24px; }
  .sec-head { margin-bottom: 22px; }

  /* ---- お悩み ---- */
  .worry {
    padding: 12.27vw 0 13.33vw;   /* 46/50px @375px基準 */
    background-image: url(assets/sec02_bg_sp.webp);
    background-size: 100% 70%;
  }
  .check-list {max-width: 100%;gap: 0;margin: 30px 0 0 0;}
  .check-bubble {
    width: 47%;
    max-width: 47%;
    padding: 10px 10px 10px 0;
    border-radius: 0 0 14px 0;
    gap: 0;
    /* line-height: 2.5; */
  }
  .check-bubble__icon { width: 26px; height: 26px; left: -12px; }
  .check-bubble__icon::after { left: 8px; top: 5px; width: 7px; height: 12px; }
  .check-bubble__text {font-size: 12px;line-height: 1.75;}
  .check-bubble--a {align-self: flex-start;margin-top: 0;top: 0;gap: 0;}
  .check-bubble--b {align-self: flex-end;margin-top: -54px;/* top: -10px; *//* padding: 10px 10px 10px 0; */}
  .check-bubble--c {align-self: flex-start;margin-top: 0;top: 0;}
  .check-bubble--d {align-self: flex-end;margin-top: -60px;/* top: -10px; */}
  .check-bubble--e {align-self: center;margin-top: 0;top: 0;}
  .worry__statement {font-size: 23px;margin-top: 20px;}
  .worry__bottom {flex-direction: column;align-items: center;text-align: center;gap: 22px;/* margin-top: 20px; */}
  .worry__notes {align-items: center;padding-bottom: 0;margin-top: 0;gap: 0;}
  .worry__note {font-size: 20px;white-space: normal;}
  .hl-green {padding: 3px 10px;line-height: 2;}
  .worry__illust { width: 88%; max-width: 400px; }

  /* ---- ステージ ---- */
span.stage-item__no {
    width: 25%;
}
.stage-wall img {
    width: 70%;
}	
  .stage { padding: 70vw 0 16vw; }
  .stage__eyebrow { font-size: 18px; }
  .stage__title { font-size: 25px; }
  .stage__lead { font-size: 15px; }
  .stage-list { max-width: 100%; }
  .stage-item__head { font-size: 19px; padding: 14px; text-align: center; }
  .stage-goal-tag { position: static; transform: none; display: flex; justify-content: center; margin: 0 0 6px; font-size: 14px; }
  .stage-item__body { gap: 16px; padding: 18px 16px; }
  .stage-item__icon { width: 92px; height: 80px; }
  .stage-item__desc { font-size: 15px; }
  .stage-item__note { font-size: 13px; }
  .stage-wall { height: 120px; }
  .stage-wall::before { width: 170px; height: 170px; }
  .stage__after1 { font-size: 23px; }
  .stage__eyebrow2 { font-size: 17px; }
  .stage__after2 { font-size: 26px; }

  /* ---- Now→After 比較 ---- */
  .compare { padding: 13.33vw 0 16vw; }
  .compare__title { font-size: 25px; }
  .compare__head, .compare-row { grid-template-columns: 1fr 34px 1fr; }
  .compare__watermark { font-size: 52px; }
  .compare__col-head { height: 74px; }
  .compare__label { font-size: 15px; }
  .compare-card { padding: 13px 8px; font-size: 14px; border-radius: 10px; }
  .compare-arrow { border-top-width: 11px; border-bottom-width: 11px; border-left-width: 16px; }
  .compare__illusts { gap: 16px; }
  .compare__illust img{height: 140px;object-fit: contain;}
  .compare__banner-line1, .compare__banner-line2 { font-size: 17px; padding: 10px 14px; }

  /* ---- 比較マトリクス ---- */
  .matrix {padding: 20vw 0 16vw;}
  .matrix__title { font-size: 25px; }
  .matrix__sub { font-size: 17px; gap: 10px; }
  .matrix__sub::before, .matrix__sub::after { width: 40px; }
  .matrix-table, .matrix-arrows { grid-template-columns: 56px repeat(3, 1fr); }
  .matrix-table > div { padding: 12px 5px; font-size: 12px; }
  .matrix-colhead { font-size: 12.5px; }
  .matrix-rowlabel { font-size: 12.5px; }
  .matrix-cell--main .accent-text { font-size: 13px; }
  .matrix-arrow__cap { font-size: 11px; }
  .matrix-result { flex-direction: column; gap: 10px; }
  .matrix-result__illust { width: 220px; height: 160px; }
  .hex { width: 108px; height: 122px; font-size: 19px; }
  .matrix-result__cap { font-size: 18px; }
  .matrix-result__cap strong { font-size: 22px; }
  .matrix-note { font-size: 14px; padding: 20px; }

  /* ---- 無料公開動画 ---- */
  .movie { padding: 16vw 0 13.33vw; }
  .movie__title { font-size: 25px; }
  .movie__lead { font-size: 15px; }

  /* ---- 3つの柱 ---- */
  .pillars {padding: 20vw 0 16vw;}
  .pillars__title {font-size: 25px;margin-bottom: 40px;}
  .pillars__title .accent-text { font-size: 32px; }
  .pillar {flex-direction: column;/* text-align: center; */padding: 34px 20px 28px;gap: 18px;align-items: center;}
  .pillar__no { left: 12px; }
  .pillar__illust {width: 90%;/* height: 158px; */}
  .pillar__head { justify-content: center; font-size: 21px; }
  .pillar__desc { font-size: 15px; }

  /* ---- 個別サポートの実例 ---- */
  .example { padding: 13.33vw 0 14.93vw; background: url(assets/gradation_bg_sp.webp) center no-repeat;
        background-size: cover;}
  .example__title { font-size: 24px; }
  .example__body { flex-direction: column; gap: 24px; }
  .example__photo { width: 100%; height: 240px; }
  .example__note { font-size: 13px; }

  /* ---- カリキュラム ---- */
  .curriculum {padding: 20vw 0 16vw;}
  .curriculum__title { font-size: 27px; }
  .curriculum__title .accent-text { font-size: 34px; }
  .curriculum__lead { font-size: 15px; }
  .curr-part__head {font-size: 20px;/* flex-wrap: wrap; */}
  .curr-lessons { grid-template-columns: 1fr; }
  .curr-box { font-size: 15px; padding: 22px 20px; }
.curr-part_icons{
	display: flex;
	flex-direction: column;
    gap: 10px;
	align-items: flex-start;
}
	.curr-part_icons img{
	    width: 70%;
	}
  /* ---- 伴走の価値 ---- */
  .accompany { padding: 13.33vw 0 14.93vw; background: url(assets/sec11_bg_sp.webp) center top no-repeat;
        background-size: cover;}
  .accompany__title { font-size: 27px; }
  .accompany__body { flex-direction: column; gap: 20px; }
  .accompany__illust { width: 100%; height: 240px; }
  .accompany__text { font-size: 15px; }
  .accompany__banner { font-size: 18px; padding: 12px 18px; }

  /* ---- 受講者の声 ---- */
  .voice {padding: 20vw 0 60px;}
  .voice__title { font-size: 27px; margin-bottom: 34px; }
  .voice-cards { grid-template-columns: 1fr; gap: 20px; max-width: 400px; }

  /* ---- FAQ ---- */
  .faq {padding: 20vw 0 60px;}
  .faq__title { font-size: 27px; }
  .faq-text { font-size: 16px; }

  /* ---- 最終CTA ---- */
  .cta-final { padding: 50px 0 60px; }
  .cta-final__title { font-size: 30px; }
  .cta-final__lead { font-size: 16px; }
  .cta-final__emph { font-size: 18px; }
  .cta-final__btn { font-size: 20px; padding: 20px 30px; width: 100%; max-width: 440px; justify-content: center; }
.watermark img {
    width: 60%;
}

.matrix:before {
    width: 52vw;
}

.matrix:after {
    width: 52vw;
    top: 84%;
}

.pillars:before {
    width: 52vw;
}

.pillar__content {
    width: 100%;
}
}
/* =========================================================
   フッター
   ========================================================= */
footer {
    background: var(--color-text-dark);
    color: #fff;
	padding-bottom: 30px;
	text-align: center;
}
.footer_inner{
  display: flex;
  /* flex-direction: column; */
  align-items: center;
  padding: 30px 0;
  justify-content: center;
  border-bottom: 1px solid #7f7a77;
  margin-bottom: 20px;
}
@media (max-width: 767px) {
  .footer_inner{
    flex-direction: column; 
  }
}
/* =========================================================
   スクロール出現アニメーション
   ========================================================= */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* =========================================================
   フローティングCTA
   ========================================================= */
/* ---- PC：右下フローティング ---- */
.float-cta {
  position: fixed;
  bottom: 32px;
  right: 32px;
  z-index: 900;
  pointer-events: none;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.float-cta.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.float-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 0 36px;
  height: 76px;
  background: var(--color-green);
  color: #fff;
  border-radius: 300px;
  text-decoration: none;
  font-weight: 700;
  font-size: 22px;
  white-space: nowrap;
  box-shadow: 0 8px 0 #009b78, 0 14px 24px rgba(0, 155, 120, 0.4);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.float-cta__btn:hover {
  transform: translateY(3px);
  box-shadow: 0 5px 0 #009b78, 0 8px 14px rgba(0, 155, 120, 0.35);
}

.float-cta__main {
  font-size: 26px;
}

.float-cta__arrow {
  font-size: 16px;
  transform: translateY(1px);
}

/* ---- SP：下部中央フル幅バー ---- */
@media (max-width: 767px) {
  .float-cta {
    bottom: 0;
    right: 0;
    left: 0;
    display: flex;
    justify-content: center;
    padding: 10px 16px 16px;
    background: linear-gradient(to top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
    transform: translateY(100%);
  }
  .float-cta.is-visible { transform: translateY(0); }
  .float-cta__btn { height: 60px; font-size: 15px; gap: 8px; padding: 0 24px; width: 100%; max-width: 440px; }
  .float-cta__main { font-size: 18px; }
  .float-cta__arrow { font-size: 12px; }
}