@charset "utf-8";

/* CSS Document */
.main .item-login-option:after, .main .item:after { content: '\20'; clear: both }
.header { position: relative; z-index: 8888; height: 44px; background: url(../../../st/img/header-bg.png)repeat-x #efefef; background-size: 100% 44px; border-bottom: 1px solid #bfbfbf; border-width: 0 0 1px; -webkit- color: #252525; font-size: 16px; min-width: 320px }
.header a { position: absolute; width: 40px; height: 44px }
.header span { display: block; width: 20px; height: 20px; margin: 12px 0 0 10px; text-indent: -100px; overflow: hidden; background: url(../../../st/img/arrow.png)no-repeat; background-size: 20px 20px }
.header h2 { height: 44px; line-height: 44px; font-weight: 400; font-size: 16px; text-align: center }

.main {padding: 10px 10px 0;}
.main .login_stit{font-size: 17px;color: #333;font-weight: bold;margin-bottom: 14px;}
.main h2 { margin: 8px 0 10px; line-height: 1.5; font-size: 13px; color: #686868 }
.main .item, .main .item-captcha .input-info { margin-bottom: 10px; width: 76%; }
.main h2 span { color: #252525 }
.main .item { position: relative; width: 100% }

.main .item .txt-input {width: 100%;height: 44px;line-height: normal;padding: 0;border-radius: 3px;background: #fff;font-family: '\5fae\8f6f\96c5\9ed1';font-size: 14px;color: #252525;-webkit-appearance: none;box-shadow: 0 2px 7px 0 rgba(5,34,97,.1);}
.main .item .txt-input::-webkit-input-placeholder {
color:#777
}
.main .item .txt-input:-moz-placeholder {
color:#777
}
.main .item .txt-input::-moz-placeholder {
color:#777
}
.main .item .txt-input:-ms-input-placeholder {
color:#777
}
.main .item .err-msg { font-size: 13px; color: #f96fce }
.main .item .txt-err { border: 1px solid #f96fce }
.main .item .txt-phone { padding-left: 15px; width: 53.31034482758621% }
.main .item .txt-captcha, .main .item .txt-password, .main .item .txt-username {padding-left: 40px;background: url(../images/login_captcha.png) no-repeat 10px center #fff;}
.main .item .txt-pad18 { padding-left: 40px }
.main .item:after { display: block }
.main .item-phone .input-close { right: 15px }
 .main .item .txt-username{background: url(../images/login_name.png) no-repeat 10px center #fff;background-size: 20px;}
 .main .item .txt-password{background: url(../images/login_captcha.png) no-repeat 10px center #fff;}
.main .item-username .input-close { right: 17px }
.main .item-password .input-close { right: 78px }
.main .item-password .tp-btn { display: block; position: absolute; right: 10px; top: 8px; width: 51px; height: 35px }
.main .item-password .btn-off { background: url(../images/passwordclose.png)no-repeat; background-size: 51px 35px }
.main .item-password .btn-on { background: url(../images/passwordopen.png)no-repeat; background-size: 51px 35px }
.main .item-captcha #captcha-img { position: absolute; right: 0; top: 0px; width: 22%; height: 44px; padding-left: 7px; background-color: #eee; line-height: 54px;}
.main .item-captcha .input-close { right: 89px }
.main .item-password .err-tips { margin: 13px 0 24px; font-size: 13px; color: #848689 }
.main .item-password .err-tips a { color: #f96fce; border-bottom: 1px solid #f96fce; height: 13px }
.main .item-captcha .login-free { position: relative; height: 18px; padding-left: 26px; line-height: 18px; font-size: 13px; color: #848689 }

.main .item-btns .btn-login, .main .item-btns .btn-next { display: inline-block; width: 100%; height: 40px; border-radius: 3px; background: #0f96ec; text-decoration: none; line-height: 39px; text-align: center; font-size: 18px; color: #fff }
.main .item-sms-captcha { margin-bottom: 10px }
.main .item-sms-captcha .txt-sms-captcha { float: left; padding-left: 15px }
.main .item-phone .btn-retransmit { float: right; overflow: hidden; width: 44.13793103448276%; height: 42px; border: 1px solid #f15353; border-radius: 3px; background: #fff; line-height: 40px; text-align: center; cursor: pointer; font-size: 14px; color: #f15353 }
.main .item-phone .btn-retransmit-disabled { box-shadow: none; border: 1px solid #e2e2e2; background: #e2e2e2; cursor: default; color: #bdbdbd }
.main .item-sms-captcha .input-close { left: 52.75862068965517% }
.main .item-sms-captcha1 { margin-bottom: 42px }
.main .item-login-option { padding-top: 20px; margin-bottom: 34px; font-size: 14px }
.main .item-login-option .register-free { float: left; width: 50% }
.main .item-login-option .retrieve-password { float: right; width: 50%; text-align: right }
.main .item-login-option .register-free a, .main .item-login-option .retrieve-password a { color: #686868; font-size: 15px; border-bottom: 1px solid #686868; height: 14px;}
.main .item-login-option:after { display: block }
.main .item-login-other dt { margin-bottom: 13px; font-size: 14px; color: #666 }
.main .item-login-other dd a { float: left }
.main .item-login-other dd .qq { width: 25.17% }
.main .item-login-other dd .qq span { width: 25px; margin-left: 5px }
.main .item-login-other dd .renren { width: 27.7586% }
.main .item-login-other dd .renren span { width: 38px; background-position: -66px 0 }
.main .item-login-other dd .weibo { width: 19.2714% }
.main .item-login-other dd .weibo span { width: 29px; background-position: -144px 0 }
.main .item-login-other dd .douban { width: 27.8%; text-align: right }
.main .item-login-other dd .douban span { width: 82px; background-position: -205px 0 }
.main-unbind .item-tips { margin-bottom: 15px }


/*头部开始*/

.var {
    width: 100%;
    height: 70px;
    background-color: #ddd;
    margin: 0px auto;
    position: relative;
}

.var .var_back {
    margin: 14px 0 0 20px;
    position: absolute;
}

.var p {
    position: absolute;
    margin-top: 20px;
    margin-left: 50%;
    left: -90px;
    font-size: 20px;
    color: #696c73;
    width: 200px;
    text-align: center;
}

.var a {
    display: inline-block;
}








/*基础信息*/

.my_xuan {
    position: relative;
}

.my_xuan .mm_box a {
    display: inline-block;
    position: absolute;
    width: 100px;
    line-height: 24px;
    color: #fff;
    background-color: #0098e7;
    text-align: center;
    border-radius: 6px;
    right: 6%;
    top: 22%;
}

#big_banner {
    min-height: 60px;
    background: #fff;
    position: relative;
    overflow: hidden;
    width: 96%;
    border-radius: 10px;
}

#big_banner .swiper-wrapper img {
    width: 100%;
    height: auto;
    vertical-align: middle;
}

#big_banner .swiper-pagination {
    text-align: center;
    bottom: 6px;
    left: 0;
}

#big_banner .swiper-pagination-bullet {
    width: 10px;
    height: 4px;
    border-radius: 20px;
    margin: 0 2px;
}

#big_banner .swiper-pagination-bullet-active {
    background: #fff;
    width: 24px;
}
.ban.inban{ padding-bottom: 10px; padding-top: 46%;}
.sbanner{ padding: 0 15px; }
.sbanner img{ width: 100%; }


/*注册*/

.info_list .info_item{
    background-color:#fff;
    padding: 10px 0 5px 70px;
    /*width:98%;
    border-radius:5px;*/
    margin: 0 auto 15px auto;
    position:relative;
    z-index:0;
    min-height:45px;
}
.info_list .info_item>label { font-size:14px;
    display:block;
    width:70px;
    text-align:left;
    position:absolute;
    top:5px;
    left:5px;
    line-height:44px;
    height:44px;
    padding-right:10px;
    color:#000;
    padding-left: 10px;
    background-color: #eee;
    border-radius: 4px;
}
.info_list .info_item .input-text-line,.info_list .info_item select{
    width:100%;
    font-size:14px;
    font-family:"microsoft yahei";
    border:0;
    outline:none;
    height: 34px;
    line-height: 34px;
    text-indent:5px;
    background-color:#eee;
    color:#787878;
    border-radius: 0 4px 4px 0;
    }
   .info_list .info_item select{border-radius: 4px 0 0 4px;background-color: #E6ECF6;color: #242D4E;}
.info_list .info_item input.input-text-line-disabled{padding:0 5px;}
.info_list .info_item span{height:24px;line-height:24px;font-size: 14px;color: #787878;display: inline-block;}
.info_list .info_item span i{ color:#FF9C19;}
.info_list .info_item span.disabled{color:#999;}
.info_list .info_item-more {
    padding:0 0 0 60px;
}
.info_list .info_item-more label {
    width:50px;
    border:0;
}
.info_list .info_item-more .label-content {
}
.info_list .info_item-more .label-cols {
    float:left;
    display:inline-block;
    width:33.3333333%;
    border-left:#ddd 1px solid;
}
.info_list .info_item-more .label-box {
    display:inline-block;
    padding:5px 35px 5px 30px;
    position:relative;
    z-index:0;
}
.info_list .info_item-more .label-box label {
    width:20px;
    border:0;
}
.info_list .info_item-more .label-box .unit {
    display:inline-block;
    position:absolute;
    top:5px;
    right:10px;
    color:#ccc;
    line-height:35px;
    font-size:12px;
}
.shopinfo {background-color: #518eff;
    padding: 5px;
    width: 80%;
    margin: 10px auto;
    border-radius: 10px;
}

.grid-btn { padding: 0; }
.btn {font: 1em bold 'Microsoft YaHei', Arial, Helvetica, sans-serif;width: 100%;height: 2.4em;line-height: 2.4em;border-radius: 100px;cursor: pointer;color: #fff;text-align: center;background: #fdd000;display: block;margin: 1em 0;font-size: 16px;}
.btnred {color: #fff;background: #2E95FF;}
.btnblue { color: #fff; background: #2E95FF; box-shadow: 2px 2px 10px #ddd;}
.btngreen{color: #fff;background: #2E95FF;box-shadow: 2px 2px 10px #ddd;}
.info_item .phone_se{ background-color: #eee; float: left; width: 30%; height: 44px;}




/*申请 集运  步骤*/
.sq_stit{margin-bottom: 10px;display: inline-block;position: relative;padding-left: 12px;}
.sq_stit:before{content: "";position: absolute;width: 4px;height: 4px;background-color: #2E95FF;top: 9px;left: 0;border-radius: 100px;}


/*登录*/
.login_box {
    background: #f6f5f7;
    display: flex;
    align-items: center;
    flex-direction: column;
    font-family: 'Montserrat', sans-serif;
    height: 100vh;
    background: url(../images/login_bg.jpg);
    background-size: 100% 100%;
    justify-content: center;
}

    .login_box h1 {
        font-weight: bold;
        margin: 0;
        font-size: 24px;
    }

    .login_box h2 {
        text-align: center;
    }

    .login_box p {
        font-size: 14px;
        font-weight: 100;
        line-height: 20px;
        letter-spacing: 0.5px;
        margin: 20px 0 30px;
    }

    .login_box span {
        font-size: 12px;
    }

    .login_box a {
        color: #333;
        font-size: 14px;
        /*  text-decoration: none; */
        margin: 15px 12px;
        display: inline-block;
    }

    .login_box button {
        border-radius: 100px;
        border: 1px solid #2e95ff;
        background-color: #2e95ff;
        color: #FFFFFF;
        font-size: 18px;
        font-weight: bold;
        padding: 8px 45px;
        letter-spacing: 1px;
        text-transform: uppercase;
        transition: transform 80ms ease-in;
        width: 100%;
    }
.login_box .zhuce {margin-top: 10px;border: 1px solid #2e95ff;background-color: #fff; color:#2e95ff; }
        .login_box button:active {
            transform: scale(0.95);
        }

        .login_box button:focus {
            outline: none;
        }

        .login_box button.ghost {
            background-color: transparent;
            border-color: #FFFFFF;
        }

    .login_box form {
        background-color: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 20px 34px;
        text-align: center;
    }

    .login_box input {
        background-color: #eee;
        border: none;
        padding: 12px 15px;
        margin: 5px 0;
        width: 100%;
    }

    .login_box .container {
        background-color: #fff;
        border-radius: 10px;
        box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
        position: relative;
        width: 94%;
        min-height: 374px;
    }

    .login_box .form-container {
        position: absolute;
        top: 0;
        transition: all 0.6s ease-in-out;
    }

    .login_box .sign-in-container {
        left: 0;
        width: 100%;
        z-index: 2;
    }

    .login_box .container.right-panel-active .sign-in-container {
        transform: translateX(100%);
    }

    .login_box .sign-up-container {
        left: 0;
        width: 100%;
        opacity: 0;
        z-index: 1;
    }

    .login_box .overlay-container h1 {
        color: #fff;
        font-weight: bold;
        margin: 0;
    }

    .login_box .overlay-container h1 {
        color: #fff;
        font-weight: bold;
        margin: 0;
    }

    .login_box .container.right-panel-active .sign-up-container {
        transform: translateX(100%);
        opacity: 1;
        z-index: 5;
        animation: show 0.6s;
    }

@keyframes show {

    0%, 49.99% {
        opacity: 0;
        z-index: 1;
    }

    50%, 100% {
        opacity: 1;
        z-index: 5;
    }
}

.login_box .overlay-container {
    position: absolute;
    top: 0;
    left: 50%;
    width: 50%;
    height: 100%;
    overflow: hidden;
    transition: transform 0.6s ease-in-out;
    z-index: 100;
}

.login_box .container.right-panel-active .overlay-container {
    transform: translateX(-100%);
}

.login_box .overlay {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0 0;
    color: #FFFFFF;
    position: relative;
    left: -100%;
    height: 100%;
    width: 200%;
    transform: translateX(0);
    transition: transform 0.6s ease-in-out;
}

.login_box .container.right-panel-active .overlay {
    transform: translateX(50%);
}

.login_box .overlay-panel {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 0 40px;
    text-align: center;
    top: 0;
    height: 100%;
    width: 100%;
    transform: translateX(0);
    transition: transform 0.6s ease-in-out;
}

.login_box .overlay-left {
    /* transform: translateX(-20%); */
}

.login_box .container.right-panel-active .overlay-left {
    transform: translateX(0);
}

.login_box .overlay-right {
    right: 0;
    transform: translateX(0);
}

.login_box .container.right-panel-active .overlay-right {
    transform: translateX(20%);
}

.login_box .social-container {
    margin: 9px 0;
}

    .login_box .social-container a {
        border: 1px solid #DDDDDD;
        border-radius: 50%;
        /* display: inline-flex; */
        /* justify-content: center; */
        /* align-items: center; */
        margin: 0 5px;
        height: 33px;
        width: 33px;
        display: inline-block;
        line-height: 40px;
    }

        .login_box .social-container a i {
            font-size: 20px;
            width: 20px;
            height: 20px;
            display: inline-block;
        }


/*忘记密码*/
.yanz_box{width: 100%;position: relative;}
.yanz_box .yanz{position:absolute;right:10px;top: 14px;}
.yanz_box .yanz>a{color:#2E95FF;font-size: 14px; position:relative;padding-left: 13px; margin:0;}
.yanz_box .yanz a:before{ position:absolute; content:""; width:1px;height:16px; background-color:#2E95FF; left:0px; top: 2px;}