@charset "utf-8";
@import url("base.css");/* 重置&常用样式 */
@import url("fonts/custom.css"); /* 字体 */

/* 全局变量 */
:root{
   --max-width: 1400;
   --default-color__rgb: 34,34,34; /*#222*/
   --default-color: rgba(var(--default-color__rgb), 1);
   --default-color_333__rgb: 51,51,51; /*#33*/
   --default-color_333: rgba(var(--default-color_333__rgb), 1);
   --default-color_666__rgb: 102,102,102; /*#666*/
   --default-color_666: rgba(var(--default-color_666__rgb), 1);
   --primary-color__rgb: 39, 80, 215; /*#2750d7*/
   --primary-color: rgba(var(--primary-color__rgb), 1);
   --f-family: 'hm', sans-serif;
   --main_line_height: 1;
   --button_height: 0.4rem;
   --transition: 0.3s;
   --header-height:1rem;
   --el-font-size-base: var(--font-size__16);

   --el-text-color-regular:var(--default-color);
   --el-color-primary: var(--primary-color);
}

/* 比例要求 */
/*基于屏幕尺寸自适应字体大小*/
/*超过1920px时，继续按比例增长*/
html{font-size: calc(100 / 1920 * 100vw);}
.container {max-width: calc(var(--max-width) / 100 * 1rem);}
@media (min-width:1400px) and (max-width: 1920px) {
   html{font-size: 100px;} 
}
@media (max-width: 1400px) {
   html:not(.view){font-size: calc(100 / 1400 * 100vw);}
   html:not(.view).isMac{font-size: calc(100 / 1000 * 100vw);}
}
@media (max-width: 480px) {
   html:not(.view){font-size: calc(100 / 520 * 100vw);}
}

body{font-size: var(--font-size__16); font-family:var(--f-family); line-height:  var(--main_line_height); color: var(--black-color);}

/* Start
   ========================================================================== */
