﻿@charset "UTF-8";
/*登录注册*/
.login-sign{
    position: relative;
    height: 100%;
    background: #fff;
}
.login-sign header{
    border-bottom: solid 0.025rem #eee;
}
.login-sign .logo{
    width: 3.5rem;
    display: block;
    margin: 0 auto;
}
.login-sign .login .logo{
    margin: 3.25rem auto;
}
.login-sign .sign .logo{
    margin: 2rem auto;
}
.login-sign .steps{
    border-bottom: solid #eee .025rem;
    position: relative;
    display: flex;
    padding-top: 1.5rem;
    padding-bottom: 1rem;
}
.login-sign .steps .step{
    flex: 1;
    text-align: center;
}
.login-sign .steps .ico{
    height: .75rem;
    display: block;
    position: relative;
}
.login-sign .steps .ico:after{
    content: '';
    position:absolute;
    left: 0;
    right: 0;
    top: .275rem;
    height:  .1rem;
    background: #ddd;
}
.login-sign .steps .ico i{
    border: solid .1rem #ddd;
    border-radius: 50%;
    background-color: #fff;
    background-size:.75rem .75rem;
    width: .75rem;
    height: .75rem;
    margin: 0 auto;
    display: block;
    z-index: 100;
    position: relative;
}
.login-sign .steps .text{
    display: block;
    font-size: .6rem;
    margin-top: .5rem;
}
.login-sign .steps .on .ico i{
    background-image: url(../images/user/step.png);
    border: none;
}
.login-sign .steps .finish .ico i{
    background-image: url(../images/user/correct.png);
    border: none;

}
.login-sign .steps .step-1 .ico:after{
    left: 50%;
}
.login-sign .steps .step-4 .ico:after{
    right: 50%;
}


.login-sign .lab{
    font-size: .9rem;
    line-height: .9rem;
    color: #333;
    text-align: center;
    margin-top: 2.25rem;
    margin-bottom: 1.5rem;
}
.login-sign .ptip{
    line-height: .7rem;
    margin-bottom: 1.5rem;
    text-align: center;
}
.login-sign .fot{
    font-size: .6rem;
    line-height: 0.8rem;
    text-align: center;
    position: fixed;
    bottom: 1.2rem;
    width: 100%;
}


.loginsignup-input{
    padding:0 1rem;

}
.loginsignup-input .lsu{
    border-bottom: solid 1px #ddd;
    margin-bottom: .75rem;
    padding: .55rem 0;
    display: flex;
        margin-top: .75rem;
}
.loginsignup-input .lsu input{
    flex: 1;
    font-size: .7rem;
    color: #999;
    line-height: 1.2rem;
}

.loginsignup-input .lsu .get_verify{
  border: .025rem #555 solid;
  border-radius: .125rem;
  width: 4.25rem;
  height: 1.2rem;
  text-align: center;
}
.loginsignup-input .lsu .verify,.loginsignup-input .lsu .verify img {
    width: 5rem;
    height: 1.2rem;
}

.loginsignup-input .ico{
    width: 1.25rem;
    height: 1.2rem;
    background-repeat: no-repeat;
    background-size: .9rem .9rem;
    background-position: left center;
}
.loginsignup-input .ico-username{background-image: url(../images/user/ico-login-u.jpg);}
.loginsignup-input .ico-password{background-image: url(../images/user/ico-login-k.png);}
.loginsignup-input .ico-phone{background-image: url(../images/user/ico-login-m.png);}
.loginsignup-input .ico-verify{background-image: url(../images/user/ico-login-v.jpg);}

.loginsignup-input .lsu-submit{
        display: flex;
        margin-top: 1.75rem;
}
.loginsignup-input .lsu-submit .btn-primary{
    flex: 1;
    line-height: 2.25rem;
    border-radius: 3px;
    font-size: .75rem;
}
.loginsignup-input .lsu-agree{
    display: flex;
        align-items: center;
}
.loginsignup-input .lsu-agree .label{
    padding: 0;
    width: .8rem;
}
.loginsignup-input .lsu-agree .checkbox{
    border-radius: .125rem;
    width: .8rem;
    height: .8rem;
    
}
.loginsignup-input .lsu-agree .checkbox:checked{
    background: #f1331c;
    border: 0;

}
.loginsignup-input .lsu-agree .checkbox:checked:before{
    color: #fff;
}
.loginsignup-input .lsu-agree .agree-text{
    flex: 1;
    font-size: .6rem;
    padding-left: .5rem;
}
.loginsignup-input .lsu-agree a {
    color: #2374e3;
}


.loginsignup-input .signup-find{
    margin-top: .75rem;
    line-height: .7rem;
}

.loginsignup-input .prompt{
    padding-top:2rem;
}
.loginsignup-input .prompt .stext{
    font-size: .7rem;
    line-height: .7rem;
    color: #222;
    margin-top: 1rem;
}

.pact{
    overflow-y: scroll;
}
.pact .cont{
       padding: .75rem;
    font-size: .6rem;
    line-height: 1rem; 
}
.pact .share{
    display: flex;
    padding: 1rem;
    background: #f0f2f8;
}
.pact .share button{
    border-width: .05rem;
    border-color: rgb(170, 170, 170);
    border-style: solid;
    border-radius: .125rem;
    background-color: rgb(255, 255, 255);
    height: 1.5rem;
    flex: 1;
}

