.m-cards .m-cards-inner.sm {
    display: none;
}

.m-cards .m-cards-inner.lg {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: fit-content;
    column-gap: var(--columnGap);
    padding: 0 var(--lateralMargin) 1.875vw; /*27px*/
}

.m-cards .m-cards-inner.lg .card {
    position: relative;
    display: flex;
    flex-flow: column;
    width: calc( (100% / 3) - (var(--columnGap) * .67 ) );
    height: fit-content;
    border-radius: 1.388vw; /*20px*/
    overflow: hidden;
    background-color: #FAF4F7;
    padding: 2.08vw 2.708vw; /*30px 39px*/
    row-gap: .694vw; /*10px*/
}

.m-cards .m-cards-inner .card:hover {
    background-color: #fff;
}

.m-cards .m-cards-inner .card .caption {
    font-size: 1.2rem;
}

.m-cards .m-cards-inner .card .caption::after {
    content: "";
    position: relative;
    display: inline-block;
    width: .556vw; /*8px*/
    height: .694vw; /*10px*/
    margin-left: .416vw; /*6px*/
    background-image: url('../../assets/svgs/arrow-black.svg');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    transform: translate(0, .12vw);
}


@media screen and (max-width: 1440px) {
	.m-cards .m-cards-inner.lg {
        padding: 0 var(--lateralMargin) 27px;
    }

    .m-cards .m-cards-inner.lg .card {
        border-radius: 20px;
        padding: 30px 39px;
        row-gap: 10px;
    }

    .m-cards .m-cards-inner.lg .card .caption::after {
        width: 8px;
        height: 10px;
        margin-left: 6px;
        transform: translate(0,1px);
    }
}


@media only screen and (max-width: 740px) {
    .m-cards .m-cards-inner.lg {
        display: none;
    }

    .m-cards .m-cards-inner.sm {
        position: relative;
        display: block;
        width: 100vw;
        height: fit-content;
        overflow: hidden;
        margin: -4vw 0 -5.641vw;  /*-16px 0 -22px*/
    }

    .m-cards .m-cards-inner .m-cards-swiper {
        position: relative;
        display: block;
        width: 100%;
        height: fit-content;
        padding: 0 8vw;
    }

    .m-cards .m-cards-inner.sm .swiper-slide {
        height: fit-content;
        width: 84vw;
    }

    .m-cards .m-cards-inner.sm .card {
        position: relative;
        display: flex;
        flex-flow: column;
        width: 100%;
        height: fit-content;
        border-radius: 5.128vw; /*20px*/
        overflow: hidden;
        background-color: #FAF4F7;
        padding: 7.435vw 6.923vw; /*29px 27px*/
        row-gap: 3.846vw; /*15px*/
    }

    .m-cards .m-cards-inner.sm .swiper-wrapper {
        padding-bottom: 2.564vw; /*10px*/
    }

    .m-cards .m-cards-inner.sm .carousel-pagination {
        position: relative;
        display: flex;
        justify-content: center;
        column-gap: .769vw; /*3px*/
        margin-top: 2.564vw; /*10px*/
    }

    .m-cards .m-cards-inner.sm .carousel-pagination .swiper-pagination-bullet {
        margin: 0;
        opacity: 1;
        background-color: #C5BEC1;
        width: 1.538vw; /*6px*/
        height: 1.538vw; /*6px*/
        transition: all .4s ease;
        -webkit-transition: all .4s ease;
        -moz-transition: all .4s ease;
        -o-transition: all .4s ease;
    }
    
    .m-cards .m-cards-inner.sm .carousel-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
        width: 4.615vw !important; /*18px*/
        border-radius: 7.692vw !important; /*30px*/
    }
}