/*
Theme Name: Cocoon Child
Template: cocoon-master
Version: 1.1.3
*/

/*
 * 遊漁船すい丸 トップページ用CSS
 *
 * 貼り付け先：
 * 外観 → テーマファイルエディター → Cocoon Child → style.css
 *
 * 既存の内容は削除せず、ファイルの一番下に追加してください。
 */

/* =========================
   基本設定
========================= */
:root {
	--suimaru-navy: #06384d;
	--suimaru-deep: #042a3a;
	--suimaru-blue: #087da2;
	--suimaru-light-blue: #eaf6fa;
	--suimaru-gold: #d9b26f;
	--suimaru-green: #25d366;
	--suimaru-text: #17313c;
	--suimaru-white: #ffffff;
	--suimaru-max: 1180px;
}

.suimaru-home,
.suimaru-home * {
	box-sizing: border-box;
}

.suimaru-home {
	color: var(--suimaru-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP",
		"Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	line-height: 1.8;
	overflow: hidden;
}

.suimaru-home h1,
.suimaru-home h2,
.suimaru-home h3,
.suimaru-home p {
	margin-top: 0;
}

.suimaru-home a {
	text-decoration: none;
}

.suimaru-inner {
	width: min(calc(100% - 40px), var(--suimaru-max));
	margin-inline: auto;
}

.suimaru-section {
	padding: 88px 0;
}

.suimaru-section--pale {
	background: #f3f8fa;
}

.suimaru-section--dark {
	background: var(--suimaru-deep);
	color: #d9e8ed;
}

.suimaru-section--dark h2 {
	color: #ffffff;
}

.suimaru-kicker {
	margin-bottom: 8px;
	color: var(--suimaru-blue);
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.22em;
}

.suimaru-kicker--light {
	color: #91d3e8;
}

.suimaru-home h2 {
	margin-bottom: 28px;
	color: var(--suimaru-navy);
	font-size: clamp(1.8rem, 3vw, 2.7rem);
	line-height: 1.35;
}

.suimaru-section-lead {
	max-width: 820px;
	margin-bottom: 38px;
	font-size: 1.05rem;
}

.suimaru-two-column {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 70px;
	align-items: start;
}

/* =========================
   ファーストビュー
========================= */
.suimaru-hero {
	position: relative;
	display: grid;
	min-height: 690px;
	align-items: center;
	overflow: hidden;
	background: var(--suimaru-deep);
}

.suimaru-hero__image {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(6, 56, 77, 0.08), rgba(6, 56, 77, 0.1)),
		url("https://suimaru.net/wp-content/uploads/suimaru-boat-placeholder.svg")
		center / cover no-repeat;
}

/*
 * 上記画像URLは、メディアにアップロードした画像URLへ変更してください。
 * SVGがアップロードできない場合は、WebPまたはJPEG画像を使用してください。
 */

.suimaru-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(2, 27, 39, 0.9) 0%,
		rgba(2, 39, 54, 0.66) 48%,
		rgba(2, 39, 54, 0.13) 100%
	);
}

.suimaru-hero__content {
	position: relative;
	z-index: 2;
	width: min(calc(100% - 40px), var(--suimaru-max));
	margin: auto;
	padding: 80px 0;
	color: #ffffff;
}

.suimaru-eyebrow {
	display: inline-block;
	margin-bottom: 22px;
	padding: 7px 14px;
	border: 1px solid rgba(255, 255, 255, 0.6);
	font-size: 0.85rem;
	letter-spacing: 0.1em;
}

.suimaru-hero h1 {
	margin-bottom: 24px;
	color: #ffffff;
	font-size: clamp(2.5rem, 6vw, 5rem);
	line-height: 1.17;
	letter-spacing: 0.05em;
}

.suimaru-hero__lead {
	font-size: clamp(1rem, 2vw, 1.2rem);
}

.suimaru-image-note {
	margin-top: 18px;
	font-size: 0.76rem;
	opacity: 0.78;
}

.suimaru-capacity {
	position: absolute;
	right: max(20px, calc((100vw - var(--suimaru-max)) / 2));
	bottom: 34px;
	z-index: 3;
	display: flex;
	width: 132px;
	height: 132px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(255, 255, 255, 0.72);
	border-radius: 50%;
	background: rgba(2, 39, 54, 0.34);
	color: #ffffff;
	backdrop-filter: blur(7px);
}

.suimaru-capacity small {
	font-size: 0.62rem;
	letter-spacing: 0.18em;
}

.suimaru-capacity strong {
	font-size: 2.7rem;
	line-height: 1;
}

.suimaru-capacity span {
	font-size: 0.7rem;
}

/* =========================
   ボタン
========================= */
.suimaru-buttons {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	margin-top: 34px;
}

.suimaru-buttons--center {
	justify-content: center;
}

.suimaru-btn {
	display: inline-flex;
	min-height: 54px;
	align-items: center;
	justify-content: center;
	padding: 13px 28px;
	border-radius: 4px;
	font-weight: 800;
	transition: transform 0.2s, opacity 0.2s;
}

.suimaru-btn:hover {
	transform: translateY(-2px);
	opacity: 0.92;
}

.suimaru-btn--line {
	background: var(--suimaru-green);
	color: #073a30 !important;
}

.suimaru-btn--ghost {
	border: 1px solid #ffffff;
	background: rgba(255, 255, 255, 0.07);
	color: #ffffff !important;
}

.suimaru-btn--dark {
	background: var(--suimaru-navy);
	color: #ffffff !important;
}

.suimaru-text-link {
	color: var(--suimaru-blue) !important;
	font-weight: 800;
}

/* =========================
   船長紹介
========================= */
.suimaru-captain {
	display: grid;
	grid-template-columns: minmax(280px, 0.8fr) 1.2fr;
	gap: 70px;
	align-items: center;
}