/*授权绑定 登录*/
.bind{
    margin-bottom: 4.5rem;
    margin-top: 3.5rem;
    text-align: center;
}
.direction{
    padding: 1.5rem;
}
.direction .btn{
    width: 100%;
    display: block;
    height: 2.25rem;
    line-height: 2.25rem;
    background: #f0f2f8;
    color: #222;
    font-size: 0.9rem;
    text-align: center;
    margin-bottom: 1rem;
    border-radius: 1.5rem;
}
.direction .btn-wx{
    background: #1aad19; 
    color: #fff;
}

.bindtop{
        text-align: center;
}
.bindtop .userlogo{
        width: 4.5rem;
    height: 4.5rem;
    border-radius: 50%;
    border: 0.1rem solid #e6e6e6;
    overflow: hidden;
    margin: 0 auto;
    margin-top: 1.5rem;
}
.bindtop .username{
        font-size: .75rem;
    color: #222;
    font-weight: bold;
    line-height: 1.25rem;
    margin-top: .5rem;
    margin-bottom: 1rem;
}
.bindtop .avatar{
        width: 100%;
    height: 100%;
    border-radius: 50%;
}

.bindcont{
}
.bindcont .bindtab{
    padding: 0 0.75rem;
    position: relative;
}
.bindcont .bindtab:after{
    content: '';
    position: absolute;
    left: 50%;
    top: 0.5rem;
    height: 0.75rem;
    width: 0.05rem;
    background: #ddd;
}
.bindcont .bindtab .uitem{
    height: 1.75rem;
    line-height: .75rem;
        text-align: center;
        padding: 0.5rem 0;
        position: relative;
}
.bindcont .bindtab .uitem:after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    height: 0.1rem;
    width: 0;
    background: #f1331c;
    transition-duration: 0.3s;
}
.bindcont .bindtab .uitem.on{
    color: #f1331c;
}
.bindcont .bindtab .uitem.on:after{
/*    content: '';
    position: absolute;*/
    left: 0;
/*    bottom: 0;
    height: 0.1rem;*/
    width: 100%;
    /*background: #f1331c;*/
}
.bindcont .bindfrm{
    display: none;
}
.bindcont .bindfrm.on{
    display: block;
}


.myheader {
    position: relative;
    background: #fff;
}
.myheader .person {
    height: 7.5rem;
    padding: .75rem;
    background: #fff url(https://coffee.easyjobmaterials.com/public/images/user_bg.png) center repeat;
    background-size: cover;
}
.myheader .person .personicon{
    padding-top: .75rem;
    flex: 1;    
}
.myheader .person .avatar {
    width: 2.75rem;
    height: 2.75rem;
    border: solid 0.15rem #fff;
    border-radius: 50%;
    display: inline-block;
    float: left;
}

.myheader .person .lors {
    /* margin-left: .75rem;
    color: #fff;
    float: left;
    font-size: .6rem;
    line-height: .6rem; */
    padding-left: .75rem;
    flex: 1;
}
.myheader .person .lors .name{
    /* margin-top: .25rem; */
    
    line-height: .8rem;
    font-size: .75rem;
}
.myheader .person .lors .jf{
    margin-top: .75rem;
}
.myheader .person .lors .jf em{
    font-size: 1.45rem;
}
.myheader .lors .type{
    font-size: .6rem;
    margin-top: .25rem;
}



.myheader .setting ,.myheader .message{
    width: 1rem;
    height: 1rem;    
    display: inline-block;
    margin-right: .75rem;
}
.myheader .setting {
    background: url("../images/user/icon_setting.png") center no-repeat;
    background-size: .9rem .9rem;
}
.myheader .message {
    background: url("../images/user/icon_message.png") center no-repeat;
    background-size: .9rem .9rem;
    position: relative;
}
.myheader .checkin{
    width: 5.75rem;
    height: 1.5rem;
    background: url("../images/user/checkin.png") center no-repeat;
    background-size: 5.75rem 1.5rem;
    line-height: 1.5rem;
    color: #fff;
    padding-left: 2rem;
    font-size: .75rem;
    box-shadow: 0px 0.125rem 0.5rem 0 rgba(179, 54, 16, 0.3);    
        display: block;
        margin-top: .75rem;
        text-align: center;
}
.myheader .message .num{
    border-radius: 50%;
    background-color: #fff;
    width: .6rem;
    height: .6rem;
    font-size: .4rem;
    line-height: .6rem;
    color: #f1331c;
    display: block;
    position: absolute;
    top: -.35rem;
    right: -.35rem;
    text-align: center;
    font-weight: bold;
}


.myheader .scgz {
    position: absolute;
    bottom: -1.6rem;
    left: .75rem;
    right: .75rem;
    line-height: 1.7rem;
    padding: 0.85rem 0;
    background: #fff;
    border-radius: .25rem;
    box-shadow: 0px 0.125rem 0.5rem 0 rgba(0, 0, 0, 0.1);
}

.myheader .scgz ul li {
    text-align: center;
    border-right: solid 0.025rem #ddd;
}
.myheader .scgz ul li:last-child{
    border-right: 0;
}

.myheader .scgz .icon{
    width: 1rem;
    height: 1.7rem;
    display: inline-block;
    background-position: left center;
    background-size: 1rem 1rem;
    background-repeat: no-repeat;
    margin-right: .5rem;
}
.myheader .scgz .icon-cost{
    background-image: url(../images/user/icon_cost.png);
}
.myheader .scgz .icon-coupon{
    background-image: url(../images/user/icon_coupon.png);
    
}
.myheader .scgz .icon-heart{
    background-image: url(../images/user/icon_heart.png);
    
}


.vipheader{
    padding: .5rem .75rem;
}
.vipheader .person{
    border-radius: .25rem;
}
.vipheader .person .lors .name{
    font-size: .75rem;
}
.vipheader .person .lors .jf {
    margin-top: .6rem;
}

