@charset 'UTF-8';

/*----------------------------------------

	+ block-brand-bnr-list
		- brand-handled
		- tab
		- recommend

-----------------------------------------*/

/*----------------------------------------
	block-brand-bnr-list
-----------------------------------------*/

.block-brand-bnr-list {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	color: #2b2b2b;
}

.block-brand-bnr-list .brand-handled .pc-only,
.block-brand-bnr-list .tab .pc-only {
	display: block !important;
}

.block-brand-bnr-list .brand-handled .sp-only,
.block-brand-bnr-list .tab .sp-only {
	display: none !important;
}

@media screen and (max-width: 780px) {
	.block-brand-bnr-list .brand-handled .pc-only,
	.block-brand-bnr-list .tab .pc-only {
		display: none !important;
	}

	.block-brand-bnr-list .brand-handled .sp-only,
	.block-brand-bnr-list .tab .sp-only {
		display: block !important;
	}
}

/*----------------------------------------
	brand-handled
-----------------------------------------*/

.block-brand-bnr-list .brand-handled {
	padding-bottom: 78px;
	background: linear-gradient(180deg, #F5EBEF 23%, #FAF8EB 100%);
}

/* 終了テキスト */
.block-brand-bnr-list .brand-handled .endtxt {
	padding-top: 40px;
}

.block-brand-bnr-list .brand-handled .endtxt p {
	color: #E9212C;
	font-weight: bold;
	font-size: 1.8rem;
	letter-spacing: 0;
	line-height: 1.33;
	border: 3px solid #E9212C;
	padding: 11px;
	text-align: center;
	width: 780px;
	margin-inline: auto;
}

/* ボタン共通 */
.block-brand-bnr-list .brand-handled .list-btn {
	width: 480px;
	margin-inline: auto;
	padding-top: 60px;
}

/* 全商品一覧をチェック（上に終了メッセージあり） */
.block-brand-bnr-list .brand-handled .endtxt + .list-btn {
	padding-top: 30px;
}

/* 全商品一覧をチェック */
.block-brand-bnr-list .brand-handled > .list-btn:first-of-type {
	padding-top: 40px;
}

.block-brand-bnr-list .brand-handled .list-btn a {
	transition: 0.3s;
}

.block-brand-bnr-list .brand-handled .list-btn a:hover {
	opacity: 0.5;
}

/* スケジュール一覧 */
.block-brand-bnr-list .brand-handled .schedule {
	width: 960px;
	margin-inline: auto;
}

/* スケジュール一覧（福袋・新年） */
.block-brand-bnr-list .brand-handled .schedule.accordion {
	padding-top: 40px;
}

.block-brand-bnr-list .brand-handled .endtxt + .schedule.accordion {
	padding-top: 30px;
}

/* スケジュール一覧 タイトル */
.block-brand-bnr-list .brand-handled .schedule .ttl {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #344F59;
	font-weight: bold;
	font-size: 3rem;
	letter-spacing: 0;
	line-height: 1.33;
	background-color: #E7C762;
	border-radius: 16px;
	padding: 30px;
	gap: 12px;
	margin-top: 70px;
}

/* スケジュール一覧 タイトル（福袋・新年） */
.block-brand-bnr-list .brand-handled .schedule.accordion .ttl {
	margin-top: 30px;
}

.block-brand-bnr-list .brand-handled .schedule .ttl::before {
	content: "";
	display: block;
	width: 31px;
	height: 28px;
	background: url(/img/usr/shop/e/esfukunew/mo/2026/ic_schedule.png) no-repeat center center;
	background-size: contain;
	transform: translateY(0.075em);
}

/* 全商品ページ */
.block-brand-bnr-list .brand-handled :not(.accordion) .fukubag {
	padding-top: 30px;
}

.block-brand-bnr-list .brand-handled :not(.accordion) .newyear {
	padding-top: 100px;
}

.block-brand-bnr-list .brand-handled > div dl {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
	margin-top: 60px;
}

.block-brand-bnr-list .brand-handled > div dl:nth-of-type(1) {
	margin-top: 50px;
}

.block-brand-bnr-list .brand-handled > div dl dt {
	width: 100%;
	margin-bottom: 22px;
	padding-bottom: 10px;
	border-bottom: 2px solid #E9212C;
	font-size: 2rem;
	font-weight: bold;
	letter-spacing: 0;
	line-height: 1.33;
	display: flex;
	flex-wrap: wrap;
	gap: 33px;
	grid-column: 1/-1;
}

/* ニューイヤーキット */
.block-brand-bnr-list .brand-handled .newyear dl dt {
	border-bottom-color: #E27B28;
}

.block-brand-bnr-list .brand-handled > div dl dt span {
	display: inline-block;
	border-radius: 8px;
	font-weight: 700;
	font-size: 1.5rem;
	line-height: 1;
	padding: 6px 14px;
}

/* すぐにお届け */
.block-brand-bnr-list .brand-handled > div dl dt span.soon {
	color: #fff;
	background-color: #E9212C;
}

/* 以降配送 */
.block-brand-bnr-list .brand-handled > div dl dt span:not(.soon) {
	color: #2B2B2B;
	background-color: #E7C762;
}

.block-brand-bnr-list .brand-handled > div dl dd a {
	width: 100%;
	height: 92px;
	border-radius: 5px;
	background-color: #fff;
	transition: none;
}

.block-brand-bnr-list .brand-handled > div dl dd a:hover {
	opacity: 1;
}

.block-brand-bnr-list .brand-handled > div dl dd a span {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	border-radius: 5px;
	border: 1px solid #E7C762;
	background-color: #fff;
	transition: 0.3s;
}

.block-brand-bnr-list .brand-handled > div dl dd a span:hover {
	opacity: 0.5;
}

.block-brand-bnr-list .brand-handled > div dl dd a span img {
	width: 200px;
	height: 80px;
}

/* locked */
.block-brand-bnr-list .brand-handled > div dl dd.locked a {
	pointer-events: none;
	user-select: none;
}

/* ご注文に関するご案内 */
.block-brand-bnr-list .brand-handled > .order-info {
	width: 960px;
	margin: 80px auto 0;
}

.block-brand-bnr-list .brand-handled > .order-info dt {
	margin-bottom: 24px;
	font-size: 1.6rem;
	letter-spacing: 0;
	line-height: 1.66;
	font-weight: bold;
	text-align: center;
}

.block-brand-bnr-list .brand-handled > .order-info dd {
	font-size: 1.4rem;
	letter-spacing: 0;
	line-height: 1.66;
	text-indent: -1em;
	padding-left: 1em;
}

.block-brand-bnr-list .brand-handled > .order-info dd::before {
	content: "※";
}

@media screen and (max-width: 780px) {
	.block-brand-bnr-list .brand-handled {
		padding-bottom: 10.25vw;
	}

	/* 終了テキスト */
	.block-brand-bnr-list .brand-handled .endtxt {
		padding-top: 5vw;
		width: 100%;
	}

	.block-brand-bnr-list .brand-handled .endtxt p {
		font-size: 4vw;
		line-height: 1.66;
		border: 0.75vw solid #E9212C;
		padding: 1.5vw;
		width: 92.7vw;
	}

	/* ボタン共通 */
	.block-brand-bnr-list .brand-handled .list-btn {
		width: 80vw;
		padding-top: 7.4vw;
	}

	/* 全商品一覧をチェック（上に終了メッセージあり） */
	.block-brand-bnr-list .brand-handled .endtxt + .list-btn {
		padding-top: 5vw;
	}

	/* 全商品一覧をチェック */
	.block-brand-bnr-list .brand-handled .list-btn:first-of-type {
		padding-top: 5.12vw;
	}

	.block-brand-bnr-list .brand-handled .list-btn a {
		transition: none;
	}

	.block-brand-bnr-list .brand-handled .list-btn a:hover {
		opacity: 1;
	}

	/* スケジュール一覧 */
	.block-brand-bnr-list .brand-handled .schedule {
		width: 88vw;
	}

	/* スケジュール一覧（福袋・新年） */
	.block-brand-bnr-list .brand-handled .schedule.accordion {
		padding-top: 5vw !important;
	}

	/* スケジュール一覧 タイトル */
	.block-brand-bnr-list .brand-handled .schedule .ttl {
		border-radius: 2vw;
		font-size: 4vw;
		padding: 2.6vw;
		gap: 1.5vw;
		margin-top: 10vw;
	}

	/* スケジュール一覧 タイトル（福袋・新年） */
	.block-brand-bnr-list .brand-handled .schedule.accordion .ttl {
		margin-top: 4vw;
	}

	.block-brand-bnr-list .brand-handled .schedule .ttl::before {
		width: 5.5vw;
		height: 4.75vw;
	}

	/* 福袋（福袋・新年） */
	.block-brand-bnr-list .brand-handled .fukubag {
		padding-top: 0;
	}

	.block-brand-bnr-list .brand-handled :not(.accordion) .fukubag {
		padding-top: 4vw;
	}

	/* ニューイヤーキット（福袋・新年） */
	.block-brand-bnr-list .brand-handled .newyear {
		padding-top: 0;
	}

	.block-brand-bnr-list .brand-handled .fukubag + .newyear {
		padding-top: 15vw;
	}

	.block-brand-bnr-list .brand-handled > div dl {
		grid-template-columns: repeat(2, 1fr);
		gap: 2.4vw;
		margin-top: 8.05vw;
	}

	.block-brand-bnr-list .brand-handled > div dl:nth-of-type(1) {
		margin-top: 6.6vw;
	}

	.block-brand-bnr-list .brand-handled > div dl dt {
		margin-bottom: 3.85vw;
		padding-bottom: 2.39vw;
		border-bottom: 0.51vw solid #E9212C;
		font-size: 4.5vw;
		gap: 2.1vw;
	}

	.block-brand-bnr-list .brand-handled > div dl dt span {
		font-size: 3.25vw;
		padding: 1.3vw 2vw;
		border-radius: 1vw;
	}

	.block-brand-bnr-list .brand-handled > div dl dd a {
		height: 16.66vw;
		border-radius: 1.25vw;
	}

	.block-brand-bnr-list .brand-handled > div dl dd a span {
		border-radius: 1.25vw;
		transition: none;
	}

	.block-brand-bnr-list .brand-handled > div dl dd a span:hover {
		opacity: 1;
	}

	.block-brand-bnr-list .brand-handled > div dl dd a span img {
		width: 36.41vw;
		height: 14.61vw;
	}

	.block-brand-bnr-list .brand-handled > div dl dd p {
		margin-top: 0.89vw;
		font-size: 3.07vw;
	}

	/* ご注文に関するご案内 */
	.block-brand-bnr-list .brand-handled > .order-info {
		width: 88vw;
		margin-top: 10.25vw;
	}

	.block-brand-bnr-list .brand-handled > .order-info dt {
		margin-bottom: 2.3vw;
		font-size: 3.5vw;
	}

	.block-brand-bnr-list .brand-handled > .order-info dd {
		font-size: 3vw;
	}
}

/*----------------------------------------
	accordion
-----------------------------------------*/
.accordion .accordionWrap {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .5s;
}

.accordion.is-active .accordionWrap {
	grid-template-rows: 1fr;
}

.accordion .accordionBox {
	overflow: hidden;
}

.accordion .accordionBtn {
	width: 100%;
	border: 0;
	position: relative;
	cursor: pointer;
	transition: .3s;
}

.accordion.is-active .accordionBtn {
	background-color: #FFFFFF !important;
}

@media (hover: hover) {
	.accordion .accordionBtn:hover {
		opacity: .5;
	}
}
.accordion .accordionBtn::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 32px;
	transform: translateY(-50%);
	display: block;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #E9212C url(/img/usr/shop/e/esfukunew/mo/2026/ic_open.png) no-repeat center center;
	background-size: cover;
}

