.slide-image {
  width: 90%;
  height: 150px;
  margin:5%;
}
.indexSwiper{
  width: 100%;
  height:370rpx;
}
.nav-blue{
  height: 320rpx;
  background-image: var(--gradualBlue);
}
.coursel{
  position: relative;
  width: 100%;
  margin-top:-280rpx;
  height:370rpx;
}
.dots{ 
  position: absolute; 
  left: 0; 
  right: 0; 
  bottom: 20rpx; 
  display: flex; 
  justify-content: center; 
} 
.dots .dot{ 
  margin: 0 8rpx; 
  width:15rpx;
  height:6rpx;
  background:rgba(255,255,255,1);
  opacity:0.5;
  border-radius:1rpx;
  transition: all .6s; 
} 
.dots .dot.active{ 
  width:24rpx;
  height:6rpx;
  background:rgba(255,255,255,1);
  border-radius:1rpx;
}
 
swiper image {
  width: 100%;
}

.nav-item{
  width: 670rpx;
  margin-left: 40rpx;
  text-align: center;
  margin-top: 40rpx;
  border-radius: 2%;
  height: 232rpx;
}