@charset "UTF-8";
/**
 * 株式会社イエリテ アパート管理LP 専用スタイル（v1.8.0）
 *
 * 【このファイルの決まり】
 *   1. すべての指定を `.lp-apartment-management` の配下に書きます。
 *      body へこのクラスが付くのはアパート管理LPとサンクスページだけです
 *      （inc/setup.php）。
 *   2. assets/css/lp.css は変更しません。このファイルは lp.css のあとに
 *      読み込まれ、必要な箇所だけを上書きします。
 *   3. `body` `h1` `p` `a` などへ単独で指定しないでください。
 *   4. CSS変数も `:root` ではなく `.lp-apartment-management` の中に定義します。
 *
 *   この決まりを守っているかぎり、このLPの調整が
 *   売却査定LP・戸建て賃貸LP・法的ページへ影響することはありません。
 *
 * 【読み込み】
 *   inc/apartment.php（ハンドル名 ierite-lp-apartment）
 *
 * 【ブレークポイント】
 *   lp.css と同じ 768px / 900px / 1024px を使用します。
 *
 * @package Ierite_LP
 */

/* =====================================================================
 * 1. カラー設定
 *
 * 依頼書4の色を、既存LPの変数へ割り当てています。
 * 変数を上書きすることで、共通部品（見出し・カード・フォーム・
 * 固定CTA・フッター）がこのLPの色で表示されます。
 *
 * 【CTAのオレンジについて】
 *   依頼書に「既存CTAのオレンジがある場合はその色を優先する」とあるため、
 *   既存の --ierite-lp-cta（#b45309）をそのまま使用します。
 *   参考デザインの明るいオレンジ（#ee7625）は、白文字とのコントラストが
 *   約2.9:1で、テーマの基準（4.5:1以上）を満たさないためです。
 * ===================================================================== */

.lp-apartment-management {
	/* 依頼書4の指定色 */
	--apartment-navy: #0c315a;
	--apartment-deep: #082544;
	--apartment-bluegreen: #184e4a;
	--apartment-cream: #fbf7f0;
	--apartment-pale-blue: #eef6fb;

	/* 既存の共通変数を、このLPの色へ差し替えます */
	--ierite-lp-brand: #0c315a;
	--ierite-lp-brand-dark: #082544;
	--ierite-lp-brand-tint: #eef6fb;
	--ierite-lp-brand-line: #cfe0ee;
	--ierite-lp-tint-2: #dce9f4;

	--ierite-lp-deep: #082544;
	--ierite-lp-deep-2: #0c315a;

	--ierite-lp-text: #1c2b3a;
	--ierite-lp-text-muted: #5f6b76;
	--ierite-lp-bg-soft: #fbf7f0;
	--ierite-lp-beige-line: #ece3d5;

	--ierite-lp-shadow: 0 2px 10px rgba(12, 49, 90, 0.08);
}


/* =====================================================================
 * 2. ヘッダー
 *
 * ロゴ下のサービス名と、PCのページ内メニューを追加します。
 * HTMLは header-lp.php の分岐で出力しています。
 * ===================================================================== */

.lp-apartment-management .ierite-lp__header-logo {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
	min-width: 0;
}

.lp-apartment-management .ierite-lp__apt-header-sub {
	color: rgba(255, 255, 255, 0.82);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 0.02em;
	white-space: nowrap;
}

/* ロゴ未設定時の社名。折り返すと2行になって高さが変わるため、1行に保ちます */
.lp-apartment-management .ierite-lp__header-logo-text {
	white-space: nowrap;
}

/* ヘッダーのCTAも1行に保ちます */
.lp-apartment-management a.ierite-lp__cta-button--small {
	white-space: nowrap;
}

/*
 * ヘッダーの電話番号は、このLPでは表示しません。
 *
 * 7項目のページ内メニューと同じ行に置くと、
 * 1440px でもロゴ・メニュー・CTAが折り返して2行になるためです。
 * 電話の導線は、ファーストビュー・最終CTA・画面下部の固定CTA・
 * フッターの4か所に用意しています。
 */
.lp-apartment-management .ierite-lp__header-tel {
	display: none;
}

/*
 * ページ内メニュー。
 *
 * スマートフォンでは表示しません（依頼書・仲村の指示）。
 * ハンバーガーメニューは作らず、ロゴと画面下部の固定CTAを優先します。
 */
