@font-face{
    font-family: 'test'; 
    src: url(../css/SourceHanSerifCN-Bold.otf);
    font-weight: bold;
}

*{
    box-sizing: border-box;
    font-family: 'test';
}

body{
    margin: 0;
}

.contain{
    position: relative;
    height: 100vh;
    width: 7.5rem;
    margin: 0 auto;
    min-height: 13rem;
    overflow: hidden;
}

.music_wrap{
    position: fixed;
    top: .2rem;
    right: .15rem;
    width: .58rem;
    height: .58rem;
    z-index: 40;
}

.contain_music{
    width: 100%;
    height: 100%;
    background: url(../img/icon_music.png?1) no-repeat;
    background-size: 100% 100%;   
}

.contain_music_un {
    width: 100%;
    height: 100%;
    background: url(../img/icon_music_un.png?1) no-repeat;
    background-size: 100% 100%;   
}

.page1, .page2, .page3, .page4, .page5, .page6{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    overflow: hidden;
}

/* page1 首页内容 */
.page1 {
    height: 100%;
    z-index: 20;
    background: white;
    overflow: hidden;
}

.page1_con{
    width: 100%;
    height: 100%;
    background: url('../img/page1_bg.png?1') 0 center no-repeat;
    background-size:cover;
    overflow: hidden;
}

.page1_progress {
    position: absolute;
    color: white;
    font-size: .28rem;
    bottom: 23%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
}

.page1_main, .page1_wrap {
    position: absolute;
    width: 5.55rem;
    height: 5.62rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
}

.page1_main  img{
    width: 100%;
    height: 100%;
}

.page1_wrap {
    width: 7.14rem;
    height: 6.98rem;
    top: 49%;
}

.page1_bottom{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

.page1_logo {
    position: absolute;
    width: 1.61rem;
    height: .96rem;
    bottom: .3rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
}

.rotate{
    animation: wr_rotate 3s linear infinite;
}

.mu_rotate {
    animation: mu_rotate 8s linear infinite;
}

.stop {
    animation-play-state:paused;
}

@keyframes mu_rotate {
    from {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
    }
}

@keyframes wr_rotate {
    from {
        transform: translate(-50%,-50%) rotate(0deg);
        -webkit-transform: translate(-50%,-50%) rotate(0deg);
        -o-transform: translate(-50%,-50%) rotate(0deg);
        -ms-transform: translate(-50%,-50%) rotate(0deg);
        -moz-transform: translate(-50%,-50%) rotate(0deg);
    }
    to {
        transform: translate(-50%,-50%) rotate(360deg);
        -webkit-transform: translate(-50%,-50%) rotate(360deg);
        -o-transform: translate(-50%,-50%) rotate(360deg);
        -ms-transform: translate(-50%,-50%) rotate(360deg);
        -moz-transform: translate(-50%,-50%) rotate(360deg);
    }
}

/* page1 end */

/* page2 登录页 */
.page2{
    /* display: none; */
    /* position: relative; */
    height: 100%;
    overflow: hidden;
    z-index: 19;

}

.page2_bg{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/page2_bg.png?1) no-repeat center center;
    background-size: cover;
    object-fit: cover;   
    z-index: 0;
}

.page2_text {
    position: absolute;
    width: 4.89rem;
    height: .86rem;
    bottom: .65rem;
    left: 50%;
    margin-left: -2.445rem;
    background: url(../img/page2_text.png?1) no-repeat;
    background-size: 100% 100%;
}

.page2_tourist {
    position: absolute;
    bottom: 1.9rem;
    width: 5.96rem;
    height: 1.33rem;
    left: 50%;
    margin-left: -2.98rem;
    background: url(../img/page2_tourist.png?1) no-repeat;
    background-size: 100% 100%;
}

.page2_general {
    position: absolute;
    bottom: 3.6rem;
    width: 5.96rem;
    height: 1.32rem;
    left: 50%;
    margin-left: -2.98rem;
    background: url(../img/page2_general.png?1) no-repeat;
    background-size: 100% 100%;
}

.page2_general_desc {
    position: absolute;
    left: 50%;
    margin-left: -1.48rem;
    bottom: -.32rem;
    width: 2.96rem;
    height: .29rem;
    background: url(../img/page2_general_desc.png?1) no-repeat;
    background-size: 100% 100%;
}

.pop_general, .pop_tourist, .pop_hint {
    display: none;
    width: 6.33rem;
    height: 4.9rem;
    background: url(../img/page2_pop.png?1) no-repeat;
    background-size: 100% 100%;
}

