@charset "utf-8";
/* 2026 119号 抹茶フェア */
:where(.lp-daichi) {
	--push-title: #558011;
	--point-sum: #85070c;
	--point-reserve: #c1272d;
	--point-gap: 2px;
	--cv-btn-reserve-color: #000;
	--cv-btn-shadow: #00000024;
	--font-shippori: 'Shippori Mincho B1', serif;

	/* https://min-max-calculator.9elements.com/ */
	/* 480px-960px幅 */
	--minM15max0: clamp(-0.938rem, -1.875rem + 3.13vw, 0rem);
	--min0max10: clamp(0rem, -0.622rem + 2.08vw, 0.625rem);
	--min0max20: clamp(0rem, -1.245rem + 4.16vw, 1.25rem);
	--min0max25: clamp(0rem, -1.563rem + 5.21vw, 1.563rem);
	--min3max4: clamp(0.188rem, 0.125rem + 0.21vw, 0.25rem);
	--min4max5: clamp(0.25rem, 0.188rem + 0.21vw, 0.313rem);
	--min5max10: clamp(0.313rem, 0.001rem + 1.04vw, 0.625rem);
	--min7max10: clamp(0.438rem, 0.25rem + 0.63vw, 0.625rem);
	--min8max10: clamp(0.5rem, 0.376rem + 0.42vw, 0.625rem);
	--min10max15: clamp(0.625rem, 0.314rem + 1.04vw, 0.938rem);
	--min12max13: clamp(0.75rem, 0.688rem + 0.21vw, 0.813rem);
	--min13max14: clamp(0.813rem, 0.75rem + 0.21vw, 0.875rem);
	--min13max15: clamp(0.813rem, 0.688rem + 0.42vw, 0.938rem);
	--min15max24: clamp(0.938rem, 0.375rem + 1.88vw, 1.5rem);
	--min17max20: clamp(1.063rem, 0.875rem + 0.63vw, 1.25rem);
	--min17max22: clamp(1.063rem, 0.75rem + 1.04vw, 1.375rem);
	--min18max20: clamp(1.125rem, 1rem + 0.42vw, 1.25rem);
	--min18max21: clamp(1.125rem, 0.938rem + 0.62vw, 1.313rem);
	--min18max22: clamp(1.125rem, 0.875rem + 0.83vw, 1.375rem);
	/* --min18max24: clamp(1.125rem, 0.752rem + 1.25vw, 1.5rem); */
	--min18max25: clamp(1.125rem, 0.688rem + 1.46vw, 1.563rem);
	--min20max25: clamp(1.25rem, 0.938rem + 1.04vw, 1.563rem);
	--min20max30: clamp(1.25rem, 0.625rem + 2.08vw, 1.875rem);
	--min23max27: clamp(1.438rem, 1.188rem + 0.83vw, 1.688rem);
	--min30max45: clamp(1.875rem, 0.938rem + 3.13vw, 2.813rem);
	--min30max50: clamp(1.875rem, 0.625rem + 4.17vw, 3.125rem);
	--min32max45: clamp(2rem, 1.188rem + 2.71vw, 2.813rem);
}

.lp-daichi.-matcha {
	background: url(/external/category/image/2026/matcha/matcha_bg.jpg);
	background-size: 100%;
}
.contents-area.-matcha {
	padding: 0 var(--min15max20) var(--min30max40);
}

