/* game.gtimg.cn/images/yrzx/cp/a20200515gwxzzpc/ */
.wrap {
    position: absolute;
    overflow: hidden;
}
.wrap-content {
    width:1920px;
    height: 1080px;
    transform-origin: 0 0 0;
}

.page-bg {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
}

.bg {
    position: relative;
    width: 100%;
}

.page-bg .kv {
    width: 100%;
}

.page-bg .bg-main {
    height: 4053px;
    background: url(../images/bg-main.jpg) no-repeat 50% 0;
}
.kv-logo{
    position: absolute;
    top: 40px;
    left: 35px;
    width: 189px;

}
.kv-icon {
    width: 29px;
    height: 238px;
    background: url(../images/kv-icon.png)no-repeat center center/cover;
    position: absolute;
    top: 60px;
    left: 260px;
}

.log-box {
    position: absolute;
    top: 73px;
    right: 231px;
    font-size: 18px;
    color: #fff;
    z-index: 3;
}

.log-box a {
    font-size: 18px;
    color: #fff;
}

.website {
    width: 145px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    font-size: 25px;
    background-color: #000;
    color: #fff;
    position: absolute;
    top: 10px;
    right: 220px;
    display: block;
    z-index: 3;
}

.bbs {
    width: 145px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    font-size: 25px;
    background-color: #000;
    color: #fff;
    position: absolute;
    top: 10px;
    right: 380px;
    display: block;
    z-index: 3;
}

.main {
    width: 1300px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -650px;
    z-index: 2;
}

.slogan {
    width: 682px;
    height: 403px;
    background: url(../images/slogan.png) no-repeat center/cover;
    position: absolute;
    top: 552px;
    left: 50%;
    margin-left: -376px;
    text-indent: -9999px;
    z-index: 3;
}
.kv-btn-player{
    width: 76px;
    height: 76px;
    background: url(../images/btn-player.png) no-repeat center/cover;
    position: absolute;
    top: 340px;
    left: 50%;
    margin-left: -109px;
    animation: breathing 1s linear infinite;
}
.slogan-txt {
    width: 785px;
    height: 48px;
    background: url(../images/slogan-txt.png) no-repeat center/cover;
    position: absolute;
    top: 670px;
    left: 50%;
    margin-left: -392px;
    z-index: 2;
}

.main .download-box {
    position:relative;
    left:50%;
    top:580px;
    margin-left:-305px;
    overflow: hidden;
}

.main .code-box {
    width: 192px;
    height: 158px;
    position: relative;
    float: left;
    padding: 10px 10px 0 0;
    background: url(../images/bg-qr.png) no-repeat center/cover;
}

.main .code-box img {
   width: 138px;
   float: right;
}

.code-box .top-code-line {
  width: 138px;
    height: 19px;
  background: url(../images/top-code-line.png) no-repeat center/100% auto;
    position: absolute;
    top: 0;
  right: 10px;
    animation: scan_top 1.5s infinite alternate linear;
}

@keyframes scan_top {
    0% {
        transform: translateY(0px);
    }

    100% {
       transform: translateY(140px);
    }
}

.main .download-txt {
    display: none;
    float: left;
    width: 30px;
    font-size: 24px;
    color: #fff;
    writing-mode: vertical-rl;
    margin-left: 10px;
}

.video-box {
    width: 159px;
    height: 163px;
    background: url(../images/video-bg.jpg)no-repeat center/cover;
    float: left;
    margin-left: 30px;
    position: relative;
}

.bannervideo {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.4;
  background: url(../images/dd.gif) center 0 repeat;
  z-index: 1;
}

.btn-player {
    width: 80px;
    height: 80px;
    background: url(../images/btn-player.png) no-repeat center/cover;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -40px;
    margin-top: -40px;
    animation: breathing 1s linear infinite;
}

@keyframes breathing {
    0% {
        transform: scale(0.8);
        transform: scale(0.8);
    }

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

    100% {
	transform: scale(0.8);
	transform: scale(0.8);
    }
}
.main .btn-box {
    float: left;
}
.main .btn-box a {
    width: 232px;
    height: 72px;
    float: left;
    overflow: hidden;
    margin-top: 15px;
}

