@charset "utf-8";

/* SP Only */

@media (max-width: 767px) {
    main {
        padding-right: 0;
    }
}

/* title
------------------------------------------------ */

.page__desc-title::before {
    width: 48px;
    height: 217px;
    background: url("/assets/img/service/title-en.svg") no-repeat center/contain;
}

/* SP Only */

@media (max-width: 767px) {
    .page__desc-title::before {
        width: 24px;
        width: 6.4vw;
        height: 108.5px;
        height: 28.93333vw;
    }
}


/* products
------------------------------------------------ */

.products {
    padding: 50px 40px 40px 50px;
}

.products__desc-title {
    font-weight: 500;
    font-size: 24px;
    letter-spacing: calc(10 / 1000 * 24px);
}

.products__desc-text {
    margin-top: 20px;
    line-height: 32px;
}

.products__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
        flex-wrap: wrap;
    justify-content: center;
    margin-top: 40px;

    -ms-flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    gap: 25px;
}

.products__list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    width: 48.4375%;
    padding: 10px 10px 10px 20px;
    background: #ffffff;

    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
}


.products__item-desc {
    position: relative;
    width: 47.311827957%;
    padding: 0 10px;
}

.products__item-desc::after {
    position: absolute;
    top: -10px;
    left: 0;
    width: 1px;
    height: 50px;
    background-color: #ff7ca6;
    content: "";
}

.products__item-title {
    color: #3c5c7d;
    font-weight: bold;
    font-size: 20px;
    letter-spacing: -.05em;
    white-space: nowrap;
}

.products__item-text {
    margin-top: 20px;
    color: #3c5c7d;
    font-weight: 500;
}
.products__item-figure {
    width: 204px;
}

.products__figure {
    position: absolute;
    right: -132px;
    bottom: 0;
    z-index: 1000;
    width: 220px;
}

/* 1240 Under */

@media (max-width: 1360px) {
    .products__list-item {
        width: 100%;
        max-width: 600px;
    }
}


/* SP Only */

@media (max-width: 767px) {
    .products {
        padding: 35px 0 200px;
        padding: 9.33333vw 0 53.33333vw;
    }
    .products__desc {
        padding: 0 85px 0 20px;
        padding: 0 22.66666vw 0 5.33333vw;
    }

    .products__desc-title {
        font-size: 18px;
        font-size: 4.8vw;
        letter-spacing: -.08em;
        white-space: nowrap;
    }
    .products__desc-text {
        line-height: 24px;
        line-height: 6.4vw;
    }

    .products__list {
        width: 350px;
        width: 93.33333vw;
        margin: 0 auto;
        margin-top: 55px;
        margin-top: 14.66666vw;

        gap: 12.5px;
        gap: 3.33333vw;
    }


    .products__list-item {
        width: 100%;
        min-width: auto;
        max-width: none;
        padding: 5px 5px 5px 20px;
        padding: 1.33333vw 1.33333vw 1.33333vw 5.33333vw;
        background: #ffffff;
    }

    .products__item-desc {
        width: 160px;
        width: 42.66666vw;
        padding: 5px 0 0 10px;
        padding: 1.33333vw 0 0 2.66666vw;
    }

    .products__item-desc::after {
        top: -5px;
        top: -1.33333vw;
        width: 1px;
        height: 37.5px;
        height: 10vw;
    }

    .products__item-title {
        font-size: 15px;
        font-size: 4vw;
    }
    .products__item-figure {
        width: 155px;
        width: 41.33333vw;
    }
    .products__item-text {
        margin-top: 10px;
        margin-top: 2.66666vw;
    }

    .products__figure {
        right: 25%;
        bottom: -8px;
        bottom: -2.13333vw;
                transform: translate(-50%,0);
        width: 164.5px;
        width: 43.86666vw;
        z-index: 1;

        -webkit-transform: translate(-50%,0);
            -ms-transform: translate(-50%,0);
    }
}