@charset "utf-8";

/* =========================================================
   POA - Pirates of Amusement
   ========================================================= */

:root {
	/* 羊皮紙（明るいセクション） */
	--paper: #f4efe3;
	--paper-2: #e9e1cf;
	--paper-line: #d8cdb4;

	/* 夜の海（暗いセクション） */
	--navy: #0e1a2a;
	--navy-2: #142942;
	--night: #080f19;

	/* 金 */
	--gold: #c9a227;
	--gold-l: #ecd489;
	--gold-d: #8a6c15;

	/* 赤（行動ボタン・最上位ランク） */
	--red: #9d1c1c;
	--red-l: #c53030;
	--red-d: #6d0f0f;

	--ink: #241f18;
	--ink-2: #6b6153;
	--white: #f6f2ea;
	--white-2: #a9b4c2;

	/* 本文：ヒラギノ角ゴ ProN（Mac・iPhone）。Windows・Androidでは游ゴシック→メイリオの順で表示します */
	--font-jp: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic", "YuGothic", Meiryo, sans-serif;

	/* 見出し：Zen Old Mincho */
	--font-display: "Zen Old Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;

	/* 欧文：Cinzel */
	--font-latin: "Cinzel", "Zen Old Mincho", "Hiragino Mincho ProN", serif;

	/* 撚り縄（セクションの境目に走らせる） */
	--rope: repeating-linear-gradient(112deg,
		#6d5410 0 3px, #a8861d 3px 6px, #ecd489 6px 8px, #c9a227 8px 12px, #6d5410 12px 15px);

	/* 紙の繊維 */
	--paper-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23g)' opacity='0.055'/%3E%3C/svg%3E");

	--wrap: 1180px;
	--gutter: 16px;
	--header-h: 60px;
}

/* =========================================================
   ベース
   ========================================================= */

*, *::before, *::after { box-sizing: border-box; }

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: var(--header-h);
}

body {
	margin: 0;
	background: var(--navy);
	color: var(--white);
	font-family: var(--font-jp);
	font-size: 15px;
	line-height: 1.85;
	overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; transition: color .2s, opacity .2s; }

a:focus-visible,
button:focus-visible,
select:focus-visible,
input:focus-visible {
	outline: 2px solid var(--gold-l);
	outline-offset: 2px;
}

h1, h2, h3 {
	font-family: var(--font-display);
	font-weight: 900;
	line-height: 1.5;
	letter-spacing: .04em;
	margin: 0;
}
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

