@charset "utf-8";

/* ========================================
// foundation - 基本設定
// ======================================== */
/* variable - 変数定義 */
:root {
    /* root-size */
    font-size: min(1.5625vw, 16px);

    /* color */
    --color--base-primary: #FFFFFF;
    --color--base-secondary: #F5FCFF;
    --color--base-tertiary: #D9E9F1;
    --color--base-quaternary: #BFDAE8;
    --color--base-quinary: #EBEAE9;

    --color--font-primary: #434343;

    --color--border-primary: #DDDDDD;

    --color--main-primary: #00507D;
    --color--main-secondary: #006CA4;

    /* font-family */
    --font-family--jp: YakuHanJP, 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
    --font-family--en: 'Roboto', Arial, sans-serif;

    /* header-size */
    --header-size--medium: 5rem;

    /* section-size */
    --seciton-size--small: 3.125rem;
    --section-size--medium: 5rem;
    --section-size--large: 7.5rem;

    /* container-rate */
    --container-rate--medium: calc(100% - (1.25rem * 2));
    
    /* container-size */
    --container-size--x-small: 43.75rem;
    --container-size--small: 62.5rem;
    --container-size--medium: 70rem;

    /* z-index */
    --z-index--primary: calc(infinity);
    --z-index--secondary: 1000;
    --z-index--tertiary: 100;
    --z-index--quaternary: 10;

    /* icon */
    --icon--arrow-right: url('../../assets/images/common/icon_arrow-right.svg');
    --icon--arrow-up: url('../../assets/images/common/icon_arrow-up.svg');
    --icon--time: url('../../assets/images/common/icon_time.png');
}
@media (max-width: 768px) {
    :root {
        font-size: 16px;
        --header-size--medium: 3.125rem;
        --seciton-size--small: 2.5rem;
        --section-size--medium: 2.5rem;
        --section-size--large: 2.5rem;
    }
}

/* base - 基本設定 */
html,
body {
    font-family: var(--font-family--jp);
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    line-height: 1.5;
    overflow-x: clip;
}
@media (max-width: 768px) {
    html:has([data-drawer-active="true"]) {
        overflow-y: clip;
    }
}
button {
    appearance: none;
    background: transparent;
    border-radius: 0;
    border-style: solid;
    border-width: 0;
    box-sizing: border-box;
    color: inherit;
    cursor: pointer;
    font: inherit;
    margin: 0;
    min-width: 0;
    padding: 0;
    text-align: inherit;
    text-transform: inherit;
    vertical-align: middle;
}
h1, h2, h3, h4, h5, h6 {
    clear: unset;
    font-family: var(--font-family--jp);
    font-weight: 400;
}
:focus-visible {
    outline: solid 2px var(--color--main-secondary);
}

/* ========================================
// layout - レイアウト
// ======================================== */
/* section - セクション */
.l-section {
    padding-bottom: var(--section-size--medium);
    padding-top: var(--section-size--medium);
}
.l-section.is-small {
    padding-bottom: var(--seciton-size--small);
    padding-top: var(--seciton-size--small);
}
.l-section.is-large {
    padding-bottom: var(--section-size--large);
    padding-top: var(--section-size--large);
}
.l-section__header {
    display: grid;
    row-gap: 2.5rem;
}
@media (max-width: 768px) {
    .l-section__header {
        row-gap: 1.5rem;
    }
}
.l-section__body {
    margin-top: 3.75rem;
}
@media (max-width: 768px) {
    .l-section__body {
        margin-top: 3rem;
    }
}
.l-section__footer {
    margin-top: 3.75rem;
}
@media (max-width: 768px) {
    .l-section__footer {
        margin-top: 2rem;
    }
}

/* container - コンテナ */
.l-container {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--container-size--medium);
    width: var(--container-rate--medium);
}
.l-container.is-x-small {
    max-width: var(--container-size--x-small);
}
.l-container.is-small {
    max-width: var(--container-size--small);
}

/* anchor - アンカー */
.l-anchor {
    margin-top: calc(var(--header-size--medium) * -1);
    padding-top: var(--header-size--medium);
}

