/**
 * FUTURE LAB デザイン言語ユーティリティ。
 *
 * トークン(色・字・余白)は theme.json が単一情報源。
 * ここには theme.json で表現できない「設計言語」だけを置く:
 *   - 事業カラーコーディング(--fl-area)
 *   - セクション構成要素(eyebrow / カード / バッジ / ステップ)
 *   - スクロールリビール
 *   - フォーカス・選択・アクセシビリティ
 */

:root {
	--fl-radius-sm: 8px;
	--fl-radius-md: 12px;
	--fl-radius-lg: 20px;
	--fl-shadow-card: 0 8px 30px rgba(27, 42, 91, 0.08);
	--fl-shadow-lift: 0 18px 44px rgba(27, 42, 91, 0.14);
	--fl-area: var(--wp--preset--color--navy);
	--fl-area-soft: var(--wp--preset--color--navy-soft);
}

/* ---- 事業カラーコーディング ----
   フリースクール=teal / 放課後=orange / アントレ=yellow / 金融・キャリア=green / 法人・協賛=navy */
.fl-area-teal   { --fl-area: var(--wp--preset--color--teal);   --fl-area-soft: var(--wp--preset--color--teal-soft); }
.fl-area-orange { --fl-area: var(--wp--preset--color--orange); --fl-area-soft: var(--wp--preset--color--orange-soft); }
.fl-area-yellow { --fl-area: #A87807; --fl-area-soft: var(--wp--preset--color--yellow-soft); }
.fl-area-green  { --fl-area: var(--wp--preset--color--green);  --fl-area-soft: var(--wp--preset--color--green-soft); }
.fl-area-navy   { --fl-area: var(--wp--preset--color--navy);   --fl-area-soft: var(--wp--preset--color--navy-soft); }

/* ---- セクション間の自動余白(blockGap)を無効化 ----
   セクション(alignfullの帯)は各自の縦paddingでリズムを管理するため、
   コンテナ既定の1.5remギャップは「謎の白い隙間」になる。3層とも0にする:
   1) ルート(ヘッダー/メイン/CTA帯/フッターの間)
   2) 各テンプレートの main 直下
   3) 固定ページ本文(entry-content)のルートグループ直下 */
.wp-site-blocks > * + *,
main.wp-block-group > * + *,
.entry-content > .wp-block-group > * + * {
	margin-block-start: 0;
}

/* ---- 日本語タイポグラフィ微調整 ---- */
h1, h2, h3, h4, h5, h6 {
	font-feature-settings: "palt";
	text-wrap: balance;
	word-break: auto-phrase; /* 対応ブラウザでは文節単位の自然な改行に(Chrome119+) */
}

p {
	overflow-wrap: anywhere;
}

::selection {
	background: #FFE9AE;
	color: var(--wp--preset--color--navy-deep);
}

/* ---- アクセシビリティ ---- */
:focus-visible {
	outline: 3px solid var(--wp--preset--color--yellow);
	outline-offset: 2px;
	border-radius: 4px;
}

.fl-skip-link {
	position: absolute;
	top: -100px;
	left: 1rem;
	z-index: 100;
	padding: 0.75rem 1.5rem;
	background: var(--wp--preset--color--navy);
	color: #fff;
	border-radius: 0 0 var(--fl-radius-md) var(--fl-radius-md);
	text-decoration: none;
	transition: top 0.2s ease;
}

.fl-skip-link:focus-visible {
	top: 0;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---- セクション構成要素 ---- */

/* 英字アイブロウ(セクションラベル) */
.fl-eyebrow {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--fl-area);
}

/* 日本語の屋号など: 大文字化なし・字間控えめ */
.fl-eyebrow.fl-eyebrow-ja {
	text-transform: none;
	letter-spacing: 0.08em;
}

/* Googleマップ埋め込み */
.fl-map {
	margin-top: var(--wp--preset--spacing--lg);
	border-radius: var(--fl-radius-lg);
	overflow: hidden;
	line-height: 0;
}

.fl-map iframe {
	width: 100%;
	height: 340px;
	border: 0;
}

.fl-eyebrow::before {
	content: "";
	display: inline-block;
	width: 1.5em;
	height: 2px;
	margin-right: 0.75em;
	vertical-align: 0.3em;
	background: currentColor;
	border-radius: 1px;
}

/* リード文 */
.fl-lead {
	color: var(--wp--preset--color--gray);
	line-height: 2.1;
}

/* 可読行長の上限: 本文段落は約50字で折り返す(横長画面での読みにくさ防止)。
   WP生成のコンテナ幅ルール(:where, 詳細度0,1,0)より強い詳細度で指定する */
main .wp-block-group > p,
main .wp-block-column > p,
main .entry-content > p {
	max-width: 50em;
}

main p.has-text-align-center {
	margin-left: auto;
	margin-right: auto;
}

/* ヒーローの段落(リード等)はやや狭め(44字)で品よく
   (ヒーロー幅オーバーライド 0,2,0 より強くする) */
.fl-hero-page.fl-hero-page > p:not(.fl-breadcrumb):not(.fl-hero-page-en),
.fl-hero-top .wp-block-column > p.fl-lead {
	max-width: 44em;
}

/* 短い表示文は文節単位で折り返す(Chrome119+の漸進的強化) */
.fl-lead,
.fl-cta-band p,
.wp-block-quote p,
.fl-pathway-item p {
	word-break: auto-phrase;
}

/* カード */
.fl-card {
	background: var(--wp--preset--color--base);
	border-radius: var(--fl-radius-lg);
	box-shadow: var(--fl-shadow-card);
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease;
}

.fl-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--fl-shadow-lift);
}

.fl-card-static {
	background: var(--wp--preset--color--base);
	border-radius: var(--fl-radius-lg);
	box-shadow: var(--fl-shadow-card);
}

/* カード上部の事業カラーラインは廃止(過剰な装飾のため)。
   .fl-card-topline は後方互換のため残すが装飾なし */

/* チップ(事業ラベル・カテゴリ) */
.fl-chip {
	display: inline-block;
	padding: 0.2em 1em;
	border-radius: 999px;
	background: var(--fl-area-soft);
	color: var(--fl-area);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.04em;
}

/* お知らせ種別バッジ */
a.fl-badge,
.fl-badge {
	text-decoration: none;
}

.fl-badge {
	display: inline-block;
	min-width: 7em;
	padding: 0.15em 1em;
	border-radius: 999px;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	text-align: center;
}

.fl-badge--news    { background: var(--wp--preset--color--navy-soft);   color: var(--wp--preset--color--navy); }
.fl-badge--event   { background: var(--wp--preset--color--yellow);      color: var(--wp--preset--color--navy-deep); }
.fl-badge--media   { background: var(--wp--preset--color--teal-soft);   color: var(--wp--preset--color--teal); }
.fl-badge--report  { background: var(--wp--preset--color--green-soft);  color: var(--wp--preset--color--green); }

/* ステップ番号(入会までの流れ) */
.fl-step {
	counter-increment: fl-step;
	position: relative;
}

