/* ===========================================
   リセット・ベース
=========================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  line-height: 1.8;
  color: #333;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

a {
  color: inherit;
  text-decoration: none;
}

ul, ol {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

h2{
	font-family: 'Noto Serif JP', serif;
  font-weight: 600;
  color: #222;
  margin-bottom: 32px;
	    font-size: 2.2rem;
		line-height: 1.5;
	  color: #76460D;
	text-align: center;
}

@media (max-width: 768px) {
	h2 {
		font-size: 2rem;
		line-height: 1.5;
	}

.h2_small{
	font-size: 1.7rem;
	}
}
/* ===========================================
   ユーティリティ
=========================================== */
.pc-only {
  display: inline !important;
}

.sp-only {
  display: none !important;
}

@media (max-width: 768px) {
  .pc-only {
    display: none !important;
  }
  .sp-only {
    display: inline !important;
  }
}

.cta_small{
	font-size: 0.7rem;
}
.floating-cta {
	text-align: center;
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9999;

  padding: 15px 26px;
  border-radius: 999px;
  font-weight: 700;
  text-decoration: none;
  color: #4b3a00;
  font-family: noto serif JP,serif;

  background: linear-gradient(
    135deg,
    #fff6d8 0%,
    #f6e27f 25%,
    #e6c45a 50%,
    #f6e27f 75%,
    #fff6d8 100%
  );

  box-shadow:
    0 4px 10px rgba(180,140,40,0.35),
    0 10px 25px rgba(120,90,20,0.25),
    inset 0 1px 0 rgba(255,255,255,0.8);

  transition: opacity .3s, transform .3s;
}

.floating-cta.is-hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateY(20px);
}


