@charset "UTF-8";
/*blue*/
/*顏色設定*/
/*rgba(255, 255, 255, 0.2)*/
/*rgba(0, 0, 0, 0.2)*/
/*blue*/
/*顏色設定*/
:root {
  --memberHall-bg-01: #2A2A2A;
  --memberHall-bg-02: #ffffff;
  --memberHall-bg-03: #293247;
  --memberHall-bg-04: #ffffff;
  --memberHall-bg-05: #ffffff;
  --memberHall-bg-06: #1F54CE;
  --memberHall-bg-07: #484848;
  --memberHall-bg-08: #6F6D72;
  --memberHall-bg-09: #ffffff;
  --memberHall-bg-10: #d9d9d933;
  --memberHall-bg-11: #ffffff;
  --memberHall-bg-12: #1F54CE;
  --memberHall-bg-13: #ffffff33;
  --memberHall-bg-14: #ffffff;
  --memberHall-bg-15: #00000080;
  --memberHall-bg-16: #1F54CE;
  --memberHall-bg-17: #ffffff;
  --memberHall-bg-18: #2F2E2E;
  --memberHall-bg-19: #33CF5C;
  --memberHall-bg-20: #6F6D72;
  --memberHall-bg-21: #ffffff;
  --memberHall-bg-22: #6A97FF;
  --memberHall-bg-23: #6F6D72;
  --memberHall-bg-24: #000000;
  --memberHall-bg-25: #D9D9D9;
  --memberHall-bg-26: #FF5555;
  --memberHall-bg-27: #6F6D72;
  --memberHall-bg-28: #ffffff;
  --memberHall-bg-29: #1FA1FF;
  --memberHall-bg-30: #ffffff;
  --memberHall-gradient01-01: #2A2A2A;
  --memberHall-gradient01-02: #191919;
  --memberHall-gradient02-01: #1F54CE;
  --memberHall-gradient02-02: #ffffff;
  --memberHall-gradient03-01: #2E4A8A;
  --memberHall-gradient03-02: #1F54CE;
  --memberHall-gradient04-01: rgba(208, 210, 211, 0.2);
  --memberHall-gradient05-01: #ffffff;
  --memberHall-gradient05-02: #6A97FF;
  --memberHall-gradient05-03: #1F54CE;
  --memberHall-gradient06-01: #ffffff00;
  --memberHall-gradient06-02: #FFFFFF;
  --memberHall-gradient07-01: #2E4A8A;
  --memberHall-gradient07-02: #1F54CE;
  --memberHall-gradient08-01: #A36C11;
  --memberHall-gradient08-02: #E8C750;
  --memberHall-gradient09-01: #B36820;
  --memberHall-gradient09-02: #783810;
  --memberHall-text-01: #ffffff;
  --memberHall-text-02: #ffffff;
  --memberHall-text-03: #ffffff;
  --memberHall-text-04: #ffffff;
  --memberHall-text-05: #A6A6A6;
  --memberHall-text-06: #FFEA7A;
  --memberHall-text-07: #ffffff;
  --memberHall-shadow-01: #6A97FF;
  --memberHall-shadow-02: #afafaf40;
  --memberHall-shadow-03: #00000040;
  --memberHall-shadow-04: #fffdfd40;
  --memberHall-shadow-05: #00000033;
  --memberHall-shadow-06: #00000033;
  --memberHall-shadow-07: #6A97FF59;
  --memberHall-border-01: #6A97FF;
  --memberHall-border-02: #959595;
  --memberHall-border-03: #ffffff66;
  --memberHall-border-04: #ffffff33;
  --memberHall-border-05: #959595;
  --memberHall-img-01: url("~coreAssets/images/memberCenter/memberHall-bg/blue.webp");
  --memberHall-img-02: url("~coreAssets/images/memberCenter/memInfoCard-bg/blue.webp");
  --memberHall-img-03: url("~coreAssets/images/memberCenter/now-vip-bg/blue.webp");
  --mem-bankcard-focus-gradient01: var(--memberHall-gradient07-01);
  --mem-bankcard-focus-gradient02: var(--memberHall-gradient07-02);
  --mem-bankcard-focus-border: var(--memberHall-text-06);
  --mem-bankcard-focus-text: var(--memberHall-bg-11);
  --mem-bankcard-default-border: #E3E3E3;
  --mem-bankcard-default-gradient01: #FCFCFF;
  --mem-bankcard-default-gradient02: #F4F4F4;
  --mem-bankcard-default-text: #6C5F4E;
  --mem-bankcard-add_default-bg: #FFFFFF;
  --mem-bankcard-add_disable-bg: #F3F3F3;
  --mem-bankcard-add_disable-text: #AAAAAA;
}

