@charset "UTF-8";
/* ===============================================
   SUMAiiタウン ショート版（/s/）
   common.css の後に読み込むこと
   ------------------------------------------------
   1. DESIGN TOKENS
   2. BUTTON
   3. ヘッダーバナー
   4. HERO
   5. MAKER
   6. FORM
   7. FIXED CTA
   8. FOOTER
================================================ */

/* ===============================================
   1. DESIGN TOKENS
================================================ */
:root {
	/* 中央フレーム。--u は「フレーム幅の1%」＝旧 1vw の置き換え単位 */
	--frame: 520px;
	--u: calc(min(100vw, 520px) / 100);

	--s-green:       #347448;
	--s-green-dark:  #235c37;
	--s-green-pale:  #eef4ea;
	--s-cream:       #f8fae5;
	--s-orange:      #f07c20;
	--s-orange-lt:   #f89340;
	--s-orange-dk:   #dd6a0c;
	--s-ink:         #1c2b21;
	--s-gray:        #6b7a70;
	--s-line:        #e0e6da;
	--s-red:         #d9483c;

	--s-r-sm: 10px;
	--s-r-md: 16px;
	--s-r-lg: 28px;

	--s-sh-sm:  0 2px 10px rgba(28, 43, 33, 0.06);
	--s-sh-md:  0 10px 30px rgba(28, 43, 33, 0.10);
	--s-sh-cta: 0 10px 24px rgba(240, 124, 32, 0.36);
}

/* ===============================================
   1-B. 中央フレーム
   PCでもSPレイアウトのまま 520px 幅で中央表示し、
   両サイドは背景色の余白にする
================================================ */
html, body { overflow-x: hidden; }

body.is-short {
	color: var(--s-ink);
	background: #d7d5d0;
}

.frame {
	position: relative;
	max-width: var(--frame);
	margin: 0 auto;
	background: var(--white);
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.22);
	min-height: 100vh;
	overflow: hidden;
}

/* 固定要素（追従CTA）もフレーム幅で中央に揃える */
.fixed-cta {
	left: 50%;
	right: auto;
	width: 100%;
	max-width: var(--frame);
	transform: translateX(-50%);
}
.fixed-cta.is-hide { transform: translateX(-50%) translateY(100%); }

/* 端末幅がフレームより狭いときは全幅（＝通常のスマホ表示） */
@media screen and (max-width: 540px) {
	.frame { box-shadow: none; min-height: 0; }
	body.is-short { background: var(--white); }
}

/* セクションを重ねて“持ち上げる”共通処理 */
.sec-lift {
	position: relative;
	z-index: 2;
	margin-top: calc(-6 * var(--u));
	border-radius: var(--s-r-lg) var(--s-r-lg) 0 0;
}


/* ===============================================
   2. BUTTON
================================================ */
.btn-form {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: linear-gradient(180deg, var(--s-orange-lt) 0%, var(--s-orange) 52%, var(--s-orange-dk) 100%);
	color: var(--white);
	font-weight: 800;
	text-align: center;
	line-height: 1.3;
	border-radius: 999px;
	letter-spacing: 0.02em;
	-webkit-transition: var(--transition);
	transition: var(--transition);
}
.btn-form:hover {
	opacity: 1;
	color: var(--white);
	filter: brightness(1.06);
	transform: translateY(-2px);
}

/* 右端の矢印 */
.btn-form--hero::after,
.btn-form--sec::after,
.btn-form--fixed::after {
	content: "";
	position: absolute;
	right: calc(5.5 * var(--u));
	top: 50%;
	width: calc(2.2 * var(--u));
	height: calc(2.2 * var(--u));
	margin-top: calc(-1.3 * var(--u));
	border-top: 2px solid rgba(255, 255, 255, 0.9);
	border-right: 2px solid rgba(255, 255, 255, 0.9);
	transform: rotate(45deg);
}

