body, html {
    width: 100%;
    height: 100%
}

.login-page, .page-wrapper {
    width: 100%;
    height: 100%;
    max-width: 10rem;
    margin: 0 auto;
    background-color: #f0f0f0
}

.pwdreset-wrapper {
    background-color: #fff
}

.page-header {
    width: 10rem;
    height: 2rem;
    margin: 0 auto;
    overflow: hidden;
    background: #fff;
}

    .page-header img {
        height: .9rem;
        width: 4.2rem;
        margin: 0 auto;
        margin-left: 2.7rem;
        margin-top: .8rem;
    }

.page-container {
    width: 100%;
    background-color: #fff
}

    .page-container .form-wrapper {
        width: 7.866667rem;
        margin: 0 auto;
        list-style-type: none;
        padding: .133333rem 0
    }

        .page-container .form-wrapper.register-form {
            padding-top: .666667rem
        }

        .page-container .form-wrapper li {
            width: 100%;
            height: 1.066667rem;
            margin-top: .4rem;
            color: #505050
        }

            .page-container .form-wrapper li.no-margin {
                margin-top: 0
            }

            .page-container .form-wrapper li .forget {
                margin-left: 6rem
            }

            .page-container .form-wrapper li input {
                width: 100%;
                height: 1.066667rem;
                line-height: 1.066667rem;
                text-indent: .373333rem;
                border: none;
                -webkit-appearance: none;
                outline: none;
                border-bottom: 1px solid #dcdcdc
            }

[data-dpr="1"] .page-container .form-wrapper li input {
    font-size: 15px
}

[data-dpr="2"] .page-container .form-wrapper li input {
    font-size: 30px
}

[data-dpr="3"] .page-container .form-wrapper li input {
    font-size: 45px
}

.page-container .form-wrapper li input:focus {
    border-bottom-color: #e33325
}

.page-container .form-wrapper li input.txt-imgcode, .page-container .form-wrapper li input.txt-msgcode {
    float: left;
    width: 4.533333rem
}

.page-container .form-wrapper li a {
    display: inline-block;
    color: #3c78c8;
    line-height: 1.066667rem
}

[data-dpr="1"] .page-container .form-wrapper li a {
    font-size: 12px
}

[data-dpr="2"] .page-container .form-wrapper li a {
    font-size: 24px
}

[data-dpr="3"] .page-container .form-wrapper li a {
    font-size: 36px
}

.page-container .form-wrapper li a.account-login, .page-container .form-wrapper li a.fast-login, .page-container .form-wrapper li a.forget-password {
    float: right
}

.page-container .form-wrapper li a.voice-password {
    text-decoration: underline
}

.page-container .form-wrapper li a.btn {
    width: 100%;
    height: 1.066667rem;
    color: #fff;
    text-align: center;
    border-radius: .066667rem
}

[data-dpr="1"] .page-container .form-wrapper li a.btn {
    font-size: 15px
}

[data-dpr="2"] .page-container .form-wrapper li a.btn {
    font-size: 30px
}

[data-dpr="3"] .page-container .form-wrapper li a.btn {
    font-size: 45px
}

.page-container .form-wrapper li a.btn-login, .page-container .form-wrapper li a.btn-nextstep, .page-container .form-wrapper li a.btn-register {
    background-color: #e33325
}

.page-container .form-wrapper li a.btn-enroll {
    color: #fff;
    background-color: #ed7689
}

.page-container .form-wrapper li a.btn-reg {
    background-color: #79a2d9
}

.page-container .form-wrapper li a.btn-msgcode {
    float: right;
    width: 3.2rem;
    height: 1.066667rem;
    text-align: center;
    color: #fff;
    background-color: #caa5a5;
    border-radius: .066667rem
}

.page-container .form-wrapper li a.imgcode {
    float: right;
    width: 3.173333rem;
    height: 1.04rem;
    border: .013333rem solid #dcdcdc;
    overflow: hidden
}

    .page-container .form-wrapper li a.imgcode img {
        width: 100%
    }

.page-container .form-wrapper li span {
    display: inline-block;
    color: #323232;
    line-height: 1.066667rem
}

[data-dpr="1"] .page-container .form-wrapper li span {
    font-size: 12px
}

[data-dpr="2"] .page-container .form-wrapper li span {
    font-size: 24px
}

[data-dpr="3"] .page-container .form-wrapper li span {
    font-size: 36px
}

.page-container .form-wrapper li span.auto-login {
    float: left;
    padding-left: .746667rem;
    cursor: pointer;
    background-image: url(../imgs/icons/icon_rect_ckbox.png);
    background-repeat: no-repeat;
    background-size: .533333rem .533333rem;
    background-position: 0
}

    .page-container .form-wrapper li span.auto-login.checked {
        background-image: url(../imgs/icons/icon_rect_ckbox_checked.png)
    }

.page-container .form-wrapper li span.account-login, .page-container .form-wrapper li span.tip {
    float: right
}

.page-footer {
    width: 100%;
    border-top: 1px solid #303242
}

    .page-footer .wechat-login {
        width: 1.2rem;
        margin: 0 auto;
        padding-top: .4rem
    }

        .page-footer .wechat-login .img {
            display: block;
            width: 1.2rem;
            height: 1.2rem;
            border-radius: 50%;
            overflow: hidden
        }

            .page-footer .wechat-login .img img {
                width: 100%
            }

        .page-footer .wechat-login .text {
            padding-top: .213333rem;
            text-align: center;
            color: #303242
        }

[data-dpr="1"] .page-footer .wechat-login .text {
    font-size: 10px
}

[data-dpr="2"] .page-footer .wechat-login .text {
    font-size: 20px
}

[data-dpr="3"] .page-footer .wechat-login .text {
    font-size: 30px
}
.close {
    width: 100%;
    height: 3.2rem;
    background: #fff;
    line-height: 3.2rem;
}

    .close span {
        width: 8rem;
        display: block;
        padding-top: 0.15rem;
        float: left;
        text-align: left;
        height: 1.066667rem;
        line-height: 1.066667rem;
    }

    .close a {
        color: #fe4320;
    }

    .close p:first-of-type {
        width: 10%;
        display: block;
        height: 1.066667rem;
        background: url(http://m.joyincake.com/incake/assets/imgs/shopping-cart/no-like.png) no-repeat;
        background-size: 0.546667rem 0.546667rem;
        background-position: 0.166667rem 0.3933333rem;
        text-align: left;
        float: left;
        margin-left: 0.5rem;
    }

    .close p.xactive {
        background: url(http://m.joyincake.com/incake/assets/imgs/shopping-cart/like.png) no-repeat;
        background-size: 0.546667rem 0.546667rem;
        background-position: 0.166667rem 0.3933333rem;
        text-align: left;
        float: left;
    }