/* =================================================================
   akiyato.jp テーマ修正パッチ（2026/05/19）
   設置: /css/akiyato-patch-20260519.css
   読込: functions.php → akiyato_patch_20260519_css() priority 101
   ================================================================= */

/* ------------------------------------------------------------------
   修正1: TOPページ News セクション — 余白を約半分に圧縮
   ------------------------------------------------------------------ */

.toppage_news {
	padding: 80px 0 80px !important;
}

.toppage_news .topTitle {
	margin-bottom: 40px !important;
}

.toppage_news ul.news-list li a {
	padding: 10px 15px;
}

.toppage_news ul.news-list {
	margin: 0 auto;
}

@media only screen and (max-width: 1023px) {
	.toppage_news {
		padding: 50px 0 !important;
	}
	.toppage_news .topTitle {
		margin-bottom: 30px !important;
	}
}

@media (min-width: 1920px) {
	.toppage_news {
		padding: 60px 0 60px !important;
	}
}


/* ------------------------------------------------------------------
   修正2: 宿ページ ナビ (.js-location-nav)
   ------------------------------------------------------------------ */

/* === 共通リセット === */
.js-location-nav,
.js-location-nav ul,
.js-location-nav ul li {
	border: none !important;
	box-shadow: none !important;
}

.js-location-nav ul li a {
	border: none !important;
	border-bottom: none !important;
	position: relative !important;
}

/* === PC: ホバー時に左→右へ細線アニメーション === */
@media (min-width: 1024px) {

	.js-location-nav ul li {
		text-align: center !important;
	}

	.js-location-nav ul li a {
		display: inline-block !important;
		padding: 20px 10px 8px !important;
		color: #000;
		transition: color .3s;
	}

	/* 下地線（::after） */
	.js-location-nav ul li a::after {
		content: '' !important;
		position: absolute !important;
		left: 15% !important;
		bottom: 0 !important;
		width: 70% !important;
		height: 1px !important;
		background: #ddd !important;
		display: block !important;
		transition: none;
	}

	/* ホバーアニメ線（::before） */
	.js-location-nav ul li a::before {
		content: '';
		position: absolute;
		left: 15%;
		bottom: 0;
		width: 0;
		height: 1px;
		background-color: #333;
		z-index: 1;
		transition: width .4s cubic-bezier(.25, .46, .45, .94);
	}

	.js-location-nav ul li a:hover::before {
		width: 70%;
	}

	.js-location-nav ul li.is-current a::before {
		width: 70%;
		height: 2px;
		background-color: #000;
	}

	.js-location-nav ul li.is-current a::after {
		background: #000 !important;
		height: 2px !important;
	}
}


/* === SP: 縦リスト＋下矢印＋テキストをライン寄せ＋ライン70%中央 === */
@media only screen and (max-width: 1023px) {

	.js-location-nav {
		padding: 2em 0 !important;
	}

	.js-location-nav ul {
		display: block !important;
		padding: 0 20px !important;
	}

	.js-location-nav ul li {
		display: block !important;
		text-align: left !important;
		position: relative !important;
		border-bottom: none !important;
	}

	/* ライン: 70%幅・中央揃え（li::afterで生成） */
	.js-location-nav ul li::after {
		content: '' !important;
		display: block !important;
		width: 70% !important;
		height: 1px !important;
		background: #ddd !important;
		margin: 0 auto !important;
		border: none !important;
	}

	/* 先頭liの上線は不要 */
	.js-location-nav ul li:first-child::before {
		display: none !important;
	}

	/* テキスト: ラインのわずか上に寄せる */
	.js-location-nav ul li a {
		display: flex !important;
		justify-content: space-between !important;
		align-items: flex-end !important;
		padding: 26px 15% 6px !important;
		font-size: 1.5rem !important;
		font-family: "游明朝 Medium", "Yu Mincho Medium", "YuMincho Medium", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", serif;
		font-weight: 500;
		color: #333 !important;
		text-decoration: none !important;
		line-height: 1 !important;
		letter-spacing: .08em;
	}

	/* 下矢印（CSS chevron） */
	.js-location-nav ul li a::after {
		content: '' !important;
		display: inline-block !important;
		position: static !important;
		flex-shrink: 0;
		width: 10px !important;
		height: 10px !important;
		border: none !important;
		border-right: 1px solid #999 !important;
		border-bottom: 1px solid #999 !important;
		background: none !important;
		transform: rotate(45deg) !important;
		margin-right: 0;
		margin-bottom: 2px;
		transition: transform .3s;
		left: auto !important;
		bottom: auto !important;
	}

	/* PC用::before線を非表示（li:first-childの上線は別途） */
	.js-location-nav ul li a::before {
		display: none !important;
	}

	/* タップフィードバック */
	.js-location-nav ul li a:active {
		background: rgba(0,0,0,.02);
	}

	/* カレント状態 */
	.js-location-nav ul li.is-current a {
		font-weight: 600;
		color: #000 !important;
	}

	.js-location-nav ul li.is-current a::after {
		border-right-color: #000 !important;
		border-bottom-color: #000 !important;
	}
}


