#mv-area {
    --gap: 5vw;
    --full: minmax(var(--gap), 1fr);
    --popout: min(var(--gap));
    --content: min(100% - var(--gap) * 4, 1400px);
    display: grid;
    grid-template-columns: [full-start] var(--full) [popout-start] var(--popout) [content-start] var(--content) [content-end] var(--popout) [popout-end] var(--full) [full-end];
    row-gap: unset;
    position: relative;
    row-gap: calc(clamp(1.875rem, 1.563rem + 1.33vw, 3.163rem)*1.5)
}

#mv-area>* {
    grid-column: content
}

#mv-area>*[data-w=full] {
    grid-column: full
}

#mv-area>*[data-w=popout] {
    grid-column: popout
}

#mv-area *[hide] {
    position: absolute;
    height: 0;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
}

#mv-area .blk_ank {
    grid-column: full;
    margin-top: -2em;
    padding: 2em 0
}

#mv-area .blk_ank .list {
    display: flex;
    background: #232629;
    border-radius: calc(clamp(1rem, .909rem + .39vw, 1.375rem)*1.5*2.2/2);
    margin: 0 5vw;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    box-shadow: 0 0 30px -10px rgba(35, 38, 41, .5)
}

#mv-area .blk_ank a {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5em;
    color: #fff;
    background: #232629;
    font-size: clamp(1rem, .909rem + .39vw, 1.375rem);
    border-radius: 300px;
    padding: .6em .96em;
    min-width: 100px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

#mv-area .blk_ank a .icon {
    width: .6em
}

#mv-area .blk_ank a .icon svg {
    fill: #fff;
    transform: rotate(180deg)
}

@media(hover: hover) {
    #mv-area .blk_ank a {
        transition-property: opacity;
        transition-duration: .5s;
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }

    #mv-area .blk_ank a:hover {
        opacity: .6
    }

    #mv-area .blk_ank a:hover .icon svg {
        -webkit-animation: hover-icon-down 1s cubic-bezier(0.215, 0.61, 0.355, 1);
        animation: hover-icon-down 1s cubic-bezier(0.215, 0.61, 0.355, 1)
    }
}

#mv-area .blk_ank[data-no-swipe] .list {
    margin: 0 auto
}

#mv-area .blk_ank[data-swipe] {
    overflow-x: auto
}

#mv-area .blk_ank[data-swipe] .list {
    flex-wrap: wrap
}

@media screen and (min-width: 750px) {
    #mv-area .blk_ank {
        grid-column: content;
        overflow-x: unset;
        margin: 0;
        padding: 0
    }

    #mv-area .blk_ank .list {
        flex-wrap: wrap;
        justify-content: center;
        margin: 0;
        width: 100%
    }
}

#mv-area .blk_bg {
    grid-column: full;
    position: absolute;
    top: 0;
    z-index: -1;
    width: 100%;
    height: 80lvh;
    -webkit-clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%);
    clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%)
}

#mv-area .blk_bg img {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    transition-property: transform;
    transition-duration: 1s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}

#mv-area .blk_date {
    font-family: Outfit, sans-serif;
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem)
}

#mv-area[data-type=typeA] {
    position: relative;
    padding: min(50vmin, 300px) 0;
    padding-top: min(min(50vmin, 300px)*1.3, 300px)
}

#mv-area[data-type=typeA] .hl {
    text-align: left
}

#mv-area[data-type=typeA] .blk_text br {
    display: none
}

#mv-area[data-type=typeA] .blk_bg {
    display: none
}

@media screen and (min-width: 750px) {
    #mv-area[data-type=typeA] .hl {
        text-align: center
    }

    #mv-area[data-type=typeA] .blk_text {
        text-align: center
    }

    #mv-area[data-type=typeA] .blk_text br {
        display: block
    }
}

#mv-area[data-type=typeA]::before {
    position: absolute;
    z-index: -1;
    content: "";
    display: inline-block;
    width: 100%;
    height: calc(min(50vmin, 300px)*1.4);
    background: #f8f8f8;
    -webkit-clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%);
    clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%)
}

#mv-area[data-type=typeA] .blk_ank {
    display: none
}

#mv-area[data-type=typeA] .blk_text {
    display: none
}

#mv-area[data-type=typeB] {
    position: relative;
    padding: min(50vmin, 300px) 0;
    padding-top: min(min(50vmin, 300px)*1.3, 300px)
}

#mv-area[data-type=typeB] .hl {
    text-align: left
}

#mv-area[data-type=typeB] .blk_text br {
    display: none
}

#mv-area[data-type=typeB] .blk_bg {
    display: none
}

@media screen and (min-width: 750px) {
    #mv-area[data-type=typeB] .hl {
        text-align: center
    }

    #mv-area[data-type=typeB] .blk_text {
        text-align: center
    }

    #mv-area[data-type=typeB] .blk_text br {
        display: block
    }
}

#mv-area[data-type=typeB]::before {
    position: absolute;
    z-index: -1;
    content: "";
    display: inline-block;
    width: 100%;
    height: calc(min(50vmin, 300px)*1.4);
    background: #f8f8f8;
    -webkit-clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%);
    clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%)
}

#mv-area[data-type=typeB] .blk_text {
    display: none
}

#mv-area[data-type=typeC] {
    position: relative;
    padding: min(50vmin, 300px) 0;
    padding-top: min(min(50vmin, 300px)*1.3, 300px)
}

#mv-area[data-type=typeC] .hl {
    text-align: left
}

#mv-area[data-type=typeC] .blk_text br {
    display: none
}

#mv-area[data-type=typeC] .blk_bg {
    display: none
}

@media screen and (min-width: 750px) {
    #mv-area[data-type=typeC] .hl {
        text-align: center
    }

    #mv-area[data-type=typeC] .blk_text {
        text-align: center
    }

    #mv-area[data-type=typeC] .blk_text br {
        display: block
    }
}

#mv-area[data-type=typeC]::before {
    position: absolute;
    z-index: -1;
    content: "";
    display: inline-block;
    width: 100%;
    height: calc(min(50vmin, 300px)*1.4);
    background: #f8f8f8;
    -webkit-clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%);
    clip-path: polygon(0 0, 100vw 0, 100vw calc(100% - 9vw), 0 100%)
}

#mv-area[data-type=typeC] .blk_ank {
    display: none
}

#mv-area[data-type=typeD] {
    position: relative;
    padding: min(50vmin, 300px) 0
}

#mv-area[data-type=typeD] .hl {
    text-align: left
}

#mv-area[data-type=typeD] .blk_text br {
    display: none
}

#mv-area[data-type=typeD] .blk_bg {
    display: none
}

@media screen and (min-width: 750px) {
    #mv-area[data-type=typeD] .hl {
        text-align: center
    }

    #mv-area[data-type=typeD] .blk_text {
        text-align: center
    }

    #mv-area[data-type=typeD] .blk_text br {
        display: block
    }
}

