.list_nav {
  position: fixed;
  width: 72px;
  height: 200px;
  left: 40px;
  bottom: 40px;
  z-index: 999;
}
.list_nav ul li {
  margin-bottom: 24px;
}
.list_nav ul li.active a {
  color: #FFFFFF;
  font-weight: 700;
}
.list_nav ul li a {
  font-size: 12px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.3);
}
.list_nav.is-dark ul li a {
  color: rgba(38, 38, 38, 0.3);
}
.list_nav.is-dark ul li.active a {
  color: #262626;
}
html.page-is-animating {
  scroll-behavior: auto !important;
}
html.page-is-animating,
html.page-is-animating body {
  overscroll-behavior: none;
}
@media (prefers-reduced-motion: reduce) {
  .introduce .introduce_content {
    transition-duration: 0.01ms;
  }
}
.introduce {
  position: relative;
  width: 100%;
  height: 100vh;
  background: url('../images/company/all.png') no-repeat center center;
  background-size: cover;
  overflow: hidden;
  touch-action: none;
}
.introduce .introduce_content {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  padding-top: 160px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(0, 60px, 0);
  transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.8s;
  will-change: opacity, transform;
}
.introduce .introduce_content h4 {
  font-weight: 500;
  font-size: 26px;
  color: #fff;
}
.introduce .introduce_content p {
  font-size: 22px;
  line-height: 1.5;
  color: #fff;
  text-align: center;
}
.introduce .introduce_content.active {
  z-index: 3;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
  transition-delay: 0s;
}
.introduce .introduce_content.is-leaving-up {
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, -50px, 0);
}
.introduce .introduce_content.is-leaving-down {
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 50px, 0);
}
.introduce .introduce_content.is-entering-from-top {
  transform: translate3d(0, -60px, 0);
}
.introduce .introduce_content.is-entering-from-bottom {
  transform: translate3d(0, 60px, 0);
}
.describle1 {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
.describle1 .describle1_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.describle1 .describle1_bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.describle1 .describle1_mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0) 100%);
}
.describle1 .describle1_info {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(0, 70px, 0);
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1), transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 1.2s;
  will-change: opacity, transform;
}
.describle1 .describle1_info.active {
  z-index: 4;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
  transition-delay: 0s;
}
.describle1 .describle1_info.is-leaving-up {
  z-index: 3;
  opacity: 0;
  transform: translate3d(0, -60px, 0);
}
.describle1 .describle1_info .is-leaving-down {
  z-index: 3;
  opacity: 0;
  transform: translate3d(0, 60px, 0);
}
.describle1 .describle1_info .is-entering-from-top {
  opacity: 0;
  transform: translate3d(0, -70px, 0);
}
.describle1 .describle1_info .is-entering-from-bottom {
  opacity: 0;
  transform: translate3d(0, 70px, 0);
}
.describle1 .describle1_info h4 {
  color: #fff;
  font-weight: 700;
  font-size: 80px;
}
.describle1 .describle1_info p {
  color: #fff;
  font-weight: 300;
  font-size: 80px;
}
.describle2 {
  position: relative;
  width: 100%;
  height: 100vh;
  background: url('../images/company/describle.png') no-repeat center center;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.describle2 .describle2_con {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 80px 0 140px;
}
.describle2 .describle2_con .describle2_left {
  width: 520px;
}
.describle2 .describle2_con .describle2_left h4 {
  font-size: 56px;
  font-weight: 600;
  color: #FFFFFF;
}
.describle2 .describle2_con .describle2_left p {
  font-size: 14px;
  color: #FFFFFF;
  margin-top: 16px;
  line-height: 1.5;
  text-align: justify;
}
.describle2 .describle2_con .describle2_left .about_nums {
  margin-top: 48px;
  display: flex;
  justify-content: space-between;
}
.describle2 .describle2_con .describle2_left .about_nums .about_num {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.describle2 .describle2_con .describle2_left .about_nums .about_num .about_numvalue {
  color: #FFFFFF;
  font-weight: 400;
  font-size: 16px;
}
.describle2 .describle2_con .describle2_left .about_nums .about_num .about_numvalue span {
  font-weight: 400;
  font-size: 60px;
}
.describle2 .describle2_con .describle2_left .about_nums .about_num .about_numlabel {
  color: #FFFFFF;
  font-size: 16px;
}
.describle2 .describle2_con .describle2_right {
  position: relative;
  width: 540px;
}
.describle2 .describle2_con .describle2_right .swiper {
  width: 100%;
  height: 100%;
}
.describle2 .describle2_con .describle2_right .swiper .swiper-slide {
  width: 540px !important;
}
.describle2 .describle2_con .describle2_right .swiper .swiper-slide .describle2_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 540px;
}
.describle2 .describle2_con .describle2_right .swiper .swiper-slide .describle2_item .describle2_iteminfo {
  text-align: center;
}
.describle2 .describle2_con .describle2_right .swiper .swiper-slide .describle2_item .describle2_iteminfo .describle2_itemarea {
  font-size: 40px;
  font-weight: 500;
  color: #fff;
}
.describle2 .describle2_con .describle2_right .swiper .swiper-slide .describle2_item .describle2_iteminfo p {
  margin-top: 8px;
  font-size: 16px;
  color: #fff;
}
.describle2 .describle2_con .describle2_right .swiper .swiper-slide .describle2_itemimg {
  margin-top: 28px;
  width: 540px;
  height: 315px;
}
.describle2 .describle2_con .describle2_right .swiper .swiper-slide .describle2_itemimg img {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  object-fit: cover;
}
.describle2 .describle2_con .describle2_right .swiper-pagination {
  position: absolute;
  bottom: -20px;
}
.describle2 .describle2_con .describle2_right .swiper-pagination .swiper-pagination-bullet {
  width: 40px;
  height: 2px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.5);
}
.describle2 .describle2_con .describle2_right .swiper-pagination .swiper-pagination-bullet-active {
  background: #004C97;
}
.prove {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.prove .prove_info {
  text-align: center;
  padding-top: 40px;
}
.prove .prove_info h5 {
  font-size: 56px;
  font-weight: 500;
  color: #262626;
}
.prove .prove_info p {
  font-size: 16px;
  color: #262626;
  margin-top: 10px;
}
.prove .prove_swiper {
  position: relative;
  margin-top: 50px;
}
.prove .prove_swiper .proveswiper .swiper-slide {
  width: auto !important;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
}
.prove .prove_swiper .proveswiper .prove_item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.prove .prove_swiper .proveswiper .prove_item .prove_itemname {
  font-size: 20px;
  color: #262626;
  text-wrap: nowrap;
  text-align: center;
  margin-bottom: 16px;
}
.prove .prove_swiper .proveswiper .prove_item .prove_itemcover {
  height: 350px;
}
.prove .prove_swiper .proveswiper .prove_item .prove_itemcover img {
  width: auto;
  height: 100%;
}
.prove .prove_swiper .prove_bt {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40px;
}
.prove .prove_swiper .prove_bt .caseswiper_prev,
.prove .prove_swiper .prove_bt .caseswiper_next {
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(38, 38, 38, 0.05);
}
.prove .prove_swiper .prove_bt .caseswiper_prev span,
.prove .prove_swiper .prove_bt .caseswiper_next span {
  color: rgba(38, 38, 38, 0.25);
  font-weight: 500;
}
.prove .prove_swiper .prove_bt .swiper-pagination {
  position: relative;
  top: 0;
  left: 0;
  height: 36px;
  padding: 0 16px;
  border-radius: 36px;
  background: rgba(38, 38, 38, 0.05);
  margin: 0 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto !important;
}
.prove .prove_swiper .prove_bt .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 6px;
  height: 6px;
  border-radius: 6px;
  background: #262626 !important;
  opacity: 1;
}
.prove .prove_swiper .prove_bt .swiper-pagination .swiper-pagination-bullet {
  opacity: 1;
  width: 6px;
  height: 6px;
  border-radius: 6px;
  background: rgba(38, 38, 38, 0.25) !important;
  transition: all 0.2s linear;
}
.carselects {
  position: relative;
  width: 100%;
  height: 100vh;
  background: #FAFAFA;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.carselects .carselect {
  width: 1080px;
  margin: 0 auto;
}
.carselects .carselect .car_title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.carselects .carselect .car_title h4 {
  font-size: 56px;
  font-weight: 500;
  color: #262626;
}
.carselects .carselect .car_title .caricon {
  display: flex;
  align-items: center;
}
.carselects .carselect .car_title .caricon img {
  margin-left: 32px;
}
.carselects .carselect .car_banner {
  position: relative;
  margin-top: 24px;
}
.carselects .carselect .car_banner img {
  width: 100%;
  height: auto;
}
.carselects .carselect .car_banner .dots {
  cursor: pointer;
  position: absolute;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.carselects .carselect .car_banner .dots:hover .dots_text {
  opacity: 1;
}
.carselects .carselect .car_banner .dots.dot1 {
  top: 180px;
  left: 140px;
}
.carselects .carselect .car_banner .dots.dot2 {
  top: 280px;
  left: 265px;
}
.carselects .carselect .car_banner .dots.dot3 {
  top: 150px;
  left: 400px;
}
.carselects .carselect .car_banner .dots.dot4 {
  top: 320px;
  left: 550px;
}
.carselects .carselect .car_banner .dots.dot5 {
  top: 160px;
  left: 720px;
}
.carselects .carselect .car_banner .dots.dot6 {
  top: 180px;
  left: 860px;
}
.carselects .carselect .car_banner .dots.dot7 {
  top: 290px;
  left: 960px;
}
.carselects .carselect .car_banner .dots .dot {
  width: 24px;
  height: 24px;
  border-radius: 24px;
  background: #004C97;
  display: flex;
  justify-content: center;
  align-items: center;
}
.carselects .carselect .car_banner .dots .dot span {
  font-size: 14px;
  color: #FFFFFF;
}
.carselects .carselect .car_banner .dots .pluse {
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  border-radius: 40px;
  background: rgba(0, 76, 151, 0.2);
  animation: expand 1s infinite;
}
.carselects .carselect .car_banner .dots .dots_text {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 48px;
  padding: 8px;
  border-radius: 8px;
  background: rgba(0, 76, 151, 0.8);
  color: #fff;
  font-size: 14px;
  white-space: nowrap;
  display: inline-block;
  transition: all 0.2s linear;
}
@keyframes expand {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.2);
  }
}
.cocreate {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.cocreate .cocreate_con {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 1080px;
  margin: 0 auto;
}
.cocreate .cocreate_con.cocreate_con2 {
  align-items: center;
}
.cocreate .cocreate_con .cocreate_lf {
  width: 640px;
}
.cocreate .cocreate_con .cocreate_lf h4 {
  font-size: 56px;
  font-weight: 500;
  color: #262626;
}
.cocreate .cocreate_con .cocreate_lf p {
  font-size: 14px;
  color: #262626;
  text-align: justify;
  margin-top: 16px;
}
.cocreate .cocreate_con .cocreate_lf .cocreate_btns {
  display: flex;
  margin-top: 20px;
}
.cocreate .cocreate_con .cocreate_lf .cocreate_btns .cocreate_btn {
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(38, 38, 38, 0.05);
  margin-right: 24px;
}
.cocreate .cocreate_con .cocreate_lf .cocreate_btns .cocreate_btn span {
  color: rgba(38, 38, 38, 0.25);
}
.cocreate .cocreate_con .cocreate_lf .idea_detail {
  display: flex;
  align-items: flex-start;
  margin-top: 40px;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .sliderbar {
  display: flex;
  text-align: center;
  align-self: flex-start;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .sliderbar ul {
  flex-shrink: 0;
  width: 120px;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .sliderbar ul li {
  cursor: pointer;
  height: 68px;
  display: flex;
  align-items: center;
  text-align: left;
  font-size: 16px;
  color: rgba(38, 38, 38, 0.3);
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .sliderbar ul li.active {
  color: #262626;
  font-weight: 700;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .sliderbar .line {
  position: relative;
  width: 2px;
  height: auto;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 2px;
  overflow: hidden;
  margin-left: 14px;
  align-self: stretch;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .sliderbar .line .bar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 68px;
  background: #000000;
  border-radius: 2px;
  transition: all 0.2s linear;
  will-change: top, height;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .detail {
  padding-left: 32px;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .detail .swiper {
  height: 340px;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .detail .swiper-slide {
  height: 340px;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .detail .detail_item {
  width: 460px;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .detail .detail_item img {
  width: 460px;
  height: 270px;
  border-radius: 12px;
}
.cocreate .cocreate_con .cocreate_lf .idea_detail .detail .detail_item p {
  margin-top: 16px;
  font-size: 14px;
  color: #262626;
}
.cocreate .cocreate_con .cocreate_rt .cocreate_nums .about_num {
  width: 320px;
  height: 180px;
  border-radius: 12px;
  border: 1px solid #D8D8D8;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.cocreate .cocreate_con .cocreate_rt .cocreate_nums .about_num .about_numvalue {
  color: #262626;
  font-weight: 400;
  font-size: 16px;
}
.cocreate .cocreate_con .cocreate_rt .cocreate_nums .about_num .about_numvalue span {
  font-weight: 400;
  font-size: 80px;
}
.cocreate .cocreate_con .cocreate_rt .cocreate_nums .about_num .about_numlabel {
  font-size: 16px;
  color: rgba(38, 38, 38, 0.7);
}
.service {
  background: #000000;
}
.service .serve1 {
  width: 100%;
  height: 100vh;
}
.service .serve1 .five_stars {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 1160px;
  margin: 0 auto;
  height: 100%;
}
.service .serve1 .five_stars .stars_lf {
  width: 480px;
  flex-shrink: 0;
}
.service .serve1 .five_stars .stars_lf h5 {
  font-size: 56px;
  font-weight: 500;
  color: #FFFFFF;
}
.service .serve1 .five_stars .stars_lf h6 {
  font-size: 24px;
  font-weight: normal;
  color: #FFFFFF;
  margin-top: 8px;
}
.service .serve1 .five_stars .stars_lf p {
  font-size: 14px;
  line-height: 1.5;
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.7);
  text-align: justify;
}
.service .serve1 .five_stars .stars_lf .tel {
  display: flex;
  align-items: center;
  margin-top: 80px;
}
.service .serve1 .five_stars .stars_lf .tel img {
  width: 32px;
  height: 32px;
  margin-right: 8px;
}
.service .serve1 .five_stars .stars_lf .tel .tel_phone {
  font-size: 24px;
  color: #FFFFFF;
}
.service .serve1 .five_stars .stars_rt {
  display: flex;
  flex-wrap: wrap;
  margin-right: -50px;
  width: 680px;
  gap: 16px;
}
.service .serve1 .five_stars .stars_rt .stars_item {
  width: 320px;
  height: 190px;
  border-radius: 20px;
  background: #262626;
  padding: 24px;
}
.service .serve1 .five_stars .stars_rt .stars_item .stars_itemtitle {
  font-size: 16px;
  font-weight: 500;
  color: #FFFFFF;
}
.service .serve1 .five_stars .stars_rt .stars_item ul {
  margin-top: 8px;
}
.service .serve1 .five_stars .stars_rt .stars_item ul li {
  position: relative;
  font-size: 14px;
  line-height: 28px;
  color: rgba(255, 255, 255, 0.7);
  padding-left: 0;
  text-wrap: nowrap;
}
.service .serve1 .five_stars .stars_rt .stars_item ul li::before {
  position: absolute;
  left: -12px;
  top: 50%;
  transform: translateY(-50%);
  content: '·';
  font-size: 14px;
  font-weight: bold;
  color: rgba(255, 255, 255, 0.7);
}
.service .serve2 {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  isolation: isolate;
  /*
     * 图片动画完成后的目标位置
     */
  /*
     * 图片容器
     */
  /*
     * 适配较小PC屏幕
     */
}
.service .serve2 .serve_nums {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0);
  transition: opacity 0.75s ease, transform 1s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0s;
  will-change: opacity, transform;
  z-index: 3;
}
.service .serve2 .serve_nums .serve_num {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 32px;
}
.service .serve2 .serve_nums .serve_num .serve_numvalue {
  color: #FFFFFF;
  font-size: 16px;
}
.service .serve2 .serve_nums .serve_num .serve_numvalue span {
  font-weight: 400;
  font-size: 80px;
}
.service .serve2 .serve_nums .serve_num .serve_numlabel {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.7);
}
.service .serve2 .serve_hotservie {
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 70px, 0);
  transition: opacity 0.8s ease, transform 1.1s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.9s;
  will-change: opacity, transform;
  z-index: 4;
}
.service .serve2 .serve_hotservie .serve_hotservietitle {
  color: rgba(255, 255, 255, 0.7);
  font-size: 22px;
}
.service .serve2 .serve_hotservie p {
  font-size: 80px;
  color: #fff;
  font-weight: 500;
  margin-top: 4px;
}
.service .serve2.show-hotservice .serve_nums {
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, -70px, 0);
  transition: opacity 0.65s ease, transform 1s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.8s;
}
.service .serve2.show-hotservice .serve_hotservie {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0);
  transition-delay: 0.2s, 0.2s, 0s;
}
.service .serve2.images-visible .serve2_imgs img,
.service .serve2.show-hotservice .serve2_imgs img {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1) rotate(var(--image-rotate));
  /*
                 * 右上主视觉大图
                 * 向上、向右超出一部分
                 */
  /*
                 * 第一组数字左上方
                 */
  /*
                 * 中部小图，与数字区域产生穿插
                 */
  /*
                 * 数字区域右下方
                 */
  /*
                 * 左下主视觉大图
                 */
  /*
                 * 右下大图，只露出上半部分
                 */
  /*
                 * 左上边缘图片
                 */
  /*
                 * 左侧中部，超出页面一部分
                 */
  /*
                 * 底部中间图片
                 */
  /*
                 * 右侧中部，超出页面一部分
                 */
  /*
                 * 左下边缘，只展示上半部分
                 */
  /*
                 * 顶部中间，只展示下半部分
                 */
  /*
                 * 与serve_nums重叠的图片
                 */
}
.service .serve2.images-visible .serve2_imgs img:nth-child(1),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(1) {
  top: 6%;
  left: 84%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(2),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(2) {
  top: 31%;
  left: 32%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(3),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(3) {
  top: 47%;
  left: 49%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(4),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(4) {
  top: 67%;
  left: 66%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(5),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(5) {
  top: 80%;
  left: 24%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(6),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(6) {
  top: 108%;
  left: 84%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(7),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(7) {
  top: -7%;
  left: 7%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(8),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(8) {
  top: 49%;
  left: -2%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(9),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(9) {
  top: 106%;
  left: 49%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(10),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(10) {
  top: 48%;
  left: 103%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(11),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(11) {
  top: 109%;
  left: 6%;
}
.service .serve2.images-visible .serve2_imgs img:nth-child(12),
.service .serve2.show-hotservice .serve2_imgs img:nth-child(12) {
  top: -9%;
  left: 57%;
}
.service .serve2.images-visible .serve2_imgs img.is-muted,
.service .serve2.show-hotservice .serve2_imgs img.is-muted {
  opacity: 0.4;
  transition-delay: 0s;
}
.service .serve2 .serve2_imgs {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}
.service .serve2 .serve2_imgs img {
  --image-delay: 0s;
  --image-rotate: 0deg;
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  height: auto;
  object-fit: cover;
  border-radius: 2px;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0) rotate(0deg);
  transition: top 1.5s cubic-bezier(0.16, 1, 0.3, 1), left 1.5s cubic-bezier(0.16, 1, 0.3, 1), transform 1.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.9s ease;
  transition-delay: var(--image-delay);
  will-change: top,
                        left,
                        transform,
                        opacity;
  /*
             * 右上主视觉图
             */
  /*
             * 左中上小图
             */
  /*
             * 中部小图
             */
  /*
             * 数字下方图片
             */
  /*
             * 左下主视觉大图
             */
  /*
             * 右下超大图
             */
  /*
             * 左上边缘图
             */
  /*
             * 左侧中部图
             */
  /*
             * 底部中间图
             */
  /*
             * 右侧中部图
             */
  /*
             * 左下边缘图
             */
  /*
             * 顶部中间图
             */
}
.service .serve2 .serve2_imgs img:nth-child(1) {
  width: clamp(360px, 35vw, 520px);
  aspect-ratio: 1.85 / 1;
  --image-delay: 0s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(2) {
  width: clamp(190px, 18vw, 260px);
  aspect-ratio: 1.6 / 1;
  --image-delay: 0.06s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(3) {
  width: clamp(90px, 10vw, 140px);
  aspect-ratio: 1.55 / 1;
  --image-delay: 0.12s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(4) {
  width: clamp(210px, 20vw, 280px);
  aspect-ratio: 1.6 / 1;
  --image-delay: 0.18s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(5) {
  width: clamp(280px, 27vw, 390px);
  aspect-ratio: 1.65 / 1;
  --image-delay: 0.24s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(6) {
  width: clamp(380px, 38vw, 560px);
  aspect-ratio: 1.85 / 1;
  --image-delay: 0.3s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(7) {
  width: clamp(210px, 21vw, 300px);
  aspect-ratio: 1.6 / 1;
  --image-delay: 0.36s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(8) {
  width: clamp(180px, 17vw, 240px);
  aspect-ratio: 1.55 / 1;
  --image-delay: 0.42s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(9) {
  width: clamp(270px, 27vw, 390px);
  aspect-ratio: 1.7 / 1;
  --image-delay: 0.48s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(10) {
  width: clamp(230px, 23vw, 320px);
  aspect-ratio: 1.6 / 1;
  --image-delay: 0.54s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(11) {
  width: clamp(310px, 32vw, 460px);
  aspect-ratio: 1.75 / 1;
  --image-delay: 0.6s;
  --image-rotate: 0deg;
}
.service .serve2 .serve2_imgs img:nth-child(12) {
  width: clamp(230px, 24vw, 340px);
  aspect-ratio: 1.65 / 1;
  --image-delay: 0.66s;
  --image-rotate: 0deg;
}
@media screen and (max-width: 1440px) {
  .service .serve2.images-visible .serve2_imgs img:nth-child(1),
  .service .serve2.show-hotservice .serve2_imgs img:nth-child(1) {
    left: 87%;
  }
  .service .serve2.images-visible .serve2_imgs img:nth-child(2),
  .service .serve2.show-hotservice .serve2_imgs img:nth-child(2) {
    left: 29%;
  }
  .service .serve2.images-visible .serve2_imgs img:nth-child(4),
  .service .serve2.show-hotservice .serve2_imgs img:nth-child(4) {
    left: 69%;
  }
  .service .serve2.images-visible .serve2_imgs img:nth-child(5),
  .service .serve2.show-hotservice .serve2_imgs img:nth-child(5) {
    left: 20%;
  }
  .service .serve2.images-visible .serve2_imgs img:nth-child(6),
  .service .serve2.show-hotservice .serve2_imgs img:nth-child(6) {
    left: 87%;
  }
  .service .serve2.images-visible .serve2_imgs img:nth-child(9),
  .service .serve2.show-hotservice .serve2_imgs img:nth-child(9) {
    left: 48%;
  }
}
.company_culture {
  position: relative;
  width: 100%;
  height: 100vh;
  background: #000;
  overflow: hidden;
}
.company_culture .culture {
  width: 100%;
  height: 100%;
  display: flex;
}
.company_culture .spec_item {
  cursor: pointer;
  height: 100%;
  flex: 1 1 0;
  transition: all 0.3s;
  border-right: 1px solid rgba(255, 255, 255, 0.3);
}
.company_culture .spec_item:last-child {
  border-right: 0;
}
.company_culture .spec_item.active {
  flex: 0 0 900px !important;
}
.company_culture .spec_item.active .spec_itemtab {
  width: 0;
  display: none;
}
.company_culture .spec_item.active .spec_itemcontent {
  width: 100%;
  height: 100%;
  display: block;
  padding: 80px 180px 0;
}
.company_culture .spec_item.active .spec_itemcontent.spec_itemcontent1 {
  background: url('../images/company/culture/aim.png') no-repeat center center;
  background-size: cover;
}
.company_culture .spec_item.active .spec_itemcontent.spec_itemcontent2 {
  background: url('../images/company/culture/jcgb_bg.png') no-repeat center center;
  background-size: cover;
  padding-top: 20px !important;
}
.company_culture .spec_item.active .spec_itemcontent.spec_itemcontent3 {
  background: url('../images/company/culture/mf_bg.png') no-repeat center center;
  background-size: cover;
}
.company_culture .spec_item.active .spec_itemcontent.spec_itemcontent4 {
  background: url('../images/company/culture/yy_bg.png') no-repeat center center;
  background-size: cover;
}
.company_culture .spec_item.active .spec_itemcontent h4 {
  font-size: 72px;
  font-weight: 500;
  color: #fff;
}
.company_culture .spec_item.active .spec_itemcontent p {
  margin-top: 80px;
  line-height: 1.5;
  font-weight: 400;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.7);
  text-align: justify;
}
.company_culture .spec_item.active .spec_itemcontent p span {
  color: #fff;
  font-weight: 600;
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs {
  margin-top: 20px;
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb {
  position: relative;
  height: 116px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin-bottom: 16px;
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb:nth-child(1) {
  background-image: url('../images/company/culture/j_bg.png');
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb:nth-child(2) {
  background-image: url('../images/company/culture/c_bg.png');
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb:nth-child(3) {
  background-image: url('../images/company/culture/b_bg.png');
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb:nth-child(4) {
  background-image: url('../images/company/culture/g_bg.png');
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb .spec_jcgbname {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 64px;
  font-weight: 500;
  color: #fff;
  transition: all 0.2s linear;
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb .spec_jcgbtext {
  position: absolute;
  right: 0;
  top: 0;
  height: 116px;
  width: 0;
  background: #262626;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 32px;
  font-weight: 500;
  transition: all 0.2s linear;
  opacity: 0;
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb:hover .spec_jcgbname {
  left: 72px;
}
.company_culture .spec_item.active .spec_itemcontent .spec_jcgbs .spec_jcgb:hover .spec_jcgbtext {
  width: 400px;
  opacity: 1;
}
.company_culture .spec_item .spec_itemtab {
  padding-top: 120px;
  color: rgba(255, 255, 255, 0.3);
  font-size: 36px;
  text-align: center;
}
.company_culture .spec_item .spec_itemcontent {
  display: none;
}
.company_history {
  padding-top: 80px;
}
.company_history .history .history_title {
  text-align: center;
}
.company_history .history .history_title h4 {
  font-size: 56px;
  font-weight: 500;
  color: #262626;
}
.company_history .history .history_title p {
  font-size: 16px;
  color: #262626;
  margin-top: 16px;
}
.company_history .history .history_process {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 4px;
  margin: 80px auto;
}
.company_history .history .history_process .timeline_line {
  height: 100%;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 4px;
  background: #D8D8D8;
}
.company_history .history .history_process .timeline_line .timeline_lineactive {
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 400px;
  background: #004C97;
  border-radius: 4px;
}
.company_history .history .history_process .timeline_item {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 450px;
}
.company_history .history .history_process .timeline_item .timeline_itemtime {
  color: #262626;
  font-size: 32px;
  font-weight: 500;
}
.company_history .history .history_process .timeline_item .timeline_itemtime span {
  color: #004C97;
}
.company_history .history .history_process .timeline_item p {
  margin-top: 16px;
  font-size: 0.16rem;
  color: #262626;
}
.company_history .history .history_process .timeline_item ul {
  padding-top: 16px;
}
.company_history .history .history_process .timeline_item ul li {
  padding: 8px 0;
  flex-wrap: nowrap;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  color: rgba(38, 38, 38, 0.7);
  font-size: 14px;
}
.company_history .history .history_process .timeline_item ul li span {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  margin-left: 8px;
  background: rgba(38, 38, 38, 0.7);
  flex-shrink: 0;
  flex-wrap: nowrap;
}
.company_history .history .history_process .timeline_item ul li em {
  margin: 0 8px;
  flex-shrink: 0;
  flex-wrap: nowrap;
}
.company_history .history .history_process .timeline_item ul li p {
  margin: 0;
  flex-shrink: 0;
  flex-wrap: nowrap;
}
.company_history .history .history_process .timeline_item .process_img {
  width: 320px;
  height: 180px;
  margin-top: 16px;
}
.company_history .history .history_process .timeline_item .process_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.company_history .history .history_process .timeline_item.timeline_itemleft {
  align-items: flex-end;
  left: -280px;
}
.company_history .history .history_process .timeline_item.timeline_itemright {
  align-items: flex-start;
  right: -280px;
}
.company_history .history .history_process .timeline_item.timeline_itemright ul li {
  justify-content: flex-start;
}
.join .join_us {
  background: #FAFAFA;
  padding: 80px 0;
}
.join .join_us h4 {
  font-size: 56px;
  font-weight: 500;
  color: #262626;
  text-align: center;
}
.join .join_us .join_items .join_item {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: 80px;
}
.join .join_us .join_items .join_item .join_title {
  width: 450px;
}
.join .join_us .join_items .join_item .join_title h5 {
  font-size: 32px;
  font-weight: 500;
  color: #262626;
}
.join .join_us .join_items .join_item .join_title h6 {
  font-size: 24px;
  color: #262626;
  margin-top: 8px;
  font-weight: 400;
}
.join .join_us .join_items .join_item .join_title p {
  margin-top: 40px;
  font-size: 16px;
  color: rgba(38, 38, 38, 0.7);
  text-align: justify;
  line-height: 1.5;
}
.join .join_us .join_items .join_item img {
  width: 800px;
  height: auto;
  border-radius: 24px;
}
.join .join_staff {
  width: 100%;
  height: 100vh;
  padding-top: 80px;
  overflow: hidden;
}
.join .join_staff h3 {
  font-size: 56px;
  font-weight: 500;
  color: #262626;
}
.join .join_staff .staff_effect {
  display: flex;
  justify-content: space-between;
  margin-top: 72px;
  align-items: flex-start;
}
.join .join_staff .staff_effect .staff_effect_lf {
  flex-shrink: 0;
}
.join .join_staff .staff_effect .staff_effect_lf .join_staffpages {
  display: flex;
}
.join .join_staff .staff_effect .staff_effect_lf .join_staffpages .join_staffpage {
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(38, 38, 38, 0.05);
  margin-right: 24px;
  transition: all 0.3s ease;
}
.join .join_staff .staff_effect .staff_effect_lf .join_staffpages .join_staffpage:hover {
  background: rgba(38, 38, 38, 0.15);
}
.join .join_staff .staff_effect .staff_effect_lf .join_staffpages .join_staffpage span {
  font-size: 14px;
  color: rgba(38, 38, 38, 0.25);
}
.join .join_staff .staff_effect .staff_effect_lf .staff_effect_join {
  width: 156px;
  height: 58px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #262626;
  font-size: 22px;
  color: #262626;
  margin-top: 300px;
  transition: all 0.3s ease;
  cursor: pointer;
  text-decoration: none;
}
.join .join_staff .staff_effect .staff_effect_lf .staff_effect_join:hover {
  background: #262626;
  color: #fff;
}
.join .join_staff .staff_effect .staffwiper {
  width: 1080px;
  overflow: hidden;
}
.join .join_staff .staff_effect .staffwiper .swiper-wrapper {
  align-items: flex-start;
  height: 450px;
}
.join .join_staff .staff_effect .staffwiper .swiper-slide {
  width: 300px !important;
  height: 300px;
  flex-shrink: 0;
  transition: width 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
  align-self: flex-start;
}
.join .join_staff .staff_effect .staffwiper .swiper-slide .staff_item {
  width: 100%;
}
.join .join_staff .staff_effect .staffwiper .swiper-slide .staff_item img {
  width: 300px;
  height: 300px;
  object-fit: cover;
  border-radius: 12px;
  transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
  transform: scale(1);
  transform-origin: top left;
  opacity: 0.5;
  will-change: transform;
}
.join .join_staff .staff_effect .staffwiper .swiper-slide.swiper-slide-prev .staff_item img,
.join .join_staff .staff_effect .staffwiper .swiper-slide.swiper-slide-next .staff_item img {
  transform: scale(1);
  transform-origin: top left;
  opacity: 0.8;
}
.join .join_staff .staff_effect .staffwiper .swiper-slide.swiper-slide-active {
  width: 450px !important;
}
.join .join_staff .staff_effect .staffwiper .swiper-slide.swiper-slide-active .staff_item img {
  transform: scale(1.5);
  transform-origin: top left;
  opacity: 1;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}
.join .join_staff .staff_effect .staffwiper .swiper-slide.swiper-slide-prev-prev .staff_item img,
.join .join_staff .staff_effect .staffwiper .swiper-slide.swiper-slide-next-next .staff_item img {
  transform: scale(0.85);
  transform-origin: top left;
  opacity: 0.3;
}