﻿@charset "utf-8";

.c-banner{
 width: 100%;
 position: relative;
 
}
.c-banner img{
 width: 100%;
}

.c-banner .banner ul{
 list-style: none;
 padding-left: 0px;
 margin-top: 0px;
 margin-bottom: 0px;
}
.c-banner .banner ul li{
 position: absolute
 display: none;
 opacity: 0;
}
.c-banner .banner ul li:nth-child(1){
 opacity: 1;
 display: block;
}
.c-banner .banner ul li img{
 width: 100%;
 position: absolute;
 top: 0px;
}
.c-banner .banner ul li:first-child img{
 position: relative;
}
.c-banner .nexImg,.c-banner .preImg{
 padding: 25px 10px 25px 10px;
 position: absolute;
 top: 50%;
 margin-top: -53px;
 background: #000000;
 opacity: 0.5;
 border-radius: 5px;
 z-index: 10;
 
}
.c-banner .nexImg:hover,.c-banner .preImg:hover{
 opacity: 0.8;
}
.c-banner .nexImg{
 right: 0px;
}
.c-banner .nexImg img,.c-banner .preImg img{
 
 
}
.c-banner .jumpBtn{
 width: 100%;
 position: absolute;
 bottom: 20px;
 text-align: center;
}
.c-banner .jumpBtn ul{
 margin-bottom: 0px;
 padding: 0px;
}

.c-banner .jumpBtn ul li{
 width: 20px;
 height: 20px;
 border-radius: 50%;
 display: inline-block;
 background-color: white;
 opacity: 0.9;
 margin-left: 10px;
}
.c-banner .jumpBtn ul li:first-child{
 margin-left: 0px;
}
@media screen and (max-width:768px) {
 .c-banner{
  width: 100%;
  height: 345px;
  overflow: hidden;
 }
 .c-banner .banner ul li img{
  width: 768px;
  height: 345px;
  position: absolute;
  left: 50%;
  margin-left: -384px;
 }
}