/* ========================================
   FeatU - サービス概要ページ
   ======================================== */

.service-page {
    font-family: "Google Sans Flex", 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
    color: var(--fontcolor);
}

.service-page__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0px 40px 38px;
}

/* ---------- Intro ---------- */
.service-intro {
    margin-top: 58px;
    text-align: center;
    margin-bottom: 62px;
}

.service-intro__text {
    font-size: 20px;
    line-height: 2.4;
    color: var(--fontcolor);
}

/* ---------- Figure (hub & spoke) ---------- */
.service-figure {
    margin-top: 48px;
    text-align: center;
}

.service-figure__img {
    max-width: 100%;
    height: auto;
}

.service-figure__img--pc {
    display: inline-block;
    width: min(960px, 100%);
}

.service-figure__img--sp {
    display: none;
    width: min(360px, 100%);
}

/* ---------- Details list ---------- */
.service-details {
    margin-top: 100px;
}

.service-details__list {
    margin: 0;
    padding: 0;
}

.service-details__row {
    display: flex;
    align-items: flex-start;
}

.service-details__term {
    flex: 0 0 240px;
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--fontcolor);
    line-height: 1.2;
    border-top: solid 2px #000;
    padding-top: 24px;
    padding-left: 16px;
}

.service-details__term-note {
    font-size: 14px;
    font-weight: 500;
}

.service-details__desc {
    flex: 1 1 auto;
    margin: 0;
    font-size: 14px;
    line-height: 1.8;
    color: var(--fontcolor);
    border-top: solid 1px #cacaca;
    padding-top: 24px;
    padding-left: 28px;
    padding-bottom: 48px;
}

.service-details__bullets {
    list-style: none;
    margin: 0;
    padding: 0;
}

.service-details__bullets li {
    position: relative;
    padding-left: 18px;
}

.service-details__bullets li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.7em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--fontcolor);
}

.service-details__schedule {
    max-width: 100%;
    height: auto;
    width: min(640px, 100%);
}

.service-details__notes {
    list-style: none;
    margin: 0;
    padding: 0;
}

.service-details__notes li {
    position: relative;
    padding-left: 14px;
    text-indent: 0;
}

.service-details__notes li::before {
    content: '・';
    position: absolute;
    left: 0;
    top: 0;
}

.service-details__notes li + li {
    margin-top: 6px;
}

/* ---------- Responsive (SP) ---------- */
@media (max-width: 768px) {
    .service-page__inner {
        padding: 16px 0px 20px;
    }

    .service-intro {
        margin-top: 24px;
        margin-bottom: 24px;
        text-align: left;
    }

    .service-intro__text {
        font-size: 16px;
        line-height: 2;
    }

    .service-intro__text br {
        display: none;
    }

    .service-figure {
        margin-top: 32px;
    }

    .service-figure__img--pc {
        display: none;
    }

    .service-figure__img--sp {
        display: inline-block;
    }

    .service-details {
        margin-top: 40px;
    }

    .service-details__row {
        flex-direction: column;
        gap: 0px;
        padding: 0;
    }

    .service-details__term {
        flex: none;
        font-size: 14px;
        padding: 16px 0;
        width: 100%;
    }

    .service-details__desc {
        font-size: 13px;
        padding: 12px 0 32px;
        width: 100%;
    }
    .service-details__bullets li {
        padding-left: 13px;
    }
    .service-details__bullets li::before{
        top: .5em;
    }
}