/* header - ヘッダー */
.l-header {
    height: var(--header-size--medium);
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: var(--z-index--tertiary);
}
.l-header__container {
    column-gap: 1.25rem;
    display: flex;
    height: 100%;
}
@media (max-width: 768px) {
    .l-header__container {
        justify-content: space-between;
        margin-right: 0;
        width: calc(100% - 1.25rem);
    }
}
.l-header__logo {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 17.85714286%;
}
@media (max-width: 768px) {
    .l-header__logo {
        position: relative;
        width: auto;
        z-index: var(--z-index--primary);
    }
}
.l-header__logo-link {
    color: var(--color--font-primary);
    display: grid;
    font-size: .875rem;
    font-weight: 700;
    justify-items: center;
    line-height: 1.125;
    max-width: 8.75rem;
    row-gap: .25rem;
    text-decoration: none;
}
@media (max-width: 768px) {
    .l-header__logo-link {
        font-size: .625rem;
        row-gap: .125rem;
        width: 6.25rem;
    }
}
.l-header__nav {
    flex-grow: 1;
}
@media (max-width: 768px) {
    .l-header__nav {
        background-color: var(--color--base-tertiary);
        border: solid .25rem var(--color--main-secondary);
        display: none;
        height: 100vh;
        left: 0;
        opacity: 0;
        overflow-y: scroll;
        padding: calc(var(--header-size--medium) - .25rem) calc(1.25rem - .25rem);
        position: fixed;
        top: 0;
        transition:
            .15s ease opacity,
            .15s ease display;
        transition-behavior: allow-discrete;
        width: 100%;
        z-index: var(--z-index--secondary);
    }
    html:has([data-drawer-active="true"]) .l-header__nav {
        display: block;
        opacity: 1;
    }
    @starting-style {
        html:has([data-drawer-active="true"]) .l-header__nav {
            opacity: 0;
        }
    }
}
@media (min-width: 769px) {
    .l-header__nav-list {
        display: flex;
        height: 100%;
    }
    .l-header__nav-item {
        width: 16%;
    }
    .l-header__nav-item.is-action {
        position: relative;
        width: 25%;
    }
    .l-header__nav-item.is-action::after {
        background-color: var(--color--main-primary);
        content: '';
        height: 100%;
        left: 100%;
        position: absolute;
        top: 0;
        width: 100vw;
    }
    .l-header__nav-link {
        align-items: center;
        background-color: #231815;
        color: var(--color--base-primary);
        display: flex;
        font-family: var(--font-family--en);
        font-size: 1.25rem;
        font-weight: 500;
        height: 100%;
        justify-content: center;
        letter-spacing: .0625rem;
        line-height: 1.25;
        text-align: center;
        text-decoration: none;
    }
    .l-header__nav-link:is(.l-header__nav-item.is-action *) {
        background-color: var(--color--main-primary);
    }
}
@media (max-width: 768px) {
    .l-header__nav-list {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .l-header__nav-item.is-action {
        display: flex;
        justify-content: center;
        margin-top: 1.25rem;
    }
    .l-header__nav-link {
        color: var(--color--main-secondary);
        display: block;
        font-family: var(--font-family--en);
        font-size: 1.125rem;
        font-weight: 700;
        line-height: 1.25;
        padding-bottom: 1rem;
        padding-top: 1rem;
        text-align: center;
        text-decoration: none;
    }
    .l-header__nav-link:is(.l-header__nav-item.is-action *) {
        background-color: var(--color--main-secondary);
        color: var(--color--base-primary);
        display: flex;
        flex-direction: column;
        max-width: 15.5rem;
        padding: 1rem 1.25rem;
        position: relative;
        row-gap: .25rem;
        width: 100%;
    }
    .l-header__nav-link:is(.l-header__nav-item.is-action *)::after {
        background-color: var(--color--base-primary);
        content: '';
        height: .625rem;
        left: calc(100% - 1.25rem);
        mask-image: var(--icon--arrow-right);
        mask-position: right bottom;
        mask-repeat: no-repeat;
        position: absolute;
        top: 50%;
        transition: .6s cubic-bezier(.075, .82, .165, 1) left;
        translate: 0 -50%;
        width: 2.5rem;
    }
    @media (any-hover: hover) {
        .l-header__nav-link:is(.l-header__nav-item.is-action *):hover::after {
            left: calc(100% - .625rem);
        }
    }
    .l-header__nav-copy:is(.l-header__nav-item.is-action *) {
        font-size: 1.5rem;
        font-style: italic;
        line-height: 1.125;
    }
    .l-header__nav-description:is(.l-header__nav-item.is-action *) {
        font-size: .75rem;
    }
    .l-header__nav-item.is-tel {
        display: flex;
        justify-content: center;
        margin-top: 2rem;
    }
    .l-header__nav-link:is(.l-header__nav-item.is-tel *) {
        display: flex;
        flex-direction: column;
        padding-bottom: unset;
        padding-top: unset;
        row-gap: .25rem;
    }
    .l-header__nav-copy:is(.l-header__nav-item.is-tel *) {
        font-size: 2rem;
        font-style: italic;
    }
    .l-header__nav-description:is(.l-header__nav-item.is-tel *) {
        font-family: var(--font-family--jp);
    }
}
.l-header__button {
    display: none;
}
@media (max-width: 768px) {
    .l-header__button {
        align-items: center;
        aspect-ratio: 4 / 3;
        background-color: var(--color--main-secondary);
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: center;
        position: relative;
        row-gap: .375rem;
        z-index: var(--z-index--primary);
    }
    .l-header__button-icon {
        aspect-ratio: 24 / 17;
        display: block;
        position: relative;
        width: 1.5rem;
    }
    .l-header__button-icon > *,
    .l-header__button-icon::before,
    .l-header__button-icon::after {
        background-color: var(--color--base-primary);
        height: .0625rem;
        left: 50%;
        position: absolute;
        transition:
            .3s ease rotate,
            .3s ease translate;
        translate: -50% 0;
        width: 100%;
    }
    .l-header__button-icon > * {
        top: 50%;
        transition: .15s ease opacity;
    }
    .l-header__button-icon::before,
    .l-header__button-icon::after {
        content: '';
        transition: .4s ease rotate;
    }
    .l-header__button-icon::before {
        top: calc(50% - .5rem);
    }
    .l-header__button-icon::after {
        top: calc(50% + .5rem);
    }
    .l-header__button-label {
        color: var(--color--base-primary);
        font-size: .625rem;
        line-height: 1.25;
        text-align: center;
        text-transform: uppercase;
    }
    html:has([data-drawer-active="true"]) .l-header__button-icon > * {
        opacity: 0;
    }
    html:has([data-drawer-active="true"]) .l-header__button-icon::before,
    html:has([data-drawer-active="true"]) .l-header__button-icon::after {
        top: 50%;
        translate: -50% -50%;
    }
    html:has([data-drawer-active="true"]) .l-header__button-icon::before {
        rotate: 315deg;
    }
    html:has([data-drawer-active="true"]) .l-header__button-icon::after {
        rotate: -315deg;
    }
}

/* main - メインコンテンツ */
.l-main {
    padding-top: var(--header-size--medium);
}

/* footer - フッター */
.l-footer {
    position: relative;
}
.l-footer__logo {
    margin-top: 9.375rem;
}
@media (max-width: 768px) {
    .l-footer__logo {
        margin-top: var(--seciton-size--small);
    }
}
.l-footer__logo-link {
    display: flex;
    max-width: 13.125rem;
}
@media (max-width: 768px) {
    .l-footer__logo-link {
        max-width: 8.75rem;
    }
}
.l-footer__pagetop {
    bottom: var(--seciton-size--small);
    position: absolute;
    right: 1.25rem;
}
@media (max-width: 768px) {
    .l-footer__pagetop {
        bottom: 4.75rem;
    }
}
.l-footer__pagetop-link {
    color: var(--color--main-secondary);
    display: grid;
    font-size: .875rem;
    justify-items: center;
    row-gap: .75rem;
    text-decoration: none;
    text-transform: uppercase;
}
@media (max-width: 768px) {
    .l-footer__pagetop-link {
        font-size: .625rem;
        row-gap: .25rem;
    }
}
.l-footer__pagetop-link::after {
    aspect-ratio: 32 / 13;
    background-color: var(--color--main-secondary);
    content: '';
    mask-image: var(--icon--arrow-up);
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    width: 2rem;
}
@media (max-width: 768px) {
    .l-footer__pagetop-link::after {
        width: 1.5rem;
    }
}
.l-footer__copyright {
    font-size: .875rem;
    line-height: 1.25;
    margin-top: 2.5rem;
}
@media (max-width: 768px) {
    .l-footer__copyright {
        font-size: .625rem;
        margin-top: 1.25rem;
    }
}

/* ========================================
// component - コンポーネント
// ======================================== */
/* button - ボタンリンク */
.c-button {
    align-items: center;
    background-color: color-mix(in srgb, var(--color--main-secondary) 80%, transparent);
    color: var(--color--base-primary);
    display: inline-flex;
    height: 3.75rem;
    justify-content: center;
    text-align: center;
    text-decoration: none;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    position: relative;
    width: 17.5rem;
}
@media (max-width: 768px) {
    .c-button {
        font-size: .875rem;
        height: 3.125rem;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        width: 15rem;
    }
}
.c-button::after {
    background-color: var(--color--base-primary);
    content: '';
    height: .625rem;
    left: calc(100% - 1.75rem);
    mask-image: var(--icon--arrow-right);
    mask-position: right bottom;
    mask-repeat: no-repeat;
    position: absolute;
    top: 50%;
    transition: .6s cubic-bezier(.075, .82, .165, 1) left;
    translate: 0 -50%;
    width: 3.5rem;
}
@media (max-width: 768px) {
    .c-button::after {
        left: calc(100% - 1.25rem);
        width: 2.5rem;
    }
}
@media (any-hover: hover) {
    .c-button:hover::after {
        left: calc(100% - .875rem);
    }
}
@media (max-width: 768px) {
    @media (any-hover: hover) {
        .c-button:hover::after {
            left: calc(100% - .625rem);
        }
    }
}
.c-button.is-large {
    font-size: 1.5rem;
    font-weight: 700;
    height: 8.125rem;
    min-width: 28rem;
}
@media (max-width: 768px) {
    .c-button.is-large {
        font-size: .875rem;
        font-style: italic;
        font-weight: 700;
        height: 3.5rem;
        max-width: 17.5rem;
        min-width: unset;
        width: 100%;
    }
}
@media (any-hover: hover) {
    .c-button.is-large:hover {
        background-color: var(--color--main-primary);
    }
}
.c-button.is-text {
    background-color: transparent;
    color: var(--color--font-primary);
    height: unset;
    padding-left: unset;
    padding-right: unset;
    width: unset;
}
.c-button.is-text::after {
    background-color: var(--color--main-secondary);
    left: 100%;
    width: 2.5rem;
}
@media (any-hover: hover) {
    .c-button.is-text:hover::after {
        left: calc(100% + .625rem);
    }
}

/* title - 見出し */
.c-title__secondary {
    display: grid;
    row-gap: 1.75rem;
}
@media (max-width: 768px) {
    .c-title__secondary {
        row-gap: .75rem;
    }
}
.c-title__secondary-main {
    color: var(--color--main-secondary);
    font-family: var(--font-family--en);
    font-size: 3.75rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .c-title__secondary-main {
        font-size: 2rem;
    }
}
.c-title__secondary-sub {
    color: var(--color--main-secondary);
    font-size: 1.75rem;
    font-weight: 500;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .c-title__secondary-sub {
        font-size: 1.125rem;
    }
}
.c-title__secondary.is-white > * {
    color: var(--color--base-primary);
}
.c-title__secondary.is-shadow > * {
    text-shadow: 0 .125rem .125rem var(--color--main-primary);
}

/* text - テキスト */
.c-text {
    color: var(--color--main-secondary);
    line-height: 2;
}
@media (max-width: 768px) {
    .c-text {
        font-size: .875rem;
    }
}
.c-text.is-white {
    color: var(--color--base-primary);
}
.c-text.is-shadow {
    font-size: 1.25rem;
    text-shadow: 0 .0625rem .375rem var(--color--main-primary);
}
@media (max-width: 768px) {
    .c-text.is-shadow {
        font-size: .875rem;
    }
}

/* list-interviews - インタビューリスト */
.c-list-interviews__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 768px) {
    .c-list-interviews__list {
        grid-template-columns: unset;
    }
}
.c-list-interviews__item-link {
    display: block;
    position: relative;
}
.c-list-interviews__item-image img {
    aspect-ratio: 1;
    object-position: 50% 25%;
}
.c-list-interviews__item-button {
    bottom: 3.125rem;
    left: 50%;
    position: absolute;
    translate: -50% 0;
}
@media (max-width: 768px) {
    .c-list-interviews__item-button {
        bottom: 2rem;
    }
}
@media (any-hover: hover) {
    .c-list-interviews__item-link:hover .c-button::after {
        left: calc(100% - .875rem);
    }
}
@media (max-width: 768px) {
    @media (any-hover: hover) {
        .c-list-interviews__item-link:hover .c-button::after {
            left: calc(100% - .625rem);
        }
    }
}

