@charset "UTF-8";
/* Reset By Normalize */
@import url(/css/normalize.css);
@import url("/css/animate.css/animate.min.css");
/* ================= 頁面框架設定 ================= */
:root {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
}

img {
  max-width: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
}

.show {
  visibility: visible !important;
}

.dtNow {
  display: none;
  position: absolute;
  left: 2px;
  top: 2px;
  z-index: 99;
  border-radius: 3px;
  padding: 3px;
}

body {
  background: #000;
}

.ingame__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/ingamebg.jpg?20241213);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-position: center;
}
@media only screen and (orientation: portrait) {
  .ingame__wrapper {
    width: 100vh;
    height: 100vw;
  }
}
@media (max-aspect-ratio: 16/9) {
  .ingame__wrapper {
    background-size: 100% auto;
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .ingame__wrapper {
    background-size: 100% auto;
  }
}
@media (min-aspect-ratio: 16/9) {
  .ingame__wrapper {
    background-size: auto 100%;
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .ingame__wrapper {
    background-size: auto 100%;
  }
}

.ingame__container {
  width: 100%;
  height: 100%;
  position: relative;
}
@media (max-aspect-ratio: 16/9) {
  .ingame__container {
    width: 100vw;
    height: 56.2857142857vw;
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .ingame__container {
    width: 100vh;
    height: 56.2857142857vh;
  }
}
@media (min-aspect-ratio: 16/9) {
  .ingame__container {
    width: 170.5583756345vh;
    width: calc(var(--vh, 1vh) * 170.667);
    padding-bottom: initial;
    height: 96vh;
    height: calc(var(--vh, 1vh) * 96);
    background-size: auto 100%;
    background-position: top center;
    top: -2vh;
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .ingame__container {
    width: 170.5583756345vw;
    height: 96vw;
    top: -2vh;
  }
}

.btn_gameclose {
  width: 8.5714285714%;
  height: 15.2284263959%;
  min-width: 42px;
  min-height: 42px;
  position: absolute;
  right: 0%;
  top: 0%;
  background: url(/Action/11_Star31/20241218MU/ingame/images/ActivityPanel_CloseBtn_Push.png?20241213);
  background-size: 100%;
  cursor: pointer;
}

.btn-base {
  width: 9.4285714286%;
  height: 7.614213198%;
  position: absolute;
  left: 14.2857142857%;
  bottom: 3.0456852792%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  -webkit-column-gap: 12.1212121212%;
     -moz-column-gap: 12.1212121212%;
          column-gap: 12.1212121212%;
}
.btn-base .btn__question {
  background: url(/Action/11_Star31/20241218MU/ingame/images/btn_question.png?20241213);
  background-size: 100%;
  background-repeat: no-repeat;
  cursor: pointer;
}
@media (hover: hover) {
  .btn-base .btn__question:hover {
    -webkit-filter: brightness(1.2);
  }
}
.btn-base .btn__record {
  background: url(/Action/11_Star31/20241218MU/ingame/images/btn_record.png?20241213);
  background-size: 100%;
  background-repeat: no-repeat;
  cursor: pointer;
}
.btn-base .btn__record:hover {
  -webkit-filter: brightness(1.2);
}

.btn__buy {
  width: 9.1428571429%;
  height: 16.2436548223%;
  position: absolute;
  left: 3.2142857143%;
  bottom: 2.6649746193%;
  background: url(/Action/11_Star31/20241218MU/ingame/images/btn_buy.png?20241213);
  background-size: 100%;
  cursor: pointer;
}
.btn__buy:hover {
  -webkit-filter: brightness(1.2);
}

.ingame__main {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.ingame__main .ingame__main__closeBg {
  width: 100%;
  height: 26%;
  position: absolute;
  bottom: -7%;
  background-size: 100%;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}
@-webkit-keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  70% {
    opacity: 1;
    -webkit-transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
            transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
            transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
  }
}
@keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  70% {
    opacity: 1;
    -webkit-transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
            transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
            transform: scale3d(0.3, 0.3, 0.3) translate3d(-700%, -220%, 0);
  }
}
.game__main__buttons {
  width: 33.9285714286%;
  height: 13.578680203%;
  position: absolute;
  bottom: 0%;
  left: 33%;
  top: 85.0253807107%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.game__main__buttons div {
  width: 49.6842105263%;
  height: 100%;
  cursor: pointer;
  background-size: 100%;
  background-repeat: no-repeat;
}
@media (hover: hover) {
  .game__main__buttons div:hover {
    -webkit-filter: brightness(1.2);
    -webkit-animation: pulse 1.5s infinite;
            animation: pulse 1.5s infinite;
  }
}
.game__main__buttons div:nth-child(1) {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/btn_sel1.png?20241213);
}
.game__main__buttons div:nth-child(2) {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/btn_sel2.png?20241213);
}

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.game__main__member {
  position: absolute;
  font-family: Verdana, sans-serif;
  font-size: 16px;
  color: #fff;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/member_bg.png?20241213);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  text-align: center;
  width: 84.3571428571%;
  height: 10.2791878173%;
  left: 50%;
  top: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (min-aspect-ratio: 9/16) {
  .game__main__member {
    top: -0.5vh;
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member {
    top: -0.5vh;
  }
}
.game__main__member .member__table {
  width: 21.1685012701%;
  height: 62.962962963%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 3.2%;
     -moz-column-gap: 3.2%;
          column-gap: 3.2%;
}
.game__main__member .member__table .vip-icon0 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v0_s.png?20241213);
}
.game__main__member .member__table .vip-icon {
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 20%;
  height: 109.8039215686%;
}
.game__main__member .member__table .vip-icon1 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v0_1.png?20241213);
}
.game__main__member .member__table .vip-icon13 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v11Plus.png?20241213);
}
.game__main__member .member__table .vip-icon2 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v1.png);
}
.game__main__member .member__table .vip-icon3 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v2.png);
}
.game__main__member .member__table .vip-icon4 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v3.png);
}
.game__main__member .member__table .vip-icon5 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v4.png);
}
.game__main__member .member__table .vip-icon6 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v5.png);
}
.game__main__member .member__table .vip-icon7 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v6.png);
}
.game__main__member .member__table .vip-icon8 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v7.png);
}
.game__main__member .member__table .vip-icon9 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v8.png);
}
.game__main__member .member__table .vip-icon10 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v9.png);
}
.game__main__member .member__table .vip-icon11 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v10.png);
}
.game__main__member .member__table .vip-icon12 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/v11.png);
}
.game__main__member .member__table .nickname {
  font-weight: 500;
  color: #fff;
  line-height: 1.5em;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.35);
  font-size: calc(10px + (24 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 24 / 1400 * 100vw, 24px);
}
@media (min-aspect-ratio: 16/9) {
  .game__main__member .member__table .nickname {
    font-size: calc(10px + (24 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 24 / 788 * 100vh, 24px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .member__table .nickname {
    line-height: 1.25em;
    font-size: calc(10px + (16 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 16 / 1400 * 100vh, 16px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .member__table .nickname {
    line-height: 1.5em;
    font-size: calc(10px + (24 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 24 / 788 * 100vw, 24px);
  }
}
.game__main__member .member__coins-props {
  width: 20.9144792549%;
  height: 62.962962963%;
  background: rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 0 0 3px #2693ff;
          box-shadow: 0 0 3px #2693ff;
  border-radius: 35px;
  margin: 0 4.233700254% 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: calc(10px + (24 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 24 / 1400 * 100vw, 24px);
}
@media (min-aspect-ratio: 16/9) {
  .game__main__member .member__coins-props {
    font-size: calc(10px + (24 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 24 / 788 * 100vh, 24px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .member__coins-props {
    line-height: 1.25em;
    font-size: calc(10px + (16 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 16 / 1400 * 100vh, 16px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .member__coins-props {
    line-height: 1.5em;
    font-size: calc(10px + (24 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 24 / 788 * 100vw, 24px);
  }
}
.game__main__member .member__coins-props p {
  width: 72.8744939271%;
}
.game__main__member .member__coins-props::before {
  content: "";
  width: 12.955465587%;
  height: 62.7450980392%;
  background: url(/Action/11_Star31/20241218MU/ingame/images/member/coin_game.png?20241213);
  background-size: 100% !important;
  background-repeat: no-repeat;
  display: block;
  position: relative;
  margin-right: 4.048582996%;
}
.game__main__member .member__status {
  width: 51.2277730737%;
  height: 62.962962963%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.game__main__member .vip-info {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  -webkit-column-gap: 1.652892562%;
     -moz-column-gap: 1.652892562%;
          column-gap: 1.652892562%;
}
.game__main__member .vip-info .coins-i,
.game__main__member .vip-info .coins-diamonds {
  width: 46.3636363636%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 0 0 3px #2693ff;
          box-shadow: 0 0 3px #2693ff;
  border-radius: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 2.8520499109%;
     -moz-column-gap: 2.8520499109%;
          column-gap: 2.8520499109%;
  position: relative;
  font-size: calc(10px + (24 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 24 / 1400 * 100vw, 24px);
}
@media (min-aspect-ratio: 16/9) {
  .game__main__member .vip-info .coins-i,
  .game__main__member .vip-info .coins-diamonds {
    font-size: calc(10px + (24 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 24 / 788 * 100vh, 24px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .vip-info .coins-i,
  .game__main__member .vip-info .coins-diamonds {
    line-height: 1.25em;
    font-size: calc(10px + (16 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 16 / 1400 * 100vh, 16px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .vip-info .coins-i,
  .game__main__member .vip-info .coins-diamonds {
    line-height: 1.5em;
    font-size: calc(10px + (24 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 24 / 788 * 100vw, 24px);
  }
}
.game__main__member .vip-info .coins-i p,
.game__main__member .vip-info .coins-diamonds p {
  width: 77.183600713%;
  font-size: calc(10px + (24 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 24 / 1400 * 100vw, 24px);
}
@media (min-aspect-ratio: 16/9) {
  .game__main__member .vip-info .coins-i p,
  .game__main__member .vip-info .coins-diamonds p {
    font-size: calc(10px + (24 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 24 / 788 * 100vh, 24px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .vip-info .coins-i p,
  .game__main__member .vip-info .coins-diamonds p {
    line-height: 1.25em;
    font-size: calc(10px + (16 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 16 / 1400 * 100vh, 16px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .game__main__member .vip-info .coins-i p,
  .game__main__member .vip-info .coins-diamonds p {
    line-height: 1.5em;
    font-size: calc(10px + (24 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 24 / 788 * 100vw, 24px);
  }
}
.game__main__member .vip-info .coins-i::before,
.game__main__member .vip-info .coins-diamonds::before {
  content: "";
  background-size: 100%;
  display: block;
  position: relative;
}
.game__main__member .vip-info .coins-i::before {
  width: 11.4081996435%;
  height: 64.7058823529%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/coin_i.png?20241213);
}
.game__main__member .vip-info .coins-diamonds::before {
  width: 12.4777183601%;
  height: 54.9019607843%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/member/coin_diamonds.png?20241213);
}

.game__main__gamebox {
  width: 44.2857142857%;
  height: 78.6802030457%;
  position: absolute;
  top: 8.6294416244%;
  left: 27.1428571429%;
}
.game__main__gamebox .roulette {
  width: 100%;
  height: 100%;
  display: inline-block;
  overflow: hidden;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  position: absolute;
}
.game__main__gamebox #roulette {
  width: 100%;
  height: 100%;
  background-size: 100% auto;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/wheel_winning_frame2.png?20241213);
  background-repeat: no-repeat;
  position: relative;
}
.game__main__gamebox .circle {
  width: 100%;
  height: 100%;
  background-size: 100% auto;
  -webkit-transition: -webkit-transform 10.5s;
  transition: -webkit-transform 10.5s;
  transition: transform 10.5s;
  transition: transform 10.5s, -webkit-transform 10.5s;
  -webkit-transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99);
          transition-timing-function: cubic-bezier(0.42, 0, 0, 0.99); /*调整旋转速度和起始速率*/
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/inner_wheel_winning_frame2.png?20241213);
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
}

.game__main__prize {
  width: 30%;
  height: 63.1979695431%;
  position: absolute;
  left: 0%;
  top: 16.6243654822%;
}
.game__main__prize img {
  width: 100%;
  height: 100%;
  display: block;
}

.luckyBag {
  width: 25.5%;
  height: 57.2335025381%;
  position: absolute;
  top: 22.0812182741%;
  left: 72.2857142857%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/bag_bg.png?20241213);
  background-size: auto 100%;
  background-repeat: no-repeat;
}
.luckyBag .bag_award {
  position: absolute;
  width: 44.8179271709%;
  height: 39.2461197339%;
  top: 23.9467849224%;
  left: 27.731092437%;
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/bag_award1.png?20241213);
}
.luckyBag .btn_receive {
  position: absolute;
  width: 33.6134453782%;
  height: 13.9689578714%;
  top: 75.3880266075%;
  left: 33.0532212885%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/btn_receive.png?20241213);
  background-size: auto 100%;
  background-repeat: no-repeat;
  cursor: pointer;
}
.luckyBag .btn_receive:hover {
  -webkit-filter: brightness(1.2);
}
.luckyBag .words {
  width: 67.7871148459%;
  height: 9.977827051%;
  position: absolute;
  left: 16.106442577%;
  bottom: 14.4124168514%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.luckyBag .words ul.nums {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  list-style: none;
}
.luckyBag .words ul.nums li {
  width: 14.8760330579%;
  height: 100%;
  background-size: auto 100% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-repeat: no-repeat;
}
.luckyBag .words .num-0 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_0.png);
}
.luckyBag .words .num-1 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_1.png);
}
.luckyBag .words .num-2 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_2.png);
}
.luckyBag .words .num-3 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_3.png);
}
.luckyBag .words .num-4 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_4.png);
}
.luckyBag .words .num-5 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_5.png);
}
.luckyBag .words .num-6 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_6.png);
}
.luckyBag .words .num-7 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_7.png);
}
.luckyBag .words .num-8 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_8.png);
}
.luckyBag .words .num-9 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/by_9.png);
}
.luckyBag .words ul.nums li.num-slash {
  width: 10.7438016529%;
  height: 122.2222222222%;
  background: url(/Action/11_Star31/20241218MU/ingame/images/number/by_slash.png);
}
.luckyBag .title_accumulation {
  position: absolute;
  width: 55.1820728291%;
  height: 8.6474501109%;
  top: 64.9667405765%;
  left: 22.4089635854%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/text_accumulation.png?20241213);
  background-size: 100%;
  background-repeat: no-repeat;
}
.luckyBag .title_achieve {
  position: absolute;
  width: 37.2549019608%;
  height: 7.9822616408%;
  top: 65.1884700665%;
  left: 30.81232493%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/text_achieve.png?20241213);
  background-size: 100%;
  background-repeat: no-repeat;
}
.luckyBag .questionBtn {
  width: 9.5238095238%;
  height: 7.9822616408%;
  position: absolute;
  top: 25.7206208426%;
  left: 17.0868347339%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/icon.png);
  background-size: 100%;
}
.luckyBag .questionBtn .tooltip {
  display: none;
  position: absolute;
  width: 16em;
  top: 100%;
  left: -6em;
  background: -webkit-gradient(linear, left top, left bottom, from(#ddf1ff), to(#adecff));
  background: linear-gradient(to bottom, #ddf1ff 0%, #adecff 100%);
  border: 2px solid #004297;
  -webkit-box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
          box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
  border-radius: 10px;
  z-index: 1;
  overflow: hidden;
  font-size: calc(12px + (16 - 12) * (100vw - 768px) / 832);
  font-size: clamp(12px, 16 / 1400 * 100vw, 16px);
}
@media (min-aspect-ratio: 16/9) {
  .luckyBag .questionBtn .tooltip {
    font-size: calc(12px + (16 - 12) * (100vh - 350px) / 730);
    font-size: clamp(12px, 16 / 788 * 100vh, 16px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .luckyBag .questionBtn .tooltip {
    line-height: 1.25em;
    font-size: calc(12px + (8 - 12) * (100vh - 350px) / 730);
    font-size: clamp(12px, 8 / 1400 * 100vh, 8px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .luckyBag .questionBtn .tooltip {
    line-height: 1.5em;
    font-size: calc(12px + (16 - 12) * (100vw - 350px) / 1570);
    font-size: clamp(12px, 16 / 788 * 100vw, 16px);
  }
}
@media (min-aspect-ratio: 16/9) {
  .luckyBag .questionBtn .tooltip {
    font-size: clamp(12px, 2.0304568528 + vh, 16px);
  }
}
.luckyBag .questionBtn .tooltip h5 {
  background: -webkit-gradient(linear, left top, left bottom, from(#004297), to(#0070bb));
  background: linear-gradient(to bottom, #004297 0%, #0070bb 100%);
  font-size: 1.2em !important;
  line-height: 1.5em;
  padding: 4px;
  margin-bottom: 0;
  color: #fff;
  text-align: center;
}
.luckyBag .questionBtn .tooltip ul.probability {
  width: calc(100% - 16px);
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  list-style: none;
  padding: 4px 0;
}
.luckyBag .questionBtn .tooltip ul.probability li {
  font-size: 1em !important;
  line-height: 1.75em;
  padding: 0 2.2408963585%;
  color: #004297;
  border-bottom: 1px solid #004297;
  position: relative;
}
.luckyBag .questionBtn .tooltip ul.probability li:nth-child(odd) {
  width: calc(100% - 3.5em);
  text-align: left;
}
.luckyBag .questionBtn .tooltip ul.probability li:nth-child(even) {
  width: 3.5em;
  text-align: right;
}
.luckyBag .questionBtn .tooltip ul.probability li:nth-last-child(-1n+2) {
  border-bottom: 0;
}
.luckyBag .questionBtn:hover .tooltip {
  display: inline-block;
}

.ingame__popup--bg {
  top: 50%;
  left: 50%;
  position: fixed;
  width: 100%;
  height: 100%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  overflow: hidden;
  background: rgba(0, 0, 0, 0.8);
  z-index: 1;
  visibility: hidden;
}

.popup {
  top: 4%;
  left: 0%;
  position: absolute;
  z-index: 999;
  width: 100%;
  height: 100%;
  visibility: hidden;
  visibility: hidden;
}
.popup-base, .popup-prize {
  width: 83.7142857143%;
  height: 82.1065989848%;
  position: absolute;
  top: 8.1428571429%;
  left: 8.9467005076%;
  background-color: #283371;
  -webkit-box-shadow: inset 0 0 0 2px #113082, 0 0 0 4px #000538, 0 0 0 8px #897ecf;
          box-shadow: inset 0 0 0 2px #113082, 0 0 0 4px #000538, 0 0 0 8px #897ecf;
  border-radius: 16px;
  color: #FFF;
  line-height: 1.5em;
  padding: 2.0304568528% 1.1428571429% 2.0304568528% 1.7142857143%;
  overflow: hidden;
  z-index: 1;
  visibility: hidden;
}
.popup-base .main, .popup-prize .main {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  overflow-y: scroll;
  padding: 8px 3em;
}
.popup-base .main::-webkit-scrollbar, .popup-prize .main::-webkit-scrollbar {
  width: 10px;
  margin: 2px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 5px;
}
.popup-base .main::-webkit-scrollbar-thumb, .popup-prize .main::-webkit-scrollbar-thumb {
  width: 8px;
  padding: 2px;
  background: rgba(202, 173, 255, 0.5);
  border-radius: 5px;
}
.popup-base .main h2, .popup-prize .main h2 {
  font-size: 1.6rem;
  color: #fff;
  letter-spacing: 5px;
  padding: 8px 0;
  text-align: center;
  font-weight: inherit;
}
.popup-base .main h2 .f-sm, .popup-prize .main h2 .f-sm {
  font-size: 0.75em;
  letter-spacing: 0px;
}
.popup-base .main .line, .popup-prize .main .line {
  width: 80%;
  height: 2px;
  margin: 0 auto;
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(20%, rgb(255, 255, 255)), color-stop(50%, rgb(255, 255, 255)), color-stop(80%, rgb(255, 255, 255)), to(rgba(255, 255, 255, 0)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 20%, rgb(255, 255, 255) 50%, rgb(255, 255, 255) 80%, rgba(255, 255, 255, 0) 100%);
  margin-bottom: 16px;
}
.popup__main {
  visibility: hidden;
}
.popup .part {
  margin-bottom: 56px;
}
.popup .part > p,
.popup .part > ol,
.popup .part > ul,
.popup .part > h3 {
  margin-bottom: 16px;
}
.popup .question h3 {
  font-size: 1.1rem;
  line-height: 2em;
  color: #e1afff;
}
.popup .question .f-danger {
  color: rgb(249, 255, 0);
}
.popup .question ol {
  font-size: 1rem;
  margin: 0 auto;
}
.popup .question ol li {
  padding-bottom: 8px;
}
.popup .prize h2 {
  font-size: 1.6rem;
  color: #fff;
  letter-spacing: 5px;
  padding: 0.6825938567% 0;
  text-align: center;
  font-weight: inherit;
}
.popup .prize h2 .f-sm {
  font-size: 0.75em;
  letter-spacing: 0px;
}
.popup .prize .line {
  width: 80%;
  height: 2px;
  margin: 0 auto;
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(20%, rgb(255, 255, 255)), color-stop(50%, rgb(255, 255, 255)), color-stop(80%, rgb(255, 255, 255)), to(rgba(255, 255, 255, 0)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 20%, rgb(255, 255, 255) 50%, rgb(255, 255, 255) 80%, rgba(255, 255, 255, 0) 100%);
  margin-bottom: 1.3651877133%;
}
.popup .prize .main {
  width: 98.976109215%;
  height: calc(100% - (1.6rem + 2px) - 17.3526140156%);
  margin: 0 auto;
  overflow-y: auto;
  position: relative;
  padding-bottom: 10px;
}
.popup .prize .main .item {
  width: 100%;
  min-height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.popup .prize .main .item ul {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  list-style-type: none;
  overflow: hidden;
}
.popup .prize .main .item ul li {
  width: 36.2068965517%;
  margin: 8px;
  background-size: 100% !important;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-bottom: 16px;
  -webkit-box-shadow: inset 0 0 3px #ffd970;
          box-shadow: inset 0 0 3px #ffd970;
  padding: 1.3793103448%;
}
.popup .prize .main .item ul li p {
  width: 100%;
  color: #fff;
  line-height: 1.75em;
  text-align: center;
  font-size: calc(12px + 6 * (100vw - 812px) / 788);
  font-size: clamp(12px, 1.2857142857 + vw, 18px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 4px 0;
}
@media screen and (min-width: 1000px) {
  .popup .prize .main .item ul li p {
    font-size: 18px;
  }
}
.popup .prize .main .item ul li img {
  max-width: 75%;
  max-height: 150px;
  display: block;
  margin: 0 auto;
}
.popup .prize .main .item ul li .nums {
  width: 21.0659898477vh;
  height: 2.7142857143vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item ul li .nums {
    width: 21.0659898477vh;
    height: 4.8223350254vh;
  }
}
.popup .prize .main .item ul li .nums .num {
  width: 2vw;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-size: 100%;
  background-position-x: center;
  background-repeat: no-repeat;
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item ul li .nums .num {
    width: 3.5532994924vh;
  }
}
.popup .prize .main .item ul li .nums .num-0 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/0.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-1 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/1.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-2 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/2.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-3 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/3.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-4 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/4.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-5 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/5.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-6 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/6.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-7 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/7.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-8 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/8.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-9 {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/9.png?v=20241213);
}
.popup .prize .main .item ul li .nums .num-multiply {
  width: 2vw;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/multiply.png?v=20241213);
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item ul li .nums .num-multiply {
    width: 3.5532994924vh;
  }
}
.popup .prize .main .item ul li .nums .num-comma {
  width: 0.5vw;
  height: 100%;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/number/comma.png?v=20241213);
}
.popup .prize .getBtn {
  width: 11.433447099%;
  min-width: 100px;
  height: 7.8825347759%;
  min-height: 38px;
  margin: 0.6825938567% auto;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/btn_ok.png?v=20241213);
  background-size: 100%;
  background-repeat: no-repeat;
  cursor: pointer;
  margin: 1.3651877133% auto;
}
.popup .bigWin {
  position: absolute;
  z-index: 999;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  background-size: 100% !important;
  overflow: hidden;
  background: url(/Action/11_Star31/20241218MU/ingame/images/big_win_bg.png?v=20241213);
}
.popup .bigWin .main {
  width: 100%;
  width: 100%;
}
.popup .bigWin .awards {
  width: 20.3071672355%;
  height: 38.0216383308%;
  position: absolute;
  top: 27.0479134467%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.popup .bigWin .awards img {
  width: 100%;
}
.popup .bigWin .awardslist {
  width: 55.4607508532%;
  height: 20.0927357032%;
  position: absolute;
  top: 64.914992272%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fdff9f), to(#ffd152));
  background-image: linear-gradient(#fdff9f, #ffd152);
  border-radius: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1.3333333333%;
     -moz-column-gap: 1.3333333333%;
          column-gap: 1.3333333333%;
  z-index: 0;
  padding: 8px;
}
.popup .bigWin .awardslist::before {
  content: "";
  display: block;
  background-color: #6d0505;
  border-radius: 16px;
  position: absolute;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border-radius: 18px;
  top: 2px;
  left: 2px;
  z-index: -1;
}
.popup .bigWin .awardslist img {
  display: block;
  max-width: 100%;
  max-height: 100%;
}
.popup .bigWin .chooselist {
  width: 62.7986348123%;
  height: 25.9659969088%;
  position: absolute;
  top: 37.0942812983%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: 0.5434782609%;
     -moz-column-gap: 0.5434782609%;
          column-gap: 0.5434782609%;
  row-gap: 2.380952381%;
}
.popup .bigWin .chooselist .chooselistBox {
  width: 19.5652173913%;
  height: 100%;
  position: relative;
  cursor: pointer;
}
.popup .bigWin .chooselist .chooselistBox.open-on .front, .popup .bigWin .chooselist .chooselistBox.open-off .front {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
}
.popup .bigWin .chooselist .chooselistBox.open-on .back, .popup .bigWin .chooselist .chooselistBox.open-off .back {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}
.popup .bigWin .chooselist .chooselistBox.open-off .back {
  -webkit-filter: grayscale(1) brightness(0.75);
          filter: grayscale(1) brightness(0.75);
}
.popup .bigWin .chooselist .chooselistBox .front,
.popup .bigWin .chooselist .chooselistBox .back {
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transition: ease-in-out 0.3s;
  transition: ease-in-out 0.3s;
  background-size: 100% 100%;
  background-repeat: no-repeat !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.popup .bigWin .chooselist .chooselistBox .front {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/choose.png?v=20241213);
}
.popup .bigWin .chooselist .chooselistBox .back {
  background: url(/Action/11_Star31/20241218MU/ingame/images/choose_open.png?v=20241213);
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
  background-size: 100% 100%;
}
.popup .bigWin .chooselist .chooselistBox img {
  display: block;
  width: 90%;
}
.popup .bigWin .getBtn {
  width: 11.433447099%;
  min-width: 100px;
  height: 7.8825347759%;
  min-height: 38px;
  margin: 0.6825938567% auto;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/btn_ok.png?v=20241213);
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  bottom: 18.5471406491%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  cursor: pointer;
}
.popup a.btn-close {
  position: absolute;
  display: block;
  top: 3.0456852792%;
  left: 1.1428571429%;
  width: 50px;
  height: 50px;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/btn_box-back.png?20241213);
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 9;
}
@media only screen and (max-width: 798px) {
  .popup a.btn-close {
    width: 35px;
    height: 35px;
  }
}
@media only screen and (max-height: 798px) {
  .popup a.btn-close {
    width: 35px;
    height: 35px;
  }
}

/* ================= table設定 ================= */
.table tr td, .table tr th {
  border: 1px solid #897ecf;
}

.table {
  font-family: "Helvetica Neue", "微軟正黑體", "Helvetica", "Arial", "PingFangTC-Light", "STHeitiTC-Light", "Microsoft JhengHei", sans-serif;
  font-size: 1em;
  border-collapse: collapse;
  border-radius: 5px;
  color: #532a08;
  border: 3px solid #897ecf;
  margin: 0 0 20px 0;
}
@media screen and (max-width: 768px) {
  .table {
    font-size: 0.85em;
  }
}
.table tr {
  background: transparent;
}
.table tr th {
  position: relative;
  background: -webkit-gradient(linear, left bottom, left top, from(#0c235e), to(#113082));
  background: linear-gradient(to top, #0c235e 0%, #113082 100%);
  color: #fff;
}
.table tr th.thStyle02 {
  color: #752b00;
  background: #ffec80;
}
@media screen and (max-width: 768px) {
  .table tr th {
    font-size: 0.9em;
  }
}
.table tr td {
  text-align: center;
  padding: 3px;
  color: #fff;
  /*單格變色*/
}
.table tr td p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.table tr td img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}
.table tr td img.img-inline {
  width: 4em;
  display: inline;
  margin: 0;
}
.table tr td[data-tdstyle=style01] {
  background-color: #f6f6f6;
}
.table tr .th-header {
  color: #ffe72b;
}

/* ================= item__box ================= */
.item__box {
  background: rgba(0, 0, 0, 0.3);
  border: 0;
  border-radius: 0;
  border: 1px solid #897ecf;
  margin: 0 auto;
}
.item__box p {
  width: 100%;
  line-height: 1.25em;
}
.item__box .item__box-title {
  background: -webkit-gradient(linear, left top, right top, from(#6759c1), color-stop(20%, #897ecf), color-stop(80%, #897ecf), to(#6759c1));
  background: linear-gradient(to right, #6759c1 0%, #897ecf 20%, #897ecf 80%, #6759c1 100%);
  color: #fff;
}
.item__box .item__box-title img {
  display: block;
  margin: 0 auto;
}
.item__box .item__box-img {
  max-width: 80%;
  margin: 0 auto;
  border-radius: 0;
}
.item__box .item__box-get {
  text-align: center;
  color: #ff9100;
  font-weight: bold;
}
.item__box .item__box-get .plus {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.item__box .item__box-text {
  text-align: left;
}
.item__box .item__box--02 {
  background: rgba(0, 0, 0, 0.3);
  border: 0;
  border-radius: 0;
  -webkit-box-shadow: inset 0 0 5px 1px #2a3780;
          box-shadow: inset 0 0 5px 1px #2a3780;
  height: 100%;
}
.item__box .item__box--02 .item__box-title {
  background: -webkit-gradient(linear, left top, right top, from(#223188), color-stop(20%, #2c40b1), color-stop(80%, #2c40b1), to(#223188));
  background: linear-gradient(to right, #223188 0%, #2c40b1 20%, #2c40b1 80%, #223188 100%);
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.item__box .item__box--02 .f-danger {
  color: #ffcd28;
}
.item__box .questionBtn {
  width: 25px;
  height: 26px;
  position: absolute;
  top: 6px;
  left: 6px;
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/icon.png);
  background-size: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 420px) {
  .item__box .questionBtn {
    width: 30px;
    height: 30px;
  }
}
.item__box .questionBtn .tooltip {
  display: none;
  position: absolute;
  width: 17em;
  top: 30px;
  left: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(#ddf1ff), to(#adecff));
  background: linear-gradient(to bottom, #ddf1ff 0%, #adecff 100%);
  border: 2px solid #004297;
  -webkit-box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
          box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
  border-radius: 10px;
  z-index: 1;
  overflow: hidden;
  font-size: calc(10px + (16 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 16 / 1400 * 100vw, 16px);
}
@media (min-aspect-ratio: 16/9) {
  .item__box .questionBtn .tooltip {
    font-size: calc(10px + (16 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 16 / 788 * 100vh, 16px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .item__box .questionBtn .tooltip {
    line-height: 1.25em;
    font-size: calc(10px + (8 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 8 / 1400 * 100vh, 8px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .item__box .questionBtn .tooltip {
    line-height: 1.5em;
    font-size: calc(10px + (16 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 16 / 788 * 100vw, 16px);
  }
}
@media (min-aspect-ratio: 16/9) {
  .item__box .questionBtn .tooltip {
    font-size: clamp(12px, 2.0304568528 + vh, 16px);
  }
}
.item__box .questionBtn .tooltip h5 {
  background: -webkit-gradient(linear, left top, left bottom, from(#004297), to(#0070bb));
  background: linear-gradient(to bottom, #004297 0%, #0070bb 100%);
  font-size: 1.2em !important;
  line-height: 1.5em;
  padding: 4px;
  margin-bottom: 0;
  color: #fff;
  text-align: center;
}
.item__box .questionBtn .tooltip ul.probability {
  width: calc(100% - 16px);
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  list-style: none;
  padding: 4px 0;
}
.item__box .questionBtn .tooltip ul.probability li {
  font-size: 1em !important;
  line-height: 1.75em;
  padding: 0 0.6825938567%;
  color: #004297;
  border-bottom: 1px solid #004297;
  position: relative;
}
.item__box .questionBtn .tooltip ul.probability li:nth-child(odd) {
  width: calc(100% - 4em);
  text-align: left;
}
.item__box .questionBtn .tooltip ul.probability li:nth-child(even) {
  width: 4em;
  text-align: right;
}
.item__box .questionBtn .tooltip ul.probability li:nth-last-child(-1n+2) {
  border-bottom: 0;
}
.item__box .questionBtn:hover .tooltip {
  display: inline-block;
}

.game__main__text {
  background-image: url(/Action/11_Star31/20241218MU/ingame/images/text_use.png?v=#20241213);
  width: 28.5714285714%;
  height: 4.9492385787%;
  position: absolute;
  bottom: 3.0456852792%;
  right: 1%;
  background-size: auto 100%;
  background-repeat: no-repeat;
}

body.swal2-shown .swal2-popup {
  position: relative;
  background: #ffa052;
  overflow: hidden;
  -webkit-box-shadow: 0 0 2px #301e10, 0 0 5px rgb(0, 0, 0), inset 0 0 5px rgb(0, 0, 0);
          box-shadow: 0 0 2px #301e10, 0 0 5px rgb(0, 0, 0), inset 0 0 5px rgb(0, 0, 0);
  border-radius: 20px;
}
body.swal2-shown .swal2-popup .swal2-content {
  color: #3a281f;
  font-weight: bolder;
}
body.swal2-shown .swal2-popup .swal2-content img {
  vertical-align: middle;
  max-width: 60px;
}
body.swal2-shown .swal2-popup .swal2-actions {
  margin-top: 0.6em;
}
body.swal2-shown .swal2-popup .swal2-actions .swal2-confirm {
  background: -webkit-gradient(linear, left top, left bottom, from(#ffa052), color-stop(5%, #ffa55c), color-stop(#ff953d), color-stop(80%, #ff8929), to(#ff7300));
  background: linear-gradient(to bottom, #ffa052 0%, #ffa55c 5%, #ff953d, #ff8929 80%, #ff7300 100%);
  -webkit-box-shadow: 0 0 2px #ff7300, inset 0 0 5px #ff7300;
          box-shadow: 0 0 2px #ff7300, inset 0 0 5px #ff7300;
  border-radius: 0.45em;
  color: #fff;
}
body.swal2-shown .swal2-popup::before {
  content: "";
  position: absolute;
  top: -125%;
  left: -28%;
  width: 250%;
  height: 600%;
  background: repeating-linear-gradient(#ffa052 0%, #ffa052 7.5px, #ff7300 7.5px, #ff7300 15px, #ffa052 15px, #ffa052 22.5px, #ff7300 22.5px, #ff7300 30px);
  -webkit-transform: translateX(-20%) translateY(-20%) rotate(-45deg);
          transform: translateX(-20%) translateY(-20%) rotate(-45deg);
  -webkit-animation: animate 40s linear infinite;
          animation: animate 40s linear infinite;
}
body.swal2-shown .swal2-popup::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  background: #fffaf2;
  -webkit-box-shadow: 0 0 2px #d66100, 0 0 5px rgb(0, 0, 0), inset 0 0 5px rgb(0, 0, 0);
          box-shadow: 0 0 2px #d66100, 0 0 5px rgb(0, 0, 0), inset 0 0 5px rgb(0, 0, 0);
  border-radius: 10px;
}

@-webkit-keyframes animate {
  from {
    background-position: 0;
  }
  to {
    background-position: 0 450px;
  }
}

@keyframes animate {
  from {
    background-position: 0;
  }
  to {
    background-position: 0 450px;
  }
}