/* ============================================
   timeline.css — タイムラインページ用追加スタイル
   /assets/css/timeline.css として配置
   ============================================ */

/* ------------------------------------------
   ヒーロー：画像 + タイトルオーバーレイ
   ------------------------------------------ */

/* ヒーロー画像のアスペクト比調整（plan ページと統一） */
.f-body-timeline .p-hero_image {
	aspect-ratio: 16 / 7;
	overflow: hidden;
}

@media screen and (max-width: 425px) {
	.f-body-timeline .p-hero_image {
		aspect-ratio: 4 / 3;
	}
}

/* タイトルを画像中央下部に配置（plan ページと統一） */
.f-body-timeline .p-hero_text {
	align-self: end;
	justify-self: center;
	text-align: center;
	margin: 0 0 clamp(24px, 6%, 64px) 0;
}

/* タイトルにドロップシャドウ（plan ページと統一） */
.f-body-timeline .p-hero_textMain {
	text-shadow:
		0 2px 24px rgba(0, 0, 0, 0.55),
		0 1px 8px  rgba(0, 0, 0, 0.35);
}