@charset "utf-8";
* {
    margin: 0;
    padding: 0;
    margin-left: 0;
    padding-left: 0;
    list-style: none;
    -webkit-tap-highlight-color: transparent;
}
.small-font{
    font-size: 0.7rem;
    -webkit-transform-origin-x: 0;
    -webkit-transform: scale(0.90);
    transform: scale(0.90);
}

input[type="text"],
input[type="button"],
input[type="submit"],
input[type="reset"] {
    -webkit-appearance: none;
}

.mask {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    background: #000;
    opacity: 0;
    filter: alpha(opacity=0);
}

.circle {
    position: absolute;
    display: block;
    border-radius: 50%;
    height: 13px;
    width: 13px;
}

.share_wrap {
    display: none;
}

.share_wrap .info {
    border-radius: 5px;
    padding: 10px;
    background: #fff;
    color: #000;
    position: fixed;
    top: 23%;
    left: 20%;
    z-index: 1005;
}

.share_wrap .me_know span {
    width: 13.5rem;
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    border: 1px solid #fff;
    position: fixed;
    bottom: 31%;
    z-index: 1005;
    border-radius: 3rem;
    padding: 5px 20px;
    left: 15%;
    color: #fff;
}

p {
    margin: 0;
    padding: 0;
}

#title {
    width: 560px;
    height: 321px;
}

#luck {
    height: 92%;
    width: 95%;
}

#luck ul {
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 100%;
    width: 96%;
    margin-top: 0px;
    border: 14px solid #e81b54;
    background: #fff;
    z-index: 500;
    border-radius: 23px;
}

.choujiang_header {}

.shanDeng {
    width: 100%;
    border: 27px solid #fc5566;
    height: 370px;
    box-sizing: border-box;
    border-radius: 52px;
    box-shadow: 0px 5px 0px #e81b54;
}

.shanDeng .base {
    position: absolute;
    width: 100%;
    height: 1rem;
    background: #fbc235;
    border-radius: 20px;
    z-index: -3;
    bottom: -51px;
}

.shanDeng .dizuo {
    position: absolute;
    width: 2.7rem;
}

.shanDeng .dizuo img {
    width: 100%;
}

.shanDeng .dizuo_left {
    z-index: -1;
    left: 10%;
    bottom: -44px;
}

.shanDeng .dizuo_right {
    z-index: -1;
    right: 10%;
    bottom: -44px;
}

.shanDeng ul li {
    text-align: center;
    width: 29%;
    height: 28.3%;
    /* float: left; */
    box-shadow: 0px 8px 0px #ffc2c8;
    background: #ccbcbc;
    /* margin: 3px 7px 11px 9px; */
    margin: 1% 1% 3% 3%;
    border-radius: 8px;
    z-index: 500!important;
}

.shanDeng ul .start_award {
    text-align: center;
    width: 29%;
    height: 28.3%;
    box-shadow: 0px 8px 0px #ffb001;
    background: #ffd800;
    border-radius: 8px;
    color: #ab6102;
    font-size: 1.5rem;
}

.shanDeng ul .start_award p {
    line-height: 1.8rem;
    font-weight: bolder;
    margin-top: 11%;
}

.shanDeng ul .start_award_on {
    text-align: center;
    width: 29%;
    height: 28.3%;
    float: left;
    box-shadow: 0px 8px 0px #ffd800;
    background: #ffd800;
    margin: 1% 1% 3% 3%;
    border-radius: 8px;
    color: #ab6102;
    font-size: 1.5rem;
}

.shanDeng ul .thanks {
    line-height: 5rem;
}

.shanDeng ul li div {
    width: 100%;
    text-align: center;
    margin: .6rem auto .3rem;
}

.shanDeng ul li div img {
    width: 87%;
}

.shanDeng ul li span {
    color: #ca4452;
    font-size: .7rem;
}

.shanDeng ul li .mouth {
    font-size: .8rem;
}

.hover {
    background: #ffebeb!important;
}