.fl-step-number {
	display: grid;
	place-items: center;
	width: 3.5rem;
	height: 3.5rem;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--fl-area);
	color: #fff;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
	line-height: 1; /* 本文のline-height(1.9)継承による円内ズレを防ぐ */
}

/* 統計数字 */
.fl-stat-number {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: var(--wp--preset--font-size--display);
	line-height: 1.1;
	color: var(--fl-area);
	font-feature-settings: "tnum";
}

/* ---- スクロールリビール ----
   JS無効時にも必ず表示されるよう .fl-js 配下でのみ初期非表示にする */
.fl-js .fl-reveal {
	opacity: 0;
	translate: 0 28px;
	transition:
		opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
		translate 0.8s cubic-bezier(0.22, 1, 0.36, 1);
	transition-delay: var(--fl-reveal-delay, 0s);
}

.fl-js .fl-reveal.is-visible {
	opacity: 1;
	translate: 0 0;
}

/* ---- ヘッダー ----
   すりガラス効果は::beforeに置く。要素自身にbackdrop-filterを付けると
   position:fixedの子(モバイルナビのオーバーレイ)がヘッダー内に閉じ込められるため */
.fl-header {
	z-index: 60;
	background: transparent;
	transition: box-shadow 0.3s ease;
}

.fl-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
}

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

.fl-brand img {
	height: 50px;
	width: auto;
	display: block;
}

/* モバイル: ヘッダーCTAは表示したままコンパクトに(常時見える申込導線) */
@media (max-width: 781px) {
	.fl-brand img {
		height: 42px;
	}

	.fl-header .fl-header-cta .wp-block-button__link {
		padding: 0.5rem 1rem;
		font-size: var(--wp--preset--font-size--x-small);
	}
}

/* ごく小さい端末ではロゴと余白をさらに縮めて1行を死守 */
@media (max-width: 359px) {
	.fl-brand img {
		height: 36px;
	}

	.fl-header {
		padding-left: 0.75rem !important;
		padding-right: 0.75rem !important;
	}

	.fl-header .wp-block-group.is-nowrap {
		gap: 0.6rem;
	}
}

/* モバイル専用ヒーローイラスト(PCでは非表示) */
.fl-hero-illust-sp {
	display: none;
}

/* ナビが収まらない帯域(600〜1239px)はハンバーガーに切り替える(メニュー7項目) */
@media (min-width: 600px) and (max-width: 1239px) {
	.fl-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none;
	}

	.fl-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}
}

/* 1240px以上はナビを詰めて1行に収める */
@media (min-width: 1240px) {
	.fl-header .wp-block-navigation {
		font-size: 0.8125rem;
	}

	.fl-header .wp-block-navigation,
	.fl-header .wp-block-navigation .wp-block-navigation__container {
		gap: 0.8rem;
	}

	.fl-header .fl-nav-en {
		font-size: 0.53rem;
	}

	.fl-header .wp-block-button__link {
		padding: 0.55rem 1.1rem;
	}

	.fl-brand img {
		height: 34px;
	}

	.fl-header > .wp-block-group {
		gap: 1rem;
	}
}

.fl-header.is-scrolled {
	box-shadow: 0 2px 24px rgba(27, 42, 91, 0.1);
}

.fl-header .custom-logo {
	width: auto;
	height: 44px;
}

/* ヘッダー内CTAボタンはコンパクトに */
.fl-header .wp-block-button__link {
	padding: 0.625rem 1.5rem;
	font-size: var(--wp--preset--font-size--x-small);
}

/* ---- 日英2段ナビ ---- */
.fl-nav-jp {
	display: block;
	line-height: 1.4;
}

.fl-nav-en {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gray);
	line-height: 1.4;
}

/* モバイルオーバーレイ内 */
.wp-block-navigation__responsive-container.is-menu-open .fl-nav-en {
	color: rgba(255, 255, 255, 0.6);
}

/* ---- ヒーロー ---- */
.fl-hero-top {
	position: relative;
	overflow: hidden;
}

.fl-hero-catch {
	/* 10文字×2行(「自分で考え、挑戦し、」/「未来を切り拓く力を。」)が左カラムに収まる可変サイズ */
	font-size: clamp(2rem, 4vw, 3.25rem);
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: 0.04em;
}

/* 下層ページヒーロー(事業カラー帯)
   中央揃えの「扉」デザイン: 下に続くセクションの中央リズムと揃える */
.fl-hero-page {
	position: relative;
	text-align: center;
	background:
		radial-gradient(circle at 88% -20%, var(--fl-area-soft) 0%, transparent 52%),
		radial-gradient(circle at 10% 130%, var(--fl-area-soft) 0%, transparent 42%),
		linear-gradient(180deg, var(--wp--preset--color--navy-soft) 0%, var(--wp--preset--color--base) 100%);
}

/* 中央揃え時、幅制限された子ボックスも中央に置く */
.fl-hero-page > :where(p, h1, h2, .wp-block-group) {
	margin-left: auto;
	margin-right: auto;
}

.fl-hero-page > .wp-block-group.is-layout-flex {
	justify-content: center;
}

.fl-hero-page .fl-chip {
	margin-left: auto;
	margin-right: auto;
}

/* 装飾レイヤー(テーマが注入)。テキストは装飾より前面に */
.fl-hero-page > :where(:not(.fl-hero-deco)) {
	position: relative;
	z-index: 1;
}

.fl-hero-deco {
	position: absolute;
	inset: 0;
	pointer-events: none;
	overflow: hidden;
	z-index: 0;
	max-width: none !important;
}

.fl-hero-deco__left,
.fl-hero-deco__right {
	position: absolute;
	top: 50%;
	width: clamp(130px, 11vw, 190px);
	height: auto;
}

.fl-hero-deco__left {
	left: clamp(0.5rem, 2vw, 3.5rem);
	translate: 0 -46%;
}

.fl-hero-deco__right {
	right: clamp(0.5rem, 2vw, 3.5rem);
	translate: 0 -50%;
}

/* 文字と重なる帯域では装飾を出さない */
@media (max-width: 1279px) {
	.fl-hero-deco {
		display: none;
	}
}

/* PCの下層ヒーローは「扉」らしい高さを確保 */
@media (min-width: 1280px) {
	.fl-hero-page:not(.fl-hero-article) {
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 340px;
	}
}

/* 記事ページ(ブログ・お知らせ等)のヒーローは左揃え(全幅共通) */
.fl-hero-page.fl-hero-article {
	text-align: left;
}

.fl-hero-page.fl-hero-article > .wp-block-group.is-layout-flex {
	justify-content: flex-start;
}

/* ---- 下層ページのコンテンツレール統一 ----
   セクション内の既定コンテンツ幅を840pxに揃え、
   「840px(文章・表・FAQ)+1140px(alignwideのカード・画像)」の2レール構成にする。
   (TOPはテンプレート直組みのため対象外=従来通り) */
