body {
	font-family: "Noto Sans JP", sans-serif;
	color: #1f2937;
	background-color: #ffffff;
	line-height: 1.6;
	display: flex; /* ← これ追加 */
	flex-direction: column; /* ← これ追加 */
	min-height: 100vh;
}

/* ===== Header ===== */
.navbar {
	background-color: #ffffff;
	border-bottom: 1px solid #e5e7eb;
}

.navbar-brand {
	display: flex;
	align-items: center;
}

.logo-img {
	height: 32px;
}

/* ===== トップページ（ポップLP） ===== */
/* サイゼントアカデミーのXアカウントに合わせた配色。黄色いひよこ×ブルー */
:root {
	--cas-navy: #0B2C6B;
	--cas-blue: #1F5AE0;
	--cas-blue-dark: #1743B0;
	--cas-sky: #EAF3FF;
	--cas-yellow: #FFC93C;
	--cas-yellow-dark: #EDA800;
}

.lp {
	overflow-x: hidden;
}

/* ----- Hero ----- */
.lp-hero {
	position: relative;
	padding: 3.5rem 1rem 5.5rem;
	background: radial-gradient(circle at 78% 22%, rgba(255, 201, 60, 0.35) 0,
		rgba(255, 201, 60, 0) 46%),
		radial-gradient(circle at 6% 8%, rgba(31, 90, 224, 0.14) 0,
		rgba(31, 90, 224, 0) 40%),
		linear-gradient(180deg, #E4F0FF 0%, #F5FAFF 58%, #ffffff 100%);
	overflow: hidden;
}

/* 背景に浮かぶポップな丸 */
.lp-hero::before, .lp-hero::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	z-index: 0;
}

.lp-hero::before {
	width: 170px;
	height: 170px;
	top: -55px;
	right: 6%;
	background: rgba(255, 201, 60, 0.45);
}

.lp-hero::after {
	width: 110px;
	height: 110px;
	bottom: 70px;
	left: 5%;
	background: rgba(66, 133, 247, 0.16);
}

.lp-hero__inner {
	position: relative;
	z-index: 2;
	max-width: 1040px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 2.5rem;
}

.lp-hero__text {
	flex: 1 1 380px;
	max-width: 600px;
	text-align: left;
}

.lp-badge {
	display: inline-block;
	background: var(--cas-yellow);
	color: var(--cas-navy);
	font-size: 0.85rem;
	font-weight: 700;
	padding: 0.35rem 1.1rem;
	border-radius: 999px;
	box-shadow: 0 3px 0 var(--cas-yellow-dark);
}

.lp-hero h1 {
	margin: 1.1rem 0 1rem;
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	font-weight: 800;
	line-height: 1.45;
	color: var(--cas-navy);
}

/* 黄色のマーカー風ハイライト */
.lp-mark {
	background: linear-gradient(transparent 62%, var(--cas-yellow) 62%);
	padding: 0 0.1em;
}

.lp-lead {
	color: #334155;
	font-size: 1rem;
	margin-bottom: 1.6rem;
}

.lp-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem;
}

.lp-cta--center {
	justify-content: center;
}

.lp-note {
	margin: 0.9rem 0 0;
	font-size: 0.85rem;
	color: #64748B;
}

/* ----- ポップな立体ボタン ----- */
.btn-pop {
	display: inline-block;
	padding: 0.85rem 2rem;
	border: none;
	border-radius: 999px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease, background-color
		0.15s ease;
}

.btn-pop:hover {
	text-decoration: none;
	transform: translateY(-2px);
}

.btn-pop:active {
	transform: translateY(3px);
}

.btn-pop-primary {
	background: var(--cas-yellow);
	color: var(--cas-navy);
	box-shadow: 0 5px 0 var(--cas-yellow-dark);
}

.btn-pop-primary:hover, .btn-pop-primary:focus {
	background: #FFD65E;
	color: var(--cas-navy);
	box-shadow: 0 7px 0 var(--cas-yellow-dark);
}

.btn-pop-primary:active {
	box-shadow: 0 2px 0 var(--cas-yellow-dark);
}

