@charset "utf-8";

body,html {
	height: 100%
}
body {
	font-size: 16px;
	
}
* {
	padding: 0;
	margin: 0;
	list-style: none;
	text-decoration: none
}
.logo {
	background-image: url("../img/qqmail_logo_m-043feddb2646bd6dc58dbc89c94abbf4.png")
}
.my {
	width: 288px;
	height: 44px;
	position: absolute
}
#go {
	text-align: center
}
.del_touch,.inputstyle {
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0)
}
input::-webkit-input-placeholder {
	color: #aaa
}

input::-ms-input-placeholder {
	color: #aaa
}

input:focus {
	outline: 0
}

input:disabled {
	opacity: 1;
	-webkit-text-fill-color: #000;
}

input:disabled::placeholder {
	-webkit-text-fill-color: #aaa;
}

.content {
	margin: 0 auto;
	width: 88%;
	height: 500px;
	position: relative
}

#error_tips {
	position: absolute;
	top: 0;
	z-index: 100;
	display: none;
	opacity: .95;
	width: 100%
}

#error_tips #error_tips_content {
	position: relative;
	padding: 16px 0 24px 24px;
	border-radius: 5px;
	background-color: #525c5f;
	height: 28px
}

#error_tips #error_tips_content #error_icon {
	position: absolute;
	top: 18px;
	display: inline-block;
	width: 24px;
	height: 24px;
	background: url("data:image/png;base64,") no-repeat
}

#error_tips #error_tips_content #error_message {
	display: inline-block;
	line-height: 28px;
	font-size: 14px;
	color: #fff;
	padding: 0 0 0 28px
}

@media(-webkit-min-device-pixel-ratio:2),
(min-resolution:192dpi),
(min-resolution:2dppx) {
	#error_tips #error_tips_content #error_icon {
		background: url("../img/info%25402x.png") no-repeat;
		background-size: 24px 24px
	}
}

.login {
	margin: 0 auto;
	padding-top: 30px
}

.inputstyle {
	width: 273px;
	height: 44px;
	color: #000;
	border: 0;
	background: 0;
	padding-left: 15px;
	font-size: 16px;
	-webkit-appearance: none
}

.logo {
	height: 210px;
	width: 210px;
	margin: 0 auto 20px;
	background-size: 210px 210px
}

#switch,
#web_login {
	margin: 0 auto
}

.del_touch,
.del_u {
	position: absolute
}

#web_login {
	width: 100%
}

#g_list {
	background: #eee;
	height: 89px;
	border-radius: 4px
}

#g_p,
#g_u {
	position: relative;
	width: 100%;
}

#g_u {
	border-bottom: 1px solid #aaa
}

.del_touch {
	right: 0;
	display: none;
	height: 44px;
	width: 48px;
	z-index: 1
}

.del_u {
	display: block;
	left: 15px;
	top: 13px;
	height: 18px;
	width: 18px;
	border-radius: 9px;
	
}

#go {
	width: 100%;
	height: 44px;
	line-height: 44px;
	background: #649efd;
	border: 0;
	border-radius: 4px;
	color: #fff;
	font-size: 16px;
	margin-top: 15px;
	display: block
}

#switch {
	width: 100%
}

#switch #zc_feedback {
	width: 100%;
	position: relative;
	margin-top: 15px;
	overflow: hidden
}

#switch #forgetpwd,
#switch #zc {
	color: #246183;
	line-height: 14px;
	font-size: 14px;
	padding: 15px 10px
}

#switch #zc {
	float: right;
	margin-right: -10px
}

#switch #forgetpwd {
	float: left;
	margin-left: -10px
}

.jp {
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
	width: 100%;
	line-height: 1.4625rem;
	background: #cfd2d9;
	padding-top: 3%;
	font-size: 0;
	position: fixed;
	bottom: 0;
	left: 0;
	display: none
}

.uls {
	margin-bottom: 1%
}

.uls .key {
	width: 6%;
	line-height: 1.25rem;
	margin: 1%;
	padding: 3% 1%;
	background: #fff;
	float: left;
	border-radius: .3125rem;
	box-shadow: 0 .0625rem .0625rem #a0a0a0;
	list-style-type: none;
	font-size: 1.4625rem
}

.uls .key,
.ulscen {
	text-align: center
}

.ulscen .key {
	display: inline-block;
	float: none
}

.clear {
	clear: both
}

.ulbot .key:nth-child(1) {
	width: 21%;
	background: #aaaeba
}

.ulbot .key:nth-child(2) {
	width: 46%
}

.ulbot .key:nth-child(3) {
	width: 21%;
	background: #aaaeba
}

.ul5 .key {
	width: 10%
}

.key:active {
	background: #aaaeba
}

.key_del:active {
	background: #fff
}

.key_del,
.key_sj {
	width: 10%;
	line-height: 1.25rem;
	background: #aaaeba;
	margin: 1%;
	padding: 3% 1%;
	float: left;
	border-radius: .3125rem;
	box-shadow: 0 .0625rem .0625rem #a0a0a0;
	list-style-type: none;
	text-align: center;
	font-size: 1.4625rem
}

.key_del {
	width: 10%;
	float: right
}

.key_foot {
	width: 21%;
	line-height: 1.25rem;
	background: #aaaeba
}

.key_foot,
.key_ok,
.space {
	line-height: 1.25rem;
	display: inline-block;
	float: none;
	margin: 1%;
	padding: 3% 1%;
	border-radius: .3125rem;
	box-shadow: 0 .0625rem .0625rem #a0a0a0;
	list-style-type: none;
	text-align: center;
	font-size: 1.2rem
}

.key_ok {
	width: 21%;
	background: #649efd;
	color: #fff
}

.num_ok {
	background: #649efd;
	color: #fff
}

.space {
	width: 46%;
	background: #fff
}

.space:active {
	background: #aeb1c0
}

.number {
	background: #fff
}

.number,
.num-del,
.num_ok {
	line-height: 1.25rem;
	text-align: center;
	width: 29%;
	margin: 1%;
	padding: 3% 1%;
	float: left;
	border-radius: .3125rem;
	box-shadow: 0 .0625rem .0625rem #a0a0a0;
	list-style-type: none;
	font-size: 1.4625rem
}

.num-del {
	background: #aaaeba
}

.num-del:active {
	background: #fff
}

.number:active {
	background: #aaaeba
}