@charset "gb2312";
/* CSS Document */

     /* 重置默认样式 */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    /* Banner 容器核心自适应样式 */
    .banner-container.banner {
      width: 100%;
      position: relative;
      overflow: hidden;
      /* 16:9 宽高比（可修改：4:3=75%，21:9≈42.86%） */
      padding-top: 56.25%; 
    }

    /* Swiper 容器绝对定位铺满父容器 */
    .banner-swiper.swiper {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
   
    }

    /* 轮播项自适应 */
    .swiper-slide {
      width: 100%;
      height: 100%;
    }

    /* 图片自适应填充，不变形 */
    .banner-media {
      width: 100%;
      height: 100%;
      object-fit: cover; /* 裁剪填充，保持比例 */
      /* 如需完整显示图片，替换为 object-fit: contain; */
    }

    /* 导航按钮样式优化（自适应） */
    .swiper-button-next, .swiper-button-prev {
      color: #ffffff; /* 白色按钮 */
      width: 40px;
      height: 40px;

      display: none;
    }

    /* 调整按钮图标位置 */
    .swiper-button-next::after, .swiper-button-prev::after {
      font-size: 32px;
    }

    /* 分页器样式优化 */
    .swiper-pagination-bullet {
      width: 8px;
      height: 8px;
      background: rgba(255, 255, 255, 0.6);
      opacity: 1;
    }
    .swiper-pagination-bullet-active {
      background: #ffffff;
      width: 20px;
      border-radius: 4px; /* 激活态为椭圆 */
    }

    /* 响应式媒体查询 */
    @media (min-width: 768px) {
      /* 平板及以上显示导航按钮 */
      .swiper-button-next, .swiper-button-prev {
        display: flex; 
      }
      /* 平板上调大分页器 */
      .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
      }
      .swiper-pagination-bullet-active {
        width: 25px;
      }
	

    }

    @media (min-width: 1200px) {
      /* 大屏调整宽高比为 21:9 */
      .banner-container.banner {
        padding-top: 32.86%;
      }
    }

    /* 移动端优化 */
    @media (max-width: 767px) {
      .swiper-pagination {
        bottom: 10px !important; /* 分页器靠下 */
      }
	  
	      .banner-container.banner {

      padding-top: 36.25%; 
    }
    }