//すべてページ読み込み後に発火
document.addEventListener('DOMContentLoaded', () => {

  // ヘッダーメニュー固定 ※TOP以外でも適用する場合は別jsに移す必要あり
  window.addEventListener('scroll', () => {
    // スクロール量を取得
    const scrollHeight = window.scrollY;

    // 要素の高さを取得
    const section0 =
      document.querySelector('.st-blueBar').offsetHeight +
      document.querySelector('.st-siteHeader_2').offsetHeight;

    // st_localNav2 と st-localNavSp の要素を取得
    const stLocalNav2 = document.querySelector('.st_localNav2');
    const stLocalNavSp = document.querySelector('.st-localNavSp');

    if (scrollHeight > section0) {
      if (stLocalNav2) stLocalNav2.classList.add('fix');
      if (stLocalNavSp) stLocalNavSp.classList.add('fix');
    } else {
      if (stLocalNav2) stLocalNav2.classList.remove('fix');
      if (stLocalNavSp) stLocalNavSp.classList.remove('fix');
    }
  });


  //スペシャルページ カルーセル
  $('.slick-carousel').slick({
    infinite: true, // 無限ループ
    slidesToShow: 3, // PC時は3枚
    slidesToScroll: 1, // 1枚ずつ
    autoplay: true, // 自動再生ON
    autoplaySpeed: 3000, // 3秒ごとに次へ
    dots: true, // インジケーター
    arrows: true, // 前後ボタン
    responsive: [{
      breakpoint: 1072,
      settings: {
        slidesToShow: 1,
        centerMode: true, //中央寄せ
        centerPadding: '50px'
      }
    }]
  });

});

  // ■■■


  /**
   * 指定したセレクタ内の要素の高さを揃える
   * @param {string} selector - 高さを揃えたい要素のセレクタ
   */
  const adjustHeight = (selector) => {
    const elements = document.querySelectorAll(selector);
    let maxHeight = 0;

    // 一旦高さをautoに戻して計測
    elements.forEach(el => {
      el.style.height = 'auto'
    });

    // 最大高さを取得
    elements.forEach(el => {
      const height = el.offsetHeight;
      if (height > maxHeight) {
        maxHeight = height;
      }
    });

    // 全要素の高さを最大値に
    elements.forEach(el => {
      el.style.height = maxHeight + 'px'
    });
  }


  // 高さを揃えたいセレクタを追加↓
  const adjustSettings = [{
    selector: '.pickup-box ul li a p'
  },
  {
    selector: '.slick-carousel > div dl dt'
  }
  ];


  const adjustAllHeights = () => {
    adjustSettings.forEach(setting => {
      adjustHeight(setting.selector)
    });
  }

  window.addEventListener('DOMContentLoaded', adjustAllHeights);
  window.addEventListener('resize', adjustAllHeights);

  // ■■■