/* 会社概要 */

.company-page__catch {
    margin-bottom: 100px;
}

.page__catch {
    text-align: center;
    margin-top: 100px;
    font-size: 48px;
    letter-spacing: 0.16em;
    padding-bottom: 40px;
}

@media (max-width: 767px) {
    .page__catch {
        padding-bottom: 5.9vw;
    }
}

.line-gr {
    position: relative;
}

.line-gr::after {
    position: absolute;
    content: "";
    background-color: #30865a;
    background-size: contain;
    width: 58px;
    height: 7px;
    bottom: 0;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);
}

@media (max-width: 767px) {
    .line-gr::after {
        height: 5px;
    }
}

.page__catch__text {
    text-align: center;
    margin-top: 60px;
    font-size: 24px;
    font-weight: 400;
    line-height: calc(48/24);
    letter-spacing: 0.16em;
}

@media (max-width: 767px) {
    .page__catch {
        font-size: 5.9vw;
        margin-top: 0;
    }

    .page__catch__text {
        font-size: 3.9vw;
        margin-top: 8vw;
    }

    .company-page__catch {
        margin-bottom: 10vw;
    }
}

/* CSR */
.csr-page .product-contents .csr-page-contents-main {
    padding-bottom: 100px;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .csr-page .product-contents .csr-page-contents-main {
        padding-bottom: 6.9444444444vw;
    }
}

@media (max-width: 767px) {
    .csr-page .product-contents .csr-page-contents-main {
        padding-bottom: 17.0666666667vw;
    }
}

.csr-page .product-contents .csr-page-contents-main::after {
    content: none;
}

/* 紹介 */

.csr-page .csr-page-contents-main__warpper {
    background-color: #F3F3EC;
    margin: 0 auto 100px;
}

@media (max-width: 767px) {
    .csr-page .csr-page-contents-main__warpper {
        margin: 0 auto 11vw;
    }
}

.csr-page .csr-page-contents-main__warpper:last-of-type {
    margin-bottom: 0;
}

.img_csr-content02 {
    max-width: 729px;
    margin: 0 auto;
    display: block;
}

.csr-page .csr-page-contents-main__warpper .container {
    position: relative;
}

.csr-page .csr-page-contents-main {
    position: relative;
    padding: 104px 59px 0;
    background-color: white;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .csr-page .csr-page-contents-main {
        padding: 7.2222222222vw 5.5555555556vw 0;
    }
}

@media (max-width: 767px) {
    .csr-page .csr-page-contents-main {
        padding: 17.0666666667vw 6.9333333333vw 0;
    }
}

.csr-page .csr-page-contents-main h3 {
    font-size: 24px;
    color: var(--colorMain);
    padding-left: 22px;
    position: relative;
    margin-bottom: 32px;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .csr-page .csr-page-contents-main h3 {
        font-size: 1.6666666667vw;
        padding-left: 1.5277777778vw;
        margin-bottom: 2.2222222222vw;
    }
}

@media (max-width: 767px) {
    .csr-page .csr-page-contents-main h3 {
        font-size: 4.8vw;
        line-height: 1.5;
        padding-left: 0;
    }
}

.csr-page .csr-page-contents-main h3::before {
    content: "";
    position: absolute;
    left: 0;
    width: 4px;
    height: 100%;
    background-color: var(--colorMain);
}

@media (max-width: 767px) {
    .csr-page .csr-page-contents-main h3::before {
        top: 0.5333333333vw;
        left: -6.9333333333vw;
        height: 5.8666666667vw;
    }
}

.csr-page .csr-page-contents-main p {
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 40px;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .csr-page .csr-page-contents-main p {
        font-size: 1.1111111111vw;
        margin-bottom: 2.7777777778vw;
    }
}

@media (max-width: 767px) {
    .csr-page .csr-page-contents-main p {
        font-size: 3.7333333333vw;
        margin-bottom: 6.4vw;
    }
}

