html{
    /* overflow:hidden; */
    vertical-align:baseline;}
body{height:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,STHeiti,"Microsoft Yahei",sans-serif;}
ul,li{list-style:none;padding:0;margin:0;}
.clear{clear: both;}
.login-box{position:relative;width:25.625em;margin:60px auto 0;text-align:center;padding:1.875em;background: rgba(255, 255, 255, 1);box-shadow: 0px 18px 29px -10px rgba(204, 228, 255, 1);border-radius:10px;}
.login-box .logintop{background: rgba(39, 124, 242, 1);height: 8px;width:100%;position:absolute;top:0;left:0;border-top-left-radius:10px;;border-top-right-radius:10px;}
.login-box .remember{ margin-bottom:20px;color:#333; }
.login-box .login-help{ color:#fff; cursor:pointer; }
.login-box .logintxt{text-align: left;font-size: 20px;font-weight: bold;padding-left:18px;color:#363C4F;}
.login-box .input-group-addon{background-color: transparent}
.login-box .remember input{box-shadow:none;width:16px;height:16px;vertical-align:middle;}
.login-box .form { width:100%; }
.login-box .check-tips{color:red; padding-top: 10px;}
.login-box button{cursor:pointer;width:100%;text-align:center;height:44px;padding:0;background:#277CF2;border:1px solid #DEECFF;border-radius:6px;font-weight:700;color:#fff;font-size:24px;text-indent:15px;letter-spacing:15px;text-shadow:0 1px 2px rgba(0,0,0,.1)}
.login-box button:hover{box-shadow:0 15px 30px 0 rgba(255,255,255,.15) inset,0 2px 7px 0 rgba(0,0,0,.2)}
.login-btn .in { display: none;  }
.login-btn .in .icon-loading { display: inline-block; margin-right: 5px; width: 16px; height: 16px; vertical-align:middle; background: url(loading_icon.gif) no-repeat 0 0;  }
.login-box .log-in .in { display: inline-block; }
.login-box .log-in .on { display: none;  }
.login-box .log-in{ background:#666666;border-color:#5e5e5e; }
.screenbg{position:fixed;bottom:0;left:0;z-index:-999;overflow:hidden;width:100%;height:100%;min-height:100%;}
@keyframes move{
    0%{
        transform: translateX(50%);
    }
    100%{
        transform: translateX(-50%);
    }
}
@keyframes move2{
    0%{
        transform: translateX(-50%);
    }
    100%{
        transform: translateX(50%);
    }
}
.screenbg > span:nth-child(1){
    top: 312px;
    left: 112px;
    position: absolute;
    width: 210px;
    height: 54px;
    background: url('./yun2.png');
    background-size: 100%;
    animation: move 3s linear infinite  alternate;
}
.screenbg > span:nth-child(2){
    top: 185px;
    left: 341px;
    position: absolute;
    width: 107px;
    height: 29px;
    background: url('./yun1.png');
    background-size: 100%;
    animation: move2 4s linear infinite  alternate;
}
.screenbg > span:nth-child(3){
    top: 105px;
    left: 1060px;
    position: absolute;
    width: 133px;
    height: 36px;
    background: url('./yun3.png');
    background-size: 100%;
    animation: move 3s linear infinite  alternate;
}
.screenbg ul li{display:block;list-style:none;position:fixed;overflow:hidden;top:0;left:0;width:100%;height:100%;z-index:-1000;float:right;}
.screenbg ul span{left:0;top:0;width:100%;height:100%;display:inline-block;margin:0;padding:0;cursor:default;background-image:url('') ;background-position:top center;background-attachment:fixed;background-repeat:no-repeat;background-size:cover;-moz-background-size:cover;-webkit-background-size:cover;}
.bottom{margin:8px auto 0 auto;width:100%;position:fixed;text-align:center;bottom:0;left:0;overflow:hidden;padding-bottom:8px;color:#ccc;word-spacing:3px;zoom:1;}
.bottom a{color:#FFF;text-decoration:none;}
.bottom a:hover{text-decoration:underline;}
.input-group { margin: 15px 0px 15px 0px; }
.input-group .glyphicon{color:#C5CFDB;}
.form-control, .input-group { height: 40px; }
.form-control { height: 39px\9;border-left:0;box-shadow:none;}

#loading_layer {visibility:visible;display:block !important;position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;z-index:10000}
#loading_layer img {position:fixed;top:50%;left:50%;width:64px;height:10px;margin:-5px 0 0 -32px}

.topbar{height:54px;width:100%;background: rgba(39, 124, 242, 1);position:relative}
.topmain{width:1200px;margin:0 auto;position:relative}
.topmain .logo{float:left;padding:0;margin:0;}
.topmain .logo a{display:block;min-width:400px;height:54px;background:url(logo.png) 0 center no-repeat;margin: 0 auto;}
.topmain .rtop{float:right;height:36px;line-height:36px;padding:8px 0 0; color: #ffffff;}
.topmain .rtop a, .topmain .rtop a:visited { color: #ffffff; }
@media screen and (max-width:400px){
    .topmain .logo a{width:100%;}
    .login-box{width:90%;padding:1.5em 0.5em 0.8em;}
}
@media screen and (max-height:400px){
    body{height:400px;overflow: auto;}
    .bottom{display: none;}
}
@media screen and (max-width:768px){
    body{overflow: hidden;}
    .topmain{ width: 100%;}
    .topmain .logo{float: none; text-align: center;}
    .topmain .logo a{background-position: center center;background-size: contain;}
    .topmain .rtop{display:none;}
}
.modal-header h4{ font-weight:bold; }
.house{
    position: absolute;
    width: 100%;
    height: 100vh;
    background-size: 100% 100%;
    top: 0;
    transform: translate(0, 0);
    z-index: -1;
}
.dot1{
    width: 10px;
    height: 10px;
    background-color: #4992ef;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
    animation: dot1 2s linear infinite;
    position: absolute;
}
.dot2{
    width: 10px;
    height: 10px;
    background-color: #4992ef;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
    animation: dot2 2s linear infinite;
    position: absolute;
}
.dot3{
    width: 10px;
    height: 10px;
    background-color: #4992ef;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
    animation: dot3 2s linear infinite;
    position: absolute;
}
/*ΑχΆ―*/
@keyframes dot1{
    100%{
        right: calc(18% - 6px);
        bottom: 32%;
    }
    70%{
        right: calc(22% - -12px);
        bottom: calc(28% - 14px);
    }
    50%{
        right: calc(33% - 0px);
        bottom: 31%;
    }
    40%{
        right: calc(34% - 0px);
        bottom: 31%;
    }
    30%{
        right: calc(35% - 0px);
        bottom: 31%;
    }
    0%{
        right: calc(37% - 6px);
        bottom: 29%;
    }
}
@keyframes dot2{
    100%{
        right: calc(18% - 6px);
        bottom: 32%;
    }
    0%{
        right: calc(31% - 22px);
        bottom: 19%;
    }
}
@keyframes dot3{
    0%{
        right: calc(22% - 6px);
        bottom: 10%;
    }
    30%{
        right: calc(19% - 2px);
        bottom: 14%;
    }
    70%{
        right: calc(22% - -12px);
        bottom: calc(28% - 14px);
    }
    100%{
        right: calc(18% - 6px);
        bottom: 32%;
    }
}