@charset "UTF-8";

.introduce-page {
	background:#f6f8fb;
	padding-bottom:58px;
}

.introduce-hero {
	background:#ffffff;
	border-bottom:1px solid #e3e7ee;
	padding:42px 0 38px;
	text-align:center;
}

.introduce-kicker {
	color:#D66A00;
	font-size:1.4rem;
	font-weight:bold;
	letter-spacing:0;
	margin-bottom:10px;
}

.introduce-hero h1 {
	color:#142958;
	font-size:3.2rem;
	line-height:1.35;
	margin:0 0 14px;
}

.introduce-lead {
	max-width:780px;
	margin:0 auto;
	color:#3f4856;
	font-size:1.6rem;
	line-height:1.9;
}

.introduce-actions {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:18px;
	flex-wrap:wrap;
	margin-top:26px;
}

.introduce-bonus {
	display:inline-block;
	padding:10px 15px;
	background:#fff8ec;
	border:1px solid #f2d29b;
	border-radius:6px;
	color:#8a5500;
	font-size:1.4rem;
	font-weight:bold;
	line-height:1.4;
}

.introduce-wrap {
	padding:36px 0 0;
}

.introduce-section {
	margin-bottom:38px;
}

.introduce-summary {
	margin:0 0 24px;
	color:#3f4856;
	font-size:1.5rem;
	line-height:1.8;
}

.introduce-panel {
	background:#ffffff;
	border:1px solid #e1e6ee;
	border-radius:8px;
	padding:28px 32px;
	box-shadow:0 10px 28px rgba(20, 41, 88, 0.07);
}

.introduce-panel p {
	margin:0 0 14px;
	color:#3f4856;
	font-size:1.5rem;
	line-height:1.9;
}

.introduce-panel p:last-child {
	margin-bottom:0;
}

.introduce-plan-grid {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:24px;
	align-items:start;
}

.introduce-plan-card {
	background:#ffffff;
	border:1px solid #e1e6ee;
	border-radius:8px;
	padding:30px;
	box-shadow:0 10px 28px rgba(20, 41, 88, 0.07);
}

.introduce-plan-card p {
	color:#3f4856;
	font-size:1.5rem;
	line-height:1.8;
}

.introduce-plan-head {
	border-bottom:1px solid #edf1f6;
	padding-bottom:16px;
	margin-bottom:18px;
}

.introduce-plan-label {
	display:inline-block;
	margin-bottom:8px;
	color:#D66A00;
	font-size:1.3rem;
	font-weight:bold;
}

.introduce-plan-card h3 {
	margin:0;
	padding:0;
	border-bottom:none;
	color:#142958;
	font-size:2.2rem;
	line-height:1.35;
}

.introduce-point-list {
	margin:18px 0 24px;
	padding:0;
	list-style:none;
}

.introduce-point-list li {
	position:relative;
	padding:0 0 9px 1.4em;
	color:#263244;
	font-size:1.45rem;
	line-height:1.6;
}

.introduce-point-list li::before {
	content:"";
	position:absolute;
	left:0;
	top:0.65em;
	width:7px;
	height:7px;
	background:#D66A00;
	border-radius:50%;
}

.introduce-single-flow {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:22px;
	margin:24px 0;
}

.introduce-single-flow div {
	position:relative;
	padding:13px 8px;
	background:#f4f7fb;
	border:1px solid #dfe6ef;
	border-radius:6px;
	color:#142958;
	font-size:1.35rem;
	font-weight:bold;
	text-align:center;
	line-height:1.4;
}

.introduce-single-flow div:not(:last-child)::after {
	content:"→";
	position:absolute;
	top:50%;
	right:-17px;
	transform:translateY(-50%);
	color:#D66A00;
	font-size:1.6rem;
	font-weight:bold;
	line-height:1;
}

.introduce-note {
	margin:16px 0 0;
	color:#6b4a16;
	font-size:1.3rem;
	line-height:1.6;
}

.introduce-page table {
	margin-top:22px;
	margin-bottom:24px;
}

.introduce-page .submitbutton {
	margin-top:8px;
}

.introduce-page .price_ppv {
	margin-top:0;
}

@media screen and (max-width:599px) {
	.introduce-page {
		padding-bottom:34px;
	}

	.introduce-hero {
		padding:30px 16px 28px;
	}

	.introduce-hero h1 {
		font-size:2.4rem;
	}

	.introduce-lead {
		font-size:1.4rem;
		line-height:1.8;
	}

	.introduce-actions {
		display:block;
		margin-top:22px;
	}

	.introduce-actions .submitbutton,
	.introduce-page .submitbutton {
		width:100%;
		min-width:0;
		box-sizing:border-box;
	}

	.introduce-bonus {
		display:block;
		margin-top:12px;
	}

	.introduce-wrap {
		padding:22px 0 0;
	}

	.introduce-section {
		margin-bottom:26px;
	}

	.introduce-summary {
		margin:0 14px 18px;
		font-size:1.4rem;
	}

	.introduce-panel,
	.introduce-plan-card {
		margin:0 14px;
		padding:22px 18px;
	}

	.introduce-panel p,
	.introduce-plan-card p {
		font-size:1.4rem;
	}

	.introduce-plan-grid {
		display:block;
	}

	.introduce-plan-card + .introduce-plan-card {
		margin-top:18px;
	}

	.introduce-plan-card h3 {
		font-size:1.9rem;
	}

	.introduce-single-flow {
		grid-template-columns:1fr;
		gap:24px;
	}

	.introduce-single-flow div:not(:last-child)::after {
		content:"↓";
		top:auto;
		right:auto;
		bottom:-20px;
		left:50%;
		transform:translateX(-50%);
	}

	.introduce-page table {
		font-size:1.25rem;
	}
}
