/** @format */

.header-swiper {
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.swiper-pagination > .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.5);
}

.swiper-pagination > .swiper-pagination-bullet-active {
  width: 36px;
  border-radius: 5px;
  background: #ffffff;
}
.swiper > .swiper-wrapper > .swiper-slide {
  position: relative;
  overflow: hidden;
}
.swiper > .swiper-wrapper > .swiper-slide > .banner-image {
  width: 100%;
  height: 100%;
  transform: scale(1.5);
  transition: all 6.5s;
  transition-delay: 1s;
  background-size: cover !important;
  position: relative;
}
.swiper > .swiper-wrapper > .swiper-slide > .banner-image::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  left: 0;
  top: 0;
}
.swiper > .swiper-wrapper > .swiper-slide-active > .banner-image {
  transform: scale(1) !important;
}
.swiper > .swiper-wrapper > .swiper-slide-1 > .banner-image {
  background: url("/assets/images/swiper_image/index/image_3.jpg") no-repeat;
}
.swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text,
.swiper > .swiper-wrapper > .swiper-slide-1 > .swiper-text,
.swiper > .swiper-wrapper > .swiper-slide-3 > .swiper-text {
  position: absolute;
  left: 15%;
  top: 50%;
  transform: translateY(-50%);
}
.swiper > .swiper-wrapper > .swiper-slide-1 > .swiper-text > h1,
.swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > h1,
.swiper > .swiper-wrapper > .swiper-slide-3 > .swiper-text > h1 {
  font-size: 48px;
  font-family: Source Han Sans CN-Bold, Source Han Sans CN;
  font-weight: bold;
  color: #ffffff;
  margin-bottom: 30px;
}
.swiper > .swiper-wrapper > .swiper-slide-1 > .swiper-text > p,
.swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > p,
.swiper > .swiper-wrapper > .swiper-slide-3 > .swiper-text > p {
  margin: 0;
  font-size: 18px;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 400;
  color: #ffffff;
  line-height: 30px;
}
.swiper > .swiper-wrapper > .swiper-slide-1 > .swiper-text > button,
.swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > button,
.swiper > .swiper-wrapper > .swiper-slide-3 > .swiper-text > button {
  width: 160px;
  height: 44px;
  background: #ffffff;
  border-radius: 20px;
  font-size: 16px;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 400;
  color: #232527;
  cursor: pointer;
  margin: 30px 0 0;
}

.swiper > .swiper-wrapper > .swiper-slide-2 > .banner-image {
  background: url("/assets/images/swiper_image/index/image_1.jpg") no-repeat;
}

.swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > p {
  font-size: 20px;
  font-weight: 300 !important;
}

.swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > div {
  width: 380px;
  height: 56px;
  background: #1e49d3;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > div > span {
  box-sizing: border-box;
  display: block;
  width: 25%;
  text-align: center;
  font-size: 24px;
  font-weight: 300;
  color: #ffffff;
  border-right: 1px solid #fff;
}

.swiper
  > .swiper-wrapper
  > .swiper-slide-2
  > .swiper-text
  > div
  > span:last-child {
  border: none;
}
.swiper > .swiper-wrapper > .swiper-slide-3 > .banner-image {
  background: url("/assets/images/swiper_image/index/image_2.jpg") no-repeat;
}
@media (max-width: 768px) {
  .header-swiper {
    height: 50vh;
  }
  .swiper > .swiper-wrapper > .swiper-slide > .swiper-text {
    width: 80%;
    top: 60%;
  }
  .swiper > .swiper-wrapper > .swiper-slide > .swiper-text > h1 {
    font-size: 1.75rem /* 28/16 */;
    white-space: pre-wrap;
  }
  .swiper > .swiper-wrapper > .swiper-slide > .swiper-text > p {
    box-sizing: border-box;
    margin: 20px 0 40px;
    font-size: 0.875rem /* 14/16 */;
  }
  .swiper > .swiper-wrapper > .swiper-slide > .swiper-text > button {
    width: 140px;
    height: 36px;
    font-size: 0.875rem /* 14/16 */;
  }
  .swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > div {
    width: 80%;
    height: 42px;
  }
  .swiper > .swiper-wrapper > .swiper-slide-2 > .swiper-text > div > span {
    font-size: 0.875rem /* 14/16 */;
  }
}
.main-container {
  width: 100%;
  max-width: 1200px;
  box-sizing: border-box;
  padding: 0 10px;
  margin: 70px auto 0;
}

.main-container > .title {
  box-sizing: border-box;
  padding: 0 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}

.main-container > .title > h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  color: #232527;
}

.main-container > .title > span {
  font-size: 14px;
  font-weight: 400;
  color: #575a64;
  cursor: pointer;
}
.main-container > .title > span:hover {
  color: #1e49d3;
}