.csr-page .product-contents .btn--basic__wrapper {
    text-align: center;
    margin-top: 32px;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .csr-page .product-contents .btn--basic__wrapper {
        margin-top: 2.2222222222vw;
    }
}

@media (max-width: 767px) {
    .csr-page .product-contents .btn--basic__wrapper {
        margin-top: 7.4666666667vw;
        margin-bottom: 0;
    }
}

/* header recruit ボタン */
.btn--recruit {
    background-color: #fff;
    color: var(--colorMain);
    border: solid 2.5px var(--colorMain);
    transition: 0.3s opacity;
    min-width: 153px;
    width: 100%;
    letter-spacing: 0.02em;
    padding: 16px 32px;
    font-size: 12px;
    line-height: 1;
    font-weight: 500;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .btn--recruit {
        min-width: 10.625vw;
        font-size: 0.8333333333vw;
    }
}

@media (max-width: 767px) {
    .btn--recruit {
        font-size: 4.8vw;
    }
}

/* TOP */
.mv {
    position: relative;
}

.mv .mv__video {
    width: 100%;
    height: 46.88vw;
}

@media (max-width: 767px) {
    .mv .mv__video {
        height: 111.11vw;
    }
}

.mv video {
    width: 100%;
    height: auto;
    object-fit: cover;

}

.mv__cta {
    width: 20.1vw;
    position: absolute;
    bottom: -4vw;
    left: 6vw;
    z-index: 2;
}

@media (max-width: 767px) {
    .mv__cta {
        width: 43.1vw;
        position: absolute;
        bottom: 1vw;
        left: 1vw;
    }
}

/* ロゴスライダー */
.logo-slider {
    margin-top: 7.81vw;
    padding-bottom: 90px;
}

@media (max-width: 767px) {
    .logo-slider {
        margin-top: 12vw;
        padding-bottom: 7vw;
    }
}

/* スライドの動き等速 */
.logo-slider .swiper-wrapper {
    transition-timing-function: linear;
}