.wrap {
    margin-top: 8rem;
    padding: 0 3%;
}


/* 口腔标题 */

.wrap .mouth_title {
    margin: 0 12%;
    height: 4.5rem;
    width: 80%;
}

.wrap .mouth_title img {
    width: 100%;
}


/* 循环 */

.wrap .loop_logo {
    top: 1rem;
    width: 7.5rem;
    height: 1.5rem;
    position: absolute;
}

.wrap .loop_logo img {
    width: 100%;
}

.wrap .loop_title {
    top: 5rem;
    width: 66%;
    margin: 0 17% 0 14%;
    height: 1rem;
    position: absolute;
}

.wrap .loop_title img {
    width: 100%;
}


/* 通用 */

.wrap .choujiang_count_record_wrap {
    position: relative;
    margin-bottom: 1rem;
    width: 100%;
}

.wrap .choujiang_count_record_wrap .choujiang_count_record {
    width: 50%;
    background: #ffffff;
    border: 2px solid #fc5566;
    border-radius: 50px;
    text-align: center;
    margin: 0 auto;
    color: #ab6102;
    font-size: .9rem;
    line-height: 2.5rem;
}

.wrap .choujiang_count_record_wrap .choujiang_count_record span {
    color: #e81b54;
    font-size: 1.1rem;
}

.choujiang_rule {
    margin-top: 1.7rem;
    margin-bottom: 1.7rem;
    border: 3px solid #fb9e01;
    border-radius: 17px;
    padding: .6rem .5rem;
    background: #ffea97;
    color: #fb9e01;
    line-height: 1.5rem;
}

.choujiang_rule p {
    font-size: .9rem;
}

.result {}

.result .success_info {
    border: 1px solid #fb9e01;
    background: #ffea97;
    color: #fb9e01;
    border-radius: 10px;
    padding: 1rem 1rem;
    line-height: 1.5rem;
    font-size: 0.8rem;
}

.result .success_info .erweima {
    width: 36%;
    margin: 10px auto;
}

.result .success_info .erweima img {
    width: 100%;
}

.result .success_info .follow {
    margin-top: .5rem;
    text-align: center;
}

.choujiang_rule .erweima {
    width: 36%;
    margin: 10px auto;
}

.choujiang_rule .erweima img {
    width: 100%;
}

.choujiang_rule .follow {
    margin-top: .5rem;
    text-align: center;
}

.shanDeng,
.shanDeng2 {
    width: 100%;
    height: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
}

.shanDeng {
    width: 100%;
    height: 350px;
    position: relative;
}

.shanDeng .light {
    height: 113%;
    position: absolute;
    width: 115%;
    left: -15px;
    top: -20px;
}

.shanDeng .light img {
    height: 100%;
    width: 98%;
}

.shanDeng .dizuo {
    position: absolute;
    width: 2.7rem;
}

.shanDeng .dizuo img {
    width: 100%;
}

.shanDeng .dizuo_left {
    z-index: -1;
    left: 10%;
    bottom: -44px;
}

.shanDeng .dizuo_right {
    z-index: -1;
    right: 10%;
    bottom: -44px;
}

#btn .cjBtnDom,
#btn .cjBtn,
.shanDeng .active,
.shanDeng td {
    background-repeat: no-repeat;
    background-size: 100%;
    white-space: nowrap;
}

#btn.cjBtn {
    background: url(../images/unstart.png) no-repeat bottom center;
}

#btn.cjBtnDom {
    background: url(../images/inshart.png) no-repeat bottom center;
}

#luck {
    /* background-image: url(../images/panzi.png);
    background-repeat: no-repeat;
    background-size: 100%; */
}

#luck .active {
    background: url(../images/select.png) no-repeat bottom center;
}

.shanDeng td {
    text-align: center;
    background: url(../images/unselect.png) no-repeat bottom center;
}

.luck-unit img {}

.shanDeng table {
    padding-top: 15px;
    padding-left: 10%;
    padding-right: 10%;
    padding-bottom: 15px;
    table-layout: fixed;
}

