/*
 * 対象は WRS Used Watch Layout が付与する body class を持つ
 * 単一購入欄のWelcart中古時計だけです。DOM・フォーム・JSは変更しません。
 */

@media (min-width: 1024px) {
	/* 中古時計だけサイドバーを除外し、親コンテナの幅を商品表示へ使う。 */
	body.wrs-used-watch-product .l-main__inner.l-2columns {
		display: block;
	}

	body.wrs-used-watch-product .l-main__inner.l-2columns > .l-secondary {
		display: none;
	}

	body.wrs-used-watch-product .l-main__inner.l-2columns > .l-primary {
		width: 100%;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart {
		display: grid;
		grid-template-columns: minmax(0, 7fr) minmax(320px, 3fr);
		column-gap: 36px;
		align-items: start;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart > .p-entry-product__header {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart > .p-entry-product__images {
		grid-column: 1;
		grid-row: 2;
		margin: 38px 0 40px;
		min-width: 0;
	}

	/* 親テーマtype1の「メイン画像 + 右側200pxサムネイル」を縦構成へ上書きする。 */
	body.wrs-used-watch-product .p-entry-product__images--type1 .p-entry-product__images-inner {
		display: flex;
		flex-direction: column;
	}

	body.wrs-used-watch-product .p-entry-product__images--type1 .p-entry-product__mainimage {
		flex: 0 0 auto;
		width: 100%;
	}

	body.wrs-used-watch-product .p-entry-product__images--type1 .p-entry-product__subimages {
		flex: 0 0 auto;
		margin-top: 14px;
		overflow-x: auto;
		width: 100%;
	}

	body.wrs-used-watch-product .p-entry-product__images--type1 .p-entry-product__subimages-inner {
		display: flex;
		flex-wrap: nowrap;
		min-width: 100%;
		width: max-content;
	}

	body.wrs-used-watch-product .p-entry-product__images--type1 .p-entry-product__subimage {
		flex: 0 0 90px;
		margin: 0 10px 0 0;
	}

	body.wrs-used-watch-product .p-entry-product__images--type1 .p-entry-product__subimage:last-child {
		margin-right: 0;
	}

	/* middleの子要素を既存フォームの親Gridへ参加させる。 */
	body.wrs-used-watch-product .p-entry-product__main.has-single-cart > .p-entry-product__middle {
		display: contents;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart .p-entry-product__carts {
		grid-column: 2;
		grid-row: 2;
		align-self: start;
		max-width: none;
		min-width: 0;
		width: 100%;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart .p-entry-product__cart {
		margin-top: 38px;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart .p-entry-product__content {
		grid-column: 1 / -1;
		grid-row: 3;
		max-width: none;
		margin-top: 8px;
		padding-right: 0;
	}
}

@media (max-width: 1023px) {
	/* タブレット・スマホは「画像 → 購入欄 → 本文」の縦並びに戻す。 */
	body.wrs-used-watch-product .l-main__inner.l-2columns {
		display: block;
	}

	body.wrs-used-watch-product .l-main__inner.l-2columns > .l-secondary {
		display: none;
	}

	body.wrs-used-watch-product .l-main__inner.l-2columns > .l-primary {
		width: 100%;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart {
		display: block;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart .p-entry-product__middle {
		display: flex;
		flex-direction: column;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart .p-entry-product__carts {
		flex: 0 0 auto;
		max-width: none;
		order: 1;
		width: 100%;
	}

	body.wrs-used-watch-product .p-entry-product__main.has-single-cart .p-entry-product__content {
		flex: 0 0 auto;
		max-width: none;
		order: 2;
		padding-right: 0;
		width: 100%;
	}
}