@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;
}

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: #d9fffa;
}

.ingame__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background-position: center;
}
.ingame__wrapper.A {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/ingamebg1.jpg?20250218);
}
.ingame__wrapper.B {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/ingamebg2.jpg?20250218);
}

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

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

.btn__question {
  width: 4.343220339%;
  height: 7.7212806026%;
  position: absolute;
  left: 10.27119%;
  bottom: 5.532957%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_question.png?20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  cursor: pointer;
}

.btn__record {
  width: 4.343220339%;
  height: 7.7212806026%;
  position: absolute;
  left: 15.46186%;
  bottom: 5.532957%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_record.png?20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  cursor: pointer;
}

.hide {
  display: none;
}

.show {
  display: block;
}

.member {
  position: absolute;
  font-family: Verdana, sans-serif;
  font-size: 16px;
  color: #fff;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/member_bg.png?v=20250218);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  text-align: center;
  width: 80%;
  height: 10.4519774011%;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  display: flex;
  justify-content: space-around;
  align-items: center;
  z-index: 1;
}
.member__table {
  width: 46.875%;
  height: 63.0630630631%;
  display: flex;
  align-items: center;
  padding-left: 1.3020833333%;
}
@media screen and (min-width: 420px) {
  .member__table {
    width: 23.4375%;
    height: 63.0630630631%;
  }
}
.member__table .vip-icon0 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v0_S.png?v=20250218);
}
.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 screen and (min-width: 420px) {
  .member__table .vip-icon {
    width: 16.6666666667%;
  }
}
.member__table .vip-icon1 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v0_1.png?v=20250218);
}
.member__table .vip-icon13 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v11Plus.png?v=20250218);
}
.member__table .vip-icon2 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v1.png?v=20250218);
}
.member__table .vip-icon3 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v2.png?v=20250218);
}
.member__table .vip-icon4 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v3.png?v=20250218);
}
.member__table .vip-icon5 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v4.png?v=20250218);
}
.member__table .vip-icon6 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v5.png?v=20250218);
}
.member__table .vip-icon7 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v6.png?v=20250218);
}
.member__table .vip-icon8 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v7.png?v=20250218);
}
.member__table .vip-icon9 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v8.png?v=20250218);
}
.member__table .vip-icon10 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v9.png?v=20250218);
}
.member__table .vip-icon11 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v10.png?v=20250218);
}
.member__table .vip-icon12 {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/member/v11.png?v=20250218);
}
.member__table .nickname {
  font-weight: bold;
  color: #fff;
  line-height: 1.5em;
  font-size: calc(10px + 22 * (100vw - 600px) / 1320);
  font-size: clamp(8px, 1.6666666667 + vw, 32px);
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.35);
}
@media (min-aspect-ratio: 16/9) {
  .member__table .nickname {
    font-size: clamp(8px, 3.0131826742 + vh, 32px);
  }
}
.member__coins-props {
  width: 52.734375%;
  height: 63.0630630631%;
  background: rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 3px #2693ff;
  border-radius: 35px;
  margin: 0 0.6510416667% 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 screen and (min-width: 420px) {
  .member__coins-props {
    width: 22.1354166667%;
  }
}
@media (min-aspect-ratio: 16/9) {
  .member__coins-props {
    font-size: clamp(10px, 3.0131826742 + vh, 32px);
  }
}
.member__coins-props p {
  width: 88.8888888889%;
}
@media screen and (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/20250219MX04/ingame/images/member/coin_game.png?v=20250218);
  background-size: 100% !important;
  background-repeat: no-repeat;
  display: block;
  position: relative;
  margin-right: 0.4938271605%;
}
@media screen and (min-width: 420px) {
  .member__coins-props::before {
    width: 13.5294117647%;
    margin-right: 1.1764705882%;
  }
}
.member__status {
  width: 54.0364583333%;
  height: 63.0630630631%;
  margin-left: 0;
  display: none;
  justify-content: center;
  align-items: center;
}
@media screen and (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.6510416667%;
  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, 3.0131826742 + 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, 3.0131826742 + 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/20250219MX04/ingame/images/member/coin_i.png?v=20250218);
  background-repeat: no-repeat;
}
.member .vip-info .coins-diamonds::before {
  width: 12.4675324675%;
  height: 55.7142857143%;
  background: url(/Action/11_Star31/20250219MX04/ingame/images/member/coin_diamonds.png?v=20250218);
  background-repeat: no-repeat;
}
.member .vip-info .coins-i::before {
  content: "";
  width: 11.4285714286%;
  height: 65.7142857143%;
  background: url(/Action/11_Star31/20250219MX04/ingame/images/member/coin_i.png?v=20250218);
  background-repeat: no-repeat;
  background-size: 100%;
  display: block;
  position: relative;
  margin-right: 1.038961039%;
}

