.u-top-layout__item>:first-child,
.u-top-info__body>:first-child,
.u-top-link-news__content>:first-child {
    margin-block-start: 0 !important
}

.u-top-layout__item>:last-child,
.u-top-info__body>:last-child,
.u-top-link-news__content>:last-child {
    margin-block-end: 0 !important
}

.u-top-heading-level1,
.u-top-main-visual-carousel__button-alt,
.u-top-main-visual__text,
.u-top-main-visual__control-text {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px)
}

.u-top-main-visual__outer {
    display: grid;
    grid-template-columns: 1fr minmax(280px, 1400px) 1fr;
    grid-column: 1/-1
}

.u-top-main-visual-carousel {
    margin-block-start: 40px;
    overflow-x: hidden
}

@media(scripting:none) {
    .u-top-main-visual-carousel {
        overflow: visible
    }
}

.u-top-main-visual-carousel__inner {
    padding-block-end: 2px
}

@media(scripting:none) {
    .u-top-main-visual-carousel__inner {
        overflow: visible
    }
}

@media(scripting:none) {
    .u-top-main-visual-carousel__wrapper {
        display: block
    }
}

.u-top-main-visual-carousel__slide {
    block-size: auto
}

.u-top-main-visual-carousel__slide>:first-child {
    margin-block-start: 0
}

@media(scripting:none) {
    .u-top-main-visual-carousel__slide {
        flex-direction: column
    }
}

.u-top-main-visual-carousel__link {
    outline-offset: -1px
}

.u-top-main-visual-carousel__control {
    display: flex;
    gap: 10px 24px;
    align-items: center;
    justify-content: right;
    padding-inline: 20px;
    margin-block-start: 16px
}

@media(min-width:760px) {
    .u-top-main-visual-carousel__control {
        padding-inline: 60px
    }
}

.u-top-main-visual-carousel__pagination {
    position: relative;
    inset-block-end: unset;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    inline-size: auto
}

.u-top-main-visual-carousel__navigation {
    display: flex;
    gap: 24px;
    justify-content: space-between;
    min-inline-size: 51px
}

@media(scripting:none) {
    .u-top-main-visual-carousel__navigation {
        display: none
    }
}

.u-top-main-visual-carousel__pagination-item {
    --local-color: var(--COLOR_DARK_GRAY);
    inline-size: 16px;
    block-size: 16px;
    overflow: hidden;
    color: transparent;
    background: radial-gradient(circle, var(--local-color) 0 3px, transparent 3px 100%);
    opacity: 1
}

.u-top-main-visual-carousel__pagination-item.swiper-pagination-bullet-active {
    --local-color: var(--COLOR_PRIMARY);
    position: relative;
    border: 1px solid var(--local-color)
}

.u-top-main-visual-carousel__button {
    position: relative;
    inline-size: 8px;
    block-size: 13px
}

.u-top-main-visual-carousel__button:before {
    flex-shrink: 0;
    inline-size: 100%;
    block-size: 100%;
    content: "";
    background-color: var(--COLOR_PRIMARY);
    mask-image: url(/assets/images/common/icon-arrow.svg);
    mask-repeat: no-repeat;
    mask-size: contain
}

.u-top-main-visual-carousel__button.swiper-button-prev:before {
    scale: -1 1
}

.u-top-main-visual-carousel__button.swiper-button-play-pause {
    inline-size: 10px
}

.u-top-main-visual-carousel__button.swiper-button-play-pause.is-playing {
    border-inline: 2px solid var(--COLOR_PRIMARY)
}

.u-top-main-visual-carousel__button.swiper-button-play-pause.is-paused {
    background-color: var(--COLOR_PRIMARY);
    clip-path: polygon(0 0, 0 100%, 100% 50%)
}

.u-top-main-visual-carousel--destroy .u-top-main-visual-carousel__inner {
    inline-size: 100%
}

.u-top-main-visual-carousel--destroy .u-top-main-visual-carousel__control {
    display: none
}

@media(min-width:760px) {
    .u-top-main-visual-carousel--destroy {
        overflow: visible
    }

    .u-top-main-visual-carousel--destroy .u-top-main-visual-carousel__wrapper {
        column-gap: 20px
    }
}

.u-top-main-visual__inner {
    grid-column: 2/3
}

.u-top-main-visual__inner>:first-child {
    margin-block-start: 0
}

.u-top-main-visual__video-item {
    inline-size: 100%
}

.u-top-main-visual__control {
    margin-block-start: 10px;
    margin-inline-start: 20px;
    border: 2px solid var(--COLOR_PRIMARY)
}

