a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,main,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    font: inherit
}

article,main,aside,details,figcaption,figure,footer,header,hgroup,picture,menu,nav,section {
    display: block
}

ol,ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: ""
}

table {
    border-spacing: 0;
    border-collapse: collapse
}

@keyframes loop {
    0% {
        transform: translateZ(0)
    }

    to {
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes archOpenBound {
    0% {
        transform: scaleY(0)
    }

    40% {
        transform: scaleY(1)
    }

    45% {
        transform: scaleY(1)
    }

    to {
        transform: scaleY(0)
    }
}

@keyframes archCloseBound {
    0% {
        transform: scaleY(0)
    }

    40% {
        transform: scaleY(.4)
    }

    85% {
        transform: scaleY(1.1)
    }

    90% {
        transform: scaleY(1.1)
    }

    to {
        transform: scaleY(0)
    }
}

@keyframes mask-play-pc {
    0% {
        clip-path: polygon(0 0, -15% 0, 0 100%, 0% 100%)
    }

    to {
        clip-path: polygon(0 0, 100% 0, 115% 100%, 0 100%)
    }
}

@keyframes mask-play-sp {
    0% {
        clip-path: polygon(0 0, -22% 0, 0 100%, 0% 100%)
    }

    to {
        clip-path: polygon(0 0, 100% 0, 122% 100%, 0 100%)
    }
}

@keyframes scrollArrow {
    0% {
        transform: translateZ(0);
        opacity: 0
    }

    40% {
        opacity: 1
    }

    80% {
        transform: translate3d(0, .8rem, 0);
        opacity: 0
    }

    to {
        opacity: 0
    }
}

html {
    font-size: .78125vw
}

html.is-fixed {
    overflow: visible !important
}

html.is-fixed body {
    overflow-y: scroll
}

html.is-fixed .l-scroller {
    width: 100%;
    height: 100%;
    position: fixed
}

@media only screen and (max-width: 767px) {
    html {
        font-size: 2.6666666667vw
    }
}

@media screen and (min-width: 1600px) {
    html {
        font-size: 12.5px
    }
}

body {
    line-height: 1.15;
    font-family: dnp-shuei-gothic-kin-std, sans-serif;
    font-weight: 400;
    color: #44403f;
    background-color: #f0f0f0;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "halt"
}

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

img {
    display: block;
    width: 100%;
    max-width: none;
    height: auto
}

svg {
    width: 100%;
    height: auto;
    display: block
}

svg,
canvas {
    display: block
}

button,
input,
select,
textarea {
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    box-sizing: border-box;
    background: none;
    border: 0;
    text-align: inherit;
    letter-spacing: inherit;
    font: inherit;
    color: inherit;
    cursor: pointer
}

input,
select,
textarea {
    -webkit-appearance: none;
    -ms-appearance: none;
    -moz-appearance: none;
    appearance: none
}

select::-ms-expand {
    display: none
}

textarea {
    resize: vertical
}

label {
    display: block;
    cursor: pointer
}

@media only screen and (min-width: 768px) {
    .u-sp {
        display: none
    }
}

@media only screen and (max-width: 767px) {
    .u-pc {
        display: none
    }
}

html.lenis,
html.lenis body {
    height: auto
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain
}

.lenis.lenis-stopped {
    overflow: hidden
}

.lenis.lenis-smooth iframe {
    pointer-events: none
}

.c-font__inter {
    font-family: Inter, sans-serif
}

.c-link {
    width: auto;
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -.02em;
    display: inline-block;
    padding-left: 1.4rem;
    position: relative
}
.c-link.cf{
    display: none;
}
.topInfo__linkItem_Contact .c-link.vd{
    display: none;
}
.topInfo__linkItem_Contact .c-link.cf{
    display: inline-block;
}

.c-link span {
    display: block;
    position: relative;
    padding-bottom: .3rem
}

.c-link span:after {
    content: "";
    display: block;
    height: 1px;
    background-color: #44403f;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    transform-origin: right top;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .c-link span {
        padding-bottom: .5rem;
        transition: transform .4s cubic-bezier(.22, .61, .36, 1)
    }
}

.c-link:before,
.c-link:after {
    content: "";
    box-sizing: border-box;
    display: block;
    border-radius: 50%;
    position: absolute
}
.topInfo__linkItem_Contact .c-link:before,
.topInfo__linkItem_Contact .c-link:after {
    display: none;
}

.c-link:before {
    width: .6rem;
    height: .6rem;
    background-color: #44403f;
    top: .35rem;
    left: 0;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1), opacity .1s linear
}

.c-link:after {
    width: 1.6rem;
    height: 1.6rem;
    top: -.15rem;
    left: -.5rem;
    border: #44403F 1px solid;
    opacity: 0;
    transition: opacity .1s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {

    .c-link:hover:before,
    .topInfo__linkItem:hover .c-link:before {
        transform: scale(2.666);
        opacity: 0;
        transition: transform .4s cubic-bezier(.22, .61, .36, 1), opacity .6s cubic-bezier(.22, .61, .36, 1)
    }

    .c-link:hover:after,
    .topInfo__linkItem:hover .c-link:after {
        opacity: 1;
        transition: opacity .2s .2s cubic-bezier(.22, .61, .36, 1)
    }

    .c-link:hover span,
    .topInfo__linkItem:hover .c-link span {
        transform: translate(.8rem)
    }

    .c-link:hover span:after,
    .topInfo__linkItem:hover .c-link span:after {
        transform: scaleX(0)
    }
}

.c-button {
    color: #fff;
    height: 3.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    letter-spacing: -.02em;
    border: #fff 1px solid;
    background-color: transparent;
    border-radius: 9999px
}

@media only screen and (min-width: 768px) {
    .c-button {
        height: 3.4rem;
        font-size: 1.3rem;
        transition: color .4s cubic-bezier(.22, .61, .36, 1), background-color .4s cubic-bezier(.22, .61, .36, 1)
    }

    .c-button:hover,
    .footer__contact a:hover .c-button {
        color: #44403f;
        background-color: #fff
    }
}

.c-dotLink {
    display: inline-block
}

@media only screen and (min-width: 768px) {
    .c-dotLink:hover .c-dotLink__inner ._text {
        transform: translate3d(.8rem, 0, 0)
    }

    .c-dotLink:hover .c-dotLink__inner ._text:before {
        transform: scale(1)
    }

    .c-dotLink:hover .c-dotLink__inner ._dots:before,
    .c-dotLink:hover .c-dotLink__inner ._dots:after {
        transform: scale(1.17)
    }

    .c-dotLink:hover .c-dotLink__inner ._dots span:before,
    .c-dotLink:hover .c-dotLink__inner ._dots span:after {
        transform: translateZ(0)
    }
}

.c-dotLink__inner {
    position: relative;
    display: inline-flex;
    align-items: center
}

.c-dotLink__inner ._text {
    font-size: 1.3rem;
    line-height: 1;
    display: block;
    position: relative;
    margin-left: 1.2rem;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .c-dotLink__inner ._text:before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background-color: #44403f;
        position: absolute;
        left: 0;
        bottom: -.5rem;
        transform-origin: left center;
        transform: scaleX(0);
        transition: transform .4s cubic-bezier(.22, .61, .36, 1)
    }
}

.c-dotLink__inner ._dots {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 4.4rem;
    height: 4.4rem;
    border: #BFBFBF 1px solid;
    border-radius: 50%
}

@media only screen and (min-width: 768px) {
    .c-dotLink__inner ._dots {
        width: 4.8rem;
        height: 4.8rem;
        border: none;
        position: relative
    }

    .c-dotLink__inner ._dots:before,
    .c-dotLink__inner ._dots:after {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 50%;
        transition: transform .4s cubic-bezier(.22, .61, .36, 1)
    }

    .c-dotLink__inner ._dots:before {
        background-color: #bfbfbf;
        z-index: 1
    }

    .c-dotLink__inner ._dots:after {
        width: calc(100% - 2px);
        height: calc(100% - 2px);
        background-color: #f0f0f0;
        top: 1px;
        left: 1px;
        z-index: 2
    }
}

.c-dotLink__inner ._dots span {
    display: block;
    width: .3rem;
    height: .3rem;
    border-radius: 50%;
    background-color: #44403f;
    position: relative;
    z-index: 3
}

.c-dotLink__inner ._dots span:before,
.c-dotLink__inner ._dots span:after {
    content: "";
    display: block;
    width: .3rem;
    height: .3rem;
    border-radius: 50%;
    background-color: #44403f;
    position: absolute;
    top: 0;
    left: 0;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1)
}

.c-dotLink__inner ._dots span:before {
    transform: translate3d(-.6rem, 0, 0)
}

.c-dotLink__inner ._dots span:after {
    transform: translate3d(.6rem, 0, 0)
}

.c-squareButton {
    box-sizing: border-box;
    display: flex;
    width: 100%;
    height: 5.6rem;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 1.3rem;
    font-weight: 700;
    text-align: center;
    background-color: #44403f;
    border: #44403F 1px solid;
    border-radius: .4rem
}

@media only screen and (min-width: 768px) {
    .c-squareButton {
        height: 5.2rem;
        font-size: 1.4rem;
        transition: color .4s cubic-bezier(.22, .61, .36, 1), background-color .4s cubic-bezier(.22, .61, .36, 1)
    }

    .c-squareButton:hover {
        color: #44403f;
        background-color: #fff
    }
}

.c-fade {
    opacity: 1;
    transform: translateZ(0);
    transition-property: transform, opacity;
    transition-duration: .8s;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.c-hdg01 {
    font-size: 3.2rem;
    font-weight: 600;
    line-height: .85;
    letter-spacing: -.02em;
    overflow: hidden
}

.c-hdg01 span {
    display: inline-block;
    opacity: 0;
    transform: translate3d(0, 100%, 0)
}

.c-hdg01.is-visible span {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1), transform .8s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .c-hdg01 {
        font-size: 4.8rem
    }
}

.c-pageTransition {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    pointer-events: none;
    --curtain-rate: inset(0% 0% 0%)
}

.c-pageTransition.is-hidden {
    display: none
}

.c-pageTransition:after {
    content: "";
    display: block;
    background-color: #2b2928;
    width: 100%;
    height: 100%;
    clip-path: var(--curtain-rate)
}

.c-pageTransition.is-contact:after {
    background-color: #f0f0f0
}

.c-pageTransitionArch {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.c-pageTransitionArch ._arch {
    width: 100%;
    position: absolute;
    left: 0;
    transform-origin: center bottom;
    transform: scaleY(0)
}

.c-pageTransitionArch ._arch.-before {
    bottom: -1px;
    transform-origin: center bottom
}

.c-pageTransitionArch ._arch.-after {
    top: calc(100% - .3rem);
    transform-origin: center top
}

.c-pageTransitionArch.is-before ._arch.-before {
    animation: archOpenBound .6s linear forwards
}

.c-pageTransitionArch.is-after ._arch.-after {
    animation: archCloseBound .65s linear forwards
}

.header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    padding: 2.4rem 4.2666666667% 0;
    pointer-events: none;
    z-index: 99;
    opacity: 1;
    transition: opacity 2.4s .4s ease, transform 1.6s .4s cubic-bezier(0, .55, .45, 1)
}

.header.is-hidden {
    opacity: 0;
    transform: translate3d(0, -101%, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .header {
        padding: 3.2rem 3.359375% 0 3.75%
    }
}

.header__inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    transition: opacity .8s .3s ease
}

.header.is-lower .header__inner {
    opacity: 0;
    transition: none
}

.header__logo {
    width: 12.2rem;
    pointer-events: auto;
    position: relative;
    z-index: 1
}

.header__logo path {
    transition: fill .3s ease
}

.header[data-theme=dark] .header__logo path {
    fill: #44403f
}

@media only screen and (min-width: 768px) {
    .header__logo {
        width: 10.2rem
    }
}

.header__menuButton {
    color: #fff;
    font-weight: 400;
    font-size: 1.4rem;
    line-height: 1;
    letter-spacing: -.02em;
    pointer-events: auto;
    display: block;
    transition: color .3s ease;
    position: relative;
    z-index: 1
}

.header[data-theme=dark] .header__menuButton {
    color: #44403f
}

@media only screen and (min-width: 768px) {
    .header__menuButton {
        display: none
    }
}

.header__menu {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #44403f;
    display: flex;
    align-items: center;
    pointer-events: auto;
    clip-path: inset(100% 0% 0%);
    overscroll-behavior-y: none
}

@media only screen and (min-width: 768px) {
    .header__menu {
        display: block;
        position: relative;
        background: none;
        clip-path: none !important;
        pointer-events: none;
        overscroll-behavior-y: auto
    }
}

.header__menuInner {
    box-sizing: border-box;
    width: 100%;
    padding: 0 6.4%;
    display: flex;
    align-items: center;
    justify-content: space-between
}

@media only screen and (min-width: 768px) {
    .header__menuInner {
        width: auto;
        padding: 0;
        margin-top: -.5rem;
        display: block
    }
}

.header__menuAddress ._address {
    color: #a6a6a6;
    font-size: 1.1rem;
    letter-spacing: -.02em;
    line-height: 1.6;
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
    transition: opacity .8s ease, transform .8s ease
}

.header__menu.is-open .header__menuAddress ._address {
    opacity: 1;
    transform: translateZ(0);
    transition-delay: .4s
}

.header__menu.is-close .header__menuAddress ._address {
    transform: translate3d(0, -2rem, 0);
    transition-duration: .7s
}

.header__menuCopy {
    position: absolute;
    bottom: 2.4rem;
    left: 6.4%
}

.header__menuCopy ._copy {
    color: #a6a6a6;
    font-size: 1.1rem;
    letter-spacing: -.02em;
    line-height: 1.6;
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
    transition: opacity .8s ease, transform .8s ease
}

.header__menu.is-open .header__menuCopy ._copy {
    opacity: 1;
    transform: translateZ(0);
    transition-delay: .4s
}

.header__menu.is-close .header__menuCopy ._copy {
    transform: translate3d(0, -2rem, 0);
    transition-duration: .7s
}

.header__pageLinkList {
    display: flex;
    flex-direction: column;
    gap: 1.9rem
}

@media only screen and (min-width: 768px) {
    .header__pageLinkList {
        flex-direction: row;
        gap: 10.7rem
    }

    .header__pageLinkList:hover .header__pageLink:not(:hover) {
        opacity: .3
    }
}

.header__pageLinkInner {
    display: flex;
    flex-direction: column;
    gap: 1.9rem
}

@media only screen and (min-width: 768px) {
    .header__pageLinkInner {
        gap: 0
    }
}

.header__pageLinkItem {
    text-align: right;
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
    transition: opacity .8s ease, transform .8s ease
}

.header__menu.is-open .header__pageLinkItem {
    opacity: 1;
    transform: translateZ(0);
    transition-delay: .4s
}

.header__menu.is-close .header__pageLinkItem {
    transform: translate3d(0, -2rem, 0);
    transition-duration: .7s
}

@media only screen and (min-width: 768px) {
    .header__pageLinkItem {
        text-align: left;
        opacity: 1;
        transform: translateZ(0);
        transition: none
    }
}

.header__pageLink {
    color: #fff;
    font-weight: 600;
    font-size: 2.4rem;
    line-height: .9;
    letter-spacing: -.02em;
    display: inline-block;
    position: relative;
    transition: opacity .25s cubic-bezier(.22, .61, .36, 1), color .3s ease
}

@media only screen and (min-width: 768px) {
    .header__pageLink {
        font-weight: 400;
        font-size: 1.3rem;
        line-height: 1;
        pointer-events: auto;
        padding: .5rem
    }

    .header__pageLink span {
        display: block;
        position: relative
    }

    .header__pageLink span:before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background-color: #fff;
        position: absolute;
        bottom: -.3rem;
        left: 0;
        transform: scaleX(0);
        transform-origin: right top;
        transition: transform .25s cubic-bezier(.22, .61, .36, 1), background-color .3s ease
    }

    .header__pageLink:hover span:before,
    .header__pageLink.-current span:before {
        transform: scaleX(1);
        transform-origin: left top
    }

    .header[data-theme=dark] .header__pageLink {
        color: #44403f
    }

    .header[data-theme=dark] .header__pageLink span:before {
        background-color: #44403f
    }
}

