* {
    padding: 0;
    margin: 0;
}

html, body {
    position: relative;
}

.h1, .h2, .h3, .h4, .h5, .h6, a, abbr, body, cite, dd, dl, dt, h1, h2, h3, h4, h5, h6, iframe, input, li, object, ol, p, pre, span, ul {
    font-family: 'Microsoft YaHei', 'SF Pro Display', Roboto, Noto, Arial, 'PingFang SC', sans-serif;
}

a {
    text-decoration: none;
}

li {
    list-style: none;
}

.wrap {
    position: relative;
    overflow: hidden;
    background: #221a17;
}

.page {
    width: 19.2rem;
    overflow: hidden;
    position: relative;
}

.page1 {
    height: 12.27rem;
    background: url(../img/bg5.jpg?v=1) no-repeat;
    background-size: 100%;
}

.logo {
    width: 2.2rem;
    position: absolute;
    right: 0.2rem;
    top: 0.1rem;
}

.vbtn {
    width: 1.15rem;
    height: 1.15rem;
    position: absolute;
    left: 50%;
    top: 4.8rem;
    margin-left: 0.65rem;
    background: url(../img/v1.png) no-repeat;
    background-size: 100%;
}

.v-rotate {
    width: 100%;
    position: absolute;
    cursor: pointer;
    -webkit-animation: vrotate 2s linear infinite;
    -moz-animation: vrotate 2s linear infinite;
    -o-animation: vrotate 2s linear infinite;
    animation: vrotate 2s linear infinite;
}

@-webkit-keyframes vrotate {
    to {
        transform: rotate(360deg);
    }
}

@-moz-keyframes vrotate {
    to {
        transform: rotate(360deg);
    }
}

@-o-keyframes vrotate {
    to {
        transform: rotate(360deg);
    }
}

@keyframes vrotate {
    to {
        transform: rotate(360deg);
    }
}

.download {
    width: 4.98rem;
    height: 1.28rem;
    background: url(../img/download.png) no-repeat;
    background-size: 100%;
    position: absolute;
    top: 8.4rem;
    left: 50%;
    margin-left: -0.3rem;
    cursor: pointer;
}

.jr {
    width: 1.94rem;
    height: 0.5rem;
    background: url(../img/toIndex.png) no-repeat;
    background-size: 100%;
    background-position: 0 0;
    position: absolute;
    right: 1.6rem;
    top: 1.4rem;
    z-index: 9999;
}

.page2 {
    height: 11.11rem;
    background: url(../img/bg2.jpg) no-repeat;
    background-size: 100%;
}

.page3 {
    height: 16.64rem;
    background: url(../img/bg3.jpg?v=1) no-repeat;
    background-size: 100%;
}

.title {
    display: block;
    width: 9.19rem;
    margin: 0 auto;
}

.t1 {
    margin-top: 0.5rem;
}

.swiper-container {
    width: 12.7rem;
    margin: 0 auto;
}

.swiper-slide {
    width: 9.1rem;
}

.swiper-slide img {
    display: block;
    width: 100%;
}

.sw-desc {
    position: absolute;
    bottom: -100%;
    left: 2%;
    width: 96%;
    height: 0.66rem;
    background: rgba(0, 0, 0, 0.5);
    font-size: 0.24rem;
    color: #fff;
    line-height: 0.66rem;
    text-indent: 0.2rem;
    bottom: 3.8%;
}

.sw-desc img {
    position: absolute;
    width: 1.73rem;
    right: 0.3rem;
    top: 0.1rem;
    cursor: pointer;
}

.swiper-button-prev {
    width: 0.72rem;
    height: 0.72rem;
    background: url(../img/pagebtn.png);
    background-size: auto 100%;
    left: 1rem;
}

.swiper-button-next {
    width: 0.72rem;
    height: 0.72rem;
    background: url(../img/pagebtn.png);
    background-position: right;
    background-size: auto 100%;
    right: 1rem;
}

.swbtnbg {
    width: 12.6rem;
    height: 2.08rem;
    background: url(../img/swbtnbg.png) no-repeat;
    background-size: 100%;
    margin: 0.4rem auto;
    overflow: hidden;
    position: relative;
}

