body {
  width: 100%;
  background: left top / 100% 532px no-repeat url("../images/banner-bg.jpg"),
    #ffffff;
}

.header {
  display: flex;
  align-items: center;
  width: 100%;
  height: 88px;
  background: center center / 100% 100% no-repeat url("../images/header-bg.png");
}

.header .header-container {
  position: relative;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  margin: 0 274px 0 258px;
}

.header .header-container .app-download:hover + .download-code {
  display: block;
}

.header .header-container .download-code {
  width: 110px;
  height: auto;
  background: #fff;
  text-align: center;
  padding: 10px 4px 4px;
  border-radius: 3px;
  position: absolute;
  right: 0;
  top: 80%;
  z-index: 9;
  display: none;
}
.header .header-container .download-code img {
  width: 100%;
  height: auto;
}

.header .header-container .logo-container {
  height: 65px;
  width: auto;
}

.header .header-container .logo-container img {
  width: auto;
  height: 100%;
}

.header .header-container .app-download {
  position: relative;
  background: #01432d;
  color: #fff;
  padding: 3px 6px 3px 39px;
  font-size: 18px;
  line-height: 1.05;
}

.header .header-container .app-download::before {
  content: "";
  width: 31px;
  height: 31px;
  position: absolute;
  background: url("../images/app.png") center center / 100% 100% no-repeat;
  left: -3px;
  top: -3px;
}

.main-banner {
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: space-between;
  padding-top: 65px;
  height: 446px;
}

.main-banner .banner-content {
  display: flex;
  justify-content: flex-end;
  width: 970px;
  height: 168px;
  padding-right: 168px;
  flex-shrink: 0;
  flex-grow: 0;
  background: left center / 736px 100% no-repeat url("../images/welcome.png");
}

.main-banner .nav-icons {
  display: flex;
  gap: 22px;
  flex-shrink: 0;
  flex-grow: 0;
}

.main-banner .nav-icons .nav-icon {
  align-self: flex-end;
  height: 58px;
  display: flex;
  align-items: center;
}
.main-banner .nav-icons .nav-icon img {
  height: 100%;
  width: auto;
}

.main-banner .nav-icons .nav-icon:nth-child(3) {
  width: 250px;
  height: 72px;
  align-self: start;
  flex-shrink: 0;
  flex-grow: 0;
  margin: 0 42px 14px 42px;
}

.main-banner .banner-content .login-btn {
  position: relative;
  align-self: end;
  height: 56px;
  width: 200px;
  margin-bottom: 10px;
}
.main-banner .banner-content .login-btn::before {
  content: "";
  width: 383px;
  height: 171px;
  position: absolute;
  bottom: -18px;
  left: -16px;
  pointer-events: none;
  background: center center / 100% 100% no-repeat url("../images/login-btn.png");
}
.content-area {
  height: 414px;
  display: grid;
  grid-template-columns: 1.68fr 1fr 1.68fr;
  padding: 55px 260px 42px 260px;
  gap: 28px;
}

.content-area .section-container {
  height: 100%;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-flow: column nowrap;
}
.content-area .section-container .section-header {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #007f5c;
  padding: 11px 20px 11px 14px;
  margin: -7px 10px 0 9px;
}
.content-area .section-container .section-header::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  bottom: -3px;
  left: 0;
  background: #007f5c;
}
.notice,
.news {
  margin-top: 7px;
}
.notice {
  background: right bottom / 268.2px 173px no-repeat
      url("../images/notice-bg.png"),
    #f2f2f2;
}
.news {
  background: right bottom / 263.3px 180px no-repeat
      url("../images/news-bg.png"),
    #f2f2f2;
}
.content-area .section-container .section-header h1 {
  font-size: 24px;
  color: #ffffff;
  line-height: 1;
  text-shadow: 0px 0px 7px rgba(6, 11, 0, 0.8);
}
.content-area .section-container .more-link {
  color: #ffffff;
}
.content-area .section-container .list {
  flex: 1;
  overflow: auto;
  padding: 27px 16px 28px 16px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.content-area .section-container .list .list-item {
  display: flex;
  font-weight: 400;
  font-size: 16px;
  gap: 13px;
}
.content-area .section-container .list .list-item .date {
  color: #095848;
}
.content-area .section-container .list .list-item .title {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #333333;
  cursor: pointer;
}
.content-area .special-section {
  display: flex;
  justify-content: center;
  overflow: hidden;
}
.content-area .special-section img {
  width: auto;
  height: 100%;
}
.footer {
  padding: 9px 0;
  color: #fff;
  font-size: 14px;
  background: linear-gradient(90deg, #002554 1%, #115740 100%);
}
.footer .footer-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 260px 0 275px;
}

.footer .footer-container .footer-logo {
  display: flex;
  align-items: center;
  font-size: 16px;
  gap: 22px;
}

.footer .footer-container .footer-logo .footer-logo-icon {
  background: center center / 100% 100% no-repeat
    url("../images/footer-logo.png");
  width: 81px;
  height: 34px;
}