.header__pageLink--disable {
    opacity: .25
}

.header__menuArch {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none
}

.header__menuArchSvg {
    width: 100%;
    position: absolute;
    left: 0;
    transform: scaleY(0)
}

.header__menuArchSvg.-open {
    bottom: -1px;
    transform-origin: center bottom
}

.header__menuArch.is-open .header__menuArchSvg.-open {
    animation: archOpenBound .75s cubic-bezier(.5, 1, .89, 1) forwards
}

.header__menuArchSvg.-close {
    top: calc(100% - .3rem);
    transform-origin: center top
}

.header__menuArch.is-close .header__menuArchSvg.-close {
    animation: archCloseBound .8s cubic-bezier(.5, 1, .89, 1) forwards
}

.footer {
    padding-bottom: 4.8rem
}

@media only screen and (min-width: 768px) {
    .footer {
        padding-bottom: 16rem
    }
}

.footer__contact {
    overflow: hidden;
    position: relative
}

.footer__contact a {
    display: block
}

.footer__contactTitle {
    color: #fff;
    font-weight: 400;
    font-size: 1.3rem;
    line-height: 1;
    letter-spacing: -.02em;
    text-align: center;
    position: absolute;
    top: 2.4rem;
    right: 0;
    left: 0;
    overflow: hidden
}

.footer__contactTitle span {
    display: block;
    opacity: 1;
    transform: translateZ(0);
    transition-property: transform, opacity;
    transition-duration: .8s;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.footer__contactTitle.is-hidden span {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .footer__contactTitle {
        top: 3.2rem
    }
}

.footer__contactLink {
    width: 11.3rem;
    position: absolute;
    bottom: 2.4rem;
    right: 0;
    left: 0;
    margin: 0 auto
}

@media only screen and (min-width: 768px) {
    .footer__contactLink {
        width: 12.2rem;
        right: 4.8rem;
        bottom: 4rem;
        left: auto;
        margin: 0
    }
}

.footer__contactTickker {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    transform: translateY(-50%)
}

@media only screen and (min-width: 768px) {
    .footer__contactTickker {
        margin-top: -.4rem
    }
}

.footer__contactTickker ._inner {
    display: flex
}

.footer__contactTickker ._text {
    color: #fff;
    font-family: acumin-pro-semi-condensed, sans-serif;
    font-size: 5.6rem;
    font-weight: 400;
    line-height: .9;
    letter-spacing: -.02em;
    flex: 0 0 auto;
    display: flex;
    overflow: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    -webkit-text-stroke: 1px #fff;
    transition: color .4s cubic-bezier(.22, .61, .36, 1)
}

.footer__contactTickker ._text.is-animation {
    animation: loop infinite linear 50s
}

@media only screen and (min-width: 768px) {
    .footer__contactTickker ._text {
        font-size: 8.6rem
    }

    .footer__contact a:hover .footer__contactTickker ._text {
        color: transparent
    }
}

.footer__contactTickker ._text:before,
.footer__contactTickker ._text:after {
    content: attr(data-text) "";
    display: block;
    flex: 0 0 auto
}

.footer__content {
    padding: 9.6rem 2.4rem 0
}

@media only screen and (min-width: 768px) {
    .footer__content {
        padding: 16.7rem 9.53125% 0
    }
}

@media only screen and (min-width: 768px) {
    .footer__inner {
        display: flex;
        align-items: flex-end;
        justify-content: space-between
    }
}

.footer__main {
    display: flex;
    justify-content: space-between
}

@media only screen and (min-width: 768px) {
    .footer__main {
        flex-direction: column;
        padding-top: .6rem
    }
}

@media only screen and (min-width: 768px) {
    .footer__nav {
        width: 29.6rem
    }
}

@media only screen and (min-width: 768px) {
    .footer__pageLinkList {
        display: flex;
        flex-wrap: wrap;
        gap: 1.6rem 6.25rem;
        pointer-events: none
    }

    .footer__pageLinkList:hover .footer__pageLink:not(:hover) {
        opacity: .3
    }
}

.footer__pageLinkItem+.footer__pageLinkItem {
    margin-top: 1.5rem
}

@media only screen and (min-width: 768px) {
    .footer__pageLinkItem+.footer__pageLinkItem {
        margin-top: 0
    }
}

@media only screen and (min-width: 768px) {
    .footer__pageLinkItem {
        width: 5.7rem
    }

    .footer__pageLinkItem:nth-child(2) {
        order: 3
    }

    .footer__pageLinkItem:nth-child(3) {
        order: 1
    }

    .footer__pageLinkItem:nth-child(4) {
        order: 4
    }

    .footer__pageLinkItem:nth-child(5) {
        order: 2
    }

    .footer__pageLinkItem:nth-child(6) {
        order: 5
    }
}

.footer__pageLink {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -.02em
}

@media only screen and (min-width: 768px) {
    .footer__pageLink {
        font-size: 1.3rem;
        display: inline-block;
        position: relative;
        pointer-events: auto;
        transition: opacity .25s cubic-bezier(.22, .61, .36, 1)
    }

    .footer__pageLink:before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background-color: #44403f;
        position: absolute;
        bottom: -.3rem;
        left: 0;
        transform: scaleX(0);
        transform-origin: right top;
        transition: transform .25s cubic-bezier(.22, .61, .36, 1)
    }

    .footer__pageLink:hover:before {
        transform: scaleX(1);
        transform-origin: left top
    }
}

.footer__pageLink--disable {
    pointer-events: none;
    opacity: .25
}

.footer__info {
    padding-right: 2.3rem
}

@media only screen and (min-width: 768px) {
    .footer__info {
        display: flex;
        align-items: flex-end;
        margin-top: 20.5rem;
        padding-right: 0
    }
}

.footer__addressText {
    color: #a6a6a6;
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: -.02em
}

@media only screen and (min-width: 768px) {
    .footer__addressText {
        font-size: 1.2rem;
        line-height: 1.4
    }
}

.footer__terms {
    margin-top: 2rem
}

@media only screen and (min-width: 768px) {
    .footer__terms {
        margin: 0 0 0 5.1rem
    }
}

.footer__terms ._copy {
    color: #a6a6a6;
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: -.02em
}

@media only screen and (min-width: 768px) {
    .footer__terms ._copy {
        font-size: 1.2rem;
        line-height: 1.4;
        position: relative;
        top: -.1rem
    }
}

@media only screen and (min-width: 768px) {
    .footer__terms ._copy a {
        transition: opacity .4s ease
    }

    .footer__terms ._copy a:hover {
        opacity: .7
    }
}

.footer__toTop {
    display: none
}

@media only screen and (min-width: 768px) {
    .footer__toTop {
        display: flex;
        justify-content: flex-end
    }
}

@media only screen and (min-width: 768px) {
    .footer__toTopLink {
        width: auto;
        display: flex;
        align-items: center;
        gap: 1.2rem;
        font-size: 1.3rem;
        letter-spacing: -.02em;
        position: relative
    }

    .footer__toTopLink span {
        display: block;
        position: relative
    }

    .footer__toTopLink span:before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background-color: #44403f;
        position: absolute;
        bottom: -.3rem;
        left: 0;
        transform: scaleX(0);
        transform-origin: left top;
        transition: transform .25s cubic-bezier(.22, .61, .36, 1)
    }

    .footer__toTopLink:after {
        content: "";
        display: block;
        width: 5.2rem;
        height: 5.2rem;
        background-color: #fff;
        border-radius: 50%;
        transform: scale(1);
        transition: transform .25s cubic-bezier(.22, .61, .36, 1)
    }

    .footer__toTopLink:before {
        content: "";
        width: .5rem;
        height: 1.6rem;
        background: url(/assets/images/layout/footer/icon_arrow_blk.svg) no-repeat;
        background-position: center center;
        background-size: contain;
        position: absolute;
        top: 50%;
        right: 2.4rem;
        margin-top: -.8rem;
        z-index: 1
    }

    .footer__toTopLink:hover span:before {
        transform: scaleX(1)
    }

    .footer__toTopLink:hover:after {
        transform: scale(1.23)
    }
}

.footer__logo {
    width: 20rem;
    margin: 8rem 0 0 auto
}

@media only screen and (min-width: 768px) {
    .footer__logo {
        width: 26rem;
        margin: 21rem 0 0
    }
}

.footer__logoLink {
    display: block
}

.l-wrapper.is-readey {
    width: 100%;
    height: 100svh;
    position: relative;
    z-index: 10001;
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%)
}

.l-wrapper.is-readey.is-visible {
    animation: mask-play-sp .9s 1s cubic-bezier(.65, 0, .35, 1) forwards
}

@media only screen and (min-width: 768px) {
    .l-wrapper.is-readey.is-visible {
        animation-name: mask-play-pc;
        animation-duration: 1.1s
    }
}

.archive {
    padding: 0 4.2666666667%
}

@media only screen and (min-width: 768px) {
    .archive {
        padding: 0 3.75%;
        display: flex;
        flex-direction: row-reverse;
        margin-top: -22rem;
    }
}

.archive__content.-works {
    opacity: 0;
    transform: translate3d(0, 2rem, 0)
}

.archive__content.-works.is-visible {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1), transform .8s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .archive__content {
        flex: 1
    }
}

.archive__navCol {
    width: fit-content;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 auto 2rem;
    z-index: 10;
    transition: transform .3s cubic-bezier(.22, .61, .36, 1)
}

.archive__navCol.is-hidden {
    transform: translate3d(0, 160%, 0)
}

@media only screen and (min-width: 768px) {
    .archive__navCol.is-hidden {
        transform: translateZ(0)
    }
}

@media only screen and (min-width: 768px) {
    .archive__navCol {
        width: 29.6rem;
        display: flex;
        align-items: flex-end;
        position: static;
        margin: 0
    }
}

.archive__nav {
    width: 25.7rem;
    margin: 0 auto;
    background-color: #44403f;
    border-radius: .4rem;
    position: relative
}

@media only screen and (min-width: 768px) {
    .archive__nav {
        width: auto;
        margin: 0;
        background-color: transparent;
        border-radius: 0;
        position: sticky;
        display: block;
        bottom: 4.8rem
    }
}

.archive__navSummary {
    color: #fff;
    font-size: 1.3rem;
    letter-spacing: -.02em;
    line-height: 4.8rem;
    padding: 0 2rem;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 768px) {
    .archive__navSummary {
        color: #a6a6a6;
        line-height: .9;
        padding: 0;
        pointer-events: none
    }
}

.archive__navSummary:before,
.archive__navSummary:after {
    content: "";
    display: block;
    width: 1.4rem;
    height: 1px;
    background-color: #fff;
    position: absolute;
    top: 50%;
    right: 2rem;
    margin-top: -.5px;
    transition: transform .3s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {

    .archive__navSummary:before,
    .archive__navSummary:after {
        display: none
    }
}

.archive__navSummary:after {
    transform: rotate(90deg)
}

.archive__navSummary.is-open:before {
    transform: rotate(45deg)
}

.archive__navSummary.is-open:after {
    transform: rotate(135deg)
}

.archive__navBody {
    padding: 2.4rem 2rem 1.8rem;
    clip-path: inset(100% 0% 0%);
    position: absolute;
    right: 0;
    bottom: 100%;
    left: 0;
    border-radius: .4rem .4rem 0 0;
    background-color: #44403f;
    margin-bottom: -.4rem
}

@media only screen and (min-width: 768px) {
    .archive__navBody {
        clip-path: inset(0% 0% 0%) !important;
        padding: 0;
        margin: 2.4rem 0 0;
        position: static;
        border-radius: 0;
        background-color: transparent
    }
}

.archive__navList {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: opacity .6s ease, transform .6s ease
}

@media only screen and (min-width: 768px) {
    .archive__navList {
        opacity: 1;
        transform: translateZ(0)
    }
}

.archive__navBody.is-open .archive__navList {
    opacity: 1;
    transform: translateZ(0);
    transition-delay: .3s
}

.archive__navBody.is-close .archive__navList {
    transform: translate3d(0, -.5rem, 0)
}

@media only screen and (min-width: 768px) {
    .archive__navBody.is-close .archive__navList {
        transform: translateZ(0)
    }
}

.archive__navItem+.archive__navItem {
    margin-top: .8rem
}

@media only screen and (min-width: 768px) {
    .archive__navItem+.archive__navItem {
        margin-top: .6rem
    }
}

.archive__navItem ._link {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 500;
    box-sizing: border-box;
    height: 2.3rem;
    display: inline-flex;
    align-items: center;
    padding: 0 1.2rem;
    border: #A6A6A6 1px solid;
    border-radius: 9999px;
    transition: color .3s cubic-bezier(.22, .61, .36, 1), background-color .3s cubic-bezier(.22, .61, .36, 1), border-color .3s cubic-bezier(.22, .61, .36, 1)
}

.archive__navItem ._link.c-font__inter {
    font-weight: 400
}

@media only screen and (min-width: 768px) {
    .archive__navItem ._link {
        color: #44403f
    }

    .archive__navItem ._link:hover {
        color: #fff;
        background-color: #44403f;
        border-color: #44403f
    }
}

.archive__navItem ._link.-active {
    font-weight: 700;
    color: #44403f;
    background-color: #fff;
    border-color: #fff;
    pointer-events: none
}

.archive__navItem ._link.-active.c-font__inter {
    font-weight: 400
}

@media only screen and (min-width: 768px) {
    .archive__navItem ._link.-active {
        color: #fff;
        background-color: #44403f;
        border-color: #44403f
    }
}

.archive__footer {
    margin-top: 3.7rem;
    text-align: center
}

.archive__footer.is-hidden {
    opacity: 0;
    transform: translate3d(0, 2rem, 0);
    transition: none
}

.archive__footer .archive__footerButton.is-hidden {
    visibility: hidden
}

@media only screen and (min-width: 768px) {
    .archive__footer {
        margin-top: 4.8rem
    }
}

.archive__result {
    color: #a6a6a6;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.8;
    text-align: center;
    margin: 17.5rem 0 22.2rem
}

@media only screen and (min-width: 768px) {
    .archive__result {
        margin: 21.5rem 0 32.7rem -29.6rem
    }
}

.archive__loadContents {
    opacity: 0;
    margin-top: 2.9rem;
    display: none
}

.news .archive__loadContents,
.archive__loadContents .news__list {
    margin-top: 0
}

.archive__loadContents .news__item:first-child:before {
    display: none
}

@media only screen and (min-width: 768px) {
    .archive__loadContents {
        margin-top: 4rem
    }
}

.topHdg {
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -.02em;
    overflow: hidden
}

.topHdg span {
    font-size: 3.45rem;
    font-weight: 500;
    line-height: .85;
    letter-spacing: -.02em;
    display: inline-block;
    opacity: 1;
    transform: translateZ(0);
    transition-property: transform, opacity;
    transition-duration: .8s;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}
.topHdg span b{
    font-weight: 600;
}

.topHdg.-white {
    color: #fff
}

.topHdg.is-hidden span {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
    transition: none
}

.topAbout {
    padding: 12rem 0 13.6rem
}

@media only screen and (min-width: 768px) {
    .topAbout {
        padding: 18.4rem 0 19.2rem
    }
}

.topAbout__content {
    padding: 0 6.4%
}

@media only screen and (min-width: 768px) {
    .topAbout__content {
        display: flex;
        padding: 0 9.53125%
    }
}

@media only screen and (min-width: 768px) {
    .topAbout__heading {
        width: 50%;
        padding-top: .8rem
    }
}

.topAbout__body {
    margin-top: 4rem
}

@media only screen and (min-width: 768px) {
    .topAbout__body {
        margin-top: 0;
        padding-right: 6.7567567568%
    }
}

.topAbout__lead {
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.6;
    transition-delay: 75ms
}

@media only screen and (min-width: 768px) {
    .topAbout__lead {
        font-size: 2.4rem
    }
}

.is-hidden .topAbout__lead {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .is-hidden .topAbout__lead {
        transform: translate3d(0, 3.5rem, 0)
    }
}

.topAbout__description {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.8;
    margin-top: 2rem;
    transition-delay: .15s
}

@media only screen and (min-width: 768px) {
    .topAbout__description {
        margin-top: 2.4rem
    }
}

.is-hidden .topAbout__description {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .is-hidden .topAbout__description {
        transform: translate3d(0, 3.5rem, 0)
    }
}

.topAbout__link {
    margin-top: 3.7rem;
    transition-delay: .225s
}

.is-hidden .topAbout__link {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .is-hidden .topAbout__link {
        transform: translate3d(0, 3.5rem, 0)
    }
}

.topWorks__sticky {
    position: sticky;
    top: 0;
    overflow: hidden;
    z-index: 1
}

.topWorks__progress {
    width: 100%;
    height: .3rem;
    background-color: #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    transform-origin: left bottom;
    transform: scaleX(0);
    opacity: 0;
    transition: opacity .4s ease
}

.is-view .topWorks__progress {
    opacity: 1
}

.topWorks__heading {
    text-align: center;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    padding-top: 2.4rem
}

.topWorks__heading .topHdg span {
    opacity: 0;
    transform: translate3d(0, 100%, 0)
}

.is-view .topWorks__heading .topHdg span {
    opacity: 1;
    transform: translateZ(0)
}

@media only screen and (min-width: 768px) {
    .topWorks__heading {
        padding-top: 3.2rem
    }
}

.topWorks__book {
    display: none
}

@media only screen and (min-width: 768px) {
    .topWorks__book {
        width: 1rem;
        color: #fff;
        font-size: 1.2rem;
        line-height: 1;
        text-align: center;
        position: absolute;
        top: 0;
        right: 4.8rem;
        bottom: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
        transition: opacity 1s ease
    }

    .is-view .topWorks__book {
        opacity: 1;
        transition-delay: .2s
    }

    .topWorks__book[data-current="1"] .topWorks__bookCurrent ._num.-first {
        transform: translate3d(0, -100%, 0)
    }

    .topWorks__book[data-current="1"] .topWorks__bookCurrent ._num.-second {
        transform: translateZ(0)
    }

    .topWorks__book[data-current="2"] .topWorks__bookCurrent ._num.-first,
    .topWorks__book[data-current="2"] .topWorks__bookCurrent ._num.-second {
        transform: translate3d(0, -100%, 0)
    }

    .topWorks__book[data-current="2"] .topWorks__bookCurrent ._num.-third {
        transform: translateZ(0)
    }

    .topWorks__book[data-current="3"] .topWorks__bookCurrent ._num.-first,
    .topWorks__book[data-current="3"] .topWorks__bookCurrent ._num.-second,
    .topWorks__book[data-current="3"] .topWorks__bookCurrent ._num.-third {
        transform: translate3d(0, -100%, 0)
    }

    .topWorks__book[data-current="3"] .topWorks__bookCurrent ._num.-fourth {
        transform: translateZ(0)
    }

    .topWorks__book[data-current="4"] .topWorks__bookCurrent ._num.-first,
    .topWorks__book[data-current="4"] .topWorks__bookCurrent ._num.-second,
    .topWorks__book[data-current="4"] .topWorks__bookCurrent ._num.-third,
    .topWorks__book[data-current="4"] .topWorks__bookCurrent ._num.-fourth {
        transform: translate3d(0, -100%, 0)
    }

    .topWorks__book[data-current="4"] .topWorks__bookCurrent ._num.-fifth {
        transform: translateZ(0)
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__bookCurrent ._current {
        overflow: hidden;
        position: relative
    }

    .topWorks__bookCurrent ._num {
        padding-top: 1px;
        transition: transform .4s cubic-bezier(.22, .61, .36, 1)
    }

    .topWorks__bookCurrent ._num:not(:first-child) {
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        transform: translate3d(0, 100%, 0)
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__bookTotal {
        margin-top: 1.2rem;
        padding-top: 1.2rem;
        border-top: #BFBFBF 1px solid
    }
}

.topWorks__footer {
    border-bottom: rgba(191, 191, 191, .4) 1px solid
}

.topWorks__footerLink .c-dotLink {
    height: 10.3rem;
    display: flex;
    align-items: center;
    justify-content: center
}

@media only screen and (min-width: 768px) {
    .topWorks__footerLink .c-dotLink {
        height: 15.9rem
    }
}

.topWorks__container:after {
    content: "";
    display: block;
    height: 50vh
}

@media only screen and (min-width: 768px) {
    .topWorks__container:after {
        height: 25vh
    }
}

.topWorks__scroller {
    height: 100vh;
    margin-top: 65vh
}

.topWorks__body {
    box-sizing: border-box;
    position: relative;
    height: 100vh;
    padding: 14.626391097vh 0 12.2416534181vh
}

@media only screen and (min-width: 768px) {
    .topWorks__body {
        display: flex;
        align-items: center;
        padding: 0
    }
}

.topWorks__bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    clip-path: inset(4%)
}

.topWorks__bg:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: .58
}

.topWorks__bg ._bg {
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    overflow: hidden
}

.topWorks__bg ._bg:not(:first-child) {
    clip-path: inset(0% 0% 100%)
}

.topWorks__bg ._bg:not(:first-child) img {
    transform: scale(1.4) translate3d(0, -5.6rem, 0)
}

.topWorks__bg ._bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0
}