.title {
  width: 28.7605932203%;
  height: 20.4331450094%;
  position: absolute;
  top: 10.0753295669%;
  left: 0%;
  background-size: 100%;
  background-repeat: no-repeat;
}

.bigaward {
  width: 26.6949152542%;
  height: 57.8154425612%;
  position: absolute;
  top: 26.073446%;
  left: 1.5889830508%;
  background-size: 100% !important;
  background-repeat: no-repeat;
}

.gamemain {
  width: 55.561440678%;
  height: 84.5574387947%;
  position: absolute;
  top: 0;
  left: 25.4237288136%;
  background-size: 100% !important;
}
.gamemain ul {
  width: 92.2783603432%;
  height: 62.0267260579%;
  position: absolute;
  top: 24.0534521158%;
  left: 6.1963775024%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  list-style-type: none;
}
.gamemain ul li {
  width: 28.5300285987%;
  height: 50.2772828508%;
  position: relative;
  cursor: pointer;
  background-size: auto 100% !important;
  background-position: center;
  background-repeat: no-repeat;
}
.gamemain ul li.play {
  animation: ax 0.2s 0.5s;
}
.gamemain ul li.standby {
  animation: eggs 4s infinite linear;
}
.gamemain ul li:nth-child(1) {
  margin-left: 18%;
}
.gamemain ul li:nth-child(2) {
  margin-right: 18%;
}
.gamemain ul li .hammer {
  position: absolute;
  width: 40.4651162791%;
  height: 45.4515050167%;
  left: 69.6899224806%;
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  animation: hammerAnimate 0.8s infinite;
  filter: drop-shadow(0px 0px 2px rgb(0, 0, 0));
}
.gamemain ul li.open .hammer {
  left: 47.2093023256%;
  top: 20%;
  animation: bounceIn 0.2s, ax 0.5s !important;
}

@keyframes eggs {
  /*0%,10%,100%{ transform: scale(1); }*/
  0% {
    transform: scale(1);
  }
  2% {
    transform: scale(1.1);
  }
  4% {
    transform: scale(0.92);
  }
  6% {
    transform: scale(1.05);
  }
  8% {
    transform: scale(0.96);
  }
  10% {
    transform: scale(1);
  }
  50% {
    transform: scale(1);
  }
  52% {
    transform: scale(1.1);
  }
  54% {
    transform: scale(0.92);
  }
  56% {
    transform: scale(1.05);
  }
  58% {
    transform: scale(0.96);
  }
  60% {
    transform: scale(1);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes ax {
  20% {
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    transform: rotate3d(0, 0, 1, -5deg);
  }
  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@keyframes delay {
  from, to {
    opacity: 0;
  }
}
@keyframes hammerAnimate {
  from, to {
    transform: rotate(0deg);
  }
  50% {
    transform: translateX(-55%) rotate(-30deg);
  }
}
.gamechange01 {
  width: 11.2288135593%;
  height: 17.0433145009%;
  position: absolute;
  right: 6.5913370998%;
  top: 31.7325800377%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_rainforest.png?v=20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 1;
  cursor: pointer;
}
.gamechange01:hover {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_rainforest_action.png?v=20250218);
}
.gamechange01.open {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_rainforest_action.png?v=20250218);
}

.gamechange02 {
  width: 10.4343220339%;
  height: 16.9491525424%;
  position: absolute;
  right: 6.5913370998%;
  top: 50.8474576271%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_desert.png?v=20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 1;
  cursor: pointer;
}
.gamechange02:hover {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_desert_action.png?v=20250218);
}
.gamechange02.open {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_desert_action.png?v=20250218);
}

