/*------------------------------------------------------------------------------------*/
/*  トップの pickup の文字（2026-10-13）
/*  - 横長の窓では、文字を写真の内側に置き、大きさと余白を窓の大きさに合わせて連続的に変える。
/*    旧 Main.css は文字が左の白い帯にまたがり、大きさが固定値だったため、窓の大きさで見え方が大きく変わっていた。
/*  - 縦長の窓（幅1024px以下かつ縦長）は Main.css のまま（写真の上の白地に文字を置く並び）。
/*    下の @media は Main.css の only screen and (max-width: 1024px) and (orientation:portrait) のちょうど反対
/*    （not で全体を打ち消す。幅が 1024px と 1025px の間になる拡大率でも、どちらか一方が必ず当たる）。
/*  - 文字の色: pickup 記事の「文字の色」欄が「白」なら index.php が .ImageCutCaptionWhite を付ける（暗い写真用）。
/*    縦長の窓では文字が写真に重ならないので、白を選んでいても黒のまま。
/*  Main.css の後に読み込むこと（同じ要素の指定を上書きする）。
/*------------------------------------------------------------------------------------*/
@media not screen and (max-width: 1024px) and (orientation: portrait) {
	.PageContentsImageCutImageWrapper > .ImageCutCaptionWrapper1,
	.PageContentsImageCutImageWrapper > .ImageCutCaptionWrapper2,
	.PageContentsImageCutImageWrapper > .ImageCutCaptionWrapper3 {
		top: clamp(24px, 10vh, 120px);
		left: 6%;
		right: 6%;
		transform: none;
		/* 写真より手前に出す。旧 index.php は 写真1・文字1・写真2・文字2・写真3・文字3 の順に並べるため、
		   文字を写真の内側へ移すと後ろの写真が1・2枚目の view product を覆い、押せなくなった（2026-10-14 まつお発見） */
		z-index: 1;
	}
	.PageContentsImageCutImageWrapper .PageContentsImageCutWrapperTitle {
		width: auto;
		max-width: 16em;
		font-size: clamp(26px, 3.2vw, 60px);
		margin-bottom: clamp(14px, 3vh, 38px);
	}
	.PageContentsImageCutImageWrapper .PageContentsImageCutWrapperText {
		width: auto;
		max-width: min(36em, 100%);
		font-size: clamp(12px, 0.95vw, 17px);
		padding-top: clamp(10px, 2vh, 20px);
		margin-bottom: clamp(14px, 3vh, 30px);
	}
	.PageContentsImageCutImageWrapper .PageContentsImageCutWrapperReadMoreBottom {
		width: auto;
		padding: 6px 28px;
		font-size: clamp(12px, 0.9vw, 16px);
	}

	/* 文字の色＝白（暗い写真用） */
	.PageContentsImageCutImageWrapper > .ImageCutCaptionWhite {
		color: white;
		text-shadow: 0 1px 12px rgba(0, 0, 0, 0.45);
	}
	.PageContentsImageCutImageWrapper > .ImageCutCaptionWhite .PageContentsImageCutWrapperReadMoreBottom:hover {
		background-color: white;
		color: black;
		text-shadow: none;
	}

	/* 右上の虫眼鏡・人型（ログイン中はアカウント・カート・お気に入り）も、白い文字の pickup が写真の上に出ている間だけ白くする
	   （2026-10-14。暗い写真の上で黒い印が見えなかった）。body.PickupHeaderWhite は index.php が付け外しする。
	   印はどれも黒一色の線・画像なので反転で白になる。カートの数字（赤）は画像ではないので変えない。 */
	body.PickupHeaderWhite .SearchDisplayTrigger,
	body.PickupHeaderWhite .Account img {
		filter: invert(1);
	}
}