/* 宫格抽奖 start */
/* #region */
.flop_prize_nine_card {
    background-size: 100% 100% !important;
    position: relative;
    width: 16.4rem;
    box-sizing: border-box;
    margin: 0 .8rem;
    overflow: hidden;
  }
  
.flop_prize_nine_card .top {
    position: relative;
    height: 3.6rem;
  }
  
.flop_prize_nine_card .top .winnerList {
    background-size: 100% !important;
    position: absolute;
    left: 0;
    top: .8rem;
    height: 1.2rem;
    width: 10.525rem;
    font-size: .6rem;
    border-radius: 0 .6rem .6rem 0;
    box-shadow: 0 0 .2rem 0;
    line-height: 1.2rem;
    display: flex;
    align-items: center;
  }
  
  .flop_prize_nine_card .top .winnerList marquee {
    flex: 1;
  }

  .flop_prize_nine_card .top .winnerList marquee .listContent {
    display: flex;
  }

  .flop_prize_nine_card .top .winnerList marquee .listContent .list_item {
    margin-right: 1rem;
  }
  
  .flop_prize_nine_card .top .winnerList .trumpet_icon {
    height: .8rem;
    width: .8rem;
    margin: .2rem;
    margin-left: .4rem;
    background: url("../images/common/trumpet.png");
    background-size: auto 100%;
  }
  
  .flop_prize_nine_card .top .ruleEntry {
    position: absolute;
    right: .4rem;
    top: .8rem;
    font-size: .6rem;
    text-align: center;
    box-sizing: border-box;
    line-height: 1.2rem;
    height: 1.2rem;
    width: 3.2rem;
    border-radius: .6rem;
  }
  
  .flop_prize_nine_card .prizeCardContent {
    position: relative;
    height: 15.2rem;
    width: 15.2rem;
    margin: 0 .6rem;
  }
  
  .flop_prize_nine_card .prizeCardContent .prizeBtn {
    position: absolute;
    height: 5.4rem;
    width: 5.4rem;
    top: 4.9rem;
    left: 4.9rem;
  }
  
  .flop_prize_nine_card .prizeCardContent .prizeBtn .btnImg {
    height: 5.4rem;
    width: 5.4rem;
  }
  
  .flop_prize_nine_card .prizeCardContent .prizeCard {
    position: absolute;
    box-sizing: border-box;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden; 
    height: 4.8rem;
    width: 4.8rem;
    border-radius: .6rem;
  }
  
  .flop_prize_nine_card .prizeCardContent .returnImg {
    display: none;
  }
  
  .flop_prize_nine_card .prizeCardContent.turn .prizeCard {
    animation: goCenter 1s;
  }
  
  .flop_prize_nine_card .prizeCardContent.turn .returnImg {
    display: block !important;
  }
  
  .flop_prize_nine_card .prizeCardContent.turn .btnImg {
    display: none;
  }
  
  .flop_prize_nine_card .prizeCardContent .prizeCard.active .cardContent {
    transform: rotateY(180deg);
  }
  
  @keyframes goCenter {
    50% {
      left: 7.6rem;
      top: 7.6rem;
      transform: translate(-50%, -50%);
    }
  }
  
  .flop_prize_nine_card .prizeCardContent .prizeCard .cardContent {
    transition: all linear 0.5s;
    transform-style: preserve-3d;
    position: relative;
  }
  
  .flop_prize_nine_card .prizeCardContent .prizeCard .cardContent .front {
    position: absolute;
    backface-visibility: hidden;
    height: 4.8rem;
    width: 4.8rem;
    transform: rotateY(180deg);
  }
  
  .flop_prize_nine_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .front_img {
    position: absolute;
    height: 4.8rem;
    width: 4.8rem;
  }
  
  .flop_prize_nine_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .prize_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: .6rem;
  }
  
  .flop_prize_nine_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .prize_info
    div {
      display: flex;
      align-items: center;
      justify-content: center;
      height:1.2rem;
  }
  .flop_prize_nine_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .prize_info
  div
  span{
    margin-top:4px;
    width: 4.4rem;
    font-size: .6rem;
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* 限制在两行 */
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
    overflow: hidden;
  }
  
  .flop_prize_nine_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .prize_info
    .prize_img {
    height: 2.8rem;
    width: 2.8rem;
    margin-top: .4rem;
  }
  
  .flop_prize_nine_card .prizeCardContent .prizeCard .cardContent .back {
    position: absolute;
    backface-visibility: hidden;
    height: 4.8rem;
    width: 4.8rem;
  }
  
  .flop_prize_nine_card .bottom {
    position: relative;
  }
  
  .flop_prize_nine_card .bottom .shareInfo {
    margin-bottom: .6rem;
  }
  
  .flop_prize_nine_card .bottom .shareInfo .shareBtn {
    width: 7.1rem;
    font-size: .7rem;
    margin: 0 auto;
    background-size: 100% 100% !important;
    height: 1.8rem;
    border-radius: .9rem;
    line-height: 1.8rem;
    text-align: center;
  }
  
  .flop_prize_nine_card .bottom.isShare .myPrizeInfo {
    margin-top: .4rem;
    margin-bottom: .3rem;
  }
  
  /* .flop_prize_nine_card .bottom.isShare .myPrizeInfo {
    margin: 1.5rem 3.325rem .9rem
  } */
  
  .flop_prize_nine_card .bottom .myPrizeInfo {
    bottom: .85rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.225rem;
    box-sizing: border-box;
    margin: 1.5rem auto .9rem
  }
  
  .flop_prize_nine_card .bottom .myPrizeInfo .prizeTime {
    font-size: .6rem;
    color: rgba(0, 0, 0, 0.6);
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
  }
  
  .flop_prize_nine_card .bottom .myPrizeInfo .myPrize {
    font-size: .6rem;
    color: #761d1d;
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
    border: unset;
  }

  /* #endregion */
/* 宫格抽奖 end */

/* 翻牌抽奖 start */
/* #region */
.new_flop_prize_card {
    background-size: 100% 100% !important;
    position: relative;
    width: 16.4rem;
    box-sizing: border-box;
    margin: 0 .8rem;
    overflow: hidden;
  }
  
.new_flop_prize_card .top {
    position: relative;
    height: 2rem;
  }
  
.new_flop_prize_card .top .winnerList {
    background-size: 100% !important;
    position: absolute;
    left: 0;
    top: .8rem;
    height: 1.2rem;
    width: 10.525rem;
    font-size: .6rem;
    border-radius: 0 .6rem .6rem 0;
    /* box-shadow: 0 0 .2rem 0; */
    line-height: 1.2rem;
    display: flex;
    align-items: center;
  }
  
  .new_flop_prize_card .top .winnerList marquee {
    flex: 1;
  }

  .new_flop_prize_card .top .winnerList marquee .listContent {
    display: flex;
  }

  .new_flop_prize_card .top .winnerList marquee .listContent .list_item {
    margin-right: 1rem;
  }
  
  .new_flop_prize_card .top .winnerList .trumpet_icon {
    height: .8rem;
    width: .8rem;
    margin: .2rem;
    margin-left: .4rem;
    background: url("../images/common/trumpet.png");
    background-size: auto 100%;
  }
  
  .new_flop_prize_card .top .ruleEntry {
    position: absolute;
    right: .4rem;
    top: .8rem;
    font-size: .6rem;
    text-align: center;
    box-sizing: border-box;
    line-height: 1.15rem;
    height: 1.2rem;
    width: 3.2rem;
    border-radius: .6rem;
  }
  
  .new_flop_prize_card .prizeCardContent {
    position: relative;
    height: 13.2rem;
    width: 14.7rem;
    margin: 0.4rem auto .6rem;
  }
  
  .new_flop_prize_card .prizeCardContent .prizeBtn {
    position: absolute;
    height: 5.4rem;
    width: 5.4rem;
    top: 4.9rem;
    left: 4.9rem;
  }
  
  .new_flop_prize_card .prizeCardContent .prizeBtn .btnImg {
    height: 5.4rem;
    width: 5.4rem;
  }
  
  .new_flop_prize_card .prizeCardContent .prizeCard {
    position: absolute;
    box-sizing: border-box;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden; 
    height: 6.4rem;
    width: 4.8rem;
    border-radius: .6rem;
  }
  
  .new_flop_prize_card .prizeCardContent .returnImg {
    display: none;
  }
  
  .new_flop_prize_card .prizeCardContent.turn .prizeCard {
    animation: goCenter 1s;
  }
  
  .new_flop_prize_card .prizeCardContent.turn .returnImg {
    display: block !important;
  }
  
  .new_flop_prize_card .prizeCardContent.turn .btnImg {
    display: none;
  }
  
  .new_flop_prize_card .prizeCardContent .prizeCard.active .cardContent {
    transform: rotateY(180deg);
  }
  
  @keyframes goCenter {
    50% {
      left: 7.6rem;
      top: 7.6rem;
      transform: translate(-50%, -50%);
    }
  }
  
  .new_flop_prize_card .prizeCardContent .prizeCard .cardContent {
    transition: all linear 0.5s;
    transform-style: preserve-3d;
    position: relative;
  }
  
  .new_flop_prize_card .prizeCardContent .prizeCard .cardContent .front {
    position: absolute;
    backface-visibility: hidden;
    height: 6.4rem;
    width: 4.8rem;
    transform: rotateY(180deg);
  }
  
  .new_flop_prize_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .front_img {
    position: absolute;
    height: 6.4rem;
    width: 4.8rem;
  }
  
  .new_flop_prize_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .prize_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: .6rem;
  }
  
  .new_flop_prize_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .prize_info
    div {
      width: 3.75rem;
      height: 1.6rem;
      line-height: 0.8rem;
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2; /* 限制显示两行 */
      white-space: normal; /* 允许换行 */
      text-overflow: ellipsis;
      font-size: .6rem;
      letter-spacing: 0;
      text-align: center;
      font-weight: 500;
      word-break: break-all;
    }
  
  
  .new_flop_prize_card
    .prizeCardContent
    .prizeCard
    .cardContent
    .front
    .prize_info
    .prize_img {
    height: 2.2rem;
    width: 2.2rem;
    margin-top: 1.65rem;
    margin-bottom: .3rem;
  }
  
  .new_flop_prize_card .prizeCardContent .prizeCard .cardContent .back {
    position: absolute;
    backface-visibility: hidden;
    height: 6.4rem;
    width: 4.8rem;
  }
  
  .new_flop_prize_card .bottom {
    position: relative;
  }
  
  .new_flop_prize_card .bottom .shareInfo {
    margin-bottom: .6rem;
  }
  
  .new_flop_prize_card .bottom .shareInfo .shareBtn {
    width: 7.1rem;
    font-size: .7rem;
    margin: 0 auto;
    background-size: 100% 100% !important;
    height: 1.8rem;
    border-radius: .9rem;
    line-height: 1.8rem;
    text-align: center;
  }
  
  .new_flop_prize_card .bottom.isShare .myPrizeInfo {
    margin-top: .4rem;
    margin-bottom: .6rem;
  }
  
  /* .new_flop_prize_card .bottom.isShare .myPrizeInfo {
    margin: 1.5rem 3.325rem .9rem
  } */
  
  .new_flop_prize_card .bottom .myPrizeInfo {
    bottom: .85rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    box-sizing: border-box;
    margin: 0.6rem auto .6rem
  }
  
  .new_flop_prize_card .bottom .myPrizeInfo .prizeTime {
    font-size: .6rem;
    color: rgba(0, 0, 0, 0.6);
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
  }
  
  .new_flop_prize_card .bottom .myPrizeInfo .myPrize {
    font-size: .6rem;
    color: #761d1d;
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
    border: unset;
  }

  /* #endregion */
/* 翻牌抽奖 end */

/* 盲盒抽奖 start */
/* #region */
.new_blind_box_prize_card {
  background-size: 100% 100% !important;
  position: relative;
  width: 16.4rem;
  box-sizing: border-box;
  margin: 0 .8rem;
  overflow: hidden;
}

.new_blind_box_prize_card .top {
  position: relative;
  height: 2rem;
}

.new_blind_box_prize_card .top .winnerList {
  background-size: 100% !important;
  position: absolute;
  left: 0;
  top: .8rem;
  height: 1.2rem;
  width: 10.525rem;
  font-size: .6rem;
  border-radius: 0 .6rem .6rem 0;
  /* box-shadow: 0 0 .2rem 0; */
  line-height: 1.2rem;
  display: flex;
  align-items: center;
}

.new_blind_box_prize_card .top .winnerList marquee {
  flex: 1;
}

.new_blind_box_prize_card .top .winnerList marquee .listContent {
  display: flex;
}

.new_blind_box_prize_card .top .winnerList marquee .listContent .list_item {
  margin-right: 1rem;
}

.new_blind_box_prize_card .top .winnerList .trumpet_icon {
  height: .8rem;
  width: .8rem;
  margin: .2rem;
  margin-left: .4rem;
  background: url("../images/common/trumpet.png");
  background-size: auto 100%;
}