.main .btn-box a.ios {
    background: url(../images/d-ios1.png)no-repeat center/100% auto;
    margin-top: 0;
}

.main .android {
    background: url(../images/d-android1.png)no-repeat center/100% auto;
}
.main .btn-box .btn-left {
    float: left;
    margin-left: 12px;
}
.main .btn-box .btn-left a {
    display: block;
    float: none;
}
.main .btn-box .pc-simulator {
    width: 159px;
    height: 158px;
    margin-top: 0;
    margin-left: 12px;
    background: url(../images/d-pc-simulator1.png) no-repeat center/cover;
}
.main .btn-box .pc-simulator2 {
    width: 159px;
    height: 158px;
    margin-top: 0;
    margin-left: 12px;
    background: url(../images/d-pc-simulator2.png) no-repeat center/cover;
}
.download-gift{
    position: relative;
    margin-top: 734px;
    padding-top: 37px;
}
.download-gift .title{
    margin-right: 45px;
    margin-left: -25px;
}
.tit1 {
    width: 362px;
    height: 99px;
    background: url(../images/tit1.png)no-repeat center/cover;
    margin: 20px auto 15px;
}

.tip-tit1 {
    font-size: 22px;
    text-align: center;
    color: #fff;
    display: none;
}

.reward-list {
    overflow: hidden;
}

.reward-list li {
    width: 122px;
    float: left;
    margin-right: 30px;
    position: relative;
}

.reward-list li:last-child {
    margin-right: 0;
}

.reward-list li img {
    width: 100%;
    position: relative;
}

.reward-list li .name {
    width: 100%;
    font-size: 17px;
    font-weight: 500;
    position: relative;
    margin-top: 5px;
    color: #fff;
    text-align: center;
}

.reward-list li .name::before{
    content: '';
    width: 32px;
    height: 2px;
    background-image: url(../images/icon-before.png);
    background-repeat: no-repeat;
    background-size: 32px 2px;
    position: absolute;
    top: 0;
    left: 0;
}

.btn-receive {
    position: absolute;
    top:62px;
    right:-150px;
    width: 273px;
    height: 86px;
    background: url(../images/btn-receive1.png) no-repeat center/cover;
    animation: breathing 1.5s linear infinite;
}

.btn-receive-gray{
    width: 330px;
    height: 86px;
    background: url(../images/btn-receive-gray.png) no-repeat center/cover;
    margin: 55px auto 0;
    display: block;
}

.person-box {
    position: relative;
    height: 1069px;
    padding-top: 40px;
}

.role-img {
    width: 1806px;
    height: 1036px;
    position: absolute;
    top:233px;
    right: 0;
}

.tab-content {
    width: 440px;
    height: 630px;
    position: absolute;
    top:280px;
    z-index: 2;
}

.tit2 {
    position: absolute;
    right: -50px;
    top: 245px;
    width: 116px;
    height:469px;
    background: url(../images/tit2.png)no-repeat center/cover;
}

/* .tab1 .tit2{
    margin-top: 155px;
} */

.gather {
    font-size: 30px;
}

/* .icon-shape {
    width: 313px;
    height: 94px;
    background: url(../images/icon-shape.png)no-repeat center/cover;
    display: block;
    margin-top:43px;
}

.icon-shape3{
    width: 313px;
    height: 21px;
    background: url(../images/icon-shape3.png)no-repeat center/cover;
    display: block;
    margin-top:43px;
} */

.intro{
    width: 99px;
    height: 386px;
    font-size: 20px;
    line-height: 26px;
    color: #000;
    padding-top: 10px;
    writing-mode: vertical-rl;
}

.reward-box {
    width: 440px;
    height: 220px;
    margin-top: 35px;
}

.reward-box li{
    width: 220px;
    float: left;
    text-align: center;
}

.reward-box li:first-child{
    margin-left: -25px;
}

.reward-box li .img-box{
    width: 168px;
    height: 168px;
    margin: 0 auto;
}

.reward-box li .img-box img {
    width: 100%;
}

.reward-box li .name{
    font-size: 25px;
    font-weight: 500;
    margin-top: 15px;
}

.reward-box-3{
    width: 312px;
    height: 400px;
}

.reward-box-3 li{
    width: 142px;
    float: left;
    margin-right: 28px;
    margin-top: 15px;
}