@media (max-width: 767px) {
    .logo-slider .swiper-slide {
        width: 140px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
}

.block-section--second .section__inner {
    padding-top: 165px;
}

@media (max-width: 767px) {
    .block-section--second .section__inner {
        padding-top: 13vw;
    }
}

.block-section--second::before {
    background: none;
    height: auto;
}

.section__works {
    position: relative;
    z-index: 1;
    background: #f5f5f2;
    padding: 100px 0 240px;
}

@media (max-width: 767px) {
    .section__works {
        padding: 20vw 0 0;
    }
}

.section__works__title {
    text-align: center;
    font-size: 41px;
    font-weight: 400;
    letter-spacing: 0.26em;
    color: #262626;
    margin-bottom: 70px;
}

@media (max-width: 767px) {
    .section__works__title {
        font-size: 9.8vw;
        margin-bottom: 12vw;
    }
}

.section__works__inner {
    max-width: 1217px;
    margin: 0 auto;
}

.section__works__slider {
    position: relative;
}

.section__works__slider .swiper {
    padding-bottom: 70px;
}

.section__works__slider .swiper-slide {
    background: #fff;
    box-shadow: 6px 9px 35px rgb(0, 0, 0, 0.06);
}

.section__works__slider .swiper-slide .slider-title {
    text-align: center;
    color: #006b35;
    font-weight: 700;
    font-size: 29px;
    line-height: 1;
    letter-spacing: 0.1em;
    padding: 15px 0;
    background: #fff;
    box-shadow: 6px 9px 35px rgb(0, 0, 0, 0.06);
}

@media (max-width: 767px) {
    .section__works__slider .swiper-slide .slider-title {
        font-size: 4.7vw;
    }
}

.section__works__slider .swiper-slide .slider-block {
    padding: 30px;
}

@media (max-width: 767px) {
    .section__works__slider .swiper-slide .slider-block {
        padding: 8vw 3vw;
    }
}

.section__works__slider .swiper-slide .slider-subtitle {
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    letter-spacing: 0.1em;
    color: #000;
    padding-bottom: 2rem;
}

@media (max-width: 767px) {
    .section__works__slider .swiper-slide .slider-subtitle {
        font-size: 5vw;
        padding-bottom: 5vw;
    }
}

.section__works__slider .swiper-slide p {
    text-align: center;
    font-size: 19.5px;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: calc(30/19.5);
    margin-top: 35px;
    color: #000;
}

@media (max-width: 767px) {
    .section__works__slider .swiper-slide p {
        font-size: 4vw;
        margin-top: 4vw;
    }
}

.section__works__slider .swiper-slide .slider-img {
    margin-top: 35px;
}

@media (max-width: 767px) {
    .section__works__slider .swiper-slide .slider-img {
        margin-top: 6vw;
    }
}



.section__works__mirai {
    background: #fff;
    margin-top: 100px;
    padding: 30px 35px;
    box-shadow: 6px 9px 35px rgb(0, 0, 0, 0.06);
}

@media (max-width: 767px) {
    .section__works__mirai {
        margin-top: 14vw;
        padding: 15vw 35px;
    }
}

.section__works__mirai .mirai-title {
    text-align: center;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #2e8056;
    padding-bottom: 2rem;
}

@media (max-width: 767px) {
    .section__works__mirai .mirai-title {
        font-size: 5.9vw;
        padding-bottom: 5vw;
        line-height: 1.5;
    }
}

.section__works__mirai__flex {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 90px;
    margin-top: 35px;
}

@media (max-width: 767px) {
    .section__works__mirai__flex {
        flex-direction: column;
        align-items: center;
        gap: 2vw;
        margin-top: 1vw;
    }
}

.section__works__mirai__flex .mirai-logo {
    max-width: 480px;
    width: 100%;
}

.section__works__mirai__text p {
    font-size: 18px;
    line-height: calc(30/18);
    letter-spacing: 0.16em;
    color: #000;
}

.section__works__mirai__text .c-btn {
    width: 282px;
    height: 49px;
    margin-top: 30px;
}

@media (max-width: 767px) {
    .section__works__mirai__text .c-btn {
        margin: 9vw auto 0;
    }
}

/* 前へ次への矢印カスタマイズ */
.swiper-button-prev,
.swiper-button-next {
    width: 19px;
    height: 22px;
}

/* 前へ次への矢印カスタマイズ */
.swiper-button-prev:after,
.swiper-button-next:after {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    width: 19px;
    height: 22px;
    margin: auto;
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
    left: 42%;
    right: auto;
    bottom: 0;
    top: inherit;
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
    right: 42%;
    left: auto;
    bottom: 0;
    top: inherit;
}

/* 前への矢印カスタマイズ */
.swiper-button-prev:after {
    background-image: url(../img/arrow-prev.png);
}

/* 次への矢印カスタマイズ */
.swiper-button-next:after {
    background-image: url(../img/arrow-next.png);
}

.block-section--first .section__inner {
    padding-bottom: 30px;
}

.block-section--first::after {
    content: "";
    display: block;
    box-sizing: border-box;
    position: relative;
    background-image: linear-gradient(to top, #F3F3EC, #F6F6F3, #F6F6F3);
    -webkit-clip-path: polygon(100% 0, 0 100%, 100% 100%);
    clip-path: polygon(100% 0, 0 100%, 100% 100%);
    width: 100%;
    height: 270px;
    margin-top: -30px;
}

@media (max-width: 767px) {
    .block-section--first::after {
        height: 36vw;
    }
}

.block-section--first::before {
    height: auto;
    background-image: none;
}



/* SERVICE */
.service-page .page__heading {
    color: #43996f;
}

.service-page .page__heading {
    color: #43996f;
    letter-spacing: 0.1em;
}

.service-page .page__text {
    font-size: 17px;
    line-height: calc(40/17);
    font-weight: 300;
    letter-spacing: 0.26em;
}

@media (max-width: 767px) {
    .service-page .page__text {
        font-size: 3.7vw;
        text-align: left;
    }
}

.service-page__about .service-page__heading {
    position: relative;
    padding-bottom: 120px;
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page__about .service-page__heading {
        padding-top: 11.25vw;
        padding-right: 5.5555555556vw;
        padding-left: 5.5555555556vw;
        padding-bottom: 8.3333333333vw;
    }
}

@media (max-width: 767px) {
    .service-page__about .service-page__heading {
        flex-direction: column;
        padding-top: 0;
        padding-bottom: 10.6666666667vw;
        gap: 20vw;
    }
}

.service-page__about .service-page__heading .section__heading {
    text-transform: uppercase;
    font-size: 42px;
    font-weight: 420;
    font-family: var(--fontSub);
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page__about .service-page__heading .section__heading {
        font-size: 2.9166666667vw;
    }
}

@media (max-width: 767px) {
    .service-page__about .service-page__heading .section__heading {
        font-size: 5.8666666667vw;
    }
}

.service-page__about .service-page__heading__text {
    z-index: 1;
}

.service-page__about .service-page__heading__image {
    position: relative;
    max-width: 365px;
    width: 100%;
    margin-right: 90px;
    z-index: 2;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page__about .service-page__heading__image {
        max-width: 31.0416666667vw;
        margin-right: 4.69vw;
    }
}

@media (max-width: 767px) {
    .service-page__about .service-page__heading__image {
        display: block;
        position: relative;
        max-width: 64vw;
        margin: 0 auto;
    }
}

.service-page__about .service-page__heading__image::before {
    content: "";
    display: block;
    padding-top: 100%;
}

.service-page__about .service-page__heading__image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center center;
    object-position: center center;
}

.service-page__about .service-page__title {
    position: relative;
    margin-top: 94px;
    font-size: 40px;
    color: var(--colorMain);
    padding-left: 26px;
    letter-spacing: 0.16em;
    text-align: left;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page__about .service-page__title {
        margin-top: 6.5277777778vw;
        font-size: 2.7777777778vw;
        padding-left: 1.8055555556vw;
    }
}

@media (max-width: 767px) {
    .service-page__about .service-page__title {
        margin-top: 0;
        font-size: 5.8666666667vw;
        padding-left: 6.9333333333vw;
        line-height: 1.4;
    }
}

.service-page__about .service-page__title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 8px;
    height: 100%;
    background-color: var(--colorMain);
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page__about .service-page__title::before {
        width: 0.5555555556vw;
    }
}

