.environment-warp .swiper-container { width: 100%; /* background: #fff; */
    /* padding-bottom: 10px; */
position: relative; box-sizing: border-box; z-index: auto; }
.environment-warp .swiper-navigator { width: 100%; height: 44px; position: absolute; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; z-index: 999 !important; }
.environment-warp .swiper-btn-next, .environment-warp .swiper-btn-prev { color: #fff; background: rgba(0,0,0,.5); position: absolute; width: 30px; height: 30px; -ms-display: flex; display: flex; padding-top: 3px; -ms-justify-content: center; justify-content: center; cursor: pointer; }
.environment-warp .poster-btn { cursor: pointer; position: absolute; /* top: 183px; */
width: 44px !important; height: 44px !important; text-align: center; line-height: 44px; color: #ffffff; border-radius: 22px; background-color: rgba(0, 0, 0, 0.3); z-index: 10; display: flex; justify-content: center; align-items: center; }
.environment-warp .swiper-btn-next img, .environment-warp .swiper-btn-prev img { display: block; width: 13px; height: 24px; }
.environment-warp .swiper-btn-next { right: 150px; }
.environment-warp .swiper-btn-prev { left: 150px; }
.environment-warp .poster-btn:hover { background-color: rgba(0, 177, 169, 0.8) }
.environment-warp .swiper-wrap { width: 100%; margin: 0 auto; /* 父元素开启3d，才会有叠加效果 f*/
-ms-transform-style: preserve-3d; transform-style: preserve-3d; /*ios z-index 不生效bug */
transform: translateZ(100px); /* 叠加过渡好看点 */
-ms-perspective: 500px; perspective: 500px; display: flex; -ms-display: flex; justify-content: center; -ms-justify-content: center; align-items: center; -ms-align-items: center; z-index: 9; position: relative; }
.environment-warp .swiper-wrap li { position: absolute; left: 0; height: auto; box-shadow: 0 0 11px rgba(0, 0, 0, 0.5); border-radius: 20px; width: auto; top: 0; }
.environment-warp .swiper-wrap li:nth-child(1) { position: relative; }
.environment-warp .swiper-wrap.transition li { transition: .5s; }
.environment-warp .swiper-wrap img { width: 100%; display: block; border-radius: 20px; }
.environment-warp .p1 { z-index: 3; transform: translateZ(100px) scale(0.62); -ms-transform: translateZ(100px) scale(0.62);/* transform: transalteZ(10px) 数值越大越上面*/
}
.environment-warp .p2 { z-index: 2; transform: translate3d(15%, 0, 90px) scale(0.45); -ms-transform: translate3d(15%, 0, 90px) scale(0.45); }
.environment-warp .swiper-3 .p3, .environment-warp .swiper-6 .p6 { z-index: 2; transform: translate3d(-15%, 0, 90px) scale(.45); -ms-transform: translate3d(-15%, 0, 90px) scale(.45); }
.environment-warp .swiper-6 .p3, .environment-warp .swiper-5 .p3 { z-index: 1; transform: translate3d(26%, 0, 80px) scale(.35); -ms-transform: translate3d(26%, 0, 80px) scale(.35); }
.environment-warp .swiper-6 .p4, .environment-warp .swiper-4 .p3 { transform: translate3d(0%, 0, 80px) scale(.35); -ms-transform: translate3d(0%, 0, 80px) scale(.35); }
.environment-warp .swiper-6 .p5, .environment-warp .swiper-5 .p4 { z-index: 1; transform: translate3d(-26%, 0, 80px) scale(0.35); -ms-transform: translate3d(-26%, 0, 80px) scale(0.35); }
.environment-warp .swiper-6 .p6, .environment-warp .swiper-4 .p4, .environment-warp .swiper-5 .p5 { z-index: 2; transform: translate3d(-15%, 0, 90px) scale(.45); -ms-transform: translate3d(-15%, 0, 90px) scale(.45); }
.environment-warp .swiper-wrap, .environment-warp .swiper-navigator { z-index: 99; }
 @media screen and (min-width: 425px) {
.environment-warp .swiper-wrap,  .environment-warp .swiper-navigator { width: 80%; }
}
@media screen and (min-width: 1360px) {
.environment-warp .swiper-wrap,  .environment-warp .swiper-navigator { width: 1087px; }
}
