.banner {
  height: 48vw;
  background: url(./material/h.jpg) no-repeat;
  background-size: 100% 100%;
}

.list-area {
  margin: 0 4vw;
  margin-top: 5.333vw;
}

.list-area .list-item {
  display: flex;
  border-bottom: 1px solid #f0f0f0;
}

.list-area .list-item img {
  width: 29.333vw;
  height: 16.533vw;
  flex-shrink: 0;
}

.list-area .list-item img[data-img=""],
.list-area .list-item img:not([data-img]) {
  display: none;
}

.list-area .list-item + .list-item {
  margin-top: 4vw;
}

.list-area .list-item a {
  display: flex !important;
  color: #222;
  outline: 0;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

.list-area .list-item .list-item-info .list-item-title {
  font-weight: 400;
  font-size: 4.267vw;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}

.list-area .list-item .list-item-info .list-item-time {
  margin-bottom: 5.333vw;
  margin-top: 2.667vw;
  font-weight: 400;
  font-size: 2.667vw;
  color: #9ca1a7;
}

header {
  height: 11.733vw;
  background: #c0210e;
}

.box-pics {
  margin: 5.333vw 0;
}

.box-pics img {
  width: 100%;
  height: 47.2vw;
}

.box-pics .title {
  margin-top: 2.133vw;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.box-pics .pic-box + .pic-box {
  margin-top: 9.6vw;
}

.main-info {
  background: #f7f8fa;
  padding: 5.333vw 4vw;
}

.main-info .banner-pics {
  height: 45.867vw;
  background: red;
}

.show-banner {
  margin: 0 4vw;
  margin-top: 6.4vw;
  height: 24vw;
  font-weight: 600;
  font-size: 4.8vw;
  color: #262626;
  line-height: 24vw;
  padding-left: 10.667vw;
  position: relative;
}

.show-banner .arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 30.4vw;
  transform: translateY(-50%);
  width: 4.267vw;
  height: 4.267vw;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23262626" d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"/></svg>');
  transition: transform 0.3s;
}

.show-banner.geren {
  background: url(./个人业务.png) 100% 100%;
}

.show-banner.gongsi {
  margin-bottom: 6.4vw;
  background: url(./公司业务.png) 100% 100%;
}

.box {
  background: #fff;
  margin: 0 4vw;
}

.box + .box {
  margin-top: 6.4vw;
}

.box.box-header {
  position: relative;
  padding-top: 4vw;
  padding-bottom: 0;
  overflow: hidden;
}

.box.box-header::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  content: " ";
  width: 100%;
  height: 1.067vw;
  background: #db241e;
}

.box .box-header__title {
  font-weight: 600;
  font-size: 4.8vw;
  color: #262626;
  padding: 0 4vw;
  padding-bottom: 4vw;
  border-bottom: 1px solid rgba(196, 198, 207, 0.4);
  position: relative;
  display: flex;
  justify-content: space-between;
}

.video-box {
  height: 65vw;
}

.box .box-header__title .more {
  font-weight: 400;
  font-size: 3.733vw;
  color: #9ca1a7;
  display: flex;
  align-items: center;
  position: relative;
}

.box .box-header__title .more a {
  text-decoration: none;
  color: #9ca1a7;
}

.box .box-header__title .more.arrow {
  padding-right: 3.733vw;
}

.box .box-header__title .more.arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 3.2vw;
  height: 3.2vw;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%239CA1A7" d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"/></svg>');
  transition: transform 0.3s;
}

.box .box-list ul {
  padding-left: 4.267vw;
  padding-top: 4.267vw;
  list-style: square;
}