.btn-pop-ghost {
	background: #ffffff;
	color: var(--cas-blue);
	box-shadow: 0 5px 0 #C6D8F8;
}

.btn-pop-ghost:hover, .btn-pop-ghost:focus {
	background: #ffffff;
	color: var(--cas-blue-dark);
	box-shadow: 0 7px 0 #C6D8F8;
}

.btn-pop-ghost:active {
	box-shadow: 0 2px 0 #C6D8F8;
}

.btn-pop-white {
	background: #ffffff;
	color: var(--cas-blue);
	box-shadow: 0 5px 0 rgba(11, 44, 107, 0.35);
}

.btn-pop-white:hover, .btn-pop-white:focus {
	background: #ffffff;
	color: var(--cas-blue-dark);
	box-shadow: 0 7px 0 rgba(11, 44, 107, 0.35);
}

.btn-pop-white:active {
	box-shadow: 0 2px 0 rgba(11, 44, 107, 0.35);
}

/* ----- マスコット ----- */
.lp-hero__mascot {
	position: relative;
	flex: 0 0 auto;
	width: min(300px, 70vw);
}

.lp-mascot-img {
	display: block;
	width: 100%;
	height: auto;
	filter: drop-shadow(0 18px 22px rgba(31, 90, 224, 0.22));
	animation: lp-float 3.4s ease-in-out infinite;
}

@keyframes lp-float {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-12px);
	}
}

.lp-bubble {
	position: absolute;
	top: 4px;
	left: -14px;
	z-index: 2;
	background: #ffffff;
	color: var(--cas-navy);
	font-size: 0.88rem;
	font-weight: 700;
	white-space: nowrap;
	padding: 0.55rem 1rem;
	border: 2px solid var(--cas-navy);
	border-radius: 16px;
}

/* 吹き出しのしっぽ（枠線ぶんを2枚重ねで表現） */
.lp-bubble::before, .lp-bubble::after {
	content: "";
	position: absolute;
	left: 24px;
	width: 0;
	height: 0;
	border: 9px solid transparent;
}

.lp-bubble::before {
	bottom: -18px;
	border-top-color: var(--cas-navy);
}

.lp-bubble::after {
	bottom: -15px;
	border-top-color: #ffffff;
}

/* ----- 下端の波 ----- */
.lp-wave {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	z-index: 1;
	line-height: 0;
}

.lp-wave svg {
	display: block;
	width: 100%;
	height: 60px;
}

/* ----- セクション共通 ----- */
.lp-section {
	max-width: 1040px;
	margin: 0 auto;
	padding: 3.2rem 1rem;
	text-align: center;
}

.lp-section h2 {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	font-weight: 800;
	color: var(--cas-navy);
	margin-bottom: 0.5rem;
}

.lp-sub {
	color: #64748B;
	margin-bottom: 2rem;
}

.lp-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.2rem;
}

.lp-card, .lp-step {
	background: #ffffff;
	border: 2px solid #E4EDFB;
	border-radius: 20px;
	padding: 1.8rem 1.4rem;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.lp-card:hover, .lp-step:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(31, 90, 224, 0.12);
}

.lp-card h3, .lp-step h3 {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--cas-navy);
	margin-bottom: 0.5rem;
}

.lp-card p, .lp-step p {
	margin: 0;
	font-size: 0.93rem;
	color: #475569;
}

.lp-card__icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 1rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8rem;
	background: var(--cas-sky);
}

.lp-card:nth-child(2) .lp-card__icon {
	background: #FFF3D2;
}

.lp-card:nth-child(3) .lp-card__icon {
	background: #E6F7EC;
}

/* ----- 背景に色を敷くセクション ----- */
.lp-tint-wrap {
	background: var(--cas-sky);
}

/* ----- はじめかた ----- */

.lp-step__no {
	width: 46px;
	height: 46px;
	margin: 0 auto 0.9rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--cas-blue);
	color: #ffffff;
	font-size: 1.1rem;
	font-weight: 800;
}

