@charset "utf-8";

/* --------- --------- --------- --------- product_main > div.product_main --------- */
section.product_main {
	position: relative;
}
section.product_main > div.product_main {
	display: flex;
	gap: 4rem;
	width: 100%;
	position: relative;
}
section.product_main > div.product_main .product_main_image {
	display: flex;
	flex-direction: column;
	width: 480px;
}
section.product_main > div.product_main .product_main_image .main_image_list {
	width: 100%;
	max-width: calc(480px - 2rem);
	margin: 0 auto;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border: 2px solid #b0b2ad;
	border-radius: 1rem;
}
section.product_main > div.product_main .product_main_image .main_image_list > .main_image {
	width: 100%;
	cursor: pointer;
}
section.product_main > div.product_main .product_main_image .splide__track {
	display: flex;
}
section.product_main > div.product_main .product_main_image .splide__track .splide__list img {
	width: 100%;
	user-drag: none;
	-webkit-user-drag: none;
	-moz-user-select: none;
}
section.product_main > div.product_main .product_main_image .splide__track .splide__slide {
	display: flex;
}
section.product_main > div.product_main .splide .splide__arrow--prev,
section.product_main > div.product_main .splide .splide__arrow--next {
	display: none;
}
section.product_main > div.product_main .splide .splide__pagination {
	display: none;
	height: 10px;
	gap: 10px;
	margin: 1.5rem 0 0 0;
}
section.product_main > div.product_main .splide .splide__pagination li {
	height: 10px;
	line-height: 10px;
	font-size: 0;
}
section.product_main > div.product_main .splide .splide__pagination__page {
	width: 10px;
	height: 10px;
	background: #53340A;
	opacity: .5;
}
section.product_main > div.product_main .splide .splide__pagination__page.is-active {
	opacity: 1;
}
section.product_main > div.product_main .product_main_image > .image_list {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-top: 1rem;
}
section.product_main > div.product_main .product_main_image > .image_list .image {
	display: flex;
	width: calc((100% - 4rem) / 5);
	overflow: hidden;
	border: 2px solid #e4c08e00;
	border-radius: .25rem;
}
section.product_main > div.product_main .product_main_image > .image_list .image.active {
	border: 2px solid #e4c08e;
}
section.product_main > div.product_main .product_main_image > .image_list .image img {
	width: 100%;
	cursor: pointer;
	transition: opacity .2s;
	user-drag: none;
	-webkit-user-drag: none;
	-moz-user-select: none;
}
section.product_main > div.product_main .product_main_image > .image_list .image img:hover {
	opacity: .75;
}
section.product_main > div.product_main .product_main_cart {
	flex: 1;
	display: flex;
	flex-direction: column;
	height: 100%;
	margin-right: 3rem;
}
@media screen and (max-width: 768px) {
	section.common_section:first-of-type {
		margin-top: 5rem;
	}
	section.product_main > div.product_main {
		display: flex;
		flex-direction: column;
		gap: 2rem;
		width: 100%;
		position: relative;
	}
	section.product_main > div.product_main .product_main_image {
		width: 100%;
	}
	section.product_main > div.product_main .product_main_image > .image_main {
		width: 100%;
	}
	section.product_main > div.product_main .product_main_image > .image_list {
		display: none;
	}
	section.product_main > div.product_main .splide .splide__pagination {
		display: flex;
	}
}
section.product_main > div.product_main .product_main_cart > .product_title {
	margin-top: .5rem;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.4;
}
section.product_main > div.product_main .product_main_cart > .product_price {
	margin-top: .5rem;
}
section.product_main > div.product_main .product_main_cart > .product_price .yen {
	margin-right: .125rem;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.4;
}
section.product_main > div.product_main .product_main_cart > .product_price .price {
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.4;
}
section.product_main > div.product_main .product_main_cart > .product_price .tax {
	margin-left: .125rem;
	font-size: .875rem;
	font-weight: 700;
	line-height: 1.4;
}
section.product_main > div.product_main .product_main_cart > .variant {
	display: flex;
	flex-direction: column;
	margin-top: 1.5rem;
}
section.product_main > div.product_main .product_main_cart > .variant.hidden {
	display: none;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_image {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-top: .5rem;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_image > .option {
	width: 4rem;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_image > .option .image {
	display: flex;
	width: 4rem;
	overflow: hidden;
	border: 2px solid #b0b2ad;
	border-radius: .5rem;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_image > .option .image.active {
	border: 2px solid #e4c08e;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_image > .option .image img {
	width: 100%;
	cursor: pointer;
	user-drag: none;
	-webkit-user-drag: none;
	-moz-user-select: none;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_image > .option .title {
	margin-top: .25rem;
	font-size: .75rem;
	font-weight: 700;
	line-height: 1.4;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_select {
	display: flex;
	align-items: baseline;
	margin-top: .25rem;
	background-color: #ffffff;
	position: relative;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_select > .select {
	display: flex;
	align-items: baseline;
	background-color: #ffffff;
	position: relative;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_select > .select::before {
	content: '▼';
	font-family: 'GenJyuuGothic', sans-serif;
	font-weight: 400;
	color: #b0b2ad;
	font-size: .625rem;
	position: absolute;
	top: 50%;
	right: .5rem;
	transform: translateY(-50%);
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_select > .select select {
	cursor: pointer;
	min-width: 66px;
	padding: .5rem 1.75rem .5rem .75rem;
	line-height: 2rem;
	font-size: 1.125rem;
	font-weight: 700;
	text-align: center;
	border-radius: .5rem;
	background-color: #ffffff00;
	border: 2px solid #b0b2ad;
	outline: 0;
	position: relative;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
}
section.product_main > div.product_main .product_main_cart > .variant > .variant_select > .select select option {
	font-size: 1.125rem;
	font-weight: 700;
	position: relative;
	left: 0;
}
section.product_main > div.product_main .product_main_cart > .quantity {
	display: flex;
	flex-direction: column;
	margin-top: 1.5rem;
}
section.product_main > div.product_main .product_main_cart > .quantity > .quantity_select {
	display: flex;
	align-items: baseline;
	margin-top: .25rem;
}
section.product_main > div.product_main .product_main_cart > .quantity > .quantity_select .select {
	display: flex;
	align-items: baseline;
	background-color: #ffffff;
	position: relative;
}
section.product_main > div.product_main .product_main_cart > .quantity > .quantity_select .select::before {
	content: '▼';
	font-family: 'GenJyuuGothic', sans-serif;
	font-weight: 400;
	color: #b0b2ad;
	font-size: .625rem;
	position: absolute;
	top: 50%;
	right: .5rem;
	transform: translateY(-50%);
}
section.product_main > div.product_main .product_main_cart > .quantity > .quantity_select .select select {
	cursor: pointer;
	min-width: 66px;
	padding: .5rem 1.75rem .5rem .75rem;
	line-height: 2rem;
	font-size: 1.125rem;
	font-weight: 700;
	text-align: center;
	border-radius: .5rem;
	color: #53340a;
	background-color: #ffffff00;
	border: 2px solid #b0b2ad;
	outline: 0;
	position: relative;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
}
section.product_main > div.product_main .product_main_cart > .quantity > .quantity_select .select select.disabled {
	color: #53340a80;
	pointer-events: none;
}
section.product_main > div.product_main .product_main_cart > .quantity > .quantity_select .select select option {
	font-size: 1.125rem;
	font-weight: 700;
	position: relative;
	left: 0;
}
section.product_main > div.product_main .product_main_cart > .quantity > .quantity_select .quantity {
	margin-left: .5rem;
	font-size: .875rem;
	font-weight: 800;
	color: #53340a;
}
section.product_main > div.product_main .product_main_cart .product_main_cart_title {
	padding-left: .625rem;
	font-size: 1rem;
	font-weight: 800;
	line-height: 1.4;
	position: relative;
}
section.product_main > div.product_main .product_main_cart .product_main_cart_title::before {
	content: '';
	width: .25rem;
	height: 1rem;
	background-color: #53340A;
	border-radius: .25rem;
	position: absolute;
	left: .0625rem;
	top: calc(50% - .0625rem);
	transform: translateY(-50%);
}
section.product_main > div.product_main .product_main_cart > .form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-top: 2.5rem;
}
section.product_main > div.product_main .product_main_cart > .form .product_cart_button {
	flex: 1;
}
section.product_main > div.product_main .product_main_cart > .form .product_cart_button button {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	line-height: 4rem;
	font-size: 1rem;
	font-weight: 700;
	border-radius: 2rem;
	transition: opacity .2s;
	border: 2px solid #b0b2ad;
	position: relative;
}
section.product_main > div.product_main .product_main_cart > .form .product_cart_button button::before {
	content: '';
	display: block;
	width: 2rem;
	height: 2rem;
	margin-right: .75rem;
	background-size: contain;
	position: relative;
}
section.product_main > div.product_main .product_main_cart > .form .product_cart_button.amazon button::before {
	background-image: url("../../common/images/ec_amazon.png");
}
section.product_main > div.product_main .product_main_cart > .form .product_cart_button.rakuten button::before {
	background-image: url("../../common/images/ec_rakuten.png");
}
section.product_main > div.product_main .product_main_cart > .form .product_cart_button.yahoo button::before {
	background-image: url("../../common/images/ec_yahoo.png");
}
section.product_main > div.product_main .product_main_cart > .form .product_cart_button button:hover {
	background-color: #f8efe2;
	opacity: .75;
}
section.product_main > div.product_main .product_main_cart > .product_cautionary_note {
	margin-top: 2.5rem;
	padding: 1rem;
	line-height: 1.4;
	font-size: .875rem;
	font-weight: 700;
	background-color: #f8efe2;
	border-radius: 1rem;
}
section.product_main > div.product_main .product_main_cart > .product_cautionary_note a {
	font-size: .875rem;
	font-weight: 700;
	color: #6c8c9d;
	text-decoration: underline;
}
@media screen and (max-width: 768px) {
	section.product_main > div.product_main .product_main_cart > .product_title {
		margin-top: initial;
	}
	section.product_main > div.product_main .product_main_cart > .variant > .variant_image > div {
		width: 6rem;
	}
	section.product_main > div.product_main .product_main_cart > .variant > .variant_image .image {
		width: 6rem;
	}
	section.product_main > div.product_main .product_main_cart > form {
		margin-top: 2rem;
	}
}

/* --------- --------- --------- --------- product_main modal --------- */
section.product_main #modal {
	display: none;
	justify-content: center;
	align-items: center;
	width: 100vw;
	height: 100vh;
	background-color: #000000d0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}
section.product_main #modal .window {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 85vh;
	max-height: 1000px;
	aspect-ratio: 1 / 1;
	position: relative;
}
section.product_main #modal .window .button {
	display: block;
	width: 49px;
	height: 49px;
	background-color: #b0b2ad;
	border-radius: 50%;
	border: 3px solid #ffffff;
	position: absolute;
	top: -1.25rem;
	right: -1.25rem;
	cursor: pointer;
	opacity: background-color .2s;
}
section.product_main #modal .window .button:hover {
	background-color: #d7d8d6;
}
section.product_main #modal .window .button::before,
section.product_main #modal .window .button::after {
	content: '';
	display: block;
	width: 29px;
	height: 4px;
	background-color: #ffffff;
	border-radius: 1.5px;
	position: relative;
}
section.product_main #modal .window .button::before {
	top: calc(50% - 0px);
	left: calc(50% + 1px);
	transform: translate(-50%, -50%) rotate(-45deg);
}
section.product_main #modal .window .button::after {
	top: calc(50% - 4px);
	left: calc(50% + 1px);
	transform: translate(-50%, -50%) rotate(45deg);
}
section.product_main #modal .window img {
	width: 100%;
	object-fit: contain;
}