.popup{
    display:none;
    background:#000;
    opacity:.5;
    color:#FFF;
    width:150px;
    position:fixed;
    top:45%;
    left:50%;
    border-radius:5px;
    margin:0 auto;
    margin-left:-75px;
    line-height:50px;
    text-align:center;
}
*{
    font-family:"Microsoft YaHei";
    margin:0;
    padding:0;
}
html{
    width:100%;
    height:100%;
}
body{
    width:100%;
    height:100%;
    background:url(/Public/Project/Home/img/login_bg.jpg) no-repeat;
    background-size:cover;
}
.space{
    height:17%;
}
.loginbox{
    _height:50%;
    min-width:310px;
    max-width:500px;
    min-height:300px;
    background:rgba(255, 255, 255, .6);
    border-radius:5px;
    margin:20px auto;
    padding:20px 30px;
}

@media screen and (min-width: 320px) {
    body{
        position: absolute;
          width: 100%;
           left: 0;
          right: 0;
            top: 0;
           bottom: 0;
            overflow-y: scroll;
          -webkit-overflow-scrolling: touch;/* 解决ios滑动不流畅问题 */
    }
    .space {
        height: 8% !important;
    }
    .title{
        font-size: 24px !important;
    }
    .loginbox{
        min-width:270px;
        max-width:270px;
        padding: 20px 15px;     
    }
    td.name {
        display: none;
    }
    .foot {
        font-size: 9.4px !important;
    }
}

@media screen and (min-width: 375px) {
    .loginbox{
        min-width:310px;
        max-width:310px;
        padding: 20px 15px;
    }
    td.name {
        width: 25% !important;
        display: table-cell;
    }
    .foot {
        font-size: 10px !important;
    }
}

@media screen and (min-width: 414px) {
    .loginbox{
        min-width:340px;
        max-width:340px;
        padding: 20px 15px;
    }
    td.name {
        width: 25%;
        display: table-cell;
    }
    .foot {
        font-size: 11px !important;
    }
}

@media screen and (min-width: 540px){
    .space {
        height: 17% !important;
    }
    .title{
        font-size: 30px !important;
    }
    .loginbox{
        min-width:460px;
        max-width:460px;
        padding: 20px 15px;
    }
    td.name {
        width: 18% !important;
        display: table-cell;
    }
    .foot {
        font-size: 14px !important;
    }
}



.title{
    font-size:30px;
    width:100%;
    color:#38587F;
    line-height:40px;
    text-align:center;
    margin-top:20px;
}
.title span{
    padding:10px;
    /*padding-left: 75px;*/
    /*background: url(/Public/Project/Home/img/mocenterlogo.png) no-repeat 10px 10px;*/
}
.title span img{
    vertical-align:middle;
    margin-right:15px;
}
.loginform{
    margin:20px auto;
    width:100%;
}
.loginbtn{
    width:50%;
    color:#FFF;
    background:#38587F;
    border:none;
    border-radius:8px;
    font-size:20px;
    line-height:50px;
    text-align:center;
    margin:0 auto;
    margin-top:10px;
    display:block;
    cursor:pointer;
}
td{
    width:38%;
    height:40px;
}
td{
    text-align:left;
}
td.name{
    width:20%;
    _text-align:right;
}
input{
    width:100%;
    height:100%;
    border-radius:5px;
    padding-left:5px;
    margin-left:-10px;
    border:1px solid #CCC;
    background:transparent;
}
.verifyimg img{
    display:block;
    width:100%;
    height:100%;
}
.foot{
    font-size:15px;
    line-height:30px;
    height:30px;
    text-align:center;
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    color:#FFF;
    background:rgba(0, 0, 0, .3);
}
.qrlogin{
    background:url('/Public/Common/img/qr_login_icon.png');
    width:48px;
    height:48px;
    top:0;
    right:0;
    position:absolute;
    tab-index:-9999999px
}
.qrcode-desc title{
    font-weight:bold; font-size:14px; margin-top:7px
}