@charset "UTF-8";

.banner img {
  width: 100%;
  display: block;
  background-color: #fff;
  padding-bottom: 1px;
}
.banner .pic2 {
  display: none;
}
.mainDiv {
  padding-top: 154px;
}
.mainDiv .banner .swiper-pagination {
  bottom: 10px;
}
.mainDiv .banner .swiper-pagination .swiper-pagination-bullet {
  width: 15px;
  height: 15px;
  border: solid 2px #a0a9af;
  background: #a0a9af;
  margin: 0 10px;
  opacity: 1;
  background: none;
  transition-duration: 0.4s;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  -ms-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
}
.mainDiv .banner .swiper-pagination .swiper-pagination-bullet-active {
  background: #333333;
  border:none;
}
.mainDiv .banner .swiper-button-next,
.mainDiv .banner .swiper-button-prev {
  width: 23px;
  height: 42px;
  background: url(../images/arrow2.png) no-repeat;
  background-size: 100% auto;
  left: 82px;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transition-duration: 0.4s;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  -ms-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
}
.mainDiv .banner .swiper-button-next:hover,
.mainDiv .banner .swiper-button-prev:hover {
  background-image: url(../images/arrow4.png);
}
.mainDiv .banner .swiper-button-next {
  left: auto;
  right: 82px;
  background-image: url(../images/arrow3.png);
}
.mainDiv .banner .swiper-button-next:hover {
  background-image: url(../images/arrow5.png);
}

/*响式应布局*/
@media only screen and (max-width: 1400px) {
  .mainDiv .banner .swiper-pagination {
    bottom: 10px;
  }
}

@media screen and (max-width:1030px){
  .mainDiv{
    padding-top: 78px; 
  }
  .banner .pic1 {
    display: none;
  }
  .banner .pic2 {
    display: block;
  }
  .mainDiv .banner .swiper-pagination {
    bottom: 10px;
  }
  .mainDiv .banner .swiper-pagination .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    border: solid 1px #333333;
    margin: 0 7px;
  }
  .mainDiv .banner .swiper-button-next,.mainDiv .banner .swiper-button-prev{
    display: none;
  }
}
@media screen and (max-width:834px){
  .mainDiv{
    padding-top: 95px; 
  }
}
@media screen and (max-width:640px){
  .mainDiv{
    padding-top: 80px; 
  }
}
@media screen and (max-width:428px){
  .mainDiv{
    padding-top: 78px; 
  }
}