body {
    font-weight: 400;
    letter-spacing: .04em;
    overflow-x: hidden
}

body .js-scroll-fade {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity .7s, transform .7s
}

body .js-scroll-fade.is-add-visible,
body .js-scroll-fade.is-on,
body .js-scroll-fade.is-visible {
    opacity: 1;
    transform: translateY(0)
}

@font-face {
    font-family: holland;
    src: url(../fonts/holland.ttf)
}

body {
    color: #222;
    font-family: Noto Sans JP, sans-serif;
    line-height: 1.43
}

body main {
    overflow-x: clip
}

.about {
    margin-bottom: 21.0666666667vw;
    margin-top: 23.4666666667vw
}

@media (min-width:52.1875em) {
    .about {
        margin-bottom: 6.6666666667vw;
        margin-top: 7.2916666667vw
    }
}

@media (min-width:90em) {
    .about {
        margin-bottom: 96px;
        margin-top: 105px
    }
}

.about__inner {
    margin: 0 auto;
    position: relative;
    width: 90.6666666667vw
}

@media (min-width:52.1875em) {
    .about__inner {
        display: flex;
        justify-content: space-between;
        width: 83.3333333333vw
    }
}

@media (min-width:90em) {
    .about__inner {
        width: 1200px
    }
}

.about__inner .about__textarea {
    width: 100%
}

@media (min-width:52.1875em) {
    .about__inner .about__textarea {
        width: 39.1666666667vw
    }
}

@media (min-width:90em) {
    .about__inner .about__textarea {
        width: 564px
    }
}

.about__inner .about__textarea .about__title {
    margin-bottom: 97.8666666667vw
}

@media (min-width:52.1875em) {
    .about__inner .about__textarea .about__title {
        margin-bottom: 4.5138888889vw
    }
}

@media (min-width:90em) {
    .about__inner .about__textarea .about__title {
        margin-bottom: 65px
    }
}

.about__inner .about__textarea .about__title .about-title__en {
    color: #b80016;
    display: inline-block;
    font-family: Poppins, sans-serif;
    font-size: 11.7333333333vw;
    font-style: italic;
    font-weight: 500;
    letter-spacing: .04em;
    line-height: 1;
    position: relative
}

@media (min-width:52.1875em) {
    .about__inner .about__textarea .about__title .about-title__en {
        font-size: 3.8888888889vw;
        margin-bottom: .6944444444vw
    }
}

@media (min-width:90em) {
    .about__inner .about__textarea .about__title .about-title__en {
        font-size: 56px;
        margin-bottom: 10px
    }
}

.about__inner .about__textarea .about__title .about-title__ja {
    font-size: 4.2666666667vw;
    font-weight: 700
}

@media (min-width:52.1875em) {
    .about__inner .about__textarea .about__title .about-title__ja {
        font-size: 1.25vw;
        letter-spacing: .06em
    }
}

@media (min-width:90em) {
    .about__inner .about__textarea .about__title .about-title__ja {
        font-size: 18px
    }
}

.about__inner .about__textarea .about__subtitle {
    font-size: 6.4vw;
    font-weight: 400;
    line-height: 2
}

.about__inner .about__textarea .about__subtitle {
    line-height: 1.5
}

@media (min-width:52.1875em) {
    .about__inner .about__textarea .about__subtitle {
        font-size: 1.9444444444vw;
        letter-spacing: .06em;
        line-height: 1.5
    }
}

@media (min-width:90em) {
    .about__inner .about__textarea .about__subtitle {
        font-size: 28px
    }
}

.about__inner .about__textarea .about__explain {
    font-size: 3.7333333333vw;
    font-weight: 400;
    line-height: 2;
    margin-top: 6.4vw
}

@media (min-width:52.1875em) {
    .about__inner .about__textarea .about__explain {
        font-size: 1.1111111111vw;
        letter-spacing: .06em;
        margin-top: 1.6666666667vw
    }
}

@media (min-width:90em) {
    .about__inner .about__textarea .about__explain {
        font-size: 16px;
        margin-top: 24px
    }
}

