@charset "UTF-8";
/* ==========================================================================
   タブレット幅でのレイアウト調整
   ========================================================================== */

@media screen and (min-width: 769px) and (max-width: 1024px) {
    body {
        background-image: none
    }

    .hero-recruit {
        padding: 0;
    }
    .hero-recruit-inner {
        background-image: url(../images/hero-image_tablet.jpg);
        background-size: cover;
        background-position: center top;
        padding: 32px 20px 32px;
        height: auto;
    }

    .hero-recruit-image {
        display: none;
    }

    .hero-recruit-copy {
        font-size: 40px;

    }

    .hero-recruit-content {
        position: static;
        width: 100%;
        height: auto;
        padding: 0;
        text-align: left;
        pointer-events: auto;
        box-sizing: border-box;
    }

    .section-stats,
    .section-fields,
    .section-roles
    {
        padding: 32px 0;
    }

    .section-stats .container,
    .section-fields .container,
    .section-roles .container
    {
        padding: 0 20px;
    }

    .stats-header {
        /*width: 415px;*/
        width: 313px;
    }

    .stats-header h2 {
        white-space: normal;
    }

    .stats-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        width: 100%;
        flex-shrink: 0;
        justify-content: space-between;
    }

    .fields-grid {
        grid-template-columns: repeat(5, 1fr);
    }

    .section-fields::before {
        content: "";
        position: absolute;
        left: -80px;
        bottom: 0px;
        width: 43vw;
        height: 43vw;
        background-image: url(../images/ellipse.svg);
        background-size: contain;
        background-repeat: no-repeat;
        z-index: -1;
    }

    .section-roles::before {
        content: "";
        position: absolute;
        right: -50px;
        bottom: 120px;
        width: 20vw;
        height: 20vw;
        background-image: url(../images/ellipse.svg);
        background-size: contain;
        background-repeat: no-repeat;
        z-index: -1;
    }
}