html{
    font-size:100px;

}
html,body{
    height:100%;
    overflow-y:auto;
}
body{
    max-width: 750px;
    margin: 0 auto;
    background-color: #011016;
    -webkit-overflow-scrolling: touch;
}
.box {
    width: 100%;
    max-width: 750px;
    margin:0 auto;
    background: url(../images/bg.jpg)no-repeat center top;
    background-size: cover;
    padding-bottom: 20%;
}
.box .head-img {
    width: 100%;
}
.box .condition {
    position: relative;
    margin-top: -25%;
}
.box .condition .cdt-bg {
    width: 94%;
    margin-left: 3%;
}
.box .bm-btn {
     display: block;

    width: 50%;

    margin-left: 25%;

    margin-top: 5%;
}

.box .bm-btn img{

    width: 100%;

}
/*info*/
.body2 {
    position: relative;
   margin-top: -19%;
   padding: 10px 2% 0 2%;
       z-index: 2;
}
.body2 .details > p {
    font-size: 14px;
    margin: 15px;
    border-radius: 3px;
    background-color: #fff;
    padding: 10px 7px;
    box-shadow: 0px 0px 1px rgba(1,1,1,.3);
    color: #fa4871;
    text-align: justify;
}
#postform {
    width: 100%;
     background: url("../images/info_body_bg.png") no-repeat center top;
   /* background-color: #53a2cf;*/
    background-size: 100% 100%;
    padding-top: 10%;
    padding-bottom: 2%;
}
.titlefrom{

    width: 28%;
    text-align: center;
    padding: 0 36%;

    position: absolute;
    top: -2%;

}

.titlefrom img{

    width: 100%;

}
.form {
    width: 100%;
}
li{
    position: relative;
}
li .labels{
    width: initial;
    border:none;
}
.banner{width: 100%;}
.row{
    font-size: 14px;
    margin: 15px;
    border-radius: 3px;
    background-color: #1e535c;
    padding: 10px 7px;
    box-shadow: 0px 0px 1px rgba(1,1,1,.3);
}
.row > img{
    width: 100%;
}
label{
    width: 95px;
    display: inline-block;
    color: #47c3d2;
    vertical-align: middle;
    border-right: 1px solid #1e535c;
    text-align: center;
}
.idr2{
    border-right: none;
    width: 100px;
}
label.photo{
    width: 95px;
    font-size: 12px;
    border-right: none;
}
input.txt{
    color: #fff;
     border: none; 
    text-align: center;
    background-color: transparent;
}
label span{
    font-size: 10px;
    color: #fff;
    position: absolute;
    bottom: 8px;
}
h2{
    color: #000;
    width: 100%;
    font-size: 2em;
    font-family: "microsoft yahei";
    padding-left: 2.5rem;
}
.dash{
    border: 1px dashed #1e535c;
    padding: 10px 0;
    margin: 0px 5px 0px 5px;
    border-radius: 8px;
    width: 94%;
    margin-left: 3%;
}
.dash .row{
    margin: 10px;
}
.input_wrapper{
    width: 125px;
    height: 30px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}