.gamechange03 {
  width: 11.2288135593%;
  height: 17.0433145009%;
  position: absolute;
  right: 6.5913370998%;
  top: 50.8474576271%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_ice.png?v=20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 1;
  cursor: pointer;
}
.gamechange03:hover {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_ice_action.png?v=20250218);
}
.gamechange03.open {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_change_ice_action.png?v=20250218);
}

.hide .gamechange01 {
  top: 11.9585687382%;
}
.hide .gamechange02 {
  top: 31.7325800377%;
}

.btn_stored {
  width: 11.8644067797%;
  height: 21.186440678%;
  position: absolute;
  right: 6.5913370998%;
  right: 17.59134%;
  top: 70.6214689266%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_add.png?v=20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 1;
  cursor: pointer;
}

.gameplay-btn {
  width: 21.5572033898%;
  height: 19.9623352166%;
  position: absolute;
  left: 44.0677966102%;
  bottom: 6.546139%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_all.png?v=20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 1;
  cursor: pointer;
}
@media only screen and (max-height: 569px) {
  .gameplay-btn {
    width: 19.5%;
    left: 45%;
  }
}

.textprompt {
  width: 20.8686440678%;
  height: 7.0621468927%;
  position: absolute;
  left: 44.0677966102%;
  bottom: 4.5%;
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-height: 569px) {
  .textprompt {
    width: 30%;
    height: 10%;
    left: 40%;
    bottom: 2.5%;
  }
}