.reward-box-3 li:nth-child(2n){
    margin-right:0;
}

.reward-box-3 li .img-box{
    width: 142px;
    height: 142px;
}

.reward-box-3 li .img-box img {
    width: 100%;
}

.reward-box-3 li .name{
    font-size: 23px;
    font-weight: 500;
    margin-top:5px;
    text-align: center;
}


.btn-receive-xs {
    width: 296px;
    height: 96px;
    background: url(../images/btn-receive-xs.png) no-repeat center/cover;
    display: block;
    margin-top: 105px;
}

.btn-receive-xs-gray{
    width: 296px;
    height: 96px;
    background: url(../images/btn-receive-xs-gray.png) no-repeat center/cover;
    display: block;
    margin-top: 157px;
}

.btn-invite{
    width: 296px;
    height: 96px;
    background: url(../images/btn-invite.png) no-repeat center/cover;
    position: absolute;
    top: 673px;
    left: 320px;
  animation: bounce 1s 0.2s ease infinite;
}

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
  }
}

@-webkit-keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
  }
}

.mask{
    width: 100%;
    height: 175px;
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 1094px;
    left: 0;
    z-index: 2;
}

.tab-list {
    width: 808px;
    height: 175px;
    position: absolute;
    bottom:0;
    left: 50%;
    margin-left: -390px;
}

.tab-list li {
    float: left;
    width: 249px;
    height: 95px;
    line-height: 110px;
    background: url(../images/icon-tab.png) no-repeat center/cover;
    cursor: pointer;
    margin-right: 25px;
    margin-top: 42px;
}

.tab-list li:last-child {
    margin-right: 0;
}

.tab-list li.on {
    background: url(../images/icon-tab-on.png) no-repeat center/cover;
}

.tab-list li span {
    font-size: 30px;
    color: #969696;
    padding-left: 101px;
}

.tab-list li.on span {
    color: #000;
}

.icon-cloud1 {
    width: 760px;
    height: 208px;
    background: url(../images/icon-cloud1.png) no-repeat center/cover;
    position: absolute;
    top: 1718px;
    right: 0;
    z-index: 2;
    pointer-events: none;
}

.icon-heart1 {
    width: 1737px;
    height: 319px;
    background: url(../images/icon-heart1.png) no-repeat center/cover;
    position: absolute;
    top: 1428px;
    left: 104px;
    z-index: 3;
    pointer-events: none;
}

.icon-cloud2 {
    width: 1920px;
    height: 1372px;
    background: url(../images/icon-cloud2.png) no-repeat center/cover;
    position: absolute;
    top: 1516px;
    left: 0;
    z-index: 0;
    pointer-events: none;
}

.icon-heart2 {
    width: 1384px;
    height: 524px;
    background: url(../images/icon-heart2.png) no-repeat center/cover;
    position: absolute;
    top: 2100px;
    left: 70px;
    z-index: 5;
    pointer-events: none;
}

.icon-dao{
    width: 20px;
    height: 441px;
    position: absolute;
    top: 1010px;
    right: 190px;
}

.welfare-txt{
    font-size: 30px;
    color:#969696;
    margin-top: 224px;
    margin-left: 228px;
}

.lottery {
    width: 991px;
    height: 966px;
    position: relative;
    margin-top: 25px;
    margin-left: 0;
}

.btn-lottery {
    width: 314px;
    height: 250px;
    background: url(../images/btn-lottery.png) no-repeat center/cover;
    position: absolute;
    top: 34%;
    left: 50%;
    margin-left: -157px;
}

.btn-lottery-gray{
    width: 337px;
    height: 268px;
    background: url(../images/btn-lottery-gray.png) no-repeat center/cover;
    position: absolute;
    top: 34%;
    left: 50%;
    margin-left: -168.5px;
}

/* .lotterycontent_start {
    animation: none !important;
} */

.lottery-txt {
    width: 337px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -168.5px;
    text-align: center;
    font-size: 28px;
}

.lottery-txt span {
    display: inline-block;
    width: 80px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    background: #000;
    border-radius: 20px;
}

.lottery-btn-box {
    width: 314px;
    height: 35px;
    line-height: 35px;
    position: absolute;
    top: 62%;
    left: 50%;
    margin-left: -157px;
    z-index: 1;
}