.topWorks__layout {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transition: opacity .6s ease
}

.is-view .topWorks__layout {
    opacity: 1
}

@media only screen and (min-width: 768px) {
    .topWorks__layout {
        height: auto;
        align-items: center;
        justify-content: end;
        flex-direction: row-reverse;
        padding: 0 7.8125% 0 15.3125%
    }
}

.topWorks__images {
    width: 27.186009539vh;
    height: 40.6995230525vh;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    border-radius: .4rem
}

@media only screen and (min-width: 768px) {
    .topWorks__images {
        width: 100%;
        height: auto;
        margin: 0 0 0 auto
    }

    .topWorks__images:after {
        content: "";
        display: block;
        padding-top: 150%;
        background-color: #000;
        opacity: .15;
        position: relative
    }
}

.topWorks__images ._image {
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    overflow: hidden
}

.topWorks__images ._image:not(:first-child) {
    clip-path: inset(100% 0% 0%)
}

.topWorks__images ._image:not(:first-child) img {
    transform: scale(1.3) translate3d(0, 5.6rem, 0)
}

.topWorks__images ._image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0
}

.topWorks__date {
    margin-top: 1.9077901431vh;
    text-align: center;
    overflow: hidden;
    position: relative
}

@media only screen and (min-width: 768px) {
    .topWorks__date {
        margin-top: 2.4rem;
        position: absolute;
        top: 100%;
        right: 0;
        left: 0
    }
}

.topWorks__date ._date {
    color: #a6a6a6;
    font-size: 1.2rem;
    line-height: .95;
    letter-spacing: -.02em;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    padding: 1px 0
}

@media only screen and (max-width: 374px) {
    .topWorks__date ._date {
        font-size: 1.9077901431vh
    }
}

.topWorks__date ._date span,
.topWorks__date ._date time {
    display: block;
    margin-right: .95rem;
    order: 0
}

.topWorks__date ._date span:last-child,
.topWorks__date ._date time:last-child {
    order: 2;
    margin: 0 0 0 .95rem
}

.topWorks__date ._date:before {
    content: "";
    display: block;
    width: 1px;
    height: 1.1rem;
    background-color: #a6a6a6;
    order: 1;
    transform: rotate(15deg)
}

@media only screen and (max-width: 374px) {
    .topWorks__date ._date:before {
        height: 1.7488076312vh
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__date ._date:before {
        height: 1.1rem
    }
}

.topWorks__date ._date:not(:first-child) {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate3d(0, 100%, 0)
}

.topWorks__layout[data-current="1"] .topWorks__date ._date.-first {
    transform: translate3d(0, -100%, 0)
}

.topWorks__layout[data-current="1"] .topWorks__date ._date.-second {
    transform: translateZ(0)
}

.topWorks__layout[data-current="2"] .topWorks__date ._date.-first,
.topWorks__layout[data-current="2"] .topWorks__date ._date.-second {
    transform: translate3d(0, -100%, 0)
}

.topWorks__layout[data-current="2"] .topWorks__date ._date.-third {
    transform: translateZ(0)
}

.topWorks__layout[data-current="3"] .topWorks__date ._date.-first,
.topWorks__layout[data-current="3"] .topWorks__date ._date.-second,
.topWorks__layout[data-current="3"] .topWorks__date ._date.-third {
    transform: translate3d(0, -100%, 0)
}

.topWorks__layout[data-current="3"] .topWorks__date ._date.-fourth {
    transform: translateZ(0)
}

.topWorks__layout[data-current="4"] .topWorks__date ._date.-first,
.topWorks__layout[data-current="4"] .topWorks__date ._date.-second,
.topWorks__layout[data-current="4"] .topWorks__date ._date.-third,
.topWorks__layout[data-current="4"] .topWorks__date ._date.-fourth {
    transform: translate3d(0, -100%, 0)
}

.topWorks__layout[data-current="4"] .topWorks__date ._date.-fifth {
    transform: translateZ(0)
}

@media only screen and (min-width: 768px) {
    .topWorks__date ._date {
        font-size: 1.2rem
    }
}

.topWorks__info {
    color: #fff;
    text-align: center
}

@media only screen and (min-width: 768px) {
    .topWorks__info {
        width: 54.8780487805%;
        text-align: left;
        margin-left: 15.0406504065%;
        position: relative;
        top: -.1rem
    }
}

.topWorks__info ._cat {
    font-size: 1.4rem;
    letter-spacing: -.02em
}

@media only screen and (max-width: 374px) {
    .topWorks__info ._cat {
        font-size: 2.2257551669vh
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__info ._cat {
        font-size: 1.6rem
    }
}

.topWorks__info ._name {
    font-weight: 700;
    font-size: 2.6rem;
    line-height: 1.2;
    letter-spacing: -.04em
}

@media only screen and (max-width: 374px) {
    .topWorks__info ._name {
        font-size: 4.13354531vh
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__info ._name {
        font-size: 4.4rem
    }
}

.topWorks__info ._description {
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1;
    position: relative;
    top: -.1rem
}

.topWorks__info ._description br {
    display: none
}

@media only screen and (max-width: 374px) {
    .topWorks__info ._description {
        font-size: 2.066772655vh
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__info ._description {
        font-size: 1.5rem;
        top: 0
    }
}

.topWorks__info ._date {
    font-size: 1.3rem;
    line-height: 1;
    letter-spacing: -.02em;
    margin-left: 1rem
}

.topWorks__info ._date ._element {
    padding-left: 1rem;
    border-left: #A6A6A6 1px solid
}

@media only screen and (min-width: 768px) {
    .topWorks__info ._date ._element {
        padding-left: 1.2rem
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__info ._date {
        font-size: 1.5rem;
        margin-left: 1.2rem
    }
}

.topWorks__info ._btn {
    width: 16.8521462639vh;
    margin: 0 auto
}

.topWorks__info ._btn .topBtn {
    height: 3.2rem;
    font-size: 1.2rem
}

@media only screen and (max-width: 374px) {
    .topWorks__info ._btn .topBtn {
        height: 5.0874403816vh;
        font-size: 1.9077901431vh
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__info ._btn .topBtn {
        height: 3.4rem;
        font-size: 1.3rem
    }
}

@media only screen and (min-width: 768px) {
    .topWorks__info ._btn {
        width: 11.4rem;
        margin: 0
    }
}

.topWorks__infoLine {
    overflow: hidden
}

.topWorks__infoLine ._element {
    display: inline-block
}

.topWorks__infoLine.-name {
    margin-top: 2.066772655vh
}

@media only screen and (min-width: 768px) {
    .topWorks__infoLine.-name {
        margin-top: 2.1rem
    }
}

.topWorks__infoLine.-description {
    margin-top: 1.7488076312vh;
    display: flex;
    justify-content: center;
    align-items: center
}

@media only screen and (min-width: 768px) {
    .topWorks__infoLine.-description {
        margin-top: 1.7rem;
        justify-content: flex-start
    }
}

.topWorks__infoLine.-btn {
    margin-top: 3.3386327504vh
}

@media only screen and (min-width: 768px) {
    .topWorks__infoLine.-btn {
        margin-top: 3.7rem
    }
}

.topWorks__column {
    margin-top: auto
}

@media only screen and (min-width: 768px) {
    .topWorks__column {
        width: 30.081300813%;
        max-width: 29.6rem;
        margin-top: 0;
        position: relative
    }
}

.topInfo {
    padding: 13.3rem 0 8.8rem
}

@media only screen and (min-width: 768px) {
    .topInfo {
        padding: 17.6rem 0 18rem;
        overflow: hidden
    }
}

.topInfo__content {
    padding: 0 4.2666666667%
}

@media only screen and (min-width: 768px) {
    .topInfo__content {
        padding: 0 9.53125%
    }
}

.topInfo__link:after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #bfbfbf66;
    transform: scaleX(1);
    transform-origin: left top;
    transition: transform 1.6s .2s cubic-bezier(.22, .61, .36, 1);
    margin-top: 3.9rem
}

@media only screen and (min-width: 768px) {
    .topInfo__link:after {
        margin-top: 0
    }
}

.topInfo__link.is-hidden {
    opacity: 0;
    transform: translate3d(0, 2rem, 0);
    transition: none
}

.topInfo__link.is-hidden:after {
    transform: scaleX(0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .topInfo__link {
        position: relative;
        z-index: 1
    }
}

.topInfo__link+.topInfo__link {
    margin-top: 4.5rem
}

@media only screen and (min-width: 768px) {
    .topInfo__link+.topInfo__link {
        margin-top: 0;
        transition-delay: .1s
    }

    .topInfo__link+.topInfo__link:after {
        transition-delay: .5s
    }
}

.topInfo__linkItem {
    display: block
}

@media only screen and (min-width: 768px) {
    .topInfo__linkItem {
        display: flex;
        align-items: center;
        padding: 6.1rem 0 5.8rem;
        transition: opacity .4s cubic-bezier(.22, .61, .36, 1)
    }
}

.topInfo__linkItem[target=_blank] .topInfo__linkHeading ._hdg {
    position: relative
}

.topInfo__linkItem[target=_blank] .topInfo__linkHeading ._hdg:after {
    content: "";
    display: block;
    width: 1.2rem;
    height: 1.2rem;
    background: url(/assets/images/common/icon_blank.svg) no-repeat;
    background-position: center center;
    background-size: contain;
    position: absolute;
    top: -.4rem;
    right: -1.8rem
}

@media only screen and (min-width: 768px) {
    .topInfo__linkItem[target=_blank] .topInfo__linkHeading ._hdg:after {
        width: 1.4rem;
        height: 1.4rem;
        top: -.2rem
    }
}

@media only screen and (min-width: 768px) {
    .topInfo__linkItem:not(.topInfo__linkItem--disable) {
        transition: opacity .4s cubic-bezier(.22, .61, .36, 1)
    }

    .topInfo__linkItem:not(.topInfo__linkItem--disable):hover .topInfo__linkDescription ._description {
        transform: translate(1.6rem)
    }
}

.topInfo__linkItem--disable {
    opacity: .25;
    pointer-events: none
}

@media only screen and (min-width: 768px) {
    .topInfo__linkHeading {
        width: 50%
    }
}

.topInfo__linkHeading ._hdg {
    font-size: 3.2rem;
    font-weight: 600;
    line-height: .85;
    letter-spacing: -.02em;
    display: inline-block
}

@media only screen and (min-width: 768px) {
    .topInfo__linkHeading ._hdg {
        font-size: 4.3rem
    }
}

.topInfo__linkDescription {
    margin-top: 1rem
}

@media only screen and (min-width: 768px) {
    .topInfo__linkDescription {
        margin-top: .5rem
    }
}

.topInfo__linkDescription ._description {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.8;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1)
}

.topInfo__linkViewdetail {
    margin-top: 4rem
}

@media only screen and (min-width: 768px) {
    .topInfo__linkViewdetail {
        margin: .3rem 0 0 auto
    }
}

.topInfo__linkImage {
    margin-top: 2.4rem;
    overflow: hidden;
    border-radius: .4rem
}

@media only screen and (min-width: 768px) {
    .topInfo__image {
        position: fixed;
        top: 0;
        left: 0;
        pointer-events: none;
        z-index: -1;
        will-change: transform;
        transition: transform .2s linear
    }
}

@media only screen and (min-width: 768px) {
    .topInfo__imageWrapper {
        width: 33.4rem;
        height: 22.2rem;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        overflow: hidden;
        border-radius: .4rem;
        pointer-events: none;
        opacity: 0;
        visibility: hidden;
        transition: visibility 0s linear .4s, opacity .4s cubic-bezier(.33, 1, .68, 1)
    }

    .topInfo__image.is-visible .topInfo__imageWrapper {
        opacity: 1;
        visibility: visible;
        transition: visibility 0s linear, opacity .4s .1s cubic-bezier(.33, 1, .68, 1)
    }

    .topInfo__imageWrapper ._image {
        width: 116.7664670659%;
        height: 100%;
        overflow: hidden;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%);
        opacity: 0;
        transition: opacity 1s cubic-bezier(.33, 1, .68, 1)
    }

    .topInfo__image[data-current=company] .topInfo__imageWrapper ._image.-company,
    .topInfo__image[data-current=recruit] .topInfo__imageWrapper ._image.-recruit {
        opacity: 1
    }

    .topInfo__imageWrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        will-change: transform
    }
}

.topNews {
    padding-bottom: 8.8rem
}

@media only screen and (min-width: 768px) {
    .topNews {
        padding-bottom: 18.3rem
    }
}

.topNews__content {
    padding: 0 4.2666666667%
}

@media only screen and (min-width: 768px) {
    .topNews__content {
        display: flex;
        flex-wrap: wrap;
        padding: 0 9.53125%
    }
}

@media only screen and (min-width: 768px) {
    .topNews__heading {
        order: 0
    }
}

.topNews__body {
    margin-top: 5.6rem
}

@media only screen and (min-width: 768px) {
    .topNews__body {
        margin-top: 6.7rem;
        width: 100%;
        order: 2
    }
}

.topNews__linkList {
    display: flex;
    flex-wrap: wrap;
    gap: 3.2rem 0;
    pointer-events: none
}

@media only screen and (min-width: 768px) {
    .topNews__linkList {
        gap: 0
    }

    .topNews__linkList:hover .topNews__link:not(:hover) {
        opacity: .3
    }
}

.topNews__linkItem {
    box-sizing: border-box;
    width: 50%;
    border-left: rgba(204, 204, 204, .4) 1px solid
}

@media only screen and (min-width: 768px) {
    .topNews__linkItem {
        width: 25%
    }

    .topNews__linkItem:last-child {
        border-right: rgba(204, 204, 204, .4) 1px solid
    }
}

.topNews__linkItem.is-hidden {
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .topNews__linkItem.is-hidden {
        transform: translate3d(0, 3rem, 0)
    }
}

.topNews__link {
    box-sizing: border-box;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.6rem 0;
    padding: 0 1.6rem 2.2rem;
    pointer-events: auto
}

@media only screen and (min-width: 768px) {
    .topNews__link {
        padding: 0 3.1rem 3rem;
        transition: opacity .4s cubic-bezier(.22, .61, .36, 1)
    }

    .topNews__link:hover ._description span {
        background-size: 100% 1px
    }
}

@media only screen and (min-width: 768px) {
    .topNews__link ._data {
        display: flex
    }
}

.topNews__link ._date,
.topNews__link ._cat {
    color: #a6a6a6;
    font-size: 1.2rem;
    line-height: .85;
    letter-spacing: -.02em
}

.topNews__link ._cat {
    margin-top: .8rem
}

@media only screen and (min-width: 768px) {
    .topNews__link ._cat {
        margin: 0 0 0 .8rem;
        padding-left: .8rem;
        border-left: #A6A6A6 1px solid
    }
}

.topNews__link ._description {
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.8;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box
}

.topNews__link ._description span {
    background-image: linear-gradient(90deg, #44403f, #44403f);
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: 0 1px;
    transition: background-size .4s cubic-bezier(.22, .61, .36, 1)
}

.topNews__footer {
    margin-top: 4rem
}

@media only screen and (min-width: 768px) {
    .topNews__footer {
        order: 1;
        margin: 0 0 0 auto
    }
}

.topNews__footer.is-hidden {
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .topNews__footer.is-hidden {
        transition-delay: .15s
    }
}

.topNews__footerLink {
    text-align: center
}

.topHero {
    position: relative;
    z-index: 1
}

.topHero__bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1
}

.topHero__image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: 1;
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%)
}

.topHero__image.is-prevSlide {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    z-index: 2
}

.topHero__image.is-prevSlide video,
.topHero__image.is-prevSlide img {
    transform: scale(1)
}

.topHero__image:after {
    content: "";
    display: block;
    background-color: #00000061;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.topHero__image video,
.topHero__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.25);
    transition: transform 0s cubic-bezier(0, .55, .45, 1)
}

