/* 仕事のこと: recruiting site typography and colors, scoped to this page. */
#recruiting.working .working-section *,
#recruiting.working .working-hero *,
#recruiting.working .working-page-head * {
    box-sizing: border-box;
}

#recruiting.working .working-hero {
    height: 340px;
    margin: 0;
    padding-right: 200px;
    overflow: hidden;
    background: #ececeb;
}

#recruiting.working .working-hero .fig {
    width: 100%;
    height: 100%;
    margin: 0;
    max-height: none;
}

#recruiting.working .working-hero .fig img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: cover;
    object-position: center 40%;
}

#recruiting.working .working-page-head {
    margin: 0;
    padding: 68px 200px 0 0;
    text-align: center;
}

#recruiting.working .working-page-head .title00 {
    margin: 0;
}

#recruiting.working .working-page-head .title00 .e,
#recruiting.working .working-page-head .title00 .j {
    display: block;
}

#recruiting.working .working-page-head .title00 .e {
    color: #313747;
    font-family: "Raleway", sans-serif;
    font-size: 4.2rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: .06em;
    text-transform: none;
}

#recruiting.working .working-page-head .title00 .j {
    margin-top: 8px;
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: .12em;
}

#recruiting.working .working-section {
    margin: 0;
    padding: 75px 200px 80px 0;
    border-bottom: 1px solid #eceef0;
}

#recruiting.working .working-section--tint {
    background: #f7f8fa;
}

#recruiting.working .working-section--flow {
    border-bottom: 0;
    padding-bottom: 100px;
}

#recruiting.working .working-section__inner {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 40px;
}

#recruiting.working .working-heading {
    margin-bottom: 30px;
}

#recruiting.working .working-heading__en,
#recruiting.working .working-flow__en {
    display: block;
    color: #a58e60;
    font-family: "Raleway", sans-serif;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

#recruiting.working .working-heading__en {
    margin-bottom: 3px;
    font-size: 1.3rem;
}

#recruiting.working .working-heading__ja {
    display: block;
}

#recruiting.working .working-heading h2.title02 {
    margin-bottom: 35px;
}

#recruiting.working .working-heading__catch {
    margin: 16px 0 0;
    color: #313747;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.5;
}

#recruiting.working .working-heading__lead {
    margin: 17px 0 0;
    line-height: 1.9;
}

#recruiting.working .working-copy p,
#recruiting.working .working-flow__text p,
#recruiting.working .working-training__item p {
    margin-bottom: 20px;
    line-height: 2;
}

#recruiting.working .working-copy p:last-child,
#recruiting.working .working-flow__text p:last-child,
#recruiting.working .working-training__item p:last-child {
    margin-bottom: 0;
}

#recruiting.working .working-guidelines {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin: 0;
}

#recruiting.working .working-guidelines__note {
    margin-top: 27px;
}

#recruiting.working .working-guidelines li {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px 20px 34px;
    margin: 0;
    border: 1px solid #e5eaf0;
    border-radius: 14px;
    background: #fff;
    text-align: center;
}

#recruiting.working .working-guidelines__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 105px;
    height: 105px;
    margin-bottom: 20px;
    border-radius: 27px;
    background: #e9eef5;
}

#recruiting.working .working-guidelines__icon img {
    display: block;
    width: 74px;
    height: 74px;
}

#recruiting.working .working-guidelines strong {
    display: block;
    margin-bottom: 10px;
    color: #313747;
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.5;
}

#recruiting.working .working-guidelines li > span:last-child {
    line-height: 1.8;
}

#recruiting.working .working-training {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

#recruiting.working .working-training__item {
    padding: 26px 27px 30px;
    border: 1px solid #e3e5e9;
    border-top: 3px solid #313747;
    background: #f7f8fa;
}

#recruiting.working .working-training__photo {
    margin: 0 0 20px;
}

#recruiting.working .working-training__photo img {
    display: block;
    width: 100%;
    height: auto;
}

#recruiting.working .working-training__item h3 {
    margin: 0 0 14px;
    color: #313747;
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

