/* ヒーロー：全幅背景画像型（hero-fullscreen） */

.hero-fullscreen {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #fdf3f9;
	width: 100%;
	padding-top: 130px;
	box-sizing: border-box;
	}
.hero-fullscreen__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 1120px;
	height: 85vh;
	position: relative;
	overflow: hidden;
	}
.hero-fullscreen__bg-img {
	position: absolute;
	height: 120%;
	width: auto;
	left: 50%;
	/* 上へのオフセットは固定pxでなく比率にする。
	   固定pxだと縦解像度が低い環境で画像上端(頭頂部)が切れるため。 */
	top: -10%;
	transform: translateX(-50%);
	z-index: 0;
	}
.hero-fullscreen__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 0;
	width: 90%;
	color: #fff;
	position: absolute;
	top: 60%;
	z-index: 1;
	text-align: center;
	}
@keyframes hero-fullscreen-catch-wipe {
	from { clip-path: inset(-30px 100% -30px 0); }
	to   { clip-path: inset(-30px 0% -30px 0); }
	}

.hero-fullscreen__catch {
	font-size: clamp(2.6em, 5.7vw, 4em);
	font-weight: 900;
	line-height: 1.2;
	margin: 0 0 0.25em;
	color: #003f88;
	display: inline-block;
	}
.hero-fullscreen__name {
	font-size: clamp(2.16em, 4.44vw, 3.12em);
	font-weight: 900;
	margin: 0;
	color: #003f88;
	}
/* 「城」のふりがな：ruby だと間隔を CSS 制御できないため span で自前組み。
   .jo__rt を絶対配置し、間隔は margin-top（em）で自由に調整する。 */
.hero-fullscreen__name .jo {
	position: relative;
	display: inline-block;
	line-height: 1;
	}
.hero-fullscreen__name .jo__rt {
	position: absolute;
	left: 50%;
	top: 100%;
	transform: translateX(-50%);
	margin-top: 0.3em;
	font-size: .24em;
	font-weight: 800;
	line-height: 1;
	white-space: nowrap;
	letter-spacing: 0.25em;
	padding-left: 0.25em; /* letter-spacing の trailing 分を相殺して中央寄せを保つ */
	}
.hero-fullscreen__position {
	font-size: clamp(1.2em, 2.3vw, 1.6em);
	margin: 1em 0 0;
	}

@media (max-width: 768px) {
	.hero-fullscreen { padding-top: 90px; }
	.hero-fullscreen__inner { flex-direction: column; height: 80vh; }
	.hero-fullscreen__bg-img { top: -50px; }
	.hero-fullscreen__body { padding: 8% 0 16%; transform: translateY(-30px); }
	.hero-fullscreen__position { margin: .5em 0 0; }
	}