@CHARSET "UTF-8";
body, div, ol, ul, h1, h2, h3, h4, h5, h6, p, th, td, dl, dd, form, iframe, input, textarea, select, label, article, aside, footer, header, menu, nav, section, time, audio, video, figure{margin:0px;pading:0px;}
body{font: 14px/1.5 arial,microsoft yahei,simsun,simhei,sans-serif;color:#333;font-family: Microsoft YaHei,"微软雅黑",simsun,"宋体",Arial}
input, button, textarea, select, optgroup, option{font:inherit;letter-spacing: normal;word-spacing: normal;text-transform: none;text-indent: 0px;text-shadow: none;display: inline-block;text-align: start;-webkit-writing-mode: horizontal-tb;outline: 0;}

.header{height:80px; width:100%;position:fixed;left:0px;top:0px;background:rgba(255,255,255,0.2);z-index:2;}
.header .logo{position:absolute;left:80px;top:0px;width:400px;height:100%;background-image:url(images/login/logo.png);background-repeat: no-repeat;background-position: left center;}
.header.bl{border-bottom:#cccccc 1px solid; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);background-color:#ffffff;}
.body{position:relative;margin-top:0px;height:700px;background-image:url(images/login/banner.jpg);background-repeat:no-repeat;background-position: top center;z-index:1;overflow:hidden;}
.body .caption{ position:absolute;z-index:1;left:80px;top:140px; color:white;font-size:45px;-webkit-animation:l_r 1s ease;-moz-animation:l_r 1s ease;-o-animation:l_r 1s ease;animation:l_r 1s ease;-ms-animation:l_r 1s ease;}
.body .qrcode{position:absolute;z-index:1;left:88px;bottom:50px;width:344px;height:344px;top:230px;background-image:url(images/login/qrcode.jpg);-webkit-animation:b_t 1s ease;-moz-animation:b_t 1s ease;-o-animation:b_t 1s ease;animation:b_t 1s ease; }
.body .login{position:absolute;z-index:99;right:80px;top:200px;width:410px;border:#f1f1f1 1px solid;border-radius: 2px; background-color:white;text-align:center;}
.body .login .bar{padding-top:25px;}
.body .login .bar a{font-size:16px;cursor:pointer;color:#ACB1BD;font-weight: 600; padding:10px 12px;display:inline-block;margin-left:15px;margin-right:15px; text-decoration: none;position:relative;top:0px;}
.body .login .bar a.selected{color:#3c434b;}
.body .login .bar a.selected:before{position:absolute;height:2px;width:30px;left:50%;bottom:0px;margin-left:-15px;z-index:1;background-color:#3c434b;content:"";display:block;}
.body .login .content{padding-bottom:45px;text-align:center;padding-left:30px;padding-right:30px;}

/*ds-form*/
.ds-form{}
.ds-form .inputbox{margin:auto;margin-bottom:20px;padding-left:15px;padding-right:15px;display: flex;background-color: #f5f6f7;border-radius: 2px;}
.ds-form .inputbox input{display: block;color:#333;flex:1;outline: none;border:none; background-color: #f5f6f7;line-height:18px;font-size:14px;padding:11px 0px;box-shadow: inset 0 0 0 1000px #f5f6f7!important;}
.ds-form .inputbox img{display:inline-block;vertical-align: top}
.ds-form .c-authcode{display:none;}
.ds-form .inputbox.authcode{position:relative;padding-right:0px;flex:1}
.ds-form .inputbox.authcode input{flex:1;}
.ds-form .authcode-img{width:95px;height:40px;margin-left:15px;}
.ds-form .content .autologin{position:relative;font-size:12px;height:40px;}
.ds-form .content .autologin label{position:absolute;left:0px;top:0px;}
.ds-form .content .autologin label input{position:relative;top:2px;}
.ds-form .content .autologin a{position:absolute;right:0px;top:0px;color:blue;text-decoration:none;}
.ds-form .content .btn-submit{width: 100%;}
.ds-form .icon-username{width:16px;background-repeat: no-repeat;background-position: center center;cursor: pointer;background-image:url('images/login/icon_del.png')}
.ds-form .icon-password{width:16px;background-repeat: no-repeat;background-position: center center;cursor: pointer}
.ds-form .icon-password.open{background-image:url('images/login/icon_eye_open.png')}
.ds-form .icon-password.close{background-image:url('images/login/icon_eye_close.png')}
.ds-form .message{height:40px;line-height:40px;vertical-align:middle;padding-top:10px;font-size:12px;}
.ds-form .message span{color:red;display:block;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space: nowrap; }

/*ds-btn*/
.ds-btn{animation:myfirst 5s;display: inline-block;font-size: 14px;padding: 6px 12px;font-weight: normal;text-align: center;white-space: nowrap;vertical-align: middle;cursor: pointer;background-color: #f5f5f5;background-image: -moz-linear-gradient(top,#fff,#f1f1f1);background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#f1f1f1));background-image: -webkit-linear-gradient(top,#fff,#f1f1f1);background-image: -o-linear-gradient(top,#fff,#f1f1f1);background-image: linear-gradient(to bottom,#fff,#f1f1f1);background-repeat: repeat-x;border: 1px solid #ccc;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;-o-user-select: none;user-select: none;color: #666666;}
.ds-btn-lg{font-size: 16px;line-height: 1.33;padding: 8px 16px;border-radius: 4px;}
.ds-btn:hover, .ds-btn:focus {color: #333333;text-decoration: none;}
.ds-btn-primary {color: #ffffff;background-color: #30BDC6;background-image: none;border-color: #2BA9B1;}
.ds-btn-primary:hover, .ds-btn-primary:focus, .ds-btn-primary:active, .ds-btn-primary.active {color: #ffffff;background-color: #3FC8D0;border-color: #30BDC5;}

/*footer*/
.footer{padding:10px 20px;text-align:center;line-height:20px;}
.footer.tl{border-top:#f1f1f1 1px solid;}
.footer .copyright{color:#666666;text-align:center;font-size:12px;}

/*ds-body*/
.ds-body{padding-top:150px;padding-bottom:50px;text-align:center;}
.ds-body .ds-content{width:680px;border:#eeeeee 1px solid;margin:auto;padding:50px 70px;}
.ds-body .ds-content span.errormsg{line-height:35px;color:red;font-size:18px;}
.ds-body .ds-content .browser{ text-align:center;margin-top:40px;}
.ds-body .ds-content .browser a{ text-align:center; vertical-align:top; padding:7px 20px; text-decoration:none; display:inline-block; *display:inline;*zoom:1;margin-left:25px;margin-right:25px;}
.ds-body .ds-content .browser a:hover{ background-color:#F1F7FB}
.ds-body .ds-content .browser a ins{margin:auto;}
.ds-body .ds-content .browser a ins.chrome{width:64px;height:64px; text-decoration:none; cursor:pointer; background-image:url("images/chrome.png"); display:block;}
.ds-body .ds-content .browser a ins.firefox{width:64px;height:64px; text-decoration:none; cursor:pointer; background-image:url("images/firefox.png"); display:block;}
.ds-body .ds-content .browser a ins.safari{width:64px;height:64px; text-decoration:none; cursor:pointer; background-image:url("images/safari.png"); display:block;}
.ds-body .ds-content .browser a ins.b360{width:64px;height:64px; text-decoration:none; cursor:pointer; background-image:url("images/360.png"); display:block;}
.ds-body .ds-content .browser a span{color:#177dfc; text-align:center; line-height:30px;}

/*keyframes*/
@-webkit-keyframes l_r {from {opacity:0;left:0px;}to{opacity:1;left:80px; }}
@-moz-keyframes l_r {from {opacity:0;left:0px; }to{opacity:1;left:80px;}}
@-o-keyframes l_r {from {opacity:0;left:0px;}to{opacity:1;left:80px;}}
@keyframes l_r {from {opacity:0;left:0px;}to{opacity:1;left:80px;}}
@-ms-keyframes l_r {from {opacity:0;left:0px;}to{opacity:1;left:80px;}}
@-webkit-keyframes b_t {from {opacity:0;bottom:-40px;}to{opacity:1;bottom:50px; }}
@-moz-keyframes b_t {from {opacity:0;bottom:-40px; }to{opacity:1;bottom:50px;}}
@-o-keyframes b_t {from {opacity:0;bottom:-40px;}to{opacity:1;bottom:50px;}}
@keyframes b_t {from {opacity:0;bottom:-40px;}to{opacity:1;bottom:50px;}}
@-ms-keyframes b_t {from {opacity:0;bottom:-40px;}to{opacity:1;bottom:50px;}}

@media(max-width: 768px) {
	body{background-color:#f5f5f5;}
	.header{background-color:transparent;display:flex;position:static;margin-top:80px;justify-content: center}
	.header .logo{position:static;background-position:center;width: 100%;height: 100%;}
	.body{padding-top:0px;height:auto;background-image:none;background-color:transparent;}
	.body .qrcode,.body .caption{display:none;}
	.body .login{position:relative;left:0px;top:0px;width:auto;margin:0px 0px 40px 0px;background-color: transparent;border:0px;}
	.ds-form .message{text-align:center;}
	.ds-form .message span{padding:0px;text-align:center;}
	.ds-form .inputbox{display:flex;margin:inherit;margin-bottom:20px;background-color: #fff;}
	.ds-form .inputbox label{display:none;}
	.ds-form .inputbox input{width:auto;flex:1;background-color: #fff;box-shadow: inset 0 0 0 1000px #fff!important;}
	.ds-form .inputbox.authcode{margin:0px;display:flex;margin-bottom:20px;left:0px;}
	.ds-form .inputbox.authcode input{width:auto;margin-right:10px;}
	.ds-form .inputbox.authcode img{margin-right:20px;margin-left:0px;}
	.login.ds-form .bar .bar-weixin,.login.ds-form .bar .bar-qyweixin{display: none;}
	.login.ds-form .tab-weixin,.login.ds-form .tab-qyweixin{display: none;}
	.login.ds-form .bar .bar-password,.login.ds-form .tab-password{display: block;}

	.body .login .content{display:flex;flex-direction:column;}
	.body .login .content .btn-submit{width:auto;flex:1;}

	.footer{margin-bottom:30px;margin-top:20px;}
	.footer .copyright{color:#a9a9a9;display:flex;flex-direction:column;}
}