* { margin:0; padding:0; list-style:none; }
html { height:100%; width:100%;}
body { height:100%; width:100%; text-align:center;
    margin:0; padding:0; position:relative;
    background: url(../images/bg_login.jpg)  no-repeat center center #FFFFFF;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    transition:all ease-out 0.3s;color:#555; font-family: Arial,"Microsoft YaHei","微软雅黑","宋体"; font-size:1em; line-height:1.4;}
/*body:after{ content: "";position:absolute; top:0; right:0; bottom:0; left:0; background: rgba(0,0,0,0);}
*/div, h1, h2, h3, h4, h5, h6 ,p, form, label, input, img, span,ul,ol{margin:0; padding:0; list-style-type:none;}
img {border:0; max-width: 100%; height: auto; width: auto\9; /* ie8 */}
.spacer{ clear:both; font-size:0; line-height:0; height:0;}
.clear:after,#clear:after {content: "";display: table;clear: both;font-size: 0;line-height: 0;height: 0;}
a:link {color: #409eff;	text-decoration: none; transition:all ease-out 0.3s;}
a:visited {text-decoration: none;	color: #409eff;}
a:hover {text-decoration: none ;	color: #409eff;}
a:active {text-decoration: none;	color: #409eff;}

.txta{ font-size:14px; padding:0 20px;}
.paddingTop35 {	padding-Top: 25px;}
.paddingTop40 {	padding-Top: 40px;}
.bg_body{display:block; width:98%; max-width:500px; margin:0 auto; background: rgba(255,255,255,0.85);
    position: absolute; z-index:99;top:50%; left:50%; transform: translate(-50%,-50%);
    border-radius:15px; overflow:hidden;box-shadow: 0 0 30px #333;
}
/*.bg_body:after{ content: "";clear: both;font-size: 0;height: 0;}*/

#login_box:after,#login_left:after,#login_right:after{ content: "";clear: both;font-size: 0;height: 0;}
#login_box{ width:900px; position: absolute; z-index:99;top:50%; left:50%; transform: translate(-50%,-50%);
    border-radius:10px; overflow:hidden;/* box-Shadow:0 0 15px #ccc;*/
}
#login_left { background:  #409eff; background-size: cover; position: absolute;top:0; right:50%; bottom:0; left:0; box-sizing: border-box;padding:22px 35px;}
#login_left figure{ float:left; width:100%; text-align:center; padding:30px 0 25px 0; font-size: 2em;line-height: 1.5;color:#FFF; font-weight: bold;}
#login_left figure img{ display:block; margin:0 auto;width: 70%;}
#login_left h2{width:100%; text-align:center; font-size:1.6em; line-height:1.4;  color:#FFF;}
#login_left h3{width:100%; text-align:center; font-size:1em; line-height:1.4;  color:#FFF;}
#login_left p{position: absolute; left:0; right:0; bottom:15px; font-size:0.8em;color:#ddd;}
#login_left a{color:#ddd;}
#login_left a:hover{color:#ccc;}

#login_right{ float:right; width:50%; min-height:350px; background: rgba(255,255,255,0.75);box-sizing:border-box; padding:30px 0;}
#login_right h2{width:100%; font-size:1.7em; line-height:1; padding-bottom:30px; color:#333; text-align: center; text-indent: 0; font-weight:bold;}


.w220 {    width: 270px !important;position: relative}
.w100{    width: 123px  !important; margin:0!important;}
#login_right form .Sub_mit{ border:none; width:100%; border-radius:5px;font: bold 18px/43px "微软雅黑","宋体",Arial; color:#FFF; cursor:pointer;word-spacing:2px; letter-spacing: 2px;
    background: #409eff;
    -webkit-transition: -webkit-box-shadow ease-in-out .15s;
    -o-transition: box-shadow ease-in-out .15s;
    transition: box-shadow ease-in-out .15s}
#login_right form .Sub_mit:hover{ background: #409eff; }
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{opacity:0.3;}

#login_right form .inname:focus,
#login_right form .inpass:focus{border: 1px solid #2a61a4; outline:0;  }


#footer{ float:left; width:90%; text-align:center; font:normal 12px/25px "Arial","宋体";  color:#ccc; padding-top:12px; }
#footer a{   color:#ccc; padding:5px; }
#footer a:hover{   color:#999;  }

.myxz3{position: absolute;top:2px;right:0px;background: none;height: 36px;
    line-height: 36px;
    border: 0;
    padding: 0 18px;
    color: #409eff;
    text-align: center;
    font-size: 14px;
    cursor: pointer;}

.du_login{width: 100%;height: 100%;position: absolute;display: flex;align-items: center}
.dw{background: #fff;height: auto;width: 28%;margin-left: 58%;padding: 50px 0;position: relative}
.du_copyright{position: absolute;bottom: 15px;color: #fff;text-align: center;width: 100%;font-size: 14px}

::-webkit-input-placeholder {color:#999!important;opacity: 0.7!important;font-size: 14.5px!important;}
:-moz-placeholder {color:#999!important;opacity: 0.7!important;font-size: 14.5px!important;}
::-moz-placeholder {color:#999!important;opacity: 0.7!important;font-size: 14.5px!important;}
:-ms-input-placeholder {color:#999!important;opacity: 0.7!important;font-size: 14.5px!important;}

.du_login_tit{text-align: center;overflow: hidden;font-size: 24px;font-weight: bold;border-bottom: 3px solid #357fe8;width: 100px;margin: 0 auto;padding-bottom: 7px;margin-bottom: 45px}
.du_login_tit11{text-align: center;overflow: hidden;font-size: 24px;font-weight: bold;border-bottom: 3px solid #357fe8;width: 240px;margin: 0 auto;padding-bottom: 7px;margin-bottom: 45px}
.du_login_cen{width: 85%;overflow: hidden;margin: 0 auto;margin-top: 15px;position: relative;}
.du_login_cen input{border: 0;line-height: 48px;display: block;width: 80%;padding: 0 10%;}

.du_zhuce_href{position: absolute;right: 0;color: #fff;top: 0;background: url(../images/dl_icon.png) no-repeat right center;background-size: 80px;height: 80px;width: 80px;}
.du_zhuce_href a{display: block;padding-top: 14px;padding-left: 25px;color: #fff;font-size: 14px;padding-bottom: 18px}

.du_Sub_mit{border: 0;color: #fff;background: #357fe8;line-height: 45px;border-radius: 5px;display: block;width: 100%;margin-top: 20px;font-size: 16px}
.du_login_cen a{font-size: 14px;}

.du_yzm{position: absolute;right: 0;top: 0;display: block;background: none;line-height: 48px;padding: 0 15px;border: 0;font-size: 14px;color: #357fe8}

.du_icon_1 input{background:#f7f7f7 url(../images/login_iocn01.png) no-repeat 3% center;background-size: 18px}
.du_icon_2 input{background:#f7f7f7 url(../images/login_iocn02.png) no-repeat 3% center;background-size: 18px}
.du_icon_3 input{background:#f7f7f7 url(../images/login_iocn03.png) no-repeat 3% center;background-size: 18px}
.du_icon_4 input{background:#f7f7f7 url(../images/login_iocn04.png) no-repeat 3% center;background-size: 18px}
.du_icon_5 input{background:#f7f7f7 url(../images/login_iocn05.png) no-repeat 3% center;background-size: 18px}


@media screen and (max-width:1400px){
    .dw{width: 36%;margin-left: 54%}
}

@media screen and (max-width:1024px){
    .dw{width: 60%;margin-left: 20%}
}

@media screen and (max-width:640px){
    .dw{width: 90%;margin-left: 5%;padding: 30px 0}
    .du_login_tit{margin-bottom: 32px}
    .du_copyright{font-size: 12px;padding: 0 5%;width: 90%;bottom: 10px;}

    .du_login_cen input{border: 0;line-height: 48px;display: block;width: 100%;padding: 0 5% 0 12%;}
    body{
        /*background: -webkit-linear-gradient(left top,#61aefc, #4553f9);
background: -o-linear-gradient(bottom right,#61aefc, #4553f9);
background: -moz-linear-gradient(bottom right,#61aefc, #4553f9);
background: linear-gradient(bottom right,#61aefc, #4553f9);*/

        background: url(../images/bg_login_s.jpg)  no-repeat center center #FFFFFF;background-size: 100% 100%

    }
    .du_Sub_mit{margin-top: 15px}
    .du_login_cen{margin-top: 13px}

}

@media screen and (max-width:800px){
    #login_box{ width:94%; top:50%; left:3%; transform: translate(0,-50%); }
    #login_left { width:100%;position: static; padding: 15px 25px;}
    #login_left figure{  padding:0 0 15px 0; }
    #login_right{width:100%;min-height: 50px;}
    #login_right h2 {padding:0 0 15px 0 !important; font-size: 1.4em;}
    #login_left h2 {font-size: 1.4em;}
    .w220{width: calc(100% - 160px)!important}
    #login_left p{color: #999!important}


}

@media screen and (max-width:445px){
    .myxz1{width: 100%!important;margin-bottom: 6px}
    .myxz2{width: 100%;margin: 0 15px 0px 15px!important;position: relative}
    .myxz3{top:28px;}

    #login_left h2{display: none}
    #login_left h3{display: none}
    #login_left{overflow: hidden}
}