html{height: 100%; font-size: 80%}

.body-bg{
	background:  url(../images/bg3.png) bottom center;
    background-size: 100% 100%;
    height: 100%;
    overflow:hidden;
}
.middle-box{
	height:100%;
    text-align: center!important;
}
.login_top{
	background:#f8f9fa; text-align:center;
    height: 8rem;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
}

.login_top img {
	display:inline-block; vertical-align: middle;
}

.login_title{
	color:#333; margin-left:20px; display:inline-block; vertical-align: middle;
}
.login_title .logo-name{
	font-size:40px;
}
.login_title h3{
	font-size:15px; font-family: 'Microsoft JhengHei';
}

.login_content {
	/* background:rgba(255,255,255,0.1); */ width:100%; height:100%;  overflow:hidden;
	background:url(../images/bg4.png) center left no-repeat;
    margin-left: 20vh;
    background-size:80%;
	/* -moz-box-shadow:1px 1px 5px rgba(0,0,0,0.3); -webkit-box-shadow:1px 1px 5px rgba(0,0,0,0.3); box-shadow:1px 1px 5px rgba(0,0,0,0.3); */
}

.login_con_left{
	 width:70%; height:690px; float:left;  display:none;
}

.login_left_btn{
	margin:240px auto 10px auto; color:#fff; background:#e01d27 url(../images/login_ico_2.png) no-repeat 90px center ; text-align:left; text-indent:20px; width:126px; height:32px; line-height:32px; border-radius:4px;
}
.login_left_links{
	text-align:center; margin-top:20px; font-size: 12px;
}
.login_left_links a{
	color: #333;  display:block; width:33.333%; float:left;
}
.login_left_links a.apps{
	text-align:center; color: #333; cursor:pointer; 
}

.login_left_links a.apps span {
	background:url(../images/login_ico_1.png) no-repeat left center; padding-left:20px; display:inline-block;
}


.login_con_right{
	 border-radius:12px; min-width:320px; width:20%; position: absolute; top: 30%; left: 68%; padding:20px 0; float:right; background:rgba(255,255,255,1);
	 -moz-box-shadow:1px 1px 5px rgba(0,0,0,0.3); -webkit-box-shadow:1px 1px 5px rgba(0,0,0,0.3); box-shadow:1px 1px 5px rgba(0,0,0,0.3);
}

.login_con_right_tit{
	text-align:center; font-size:24px; color:#3aa2fb; margin-top:20px;
}
.login_con_right .form-group  {
	 margin:30px auto 0 auto; overflow:hidden; width:80%; border-radius:0.25rem; background:#fff; position:relative;
}

.login_con_right .form-group input.form-control2 {
    height: 42px;
    border: none;
    display: block;
    padding: 5px;
    border-radius: 10px;
    background-color: #f5f5f5;
    font-size: 1.2rem;
    overflow: hidden;
    text-indent: 55px;
    width: 100%;
}
.login_con_right .form-group input:-webkit-autofill{
	box-shadow: 0 0 0px 1000px white inset;
}
.login_con_right .form-group input:focus {
	 border:none; background-color: #fff; 
}

.login_con_right input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: rgb(250, 250, 250);
    background-image: none;
}

.login_con_right .form-group i {
	width:45px; height:42px; background-color:#f5f5f5; display:inline-block; background-repeat:no-repeat; background-position:center center; position:absolute; left:0; top:0;border-radius: 10px;
}
.userinfs{
	margin:0 
}
.userinfs i{
	background-image:url(../images/login_ico_3.png);
}

.passinfs i{
	background-image:url(../images/login_ico_4.png);
}

.login_con_right .checkbox {
	text-align:left; width:340px; margin:20px auto 0 auto; text-align:center;
}
.login_con_right .checkbox label{
	color:#333; margin-right:12px;
}

.login_con_right button[type="submit"] {
    width: 80%;
    margin: 40px auto 10px auto;
    background: #3aa2fb!important;
    border: 0;
    height: 42px;
    font-size: 1.2rem;
    border-radius: 20px;
}

.login_bottom{
	height:6rem; background:#f9f9f9; position:fixed; bottom:0; width:100%;  overflow:hidden; 
}
.login_bottom ul{
	margin-top:1rem;
}

.login_bottom li{
	display:inline-block; color:#acacac; line-height:24px; font-size:14px; overflow:hidden; vertical-align: middle;
}
.login_bottom li img{
	display:inline-block; vertical-align: middle;
}

.login_bottom li p{
	margin-bottom:0;
}
.signinpanel {
    width: 750px;
    margin: 10% auto 0 auto;
}

.signinpanel .logopanel {
    float: none;
    width: auto;
    padding: 0;
    background: none;
}

.signinpanel .signin-info ul {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.signinpanel .form-control {
    display: block;
    margin-top: 15px;
}

.signinpanel .uname {
    background: #fff url(../images/user.png) no-repeat 95% center;color:#333;
}

.signinpanel .pword {
    background: #fff url(../images/locked.png) no-repeat 95% center;color:#333;
}

.signinpanel .btn {
    margin-top: 15px;
}

.signinpanel form {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255,255,255,.3);
    -moz-box-shadow: 0 3px 0 rgba(12, 12, 12, 0.03);
    -webkit-box-shadow: 0 3px 0 rgba(12, 12, 12, 0.03);
    box-shadow: 0 3px 0 rgba(12, 12, 12, 0.03);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 30px;
}

.signup-footer{border-top: solid 1px rgba(255,255,255,.3);margin:20px 0;padding-top: 15px;}

@media screen and (max-width: 768px) {
    .signinpanel,
    .signuppanel {
        margin: 0 auto;
        width: 420px!important;
        padding: 20px;
    }
    .signinpanel form {
        margin-top: 20px;
    }
    .signup-footer {
        margin-bottom: 10px;
    }
    .signuppanel .form-control {
        margin-bottom: 10px;
    }
    .signup-footer .pull-left,
    .signup-footer .pull-right {
        float: none !important;
        text-align: center;
    }
    .signinpanel .signin-info ul {
        display: none;
    }
}
@media screen and (max-width: 320px) {
    .signinpanel,
    .signuppanel {
        margin:0 20px;
        width:auto;
    }
}

ul {
    margin-bottom: 1rem;
}

body {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

*, ::after, ::before {
    box-sizing: border-box;
}