@charset "UTF-8";
/*--------------------------------------------------------
MONEY RUSH ゲーム埋め込み枠
ゲーム本体は game/ 配下の静的サイトで、iframe として読み込む。
（ゲーム側CSSが html,body に overflow:hidden 等を当てるため、
  LP本体へ直接展開せず iframe で隔離している）
--------------------------------------------------------*/
/*--------------------------------------------------------
ゲーム復帰ボタン
js_follow_target が画面上部に達したら右端に出す。
--------------------------------------------------------*/
.scroll_to_game {
  position: fixed;
  /* top:% は position:fixed だとレイアウトビューポート基準になり、
     iOSのアドレスバー開閉で高さが変わるたびに位置が動いてしまう。
     svh はツールバー表示時の高さで固定される単位なので、開閉しても動かない。
     （svh未対応ブラウザ向けに vh 版を先に書いて上書きさせる） */
  top: 40vh;
  top: 40svh;
  right: 0;
  z-index: 9999;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  line-height: 0;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  /* 非表示時はクリックを拾わせない */
  opacity: 0;
  visibility: hidden;
  transform: translateX(16px);
  transition: opacity .3s ease, transform .3s ease, visibility .3s;
}

.scroll_to_game.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.scroll_to_game img {
  display: block;
  /* base_sp.css の `img { width: 100% }` を打ち消しつつ、
     画像の実寸175pxを上限に画面幅へ追従させる。 */
  width: clamp(72px, 20vw, 110px);
  max-width: none;
  height: auto;
}

.game_container {
  display: flex;
  justify-content: center;
  background: #14251e;
}

.game_container iframe {
  display: block;
  border: 0;
  /* 幅は最大900px、高さは画面いっぱい。
     ゲーム側のcanvasは枠の縦横比に追従するため、9:16でなくても歪まない。
     svh未対応ブラウザ向けに vh 版を先に書いて上書きさせる。 */
  width: min(100%, 900px);
  height: 100vh;
  height: 100svh;
}
