@charset "UTF-8";

/* =====================================
== GroupPage Common Stylesheet
===================================== */
/* 1rem -> 10px */

#GroupDetailsArea {
	max-width: 135rem;
	width: 100%;
	margin: 0 auto 10rem;
}


#GroupDetailsArea .fs-c-subgroup {
	width: 100%;
	margin-bottom: 3rem;
}

#GroupDetailsArea .fs-c-subgroup .fs-c-listControl {
	display: none;
}

#GroupDetailsArea .fs-c-subgroupList {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 1.5rem;
}

#GroupDetailsArea .fs-c-subgroupList__item {
	max-width: calc((100% - 1.5rem * 4) / 5);
	width: 100%;
	display: inline-flex;
}
@media only screen and (max-width: 1350px) {
	#GroupDetailsArea .fs-c-subgroupList__item {
		max-width: calc((100% - 1.5rem * 3) / 4);
	}
}
@media only screen and (max-width: 1000px) {
	#GroupDetailsArea .fs-c-subgroupList__item {
		max-width: calc((100% - 1.5rem * 2) / 3);
	}
}
@media only screen and (max-width: 768px) {
	#GroupDetailsArea .fs-c-subgroupList__item {
		max-width: calc((100% - 1.5rem * 1) / 2);
	}
}

#GroupDetailsArea .fs-c-subgroupList__link {
	width: 100%;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.375;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: left;
	color: var(--black);
	border: 1px solid #f0f0f0;
	padding: 2.5rem 3.5rem 2.5rem 2.5rem;
	box-sizing: border-box;
	word-break: auto-phrase;
	display: block;
	position: relative;
}
@media only screen and (max-width: 1350px) {
	#GroupDetailsArea .fs-c-subgroupList__link {
		padding: 1.5rem 2.5rem 1.5rem 1.5rem;
	}
}
@media only screen and (max-width: 768px) {
	#GroupDetailsArea .fs-c-subgroupList__link {
		font-size: 3.2vw;
		padding: 1rem 1.5rem 1rem 1rem;
	}
}

#GroupDetailsArea .fs-c-subgroupList__link::after {
	content: '';
	width: .7rem;
	height: .7rem;
	border-top: 1px solid var(--black);
	border-right: 1px solid var(--black);
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.5rem;
	display: inline-block;
	transform: rotate(45deg);
}
@media only screen and (max-width: 1350px) {
	#GroupDetailsArea .fs-c-subgroupList__link::after {
		right: 1rem;
	}
}


#GroupDetailsArea .fs-c-productList__controller {
	width: 100%;
	margin-bottom: 5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
@media only screen and (max-width: 768px) {
	#GroupDetailsArea .fs-c-productList__controller {
		flex-direction: column;
		gap: 2rem;
		justify-content: center;
	}
}

#GroupDetailsArea .fs-c-sortItems {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 2rem;
}

#GroupDetailsArea .fs-c-sortItems__label {
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: center;
	color: var(--black);
	background: #f0f0f0;
	padding: 1rem;
	box-sizing: border-box;
}

#GroupDetailsArea .fs-c-sortItems__list {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 1.5rem;
}

#GroupDetailsArea .fs-c-sortItems__list__item {
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: left;
	color: var(--paramountColorA);
}

#GroupDetailsArea .fs-c-sortItems__list__item.is-active {
	color: #aaaaaa;
}

#GroupDetailsArea .fs-c-sortItems__list__item:not(.is-active) .fs-c-sortItems__list__item__label {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: .5em;
}

#GroupDetailsArea .fs-c-listControl__status {
	font-size: 1.6rem;
	font-weight: normal;
	line-height: 1;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: right;
	color: var(--black);
}
@media only screen and (max-width: 768px) {
	#GroupDetailsArea .fs-c-listControl__status {
		text-align: center;
	}
}

#GroupDetailsArea .fs-c-listControl__status__total {
	font-size: 118.75%;
	font-weight: bold;
}

#GroupDetailsArea .fs-c-listControl__status__total__label {
	font-size: 1.6rem;
	font-weight: normal;
}


#GroupDetailsArea .fs-c-productList__list {
	margin-bottom: 5rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 3rem;
}

#GroupDetailsArea .fs-c-productList__list__item {
	max-width: calc((100% - 3rem * 3) / 4);
	width: 100%;
}
@media only screen and (max-width: 1350px) {
	#GroupDetailsArea .fs-c-productList__list__item {
		max-width: calc((100% - 3rem * 2) / 3);
	}
}
@media only screen and (max-width: 768px) {
	#GroupDetailsArea .fs-c-productList__list__item {
		max-width: calc((100% - 3rem * 1) / 2);
	}
}

#GroupDetailsArea .fs-c-productListItem__imageContainer {
	margin-bottom: 2rem;
	aspect-ratio: 1;
}

#GroupDetailsArea .fs-c-productListItem__imageContainer .fs-c-productListItem__image a{
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio: 1;
}

#GroupDetailsArea .fs-c-productListItem__viewMoreImageButton  {
	display: none;
}