.btn-form--hero {
	width: calc(92 * var(--u));
	max-width: 620px;
	margin: 0 auto;
	padding: calc(4 * var(--u)) calc(8 * var(--u));
	box-shadow: var(--s-sh-cta);
	animation: cta-float 2.8s ease-in-out infinite;
}
.btn-form--hero .btn-form__main { font-size: calc(4.5 * var(--u)); }
.btn-form--hero .btn-form__sub,
.btn-form--sec .btn-form__sub {
	font-size: calc(3 * var(--u));
	font-weight: 500;
	opacity: 0.95;
	margin-top: calc(1 * var(--u));
}

.btn-form--sec {
	width: calc(92 * var(--u));
	max-width: 620px;
	margin: 0 auto;
	padding: calc(4 * var(--u)) calc(8 * var(--u));
	box-shadow: var(--s-sh-cta);
}
.btn-form--sec .btn-form__main { font-size: calc(4.3 * var(--u)); }

@keyframes cta-float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-4px); }
}
@media (prefers-reduced-motion: reduce) {
	.btn-form--hero { animation: none; }
	.maker-track { animation: none; }
}


/* ===============================================
   3-B. ヘッダーバナー（7A基準）
================================================ */
.headbanner {
	line-height: 0;
	background: #05200f;
}
.headbanner img {
	width: 100%;
	height: auto;
	display: block;
}

/* ヘッダー分の余白はバナーが持つのでヒーローは0に */
.hero { margin-top: 0; }


/* ===============================================
   4. HERO
================================================ */
/* キャッチを大きく見せる（common.css の max-width:340px を解除） */
.hero__txt {
	padding-top: calc(6 * var(--u));
	padding-bottom: calc(40 * var(--u));
	margin: 0 auto calc(8 * var(--u));
}
.hero__txt img {
	width: 100%;
	max-width: 100%;
}

/* Points をカード化（写真背景の上でも読める） */
.p-points__list {
	width: calc(92 * var(--u));
	max-width: 620px;
	gap: calc(2.4 * var(--u));
}
.p-points__item {
	background: rgba(255, 255, 255, 0.94);
	border: none;
	border-radius: var(--s-r-md);
	padding: calc(3.2 * var(--u)) calc(4 * var(--u));
	gap: calc(3 * var(--u));
	box-shadow: var(--s-sh-sm);
}
.p-points__item:last-child { border-bottom: none; }
.p-points__head { min-width: calc(11 * var(--u)); }
.p-points__label { color: var(--s-green); font-size: calc(2.4 * var(--u)); }
.p-points__num   { color: var(--s-green); font-size: calc(5.4 * var(--u)); }
.p-points__icon  { width: calc(10 * var(--u)); }
.p-points__text  { font-size: calc(3.5 * var(--u)); color: var(--s-ink); }

.hero__cta { margin-top: calc(5 * var(--u)); }


/* ===============================================
   5. MAKER
================================================ */
.maker {
	background: var(--s-cream);
	padding: calc(9.5 * var(--u)) 0 calc(9.5 * var(--u));
}
.maker.sec-lift { margin-top: calc(-6 * var(--u)); }

.maker__head { margin-bottom: calc(2.4 * var(--u)); }
.maker__ttl  { font-size: calc(3.7 * var(--u)); letter-spacing: 0.18em; margin-bottom: calc(1 * var(--u)); }
.maker__sub  { color: var(--s-ink); font-size: calc(7 * var(--u)); line-height: 1.25; }

