@charset "UTF-8";


/* ================
toics
================== */
.section--membersTopics {
    padding: 72px 4.2% 80px;
}

.main__topics {
    text-align: center;
    font-size: 1.6rem;
    font-weight: 700;
}

.topics__large {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-color: rgb(193, 195, 67, 0.7);
    text-decoration-thickness: 30%;
    text-underline-offset: -13%;
    text-underline-position: from-font;
    font-size: 2.2rem;
}

.main__txt {
    margin-top: 40px;
    font-size: 1.6rem;
    letter-spacing: 0.05em;
    line-height: 1.8;
}

/* topics pc 1025px */
@media screen and (min-width:1025px) {
    .section--membersTopics {
        padding: 120px 9.7%;
    }

    .member__sp {
        display: none;
    }

    .main__topics {
        font-size: 1.6rem;
        display: flex;
        justify-content: center;
        align-items: baseline;
        gap: 8px;
    }

    .main__txt {
        width: 662px;
        margin: 40px auto 0;
    }

}



/* ====================
members
======================== */
.section--members {
    padding: 19px 4.2% 104px;
    background-color: #e6e6e6;
    z-index: 0;
}

.members__title {
    position: relative;
    font-size: 1.8rem;
    font-weight: 700;
}

.section--members .title::after {
    content: 'MEMBERS';
    position: absolute;
    top: -27px;
    left: -7%;
    color: #f5f5f5;
    opacity: 40%;
    text-align: center;
    font-family: 'Wittgenstein';
    font-size: 7.2rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    line-height: 1;
    z-index: -10;
}


.members__content {
    background-color: #f5f5f5;
    padding: 24px 8px;
    border-radius: 8px;
    margin-top: 40px;
}

.members__item {
    font-size: 1.6rem;
    margin-top: 40px;
}

.members__item:first-of-type {
    margin-top: 0;
}

.title__txt,
.txt__item,
.txt__supplement {
    margin-top: 16px;
    letter-spacing: 0.05em;
}

.txtItem__txt {
    margin-top: 4px;
}

.btn {
    padding: 4px 16px 4px 24px;
    gap: 32px;
}

/* members pc 600px */
@media screen and (min-width: 600px) {
    .section--membersTopics {
        padding: 72px 9.7% 80px;
    }

    .member__sp {
        display: none;
    }

    .topics__large {
        line-height: 2;
    }

    .section--members {
        padding: 32px 9.7% 160px;
    }

    .section--members .title::after {
        top: -41px;
        left: -13%;
    }

    .members__content {
        padding: 32px 16px;
    }
}

/* members pc 1024px */
@media screen and (min-width: 1024px) {
    .section--membersTopics {
        padding: 160px 9.7% 120px;
    }
    
    .main__topics {
        display: flex;
        align-items: baseline;
        gap: 4px;
        justify-content: center;
    }

    .main__txt {
        width: 662px;
        margin: 40px auto 0;
    }


    .section--members {
        padding: 48px 9.7% 240px;
    }
    
    .section--members .title::after {
        font-size: 10.4rem;
        top: -60px;
        left: -13%;
    }
    

    .members__content {
        max-width: 1160px;
        margin: 64px auto 0;
        padding: 80px 40px;
    }

    .members__title {
        margin-top: 80px;
        font-size: 2rem;
    }

    .members__title:first-of-type {
        margin-top: 0;
    }

    .members__item {
        margin-top: 64px;
    }
 
    .title__txt,
    .txt__item,
    .txt__supplement {
        margin-top: 16px;
    }
}

/* members pc 1440px */
@media screen and (min-width: 1440px) {
    .section--members {
        padding: 55px 9.7% 320px;
    }

    .section--members .title::after {
        font-size: 12rem;
        top: -69px;
        left: -13%;
    }

    .members__content {
        margin-top: 72px;
    }
}

/* members pc 2000px */
@media screen and (min-width: 2000px) {
    .section--membersTopics {
        padding: 200px 9.7% 160px;
    }

    .section--members {
        padding: 55px 9.7% 360px;
    }

    .title {
        text-align: center;
    }

    .section--members .title::after {
        left: 50%;
        transform: translateX(-50%);
    }
}

/* ===================
footer
===================== */
.footer::before {
    z-index: 0;
}

.footer__content {
    z-index: 01;
}