/*
Theme Name: Sanda Pickleball ACTION
Theme URI: https://example.com/
Author: FEAT. Inc.
Author URI: https://feat-co.ltd/
Description: SANDA PICKLEBALL TEAM 公式サイト用のオリジナルテーマ（v1.13 ACTION デザイン）。練習会・大会情報を掲載する掲示板（カスタム投稿タイプ「イベント」）を備えています。
Version: 1.13.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sanda-pickleball
Tags: sports, club, custom-post-type
*/

/* =========================================================
   0. 変数・リセット
   白地・黒文字・余白が主。色は意味のあるところにだけ使う。
   ライム＝押せるもの／ネイビー＝見出しと文字／銅＝ごく一部の区切り
   ========================================================= */
:root {
	--navy: #1c293a;
	--navy-deep: #131d29;
	--navy-2: #24364c;
	--lime: #def349;
	--lime-deep: #c3d92f;
	--lime-pale: #f4fbd8;
	--copper: #c18457;
	--ink: #1a1f26;
	--ink-soft: #5a646e;
	--bg: #ffffff;
	--bg-soft: #f7f8f5;
	--mist: #f4f7ec;
	--line: #dfe3dd;
	--line-strong: #c3c9c2;
	--white: #ffffff;

	--wrap: 1160px;
	--wrap-narrow: 760px;
	--radius: 4px;

	--font: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
	--en: "Anton", "Arial Narrow", Impact, sans-serif;
}

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

html {
	scroll-behavior: smooth;
	scroll-padding-top: 80px;
}

body {
	margin: 0;
	font-family: var(--font);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.85;
	color: var(--ink);
	background: var(--bg);
	-webkit-text-size-adjust: 100%;
	overflow-wrap: break-word;
	/* 日本語は文節で折り返す。中途半端な位置で行が切れるのを防ぐ */
	word-break: auto-phrase;
	text-wrap: pretty;
	/* 傾けた帯やテロップで横スクロールが出ないようにする */
	overflow-x: hidden;
	overflow-x: clip;
}

h1, h2, h3 {
	text-wrap: balance;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

a {
	color: var(--navy);
	text-underline-offset: 3px;
}

a:hover {
	opacity: .75;
}

h1, h2, h3, h4 {
	line-height: 1.5;
	font-weight: 700;
	margin: 0 0 .6em;
}

p {
	margin: 0 0 1.4em;
}

ul, ol {
	padding-left: 1.4em;
}

table {
	border-collapse: collapse;
	width: 100%;
}

.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;
	background: var(--lime);
	color: var(--navy);
	padding: 10px 16px;
	z-index: 999;
}

.skip-link:focus {
	left: 0;
}

/* =========================================================
   1. レイアウト
   ========================================================= */
.wrap {
	width: min(100% - 40px, var(--wrap));
	margin-inline: auto;
}

.wrap--narrow {
	width: min(100% - 40px, var(--wrap-narrow));
	margin-inline: auto;
}

.section {
	padding: 60px 0;
	border-top: 1px solid var(--line);
}

.section:first-of-type {
	border-top: 0;
}

.section--soft {
	background: var(--bg-soft);
}

/* 丸のあしらい。トップ冒頭の円と同じモチーフを、セクションにも展開する。
   置きすぎるとうるさいので、2〜3か所にとどめる */
.has-circle {
	position: relative;
	overflow: hidden;
}

.has-circle > .wrap,
.has-circle > .wrap--narrow {
	position: relative;
	z-index: 1;
}

.has-circle::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	z-index: 0;
}

/* 塗りの円（左下） */
.has-circle--fill::after {
	left: -130px;
	bottom: -150px;
	width: 380px;
	height: 380px;
	background: var(--lime-pale);
}

/* 輪郭だけの円（右上）。同じモチーフで表情を変える */
.has-circle--ring::after {
	right: -110px;
	top: -110px;
	width: 340px;
	height: 340px;
	border: 16px solid var(--lime-pale);
}

.section--dark.has-circle--ring::after {
	border-color: rgba(222, 243, 73, .14);
}

@media (max-width: 780px) {
	.has-circle--fill::after {
		left: -110px;
		bottom: -130px;
		width: 240px;
		height: 240px;
	}

	.has-circle--ring::after {
		right: -80px;
		top: -80px;
		width: 220px;
		height: 220px;
		border-width: 12px;
	}
}

/* 薄いライム。白ばかりで平坦にならないように挟む */
.section--tint {
	background: linear-gradient(180deg, var(--lime-pale) 0%, #fbfef2 100%);
	border-top-color: transparent;
}

/* 濃紺。写真を映えさせたい箇所に1つだけ使う */
.section--dark {
	background: var(--navy);
	color: rgba(255, 255, 255, .88);
	border-top-color: transparent;
	position: relative;
	overflow: hidden;
}

.section--dark::before {
	content: "";
	position: absolute;
	right: -120px;
	top: -80px;
	width: 420px;
	height: 420px;
	background: url("assets/img/logo-512.png") center/contain no-repeat;
	opacity: .06;
	pointer-events: none;
}

.section--dark .section__title,
.section--dark .profile__name,
.section--dark .record h3 {
	color: var(--white);
}

.section--dark .section__lead,
.section--dark .profile__role,
.section--dark .record li::before,
.section--dark .profile-table th {
	color: rgba(255, 255, 255, .62);
}

.section--dark .profile-table,
.section--dark .profile-table th,
.section--dark .profile-table td,
.section--dark .record h3 {
	border-color: rgba(255, 255, 255, .18);
}

.section--dark .profile-table li::before {
	color: var(--lime);
}

.section--dark a {
	color: var(--lime);
}

/* 見出し（下層ページの本文内）。斜めのライムを左に置く */
.section__title {
	font-size: clamp(21px, 2.6vw, 27px);
	font-weight: 900;
	margin: 0 0 24px;
	padding-left: 22px;
	position: relative;
}

.section__title::before {
	content: "";
	position: absolute;
	left: 0;
	top: .2em;
	width: 10px;
	height: 1.1em;
	background: var(--lime);
	transform: skewX(-12deg);
}

.section__title + .section__lead {
	margin-top: -14px;
}

.section__lead {
	color: var(--ink-soft);
	margin-bottom: 28px;
	max-width: 44em;
}

/* トップのセクション見出し：英字の白抜き＋日本語 */
.sec {
	position: relative;
	padding-block: 96px;
}

.sec--mist {
	background: var(--mist);
}

.sec__head {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 6px 18px;
	margin-bottom: 40px;
}

.sec__en {
	font-family: var(--en);
	font-size: clamp(52px, 8vw, 104px);
	line-height: .85;
	letter-spacing: .01em;
	color: transparent;
	-webkit-text-stroke: 2px var(--navy);
	transform: skewX(-8deg);
}

.sec__ja {
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 900;
	line-height: 1.3;
	margin: 0;
	padding-bottom: 6px;
}

.sec__lead {
	color: var(--ink-soft);
	max-width: 40em;
	margin: -18px 0 32px;
}

.more {
	margin-top: 28px;
}

/* ボタン：丸いピル型。押せるものだけライム */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6em;
	min-height: 48px;
	padding: 11px 26px;
	border: 2px solid var(--lime);
	border-radius: 999px;
	background: var(--lime);
	color: var(--navy);
	font-family: inherit;
	font-weight: 900;
	font-size: 15.5px;
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
	transition: transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease;
}

