html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, em, img, strong, sub, b, u, i, dl, dt, dd, ol, ul, li, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, textarea, select {
  margin: 0;
  padding: 0;
  outline: 0;
  border: 0;
  background: transparent;
  vertical-align: baseline;
  box-sizing: border-box;
}
clear:after{content: '';display: block;clear: both;}
.transition{transition: all .3s ease;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;}
.flex {
  display: flex;
}
.flex-wrap {flex-wrap: wrap;}
.flex-1 {flex: 1;}
.flex-x-center {display: flex;justify-content: center;}
.flex-xy-center {display: flex;justify-content: center;align-items: center;}
.flex-y-center {display: flex;align-items: center;}

.flex-y-right {width: 260px;height: 16px;margin-left: 5px;text-align: right;}
.flex-end {display: flex;justify-content: flex-end;}
.flex-between {display: flex;justify-content: space-between;}
.line-1 {display: -webkit-box!important;overflow: hidden;text-overflow: ellipsis;word-break: break-all;-webkit-line-clamp: 1;-webkit-box-orient: vertical!important;}
.line-2 {display: -webkit-box!important;overflow: hidden;text-overflow: ellipsis;word-break: break-all;-webkit-line-clamp: 2;-webkit-box-orient: vertical!important;}


/* 登录 */
.login {position: relative;height: 100vh;background-repeat: no-repeat;background-position: center;background-size: cover;}
.login-main {width: 1100px;position: absolute;}
.login-main h1 {margin-bottom: 30px;font-size: 36px;color: #fff;}
.login-cont {position: relative;padding: 20px;background-color: #fff;border-radius: 15px;}
.login-tab {position: absolute;right: 0;top: 0;width: 90px;height: 90px;cursor: pointer;background: url("../images/login-bg.png") no-repeat center;text-align: right;}
.login-tab img {margin-top: 5px;margin-right: 5px;}
.login-tab .user {display: none;}
.login-tab.active .user {display: inline-block;}
.login-tab.active .code {display: none;}
.login-pic {width: 700px;display: block;}
.login-pic.code {display: none;}
.login-pic img {display: block;width: 100%;border-radius: 15px;}
.login-code {display: none;}
.login-tit {padding: 30px 0 40px 0;text-align: center;font-size: 28px;color: #3D3D3D;font-weight: 700;}
.login-code .code {width: 238px;height: 238px;margin: 0 auto 28px auto;box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.3);}
.login-code .code img {display: block;width: 100%;height: 100%;}
.login-cont .tip {width: 238px;margin: 0 auto;text-align: center;font-size: 15px;text-align: center;}
.login-code .tip span {color: #535BF4;}
.login-account {}
.login-form {width: 266px;margin: 0 auto;}
.login-form .item {margin-bottom: 38px;padding-left: 10px;border: 1px solid #D9D9D9;}
.login-form .item img {}
.login-form .item input {padding: 0 10px;height: 36px;line-height: 36px;}
.login-form .code {margin-bottom: 60px;}
.login-form .code .item {margin: 0;width: 0;}
.login-form .code .btn {width: 97px;height: 36px;margin-left: 5px;flex-shrink: 0;flex-grow: 0;}
.login-form .code .btn img {display: block;width: 100%;height: 100%;}
.login-form .submit {line-height: 40px;background: #5071FF;text-align: center;color: #fff;font-size: 18px;border-radius: 5px;}
.login-form .submit:hover {
  cursor:pointer;
}
.login-foot {position: absolute;left: 0;bottom: 20px;width: 100%;text-align: center;color: #fff;font-size: 12px;}
.login-foot p {display: inline-block;margin: 0 23px;}

.sk-rotating-plane {
  display: none;
  width: 80px;
  height: 80px;
  margin: auto;
  background-color: white;
  -webkit-animation: sk-rotating-plane 1.2s infinite ease-in-out;
  animation: sk-rotating-plane 1.2s infinite ease-in-out;
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -40px;
  margin-top: -80px;
}
.sk-rotating-plane.active{display: block;}

@keyframes sk-rotating-plane{
  0% {
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
  }
  50% {
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
  }
  100% {
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}

@keyframes login-small{
  0%{
    transform: scale(1);-moz-transform: scale(1);	/* Firefox 4 */-webkit-transform: scale(1);	/* Safari 和 Chrome */-o-transform: scale(1);	/* Opera */-ms-transform:scale(1); 	/* IE 9 */
  }
  100%{
    transform: scale(0.2);-moz-transform: scale(0.1);	/* Firefox 4 */-webkit-transform: scale(0.2);	/* Safari 和 Chrome */-o-transform: scale(0.1);	/* Opera */-ms-transform:scale(0.1); 	/* IE 9 */
  }
}

@media screen and (max-width: 1200px) {
  .login-main{width: 100%; align-items: center;}
  .login-pic {display: none;}
  .login-cont {
    width: 300px;
  }
}