.swiper3D{
    position: relative;
    width: 100%;height: 400px;
    /*max-width: 640px;*/
    margin: 0 auto;
    /*background-color: #ccc;*/
    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: 70%;height:100%;
    margin-left: -35%;
    font-size: 40px;
    transition: all .4s linear;
    -webkit-transition: all .4s linear;
    cursor: pointer;
    /*下面设置文字居中，可以去掉*/
    
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;

    /*2019-01-11*/
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.swiper3D-leftbtn,
.swiper3D-rightbtn{
    position: absolute;
    top: 50%;
    margin-top: -40px;
    width: 40px;height: 80px;
    background-color: #25A27C;
    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;}


/*
 *在这里 调整每一个的位置  
 */

/*从左往右 第一个*/
.swiper3D .left{
    opacity: .5;
    transform: translateX(-30%) scale3d(.6,.6,.6) ;
    -webkit-transform: translateX(-30%) scale3d(.6,.6,.6) ;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    z-index: 1;
}
/*从左往右 第二个*/
.swiper3D .left-harf{
    opacity: .8;
    transform: translateX(-21.5%) scale3d(.85,.85,.8) ;
    -webkit-transform: translateX(-21.5%) scale3d(.85,.85,.8) ;
    -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;
    box-shadow: 4px -4px 15px rgba(4,0,0,0.75);
}
/*从左往右 第四个*/
.swiper3D .right-harf{
    opacity: .8;
    transform: translateX(21.5%) scale3d(.85,.85,.8) ;
    -webkit-transform: translateX(21.5%) scale3d(.85,.85,.8) ;
    -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;
}