.content .text,
.content .title {
    width: 66.6666%;
}

.content .title {
    margin: 0 0 3.2rem;
}

.content .list {
    margin: 5.5rem 0 0;
}

.content .list a {
    width: calc(50% - 2.6rem);
    margin: 0 0 5.5rem;
    display: block;
    overflow: hidden;
}

.content .list a .texts {
    flex-wrap: nowrap;
}

.content .list a .texts .tag {
    padding: 0.8rem 1.6rem;
    border-radius: 6.0rem;
}

.content .list a .texts .name {
    margin-right: 2.4rem;
}

.content .list a .image {
    overflow: hidden;
    margin-bottom: 2.4rem;
    border-radius: 1.6rem;
}

.content .list a .image .cover {
    aspect-ratio: 58 / 32;
}

.content .list a .image .hover {
    inset: 0;
    background: rgba(192,125,83, 0);
    transition: background 0.3s ease-out;
}

.content .list a .image .hover .circle {
    width: 12.0rem;
    height: 12.0rem;
    transform: scale(0) rotate(45deg);
    transition: transform 0.3s ease-out;
    border-radius: 50%;
}

.content .list a .image .hover .circle svg {
    width: 1.2rem;
}

.content .list a .image .hover .circle svg path { fill: white }

.content .list .sep {
    width: 100%;
    margin: 0 0 5.5rem;
    border-top-width: 1px;
    border-top-style: solid;
}

.content .list a:first-child {
    width: 100%;
}

.content .list a:first-child .image .cover {
    aspect-ratio: 120 / 32;
}

@media (max-width: 1100px) {
    .content .text,
    .content .title {
        width: 100%;
    }

    .content .list a {
        width: calc(50% - 1.5rem);
    }

    .content .list a:first-child .image .cover {
        aspect-ratio: 58 / 32;
    }
}

@media (max-width: 767px) {
    .content .list a {
        width: 100%;
    }
}

.testimonials {

}

.testimonials .icon {
    width: 3rem;
    margin: 0 0 3rem;
}

.testimonials:after,
.testimonials:before {
    top: 0;
    width: calc(50% - 35rem);
    height: 100%;

    content: '';
    display: block;
    position: absolute;

    background: url(../images/pattern-02.png);
    background-size: auto 64rem;
    background-repeat: repeat;
}

.testimonials:after { left: 0; background-position: right center }
.testimonials:before { right: 0; background-position: left center }

.testimonials .text {
    text-align: center;
}

.testimonials .name {
    margin: 4.8rem 0 0;
}

.testimonials .splide__slide { width: 100% }


@media (max-width: 1100px) {
    .testimonials .title br {
        display: none;
    }

    .testimonials .name {
        text-align: center;
    }
    .testimonials .name strong {
        display: block;
    }
}

@media (any-hover: hover) {
    .content .list a:hover .image .hover {
        background: rgba(192,125,83, 0.46);
    }

    .content .list a:hover .image .hover .circle {
        transform: scale(1) rotate(0deg);
    }
}