@charset "UTF-8";
/* ==========================================================
   イベント（/event/ ・ /event/スラッグ/）だけで読み込む。2026年10月に本番反映（ファイル名はテスト時のまま）
   ※「予約の続き・お気に入り」「一覧パネル」「小さなお知らせ」は nav-extra.css にも同じ指定がある（イベント以外のページ用）。直す時は両方そろえる
   ・詳細：メイン・本文を幅800px／右に「開催情報カード」（余白がない時は画面下の予約バー）
   ・予約の続きボタン（ヘッダー／サイドバー）と一覧パネル
   ・お気に入りボタン（施工事例のお気に入りの件数。見た目は work02.css と同じ）
   色：紺 #2f417f／オレンジ #d25e3b／ゴールド #e5af5b
   ========================================================== */

/* ==========================================================
   詳細：幅800px
   ========================================================== */
/* サイト共通の「すべての要素 line-height:1」を、この改修部分だけゆとりのある行間に */
.ev2-card *,
.ev2-bar *,
.rs-panel *,
.rs-toast *,
.evcal_in * {
	line-height: inherit;
}
.ev2-card,
.ev2-bar-in {
	line-height: 1.7;
}
.ev2 .city_chui,
.ev2f .city_chui,
.ev2 .ank_br,
.ev2f .ank_br,
.ev2 .sonota,
.ev2f .sonota,
.ev2 .form_policy_txt,
.ev2f .form_policy_txt {
	line-height: 1.7;
}
.ev2 .city_chui,
.ev2f .city_chui {
	margin-top: 6px;
}

.ev2 {
	--ev2-main: 800px;
	--ev2-card: 320px;
	--ev2-gap: 32px;
}
.ev2 .cnt_head,
.ev2 .ev_d_box,
.ev2 .ev_cnt,
.ev2 .ev_gift,
.ev2 .ev_works,
.ev2 .ev_acs,
.ev2 .ev_contact {
	max-width: var(--ev2-main);
	margin-left: auto;
	margin-right: auto;
}
.ev2 .ev_d_box,
.ev2 .ev_cnt,
.ev2 .ev_contact {
	width: 95%;
}
.ev2 .ev_info_box {
	width: 92%;
}
.ev2 .cnt_head_img_ev {
	width: 95%;
	max-width: 100%;
}
/* 施工事例のスライダーは本文の幅の中で */
.ev2 .ev_works {
	overflow: hidden;
}

/* スマホ：メインビジュアルは画面幅いっぱい */
@media only screen and (max-width: 767px) {
	.ev2 .cnt_head_img_ev {
		width: 100%;
	}
}

@media only screen and (min-width: 768px) {
	.ev2 .cnt_head_img_ev {
		width: 100%;
	}
	.ev2 .ev_d_box,
	.ev2 .ev_contact {
		width: 100%;
	}
	.ev2 .ev_cnt {
		width: 95%;
	}
}

/* 「参加予約する」：もとは1200px幅の右上に重ねているので、800pxの中では日付の上に通常配置
   1360px〜は右の開催情報カードに予約ボタンがあるので出さない */
@media only screen and (min-width: 1200px) {
	.ev2 .ev_main_btn {
		position: static;
		width: auto;
		right: auto;
		transform: none;
		padding-top: 20px;
	}
}
@media only screen and (min-width: 1360px) {
	.ev2 .ev_main_btn {
		display: none;
	}
}

/* ==========================================================
   開催情報カード
   ・1360px〜：メイン（800px）とカードを並べて画面の真ん中に。カードの幅は余白に合わせて 320〜440px
   ・1960px〜：メインを画面の真ん中に置き、右の空いたところにカード（幅 440〜520px）
   ========================================================== */
.ev2-card {
	display: none;
}
@media only screen and (min-width: 1360px) {
	.ev2 {
		--ev2-card: clamp(320px, calc(100vw - 1040px), 440px);
	}
	.ev2 .cnt_head,
	.ev2 .ev_d_box,
	.ev2 .ev_cnt,
	.ev2 .ev_gift,
	.ev2 .ev_works,
	.ev2 .ev_acs,
	.ev2 .ev_contact {
		margin-left: calc(50% - (var(--ev2-main) + var(--ev2-gap) + var(--ev2-card)) / 2);
		margin-right: 0;
	}
	.ev2-card {
		display: block;
		position: fixed;
		z-index: 30;
		top: 120px;
		left: calc(50% - (var(--ev2-main) + var(--ev2-gap) + var(--ev2-card)) / 2 + var(--ev2-main) + var(--ev2-gap));
		width: var(--ev2-card);
		max-height: calc(100vh - 140px);
		overflow: hidden;
		box-sizing: border-box;
		padding: 30px;
		background: #fff;
		border: 1px solid #EAEAEA;
		transition: opacity .25s, visibility .25s;
	}
	/* 画面の高さが足りない時だけスクロール（event02.js） */
	.ev2-card.is-scroll {
		overflow-y: auto;
	}
	/* フッターが見えてきたら隠す */
	.ev2-card.is-off {
		opacity: 0;
		visibility: hidden;
	}
}
@media only screen and (min-width: 1960px) {
	.ev2 {
		--ev2-card: clamp(440px, calc(50vw - 550px), 520px);
	}
	.ev2 .cnt_head,
	.ev2 .ev_d_box,
	.ev2 .ev_cnt,
	.ev2 .ev_gift,
	.ev2 .ev_works,
	.ev2 .ev_acs,
	.ev2 .ev_contact {
		margin-left: auto;
		margin-right: auto;
	}
	.ev2-card {
		left: calc(50% + var(--ev2-main) / 2 + var(--ev2-gap));
	}
}
/* ---------- 本部サイトのモーダル（body.pg-modal：?hideHeader=true）----------
   ・モーダルの中はヘッダーも右のサイドバーもないので、1200px〜1359px でもカードを右に出す（1360px〜は上と同じ）
   ・ヘッダーがないので、カードの上の位置も詰める
   ※1360px〜の指定（上）を直す時は、ここもそろえる */
