@charset "utf-8";
/*login start*/
.p-login { background-color: #eef2f5;}
.login-wrap { position: fixed; top: 50%; left: 50%; width: 400px; margin-left: -200px; margin-top: -240px;}
.login-box { height: 480px; overflow: hidden; border-radius: 3px; box-shadow: 0 2px 8px rgba(0,0,0,.1); background-color: #fff;}
.login-banner { position: relative; height: 175px; overflow: hidden; padding: 25px 0 0; background-image: linear-gradient(#008aff,#1ac1ff); background-color: #008aff;}
.login-banner .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.login-banner::before,.login-banner::after { content: ''; display: block; position: absolute; width: 400px; height: 200px; }
.login-banner::before { animation: before 7s infinite; top: 90px; left: -150px; transform: rotate(40deg); background-color: rgba(255,255,255,.1); }
.login-banner::after { animation: after 7s infinite; top: 150px; right: -220px; transform: rotate(120deg); background-color: rgba(0,0,0,.1);}
.login-banner .logo { width: 100px; height: 100px; overflow: hidden; border-radius: 50%; border:5px solid rgba(255,255,255,0.2); margin: 0 auto 15px;}
.login-banner h2 { text-align: center; font-size: 16px; color: #fff; }
.login-banner .goback { position: absolute; top: 10px; right: 10px;}
.login-banner .goback a { font-size: 14px; color: #fff; opacity: .6;}
.login-form { width: 270px; padding: 20px 0 0; margin: 0 auto;}
.login-form li { height: 38px; margin-bottom: 22px;}
.login-form input { box-sizing: border-box; width: 100%; height: 38px; border:none; border-bottom: 1px solid #d0dae2; line-height: 38px; font-size: 14px; color: #647f93;}
.login-form input::placeholder {color: #647f93;}
.login-form input[type=submit] { background-color: #008aff; border-radius: 3px; font-size: 16px; color: #fff; cursor: pointer;}
.login-form input[type=submit]:hover { background-color: #1a96ff;}
.login-form li.code { position: relative;}
.login-form li.code input { width: 140px;}
.login-form li.code img { position: absolute; top: 0; right: 0; width: 84px; height: 38px; cursor: pointer;}
@keyframes before {
  0% { transform: rotate(40deg);}
  50% { transform: rotate(30deg);}
  100% { transform: rotate(40deg);}
}
@keyframes after {
  0% { transform: rotate(120deg);}
  50% { transform: rotate(140deg);}
  100% { transform: rotate(120deg);}
}
/*login end*/