.box .box-list ul li {
  margin-bottom: 5.333vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.box .box-list ul li a {
  color: #111;
  text-decoration: none;
}

.box .video-box img {
  margin-top: 4vw;
  width: 100%;
}

.notice {
  display: flex;
  align-items: center;
  padding: 0 5.333vw 0 4.267vw;
  height: 21.333vw;
  background: rgba(219, 36, 30, 0.06);
  border-radius: 1.067vw;
}

.notice .text-info {
  margin-left: 5.067vw;
  font-size: 4.267vw;
  color: #111 !important;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

footer {
  height: 44.267vw;
  background: #f4f4f4;
  text-align: center;
  padding-top: 10.4vw;
}

footer ul {
  margin-top: 5.333vw;
  padding: 0 2.133vw;
  display: flex;
  justify-content: space-around;
  list-style: none;
}

footer ul li {
  position: relative;
  font-size: 3.2vw;
  color: #262626;
}

footer ul li + li::before {
  content: " ";
  position: absolute;
  top: 1.067vw;
  left: -3.2vw;
  width: 1px;
  height: 3.2vw;
  background: #d8d8d8;
}

footer .line {
  margin-top: -2.133vw;
}

footer span {
  font-size: 3.2vw;
  color: #262626;
  line-height: 4.8vw;
}

footer span + span {
  margin-left: 7.467vw;
}

footer .underline {
  text-decoration: underline;
}

.home-main {
  padding-bottom: 8vw;
  background: #f7f8fa;
}

.main-bg {
  background: url(/material/H5bg.png) no-repeat;
  background-size: 100% 100%;
  /* height: 93.867vw; */
  /* padding-top: 11.733vw; */
}

.main-bg .head-top {
  height: 11.733vw;
  padding-left: 4.267vw;
  padding-right: 6.4vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.main-bg .head-top .logo {
  width: 39.2vw;
  height: 8.533vw;
}

.main-bg .head-top .search {
  width: 6.4vw;
  height: 6.4vw;
}

.box + .box {
  margin-top: 5.333vw;
}

.pics {
  margin-top: 4vw;
  margin-bottom: 4.533vw;
}

.pics .pic {
  margin-bottom: 0;
  height: 19.47vw;
}

.pics .pic + .pic {
  margin-top: 2.667vw;
}

.pics .pic img {
  width: 100%;
  height: 19.47vw;
}

.pics-box {
  margin: 0 4vw;
  margin-top: 8vw;
  margin-bottom: 4.533vw;
}

.pics-box .pic {
  margin-bottom: 0;
}

.pics-box .pic + .pic {
  margin-top: 5.333vw;
}

.pics-box .pic img {
  width: 100%;
}

.video-section .video-box + .video-box {
  margin-top: 5.333vw;
}

.video-section .video-box img {
  height: 47.467vw;
}

.video-section .box {
  padding: 4vw;
}

.video-section .box + .box {
  margin-top: 5.333vw;
}

.outlink .line {
  padding: 0 5.333vw;
  padding-bottom: 5.333vw;
  display: flex;
  align-items: center;
}

.outlink .line .line-icon {
  width: 8vw;
  height: 8vw;
}

.outlink .line ul {
  margin-left: -2.667vw;
  list-style: none;
  display: flex;
}

.outlink .line ul li {
  font-size: 4vw;
}

.outlink .line ul li a {
  color: #111;
  text-decoration: none;
}

.outlink .line ul li + li {
  position: relative;
  margin-left: 8.267vw;
}

.outlink .line ul li + li::before {
  position: absolute;
  left: -4vw;
  top: 1.067vw;
  content: " ";
  display: inline-block;
  width: 1px;
  height: 4.267vw;
  background: #d8d8d8;
}

.service-section {
  margin-bottom: 5.333vw;
}

.service-section .box {
  padding-top: 6.667vw;
  display: flex;
  justify-content: center;
}

.service-section .qrcode-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 42.667vw;
}

.service-section .qrcode-box + .qrcode-box {
  margin-left: 8vw;
  width: 32vw;
}

.service-section .qrcode-box img {
  width: 32vw;
  height: 32vw;
}

.service-section .qrcode-box .text {
  margin-top: 4.267vw;
  margin-bottom: 7.467vw;
  color: #111;
}

section {
  margin-top: 8vw;
}

section .title {
  margin-left: 4vw;
  margin-bottom: 5.333vw;
  display: flex;
  align-items: center;
  position: relative;
  font-weight: 600;
  font-size: 6.4vw;
  color: #db241e;
}

section .title .eng {
  position: relative;
  top: 1.067vw;
  margin-left: 1.067vw;
  font-weight: 900;
  font-size: 5.867vw;
  color: rgba(196, 198, 207, 0.2);
}

section .title::before {
  display: flex;
  align-items: center;
  margin-right: 3.2vw;
  content: " ";
  width: 1.6vw;
  height: 6.4vw;
  background: #db241e;
}

.tops ul {
  padding-left: 8vw;
  margin-right: 4.267vw;
}

.tops ul li {
  color: #fff;
  font-weight: 300;
}

.tops ul li + li {
  margin-top: 2.133vw;
}

.tops ul li a {
  display: block;
  font-size: 3.733vw;
  color: #fff;
  text-decoration: none;
}

.swiper {
  margin: 0 4vw;
  margin-top: 5.333vw;
  height: 45.867vw;
}

.reports {
  margin: 0 4vw;
  margin-top: 1.667vw;
  display: flex;
}

.reports .report {
  flex: 1;
  height: 12vw;
  line-height: 12vw;
  text-align: center;
  font-weight: 600;
  font-size: 4.8vw;
  color: #fff;
}

.reports .report + .report {
  margin-left: 1.333vw;
}

.reports .report a {
  color: #fff;
  text-decoration: none;
  background: linear-gradient(90deg, #fff 0, #ffe3c9 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.reports .report:first-child {
  background: url(/material/bdj1.png);
  background-size: 100% 100%;
}

.reports .report:nth-child(2) {
  background: url(/material/bdj2.png);
  background-size: 100% 100%;
}

footer {
  height: 48vw;
  background: #c0210e;
  text-align: left;
  padding: 0 4vw;
  padding-top: 5.333vw;
}

footer .mini-line {
  font-size: 3.2vw;
  color: #fff;
  line-height: 4.8vw;
}

footer .tel {
  margin-left: 1.6vw;
}

footer ul {
  margin-top: 1.333vw;
  padding: 0;
  display: flex;
  justify-content: space-between;
  list-style: none;
}

footer ul li {
  position: relative;
  font-size: 3.2vw;
  color: #fff;
}

footer ul li a {
  color: #fff;
  text-decoration: none;
}

footer ul li + li::before {
  content: " ";
  position: absolute;
  top: 1.067vw;
  left: -3.2vw;
  width: 1px;
  height: 3.2vw;
  background: #d8d8d8;
}

footer .line {
  margin-top: -2.133vw;
}

footer span {
  font-size: 3.2vw;
  color: #fff;
  line-height: 4.8vw;
}

footer span + span {
  margin-left: 7.467vw;
}

footer .underline {
  text-decoration: underline;
}
