.rela-pro{
    margin-bottom: 50px;
    margin-top: 50px;
  }
  
  .rela-pro>h5 {
      font-size: 26px;
      color: #212121;
      line-height: 1;
      font-weight: 700;
      margin-bottom: 40px
    }
    
    .rela-pro .list {
      position: relative
    }
    
    .rela-pro .swiper-slide {
      text-align: center
    }
    
    .rela-pro .swiper-slide img {
      width: 100%
    }
    
    .rela-pro .swiper-slide h6 {
      font-size: 17px;
      color: #212121;
      line-height: 24px;
      font-weight: 700;
      margin: 27px 0 0
    }
    
    .rela-pro .bot {
      display: flex;
      align-items: center;
      width: 980px;
      margin: 40px auto 0;
      line-height: normal
    }
    
    .rela-pro .tips {
      flex: 1;
      margin-left: 20px;
      overflow: hidden
    }
    
    .rela-pro .swiper-pagination-progressbar.swiper-pagination-horizontal {
      position: static;
      width: 100%;
      height: 2px;
      background: #c9d2d7
    }
    
    .rela-pro .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
      background: #000;
      top: 0;
      height: 2px
    }
    
    .rela-pro .bot .page {
      font-size: 0
    }
    
    .rela-pro .swiper-button-prev,.rela-pro .swiper-button-next {
      position: static;
      width: 20px;
      height: 20px;
      line-height: 20px;
      overflow: hidden;
      background: 0 0;
      margin-top: 0;
      text-align: center;
      color: #202020;
      display: inline-block;
      border-radius: 0
    }
    
    .rela-pro .swiper-button-next::after,.rela-pro .swiper-button-prev::after {
      display: none
    }
    
    .rela-pro .swiper-button-prev i,.rela-pro .swiper-button-next i {
      color: inherit;
      font-size: 18px;
      display: inline-block
    }
    
    .rela-pro .swiper-button-prev,.rela-pro .swiper-container-rtl .swiper-button-next {
    }
    
    .rela-pro .swiper-button-next,.rela-pro .swiper-container-rtl .swiper-button-prev {
      margin-left: 8px
    }
    
    .rela-pro .swiper-button-prev:hover,.rela-pro .swiper-button-next:hover {
      color: var(--active-color)
    }
  
  
  
    @media screen and (max-width: 992px) {
    
      .rela-pro .bot {
          width: 100%
      }
  
    }
    
    @media screen and (max-width: 768px) {
  
    }
    
    @media screen and (max-width: 768px) {
      .rela-pro>h5 {
          font-size: 24px;
          margin-bottom: 30px
      }
    
      .rela-pro .swiper-slide h6 {
          font-size: 16px;
          margin: 15px 0 0
      }
    
      .rela-pro .bot {
          margin: 30px auto 0
      }
    }
    
    @media screen and (max-width: 576px) {
  
    }
    
    @media screen and (max-width: 480px) {
    
      .rela-pro>h5 {
          font-size: 22px;
          margin-bottom: 20px
      }
    }