.entry-content > .wp-block-group > .wp-block-group.alignfull:not(.fl-hero-page) > :where(:not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright)) {
	max-width: 840px;
}

/* ヒーロー内のテキストは本文幅(720px)ではなくワイド幅まで使う。
   TOPヒーローとの広がりの差をなくすため(WP生成の max-width を上書き) */
.fl-hero-page.fl-hero-page > :where(:not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright)) {
	max-width: var(--wp--style--global--wide-size, 1140px);
}

/* 記事ページ(ブログ・お知らせ等)のヒーローは本文カラムと同じ800pxに揃える */
.fl-hero-article.fl-hero-article > :where(:not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright)) {
	max-width: 800px;
}

/* パンくず直後の要素の余白を詰める(コンテンツ内のインライン指定より優先) */
.fl-hero-page .fl-hero-page-en {
	margin-top: 0.75rem !important;
}

.fl-hero-page-en {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--fl-area);
}

/* ---- パンくず ---- */
.fl-breadcrumb {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--gray);
}

.fl-breadcrumb a {
	color: inherit;
	text-decoration: none;
}

.fl-breadcrumb a:hover {
	color: var(--wp--preset--color--teal);
	text-decoration: underline;
}

.fl-breadcrumb .sep {
	margin: 0 0.5em;
	opacity: 0.5;
}

/* ---- マーカー(蛍光ペン) ---- */
.fl-marker {
	background: linear-gradient(transparent 64%, rgba(245, 185, 38, 0.5) 64%);
	padding: 0 0.1em;
}

/* ---- 画像 ---- */
.fl-img-rounded img {
	border-radius: var(--fl-radius-lg);
}

/* ---- フッター ---- */
.fl-footer a {
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
}

.fl-footer a:hover {
	color: #fff;
	text-decoration: underline;
}

.fl-footer .fl-footer-heading {
	color: rgba(255, 255, 255, 0.55);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-family: var(--wp--preset--font-family--display);
}

.fl-footer-legal {
	color: rgba(255, 255, 255, 0.6);
	font-size: var(--wp--preset--font-size--x-small);
}

/* ---- お問い合わせフォーム(Contact Form 7) ---- */
/* PC: フォーム+右に注意事項(追従)。スマホは縦積み */
@media (min-width: 782px) {
	.wp-block-columns.fl-contact-layout > .fl-contact-aside {
		position: sticky;
		top: 6rem;
		align-self: flex-start;
	}
}

.fl-contact-notes {
	background: var(--fl-area-soft);
	border-radius: var(--fl-radius-lg);
	padding: 1.5rem 1.5rem 1.25rem;
}

.fl-contact-notes > h2 {
	margin: 0 0 1rem;
}

.fl-contact-notes li {
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.8;
}

.fl-contact-form {
	padding: 2rem 2.25rem 2.25rem;
	margin-top: var(--wp--preset--spacing--md);
}

.fl-form-row {
	margin-bottom: 1.35rem;
}

.fl-form-2col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.35rem 1.25rem;
}

.fl-contact-form label {
	display: block;
}

/* 項目名+必須/任意バッジ */
.fl-form-label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--navy);
}

.fl-req,
.fl-opt {
	display: inline-block;
	padding: 0.1em 0.6em;
	border-radius: 4px;
	font-size: 0.7rem;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.04em;
}

.fl-req {
	background: #E8503A;
	color: #FFFFFF;
}

.fl-opt {
	background: #EEF0F4;
	color: var(--wp--preset--color--gray);
}

.fl-contact-form .wpcf7-form-control-wrap {
	display: block;
}

.fl-contact-form input[type="text"],
.fl-contact-form input[type="email"],
.fl-contact-form input[type="tel"],
.fl-contact-form select,
.fl-contact-form textarea {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin-top: 0.45rem;
	padding: 0.8rem 1rem;
	border: 1.5px solid #D7DBE3;
	border-radius: var(--fl-radius-md);
	background-color: #FBFCFE;
	font-size: 16px; /* iOSズーム防止 */
	font-family: inherit;
	font-weight: 400;
	color: var(--wp--preset--color--ink);
	transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

/* セレクトの矢印をそろえる */
.fl-contact-form select {
	appearance: none;
	-webkit-appearance: none;
	padding-right: 2.75rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%231B2A5B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	cursor: pointer;
}

.fl-contact-form ::placeholder {
	color: #A3AAB8;
}

.fl-contact-form textarea {
	min-height: 9em;
	resize: vertical;
}

.fl-contact-form input:focus,
.fl-contact-form select:focus,
.fl-contact-form textarea:focus {
	outline: none;
	background-color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--teal);
	box-shadow: 0 0 0 3px rgba(15, 163, 168, 0.18);
}

/* 同意チェック */
.fl-form-consent {
	margin-top: 0.5rem;
	padding: 0.9rem 1rem;
	border-radius: var(--fl-radius-md);
	background: var(--wp--preset--color--navy-soft);
	font-size: var(--wp--preset--font-size--small);
}

.fl-form-consent .wpcf7-list-item {
	margin: 0;
}

.fl-form-consent label {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	cursor: pointer;
}

.fl-form-consent input[type="checkbox"] {
	width: 1.2rem;
	height: 1.2rem;
	accent-color: var(--wp--preset--color--teal);
	margin: 0;
}

.fl-form-submit {
	text-align: center;
	margin-top: 1.75rem;
}

.fl-form-submit .wpcf7-submit {
	min-width: 18rem;
	background: var(--wp--preset--color--yellow);
	color: var(--wp--preset--color--navy-deep);
	border: none;
	border-radius: 999px;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	letter-spacing: 0.06em;
	padding: 1rem 3.25rem;
	cursor: pointer;
	transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.fl-form-submit .wpcf7-submit:hover {
	background: #E3A714;
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(217, 154, 5, 0.35);
}

.fl-form-submit .wpcf7-submit:disabled {
	opacity: 0.6;
	cursor: wait;
}

/* 送信中スピナーがボタンの横にずれないよう重ねる */
.fl-form-submit .wpcf7-spinner {
	position: absolute;
	margin: 1.1rem 0 0 0.75rem;
}

.fl-contact-form .wpcf7-not-valid {
	border-color: #D55656;
	background-color: #FFF8F8;
}

.fl-contact-form .wpcf7-not-valid-tip {
	color: #C03B3B;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	margin-top: 0.35rem;
}

.fl-contact-form .wpcf7-response-output {
	border: none !important;
	border-radius: var(--fl-radius-md);
	padding: 1rem 1.25rem !important;
	margin: 1.5rem 0 0 !important;
	background: var(--wp--preset--color--navy-soft);
	font-weight: 600;
}

.fl-contact-form .wpcf7 form.invalid .wpcf7-response-output,
.fl-contact-form .wpcf7 form.failed .wpcf7-response-output {
	background: #FBEAEA;
	color: #A23030;
}

.fl-contact-form .wpcf7 form.sent .wpcf7-response-output {
	background: var(--wp--preset--color--green-soft);
	color: var(--wp--preset--color--green);
}

@media (max-width: 600px) {
	.fl-form-2col {
		grid-template-columns: 1fr;
	}

	.fl-contact-form {
		padding: 1.5rem 1.25rem 1.75rem;
	}

	.fl-form-submit .wpcf7-submit {
		width: 100%;
		min-width: 0;
	}
}

/* ---- 汎用 ---- */
.fl-divider-soft {
	border: none;
	border-top: 1px solid var(--wp--preset--color--gray-soft);
}

/* ---- カード内部 ---- */
.fl-card,
.wp-block-column.fl-card {
	overflow: hidden;
	padding: 0;
}

.fl-card-img {
	margin: 0;
}

.fl-card-img img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	display: block;
}