body.has-fullscreen-iframe {
  overflow: hidden !important;
  width: 100%;
  height: auto;
}

/*通用版*/
.check-in-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@keyframes scale {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes shine {
  0% {
    opacity: 1;
  }
  25% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes move-forever {
  0% {
    transform: translate3d(-90px, 0, 0);
  }
  100% {
    transform: translate3d(85px, 0, 0);
  }
}
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}

.check-in-close {
  position: absolute;
  z-index: 10;
  right: 5px;
  top: -25px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #2054CE;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.check-in-close::before, .check-in-close::after {
  content: "";
  position: absolute;
  width: 70%;
  height: 4px;
  border-radius: 4px;
  transform: rotate(45deg);
  background: #ffffff;
}
.check-in-close::before {
  transform: rotate(-45deg);
}

.check-in-block {
  position: relative;
  width: 720px;
  padding: 25px 20px;
  margin-top: 62px;
}
@media only screen and (max-width: 768px) {
  .check-in-block {
    width: 100%;
  }
}
.check-in-block .check-in-hook {
  position: absolute;
  z-index: 10;
  left: 30px;
  right: 30px;
  top: 0;
  display: flex;
  justify-content: space-between;
  padding: 0 20px;
}
.check-in-block .check-in-hook img {
  width: 35px;
}
.check-in-block .check-in-icon {
  position: absolute;
  z-index: 10;
  top: -50px;
  left: 0;
  right: 0;
  margin: auto;
  width: fit-content;
  height: 112px;
  text-align: center;
}
.check-in-block .check-in-icon img {
  height: 100%;
}
.check-in-block .check-in-icon .icon02-animation {
  position: absolute;
  z-index: 1;
  animation-name: scale;
  animation-duration: 3s;
  animation-delay: 0s;
  animation-iteration-count: infinite;
}
.check-in-block .check-in-icon .icon03-animation {
  position: absolute;
  z-index: 1;
  animation-name: shine;
  animation-duration: 2s;
  animation-delay: 0s;
  animation-iteration-count: infinite;
}
.check-in-block .check-in-content {
  position: relative;
  width: 100%;
  border-radius: 20px;
  border: 3px solid #2054CE;
  background: #2054CE;
  box-shadow: 0px 0px 2px #FFD84E, 0px 0px 10px #FF7A00;
  overflow: hidden;
}
.check-in-block .check-in-header {
  position: relative;
  padding: 40px 20px;
  background: #2054CE;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  gap: 5px;
}
.check-in-block .check-in-header::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #00000000, #000000FF);
  display: block;
  opacity: 0.2;
  pointer-events: none;
}
.check-in-block .check-in-header h4 {
  position: relative;
  z-index: 10;
  font-size: 20px;
  color: #ffffff;
  line-height: 25px;
  text-align: center;
  text-shadow: -2px 0 0 #002D98, 0 -2px 0 #002D98, 2px 0 0 #002D98, 0 2px 0 #002D98, 2px -2px 0 #002D98, -2px 2px 0 #002D98, -2px -2px 0 #002D98, 2px 2px 0 #002D98;
  max-height: 65px;
  margin-bottom: 5px;
  overflow: auto;
}
.check-in-block .check-in-header h4 span {
  vertical-align: middle;
  margin-left: 8px;
}
.check-in-block .check-in-header h4 img {
  width: 30px;
}
.check-in-block .check-in-header .time {
  position: relative;
  z-index: 10;
  font-size: 14px;
  font-weight: bold;
}
.check-in-block .check-in-header .caption {
  position: relative;
  z-index: 10;
  font-size: 12px;
}
.check-in-block .check-in-header .check-in-header-light {
  position: absolute;
  right: 0;
  bottom: 10px;
  height: 40px;
  z-index: 20;
}
.check-in-block .check-in-header .check-in-header-light img {
  height: 100%;
}
.check-in-block .check-in-header .wave-block {
  position: absolute;
  z-index: 10;
  left: 0;
  right: 0;
  bottom: 0;
}
.check-in-block .check-in-header .wave-block .waves {
  position: relative;
  width: 100%;
  height: 15vh;
  height: 40px;
  margin-bottom: -7px;
}
.check-in-block .check-in-header .wave-block .waves01 {
  fill: #141D34;
}
.check-in-block .check-in-header .wave-block .waves02 {
  fill: #141D34;
  opacity: 0.4;
}
.check-in-block .check-in-detail {
  background: #141D34;
  padding: 15px;
}
.check-in-block .check-in-detail .check-in-list {
  display: flex;
  flex-wrap: wrap;
  counter-reset: num;
}
.check-in-block .check-in-detail .check-in-grid {
  position: relative;
  border-radius: 6px;
  border: 2px solid #002D98;
  font-size: 14px;
  text-align: center;
  margin: 3px;
  overflow: hidden;
}
.check-in-block .check-in-detail .check-in-grid::before {
  counter-increment: num;
  content: counter(num);
  position: absolute;
  z-index: 10;
  left: 0;
  top: 0;
  background: #002D98;
  border-bottom-right-radius: 10px;
  width: 25px;
  height: 25px;
  line-height: 23px;
  text-align: center;
  color: #ffffff;
  text-shadow: -1px 0 0 #2862E1, 0 -1px 0 #2862E1, 1px 0 0 #2862E1, 0 1px 0 #2862E1, 1px -1px 0 #2862E1, -1px 1px 0 #2862E1, -1px -1px 0 #2862E1, 1px 1px 0 #2862E1;
}
.check-in-block .check-in-detail .check-in-grid::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #0B1224;
}
.check-in-block .check-in-detail .check-in-grid:last-child .check-in-bg::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: -125px;
  right: -125px;
  margin: auto;
  opacity: 0.6;
  width: 250px;
  height: 250px;
  animation-name: rotate;
  animation-duration: 20s;
  animation-delay: 0s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  background: #002D98;
}
.check-in-block .check-in-detail .check-in-grid .received-block {
  position: absolute;
  z-index: 20;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.check-in-block .check-in-detail .check-in-grid .received-block::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #545454;
  opacity: 0.7;
}
.check-in-block .check-in-detail .check-in-grid .received-block img {
  width: 40px;
  position: relative;
  z-index: 5;
}
.check-in-block .check-in-detail .check-in-grid.check-in-today {
  border-color: #00B2FF;
  cursor: pointer;
}
.check-in-block .check-in-detail .check-in-grid.check-in-today::before {
  background: #00B2FF;
}
.check-in-block .check-in-detail .check-in-grid.check-in-today::after {
  background: #00B2FF;
  opacity: 0.4;
}
.check-in-block .check-in-detail .check-in-grid .isLoading {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  min-height: 144px;
  font-size: 30px;
}
.check-in-block .check-in-detail .check-in-bg {
  position: relative;
  padding: 25px 5px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.check-in-block .check-in-detail .check-in-bg .gift-icon {
  position: relative;
  z-index: 10;
  min-height: 70px;
  max-width: 60px;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  display: flex;
  align-items: center;
}
.check-in-block .check-in-detail .check-in-bg .gameCardItemWrapper {
  min-height: 70px;
}
.check-in-block .check-in-detail .check-in-bg .game-item-card {
  margin: 0;
  width: 100%;
}
.check-in-block .check-in-detail .check-in-bg .game-item-card .card-img {
  padding-bottom: 90%;
  margin-bottom: 1px;
}
.check-in-block .check-in-detail .check-in-bg .game-item-card .card-help-name {
  font-size: 8px;
}
.check-in-block .check-in-detail .check-in-bg .game-item-card .card-help-name span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  padding-left: 2px;
}
.check-in-block .check-in-detail .check-in-bg .count-block {
  position: relative;
  z-index: 10;
  color: #ffffff;
  text-shadow: -1px 0 0 #2862E1, 0 -1px 0 #2862E1, 1px 0 0 #2862E1, 0 1px 0 #2862E1, 1px -1px 0 #2862E1, -1px 1px 0 #2862E1, -1px -1px 0 #2862E1, 1px 1px 0 #2862E1;
  line-height: 14px;
  padding-top: 5px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 5px;
  word-break: break-all;
}
.check-in-block .check-in-detail .check-in-bg .count-block span:first-child {
  font-weight: 700;
}
.check-in-block .check-in-detail .check-in-bg .count-block span:last-child {
  font-family: "Impact", "sans-serif";
}

