@charset "utf-8";
/* 2025 短角牛 */
.lp-daichi {

	/* common */
	--color-base: #000;
	--color-key: #b80e0e;
	--color-mark: #b81b30;
	--bg-beige: #fff8e9;
	--color-cv: #e2c629;
	--cv-shadow: #8b7705;

	/* https://min-max-calculator.9elements.com/ */
	/* 480px-960px幅 */

	--min3max6: clamp(0.188rem, 0.63vw, 0.375rem);
	--min5max10: clamp(0.313rem, 1.04vw, 0.625rem);
	--min8max10: clamp(0.5rem, 0.375rem + 0.42vw, 0.625rem);
	--min9max14: clamp(0.563rem, 0.25rem + 1.04vw, 0.875rem);
	--min12max20: clamp(0.75rem, 0.25rem + 1.67vw, 1.25rem);
	--min12max33: clamp(0.75rem, -0.563rem + 4.38vw, 2.063rem);
	--min12max40: clamp(0.75rem, -1rem + 5.83vw, 2.5rem);
	--min15max18: clamp(0.938rem, 0.75rem + 0.63vw, 1.125rem);
	--min15max20: clamp(0.938rem, 0.625rem + 1.04vw, 1.25rem);
	--min15max25: clamp(0.938rem, 0.313rem + 2.08vw, 1.563rem);
	--min15max30: clamp(0.938rem, 3.13vw, 1.875rem);
	--min16max18: clamp(1rem, 0.875rem + 0.42vw, 1.125rem);
	--min17max20: clamp(1.063rem, 0.875rem + 0.63vw, 1.25rem);
	--min17max23: clamp(1.063rem, 0.688rem + 1.25vw, 1.438rem);
	--min17max60: clamp(1.063rem, -1.625rem + 8.96vw, 3.75rem);
	--min18max20: clamp(1.125rem, 1rem + 0.42vw, 1.25rem);
	--min18max23: clamp(1.125rem, 0.781rem + 1.15vw, 1.469rem);
	--min20max22: clamp(1.25rem, 1.125rem + 0.42vw, 1.375rem);
	--min20max30: clamp(1.25rem, 0.625rem + 2.08vw, 1.875rem);
	--min20max40: clamp(1.25rem, 4.17vw, 2.5rem);
	--min23max27: clamp(1.438rem, 1.188rem + 0.83vw, 1.688rem);
	--min25max30: clamp(1.563rem, 1.25rem + 1.04vw, 1.875rem);
	--min25max35: clamp(1.563rem, 0.938rem + 2.08vw, 2.188rem);
	--min25max40: clamp(1.563rem, 0.625rem + 3.13vw, 2.5rem);
	--min25max50: clamp(1.563rem, 5.21vw, 3.125rem);
	--min30max35: clamp(1.875rem, 1.563rem + 1.04vw, 2.188rem);
	--min30max45: clamp(1.875rem, 0.938rem + 3.13vw, 2.813rem);
	--min45max58: clamp(2.813rem, 2rem + 2.71vw, 3.625rem);
	--min95max152: clamp(5.938rem, 2.375rem + 11.88vw, 9.5rem);
	--min130max197: clamp(8.125rem, 3.938rem + 13.96vw, 12.313rem);
	--min168max336: clamp(10.5rem, 35vw, 21rem);
	--min247max427: clamp(15.438rem, 4.188rem + 37.5vw, 26.688rem);
	--min250max500: clamp(15.625rem, 52.08vw, 31.25rem);
	--min286max572: clamp(17.875rem, 59.58vw, 35.75rem);

}

:where([class]).-bgBlack {
  background: url(/external/category/image/2025/tankakugyu/135/bg_black.jpg) no-repeat;
	background-size: cover;
}
:where([class]).-bgBeige {
	background: var(--bg-beige);
}
:where([class]).-bgGreen {
	background: url(/external/category/image/2025/tankakugyu/common/bg_chart.png) no-repeat;
	background-size: cover;
}
:where([class]).-bgVoice {
	background: url(/external/category/image/2025/tankakugyu/135/bg_voice.jpg) no-repeat;
	background-size: cover;
}
:where([class]).-minchou {
	font-family: var(--font-minchou);
}

.area-head {
	display: block;
	margin-inline: auto;
}
.area-head.-lead {
	width: var(--min286max572);
}
.area-head.-schedule {
	width: var(--min250max500);
}
.area-head.-parts {
	width: var(--min168max336);
}
.area-head.-voice {
	width: var(--min247max427);
}

/* lead */
.area-head.-lead {
	margin-top: var(--min25max40);
}
.lead-area > .image {
	display: block;
	margin-top: var(--min15max30);
}