/* ===========================================
   共通ボタン
=========================================== */
.cta-button {
  display: block;
  width: min(92vw, 420px);
  aspect-ratio: 978 / 231;     /* CTA画像の比率 */
  background-image: url("assets/CTASP.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.cta-button:hover {
  transform: translateY(-3px);
	  filter: brightness(1.15) saturate(0.8);
  opacity: 0.9;
}

.cta-button--large {
  padding: 18px 64px;
  font-size: 18px;
}

/* ===========================================
   ヘッダー
=========================================== */
.header {
  background-color: #2c2c2c;
  padding: 16px 24px;
}

.header__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.header__logo-text {
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}

/* ===========================================
   ヒーローセクション
=========================================== */
.hero {
  background-image: url("assets/FVPC.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% auto;   /* 横幅基準で高さ自動 */

  width: 100%;
  aspect-ratio: 1920 / 1134;    
  
    min-height: auto;  /* ← これが重要！ 100svhを無効化 */
    height: auto;        

  display: flex;
  align-items: flex-end;
}

.hero__inner {
  width: 100%;
  display: flex;
  justify-content: center;
}


/* ===========================================
   監修者紹介
=========================================== */
.section-intro{
	background: linear-gradient(180deg, #FFF 0%, #F7F0E4 100%);
}
.section-intro__layout{
  max-width: 1100px;       /* 右に画像を置くので広げる */
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}

.highlightP{
	background: linear-gradient(transparent 90%, #3700FF 90%);
}

/* 左は左揃えに */
.section-intro__content{
  text-align: left;
}

/* 右の画像 */
.section-intro__visual{
  display: flex;
  justify-content: center;
}

.section-intro__visual-img{
    width: 100%;
  max-width: 420px;
  height: auto;
  display: block;
}

.section-supervisor {
  background-color: #fff;
  padding: 48px 24px;
  text-align: center;
}

.section-supervisor__inner {
  max-width: 800px;
  margin: 0 auto;
}

.section-supervisor__badge {
  display: inline-block;
  background-color: #c9a86c;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 8px 24px;
  border-radius: 4px;
  margin-bottom: 20px;
}

.section-supervisor__text {
  font-size: 15px;
  line-height: 2;
  color: #444;
}
.section-intro__layout{
  display: grid;
  grid-template-columns: 1fr 420px;   /* 左テキスト / 右画像 */
  gap: 64px;
  align-items: start;
}

.section-intro__visual{
  grid-column: 2;      /* 強制的に右列へ */
}

.section-intro__content{
  grid-column: 1;
}
@media (max-width: 768px) {

  .section-intro__layout{
    display: flex;
    flex-direction: column;
  }

  .section-intro__content{
    order: 1;
  }

  .section-intro__visual{
    order: 2;
    margin-top: 24px;
  }
}

/* ===========================================
   開催情報バナー
=========================================== */
.section-info-banner {
  background-color: #444;
  padding: 40px 24px;
  text-align: center;
}

.section-info-banner__inner {
  max-width: 800px;
  margin: 0 auto;
}

.section-info-banner__format {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 8px;
}

.section-info-banner__date {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 16px;
}

.section-info-banner__price-block {
  margin-bottom: 24px;
}

.section-info-banner__discount {
  display: inline-block;
  background-color: #d4534a;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 4px;
  margin-bottom: 12px;
}

.section-info-banner__price {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.section-info-banner__original {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.6);
  text-decoration: line-through;
}

.section-info-banner__arrow {
  font-size: 18px;
  color: #fff;
}

.section-info-banner__special {
  font-size: 32px;
  font-weight: 700;
  color: #c9a86c;
}

.section-info-banner__note {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.8);
}

/* ===========================================
   導入セクション
=========================================== */
.section-intro {
  background-color: #fff;
  padding: 80px 24px;
}

.section-intro__inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.section-intro__title {
  font-family: 'Noto Serif JP', serif;
  font-weight: 600;
  color: #222;
  margin-bottom: 32px;
	    font-size: 2.3rem;
	  color: #76460D;
}

.section-intro__text {
  font-size: 15px;
  line-height: 2;
  color: #444;
  margin-bottom: 24px;
}

.section-intro__list {
  text-align: left;
  max-width: 600px;
  margin: 0 auto 32px;
}

.section-intro__list li {
  position: relative;
  padding-left: 24px;
  font-size: 14px;
  line-height: 2;
  color: #555;
  margin-bottom: 16px;
}

.section-intro__list li::before {
  content: "・";
  position: absolute;
  left: 0;
  color: #c9a86c;
}

.section-intro__highlight {
  font-family: 'Noto Serif JP', serif;
  font-size: 18px;
  font-weight: 700;
  color: #555;
  margin-bottom: 24px;
  line-height: 1.8;
}

.section-intro__cta-text {
  font-size: 16px;
  font-weight: 500;
  color: #333;
  line-height: 2;
}

/* ===========================================
   なぜ、学んだままになってしまうのか？
=========================================== */
.section-why {
  background-color: #fff;
  padding: 80px 24px;
}

.section-why__inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.section-why__title {

}

.section-why__subtitle {
  font-size: 15px;
  color: #555;
  line-height: 2;
  margin-bottom: 48px;
  text-align: center;
}

.section-why__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.section-why__card {
  background-color: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  padding: 24px;
  text-align: left;
}

.section-why__card-image {
  margin-bottom: 16px;
}

.section-why__card-placeholder {
  width: 100%;
  aspect-ratio: 16 / 10;
  background-color: #e8e8e8;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #aaa;
}

.section-why__card-number {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  color: #191919;
  font-size: 4rem;
  font-weight: 400;
  margin: 12px 12px;
  font-family: noto serif JP, serf;
}

.section-why__card-title {
  font-size: 1.7rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 12px;
  line-height: 1.5;
  font-family: noto serif JP;
}

.hl-gray {
  background: linear-gradient(transparent 65%, #ededed 10%);
}


.section-why__card-text {
  font-size: 13px;
  color: #666;
  line-height: 1.9;
  text-align: left;
}

/* ===========================================
   6つの成果セクション
=========================================== */
.section-results {
  background: radial-gradient(
    circle at 10% 40%,
    #FFFFFF 0%,
    #FFF5F4 70%
  );
  padding: 80px 24px;
}

.section-results__inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.section-results__label {

}

.section-results__intro {
  margin-bottom: 48px;
}

.section-results__intro p {
  font-size: 15px;
  line-height: 2;
  color: #555;
  margin-bottom: 16px;
}

.section-results__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}

.section-results__item {
  background-color: #fff;
  border-top: 2px solid #BA792C;
  padding: 24px 20px;
  text-align: center;
}

.section-results__item-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 16px;
}

.section-results__item-number {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  color: #fff;
  margin-bottom: 8px;
}

.section-results__item-label {
  font-size: 12px;
  color: #888;
}

.section-results__item-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: #BA8D2C;
  line-height: 1.5;
  margin-bottom: 12px;
	font-family: noto serif JP , serif;
}

.section-results__item-text {
  font-size: 13px;
  color: #666;
  line-height: 1.8;
  text-align: left;
}

/* ===========================================
   CTAセクション
=========================================== */
.cta-section {
  background-color: #fff;
  padding: 40px 24px;
  text-align: center;
}

.cta-section__inner {
  max-width: 1100px;
  margin: 0 auto;
	display: flex;
	gap:24px;
}

.cta-section__inner2 {
  max-width: 600px;
  margin: auto;
	text-align: center;
}

.cta-section__inner3 {
  max-width: 600px;
  margin: auto;
}

.cta-section__note {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.8);
  margin-top: 16px;
}

