@charset "UTF-8";
/**
 *
 * page-maguro.scss
 *
 */
/* ------------------------------------------------------------
 maguro-page
------------------------------------------------------------ */
.maguro-page {
	--color-bg: var( --color-news-blue );
	--color-header-bg: var( --color-white );
	--maguro-red: var( --color-maguro-red );
	--maguro-gold: var( --color-brand-gold );
	--maguro-ink: var( --color-form-txt );
}

.maguro-page:not(.has-maguro-motion) {
	/* 印刷・動きを減らす設定・JS無効時は、内容を省かず通常の文書として表示。 */
}

.maguro-page:not(.has-maguro-motion) .maguro-quality__panel {
	background-color: transparent;
	background-size: 100% 100%;
	background-position: center;
	background-repeat: no-repeat;
}

@media screen and (min-width: 1024px) {
	.maguro-page:not(.has-maguro-motion) .maguro-quality__panel {
		background-image: url(../img/maguro/quality-fish-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-page:not(.has-maguro-motion) .maguro-quality__panel {
		background-image: url(../img/maguro/quality-fish-sp.svg);
	}
}

.maguro-page:not(.has-maguro-motion) .maguro-quality__seal {
	background-color: transparent;
	background-size: 100% 100%;
	background-position: center;
	background-repeat: no-repeat;
}

@media screen and (min-width: 1024px) {
	.maguro-page:not(.has-maguro-motion) .maguro-quality__seal {
		background-image: url(../img/maguro/quality-fish-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-page:not(.has-maguro-motion) .maguro-quality__seal {
		background-image: url(../img/maguro/quality-fish-sp.svg);
	}
}

.maguro-page:not(.has-maguro-motion) .maguro-quality__fish {
	display: none;
}

.maguro-page:not(.has-maguro-motion) .maguro-quality__letters {
	display: none;
}

.maguro-page:not(.has-maguro-species) .maguro-species__panel + .maguro-species__panel {
	--color-line-maguro-red: var( --maguro-red );
	border-top: var(--solid-maguro-tail-base) var(--color-line-maguro-red);
}

.maguro-page:not(.has-maguro-species) .maguro-species__frame {
	display: none;
}

.maguro-page .maguro-header {
	position: absolute;
}

.maguro-page.is-tab-hidden .maguro-species__track {
	-webkit-animation-play-state: paused !important;
	animation-play-state: paused !important;
}

.maguro-page .maguro-follow-nav {
	position: absolute;
	margin-top: -2.4rem ;
}

@media print {
	.maguro-page .maguro-follow-nav {
		display: none;
	}
}

/* ------------------------------------------------------------
 maguro-main
------------------------------------------------------------ */
.maguro-main {
	color: var(--color-white);
	overflow: clip;
}

/* ------------------------------------------------------------
 maguro-heading
------------------------------------------------------------ */
.maguro-heading {
	font-family: var(--font-sans-serif2);
	font-weight: 400;
}

/* ------------------------------------------------------------
 maguro-display
------------------------------------------------------------ */
.maguro-display {
	color: var(--maguro-ink);
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 400;
	--line-height: 1;
	-webkit-text-stroke: 0.13rem var(--maguro-gold);
	paint-order: stroke fill;
}

.maguro-display::before, .maguro-display::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.maguro-display::before {
	margin-top: var(--font-sans-serif-top);
}

.maguro-display::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

.maguro-display > span,
.maguro-display > strong {
	display: block;
	font-weight: inherit;
}

/* ------------------------------------------------------------
 maguro-photo
------------------------------------------------------------ */
.maguro-photo {
	position: absolute;
	-webkit-mask-image: var(--photo-mask);
	mask-image: var(--photo-mask);
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	overflow: hidden;
	/* 支給aiのマスク座標・写真倍率。PC1500px、SP800px原稿を400px表示。 */
}

.maguro-photo img {
	position: absolute;
	max-width: none;
	min-height: 100%;
	height: auto !important;
	-o-object-fit: cover;
	object-fit: cover;
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-captain {
		--photo-mask: url(../img/maguro/mask-captain-pc.svg);
		top: -3.19369rem ;
		left: -5.997192%;
		width: 24.261909%;
		height: 42.49133rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-captain {
		--photo-mask: url(../img/maguro/mask-captain-sp.svg);
		position: relative;
		margin-left: 50%;
		margin-top: -2.036rem ;
		width: 54.160801%;
		height: auto;
		aspect-ratio: 216.643204 / 252.946800;
		max-width: 43.32864rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-captain img {
		top: 0.000000%;
		left: -18.515000%;
		width: 177.545841%;
		height: 101.365498%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-captain img {
		top: -0.682749%;
		left: -21.517506%;
		width: 177.545841%;
		height: 101.365498%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-boat {
		--photo-mask: url(../img/maguro/mask-boat-pc.svg);
		top: 2.88439rem ;
		left: 81.608685%;
		width: 27.833819%;
		height: 34.09542rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-boat {
		display: none;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-boat img {
		top: -59.896720%;
		left: 0.177913%;
		width: 277.634557%;
		height: 226.623667%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-fresh {
		--photo-mask: url(../img/maguro/mask-fresh-pc.svg);
		top: 110.02912rem ;
		left: 27.084583%;
		width: 35.432423%;
		height: 41.58134rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-fresh {
		--photo-mask: url(../img/maguro/mask-fresh-sp.svg);
		position: relative;
		margin-left: 46.057342%;
		width: 66.435793%;
		height: auto;
		aspect-ratio: 265.743172 / 207.906700;
		max-width: 53.14863rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-fresh img {
		top: -0.292042%;
		left: -28.190190%;
		width: 130.024425%;
		height: 110.785342%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-fresh img {
		top: -0.292042%;
		left: -28.190190%;
		width: 130.024425%;
		height: 110.785342%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-crew {
		--photo-mask: url(../img/maguro/mask-crew-pc.svg);
		top: 123.86663rem ;
		left: 63.086981%;
		width: 42.215620%;
		height: 51.7126rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-crew {
		--photo-mask: url(../img/maguro/mask-crew-sp.svg);
		position: relative;
		margin-left: -26.880087%;
		margin-top: -42.347500%;
		width: 79.154288%;
		height: auto;
		aspect-ratio: 316.617152 / 258.563000;
		max-width: 63.32343rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-crew img {
		top: -8.359957%;
		left: -6.737255%;
		width: 132.745611%;
		height: 108.355737%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-crew img {
		top: -8.359957%;
		left: -6.737255%;
		width: 132.745611%;
		height: 108.355737%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-market {
		--photo-mask: url(../img/maguro/mask-market-pc.svg);
		top: 132.55852rem ;
		left: -6.617892%;
		width: 37.989682%;
		height: 46.53598rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-market {
		--photo-mask: url(../img/maguro/mask-market-sp.svg);
		position: relative;
		margin-left: 41.262481%;
		margin-top: -21.236225%;
		width: 71.230654%;
		height: auto;
		aspect-ratio: 284.922616 / 232.679900;
		max-width: 56.98452rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-market img {
		top: -0.616904%;
		left: -14.956100%;
		width: 124.992309%;
		height: 102.026979%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-market img {
		top: -0.616904%;
		left: -14.956100%;
		width: 124.992309%;
		height: 102.026979%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-season-main {
		--photo-mask: url(../img/maguro/mask-season-main-pc.svg);
		top: 16rem ;
		left: 0.000000%;
		width: 66.666667%;
		height: 70rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-season-main {
		--photo-mask: url(../img/maguro/mask-season-main-sp.svg);
		position: relative;
		align-self: flex-end;
		margin-right: 13.792237%;
		width: 160.167055%;
		height: auto;
		aspect-ratio: 640.668220 / 400.000000;
		max-width: 128.13364rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-season-main img {
		top: -1.129102%;
		left: 0.000000%;
		width: 105.746540%;
		height: 100.700550%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-season-main img {
		top: -4.224539%;
		left: 2.391016%;
		width: 100.028244%;
		height: 106.797122%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-season-sub {
		--photo-mask: url(../img/maguro/mask-season-sub-pc.svg);
		top: 79rem ;
		left: 62.532611%;
		width: 28.000000%;
		height: 33rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-season-sub {
		--photo-mask: url(../img/maguro/mask-season-sub-sp.svg);
		position: relative;
		margin-left: 63.697743%;
		margin-top: -6.120475%;
		width: 40.872585%;
		height: auto;
		aspect-ratio: 163.490340 / 128.160600;
		max-width: 32.69807rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-season-sub img {
		top: -6.852995%;
		left: -19.932469%;
		width: 210.728990%;
		height: 178.781819%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-season-sub img {
		top: -6.820318%;
		left: -19.731160%;
		width: 210.122380%;
		height: 178.679060%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-bowl {
		--photo-mask: url(../img/maguro/mask-dish-bowl-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-bowl {
		--photo-mask: url(../img/maguro/mask-dish-bowl-sp.svg);
		aspect-ratio: 284.114552 / 232.020000;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-bowl img {
		top: 0.000000%;
		left: -11.402885%;
		width: 117.459248%;
		height: 95.877997%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-bowl img {
		top: 0.000000%;
		left: -11.402885%;
		width: 117.459248%;
		height: 95.877997%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-grill {
		--photo-mask: url(../img/maguro/mask-dish-grill-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-grill {
		--photo-mask: url(../img/maguro/mask-dish-grill-sp.svg);
		aspect-ratio: 292.818360 / 232.766000;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-grill img {
		top: -0.569594%;
		left: -20.050475%;
		width: 119.929010%;
		height: 100.569591%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-grill img {
		top: -0.569594%;
		left: -20.050475%;
		width: 119.929010%;
		height: 100.569591%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-sushi {
		--photo-mask: url(../img/maguro/mask-dish-sushi-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-sushi {
		--photo-mask: url(../img/maguro/mask-dish-sushi-sp.svg);
		aspect-ratio: 278.209580 / 259.385400;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-sushi img {
		top: -28.059724%;
		left: -1.053426%;
		width: 101.053426%;
		height: 162.597488%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-sushi img {
		top: -28.059724%;
		left: -1.053426%;
		width: 101.053426%;
		height: 162.597488%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-toro {
		--photo-mask: url(../img/maguro/mask-dish-toro-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-toro {
		--photo-mask: url(../img/maguro/mask-dish-toro-sp.svg);
		aspect-ratio: 273.668684 / 247.412600;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-photo.-dish-toro img {
		top: -0.000138%;
		left: -9.510326%;
		width: 134.342762%;
		height: 99.999969%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo.-dish-toro img {
		top: -0.000138%;
		left: -9.510326%;
		width: 134.342762%;
		height: 99.999969%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-photo img.c-raster-frame[data-raster] {
		max-width: 100%;
		height: 100% !important;
		-o-object-position: center top;
		object-position: center top;
	}
}

/* ------------------------------------------------------------
 maguro-opening
------------------------------------------------------------ */
.maguro-opening {
	position: relative;
}

@media screen and (min-width: 1024px) {
	.maguro-opening {
		height: 258rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening {
		height: 192rem ;
	}
}

.maguro-opening__sky {
	position: absolute;
	inset: 0 0 auto;
	min-height: 100vh;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__sky {
		height: 168rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__sky {
		height: 142rem ;
	}
}

.maguro-opening__background {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: clip;
	background-color: transparent;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__background {
		background-image: url(../img/maguro/hero-background-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__background {
		background-image: url(../img/maguro/hero-background-sp.svg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.maguro-opening__background {
		position: relative;
	}
}

.maguro-opening__decorations {
	position: absolute;
	inset: 0;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__decorations {
		max-width: 150rem ;
	}
}

/* 装飾は背景のcoverや画面高に追従させず、原稿の座標で配置。 */
.maguro-opening__decoration {
	position: absolute;
	height: auto;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__decoration.-ribbon {
		top: 4.79583rem ;
		left: 58.6857%;
		width: 36.9503%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__decoration.-ribbon {
		top: 9.08965rem ;
		left: 50.6091%;
		width: 69.2818%;
		max-width: 55.42544rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__decoration.-coral-left {
		top: 38.31597rem ;
		left: -12.9668%;
		width: 27.2083%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__decoration.-coral-left {
		top: 40.3913rem ;
		left: max(-17.5145%, -7.005800rem);
		width: 51.0156%;
		max-width: 40.81248rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__decoration.-coral-right {
		top: 53.34479rem ;
		left: 40.5129%;
		width: 20.2587%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__decoration.-coral-right {
		top: 56.30145rem ;
		left: 67.6583%;
		width: 37.985%;
		max-width: 30.388rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__decoration.-stripes {
		top: 72.57767rem ;
		left: 67.1045%;
		width: 32.8417%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__decoration.-stripes {
		top: 50.7171rem ;
		left: 50.0043%;
		width: 61.5783%;
		max-width: 49.26264rem ;
	}
}

.maguro-opening__wave {
	position: absolute;
	inset: auto 0 -1px;
	background-color: transparent;
	background-image: url(../img/maguro/wave-blue.svg);
	background-position: center bottom;
	background-repeat: repeat-x;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__wave {
		height: 2.5rem ;
		background-size: 1600px 100%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__wave {
		height: 1.6rem ;
		background-size: 800px 100%;
	}
}

.maguro-opening__inner {
	position: relative;
	z-index: 2;
	margin-inline: auto;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__inner {
		max-width: 150rem ;
		padding-top: 19.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__inner {
		padding-top: 13.3rem ;
	}
}

.maguro-opening__en {
	width: -webkit-max-content;
	width: max-content;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__en {
		font-size: 6.95rem ;
		margin-left: 5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__en {
		font-size: var(--font-size35);
		margin-left: 4.875%;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__en strong {
		font-size: 12.33rem ;
		margin-top: 0.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__en strong {
		font-size: var(--font-size62);
		margin-top: 1.1rem ;
	}
}

.maguro-opening__message {
	margin-right: 0 ;
	margin-bottom: 0 ;
	pointer-events: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__message {
		width: 47rem;
		margin-top: 26rem ;
		margin-left: 16.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__message {
		width: 80%;
		margin-left: 10%;
		margin-top: 29.9rem ;
	}
}

.maguro-opening__message h1 {
	--line-height: 1;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__message h1 {
		font-size: var(--font-size70);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__message h1 {
		font-size: var(--font-size47);
	}
}

.maguro-opening__copy {
	font-weight: 700;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__copy {
		font-size: var(--font-size18);
		--line-height: 2.33333;
		margin-top: 5.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__copy {
		font-size: var(--font-size13);
		--line-height: 2.38462;
		margin-top: 3.6rem ;
	}
}

.maguro-opening__copy p {
	line-height: inherit;
}

.maguro-opening__art {
	position: absolute;
	inset: 0;
	margin-inline: auto;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__art {
		max-width: 150rem ;
	}
}

.maguro-opening__swim-path,
.maguro-opening__swimmer {
	position: absolute;
	inset: 0;
}

.has-maguro-motion .maguro-opening__swim-path {
	bottom: auto;
	height: calc( var( --maguro-swim-end ) + 100vh);
}

.has-maguro-motion .maguro-opening__swimmer {
	position: sticky;
	top: 0;
	height: 100vh;
}

.maguro-opening__tuna {
	position: absolute;
	will-change: transform;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__tuna {
		top: 20.43rem ;
		left: 34.1802%;
		width: 64.05%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__tuna {
		top: 23.6rem ;
		left: 20.34%;
		width: 120.1%;
		max-width: 96.08rem ;
	}
}

@media (prefers-reduced-motion: reduce) {
	.maguro-opening__tuna {
		will-change: auto;
	}
}

@media print {
	.maguro-opening__tuna {
		-webkit-transform: none !important;
		transform: none !important;
	}
}

.maguro-opening__stars {
	position: absolute;
	inset: 0 0 auto;
	background-color: transparent;
	background-size: 100% 100%;
	background-position: center;
	background-repeat: no-repeat;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__stars {
		height: 84rem;
		background-image: url(../img/maguro/hero-stars-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__stars {
		height: 72.5rem;
		background-image: url(../img/maguro/hero-stars-sp.svg);
	}
}

.maguro-opening__school {
	position: absolute;
	inset: 0;
}

@media print {
	.maguro-opening__school {
		-webkit-transform: none !important;
		transform: none !important;
	}
}

.maguro-opening__school img {
	position: absolute;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__school .-fish-0 {
		top: 183.47rem ;
		left: 47.72%;
		width: 35.27%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__school .-fish-0 {
		top: 157rem ;
		left: 49%;
		width: 66.1%;
		max-width: 52.88rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__school .-fish-1 {
		top: 208.28rem ;
		left: 76.29%;
		width: 27.08%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__school .-fish-1 {
		display: none;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__school .-fish-2 {
		top: 184.08rem ;
		left: 23.48%;
		width: 25.54%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__school .-fish-2 {
		top: 156.1rem ;
		left: 12.4%;
		width: 47.9%;
		max-width: 38.32rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__school .-fish-3 {
		top: 214.57rem ;
		left: 52.15%;
		width: 18.68%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__school .-fish-3 {
		top: 171.1rem ;
		left: 56%;
		width: 35%;
		max-width: 28rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-opening__school .-fish-4 {
		top: 235.08rem ;
		left: 65.08%;
		width: 15.26%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__school .-fish-4 {
		top: 179.9rem ;
		left: 74%;
		width: 28.6%;
		max-width: 22.88rem ;
	}
}

.maguro-opening__coral {
	position: absolute;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-opening__coral.-left {
		top: 176.71948rem ;
		left: -5.71479%;
		width: 28.899841%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-opening__coral.-left {
		top: 148.03929rem ;
		left: max(-10.292905%, -4.117162rem);
		width: 54.187202%;
		max-width: 43.34976rem ;
	}
}

.maguro-opening__coral.-right {
	top: 225.60225rem ;
	right: -5.691143%;
	width: 19.145371%;
}

@media screen and (max-width: 1023px) {
	.maguro-opening__coral.-right {
		display: none;
	}
}

/* ------------------------------------------------------------
 maguro-story
------------------------------------------------------------ */
.maguro-story {
	position: relative;
}

.maguro-story__inner {
	position: relative;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-story__inner {
		max-width: 150rem ;
		min-height: 180rem ;
		padding-top: 10rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__inner {
		display: flow-root;
		padding-top: 0;
	}
}

.maguro-story__en {
	position: relative;
	z-index: 10;
	text-align: center;
}

@media screen and (min-width: 1024px) {
	.maguro-story__en {
		font-size: 6.95rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__en {
		font-size: var(--font-size35);
		--line-height: 1.11429;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-story__en strong {
		font-size: 12.33rem ;
		margin-top: 0.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__en strong {
		font-size: var(--font-size62);
		margin-top: 1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__en > span {
		width: 27rem;
		margin-inline: auto;
	}
}

.maguro-story__title {
	position: relative;
	letter-spacing: 0.05em;
	margin-right: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-story__title {
		text-align: center;
		font-size: var(--font-size70);
		--line-height: 1;
		margin-left: auto;
		margin-top: 6.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__title {
		width: 86%;
		text-align: left;
		font-size: var(--font-size47);
		--line-height: 1.18085;
		margin-left: 10%;
		margin-top: -4.06rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__title .maguro-text-crop > span {
		display: block;
		white-space: nowrap;
	}
}

.maguro-story__copy {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	text-orientation: upright;
}

@media screen and (min-width: 1024px) {
	.maguro-story__copy {
		height: 46rem ;
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		font-weight: 700;
		font-size: var(--font-size18);
		--line-height: 2.22222;
		margin-top: 11.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__copy {
		width: 80%;
		height: auto;
		-webkit-writing-mode: horizontal-tb;
		-ms-writing-mode: lr-tb;
		writing-mode: horizontal-tb;
		font-weight: 500;
		font-size: var(--font-size13);
		--line-height: 2.46154;
		margin-top: 4.7rem ;
	}
}

.maguro-story__copy > .maguro-text-trim {
	padding: 0;
}

.maguro-story__copy > .maguro-text-trim > .maguro-text-crop {
	display: block;
}

.maguro-story__copy p {
	line-height: inherit;
}

@media screen and (min-width: 1024px) {
	.maguro-story__copy p {
		text-indent: 1em;
	}
}

/* 写真の実寸で次の段を送り、原稿の重なりだけをマージンで残す。 */
@media screen and (max-width: 1023px) {
	.maguro-story__photos {
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 80rem;
		margin-inline: auto;
		margin-top: 1.65rem ;
	}
}

.maguro-story__break {
	display: block;
}

@media screen and (min-width: 1024px) {
	.maguro-story__break {
		width: 3.6rem ;
		height: 100%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__break {
		width: 100%;
		height: 3.3rem ;
	}
}

.maguro-story__coral {
	position: absolute;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-story__coral.-left {
		top: 91.87597rem ;
		left: -7.411902%;
		width: 22.555972%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__coral.-left {
		top: 16.00208rem ;
		left: max(-1.474506%, -0.589802rem);
		width: 36.550404%;
		max-width: 29.24032rem ;
	}
}

.maguro-story__coral.-right {
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}

@media screen and (min-width: 1024px) {
	.maguro-story__coral.-right {
		top: 90.45259rem ;
		right: -8.327745%;
		width: 22.318997%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-story__coral.-right {
		display: none;
	}
}

/* ------------------------------------------------------------
 maguro-reason
------------------------------------------------------------ */
.maguro-reason {
	position: relative;
}

.maguro-reason__inner {
	position: relative;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-reason__inner {
		max-width: 150rem ;
		padding: 2.5rem 0 8.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-reason__inner {
		padding: 0 10% 6rem;
	}
}

.maguro-reason__title {
	position: relative;
	z-index: 1;
}

@media screen and (min-width: 1024px) {
	.maguro-reason__title {
		text-align: center;
		font-size: var(--font-size54);
		--line-height: 1.60741;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-reason__title {
		text-align: left;
		font-size: var(--font-size36);
		--line-height: 1.625;
	}
}

.maguro-reason__lead {
	display: block;
}

.maguro-reason__lead strong {
	display: inline-block;
	-webkit-transform: translateY(0.15em);
	transform: translateY(0.15em);
	color: var(--maguro-red);
	font-weight: inherit;
}

@media screen and (min-width: 1024px) {
	.maguro-reason__lead strong {
		font-size: var(--font-size88);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-reason__lead strong {
		font-size: var(--font-size68);
		--line-height: 1.25;
		margin-top: -0.8rem ;
		margin-bottom: 1.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-reason__lead > span,
	.maguro-reason__lead > strong {
		display: block;
	}
}

.maguro-reason__last {
	display: block;
}

.maguro-reason__copy {
	position: relative;
	z-index: 1;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-reason__copy {
		max-width: 85%;
		width: -webkit-max-content;
		width: max-content;
		text-align: center;
		font-weight: 700;
		font-size: var(--font-size18);
		--line-height: 2.33333;
		margin-top: 6.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-reason__copy {
		max-width: none;
		font-weight: 500;
		font-size: var(--font-size13);
		--line-height: 2.46154;
		letter-spacing: -0.05em;
		margin-top: 6.8rem ;
	}
}

.maguro-reason__copy p {
	line-height: inherit;
}

.maguro-reason__coral {
	position: absolute;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-reason__coral.-left {
		top: 5.43012rem ;
		left: -10.789627%;
		width: 27.65079%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-reason__coral.-left {
		display: none;
	}
}

.maguro-reason__coral.-right {
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}

@media screen and (min-width: 1024px) {
	.maguro-reason__coral.-right {
		top: 7.58902rem ;
		right: -13.961424%;
		width: 28.538955%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-reason__coral.-right {
		top: 22.80645rem ;
		right: max(-14.458268%, -5.783307rem);
		width: 44.045972%;
		max-width: 35.23678rem ;
	}
}

/* 通常表示では全説明を縦に並べ、JS有効時だけ魚の内側を送る。 */
.maguro-quality {
	position: relative;
}

.maguro-quality__stage {
	position: relative;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__stage {
		max-width: 150rem ;
	}
}

.maguro-quality__fish {
	position: absolute;
	inset: 0;
	background-color: transparent;
	background-size: 100% 100%;
	background-position: center;
	background-repeat: no-repeat;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__fish {
		background-image: url(../img/maguro/quality-fish-pc.svg);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__fish {
		background-image: url(../img/maguro/quality-fish-sp.svg);
	}
}

.maguro-quality__stars {
	position: absolute;
	top: 40%;
	width: 17.95%;
	pointer-events: none;
}

@media screen and (max-width: 1023px) {
	.maguro-quality__stars {
		display: none;
	}
}

.maguro-quality__stars.-left {
	left: 12.7%;
}

.maguro-quality__stars.-right {
	top: 42%;
	right: 13.8%;
}

.maguro-quality__letters {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
}

@media print {
	.maguro-quality__letters {
		display: none;
	}
}

.maguro-quality__letters img {
	position: absolute;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__letters img {
		width: 19%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__letters img {
		width: 29%;
		max-width: 23.2rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-quality__letters .-ryu {
		max-width: 569.782px;
		top: 5.5%;
		left: calc(50% - 50vw + 1.64vw);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__letters .-ryu {
		top: 2%;
		left: calc(50% - 50vw + 2vw);
	}
}

@media screen and (min-width: 1024px) {
	.maguro-quality__letters .-kyu {
		max-width: 583.648px;
		top: 5%;
		right: calc(50% - 50vw + 1.1vw);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__letters .-kyu {
		top: 2%;
		right: calc(50% - 50vw + 3vw);
	}
}

@media screen and (min-width: 1024px) {
	.maguro-quality__letters .-ten {
		max-width: 567.832px;
		bottom: 5%;
		left: calc(50% - 50vw + 1.7vw);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__letters .-ten {
		bottom: 3%;
		left: calc(50% - 50vw + 3vw);
	}
}

@media screen and (min-width: 1024px) {
	.maguro-quality__letters .-nen {
		max-width: 563.812px;
		bottom: 5%;
		right: calc(50% - 50vw + 1.5vw);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__letters .-nen {
		bottom: 3%;
		right: calc(50% - 50vw + 3vw);
	}
}

.maguro-quality__window {
	position: relative;
}

.maguro-quality__panel {
	position: relative;
	text-align: center;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__panel {
		padding: 13rem 0 18rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__panel {
		padding: 10.5rem 0 11rem ;
	}
}

@media print {
	.maguro-quality__panel {
		-webkit-column-break-inside: avoid;
		-moz-column-break-inside: avoid;
		break-inside: avoid;
	}
}

.maguro-quality__number {
	color: var(--color-service-blue);
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	--line-height: 1;
}

.maguro-quality__number::before, .maguro-quality__number::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.maguro-quality__number::before {
	margin-top: var(--font-sans-serif-top);
}

.maguro-quality__number::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.maguro-quality__number {
		font-size: var(--font-size74);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__number {
		font-size: 4.73rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-quality__title {
		font-size: var(--font-size45);
		--line-height: 1.51111;
		margin-top: 4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__title {
		font-size: 2.88rem ;
		--line-height: 1.37153;
		margin-top: 3.6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-quality__title span span {
		display: inline;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__title span span {
		display: block;
	}
}

.maguro-quality__illustration {
	display: block;
	overflow: hidden;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__illustration {
		max-width: 75%;
		width: 49rem ;
		height: 35.2rem ;
		border-radius: 2.5rem ;
		margin-top: 6.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__illustration {
		width: 75%;
		height: auto;
		border-radius: 2rem ;
		margin-top: 2rem ;
		max-width: 60rem ;
		aspect-ratio: 490 / 351.542;
	}
}

.maguro-quality__illustration img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
}

.maguro-quality__copy {
	text-align: left;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__copy {
		max-width: 78%;
		width: 66rem ;
		font-weight: 700;
		font-size: 1.875rem ;
		--line-height: 2.24411;
		margin-top: 4.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__copy {
		max-width: none;
		width: 75%;
		font-weight: 500;
		font-size: var(--font-size13);
		--line-height: 2.30769;
		margin-top: 2.9rem ;
	}
}

.maguro-quality__seal {
	position: relative;
	display: grid;
	place-items: center;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__seal {
		min-height: 84rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__seal {
		min-height: 75rem ;
	}
}

.maguro-quality__seal img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
}

.maguro-quality__seal-image {
	aspect-ratio: 511.294 / 666.024;
}

@media screen and (min-width: 1024px) {
	.maguro-quality__seal-image {
		max-width: 51.2rem;
		width: 34.1%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-quality__seal-image {
		max-width: 58.8rem ;
		width: 73.5%;
	}
}

.has-maguro-motion .maguro-quality {
	height: var(--quality-scroll-height);
}

@media print {
	.has-maguro-motion .maguro-quality {
		height: auto;
	}
}

.has-maguro-motion .maguro-quality__stage {
	position: sticky;
	top: 0;
	height: 100vh;
}

@media print {
	.has-maguro-motion .maguro-quality__stage {
		position: relative;
		height: auto;
	}
}

.has-maguro-motion .maguro-quality__window {
	height: 100%;
	overflow: hidden;
}

@media print {
	.has-maguro-motion .maguro-quality__window {
		height: auto;
		overflow: visible;
	}
}

.has-maguro-motion .maguro-quality__reel {
	will-change: transform;
}

@media screen and (min-width: 1024px) {
	.has-maguro-motion .maguro-quality__reel {
		padding-top: 80vh;
	}
}

@media screen and (max-width: 1023px) {
	.has-maguro-motion .maguro-quality__reel {
		padding-top: 40vh;
	}
}

@media print {
	.has-maguro-motion .maguro-quality__reel {
		padding-top: 0;
	}
}

.has-maguro-motion .maguro-quality__panel {
	min-height: var(--quality-panel-height);
}

.has-maguro-motion .maguro-quality__seal {
	position: absolute;
	inset: 0;
	z-index: 4;
	min-height: 0;
	height: 100%;
	pointer-events: none;
}

.has-maguro-motion .maguro-quality__seal img {
	opacity: var(--seal-progress, 0);
	-webkit-transform: translate3d(0, calc( var( --seal-rise ) * (var( --seal-progress , 0 ) - 1)), 0) scale(calc( 1.35 - var( --seal-progress , 0 ) * .35)) rotate(calc( -10deg + var( --seal-progress , 0 ) * 10deg));
	transform: translate3d(0, calc( var( --seal-rise ) * (var( --seal-progress , 0 ) - 1)), 0) scale(calc( 1.35 - var( --seal-progress , 0 ) * .35)) rotate(calc( -10deg + var( --seal-progress , 0 ) * 10deg));
	will-change: transform, opacity;
}

@media print {
	.has-maguro-motion .maguro-quality__seal img {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

@media screen and (min-width: 1024px) {
	.has-maguro-motion .maguro-quality__seal .maguro-quality__seal-image {
		max-width: min(51.2rem, 90vh * 511.294 / 666.024);
	}
}

@media screen and (max-width: 1023px) {
	.has-maguro-motion .maguro-quality__seal .maguro-quality__seal-image {
		max-width: min(58.8rem, 90vh * 511.294 / 666.024);
	}
}

/* ------------------------------------------------------------
 maguro-season
------------------------------------------------------------ */
.maguro-season {
	position: relative;
	z-index: 1;
	background-color: var(--maguro-red);
	background-image: none;
}

@media screen and (min-width: 1024px) {
	.maguro-season {
		border-radius: 11.5rem 11.5rem 0 0 ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season {
		border-radius: 4.2rem 4.2rem 0 0 ;
	}
}

.maguro-season__inner {
	position: relative;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-season__inner {
		height: 118.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__inner {
		display: flow-root;
		padding: 5.7rem 0 5.166rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-season__visual {
		display: contents;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__visual {
		position: relative;
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 80rem;
		margin-inline: auto;
		margin-top: 3.944rem ;
	}
}

.maguro-season__en {
	position: absolute;
	z-index: 2;
}

@media screen and (min-width: 1024px) {
	.maguro-season__en {
		top: 11.3rem ;
		left: 6.45%;
		font-size: var(--font-size136);
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__en {
		position: relative;
		margin-left: 10%;
		display: flex;
		flex-direction: column;
		font-size: var(--font-size62);
	}
}

.maguro-season__en .maguro-season__always {
	text-transform: uppercase;
}

@media screen and (min-width: 1024px) {
	.maguro-season__en .maguro-season__in {
		font-size: var(--font-size80);
		margin-top: 1.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__en .maguro-season__in {
		order: -1;
		font-size: var(--font-size35);
		margin-top: 0;
		margin-bottom: 1.5rem ;
	}
}

.maguro-season__year {
	position: absolute;
	z-index: 2;
	height: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-season__year {
		top: 13.84385rem ;
		left: 85.78409%;
		width: 8.027604%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__year {
		top: 0;
		margin-top: -2.860950%;
		left: 80.301505%;
		width: 15.01178%;
		max-width: 12.00942rem ;
	}
}

.maguro-season__four {
	position: absolute;
	z-index: 2;
	height: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-season__four {
		top: 51.67407rem ;
		left: 49.687475%;
		width: 7.814518%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__four {
		top: 0;
		margin-top: 56.535825%;
		left: 10.708244%;
		width: 14.613342%;
		max-width: 11.69067rem ;
	}
}

.maguro-season__stamp {
	position: absolute;
	z-index: 3;
}

@media screen and (min-width: 1024px) {
	.maguro-season__stamp {
		top: 19.3rem ;
		left: 56.3%;
		width: 28%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__stamp {
		top: 0;
		margin-top: 19.044725%;
		left: 23.5%;
		width: 54%;
		max-width: 43.2rem ;
	}
}

.maguro-season__copy {
	position: absolute;
	z-index: 2;
}

@media screen and (min-width: 1024px) {
	.maguro-season__copy {
		top: 80.6rem ;
		left: 16.15%;
		max-width: 45%;
		width: 42rem;
		font-weight: 700;
		font-size: var(--font-size18);
		--line-height: 2.33333;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__copy {
		position: relative;
		margin-left: 10%;
		margin-top: 1.5rem ;
		width: 82%;
		font-weight: 500;
		font-size: var(--font-size13);
		--line-height: 2.46154;
	}
}

.maguro-season__copy p {
	line-height: inherit;
}

.maguro-season__ribbon {
	position: absolute;
	width: 41%;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.maguro-season__ribbon.-top {
		top: -3.7rem ;
		right: 0;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__ribbon.-top {
		top: 2.4rem ;
		right: max(-36%, -14.400000rem);
		width: 77%;
		max-width: 61.6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-season__ribbon.-bottom {
		top: 102.14873rem ;
		left: -1.121247%;
		width: 40.942595%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-season__ribbon.-bottom {
		position: relative;
		margin-top: -15.386475%;
		margin-left: -16.693944%;
		width: 68.128392%;
		max-width: 54.50271rem ;
	}
}

.maguro-season__coral {
	position: absolute;
	top: 75.39868rem ;
	left: 67.602984%;
	width: 35.528166%;
	height: auto;
	pointer-events: none;
}

@media screen and (max-width: 1023px) {
	.maguro-season__coral {
		display: none;
	}
}

/* ------------------------------------------------------------
 maguro-species
------------------------------------------------------------ */
.maguro-species {
	position: relative;
	background-color: var(--maguro-red);
	background-image: none;
	color: var(--maguro-ink);
	padding-top: 0 ;
	padding-right: 0 ;
	padding-left: 0 ;
}

@media screen and (min-width: 1024px) {
	.maguro-species {
		padding-bottom: 8.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species {
		padding-bottom: 0 ;
	}
}

.maguro-species__stage {
	position: relative;
	z-index: 2;
	margin-inline: auto;
	--species-frame-outer: calc((var(--species-corner-size) - var(--species-band-size) - var(--species-line-size)) / 2);
	--species-frame-inner: calc(var(--species-frame-outer) + var(--species-band-size));
	padding: calc(var(--species-frame-y) + var(--species-frame-inner)) calc(var(--species-frame-x) + var(--species-frame-inner));
}

@media screen and (min-width: 1024px) {
	.maguro-species__stage {
		--species-frame-x: 2.752rem;
		--species-frame-y: 2.895rem;
		--species-corner-size: 12.97rem;
		--species-band-size: 7.8125rem;
		--species-line-size: .078125rem;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__stage {
		--species-frame-x: .4959rem;
		--species-frame-y: .0136rem;
		--species-corner-size: 5.0391rem;
		--species-band-size: 3.2rem;
		--species-line-size: .0390625rem;
	}
}

.maguro-species__frame {
	position: absolute;
	z-index: 2;
	top: 5rem ;
	inset: var(--species-frame-y) var(--species-frame-x);
	pointer-events: none;
}

@media print {
	.maguro-species__frame {
		display: none;
	}
}

.maguro-species__border {
	position: absolute;
	display: flex;
	align-items: center;
	border: solid var(--species-line-size) currentColor;
	background-color: var(--maguro-red);
	font-family: var(--font-sans-serif);
	--line-height: 1;
	overflow: hidden;
}

@media screen and (min-width: 1024px) {
	.maguro-species__border {
		font-size: 4.84375rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__border {
		font-size: 1.25099rem ;
	}
}

.maguro-species__border.-top, .maguro-species__border.-bottom {
	left: calc(var(--species-corner-size) / 2);
	right: calc(var(--species-corner-size) / 2);
	height: calc(var(--species-band-size) + var(--species-line-size));
}

.maguro-species__border.-top {
	top: var(--species-frame-outer);
}

.maguro-species__border.-bottom {
	bottom: var(--species-frame-outer);
}

.maguro-species__border.-left, .maguro-species__border.-right {
	top: calc(var(--species-corner-size) / 2);
	bottom: calc(var(--species-corner-size) / 2);
	width: calc(var(--species-band-size) + var(--species-line-size));
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}

.maguro-species__border.-left .maguro-species__track, .maguro-species__border.-right .maguro-species__track {
	width: auto;
	height: -webkit-max-content;
	height: max-content;
}

.maguro-species__border.-left {
	left: var(--species-frame-outer);
}

.maguro-species__border.-right {
	right: var(--species-frame-outer);
}

.maguro-species__track {
	display: flex;
	flex-shrink: 0;
	width: -webkit-max-content;
	width: max-content;
}

@media (prefers-reduced-motion: reduce) {
	.maguro-species__track {
		-webkit-animation: none !important;
		animation: none !important;
	}
}

.maguro-species__track span {
	flex: 0 0 auto;
	white-space: nowrap;
}

.maguro-species__corner {
	position: absolute;
	z-index: 1;
	display: grid;
	place-items: center;
	width: var(--species-corner-size);
	height: var(--species-corner-size);
	border-radius: 50%;
	border: solid var(--species-line-size) currentColor;
	background-color: var(--maguro-red);
	background-image: none;
	font-family: var(--font-sans-serif2);
	--line-height: 1;
	transition: background var(--transition-link);
}

@media screen and (min-width: 1024px) {
	.maguro-species__corner {
		font-size: 6.40625rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__corner {
		font-size: 2.48463rem ;
	}
}

.maguro-species__corner.is-current {
	background-color: var(--color-maguro-card);
	background-image: none;
}

.maguro-species__corner.-corner-0 {
	top: 0;
	left: 0;
}

.maguro-species__corner.-corner-1 {
	top: 0;
	right: 0;
}

.maguro-species__corner.-corner-2 {
	bottom: 0;
	right: 0;
}

.maguro-species__corner.-corner-3 {
	bottom: 0;
	left: 0;
}

.maguro-species__window {
	background-color: var(--color-maguro-card);
	background-image: none;
}

.maguro-species__panel {
	position: relative;
	gap: 0;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-species__panel {
		display: flex;
		align-items: center;
		max-width: 123.79162rem ;
		min-height: 63rem;
		padding: 9rem 5rem 9rem 10.7rem;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__panel {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		min-height: 65rem;
		padding: 5.2rem 2.9rem 3.5rem ;
	}
}

@media print {
	.maguro-species__panel {
		-webkit-column-break-inside: avoid;
		-moz-column-break-inside: avoid;
		break-inside: avoid;
	}
}

.maguro-species__body {
	position: relative;
	z-index: 1;
	flex-shrink: 0;
}

@media screen and (min-width: 1024px) {
	.maguro-species__body {
		width: 38.5%;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__body {
		width: 100%;
	}
}

.maguro-species__tagline {
	font-family: var(--font-sans-serif2);
}

@media screen and (min-width: 1024px) {
	.maguro-species__tagline {
		font-size: 3.28125rem ;
		--line-height: 1.31048;
		margin-left: 0.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__tagline {
		font-size: var(--font-size23);
		--line-height: 1.34783;
	}
}

.maguro-species__name {
	font-family: var(--font-sans-serif2);
	font-weight: 400;
}

@media screen and (min-width: 1024px) {
	.maguro-species__name {
		white-space: nowrap;
		font-size: 6.25rem ;
		--line-height: 1.312;
		margin-top: 2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__name {
		white-space: normal;
		font-size: var(--font-size32);
		--line-height: 1.375;
		margin-top: 1.6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-species__name small {
		font-size: 3.125rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__name small {
		display: inline-block;
		font-size: 1.55rem ;
	}
}

.maguro-species__season {
	border-block: var(--solid-about);
	font-weight: 700;
}

@media screen and (min-width: 1024px) {
	.maguro-species__season {
		font-size: var(--font-size25);
		--line-height: 1.35;
		margin-top: 2.7rem ;
		padding: 1.8rem 0 ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__season {
		font-size: var(--font-size21);
		--line-height: 1.42857;
		margin-top: 2.3rem ;
		padding: 1.7rem 0 ;
	}
}

.maguro-species__copy {
	font-weight: 700;
}

@media screen and (min-width: 1024px) {
	.maguro-species__copy {
		width: -webkit-max-content;
		width: max-content;
		font-size: 1.71875rem ;
		--line-height: 2.19055;
		margin-top: 2.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__copy {
		font-size: var(--font-size13);
		--line-height: 1.76923;
		margin-top: 2.9rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__copy .-pc {
		display: none;
	}
}

@media screen and (min-width: 1024px) {
	.maguro-species__copy .-sp {
		display: none;
	}
}

.maguro-species__image {
	flex-shrink: 0;
}

@media screen and (min-width: 1024px) {
	.maguro-species__image {
		-webkit-filter: drop-shadow(0.6rem 0.8rem 0.7rem var(--color-shadow-maguro-fish));
		filter: drop-shadow(0.6rem 0.8rem 0.7rem var(--color-shadow-maguro-fish));
		order: 2;
		max-width: 67%;
		width: 65rem;
		margin-left: 2rem;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-species__image {
		-webkit-filter: drop-shadow(0.3rem 0.4rem 0.35rem var(--color-shadow-maguro-fish));
		filter: drop-shadow(0.3rem 0.4rem 0.35rem var(--color-shadow-maguro-fish));
		order: 0;
		width: calc(100% + 5.8rem);
		align-self: center;
		margin-inline: -2.9rem;
		margin-bottom: 5.1rem ;
		max-width: 61.6164rem ;
	}
}

.maguro-species__image img {
	display: block;
	width: 100%;
	height: auto;
}

.has-maguro-species .maguro-species {
	height: var(--species-scroll-height);
	padding-bottom: 0;
}

@media print {
	.has-maguro-species .maguro-species {
		height: auto;
	}
}

.has-maguro-species .maguro-species.is-visible .maguro-species__track {
	-webkit-animation: maguro-border 96s linear infinite;
	animation: maguro-border 96s linear infinite;
}

.has-maguro-species .maguro-species.is-visible .maguro-species__border.-bottom .maguro-species__track,
.has-maguro-species .maguro-species.is-visible .maguro-species__border.-left .maguro-species__track {
	animation-direction: reverse;
}

.has-maguro-species .maguro-species.is-visible .maguro-species__border.-left .maguro-species__track,
.has-maguro-species .maguro-species.is-visible .maguro-species__border.-right .maguro-species__track {
	-webkit-animation-name: maguro-border-v;
	animation-name: maguro-border-v;
}

.has-maguro-species .maguro-species__stage {
	position: sticky;
	top: 0;
	height: 100vh;
}

@media print {
	.has-maguro-species .maguro-species__stage {
		position: relative;
		height: auto;
	}
}

.has-maguro-species .maguro-species__window {
	height: 100%;
	overflow: clip;
}

@media print {
	.has-maguro-species .maguro-species__window {
		height: auto;
		-webkit-mask: none;
		mask: none;
		overflow: visible;
	}
}

.has-maguro-species .maguro-species__reel {
	will-change: transform;
}

.has-maguro-species .maguro-species__panel {
	min-height: var(--species-panel-height);
}

@-webkit-keyframes maguro-border {
	to {
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
	}
}

@keyframes maguro-border {
	to {
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
	}
}

@-webkit-keyframes maguro-border-v {
	to {
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
}

@keyframes maguro-border-v {
	to {
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
}

/* ------------------------------------------------------------
 maguro-dishes
------------------------------------------------------------ */
.maguro-dishes {
	background-color: var(--color-brand-cream);
	background-image: none;
	color: var(--maguro-ink);
}

.maguro-dishes__inner {
	position: relative;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.maguro-dishes__inner {
		max-width: 150rem ;
		height: 113.8rem;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dishes__inner {
		display: grid;
		padding-bottom: 12.57796rem ;
	}
}

.maguro-dishes__title {
	position: absolute;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	letter-spacing: -0.1em;
}

@media screen and (min-width: 1024px) {
	.maguro-dishes__title {
		left: 6%;
		font-size: var(--font-size50);
		--line-height: 1.416;
		top: 16rem;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dishes__title {
		position: relative;
		grid-area: 1 / 1;
		align-self: start;
		width: -webkit-max-content;
		width: max-content;
		margin-left: 10%;
		margin-top: 6.1rem ;
		font-size: var(--font-size30);
		--line-height: 1.4;
	}
}

.maguro-dishes__title span span {
	display: block;
}

@media screen and (max-width: 1023px) {
	.maguro-dishes__list {
		grid-area: 1 / 1;
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 80rem;
		margin-inline: auto;
		margin-top: 7.36197rem ;
	}
	.maguro-dishes__list > li {
		display: flow-root;
	}
}

/* ------------------------------------------------------------
 maguro-dish
------------------------------------------------------------ */
.maguro-dish {
	position: absolute;
	display: block;
	text-decoration: none;
	color: inherit;
}

@media screen and (min-width: 1024px) {
	.maguro-dish {
		margin-top: 7.7rem;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dish {
		position: relative;
		margin-top: 0;
	}
}

.maguro-dish:focus-visible {
	outline: 3px solid var(--color-news-blue);
	outline-offset: 1rem;
}

@media (hover: hover) {
	.maguro-dish:hover:where(body[data-hover-enabled="true"] *, [data-hover-enabled="true"]) .maguro-photo img {
		-webkit-transform: scale(1.04);
		transform: scale(1.04);
	}
}

.maguro-dish .maguro-photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.maguro-dish .maguro-photo img {
	transition: -webkit-transform var(--transition-hover);
	transition: transform var(--transition-hover);
	transition: transform var(--transition-hover), -webkit-transform var(--transition-hover);
}

@media screen and (min-width: 1024px) {
	.maguro-dish.-bowl {
		top: 2.33717rem ;
		left: 26.464087%;
		width: 33.192066%;
		height: 40.65908rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dish.-bowl {
		margin-left: 35.736105%;
		width: 71.028638%;
		height: auto;
		aspect-ratio: 284.114552 / 232.020000;
		max-width: 56.82291rem ;
	}
}

.maguro-dish.-bowl .maguro-dish__label {
	top: 77.205495%;
	left: -6.837408%;
}

@media screen and (min-width: 1024px) {
	.maguro-dish.-grill {
		top: 41.98171rem ;
		left: 13.319367%;
		width: 34.208901%;
		height: 40.78981rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dish.-grill {
		margin-left: 13.247235%;
		margin-top: 1.34147rem ;
		width: 73.204590%;
		height: auto;
		aspect-ratio: 292.818360 / 232.766000;
		max-width: 58.56367rem ;
	}
}

.maguro-dish.-grill .maguro-dish__label {
	top: 62.942595%;
	left: -11.438530%;
}

@media screen and (min-width: 1024px) {
	.maguro-dish.-sushi {
		top: 1.15327rem ;
		left: 70.414374%;
		width: 32.502210%;
		height: 45.45458rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dish.-sushi {
		margin-left: 35.314439%;
		margin-top: 1.87321rem ;
		width: 69.552395%;
		height: auto;
		aspect-ratio: 278.209580 / 259.385400;
		max-width: 55.64192rem ;
	}
}

.maguro-dish.-sushi .maguro-dish__label {
	top: 38.677737%;
	left: -23.489200%;
}

@media screen and (min-width: 1024px) {
	.maguro-dish.-toro {
		top: 37.55867rem ;
		left: 54.428517%;
		width: 31.971714%;
		height: 43.35647rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dish.-toro {
		margin-left: -3.596849%;
		margin-top: -16.782525%;
		width: 68.417171%;
		height: auto;
		aspect-ratio: 273.668684 / 247.412600;
		max-width: 54.73374rem ;
	}
}

.maguro-dish.-toro .maguro-dish__label {
	top: 92.331275%;
	left: 19.942973%;
}

.maguro-dish__label {
	--color-line-maguro-ink: var( --maguro-ink );
	position: absolute;
	z-index: 1;
	border-radius: 0.5rem ;
	border: var(--solid-base) var(--color-line-maguro-ink);
	background-color: var(--color-white);
	background-image: none;
	white-space: nowrap;
	font-family: var(--font-sans-serif2);
	--line-height: 1.25;
}

@media screen and (min-width: 1024px) {
	.maguro-dish__label {
		font-size: 2.5375rem ;
		padding: 1.2rem 1.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.maguro-dish__label {
		font-size: var(--font-size14);
		padding: 0.9rem 1.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	#kuro .maguro-species__name {
		white-space: nowrap;
		letter-spacing: -0.025em;
	}
}

@media print {
	.maguro-quality__reel {
		-webkit-transform: none !important;
		transform: none !important;
	}
}

@media print {
	.maguro-species__reel {
		-webkit-transform: none !important;
		transform: none !important;
	}
}