@charset "UTF-8";

/* ------------------------------- 
数字でわかる竜爪園
------------------------------- */

.data-grid {
    gap: 20px;
    padding: 0 0 80px;
    margin: 0;
    list-style: none;
}

.data-item {
    text-align: center;
    padding: 30px;
    width: 100%;
    background: #fff;
    border-radius: 30px;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
}

.data-item .label {
    line-height: 1.5;
    font-size: clamp(18px, 3.8vw, 24px);
    margin: 0 0 40px;
}

.data-item .label small {
    font-size: clamp(12px, 2.5vw, 16px);
}

.job-grid {
    gap: 10px 10px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.job-item {
    width: calc(50% - 5px);
}

@media (min-width: 1024px) {
    .data-grid {
        gap: 40px 20px;
    }

    .data-item {
        width: calc(50% - 10px);
    }

    .data-item.w-full {
        width: 100%;
    }

    .job-item {
        width: calc(33.333% - 6.666px);
    }
}

@media (min-width: 1280px) {
    .data-grid {
        gap: 76px;
    }

    .data-item {
        width: calc(50% - 38px);
        padding: 53px;
    }

    .data-item.w-full {
        width: 100%;
    }

    .job-grid {
        gap: 27px 10px;
    }

    .job-item {
        width: calc(20% - 8px);
    }
}