@charset "UTF-8";

/* --- ヒーローセクション --- */
.hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 5px 20px;
	max-width: 1280px;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}

.hero-content {
	flex: 1;
	max-width: 50%;
	z-index: 2;
}

/* タイトル画像（SVG） */
h1.hero-title-area {
	margin: 0 0 40px;
	padding: 0;
	font-size: inherit;
	font-weight: normal;
	line-height: inherit;
}

.hero-title-img {
	width: 100%;
	max-width: 600px;
	/* PC版での最大幅 */
	height: auto;
	display: block;
}

.hero-buttons {
	display: flex;
	gap: 20px;
	margin-left: 8%;
	/* SVG内のテキスト開始位置に合わせて調整（レスポンシブ対応） */
}

.hero-buttons .hero-btn {
	min-width: 240px;
	height: auto;
	padding: 15px 0;
	font-size: 14px;
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	/* 背景色を 0.3秒 かけて変化させる */
	transition: background-color 0.3s ease;
}

.hero-buttons .hero-btn:hover {
	background-color: #333333;
}

.hero-buttons .hero-btn i {
	margin-left: 15px;
	font-size: 14px;
}

/* ボタン1つの場合のスタイル */
.hero-buttons:has(.hero-btn-single) {
	justify-content: center;
	margin-left: 0;
}

.hero-buttons .hero-btn-single {
	min-width: 280px;
}

.hero-image {
	flex: 1;
	position: relative;
	display: flex;
	justify-content: flex-end;
}

.hero-section {
	text-align: center;
	font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	padding: 40px 20px;
	background-color: #fff;
}

.main-title {
	font-size: 32px;
	font-weight: bold;
	color: #444;
	line-height: 1.4;
	margin-bottom: 30px;
	position: relative;
	display: inline-block;
}

/* 上段のテキスト */
.title-sub {
	display: block;
	font-size: 0.9em;
	margin-bottom: 5px;
}

/* 緑色の強調部分 */
.highlight-green {
	color: #00A968;
	/* 画像に近い緑色 */
}

/* 装飾（キラキラ）の簡易再現 */
.deco {
	position: absolute;
	color: #8CDDbd;
	font-size: 20px;
}

.deco-left {
	top: 30px;
	left: -30px;
}

.deco-right {
	top: 10px;
	right: -30px;
}

/* PC Small レスポンシブ対応 (1024px - 1279px) */
@media screen and (min-width: 1024px) and (max-width: 1279px) {
	.hero-content {
		max-width: 55%;
	}

	.hero-buttons .hero-btn {
		min-width: 180px;
		font-size: 13px;
	}

	.hero-buttons .hero-btn i {
		margin-left: 8px;
	}

	.about-lead-text {
		font-size: 28px;
	}

	.about-lead-text .text-bold {
		font-size: 36px;
	}

	.about-lead-text .text-green-lg {
		font-size: 42px;
	}
}

/* Tablet レスポンシブ対応 (768px - 1023px) */
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.hero {
		padding: 30px 20px;
	}

	.hero-content {
		max-width: 50%;
	}

	.hero-title-area {
		margin-bottom: 30px;
	}

	.hero-buttons {
		flex-direction: column;
		align-items: center;
		gap: 10px;
		margin-left: 0;
	}

	.hero-buttons .hero-btn {
		min-width: 200px;
		width: 100%;
		max-width: 280px;
		font-size: 13px;
		padding: 12px 0;
	}

	.about-lead-text {
		font-size: 24px;
	}

	.about-lead-text .text-bold {
		font-size: 30px;
	}

	.about-lead-text .text-green-lg {
		font-size: 36px;
	}

	.reason-item {
		min-height: 220px;
	}

	.reason-image {
		min-width: 250px;
	}

	.reason-title {
		font-size: 26px;
	}

	.reason-desc {
		font-size: 14px;
	}

	.reason-icon {
		width: 100px;
	}

	.reason-icon.reason-icon-5 {
		width: 140px;
	}

	.function-card-list {
		gap: 20px;
	}

	.function-card {
		width: 48%;
		min-width: 240px;
	}

	.function-other-list {
		grid-template-columns: repeat(3, 1fr);
		gap: 30px 15px;
	}

	.price-card-list {
		flex-direction: column;
		align-items: center;
		gap: 30px;
	}

	.price-card {
		width: 100%;
		max-width: 500px;
	}
}