.lottery-btn-box a {
    display: inline-block;
    font-size: 28px;
    font-weight: bold;
    color: #797878;
    text-decoration: underline;
}

.btn-look {
    float: left;
}

.btn-lotteryInvite {
    float: right;
}

.tit3 {
    width: 381px;
    height: 1051px;
    position: absolute;
    top: 1546px;
    right: 163px;
}

.tit4 {
    width: 273px;
    height: 56px;
    background: url(../images/tit4.png) no-repeat center/cover;
    margin: 128px auto 0;
}

.swiper-fc {
    width: 1550px;
    height: 805px;
    margin-left: -125px;
    position: relative;
}

.swiper-fc .swiper-wrapper{
    margin-top: 118px;
}

.swiper-fc .swiper-slide {
    width: 1072px;
    height: 603px;
}

.swiper-fc .swiper-slide img {
    width: 100%;
    height: auto;
}

.swiper-fc .swiper-pagination {
    height: 118px;
    line-height: 118px;
    top: 0;
}

.swiper-fc .swiper-pagination .swiper-pagination-bullet {
    font-size: 26px;
    margin: 0 26px;
    color: #fff;
    background: none;
    opacity: 1;
}

.swiper-fc .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    color: #fec601;
}

.swiper-fc .swiper-button-next {
    right: -140px;
    width: 115px;
    height: 42px;
    background: url(../images/btn-next.png) no-repeat center/cover;
    outline: none;
}

.swiper-fc .swiper-button-prev {
    left: -140px;
    width: 115px;
    height: 42px;
    background: url(../images/btn-prev.png) no-repeat center/cover;
    outline: none;
}

.bottom-box {
     width: 1200px;
     height: 95px;
     margin: 80px auto 0;
 }

.bottom-box {
    width: 1200px;
    height: 95px;
    margin: 80px auto 0;
}

.bottom-box a {
    position: relative;
    float: left;
    margin-right: 70px;
}
.bottom-box a:last-child{
    margin-right:0;
}
.bottom-box .link-gzh {
    width: 332px;
    height: 93px;
    background: url(../images/link-gzh.png) no-repeat center/cover;
}

.bottom-box .link-gzh::before {
    width: 140px;
    height: 140px;
    position: absolute;
    left: 0;
    top: -20px;
    background: url(../images/qr-wechat.jpg) no-repeat;
    background-size: 100% 100%;
    content: '';
    clear: both;
    display: none;
}

.bottom-box .link-qb {
    width: 319px;
    height: 93px;
    background: url(../images/link-qb.png) no-repeat center/cover;
}

.bottom-box .link-qb::before {
    width: 140px;
    height: 140px;
    position: absolute;
    left: -13px;
    top: -23px;
    background: url(../images/qr-qb.jpg) no-repeat;
    background-size: 100% 100%;
    content: '';
    clear: both;
    display: none;
}

.bottom-box .link-wxq {
    width: 347px;
    height: 92px;
    background: url(../images/link-wxq.png) no-repeat center/cover;
}

.bottom-box .link-qq {
    width: 300px;
    height: 98px;
    background: url(../images/link-qq.png) no-repeat center/cover;
    margin-right: 0;
}

.bottom-box .link-weibo {
    background: url(../images/link-weibo.png) no-repeat center/cover;
}

.bottom-box a:hover::before {
    display: block;
}

.rule-list{
    font-size: 16px;
    color:#000;
    margin-top: 90px;
}

.rule-list li{
    line-height: 30px;
    position: relative;
}

.rule-list li::before{
    content: '';
    width: 9px;
    height: 9px;
    margin-right: 10px;
    background: #000;
    border-radius: 50%;
    display: inline-block;
    vertical-align: baseline;
}

.rule-list li .fillInfo{
    font-size: 16px;
    color:#fff;
}

/* ���� */
#_overlay_ {
    height: 100% !important;
    position: fixed !important;
}

.dia {
    padding-top: 35px;
    width: 475px;
    position: relative;
    color: #fff;
    text-align: center;
    font-size: 20px;
}

.dia-bg-1 {
    height: 267px;
    background: url(../images/dia-bg-1.jpg) no-repeat center/cover;
}