@media only screen and (min-width: 1200px) and (max-width: 1359px) {
	body.pg-modal .ev2 {
		--ev2-card: 320px;
	}
	body.pg-modal .ev2 .cnt_head,
	body.pg-modal .ev2 .ev_d_box,
	body.pg-modal .ev2 .ev_cnt,
	body.pg-modal .ev2 .ev_gift,
	body.pg-modal .ev2 .ev_works,
	body.pg-modal .ev2 .ev_acs,
	body.pg-modal .ev2 .ev_contact {
		margin-left: calc(50% - (var(--ev2-main) + var(--ev2-gap) + var(--ev2-card)) / 2);
		margin-right: 0;
	}
	body.pg-modal .ev2-card {
		display: block;
		position: fixed;
		z-index: 30;
		left: calc(50% - (var(--ev2-main) + var(--ev2-gap) + var(--ev2-card)) / 2 + var(--ev2-main) + var(--ev2-gap));
		width: var(--ev2-card);
		overflow: hidden;
		box-sizing: border-box;
		padding: 30px;
		background: #fff;
		border: 1px solid #EAEAEA;
		transition: opacity .25s, visibility .25s;
	}
	body.pg-modal .ev2-card.is-scroll {
		overflow-y: auto;
	}
	body.pg-modal .ev2-card.is-off {
		opacity: 0;
		visibility: hidden;
	}
	/* カードに予約ボタンがあるので、画面下の予約バー・メイン画像下のボタンは出さない */
	body.pg-modal .ev2-bar,
	body.pg-modal .ev2 .ev_main_btn {
		display: none;
	}
}
@media only screen and (min-width: 1200px) {
	body.pg-modal .ev2-card {
		top: 30px;
		max-height: calc(100vh - 60px);
	}
}
.ev2-card-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 14px;
}
.ev2-badge,
.ev2-tag {
	display: inline-block;
	padding: 4px 9px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: .04em;
}
.ev2-badge {
	background: #d25e3b;
	color: #fff;
}
.ev2-badge.is-pre {
	background: #2f417f;
}
.ev2-tag {
	border: 1px solid #2f417f;
	color: #2f417f;
	padding: 3px 8px;
}
.ev2-card-ttl {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.75;
	letter-spacing: .03em;
}
.ev2-card-img {
	display: block;
	width: 50%;
	height: auto;
	margin: 16px auto 0;
}
.ev2-card-dl {
	margin: 16px 0 12px;
	font-size: 14px;
	line-height: 1.75;
}
.ev2-card-dl > div {
	display: flex;
	gap: 14px;
	padding: 11px 0;
	border-top: 1px solid #e7eaf0;
}
.ev2-card-dl > div:last-child {
	border-bottom: none;
}
.ev2-card-dl dt {
	flex: none;
	width: 2.6em;
	color: #6b7280;
	font-weight: 500;
	line-height: inherit;
}
.ev2-card-dl dd {
	flex: 1;
	margin: 0;
	min-width: 0;
	font-weight: 500;
	line-height: inherit;
}
.ev2-card-dl .is-gift dd {
	color: #d25e3b;
	font-weight: 700;
}
.ev2-map {
	margin-left: 4px;
	color: #2f417f;
	text-decoration: underline;
	text-underline-offset: 3px;
	white-space: nowrap;
}
.ev2-go,
.ev2-tel,
.ev2-bar-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	font-weight: 700;
	letter-spacing: .04em;
	transition: background-color .2s, color .2s, opacity .2s;
}
.ev2-go {
	gap: 10px;
	max-height: 56px;
	overflow: hidden;
	transition: background-color .2s, opacity .35s ease, max-height .35s ease, margin .35s ease;
	height: 56px;
	background: #d25e3b;
	color: #fff;
	font-size: 16px;
}
/* ページ内リンクなので、矢印は下向き（▼）。マウスを乗せると下へ動く */
.ev2-go .arrow_svg,
.ev2-bar-btn .arrow_svg {
	width: 7px;
	height: 10px;
	fill: currentColor;
	transform: rotate(90deg);
}
@keyframes ev2Down {
	0%, 100% { transform: rotate(90deg) translateX(0); }
	50% { transform: rotate(90deg) translateX(4px); }
}
.ev2-tel {
	flex-direction: column;
	gap: 4px;
	margin-top: 16px;
	color: #2f417f;
	font-size: 13px;
	line-height: 1.5;
}
.ev2-tel span {
	font-family: sofia-pro, sans-serif;
	font-size: 24px;
	line-height: 1.3;
	letter-spacing: .08em;
}
@media (hover: hover) {
	.ev2-go:hover,
	.ev2-bar-btn:hover {
		background: #b94c2c;
	}
	.ev2-go:hover .arrow_svg,
	.ev2-bar-btn:hover .arrow_svg,
	.ev2 .ev2-main-go:hover svg {
		animation: ev2Down .8s ease-in-out infinite;
	}
	.ev2-tel:hover {
		opacity: .7;
	}
}
/* 電話番号はパソコンでは押しても発信しないので、押せる見た目にしない */
@media (hover: hover) and (pointer: fine) {
	.ev2-tel {
		cursor: default;
	}
	.ev2-tel:hover {
		opacity: 1;
	}
}