/* 新年 */
.accordion:has(.newyear) .accordionBtn::after {
	background-color: #E27B28;
}

.accordion.is-active .accordionBtn::after {
	background-image: url(/img/usr/shop/e/esfukunew/mo/2026/ic_close.png);
}

@media screen and (max-width: 780px) {
	.accordion .accordionBtn {
		display: block;
		padding-inline-end: 7.6vw !important;
	}

	.accordion .accordionBtn::after {
		right: 3vw;
		width: 4.5vw;
		height: 4.5vw;
	}
}

/*----------------------------------------
	tab
-----------------------------------------*/

.block-brand-bnr-list ul.tab {
	display: grid;
	grid-template-columns: repeat(3, auto);
	grid-template-rows: auto;
	grid-column-gap: 1px;
	margin: 50px auto 0;
}

.block-brand-bnr-list ul.tab li {
	transition: 0.3s;
}

.block-brand-bnr-list ul.tab li + li {
	margin-top: 0;
}

.block-brand-bnr-list ul.tab li a:hover {
	opacity: 0.5;
}

@media screen and (max-width: 780px) {
	.block-brand-bnr-list ul.tab {
		grid-column-gap: 0.38vw;
		width: min(100%, 780px);
		margin-block: 6.41vw 5.12vw;
	}

	.block-brand-bnr-list ul.tab li {
		transition: none;
	}

	.block-brand-bnr-list ul.tab li a:hover {
		opacity: 1;
	}
}