.check-in-list.three-days {
  flex-wrap: wrap;
}
.check-in-list.three-days .check-in-grid {
  width: calc(100% / 3 - 6px);
}
@media only screen and (max-width: 768px) {
  .check-in-list.three-days .check-in-grid {
    width: calc(25% - 6px);
  }
}
.check-in-list.three-days .check-in-grid:last-child {
  width: calc(100% / 3 - 6px);
}
@media only screen and (max-width: 768px) {
  .check-in-list.three-days .check-in-grid:last-child {
    width: calc(50% - 6px);
  }
}
.check-in-list.seven-days {
  flex-wrap: wrap;
}
.check-in-list.seven-days .check-in-grid {
  width: calc(100% / 7 - 6px);
}
@media only screen and (max-width: 768px) {
  .check-in-list.seven-days .check-in-grid {
    width: calc(25% - 6px);
  }
}
.check-in-list.seven-days .check-in-grid:last-child {
  width: calc(100% / 7 - 6px);
}
@media only screen and (max-width: 768px) {
  .check-in-list.seven-days .check-in-grid:last-child {
    width: calc(50% - 6px);
  }
}
.check-in-list.fourteen-days .check-in-grid {
  width: calc(100% / 7 - 6px);
}
@media (max-width: 768px) {
  .check-in-list.fourteen-days .check-in-grid {
    width: calc(20% - 6px);
  }
}
.check-in-list.fourteen-days .check-in-grid:last-child {
  width: calc(100% / 7 - 6px);
}
@media (max-width: 768px) {
  .check-in-list.fourteen-days .check-in-grid:last-child {
    width: calc(40% - 6px);
  }
}