.u-top-main-visual__control:before {
    display: block;
    inline-size: 26px;
    block-size: 26px;
    content: "";
    background-image: url(/assets/images/common/icon-pause.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain
}

.u-top-main-visual__control.is-paused:before {
    background-image: url(/assets/images/common/icon-play-arrow.svg)
}

@media(min-width:760px) {
    .u-top-main-visual {
        gap: 0 20px
    }

    .u-top-main-visual__control {
        margin-block-start: 20px;
        margin-inline-start: 40px
    }

    .u-top-main-visual__control:before {
        inline-size: 36px;
        block-size: 36px
    }
}

@media(scripting:none) {
    .u-top-main-visual__control {
        display: none
    }
}

.u-top {
    display: grid;
    grid-area: content;
    grid-template-columns: 1fr minmax(280px, 1280px) 1fr;
    gap: 0 20px
}

.u-top__outer {
    display: grid;
    grid-template-columns: 1fr minmax(280px, 1280px) 1fr;
    grid-column: 1/-1;
    gap: 0 20px
}

.u-top__outer--overflow {
    grid-template-columns: 1fr minmax(280px, 1500px) 1fr
}

.u-top__outer--blue {
    background-color: var(--COLOR_BACKGROUND_LIGHT_BLUE)
}

.u-top__outer--slash-left,
.u-top__outer--slash-right {
    --local-slash-width: 320px;
    position: relative;
    overflow: hidden
}

.u-top__outer--slash-left:before,
.u-top__outer--slash-right:before {
    position: absolute;
    inset-block: 0;
    z-index: var(--Z_INDEX_LOWER_LAYER);
    inline-size: var(--local-slash-width);
    content: "";
    background: var(--COLOR_BACKGROUND_LIGHT_BLUE);
    transform: skew(-27deg)
}

.u-top__outer--slash-left:before {
    inset-inline-start: 85%;
    transform-origin: top right
}

.u-top__outer--slash-right:before {
    inset-inline-start: 100%;
    transform-origin: top left
}

.u-top__outer--slash-right-recruit:before {
    inset-inline-start: 90%;
    transform-origin: top right
}

.u-top__inner {
    grid-column: 2/3;
    padding-block-start: 64px;
    padding-block-end: 64px
}

.u-top__inner:not(.u-top__inner--no-spacing-block)>:first-child {
    margin-block-start: 0
}

.u-top__inner:not(.u-top__inner--no-spacing-block)>:last-child {
    margin-block-end: 0
}

.u-top__inner--no-spacing-block {
    padding-block: 0
}

@media(min-width:760px) {

    .u-top,
    .u-top__outer {
        gap: 0 40px
    }

    .u-top__outer--slash-left:before {
        inset-inline-start: 0;
        transform-origin: bottom left
    }

    .u-top__outer--slash-right:before {
        inset-inline-start: auto;
        inset-inline-end: 0
    }

    .u-top__inner {
        padding-block-start: 120px;
        padding-block-end: 120px
    }

    .u-top__inner--no-spacing-block {
        padding-block: 0
    }
}

.u-top-layout {
    --local-grid-columns: 1;
    display: flex;
    flex-wrap: wrap;
    margin-block-start: var(--MODULE_MARGIN_BASE)
}

.u-top-layout>* {
    flex: 0 0 auto;
    max-inline-size: 100%;
    block-size: 100%
}

.u-top-layout[data-column-sp],
.u-top-layout[data-column-pc] {
    display: grid;
    grid-template-columns: repeat(var(--local-grid-columns), 1fr)
}

@media(max-width:959px) {
    .u-top-layout {
        gap: 24px 16px
    }

    .u-top-layout[data-column-tablet="2"] {
        --local-grid-columns: 2
    }

    .u-top-layout[data-column-tablet="3"] {
        --local-grid-columns: 3
    }

    .u-top-layout[data-column-tablet="4"] {
        --local-grid-columns: 4
    }
}

@media(max-width:759px) {
    .u-top-layout {
        gap: 24px 16px
    }

    .u-top-layout[data-column-sp="1"] {
        --local-grid-columns: 1
    }

    .u-top-layout[data-column-sp="2"] {
        --local-grid-columns: 2
    }

    .u-top-layout[data-column-sp="3"] {
        --local-grid-columns: 3
    }

    .u-top-layout[data-column-sp="4"] {
        --local-grid-columns: 4
    }
}

@media(min-width:960px) {
    .u-top-layout {
        gap: 32px 20px
    }

    .u-top-layout[data-column-pc="2"] {
        --local-grid-columns: 2
    }

    .u-top-layout[data-column-pc="3"] {
        --local-grid-columns: 3
    }

    .u-top-layout[data-column-pc="4"] {
        --local-grid-columns: 4
    }
}

@media(max-width:959px) {
    .u-top-layout+.u-top-layout {
        margin-block-start: 40px
    }

    .u-top-layout--gap-loose-sp {
        row-gap: 40px
    }
}

@media(min-width:960px) {
    .u-top-layout--spacious-pc {
        margin-block-start: 64px
    }
}

.u-top-heading-level2 {
    --local-column-gap: 20px;
    display: flex;
    flex-direction: column;
    gap: 24px 0;
    align-items: start
}

.u-top-heading-level2__title {
    display: flex;
    gap: 0 12px;
    align-items: center;
    font-size: 4rem;
    font-weight: var(--FONT_WEIGHT_BOLD);
    line-height: 1.5;
    color: var(--COLOR_PRIMARY_NAVY)
}

.u-top-heading-level2__title:before {
    display: block;
    flex: 0 0 auto;
    block-size: calc(1lh - 7px);
    aspect-ratio: 43/63;
    content: "";
    background-image: url(/assets/images/icon-heading.svg);
    background-repeat: no-repeat;
    background-size: contain
}

.u-top-heading-level2--small {
    display: block
}

.u-top-heading-level2--small .u-top-heading-level2__title {
    font-size: 2.4rem
}

.u-top-heading-level2--small .u-top-heading-level2__title:before {
    block-size: calc(1lh + 5px)
}

@media(min-width:760px) {
    .u-top-heading-level2 {
        flex-direction: row;
        gap: 0 var(--local-column-gap);
        align-items: center
    }

    .u-top-heading-level2__title {
        flex: 1 0 calc(50% - var(--local-column-gap) / 2);
        gap: 0 24px;
        font-size: 5rem
    }

    .u-top-heading-level2__title:before {
        block-size: calc(1lh - 21px)
    }

    .u-top-heading-level2--small .u-top-heading-level2__title {
        font-size: 3.2rem
    }
}

.u-top-info {
    background-color: var(--COLOR_BASE_LIGHT)
}

.u-top-info__inner {
    padding: 20px
}

.u-top-info__content-inner {
    position: relative;
    padding-block-start: 4px
}

.u-top-info__content-inner:before {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: 64px;
    block-size: 4px;
    content: "";
    background-color: var(--COLOR_PRIMARY)
}

.u-top-info__content-inner:first-child {
    border-block-start: 1px solid var(--COLOR_BORDER)
}

.u-top-info__head {
    padding-block-end: 16px;
    margin-block-start: 40px;
    border-block-end: 1px solid var(--COLOR_BORDER)
}

.u-top-info__title {
    font-size: 2.4rem;
    font-weight: var(--FONT_WEIGHT_BOLD);
    line-height: 1.5;
    color: var(--COLOR_PRIMARY_NAVY)
}

.u-top-info__link {
    --local-link-padding: 40px;
    --local-icon-height: 7px;
    --local-icon-position: 0;
    --local-icon-animation-position: -6px;
    position: relative;
    display: flex;
    padding-inline-start: var(--local-link-padding);
    margin-block-start: 8px
}

.u-top-info__link:before {
    position: absolute;
    inset-block-start: calc((1lh - var(--local-icon-height)) / 2);
    inset-inline-start: var(--local-icon-position);
    inline-size: 30px;
    block-size: var(--local-icon-height);
    overflow-x: clip;
    content: "";
    background-image: url(/assets/images/common/icon-link-arrow.svg);
    background-repeat: no-repeat;
    background-position-x: var(--local-icon-animation-position);
    background-size: contain;
    transition: background-position-x var(--TRANSITION)
}

@media(max-width:959px) {
    .u-top-info__link {
        inline-size: fit-content;
        margin-inline-start: auto
    }
}

@media(min-width:960px) {
    .u-top-info__inner {
        padding: 40px
    }

    .u-top-info__content-inner {
        display: flex
    }

    .u-top-info__head {
        flex: 0 0 25%;
        margin-block-start: 28px
    }

    .u-top-info__body {
        inline-size: 100%
    }

    .u-top-info__link {
        margin-block-start: 24px
    }
}

@media(hover:hover)and (min-width:760px) {

    .u-top-info__link:any-link:hover,
    .u-top-info__link:any-link:focus {
        --local-icon-animation-position: 0
    }
}

.u-top-link-news {
    margin-block-start: var(--MODULE_MARGIN_BASE)
}

:where(.m-widget-tab, .m-widget-tab-filter) .u-top-link-news {
    border-block-start: none
}

.u-top-link-news__item {
    padding-block: 16px;
    border-block-end: 1px solid var(--COLOR_BORDER)
}

.u-top-link-news__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px
}