.about__inner .about__imagearea {
    border-radius: 2.6666666667vw;
    height: auto;
    overflow: hidden;
    position: absolute;
    top: 25vw;
    width: 100%;
    width: 90.6666666667vw
}

@media (min-width:52.1875em) {
    .about__inner .about__imagearea {
        border-radius: .6944444444vw;
        height: auto;
        position: relative;
        top: auto;
        width: 39.7916666667vw
    }
}

@media (min-width:90em) {
    .about__inner .about__imagearea {
        border-radius: 10px;
        width: 573px;
        margin-bottom: 13.3333333333vw;
    }
}

.about__inner .about__imagearea img {
    height: auto;
    object-fit: cover;
    width: 100%
}

.project {
    background-color: #f7f7f7;
    padding: 19.2vw 0 16.5333333333vw
}

@media (min-width:52.1875em) {
    .project {
        padding: 7.6388888889vw 0 10.9722222222vw
    }
}

@media (min-width:90em) {
    .project {
        padding: 110px 0 158px
    }
}

.project__inner {
    margin: 0 auto;
    position: relative;
    width: 90.6666666667vw
}

@media (min-width:52.1875em) {
    .project__inner {
        width: 83.3333333333vw
    }
}

@media (min-width:90em) {
    .project__inner {
        width: 1200px
    }
}

.project__inner .project__textarea .project__title {
    margin-bottom: 8vw
}

@media (min-width:52.1875em) {
    .project__inner .project__textarea .project__title {
        margin-bottom: 4.5138888889vw
    }
}

@media (min-width:90em) {
    .project__inner .project__textarea .project__title {
        margin-bottom: 65px
    }
}

.project__inner .project__textarea .project__title .project-title__en {
    color: #b80016;
    display: inline-block;
    font-family: Poppins, sans-serif;
    font-size: 11.7333333333vw;
    font-style: italic;
    font-weight: 500;
    letter-spacing: .04em;
    line-height: 1;
    position: relative
}

@media (min-width:52.1875em) {
    .project__inner .project__textarea .project__title .project-title__en {
        font-size: 3.8888888889vw;
        margin-bottom: .6944444444vw
    }
}

@media (min-width:90em) {
    .project__inner .project__textarea .project__title .project-title__en {
        font-size: 56px;
        margin-bottom: 10px
    }
}

.project__inner .project__textarea .project__title .project-title__ja {
    font-size: 4.2666666667vw;
    font-weight: 700
}

@media (min-width:52.1875em) {
    .project__inner .project__textarea .project__title .project-title__ja {
        font-size: 1.25vw;
        letter-spacing: .06em
    }
}

@media (min-width:90em) {
    .project__inner .project__textarea .project__title .project-title__ja {
        font-size: 18px
    }
}

.project__inner .project__textarea .project__subtitle {
    font-size: 6.4vw;
    font-weight: 400;
    line-height: 1.5
}

@media (min-width:52.1875em) {
    .project__inner .project__textarea .project__subtitle {
        font-size: 1.9444444444vw;
        letter-spacing: .06em
    }
}

@media (min-width:90em) {
    .project__inner .project__textarea .project__subtitle {
        font-size: 28px
    }
}

.project__inner .project__textarea .project__explain {
    font-size: 3.7333333333vw;
    font-weight: 400;
    line-height: 2;
    margin-top: 6.4vw
}

@media (min-width:52.1875em) {
    .project__inner .project__textarea .project__explain {
        font-size: 1.1111111111vw;
        letter-spacing: .06em;
        margin-bottom: 4.1666666667vw;
        margin-top: 1.6666666667vw
    }
}

@media (min-width:90em) {
    .project__inner .project__textarea .project__explain {
        font-size: 16px;
        margin-bottom: 60px;
        margin-top: 24px
    }
}

.project__inner .project__imagearea {
    margin-bottom: 13.3333333333vw;
    overflow: hidden;
    position: relative
}

@media (min-width:52.1875em) {
    .project__inner .project__imagearea {
        height: auto;
        margin-bottom: 0;
        position: relative;
        top: auto
    }
}

.project__inner .project__imagearea img {
    height: auto;
    object-fit: cover;
    width: 100%
}