.growth{
    position: absolute;
    left: 1.5rem;
    right: 1.5rem;
    bottom: 1.5rem;
}
.growth .text{
    font-size: .6rem;
    color: #fff;
    margin-bottom: .4rem;
    margin-left: .25rem;
}
.growth .value{
    position: relative;
    background-color: #ffe7dc;
    height: .45rem;
    border-radius: .25rem;
    overflow: hidden;
}
.growth .scale{
    display: block;  
    background-image: -moz-linear-gradient( 0deg, rgb(249,190,0) 0%, rgb(255,157,3) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(249,190,0) 0%, rgb(255,157,3) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(249,190,0) 0%, rgb(255,157,3) 100%);
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: .45rem;
}

.gration{
    padding-bottom: .75rem;
    padding-top: .25rem;
    text-align: center;
}
.gration .uitem{
    text-align: center;
    line-height: .7rem;
}
.gration .uitem:last-child:after{
    border-left: solid 0.05rem #eded;
}
.gration .uitem b{
    font-size: 1.2rem;
    line-height: 1.2rem;
    margin-bottom: .5rem;
    display: block;
}

.gration .uitem .mright{
    width: .5rem;
    height: .7rem;
    vertical-align: top;
}


.myodr{
    margin-top: 2.35rem;
    padding-left: .75rem;
}
.vipodr{
    margin-top: .75rem;
}
.myodr .tit{
    border-bottom: solid 0.025rem #ddd;
    line-height: .75rem;
    padding-right: .75rem;
    padding-top: .675rem;
    padding-bottom: .675rem;
    font-size: .75rem;
}
.myodr .tit .more{
    color: #aaa;
}
.myodr .odrsta{
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}
.myodr .odrsta .uitem{
    text-align: center;    
}
.myodr .odrsta .status{
    line-height: .65rem;
    font-size: .65rem;
    text-align: center;
    display: inline-block;
    padding-top: 1.5rem;
    background-position: top center;
    background-size: 1rem 1rem;
    background-repeat: no-repeat;

}
.myodr .odrsta .unpay {
    background-image: url(../images/user/icon_pay.png);

}
.myodr .odrsta .unship {
    background-image: url(../images/user/icon_logi.png);

}
.myodr .odrsta .unrecev {
    background-image: url(../images/user/icon_pack.png);

}
.myodr .odrsta .uncomt{
    background-image: url(../images/user/icon_comt.png);

}



.usercate .items{
    padding-left: .75rem;
}

.usercate .items > .uiflex{
    /* border-bottom: solid 1rpx #ddd; */
    padding-top: .5rem;
    padding-bottom: .5rem;
    padding-right: .75rem;
    box-sizing: border-box;
}
.usercate .items > a{
    /* border-bottom: solid 0.025rem #ddd; */
    padding-top: .5rem;
    padding-bottom: .5rem;
    padding-right: .75rem;
}
.usercate .items > a:last-child{
    border-bottom: 0
}
.usercate .items .icon{
    height: 1rem;
    width: 1rem;
}
.usercate .items .icon img{
    height: .75rem;
    width: .75rem;
    vertical-align: top;
    margin-top: .125rem;
}
.usercate .items .bd{
    line-height: 1.5rem;
    padding-left: .5rem;
    position: relative;
}
.usercate .items .ft{
    color: #f1331c;
    line-height: .7rem;
}
.usercate .items > a.finish .ft{
    color: #aaa;
}
.usercate .items > a.finish .tag{
    width: 2.75rem;
    height: 1.5rem;
    border: solid .05rem #ddd;
    padding: .05rem;
    transform: rotate(-9deg);
    position: absolute;
    top: 0;
    right: 0.25rem;
}
.usercate .items > a.finish em{
    color: #cccccc;
    border: solid 1px #ddd;
    display: block;
    font-size: .6rem;
    text-align: center;
    height: 100%;
    line-height: 1.8;
}

.usergrids{
    margin-bottom: 3.25rem;
    height: 9rem;
    display: flex;
    flex-wrap: wrap;
}
.usergrids .item {
    width: 25%;
    text-align: center;
    padding-top: .7rem;
    padding-bottom: 1rem;
}
.usergrids .icon {
    height: 1.75rem;
    margin-bottom: .4rem;
}
.usergrids .icon img {
    display: inline-block;
    height: 1.75rem;
    width: 1.75rem;
}
.text{
    font-size: .6rem;
    line-height: .6rem;
}

/*心动好礼*/
.keep-list{
    padding-left: .75rem;
    border-top:solid #eee .025rem;
}
.keep-list .shopimg, .keep-list .shopimg img {
    height: 4rem;
    width: 4rem;
}
.keep-list .prod {

    padding: .6rem;
    padding-left: 0;
    border-bottom:solid #ddd .025rem;
}
.keep-list .shopcont {
    padding-left: .5rem;
    line-height: .9rem;
}
.keep-list .shopinfo {
    height: 3rem;
}
.keep-list .shopinfo .name {
    color: #222;
    margin-bottom: .25rem;
    display: block;
}

.keep-list .similar .cost {
    font-size: .6rem;
    color: #f1331c;
}
.keep-list .similar .cost em {
    font-size: .75rem;
}
.keep-list .similar .search{
  width: 2.75rem;
  height: 1rem;
    border-radius: .5rem;
    text-align: center;
    display: block;
    font-size: .6rem;
}
.keep-list .reduc {

}
.keep-list .reduc span{
    font-size: .5rem;
    color: #fe8d5a;
  border-radius: .125rem;
  background-color: #fff2f2;
  padding: 0 .2rem;
  height: .7rem;
  line-height: .7rem;
  text-align: center;
  display: inline-block;
  float: left;
}