.btn:hover {
	background: var(--lime-deep);
	border-color: var(--lime-deep);
	opacity: 1;
	transform: translateY(-2px);
}

.btn .arw {
	display: inline-block;
	transition: transform .2s ease;
}

.btn:hover .arw {
	transform: translateX(4px);
}

/* 白地の上の控えめなボタン（枠線だけ） */
.btn--plain {
	background: transparent;
	border-color: var(--navy);
	color: var(--navy);
}

.btn--plain:hover {
	background: var(--navy);
	border-color: var(--navy);
	color: var(--white);
}

.btn--ink {
	background: var(--navy);
	border-color: var(--navy);
	color: var(--white);
}

.btn--ink:hover {
	background: var(--navy-2);
	border-color: var(--navy-2);
}

/* 写真・濃紺の上で使う白枠のボタン */
.btn--line {
	background: transparent;
	border-color: rgba(255, 255, 255, .75);
	color: var(--white);
}

.btn--line:hover {
	background: rgba(255, 255, 255, .12);
	border-color: var(--white);
}

.btn--sm {
	min-height: 40px;
	padding: 7px 20px;
	font-size: 14px;
}

.btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

/* =========================================================
   2. ヘッダー
   ========================================================= */
.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(255, 255, 255, .94);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--line);
}

/* ログイン中は管理バーの下に付ける */
.admin-bar .site-header {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar .site-header {
		top: 46px;
	}
}

@media (max-width: 600px) {
	.admin-bar .site-header {
		top: 0;
	}
}

.site-header__inner {
	width: min(100% - 40px, var(--wrap));
	margin-inline: auto;
	display: flex;
	align-items: center;
	gap: 16px;
	min-height: 68px;
}

.site-brand {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-right: auto;
	min-width: 0;
	color: var(--navy);
	text-decoration: none;
}

.site-brand:hover {
	opacity: 1;
}

.site-brand img {
	width: 44px;
	height: 44px;
	object-fit: contain;
	flex-shrink: 0;
}

.site-brand__name {
	font-family: var(--en);
	font-weight: 400;
	font-size: 19px;
	letter-spacing: .04em;
	line-height: 1;
}

.site-brand__sub {
	display: block;
	font-family: var(--font);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .08em;
	color: var(--ink-soft);
	margin-top: 4px;
}

.global-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 26px;
}

.global-nav a {
	display: block;
	color: var(--navy);
	font-weight: 700;
	font-size: 14.5px;
	text-decoration: none;
}

.global-nav a:hover,
.global-nav .current-menu-item > a,
.global-nav .current_page_item > a {
	color: var(--copper);
	opacity: 1;
}

/* 最後の項目（お問い合わせ）はボタンにする */
.global-nav li:last-child a {
	padding: 9px 20px;
	border-radius: 999px;
	background: var(--lime);
	color: var(--navy);
	font-weight: 900;
	font-size: 14px;
	transition: transform .2s ease, background-color .2s ease;
}

.global-nav li:last-child a:hover {
	background: var(--lime-deep);
	color: var(--navy);
	transform: translateY(-2px);
}

.nav-toggle {
	display: none;
	position: relative;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 10px;
	background: var(--navy);
	cursor: pointer;
	flex-shrink: 0;
}

.nav-toggle span:not(.screen-reader-text) {
	position: absolute;
	left: 12px;
	right: 12px;
	height: 2px;
	background: var(--lime);
	transition: transform .25s ease, opacity .25s ease;
}

.nav-toggle span:nth-child(1) { top: 15px; }
.nav-toggle span:nth-child(2) { top: 21px; }
.nav-toggle span:nth-child(3) { top: 27px; }

.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 900px) {
	.nav-toggle {
		display: block;
	}

	.global-nav {
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		background: var(--white);
		padding: 8px max(20px, env(safe-area-inset-right, 0px)) 22px max(20px, env(safe-area-inset-left, 0px));
		border-bottom: 3px solid var(--lime);
		box-shadow: 0 18px 30px rgba(28, 41, 58, .12);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-8px);
		transition: opacity .25s ease, transform .25s ease, visibility .25s;
	}

	.global-nav.is-open {
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.global-nav ul {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.global-nav a {
		padding: 14px 4px;
		border-bottom: 1px solid var(--line);
		font-size: 16px;
	}

	.global-nav li:last-child a {
		margin-top: 16px;
		padding: 14px;
		border-bottom: 0;
		text-align: center;
		font-size: 16px;
	}
}

@media (max-width: 600px) {
	.site-brand__sub {
		display: none;
	}

	.site-brand__name {
		font-size: 17px;
	}
}

/* =========================================================
   3. トップ：ヒーロー・次の予定・数字
   写真を全面に敷き、斜めの切り返しで動きを出す。
   ========================================================= */
.hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: min(88svh, 820px);
	color: var(--white);
	overflow: hidden;
	clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
}

.hero__bg {
	position: absolute;
	inset: 0;
}

.hero__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* 写真の右上にボールがあるので、そこを残して切り抜く */
	object-position: 70% 15%;
	transform: scale(1.06);
	transform-origin: 70% 15%;
	animation: spt-zoom 9s ease-out forwards;
}

@keyframes spt-zoom {
	to { transform: scale(1); }
}

.hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(100deg, rgba(28, 41, 58, .9) 0%, rgba(28, 41, 58, .62) 42%, rgba(28, 41, 58, .05) 75%),
		linear-gradient(0deg, rgba(28, 41, 58, .55), transparent 45%);
}

.hero .wrap {
	position: relative;
	z-index: 2;
	padding-block: 120px;
}

.hero__label {
	display: inline-block;
	background: var(--lime);
	color: var(--navy);
	font-weight: 900;
	font-size: 14px;
	letter-spacing: .06em;
	padding: 4px 14px;
	transform: skewX(-10deg);
}

.hero__label span {
	display: inline-block;
	transform: skewX(10deg);
}

.hero__title {
	color: var(--white);
	font-weight: 900;
	font-size: clamp(36px, 6.4vw, 78px);
	line-height: 1.22;
	letter-spacing: .01em;
	margin: 22px 0;
}

.hero__title .ln {
	display: block;
}

.hero__title .ln > span {
	display: inline-block;
	animation: spt-up .8s cubic-bezier(.2, .8, .2, 1) both;
}

.hero__title .ln:nth-child(2) > span { animation-delay: .12s; }
.hero__title .ln:nth-child(3) > span { animation-delay: .24s; }

@keyframes spt-up {
	from { transform: translateX(-.4em); }
}

/* 文字にかかるライムの斜め帯 */
.hl {
	position: relative;
	z-index: 0;
	color: var(--navy);
	padding: 0 .12em;
	margin: 0 .04em;
}