.lp-apartment-management .ierite-lp__apt-nav {
	display: none;
}

.lp-apartment-management .ierite-lp__apt-nav-list {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: 0 16px;
}

.lp-apartment-management a.ierite-lp__apt-nav-link,
.lp-apartment-management .ierite-lp__apt-nav-link {
	color: rgba(255, 255, 255, 0.92);
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
}

.lp-apartment-management .ierite-lp__apt-nav-link:hover,
.lp-apartment-management .ierite-lp__apt-nav-link:focus {
	color: #ffffff;
	text-decoration: underline;
}


/* =====================================================================
 * 3. ファーストビュー
 *
 * 背景に建物の写真を敷き、その上へ濃紺のオーバーレイを重ねます。
 * 文字の読みやすさを優先し、文章側は濃いめに覆っています。
 * 写真はイメージ写真です（実際の管理物件ではありません）。
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-hero {
	padding-bottom: 46px;
}

/*
 * 背景写真。
 *
 * ::before（濃紺のベタ面）のあとに描画されるため、
 * この要素自身にオーバーレイのグラデーションを重ねています。
 * スマートフォンでは、文字の下に濃い部分がくるよう縦方向で覆います。
 */
.lp-apartment-management .ierite-lp__apt-hero-photo {
	position: absolute;
	inset: 0;
	border-radius: 0 0 50% 50% / 0 0 40px 40px;
	background-image:
		linear-gradient(180deg, rgba(8, 37, 68, 0.94) 0%, rgba(8, 37, 68, 0.9) 52%, rgba(8, 37, 68, 0.72) 100%),
		url("../images/apartment/apartment-exterior.webp");
	background-position: center 30%;
	background-size: cover;
	background-repeat: no-repeat;
	pointer-events: none;
}

.lp-apartment-management .ierite-lp__hero-decor-glow {
	background: radial-gradient(circle, rgba(150, 205, 235, 0.18) 0%, rgba(150, 205, 235, 0) 68%);
}

/* リード文（H1の下） */
.lp-apartment-management .ierite-lp__apt-hero-lead {
	margin: 0 0 14px;
	color: var(--ierite-lp-hero-ink-soft);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.6;
}

/* サービス名。FVとフォームで共通の見た目にします */
.lp-apartment-management .ierite-lp__apt-service {
	display: inline-block;
	margin: 0 0 14px;
	padding: 7px 16px;
	border: 1px solid var(--ierite-lp-hero-line);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	color: #ffffff;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.01em;
}

.lp-apartment-management .ierite-lp__apt-service-mark {
	color: var(--ierite-lp-hero-mark);
	font-size: 1.14em;
}

/*
 * 安心材料の3項目。
 *
 * 既存LPは「1枚の面を線で区切る」形ですが、このLPは参考デザインに合わせ、
 * 白い独立したカードを並べます。
 * 既存の指定（1枚の面・区切り線）を打ち消すため、
 * display から明示的に指定し直しています。
 */
.lp-apartment-management .ierite-lp__hero-points {
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
	padding: 0;
	border: none;
	border-radius: 0;
	background: none;
}

.lp-apartment-management .ierite-lp__hero-points > :nth-child(3) {
	grid-column: auto;
}

.lp-apartment-management .ierite-lp__hero-point {
	gap: 8px;
	min-height: 44px;
	padding: 9px 14px;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.95);
	color: var(--apartment-navy);
	font-size: 13.5px;
	font-weight: 700;
}

.lp-apartment-management .ierite-lp__hero-point-icon {
	color: var(--apartment-navy);
}

/* CTA（フォーム＋電話の2つ） */
.lp-apartment-management .ierite-lp__apt-cta-row {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
}

.lp-apartment-management a.ierite-lp__cta-button--hero {
	width: 100%;
}

/*
 * 電話のボタン。
 * CTA（オレンジ）より弱く、白い枠線のボタンにします。
 * 電話番号が未設定のあいだは span になるため、
 * リンクでない場合も同じ見た目になるよう両方へ指定しています。
 */
.lp-apartment-management .ierite-lp__apt-tel-button,
.lp-apartment-management a.ierite-lp__apt-tel-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 420px;
	min-height: 56px;
	padding: 12px 22px;
	border: 2px solid rgba(255, 255, 255, 0.72);
	border-radius: var(--ierite-lp-radius-button);
	background: rgba(255, 255, 255, 0.08);
	color: #ffffff;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
}

