/* ------------------------------
Custom properties
------------------------------ */

:root {
    --color-ink: #111;
    --color-white: #fff;
    --color-brand: #27a76b;
    --color-hero: #1d4030;
    --color-coral: #c64f61;
    --color-muted: #4b5563;
    --color-line: #e5e7eb;
    --color-paper: #fafaf8;
    --color-data: #2aa03a;
    --font-sans: "Noto Sans JP", sans-serif;
    --font-en: "Gotham-Bold", "Noto Sans JP", sans-serif;
    --font-en-medium: "Gotham-Bold", "Noto Sans JP", sans-serif;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --header-height: 60px;
    --content-width: 1240px;
    --page-width: 1370px;
    --inner-width: 1120px;
    --page-inset: calc((100% - var(--page-width)) / 2);
}

/* ------------------------------
Reset
------------------------------ */

@font-face {
    font-family: "Gotham-Bold";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("/common/fonts/Gotham-Bold.otf") format("opentype");
}


html {
    font-size: 10px;
    scroll-behavior: smooth;
}

html,
body,
div,
header,
footer,
main,
section,
nav,
ul,
ol,
li,
a,
p,
h1,
h2,
h3,
figure,
button,
span,
img,
video,
dl,
dt,
dd {
    box-sizing: border-box;
}