.swnav {
    width: 5.9rem;
    height: 1.55rem;
    background: url(../img/swnav1-2.png) no-repeat;
    background-size: 5.45rem 1rem;
    background-position: 0.3rem 0.26rem;
    margin-left: 3.3rem;
    margin-top: 0.26rem;
}

.swnav div {
    width: 25%;
    height: 100%;
    float: left;
    cursor: pointer;
}

.swnavact {
    width: 1.78rem;
    height: 1.91rem;
    position: absolute;
    left: 3.25rem;
    top: 0.05rem;
    transition: left 0.2s;
}

.swnavact0 {
    background: url(../img/swnav3.png) no-repeat;
    background-size: auto 100%;
    left: 3.25rem;
}

.swnavact1 {
    background: url(../img/swnav3.png) no-repeat;
    background-size: auto 100%;
    background-position: -1.78rem 0;
    left: 4.75rem;
}

.swnavact2 {
    background: url(../img/swnav3.png) no-repeat;
    background-position: -3.52rem 0;
    background-size: auto 100%;
    left: 6.2rem;
}

.swnavact3 {
    background: url(../img/swnav3.png) no-repeat;
    background-position: -5.28rem 0;
    background-size: auto 100%;
    left: 7.65rem;
}

.btns {
    height: 5.5rem;
    margin-top: 5.3rem;
    position: relative;
}

.btns img {
    width: 2.39rem;
    position: absolute;
    cursor: pointer;
}

.btns1 {
    left: 1.7rem;
    top: 0.75rem;
}

.btns2 {
    left: 5.5rem;
    top: 0rem;
}

.btns3 {
    left: 6.5rem;
    top: 3rem;
}

.btns4 {
    left: 11.75rem;
    top: 2.8rem;
}

.btns5 {
    left: 15.65rem;
    top: 0.2rem;
}

.botbtns {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.6rem;
}

.botbtns a {
    width: 5rem;
    height: 1.22rem;
    margin: 0 0.6rem;
    cursor: pointer;
}

.botbtn1 {
    background: url(../img/botbtn.png) no-repeat;
    background-size: 11.12rem 2.53rem;
    background-position: left bottom;
}

.botbtn2 {
    background: url(../img/botbtn.png) no-repeat;
    background-position: right bottom;
    background-size: 11.12rem 2.53rem;
}

.botbtn1:hover {
    background-position: left top;
}

.botbtn2:hover {
    background-position: right top;
}

.pop {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    display: none;
}

.poplist, .popzt {
    width: 11.3rem;
    height: 8.97rem;
    position: absolute;
    left: 50%;
    margin-left: -5.65rem;
    top: 50%;
    margin-top: -4.48rem;
}

.poplist1, .popzt1 {
    background: url(../img/pop3.png) no-repeat;
    background-size: 100%;
}

.popimg {
    width: 100%;
}

.close, .loginclose, .regclose, .giftclose, .videoclose {
    width: 0.6rem;
    position: absolute;
    left: 50%;
    margin-left: 5.8rem;
    top: 50%;
    margin-top: -4.2rem;
    cursor: pointer;
}

.poplist-prev, .poplist-next {
    width: 0.87rem;
    height: 0.87rem;
    background: url(../img/arrow.png) no-repeat;
    background-size: auto 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -0.4rem;
    cursor: pointer;
}

.poplist-prev {
    margin-left: -7rem;
}

.poplist-next {
    margin-left: 6.1rem;
    background-position: right;
}

.lines {
    width: 5.14rem;
    height: 0.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(../img/line.png) no-repeat;
    background-size: 100%;
    margin: 4.3rem auto 0;
}

.line {
    width: 50%;
    height: 100%;
    background: url(../img/line.png) no-repeat;
    background-size: 200% auto;
    background-position: left top;
}

.lineact {
    background-position: left bottom;
}

.gsbox {
    width: 7.5rem;
    height: 4rem;
    position: absolute;
    left: 2rem;
    top: 2.8rem;
}