.dia-bg-2 {
    height: 490px;
    background: url(../images/dia-bg-2.jpg) no-repeat center/cover;
}

.dia-bg-3 {
    height: 406px;
    background: url(../images/dia-bg-3.jpg) no-repeat center/cover;
}

.dia-bg-4 {
    height: 514px;
    background: url(../images/dia-bg-4.jpg) no-repeat center/cover;
}

.dia-close {
    width: 48px;
    height: 48px;
    background: url(../images/dia-close.png) no-repeat center/cover;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    z-index: 1;
}

#dia-login h5 {
    width: 82px;
    height: 26px;
    background: url(../images/dia-log-txt.png) no-repeat center/cover;
    margin: 0 auto;
}

#dia-login .dia-btn-box {
    width: 285px;
    height: 115px;
    margin: 20px auto 0;
}

#dia-login .dia-btn-box a {
    width: 84px;
    height: 115px;
    display: inline-block;
}

#dia-login .dia-qq {
    background: url(../images/dia-qq.png) no-repeat center/cover;
    float: left;
}

#dia-login .dia-wx {
    background: url(../images/dia-wx.png) no-repeat center/cover;
    float: right;
}

#dia-sel h5 {
    width: 263px;
    height: 26px;
    background: url(../images/dia-sel-txt.png) no-repeat center/cover;
    margin: 0 auto;
}

#dia-sel ul {
    margin-top: 30px;
    font-size: 22px;
}

#dia-sel ul li {
    margin-bottom: 18px;
}

#dia-sel ul li select {
    width: 268px;
    height: 33px;
    line-height: 33px;
    background: url(../images/dia-sel-box.png) no-repeat center/cover;
    border: none;
    padding-left: 5px;
    color: #696969;
    font-size: 20px;
}

#dia-sel .dia-tip-txt {
    width: 308px;
    height: 23px;
    background: url(../images/dia-tip-txt2.png) no-repeat center/cover;
    margin: 30px auto 0;
}

.btn-confirm {
    display: block;
    width: 128px;
    height: 38px;
    background: url(../images/btn-confirm.png) no-repeat center/cover;
    margin: 0 auto;
}

.btn-copy {
    display: block;
    width: 128px;
    height: 38px;
    background: url(../images/btn-copy.png) no-repeat center/cover;
    margin: 24px auto 0;
    border: none;
    cursor: pointer;
}

.btn-determine {
    display: block;
    width: 128px;
    height: 38px;
    background: url(../images/btn-determine.png) no-repeat center/cover;
    margin: 25px auto 0;
}

.btn-download {
    display: block;
    width: 143px;
    height: 38px;
    background: url(../images/btn-download.png) no-repeat center/cover;
    margin: 22px auto 0;
}

#dia-prompt h5 {
    width: 109px;
    height: 26px;
    background: url(../images/dia-tip-txt1.png) no-repeat center/cover;
    margin: 0 auto;
}

.common-tip-1 {
    color: #dadada;
    margin-top: 10px;
}

.common-tip-2 {
    width: 350px;
    color: #7c7c7c;
    margin: 18px auto 0;
    text-align: left;
}

.common-tip-3 {
    width: 405px;
    color: #f5d23f;
    margin: 20px auto 0;
}

.change-bind {
    font-size: 20px;
    color: #f5d23f;
}

#dia-rewardGetSucc .common-tip-1,
#dia-giftGetSucc .common-tip-1 {
    margin-top: 35px;
}

#dia-rewardGetSucc .common-tip-2,
#dia-giftGetSucc .common-tip-2 {
    width: 410px;
    text-align: center;
}

#dia-copyLink .dia-box {
    width: 345px;
    height: 126px;
    margin: 45px auto 0;
}

#dia-copyLink .dia-box p {
    width: 170px;
    height: 116px;
    float: left;
    text-align: justify;
    margin-top: 10px;
}

#dia-copyLink .dia-box img {
    width: 126px;
    height: 126px;
    float: right;
}

#dia-copyLink input {
    width: 385px;
    height: 35px;
    line-height: 35px;
    padding: 0 5px;
    color: #696969;
    font-size: 16px;
    border: 1px solid #757575;
    background: #292929;
    border-radius: 5px;
    margin-top: 38px;
}