.change_count {
    margin-top: 3rem;
    text-align: center;
    line-height: 1.5rem;
}

.change_count p {
    color: #ab6102;
    font-size: 1rem;
    font-weight: bolder;
}

.change_count span {
    color: #e81b54;
    font-size: 1.2rem;
}

.nowshare {
    text-align: center;
    margin-top: 10px;
    padding: 0 11%;
}

.nowshare a {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.1em;
    line-height: 3rem;
    width: 77%;
    height: 3rem;
    display: inline-block;
    background: url(../images/return.png) no-repeat bottom center;
    background-size: 100% 100%;
}


/* 验证 */

.share_mask {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    background: #000;
    opacity: 0.9;
    filter: alpha(opacity=90);
}

.choujiang_mask {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    background: #000;
    opacity: 0.8;
    filter: alpha(opacity=80);
}

.choujiang_toast {
    display: none;
    top: 20%;
    left: 10%;
    position: absolute;
    z-index: 1005;
    border-radius: 10px;
    background: #f5f5f5;
    width: 70%;
    padding: 0 5%;
}

.choujiang_toast .input_phone {
    width: 90%;
    height: 3rem;
}

.choujiang_toast .input_phone input {
    width: 100%;
    outline: none;
    border-radius: 5px;
    border: 1px solid #ccc;
    height: 100%;
    padding: 0 12px;
}

.choujiang_toast .input_phone input::-webkit-input-placeholder {
    color: #e2e2e2;
    font-size: .6rem;
    line-height: 3rem;
    letter-spacing: 0.1em;
}

.choujiang_toast .input_phone input::-moz-placeholder {
    color: #e2e2e2;
    font-size: .6rem;
    line-height: 3rem;
    letter-spacing: 0.1em;
}

.choujiang_toast .input_phone input::-webkit-input-placeholder {
    color: #e2e2e2;
    font-size: .6rem;
    line-height: 3rem;
    letter-spacing: 0.1em;
}

.choujiang_toast .input_phone input:-ms-input-placeholder {
    color: #e2e2e2;
    font-size: .6rem;
    line-height: 3rem;
    letter-spacing: 0.1em;
}

.choujiang_toast .choujiang_toast_close {
    top: -35px;
    right: 0;
    position: absolute;
    width: 25px;
    height: 25px;
}

.choujiang_toast .choujiang_toast_close img {
    width: 100%;
}

.choujiang_toast .choujiang_toast_title {
    color: #41a09a;
    font-size: .8rem;
    line-height: 2rem;
    margin-top: .5rem;
}

.choujiang_toast .submit_btn {
    margin-top: 0.5rem;
    margin-bottom: 1.5rem;
    height: 3rem;
    width: 80%;
    padding: 0 10%;
}

.choujiang_toast .submit_btn input {
    font-size: 1rem;
    border-radius: 10px;
    height: 90%;
    width: 100%;
    display: inline-block;
    background: #02bb9c;
    color: #fff;
    text-align: center;
    outline: none;
    border: none;
    letter-spacing: 0.1em;
}

.choujiang_toast .checkcode_tishi {
    margin-top: .3rem;
    height: 1.5rem;
    width: 100%;
}

.choujiang_toast .checkcode_tishi span {
    color: red;
    font-size: .9rem;
    display: none;
}

.choujiang_toast .pic_check {
    position: absolute;
    display: inline-block;
    width: 60%;
    height: 3rem;
    margin-left: 22%;
    right: -8rem;
    top: 1rem;
}

.choujiang_toast .pic_check img {
    width: 100%;
    vertical-align: middle;
}

.choujiang_toast .getphone {
    position: relative;
}

.choujiang_toast .getphone .on {
    position: absolute;
    right: 0.6rem;
    font-size: 0.85rem;
    width: 5.3rem;
    text-align: center;
    height: 2.5rem;
    line-height: 2.5rem;
    top: 35%;
    background: #41a09a;
    color: #fff;
    border-radius: 4px;
    letter-spacing: 0.1em;
    border: none;
    outline: none;
}

