@media screen and (min-width: 768px) {
  .lpvt h2 {
	  font-size: 24px;
  }
  .lpvt h2.txt-large,
  .txt-large {
	  font-size: 32px;
  }
}
@media screen and (max-width: 767px) {
  .lpvt h2 {
	  font-size: 18px;
  }
  .lpvt h2.txt-large,
  .txt-large {
	  font-size: 24px;
  }
}


/* ==========================================================================
   2. 画像（このファイルからの相対パスで指定）
   ========================================================================== */

/* 導入：悩みリストのチェックアイコン
   ※ダンスは悩み枠の女の子を <img> タグで表示するため、lp-intro-frame の背景画像指定は不要。 */
.lp-intro-list li {
	background-image: url('./lp-check.png');
}

/* 料金：「人気」「おすすめ」バッジ */
.lp-pop-ninki th::before {
	background-image: url('./lp-pop-ninki.png');
}
.lp-pop-osusume th::before {
	background-image: url('./lp-pop.png');
}

/* 流れ：ステップ間の矢印アイコン */
.lp-flow-list > li::after {
	background-image: url('./lp-flow-icon.png');
}


/* ==========================================================================
   3. CVボタン：アローSVG を使わず、グラデ + CSS矢印で構築
   ========================================================================== */

.lp-cv-btn a {
	background: var(--lp-color-primary-gradient);
}
/* CSSで描く右矢印（共通CSSはここに背景画像アイコンを置かない設計） */
.lp-cv-btn a::after {
	content: '';
	position: absolute;
	right: 30px;
	width: 7px;
	height: 7px;
	border-top: 2px solid #FFFFFF;
	border-right: 2px solid #FFFFFF;
	transform: rotate(45deg);
}


/* ==========================================================================
   4. メインビジュアル（テキスト型）
   ========================================================================== */

.lp-sec-mv {
	position: relative;
}
/* タイトル：左上にテキスト配置 */
.lp-mv-h {
  font-weight: bold;
	color: #FFF;
	text-shadow: 0 3px 6px rgba(0, 0, 0, 0.64);
	line-height: 1.7;
}
.lp-mv-h small {
	display: inline-block;
	margin-bottom: 0.6em;
}

@media screen and (min-width: 768px) {
  .lp-mv-title {  
  	left: 10%;
	  top: 10%;
  }
  .lp-mv-h {
	  font-size: 54px;
  }
  .lp-mv-h small {
	  font-size: 24px;
  }
}
@media screen and (max-width: 767px) {
	.lpvt .lp-sec-mv {
    padding-left: 20px; 
    padding-right: 20px;   
  }
	h1.lp-mv-h {
		font-size: 24px;
    padding: 0;
	}
}


/* ==========================================================================
   5. 導入：悩み枠の構造がボイスと異なる
   ボイスは右下に背景画像で女の子を入れていたが、
   ダンスは <img class="lp-intro-girl"> を絶対配置。直下に矢印アイコンも追加。
   ========================================================================== */

.lp-intro-frame {
	position: relative;
	margin: 8px auto;
	border: none;
}
.lpvt .lp-intro-frame h2 {
  background: transparent;
}
.lp-intro-list {
	flex-direction: column;
	width: 100%;
	padding: 0;
}
.lp-intro-list li {
	width: 100%;
}
.lp-intro-girl {
	position: absolute;
	bottom: 0;
}

/* 悩み枠下の矢印アイコン */
.lp-intro-arrow {
	margin-top: 16px;
	text-align: center;
}
.lp-intro-arrow img {
	width: 56px;
}
@media only screen and (min-width: 768px) {
  .lp-intro-frame {
	  padding: 0 80px 35px;
  }
}
@media only screen and (max-width: 767px) {
	.lp-intro-frame {
		width: 100%;
		padding: 16px;
	}
	.lp-intro-frame h2 {
    width: auto;
		font-size: 16px;
		background: linear-gradient(#FAFAFA 50%, #EAECF1 50%);
		border-radius: 8px;
	}
	.lp-intro-list {
		padding: 24px 16px;
	}
	.lp-intro-list li {
		font-size: 14px;
	}
}


/* ==========================================================================
   6. メリット：見出し色を黒に、波線下線をオフ、本文は太字解除
   ========================================================================== */

.lp-merit-copy span {
	color: #121422;
	text-decoration: none;
}
.lp-merit-text h3 {
	color: #121422;
}
@media only screen and (max-width: 768px) {
	h2.lp-merit-copy {
    font-size: 18px;
  }
	.lp-merit-copy span {
		font-size: 23px;
	}
	.lp-merit-text p {
		font-size: 14px;
	}
}


/* ==========================================================================
   7. 小CTA：オーバーラップ修飾子（メリット末尾と重ねる）
   ========================================================================== */

.lp-sec-cta-overlap {
	margin-top: -110px;
}
@media only screen and (max-width: 768px) {
	.lp-sec-cta-overlap {
		margin-top: 0;
	}
}


/* ==========================================================================
   8. 特徴セクション：ダンスは「2カード横並び」構造
   ボイスは 6つの「約束」画像グリッドだったが、ダンスは 2つのアイコン+テキストカード。
   共通CSSの .lp-feature-list は使わず、.lp-feature-cards を独自定義。
   ========================================================================== */

/* 共通の .lp-feature-title を flex 中央寄せに上書き */
.lp-feature-title {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: none;
	padding: 0;
}
.lp-feature-title h2 {
	margin-left: 0.5em;
	font-size: 32px;
	text-align: left;
}
.lp-feature-list > li {
	display: flex;
	width: 48%;
	padding: 24px;
	color: #000000;
	background: #FFFFFF;
	border: solid 4px #FAD95C;
	border-radius: 10px;
}
.lp-feature-icon {
	width: 80px;
	height: 80px;
	margin-right: 24px;
}
.lp-feature-text h3 {
	margin: 0 0 .5em;
}
.lp-feature-text p {
	margin: 0;
	line-height: 1.8;
}
@media only screen and (min-width: 768px) {
  .lp-feature-text h3 {
	  font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
	.lp-sec-feature .lp-container {
		padding: 20px 12px 0;
	}
	.lp-feature-title {
		flex-direction: column;
	}
	.lp-feature-title img {
		float: none;
		width: 30%;
	}
	.lp-feature-title h2 {
		float: none;
		width: auto;
		margin: 1em 0;
		padding: 0;
		font-size: 24px;
		text-align: center;
	}
	.lp-feature-list {
		flex-direction: column;
	}
	.lp-feature-list li {
		width: 100%;
		margin-bottom: 24px;
		padding: 24px 16px;
  }
	.lp-feature-text h3 {
		font-size: 18px;
	}
}

/* ==========================================================================
   9. レビュー：ダンスはアバター + 見出しを flex で同じ行に並べる
   ボイスは img を float:left していたが、ダンスは .lp-review-head ラッパーで flex。
   ========================================================================== */

/* 1カラム表示、共通CSSの float 設計を打ち消す */
.lp-review-list {
  display: initial;
}

/* ==========================================================================
   10. 大CTA promise の h2：ダンスは黒
   ========================================================================== */

@media screen and (min-width: 768px) {
  .lpvt .lp-sec-promise h2 {
    font-size: 32px;
  }
}

/* ==========================================================================
   15. 校舎一覧
   ========================================================================== */

@media only screen and (max-width: 768px) {
  .lp-school-copy {
    font-size: 18px;
  }
}