/* ==========================================================
   画面下の予約バー（〜1359px）
   ・メインビジュアルが隠れたら出し、予約フォームが見えたら隠す（event02.js）
   ========================================================== */
.ev2-bar {
	position: fixed;
	z-index: 40;
	left: 0;
	right: 0;
	bottom: 0;
	background: #fff;
	border-top: 1px solid #dfe3ec;
	box-shadow: 0 -2px 10px rgba(0, 0, 0, .06);
	transform: translateY(110%);
	visibility: hidden;
	transition: transform .3s ease, visibility .3s;
	padding-bottom: env(safe-area-inset-bottom);
}
.ev2-bar.is-show {
	transform: none;
	visibility: visible;
}
.ev2-bar-in {
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 1000px;
	margin: 0 auto;
	padding: 10px 12px;
	box-sizing: border-box;
}
.ev2-bar-txt {
	flex: 1;
	min-width: 0;
	line-height: 1.45;
	color: #221815;
}
.ev2-bar-txt b,
.ev2-bar-txt span {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
/* 文字の大きさ：em はサイトの基準（画面幅の1.333%）。スマホは画面幅に合わせて小さく */
.ev2-bar-txt b {
	font-size: clamp(11px, 2.4em, 15px);
}
.ev2-bar-txt span {
	font-size: clamp(10px, 2em, 12px);
	color: #6b7280;
}
.ev2-bar-btn {
	flex: none;
	gap: 6px;
	height: 44px;
	padding: 0 14px;
	background: #d25e3b;
	color: #fff;
	font-size: clamp(11px, 2.6em, 16px);
}
@media only screen and (min-width: 768px) {
	.ev2-bar-in {
		padding: 12px 24px;
		gap: 24px;
	}
	.ev2-bar-btn {
		height: 48px;
		padding: 0 28px;
	}
}
@media only screen and (min-width: 1000px) {
	/* 右のサイドバー（予約の続き・お気に入り）にかからないように */
	.ev2-bar-in {
		padding-right: 100px;
		max-width: 1100px;
	}
}
@media only screen and (min-width: 1360px) {
	.ev2-bar {
		display: none;
	}
}
/* 予約バーが出ている間は、チャットのボタンなどを上へ */
body.ev2-bar-on .w2-toast,
body.ev2-bar-on .rs-toast {
	bottom: 86px;
}

/* ==========================================================
   予約の続き・お気に入り：ヘッダー（〜999px）／サイドバー（1000px〜）のボタン
   ========================================================== */
.rs-nav,
.w2-favnav {
	font-family: inherit;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	text-decoration: none;
	color: #2f417f;
}
.rs-nav {
	margin: 0;
	border: none;
	border-radius: 0;
	background: #fff;
	-webkit-appearance: none;
	appearance: none;
}
.rs-nav[hidden],
.rs-nav-s,
.w2-favnav[hidden],
.w2-favnav-s {
	display: none !important;
}
.rs-nav-ico,
.w2-favnav-ico {
	position: relative;
	display: block;
	width: 22px;
	height: 22px;
}
.rs-nav-ico {
	color: #203165;
}
.w2-favnav-ico {
	color: #e5af5b;
}
.rs-nav-ico svg,
.w2-favnav-ico svg {
	display: block;
	width: 100%;
	height: 100%;
}
.w2-favnav-ico svg {
	fill: currentColor;
}
/* 件数：右上の小さな丸 */
.rs-nav-n,
.w2-favnav-n {
	position: absolute;
	top: -7px;
	right: -10px;
	min-width: 17px;
	height: 17px;
	box-sizing: border-box;
	padding: 0 4px;
	border: 1.5px solid #2f417f;
	border-radius: 9px;
	background: #fff;
	color: #2f417f;
	font-family: sofia-pro, sans-serif;
	font-size: 10px;
	font-weight: 700;
	line-height: 14px;
	letter-spacing: 0;
	text-align: center;
}
.rs-nav-n:empty,
.w2-favnav-n:empty {
	display: none;
}
.rs-nav-t,
.w2-favnav-t {
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1;
	white-space: nowrap;
}
/* ヘッダー：メニューボタン（≡）の左 */
.rs-nav-h,
.w2-favnav-h {
	flex: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 54px;
	padding: 4px 0 0;
	background: #fff;
}
.rs-nav.is-open {
	background: #f2f4f9;
}
.w2-favnav.is-bump .w2-favnav-ico svg,
.rs-nav.is-bump .rs-nav-ico svg {
	animation: ev2Pop .45s ease;
}
@keyframes ev2Pop {
	0% { transform: scale(1); }
	30% { transform: scale(.75); }
	60% { transform: scale(1.25); }
	100% { transform: scale(1); }
}
@media only screen and (max-width: 374px) {
	.rs-nav-h,
	.w2-favnav-h {
		width: 46px;
	}
}
@media only screen and (min-width: 1000px) {
	.rs-nav-h,
	.w2-favnav-h {
		display: none !important;
	}
	/* サイドバー：画面の高さの25%の位置から上へ、お気に入り → 予約の続き の順に積む
	   （予約の続きの位置は、お気に入りが出ている時に event02.js がずらす） */
	.rs-nav-s:not([hidden]),
	.w2-favnav-s:not([hidden]) {
		display: flex !important;
	}
	.rs-nav-s,
	.w2-favnav-s {
		position: fixed;
		z-index: 100;
		right: 10px;
		top: 25vh;
		transform: translateY(-100%);
		width: 50px;
		flex-direction: column;
		align-items: center;
		gap: 7px;
		padding: 14px 0 9px;
		background: #fff;
		transition: background-color .2s;
	}
	.rs-nav-s:hover,
	.rs-nav-s.is-open {
		background: #f2f4f9;
	}
	.w2-favnav-s:hover {
		background: #fdf5e8;
	}
}
@media only screen and (min-width: 1200px) {
	.rs-nav-s,
	.w2-favnav-s {
		width: 68px;
		padding: 16px 0 11px;
	}
	.rs-nav-s .rs-nav-ico,
	.w2-favnav-s .w2-favnav-ico {
		width: 26px;
		height: 26px;
	}
	.rs-nav-s .rs-nav-t,
	.w2-favnav-s .w2-favnav-t {
		font-size: 10px;
	}
}

/* ==========================================================
   予約の続き：一覧パネル
   ・1000px〜：サイドバーのボタンの左に出る
   ・〜999px：画面下から出るシート
   ========================================================== */
.rs-panel[hidden] {
	display: none !important;
}
.rs-panel {
	position: fixed;
	z-index: 100010;
	color: #221815;
	font-size: 13px;
	line-height: 1.6;
}
.rs-panel-box {
	background: #fff;
	box-shadow: 0 8px 30px rgba(20, 30, 60, .2);
	display: flex;
	flex-direction: column;
	max-height: 100%;
}
.rs-panel-hd {
	position: relative;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 2px 12px;
	padding: 14px 44px 12px 16px;
	border-top: 3px solid #2f417f;
	border-bottom: 1px solid #eef0f4;
}
.rs-panel-hd b {
	font-size: 15px;
}
.rs-panel-hd small {
	font-size: 11px;
	color: #6b7280;
}
.rs-close {
	position: absolute;
	top: 6px;
	right: 6px;
	width: 36px;
	height: 36px;
	padding: 0;
	border: none;
	background: none;
	color: #6b7280;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
}
.rs-list {
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.rs-item {
	display: flex;
	gap: 12px;
	padding: 14px 16px;
	border-bottom: 1px solid #eef0f4;
}
.rs-img {
	flex: none;
	width: 72px;
	height: 72px;
	object-fit: cover;
	background: #e5ebef;
}
.rs-body {
	flex: 1;
	min-width: 0;
}
.rs-top {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}
.rs-kind {
	display: block;
	color: #2f417f;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .06em;
}
.rs-ttl {
	display: block;
	flex: 1;
	min-width: 0;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.5;
}
.rs-del {
	flex: none;
	margin: 0;
	padding: 2px 7px;
	border: 1px solid #c9ced8;
	background: #fff;
	color: #6b7280;
	font-family: inherit;
	font-size: 10px;
	line-height: 1.5;
	cursor: pointer;
}
.rs-sum {
	margin-top: 3px;
	font-size: 11px;
	color: #4b5563;
}
.rs-bar {
	height: 4px;
	margin-top: 6px;
	background: #eef0f4;
	overflow: hidden;
}
.rs-bar i {
	display: block;
	height: 100%;
	background: #2e9e6a;
}
.rs-go {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 8px;
	padding: 6px 12px;
	background: #d25e3b;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	letter-spacing: .04em;
}
.rs-go::after {
	content: "›";
	font-size: 14px;
	line-height: 1;
}
.rs-go.is-here {
	background: #2f417f;
}
.rs-ft {
	margin: 0;
	padding: 10px 16px 12px;
	background: #f7f8fa;
	color: #6b7280;
	font-size: 10.5px;
	line-height: 1.7;
}
.rs-empty {
	padding: 24px 16px;
	color: #6b7280;
	text-align: center;
}
@media (hover: hover) {
	.rs-go:hover {
		opacity: .85;
	}
	.rs-del:hover {
		border-color: #d25e3b;
		color: #d25e3b;
	}
}
/* スマホ〜999px：画面下から出るシート */
.rs-shade {
	position: fixed;
	inset: 0;
	z-index: 100009;
	background: rgba(20, 24, 40, .45);
	opacity: 0;
	transition: opacity .25s;
}
.rs-shade.is-show {
	opacity: 1;
}
.rs-shade[hidden] {
	display: none;
}
@media only screen and (max-width: 999px) {
	.rs-panel {
		left: 0;
		right: 0;
		bottom: 0;
		max-height: 80vh;
		max-height: 80dvh;
		transform: translateY(100%);
		transition: transform .3s ease;
	}
	.rs-panel.is-show {
		transform: none;
	}
	.rs-panel-box {
		border-radius: 14px 14px 0 0;
		padding-bottom: env(safe-area-inset-bottom);
		max-height: 80vh;
		max-height: 80dvh;
	}
	.rs-panel-hd {
		border-top: none;
		padding-top: 20px;
	}
	/* 上の小さなつまみ */
	.rs-panel-hd::before {
		content: "";
		position: absolute;
		top: 7px;
		left: 50%;
		width: 40px;
		height: 4px;
		margin-left: -20px;
		border-radius: 2px;
		background: #d6d9e0;
	}
}
@media only screen and (min-width: 1000px) {
	.rs-shade {
		display: none !important;
	}
	.rs-panel {
		width: 380px;
		right: 72px;
		max-height: calc(100vh - 40px);
		opacity: 0;
		transform: translateX(8px);
		transition: opacity .2s, transform .2s;
	}
	.rs-panel.is-show {
		opacity: 1;
		transform: none;
	}
	/* ボタンを指す小さな三角 */
	.rs-panel::after {
		content: "";
		position: absolute;
		right: -7px;
		top: var(--rs-arrow, 24px);
		border: 7px solid transparent;
		border-right: none;
		border-left-color: #fff;
	}
}
@media only screen and (min-width: 1200px) {
	.rs-panel {
		right: 90px;
	}
}

/* ---------- 小さなお知らせ（予約の続きに保存しました） ---------- */
.rs-toast {
	position: fixed;
	left: 50%;
	bottom: 24px;
	z-index: 100001;
	display: flex;
	align-items: center;
	gap: 12px;
	width: max-content;
	max-width: calc(100% - 24px);
	box-sizing: border-box;
	padding: 10px 12px 10px 14px;
	background: rgba(32, 40, 66, .95);
	color: #fff;
	font-size: 12px;
	line-height: 1.6;
	letter-spacing: .02em;
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 16px);
	transition: opacity .3s, transform .3s, visibility .3s;
}
.rs-toast.is-show {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
}
.rs-toast-ok {
	flex: none;
	color: #e5af5b;
	font-weight: 700;
}
.rs-toast-txt {
	flex: 1;
	min-width: 0;
}
.rs-toast button {
	flex: none;
	margin: 0;
	padding: 4px 10px;
	border: 1px solid rgba(255, 255, 255, .7);
	background: none;
	color: #fff;
	font-family: inherit;
	font-size: 11px;
	cursor: pointer;
	white-space: nowrap;
}
@media only screen and (min-width: 1000px) {
	.rs-toast {
		left: 24px;
		transform: translate(0, 16px);
	}
	.rs-toast.is-show {
		transform: none;
	}
}

/* 開催情報カード：時間が違う日のひとこと */
.ev2-note {
	display: block;
	margin-top: 2px;
	color: #6b7280;
	font-size: 11px;
	line-height: 1.5;
}

/* 「日時を選んで予約する」（メイン画像の下：1359pxまで） */
.ev2 .ev2-main-go {
	text-decoration: none;
}

/* ==========================================================
   予約フォーム：店舗・モデルを選ぶ（横長リスト）
   左に ●、正方形のサムネイル、右に種別・名前・住所。行全体で選べる
   文字・サムネイルは画面幅に合わせて clamp（親の文字サイズが固定のため vw で指定）
   ========================================================== */
.ev2 .radio_basho_flex,
.ev2f .radio_basho_flex {
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-width: none;
	padding: 0 clamp(12px, 4vw, 40px);
	box-sizing: border-box;
}
.ev2 .radio_basho_flex .radio_input-basho,
.ev2f .radio_basho_flex .radio_input-basho {
	width: 100%;
	margin: 0;
	padding: 0;
}
.ev2 .radio02-input-basho + label,
.ev2f .radio02-input-basho + label {
	display: block;
	position: relative;
	padding: 0;
	border: 1px solid #E2E2E2;
	border-radius: 4px;
	background: #fff;
	color: #333;
	letter-spacing: .03em;
	line-height: inherit;
	cursor: pointer;
	transition: border-color .2s, background-color .2s, box-shadow .2s;
}
.ev2 .radio02-input-basho + label:hover,
.ev2f .radio02-input-basho + label:hover {
	border-color: #9AA3C2;
}
.ev2 .radio02-input-basho:checked + label,
.ev2f .radio02-input-basho:checked + label {
	color: #333;
	background: #F4F6FB;
	border-color: #2f417f;
	box-shadow: inset 0 0 0 1px #2f417f;
}
/* ● */
.ev2 .radio02-input-basho + label::before,
.ev2f .radio02-input-basho + label::before,
.ev2 .radio02-input-basho:checked + label::before,
.ev2f .radio02-input-basho:checked + label::before {
	top: 50%;
	left: clamp(12px, 3vw, 18px);
	width: 16px;
	height: 16px;
	box-sizing: border-box;
	margin-top: -8px;
	border: 1.5px solid #C8C8C8;
	border-radius: 50%;
	background: #fff;
}
.ev2 .radio02-input-basho:checked + label::before,
.ev2f .radio02-input-basho:checked + label::before {
	border-color: #2f417f;
}
.ev2 .radio02-input-basho:checked + label::after,
.ev2f .radio02-input-basho:checked + label::after {
	top: 50%;
	left: calc(clamp(12px, 3vw, 18px) + 4px);
	width: 8px;
	height: 8px;
	margin-top: -4px;
	transform: none;
	background: #2f417f;
}
.ev2 .radio02-input-basho + label > span,
.ev2f .radio02-input-basho + label > span {
	--ev2-mthumb: clamp(68px, 18vw, 96px);
	display: grid;
	grid-template-columns: var(--ev2-mthumb) 1fr;
	grid-template-rows: 1fr auto auto auto 1fr;
	column-gap: clamp(12px, 3vw, 20px);
	align-items: center;
	padding: clamp(10px, 2.4vw, 14px) clamp(14px, 3.6vw, 24px) clamp(10px, 2.4vw, 14px) calc(clamp(12px, 3vw, 18px) + 16px + clamp(10px, 2.4vw, 16px));
}
.ev2 .radio_input-basho .rv_select_img,
.ev2f .radio_input-basho .rv_select_img {
	grid-column: 1;
	grid-row: 1 / -1;
	width: var(--ev2-mthumb);
	height: var(--ev2-mthumb);
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 2px;
}
.ev2 .radio_input-basho .rv_select_point,
.ev2f .radio_input-basho .rv_select_point,
.ev2 .radio_input-basho .rv_select_ttl,
.ev2f .radio_input-basho .rv_select_ttl,
.ev2 .radio_input-basho .rv_select_lead,
.ev2f .radio_input-basho .rv_select_lead {
	grid-column: 2;
	min-width: 0;
	padding: 0;
	text-align: left;
}
.ev2 .radio_input-basho .rv_select_point,
.ev2f .radio_input-basho .rv_select_point {
	grid-row: 2;
	justify-self: start;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-bottom: 6px;
	padding: 1px 6px;
	border: 1px solid #C9CFE0;
	font-size: clamp(9px, 2.4vw, 11px);
	font-weight: 500;
	line-height: 1.6;
	color: #2f417f;
}
.ev2 .radio_input-basho .rv_icon,
.ev2f .radio_input-basho .rv_icon {
	width: 1.1em;
	height: 1.1em;
	margin: 0;
	transform: none;
	object-fit: contain;
}
.ev2 .radio_input-basho .rv_select_ttl,
.ev2f .radio_input-basho .rv_select_ttl {
	grid-row: 3;
	font-size: clamp(12px, 3.1vw, 15px);
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: .04em;
}
.ev2 .radio_input-basho .rv_select_lead,
.ev2f .radio_input-basho .rv_select_lead {
	grid-row: 4;
	display: block;
	margin-top: 4px;
	font-size: clamp(10px, 2.6vw, 12px);
	line-height: 1.6;
	color: #777;
}
.ev2 .radio_input-basho .rv_select_lead br,
.ev2f .radio_input-basho .rv_select_lead br {
	display: none;
}
/* 「選択する／選択済」ボタンは ● で分かるので出さない */
.ev2 .radio_input-basho .rv_select_flex,
.ev2f .radio_input-basho .rv_select_flex {
	display: none;
}

/* 来場予約などのページ（.ev2f）：ページの幅いっぱいに広がらないよう、イベントと同じ 800px で真ん中に */
.ev2f .radio_basho_flex {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

/* ==========================================================
   開催情報（場所・期間・備考）：すべて1列。文字は画面幅に合わせて 11〜16px
   ========================================================== */
.ev2 .ev_info_flex {
	display: block;
	font-size: clamp(13px, 2.5em, 16px);
	border: none; /* 外枠の線はなし。行の間だけ細い線 */
}
.ev2 .ev_info_list01,
.ev2 .ev_info_list02 {
	display: flex;
	flex-wrap: nowrap;
	align-items: baseline;
	gap: 0 1.5em;
	width: 100%;
	padding: 1.1em 0em;
	border-top: 1px solid #e7eaf0;
	font-size: inherit;
}
.ev2 .ev_info_flex > div:first-child {
	border-top: none;
}
.ev2 .ev_info_ttl,
.ev2 .ev_info_lead {
	padding: 0;
	border: none;
	background: none;
	font-size: inherit;
	line-height: 1.8;
	font-weight: 600;
}
.ev2 .ev_info_ttl {
	display: block;
	flex: none;
	width: auto;
	color: #6b7280;
	font-weight: 500;
	text-align: left;
	white-space: nowrap;
}
.ev2 .ev_info_lead {
	flex: 1;
	min-width: 0;
}
/* カテゴリ（ev_cat）が空の時は出さない（PHP でも出力しないが、念のため） */
.ev2 .ev_cat:empty,
.ev2 .ev_cat:not(:has(.ev_cat_txt)) {
	display: none;
}
/* スマホ：タイトル（＋カテゴリ）と 場所・期間… の間に線 */
@media only screen and (max-width: 767px) {
	.ev2 .ev_info_flex {
		margin-top: 14px;
		border-top: 1px solid #e7eaf0;
	}
	.ev2 .ev_cat + .ev_info_flex {
		margin-top: 0;
	}
}

/* 開催情報の下の余白を詰める */
.ev2 .ev_d_box {
	padding-bottom: 16px;
}

/* メイン画像の下の「日時を選んで予約する」：文字は最大16px */
.ev2 .ev_main_btn .ev2-main-go {
	font-size: clamp(13px, 1.5em, 16px);
	padding-top: 1.1em;
	padding-bottom: 1.1em;
}

/* 予約フォームまで来たら、カードの「日時を選んで予約する」はふわっと隠す（event02.js：is-form） */
.ev2-card.is-form .ev2-go {
	opacity: 0;
	max-height: 0;
	pointer-events: none;
}

/* ==========================================================
   共有（施工事例の「共有」と同じ見た目）
   ・PC：開催情報カードの予約ボタンの下
   ・スマホ：画面下の予約バーの左（イベント名・日程はバーから外す）
   ========================================================== */
.ev2-share {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	border: 1px solid #2f417f;
	border-radius: 3px;
	background: #fff;
	color: #2f417f;
	font-family: inherit;
	font-weight: 700;
	letter-spacing: .04em;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: background-color .2s, color .2s;
}
.ev2-share-ico {
	flex: none;
	width: 16px;
	height: 16px;
	fill: currentColor;
}
.ev2-share.is-open {
	background: #2f417f;
	color: #fff;
}
@media (hover: hover) {
	.ev2-share:hover {
		background: #2f417f;
		color: #fff;
	}
}
/* カード：予約ボタンの下 */
.ev2-share-card {
	width: 100%;
	height: 44px;
	margin-top: 10px;
	font-size: 14px;
}
/* 予約フォームまで来て予約ボタンが消えたら、上の余白も詰める */
.ev2-card.is-form .ev2-share-card {
	margin-top: 0;
}
/* 予約バー：左の小さいボタン（アイコン＋文字） */
.ev2-share-sq {
	flex: none;
	flex-direction: column;
	gap: 3px;
	width: 64px;
	height: 44px;
	padding: 0;
	font-size: 10px;
	letter-spacing: 0;
	line-height: 1.2;
	white-space: nowrap;
}
.ev2-share-sq .ev2-share-ico {
	width: 17px;
	height: 17px;
}
.ev2-bar-btn .ev2-sp {
	display: none;
}
@media only screen and (max-width: 767px) {
	.ev2-bar-in {
		gap: 8px;
	}
	/* イベント名・日程は外して、予約ボタンを大きく */
	.ev2-bar-txt {
		display: none;
	}
	.ev2-bar-btn {
		flex: 1;
		min-width: 0;
		height: 48px;
		font-size: clamp(13px, 4vw, 16px);
	}
	.ev2-bar-btn .ev2-sp {
		display: inline;
	}
	.ev2-share-sq {
		height: 48px;
	}
}
@media only screen and (min-width: 768px) {
	.ev2-share-sq {
		height: 48px;
	}
}

/* ---------- 共有メニュー（PC）：ボタンの下（足りなければ上）に。画面からはみ出さない ---------- */
.ev2-sh {
	position: fixed;
	z-index: 100030;
	top: 0;
	left: 0;
	box-sizing: border-box;
	overflow-y: auto;
	background: #fff;
	box-shadow: 0 8px 30px rgba(20, 30, 60, .22);
	color: #221815;
	font-size: 13px;
	line-height: 1.6;
	opacity: 0;
	visibility: hidden;
	transform: translateY(4px);
	transition: opacity .18s, transform .18s, visibility .18s;
}
.ev2-sh * {
	line-height: inherit;
}
.ev2-sh.is-show {
	opacity: 1;
	visibility: visible;
	transform: none;
}
.ev2-sh[data-dir="up"] {
	transform: translateY(-4px);
}
.ev2-sh.is-show[data-dir="up"] {
	transform: none;
}
/* ボタンを指す三角 */
.ev2-sh::before {
	content: "";
	position: fixed;
	display: none;
}
.ev2-sh[data-dir="down"],
.ev2-sh[data-dir="up"] {
	overflow: visible;
}
.ev2-sh[data-dir="down"]::before,
.ev2-sh[data-dir="up"]::before {
	display: block;
	position: absolute;
	left: var(--ev2-sh-arrow, 50%);
	margin-left: -7px;
	border: 7px solid transparent;
}
.ev2-sh[data-dir="down"]::before {
	top: -7px;
	border-top: none;
	border-bottom-color: #fff;
}
.ev2-sh[data-dir="up"]::before {
	bottom: -7px;
	border-bottom: none;
	border-top-color: #fff;
}
.ev2-sh-hd {
	position: relative;
	padding: 12px 40px 9px 14px;
	border-bottom: 1px solid #e7eaf0;
	color: #6b7280;
	font-size: 12px;
}
.ev2-sh-x {
	position: absolute;
	top: 4px;
	right: 4px;
	width: 32px;
	height: 32px;
	padding: 0;
	border: none;
	background: none;
	color: #6b7280;
	font-family: inherit;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
}
.ev2-sh-a {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin: 0;
	padding: 10px 14px;
	border: none;
	border-bottom: 1px solid #f1f2f5;
	background: #fff;
	color: #221815;
	font-family: inherit;
	font-size: 13px;
	font-weight: 700;
	text-align: left;
	text-decoration: none;
	letter-spacing: .03em;
	cursor: pointer;
	transition: background-color .15s;
}
.ev2-sh-a:hover,
.ev2-sh-a:focus-visible {
	background: #f4f6fb;
	outline: none;
}
.ev2-sh-a i {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	color: #fff;
	font-style: normal;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0;
}
.ev2-sh-a i svg {
	width: 15px;
	height: 15px;
}
.ev2-sh-a .is-line {
	background: #06c755;
}
.ev2-sh-a .is-mail {
	background: #7a8597;
}
.ev2-sh-a .is-copy {
	background: #2f417f;
}
/* 中身：左にメニュー、右に QRコード（PC） */
.ev2-sh-bd {
	display: flex;
}
.ev2-sh-list {
	flex: 1;
	min-width: 0;
}
.ev2-sh-list .ev2-sh-a:last-child {
	border-bottom: none;
}
.ev2-sh-qr {
	flex: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 128px;
	padding: 10px 8px;
	box-sizing: border-box;
	border-left: 1px solid #eef0f4;
	background: #f7f8fa;
	text-align: center;
}
.ev2-sh-qr[hidden] {
	display: none;
}
.ev2-sh-qrbox {
	flex: none;
	width: 80px;
	height: 80px;
	padding: 4px;
	box-sizing: border-box;
	background: #fff;
	border: 1px solid #e2e5ec;
}
.ev2-sh-qrbox svg {
	display: block;
	width: 100%;
	height: 100%;
}
.ev2-sh-qr small {
	color: #6b7280;
	font-size: 10.5px;
	line-height: 1.55;
	letter-spacing: 0;
}
/* PC：左の2行を QRコードの高さに合わせて均等に */
.ev2-sh.is-pc .ev2-sh-list {
	display: flex;
	flex-direction: column;
}
.ev2-sh.is-pc .ev2-sh-a {
	flex: 1;
	padding-left: 16px;
}

/* ==========================================================
   ページトップへ戻るボタン（詳細ページの右下）
   見た目はトップページの戻るボタン（base.css の .side_btn_return）をそのまま使い、位置だけ指定
   ・右端は、予約の続き／お気に入りのサイドボタンとそろえる（右から10px）
   ・予約バー・フォームの進捗バーが出ている時は、event02.js がその上へずらす
   ========================================================== */
.side_btn_return.ev2-totop {
	/* スマホ（〜999px）は base.css の .side_btn_return が効かないので、同じ見た目をここで */
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #e5ebef;
	position: fixed;
	z-index: 35;
	right: 10px;
	bottom: 10px;
	width: 44px;
	height: 44px;
	box-sizing: border-box;
	opacity: 0;
	visibility: hidden;
	transition: opacity .25s, visibility .25s, bottom .25s ease;
}
.side_btn_return.ev2-totop svg {
	width: 5px;
	height: 5px;
	transform: rotate(-90deg);
	transition: transform .2s;
}
@media (hover: hover) {
	.side_btn_return.ev2-totop:hover svg {
		transform: rotate(-90deg) translateX(5px);
	}
}
.side_btn_return.ev2-totop.is-show {
	opacity: 1;
	visibility: visible;
}
@media only screen and (min-width: 1000px) {
	.side_btn_return.ev2-totop {
		bottom: 20px;
		width: 50px;
		height: 50px;
	}
}
@media only screen and (min-width: 1200px) {
	.side_btn_return.ev2-totop {
		width: 68px;
		height: 68px;
	}
}