#mv-area[data-type=typeD] .blk_ank {
    display: none
}

#mv-area[data-type=typeD] .blk_bg {
    display: block
}

#mv-area[data-type=typeD] .hl {
    display: flex;
    flex-wrap: wrap;
    font-size: clamp(3.375rem, 2.601rem + 3.3vw, 6.563rem);
    text-align: unset;
    line-height: 1.4;
    margin-bottom: 1.5em;
    transform: skewY(-5deg)
}

#mv-area[data-type=typeD] .hl>* {
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
    background: #fff;
    margin-top: -1px;
    margin-left: -1px
}

#mv-area[data-type=typeD] .blk_text {
    text-align: unset
}

#mv-area[data-type=typeD] .blk_text span {
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background: #fff
}

@media screen and (min-width: 750px) {
    #mv-area[data-type=typeD] {
        --w: 8em
    }

    #mv-area[data-type=typeD] .hl {
        width: var(--w)
    }
}

@media screen and (min-width: 1280px) {
    #mv-area[data-type=typeD] .blk_text {
        width: 65%
    }
}

#mv-area[data-type=typeE] {
    position: relative;
    padding: min(50vmin, 300px) 0;
    color: #fff
}

#mv-area[data-type=typeE] .hl {
    text-align: left
}

#mv-area[data-type=typeE] .blk_text br {
    display: none
}

#mv-area[data-type=typeE] .blk_bg {
    display: none
}

@media screen and (min-width: 750px) {
    #mv-area[data-type=typeE] .hl {
        text-align: center
    }

    #mv-area[data-type=typeE] .blk_text {
        text-align: center
    }

    #mv-area[data-type=typeE] .blk_text br {
        display: block
    }
}

#mv-area[data-type=typeE]::before {
    position: fixed;
    top: 0;
    z-index: -1;
    content: "";
    display: inline-block;
    width: 100%;
    height: 100svh;
    /** background: url(../../assets/img/common/mesh04@2x.webp) no-repeat bottom/cover, #fff */
    background: url(../../recruitment/img/common/mesh04@2x.webp) no-repeat center/cover, #fff ;
}

#mv-area[data-type=typeE] .blk_ank {
    display: none
}

#mv-area[data-type=typeE] .hl {
    display: flex;
    flex-wrap: wrap;
    text-align: unset;
    line-height: 1;
    margin-bottom: 1.5em;
    transform: skewY(-5deg)
}

#mv-area[data-type=typeE] .hl>* {
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%)
}

#mv-area[data-type=typeE] .blk_text {
    text-align: unset
}

#mv-area[data-type=typeE] .blk_staff .text {
    padding: 0
}

#mv-area[data-type=typeE] .blk_staff .text .year {
    font-size: clamp(1rem, .909rem + .39vw, 1.375rem)
}

#mv-area[data-type=typeE] .blk_staff .text .grad {
    font-size: clamp(1rem, .909rem + .39vw, 1.375rem)
}

#mv-area[data-type=typeE] .blk_staff .text::before {
    display: none
}

#mv-area[data-type=typeE] .blk_bg_text {
    grid-column: full;
    align-self: center;
    position: absolute;
    color: #000;
    font-family: Outfit, sans-serif;
    font-weight: 600;
    font-size: clamp(7.5rem, 4.25rem + 16.25vw, 23.75rem);
    line-height: .8;
    text-transform: uppercase;
    word-break: break-all;
    mix-blend-mode: overlay;
    transform: translate3d(0, 0, 0);
    opacity: .3;
    overflow: hidden;
    pointer-events: none
}

@media screen and (min-width: 750px) {
    #mv-area[data-type=typeE] .hl {
        width: 10em
    }
}

#contents-area {
    --gap: 5vw;
    --full: minmax(var(--gap), 1fr);
    --popout: min(var(--gap));
    --content: min(100% - var(--gap) * 4, 1400px);
    display: grid;
    grid-template-columns: [full-start] var(--full) [popout-start] var(--popout) [content-start] var(--content) [content-end] var(--popout) [popout-end] var(--full) [full-end];
    row-gap: min(50vmin, 300px)
}

#contents-area>* {
    grid-column: content
}

#contents-area>*[data-w=full] {
    grid-column: full
}

#contents-area>*[data-w=popout] {
    grid-column: popout
}

#child-nav-area {
    --gap: 5vw;
    --full: minmax(var(--gap), 1fr);
    --popout: min(var(--gap));
    --content: min(100% - var(--gap) * 4, 1400px);
    display: grid;
    grid-template-columns: [full-start] var(--full) [popout-start] var(--popout) [content-start] var(--content) [content-end] var(--popout) [popout-end] var(--full) [full-end];
    row-gap: min(8vmin, 50px);
    margin-top: min(30vmin, 200px)
}

#child-nav-area>* {
    grid-column: content
}

#child-nav-area>*[data-w=full] {
    grid-column: full
}

#child-nav-area>*[data-w=popout] {
    grid-column: popout
}

@media(orientation: landscape) {
    #child-nav-area {
        margin-top: min(50vmin, 300px)
    }
}

.child-nav_wrap {
    display: grid;
    row-gap: min(8vmin, 50px);
    display: grid
}

@media screen and (min-width: 1024px) {
    .child-nav_wrap {
        grid-template-columns: repeat(3, 1fr);
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .child-nav_wrap>*[data-w="1fr"] {
        grid-column: 1
    }

    .child-nav_wrap>*[data-w="2fr"] {
        grid-column: 2/4
    }
}

.child-nav_wrap .title {
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(2.25rem, 1.886rem + 1.55vw, 3.75rem);
    color: #d40011;
    line-height: 1
}

.child-nav_wrap .list {
    justify-self: end
}

.child-nav_wrap .list .btn_arrow {
    width: 100%;
    padding: 1em
}

.child-nav_wrap .list li[current] .btn_arrow {
    color: #d40011
}

.child-nav_wrap .list li[current] .btn_arrow .svg_arrow {
    stroke: #d40011
}

@media screen and (min-width: 1024px) {
    .child-nav_wrap .list {
        justify-self: unset;
        display: grid;
        grid-template-columns: repeat(2, 1fr)
    }

    .child-nav_wrap .list .btn_arrow {
        padding: 1.4em 1.96em
    }
}

.section_number {
    display: grid;
    row-gap: 1px;
    background: #000;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000
}

.section_number .con[data-size=s] {
    display: grid;
    position: relative;
    grid-template-rows: auto auto 1fr;
    background: #fff;
    padding: min(8vmin, 50px) 0
}

.section_number .con[data-size=s] .num {
    font-family: Outfit, sans-serif
}

.section_number .con[data-size=s] .image img {
    margin: 0 auto
}

.section_number .con[data-size=s]>*:not(.image) {
    z-index: 1
}

.section_number .con[data-size=s] .title {
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.5rem, 1.257rem + 1.04vw, 2.5rem);
    line-height: 1
}

