@charset "utf-8";
/* ====================================================
project
==================================================== */
/* related
---------------------------------------------------- */
.c-related__sec {
    padding: 32px 8px 40px;
}
.c-related__sec:nth-of-type(odd) {
    background-color: var(--tl-color-pnk-01);
}
.c-related__sec:nth-of-type(even) {
    background-color: var(--tl-color-wht);
}

/* sec title */
.c-related__sec h2 {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}
.c-related__sec h2::after {
    display: none !important;
}
.c-related__sec h2.c-sec__title {
    margin-bottom: 8px !important;
}
.c-related__sec .c-sec__title--en {
    font-size: min(8.5vw, 32px) !important;
}
.c-related__sec .c-sec__title--ja {
    font-size: min(3.6vw, 14px) !important;
}

/* layout */
.c-related__sec .c-article--colmun,
.c-related__sec .c-article--row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
.c-related__sec .c-article--colmun .c-article__wrap:nth-child(-n + 2) {
    width: calc(calc(100% - 8px) / 2);
}

.c-related__sec h2.c-article__title {
    margin-bottom: 4px !important;
    font-size: 14px !important;
}
@media screen and (min-width: 520px) {
    .c-related__sec {
        padding: 32px 6% 40px;
    }
    .c-related__sec .c-sec__title--en {
        font-size: 36px !important;
    }
    .c-related__sec .c-sec__title--ja {
        font-size: 16px !important;
    }
    .c-related__sec .c-article--colmun {
        gap: 16px;
    }
    .c-related__sec .c-article--colmun .c-article__wrap:nth-child(-n + 2) {
        width: calc(calc(100% - 16px) / 2);
    }
}
@media screen and (min-width: 960px) {
    .c-related__sec .c-sec__title--en {
        font-size: 42px !important;
    }
    .c-related__sec .c-sec__title--ja {
        font-size: 18px !important;
    }
    .c-related__sec .c-article--colmun .c-article__wrap {
        width: calc(calc(100% - 16px) / 2);
    }
    .c-related__sec .c-article--row .c-article__wrap {
        width: 100%;
    }
    .c-related__sec .c-article__category,
    .c-related__sec .c-article__company {
        font-size: 11px;
    }
    .c-related__sec .c-article__date {
        font-size: 12px;
    }
}
@media screen and (min-width: 1240px) {
    .c-related__sec {
        padding: 32px 16px 40px;
    }
    .c-related__sec .c-article--row .c-article__wrap {
        width: calc(calc(100% / 2) - 8px);
    }
    .c-related__sec .c-article--row .c-article__caption {
        padding-left: 8px;
    }
    .c-related__sec .c-article--colmun {
        gap: 8px;
    }
    .c-related__sec .c-article--colmun .c-article__wrap:nth-child(-n + 2) {
        width: calc(calc(100% - 24px) / 4);
    }
    .c-related__sec .c-article--colmun .c-article__wrap {
        width: calc(calc(100% - 24px) / 4);
    }
}
