@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;
  box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

img {
  max-width: 100%;
  -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-color: #000000;
}

.ingame__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/ingamebg.jpg?20241113);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background-position: center;
  background-size: 100%;
}
@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 123.125%;
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .ingame__wrapper {
    background-size: auto 123.125%;
  }
}

.ingame__container {
  width: 100%;
  height: 100%;
  position: relative;
}
@media (max-aspect-ratio: 16/9) {
  .ingame__container {
    width: 98.3333333333vw;
    height: 56.25vw;
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .ingame__container {
    width: 98.3333333333vh;
    height: 56.25vh;
  }
}
@media (min-aspect-ratio: 16/9) {
  .ingame__container {
    width: 167.8222222222vh;
    width: calc(var(--vh, 1vh) * 170.67);
    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.6666666667vw;
    height: 96vw;
    top: -2vh;
  }
}

.member {
  position: absolute;
  font-family: Verdana, sans-serif;
  font-size: 16px;
  color: #fff;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/member_bg.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  text-align: center;
  width: 83.3333333333%;
  height: 10.2777777778%;
  left: 50%;
  top: -0.8%;
  transform: translateX(-50%);
  display: flex;
  justify-content: space-around;
  align-items: center;
  z-index: 1;
}
@media screen and (max-width: 513px) {
  .member {
    top: 0%;
  }
}
.member__table {
  width: 45%;
  height: 63.0630630631%;
  display: flex;
  align-items: center;
  padding-left: 1.25%;
}
@media (min-width: 420px) {
  .member__table {
    width: 22.5%;
    height: 63.0630630631%;
  }
}
.member__table .vip-icon0 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v0_S.png);
}
.member__table .vip-icon {
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 8.3333333333%;
  height: 97.1428571429%;
  margin-right: 1.1428571429%;
}
@media (min-width: 420px) {
  .member__table .vip-icon {
    width: 16.6666666667%;
  }
}
.member__table .vip-icon1 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v0_1.png);
}
.member__table .vip-icon13 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v11Plus.png);
}
.member__table .vip-icon2 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v1.png);
}
.member__table .vip-icon3 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v2.png);
}
.member__table .vip-icon4 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v3.png);
}
.member__table .vip-icon5 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v4.png);
}
.member__table .vip-icon6 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v5.png);
}
.member__table .vip-icon7 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v6.png);
}
.member__table .vip-icon8 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v7.png);
}
.member__table .vip-icon9 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v8.png);
}
.member__table .vip-icon10 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v9.png);
}
.member__table .vip-icon11 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v10.png);
}
.member__table .vip-icon12 {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/member/v11.png);
}
.member__table .nickname {
  font-weight: bold;
  color: #fff;
  line-height: 1.5em;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.35);
  font-size: calc(6px + (35 - 6) * (100vw - 768px) / 832);
  font-size: clamp(6px, 35 / 1920 * 100vw, 35px);
}
@media (min-aspect-ratio: 16/9) {
  .member__table .nickname {
    font-size: calc(6px + (35 - 6) * (100vh - 350px) / 730);
    font-size: clamp(6px, 35 / 1080 * 100vh, 35px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .member__table .nickname {
    line-height: 1.25em;
    font-size: calc(6px + (27 - 6) * (100vh - 350px) / 730);
    font-size: clamp(6px, 27 / 1920 * 100vh, 27px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .member__table .nickname {
    line-height: 1.5em;
    font-size: calc(6px + (35 - 6) * (100vw - 350px) / 1570);
    font-size: clamp(6px, 35 / 1080 * 100vw, 35px);
  }
}
.member__coins-props {
  width: 50.625%;
  height: 63.0630630631%;
  background: rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 3px #2693ff;
  border-radius: 35px;
  margin: 0 0.625% 0 0;
  font-size: calc(10px + 22 * (100vw - 600px) / 1320);
  font-size: clamp(10px, 1.6666666667 + vw, 32px);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
@media (min-width: 420px) {
  .member__coins-props {
    width: 21.25%;
  }
}
@media (min-aspect-ratio: 16/9) {
  .member__coins-props {
    font-size: clamp(10px, 2.962962963 + vh, 32px);
  }
}
.member__coins-props p {
  width: 88.8888888889%;
}
@media (min-width: 420px) {
  .member__coins-props p {
    width: 73.5294117647%;
  }
}
.member__coins-props::before {
  content: "";
  width: 5.6790123457%;
  height: 65.7142857143%;
  background: url(/Action/11_Star31/20241120M04/ingame/images/member/coin_game.png);
  background-size: 100% !important;
  background-repeat: no-repeat;
  display: block;
  position: relative;
  margin-right: 0.4938271605%;
}
@media (min-width: 420px) {
  .member__coins-props::before {
    width: 13.5294117647%;
    margin-right: 1.1764705882%;
  }
}
.member__status {
  width: 51.875%;
  height: 63.0630630631%;
  margin-left: 0;
  display: none;
  justify-content: center;
  align-items: center;
}
@media (min-width: 420px) {
  .member__status {
    display: flex;
  }
}
.member .vip-info {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
}
.member .vip-info .coins-i,
.member .vip-info .coins-diamonds {
  width: 46.3855421687%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 3px #2693ff;
  border-radius: 35px;
  margin: 0 0.625%;
  font-size: calc(10px + 22 * (100vw - 600px) / 1320);
  font-size: clamp(10px, 1.6666666667 + vw, 32px);
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-aspect-ratio: 16/9) {
  .member .vip-info .coins-i,
  .member .vip-info .coins-diamonds {
    font-size: clamp(10px, 2.962962963 + vh, 32px);
  }
}
.member .vip-info .coins-i p,
.member .vip-info .coins-diamonds p {
  width: 84.4155844156%;
  font-size: calc(10px + 22 * (100vw - 600px) / 1320);
  font-size: clamp(10px, 1.6666666667 + vw, 32px);
}
@media (min-aspect-ratio: 16/9) {
  .member .vip-info .coins-i p,
  .member .vip-info .coins-diamonds p {
    font-size: clamp(10px, 2.962962963 + vh, 32px);
  }
}
.member .vip-info .coins-i::before,
.member .vip-info .coins-diamonds::before {
  content: "";
  background-size: 100% !important;
  display: block;
  position: relative;
  margin-right: 1.038961039%;
}
.member .vip-info .coins-i::before {
  width: 11.4285714286%;
  height: 65.7142857143%;
  background: url(/Action/11_Star31/20241120M04/ingame/images/member/coin_i.png);
}
.member .vip-info .coins-diamonds::before {
  width: 12.4675324675%;
  height: 55.7142857143%;
  background: url(/Action/11_Star31/20241120M04/ingame/images/member/coin_diamonds.png);
}
.member .vip-info .coins-i::before {
  content: "";
  width: 11.4285714286%;
  height: 65.7142857143%;
  background: url(/Action/11_Star31/20241120M04/ingame/images/member/coin_i.png);
  background-size: 100%;
  display: block;
  position: relative;
  margin-right: 1.038961039%;
}

.gamemain {
  width: 90%;
  height: 98.5185185185%;
  position: absolute;
  top: 13.1481481481%;
  left: 5%;
}
.gamemain::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/gameBox_BG.png?20241113);
  background-size: 100%;
  background-repeat: no-repeat;
}

@media (min-width: 1619px) {
  .gamemain {
    top: 12.962962963%;
  }
}
@media (min-width: 696px) and (max-width: 1618px) {
  .gamemain {
    top: 10.6481481481%;
  }
}
@media (max-width: 697px) {
  .gamemain {
    top: 11.2962962963%;
  }
}
@keyframes gamemainBg {
  0%, 100% {
    filter: hue-rotate(0) brightness(1.2);
  }
  50% {
    filter: hue-rotate(-30deg) brightness(0.8);
  }
}
.gamemain_awards ul.awardslist > li:nth-child(24), .gamemain_awards ul.awardslist > li:nth-child(23), .gamemain_awards ul.awardslist > li:nth-child(22), .gamemain_awards ul.awardslist > li:nth-child(21), .gamemain_awards ul.awardslist > li:nth-child(19), .gamemain_awards ul.awardslist > li:nth-child(18), .gamemain_awards ul.awardslist > li:nth-child(16), .gamemain_awards ul.awardslist > li:nth-child(14), .gamemain_awards ul.awardslist > li:nth-child(12), .gamemain_awards ul.awardslist > li:nth-child(11), .gamemain_awards ul.awardslist > li:nth-child(10), .gamemain_awards ul.awardslist > li:nth-child(9), .gamemain_awards ul.awardslist > li:nth-child(7), .gamemain_awards ul.awardslist > li:nth-child(6), .gamemain_awards ul.awardslist > li:nth-child(4), .gamemain_awards ul.awardslist > li:nth-child(2) {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/awardbg3.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(22)::before, .gamemain_awards ul.awardslist > li:nth-child(10)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award6.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(19)::before, .gamemain_awards ul.awardslist > li:nth-child(7)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award7.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(24)::before, .gamemain_awards ul.awardslist > li:nth-child(12)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award8.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(16)::before, .gamemain_awards ul.awardslist > li:nth-child(4)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award9.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(21)::before, .gamemain_awards ul.awardslist > li:nth-child(9)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award10.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(23)::before, .gamemain_awards ul.awardslist > li:nth-child(11)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award11.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(14)::before, .gamemain_awards ul.awardslist > li:nth-child(2)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award12.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(18)::before, .gamemain_awards ul.awardslist > li:nth-child(6)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/award13.png?20241113);
}

.gamemain_awards ul.awardslist > li:nth-child(20), .gamemain_awards ul.awardslist > li:nth-child(13), .gamemain_awards ul.awardslist > li:nth-child(8), .gamemain_awards ul.awardslist > li:nth-child(1) {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/awardbg2.png?20241113);
}
.gamemain_awards ul.awardslist > li.action:nth-child(20)::before, .gamemain_awards ul.awardslist > li.action:nth-child(13)::before, .gamemain_awards ul.awardslist > li.action:nth-child(8)::before, .gamemain_awards ul.awardslist > li.action:nth-child(1)::before {
  background-size: 67% auto !important;
  background-repeat: no-repeat;
}
.gamemain_awards ul.awardslist > li:nth-child(20)::before, .gamemain_awards ul.awardslist > li:nth-child(13)::before, .gamemain_awards ul.awardslist > li:nth-child(8)::before, .gamemain_awards ul.awardslist > li:nth-child(1)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/prize/award5.png?20241113);
  background-size: 67% auto;
  background-repeat: no-repeat;
  background-position-x: 45%;
}