.gsboxlist {
    width: 33.33%;
    height: 100%;
    float: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.gsboxlist img {
    width: 1.07rem;
}

.dcbtn {
    width: 0.51rem;
    height: 0.51rem;
    background: url(../img/dcbtn.png) no-repeat;
    background-size: 1.02rem auto;
    background-position: right;
    margin-top: 0.1rem;
}

.dctime {
    font-size: 0.33rem;
    color: #716256;
    font-weight: bold;
}

.dcreward1, .dcreward2, .dcreward3 {
    width: 2.03rem;
    height: 0.62rem;
    background: url(../img/dc.png?v=1) no-repeat;
    background-size: 100%;
    background-position: top;
    margin-top: 0.1rem;
}

.dcreward1, .dcreward2, .dcreward3 {
    background-position: bottom;
}

.gsboxlistact .dcreward1, .gsboxlistact .dcreward2, .gsboxlistact .dcreward3 {
    background-position: top;
}

.gsboxlistact .dctime {
    color: #fbd4a9;
}

.gsboxlistact .dcbtn {
    background-position: left;
}

.login {
    width: 2.5rem;
    position: absolute;
    bottom: 0.8rem;
    left: 50%;
    margin-left: -1.25rem;
    cursor: pointer;
}

.share {
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: 0.8rem;
    font-size: 0;
    display: none;
}

.share img {
    width: 2.5rem;
    margin: 0 0.3rem;
    cursor: pointer;
}

.loginbox {
    width: 11.3rem;
    height: 8.97rem;
    position: absolute;
    left: 50%;
    margin-left: -5.65rem;
    top: 50%;
    margin-top: -4.48rem;
    background: url(../img/pop7.png) no-repeat;
    background-size: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.pop3 input {
    width: 5rem;
    height: 0.6rem;
    border: 0;
    background: #fff;
    outline: medium;
    margin-top: 0.4rem;
    text-indent: 0.2rem;
    font-size: 0.24rem;
}

.loginbtn {
    width: 2.5rem;
    margin-top: 0.6rem;
    cursor: pointer;
}

.regbtn {
    font-size: 0.2rem;
    color: #fff;
    margin-top: 0.3rem;
}

.regbtn span {
    font-size: 0.26rem;
    color: #efdb97;
    cursor: pointer;
}

.regbox {
    width: 13.91rem;
    height: 10.42rem;
    background: url(../img/person.png) no-repeat;
    background-size: 100%;
    position: absolute;
    left: 50%;
    margin-left: -6.95rem;
    top: 50%;
    margin-top: -5.21rem;
}

.reglist {
    width: 4rem;
    margin-left: 9.7rem;
    margin-top: 4.3rem;
    position: relative;
}

.register {
    width: 2.50rem;
    position: absolute;
    left: 0.62rem;
    top: 2.4rem;
    cursor: pointer;
    -webkit-animation: register 0.5s linear infinite both;
    -moz-animation: register 0.5s linear infinite both;
    -o-animation: register 0.5s linear infinite both;
    animation: register 0.5s linear infinite both;
}

@-webkit-keyframes register {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.8);
    }

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

@-moz-keyframes register {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.8);
    }

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

@-o-keyframes register {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.8);
    }

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

@keyframes register {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.8);
    }

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