.pop_general_title{
    width: 3.43rem;
    height: .6rem;
    margin-left: 1.6rem;
    margin-top: .5rem;
}

.pop_tourist .pop_general_title {
    width: 2.89rem;
    height: .59rem;
}

.pop_hint_title{
    position: absolute;
    top: 1.5rem;
    width: 100%;
    font-size: .3rem;
    text-align: center;
}

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

.pop_general_main .name {
    width: .78rem;
    height: .38rem;
    margin-right: .4rem;
}

.pop_general_main .input {
    height: .5rem;
    width: 3.2rem;
    border: .01rem solid rgb(192,158,91);
    outline: none;
}

.pop_general .pop_general_main .input{
    margin-right: .4rem;
}

.pop_general_main .code {
    width: 1.22rem;
    height: .38rem;
    margin-right: .4rem;
}

.pop_general_main .sieve {
    position: absolute;
    width: .52rem;
    height: .6rem;
    right: .9rem;
    transition: all .5s ease; 
}

.pop_general_main .hint{
    position: absolute;
    display: none;
    top: 2.7rem;
    font-size: .24rem;
    color: red;
    font-family: 'test';
}

.sieve_ani{
    transform: rotate(360deg);
}

.pop_general .enter, .pop_tourist .enter, .pop_hint .enter {
    position: absolute;
    width:2.73rem;
    height: 1.07rem;
    bottom: .5rem;
    left: 52%;
    margin-left: -1.361rem;
}

/* page3  */
.page3 {
     /* display: none;
    position: relative;
    height: 100%; */
    background-image: url('../img/page3_li_bg.png?1');
    background-size:cover;
    background-position:0 center;
    transition: background-image 1s;
    background-repeat: no-repeat;
    overflow: hidden;
    transition: background-image 1s;
    z-index: 18;
}

.bg_li{
    background-image: url('../img/page3_li_bg.png?1');
}

.bg_sun{
    background-image: url('../img/page3_sun_bg.png?1');
}

.bg_liu {
    background-image: url('../img/page3_liu_bg.png?1');
}

.bg_cao {
    background-image: url('../img/page3_cao_bg.png?1');
}

.page3_li, .page3_liu, .page3_sun, .page3_cao {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    /* width: 7.14rem;
    height: 7.14rem; */
    /* top: 56%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    overflow: initial; */
}

.page3_main{
    position: relative;
    width: 7.14rem;
    height: 7.14rem;
}

.page3 .show{
    display: block;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.page3_desc {
    width: 5.36rem;
    height: 2rem;
    background: url(../img/page3_desc.png?1) no-repeat;
    background-size: 100% 100%;
}

.page3_li_bg {
    width: 100%;
    height: 100%;
}

.page3_li_main{
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
}

.page3_li_main .portrait{
    width: 1.28rem;
    height: 1.29rem;
    margin-bottom: .3rem;
}

.page3_li_main .text{
    font-size: .23rem;
    color: white;
}

.click_contain {
    position: absolute;
    width: 5.55rem;
    height: 5.62rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
}

.click_contain .cao, .click_contain .li {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -1.1rem;
    width: 2.20rem;
    height: .85rem;
}

.click_contain .li{
    top: auto;
    bottom: 0;
}

.click_contain .sun, .click_contain .liu {
    position: absolute;
    width: .85rem;
    height: 2.2rem;
    right: 0;
    top: 50%;
    margin-top: -1.1rem;
}

.click_contain .liu{
    left: 0;
    right: auto;

}

.page3_enter {
    display: block;
    width: 3rem;
    height: 1.57rem;
    margin: 0 auto;
    margin-top: .3rem;
}

.page3_liu .page3_enter, .page3_cao .page3_enter, .page3_sun .page3_enter{
    width: 5.03rem;
    height: 1.57rem;
}
/* page3 end */

/* page4 */

.page4{
    z-index: 17;
}

.page4_li{
    /* display: flex;
    flex-direction: column;
    justify-content: center; */
    width: 100%;
    height: 100%;
    /* background: url(../img/prelude1_bg.png?1) no-repeat 0 center;
    background-size: cover; */
}

.prelude1 ,.prelude2, .prelude3, .prelude4 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: url(../img/prelude1_bg.png?1) no-repeat 0 center;
    background-size: cover;
}

.prelude1 {
    position: absolute;
    z-index: 17;
}

.prelude2 {
    position: absolute;
    z-index: 16;
}

.prelude3 {
    position: absolute;
    z-index: 15;
}

.prelude4 {
    position: absolute;
    z-index: 14;
}

