body.login {
    height: 100vh;
    width: 100vw;
}

/*********************注册***********************/
.header {
    height: 110px;
    background: url(../images/headbg.jpg) repeat-x left bottom;
}
.top {
	width: 1000px;
	margin: 0 auto;
}
.top img {
	float: left;
	height: 50px;
	margin-top: 24px;
}
.top span {
	float: left;
	height: 34px;
    line-height: 34px;
    margin-left: 20px;
    font-size: 24px;
    /* color: #333; */
    margin-top: 34px;
}
.header .have-account {
    font-size: 16px;
    float: right;
    margin-top: 55px;
    /* color: #999; */
}
.header .have-account a {
    /* color: #53b6ed; */
}
.header .have-account a:hover {
    /* color: #3696cc; */
    text-decoration: underline;
}

.ui-mask {
	position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 0.15;
    z-index: 9998;
    /* background-color: rgb(0, 0, 0); */
}
.ui-dialog {
	width: 950px;
	height: 600px;
    position: fixed;
    z-index: 10000;
    display: block;
    overflow: hidden;
    top: 50%;
    left: 50%;
    margin-left: -475px;
    margin-top: -300px;
    border: 4px solid rgba(0,0,0,.1);
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0 3px 10px #ccc;
}
.ui-dialog-title {
	padding: 0 10px;
    height: 31px;
    line-height: 31px;
    /* background: #f3f3f3; */
    font-size: 14px;
    font-family: "Microsoft YaHei";
    /* color: #000; */
    font-weight: 700;
}
.ui-dialog-close {
    cursor: pointer;
    display: block;
    position: absolute;
    z-index: 100000;
    top: 0;
    right: 10px;
    overflow: hidden;
    font-size: 0;
    /* color: #666; */
}
.ui-dialog-close i { font-size: 22px;}
/* .ui-dialog-close:hover { color: #000;} */
.ui-dialog-content {
	height: 549px;
    padding: 10px;
    overflow: auto;
    /* background: #fff; */
}
.protocol-con {
    height: 426px;
    padding: 10px;
    line-height: 20px;
    overflow-x: hidden;
    overflow-y: auto;
    margin-bottom: 25px;
}
.protocol-button { text-align: center;}
.protocol-button a {
	display: inline-block;
    width: 200px;
    height: 54px;
    line-height: 54px;
    /* color: #999; */
    vertical-align: middle;
    margin-right: 30px;
    /* background: #e3e4e5; */
    font-size: 16px;
}
.protocol-button button {
	margin: 0 auto;
    display: block;
    width: 400px;
    height: 54px;
    /* color: #fff;
    background: #53b6ed; */
    border: 0;
    font-size: 16px;
    font-family: "Microsoft YaHei","Hiragino Sans GB";
    display: inline-block;
    width: 200px;
    vertical-align: middle;
}
.protocol-button a:hover,.protocol-button button:hover { cursor: pointer;}
.progress-bar {
    position: relative;
    margin: 80px auto 0;
    width: 400px;
}
.progress-bar .pro-step {
    float: left;
    text-align: center;
}
.progress-bar .pro-line, .progress-bar .pro-step .step-index {
    background: url(../images/reg-icon.png) no-repeat;
}
.progress-bar .pro-line {
    position: absolute;
    top: 7px;
    width: 74px;
    height: 10px;
    background-position: 0 -40px;
}
.progress-bar .person-pro-line {
    width: 124px;
    background-position: 0 -100px;
}
.progress-bar .pro-line1 {
    left: 50px;
}
.progress-bar .person-pro-line1 {
    left: 55px;
}
.progress-bar .pro-step .step-index {
    margin: 0 auto;
    display: block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    background-position: -45px -200px;
    font-size: 12px;
    font-weight: 700;
    /* color: #ccc; */
}
.progress-bar .cur-step .step-index {
    background-position: 0 -200px;
    /* color: #fff; */
}
.progress-bar .pro-step .step-desc {
    margin-top: 10px;
    font-size: 12px;
    /* color: #999; */
}
.progress-bar .cur-step .step-desc {
    /* color: #3b4; */
}
.progress-bar .pro-step2 {
    margin-left: 49px;
}
.progress-bar .person-pro-step2 {
    margin-left: 107px;
}
.mail .person-pro-step2 {
    margin-left: 120px;
}
.progress-bar .person-pro-line {
    width: 124px;
    background-position: 0 -100px;
}
.progress-bar .pro-line2 {
    left: 169px;
}
.progress-bar .person-pro-line2 {
    left: 228px;
}
.progress-bar .pro-step3 {
    margin-left: 43px;
}
.progress-bar .person-pro-step3 {
    margin-left: 112px;
}
.main {
    margin: 50px auto 186px;
    width: 400px;
}
.phone-number { height: 86px;}
#phone-number {
	border: 0 none;
    font-size: 14px;
    width: 377px;
    height: 19px;
    padding-bottom: 11px;
    padding-left: 20px;
    padding-top: 16px;
}
.i-status {
    position: absolute;
    display: none;
    width: 16px;
    height: 16px;
    top: 20px;
    right: 20px;
}
.tel-input {
	width: 398px;
    height: 50px;
    border: solid 1px #ddd;
}
.i-def {
	display: block;
	height: 20px;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.item-getcode-wrap { position: relative; height: 86px;}
.validate {
    position: relative;
    /* border: solid 1px #ddd; */
    width: 398px;
    height: 52px;
    line-height: 52px;
    text-align: center;
    font-size: 14px;
    /* color: #333; */
    cursor: pointer;
    z-index: 2;
}
/* .validate:hover { border-color: #666;} */
.item-phonecode-wrap {
	display: none;
    height: 86px;
}
.form-item-mailcode, .form-item-phonecode {
    z-index: 110;
    width: 400px;
}
.mailcode-left, .phonecode-left {
    position: relative;
    float: left;
    border: solid 1px #ddd;
}
.form-item-phonecode label {
    float: left;
    width: 87px;
    height: 50px;
    line-height: 50px;
    padding-left: 20px;
}
.form-item-phonecode .phonecode {
    width: 152px;
    border: 0 none;
    font-size: 14px;
    height: 19px;
    padding-bottom: 11px;
    padding-left: 20px;
    padding-top: 16px;
}
.btn-phonecode {
    float: left;
    width: 118px;
    height: 52px;
    /* border: 1px solid #ddd; */
    border-left: none;
    /* background: #fff;
    color: #333; */
    padding: 0;
}
.btn-phonecode:hover {
	/* border-color: #666; */
	cursor: pointer;
}
.btn-register {
    width: 100%;
    height: 54px;
    line-height: 54px;
    text-align: center;
    /* color: #fff;
    background: #53b6ed; */
    border: 0;
    font-size: 16px;
    font-family: "Microsoft YaHei","Hiragino Sans GB";
    cursor: pointer;
}
.btn-register:hover {
    /* background: #3696cc; */
}
.btn-register:active {
    /* background: #3696cc;
    color: #e1e1e1; */
}
.btn-code-disable {
    /* background: #F4F5F7;
    color: #999; */
    cursor: default !important;
    /* border-top: 1px solid rgb(221, 221, 221) !important;
    border-right: 1px solid rgb(221, 221, 221) !important;
    border-bottom: 1px solid rgb(221, 221, 221) !important; */
    border-left: none;
}
.validate-box {
	display: none;
    line-height: 1.5;
    text-align: left;
    position: absolute;
    left: 0;
    bottom: 95px;
    font-family: "Microsoft YaHei";
    /* background-color: #fff; */
    cursor: default;
    z-index: 110;
    /* box-shadow: 0 0 2px 2px #eee;
    border: 1px solid #eee; */
    width: 364px;
    height: 90px;
    padding: 12px 12px 12px 20px;
}
.validate-box h2 {
	height: 30px;
	line-height: 30px;
    margin-bottom: 10px;
    font-size: 14px;
	font-weight: normal;
}
.validate-box h2 span { float: right;}
.validate-box h2 span i {
	font-size: 20px;
	font-weight: bold;
	cursor: pointer;
}
.cur-line { background-position: 0 -130px !important;}
#step2-wrap { display: none;}
.form-item {
    position: relative;
    border: solid 1px #ddd;
    width: 398px;
    height: 52px;
    z-index: 0;
}
.form-item label {
    float: left;
    width: 87px;
    height: 52px;
    line-height: 52px;
    padding-left: 20px;
}
.form-item .field {
    border: 0 none;
    font-size: 14px;
    width: 265px;
    height: 19px;
    padding-bottom: 16px;
    padding-left: 20px;
    padding-top: 17px;
}
.input-tip {
    /* color: #c5c5c5; */
    height: 27px;
    font-size: 12px;
    padding-top: 5px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.tips {
    position: absolute;
    /* background: #fef4e5;
    border: solid 1px #f6c090;
    color: #bc5212; */
    display: none;
    padding: 0 12px;
    height: 32px;
    text-align: center;
    line-height: 32px;
    border-radius: 3px;
    z-index: 11;
}
.capslock-tip {
    right: 2px;
    top: -45px;
}
.tips .arrow {
    width: 0;
    height: 0;
    line-height: 0;
    font-size: 0;
    /* border-color: #f6c090 transparent transparent; */
    border-style: solid dashed dashed;
    border-width: 8px;
    position: absolute;
    left: 50%;
    margin-left: -4px;
    bottom: -16px;
}
.tips .arrow-inner {
    width: 0;
    height: 0;
    line-height: 0;
    font-size: 0;
    /* border-color: #fef4e5 transparent transparent; */
    border-style: solid dashed dashed;
    border-width: 8px;
    position: absolute;
    left: 50%;
    margin-left: -4px;
    bottom: -15px;
}

.switch-register {
	margin-top: 32px;
}
/* .switch-register a { color: #666;} */
.switch-register a:hover {
	/* color: #53b6ed; */
	text-decoration: underline;
    cursor: pointer;
}
#step3-wrap { display: none;}
#step3-wrap {
	font-size: 16px;
	font-weight: bold;
	/* color: #53b6ed; */
	text-align: center;
}
#step3-wrap i {
	font-weight: normal;
	/* color: #666; */
}
#step3-wrap a {
	font-size: 14px;
	font-weight: normal;
	/* color: #666; */
}
#step3-wrap a:hover {
	/* color: #53b6ed; */
	text-decoration: underline;
}
#user-name {
    border: 0 none;
    font-size: 14px;
    width: 377px;
    height: 19px;
    padding-bottom: 11px;
    padding-left: 20px;
    padding-top: 16px;
}