.upl{
    width: 125px;
    height: 20px;
    padding: 5px 0px 5px 0px;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/anniu_small.png") no-repeat center center;
    background-size: 100%;
}
input.image{
    width: 125px;
    height: 30px;
    position: absolute;
    opacity: 0;
    z-index: 100;
    top:0;
    right: 0;
}
.addr{
    border: 1px solid #d1d1d1;
    border-radius: 3px;
    padding: 5px;
    margin-top: 5px;
    width: 70%
}
.hint01{
    display: block;
    font-size: 10px;
    color: #c1c1c1;
    margin-top: 15px;
}
.thumb{
    width: 28px;
    height: 28px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    margin-top: 20px;
    background-color: green
}
.thumb01{
    width: 28px;
    height: 28px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    background-color: green
}
.photo_hint{
    width: 100%;
    background-image: url("../images/phint.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin-bottom: 15px;
    margin-top: 20px;
}

.join_btn {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    background: #47c3d2;
    border-radius: 10px;
    height: 55px;
    color: #fff;
    line-height: 55px;
    margin-top: 3%;
}
.submit-box {
    text-align: center;
    position: absolute;
    margin-top: 2%;
    z-index: 3;
    width: 100%;
}
.join_btn {
    display: block;
    width: 90%;
    margin-left: 3%;
}
.join_btn img{
    width: 100%;

}
a.sub{
    display: block;
    margin: 30px 8%;
}
a.sub img{width: 100%;height: 100%;}
@media screen and (max-width: 320px){

}
a.share{
    /*display: block;
      width: 86%;
      height: 80px;
      margin: 0px 7% 0px 7%;
      background: url(../img/fenxiang.png) no-repeat center center;
      background-size: 100%;*/
}
.page3 img{
    width: 100%;
}
.body3 {
    /* background-color: #53a2cf; */
}
.success img{
    width: 100%;
}
.copyright {
    width: 100%;
}
.mask {
    position: absolute;
    top:0;
    left:50%;
    width: 100%;
    height:100%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    max-width: 750px;
    background:rgba(0,0,0,.3);
    display: none;
}
.mask img{
    width: 100%;
}
.final_tip{
    /*padding: 10px;*/
}
.final_tip img{
    width: 94%;
   margin-left: 3%;
}
.war{
    text-align: center;
    color: #fff;
    font-size: 12px;
        padding-top: 24%;
    padding-bottom: 20px;
    position: relative;
    z-index: 0;
}
a.cancel,a.confirm{
    display: inline-block;
    height: 35px;
    width: 120px;
    background-color: #5da2e8;
    color: #fff;
    font-size: 14px;
    text-align: center;
    line-height: 35px;
    border-radius: 5px;
}
a.cancel{float: left}
a.confirm{float: right}
.area{
    display: inline-block;
    vertical-align: middle;
    width: 65%;
}
.area li{
    display: inline-block;
    margin: 0 0 0 20%;
    color: #fff;
}
.area li input{
    font-color: #333333;
}
.address{
    display: inline-block;
    width: 65%;
    vertical-align: middle;
    text-align: center;
}
.address  input{
    width:auto;
}
.title-address{
    line-height: 65px;
}
.big-row label{
    line-height: 50px;
}
.fs-address label{
    line-height: 30px;
}
.area-t{
    width: 170px;
    display: block;
    margin-top: -24px;
    font-size: 15px;
    margin-left: 20px;
    /* background: #6374cf; */
    text-align: center;
    font-weight: 600;
    font-family: "微软雅黑";
    color: #fff;
}
.qq-upload-list{
    display:none;
}
#province, #city{
    width: 35%;
}
.row  img {
    width: 100%;
}
@media screen and (max-width: 320px){
    .area {
        width: 60%;
    }
    .address{
        width:60%;
    }
    .address select{
        width:75px;
    }
    .addr{
        width:90%;
    }
    .area li{
        margin: 0 0 0 1%;
    }
    #province, #city {
        width: 75px;
    }
}


::-webkit-input-placeholder { /* WebKit browsers */
    color: #fff;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #fff;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #fff;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #fff;
}


.address select,.address textarea{
    border: 1px solid #3b929e;
    background-color: #000;
    color: #fff;
}
.phint{
    margin-bottom:5%;
}
.area .labels{
    color: #fff;
}

.success{
    margin-top: -25%;
}
.share{
    display: block;
    width: 74%;
    margin-left: 13%;
    margin-top: 5%;
}
.share img{
    width: 100%;
}

#live_province{
    width: 43%;
}
#birthday{
    width: 60%;
    height: 28px;
}



/*new*/
label, input.txt, .address{text-align: left;}
label, input.txt, .area{margin-left: 2%;}
.area{width: 62%;}
.area li{margin: 0; display: block;}


/*new 180703*/
.index-btn{box-sizing: border-box; text-align: center; margin-top: 4%;}
.index-btn *{box-sizing: border-box; margin: 0; padding: 0;}
.index-btn a{display: inline-block; width: 43%;}
.index-btn a img{width: 100%; max-width: 100%;}