.why {
  padding-top: 1rem;
  background-color: #fff;
}

.why .bg {
  background-color: #275dbf;
  padding: 1px 50rem;
}

.why .tabs {
  margin: 100rem 10rem 0 10rem;
  display: flex;
  /* justify-content: space-between; */
  align-items: center;
  color: #fff;
  font-size: 22rem;
}

.why .tabs .tab {
  color: #fff;
  margin-right: 88rem;
  cursor: pointer;
}

f .why .tabs .tab:last-child {
  margin: 0;
}

.why .line {
  width: 100%;
  margin: 17rem 10rem 28rem;
  height: 3rem;
  background-color: rgba(255, 255, 255, 0.5);
}

.why .production_list {
  margin-bottom: 41rem;
  display: flex;
  flex-wrap: wrap;
  gap: 11rem;
}

.why .production_list .production {
  padding: 0 15px;

  min-width: 143rem;
  height: 52rem;
  border-radius: 138rem;
  border: 1px solid #FFFFFF;
  font-size: 19rem;
  color: #fff;
  text-align: center;
  line-height: 52rem;
  opacity: 0.6;
  transition: opacity 200ms linear;
  cursor: pointer;
}

.why .production_list .now_production {
  opacity: 1;
}


.why .line .slid {
  width: 50rem;
  height: 3rem;
  background-color: #fff;
  opacity: 0;
}