.fl-card-body {
	padding: 1.5rem 1.6rem 1.7rem;
}

/* カード画像の直後の自動余白(blockGap)を除去し、ボディのpaddingだけで揃える */
.fl-card-img + *,
.fl-post-card .wp-block-post-featured-image + * {
	margin-block-start: 0;
}

.fl-card-body > * + * {
	margin-top: 0.7rem;
}

.fl-card-link a {
	display: inline-block;
	padding: 0.45em 0.5em 0.45em 0;
	margin: -0.45em 0;
	color: var(--fl-area);
	font-weight: 700;
	text-decoration: none;
}

.fl-card-link a::after {
	content: "";
	display: inline-block;
	width: 0.5em;
	height: 0.5em;
	margin-left: 0.5em;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	rotate: 45deg;
	transition: translate 0.25s ease;
}

.fl-card-link a:hover::after {
	translate: 4px 0;
}

/* ---- PICK UP! バナー ---- */
.fl-pickup-label {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--yellow);
	margin: 0;
}

.fl-pickup-row {
	color: #fff;
}

.fl-pickup-row .wp-block-post-title {
	font-size: var(--wp--preset--font-size--medium);
	margin: 0;
}

.fl-pickup-row .wp-block-post-title a {
	color: #fff;
	text-decoration: none;
}

.fl-pickup-row .wp-block-post-title a:hover {
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--yellow);
}

/* ---- パスウェイ ---- */
.fl-pathway {
	position: relative;
	display: grid;
	gap: 1.4rem;
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
}

.fl-pathway::before {
	content: "";
	position: absolute;
	left: 1.75rem;
	top: 1.5rem;
	bottom: 1.5rem;
	width: 3px;
	border-radius: 2px;
	background: linear-gradient(
		180deg,
		var(--wp--preset--color--yellow),
		var(--wp--preset--color--teal),
		var(--wp--preset--color--orange),
		var(--wp--preset--color--navy),
		var(--wp--preset--color--green)
	);
	opacity: 0.35;
}

.fl-pathway-item {
	position: relative;
	background: var(--wp--preset--color--base);
	border-radius: var(--fl-radius-lg);
	box-shadow: var(--fl-shadow-card);
	padding: 1.4rem 1.6rem;
	gap: 1.25rem;
}

.fl-pathway-item .fl-step-number {
	flex-shrink: 0;
	margin: 0;
}

/* テキスト列は縮小可能に(モバイルでのはみ出し防止) */
.fl-pathway-item > .wp-block-group {
	min-width: 0;
	flex: 1 1 auto;
}

.fl-pathway-item h3 {
	margin: 0;
	overflow-wrap: anywhere;
}

.fl-pathway-item h3 a {
	color: var(--wp--preset--color--navy);
	text-decoration: none;
}

.fl-pathway-item h3 a:hover {
	color: var(--fl-area);
}

/* ---- ヒーローイラスト ---- */
.fl-hero-illustration {
	margin: 0;
}

.fl-hero-illustration img {
	width: 100%;
	height: auto;
}

/* ---- アクセス表 ---- */
.fl-access-table table {
	background: var(--wp--preset--color--base);
}

/* 写真を隣の列(文章・表)の高さにそろえる(PC)。高さの基準は隣の列、写真は枠に合わせてトリミング
   使い方: columns に fl-cols-photo-fill、写真の image ブロックに fl-photo-fill(TOPアクセス・トレードフェアなど) */
@media (min-width: 782px) {
	.wp-block-columns.fl-cols-photo-fill > .wp-block-column {
		align-self: stretch;
	}

	.fl-cols-photo-fill .fl-photo-fill {
		position: relative;
		height: 100%;
		min-height: 280px;
		margin: 0;
	}

	.fl-cols-photo-fill .fl-photo-fill img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.fl-cols-photo-fill .fl-access-table {
		margin: 0;
	}
}

/* 装飾なしリスト(フッター等) */
.is-style-fl-plain {
	list-style: none;
	padding-left: 0;
}

.is-style-fl-plain > li {
	margin-bottom: 0.55rem;
}

/* ===== スマホ最適化(〜781px) =====
   参考3サイトの375px実測値に基づく: 本文15-16px / h2=24px / セクション縦約60px /
   左右20px / 通知帯は縦積み中央 / 固定ボトムCTA(faincation方式) */
@media (max-width: 781px) {
	/* 縦リズム: セクション縦パディング約60px・左右20px */
	body {
		--wp--preset--spacing--2-xl: 3.75rem;
		--wp--preset--spacing--xl: 2.75rem;
		--wp--preset--spacing--lg: 2rem;
		--wp--preset--spacing--md: 1.25rem;
		/* タイポスケール(モバイル実寸): h2=24px / h3=20px 相当 */
		--wp--preset--font-size--display: 2.125rem;
		--wp--preset--font-size--huge: 1.75rem;
		--wp--preset--font-size--xx-large: 1.5rem;
		--wp--preset--font-size--x-large: 1.25rem;
		--wp--preset--font-size--large: 1.125rem;
	}

	/* 見出しの行間はモバイルでややゆったり */
	h2 {
		line-height: 1.5;
	}

	/* PCの整形用<br>を無効化し、自然な折り返しに任せる */
	.fl-lead br,
	.fl-cta-band h2 br {
		display: none;
	}

	/* ヒーローのタイポをモバイル尺に(大きすぎ防止) */
	.fl-hero-catch {
		font-size: clamp(1.75rem, 8.2vw, 2.125rem);
		line-height: 1.5;
		letter-spacing: 0.04em;
	}

	.fl-hero-top .fl-lead,
	.fl-hero-page .fl-lead {
		font-size: 0.9375rem;
		line-height: 2;
	}

	.fl-hero-page h1 {
		font-size: clamp(1.625rem, 7vw, 2rem);
	}

	/* モバイルはイラストをキャッチコピー直下に(さみしさ対策・ファーストビューに彩り) */
	.fl-hero-illust-sp {
		display: block;
		max-width: 340px;
		margin: 0.75rem auto 0;
	}

	.fl-hero-top .fl-hero-illustration {
		display: none;
	}

	/* PICK UP!帯: コンパクトな縦積みに */
	.fl-pickup-row {
		flex-direction: column;
		gap: 0.55rem;
	}

	.fl-pickup-row > * {
		margin: 0;
	}

	.fl-pickup-row .wp-block-post-title {
		font-size: 0.9375rem;
		line-height: 1.7;
		padding: 0 0.5rem;
	}

	.fl-pickup-label {
		font-size: 0.8125rem;
	}

	/* フッター: モバイルは中央揃え */
	.fl-footer {
		text-align: center;
	}

	.fl-footer-legal {
		justify-content: center;
		gap: 0.4rem;
	}

	/* TOPヒーロー: 中央揃え */
	.fl-hero-top {
		text-align: center;
	}

	.fl-hero-top .wp-block-group.is-layout-flex,
	.fl-hero-top .wp-block-buttons {
		justify-content: center;
	}

	/* 下層ページヒーロー: 中央揃え */
	.fl-hero-page {
		text-align: center;
	}

	.fl-hero-page .wp-block-group.is-layout-flex {
		justify-content: center;
	}

	.fl-hero-page .fl-chip {
		margin-left: auto;
		margin-right: auto;
	}

	/* PICK UP!帯: 中央揃え */
	.fl-pickup-row {
		justify-content: center;
		text-align: center;
	}

	/* 「fl-m-center」を付けたブロックはモバイルで中央揃え */
	.fl-m-center {
		text-align: center;
	}

	.fl-m-center .wp-block-buttons {
		justify-content: center;
	}
}