.u-top-link-news__date {
    color: var(--COLOR_DARK_GRAY)
}

.u-top-link-news__content {
    margin-block-start: 8px
}

@media(max-width:759px) {
    .u-top-link-news__meta {
        flex-direction: column
    }
}

@media(min-width:760px) {
    .u-top-link-news__item {
        padding-block: 24px;
        padding-inline: 24px
    }
}

.u-top-panel {
    --local-box-margin-inline: 20px;
    display: flex;
    flex-direction: column-reverse;
    margin-block-start: var(--MODULE_MARGIN_BASE)
}

.u-top-panel__content {
    --local-icon-height: 7px;
    --local-icon-position: 18px;
    --local-icon-animation-position: -6px;
    position: relative;
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    inline-size: 100%;
    max-inline-size: calc(100% - var(--local-box-margin-inline) * 2);
    padding: 24px 16px 40px;
    margin-block-start: -20px;
    margin-inline: auto;
    background-color: var(--COLOR_BASE_LIGHT);
    box-shadow: 0 -4px 24px rgb(from var(--COLOR_BASE_DARK) r g b/12%);
    transition: box-shadow var(--TRANSITION)
}

.u-top-panel__content:before {
    position: absolute;
    inset-block-end: 24px;
    inset-inline-end: var(--local-icon-position);
    inline-size: 30px;
    block-size: var(--local-icon-height);
    overflow-x: clip;
    content: "";
    background-image: url(/assets/images/common/icon-link-arrow.svg);
    background-repeat: no-repeat;
    background-position-x: var(--local-icon-animation-position);
    background-size: contain;
    transition: background-position-x var(--TRANSITION)
}