/*订单列表*/
.order-list .oitem{
    padding-left: .75rem;
    background: #fff;
    font-size: .6rem;
}
.order-list .oitem .otop{
    line-height: 2rem;
    padding-right: .75rem;
    border-bottom:solid #f7f7f7 1px;
}
.order-list .shopimg, .order-list .shopimg img {
    height: 4rem;
    width: 4rem;
}
.order-list .prod {
    padding: .6rem;
    padding-left: 0;
    border-bottom:solid #f7f7f7 1px;
}
.order-list .shopcont {
    line-height: 1rem;
}
.order-list .goods-num {
    width: 2.5rem;
}
.order-list .goods-price {
    width: 2.5rem;
    text-align: right
}
.order-list .obot .consume{
    padding: .75rem 0;
}
.order-list .obot .act{
    text-align: right;
    padding-right: .75rem;
    padding-top: .5rem;
    padding-bottom: .5rem;
}
.order-list .obot .btn{
  border-radius: .125rem;
  width: 4.25rem;
  height: 1.5rem;
  line-height:1.4rem;
  display: inline-block;
  margin-left: .5rem;
}
.order-list .obot .btn-red{
    border-color: #f1331c;
    color: #f1331c;
}

.uitab .navbar{
    line-height: 2.125rem;
    height: 2.125rem;
    font-size: .7rem;
    position: relative;
    text-align: center;
}
.uitab .navbar:after{
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    border-top:solid #627641 .1rem;
    display: none;
}
.uitab .navbar.on{
    color: #627641;
}
.uitab .navbar.on:after{
    display: block;
}
.uitab .calendar{
    width: 2.25rem;
    background: url(../images/user/icon-date.png) center no-repeat;
    background-size: 0.8rem 0.8rem;
}
.uitab .calendar:before{
    content: '';
    position: absolute;
    left: 0;
    top: 0.7rem;
    border-left: solid 0.025rem #ddd;
    height: 0.85rem;
}

.coupon-list{
    padding: .25rem .75rem;
}
.coupon-list .citem{
  border-radius: .3rem;
  overflow: hidden;    
  background-color: #fdfdfd;
}
.coupon-list .cbox{
    display: flex;
  box-shadow: 0px .125rem .375rem 0rem rgba(0, 0, 0, 0.06);
  height: 5rem;
}
.coupon-list .pricebox{
  background-image: -moz-linear-gradient( 0deg, rgb(255,89,57) 0%, rgb(250,57,56) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(255,89,57) 0%, rgb(250,57,56) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(255,89,57) 0%, rgb(250,57,56) 100%);
  border-top-left-radius: .3rem;
  border-bottom-left-radius: .3rem;
  width: 6.25rem;
  height: 5rem;
  text-align: center;
  padding-top: 1.25rem;
  color: #fff;
}
.coupon-list .pricebox .price{
    font-size: 1.05rem;
    line-height: 1.05rem;
}
.coupon-list .pricebox .price em{
    font-size: 2.25rem;
}
.coupon-list .pricebox .desc{
    font-size: .6rem;
    line-height: .6rem;
    margin-top: .6rem;
}
.coupon-list .cright{
    padding-left: .75rem;
    padding-right: .75rem;
}
.coupon-list .cright .ctop{
        border-bottom: solid #ddd .025rem;
    height: 3.75rem;
    position: relative;
}
.coupon-list .cright .seedt{
        display: block;
    line-height: 1.2rem;
    font-size: .5rem;
}
.coupon-list .cright .instruct{
}
.coupon-list .cright .tit{
    font-size: .75rem;
    color: #222;
    line-height: .75rem;
    
}
.coupon-list .cright .time{
    font-size: .5rem;
    line-height: .5rem;
    display: block;
    margin-top: .75rem;
}
.coupon-list .cright .useit{
    border: .05rem #f1331c solid;
    border-radius: .5rem;
    width: 3rem;
    height: 1rem;
    line-height: .8rem;
    font-size: .55rem;
    color: #f1331c;
    text-align: center;
}
.coupon-list .description{
    font-size: .5rem;
    padding: .5rem;
    line-height: .6rem;
    display: none;
}
.coupon-list .description.show{
    display: block;
}
.coupon-list .mright2{
    height: 1.2rem;
    transform: rotate(90deg);
    background-position-x: -.025rem;
}
.coupon-list .expired .pricebox,.coupon-list .used .pricebox{
    background: #aaa;
}

.coupon-list .expired .tag,.coupon-list .used .tag{
  border: solid rgb(204, 204, 204) .075rem;
  width: 3rem;
  height: 3rem;    
  border-radius: 50%;
  padding: 0.15rem;
    position: absolute;
    right: -1.25rem;
    transform: rotate(-45deg);
}
.coupon-list .expired .tag span,.coupon-list .used .tag span{
  border: solid rgb(204, 204, 204) .025rem;
  width: 2.5rem;
  height: 2.5rem;
  text-align: center;
  line-height: 2.5rem;
  display: block;
  font-size: .6rem;  
  border-radius: 50%;
  color: #ccc;
}

.elope{
    color: #fff;
    background-image: -moz-linear-gradient( 0deg, rgb(255,42,41) 0%, rgb(255,106,77) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(255,42,41) 0%, rgb(255,106,77) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(255,42,41) 0%, rgb(255,106,77) 100%);
    height: 5.25rem;
    text-align: center;
    padding-top: .75rem;
}
.elope p{
    padding:.5rem 0;
    line-height: .75rem;
}
.elope em{
    font-size: 1.5rem;
}