.cta-section--large {
  padding: 60px 24px;
}

.cta-section--footer {
  background-color: #3a3a3a;
}

@media (max-width: 768px){
  .cta-section__inner{
    width: 100%;
    max-width: 100%;
    padding: 0 0px;          /* 余白ぶん確保（はみ出し防止） */
    box-sizing: border-box;
  }

  .cta-section__inner2{
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  /* ボタン（背景画像で作ってる前提） */
  .cta-button{
    width: min(100%, 420px);  /* vw禁止。親幅基準に */
    max-width: 100%;
  }

  /* 中の画像が原因のことが多いので強制で収める */
  .cta-section__inner2 img{
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
  }
}
/* ===========================================
   プログラムの内容
=========================================== */
.section-program{
  position: relative;
  overflow: hidden;
	padding: 80px 24px;
}

.section-program::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("assets/sec05bg.jpg");
  background-size: cover;
  background-position: left;
  opacity: 0.9;   /* ← ここで透明度 */
  z-index: 0;
}

/* 中身は前に出す */
.section-program > *{
  position: relative;
  z-index: 1;
}

.section-program__inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.section-program__label {
  font-size: 13px;
  color: #888;
  margin-bottom: 8px;
}

.section-program__title {
  font-family: 'Noto Serif JP', serif;
  font-size: 26px;
  font-weight: 600;
  color: #222;
  margin-bottom: 48px;
  line-height: 1.5;
}

.section-program__cards {
  display: flex;
  flex-direction: row;
  gap: 32px;
}

.section-program__card {
  display: flex;
	flex-direction: column;
  gap: 0;
  background-color: rgba(255, 255, 255, 0.45);
  border-radius: 8px;
  overflow: hidden;
  text-align: left;
	flex: 1;
  min-width: 0; 
	border: solid 1px #fff;
}

.section-program__card-image {
  width: 100%;
}