/* ボタンエリア */
.button-container {
	display: flex;
	justify-content: center;
	gap: 15px;
}

.btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 260px;
	padding: 15px 0;
	color: #fff;
	text-decoration: none;
	border-radius: 4px;
	font-weight: bold;
	font-size: 14px;
	position: relative;
	transition: opacity 0.3s;
	/* 背景色を 0.3秒 かけて変化させる */
	transition: background-color 0.3s ease;
}

.btn:hover {
	opacity: 0.9;
}

/* 左のボタン（ダークグレー） */
.btn-gray {
	background-color: #999;
}

/* 無効化ボタン */
.btn.disabled {
	pointer-events: none;
	opacity: 0.7;
	cursor: default;
}

/* 右のボタン（緑） */
.btn-green {
	background-color: #00A968;
}

/* 三角矢印の簡易再現 */
.arrow {
	margin-left: 10px;
	font-size: 10px;
}

.img-placeholder {
	width: 100%;
	max-width: 600px;
	height: auto;
	aspect-ratio: 3/2;
	/* アスペクト比を維持 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
}

/* --- About Us セクション --- */
.about-section {
	text-align: center;
	padding: 20px 40px 120px 40px;
	background-image: url('img/top/nt-japan-background.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
}

.section-title-en {
	color: var(--primary-green);
	font-size: 36px;
	margin: 0;
	font-weight: bold;
}

.section-title-jp {
	font-size: 14px;
	color: #666;
	margin-top: 5px;
	margin-bottom: 40px;
	font-weight: bold;
}

.about-inner {
	max-width: 800px;
	margin: 0 auto;
	position: relative;
}

.about-logo-text {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 20px;
}

/* Aboutセクションのテキスト調整 */
.about-lead-text {
	font-size: 32px;
	font-weight: bold;
	color: #333;
	line-height: 1.3;
	/* 行内は少し詰める */
	margin-bottom: 30px;
}

.lead-line-top {
	margin-bottom: 0px;
	/* ここの値を変更して行間を調整 */
}

.lead-line-bottom {
	margin-top: 0;
	/* 必要に応じて調整 */
}

.about-lead-text span {
	vertical-align: middle;
}

.about-lead-text .text-bold {
	font-size: 40px;
}

.about-lead-text .text-green-lg {
	font-size: 48px;
	color: var(--primary-green);
	/* margin-top: 5px; 不要になったため削除 */
}

/* バッジスタイル */
.about-badges {
	display: flex;
	justify-content: center;
	gap: 20px;
	margin-bottom: 40px;
}

.badge-green {
	background-color: #8CDDBD;
	color: #007040;
	padding: 8px;
	font-weight: bold;
	font-size: 16px;
	border-radius: 4px;
}

.about-description-text {
	font-size: 15px;
	color: #666;
	line-height: 1.8;
	margin-bottom: 40px;
	font-weight: 500;
}

.btn-black {
	background-color: #000;
	color: #fff;
	border-radius: 4px;
}

.btn-black:hover {
	background-color: #333333;
	opacity: 1;
}

.about-section .about-btn {
	width: 280px;
	height: auto;
	padding: 15px 0;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* --- reason セクション --- */
.reason-section {
	text-align: center;
	padding: 80px 0 120px 0;
	position: relative;
	background: none;
}

/* ユーザー追加のヘッダーエリア用スタイル */
.reason-header-area {
	margin-bottom: 40px;
}

/* H2: 選ばれる理由（日本語） */
.reason-header-area .title-ja {
	color: #00A968;
	font-size: 36px;
	/* 日本語なので少しサイズ調整 */
	margin-bottom: 10px;
	font-weight: bold;
}

/* P: Reason (英語) */
.reason-header-area .title-en {
	color: #333;
	/* 英語も緑にするか、目立たなくするか。指示は「小さく」。色は緑のままが無難か、あるいは薄くするか。 */
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	margin-top: 0;
	letter-spacing: 0.1em;
}

/* レスポンシブなどで念のため */
/* .reason-section .title-en.text-white,
.reason-section .title-ja.text-white {
	color: inherit !important;
} */

/* ユーザー追加のメインエリア（背景用） */
.reason-main-area {
	width: 100%;
	background-image: url('img/top/reason-background-image.png');
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	padding: 60px 0;
	/* 背景画像の余白確保 */
}

.reason-inner {
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
	padding: 0 40px;
	/* 横の余白のみ残す */
	background: none;
	/* 背景削除 */
}

.reason-content {
	position: relative;
	z-index: 2;
}

.reason-list {
	display: flex;
	flex-direction: column;
	gap: 40px;
	margin-bottom: 60px;
}

.reason-item {
	display: flex;
	align-items: stretch;
	/* 高さを揃える */
	justify-content: center;
	text-align: left;
	position: relative;
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
	/* overflow: hidden; アイコンがはみ出るように削除 */
	width: 90%;
	/* 全幅より少し狭くして左右の動きをつける */
	max-width: 900px;
	min-height: 270px;
}

/* 奇数番目は左寄せ */
.reason-item:nth-child(odd) {
	margin-right: auto;
	margin-left: 0;
}

/* 偶数番目は右寄せ（段々にする） */
.reason-item:nth-child(even) {
	margin-left: auto;
	margin-right: 0;
}

/* 画像エリア */
.reason-image {
	width: 40%;
	min-width: 300px;
	/* 極端に小さくならないように */
	flex-shrink: 0;
	/* 左側だけ角丸を適用 */
	border-radius: 20px 0 0 20px;
	overflow: hidden;
	position: relative;
	/* object-fit等で安定させるため */
	height: auto;
	/* flexで伸びる */
}

.reason-image img {
	width: 100%;
	height: 100%;
	/* 親に合わせて高さいっぱい */
	object-fit: cover;
	display: block;
}

/* テキストボックスエリア */
.reason-box {
	flex: 1;
	/* 残りの幅を埋める */
	width: auto;
	max-width: none;
	background: none;
	/* 親が白背景なので透明に */
	border-radius: 0;
	padding: 30px 40px;
	margin-left: 0;
	box-shadow: none;
	z-index: 2;
	position: relative;
	min-height: auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.reason-header {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
}

.reason-label {
	font-weight: bold;
	margin-right: 10px;
	font-size: 16px;
	color: #333;
}

.reason-number {
	height: 30px;
	/* SVG番号アイコンのサイズ調整 */
	width: auto;
}

.reason-title {
	font-size: 32px;
	font-weight: bold;
	color: #333;
	margin-top: 8px;
	margin-bottom: 8px;
	line-height: 1.4;
}

.reason-desc {
	font-size: 15px;
	line-height: 1.8;
	color: #444;
	margin-bottom: 0;
	/* アイコン配置のため余裕を持たせる場合は調整 */
}

/* テキストボックス右下のアイコン */
.reason-icon {
	position: absolute;
	bottom: -25px;
	right: -25px;
	width: 140px;
	/* アイコンサイズ調整 */
	height: auto;
}

/* 5番目のテキストボックス右下のアイコン(使い勝手がいい) */
.reason-icon.reason-icon-5 {
	position: absolute;
	bottom: -25px;
	right: -25px;
	width: 200px;
	/* アイコンサイズ調整 */
	height: auto;
}

.reason-section .reason-btn {
	background-color: #000;
	color: #fff;
	width: 100%;
	max-width: 320px;
	height: auto;
	padding: 15px 0;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
	font-weight: bold;
	font-size: 16px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.reason-section .reason-btn:hover {
	background-color: #333333;
	color: #fff;
}

.text-white {
	color: #fff !important;
}

/* レスポンシブ対応 */
@media screen and (max-width: 960px) {
	.reason-item {
		flex-direction: column;
		align-items: center;
		width: 100%;
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
	}

	.reason-item:nth-child(odd),
	.reason-item:nth-child(even) {
		margin-left: auto;
		margin-right: auto;
	}

	.reason-image {
		width: 100%;
		max-width: 100%;
		height: 250px;
		margin-bottom: 0;
		border-radius: 20px 20px 0 0;
		z-index: 1;
	}

	.reason-box {
		width: 100%;
		margin-left: 0;
		padding: 30px 40px 80px 40px;
		/* 左右の余白を増やし、見栄えを改善 */
		min-height: auto;
		margin-top: 0;
		border-radius: 0 0 20px 20px;
	}

	.reason-icon {
		width: 120px;
		bottom: 15px;
		right: 15px;
	}

	.reason-icon.reason-icon-5 {
		width: 160px;
		/* アイコン5はさらに大きく */
		bottom: 15px;
		right: 15px;
	}
}

/* --- function セクション --- */
.function-section {
	text-align: center;
	padding: 80px 20px 120px 20px;
	background-color: #fff;
	position: relative;
}

.function-inner {
	max-width: 1100px;
	margin: 0 auto;
}

.function-header {
	margin-bottom: 60px;
}

.function-header .title-ja {
	color: #00A968;
	font-size: 36px;
	margin-bottom: 10px;
	font-weight: bold;
}

.function-header .title-en {
	color: #333;
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	margin-top: 0;
	letter-spacing: 0.1em;
}

.function-sub-title {
	font-size: 20px;
	font-weight: bold;
	color: #333;
	margin-bottom: 50px;
	display: inline-block;
	border-bottom: 3px solid #00A968;
	padding-bottom: 10px;
}

/* よく使われている機能 (Cards) */
.function-main-area {
	margin-bottom: 80px;
}

.function-card-list {
	display: flex;
	justify-content: center;
	gap: 3%;
	flex-wrap: wrap;
}

.function-card {
	background-color: #eee;
	width: 31%;
	min-width: 280px;
	border-radius: 10px;
	padding: 40px 0px;
	box-sizing: border-box;
	text-align: center;
}

.function-card-icon {
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
}

.function-card-icon img {
	max-height: 100%;
	width: auto;
}

.function-card-title {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 15px;
	color: #333;
}

.function-card-desc {
	font-size: 13px;
	line-height: 1.8;
	color: #555;
	text-align: left;
	display: inline-block;
}

/* その他機能 (Grid) */
.function-other-area {
	margin-bottom: 60px;
}

.function-other-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px 20px;
	padding: 40px 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.function-other-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
}

.function-other-item img {
	height: 60px;
	width: auto;
}

.function-other-item p {
	font-size: 14px;
	font-weight: bold;
	color: #333;
	margin: 0;
}

.function-btn-area {
	margin-top: 40px;
}

.function-section .function-btn {
	background-color: #000;
	color: #fff;
	width: 100%;
	max-width: 320px;
	height: auto;
	padding: 15px 0;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
	font-weight: bold;
	font-size: 16px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.function-section .function-btn:hover {
	background-color: #333333;
	color: #fff;
}

/* レスポンシブ対応 */
@media screen and (max-width: 960px) {
	.function-card-list {
		flex-direction: column;
		align-items: center;
		gap: 30px;
	}

	.function-card {
		width: 100%;
		max-width: 400px;
	}

	.function-other-list {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* フロントページ用レスポンシブ - SP */
@media (max-width: 767px) {
	.hero {
		flex-direction: column-reverse;
		padding: 10px 20px 40px;
	}

	.hero-content {
		max-width: 100%;
		text-align: center;
	}

	.hero-title-area {
		margin-top: 15px;
		margin-bottom: 40px;
	}

	.hero-title-img.only-sp {
		margin-left: -15px;
		width: 450px;
		max-width: 100%;
	}

	.hero-buttons {
		width: 100%;
		flex-direction: column;
		align-items: center;
		margin-left: 0;
		gap: 10px;
	}

	.hero-buttons .hero-btn {
		width: 100%;
		max-width: 300px;
		min-width: unset;
	}

	.about-section {
		padding: 20px 20px 20px 20px;
	}

	.about-lead-text {
		font-size: 20px;
	}

	.about-lead-text .text-bold {
		font-size: 26px;
	}

	.about-lead-text .text-green-lg {
		font-size: 32px;
	}

	.reason-section {
		padding: 60px 0 80px 0;
	}

	.reason-inner {
		padding: 0 20px;
	}

	.reason-title {
		font-size: 22px;
	}

	.reason-box {
		padding: 25px 25px 130px 25px;
	}

	.reason-box .reason-desc {
		width: 100%
	}

	.reason-icon.reason-icon-6 {
		width: 105px;
	}

	.function-section {
		padding: 60px 20px 80px 20px;
	}

	.function-card-list {
		flex-direction: column;
		align-items: center;
		gap: 30px;
	}

	.function-card {
		width: 100%;
		max-width: 350px;
	}

	.function-other-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 25px 15px;
	}

	.price-header-area {
		padding: 60px 20px 0 20px;
	}

	.price-content-area {
		padding: 40px 20px 80px 20px;
	}

	.price-card-list {
		flex-direction: column;
		align-items: center;
		gap: 25px;
	}

	.price-card {
		width: 100%;
		max-width: 350px;
	}

	.price-amount-val {
		font-size: 40px;
	}

	.price-card-desc {
		min-height: auto;
	}

	.price-card-desc br {
		display: none;
	}
}

/* 学童プランの配色変更 (エメラルドグリーン) */
.price-card.price-card-gakudo {
	border-color: #00C0A3;
}

.price-card-gakudo .price-card-header {
	background-color: #00C0A3;
}

.price-card-gakudo .price-target-area {
	background-color: #3FE0C5;
}

.price-card-gakudo .feature-label {
	color: #00C0A3;
}

/* --- Price セクション --- */
.price-section {
	width: 100%;
}

.price-header-area {
	background-color: #fff;
	padding: 80px 20px 0px 20px;
	text-align: center;
}

.price-content-area {
	padding: 60px 20px 120px 20px;
	text-align: center;
	background-color: #fff;
	background-image: radial-gradient(#00A968 1px, transparent 1px);
	background-size: 20px 20px;
	position: relative;
}

.price-inner {
	max-width: 1000px;
	margin: 0 auto;
}

.price-header {
	margin-bottom: 20px;
}

.price-header .title-ja {
	color: #00A968;
	font-size: 36px;
	margin-bottom: 10px;
	font-weight: bold;
}

.price-header .title-en {
	color: #333;
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	margin-top: 0;
	letter-spacing: 0.1em;
}

.price-description {
	font-size: 16px;
	color: #333;
	font-weight: bold;
	margin-bottom: 60px;
	margin-top: 30px;
}

/* Price Cards */
.price-card-list {
	display: flex;
	justify-content: center;
	gap: 40px;
	margin-bottom: 60px;
}

.price-card {
	width: 48%;
	max-width: 460px;
	background: #fff;
	border: 2px solid #00A968;
	border-radius: 10px;
	overflow: hidden;
	/* 角丸を効かせるため */
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.price-card-header {
	background-color: #00A968;
	color: #fff;
	padding: 20px 0;
}

.price-plan-name {
	font-size: 24px;
	font-weight: bold;
	margin: 0 0 5px 0;
}

.price-plan-en {
	font-size: 16px;
	font-weight: bold;
	margin: 0;
	opacity: 0.9;
}

.price-target-area {
	margin-bottom: 30px;
	text-align: center;
}

/* Target Area (Light Green) */
.price-target-area {
	background-color: #3CC891;
	/* 少し明るい緑 */
	color: #fff;
	padding: 15px 10px;
	text-align: center;
}

.price-target-label {
	display: inline-block;
	font-size: 14px;
	font-weight: bold;
	color: #fff;
	border-bottom: 2px solid #fff;
	padding-bottom: 2px;
	margin-bottom: 8px;
}

.price-target-text {
	font-size: 18px;
	font-weight: bold;
	margin: 0;
	line-height: 1.4;
	min-height: 1.4em;
	/* 1行分確保、必要に応じて2行分(2.8em)にするが、現状1行で収まりそうなので最低限固定 */
	/* レスポンシブで折り返すとずれるので2行分確保が安全 */
	min-height: 2.8em;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Card Body */
.price-card-body {
	padding: 30px 22px;
	background-color: #fff;
	/* Expand to fill card */
	flex: 1;
	display: flex;
	flex-direction: column;
}

.price-amount-area {
	display: flex;
	align-items: baseline;
	justify-content: center;
	margin-bottom: 20px;
	color: #333;
}

.price-amount-label {
	font-size: 14px;
	font-weight: bold;
	margin-right: 5px;
}

.price-amount-val {
	font-size: 48px;
	font-weight: bold;
	line-height: 1;
	font-family: sans-serif;
	/* 数字を目立たせる */
}

.price-amount-unit {
	font-size: 14px;
	font-weight: bold;
	margin-left: 5px;
}

.price-card-desc {
	font-size: 14px;
	color: #333;
	text-align: left;
	line-height: 1.6;
	margin-bottom: 30px;
	min-height: 4.8em;
	/* 3行分確保して高さを揃える */
}

/* Features List */
.price-features-area {
	margin-top: auto;
	/* Push to bottom */
}

.price-features-row {
	display: flex;
	margin-bottom: 10px;
}

.price-feature-box {
	flex: 1;
	background-color: #E8F5EE;
	/* 薄い緑背景 */
	padding: 8px 0;
	text-align: center;
	margin: 0 5px;
	border-radius: 4px;
}

.price-feature-box:first-child {
	margin-left: 0;
}

.price-feature-box:last-child {
	margin-right: 0;
}

.feature-label {
	color: #00A968;
	font-weight: bold;
	font-size: 14px;
}

.price-features-list {
	display: flex;
	font-size: 14px;
	color: #333;
	font-weight: bold;
}

.feature-ul {
	list-style: none;
	padding: 0;
	margin: 0;
	flex: 1;
	padding-left: 10px;
}

.feature-ul li {
	margin-bottom: 5px;
	line-height: 1.4;
	text-align: left;
}

.feature-etc {
	text-align: right;
	padding-right: 15px;
	font-style: italic;
	margin-top: 5px;
}

/* Button */
.price-btn-area {
	margin-top: 20px;
}

.price-section .price-btn {
	background-color: #000;
	color: #fff;
	width: 100%;
	max-width: 320px;
	height: auto;
	padding: 15px 0;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
	font-weight: bold;
	font-size: 16px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.price-section .price-btn:hover {
	background-color: #333333;
	color: #fff;
}

/* Responsive */
@media screen and (max-width: 960px) {
	.price-card-list {
		flex-direction: column;
		align-items: center;
		gap: 30px;
	}

	.price-card {
		width: 100%;
		max-width: 500px;
	}

	.price-description {
		margin-bottom: 40px;
	}
}

/* 極小幅対応 (395px以下) */
@media (max-width: 395px) {
	.about-lead-text {
		font-size: 18px;
	}

	.about-lead-text .text-bold {
		font-size: 22px;
	}

	.about-lead-text .text-green-lg {
		font-size: 28px;
	}

	.badge-green {
		font-size: 14px;
	}
}