.section_number .con[data-size=s] .num {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: clamp(6.25rem, 5.431rem + 3.5vw, 9.625rem);
    line-height: 1
}

.section_number .con[data-size=s] .num::before, .section_number .con[data-size=s] .num::after {
    content: "";
    display: inline-block;
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.875rem, 1.563rem + 1.33vw, 3.163rem);
    transform: translateY(-0.3em)
}

.section_number .con[data-size=s] .num::before {
    content: attr(data-before)
}

.section_number .con[data-size=s] .num::after {
    content: attr(data-after);
    writing-mode: vertical-rl
}

.section_number .con[data-size=s] .image {
    position: absolute;
    right: 0;
    top: 0;
    width: min(50%, 260px);
    height: 100%;
    opacity: .5
}

.section_number .con[data-size=s] .num {
    margin-top: 1.5rem
}

.section_number .con[data-size=s] .detail {
    font-size: clamp(.875rem, .82rem + .23vw, 1.1rem)
}

.section_number .con[data-size=m] {
    display: grid;
    position: relative;
    grid-template-rows: auto auto 1fr;
    background: #fff;
    padding: min(8vmin, 50px) 0
}

.section_number .con[data-size=m] .num {
    font-family: Outfit, sans-serif
}

.section_number .con[data-size=m] .image img {
    margin: 0 auto
}

.section_number .con[data-size=m]>*:not(.image) {
    z-index: 1
}

.section_number .con[data-size=m] .title {
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.5rem, 1.257rem + 1.04vw, 2.5rem);
    line-height: 1
}

.section_number .con[data-size=m] .num {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: clamp(6.25rem, 5.431rem + 3.5vw, 9.625rem);
    line-height: 1
}

.section_number .con[data-size=m] .num::before, .section_number .con[data-size=m] .num::after {
    content: "";
    display: inline-block;
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.875rem, 1.563rem + 1.33vw, 3.163rem);
    transform: translateY(-0.3em)
}

.section_number .con[data-size=m] .num::before {
    content: attr(data-before)
}

.section_number .con[data-size=m] .num::after {
    content: attr(data-after);
    writing-mode: vertical-rl
}

.section_number .con[data-size=m] .image {
    position: absolute;
    right: 0;
    top: 0;
    width: min(50%, 260px);
    height: 100%;
    opacity: .5
}

.section_number .con[data-size=m] .num {
    margin-top: 1.5rem
}

.section_number .con[data-size=m] .detail {
    font-size: clamp(.875rem, .82rem + .23vw, 1.1rem)
}

@media screen and (min-width: 750px) {
    .section_number .con[data-size=m] {
        grid-template-columns: auto 1fr
    }

    .section_number .con[data-size=m] .title {
        grid-column: 1;
        grid-row: 1
    }

    .section_number .con[data-size=m] .num {
        grid-column: 1/3;
        grid-row: 1
    }

    .section_number .con[data-size=m] .detail {
        grid-column: 1/3;
        grid-row: 2
    }
}

.section_number .con[data-size=l] {
    display: grid;
    position: relative;
    grid-template-rows: auto auto 1fr;
    background: #fff;
    padding: min(8vmin, 50px) 0;
    row-gap: 1em
}

.section_number .con[data-size=l] .num {
    font-family: Outfit, sans-serif
}

.section_number .con[data-size=l] .image img {
    margin: 0 auto
}

.section_number .con[data-size=l]>*:not(.image) {
    z-index: 1
}

.section_number .con[data-size=l] .title {
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.5rem, 1.257rem + 1.04vw, 2.5rem);
    line-height: 1
}

.section_number .con[data-size=l] .num {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: clamp(6.25rem, 5.431rem + 3.5vw, 9.625rem);
    line-height: 1
}

.section_number .con[data-size=l] .num::before, .section_number .con[data-size=l] .num::after {
    content: "";
    display: inline-block;
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.875rem, 1.563rem + 1.33vw, 3.163rem);
    transform: translateY(-0.3em)
}

.section_number .con[data-size=l] .num::before {
    content: attr(data-before)
}

.section_number .con[data-size=l] .num::after {
    content: attr(data-after);
    writing-mode: vertical-rl
}

.section_number .con[data-size=l] .title {
    font-size: clamp(1.875rem, 1.563rem + 1.33vw, 3.163rem);
    text-align: center
}

.section_number .con[data-size=l] .image {
    opacity: .8
}

.section_number .con[data-size=l] .num {
    justify-content: center;
    margin-top: -0.5em
}

.section_number .con[data-size=l] .detail {
    font-size: clamp(1rem, .909rem + .39vw, 1.375rem)
}

@media screen and (min-width: 750px) {
    .section_number .con[data-size=l] {
        grid-template-columns: 1fr min(50%, 500px);
        -moz-column-gap: 5%;
        column-gap: 5%;
        row-gap: 0
    }

    .section_number .con[data-size=l] .title {
        grid-column: 1;
        grid-row: 1;
        align-self: end;
        text-align: unset;
        margin-bottom: 1em
    }

    .section_number .con[data-size=l] .image {
        grid-column: 2;
        grid-row: 1/3;
        justify-self: center
    }

    .section_number .con[data-size=l] .num {
        grid-column: 2;
        grid-row: 3
    }

    .section_number .con[data-size=l] .detail {
        grid-column: 1;
        grid-row: 2
    }
}

.section_number .num {
    overflow: hidden
}

.section_number .num span {
    transform: translateY(100%)
}

.section_number .num span[show] {
    transition-property: transform;
    transition-duration: .5s;
    transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
    transform: translateY(0)
}