.section-program__card-placeholder {
  width: 100%;
  height: 100%;
  min-height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.section-program__card-content {
  padding: 32px;
}

.section-program__card-title {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.2rem;
  font-weight: 600;
  color: #76460D;
  margin-bottom: 8px;
  line-height: 1.5;
}

.highlightY{
		background: linear-gradient(transparent 30%, #EEEC7F 30%);
}

.section-program__card-subtitle {
  font-size: 14px;
  color: #888;
  margin-bottom: 20px;
}

.section-program__card-text {
  font-size: 14px;
  color: #555;
  line-height: 1.9;
  margin-bottom: 16px;
}

.section-program__card-highlight {
  font-size: 14px;
  font-weight: 600;
  color: #c9a86c;
  line-height: 1.9;
  margin-bottom: 16px;
}

.section-program__curriculum {
  background-color: #fff;
  border-radius: 8px;
  padding: 20px;
  margin-top: 16px;
}

.section-program__curriculum-title {
  font-size: 14px;
  font-weight: 600;
  color: #333;
  margin-bottom: 12px;
}

.section-program__curriculum-list {
  list-style: none;
}

.section-program__curriculum-list li {
  position: relative;
  padding-left: 20px;
  font-size: 13px;
  color: #555;
  line-height: 1.8;
  margin-bottom: 8px;
}

.section-program__curriculum-list li::before {
  content: "・";
  position: absolute;
  left: 0;
  color: #c9a86c;
}

@media (max-width: 768px){
	.section-program__cards{
		flex-direction: column;
	}
	}



.cta-section2{
  position: relative;
  overflow: hidden;
  padding: 80px 24px;
}

.cta-section2::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("assets/CTA2bg.png");
  background-size: cover;
  background-position: center;
  opacity: 0.4;
  z-index: 0;
}

/* 中身は前に出す */
.cta-section2 > *{
  position: relative;
  z-index: 1;
}

.cta-section__inner4{
  width: min(900px, 80%);
  margin: 0 auto;
  text-align: center;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  box-sizing: border-box;
}

.CTA2text{
  display: block;
  width: min(680px, 70%);
  max-width: 100%;
  height: auto;
}

/* CTAボタン（PCは広め、SPは親幅基準で縮む） */
.cta-button2{
  display: block;
  width: min(620px, 100%);     /* ← vwやめて親基準に */
  max-width: 100%;
  aspect-ratio: 978 / 231;
  background-image: url("assets/CTAPC.png"); /* ← PC用にするならここ */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* SP */
@media (max-width: 768px){
  .cta-section2{
    padding: 56px 16px;
  }

  .cta-section__inner4{
    width: 100%;
    padding: 0;               /* 親paddingで十分 */
    gap: 14px;
  }

  .CTA2text{
    width: 100%;
  }

  .cta-button2{
    background-image: url("assets/CTASP.png"); /* ← SP用に切替 */
    width: min(420px, 100%);
  }
}

/* ===========================================
   卒業生の声
=========================================== */
.section-voice {
  background: radial-gradient(
    circle at 10% 40%,
    #FFFFFF 0%,
    #FFF5F4 70%
  );
  padding: 80px 24px;
}

.section-voice__inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.section-voice__label {
  font-size: 14px;
  color: #c9a86c;
  margin-bottom: 8px;
  font-weight: 500;
}

.section-voice__title {
  font-family: 'Noto Serif JP', serif;
  font-size: 26px;
  font-weight: 600;
  color: #222;
  margin-bottom: 48px;
}

.section-voice__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.section-voice__card {
  background-color: #fff;
  border-radius: 8px;
  padding: 28px;
  text-align: left;
}

.section-voice__card-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}

.section-voice__card-avatar {
  flex-shrink: 0;
}

.section-voice__card-avatar-placeholder {
  width: 60px;
  height: 60px;
  background-color: #ddd;
  border-radius: 50%;
}

.section-voice__card-info {
  flex: 1;
}

.section-voice__card-name {
  font-size: 15px;
  font-weight: 600;
  color: #333;
}

.section-voice__card-text {
  font-size: 14px;
  color: #555;
  line-height: 1.9;
  margin-bottom: 12px;
}

.section-voice__card-highlight {
  font-size: 14px;
  font-weight: 600;
  color: #c9a86c;
  line-height: 1.8;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #e5e5e5;
}

/* ===========================================
   期間限定特典
=========================================== */

.section-bonus{
  position: relative;
  overflow: hidden;
	padding: 80px 24px;
}

.section-bonus::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("assets/sec08bg.jpg");
  background-size: cover;
  background-position: left;
  opacity: 0.4;   /* ← ここで透明度 */
  z-index: 0;
}