.lp-apartment-management a.ierite-lp__apt-tel-button:hover,
.lp-apartment-management a.ierite-lp__apt-tel-button:focus {
	background: rgba(255, 255, 255, 0.18);
	color: #ffffff;
	text-decoration: none;
}

.lp-apartment-management .ierite-lp__apt-cta-note {
	color: var(--ierite-lp-hero-ink-weak);
	text-align: left;
}


/* =====================================================================
 * 4. セクションの背景と共通パーツ
 * ===================================================================== */

/*
 * ページ内リンクの着地位置。
 *
 * ヘッダーが固定（sticky）のため、そのままだと見出しが隠れます。
 * ヘッダーの高さぶんだけ手前で止めます。
 * ヘッダーのメニュー・CTA・フッターのリンクすべてに効きます。
 */
.lp-apartment-management .ierite-lp__top-anchor {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
	scroll-margin-top: calc(var(--ierite-lp-header-height) + 8px);
}

.lp-apartment-management .ierite-lp__section {
	scroll-margin-top: calc(var(--ierite-lp-header-height) + 8px);
}

/* キーボード操作でセクションへ移動したとき、二重の枠線を出しません */
.lp-apartment-management .ierite-lp__section:focus {
	outline: none;
}

.lp-apartment-management .ierite-lp__apt-section--cream {
	background: var(--apartment-cream);
}

.lp-apartment-management .ierite-lp__apt-section--pale {
	background: var(--apartment-pale-blue);
}

/* 見出しの色（共通部品の上書き） */
.lp-apartment-management .ierite-lp__heading {
	color: var(--apartment-navy);
}

.lp-apartment-management .ierite-lp__sec-number,
.lp-apartment-management .ierite-lp__sec-en {
	color: var(--ierite-lp-text-muted);
}

/* 本文のまとまり */
.lp-apartment-management .ierite-lp__apt-text p {
	margin: 0 0 1em;
	color: var(--ierite-lp-text);
	font-size: 15.5px;
	line-height: 1.9;
}

.lp-apartment-management .ierite-lp__apt-text p:last-child {
	margin-bottom: 0;
}

/* 締めの一文 */
.lp-apartment-management .ierite-lp__apt-closing {
	margin: 28px 0 0;
	color: var(--ierite-lp-text);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.9;
	text-align: center;
}

/* 補足（注意書き） */
.lp-apartment-management .ierite-lp__apt-note {
	margin-top: 24px;
	text-align: center;
}

/* チェックの丸（濃紺） */
.lp-apartment-management .ierite-lp__apt-check {
	position: relative;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	margin-top: 2px;
	border-radius: 50%;
	background: var(--apartment-navy);
}

.lp-apartment-management .ierite-lp__apt-check::after {
	position: absolute;
	top: 6px;
	left: 6px;
	width: 9px;
	height: 5px;
	border-left: 2px solid #ffffff;
	border-bottom: 2px solid #ffffff;
	transform: rotate(-45deg);
	content: "";
}

/* 引用のような呼びかけ（04） */
.lp-apartment-management .ierite-lp__apt-quote {
	margin: 0 0 20px;
	padding: 14px 18px;
	border-left: 4px solid var(--ierite-lp-brand-line);
	background: var(--apartment-pale-blue);
}

.lp-apartment-management .ierite-lp__apt-quote p {
	margin: 0 0 4px;
	color: var(--apartment-navy);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.7;
}

.lp-apartment-management .ierite-lp__apt-quote p:last-child {
	margin-bottom: 0;
}

/* 小見出し */
.lp-apartment-management .ierite-lp__apt-block-heading {
	margin: 0 0 18px;
	color: var(--apartment-navy);
	font-size: 17px;
	font-weight: 700;
	text-align: center;
}