.hl::before {
	content: "";
	position: absolute;
	inset: .08em -.02em .02em;
	background: var(--lime);
	transform: skewX(-10deg);
	z-index: -1;
}

.hero__text {
	max-width: 34em;
	font-size: clamp(15px, 1.5vw, 17px);
	margin: 0;
	animation: spt-fade .8s .5s both;
}

.hero__note {
	max-width: 34em;
	margin: .4em 0 0;
	color: var(--lime);
	font-size: clamp(15px, 1.5vw, 17px);
	animation: spt-fade .8s .5s both;
}

@keyframes spt-fade {
	from { transform: translateY(14px); }
}

.hero .btn-row {
	margin-top: 30px;
	animation: spt-fade .8s .7s both;
}

.hero__mark {
	position: absolute;
	right: max(20px, env(safe-area-inset-right, 0px));
	top: 90px;
	z-index: 2;
	font-family: var(--en);
	font-size: clamp(14px, 1.3vw, 17px);
	letter-spacing: .32em;
	writing-mode: vertical-rl;
	color: rgba(255, 255, 255, .75);
}

/* 次の予定を流す帯 */
.ticker {
	position: relative;
	z-index: 4;
	margin: -58px -20px 0;
	background: var(--lime);
	transform: rotate(-2deg);
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(28, 41, 58, .15);
}

.ticker a {
	display: block;
	color: var(--navy);
	text-decoration: none;
}

.ticker a:hover {
	opacity: 1;
}

.ticker__track {
	display: flex;
	width: max-content;
	animation: spt-scroll 96s linear infinite;
}

.ticker:hover .ticker__track {
	animation-play-state: paused;
}

.ticker__item {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 14px 28px;
	white-space: nowrap;
	font-weight: 900;
	font-size: 17px;
}

.ticker__item .en {
	font-family: var(--en);
	font-weight: 400;
	font-size: 24px;
	letter-spacing: .03em;
}

.ticker__item .st {
	background: var(--navy);
	color: var(--lime);
	font-size: 13px;
	padding: 2px 10px;
	border-radius: 4px;
}

.ticker__item .dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--navy);
}

@keyframes spt-scroll {
	to { transform: translateX(-50%); }
}

/* 事実を数字で見せる帯 */
.facts {
	padding-block: 84px 40px;
}

.facts ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.facts li {
	padding: 6px 28px;
	border-left: 3px solid var(--navy);
	transform: skewX(-8deg);
}

.facts li:first-child {
	border-left-color: var(--lime-deep);
}

.facts li > div {
	transform: skewX(8deg);
}

.facts__num {
	display: block;
	font-weight: 900;
	font-size: clamp(34px, 4.6vw, 56px);
	line-height: 1.1;
	letter-spacing: -.01em;
	color: var(--navy);
}

.facts__num .en {
	font-family: var(--en);
	font-weight: 400;
	font-size: 1.35em;
	line-height: .9;
	margin-right: .06em;
}

.facts__num small {
	font-size: .5em;
	margin-left: .1em;
}

.facts__label {
	display: block;
	color: var(--ink-soft);
	font-size: 14px;
	font-weight: 700;
	margin-top: 6px;
}

/* 参加するには */
.join {
	display: grid;
	grid-template-columns: 1.1fr .9fr;
	gap: 56px;
	align-items: center;
}

.join > div {
	min-width: 0;
}

.join__photo {
	position: relative;
	border-radius: 18px;
	overflow: hidden;
	transform: rotate(2deg);
	box-shadow: -14px 14px 0 var(--navy);
}

.join__photo img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

@media (max-width: 900px) {
	.join {
		grid-template-columns: 1fr;
		gap: 40px;
	}
}

@media (max-width: 600px) {
	.hero {
		min-height: min(86svh, 760px);
		clip-path: polygon(0 0, 100% 0, 100% 95%, 0 100%);
	}

	.hero::after {
		background: linear-gradient(0deg, rgba(28, 41, 58, .92) 0%, rgba(28, 41, 58, .72) 50%, rgba(28, 41, 58, .15) 100%);
	}

	.hero .wrap {
		padding-block: 90px 96px;
	}

	.hero__mark {
		display: none;
	}

	.hero__bg img {
		object-position: 92% 20%;
	}

	.hero .btn {
		width: 100%;
	}

	.ticker {
		margin-top: -40px;
	}

	.ticker__item {
		font-size: 15px;
		padding: 11px 20px;
	}

	.ticker__item .en {
		font-size: 20px;
	}

	.facts {
		padding-block: 64px 20px;
	}

	.facts ul {
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.facts li {
		padding: 2px 20px;
	}

	.sec {
		padding-block: 72px;
	}

	.sec__head {
		margin-bottom: 28px;
	}
}

/* 下層ページの見出し：濃紺の帯に英字の白抜き */
.page-head {
	position: relative;
	background: var(--navy);
	color: var(--white);
	padding-block: 56px 72px;
	overflow: hidden;
	clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%);
}

/* ボールの穴を模したドット。右側にだけ薄く敷く */
.page-head::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 40%;
	background-image: radial-gradient(rgba(222, 243, 73, .16) 22%, transparent 23%);
	background-size: 26px 26px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 70%);
	mask-image: linear-gradient(90deg, transparent, #000 70%);
	pointer-events: none;
}

.page-head .wrap {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 8px 20px;
}

.page-head__en {
	font-family: var(--en);
	font-size: clamp(48px, 8vw, 96px);
	line-height: .85;
	letter-spacing: .01em;
	color: transparent;
	-webkit-text-stroke: 2px var(--lime);
	transform: skewX(-8deg);
}

.page-head__title {
	color: var(--white);
	font-size: clamp(22px, 3.2vw, 32px);
	font-weight: 900;
	line-height: 1.35;
	margin: 0;
	padding-bottom: 4px;
}

.breadcrumb {
	font-size: 12px;
	color: var(--ink-soft);
	padding: 14px 0 10px;
}

.breadcrumb ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	width: min(100% - 40px, var(--wrap));
	margin-inline: auto;
}

.breadcrumb li + li::before {
	content: "›";
	margin-right: 8px;
	color: var(--line-strong);
}

.breadcrumb a {
	color: var(--ink-soft);
}

@media (max-width: 600px) {
	.page-head {
		padding-block: 40px 56px;
		clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%);
	}
}

/* バナー（トップの告知枠） */
.banner-area {
	padding-block: 20px 10px;
}

.banner-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 16px;
}

.banner__link {
	display: block;
	text-decoration: none;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 14px 40px rgba(28, 41, 58, .12);
	transition: transform .25s ease, box-shadow .25s ease;
}

.banner__link:hover {
	opacity: 1;
	transform: translateY(-3px);
	box-shadow: 0 18px 44px rgba(28, 41, 58, .16);
}

.banner__image {
	display: block;
	width: 100%;
	height: auto;
}

/* 画像を登録していないときの、文字だけのバナー */
.banner__text {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 16px;
	background: var(--navy);
	color: var(--white);
	padding: 22px 28px;
}