/* action-job - 求人情報へのリンクセクション */
.c-action-job {
    background-image: url('../../assets/images/common/image_action-job.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
@media (max-width: 768px) {
    .c-action-job__body {
        margin-top: 2rem;
    }
}
.c-action-job__footer {
    margin-top: 8.75rem;
}
@media (max-width: 768px) {
    .c-action-job__footer {
        margin-top: var(--section-size--medium);
    }
}
.c-action-job__copy {
    color: var(--color--base-primary);
    font-size: 2.75rem;
    font-weight: 700;
}
@media (max-width: 768px) {
    .c-action-job__copy {
        font-size: 1.25rem;
    }
}

/* action-tel */
.c-action-tel * {
    color: var(--color--base-primary);
}
.c-action-tel__title {
    display: grid;
    row-gap: 1.25rem;
}
.c-action-tel__title-sub {
    font-size: 1.75rem;
    font-weight: 500;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .c-action-tel__title-sub {
        font-size: 1.125rem;
    }
}
.c-action-tel__title-main {
    font-family: var(--font-family--en);
    font-size: 4rem;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .c-action-tel__title-main {
        font-size: 2.25rem;
    }
}
.c-action-tel__title-main a {
    color: inherit;
    font-style: italic;
    font-weight: 700;
    text-decoration: none;
}
.c-action-tel__body {
    margin-top: 1rem;
}

/* ========================================
// project - プロジェクト
// ======================================== */
/* archive - アーカイブページ */
.p-archive-mv img {
    width: 100%;
}
.p-archive-introduction {
    background-image: url('../../assets/images/common/image_introduction.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.p-archive-introduction * {
    color: var(--color--base-primary);
}
.p-archive-introduction__title {
    font-size: 3rem;
    font-weight: 700;
}
@media (max-width: 768px) {
    .p-archive-introduction__title {
        font-size: 1.25rem;
    }
}
@media (max-width: 768px) {
    .p-archive-introduction__body {
        margin-top: 1.5rem;
    }
}
.p-archive-introduction__description {
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 2.8;
}
@media (max-width: 768px) {
    .p-archive-introduction__description {
        font-size: .875rem;
        line-height: 2;
    }
}
.p-archive-message {
    position: relative;
    z-index: 0;
}
@media (max-width: 768px) {
    .p-archive-message {
        background-color: var(--color--base-quinary);
        padding-top: unset;
    }
}
.p-archive-message__image {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}
@media (max-width: 768px) {
    .p-archive-message__image {
        aspect-ratio: 25 / 18;
        left: unset;
        position: unset;
        top: unset;
    }
}
@media (max-width: 768px) {
    .p-archive-message__container {
        margin-top: 2.5rem;
    }
}
@media (max-width: 768px) {
    .p-archive-message__header {
        text-align: center;
    }
}
.p-archive-message__body {
    margin-top: 3rem;
}
@media (max-width: 768px) {
    .p-archive-message__body {
        margin-top: 1.5rem;
    }
}
.p-archive-message__description {
    line-height: 2.5;
}
@media (max-width: 768px) {
    .p-archive-message__description {
        line-height: 2;
    }
}
.p-archive-message__description:not(:first-child) {
    margin-top: 2.5rem;
}
@media (max-width: 768px) {
    .p-archive-message__description:not(:first-child) {
        margin-top: 1.25rem;
    }
}
@media (max-width: 768px) {
    .p-archive-message__footer {
        display: flex;
        justify-content: center;
    }
}
.p-archive-advantage {
    --background-logo--color: color-mix(in srgb, var(--color--main-secondary) 15%, transparent);
}
.p-archive-advantage__list {
    counter-reset: advantage__list-counter;
}
.p-archive-advantage__item {
    align-items: center;
    counter-increment: advantage__list-counter;
    display: flex;
    position: relative;
    z-index: 0;
}
@media (max-width: 768px) {
    .p-archive-advantage__item {
        align-items: unset;
        flex-direction: column;
        row-gap: 1rem;
    }
}
.p-archive-advantage__item::before {
    background-color: var(--color--base-secondary);
    content: '';
    height: 100%;
    left: calc(50% - 50vw);
    position: absolute;
    top: 0;
    width: 100vw;
    z-index: -1;
}
.p-archive-advantage__item:nth-child(2n) {
    flex-direction: row-reverse;
}
@media (max-width: 768px) {
    .p-archive-advantage__item:nth-child(2n) {
        flex-direction: column;
    }
}
.p-archive-advantage__item:nth-child(2n)::before {
    content: none;
}
.p-archive-advantage__item-title {
    align-items: center;
    color: var(--color--main-secondary);
    display: flex;
    flex-direction: column;
    font-size: 2.125rem;
    font-weight: 700;
    line-height: 1.375;
    row-gap: 1.25rem;
    width: 47%;
}
@media (max-width: 768px) {
    .p-archive-advantage__item-title {
        font-size: 1.25rem;
        row-gap: 1rem;
        width: unset;
    }
}
.p-archive-advantage__item-title::before {
    color: var(--color--main-secondary);
    content: counter(advantage__list-counter, decimal-leading-zero);
    font-family: var(--font-family--en);
    font-size: 5.625rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1;
}
@media (max-width: 768px) {
    .p-archive-advantage__item-title::before {
        font-size: 3.25rem;
    }
}
.p-archive-advantage__item-description {
    width: 53%;
}
@media (max-width: 768px) {
    .p-archive-advantage__item-description {
        width: unset;
    }
}
@media (max-width: 768px) {
    .p-archive-movie__body {
        margin-top: 2rem;
    }
}
.p-archive-movie__list {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 768px) {
    .p-archive-movie__list {
        grid-template-columns: unset;
    }
}
.p-archive-movie__item iframe {
    aspect-ratio: 16 / 9;
    height: auto;
    vertical-align: bottom;
    width: 100%;
}

/* single - シングルページ */
.p-single-mv {
    position: relative;
}
@media (max-width: 768px) {
    .p-single-mv {
        background-color: var(--color--main-secondary);
    }
}
.p-single-mv * {
    color: var(--color--base-primary);
}
@media (min-width: 769px) {
    .p-single-mv__image {
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: -1;
    }
}
@media (max-width: 768px) {
    .p-single-mv__image {
        overflow-y: clip;
        position: relative;
    }
}
@media (max-width: 768px) {
    .p-single-mv__image::after {
        aspect-ratio: 6 / 5;
        background-color: color-mix(in srgb, var(--color--main-primary) 80%, transparent);
        bottom: -.0625rem;
        clip-path: polygon(0 0, 0 100%, 100% 100%);
        content: '';
        left: 0;
        position: absolute;
        width: 11.25rem;
    }
}
@media (max-width: 768px) {
    .p-single-mv__image img {
        aspect-ratio: 32 / 23;
    }
}
@media (min-width: 769px) {
    .p-single-mv__container {
        --single-mv--background-position: 22.5%;
        --single-mv--background-width: 43.2%;
        display: grid;
        justify-items: start;
        padding-bottom: 3.25rem;
        padding-top: 4.375rem;
        position: relative;
        row-gap: 2.25rem;
    }
    .p-single-mv__container:is(.p-single-mv.is-reverse *) {
        --single-mv--background-position: 77.5%;
        justify-items: end;
    }
    .p-single-mv__container::before,
    .p-single-mv__container::after {
        background-color: color-mix(in srgb, var(--color--main-primary) 80%, transparent);
        content: '';
        height: 100%;
        position: absolute;
        top: 0;
        z-index: -1;
    }
    .p-single-mv__container::before {
        right: calc(100% - var(--single-mv--background-position));
        width: 100vw;
    }
    .p-single-mv__container:is(.p-single-mv.is-reverse *)::before {
        left: var(--single-mv--background-position);
        right: unset;
    }
    .p-single-mv__container::after {
        clip-path: polygon(0 0, 0% 100%, 100% 100%);
        left: var(--single-mv--background-position);
        width: var(--single-mv--background-width);
    }
    .p-single-mv__container:is(.p-single-mv.is-reverse *)::after {
        scale: -1 1;
        left: unset;
        right: calc(100% - var(--single-mv--background-position));
    }
}
@media (max-width: 768px) {
    .p-single-mv__container {
        display: grid;
        padding: 2rem 1rem;
        position: relative;
        row-gap: 1.25rem;
    }
}
.p-single-mv__number {
    display: grid;
    font-family: var(--font-family--en);
    font-style: italic;
    font-weight: 700;
    row-gap: .625rem;
}
@media (max-width: 768px) {
    .p-single-mv__number {
        bottom: calc(100% + .5rem);
        left: 0;
        position: absolute;
        row-gap: .125rem;
    }
}
.p-single-mv__number-sub {
    border-bottom: solid .1875rem var(--color--base-primary);
    font-size: 1.75rem;
    line-height: 1;
    padding-bottom: .625rem;
}
@media (max-width: 768px) {
    .p-single-mv__number-sub {
        border-bottom: solid .125rem var(--color--base-primary);
        font-size: .875rem;
        padding-bottom: .25rem;
    }
}
.p-single-mv__number-main {
    font-size: 6.25rem;
    line-height: 1;
}
@media (max-width: 768px) {
    .p-single-mv__number-main {
        font-size: 3.125rem;
    }
}
.p-single-mv__title {
    display: grid;
    row-gap: 1.5rem;
}
@media (max-width: 768px) {
    .p-single-mv__title {
        row-gap: .75rem;
    }
}
@media (min-width: 769px) {
    .p-single-mv__title:is(.p-single-mv.is-reverse *) {
        justify-items: end;
    }
}
.p-single-mv__title-main {
    font-size: 2.5rem;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-mv__title-main {
        font-size: 1.25rem;
    }
}
.p-single-mv__title-sub {
    font-family: var(--font-family--en);
    font-size: 1.125rem;
    font-weight: 500;
    letter-spacing: .1875em;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-mv__title-sub {
        font-size: .75rem;
    }
}
.p-single-mv__join {
    font-size: 1.375rem;
    letter-spacing: .0625em;
}
@media (max-width: 768px) {
    .p-single-mv__join {
        font-size: .875rem;
    }
}
.p-single-mv__copy {
    font-size: 2.25rem;
    font-weight: 500;
}
@media (max-width: 768px) {
    .p-single-mv__copy {
        font-size: 1.25rem;
    }
}
@media (min-width: 769px) {
    .p-single-mv__copy:is(.p-single-mv.is-reverse *) {
        text-align: right;
    }
}
.p-single-reason.is-blue {
    --background-logo--color: color-mix(in srgb, var(--color--base-primary) 10%, transparent);
    position: relative;
}
.p-single-reason.is-blue::after {
    aspect-ratio: 3 / 2;
    background-color: inherit;
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    content: '';
    left: 50%;
    position: absolute;
    top: calc(100% - .0625rem);
    translate: -50% 0;
    width: 3.75rem;
}
@media (max-width: 768px) {
    .p-single-reason.is-blue::after {
        content: none;
    }
}
.p-single-reason.is-blue * {
    color: var(--color--base-primary);
}
.p-single-reason__title {
    color: var(--color--main-primary);
    display: grid;
    row-gap: 1.5rem;
}
@media (max-width: 768px) {
    .p-single-reason__title {
        row-gap: 1rem;
    }
}
.p-single-reason__title-sub {
    font-family: var(--font-family--en);
    font-size: 1.75rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-reason__title-sub {
        font-size: 1.25rem;
    }
}
.p-single-reason__title-main {
    font-size: 1.75rem;
    font-weight: 500;
}
@media (max-width: 768px) {
    .p-single-reason__title-main {
        font-size: 1.125rem;
    }
}
.p-single-reason__body {
    margin-top: 2rem;
}
@media (max-width: 768px) {
    .p-single-reason__body {
        margin-top: 1.25rem;
    }
}
.p-single-reason__description {
    color: var(--color--font-primary);
}
@media (max-width: 768px) {
    .p-single-current {
        padding-bottom: 0;
    }
}
.p-single-current__title {
    color: var(--color--main-primary);
    display: grid;
    row-gap: 1.875rem;
}
@media (max-width: 768px) {
    .p-single-current__title {
        row-gap: 1rem;
    }
}
.p-single-current__title-sub {
    font-family: var(--font-family--en);
    font-size: 1.75rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-current__title-sub {
        font-size: 1.25rem;
    }
}
.p-single-current__title-main {
    font-size: 2.625rem;
    font-weight: 500;
}
@media (max-width: 768px) {
    .p-single-current__title-main {
        font-size: 1.125rem;
    }
}
.p-single-current__body {
    display: grid;
    row-gap: 8.75rem;
}
@media (max-width: 768px) {
    .p-single-current__body {
        margin-top: 2rem;
        row-gap: unset;
    }
}
.p-single-current__block {
    align-items: center;
    display: flex;
    position: relative;
    z-index: 0;
}
@media (max-width: 768px) {
    .p-single-current__block {
        align-items: unset;
        flex-direction: column;
        position: unset;
        z-index: unset;
    }
}
@media (min-width: 769px) {
    .p-single-current__block:nth-child(2n) {
        flex-direction: row-reverse;
    }
}
.p-single-current__block-image {
    position: relative;
    width: 55%;
    z-index: -1;
}
@media (max-width: 768px) {
    .p-single-current__block-image {
        position: unset;
        width: 100%;
        z-index: unset;
    }
}
.p-single-current__block-image img {
    aspect-ratio: 22 / 15;
}
.p-single-current__block-contents {
    --single-current--block-overlap-width: 4.5rem;
    background-color: color-mix(in srgb, var(--color--base-primary) 80%, transparent);
    display: grid;
    margin-left: calc(var(--single-current--block-overlap-width) * -1);
    padding: 2.5rem 5rem 2.5rem 3.125rem;
    row-gap: .625rem;
    width: calc(45% + var(--single-current--block-overlap-width));
}
@media (max-width: 768px) {
    .p-single-current__block-contents {
        margin-left: unset;
        padding: 2rem 1.25rem;
        width: unset;
    }
}
@media (min-width: 769px) {
    .p-single-current__block-contents:is(.p-single-current__block:nth-child(2n) *) {
        margin-left: unset;
        margin-right: calc(var(--single-current--block-overlap-width) * -1);
        padding: 2.5rem 3.125rem 2.5rem 5rem;
    }
}
.p-single-current__block-title {
    font-size: 1.625rem;
    font-weight: 500;
}
@media (max-width: 768px) {
    .p-single-current__block-title {
        font-size: 1.125rem;
    }
}
.p-single-current__block-description {
    color: var(--color--font-primary);
}
.p-single-schedule__title {
    color: var(--color--main-secondary);
    display: grid;
    justify-items: center;
    row-gap: 1.25rem;
}
@media (max-width: 768px) {
    .p-single-schedule__title {
        row-gap: .75rem;
    }
}
.p-single-schedule__title::before {
    aspect-ratio: 1;
    background-image: var(--icon--time);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: '';
    width: 5.75rem;
}
@media (max-width: 768px) {
    .p-single-schedule__title::before {
        width: 3.125rem;
    }
}
.p-single-schedule__title-sub {
    font-family: var(--font-family--en);
    font-size: 3.75rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
}
@media (max-width: 768px) {
    .p-single-schedule__title-sub {
        font-size: 2rem;
    }
}
.p-single-schedule__title-main {
    font-size: 1.75rem;
    font-weight: 500;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-schedule__title-main {
        font-size: 1.125rem;
    }
}
@media (max-width: 768px) {
    .p-single-schedule__body {
        margin-top: 2rem;
    }
}
.p-single-schedule__list {
    border-left: solid .0625rem var(--color--main-primary);
    display: grid;
    padding-left: 3.125rem !important;
    row-gap: 3.125rem;
}
@media (max-width: 768px) {
    .p-single-schedule__list {
        border-left: unset;
        padding-left: unset !important;
        position: relative;
        row-gap: 2rem;
        z-index: 0;
    }
}
@media (max-width: 768px) {
    .p-single-schedule__list::before {
        background-color: var(--color--main-primary);
        content: '';
        height: 100%;
        left: 50%;
        position: absolute;
        top: 0;
        translate: -50% 0;
        width: .0625rem;
        z-index: -1;
    }
}
.p-single-schedule__item {
    align-items: flex-start;
    background-color: var(--color--base-primary);
    column-gap: 1.5rem;
    display: flex;
    padding: 1.5rem;
    position: relative;
}
@media (max-width: 768px) {
    .p-single-schedule__item {
        align-items: unset;
        flex-direction: column;
        padding: 1rem;
        row-gap: 1rem;
    }
}
.p-single-schedule__item::before {
    aspect-ratio: 3 / 4;
    background-color: var(--color--base-primary);
    clip-path: polygon(0 50%, 100% 100%, 100% 0);
    content: '';
    position: absolute;
    right: calc(100% - .0625rem);
    top: 50%;
    translate: 0 -50%;
    width: 1.875rem;
}
@media (max-width: 768px) {
    .p-single-schedule__item::before {
        content: none;
    }
}
.p-single-schedule__item-contents {
    display: grid;
    flex-grow: 1;
    row-gap: 1rem;
}
@media (max-width: 768px) {
    .p-single-schedule__item-contents {
        row-gap: .375rem;
    }
}
.p-single-schedule__item-title {
    align-items: center;
    color: var(--color--main-secondary);
    column-gap: 1.875rem;
    display: grid;
    grid-template-columns: auto 1fr;
}
@media (max-width: 768px) {
    .p-single-schedule__item-title {
        column-gap: 1rem;
    }
}
.p-single-schedule__item-title-sub {
    font-size: 2.125rem;
    font-weight: 500;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-schedule__item-title-sub {
        font-size: 1.25rem;
    }
}
.p-single-schedule__item-title-main {
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-schedule__item-title-main {
        font-size: 1.125rem;
    }
}
.p-single-schedule__item-image {
    flex-shrink: 0;
    max-width: 22.5rem;
}
.p-single-message__column {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 768px) {
    .p-single-message__column {
        grid-template-columns: unset;
    }
}
@media (min-width: 769px) {
    .p-single-message__image {
        position: relative;
    }
    .p-single-message__image img {
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }
}
@media (max-width: 768px) {
    .p-single-message__image img {
        aspect-ratio: 8 / 5;
    }
}
.p-single-message__contents {
    display: grid;
    padding: 5rem;
    position: relative;
    row-gap: 1.5rem;
}
@media (max-width: 768px) {
    .p-single-message__contents {
        padding: 2.5rem 1.25rem;
        row-gap: 1.25rem;
    }
}
.p-single-message__contents::before {
    aspect-ratio: 2 / 3;
    background-color: var(--color--main-secondary);
    clip-path: polygon(0 50%, 100% 100%, 100% 0);
    content: '';
    position: absolute;
    right: calc(100% - .0625rem);
    top: 50%;
    translate: 0 -50%;
    width: 2.5rem;
}
@media (max-width: 768px) {
    .p-single-message__contents::before {
        content: none;
    }
}
.p-single-message__contents * {
    color: var(--color--base-primary);
}
.p-single-message__title {
    display: grid;
    row-gap: 1.25rem;
}
@media (max-width: 768px) {
    .p-single-message__title {
        row-gap: 1rem;
    }
}
.p-single-message__title-sub {
    font-family: var(--font-family--en);
    font-size: 1.75rem;
    font-style: italic;
    font-weight: 700;
    line-height: 1.25;
}
@media (max-width: 768px) {
    .p-single-message__title-sub {
        font-size: 1.25rem;
    }
}
.p-single-message__title-main {
    font-size: 2rem;
    font-weight: 700;
}
@media (max-width: 768px) {
    .p-single-message__title-main {
        font-size: 1.125rem;
    }
}
.p-single-message__description {
    line-height: 2.5;
}
@media (max-width: 768px) {
    .p-single-message__description {
        line-height: 2;
    }
}
.p-single-interviews .c-list-interviews__list {
    grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 768px) {
    .p-single-interviews .c-list-interviews__list {
        grid-template-columns: unset;
        row-gap: 1.25rem;
    }
}

/* ========================================
// utility - ユーティリティ
// ======================================== */
/* padding */
.u-pt-0 {
    padding-top: 0 !important;
}
.u-pb-0 {
    padding-bottom: 0 !important;
}

/* margin */
.u-mt-0 {
    margin-top: 0 !important;
}
.u-mb-0 {
    margin-bottom: 0 !important;
}

/* text-align */
.u-text-left {
    text-align: left;
}
.u-text-center {
    text-align: center;
}
@media (min-width: 769px) {
    .u-text-center.is-mobile-only {
        text-align: left;
    }
}
@media (max-width: 768px) {
    .u-text-center.is-desktop-only {
        text-align: left;
    }
}
.u-text-right {
    text-align: right;
}
@media (max-width: 768px) {
    .u-text-right.is-desktop-only {
        text-align: left;
    }
}
@media (min-width: 769px) {
    .u-text-right.is-mobile-only {
        text-align: left;
    }
}

/* align-items */
.u-items-start {
    align-items: flex-start;
    display: flex;
}
.u-items-center {
    align-items: center;
    display: flex;
}
.u-items-end {
    align-items: flex-end;
    display: flex;
}

/* justify-content */
.u-justify-start {
    display: flex;
    justify-content: flex-start;
}
.u-justify-center {
    display: flex;
    justify-content: center;
}
.u-justify-end {
    display: flex;
    justify-content: flex-end;
}

/* object-fit */
.u-object-cover img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

/* wbr */
.u-wbr {
    overflow-wrap: break-word;
    word-break: keep-all;
}

/* wrap */
.u-wrap {
    column-gap: 1em;
    display: flex;
    flex-wrap: wrap;
}

/* hidden */
.u-hidden {
    aspect-ratio: 1;
    border: 0;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: .0625rem;
}
@media (min-width: 769px) {
    .u-desktop-hidden {
        display: none;
    }
}
@media (max-width: 768px) {
    .u-mobile-hidden {
        display: none;
    }
}

/* background */
.u-background-primary {
    background-color: var(--color--base-primary);
}
.u-background-secondary {
    background-color: var(--color--base-secondary);
}
.u-background-tertiary {
    background-color: var(--color--base-tertiary);
}
.u-background-quaternary {
    background-color: var(--color--base-quaternary);
}
.u-background-quinary {
    background-color: var(--color--main-primary);
}
.u-background-senary {
    background-color: var(--color--main-secondary);
}
.u-background-septenary {
    background-color: var(--color--base-quinary);
}
.u-background-logo {
    position: relative;
    z-index: 0;
}
.u-background-logo::before {
    aspect-ratio: 299 / 62;
    background-color: var(--background-logo--color);
    content: '';
    left: 50%;
    mask-image: url('../../assets/images/common/image_logo-background.svg');
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    max-width: 74.75rem;
    position: absolute;
    top: 0;
    translate: -50% 0;
    width: 100%;
    z-index: -1;
}