.page4 .page4_hint {
    position: absolute;
    width: 7.5rem;
    height: .7rem;
    background: url(../img/page4_hint_bg.png?1) no-repeat;
    background-size: 100% 100%;
    bottom: 1.1rem;
    text-align: center;
    line-height: .7rem;
    font-size: .3rem;
    color: #cbd3ff;
}


.page4_li .header {
    position: relative;
    width: 7.5rem;
    height: 4.55rem;
}

.page4_li .header .bg {
    width: 100%;
    height: 100%;
}

.page4_li .header .icon{
    position: absolute;
    width: 7.5rem;
    height: .37rem;
    top: -.2rem;
    left: 0;
}

.page4_li .header .icon_no_text{
    position: absolute;
    width: 7.5rem;
    height: .14rem;
    top: -.1rem;
    left: 0;
}

.page4_li .header .success {
    position: absolute;
    width: 2.28rem;
    height: 1.28rem;
    left: 0;
    z-index: 10;
}

.page4_li .header .title {
    position: absolute;
    width: 6.87rem;
    height: 1rem;
    left: 0;
    bottom: -.1rem;
    z-index: 10;
}

.page4_li .desc{
    width: 7.26rem;
    height: 2.54rem;
    margin: 0 auto;
    margin-top: .1rem;
    padding: .1rem .2rem .1rem .3rem;
    padding-top: .3rem;
    font-size: .3rem;
    color: white;
    background: url(../img/page4_li1_img3.png?1) no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
}

.page4_li .desc p {
    font-size: .3rem;
    color: white;
    padding: .1rem .2rem .1rem .3rem;
    margin: 0;
}

.page4_li .option {
    display: flex;
    align-items: center;
    width: 6.7rem;
    height: .67rem;
    margin-top: .2rem;
    padding-left: .6rem;
    font-size: .3rem;
    background: url(../img/page4_li1_img4.png?1) no-repeat;
    background-size: 100% 100%;
}
.page4_li .option .title {
    color: white;
}

.page4_li .option .text {
    position: absolute;
    left: 2.5rem;
}

.page4_li .get {
    width: 2.73rem;
    height: 1.07rem;
    margin: 0 auto;
    margin-top: 1.6rem;
}

.hidden {
    display: none !important;
}


/* page4 end */

/* page5 start */

.page5{
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    z-index: 13;
}


.page5_bg, .page5_common_bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page5_common_bg{
    left: 4%;
    width: 92%;
}

.page5_li_common{
    position: relative;
    width: 6.71rem;
    height: 11.36rem;
    z-index: 1;
}

.page5_li_common_bg{
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
}

.page5_li_btn{
    position: absolute;
    width: 4.57rem;
    height: 1.07rem;
    left: 50%;
    margin-left: -1.8rem;
    bottom: -0.5rem;
}

.page5_li_btn_text{
    height: 1.47rem;
}

.page5_li_title {
    position: absolute;
    width: 3.77rem;
    height: 3.21rem;
    left: .5rem;
    top: .55rem;
}

.page5_li_text{
    position: absolute;
    font-size: .3rem;
    color: white;
    top: 5rem;
    right: 0;
    text-align: right;
}

/* page5 end */

/* page5 start */

.page6{
    z-index: 12;
}