.lead-area > .text {
	background: url(/external/category/image/2026/matcha/lead_bg.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto 100%;
	max-width: 868px;
	box-sizing: border-box;
	margin: var(--min0max25) auto 0;
	padding: var(--min20max33) var(--min15max20);
	font-size: var(--min15max20);
	letter-spacing: .03em;
	line-height: 1.5;
	text-align: center;
	color: #151515;
}

.area-head:not(:has(img)) {
	font-size: var(--min32max45);
	line-height: 1.2;
	text-align: center;
	font-family: var(--font-shippori);
}
:is(.area-head,.area-title) .sub {
	font-size: 66.6548%;
	display: block;
}
.area-head .uBar {
	display: block;
	width: min(305px, 60%);
	margin-inline: auto;
	padding-bottom: var(--min7max10);
	border-bottom: 2px solid;
}
.sizzle-area {
	color: #151515;
	margin-top: var(--min30max40);
}
.sizzle-textArea {
	margin-top: var(--min20max30);
	padding: 0 var(--min15max30) var(--min15max30);
	background: rgba(255,255,255,0.6);
}
.block-grid.-sizzle {
	padding-top: var(--min15max30);
	align-items: center;
}
.block-grid.-flex.-reverse {
	flex-direction: row-reverse;
}
.block-grid.-sizzle > :is([class*="textwrap"], .text) {
	width: calc(50% - var(--min0max20));
	margin-inline: var(--min0max20) var(--min0max10);
	font-size: var(--min17max20);
	line-height: 1.65;
	/* padding-inline: calc(-1 * var(--minM15max0)); */
	box-sizing: border-box;
}
.block-grid.-sizzle.-reverse > :is([class*="textwrap"], .text) {
	margin-inline: var(--min0max10) var(--min0max20);
}
.sizzle-textwrap .title {
	margin-top: calc(-1 * var(--minM15max0));
	font-family: var(--font-shippori);
	font-size: var(--min23max27);
	line-height: 1.25;
	letter-spacing: -.01em;
}
.sizzle-textwrap .text {
	display: block;
	margin-top: var(--min10max13);
	line-height: 1.5;
}

.cv-area {
	margin-top: var(--min15max20);
}
.sizzle-area + .catch.-bg {
	margin-top: var(--min30max40);
}
.contents-area .catch.-long {
	font-size: var(--min17max22);
}
.block-grid.-catch > .grid:nth-child(n+3) {
	margin-top: var(--min30max40);
}
.text.-push + .cv-btn {
	margin-top: 8px;
}
.push-wrap .textwrap {
	margin-top: var(--min10max15);
}
.block-grid.-col2.-push .push-wrap .textwrap {
	margin-left: var(--min10max20);
}
.push-wrap .title {
	display: block;
	padding: 0;
	font-size: var(--min18max25);
	text-align: left;
	color: var(--push-title);
}
.push-wrap .text {
	margin-top: var(--min10max15);
	font-size: var(--min15max20);
}
:is(.block-grid.-col1.-item .specwrap .detail,.dialog-opener) + .cv-btn {
	margin-top: 15px;
}
.cv-btn .js-item-sales.-cart6 .item-summary .info:has(.point) .brand-name {
	margin-top: var(--min8max10);
}

.point-unit {
	position: relative;
	display: flex;
	margin-left: auto;
	justify-content: right;
	line-height: .9;
	align-items: center;
}
.point-unit .pointwrap {
	width: 100%;
	font-size: var(--min18max20);
	display: grid;
	grid-template-columns: 50% 1fr;
	justify-content: flex-end;
}
.point-unit .pointwrap {
	width: min(380px, 100%);
}
.cv-btn .js-item-sales.-cart6 .item-summary > .info > .point, .point-unit .sum {
	background: var(--point-sum);
	color: #fff;
	font-weight: bold;
	text-align: right;
	padding-block: 5px 2px;
	padding-inline: var(--min5max10);
	box-sizing: border-box;
	line-height: 1;
	height: 100%;
}
.point-unit .sum::before {
	content: "合計";
	display: inline-block;
	font-size: var(--min12max13);
	font-weight: 100;
	transform: translateY(-1px);
	margin-right: var(--point-gap);
}
.cv-btn .js-item-sales.-cart6 .item-summary > .info > .point > .unit, .point-unit .sum::after {
	content: "ポイント";
	display: inline-block;
	font-size: var(--min12max13);
	font-weight: 100;
	margin-left: var(--point-gap);
}
.point-unit :is(.reserve,.set,.saleSetPoint) {
	background: var(--point-reserve);
	color: #fff;
	font-weight: bold;
	text-align: right;
	padding-block: 5px 2px;
	padding-inline: var(--min5max10);
	box-sizing: border-box;
	line-height: 1;
}
.point-unit :is(.reserve,.set,.saleSetPoint)::before {
	display: inline-block;
	font-size: var(--min12max13);
	font-weight: 100;
	margin-right: var(--point-gap);
	transform: translateY(-1px);
}
.point-unit .reserve::before {
	content: "うち予約特典";
}
.point-unit :is(.reserve,.set)::after {
	content: "ポイント";
	display: inline-block;
	font-size: var(--min12max13);
	font-weight: 100;
	margin-left: var(--point-gap);
}

.cv-btn > .js-item-sales > .item-summary > .info > .price ~ .cart {
	margin-top: 8px;
	width: min(340px, 100%);
	margin-right: auto;
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart .button, .js-item-sales .item-summary .info .cart p.routine-only > a {
	border-radius: 10px;
	box-shadow: 4px var(--min4max5) var(--cv-btn-shadow);
	padding: 12px 17px 12px 12px;
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart .button:hover, .js-item-sales .item-summary .info .cart p.routine-only > a:hover {
	box-shadow: 3px 3px var(--cv-btn-shadow);
	transform: translate(1px, 2px);
}
.cv-btn[class*="deli"] > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart .button span {
	gap: 6px;
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart:not(:has(:disabled)) .button span {
	background-image: none;
	padding: 0;
	font-size: var(--min18max21);
	line-height: 1;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart:not(:has(:disabled)) .button:not(.button-cart)::after {
	background: var(--cv-btn-reserve-color);
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart .button:not(.button-cart)::after {
	content: "";
	display: inline-block;
	width: var(--min13max15);
	aspect-ratio: 3 / 4;
	mask: url(external/category/image/common/icon/icon_arrow_R.svg) no-repeat;
	-webkit-mask: url(external/category/image/common/icon/icon_arrow_R.svg) no-repeat;
	mask-size: contain;
	-webkit-mask-size: contain;
	position: absolute;
	right: 4%;
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart:not(:has(:disabled)) .button span::before {
	content: "5/18週お届け" !important;
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart:not(:has(:disabled)) .button span::before {
	font-size: var(--min13max14);
	background-color: #fff;
	border-radius: 30px;
	height: var(--min18max22);
	display: grid;
	align-items: center;
	padding-inline: 8px;
	box-sizing: border-box;
	line-height: var(--min20max25);
}
.cv-btn > .js-item-sales > .item-summary > .info > .cart > .add-to-cart > .add-to-cart .button span::before {
	background-image: none;
	position: unset;
	width: auto;
	height: auto;
	transform: none;
}
.cv-btn.-sale:has(.saleSetPoint) .js-item-sales.-cart6 .item-summary > .info > .point, .cv-btn .js-item-sales.-cart6 .item-summary > .info > .point, .cv-btn .js-item-sales.-cart6 .item-summary > .info > .special-note {
	display: none;
}

@media (max-width: 480px) {
	.lp-daichi.-matcha {
    background-position-y: -0.4%;
	}
	.lead-area > .text {
		letter-spacing: 0;
	}
	.block-grid.-col2.-push .push-wrap .textwrap {
		margin-left: 0;
	}
	.block-grid.-sizzle > :is([class*="textwrap"], .text) {
		width: 100%;
	}
}