/* ===== モバイル固定ボトムCTAバー(〜640px) ===== */
.fl-sp-ctabar {
	display: none;
}

@media (max-width: 640px) {
	.fl-sp-ctabar {
		display: block;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 70;
		padding: 0.6rem 0.9rem calc(0.6rem + env(safe-area-inset-bottom));
		background: rgba(255, 255, 255, 0.94);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		box-shadow: 0 -4px 20px rgba(27, 42, 91, 0.14);
	}

	.fl-sp-ctabar a {
		display: block;
		text-align: center;
		background: var(--wp--preset--color--yellow);
		color: var(--wp--preset--color--navy-deep);
		font-weight: 700;
		font-size: 0.9375rem;
		letter-spacing: 0.05em;
		border-radius: 999px;
		padding: 0.85rem 1rem;
		text-decoration: none;
	}

	.fl-sp-ctabar a:active {
		background: #E3A714;
	}

	/* バーに隠れないよう最下部に余白を確保 */
	.wp-site-blocks {
		padding-bottom: calc(3.6rem + env(safe-area-inset-bottom));
	}

	/* ヘッダーCTAはボトムバーと重複するため非表示(640px以下のみ) */
	.fl-header .fl-header-cta {
		display: none;
	}
}

/* ---- 検索フォーム(404・検索ページ) ---- */
.wp-block-search__input {
	border: 1.5px solid #D7DBE3;
	border-radius: 999px;
	padding: 0.65rem 1.25rem;
	font-size: 16px;
	font-family: inherit;
}

.wp-block-search__input:focus {
	outline: none;
	border-color: var(--wp--preset--color--teal);
	box-shadow: 0 0 0 3px rgba(15, 163, 168, 0.18);
}

.wp-block-search__button {
	border-radius: 999px;
	padding: 0.65rem 1.6rem;
	font-weight: 700;
	border: none;
	cursor: pointer;
}

/* 代表メッセージ(FUTURE LABについて): 左=写真と名前、右=本文の手紙風レイアウト */
.fl-message {
	padding: clamp(1.25rem, 4.5vw, 3.5rem);
}

.fl-message-cols {
	margin: 0;
}

.fl-message-profile {
	text-align: center;
}

.fl-portrait {
	margin: 0 auto;
}

.fl-portrait img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center top;
	border-radius: var(--fl-radius-lg);
	display: block;
}

.fl-message-profile .fl-message-role {
	margin-top: 1.25rem;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--gray);
}

.fl-message-profile .fl-message-name {
	margin-top: 0.25rem;
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--navy);
	line-height: 1.4;
}

.fl-message-profile .fl-message-kana {
	margin-top: 0.1rem;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--gray);
}

.fl-message-body p {
	line-height: 2;
}

.fl-message-body p + p {
	margin-top: 1.25em;
}

@media (max-width: 781px) {
	.fl-message-profile .fl-portrait {
		max-width: 200px;
	}
}


/* ---- 2026-10 追加 ---- */

/* 3列カードの行: 枚数が減っても1枚の幅を3列ぶんに保ち中央に寄せる */
@media (min-width: 782px) {
	.wp-block-columns.fl-cols-thirds {
		justify-content: center;
	}

	.wp-block-columns.fl-cols-thirds > .wp-block-column {
		flex: 0 1 calc((100% - 2 * var(--wp--preset--spacing--md)) / 3);
	}
}

/* セクション見出し上の小見出し・キャッチ */
.fl-section-sub {
	margin-top: 0.5rem;
	font-weight: 700;
	color: var(--fl-area);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
}

.fl-subhead {
	font-size: var(--wp--preset--font-size--large);
	margin-top: var(--wp--preset--spacing--lg);
}

.fl-catch {
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 800;
	color: var(--wp--preset--color--navy);
	line-height: 1.5;
}

/* カード内の番号(①/01) */
.fl-card-body > .fl-card-num {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 1.5rem;
	line-height: 1;
	color: var(--fl-area);
	margin: 0;
}

/* GKAチラシ */
.fl-flyers .fl-flyer img {
	border-radius: var(--fl-radius-md);
	box-shadow: var(--fl-shadow-card);
	width: 100%;
	height: auto;
}

/* 学費表(4列) */
.fl-table-price td {
	text-align: right;
	white-space: nowrap;
}

.fl-table-price thead th {
	text-align: center;
}

.fl-table-price {
	overflow-x: auto;
}

/* 代表者メッセージの見出し・代表者プロフィール */
.fl-message-body .fl-message-catch {
	font-size: var(--wp--preset--font-size--x-large);
	color: var(--wp--preset--color--navy);
	line-height: 1.5;
	margin-bottom: 1.25rem;
}

.fl-profile {
	padding: clamp(1.25rem, 4vw, 2.5rem);
}

.fl-profile h4 {
	margin-top: 1.5rem;
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--navy);
}

/* 横長の帯写真 */
.fl-img-band img {
	width: 100%;
	height: auto;
	border-radius: var(--fl-radius-lg);
	display: block;
}

/* 対象年齢マップ: プログラム名が長いため、スマホでは名前を折り返して学年列を全部見せる */
.fl-table-map td,
.fl-table-map thead th:not(:first-child) {
	text-align: center;
}

@media (max-width: 600px) {
	.fl-table-map th,
	.fl-table-map td {
		padding: 0.65rem 0.3rem;
		font-size: 0.75rem;
	}
	.fl-table-map tbody th {
		white-space: normal;
		padding-left: 0.7rem;
	}
	.fl-table-map thead th:not(:first-child) {
		white-space: nowrap;
	}
}