.maker__lead {
	font-size: calc(3.2 * var(--u));
	line-height: 1.75;
	color: var(--s-gray);
	margin-bottom: calc(4.5 * var(--u));
	padding: 0 calc(4 * var(--u));
}
.marker {
	color: var(--s-ink);
	font-weight: 800;
	background: linear-gradient(transparent 62%, #ffec99 62%);
	padding-bottom: 0.1em;
}

/* マーキーの左右をフェードさせて“途切れ”を意図的に見せる */
.maker__logos {
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
	margin-bottom: calc(5 * var(--u));
}
.maker__logo-item {
	width: calc(29 * var(--u));
	margin: 0 calc(1.6 * var(--u));
	border: 1px solid rgba(52, 116, 72, 0.10);
	box-shadow: var(--s-sh-sm);
	overflow: hidden;
}

/* 7A基準カード（深緑×金・権威づけ） */
.crit7 {
	position: relative;
	margin: 0 calc(4 * var(--u)) calc(5.5 * var(--u));
	padding: calc(5.5 * var(--u)) calc(4.5 * var(--u)) calc(4.5 * var(--u));
	background:
		radial-gradient(120% 150% at 50% 0%, #1c6238 0%, #0d3a20 55%, #05200f 100%);
	border: 1px solid rgba(214, 178, 84, 0.55);
	border-radius: var(--s-r-md);
	box-shadow: 0 12px 30px rgba(5, 32, 15, 0.28);
	text-align: center;
	overflow: hidden;
}
.crit7::before {
	content: "";
	position: absolute;
	top: calc(1.6 * var(--u)); right: calc(1.6 * var(--u)); bottom: calc(1.6 * var(--u)); left: calc(1.6 * var(--u));
	border: 1px solid rgba(214, 178, 84, 0.28);
	border-radius: calc(var(--s-r-md) - 4px);
	pointer-events: none;
}
.crit7__head {
	position: relative;
	z-index: 1;
	margin-bottom: calc(2.2 * var(--u));
}
.crit7__badge {
	width: calc(14 * var(--u));
	max-width: 68px;
	height: auto;
	margin: 0 auto calc(1.6 * var(--u));
	filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.45));
}
.crit7__ttl {
	font-size: calc(4.2 * var(--u));
	font-weight: 800;
	color: #ffffff;
	letter-spacing: 0.04em;
	margin: 0;
}
.crit7__ttl strong {
	font-size: 1.3em;
	font-weight: 900;
	color: #e9cd72;
	background: linear-gradient(180deg, #fdf3bd 0%, #eacd72 42%, #c69a33 72%, #f3e2a4 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-right: 0.15em;
}
.crit7__lead {
	position: relative;
	z-index: 1;
	font-size: calc(3.1 * var(--u));
	line-height: 1.75;
	color: rgba(255, 255, 255, 0.86);
	margin: 0 0 calc(3.4 * var(--u));
}
.crit7__lead strong { color: #f0dc9a; font-weight: 800; }

.crit7__list {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: calc(1.6 * var(--u));
	padding: 0;
	margin: 0 0 calc(2.8 * var(--u));
}
.crit7__item {
	display: flex;
	align-items: center;
	font-size: calc(2.9 * var(--u));
	font-weight: 700;
	line-height: 1.35;
	white-space: nowrap;
	color: #f6efd8;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(214, 178, 84, 0.5);
	border-radius: 999px;
	padding: calc(1.4 * var(--u)) calc(2.6 * var(--u)) calc(1.4 * var(--u)) calc(2.2 * var(--u));
}
.crit7__item::before {
	content: "";
	width: calc(1.9 * var(--u));
	height: calc(1 * var(--u));
	margin-right: calc(1.6 * var(--u));
	border-left: 1.5px solid #e9cd72;
	border-bottom: 1.5px solid #e9cd72;
	transform: rotate(-45deg) translateY(calc(-0.3 * var(--u)));
	flex-shrink: 0;
}
.crit7__note {
	position: relative;
	z-index: 1;
	font-size: calc(2.5 * var(--u));
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.55);
	margin: 0;
}

/* 課題提起ボックス（吹き出し） */
.pain-box {
	position: relative;
	background: var(--white);
	border: 2px solid var(--s-green);
	border-radius: var(--s-r-md);
	padding: calc(3.8 * var(--u)) calc(4.5 * var(--u));
	margin: 0 calc(4 * var(--u)) calc(5.5 * var(--u));
	box-shadow: var(--s-sh-sm);
}
.pain-box::before,
.pain-box::after {
	content: "";
	position: absolute;
	left: 50%;
	border-style: solid;
}
.pain-box::before {
	bottom: calc(-4.4 * var(--u));
	margin-left: calc(-2.4 * var(--u));
	border-width: calc(4.4 * var(--u)) calc(2.4 * var(--u)) 0 calc(2.4 * var(--u));
	border-color: var(--s-green) transparent transparent transparent;
}
.pain-box::after {
	bottom: calc(-3.2 * var(--u));
	margin-left: calc(-1.8 * var(--u));
	border-width: calc(3.3 * var(--u)) calc(1.8 * var(--u)) 0 calc(1.8 * var(--u));
	border-color: var(--white) transparent transparent transparent;
}
.pain-box__txt {
	font-size: calc(3.4 * var(--u));
	font-weight: 700;
	line-height: 1.65;
	text-align: center;
	color: var(--s-ink);
	margin: 0;
}
.pain-box__txt em {
	font-style: normal;
	font-weight: 800;
	color: var(--s-red);
	font-size: 1.2em;
	letter-spacing: 0.02em;
}

.maker__cta { text-align: center; padding: 0 calc(4 * var(--u)); }

/* ===============================================
   6. FORM（コンパクト・ステップ式）
================================================ */
.formsec {
	background: linear-gradient(180deg, var(--s-green-pale) 0%, #f7faf5 55%, #ffffff 100%);
	padding: calc(11 * var(--u)) 0 calc(11 * var(--u));
}
.formsec.sec-lift { margin-top: calc(-6 * var(--u)); }

.formsec__inner { padding: 0 calc(3.5 * var(--u)); }
.formsec__head  { text-align: center; }
.formsec__ttl   { font-size: calc(4.2 * var(--u)); letter-spacing: 0.18em; margin-bottom: calc(1.4 * var(--u)); }
.formsec__sub {
	font-size: calc(6 * var(--u));
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: 0.01em;
	margin-bottom: calc(3 * var(--u));
}

.formsec__badges {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: calc(1.6 * var(--u));
	margin: 0 0 calc(3 * var(--u));
	padding: 0;
}
.formsec__badges li {
	background: var(--white);
	color: var(--s-green);
	border: 1.5px solid var(--s-green);
	border-radius: 999px;
	padding: calc(1 * var(--u)) calc(3 * var(--u));
	font-size: calc(2.8 * var(--u));
	font-weight: 700;
	line-height: 1.4;
}

.formsec__lead {
	font-size: calc(3.2 * var(--u));
	line-height: 1.8;
	color: var(--s-gray);
}

/* --- フォーム本体（mailform.css の上書き） --- */
.formsec form#mail_form {
	width: 100%;
	max-width: 720px;
	margin: calc(5 * var(--u)) auto 0;
	background: var(--white);
	border-radius: var(--s-r-md);
	box-shadow: var(--s-sh-md);
	padding: 0 0 calc(5 * var(--u));
	overflow: hidden;
}

/* ステップ進捗バー */
#mail_form .stepbar {
	display: flex;
	margin: 0;
	padding: calc(4 * var(--u)) calc(3 * var(--u)) calc(1 * var(--u));
	background: #f6f8f4;
	border-bottom: 1px solid var(--s-line);
	list-style: none;
}
#mail_form .stepbar__item {
	position: relative;
	flex: 1;
	text-align: center;
	font-size: calc(2.6 * var(--u));
	font-weight: 700;
	line-height: 1.4;
	color: #9aa79f;
	padding-bottom: calc(3 * var(--u));
}
#mail_form .stepbar__item::before {
	content: "";
	position: absolute;
	top: calc(3.3 * var(--u));
	left: -50%;
	width: 100%;
	height: 2px;
	background: var(--s-line);
	z-index: 0;
}
#mail_form .stepbar__item:first-child::before { display: none; }
#mail_form .stepbar__num {
	position: relative;
	z-index: 1;
	display: block;
	width: calc(6.8 * var(--u));
	height: calc(6.8 * var(--u));
	line-height: calc(6.8 * var(--u));
	margin: 0 auto calc(1.2 * var(--u));
	border-radius: 50%;
	background: var(--white);
	border: 2px solid var(--s-line);
	color: #9aa79f;
	font-size: calc(3.2 * var(--u));
	font-weight: 800;
	font-family: var(--en);
	transition: all 0.25s ease;
}
#mail_form .stepbar__item.is-done { color: var(--s-green); }
#mail_form .stepbar__item.is-done::before { background: var(--s-green); }
#mail_form .stepbar__item.is-done .stepbar__num {
	background: var(--s-green);
	border-color: var(--s-green);
	color: var(--white);
}
#mail_form .stepbar__item.is-current { color: var(--s-green); }
#mail_form .stepbar__item.is-current::before { background: var(--s-green); }
#mail_form .stepbar__item.is-current .stepbar__num {
	background: var(--s-green);
	border-color: var(--s-green);
	color: var(--white);
	box-shadow: 0 0 0 calc(0.8 * var(--u)) rgba(52, 116, 72, 0.16);
}