.elope-list{
    padding: .25rem .75rem;
}
.elope-list .ebox {
  border-radius: .3rem;
  background-color: #fdfdfd;
  box-shadow: 0px 0.125rem 0.375rem 0rem rgba(0, 0, 0, 0.06);
    height: 4rem;
    display: flex;
    justify-content: space-between;
    padding: .75rem;
    padding-left: 1rem;
}
.elope-list .ebox .eleft{
    padding-left: 2.5rem;
    line-height: 1.25rem;
    background: url(../images/user/icon-elope.png) left center no-repeat;
    background-size: 1.95rem 2.35rem;
}
.elope-list .ebox .eleft .desc{
    font-size: .75rem;
}
.elope-list .ebox .eleft .time{
    font-size: .5rem;
    color: #999;
}
.elope-list .ebox .eright{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
}
.elope-list .ebox .eright .pr{
        color: #f1331c;
}
.elope-list .ebox .eright em{
        font-size: .9rem;
}
.elope-list .ebox .eright .state{
        font-size: .55rem;
        line-height: .55rem;
    color: #999;
}

.record-list .item .month{
    font-size: .6rem;
    line-height: 1.5rem;
    padding: 0rem .75rem;
} 
.record-list .item .record{
    padding:0rem .75rem;
    background: #fff;
}
.record-list .record li{
    padding: .75rem 0rem;
    border-bottom: solid #ddd .025rem;
} 
.record-list .record li:last-child{
    border-bottom: 0;
}
.record-list .record .tit{
    line-height: .7rem;
    color: #222;
} 
.record-list .record .phone{
        font-size: .6rem;
        line-height: .6rem;
    color: #222;
        margin-top: .4rem;
} 
.record-list .record .time{
        font-size: .5rem;
        line-height: .5rem;
        margin-top: .5rem;
    color: #999;
} 
.record-list .record .info{

} 
.record-list .record .state{

} 
.record-list .record .jf{
    color: #f1331c;
    font-size: .6rem;
}
.record-list .record .jf em{
    font-size: .9rem;
} 
.record-list .record .desc{
    line-height: 1.2rem;
        font-size: .55rem;
    color: #999;
} 


.bill-list .record .info{
    padding-left: 2rem;
    background: url(../images/user/circle_phone.png) left top no-repeat;
    background-size: 1.5rem 1.5rem;
    
} 
.bill-list .record .tit{
    font-size: .75rem;
    line-height: .75rem;
    color: #222;
} 


.task-list .record .time {
    font-size: .6rem;
    line-height: .6rem;
}
.task-list .record .state .num{
    font-size: .9rem;
    line-height: .9rem;
}
.task-list .record .state .tyellow{
    font-size: .6rem;
    line-height: .6rem;
    margin-top: .4rem;
}
.task-list .record .state {
    text-align: right;
}
.task-list .record .info{
    /*height: 1.5rem;*/
}



.game-list{
        padding: .25rem .75rem;
}
.game-list .game{
        border-radius: .25rem;
    background-color: rgb(255, 255, 255);
    font-size: .6rem;
    padding: 0px .75rem;
    position: relative;
        border-radius: .25rem;
}
.game-list .game .gameover{
    font-size: .9rem;
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(255,255,255,.5);
    display: flex;
    color: #fff;
    padding: 2rem .75rem 0 .75rem;
}
.game-list .game .gameover span{
    flex: 1;
    height: 6rem;
    background: rgba(0,0,0,.5);
    display: flex;
    align-items: center;
    justify-content: center;
}
.game-list .tit{
    padding: .5rem 0;
}
.game-list .tit,.game-list .bot{
        display: flex;
    justify-content: space-between;
}
.game-list .tit span{
    font-size: .75rem;
    line-height: .8rem;
}
.game-list .tit .state {
        font-size: .55rem;
    border: solid #f1331c .025rem;
    width: 2.55rem;
    height: 1rem;
    color: #f1331c;
    text-align: center;
    line-height: .8rem;
    border-radius: .5rem;
}
.game-list .tit .state.over{
    color: #999;
    border-color: #999;
}
.game-list .img, .game-list .img img {
    width: 100%;
    height: 6rem;
}
.game-list .info{
        line-height: 1rem;
            padding-bottom: .5rem;
    padding-top: .4rem;
}
.game-list .bot{
line-height: 2rem;
    height: 2rem;
    border-top: solid #ddd .025rem;
}



.vipgrowth{
    
}
.vipgrowth .values{
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    padding-top: .75rem;
}
.vipgrowth .values .value{
        width: 6rem;
    display: flex;
    flex-direction: column;
    line-height: 1rem;
    font-size: .6rem;
}
.vipgrowth .values .tdark{
        font-size: .75rem;
}
.vipgrowth .values .tlight{
    
}
.vipgrowth .values .cur{
     color:#fff;
     border-radius:50%;
     box-shadow: 0px 5px 50px 0px rgba(234, 144, 0, 0.52);
     width:6.75rem;
     height:6.75rem;
     padding:0.375rem;
}

.vipgrowth .values .cur .circle{
  border-radius: 50%;
  background-image: -moz-linear-gradient( 90deg, rgb(255,157,3) 0%, rgb(249,190,0) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(255,157,3) 0%, rgb(249,190,0) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(255,157,3) 0%, rgb(249,190,0) 100%);
    width: 6rem;
  height: 6rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}