.new_blind_box_prize_card .top .ruleEntry {
  position: absolute;
  right: .4rem;
  top: .8rem;
  font-size: .6rem;
  text-align: center;
  box-sizing: border-box;
  line-height: 1.15rem;
  height: 1.2rem;
  width: 3.2rem;
  border-radius: .6rem;
}

.new_blind_box_prize_card .prizeCardContent {
  position: relative;
  height: 15.2rem;
  width: 15.2rem;
  margin: 0 .6rem;
}

.new_blind_box_prize_card .prizeCardContent .prizeBtn {
  position: absolute;
  height: 10.4rem;
  width: 10.4rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.new_blind_box_prize_card .prizeCardContent .prizeBtn .btnImg {
  height: 5.4rem;
  width: 5.4rem;
}

.new_blind_box_prize_card .prizeCardContent .prizeCard {
  position: absolute;
  box-sizing: border-box;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden; 
  height: 6.4rem;
  width: 4.8rem;
  border-radius: .6rem;
}

.new_blind_box_prize_card .prizeCardContent .returnImg {
  display: none;
}

.new_blind_box_prize_card .prizeCardContent.turn .prizeCard {
  animation: goCenter 1s;
}

.new_blind_box_prize_card .prizeCardContent.turn .returnImg {
  display: block !important;
}

.new_blind_box_prize_card .prizeCardContent.turn .btnImg {
  display: none;
}

.new_blind_box_prize_card .prizeCardContent .prizeCard.active .cardContent {
  transform: rotateY(180deg);
}

@keyframes goCenter {
  50% {
    left: 7.6rem;
    top: 7.6rem;
    transform: translate(-50%, -50%);
  }
}

.new_blind_box_prize_card .prizeCardContent .prizeCard .cardContent {
  transition: all linear 0.5s;
  transform-style: preserve-3d;
  position: relative;
}

.new_blind_box_prize_card .prizeCardContent .prizeCard .cardContent .front {
  position: absolute;
  backface-visibility: hidden;
  height: 6.4rem;
  width: 4.8rem;
  transform: rotateY(180deg);
}

.new_blind_box_prize_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .front_img {
  position: absolute;
  height: 6.4rem;
  width: 4.8rem;
}

.new_blind_box_prize_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .prize_info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: .6rem;
}

.new_blind_box_prize_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .prize_info
  div {
    width: 3.75rem;
    height: 1.6rem;
    overflow: hidden;
    display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2; /* 限制显示两行 */
      white-space: normal; /* 允许换行 */
      text-overflow: ellipsis;
      font-size: .6rem;
      letter-spacing: 0;
      text-align: center;
      font-weight: 400;
  }


.new_blind_box_prize_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .prize_info
  .prize_img {
  height: 2.2rem;
  width: 2.2rem;
  margin-top: 1.65rem;
  margin-bottom: .3rem;
}

.new_blind_box_prize_card .prizeCardContent .prizeCard .cardContent .back {
  position: absolute;
  backface-visibility: hidden;
  height: 6.4rem;
  width: 4.8rem;
}

.new_blind_box_prize_card .bottom {
  position: relative;
}

.new_blind_box_prize_card .bottom .shareInfo {
  margin-bottom: .6rem;
  margin-top: .6rem;
}

.new_blind_box_prize_card .bottom .shareInfo .shareBtn {
  width: 7.1rem;
  font-size: .7rem;
  margin: 0 auto;
  background-size: 100% 100% !important;
  height: 1.8rem;
  border-radius: .9rem;
  line-height: 1.8rem;
  text-align: center;
}

.new_blind_box_prize_card .bottom.isShare .myPrizeInfo {
  margin-top: .4rem;
  /* margin-bottom: .3rem; */
}

/* .new_blind_box_prize_card .bottom.isShare .myPrizeInfo {
  margin: 1.5rem 3.325rem .9rem
} */

.new_blind_box_prize_card .bottom .myPrizeInfo {
  bottom: .85rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  box-sizing: border-box;
  margin: 1.5rem auto 2rem
}

.new_blind_box_prize_card .bottom .myPrizeInfo .prizeTime {
  font-size: .6rem;
  color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
}

.new_blind_box_prize_card .bottom .myPrizeInfo .myPrize {
  font-size: .6rem;
  color: #761d1d;
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
  border: unset;
}

/**style4盲盒渲染样式开始*/

.new_blind_box_prize_card .winParent {
  display: none;
  position: fixed;
  width: 10rem;
  height: 13rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 100;
}

.new_blind_box_prize_card .eggBox,
.new_blind_box_prize_card .win {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  position: relative;
}

.new_blind_box_prize_card .win > img {
  width: 10rem;
  height: 8rem;
  position: absolute;
  transition: all 1s ease 0s;
}

.new_blind_box_prize_card .winParent .boxTop {
  top: 0;
  transform-origin: 100% 100%;
  transform: rotate(25deg);
  animation: image-rotate 2s ease-in-out;
}

.new_blind_box_prize_card .winParent .boxBottom {
  bottom: 0;
}

.new_blind_box_prize_card .winParent .light {
  top: 0.5rem;
  animation: image-scale 2s ease-in-out;
}
@keyframes image-scale {
  0% {
    transform: scale(0.1);
    opacity: 0;
    top: 3rem;
  }

  100% {
    transform: scale(1);
    opacity: 1;
    top: 0.5rem;
  }
}
@keyframes image-rotate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(25deg);
  }
}
.new_blind_box_prize_card_mask{
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100vw;
  height: 100vh;
  background-color: rgba(000, 000, 000, 0.6);
}
/**style4盲盒渲染样式结束*/

/* #endregion */
/* 盲盒抽奖 end */

/* 许愿抽奖 */
/* #region */
.wish_prize {
    background-size: 100% !important;
    position: relative;
    width: 18rem!important;
    padding: 0 .8rem;
    overflow: hidden;
  }
  .wish_prize .top,.wish_prize .wish_lamp_content,.wish_prize .bottom{
    opacity: 1;
  }
  .wish_prize .top {
    position: absolute;
    top: 0;
    width: 100%;
  }
  .wish_prize .top .winnerList {
    background-size: 100% !important;
    position: absolute;
    left: 0;
    top: .6rem;
    height: 1.2rem;
    width: 9.55rem;
    font-size: .6rem;
    border-radius: 0 .6rem .6rem 0;
    line-height: 1.2rem;
    display: flex;
  }
  .wish_prize .top .winnerList .listContent {
    display: flex;
  }
  .wish_prize .top .winnerList .listContent .list_item {
    margin-right: 1rem;
  }
  .wish_prize .top .winnerList .trumpet_icon {
    height: .8rem;
    width: .8rem;
    margin: .2rem;
    margin-left: .4rem;
    background: url('../images/common/trumpet.png');
    background-size: auto 100%;
}
  .wish_prize .top .ruleEntry {
    position: absolute;
    right: .4rem;
    top: .6rem;
    font-size: .6rem;
    text-align: center;
    box-sizing: border-box;
    line-height: 1.2rem;
    height: 1.2rem;
    width: 3.2rem;
    border-radius: .6rem;
    border: .05rem solid;
  }
  .wish_prize .wish_lamp_content {
    display: flex;
    flex-wrap: wrap;
  }

  .wish_prize .wish_lamp_content .lamp_item .turn_on {
    display: none;
  }

  .wish_prize .wish_lamp_content .lamp_item.active .turn_on {
    display: block;
  }

  .wish_prize .wish_lamp_content .lamp_item.active .turn_off {
    display: none;
  }
  .wish_prize .bottom {
    position: absolute;
    bottom: 0;
    width: 100%;
  }
  .wish_prize .bottom .shareInfo {
    margin-bottom: .6rem;
  }
  .wish_prize .bottom .shareInfo .shareBtn {
    margin: 0 auto;
    height: 2rem;
    width: 7.1rem;
    border-radius: 1rem;
    line-height: 2rem;
    text-align: center;
    background-size: 100% 100% !important;
    font-size:0.7rem;
  }
  .wish_prize .bottom .myPrizeInfo {
    margin-bottom: .6rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.225rem;
    box-sizing: border-box;
  }
  .wish_prize .bottom .myPrizeInfo .prizeTime {
    font-size: .6rem;
    letter-spacing: 0;
    color: #fff;
    text-align: center;
    font-weight: 400;
  }
  .wish_prize .bottom .myPrizeInfo .wish_myPrize {
    font-size: .6rem;
    color: #761d1d;
    letter-spacing: 0;
    font-size: .6rem;
    text-align: center;
    font-weight: 400;
    border: unset;
  }
  /* #endregion */
/* 许愿抽奖 end */