#GroupDetailsArea .fs-c-productName {
	min-height: calc(1.4rem * 1.625 * 4);
	font-size: 1.4rem;
	font-weight: normal;
	line-height: 1.625;
	letter-spacing: calc(40 / 1000 * 1em);
	text-align: left;
	color: var(--black);
	margin-bottom: 2rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
	overflow: hidden;
}

#GroupDetailsArea .fs-c-productName a {
	color: inherit;
}

#GroupDetailsArea .fs-c-productName__copy {
	display: none;
}

#GroupDetailsArea .fs-c-productPrices {
	margin-bottom: 2rem;
}

#GroupDetailsArea .fs-c-productPrice {
	display: flex;
	align-items: center;
	justify-content: end;
}

#GroupDetailsArea .fs-c-productPrice__main {
	display: flex;
	align-items: baseline;
	gap: 1.5rem;
}
@media only screen and (max-width: 768px) {
	#GroupDetailsArea .fs-c-productPrice__main {
		gap: 1rem;
	}
}

#GroupDetailsArea .fs-c-productPrice__main__label {
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: right;
	color: var(--black);
}

#GroupDetailsArea .fs-c-price {
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: right;
	color: var(--priceColor);
}

#GroupDetailsArea .fs-c-price__value {
	color: inherit;
}

#GroupDetailsArea .fs-c-productPrice__addon {
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: right;
	color: var(--priceColor);
	margin-left: .5rem;
	display: inline-block;
}

#GroupDetailsArea .fs-c-productListItem__outOfStock {
	font-size: 1.4rem;
	height: 4.5rem;
	font-weight: 500;
	line-height: 4.5rem;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: center;
	color: #aaaaaa;
	background: #f0f0f0;
	margin-bottom: 2rem;
	box-sizing: border-box;
}


#GroupDetailsArea .fs-c-productListItem__control {
	display: flex;
	justify-content: space-between;
	gap: 1.5rem;
}

#GroupDetailsArea .fs-c-button--plain {
	max-width: calc(100% - 1.5rem - 4.5rem);
}

#GroupDetailsArea .fs-c-button--particular {
	max-width: 4.5rem;
}

#GroupDetailsArea .fs-c-productListItem__control > * {
	width: 100%;
	height: 4.5rem;
	line-height: 1;
	letter-spacing: calc(0 / 1000* 1em);
	text-align: center;
	border: 1px solid;
	padding: 0 1rem;
	box-sizing: border-box;
}

#GroupDetailsArea .fs-c-productListItem__control > *::before {
	display: inline-block;
	width: auto;
	height: auto;
	border: inherit;
	border-width: 0;
	transform: none;
	transition: inherit;
}

#GroupDetailsArea .fs-c-button--addToCart--list {
	font-size: 1.4rem;
	font-weight: bold;
	color: var(--white);
	background: var(--buttonColor);
	border-color: var(--buttonColor);
}

#GroupDetailsArea .fs-c-button--addToCart--list::before {
	content: url(https://paramount.itembox.design/item/images/common/icon_cart.png);
	vertical-align: sub;
}

#GroupDetailsArea .fs-c-button--particular {
	font-size: 1.3rem;
	font-weight: 500;
	color: #8c8c8c;
	background: var(--white);
	border-color: #8c8c8c;
	display: flex;
	align-items: center;
	justify-content: center;
}

#GroupDetailsArea .fs-c-button--particular::before {
	content: url(https://paramount.itembox.design/item/images/common/icon_wish.png);
	transform: translateY(12%);
}

#GroupDetailsArea .fs-c-button--particular.fs-c-button--removeFromWishList--icon {
	color: var(--white);
	background: forestgreen;
	border-color: forestgreen;
}

#GroupDetailsArea .fs-c-button--particular.fs-c-button--removeFromWishList--icon::before {
	filter: brightness(2555);
}

#GroupDetailsArea .fs-c-button--particular .fs-c-button__label {
	font-size: 0;
}

#GroupDetailsArea .fs-c-button--viewProductDetail {
	font-size: 1.3rem;
	font-weight: 500;
	color: var(--white);
	background: var(--paramountColorA);
	border-color: var(--paramountColorA);
	display: flex;
	align-items: center;
	justify-content: center;
}

#GroupDetailsArea .fs-c-pagination {
	gap: .5rem;
}

#GroupDetailsArea .fs-c-pagination__item {
	flex: 0 1 auto;
}

#GroupDetailsArea .fs-c-pagination__item:not(span):not(.fs-c-pagination__item--next):not(.fs-c-pagination__item--prev) {
	width: 3rem;
	height: 3rem;
	color: var(--black);
	border: 1px solid #f7f7f7;
	padding: 0;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}

#GroupDetailsArea .__groupTitle {
	font-size: 2.2rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: calc(0 / 1000 * 1em);
	text-align: left;
	color: var(--black);
	padding: 0 0 1em;
	border-bottom: 1px solid var(--paramountColorK);
	box-sizing: border-box;
	margin-bottom: 3rem;
}