function setInitialVh() {
  const vh = window.innerHeight * 0.01;
  document.documentElement.style.setProperty('--vh', `${vh}px`);
}
setInitialVh();

window.addEventListener("scroll", () => {
  const btn = document.querySelector(".top-btn");
  if (window.scrollY > 300) {
    btn.classList.add("visible");
  } else {
    btn.classList.remove("visible");
  }
});window.addEventListener("scroll", () => {
  const btn = document.querySelector(".top-btn");
  if (window.scrollY > 300) {
    btn.classList.add("visible");
  } else {
    btn.classList.remove("visible");
  }
});function Hamburger() {
  document.getElementById('hamburger').classList.toggle('open');
  document.getElementById('line1').classList.toggle('line_open_1');
  document.getElementById('line2').classList.toggle('line_open_2');
  document.getElementById('line3').classList.toggle('line_open_3');
  document.getElementById('sp_glonav').classList.toggle('in');
  document.getElementById('hamburger_txt').classList.toggle('open');
  document.getElementById('hamburger_txt_c').classList.toggle('open');
  document.body.classList.toggle('glonav_open');
}

function initHeaderInteractions() {
  const hamburger = document.getElementById('hamburger');
  if (hamburger) {
    hamburger.addEventListener('click', Hamburger);
  }
}

document.addEventListener('DOMContentLoaded', () => {
  fetch('giwon-header.html')
    .then(res => res.text())
    .then(data => {
      document.getElementById('giwon-header').innerHTML = data;
      observeFadeElements();
      initHeaderInteractions(); // ← ここでイベントをつける
    });

  fetch('giwon-footer.html')
    .then(res => res.text())
    .then(data => {
      document.getElementById('giwon-footer').innerHTML = data;
      observeFadeElements();
    });

  observeFadeElements();
  setRealVh();
});

function observeFadeElements() {
    const targets = document.querySelectorAll('.fade,.fade-in,.fade2,.fade-up,.fade-dw,.slide-r,.slide-l');
    for (let i = 0; i < targets.length; i++) {
        if (targets[i].dataset.observed) continue; // すでに監視されている場合はスキップ
        targets[i].dataset.observed = true; // 監視済みマークをつける

        let observer = new IntersectionObserver((entries, observer) => {
            entries.forEach(entry => {
                if (entry.isIntersecting) {
                    entry.target.classList.add('active');
                    observer.unobserve(entry.target);
                }
            });
        }, {
            rootMargin: "0px 0px",
            threshold: 0.2
        });

        observer.observe(targets[i]);
    }
}


const scrollImages = [
  { selector: ".top-sec02 .gal01", speed: -0.02 },
  { selector: ".top-sec02 .gal02", speed: -0.08 },
  { selector: ".top-sec02 .gal03", speed: -0.04 },
  { selector: ".top04-img", speed: -0.05 },
  { selector: ".top-sec07 .img01", speed: -0.05 },
  { selector: ".top-sec07 .img02", speed: -0.1 },
  { selector: ".top-sec11 .img01", speed: -0.02 },
  { selector: ".top-sec11 .img02", speed: -0.1 },
  { selector: ".meal-sec04 .area .col-l", speed: -0.07 },
  { selector: ".meal-sec04 .area .col-c", speed: -0.1 },
  { selector: ".meal-sec04 .area .col-r", speed: -0.07 },
  { selector: ".meal-sec04 .area.wa-pic .col-l", speed: -0.07 },
  { selector: ".meal-sec04 .area.wa-pic .col-c", speed: -0.1 },
  { selector: ".meal-sec04 .area.wa-pic .col-r", speed: -0.07 },
  { selector: ".fas-sec02 .area .col-l", speed: -0.04 },
  { selector: ".fas-sec02 .area .col-c", speed: -0.12 },
  { selector: ".fas-sec02 .area .col-r", speed: -0.08 },
  { selector: ".hero-banner img", speed: -0.03 }
];

function applyScrollTransform({ selector, speed }) {
  const el = document.querySelector(selector);
  if (!el) return;

  // 一度だけ transition を設定（初回のみ）
  if (!el._scrollTransformInitialized) {
    el.style.transition = "transform 0.3s ease-out";
    el._scrollTransformInitialized = true; // フラグで2回目以降回避
  }

  const rect = el.getBoundingClientRect();

  if (rect.top < window.innerHeight && rect.bottom > 0) {
    const scrollRatio = window.innerHeight - rect.top;
    el.style.transform = `translateY(${scrollRatio * speed}px)`;
  }
}

window.addEventListener("scroll", () => {
  scrollImages.forEach(applyScrollTransform);
});



/**
window.addEventListener("scroll", () => {
  const scrollY = window.scrollY;
  const section = document.querySelector(".section-intro");

  if (!section) return;

  const sectionTop = section.offsetTop;
  const sectionHeight = section.offsetHeight;

  // ページがセクション領域に入ったときだけ実行
  if (scrollY + window.innerHeight > sectionTop && scrollY < sectionTop + sectionHeight) {
    const gallerySpeeds = [
      { selector: ".intro-gallery01 img", speed: -0.02 },
      { selector: ".intro-gallery02 img", speed: -0.08 },
      { selector: ".intro-gallery03 img", speed: -0.04 },
      { selector: ".testeeee img", speed: -0.5 }
    ];

    gallerySpeeds.forEach(item => {
      const img = document.querySelector(item.selector);
      if (img) {
        // セクション内のスクロール位置に合わせて動かす
        const scrollWithinSection = scrollY - sectionTop;
        img.style.transform = `translateY(${scrollWithinSection * item.speed}px)`;
      }
    });
  }
});**/



// 初期ロード時に適用
document.addEventListener('DOMContentLoaded', () => {
    observeFadeElements();

    // MutationObserverで動的に追加される要素も監視する
    const observer = new MutationObserver(() => observeFadeElements());
    observer.observe(document.body, { childList: true, subtree: true });
});


// Ajaxで要素を追加したら、再度監視を適用
$(document).on('ajaxComplete', function () {
    observeFadeElements();
});



window.addEventListener("scroll", () => {
  const btn = document.querySelector(".top-btn");
  const footer = document.getElementById("giwon-footer");

  if (!btn || !footer) return;

  const footerRect = footer.getBoundingClientRect();
  const windowHeight = window.innerHeight;

  // フッターが画面内に入ったら非表示
  if (footerRect.top < windowHeight) {
    btn.classList.remove("visible");
    btn.classList.add("hide");
  } else if (window.scrollY > 300) {
    btn.classList.add("visible");
    btn.classList.remove("hide");
  } else {
    btn.classList.remove("visible");
    btn.classList.add("hide");
  }
});


window.addEventListener('load', () => {
  const video = document.querySelector('.giwon-video .area video');
  video.muted = true;
  setTimeout(() => {
    video.play();
  }, 4000);
});