/* =====================================================================
 * 5. 写真
 *
 * 【イメージ写真の注記について】
 *   生成した建物・相談風景の写真が、実際の管理物件や
 *   実際のお客様の事例と誤解されないようにするための表示です。
 *   小さくても必ず読める濃さにしています。削除しないでください。
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-figure {
	position: relative;
	margin: 24px 0 0;
}

.lp-apartment-management .ierite-lp__apt-figure-image {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: var(--ierite-lp-radius-image);
	object-fit: cover;
	box-shadow: var(--ierite-lp-shadow);
}

.lp-apartment-management .ierite-lp__apt-figure--review .ierite-lp__apt-figure-image,
.lp-apartment-management .ierite-lp__apt-figure--wide .ierite-lp__apt-figure-image {
	aspect-ratio: 4 / 3;
}

.lp-apartment-management .ierite-lp__apt-figure--inline .ierite-lp__apt-figure-image {
	aspect-ratio: 16 / 9;
}

.lp-apartment-management .ierite-lp__apt-figure-caption {
	display: flex;
	justify-content: flex-end;
	margin-top: 6px;
}

.lp-apartment-management .ierite-lp__apt-figure-note {
	color: var(--ierite-lp-text-muted);
	font-size: 12px;
	letter-spacing: 0.02em;
}


/* =====================================================================
 * 6. 02 こんな違和感はありませんか？
 *
 * スマートフォンは1列、PCは3列×2段です。
 * 強い赤色や警告表現は使いません。
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-concern-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

.lp-apartment-management .ierite-lp__apt-concern-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 18px;
	border: 1px solid var(--ierite-lp-beige-line);
	border-radius: var(--ierite-lp-radius-card);
	background: #ffffff;
	box-shadow: var(--ierite-lp-shadow);
}

.lp-apartment-management .ierite-lp__apt-concern-text {
	color: var(--ierite-lp-text);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.7;
}


/* =====================================================================
 * 7. カード（03・06・07）
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-card-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin-top: 24px;
}

.lp-apartment-management .ierite-lp__apt-card {
	padding: 20px 18px;
	border: 1px solid var(--ierite-lp-brand-line);
	border-radius: var(--ierite-lp-radius-card);
	background: #ffffff;
	box-shadow: var(--ierite-lp-shadow);
}

.lp-apartment-management .ierite-lp__apt-card--center {
	text-align: center;
}

.lp-apartment-management .ierite-lp__apt-card-icon {
	display: inline-flex;
	margin-bottom: 10px;
	color: var(--apartment-navy);
}

.lp-apartment-management .ierite-lp__apt-card-icon--round {
	align-items: center;
	justify-content: center;
	width: 62px;
	height: 62px;
	border-radius: 50%;
	background: var(--apartment-pale-blue);
}

.lp-apartment-management .ierite-lp__apt-card-title {
	margin: 0 0 8px;
	color: var(--apartment-navy);
	font-size: 17px;
	font-weight: 700;
}

.lp-apartment-management .ierite-lp__apt-card-text {
	margin: 0;
	color: var(--ierite-lp-text);
	font-size: 14.5px;
	line-height: 1.8;
}


/* =====================================================================
 * 8. 2カラムのまとまり（03・04・05・06）
 *
 * スマートフォンでは縦に積みます。
 * 読み上げ順を変えないよう、並べ替えはPCの指定だけで行います。
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-split,
.lp-apartment-management .ierite-lp__apt-review {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
}

.lp-apartment-management .ierite-lp__apt-split-side {
	min-width: 0;
}


/* =====================================================================
 * 9. 04 管理会社変更サポートの5ステップ
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-step-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	padding: 20px 16px;
	border: 1px solid var(--ierite-lp-brand-line);
	border-radius: var(--ierite-lp-radius-card);
	background: #ffffff;
}

.lp-apartment-management .ierite-lp__apt-step {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-areas:
		"icon number"
		"icon title"
		"icon text";
	align-items: center;
	gap: 0 14px;
	padding: 12px 4px;
	border-bottom: 1px dashed var(--ierite-lp-brand-line);
}

.lp-apartment-management .ierite-lp__apt-step:last-child {
	border-bottom: none;
}

.lp-apartment-management .ierite-lp__apt-step-icon {
	grid-area: icon;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--apartment-pale-blue);
	color: var(--apartment-navy);
}

.lp-apartment-management .ierite-lp__apt-step-number {
	grid-area: number;
	color: var(--ierite-lp-text-muted);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
}

.lp-apartment-management .ierite-lp__apt-step-title {
	grid-area: title;
	margin: 0;
	color: var(--apartment-navy);
	font-size: 15.5px;
	font-weight: 700;
	line-height: 1.5;
}

.lp-apartment-management .ierite-lp__apt-step-text {
	grid-area: text;
	margin: 2px 0 0;
	color: var(--ierite-lp-text-muted);
	font-size: 13.5px;
	line-height: 1.7;
}


/* =====================================================================
 * 10. 05 自主管理の3項目
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-pill-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin-top: 22px;
}

.lp-apartment-management .ierite-lp__apt-pill {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 18px;
	border: 1px solid var(--ierite-lp-brand-line);
	border-radius: var(--ierite-lp-radius-card);
	background: #ffffff;
}

.lp-apartment-management .ierite-lp__apt-pill-body {
	display: block;
}

.lp-apartment-management .ierite-lp__apt-pill-title {
	display: block;
	color: var(--apartment-navy);
	font-size: 15.5px;
	font-weight: 700;
}

/*
 * lp.css の `.ierite-lp strong` は文字を大きくしますが、
 * ここでは本文とのバランスを整えるため、等倍に戻します。
 */