@media(orientation: landscape) {
    .section_number {
        grid-template-columns: repeat(6, 1fr);
        grid-auto-flow: dense;
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .section_number .con[data-size=s] {
        grid-column-end: span 2
    }

    .section_number .con[data-size=s]+*[data-size=s]::before {
        position: absolute;
        content: "";
        display: inline-block;
        width: calc(min(80vw, 1400px)*.05*1 + 2px);
        height: 100%;
        background: #fff;
        transform: translateX(calc(-100% + 1px))
    }

    .section_number .con[data-size=m] {
        grid-column-end: span 3
    }

    .section_number .con[data-size=m]+*[data-size=m]::before {
        position: absolute;
        content: "";
        display: inline-block;
        width: calc(min(80vw, 1400px)*.05*1 + 2px);
        height: 100%;
        background: #fff;
        transform: translateX(calc(-100% + 1px))
    }

    .section_number .con[data-size=l] {
        grid-column-end: span 6
    }
}

.section_hl-circle_list {
    display: grid;
    row-gap: min(13vmin, 100px)
}

.section_hl-circle_list .set {
    display: grid;
    row-gap: min(8vmin, 50px);
    align-items: center
}

@media screen and (min-width: 1024px) {
    .section_hl-circle_list .set {
        grid-template-columns: repeat(3, 1fr);
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .section_hl-circle_list .set>*[data-w="1fr"] {
        grid-column: 1
    }

    .section_hl-circle_list .set>*[data-w="2fr"] {
        grid-column: 2/4
    }
}

.section_hl-circle_list .set .blk_hl {
    width: clamp(200px, 80%, 360px)
}

.section_hl-circle_list .set .hl {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto
}

@media screen and (min-width: 1024px) {
    .section_hl-circle_list .set .hl[data-type=catch] {
        margin: unset;
        transform: skewY(-5deg) translateY(-15%)
    }
}

.section_factory {
    display: grid;
    gap: min(13vmin, 100px)
}

.section_factory .con {
    display: grid;
    position: relative;
    gap: 1em
}

.section_factory .con .num {
    font-family: Outfit, sans-serif
}

.section_factory .con .image img {
    margin: 0 auto
}

.section_factory .con .title {
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem)
}

[data-container=factory] {
    container-type: inline-size
}

@container (min-width: 600px) {
    [data-container=factory]>.section_factory {
        grid-template-columns: repeat(2, 1fr);
        -moz-column-gap: 5%;
        column-gap: 5%
    }
}

body[data-page=interview] #mv-area[data-type=typeE] {
    --gap: 5vw;
    --full: minmax(var(--gap), 1fr);
    --popout: min(var(--gap));
    --content: min(100% - var(--gap) * 4, 1400px);
    --space: min(var(--content) * 0.05);
    --div: min(var(--content) * 0.9 / 3);
    --two: min(calc(var(--div) * 2 + var(--space)));
    --one: min((var(--div)));
    display: grid;
    grid-template-columns: [full-start] var(--full) [popout-start] var(--popout) [two-start] var(--two) [two-end] var(--space) [one-start] var(--one) [one-end] var(--popout) [popout-end] var(--full) [full-end]
}

body[data-page=interview] #mv-area[data-type=typeE]>* {
    grid-column: two/one
}

body[data-page=interview] #mv-area[data-type=typeE] .blk_bg_text {
    grid-column: full
}

body[data-page=interview] #mv-area[data-type=typeE][bghide]::before {
    opacity: 0
}

@media screen and (min-width: 1280px) {
    body[data-page=interview] #mv-area[data-type=typeE] .hl {
        grid-column: two
    }

    body[data-page=interview] #mv-area[data-type=typeE] .blk_text {
        grid-column: two
    }
}

body[data-page=interview] .blk_interview {
    --gap: 5vw;
    --full: minmax(var(--gap), 1fr);
    --popout: min(var(--gap));
    --content: min(100% - var(--gap) * 4, 1400px);
    --space: min(var(--content) * 0.05);
    --div: min(var(--content) * 0.9 / 3);
    --two: min(calc(var(--div) * 2 + var(--space)));
    --one: min((var(--div)));
    display: grid;
    grid-template-columns: [full-start] var(--full) [popout-start] var(--popout) [two-start] var(--two) [two-end] var(--space) [one-start] var(--one) [one-end] var(--popout) [popout-end] var(--full) [full-end]
}

body[data-page=interview] .blk_interview>* {
    grid-column: two/one
}

body[data-page=interview] .blk_interview>* {
    grid-column: popout
}

body[data-page=interview] .blk_interview>.image[hide] {
    opacity: 0
}

body[data-page=interview] .blk_interview>.detail {
    background: #fff
}

body[data-page=interview] .blk_interview>.detail>* {
    padding: min(30vmin, 200px) 10%
}

body[data-page=interview] .blk_interview>.detail>*:first-child {
    padding-bottom: 0
}

body[data-page=interview] .blk_interview>.detail>*:last-child {
    padding: 0
}

body[data-page=interview] .blk_interview>.detail .private {
    background: #f8f8f8;
    padding-bottom: calc(min(30vmin, 200px)*1.2);
    -webkit-clip-path: polygon(0 8.1vw, 90vw 0, 90vw calc(100% - 8.1vw), 0 100%);
    clip-path: polygon(0 8.1vw, 90vw 0, 90vw calc(100% - 8.1vw), 0 100%)
}

body[data-page=interview] .blk_interview>.detail .private .blk_text {
    font-size: clamp(.875rem, .82rem + .23vw, 1.1rem)
}

body[data-page=interview] .blk_interview>.detail .private .image {
    margin-left: auto;
    width: min(100%, 300px)
}

body[data-page=interview] .blk_interview>.detail .private .image img {
    width: auto
}

body[data-page=interview] .blk_interview>.detail .message {
    position: relative
}

body[data-page=interview] .blk_interview>.detail .message::before {
    position: absolute;
    left: 50%;
    top: 0;
    content: "";
    display: inline-block;
    width: 10em;
    aspect-ratio: 1/1;
    background: url(../../assets/img/staff/text_message.svg) no-repeat center;
    transform: translate(-50%, -60%);
    -webkit-animation: rotate-message 6s linear infinite;
    animation: rotate-message 6s linear infinite
}

@-webkit-keyframes rotate-message {
    0% {
        transform: translate(-50%, -60%) rotate(0)
    }

    100% {
        transform: translate(-50%, -60%) rotate(360deg)
    }
}

@keyframes rotate-message {
    0% {
        transform: translate(-50%, -60%) rotate(0)
    }

    100% {
        transform: translate(-50%, -60%) rotate(360deg)
    }
}

@media screen and (min-width: 1280px) {
    body[data-page=interview] .blk_interview {
        background: none
    }

    body[data-page=interview] .blk_interview>* {
        grid-column: two
    }

    body[data-page=interview] .blk_interview>.image {
        position: fixed;
        top: 0;
        right: 0;
        --gap: 5vw;
        --full: minmax(var(--gap), 1fr);
        --popout: min(var(--gap));
        --content: min(100% - var(--gap) * 4, 1400px);
        --space: min(var(--content) * 0.05);
        --div: min(var(--content) * 0.9 / 3);
        --two: min(calc(var(--div) * 2 + var(--space)));
        --one: min((var(--div)));
        display: grid;
        grid-template-columns: [full-start] var(--full) [popout-start] var(--popout) [two-start] var(--two) [two-end] var(--space) [one-start] var(--one) [one-end] var(--popout) [popout-end] var(--full) [full-end];
        height: 100vh;
        pointer-events: none
    }

    body[data-page=interview] .blk_interview>.image>* {
        grid-column: two/one
    }

    body[data-page=interview] .blk_interview>.image>* {
        grid-column: one/full
    }

    body[data-page=interview] .blk_interview>.detail .private {
        -webkit-clip-path: polygon(0 calc((min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) * 0.09), calc(min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) 0, calc(min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) calc(100% - (min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) * 0.09), 0 100%);
        clip-path: polygon(0 calc((min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) * 0.09), calc(min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) 0, calc(min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) calc(100% - (min(80vw, 1400px) * 0.9 / 3 * 2 + min(80vw, 1400px) * 0.05) * 0.09), 0 100%)
    }

    body[data-page=interview] .blk_interview>.detail .message+* {
        display: none
    }
}