/* ステップ本体 */
.step { display: none; }
.step.is-active { display: block; }

.formsec form#mail_form dl {
	width: 100%;
	padding: 0 calc(4.5 * var(--u));
	border-bottom: 1px solid var(--s-line);
	flex-direction: column;
	align-items: stretch;
}
.step dl:last-of-type { border-bottom: none; }

.formsec form#mail_form dl dt {
	width: 100%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0;
	font-size: calc(3.5 * var(--u));
	font-weight: 700;
	color: var(--s-ink);
	padding: calc(3.6 * var(--u)) 0 calc(1.6 * var(--u));
}
.formsec form#mail_form dl dd {
	width: 100%;
	padding: 0 0 calc(3.6 * var(--u));
	font-size: calc(3.3 * var(--u));
}
.formsec form#mail_form dl dd small {
	font-size: calc(2.7 * var(--u));
	line-height: 1.6;
	display: block;
	margin-top: calc(1.2 * var(--u));
	color: var(--s-gray);
}

/* 必須／任意バッジ */
.formsec form#mail_form dl dt span.required,
.formsec form#mail_form dl dt span.optional {
	border: none;
	border-radius: 999px;
	padding: calc(0.7 * var(--u)) calc(2.2 * var(--u));
	font-size: calc(2.5 * var(--u));
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.5;
}
.formsec form#mail_form dl dt span.required { background: var(--s-red); }
.formsec form#mail_form dl dt span.optional { background: #97a49b; }