.lp-apartment-management strong.ierite-lp__apt-pill-title {
	font-size: 15.5px;
}

.lp-apartment-management .ierite-lp__apt-pill-text {
	display: block;
	margin-top: 4px;
	color: var(--ierite-lp-text);
	font-size: 14.5px;
	line-height: 1.8;
}


/* =====================================================================
 * 11. 08 ご相談から管理開始までの流れ
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-flow-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

.lp-apartment-management .ierite-lp__apt-flow-item {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-areas:
		"badge title"
		"icon  text";
	align-items: center;
	gap: 6px 14px;
	padding: 18px;
	border: 1px solid var(--ierite-lp-brand-line);
	border-radius: var(--ierite-lp-radius-card);
	background: #ffffff;
	box-shadow: var(--ierite-lp-shadow);
}

.lp-apartment-management .ierite-lp__apt-flow-badge {
	grid-area: badge;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 62px;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--apartment-navy);
	color: #ffffff;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.lp-apartment-management .ierite-lp__apt-flow-title {
	grid-area: title;
	margin: 0;
	color: var(--apartment-navy);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
}

.lp-apartment-management .ierite-lp__apt-flow-icon {
	grid-area: icon;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 62px;
	height: 62px;
	border-radius: 50%;
	background: var(--apartment-pale-blue);
	color: var(--apartment-navy);
}

.lp-apartment-management .ierite-lp__apt-flow-text {
	grid-area: text;
	margin: 0;
	color: var(--ierite-lp-text);
	font-size: 14.5px;
	line-height: 1.8;
}


/* =====================================================================
 * 12. 09 代表紹介
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-rep {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
	align-items: start;
	padding: 24px 20px;
	border: 1px solid var(--ierite-lp-brand-line);
	border-radius: var(--ierite-lp-radius-card);
	background: #ffffff;
	box-shadow: var(--ierite-lp-shadow);
}

.lp-apartment-management .ierite-lp__apt-rep-figure {
	margin: 0;
}

.lp-apartment-management .ierite-lp__apt-rep-image {
	display: block;
	width: 100%;
	max-width: 320px;
	margin: 0 auto;
	border-radius: var(--ierite-lp-radius-image);
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: 50% 30%;
}

.lp-apartment-management .ierite-lp__apt-rep-name {
	margin: 0 0 16px;
}

.lp-apartment-management .ierite-lp__apt-rep-company {
	display: block;
	color: var(--ierite-lp-text-muted);
	font-size: 13px;
	font-weight: 600;
}

.lp-apartment-management .ierite-lp__apt-rep-person {
	display: block;
	margin-top: 2px;
	color: var(--apartment-navy);
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.lp-apartment-management .ierite-lp__apt-rep-kana {
	margin-left: 8px;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0;
}

.lp-apartment-management .ierite-lp__apt-point-list {
	display: grid;
	gap: 10px;
	margin-top: 20px;
}

.lp-apartment-management .ierite-lp__apt-point {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	color: var(--ierite-lp-text);
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.7;
}

/* 代表紹介のなかの補助写真は、スマートフォンでは出しません */
.lp-apartment-management .ierite-lp__apt-figure--rep-sub {
	display: none;
}


/* =====================================================================
 * 13. FAQ
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-faq-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
	align-items: start;
}


/* =====================================================================
 * 14. 中間CTA
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-cta-inline {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 32px;
}

.lp-apartment-management .ierite-lp__apt-cta-inline .ierite-lp__cta-note {
	text-align: center;
}


/* =====================================================================
 * 15. 11 最終CTA・フォーム
 *
 * PC：左に説明（濃紺）、右にフォーム（白）
 * スマートフォン：説明 → フォーム
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-section--form {
	background: var(--apartment-deep);
}

.lp-apartment-management .ierite-lp__apt-form-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
	align-items: start;
}

.lp-apartment-management .ierite-lp__apt-form-intro {
	color: #ffffff;
}

/*
 * 見出しと番号ラベル。
 *
 * 既存LPのフォームは中央揃えですが、このLPは2カラムのため
 * 左揃えにします（既存LPの指定は変更していません）。
 */