.vipgrowth .values .cur .circle .txt{
    line-height: .7rem;
}
.vipgrowth .values .cur .circle .num{
        font-size: 1.5rem;
    line-height: 1.5rem;
    margin-top: .5rem;
}
.vipgrowth .info{
        text-align: center;
}
.vipgrowth .info .curvalue{
        background-color: #fab501;
    width: 7.95rem;
    height: 1.25rem;
    color: #fff;
    line-height: 1.2rem;
    border-radius: .75rem;
    font-size: .6rem;
    display: inline-block;
    margin-top: .5rem;
}
.vipgrowth .info .sub{
    font-size: .55rem;
    line-height: .55rem;
    /* display: inline-block; */
    margin-top: .5rem;
}
.vipgrowth .info .sub .tlight{
    display: inline-block;
    line-height: .75rem;
}
.vipgrowth .state{
    padding: 1rem .75rem;
}
.vipgrowth .state .stop,.vipgrowth .state .btxt{
    font-size: .6rem;
    line-height: .6rem;
    color: #fab501; 
        display: flex;
    text-align: right;   
}
.vipgrowth .state .btxt{
        color: #999;
}
.vipgrowth .state .radius{
    background: #e9e9e9;
    height: .45rem;
    border-radius: .5rem;
    position: relative;
    overflow: hidden;
        margin: .5rem 0;
}
.vipgrowth .state .radius p{
        background-image: -moz-linear-gradient( 0deg, rgb(249,190,0) 0%, rgb(255,157,3) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(249,190,0) 0%, rgb(255,157,3) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(249,190,0) 0%, rgb(255,157,3) 100%);
    height: .45rem;
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
}
.vipgrowth .state .v1{
    flex: 1;
}
.vipgrowth .state .v2{
    flex: 2;
}
.vipgrowth .state .v3{
    flex: 3;
}
.vipgrowth .state .v4{
    flex: 4;
}
.vipgrowth .state .v5{
    flex: 5;
}

.growth-list .record .time{
    margin-top: .5rem;
}
.growth-list .record .state {
    justify-content: center;
}

.benefits{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: .7rem;
    background: url(../images/vip/jftopbg2.png) center no-repeat;
    background-size: cover;
    height: 7.25rem;
    color: #fff;
}
.benefits .cur{
    
}
.benefits .num{
    font-size: 1.5rem;
    line-height: 1.5rem;
    margin-top: .75rem;
    margin-bottom: .75rem;
}
.benefits .for{
    font-size: .6rem;
}
.vpqy{
    padding-top: .25rem;
}
.vpqy ul{
        padding-top: .25rem;
}

.vpqy ul li{
    width: 25%;
    float: left;
    text-align: center;
    margin-bottom: 1rem;
}

.vpqy .icon,.vpqy .icon img{
    width: 2rem;
    height: 2rem;
    margin: 0 auto;
}
.vpqy .txt{
        font-size: .6rem;
    line-height: .6rem;
    margin-top: .5rem;
}
.vpqy .tlight{
        font-size: .5rem;
    line-height: .5rem;
    margin-top: .3rem;
}

.vpdesc{
    padding: .75rem;
}
.vpdesc .tit{
    font-size: .75rem;
    text-align: center;
    padding-top: 1rem;
    padding-bottom: .75rem;
}
.vpdesc .table{
    border: solid .05rem #f5e6d0;
}
.vpdesc .table .tr{
    display: table;
}
.vpdesc .table span{
        line-height: 1.5rem;
    font-size: .6rem;
    padding-left: .75rem;
    display: table-cell;
}
.vpdesc .table .dj{
    width: 6.5rem;
}
.vpdesc .table .top{
    height: 1.5rem;
    border-bottom: solid .05rem #f5e6d0;
    background: #fdf3e4;
}


.vpsign{
    background: url(../images/vip/jftopbg3.png) center no-repeat;
    background-size: cover;
    height: 10.2rem;
    position: relative;
}
.vpsign .curinfo{
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 7.8rem;
    color: #fff;
        position: relative;
}
.vpsign .curinfo .cur{
    
}
.vpsign .curinfo .num{
    line-height: .7rem;
    margin-top: 1rem;
    margin-bottom: .75rem;
}
.vpsign .curinfo .num em{
    font-size: 1.5rem;
}
.vpsign .curinfo .checkin{
    box-shadow: 0px 0.125em 0.5rem 0px rgba(194, 115, 0, 0.54);
    width: 6rem;
    height: 2rem;
    display: block;
    background: #fff;
    text-align: center;
    line-height: 2rem;
    font-size: .75rem;
    color: #fab501;
    border-radius: 1rem;
}
.vpsign .ckbox{
        position: absolute;
    left: .75rem;
    right: .75rem;
    top: 7.8rem;
    height: 7.2rem;
    box-shadow: 0px 0.125em 0.5rem 0px rgba(0, 0, 0, 0.1);
    border-radius: .5rem;
    padding: .75rem;
    background: #fff;
}
.vpsign .ckbox .ktop{
        display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: .75rem;
}
.vpsign .ckbox .ktop .q{
    font-size: .6rem;
    line-height: .75rem;
    width: .75rem;
    height: .75rem;
  border-radius: 50%;
  background-color: rgb(250, 181, 1);
  text-align: center;
  color: #fff;
}
.vpsign .ckbox .sust{
    
}
.vpsign .ckbox .sust ul{
    display: flex;
    position: relative;
}
.vpsign .ckbox .sust ul:after{
    content: '';
    position: absolute;
    height: .1rem;
    left: 0;
    top: 3rem;
    width: 100%;
    background: rgb(245, 230, 208);
    z-index: 1;
}
.vpsign .ckbox .sust ul li{
    flex: 1;
    text-align: center;
    position: relative;
    padding-top: 2.25rem;
    z-index: 10;
}
.vpsign .ckbox .sust .jf span{
    background: url(../images/user/jfstr.png) center no-repeat;
    background-size: 1.5rem 0.875rem;
    width: 1.5rem;
    height: .875rem;
    font-size: .5rem;
    color: #fff;
    line-height: .875rem;
    margin-bottom: .5rem;
    display: inline-block;
    margin: 0 auto;
}
.vpsign .ckbox .sust .jf{
    position: absolute;
    top: .75rem;
    left: 0;
        width: 100%;
    display: none;
}
.vpsign .ckbox .sust .show .jf{
    display: block;
}
.vpsign .ckbox .sust .circle{
    display: block;
    border-radius: 50%;
    background-color: rgb(245, 230, 208);
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: .6rem;
    margin: 0 auto;
}
.vpsign .ckbox .sust .f .circle{
    color: #fff;
  background-image: -moz-linear-gradient( 90deg, rgb(255,157,3) 0%, rgb(249,190,0) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(255,157,3) 0%, rgb(249,190,0) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(255,157,3) 0%, rgb(249,190,0) 100%);
}
.vpsign .ckbox .sust .date{
        font-size: .5rem;
    color: #999;
    display: block;
    margin-top: .25rem;
}
.vpcate{
    margin-top: 5.75rem;
}
.vpcate .uititle,.vpcomd .uititle{
        margin-left: .75rem;
}


