* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
* ul,
* ol {
  list-style: none;
}
* h4 {
  display: block;
  margin-block-start: 1.33em;
  margin-block-end: 1.33em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
}
body {
  min-width: 1024px;
  max-width: 1920px;
  height: 1000px;
  background: url(/images/bg04.50b82e0.jpg) no-repeat !important;
}
.container {
  min-width: 1024px;
  max-width: 1920px;
  color: white;
  height: 100%;
  padding: 0 30px;
}
.container .header {
  min-width: 1024px;
  max-width: 1920px;
  justify-content: space-between;
  align-items: center;
  height: 75px;
  display: flex;
  background: url(/images/bg05.ee3b106.png) no-repeat;
}
.container .header img {
  width: 160px;
}
.container .header .title {
  font-size: 34px;
  letter-spacing: 13px;
}
.container .header .right {
  display: flex;
  align-items: center;
}
.container .header .right .temperature {
  font-size: 20px;
}
.container .header .right .weather {
  font-size: 20px;
  width: 40px;
  height: 24px;
  line-height: 24px;
  margin: 0px 14px 0px 6px;
  text-align: center;
  border-radius: 30px;
  background: #231f74;
}
.container .header .right .date {
  text-align: center;
}
.container .header .right .date .time {
  font-size: 24px;
}
.container .header .right .date .data {
  font-size: 12px;
}
.container .main {
  display: flex;
  justify-content: space-between;
}
.container .main .items {
  border: 1px solid rgba(75, 145, 178, 0.55);
  padding: 14px 0;
  font-size: 16px;
  position: relative;
  margin-bottom: 20px;
}
.container .main .title {
  text-align: center;
  margin-bottom: 26px;
  margin-top: 10px;
  font-size: 16px;
}
.container .main .main-left {
  width: 27%;
  display: flex;
  flex-direction: column;
}
.container .main .main-left .Access-status .Access-status-title {
  text-align: center;
  margin-bottom: 26px;
  margin-top: 10px;
  font-size: 16px;
}
.container .main .main-left .Access-status .Access-status-center {
  height: 240px;
  display: flex;
  justify-content: space-between;
  padding: 0px;
  align-items: center;
}
.container .main .main-left .Access-status .Access-status-center .left {
  width: 50%;
  height: 128px;
  padding: 0px;
  border-right: 1px solid #242251;
}
.container .main .main-left .Access-status .Access-status-center .left div {
  font-size: 16px;
  display: flex;
  height: 64px;
  align-items: center;
  justify-content: center;
}
.container .main .main-left .Access-status .Access-status-center .left div text {
  color: #fff475;
  margin-left: 10px;
}
.container .main .main-left .Access-status .Access-status-center .right {
  width: 50%;
  height: 180px;
  display: flex;
  position: relative;
}
.container .main .main-left .Borrow .Borrow-list {
  height: 544px;
  display: flex;
  flex-direction: column;
}
.container .main .main-left .Borrow .Borrow-list .bottom {
  display: flex;
  height: 192px;
  font-size: 16px;
}
.container .main .main-left .Borrow .Borrow-list .bottom .l {
  flex: 1 1 0%;
  display: flex;
  flex-direction: column;
  text-align: center;
}
.container .main .main-left .Borrow .Borrow-list .bottom .left .bar {
  flex: 1 1 0%;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.container .main .main-left .Borrow .Borrow-list .bottom .lend,
.container .main .main-left .Borrow .Borrow-list .bottom .return {
  align-items: center;
}
.container .main .main-left .Borrow .Borrow-list .bottom .lend .lend-list,
.container .main .main-left .Borrow .Borrow-list .bottom .return .lend-list,
.container .main .main-left .Borrow .Borrow-list .bottom .lend .return-list,
.container .main .main-left .Borrow .Borrow-list .bottom .return .return-list {
  width: 100%;
  height: 80px;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.container .main .main-left .Borrow .Borrow-list .bottom .lend .lend-list div,
.container .main .main-left .Borrow .Borrow-list .bottom .return .lend-list div,
.container .main .main-left .Borrow .Borrow-list .bottom .lend .return-list div,
.container .main .main-left .Borrow .Borrow-list .bottom .return .return-list div {
  position: relative;
  max-width: 165px;
  height: 80px;
  padding: 0px;
  margin: 0px;
  border-width: 0px;
  cursor: default;
}
.container .main .main-center {
  width: 45%;
  display: flex;
  flex-direction: column;
}
.container .main .main-center .top {
  font-size: 18px;
  height: 156px;
  background: rgba(88, 148, 240, 0.15);
  padding: 10px;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
}
.container .main .main-center .top .text {
  text-indent: 40px;
  line-height: 30px;
  overflow: hidden;
}
.container .main .main-center .top .time {
  text-align: right;
}
.container .main .main-center .center .layui-card-body1 {
  height: 376px;
  display: flex;
  padding: 0px;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  position: relative;
}
.container .main .main-center .center .layui-card-body1 #echarts-hyzt {
  position: relative;
  width: 100%;
  height: 376px;
  padding: 0px;
  margin: 0px;
  border-width: 0px;
  cursor: pointer;
}
.container .main .main-center .bottom {
  overflow: hidden;
}
.container .main .main-center .bottom ul {
  display: flex;
  justify-content: space-around;
}
.container .main .main-center .bottom ul li {
  float: left;
  max-width: 144px;
  height: 232px;
  margin: 0 10px;
}
.container .main .main-center .bottom ul li img {
  width: 100%;
  height: 194px;
  margin-bottom: 10px;
}
.container .main .main-center .bottom ul li div {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.container .main .main-center .bottom ul li .name {
  display: inline-block;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: center;
  font-size: 16px;
}
.container .main .main-right {
  width: 27%;
  display: flex;
  flex-direction: column;
}
.container .main .main-right .Borrow {
  height: 327px;
}
.container .main .main-right .Borrow .layui-card-body {
  margin-top: -52px;
}
.container .main .main-right .author .tagColud {
  height: 184px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 0;
  overflow: hidden;
}
.container .main .main-right .author .tagColud span {
  display: flex;
  padding: 0 6px;
  color: #ffffff;
  font-size: 18px;
  align-items: center;
}
.container .main .main-right .author .tagColud span:hover {
  background-color: #0000ff;
}
.container .main .main-right .author .tagColud span:nth-child(odd) {
  font-size: 14px;
  color: #fac858;
}
.container .main .main-right .author .tagColud span:nth-child(3) {
  font-size: 14px;
  color: #0177f7;
}
.container .main .main-right .author .tagColud span:nth-child(3):hover {
  background-color: #0177f7;
  color: #ffffff;
}
.container .main .main-right .author .tagColud span:nth-child(4) {
  font-size: 16px;
  color: #ac87d1;
}
.container .main .main-right .author .tagColud span:nth-child(4):hover {
  background-color: #ac87d1;
  color: #ffffff;
}
.container .main .main-right .author .tagColud span:nth-child(8) {
  font-size: 18px;
  color: #f27e7e;
}
.container .main .main-right .author .tagColud span:nth-child(8):hover {
  background-color: #f27e7e;
  color: #ffffff;
}
.container .main .main-right .author .tagColud span:nth-child(9) {
  font-size: 20px;
  color: #90ddaa;
}
.container .main .main-right .author .tagColud span:nth-child(9):hover {
  background-color: #90ddaa;
  color: #ffffff;
}
.container .main .main-right .author span:nth-child(11) {
  font-size: 16px;
  color: #ba7974;
}
.container .main .main-right .author span:nth-child(11):hover {
  background-color: #ba7974;
  color: #ffffff;
}
.container .main .main-right .author span:nth-child(13) {
  font-size: 16px;
  color: #f4e674;
}
.container .main .main-right .author span:nth-child(13):hover {
  background-color: #f4e674;
  color: #0c0c4d;
}
.container .main .main-right .author span:nth-child(14) {
  font-size: 16px;
  color: #3bcb6c;
}
.container .main .main-right .author span:nth-child(14):hover {
  background-color: #3bcb6c;
  color: #ffffff;
}
.container .main .main-right .author span:nth-child(15) {
  font-size: 18px;
  color: #5f95d2;
}
.container .main .main-right .author span:nth-child(15):hover {
  background-color: #5f95d2;
  color: #ffffff;
}
.container .main .main-right .author span:nth-child(16) {
  font-size: 20px;
  color: #874ec4;
}
.container .main .main-right .author span:nth-child(16):hover {
  background-color: #874ec4;
  color: #ffffff;
}
.container .main .main-right .author span:nth-child(17) {
  font-size: 20px;
  color: #fc8452;
}
.container .main .main-right .author span:nth-child(17):hover {
  background-color: #fc8452;
  color: #ffffff;
}
.container .main .Popular {
  height: 320px;
}
.container .main .Popular .list {
  display: flex;
  flex-direction: row;
  align-content: stretch;
  flex-wrap: wrap;
  justify-content: space-around;
}
.container .main .Popular .list span {
  display: flex;
  width: 45%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  height: 36px;
  line-height: 36px;
  background-color: #2a5ebb;
  margin: 0 0px 10px;
  padding: 0 5px;
  box-sizing: border-box;
}