.topHero__bg[data-slide="0"] .topHero__image[data-bg="0"] {
    z-index: 3;
    animation: mask-play-sp .9s cubic-bezier(.65, 0, .35, 1) forwards
}

@media only screen and (min-width: 768px) {
    .topHero__bg[data-slide="0"] .topHero__image[data-bg="0"] {
        animation-name: mask-play-pc;
        animation-duration: 1.1s
    }
}

.topHero__bg[data-slide="0"] .topHero__image[data-bg="0"] video,
.topHero__bg[data-slide="0"] .topHero__image[data-bg="0"] img {
    transform: scale(1);
    transition-duration: 2.6s
}

.topHero__bg[data-slide="0"].is-initialized .topHero__image[data-bg="0"] {
    animation-duration: 0s
}

.topHero__bg[data-slide="1"] .topHero__image[data-bg="1"] {
    z-index: 3;
    animation: mask-play-sp .9s cubic-bezier(.65, 0, .35, 1) forwards
}

@media only screen and (min-width: 768px) {
    .topHero__bg[data-slide="1"] .topHero__image[data-bg="1"] {
        animation-name: mask-play-pc;
        animation-duration: 1.1s
    }
}

.topHero__bg[data-slide="1"] .topHero__image[data-bg="1"] video,
.topHero__bg[data-slide="1"] .topHero__image[data-bg="1"] img {
    transform: scale(1);
    transition-duration: 2.6s
}

.topHero__bg[data-slide="2"] .topHero__image[data-bg="2"] {
    z-index: 3;
    animation: mask-play-sp .9s cubic-bezier(.65, 0, .35, 1) forwards
}

@media only screen and (min-width: 768px) {
    .topHero__bg[data-slide="2"] .topHero__image[data-bg="2"] {
        animation-name: mask-play-pc;
        animation-duration: 1.1s
    }
}

.topHero__bg[data-slide="2"] .topHero__image[data-bg="2"] video,
.topHero__bg[data-slide="2"] .topHero__image[data-bg="2"] img {
    transform: scale(1);
    transition-duration: 2.6s
}

.topHero__bg.is-hidden .topHero__image video,
.topHero__bg.is-hidden .topHero__image img {
    transform: scale(1.25) !important;
    transition: none
}

.topHero__slideItem {
    color: #fff;
    display: flex;
    align-items: center;
    height: 100svh
}

.topHero__slideItem ._cat {
    font-size: 1.5rem;
    line-height: .85;
    letter-spacing: -.02em;
    opacity: 1;
    transform: translateZ(0);
    transition: opacity 1s ease, transform .8s cubic-bezier(0, .55, .45, 1)
}

@media only screen and (min-width: 768px) {
    .topHero__slideItem ._cat {
        font-size: 1.8rem
    }
}

.topHero__slideItem ._name {
    font-weight: 700;
    font-size: 2.9rem;
    line-height: 1.1;
    letter-spacing: -.04em;
    margin-top: 1.6rem;
    opacity: 1;
    transform: translateZ(0);
    transition: opacity 1s .15s ease, transform .8s .15s cubic-bezier(0, .55, .45, 1)
}

@media only screen and (min-width: 768px) {
    .topHero__slideItem ._name {
        font-size: 5rem;
        margin-top: 2.4rem
    }
}

.topHero__slideItem ._description {
    margin-top: .7rem;
    padding-top: .7rem;
    display: flex;
    align-items: center;
    -webkit-mask-image: linear-gradient(to right, #fff, #fff 50%, #ffffffbf, #fff0);
    mask-image: linear-gradient(to right, #fff, #fff 50%, #ffffffbf, #fff0);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 300% 100%;
    mask-size: 300% 100%;
    -webkit-mask-position: 0 top;
    mask-position: 0 top;
    transition: mask-position 1.6s .05s cubic-bezier(.11, 0, .5, 0)
}

.topHero__slideItem ._description time {
    font-size: 1.4rem;
    line-height: .85;
    letter-spacing: -.02em;
    display: block;
    position: relative;
    margin-left: 1rem;
    padding-left: 1.1rem;
    top: -.2rem
}

.topHero__slideItem ._description time:before {
    content: "";
    display: block;
    width: 1px;
    height: 1.2rem;
    background-color: #a6a6a6;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -.6rem
}

@media only screen and (min-width: 768px) {
    .topHero__slideItem ._description time:before {
        height: 1.4rem;
        margin-top: -.7rem
    }
}

@media only screen and (min-width: 768px) {
    .topHero__slideItem ._description time {
        font-size: 1.6rem;
        top: .1rem;
        margin-left: 1.2rem;
        padding-left: 1.3rem;
        top: -.1rem
    }
}

.topHero__slideItem ._description span {
    font-size: 1.3rem;
    font-weight: 500;
    display: block;
    position: relative
}

@media only screen and (min-width: 768px) {
    .topHero__slideItem ._description span {
        font-size: 1.6rem
    }
}

.topHero__slideItem ._description br {
    display: none
}

@media only screen and (min-width: 768px) {
    .topHero__slideItem ._description {
        margin-top: 1rem
    }
}

.topHero__slideItem ._btn {
    width: 10.6rem;
    margin-top: 2.7rem;
    opacity: 1;
    transition: opacity 1.2s .35s ease
}

@media only screen and (min-width: 768px) {
    .topHero__slideItem ._btn {
        width: 11.4rem;
        margin-top: 4.5rem
    }
}

.topHero.is-hidden .topHero__slideItem ._cat,
.topHero.is-hidden .topHero__slideItem ._name {
    opacity: 0;
    transform: translate3d(0, 1.2rem, 0);
    transition: none
}

.topHero.is-hidden .topHero__slideItem ._description {
    -webkit-mask-position: 150% top;
    mask-position: 150% top;
    transition: none
}

.topHero.is-hidden .topHero__slideItem ._btn {
    opacity: 0;
    transition: none
}

.topHero__slideInner {
    box-sizing: border-box;
    width: 100%;
    padding: 0 4.2666666667% 2.9333333333%
}

@media only screen and (min-width: 768px) {
    .topHero__slideInner {
        padding: 2.5vh 9.53125% 0
    }
}

.topHero__slideContent {
    display: inline-flex;
    flex-direction: column;
    opacity: 0;
    transform-origin: left center;
    transform: scale(.81);
    transition: transform 0s cubic-bezier(.65, 0, .35, 1), opacity .8s .2s ease
}

.topHero__slideContent ._column {
    transform-origin: left center;
    transform: translate3d(100%, 0, 0);
    transition: transform 0s cubic-bezier(.65, 0, .35, 1)
}

.splide__slide.is-active .topHero__slideContent {
    opacity: 1;
    transform: scale(1);
    transition-duration: 1s;
    transition-delay: .1s
}

.splide__slide.is-active .topHero__slideContent ._column {
    transform: translateZ(0);
    transition-duration: 1s;
    transition-delay: .1s
}

.splide__slide.is-active .topHero__slideContent ._column:nth-child(1) {
    transition-delay: .114s
}

.splide__slide.is-active .topHero__slideContent ._column:nth-child(3) {
    transition-delay: .128s
}

.splide__slide.is-prevSlide .topHero__slideContent {
    transform: scale(.82);
    transition-duration: 1s;
    transition-delay: .1s
}

.splide__slide.is-prevSlide .topHero__slideContent ._column {
    transform: translate3d(-100%, 0, 0);
    transition-duration: 1s;
    transition-delay: .1s
}

.splide__slide.is-prevSlide .topHero__slideContent ._column:nth-child(1) {
    transition-delay: .114s
}

.splide__slide.is-prevSlide .topHero__slideContent ._column:nth-child(3) {
    transition-delay: .128s
}

.topHero__bg.is-initialized+.topHero__contents .topHero__slideContent {
    transition: none
}

.topHero__bg.is-initialized+.topHero__contents .topHero__slideContent ._column {
    transition: none
}

.topHero__scroll {
    display: none
}

@media only screen and (min-width: 768px) {
    .topHero__scroll {
        display: block;
        position: absolute;
        bottom: 3.2rem;
        left: 4.8rem;
        opacity: 1;
        transform: translateZ(0);
        transition: opacity 2s .6s ease, transform 1.2s .6s cubic-bezier(0, .55, .45, 1)
    }

    .topHero__scroll span {
        color: #fff;
        font-size: 1.3rem;
        letter-spacing: -.02em;
        line-height: 1.0833333333;
        display: block;
        padding-left: 1.2rem;
        position: relative
    }

    .topHero__scroll span:before {
        content: "";
        display: block;
        width: .4rem;
        height: 1.3rem;
        background: url(/assets/images/common/icon_arrow_wh.svg) no-repeat;
        background-position: center center;
        background-size: contain;
        position: absolute;
        top: -.35rem;
        left: 0;
        animation: scrollArrow 2.2s infinite
    }

    .topHero.is-hidden .topHero__scroll {
        opacity: 0;
        transform: translate3d(0, 5rem, 0);
        transition: none
    }

    .topHero.is-hidden .topHero__scroll span:before {
        animation-play-state: paused
    }
}

.topHero__contents .hero__pages {
    bottom: 2.2rem;
    padding: 0 6.4%;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0 2.752293578%;
    opacity: 1;
    transform: translateZ(0);
    transition: opacity 2s .6s ease, transform 1.2s .6s cubic-bezier(0, .55, .45, 1)
}

.topHero.is-hidden .topHero__contents .hero__pages {
    opacity: 0;
    transform: translate3d(0, 5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pages {
        padding: 0;
        bottom: 3.2rem;
        right: 3.75%;
        left: auto;
        justify-content: flex-end;
        gap: 0 1.6rem
    }
}

.topHero__contents .hero__pagesItem {
    display: flex;
    width: 31.498470948%
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pagesItem {
        width: 13.8rem
    }
}

.topHero__contents .splide__pagination__page {
    background: none;
    border-radius: 0;
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    width: 100%;
    height: auto;
    margin: 0;
    opacity: 1;
    transition: none
}

.topHero__contents .splide__pagination__page.is-active {
    opacity: 1;
    background: none;
    transform: scale(1)
}

.topHero__contents .splide__pagination__page.is-active .hero__pageThumb:before {
    padding-top: 6.9rem
}

@media only screen and (min-width: 768px) {
    .topHero__contents .splide__pagination__page.is-active .hero__pageThumb:before {
        padding-top: 9.2rem
    }
}

.topHero__contents .splide__pagination__page.is-active .hero__pageThumb ._image {
    opacity: 1;
    transform: translateZ(0)
}

.topHero__contents .splide__pagination__page.is-active .hero__pageThumb:after {
    opacity: .75
}

.topHero__contents .splide__pagination__page.is-active .hero__pageCat,
.topHero__contents .splide__pagination__page.is-active .hero__pageName {
    opacity: 1
}

@media only screen and (min-width: 768px) {
    .topHero__contents .splide__pagination__page:hover {
        opacity: 1
    }

    .topHero__contents .splide__pagination__page:hover .hero__pageThumb:before {
        padding-top: 9.2rem
    }

    .topHero__contents .splide__pagination__page:hover .hero__pageThumb ._image {
        opacity: 1;
        transform: translateZ(0)
    }

    .topHero__contents .splide__pagination__page:hover .hero__pageThumb:after {
        opacity: .75
    }

    .topHero__contents .splide__pagination__page:hover .hero__pageCat,
    .topHero__contents .splide__pagination__page:hover .hero__pageName {
        opacity: 1
    }
}

.topHero__contents .hero__pageThumbWrap {
    display: flex;
    align-items: flex-end;
    width: 100%;
    height: 6.9rem
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pageThumbWrap {
        height: 9.2rem
    }
}

.topHero__contents .hero__pageThumb {
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: .2rem;
    position: relative;
    background-color: #000
}

.topHero__contents .hero__pageThumb:before {
    content: "";
    display: block;
    padding-top: 5.8rem;
    transition: padding .3s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pageThumb:before {
        padding-top: 7.8rem
    }
}

.topHero__contents .hero__pageThumb ._image {
    display: block;
    width: 100%;
    height: 6.9rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    opacity: .7;
    transition: opacity .3s cubic-bezier(.22, .61, .36, 1), transform .3s cubic-bezier(.22, .61, .36, 1);
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translate3d(0, .55rem, 0)
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pageThumb ._image {
        height: 9.2rem;
        transform: translate3d(0, .7rem, 0)
    }
}

.topHero__contents .hero__pageThumb:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: #fff 1px solid;
    border-radius: .2rem;
    opacity: 0;
    transition: opacity .3s cubic-bezier(.22, .61, .36, 1)
}

.topHero__contents .hero__pageCat {
    display: none
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pageCat {
        display: block;
        width: 100%;
        color: #fff;
        font-family: acumin-pro-semi-condensed, sans-serif;
        font-size: 1rem;
        font-weight: 500;
        line-height: .85;
        letter-spacing: -.02em;
        margin-top: .9rem;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
        display: -webkit-box;
        text-overflow: ellipsis;
        word-break: break-all;
        white-space: nowrap;
        opacity: .5;
        transition: opacity .3s cubic-bezier(.22, .61, .36, 1)
    }
}

.topHero__contents .hero__pageName {
    flex-grow: 1;
    display: flex;
    width: 100%;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.04em;
    word-break: break-all;
    margin-top: .8rem;
    opacity: .5;
    transition: opacity .3s cubic-bezier(.22, .61, .36, 1)
}

.topHero__contents .hero__pageName span {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pageName {
        font-size: 1.3rem;
        margin-top: .4rem
    }
}

.topHero__contents .hero__pageProgress {
    display: block;
    width: 100%;
    height: 1px;
    margin-top: 1.3rem;
    background-color: #fff6
}

@media only screen and (min-width: 768px) {
    .topHero__contents .hero__pageProgress {
        margin-top: 2.2rem
    }
}

.topHero__contents .hero__pageProgress ._bar {
    display: block;
    background: #fff;
    width: 100%;
    height: 100%;
    transform-origin: left top;
    transform: scaleX(0)
}

.topSplash {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #f0f0f0;
    z-index: 9999;
    opacity: 1;
    visibility: visible
}

.topSplash.is-hidden .topSplash__logo,
.topSplash.is-hidden .topSplash__counter {
    opacity: 0;
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1)
}

.topSplash__logo {
    width: 18.5rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow: hidden
}

.topSplash__logo path {
    transform: translate3d(0, 101%, 0)
}

.is-visible .topSplash__logo path {
    transform: translateZ(0);
    transition: transform .6s cubic-bezier(.33, 1, .68, 1)
}

.is-visible .topSplash__logo path:nth-child(2) {
    transition-delay: .04s
}

.is-visible .topSplash__logo path:nth-child(3) {
    transition-delay: .08s
}

.is-visible .topSplash__logo path:nth-child(4) {
    transition-delay: .12s
}

.is-visible .topSplash__logo path:nth-child(5) {
    transition-delay: .16s
}

.is-visible .topSplash__logo path:nth-child(6) {
    transition-delay: .2s
}

.is-visible .topSplash__logo path:nth-child(7) {
    transition-delay: .24s
}

.is-visible .topSplash__logo path:nth-child(8) {
    transition-delay: .28s
}

.is-visible .topSplash__logo path:nth-child(9) {
    transition-delay: .32s
}

.is-visible .topSplash__logo path:nth-child(10) {
    transition-delay: .36s
}

.is-visible .topSplash__logo path:nth-child(11) {
    transition-delay: .4s
}

@media only screen and (min-width: 768px) {
    .topSplash__logo {
        width: 20.3rem
    }
}

.topSplash__counter {
    font-size: 1.3rem;
    line-height: 1;
    letter-spacing: -.02em;
    text-align: center;
    position: absolute;
    right: 0;
    bottom: 3.2rem;
    left: 0
}

.topSplash__counter span {
    display: inline-block
}

.works {
    padding: 11.4rem 0 8.8rem
}

@media only screen and (min-width: 768px) {
    .works {
        padding: 16rem 0 18.4rem
    }
}

.works__heading {
    font-family: Inter, sans-serif;
    font-weight: 600;
    font-size: 3.2rem;
    line-height: .85;
    letter-spacing: -.02em;
    overflow: hidden;
    padding: 0 6.4% 2rem;
    display: block;
}

@media only screen and (min-width: 768px) {
    .works__list {
        pointer-events: none
    }
    .works__heading {
        font-size: 3.85rem;
        position: sticky;
        padding: 0 3.75% 16rem;
        top: 11rem;
    }
}

.works__item {
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1), transform .8s cubic-bezier(.22, .61, .36, 1)
}