.why .swiper2 {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.why .swiper2 .shadow {
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 15;
}

.why .swiper2 .shadow img {
  width: 100%;
  height: 102%;
}

.why .swiper2 .swiper-slide {
  width: 500rem;
  height: 400rem;
  position: relative;
  background-color: #FFF;
  border-radius: 28rem;
}

.why .swiper2 .swiper-slide .banner {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 30rem;
}

.why .swiper2 .swiper-slide .content {
  width: 370rem;
  position: relative;
  z-index: 13;
  margin: 70rem 0 0 70rem;
  display: flex;
  flex-direction: column;
}

.why .swiper2 .swiper-slide .content .big {
  font-size: 38rem;
}

.why .swiper2 .swiper-slide .content .weight {
  font-weight: bold;
}

.why .swiper2 .swiper-slide .content .line {
  width: 21rem;
  height: 1rem;
  background-color: #e57300;
  margin: 30rem 0;
}

.why .swiper2 .swiper-slide .content .small {
  font-size: 14rem;
  color: #fff;
}

.why .swiper2 .swiper-slide .content .btn {
  width: 143rem;
  height: 41rem;
  font-size: 15rem;
  margin-top: 70rem;
}

.why .swiper2 .pagination_box {
  position: absolute;
  left: 50%;
  bottom: -90rem;
  transform: translateX(-50%);
  z-index: 8888;
  height: 29rem;
  padding: 3rem;
  text-align: center;
}

.why .swiper2 .swiper-pagination2 {
  height: 150rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.why .swiper2 .swiper-pagination2 span {
  line-height: 0;
  width: 25rem;
  height: 25rem;
  border-radius: 50%;
  position: relative;
  background-color: transparent;
  opacity: 1;
}

.why .swiper2 .swiper-pagination2 span::after {
  content: '';
  position: absolute;
  inset: 0;
  margin: auto;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  background-color: #fff;
}

.why .swiper2 .swiper-pagination-bullet-active {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border: 1rem solid #fff;
}


.box_19 {
  width: 100%;
  min-height: 575px;
  height: 986rem;
  padding-top: 1rem;
  /* background: url(../../../images/index/zx-bg.png) no-repeat center;
    background-size: 100% 100%; */
}

.box_19 .home-title-1 {
  margin: 80rem 192rem;
}

.box_19 .line {
  width: 1000rem;
  margin: 90rem auto 0;
  height: 2rem;
  background-color: #7f7f80;
}

.box_19 .line .slid2 {
  width: 150rem;
  height: 3rem;
  background-color: #275dbf;
  transition: linear 450ms;
  position: relative;
}

.box_19 .line img {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  transition: transform 300ms;
}

.box_19 .line img::after {
  content: '';
  position: absolute;
  background-color: #275dbf;
  top: -10px;
  left: -10px;
  width: 120%;
  height: 120%;
}

.box_19 .line .round {
  width: 38rem;
  height: 38rem;
  top: -19rem;
}

.box_19 .line .arrow {
  top: -7rem;
  width: 14rem;
  height: 14rem;
}

.box_19 .section_6 {
  margin: 132rem 0 60rem 204rem;
  display: flex;
  flex-direction: column;
}

.box_19 .paragraph_12 {
  color: rgb(0, 0, 0);
  font-size: 32rem;
  font-weight: bold;
}

.box_19 .paragraph_13 {
  color: rgb(0, 0, 0);
  font-size: 32rem;
  font-weight: bold;
  align-self: flex-start;
}

.box_19 .paragraph_13 img {
  width: 14rem;
  height: 14rem;
}

.box_19 .section_7 {
  margin: 0 192rem;
  display: flex;
  justify-content: space-between;
}

.box_19 .section_7 .list {
  width: 659rem;
  height: 508rem;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  transition: width linear 300ms;
}

.box_19 .section_7 .list .list_style1 {
  height: 100%;
  background: url(/images/31140340zf05.jpg) no-repeat center;
  background-size: cover;
  border-radius: 30rem;
  padding: 38rem;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

.box_19 .section_7 .list .list_style1 .top_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 103%;
}

.box_19 .section_7 .list .list_style1 .bottom_bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 103%;
}

.box_19 .section_7 .list .list_style1 div {
  display: flex;
  flex-direction: column;
  color: #fff;
}

.box_19 .section_7 .list .list_style1 .right {
  text-align: right;
  font-size: 13rem;
  position: relative;
  z-index: 1;
}

.box_19 .section_7 .list .list_style1 .right .big {
  font-size: 49rem;
}

.box_19 .section_7 .list .list_style1 .left {
  margin-top: auto;
  font-size: 22rem;
  position: relative;
  z-index: 1;
}

.box_19 .section_7 .list .list_style2 {
  height: 100%;
  background-color: #fff;
  border-radius: 20rem;
  padding: 34rem;
  display: flex;
  flex-direction: column;
}

.box_19 .section_7 .list .list_style2 .title {
  font-size: 14rem;
  color: #275dbf;
}

.box_19 .section_7 .list .list_style2 .title1 {
  font-size: 24rem;
  font-weight: bold;
  margin: 50rem 0 20rem 0;
}

.box_19 .section_7 .list .list_style2 .line1 {
  width: 100%;
  height: 1rem;
  background-color: #275dbf;
}

.box_19 .section_7 .list .list_style2 .intro {
  margin-top: 20rem;
  font-size: 14rem;
  color: #9fa0a0;
}

.box_19 .section_7 .list .list_style2 .bottom {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.box_19 .section_7 .list .list_style2 .time {
  display: flex;
  flex-direction: column;
  font-size: 13rem;
}

.box_19 .section_7 .list .list_style2 .time .big {
  font-size: 49rem;
}

.box_19 .section_7 .list .list_style2 .arrow {
  position: relative;
}

.box_19 .section_7 .list .list_style2 .arrow::after {
  content: '\e606';
  font-family: 'iconfont';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  font-size: 18px;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
  transition: all 0.1s ease-in-out;
  transform-origin: left center;
}

.box_19 .section_7 .list:hover .arrow::after {
  color: #275dbf;
  transform: scale(1.3);
}

.box_20 {
  padding: 80rem 0;
  display: flex;
  flex-direction:column;
  justify-content: center;
  align-items: center;
  background-color: #275dbf;
}

.box_21 {
  padding: 80rem 0;
  display: flex;
  flex-direction:column;
  justify-content: center;
  align-items: center;
  background-color: #fff;
}

.swiper3 {
  overflow: hidden;
  box-sizing:border-box;
  
  background-color: #fff;
  padding:20rem;
}
 .swiper-container-free-mode>.swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
  -o-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
}

.box_20 .title {
    font-size:40px;
    color:#fff;
    text-align:center;
}

 .box_20 .title2{
    font-size:25px;
    margin:0rem 0 50rem 0;
    color:#fff;
    text-align:center;
}

 
.box_21 .title {
    font-size:40px;
    color:#275dbf;
    text-align:center;
}

 .box_21 .title2{
    font-size:25px;
    margin:0rem 0 50rem 0;
    color:#275dbf;
    text-align:center;
}


.swiper3 .swiper-slide {
  width:535rem;
  height: 100%;
}

.swiper3 .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.brand {
  height: 990rem;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.brand .bg {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 990rem;
  -o-object-fit: cover;
  object-fit: cover;
}

.brand div {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
}

.brand .center_box {
  width: 558rem;
  height: 558rem;
  background-color: #f6f4f1;
  position: relative;
  z-index: 1;
}

.brand .center_b {
  width: 380rem;
  height: 380rem;
  background-color: #88b2f1;
  border: 1rem solid #275dbf;
}

.brand .center {
  width: 290rem;
  height: 290rem;
  background-color: #275dbf;
  color: #fff;
  font-size: 14rem;
  flex-direction: column;
}

.brand .center .big {
  font-size: 36rem;
  margin-bottom: 12rem;
}

.brand .brand_box {
  position: absolute;
  inset: 0;
  z-index: 100;
}

.brand .brand_box div {
  width: 100%;
  height: 100%;
}

.brand .brand_img {
  width: 200rem;
  height: 100rem;
  position: absolute;
  z-index: 10;
  cursor: pointer;
}


/****** 2024-1-4 **********/

.brand .brand_box .img1 {
  top: 622rem;
  left: 257rem;
}

.brand .brand_box .img2 {
  top: 401rem;
  left: 199rem;
}

.brand .brand_box .img3 {
  top: 142rem;
  left: 310rem;
}

.brand .brand_box .img4 {
  top: 319rem;
  left: 467rem;
}

.brand .brand_box .img5 {
  top: 529rem;
  left: 570rem;
}

.brand .brand_box .img6 {
  top: 759rem;
  left: 538rem;
}

.brand .brand_box .img7 {
  top: 737rem;
  left: 867rem;
}

.brand .brand_box .img8 {
  top: 199rem;
  left: 748rem;
}

.brand .brand_box .img9 {
  top: 707rem;
  left: 1217rem;
}

.brand .brand_box .img10 {
  top: 517rem;
  left: 1293rem;
}

.brand .brand_box .img11 {
  top: 355rem;
  left: 1129rem;
}

.brand .brand_box .img12 {
  top: 142rem;
  left: 1131rem;
}

.brand .brand_box .img13 {
  top: 318rem;
  left: 1445rem;
}