/* ------------------------------------------------------------------
   修正3: Reviewセクション スワイパー矢印
   ------------------------------------------------------------------ */

/* === PC: 矢印を「Review」見出しの右横に配置 === */
@media (min-width: 1024px) {

	/* topTitleを相対基準に（左寄せ維持） */
	.hotels_review .card02 .topTitle,
	.hotels_review .swiper6 > .topTitle {
		position: relative !important;
	}

	/* hidden_pc解除（Review内のみ） */
	.hotels_review .hidden_pc {
		display: block !important;
		position: absolute !important;
		right: 0 !important;
		top: 50% !important;
		transform: translateY(-50%) !important;
	}

	/* swiper-controllerを横並び */
	.hotels_review .swiper-controller {
		display: flex !important;
		gap: 8px !important;
		margin: 0 !important;
		position: static !important;
	}

	.hotels_review .swiper-controller .swiper-button-prev,
	.hotels_review .swiper-controller .swiper-button-next {
		position: static !important;
		width: 40px !important;
		height: 40px !important;
		margin: 0 !important;
	}
}

/* === SP: 矢印を表示 + 80%縮小 === */
@media only screen and (max-width: 1023px) {

	/* hidden_pc解除（SPでもReview矢印を表示） */
	.hotels_review .hidden_pc {
		display: block !important;
	}

	.hotels_review .swiper-controller {
		margin-bottom: 20px !important;
		margin-top: -80px !important;
	}

	/* 矢印ボタン本体を80%に縮小 */
	.hotels_review .swiper-controller .swiper-button-prev,
	.hotels_review .swiper-controller .swiper-button-next {
		transform: scale(0.8) !important;
	}

	/* 矢印アイコンも80%に */
	.hotels_page_container .card02 .swiper-button-next:after,
	.hotels_page_container .card02 .swiper-button-prev:after {
		width: 24px !important;
		height: 24px !important;
		background-size: 24px 24px !important;
	}

	.hotels_page_container .card02 .swiper-button-prev,
	.hotels_page_container .card02 .swiper-button-next {
		width: 80px !important;
		height: 80px !important;
	}
}


/* ------------------------------------------------------------------
   修正4: Reviewスワイパー — 横スワイプ操作の確保
   ------------------------------------------------------------------ */

/* スワイパーコンテナの基本設定 */
.hotels_review .swiper6 {
	overflow: hidden !important;
}

.hotels_review .swiper6 > .swiper-wrapper {
	display: flex !important;
	cursor: grab;
}

.hotels_review .swiper6 > .swiper-wrapper:active {
	cursor: grabbing;
}