/* secret */
.secret-area {
	padding: var(--min25max40) var(--min12max40);
}
.block-grid.-secret {
	grid-template-columns: 44.7% auto;
	gap: 10%;
}
.secret-title,
.secret-text,
.text-wrap.-graph > .title {
	color: #fff;
}
.secret-title {
	font-size: var(--min25max35);
}
.secret-title.-second {
	margin-top: var(--min30max35);
}
.secret-title > .sub{
	display: block;
	width: var(--min130max197);
}
.secret-text {
	margin-top: var(--min8max10);
	font-size: var(--min15max18);
	font-weight: bold;
}
.secret-graph {
	margin-top: var(--min15max25);
	padding: var(--min20max40) var(--min17max60) var(--min17max20);
	border-radius: var(--min5max10);
}
.block-grid.-graph {
	max-width: 620px;
	margin-inline: auto;
	grid-template-columns: 47% auto;
}
.block-grid.-graph:not(:first-of-type) {
	margin-top: 23px;
}
.text-wrap.-graph > .title {
	display: inline-block;
	background: var(--color-mark);
	padding: 1.8% 6.7% .5%;
	border-radius: 50px;
	font-size: var(--min17max23);
	line-height: 1;
	letter-spacing: .025em;
}
.text-wrap.-graph > .text {
	margin-top: var(--min8max10);
	font-size: var(--min15max20);
	letter-spacing: .05em;
}
.secret-graph > .note {
	margin-top: 15px;
	font-size: var(--min9max14);
}

/* schedule */
.schedule-area {
	padding: var(--min25max40) var(--min12max33) 0;
}
.block-grid.-schedule {
	margin-top: var(--min25max40);
	background: #fff;
}
.text-wrap.-schedule {
	display: grid;
	grid-template-rows: auto auto auto auto 1fr;
	padding: var(--min15max25);
	font-weight: bold;
}
.text-wrap.-schedule > .title {
	font-size: var(--min20max22);
	color: var(--color-key);
}
.text-wrap.-schedule > .title.-second {
	margin-top: var(--min9max14);
}
.text-wrap.-schedule > .text {
	font-size: var(--min16max18);
	letter-spacing: .05em;
}
.schedule-text {
	margin-top: 2%;
	align-self: end;
	border-top: #000 solid 1px;
	padding-top: var(--min15max25);
	font-size: var(--min18max20);
	line-height: 1.2;
}
.schedule-text > .big {
	font-size: var(--min25max30);
}

/* parts */
.parts-area {
	padding: var(--min25max40) var(--min12max33);
}
.parts-area > .image {
	display: block;
	margin-top: var(--min25max40);
}

/* voice */
.voice-area {
	padding: var(--min25max50) var(--min45max58) 0;
}
.voice-area::after {
	content: "";
	display: block;
	width: calc(100% + var(--min45max58)*2);
	aspect-ratio: 120 / 19;
	transform: translateX(calc(-1 * var(--min45max58)));
	margin-top: -5%;
	height: var(--min95max152);
  background: url(/external/category/image/2025/tankakugyu/135/voice_item.png) no-repeat right;
	background-size: cover;
}
.block-grid.-voice {
	margin-top: var(--min15max25);
	gap: 4.8%;
}
.block-grid.-voice > .text {
	display: inline-block;
	background: #fff;
	padding: var(--min25max30)!important;
	border-radius: var(--min5max10);
	box-shadow: var(--min3max6) var(--min3max6) 0 0 rgba(211, 190, 113, 0.4);
	font-size: var(--min18max23);
	color: #3e0000;
	line-height: 1.6;
	letter-spacing: .05em;
	font-weight: bold;
}
.block-grid.-voice > .text.-second {
		letter-spacing: .025em;
}

/* cv */
.cv-area {
	padding: var(--min30max45) var(--min12max20) var(--min12max20);
}
.lp-daichi :where(a, button):hover {
	opacity: 1;
}
.dialog-opener img {
	width: calc(100% + 1px);
}
.dialog-opener {
	display: block;
	margin-inline: auto;
}
.cv-area .btnwrap {
	padding: var(--min8max10) 2% var(--min25max35);
	background: #fff;
}
.special-note {
	display: none;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button {
	width: 100%;
	max-width: 529px;
	filter: none;
	background-color: var(--color-cv-bg);
	box-shadow: 0 6px 0 var(--cv-shadow);
	border-radius: 15px;
	padding-block: 16px 10px;
	transition: all .7s;
	margin: 0 auto;
	text-align: center;
	letter-spacing: 0.15rem;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button > span {
	font-size: var(--min23max27);
	background: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: 8px;
	color: #242424;
	align-items: center;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button > span::before {
	content: "";
	display: block;
	width: 30px;
	aspect-ratio: 17 / 15;
	background: url(/assets/img/icon_reserve-renewal.png) no-repeat;
	background-size: contain;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button:hover {
	transition: all .7s;
	box-shadow: 0 2px 0 var(--cv-shadow);
	transform: translateY(6px);
}

@media (max-width: 480px) {

	/* secret */
	.block-grid.-secret {
		grid-template-columns: repeat(1, 1fr);
    gap: 2.5%;
	}
	.block-grid.-secret > .image {
		display: block;
		margin-inline: auto;
		width: 76%;
	}
	.block-grid.-graph {
		grid-template-columns: 43.5% auto
	}
	.text-wrap.-graph > .title {
		padding: 3.9% 12% 2.5%;
	}
	.secret-graph > .note {
		text-align: right;
	}
	.text-wrap.-graph > .text {
		letter-spacing: 0;
	}

	/* schedule */
	.schedule-text {
		margin-top: 4%;
	}

	/* voice */
	.voice-area::after {
		aspect-ratio: 75 / 19;
		margin-top: -12%;
		background: url(/external/category/image/2025/tankakugyu/135/voice_item_sp.png) no-repeat right;
		background-size: cover;
	}
	.block-grid.-voice {
		gap: 3%;
	}
	
	/* cv */
	.dialog-opener img {
		width: calc(100% + .5px);
	}

}