.choujiang_toast .choujiang_getphonecode {
    outline: none;
    border: none;
    position: absolute;
    right: 0.6rem;
    font-size: 0.85rem;
    width: 5.3rem;
    text-align: center;
    height: 2.5rem;
    line-height: 2.5rem;
    top: 35%;
    background: #ababab;
    color: #fff;
    border-radius: 4px;
    letter-spacing: 0.1em;
}


/* 中奖结果 */

.noresult {
    display: none;
    top: 22%;
    left: 10%;
    position: fixed;
    z-index: 1005;
    border-radius: 10px;
    width: 70%;
    padding: 0 5%;
}

.noresult .result_bg {
    width: 100%;
    position: relative;
}

.noresult .result_bg .result_bg_img {
    width: 100%;
}

.noresult .result_bg .result_bg_img img {
    width: 100%;
}

.noresult .result_bg .reward {
    position: absolute;
    width: 2rem;
    top: 26%;
    left: 45%;
}

.noresult .result_bg .sorry {
    position: absolute;
    font-size: .7rem;
    top: 50%;
    left: 44%;
}

.noresult .result_bg .sorry .prey {
    color: #ababab;
}

.noresult .result_bg .sorry .on {
    color: red;
}

.noresult .result_bg .reward img {
    width: 100%;
}

.noresult .success_info {
    padding-left: .5rem;
    letter-spacing: .1em;
    line-height: 1.5rem;
    font-size: .6rem;
    color: #ddae20;
}

.noresult .success_info h5 {
    margin: 0
}

.noresult .result_return_btn {
    text-align: center;
    margin-top: 4rem;
}

.noresult .result_close {
    top: 30px;
    right: 0;
    position: absolute;
    width: 25px;
    height: 25px;
}

.noresult .result_close img {
    width: 100%;
}

.noresult .result_return_btn span {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.1em;
    line-height: 3rem;
    width: 77%;
    height: 3rem;
    display: inline-block;
    background: url(../images/return.png) no-repeat bottom center;
    background-size: 100% 100%;
}

.exhaust {
    display: none;
}

.nostart {
    display: none;
}


/* result */

.result {
    display: none;
    top: 13%;
    left: 10%;
    position: absolute;
    z-index: 1005;
    border-radius: 10px;
    width: 70%;
    padding: 0 5%;
}

.result .result_bg {
    width: 100%;
    position: relative;
}

.result .result_bg .result_bg_img {
    width: 100%;
}

.result .result_bg .result_bg_img img {
    width: 100%;
}

.result .result_bg .reward {
    position: absolute;
    width: 4.8rem;
    top: 24%;
    left: 37%;
}

.result .result_bg .sorry {
    position: absolute;
    font-size: .7rem;
    top: 52%;
    left: 44%;
}

.result .result_bg .sorry .prey {
    color: #ababab;
}

.result .result_bg .sorry .on {
    color: red;
}

.result .result_bg .reward img {
    width: 95%;
}


/* .result .success_info {
    padding-left: .5rem;
    letter-spacing: .1em;
    line-height: 1.5rem;
    color: #ddae20;
    line-height: 1.5rem;
    font-size: 0.8rem;
} */

.result .success_info h5 {
    font-size: .9rem;
    margin: 0;
    letter-spacing: .1rem;
}

.result .result_return_btn {
    margin-bottom: 4rem;
    text-align: center;
    margin-top: 4rem;
}

.result .result_close {
    top: 30px;
    right: 0;
    position: absolute;
    width: 25px;
    height: 25px;
}

.result .result_close img {
    width: 100%;
}

.result .result_return_btn span {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.1em;
    line-height: 3rem;
    width: 77%;
    height: 3rem;
    display: inline-block;
    background: url(../images/return.png) no-repeat bottom center;
    background-size: 100% 100%;
}


/* 主页 */

