/* =========================================================
   運動公園関連ページ 共通CSS
========================================================= */


/* =========================================================
   01. 共通パーツ / Utility
========================================================= */
/* -------------------------------------
	上下余白削除
------------------------------------- */
.l-contents__inner{
	padding-top: 0!important;
	padding-bottom: 0!important;
}

/* -------------------------------------
	共通：セクションタイトル装飾（アイコン）
------------------------------------- */

/* --- 共通セット（上アイコン配置） --- */
#park-facilities .smb-section__title,
#park-news .smb-section__title,
#park-guidance .smb-section__title,
#park-access .smb-section__title {
	position: relative;
	text-align: center;
}

/* アイコン共通仕様 */
#park-facilities .smb-section__title::before,
#park-news .smb-section__title::before,
#park-guidance .smb-section__title::before,
#park-access .smb-section__title::before {
	content: "";
	display: block;
	width: 40px;
	height: 40px;
	margin: 0 auto 12px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

/* --- 各セクションのアイコン --- */
#park-facilities .smb-section__title::before {
	background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2025/12/park_facility_icon.svg);
}

#park-news .smb-section__title::before {
	background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2025/12/top_news_icon.svg);
}

#park-guidance .smb-section__title::before {
	background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2025/12/park_guidance_icon.svg);
}

#park-access .smb-section__title::before {
	background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2025/12/top_access_icon.svg);
}


/* -------------------------------------
   共通：セクションタイトルと英語サブタイトルの間
------------------------------------- */
.smb-section__lede-wrapper{
	margin-top: 8px!important;
}



/* -------------------------------------
   共通：h2背景装飾
------------------------------------- */
.park_h2_bg {
	background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/park_h2_bg.svg);
	height: 56px;
	display: flex;
	align-items: center;
	padding-left: 12px;
	border-radius: 5px;
}

/* スマホ表示 */
@media (max-width: 767px) {
	.park_h2_bg img{
		display: none;
	}
}

/* =====================================
   共通：お問い合わせセクション
===================================== */
#park-contact{
	color: #fff;
	background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/park_contact_bg_1920px.png);
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: 0;
}

/* スマホ表示 */
@media screen and (max-width: 767px) {
	#park-contact {
		background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/park_contact_bg_sp.png)!important;
		background-repeat: no-repeat;
		background-position: center top;
		background-size: cover;
	}
}


/* 電話番号とメールアドレスフォントサイズ調整 */
@media (max-width: 767px) {
	#park-contact h3 .sme-font-size {
		font-size: 24px !important;
	}
}


/* -------------------------------------
   共通：お問い合わせ 見出し横装飾
------------------------------------- */

#park-contact .smb-section__title > span {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	width: 100%;
}

#park-contact .smb-section__title > span::before,
#park-contact .smb-section__title > span::after {
	content: "";
	flex: 1;
	max-width: 100%;
	min-width: 80px;
	height: 10px;
	background: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/contact_deco_white.svg)
		repeat-x center / auto 100%;
}

/*見出し横装飾 スマホ対応*/
@media (max-width: 767px) {

	/* 横並び解除 */
	#park-contact .smb-section__title > span {
		display: block;
	}

	/* before は非表示 */
	#park-contact .smb-section__title > span::before {
		display: none;
	}

	/* after を見出し下装飾として使用 */
	#park-contact .smb-section__title > span::after {
		display: block;
		content: "";
		width: 80%;
		height: 8px;
		margin: 12px auto 0;
		background: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/contact_deco_white.svg)
			repeat-x center / auto 100%;
	}
}





/* =========================================================
   02. 運動公園 メインページ
========================================================= */

/* =====================================
   02-1 キービジュアルセクション
===================================== */
#park-kv{
  position: relative;
}


/* 日本語タイトル */
#park-kv::before{
	content: "高島市今津総合運動公園";
	position: absolute;
	top: 46%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	font-size: 48px;
	font-weight: 700;
	letter-spacing: .18em;
	white-space: nowrap;
	width: 100%;
	max-width: 100%;
	text-align: center;
	text-shadow: 0 0px 18px rgba(51,51,51,.45);
}