.gamemain_awards ul.awardslist > li:nth-child(17), .gamemain_awards ul.awardslist > li:nth-child(15), .gamemain_awards ul.awardslist > li:nth-child(5), .gamemain_awards ul.awardslist > li:nth-child(3) {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/awardBg1.png?20241113);
}

.gamemain_awards ul.awardslist > li.action:nth-child(3)::before {
  background-size: 60% auto !important;
  background-repeat: no-repeat;
}
.gamemain_awards ul.awardslist > li:nth-child(3)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/prize/award1.png?20241113);
  background-size: 60% auto;
  background-repeat: no-repeat;
  background-position-x: 50%;
  background-position-y: 42%;
}

.gamemain_awards ul.awardslist > li.action:nth-child(5)::before {
  background-size: 60% auto !important;
  background-repeat: no-repeat;
}
.gamemain_awards ul.awardslist > li:nth-child(5)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/prize/award2.png?20241113);
  background-size: 60% auto;
  background-repeat: no-repeat;
  background-position-x: 50%;
  background-position-y: 42%;
}

.gamemain_awards ul.awardslist > li.action:nth-child(15)::before {
  background-size: 60% auto !important;
  background-repeat: no-repeat;
}
.gamemain_awards ul.awardslist > li:nth-child(15)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/prize/award3.png?20241113);
  background-size: 60% auto;
  background-repeat: no-repeat;
  background-position-x: 50%;
  background-position-y: 42%;
}

