.introduction_wrap {

}
.introduction_box {
    padding: 32px 0 0;

    & + .introduction_box {
        margin-top: 64px;
    }
}
.swiper {
}
.swiper-slide {
    max-width: 600px;

    img{
        width: 100%;
        height: auto;
        border-radius: 8px;
    }
}
.swiper-pagination {
    position: relative;
    margin-top: 8px;
}
.swiper-container {
    overflow: hidden;
    position: relative;

    & + .text {
        margin-top: 0px;
    }
}
.swiper-button-prev,
.swiper-button-next {
    height: 50px;
    width: 50px;
    top: 50%;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
    left: var(--swiper-navigation-sides-offset, 5px);
    right: auto;

    @media only screen and
    (max-width : 767px) {
        left: -1vw;
    }
}

.swiper-button-next, .swiper-rtl .swiper-button-prev {
    right: var(--swiper-navigation-sides-offset, 5px);
    left: auto;

    @media only screen and
    (max-width : 767px) {
        right: -1vw;
    }
}

.swiper-button-prev::after, .swiper-button-next::after {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 50px;
    margin: auto;
    width: 50px;
}
.swiper-button-prev::after {
    background-image: url(../../images/accent/arrow-left.png);
}
.swiper-button-next::after {
    background-image: url(../../images/accent/arrow-right.png);
}
.introduction_box.bgcolor1 {
    background: #F0FAFF;
}