@media (max-width: 767px) {
    .service-page__about .service-page__title::before {
        width: 1.6vw;
    }
}

.service-page__about .service-page__title-text {
    font-size: 17px;
    margin-top: 32px;
    line-height: calc(40/17);
    text-align: left;
    font-weight: 300;
    letter-spacing: 0.26em;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page__about .service-page__title-text {
        font-size: 1.1111111111vw;
        margin-top: 2.2222222222vw;
    }
}

@media (max-width: 767px) {
    .service-page__about .service-page__title-text {
        font-size: 3.7333333333vw;
        margin-top: 6.4vw;
        margin-bottom: 8vw;
    }
}

@media (max-width: 767px) {
    .service-page .service-section__image img {
        padding: 0;
    }
}

.service-page__flow {
    background: #fff;
    position: relative;
    z-index: 1;
    padding: 55px 90px 69px;
}

@media (max-width: 767px) {
    .service-page__flow {
        padding: 13vw 6vw 13vw;
    }
}

.service-page__flow__title {
    text-align: center;
    color: #006b35;
    font-size: 39px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.16em;
}

@media (max-width: 767px) {
    .service-page__flow__title {
        font-size: 23px;
    }
}

.service-page__flow__text {
    text-align: center;
    margin-top: 50px;
    margin-bottom: 70px;
    color: #006b35;
    font-size: 28px;
    font-weight: 500;
    line-height: calc(60/28);
    letter-spacing: 0.16em;
}