.gamemain_awards ul.awardslist > li.action:nth-child(17)::before {
  background-size: 60% auto !important;
  background-repeat: no-repeat;
}
.gamemain_awards ul.awardslist > li:nth-child(17)::before {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/prize/award4.png?20241113);
  background-size: 60% auto;
  background-repeat: no-repeat;
  background-position-x: 50%;
  background-position-y: 42%;
}

.gamemain_awards {
  width: 84.2714074074%;
  height: 71.3530827068%;
  position: absolute;
  top: 2.537593985%;
  left: 7.8781481481%;
}
.gamemain_awards ul.awardslist {
  width: 100%;
  height: 100%;
  list-style-type: none;
  position: relative;
}
.gamemain_awards ul.awardslist > li {
  width: 12.5%;
  height: 16.6666666667%;
  position: absolute;
  background-size: 100% !important;
  background-repeat: no-repeat !important;
}
.gamemain_awards ul.awardslist > li:nth-child(1) {
  top: 0;
  left: 0%;
}
.gamemain_awards ul.awardslist > li:nth-child(2) {
  top: 0;
  left: 12.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(3) {
  top: 0;
  left: 25%;
}
.gamemain_awards ul.awardslist > li:nth-child(4) {
  top: 0;
  left: 37.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(5) {
  top: 0;
  left: 50%;
}
.gamemain_awards ul.awardslist > li:nth-child(6) {
  top: 0;
  left: 62.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(7) {
  top: 0;
  left: 75%;
}
.gamemain_awards ul.awardslist > li:nth-child(8) {
  top: 0;
  left: 87.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(9) {
  top: 16.6666666667%;
  right: 0;
}
.gamemain_awards ul.awardslist > li:nth-child(10) {
  top: 33.3333333333%;
  right: 0;
}
.gamemain_awards ul.awardslist > li:nth-child(11) {
  top: 50%;
  right: 0;
}
.gamemain_awards ul.awardslist > li:nth-child(12) {
  top: 66.6666666667%;
  right: 0;
}
.gamemain_awards ul.awardslist > li:nth-child(13) {
  bottom: 0;
  right: 0%;
}
.gamemain_awards ul.awardslist > li:nth-child(14) {
  bottom: 0;
  right: 12.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(15) {
  bottom: 0;
  right: 25%;
}
.gamemain_awards ul.awardslist > li:nth-child(16) {
  bottom: 0;
  right: 37.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(17) {
  bottom: 0;
  right: 50%;
}
.gamemain_awards ul.awardslist > li:nth-child(18) {
  bottom: 0;
  right: 62.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(19) {
  bottom: 0;
  right: 75%;
}
.gamemain_awards ul.awardslist > li:nth-child(20) {
  bottom: 0;
  right: 87.5%;
}
.gamemain_awards ul.awardslist > li:nth-child(21) {
  bottom: 16.6666666667%;
  left: 0;
}
.gamemain_awards ul.awardslist > li:nth-child(22) {
  bottom: 33.3333333333%;
  left: 0;
}
.gamemain_awards ul.awardslist > li:nth-child(23) {
  bottom: 50%;
  left: 0;
}
.gamemain_awards ul.awardslist > li:nth-child(24) {
  bottom: 66.6666666667%;
  left: 0;
}
.gamemain_awards ul.awardslist > li::before, .gamemain_awards ul.awardslist > li::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-size: 100%;
}
.gamemain_awards ul.awardslist > li.action::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  background-size: 100% !important;
  transform: scale(1.1);
}
.gamemain_awards ul.awardslist > li.action::after {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/awardBgBefore.png?20241113);
  background-repeat: no-repeat;
}
.gamemain_awards ul.awardslist > li.get::before {
  content: "";
  display: block;
  width: 34.8101265823%;
  height: 55.1020408163%;
  position: absolute;
  top: 24.4897959184%;
  left: 34.1772151899%;
  background-size: 100% !important;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/Tick.png);
}
.gamemain_awards ul.awardslist > li .tooltip-question {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
}
.gamemain_awards ul.awardslist > li .tooltip-question .tooltip {
  display: none;
  position: absolute;
  width: 18em;
  top: -1em;
  left: 70%;
  background: linear-gradient(to bottom, #fdcef3 0%, #fdceeb 100%);
  border: 2px solid #93065c;
  box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
  border-radius: 10px;
  z-index: 5;
  overflow: hidden;
  font-size: calc(10px + (18 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 18 / 1920 * 100vw, 18px);
}
@media (min-aspect-ratio: 16/9) {
  .gamemain_awards ul.awardslist > li .tooltip-question .tooltip {
    font-size: calc(10px + (18 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 18 / 1080 * 100vh, 18px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .gamemain_awards ul.awardslist > li .tooltip-question .tooltip {
    line-height: 1.25em;
    font-size: calc(10px + (10 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 10 / 1920 * 100vh, 10px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .gamemain_awards ul.awardslist > li .tooltip-question .tooltip {
    line-height: 1.5em;
    font-size: calc(10px + (18 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 18 / 1080 * 100vw, 18px);
  }
}
.gamemain_awards ul.awardslist > li .tooltip-question .tooltip h5 {
  background: linear-gradient(to bottom, #930674 0%, #93065c 100%);
  font-size: 1.125em;
  line-height: 1.2em;
  padding: 2px;
  margin-bottom: 0;
  color: #fff;
  text-align: center;
  white-space: nowrap;
}
.gamemain_awards ul.awardslist > li .tooltip-question .tooltip ul.probability {
  width: calc(100% - 16px);
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  list-style: none;
  padding: 2px 0;
}
.gamemain_awards ul.awardslist > li .tooltip-question .tooltip ul.probability li {
  width: 100%;
  font-size: 1em;
  line-height: 1.75em;
  padding: 0 2px;
  color: #930674;
  border-bottom: 1px solid #FBA0E7;
  text-align: center;
  white-space: nowrap;
}
.gamemain_awards ul.awardslist > li .tooltip-question .tooltip ul.probability li:nth-last-child(-1n+1) {
  border-bottom: 0;
}
.gamemain_awards ul.awardslist > li .tooltip-question:hover .tooltip {
  display: inline-block;
}
.gamemain_awards ul.awardslist > li:nth-child(n+8) .tooltip-question .tooltip {
  left: initial;
  right: 70%;
}
.gamemain_awards ul.awardslist > li:nth-child(n+14) .tooltip-question .tooltip {
  left: 70%;
}
.gamemain_awards ul.awardslist > li:nth-child(n+14) .tooltip-question .tooltip.tooltip2 {
  left: initial;
  right: 70% !important;
}
.gamemain_awards__info {
  width: 75%;
  height: 66.6666666667%;
  position: absolute;
  top: 18.3168316832%;
  left: 12.5%;
}
.gamemain_awards__info .info-title {
  width: 66.100360036%;
  height: 96.9471947195%;
  position: absolute;
  top: 0%;
  left: 1.8751875188%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/gameBox_title.png?20241113);
  background-size: 100%;
  background-repeat: no-repeat;
  transform-origin: 90% 38%;
  animation: infoTitle 4s infinite;
}
.gamemain_awards__info .info-luckybag {
  width: 34.6909690969%;
  height: 100%;
  position: absolute;
  top: -7%;
  left: 63.0060006001%;
  z-index: 2;
}
.gamemain_awards__info .info-luckybag__img {
  width: 93.714286%;
  height: 58.549505%;
  position: absolute;
  top: 17.438944%;
  left: 1%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/gameBox_luckyBag.png?20241113);
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 3;
  animation: luckybag 5s infinite;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 4;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question .tooltip {
  display: none;
  position: absolute;
  width: 12em;
  top: -2em;
  left: 29%;
  background: linear-gradient(to bottom, #fdcef3 0%, #fdceeb 100%);
  border: 2px solid #93065c;
  box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
  border-radius: 10px;
  z-index: 5;
  overflow: hidden;
  font-size: calc(12px + 4 * (100vw - 600px) / 1320);
  font-size: clamp(12px, 0.8333333333 + vw, 16px);
}
@media (orientation: portrait) {
  .gamemain_awards__info .info-luckybag__img .tooltip-question .tooltip {
    font-size: calc(12px + 4 * (100vh - 350px) / 850);
    font-size: clamp(12px, 1.4814814815 + vh, 16px);
  }
}
@media (min-aspect-ratio: 16/9) {
  .gamemain_awards__info .info-luckybag__img .tooltip-question .tooltip {
    font-size: calc(12px + 4 * (100vh - 350px) / 850);
    font-size: clamp(12px, 1.4814814815 + vh, 16px);
  }
}
.gamemain_awards__info .info-luckybag__img .tooltip-question .tooltip h5 {
  background: linear-gradient(to bottom, #930674 0%, #93065c 100%);
  font-size: 1.125em;
  line-height: 1.5em;
  padding: 2px;
  margin-bottom: 0;
  color: #fff;
  text-align: center;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question .tooltip ul.probability {
  width: calc(100% - 16px);
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  list-style: none;
  padding: 2px 0;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question .tooltip ul.probability li {
  width: 100%;
  font-size: 1em;
  line-height: 1.75em;
  padding: 0 2px;
  color: #930674;
  border-bottom: 1px solid #FBA0E7;
  text-align: center;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question .tooltip ul.probability li:nth-last-child(-1n+1) {
  border-bottom: 0;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question:hover .tooltip {
  display: inline-block;
}
.gamemain_awards__info .info-luckybag__num {
  width: 100%;
  height: 7.2194719472%;
  position: absolute;
  top: 74.2574257426%;
  left: 0%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.gamemain_awards__info .info-luckybag__num::before {
  content: "";
  display: inline-block;
  width: 52.7027027027%;
  height: 91.4285714286%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/accumulation.png?20241113);
  background-size: 100%;
  background-repeat: no-repeat;
}
.gamemain_awards__info .info-luckybag__num .words {
  width: 47.2972972973%;
  height: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.gamemain_awards__info .info-luckybag__num .words .nums {
  width: 100%;
  height: 100%;
  position: relative;
}
.gamemain_awards__info .info-luckybag__num .words .nums ul {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  list-style: none;
}
.gamemain_awards__info .info-luckybag__num .words .nums ul li {
  width: 13.7142857143%;
  height: 88.5714285714%;
  background-size: auto 100% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-repeat: no-repeat;
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-0 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_0.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-1 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_1.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-2 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_2.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-3 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_3.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-4 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_4.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-5 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_5.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-6 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_6.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-7 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_7.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-8 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_8.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-9 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_9.png);
}
.gamemain_awards__info .info-luckybag__num .words .nums .num-slash {
  width: 12.5714285714%;
  height: 100%;
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_slash.png);
}
.gamemain_awards__info .info-luckybag__btn {
  width: 51.3513513514%;
  height: 12.995049505%;
  position: absolute;
  top: 83.5396039604%;
  left: 24.3243243243%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_receive.png?20241113);
  background-size: 100%;
  animation: luckybagbtn 1s infinite;
  cursor: pointer;
  z-index: 1;
}
.gamemain_awards__info .info-luckybag__btn:hover {
  filter: brightness(1.2);
  animation: none;
}
.gamemain_awards__info .info-luckybag__btn.btn-off {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_receive-off.png?20241113);
  animation: none;
}
.gamemain_awards__info .info-luckybag__btn.btn-off:hover {
  filter: brightness(1);
}

@keyframes infoTitle {
  0%, 20%, 100% {
    transform: rotate(0deg);
  }
  10% {
    transform: rotate(2deg);
  }
  5% {
    transform: rotate(-3deg);
  }
  15% {
    transform: rotate(-1deg);
  }
}
@keyframes luckybag {
  0%, 100% {
    filter: brightness(1.2) drop-shadow(0 0 0px #E65DB8);
  }
  50% {
    filter: brightness(1) drop-shadow(0 0 5px #E65DB8);
  }
}
@keyframes luckybagbtn {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.07);
  }
}
.gamemain_action {
  width: 92.5925925926%;
  height: 14.0977443609%;
  position: absolute;
  top: 74.530075188%;
  left: 3.7037037037%;
}
.gamemain_action .btn__question {
  width: 5.625%;
  height: 60%;
  position: absolute;
  left: 10.625%;
  bottom: 3%;
  background: url(/Action/11_Star31/20241120M04/ingame/images/btn_question.png?20241113);
  background-repeat: no-repeat;
  background-size: 100%;
  cursor: pointer;
}
.gamemain_action .btn__record {
  width: 5.625%;
  height: 60%;
  position: absolute;
  left: 17.5625%;
  bottom: 3%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_record.png?20241113);
  background-repeat: no-repeat;
  background-size: 100%;
  cursor: pointer;
}
.gamemain_action .btn__store {
  width: 9.375%;
  height: 100%;
  position: absolute;
  left: 0.6875%;
  bottom: 3%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_buy.png?20241113);
  background-repeat: no-repeat;
  background-size: 100%;
  cursor: pointer;
}
.gamemain_action .btn_use_all {
  width: 22.5%;
  height: 83.3333333333%;
  position: absolute;
  top: 6.6666666667%;
  left: 26.625%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_all.png?20241113);
  background-size: 100%;
  cursor: pointer;
  animation: playbtn 2s infinite;
}
.gamemain_action .btn_use_all:hover {
  height: 80%;
  top: 10%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_all_hover.png?20241113);
  filter: brightness(1.25) saturate(1.3) hue-rotate(8deg);
  animation: initial;
}
.gamemain_action .btn_use_one {
  width: 22.5%;
  height: 83.3333333333%;
  position: absolute;
  top: 6.6666666667%;
  left: 50.3125%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_one.png?20241113);
  background-size: 100%;
  cursor: pointer;
  filter: brightness(1.1) saturate(1.1) hue-rotate(8deg);
}
.gamemain_action .btn_use_one:hover {
  height: 80%;
  top: 10%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn_one_hover.png?20241113);
  filter: brightness(1.2) saturate(1.3) hue-rotate(8deg);
  animation: initial;
}
.gamemain_action .text1 {
  width: 20.5625%;
  height: 88%;
  position: absolute;
  top: 10.6666666667%;
  left: 74.75%;
}
.gamemain_action .text1 .text_prompt {
  width: 96.6565349544%;
  height: 40.1515151515%;
  position: absolute;
  top: 27.2727272727%;
  left: 7.5987841945%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/text_prompt.png?20241113);
  background-size: auto 100%;
  background-repeat: no-repeat;
}
.gamemain_action .text2 {
  width: 20.5625%;
  height: 88%;
  position: absolute;
  top: 10.6666666667%;
  left: 74.75%;
}
.gamemain_action .text2 .text_prompt {
  width: 92.7051671733%;
  height: 38.6363636364%;
  position: absolute;
  top: -6.0606060606%;
  left: 2.4316109422%;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/text_prompt.png?20241113);
  background-size: auto 100%;
  background-repeat: no-repeat;
}
.gamemain_action .text2 .text_use {
  width: 100%;
  height: 54.5454545455%;
  position: absolute;
  top: 36.3636363636%;
  left: 0;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/text_use.png?20241113);
  background-size: auto 100%;
  background-repeat: no-repeat;
}

@keyframes playbtn {
  0%, 100% {
    filter: brightness(1.1);
  }
  50% {
    filter: brightness(1.25) saturate(1.2) drop-shadow(0 -3px 5px rgba(255, 243, 135, 0.5));
  }
}
.ingame__popup--bg {
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.84);
  z-index: 3;
  visibility: hidden;
}

.popup {
  top: 0;
  left: 0;
  position: absolute;
  z-index: 999;
  width: 100%;
  height: 100%;
  overflow: hidden;
  visibility: hidden;
}
.popup-base {
  width: 83.75%;
  height: 83.2407407407%;
  position: absolute;
  top: 7.5%;
  left: 7.34375%;
  background: linear-gradient(to top, rgb(49, 7, 7) 0%, rgba(138, 6, 6, 0.7) 100%);
  border: 3px solid #eab92d;
  border-radius: 16px;
  color: #FFF;
  line-height: 1.5em;
  padding: 1.4814814815% 0.8333333333% 1.4814814815% 1.25%;
  overflow: hidden;
  z-index: 1;
  visibility: hidden;
}
.popup-base h2 {
  color: #ddb689;
  letter-spacing: 5px;
  padding-bottom: 0.4975124378%;
  text-align: center;
  font-weight: inherit;
  font-size: calc(18px + 24 * (60vh - 350px) / 850);
  z-index: 2;
}
@media (orientation: portrait) {
  .popup-base h2 {
    font-size: calc(18px + 24 * (40vh - 350px) / 850);
  }
}
@media (min-aspect-ratio: 16/9) {
  .popup-base h2 {
    font-size: clamp(18px, 2.962962963 + vh, 32px);
  }
}
.popup-base h2 .f-sm {
  font-size: 0.75em;
  letter-spacing: 0px;
}
.popup-base .line {
  width: 80%;
  height: 2px;
  margin: 0 auto;
  background: linear-gradient(to right, rgba(156, 94, 21, 0) 0%, rgb(156, 94, 21) 20%, rgb(255, 187, 41) 50%, rgb(156, 94, 21) 80%, rgba(156, 94, 21, 0) 100%);
  margin-bottom: 0.9950248756%;
}
.popup-base .main {
  width: 100%;
  height: calc(100% - (1.5rem + 2px + 8px));
  margin: 0 auto;
  overflow-y: scroll;
  padding: 8px 2em;
  font-size: calc(14px + 4 * (100vw - 600px) / 1320);
  font-size: clamp(14px, 0.9375 + vw, 18px);
  z-index: 2;
}
@media (orientation: portrait) {
  .popup-base .main {
    font-size: calc(14px + 4 * (100vh - 350px) / 850);
    font-size: clamp(12px, 1.6666666667 + vh, 18px);
  }
}
@media (min-aspect-ratio: 16/9) {
  .popup-base .main {
    font-size: calc(14px + 4 * (100vh - 350px) / 850);
    font-size: clamp(14px, 1.6666666667 + vh, 18px);
  }
}
.popup-base .main::-webkit-scrollbar {
  width: 10px;
  margin: 2px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 5px;
}
.popup-base .main::-webkit-scrollbar-thumb {
  width: 8px;
  padding: 2px;
  background: rgba(255, 187, 42, 0.5);
  border-radius: 5px;
}
.popup-base .main h3 {
  font-size: 1.35em;
  line-height: 2em;
  color: rgb(255, 159, 70);
}
.popup__main {
  visibility: hidden;
}
.popup .btns {
  width: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin: 2.2388059701% auto;
  position: relative;
}
.popup .btns div {
  max-width: 35%;
  cursor: pointer;
  margin: 0 4px;
}
.popup .btns .off {
  cursor: default;
}
.popup .btns .off img {
  filter: grayscale(1);
}
.popup .part {
  margin-bottom: 56px;
}
.popup .part > p,
.popup .part > ol,
.popup .part > ul,
.popup .part > h3 {
  margin-bottom: 16px;
  font-size: 1rem;
}
.popup .question .f-danger {
  color: rgb(255, 123, 0);
}
.popup .question ol {
  font-size: 1rem;
  margin: 0 auto;
  margin-left: 1em;
}
.popup .question ol li {
  padding-bottom: 8px;
}
.popup .prize .main {
  width: 93.2835820896%;
  height: calc(100% - (1.6rem + 2px) - 17.3526140156%);
  margin: 0 auto;
  overflow-y: auto;
  position: relative;
  padding: 0;
  padding-bottom: 10px;
}
.popup .prize .main .item {
  min-height: 100%;
  display: flex;
  align-items: center;
}
.popup .prize .main .item > ul {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  list-style-type: none;
  overflow: hidden;
}
.popup .prize .main .item > ul > li {
  width: 28%;
  min-width: 136px;
  margin: 8px;
  background-size: 100% !important;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  box-shadow: inset 0 0 3px #ffd970;
  padding: 1.0666666667%;
}
.popup .prize .main .item > ul > li .prizename {
  width: 100%;
  color: #fff;
  text-align: center;
  margin: 4px 0;
  font-weight: bold;
  font-size: calc(16px + 8 * (100vw - 600px) / 1324);
  font-size: clamp(16px, 1.25 + vw, 24px);
  z-index: 2;
}
@media (orientation: portrait) {
  .popup .prize .main .item > ul > li .prizename {
    font-size: calc(16px + 8 * (100vh - 350px) / 850);
    font-size: clamp(12px, 2.2222222222 + vh, 24px);
  }
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item > ul > li .prizename {
    font-size: calc(16px + 8 * (100vh - 350px) / 850);
    font-size: clamp(16px, 2.2222222222 + vh, 24px);
  }
}
.popup .prize .main .item > ul > li img {
  width: 75%;
  max-height: 300px;
  min-width: 120px;
  display: block;
  margin: 0 auto;
}
.popup .prize .main .item > ul > li .words {
  width: 100%;
  min-width: 120px;
  height: 2.1875vw;
  min-height: 25px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item > ul > li .words {
    height: 3.8888888889vh;
  }
}
.popup .prize .main .item > ul > li .words .nums {
  width: 100%;
  height: 100%;
  position: relative;
}
.popup .prize .main .item > ul > li .words .nums ul {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  list-style: none;
}
.popup .prize .main .item > ul > li .words .nums ul li {
  width: 5.7142857143%;
  min-width: 16px;
  height: 73.8095238095%;
  min-height: 20px;
  background-size: auto 100% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-repeat: no-repeat;
}
.popup .prize .main .item > ul > li .words .nums .num-0 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_0.png);
}
.popup .prize .main .item > ul > li .words .nums .num-1 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_1.png);
}
.popup .prize .main .item > ul > li .words .nums .num-2 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_2.png);
}
.popup .prize .main .item > ul > li .words .nums .num-3 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_3.png);
}
.popup .prize .main .item > ul > li .words .nums .num-4 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_4.png);
}
.popup .prize .main .item > ul > li .words .nums .num-5 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_5.png);
}
.popup .prize .main .item > ul > li .words .nums .num-6 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_6.png);
}
.popup .prize .main .item > ul > li .words .nums .num-7 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_7.png);
}
.popup .prize .main .item > ul > li .words .nums .num-8 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_8.png);
}
.popup .prize .main .item > ul > li .words .nums .num-9 {
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_9.png);
}
.popup .prize .main .item > ul > li .words .nums .num-multiply {
  width: 5.2380952381%;
  min-width: 15px;
  height: 100%;
  min-height: 25px;
  background: url(/Action/11_Star31/20241120M04/ingame/images/num/s_multiply.png);
}
.popup .prize .getBtn {
  width: 23.631840796%;
  height: 11.3459399333%;
  margin: 1.4925373134% auto;
  background-size: 100% !important;
  background: url(/Action/11_Star31/20241120M04/ingame/images/btn_agree.png?v=20241113);
  cursor: pointer;
}
.popup .bigWin {
  position: absolute;
  z-index: 999;
  width: 119.4029850746%;
  height: 120.1334816463%;
  top: -10.0111234705%;
  left: -9.7014925373%;
  background-size: 100% !important;
  overflow: hidden;
  background: url(/Action/11_Star31/20241120M04/ingame/images/big_win_bg1.png?v=20241113);
}
.popup .bigWin .main {
  width: 100%;
  width: 100%;
}
.popup .bigWin .awards {
  width: 15.625%;
  height: 27.7777777778%;
  position: absolute;
  top: 27.3148148148%;
  left: 41.4225941423%;
}
.popup .bigWin .awards img {
  width: 100%;
}
.popup .bigWin .awardslist {
  width: 66.09375%;
  height: 22.5%;
  position: absolute;
  top: 56.8518518519%;
  left: 16.9270833333%;
  background: #6d0505;
  box-shadow: inset 0 6px 6px #000000;
  border-radius: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.popup .bigWin .awardslist::before {
  content: "";
  display: block;
  background: linear-gradient(#fdff9f, #ffd152);
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 3px;
  border-radius: 20px;
  top: -3px;
  left: -3px;
  z-index: -1;
}
.popup .bigWin .awardslist img {
  display: block;
  max-width: 22%;
  max-height: 95%;
}
.popup .bigWin .chooselist {
  width: 72.9166666667%;
  height: 37.5925925926%;
  position: absolute;
  top: 33.3333333333%;
  left: 13.5416666667%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 576px) {
  .popup .bigWin .chooselist {
    width: 52.0833333333%;
    height: 26.8518518519%;
    top: 35.1851851852%;
    left: 23.9583333333%;
  }
}
.popup .bigWin .chooselist_five {
  width: 66.0416666667%;
  height: 37.962962963%;
  top: 36.1111111111%;
  left: 16.9791666667%;
}
.popup .bigWin .chooselist_five img {
  top: -16% !important;
  position: relative !important;
}
.popup .bigWin .chooselist .chooselistBox {
  width: 25%;
  height: 100%;
  margin: 0 0.1428571429%;
  transform-style: preserve-3d;
  position: relative;
  cursor: pointer;
}
@media (min-width: 576px) {
  .popup .bigWin .chooselist .chooselistBox {
    width: 25%;
  }
}
.popup .bigWin .chooselist .chooselistBox.open-on .front, .popup .bigWin .chooselist .chooselistBox.open-off .front {
  transform: rotateY(180deg);
}
.popup .bigWin .chooselist .chooselistBox.open-on .back, .popup .bigWin .chooselist .chooselistBox.open-off .back {
  transform: rotateY(0);
}
.popup .bigWin .chooselist .chooselistBox.open-off .back {
  filter: grayscale(1) brightness(0.75);
}
.popup .bigWin .chooselist .chooselistBox .front,
.popup .bigWin .chooselist .chooselistBox .back {
  width: 100%;
  height: 100%;
  position: absolute;
  margin: 0 0.1428571429%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden; /* Safari 支援 */
  transform-style: preserve-3d;
  transition: ease-in-out 0.3s;
  background-size: 100% !important;
  background-repeat: no-repeat !important;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 576px) {
  .popup .bigWin .chooselist .chooselistBox .front,
  .popup .bigWin .chooselist .chooselistBox .back {
    margin: 0 0.2%;
  }
}
.popup .bigWin .chooselist .chooselistBox .front {
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/choose.png?v=20241113);
}
.popup .bigWin .chooselist .chooselistBox .back {
  background: url(/Action/11_Star31/20241120M04/ingame/images/choose_open.png?v=20241113);
  transform: rotateY(-180deg);
}
.popup .bigWin .chooselist .chooselistBox img {
  display: block;
  width: 88%;
  top: -2%;
  position: relative;
}
.popup .bigWin .getBtn {
  width: 14.5833333333%;
  min-width: 100px;
  height: 9.2592592593%;
  min-height: 33px;
  margin: 1.25% auto;
  background: url(/Action/11_Star31/20241120M04/ingame/images/btn_receive.png?v=20241113) no-repeat;
  background-size: 100% !important;
  position: absolute;
  bottom: 11.1111111111%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 4;
  cursor: pointer;
}
@media (min-width: 576px) {
  .popup .bigWin .getBtn {
    bottom: 16.6666666667%;
    min-width: 120px;
    min-height: 40px;
  }
}
.popup a.btn-back {
  position: absolute;
  display: block;
  top: 2.2222222222%;
  left: 0.8333333333%;
  width: 50px;
  height: 50px;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn-back.png);
  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-back {
    width: 35px;
    height: 35px;
  }
}
@media only screen and (max-height: 798px) {
  .popup a.btn-back {
    width: 35px;
    height: 35px;
  }
}
.popup a.btn-close {
  position: absolute;
  display: block;
  top: 2.2222222222%;
  right: 0.8333333333%;
  width: 50px;
  height: 50px;
  background-image: url(/Action/11_Star31/20241120M04/ingame/images/btn-close.png);
  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 #cd5600;
}