.inpbox {
    width: 3.5rem;
    height: 0.5rem;
    margin-top: 0.3rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.inpbox input {
    flex: 1;
    height: 100%;
    border: 0;
    background: #fff;
    outline: medium;
    text-indent: 0.2rem;
    font-size: 0.18rem;
}

.getbtn {
    width: 1.5rem;
    height: 100%;
    line-height: 0.5rem;
    text-align: center;
    font-size: 0.18rem;
    color: #fff;
    background: #5a0707;
    cursor: pointer;
}

.toast {
    padding: 6px 15px;
    font-size: 16px;
    color: #fff;
    background: #999;
    border-radius: 3px;
    position: fixed;
    top: 30%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99999;
    display: none;
}

.eye {
    width: 0.4rem;
    height: 100%;
    background: url(../img/eye.png)#fff no-repeat;
    background-position: 0.11rem center;
    background-size: 0.6rem 0.16rem;
    cursor: pointer;
}

.eye-act {
    background-position: -0.3rem center;
}

.giftbox {
    width: 11.3rem;
    height: 8.97rem;
    position: absolute;
    left: 50%;
    margin-left: -5.65rem;
    top: 50%;
    margin-top: -4.48rem;
    background: url(../img/pop7.png) no-repeat;
    background-size: 100%;
}

.giftdesc {
    width: 8.1rem;
    height: 6.8rem;
    margin: 0 auto;
    margin-top: 1.5rem;
    position: relative;
    overflow: auto;
}

.giftdesc::-webkit-scrollbar {
    width: 0.10rem;
    height: 0.01rem;
    background: #221a17;
}

.giftdesc::-webkit-scrollbar-thumb {
    width: 0.10rem;
    height: 0.01rem;
    background: #9e634d;
}

.giftdesc img {
    display: block;
    width: 100%;
}

.giftdesc ul {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.giftdesc ul li {
    width: 7.50rem;
    height: 1.20rem;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.tip1 {
    margin-top: 0.15rem;
}

.giftdesc ul li span {
    font-size: 0.20rem;
    color: #e7cf8a;
}

.giftdesc ul li img {
    width: 0.99rem;
    margin-left: 0.20rem;
    cursor: pointer;
    opacity: 0.4;
}

.giftdesc ul li img.copy, .giftdesc ul li img.invite {
    opacity: 1;
}

.tip {
    width: 100%;
    font-size: 0.18rem;
    color: #e2c783;
    margin-top: 0.15rem;
    text-align: center;
}

.giftcode {
    width: 6rem;
    height: 0.6rem;
    background: #fff;
    margin: 3.5rem auto 0;
    font-size: 0.3rem;
    color: #333;
    text-align: center;
    line-height: 0.6rem;
}

.copybtn {
    width: 1.5rem;
    height: 0.5rem;
    font-size: 0.24rem;
    color: #000;
    text-align: center;
    line-height: 0.5rem;
    background: #e7cf8a;
    margin: 0.3rem auto;
    cursor: pointer;
}

.video {
    width: 10rem;
    height: 6rem;
    position: absolute;
    left: 50%;
    margin-left: -5rem;
    top: 50%;
    margin-top: -3rem;
}

.video iframe {
    width: 100%;
    height: 100%;
}




.nav {
    width: 1.71rem;
    height: 2.7rem;
    background: url(../img/navbg.png) no-repeat;
    background-size: 100%;
    background-position: bottom;
    position: fixed;
    top: 0;
    left: 0.20rem;
    z-index: 99;
}

.navul {
    width: 1.36rem;
    /* height: 236rem; */
    margin-left: 0.18rem;
    margin-top: 0.24rem;
}

.navul li {
    height: 0.47rem;
    cursor: pointer;
}

.navli1 {
    height: 100%;
    background: url(../img/img.png?v=1) no-repeat;
    background-size: 1.36rem 3.02rem;
    background-position: 0.08rem 0rem;
}

.navli2 {
    height: 100%;
    background: url(../img/img.png?v=1) no-repeat;
    background-size: 1.36rem 3.02rem;
    background-position: 0.08rem -0.45rem;
}

.navli3 {
    height: 100%;
    background: url(../img/img.png?v=1) no-repeat;
    background-size: 1.36rem 3.02rem;
    background-position: 0.08rem -0.93rem;
}

.navli4 {
    height: 100%;
    background: url(../img/img.png?v=1) no-repeat;
    background-size: 1.36rem 3.02rem;
    background-position: 0.08rem -0.93rem;
}

.navul li:hover {
    background: url(../img/img.png?v=1) no-repeat;
    background-size: 1.36rem 3.02rem;
    background-position: -0rem -2.55rem;
}

.ewm {
    display: block;
    width: 1.02rem;
    margin-left: 0.35rem;
    margin-top: 0.20rem;
}

.qq {
    width: 1.24rem;
    height: 0.40rem;
    padding: 0.1rem 0;
    font-size: 0.16rem;
    color: #fff0d2;
    text-align: center;
    line-height: 0.20rem;
    background: #711b14;
    border-radius: 0.10rem;
    margin: 0.1rem auto;
}