.works__item.is-hidden {
    opacity: 0;
    transform: translate3d(0, 2rem, 0)
}

.works__item:after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #bfbfbf;
    transform: scaleX(1);
    transform-origin: left top
}

.works__item ._link {
    display: block;
    padding-bottom: 3rem;
    pointer-events: auto
}

@media only screen and (min-width: 768px) {
    .works__item ._link {
        padding-bottom: 4.3rem;
        transition: opacity .4s cubic-bezier(.22, .61, .36, 1)
    }

    .works__item ._link:hover .works__itemThumbnail ._image img {
        opacity: 0
    }

    .works__item ._link:hover .works__itemThumbnail ._text:before {
        transform: scaleX(1)
    }
}

.works__item+.works__item {
    margin-top: 2.9rem
}

@media only screen and (min-width: 768px) {
    .works__item+.works__item {
        margin-top: 4rem
    }
}

.works__itemThumbnail {
    border-radius: .4rem;
    position: relative;
    overflow: hidden
}

.works__itemThumbnail:before {
    content: "";
    padding-top: 22.9rem;
    display: block
}

@media only screen and (min-width: 768px) {
    .works__itemThumbnail:before {
        padding-top: 56.3063063063%;
        position: relative;
        background-color: #000;
        opacity: .5;
        z-index: 2
    }
}

.works__itemThumbnail ._text {
    display: none
}

@media only screen and (min-width: 768px) {
    .works__itemThumbnail ._text {
        color: #fff;
        font-size: 1.3rem;
        line-height: .85;
        letter-spacing: -.02em;
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 3
    }

    .works__itemThumbnail ._text:before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background-color: #fff;
        position: absolute;
        bottom: -.3rem;
        left: 0;
        transform-origin: left top;
        transform: scaleX(0);
        transition: transform .25s .15s cubic-bezier(.22, .61, .36, 1)
    }
}

.works__itemThumbnail ._hover {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.works__itemThumbnail ._hover picture {
    width: 100%;
    height: 100%
}

.works__itemThumbnail ._hover video,
.works__itemThumbnail ._hover img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.works__itemThumbnail ._image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    z-index: 4;
    transition: opacity 1s ease
}

.works__itemDetail {
    margin-top: 1.2rem;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end
}

@media only screen and (min-width: 768px) {
    .works__itemDetail {
        margin-top: 1.4rem;
        align-items: flex-start
    }
}

.works__itemTitle {
    width: 100%;
    margin-bottom: .6rem
}

@media only screen and (min-width: 768px) {
    .works__itemTitle {
        width: 90.0900900901%;
        margin-bottom: 0;
        order: 0
    }
}

.works__itemTitle ._name {
    font-weight: 600;
    font-size: 2.3rem;
    line-height: 1.2;
    letter-spacing: -.04em
}

@media only screen and (min-width: 768px) {
    .works__itemTitle ._name {
        font-size: 4.2rem
    }
}

.works__itemTitle ._description {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.4;
    margin-top: .7rem
}

.works__itemTitle ._description br {
    display: none
}

@media only screen and (min-width: 768px) {
    .works__itemTitle ._description {
        font-size: 1.4rem;
        line-height: 1;
        margin-top: 1.6rem
    }
}

.works__itemInfo {
    width: 100%
}

@media only screen and (min-width: 768px) {
    .works__itemInfo {
        order: 2;
        margin-top: 1.3rem
    }
}

.works__itemInfo ._info {
    display: flex;
    align-items: baseline
}

.works__itemInfo ._info:before {
    content: "";
    display: block;
    width: 1px;
    height: 1.2rem;
    background-color: #a6a6a6;
    margin: 0 .8rem;
    order: 1;
    position: relative;
    top: .1rem
}

@media only screen and (min-width: 768px) {
    .works__itemInfo ._info:before {
        margin: 0 1.2rem 0 1rem
    }
}

.works__itemInfo ._date {
    font-size: 1.4rem;
    letter-spacing: -.02em;
    order: 2
}

.works__itemInfo ._place {
    font-size: 1.3rem;
    font-weight: 500;
    order: 0
}

@media only screen and (min-width: 768px) {
    .works__itemInfo ._place {
        font-size: 1.4rem
    }
}

.works__itemCat {
    margin-top: 2.5rem
}

@media only screen and (min-width: 768px) {
    .works__itemCat {
        order: 1;
        margin: .8rem 0 0 auto
    }
}

.works__itemCat ._category {
    font-size: 1.2rem;
    line-height: .85;
    letter-spacing: -.02em
}

.works__itemCat ._type {
    font-size: 1.1rem;
    line-height: 1;
    margin-top: .4rem
}

@media only screen and (min-width: 768px) {
    .works__itemCat ._type {
        margin-top: .6rem
    }
}

.ws {
    padding-bottom: 8.8rem
}

@media only screen and (min-width: 768px) {
    .ws {
        padding-bottom: 18.4rem
    }
}

.ws__kv {
    width: 100%;
    position: sticky;
    top: 0;
    z-index: -1
}

.ws__kv ._inner {
    width: 100%;
    height: 100dvh;
    position: absolute;
    top: 0;
    left: 0
}

.ws__kvImage {
    width: 100%;
    height: 100vh;
    position: relative;
    z-index: 1;
    --opacity-rate: .4
}

.ws__kvImage ._visual {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.ws__kvImage:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: var(--opacity-rate)
}

.ws__kvHeading {
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 2.4rem;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0 4.2666666667% 3.2rem;
    z-index: 2;
    overflow: hidden
}

@media only screen and (min-width: 768px) {
    .ws__kvHeading {
        gap: 4rem;
        padding: 0 9.53125% 5.6rem
    }
}

.ws__kvHeading ._heading {
    display: flex;
    flex-direction: column-reverse;
    gap: 1.6rem
}

.ws__kvHeading ._data {
    display: flex;
    justify-content: space-between;
    align-items: center;
    -webkit-mask-image: linear-gradient(to right, #fff, #fff 50%, #ffffffbf, #fff0);
    mask-image: linear-gradient(to right, #fff, #fff 50%, #ffffffbf, #fff0);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 300% 100%;
    mask-size: 300% 100%;
    -webkit-mask-position: 150% top;
    mask-position: 150% top
}

.ws__kv.is-visible .ws__kvHeading ._data {
    -webkit-mask-position: 0 top;
    mask-position: 0 top;
    transition: mask-position 1.6s .05s cubic-bezier(.11, 0, .5, 0)
}

@media only screen and (min-width: 768px) {
    .ws__kvHeading ._data {
        justify-content: flex-start;
        gap: 0 2rem
    }
}

.ws__title {
    font-weight: 700;
    font-size: 2.9rem;
    line-height: 1.1;
    letter-spacing: -.04em;
    opacity: 0;
    transform: translate3d(0, 1.2rem, 0)
}

.ws__kv.is-visible .ws__title {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity 1s .15s ease, transform .8s .15s cubic-bezier(0, .55, .45, 1)
}

@media only screen and (min-width: 768px) {
    .ws__title {
        font-size: 5rem
    }
}

.ws__client {
    font-size: 1.5rem;
    line-height: .85;
    letter-spacing: -.02em;
    opacity: 0;
    transform: translate3d(0, 1.2rem, 0)
}

.ws__kv.is-visible .ws__client {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity 1s ease, transform .8s cubic-bezier(0, .55, .45, 1)
}

@media only screen and (min-width: 768px) {
    .ws__client {
        font-size: 1.8rem
    }
}

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

.ws__info:before {
    content: "";
    display: block;
    width: 1px;
    height: 1.1rem;
    background-color: #a6a6a6;
    margin: 0 1rem;
    order: 1;
    position: relative;
    top: .1rem
}

@media only screen and (min-width: 768px) {
    .ws__info:before {
        height: 1.3rem;
        margin: 0 1.2rem
    }
}

.ws__info ._details {
    font-size: 1.2rem;
    font-weight: 500;
    order: 0
}

@media only screen and (min-width: 768px) {
    .ws__info ._details {
        font-size: 1.3rem
    }
}

.ws__info ._date {
    font-size: 1.3rem;
    letter-spacing: -.02em;
    order: 2
}

.ws__category {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    height: 2.3rem;
    font-size: 1.2rem;
    line-height: 1;
    border: #fff 1px solid;
    border-radius: 9999px;
    padding: 0 1.2rem
}

@media only screen and (min-width: 768px) {
    .ws__scroll {
        position: absolute;
        bottom: 5.6rem;
        right: 9.53125%
    }

    .ws__scroll span {
        color: #fff;
        font-size: 1.3rem;
        letter-spacing: -.02em;
        line-height: 1;
        display: block;
        padding-left: 1.2rem;
        position: relative
    }

    .ws__scroll span:before {
        content: "";
        display: block;
        width: .4rem;
        height: 1.3rem;
        background: url(/assets/images/common/icon_arrow_wh.svg) no-repeat;
        background-position: center center;
        background-size: contain;
        position: absolute;
        top: -.35rem;
        left: 0;
        animation: scrollArrow 2.2s infinite
    }
}

.ws__lead {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1
}

.ws__lead ._lead {
    color: #fff;
    text-align: center;
    box-sizing: border-box;
    width: 100%;
    padding: 0 4.2666666667%
}

@media only screen and (min-width: 768px) {
    .ws__lead ._lead {
        padding: 0 9.53125%
    }
}

.ws__leadCatch {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2.2;
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1), transform .8s cubic-bezier(.22, .61, .36, 1)
}

.is-show .ws__leadCatch {
    opacity: 1;
    transform: translateZ(0)
}

@media only screen and (min-width: 768px) {
    .ws__leadCatch {
        font-size: 1.4rem
    }
}

.ws__leadDescription {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2.2;
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
    transition: opacity .8s .2s cubic-bezier(.22, .61, .36, 1), transform .8s .2s cubic-bezier(.22, .61, .36, 1)
}

.is-show .ws__leadDescription {
    opacity: 1;
    transform: translateZ(0)
}

@media only screen and (min-width: 768px) {
    .ws__leadDescription {
        font-size: 1.4rem
    }
}

.ws__body {
    padding: 6.4rem 4.2666666667% 0
}

@media only screen and (min-width: 768px) {
    .ws__body {
        padding: 12rem 9.53125% 0
    }
}

@media only screen and (min-width: 768px) {
    .ws__gallery ._lyt {
        display: flex
    }
}

@media only screen and (min-width: 768px) {
    .ws__galleryImages {
        width: 64.2857142857%
    }
}

@media only screen and (min-width: 768px) {
    .ws__galleryDetail {
        flex: 1;
        margin-left: 7.1428571429%
    }

    .ws__galleryDetail ._inner {
        box-sizing: border-box;
        width: 100%;
        height: 100vh;
        position: sticky;
        top: 0;
        display: flex;
        flex-direction: column;
        justify-content: center
    }
}

@media only screen and (min-width: 768px) {
    .ws__galleryHeading ._client {
        font-size: 1.2rem;
        line-height: .85;
        letter-spacing: -.02em
    }

    .ws__galleryHeading ._client+._name {
        margin-top: 1.6rem
    }

    .ws__galleryHeading ._name {
        font-weight: 700;
        font-size: 3.2rem;
        line-height: 1.2;
        letter-spacing: -.04em
    }

    .ws__galleryHeading ._catch {
        font-size: 1.3rem;
        line-height: 1;
        margin-top: 1.3rem
    }

    .ws__galleryHeading ._catch br {
        display: none
    }

    .ws__galleryHeading ._info {
        font-size: 1.2rem;
        line-height: .95;
        letter-spacing: -.02em;
        display: flex;
        margin-top: 3.1rem
    }

    .ws__galleryHeading ._info:before {
        content: "";
        display: block;
        width: 1px;
        height: 1.1rem;
        background-color: #a6a6a6;
        margin: 0 1rem;
        order: 1
    }

    .ws__galleryHeading ._info ._date {
        font-size: 1.2rem;
        line-height: .85;
        letter-spacing: -.02em;
        order: 1
    }

    .ws__galleryHeading ._info ._details {
        font-size: 1.2rem;
        order: 0
    }
}

@media only screen and (min-width: 768px) {
    .ws__galleryDescription {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        padding-bottom: 4.8rem
    }

    .ws__galleryDescription ._description {
        font-size: 1.2rem;
        font-weight: 500;
        line-height: 1.6
    }
}

.ws__galleryDescription br {
    display: none
}

.ws__galleryItem+.ws__galleryItem {
    margin-top: 1rem
}

@media only screen and (min-width: 768px) {
    .ws__galleryItem+.ws__galleryItem {
        margin-top: 1.6rem
    }
}

.ws__galleryItem ._link {
    display: block;
    overflow: hidden;
    border-radius: .4rem;
    position: relative
}

.ws__galleryItem ._caption {
    color: #fff;
    font-size: 1rem;
    line-height: 1.2;
    text-align: right;
    text-shadow: 0px 0px .5rem rgba(0, 0, 0, .7);
    padding: .8rem;
    position: absolute;
    right: 0;
    bottom: 0
}

@media only screen and (min-width: 768px) {
    .ws__galleryItem ._caption {
        font-weight: 500
    }
}

.ws__section:not(:first-child) {
    margin-top: 4.9rem
}

@media only screen and (min-width: 768px) {
    .ws__section:not(:first-child) {
        margin-top: 7.2rem
    }
}

.ws__section:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #ccc;
    opacity: .4;
    margin-bottom: 4.9rem
}