.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 #cd5600;
  margin: 0 0 20px 0;
  font-size: calc(10px + (20 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 20 / 1920 * 100vw, 20px);
}
@media (min-aspect-ratio: 16/9) {
  .table {
    font-size: calc(10px + (20 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 20 / 1080 * 100vh, 20px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .table {
    line-height: 1.25em;
    font-size: calc(10px + (12 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 12 / 1920 * 100vh, 12px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .table {
    line-height: 1.5em;
    font-size: calc(10px + (20 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 20 / 1080 * 100vw, 20px);
  }
}
.table tr {
  background: transparent;
}
.table tr th {
  position: relative;
  background: linear-gradient(to top, #a44500 0%, #cd5600 100%);
  color: #fff;
}
.table tr th.thStyle02 {
  color: #752b00;
  background: #ffec80;
}
.table tr td {
  text-align: center;
  padding: 3px;
  color: #fff;
  /*單格變色*/
}
.table tr td p {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  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;
}

/* ================= item__box ================= */
.item__box {
  background: rgba(0, 0, 0, 0.3);
  border: 0;
  border-radius: 0;
  border: 1px solid #cd5600;
  margin: 0 auto;
}
.item__box p {
  width: 100%;
  line-height: 1.25em;
}
.item__box .item__box-title {
  position: relative;
  text-align: center;
  font-size: 1rem;
  background: linear-gradient(to right, #9a4100 0%, #cd5600 20%, #cd5600 80%, #9a4100 100%);
  color: #fff;
}
.item__box .item__box-title img {
  display: block;
  margin: 0 auto;
}
.item__box .item__box-img {
  border-radius: 0;
}
.item__box .item__box-get {
  text-align: center;
  color: #ff9100;
  font-weight: bold;
}
.item__box .item__box-get .plus {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  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;
  box-shadow: inset 0 0 5px 1px #924208;
  height: 100%;
}
.item__box .item__box--02 .item__box-title {
  background: linear-gradient(to right, #9a4100 0%, #cd5600 20%, #cd5600 80%, #9a4100 100%);
  color: #fff;
  display: flex;
  align-items: center;
}
.item__box .item__box--02 .f-danger {
  color: #ffea00;
}
.item__box .item__box--02 p {
  color: #fff;
}
.item__box .tooltip-question {
  width: 25px;
  height: 25px;
  position: absolute;
  top: 6px;
  left: 6px;
  background: linear-gradient(45deg, #8f0000, red);
  border-radius: 50%;
  box-shadow: 0px 2px 1px #ff4b4b inset, 0px 0px 3px #000;
  border: 1px solid rgb(0, 0, 0);
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 420px) {
  .item__box .tooltip-question {
    width: 30px;
    height: 30px;
  }
}
.item__box .tooltip-question::before {
  content: "";
  background: url(/Action/11_Star31/20241120M04/ingame/images/question.svg);
  width: 15px;
  height: 15px;
}
@media (min-width: 420px) {
  .item__box .tooltip-question::before {
    width: 20px;
    height: 20px;
  }
}
.item__box .tooltip-question .tooltip {
  display: none;
  position: absolute;
  width: 16em;
  top: 30px;
  left: 0;
  background: linear-gradient(to bottom, #ffe1cc 0%, #ffeacc 100%);
  border: 2px solid #995a00;
  box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
  border-radius: 10px;
  z-index: 1;
  overflow: hidden;
}
.item__box .tooltip-question .tooltip h5 {
  background: linear-gradient(to bottom, #994000 0%, #995a00 100%);
  font-size: 1.125em;
  line-height: 1.5rem;
  padding: 4px;
  margin-bottom: 0;
  color: #fff;
}
.item__box .tooltip-question .tooltip ul.probability {
  width: calc(100% - 16px);
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  list-style: none;
  padding: 4px 0;
}
.item__box .tooltip-question .tooltip ul.probability li {
  font-size: 1em;
  padding: 0 8px;
  color: #cd5600;
  border-bottom: 1px solid #cd5600;
}
.item__box .tooltip-question .tooltip ul.probability li:nth-child(odd) {
  width: 76%;
  text-align: left;
}
.item__box .tooltip-question .tooltip ul.probability li:nth-child(even) {
  width: 24%;
  text-align: left;
}
.item__box .tooltip-question .tooltip ul.probability li:nth-last-child(-1n+2) {
  border-bottom: 0;
}
.item__box .tooltip-question:hover .tooltip {
  display: inline-block;
}

body.swal2-shown .swal2-popup {
  position: relative;
  background: #ffa052;
  overflow: hidden;
  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;
  display: flex;
}
body.swal2-shown .swal2-popup .swal2-actions .swal2-confirm {
  background: linear-gradient(to bottom, #ffa052 0%, #ffa55c 5%, #ff953d, #ff8929 80%, #ff7300 100%);
  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);
  transform: translateX(-20%) translateY(-20%) rotate(-45deg);
}
body.swal2-shown .swal2-popup::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  background: #fffaf2;
  box-shadow: 0 0 2px #d66100, 0 0 5px rgb(0, 0, 0), inset 0 0 5px rgb(0, 0, 0);
  border-radius: 10px;
}

@keyframes animate {
  from {
    background-position: 0;
  }
  to {
    background-position: 0 450px;
  }
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big {
  position: absolute;
  top: 6px;
  left: 6px;
  background: linear-gradient(45deg, #ffad14, #b97d0e);
  border-radius: 50%;
  box-shadow: 0px 2px 1px #ffad14 inset, 0px 0px 3px #000;
  border: 1px solid rgb(67, 67, 67);
  display: flex;
  justify-content: center;
  align-items: center;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big.tooltip-question {
  width: 17%;
  height: 20%;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big::before {
  content: "";
  background: url(/Action/11_Star31/20241120M04/ingame/images/question.svg) no-repeat;
  width: 57%;
  height: 57%;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip {
  display: none;
  position: absolute;
  width: 17em;
  top: 109%;
  left: 0;
  background: linear-gradient(to bottom, #ffe1cc 0%, #ffeacc 100%);
  border: 2px solid #995a00;
  box-shadow: 3px 3px 5px 0 rgba(0, 0, 0, 0.75);
  border-radius: 10px;
  z-index: 1;
  overflow: hidden;
  font-size: calc(10px + (18 - 10) * (100vw - 768px) / 832);
  font-size: clamp(10px, 18 / 1920 * 100vw, 18px);
}
@media (min-aspect-ratio: 16/9) {
  .gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip {
    font-size: calc(10px + (18 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 18 / 1080 * 100vh, 18px);
  }
}
@media (min-aspect-ratio: 9/16) and (orientation: portrait) {
  .gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip {
    line-height: 1.25em;
    font-size: calc(10px + (10 - 10) * (100vh - 350px) / 730);
    font-size: clamp(10px, 10 / 1920 * 100vh, 10px);
  }
}
@media (max-aspect-ratio: 9/16) and (orientation: portrait) {
  .gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip {
    line-height: 1.5em;
    font-size: calc(10px + (18 - 10) * (100vw - 350px) / 1570);
    font-size: clamp(10px, 18 / 1080 * 100vw, 18px);
  }
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip h5 {
  background: linear-gradient(to bottom, #994000 0%, #995a00 100%);
  font-size: 1.125em;
  line-height: 1.5rem;
  padding: 4px;
  margin-bottom: 0;
  color: #fff;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip ul.probability {
  width: calc(100% - 16px);
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  list-style: none;
  padding: 4px 0;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip ul.probability li {
  padding: 0 8px;
  color: #cd5600;
  border-bottom: 1px solid #cd5600;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip ul.probability li:nth-child(odd) {
  width: 76%;
  text-align: left;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip ul.probability li:nth-child(even) {
  width: 24%;
  text-align: left;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big .tooltip ul.probability li:nth-last-child(-1n+2) {
  border-bottom: 0;
}
.gamemain_awards__info .info-luckybag__img .tooltip-question_big:hover .tooltip {
  display: inline-block;
}/*# sourceMappingURL=style.css.map */