/* 中身は前に出す */
.section-bonus > *{
  position: relative;
  z-index: 1;
}
.section-bonus__inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.section-bonus__title {
  font-family: 'Noto Serif JP', serif;
  font-size: 26px;
  font-weight: 600;
  color: #222;
  margin-bottom: 24px;
}

.section-bonus__intro {
  font-size: 15px;
  color: #555;
  line-height: 2;
  margin-bottom: 16px;
}

.section-bonus__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 40px;
}

.section-bonus__card {
  background-color: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  padding: 32px 24px;
  text-align: center;
}

.section-bonus__card-number {
  display: inline-block;
  background-color: #c9a86c;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 16px;
  border-radius: 20px;
  margin-bottom: 16px;
}

.section-bonus__card-title {
  font-size: 16px;
  font-weight: 600;
  color: #333;
  margin-bottom: 16px;
  line-height: 1.5;
}

.section-bonus__card-text {
  font-size: 13px;
  color: #666;
  line-height: 1.9;
  text-align: left;
  margin-bottom: 8px;
}

/* ===========================================
   開催概要
=========================================== */
/* =========================
   開催概要（Overview）
========================= */
.overview{
  background: #fff;
  padding: 96px 24px;
}

.overview__inner{
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.overview__title{
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 36px;
  font-weight: 600;
  color: #6b4a1e; /* 見出しの茶系 */
  letter-spacing: 0.02em;
  margin: 0 0 16px;
}

.overview__lead{
  text-align: center;
  font-size: 14px;
  line-height: 2;
  color: #333;
  margin: 0 0 56px;
}

.overview__body{
  display: flex;
  grid-template-columns: 360px 1fr; /* 左画像 + 右説明 */
  gap: 56px;
  align-items: start;
}

/* 左画像 */
.overview__image img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 2px;
}

/* 右側の情報グリッド */
.info-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 56px; /* 行gap / 列gap */
}

.info-card{
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: start;
}

.info-card__icon{
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  color: #333;
}

.info-card__icon img{
  width: 28px;
  height: 28px;
}

.info-card__title{
  margin: 0 4px;
  font-size: 16px;
  font-weight: 700;
  color: #222;
	text-align: left;
}

.info-card__text{
  margin: 0;
  font-size: 13px;
  line-height: 1.9;
  color: #333;
	text-align: left;
}

/* 「対象」は2列分をまたがせる（画像みたいに下で大きめブロック） */
.info-card--span{
  grid-column: 1 / -1;
  margin-top: 8px;
}

/* レスポンシブ */
@media (max-width: 900px){
  .overview__body{
    grid-template-columns: 1fr;
  }
  .overview__image{
    max-width: 420px;
    margin: 0 auto;
  }
}

@media (max-width: 768px){
  .overview{
    padding: 72px 16px;
  }
  .overview__title{
    font-size: 28px;
  }
  .overview__lead{
    margin-bottom: 32px;
  }
  .info-grid{
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .info-card--span{
    grid-column: auto;
  }
}


/* ===========================================
   料金
=========================================== */
/* =========================
  価格ブロック（左テキスト / 右画像カード）
========================= */
.price-intro{
  background: #fff;
  padding: 96px 24px;
}

.price-intro__inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 56px;
  align-items: start;
}

/* 左 */
.price-intro__content{
  text-align: left;
}

.price-intro__kicker{
  margin: 0 0 18px;
  font-family: "Noto Serif JP", serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: .02em;
  color: #6b4a1e; /* ブラウン系 */
}

