.job-list { padding: 60px 0 80px; background: var(--color-grey-light-1); }
.job-list--bg-white { background: var(--color-white); }

.job-list__group + .job-list__group { margin-top: 48px; }

.job-list__title {
    font-size: 26px; line-height: 34px; font-weight: 700;
    color: var(--color-black);
    margin: 0 0 24px;
}

.job-list__items {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.job-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    background: var(--color-white);
    border-radius: var(--radius-md);
    padding: 20px 24px;
}
.job-list--bg-white .job-item { background: var(--color-grey-light-1); }

.job-item__body { flex: 1; min-width: 0; }
.job-item__title {
    font-size: 16px; line-height: 24px; font-weight: 700;
    color: var(--color-black);
    margin: 0 0 4px;
}
.job-item__text {
    font-size: 14px; line-height: 22px; color: var(--color-grey-dark);
    margin: 0;
}
.job-item__cta {
    flex-shrink: 0;
    height: 42px;
    padding: 10px 22px;
    font-size: 14px;
}

.job-list__note {
    font-size: 14px; line-height: 22px;
    color: var(--color-black-soft);
    margin: 32px 0 0;
}

@media (max-width: 767px) {
    .job-list { padding: 32px 0 48px; }
    .job-list__group + .job-list__group { margin-top: 32px; }
    .job-list__title { font-size: 20px; line-height: 28px; margin-bottom: 16px; }
    .job-item { flex-direction: column; align-items: stretch; gap: 12px; padding: 18px 20px; }
    .job-item__cta { align-self: flex-start; }
    .job-list__note { display: none; }
}