.wrap {
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.screen-reader-text {
	position: absolute; width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 999;
	background: var(--gold); color: var(--night); padding: 10px 18px;
}
.skip-link:focus { left: 0; }

.icon { width: 1em; height: 1em; flex: none; }

/* =========================================================
   ヘッダー
   ========================================================= */

.site-header {
	position: sticky; top: 0; z-index: 100;
	background: #050505;
}

.site-header__inner {
	display: flex; align-items: center; justify-content: space-between;
	gap: 12px;
	min-height: var(--header-h);
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.site-logo { display: flex; align-items: center; }

.site-logo a { display: block; line-height: 0; }

/* 画像ロゴ */
.logo-img { width: auto; }

.logo-img--header { max-height: 34px; }
.logo-img--cta { max-height: 44px; }

/* 画像がないときの文字ロゴ */
.logo-text { display: block; line-height: 1; text-align: left; }

.logo-text__mark {
	display: block;
	font-family: var(--font-latin);
	font-size: 24px; font-weight: 700; letter-spacing: .14em; line-height: 1;
	background: linear-gradient(177deg, #f7e6b4 0%, #ecd489 28%, #fffaf0 46%, #c9a227 57%, #7d6212 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
	filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .5));
}

.logo-text__sub {
	display: block;
	font-family: var(--font-latin);
	font-size: 7px; letter-spacing: .24em; color: var(--gold);
	margin-top: 4px;
}

.cta__logo .logo-text__mark { font-size: 32px; }
.cta__logo .logo-text__sub { font-size: 8px; }

.nav-toggle {
	background: none; border: 1px solid rgba(201, 162, 39, .5);
	color: var(--gold-l); width: 42px; height: 34px;
	display: grid; place-content: center; gap: 4px; cursor: pointer; padding: 0;
}
.nav-toggle span { display: block; width: 18px; height: 1px; background: currentColor; transition: transform .25s, opacity .2s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

.site-header__right { display: flex; align-items: center; gap: 10px; }

/* Xのボタン */
.header-sns {
	display: grid; place-content: center;
	width: 38px; height: 38px;
	background: #fff;
	color: #000;
	border-radius: 7px;
	transition: opacity .2s;
}

.header-sns svg { width: 18px; height: 18px; }
.header-sns:hover { opacity: .78; }

.site-nav { display: none; }

.site-nav.is-open {
	display: block;
	position: absolute; top: 100%; left: 0; right: 0;
	background: #050505;
	border-bottom: 1px solid rgba(201, 162, 39, .35);
	padding: 6px var(--gutter) 16px;
	max-height: calc(100vh - var(--header-h));
	overflow-y: auto;
}

.nav-list li { border-bottom: 1px solid rgba(255, 255, 255, .12); }

.nav-list a {
	display: flex; align-items: baseline; gap: 10px;
	padding: 14px 2px;
}

.nav-list__jp { font-size: 14px; letter-spacing: .04em; }

.nav-list__en {
	font-family: var(--font-latin);
	font-size: 10px; letter-spacing: .16em; color: var(--gold);
}

.site-nav a:hover .nav-list__jp { color: var(--gold-l); }

/* 行動ボタン */

.btn-cta {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	font-family: var(--font-display); font-weight: 700;
	font-size: 15px; letter-spacing: .06em;
	color: #fdf3e3;
	background: linear-gradient(180deg, var(--red-l), var(--red) 55%, var(--red-d));
	border: 1px solid rgba(236, 212, 137, .7);
	border-radius: 4px;
	padding: 13px 26px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .35);
	transition: filter .2s, transform .1s;
}

.btn-cta:hover { filter: brightness(1.12); }
.btn-cta:active { transform: translateY(1px); }
.btn-cta .icon { font-size: 17px; color: var(--gold-l); }

/* 画像で作ったボタン */
.btn-cta--image {
	background: none;
	border: none;
	box-shadow: none;
	padding: 0;
	border-radius: 0;
	line-height: 0;
}

.btn-cta--image img { width: auto; }

.btn-cta--image.btn-cta--header img { max-height: 34px; }
.btn-cta--image.btn-cta--bottom img { max-height: 46px; }

.btn-cta--image:hover { filter: brightness(1.08); }

.btn-cta--header {
	font-size: 12px;
	padding: 9px 12px;
	gap: 5px;
	border-radius: 3px;
}

.btn-cta--header .icon { font-size: 14px; }

/* 画面が特に狭いときはアイコンだけにする */
@media (max-width: 359px) {
	.btn-cta--header span { display: none; }
	.btn-cta--header { padding: 9px 11px; }
	.btn-cta--image.btn-cta--header { padding: 0; }
	.btn-cta--image.btn-cta--header img { max-height: 30px; }
}

/* =========================================================
   ヒーロー
   ========================================================= */

.hero {
	position: relative;
	display: flex; align-items: center;
	min-height: 65vh;
	background: linear-gradient(120deg, #0b1624, #13273c 55%, #2a1a10);
	overflow: hidden;
}

.hero__bg { position: absolute; inset: 0; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; }

.hero__bg::after {
	content: "";
	position: absolute; inset: 0;
	background:
		linear-gradient(90deg, rgba(0, 0, 0, .72) 0%, rgba(0, 0, 0, .46) 34%, rgba(0, 0, 0, .1) 68%, transparent 100%),
		linear-gradient(180deg, rgba(0, 0, 0, .3), transparent 26%, transparent 72%, rgba(0, 0, 0, .35));
}

.hero__inner {
	position: relative;
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding: 54px var(--gutter);
}

.hero__copy {
	font-size: clamp(28px, 8.2vw, 54px);
	font-weight: 900;
	line-height: 1.35;
	letter-spacing: .01em;
	text-shadow: 0 3px 16px rgba(0, 0, 0, .85);
	margin: 0;
}

.hero__sub {
	margin-top: 25px;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(14px, 4vw, 19px);
	line-height: 1.85;
	letter-spacing: .03em;
	color: #f2ece0;
	text-shadow: 0 2px 12px rgba(0, 0, 0, .85);
}

.hero__ornament {
	display: block;
	width: 180px; height: 9px;
	margin: 22px 0 10px;
	background:
		linear-gradient(90deg, var(--gold), transparent) left center / 78px 1px no-repeat,
		linear-gradient(90deg, transparent, var(--gold)) right center / 78px 1px no-repeat;
	position: relative;
}

.hero__ornament::after {
	content: "";
	position: absolute; left: 50%; top: 50%;
	width: 8px; height: 8px;
	transform: translate(-50%, -50%) rotate(45deg);
	background: var(--gold);
}

.hero__latin {
	font-family: var(--font-latin);
	font-size: clamp(11px, 3vw, 15px);
	letter-spacing: .34em;
	color: var(--gold-l);
}

/* 読み込み時に一度だけ動かす */
.hero__copy, .hero__sub, .hero__ornament, .hero__latin {
	animation: poa-rise .9s cubic-bezier(.2, .7, .3, 1) both;
}
.hero__sub { animation-delay: .1s; }
.hero__ornament { animation-delay: .18s; }
.hero__latin { animation-delay: .24s; }

@keyframes poa-rise {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.hero__copy, .hero__sub, .hero__ornament, .hero__latin { animation: none; }
}

/* =========================================================
   セクション
   ========================================================= */

.section { padding-block: 40px; position: relative; }

/* セクションの境目に縄を1本通す */
.section::before,
.cta::before {
	content: "";
	position: absolute; top: 0; left: 0; right: 0;
	height: 8px;
	background: var(--rope);
	opacity: .9;
	z-index: 3;
}

/* ---- セクション背景画像 ---- */

.section > .wrap,
.cta > .wrap {
	position: relative;
	z-index: 1;
}

.section--bg {
	background-image: var(--section-bg) !important;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.section--bg::after {
	content: "";
	position: absolute; inset: 0;
	z-index: 0;
	pointer-events: none;
}

/* 明るいセクションは紙色の膜、暗いセクションは夜色の膜 */
.section--bg.section--light::after { background: rgba(244, 239, 227, var(--scrim, .88)); }
.section--bg.section--dark::after { background: rgba(8, 15, 25, var(--scrim, .82)); }
.cta.section--bg::after { background: rgba(8, 15, 25, var(--scrim, .82)); }

/* 装飾の表示切り替え（サイト設定） */
.poa-no-rope .section::before,
.poa-no-rope .cta::before { display: none; }

.poa-no-orn .sec-head__orn { display: none; }

/* 膜の濃さ（サイト設定で切り替え） */
.poa-scrim-light { --scrim: .72; }
.poa-scrim-normal { --scrim: .86; }
.poa-scrim-heavy { --scrim: .94; }

.section--light {
	background:
		var(--paper-grain),
		radial-gradient(120% 90% at 50% 0%, rgba(255, 255, 255, .7), transparent 60%),
		var(--paper);
	color: var(--ink);
}

.section--dark {
	background: linear-gradient(180deg, var(--night), var(--navy) 40%, var(--night));
	color: var(--white);
}

/* 暗いセクションに海図のような薄い格子を敷く */
.section--chart {
	background-image:
		linear-gradient(rgba(201, 162, 39, .045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(201, 162, 39, .045) 1px, transparent 1px),
		linear-gradient(180deg, var(--night), var(--navy) 40%, var(--night));
	background-size: 56px 56px, 56px 56px, auto;
}

/* 見出し */

.sec-head {
	position: relative;
	text-align: center;
	margin-bottom: 26px;
}

.sec-head__title-row {
	display: flex; align-items: center; justify-content: center;
	gap: 12px;
}

.sec-head .icon { font-size: 40px; color: var(--gold); }

.sec-head__icon {
	width: 44px; height: 44px; flex: none;
	object-fit: contain;
}

.sec-head__title {
	font-size: clamp(26px, 7.4vw, 42px);
	font-weight: 900;
	letter-spacing: .08em;
	line-height: 1.3;
}

.section--light .sec-head__title { color: #241a0c; }

.section--dark .sec-head__title {
	color: #f8f4ec;
	text-shadow: 0 2px 10px rgba(0, 0, 0, .6);
}

.sec-head__en {
	font-family: var(--font-latin);
	font-size: clamp(12px, 3.2vw, 15px);
	letter-spacing: .32em;
	text-transform: lowercase;
	margin-top: 6px;
	padding-left: .32em;
}

.section--light .sec-head__en { color: #7a6434; }
.section--dark .sec-head__en { color: #efeadf; }

/* 見出しの下の飾り（線・菱形・線） */
.sec-head__orn {
	display: flex; align-items: center; justify-content: center;
	gap: 10px;
	margin: 14px auto 0;
	width: min(280px, 72%);
}

.sec-head__orn::before,
.sec-head__orn::after {
	content: "";
	flex: 1;
	height: 1px;
}

.sec-head__orn span {
	width: 7px; height: 7px;
	transform: rotate(45deg);
	flex: none;
	position: relative;
}

.sec-head__orn span::before {
	content: "";
	position: absolute; inset: -4px;
	border: 1px solid currentColor;
	opacity: .45;
}

.section--light .sec-head__orn { color: var(--gold-d); }
.section--light .sec-head__orn::before { background: linear-gradient(90deg, transparent, rgba(138, 108, 21, .55)); }
.section--light .sec-head__orn::after { background: linear-gradient(90deg, rgba(138, 108, 21, .55), transparent); }
.section--light .sec-head__orn span { background: var(--gold-d); }

.section--dark .sec-head__orn { color: var(--gold); }
.section--dark .sec-head__orn::before { background: linear-gradient(90deg, transparent, var(--gold)); }
.section--dark .sec-head__orn::after { background: linear-gradient(90deg, var(--gold), transparent); }
.section--dark .sec-head__orn span { background: var(--gold); }

.sec-head__lead {
	font-size: 13px;
	margin-top: 12px;
}

.section--light .sec-head__lead { color: var(--ink-2); }
.section--dark .sec-head__lead { color: var(--white-2); }

/* ---- セクション下部のボタン ---- */

.sec-more {
	margin-top: 30px;
	text-align: center;
}

.sec-more__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: min(300px, 80vw);
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(14px, 3.8vw, 16px);
	letter-spacing: .08em;
	color: #fdf1dd;
	background: linear-gradient(180deg, #a62323, #7d1414 55%, #5c0e0e);
	border: 1px solid var(--gold);
	border-radius: 3px;
	padding: 14px 32px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
	transition: filter .2s, transform .1s;
}

.sec-more__link:hover { filter: brightness(1.15); }
.sec-more__link:active { transform: translateY(1px); }

.sec-more__link .icon { font-size: 17px; color: var(--gold-l); }

/* 画像に差し替えたとき */
.sec-more__link--image {
	border: none;
	background: none;
	padding: 0;
	line-height: 0;
}

.sec-more__link--image::after { content: none; }

.sec-more__link--image img {
	height: 46px;
	width: auto;
	max-width: 100%;
}

.sec-more__link--image:hover { filter: brightness(1.08); }

/* =========================================================
   絞り込み
   ========================================================= */

.filters {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin-bottom: 20px;
	align-items: center;
}

/* スマホでは企画の選択だけ横幅いっぱいに（PCでは下で元に戻します） */
.filters select[data-poa-filter="plan"] { grid-column: 1 / -1; }

.filters select {
	appearance: none;
	width: 100%;
	min-width: 0;
	background-color: #fff;
	border: 1px solid #ddd3bd;
	border-radius: 4px;
	color: var(--ink);
	font-family: inherit;
	font-size: 14.5px;
	padding: 12px 34px 12px 14px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23463c2c' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
	background-position: calc(100% - 13px) 55%;
	background-size: 13px 8px;
	background-repeat: no-repeat;
	box-shadow: 0 1px 3px rgba(60, 45, 20, .12);
}

.filters__submit { font-weight: 700; white-space: nowrap; }

.filters__submit {
	grid-column: 1 / -1;
	background: #14161a; color: #fff;
	border: none; border-radius: 3px;
	font-family: inherit; font-size: 14px; letter-spacing: .1em;
	padding: 11px 26px; cursor: pointer;
}

.filters__submit:hover { background: #2a2f36; }

/* 結果側は青いボタン */
.section--dark .filters__submit { background: #2a5fd4; }
.section--dark .filters__submit:hover { background: #3b74ec; }

.filters__limit {
	grid-column: 1 / -1;
	display: flex; align-items: center; justify-content: flex-end; gap: 10px;
	font-size: 12.5px;
	white-space: nowrap;
}

.filters__limit select { width: auto; min-width: 92px; }

.section--light .filters__limit { color: var(--ink-2); }
.section--dark .filters__limit { color: var(--white-2); }

.filters__count { display: none; }

.is-hidden { display: none !important; }

/* =========================================================
   カードの並び（スマホは横スクロール）
   ========================================================= */

.card-row {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 74%;
	gap: 12px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding-bottom: 10px;
	margin-inline: calc(var(--gutter) * -1);
	padding-inline: var(--gutter);
	-webkit-overflow-scrolling: touch;
}

.card-row > * { scroll-snap-align: start; }

.card-row::-webkit-scrollbar { height: 5px; }
.card-row::-webkit-scrollbar-track { background: rgba(128, 128, 128, .15); }
.card-row::-webkit-scrollbar-thumb { background: var(--gold-d); border-radius: 3px; }

/* =========================================================
   スケジュールカード
   ========================================================= */

.s-card {
	background: #fff;
	border: 1px solid var(--paper-line);
	border-radius: 6px;
	box-shadow: 0 3px 10px rgba(60, 45, 20, .1);
	overflow: hidden;
	display: flex; flex-direction: column;
}

/* 四隅の角飾り */
.s-card, .p-card { position: relative; }

.s-card::before, .s-card::after,
.p-card::before, .p-card::after {
	content: "";
	position: absolute;
	width: 13px; height: 13px;
	pointer-events: none;
	z-index: 2;
}

.s-card::before, .p-card::before {
	top: 5px; left: 5px;
	border-top: 1px solid; border-left: 1px solid;
}

.s-card::after, .p-card::after {
	bottom: 5px; right: 5px;
	border-bottom: 1px solid; border-right: 1px solid;
}

.s-card::before, .s-card::after { border-color: rgba(138, 108, 21, .5); }
.p-card::before, .p-card::after { border-color: rgba(236, 212, 137, .5); }

/* 達成の判子 */
.stamp {
	display: inline-grid; place-content: center;
	width: 62px; height: 62px;
	border: 2px solid #b3261e;
	box-shadow: inset 0 0 0 3px rgba(179, 38, 30, .95);
	border-radius: 50%;
	color: #b3261e;
	font-family: var(--font-display);
	font-weight: 900; font-size: 17px; letter-spacing: .06em;
	transform: rotate(-13deg);
	opacity: .88;
	background: rgba(255, 255, 255, .06);
}

.stamp--card {
	position: absolute; top: 54px; right: 8px; z-index: 3;
	width: 48px; height: 48px; font-size: 14px;
	color: #ff6b5a; border-color: #ff6b5a;
	box-shadow: inset 0 0 0 3px rgba(255, 107, 90, .9);
	background: rgba(8, 15, 25, .45);
}

.s-card__top {
	display: flex; align-items: center; justify-content: space-between;
	gap: 8px;
	padding: 9px 10px;
}

.s-card__date {
	font-family: var(--font-display);
	font-weight: 700; font-size: 13px; color: var(--ink);
	letter-spacing: .01em;
}

.s-card__area {
	background: var(--area-color, #1e5aa8);
	color: #fff;
	font-size: 11px; letter-spacing: .06em;
	padding: 2px 9px; border-radius: 3px;
	white-space: nowrap;
}

.s-card__media { display: block; background: var(--paper-2); }
.s-card__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

.s-card__noimage {
	display: block; width: 100%; aspect-ratio: 16 / 10;
	background: linear-gradient(135deg, #1b2f47, #0d1826 60%, #2a1c10);
}

.s-card__body { padding: 12px 12px 14px; display: flex; flex-direction: column; gap: 8px; flex: 1; }

.s-card__hall {
	font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.5;
}

.s-card__hall a:hover { color: var(--red); }

.s-card__plan {
	font-size: 11px; color: var(--ink-2);
	border: 1px solid var(--paper-line);
	border-radius: 3px;
	padding: 1px 8px;
	align-self: flex-start;
}

/* 乗り込む海賊 */

.crew { display: flex; align-items: center; gap: 5px; margin-top: auto; }

.crew__item {
	width: 30px; height: 30px; border-radius: 50%;
	overflow: hidden; background: var(--paper-2);
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px var(--paper-line);
	display: grid; place-content: center;
}

.crew__item img { width: 100%; height: 100%; object-fit: cover; }

.crew__initial { font-size: 12px; color: var(--ink-2); font-weight: 700; }

.crew__item--more {
	font-size: 11px; color: var(--ink-2); font-weight: 700;
	background: var(--paper);
}

/* =========================================================
   結果カード
   ========================================================= */

/* =========================================================
   開催の行（スケジュール・結果で共通）
   ========================================================= */

.v-list { display: grid; gap: 10px; }

.v-row {
	position: relative;
	display: grid;
	grid-template-columns: auto auto 1fr;
	grid-template-areas:
		"date area icon"
		"hall hall hall"
		"plan plan plan"
		"btn  btn  btn";
	align-items: center;
	gap: 8px 10px;
	padding: 13px 14px 15px;
	border-radius: 3px;
}

/* スケジュール：明るい背景の上に置く濃い赤の帯 */
.v-row--schedule {
	background: linear-gradient(180deg, #5c1414, #3d0d0d 55%, #290808);
	border: 2px solid var(--gold);
	box-shadow:
		inset 0 0 0 1px rgba(0, 0, 0, .55),
		0 3px 10px rgba(60, 20, 10, .3);
}

/* 結果：暗い背景の上に置く生成りの帯 */
.v-row--result {
	background: #fff;
	border: 2px solid #d9c79c;
	border-radius: 4px;
	box-shadow: 0 3px 12px rgba(0, 0, 0, .4);
}

.v-row__date {
	grid-area: date;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(14px, 4vw, 17px);
	letter-spacing: .02em;
	white-space: nowrap;
}

.v-row__wday { font-size: .82em; }

.v-row--schedule .v-row__date { color: #f6ecd8; }
.v-row--result .v-row__date { color: var(--ink); }

.v-row__area {
	grid-area: area;
	justify-self: start;
	background: var(--area-color, #1e5aa8);
	color: #fff;
	font-size: 11px;
	letter-spacing: .08em;
	padding: 2px 10px;
	border-radius: 2px;
	white-space: nowrap;
}

.v-row__icon {
	grid-area: icon;
	justify-self: start;
	display: block;
	height: 42px;
}

.v-row__icon img { height: 100%; width: auto; }

/* 画像がまだ無いときの文字表示 */
.v-row__icon--text {
	display: inline-flex;
	align-items: center;
	height: auto;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .04em;
	padding: 5px 13px;
	border-radius: 2px;
	border: 1px solid;
	white-space: nowrap;
}

.v-row__icon--red { color: #ff9b85; border-color: #c4452f; background: rgba(196, 69, 47, .18); }
.v-row__icon--gold { color: var(--gold-l); border-color: var(--gold); background: rgba(201, 162, 39, .15); }
.v-row__icon--green { color: #86d9ab; border-color: #2f8257; background: rgba(47, 130, 87, .18); }
.v-row__icon--blue { color: #94c6f2; border-color: #35679b; background: rgba(53, 103, 155, .2); }
.v-row__icon--silver { color: #cdd3db; border-color: #6b727b; background: rgba(107, 114, 123, .2); }

/* 白い行の上では濃い色にする */
.v-row--result .v-row__icon--red { color: #9c2314; background: rgba(196, 69, 47, .1); }
.v-row--result .v-row__icon--gold { color: #7a5f10; background: rgba(201, 162, 39, .12); }
.v-row--result .v-row__icon--green { color: #1d5c3b; background: rgba(47, 130, 87, .1); }
.v-row--result .v-row__icon--blue { color: #1f4a75; background: rgba(53, 103, 155, .1); }
.v-row--result .v-row__icon--silver { color: #4b525b; background: rgba(107, 114, 123, .12); }

.v-row__hall {
	grid-area: hall;
	font-size: clamp(16px, 4.6vw, 21px);
	line-height: 1.4;
	letter-spacing: .03em;
}

.v-row--schedule .v-row__hall { color: #fff8e8; }
.v-row--result .v-row__hall { color: #221c14; }

.v-row--schedule .v-row__hall a:hover { color: var(--gold-l); }
.v-row--result .v-row__hall a:hover { color: #7a2020; }

/* 企画 */
.v-row__plan {
	grid-area: plan;
	display: flex;
	align-items: center;
	justify-self: start;
	line-height: 0;
}

.v-row__plan img {
	height: 44px;
	width: auto;
	max-width: 100%;
}

.v-row__plan-text {
	font-family: var(--font-display);
	font-weight: 900;
	font-size: clamp(15px, 4.4vw, 19px);
	letter-spacing: .04em;
	line-height: 1.3;
	color: #fff;
	background: var(--plan-color, #b3261e);
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 3px;
	padding: 5px 14px;
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}

/* 白い行の上では枠線を濃くする */
.v-row--result .v-row__plan-text { border-color: rgba(0, 0, 0, .2); }

/* 行の中のボタン */
.v-row__btn {
	grid-area: btn;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .04em;
	color: #fdf1dd;
	background: linear-gradient(180deg, #a62323, #7d1414 55%, #5c0e0e);
	border: 1px solid var(--gold);
	border-radius: 3px;
	padding: 9px 18px;
	transition: filter .2s;
	white-space: nowrap;
}

.v-row__btn:hover { filter: brightness(1.15); }

/* 画像に差し替えたとき */
.v-row__btn--image {
	background: none;
	border: none;
	padding: 0;
	line-height: 0;
}

.v-row__btn--image img { height: 38px; width: auto; max-width: 100%; }
.v-row__btn .icon { font-size: 15px; color: var(--gold-l); }

/* 区切りの縦線（パソコン表示のみ） */
.v-row__sep { display: none; }

/* =========================================================
   ランク
   ========================================================= */

.rank-row {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px 12px;
	text-align: center;
	align-items: start;
}

.rank-item a { display: block; }

/* ---- 勲章 ---- */

.emblem {
	position: relative;
	display: grid; place-items: center;
	width: min(126px, 82%);
	aspect-ratio: 1;
	margin: 0 auto 26px;
	border-radius: 50%;
	transition: transform .25s ease;
}

.rank-item a:hover .emblem { transform: translateY(-4px); }

/* 外周の金縁：見る角度で光が回るような金属のグラデーション */
.emblem__rim {
	position: absolute; inset: 0;
	border-radius: 50%;
	background: conic-gradient(from 215deg,
		#6d5410 0deg, #c9a227 40deg, #fff6d8 72deg, #ecd489 96deg,
		#8a6c15 150deg, #c9a227 196deg, #fff6d8 232deg, #d9b940 262deg,
		#7d6212 310deg, #6d5410 360deg);
	box-shadow: 0 10px 22px rgba(0, 0, 0, .4), inset 0 0 0 1px rgba(255, 255, 255, .25);
}

/* 縁の刻み（硬貨の側面のような目） */
.emblem__ticks {
	position: absolute; inset: 7px;
	border-radius: 50%;
	background: repeating-conic-gradient(
		rgba(255, 255, 255, .5) 0deg 1.4deg,
		transparent 1.4deg 5deg);
	opacity: .5;
}

/* 中央の色面 */
.emblem__face {
	position: absolute; inset: 12px;
	border-radius: 50%;
	background:
		radial-gradient(120% 120% at 32% 24%, var(--em-light), var(--em-base) 52%, var(--em-dark) 100%);
	box-shadow:
		inset 0 5px 16px rgba(0, 0, 0, .55),
		inset 0 -3px 10px rgba(255, 255, 255, .12),
		0 0 0 2px rgba(201, 162, 39, .85),
		0 0 0 3px rgba(0, 0, 0, .25);
}

.emblem__name {
	position: relative;
	font-family: var(--font-display);
	font-weight: 900;
	font-size: clamp(20px, 6vw, 27px);
	letter-spacing: .04em;
	color: #fff;
	text-shadow: 0 2px 5px rgba(0, 0, 0, .7), 0 0 14px rgba(255, 255, 255, .22);
	line-height: 1.1;
	max-width: 78%;
}

.emblem__name[data-len="3"] { font-size: clamp(16px, 4.6vw, 21px); letter-spacing: 0; }
.emblem__name[data-len="4"] { font-size: clamp(13px, 3.8vw, 17px); letter-spacing: -.01em; }
.emblem__name[data-len="5"] { font-size: clamp(11px, 3.2vw, 14px); letter-spacing: -.02em; line-height: 1.25; }

/* 下の銘板 */
.emblem__plate {
	position: absolute;
	left: 50%; bottom: -14px;
	transform: translateX(-50%);
	font-family: var(--font-latin);
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: .14em;
	color: #2c2109;
	white-space: nowrap;
	padding: 3px 16px;
	background: linear-gradient(180deg, #fdf0c4, #ecd489 40%, #c9a227 70%, #8a6c15);
	clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 50%, calc(100% - 6px) 100%, 6px 100%, 0 50%);
	box-shadow: 0 3px 8px rgba(0, 0, 0, .35);
}

/* 円の中に入れるシンボル（骸骨など） */
.emblem__symbol {
	position: relative;
	display: block;
	width: 40%;
	max-width: 50px;
	margin-bottom: 3px;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .6));
}

.emblem__symbol img { width: 100%; height: auto; }

/* シンボルがあるときは、全体を少し上に寄せて銘板との間を空ける */
.emblem--symbol .emblem__name { margin-bottom: 8px; }

/* シンボルがあるときは文字を小さくして下に置く */
.emblem--symbol .emblem__name { font-size: clamp(13px, 3.6vw, 16px); letter-spacing: .02em; }
.emblem--symbol .emblem__name[data-len="3"] { font-size: clamp(12px, 3.2vw, 15px); }
.emblem--symbol .emblem__name[data-len="4"] { font-size: clamp(10px, 2.8vw, 13px); }
.emblem--symbol .emblem__name[data-len="5"] { font-size: clamp(9px, 2.4vw, 11px); }

/* 紋章画像を登録した場合は、その画像だけを出す
   縦横比は自由。高さを揃えるので、ランクごとに形が違っても並びが崩れません */
.emblem--image {
	display: block;
	width: auto;
	height: auto;
	aspect-ratio: auto;
	border-radius: 0;
	margin-bottom: 14px;
	filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .35));
}

/* 高さを揃えるので、ランクごとに縦横比が違っても下端が並びます */
.emblem__img {
	display: block;
	height: clamp(96px, 26vw, 150px);
	width: auto;
	max-width: 100%;
	margin-inline: auto;
	object-fit: contain;
}

/* 色 */
.emblem--red { --em-light: #d24a3f; --em-base: #9a1616; --em-dark: #4a0808; }
.emblem--gold { --em-light: #6b5626; --em-base: #423313; --em-dark: #191202; }
.emblem--green { --em-light: #3d8557; --em-base: #1c5433; --em-dark: #07230f; }
.emblem--blue { --em-light: #4a749a; --em-base: #22456a; --em-dark: #0a1a2c; }
.emblem--silver { --em-light: #8d939c; --em-base: #565c65; --em-dark: #22262b; }

.rank-item__desc {
	font-size: 12.5px; line-height: 1.75;
}

.section--light .rank-item__desc { color: var(--ink-2); }
.section--dark .rank-item__desc { color: var(--white-2); }

/* =========================================================
   ランクの1枚画像
   ========================================================= */

.full-visual {
	position: relative;
	line-height: 0;
	background: #000;
}

.full-visual img,
.full-visual a {
	display: block;
	width: 100%;
	height: auto;
}

/* =========================================================
   海賊カード
   ========================================================= */

.p-card {
	position: relative;
	border: 1px solid rgba(201, 162, 39, .4);
	border-radius: 6px;
	overflow: hidden;
	background: var(--navy-2);
}

.p-card__media { display: block; }
.p-card__media img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.p-card .s-card__noimage { aspect-ratio: 3 / 4; }

.p-card__name {
	position: absolute; left: 8px; right: 8px; bottom: 8px;
	display: block; text-align: center;
	background: linear-gradient(180deg, rgba(14, 26, 42, .92), rgba(8, 15, 25, .96));
	border: 1px solid rgba(201, 162, 39, .5);
	border-radius: 3px;
	font-family: var(--font-display); font-weight: 700;
	font-size: 13px; color: var(--white);
	padding: 5px 4px;
}

/* =========================================================
   下部の行動導線
   ========================================================= */

.cta {
	background:
		linear-gradient(180deg, rgba(8, 15, 25, .8), rgba(8, 15, 25, .96)),
		linear-gradient(120deg, #17293f, #0b1523 60%, #2a1a10);
	border-top: 1px solid rgba(201, 162, 39, .3);
	padding-block: 34px;
	position: relative;
}

.cta__inner {
	display: grid; gap: 18px; justify-items: center; text-align: center;
}

.cta__title {
	font-family: var(--font-display);
	font-size: clamp(20px, 5.6vw, 28px); font-weight: 900; color: var(--white);
}

.cta__text { font-size: 13px; color: var(--white-2); margin-top: 6px; }

/* =========================================================
   フッター
   ========================================================= */

.site-footer {
	position: relative;
	background: #000;
	padding: 40px 0 0;
	text-align: center;
}

.site-footer__logo {
	margin: 0 0 26px;
	line-height: 0;
}

.site-footer__logo a { display: inline-block; }

.logo-img--footer { max-height: 52px; width: auto; margin-inline: auto; }

.site-footer__logo .logo-text { text-align: center; }

.site-footer__note {
	font-size: 12px;
	line-height: 2;
	color: #d9d4ca;
	max-width: 780px;
	margin: 0 auto 26px;
}

/* R18の表示 */
.site-footer__r18 { margin-bottom: 30px; }

.r18 {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: #fff;
	border-radius: 2px;
	padding: 10px 16px;
	text-align: left;
}

.r18__mark {
	display: grid;
	place-content: center;
	width: 38px; height: 38px;
	flex: none;
	border: 2px solid #d20000;
	border-radius: 50%;
	font-family: var(--font-jp);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .02em;
	color: #d20000;
}

.r18__text {
	font-size: 12px;
	line-height: 1.6;
	color: #111;
	letter-spacing: .02em;
}

.site-footer__links {
	display: flex; flex-wrap: wrap; justify-content: center;
	gap: 8px 18px;
	font-size: 12.5px;
	color: var(--white-2);
	margin-bottom: 26px;
}

.site-footer__links a:hover { color: var(--gold-l); }

.site-footer__copy {
	border-top: 1px solid rgba(255, 255, 255, .1);
	padding: 14px 16px;
	font-size: 11px;
	color: #9aa2ad;
	letter-spacing: .04em;
}

/* =========================================================
   下層ページ
   ========================================================= */

.page-hero {
	position: relative;
	padding: 34px 0 26px;
	background: linear-gradient(180deg, #101c2c, var(--night));
	border-bottom: 1px solid rgba(201, 162, 39, .3);
	text-align: center;
}

.page-hero__title {
	font-size: clamp(23px, 6.4vw, 34px); font-weight: 900;
	background: linear-gradient(177deg, #f7e6b4 0%, #ecd489 30%, #fffaf0 47%, #c9a227 58%, #8a6c15 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}

.page-hero__en {
	display: block;
	font-family: var(--font-latin);
	font-size: 11px; letter-spacing: .24em; color: var(--gold);
	margin-bottom: 6px;
	-webkit-text-fill-color: var(--gold);
}

.breadcrumb { font-size: 11.5px; color: var(--white-2); padding: 12px 0 0; }
.breadcrumb a:hover { color: var(--gold-l); }
.breadcrumb span + span::before { content: "／"; margin: 0 6px; color: var(--gold-d); }

/* 一覧（下層は縦積み） */

.card-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}

/* =========================================================
   結果記事
   ========================================================= */

.report { background: var(--night); }

.report__head {
	padding: 26px 0 24px;
	background: linear-gradient(180deg, #101c2c, var(--night));
	border-bottom: 1px solid rgba(201, 162, 39, .3);
	text-align: center;
}

.report__meta {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
	gap: 8px 10px;
	margin-bottom: 10px;
}

.report__date {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 15px;
	color: var(--gold-l);
}

.report__hall {
	font-size: clamp(22px, 6.4vw, 34px);
	font-weight: 900;
	color: #f8f4ec;
	line-height: 1.4;
}

.report__lead {
	margin: 14px auto 0;
	max-width: 760px;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(14px, 4vw, 17px);
	line-height: 1.9;
	color: var(--gold-l);
}

.report__body { padding: 26px 0 50px; }

/* 来場者数 */
.report__visitors {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: rgba(201, 162, 39, .3);
	border: 1px solid rgba(201, 162, 39, .3);
	border-radius: 4px;
	overflow: hidden;
	margin-bottom: 26px;
}

.report__visitors li {
	background: #0b1522;
	padding: 13px 6px;
	text-align: center;
	font-size: 12px;
	color: var(--white-2);
}

.report__visitors span { display: block; margin-bottom: 3px; letter-spacing: .08em; }

.report__visitors strong {
	font-family: var(--font-display);
	font-weight: 900;
	font-size: clamp(18px, 5vw, 24px);
	color: #f2ece0;
	margin-right: 2px;
}

.report__visitors .is-total strong { color: var(--gold-l); }

/* 全体のデータ画像 */
.report__data { display: grid; gap: 12px; margin-bottom: 30px; }
.report__data img { width: 100%; height: auto; border: 1px solid rgba(201, 162, 39, .25); border-radius: 3px; }

/* 見出し */
.report__group {
	position: relative;
	font-size: clamp(17px, 4.8vw, 21px);
	font-weight: 900;
	color: #f8f4ec;
	padding: 10px 0 10px 16px;
	margin: 34px 0 16px;
	border-left: 4px solid var(--gold);
	background: linear-gradient(90deg, rgba(201, 162, 39, .14), transparent 70%);
}

/* ピックアップ1件 */
.pick {
	background: rgba(255, 255, 255, .03);
	border: 1px solid rgba(201, 162, 39, .22);
	border-radius: 4px;
	padding: 16px;
	margin-bottom: 16px;
}

.pick__machine {
	font-size: clamp(15px, 4.2vw, 18px);
	color: var(--gold-l);
	line-height: 1.5;
	margin-bottom: 12px;
}

.pick__image { display: block; margin-bottom: 14px; }

.pick__image img {
	width: 100%; height: auto;
	border: 1px solid rgba(201, 162, 39, .25);
	border-radius: 3px;
}

.pick__stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: rgba(201, 162, 39, .25);
	border: 1px solid rgba(201, 162, 39, .25);
	border-radius: 3px;
	overflow: hidden;
}

.pick__stats div { background: #0b1522; padding: 10px 6px; text-align: center; }
.pick__stats dt { font-size: 10.5px; color: var(--white-2); letter-spacing: .06em; }

.pick__stats dd {
	margin-top: 3px;
	font-family: var(--font-display);
	font-weight: 900;
	font-size: clamp(14px, 4vw, 18px);
	color: #f2ece0;
}

/* 総括 */
.report__summary {
	font-size: 14.5px;
	line-height: 2.1;
	color: #e2e6ec;
}

.report__next {
	margin-top: 22px;
	text-align: center;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 15px;
	color: var(--gold-l);
	border: 1px dashed rgba(201, 162, 39, .5);
	padding: 12px;
	border-radius: 3px;
}

/* 店内写真 */
.report__gallery {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px;
}

.report__gallery img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border: 1px solid rgba(201, 162, 39, .2);
	border-radius: 3px;
}

.report__promise {
	background: var(--paper);
	color: var(--ink);
	border-radius: 4px;
	padding: 16px 18px;
	margin-bottom: 22px;
	white-space: pre-line;
	font-size: 14px;
	line-height: 1.9;
}

.report__note {
	margin-top: 30px;
	font-size: 11.5px;
	line-height: 1.9;
	color: #8d96a3;
}

.report__links {
	display: flex; flex-wrap: wrap; gap: 10px;
	margin-top: 30px;
}

/* 汎用のボタン */
.btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 1px solid var(--gold);
	border-radius: 3px;
	color: var(--gold-l);
	background: rgba(201, 162, 39, .08);
	padding: 12px 24px;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: .04em;
	transition: background .2s, color .2s;
}

.btn:hover { background: var(--gold); color: var(--night); }
.btn--ghost { border-color: rgba(201, 162, 39, .45); }

.section__more { margin-top: 22px; text-align: center; }

/* 店舗ページ */

.hall-header { padding: 24px 0 8px; }
.hall-header__name { font-size: clamp(22px, 6.4vw, 32px); font-weight: 900; color: var(--white); margin: 8px 0 10px; }

.hall-record {
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
	background: rgba(201, 162, 39, .3);
	border: 1px solid rgba(201, 162, 39, .3);
	border-radius: 6px; overflow: hidden;
	margin: 18px 0 24px;
}

.hall-record div { background: var(--night); padding: 14px 8px; text-align: center; }
.hall-record dt { font-size: 11px; color: var(--white-2); }

.hall-record dd {
	margin: 4px 0 0; font-family: var(--font-display); font-weight: 900;
	font-size: clamp(19px, 5.6vw, 25px); color: var(--gold-l);
}

.hall-info { font-size: 13.5px; color: var(--white-2); display: grid; gap: 6px; margin-bottom: 24px; }
.hall-info span { color: var(--gold); margin-right: 10px; }

.hall-list { display: grid; gap: 10px; }

.hall-row {
	display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
	padding: 13px 15px;
	border: 1px solid rgba(201, 162, 39, .25);
	border-radius: 6px;
	background: rgba(20, 41, 66, .5);
}

.hall-row__name { font-family: var(--font-display); font-size: 15px; flex: 1 1 auto; }
.hall-row__name a:hover { color: var(--gold-l); }
.hall-row__area { font-size: 12px; color: var(--white-2); }

/* ランクバッジ（カード・詳細で共用） */

.rank-badge {
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 11.5px; letter-spacing: .06em;
	padding: 2px 9px 2px 7px;
	border: 1px solid currentColor; border-radius: 3px;
	white-space: nowrap;
}

.rank-badge__mark { width: 7px; height: 7px; background: currentColor; transform: rotate(45deg); }

/* 画像のバッジ */
.rank-badge--image {
	border: none;
	background: none;
	padding: 0;
	line-height: 0;
}

.rank-badge--image img { height: 30px; width: auto; max-width: 160px; }

/* ランクページの見出し */
.rank-head { text-align: center; margin-bottom: 22px; }

.rank-head__img {
	height: clamp(56px, 14vw, 86px);
	width: auto;
	max-width: 100%;
	margin-inline: auto;
}

.rank-head__text {
	display: flex; align-items: center; justify-content: center; gap: 12px;
}

.rank-head__text .icon { font-size: 34px; color: var(--gold); }

.rank-head__name {
	font-family: var(--font-display);
	font-weight: 900;
	font-size: clamp(22px, 6vw, 34px);
	letter-spacing: .06em;
	color: #f8f4ec;
}

.rank-head__en {
	font-family: var(--font-latin);
	font-size: 12px;
	letter-spacing: .3em;
	color: #efeadf;
	margin-top: 4px;
	padding-left: .3em;
}

.rank-badge--red { color: #ff8a6a; background: rgba(157, 28, 28, .25); }
.rank-badge--gold { color: var(--gold-l); background: rgba(201, 162, 39, .14); }
.rank-badge--green { color: #7fd6a3; background: rgba(28, 74, 45, .3); }
.rank-badge--blue { color: #8fc2f0; background: rgba(35, 63, 89, .35); }
.rank-badge--silver { color: #c3c9d1; background: rgba(71, 76, 83, .35); }

.section--light .rank-badge--gold { color: #7a5f10; background: rgba(201, 162, 39, .14); }

/* 海賊一覧（下層） */

.pirate-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }

.pirate-grid .p-card__name { position: static; margin-top: 8px; }

.pirate-card__role { font-size: 11px; color: var(--gold); text-align: center; margin-top: 6px; }
.pirate-card__bio { font-size: 12.5px; color: var(--white-2); line-height: 1.7; margin-top: 4px; }
.pirate-card__links { display: flex; justify-content: center; gap: 12px; margin-top: 6px; font-size: 12px; color: var(--gold-l); }

/* 空の状態 */

.empty {
	border: 1px dashed rgba(201, 162, 39, .4);
	border-radius: 6px;
	padding: 28px 18px; text-align: center; font-size: 13.5px; color: var(--white-2);
}

.section--light .empty { color: var(--ink-2); border-color: var(--paper-line); }

/* 固定ページ本文 */

.entry-body { padding: 26px 0 44px; line-height: 2; }
.entry-body h2 { font-size: 20px; color: var(--gold-l); margin: 2em 0 .8em; }
.entry-body h3 { font-size: 17px; color: var(--gold-l); margin: 1.8em 0 .6em; }
.entry-body p { margin-bottom: 1.2em; }
.entry-body a { color: var(--gold-l); text-decoration: underline; }

/* =========================================================
   タブレット以上
   ========================================================= */

/* =========================================================
   小さめのスマホより上
   ========================================================= */

@media (min-width: 480px) {
	.card-row { grid-auto-columns: 54%; }
	.rank-row { grid-template-columns: repeat(3, 1fr); gap: 34px 14px; }
}

/* =========================================================
   タブレット
   ========================================================= */

@media (min-width: 768px) {

	:root { --gutter: 24px; --header-h: 66px; }

	body { font-size: 16px; }

	.section { padding-block: 48px; }

		.btn-cta--header { font-size: 13px; padding: 10px 16px; }

	.sec-more { margin-top: 36px; }
	.sec-more__link--image img { height: 56px; }

	.logo-img--header { max-height: 44px; }
	.logo-img--footer { max-height: 62px; }
	.site-footer { padding-top: 52px; }
	.site-footer__note { font-size: 13px; }
	.r18__text { font-size: 13px; }
	.header-sns { width: 42px; height: 42px; }
	.header-sns svg { width: 19px; height: 19px; }
	.logo-img--cta { max-height: 52px; }
	.btn-cta--image.btn-cta--header img { max-height: 40px; }
	.btn-cta--image.btn-cta--bottom img { max-height: 52px; }

	.hero { min-height: 65vh; }
	.hero__inner { padding-block: 60px; }

	.v-row {
		grid-template-columns: auto auto auto minmax(0, 1fr) auto auto;
		grid-template-areas: "date area icon hall plan btn";
		gap: 16px;
		padding: 12px 16px;
	}

	.v-row__plan { justify-self: end; margin-right: 6px; }
	.v-row__plan img { height: 56px; }
	.v-row__plan-text { font-size: clamp(17px, 1.6vw, 22px); padding: 6px 18px; }

	.v-row__hall { justify-self: start; }
	.v-row__btn { justify-self: end; }

	/* 紋章の左右に細い仕切りを入れる */
	.v-row__icon { height: 54px; }
	.v-row__icon--text { font-size: 15px; padding: 7px 16px; }

	.v-row--schedule .v-row__icon {
		padding-right: 16px;
		border-right: 1px solid rgba(201, 162, 39, .45);
	}

	.v-row__btn--image img { height: 50px; }

	/* タブレットは「選択3つ」と「ボタン・件数」の2段 */
	.filters {
		grid-template-columns: repeat(3, 1fr);
		gap: 10px 12px;
	}

	.filters select[data-poa-filter="plan"] { grid-column: auto; }

	.filters__submit {
		grid-column: 1;
		justify-self: start;
		padding: 11px 40px;
	}

	.filters__limit { grid-column: 3; justify-self: end; }

	.card-row {
		grid-auto-flow: row;
		grid-template-columns: repeat(3, 1fr);
		gap: 14px;
		overflow: visible;
		margin-inline: 0;
		padding-inline: 0;
	}

	.card-grid { grid-template-columns: repeat(3, 1fr); }

	.rank-row { grid-template-columns: repeat(5, 1fr); gap: 18px; }

	.pirate-grid { grid-template-columns: repeat(3, 1fr); }

	.cta__inner {
		grid-template-columns: auto 1fr auto;
		align-items: center; text-align: left; gap: 24px;
		justify-items: start;
	}

	.cta__body { text-align: center; justify-self: center; }



	.report__head { padding: 36px 0 32px; }
	.report__body { padding: 36px 0 64px; }
	.report__gallery { grid-template-columns: repeat(3, 1fr); }
	.pick { padding: 22px; }
}

/* =========================================================
   小さめのパソコン（ここからメニューを横並びにする）
   ========================================================= */

@media (min-width: 1024px) {

	/* パソコンでは絞り込みを1行に並べる */
	.filters {
		grid-template-columns: repeat(3, minmax(140px, 190px)) auto 1fr;
	}

	.filters__submit { grid-column: auto; justify-self: start; padding: 11px 38px; }
	.filters__limit { grid-column: auto; justify-self: end; }


	:root { --header-h: 80px; }

	.section { padding-block: 60px; }

	.nav-toggle { display: none; }

	.site-nav { display: block; }

	.nav-list { display: flex; gap: 28px; }

	.nav-list li { border: none; }

	.nav-list a {
		flex-direction: column; align-items: center; gap: 1px;
		padding: 4px 2px;
	}

	.nav-list__jp { font-size: 14.5px; letter-spacing: .04em; }

	.btn-cta--header { font-size: 14px; padding: 11px 20px; }

	.logo-img--header { max-height: 50px; }
	.logo-img--cta { max-height: 56px; }
	.btn-cta--image.btn-cta--header img { max-height: 44px; }
	.btn-cta--image.btn-cta--bottom img { max-height: 56px; }

	.logo-text__mark { font-size: 26px; }

		.hero { min-height: 70vh; }
	.hero__inner { padding-block: 72px; }

	.card-row { grid-template-columns: repeat(4, 1fr); }
	.card-grid { grid-template-columns: repeat(4, 1fr); }
	.pirate-grid { grid-template-columns: repeat(4, 1fr); }

	.report__gallery { grid-template-columns: repeat(4, 1fr); }
}

/* =========================================================
   広い画面
   ========================================================= */

@media (min-width: 1200px) {
	.section { padding-block: 64px; }
	.nav-list { gap: 20px; }

	.card-row { grid-template-columns: repeat(5, 1fr); }
	.card-grid { grid-template-columns: repeat(5, 1fr); }
	.pirate-grid { grid-template-columns: repeat(5, 1fr); }
}

/* =========================================================
   横向きの狭い画面
   ========================================================= */

@media (max-height: 480px) and (orientation: landscape) {
	.hero { min-height: 0; }
	.hero__inner { padding-block: 44px; }
}

/* =========================================================
   結果詳細の判子
   ========================================================= */

.result-header { position: relative; }

.stamp--detail {
	position: absolute; top: 18px; right: 0;
	color: #ff6b5a; border-color: #ff6b5a;
	box-shadow: inset 0 0 0 3px rgba(255, 107, 90, .9);
	background: rgba(8, 15, 25, .4);
}

@media (min-width: 768px) {
	.stamp--detail { width: 78px; height: 78px; font-size: 21px; top: 22px; }
}

/* =========================================================
   ページ送り
   ========================================================= */

.pager {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 6px;
	margin-top: 28px;
}

.pager:empty { display: none; }

.pager__item {
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 14px;
	line-height: 1;
	border-radius: 3px;
	border: 1px solid;
	cursor: pointer;
	transition: background .2s, color .2s;
}

.pager__item--nav { font-size: 13px; }

.pager__item:disabled { opacity: .35; cursor: default; }

/* 明るいセクション */
.section--light .pager__item {
	color: #5c4a2e;
	border-color: rgba(138, 108, 21, .55);
	background: rgba(255, 255, 255, .6);
}

.section--light .pager__item:not(:disabled):hover {
	background: var(--gold-d);
	color: #fff8e6;
}

.section--light .pager__item.is-current {
	background: linear-gradient(180deg, #a62323, #7d1414 55%, #5c0e0e);
	border-color: var(--gold);
	color: #fdf1dd;
}

/* 暗いセクション */
.section--dark .pager__item {
	color: var(--gold-l);
	border-color: var(--gold);
	background: rgba(201, 162, 39, .08);
}

.section--dark .pager__item:not(:disabled):hover {
	background: var(--gold);
	color: var(--night);
}

.section--dark .pager__item.is-current {
	background: linear-gradient(180deg, #a62323, #7d1414 55%, #5c0e0e);
	border-color: var(--gold);
	color: #fdf1dd;
}

@media (min-width: 768px) {
	.pager { gap: 8px; margin-top: 36px; }
	.pager__item { min-width: 44px; height: 44px; font-size: 15px; }
}