#recruiting.working .working-training__item h3 small {
    font-size: 1.3rem;
    font-weight: 400;
}

#recruiting.working .working-flow {
    margin-top: 42px;
}

#recruiting.working .working-flow__phase {
    display: grid;
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 24px;
    padding-bottom: 34px;
}

#recruiting.working .working-flow__phase + .working-flow__phase {
    padding-top: 38px;
    border-top: 1px solid #e5e7eb;
}

#recruiting.working .working-flow__phase-title {
    align-self: start;
    margin: 0;
    padding: 10px 12px;
    color: #fff;
    background: #313747;
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
}

#recruiting.working .working-flow__entries {
    min-width: 0;
    border-left: 1px solid #d9d3c8;
    padding-left: 24px;
}

#recruiting.working .working-flow__entry {
    display: grid;
    grid-template-columns: minmax(0, 40%) minmax(0, 1fr);
    gap: 26px;
    align-items: start;
}

#recruiting.working .working-flow__entry + .working-flow__entry {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #e5e7eb;
}

#recruiting.working .working-flow__photos {
    display: grid;
    gap: 5px;
    min-width: 0;
}

#recruiting.working .working-flow__photos--pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

#recruiting.working .working-flow__photos img {
    display: block;
    width: 100%;
    height: 190px;
    object-fit: cover;
}

#recruiting.working .working-flow__photos--pair img {
    height: 190px;
}

#recruiting.working .working-flow__en {
    margin: 0 0 8px;
    font-size: 1.15rem;
    line-height: 1.5;
}

#recruiting.working .working-flow__text h4 {
    margin: 0 0 12px;
    color: #313747;
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.5;
}

@media screen and (max-width: 1024px) and (min-width: 768px) {
    #recruiting.working .working-section__inner {
        padding: 0 28px;
    }
    #recruiting.working .working-flow__phase {
        grid-template-columns: 85px minmax(0, 1fr);
        gap: 16px;
    }
    #recruiting.working .working-flow__entry {
        grid-template-columns: minmax(0, 38%) minmax(0, 1fr);
        gap: 18px;
    }
    #recruiting.working .working-guidelines {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 767px) {
    #recruiting.working .working-hero {
        height: 220px;
        padding-right: 0;
    }
    #recruiting.working .working-page-head {
        padding: 45px 0 0;
    }
    #recruiting.working .working-page-head .title00 .e {
        font-size: 2.8rem;
    }
    #recruiting.working .working-page-head .title00 .j {
        font-size: 1.7rem;
        letter-spacing: .07em;
    }
    #recruiting.working .working-section {
        padding: 52px 0 56px;
    }
    #recruiting.working .working-section--flow {
        padding-bottom: 70px;
    }
    #recruiting.working .working-section__inner {
        padding: 0 20px;
    }
    #recruiting.working .working-heading__catch {
        font-size: 2rem;
    }
    #recruiting.working .working-guidelines {
        grid-template-columns: 1fr;
    }
    #recruiting.working .working-guidelines li {
        padding: 30px 22px 34px;
    }
    #recruiting.working .working-training {
        grid-template-columns: 1fr;
    }
    #recruiting.working .working-flow__phase {
        display: block;
        padding-bottom: 30px;
    }
    #recruiting.working .working-flow__phase + .working-flow__phase {
        padding-top: 30px;
    }
    #recruiting.working .working-flow__phase-title {
        margin-bottom: 18px;
    }
    #recruiting.working .working-flow__entries {
        margin-left: 3px;
        padding-left: 16px;
    }
    #recruiting.working .working-flow__entry {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    #recruiting.working .working-flow__photos img,
    #recruiting.working .working-flow__photos--pair img {
        height: 225px;
    }
    #recruiting.working .working-flow__photos--pair img {
        height: 170px;
    }
}

@media screen and (max-width: 480px) {
    #recruiting.working .working-flow__photos img {
        height: 210px;
    }
    #recruiting.working .working-flow__photos--pair img {
        height: 145px;
    }
}
