document.addEventListener('DOMContentLoaded', function () {

	// スクロールによるヘッダー表示切り替え
	let lastScrollTop = 0;
	window.addEventListener('scroll', function () {
		const header = document.querySelector('.header');
		const currentScroll = window.pageYOffset || document.documentElement.scrollTop;
		if (currentScroll > lastScrollTop && currentScroll > 200) {
			header.classList.add('is-hidden');
		} else if (currentScroll < lastScrollTop) {
			header.classList.remove('is-hidden');
		}
		lastScrollTop = Math.max(currentScroll, 0);

		// スクロール時に .menu-icon と .localnavi から .is-show を外す
		const menuIcon = document.getElementById('menu-icon');
		const localNavi = document.querySelector('.localnavi');

		if (localNavi && localNavi.classList.contains('is-show')) {
			if (menuIcon) {
				menuIcon.classList.remove('is-show');
			}
			localNavi.classList.remove('is-show');
		}
	});

	// Splide スライダーの設定
	const splide1Element = document.querySelector('.splide-1');
	if (splide1Element) {
		const splide1 = new Splide(splide1Element, {
			type: 'loop',
			perPage: 1,
			autoplay: true,
			pagination: true, // 必要に応じて有効化
		});
		splide1.mount();
	}

	const splide2Element = document.querySelector('.splide-2');
	if (splide2Element) {
		const splide2 = new Splide(splide2Element, {
			type: 'loop', // ループあり
			arrows: false, // 矢印非表示
			pagination: false, // ページネーション非表示
			fixedWidth: '300px', // スライドの幅300px
			gap: '20px', // スライド間の余白20px
			autoplay: true,
			breakpoints: { // 767px以下のスタイル
				767: {
					fixedWidth: '200px', // スライドの幅200px
					gap: '10px', // スライド間の余白10px
				},
			}
		});
		splide2.mount();
	}

	// Splide スライダーが3つある場合
	const splide3Element = document.querySelector('.splide-3');
	if (splide3Element) {
		const splide3 = new Splide(splide3Element, {
			type: 'loop',
			perPage: 1,
			autoplay: true,
			pagination: true, // ページネーションを有効
		});
		splide3.mount();
	}

	// ハンバーガーメニューのクリックによるアイコンとナビゲーションの表示切り替え
	const menuIcon = document.getElementById('menu-icon');
	if (menuIcon) {
		menuIcon.addEventListener('click', function() {
			// .menu-icon に .is-show クラスをトグル
			this.classList.toggle('is-show');

			// .localnavi に .is-show クラスをトグル
			const localNavi = document.querySelector('.localnavi');
			if (localNavi) {
				localNavi.classList.toggle('is-show');
			}
		});
	}

	// .button-block-small を .localnavi__list-last にコピーするが、.is-pc クラスはコピーしない
	const buttonBlockSmall = document.querySelector('.header__navi .button-block-small');
	if (buttonBlockSmall) { // .button-block-small が存在する場合のみ処理を行う
		const buttonBlockSmallClone = buttonBlockSmall.cloneNode(true);

		// 複製した要素から .is-pc クラスを削除
		buttonBlockSmallClone.classList.remove('is-pc');

		const localNaviListLast = document.querySelector('.localnavi__list-last');
		if (localNaviListLast) { // .localnavi__list-last が存在する場合のみコピーを実行
			localNaviListLast.appendChild(buttonBlockSmallClone);
		}
	}

});