@media only screen and (min-width: 768px) {
    .ws__section:before {
        margin-bottom: 7.2rem
    }
}

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

@media only screen and (min-width: 768px) {
    .ws__sectionTitle {
        font-size: 2.4rem
    }
}

.ws__sectionTitle+.ws__sectionImage {
    margin-top: 2.4rem
}

@media only screen and (min-width: 768px) {
    .ws__sectionTitle+.ws__sectionImage {
        margin-top: 3.2rem
    }
}

.ws__sectionDescription {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2;
    margin-top: 2.4rem
}

@media only screen and (min-width: 768px) {
    .ws__sectionDescription {
        font-size: 1.4rem;
        margin-top: 3.2rem
    }
}

.ws__sectionImage {
    overflow: hidden;
    border-radius: .4rem;
    margin-top: 4rem
}

@media only screen and (min-width: 768px) {
    .ws__sectionImage {
        margin-top: 4.8rem
    }
}

.ws__sectionImage+.ws__sectionImage {
    margin-top: 1rem
}

@media only screen and (min-width: 768px) {
    .ws__sectionImage+.ws__sectionImage {
        margin-top: 1.6rem
    }
}

.ws__sectionTable {
    margin-top: 2.4rem
}

@media only screen and (min-width: 768px) {
    .ws__sectionTable {
        margin-top: 3.2rem
    }
}

.ws__sectionTable th {
    width: 8.6rem;
    color: #a6a6a6;
    font-size: 1.3rem;
    line-height: 1.4;
    text-align: left;
    vertical-align: top
}

@media only screen and (min-width: 768px) {
    .ws__sectionTable th {
        width: 14.8rem;
        font-size: 1.4rem
    }
}

.ws__sectionTable td {
    font-size: 1.3rem;
    line-height: 1.4;
    vertical-align: top
}

@media only screen and (min-width: 768px) {
    .ws__sectionTable td {
        font-size: 1.4rem
    }
}

.ws__sectionTable tr:not(:first-child) th,
.ws__sectionTable tr:not(:first-child) td {
    padding-top: 1.4rem
}

.ws__footer {
    margin-top: 4.8rem;
    padding: 0 4.2666666667%
}

@media only screen and (min-width: 768px) {
    .ws__footer {
        margin-top: 7.2rem;
        padding: 0 9.53125%
    }
}

.ws__pager {
    border-top: rgba(204, 204, 204, .4) 1px solid;
    padding-top: 4rem;
    display: flex;
    pointer-events: none
}

.ws__pager.-ar {
    justify-content: right
}

.ws__pager:before {
    content: "";
    display: block;
    width: 1px;
    background-color: #ccc;
    opacity: .4;
    order: 1
}

@media only screen and (min-width: 768px) {
    .ws__pager {
        padding-top: 7.2rem
    }

    .ws__pager:hover ._link:not(:hover) {
        opacity: .3
    }
}

.ws__pagerItem {
    box-sizing: border-box;
    width: calc(50% - .5px);
    display: flex;
    order: 0
}

.ws__pagerItem.-next {
    order: 2
}

.ws__pagerItem.-next ._link {
    padding: 1.3rem 0 2.1rem 2.1rem
}

@media only screen and (min-width: 768px) {
    .ws__pagerItem.-next ._link {
        padding: 1.9rem 0 3.6rem 7.4rem
    }
}

.ws__pagerItem ._link {
    box-sizing: border-box;
    width: 100%;
    display: flex;
    padding: 1.3rem 2.1rem 2.1rem 0;
    pointer-events: auto;
    transition: opacity .4s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .ws__pagerItem ._link {
        padding: 1.9rem 7.4rem 3.6rem 0;
        align-items: center
    }

    .ws__pagerItem ._link:hover .ws__pagerName,
    .ws__pagerItem ._link:hover .ws__pagerDescription {
        transform: translate3d(.8rem, 0, 0)
    }
}

.ws__pagerItem ._inner {
    width: 100%
}

.ws__pagerText {
    font-size: 1.3rem;
    line-height: .9;
    letter-spacing: -.02em
}

.ws__pagerName {
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.2;
    letter-spacing: -.04em;
    word-wrap: break-word;
    margin-top: 3.2rem;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .ws__pagerName {
        font-size: 3.4rem;
        margin-top: 4rem
    }
}

.ws__pagerDescription {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.4;
    margin-top: .6rem;
    transition: transform .4s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .ws__pagerDescription {
        font-size: 1.4rem;
        margin-top: 1rem
    }
}

.ws__toback {
    text-align: center;
    margin-top: 4rem;
    padding-top: 2.4rem;
    border-top: rgba(204, 204, 204, .4) 1px solid
}

@media only screen and (min-width: 768px) {
    .ws__toback {
        margin-top: 5.2rem;
        padding-top: 4.8rem
    }
}

.ws__modal {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    border: none;
    padding: 0;
    background-color: #44403f
}

.ws__modalInner,
.ws__modalSlider,
.ws__modalImage {
    width: 100%;
    height: 100%
}

.ws__modalSlider .splide__track,
.ws__modalSlider .splide__slide {
    height: 100%
}

.ws__modalImage ._image {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.ws__modalCaption {
    text-align: right;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: .8rem
}

.ws__modalCaption.is-hidden {
    visibility: hidden
}

@media only screen and (min-width: 768px) {
    .ws__modalCaption {
        padding: 1rem
    }
}

.ws__modalCaption ._text {
    color: #fff;
    font-size: 1.2rem;
    line-height: 1.2;
    text-shadow: 0px 0px .5rem rgba(0, 0, 0, .7)
}

@media only screen and (min-width: 768px) {
    .ws__modalCaption ._text {
        font-weight: 500
    }
}

.ws__modalClose {
    width: 3.2rem;
    height: 0;
    overflow: hidden;
    padding-top: 3.2rem;
    position: absolute;
    top: 2.4rem;
    right: 1.6rem;
    mix-blend-mode: exclusion
}

@media only screen and (min-width: 768px) {
    .ws__modalClose {
        top: 3.2rem;
        right: 4.8rem;
        transition: opacity .4s ease
    }

    .ws__modalClose:hover {
        opacity: .7
    }
}

.ws__modalClose:before,
.ws__modalClose:after {
    content: "";
    display: block;
    width: 2.4rem;
    height: 2px;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -1px 0 0 -1.2rem
}

.ws__modalClose:before {
    transform: rotate(45deg)
}

.ws__modalClose:after {
    transform: rotate(-45deg)
}

.about {
    padding-bottom: 9rem
}

@media only screen and (min-width: 768px) {
    .about {
        padding-bottom: 18.4rem
    }
}

.about__heading {
    padding: 11.3rem 6.4% 0
}

@media only screen and (min-width: 768px) {
    .about__heading {
        padding: 20.8rem 9.53125% 0
    }
}

.about__heading ._hdg {
    display: flex;
    flex-direction: column;
    gap: .8rem
}

@media only screen and (min-width: 768px) {
    .about__heading ._hdg {
        flex-direction: row;
        align-items: flex-end;
        gap: 3.4rem
    }
}

.about__heading ._hdg span {
    display: block
}

.about__heading ._hdg ._en span,
.about__heading ._hdg ._ja span {
    opacity: 0;
    transform: translate3d(0, 100%, 0)
}

.about__heading ._hdg ._en {
    font-weight: 600;
    font-size: 3.2rem;
    line-height: .85;
    letter-spacing: -.02em;
    overflow: hidden
}
@media only screen and (min-width: 768px) {
    .about__heading ._hdg ._en {
        font-size: 3.85rem
    }
}

.about__heading ._hdg ._ja {
    font-size: 1.1rem;
    line-height: 1.6;
    overflow: hidden
}

@media only screen and (min-width: 768px) {
    .about__heading ._hdg ._ja {
        font-size: 1.4rem
    }
}

.about__heading.is-visible ._hdg ._en span,
.about__heading.is-visible ._hdg ._ja span {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1), transform .8s cubic-bezier(.22, .61, .36, 1)
}

.about__heading.is-visible ._hdg ._ja span {
    transition-delay: .2s
}

.about__kv {
    margin-top: 3.1rem
}

@media only screen and (min-width: 768px) {
    .about__kv {
        margin-top: 4rem
    }
}

.about__body {
    margin-top: 11.8rem;
    padding: 0 6.4%
}

@media only screen and (min-width: 768px) {
    .about__body {
        margin-top: 14.4rem;
        padding: 0 9.53125%
    }
}

.about__footer {
    text-align: center;
    margin: 4rem 6.4% 0
}

@media only screen and (min-width: 768px) {
    .about__footer {
        margin: 7.2rem 9.53125% 0
    }
}

.about__footer:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #bfbfbf;
    opacity: .4;
    margin-bottom: 2.4rem;
    transform: scaleX(1);
    transform-origin: left top;
    transition: transform 1.2s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .about__footer:before {
        margin-bottom: 4.8rem
    }
}

.about__footer.is-hidden:before {
    transform: scaleX(0);
    transition: none
}

.about__footer.is-hidden .about__footerLink {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__footer.is-hidden .about__footerLink {
        transform: translate3d(0, 2rem, 0)
    }
}

.about__content+.about__content {
    margin-top: 7.8rem
}

@media only screen and (min-width: 768px) {
    .about__content+.about__content {
        margin-top: 14.3rem
    }
}

.about__content+.about__content:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #bfbfbf;
    opacity: .4;
    margin-bottom: 7.9rem;
    transform: scaleX(1);
    transform-origin: left top;
    transition: transform 1.2s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .about__content+.about__content:before {
        margin-bottom: 14.6rem
    }
}

