@import url(/assets/static/style/element.css);

.el-dialog {
    width: 580px !important;
}
.dialog-title {
    width: 100%;
    height: 60px;
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    color: #000;
}
.container {
    margin-top: 32px;
    padding: 0 58px;
    border-top: 1px solid #F2F2F2;
    position: relative;
}
.verification {
    margin-left: 16px;
}

.verify {
    float: right;
    color: #fff;
}

.verify-input.el-input {
    width: 70%;
}

.verify-mask {
    opacity: 0.5;
}

.el-step__title.is-success {
    color: #0082F0 !important;
}

.el-step__title.is-finish {
    color: #0082F0 !important;
}

.company {
    width: 100%;
    height: 300px;
    padding: 0 58px;
    margin: 0 -58px;
    overflow-y: auto;
    overflow-x: hidden;
}
.loading-container {
    height: 300px;
    line-height: 300px;
    text-align: center;
}
.company-list {
    display: flex;
    height: 68px;
    padding: 16px;
    border: 1px solid #E7E7EB;
    border-radius: 4px;
    position: relative;
    cursor: pointer;
    margin-top: 24px;
}
.default-logo {
    width: 68px;
    height: 68px;
    line-height: 68px;
    text-align: center;
    float: left;
    background-color: #345D8C;
    color: #fff;
    font-size: 40px;
}

.photo {
    width: 68px;
    height: 68px;
    border-radius: 6px;
    float: left;
    object-fit: cover;
}

.company-box {
    width: 70%;
    padding-left: 17px;
    height: 68px;
    float: left;
}
.company-title {
    height: 34px;
    line-height: 34px;
    font-size: 18px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.compnay-add {
    width: 100%;
    height: 20px;
    text-align: center;
    position: absolute;
    top: 40px;
}

.compnay-add .icon {
    font-size: 20px;
    color: #999;
}

.company-txt {
    width: 90px; 
    height: 20px;
    line-height: 20px;
    font-size: 18px;
}

.el-dialog__body {
    padding: 20px !important;
}

.company-qrcode {
  width: 304px;
  height: 250px;
  margin: 74px auto;
  position: relative;
}
.company-login .qrcode-picture {
    width:231px;
    height:227px;
    display: block;
    margin: 20px auto 70px;
}
.company-qrcode .qrcode-picture {
    width:231px;
    height:227px;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
}

.company-qrcode .qrcode-txt {
    width:304px;
    height:16px;
    font-size:16px;
    color:rgba(153,153,153,1);
    position: absolute;
    bottom: 0;
}

.company-login {
    position: relative;
    margin: 60px auto;
}

.company-login .login-icon {
    width: 100%;
    height: 60px;
    font-size: 60px;
    color: #0082F0;
    text-align: center;
}

.company-login .login-txt {
    width: 100%;
    height: 60px;
    font-size: 28px;
    color: #0082f0;
    text-align: center;
    line-height: 60px;
}

.company-login .login-desc {
    width: 100%;
    height: 20px; 
    font-size: 14px;
    color: #999;
    text-align: center;
    line-height: 20px; 
}

.company-btn {
    position: absolute;
    bottom: 0;
}
.el-button--primary {
    background-color: #0082F0 !important;
}
.public-locate {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
}
.dialog-step .is-finish .el-step__line {
    background-color: #3083F3;
}
.default-step .is-finish .el-step__line {
    background-color: #C0C4CC;
}
.dialog-step .is-process {
    color: #3083F3 !important;
}
.dialog-step .is-process .is-text,
.dialog-step .is-finish .is-text {
    background: #3083F3;
    border-color: #3083F3;
    color: #fff;
}
.hide {
    display: none;
}
.lazyload {
    display: block;
}

@media only screen and (max-width: 580px) {
    .el-dialog {
        width: calc(100% - 30px) !important;
    }
    .el-dialog .el-dialog__body .container {
        padding: 0 !important;
    }
}

@media only screen and (max-width: 400px) {
    .verify-input.el-input {
        width: 60%;
    }
}