/* topヘッダー非表示 */
.site-header{
  display: none;
}

/* フッター位置調整 */
.site-body{
  position: relative;
}

.site-footer{
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: rgba(0,0,0,0);
  mix-blend-mode: difference;
}

/* ==============================
   ローディングオーバーレイ
   ============================== */

#loading {
  position: fixed;
  top: 10px;
  left: 50%;
  width: 100svw;
  max-width: none;
  height: 100%;
  background: rgba(0,0,0,0); /* 背景を透けさせて見せる */
  display: flex;
  justify-content: center;
  align-items: flex-start; /* 上揃え */
  z-index: 9999;
  transform: translateX(-50%);
  mix-blend-mode: difference;

}

/* ロゴアニメーション */
.loading-logo {
  width:100vw;
  opacity: 0;
  animation: logoFadeIn 1.2s ease forwards;
}



@keyframes logoFadeIn {
    to {
    opacity: 1;
  }
}

.loading-logo img{
  width: 100%;
}
/* ヘッダー初期状態は非表示 */
.top-hamburger-wrap {
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -60px); /* 上に少しずらす */
  transition: opacity 0.8s ease, transform 0.8s ease;
}

/* 表示用クラス */
.top-hamburger-wrap.show {
  opacity: 1;
  pointer-events: auto;
  top: 0;
  transform: translate(-50%, 0);
}


/* main visual */
/* main背景装飾 */


.video-bg {
  /* position: absolute; */
  top: 0;
  left: 0;
  width: 100%!important;
  height: 100svh;
  overflow: hidden;
  z-index: 0;
}

.video-bg iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 56.25vw; /* 16:9 */
  min-height: 100svh;
  min-width: 177.77svh;
  transform: translate(-50%, -50%);
  pointer-events: none; /* 背景扱い */
}

/* ハンバーガーメニューボタンカスタマイズ */

/* TOPページ専用 */
.top-hamburger-wrap {
  position: absolute;
  top: -60px;
  left: 50%;
  z-index: 999;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100svw;
  max-width: none!important;
  padding: 0 20px 0 20px;
  color: white;
  mix-blend-mode: difference;
}


.hamburger-container{
  display: inline-block;
  justify-content: flex-start;
  position: relative;
  width: fit-content;
}


.top-hamburger-nav{
  white-space: nowrap;
  
}

.top-hamburger-nav ul{
  padding: 0!important;
  margin: unset!important;
  display: flex;
  justify-content: center; /* 中央寄せ（左寄せなら flex-start） */
             
}

.top-hamburger-nav li{
  padding: 14px 18px!important;
}

.top-hamburger-nav li a{
  position: relative;
  color: white;
  letter-spacing: normal!important;
  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
  transform-origin: center;
  display: inline-block;
  padding: 14px 18px;
  font-size: 14px;
  font-weight: bold;

}
/*
.top-hamburger-nav li a::after{
  background-color: #D94B30; /* 下線の色 
  bottom: 0px; /* 要素の下端からの距離 
  content: ""; /* 要素に内容を追加 
  height: 2px; /* 下線の高さ 
  left: 0; /* 要素の左端からの距離 
  position: absolute; /* 絶対位置指定 
  transform: scale(0, 1); /* 下線を横方向に0倍、縦方向に1倍に変形（非表示） 
  transform-origin: left top; /* 変形の原点を左上に指定 
  transition: transform .3s; /* 変形をアニメーション化 
  width: 100%;
  /* font-weight: bold; 
}
.top-hamburger-nav li a:hover::after{
  transform: scale(1, 1); /* 下線を横方向に1倍、縦方向に1倍に変形（表示） 
}
*/

.top-hamburger-nav li a:hover {
  transform: scale(1.1);
  opacity: 1;/* 文字が浮き上がって見える */
  letter-spacing: 0.03em;

}

@media screen and (max-width:991.98px) {
  .top-hamburger-wrap{
    flex-direction: column;
  }
  .top-hamburger-nav li{
    padding: 14px 18px!important;
  }
  .top-hamburger-nav li a{
    padding: 0;
  }  
}