body[data-page=interview] .blk_staff_wrap {
    --gap: 5vw;
    --full: minmax(var(--gap), 1fr);
    --popout: min(var(--gap));
    --content: min(100% - var(--gap) * 4, 1400px);
    display: grid;
    grid-template-columns: [full-start] var(--full) [popout-start] var(--popout) [content-start] var(--content) [content-end] var(--popout) [popout-end] var(--full) [full-end];
    row-gap: unset;
    background: #fff;
    z-index: 1;
    padding-top: min(30vmin, 200px);
    padding-bottom: min(13vmin, 100px)
}

body[data-page=interview] .blk_staff_wrap>* {
    grid-column: content
}

body[data-page=interview] .blk_staff_wrap>*[data-w=full] {
    grid-column: full
}

body[data-page=interview] .blk_staff_wrap>*[data-w=popout] {
    grid-column: popout
}

@media(orientation: landscape) {
    body[data-page=interview] .blk_staff_wrap {
        padding-bottom: min(30vmin, 200px)
    }
}

body[data-page=interview] footer {
    margin-top: 0
}

footer[data-page=interview] .footer_bg {
    display: none
}

.section_works {
    display: flex;
    flex-direction: column;
    gap: min(30vmin, 200px)
}

.section_works .con {
    display: grid;
    position: relative;
    gap: min(8vmin, 50px)
}

.section_works .con .num {
    font-family: Outfit, sans-serif
}

.section_works .con .image img {
    margin: 0 auto
}

.section_works .con .image {
    -webkit-clip-path: polygon(0 8.1vw, 90vw 0, 90vw calc(100% - 8.1vw), 0 100%);
    clip-path: polygon(0 8.1vw, 90vw 0, 90vw calc(100% - 8.1vw), 0 100%)
}

.section_works .con .image .img_wrap {
    aspect-ratio: 1/1
}

@media screen and (min-width: 750px) {
    .section_works .con {
        grid-template-columns: repeat(2, 1fr);
        align-items: center
    }

    .section_works .con .image {
        -webkit-clip-path: polygon(0 calc(min(80vw, 1400px) * 0.95 / 2 * 0.09), calc(min(80vw, 1400px) * 0.95 / 2) 0, calc(min(80vw, 1400px) * 0.95 / 2) calc(100% - min(80vw, 1400px) * 0.95 / 2 * 0.09), 0 100%);
        clip-path: polygon(0 calc(min(80vw, 1400px) * 0.95 / 2 * 0.09), calc(min(80vw, 1400px) * 0.95 / 2) 0, calc(min(80vw, 1400px) * 0.95 / 2) calc(100% - min(80vw, 1400px) * 0.95 / 2 * 0.09), 0 100%)
    }
}

@media screen and (min-width: 1280px)and (orientation: landscape) {
    .section_works {
        gap: 0
    }

    .section_works .con {
        height: 150vh
    }

    .section_works .con .image {
        position: -webkit-sticky;
        position: sticky;
        top: 50%;
        transform: translateY(-50%);
        opacity: 0;
        transition-property: opacity;
        transition-duration: .5s;
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }

    .section_works .con .text {
        grid-column: 2
    }

    .section_works .con[show] .image {
        opacity: 1
    }
}

.section_before-after>.title {
    display: grid;
    row-gap: min(8vmin, 50px);
    align-items: center;
    z-index: 1
}

.section_before-after>.title .hl {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto
}

@media screen and (min-width: 1024px) {
    .section_before-after>.title {
        grid-template-columns: auto 1fr;
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .section_before-after>.title .blk_hl {
        background: #fff
    }

    .section_before-after>.title .hl[data-type=catch] {
        margin: unset;
        transform: skewY(-5deg) translateY(-15%)
    }

    .section_before-after>.title+* {
        margin-top: calc(min(13vmin, 100px)*1.2*-1)
    }
}

.section_before-after>.list {
    border-bottom: 1px solid #000;
    display: grid;
    gap: 0 calc(1.125rem + 6px + 2rem);
    align-items: center;
    padding-bottom: 1.5rem
}

.section_before-after>.list .line {
    grid-column: 1/3;
    background: #000;
    height: 1px
}

.section_before-after>.list .line:not(:first-child) {
    margin-top: 1.5rem
}

.section_before-after>.list .title {
    grid-column: 1/3;
    padding: .5rem 0
}

.section_before-after>.list *[data-attr] {
    font-family: Outfit, sans-serif;
    font-weight: 700;
    line-height: 1
}

.section_before-after>.list *[data-attr]::after {
    content: "";
    display: inline-block;
    content: attr(data-attr);
    font-family: YakuHanJP_Noto, Noto Sans JP, sans-serif;
    font-size: clamp(1rem, .909rem + .39vw, 1.375rem);
    font-weight: normal
}

.section_before-after>.list *[data-w="2fr"] {
    grid-column: 1/3;
    justify-self: center
}

.section_before-after>.list .before {
    justify-self: end
}

.section_before-after>.list .before[data-attr] {
    font-size: clamp(1.5rem, 1.257rem + 1.04vw, 2.5rem)
}

.section_before-after>.list .after {
    position: relative;
    color: #d40011
}

.section_before-after>.list .after .icon {
    display: grid;
    gap: 3px;
    position: absolute;
    top: 50%;
    left: calc((1.125rem + 6px + 2rem)*-1*.5);
    transform: translate(-50%, -50%) rotate(90deg)
}

.section_before-after>.list .after .icon .svg_triangle {
    width: .6rem;
    fill: #d40011
}

.section_before-after>.list .after[data-attr] {
    font-size: clamp(1.875rem, 1.563rem + 1.33vw, 3.163rem)
}

.section_before-after>.list .after[data-w="2fr"] {
    margin-top: calc(1.125rem + 6px + 2rem)
}

.section_before-after>.list .after[data-w="2fr"] .icon {
    top: calc((1.125rem + 6px + 2rem)*-1*.5);
    left: 50%;
    transform: translate(-50%, -50%) rotate(180deg)
}

@media screen and (min-width: 1024px) {
    .section_before-after>.list {
        gap: 0 calc(1.125rem + 6px + 4rem);
        grid-template-columns: 1fr auto auto auto 1fr
    }

    .section_before-after>.list .line {
        grid-column: 1/6
    }

    .section_before-after>.list .line:first-child {
        margin-bottom: 1.5rem
    }

    .section_before-after>.list .line:not(:first-child) {
        margin-bottom: 1.5rem
    }

    .section_before-after>.list .title {
        grid-column: 2
    }

    .section_before-after>.list .before {
        grid-column: 3;
        justify-self: unset
    }

    .section_before-after>.list .after {
        grid-column: 4
    }

    .section_before-after>.list .after .icon {
        left: calc((1.125rem + 6px + 4rem)*-1*.5)
    }

    .section_before-after>.list .after[data-w="2fr"] {
        margin-top: 0
    }

    .section_before-after>.list .after[data-w="2fr"] .icon {
        top: 50%;
        left: calc((1.125rem + 6px + 4rem)*-1*.5);
        transform: translate(-50%, -50%) rotate(90deg)
    }
}

.section_oneday>.title {
    display: grid;
    row-gap: min(8vmin, 50px);
    align-items: center;
    z-index: 1
}

@media screen and (min-width: 750px) {
    .section_oneday>.title {
        grid-template-columns: auto 1fr;
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .section_oneday>.title+* {
        margin-top: calc(min(13vmin, 100px)*1.2*-1)
    }
}

.section_oneday .blk_scroll {
    background: #f8f8f8
}

.section_oneday .blk_scroll .wrap {
    position: relative
}

.section_oneday .blk_scroll .wrap::before {
    position: absolute;
    top: calc(clamp(1.25rem, 1.086rem + .7vw, 1.925rem)*1.5 + 5px - 1px);
    content: "";
    display: inline-block;
    width: 100%;
    height: 2px;
    background: #e1e1e1
}

.section_oneday .blk_scroll .con {
    display: grid;
    position: relative;
    grid-template-rows: auto auto 1fr;
    justify-items: center;
    width: min(60vw, 300px)
}

.section_oneday .blk_scroll .con .num {
    font-family: Outfit, sans-serif
}

.section_oneday .blk_scroll .con .image img {
    margin: 0 auto
}

.section_oneday .blk_scroll .con .time {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5em;
    color: #d40011;
    font-family: Outfit, sans-serif;
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem);
    line-height: 1
}

.section_oneday .blk_scroll .con .time::after {
    content: "";
    display: inline-block;
    width: 10px;
    aspect-ratio: 1/1;
    border-radius: 10px;
    background: #d40011
}

.section_oneday .blk_scroll .con .title {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 3;
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem)
}