.about__content+.about__content.is-hidden:before {
    transform: scaleX(0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__content ._lyt {
        display: flex
    }
}

@media only screen and (min-width: 768px) {
    .about__hdg02 {
        width: 50%;
        padding: .6rem 0 11.6rem
    }
}

.about__hdg02 ._hdg {
    font-size: 1.3rem;
    letter-spacing: -.02em;
    overflow: hidden
}

@media only screen and (min-width: 768px) {
    .about__hdg02 ._hdg.-sticky {
        position: sticky;
        top: 14.9rem
    }
}

.about__hdg02 span {
    display: inline-block;
    font-size: 3rem;
    display: block;
    font-weight: 500;
    line-height: 1.2;
    opacity: 1;
    transition-property: opacity, transform;
    transition-duration: .8s;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.about__hdg02.is-hidden span {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
    transition: none
}

.about__contentColumn {
    margin-top: 3rem
}

@media only screen and (min-width: 768px) {
    .about__contentColumn {
        width: 50%;
        margin-top: 0
    }
}

.about__contentlead {
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1.6;
    transition-delay: 75ms
}

.about__contentColumn.is-hidden .about__contentlead {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__contentColumn.is-hidden .about__contentlead {
        transform: translate3d(0, 3.5rem, 0)
    }
}

@media only screen and (min-width: 768px) {
    .about__contentlead {
        font-size: 2.8rem
    }
}

.about__contentDescription {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.8;
    margin-top: 4.8rem;
    transition-delay: .15s
}

.about__contentColumn.is-hidden .about__contentDescription {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__contentColumn.is-hidden .about__contentDescription {
        transform: translate3d(0, 3.5rem, 0)
    }
}

@media only screen and (min-width: 768px) {
    .about__contentDescription {
        line-height: 2.5;
        margin-top: 2rem
    }
}

.about__contentDescription+.about__contentDescription {
    margin-top: 1.3rem;
    transition-delay: .225s
}

@media only screen and (min-width: 768px) {
    .about__contentDescription+.about__contentDescription {
        margin-top: 1.7rem
    }
}

.about__section {
    margin-top: 3rem
}

@media only screen and (min-width: 768px) {
    .about__section {
        margin-top: 4.8rem
    }
}

.about__section+.about__section {
    margin-top: 4rem
}

@media only screen and (min-width: 768px) {
    .about__section+.about__section {
        margin-top: 7.2rem
    }
}

.about__section+.about__section:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #bfbfbf;
    opacity: .4;
    margin-bottom: 4.8rem;
    transform: scaleX(1);
    transform-origin: left top;
    transition: transform 1.2s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .about__section+.about__section:before {
        margin-bottom: 10rem
    }
}

.about__section+.about__section.is-hidden:before {
    transform: scaleX(0);
    transition: none
}

.about__sectionHdg {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.6;
    overflow: hidden
}

.about__sectionHdg span {
    display: inline-block;
    opacity: 1;
    transition-property: opacity, transform;
    transition-duration: .8s;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.about__sectionHdg.is-hidden span {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__sectionHdg {
        font-size: 1.8rem
    }
}

.about__sectionLyt {
    margin-top: 2rem
}

@media only screen and (min-width: 768px) {
    .about__sectionLyt {
        margin-top: 3.2rem;
        display: flex;
    }
}

.about__sectionImage {
    overflow: hidden;
    border-radius: .4rem;
    opacity: 1;
    transition: opacity 1.3s ease
}

.about__sectionImage.is-hidden {
    opacity: 0;
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__sectionImage {
        width: 42.8571428571%
    }
}

.about__sectionBody {
    margin-top: 2rem
}

@media only screen and (min-width: 768px) {
    .about__sectionBody {
        margin-top: 0;
        width: 50%;
        margin-left: auto
    }
}

.about__sectionDescription {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.6;
    transition-delay: 75ms
}

.about__sectionBody.is-hidden .about__sectionDescription {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__sectionBody.is-hidden .about__sectionDescription {
        transform: translate3d(0, 3.5rem, 0)
    }
}

.about__sectionDescription+.about__sectionDescription {
    transition-delay: .15s
}

@media only screen and (min-width: 768px) {
    .about__sectionDescription {
        font-size: 1.4rem;
        font-weight: 700;
        line-height: 2
    }

    .about__sectionDescription+.about__sectionDescription {
        margin-top: .8rem
    }
}

.about__business {
    display: flex;
    flex-direction: column-reverse;
    gap: 2rem;
    margin-top: 2rem
}

@media only screen and (min-width: 768px) {
    .about__business {
        gap: 3.2rem;
        margin-top: 4rem
    }
}

.about__business+.about__business {
    margin-top: 4.1rem
}

@media only screen and (min-width: 768px) {
    .about__business+.about__business {
        margin-top: 7.1rem
    }
}

.about__businessImage {
    overflow: hidden;
    border-radius: .4rem;
    opacity: 1;
    transition: opacity 1.3s ease
}

.about__businessImage.is-hidden {
    opacity: 0;
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__businessBody {
        width: 50%;
        margin-left: auto
    }
}

.about__businessHdg {
    display: flex;
    justify-content: space-between
}

.about__businessBody.is-hidden .about__businessHdg {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__businessBody.is-hidden .about__businessHdg {
        transform: translate3d(0, 2rem, 0)
    }
}

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

@media only screen and (min-width: 768px) {
    .about__businessHdg ._ja {
        font-size: 2.4rem
    }
}

.about__businessHdg ._en {
    font-size: 1.1rem;
    line-height: .85;
    letter-spacing: -.02em;
    margin-top: .5rem
}

@media only screen and (min-width: 768px) {
    .about__businessHdg ._en {
        font-size: 1.2rem;
        margin-top: .8rem
    }
}

.about__businessDescription {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.6;
    margin-top: .6rem;
    transition-delay: 75ms
}

.about__businessBody.is-hidden .about__businessDescription {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__businessBody.is-hidden .about__businessDescription {
        transform: translate3d(0, 2rem, 0)
    }
}

@media only screen and (min-width: 768px) {
    .about__businessDescription {
        font-size: 1.4rem;
        line-height: 2;
        margin-top: 1rem
    }
}

.about__businessLink {
    margin-top: 2.6rem;
    transition-delay: .15s
}

.about__businessBody.is-hidden .about__businessLink {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {
    .about__businessBody.is-hidden .about__businessLink {
        transform: translate3d(0, 2rem, 0)
    }
}

@media only screen and (min-width: 768px) {
    .about__businessLink {
        margin-top: 2rem
    }
}

.about__strength {
    display: flex
}

.about__strength.is-hidden {
    opacity: 0;
    transition: none
}

.about__strength+.about__strength {
    margin-top: 3.8rem;
    padding-top: 4.2rem;
    border-top: rgba(191, 191, 191, .4) 1px solid
}

@media only screen and (min-width: 768px) {
    .about__strength+.about__strength {
        margin-top: 7rem;
        padding-top: 8rem
    }
}

.about__strengthHeading {
    width: 17.125382263%;
    padding-top: .6rem
}

@media only screen and (min-width: 768px) {
    .about__strengthHeading {
        width: 14.2857142857%;
        padding-top: .8rem
    }
}

.about__strengthHeading ._hdg {
    font-size: 1.3rem;
    line-height: .9;
    letter-spacing: -.02em
}

.about__strengthBody {
    flex: 1
}

.about__strengthBody ._lead {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.6;
    transition-delay: .15s
}

@media only screen and (min-width: 768px) {
    .about__strengthBody ._lead {
        font-size: 2.4rem
    }
}

.about__strengthBody ._description {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.6;
    margin-top: 1.6rem;
    transition-delay: .225s
}

@media only screen and (min-width: 768px) {
    .about__strengthBody ._description {
        font-size: 1.4rem;
        line-height: 2;
        margin-top: 1.4rem
    }
}

.about__strength.is-hidden .about__strengthBody ._lead,
.about__strength.is-hidden .about__strengthBody ._description {
    opacity: 0;
    transform: translate3d(0, .5rem, 0);
    transition: none
}

@media only screen and (min-width: 768px) {

    .about__strength.is-hidden .about__strengthBody ._lead,
    .about__strength.is-hidden .about__strengthBody ._description {
        transform: translate3d(0, 1.5rem, 0)
    }
}

.news {
    padding: 11.4rem 0 8.8rem
}

@media only screen and (min-width: 768px) {
    .news {
        padding: 18.4rem 0
    }
}

.news__list {
    margin-top: 3.2rem;
    pointer-events: none
}

@media only screen and (min-width: 768px) {
    .news__list {
        margin-top: 5.6rem
    }

    .news__list:hover ._link:not(:hover) {
        opacity: .3
    }
}

.news__item {
    transition: opacity 1s cubic-bezier(.22, .61, .36, 1)
}

.news__item:first-child:before,
.news__item:after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #bfbfbf;
    opacity: .4
}

.news__item.is-hidden {
    opacity: 0;
    transition: none
}

.news__item ._link {
    display: block;
    padding: 3.2rem 0;
    pointer-events: auto;
    transition: opacity .4s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .news__item ._link {
        display: flex;
        align-items: flex-start;
        padding: 5.6rem 0;
        transition: opacity .4s cubic-bezier(.22, .61, .36, 1)
    }

    .news__item ._link:hover .news__itemBody ._description span {
        background-size: 100% 1px
    }
}

.news__itemHeading {
    display: flex;
    color: #a6a6a6;
    font-size: 1.2rem;
    line-height: .85;
    letter-spacing: -.02em
}

@media only screen and (min-width: 768px) {
    .news__itemHeading {
        width: 22.2rem;
        padding-top: .8rem
    }
}

.news__itemHeading ._category {
    margin-left: .8rem;
    padding-left: .8rem;
    border-left: #BFBFBF 1px solid
}

.news__itemBody {
    margin-top: 1.6rem
}

@media only screen and (min-width: 768px) {
    .news__itemBody {
        margin-top: 0;
        flex: 1
    }
}

.news__itemBody ._description {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.8;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    max-height: 5rem
}

.news__itemBody ._description span {
    background-image: linear-gradient(90deg, #44403f, #44403f);
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: 0 1px;
    transition: background-size .4s cubic-bezier(.22, .61, .36, 1)
}

.ns {
    padding: 11.5rem 4.2666666667% 8.8rem
}

@media only screen and (min-width: 768px) {
    .ns {
        padding: 18.4rem 15.3125%
    }
}

.ns__header {
    padding-bottom: 2rem;
    border-bottom: #ccc 1px solid
}

@media only screen and (min-width: 768px) {
    .ns__header {
        padding-bottom: 3rem
    }
}

.ns__title {
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.6
}

@media only screen and (min-width: 768px) {
    .ns__title {
        font-size: 2.8rem
    }
}

.ns__info {
    margin-top: 2rem;
    display: flex;
    color: #a6a6a6;
    font-size: 1.1rem;
    line-height: .85;
    letter-spacing: -.02em
}

@media only screen and (min-width: 768px) {
    .ns__info {
        margin-top: 2.8rem;
        font-size: 1.2rem
    }
}

.ns__info ._category {
    margin-left: .8rem;
    padding-left: .7rem;
    border-left: #BFBFBF 1px solid
}

.ns__body {
    margin-top: 3.9rem
}

@media only screen and (min-width: 768px) {
    .ns__body {
        margin-top: 6rem
    }
}

.ns__content+.ns__content {
    margin-top: 3.9rem;
    padding-top: 4rem;
    border-top: #ccc 1px solid
}

@media only screen and (min-width: 768px) {
    .ns__content+.ns__content {
        margin-top: 6rem;
        padding-top: 6rem
    }
}

.ns__contentTitle {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6;
    font-feature-settings: normal;
    margin-bottom: 3.9rem
}

@media only screen and (min-width: 768px) {
    .ns__contentTitle {
        font-size: 2.4rem;
        margin-bottom: 6rem
    }
}

.ns__contentImage {
    overflow: hidden;
    border-radius: .4rem;
    margin-top: 3.9rem
}

@media only screen and (min-width: 768px) {
    .ns__contentImage {
        margin-top: 6rem
    }

    .ns__contentImage.-narrow {
        width: 50%;
        margin: 6rem auto 0
    }
}

.ns__contentDescription {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2;
    font-feature-settings: normal;
    margin-top: 4.1rem
}

@media only screen and (min-width: 768px) {
    .ns__contentDescription {
        font-size: 1.4rem;
        margin-top: 6rem
    }
}

.ns__contentDescription a {
    text-decoration: underline
}

.ns__contentDescription a:hover {
    text-decoration: none
}

.ns__footer {
    margin-top: 3.9rem;
    padding-top: 8.7rem;
    border-top: #ccc 1px solid
}

@media only screen and (min-width: 768px) {
    .ns__footer {
        margin-top: 6rem;
        padding-top: 10rem
    }
}

.ns__pager {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative
}

.ns__pagerArrow.-next {
    margin-left: auto
}

.ns__pagerArrow.-next ._link {
    flex-direction: row-reverse
}

.ns__pagerArrow.-next ._icon {
    transform: rotate(180deg)
}

.ns__pagerArrow ._link {
    font-size: 1.3rem;
    line-height: .85;
    letter-spacing: -.02em;
    display: flex;
    align-items: center;
    gap: 1.2rem;
    transition: opacity .4s ease
}

@media only screen and (min-width: 768px) {
    .ns__pagerArrow ._link:hover {
        opacity: .7
    }

    .ns__pagerArrow ._link:hover ._text:before {
        transform: scaleX(1);
        transform-origin: left top
    }
}

.ns__pagerArrow ._icon {
    width: 1.6rem
}

.ns__pagerArrow ._text {
    position: relative
}

.ns__pagerArrow ._text:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #44403f;
    position: absolute;
    bottom: -.3rem;
    left: 0;
    transform: scaleX(0);
    transform-origin: right top;
    transition: transform .25s cubic-bezier(.22, .61, .36, 1)
}

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

.ns__pagerToback ._link {
    display: block;
    font-size: 1.3rem;
    line-height: .85;
    letter-spacing: -.02em;
    white-space: nowrap;
    transition: opacity .4s ease;
    position: relative
}

.ns__pagerToback ._link:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #44403f;
    position: absolute;
    bottom: -.3rem;
    left: 0;
    transform: scaleX(0);
    transform-origin: right top;
    transition: transform .25s cubic-bezier(.22, .61, .36, 1)
}

@media only screen and (min-width: 768px) {
    .ns__pagerToback ._link:hover {
        opacity: .7
    }

    .ns__pagerToback ._link:hover:before {
        transform: scaleX(1);
        transform-origin: left top
    }
}

.company {
    padding-bottom: 8.8rem
}

@media only screen and (min-width: 768px) {
    .company {
        padding-bottom: 18.4rem
    }
}

.company__heading {
    padding: 11rem 4.2666666667% 0
}

@media only screen and (min-width: 768px) {
    .company__heading {
        padding: 17.7rem 9.53125% 0
    }
}

.company__heading ._hdg {
    font-weight: 600;
    font-size: 3.2rem;
    letter-spacing: -.02em;
    overflow: hidden
}

.company__heading ._hdg span {
    display: inline-block;
    opacity: 0;
    transform: translate3d(0, 100%, 0)
}

@media only screen and (min-width: 768px) {
    .company__heading ._hdg {
        font-size: 3.85rem
    }
}

.company__heading.is-visible ._hdg span {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1), transform .8s cubic-bezier(.22, .61, .36, 1)
}

.company__kv {
    margin: 2.6rem 6.4% 0 4.2666666667%;
    overflow: hidden;
    border-radius: .4rem
}

@media only screen and (min-width: 768px) {
    .company__kv {
        margin: 4rem 9.53125% 0
    }
}

.company__body {
    margin-top: 4rem;
    padding: 0 4.2666666667%
}

@media only screen and (min-width: 768px) {
    .company__body {
        margin-top: 6.2rem;
        padding: 0 9.53125%
    }
}

.company__table {
    width: 100%;
    border-top: rgba(191, 191, 191, .4) 1px solid
}

@media only screen and (max-width: 767px) {

    .company__table tbody,
    .company__table tr,
    .company__table th,
    .company__table td {
        display: block
    }
}

.company__table th {
    color: #a6a6a6;
    font-size: 1.3rem;
    line-height: 1.4;
    text-align: left;
    padding-top: 2.6rem
}

@media only screen and (min-width: 768px) {
    .company__table th {
        width: 22.2rem;
        font-size: 1.4rem;
        vertical-align: middle;
        border-bottom: rgba(191, 191, 191, .4) 1px solid;
        padding: 3.6rem 0
    }
}

.company__table td {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.4;
    border-bottom: rgba(191, 191, 191, .4) 1px solid;
    padding: .8rem 0 2.5rem
}

@media only screen and (min-width: 768px) {
    .company__table td {
        font-size: 1.4rem;
        line-height: 1.8;
        padding: 3.3rem 0
    }
}

.company__table a {
    text-decoration: underline
}

.company__table a:hover {
    text-decoration: none
}

.company__table ._map {
    display: inline-block
}

.company__table ._map:after {
    content: "";
    display: inline-block;
    width: 1rem;
    height: 1rem;
    background: url(/assets/images/common/icon_blank.svg) no-repeat;
    background-position: center center;
    background-size: contain;
    vertical-align: text-top;
    margin-left: .3rem
}

.company__table ._list {
    line-height: 1.8;
    list-style: disc;
    padding-left: 2rem
}

.pp {
    padding-bottom: 8.8rem
}

@media only screen and (min-width: 768px) {
    .pp {
        padding-bottom: 21.2rem
    }
}

.pp__heading {
    padding: 11rem 4.2666666667% 0
}

@media only screen and (min-width: 768px) {
    .pp__heading {
        padding: 17.7rem 15.3125% 0
    }
}

.pp__heading ._hdg {
    font-weight: 600;
    font-size: 3.2rem;
    letter-spacing: -.02em;
    overflow: hidden
}

.pp__heading ._hdg span {
    display: inline-block;
    opacity: 0;
    transform: translate3d(0, 100%, 0)
}

@media only screen and (min-width: 768px) {
    .pp__heading ._hdg {
        font-size: 3.85rem
    }
}

.pp__heading.is-visible ._hdg span {
    opacity: 1;
    transform: translateZ(0);
    transition: opacity .8s cubic-bezier(.22, .61, .36, 1), transform .8s cubic-bezier(.22, .61, .36, 1)
}

.pp__body {
    margin: 3.4rem 4.2666666667% 0;
    padding-top: 3.3rem;
    border-top: #ccc 1px solid
}

@media only screen and (min-width: 768px) {
    .pp__body {
        margin: 4.5rem 15.3125% 0;
        padding-top: 4.8rem
    }
}

.pp__block+.pp__block {
    margin-top: 2.4rem
}

.pp__hdg {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: .9rem
}

@media only screen and (min-width: 768px) {
    .pp__hdg {
        font-size: 2rem;
        margin-bottom: .8rem
    }
}

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

@media only screen and (min-width: 768px) {
    .pp__description {
        font-size: 1.4rem;
        line-height: 2
    }
}

.pp__description+.pp__description {
    margin-top: 1.5em
}

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

@media only screen and (min-width: 768px) {
    .pp__list {
        font-size: 1.4rem;
        line-height: 2
    }
}

.pp__list ._item {
    counter-increment: number;
    display: flex;
    flex-wrap: wrap
}

.pp__list ._item:before {
    content: counter(number) ".";
    box-sizing: border-box;
    width: 2rem;
    padding-left: .3rem
}

.pp__list ._col {
    flex: 1
}

.pp__child ._childItem {
    counter-increment: alphabet;
    display: flex
}

.pp__child ._childItem:before {
    content: counter(alphabet, lower-alpha) ".";
    box-sizing: border-box;
    width: 1.9rem;
    padding-left: .3rem
}

.nf {
    padding-bottom: 8.8rem
}

@media only screen and (min-width: 768px) {
    .nf {
        padding-bottom: 18.4rem
    }
}

.nf__heading {
    padding: 11rem 4.2666666667% 0
}

@media only screen and (min-width: 768px) {
    .nf__heading {
        padding: 18.4rem 9.53125% 0
    }
}