#dia-rewardShow .img-box img{
    width: 127px;
    height: 127px;
}

#dia-rewardShow .img-box p {
    margin-top: 10px;
}

#dia-null .common-tip-2 {
    width: 410px;
    margin: 25px auto 0;
}

.common-tip-4 {
    font-size: 27px;
    color: #dadada;
    margin-top: 30px;
}

#dia-record h5 {
    width: 106px;
    height: 26px;
    background: url(../images/dia-record-txt.png) no-repeat center/cover;
    margin: 0 auto;
}

#dia-record ul {
    width: 450px;
    height: 148px;
    color: #7c7c7c;
    margin: 30px auto 0;
    overflow-y: auto;
}

#dia-record ul li {
    margin-bottom: 22px;
}

#dia-record ul li:last-child {
    margin-bottom: 0;
}

#dia-record ul li span {
    display: inline-block;
    margin-right: 1rem;
}

.scrollbar::-webkit-scrollbar {
    width: 8px;
    height: 4px;
}

.scrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px #a6a6a6;
    background: #a6a6a6;
}

.scrollbar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px #666;
    border-radius: 10px;
    background: #666;
}

#dia-fillInfo h5 {
    width: 161px;
    height: 26px;
    background: url(../images/dia-info-txt.png) no-repeat center/cover;
    margin: 0 auto;
}

#dia-fillInfo ul li {
    margin-top: 28px;
}

#dia-fillInfo ul li input {
    width: 270px;
    height: 40px;
    line-height: 40px;
    padding: 0 5px;
    color: #696969;
    font-size: 20px;
    padding: 0 5px;
    border: 1px solid #757575;
    background: #292929;
    border-radius: 5px;
}

#dia-fillInfo .common-tip-3 {
    margin: 30px auto 0;
}

#container {
    width: 800px;
    height: 500px;
}

.dia-video {
    margin: -250px 0 0 -400px !important;
    position: relative;
}

.dia-video .btn-closeVideo {
    position: absolute;
    top: 0;
    right: -48px;
    color: #fff;
    font-size: 30px;
    width: 48px;
    height: 48px;
    text-align: center;
    background: rgba(0, 0, 0, 0.8);
}

/* 底部 */
.foot-container {
    width: 100%;
    background: #000;
}

#gfooter {
    width: 82%;
    margin: 0 auto;
    padding: 0 9%;
    background: #000;
    font: 12px/20px '微软雅黑', '宋体';
}

a.foot_left {
    border: none;
    display: block;
    width: 159px !important;
    height: 50px !important;
}

a.foot_left img {
    display: block;
    width: 159px !important;
    height: 50px !important;
}

.foot li {
    font: 12px/20px '微软雅黑', '宋体';
}

#ams_loginWxDiv{
    box-sizing: content-box !important;
}


.side-load {
  position: fixed;
  left: 0;
  bottom: 15%;
  height: 650px;
  width: 415px;
  background: url(../images/side-person.png) no-repeat left top;
  display: none;
}

.side-load .code-box {
  float: left;
  width: 160px;
  height: 160px;
}
.side-load .code-box img {
  width: 100%;
}
.side-load .code-box .top-code-line {
  width: 160px;
  right: auto;
  left: 12px;
  top: 20px;
}
.side-load .btn-close{
    position: absolute;
    left: 225px;
    top:180px;
    width: 36px;
    height: 36px;
    background: url(../images/side-btn.png) no-repeat center/cover;
}
.side-load .download-box{
    position: absolute;
    left:30px;
    top:230px;
    margin-left: 0;
    background: #000;
    padding: 20px 10px;
    overflow: hidden;
    /* transition: all .3s; */
}
.side-load .download-txt {
  color: #fff;
  float: left;
  width: 30px;
  font-size: 26px;
  writing-mode: vertical-rl;
  margin-left: 10px;
}
.side-load .btn-box a {
  width: 195px;
  height: 55px;
  display: block;
  margin-top: 15px;
}
.side-load .btn-box a.ios {
  margin-top: 185px;
  background: url(../images/side-down-ios.png) no-repeat center/cover;
}
.side-load  .btn-box a.android{
    background: url(../images/side-down-android.png)no-repeat center/cover;
}
.side-load  .btn-box a.pc-simulator{
    background: url(../images/side-down-pc.png)no-repeat center/cover;
}
.side-load.close{
    background:transparent;
    height:650px;
    width: 50px;
    height: 202px;
    bottom: 35%;
    /* transition: all .3s; */
}
.side-load.close .btn-close{
    left:5px;
    top:-40px;
    transform: rotate(180deg);
}
.side-load.close .download-box{
    left: 0;
    top:0;
    height: 202px;
    left: -175px;
}