.section_oneday .blk_scroll .con .title::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 2rem;
    background: url(../../assets/img/common/ptn_dotted.svg) repeat-y center
}

.section_oneday>.balloon {
    display: grid
}

@media screen and (min-width: 750px) {
    .section_oneday>.balloon {
        grid-template-columns: repeat(3, 1fr);
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .section_oneday>.balloon>*[data-w="1fr"] {
        grid-column: 1
    }

    .section_oneday>.balloon>*[data-w="2fr"] {
        grid-column: 2/4
    }
}

@media screen and (min-width: 750px) {
    .section_oneday>.balloon {
        margin-top: calc(min(13vmin, 100px)*.6*-1)
    }
}

.section_oneweek .blk_scroll {
    position: relative
}

.section_oneweek .blk_scroll>* {
    overflow-x: auto;
    scrollbar-width: none
}

.section_oneweek .blk_scroll>*::-webkit-scrollbar {
    display: none
}

.section_oneweek .blk_scroll>*>* {
    display: flex;
    gap: 0px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 0 calc((100vw - min(80vw, 1400px))/2)
}

.section_oneweek .blk_scroll[data-swipe]::before {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    pointer-events: none;
    content: "";
    display: inline-block;
    width: 30%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), white)
}

.section_oneweek .blk_scroll[data-swipe]::after {
    position: absolute;
    top: calc(min(13vmin, 100px)/2);
    right: calc((100vw - min(80vw, 1400px))/2);
    z-index: 2;
    transform: translate(-20%, -50%);
    content: "";
    display: inline-block;
    width: 4em;
    background: url(../../assets/img/common/icon_swipe_l.svg) no-repeat center;
    aspect-ratio: 84/35;
    pointer-events: none;
    opacity: .7;
    animation: icon-move 2s ease infinite reverse forwards
}

@-webkit-keyframes icon-move {
    0% {
        transform: translate(-20%, -50%)
    }

    70% {
        transform: translate(20%, -50%);
        opacity: .7
    }

    100% {
        transform: translate(20%, -50%);
        opacity: 0
    }
}

@keyframes icon-move {
    0% {
        transform: translate(-20%, -50%)
    }

    70% {
        transform: translate(20%, -50%);
        opacity: .7
    }

    100% {
        transform: translate(20%, -50%);
        opacity: 0
    }
}

.section_oneweek .blk_scroll[data-swipe][touched]::before {
    transition-property: opacity;
    transition-duration: .5s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    opacity: 0
}

.section_oneweek .blk_scroll[data-swipe][touched]::after {
    -webkit-animation: icon-fade-out .5s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
    animation: icon-fade-out .5s cubic-bezier(0.215, 0.61, 0.355, 1) forwards
}

@-webkit-keyframes icon-fade-out {
    0% {
        opacity: .7
    }

    100% {
        opacity: 0
    }
}

@keyframes icon-fade-out {
    0% {
        opacity: .7
    }

    100% {
        opacity: 0
    }
}

.section_oneweek .blk_scroll .outer {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000
}

.section_oneweek .blk_scroll .con {
    display: grid;
    position: relative;
    grid-template-rows: auto 1fr 1fr;
    width: min(70vw, 350px);
    border-right: 1px solid #000
}

.section_oneweek .blk_scroll .con .num {
    font-family: Outfit, sans-serif
}

.section_oneweek .blk_scroll .con .image img {
    margin: 0 auto
}

.section_oneweek .blk_scroll .con .week {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem);
    line-height: 1;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    text-align: center;
    margin: .5em 0 0 .5em
}

.section_oneweek .blk_scroll .con .week::after {
    content: "";
    display: inline-block;
    content: attr(data-attr);
    text-transform: uppercase;
    font-family: Outfit, sans-serif;
    font-size: clamp(.875rem, .82rem + .23vw, 1.1rem);
    font-weight: 600;
    color: rgba(0, 0, 0, .5)
}

.section_oneweek .blk_scroll .con .set {
    display: grid
}

.section_oneweek .blk_scroll .con .set>* {
    padding: 0 1.5rem
}

.section_oneweek .blk_scroll .con .set .title {
    font-weight: bold
}

.section_oneweek .blk_scroll .con .set .detail {
    font-size: clamp(.875rem, .82rem + .23vw, 1.1rem)
}

.section_oneweek .blk_scroll .con .set[data-type=afford] {
    grid-template-rows: 1fr 2fr;
    gap: .5em
}