/* 代表写真: 縦長なのでスマホで1カラムになったときに画面を占有しないよう上限を設ける */
@media (max-width: 781px) {
	.fl-portrait {
		max-width: 220px;
	}
}

/* ---- チャレンジギャラリー: 応援ボタン・応援メッセージ ---- */
.fl-cheer {
	margin-top: var(--wp--preset--spacing--lg);
	padding: var(--wp--preset--spacing--md);
	border-radius: var(--fl-radius-lg);
	background: var(--wp--preset--color--teal-soft);
	text-align: center;
}

.fl-cheer-button {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	padding: 0.9em 2.2em;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--orange);
	color: #fff;
	font: inherit;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--large);
	cursor: pointer;
	transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease, background-color 0.25s ease;
}

.fl-cheer-button:hover:not(:disabled) {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(233, 125, 42, 0.35);
}

.fl-cheer-icon::before {
	content: "♥";
}

.fl-cheer-button.is-cheered {
	background: #fff;
	color: var(--wp--preset--color--orange);
	box-shadow: inset 0 0 0 2px var(--wp--preset--color--orange);
	cursor: default;
}

.fl-cheer-button.is-cheered .fl-cheer-icon {
	animation: fl-cheer-pop 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes fl-cheer-pop {
	50% { transform: scale(1.6); }
}

.fl-cheer-count {
	margin-top: 0.7rem;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--navy);
}

.fl-cheer-num {
	font-size: 1.4em;
	font-weight: 700;
	margin-right: 0.15em;
}

/* 一覧カードの件数 */
.fl-cheer-stats {
	display: flex;
	gap: 1em;
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--gray);
}

.fl-cheer-stat-heart::before {
	content: "♥ 応援 ";
	color: var(--wp--preset--color--orange);
}

.fl-cheer-stat-comment::before {
	content: "コメント ";
}

/* 応援メッセージ(コメント) */
.fl-comments {
	margin-top: var(--wp--preset--spacing--lg);
}

.fl-comments .wp-block-comment-template {
	list-style: none;
	margin: var(--wp--preset--spacing--sm) 0 0;
	padding: 0;
}

.fl-comment {
	padding: 1rem 1.2rem;
	margin-bottom: 0.8rem;
	border-radius: var(--fl-radius-md);
	background: #fff;
	box-shadow: var(--fl-shadow-card);
}

.fl-comment .wp-block-comment-author-name {
	font-weight: 700;
	color: var(--wp--preset--color--navy);
}

.fl-comment .wp-block-comment-date {
	color: var(--wp--preset--color--gray);
}

.fl-comment .wp-block-comment-content p {
	margin: 0.4rem 0 0;
}

.fl-comments .comment-reply-title {
	margin-top: var(--wp--preset--spacing--md);
	font-size: var(--wp--preset--font-size--large);
}

.fl-comments .comment-notes,
.fl-comments .comment-form-cookies-consent {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--gray);
}

.fl-comments .comment-form label {
	display: block;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--small);
	margin-bottom: 0.3rem;
}

.fl-comments .comment-form-cookies-consent label {
	display: inline;
	font-weight: 400;
}

.fl-comments .comment-form input[type="text"],
.fl-comments .comment-form input[type="email"],
.fl-comments .comment-form textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 0.75rem 0.9rem;
	border: 1px solid #cfd5df;
	border-radius: var(--fl-radius-sm);
	background: #fff;
	font: inherit;
}

.fl-comments .comment-form input:focus,
.fl-comments .comment-form textarea:focus {
	outline: 2px solid var(--wp--preset--color--teal);
	outline-offset: 1px;
}

.fl-comments .form-submit .submit {
	padding: 0.85em 2em;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--navy);
	color: #fff;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.fl-comments .required {
	color: var(--wp--preset--color--orange);
	margin-left: 0.2em;
}

.fl-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.fl-comment-sent {
	padding: 1rem 1.2rem;
	border-radius: var(--fl-radius-md);
	background: var(--wp--preset--color--yellow-soft);
	color: var(--wp--preset--color--navy);
	font-weight: 700;
}

/* FUTURE LAB高等学院: 準備中バッジ・編集者向けの注記 */
.fl-chip-soon {
	margin-left: 0.4em;
	background: var(--wp--preset--color--yellow);
	color: var(--wp--preset--color--navy-deep);
}

.fl-admin-note {
	max-width: 1140px;
	margin: 0 auto;
	padding: 0.8rem 1.2rem;
	border: 2px dashed var(--wp--preset--color--orange);
	border-radius: var(--fl-radius-md);
	background: var(--wp--preset--color--orange-soft);
	color: var(--wp--preset--color--navy);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
}

/* CTA帯(無料体験・お問い合わせ)の左右にマロン(帯の上下中央)。左=元気な子、右=めがねの子。
   飾りなので疑似要素の背景画像で表示(860px未満では非表示) */
@media (min-width: 860px) {
	.fl-cta-band {
		position: relative;
		overflow: hidden;
		--fl-maron-h: 220px;
		--fl-maron-gap: 270px;
	}

	.fl-cta-band::before,
	.fl-cta-band::after {
		content: "";
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		height: var(--fl-maron-h);
		background: no-repeat center / contain;
		pointer-events: none;
	}

	.fl-cta-band::before {
		right: calc(50% + var(--fl-maron-gap));
		aspect-ratio: 372 / 560;
		background-image: url("../img/photos/maron-cta-cheer.webp");
	}

	.fl-cta-band::after {
		left: calc(50% + var(--fl-maron-gap));
		aspect-ratio: 346 / 560;
		background-image: url("../img/photos/maron-cta-glasses.webp");
	}
}

@media (min-width: 1100px) {
	.fl-cta-band {
		--fl-maron-h: 320px;
		--fl-maron-gap: 310px;
	}
}

/* 番号付きカード: 番号(①など)を見出しと同じ行に置く(番号だけで1行使わない)。
   「①使う」「Point ①」のような言葉付きの番号(fl-card-num-label)は見出しの上のまま */
.fl-card-body:has(> .fl-card-num:not(.fl-card-num-label)) {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: 0.45em;
	align-items: baseline;
}

.fl-card-body:has(> .fl-card-num:not(.fl-card-num-label)) > * {
	grid-column: 1 / -1;
}

.fl-card-body:has(> .fl-card-num:not(.fl-card-num-label)) > .fl-card-num {
	grid-column: 1;
}

.fl-card-body:has(> .fl-card-num:not(.fl-card-num-label)) > .fl-card-num + * {
	grid-column: 2;
	margin-top: 0;
}

/* ※注記のリスト: 2行目以降を※の後ろにそろえる(ぶら下げインデント) */
.fl-note-list {
	list-style: none;
	padding-left: 0;
	font-size: var(--wp--preset--font-size--small);
}

.fl-note-list li {
	padding-left: 1em;
	text-indent: -1em;
}

.fl-note-list li + li {
	margin-top: 0.3em;
}

/* 学費の補足カード(スクーリング・編入転入など) */
.fl-note-cards .fl-card-body {
	padding: 1.25rem 1.4rem 1.35rem;
}