/* 英語タイトル */
#park-kv::after{
	content: "Imazu General Athletic Park";
	position: absolute;
	top: 57%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-weight: bold;
	letter-spacing: .18em;
	white-space: nowrap;
	width: 100%;
	max-width: 100%;
	color: #fff;
	font-size: 18px;
	text-align: center;
	text-shadow: 0 5px 15px rgba(0,0,0,.45);
}

@media (max-width: 767px) {
	#park-kv::before{
		top: 38%;
		font-size: 24px;
		letter-spacing: .1em;
	}
	#park-kv::after{
		font-size: 14px;
		letter-spacing: .1em;
	}
}




/* =====================================
   02-2 コンセプトセクション
===================================== */

/* -------------------------------------
   写真２枚のレイアウト設定
------------------------------------- */
.concept-img {
  display: grid;
  gap: 28px;
  justify-items: end;
}

/* ---上の画像（大きめ・右にズラす）--- */
.concept-img .wp-block-image:nth-child(1) {
  max-width: 375px !important;
  width: 375px !important;
  transform: translateX(100px);
}

/* ---コンセプト画像：下の画像（小さめ・左にズラす）--- */
.concept-img .wp-block-image:nth-child(2) {
  max-width: 285px !important;
  width: 285px !important;
  transform: translateX(-80px);
}

/* ---歪まない設定--- */
.concept-img img {
  width: 100% !important;
  height: auto !important;
}


/* スマホ表示 */
@media screen and (max-width: 767px) {
	#park-concept .wp-block-image img {
		max-width: 80%!important;
	}
	/* ---上の画像（大きめ・右にズラす）--- */
	.concept-img .wp-block-image:nth-child(1) {
		transform: translateX(65px)!important;
	}
	
	/* ---コンセプト画像：下の画像（小さめ・左にズラす）--- */
	.concept-img .wp-block-image:nth-child(2) {
		transform: translateX(-75px)!important;
	}
}

/* タブレット表示 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	#park-concept .wp-block-image img {
		max-width: 100%;
	}
	/* ---上の画像（大きめ・右にズラす）--- */
	.concept-img .wp-block-image:nth-child(1) {
		transform: translateX(100px)!important;
	}
	
	/* ---コンセプト画像：下の画像（小さめ・左にズラす）--- */
	.concept-img .wp-block-image:nth-child(2) {
		transform: translateX(-120px)!important;
	}
}






/* =====================================
   02-3 園内施設セクション
===================================== */

/* -------------------------------------
   背景画像
------------------------------------- */
@media screen and (min-width: 768px) {
	#park-facilities{
		background-image: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/park_facility_bg_1920px-scaled.webp)!important;
		background-repeat: no-repeat;
		background-size: cover;
	}
	
	#park-facilities .smb-section__dividers,
	#park-facilities .smb-section__fixed-background{
		display: none!important;
	}
}

/* -------------------------------------
   イラストの位置調整
------------------------------------- */
#park-facilities{
    position: relative; /* 基準 */
}

#park-facilities .park_illustration_01{
    position: absolute;
    top: 80px;
    left: 80px;
    z-index: 1;
    pointer-events: none;
}

#park-facilities .park_illustration_02{
    position: absolute;
    top: 90px;
    right: 80px;
    z-index: 1;
    pointer-events: none;
}

#park-facilities .park_illustration_03{
    position: absolute;
    top: 940px;
    left: 80px;
    z-index: 1;
    pointer-events: none;
}

#park-facilities .park_illustration_04{
    position: absolute;
    top: 1080px;
    right: 80px;
    z-index: 1;
    pointer-events: none;
}