.popup {
  top: 0;
  left: 0;
  position: absolute;
  z-index: 999;
  width: 100%;
  height: 100%;
  overflow: hidden;
  visibility: hidden;
}
.popup-base, .popup-prize {
  width: 85.1694915254%;
  height: 84.6516007533%;
  position: absolute;
  top: 7.6271186441%;
  left: 7.468220339%;
  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.5065913371% 0.8474576271% 1.5065913371% 1.2711864407%;
  overflow: hidden;
  z-index: 1;
  visibility: hidden;
}
.popup-base h2, .popup-prize h2 {
  font-size: 1.5rem;
  color: #ddb689;
  letter-spacing: 5px;
  padding-bottom: 8px;
  text-align: center;
  font-weight: inherit;
}
.popup-base h2 .f-sm, .popup-prize h2 .f-sm {
  font-size: 0.75em;
  letter-spacing: 0px;
}
.popup-base .line, .popup-prize .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: 16px;
}
.popup-base .main, .popup-prize .main {
  width: 100%;
  height: calc(100% - (1.5rem + 2px + 30px));
  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 only screen and (orientation: portrait) {
  .popup-base .main, .popup-prize .main {
    font-size: calc(14px + 4 * (100vh - 350px) / 850);
    font-size: clamp(12px, 1.6949152542 + vh, 18px);
  }
}
@media (min-aspect-ratio: 16/9) {
  .popup-base .main, .popup-prize .main {
    font-size: calc(14px + 4 * (100vh - 350px) / 850);
    font-size: clamp(14px, 1.6949152542 + vh, 18px);
  }
}
.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(255, 187, 42, 0.5);
  border-radius: 5px;
}
.popup-base .main h4, .popup-prize .main h4 {
  font-size: 1.35rem;
  line-height: 2em;
  color: rgb(255, 159, 70);
  margin-left: -1em;
}
.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;
}
@media only screen and (max-height: 569px) {
  .popup .part {
    margin-bottom: 0;
  }
}
.popup .part > p,
.popup .part > ol,
.popup .part > ul,
.popup .part > h3 {
  margin-bottom: 16px;
}
.popup .question .f-danger {
  color: rgb(255, 123, 0);
}
.popup .question ol {
  font-size: 1rem;
  margin: 0 auto;
}
.popup .question ol li {
  padding-bottom: 8px;
}
.popup .record {
  position: absolute;
}
.popup .prize .main {
  width: 93.2835820896%;
  height: calc(100% - (1.6rem + 2px) - 17.3526140156%);
  margin: 0 auto;
  overflow-y: auto;
  position: relative;
  padding-bottom: 10px;
}
@media only screen and (max-height: 569px) {
  .popup .prize .main {
    height: calc(100% - (1.6rem + 2px) - 22.2469410456%);
  }
}
.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: 160px;
  margin: 8px;
  background-size: 100% !important;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 16px;
  box-shadow: inset 0 0 3px #ffb254;
  padding: 1.0666666667%;
}
.popup .prize .main .item ul li p {
  width: 100%;
  color: #fff;
  line-height: 1.75em;
  text-align: center;
  font-size: clamp(12px, 0.9375 + vw, 18px);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4px 0;
}
.popup .prize .main .item ul li img {
  max-width: 75%;
  display: block;
  margin: 0 auto;
}
.popup .prize .main .item ul li .nums {
  width: 9.6610169492vw;
  height: 2.7966101695vw;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  flex-wrap: wrap;
  position: relative;
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item ul li .nums {
    width: 17.1751412429vh;
    height: 4.9717514124vh;
  }
}
.popup .prize .main .item ul li .nums .num {
  width: 2.4152542373vw;
  height: 100%;
  display: flex;
  justify-content: center;
  background-size: 87.5% !important;
  background-position-x: center !important;
  background-repeat: no-repeat !important;
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item ul li .nums .num {
    width: 4.2937853107vh;
  }
}
.popup .prize .main .item ul li .nums .num-0 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/00.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-1 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/01.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-2 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/02.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-3 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/03.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-4 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/04.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-5 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/05.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-6 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/06.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-7 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/07.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-8 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/08.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-9 {
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/09.png?v=20250218);
}
.popup .prize .main .item ul li .nums .num-multiply {
  width: 2.4152542373vw;
  background: url(/Action/11_Star31/20250219MX04/ingame/images/number/multiplication.png?v=20250218);
}
@media (min-aspect-ratio: 16/9) {
  .popup .prize .main .item ul li .nums .num-multiply {
    width: 4.2937853107vh;
  }
}
.popup .prize .getBtn {
  width: 16.4800995025%;
  height: 11.234705228%;
  margin: 1.4925373134% auto;
  background: url(/Action/11_Star31/20250219MX04/ingame/images/btn_ok.png?v=20250218);
  background-size: 100% !important;
  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/20250219MX04/ingame/images/big_win_bg.png?v=20250218);
}
.popup .bigWin .main {
  width: 100%;
  width: 100%;
}
.popup .bigWin .main p {
  position: absolute;
  width: 100%;
  color: #fff;
  text-align: center;
  top: 60%;
  font-size: calc(14px + 22 * (100vw - 600px) / 1320);
  font-size: clamp(14px, 1.6666666667 + vw, 32px);
}
.popup .bigWin .awards {
  width: 15.625%;
  height: 27.7777777778%;
  position: absolute;
  top: 32.4074074074%;
  left: 41.4225941423%;
}
.popup .bigWin .awards img {
  width: 100%;
}
.popup .bigWin .getBtn {
  width: 15.4249126892%;
  height: 11.7852975496%;
  margin: 1.3969732247% auto;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn_ok.png?v=20250218);
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  bottom: 10.7351225204%;
  left: 41.3271245634%;
  cursor: pointer;
}
.popup a.btn-back {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn-back.png);
  top: 0.9416195857%;
  left: 0.5296610169%;
  width: 40px;
  height: 40px;
}
.popup a.btn-close {
  top: 2.2598870056%;
  right: 0.8474576271%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/btn-x.png);
  width: 50px;
  height: 50px;
}
.popup a.btn-back, .popup a.btn-close {
  position: absolute;
  display: block;
  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, .popup a.btn-close {
    width: 35px;
    height: 35px;
  }
}
@media only screen and (max-height: 798px) {
  .popup a.btn-back, .popup a.btn-close {
    width: 35px;
    height: 35px;
  }
}