.comt-list{
    
}
.comt-list .combox{
    background: #fff;
    margin-top: .5rem;
    padding: 0.5rem 0.75rem;
        padding-bottom: 0;
}
.comt-list .combox .prodinfo{
    border-radius: .125rem;
    background-color: #f5f7fb;
    height: 3.5rem;
    padding: .25rem;
    display: flex;
    padding-right: .75rem;
}
.comt-list .prodinfo .shopimg,.comt-list .prodinfo .shopimg img{
    width: 3rem;
    height: 3rem;
}
.comt-list .prodinfo .det{
        padding-left: .5rem;
    line-height: .9rem;
    padding-top: .1rem;
}
.comt-list .prodinfo .det .name{
    line-height: 1rem;
}
.comt-list .combox .time{
    padding: .5rem 0;
    line-height: 1.25rem;
    font-size: .6rem;
}

.comt-list .time .evaluate{
  border-radius: .125rem;
  width: 4rem;
  height: 1.25rem;
  line-height: 1.15rem;
  display: block; 
}
.comt-list .combox .pcomt{
    border-top: solid #ddd .025rem;    
    padding-right: .75rem;
}
.comt-list .pcomt .text{
      line-height: 1rem;
    color: #222;
    padding: .5rem 0;  
}
.comt-list .pcomt .imgs{
    margin-left: -.25rem;
    margin-top: -.25rem;
    margin-bottom: -.25rem;
    margin-right: -.25rem;
        padding-bottom: .75rem;
}
.comt-list .pcomt .imgs a{
    width: 25%;
    float: left;
    display: block;
    padding: .25rem;
}
.comt-list .pcomt .imgs a img{
    width: 100%;
    border-radius: .125rem;
}


.msg-list .msg{
   background: #fff;
    padding: .75rem;
    display: flex; 
}
.msg-list .msg .icon,.msg-list .msg .icon img{
    width: 2rem;
    height: 2rem;
    position: relative;
}
.msg-list .msg .icon .num{
    border-radius: 50%;
    background-color: #f1331c;
    position: absolute;
    top: 0;
    right: 0;
    width: .6rem;
    height: .6rem;
    color: #fff;
    font-size: .4rem;
    line-height: .6rem;
    font-style: normal;
    text-align: center;
}
.msg-list .msg .info{
        display: flex;
    flex-direction: column;
    justify-content: space-between;
        flex: 1;
    padding-left: .5rem;
    height: 2rem;
}
.msg-list .msg .tit{
    line-height: .7rem;
}
.msg-list .msg .desc{
    font-size: .6rem;
    
}


.notice-list{
    padding:0rem .75rem;
}
.notice-list .notice{
}
.notice-list .notice .time{
    text-align: center;
}
.notice-list .notice .time span{
      padding: 0rem .5rem;
  height: 1rem;
  line-height: 1rem;
  color: #fff;
  display: inline-block;
    background: #ccc;
    border-radius: .5rem;
    font-size: .6rem;
}
.notice-list .notice .box{
  border-radius: .25rem;
  background-color: #fff;
  padding: 0px .75rem;
}
.notice-list .notice .tit{
    color: #222;
    line-height: 2rem;
        border-bottom: solid #ddd .025rem;
}
.notice-list .notice .desc{
    padding: .6rem 0;
    display: flex;
}
.notice-list .notice .prod img{
    width: 3.5rem;
    height: 3.5rem;
}
.notice-list .notice .prod{
    padding-right: .5rem;
}
.notice-list .notice .prod .info{
    line-height: 1.1rem;
    padding: .1rem 0;
}


.ads{
    padding: .75rem;
    margin-top: 1.25rem;
    margin-bottom: .75rem;
}
.ads img{
    width: 100%;
}


.helpcenter{

}
.helpcenter .list{
    padding-left: .75rem;
    background: #fff;
}
.helpcenter .list a{
    line-height: 2.5rem;
    padding-right: .75rem;   
    /* border-bottom: solid #ddd .025rem; */
}
.helpcenter .list a:last-child{
    border-bottom: 0;
}
.helpcenter .lab{
    font-size: .6rem;
    color: #999;
    line-height: 1.5rem;
    margin-top: .25rem;
    padding-left: .75rem;
}
.helpcenter.content{
    border-top: solid #ddd .025rem;
    padding:.75rem;
    line-height: 1rem;
}