/* スマホ表示 */
@media screen and (max-width: 767px) {
	#park-facilities .park_illustration_01{
		top: -60px;
		left: 25px;
	}
	
	#park-facilities .park_illustration_01 img{
		width: 80px!important;
	}
	
	#park-facilities .park_illustration_02{
		top: -370px;
		right: 35px;
	}
	
	#park-facilities .park_illustration_02 img{
		width: 80px!important;
	}
	
	#park-facilities .park_illustration_03{
		top: unset;
		bottom: -80px;
		left: 35px;
	}
	
	#park-facilities .park_illustration_03 img{
		width: 80px!important;
	}
	
	#park-facilities .park_illustration_04{
		top: 490px;
		right: 25px;
	}
	
	#park-facilities .park_illustration_04{
		width: 100px!important;
	}
}

/* タブレットはイラスト非表示 */
@media (min-width: 768px) and (max-width: 1024px) {
	.park_illustration_01,
	.park_illustration_02,
	.park_illustration_03,
	.park_illustration_04{
		display: none;
	}
}



/* -------------------------------------
   緑の吹き出し線
------------------------------------- */
.fukidashi-line::before {
	content: "";
	display: block;
	background-image: url("http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/fukidashi_line_01.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;

	width: 320px;
	height: 12px;
	margin: 12px auto 16px;
}




/* -------------------------------------
   ループスライダー
------------------------------------- */
/* --- フルブリード & 表示枠 --- */
#park-facilities .wavy-slider-section {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 120px 0 160px;
	position: relative;

	/* transformで動かす */
	overflow: hidden;
}

/* --- トラック --- */
#park-facilities .wavy-slider-track {
	display: flex;
	flex-wrap: nowrap;
	gap: 32px;
	padding: 0 24px;
	width: max-content;
	will-change: transform;
}

/* --- 各画像 --- */
#park-facilities .wavy-slider-track figure {
	width: 360px;
	flex-shrink: 0;
}

#park-facilities .wavy-slider-track img {
	width: 100%;
	display: block;
	box-shadow: 0 12px 30px rgba(0,0,0,.08);
}

/* --- 波揺れ配置（4枚ループ） --- */
#park-facilities .wavy-slider-track figure:nth-child(4n+1) { margin-top: 32px; }
#park-facilities .wavy-slider-track figure:nth-child(4n+2) { margin-top: 0; }
#park-facilities .wavy-slider-track figure:nth-child(4n+3) { margin-top: 48px; }
#park-facilities .wavy-slider-track figure:nth-child(4n+4) { margin-top: 16px; }

/* --- スマホ対応 --- */
@media (max-width: 767px) {

	#park-facilities .wavy-slider-section {
		padding: 80px 0;
	}

	#park-facilities .wavy-slider-track {
		gap: 16px;
	}

	#park-facilities .wavy-slider-track figure {
		width: 80vw;
		margin-top: 0 !important;
	}

	/* スマホ用：互い違い */
	#park-facilities .wavy-slider-track figure:nth-child(even) {
		margin-top: 24px !important;
	}
}




/* -------------------------------------
   ボタンの背景色
------------------------------------- */
#park-facilities .smb-btn-wrapper.is-style-ghost .smb-btn{
	background-color: #fff;
}




/* =========================================================
   03. お問い合わせページ
========================================================= */

/* -------------------------------------
   緑の区切り線
------------------------------------- */
#contact hr.hr-green {
	border: none;
	height: 1px;
	background-color: #008640;
	margin: 50px 0;
	opacity: 1;
}

/* -------------------------------------
   見出し横装飾
------------------------------------- */
#contact .smb-section__title > span,
#access .smb-section__title > span {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	width: 100%;
}

#contact .smb-section__title > span::before,
#contact .smb-section__title > span::after,
#access .smb-section__title > span::before,
#access .smb-section__title > span::after {
	content: "";
	flex: 1;
	max-width: 100%;
	min-width: 80px;
	height: 10px;
	background: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/contact_deco_green.svg)
		repeat-x center / auto 100%;
}

