@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@700;900&family=Noto+Sans+JP:wght@700&display=swap");
@import url("../vendor/swiper/swiper-bundle.min.css");

/*
  todayRaceSection など add2605 案件用スタイル・画像参照は css からの相対（../img/ …）。
  top.css と img は必ず同一の add2605 配下に配置すること。
*/

section.todayRaceSection.d-flex.align-items-center {
	/* style.css の min-height（651px / 588px / 411px）を打ち消す */
	min-height: auto !important;
	background-image:
		linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)),
		url("../img/bk-todayrace.png") !important;
		padding-bottom: 24px !important;
		background-size: cover;
		background-position: right center;
}

@media only screen and (max-width: 1180px) {
	section.todayRaceSection.d-flex.align-items-center {
		min-height: auto !important;
	}
}

@media only screen and (max-width: 767px) {
	section.todayRaceSection.d-flex.align-items-center {
		padding: 0 0 16px !important;
		min-height: 411px !important;
	}
}

@media only screen and (max-width: 640px) {
	section.todayRaceSection.d-flex.align-items-center {
		background-image:
			linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)),
			url("../img/bk-todayrace-sp.png") !important;
	}
}

.todayRaceSection__inner {
	max-width: none;
	margin-left: auto;
	margin-right: auto;
	padding: 0 5px 0 !important;
	box-sizing: border-box;
}

.todayRaceSection__heading {
	padding-top: 10px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 1.25rem;
	row-gap: 0.5rem;
	margin: 0;
}

.todayRaceSection__heading dt,
.todayRaceSection__heading dd {
	margin: 0;
	padding: 0;
}

.todayRaceSection__heading dt,
.todayRaceSection__heading dd {
	color: #fff;
	font-family: "Noto Sans", "Noto Sans JP", sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	line-height: 167%;
}

.todayRaceSection__heading dd {
	letter-spacing: 1px;
}

/* ----- 本日開催のみ Swiper（add2605。既存 .slideContentInner Slick と独立） ----- */
.swiper.add2605-today-swiper {
	position: relative;
	margin-top: 0;
	box-sizing: border-box;
	width: 100%;
	padding: 0 45px;
	/* 隣スライドのチラ見え・トランジション時の溢出をクリップ（矢印は左右 padding 内で配置済み前提） */
	overflow: hidden;
}

.add2605-today-swiper .swiper-slide {
	height: auto;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
}

/* 見出しは縮ませず、カード列コンテナが残り高さで伸びる → min-height 内でカード行を縦中央（align-items: center）に */
.add2605-today-swiper .swiper-slide > .todayRaceSection__heading {
	margin-bottom: 10px;
	flex-shrink: 0;
}

.add2605-today-swiper .swiper-slide > .todayRaceCarousel__cards {
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	align-self: stretch;
}

/* 矢印位置：entry-tail.js。見える矢印のみ opacity でフェード。640px以下は〜 */
.add2605-today-swiper .swiper-button-prev,
.add2605-today-swiper .swiper-button-next {
	width: 26px;
	height: 26px;
	margin-top: 0;
	color: transparent;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border: none;
	outline: none;
	opacity: 1;
	transition:
		opacity 0.32s cubic-bezier(0.22, 1, 0.36, 1) 0.05s,
		visibility 0s linear 0s;
	will-change: opacity;
}

.add2605-today-swiper .swiper-button-prev::after,
.add2605-today-swiper .swiper-button-next::after {
	display: none !important;
}

.add2605-today-swiper .swiper-button-prev {
	background-image: url("../img/arrow-l.png");
}

.add2605-today-swiper .swiper-button-next {
	background-image: url("../img/arrow-r.png");
}

.add2605-today-swiper .swiper-button-prev.add2605-nav--hidden,
.add2605-today-swiper .swiper-button-next.add2605-nav--hidden {
	visibility: hidden;
	pointer-events: none;
	opacity: 0 !important;
	/* visibility はフェード終了後に隠す */
	transition:
		opacity 0.26s cubic-bezier(0.22, 1, 0.36, 1),
		visibility 0s linear 0.28s;
}