.nf__heading ._hdg {
    font-weight: 600;
    font-size: 3.2rem;
    line-height: .85;
    letter-spacing: -.02em;
    overflow: hidden
}

@media only screen and (min-width: 768px) {
    .nf__heading ._hdg {
        font-size: 3.85rem
    }
}

.nf__body {
    margin-top: 3.2rem;
    padding: 0 4.2666666667%
}

@media only screen and (min-width: 768px) {
    .nf__body {
        margin-top: 4.8rem;
        padding: 0 9.53125%
    }
}

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

@media only screen and (min-width: 768px) {
    .nf__lead {
        font-size: 2.4rem
    }
}

.nf__description {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.6;
    margin-top: .8rem
}

@media only screen and (min-width: 768px) {
    .nf__description {
        font-size: 1.4rem;
        line-height: 2
    }
}

.nf__totop {
    margin: 4rem 2.332361516% 0
}

@media only screen and (min-width: 768px) {
    .nf__totop {
        width: 29.6rem;
        margin: 5.6rem auto 0
    }
}

.contact {
    padding-bottom: 8.8rem
}

@media only screen and (min-width: 768px) {
    .contact {
        padding-bottom: 18.4rem
    }
}

.contact__heading {
    padding: 11.4rem 4.2666666667% 0
}

@media only screen and (min-width: 768px) {
    .contact__heading {
        padding: 18.4rem 9.53125% 0
    }
}

.contact__heading ._hdg {
    font-weight: 600;
    font-size: 3.2rem;
    letter-spacing: -.02em;
    overflow: hidden
}

@media only screen and (min-width: 768px) {
    .contact__heading ._hdg {
        font-size: 3.85rem
    }
}

.contact__heading ._description {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.8;
    margin-top: 2.8rem
}

@media only screen and (min-width: 768px) {
    .contact__heading ._description {
        font-size: 1.4rem;
        margin-top: 4rem
    }
}

.contact__heading ._tel {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: .85;
    letter-spacing: -.02em;
    margin-top: 2rem
}

@media only screen and (min-width: 768px) {
    .contact__heading ._tel {
        font-size: 1.5rem;
        margin-top: 2rem
    }
}

.contact__heading ._note {
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.8;
    margin-top: .4rem
}

@media only screen and (min-width: 768px) {
    .contact__heading ._note {
        font-size: 1.2rem
    }
}

.contact__heading ._required {
    color: #d72c00;
    font-size: 1.2rem;
    line-height: 1;
    text-align: right;
    margin-top: 2.4rem
}

@media only screen and (min-width: 768px) {
    .contact__heading ._required {
        font-size: 1.3rem;
        margin-top: 2.7rem
    }
}

.contact__body {
    margin: 1.2rem 4.2666666667% 0;
    border-top: rgba(191, 191, 191, .4) 1px solid;
    --display-normal: none;
    --display-confirm: block
}

.contact__body[data-state=confirming] {
    margin-top: 3.4rem;
    --display-normal: block;
    --display-confirm: none
}

@media only screen and (min-width: 768px) {
    .contact__body[data-state=confirming] {
        margin-top: 5rem
    }
}

@media only screen and (min-width: 768px) {
    .contact__body {
        margin: 1.6rem 9.53125% 0
    }
}

.thanks__body {
    margin: 2.8rem 4.2666666667% 0
}

@media only screen and (min-width: 768px) {
    .thanks__body {
        margin: 4rem 9.53125% 0
    }
}

.thanks__description {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.8
}

@media only screen and (min-width: 768px) {
    .thanks__description {
        font-size: 1.4rem
    }
}

.thanks__description+.thanks__description {
    margin-top: 1.5em
}

.thanks__totop {
    margin: 4rem 2.332361516% 0
}

@media only screen and (min-width: 768px) {
    .thanks__totop {
        width: 29.6rem;
        margin: 5.6rem auto 0
    }
}

.contact__footer {
    display: flex;
    flex-direction: column-reverse;
    gap: 1.6rem;
    margin: 4rem 2.332361516% 0
}

.contact__footer ._button.-normal {
    display: var(--display-confirm)
}

.contact__footer ._button.-confirm {
    display: var(--display-normal)
}

@media only screen and (min-width: 768px) {
    .contact__footer {
        flex-direction: row;
        justify-content: center;
        margin: 5.6rem 0 0
    }

    .contact__footer ._button {
        width: 29.6rem
    }
}

.contact__row {
    padding: 2.4rem 0;
    border-bottom: rgba(191, 191, 191, .4) 1px solid
}

@media only screen and (min-width: 768px) {
    .contact__row {
        display: flex;
        align-items: flex-start;
        padding: 3.2rem 0
    }
}

.contact__rowLabel {
    display: flex;
    align-items: center;
    gap: .4rem
}

@media only screen and (min-width: 768px) {
    .contact__rowLabel {
        box-sizing: border-box;
        width: 29.6rem;
        padding: 1.5rem 4.8rem 0 0
    }
}

.contact__rowLabel ._label {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.4
}

@media only screen and (min-width: 768px) {
    .contact__rowLabel ._label {
        font-size: 1.4rem
    }
}

.contact__rowLabel ._required {
    color: #d72c00;
    font-size: 1.4rem;
    line-height: 1.8;
    display: var(--display-confirm)
}

@media only screen and (min-width: 768px) {
    .contact__rowLabel ._required {
        font-size: 1.5rem
    }
}

.contact__rowColumn {
    margin-top: .8rem
}

@media only screen and (min-width: 768px) {
    .contact__rowColumn {
        flex: 1;
        margin-top: 0
    }
}

.contact__rowColumn ._confirm {
    font-size: 1.3rem;
    line-height: 1.8;
    display: none
}

@media only screen and (min-width: 768px) {
    .contact__rowColumn ._confirm {
        font-size: 1.4rem;
        padding: 1.4rem 1.6rem
    }
}

.contact__rowColumn ._text {
    font-size: 1.3rem;
    line-height: 1.8;
    padding-top: 2rem
}

@media only screen and (min-width: 768px) {
    .contact__rowColumn ._text {
        font-size: 1.4rem;
        padding-top: 1.4rem
    }
}

.contact__rowColumn ._text a {
    text-decoration: underline
}

.contact__rowColumn ._text a:hover {
    text-decoration: none
}

.contact__body[data-state=confirming] .contact__rowColumn ._confirm {
    display: block
}

.contact__body[data-state=confirming] .contact__item {
    display: none
}

.contact__inputText,
.contact__inputTextArea {
    box-sizing: border-box;
    height: 5.1rem;
    font-size: 1.3rem;
    background-color: #fff;
    border-radius: .4rem;
    padding: 1.4rem 1.6rem;
    border: transparent 1px solid;
    cursor: text
}

.contact__body.is-invalid .contact__inputText.wpcf7-not-valid,
.contact__body.is-invalid .contact__inputTextArea.wpcf7-not-valid {
    border-color: #d72c00
}

@media only screen and (min-width: 768px) {

    .contact__inputText,
    .contact__inputTextArea {
        height: 5.3rem;
        font-size: 1.4rem
    }
}

.contact__inputText::placeholder,
.contact__inputTextArea::placeholder {
    color: #a6a6a6
}

.contact__inputTextArea {
    height: 12rem
}

@media only screen and (min-width: 768px) {
    .contact__inputTextArea {
        height: 12.8rem
    }
}

.contact__select {
    position: relative
}

.contact__select:after {
    content: "";
    display: block;
    position: absolute;
    top: 2.25rem;
    right: 1.7rem;
    border-style: solid;
    border-color: #44403F transparent transparent transparent;
    border-width: .6rem .4rem 0 .4rem;
    pointer-events: none
}

@media only screen and (min-width: 768px) {
    .contact__select:after {
        top: 2.35rem
    }
}

.contact__select select {
    box-sizing: border-box;
    height: 5.1rem;
    font-size: 1.3rem;
    background-color: #fff;
    border-radius: .4rem;
    padding: 1.4rem 1.6rem;
    border: transparent 1px solid
}

.contact__body.is-invalid .contact__select select.wpcf7-not-valid {
    border-color: #d72c00
}

@media only screen and (min-width: 768px) {
    .contact__select select {
        height: 5.3rem;
        font-size: 1.4rem
    }
}

.contact__inputAccept {
    font-size: 1.3rem;
    line-height: 1;
    margin-top: 2.2rem
}

@media only screen and (min-width: 768px) {
    .contact__inputAccept {
        font-size: 1.4rem;
        margin-top: 1.8rem
    }
}

.contact__inputAccept span {
    display: block;
    margin: 0
}

.contact__inputAccept label {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 1.5rem
}

.contact__inputAccept label span {
    flex: 1
}

.contact__inputAccept label span:before {
    content: "";
    display: block;
    width: 1.6rem;
    height: 1.6rem;
    background: url(/assets/images/common/icon_check.svg) no-repeat;
    background-position: center center;
    background-size: 1.1rem auto;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}

.contact__inputAccept input[type=checkbox] {
    box-sizing: border-box;
    width: 1.6rem;
    height: 1.6rem;
    background-color: #fff;
    border: #A6A6A6 1px solid;
    border-radius: .2rem
}

.contact__inputAccept input[type=checkbox]:checked+span:before {
    opacity: 1
}

.contact__confirm[disabled] {
    pointer-events: none;
    opacity: .4
}

.contact__prev {
    background-color: #a6a6a6;
    border-color: #a6a6a6
}

@media only screen and (min-width: 768px) {
    .contact__prev {
        transition: opacity .4s ease
    }

    .contact__prev:hover {
        color: #fff;
        background-color: #a6a6a6;
        opacity: .7
    }
}

.contact__item {
    position: relative
}

.contact__item .wpcf7-not-valid-tip {
    display: none
}

.contact__item ._error {
    color: #d72c00;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1;
    margin-top: .8rem;
    display: none
}

@media only screen and (min-width: 768px) {
    .contact__item ._error {
        position: absolute;
        top: 100%;
        left: 0
    }
}

.contact__body[data-state=invalid] .contact__item ._error {
    display: block
}

.wpcf7-spinner {
    display: none !important
}

.contact__response,
.contact .wpcf7 form .wpcf7-response-output {
    color: #d72c00;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    border: none;
    margin: 3rem 0 0;
    padding: 0
}

.contact__response {
    display: none
}

.grecaptcha-badge {
    visibility: hidden
}

.splide__container {
    box-sizing: border-box;
    position: relative
}

.splide__list {
    backface-visibility: hidden;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important
}

.splide.is-initialized:not(.is-active) .splide__list {
    display: block
}

.splide__pagination {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    pointer-events: none
}

.splide__pagination li {
    display: inline-block;
    line-height: 1;
    list-style-type: none;
    margin: 0;
    pointer-events: auto
}

.splide:not(.is-overflow) .splide__pagination {
    display: none
}

.splide__progress__bar {
    width: 0
}

.splide {
    position: relative;
    visibility: hidden
}

.splide.is-initialized,
.splide.is-rendered {
    visibility: visible
}

.splide__slide {
    backface-visibility: hidden;
    box-sizing: border-box;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    list-style-type: none !important;
    margin: 0;
    position: relative
}

.splide__slide img {
    vertical-align: bottom
}

.splide__spinner {
    animation: splide-loading 1s linear infinite;
    border: 2px solid #999;
    border-left-color: transparent;
    border-radius: 50%;
    bottom: 0;
    contain: strict;
    display: inline-block;
    height: 20px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 20px
}

.splide__sr {
    clip: rect(0 0 0 0);
    border: 0;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.splide__toggle.is-active .splide__toggle__play,
.splide__toggle__pause {
    display: none
}

.splide__toggle.is-active .splide__toggle__pause {
    display: inline
}

.splide__track {
    overflow: hidden;
    position: relative;
    z-index: 0
}

@keyframes splide-loading {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(1turn)
    }
}

.splide__track--draggable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.splide__track--fade>.splide__list>.splide__slide {
    margin: 0 !important;
    opacity: 0;
    z-index: 0
}

.splide__track--fade>.splide__list>.splide__slide.is-active {
    opacity: 1;
    z-index: 1
}

.splide--rtl {
    direction: rtl
}

.splide__track--ttb>.splide__list {
    display: block
}

.splide__arrow {
    -ms-flex-align: center;
    align-items: center;
    background: #ccc;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    display: -ms-flexbox;
    display: flex;
    height: 2em;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2em;
    z-index: 1
}

.splide__arrow svg {
    fill: #000;
    height: 1.2em;
    width: 1.2em
}

.splide__arrow:hover:not(:disabled) {
    opacity: .9
}

.splide__arrow:disabled {
    opacity: .3
}

.splide__arrow:focus-visible {
    outline: 3px solid #0bf;
    outline-offset: 3px
}

.splide__arrow--prev {
    left: 1em
}

.splide__arrow--prev svg {
    transform: scaleX(-1)
}

.splide__arrow--next {
    right: 1em
}

.splide.is-focus-in .splide__arrow:focus {
    outline: 3px solid #0bf;
    outline-offset: 3px
}

.splide__pagination {
    bottom: .5em;
    left: 0;
    padding: 0 1em;
    position: absolute;
    right: 0;
    z-index: 1
}

.splide__pagination__page {
    background: #ccc;
    border: 0;
    border-radius: 50%;
    display: inline-block;
    height: 8px;
    margin: 3px;
    opacity: .7;
    padding: 0;
    position: relative;
    transition: transform .2s linear;
    width: 8px
}

.splide__pagination__page.is-active {
    background: #fff;
    transform: scale(1.4);
    z-index: 1
}

.splide__pagination__page:hover {
    cursor: pointer;
    opacity: .9
}

.splide__pagination__page:focus-visible {
    outline: 3px solid #0bf;
    outline-offset: 3px
}

.splide.is-focus-in .splide__pagination__page:focus {
    outline: 3px solid #0bf;
    outline-offset: 3px
}

.splide__progress__bar {
    background: #ccc;
    height: 3px
}

.splide__slide {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

.splide__slide:focus {
    outline: 0
}

@supports (outline-offset:-3px) {
    .splide__slide:focus-visible {
        outline: 3px solid #0bf;
        outline-offset: -3px
    }
}

@media screen and (-ms-high-contrast:none) {
    .splide__slide:focus-visible {
        border: 3px solid #0bf
    }
}

@supports (outline-offset:-3px) {
    .splide.is-focus-in .splide__slide:focus {
        outline: 3px solid #0bf;
        outline-offset: -3px
    }
}

@media screen and (-ms-high-contrast:none) {
    .splide.is-focus-in .splide__slide:focus {
        border: 3px solid #0bf
    }

    .splide.is-focus-in .splide__track>.splide__list>.splide__slide:focus {
        border-color: #0bf
    }
}

.splide__toggle {
    cursor: pointer
}

.splide__toggle:focus-visible {
    outline: 3px solid #0bf;
    outline-offset: 3px
}

.splide.is-focus-in .splide__toggle:focus {
    outline: 3px solid #0bf;
    outline-offset: 3px
}

.splide__track--nav>.splide__list>.splide__slide {
    border: 3px solid transparent;
    cursor: pointer
}

.splide__track--nav>.splide__list>.splide__slide.is-active {
    border: 3px solid #000
}

.splide__arrows--rtl .splide__arrow--prev {
    left: auto;
    right: 1em
}

.splide__arrows--rtl .splide__arrow--prev svg {
    transform: scaleX(1)
}

.splide__arrows--rtl .splide__arrow--next {
    left: 1em;
    right: auto
}

.splide__arrows--rtl .splide__arrow--next svg {
    transform: scaleX(-1)
}

.splide__arrows--ttb .splide__arrow {
    left: 50%;
    transform: translate(-50%)
}

.splide__arrows--ttb .splide__arrow--prev {
    top: 1em
}

.splide__arrows--ttb .splide__arrow--prev svg {
    transform: rotate(-90deg)
}

.splide__arrows--ttb .splide__arrow--next {
    bottom: 1em;
    top: auto
}

.splide__arrows--ttb .splide__arrow--next svg {
    transform: rotate(90deg)
}

.splide__pagination--ttb {
    bottom: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    left: auto;
    padding: 1em 0;
    right: .5em;
    top: 0
}