.swiper3D{
    position: relative;
    width: 100%;
    height: 490px;
    max-width: 1080px;
    margin: 0 auto;
    color: #fff;
}
.swiper3D .swiper-wrapper{
    position: absolute;
    left: 0;top: 0;
    width: 100%;height: 100%;
    z-index: 1;
}
.swiper3D .swiper-slide{
    position: absolute;
    left: 50%;
    top:0;
    width: 50%;
    height:100%;
    margin-left: -25%;
    transition: all .4s linear;
    -webkit-transition: all .4s linear;
    cursor: pointer;
    text-align: center;
   
}
.swiper3D .swiper-slide h4,.swiper3D .swiper-slide p{
	display: none;
	color: #bbbbbb;
}
.swiper3D .front p{
	height: 40px;
	overflow: hidden;
	color: #bbbbbb;	
	font-size: 14px;
}
.swiper3D .front h4,.swiper3D .front p{
	display: block;
}

.swiper3D .front .pic-box{
	margin-bottom: 20px;
	position: relative;
	border: 3px solid #ddd;
}
.swiper3D .swiper-slide .pic-box button{
	position: absolute;
	left: 50%;
	margin-left: -28px;
	top:50%;
	margin-top: -28px;
	border: 0;
	display: none;
	background: none;
	height: 56px;
	width: 56px;
}
.swiper3D .swiper-slide .pic-box button img{
	width: 100%;
}
.swiper3D .front .pic-box button{
	display: inline-block;
}
.swiper3D-leftbtn,
.swiper3D-rightbtn{
    position: absolute;
    top: 50%;
    margin-top: -40px;
    width: 40px;height: 80px;
    font-size: 30px;
    font-weight: bold;
    line-height: 80px;
    text-align: center;
    cursor: pointer;
    z-index: 10;
}
.swiper3D-leftbtn{left: 20px;}
.swiper3D-rightbtn{right: 20px;}

/*导航*/

.navbox{
    width: 100%;
    text-align: center;
    margin-top: 20px;
}
.navbox span{
    display: inline-block;
    width: 30px;height: 30px;
    margin: 5px;
    border-radius: 100%;
    background-color: #00C81B;
    opacity: .7;
    cursor: pointer;
}
.navbox span.active{
    opacity: 1;
}
/*
 *在这里 调整每一个的位置  
 */

/*从左往右 第一个*/
.swiper3D .left{
    opacity: .5;
    transform: translateX(-40%) scale3d(.6,.6,.6) ;
    -webkit-transform: translateX(-40%) scale3d(.6,.6,.6) ;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    z-index: 1;
}
/*从左往右 第二个*/
.swiper3D .left-harf{
    opacity: .8;
    transform: translateX(-45%) scale3d(.6,.6,.6) ;
    -webkit-transform: translateX(-45%) scale3d(.6,.6,.6) ;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    z-index: 5;
}
/*从左往右 第三个*/
.swiper3D .front{
    opacity: 1;
    transform: translateX(0) scale3d(1,1,1) ;
    -webkit-transform: translateX(0) scale3d(1,1,1) ;
    z-index: 10;
}
/*从左往右 第四个*/
.swiper3D .right-harf{
    opacity: .8;
    transform: translateX(45%) scale3d(.6,.6,.6) ;
    -webkit-transform: translateX(45%) scale3d(.6,.6,.6) ;
    -webkit-transform-origin: right center;
    transform-origin: right center;
    z-index: 5; 
}
/*从左往右 第五个*/
.swiper3D .right{
    opacity: .5;
    transform: translateX(30%) scale3d(.6,.6,.6) ;
    -webkit-transform: translateX(30%) scale3d(.6,.6,.6) ;
    -webkit-transform-origin: right center;
    transform-origin: right center;
    z-index: 1; 
}
/*5个能看到的以外的 slide 放在最后面*/
.swiper3D .back{
    opacity: 0;
    transform: translateX(0) scale3d(.5,.5,.5) ;
    -webkit-transform: translateX(0) scale3d(.5,.5,.5) ;
    z-index: 1;
}