@media (max-width: 767px) {
	/* spanを通常ブロックに戻す */
	#contact .smb-section__title > span,
	#access .smb-section__title > span {
		display: block;
	}

	/* beforeは消す */
	#contact .smb-section__title > span::before,
	#access .smb-section__title > span::before {
		display: none;
	}

	/* afterを下線として使う */
	#contact .smb-section__title > span::after,
	#access .smb-section__title > span::after {
		display: block;
		content: "";
		width: 80%;          /* 下線の長さ */
		height: 8px;
		margin: 12px auto 0;   /* 見出し下に余白 */
		background: url(http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/contact_deco_green.svg)
			repeat-x center / auto 100%;
	}
	
	/* 電話番号とメールアドレスフォントサイズ調整 */
	#contact h3 .sme-font-size {
		font-size: 24px !important;
	}
}





/* -------------------------------------
   アクセス見出し内のアイコン余白
------------------------------------- */
#access .wp-block-heading {
	display: flex;
	align-items: center;
}

#access .wp-block-heading img {
	margin: 0 12px;
	vertical-align: middle;
}





/* =========================================================
   04. 施設詳細ページ
========================================================= */

/* -------------------------------------
   見出し下 吹き出し線
------------------------------------- */
#park-detail .smb-section__title span {
	position: relative;
	display: inline-block;
}

#park-detail .smb-section__title span::after {
	content: "";
	display: block;
	width: 260px;
	height: 24px;
	margin: 10px auto 0;
	background-image: url("http://hibari21.com/hibari21_wp/wp-content/uploads/2026/01/fukidashi_line_01.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}


/* -------------------------------------
   ボタンデザイン
------------------------------------- */
#park-detail .smb-btn-wrapper.is-style-ghost .smb-btn {
	background-color: #fff !important;
}

/* ボタン高さ揃え */
#park-detail .wp-block-snow-monkey-blocks-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
}

#park-detail .wp-block-snow-monkey-blocks-btn {
	flex: 1 1 30%;
	display: flex;
}

#park-detail .wp-block-snow-monkey-blocks-btn .smb-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 70px;
}

/* -------------------------------------
   スライダーのキャプション
------------------------------------- */

.park-facility-slider .smb-spider-slider__item__caption {
  display: block;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #fff;
}

/* -------------------------------------
   スライダーのメイン画像 高さ380px固定
------------------------------------- */

/* スライダー全体 */
.park-facility-slider .spider__canvas {
  height: 380px;
  overflow: hidden;
}

/* 各スライド */
.park-facility-slider .spider__slide {
  height: 100%;
}

/* 画像ラッパー（高さの受け皿） */
.park-facility-slider .spider__slide .smb-spider-slider__figure-wrapper {
  height: 100%;
  width: 100%;
}

/* 画像を縦中央基準でトリミング */
.park-facility-slider .spider__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* スマホ表示 */
@media (max-width: 767px) {
	.park-facility-slider .spider__canvas {
		height: unset;
	}
}


/* -------------------------------------
   メイン画像 高さ380px固定
------------------------------------- */
.detail-mainimg {
	height: 380px;
	overflow: hidden;
}
.detail-mainimg img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	object-position: center;
}

/* スマホ表示 */
@media (max-width: 767px) {
	.wp-block-image.alignfull.detail-mainimg {
		height: unset;
	}
}

.test-display-none{
	display: none;
}

/* -------------------------------------
   グラウンド内の入れ子セクションの上余白を削除
------------------------------------- */
#ground .wp-block-snow-monkey-blocks-section {
	padding-top: 0;
}


/* -------------------------------------
   表レイアウト 3:7
------------------------------------- */
.wp-block-table table {
	width: 100%;
	table-layout: fixed;
}

.wp-block-table table td:first-child,
.wp-block-table table th:first-child {
	width: 30%;
}

.wp-block-table table td:nth-child(2),
.wp-block-table table th:nth-child(2) {
	width: 70%;
}
