* {
  margin: 0;
  padding: 0;
}
html,
body {
  position: relative;
  font-family: Arial, sans-serif, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑';
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
  height: 100%;
}
ul li {
  list-style: none;
}
img {
  max-width: 100%;
  display: block;
  border: 0 none;
}
.main {
  width: 100%;
  height: 66rem;
  background: url('../img/bg.jpg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  position: relative;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
.share {
  position: fixed;
  right: 0.2rem;
  top: 29%;
  width: 1.19rem;
  height: 1.65rem;
  z-index: 100;
}
.nav {
  background: rgba(15,12,37, 0.8);
  padding: 0.15rem 0.2rem 0 0.2rem;
  height: 1.2rem;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.nav-icon {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.nav-icon img {
  width: 1.2rem;
  height: 1.2rem;
}
.icon-msg {
  margin-left: 0.17rem;
}
.icon-msg p{
  font-size: 0.36rem;
  color: #fff;
}
.icon-msg span {
  font-size: 0.24rem;
  color: #a7a6ab;
  display: block;
  margin-top: 0.05rem;
}
.nav-down {
  text-align: center;
}
.download-app {
  width: 2.39rem;
  height: 0.61rem;
  background: url('../img/download-img.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.nav-down p {
  font-size: 0.2rem;
  color: #fff8ca;
  margin-top: 0.05rem;
}
.integral {
  color: #e4440e;
}
.main-msg {
  width: 7.01rem;
  height: 3.79rem;
  background: url('../img/main-msg.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  margin: 0 auto;
  margin-top: 5.59rem;
}
.gift {
  width: 6.57rem;
  height: 2.33rem;
  margin: 0 auto;
  margin-top: 0.2rem;
}
.box-1, .box-2, .box-3 {
  margin: 0 auto;
  margin-top: 0.35rem;
  width: 100%;
}
.box-title {
  width: 7.17rem;
  /* height: 2.13rem; */
  margin: 0 auto;
}
.box-title-btn {
  display: flex;
  width: 86%;
  margin: 0 auto;
  justify-content: space-between;
  align-items: center;
}
.box-title-btn img {
  width: 2.96rem;
  height: 0.76rem;
}
.box-slide {
  margin: 0 auto;
  width: 6.94rem;
  height: 4rem;
  background: url('../img/swiper-bg.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  margin-top: 0.15rem;
  padding: 0.08rem 0.08rem;
  box-sizing: border-box;
  position: relative;
}
.box-slide-1, .box-slide-2, .box-slide-3, .box-slide-4 {
  display: none;
}
.arrow-left {
  position: absolute;
  left: -0.2rem;
  top: 42%;
  width: 0.36rem;
  height: 0.62rem;
}
.arrow-right {
  position: absolute;
  right: -0.2rem;
  top: 42%;
  width: 0.36rem;
  height: 0.62rem;
}
.arrow-right img {
  transform: rotate(-180deg);
}
.box-2 .box-title-btn {
  margin-top: 0.3rem;
}
.box-3 {
  margin-top: 0.55rem;
}
.box-3 .box-slide {
  /* overflow: hidden; */
  padding: 0.08rem 0.08rem 0.08rem 0.08rem;
  display: flex;
  justify-content: center;
}
.box-swiper {
  overflow: hidden;
  position: relative;
  margin: 0 auto;
  height: 4.4rem;
}
.box-swiper img {
  max-width: 100%;
}
.box-swiper .swiper-pagination {
  /* bottom: -0.5rem !important; */
  bottom: -0.2rem !important;
}
.box-swiper .swiper-pagination-bullet {
  opacity: 1 !important;
  cursor: pointer;
  display: inline-block;
  margin-right: 0.13rem;
  width: 0.33rem;
  height: 0.32rem;
  background: url('../img/slide-paging.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.box-swiper .swiper-pagination-bullet-active {
  background: url('../img/slide-paging-show.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.swiper-button-prev {
  width: 0.36rem !important;
  height: 0.62rem !important;
  position: absolute;
  top: 54% !important;
  background-image: url('../img/arrow.png') !important;
  background-repeat: no-repeat;
  background-size: 100%;
  margin-left: -0.42rem;
  z-index: 99;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
.swiper-button-prev::after {
  content: '' !important;
}
.swiper-button-next {
  width: 0.36rem !important;
  height: 0.62rem !important;
  position: absolute;
  top: 54% !important;
  background-image: url('../img/arrow.png') !important;
  background-repeat: no-repeat;
  background-size: 100%;
  transform: rotate(180deg);
  margin-right: -0.42rem;
  z-index: 1;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
.swiper-button-next::after {
  content: '' !important;
}
.box-4 {
  margin-top: 0.95rem;
}
.box-4 .box-2-swiper {
  width: 6.92rem;
  height: 4.4rem;
  position: absolute;
  left: -0.05rem;
  overflow: hidden;
}
.box-2-swiper .swiper-pagination {
  bottom: -0.2rem !important;
}
.box-2-swiper .swiper-pagination-bullet {
  opacity: 1 !important;
  cursor: pointer;
  display: inline-block;
  margin-left: 0.55rem !important;
  margin-right: 0.55rem !important;
  width: 0.33rem;
  height: 0.32rem;
  background: url('../img/slide-paging.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.box-2-swiper .swiper-pagination-bullet-active {
  background: url('../img/slide-paging-show.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.box-3-swiper {
  width: 7.06rem;
  height: 4.7rem;
  position: absolute;
  left: 0.08rem;
  overflow: hidden;
}
/* .box-3-swiper .swiper-pagination {
  bottom: -0.1rem !important;
} */
.box-3-swiper .swiper-pagination-bullets {
  width: 90% !important;
  left: 48% !important;
  transform: translateX(-50%);
  display: flex;
  justify-content: space-between;
}
.box-3-swiper .swiper-pagination-bullet {
  opacity: 1 !important;
  cursor: pointer;
  display: inline-block;
  /* margin-left: 0.50rem !important;
  margin-right: 0.55rem !important; */
  width: 0.33rem;
  height: 0.32rem;
  background: url('../img/slide-paging.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.box-3-swiper .swiper-pagination-bullet-active {
  background: url('../img/slide-paging-show.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.swiper-pagination-bullet:focus {
  outline: none;
}
.swiper-button-next, .swiper-button-next:focus {
  outline: none;
}
.swiper-button-prev, .swiper-button-prev:focus {
  outline: none;
}
.box-5 {
  margin-top: 1.25rem;
}
.box-5-msg {
  width: 5.64rem;
  height: 0.25rem;
  margin: 0 auto;
  margin-top: 0.75rem;
}
.box-gift {
  margin-top: 0.75rem;
}
.box-redeem {
  width: 85%;
  margin: 0 auto;
  margin-top: 0.25rem;
  display: flex;
  justify-content: space-between;
}
.box-redeem-1 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.box-redeem-gift {
  width: 3rem;
  height: 2.54rem;
  position: relative;
}
.box-redeem-gift-1 {
  background: url('../img/gift-1.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.box-redeem-gift-2 {
  background: url('../img/gift-2.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.redeem-msg {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  text-align: center;
  font-size: 0.24rem;
  color: #fdecce;
}
.redeem-btn {
  width: 2.96rem;
  height: 0.76rem;
  margin-top: 0.2rem;
  cursor: pointer;
}
.box-lottery {
  width: 100%;
  position: relative;
  margin-top: 0.45rem;
}
.box-prize {
  display: flex;
  width: 80%;
  justify-content: space-between;
  flex-wrap: wrap;
  overflow: hidden;
  margin: 0 auto;
}
.box-prize img {
  width: 2.71rem;
  height: 2.51rem;
  margin-top: 0.3rem;
}
.btn-lottery {
  position: absolute;
  left: 50%;
  top: 37%;
  transform: translateX(-50%);
  width: 2.06rem;
  height: 1.93rem;
}
.lotter-record {
  position: absolute;
  left: 0;
  top: 40%;
  width: 0.54rem;
  height: 1.3rem;
}
.footer {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1.01rem;
}
.noscroll {
  overflow: hidden !important;
}
.mask {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 100;
  display: none;
}
.pop-1 {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  top: 30%;
  background: url('../img/pop-bg-1.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  width: 5.24rem;
  height: 2.28rem;
  display: none;
  animation: showDialog 0.5s;
  animation-timing-function: cubic-bezier(0.6,0,0.4,1);
  z-index: 102;
}
.pop-close {
  width: 0.46rem;
  height: 0.45rem;
  position: absolute;
  right: 5%;
  transform: translateX(-50%);
  top: 30%;
  animation: showClose 0.5s;
  animation-timing-function: cubic-bezier(0.6,0,0.4,1);
}
.pop-msg {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 0.36rem;
  color: #512c2c;
  font-weight: 700;
  padding: 0 0.6rem;
  box-sizing: border-box;
  text-align: center;
  overflow: hidden;
}
.pop-msg p span {
  color: #dd5454;
}
.pop-btn {
  width: 2.25rem;
  height: 0.44rem;
  background: url('../img/pop-1-btn.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  font-size: 0.24rem;
  color: #fff1e1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.15rem;
}
.pop-2 {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  top: 30%;
  width: 5.24rem;
  height: 5.08rem;
  background: url('../img/pop-bg-2.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: none;
  animation: showDialog 0.5s;
  animation-timing-function: cubic-bezier(0.6,0,0.4,1);
  z-index: 102;
}
.pop-input {
  width: 100%;
  height: 100%;
  padding: 0.4rem 0.4rem 0.25rem 0.4rem;
  box-sizing: border-box;
  display: none;
}
.pop-input-title {
  width: 100%;
  text-align: center;
  font-size: 0.48rem;
  font-weight: 700;
  color: #512c2c;
  margin-bottom: 0.3rem;
}
.pop-enter {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 0.23rem;
}
.enter-msg {
  width: 1rem;
  font-size: 0.24rem;
  color: #512c2c;
  font-weight: 600;
  text-align: right;
}
.pop-enter input {
  flex: 1;
  height: 0.6rem;
  border: 1px solid #d0a778;
  background: #c9b8ac;
  box-sizing: border-box;
  font-size: 0.28rem;
  text-indent: 0.2rem;
  color: #512c2c;
}
.pop-2-btn {
  margin: 0 auto;
  margin-top: 0.45rem;
}
.pop-info {
  width: 100%;
  height: 100%;
  padding: 0.25rem 0.3rem;
  box-sizing: border-box;
  display: none;
}
.pop-info-msg {
  width: 100%;
  font-size: 0.24rem;
  color: #512c2c;
  margin-top: -0.23rem;
}
.pop-message {
  width: 100%;
  padding-left: 0.1rem;
  box-sizing: border-box;
  font-size: 0.3rem;
  color: #512c2c;
  font-weight: 600;
  margin-top: 0.3rem;
  margin-bottom: 0.2rem;
}
.pop-2 .pop-enter {
  margin-top: 0.1rem;
}
.pop-3-btn {
  margin: 0 auto;
  margin-top: 0.35rem;
}
.pop-list {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: scroll;
  display: none;
}
.pop-list ul {
  width: 100%;
  padding: 0.15rem 0.15rem 0.45rem 0.15rem;
  box-sizing: border-box;
}
.pop-list ul li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #c9b8ac;
  padding: 0.25rem 0.15rem 0.15rem 0.25rem;
  box-sizing: border-box;
}
.pop-list ul li:last-child {
  border-bottom: none;
}
.pop-list ul li p {
  font-size: 0.24rem;
  color: #512c2c;
  font-weight: 600;
}
.pop-list-time, .pop-list-award {
  width: 25%;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pop-list-operate {
  flex: 1;
  text-align: center;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.operate-btn {
  width: 2.25rem;
  height: 0.44rem;
  background: url('../img/pop-1-btn.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  text-align: center;
  font-size: 0.24rem;
  color: #fff;
  display: flex;
  line-height: 0.48rem;
  justify-content: center;
  font-weight: normal;
}
.pop-rules {
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translateX(-50%);
  width: 5.24rem;
  height: 7.28rem;
  background: url('../img/pop-rules.jpg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  display: none;
  animation: showDialog 0.5s;
  animation-timing-function: cubic-bezier(0.6,0,0.4,1);
}
.pop-share {
  position: absolute;
  right: 0;
  top: 0;
  width: 6.77rem;
  height: 3.47rem;
  display: none;
}
.tips {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  background: transparent;
  display: none;
}
.tips p{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%);
  font-size: 0.28rem;
  display: inline-block;
  white-space: nowrap;
  padding: 0.1rem 0.5rem;
  border-radius: 26px;
  text-align: center;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
}
.isWechat {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  /* height: 100%; */
  background: #fff;
  z-index: 105;
  display: none;
}
.isWechat p {
  font-size: 0.36rem;
  margin: 0 auto;
  width: 100%;
  text-align: center;
  margin-top: 1.5rem;
  color: #606266;
}
@keyframes showDialog {
  0% {
    opacity: 0;
    left: 50%;
    transform: scale3d(0, 0, 0), translateX(-50%);
  }
  100% {
    opacity: 1;
    left: 50%;
    transform: scale3d(1, 1, 1), translateX(-50%);
  }
}
@keyframes showClose {
  0% {
    opacity: 0;
    right: 5%;
    transform: scale3d(0, 0, 0), translateX(-50%);
  }
  100% {
    opacity: 1;
    right: 5%;
    transform: scale3d(1, 1, 1), translateX(-50%);
  }
}