/* スマホ用メニューボタンの3本線の色を紫に変更 */
#btn_menu_sp .line1,
#btn_menu_sp .line2,
#btn_menu_sp .line3 {
  background-color: #60369c !important;
}

/* SPグローバルナビゲーション背景を任意画像で横方向に繰り返し */
#top_navi {
  background-image: url("https://tight-flare.com/upload/pub/bg_nav.jpg"); /* ← 画像のURLを指定 */
  background-repeat: repeat-x;             /* 横方向に繰り返し */
  background-position: center center;      /* 位置は中央揃え */
  background-size: auto 100%;              /* 高さを要素の縦幅にフィット */
}

/* PCグローバルナビ背景に画像を横方向リピート＋高さフィット */
ul.clearfix li a {
  background-image: url("https://tight-flare.com/upload/pub/bg_nav.jpg"); /* ← 文字の背景にしたい画像 */
  background-repeat: repeat-x;             /* 横方向に繰り返し */
  background-size: auto 100%;              /* 高さを揃える */
  background-position: center center;

  color: inherit;                          /* 文字色は既存のまま */
  display: inline-block;                   /* 背景を文字の範囲に適用 */
  padding: 0 6px;                          /* 背景が文字からはみ出すのを防ぐ余白 */
}

/* h2タイトルバー背景に画像を横方向リピート＋高さフィット */
h2.subtitle {
  background-image: url("https://tight-flare.com/upload/pub/bg_nav.jpg");
  background-repeat: repeat-x;             
  background-size: auto 100%;              
  background-position: center center;

  color: inherit;                          
  display: block;                          
  padding: 10px 0 10px 1em;   /* 左に「1em」分の余白を追加（約半角1文字分） */
}

/* 背景の白透かしの濃さ調整 */
#wrap.upside {
  background: rgba(255, 255, 255, 0.40) !important;
}



 /* スマホ版表示で新着やイベント記事の画像下に文章を表示 */
@media screen and (max-width: 768px) {
  /* イベントリスト全体を調整 */
  ul.topiclist li {
    display: flex;
    flex-direction: column; /* 画像→テキストの縦並び */
    align-items: center;    /* 中央揃え（不要なら削除） */
  }

  /* 画像を上に固定して幅100%に */
  ul.topiclist li img.ph {
    order: 1;
    width: 100%;
    height: auto;
    display: block;
  }

  /* 記事本文を画像の下に */
  ul.topiclist li article {
    order: 2;
    margin-top: 0.75rem;
    width: 95%; /* 画面幅の余白を確保 */
  }

  /* 必要に応じてテキスト整形 */
  ul.topiclist li article h3 {
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
    text-align: center; /* 中央寄せにしたい場合 */
  }

  ul.topiclist li article p {
    line-height: 1.6;
    font-size: 0.95rem;
  }
}


/* 背景動画の中央位置を固定（全デバイス共通） */
video#bgvid, 
video.bgvideo, 
body > video {
  object-fit: cover !important;
  object-position: center center !important;
  width: 100vw !important;
  height: 100vh !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: fixed;
  z-index: -1;
}