/* テキスト入力 */
.formsec form#mail_form input[type="text"],
.formsec form#mail_form input[type="email"],
.formsec form#mail_form input[type="tel"] {
	width: 100%;
	padding: calc(2.7 * var(--u)) calc(3.2 * var(--u));
	background: #f6f8f4;
	border: 1.5px solid var(--s-line);
	border-radius: var(--s-r-sm);
	font-size: calc(3.6 * var(--u));
	color: var(--s-ink);
	-webkit-appearance: none;
}
.formsec form#mail_form input::placeholder { color: #a9b4ac; }
.formsec form#mail_form input[type="text"]:focus,
.formsec form#mail_form input[type="email"]:focus,
.formsec form#mail_form input[type="tel"]:focus,
.formsec form#mail_form select:focus {
	background: var(--white);
	border-color: var(--s-green);
	box-shadow: 0 0 0 3px rgba(52, 116, 72, 0.16);
	outline: none;
}

/* セレクト */
.formsec form#mail_form select {
	width: 100%;
	padding: calc(2.7 * var(--u)) calc(9 * var(--u)) calc(2.7 * var(--u)) calc(3.2 * var(--u));
	background-color: #f6f8f4;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23347448' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right calc(3.6 * var(--u)) center;
	background-size: calc(3 * var(--u)) auto;
	border: 1.5px solid var(--s-line);
	border-radius: var(--s-r-sm);
	font-size: calc(3.6 * var(--u));
	color: var(--s-ink);
	-webkit-appearance: none;
	appearance: none;
}

