/*================基本样式重置================*/
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,p,img,span,i,a,em,strong,b,input,textarea,select { margin:0; padding:0; }
i,em { font-weight:normal; font-style:normal; }
b{font-weight: normal;}
a,i,em,span,b,img{display: block;}
body {  font-family: "PingFang SC", "Microsoft Yahei"; }
li { list-style:none; }
a,img,input { border:0 none; }
a { text-decoration:none; outline:none; }
a:hover { text-decoration:none; }
a:focus,input:focus { outline:0 none;}
input::-webkit-search-cancel-button{display: none;}/*清除谷歌浏览器下的 search 叉号*/
input::-ms-clear{display: none;}/*清除IE下的 search 叉号*/
input{background: none;}
button{border: none; cursor: pointer;}
textarea { resize:none; font-size:12px; } /*去掉火狐和谷歌浏览器的Textarea改变尺寸大小功能*/

/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}

.swiper-button-next,.swiper-button-prev{outline:none;}

/*========定义基础样式========*/
.hide { display:none;}
.fl { float:left;}
.fr { float:right;}
.clearfix:after { content:" "; display:block; clear:both; height:0; }
.clearfix { zoom:1; }

/*a标签鼠标hover高亮显示状态（可选用）*/
a .opacity { filter:alpha(opacity=100); opacity:1; -moz-opacity:1; } 
a:hover .opacity { filter:alpha(opacity=80); opacity:0.8; -moz-opacity:0.8; }


/*主体宽度样式（可选用）如有新宽度，命名规则以小写w开头，后接具体宽度数据，例：*/
.w1200{width: 1200px; margin: 0px auto; }
.w1400{width: 72.91%;min-width: 1200px;  margin: 0px auto; }


.header{position: relative; height: 12vh;text-align: center;background: #f8f8f8;}
.header img{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%); height: 53.51%;}


.login{position: relative; height: 88vh;}

.login .next{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.login .next .size{background: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.login .next .bor{padding:30px 30px 44px;}
.login .next .bor b{margin-bottom: 30px; font-size: 24px;color: #333;font-weight: bold;}
.login .next dt{padding-bottom: 13px; font-size: 16px;color: #333;font-weight: bold;}
.login .next dd{margin-bottom: 13px;}
.login .next .inp{position: relative; border: #e9e8ec 1px solid;}
.login .next .inp input{padding:10px 20px;width: 369px; line-height: 30px; font-size: 16px;color: #333;}
.login .next .inp .icon{width: 50px;height: 50px; border-left: #e9e8ec 1px solid;}
.login .next dd em{display: none; font-size: 12px;color: #ff3030;}
.login .next dd i{transition: all 0.3s; opacity: 0; position: absolute;left: -1px;top: -1px; width: 1px;height:calc(100% + 2px);background: #57b5e6;}
.login .next .inp_box{border: #e9e8ec 0px solid;}
.login .next .inp_box input{ padding:10px 20px;width: 224px;border: #e9e8ec 1px solid;}
.login .next dd .img_box{cursor: pointer;}
.login .next dd img{padding: 2px 0 0 16px;height: 48px;}
.login .next .but{margin-top: 23px; width:100%;height: 56px;font-size:18px;color: #fff; background: #57b5e6;}

.login .next .cur{box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.login .next .cur i{transition: all 0.3s; opacity: 1;}


@media screen and (max-height:800px){
    
}
@media screen and (max-height:768px){

}
@media screen and (max-height:720px){
	.login .next .bor {padding: 26px 30px 34px;}
    .login .next .bor b {margin-bottom: 20px;font-size: 20px;}
    .login .next dt{padding-bottom: 8px;}
    .login .next dd {margin-bottom: 8px;}
    .login .next .inp input{width: 339px; line-height: 28px;}
    .login .next .inp_box input{width: 194px;}
    .login .next .inp .icon {width: 48px;height: 48px;}
    .login .next dd img{padding-top: 1px;}
    .login .next .but{height: 50px;}
}
@media screen and (max-height:630px){
    .login .next .bor {padding: 22px 26px 30px;}
    .login .next .bor b {margin-bottom: 20px;font-size: 20px;}
    .login .next dt {padding-bottom: 8px;font-size: 14px;}
    .login .next dd {margin-bottom: 8px;}
    .login .next .inp input{width: 319px; line-height: 28px;font-size: 14px;}
    .login .next .inp_box input{width: 174px;}
    .login .next .inp .icon {width: 58px;height: 48px;}
    .login .next dd img{padding-top:1px;}
    .login .next .but{margin-top:16px; height: 50px;}
}