.lp-apartment-management .ierite-lp__heading--form {
	color: #ffffff;
	text-align: left;
}

.lp-apartment-management .ierite-lp__apt-form-intro .ierite-lp__sec-eyebrow {
	justify-content: flex-start;
}

/*
 * フォーム本体。
 *
 * 既存LPでは .ierite-lp__form-wrap 自体が白いカードですが、
 * このLPでは外側の .ierite-lp__apt-form-panel がカードの役目を持つため、
 * 二重の枠・影・重なりの位置調整を打ち消します。
 * 入力欄そのもののデザインは既存のままです。
 */
.lp-apartment-management .ierite-lp__form-wrap {
	max-width: none;
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	box-shadow: none;
}

.lp-apartment-management .ierite-lp__apt-form-text p {
	margin: 0 0 0.8em;
	color: rgba(255, 255, 255, 0.9);
	font-size: 15px;
	line-height: 1.9;
}

.lp-apartment-management .ierite-lp__apt-form-text p:last-child {
	margin-bottom: 0;
}

.lp-apartment-management .ierite-lp__apt-form-service {
	display: inline-block;
	margin: 20px 0 0;
	padding: 7px 16px;
	border: 1px solid rgba(255, 255, 255, 0.34);
	border-radius: 999px;
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
}

.lp-apartment-management .ierite-lp__apt-form-tel {
	margin-top: 22px;
}

.lp-apartment-management .ierite-lp__apt-tel-button--light {
	max-width: 320px;
}

.lp-apartment-management .ierite-lp__apt-form-tel-note {
	margin: 10px 0 0;
	color: rgba(255, 255, 255, 0.78);
	font-size: 13px;
	line-height: 1.7;
}

/* フォームの面 */
.lp-apartment-management .ierite-lp__apt-form-panel {
	padding: 22px 18px;
	border-radius: var(--ierite-lp-radius-card);
	background: #ffffff;
}

.lp-apartment-management .ierite-lp__apt-form-panel .ierite-lp__note {
	margin-top: 18px;
	text-align: left;
}

/*
 * ご相談内容（複数選択）のチェックボックス。
 * 指を置きやすいよう、1つずつ独立した面にします。
 */
.lp-apartment-management .ierite-lp__form-checks .wpcf7-list-item {
	display: block;
	margin: 0 0 8px;
}

.lp-apartment-management .ierite-lp__form-checks .wpcf7-list-item-label {
	font-size: 15px;
}

.lp-apartment-management .ierite-lp__form-checks label {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 14px;
	border: 1px solid var(--ierite-lp-border);
	border-radius: 10px;
	background: #ffffff;
	cursor: pointer;
}

.lp-apartment-management .ierite-lp__form-checks input[type="checkbox"] {
	width: 20px;
	height: 20px;
	accent-color: var(--apartment-navy);
}


/* =====================================================================
 * 16. 固定CTA（スマートフォン）
 *
 * 左：電話で相談／右：無料で相談する。
 * 相談してほしいのはフォームのため、右を大きくしています。
 * ===================================================================== */

.lp-apartment-management .ierite-lp__sticky-row {
	display: flex;
	align-items: stretch;
	gap: 8px;
	width: 100%;
}

.lp-apartment-management .ierite-lp__sticky-button {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	text-decoration: none;
}

/* 左：電話。枠線だけの控えめなボタンにします */
.lp-apartment-management .ierite-lp__sticky-button--tel {
	flex: 0 0 34%;
	border: 2px solid var(--apartment-navy);
	background: #ffffff;
	color: var(--apartment-navy);
	font-size: 15px;
}

/* 右：フォーム。左よりはっきり大きくします */
.lp-apartment-management a.ierite-lp__sticky-button--form {
	flex: 1 1 auto;
	width: auto;
	min-height: 56px;
	font-size: 17px;
}


/* =====================================================================
 * 17. サンクスページ
 * ===================================================================== */

