/* 轮播图容器样式 */
 .navctr-img-box {
    /* 容器宽度为视口宽度在javascript自定义设置 */
    overflow: hidden;
    position: relative;
}
/* 图片列表样式 */
.navctr-img-imgs-container {
    /* 总宽度为图片数量乘以视口宽度 */
    display: flex; /* 使用 flexbox 布局 */
    transition: all 1s;
    border-radius: 10px;
}
/* 单个图片样式 */
.navctr-img-imgs {
    /* 每张图片宽度为视口宽度 */
    width: 100vw;
    border-radius: 10px;
    border: soid 5px #ffffff;
}
/* 两个按钮 */
.goleft,.goright {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(100,100,100,0.5);
    color: #fff;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    border-radius: 50px;
    z-index: 1;
}
.goleft {
    left: 10px;
}
.goright {
    right: 10px;
}
@media screen and (max-width: 480px)  {
    .navctr-img-imgs{
        height: 200px;
        object-fit: cover;
    }
}
@media screen and (min-width: 481px) and (max-width: 768px)  {
    .navctr-img-imgs{
        height: 300px;
        object-fit: cover;
    }
}
@media screen and (min-width: 769px) and (max-width: 1024px)  {
    .navctr-img-imgs{
        height: 350px;
        object-fit: cover;
    }
}
@media screen and (min-width: 1024px)  {
      .navctr-img-imgs{
        height: 580px;
        object-fit: cover;
    }
  }