/* チケット購入ボタン（teketの公式ロゴカラー #001f42 仕様） */
.ticket-btn {
  display: inline-block;
  padding: 15px 40px;
  font-size: 1.2rem;
  font-weight: bold;
  color: #fff !important; /* 文字色を常に白に強制固定 */
  text-decoration: none;
  background-color: #001f42; 
  border-radius: 50px;
  box-shadow: 0 4px 10px rgba(0, 31, 66, 0.15);
  border: 2px solid rgba(255, 255, 255, 0.1);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  text-align: center;
}

/* hover（マウスを乗せたとき）：文字色は白のまま、スッと少し上に動く */
.ticket-btn:hover {
  color: #fff !important; /* ホバー時も確実に白を維持 */
  transform: translateY(-3px); /* スッと上に動く */
  box-shadow: 0 6px 15px rgba(0, 31, 66, 0.3); /* 影を少しだけプラス */
}

/* active（クリックしたとき）：少しだけ凹む */
.ticket-btn:active {
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(0, 31, 66, 0.15);
}
/* 右下追尾（フローティング）ボタンのスタイル */
.floating-ticket-btn {
  position: fixed;
  bottom: 20px; /* 画面下部からの距離 */
  right: 20px;  /* 画面右側からの距離 */
  z-index: 9999; /* 他の要素の上に最優先で表示 */
  
  display: inline-block;
  padding: 14px 28px;
  font-size: 1rem;
  font-weight: bold;
  
  /* 【変更】文字色を青に変更 */
  color: #001f42 !important; 
  text-decoration: none;
  
  /* 【変更】背景を「少し透過した白」に変更 */
  background-color: rgba(255, 255, 255, 0.75); 
  
  border-radius: 50px; /* 丸みのあるデザイン */
  box-shadow: 0 4px 15px rgba(0, 31, 66, 0.2); /* 影の濃さを少しマイルドに */
  
  /* 【変更】白枠の透過度を少し上げて見えやすく変更 */
  border: 2px solid rgba(255, 255, 255, 0.6);
  
  transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; /* なめらかな動き */
  text-align: center;
  backdrop-filter: blur(4px); /* 背景の宇宙をほんのりボカして文字を読みやすく（お好みで） */
}

/* hover（マウスを乗せたとき）：青文字のまま、少し上にスッと動き、背景の白をクッキリさせる */
.floating-ticket-btn:hover {
  /* 【変更】ホバー時も青文字を維持 */
  color: #001f42 !important; 
  /* 【追加】ホバー時は透過をなくして完全に白にする（視認性アップ） */
  background-color: rgba(255, 255, 255, 1); 
  transform: translateY(-4px); /* スッと少し上に動く */
  box-shadow: 0 8px 20px rgba(0, 31, 66, 0.35); /* 影を少し強くして浮遊感を強調 */
}

/* active（クリックしたとき）：少しだけ凹む */
.floating-ticket-btn:active {
  /* 【変更】クリック時も青文字を維持 */
  color: #001f42 !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0, 31, 66, 0.2);
}

/* スマホ用の微調整（画面が狭いので少し小さく、位置を調整） */
@media (max-width: 768px) {
  .floating-ticket-btn {
    bottom: 15px;
    right: 15px;
    padding: 10px 20px;
    font-size: 0.9rem;
  }
}
/* ボードや背景を排除し、シンプルな左詰めテキストにする */
.griffindor {
  text-align: right;
  font-family: 游明朝;
  font-style: italic;
}


/* ★ hover（テキストエリアにマウスが乗ったとき）：「♪辻音楽師♪」の文字だけが動く */
.griffindor:hover .strong {
  transform: translateY(-3px); /* 文字だけがスッと3px上に動く */
  color: #d3a625; /* 文字色が静かにゴールドへ変化 */
}
.teket{float:left;}