/* ================= item__box ================= */
.item__box {
  background: #ffffff;
  border: 0;
  border-radius: 0;
  border: 3px solid #CA352B;
  margin: 0 auto;
}
.item__box p {
  width: 100%;
  line-height: 1.25em;
}
.item__box .item__box-title {
  position: relative;
  text-align: center;
  background: linear-gradient(to right, #a02a22 0%, #CA352B 20%, #CA352B 80%, #a02a22 100%);
  line-height: 1.5em;
  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: linear-gradient(to top, #2a0911 0%, #551122 100%);
  border: 0;
  border-radius: 0;
  height: 100%;
}
.item__box .item__box--02 .item__box-title {
  background: linear-gradient(to right, #2d0610 0%, #5a0c1f 20%, #5a0c1f 80%, #2d0610 100%);
  color: #fff;
  display: flex;
  align-items: center;
}
.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 screen and (min-width: 420px) {
  .item__box .tooltip-question {
    width: 30px;
    height: 30px;
  }
}
.item__box .tooltip-question::before {
  content: "";
  background: url(/Action/11_Star31/20250219MX04/ingame/images/question.svg);
  width: 15px;
  height: 15px;
}
@media screen and (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, #fdffdd 0%, #f4ffad 100%);
  border: 2px solid #979200;
  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, #4b9700 0%, #b2bb00 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: #005e16;
  border-bottom: 1px solid #013f05;
}
.item__box .tooltip-question .tooltip ul.probability li:nth-child(odd) {
  width: 75%;
  text-align: left;
}
.item__box .tooltip-question .tooltip ul.probability li:nth-child(even) {
  width: 25%;
  text-align: center;
}
.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;
}

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

.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 #af6928;
  margin: 0 0 20px 0;
}
.table tr {
  background: transparent;
}
.table tr th {
  position: relative;
  background: linear-gradient(to top, #ff832f 0%, #ff9b58 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;
}

.ingame__wrapper.A .hammer {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/mallet_rainforest.png?20250218);
}
.ingame__wrapper.A .title {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/slogan_rainforest.png?20250218);
}
.ingame__wrapper.A .textprompt {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/text_prompt.png?v=20250218);
}
.ingame__wrapper.A .gamemain ul li {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/egg_rainforest.png?20250218);
}
.ingame__wrapper.A .gamemain ul li.standby {
  animation: eggs 4s infinite linear;
  transform: translateZ(0);
}
.ingame__wrapper.A .gamemain ul li.open {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/egg_rainforest_open.png?20250218);
}
.ingame__wrapper.A .bigaward {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/bigprize_rainforest.png);
}
.ingame__wrapper.B .hammer {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/mallet_desert.png?20250218);
}
.ingame__wrapper.B .title {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/slogan_desert.png?20250218);
}
.ingame__wrapper.B .textprompt {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/text_prompt.png?v=20250218);
}
.ingame__wrapper.B .gamemain ul li {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/egg_desert.png?20250218);
}
.ingame__wrapper.B .gamemain ul li.standby {
  animation: eggs 4s infinite linear;
  transform: translateZ(0);
}
.ingame__wrapper.B .gamemain ul li.open {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/egg_desert_open.png?20250218);
}
.ingame__wrapper.B .bigaward {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/bigprize_desert.png);
}
.ingame__wrapper.C .hammer {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/mallet_ice.png?20250218);
}
.ingame__wrapper.C .title {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/slogan_ice.png?20250218);
}
.ingame__wrapper.C .textprompt {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/text_prompt.png?v=20250218);
}
.ingame__wrapper.C .gamemain ul li {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/egg_ice.png?20250218);
}
.ingame__wrapper.C .gamemain ul li.standby {
  animation: eggs 4s infinite linear;
  transform: translateZ(0);
}
.ingame__wrapper.C .gamemain ul li.open {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/egg_ice_open.png?20250218);
}
.ingame__wrapper.C .bigaward {
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/bigprize_ice.png);
}