/* ラジオ＝横並びの選択チップ */
.formsec form#mail_form ul {
	display: flex;
	flex-wrap: wrap;
	gap: calc(1.6 * var(--u));
}
.formsec form#mail_form ul li { flex: 0 1 auto; }
.formsec form#mail_form ul li label {
	display: flex;
	align-items: center;
	font-size: calc(3.3 * var(--u));
	font-weight: 700;
	line-height: 1.3;
	color: var(--s-ink);
	padding: calc(2.4 * var(--u)) calc(3 * var(--u));
	margin-top: 0;
	border: 1.5px solid var(--s-line);
	border-radius: var(--s-r-sm);
	background: var(--white);
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.formsec form#mail_form ul li label:hover {
	background: #f6f8f4;
	border-color: #c3d2c6;
}
.formsec form#mail_form ul li label:has(input:checked) {
	border-color: var(--s-green);
	background: #eff6f0;
	box-shadow: 0 0 0 3px rgba(52, 116, 72, 0.14);
}
.formsec form#mail_form ul li input[type="radio"] {
	width: calc(4 * var(--u));
	height: calc(4 * var(--u));
	margin: 0 calc(2 * var(--u)) 0 0;
	flex-shrink: 0;
	accent-color: var(--s-green);
}

/* 未入力ハイライト（ステップ送りのバリデーション） */
.formsec form#mail_form dd.is-error input[type="text"],
.formsec form#mail_form dd.is-error input[type="email"],
.formsec form#mail_form dd.is-error input[type="tel"],
.formsec form#mail_form dd.is-error select {
	border-color: var(--s-red);
	background: #fff5f4;
}
.formsec form#mail_form dd.is-error ul li label {
	border-color: var(--s-red);
}

/* エラー表示 */
.formsec form#mail_form dl dd span.error_blank,
.formsec form#mail_form dl dd span.error_format,
.formsec form#mail_form dl dd span.error_match {
	color: var(--s-red);
	font-size: calc(2.9 * var(--u));
	font-weight: 700;
	margin-top: calc(1.4 * var(--u));
}

/* ステップ操作 */
#mail_form .step__nav {
	display: flex;
	gap: calc(2.5 * var(--u));
	padding: calc(4.5 * var(--u)) calc(4.5 * var(--u)) 0;
}
#mail_form .step__msg {
	display: none;
	margin: calc(3.5 * var(--u)) calc(4.5 * var(--u)) 0;
	padding: calc(2.4 * var(--u)) calc(3 * var(--u));
	background: #fff5f4;
	border: 1.5px solid var(--s-red);
	border-radius: var(--s-r-sm);
	color: var(--s-red);
	font-size: calc(2.9 * var(--u));
	font-weight: 700;
	line-height: 1.6;
	text-align: center;
}
#mail_form .step__msg.is-show { display: block; }

#mail_form .step__btn {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	height: calc(13.5 * var(--u));
	max-height: 66px;
	border: none;
	border-radius: 999px;
	font-size: calc(3.9 * var(--u));
	font-weight: 800;
	letter-spacing: 0.04em;
	cursor: pointer;
	font-family: inherit;
	transition: var(--transition);
}
#mail_form .step__btn--next {
	background: linear-gradient(180deg, var(--s-orange-lt) 0%, var(--s-orange) 52%, var(--s-orange-dk) 100%);
	color: var(--white);
	box-shadow: var(--s-sh-cta);
}
#mail_form .step__btn--next:hover { filter: brightness(1.06); transform: translateY(-2px); }
#mail_form .step__btn--prev {
	flex: 0 0 auto;
	min-width: calc(26 * var(--u));
	background: var(--white);
	border: 1.5px solid var(--s-line);
	color: var(--s-gray);
	box-shadow: none;
	font-size: calc(3.4 * var(--u));
}
#mail_form .step__btn--prev:hover { background: #f6f8f4; color: var(--s-ink); }