.light-box {
    position: absolute;
    /* width:425px;
    height:306px; */
    width: 97px;
    height: 96px;
    left: 50%;
    top: 12px;
    transform: translateX(-50%);
    z-index: 1;
    background: url(../images/bg-light2.png) no-repeat center;
    /* background: url(../images/light.png) no-repeat 0 0;
    animation: light 1s steps(1) infinite; */
    animation: breath 1.5s infinite;
}
.reward-list li .icon-border {
    position: absolute;
    width: 79px;
    height: 78px;
    left: 50%;
    top: 22px;
    z-index: 5;
    transform: translateX(-50%);
}
@keyframes breath {
    0%,100%{
        transform: translateX(-50%) scale(1);
    }
    50% {
        transform: translateX(-50%) scale(1.05);
    }
}
@keyframes light {
    0% {
        background-position: -0px -0px
    }
    4%{
        background-position: -425px -0px
    }
    8%{
        background-position: -0px -306px
    }
    12%{
        background-position: -425px -306px
    }
    16%{
       background-position: -0px -612px
    }
    20%{
        background-position: -425px -612px
    }
    24%{
        background-position: -0px -918px
    }
    28%{
        background-position: -425px -918px
    }
    32% {
        background-position: -0px -1224px
    }
    36% {
        background-position: -425px -918px
    }
    40% {
        background-position: -0px -1224px
    }
    44% {
        background-position: -425px -1224px
    }
    48% {
        background-position: -0px -1530px
    }
    52% {
        background-position: -425px -1530px
    }
    56% {
        background-position: -0px -1836px
    }
    60% {
        background-position: -425px -1836px
    }
    64% {
        background-position: -0px -2142px
    }
    68% {
        background-position: -425px -2142px
    }
    70% {
        background-position: -0px -2448px
    }
    74% {
        background-position: -425px -2448px
    }
    78% {
        background-position: -0px -2754px
    }
    80% {
        background-position: -425px -2754px
    }
    84% {
        background-position: -0px -3060px
    }
    88% {
        background-position: -425px -3060px
    }
    92% {
        background-position: -0px -3366px
    }
    96% {
        background-position: -425px -3366px
    }
    100% {
        background-position: -0px -3672px
    }
}

.showTips {
    width:
        863px;
    height:
        498px;
    background:
        url(../images/pckuang.png) no-repeat center;
    display:
        none;
}

.childtips {
    width:122px;
    height:158px;
    background:url(../images/slts16.png) no-repeat center;
    position:absolute;
    left:0%;
    top:652px;
    background-size:100%;
    z-index:99;
    margin-left: 312px;
}

.childtips:hover {
    transform:
        scale(1.2);
}

.showTipsCon {
    width:
        700px;
    margin:
        76px auto 0;
}

.showTipsCon ul {
    height:
        316px;
    overflow-y:
        scroll;
}

.showTipsCon ul li {
    margin-top:
        10px;
}

.showTipsCon ul li p {
    text-indent:
        2em;
    margin-top:
        10px;
}

.showTipsCon ul::-webkit-scrollbar {
    width:
        8px;
    height:
        9px;
    border-radius:
        8px;
    background:
        rgba(0,
            0,
            0,
            0);
}

.showTipsCon ul::-webkit-scrollbar-thumb {
    border-radius:
        15px;
    background:
        rgb(126,
            105,
            88);
}

.showTipsCon ul::-webkit-scrollbar-track {
    border-radius:
        8px;
}

.showTips .closeDia {
    color:
        #656262;
    font-size:
        30px;
    position:
        absolute;
    right:
        70px;
    top:
        60px;
    height:
        44px;
    line-height:
        28px;
    width:
        44px;
    text-align:
        center;
    z-index:
        9999;
    line-height:
        44px;
    text-decoration:
        none;
}