/* 各スライドの幅を固定（1枚ずつ表示） */
.hotels_review .hotels_review_list.swiper-slide {
	flex-shrink: 0 !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

/* SwiperJS未初期化時のフォールバック: CSSスクロール */
.hotels_review .swiper6:not(.swiper-initialized) > .swiper-wrapper {
	overflow-x: auto !important;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.hotels_review .swiper6:not(.swiper-initialized) > .swiper-wrapper::-webkit-scrollbar {
	display: none;
}

.hotels_review .swiper6:not(.swiper-initialized) .hotels_review_list.swiper-slide {
	scroll-snap-align: start;
	min-width: 100%;
}

/* PC: スライド幅を3列表示 */
@media (min-width: 1024px) {
	.hotels_review .hotels_review_list.swiper-slide {
		width: 33.333% !important;
	}

	.hotels_review .swiper6:not(.swiper-initialized) .hotels_review_list.swiper-slide {
		min-width: 33.333%;
	}
}

/* SP: スライド幅を1列表示 */
@media only screen and (max-width: 1023px) {
	.hotels_review .hotels_review_list.swiper-slide {
		width: 85% !important;
	}

	.hotels_review .swiper6:not(.swiper-initialized) .hotels_review_list.swiper-slide {
		min-width: 85%;
	}
}


/* ------------------------------------------------------------------
   修正5a: ギャラリータブ — PCホバー時の左→右線アニメーション
   ナビメニュー(.js-location-nav)と同一のアニメーション仕様
   ------------------------------------------------------------------ */
@media (min-width: 1024px) {

	/* ::before でホバーアニメ線を追加 */
	.tab-menu .tab-menu-item::before {
		content: '' !important;
		position: absolute !important;
		left: 25% !important;
		bottom: -4px !important;
		width: 0 !important;
		height: 1px !important;
		background-color: #333 !important;
		z-index: 1;
		transition: width .4s cubic-bezier(.25, .46, .45, .94) !important;
	}

	.tab-menu .tab-menu-item:hover::before {
		width: 50% !important;
	}

	/* カレント（checked）状態 */
	.tab-menu > input:checked + .tab-menu-item::before {
		width: 50% !important;
		height: 2px !important;
		background-color: #000 !important;
	}
}


/* ------------------------------------------------------------------
   修正5b: ギャラリーモーダル（「すべて見る」→ モーダルグリッド表示）
   ------------------------------------------------------------------ */

/* アコーディオン展開をCSS側でも抑制（JSが先に動くがフォールバック） */
.hotels_Gallery .accordion-content {
	display: none !important;
}

/* 各タブの画像を8枚までに制限（9枚目以降非表示） */
.hotels_Gallery .tab-menu-contents > .photo__gallery > li:nth-child(n+9) {
	display: none !important;
}

/* 「すべて見る」ボタンのスタイル強化 */
.hotels_Gallery .accordion-title.js-accordion-title {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 12px 32px !important;
	margin-top: 20px;
	font-size: 1.4rem !important;
	color: #333;
	border: 1px solid #ccc;
	border-radius: 30px;
	cursor: pointer;
	transition: background .2s, border-color .2s;
	text-align: center !important;
	width: auto !important;
}

.hotels_Gallery .accordion-title.js-accordion-title:hover {
	background: #f5f5f5;
	border-color: #999;
}

/* === モーダルオーバーレイ === */
.akyt-gallery-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .75);
	z-index: 99990;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s, visibility .3s;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.akyt-gallery-overlay.is-open {
	opacity: 1;
	visibility: visible;
}

/* === モーダルパネル === */
.akyt-gallery-modal {
	position: relative;
	max-width: 900px;
	margin: 40px auto;
	padding: 20px;
	background: #fff;
	border-radius: 4px;
	min-height: 50vh;
}

/* 閉じるボタン */
.akyt-gallery-close {
	position: sticky;
	top: 0;
	float: right;
	width: 40px;
	height: 40px;
	background: rgba(255,255,255,.9);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	color: #333;
	box-shadow: 0 2px 8px rgba(0,0,0,.15);
	transition: opacity .2s;
}

.akyt-gallery-close:hover {
	opacity: .7;
}

/* === 画像グリッド（2カラム） === */
.akyt-gallery-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6px;
	clear: both;
}

/* 先頭画像をヒーロー（2カラム幅） */
.akyt-gallery-grid .akyt-gallery-item:first-child {
	grid-column: 1 / -1;
}

.akyt-gallery-item {
	overflow: hidden;
	cursor: pointer;
	border-radius: 2px;
}

.akyt-gallery-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .3s;
}

.akyt-gallery-item:hover img {
	transform: scale(1.03);
}

/* 枚数カウンター */
.akyt-gallery-count {
	text-align: center;
	padding: 15px 0 10px;
	font-family: "Futura Std", sans-serif;
	font-size: 1.3rem;
	color: #666;
	letter-spacing: .05em;
}

/* === ライトボックス（個別画像フルスクリーン） === */
.akyt-lightbox {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .92);
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity .25s, visibility .25s;
}

.akyt-lightbox.is-open {
	opacity: 1;
	visibility: visible;
}

.akyt-lightbox img {
	max-width: 92%;
	max-height: 88vh;
	object-fit: contain;
	border-radius: 2px;
}

/* カウンター */
.akyt-lb-counter {
	position: absolute;
	top: 18px;
	left: 22px;
	color: #fff;
	font-family: "Futura Std", sans-serif;
	font-size: 1.4rem;
	letter-spacing: .05em;
	opacity: .85;
}

/* 閉じるボタン */
.akyt-lb-close {
	position: absolute;
	top: 14px;
	right: 18px;
	width: 44px;
	height: 44px;
	background: none;
	border: none;
	cursor: pointer;
	color: #fff;
	font-size: 28px;
	opacity: .85;
	transition: opacity .2s;
	display: flex;
	align-items: center;
	justify-content: center;
}

.akyt-lb-close:hover {
	opacity: 1;
}

/* 左右矢印 */
.akyt-lb-prev,
.akyt-lb-next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 50px;
	height: 50px;
	background: none;
	border: none;
	cursor: pointer;
	color: #fff;
	font-size: 32px;
	opacity: .7;
	transition: opacity .2s;
	display: flex;
	align-items: center;
	justify-content: center;
}

.akyt-lb-prev { left: 12px; }
.akyt-lb-next { right: 12px; }

.akyt-lb-prev:hover,
.akyt-lb-next:hover {
	opacity: 1;
}

/* === SP調整 === */
@media only screen and (max-width: 1023px) {
	.akyt-gallery-modal {
		margin: 20px 10px;
		padding: 12px;
	}

	.akyt-gallery-grid {
		gap: 4px;
	}

	.akyt-lb-prev { left: 6px; }
	.akyt-lb-next { right: 6px; }

	.akyt-lb-counter {
		font-size: 1.2rem;
		top: 12px;
		left: 14px;
	}
}