/* ----- Kindle教材 ----- */
.lp-books-section .lp-sub {
	margin-bottom: 1rem;
}

.lp-books-section .lp-sub strong {
	color: var(--cas-navy);
	font-weight: 700;
	background: linear-gradient(transparent 62%, var(--cas-yellow) 62%);
	padding: 0 0.1em;
}

.lp-kindle-note {
	margin: 0 0 1.8rem;
}

/* 小さいけれど視線は拾える、黄色のピル */
.lp-kindle-badge {
	display: inline-block;
	background: var(--cas-yellow);
	color: var(--cas-navy);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	padding: 0.3rem 0.9rem;
	border-radius: 999px;
	box-shadow: 0 3px 0 var(--cas-yellow-dark);
}

.lp-kindle-badge::before {
	content: "📖 ";
}

.lp-books {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 1.2rem;
}

.lp-book {
	display: flex;
	flex-direction: column;
	align-items: center;
	background: #ffffff;
	border: 2px solid #E4EDFB;
	border-radius: 20px;
	padding: 1.8rem 1.4rem 1.5rem;
	text-decoration: none;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color
		0.18s ease;
}

.lp-book:hover {
	transform: translateY(-4px);
	border-color: var(--cas-yellow);
	box-shadow: 0 12px 24px rgba(31, 90, 224, 0.12);
	text-decoration: none;
}

.lp-book__no {
	display: inline-block;
	margin-bottom: 0.8rem;
	padding: 0.2rem 0.9rem;
	border-radius: 999px;
	background: var(--cas-sky);
	color: var(--cas-blue);
	font-size: 0.78rem;
	font-weight: 700;
}

.lp-book h3 {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--cas-navy);
	line-height: 1.5;
	margin-bottom: 0.7rem;
}

.lp-book p {
	flex: 1;
	margin: 0 0 1.2rem;
	font-size: 0.9rem;
	color: #475569;
}

.lp-book__link {
	display: inline-block;
	padding: 0.5rem 1.4rem;
	border-radius: 999px;
	background: var(--cas-blue);
	color: #ffffff;
	font-size: 0.88rem;
	font-weight: 700;
}

.lp-book__link::after {
	content: " →";
}

.lp-book:hover .lp-book__link {
	background: var(--cas-blue-dark);
}

/* ----- 最後のひと押し ----- */
.lp-final-wrap {
	padding: 3.5rem 1rem;
}