@media(hover:hover)and (min-width:760px) {

    .u-top-panel__content:any-link:hover,
    .u-top-panel__content:any-link:focus {
        --local-icon-animation-position: 0;
        box-shadow: none
    }

    .u-top-panel__content:any-link:hover .u-top-panel__text,
    .u-top-panel__content:any-link:focus .u-top-panel__text {
        color: var(--FONT_COLOR_LINK)
    }
}

.u-top-panel__title {
    display: flex;
    gap: 0 12px;
    align-items: center;
    font-size: 2.4rem;
    font-weight: var(--FONT_WEIGHT_BOLD);
    line-height: 1.5;
    color: var(--COLOR_PRIMARY_NAVY)
}

.u-top-panel__title:before {
    display: block;
    flex: 0 0 auto;
    block-size: calc(1lh - 4px);
    aspect-ratio: 43/63;
    content: "";
    background-image: url(/assets/images/icon-heading.svg);
    background-repeat: no-repeat;
    background-size: contain
}

.u-top-panel__text {
    transition: color var(--TRANSITION)
}

.u-top-panel__media {
    block-size: 186px
}

.u-top-panel__media-item {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover
}

@media(max-width:759px) {
    .u-top-panel__text-br {
        display: none
    }
}

@media(min-width:760px) {
    .u-top-panel {
        --local-box-margin-inline: 64px
    }

    .u-top-panel__content {
        --local-icon-position: 24px;
        row-gap: 24px;
        padding: 40px;
        margin-block-start: -64px
    }

    .u-top-panel__title {
        font-size: 3.2rem
    }

    .u-top-panel__media {
        block-size: 354px
    }

    .u-top-panel--shift-media {
        position: relative;
        padding-block-end: 64px
    }

    .u-top-panel--shift-media .u-top-panel__content {
        position: absolute;
        inset-block-end: 0;
        inset-inline-end: 0;
        inline-size: 640px;
        padding: 40px 128px
    }

    .u-top-panel--shift-media .u-top-panel__media {
        padding-inline-end: min(200px, 15%)
    }
}

.u-top-heading-level2+.m-widget-carousel {
    margin-block-start: var(--MODULE_MARGIN_BASE)
}

.u-top-heading-level2+.u-top-layout {
    margin-block-start: var(--MODULE_MARGIN_BASE)
}

@media(max-width:959px) {
    .u-top__inner>.m-layout {
        --local-grid-columns: 1
    }
}