/*通用表单*/
.form .tit{
    color: #999;
    font-size: .6rem;
    line-height: 1.5rem;
    padding-left: .75rem;
    padding-right: .75rem;
}
.form .panel .lsu{
    padding-left: .75rem;
    padding-right: .75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    line-height: 2.5rem;
    position: relative;
}
.form .panel .lsu:after{
    content: '';
    position: absolute;
    left: .75rem;
    bottom: 0;
    right: 0;
    border-top: solid 1px #f7f7f7;
}
.form .lsu:last-child:after{
    border-top: 0;
}
.form .lsu .label{
    color: #222;
   width: 4.25rem;
}
.form .lsu .inpbox{
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 2.5rem;
}
.form .lsu .inpbox input{
    flex: 1;
}
.form .lsu .quit{
    flex: 1;
    text-align: center;
    color: #999;
}

/*个人信息设置*/
.setting .photo{
    padding-top: .5rem;
    padding-bottom: .5rem;
}
.setting .avatar{
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
}
.setting .lsu .check{
    display: flex;
    align-items: center;
}
.setting .lsu .interest{
    justify-content: flex-start;
    flex-wrap: wrap;
}
.setting .lsu .sex{
    justify-content: flex-start;
}
.setting .lsu .sex .check:first-child{
    margin-right: 3rem;
}
.setting .lsu .interest .check {
    margin-right: 1rem;
}

/*编辑地址*/
.edit-address .setdefault .check{
    display: flex;
    align-items: center;
}

/*轻松赚积分*/
.addup{
    background:#627641;
    background-size: cover;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    line-height: .7rem;
    padding: 1rem;
    position: relative;
}
.addup .cost{
    font-size: 1.5rem;
    line-height: 1.5rem;
    margin-top: 1rem;
    flex: 1;
}
.addup .tip{
    font-size: .6rem;
    color: #fff;
    position: absolute;
    right: 1rem;
    top: 1rem;
    text-decoration: underline;
}
.addup .rule,.vpsign .rule{
    font-size: .5rem;
  background-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  right: .75rem;
  top: .75rem;
  width: 2.75rem;
  height: .9rem;
  border-radius: .5rem;
  line-height: .9rem;
  text-align: center;
  display: block;
      color: #fff;
}


.cost-task{
    padding:0rem .75rem;
}
.cost-task .uititle{
    margin-bottom: -.5rem;
}
.cost-task .task{
    background: #fff;
    padding: .6rem .5rem;
            border-radius: .4rem;
}
.cost-task .state{
    background-color: #eee;
    width: 2.45rem;
    height: 1.1rem;
    border-radius: .5rem;
    text-align: center;
    font-size: .55rem;
    line-height: 1rem;
}
.cost-task .state.red{
    background: #f1331c;
    color: #fff;
}

.cost-task .box .icon,.cost-task .box .icon img{
    width: 1.5rem;
    height: 1.5rem;
}

/*.cost-task .box .progress{
    display: flex;
    align-items: center;
    height: .5rem;
    margin-top: .75rem;
}
.cost-task .box .progress .bar{
    width: 10rem;
    height: .25rem;
    background: #ffe7dc;
    position: relative;
}
.cost-task .box .progress p{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: .25rem;
    background: #f1331c;
}
.cost-task .box .progress span{
        font-size: .5rem;
    color: #999;
    line-height: .5rem;
        margin-left: .25rem;
}*/
.cost-task .box .cont{
        display: flex;
}
.cost-task .cont .desc {
        flex: 1;
    padding-left: .5rem;
}
.cost-task .box .desc .text{
    display: flex;
    line-height: .7rem;
}
.cost-task .box .desc .text .tit{
    max-width: 7rem;
}
.cost-task .box .desc .tlight{
    font-size: .55rem;
    line-height: .7rem;
    margin-top: .25rem;
}
.cost-task .box .desc .tred{
    color: #f1331c;
}


.medal-list{
    border-top: solid 1px #ddd;
}
.medal-list .mcate{
    padding-top: .25rem;
    padding-bottom: 0.75rem;
    margin-bottom: .5rem;
}
.medal-list .medal{
    width: 33.33%;
    float: left;
    text-align: center;
    padding-bottom: 0.75rem;    
}
.medal-list .desc{
    display: none;
}
.medal-list .image img{
    width: 3.45rem;
    height: 3.7rem;
    margin: 0.75rem auto;
}
.medal-list .name{
    line-height: .75rem;
    margin-bottom: 0.375rem;
}
.medal-list .tlight{
    line-height: .6rem;    
    font-size: .6rem;
}

.popuo-medal{
    width: 78.66% !important;
    border-radius: .5rem !important;
}
.popuo-medal .layui-m-layercont{
    padding: 1.75rem;
    position: relative;
    padding-top: 0;
}
.popuo-medal .image{
    position: relative;
    top: -.5rem;
}
.popuo-medal .image image{
    width: 6.75rem;
    height: 7.35rem;    
}
.popuo-medal .name{
    font-size: 1.05rem;
    line-height: 1.05rem;
    color: #222;
    margin-top: 1.5rem;
    margin-bottom: .75rem;    
}
.popuo-medal .tlight{
    display: none;    
}
.popuo-medal .desc{
    line-height: 1.25rem;
    color: #999;    
}
.popuo-medal .close{
    position: absolute;
    bottom: -2rem;
    left: 50%;
    font-size: 1rem;
    color: #fff;
    margin-left: -0.5rem;    
}