.page6_youke{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.page6_li_bg{
    background: url(../img/page6_li_bg.png?1) no-repeat center center;
    background-size: cover;
}

.page6_cao_bg{
    background: url(../img/page6_cao_bg.png?1) no-repeat center center;
    background-size: cover;
}

.page6_liu_bg{
    background: url(../img/page6_liu_bg.png?1) no-repeat center center;
    background-size: cover;
}

.page6_sun_bg{
    background: url(../img/page6_sun_bg.png?1) no-repeat center center;
    background-size: cover;
}

.page6_logo{
    position: absolute;
    top: .2rem;
    right: .2rem;
    width: 1.54rem;
    height: .91rem;
    background: url(../img/page6_li_img3.png?1) no-repeat;
    background-size: 100% 100%;
}

.page6_top{
    position: relative;
    height: 6.6rem;
}

.page6_text_li{
    color: #8e9eff;
}

.page6_text_liu{
    color: #3fffb4;
}

.page6_text_cao{
    color: #c871ff;
}

.page6_text_sun{
    color: #ff4e4e;
}

.page6_li_img1, .page6_liu_img1, .page6_cao_img1, .page6_sun_img1{
    position: absolute;
    width: 7.5rem;
    height: 3.53rem;
    background: url(../img/page6_li_img1.png?1) no-repeat;
    background-size: 100% 100%;
}

.page6_liu_img1{
    height: 3.82rem;
    background: url(../img/page6_liu_img1.png?1) no-repeat;
    background-size: 100% 100%;
}

.page6_cao_img1 {
    height: 4.93rem;
    background: url(../img/page6_cao_img1.png?1) no-repeat;
    background-size: 100% 100%;
}

.page6_sun_img1{
    height: 3.53rem;
    background: url(../img/page6_sun_img1.png?1) no-repeat;
    background-size: 100% 100%;
}

.page6_li_img2{
    position: absolute;
    width: 4.27rem;
    height: 1.43rem;
    right: 0;
    top: 2.3rem;
    background: url(../img/page6_li_img2.png?1) no-repeat;
    background-size: 100% 100%;
}

.page6_li_name{
    position: absolute;
    top: 4rem;
    padding-left: .2rem;
    font-size: .3rem;
    color: white;
}

.page6_li_name .title {
    color: rgb(233,210,164);
}

.page6_li_name p {
    margin: 0;
}

.page6_common_1 {
    position: absolute;
    width: 6.62rem;
    height: 2.86rem;
    left: .7rem;
    top: 3.7rem;
}

.page6_header_wrap{
    position: absolute;
    width: 1.27rem;
    height: 1.27rem;
    left: .15rem;
    top: 5rem;
}

.page6_header{
    width: 100%;
    height: 100%;
}

.page6_header_bg{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.page6_common_2{
    position: absolute;
    right: -.4rem;
    width: .2rem;
    height: .24rem;
    top: 50%;
    margin-top: -.12rem;
}

.page6_header_wrap p {
    position: absolute;
    right: -5rem;
    top: 0;
    width: 4rem;
    margin: 0;
    color: white;
    font-size: .3rem;
}

.page6_li_bottom, .page6_cao_bottom, .page6_liu_bottom, .page6_sun_bottom {
    position: relative;
    width: 7.50rem;
    height: 6.06rem;
    background: url(../img/page6_li_img4.png?2) no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
    margin-top: .2rem;
}

.page6_cao_bottom{
    background: url(../img/page6_cao_img4.png?2) no-repeat;
    background-size: 100% 100%;
}

.page6_liu_bottom{
    background: url(../img/page6_liu_img4.png?2) no-repeat;
    background-size: 100% 100%;
}

.page6_sun_bottom{
    background: url(../img/page6_sun_img4.png?2) no-repeat;
    background-size: 100% 100%;
}

.page6_bottom p {
    position: absolute;
    margin: 0;
    font-size: .3rem;
    color: white;
    text-align: center;
}

.page6_bottom .p1{
    top: 0.3rem;
    left: 1.8rem;
}

.page6_bottom .p2{
    top: 1.7rem;
    left: 1.15rem;
}

.page6_bottom .p3{
    top: 3.3rem;
    left: 1.5rem;
}

.page6_bottom .p4 {
    bottom: .9rem;
    left: 1.6rem;
    text-align: left;
    font-size: .22rem;
}

.page6_bottom .p6 {
    bottom: .5rem;
    left: 1.6rem;
    text-align: left;
    font-size: .22rem;
}

.page6_bottom .p5 {
    bottom: 0rem;
    left: 1.6rem;
    text-align: left;
    font-size: .3rem;
}

.page6_bottom .ercode{
    position: absolute;
    left: .24rem;
    bottom: .04rem;
    width: 1.21rem;
    height: 1.21rem;
}

/* page6 end */

/* page7 start */

.page7{
    position: absolute;
    z-index: 10;
    width: 7.5rem;
    height: 31rem;
    padding-bottom: .5rem;
    background: url(../img/page7_bg.png?1) no-repeat center center;
    background-size: cover;

}

.page7_logo{
    position: absolute;
    width: 1.61rem;
    height: .96rem;
    top: .15rem;
    right: .1rem;
    z-index: 5;
}

.page7 p {
    margin: 0;
}

.page7 .header {
    display: block;
    width: 7.5rem;
    height: 5rem;
    background: url(../img/page7_header.png?1) no-repeat;
    background-size: 100%;
}

.page7 .text1 ,.page7 .text2 {
    font-size: .25rem;
    color: #e5ca9f;
    text-align: center;
}

.page7_text_common{
    color: #66a0ff;
}

.page7 .text2 {
    position: relative;
    margin-bottom: .1rem;
}

.page7 .text2_bg{
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -.02rem;
    width: 7.5rem;
    height: .03rem;
    background: url(../img/page7_text_bg.png?1) no-repeat;
    background-size: 100% 100%;
}

.page7 .bg2 {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 7.5rem;
    height: 4.85rem;
    background: url(../img/page7_bg2.png?1) no-repeat;
    background-size: 100% 100%;
}

.page7 .bg2 .main_bg3 {
    position: relative;
    left: 0;
    top: 0;
}

.page7 .text_z{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .5rem;
    color: white;
}

.page7 .text_z span {
    margin: 0 .3rem;
}

.page7 .text_z img{
    width: .71rem;
    height: .21rem;
}

/* .page7 .text_z:before{
    position: absolute;
    content: "";
    width: .71rem;
    height: .21rem;
    left: -.91rem;
    top: 50%;
    margin-top: -.1rem;
    background: url(../img/page7_text_left.png?1) no-repeat;
    background-size: 100% 100%;
}

.page7 .text_z:after{
    position: absolute;
    content: "";
    width: .71rem;
    height: .21rem;
    right: -.91rem;
    top: 50%;
    margin-top: -.1rem;
    background: url(../img/page7_text_right.png?1) no-repeat;
    background-size: 100% 100%;
} */

.page7 .name {
    position: relative;
    font-size: .5rem;
    color: white;
    text-align: center;
    margin-bottom: .2rem;
}

.page7 p.desc{
    margin-bottom: .3rem;
}

.page7 .name_icon {
    position: absolute;
    width: .12rem;
    height: .1rem;
    bottom: -.15rem;
    left: 50%;
    margin-left: -.1rem;
}

.page7 .text_out{
    font-size: .3rem;
    color: #9eb8de;
    text-align: center;
}

.page7 .server{
    font-size: .35rem;
}

.page7 .desc_bg {
    position: relative;
    display: inline-block;
    padding: 0rem .3rem;
}

.main_bg1{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 6.87rem;
    height: 1.54rem;
    background: url(../img/page7_main_bg1.png?1) no-repeat;
    background-size: 100% 100%;
    margin:  0 auto;
}

.main_bg1 p {
    font-size: .3rem;
    color: white;
    text-align: center;
}

.main_bg2 {
    position: relative;
    width: 2.98rem;
    height: 1.62rem;
    margin-left: .8rem;
}

.main_bg3{
    position: absolute;
    top: .83rem;
    left: -.6rem;
    width: 1.3rem;
    height: 1.3rem;
}

.main_bg3_icon{
    top: .4rem;
}

.page7 .main_bg3_text {
    position: absolute;
    font-size: .3rem;
    color: white;
    left: 1.8rem;
    top: .2rem;
    width: 5.4rem;
}

.main_bg3_wj_name{
    position: absolute;
    width: 4rem;
    top: 1rem;
    left: 1.7rem;
    font-size: .6rem;
    color: #c9b082;
}

.main_bg4 {
    position: relative;
    display: flex;
    justify-content: flex-end;
    margin-top: .4rem;
}

.main_bg4_header{
    position: relative;
    flex-shrink: 0;
    margin-right: .2rem;
    width: 1.3rem;
    height: 1.3rem;
}

.page7 .page7_text3 {
    font-size: .3rem;
    color: white;
    margin-top: 1.1rem;
    text-align: center;
}

.main_bg4 p {
    font-size: .3rem;
    color: white;
    text-align: right;
    margin-right: .1rem;
}
.main_bg4_line{
    position: absolute;
    width: 4.53rem;
    height: 2.11rem;
    right: .85rem;
    top: -.2rem;
    background: url(../img/page7_main_bg3.png?1) no-repeat;
    background-size: 100% 100%;
}
.page7 .page7_black{
    color: #383b54;
}

.can_img{
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 20;
}

.pop_get_code{
    position: relative;
    display: none;
    width: 6.29rem;
    height: 4rem;
    padding-top: .85rem;
    background: url(../img/page7_pop_bg.png) no-repeat;
    background-size: 100% 100%;
    font-size: .3rem;
    color: white;
    text-align: center;
}

.pop_get_code_title{
    width: 5.73rem;
    height: .56rem;
    background: url(../img/page7_pop_title.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
}

.pop_get_code_color{
    color: #89daff;
}

.pop_get_code_close{
    position: absolute;
    width: .67rem;
    height: .68rem;
    bottom: -1rem;
    left: 50%;
    margin-left: -0.33rem;
    background: url(../img/page7_pop_close.png) no-repeat;
    background-size: 100% 100%;
}
/* page7 end */