.section_oneweek .blk_scroll .con .set[data-type=afford] .title {
    align-self: end;
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem);
    text-align: center
}

.section_oneweek .blk_scroll .con .set[data-type=busy] {
    grid-template-rows: auto auto 1fr;
    gap: .5em;
    padding: 1em 0
}

.section_oneweek .blk_scroll .con .set[data-type=busy]::before {
    justify-self: baseline;
    content: "";
    display: inline-block;
    content: "忙しいときは･･･";
    font-size: clamp(.75rem, .698rem + .22vw, .963rem);
    background: #d40011;
    color: #fff;
    line-height: 1;
    padding: .3em .8em .5em
}

.section_oneweek .blk_scroll .con[data-type=holiday] {
    grid-template-rows: auto 1fr;
    background: rgba(212, 0, 17, .05)
}

.section_oneweek .blk_scroll .con[data-type=holiday] .week {
    color: #d40011
}

.section_oneweek .blk_scroll .con[data-type=holiday] .week::after {
    color: #d40011
}

.section_oneweek .blk_scroll .con[data-type=holiday] .set {
    align-content: center;
    gap: .5em
}

.section_oneweek .blk_scroll .con[data-type=holiday] .set .title {
    color: #d40011
}

.section_oneweek .blk_scroll .con[data-type=mix] {
    background: rgba(212, 0, 17, .05)
}

.section_oneweek .blk_scroll .con[data-type=mix] .week {
    color: #d40011
}

.section_oneweek .blk_scroll .con[data-type=mix] .week::after {
    color: #d40011
}

.section_oneweek .blk_scroll .con[data-type=mix] .set[data-type=afford] .title {
    color: #d40011
}

.section_oneweek .blk_scroll .con[data-type=mix] .set[data-type=busy] {
    background: #fff
}

.section_oneweek .blk_scroll .con:first-child {
    border-left: 1px solid #000
}

.section_support {
    display: grid;
    row-gap: 1px;
    background: #000;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000
}

.section_support .con {
    display: grid;
    position: relative;
    gap: 1em;
    align-content: baseline;
    background: #fff;
    padding: min(8vmin, 50px) 0
}

.section_support .con .num {
    font-family: Outfit, sans-serif
}

.section_support .con .image img {
    margin: 0 auto
}

.section_support .con .title {
    color: #d40011;
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem);
    font-weight: bold;
    text-align: center
}

.section_support .con .catch {
    font-family: YakuHanJP_Noto, Zen Kaku Gothic Antique, sans-serif;
    font-size: clamp(1.875rem, 1.563rem + 1.33vw, 3.163rem)
}

.section_support .con .catch p {
    line-height: 1.4
}

.section_support .con .catch::first-letter {
    color: #d40011
}

.section_support .con:not([data-type]) .catch {
    text-align: center
}

.section_support .con[data-type=brackets] .catch {
    display: flex;
    justify-content: center
}

.section_support .con[data-type=brackets] .catch p {
    line-height: 1.4;
    padding: 1em 0
}

.section_support .con[data-type=brackets] .catch p::first-letter {
    color: #d40011
}

.section_support .con[data-type=brackets] .catch p[tab] {
    display: none
}

@media screen and (min-width: 750px) {
    .section_support .con[data-type=brackets] .catch p[tab] {
        display: block
    }
}

.section_support .con[data-type=brackets] .catch .svg_brackets {
    width: min(10%, 44px)
}

.section_support .con[data-type=brackets] .catch .svg_brackets.start {
    align-self: flex-start
}

.section_support .con[data-type=brackets] .catch .svg_brackets.end {
    align-self: flex-end;
    transform: rotate(180deg)
}

@media screen and (min-width: 750px) {
    .section_support {
        grid-template-columns: repeat(2, 1fr);
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .section_support .con:nth-child(even)::before {
        position: absolute;
        content: "";
        display: inline-block;
        width: calc(min(80vw, 1400px)*.05*1 + 2px);
        height: 100%;
        background: #fff;
        transform: translateX(calc(-100% + 1px))
    }
}

.section_flow {
    display: flex;
    flex-direction: column;
    gap: 3rem
}

.section_flow .con {
    position: relative;
    border: 1px solid #000;
    text-align: center;
    padding: 1em
}

.section_flow .con:not(:last-child)::after {
    position: absolute;
    bottom: -1.5rem;
    left: 50%;
    content: "";
    display: inline-block;
    width: 1.5rem;
    aspect-ratio: 20/7.58;
    background: url(../../assets/img/common/icon_arrow_theme.svg) no-repeat;
    transform: translate(-50%, 75%) rotate(90deg)
}

.section_flow .num {
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem);
    font-family: Outfit, sans-serif
}

.section_flow .text {
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem)
}

@media(orientation: landscape) {
    .section_flow {
        flex-direction: unset;
        flex-wrap: wrap;
        justify-content: center;
        gap: 5rem
    }

    .section_flow .con {
        display: grid;
        grid-template-rows: auto 1fr;
        gap: 1em
    }

    .section_flow .con:not(:last-child)::after {
        left: unset;
        right: -2.5rem;
        bottom: 50%;
        transform: translate(50%, -50%)
    }

    .section_flow .text {
        font-family: "Noto Sans JP", sans-serif;
        writing-mode: vertical-rl
    }
}

.blk_step {
    display: grid;
    grid-template-columns: 1.5em .75em 1fr 1fr 1.5em 1fr
}

.blk_step .con {
    background: #e1e1e1
}

.blk_step .con>span {
    display: block;
    background: #fff
}

.blk_step .con>span>span {
    display: block;
    background: #e1e1e1;
    text-align: center;
    line-height: 1;
    padding: 1em
}

.blk_step .con:not(:last-child)>span {
    -webkit-clip-path: polygon(0 0, calc(100% - 1.5em) 0, 100% 50%, calc(100% - 1.5em) 100%, 0 100%);
    clip-path: polygon(0 0, calc(100% - 1.5em) 0, 100% 50%, calc(100% - 1.5em) 100%, 0 100%)
}

.blk_step .con:not(:last-child)>span>span {
    -webkit-clip-path: polygon(0 0, calc(100% - 1.5em - 3px) 0, calc(100% - 3px) 50%, calc(100% - 1.5em - 3px) 100%, 0 100%);
    clip-path: polygon(0 0, calc(100% - 1.5em - 3px) 0, calc(100% - 3px) 50%, calc(100% - 1.5em - 3px) 100%, 0 100%)
}

.blk_step .con:nth-child(1) {
    grid-column: 1/4
}

.blk_step .con:nth-child(1)>span>span {
    padding-right: 2.5em
}

.blk_step .con:nth-child(2) {
    grid-column: 4/6
}

.blk_step .con:nth-child(2)>span>span {
    padding-right: 2.5em
}

.blk_step .con:nth-child(3) {
    grid-column: 6
}