.banner__text::after {
	content: "→";
	margin-left: auto;
	color: var(--lime);
	font-weight: 900;
}

.banner__title {
	font-size: 18px;
	font-weight: 900;
}

.banner__sub {
	font-size: 13px;
	color: rgba(255, 255, 255, .78);
}

@media (max-width: 600px) {
	.banner__text {
		padding: 16px 18px;
	}

	.banner__title {
		font-size: 15px;
	}

	.banner__text::after {
		margin-left: 0;
	}
}
/* =========================================================
   4. 掲示板
   サイトの主役。色は種別の判別にだけ使う。
   ========================================================= */
.event-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 22px;
}

/* 1件ずつ、太枠＋ライムの影のカードにする */
.event-card {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr) auto;
	align-items: stretch;
	background: var(--white);
	border: 2px solid var(--navy);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 8px 8px 0 var(--lime);
	transition: transform .2s ease, box-shadow .2s ease;
}

.event-card:hover {
	transform: translate(-2px, -2px);
	box-shadow: 10px 10px 0 var(--lime);
}

/* 種別ごとに影の色を変える。パッと見で練習会か大会か分かる */
.event-card--tournament { box-shadow: 8px 8px 0 var(--copper); }
.event-card--tournament:hover { box-shadow: 10px 10px 0 var(--copper); }
.event-card--trial { box-shadow: 8px 8px 0 #4a7fa5; }
.event-card--trial:hover { box-shadow: 10px 10px 0 #4a7fa5; }
.event-card--lesson { box-shadow: 8px 8px 0 #6b7f92; }
.event-card--lesson:hover { box-shadow: 10px 10px 0 #6b7f92; }

/* 終了・満員・中止は控えめに */
.event-card--closed,
.event-card--closed:hover {
	border-color: var(--line-strong);
	box-shadow: 6px 6px 0 var(--line);
	color: var(--ink-soft);
	transform: none;
}

.event-card--closed .event-card__date {
	background: var(--ink-soft);
}

.event-card--closed .event-card__title a {
	color: var(--ink-soft);
}

/* 開催日が未入力のとき（管理画面で入力すれば通常表示に戻る） */
.event-card--nodate {
	grid-template-columns: minmax(0, 1fr) auto;
}

.event-card__date {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: var(--navy);
	color: var(--white);
	padding: 20px 14px;
	line-height: 1.1;
}

.event-card__date .y {
	font-family: var(--en);
	font-size: 16px;
	letter-spacing: .12em;
	color: var(--lime);
}

.event-card__date .md {
	font-family: var(--en);
	font-size: 46px;
	line-height: 1;
	letter-spacing: .01em;
	white-space: nowrap;
	margin-top: 4px;
}

.event-card__date .w {
	display: inline-block;
	margin-top: 8px;
	padding: 1px 10px;
	border-radius: 4px;
	background: var(--lime);
	color: var(--navy);
	font-size: 13px;
	font-weight: 900;
}

.event-card__body {
	min-width: 0;
	padding: 22px 26px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
}

.event-card__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.tag {
	display: inline-block;
	font-size: 12.5px;
	font-weight: 900;
	line-height: 1.6;
	padding: 1px 12px;
	border-radius: 999px;
	border: 1.5px solid var(--navy);
	background: var(--white);
	color: var(--navy);
	text-decoration: none;
}

.tag--practice { background: var(--lime); border-color: var(--lime); }
.tag--tournament { border-color: var(--copper); color: #8f5a33; }
.tag--trial { border-color: #4a7fa5; color: #2f5f85; }
.tag--lesson { border-color: #6b7f92; color: #4c5f72; }

/* 募集状況 */
.tag--open { background: var(--copper); border-color: var(--copper); color: var(--white); }
.tag--few { background: #a8701c; border-color: #a8701c; color: var(--white); }
.tag--full,
.tag--closed { border-color: var(--line-strong); color: var(--ink-soft); }
.tag--cancel { border-color: #b5453c; color: #b5453c; }

.event-card__title {
	font-size: clamp(18px, 2vw, 23px);
	font-weight: 900;
	line-height: 1.4;
	margin: 0;
}

.event-card__title a {
	color: var(--navy);
	text-decoration: none;
}

.event-card__title a:hover {
	text-decoration: underline;
	opacity: 1;
}

.event-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 18px;
	font-size: 13.5px;
	color: var(--ink-soft);
	line-height: 1.8;
}

.event-card__meta span::before {
	content: attr(data-label) "：";
	font-weight: 700;
	color: var(--navy);
}

.event-card__action {
	display: flex;
	align-items: center;
	padding: 22px 26px 22px 0;
	white-space: nowrap;
}

@media (max-width: 900px) {
	.event-card {
		grid-template-columns: 140px minmax(0, 1fr);
	}

	.event-card__date .md {
		font-size: 38px;
	}

	.event-card__action {
		grid-column: 1 / -1;
		padding: 14px 20px;
		border-top: 1px solid var(--line);
	}

	.event-card__action .btn {
		width: 100%;
	}
}

@media (max-width: 600px) {
	.event-card,
	.event-card--nodate {
		grid-template-columns: 1fr;
	}

	.event-card__date {
		flex-direction: row;
		justify-content: flex-start;
		align-items: baseline;
		gap: 12px;
		padding: 12px 20px;
	}

	.event-card__date .md {
		font-size: 34px;
		margin-top: 0;
	}

	.event-card__date .w {
		margin-top: 0;
	}

	.event-card__body {
		padding: 16px 20px;
	}
}

/* 種別のしぼり込み */
.event-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 32px;
	font-size: 14px;
}

.event-filter a {
	display: inline-block;
	padding: 6px 18px;
	border: 2px solid var(--navy);
	border-radius: 999px;
	color: var(--navy);
	font-weight: 700;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}

.event-filter a:hover {
	background: var(--mist);
	opacity: 1;
}

.event-filter a.is-current {
	background: var(--navy);
	color: var(--lime);
}

.event-empty {
	padding: 28px 24px;
	color: var(--ink-soft);
	background: var(--mist);
	border-radius: 12px;
}

.board-group + .board-group {
	margin-top: 64px;
}

.board-group__title {
	display: flex;
	align-items: baseline;
	gap: 10px;
	font-size: 20px;
	font-weight: 900;
	margin-bottom: 20px;
}

.board-group__title::before {
	content: "";
	align-self: center;
	width: 10px;
	height: 1.1em;
	background: var(--lime);
	transform: skewX(-12deg);
}

.board-group__title .count {
	font-size: 13px;
	color: var(--ink-soft);
	font-weight: 500;
}

/* イベント詳細 */
.event-detail__table {
	margin: 24px 0 32px;
	border-top: 1px solid var(--line);
	font-size: 15px;
}

.event-detail__table th,
.event-detail__table td {
	text-align: left;
	vertical-align: top;
	padding: 13px 4px;
	border-bottom: 1px solid var(--line);
}

.event-detail__table th {
	width: 7em;
	font-weight: 700;
	white-space: nowrap;
}

.event-detail__cta {
	border: 1px solid var(--line);
	padding: 24px;
	margin: 32px 0;
}

.event-detail__cta p {
	margin-bottom: 16px;
}

@media (max-width: 600px) {
	.event-detail__table th,
	.event-detail__table td {
		display: block;
		width: auto;
		border-bottom: 0;
		padding: 4px;
	}

	.event-detail__table th {
		padding-top: 13px;
		font-size: 13px;
		color: var(--ink-soft);
	}

	.event-detail__table td {
		border-bottom: 1px solid var(--line);
		padding-bottom: 13px;
	}
}

/* =========================================================
   5. クラブ紹介・活動場所・代表
   ========================================================= */
.plain-list {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.plain-list li {
	position: relative;
	padding-left: 1.1em;
	margin-bottom: 6px;
}

.plain-list li::before {
	content: "・";
	position: absolute;
	left: 0;
	color: var(--ink-soft);
}

/* 活動場所：4会場の位置関係図（トップと活動場所ページで共通） */
.vmap {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}

.vmap__fig {
	margin: 0;
	background: var(--navy);
	border-radius: 18px;
	padding: 12px;
	box-shadow: 10px 10px 0 var(--lime);
}

.vmap__fig svg {
	display: block;
	width: 100%;
	height: auto;
}

.vmap__fig figcaption {
	color: rgba(255, 255, 255, .7);
	font-size: 12px;
	padding: 6px 8px 2px;
}

.vmap .m-grid line { stroke: rgba(255, 255, 255, .07); stroke-width: 1; }
.vmap .m-big { font-family: var(--en); font-size: 96px; fill: none; stroke: rgba(222, 243, 73, .16); stroke-width: 1.5; letter-spacing: .02em; }
.vmap .m-route { stroke: var(--lime); stroke-width: 3; stroke-dasharray: 2 10; stroke-linecap: round; }
.vmap .m-dist-bg { fill: var(--lime); }
.vmap .m-dist { font-family: var(--font); font-weight: 900; font-size: 17px; fill: var(--navy); }
.vmap .m-area { fill: rgba(222, 243, 73, .08); stroke: var(--lime); stroke-width: 1.5; stroke-dasharray: 6 6; }
.vmap .m-area-l { font-family: var(--font); font-weight: 900; font-size: 17px; fill: var(--white); }
.vmap .m-ref circle { fill: none; stroke: rgba(255, 255, 255, .7); stroke-width: 2; }
.vmap .m-ref text { font-family: var(--font); font-weight: 700; font-size: 13px; fill: rgba(255, 255, 255, .75); }
.vmap .m-pin { cursor: pointer; }
.vmap .m-pin circle { fill: var(--lime); stroke: var(--navy); stroke-width: 3; transition: r .2s ease; }
.vmap .m-pin text { font-family: var(--en); font-size: 19px; fill: var(--navy); }
.vmap .m-pin .m-nm { font-family: var(--font); font-weight: 900; font-size: 14px; fill: var(--white); paint-order: stroke; stroke: var(--navy); stroke-width: 4px; }
.vmap .m-pin.is-on circle { r: 22; fill: var(--white); }
.vmap .m-n path { fill: var(--white); }
.vmap .m-n text { font-family: var(--en); font-size: 14px; fill: var(--white); }
.vmap .m-scale path { stroke: var(--white); stroke-width: 2; fill: none; }
.vmap .m-scale text { font-family: var(--en); font-size: 13px; fill: var(--white); letter-spacing: .05em; }

.vmap__list {
	display: flex;
	flex-direction: column;
	gap: 28px;
	min-width: 0;
}

.vmap__area h3 {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 10px;
	margin: 0 0 12px;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.4;
}

.vmap__area h3 .en {
	font-family: var(--en);
	font-weight: 400;
	font-size: 15px;
	letter-spacing: .06em;
	background: var(--lime);
	padding: 2px 10px;
	transform: skewX(-12deg);
}

.vmap__area h3 small {
	flex-basis: 100%;
	font-size: 13px;
	font-weight: 700;
	color: var(--ink-soft);
}

.vmap__area ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.vmap__area li {
	display: grid;
	grid-template-columns: 50px minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	background: var(--mist);
	border-left: 6px solid var(--navy);
	border-radius: 0 12px 12px 0;
	padding: 14px 16px;
	transition: transform .2s ease, border-color .2s ease;
}

.vmap__area li.is-on {
	transform: translateX(6px);
	border-left-color: var(--lime-deep);
}

.vmap__no {
	font-family: var(--en);
	font-size: 34px;
	line-height: 1;
	color: var(--lime-deep);
	-webkit-text-stroke: 1px var(--navy);
}

.vmap__nm {
	display: block;
	font-weight: 900;
	font-size: 17px;
	line-height: 1.4;
}

.vmap__ad {
	display: block;
	color: var(--ink-soft);
	font-size: 13px;
	line-height: 1.5;
}

.vmap__go {
	white-space: nowrap;
	font-weight: 900;
	font-size: 13px;
	color: var(--navy);
	border: 2px solid var(--navy);
	border-radius: 999px;
	padding: 5px 12px;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}

.vmap__go:hover {
	background: var(--navy);
	color: var(--white);
	opacity: 1;
}

.vmap .more {
	margin-top: 0;
}

@media (max-width: 900px) {
	.vmap {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.vmap__fig {
		box-shadow: 6px 6px 0 var(--lime);
	}

	/* スマホでは地図の文字を大きくし、会場名は下の一覧に任せる */
	.vmap .m-pin .m-nm { display: none; }
	.vmap .m-pin circle { r: 24; }
	.vmap .m-pin text { font-size: 26px; transform: translateY(3px); }
	.vmap .m-pin.is-on circle { r: 28; }
	.vmap .m-area-l { font-size: 26px; }
	.vmap .m-dist { font-size: 22px; }
	.vmap .m-ref text { font-size: 16px; }
	.vmap .m-scale text,
	.vmap .m-n text { font-size: 20px; }
	.vmap .m-big { font-size: 110px; }
}

/* 活動場所ページ：会場ごとの詳細 */
.vmap--page {
	margin-bottom: 72px;
}

.venue-detail {
	padding-top: 48px;
	margin-top: 48px;
	border-top: 2px solid var(--navy);
	scroll-margin-top: 90px;
}

.venue-detail:first-of-type {
	border-top: 0;
	margin-top: 0;
	padding-top: 0;
}

.venue-detail__name {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px 14px;
	font-size: clamp(21px, 2.4vw, 26px);
	font-weight: 900;
	margin: 0 0 22px;
}

.venue-detail__no {
	font-family: var(--en);
	font-weight: 400;
	font-size: 1.6em;
	line-height: 1;
	color: var(--lime-deep);
	-webkit-text-stroke: 1px var(--navy);
}

.venue-detail__pref {
	font-size: 13px;
	font-weight: 700;
	color: var(--ink-soft);
}

.venue-detail__body {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
	align-items: start;
}

.venue-detail__body > div {
	min-width: 0;
}

@media (max-width: 820px) {
	.venue-detail__body {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}

.venue-detail__table {
	font-size: 15px;
	border-top: 1px solid var(--line);
	margin-bottom: 18px;
}

.venue-detail__table th,
.venue-detail__table td {
	text-align: left;
	vertical-align: top;
	padding: 12px 4px;
	border-bottom: 1px solid var(--line);
}

.venue-detail__table th {
	width: 6.5em;
	font-weight: 900;
	white-space: nowrap;
}

.venue-detail__note {
	font-size: 14px;
	color: var(--ink-soft);
}

.venue-detail__events {
	margin-top: 32px;
}

.venue-detail__events h3 {
	font-size: 16px;
	font-weight: 900;
	margin: 0 0 14px;
}

/* 活動場所：施設名・住所・地図を1件ずつ並べる（トップ以外で使う） */
.venue-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px;
}

@media (max-width: 780px) {
	.venue-cards {
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

.venue-card__name {
	font-size: 17px;
	margin: 0 0 6px;
}

.venue-card__addr {
	font-size: 14px;
	color: var(--ink-soft);
	margin: 0 0 12px;
	line-height: 1.8;
}

.venue-map {
	position: relative;
	aspect-ratio: 16 / 10;
	background: var(--bg-soft);
	border: 1px solid var(--line);
}

.venue-map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.venue-card__link {
	display: inline-block;
	margin-top: 10px;
	font-size: 13px;
}

/* 住所録として読める形（下層ページ用に残す） */
.venue-list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--line);
}

.venue-list li {
	display: grid;
	grid-template-columns: 15em 1fr auto;
	gap: 6px 24px;
	align-items: baseline;
	padding: 16px 4px;
	border-bottom: 1px solid var(--line);
}

.venue-list__name {
	font-weight: 700;
	font-size: 16px;
}

.venue-list__addr {
	font-size: 14px;
	color: var(--ink-soft);
}

.venue-list__map {
	font-size: 13px;
	white-space: nowrap;
}

@media (max-width: 720px) {
	.venue-list li {
		grid-template-columns: 1fr;
		gap: 2px;
	}

	.venue-list__map {
		margin-top: 4px;
	}
}

/* 代表 */
.coach {
	display: grid;
	grid-template-columns: .85fr 1.15fr;
	gap: 60px;
	align-items: start;
}

.coach > div {
	min-width: 0;
}

.coach__photo {
	position: relative;
}

.coach__photo::before {
	content: "";
	position: absolute;
	inset: 24px -18px -18px 24px;
	background: var(--lime);
	border-radius: 6px;
	transform: skewX(-6deg);
}

.coach__photo img {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 14px;
}

.coach__cap {
	position: absolute;
	left: -10px;
	bottom: 28px;
	background: var(--navy);
	color: var(--white);
	font-family: var(--en);
	font-size: 22px;
	letter-spacing: .06em;
	padding: 6px 16px;
	transform: skewX(-10deg);
}

.coach__name {
	font-size: clamp(34px, 4vw, 48px);
	font-weight: 900;
	line-height: 1.2;
	margin: 0;
}

.coach__name small {
	display: block;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .24em;
	color: var(--ink-soft);
}

.coach__role {
	font-weight: 700;
	color: var(--copper);
	margin: 6px 0 24px;
}

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

.stats div {
	background: var(--navy);
	color: var(--white);
	border-radius: 12px;
	padding: 14px 18px;
}

.stats b {
	font-family: var(--en);
	font-weight: 400;
	font-size: 44px;
	line-height: 1;
	color: var(--lime);
}

.stats b small {
	font-family: var(--font);
	font-weight: 900;
	font-size: 16px;
	margin-left: 4px;
	color: var(--white);
}

.stats span {
	display: block;
	font-size: 13px;
	font-weight: 700;
	opacity: .85;
}

.profile-table {
	font-size: 15px;
}

.profile-table th,
.profile-table td {
	text-align: left;
	vertical-align: top;
	padding: 12px 0;
	border-bottom: 1px solid var(--line);
}

.profile-table th {
	width: 8.5em;
	padding-right: 12px;
	font-weight: 900;
}

.profile-table ul {
	margin: 0;
	padding-left: 1.1em;
}

/* 戦績 */
.results {
	margin-top: 28px;
	display: grid;
	gap: 10px;
}

.results h3 {
	font-size: 14px;
	font-weight: 900;
	letter-spacing: .06em;
	color: var(--ink-soft);
	margin: 12px 0 2px;
}

.res {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	font-weight: 700;
	line-height: 1.6;
}

.res .badge {
	font-size: 13px;
	font-weight: 900;
	padding: 1px 10px;
	border-radius: 4px;
	background: var(--white);
	border: 1.5px solid var(--navy);
}

.res .badge--win {
	background: var(--lime);
	border-color: var(--lime);
}

/* アンバサダー */
.amb {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}

.amb__card {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	gap: 24px;
	align-items: center;
	min-width: 0;
	padding: 28px;
	background: var(--white);
	border: 2px solid var(--navy);
	border-radius: 16px;
}

.amb__card > img {
	width: 150px;
	height: 96px;
	object-fit: contain;
}

.amb__role {
	display: inline-block;
	font-size: 12px;
	font-weight: 900;
	background: var(--navy);
	color: var(--lime);
	padding: 1px 10px;
	border-radius: 4px;
}

.amb__card p {
	margin: 8px 0 14px;
	font-size: 14.5px;
}

/* クーポンは実際に使う情報なので、目に留まる形にする */
.coupon {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	font-size: 13px;
	font-weight: 700;
}

.amb__card .coupon {
	margin: 0 0 14px;
}

.coupon__code {
	font-family: var(--en);
	font-weight: 400;
	font-size: 20px;
	letter-spacing: .06em;
	background: var(--lime);
	color: var(--navy);
	padding: 2px 14px;
	border: 2px dashed var(--navy);
	border-radius: 6px;
	user-select: all;
}

@media (max-width: 900px) {
	.coach {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.amb {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.amb__card {
		grid-template-columns: 1fr;
		padding: 22px;
	}

	.profile-table th {
		width: 6.5em;
	}
}

/* 参加までの流れ（番号つきの文章） */
.flow {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 18px;
	counter-reset: flow;
}

.flow li {
	counter-increment: flow;
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr);
	gap: 18px;
	align-items: center;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 18px 22px 18px 14px;
}

.flow li::before {
	content: "0" counter(flow);
	font-family: var(--en);
	font-size: 58px;
	line-height: 1;
	text-align: center;
	color: var(--navy);
	transform: skewX(-8deg);
	text-shadow: 4px 4px 0 var(--lime);
}

@media (max-width: 600px) {
	.flow li {
		grid-template-columns: 62px minmax(0, 1fr);
		padding: 14px 16px 14px 8px;
	}

	.flow li::before {
		font-size: 44px;
	}
}

.note {
	margin-top: 22px;
	padding-left: 14px;
	border-left: 4px solid var(--copper);
	font-weight: 700;
}

/* お問い合わせページ */
.contact-lead {
	background: var(--lime-pale);
	border-left: 5px solid var(--lime);
	padding: 24px 26px 22px;
}

.contact-lead p {
	margin-bottom: 10px;
}

.contact-lead p:last-of-type {
	margin-bottom: 18px;
}

.contact-cases {
	margin: 0;
	border-top: 1px solid var(--line);
}

.contact-cases dt {
	font-weight: 700;
	color: var(--navy);
	padding: 16px 4px 0;
}

.contact-cases dd {
	margin: 2px 0 0;
	padding: 0 4px 16px;
	border-bottom: 1px solid var(--line);
	font-size: 15px;
	color: var(--ink-soft);
}

.contact-cases dd::before {
	content: "書き添えていただきたいこと：";
	color: #98a1a9;
	font-size: 13px;
}

.contact-table {
	font-size: 15px;
	border-top: 1px solid var(--line);
}

.contact-table th,
.contact-table td {
	text-align: left;
	vertical-align: top;
	padding: 14px 4px;
	border-bottom: 1px solid var(--line);
}

.contact-table th {
	width: 8em;
	font-weight: 500;
	color: var(--ink-soft);
	white-space: nowrap;
}

@media (max-width: 600px) {
	.contact-cases dd::before {
		display: block;
	}

	.contact-table th,
	.contact-table td {
		display: block;
		width: auto;
		border-bottom: 0;
		padding: 4px;
	}

	.contact-table th {
		padding-top: 14px;
		font-size: 13px;
	}

	.contact-table td {
		border-bottom: 1px solid var(--line);
		padding-bottom: 14px;
	}
}

/* フォーム */
.contact-form-area {
	margin-top: 44px;
	scroll-margin-top: 90px;
}

.form {
	margin-bottom: 8px;
}

.form__row {
	margin-bottom: 22px;
}

.form__label {
	display: block;
	font-weight: 700;
	margin-bottom: 7px;
}

.form__req,
.form__any {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	padding: 2px 8px;
	margin-left: 8px;
	border-radius: 2px;
	vertical-align: 2px;
}

.form__req {
	background: #b5453c;
	color: var(--white);
}

.form__any {
	background: var(--bg-soft);
	color: var(--ink-soft);
	border: 1px solid var(--line);
}

.form input[type="text"],
.form input[type="email"],
.form input[type="tel"],
.form select,
.form textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--line-strong);
	border-radius: var(--radius);
	font-family: inherit;
	font-size: 16px;
	line-height: 1.7;
	color: var(--ink);
	background: var(--white);
}

.form select {
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--ink-soft) 50%), linear-gradient(135deg, var(--ink-soft) 50%, transparent 50%);
	background-position: calc(100% - 20px) center, calc(100% - 14px) center;
	background-size: 6px 6px, 6px 6px;
	background-repeat: no-repeat;
	padding-right: 40px;
}

.form input:focus,
.form select:focus,
.form textarea:focus {
	outline: 2px solid var(--lime-deep);
	outline-offset: 1px;
	border-color: var(--lime-deep);
}

.form textarea {
	resize: vertical;
}

.form__note {
	font-size: 13px;
	color: var(--ink-soft);
	margin: 6px 0 0;
}

.form__row--check {
	background: var(--bg-soft);
	border: 1px solid var(--line);
	padding: 14px 16px;
	font-size: 15px;
}

.form__row--check label {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.form__submit {
	margin-top: 28px;
}

.form__submit .btn {
	min-width: 240px;
}

/* どの予定についての問い合わせか、フォームの先頭に示す */
.form__event {
	display: grid;
	gap: 2px;
	background: var(--lime-pale);
	border-left: 5px solid var(--lime);
	padding: 16px 20px;
	margin-bottom: 26px;
}

.form__event-label {
	font-size: 12px;
	color: var(--ink-soft);
}

.form__event-title {
	font-size: 17px;
	font-weight: 700;
	color: var(--navy);
}

.form__event-meta {
	font-size: 14px;
	color: var(--ink-soft);
}

.form__event-link {
	font-size: 13px;
	margin-top: 4px;
	justify-self: start;
}

/* 自動投稿よけ。画面には出さないが、読み上げ対象からも外す */
.form__trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.form-error {
	border: 1px solid #d9a5a1;
	background: #fbeceb;
	padding: 16px 20px;
	margin-bottom: 26px;
	color: #8f342d;
}

.form-error p {
	margin-bottom: 6px;
}

.form-error ul {
	margin: 0;
	padding-left: 1.3em;
	font-size: 15px;
}

.form-done {
	border: 1px solid var(--lime-deep);
	background: var(--lime-pale);
	padding: 24px 26px;
}

.form-done p:last-child {
	margin-bottom: 0;
}

/* よくある質問（お問い合わせページの本文に置く） */
.faq {
	display: grid;
	gap: 0;
	border-top: 1px solid var(--line);
	margin-bottom: 1.6em;
}

.faq details {
	border-bottom: 1px solid var(--line);
}

.faq summary {
	cursor: pointer;
	list-style: none;
	padding: 16px 44px 16px 4px;
	font-weight: 700;
	color: var(--navy);
	position: relative;
}

.faq summary::-webkit-details-marker {
	display: none;
}

.faq summary::after {
	content: "＋";
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--copper);
	font-weight: 700;
}

.faq details[open] summary::after {
	content: "−";
}

.faq__body {
	padding: 0 4px 18px;
	font-size: 15px;
	color: var(--ink-soft);
}

.faq__body p:last-child {
	margin-bottom: 0;
}

/* 末尾の導線：練習の写真を敷き、斜めに切り返す */
.closing {
	position: relative;
	overflow: hidden;
	padding-block: 170px 120px;
	color: var(--white);
	text-align: center;
	background: var(--navy);
	clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%);
}

.closing__bg {
	position: absolute;
	inset: 0;
}

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

.closing::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(28, 41, 58, .72);
}

.closing .wrap {
	position: relative;
	z-index: 2;
}

.closing__title {
	color: var(--white);
	font-size: clamp(32px, 5.6vw, 68px);
	font-weight: 900;
	line-height: 1.25;
	margin: 0 0 14px;
}

.closing p {
	max-width: 36em;
	margin: 0 auto 32px;
}

.closing .btn-row {
	justify-content: center;
}

@media (max-width: 600px) {
	.closing {
		padding-block: 120px 90px;
		clip-path: polygon(0 4%, 100% 0, 100% 100%, 0 100%);
	}

	.closing__title {
		font-size: 29px;
	}

	.closing .btn {
		width: 100%;
	}
}

/* =========================================================
   6. 本文
   ========================================================= */
.entry {
	padding: 40px 0 64px;
}

.entry__meta {
	font-size: 13px;
	color: var(--ink-soft);
	margin-bottom: 24px;
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	align-items: center;
}

.entry__thumb {
	margin-bottom: 28px;
}

.entry-content h2 {
	font-size: 20px;
	margin: 44px 0 16px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--line);
}

.entry-content h3 {
	font-size: 17px;
	margin: 32px 0 12px;
}

.entry-content ul,
.entry-content ol {
	margin-bottom: 1.6em;
}

.entry-content li {
	margin-bottom: .35em;
}

.entry-content table {
	margin-bottom: 1.8em;
	font-size: 15px;
}

.entry-content th,
.entry-content td {
	border: 1px solid var(--line);
	padding: 10px 14px;
	text-align: left;
}

.entry-content th {
	background: var(--bg-soft);
	white-space: nowrap;
}

.entry-content blockquote {
	margin: 0 0 1.6em;
	padding: 14px 18px;
	border-left: 3px solid var(--line-strong);
	color: var(--ink-soft);
}

/* 大会・イベントの詳細ページの冒頭 */
.event-hero {
	padding: 16px 0 0;
}

.event-hero__image {
	display: block;
	width: 100%;
	height: auto;      /* 切り抜かず、元の比率のまま出す */
	border-radius: 4px;
}

.event-head {
	padding: 24px 0 20px;
	border-bottom: 1px solid var(--line);
}

.event-head .event-card__tags {
	margin-bottom: 10px;
}

.event-head__title {
	font-size: clamp(22px, 4vw, 32px);
	line-height: 1.4;
	margin: 0 0 10px;
}

.event-head__meta {
	font-size: 15px;
	color: var(--ink-soft);
	margin: 0;
}

.entry--event {
	padding-top: 32px;
}

@media (max-width: 600px) {
	.event-hero {
		padding-top: 10px;
	}

	.event-head {
		padding: 18px 0 16px;
	}

	.event-head__meta {
		font-size: 14px;
	}
}

/* 大会要項など、情報量の多い本文向け */
.entry-content .table-scroll {
	overflow-x: auto;
	margin-bottom: 1.8em;
	-webkit-overflow-scrolling: touch;
}

.entry-content .table-scroll table {
	margin-bottom: 0;
	min-width: 560px;
}

.entry-content table th,
.entry-content table td {
	white-space: nowrap;
}

.entry-content table td.wrap-cell,
.entry-content table th.wrap-cell {
	white-space: normal;
	min-width: 12em;
}

/* 要項の見出し直下に置く一行まとめ */
.lead-box {
	background: var(--bg-soft);
	border-left: 5px solid var(--lime);
	padding: 18px 22px;
	margin-bottom: 1.8em;
}

.lead-box p:last-child {
	margin-bottom: 0;
}

.lead-box dl {
	display: grid;
	grid-template-columns: 6em 1fr;
	gap: 6px 16px;
	margin: 0;
	font-size: 15px;
}

.lead-box dt {
	font-weight: 700;
	color: var(--navy);
}

.lead-box dd {
	margin: 0;
}

@media (max-width: 560px) {
	.lead-box dl {
		grid-template-columns: 5em 1fr;
		font-size: 14px;
	}
}

/* 大会ページの申込ボタン（スマホでは下部に固定） */
@media (max-width: 780px) {
	.entry-sticky {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 90;
		background: rgba(255, 255, 255, .96);
		border-top: 1px solid var(--line);
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
		box-shadow: 0 -4px 16px rgba(28, 41, 58, .08);
	}

	.entry-sticky .btn {
		width: 100%;
	}

	body.has-entry-sticky .site-footer {
		padding-bottom: 84px;
	}
}

@media (min-width: 781px) {
	.entry-sticky {
		display: none;
	}
}

/* 未確定箇所（原稿・写真待ち） */
.tbd {
	border: 1px dashed var(--line-strong);
	color: var(--ink-soft);
	font-size: 13px;
	padding: 16px;
	line-height: 1.7;
}

/* お知らせ一覧 */
.post-list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--line);
}

.post-list li {
	border-bottom: 1px solid var(--line);
}

.post-list a {
	display: grid;
	grid-template-columns: 100px 1fr;
	gap: 2px 20px;
	align-items: baseline;
	padding: 16px 4px;
	text-decoration: none;
	color: var(--ink);
}

.post-list a:hover {
	opacity: 1;
	text-decoration: underline;
}

.post-list time {
	font-size: 14px;
	color: var(--ink-soft);
}

@media (max-width: 600px) {
	.post-list a {
		grid-template-columns: 1fr;
	}
}

/* ページ送り */
.pagination {
	display: flex;
	justify-content: center;
	gap: 6px;
	margin-top: 36px;
	flex-wrap: wrap;
}

.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--line);
	text-decoration: none;
	color: var(--ink);
	font-size: 14px;
}