.rightdoor {
  position: absolute;
  top: 0%;
  left: 116%;
  width: 66%;
  height: 101%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/bg_doorright.png?v=20250218);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: bottom center;
  z-index: 101 !important;
  transform: scaleY(1.2) translateX(-100%) translateZ(10px);
}

.leftdoor {
  position: absolute;
  top: 0%;
  right: 116%;
  width: 66%;
  height: 101%;
  background-image: url(/Action/11_Star31/20250219MX04/ingame/images/bg_doorleft.png?v=#20250218);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: top center;
  z-index: 100 !important;
  transform: scaleY(1.2) translateX(100%) translateZ(10px);
}

.rightdoor_toright {
  animation-name: rightdoor_toright;
  animation-duration: 0.5s;
  animation-timing-function: linear;
  visibility: visible !important;
  animation-delay: 0.3s;
}

@keyframes rightdoor_toright {
  0% {
    transform: scaleY(1.2) translateX(-100%) translateZ(10px);
  }
  75% {
    transform: scaleY(1.25) translateX(-2%) translateZ(10px);
  }
  90% {
    transform: scaleY(1.2) translateX(-8%) translateZ(10px);
  }
  100% {
    transform: scaleY(1.25) translateX(0%) translateZ(10px);
  }
}
.rightdoor_toleft {
  animation-name: rightdoor_toleft;
  animation-duration: 0.5s;
  animation-timing-function: linear;
  visibility: visible !important;
}

@keyframes rightdoor_toleft {
  0% {
    transform: scaleY(1.25) translateX(0) translateZ(10px);
  }
  75% {
    transform: scaleY(1.2) translateX(-100%) translateZ(10px);
  }
  90% {
    transform: scaleY(1.3) translateX(-100%) translateZ(10px);
  }
  100% {
    transform: scaleY(1.2) translateX(-100%) translateZ(10px);
  }
}
.leftdoor_toleft {
  animation-name: leftdoor_toleft;
  animation-duration: 0.5s;
  animation-timing-function: linear;
  visibility: visible !important;
  animation-delay: 0.3s;
}

@keyframes leftdoor_toleft {
  0% {
    transform: scaleY(1.2) translateX(100%) translateZ(10px);
  }
  75% {
    transform: scaleY(1.25) translateX(2%) translateZ(10px);
  }
  90% {
    transform: scaleY(1.2) translateX(5%) translateZ(10px);
  }
  100% {
    transform: scaleY(1.25) translateX(0) translateZ(10px);
  }
}
.leftdoor_toright {
  animation-name: leftdoor_toright;
  animation-duration: 0.5s;
  animation-timing-function: linear;
  visibility: visible !important;
}

@keyframes leftdoor_toright {
  0% {
    transform: scaleY(1.25) translateX(0) translateZ(10px);
  }
  75% {
    transform: scaleY(1.2) translateX(100%) translateZ(10px);
  }
  90% {
    transform: scaleY(1.3) translateX(100%) translateZ(10px);
  }
  100% {
    transform: scaleY(1.2) translateX(100%) translateZ(10px);
  }
}/*# sourceMappingURL=style.css.map */