footer{color: #bac0cb;font-size: var(--font-size__14); line-height: calc(22 / 14); padding: var(--pm__40) 0;}
.login-reg{min-height: 100vh; background: linear-gradient(180deg, var(--primary-color) 0%,#f2f5fa 98%);}
.login-reg .flex-inner{min-height: 100vh;}
.login-reg .flex-inner footer{flex-shrink: 0;}
.login-reg .flex-inside{flex: 1;} 
[data-samebox]{width: 95%;background-color:var(--white-color); border-radius: 0.2rem;padding:var(--pm__60) var(--pm__80);}
.login-box{max-width: 6rem;}
.reg-box{max-width: 10rem;}
.login-title{margin-bottom:calc(var(--pm__40) - 0.02rem);}
.login-title h3{margin: 0; font-size: var(--font-size__36); line-height: calc(44 / 36); font-weight: var(--font-weight__m);}
.login-title h3 .logotxt{ margin-left: 0.2em;}
.login-title .logotxt{color: var(--primary-color);font-size: var(--font-size__42);}
.login-title[data-flex] .en-desc{margin-top: 0.1rem;}
.login-title h3 span{display: inline-block; position: relative;}
.login-title h3 span:before{position: absolute; content: '';width: 100%;height: 0.04rem; background-color: var(--primary-color); left: 0; bottom: 0;}
.login-title .en-desc{color: #bac0cb;}

.login-form{--el-form-label-font-size:var(--font-size__16);}
.el-input{--el-input-inner-height:0.5rem;--el-input-border-radius:0.04rem;--el-input-bg-color:#f5f6f8;--el-input-border-color:transparent;--el-input-placeholder-color:#bac0cb;--el-input-focus-border:var(--primary-color);--el-input-focus-border-color:var(--primary-color);}
.el-form-item{--font-size:var(--font-size__16);}
.el-form-item__label{line-height:0.5rem;height:0.5rem;}
.login-form .el-form-item{position: relative;z-index: 1;}
.login-form .el-form-item.w35{width: 32%;}
.login-form .el-form-item.w30{width: 36%;}
.login-form .forgot{position: absolute;right: 0; bottom: 100%;color: #bac0cb;}
.login-form .form-btn{width: 100%;}
.login-form .extra{color: #bac0cb;}
.login-form .extra a{color: var(--primary-color);text-decoration: underline;}
.login-form .get-code{width: 100%;}
.login-form .get-code .img-code{position: absolute;right: 0.03rem;top: 0.03rem;width: 1.2rem;height: 0.44rem;border-radius: 0.02rem;}
.login-form [data-items]{--itemmr:0.2rem;--itemnum:2;}
.login-form [data-items] .full{width: 100%;}
.reg-main{padding-top: var(--pm__60);}

#header{color: var(--white-color); padding: 0 var(--pm__40);height: 0.8rem; background-color:var(--primary-color);}
#header .logo{font-family:'almmsht';font-size: var(--font-size__28);}
#header .user{position: relative;z-index: 50;flex-shrink: 0; padding: 0.1rem 0;}
#header .info img{	width: 0.41rem;height: 0.41rem;border-radius: 50%; margin-right: 0.07rem;}
#header .info span{font-weight: var(--font-weight__m);display: flex;align-items: center;}
#header .info span:after{display: block; content: '';width: 0.09rem; height: 0.06rem; margin-left: 0.08rem; background: url(../images/select.svg) var(--bg-contain);filter: brightness(0) invert(1); transition: 0.3s;}
#header .user:hover .info span:after{transform: rotate(180deg);}
.drop-menu{position: absolute; top: 100%;width: max-content;left: 50%;transform: translateX(-50%) translateY(0.2rem);background-color: var(--white-color);box-shadow: 0 0 0.1rem rgba(var(--black-color__rgb), 0.08);border-radius: 0.04rem;opacity: 0; visibility: hidden; transition: 0.3s;}
#header .user:hover .drop-menu{opacity: 1; visibility: visible; transform: translateX(-50%)  translateY(0);}
.drop-menu::before{position: absolute; content: '';top: -0.04rem; left: 50%;transform: translateX(-50%) rotate(45deg);width: 0.12rem;height: 0.12rem;border-radius: 0.04rem; background-color: var(--white-color);}
.drop-menu a{color: var(--default-color);display: flex;align-items: center; padding: 1em;}
.drop-menu a:before{display: block; content: '';width: 0.17rem;height: 0.16rem; margin-right: 0.05rem; background: url(../images/logout.svg) var(--bg-contain);}
.drop-menu a:hover{color: var(--primary-color);}

.page-menu{background-color: #f5f6f8;}
.page-menu li:not(:last-child){border-right: 1px solid rgba(var(--primary-color__rgb), 0.1); padding-right: var(--pm__50);margin-right: var(--pm__50);}
.page-menu li a{height: 1rem;font-size: var(--font-size__24);font-weight: var(--font-weight__m); border-bottom: 2px solid transparent;}
.page-menu li.aon a{border-bottom-color: var(--primary-color);}
.page-menu li a:before{display: block;content: '';width: 0.24rem; height: 0.23rem; margin-right: 0.09rem;background: var(--bg-contain);}
.page-menu li a.account:before{background-image: url(../images/m-ico1.svg);}
.page-menu li a.store:before{background-image: url(../images/m-ico2.svg);}
.page-menu li a.mem:before{background-image: url(../images/m-ico3.svg);}

.account-form{--max-width:584;min-height:calc(100vh - var(--pm__40) * 2 - 1.8rem - 3em);padding-top: calc(120 / 960 * 100vh);}
.account-form .change-password{position: absolute;right: 0.2rem;top: 0;display: flex;align-items: center;height: 100%;color: var(--primary-color);}
.el-dialog{--el-border-radius-base: 0.2rem; overflow: hidden;}
.el-dialog__header{text-align: center;padding: var(--pm__50) 0 var(--pm__40) 0;}
.el-dialog__title{font-size: var(--font-size__36);font-weight: var(--font-weight__m);}
.el-dialog__headerbtn{background-color: #f5f6f8;border-radius: 50%;width: 0.6rem; height: 0.6rem;display: flex;align-items: center;justify-content: center;padding: 0.15rem 0.15rem 0 0;right: -0.15rem;top: -0.15rem; --el-color-info: #666;}
.change-password-form{max-width: 4.1rem;margin: 0 auto; padding-bottom: 0.26rem;}
a.get-code-button{position: absolute;right: 0.05rem;z-index: 10;top: 0.05rem;bottom: 0.05rem;display: flex;align-items: center; background-color:var(--primary-color);color: var(--white-color);padding: 0 0.1rem;border-radius: 0.04rem;}
a.get-code-button.disabled{cursor: default;background-color: #999;}

.store-form{padding: var(--pm__100) 0; --el-disabled-text-color:var(--default-color);}
#store-app{--max-width:620;}
.store-form .el-input{--el-input-bg-color:var(--white-color); --el-input-border-color:#e5e5e5;}
.store-form .out-time-tips{position: absolute; left: 7em; top: 50%;margin-top: -0.5em;color: #bac0cb;line-height: 1;z-index: 4;}
.store-form .el-cascader{display: block;}
.store-form .el-form-item{margin-bottom: var(--pm__30);}
.store-form .tips{width: 100%;color: #bac0cb;}
.store-form .tips a{color: var(--primary-color);}
#edit-add-member-app{padding-top: var(--pm__50);}
#edit-add-member-app .el-form{max-width: 6.2rem;}

.select-groups{margin-bottom: var(--pm__30); width: 100%;}
.select-groups .el-select{width: calc((100% - 0.2rem) / 3);}
.el-select__wrapper{line-height: calc(24 / 16); min-height: 0.5rem;padding: 0.13rem 11px; font-size: var(--font-size__16);}

.popup-title{font-size: var(--font-size__24);font-weight: var(--font-weight__m);}
.edit-con{line-height: calc(30 / 16);text-align: justify;max-width: 7.52rem; margin: 0 auto;font-size: var(--font-size__16); padding-bottom: var(--pm__30);}

.member-list{padding-top: var(--pm__40);}
.group-title{border-bottom: 1px solid rgba(var(--black-color__rgb), 0.1); padding-bottom: var(--pm__20); margin-bottom: var(--pm__20);}
#edit-add-member-app .group-title{margin-bottom: var(--pm__60);}
.group-title .tit{font-size: var(--font-size__24);font-weight: var(--font-weight__m);}
.group-title .total{color: #949aa5; margin-left: 0.19rem;}
.member-list .list-items:not(:last-child){margin-bottom: var(--pm__30);}
.member-grid{--itemmr:0.4rem;--itemnum:2;}
.member-grid li{margin-bottom: var(--pm__20);}
.member-grid .card-inner{padding: var(--pm__20);position: relative;z-index: 1;background-color: #f5f6f8;height: 100%;}
.member-grid .actions{position: absolute;right: var(--pm__20);top: var(--pm__20);opacity: 0; transition: 0.3s;}
.member-grid .card-inner:hover .actions{opacity: 1;}
.member-grid .actions a{display: flex;align-items: center;color: #949aa5;}
.member-grid .actions a + a{margin-left: 0.24rem;}
.member-grid .actions a:before{display: block;content: ''; width: 0.15rem; height: 0.16rem; background: var(--bg-contain); margin-right: 0.06rem;}
.member-grid .actions a.edit:before{background-image: url(../images/edit.svg);}
.member-grid .actions a.delete:before{background-image: url(../images/delete.svg);}
.member-grid .actions a:hover{color: var(--primary-color);}
.member-grid .actions a.edit:hover:before{background-image: url(../images/edit-on.svg);}
.member-grid .actions a.delete:hover:before{background-image: url(../images/delete-on.svg);}
.member-card .avatar{width: 0.9rem;flex-shrink: 0;}
.member-card .avatar img{height: 0.9rem;display: block;width: 100%;border-radius: 50%;object-fit: cover;}
.member-card .info{flex:1;margin-left: var(--pm__20);color: #949aa5; padding-top: 0.15rem;}
.member-card .name{font-size: var(--font-size__18);font-weight: var(--font-weight__m);color: var(--default-color);}
.member-card .role{margin: 0.1rem 0 0.14rem 0;}
.member-card .intro{line-height: calc(26 / 16);}
.member-card .intro + .certs{margin-top: 0.1rem;}
.member-card .certs a{border-radius: 0.04rem; border: solid 0.01rem rgba(var(--primary-color__rgb), 0.2);  line-height: calc(30 / 14); font-size: var(--font-size__14);color: var(--primary-color);display: flex;align-items: center;margin-right: 0.05rem;margin-bottom: 0.05rem; padding: 0 0.08rem; transition: 0.3s;}
.member-card .certs a::before{display: block; content: ''; margin-right: 0.05rem;width: 1em;height: 1em; background: url(../images/cer.svg) var(--bg-contain);}
.member-card .certs a:hover{background-color: var(--primary-color);color: var(--white-color);}
.member-card .certs a:hover:before{filter: brightness(0) invert(1);}

.shop-assistant .member-grid{--itemnum:3;}
.shop-assistant .card-inner{align-items: center;}
/* .shop-assistant .actions{flex-direction: column;display: flex; height: 100%;justify-content: center; top: 0;}
.shop-assistant .actions a + a{margin-left: 0; margin-top: 0.2rem;} */
.shop-assistant .member-card .intro,
.shop-assistant .member-card .certs{display: none;}

.single-uploader .add{width: 1.5rem;height: 1.5rem;background: #f5f6f8 url(../images/add.svg) no-repeat center center;background-size: auto 0.3rem;border-radius: 0.04rem;border: solid 0.01rem #e5e5e5;display: block;cursor: pointer;}
.single-uploader img{width: 1.5rem;height: 1.5rem;object-fit: contain;background: #f5f6f8;}
.single-uploader-inner{position: relative;z-index: 1;}
.uploader-overlay{opacity: 0;transition: 0.3s; background: rgba(var(--black-color__rgb), 0.5);}
.uploader-overlay a{display: block;width: 0.2rem;height: 0.2rem;background: var(--bg-contain);}
.uploader-overlay a.remove{background-image: url(../images/delete-on.svg); filter: brightness(0) invert(1);}
.single-uploader:hover .uploader-overlay{opacity: 1;}

.env-uploader .el-upload--picture-card{background-color: #f5f6f8;}
.env-uploader .el-upload--picture-card{border-style: solid;border-radius: 0.04rem;border-color: #e5e5e5;}
.env-uploader .el-upload--picture-card>i{font-size: 0;background: url(../images/add.svg) var(--bg-contain);width: 0.3rem; height: 0.3rem;}
.env-uploader .el-upload-list__item-status-label,
.env-uploader .el-upload-list--picture-card .el-upload-list__item-preview{display: none!important;}
.env-uploader .el-upload-list--picture-card .el-upload-list__item-actions span + span{margin: 0;}

.cert-box{width: 100%;}
.cert-box .list{border-radius: 0.04rem; border: solid 0.01rem #e5e5e5; position: relative;z-index:1;--n:1;padding: 0.18rem;}
.cert-box .list:not(:first-child){margin-top: 0.2rem;}
.cert-box .list .item:not(:last-child){margin-bottom: 0.2rem;}
.cert-box .add-area.abs{position: absolute;left:100%; bottom: 0; height: calc(100% / var(--n));padding: 0 0.15rem;width: max-content;}
.cert-box .add-area .add{display: block;width: 0.24rem; height: 0.24rem; background-color: #f5f6f8; border-radius: 0.04rem; border: solid 0.01rem #e5e5e5; font-weight: var(--font-weight__m);display: flex;align-items: center;justify-content: center;}
.cert-box .delete{position: absolute;width: 0.2rem; height: 0.2rem;  bottom: 0.12rem;right: 0.12rem;background: url(../images/delete.svg) var(--bg-contain);}
.cert-box .delete:hover{background-image: url(../images/delete-on.svg);}
.cert-box .item .label-name{flex-shrink: 0;width: 5em; line-height: 0.5rem;}
.cert-box .item .right{flex: 1;}





.ico-upload {
    background-image: url(../images/icon-upload.png);
}

.ico-file {
    background-image: url(../images/icon-file.png);
}

.uploadbox .el-upload {
    display: block;
}

.el-upload-dragger {
    width: auto;
    height: auto;
    border: none;
    padding:0px !important;
}

.uploaderInner {
    height: 2.4rem;
    min-height: 200px;
    padding: 0.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    border: 1px dashed #c9def4;
    border-radius: 4px;
    background: #fbfcfe;
}

    .uploaderInner .ico-upload {
        display: inline-block;
        width: 40px;
        height: 40px;
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        margin-bottom: 10px;
    }

    .uploaderInner .tip {
        color: #707983;
        line-height: 1.5;
    }

    .uploaderInner .del {
        cursor: pointer;
        color: #0068ce;
        font-size: 0.2rem;
    }


.uploadbox2 {
    display: flex;
/*    align-items: flex-end;*/
    align-items: left;
    flex-flow: column;
}

    .uploadbox2 .box {
        width: 1.4rem;
        /*        height: 1.4rem;*/
        border: 1px dashed #ccc;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        margin-right: 10px;
        overflow: hidden;
    }
    .uploadbox2 .box1 {
        width: 1.4rem;
        /*        height: 1.4rem;*/
        border: 1px dashed #ccc;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        margin-right: 10px;
        overflow: hidden;
        width: 100%;
    }

    .uploadbox2 .img img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        margin-right: 10px;
    }

    .uploadbox2 .tip {
        color: #707983;
        flex: 1 0 auto;
    }