.fl-note-cards .fl-card-body > h4 {
	margin: 0;
}

.fl-note-cards .fl-card-body > p {
	margin-top: 0.5em;
}

/* ---- 放課後スクール: 金融教育「100円で何を買う？」カード ---- */
.fl-scenario {
	padding: 1.75rem 1.9rem 1.8rem;
}

.fl-scenario > * {
	margin: 0;
}

.fl-scenario-lead {
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	color: var(--wp--preset--color--navy);
}

.fl-scenario-lead strong {
	white-space: nowrap;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.6em;
	color: var(--fl-area);
	margin: 0 0.1em;
}

.fl-scenario > .fl-scenario-q {
	margin-top: 0.35rem;
	font-size: var(--wp--preset--font-size--large);
	font-weight: 800;
	color: var(--wp--preset--color--navy);
}

.fl-scenario > .fl-choice-list {
	list-style: none;
	padding: 0;
	margin-top: 1.1rem;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.6rem;
}

.fl-choice-list li {
	word-break: keep-all;
	background: var(--fl-area-soft);
	border-radius: var(--fl-radius-md);
	padding: 0.85rem 0.6rem 0.9rem;
	text-align: center;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.55;
}

.fl-choice-list li strong {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.55rem;
	line-height: 1.2;
	color: var(--fl-area);
	margin-bottom: 0.2rem;
}

.fl-scenario > .fl-scenario-answer {
	margin-top: 1.1rem;
	font-size: var(--wp--preset--font-size--small);
}

.fl-scenario-answer strong {
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--navy);
}

/* 「自然に学んでいくこと」: 5項目を横並びのタグで */
.fl-pill-heading {
	word-break: auto-phrase;
	font-weight: 700;
	color: var(--wp--preset--color--navy);
}

.fl-pill-list {
	list-style: none;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.6rem 0.7rem;
	margin-top: 1rem;
}

.fl-pill-list li {
	position: relative;
	background: var(--wp--preset--color--base);
	border-radius: 999px;
	padding: 0.55rem 1.15rem 0.55rem 2.3rem;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--navy);
	box-shadow: var(--fl-shadow-card);
}

.fl-pill-list li::after {
	content: "";
	position: absolute;
	left: 1.05rem;
	top: 50%;
	width: 0.6rem;
	height: 0.34rem;
	border-left: 2.5px solid var(--fl-area);
	border-bottom: 2.5px solid var(--fl-area);
	rotate: -45deg;
	translate: 0 -70%;
}

@media (max-width: 781px) {
	.fl-scenario {
		padding: 1.4rem 1.25rem 1.5rem;
	}

	/* スマホでは選択肢を縦に並べ、金額を左に */
	.fl-scenario > .fl-choice-list {
		grid-template-columns: 1fr;
		gap: 0.5rem;
	}

	.fl-choice-list li {
		display: flex;
		align-items: baseline;
		gap: 0.75rem;
		text-align: left;
		padding: 0.7rem 1rem;
	}

	.fl-choice-list li strong {
		flex: 0 0 3.4em;
		font-size: 1.3rem;
		margin: 0;
	}

	.fl-choice-list li br {
		display: none;
	}
}

/* ---- 放課後スクール: ある日の過ごし方(タイムライン) ---- */
.fl-tl-step {
	position: relative;
	display: grid;
	grid-template-columns: 3.6rem minmax(0, 1fr);
	column-gap: 1.6rem;
	padding-bottom: 1.6rem;
}

.fl-tl-step > * {
	grid-column: 2;
	margin: 0;
}

.fl-tl-step > .fl-tl-time {
	grid-column: 1;
	grid-row: 1 / span 3;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 1.05rem;
	line-height: 1.7;
	color: var(--fl-area);
	text-align: right;
}

.fl-tl-step > .fl-tl-title {
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.7;
}

.fl-tl-step > .fl-tl-title + * {
	margin-top: 0.25rem;
}

.fl-tl-step > .fl-tl-note {
	margin-top: 0.35rem;
	color: var(--wp--preset--color--gray);
}

/* 時刻と本文のあいだに縦線+丸 */
.fl-tl-step::before {
	content: "";
	position: absolute;
	left: calc(3.6rem + 0.8rem - 5px);
	top: 0.62rem;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--fl-area);
	box-shadow: 0 0 0 4px var(--fl-area-soft);
}

.fl-tl-step::after {
	content: "";
	position: absolute;
	left: calc(3.6rem + 0.8rem - 1px);
	top: 1.4rem;
	bottom: -0.2rem;
	width: 2px;
	background: var(--fl-area-soft);
}

.fl-tl-step:last-child {
	padding-bottom: 0;
}

.fl-tl-step:last-child::after {
	display: none;
}

.fl-timeline + .fl-note-list {
	margin-top: var(--wp--preset--spacing--md);
}

/* 右のイラスト2枚: 同じ比率(3:2)にそろえる */
.fl-flow-photos img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

@media (min-width: 782px) {
	.wp-block-columns.fl-flow > .fl-flow-photos {
		position: sticky;
		top: 6rem;
		align-self: flex-start;
	}
}

@media (max-width: 781px) {
	.fl-flow-photos {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0.75rem;
	}

	.fl-flow-photos > * {
		margin: 0 !important;
	}
}

/* イラストを切らずに枠いっぱいに見せる: 上下の余りをイラストの壁色・床色で延長(駄菓子のイラスト用) */
@media (min-width: 782px) {
	.fl-cols-photo-fill .fl-photo-letterbox {
		background: linear-gradient(#EEF3FB 50%, #E3EAF6 50%);
		border-radius: var(--fl-radius-lg);
		overflow: hidden;
	}

	.fl-cols-photo-fill .fl-photo-letterbox img {
		object-fit: contain;
		border-radius: 0;
	}
}

/* カード見出し+ラベル(資格スクールの3スクールなど): 見出し左・ラベル右を同じ行に。
   カードが細くて1行に収まらないときは、全カードともラベルを見出しの上に置く */
.fl-card-body:has(> .fl-card-title-row) {
	container-type: inline-size;
}

.fl-card-title-row {
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-start;
	gap: 0.6rem;
}

.fl-card-title-row > * {
	margin: 0 !important;
}

.fl-card-title-row > .fl-chip {
	flex-shrink: 0;
	white-space: nowrap;
}

@container (min-width: 290px) {
	.fl-card-title-row {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		gap: 0.75rem;
	}
}

/* ---- 資格スクール ---- */
/* ヒーロー: 最初の1行をキャッチとして大きく */
.fl-hero-catchline {
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 800;
	color: var(--wp--preset--color--navy);
	line-height: 1.6;
	word-break: auto-phrase;
}

/* 学び方: 1枚のパネルを縦線で3分割(カードの連続を避ける) */
.fl-style-panel {
	background: var(--wp--preset--color--base);
	border-radius: var(--fl-radius-lg);
	box-shadow: var(--fl-shadow-card);
	padding: 2rem 0;
}

.fl-style-panel .wp-block-column {
	padding: 0.25rem 2rem;
}

.fl-style-panel .wp-block-column + .wp-block-column {
	border-left: 1px solid rgba(27, 42, 91, 0.1);
}

.fl-style-panel .wp-block-column > * {
	margin: 0;
}

.fl-style-panel .wp-block-column > * + * {
	margin-top: 0.6rem;
}

.fl-style-en {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--fl-area);
}