/* ドラッグ／タッチ開始直後〜滑り中〜トランジション中は先にフェードアウト */
.add2605-today-swiper.add2605-nav--sliding .swiper-button-prev:not(.add2605-nav--hidden),
.add2605-today-swiper.add2605-nav--sliding .swiper-button-next:not(.add2605-nav--hidden) {
	opacity: 0 !important;
	pointer-events: none;
	transition: opacity 0.13s cubic-bezier(0.4, 0, 0.6, 1);
}

.todayRaceCarousel__cards {
	display: flex;
	flex-wrap: nowrap;
	/* 横並び時：コンテナが min-height で伸びてもカードを縦方向にストレッチしない＝行として上下中央に寄せる */
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	box-sizing: border-box;
}

/* 1枚のみ（例: 2/10 前日）。カード幅は 3枚並びの1枚分のまま、行だけ中央寄せ（親の justify-content でも可）。 */
.todayRaceCarousel__cards--single {
	justify-content: center;
}

@media only screen and (max-width: 640px) {

	.todayRaceSection__inner {
		padding: 0 !important;
	}

	/* absolute 矢印が autoHeight でクリップされないよう下に余白（JS: TODAY_MOBILE_NAV_BELOW_GAP + ボタン高さ） */
	.swiper.add2605-today-swiper {
		padding: 0 24px;
		padding-bottom: 48px;
	}

	.todayRaceCarousel__cards {
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: stretch;
		justify-content: center;
		gap: 8px;
		width: 100%;
		box-sizing: border-box;
	}

	.todayRaceCarousel__cards--single {
		justify-content: center;
	}

	/* .todayRaceCard のベース指定より後に単体セレクタがあるため、親付きで詳細度を上げる */
	.todayRaceCarousel__cards .todayRaceCard {
		flex: 0 0 auto;
		width: 100%;
		max-width: 100%;
		min-width: 0;
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__catch,
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__voteDeadline {
		display: none;
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__scale {
		padding: calc(8em / var(--today-card-em-base)) calc(14em / var(--today-card-em-base));
	}

	/* 見出し（スライダー内のみ）— 640px 以下も横並び */
	.add2605-today-swiper .swiper-slide > .todayRaceSection__heading {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		column-gap: 1.25rem;
		row-gap: 0.5rem;
		text-align: left;
		margin-bottom: 16px;
	}

	.add2605-today-swiper .todayRaceSection__heading .todayRaceSection__headingLabel {
		width: auto;
		text-align: center;
		font-family: "Noto Sans", "Noto Sans JP", sans-serif;
		font-size: 20px;
		font-weight: 700;
		font-style: normal;
		line-height: 167%;
		color: #fff;
	}

	.add2605-today-swiper .todayRaceSection__heading .todayRaceSection__headingDate {
		width: auto;
		text-align: left;
		font-family: "Noto Sans", "Noto Sans JP", sans-serif;
		font-size: 16px;
		font-weight: 700;
		font-style: normal;
		line-height: 167%;
		color: #fff;
		letter-spacing: normal;
	}

	/* カード頭：バッジ・会場・日付（スケール相対＋SPでアイコンだけやや小さく） */
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__head {
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: center;
		gap: calc(4em / var(--today-card-em-base)) calc(5em / var(--today-card-em-base));
		overflow: hidden;
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__headBadgeRow {
		gap: calc(4em / var(--today-card-em-base));
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__seriesBand--headingShort .todayRaceCard__series {
		font-size: calc(18em / var(--today-card-em-base));
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__racetypeIcon {
		width: calc(14em / var(--today-card-em-base));
		height: calc(14em / var(--today-card-em-base));
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__seriesBand {
		margin: calc(7em / var(--today-card-em-base)) 0 0;
	}


	/* 下側の余白を軽く詰める（数値は好みで調整可） */
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__raceBar {
		gap: calc(9em / var(--today-card-em-base));
		margin-bottom: -6px;
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__voteBtn,
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__voteBtn:visited {
		padding: calc(4em / var(--today-card-em-base)) calc(16em / var(--today-card-em-base));
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__actions {
		gap: calc(8em / var(--today-card-em-base));
		margin: calc(8em / var(--today-card-em-base)) 0 0;
	}

	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__actionBtn,
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__actionBtn:visited {
		padding: calc(6em / var(--today-card-em-base)) calc(5em / var(--today-card-em-base));
	}
}

/*
 * CQ 単位（cqw）は「その要素」をコンテナにはできず、親のコンテナで解決する。
 * カード本体で container を張り、その子 todayRaceCard__scale で font-size に 100cqw を使うと
 * 「カード幅」を基準に相対になる。
 * タイポの基準・fluid の係数は .todayRaceCard のカスタムプロパティのみ調整すること。
 */
.todayRaceCard {
	/* ── todayRaceCard 配下の相対調整は原則この4つのみ（すべて子孫へ継承） ── */
	/* 旧レイアウト換算で「◆ px = 相当 1em」としたときの ◆（無単位）。calc(Nem / ◆) 全体を一括調整したいとき */
	--today-card-em-base: 12;
	/* カード幅ベース fluid の下限・上限(px) と、中項 100cqw の除数（大きいほど小さめの文字） */
	--today-card-fs-min: 8px;
	--today-card-fs-max: 13px;
	--today-card-fs-cqw-div: 25;

	container-name: todayRaceCard;
	container-type: inline-size;
	box-sizing: border-box;
	flex: 0 0 calc((100% - 16px) / 3);
	width: calc((100% - 16px) / 3);
	max-width: calc((100% - 16px) / 3);
	border-radius: 0 20px 0 0;
	background: rgba(255, 255, 255, 0.95);
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: stretch;
	padding: 0;
	overflow: hidden;
}

.todayRaceCard__scale {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: center;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	font-family: "Noto Sans", "Noto Sans JP", sans-serif;
	font-size: clamp(var(--today-card-fs-min), calc(100cqw / var(--today-card-fs-cqw-div)), var(--today-card-fs-max));
	padding: calc(11em / var(--today-card-em-base)) calc(16em / var(--today-card-em-base));
}


.todayRaceCard__head {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: calc(4em / var(--today-card-em-base)) calc(6em / var(--today-card-em-base));
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	align-self: stretch;
	overflow: hidden;
}

.todayRaceCard__headBadgeRow {
	flex: 0 0 auto;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: calc(6em / var(--today-card-em-base));
	min-width: 0;
	box-sizing: border-box;
}

.todayRaceCard__headBadge {
	flex: 0 0 auto;
	display: flex;
	padding: calc(1.5em / var(--today-card-em-base));
	justify-content: center;
	align-items: center;
	gap: calc(6em / var(--today-card-em-base));
	border-radius: calc(4em / var(--today-card-em-base));
	background: #c41b1b;
	color: #fff;
	text-align: center;
	font-family: "Noto Sans JP", sans-serif;
	font-size: calc(11em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 100%;
	box-sizing: border-box;
}

.todayRaceCard__headBadgeText {
	display: block;
	white-space: nowrap;
	max-width: 100%;
	overflow: hidden;
	text-overflow: clip;
}

.todayRaceCard__racetypeIcon {
	flex-shrink: 0;
	display: block;
	width: calc(15em / var(--today-card-em-base));
	height: calc(15em / var(--today-card-em-base));
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.todayRaceCard__racetypeIcon--01 {
	background-image: url("../img/icon-day.png");
}

.todayRaceCard__racetypeIcon--02 {
	background-image: url("../img/icon-night.png");
}

.todayRaceCard__racetypeIcon--03 {
	background-image: url("../img/icon-midnight.png");
}

.todayRaceCard__racetypeIcon--04 {
	background-image: url("../img/icon-morning.png");
}

.todayRaceCard__headPlace {
	margin: 0;
	padding: 0;
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
	color: #c41b1b;
	font-family: "Noto Sans", sans-serif;
	font-size: calc(12em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 100%;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: clip;
}

.todayRaceCard__headPeriod {
	margin: 0;
	padding: 0;
	flex: 1 1 auto;
	min-width: 0;
	max-width: 100%;
	color: #000;
	font-family: "Noto Sans", sans-serif;
	font-size: calc(12em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 100%;
	text-align: right;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: clip;
}
/* 枠線・余白はラッパー（内側 p ははみ出しクリップ） */
.todayRaceCard__seriesBand {
	margin: calc(9em / var(--today-card-em-base)) 0 0;
	box-sizing: border-box;
	align-self: stretch;
	max-width: 100%;
	min-width: 0;
	border-top: calc(1em / var(--today-card-em-base)) solid #c41b1b;
	border-bottom: calc(1em / var(--today-card-em-base)) solid #c41b1b;
}


.todayRaceCard__series {
	margin: 0;
	padding: 0;
	color: #c41b1b;
	text-align: center;
	font-style: normal;
	font-weight: 900;
	/* 折り返し可・2行目は縦クリップ（…なし）。字面欠け防止で lh と max-height を同じゆとり値に */
	--today-series-line-box: 1.38;
	line-height: var(--today-series-line-box);
	max-height: calc(1em * var(--today-series-line-box));
	box-sizing: border-box;
	max-width: 100%;
	min-width: 0;
	overflow: hidden;
	overflow-wrap: anywhere;
	word-break: break-word;
	/* デフォルト：見出しが長い（6文字以上）。短いときは JS が seriesBand に --headingShort を付与 */
	font-size: calc(10.25em / var(--today-card-em-base));
}


.todayRaceCard__seriesBand--headingShort .todayRaceCard__series {
	font-size: calc(20em / var(--today-card-em-base));
}

.todayRaceCard__seriesBand--headingMiddle .todayRaceCard__series {
	font-size: calc(16em / var(--today-card-em-base));
}

.todayRaceCard__catch {
	margin: calc(10em / var(--today-card-em-base)) 0 0;
	padding: 0;
	box-sizing: border-box;
	align-self: stretch;
	max-width: 100%;
	color: #000;
	text-align: center;
	font-style: normal;
	font-weight: 700;
	line-height:  133.333% ;
	font-size: calc(12em / var(--today-card-em-base));
}

.todayRaceCard__raceBar {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: calc(11em / var(--today-card-em-base));
	margin: 0 auto 0;
	padding: 0;
	box-sizing: border-box;
	align-self: stretch;
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

.todayRaceCard__raceBarMain {
	flex: 0 1 auto;
	min-width: 0;
}

.todayRaceCard__raceLine {
	margin: 0;
	padding: 0;
	text-align: left;
	line-height: 167%;
}

.todayRaceCard__raceLine .todayRaceCard__raceRound,
.todayRaceCard__raceLine .todayRaceCard__raceStartTime,
.todayRaceCard__raceLine .todayRaceCard__raceStartLbl {
	vertical-align: baseline;
}

.todayRaceCard__raceBarAside {
	flex: 0 0 31%;
	width: 31%;
	max-width: 31%;
	min-width: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.todayRaceCard__raceRound {
	margin: 0;
	padding: 0;
	color: #c41b1b;
	text-align: left;
	font-size: calc(25em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 167%;
}

.todayRaceCard__raceStartTime {
	color: #c41b1b;
	font-size: calc(30em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 167%;
}

.todayRaceCard__raceStartLbl {
	color: #c41b1b;
	font-size: calc(15em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 167%;
}

.todayRaceCard__voteBtn,
.todayRaceCard__voteBtn:visited {
	display: block;
	margin: 0;
	border: none;
	border-radius: calc(19em / var(--today-card-em-base));
	background: #c41b1b;
	color: #fff;
	text-align: center;
	text-decoration: none;
	font-size: calc(13em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 120%;
	padding: calc(5em / var(--today-card-em-base)) calc(18em / var(--today-card-em-base));
	cursor: pointer;
	width: 100%;
	box-sizing: border-box;
	opacity: 1;
	transition: opacity 0.3s ease;
}

@media (hover: hover) {

	.todayRaceCard .todayRaceCard__voteBtn:hover,
	.todayRaceCard .todayRaceCard__voteBtn:focus-visible {
		color: #fff;
		text-decoration: none;
		opacity: 0.75;
	}

}

.todayRaceCard__voteDeadline {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	align-self: stretch;
	max-width: 100%;
	text-align: center;
}

.todayRaceCard__voteDeadlineLbl {
	color: #000;
	text-align: center;
	font-size: calc(11em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 167%;
}

.todayRaceCard__voteDeadlineTime {
	color: #000;
	font-size: calc(15em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 167%;
}

/* ul に todayRaceCard__actions + todayRaceCard__actions--cols1|cols2|cols3 */
.todayRaceCard__actions {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	gap: calc(10em / var(--today-card-em-base));
	margin: calc(10em / var(--today-card-em-base)) 0 0;
	padding: 0;
	list-style: none;
	box-sizing: border-box;
	align-self: stretch;
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

.todayRaceCard__actionsItem {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	min-width: 0;
	box-sizing: border-box;
}

.todayRaceCard__actions--cols1 > .todayRaceCard__actionsItem {
	flex: 1 1 100%;
	max-width: 100%;
}

.todayRaceCard__actions--cols2 > .todayRaceCard__actionsItem {
	flex: 1 1 calc((100% - (10em / var(--today-card-em-base))) / 2);
	max-width: calc((100% - (10em / var(--today-card-em-base))) / 2);
}

.todayRaceCard__actions--cols3 > .todayRaceCard__actionsItem {
	flex: 1 1 calc((100% - (20em / var(--today-card-em-base))) / 3);
	max-width: calc((100% - (20em / var(--today-card-em-base))) / 3);
}

.todayRaceCard__actionBtn,
.todayRaceCard__actionBtn:visited {
	display: block;
	width: 100%;
	margin: 0;
	padding: calc(7em / var(--today-card-em-base)) calc(6em / var(--today-card-em-base));
	border: calc(0.5em / var(--today-card-em-base)) solid #000;
	border-radius: calc(19em / var(--today-card-em-base));
	background-color: #fff;
	color: #000;
	text-align: center;
	text-decoration: none;
	font-size: calc(13em / var(--today-card-em-base));
	font-style: normal;
	font-weight: 700;
	line-height: 100%;
	cursor: pointer;
	box-sizing: border-box;
	opacity: 1;
	transition: background-color 0.3s ease;
	-webkit-font-smoothing: antialiased;
	transform: translateZ(0);
}

@media (hover: hover) {

	.todayRaceCard .todayRaceCard__actionBtn:hover,
	.todayRaceCard .todayRaceCard__actionBtn:focus-visible {
		color: #000;
		text-decoration: none;
		background-color: #dae0e5;
		border-color: #000;
		opacity: .9;
	}

}

/* 細い端末で em 換算ボーダーが欠けるのを抑止 */
@media only screen and (max-width: 640px) {

	.todayRaceCard__actionBtn,
	.todayRaceCard__actionBtn:visited {
		border-width: 1px !important;
	}

}

@media (prefers-reduced-motion: reduce) {

	.todayRaceCard__voteBtn,
	.todayRaceCard__voteBtn:visited {
		transition: opacity 0.3s ease;
	}

	.todayRaceCard__actionBtn,
	.todayRaceCard__actionBtn:visited {
		transition: none;
	}

	@media (hover: hover) {

		.todayRaceCard .todayRaceCard__actionBtn:hover,
		.todayRaceCard .todayRaceCard__actionBtn:focus-visible {
			transition: none;
		}

	}

}

.todayRaceCard__catch {
    min-height: 2.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.25;
}

@media screen and (min-width: 641px) {
    .todayRaceCard {
        min-height: 260px;
    }

    .todayRaceCard__actions {
        margin: auto 0 0;
        padding: 16px 0 0;
    }
}
@media screen and (min-width: 992px) {
    .todayRaceCard {
        min-height: 274px;
    }
}
.todayRaceCard__cancelNotice {
    flex: 1 1 auto;
    margin: 10px 0;
    padding: 0;
    box-sizing: border-box;
    align-self: stretch;
    max-width: 100%;
    text-align: center;
    font-family: "Noto Sans", sans-serif;
    font-size: calc(20em / var(--today-card-em-base));
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color:#c41b1b;
}
.todayRaceCard__seriesBand--nonRacingDay {
    border-top-color: #302e2c;
    border-bottom-color: #302e2c;
    flex: 1 1 auto;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.todayRaceCard__seriesBand--nonRacingDay .todayRaceCard__series {
    color: #302e2c;
    font-size: calc(20em / var(--today-card-em-base));
}
/* =========================================================
   add2605 追記：シリーズ帯の罫線位置を文字サイズに関係なく揃える
   ---------------------------------------------------------
   paddingを揃えるだけだと、文字サイズの違いで帯の高さが変わるため、
   帯そのものに固定の高さを持たせ、文字は上下左右中央に配置する。
   ========================================================= */
.todayRaceCard__seriesBand,
.todayRaceCard__seriesBand--headingShort,
.todayRaceCard__seriesBand--headingMiddle,
.todayRaceCard__seriesBand--nonRacingDay {
	box-sizing: border-box;
	min-height: calc(58em / var(--today-card-em-base));
	padding-top: 0;
	padding-bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.todayRaceCard__seriesBand .todayRaceCard__series {
	width: 100%;
}

@media only screen and (max-width: 640px) {
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__seriesBand,
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__seriesBand--headingShort,
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__seriesBand--headingMiddle,
	.todayRaceCarousel__cards .todayRaceCard .todayRaceCard__seriesBand--nonRacingDay {
		min-height: calc(38em / var(--today-card-em-base));
		padding-top: 0;
		padding-bottom: 0;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}

/* =========================================================
   矢印：初期表示制御
   - add2605-nav--ready    : Swiper レイアウト確定後（500ms）
   - add2605-nav--data-ready: 実データ到着 or 5秒タイムアウト後
   両方揃って初めて表示する
   ========================================================= */
.add2605-today-swiper:not(.add2605-nav--ready) .swiper-button-prev,
.add2605-today-swiper:not(.add2605-nav--ready) .swiper-button-next,
.add2605-today-swiper:not(.add2605-nav--data-ready) .swiper-button-prev,
.add2605-today-swiper:not(.add2605-nav--data-ready) .swiper-button-next {
	opacity: 0 !important;
	transition: none !important;
}

/* =========================================================
   スケルトンローディング
   ========================================================= */
@keyframes todayRaceSkeletonSlide {
	0%   { transform: translateX(-200%); }
	100% { transform: translateX( 200%); }
}

/* スケルトン消去アニメーション */
@keyframes todayRaceSkeletonFadeOut {
	0%   { opacity: 1; }
	100% { opacity: 0; }
}


.todayRaceSkeleton {
	background: #dcdcdc !important;
	color: transparent !important;
	border-color: transparent !important;
	pointer-events: none;
	border-radius: 3px;
	position: relative;
	overflow: hidden;
}

.todayRaceSkeleton::after {
	content: '';
	position: absolute;
	inset: 0;
	width: 60%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
	animation: todayRaceSkeletonSlide 2.4s linear infinite;
}

/* スケルトン：デフォルトは不可視（Swiper高さ確保のためDOMには残す） */
.todayRaceCard--skeleton {
	visibility: hidden;
}

/* スケルトン：5秒後に実データ未着なら表示 */
.todayRaceCard--skeleton.is-visible {
	visibility: visible;
}

/* スケルトン：フェードアウト中 */
.todayRaceCard--skeleton.is-hiding {
	animation: todayRaceSkeletonFadeOut 0.3s ease forwards;
	pointer-events: none;
}

/* 実カード：フェードイン（iOS Safari対策：挿入時はopacity:1のままSwiperに高さ計算させ、その後JSクラスでトランジション） */
.todayRaceCard--entering {
	opacity: 0;
}
.todayRaceCard--visible {
	transition: opacity 0.4s ease;
	opacity: 1;
}