.login-certificate a:hover { text-decoration: underline;}
.change-organization {
    cursor: pointer;
    /* color: #3278b4; */
}
.change-organization:hover {
    text-decoration: underline;
}
.login-organization .layui-layer-content {
    padding: 0 20px;
}

.login .layui-form-item .layui-form-checkbox[lay-skin=primary] {
    margin-top: 0;
}

.form-submit {
    position: absolute;
    right: 20px;
    bottom: 10px;
    left: 20px;
    margin-bottom: 0;
}
.form-submit .layui-input-block {
    text-align: right;
}
.form-submit .layui-btn {
    height: 30px;
    line-height: 30px;
}
.password-list .layui-input {
    height: 30px;
    line-height: 30px;
}
.password-list .layui-form-label {
    padding: 0 10px;
    padding-left: 0;
    line-height: 30px;
    font-size: 12px;
    text-align: left;
}
/* .change-default-organization .layui-input-inline { width: calc(100% - 60px) !important;}
.change-default-organization .change-organization{
    display: inline-block;
    width: auto;
    margin-top: 8px;
}
.change-default-organization .change-organization:hover {
    background-color: #fff !important;
    border-color: var(--theme-color);
    color: var(--theme-color) !important;
    text-decoration: none;
} */


.load-content-text { display: none;}
.load-content-text p {
    display: inline-block;
    color: #fff;
}
.load-content-text div#loading1 { display: inline-block;}