.mobile-app .publicDialog .checkin-dialog {
  padding: 0;
  overflow-y: hidden;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog {
  width: 100%;
  margin-top: vmin-mob(16) !important;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block {
  padding: 0 vmin-mob(16);
  margin-top: 58px;
  margin-bottom: 10px;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-close {
  top: -18px;
  translate: 0 -100%;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-hook {
  left: 0px;
  right: 0px;
  top: -17.5px;
  padding: 0 vmin-mob(36);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-hook img {
  width: 25.6px;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-icon {
  top: -56.5px;
  height: 89.6px;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-header {
  padding: vmin-mob(26) vmin-mob(16);
  border-radius: 20px;
  gap: unset;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-header::before {
  border-radius: 20px;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-header h4 {
  margin-top: 0;
  margin-bottom: vmin-mob(6);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-header .time {
  margin-bottom: vmin-mob(4);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-header .caption {
  height: 34px;
  max-height: 34px;
  overflow-y: scroll;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-header .check-in-header-light {
  bottom: 0;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail {
  padding: 3px vmin-mob(20) vmin-mob(20);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: vmin-mob(6);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list.fourteen-days {
  grid-template-columns: repeat(5, 1fr);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid {
  width: auto;
  margin: 0;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid:not(.isLoading)::before {
  width: vmin-mob(22.4);
  height: vmin-mob(22.4);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid:last-child {
  width: auto;
  grid-column: span 2;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .isLoading {
  height: 100%;
  min-height: auto;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg {
  padding-top: vmin-mob(21);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon {
  max-width: vmin-mob(40);
  max-height: vmin-mob(40);
  min-height: auto;
  width: vmin-mob(40);
  height: vmin-mob(40);
  margin: vmin-mob(4);
  justify-content: center;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon img {
  width: vmin-mob(40);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon .card-box {
  max-width: vmin-mob(34.78);
  width: fit-content;
  padding: vmin-mob(1.3);
  border-radius: vmin-mob(4.8);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon .card-box .card-img {
  width: vmin-mob(32.17);
  border-radius: vmin-mob(4.8);
  padding-bottom: vmin-mob(30.43);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon .card-box .card-img::before {
  width: 100%;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon .card-box .card-img img {
  width: 100%;
  height: vmin-mob(30.43);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon .card-box .card-platform {
  z-index: 50;
  width: fit-content;
  height: fit-content;
  top: vmin-mob(3);
  border-radius: vmin-mob(1);
  font-size: vmin-mob(4.5);
  line-height: normal;
  padding: vmin-mob(1);
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon .card-box .card-help-block {
  display: flex;
  align-items: center;
  justify-content: center;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .gift-icon .card-box .card-help-block .card-help-name span {
  font-size: vmin-mob(4.5);
  line-height: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .count-block {
  height: vmin-mob(32);
  padding: 0;
}
.mobile-app .publicDialog .checkin-dialog .el-dialog .check-in-block .check-in-content .check-in-detail .check-in-list .check-in-grid .check-in-bg .count-block > span {
  font-size: vmin-mob(14);
}

/*# sourceMappingURL=blue.css.map */