@charset "utf-8";
.main_katagaki {}
.main_katagaki>img {
	width: 100%;
	aspect-ratio: 1200 / 460;
	object-fit: cover;
	object-position: center bottom;
	max-width: 1200px;
}
.main_katagaki ul {
	font-family: var(--fSerif);
	font-size: 2.28vw;
	font-weight: bold;
	color: #fff;
	width: calc(100% * 500 / 1200);
	max-width: 500px;
	padding: .5em 0 .5em .5em;
	background: rgba(1,159,230,.5);
	box-shadow: var(--boxShdw);
	position: absolute;
	top: .6em;
	left: .6em;
}
.main_katagaki ul>li:not(.title) {
	font-size: calc(100% / 1.4 * 1.2);
}

.main_katagaki ul>li {
	text-shadow: var(--txtShdw);
}


@media screen and (min-width: 521px) {
/*	#header_img_wrap, #h1_wrap {margin-top: -3em;}*/
	.main_katagaki>img {
		aspect-ratio: 1200 / 350;
		object-position: 0 60%;
	}
	.main_katagaki ul {}
}

@media screen and (min-width: 961px) {

}

@media screen and (min-width: 1201px) {
	.main_katagaki ul {font-size: 1.712em;}
}

@media screen and (max-width: 520px) {

}

clamp (.6em, Yrem + Zvw, 2em)
/*
clamp(fontSizeMin, Yrem + Zvw, fontSizeMax)

fontSizeMin: フォントサイズの最小値 14px
X: (fontSizeMax - fontSizeMin);1.4em, 34px / (viewportWidthMax 1400 - viewportWidthMin 320);1080　＝0.0012962963
Y: fontSizeMax - viewportWidthMax * X;2em, 58.333px - 1400 * 0.0012962963　＝0.18518518em
Z: X * 100；0.12962963
fontSizeMax: フォントサイズの最大値 48px
*/