main > .news-center > .news-center-main {
  margin: 0;
}
main > .news-center > .news-center-main > .news-center-main-item {
  padding: 0 10px;
}
main > .news-center > .news-center-main > .news-center-main-item > .img-box {
  padding: 0;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid #eef0f6;
  margin-bottom: 20px;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .img {
  position: relative;
  width: 100%;
  height: 160px;
  overflow: hidden;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .img
  > img {
  width: 100%;
  transition: all 0.5s;
  cursor: pointer;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .img
  > img:hover {
  transform: scale(1.3);
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .img
  > .btn {
  width: 106px;
  height: 32px;
  background: #1e49d3;
  border-radius: 4px 0px 4px 0px;
  position: absolute;
  left: 0;
  top: 0;
  cursor: pointer;
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
  text-align: center;
  line-height: 20px;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container {
  height: 180px;
  box-sizing: border-box;
  padding: 30px 20px;
  display: flex;
  justify-content: space-between;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .circles {
  width: 2px;
  height: 100%;
  background: #cfd3de;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .circles
  > span {
  display: block;
  width: 10px;
  height: 10px;
  background: #cfd3de;
  border-radius: 10px;
  position: relative;
  left: -4px;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .circles
  > .sel-circle {
  background: #1e49d3;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .swiper {
  margin: 0;
  width: calc(100% - 25px);
  height: 100%;
  overflow: hidden;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .swiper
  > .swiper-wrapper
  > .swiper-slide {
  height: 120px;
  cursor: pointer;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .swiper
  > .swiper-wrapper
  > .swiper-slide:hover
  > h4 {
  color: #1e49d3;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .swiper
  > .swiper-wrapper
  > .swiper-slide
  > h4 {
  margin: 10px 0 20px;
  font-size: 18px;
  font-weight: 500;
  color: #232527;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

main
  > .news-center
  > .news-center-main
  > .news-center-main-item
  > .img-box
  > .text-container
  > .swiper
  > .swiper-wrapper
  > .swiper-slide
  > p {
  margin: 0;
  font-size: 14px;
  font-weight: 400;
  color: #878b97;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project > .project-list {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
.project > .project-list > .col-container {
  box-sizing: border-box;
  padding: 0 10px;
  margin: 20px 0;
}
.project > .project-list > .col-container > .project-box {
  box-sizing: border-box;
  padding-bottom: 20px;
  margin: 0;
  background: #ffffff;
  border-radius: 4px;
  border: 1px solid #eef0f6;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.5s;
}

.project > .project-list > .col-container > .project-box:hover {
  box-shadow: 5px 5px 10px 10px #eef0f6;
  transform: translateY(-15px);
}

.project > .project-list > .col-container > .project-box > .img-box > img {
  width: 100%;
}

.project > .project-list > .col-container > .project-box > .peoject-des {
  height: calc(100% - 230px);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  overflow: hidden;
}

.project > .project-list > .col-container > .project-box > .peoject-des > h3 {
  font-size: 20px;
  font-weight: 500;
  color: #232527;
  margin: 0 auto;
  display: inline-block;
  text-align: center;
  box-sizing: border-box;
  border-bottom: 4px solid #1e49d3;
  margin: 20px 0;
  padding-bottom: 4px;
  width: 100px;
  transition: all 0.5s;
}

.project
  > .project-list
  > .col-container
  > .project-box
  :hover
  > .peoject-des
  > h3 {
  width: 80%;
  /* border-bottom: 4px solid rgba(30,73,211,.5); */
}

.project > .project-list > .col-container > .project-box > .peoject-des > p {
  font-size: 14px;
  font-weight: 300;
  color: #575a64;
  margin: 0;
  width: calc(100% - 40px);
  margin: 0 auto;
  text-align: center;
  line-height: 26px;
  /* letter-spacing: 1px; */
}

.case > .case-list {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}
.case > .case-list > .case-col-item {
  box-sizing: border-box;
  padding: 0 10px;
  margin: 20px 0;
}
.case > .case-list > .case-col-item > .case-box {
  background: #ffffff;
  border-radius: 4px;
  border: 1px solid #eef0f6;
  box-sizing: border-box;
  overflow: hidden;
  cursor: pointer;
}

.case > .case-list > .case-col-item > .case-box > .img-box > img {
  width: 100%;
}

.case > .case-list > .case-col-item > .case-box > .case-des {
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.case > .case-list > .case-col-item > .case-box > .case-des > p {
  margin: 0;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  color: #232527;
}

.case > .case-list > .case-col-item > .case-box > .case-des {
  /* transition: all .5s; */
}

.case > .case-list > .case-col-item > .case-box:hover > .case-des {
  background: #1e49d3;
}

.case > .case-list > .case-col-item > .case-box:hover > .case-des > p {
  /* transition: all .5s; */
}

.case > .case-list > .case-col-item > .case-box:hover > .case-des > p {
  color: white;
}

.case > .case-list > .case-col-item > .case-box > .img-box {
  overflow: hidden;
}

.case > .case-list > .case-col-item > .case-box > .img-box > img {
  transition: all 0.5s;
}

.case > .case-list > .case-col-item > .case-box:hover > .img-box > img {
  transform: scale(1.1);
}
.company > .company-swiper {
  box-sizing: border-box;
  padding: 0 10px;
}
.company > .company-swiper > .swiper-wrapper > .swiper-slide {
  width: calc(100% / 6);
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.company > .company-swiper > .swiper-wrapper > .swiper-slide > img {
  width: 100%;
  height: 120px;
}

.company > .conpany-des {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 120px;
}

.company > .conpany-des > small {
  font-size: 14px;
  font-weight: 400;
  color: #878b97;
  margin: 40px 0;
}

.company > .conpany-des > button {
  width: 190px;
  height: 44px;
  background: #1e49d3;
  border-radius: 2px;
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
}