body {
    margin: 0;
    color: var(--color-ink);
    background: var(--color-white);
    font-family: var(--font-sans);
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

body.is-locked {
    overflow: hidden;
}

img,
video {
    display: block;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

p,
h1,
h2,
h3,
h4,
ul,
ol,
dl,
figure {
    margin: 0;
}

ul,
ol {
    padding: 0;
    list-style: none;
}

#wrapper {
    overflow-x: clip;
}

.d-n {
    display: none;
}

/* ------------------------------
Header
------------------------------ */

.header {
    position: fixed;
    top: 30px;
    left: 50%;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: min(var(--content-width), calc(100% - 48px));
    height: var(--header-height);
    transform: translateX(-50%);
}

.header_main,
.header_actions {
    display: flex;
    align-items: center;
    height: 100%;
}

.header_main {
    min-width: 0;
    gap: 16px;
    padding: 0 24px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
}

.header_actions {
    flex: 0 0 auto;
    margin-left: 12px;
}

.header_logo {
    display: block;
    flex: 0 0 auto;
    width: 162px;
}

.header_logo img {
    width: 100%;
    height: auto;
}

.header_divider {
    order: 2;
    width: 1px;
    height: 29px;
    flex: 0 0 auto;
    background: rgba(17, 17, 17, 0.18);
}

.header_label {
    order: 1;
    flex: 0 0 auto;
    margin: 0;
    color: var(--color-ink);
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.25;
    white-space: nowrap;
}

.header_main nav {
    order: 3;
}

.menuList {
    display: flex;
    align-items: center;
    gap: clamp(12px, 1.6vw, 32px);
    min-width: 0;
    margin-left: 8px;
}

.menuList_link {
    color: var(--color-ink);
    font-size: clamp(1.2rem, 1vw, 1.4rem);
    font-weight: 500;
    line-height: 1.25;
    white-space: nowrap;
    transition: color 200ms ease;
}

.menuList_link:hover,
.menuList_item-current .menuList_link {
    color: var(--color-brand);
}

.header_actions {
    gap: 12px;
    flex: 0 0 auto;
}

.hamburger {
    display: none;
    position: relative;
    width: 44px;
    height: 44px;
}

.hamburger_line,
.hamburger_line::before,
.hamburger_line::after {
    display: block;
    width: 18px;
    height: 1px;
    background: var(--color-ink);
}

.hamburger_line {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.hamburger_line::before,
.hamburger_line::after {
    content: "";
    position: absolute;
    left: 0;
}

.hamburger_line::before {
    top: -6px;
}

.hamburger_line::after {
    top: 6px;
}

.jsHero[data-state="intro"] .header_divider,
.jsHero[data-state="intro"] .menuList {
    visibility: hidden;
    opacity: 0;
    width: 0;
    margin: 0;
    overflow: hidden;
    pointer-events: none;
}

/* ------------------------------
Buttons / links
------------------------------ */

.button {
    position: relative;
    z-index: 0;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 10px;
    overflow: hidden;
    height: 60px;
    padding: 0 24px;
    border-radius: 999px;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.button::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--color-brand);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 280ms var(--ease-out);
}

.button:hover::before,
.button:focus-visible::before {
    transform: scaleX(1);
}

.header_actions .button::before {
    transition-duration: 150ms;
}

.header_actions .button:hover::before,
.header_actions .button:focus-visible::before {
    transition-duration: 280ms;
}

.button_label,
.button_arrow {
    position: relative;
    z-index: 1;
}

.button_arrow {
    width: 10px;
    height: 10px;
    flex: 0 0 auto;
}

.button-primary {
    color: var(--color-white);
    background: var(--color-ink);
}

.button-primary:hover,
.button-primary:focus-visible,
.button-dark:hover,
.button-dark:focus-visible {
    color: var(--color-white);
}

.button-primary .button_arrow,
.button-dark .button_arrow {
    filter: brightness(0) invert(1);
}

.interviewCard-suda,
.relatedCard-suda { --person: #c64f61; }
.interviewCard-minamiKei,
.relatedCard-minamiKei { --person: #3b68a8; }
.interviewCard-izawa,
.relatedCard-izawa { --person: #7353a3; }
.interviewCard-kawabuchi,
.relatedCard-kawabuchi { --person: #6f7e32; }
.interviewCard-kobayashi,
.relatedCard-kobayashi { --person: #347a65; }
.interviewCard-minami,
.relatedCard-minami { --person: #b9652b; }
.interviewCard-onishi,
.relatedCard-onishi { --person: #ac963e; }

.section.section-follow {
    padding: 0;
}

.section-follow .section_inner {
    width: 100%;
}

.space-xs {
    margin-top: 0.8rem;
}

.space-s {
    margin-top: 1.2rem;
}

.space-16 {
    margin-top: 1.6rem;
}

.space-20 {
    margin-top: 2rem;
}

.space-m {
    margin-top: 2.4rem;
}

.space-l {
    margin-top: 3.2rem;
}

.space-xl {
    margin-top: 6.4rem;
}

.lead-narrow {
    max-width: 760px;
}

.lead-wide {
    max-width: 860px;
}

.button-secondary {
    border: 1px solid var(--color-ink);
    background: var(--color-white);
    color: var(--color-ink);
}

.button-secondary:hover,
.button-secondary:focus-visible {
    color: var(--color-white);
}

.button-light {
    color: var(--color-ink);
    background: var(--color-white);
}

.button-light::before {
    background: rgba(255, 255, 255, 0.18);
}

.button-dark {
    color: var(--color-white);
    background: rgba(17, 17, 17, 0.88);
}

.button-dark::before {
    background: rgba(17, 17, 17, 0.12);
}

.textLink {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    transition: color 280ms var(--ease-out);
}

.textLink:hover,
.textLink:focus-visible {
    color: var(--color-brand);
}

.textLink_arrow {
    line-height: 1;
}

/* ------------------------------
Menu SP
------------------------------ */

.menuSp {
    position: fixed;
    inset: 0;
    z-index: 40;
    display: flex;
    flex-direction: column;
    visibility: hidden;
    opacity: 0;
    overflow: hidden;
    background: #f6debb url("/recruit/new-graduates/img/top/common/bg_hero.jpg") center / cover no-repeat;
    color: var(--color-ink);
    transition: opacity 150ms var(--ease-out), visibility 150ms var(--ease-out);
}

.menuSp_video {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.menuSp.is-open {
    visibility: visible;
    opacity: 1;
}

.menuSp_inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: auto;
}

.menuSp_bar {
    box-sizing: border-box;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    width: min(var(--content-width), calc(100% - 48px));
    height: var(--header-height);
    margin: 30px auto 0;
    padding: 0 20px;
    border-radius: 36px;
    background: var(--color-white);
}

.menuSp_brand {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.menuSp_logo {
    width: 162px;
    height: auto;
}

.menuSp_label {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.25;
    white-space: nowrap;
}

.menuSp_close {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
}

.menuSp_close img {
    width: 24px;
    height: 24px;
}

.menuSp_body {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 30px 34px 16px;
}

.menuSp_list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.menuSp_link {
    display: flex;
    align-items: center;
    height: 48px;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.4;
}

.menuSp_actions {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.menuSp_actions .button {
    width: 100%;
    height: 52px;
    padding: 0 30px;
    font-size: 1.6rem;
}

/* ------------------------------
Hero
------------------------------ */

.hero {
    position: relative;
    background: var(--color-white);
}

.hero_stage {
    --hero-photo-width: min(1130px, 78.47vw);
    position: relative;
    height: 100svh;
    min-height: 720px;
    overflow: hidden;
    background: #f6debb url("/recruit/new-graduates/img/top/common/bg_hero.jpg") center / cover no-repeat;
}

.hero_video {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.hero_grid,
.heroPhoto {
    position: absolute;
    top: 90px;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
}

.hero_grid {
    z-index: 1;
    display: grid;
    width: calc(var(--hero-photo-width) * 1280 / 1130);
    aspect-ratio: 1280 / 640;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(4, 1fr);
}

.hero_gridCell {
    display: grid;
    place-items: center;
}

.hero_gridCell img {
    width: 100%;
    height: 100%;
}

.heroPhoto {
    z-index: 2;
    width: var(--hero-photo-width);
    aspect-ratio: 1130 / 640;
}

.heroPhoto_slot {
    position: absolute;
    margin: 0;
    overflow: hidden;
    opacity: 0;
    transform: scale(0.96);
}

.heroPhoto_slot.is-visible {
    opacity: 1;
    transform: none;
    transition: opacity 480ms var(--ease-out), transform 480ms var(--ease-out);
}

.heroPhoto_slot picture {
    display: contents;
}

.heroPhoto_slot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.heroPhoto_slot-01 { top: 68.91%; left: 74.34%; width: 17.7%; height: 21.88%; }
.heroPhoto_slot-02 { top: 45.16%; left: 74.34%; width: 25.66%; height: 23.75%; }
.heroPhoto_slot-03 { top: 17.19%; left: 84.78%; width: 12.39%; height: 27.97%; }
.heroPhoto_slot-04 { top: 67.19%; left: 8.32%; width: 17.88%; height: 19.69%; }
.heroPhoto_slot-05 { top: 23.44%; left: 4.6%; width: 21.59%; height: 24.06%; }
.heroPhoto_slot-06 { top: 9.38%; left: 24.6%; width: 20.18%; height: 34.22%; }
.heroPhoto_slot-07 { top: 17.19%; left: 44.78%; width: 21.86%; height: 28.13%; }
.heroPhoto_slot-08 { top: 45.31%; left: 48.67%; width: calc(25.67% + 1px); height: 42.97%; }
.heroPhoto_slot-09 { top: 11.72%; left: 66.02%; width: 18.76%; height: 19.22%; }
.heroPhoto_slot-10 { top: 30.94%; left: 66.64%; width: 19.65%; height: 21.56%; }
.heroPhoto_slot-11 { top: 47.5%; left: 0; width: 26.19%; height: 19.69%; }
.heroPhoto_slot-12 { top: 43.59%; left: 26.19%; width: 22.48%; height: 50.63%; }

.hero_heading {
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: 5;
    width: min(1370px, calc(100% - 48px));
    padding: 0 0 30px;
    transform: translateX(-50%);
    color: var(--color-ink);
}

.hero_brand,
.hero_row {
    margin: 0;
}

.hero_brand {
    display: flex;
    align-items: baseline;
}

.hero_en {
    font-family: var(--font-en);
    font-size: clamp(4rem, 4.86vw, 7rem);
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.3;
}

.hero_no {
    font-size: clamp(2.6rem, 3.19vw, 4.6rem);
    font-weight: 900;
    line-height: 1.3;
    transform: translateY(-0.08em);
}

.hero_row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
    font-size: clamp(4.4rem, 7.22vw, 10.4rem);
    font-weight: 700;
    line-height: 1.3;
    white-space: nowrap;
}

.hero_segment,
.hero_year,
.hero_unit,
.hero_segment-you {
    display: inline-flex;
    align-items: center;
}

.hero_segment {
    gap: 0;
}

.hero_year {
    margin-left: -12px;
    gap: 6px;
}

.hero_number {
    position: relative;
    display: inline-block;
    font-family: var(--font-en);
    font-size: 1.291em;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.04em;
}

.hero_number.is-drawn .hero_numberText {
    color: transparent;
}

.hero_numberInk {
    position: absolute;
    pointer-events: none;
}

.hero_wo {
    letter-spacing: -0.1em;
}

.hero_comma {
    letter-spacing: -0.5em;
}

.hero_ku {
    margin-left: -0.12em;
    margin-right: -0.2em;
}

.hero_segment-you {
    gap: 10px;
}

.hero_highlight {
    display: inline-block;
    background: var(--color-ink);
    color: var(--color-white);
    font-size: 0.992em;
    line-height: 1.3;
}

/* ------------------------------
Message
------------------------------ */

.message {
    padding: clamp(8rem, 9.72vw, 14rem) 0 clamp(12rem, 13.89vw, 20rem);
    background: var(--color-white);
}

.message_inner {
    display: flex;
    flex-direction: column;
    gap: clamp(7.2rem, 8.33vw, 12rem);
    width: min(var(--page-width), calc(100% - 48px));
    margin-inline: auto;
}

.message_label {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.message_labelJa {
    font-size: clamp(2rem, 1.67vw, 2.4rem);
    font-weight: 700;
    letter-spacing: 0.0833em;
    line-height: 1.3;
}

.message_content {
    display: grid;
    grid-template-columns: minmax(0, 55rem) minmax(18rem, 40rem);
    align-items: start;
    justify-content: space-between;
    column-gap: clamp(3.2rem, 4vw, 8rem);
    width: min(var(--inner-width), 100%);
    margin-inline: auto;
}

.message_copy {
    display: flex;
    flex-direction: column;
    gap: clamp(4rem, 4.17vw, 6rem);
    max-width: 55rem;
}

.message_heading {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.message_catch {
    display: inline-block;
    padding: 0 2px;
    background: var(--color-ink);
    color: var(--color-white);
    font-size: clamp(2.8rem, 2.78vw, 4rem);
    font-weight: 700;
    letter-spacing: 0.025em;
    line-height: 1.25;
}

.message_catchNext {
    font-size: clamp(2.8rem, 2.78vw, 4rem);
    font-weight: 700;
    letter-spacing: 0.025em;
    line-height: 1.25;
}

.message_body {
    display: flex;
    flex-direction: column;
    gap: 26px;
    font-size: 1.6rem;
    line-height: 1.6;
}

.message_signature {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.message_signature p {
    color: var(--color-muted);
    font-size: clamp(2.4rem, 2.22vw, 3.2rem);
    font-weight: 700;
    line-height: 1.3;
}

.message_signature span {
    color: var(--color-muted);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
}

.message_visual {
    position: sticky;
    top: 40px;
    justify-self: end;
    width: 100%;
    max-height: calc(100vh - 80px);
    aspect-ratio: 400 / 610;
}

.message_visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ------------------------------
Shared sections
------------------------------ */

.section {
    padding: 120px 0;
}

.section_inner {
    width: min(var(--content-width), calc(100% - 80px));
    margin: 0 auto;
}

.enLabel {
    font-family: var(--font-en);
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.3;
}

.titleL {
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.025em;
}

.titleM {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.lead {
    font-size: 1.6rem;
    line-height: 1.8;
}

/* ------------------------------
About / numbers
------------------------------ */

.about {
    position: relative;
    background: var(--color-brand);
    color: var(--color-ink);
}

.about_deco {
    position: absolute;
    top: 0;
    left: 0;
    width: min(440px, 34vw);
    height: auto;
    pointer-events: none;
}

.about_content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
    padding-top: clamp(8rem, 11.11vw, 16rem);
}

.about_heading {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: min(var(--page-width), calc(100% - 48px));
    margin-inline: auto;
}

.about_label {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.about_labelJa {
    font-size: clamp(2rem, 1.67vw, 2.4rem);
    font-weight: 700;
    letter-spacing: 0.0833em;
    line-height: 1.3;
}

.about_headline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    color: var(--color-white);
    font-size: clamp(2.8rem, 2.78vw, 4rem);
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.3;
    text-align: right;
}

.about_headlineLead {
    padding: 10px 4px 14px 0;
}

.about_headlineBr {
    display: none;
}

.about_mark {
    display: inline-block;
    padding: 0 2px;
    background: var(--color-ink);
    color: var(--color-white);
    letter-spacing: 0.025em;
}

.about_mark-reverse {
    background: var(--color-white);
    color: var(--color-ink);
}

.about_media {
    position: relative;
    width: min(1040px, calc(100% - 48px));
    aspect-ratio: 100 / 113;
    container-type: inline-size;
}

.about_photo {
    position: absolute;
    object-fit: cover;
}

.about_photo-01 {
    top: 0;
    left: 0;
    width: 76.35%;
    height: 50cqw;
}

.about_photo-02 {
    top: 47.88cqw;
    left: 65.38%;
    width: 34.62%;
    height: 34.62cqw;
}

.about_body {
    position: absolute;
    top: 58.65cqw;
    left: 5.19%;
    display: flex;
    flex-direction: column;
    gap: 2.31cqw;
    width: 42.31%;
    color: var(--color-white);
    font-size: 1.54cqw;
    font-weight: 500;
    line-height: 1.6;
}

.about_paragraph-space {
    margin-top: 2.88cqw;
}

.about_numbers {
    position: relative;
    z-index: 1;
    padding: clamp(8rem, 9.72vw, 14rem) 0 clamp(10rem, 13.89vw, 20rem);
}

.about_numbersTitle {
    width: min(var(--page-width), calc(100% - 48px));
    margin-inline: auto;
    padding: 0 0 60px;
    color: var(--color-white);
    font-size: clamp(3.6rem, 4.44vw, 6.4rem);
    font-weight: 700;
    line-height: 1.3;
}

.numberList {
    --numbers-inset: max(24px, calc((100vw - 1440px) / 2 + 80px));
    display: flex;
    gap: 50px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scroll-padding-inline: var(--numbers-inset);
    width: 100%;
    margin-inline: 0;
    padding: 0 var(--numbers-inset) 8px;
    cursor: grab;
    scrollbar-width: none;
}

.numberList img {
    -webkit-user-drag: none;
    user-select: none;
}

.numberList.is-dragging {
    cursor: grabbing;
    scroll-snap-type: none;
    user-select: none;
}

.numberList::-webkit-scrollbar {
    display: none;
}

.numberList_item {
    display: flex;
    flex: 0 0 min(1100px, calc(100vw - var(--numbers-inset) - 210px));
    box-sizing: border-box;
    height: 500px;
    scroll-snap-align: start;
    background: var(--color-white);
}

.numberList_illust {
    display: flex;
    flex: 0 0 50%;
    align-items: center;
    justify-content: center;
    max-width: 500px;
    padding: 30px;
}

.numberList_illust img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.numberList_body {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 40px;
    min-width: 0;
    padding: 40px 28px 72px;
    container-type: inline-size;
}

.numberList_copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: inherit;
    max-width: 100%;
}

.numberList_label {
    font-size: clamp(2rem, 1.67vw, 2.4rem);
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
}

.numberList_labelLine {
    display: inline-block;
}

.numberList_metric {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.numberList_value {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    gap: 10px;
    width: max-content;
    max-width: 100%;
    white-space: nowrap;
}

.numberList_figure {
    flex-shrink: 0;
    font-family: var(--font-en);
    font-size: clamp(7.2rem, 10.42vw, 15rem);
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.numberList_prefix {
    font-weight: 700;
    line-height: 1.2;
}

.numberList_prefix-orange {
    color: #e37d12;
    font-size: clamp(2.8rem, 2.78vw, 4rem);
}

.numberList_value-green .numberList_figure {
    color: var(--color-data);
}

.numberList_value-orange .numberList_figure {
    color: #e37d12;
    font-size: min(clamp(7.2rem, 10.42vw, 15rem), 20cqw);
}

.numberList_value-teal .numberList_figure {
    color: #099999;
}

.numberList_value-purple {
    flex-wrap: wrap;
    row-gap: 4px;
    max-width: 100%;
}

.numberList_value-purple > br {
    flex-basis: 100%;
    width: 0;
    height: 0;
    overflow: hidden;
}

.numberList_value-purple .numberList_prefix,
.numberList_value-purple .numberList_figure {
    color: #9c6fa5;
}

.numberList_value-purple .numberList_figure {
    font-size: min(clamp(7.2rem, 10.42vw, 15rem), 28cqw);
}

.numberList_value-purple .numberList_unit {
    font-size: min(clamp(2rem, 2.22vw, 3.2rem), 11cqw);
}

.numberList_value-purple .numberList_prefix {
    font-size: min(clamp(3.2rem, 3.47vw, 5rem), 11.5cqw);
}

.numberList_unit {
    flex-shrink: 0;
    color: var(--color-ink);
    font-size: clamp(3.2rem, 3.47vw, 5rem);
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.numberList_unit-small {
    font-size: clamp(2rem, 2.22vw, 3.2rem);
}

.numberList_note {
    position: absolute;
    right: 28px;
    bottom: 28px;
    color: var(--color-muted);
    font-size: clamp(1.4rem, 1.39vw, 2rem);
    line-height: 1.6;
    text-align: left;
}

.numberList_br {
    display: none;
}

/* ------------------------------
Qualities
------------------------------ */

.qualities {
    position: relative;
    overflow: hidden;
    background: var(--color-white);
}

.qualities_deco {
    position: absolute;
    top: 0;
    left: 0;
    width: min(440px, 34vw);
    height: auto;
    pointer-events: none;
}

.qualities_heading {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    width: min(var(--page-width), calc(100% - 48px));
    margin-inline: auto;
    padding: clamp(8rem, 11.11vw, 16rem) 0 0;
}

.qualities_headingMain {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.qualities_title {
    display: flex;
    align-items: center;
    gap: 14px;
}

.qualities_titleMark {
    padding: 0 2px;
    background: var(--color-ink);
    color: var(--color-white);
    font-size: clamp(2.4rem, 2.22vw, 3.2rem);
    font-weight: 700;
    line-height: 1.3;
}

.qualities_titleRest {
    display: inline-flex;
    align-items: baseline;
    padding: 20px 0;
    font-size: clamp(4rem, 4.44vw, 6.4rem);
    font-weight: 700;
    line-height: 1.3;
}

.qualities_count {
    font-family: var(--font-en-medium);
    font-size: clamp(5.6rem, 5.56vw, 8rem);
    font-weight: 500;
    line-height: 1;
}

.qualities_countUnit {
    font-size: clamp(3.2rem, 3.06vw, 4.4rem);
}

.qualities_lead {
    width: min(460px, 34vw);
    color: var(--color-muted);
    font-size: clamp(1.5rem, 1.25vw, 1.8rem);
    line-height: 1.6;
}

.qualityList {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
    width: min(var(--inner-width), calc(100% - 48px));
    margin-inline: auto;
    padding: 80px 0 60px;
}

.qualityList_item {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 30px 0;
    color: var(--color-white);
    text-align: center;
}

.qualityList_item-red {
    background: #d72b22;
}

.qualityList_item-orange {
    background: #e37d12;
}

.qualityList_item-teal {
    background: #099999;
}

.qualityList_name {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 132px;
    padding: 0 10px;
    font-size: clamp(2.4rem, 2.5vw, 3.6rem);
    font-weight: 700;
    line-height: 1.3;
}

.qualityList_cross {
    font-size: clamp(1.8rem, 1.53vw, 2.2rem);
    line-height: 1;
}

.qualityList_lead {
    padding: 0 16px;
    font-size: clamp(1.8rem, 1.67vw, 2.4rem);
    font-weight: 700;
    line-height: 1.6;
}

.qualityLead_line {
    display: inline-block;
}

.qualityDetail {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 380px) 312px minmax(0, 380px);
    column-gap: 60px;
    align-items: center;
    justify-content: center;
    min-height: 754px;
    padding: 48px max(40px, calc((100% - var(--inner-width)) / 2));
    overflow: hidden;
    background: #f5f3f0;
}

.qualityDetail_col {
    display: flex;
    flex-direction: column;
    gap: 70px;
}

.qualityDetail_col-right {
    gap: 60px;
}

.qualityDetail_spacer {
    width: 312px;
    height: 1px;
}

.qualityDetail_figure {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 312px;
    height: 800px;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.qualityDetail_item {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.qualityDetail_title {
    align-self: flex-start;
    padding: 0 4px;
    color: var(--color-white);
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.6;
}

.qualityDetail_title-red {
    background: #d72b22;
}

.qualityDetail_title-orange {
    background: #e37d12;
}

.qualityDetail_title-teal {
    background: #099999;
}

@media screen and (min-width: 1200px) {
    .qualityDetail_title-teal {
        white-space: nowrap;
    }
}

.qualityDetail_lead {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
}

.qualityDetail_body {
    display: flex;
    flex-direction: column;
    gap: 20px;
    color: var(--color-muted);
    font-size: 1.4rem;
    line-height: 1.6;
}

/* ------------------------------
Page links / marquee
------------------------------ */

.pageLinks {
    padding: clamp(8rem, 11.11vw, 16rem) 0;
    background: var(--color-white);
    color: var(--color-ink);
}

.pageLinks_stage {
    position: relative;
    height: 650px;
    overflow: hidden;
}

.pageLinks_track {
    display: flex;
    width: max-content;
    animation: marquee 40s linear infinite;
}

.pageLinks_set {
    position: relative;
    flex: 0 0 1754px;
    width: 1754px;
    height: 650px;
    margin-right: 40px;
}

.pageLinks_photo {
    position: absolute;
    object-fit: cover;
}

.pageLinks_photo-01 { top: 0; left: 0; width: 26.8%; height: 55.38%; }
.pageLinks_photo-02 { top: 53.85%; left: 14.82%; width: 20.52%; height: 41.54%; }
.pageLinks_photo-03 { top: 4.62%; left: 31.36%; width: 17.12%; height: 35.38%; }
.pageLinks_photo-04 { top: 46.15%; left: 41.62%; width: 22.78%; height: 47.08%; }
.pageLinks_photo-05 { top: 7.69%; left: 54.73%; width: 13.1%; height: 27.08%; }
.pageLinks_photo-06 { top: 0; left: 71.84%; width: 17.5%; height: 35.38%; }
.pageLinks_photo-07 { top: 43.08%; left: 72.41%; width: 27.54%; height: 56.92%; }

.pageLinks_brand {
    position: absolute;
    top: 30%;
    left: 0;
    width: 100%;
    color: var(--color-data);
    font-family: var(--font-en-medium);
    font-size: clamp(6.4rem, 18.06vw, 26rem);
    font-weight: 500;
    line-height: 1;
    text-align: center;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.15);
    pointer-events: none;
}

.pageLinks_heading {
    display: flex;
    flex-direction: column;
    width: min(var(--page-width), calc(100% - 48px));
    margin-inline: auto;
    padding: 20px 0 0;
}

.pageLinks_title {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 20px 0;
    font-size: clamp(2.8rem, 2.78vw, 4rem);
    font-weight: 700;
    letter-spacing: 0.025em;
    line-height: 1.25;
}

.pageLinks_titleEn {
    font-family: var(--font-en-medium);
    font-size: clamp(3.6rem, 3.61vw, 5.2rem);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3;
}

.pageLinks_titleMark {
    padding: 0 2px;
    background: var(--color-ink);
    color: var(--color-white);
}

.pageLinks_cards {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 40px;
    width: min(var(--inner-width), calc(100% - 48px));
    margin-inline: auto;
    padding: 40px 0 0;
}

.pageLink {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1 1 0;
    gap: 20px;
    width: auto;
    max-width: 400px;
    min-width: 0;
    height: auto;
    min-height: 603px;
    padding: 60px 0;
    border: 1px solid var(--color-ink);
    background: var(--color-white);
    color: var(--color-ink);
    transition: background-color 280ms var(--ease-out);
}

.pageLink:hover,
.pageLink:focus-visible {
    background: #f3f4f6;
}

.pageLink_body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: 100%;
}

.pageLink_en {
    font-family: var(--font-en);
    font-size: 2rem;
    letter-spacing: 0.1em;
    line-height: 1.3;
}

.pageLink_en-career {
    color: #9c6fa5;
}

.pageLink_en-culture {
    color: var(--color-data);
}

.pageLink_en-business {
    color: #d72b22;
}

.pageLink_content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
    width: 100%;
}

.pageLink_title {
    padding-left: 20px;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
}

.pageLink_photo {
    width: min(300px, 100%);
    height: 164px;
    object-fit: cover;
}

.pageLink_text {
    font-size: 1.6rem;
    line-height: 1.6;
    text-align: center;
}

.pageLink_button {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: min(320px, 100%);
    height: 56px;
    padding: 0 36px;
    overflow: hidden;
    border: 1px solid var(--color-ink);
    background: var(--color-white);
    color: var(--color-ink);
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1;
}

.pageLink_button::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--color-ink);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 280ms var(--ease-out);
}

.pageLink:hover .pageLink_button,
.pageLink:focus-visible .pageLink_button {
    color: var(--color-white);
}

.pageLink:hover .pageLink_button::before,
.pageLink:focus-visible .pageLink_button::before {
    transform: scaleX(1);
}

.pageLink:hover .pageLink_arrow,
.pageLink:focus-visible .pageLink_arrow {
    filter: brightness(0) invert(1);
}

.pageLink_arrow {
    position: absolute;
    top: 50%;
    right: 16px;
    z-index: 1;
    width: 10px;
    height: 10px;
    transform: translateY(-50%);
    filter: brightness(0);
}

@keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

/* ------------------------------
Entry
------------------------------ */

.entry {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
    padding: 120px 20px;
    background: var(--color-brand);
    color: var(--color-white);
}

.entry_copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: min(var(--page-width), 100%);
}

.entry_title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
}

.entry_line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.entry_chunk {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.entry_chunk-next {
    gap: 10px;
}

.entry_ja-next {
    margin-right: -10px;
}

.entry_en {
    font-family: var(--font-en-medium);
    font-size: clamp(5.6rem, 6.94vw, 10rem);
    font-weight: 500;
    line-height: 1.3;
}

.entry_ja {
    font-size: clamp(4.4rem, 5.56vw, 8rem);
}

.entry_lead {
    font-size: clamp(1.8rem, 1.67vw, 2.4rem);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-align: center;
}

.entry_actionsWrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: min(700px, 100%);
}

.entry_actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 60px;
}

.entry_button {
    position: relative;
    display: flex;
    align-items: center;
    width: 320px;
    height: 80px;
    padding: 0 52px;
    overflow: hidden;
    border: 1px solid var(--color-ink);
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 1;
}

.entry_button::before {
    content: "";
    position: absolute;
    inset: 0;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 280ms var(--ease-out);
}

.entry_button:hover::before,
.entry_button:focus-visible::before {
    transform: scaleX(1);
}

.entry_button-secondary {
    background: var(--color-white);
    color: var(--color-ink);
}

.entry_button-secondary::before {
    background: rgb(17 17 17 / 12%);
}

.entry_button-primary {
    background: var(--color-ink);
    color: var(--color-white);
}

.entry_button-primary::before {
    background: rgb(255 255 255 / 18%);
}

.entry_label,
.entry_arrow {
    position: relative;
    z-index: 1;
}

.entry_arrow {
    position: absolute;
    top: 30px;
    right: 20px;
    width: 20px;
    height: 20px;
}

.entry_button-secondary .entry_arrow {
    filter: brightness(0);
}

.entry_button-primary .entry_arrow {
    filter: brightness(0) invert(1);
}

.entry_note {
    font-size: 1.3rem;
    line-height: 1.5;
    text-align: center;
}

/* ------------------------------
Footer
------------------------------ */

.footer {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding-top: 64px;
    background: #333;
    color: var(--color-white);
}

.footer_main {
    display: flex;
    flex-direction: column;
    gap: 60px;
    width: min(var(--page-width), calc(100% - 48px));
    margin-inline: auto;
}

.footer_logo {
    display: block;
    width: 260px;
}

.footer_logo img {
    width: 100%;
    height: auto;
}

.footer_content {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
}

.footer_columns {
    display: flex;
    gap: 70px;
}

.footer_heading {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
}

.footer_heading a {
    transition: color 200ms var(--ease-out);
}

.footer_heading a:hover,
.footer_heading a:focus-visible {
    color: var(--color-brand);
}

.footer_list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 25px;
}

.footer_link {
    color: var(--color-white);
    font-size: 1.4rem;
    transition: color 200ms var(--ease-out);
}

.footer_link:hover,
.footer_link:focus-visible {
    color: var(--color-brand);
}

.footer_badge {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 10px;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.6;
}

.footer_badge img {
    width: 40px;
    height: 44px;
    object-fit: contain;
}

.footer_legal {
    padding: 15px max(24px, calc((100% - var(--page-width)) / 2));
    background: var(--color-ink);
    color: var(--color-white);
    font-family: var(--font-en-medium);
    font-size: 1.1rem;
    font-weight: 500;
    letter-spacing: 0.05em;
}

/* ------------------------------
Subpage hero
------------------------------ */

.subHero {
    position: relative;
    min-height: 640px;
    display: flex;
    align-items: flex-end;
    color: var(--color-ink);
    overflow: hidden;
}

.subHero_video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.subHero_shade {
    position: absolute;
    inset: 0;
    background: rgba(90, 134, 232, 0.34);
    pointer-events: none;
}

.subHero_shade::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.1);
}

.subHero-people .subHero_shade {
    background: rgba(73, 184, 141, 0.32);
}

.subHero-business .subHero_shade {
    background: rgba(230, 125, 110, 0.3);
}

.subHero_inner {
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    width: min(1440px, 100%);
    margin: 0 auto;
    padding: 260px 70px 200px;
}

.subHero_title {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 20px 0 0;
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.025em;
}

.subHero_mark {
    display: inline-flex;
    align-items: center;
    padding: 0 2px;
    background: var(--color-ink);
    color: var(--color-white);
}

.subHero_mark-light {
    background: var(--color-white);
    color: var(--color-ink);
}

.subHero_lead {
    max-width: none;
    margin-top: 80px;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.6;
}

.subHero_leadRest {
    display: none;
}

/* ------------------------------
Career
------------------------------ */

.execMessages {
    padding: 200px 0 0;
    background: #f5f3f0;
}

.execMessages_inner {
    width: min(1200px, calc(100% - 48px));
    margin-inline: auto;
}

.execMessages_title {
    display: flex;
    flex-direction: column;
    gap: 30px;
    font-size: clamp(3.2rem, 4.44vw, 6.4rem);
    font-weight: 700;
    line-height: 1.3;
}

.execMessages_line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.execMessages_line:first-child {
    gap: 0;
}

.execMessages_piece {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.execMessages_mark {
    padding: 0 2px;
    background: var(--color-ink);
    color: var(--color-white);
}

.execMessages_mark-reverse {
    background: var(--color-white);
    color: var(--color-ink);
}

.execMessage {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding-top: 200px;
}

.execMessage:first-child {
    padding-top: 90px;
}

.execMessage:last-child {
    padding-bottom: 200px;
}

.execMessage-reverse {
    flex-direction: row-reverse;
}

.execMessage_photo {
    flex: 0 0 540px;
    width: 540px;
    max-width: 46%;
    aspect-ratio: 540 / 700;
    margin: 0;
}

.execMessage_photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.execMessage_photo-yoshioka {
    box-shadow: 160px 90px 0 #fff;
}

.execMessage_photo-umetsu {
    box-shadow: -100px 100px 0 #fff;
}

.execMessage_photo-taketomi {
    box-shadow: 120px 100px 0 #fff;
}

.execMessage_content {
    max-width: 620px;
}

.execMessage_body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: clamp(1.6rem, 1.67vw, 2.4rem);
    font-weight: 400;
    line-height: 2;
}

.execMessage_body p {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.execMessage_name {
    margin-top: 60px;
    color: var(--color-muted);
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.execMessage_role {
    margin-top: 10px;
    color: var(--color-muted);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
}

.growth_system {
    background: var(--color-brand);
    color: var(--color-white);
}

.growth {
    position: relative;
    overflow: clip;
    background: var(--color-white);
    color: var(--color-ink);
}

.growth_inner {
    position: relative;
    width: min(1440px, 100%);
    margin-inline: auto;
    padding: 160px 0;
}

.growth_deco {
    position: absolute;
    top: 0;
    left: 0;
    width: 440px;
    height: 387px;
    background: url("/recruit/new-graduates/img/career/deco_growth.png?v=chevron") left top / 100% 100% no-repeat;
    pointer-events: none;
}

.growth_intro {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.growth_heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.growth_en {
    font-family: var(--font-en-medium);
    font-size: min(14.5rem, 9.7vw);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.0125em;
    white-space: nowrap;
    color: var(--color-brand);
    text-align: center;
}

.growth_title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 6.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.growth_mark {
    padding: 0 2px;
    background: var(--color-ink);
    color: var(--color-white);
}

.growth_overview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: min(1000px, calc(100% - 80px));
    min-height: 500px;
    margin-inline: auto;
}

.growth_figure {
    flex: 0 0 500px;
    width: 500px;
    height: 500px;
    object-fit: contain;
}

.growth_lead {
    width: 430px;
    max-width: 46%;
    color: var(--color-muted);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.6;
    line-break: strict;
}

.growth_panelWrap {
    padding: 0 60px;
}

.growth_panel {
    padding: 0 60px 100px;
    background: var(--color-brand);
}

.growth_systemLabel {
    padding: 30px 0 90px;
    font-family: var(--font-en);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.1em;
    text-align: right;
}

.growth_steps {
    display: flex;
    flex-direction: column;
    gap: 60px;
}

.growth_stepsHead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.growth_blockTitle {
    color: var(--color-white);
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.05em;
    text-align: center;
}

.growth_blockLine {
    display: inline-block;
}

.growth_stepsNote {
    color: var(--color-white);
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1.5;
}

.growth_map {
    container-type: inline-size;
    width: 100%;
    overflow: clip;
}

.growth_mapInner {
    position: relative;
    width: 1200px;
    height: 642px;
    zoom: calc(100cqw / 1200px);
}

.growth_mapPath {
    position: absolute;
    top: 129px;
    left: 0;
    width: 1190px;
    height: auto;
}

.growth_step {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 220px;
}

.growth_step-1 { left: 30px; top: 60px; }
.growth_step-2 { left: 530px; top: 0; }
.growth_step-3 { left: 600px; top: 450px; }
.growth_step-4 { left: 980px; top: 331px; }

.growth_stepHead {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.growth_year {
    align-self: flex-start;
    padding: 0 6px;
    background: var(--color-ink);
    color: var(--color-white);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.6;
}

.growth_stepTitle {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.6;
}

.growth_stepText {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.6;
}

.growth_envs,
.growth_learns {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding-top: 100px;
}

.growth_envList {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.growth_env {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    min-width: 0;
    padding: 40px 120px;
    background: var(--color-white);
    border: 1px solid var(--color-line);
}

.growth_envBody {
    flex: 1 1 500px;
    max-width: 500px;
}

.growth_envTitle {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.growth_envCatch {
    margin-top: 20px;
    margin-bottom: 40px;
    color: var(--color-muted);
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.3;
}

.growth_envText {
    color: var(--color-muted);
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
}

.growth_envFigure {
    flex: 0 1 419px;
    width: 419px;
    min-width: 0;
    height: 270px;
    object-fit: cover;
}

.growth_learnList {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 30px;
}

.growth_learn {
    display: flex;
    flex: 1 1 380px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    box-sizing: border-box;
    width: 380px;
    max-width: 380px;
    padding: 40px 0;
    background: var(--color-white);
    border: 1px solid var(--color-line);
}

.growth_learnHead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 0 8px;
    text-align: center;
}

.growth_learnTitle {
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1;
}

.growth_learnCatch {
    color: var(--color-muted);
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.6;
}

.growth_learnIcon {
    width: 70px;
    height: 70px;
}

.growth_br {
    display: none;
}

.growth_learnText {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 110px;
    padding: 0 max(16px, calc((100% - 308px) / 2));
    color: var(--color-muted);
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.6;
}

/* ------------------------------
People
------------------------------ */

.interview {
    padding: 160px 0;
}

.interview_inner {
    width: min(1200px, calc(100% - 80px));
}

.interview_title {
    font-size: 6.4rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0;
    text-align: center;
}

.interview_lead {
    margin-top: 10px;
    color: var(--color-muted);
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
}

.interview_br {
    display: none;
}

.interviewSlider {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin-top: 60px;
}

.interviewCard {
    position: relative;
    display: block;
    aspect-ratio: 400 / 700;
    overflow: hidden;
    color: var(--color-white);
    -webkit-user-drag: none;
}

.interviewCard_photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-user-drag: none;
}

.interviewCard_shade {
    position: absolute;
    inset: 0;
    background: var(--person, rgba(17, 17, 17, 0.35));
    opacity: 0;
    transition: opacity 280ms var(--ease-out);
}

.interviewCard_body {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 90px 24px 24px;
    opacity: 0;
    transition: opacity 280ms var(--ease-out);
}

.interviewCard:hover .interviewCard_shade,
.interviewCard:focus-visible .interviewCard_shade {
    opacity: 0.8;
}

.interviewCard:hover .interviewCard_body,
.interviewCard:focus-visible .interviewCard_body {
    opacity: 1;
}

.interviewCard_quote {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    justify-content: center;
    gap: 20px;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.1;
}

.interviewCard_line {
    writing-mode: vertical-rl;
}

.interviewCard_profile {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
}

.interviewCard_name {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.interviewCard_meta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.3;
}

.interviewMessage {
    display: flex;
    grid-column: 2 / 4;
    grid-row: 3;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    padding-top: 200px;
    background: #f5f3f0;
    color: var(--color-ink);
}

.interviewMessage_mark {
    width: 93px;
    height: 100px;
}

.interviewMessage_copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    font-size: 3rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.07em;
    font-feature-settings: "palt";
    text-align: center;
}

.interviewGuide {
    display: none;
}

.credo {
    background: #f5f3f0;
    color: var(--color-ink);
}

.credo_inner {
    position: relative;
    width: min(1440px, 100%);
    margin: 0 auto;
    padding-bottom: 60px;
    border-bottom: 1px solid #e5e7eb;
}

.credo_heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 100px 120px 60px;
}

.credo_en {
    font-family: var(--font-en);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.1em;
}

.credo_headingBody {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.credo_title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 6.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.credo_mark {
    padding: 0 2px;
    background: var(--color-ink);
    color: #fff;
}

.credo_lead {
    color: var(--color-muted);
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
}

.credo_list {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    width: min(1200px, calc(100% - 80px));
    margin: 0 auto;
}

.credo_item {
    display: flex;
    flex-direction: column;
    gap: 16px;
    box-sizing: border-box;
    width: calc((100% - 40px) / 2);
    min-height: 200px;
    padding: 20px 60px;
    background: #fff;
}

.credo_name {
    font-family: var(--font-en);
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

.credo_name-free { color: #d72b22; }
.credo_name-speed { color: #e37d12; }
.credo_name-details { color: #2aa03a; }
.credo_name-change { color: #099999; }
.credo_name-limit { color: #9c6fa5; }

.credo_body {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.credo_statement {
    color: var(--color-ink);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 0.04em;
    text-align: center;
}

.credo_text {
    color: var(--color-muted);
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.6;
}

.credo_illust {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc((100% - 40px) / 2);
}

.credo_illust img {
    width: 367px;
    height: 200px;
    max-width: 100%;
    object-fit: contain;
}

.work {
    display: flex;
    flex-direction: column;
    background: #fff;
}

.work_heading,
.work_gallery,
.work_block,
.work_stats {
    box-sizing: border-box;
    width: min(1440px, 100%);
    margin-inline: auto;
}

.work_heading {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 160px 80px 100px;
}

.work_en {
    font-family: var(--font-en);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.1em;
}

.work_title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 6.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.work_mark,
.work_outline {
    padding: 0 2px;
}

.work_mark {
    background: var(--color-ink);
    color: #fff;
}

.work_outline {
    padding: 0 8px;
    background: #fff;
    border: 1px solid var(--color-ink);
}

.work_dot {
    font-size: 4rem;
    letter-spacing: 0.05em;
}

.work_br {
    display: none;
}

.work_gallery {
    overflow: hidden;
    padding-bottom: 160px;
}

@media screen and (min-width: 1460px) {
    .work_gallery {
        width: 100%;
    }
}

.work_track {
    display: flex;
    gap: 20px;
    width: max-content;
    animation: marquee 60s linear infinite;
}

.work_set {
    display: flex;
    gap: 20px;
}

.work_track img {
    flex: none;
    width: 508px;
    max-width: none;
    height: 270px;
    object-fit: cover;
}

.work_block {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
    padding: 100px 0;
}

.work_block > :not(.work_deco) {
    position: relative;
    z-index: 1;
    width: min(1120px, calc(100% - 48px));
}

.work_block-stock {
    gap: 32px;
    padding-bottom: 160px;
}

.work_deco {
    position: absolute;
    top: -80px;
    left: -61px;
    z-index: -1;
    width: 500px;
    max-width: none;
    height: 449px;
    pointer-events: none;
}

.work_blockHead {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.work_blockTitle {
    font-size: 6.4rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.04em;
}

.work_lead {
    max-width: 948px;
    color: var(--color-muted);
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.6;
}

.work_blockBody {
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.work_pickup {
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.work_pickupLabel {
    align-self: flex-start;
    padding: 0 2px;
    background: var(--color-ink);
    color: #fff;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.work_cards {
    display: flex;
    align-items: stretch;
    gap: 35px;
}

.work_card {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 20px;
    box-sizing: border-box;
    min-width: 0;
    min-height: 382px;
    padding: 0 30px 40px;
    background: #fff;
    border: 1px solid var(--color-ink);
}

.work_cardMedia {
    display: block;
    width: calc(100% + 60px);
    max-width: none;
    height: auto;
    aspect-ratio: 16 / 9;
    margin: 0 -30px;
    object-fit: cover;
    background: #d9d9d9;
}

.work_cardHead {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-height: 88px;
    text-align: center;
}

.work_cardHead h4 {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.4;
}

.work_cardNote {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
}

.work_cardText {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
}

.work_tripNote {
    display: block;
    margin-top: 12px;
    color: var(--color-muted);
    font-size: 1.4rem;
    line-height: 1.6;
    text-align: right;
}

.work_other {
    display: flex;
    align-items: flex-start;
}

.work_otherLabel {
    flex: none;
    width: 280px;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.3;
}

.work_otherList {
    flex: 1;
    min-width: 0;
}

.work_otherList li {
    padding: 20px;
    border-top: 1px solid #8e8e8e;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
}

.work_otherList li:last-child {
    border-bottom: 1px solid #8e8e8e;
}

.work_stock {
    display: flex;
    align-items: stretch;
    gap: 80px;
}

.work_stockBracket {
    flex: none;
    width: 12px;
    border: 1px solid #111;
    border-right: 0;
}

.work_stockBracket-end {
    border-right: 1px solid #111;
    border-left: 0;
}

.work_stockBody {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    padding: 40px;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.6;
}

.work_stockNote {
    font-size: 1.4rem;
    line-height: 1.6;
    text-align: right;
}

.work_stats {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    padding: 160px 0;
    border-top: 1px solid #8e8e8e;
}

.work_stats > * {
    width: min(1120px, calc(100% - 48px));
}

.work_statsTitle {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.work_statsInner {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 20px;
}

.work_statsGrid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    width: 100%;
}

.work_stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    width: calc((100% - 24px) / 2);
    height: 300px;
    padding: 40px 0;
    background: #f5f3f0;
}

.work_statLabel {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.6;
}

.work_statMark {
    margin-left: 4px;
    color: var(--color-ink);
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1;
    vertical-align: text-top;
}

.work_statValue-ratio .work_statMark {
    position: relative;
    top: 10px;
    margin-left: -1px;
}

.work_statValue {
    display: flex;
    flex: none;
    align-items: baseline;
    justify-content: center;
    gap: 10px;
    margin-top: auto;
    margin-bottom: auto;
}

.work_statValue-ratio {
    gap: 0;
}

.work_statNum {
    color: #2aa03a;
    font-family: var(--font-en);
    font-size: 11rem;
    font-weight: 700;
    line-height: 1;
}

.work_statUnit {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1;
}

.work_statSep {
    position: relative;
    top: -0.38em;
    color: #2aa03a;
    font-family: var(--font-en);
    font-size: 5rem;
    font-weight: 700;
    line-height: 1;
}

.work_statCaption {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.6;
}

.work_statsNotes {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.work_statsNote {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6;
}

/* ------------------------------
Business
------------------------------ */

.servicesIntro {
    padding: 160px 0 300px;
}

.servicesIntro_inner {
    display: flex;
    align-items: flex-end;
    gap: clamp(32px, 8.33vw, 120px);
    width: min(var(--content-width), calc(100% - 80px));
    min-height: 700px;
    margin: 0 auto;
}

.servicesIntro_visual {
    flex: 1 1 0;
    align-self: flex-end;
    min-width: 0;
    height: 460px;
}

.servicesIntro_visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.servicesIntro_copy {
    display: flex;
    flex: 0 0 540px;
    flex-direction: column;
    align-self: stretch;
    gap: clamp(40px, 5.5vw, 80px);
    width: 540px;
    max-width: 46%;
    min-width: 0;
}

.servicesIntro_title {
    font-size: clamp(3.2rem, 4.45vw, 6.4rem);
    font-weight: 700;
    line-height: 1.3;
}

.servicesIntro_lead {
    color: var(--color-muted);
    font-size: clamp(1.6rem, 1.39vw, 2rem);
    font-weight: 400;
    line-height: 1.6;
}

.serviceList {
    display: flex;
    flex-direction: column;
}

.service {
    position: relative;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    width: min(1440px, 100%);
    margin: 0 auto;
    padding: 0 clamp(40px, 8.33vw, 120px) 300px;
}

.service:last-child {
    padding-bottom: 200px;
}

.service_deco {
    position: absolute;
    top: -200px;
    left: -61px;
    z-index: 0;
    width: 500px;
    height: 449px;
    background: url("/recruit/new-graduates/img/business/deco_service.png") center / contain no-repeat;
    pointer-events: none;
}

.service:nth-child(even) .service_deco {
    left: auto;
    right: -61px;
    background-image: url("/recruit/new-graduates/img/business/deco_service_salad.png");
}

.service_body,
.service_media {
    position: relative;
    z-index: 1;
}

.service:nth-child(odd) .service_media {
    order: 2;
    justify-self: end;
}

.service:nth-child(even) .service_media {
    justify-self: start;
}

.service_media {
    min-width: 0;
    width: 100%;
}

.service_media-split {
    display: flex;
    flex-direction: column;
    max-width: 560px;
    aspect-ratio: 560 / 540;
}

.service_media-split img {
    width: 100%;
    flex: 1;
    min-height: 0;
    object-fit: cover;
}

.service_media-salad {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    max-width: 460px;
    aspect-ratio: 460 / 600;
}

.service_saladTop {
    display: flex;
    justify-content: center;
    gap: 20px;
    width: 100%;
    height: 36.666%;
}

.service_saladTop img {
    width: calc((100% - 20px) / 2);
    max-width: none;
    height: 100%;
    object-fit: contain;
}

.service_saladTop .service_saladRound {
    border-radius: 50%;
    object-fit: cover;
}

.service_saladMachine {
    width: 86.956%;
    max-width: none;
    flex: 1;
    min-height: 0;
    object-fit: contain;
}

.service_media-portrait {
    max-width: 560px;
    aspect-ratio: 560 / 600;
}

.service_media-portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service_kicker {
    margin-top: 80px;
    color: var(--color-ink);
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.service_kickerBrSp {
    display: none;
}

.service_title {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.service_logo {
    display: block;
    width: 480px;
    max-width: 100%;
    height: auto;
}

.service_logo-salad {
    width: 356px;
}

.service_logo-supporters {
    width: 444px;
}

.service:nth-child(n + 2) .service_kicker {
    margin-top: 60px;
}

.service_text {
    margin-top: 30px;
}

.service_text + .service_text {
    margin-top: 16px;
}

.service_link {
    margin-top: 36px;
}

.group {
    padding: 120px 0;
    background: #f5f3f0;
}

.group_inner {
    width: min(1280px, calc(100% - 160px));
    margin: 0 auto;
}

.group_title {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.groupList {
    display: flex;
    flex-direction: column;
    margin-top: 40px;
    background: #fff;
}

.groupCard_head {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 30px 40px;
}

.groupCard_logo {
    width: auto;
    height: auto;
}

.groupCard_logo-lumeal {
    width: 262px;
}

.groupCard_logo-yushoku {
    width: 198px;
}

.groupCard_logo-delivery {
    width: 358px;
}

.groupCard_note {
    color: var(--color-muted);
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
}

.groupCard_body {
    padding: 0 100px 80px;
}

.groupCard-delivery .groupCard_body {
    padding-bottom: 60px;
}

.groupCard_panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 50px 80px;
    background: #f5f3f0;
}

.groupCard_kicker {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
}

.groupCard_media {
    width: min(550px, 100%);
    margin-top: 40px;
}

.groupCard_media-wide {
    width: min(680px, 100%);
}

.groupCard_photo {
    width: 100%;
    height: 360px;
    object-fit: cover;
}

.groupCard_media-wide .groupCard_photo {
    height: auto;
    aspect-ratio: 2352 / 838;
}

.groupCard_info {
    width: min(600px, 100%);
    margin-top: 40px;
}

.groupCard_text {
    color: var(--color-muted);
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
}

.groupCard_info .service_link {
    margin-top: 32px;
}

.ownership {
    background: #fff;
    color: var(--color-ink);
    border-bottom: 1px solid #ccc;
}

.ownership_heading {
    padding: 200px 20px;
    text-align: center;
}

.ownership_title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 22px;
    font-size: 6.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.ownership_line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.ownership_mark {
    display: inline-block;
    padding: 0 2px;
    background: var(--color-ink);
    color: #fff;
}

.ownership_mark-green {
    background: var(--color-brand);
}

.ownership_mark-coral {
    background: #c64f61;
}

.ownership_shige {
    color: #d72b22;
}

.ownership_ge {
    color: #e37d12;
}

.ownership_ki {
    color: #2aa03a;
}

.ownership_lead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    margin-top: 120px;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.6;
}

.ownership_brSp,
.ownership_break {
    display: none;
}

.ownership_items {
    display: flex;
    flex-direction: column;
    gap: 120px;
    width: min(1200px, calc(100% - 80px));
    margin: 0 auto;
    padding-bottom: 200px;
}

.ownership_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    text-align: center;
}

.ownership_itemTitle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.025em;
}

.ownership_itemTitle-wide {
    line-height: 1.3;
    letter-spacing: 0.05em;
}

.ownership_item p {
    color: var(--color-muted);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
}

.ownership_statement {
    padding: 0 20px 200px;
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.025em;
    text-align: center;
}

/* ------------------------------
Interview detail
------------------------------ */

.personHero {
    position: relative;
    overflow: hidden;
    padding-top: 100px;
    color: #111;
}

.personHero-suda { background: #d37381; }
.personHero-minamiKei { background: #6688ba; }
.personHero-izawa { background: #9176b7; }
.personHero-kawabuchi { background: #8f9b59; }
.personHero-kobayashi { background: #5d9683; }
.personHero-minami { background: #dd804d; }
.personHero-onishi { background: #b8a146; }

.personHero_mv {
    position: relative;
    width: min(1440px, 100%);
    margin: 0 auto;
    padding: 0 clamp(20px, 8.33vw, 120px);
}

.personHero_deco {
    position: absolute;
    top: 0;
    left: -61px;
    z-index: 0;
    width: 500px;
    height: 449px;
    max-width: none;
    object-fit: cover;
    pointer-events: none;
}

.personHero_label {
    position: relative;
    z-index: 1;
    margin: 0;
    padding-top: 20px;
    color: #fff;
    font-family: var(--font-en);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.1em;
}

.personHero_inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: clamp(24px, 8vw, 160px);
    min-height: 900px;
}

.personHero_photo {
    flex: 0 1 440px;
    width: 440px;
    max-width: 42%;
    height: 690px;
}

.personHero_photo img {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
}

.personHero_content {
    display: flex;
    flex: 1 1 600px;
    flex-direction: column;
    gap: 140px;
    width: min(600px, 100%);
    max-width: 600px;
    min-width: 0;
    min-height: 900px;
}

.personHero_quote {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: max-content;
    max-width: min(720px, calc(100% + 80px));
    margin: 0;
    padding-top: 40px;
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.025em;
}

.personHero-suda .personHero_quote {
    gap: 30px;
}

.personHero_line {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 4px;
    width: max-content;
    max-width: 100%;
    white-space: nowrap;
}

.personHero_break {
    display: none;
}

.personHero_mark {
    display: inline-flex;
    align-items: center;
    padding: 0 2px;
    background: #111;
    color: #fff;
    white-space: nowrap;
}

.personHero_mark-line {
    background: #fff;
    color: #111;
}

.personHero_unit {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.personHero_meta {
    display: flex;
    flex-direction: column;
    gap: 60px;
}

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

.personHero_name {
    margin: 0;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
}

.personHero_role {
    margin: 0;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.3;
}

.personHero_profile {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.personHero_profileLabel {
    margin: 0;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.3;
}

.personHero_career {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.personHero_career li {
    display: flex;
    align-items: flex-start;
    gap: 40px;
}

.personHero_year {
    display: flex;
    flex: none;
    align-items: center;
    gap: 10px;
    width: 112px;
    min-height: 22px;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.6;
    white-space: nowrap;
}

.personHero_year::before {
    content: "";
    width: 12px;
    height: 12px;
    flex: none;
    background: url("/recruit/new-graduates/img/people/marker_career.svg") center / 12px 12px no-repeat;
}

.personHero_event {
    min-width: 0;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6;
}

@media screen and (min-width: 1400px) {
    .personHero_event-single {
        letter-spacing: -0.025em;
        white-space: nowrap;
    }
}

.since {
    --since: #cb5a6b;
    padding: 100px clamp(20px, 8.33vw, 120px) 0;
    background: #fff;
}

.since-suda { --since: #cb5a6b; }
.since-minamiKei { --since: #4b73ae; }
.since-izawa { --since: #7e5eaa; }
.since-kawabuchi { --since: #7b893c; }
.since-kobayashi { --since: #40836d; }
.since-minami { --since: #d76a2e; }
.since-onishi { --since: #9b883b; }

.since_panel {
    padding: 60px 0;
    background: var(--since);
    color: #fff;
}

.since_title {
    margin: 0;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
}

.since_body {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 40px;
    padding: 0 clamp(16px, 4.17vw, 60px);
}

.since_steps {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    margin: 0;
}

.since-kawabuchi .since_steps {
    gap: 30px;
    padding: 0 80px;
}

.since-kobayashi .since_steps {
    gap: 40px;
    padding: 0 160px;
}

.since_step {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}

.since_label {
    margin: 0;
    padding: 4px 8px;
    border-radius: 99px;
    background: #fff;
    color: var(--since);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
}

.since_text {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6;
}

.since_arrow {
    flex: none;
    width: 12px;
    height: 12px;
    margin-top: 12px;
    background: #fff;
    -webkit-mask: url("/recruit/new-graduates/img/people/marker_career.svg") center / 12px 12px no-repeat;
    mask: url("/recruit/new-graduates/img/people/marker_career.svg") center / 12px 12px no-repeat;
    -webkit-mask-mode: alpha;
    mask-mode: alpha;
}

.timeline {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 28px;
}

.timeline_item {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 20px;
}

.timeline_year {
    font-weight: 700;
}

.journey {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 40px;
    align-items: start;
}

.journey_steps {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.journey_step {
    padding: 16px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.journey_label {
    font-size: 1.4rem;
    font-weight: 700;
}

.factList {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.factList_item {
    padding: 20px;
    background: var(--color-white);
    color: var(--color-ink);
}

.factList_value {
    color: var(--color-data);
    font-family: var(--font-en);
    font-size: 4rem;
    line-height: 1;
}

.qaDetail {
    --since: #cb5a6b;
    padding: 160px 0;
    background: #fff;
    color: #111;
}

.qaDetail-suda { --since: #cb5a6b; }
.qaDetail-minamiKei { --since: #4b73ae; }
.qaDetail-izawa { --since: #7e5eaa; }
.qaDetail-kawabuchi { --since: #7b893c; }
.qaDetail-kobayashi { --since: #40836d; }
.qaDetail-minami { --since: #d76a2e; }
.qaDetail-onishi { --since: #9b883b; }

.qaDetail_inner {
    width: min(1440px, 100%);
    margin: 0 auto;
    padding: 0 clamp(20px, 8.33vw, 120px);
}

.qaDetail_list {
    display: flex;
    flex-direction: column;
    gap: 64px;
}

.qaDetail_row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 24px 90px;
}

.qaDetail_item + .qaDetail_item .qaDetail_row {
    padding-top: 40px;
    border-top: 1px solid #8e8e8e;
}

.qaDetail_q {
    display: flex;
    flex: 1 1 280px;
    align-items: center;
    gap: 10px;
    max-width: 530px;
}

.qaDetail_num {
    flex: none;
    padding: 0 4px;
    background: var(--since);
    color: #fff;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.qaDetail_ask {
    margin: 0;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.qaDetail_a {
    display: flex;
    flex: 1 1 360px;
    flex-direction: column;
    gap: 30px;
    min-width: 0;
}

.qaDetail_lead {
    margin: 0;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.6;
}

.qaDetail_text {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
    white-space: pre-line;
}

.qaDetail_photo {
    margin: 60px 0 0;
}

.qaDetail_photo-end {
    margin-left: 240px;
}

.qaDetail_photo img {
    width: 100%;
    height: auto;
    aspect-ratio: 1200 / 292;
    max-width: none;
    object-fit: cover;
}

.qaDetail_photo-end img {
    aspect-ratio: 960 / 589;
}

.day {
    padding: 0 0 160px;
    background: #fff;
}

.day-suda { --since: #cb5a6b; }
.day-minamiKei { --since: #4b73ae; }
.day-izawa { --since: #7e5eaa; }
.day-kawabuchi { --since: #7b893c; }
.day-kobayashi { --since: #40836d; }
.day-minami { --since: #d76a2e; }
.day-onishi { --since: #9b883b; }

.day_panel {
    width: min(1440px, 100%);
    margin: 0 auto;
    padding: 80px 0;
    background: var(--since);
    color: #fff;
}

.day_title {
    margin: 0;
    padding: 0 0 30px 120px;
    font-family: var(--font-en);
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
    color: #fff;
}

.day_gallery {
    display: flex;
    height: 255px;
}

.day_gallery img {
    flex: 1 1 0;
    width: 0;
    min-width: 0;
    height: 255px;
    max-width: none;
    object-fit: cover;
}

.day_scale {
    container-type: inline-size;
    width: 100%;
    margin-top: 60px;
    overflow: clip;
}

.day_board {
    position: relative;
    width: 1440px;
    zoom: calc(100cqw / 1440px);
}

.day-suda .day_board { height: 370px; }
.day-izawa .day_board { height: 301px; }
.day-minamiKei .day_board { height: 275px; }
.day-kawabuchi .day_board { height: 296px; }
.day-kobayashi .day_board { height: 318px; }
.day-minami .day_board { height: 276px; }
.day-onishi .day_board { height: 276px; }

.day_figure {
    position: absolute;
    left: 170px;
    width: 1100px;
    height: 176px;
    max-width: none;
    object-fit: none;
    object-position: left top;
    pointer-events: none;
}

.day-suda .day_figure { top: 95px; }
.day-minamiKei .day_figure,
.day-minami .day_figure,
.day-onishi .day_figure { top: 49px; }
.day-kawabuchi .day_figure,
.day-kobayashi .day_figure { top: 70px; }

.day-izawa .day_figure-up {
    top: 52px;
    left: 188px;
    width: 651px;
    height: 88px;
}

.day-izawa .day_figure-axis {
    top: 122px;
    left: 170px;
    width: 1100px;
    height: 36px;
}

.day-izawa .day_figure-down {
    top: 140px;
    left: 256px;
    width: 997px;
    height: 89px;
}

.day_item {
    position: absolute;
    left: var(--x);
    top: var(--y);
    display: flex;
    flex-direction: column;
    width: var(--w, max-content);
}

.day_item-above { padding-bottom: 6px; }
.day_item-below { padding-top: 6px; }

.day_time,
.day_task {
    margin: 0;
}

.day_time {
    font-family: var(--font-en);
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.4;
}

.day_task {
    font-weight: 700;
    font-size: 1.3rem;
    line-height: 1.6;
}

.day_list {
    display: none;
}

.mates {
    padding: 40px 0 160px;
    background: #fff;
}

.mates_inner {
    width: min(1440px, 100%);
    margin: 0 auto;
    padding: 0 clamp(20px, 8.33vw, 120px);
}

.mates_title {
    margin: 0 0 40px;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
    color: #111;
}

.mates_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.mates_card {
    position: relative;
    display: block;
    overflow: hidden;
    color: #fff;
}

.mates_card-suda { --person: #c64f61; }
.mates_card-minamiKei { --person: #3b68a8; }
.mates_card-izawa { --person: #7353a3; }
.mates_card-kawabuchi { --person: #6f7e32; }
.mates_card-kobayashi { --person: #347a65; }
.mates_card-minami { --person: #b9652b; }
.mates_card-onishi { --person: #ac963e; }

.mates_photo {
    display: block;
    aspect-ratio: 1;
}

.mates_photo img {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
}

.mates_shade {
    position: absolute;
    inset: 0;
    background: var(--person);
    opacity: 0;
    transition: opacity 280ms var(--ease-out);
}

.mates_hover {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 24px;
    opacity: 0;
    transition: opacity 280ms var(--ease-out);
}

.mates_quote {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    min-height: 0;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.4;
}

.mates_body {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 10px;
    min-height: 77px;
}

.mates_name {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
}

.mates_nameText br {
    display: none;
}

.mates_arrow {
    display: none;
}

.mates_meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.mates_year,
.mates_role {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.3;
}

.mates_card:hover .mates_hover,
.mates_card:focus-visible .mates_hover {
    opacity: 1;
}

.mates_card:hover .mates_shade,
.mates_card:focus-visible .mates_shade {
    opacity: 0.8;
}

/* ------------------------------
Header: switch to the menu before the nav collides with the buttons
------------------------------ */

@media screen and (max-width: 1099px) {
    .header {
        padding: 0 20px;
        border-radius: 36px;
        background: #fff;
    }

    .header_main {
        flex: 1;
        padding: 0;
        border-radius: 0;
        background: transparent;
    }

    .header_divider,
    .menuList,
    .header_actions {
        display: none;
    }

    .header_label {
        display: block;
    }

    .hamburger {
        display: block;
        flex: 0 0 auto;
    }

    .since_steps,
    .since-kawabuchi .since_steps,
    .since-kobayashi .since_steps {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
        padding: 0 10px;
    }

    .since_step {
        flex: none;
        width: 100%;
        gap: 12px;
    }

    .since_arrow {
        display: none;
    }

    .day_panel {
        padding-bottom: 48px;
    }

    .day_scale {
        display: none;
    }

    .day_list {
        display: flex;
        flex-direction: column;
        margin: 24px 26px 0;
        padding: 0;
        list-style: none;
    }

    .day_row {
        display: grid;
        grid-template-columns: 28px 1fr;
        grid-template-rows: 28px auto;
        column-gap: 14px;
    }

    .day_row::before {
        content: "";
        grid-row: 1;
        grid-column: 1;
        width: 28px;
        height: 28px;
        background: url("/recruit/new-graduates/img/people/icon_clock.svg") center / 28px 28px no-repeat;
    }

    .day_row::after {
        content: "";
        grid-row: 2;
        grid-column: 1;
        justify-self: center;
        width: 1px;
        min-height: 36px;
        background: #fff;
    }

    .day_row:last-child::after {
        display: none;
    }

    .day_list .day_time {
        grid-row: 1;
        grid-column: 2;
        align-self: center;
        font-size: 1.3rem;
    }

    .day_list .day_task {
        grid-row: 2;
        grid-column: 2;
        padding-top: 4px;
        font-weight: 500;
        font-size: 1.3rem;
        line-height: 1.5;
    }

    .execMessage_photo,
    .execMessage_photo-yoshioka,
    .execMessage_photo-umetsu,
    .execMessage_photo-taketomi {
        box-shadow: none;
    }

    .servicesIntro_inner {
        align-items: center;
        min-height: 0;
    }

    .servicesIntro_visual,
    .servicesIntro_copy {
        align-self: center;
    }

    .interviewMessage {
        justify-content: center;
        padding-top: 0;
    }

    .interviewCard_body {
        padding: 24px 12px 16px;
    }

    .interviewCard_quote {
        gap: 10px;
        font-size: min(2.8rem, calc((1.75 * (min(1200px, 100vw) - 80px) / 3 - 168px) / 16));
    }

    .interviewCard_profile {
        width: 100%;
        gap: 6px;
    }

    .interviewCard_name {
        max-width: 100%;
        font-size: 1.8rem;
    }

    .interviewCard_meta {
        max-width: 100%;
        font-size: 1.1rem;
        line-height: 1.4;
    }

    .credo_heading {
        padding-inline: clamp(40px, calc((100% - 640px) / 2), 120px);
    }

    .credo_title,
    .credo_mark {
        white-space: nowrap;
    }

    .work_cardWord {
        display: inline-block;
        white-space: nowrap;
    }

    .qualityDetail {
        grid-template-columns: minmax(0, 1fr) clamp(120px, 14vw, 180px) minmax(0, 1fr);
        column-gap: 32px;
    }

    .qualityDetail_spacer,
    .qualityDetail_figure {
        width: clamp(120px, 14vw, 180px);
    }

    .qualityDetail_figure {
        height: auto;
        aspect-ratio: 312 / 800;
    }

    .mates {
        padding: 0 20px 60px;
    }

    .mates_inner {
        width: 100%;
        padding: 0;
    }

    .mates_title {
        margin-bottom: 28px;
        font-size: 2rem;
        line-height: 1.4;
    }

    .mates_list {
        grid-template-columns: 1fr 1fr;
        gap: 24px 12px;
    }

    .mates_card {
        display: flex;
        flex-direction: column;
        gap: 12px;
        overflow: visible;
        color: #111;
    }

    .mates_photo {
        box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--person, #111) 80%, transparent);
    }

    .mates_shade,
    .mates_quote {
        display: none;
    }

    .mates_hover {
        position: static;
        display: block;
        padding: 0;
        opacity: 1;
    }

    .mates_body {
        gap: 4px;
        min-height: 0;
    }

    .mates_meta {
        gap: 4px;
    }

    .mates_name {
        display: flex;
        align-items: flex-start;
        gap: 4px;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.6;
    }

    .mates_nameText {
        flex: 1 1 auto;
        min-width: 0;
    }

    .mates_nameText br {
        display: inline;
    }

    .mates_arrow {
        display: block;
        flex: 0 0 16px;
        width: 16px;
        font-size: 1.6rem;
        line-height: 1.3;
        text-align: center;
    }

    .mates_year,
    .mates_role {
        font-size: 1.2rem;
        font-weight: 700;
        line-height: 1.6;
    }

    .mates_card:active .mates_photo img {
        opacity: 0.8;
    }

    .pageLinks_cards {
        flex-direction: column;
        align-items: stretch;
        width: auto;
        margin-inline: 0;
        padding-right: 16px;
        padding-left: 16px;
    }

    .pageLink {
        flex: none;
        width: 100%;
        max-width: none;
        height: auto;
        min-height: 603px;
    }
}

/* 1130px前後は写真が画面に対して小さく、下に余白が空く */
@media screen and (max-width: 1199px) {
    .hero_stage {
        --hero-photo-width: min(1130px, calc((100vw - 16px) * 1130 / 1280));
        display: flex;
        flex-direction: column;
        align-items: center;
        height: auto;
        min-height: 0;
        padding: 100px 0 48px;
    }

    .hero_grid,
    .heroPhoto {
        top: auto;
        left: auto;
        flex: 0 0 auto;
        transform: none;
    }

    .hero_grid {
        position: relative;
        width: min(1280px, calc(100vw - 16px));
    }

    .heroPhoto {
        position: absolute;
        top: 100px;
        left: 50%;
        width: var(--hero-photo-width);
        transform: translateX(-50%);
    }

    .hero_heading {
        position: relative;
        bottom: auto;
        left: auto;
        width: min(1080px, calc(100% - 48px));
        margin-top: 24px;
        padding: 0;
        transform: none;
    }

    .hero_row {
        font-size: clamp(4.4rem, 6.2vw, 8rem);
    }
}

@media screen and (max-width: 1200px) {
    .pageLink_button {
        width: min(320px, calc(100% - 32px));
        padding-inline: 20px;
    }
}

@media screen and (max-width: 1099px) {
    .growth_learnList {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
    }

    .growth_learn {
        flex: none;
        width: 100%;
        max-width: none;
        min-height: 0;
        gap: 24px;
        padding: 24px 20px;
    }

    .growth_learnHead {
        gap: 16px;
        width: 100%;
        padding: 0;
    }

    .growth_learnTitle {
        font-size: 2.4rem;
        line-height: 1.4;
    }

    .growth_learnCatch {
        font-size: 1.8rem;
        font-weight: 700;
        line-height: 1.6;
    }

    .growth_br {
        display: inline;
    }

    .growth_learnText {
        min-height: 0;
        padding: 0;
        font-size: 1.6rem;
    }
}

@media screen and (min-width: 900px) and (max-width: 1399px) {
    .growth_envFigure {
        height: auto;
        aspect-ratio: 1000 / 720;
        object-fit: contain;
    }
}

@media screen and (max-width: 1099px) {
    .growth_env {
        padding-left: 40px;
        padding-right: 24px;
    }
}

@media screen and (min-width: 900px) and (max-width: 1099px) {
    .growth_env {
        padding-right: 16px;
        gap: 16px;
    }

    .growth_envTitle {
        white-space: nowrap;
    }

    .growth_envBody {
        flex: 0 0 auto;
        width: min-content;
        min-width: 33rem;
        max-width: calc(100% - 176px);
    }

    .growth_envFigure {
        flex: 1 1 0;
        width: auto;
        min-width: 160px;
        max-width: 419px;
    }
}

@media screen and (max-width: 899px) {
    .growth_env {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
        padding: 40px 24px 40px 40px;
    }

    .growth_envBody,
    .growth_envFigure {
        width: 100%;
        max-width: none;
        flex-basis: auto;
        height: auto;
    }

    .growth_envFigure {
        object-fit: contain;
    }
}

/* ------------------------------
SP
------------------------------ */

@media screen and (max-width: 767px) {
    .header {
        top: 12px;
        width: calc(100% - 32px);
        height: 50px;
    }

    .header_main {
        gap: 12px;
    }

    .header_label {
        display: block;
        font-size: 1.2rem;
        line-height: 1.6;
    }

    .header_logo {
        width: 143px;
    }

    .hamburger {
        display: block;
    }

    .menuSp_bar {
        width: calc(100% - 32px);
        height: 50px;
        margin-top: 12px;
    }

    .menuSp_brand {
        gap: 12px;
    }

    .menuSp_logo {
        width: 143px;
    }

    .menuSp_label {
        font-size: 1.2rem;
        line-height: 1.6;
    }

    .hero_stage {
        --hero-photo-width: 100%;
        --hero-top: 82px;
        --hero-fit: min(100vw, calc(max(0px, 100svh - 282px) * 390 / 520));
        display: block;
        height: 100svh;
        min-height: 100svh;
        padding: 0;
    }

    .hero_grid,
    .heroPhoto {
        position: absolute;
        top: var(--hero-top);
        bottom: auto;
        left: 50%;
        flex: none;
        width: var(--hero-fit);
        transform: translateX(-50%);
    }

    .hero_grid {
        height: auto;
        aspect-ratio: 390 / 520;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(4, 1fr);
    }

    .hero_gridCell {
        min-width: 0;
        min-height: 0;
    }

    .hero_gridCell:nth-child(n + 13) {
        display: none;
    }

    .hero_gridCell img {
        width: 100%;
        height: 100%;
        min-width: 0;
        min-height: 0;
    }

    .heroPhoto {
        top: calc(var(--hero-top) + var(--hero-fit) * 30 / 390);
        aspect-ratio: 390 / 460;
    }

    .heroPhoto_slot-01 { z-index: 11; top: 55.87%; left: 64.1%; width: 35.9%; height: 22.61%; }
    .heroPhoto_slot-02 { z-index: 1; top: 2.61%; left: 0; width: 29.74%; height: 33.26%; }
    .heroPhoto_slot-03 { z-index: 3; top: 78.48%; left: 67.18%; width: 26.67%; height: 18.7%; }
    .heroPhoto_slot-04 { z-index: 2; top: 66.96%; left: 0; width: 33.33%; height: 27.83%; }
    .heroPhoto_slot-05 { display: none; }
    .heroPhoto_slot-06 { z-index: 4; top: 0; left: 29.74%; width: 34.36%; height: 24.78%; }
    .heroPhoto_slot-07 { z-index: 5; top: 4.35%; left: 64.1%; width: 35.9%; height: 21.96%; }
    .heroPhoto_slot-08 { z-index: 6; top: 26.3%; left: 64.1%; width: 32.82%; height: 29.57%; }
    .heroPhoto_slot-09 { z-index: 10; top: 66.09%; left: 33.33%; width: 33.85%; height: 15.65%; }
    .heroPhoto_slot-10 { z-index: 9; top: 81.74%; left: 29.74%; width: 37.44%; height: 18.26%; }
    .heroPhoto_slot-11 { z-index: 7; top: 35.87%; left: 3.08%; width: 30.26%; height: 32.61%; }
    .heroPhoto_slot-12 { z-index: 8; top: 24.78%; left: 24.62%; width: 39.49%; height: 43.7%; }

    .hero_heading {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        margin-top: 0;
        padding: 0 12px 34px;
        transform: none;
    }

    .hero_brand {
        align-items: center;
        height: 30px;
    }

    .hero_en {
        font-size: 3.6rem;
        line-height: 1;
    }

    .hero_no {
        font-size: 3rem;
        font-weight: 700;
        line-height: 1;
        transform: none;
    }

    .hero_row {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        margin-top: 6px;
        font-size: 5.4rem;
        line-height: 1;
        white-space: nowrap;
    }

    .hero_segment > span:first-child {
        letter-spacing: 0.0231em;
    }

    .hero_year {
        margin-left: -5px;
        gap: 3.75px;
    }

    .hero_number {
        font-size: 7rem;
        line-height: 1;
    }

    .hero_segment-you {
        gap: 5px;
    }

    .hero_highlight {
        padding: 0 2px;
        font-size: 1em;
        line-height: 1;
    }

    .section_inner,
    .entry_inner,
    .footer_inner,
    .subHero_inner {
        width: calc(100% - 32px);
    }

    .message {
        padding: 80px 20px;
    }

    .message_inner,
    .about_heading,
    .about_numbersTitle,
    .numberList,
    .qualities_heading,
    .qualityList,
    .pageLinks_heading,
    .pageLinks_cards,
    .footer_main {
        width: auto;
        margin-inline: 0;
    }

    .message_inner {
        gap: 48px;
    }

    .message_label {
        align-items: center;
        margin-left: 0;
        padding-left: 0;
        text-align: center;
    }

    .message .enLabel {
        font-size: 1.8rem;
        letter-spacing: 0.0556em;
        line-height: 1.3;
    }

    .message_labelJa {
        font-size: 2.4rem;
        letter-spacing: 0;
        line-height: 1.4;
    }

    .message_heading {
        align-items: center;
        gap: 12px;
        text-align: center;
    }

    .message_catch,
    .message_catchNext {
        font-size: 2.6rem;
        line-height: 1.3;
    }

    .message_catch {
        padding: 4px;
        letter-spacing: 0.0385em;
    }

    .message_catchNext {
        letter-spacing: 0;
    }

    .message_signature {
        align-items: center;
        text-align: center;
    }

    .message_content {
        display: flex;
        flex-direction: column;
        gap: 40px;
        padding: 0;
    }

    .message_copy {
        gap: 32px;
        max-width: none;
    }

    .message_signature p {
        font-size: 2.8rem;
    }

    .message_body {
        gap: 20px;
        font-size: 1.5rem;
    }

    .message_visual {
        position: relative;
        top: auto;
        align-self: center;
        width: min(100%, calc(430px * 787 / 1200));
        height: auto;
        max-height: none;
        margin-inline: auto;
        aspect-ratio: 787 / 1200;
    }

    .message_visual img {
        object-position: center;
    }

    .section {
        padding: 72px 0;
    }

    .execMessages {
        padding: 72px 0 0;
    }

    .execMessages_inner {
        width: calc(100% - 32px);
    }

    .execMessages_title {
        align-items: center;
        gap: 6px;
        font-size: 3rem;
        line-height: 1.4;
        text-align: center;
    }

    .execMessages_line {
        justify-content: center;
        gap: 4px;
    }

    .execMessages_line:first-child {
        flex-direction: column;
        gap: 6px;
    }

    .execMessages_piece {
        gap: 4px;
    }

    .execMessage,
    .execMessage-reverse,
    .execMessage:first-child {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
        padding-top: 48px;
    }

    .execMessage:last-child {
        padding-bottom: 72px;
    }

    .execMessage_photo,
    .execMessage_photo-yoshioka,
    .execMessage_photo-umetsu,
    .execMessage_photo-taketomi {
        flex-basis: auto;
        width: 100%;
        max-width: none;
        box-shadow: none;
    }

    .execMessage_content {
        max-width: none;
    }

    .execMessage_body {
        gap: 14px;
        font-size: 1.8rem;
        line-height: 1.8;
    }

    .execMessage:first-child .execMessage_body {
        line-height: 1.6;
    }

    .execMessage_body p {
        display: block;
    }

    .execMessage_name {
        margin-top: 28px;
        font-size: 2rem;
    }

    .growth_inner {
        padding: 72px 0;
    }

    .growth_deco {
        width: 145px;
        height: 127.53px;
    }

    .growth_intro {
        gap: 24px;
    }

    .growth_heading {
        gap: 16px;
        padding: 0 16px;
    }

    .growth_en {
        font-size: 3.2rem;
    }

    .growth_title {
        gap: 4px;
        font-size: 2.8rem;
    }

    .growth_overview {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
        width: calc(100% - 32px);
        min-height: 0;
    }

    .growth_figure {
        flex-basis: auto;
        width: 100%;
        height: auto;
        aspect-ratio: 1;
    }

    .growth_lead {
        width: auto;
        max-width: none;
        font-size: 1.6rem;
    }

    .growth_panelWrap {
        margin-top: 40px;
        padding: 0 16px;
    }

    .growth_panel {
        padding: 0 16px 48px;
    }

    .growth_systemLabel {
        padding: 20px 0 32px;
        font-size: 1.4rem;
    }

    .growth_steps {
        gap: 28px;
    }

    .growth_blockTitle {
        font-size: 2.4rem;
    }

    .growth_map {
        overflow: visible;
    }

    .growth_mapInner {
        display: flex;
        flex-direction: column;
        gap: 28px;
        width: auto;
        height: auto;
        zoom: 1;
    }

    .growth_mapPath {
        position: static;
        order: 3;
        width: 100%;
        height: auto;
    }

    .growth_step,
    .growth_step-1,
    .growth_step-2,
    .growth_step-3,
    .growth_step-4 {
        position: static;
        width: auto;
    }

    .growth_step-1 { order: 1; }
    .growth_step-2 { order: 2; }
    .growth_step-3 { order: 4; }
    .growth_step-4 { order: 5; }

    .growth_stepHead {
        flex-direction: row;
        align-items: center;
        gap: 6px;
    }

    .growth_envs,
    .growth_learns {
        gap: 24px;
        padding-top: 48px;
    }

    .growth_envList {
        gap: 16px;
    }

    .growth_env {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
        padding: 24px 16px;
    }

    .growth_envBody,
    .growth_envFigure {
        width: 100%;
        max-width: none;
        flex-basis: auto;
        height: auto;
    }

    .growth_envTitle {
        font-size: 2.2rem;
    }

    .growth_envCatch {
        margin-top: 8px;
        margin-bottom: 16px;
        font-size: 1.5rem;
    }

    .growth_envText {
        font-size: 1.4rem;
    }

    .growth_learns {
        gap: 20px;
    }

    .growth_envs .growth_blockTitle,
    .growth_learns .growth_blockTitle {
        font-size: 3rem;
        font-weight: 700;
        line-height: 1.4;
        letter-spacing: 0;
    }

    .about_deco {
        width: 160px;
    }

    .about_content {
        align-items: stretch;
        gap: 32px;
        padding-top: 72px;
    }

    .about_heading {
        align-items: flex-start;
        gap: 24px;
        width: 100%;
        padding: 0 20px;
    }

    .about_headline {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 0;
        font-size: 3.2rem;
        letter-spacing: 0.02em;
        line-height: 1.4;
        text-align: left;
    }

    .about_headlineLead {
        padding: 0;
    }

    .about_headlineRest {
        white-space: normal;
    }

    .about_headlineBr {
        display: block;
    }

    .about_headline .about_mark {
        padding: 0 4px;
        letter-spacing: 0.0313em;
        line-height: 1.3;
    }

    .about_media {
        display: grid;
        grid-template-columns: 236fr 154fr;
        row-gap: 32px;
        width: 100%;
        aspect-ratio: auto;
    }

    .about_photo,
    .about_body {
        position: static;
        width: auto;
        height: auto;
    }

    .about_photo-01,
    .about_photo-02 {
        top: auto;
        left: auto;
        grid-row: 1;
        width: 100%;
        height: 180px;
        margin: 0;
        aspect-ratio: auto;
    }

    .about_photo-01 {
        grid-column: 1;
    }

    .about_photo-02 {
        grid-column: 2;
    }

    .about_body {
        grid-column: 1 / -1;
        padding: 0 20px;
    }

    .about_body {
        gap: 16px;
        font-size: 1.5rem;
    }

    .about_paragraph-space {
        margin-top: 8px;
    }

    .about_numbers {
        padding: 64px 0 80px;
    }

    .about_numbersTitle {
        padding: 0 16px 24px;
        font-size: 3.2rem;
    }

    .numberList {
        gap: 16px;
        padding: 0 20px 8px;
        scroll-padding-inline: 20px;
    }

    .numberList_item {
        flex: 0 0 min(310px, 100%);
        flex-direction: row;
        align-items: stretch;
        justify-content: center;
        gap: 10px;
        height: 190px;
    }

    .numberList_illust {
        flex: 0 0 130px;
        max-width: 130px;
        height: 100%;
        padding: 0;
    }

    .numberList_illust img {
        width: 130px;
        height: 110px;
    }

    .numberList_body {
        gap: 8px;
        justify-content: center;
        padding: 0 8px;
    }

    .numberList_body:has(.numberList_metric) {
        justify-content: flex-start;
        padding-top: 20px;
    }

    .numberList_label {
        font-size: 1.4rem;
        line-height: 1.6;
    }

    .numberList_value {
        gap: 3px;
    }

    .numberList_figure,
    .numberList_value-purple .numberList_figure {
        font-size: 5rem;
        line-height: 1.3;
    }

    .numberList_unit,
    .numberList_value-purple .numberList_prefix {
        font-size: 1.6rem;
        line-height: 1.3;
    }

    .numberList_unit-small,
    .numberList_prefix-orange,
    .numberList_value-purple .numberList_prefix {
        font-size: 1.4rem;
    }

    .numberList_value-purple .numberList_unit {
        font-size: 1.4rem;
    }

    .numberList_unit-small {
        white-space: normal;
        line-height: 1.3;
        text-align: left;
    }

    .numberList_br {
        display: block;
    }

    .numberList_note {
        right: 10px;
        bottom: 8px;
        font-size: 1.2rem;
        line-height: 1.6;
    }

    .numberList_item:has(.numberList_note br) .numberList_copy {
        transform: translateY(-16px);
    }

    .numberList_item:has(.numberList_note br) .numberList_note {
        line-height: 1.45;
        white-space: nowrap;
    }

    .titleL {
        font-size: 3.2rem;
    }

    .servicesIntro {
        padding: 60px 0 100px;
    }

    .servicesIntro_inner {
        flex-direction: column;
        align-items: stretch;
        gap: 40px;
        width: calc(100% - 32px);
        min-height: 0;
    }

    .servicesIntro_visual {
        flex: none;
        width: 100%;
        height: 290px;
    }

    .servicesIntro_copy {
        flex: none;
        gap: 28px;
        width: auto;
        max-width: none;
    }

    .servicesIntro_title {
        font-size: 3.2rem;
        line-height: 1.4;
    }

    .servicesIntro_lead {
        font-size: 1.6rem;
        font-weight: 400;
        line-height: 1.8;
    }

    .qualities_deco {
        width: 160px;
    }

    .qualities_heading {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        padding: 72px 16px 0;
    }

    .qualities_headingMain {
        gap: 20px;
    }

    .qualities_title {
        flex-wrap: wrap;
        gap: 8px;
    }

    .qualities_titleRest {
        padding: 0;
    }

    .qualities_lead {
        width: 100%;
        font-size: 1.5rem;
    }

    .qualityList {
        gap: 16px;
        padding: 40px 16px 32px;
    }

    .qualityList_name {
        min-height: 0;
        font-size: 2.8rem;
    }

    .qualityDetail {
        grid-template-columns: 1fr;
        gap: 32px;
        min-height: 0;
        padding: 40px 20px 0;
    }

    .qualityDetail_col,
    .qualityDetail_col-right {
        display: contents;
    }

    .qualityDetail_spacer {
        display: none;
    }

    .qualityDetail_figure {
        position: static;
        order: 5;
        justify-self: center;
        width: 170px;
        height: 320px;
        margin: 0;
        object-fit: cover;
        object-position: top center;
        transform: none;
    }

    .qualityDetail_col:not(.qualityDetail_col-right) .qualityDetail_item:first-child {
        order: 2;
    }

    .qualityDetail_col-right .qualityDetail_item {
        order: 3;
    }

    .qualityDetail_col:not(.qualityDetail_col-right) .qualityDetail_item:last-child {
        order: 4;
    }

    .qualityDetail_title {
        align-self: stretch;
        padding: 6px 0;
        font-size: 1.8rem;
        text-align: center;
    }

    .qualityDetail_lead {
        font-size: 1.6rem;
    }

    .pageLinks {
        padding: 72px 0 80px;
    }

    .pageLinks_stage,
    .pageLinks_set {
        height: 280px;
    }

    .pageLinks_set {
        flex-basis: 756px;
        width: 756px;
    }

    .pageLinks_brand {
        top: 50%;
        font-size: 4.8rem;
        transform: translateY(-50%);
    }

    .pageLinks_heading {
        padding: 16px 16px 0;
    }

    .pageLinks_title {
        flex-wrap: wrap;
        padding: 12px 0;
    }

    .pageLinks_cards {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 32px 16px 0;
    }

    .pageLink {
        flex: none;
        width: 100%;
        max-width: none;
        height: auto;
        min-height: 0;
        padding: 32px 16px;
    }

    .pageLink_content {
        gap: 24px;
    }

    .pageLink_photo,
    .pageLink_button {
        width: min(300px, 100%);
    }

    .pageLink_button {
        padding-inline: 36px;
    }

    .qualityList,
    .service,
    .journey,
    .footer_columns,
    .timeline_item {
        grid-template-columns: 1fr;
    }

    .service {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 0 20px 100px;
    }

    .service:last-child {
        padding-bottom: 100px;
    }

    .service_deco {
        top: -48px;
        left: -17px;
        width: 136px;
        height: 123px;
    }

    .service:nth-child(even) .service_deco {
        left: auto;
        right: -16px;
    }

    .service_media,
    .service:nth-child(odd) .service_media,
    .service:nth-child(even) .service_media {
        order: 2;
        justify-self: stretch;
        max-width: none;
    }

    .service_media-split {
        aspect-ratio: 1;
    }

    .service_media-salad {
        height: auto;
        aspect-ratio: auto;
        gap: 24px;
    }

    .service_saladTop {
        align-items: center;
        height: auto;
        gap: 10px;
    }

    .service_saladTop img {
        flex: none;
        width: calc((100% - 10px) / 2);
        height: auto;
        aspect-ratio: 1;
    }

    .service_saladMachine {
        width: 100%;
        flex: none;
        height: 259px;
    }

    .service_media-portrait {
        aspect-ratio: 350 / 320;
    }

    .service_title {
        display: flex;
        justify-content: center;
    }

    .service_logo {
        width: 303px;
    }

    .service_logo-salad {
        width: 254px;
    }

    .service_logo-supporters {
        width: 298px;
    }

    .service_kicker {
        margin-top: 28px;
        font-size: 2.4rem;
        line-height: 1.4;
        text-align: center;
    }

    .service:nth-child(n + 2) .service_kicker {
        margin-top: 22px;
    }

    .service_kickerBrSp {
        display: inline;
    }

    .service_text {
        margin-top: 20px;
    }

    .service_text + .service_text {
        margin-top: 12px;
    }

    .textLink {
        font-size: 1.6rem;
        line-height: 1.3;
    }

    .group {
        padding: 40px 0 60px;
    }

    .group_inner {
        width: calc(100% - 40px);
    }

    .group_title {
        font-size: 2rem;
        line-height: 1.4;
    }

    .groupList {
        gap: 24px;
        margin-top: 24px;
        background: transparent;
    }

    .groupCard {
        padding: 10px 0 24px;
        background: #fff;
    }

    .groupCard-delivery {
        padding: 32px 0 24px;
    }

    .groupCard_head {
        padding: 0 16px 24px;
    }

    .groupCard_logo-lumeal {
        width: 237px;
    }

    .groupCard_logo-yushoku {
        width: 165px;
    }

    .groupCard_logo-delivery {
        width: min(280px, 100%);
    }

    .groupCard_note {
        font-size: 1.4rem;
        line-height: 1.6;
    }

    .groupCard_body,
    .groupCard-delivery .groupCard_body {
        padding: 0 16px;
    }

    .groupCard_panel {
        align-items: stretch;
        padding: 0;
        background: transparent;
    }

    .groupCard_kicker {
        font-size: 2.2rem;
        line-height: 1.4;
    }

    .groupCard_media,
    .groupCard_media-wide {
        width: 100%;
        margin-top: 24px;
    }

    .groupCard_photo {
        height: 210px;
    }

    .groupCard_media-wide .groupCard_photo {
        height: 114px;
        aspect-ratio: auto;
        object-fit: cover;
    }

    .groupCard_info {
        width: 100%;
        margin-top: 24px;
    }

    .groupCard_info .service_link {
        margin-top: 24px;
    }

    .ownership_heading {
        padding: 80px 20px;
    }

    .ownership_title {
        gap: 12px;
        font-size: 3rem;
        line-height: 1.4;
    }

    .ownership_line {
        gap: 8px 4px;
    }

    .ownership_title .ownership_mark {
        padding: 0 4px;
    }

    .ownership_lead {
        gap: 24px;
        margin-top: 40px;
        font-size: 1.8rem;
        line-height: 1.8;
    }

    .ownership_brSp {
        display: inline;
    }

    .ownership_break {
        display: block;
        flex-basis: 100%;
        width: 100%;
        height: 0;
    }

    .ownership_items {
        gap: 0;
        width: 100%;
        padding-bottom: 0;
    }

    .ownership_item {
        align-items: stretch;
        gap: 24px;
        padding: 36px 30px;
        border-top: 1px solid #8e8e8e;
    }

    .ownership_itemTitle,
    .ownership_itemTitle-wide {
        gap: 8px 4px;
        font-size: 3rem;
        line-height: 1.4;
        letter-spacing: 0;
    }

    .ownership_item .ownership_mark {
        padding: 10px 2px;
        line-height: 1.3;
    }

    .ownership_item p {
        text-align: left;
    }

    .ownership_statement {
        padding: 36px 20px 64px;
        font-size: 1.8rem;
        line-height: 1.6;
        letter-spacing: 0;
    }

    .interview {
        padding: 60px 0 0;
    }

    .interview_inner {
        width: calc(100% - 32px);
    }

    .interview_title {
        font-size: 3.2rem;
        line-height: 1.4;
    }

    .interview_lead {
        margin-top: 20px;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.8;
    }

    .interview_br {
        display: block;
    }

    .interviewGuide {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100vw;
        margin: 24px 0 0 calc(50% - 50vw);
        padding: 6px 10px;
        color: #8e8e8e;
        font-family: var(--font-en);
        font-size: 1.3rem;
        font-weight: 700;
        line-height: 1.3;
        letter-spacing: 0;
    }

    .interviewGuide_counter,
    .interviewGuide_swipe {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .interviewGuide_slash {
        font-size: 1rem;
    }

    .interviewGuide_arrow {
        display: block;
        width: 30px;
        height: 6px;
        overflow: hidden;
    }

    .interviewGuide_arrow img {
        display: block;
        width: 30px;
        height: 6px;
        max-width: none;
        animation: swipeArrow 1.5s linear infinite;
    }

    .interviewSlider {
        display: flex;
        width: 100vw;
        margin: 0 0 0 calc(50% - 50vw);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 0;
        cursor: grab;
    }

    .interviewSlider.is-dragging {
        cursor: grabbing;
        scroll-snap-type: none;
        user-select: none;
    }

    .interviewCard {
        flex: 0 0 100%;
        aspect-ratio: 390 / 612.5;
        scroll-snap-align: center;
    }

    .interviewCard_shade {
        display: none;
    }

    .interviewCard_body {
        align-items: stretch;
        padding: 70px 0 0;
        opacity: 1;
        color: var(--color-ink);
    }

    .interviewCard_quote {
        justify-content: flex-start;
        gap: 10px;
        padding-right: 20px;
        font-size: 2.8rem;
    }

    .interviewCard_line {
        background: var(--color-white);
    }

    .interviewCard_profile {
        gap: 9px;
        padding: 10px 16px;
        background: color-mix(in srgb, var(--person) 80%, transparent);
        color: var(--color-white);
    }

    .interviewCard_name {
        font-size: 2.2rem;
        line-height: 1.4;
    }

    .interviewCard_meta {
        gap: 2px;
        font-size: 1.2rem;
        line-height: 1.6;
    }

    .interviewMessage {
        display: none;
    }

    .credo_inner {
        padding: 60px 0;
    }

    .credo_heading {
        gap: 12px;
        width: min(350px, calc(100% - 40px));
        margin: 0 auto;
        padding: 0 0 24px;
    }

    .credo_en {
        font-size: 1.8rem;
        letter-spacing: 0.0556em;
    }

    .credo_headingBody {
        gap: 20px;
        width: 100%;
    }

    .credo_title {
        gap: 4px;
        font-size: 3.2rem;
        line-height: 1.4;
    }

    .credo_mark {
        padding: 0 2px;
        letter-spacing: 0.0125em;
        line-height: 1.3;
    }

    .credo_lead {
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.8;
        text-align: left;
    }

    .credo_list {
        flex-direction: column;
        gap: 24px;
        width: min(350px, calc(100% - 40px));
        padding-bottom: 24px;
    }

    .credo_item,
    .credo_illust {
        width: 100%;
        min-height: 0;
    }

    .credo_item {
        gap: 12px;
        padding: 26px;
    }

    .credo_name {
        font-size: 2.6rem;
    }

    .credo_statement {
        font-size: 1.8rem;
        letter-spacing: 0;
    }

    .credo_text {
        font-size: 1.6rem;
    }

    .credo_illust img {
        width: 275px;
        height: 150px;
    }

    .work {
        gap: 40px;
    }

    .work_heading {
        gap: 12px;
        width: min(350px, calc(100% - 40px));
        padding: 60px 0 0;
    }

    .work_en {
        font-size: 1.8rem;
        letter-spacing: 0.0556em;
    }

    .work_title {
        gap: 6px;
        width: 100%;
        font-size: 3.2rem;
        letter-spacing: 0.0125em;
    }

    .work_mark,
    .work_outline {
        padding: 0 1.6px;
    }

    .work_outline {
        padding: 0 4px;
    }

    .work_dot {
        width: 24px;
        font-size: 2.4rem;
        line-height: 1.4;
        letter-spacing: 0;
        text-align: center;
    }

    .work_br {
        display: inline;
    }

    .work_brPc {
        display: none;
    }

    .work_gallery {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        padding-bottom: 0;
    }

    .work_track,
    .work_set {
        gap: 16px;
    }

    .work_track img {
        width: 301px;
        height: 160px;
    }

    .work_block:first-child .work_deco {
        display: none;
    }

    .work_deco {
        top: -36px;
        left: -27px;
        width: 225px;
        height: 202px;
    }

    .work_block {
        align-items: stretch;
        gap: 32px;
        padding: 60px 20px;
    }

    .work_block:first-child {
        padding-top: 40px;
        padding-bottom: 60px;
    }

    .work_block-stock {
        padding-bottom: 80px;
    }

    .work_block > :not(.work_deco) {
        width: auto;
    }

    .work_blockHead {
        gap: 16px;
    }

    .work_blockTitle {
        font-size: 3.2rem;
        line-height: 1.3;
        letter-spacing: 0.0313em;
    }

    .work_block-stock .work_blockTitle {
        font-size: 2.6rem;
        letter-spacing: 0;
    }

    .work_lead {
        max-width: none;
        font-size: 1.6rem;
    }

    .work_blockBody {
        gap: 32px;
    }

    .work_pickup {
        gap: 28px;
    }

    .work_block:nth-child(n + 2) .work_pickup {
        gap: 32px;
    }

    .work_pickupLabel {
        font-size: 2.4rem;
        line-height: 1.4;
    }

    .work_cards {
        flex-direction: column;
        align-items: stretch;
        gap: 40px;
    }

    .work_card {
        flex: none;
        gap: 16px;
        width: 100%;
        min-height: 0;
        padding: 0 24px 28px;
    }

    .work_cardMedia {
        width: calc(100% + 48px);
        margin: 0 -24px;
    }

    .work_cardHead {
        min-height: 0;
    }

    .work_cardHead h4 {
        font-size: 2rem;
    }

    .work_cardNote {
        font-size: 1.4rem;
    }

    .work_other {
        flex-direction: column;
        gap: 10px;
    }

    .work_otherLabel {
        width: auto;
        font-size: 1.8rem;
        line-height: 1.6;
    }

    .work_otherList {
        align-self: stretch;
        width: 100%;
    }

    .work_otherList li {
        padding: 16px 0;
    }

    .work_stock {
        gap: 16px;
    }

    .work_stockBody {
        padding: 16px 0;
        font-size: 1.6rem;
    }

    .work_stats {
        align-items: stretch;
        gap: 24px;
        padding: 60px 20px;
    }

    .work_stats > * {
        width: 100%;
    }

    .work_statsTitle {
        font-size: 2.4rem;
        line-height: 1.4;
    }

    .work_statsInner {
        gap: 16px;
    }

    .work_statsGrid {
        flex-direction: column;
        gap: 16px;
    }

    .work_stat {
        gap: 12px;
        width: 100%;
        height: auto;
        padding: 24px 16px;
    }

    .work_statLabel {
        font-size: 1.6rem;
    }

    .work_statValue {
        gap: 6px;
        margin-top: 0;
        margin-bottom: 0;
    }

    .work_statValue-ratio {
        gap: 0;
    }

    .work_statNum {
        font-size: 7rem;
        line-height: 1;
    }

    .work_statValue-ratio .work_statMark {
        top: 6px;
        margin-left: 1px;
    }

    .work_statUnit {
        font-size: 1.8rem;
        line-height: 1;
    }

    .work_stat:nth-child(3) .work_statUnit {
        font-size: 2rem;
    }

    .work_statSep {
        top: -0.25em;
        font-size: 4rem;
    }

    .interviewCard:active {
        opacity: 0.8;
    }

    .subHero {
        height: 332px;
        min-height: 332px;
        align-items: flex-end;
    }

    .subHero_inner {
        width: calc(100% - 40px);
        padding: 0 0 80px;
    }

    .subHero .enLabel {
        margin-bottom: 12px;
        font-size: 1.6rem;
        letter-spacing: 0.0625em;
        line-height: 1.3;
    }

    .subHero-people .enLabel {
        margin-bottom: 16px;
    }

    .subHero_title {
        display: flex;
        align-items: center;
        gap: 4px;
        margin: 0 0 20px;
        font-size: 2.6rem;
        line-height: 1.3;
    }

    .subHero-career .subHero_title {
        gap: 3px;
    }

    .subHero_mark {
        display: inline-flex;
        align-items: center;
        padding: 2px;
        background: var(--color-ink);
        color: var(--color-white);
        line-height: 1.15;
    }

    .subHero_mark-light {
        padding: 1px 4px;
        background: var(--color-white);
        color: var(--color-ink);
        letter-spacing: 0.0385em;
    }

    .subHero_lead {
        max-width: none;
        margin-top: 0;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.8;
    }

    .subHero_leadRest {
        display: none;
    }

    .subHero_leadLine {
        display: block;
    }

    .personHero {
        padding: 160px 20px 60px;
    }

    .personHero_mv {
        width: 100%;
        padding: 0;
    }

    .personHero_deco {
        top: 520px;
        left: auto;
        right: -49px;
        width: 240px;
        height: 216px;
        transform: scaleX(-1);
    }

    .personHero_label {
        padding-top: 0;
        font-size: 1.6rem;
        letter-spacing: 0.0625em;
    }

    .personHero_inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        min-height: 0;
    }

    .personHero_content {
        display: contents;
    }

    .personHero_quote,
    .personHero-suda .personHero_quote {
        order: 1;
        gap: 6px;
        width: 100%;
        padding-top: 0;
        font-size: 2.8rem;
        line-height: 1.3;
        letter-spacing: 0;
    }

    .personHero_line {
        flex-wrap: wrap;
        gap: 6px 3px;
        max-width: 100%;
        white-space: normal;
    }

    .personHero_break {
        display: block;
        flex-basis: 100%;
        height: 0;
    }

    .personHero_photo {
        position: relative;
        order: 2;
        flex: none;
        width: calc(100vw * 255 / 390);
        max-width: 400px;
        height: auto;
        aspect-ratio: 255 / 400;
        overflow: hidden;
    }

    .personHero_photo img {
        position: absolute;
        inset: 0;
    }

    .personHero_mark {
        padding: 0 4px;
    }

    .personHero_meta {
        order: 3;
        gap: 32px;
        width: 100%;
    }

    .personHero_name {
        font-size: 2.4rem;
    }

    .personHero_career li {
        display: grid;
        grid-template-columns: 12px minmax(0, 1fr);
        column-gap: 8px;
        row-gap: 4px;
        align-items: start;
    }

    .personHero_year {
        display: contents;
        width: auto;
        min-height: 0;
    }

    .personHero_year::before {
        grid-column: 1;
        grid-row: 1;
        align-self: center;
    }

    .personHero_event {
        grid-column: 2;
        grid-row: 2;
    }

    .since {
        padding: 48px 20px 0;
    }

    .since_panel {
        padding: 32px 16px;
    }

    .since_title {
        font-size: 2rem;
        line-height: 1.4;
    }

    .since_body {
        gap: 28px;
        margin-top: 28px;
        padding: 0;
    }

    .since_label {
        padding: 6px 8px;
    }

    .qaDetail {
        padding: 64px 20px;
    }

    .qaDetail_inner {
        width: 100%;
        padding: 0;
    }

    .qaDetail_list {
        gap: 48px;
    }

    .qaDetail_row,
    .qaDetail_item + .qaDetail_item .qaDetail_row {
        flex-direction: column;
        gap: 24px;
        padding-top: 0;
        border-top: 0;
    }

    .qaDetail_q,
    .qaDetail_a {
        flex: none;
        width: 100%;
        max-width: none;
    }

    .qaDetail_q {
        gap: 12px;
    }

    .qaDetail_num {
        width: 34px;
        padding: 0;
        font-size: 2rem;
        line-height: 1.4;
        text-align: center;
    }

    .qaDetail_ask {
        font-size: 2rem;
        line-height: 1.4;
    }

    .qaDetail_a {
        gap: 16px;
    }

    .qaDetail_lead {
        font-size: 1.6rem;
        line-height: 1.8;
    }

    .qaDetail_photo,
    .qaDetail_photo-end {
        margin: 24px 0 0;
    }

    .day {
        padding: 0 0 60px;
    }

    .day_panel {
        display: flex;
        flex-direction: column;
        gap: 24px;
        padding: 30px 0 48px;
    }

    .day_title {
        padding: 0 20px;
    }

    .day_gallery {
        height: auto;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .day_gallery::-webkit-scrollbar {
        display: none;
    }

    .day_gallery img {
        flex: 0 0 207px;
        width: 207px;
        height: 110px;
    }

    .day_scale {
        display: none;
    }

    .day_list {
        display: flex;
        flex-direction: column;
        margin: 0 26px;
        padding: 0;
        list-style: none;
    }

    .day_row {
        display: grid;
        grid-template-columns: 28px 1fr;
        grid-template-rows: 28px auto;
        column-gap: 14px;
    }

    .day_row::before {
        content: "";
        grid-row: 1;
        grid-column: 1;
        width: 28px;
        height: 28px;
        background: url("/recruit/new-graduates/img/people/icon_clock.svg") center / 28px 28px no-repeat;
    }

    .day_row::after {
        content: "";
        grid-row: 2;
        grid-column: 1;
        justify-self: center;
        width: 1px;
        min-height: 36px;
        background: #fff;
    }

    .day_row:last-child::after {
        display: none;
    }

    .day_list .day_time {
        grid-row: 1;
        grid-column: 2;
        align-self: center;
        font-size: 1.3rem;
    }

    .day_list .day_task {
        grid-row: 2;
        grid-column: 2;
        padding-top: 4px;
        font-weight: 500;
        font-size: 1.3rem;
        line-height: 1.5;
    }

    .entry {
        gap: 40px;
        padding: 72px 16px;
    }

    .entry_title {
        gap: 10px;
    }

    .entry_line {
        flex-direction: column;
        gap: 10px;
    }

    .entry_chunk-brand {
        gap: 0;
        transform: translateX(-12px);
    }

    .entry_chunk-brand .entry_en {
        font-size: 3.2rem;
        line-height: 1;
    }

    .entry_ja-no {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        font-size: 2.8rem;
        line-height: 1;
    }

    .entry_chunk-next {
        gap: 4px;
    }

    .entry_ja-next {
        margin-right: -8px;
        font-size: 4rem;
        line-height: 1;
    }

    .entry_chunk-next .entry_en {
        font-size: 4.8rem;
        line-height: 1;
    }

    .entry_chunk-next .entry_ja:last-child,
    .entry_line + .entry_line .entry_ja {
        font-size: 4rem;
        line-height: 1;
    }

    .entry_lead {
        font-size: 1.6rem;
        letter-spacing: 0.04em;
    }

    .entry_actions {
        flex-direction: column;
        align-items: center;
        gap: 16px;
        width: 100%;
    }

    .entry_button {
        justify-content: center;
        width: 320px;
        max-width: 100%;
        height: 64px;
        padding: 0;
        font-size: 2rem;
    }

    .entry_arrow {
        top: 50%;
        right: 16px;
        width: 16px;
        height: 16px;
        transform: translateY(-50%);
    }

    .footer_content,
    .footer_columns {
        flex-direction: column;
        align-items: flex-start;
    }

    .footer_columns {
        gap: 32px;
    }

    .footer_logo {
        width: min(220px, 100%);
    }

    .footer_main {
        padding-inline: 16px;
    }
}

@keyframes swipeArrow {
    from { transform: translateX(-14px); }
    to { transform: translateX(14px); }
}

@media screen and (min-width: 768px) and (max-width: 1399px) {
    .personHero_inner {
        flex-wrap: wrap;
        align-items: flex-start;
        min-height: 0;
    }

    .personHero_content {
        display: contents;
    }

    .personHero_quote,
    .personHero-suda .personHero_quote {
        order: -1;
        flex: 1 0 100%;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding-top: 0;
    }

    .personHero_line {
        flex-wrap: wrap;
        width: fit-content;
        max-width: 100%;
        min-width: 0;
        white-space: normal;
    }

    .personHero_meta {
        flex: 1 1 0;
        min-width: 0;
        margin-top: 80px;
        margin-bottom: 40px;
    }
}

@media screen and (min-width: 1440px) {
    .service_deco,
    .work_deco,
    .personHero_deco {
        left: calc(-61px - (min(1920px, 100vw) - 1440px) / 2);
    }

    .service:nth-child(even) .service_deco {
        left: auto;
        right: calc(-61px - (min(1920px, 100vw) - 1440px) / 2);
    }

    .growth_deco {
        left: calc((1440px - min(1920px, 100vw)) / 2);
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .pageLinks_track,
    .work_track,
    .interviewGuide_arrow {
        animation: none;
    }

    .hero_video,
    .subHero_video,
    .menuSp_video {
        display: none;
    }

    .heroPhoto_slot {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .mates_shade,
    .mates_hover {
        transition: none;
    }
}