.lp-apartment-management .ierite-lp__apt-note-block {
	margin: 24px 0 0;
	padding: 18px 20px;
	border-radius: var(--ierite-lp-radius-card);
	background: var(--apartment-pale-blue);
}

.lp-apartment-management .ierite-lp__apt-note-block--plain {
	background: var(--ierite-lp-bg-gray);
}

.lp-apartment-management .ierite-lp__apt-note-block p {
	margin: 0 0 0.6em;
	color: var(--ierite-lp-text);
	font-size: 15px;
	line-height: 1.8;
}

.lp-apartment-management .ierite-lp__apt-note-block p:last-child {
	margin-bottom: 0;
}

.lp-apartment-management .ierite-lp__apt-thanks-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 32px;
}

.lp-apartment-management a.ierite-lp__apt-thanks-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	padding: 12px 20px;
	border: 2px solid var(--apartment-navy);
	border-radius: var(--ierite-lp-radius-button);
	background: var(--apartment-navy);
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
}

.lp-apartment-management a.ierite-lp__apt-thanks-button--sub {
	background: #ffffff;
	color: var(--apartment-navy);
}

.lp-apartment-management a.ierite-lp__apt-thanks-button:hover,
.lp-apartment-management a.ierite-lp__apt-thanks-button:focus {
	background: var(--apartment-deep);
	color: #ffffff;
}


/* =====================================================================
 * 18. 768px以上
 * ===================================================================== */

@media (min-width: 768px) {

	.lp-apartment-management .ierite-lp__apt-header-sub {
		font-size: 12px;
	}

	/* 02：3列×2段 */
	.lp-apartment-management .ierite-lp__apt-concern-list {
		grid-template-columns: repeat(3, 1fr);
		gap: 16px;
	}

	.lp-apartment-management .ierite-lp__apt-concern-text {
		font-size: 15.5px;
	}

	/* カード */
	.lp-apartment-management .ierite-lp__apt-card-list--2 {
		grid-template-columns: repeat(2, 1fr);
	}

	.lp-apartment-management .ierite-lp__apt-card-list--3 {
		grid-template-columns: repeat(3, 1fr);
	}

	/* 08：5ステップを横1列 */
	.lp-apartment-management .ierite-lp__apt-flow-list {
		grid-template-columns: repeat(5, 1fr);
		gap: 14px;
	}

	.lp-apartment-management .ierite-lp__apt-flow-item {
		grid-template-columns: 1fr;
		grid-template-areas:
			"badge"
			"icon"
			"title"
			"text";
		justify-items: center;
		gap: 10px 0;
		text-align: center;
	}

	.lp-apartment-management .ierite-lp__apt-flow-title {
		font-size: 15.5px;
	}

	.lp-apartment-management .ierite-lp__apt-flow-text {
		font-size: 13.5px;
	}

	/* FAQ：2列 */
	.lp-apartment-management .ierite-lp__apt-faq-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px 20px;
	}

	/* 04：5ステップは2列に */
	.lp-apartment-management .ierite-lp__apt-step-list {
		grid-template-columns: repeat(2, 1fr);
		padding: 22px 20px;
	}

	.lp-apartment-management .ierite-lp__apt-step {
		border-bottom: none;
	}

	/* フォーム */
	.lp-apartment-management .ierite-lp__apt-form-panel {
		padding: 30px 28px;
	}

	.lp-apartment-management .ierite-lp__apt-thanks-actions {
		flex-direction: row;
		justify-content: center;
	}

	.lp-apartment-management a.ierite-lp__apt-thanks-button {
		min-width: 260px;
	}

	/*
	 * PCでは固定CTAを右下の小さなボタン1つにします。
	 * 電話は画面上部のヘッダーに常に出ているため、ここでは出しません。
	 */
	.lp-apartment-management .ierite-lp__sticky-button--tel {
		display: none;
	}

	.lp-apartment-management a.ierite-lp__sticky-button--form {
		min-height: 60px;
		font-size: 17px;
	}
}


/* =====================================================================
 * 19. 900px以上（ファーストビューと2カラム）
 * ===================================================================== */