@media (max-width: 781px) {
	.fl-style-panel {
		padding: 0.5rem 0;
	}

	.fl-style-panel .wp-block-column {
		padding: 1.4rem 1.4rem;
	}

	.fl-style-panel .wp-block-column + .wp-block-column {
		border-left: 0;
		border-top: 1px solid rgba(27, 42, 91, 0.1);
	}
}

/* 3つの理由: 大きな数字+見出しの縦リスト */
.fl-reason {
	display: grid;
	grid-template-columns: 5.5rem minmax(0, 1fr);
	column-gap: 1.5rem;
	align-items: center;
	padding: 1.75rem 0;
	border-top: 1px solid rgba(27, 42, 91, 0.12);
}

.fl-reason:last-child {
	border-bottom: 1px solid rgba(27, 42, 91, 0.12);
}

.fl-reason > * {
	grid-column: 2;
	margin: 0;
}

.fl-reason > .fl-reason-num {
	grid-column: 1;
	grid-row: 1;
	align-self: center;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 3.25rem;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--fl-area);
}

.fl-reason > h3,
.fl-reason > h3.has-large-font-size {
	font-size: clamp(1.3rem, 2.1vw, 1.6rem) !important;
	word-break: auto-phrase;
}

.fl-reason > h3 + * {
	margin-top: 0.6rem;
	color: var(--wp--preset--color--gray);
}

.fl-tag-list {
	list-style: none;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.fl-tag-list li {
	padding: 0.25em 1em;
	border-radius: 999px;
	background: var(--wp--preset--color--base);
	color: var(--fl-area);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
}

@media (max-width: 781px) {
	.fl-reason {
		grid-template-columns: 3.4rem minmax(0, 1fr);
		column-gap: 1rem;
		padding: 1.4rem 0;
	}

	.fl-reason > .fl-reason-num {
		font-size: 2.25rem;
	}
}

/* こんな方におすすめ: リストは縦中央、イラストの上下余りは壁色・テーブル色で延長 */
.wp-block-columns.fl-cols-photo-fill > .fl-foryou-list {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

@media (min-width: 782px) {
	.fl-cols-photo-fill .fl-photo-letterbox.fl-letterbox-table {
		background: linear-gradient(#EEF3FB 50%, #E9C99A 50%);
	}
}

/* ---- 学校・教育機関の方へ: 対応実績・対応範囲 ---- */
/* 数字で見る対応範囲(白いパネルを縦線で4分割) */
.fl-stat-panel {
	background: var(--wp--preset--color--base);
	border-radius: var(--fl-radius-lg);
	box-shadow: var(--fl-shadow-card);
	padding: 1.75rem 0;
}

.fl-stat-panel .wp-block-column {
	padding: 0.25rem 1.25rem;
	text-align: center;
}

.fl-stat-panel .wp-block-column + .wp-block-column {
	border-left: 1px solid rgba(27, 42, 91, 0.1);
}

.fl-stat-panel .wp-block-column > * {
	margin: 0;
}

.fl-stat-value {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: clamp(1.35rem, 2.2vw, 1.85rem);
	line-height: 1.3;
	color: var(--wp--preset--color--navy);
	white-space: nowrap;
}

.fl-stat-value strong {
	font-size: 1.6em;
	color: var(--wp--preset--color--teal);
	margin-right: 0.05em;
}

.fl-stat-panel .wp-block-column > .fl-stat-label {
	margin-top: 0.45rem;
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--gray);
	word-break: auto-phrase;
}

/* 01〜03 のブロック番号 */
.fl-block-num {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 0.95rem;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--teal);
}

.fl-block-num + * {
	margin-top: 0.25rem !important;
}

.fl-coverage-card {
	padding: 2rem 2.25rem;
}

/* 代表写真は顔が切れないよう上寄せでトリミング */
.fl-cols-photo-fill .fl-photo-top img {
	object-position: 50% 18%;
}

/* 対応範囲: 2×2のタイル */
.fl-scope-grid {
	list-style: none;
	padding: 0;
	margin-top: 1.1rem;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.85rem;
}

.fl-scope-grid li {
	background: var(--wp--preset--color--navy-soft);
	border-radius: var(--fl-radius-md);
	padding: 1.1rem 1.25rem 1.2rem;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.8;
}

.fl-scope-grid li strong {
	display: block;
	margin-bottom: 0.3rem;
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--navy);
	line-height: 1.5;
}

.fl-scope-grid li br {
	display: none;
}

/* 03: リード文は紺の太字+マーカー。写真は看板が入るよう上寄せでトリミング */
.fl-coverage-card .fl-coverage-lead {
	font-weight: 700;
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--navy);
	word-break: auto-phrase;
}

.fl-cols-photo-fill .fl-photo-sign img {
	object-position: 50% 24%;
}

@media (max-width: 781px) {
	.fl-stat-panel {
		padding: 0.5rem 0;
	}

	.fl-stat-panel .wp-block-columns {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
	}

	.fl-stat-panel .wp-block-column {
		padding: 1rem 0.75rem;
	}

	.fl-stat-panel .wp-block-column + .wp-block-column {
		border-left: 0;
	}

	.fl-stat-panel .wp-block-column:nth-child(even) {
		border-left: 1px solid rgba(27, 42, 91, 0.1);
	}

	.fl-stat-panel .wp-block-column:nth-child(n+3) {
		border-top: 1px solid rgba(27, 42, 91, 0.1);
	}

	.fl-stat-value {
		font-size: 1.2rem;
		white-space: normal;
	}

	.fl-coverage-card {
		padding: 1.5rem 1.25rem;
	}

	/* 代表写真はスマホでは小さめの正方形に */
	.fl-coverage-card .fl-photo-top {
		max-width: 220px;
		margin: 0 auto;
	}

	.fl-coverage-card .fl-photo-top img {
		aspect-ratio: 1 / 1;
		object-fit: cover;
		object-position: 50% 15%;
	}

	.fl-scope-grid {
		grid-template-columns: 1fr;
	}

	/* スマホでは01と同じく写真を先に */
	.fl-coverage-card .wp-block-column:has(> .fl-photo-sign) {
		order: -1;
	}

	.fl-coverage-card .fl-photo-sign img {
		aspect-ratio: 16 / 10;
		object-fit: cover;
		object-position: 50% 24%;
	}
}

/* PICK UP!帯: お知らせが1件もないときは帯ごと隠す(空の紺帯が残らないように) */
.fl-pickup-band:not(:has(.fl-pickup-row)) {
	display: none;
}