.pagination .current,
.pagination a:hover {
	background: var(--navy);
	border-color: var(--navy);
	color: var(--white);
	opacity: 1;
}

.post-nav {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin-top: 44px;
	padding-top: 22px;
	border-top: 1px solid var(--line);
	font-size: 14px;
}

/* =========================================================
   7. フッター
   ========================================================= */
.site-footer {
	background: var(--navy);
	color: rgba(255, 255, 255, .85);
	padding-block: 64px 32px;
	font-size: 14px;
}

.site-footer a {
	color: rgba(255, 255, 255, .85);
	text-decoration: none;
}

.site-footer a:hover {
	color: var(--lime);
	opacity: 1;
}

.footer-top {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr;
	gap: 36px;
	padding-bottom: 32px;
}

.footer-top > * {
	min-width: 0;
}

@media (max-width: 800px) {
	.footer-top {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

.footer-brand {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.footer-brand img {
	width: 54px;
	height: 54px;
	object-fit: contain;
}

.footer-brand__name {
	font-family: var(--en);
	font-weight: 400;
	font-size: 22px;
	letter-spacing: .04em;
	line-height: 1.05;
	color: var(--white);
}

.footer-sns {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 8px;
}

.footer-sns a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--lime);
	color: var(--navy);
	font-family: var(--en);
	font-size: 17px;
}

.footer-sns a:hover {
	background: var(--white);
	color: var(--navy);
}

.footer-nav h3,
.footer-info h3 {
	font-weight: 900;
	font-size: 14px;
	letter-spacing: .12em;
	color: var(--lime);
	margin-bottom: 12px;
}

.footer-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 10px;
}

.footer-nav a,
.footer-info p a {
	font-weight: 700;
}

.footer-info p {
	margin-bottom: .8em;
}

.copyright {
	margin: 0;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, .15);
	font-size: 12px;
	color: rgba(255, 255, 255, .55);
}

/* =========================================================
   8. その他
   ========================================================= */
/* JavaScriptが動く環境でだけ隠す。無効時やクローラには最初から見せる */
.spt-js .reveal {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .5s ease, transform .5s ease;
}

.spt-js .reveal.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.spt-js .reveal {
		opacity: 1;
		transform: none;
	}

	* {
		animation: none !important;
		transition: none !important;
		scroll-behavior: auto !important;
	}
}

:focus-visible {
	outline: 2px solid var(--navy);
	outline-offset: 2px;
}

@media print {
	.site-header,
	.site-footer,
	.closing,
	.nav-toggle {
		display: none;
	}
}