/*----------------------------------------
	recommend
-----------------------------------------*/

.block-brand-bnr-list dl.recommend {
	display: grid;
	justify-items: center;
	grid-row-gap: 26px;
	margin-top: 96px;
}

.block-brand-bnr-list dl.recommend dt {
	display: grid;
	grid-template-columns: repeat(3, auto);
	grid-template-rows: auto;
	align-items: center;
}

.block-brand-bnr-list dl.recommend dt::before {
	grid-area: 1 / 1 / 2 / 2;
	content: '';
	width: 2px;
	height: 30px;
	margin-top: 2px;
	margin-right: 38px;
	background-color: #2b2b2b;
	transform: rotate(-32deg);
}

.block-brand-bnr-list dl.recommend dt::after {
	grid-area: 1 / 3 / 2 / 4;
	content: '';
	width: 2px;
	height: 30px;
	margin-top: 2px;
	margin-left: 38px;
	background-color: #2b2b2b;
	transform: rotate(32deg);
}

.block-brand-bnr-list dl.recommend dt span {
	grid-area: 1 / 2 / 2 / 3;
	font-size: 3rem;
	font-weight: bold;
	letter-spacing: 0;
	text-align: center;
}

.block-brand-bnr-list dl.recommend dt span br {
	display: none;
}

.block-brand-bnr-list dl.recommend dd a {
	display: block;
	transition: 0.3s;
}

.block-brand-bnr-list dl.recommend dd a:hover {
	opacity: 0.5;
}

@media screen and (max-width: 780px) {
	.block-brand-bnr-list dl.recommend {
		grid-row-gap: 3.59vw;
		margin-top: 15vw;
	}

	.block-brand-bnr-list dl.recommend dt::before {
		width: 0.25vw;
		height: 12vw;
		margin-top: 0.25vw;
		margin-right: 6.91vw;
	}

	.block-brand-bnr-list dl.recommend dt::after {
		width: 0.25vw;
		height: 12vw;
		margin-top: 0.25vw;
		margin-left: 7.91vw;
	}

	.block-brand-bnr-list dl.recommend dt span {
		font-size: 4.5vw;
		line-height: 1.33;
		letter-spacing: 0;
	}

	.block-brand-bnr-list dl.recommend dt span br {
		display: block;
	}

	.block-brand-bnr-list dl.recommend dd {
		width: 80.76vw;
	}

	.block-brand-bnr-list dl.recommend dd a {
		transition: none;
	}

	.block-brand-bnr-list dl.recommend dd a:hover {
		opacity: 1;
	}
}