.index_body {
    margin: 0;
    padding: 0;
    background: url(../images/guide_bg.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 0 5%;
}

.index_body .index_title {
    margin-top: 10%;
    width: 100%;
}

.index_body .index_title img {
    width: 100%;
}

.index_body .index_play {
    margin-top: 5%;
    padding: 0 5%;
    position: relative;
}

.index_body .index_play .index_play_anniu {
    position: absolute;
    width: 51px;
    height: 51px;
    top: 35%;
    left: 45%;
    z-index: 500;
}

.index_body .index_play .index_play_mask {
    background-color: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 0;
    left: 5%;
    right: 5%;
    bottom: 0;
    z-index: 200;
    text-align: center;
    padding: 20% 0;
}

.index_body .index_play .index_play_anniu img {
    width: 100%;
}

.index_body .index_info {
    margin-top: 5%;
}

.index_body .index_info p {
    width: 100%;
    margin: 0;
    color: #fff;
    font-size: .9rem;
    line-height: 1.6rem;
}

.index_body .index_info p span {
    font-size: 1rem;
    line-height: 1.6rem;
    color: yellow;
    font-weight: bolder;
}

.index_info_last {
    color: #fff;
    padding: 0 3%;
    font-size: .9rem;
    text-align: center;
}

.index_btn {
    margin: 10% auto;
    text-align: center;
}

.index_btn a {
    display: inline-block;
}

.index_btn a input {
    display: inline-block;
    width: 200px;
    height: 50px;
    background: url(../images/guide_anniu.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    outline: none;
    -webkit-appearance: none;
    border: none;
    color: #a87017;
    font-weight: bolder;
    font-size: 1.1rem;
    letter-spacing: 0.2em;
}


/* 次数用完 */

.hasend {
    display: none;
    top: 22%;
    left: 10%;
    position: fixed;
    z-index: 1005;
    border-radius: 10px;
    width: 70%;
    padding: 0 5%;
}

.hasend .result_return_btn {
    text-align: center;
    margin-top: 10px;
}

.hasend .result_close {
    top: -35px;
    right: 0;
    position: absolute;
    width: 25px;
    height: 25px;
}

.hasend .result_close img {
    width: 100%;
}

.hasend .result_return_btn span {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.1em;
    line-height: 3rem;
    width: 77%;
    height: 3rem;
    display: inline-block;
    background: url(../images/return.png) no-repeat bottom center;
    background-size: 100% 100%;
}

.hasend .success_info {
    border: 2px solid #fb9e01;
    background: #ffea97;
    color: #fb9e01;
    border-radius: 10px;
    padding: 1rem 1rem;
}

.hasend .success_info .title {
    width: 100%;
    text-align: center;
    line-height: 3rem;
}

.hasend .success_info p {
    line-height: 1.5rem;
    font-size: 0.8rem;
}

.hasend .result_return_btn {
    margin-top: 4rem;
}


/* common */

.common {
    top: 13%;
    left: 10%;
    position: fixed;
    z-index: 1005;
    border-radius: 10px;
    width: 70%;
    padding: 0 5%;
}

.common .result_return_btn {
    text-align: center;
    margin-top: 10px;
}

.common .result_close {
    top: -35px;
    right: 0;
    position: absolute;
    width: 25px;
    height: 25px;
}

.common .result_close img {
    width: 100%;
}

.common .result_return_btn span {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.1em;
    line-height: 3rem;
    width: 77%;
    height: 3rem;
    display: inline-block;
    background: url(../images/return.png) no-repeat bottom center;
    background-size: 100% 100%;
}

.common .success_info {
    border: 2px solid #fb9e01;
    background: #ffea97;
    color: #fb9e01;
    border-radius: 10px;
    padding: 1rem 1rem;
}

.common .success_info .title {
    width: 100%;
    text-align: center;
    line-height: 3rem;
}

.common .success_info p {
    line-height: 1.5rem;
    font-size: 0.8rem;
}

.common .result_return_btn {
    margin-top: 4rem;
}

.share_it {
    width: 4.5rem;
    height: 6rem;
    position: fixed;
    z-index: 1005;
    right: 10%;
    top: 5%;
}

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


/* 列表页 */

.list_wrap ul a {
    text-decoration: none;
}

.list_wrap ul li .img_wrap {
    width: 100%;
}

.list_wrap ul li .img_wrap img {
    border-radius: 5px;
    width: 100%;
}

.list_wrap ul li {
    margin-top: .5rem;
}

.list_wrap ul li .time {
    color: #ababab;
}

.list_wrap ul li .time .after {
    margin-left: 20px;
}

.list_wrap ul li .info {
    letter-spacing: .1em;
    color: #000;
}

.list_wrap ul li .info a {
    color: #000;
}


/* 抽奖未开始 */

@media screen and (max-width:1029px) and (min-width:800px) {
    .wrap {
        padding: 0 32%;
    }
    .choujiang_toast .pic_check {
        width: 27%;
        right: -22rem;
    }
    .wrap .loop_title {
        width: 36%;
        margin: 0 2%;
    }
}

@media screen and (device-width:568px) {
    #luck {
        width: 97%;
    }
}

@media screen and (min-width:568px) and (max-width:840px) {
    .wrap {
        padding: 0 26%;
    }
    .choujiang_toast .pic_check {
        width: 33%;
        right: -16rem;
    }
    .wrap .loop_title {
        width: 46%;
        margin: 0 2%;
    }
}

@media screen and (min-width: 1029px) {
    .index_body {
        padding: 5% 30%;
    }
    .wrap .loop_title {
        width: 47%;
        margin: 0 0;
    }
    html {
        width: 720px;
        margin: 0 auto;
        background: #fff;
    }
    #luck {
        width: 100%;
    }
    .shanDeng .light {
        width: 109%;
    }
    .shanDeng ul li {
        text-align: center;
        height: 24.3%;
    }
    .shanDeng ul li div {
        width: 20%;
    }
    .shanDeng ul .start_award {
        height: 24.3%;
        font-size: 1.2rem;
    }
    .shanDeng ul .start_award p {
        margin-top: 5%;
    }
    .choujiang_toast .pic_check {
        width: 40%;
        right: -14rem;
    }
    .choujiang_toast {
        left: 29%;
        width: 32%;
    }
    .noresult {
        left: 29%;
        width: 32%;
    }
    .noresult .result_bg .reward {
        top: 29%;
        left: 47%;
    }
    .noresult .result_bg .sorry {
        top: 54%;
        left: 46%;
        font-size: .9rem;
    }
    .common {
        left: 29%;
        width: 32%;
    }
    .result .result_bg .reward {
        width: 4rem;
        left: 43%;
        top: 26%;
    }
    .result .result_bg .sorry {
        top: 54%;
        left: 46%;
        font-size: .9rem;
    }
    .hasend {
        left: 29%;
        width: 32%;
    }
}


/*@media screen and (device-height:568px) and (-webkit-min-device-pixel-ratio:2) {
    .shanDeng ul li {
        height: 25.3%;
        width: 24.3%;
    }
    .shanDeng ul .start_award {
        height: 25.3%;
    }
    .shanDeng {
        height: 329px;
    }
    .shanDeng ul li div {
        width: 61%;
        margin: 4px auto;
    }
    .shanDeng ul li {
        margin: 7px 7px 11px 10px;
    }
    .shanDeng ul .start_award p {
        font-size: 1.2rem;
    }
    .shanDeng ul .thanks {
        line-height: 4rem;
    }
    #luck {
        height: 90%;
        width: 93%;
    }
}

@media screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
    .shanDeng ul li {
        margin: 5px 7px 11px 10px;
        width: 26.3%;
        height: 27.3%;
    }
    .shanDeng {
        height: 353px;
    }
}

@media screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) {
    .shanDeng ul li {
        margin: 5px 7px 11px 12px;
    }
    .shanDeng .light {
        left: -20px;
    }
    .shanDeng ul li div {
        width: 50%;
    }
}



} */