@media (max-width: 767px) {
    .service-page__flow__text {
        font-size: 4vw;
        margin-top: 6vw;
        margin-bottom: 9vw;
    }
}

.service-page .service-section {
    background: #f5f5f2;
    margin-bottom: 117px;
    justify-content: flex-end;
    position: relative;
}

@media (min-width: 768px) {
    .service-page .service-section {
        padding: 40px 40px 40px;
    }
}

@media (max-width: 767px) {
    .service-page .service-section {
        margin-bottom: 27vw;
    }
}

.service-page .service-section::after {
    position: absolute;
    content: "";
    background-image: url(../img/service-arrow.png);
    background-size: contain;
    width: 51px;
    height: 44px;
    bottom: -19%;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);
}

@media (max-width: 767px) {
    .service-page .service-section::after {
        bottom: -20vw;
    }
}

.service-page__inner {
    position: relative;
}

.service-page .service-page__inner::after {
    position: absolute;
    content: "";
    background-image: url(../img/bg-service-page.png);
    background-size: cover;
    width: 100%;
    height: 100%;
    bottom: -12%;
    left: 0;
}

.service-page .service-section:last-of-type {
    margin-bottom: 0;
}

.service-page .service-section:last-of-type::after {
    display: none;
}

.service-page .bg-service-page {
    margin-top: 800px;
}

.service-page__inner {
    padding-bottom: 260px;
}

@media (max-width: 767px) {
    .service-page__inner {
        padding-bottom: 60px;
    }
}

.service-page .service-page__flow .c-btn {
    height: 39px;

}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page .service-page__flow .c-btn {
        width: 22vw;
    }
}

.service-page .service-page__flow .c-btn--grade {
    height: 58px;
}

.service-page .service-page__flow .c-btn__text {
    font-size: 12.8px;
    font-weight: 700;
}

.service-page .service-page__flow .c-btn--grade .c-btn__text {
    color: #fff;
    font-size: 12.8px;
    letter-spacing: 0.16em;
    line-height: calc(21/12);
}

.service-page .service-page__flow .c-btn__link {
    background: transparent;
}

@media (min-width: 768px) {
    .service-page .service-page__flow .c-btn__link {
        padding-left: 56px;
    }
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page .service-page__flow .c-btn__link {
        padding-left: 4.2vw;
    }
}

.service-page .service-page__flow .c-btn__link--grade {
    margin-top: 15px;
    color: #fff;
    text-align: center;
    background: #01964F;
    background: linear-gradient(135deg, rgba(1, 150, 79, 1) 0%, rgba(0, 124, 63, 1) 100%);
    border-radius: 20px;
    font-weight: 700;
    padding-left: 44px;
}

@media (min-width: 768px) and (max-width: 1339px) {
    .service-page .service-page__flow .c-btn__link--grade {
        padding-left: 3vw;
    }
}

@media (max-width: 767px) {
    .service-page .service-page__flow .c-btn__link--grade {
        padding-left: 20px;
    }
}

.service-page .service-page__flow .c-btn__link--grade::before {
    border: none;
    border-radius: 20px;
}

.service-page .service-page__flow .c-btn__link--grade .c-btn__dot {
    background: #fff;
}

.service-details {
    position: relative;
    background: #F3F3EC;
}

.service-page .section--contact,
.service-page .section--news,
.service-details .section--contact {
    background: #fff;
}

.service-page .section--news {
    position: relative;
    z-index: 1;
}

.service-page .service-section__heading {
    letter-spacing: 0.16em;
}

@media (max-width: 767px) {
    .service-page .service-section__heading {
        font-size: 4.5vw;
    }
}

.service-page .service-section__text {
    font-size: 13px;
    line-height: calc(32/13);
    letter-spacing: 0.26em;
}


@media (max-width: 767px) {
    .pc-only {
        display: none;
    }
}

@media (min-width: 768px) {
    .sp-only {
        display: none;
    }
}

@media (max-width: 767px) {
    .service-details .service-details-contents-main h3 {
        font-size: 4.6vw;
    }
}