@charset "UTF-8";
/* Equipment--------------------------------------------------------- */
.equipment{
    .detail-mv-container::before{
        background: rgba(0, 0, 0, .38);;
    }
}
.equipment-tab-lists{
    margin: 0 auto;
    max-width: 575px;
    justify-content: center;
    align-items: center;
    gap: 24px;
}
.equipment-tab{
    width: calc(50% - 12px);
    height: 56px;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, .4);
    a{
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
        color: #000;
        font-size: 16px;
        position: relative;
        &::before{
            content: '';
            padding: 3px;
            position: absolute;
            top: 40%;
            right: 8%;
            border-bottom: 2px solid var(--primary);
            border-right: 2px solid var(--primary);
            transform: rotate(45deg);
        }
    }
    &.bg-brown{
        box-shadow: none;
        a{
            color: #fff;
            &::before{
                border-color: #fff;
            }
        }
    }
}
.bg-white{
    background-color: #fff;
}
.bg-brown{
    background-color: var(--primary);
}
.has-border{
    border: 1px solid #CBCBCB;
}
.equipment-heading{
    padding: clamp(32px, 5.3vw, 50px) 0;
    font-size: clamp(1.6rem, 2.8vw, 1.8rem);
    font-weight: 400;
    letter-spacing: .03rem;
}
.exclusive-lists{
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(20px, 4vw, 40px);
    figure{
        margin-bottom: 10px;
    }
}
.exclusive-list-item{
    & > .caption{
        margin-left: clamp(10px, 1.4vw, 14px);
        font-size: 85%;
    }
}
.exclusive-list-ttl{
    padding: 4px 0 4px clamp(10px, 1.4vw, 14px);
    min-height: 22px;
    align-self: center;
    position: relative;
    letter-spacing: .06rem;
    line-height: 1.3;
    &::before{
        content: '';
        width: 2px;
        height: 20px;
        position: absolute;
        top: 4px;
        left: 0;
        background-color: var(--primary);
    }
}
.common-lists{
    margin-inline: auto;
    max-width: 490px;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.common-list-item{
    figure{
        margin-bottom: 6px;
    }
}
.common-list-ttl{
    font-weight: 500;
    line-height: 1.2;
    span{
        font-size: 85%;
    }
}
@media screen and (max-width: 767px) {
    .exclusive-lists{
        grid-template-columns: repeat(2, 1fr);
    }
}