.suimaru-captain__photo {
	display: grid;
	min-height: 480px;
	place-items: center;
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: linear-gradient(145deg, #144d63, #082d3c);
	color: #b8d3dc;
	text-align: center;
	letter-spacing: 0.1em;
}

.suimaru-profile {
	margin-top: 30px;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.suimaru-profile div {
	display: grid;
	grid-template-columns: 110px 1fr;
	padding: 12px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.suimaru-profile dt {
	color: #8fc6d8;
	font-size: 0.78rem;
}

.suimaru-profile dd {
	margin: 0;
	color: #ffffff;
	font-weight: 700;
}

/* =========================
   料金・プラン
========================= */
.suimaru-price-list {
	border-top: 1px solid #bcced5;
}

.suimaru-price-list article {
	display: grid;
	grid-template-columns: 1fr 220px;
	gap: 30px;
	align-items: center;
	padding: 30px 0;
	border-bottom: 1px solid #bcced5;
}

.suimaru-plan-number {
	color: var(--suimaru-blue);
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.15em;
}

.suimaru-price-list h3 {
	margin: 6px 0;
	color: var(--suimaru-navy);
	font-size: 1.35rem;
}

.suimaru-price {
	display: grid;
	padding-left: 30px;
	border-left: 1px solid #c7d8de;
	text-align: right;
}

.suimaru-price small,
.suimaru-price em {
	color: #6c8088;
	font-size: 0.72rem;
	font-style: normal;
}

.suimaru-price strong {
	color: var(--suimaru-navy);
	font-size: 1.35rem;
}

.suimaru-notice {
	margin-top: 38px;
	padding: 28px;
	border-left: 4px solid var(--suimaru-blue);
	background: #ffffff;
}

.suimaru-notice h3 {
	color: var(--suimaru-navy);
	font-size: 1.05rem;
}

.suimaru-notice ul {
	margin-bottom: 0;
}

/* =========================
   最新釣果
========================= */
.suimaru-heading-row {
	display: flex;
	gap: 20px;
	align-items: end;
	justify-content: space-between;
	margin-bottom: 28px;
}

.suimaru-heading-row h2 {
	margin-bottom: 0;
}

.suimaru-post-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 26px;
}

.suimaru-post-card a {
	color: inherit;
}

.suimaru-post-card__image {
	display: grid;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	place-items: center;
	background: linear-gradient(145deg, #b9dce8, #5b9cb3);
	color: #ffffff;
	font-weight: 800;
}

.suimaru-post-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s;
}

.suimaru-post-card a:hover img {
	transform: scale(1.04);
}

.suimaru-post-card time {
	display: block;
	margin: 14px 0 4px;
	color: #6b7d84;
	font-size: 0.78rem;
}

.suimaru-post-card h3 {
	color: var(--suimaru-navy);
	font-size: 1rem;
	line-height: 1.6;
}

/* =========================
   対象魚
========================= */
.suimaru-target {
	background: linear-gradient(135deg, #052a3a, #075b78);
	color: #ffffff;
}

.suimaru-target h2 {
	color: #ffffff;
}

.suimaru-target-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid rgba(255, 255, 255, 0.25);
	border-left: 1px solid rgba(255, 255, 255, 0.25);
}

.suimaru-target-grid article {
	min-height: 220px;
	padding: 26px;
	border-right: 1px solid rgba(255, 255, 255, 0.25);
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.suimaru-target-grid span {
	color: #91d3e8;
	font-size: 0.7rem;
}

.suimaru-target-grid h3 {
	margin: 45px 0 10px;
	color: #ffffff;
	font-size: 1.3rem;
}

.suimaru-target-grid p {
	color: #c9dce3;
	font-size: 0.9rem;
}

/* =========================
   魚図鑑
========================= */
.suimaru-fish-guide {
	background: var(--suimaru-light-blue);
}

.suimaru-fish-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin: 36px 0;
}

.suimaru-fish-grid a {
	display: flex;
	min-height: 210px;
	flex-direction: column;
	justify-content: flex-end;
	padding: 25px;
	border: 1px solid rgba(8, 125, 162, 0.14);
	background: linear-gradient(155deg, #ffffff 0%, #d8edf3 100%);
	color: var(--suimaru-navy) !important;
	transition: transform 0.2s;
}

.suimaru-fish-grid a:hover {
	transform: translateY(-4px);
}

.suimaru-fish-grid span {
	color: var(--suimaru-blue);
	font-size: 0.76rem;
	letter-spacing: 0.15em;
}

.suimaru-fish-grid strong {
	margin: 6px 0;
	font-size: 1.28rem;
}

.suimaru-fish-grid small {
	color: #5c747d;
}

.suimaru-center {
	margin-top: 34px;
	text-align: center;
}

/* =========================
   海の体験
========================= */
.suimaru-experience {
	background: #ffffff;
}

.suimaru-experience-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}

.suimaru-experience-grid article {
	position: relative;
	min-height: 280px;
	padding: 32px;
	border-top: 3px solid var(--suimaru-blue);
	background: #f5f9fa;
}

.suimaru-experience-grid h3 {
	margin-top: 52px;
	color: var(--suimaru-navy);
	font-size: 1.25rem;
}

.suimaru-status {
	position: absolute;
	top: 26px;
	left: 32px;
	display: inline-block;
	padding: 4px 11px;
	border-radius: 20px;
	background: var(--suimaru-gold);
	color: #263b43;
	font-size: 0.72rem;
	font-weight: 800;
}

.suimaru-wildlife-note {
	margin-top: 28px;
	padding: 17px 20px;
	border: 1px solid #d7e5e9;
	color: #50666f;
	font-size: 0.88rem;
}

/* =========================
   初心者
========================= */
.suimaru-steps {
	margin: 0;
	padding: 0;
	list-style: none;
}

.suimaru-steps li {
	display: flex;
	gap: 18px;
	align-items: center;
	padding: 18px 0;
	border-bottom: 1px solid #cbdce2;
}

.suimaru-steps b {
	color: var(--suimaru-blue);
	font-size: 0.8rem;
	letter-spacing: 0.1em;
}

.suimaru-steps span {
	color: var(--suimaru-navy);
	font-weight: 700;
}

/* =========================
   予約
========================= */
.suimaru-reservation {
	padding: 86px 0;
	background: linear-gradient(135deg, var(--suimaru-deep), #075d7b);
	color: #ffffff;
	text-align: center;
}

.suimaru-reservation h2 {
	color: #ffffff;
}

.suimaru-registration {
	display: flex;
	max-width: 600px;
	gap: 18px;
	justify-content: center;
	flex-wrap: wrap;
	margin: 35px auto 0;
	padding-top: 25px;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	font-size: 0.85rem;
}

.suimaru-registration strong {
	color: #ffffff;
}

/* =========================
   スマートフォン固定メニュー
========================= */
.suimaru-mobile-fixed {
	display: none;
}

/* =========================
   Cocoonトップページ調整
========================= */
.suimaru-front-page .entry-title,
.suimaru-front-page .date-tags,
.suimaru-front-page .sns-share,
.suimaru-front-page .sns-follow,
.suimaru-front-page .author-info,
.suimaru-front-page .article-header {
	display: none;
}

.suimaru-front-page .entry-content {
	margin-top: 0;
}

.suimaru-front-page #main,
.suimaru-front-page .main {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.suimaru-front-page .content-in {
	width: 100%;
	max-width: none;
}

.suimaru-front-page .article {
	margin: 0;
}

/* =========================
   タブレット
========================= */
@media screen and (max-width: 900px) {
	.suimaru-section {
		padding: 68px 0;
	}

	.suimaru-two-column,
	.suimaru-captain {
		grid-template-columns: 1fr;
		gap: 38px;
	}

	.suimaru-captain__photo {
		min-height: 360px;
	}

	.suimaru-post-grid,
	.suimaru-experience-grid {
		grid-template-columns: 1fr;
	}

	.suimaru-target-grid,
	.suimaru-fish-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* =========================
   スマートフォン
========================= */
@media screen and (max-width: 600px) {
	.suimaru-inner,
	.suimaru-hero__content {
		width: min(calc(100% - 28px), var(--suimaru-max));
	}

	.suimaru-section {
		padding: 54px 0;
	}

	.suimaru-hero {
		min-height: 610px;
		align-items: end;
	}

	.suimaru-hero__overlay {
		background: linear-gradient(
			180deg,
			rgba(2, 27, 39, 0.28) 0%,
			rgba(2, 27, 39, 0.9) 72%
		);
	}

	.suimaru-hero__content {
		padding: 80px 0 74px;
	}

	.suimaru-hero h1 {
		font-size: 2.35rem;
	}

	.suimaru-hero__lead br {
		display: none;
	}

	.suimaru-capacity {
		right: 16px;
		bottom: 18px;
		width: 92px;
		height: 92px;
	}

	.suimaru-capacity strong {
		font-size: 2rem;
	}

	.suimaru-buttons {
		display: grid;
	}

	.suimaru-btn {
		width: 100%;
	}

	.suimaru-price-list article {
		grid-template-columns: 1fr;
	}

	.suimaru-price {
		padding: 16px 0 0;
		border-top: 1px solid #d4e0e4;
		border-left: 0;
		text-align: left;
	}

	.suimaru-heading-row {
		display: block;
	}

	.suimaru-heading-row .suimaru-text-link {
		display: inline-block;
		margin-top: 14px;
	}

	.suimaru-target-grid,
	.suimaru-fish-grid {
		grid-template-columns: 1fr;
	}

	.suimaru-target-grid article {
		min-height: 180px;
	}

	.suimaru-fish-grid a {
		min-height: 150px;
	}

	.suimaru-mobile-fixed {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 99999;
		display: grid;
		grid-template-columns: 1fr 1fr;
		box-shadow: 0 -4px 18px rgba(4, 42, 58, 0.18);
	}

	.suimaru-mobile-fixed a {
		display: grid;
		min-height: 58px;
		place-items: center;
		color: #ffffff !important;
		font-size: 0.9rem;
		font-weight: 800;
	}

	.suimaru-mobile-fixed__line {
		background: #20bd5a;
	}

	.suimaru-mobile-fixed__plans {
		background: var(--suimaru-navy);
	}

	body.suimaru-front-page {
		padding-bottom: 58px;
	}
}


/* =========================
   小瀬港・集合場所・駐車場
========================= */
.suimaru-access {
	background: #ffffff;
}

.suimaru-access-grid {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 50px;
	align-items: start;
}

.suimaru-access-map__placeholder {
	display: flex;
	min-height: 350px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px;
	padding: 30px;
	background:
		linear-gradient(rgba(5, 49, 68, 0.72), rgba(5, 49, 68, 0.72)),
		linear-gradient(135deg, #7eb4c5, #d9edf3);
	color: #ffffff;
	text-align: center;
}

.suimaru-access-map__placeholder span {
	margin-bottom: 14px;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.22em;
}

.suimaru-access-map__placeholder strong {
	font-size: 2rem;
	letter-spacing: 0.08em;
}

.suimaru-access-map__placeholder small {
	margin-top: 8px;
	font-size: 0.84rem;
}

.suimaru-access-map .suimaru-btn {
	width: 100%;
}

.suimaru-access-info dl {
	margin: 0;
	border-top: 1px solid #cadbe1;
}

.suimaru-access-info dl > div {
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: 20px;
	padding: 17px 0;
	border-bottom: 1px solid #cadbe1;
}

.suimaru-access-info dt {
	color: var(--suimaru-blue);
	font-size: 0.82rem;
	font-weight: 800;
}

.suimaru-access-info dd {
	margin: 0;
	color: var(--suimaru-text);
}

.suimaru-access-notice {
	margin-top: 28px;
	padding: 25px;
	border-left: 4px solid var(--suimaru-gold);
	background: #f7fafb;
}

.suimaru-access-notice h3 {
	margin-bottom: 12px;
	color: var(--suimaru-navy);
	font-size: 1rem;
}

.suimaru-access-notice ul {
	margin-bottom: 0;
	padding-left: 1.3em;
}

.suimaru-arrival-flow {
	margin-top: 50px;
	padding: 34px;
	background: var(--suimaru-light-blue);
}

.suimaru-arrival-flow h3 {
	margin-bottom: 20px;
	color: var(--suimaru-navy);
}

.suimaru-arrival-flow ol {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.suimaru-arrival-flow li {
	min-height: 145px;
	padding: 20px;
	background: #ffffff;
}

.suimaru-arrival-flow b {
	display: block;
	margin-bottom: 12px;
	color: var(--suimaru-blue);
	font-size: 0.76rem;
	letter-spacing: 0.1em;
}

.suimaru-arrival-flow span {
	color: var(--suimaru-navy);
	font-size: 0.92rem;
	font-weight: 700;
}

@media screen and (max-width: 900px) {
	.suimaru-access-grid {
		grid-template-columns: 1fr;
		gap: 35px;
	}

	.suimaru-arrival-flow ol {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 600px) {
	.suimaru-access-map__placeholder {
		min-height: 250px;
	}

	.suimaru-access-info dl > div {
		grid-template-columns: 1fr;
		gap: 5px;
	}

	.suimaru-arrival-flow {
		padding: 22px;
	}

	.suimaru-arrival-flow ol {
		grid-template-columns: 1fr;
	}

	.suimaru-arrival-flow li {
		min-height: auto;
	}
}


/* =========================
   鮮魚販売
========================= */
.suimaru-shop {
	background: #f7f2e9;
}

.suimaru-shop-heading {
	display: flex;
	gap: 30px;
	align-items: flex-start;
	justify-content: space-between;
}

.suimaru-shop-heading > div {
	max-width: 820px;
}

.suimaru-shop-status {
	flex: 0 0 auto;
	padding: 8px 16px;
	border: 1px solid #a77c3c;
	border-radius: 999px;
	color: #725321;
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.08em;
}

.suimaru-shop-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.suimaru-shop-card {
	overflow: hidden;
	background: #ffffff;
	box-shadow: 0 12px 32px rgba(61, 48, 27, 0.08);
}

.suimaru-shop-card__image {
	display: grid;
	aspect-ratio: 4 / 3;
	place-items: center;
	background: linear-gradient(145deg, #d7e7ea, #8fb8c1);
	color: #ffffff;
	font-weight: 800;
}

.suimaru-shop-card__body {
	padding: 25px;
}

.suimaru-shop-card__body small {
	color: #9a7439;
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.13em;
}

.suimaru-shop-card__body h3 {
	margin: 8px 0 12px;
	color: var(--suimaru-navy);
	font-size: 1.22rem;
}

.suimaru-shop-card__body strong {
	display: block;
	margin-top: 18px;
	color: #7a5928;
}

.suimaru-shop-flow {
	margin-top: 40px;
	padding: 32px;
	background: #ffffff;
}

.suimaru-shop-flow h3 {
	margin-bottom: 20px;
	color: var(--suimaru-navy);
}

.suimaru-shop-flow ol {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.suimaru-shop-flow li {
	min-height: 130px;
	padding: 20px;
	background: #f8faf9;
}

.suimaru-shop-flow b {
	display: block;
	margin-bottom: 10px;
	color: #9a7439;
	font-size: 0.75rem;
	letter-spacing: 0.1em;
}

.suimaru-shop-flow span {
	color: var(--suimaru-navy);
	font-size: 0.9rem;
	font-weight: 700;
}

.suimaru-shop-links {
	display: flex;
	gap: 22px;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 32px;
}

.suimaru-shop-note {
	margin-top: 34px;
	padding: 24px;
	border-left: 4px solid #b68b48;
	background: rgba(255, 255, 255, 0.72);
}

.suimaru-shop-note h3 {
	margin-bottom: 8px;
	color: var(--suimaru-navy);
	font-size: 1rem;
}

.suimaru-shop-note p {
	margin-bottom: 0;
	font-size: 0.88rem;
}

@media screen and (max-width: 900px) {
	.suimaru-shop-grid {
		grid-template-columns: 1fr;
	}

	.suimaru-shop-flow ol {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 600px) {
	.suimaru-shop-heading {
		display: block;
	}

	.suimaru-shop-status {
		display: inline-block;
		margin-bottom: 28px;
	}

	.suimaru-shop-flow {
		padding: 22px;
	}

	.suimaru-shop-flow ol {
		grid-template-columns: 1fr;
	}

	.suimaru-shop-flow li {
		min-height: auto;
	}

	.suimaru-shop-links {
		display: grid;
	}

	.suimaru-shop-links .suimaru-btn {
		width: 100%;
	}
}


/* 外部ECサイト誘導ボタン */
.suimaru-shop-external {
	margin-top: 38px;
	padding: 34px;
	background: #ffffff;
	text-align: center;
}

.suimaru-shop-external p {
	margin-bottom: 18px;
	color: var(--suimaru-navy);
	font-weight: 700;
}

.suimaru-btn--shop {
	background: #9a7439;
	color: #ffffff !important;
}

.suimaru-shop-external small {
	display: block;
	margin-top: 14px;
	color: #6b7478;
	font-size: 0.76rem;
}

@media screen and (max-width: 600px) {
	.suimaru-shop-external {
		padding: 24px 18px;
	}
}


/* 串木野近海で狙う魚：見出し色を強制的に白へ */
.suimaru-home .suimaru-target h2,
.suimaru-home .suimaru-target .suimaru-kicker {
	color: #ffffff !important;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.28);
}

.suimaru-home .suimaru-target .suimaru-kicker {
	opacity: 0.92;
}


/* v9：対象魚の説明文を詳しくした際の読みやすさ調整 */
.suimaru-target-grid article {
	min-height: 300px;
}

.suimaru-target-grid h3 {
	margin-top: 34px;
}

.suimaru-target-grid p {
	line-height: 1.75;
}

@media screen and (max-width: 900px) {
	.suimaru-target-grid article {
		min-height: 260px;
	}
}

@media screen and (max-width: 600px) {
	.suimaru-target-grid article {
		min-height: auto;
	}
}


/* =====================================================
   v10：濃紺・白・ゴールドの海洋デザイン
   見本画像の雰囲気を参考に、すい丸用に新規設計
===================================================== */
:root {
	--suimaru-navy: #002d62;
	--suimaru-deep: #001b42;
	--suimaru-blue: #075fb8;
	--suimaru-light-blue: #eaf5fb;
	--suimaru-gold: #dfb94f;
	--suimaru-cream: #faf7ef;
	--suimaru-text: #17314f;
}

.suimaru-home {
	background:
		linear-gradient(rgba(0, 35, 77, 0.93), rgba(0, 35, 77, 0.93)),
		radial-gradient(circle at 50% 10%, #087bb8 0%, #002d62 55%, #001b42 100%);
	color: #ffffff;
}

.suimaru-home .suimaru-section {
	position: relative;
}

.suimaru-home .suimaru-section:not(.suimaru-target):not(.suimaru-section--dark):not(.suimaru-reservation) {
	background: var(--suimaru-cream);
	color: var(--suimaru-text);
}

.suimaru-home .suimaru-section--pale {
	background: #f4f8fb;
}

/* ヘッダー */
.suimaru-site-header {
	position: sticky;
	top: 0;
	z-index: 9998;
	border-bottom: 2px solid var(--suimaru-gold);
	background: rgba(0, 27, 66, 0.97);
	box-shadow: 0 8px 24px rgba(0, 17, 45, 0.24);
	backdrop-filter: blur(10px);
}

.suimaru-site-header__inner {
	display: flex;
	width: min(calc(100% - 32px), var(--suimaru-max));
	min-height: 92px;
	align-items: center;
	justify-content: space-between;
	margin: auto;
	gap: 26px;
}

.suimaru-brand {
	display: flex;
	align-items: center;
	gap: 12px;
	color: #ffffff !important;
}

.suimaru-brand__mark {
	display: grid;
	width: 64px;
	height: 64px;
	place-items: center;
	border: 2px solid #ffffff;
	border-radius: 50%;
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size: 1rem;
	font-weight: 800;
}

.suimaru-brand__text {
	display: grid;
	line-height: 1.05;
}

.suimaru-brand__text small {
	font-size: 0.8rem;
	letter-spacing: 0.16em;
}

.suimaru-brand__text strong {
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size: 2.1rem;
	letter-spacing: 0.12em;
}

.suimaru-global-nav {
	display: flex;
	gap: 22px;
	align-items: center;
}

.suimaru-global-nav a {
	position: relative;
	color: #ffffff !important;
	font-size: 0.9rem;
	font-weight: 700;
	white-space: nowrap;
}

.suimaru-global-nav a::after {
	position: absolute;
	right: 0;
	bottom: -8px;
	left: 0;
	height: 2px;
	background: var(--suimaru-gold);
	content: "";
	transform: scaleX(0);
	transition: transform 0.2s;
}

.suimaru-global-nav a:hover::after {
	transform: scaleX(1);
}

.suimaru-header-contact {
	display: grid;
	min-width: 180px;
	min-height: 62px;
	place-content: center;
	padding: 10px 22px;
	border-radius: 4px;
	background: linear-gradient(135deg, #237de3, #0753b3);
	color: #ffffff !important;
	text-align: center;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.2);
}

.suimaru-header-contact span {
	font-size: 0.72rem;
}

.suimaru-header-contact strong {
	font-size: 1rem;
}

/* ファーストビュー */
.suimaru-home .suimaru-hero {
	min-height: 620px;
	border-bottom: 1px solid rgba(223, 185, 79, 0.55);
}

.suimaru-home .suimaru-hero__overlay {
	background:
		linear-gradient(90deg, rgba(0, 19, 51, .92), rgba(0, 45, 98, .58), rgba(0, 40, 83, .18)),
		linear-gradient(180deg, transparent 65%, rgba(0, 27, 66, .72));
}

.suimaru-home .suimaru-eyebrow {
	border-color: var(--suimaru-gold);
	color: #fff6cf;
}

.suimaru-home .suimaru-hero h1 {
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	text-shadow: 0 4px 20px rgba(0, 14, 42, .65);
}

.suimaru-home .suimaru-capacity {
	border-color: var(--suimaru-gold);
	background: rgba(0, 31, 76, .72);
}

/* 見出し */
.suimaru-home h2 {
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	letter-spacing: .08em;
}

.suimaru-home .suimaru-kicker {
	color: #a67c20;
}

.suimaru-home .suimaru-kicker--light {
	color: #f3d578;
}

/* 対象魚セクション */
.suimaru-home .suimaru-target {
	padding: 80px 0 92px;
	background:
		linear-gradient(rgba(0, 35, 77, .82), rgba(0, 35, 77, .95)),
		repeating-linear-gradient(0deg, transparent 0, transparent 34px, rgba(255,255,255,.035) 35px);
}

.suimaru-home .suimaru-target::before {
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 50% -20%, rgba(30, 135, 192, .6), transparent 52%);
	content: "";
	pointer-events: none;
}

.suimaru-home .suimaru-target .suimaru-inner {
	position: relative;
	z-index: 1;
}

.suimaru-home .suimaru-target h2 {
	margin-bottom: 12px;
	color: #ffffff !important;
	font-size: clamp(2rem, 4vw, 3.4rem);
	text-align: center;
	text-shadow: 0 3px 14px rgba(0,0,0,.4);
}

.suimaru-home .suimaru-target > .suimaru-inner > .suimaru-kicker {
	text-align: center;
}

.suimaru-home .suimaru-target-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	margin-top: 34px;
	border: 0;
}

.suimaru-home .suimaru-target-grid article {
	display: flex;
	min-height: 0;
	flex-direction: column;
	overflow: hidden;
	padding: 0;
	border: 1px solid rgba(223, 185, 79, .42);
	border-radius: 5px;
	background: linear-gradient(180deg, #fbf8f0 0 48%, #003167 48% 100%);
	box-shadow: 0 14px 30px rgba(0, 14, 40, .3);
}

.suimaru-target-image {
	display: grid;
	min-height: 250px;
	place-items: center;
	padding: 20px 10px;
	background: #fbf8f0;
}

.suimaru-target-image img {
	display: block;
	width: 100%;
	max-width: 300px;
	height: 215px;
	margin: auto;
	object-fit: contain;
	filter: drop-shadow(0 10px 9px rgba(0, 34, 66, .14));
}

.suimaru-target-card__body {
	flex: 1;
	padding: 22px 18px 24px;
	background: linear-gradient(180deg, #00366f, #002657);
}

.suimaru-target-title {
	display: flex;
	gap: 14px;
	align-items: center;
	padding-bottom: 14px;
	border-bottom: 1px dotted rgba(255,255,255,.52);
}

.suimaru-home .suimaru-target-title span {
	color: var(--suimaru-gold);
	font-family: Georgia, serif;
	font-size: 2rem;
	font-weight: 800;
	line-height: 1;
}

.suimaru-home .suimaru-target-grid h3 {
	margin: 0;
	color: #ffffff;
	font-size: 1.35rem;
}

.suimaru-home .suimaru-target-grid p {
	margin: 16px 0 0;
	color: #ffffff;
	font-size: .91rem;
	line-height: 1.85;
}

.suimaru-target-note {
	margin: 24px 0 0;
	color: rgba(255,255,255,.82);
	font-size: .82rem;
	text-align: center;
}

/* 料金表を見本画像風に */
.suimaru-home #suimaru-plans .suimaru-inner {
	padding: 48px;
	border-radius: 6px;
	background: #fffdf8;
	box-shadow: 0 20px 50px rgba(0, 31, 70, .12);
}

.suimaru-home #suimaru-plans h2 {
	color: var(--suimaru-navy);
	text-align: center;
}

.suimaru-home #suimaru-plans h2::before,
.suimaru-home #suimaru-plans h2::after {
	display: inline-block;
	width: 70px;
	height: 1px;
	margin: 0 18px 9px;
	background: var(--suimaru-navy);
	content: "";
}

.suimaru-home .suimaru-price-list {
	overflow: hidden;
	border: 1px solid #bcc8d5;
	border-radius: 4px;
}

.suimaru-home .suimaru-price-list::before {
	display: grid;
	grid-template-columns: 1fr 220px;
	padding: 12px 0;
	background: linear-gradient(180deg, #063c79, #002d62);
	color: #ffffff;
	font-weight: 800;
	content: "プラン　　　　　　　　　　　　　　　料金";
	text-align: center;
	white-space: pre;
}

.suimaru-home .suimaru-price-list article {
	padding: 18px 24px;
	border-bottom: 1px solid #c8d1da;
	background: #ffffff;
}

.suimaru-home .suimaru-price-list article:last-child {
	border-bottom: 0;
}

.suimaru-home .suimaru-price-list h3 {
	color: #102b50;
}

.suimaru-home .suimaru-price {
	border-left: 1px solid #c8d1da;
}

.suimaru-home .suimaru-price strong {
	color: #102b50;
	font-size: 1.2rem;
}

/* 共通カード */
.suimaru-home .suimaru-post-card,
.suimaru-home .suimaru-shop-card,
.suimaru-home .suimaru-experience-grid article {
	border-radius: 5px;
	box-shadow: 0 10px 30px rgba(0, 31, 70, .11);
}

/* 予約 */
.suimaru-home .suimaru-reservation {
	border-top: 2px solid var(--suimaru-gold);
	background:
		linear-gradient(rgba(0, 36, 80, .9), rgba(0, 27, 66, .96)),
		linear-gradient(135deg, #0b6cab, #001b42);
}

.suimaru-home .suimaru-reservation h2 {
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
}

/* タブレット */
@media screen and (max-width: 1050px) {
	.suimaru-global-nav {
		display: none;
	}

	.suimaru-site-header__inner {
		min-height: 80px;
	}

	.suimaru-home .suimaru-target-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.suimaru-home .suimaru-price-list::before {
		display: none;
	}
}

/* スマートフォン */
@media screen and (max-width: 600px) {
	.suimaru-site-header__inner {
		width: calc(100% - 20px);
		min-height: 68px;
		gap: 10px;
	}

	.suimaru-brand__mark {
		width: 48px;
		height: 48px;
		font-size: .75rem;
	}

	.suimaru-brand__text small {
		font-size: .58rem;
	}

	.suimaru-brand__text strong {
		font-size: 1.32rem;
	}

	.suimaru-header-contact {
		min-width: 120px;
		min-height: 48px;
		padding: 8px 10px;
	}

	.suimaru-header-contact span {
		display: none;
	}

	.suimaru-header-contact strong {
		font-size: .78rem;
	}

	.suimaru-home .suimaru-target-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.suimaru-target-image {
		min-height: 220px;
	}

	.suimaru-target-image img {
		height: 190px;
	}

	.suimaru-home #suimaru-plans .suimaru-inner {
		width: calc(100% - 24px);
		padding: 28px 16px;
	}

	.suimaru-home #suimaru-plans h2::before,
	.suimaru-home #suimaru-plans h2::after {
		width: 28px;
		margin-inline: 8px;
	}

	.suimaru-home .suimaru-price-list article {
		padding: 18px;
	}

	.suimaru-home .suimaru-price {
		border-left: 0;
	}
}


/* =====================================================
   v11：魚カテゴリー復元・料金アイコン・海のアクセント
===================================================== */

/* 対象魚はカテゴリー名＋代表魚名 */
.suimaru-target-title > div {
	min-width: 0;
}

.suimaru-home .suimaru-target-title h3 {
	line-height: 1.2;
}

.suimaru-home .suimaru-target-title small {
	display: block;
	margin-top: 5px;
	color: #dbe9f7;
	font-size: .72rem;
	letter-spacing: .04em;
}

/* 料金プランのオリジナル線画アイコン */
.suimaru-home .suimaru-price-list article {
	grid-template-columns: 82px minmax(0, 1fr) 220px;
	gap: 22px;
	align-items: center;
}

.suimaru-plan-icon {
	display: grid;
	width: 66px;
	height: 66px;
	place-items: center;
	border: 1px solid #c7d7e5;
	border-radius: 50%;
	background: #edf5fb;
}

.suimaru-plan-icon svg {
	width: 42px;
	height: 42px;
	fill: none;
	stroke: #07569c;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.suimaru-plan-copy h3 {
	margin-bottom: 4px;
}

.suimaru-plan-copy p {
	margin-bottom: 0;
	font-size: .9rem;
}

/* セクション装飾 */
.suimaru-section-symbol {
	display: grid;
	width: 110px;
	height: 44px;
	place-items: center;
	margin: 0 auto 8px;
}

.suimaru-section-symbol svg {
	width: 100%;
	height: 100%;
	fill: none;
	stroke: var(--suimaru-gold);
	stroke-width: 2.4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.suimaru-section-symbol--fish svg {
	fill: rgba(223, 185, 79, .08);
}

.suimaru-home #suimaru-plans .suimaru-kicker,
.suimaru-home #suimaru-plans h2,
.suimaru-home .suimaru-fish-guide .suimaru-kicker,
.suimaru-home .suimaru-fish-guide h2,
.suimaru-home .suimaru-access .suimaru-kicker,
.suimaru-home .suimaru-access h2 {
	text-align: center;
}

/* 波の区切り */
.suimaru-concept::after,
.suimaru-fish-guide::after,
.suimaru-access::before {
	position: absolute;
	right: 0;
	left: 0;
	height: 24px;
	background:
		radial-gradient(28px 12px at 28px 0, transparent 27px, rgba(7, 95, 184, .16) 28px, transparent 30px)
		0 0 / 56px 24px repeat-x;
	content: "";
	pointer-events: none;
}

.suimaru-concept::after,
.suimaru-fish-guide::after {
	bottom: 0;
}

.suimaru-access::before {
	top: 0;
	transform: rotate(180deg);
}

/* 小さな魚アクセント */
.suimaru-post-card__image::after,
.suimaru-shop-card__image::after {
	position: absolute;
	right: 13px;
	bottom: 11px;
	width: 32px;
	height: 18px;
	background:
		linear-gradient(135deg, transparent 42%, rgba(255,255,255,.72) 43% 56%, transparent 57%)
		right center / 13px 18px no-repeat,
		ellipse at 38% 50%;
	content: "";
	opacity: .58;
}

.suimaru-post-card__image,
.suimaru-shop-card__image {
	position: relative;
}

/* 専用フッター */
.suimaru-custom-footer {
	border-top: 2px solid var(--suimaru-gold);
	background: #001a3e;
	color: #d8e5f2;
}

.suimaru-custom-footer__grid {
	display: grid;
	grid-template-columns: 1.35fr .85fr;
	gap: 45px 70px;
	padding-top: 55px;
	padding-bottom: 42px;
}

.suimaru-custom-footer__brand {
	display: flex;
	gap: 20px;
	align-items: center;
}

.suimaru-custom-footer__mark {
	display: grid;
	width: 82px;
	height: 82px;
	flex: 0 0 82px;
	place-items: center;
	border: 2px solid #fff;
	border-radius: 50%;
	color: #fff;
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size: 1.2rem;
	font-weight: 800;
}

.suimaru-custom-footer__brand small,
.suimaru-custom-footer__brand strong {
	display: block;
}

.suimaru-custom-footer__brand strong {
	margin: 4px 0;
	color: #fff;
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size: 1.8rem;
	letter-spacing: .1em;
}

.suimaru-custom-footer__brand p {
	margin-bottom: 0;
	font-size: .84rem;
}

.suimaru-custom-footer__nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 22px;
	align-content: center;
}

.suimaru-custom-footer__nav a {
	padding-bottom: 7px;
	border-bottom: 1px solid rgba(255,255,255,.13);
	color: #fff !important;
	font-size: .85rem;
}

.suimaru-custom-footer__legal {
	grid-column: 1 / -1;
	display: flex;
	gap: 20px;
	justify-content: space-between;
	padding-top: 22px;
	border-top: 1px solid rgba(255,255,255,.13);
	font-size: .76rem;
}

.suimaru-custom-footer__legal a {
	color: #d8e5f2 !important;
}

.suimaru-custom-footer__bottom {
	padding: 14px;
	background: #00132e;
	text-align: center;
}

/* Cocoon標準ヘッダー・フッターをトップページだけ非表示 */
body.suimaru-front-page #header-container,
body.suimaru-front-page #header-container-in,
body.suimaru-front-page .header-container,
body.suimaru-front-page .navi,
body.suimaru-front-page #navi,
body.suimaru-front-page #footer,
body.suimaru-front-page .footer,
body.suimaru-front-page #footer-in,
body.suimaru-front-page .footer-bottom,
body.suimaru-front-page .mobile-menu-buttons,
body.suimaru-front-page .mobile-footer-menu-buttons {
	display: none !important;
}

body.suimaru-front-page .content {
	margin-top: 0 !important;
}

/* レスポンシブ */
@media screen and (max-width: 900px) {
	.suimaru-home .suimaru-price-list article {
		grid-template-columns: 70px minmax(0, 1fr) 170px;
	}

	.suimaru-custom-footer__grid {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 600px) {
	.suimaru-home .suimaru-price-list article {
		grid-template-columns: 58px 1fr;
		gap: 12px;
	}

	.suimaru-plan-icon {
		width: 52px;
		height: 52px;
	}

	.suimaru-plan-icon svg {
		width: 34px;
		height: 34px;
	}

	.suimaru-home .suimaru-price {
		grid-column: 1 / -1;
		margin-top: 4px;
		padding-top: 14px;
		border-top: 1px solid #d5dee7;
	}

	.suimaru-custom-footer__grid {
		padding-top: 42px;
	}

	.suimaru-custom-footer__brand {
		align-items: flex-start;
	}

	.suimaru-custom-footer__mark {
		width: 62px;
		height: 62px;
		flex-basis: 62px;
		font-size: .9rem;
	}

	.suimaru-custom-footer__brand strong {
		font-size: 1.3rem;
	}

	.suimaru-custom-footer__nav {
		grid-template-columns: 1fr;
	}

	.suimaru-custom-footer__legal {
		display: grid;
	}
}


/* =====================================================
   v14：狙う魚と魚図鑑を統合
===================================================== */
.suimaru-target-lead {
	max-width: 840px;
	margin: 0 auto 34px;
	color: rgba(255, 255, 255, 0.9);
	font-size: 1.02rem;
	line-height: 1.9;
	text-align: center;
}

.suimaru-target-guide-links {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 30px;
}

.suimaru-target-guide-links .suimaru-btn--light {
	background: #ffffff;
	color: var(--suimaru-navy) !important;
}

@media screen and (max-width: 600px) {
	.suimaru-target-lead {
		text-align: left;
	}

	.suimaru-target-guide-links {
		display: grid;
	}

	.suimaru-target-guide-links .suimaru-btn {
		width: 100%;
	}
}


/* =====================================================
   v15：鹿児島の魚を全国発送するEC導線
===================================================== */
.suimaru-shop-message {
	margin: -10px 0 32px;
	padding: 24px 28px;
	border-left: 4px solid #b68b48;
	background: rgba(255, 255, 255, 0.72);
}

.suimaru-shop-message p {
	margin-bottom: 0;
	color: #243b4a;
	font-weight: 700;
	line-height: 1.9;
}

.suimaru-shop-card__image {
	position: relative;
	overflow: hidden;
}

.suimaru-shop-card__image--fisherman,
.suimaru-shop-card__image--fishshop,
.suimaru-shop-card__image--delivery {
	background:
		linear-gradient(rgba(0, 45, 98, .62), rgba(0, 45, 98, .62)),
		linear-gradient(135deg, #dcecf1, #7baec2);
}

.suimaru-shop-card__image--fisherman::before,
.suimaru-shop-card__image--fishshop::before,
.suimaru-shop-card__image--delivery::before {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: rgba(255,255,255,.22);
	font-size: 5rem;
	font-weight: 900;
	line-height: 1;
}

.suimaru-shop-card__image--fisherman::before {
	content: "漁";
}

.suimaru-shop-card__image--fishshop::before {
	content: "魚";
}

.suimaru-shop-card__image--delivery::before {
	content: "送";
}

.suimaru-shop-products {
	margin-top: 38px;
	padding: 32px;
	background: #ffffff;
	box-shadow: 0 12px 32px rgba(61, 48, 27, 0.06);
}

.suimaru-shop-products h3 {
	margin-bottom: 22px;
	color: var(--suimaru-navy);
	text-align: center;
}

.suimaru-shop-products__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}

.suimaru-shop-products__grid div {
	padding: 20px;
	border: 1px solid #e0d4bd;
	background: #fffaf0;
}

.suimaru-shop-products__grid span {
	display: block;
	margin-bottom: 10px;
	color: #9a7439;
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .12em;
}

.suimaru-shop-products__grid strong {
	display: block;
	margin-bottom: 8px;
	color: var(--suimaru-navy);
	font-size: 1rem;
}

.suimaru-shop-products__grid p {
	margin-bottom: 0;
	font-size: .86rem;
}

@media screen and (max-width: 900px) {
	.suimaru-shop-products__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 600px) {
	.suimaru-shop-message,
	.suimaru-shop-products {
		padding: 22px 18px;
	}

	.suimaru-shop-products__grid {
		grid-template-columns: 1fr;
	}
}


/* v16：自ら釣った魚＋提携先仕入れ販売 */
.suimaru-shop-card__image--suimaru {
	background:
		linear-gradient(rgba(0, 45, 98, .62), rgba(0, 45, 98, .62)),
		linear-gradient(135deg, #dcecf1, #7baec2);
}

.suimaru-shop-card__image--suimaru::before {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: rgba(255,255,255,.22);
	font-size: 5rem;
	font-weight: 900;
	line-height: 1;
	content: "釣";
}

.suimaru-shop-status {
	background: rgba(255, 255, 255, .78);
}


/* v17：すい丸釣果＋鹿児島提携先を混合して全国発送 */
.suimaru-shop-card__image--network,
.suimaru-shop-card__image--seasonal {
	position: relative;
	overflow: hidden;
	background:
		linear-gradient(rgba(0, 45, 98, .62), rgba(0, 45, 98, .62)),
		linear-gradient(135deg, #dcecf1, #7baec2);
}

.suimaru-shop-card__image--network::before,
.suimaru-shop-card__image--seasonal::before {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: rgba(255,255,255,.22);
	font-size: 5rem;
	font-weight: 900;
	line-height: 1;
}

.suimaru-shop-card__image--network::before {
	content: "鹿";
}

.suimaru-shop-card__image--seasonal::before {
	content: "旬";
}


/* v18：受注漁ニュアンスの魚販売セクション */
.suimaru-shop-card__image--order {
	position: relative;
	overflow: hidden;
	background:
		linear-gradient(rgba(0, 45, 98, .62), rgba(0, 45, 98, .62)),
		linear-gradient(135deg, #dcecf1, #7baec2);
}

.suimaru-shop-card__image--order::before {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: rgba(255,255,255,.22);
	font-size: 5rem;
	font-weight: 900;
	line-height: 1;
	content: "注";
}


/* =====================================================
   v25：狙う魚と魚図鑑を5魚種スライダー化
===================================================== */
.suimaru-target-slider {
	position: relative;
	overflow: hidden;
	margin-top: 34px;
	padding: 10px 0 20px;
}

.suimaru-target-slider::before,
.suimaru-target-slider::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 90px;
	z-index: 2;
	pointer-events: none;
}

.suimaru-target-slider::before {
	left: 0;
	background: linear-gradient(90deg, var(--suimaru-navy), rgba(8, 24, 44, 0));
}

.suimaru-target-slider::after {
	right: 0;
	background: linear-gradient(270deg, var(--suimaru-navy), rgba(8, 24, 44, 0));
}

.suimaru-target-track {
	display: flex;
	gap: 24px;
	width: max-content;
	animation: suimaruTargetSlide 36s linear infinite;
}

.suimaru-target-slider:hover .suimaru-target-track {
	animation-play-state: paused;
}

.suimaru-target-track .suimaru-target-card {
	flex: 0 0 330px;
}

@keyframes suimaruTargetSlide {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(calc(-5 * 354px));
	}
}

@media (prefers-reduced-motion: reduce) {
	.suimaru-target-track {
		animation: none;
		overflow-x: auto;
		max-width: 100%;
		scroll-snap-type: x mandatory;
	}

	.suimaru-target-track .suimaru-target-card {
		scroll-snap-align: start;
	}
}

@media screen and (max-width: 900px) {
	.suimaru-target-track .suimaru-target-card {
		flex-basis: 300px;
	}

	@keyframes suimaruTargetSlide {
		0% {
			transform: translateX(0);
		}
		100% {
			transform: translateX(calc(-5 * 324px));
		}
	}
}

@media screen and (max-width: 600px) {
	.suimaru-target-slider::before,
	.suimaru-target-slider::after {
		width: 38px;
	}

	.suimaru-target-track {
		gap: 16px;
		animation-duration: 32s;
	}

	.suimaru-target-track .suimaru-target-card {
		flex-basis: 82vw;
	}

	@keyframes suimaruTargetSlide {
		0% {
			transform: translateX(0);
		}
		100% {
			transform: translateX(calc(-5 * (82vw + 16px)));
		}
	}
}


/* =====================================================
   v28：対象魚スライダーを5秒ごとの切り替え型へ変更
===================================================== */
.suimaru-target-slider {
	overflow: hidden;
}

.suimaru-target-track {
	gap: 0 !important;
	width: 100% !important;
	animation: suimaruTargetStepSlide 25s infinite ease-in-out !important;
}

.suimaru-target-slider:hover .suimaru-target-track {
	animation-play-state: paused;
}

.suimaru-target-track .suimaru-target-card {
	flex: 0 0 100% !important;
	max-width: 100%;
	box-sizing: border-box;
	margin: 0;
}

@keyframes suimaruTargetStepSlide {
	0%, 16% {
		transform: translateX(0);
	}
	20%, 36% {
		transform: translateX(-100%);
	}
	40%, 56% {
		transform: translateX(-200%);
	}
	60%, 76% {
		transform: translateX(-300%);
	}
	80%, 96% {
		transform: translateX(-400%);
	}
	100% {
		transform: translateX(0);
	}
}

@media screen and (max-width: 900px) {
	.suimaru-target-track .suimaru-target-card {
		flex: 0 0 100% !important;
	}

	@keyframes suimaruTargetStepSlide {
		0%, 16% {
			transform: translateX(0);
		}
		20%, 36% {
			transform: translateX(-100%);
		}
		40%, 56% {
			transform: translateX(-200%);
		}
		60%, 76% {
			transform: translateX(-300%);
		}
		80%, 96% {
			transform: translateX(-400%);
		}
		100% {
			transform: translateX(0);
		}
	}
}

@media screen and (max-width: 600px) {
	.suimaru-target-track {
		gap: 0 !important;
		animation-duration: 25s !important;
	}

	.suimaru-target-track .suimaru-target-card {
		flex: 0 0 100% !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.suimaru-target-track {
		animation: none !important;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
	}

	.suimaru-target-track .suimaru-target-card {
		scroll-snap-align: start;
	}
}


/* =====================================================
   v30：対象魚スライダー 4枚表示＋5秒ごとに1枚スライド
===================================================== */
.suimaru-target-slider {
	position: relative;
	overflow: hidden !important;
	margin-top: 34px;
	padding: 10px 0 20px;
}

.suimaru-target-slider::before,
.suimaru-target-slider::after {
	display: none !important;
}

.suimaru-target-track {
	display: flex !important;
	gap: 22px !important;
	width: max-content !important;
	animation: suimaruTargetFourSlide 25s infinite ease-in-out !important;
	will-change: transform;
}

.suimaru-target-slider:hover .suimaru-target-track {
	animation-play-state: paused;
}

.suimaru-target-track .suimaru-target-card {
	flex: 0 0 calc((100vw - 120px) / 4) !important;
	max-width: 320px;
	min-width: 260px;
	box-sizing: border-box;
	margin: 0 !important;
}

.suimaru-target-title span {
	display: none !important;
}

.suimaru-target-title {
	display: block !important;
}

.suimaru-target-title h3 {
	margin: 0 0 12px !important;
	text-align: center;
}

.suimaru-target-image {
	background: transparent !important;
}

.suimaru-target-image img {
	background: transparent !important;
	object-fit: contain !important;
}

@keyframes suimaruTargetFourSlide {
	0%, 18% {
		transform: translateX(0);
	}
	20%, 38% {
		transform: translateX(calc(-1 * (((100vw - 120px) / 4) + 22px)));
	}
	40%, 58% {
		transform: translateX(calc(-2 * (((100vw - 120px) / 4) + 22px)));
	}
	60%, 78% {
		transform: translateX(calc(-3 * (((100vw - 120px) / 4) + 22px)));
	}
	80%, 98% {
		transform: translateX(calc(-4 * (((100vw - 120px) / 4) + 22px)));
	}
	100% {
		transform: translateX(0);
	}
}

@media screen and (min-width: 1240px) {
	.suimaru-target-track .suimaru-target-card {
		flex-basis: 282px !important;
	}

	@keyframes suimaruTargetFourSlide {
		0%, 18% {
			transform: translateX(0);
		}
		20%, 38% {
			transform: translateX(-304px);
		}
		40%, 58% {
			transform: translateX(-608px);
		}
		60%, 78% {
			transform: translateX(-912px);
		}
		80%, 98% {
			transform: translateX(-1216px);
		}
		100% {
			transform: translateX(0);
		}
	}
}

@media screen and (max-width: 900px) {
	.suimaru-target-track .suimaru-target-card {
		flex: 0 0 calc((100vw - 64px) / 2) !important;
		min-width: 260px;
	}

	@keyframes suimaruTargetFourSlide {
		0%, 18% {
			transform: translateX(0);
		}
		20%, 38% {
			transform: translateX(calc(-1 * (((100vw - 64px) / 2) + 22px)));
		}
		40%, 58% {
			transform: translateX(calc(-2 * (((100vw - 64px) / 2) + 22px)));
		}
		60%, 78% {
			transform: translateX(calc(-3 * (((100vw - 64px) / 2) + 22px)));
		}
		80%, 98% {
			transform: translateX(calc(-4 * (((100vw - 64px) / 2) + 22px)));
		}
		100% {
			transform: translateX(0);
		}
	}
}

@media screen and (max-width: 600px) {
	.suimaru-target-track {
		gap: 16px !important;
	}

	.suimaru-target-track .suimaru-target-card {
		flex: 0 0 86vw !important;
		min-width: auto;
		max-width: none;
	}

	@keyframes suimaruTargetFourSlide {
		0%, 18% {
			transform: translateX(0);
		}
		20%, 38% {
			transform: translateX(calc(-1 * (86vw + 16px)));
		}
		40%, 58% {
			transform: translateX(calc(-2 * (86vw + 16px)));
		}
		60%, 78% {
			transform: translateX(calc(-3 * (86vw + 16px)));
		}
		80%, 98% {
			transform: translateX(calc(-4 * (86vw + 16px)));
		}
		100% {
			transform: translateX(0);
		}
	}
}

@media (prefers-reduced-motion: reduce) {
	.suimaru-target-track {
		animation: none !important;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		max-width: 100%;
	}

	.suimaru-target-track .suimaru-target-card {
		scroll-snap-align: start;
	}
}


/* =====================================================
   v31：7魚種対応スライダー 4枚表示＋5秒ごとに1枚スライド
   順番：マダイ→ブリ→オオモンハタ→アオリイカ→アジ→ヒラスズキ→シロアマダイ→マダイ
===================================================== */
.suimaru-target-slider {
	position: relative;
	overflow: hidden !important;
	margin-top: 34px;
	padding: 10px 0 20px;
}

.suimaru-target-slider::before,
.suimaru-target-slider::after {
	display: none !important;
}

.suimaru-target-track {
	display: flex !important;
	gap: 22px !important;
	width: max-content !important;
	animation: suimaruTargetSevenSlide 35s infinite ease-in-out !important;
	will-change: transform;
}

.suimaru-target-slider:hover .suimaru-target-track {
	animation-play-state: paused;
}

.suimaru-target-track .suimaru-target-card {
	flex: 0 0 calc((100vw - 120px) / 4) !important;
	max-width: 320px;
	min-width: 260px;
	box-sizing: border-box;
	margin: 0 !important;
}

.suimaru-target-title span {
	display: none !important;
}

.suimaru-target-title {
	display: block !important;
}

.suimaru-target-title h3 {
	margin: 0 0 12px !important;
	text-align: center;
}

.suimaru-target-image,
.suimaru-target-image img {
	background: transparent !important;
}

.suimaru-target-image img {
	object-fit: contain !important;
}

@keyframes suimaruTargetSevenSlide {
	0%, 12% { transform: translateX(0); }
	14%, 26% { transform: translateX(calc(-1 * (((100vw - 120px) / 4) + 22px))); }
	28%, 40% { transform: translateX(calc(-2 * (((100vw - 120px) / 4) + 22px))); }
	42%, 54% { transform: translateX(calc(-3 * (((100vw - 120px) / 4) + 22px))); }
	56%, 68% { transform: translateX(calc(-4 * (((100vw - 120px) / 4) + 22px))); }
	70%, 82% { transform: translateX(calc(-5 * (((100vw - 120px) / 4) + 22px))); }
	84%, 96% { transform: translateX(calc(-6 * (((100vw - 120px) / 4) + 22px))); }
	100% { transform: translateX(0); }
}

@media screen and (min-width: 1240px) {
	.suimaru-target-track .suimaru-target-card {
		flex-basis: 282px !important;
	}

	@keyframes suimaruTargetSevenSlide {
		0%, 12% { transform: translateX(0); }
		14%, 26% { transform: translateX(-304px); }
		28%, 40% { transform: translateX(-608px); }
		42%, 54% { transform: translateX(-912px); }
		56%, 68% { transform: translateX(-1216px); }
		70%, 82% { transform: translateX(-1520px); }
		84%, 96% { transform: translateX(-1824px); }
		100% { transform: translateX(0); }
	}
}

@media screen and (max-width: 900px) {
	.suimaru-target-track .suimaru-target-card {
		flex: 0 0 calc((100vw - 64px) / 2) !important;
		min-width: 260px;
	}

	@keyframes suimaruTargetSevenSlide {
		0%, 12% { transform: translateX(0); }
		14%, 26% { transform: translateX(calc(-1 * (((100vw - 64px) / 2) + 22px))); }
		28%, 40% { transform: translateX(calc(-2 * (((100vw - 64px) / 2) + 22px))); }
		42%, 54% { transform: translateX(calc(-3 * (((100vw - 64px) / 2) + 22px))); }
		56%, 68% { transform: translateX(calc(-4 * (((100vw - 64px) / 2) + 22px))); }
		70%, 82% { transform: translateX(calc(-5 * (((100vw - 64px) / 2) + 22px))); }
		84%, 96% { transform: translateX(calc(-6 * (((100vw - 64px) / 2) + 22px))); }
		100% { transform: translateX(0); }
	}
}

@media screen and (max-width: 600px) {
	.suimaru-target-track {
		gap: 16px !important;
	}

	.suimaru-target-track .suimaru-target-card {
		flex: 0 0 86vw !important;
		min-width: auto;
		max-width: none;
	}

	@keyframes suimaruTargetSevenSlide {
		0%, 12% { transform: translateX(0); }
		14%, 26% { transform: translateX(calc(-1 * (86vw + 16px))); }
		28%, 40% { transform: translateX(calc(-2 * (86vw + 16px))); }
		42%, 54% { transform: translateX(calc(-3 * (86vw + 16px))); }
		56%, 68% { transform: translateX(calc(-4 * (86vw + 16px))); }
		70%, 82% { transform: translateX(calc(-5 * (86vw + 16px))); }
		84%, 96% { transform: translateX(calc(-6 * (86vw + 16px))); }
		100% { transform: translateX(0); }
	}
}


/* =====================================================
   v34：緊急安定版
   対象魚セクションをJSなしの横スクロール表示へ戻す
   テーマ破損防止のため、style.css冒頭には子テーマヘッダー必須
===================================================== */
.suimaru-target-slider {
	position: relative;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	margin-top: 34px;
	padding: 10px 4px 24px;
	width: 100%;
	box-sizing: border-box;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
}

.suimaru-target-slider::before,
.suimaru-target-slider::after {
	display: none !important;
}

.suimaru-target-track {
	display: flex !important;
	gap: 22px !important;
	width: max-content !important;
	max-width: none !important;
	animation: none !important;
	transform: none !important;
	transition: none !important;
}

.suimaru-target-track .suimaru-target-card {
	flex: 0 0 280px !important;
	width: 280px !important;
	max-width: 280px !important;
	min-width: 280px !important;
	box-sizing: border-box;
	margin: 0 !important;
	scroll-snap-align: start;
}

.suimaru-target-title span {
	display: none !important;
}

.suimaru-target-title {
	display: block !important;
}

.suimaru-target-title h3 {
	margin: 0 0 12px !important;
	text-align: center;
}

.suimaru-target-image,
.suimaru-target-image img {
	background: transparent !important;
}

.suimaru-target-image img {
	width: 100%;
	height: 180px;
	object-fit: contain !important;
}

@media screen and (min-width: 1100px) {
	.suimaru-target-track .suimaru-target-card {
		flex-basis: 265px !important;
		width: 265px !important;
		max-width: 265px !important;
		min-width: 265px !important;
	}
}

@media screen and (max-width: 600px) {
	.suimaru-target-track {
		gap: 16px !important;
	}

	.suimaru-target-track .suimaru-target-card {
		flex: 0 0 82vw !important;
		width: 82vw !important;
		max-width: 82vw !important;
		min-width: 82vw !important;
	}

	.suimaru-target-image img {
		height: 165px;
	}
}


/* =====================================================
   v35：対象魚は4魚種固定表示・魚種はランダム
   スライダーをやめて表示安定を優先
===================================================== */
.suimaru-target-slider,
.suimaru-target-track {
	display: none !important;
}

.suimaru-target-random-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 22px;
	margin-top: 34px;
}

.suimaru-target-random-grid .suimaru-target-card {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	box-sizing: border-box;
}

.suimaru-target-random-grid .suimaru-target-title span {
	display: none !important;
}

.suimaru-target-random-grid .suimaru-target-title {
	display: block !important;
}

.suimaru-target-random-grid .suimaru-target-title h3 {
	margin: 0 0 12px !important;
	text-align: center;
}

.suimaru-target-random-grid .suimaru-target-image,
.suimaru-target-random-grid .suimaru-target-image img {
	background: transparent !important;
}

.suimaru-target-random-grid .suimaru-target-image img {
	width: 100%;
	height: 180px;
	object-fit: contain !important;
}

@media screen and (max-width: 900px) {
	.suimaru-target-random-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (max-width: 600px) {
	.suimaru-target-random-grid {
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.suimaru-target-random-grid .suimaru-target-image img {
		height: 165px;
	}
}