/* 機能一覧 */

.page-links .content-block ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.page-links .content-block ul li a {
    padding: 30px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    background: #f2f2f2;
    position: relative;
}

.page-links .content-block ul li a::after {
    content: "";
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 17px;
    height: 11px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="11" viewBox="0 0 17 11" fill="none"><path d="M15.5 2L8.5 9L1.5 2" stroke="%23333333" stroke-width="2.4186" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-size: contain;
}

.page-links .content-block ul li a:hover {
    opacity: .5;
}

@media screen and (max-width: 767px) {
    .page-links .content-block ul {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .page-links .content-block ul li a {
        font-size: .9rem;
    }
}