/*
 * Google Programmable Search (PSE) 検索結果ページ向けレイアウト復旧
 *
 * 背景:
 *   base.css に `.gs-image-box.gs-web-image-box.gs-web-image-box-* { float:none !important }`
 *   があり、PSE デフォルト CSS の `float: right` を打ち消していたため、
 *   PSE 仕様変更（2026/02）以降、検索結果が縦並びになっていた。
 *
 * 方針:
 *   .wrap-search-result-all スコープ内に限り float を当て直し、
 *   元の SP/PC レイアウト（SP: 画像右、PC: 画像左）を再現する。
 *   ブレイクポイント 768px は base.css の `@media print, all and (min-width:768px)` に合わせる。
 */

/*
 * PSE デフォルト CSS (default_v6+ja.css) で .gsc-wrapper に max-width:700px が
 * 設定されているため、コンテンツ領域 1120px に対して 700px に縮んでしまう。
 * 親コンテナ幅まで広げる。
 */
.wrap-search-result-all .gsc-wrapper {
	max-width: none !important;
}

/* SP (< 768px): 画像を右に float、左側に隙間 */
.wrap-search-result-all .gs-promotion-image-box,
.wrap-search-result-all .gs-image-box.gs-web-image-box.gs-web-image-box-portrait,
.wrap-search-result-all .gs-image-box.gs-web-image-box.gs-web-image-box-landscape {
	float: right !important;
	margin: 0 0 10px 15px !important;
}

/* PC (>= 768px): 画像を左に float、右側に隙間 */
@media print, all and (min-width: 768px) {
	.wrap-search-result-all .gs-promotion-image-box,
	.wrap-search-result-all .gs-image-box.gs-web-image-box.gs-web-image-box-portrait,
	.wrap-search-result-all .gs-image-box.gs-web-image-box.gs-web-image-box-landscape {
		float: left !important;
		margin: 0 15px 10px 0 !important;
	}
}

/*
 * サムネイルを正方形で表示する。
 * PSE のモバイルレイアウトでは縦長（約 9:13）のサムネイルが描画され、
 * PC（正方形）と見た目が揃わないため、画像の幅を基準に 1:1 へ切り抜く。
 * object-fit: cover でソース画像の比率に関わらず正方形に統一する。
 */
.wrap-search-result-all .gs-image-box img.gs-image {
	aspect-ratio: 1 / 1 !important;
	height: auto !important;
	max-height: none !important;
	object-fit: cover !important;
}
