/* ==================
         轮播
 ==================== */

@import './var.scss';

.swiper-slide {
    .taro-video {
        height: 100%;
    }
}

swiper {
    &.square-dot {
        .wx-swiper-dot {
            background-color: $white;
            opacity: 0.4;
            width: 5Px;
            height: 5Px;
            border-radius: 10Px;
            transition: all 0.3s ease-in-out 0s;

            &.wx-swiper-dot-active {
                opacity: 1;
                width: 15Px;
            }
        }
    }

    &.round-dot {
        .wx-swiper-dot {
            width: 5Px;
            height: 5Px;
            top: -2Px;
            transition: all 0.3s ease-in-out 0s;
            position: relative;

            &.wx-swiper-dot-active {
                width: 9Px;
                height: 9Px;
                top: 0;

                &::after {
                    content: "";
                    position: absolute;
                    width: 5Px;
                    height: 5Px;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    margin: auto;
                    background-color: $white;
                    border-radius: 5Px;
                }
            }
        }
    }
}

.screen-swiper div[class*="taro-img"],
.screen-swiper video,
.swiper-item image,
.swiper-item img,
.swiper-item div[class*="taro-img"],
.swiper-item video,
.screen-swiper image,
.screen-swiper img {
    width: 100%;
    display: block;
    height: 100%;
    margin: 0;
    //pointer-events: none;
}

.swiper-wrapper .taro-img {
    width: 100%;
}

.card-swiper {
    // height: 420px !important;
    swiper-item {
        //width: 610px !important;
        //left: 70px;
        box-sizing: border-box;
        padding: 40px 0 70px;
        overflow: initial;

        .swiper-item {
            width: 100%;
            display: block;
            height: 100%;
            border-radius: 10px;
            transform: scale(0.9);
            transition: all 0.2s ease-in 0s;
            overflow: hidden;
        }

        &.cur {
            .swiper-item {
                transform: none;
                transition: all 0.2s ease-in 0s;
            }
        }
    }
}

.tower-swiper {
    height: 420px;
    position: relative;
    max-width: 750px;
    overflow: hidden;

    .tower-item {
        position: absolute;
        width: 300px;
        height: 380px;
        top: 0;
        bottom: 0;
        left: 50%;
        margin: auto;
        transition: all 0.2s ease-in 0s;
        opacity: 1;

        &.none {
            opacity: 0;
        }

        .swiper-item {
            width: 100%;
            height: 100%;
            border-radius: 6px;
            overflow: hidden;
        }
    }
}

/*
   H5
 */
.card-swiper {
    // height: 420px;
    .swiper-slide {
        &:not(.swiper-slide-duplicate) {
            // width: 750px !important;
        }
        box-sizing: border-box;
        //padding: 0 0 35Px;
        left: 35Px;
        overflow: initial;

        .swiper-item {
            width: 100%;
            display: block;
            height: 100%;
            border-radius: 10px;
            transform: scale(0.9);
            transition: all 0.3s ease-in 0.1s;
            overflow: hidden;
        }

        &.cur:not(.swiper-slide-duplicate) {
            width: calc(100% - 70Px) !important;
            transition: all 0.2s ease;

            .swiper-item {
                transform: none;
                transition: all 0.3s ease-in 0.1s;
            }
        }

        &.swiper-slide-duplicate:not(:first-child) {
            //width: 750px !important;
            transition: all 0.2s ease;

            .swiper-item {
                transform: scale(0.9);
                transition: all 0.3s ease-in 0.1s;
            }
        }
    }
}

.screen-swiper {
    .swiper-wrapper {
        transform: translate3d(-100%, 0px, 0px);

        .swiper-slide {
            &.swiper-slide-active {
                width: 100% !important;
            }
        }
    }
}