@media (min-width: 900px) {

	.lp-apartment-management .ierite-lp__apt-hero-photo {
		border-radius: 0 0 50% 50% / 0 0 64px 64px;
		/* PCでは右側の写真を活かし、文章側だけ濃く覆います */
		background-image:
			linear-gradient(100deg, rgba(8, 37, 68, 0.95) 0%, rgba(8, 37, 68, 0.9) 46%, rgba(8, 37, 68, 0.62) 72%, rgba(8, 37, 68, 0.42) 100%),
			url("../images/apartment/apartment-exterior.webp");
	}

	.lp-apartment-management .ierite-lp__apt-hero-lead {
		font-size: 17px;
	}

	.lp-apartment-management .ierite-lp__apt-service {
		font-size: 20px;
	}

	/*
	 * 安心材料は横3列に。
	 *
	 * 幅を3等分にすると、文字数の多い2つめだけが3行になって
	 * 高さがそろわないため、文字数に応じた幅にしています。
	 */
	.lp-apartment-management .ierite-lp__hero-points {
		grid-template-columns: repeat(3, auto);
		justify-content: start;
	}

	.lp-apartment-management .ierite-lp__hero-point {
		font-size: 13px;
	}

	.lp-apartment-management .ierite-lp__hero-point-text {
		white-space: nowrap;
	}

	/* CTAは横並び */
	.lp-apartment-management .ierite-lp__apt-cta-row {
		flex-direction: row;
		align-items: stretch;
	}

	.lp-apartment-management a.ierite-lp__cta-button--hero {
		width: auto;
		max-width: none;
		flex: 1 1 56%;
	}

	.lp-apartment-management .ierite-lp__apt-tel-button,
	.lp-apartment-management a.ierite-lp__apt-tel-button {
		width: auto;
		max-width: none;
		flex: 1 1 40%;
		min-height: 60px;
	}

	/*
	 * 人物（切り抜き画像）は lp.css の指定をそのまま使います。
	 *
	 * 【上書きしない理由】
	 *   lp.css は figure（min-height 480px）の中で
	 *   人物を絶対配置し、高さ100%で下端に立たせています。
	 *   ここで height を auto などに変えると、その組み立てが崩れて
	 *   人物が表示されなくなります。
	 */

	/* 03：本文＋4カード（左）と写真（右） */
	.lp-apartment-management .ierite-lp__apt-review {
		grid-template-columns: 1.35fr 1fr;
		gap: 36px;
		align-items: center;
	}

	.lp-apartment-management .ierite-lp__apt-figure--review {
		margin-top: 0;
	}

	.lp-apartment-management .ierite-lp__apt-figure--review .ierite-lp__apt-figure-image {
		aspect-ratio: 3 / 4;
	}

	/* 04・06：説明（左）と図（右） */
	.lp-apartment-management .ierite-lp__apt-split {
		grid-template-columns: 1fr 1.15fr;
		gap: 40px;
	}

	/* 05：写真（左）と説明（右）。読み上げ順はHTMLのままです */
	.lp-apartment-management .ierite-lp__apt-split--media-first {
		grid-template-columns: 1fr 1.1fr;
		align-items: center;
	}

	.lp-apartment-management .ierite-lp__apt-split--media-first .ierite-lp__apt-figure {
		margin-top: 0;
	}

	/* 09：写真・本文・補助写真の3カラム */
	.lp-apartment-management .ierite-lp__apt-rep {
		grid-template-columns: 0.85fr 1.4fr 0.85fr;
		gap: 30px;
		padding: 32px 30px;
	}

	.lp-apartment-management .ierite-lp__apt-figure--rep-sub {
		display: block;
		margin-top: 0;
	}

	.lp-apartment-management .ierite-lp__apt-figure--rep-sub .ierite-lp__apt-figure-image {
		aspect-ratio: 3 / 4;
	}

	.lp-apartment-management .ierite-lp__apt-rep-person {
		font-size: 28px;
	}

	/* 11：説明（左）とフォーム（右） */
	.lp-apartment-management .ierite-lp__apt-form-layout {
		grid-template-columns: 1fr 1.15fr;
		gap: 44px;
	}

	.lp-apartment-management .ierite-lp__apt-form-text p {
		font-size: 16px;
	}
}


/* =====================================================================
 * 20. 1024px以上
 * ===================================================================== */

@media (min-width: 1024px) {

	/* ヘッダーのページ内メニューは、ここから表示します */
	.lp-apartment-management .ierite-lp__apt-nav {
		display: block;
		flex: 1 1 auto;
		min-width: 0;
	}

	.lp-apartment-management .ierite-lp__header-inner {
		gap: 20px;
	}

	.lp-apartment-management .ierite-lp__apt-closing {
		font-size: 17px;
	}
}
