*{
	margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}
body {
	font-size: 12px;
    height: 100%;
    overflow: hidden;
    font-family: -apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Segoe UI,Arial,PingFang SC,Hiragino Sans GB,Microsoft Yahei,STHeiti,SimSun,sans-serif;
    /*
    background-image: url(https://preview.keenthemes.com/metronic8/demo1/assets/media/auth/bg6.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    */
}
button, input {
    overflow: visible;
}
button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}
.account {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    
    background-color: #e7f6fd;
    background-position: center center;
    background-repeat: no-repeat;

}
.account:before {
    content: "";
    position: absolute;
    bottom: -75px;
    left: -75px;
    width: 508px;
    height: 300px;
    background-image: url(../img/circle2.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    animation: trantale1 6s 3s linear infinite forwards;
}
.account:after {
    content: "";
    position: absolute;
    top: 0;
    right: calc((50% - 600px) / 5);
    width: 544px;
    height: 544px;
    background-image: url("../img/ring.png");
    background-repeat: no-repeat;
    background-size: 100% auto;
    animation: trantale1 10s linear infinite;
}
@keyframes trantale1 {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    25% {
        transform: translate(-40px, -40px);
    }

    50% {
        transform: translate(60px, -60px);
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@-webkit-keyframes trantale2 {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    25% {
        transform: translate(-0.8rem, -0.8rem);
    }

    50% {
        transform: translate(1rem, 1rem);
    }

    75% {
        transform: translate(0.8rem, 0.8rem);
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@keyframes trantale2 {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    25% {
        transform: translate(-0.8rem, -0.8rem);
    }

    50% {
        transform: translate(1rem, 1rem);
    }

    75% {
        transform: translate(0.8rem, 0.8rem);
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@keyframes trantale3 {
    form {
        -webkit-transform-origin: 40%;
        transform-origin: 40%;
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    to {
        -webkit-transform-origin: 40%;
        transform-origin: 40%;
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.account__logo {
    position: absolute;
    top: 24px;
    left: 40px;
    width: 154px;
    height: 30px;
    background: url(https://img.timi.red/def/l-3.png) no-repeat;
    background-size: 154px 30px;
}
.subname {
    text-align: center;
    color: #262626;
    margin-bottom: 35px;
    font-size: 12px;
    letter-spacing: 5px;
     position: absolute;
    top: 60px;
    left: 42px;
}
.subname span:first-child {
    margin-right: 10px;
}
.account__container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: absolute;
    width: 480px;z-index: 1;
    top: 45%;
    height:500px;
    left: 50%;
    transform: translate(-50%,-50%);
}
.account__container__left {
    width: 100%;
    border-radius: 1.5rem;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0,0,0,.1), 0 12px 20px rgba(38,38,38,.12);
}
.login-container {
    position: relative;
    padding: 50px 56px 60px;
}
.switch-type {
    position: absolute;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    right: 0;
    top: 0;
    height: 80px;
}
.switch-type>p {
    position: relative;
    padding: 4px 8px;
    border-radius: 2px;
    font-size: 14px;
    color: #155bd4;
    cursor: pointer;
}
.switch-type>p, .switch-type>p:after {
    background: #edf4ff;
    border: 1px solid #155bd4;
}
.switch-type>p:after {
    content: "";
    position: absolute;
    top: 50%;
    right: -3px;
    transform: translateY(-50%) rotate(45deg);
    width: 4px;
    height: 4px;
    border-left: 0;
    border-bottom: 0;
}
.switch-type>img {
    width: 80px;
    height: 80px;
    cursor: pointer;
}
.login-container__header {
    align-items: baseline;
}
.login-container__header .subtip {
    font-size: 13px;
    color: #99a1b7;
}
.maintitle{
    font-size: 20px;
    color: #969799;
    font-size: 26px;
    color: #323233;
    margin-bottom: 0.75rem !important;
}
.zent-form {
    margin-bottom: 30px;
    width: auto;
}
.account-input {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    padding-top: 3rem;
}
.account-input__input {
    position: relative;
    -ms-flex: 1;
    flex: 1;
    height: 48px!important;
    max-height: 48px;
    border: 0!important;
    outline: 0;
    box-sizing: border-box;
    box-shadow: none!important;
    border-radius: 0!important;
}
.zent-input-wrapper{
    background-color: #fff;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
    -ms-flex-align: center;
    align-items: center;
}
.account-input__input .zent-input {
    padding: 0!important;
    border: 0!important;
    font-size: 16px!important;
    color: #323232!important;
    border-bottom: 1px solid #dcdee0!important;
}
.zent-input, .zent-input[type=color], .zent-input[type=date], .zent-input[type=datetime], .zent-input[type=email], .zent-input[type=month], .zent-input[type=number], .zent-input[type=password], .zent-input[type=search], .zent-input[type=tel], .zent-input[type=text], .zent-input[type=time], .zent-input[type=url], .zent-input[type=week], .zent-textarea {
    color: #323233;
    display: inline-block;
    -ms-flex: 1;
    flex: 1;
    min-width: 80px;
    height: 100%;
    box-sizing: border-box;
    padding: 0 10px;
    margin: 0;
    font-size: 14px;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    border: 0;
}
.account-password {
    position: relative;
    margin-top: 32px;
}
.account-password__input .zent-input {
    padding: 0!important;
    border: 0!important;
    outline: none!important;
    box-shadow: none!important;
    font-size: 16px!important;
    border-radius: 0;
    border-bottom: 1px solid #dcdee0!important;
    height: 48px;
}
.account-password__icon {
    position: absolute;
    width: 30px;
    height: 30px;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-size: 18px auto;
    background-repeat: no-repeat;
    background-position: 50%;
    cursor: pointer;
    opacity: 0;
    transition: opacity .3s;
    z-index: 100;
}
.login-container__auto {
    color: #323232;
    margin-top: 68px;
}
.login-container__btn {
    margin: 16px 0;
    height: 46px!important;
    line-height: 46px!important;
    font-size: 18px!important;
    background-color: #dcdee0;
    border-color: #dcdee0;
    display: inline-block;
    height: 32px;
    line-height: 30px;
    font-size: 14px;
    padding: 0 16px;
    font-family: inherit;
    border-width: 1px;
    border-style: solid;
    text-align: center;
    vertical-align: middle;
    box-sizing: border-box;
    cursor: pointer;
    transition: all .3s;
    width: 100%;
    color: #fff;
    border-radius: 25px;
}
.login-container__btn.active{
    background-color: rgb(78, 128, 245);
    box-shadow: rgba(79, 139, 243, 0.3) 0px 4px 10px 0px;
}
.login-container__btn.active:hover{
    background-color: #4476eb;
    box-shadow: rgba(79, 139, 243, 0.3) 0px 4px 10px 0px;
}
.login-container__links__actions {
    font-size: 14px;
    float: right;
    margin-top:5px;
}
.login-container__links a {
    color: #5f7ab8;
}
.login-container__links__actions>span {
    padding: 0 13px;
    color: #ebedf0;
}
.login-qrcode {
    position: relative;
    height: 520px;
    padding: 50px 56px 60px;
    box-sizing: border-box;
}
.login-qrcode__title {
    font-weight: 500;
    font-size: 26px;
    color: #323233;
}
.login-qrcode__container {
    width: 160px;
    height: 160px;
    margin: 60px auto 40px;
}
.login-qrcode__container__qrcode {
    position: relative;
    box-sizing: border-box;
    width: 160px;
    height: 160px;
    padding: 7px;
    margin: 0 auto;
    border: 1px solid #e5e5e5;
    transition: transform .3s;
}
.login-qrcode__container__qrcode>img {
    display: block;
    width: 100%;
}
.login-qrcode__container__banner {
    position: absolute;
    width: 160px;
    right: 91px;
    top: 147px;
    opacity: 0;
    transition: opacity .3s;
}
.login-qrcode__footer {
    position: relative;
    font-size: 16px;
    color: #323233;
    text-align: center;
}
.login-qrcode__footer__flex {
    margin-top: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
}
.login-qrcode__footer__flex .app-item {
    margin: 0 16px;
    font-size: 12px;
    color: #155bd4;
    cursor: pointer;
}
.login-qrcode__footer__flex .app-item>img {
    display: block;
    height: 32px;
    width: 32px;
    margin: 0 auto 6px;
}

.login-qrcode__register {
    position: absolute;
    right: 56px;
    bottom: 60px;
    font-size: 14px;
    color: #155bd4;
}

.tm-pop{
	width: 180px;
    font-size: 14px;
    color: #323233;
    text-align: center;
    border: 1px solid #e5e5e5;
    padding-bottom: 10px;
    padding-top: 10px;
    position: absolute;
    top: -205px;
    background: #fff;
    margin-left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
    box-shadow: 0 1px 5px rgb(38 38 38 / 10%);
}
.tm-pop:after {
    background: #fff;
    border: 1px solid #e5e5e5;
}
.tm-pop:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translateY(-50%) rotate(45deg);
    width: 10px;
    height: 10px;
    border-left: 0px;
    border-top: 0px;
}

.tm-pop img{display:block;width:148px;height:148px;margin:auto auto;}
.tm-pop p{padding-top:8px;}


.pweye{
    align-items: center;
    cursor: pointer;
    color: #8c8c8c;
    position: absolute;
    top: 0px;
    right: 0px;
    line-height: 40px;
    background: transparent;
    font-size: 18px;
}
.shop-list{
    position: relative;
    margin-top: 5px;
    position: relative;
    height: 320px;
    overflow: auto;
    overflow-y: auto;
}
.shop-list .shop{
    padding: 0 2px;
    transition: box-shadow .2s;
    height: 44px;line-height:42px;
    position: relative;
    font-size: 14px;cursor: pointer;
    transition:background-color 0.3s ease;
}
.shop-list h4{
	font-weight: 700;
	font-size:13px;
	color:#8c8c8c;
}
.shop-list .shop:hover{
	background-color: #F2FBFF;
}
.shop-list .shop font{
	position: absolute;right:10px;top:0px;color:#348FE4;font-size:12px;display: none;
}
.shop-list .shop:hover font{
	display: block;
}
.shop-list .shop span{
	display: inline-block;    color: #333;
}
.shop-list .shop span.info{
	background: #F3F6F9;
    color: #3698FE;
	height: 20px;
    line-height: 20px;
    font-size: 13px;border-radius: 3px;
    text-align:center;
    margin-right:10px;padding:0 7px;
}
a.rleft{
    display: -moz-box;
    display: -ms-flexbox;
    display: inline-flex;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-size: 18px;
    color: rgba(0,0,0,.3);
    margin-bottom: -4px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    margin-right: 16px;
    border: 2px solid #efefef;
    -webkit-transition: 218ms;
    -o-transition: 218ms;
    transition: 218ms;
}
a.rleft:hover{
	color: #1b9aee;
	background-color: #F7F7F7;
	border: 2px solid #ACACAC;
}

.footer {
    width: 100vw;
    bottom: 40px;
}
.footer {
    text-align: center;
    position: fixed;
    color: #999;
    width: 100%;
    bottom:5px;
    left: 0;
    margin-top: 50px;
}
.footer .copyright {
    line-height: 12px;
}
.footer .copyright a {
    color: #999;
}
/*
@media screen and (min-width:900px) {
    .account__container {
    	margin-right: 5rem !important;
	}
}

@media screen and (min-width:1024px) {
    .account__container {
    	margin-right: 5rem !important;
	}
}
@media screen and (min-width:1324px) {
    .account__container {
    	margin-right: 28rem !important;
	}
}
*/