.blk_step_wrap .ex {
    font-size: clamp(.875rem, .82rem + .23vw, 1.1rem);
    margin-top: 1em
}

@media screen and (min-width: 750px) {
    .blk_step_wrap .ex {
        text-align: center
    }
}

.form {
    display: grid;
    gap: 1rem;
    border-top: 1px solid #000;
    padding-top: 1rem
}

.form .label {
    display: flex;
    align-items: center;
    gap: .5em
}

.form .label[data-type=required]::before {
    content: "";
    display: inline-block;
    font-size: clamp(.75rem, .698rem + .22vw, .963rem);
    line-height: 1;
    padding: .3em .6em;
    content: "必須";
    background: #d40011;
    color: #fff
}

.form .label[data-type=optional]::before {
    content: "";
    display: inline-block;
    font-size: clamp(.75rem, .698rem + .22vw, .963rem);
    line-height: 1;
    padding: .3em .6em;
    content: "任意";
    background: #e1e1e1
}

.form .input {
    display: flex;
    flex-flow: column;
    gap: .5em;
    border-bottom: 1px solid #000;
    padding-bottom: 1rem
}

.form .input .radio_wrap {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px
}

.form .input .ex {
    font-size: clamp(.75rem, .698rem + .22vw, .963rem)
}

.form .input input:required:valid, .form .input textarea:required:valid {
    background: #d7f5d4
}

.form .input input:not(:required):not(:-moz-placeholder-shown), .form .input textarea:not(:required):not(:-moz-placeholder-shown) {
    background: #d7f5d4
}

.form .input input:not(:required):not(:placeholder-shown), .form .input textarea:not(:required):not(:placeholder-shown) {
    background: #d7f5d4
}

.form .input *[data-place] {
    position: relative
}

.form .input *[data-place] span {
    position: absolute;
    top: 50%;
    left: 1em;
    font-size: clamp(.75rem, .698rem + .22vw, .963rem);
    color: #626c72;
    transform: translateY(-50%);
    pointer-events: none;
    transition-property: top;
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}

.form .input *[data-place] input:required:valid+span {
    top: 0
}

.form .input *[data-place] input:required:focus+span {
    top: 0
}

.form .input *[data-place] input:not(:required):not(:-moz-placeholder-shown)+span {
    top: 0
}

.form .input *[data-place] input:not(:required):not(:placeholder-shown)+span {
    top: 0
}

.form .input *[data-place] input:not(:required):focus+span {
    top: 0
}

.form .input *[data-attr] {
    position: relative
}

.form .input *[data-attr] span {
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.form .input *[data-attr=before] span {
    left: .8em
}

.form .input *[data-attr=before] input {
    padding-left: 2.6em
}

.form .input *[data-attr=after] span {
    right: .8em
}

.form .input *[data-attr=after] input {
    padding-right: 2.6em
}

@media screen and (min-width: 1024px) {
    .form {
        grid-template-columns: repeat(3, 1fr);
        -moz-column-gap: 5%;
        column-gap: 5%
    }

    .form .label {
        position: relative;
        grid-column: 1;
        align-items: baseline;
        border-bottom: 1px solid #000
    }

    .form .label::after {
        position: absolute;
        bottom: -1px;
        right: 0;
        content: "";
        display: inline-block;
        width: calc(min(80vw, 1400px)*.05 + 1px);
        height: 1px;
        background: #000;
        transform: translateX(100%)
    }

    .form .input {
        grid-column: 2/4
    }
}

#privacy {
    border: 1px solid #e1e1e1;
    height: min(50vmin, 300px);
    padding: min(10%, 60px);
    overflow-y: scroll
}

#privacy .blk_section {
    row-gap: min(8vmin, 50px)
}

#privacy h2 {
    font-size: clamp(.875rem, .82rem + .23vw, 1.1rem)
}

#privacy p {
    font-size: clamp(.75rem, .698rem + .22vw, .963rem)
}

body[data-page=contact] main[data-step=input] *[data-step=confirm] {
    display: none
}

body[data-page=contact] main[data-step=input] *[data-step=finish] {
    display: none
}

body[data-page=contact] main[data-step=input] .blk_step .con:nth-child(1)>span>span {
    background: #d40011;
    color: #fff
}

body[data-page=contact] main[data-step=input] .form .input .value {
    display: none
}

body[data-page=contact] main[data-step=confirm] *[data-step=input] {
    display: none
}

body[data-page=contact] main[data-step=confirm] *[data-step=finish] {
    display: none
}

body[data-page=contact] main[data-step=confirm] input[type=text] {
    background: none
}

body[data-page=contact] main[data-step=confirm] .blk_step .con:nth-child(1) {
    background: #d40011
}

body[data-page=contact] main[data-step=confirm] .blk_step .con:nth-child(1)>span>span {
    background: #d40011;
    color: #fff
}

body[data-page=contact] main[data-step=confirm] .blk_step .con:nth-child(2)>span>span {
    background: #d40011;
    color: #fff
}

body[data-page=contact] main[data-step=confirm] .form .label::before {
    display: none
}

body[data-page=contact] main[data-step=confirm] .form .input *:not(.value) {
    display: none
}

body[data-page=contact] main[data-step=confirm] .form .input .ex {
    display: none
}

body[data-page=contact] main[data-step=finish] *[data-step=input], body[data-page=contact] main[data-step=finish] *[data-step=confirm] {
    display: none
}

body[data-page=contact] main[data-step=finish] form {
    display: none
}

body[data-page=contact] main[data-step=finish] #contents-area {
    --content: min(100% - 5vw * 4, 1400px) !important
}

.section_faq {
    display: grid;
    gap: min(13vmin, 100px);
    container-type: inline-size
}

.section_faq .con {
    display: grid;
    position: relative;
    gap: 1em
}

.section_faq .con .num {
    font-family: Outfit, sans-serif
}

.section_faq .con .image img {
    margin: 0 auto
}

.section_faq .con .q {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid #d40011;
    border-radius: 3em;
    color: #d40011;
    font-family: Outfit, sans-serif;
    font-size: clamp(1.5rem, 1.257rem + 1.04vw, 2.5rem);
    text-transform: uppercase;
    width: 3em;
    aspect-ratio: 1/1
}

.section_faq .con .title {
    font-size: clamp(1.25rem, 1.086rem + .7vw, 1.925rem)
}

@container (min-width: 600px) {
    .section_faq .con {
        grid-template-columns: auto 1fr;
        -moz-column-gap: 1.6em;
        column-gap: 1.6em
    }

    .section_faq .con .q {
        grid-column: 1;
        grid-row: 1
    }

    .section_faq .con .title {
        grid-column: 2;
        grid-row: 1;
        align-self: center
    }

    .section_faq .con .detail {
        grid-column: 2;
        grid-row: 2
    }
}

/*# sourceMappingURL=style.min.css.map */