.price-intro__title{
  margin: 0 0 28px;
  font-family: "Noto Serif JP", serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.35;
  color: #6b4a1e;
}

.price-intro__lead{
  margin: 0 0 22px;
  font-size: 16px;
  line-height: 2;
  color: #222;
}

.price-intro__text{
  margin: 0 0 18px;
  font-size: 14px;
  line-height: 2.1;
  color: #222;
}

/* 右：画像カード */
.price-intro__visual{
  display: flex;
  justify-content: center;
}

.price-intro__card{
  width: min(520px, 42vw);
  
  background: #fff;
  padding: 16px;            /* 画像の周りに余白が欲しい場合 */
}

.price-intro__card img{
  display: block;
  width: 100%;
  height: auto;
}

/* =========================
  Responsive
========================= */
@media (max-width: 900px){
  .price-intro__inner{
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .price-intro__visual{
    justify-content: flex-start; /* SPで左寄せにしたい場合 */
  }

  .price-intro__card{
    width: min(92vw, 520px);
  }
}

@media (max-width: 768px){
  .price-intro{
    padding: 72px 16px;
  }

  .price-intro__title{
    font-size: 28px;
  }

  .price-intro__kicker{
    font-size: 16px;
  }

  .price-intro__lead{
    font-size: 15px;
  }

  .price-intro__text{
    font-size: 13px;
  }
}


/* ===========================================
   よくある質問
=========================================== */
.section-faq {
  background-color: #fff;
  padding: 80px 24px;
}

.section-faq__inner {
  max-width: 800px;
  margin: 0 auto;
}

.section-faq__title {
  font-family: 'Noto Serif JP', serif;
  font-size: 26px;
  font-weight: 600;
  color: #222;
  text-align: center;
  margin-bottom: 48px;
}

.section-faq__list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.section-faq__item {
  overflow: hidden;
	border-top: solid 2px #000;
}

.section-faq__question {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 24px;
}

.section-faq__q {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  background-color: #c9a86c;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  border-radius: 50%;
  flex-shrink: 0;
}

.section-faq__question-text {
  font-size: 15px;
  font-weight: 600;
  color: #333;
  line-height: 1.6;
  padding-top: 2px;
}

.section-faq__answer {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 24px;
  background-color: #fff;
}

.section-faq__a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  background-color: #666;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  border-radius: 50%;
  flex-shrink: 0;
}

.section-faq__answer-text {
  font-size: 14px;
  color: #555;
  line-height: 1.9;
  padding-top: 4px;
}

/* ===========================================
   最後に
=========================================== */
.section-closing {
  background-image: url("assets/sec11bg.png");
  padding: 80px 24px;
}

.section-closing__inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.section-closing__title {
  font-family: 'Noto Serif JP', serif;
  font-size: 26px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 40px;
}

.section-closing__text p {
  font-size: 15px;
  color: #fff;
  line-height: 2.2;
  margin-bottom: 24px;
}

