#hero {
    overflow: hidden;
}

#hero video {
    display: block;
    width: 100%;
    max-width: 2000px;
    margin-inline: auto;
}

#concept .flex {
    column-gap: 6rem;
}

#concept .text-content {
    width: 50%;
}

#concept h2 {
    margin-bottom: 10rem;
}

#concept .img-wrap {
    width: 50%;
    position: relative;
}

#concept .img-02 {
    width: 70%;
    margin-top: 3rem;
}

#concept .img-wrap span {
    font-family: "Allura", cursive;
    position: absolute;
    top: 100%;
    right: 0;
}

#menu .nails {
    column-gap: 4rem;
    position: relative;
}

#menu .nails .font-lg {
    writing-mode: vertical-rl;
    position: absolute;
    top: 0;
    right: 100%;
    font-family: "Alice", serif;
}

#menu .nails h3 {
    border-bottom: 1px solid var(--c-sub);
    padding-bottom: 0.5em;
}

#menu .nails img {
    width: 45%;
}

#menu .text-content {
    width: 55%;
}

#menu ul {
    margin-top: 10rem;
}

#menu li {
    width: 31%;
}

#menu ul h3 {
    font-size: clamp(1.5rem, 1.5vw, 1.6rem);
    margin-bottom: 0;
}

.slider-container {
    width: 100vw;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
}

.slider-container .slide-track {
    padding: 0;
    margin: 0;
    display: flex;
    will-change: transform;
}

.slider-container li {
    flex: 0 0 auto;
    width: 25vw;
    list-style: none;
}

.slider-container img {
    width: 100%;
    height: auto;
    display: block;
}

@media screen and (max-width: 992px) {
    .slider-container li {
        width: 50vw;
    }
}

.slide-track img {
    width: 100%;
    height: auto;
    display: block;
}

#voice li {
    background-color: #fff;
    padding-inline: min(3vw, 3rem);
    padding-block: 3rem;
}

#voice li:nth-child(n + 2) {
    margin-top: 5rem;
}

#voice li div:first-child {
    border-bottom: 1px solid var(--c-sub);
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}

#voice img {
    width: 20rem;
    max-width: 45vw;
}

#voice .title p {
    line-height: 1em;
}

#staff ul {
    row-gap: 4rem;
}

#staff li {
    width: 31%;
}

#staff h3 {
    color: var(--c-sub);
    margin-bottom: 0;
    margin-top: 1rem;
    font-size: clamp(2rem, 2.5vw, 2.4rem);
    font-weight: 500;
    margin-bottom: 0.5rem;
}

@media screen and (max-width: 992px) {
    .btn {
        margin-inline: auto;
    }

    #concept h2 {
        margin-bottom: 2em;
    }

    #concept strong {
        text-align: center;
    }

    #concept img {
        margin-bottom: 2rem;
    }

    #concept .text-content {
        width: 100%;
    }

    #concept strong {
        margin-bottom: 0.5em;
    }

    #top-page #menu .nails {
        row-gap: 2rem;
    }

    #menu .nails img,
    #menu .nails .text-content {
        width: 100%;
    }

    #menu .nails .font-lg {
        right: auto;
        left: -2vw;
    }

    #menu ul {
        flex-wrap: wrap;
        column-gap: 3%;
        row-gap: 4rem;
        justify-content: center;
    }

    #top-page #menu li {
        width: 47%;
    }

    #voice li {
        padding-block: 2rem;
    }

    #staff li {
        width: 100%;
    }
}