/* 火山红包 start*/
/* #region */
:root {
    --volcano-speed: 7s;
  }
  .volcano_envelop_prize .auto_height_img {
    width: 16.4rem;
    max-width: unset;
    height: auto;
  }
  .volcano_envelop_prize .btn_box {
    position: absolute;
    right: 0;
    top: .6rem;
  }
  .volcano_envelop_prize .btn_box .my_prize,
  .volcano_envelop_prize .btn_box .rule_entry {
    width: 1rem;
    height: 1.9rem;
    font-size: .6rem;
    background: rgba(255, 255, 255, 0.3);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: .4rem;
    box-sizing: border-box;
    padding: 0 .25rem;
    border-radius: .4rem 0 0 .4rem;
    color: #fff;
  }
  .volcano_envelop_prize .winnerList {
    background-size: 100% !important;
    position: absolute;
    padding: 0 .4rem;
    box-sizing: border-box;
    left: 0;
    top: .6rem;
    height: 1.2rem;
    width: 9.55rem;
    font-size: .6rem;
    border-radius: 0 .6rem .6rem 0;
    line-height: 1.2rem;
    display: flex;
    align-items: center;
  }
  .volcano_envelop_prize .winnerList marquee {
    flex: 1;
  }
  .volcano_envelop_prize .winnerList marquee .listContent {
    display: flex;
  }
  .volcano_envelop_prize .winnerList marquee .listContent .list_item {
    margin-right: 1rem;
  }
  .volcano_envelop_prize .volcano_mask .fly_circle {
    animation: fly_circle 1s;
    background-size: 100% 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    font-size: 1.5rem;
    color: #FFEFC5;
    position: absolute;
    height: 4.6rem;
    transform-origin: center;
    width: 4.6rem;
  }
  .volcano_envelop_prize .volcano_mask .close_btn {
    z-index: 50;
    position: absolute;
    top: .6rem;
    right: .45rem;
    height: 1.2rem;
    width: 1.2rem;
    background: url("../images/common/close_btn.png");
    background-size: 100%;
  }
  .volcano_envelop_prize .volcano_mask .sound_btn {
    z-index: 50;
    position: absolute;
    top: 2.4rem;
    right: .45rem;
    height: 1.2rem;
    width: 1.2rem;
    background: url("../images/volcanoEnvelop/sound.png");
    background-size: 100%;
  }
  .volcano_envelop_prize .volcano_mask .sound_btn.mute {
    background: url("../images/volcanoEnvelop/sound_mute.png") no-repeat;
    background-size: 100%;
  }
  .volcano_envelop_prize .volcano_mask .time_left {
    position: absolute;
    top: .6rem;
    left: 50%;
    z-index: 50;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  .volcano_envelop_prize .volcano_mask .time_left .tips_text {
    font-size: .8rem;
    color: #ffe9c9;
    text-align: center;
    line-height: 1.1rem;
    font-weight: 400;
  }
  .volcano_envelop_prize .volcano_mask .time_left .time_count {
    font-size: 1.5rem;
    color: #fffeeb;
    font-weight: 500;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 5;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .redbag_content,
  .volcano_envelop_prize .volcano_mask .volcano_content .redbag_ready {
    height: 1.6rem;
    width: 1.6rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .redbag_content .red_bag,
  .volcano_envelop_prize .volcano_mask .volcano_content .redbag_ready .red_bag.clone_red_bag {
    will-change: transform, opacity; /* 提前告知浏览器 */
    backface-visibility: hidden;
    transform: translateZ(0); /* 启用GPU加速 */
    transform: scale(1);
    animation: fly_click_red_bag var(--volcano-speed);
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .redbag_ready .red_bag.clone_red_bag {
    max-width: unset;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .redbag_ready .red_bag {
    z-index: 5;
    transition: all linear var(--volcano-speed);
    position: absolute;
    transform-origin: bottom;
    height: 1.6rem;
    width: 1.6rem;
    left: 0;
    bottom: 0;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .volcano_body {
    position: relative;
    z-index: 100;
    width: 100%;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .ready_content .ready_tips {
    z-index: 20;
    bottom: 10.35rem;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    font-size: .75rem;
    color: #fff;
    opacity: 0.9;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .ready_content .click_hand {
    animation: hand 3s linear;
    z-index: 10;
    visibility: hidden;
    position: absolute;
    height: 4rem;
    width: 4rem;
    bottom: 9rem;
    left: 11.75rem;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .ready_content .fly_redbag {
    animation: fly_redbag 3s linear;
    position: absolute;
    visibility: hidden;
    transform: rotateZ(30deg);
    height: 1.6rem;
    width: 1.6rem;
    left: 8rem;
    bottom: 7.5rem;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .ready_content .click_circle {
    animation: circle 3s linear;
    transition: all 1s;
    position: absolute;
    height: 4.6rem;
    width: 4.6rem;
    visibility: hidden;
    left: 9.75rem;
    bottom: 9.9rem;
    transform-origin: center;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .ready_content .count_down {
    transition: all 0.8s;
    position: absolute;
    bottom: 50vh;
    left: 50%;
    transform: translateX(-50%) scale(1);
    font-size: 6rem;
    color: #ffffff;
    font-weight: 600;
    text-shadow: 0 0 1rem #FFDA6D;
    text-align: center;
    transform-origin: center;
  }
  .volcano_envelop_prize .volcano_mask .volcano_content .ready_content .count_down.to_hide {
    transform: translateX(-50%) scale(0);
  }
  .volcano_prize_box_mask {
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    align-items: center;
    position: fixed;
    height: 100vh;
    width: 100vw;
    top: 0;
    left: 0;
  }
  .volcano_prize_box_mask .lottery_box {
    position: relative;
    /* left: 50%;
    top: 50%;
    transform: translate(-50%,-50%); */
  }
  .volcano_prize_box_mask .lottery_box .prize_box {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 20rem;
    width: 18rem;
    background-size: 100% 100% !important;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_info {
    height: 1.3rem;
    opacity: 0.9;
    position: relative;
    margin-top: 4.75rem;
    font-size: .9rem;
    color: #000000;
    text-align: center;
    line-height: 1.3rem;
    font-weight: 600;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_list {
    height: 8rem;
    margin-top: .5rem;
    overflow-y: scroll;
    overflow-x: hidden;
    width: 12.9rem;
    padding: 0 1.05rem;
    box-sizing: border-box;
  }

  .volcano_prize_box_mask .lottery_box .prize_box .prize_list::-webkit-scrollbar {
    width: .2rem;
    height: .6rem;
    color: #feb3ba;
}

    .volcano_prize_box_mask .lottery_box .prize_box .prize_list::-webkit-scrollbar-thumb {
    border-radius: .2rem;
    background-color: #feb3ba;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_list .prize_item {
    background-color: #fff;
    border-radius: .6rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    padding: .4rem .6rem;
    margin-bottom: .4rem;
    width: 10.8rem;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_list .prize_item:last-child {
    margin-bottom: 0;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_list .prize_item .prize_pic {
    height: 1.6rem;
    width: 1.6rem;
    margin-right: .6rem;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_list .prize_item .prize_name {
    display: flex;
    align-items: center;
    flex: 1;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_list .prize_item .prize_name span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .6rem;
    line-height: .8rem;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .prize_btn {
    height: 1.8rem;
    width: 6rem;
    margin-top: 2.5rem;
    border-radius: .9rem;
    line-height: 1.8rem;
    font-size: .8rem;
    color: #f12225;
    text-align: center;
    font-weight: 400;
  }
  .volcano_prize_box_mask .lottery_box .prize_box .close_btn {
    position: absolute;
    height: 1.8rem;
    width: 1.8rem;
    background: url("../images/common/close_btn.png");
    background-size: 100%;
    bottom: -3rem;
  }
  .volcano_prize_box_mask .lottery_box .prize_box.un_prize {
    height: 18rem;
  }
  .volcano_prize_box_mask .lottery_box .prize_box.un_prize .prize_info {
    width: 10.2rem;
    height: 2.2rem;
    opacity: 0.9;
    position: relative;
    margin-top: 7.5rem;
    display: flex;
    align-items: center;
    font-size: .8rem;
    color: #000000;
    text-align: center;
    line-height: 1.3rem;
  }
  .volcano_prize_box_mask .lottery_box .prize_box.un_prize .prize_info span {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .volcano_prize_box_mask .lottery_box .prize_box.un_prize .prize_list {
    display: none;
  }
  .volcano_prize_box_mask .lottery_box .prize_box.un_prize .prize_btn {
    height: 1.8rem;
    width: 6rem;
    margin-top: 3.75rem;
    border-radius: .9rem;
    line-height: 1.8rem;
    font-size: .8rem;
    color: #f12225;
    text-align: center;
    font-weight: 400;
  }
  .volcano_prize_box_mask .lottery_box .prize_box.un_prize .close_btn {
    position: absolute;
    height: 1.8rem;
    width: 1.8rem;
    bottom: -1.5rem;
  }
  .volcano_prize_box_mask .lottery_box .msg_box {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 18rem;
    width: 18rem;
    background: url("../images/common/is_pass.png");
    background-size: 100% 100% !important;
  }
  .volcano_prize_box_mask .lottery_box .msg_box .msg_info {
    height: 2.6rem;
    width: 10.8rem;
    margin-top: 6.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .volcano_prize_box_mask .lottery_box .msg_box .msg_info span {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .8rem;
    color: rgba(0, 0, 0, 0.9);
    text-align: center;
    line-height: 1.3rem;
    font-weight: 500;
  }
  .volcano_prize_box_mask .lottery_box .msg_box .msg_btn {
    margin-top: 1.2rem;
    height: 1.8rem;
    width: 6rem;
    border-radius: .9rem;
    text-align: center;
    line-height: 1.8rem;
    font-size: .8rem;
    color: rgba(255, 255, 255, 0.9);
    background-image: linear-gradient(180deg, #f34c3a 0%, #f26701 100%);
  }
  .volcano_prize_box_mask .lottery_box .msg_box .close_btn {
    height: 1.8rem;
    width: 1.8rem;
    margin-top: 2.4rem;
  }
  @keyframes hand {
    0% {
      visibility: visible;
      left: 15rem;
      bottom: 4rem;
    }
    30% {
      height: 4rem;
      width: 4rem;
      bottom: 9rem;
      left: 11.75rem;
    }
    50% {
      height: 4rem;
      width: 4rem;
      bottom: 9rem;
      left: 11.75rem;
    }
  }
  @keyframes fly_click_red_bag {
    0% {
      height: 1.6rem;
      width: 1.6rem
    }
    30% {
      height: 2.8rem;
      width: 2.8rem;
    }
    100% {
      height: 2.8rem;
      width: 2.8rem;
    }
  }
  @keyframes fly_redbag {
    0% {
      transform: rotateZ(0deg);
      visibility: visible;
      height: 1.6rem;
      width: 1.6rem;
      left: 8rem;
      bottom: 7.5rem;
    }
    33% {
      transform: rotateZ(30deg);
      height: 2rem;
      width: 2rem;
      left: 11.25rem;
      bottom: 11.1rem;
    }
    50% {
      visibility: hidden;
      transform: rotateZ(30deg);
      height: 2rem;
      width: 2rem;
      left: 11.25rem;
      bottom: 11.1rem;
    }
  }
  @keyframes circle {
    0% {
      visibility: visible;
      height: 4.6rem;
      width: 4.6rem;
      opacity: 1;
      transform: scale(0);
    }
    50% {
      height: 4.6rem;
      width: 4.6rem;
      transform: scale(0);
    }
    65% {
      transform: scale(1);
      visibility: hidden;
    }
    100% {
      visibility: hidden;
      transform: scale(1);
    }
  }
  @keyframes fly_circle {
    0% {
      height: 4.6rem;
      width: 4.6rem;
      transform: scale(0);
    }
    100% {
      height: 4.6rem;
      width: 4.6rem;
      transform: scale(1);
    }
  }
  /* #endregion */
/* 火山红包 end */

/* 我的奖品 start */
/* #region */
@keyframes rise {
    0% {
      bottom: -62.25vh;
    }
  }
  @keyframes down {
    0% {
      bottom: 0;
    }
  }
  @keyframes bgRise {
    0% {
      background-color: rgba(0, 0, 0, 0);
    }
  }
  @keyframes bgDown {
    0% {
      background-color: rgba(0, 0, 0, 0.5);
    }
  }
  .my_prize_mask {
    animation: bgRise ease-out 0.3s;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    align-items: flex-end;
    position: fixed;
    height: 100vh;
    width: 100vw;
    top: 0;
    left: 0;
  }
  .my_prize_mask.closing {
    animation: bgDown ease-in 0.3s;
    background-color: rgba(0, 0, 0, 0);
  }
  .my_prize_mask.closing .my_prize_content {
    animation: down 0.3s;
    bottom: -62.25vh;
  }
  .my_prize_mask .my_prize_content {
    bottom: 0;
    animation: rise 0.3s;
    position: relative;
    box-sizing: border-box;
    padding: 0 .8rem;
    height: 62.5vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    border-top-left-radius: .8rem;
    border-top-right-radius: .8rem;
  }
  .my_prize_mask .my_prize_content.hasAddressTip {
    height: 70vh;
    padding: 0;
  }
  .my_prize_mask .my_prize_content .top {
    margin-top: .4rem;
    position: relative;
    height: 2.8rem;
  }
  .my_prize_mask .my_prize_content.hasAddressTip .top {
    padding: 0 0.8rem;
    box-sizing: border-box;
  }
  .my_prize_mask .my_prize_content .top .title {
    font-size: 1rem;
    color: #000000;
    font-family: HONORSansBrand-Demibold;
    text-align: left;
    line-height: 1.2rem;
    font-weight: 500;
    margin-top: .65rem;
  }
  .my_prize_mask .my_prize_content .top .tips {
    font-size: .6rem;
    color: rgba(0, 0, 0, 0.6);
    text-align: left;
    line-height: 1.2rem;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .my_prize_mask .my_prize_content .top .close_btn {
    position: absolute;
    top: .7rem;
    right: 0;
    height: 1.2rem;
    width: 1.2rem;
    background: url('../images/common/close_my_prize.png');
    background-size: 100%;
  }
  .my_prize_mask .my_prize_content.hasAddressTip .top .close_btn {
    right: 0.8rem;
  }
  /* 2.5.5.301 myhonor邀请有礼添加地址提示信息 start */
  .my_prize_mask .center {
    width: 100%;
    height: 2.8rem;
    padding: .5rem .8rem;
    background: rgba(34, 34, 37, .05);
    box-sizing: border-box;
    position: relative;
  }
  .my_prize_mask .center .myhonor_address {
    width: 13rem;
  }
  .my_prize_mask .myhonor_address .invitation_address_tip {
    width: 100%;
    height: .8rem;
    line-height: .8rem;
    text-align: right;
    color: #000000;
    font-size: .6rem;
    position: relative;
  }
  .my_prize_mask .myhonor_address .invitation_address_tip::after {
    content: '';
    width: .7rem;
    height: .7rem;
    background: url('../images/common/address_tip.png') no-repeat;
    background-size: 100% auto;
    position: absolute;
    left: 0;
    top: 0;
  }
  .my_prize_mask .myhonor_address .shop_query_prize_info {
    width: 100%;
    height: .8rem;
    line-height: .8rem;
    text-align: left;
    color: rgba(0, 0, 0 , .6);
    font-size: .5rem;
  }
  .my_prize_mask .go_shop_address_page {
    height: .8rem;
    line-height: .8rem;
    text-align: center;
    color: #CA0003;
    font-size: .6rem;
    position: absolute;
    top: .5rem;
    right: .8rem;
  }
  .my_prize_mask .go_shop_address_page::after {
    content: '';
    width: .2rem;
    height: .35rem;
    background: url('../images/common/go_address.png') no-repeat;
    background-size: 100% auto;
    position: absolute;
    top: 50%;
    right: -0.35rem;
    transform: translateY(-50%);
  }
  /* 2.5.5.301 myhonor邀请有礼添加地址提示信息 end */
  .my_prize_mask .my_prize_content .bottom {
    flex: 1;
    overflow-y: scroll;
    margin: 0 -0.6rem;
    padding: .6rem;
  }

  .my_prize_mask .my_prize_content.hasAddressTip .bottom {
    padding: .6rem 1.4rem;
  }

  .my_prize_mask .my_prize_content .bottom::-webkit-scrollbar {
    width: .2rem;
    height: .6rem;
    color: #ccc;
}

.my_prize_mask .my_prize_content .bottom::-webkit-scrollbar-thumb {
    border-radius: .2rem;
    background-color: #ccc;
  }


  .my_prize_mask .my_prize_content .bottom .empty {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: .8rem;
    justify-content: center;
    align-items: center;
  }
  .my_prize_mask .my_prize_content .bottom .empty .empty_img {
    height: 4.4rem;
    width: 4.4rem;
    background: url('../images/common/my_prize_empty.png') center 100%/100% no-repeat;
  }
  .my_prize_mask .my_prize_content .bottom .empty .tips {
    font-size: .7rem;
    color: #666;
  }
  
  .my_prize_mask .my_prize_content .bottom .prize_item {
    box-sizing: border-box;
    padding: .5rem 0;
    display: flex;
    align-items: center;
  }
  .my_prize_mask .my_prize_content .bottom .prize_item .prize_item_img{
    height: 2rem;
    width: 2rem;
    margin-right: .4rem;
  }
  .my_prize_mask .my_prize_content .bottom .prize_item .prize_item_info {
    flex: 1;
  }
  .my_prize_mask .my_prize_content .bottom .prize_item .prize_item_info .prize_name {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    font-size: .8rem;
    color: #000000;
    letter-spacing: 0;
    line-height: 1.1rem;
    font-weight: 400;
    width:10.5rem;
  }
  .my_prize_mask .my_prize_content .bottom .prize_item .prize_item_info .time {
    font-size: .7rem;
    color: rgba(0, 0, 0, 0.6);
    letter-spacing: 0;
    line-height: 1rem;
    font-weight: 400;
  }
  .my_prize_mask .my_prize_content .bottom .prize_item .operate {
    width: 3.7rem;
    height: 1.4rem;
    background-color: #fe2b49;
    color: #fff;
    border-radius: .7rem;
    font-size: .7rem;
    line-height: 1.4rem;
    text-align: center;
  }
/* #endregion */
/* 我的奖品 end */

/* 弹窗 start */
/* #region */
.lottery_box_mask {
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    align-items: center;
    position: fixed;
    height: 100vh;
    width: 100vw; 
    top: 0;
    left: 0;
}

.lottery_box_mask .lottery_box .msg_box {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 18rem;
    width: 18rem;
    background: url('../images/common/is_pass.png');
    background-size: 100% 100%!important;
}

.lottery_box_mask .lottery_box .msg_box .msg_info_container{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.8rem;
  width: 11.6rem;
  margin-top: 6.5rem;
  margin-bottom: 0.6rem;
  text-align: center;
}

.lottery_box_mask .lottery_box .msg_box .msg_info {
  font-family: HONORSansBrand-Demibold;
  font-size: .8rem;
  font-weight: 500;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.lottery_box_mask .lottery_box .msg_box .msg_btn {
    height: 1.8rem;
    width: 6rem;
    font-size: .8rem;
    font-weight: 500;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    text-overflow:ellipsis;
    margin-bottom: 2rem;
    background: #FFE3A4;
    border-radius: .9rem;
    line-height: 1.8rem;
    color: #7B4C3B;
    text-align: center;
}

.lottery_box_mask .lottery_box .msg_box .close_btn {
    height: 1.8rem;
    width: 1.8rem;
    background: url('../images/common/close_btn.png');
    background-size: 100%;
}

.lottery_box_mask .lottery_box {
    position: relative;
    /* left: 50%;
    top: 50%;
    transform: translate(-50%,-50%); */
}

.lottery_box_mask .lottery_box .rule_box .close_btn {
    left: 50%;
    transform: translateX(-50%);
    bottom: -0.9rem;
    position: absolute;
    height: 1.8rem;
    width: 1.8rem;
    background: url('../images/common/close_btn.png');
    background-size: 100%;
}

.lottery_box_mask .lottery_box .rule_box {
    display: flex;
    justify-content: center;
    height: 22rem;
    width: 18rem;
    background-size: 100% 100%!important;
}

.lottery_box_mask .lottery_box .prize_box {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 18rem;
    width: 18rem;
    background-size: 100% 100%!important;
}

 .lottery_box_mask .lottery_box .prize_box.un_prize .prize_info {
    color: #000;
    margin-top: 6rem;
    margin-bottom: 0.6rem;
    display: flex;
    align-items: center;
    height: 3.15rem;
 }

 .lottery_box_mask .lottery_box .prize_box.un_prize .prize_info .prize_info_text {
    font-size: .9rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: HONORSansBrand-Demibold;
    text-overflow: ellipsis;
 }

.lottery_box_mask .lottery_box .prize_box.un_prize .prize_tips {
    height: 1.5rem;
    margin-bottom: .6rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }
  

.lottery_box_mask .lottery_box .prize_box.un_prize .prize_img {
    display: none;
  }

.lottery_box_mask .lottery_box .prize_box .prize_img {
    height: 4.8rem;
    width: 4.8rem;
    margin-bottom: 1.4rem;
}

.lottery_box_mask .lottery_box .prize_box .prize_img[src=""] {
    opacity: 0;
}

.lottery_box_mask .lottery_box .prize_box .prize_img:not([src]) {
    opacity: 0;
}


.lottery_box_mask .lottery_box .prize_box .prize_info {
    height: 3.15rem;
    width: 11.6rem;
    font-size: .9rem;
    margin-bottom: 0.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lottery_box_mask .lottery_box .prize_box .prize_info .prize_info_text{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  font-family: HONORSansBrand-Demibold;
  text-align: center;
  word-break: break-all;
  white-space: normal;
}

.lottery_box_mask .lottery_box .prize_box .prize_tips {
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size: .6rem;
    height: 1.5rem;
    width: 11.6rem;
    text-align: center;
    margin-bottom: .6rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.lottery_box_mask .lottery_box .prize_box .prize_btn {
    height: 1.8rem;
    width: 6rem;
    margin-bottom: 2rem;
    display: flex;
    font-size: .8rem;
    font-family: HONORSansBrand-Demibold;
    border-radius: .9rem;
    align-items: center;
    justify-content: center;
}

.lottery_box_mask .lottery_box .prize_box .close_btn {
    height: 1.8rem;
    width: 1.8rem;
    background: url('../images/common/close_btn.png');
    background-size: 100%;
}

.lottery_box_mask .lottery_box .rule_box .rule_box_content{
    height: 13.3rem;
    width: 12.8rem;
    padding: 0 .7rem;
    box-sizing: border-box;
    margin-top: 5.65rem;
    font-size: .6rem;
    overflow-y: scroll;
}

.lottery_box_mask .lottery_box .rule_box .rule_box_content::-webkit-scrollbar {
    width: .2rem;
    height: .6rem;
    color: #d1ba87;
}

.lottery_box_mask .lottery_box .rule_box .rule_box_content::-webkit-scrollbar-thumb {
    border-radius: .2rem;
    background-color: #d1ba87;
  }

.lottery_box .rule_box .rule_bg {
    position: absolute;
    height: 24rem;
    width: 18rem;
}
/* #endregion */
/* 弹窗 end */

#ecWap-box-bg-no_link {
    z-index: 10000!important;
}

.no_link {
    z-index: 10001!important;
}

.lottery,
.lottery div {
        box-sizing: border-box;
}
.lottery .topBox {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: .6rem;
    font-size: .4rem;
    height: 1.2rem;
}

.lottery .topBox > div:last-child,
.myPrize {
    opacity: 1;
    border-radius: .6rem;
    border: .05rem solid;
}

.lottery .topBox > div:first-child {
    border-radius: 0 .6rem .6rem 0;
    border-left: none;
    padding: .2rem .4rem;
}

.lottery .topBox .option {
    position: relative;
}
.lottery .topBox .myPrize {
    position: absolute;
    top: 1.5rem;
    right: 0;
    white-space: nowrap;
    z-index: 999;
}

.lottery .turnTable {
    position: relative;
    width: 14rem;
    height: 14rem;
    border-radius: 50%;
    clip-path: circle(50% at center);
}

.lottery .number {
    font-size: .6rem;
    color: #ffffff;
    line-height: .8rem;
    text-align: center;
}

.lottery .container {
    width: 14rem;
    height: 14rem;
    border-radius: 50%;
    background-size: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    /*扇形区*/
    /* 奖品区 */
    /* 奖品内容 */
}

.lottery .container .turntable {
    width: 14rem;
    height: 14rem;
    border-radius: 50%;
    position: absolute;
    overflow: hidden;
}

.lottery .container .prize-container {
    width: 14rem;
    height: 14rem;
    position: absolute;
    left: 50%;
    top: -50%;
    /*600-280/2,将prize正方形左下角点对准圆心*/
    /*以正方形左下角为中心旋转，0% 100%即左下角的坐标*/
    transform-origin: 0 100%;
}

.lottery .container .prize-container:nth-child(1) {
    transform: rotate(0deg) skewY(-45deg);
}

.lottery .container .prize-container:nth-child(2) {
    transform: rotate(45deg) skewY(-45deg);
}

.lottery .container .prize-container:nth-child(3) {
    transform: rotate(90deg) skewY(-45deg);
}

.lottery .container .prize-container:nth-child(4) {
    transform: rotate(135deg) skewY(-45deg);
}

.lottery .container .prize-container:nth-child(5) {
    transform: rotate(180deg) skewY(-45deg);
}

.lottery .container .prize-container:nth-child(6) {
    transform: rotate(225deg) skewY(-45deg);
}

.lottery .container .prize-container:nth-child(7) {
    transform: rotate(270deg) skewY(-45deg);
}

.lottery .container .prize-container:nth-child(8) {
    transform: rotate(315deg) skewY(-45deg);
}

.lottery .container .prize {
    width: 7rem;
    height: 7rem;
    position: absolute;
    left: 50%;
    top: 0;
    transform-origin: 0 100%;
}

.lottery .container .prize .img {
    width: 1.4rem;
    height: 1.4rem;
    margin-top: .4rem;
}

.lottery .container .prize .img img {
    width: 100%;
    height: 100%;
}

.lottery .container .prize-child {
    width: 50%;
    justify-content: flex-start;
    padding-left: 0;
    padding-top: 1.65rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: .5rem;
    transform: rotate(25.5deg) translateX(-8%) translateY(10%);
}

.lottery .container .prize:nth-child(1) {
    transform: rotate(0deg);
}

.lottery .container .prize:nth-child(2) {
    transform: rotate(45deg);
}

.lottery .container .prize:nth-child(3) {
    transform: rotate(90deg);
}

.lottery .container .prize:nth-child(4) {
    transform: rotate(135deg);
}

.lottery .container .prize:nth-child(5) {
    transform: rotate(180deg);
}

.lottery .container .prize:nth-child(6) {
    transform: rotate(225deg);
}

.lottery .container .prize:nth-child(7) {
    transform: rotate(270deg);
}

.lottery .container .prize:nth-child(8) {
    transform: rotate(315deg);
}

.lottery .container .draw-btn {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background-color: red;
    color: white;
    font-size: 1.5rem;
    line-height: 4rem;
    text-align: center;
    position: absolute;
}

.textEllipsis {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .6rem;
}

/* 转盘抽奖 */

.new_truntable_card {
  background-size: 100% 100% !important;
  position: relative;
  width: 16.4rem;
  box-sizing: border-box;
  margin: 0 .8rem;
  overflow: hidden;
}

.new_truntable_card .top {
  position: relative;
  height: 2rem;
}

.new_truntable_card .top .winnerList {
  background-size: 100% !important;
  position: absolute;
  left: 0;
  top: .8rem;
  height: 1.2rem;
  width: 10.525rem;
  font-size: .6rem;
  border-radius: 0 .6rem .6rem 0;
  /* box-shadow: 0 0 .2rem 0; */
  line-height: 1.2rem;
  display: flex;
  align-items: center;
}

.new_truntable_card .top .winnerList marquee {
  flex: 1;
}

.new_truntable_card .top .winnerList marquee .listContent {
  display: flex;
}

.new_truntable_card .top .winnerList marquee .listContent .list_item {
  margin-right: 1rem;
}

.new_truntable_card .top .winnerList .trumpet_icon {
  height: .8rem;
  width: .8rem;
  margin: .2rem;
  margin-left: .4rem;
  background: url("../images/common/trumpet.png");
  background-size: auto 100%;
}

.new_truntable_card .top .ruleEntry {
  position: absolute;
  right: .4rem;
  top: .8rem;
  font-size: .6rem;
  text-align: center;
  box-sizing: border-box;
  line-height: 1.15rem;
  height: 1.2rem;
  width: 3.2rem;
  border-radius: .6rem;
}

.new_truntable_card .prizeCardContent {
  position: relative;
  height: 14rem;
  width: 14rem;
  margin-top: 1rem;
  margin-bottom: 0.6rem;
  left: 50%;
  transform: translate(-50%);
}

.new_truntable_card .prizeCardContent .prizeBtn {
  position: absolute;
  height: 5.4rem;
  width: 5.4rem;
  top: 4.9rem;
  left: 4.9rem;
}

.new_truntable_card .prizeCardContent .prizeBtn .btnImg {
  height: 5.4rem;
  width: 5.4rem;
}

.new_truntable_card .prizeCardContent .prizeCard {
  position: absolute;
  box-sizing: border-box;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden; 
  height: 6.4rem;
  width: 4.8rem;
  border-radius: .6rem;
}

.new_truntable_card .prizeCardContent .returnImg {
  display: none;
}

.new_truntable_card .prizeCardContent.turn .prizeCard {
  animation: goCenter 1s;
}

.new_truntable_card .prizeCardContent.turn .returnImg {
  display: block !important;
}

.new_truntable_card .prizeCardContent.turn .btnImg {
  display: none;
}

.new_truntable_card .prizeCardContent .prizeCard.active .cardContent {
  transform: rotateY(180deg);
}

@keyframes goCenter {
  50% {
    left: 7.6rem;
    top: 7.6rem;
    transform: translate(-50%, -50%);
  }
}

.new_truntable_card .prizeCardContent .prizeCard .cardContent {
  transition: all linear 0.5s;
  transform-style: preserve-3d;
  position: relative;
}

.new_truntable_card .prizeCardContent .prizeCard .cardContent .front {
  position: absolute;
  backface-visibility: hidden;
  height: 6.4rem;
  width: 4.8rem;
  transform: rotateY(180deg);
}

.new_truntable_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .front_img {
  position: absolute;
  height: 6.4rem;
  width: 4.8rem;
}

.new_truntable_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .prize_info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: .6rem;
}

.new_truntable_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .prize_info
  div {
    width: 3.75rem;
    height: 1.6rem;
    overflow: hidden;
    display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2; /* 限制显示两行 */
      white-space: normal; /* 允许换行 */
      text-overflow: ellipsis;
      font-size: .6rem;
      letter-spacing: 0;
      text-align: center;
      font-weight: 400;
  }


.new_truntable_card
  .prizeCardContent
  .prizeCard
  .cardContent
  .front
  .prize_info
  .prize_img {
  height: 2.2rem;
  width: 2.2rem;
  margin-top: 1.65rem;
  margin-bottom: .3rem;
}

.new_truntable_card .prizeCardContent .prizeCard .cardContent .back {
  position: absolute;
  backface-visibility: hidden;
  height: 6.4rem;
  width: 4.8rem;
}

.new_truntable_card .bottom {
  position: relative;
}

.new_truntable_card .bottom .shareInfo {
  margin-bottom: .6rem;
}

.new_truntable_card .bottom .shareInfo .shareBtn {
  width: 7.1rem;
  font-size: .7rem;
  margin: 0 auto;
  background-size: 100% 100% !important;
  height: 1.8rem;
  border-radius: .9rem;
  line-height: 1.8rem;
  text-align: center;
}

.new_truntable_card .bottom.isShare .myPrizeInfo {
  margin-top: .4rem;
  margin-bottom: .6rem;
}

/* .new_truntable_card .bottom.isShare .myPrizeInfo {
  margin: 1.5rem 3.325rem .9rem
} */

.new_truntable_card .bottom .myPrizeInfo {
  bottom: .85rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  box-sizing: border-box;
  margin: 0.6rem auto .6rem
}

.new_truntable_card .bottom .myPrizeInfo .prizeTime {
  font-size: .6rem;
  color: rgba(0, 0, 0, 0.6);
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
}

.new_truntable_card .bottom .myPrizeInfo .myPrize {
  font-size: .6rem;
  color: #761d1d;
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
  border: unset;
}

.new_truntable_card .turnTable {
    position: relative;
    width: 14rem;
    height: 14rem;
    border-radius: 50%;
    clip-path: circle(50% at center);
  }
  
  .new_truntable_card .number {
    font-size: 0.6rem;
    color: #ffffff;
    line-height: 0.8rem;
    text-align: center;
  }
  
  .new_truntable_card .container {
    width: 14rem;
    height: 14rem;
    border-radius: 50%;
    background-size: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    /*扇形区*/
    /* 奖品区 */
    /* 奖品内容 */
  }
  
  .new_truntable_card .container .turntable {
    width: 14rem;
    height: 14rem;
    border-radius: 50%;
    position: absolute;
    overflow: hidden;
  }
  
  .new_truntable_card .container .prize-container {
    width: 14rem;
    height: 14rem;
    position: absolute;
    left: 50%;
    top: -50%;
    /*600-280/2,将prize正方形左下角点对准圆心*/
    /*以正方形左下角为中心旋转，0% 100%即左下角的坐标*/
    transform-origin: 0 100%;
  }
  
  .new_truntable_card .container .prize-container:nth-child(1) {
    transform: rotate(0deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize-container:nth-child(2) {
    transform: rotate(45deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize-container:nth-child(3) {
    transform: rotate(90deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize-container:nth-child(4) {
    transform: rotate(135deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize-container:nth-child(5) {
    transform: rotate(180deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize-container:nth-child(6) {
    transform: rotate(225deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize-container:nth-child(7) {
    transform: rotate(270deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize-container:nth-child(8) {
    transform: rotate(315deg) skewY(-45deg);
  }
  
  .new_truntable_card .container .prize {
    width: 7rem;
    height: 7rem;
    position: absolute;
    left: 50%;
    top: 0;
    transform-origin: 0 100%;
  }
  
  .new_truntable_card .container .prize .img {
    width: 1.4rem;
    height: 1.4rem;
    margin-top: 0.4rem;
  }
  
  .new_truntable_card .container .prize .img img {
    width: 100%;
    height: 100%;
  }
  
  .new_truntable_card .container .prize-child {
    margin-left: -0.3rem;
    width: 50%;
    justify-content: flex-start;
    padding-left: 0;
    padding-top: 1.45rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 0.5rem;
    transform: rotate(25.5deg) translateX(-8%) translateY(10%);
  }
  
  .new_truntable_card .container .prize:nth-child(1) {
    transform: rotate(0deg);
  }
  
  .new_truntable_card .container .prize:nth-child(2) {
    transform: rotate(45deg);
  }
  
  .new_truntable_card .container .prize:nth-child(3) {
    transform: rotate(90deg);
  }
  
  .new_truntable_card .container .prize:nth-child(4) {
    transform: rotate(135deg);
  }
  
  .new_truntable_card .container .prize:nth-child(5) {
    transform: rotate(180deg);
  }
  
  .new_truntable_card .container .prize:nth-child(6) {
    transform: rotate(225deg);
  }
  
  .new_truntable_card .container .prize:nth-child(7) {
    transform: rotate(270deg);
  }
  
  .new_truntable_card .container .prize:nth-child(8) {
    transform: rotate(315deg);
  }
  
  .new_truntable_card .container .draw-btn {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background-color: red;
    color: white;
    font-size: 1.5rem;
    line-height: 4rem;
    text-align: center;
    position: absolute;
  }
  
  .new_truntable_card .mystery-row {
    position: absolute;
    width: 100%;
    height: 0.8rem;
    bottom: 1.2rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.6rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .new_truntable_card .mystery-row .mr-24 {
    margin-right: 1.2rem;
  }
  
  .new_truntable_card .twister-row {
    position: absolute;
    width: 100%;
    height: 0.8rem;
    bottom: 2.8rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.6rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .new_truntable_card .twister-row .mr-24 {
    margin-right: 1.2rem;
  }
  
  .new_truntable_card .textEllipsis {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.4rem;
    font-weight: 400;
    word-break: break-all;
  }

.mod-lottery .openBtn {
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.9rem;
    height: 3.2rem;
    transform: translate(-50%,-50%);
    z-index: 998;
}

.maskParent {
    position: fixed;
    background: rgba(000, 000, 000, .6);
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1999;
    display: none;
}

.mask {
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    overflow: auto;
}

.prop {
    width: 13.2rem;
    height: 20rem;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
}
.propContent.flexBetween {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.propContent .content {
    margin-top: 1.3rem;
    width: 10.8rem;
    height: 13.3rem;
    overflow-y: scroll;
    opacity: 0.9;
    font-family: HONORSansBrand-Regular;
    font-size: .6rem;
    color: #000000;
    letter-spacing: 0;
    line-height: .8rem;
    font-weight: 400;
}

.propContent > div {
    width: 100%;
}

.close {
    width: 1.8rem;
    height: 1.8rem;
}

.prizeName,
.prop-title {
    opacity: 0.9;
    font-family: HONORSansBrand-DemiBold;
    font-size: .8rem;
    color: #000000;
    text-align: center;
    line-height: 1.3rem;
    font-weight: 600;
}
.prop-title{
    font-family: HONORSansBrand-Regular;
}

.prop-tip {
    opacity: 0.6;
    font-family: HONORSansBrand-Regular;
    font-size: .6rem;
    color: #000000;
    text-align: center;
    line-height: .8rem;
    font-weight: 400;
}

.prop-between {
    margin-top: .6rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .8rem;
}

.prop-btn {
    /* ## width: 5rem; */
    flex: 1;
    border-radius: .9rem;
    height: 1.8rem;
    line-height: 1.8rem;
    text-align: center;
    background: #f6f6f6;
    font-family: HONORSansBrand-DemiBold;
    font-size: .7rem;
    color: rgba(0,0,0,.6);
}

.mask > div {
    display: none;
    border-radius: .8rem;
}

.easyProp {
    background: #fff;
    width: 16.4rem;
    box-sizing: border-box;
    padding: 2rem 1.2rem 1.5rem;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    border-radius: .8rem;
}

.btn-long {
    width: 10.4rem;
    height: 1.8rem;
    border-radius: .9rem;
    margin: 0 auto;
    margin-Top: 1.5rem;
    line-height: 1.8rem;
    text-align: center;
    font-size:.7rem;
    color: #fff;
}

.myPrizeProp {
    width: 100%;
    height: 70%;
    position: absolute;
    left: 0;
    bottom: 0;
    padding: .4rem 0;
    background: #ffff;
    border-radius: .8rem .8rem 0 0;
}

.myPrizeProp .flex_spaceBetween {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 .8rem;
}

.prizeTitle {
    height: 2.8rem;
}

.myPrizeProp .lists {
    height: calc(100% - 3.6rem);
    overflow: scroll;
    position: relative;
}

.lists > .list {
    height: 3.2rem;
    border-bottom: .025rem solid rgba(234,234,234,0.38);
}

.prize_name {
    font-family: HONORSansBrand-Regular;
    font-size: .8rem;
    color: #000000;
    letter-spacing: 0;
    line-height: 1.1rem;
}

.prize_time {
    font-family: HONORSansBrand-Regular;
    font-size: .7rem;
    color: rgba(0, 0, 0, 0.6);
    letter-spacing: 0;
    line-height: 1rem;
}
.closeImg {
    width: 1.2rem;
    height: 1.2rem;
}
.defaultMsg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}



.share {
    width: 100%;
    font-size: .8rem;
    color: #ffffff;
    margin-top: .6rem;
    line-height: .8rem;
    font-weight: 600;
    text-align: center;
    line-height: 2rem;
    height: 2rem;
    background-size: 100% 100%;
}
.mod-lottery .style-3 .share{
    background-size: 7.1rem 2rem;
    width:7.1rem;
    height:2rem;
    margin-right:.6rem
}
.mod-lottery .style-3 .prizeNTime{
    background-size: 7.1rem 2rem;
    width:7.1rem;
    height:2rem
}
/*翻牌样式开始*/
.mod-lottery .cardsBox {
    position: absolute;
    left: 1rem;
    top: 4rem;
    width: calc(100% - 1rem);
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: center;
}

.mod-lottery .cardsBox img {
    width: 100%;
    height: 100%;
}

.flip-card-inner {
    width: 4.5rem;
    height: 6rem;
    perspective: 50rem;
    margin: 0 .4rem .4rem 0;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.8s;
}

.flip-card-inner.active {
    transform: rotateY(-180deg);
}

.flip-card-back,
.flip-card-front {
    width: 100%;
    height: 100%;
    position: absolute;
    backface-visibility: hidden;
}
.priceImg {
    width: 2.2rem;
    height: 2.2rem;
}

.priceName {
    margin: .3rem 0 .5rem;
    font-weight: 600;
    width: 3.75rem;
    height: 1.7rem;
    display: -webkit-box;
    font-size: .6rem;
    color: #BC3D14;
    letter-spacing: 0;
    text-align: center;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}
/*翻牌样式结束*/
 /** style3 扭蛋机开始*/
 .turnBtn {
    position: absolute;
    right: 3.8rem;
    bottom: 4.4rem;
    width: 2.9rem;
    height: 2.9rem;
    transition: transform 0.3s ease;
}

.downEggBox {
    width: 3.3rem;
    height: 2.25rem;
    position: absolute;
    left: 3.45rem;
    bottom: 4.2rem;
    position: absolute;
    z-index: 2;
}

.downEgg {
    padding-left: .6rem;
    width: 2.1rem;
    height: 2.1rem;
    position: relative;
    overflow: hidden;
}
.btnRotate {
    transform: rotate(90deg);
}

.eggBoxs {
    width: 9.1rem;
    height: 8.7rem;
    position: absolute;
    left: 3.75rem;
    top: 2.25rem;
    z-index: 1;
    overflow: hidden;
}

.eggBoxs span {
    width: 2.1rem;
    height: 2.1rem;
    background-size: 100%;
    position: absolute;
    border-radius: 50%;
}
.qiu_1 {
    left: .05rem;
    bottom: .8rem;
    z-index: 2;
}

.qiu_2 {
    left: 1.65rem;
    bottom: .1rem;
    z-index: 1;
}

.qiu_3 {
    left: 3.4rem;
    bottom: .3rem;
    z-index: 2;
}

.qiu_4 {
    left: 5.5rem;
    bottom: .2rem;
    z-index: 1;
}

.qiu_5 {
    left: 6.65rem;
    bottom: .1rem;
    z-index: 2;
}

.qiu_6 {
    left: 2.15rem;
    bottom: 2.3rem;

}

.qiu_7 {
    left: 4.1rem;
    bottom: 1.45rem;
    z-index: 1;
}

.qiu_8 {
    left: 5.75rem;
    bottom: 2.65rem;
}

.qiu_9 {
    left: 7rem;
    bottom: 1.25rem;
    z-index: 1;
}

/*掉落动画*/
.diaol_1 {
    animation: dialuodn 1s linear 0.9s backwards;
    -webkit-animation: dialuodn 1s linear 0.9s backwards;
}

.diaol_1:after {
    animation-delay: 0.8s;
    -webkit-animation-delay: 0.8s;
}

.diaol_2 {
    animation: dialuodn 1s linear 0.6s backwards;
    -webkit-animation: dialuodn 1s linear 0.6s backwards;
}

.diaol_2:after {
    animation-delay: 0.5s;
    -webkit-animation-delay: 0.5s;
}

.diaol_3 {
    animation: dialuodn 1s linear backwards;
    -webkit-animation: dialuodn 1s linear backwards;
}

.diaol_4 {
    animation: dialuodn 1s linear 1.1s backwards;
    -webkit-animation: dialuodn 1s linear 1.1s backwards;
}

.diaol_4:after {
    animation-delay: 1s;
    -webkit-animation-delay: 1s;
}

.diaol_5 {
    animation: dialuodn 1s linear 0.8s backwards;
    -webkit-animation: dialuodn 1s linear 0.8s backwards;
}

.diaol_5:after {
    animation-delay: 0.7s;
    -webkit-animation-delay: 0.7s;
}

.diaol_6 {
    animation: dialuodn 1s linear 0.4s backwards;
    -webkit-animation: dialuodn 1s linear 0.4s backwards;
}

.diaol_6:after {
    animation-delay: 0.3s;
    -webkit-animation-delay: 0.3s;
}

.diaol_7 {
    animation: dialuodn 1s linear 0.9s backwards;
    -webkit-animation: dialuodn 1s linear 0.9s backwards;
}

.diaol_7:after {
    animation-delay: 0.8s;
    -webkit-animation-delay: 0.8s;
}

.diaol_8 {
    animation: dialuodn 1s linear 0.6s backwards;
    -webkit-animation: dialuodn 1s linear 0.6s backwards;
}

.diaol_8:after {
    animation-delay: 0.5s;
    -webkit-animation-delay: 0.5s;
}

.diaol_9 {
    animation: dialuodn 1s linear 1.1s backwards;
    -webkit-animation: dialuodn 1s linear 1.1s backwards;
}

.diaol_9:after {
    animation-delay: 1s;
    -webkit-animation-delay: 1s;
}

.wieyi_1 {
    animation: around1 1.5s linear infinite;
    -webkit-animation: around1 1.5s linear infinite;
}

.wieyi_2 {
    animation: around2 1.5s linear infinite;
    -webkit-animation: around2 1.5s linear infinite;
}

.wieyi_3 {
    animation: around3 1.5s linear infinite;
    -webkit-animation: around3 1.5s linear infinite;
}

.wieyi_4 {
    animation: around4 1.5s linear infinite;
    -webkit-animation: around4 1.5s linear infinite;
}

.wieyi_5 {
    animation: around5 1.5s linear infinite;
    -webkit-animation: around5 1.5s linear infinite;
}

.wieyi_6 {
    animation: around6 1.5s linear infinite;
    -webkit-animation: around6 1.5s linear infinite;
}

.wieyi_7 {
    animation: around7 1.5s linear infinite;
    -webkit-animation: around7 1.5s linear infinite;
}

.wieyi_8 {
    animation: around8 1.5s linear infinite;
    -webkit-animation: around8 1.5s linear infinite;
}

.wieyi_9 {
    animation: around9 1.5s linear infinite;
    -webkit-animation: around9 1.5s linear infinite;
}

.none {
    display: none;
}
@keyframes dialuodn {
    0% {
        transform: translateY(-200%);
        opacity: 0;
    }

    5% {
        transform: translateY(-200%);
    }

    15% {
        transform: translateY(0);
    }

    30% {
        transform: translateY(-100%);
    }

    40% {

        transform: translateY(0%);
    }

    50% {
        transform: translateY(-60%);
    }

    70% {
        transform: translateY(0%);
    }

    80% {
        transform: translateY(-30%);
    }

    90% {
        transform: translateY(0%);
    }

    95% {
        transform: translateY(-14%);
    }

    97% {
        transform: translateY(0%);
    }

    99% {
        transform: translateY(-6%);
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }

}

@-webkit-keyframes dialuodn {
    0% {
        -webkit-transform: translateY(-200%);
        opacity: 0;
    }

    5% {
        -webkit-transform: translateY(-200%);
    }

    15% {
        -webkit-transform: translateY(0);
    }

    30% {
        -webkit-transform: translateY(-100%);
    }

    40% {

        -webkit-transform: translateY(0%);
    }

    50% {
        -webkit-transform: translateY(-60%);
    }

    70% {
        -webkit-transform: translateY(0%);
    }

    80% {
        -webkit-transform: translateY(-30%);
    }

    90% {
        -webkit-transform: translateY(0%);
    }

    95% {
        -webkit-transform: translateY(-14%);
    }

    97% {
        -webkit-transform: translateY(0%);
    }

    99% {
        -webkit-transform: translateY(-6%);
    }

    100% {
        -webkit-transform: translateY(0);
        opacity: 1;
    }

}

@-webkit-keyframes zhuan {
    0% {
        -webkit-transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes zhuan {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes around1 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    20% {
        -webkit-transform: translate(7.5rem, -5rem);
    }

    40% {
        -webkit-transform: translate(5rem, -5rem);
    }

    60% {
        -webkit-transform: translate(-2.5rem, -6.5rem);
    }

    80% {
        -webkit-transform: translate(5rem, -2.5rem);
    }

    100% {
        -webkit-transform: translate(5rem, -7rem);
    }
}

@keyframes around1 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    20% {
        -webkit-transform: translate(7.5rem, -5rem);
    }

    40% {
        -webkit-transform: translate(5rem, -5rem);
    }

    60% {
        -webkit-transform: translate(2.5rem, -6.5rem);
    }

    80% {
        -webkit-transform: translate(5rem, -2.5rem);
    }

    100% {
        -webkit-transform: translate(5rem, -7rem);
    }
}

@-webkit-keyframes around2 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    10% {
        -webkit-transform: translate(10rem, -6rem);
    }

    30% {
        -webkit-transform: translate(12.5rem, 6.5rem);
    }

    50% {
        -webkit-transform: translate(-2.5rem, -6rem);
    }

    80% {
        -webkit-transform: translate(0rem, 7rem);
    }

    100% {
        -webkit-transform: translate(10rem, -9rem);
    }
}

@keyframes around2 {
    0% {
        transform: translate(0rem, 0rem);
    }

    10% {
        transform: translate(5rem, -6rem);
    }

    30% {
        transform: translate(7.5rem, 6.5rem);
    }

    50% {
        transform: translate(-2.5rem, -6rem);
    }

    80% {
        transform: translate(0rem, 7rem);
    }

    100% {
        transform: translate(10rem, -9rem);
    }
}

@-webkit-keyframes around3 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    25% {
        -webkit-transform: translate(3.5rem, -14.5rem);
    }

    50% {
        -webkit-transform: translate(11rem, 0rem);
    }

    80% {
        -webkit-transform: translate(-1rem, -14.5rem);
    }

    100% {
        -webkit-transform: translate(9.5rem, 0rem);
    }
}

@keyframes around3 {
    0% {
        transform: translate(0rem, 0rem);
    }

    25% {
        transform: translate(3.5rem, -14.5rem);
    }

    50% {
        transform: translate(11rem, 0rem);
    }

    80% {
        transform: translate(-1rem, -14.5rem);
    }

    100% {
        transform: translate(9.5rem, 0rem);
    }

}

@-webkit-keyframes around4 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    12% {
        -webkit-transform: translate(2.5rem, 7.5rem);
    }

    30% {
        -webkit-transform: translate(-7.5rem, -1.5rem);
    }

    60% {
        -webkit-transform: translate(-7rem, 8rem);
    }

    80% {
        -webkit-transform: translate(-0.5rem, -1.5rem);
    }

    100% {
        -webkit-transform: translate(-1rem, 8rem);
    }

}

@keyframes around4 {
    0% {
        transform: translate(0rem, 0rem);
    }

    12% {
        transform: translate(2.5rem, 7.5rem);
    }

    30% {
        transform: translate(-7.5rem, -1.5rem);
    }

    60% {
        transform: translate(-7rem, 8rem);
    }

    80% {
        transform: translate(-0.5rem, -1.5rem);
    }

    100% {
        transform: translate(-1rem, 8rem);
    }

}

@-webkit-keyframes around5 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    22% {
        -webkit-transform: translate(-2.5rem, -8.5rem);
    }

    46% {
        -webkit-transform: translate(7.5rem, 7.25rem);
    }

    80% {
        -webkit-transform: translate(10rem, -2.1rem);
    }

    100% {
        -webkit-transform: translate(-5rem, 7.25rem);
    }
}

@keyframes around5 {
    0% {
        transform: translate(0rem, 0rem);
    }

    22% {
        transform: translate(-2.5rem, -8.5rem);
    }

    46% {
        transform: translate(7.5rem, 7.25rem);
    }

    80% {
        transform: translate(10rem, -2.1rem);
    }

    100% {
        transform: translate(-5rem, 7.25rem);
    }
}

@-webkit-keyframes around6 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    15% {
        -webkit-transform: translate(13rem, 2rem);
    }

    30% {
        -webkit-transform: translate(-4rem, -13rem);
    }

    45% {
        -webkit-transform: translate(-2rem, 2rem);
    }

    60% {
        -webkit-transform: translate(5rem, -14.5rem);
    }

    75% {
        -webkit-transform: translate(-4rem, -14rem);
    }

    100% {
        -webkit-transform: translate(.5rem, 2rem);
    }
}

@keyframes around6 {
    0% {
        transform: translate(0rem, 0rem);
    }

    15% {
        transform: translate(13rem, 2rem);
    }

    30% {
        transform: translate(-4rem, -13rem);
    }

    45% {
        transform: translate(-2rem, 2rem);
    }

    60% {
        transform: translate(5rem, -14.5rem);
    }

    75% {
        transform: translate(-4rem, -14rem);
    }

    100% {
        transform: translate(.5rem, 2rem);
    }

}

@-webkit-keyframes around7 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    20% {
        -webkit-transform: translate(-3rem, -8.5rem);
    }

    40% {
        -webkit-transform: translate(4.5rem, 8rem);
    }

    60% {
        -webkit-transform: translate(-11rem, -7rem);
    }

    80% {
        -webkit-transform: translate(8rem, -3rem);
    }

    100% {
        -webkit-transform: translate(-5rem, -5rem);
    }

}

@keyframes around7 {
    0% {
        transform: translate(0rem, 0rem);
    }

    20% {
        transform: translate(-3rem, -8.5rem);
    }

    40% {
        transform: translate(4.5rem, 8rem);
    }

    60% {
        transform: translate(-11rem, -7rem);
    }

    80% {
        transform: translate(8rem, -3rem);
    }

    100% {
        transform: translate(-5rem, -5rem);
    }

}

@-webkit-keyframes around8 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    20% {
        -webkit-transform: translate(7rem, -6rem);
    }

    40% {
        -webkit-transform: translate(-7rem, 2rem);
    }

    60% {
        -webkit-transform: translate(-9rem, -12rem);
    }

    80% {
        -webkit-transform: translate(5rem, 2.5rem);
    }

    100% {
        -webkit-transform: translate(-9rem, -11rem);
    }
}

@keyframes around8 {
    0% {
        transform: translate(0rem, 0rem);
    }

    20% {
        transform: translate(7rem, -6rem);
    }

    40% {
        transform: translate(-7rem, 2rem);
    }

    60% {
        transform: translate(-9rem, -12rem);
    }

    80% {
        transform: translate(5rem, 2.5rem);
    }

    100% {
        transform: translate(-9rem, -11rem);
    }
}

@-webkit-keyframes around9 {
    0% {
        -webkit-transform: translate(0rem, 0rem);
    }

    30% {
        -webkit-transform: translate(-15rem, -9rem);
    }

    60% {
        -webkit-transform: translate(-17.5rem, 6rem);
    }

    80% {
        -webkit-transform: translate(-5rem, -10rem);
    }

    100% {
        -webkit-transform: translate(-10rem, 5rem);
    }
}

@keyframes around9 {
    0% {
        transform: translate(0rem, 0rem);
    }

    30% {
        transform: translate(-15rem, -9rem);
    }

    60% {
        transform: translate(-17.5rem, 6rem);
    }

    80% {
        transform: translate(-5rem, -10rem);
    }

    100% {
        transform: translate(-10rem, 5rem);
    }
}
@keyframes fanda {
    0% {
        transform: scale(0.7);
    }

    100% {
        transform: scale(1);
    }
}

@-webkit-keyframes fanda {
    0% {
        -webkit-transform: scale(0.7);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

.winParentEgg {
    display: none;
    position: absolute;
    width: 7.25rem;
    height: 7.25rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.eggBox > img {
    width: 7.7rem;
    height: 7.7rem;
    position: absolute;
    transition: all 1s ease 0s;
}

.eggBox > .boxTop {
    z-index: 3;
    transform: translateY(-1rem);
    animation: image-up 1s ease-in-out;
}

.eggBox > .boxBottom {
    bottom: -2;
    animation: image-down 1s ease-in-out;
    transform: translateY(1rem);
}

.eggBox > .light {
    z-index: 2;
    animation: image-scaleEgg 1.5s ease-in-out;
}
@keyframes image-scaleEgg {
    0% {
        transform: scale(0.1);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes image-up {
    0% {
        transform: translateY(0rem);
    }

    100% {
        transform: translateY(-1rem);
    }
}
@keyframes image-down {
    0% {
        transform: translateY(0rem);
    }

    100% {
        transform: translateY(1rem);
    }
}
  /** style3 扭蛋机结束*/
  /**style4盲盒渲染样式开始*/

  .winParent {
    display: none;
    position: absolute;
    width: 10rem;
    height: 13rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.eggBox,
.win {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
}

.win > img {
    width: 10rem;
    height: 8rem;
    position: absolute;
    transition: all 1s ease 0s;
}

.winParent  .boxTop {
    top: 0;
    transform-origin: 100% 100%;
    transform: rotate(25deg);
    animation: image-rotate 2s ease-in-out;
}

.winParent  .boxBottom {
    bottom: 0;
}

.winParent  .light {
    top: .5rem;
    animation: image-scale 2s ease-in-out;
}
@keyframes image-scale {
    0% {
        transform: scale(0.1);
        opacity: 0;
        top: 3rem;
    }

    100% {
        transform: scale(1);
        opacity: 1;
        top: .5rem;
    }
}
@keyframes image-rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(25deg);
    }
}
  /**style4盲盒渲染样式结束*/
  /**style5摇一摇样式开始*/

  .shakeSweepstakesContent .number{
    position: absolute;
    bottom: 1.5rem;
}
.shakeSweepstakesContent .shakeSweepstakesPrizeBtn{
    position: absolute;
    bottom: 2.6rem;
    width: 100%;
    text-align: center;
}
.shakeSweepstakesContent .shakeSweepstakesPrizeBtn img {
    width:11.3rem;
    height:1.85rem;
}
.shakeSweepstakesContent .shakeSweepstakesBox {
    position: absolute;
    bottom: 5.5rem;
    width: 100%;
}
.shakeSweepstakesContent .shakeSweepstakesBox img {
    width: 12.6rem;
    height: 12.6rem;
    transform: rotate(20deg);
}
.shakeSweepstakesContent .shakeSweepstakesBox img.active {
   animation: rotate 1s linear infinite;
}
@keyframes rotate {
    0% {
    transform: rotate(20deg);
    }

    25% {
    transform: rotate(10deg);
    }

    50% {
    transform: rotate(20deg);
    }

    75% {
    transform: rotate(10deg);
    }

    100% {
    transform: rotate(20deg);
    }
}
  /**style5摇一摇样式结束*/

/** style6 - 火山红包 **/
.envelop-btn {
    position: absolute;
    left: 50%;
    transform: translateX(-160%);
    bottom: .9rem;
    width: 4.4rem;
    height: 1.4rem;
    line-height: 1.4rem;
    opacity: 0;
    background-image: linear-gradient(1deg, #FBEBBC 0%, #FFFFFF 100%);
    border-radius: 1rem;
    font-family: HONORSansBrand-DemiBold;
    font-size: .65rem;
    color: #FFF0DA;
    text-align: center;
    font-weight: 600;
}

.envelop-popup-box {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 1rem;
    width: 13.2rem;
    height: 8.3rem;
    background: url('../images/envelop-popup-img-1.png') 0 0 no-repeat;
    background-size: contain;
    z-index: 3000;
}

.envelop-popup-box .envelop-popup-icon {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 4.9rem;
    height: 2.9rem;
    background: url('../images/envelop-popup-img-2.png') 0 0 no-repeat;
    background-size: cover;
}

.envelop-popup-text {
    opacity: 0.9;
    line-height: 1.5rem;
    font-family: HONORSansBrand-DemiBold;
    font-size: .9rem;
    color: #000000;
    text-align: center;
    padding: 1.2rem 0rem;
    font-weight: 500;
}
.envelop-unprize-box .envelop-popup-text {
    line-height: 0rem;
}

.envelop-unprize-box .envelop-popup-btn {
    bottom: 1rem !important;
}

.envelop-popup-box .envelop-popup-btn, .envelop-unprize-box .envelop-popup-btn {
    position: absolute;
    left: 50%;
    bottom: 1.5rem;
    transform: translateX(-50%);
    width: 10.8rem;
    height: 1.8rem;
    line-height: 1.8rem;
    background-image: linear-gradient(270deg, #FE3437 0%, #FF752E 68%);
    border-radius: .9rem;
    opacity: 0.9;
    font-family: HONORSansBrand-DemiBold;
    font-size: .7rem;
    color: #FFFFFF;
    text-align: center;
    font-weight: 500;
}

.envelop-popup-box .envelop-popup-btn {
    bottom: 1.1rem;
}

.envelop-prize-popup-box {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 13.2rem;
    height: 15.6rem;
    /* box-shadow: inset .1rem .05rem .3rem 0 rgba(255,245,186,0.42), inset -0.1rem -0.25rem .3rem 0 rgba(255,245,186,0.42); */
    border-radius: .8rem;
    z-index: 5000;
}

.envelop-prize-popup-box .envelop-unprize-box {
    display: none;
    width: 100%;
    height: 100%;
    background: url('../images/envelop-popup-img-4.png');
    background-size: cover;
    border-radius: .8rem;
}

.envelop-prize-popup-box .envelop-unlottery-box {
    /* display: none; */
    width: 100%;
    height: 17rem;
    background: url('../images/envelop-popup-img-4.png') 0 0 no-repeat;
    background-size: contain;
    background-position: top;
}

.envelop-prize-popup-box .envelop-unlottery-box .envelop-popup-text {
    padding: 1rem .8rem;
}

.envelop-prize-popup-box .envelop-unlottery-box .envelop-popup-btn {
    width: 10.8rem;
    opacity: 0.9;
    bottom: -0.3rem;
    font-family: HONORSansBrand-Medium;
    font-size: .7rem;
    color: #FFFFFF;
    text-align: center;
    line-height: 1.8rem;
    font-weight: 500;
    background-image: linear-gradient(270deg, #FE3437 0%, #FF752E 68%);
}

.envelop-unlottery-box .envelop-unlottery-box {
    padding: 2rem .8rem !important; 
}

.envelop-prize-popup-box .envelop-popup-img, .envelop-prize-popup-box .envelop-unlottery-popup-img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9.5rem;
    height: 6.75rem;
    transform: translate(-50%, -50%);
    background: url('../images/envelop-unprize-img-2.png') 0 0 no-repeat;
    background-size: contain;
}

.envelop-prize-popup-box .envelop-unlottery-popup-img {
    background: url('../images/envelop-unlottery-img-1.png') 0 0 no-repeat !important;
    background-size: contain !important;
}

.envelop-prize-popup-box .envelop-prize-box {
    display: none;
    width: 100%;
    height: 20rem;
    /* height: 100%; */
    background: url('../images/envelop-popup-img-3.png') 0 0 no-repeat;
    background-size: contain;
    background-position: top;
}

.envelop-prize-popup-box .envelop-prize-popup-text {
    position: absolute;
    width: 100%;
    margin-top: .5rem;
    line-height: 3.2rem;
    opacity: 0.9;
    font-family: HONORSansBrand-DemiBold;
    font-size: .9rem;
    color: #FFFFFF;
    text-align: center;
    line-height: 1.3rem;
    font-weight: 500;
    top: 4.5rem;
    left: 0;
}

.envelop-prize-popup-box .envelop-prize-popup-ul {
    max-height: 20.15rem;
    padding: 4.8rem 1.2rem;
    box-sizing: border-box;
}

.envelop-prize-popup-box .envelop-prize-inner-box {
    overflow-y: scroll;
    width: 100%;
    height: 8.8rem;
    margin-top: 2rem;
}

.envelop-prize-popup-box .envelop-prize-popup-ul .prize-popup-li {
    width: 100%;
    height: 2.6rem;
    margin-bottom: .4rem;
    padding: .5rem .8rem;
    box-sizing: border-box;
    background: #fff;
    border-radius: .6rem;
}

.envelop-activity-popup-box {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
    height: 100vh;
    background: url('../images/erupt-before-img.png') 0 0 no-repeat;
    background-size: inherit;
    border-radius: .8rem;
    z-index: 3002;
}

.envelop-activity-animation-box {
    /* display: none; */
    position: fixed;
    top: 0;
    left: 0; 
    width: 100vw;
    height: 82vh;
    z-index: 3003;
}

.envelop-activity-animation-box .envelop-box {
    position: absolute;
    width: 2rem;
    height: 2rem;
    bottom: 0;
    left: 50%;
    transform: translate(-1rem, 0);
    opacity: 0;
    background: url('../images/envelop-activity-img-1.png') 0 0 no-repeat;
    background-size: contain;
    z-index: 3003;
    font-family: HONORSansBrand-DemiBold;
    font-size: 2.8rem;
    color: #FFEFC5;
    letter-spacing: .2255rem;
    text-align: center;
    line-height: 2.7rem;
    text-shadow: 0 .1rem .55rem #C70000;
    font-weight: 600;
}

.envelop-activity-animation-box .envelop-box .envelop-ending {
    position: absolute;
    top: 0;
    left: -0.5rem;
    width: 4rem;
    height: 4rem;
    background: url('../images/envelop-hit-img-1.png') 0 0 no-repeat;
    background-size: contain;
}

.envelop-activity-popup-box .envelop-activity-close-btn {
    position: absolute;
    top: .8rem;
    right: .8rem;
    width: 1.2rem;
    height: 1.2rem;
    background: url('../images/envelop-popup-close-img.png') 0 0 no-repeat;
    background-size: cover;
    z-index: 3010;
}

.envelop-activity-popup-box .envelop-activity-downcount-box {
    display: none;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 5.8rem;
    height: 8.6rem;
    background-size: cover;
    background-position: left;
}

.envelop-activity-popup-box .envelop-activity-duration {
    display: none;
    flex-wrap: nowrap;
    align-content: space-around;
    position: absolute;
    top: .95rem;
    left: .8rem;
    width: 85%;
    line-height: 1rem;
}

.envelop-activity-duration .envelop-duration-name, .envelop-activity-duration .envelop-duration-time {
    flex: 1.8;
    opacity: 0.9;
    font-family: HONORSansBrand-Regular;
    font-size: .7rem;
    color: #FFFFFF;
    line-height: 1rem;
    font-weight: 400;
}

.envelop-activity-duration .envelop-duration-bar {
    flex: 6;
    width: 100%;
    margin-top: .25rem;
    background: rgba(255, 255, 255, 0.6);
    border-radius: .3rem;
    opacity: 1;
    height: .4rem;
}

.envelop-activity-duration .envelop-duration-bar .envelop-duration-process {
    width: 100%;
    height: 100%;
    background-image: linear-gradient(270deg, #F76A53 0%, #E9170E 100%);
    border-radius: .3rem;
}

.envelop-activity-duration .envelop-duration-time {
    flex: 0.8;
    text-align: left;
    margin-left: .3rem;
}

.envelop-prize-popup-ul .prize-popup-li .prize-desc {
    display: flex;
    width: 5rem;
    height: 1.6rem;
    padding-left: .5rem;
    /* line-height: 1.6rem; */
    opacity: 0.9;
    font-family: HONORSansBrand-Regular;
    align-items: center;
    font-size: .7rem;
    color: #000000;
    font-weight: 400;
    overflow: hidden; 
    /* text-overflow: ellipsis;  */
    white-space: wrap;
}

.envelop-prize-popup-ul .prize-popup-li .prize-popup-img {
    float: left;
    width: 1.5rem;
    height: 1.6rem;
}

.envelop-prize-popup-box .envelop-popup-btn {
    position: absolute;
    left: 50%;
    bottom: -2.6rem;
    transform: translateX(-50%);
    width: 10.8rem;
    height: 1.8rem;
    line-height: 1.8rem;
    background-image: linear-gradient(0deg, #F7B64E 16%, #F8EDA1 84%);
    border-radius: .8rem;
    font-family: HONORSansBrand-DemiBold;
    font-size: .7rem;
    color: #C61200;
    text-align: center;
    font-weight: 500;
}

.envelop-myPrize {
    right: -0.05rem !important;
    top: .75rem !important;
    width: .9rem !important;
    height: 1.8rem !important;
    padding: .2rem 0;
    line-height: .7rem !important;
    border: none !important;
    border-radius: .4rem !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    text-align: center !important;
    white-space: normal !important;
}

.envelop-option {
    position: relative;
    left: .65rem;
    top: 2.75rem;
    width: .9rem !important;
    height: 1.8rem !important;
    padding: .2rem 0;
    line-height: .7rem !important;
    border: none !important;
    border-radius: .4rem !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
/** style6 - 火山红包 结束**/

/** style7 - 九宫格 开始**/
.mod-squaredDraw {
    position: relative;
}

.mod-squaredDraw .no-data-remark {
    position: absolute;
    z-index: 1024;
    display: -webkit-box;
    display: box;
    display: -webkit-flex;
    display: flex;
    left: 50%;
    top: 50%;
    width: 15rem;
    height: 3rem;
    margin-left: -7.5rem;
    margin-top: -1.5rem;
    padding: 0 .5rem;
    color: #f468a3;
    font-size: .7rem;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.5;
    background: rgba(44, 47, 49, 0.7);
    border-radius: .25rem;
    box-shadow: 0 0 .6rem rgba(244, 104, 163, 0.39);
}

.mod-squaredDraw .drmark {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    z-index: 10;
}

.mod-squaredDraw .Y-content {
    height: 16.75rem;
    font-size: 0;
}

.mod-squaredDraw .Y-content td {
    padding-bottom: .4rem;
    padding-left: .4rem;
}

.mod-squaredDraw .lottery-unit {
    position: relative;
}

.mod-squaredDraw .Y-content td:nth-child(1) {
    padding-left: 0
}

.mod-squaredDraw .Y-content td:nth-child(4) {
    padding-left: 0
}

.mod-squaredDraw .Y-content td:nth-child(7) {
    padding-left: 0;
}

.mod-squaredDraw .Y-content td img {
    width: 5.3rem;
    height: 5.3rem;
}

.mod-squaredDraw .Y-content td .face {
    display: none;
    position: absolute;
    top: 0;
    left: .4rem;
    z-index: 10;
}

.mod-squaredDraw .Y-content td:nth-child(1) .face {
    left: 0
}

.mod-squaredDraw .Y-content td:nth-child(4) .face {
    left: 0
}

.mod-squaredDraw .Y-content td:nth-child(7) .face {
    left: 0;
}

.mod-squaredDraw .flip-member {
    position: relative;
    padding: 2.2rem 3rem 0 3rem;
}

.mod-squaredDraw .flip-member ul {
    font-size: .5rem;
    color: #3a3a3a;
    line-height: .8rem;
    white-space: pre-line;
    vertical-align: middle;
}

.mod-squaredDraw .flip-member ul .text-left {
    width: 6.5rem;
    overflow: hidden;
    float: left;
    direction: ltr;
}

.mod-squaredDraw .flip-member ul .text-right {
    width: 5.45rem;
    float: right;
}

.mod-squaredDraw .vip-squaredDraw-content {
    display: none;
    padding: .5rem .75rem 1.1rem;
}

.mod-squaredDraw .vip-squaredDraw-content ul {
    font-size: .35rem;
    color: #908C8A;
    letter-spacing: 0;
    text-align: justify;
}

.mod-squaredDraw .icon-more-top,
.mod-squaredDraw .icon-more-bottom {
    display: inline-block;
    width: .5rem;
    height: .5rem;
    background: url(../images/squaredDraw/squaredDraw_mb_icon_arrow_more.png) no-repeat center;
    background-size: .5rem .5rem;
}

.mod-squaredDraw .icon-more-bottom {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}

.mod-squaredDraw .icon-more-top {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
}

.mod-squaredDraw .vip-squaredDraw-content .head {
    font-size: .6rem;
    color: #CA141D;
    line-height: 1.3;
}

.mod-squaredDraw .vip-squaredDraw-content .content {
    font-size: .6rem;
    color: #333333;
    line-height: 1.3;
    margin-bottom: .429rem;
}

.mod-squaredDraw .loadingmore p {
    text-align: center;
    height: 1.75rem;
    line-height: 1.75rem;
    font-size: .55rem;
    color: #333333;
    font-weight: 600;
}

.mod-squaredDraw .loadingmore i {
    padding-left: .1rem;
    position: relative;
    top: .1rem
}

.mod-squaredDraw .vip-squaredDraw-content .head {
    font-size: .6rem;
    color: #CA141D;
    line-height: 1.3;
}

.mod-squaredDraw .vip-squaredDraw-content .content {
    font-size: .6rem;
    color: #333333;
    line-height: 1.3;
    margin-bottom: .429rem;
}

.mod-squaredDraw .countBox{
    position: relative;
    height: .75rem;
    margin: auto;
    text-align: center;
    margin-bottom: .9rem;
  }

  .mod-squaredDraw .NLotteryBtnBox{
    margin: 1rem auto 0;
    width: 12.7rem;
    height: 1.8rem;
    position: relative;
    display: flex;
    margin-bottom: .9rem
  }
  
  .mod-squaredDraw .NLotteryBtnBox .l,.mod-squaredDraw .NLotteryBtnBox .r{
    width: 6rem;
    height: 1.8rem;
  }
  .mod-squaredDraw .NLotteryBtnBox .l img,.mod-squaredDraw .NLotteryBtnBox .r img{
    width: 6rem;
    height: 1.8rem;
  }
  
  .mod-squaredDraw .NLotteryBtnBox .r{
    margin-left: .7rem;
  }

  .prizewinnerBox{
    width: 100%;
    height: auto;
    padding: .65rem;
    box-sizing: border-box !important;
  }

  .prizewinnerBox .pBox{
    position: relative;
  }
  .prizewinnerBox .pBox .bgBox, .prizewinnerBox .pBox .bgBox img{
    width: 100%;
    height: auto;
  }

  .prizewinnerBox .pBox .flip-member{
    position: absolute;
    top: 0;
    padding: 2.2rem 2.35rem 0 2.35rem
  }

  .ruleBox{
    width: 100%;
    height: auto;
    padding: .65rem;
    padding-top: 0;
    box-sizing: border-box !important;
  }

  .ruleBox .bgBox{
    min-height: 1.75rem;
    border-radius: .875rem;
    background-color: #f9f9f9;
  }
/** style7 - 九宫格 结束**/


/* style3扭蛋机 start */
/* #region */
.gacha_prize {
    background-size: 100% 100% !important;
    position: relative;
    width: 16.4rem;
    box-sizing: border-box;
    margin: 0 .8rem;
    overflow: hidden;
  }
  
.gacha_prize .top {
    position: relative;
    height: 3.6rem;
  }
  
.gacha_prize .top .winnerList {
    background-size: 100% !important;
    position: absolute;
    left: 0;
    top: .8rem;
    height: 1.2rem;
    width: 10.525rem;
    font-size: .6rem;
    border-radius: 0 .6rem .6rem 0;
    box-shadow: 0 0 .2rem 0;
    line-height: 1.2rem;
    display: flex;
    align-items: center;
  }
  
  .gacha_prize .top .winnerList marquee {
    flex: 1;
  }

  .gacha_prize .top .winnerList marquee .listContent {
    display: flex;
  }

  .gacha_prize .top .winnerList marquee .listContent .list_item {
    margin-right: 1rem;
  }
  
  .gacha_prize .top .winnerList .trumpet_icon {
    height: .8rem;
    width: .8rem;
    margin: .2rem;
    margin-left: .4rem;
    background: url("../images/common/trumpet.png");
    background-size: auto 100%;
  }
  
  .gacha_prize .top .ruleEntry {
    position: absolute;
    right: .4rem;
    top: .8rem;
    font-size: .6rem;
    text-align: center;
    box-sizing: border-box;
    line-height: 1.2rem;
    height: 1.2rem;
    width: 3.2rem;
    border-radius: .6rem;
  }
  .gacha_prize .gacha_prize_content {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    top: 0;
  }
  .gacha_prize .gacha_prize_content .top {
    position: absolute;
    top: 0;
    width: 100%;
  }
  .gacha_prize .gacha_prize_content .top .winnerList {
    background-size: 100% !important;
    position: absolute;
    left: 0;
    top: 0.6rem;
    height: 1.2rem;
    width: 9.55rem;
    font-size: 0.6rem;
    border-radius: 0 0.6rem 0.6rem 0;
    line-height: 1.2rem;
    display: flex;
  }
  .gacha_prize .gacha_prize_content .top .winnerList marquee {
    flex: 1;
  }
  .gacha_prize .gacha_prize_content .top .ruleEntry {
    position: absolute;
    right: 0.4rem;
    top: 0.6rem;
    font-size: 0.6rem;
    text-align: center;
    box-sizing: border-box;
    line-height: 1.2rem;
    height: 1.2rem;
    width: 3.2rem;
    border-radius: 0.6rem;
    border: 0.05rem solid #fff;
  }
  .gacha_prize .gacha_prize_content .downEggBox {
    width: 3.3rem;
    height: 2.25rem;
    position: absolute;
    left: 3.45rem;
    bottom: 4.2rem;
    position: absolute;
    z-index: 2;
  }
  
  .gacha_prize .gacha_prize_content .downEgg {
    padding-left: 0.6rem;
    width: 2.1rem;
    height: 2.1rem;
    position: relative;
    overflow: hidden;
  }
  .gacha_prize .gacha_prize_content .eggBoxs span {
    width: 2.1rem;
    height: 2.1rem;
    background-size: 100%;
    position: absolute;
    border-radius: 50%;
  }
  .gacha_prize .gacha_prize_content .qiu_1 {
    left: 0.05rem;
    bottom: 0.8rem;
    z-index: 2;
  }
  
  .gacha_prize .gacha_prize_content .qiu_2 {
    left: 1.65rem;
    bottom: 0.1rem;
    z-index: 1;
  }
  
  .gacha_prize .gacha_prize_content .qiu_3 {
    left: 3.4rem;
    bottom: 0.3rem;
    z-index: 2;
  }
  
  .gacha_prize .gacha_prize_content .qiu_4 {
    left: 5.5rem;
    bottom: 0.2rem;
    z-index: 1;
  }
  
  .gacha_prize .gacha_prize_content .qiu_5 {
    left: 6.65rem;
    bottom: 0.1rem;
    z-index: 2;
  }
  
  .gacha_prize .gacha_prize_content .qiu_6 {
    left: 2.15rem;
    bottom: 2.3rem;
  }
  
  .gacha_prize .gacha_prize_content .qiu_7 {
    left: 4.1rem;
    bottom: 1.45rem;
    z-index: 1;
  }
  
  .gacha_prize .gacha_prize_content .qiu_8 {
    left: 5.75rem;
    bottom: 2.65rem;
  }
  
  .gacha_prize .gacha_prize_content .qiu_9 {
    left: 7rem;
    bottom: 1.25rem;
    z-index: 1;
  }
  .gacha_prize .gacha_prize_content .bottom {
    width: 100%;
  }
  .gacha_prize .gacha_prize_content .bottom .shareInfo {
    position: absolute;
    bottom: 0.6rem;
    left: 50%;
    transform: translate(-50%, 0);
  }
  .gacha_prize .gacha_prize_content .bottom .shareInfo .shareBtn {
    margin: 0 auto;
    height: 1.8rem;
    width: 7.4rem;
    border-radius: 0.9rem;
    line-height: 1.8rem;
    font-size:0.7rem;
    text-align: center;
    background-size: 100% 100% !important;
  }
  .gacha_prize .gacha_prize_content .bottom .myPrizeInfo {
    width: 100%;
    position: absolute;
    bottom: 2.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.2rem;
    box-sizing: border-box;
  }
  .gacha_prize .gacha_prize_content .bottom .myPrizeInfo .prizeTime {
    font-size: 0.6rem;
    color: rgba(0, 0, 0, 0.6);
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
  }
  .gacha_prize .gacha_prize_content .bottom .myPrizeInfo .myPrize {
    font-size: 0.6rem;
    color: #761d1d;
    letter-spacing: 0;
    text-align: center;
    font-weight: 400;
    border: unset;
  }
  .gacha_prize .gacha_prize_content .turn-btn {
    position: absolute;
    right: 3.7rem;
    bottom: 4.2rem;
    width: 3.25rem;
    height: 3.25rem;
  }
  .gacha_prize .gacha_prize_content .turn-btn img {
    width: 100%;
    height: 100%;
  }
  .gacha_prize .gacha_prize_content .turn-btn {
    position: absolute;
    right: 3.7rem;
    bottom: 4.2rem;
    width: 3.25rem;
    height: 3.25rem;
  }
  .gacha_prize .gacha_prize_content .turn-btn img {
    width: 100%;
    height: 100%;
  }
  .gacha_prize .gacha_prize_content .btnRotate {
    transform: rotate(90deg);
  }
  .gacha_prize .gacha_prize_content .winParentEgg {
    display: none;
    position: fixed;
    width: 7.25rem;
    height: 7.25rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .gacha_prize .gacha_prize_content .downEgg {
    padding-left: 0.6rem;
    width: 2.1rem;
    height: 2.1rem;
    position: relative;
    overflow: hidden;
    display: inline-block;
  }
  .gacha_prize .downEgg:after {
    content: '';
    position: absolute;
    width: 2.1rem;
    height: 2.1rem;
    background-size: 100% 100%;
    animation: fanda 0.7s ease-out forwards;
    -webkit-animation: fanda 0.7s ease-out forwards;
  }
  .gacha_prize .winParentEgg {
    z-index:100
  }
  .gacha_prize .gacha_prize-mask{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    width: 100vw;
    height: 100vh;
    background-color: rgba(000, 000, 000, 0.6);
  }
  /* #endregion */
/* 扭蛋机 end */