.closetext{
			background: linear-gradient(transparent 0%, #03408F 30%);
}

/* ===========================================
   フッター
=========================================== */
.footer {
  background-color: #76460D;
  padding: 40px 24px;
  text-align: center;
}

.footer__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.footer__text {
  font-size: 14px;
  color: #fff;
  margin-bottom: 12px;
}

.footer__copyright {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
}

/* ===========================================
   レスポンシブ（SP: max-width 768px）
=========================================== */
@media (max-width: 768px) {
  /* ヒーロー */
  .hero {
  background-image: url("assets/FVSP.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% auto;   /* 横幅基準で高さ自動 */

  width: 100%;
  aspect-ratio: 1045 / 2006;    /* ← ここが高さを決める */
  min-height: 100svh;         

  display: flex;
  align-items: flex-end;
  }

  .hero__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .hero__lead {
    font-size: 16px;
  }

  .hero__emphasis {
    font-size: 22px;
  }

  .hero__description {
    font-size: 14px;
  }

  .hero__title {
    font-size: 22px;
  }

  .hero__image {
    order: -1;
  }

  .hero__image-placeholder {
    max-width: 100%;
  }

  /* 監修者 */
	
	.section-intro__layout{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .section-intro__visual{
    order: -1; /* 画像を上にしたいなら */
  }

  .section-intro__visual-img{
    width: min(92vw, 420px);
  }
	
  .section-supervisor {
    padding: 40px 16px;
  }

  .section-supervisor__text {
    font-size: 14px;
  }

  /* 情報バナー */
  .section-info-banner {
    padding: 32px 16px;
  }

  .section-info-banner__date {
    font-size: 18px;
  }

  .section-info-banner__special {
    font-size: 28px;
  }

  .cta-button {
  background-image: url("assets/CTASP.png");
  width: min(100vw, 420px);   /* ← SPではこれ */
  aspect-ratio: 825 / 195; /* CTA画像の比率 */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
	  margin: auto;
	  text-align: center;
  }

  .cta-button--large {
    font-size: 16px;
  }

  /* 導入 */
  .section-intro {
    padding: 60px 16px;
  }

  .section-intro__title {

  }

  .section-intro__highlight {
    font-size: 16px;
  }

  /* なぜセクション */
  .section-why {
    padding: 60px 16px;
  }

  .section-why__title {
    font-size: 22px;
  }

  .section-why__cards {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* 6つの成果 */
  .section-results {
    padding: 60px 16px;
  }

  .section-results__label {
    font-size: 18px;
  }

  .section-results__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* CTA */
  .cta-section {
    padding: 32px 16px;
  }

  .cta-section--large {
    padding: 48px 16px;
  }

  /* プログラム内容 */
  .section-program {
    padding: 60px 16px;
  }

  .section-program__title {
    font-size: 20px;
  }

  .section-program__card {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .section-program__card-placeholder {
    min-height: 200px;
  }

  .section-program__card-content {
    padding: 24px;
  }

  .section-program__card-title {
    font-size: 18px;
  }

  /* 卒業生の声 */
  .section-voice {
    padding: 60px 16px;
  }

  .section-voice__title {
    font-size: 20px;
  }

  .section-voice__cards {
    grid-template-columns: 1fr;
  }

  /* 期間限定特典 */
  .section-bonus {
    padding: 60px 16px;
  }

  .section-bonus__title {
    font-size: 20px;
  }

  .section-bonus__cards {
    grid-template-columns: 1fr;
  }

  /* 開催概要 */
  .section-overview {
    padding: 60px 16px;
  }

  .section-overview__title {
    font-size: 20px;
  }

  .section-overview__table th,
  .section-overview__table td {
    display: block;
    width: 100%;
    padding: 12px 16px;
  }

  .section-overview__table th {
    padding-bottom: 4px;
  }

  .section-overview__table td {
    padding-top: 0;
    padding-bottom: 16px;
  }

  /* 料金 */
  .section-price {
    padding: 60px 16px;
  }

  .section-price__title {
    font-size: 20px;
  }

  .section-price__box {
    padding: 32px 24px;
  }

  .section-price__original-value {
    font-size: 20px;
  }

  .section-price__special-value {
    font-size: 36px;
  }

  .section-price__deadline {
    padding: 20px;
  }

  .section-price__deadline-date {
    font-size: 18px;
  }

  /* FAQ */
  .section-faq {
    padding: 60px 16px;
  }

  .section-faq__title {
    font-size: 20px;
  }

  .section-faq__question,
  .section-faq__answer {
    padding: 16px;
    gap: 12px;
  }

  /* 最後に */
  .section-closing {
    padding: 60px 16px;
  }

  .section-closing__title {
    font-size: 20px;
  }

  .section-closing__text p {
    font-size: 14px;
    text-align: left;
  }

  /* フッター */
  .footer {
    padding: 32px 16px;
  }
}