.swiper-container {
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1; }
.swiper-container-no-flexbox .swiper-slide {
float: left;
}
.swiper-container-vertical > .swiper-wrapper {
flex-direction: column;
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: flex;
transition-property: transform;
box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
flex-wrap: wrap;
}
.swiper-container-free-mode > .swiper-wrapper {
transition-timing-function: ease-out;
margin: 0 auto;
}
.swiper-slide {
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
transition-property: transform;
}
.swiper-invisible-blank-slide {
visibility: hidden;
} .swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
align-items: flex-start;
transition-property: transform, height;
} .swiper-container-3d {
perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
} .swiper-container-wp8-horizontal,
.swiper-container-wp8-horizontal > .swiper-wrapper {
touch-action: pan-y;
}
.swiper-container-wp8-vertical,
.swiper-container-wp8-vertical > .swiper-wrapper {
touch-action: pan-x;
} .swiper-scrollbar {
position: relative;
-ms-touch-action: none;
background: rgba(51, 51, 51, 0.15);
}
.swiper-container-horizontal > .swiper-scrollbar {
position: relative;
width: 100%;
height: 1px;
margin: 20px 0 2px;
}
.swiper-container-horizontal > .swiper-scrollbar .swiper-scrollbar-drag {
height: 3px;
top: -2px;
}
.swiper-container-vertical > .swiper-scrollbar {
position: absolute;
right: -1px;
top: 1%;
z-index: 50;
width: 1px;
height: 100%;
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: #999999;
left: 0;
top: 0;
cursor: pointer;
}
.swiper-scrollbar-cursor-drag {
cursor: move;
}
.swiper-scrollbar-lock {
display: none;
} .swiper-pagination {
margin-top: 20px;
}
.swiper-pagination-lock {
display: none;
}
.swiper-pagination-bullet {
display: inline-block;
width: 20px;
height: 20px;
margin-right: 10px;
border-radius: 50%;
border: 7px solid transparent;
cursor: pointer;
transition: 0.4s;
}
.swiper-pagination-bullet:last-child {
margin-right: 0;
}
.swiper-pagination-bullet span {
display: block;
height: 100%;
border-radius: 50%;
background: #000;
transition: 0.4s;
}
.swiper-pagination-bullet:hover span {
background: #000;
}
.swiper-pagination-bullet-active {
border-color: rgba(22, 22, 25, 0.1);
}
.swiper-pagination-bullet-active span {
background: #000;
}
.swiper-button-prev,
.swiper-button-next {
color: #cccccc;
font-size: 30px;
outline: none;
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 9;
}
.swiper-button-prev:focus,
.swiper-button-next:focus {
outline: none;
}
.swiper-button-prev {
left: 0;
}
.swiper-button-next {
right: 0;
}