:root,
body {
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
}

[v-cloak] {
	display: none;
}

.login-clear {
	clear: both;
}

.login-body {
	height: 100%;
	width: 100%;
	background-image: url(https://ccmwebvpn.ccmusic.edu.cn/https/77726476706e69737468656265737421e3e44ed2243365456d018ae29d51367b76ac/sso/img/login_bg.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: left top;
	overflow: hidden;
}

.login-row {
	height: 90%;
	width: 90%;
	margin: 0 auto;
	position: relative;
}

.login-logo {
	width: 12.5vw;
	height: 30.7vh;
	background-image: url(https://ccmwebvpn.ccmusic.edu.cn/https/77726476706e69737468656265737421e3e44ed2243365456d018ae29d51367b76ac/sso/img/login_logo.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: left top;
	position: absolute;
	left: 12%;
	top: 7%;
}

.login-school-motto {
	width: 27.87vw;
	height: 23.95vh;
	background-image: url(https://ccmwebvpn.ccmusic.edu.cn/https/77726476706e69737468656265737421e3e44ed2243365456d018ae29d51367b76ac/sso/img/login_school_motto.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: left top;
	position: absolute;
	left: 8%;
	bottom: 15%;
}

.login-form {
	width: 37.3vw;
	height: 56.54vh;
	background-image: url(https://ccmwebvpn.ccmusic.edu.cn/https/77726476706e69737468656265737421e3e44ed2243365456d018ae29d51367b76ac/sso/img/form_bg.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: left top;
	position: absolute;
	right: 8%;
	top: 26%;
}

.login-form>.form-div {
	height: 80%;
	width: 70%;
	border: 0 solid red;
	position: absolute;
	top: 16%;
	right: 5%;
}

.form-div ul {
	list-style: none;
	margin: 2vh 0 0 6.5%;
}

.form-div ul li {
	float: left;
	width: 5.2vw;
	height: 3.24vh;
	font-size: 0.93vw;
	font-family: Hiragino Sans GB;
	font-weight: bold;
	color: rgba(56, 52, 51, 1);
	position: relative;
	margin-right: 10%;
	text-align: center;
}

.form-div ul li:hover {
	cursor: pointer;
}

.form-div>form {
	border: 0px solid gray;
	margin-left: 6.5%;
	padding: 0.2vh 2vw;
}

.form-div>form p {
	margin: 0.5vh 0;
}

/* .form-div>form p:nth-of-type(1) {
	margin-top: 2.2vh;
} */

/* .form-div>form p:nth-of-type(3) {
	margin-top: 1.5vh;
}

.form-div>form p:nth-of-type(4) {
	margin-top: 1.5vh;
} */



.form-div>form p input[type='text'],
[type='password'] {
	height: 4.4vh;
	width: 18.75vw;
	background-color: rgba(114, 107, 104, 0.18);
	border-radius: 24px;
	outline: none;
	border: 0;
	font-size: 0.93vw;
	padding-left: 2vw;
	box-sizing: border-box;
}

.form-div>form input[name='username'] {
	background-image: url(https://ccmwebvpn.ccmusic.edu.cn/https/77726476706e69737468656265737421e3e44ed2243365456d018ae29d51367b76ac/sso/img/user_login.png);
	background-position: 0.5vw center;
	background-repeat: no-repeat;
	background-size: 1.30vw 2.38vh;
}

.form-div>form input[type='password'] {
	background-image: url(https://ccmwebvpn.ccmusic.edu.cn/https/77726476706e69737468656265737421e3e44ed2243365456d018ae29d51367b76ac/sso/img/user_pwd.png);
	background-position: 0.5vw center;
	background-repeat: no-repeat;
	background-size: 1.30vw 2.38vh;
}

.form-div>form input[name='validateCode'] {
	background-image: url(https://ccmwebvpn.ccmusic.edu.cn/https/77726476706e69737468656265737421e3e44ed2243365456d018ae29d51367b76ac/sso/img/code.png);
	background-position: 0.5vw center;
	background-repeat: no-repeat;
	background-size: 1.10vw 2.38vh;
	width: 12.75vw !important;
}


.form-div form button {
	height: 4.4vh;
	width: 18.75vw;
	background: rgba(151, 17, 7, 1);
	border-radius: 24px;
	border: 0;
	outline: none;
	font-size: 1.25vw;
	font-family: Hiragino Sans GB;
	font-weight: bold;
	color: rgba(255, 255, 255, 1);
	letter-spacing: 0.3rem;
	margin-top: 1vh;
}

.form-div form button:hover {
	cursor: pointer;
}

.form-div .forget-password {
	width: 100%;
	text-align: center;
	border: 0 solid red;
	margin-top: 2.24vh;
}

.form-div .forget-password a {
	font-size: 0.93vw;
	font-family: Hiragino Sans GB;
	font-weight: 700;
	color: rgba(72, 57, 44, 1);
	text-decoration: none;
}

.login-type-active::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 0.4vh;
	background: rgba(151, 17, 7, 1);
	border-radius: 2px;
	left: 0;
	bottom: 0px;
}

.login-footer {
	height: 10%;
	width: 90%;
	margin: 0 auto;
	position: relative;
	text-align: center;
	box-sizing: border-box;
	padding-top: 1%;
}

.login-footer p {
	font-family: HiraginoSansGB-W3;
	color: #5A4D4D;
	font-size: 0.78vw;
	height: 1vh;
	line-height: 1vh;
}

.user-name-tip,
.user-pwd-tip {
	position: absolute;
	font-size: 0.63vw;
	border-radius: 4px;
	padding: 0.3vw 0.52vw;
	z-index: 2000;
	min-width: 10px;
	word-wrap: break-word;
	background-color: #303133;
	color: #ffffff;
}

.QR-code {
	border: 0 solid red;
	width: 12vw;
	height: 25vh;
	margin: 3vh auto;
}

.QR-code img {
	width: 100%;
	height: 100%;
}

.validate-msg {
	display: block;
	font-size: 0.6vw;
	color: red;
	margin: 0.46vh;
	height: 2vh;
}



.err{
	color:red;
	font-size: 0.75vw;
	height: 2vh;
	line-height: 2vh;
	padding-left: 0.4vw;
}

#img_code{
	width: 4.5vw;
	height: 4vh;
	vertical-align: middle;
	margin-left: 0.5vw;
	cursor: pointer;
}