/* 規約 */
.formsec #agreement {
	width: 100%;
	font-size: calc(2.9 * var(--u));
	padding: 0 calc(4.5 * var(--u));
	margin-top: calc(4 * var(--u));
	border-top: none;
}
.formsec #agreement a { display: inline; color: var(--s-green); }
.formsec #agreement h3 {
	font-size: calc(3.2 * var(--u));
	font-weight: 700;
	color: var(--s-ink);
	margin-bottom: calc(1.6 * var(--u));
}
.formsec #agreement > div {
	height: calc(24 * var(--u));
	max-height: 130px;
	margin: 0 0 calc(2.6 * var(--u));
	padding: calc(3.2 * var(--u));
	background: #f6f8f4;
	border: 1.5px solid var(--s-line);
	border-radius: var(--s-r-sm);
	font-size: calc(2.8 * var(--u));
	line-height: 1.8;
	color: var(--s-gray);
}
.formsec #agreement > div p + p { margin-top: 0.8em; }
.formsec #agreement #agree_check {
	font-size: calc(2.9 * var(--u));
	line-height: 1.55;
	color: var(--s-ink);
	font-weight: 600;
}
.formsec #agreement #agree_check label {
	display: flex;
	align-items: flex-start;
	cursor: pointer;
}
.formsec #agreement input[type="checkbox"] {
	width: calc(3.8 * var(--u));
	height: calc(3.8 * var(--u));
	margin: calc(0.4 * var(--u)) calc(2.2 * var(--u)) 0 0;
	flex-shrink: 0;
	accent-color: var(--s-green);
}
.formsec #agreement span.error_check {
	display: none;
	color: var(--s-red);
	font-size: calc(2.9 * var(--u));
	margin-top: calc(1.2 * var(--u));
}

/* 送信 */
.formsec form#mail_form p#form_submit {
	width: 100%;
	padding: calc(4.5 * var(--u)) calc(4.5 * var(--u)) 0;
	margin: 0;
}
.formsec form#mail_form input[type="button"] {
	width: 100%;
	max-width: 100%;
	height: calc(14.5 * var(--u));
	max-height: 70px;
	background: linear-gradient(180deg, var(--s-orange-lt) 0%, var(--s-orange) 52%, var(--s-orange-dk) 100%);
	border: none;
	border-radius: 999px;
	box-shadow: var(--s-sh-cta);
	font-size: calc(4.1 * var(--u));
	font-weight: 800;
	letter-spacing: 0.05em;
	color: var(--white);
	align-items: center;
	transition: var(--transition);
}
.formsec form#mail_form input[type="button"]:hover {
	opacity: 1;
	filter: brightness(1.06);
	transform: translateY(-2px);
	box-shadow: var(--s-sh-cta);
}
#mail_form .form-note {
	font-size: calc(2.7 * var(--u));
	line-height: 1.7;
	text-align: center;
	color: var(--s-gray);
	margin: calc(2.6 * var(--u)) calc(4.5 * var(--u)) 0;
}


/* ===============================================
   7. FIXED CTA（SP）
================================================ */
.fixed-cta {
	position: fixed;
	left: 50%;
	right: auto;
	bottom: 0;
	width: 100%;
	max-width: var(--frame);
	transform: translateX(-50%);
	z-index: 900;
	padding: calc(2.6 * var(--u)) calc(4 * var(--u)) calc(calc(2.6 * var(--u)) + env(safe-area-inset-bottom));
	background: rgba(255, 255, 255, 0.94);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	box-shadow: 0 -2px 16px rgba(28, 43, 33, 0.14);
	-webkit-transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
	transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}
.fixed-cta.is-hide {
	opacity: 0;
	visibility: hidden;
	transform: translateX(-50%) translateY(100%);
	pointer-events: none;
}
.btn-form--fixed {
	font-size: calc(4.1 * var(--u));
	padding: calc(3.4 * var(--u)) calc(8 * var(--u));
	max-width: 560px;
	margin: 0 auto;
}
body.is-short { padding-bottom: calc(19 * var(--u)); }


/* ===============================================
   8. FOOTER
================================================ */
.footer.sec-lift {
	margin-top: calc(-6 * var(--u));
	background: var(--s-ink);
}
.footer__main { padding-top: calc(13 * var(--u)); }