.lp-final {
	position: relative;
	overflow: hidden;
	max-width: 1040px;
	margin: 0 auto;
	padding: 2.8rem 1.5rem;
	border-radius: 28px;
	text-align: center;
	background: linear-gradient(135deg, var(--cas-blue) 0%, #4285F7 100%);
}

.lp-final::before {
	content: "";
	position: absolute;
	width: 220px;
	height: 220px;
	right: -70px;
	top: -80px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
}

.lp-final h2 {
	position: relative;
	z-index: 1;
	color: #ffffff;
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	font-weight: 800;
	margin-bottom: 0.6rem;
}

.lp-final p {
	position: relative;
	z-index: 1;
	color: #DCE8FF;
	margin-bottom: 1.6rem;
}

.lp-final .lp-cta {
	position: relative;
	z-index: 1;
}

@media ( max-width : 767px) {
	.lp-hero {
		padding-top: 2.5rem;
	}
	.lp-hero__text {
		text-align: center;
	}
	.lp-cta {
		justify-content: center;
	}
	.lp-hero__inner {
		flex-direction: column-reverse;
	}
}

@media ( prefers-reduced-motion : reduce) {
	.lp-mascot-img {
		animation: none;
	}
	.btn-pop:hover, .lp-card:hover, .lp-step:hover, .lp-book:hover {
		transform: none;
	}
}

.content {
	flex: 1;
}

/* ===== Footer ===== */
footer {
	background-color: #f9fafb;
	border-top: 0px solid #e5e7eb;
	padding: 1.5rem;
	text-align: center;
	font-size: 0.9rem;
}

footer a {
	color: #1f2937;
	text-decoration: none;
	margin: 0 10px;
}

footer a:hover {
	text-decoration: underline;
}

/* ログインボタン（アウトライン青） */
.btn-login {
	background-color: #ffffff;
	color: #2563EB;
	border: 1px solid #2563EB;
}

.btn-login:hover {
	background-color: #ffffff; /* ← 変えない */
	color: #1d4ed8; /* ← 濃い青にする */
	border: 1px solid #1d4ed8; /* ← 枠も濃い青に */
}

/* 新規登録ボタン / ログイン送信ボタン（青プライマリ・文字を白のまま固定） */
.btn-signup, .btn-login-submit {
	background-color: #2563EB;
	color: #ffffff;
	border: none;
}

.btn-signup:hover, .btn-login-submit:hover {
	background-color: #1d4ed8; /* ← 濃い青にする */
	color: #ffffff;
}

.btn-login, .btn-signup, .btn-login-submit {
	padding: 6px 34px;
	border-radius: 26px;
	font-weight: 500;
}

.btn-login:active, .btn-login:focus, .btn-login:focus-visible {
	background-color: #ffffff !important;
	color: #2563EB !important;
	border: 1px solid #2563EB !important;
	box-shadow: none !important;
}

.btn-signup:active, .btn-signup:focus, .btn-signup:focus-visible,
.btn-login-submit:active, .btn-login-submit:focus, .btn-login-submit:focus-visible {
	background-color: #1d4ed8 !important;
	color: #ffffff !important;
	box-shadow: none !important;
}

.btn:active, .btn:focus {
	box-shadow: none !important;
}

.link-academy {
	color: #1f2937; /* ← 他と同じ黒に統一（これ重要） */
	text-decoration: underline;
	transition: 0.2s;
}

/* ホバー最優先にする */
.link-academy:hover {
	color: #2563EB !important;
}

/* クリック・訪問後も黒に固定 */
.link-academy:visited, .link-academy:active, .link-academy:focus {
	color: #1f2937;
	text-decoration: none;
	outline: none;
}

/* ==================================================================================================== */
.login-wrapper {
	position: relative;
	min-height: calc(100vh - 163px); /* header+footer分調整 */
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

/* 背景画像
.login-wrapper::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("/images/contract-development_mv.png") center/cover
		no-repeat;
	filter: blur(4px);
	transform: scale(1.05);
	z-index: 0;
}

/* 暗いオーバーレイ
.login-wrapper::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1;
}
 */

/* カードを前面に */
.login-card {
	position: relative;
	z-index: 2;
}

/* ===== Login ===== */
.login-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 3rem 1rem;
}

.login-card {
	width: 100%;
	max-width: 450px;
	background: #ffffff;
	padding: 2rem;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
	text-align: left;
}

.login-title {
	text-align: center;
	margin-bottom: 1.5rem;
	font-weight: bold;
}

.login-links {
	text-align: center;
	font-size: 0.9rem;
}

.login-links a {
	color: #1f2937;
	text-decoration: none;
}

.login-links a:hover {
	color: #2563EB;
}

.form-control {
	border-radius: 8px;
}

.form-control:focus {
	box-shadow: none;
	border-color: #2563EB;
}

/* ==================================================================================================== */

/* カスタムアラート */
.alert {
	border: none;
	border-radius: 10px;
	padding: 0.8rem 1rem;
	font-size: 0.9rem;
}

/* 成功 */
.alert-success {
	background-color: #ecfdf5;
	color: #065f46;
}

/* エラー */
.alert-danger {
	background-color: #fef2f2;
	color: #7f1d1d;
}

/* ==================================================================================================== */
.terms {
	max-width: 800px;
	margin: 2rem auto;
	padding: 0 1rem;
}

.terms h1 {
	font-size: 1.8rem;
	margin-bottom: 1.5rem;
}

.terms h2 {
	margin-top: 1.5rem;
	font-size: 1.2rem;
	font-weight: bold;
}

.terms p {
	margin-top: 0.5rem;
}

.terms ul {
	margin-top: 0.5rem;
	padding-left: 1.2rem;
}