.tjg-logo { display: none;}
.tjg-login #particles { background-image: url(../images/other_bg.png);}
.tjg-login .tjg-logo {
    display: block;
    position: absolute;
    top: 50px;
    left: 50px;
    z-index: 2;
    font-size: 28px;
    font-weight: 500;
    color: #080f26;
}
.tjg-login .tjg-logo img { margin-right: 20px;}
.tjg-login .box-bg {
    box-shadow: none;
}
.tjg-login .left-box { display: none;}
.tjg-login .right-box {
    position: fixed;
    width: 400px;
    right: 7%;
    padding-top: 0;
}




.login-container { height: 100%; }
.login-bg-container {
    width: 100vw;
    height: 100vh;
    background-image: url(../images/bg.jpg?v=5.24.9.0915);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
}
.login-main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
}
.login-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 60%;
    min-width: 1150px;
}
.login-content .logo-image { height: 620px; margin-top: -30px; }
.login-content .login-form {
    display: inline-block;
    position: relative;
    background-color: #fff;
    border-radius: 16px;
    overflow: hidden;
}
.login-content .login-form .layui-form {
    box-sizing: border-box;
    width: 390px;
    min-height: 500px;
    padding: 50px 36px 53px;
}
.login-content .login-form.enterprise-form .layui-form { width: 360px; }
.login-content .language-box {
    position: absolute;
    top: 20px;
    right: 40px;
    z-index: 1000;
    line-height: 24px;
}
.login-content .language-box span { margin: 0 10px; font-size: 14px; cursor: pointer;}
.login-content .language-box span:last-child { margin-right: 0; }
.login-content .language-box span:hover { color: var(--theme-color); }
.login-content .language-box span.current { font-weight: bold; color: var(--theme-color); }
.login-content .login-form-header {
    line-height: 39px;
    font-size: 28px;
    font-weight: 700;
    color: #333;
    text-align: center;
}
.login-content .login-form-header span:last-child { color: var(--theme-color); }
.login-content .login-form-desc {
    margin: 6px 0 20px;
    line-height: 22px;
    font-size: 16px;
    color: rgba(32, 32, 32, .5);
    text-align: center;
    font-weight: bold;
}
.login-content .login-form-desc span { color: var(--theme-color); }
.login-content .login-form-desc span:first-child { color: #FF5722; }
.login-content .login-form-desc span:last-child { color: green; }
.login-content .login-form-wrap .layui-form-item .layui-input-block { margin-left: 0; }
.login-content .login-form-wrap .layui-form-item .layui-input-wrap,.login-content .login-form-wrap .layui-form-item .layui-input-wrap .layui-input-affix { line-height: 42px; }
.login-content .login-form-wrap .layui-form-item .layui-input-wrap .layui-input-prefix .layui-icon { color: #c0c4cc; }
.login-content .login-form-wrap .layui-form-item input {
    box-sizing: border-box;
    padding: 0 38px 0 41px;
    height: 42px;
    line-height: 42px;
    font-size: 14px;
    border-radius: 10px;
    border: 1px solid #dcdfe6;
    color: #606266;
}
.login-content .login-form-wrap .layui-form-item.change-default-organization { display: flex; justify-content: space-between; }
.login-content .login-form-wrap .layui-form-item.change-default-organization .layui-input-wrap { flex: 1; margin-right: 10px; }
.login-content .login-form-wrap .layui-form-item.change-default-organization button {
    width: 60px;
    height: 42px;
    line-height: 42px;
    border-radius: 10px;
}
.login-content .login-form-wrap .layui-form-item.canvas-code { display: flex; justify-content: space-between; }
.login-content .login-form-wrap .layui-form-item.canvas-code .layui-input-wrap { flex: 1; margin-right: 10px; }
.login-content .login-form-wrap .layui-form-item.canvas-code canvas { cursor: pointer; }
.login-content .login-form-wrap .layui-form-item.login-to { display: flex; justify-content: space-between; }
.login-content .login-form-wrap .layui-form-item.login-to .layui-form-label {
    padding: 0;
    margin-right: 10px;
    line-height: 30px;
}
.login-content .login-form-wrap .layui-form-item.login-to .layui-input-block { flex: 1; min-height: 30px; }
.login-content .login-form-wrap .layui-form-item.login-button button {
    display: block;
    width: 100%;
    height: 42px;
    line-height: 42px;
    border-radius: 10px;
    background-color: var(--theme-color);
}
.login-content .login-form-wrap .layui-form-item.user-operation a:hover { color: var(--theme-color);}

@media (max-width: 1919px) {
    .login-content {
        width: 55%;
        min-width: 1050px;
    }
    .login-content .logo-image {
        height: 560px;
        margin-top: -30px;
    }
    .login-content .login-form .layui-form {
        width: 360px;
    }
    .login-content .login-form-header {
        font-size: 24px;
    }
    .login-content .login-form-desc {
        margin: 6px 0 20px;
    }
    .login-content .login-form-wrap .layui-form-item .layui-input-wrap,
    .login-content .login-form-wrap .layui-form-item .layui-input-wrap .layui-input-affix {
        line-height: 36px;
    }
    .login-content .login-form-wrap .layui-form-item input {
        height: 36px;
        line-height: 36px;
    }
    .login-content .login-form-wrap .layui-form-item.change-default-organization button {
        height: 36px;
        line-height: 36px;
    }
    .login-content .login-form-wrap .layui-form-item.login-button button {
        height: 36px;
        line-height: 36px;
    }
}