html,
body,
div,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
dl,
dt,
dd,
ol,
form,
input,
textarea,
th,
td,
select {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body {
  font-family: "Microsoft YaHei";
  font-size: 14px;
  color: #333;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

ul,
ol {
  list-style: none;
}

img {
  border: none;
  vertical-align: middle;
}

a {
  text-decoration: none;
  color: #232323;
}

table {
  border-collapse: collapse;
  table-layout: fixed;
}

input,
textarea {
  outline: none;
  border: none;
}

textarea {
  resize: none;
  overflow: auto;
}

.clearfix {
  zoom: 1;
}

.clearfix:after {
  content: ".";
  width: 0;
  height: 0;
  visibility: hidden;
  display: block;
  clear: both;
  overflow: hidden;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.tl {
  text-align: left;
}

.tc {
  text-align: center;
}

.tr {
  text-align: right;
}

.ellipse {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inline {
  display: inline-block;
  display: inline;
  zoom: 1;
}

html {
  font-size: 62.5%;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: #f0f2f5;
}

.container-xxl {
  width: 120rem;
  margin: 0 auto;
}

.main-box {
  flex: 1;
}

.btn-bg {
  background: #2274ff;
}

.header-box {
  background: #2274ff;
}
.header-box .logo img {
  width: 4.5rem;
  height: 4.5rem;
}
.header-box .container-xxl {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header-box .container-xxl .navigation-box .content {
  display: flex;
}
.header-box .container-xxl .navigation-box .content .item {
  position: relative;
}
.header-box .container-xxl .navigation-box .content .item > a {
  height: 6rem;
  display: inline-block;
  line-height: 6rem;
  padding: 0 1rem;
  color: #fff;
  font-size: 1.4rem;
}
.header-box .container-xxl .navigation-box .content .item:hover .sub-navs {
  display: block;
}
.header-box .container-xxl .navigation-box .content .item .avatar-box {
  display: flex;
  height: 100%;
  align-items: center;
  line-height: normal;
}
.header-box .container-xxl .navigation-box .content .item .avatar-box .avatar {
  width: 4rem;
  height: 4rem;
  overflow: hidden;
  border-radius: 50%;
}
.header-box .container-xxl .navigation-box .content .item .avatar-box .avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.header-box .container-xxl .navigation-box .content .item .sub-navs {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  min-width: 100%;
}
.header-box .container-xxl .navigation-box .content .item .sub-navs .sub-item {
  color: #777;
  border-bottom: 1px solid #f0f2f5;
}
.header-box .container-xxl .navigation-box .content .item .sub-navs .sub-item a {
  width: 100%;
  color: inherit;
  display: inline-block;
  padding: 0.5rem 2rem;
  white-space: nowrap;
  text-align: center;
}
.header-box .container-xxl .navigation-box .content .item .sub-navs .sub-item a .iconfont {
  margin-right: 1rem;
}
.header-box .container-xxl .navigation-box .content .item .sub-navs .sub-item a:hover {
  opacity: 0.8;
  background: rgba(0, 0, 0, 0.1);
}

.footer-box {
  height: 6rem;
  background: #333;
  text-align: center;
  color: #777;
  line-height: 6rem;
}

.my-web {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.my-web .title {
  font-size: 5rem;
  color: #333;
  margin-bottom: 1rem;
}
.my-web .layui-btn {
  padding-left: 5rem;
  padding-right: 5rem;
}

.login-box {
  padding: 4rem 0;
  display: flex;
  justify-content: center;
}
.login-box > .content {
  padding: 2rem;
  background: #FFF;
}
.login-box .form-box .title {
  padding-bottom: 2rem;
  font-size: 2.5rem;
  font-weight: 550;
}
.login-box .form-box .tabs {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #f0f2f5;
}
.login-box .form-box .tabs .item {
  padding: 1rem 2rem;
  margin-right: 0.5rem;
  color: #777;
  transition: all 0.5s ease-in-out;
  cursor: pointer;
  font-weight: 550;
  position: relative;
}
.login-box .form-box .tabs .item::before {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 0;
  border-bottom: 0.1rem solid #2274ff;
  transition: all 0.5s ease-in-out;
}
.login-box .form-box .tabs .item:hover {
  color: #2274ff;
}
.login-box .form-box .tabs .item:hover::before {
  width: 100%;
}
.login-box .form-box .tabs .active {
  color: #2274ff;
}
.login-box .form-box .forms > .item {
  display: none;
}
.login-box .form-box .forms > .active {
  display: block;
}
.login-box .form-box .forms .form .item {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
}
.login-box .form-box .forms .form .item .label {
  margin-bottom: 0.5rem;
  font-size: 1.6rem;
}
.login-box .form-box .forms .form .item .label i {
  color: #F56C6C;
}
.login-box .form-box .forms .form .item .input-group {
  flex-wrap: nowrap;
}
.login-box .form-box .forms .form .item .input-group .layui-form {
  width: 100%;
}
.login-box .form-box .forms .form .item .input-group .postpose-btn {
  height: auto;
  line-height: normal;
  padding: 1rem;
  background: #2274ff !important;
  color: #FFF !important;
  border: 1px solid #2274ff !important;
}
.login-box .form-box .forms .form .item .input {
  border: 1px solid #dee2e6;
  padding: 1rem;
  border-radius: 0.2rem;
  width: 100% !important;
  transition: all 0.3s;
}
.login-box .form-box .forms .form .item .input::-moz-placeholder {
  color: #777 !important;
}
.login-box .form-box .forms .form .item .input::placeholder {
  color: #777 !important;
}
.login-box .form-box .forms .form .item .input:focus {
  border-color: #2274ff !important;
  box-shadow: none !important;
}
.login-box .form-box .forms .form .item .input:focus + .postpose-btn {
  border-color: #2274ff !important;
}
.login-box .form-box .forms .form .item .layui-border {
  border-color: #dee2e6;
  color: #777;
}
.login-box .form-box .forms .form .item .layui-border:hover {
  border-color: #2274ff !important;
}
.login-box .form-box .forms .form .item .layui-btn-disabled {
  color: #777 !important;
  opacity: 0.8;
}
.login-box .form-box .forms .form .item .links-btn {
  display: flex;
  justify-content: space-between;
}
.login-box .form-box .forms .form .item .links-btn a {
  color: #777;
  transition: all 0.3s;
}
.login-box .form-box .forms .form .item .links-btn a:hover {
  color: #2274ff;
}
.login-box .form-box .tips {
  margin: 2rem 0 4rem 0;
  padding: 2rem;
  background: rgba(121, 174, 239, 0.2);
  font-size: 1.4rem;
  color: #777;
  position: relative;
}
.login-box .form-box .tips::before {
  content: "";
  position: absolute;
  width: 0.2rem;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(121, 174, 239, 0.5);
}
.login-box .form-box .tips span {
  margin-right: 0.5rem;
}
.login-box .content {
  width: 50%;
}/*# sourceMappingURL=index.css.map */