:root {--width: 1920;}
.pc{display: block;} .sp{display: none;}
@media (max-width: 780px) {:root {--width: 780;} .pc{display: none;} .sp{display: block;}}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
header {
    position: absolute;
    top: 0;
    z-index: 3;
}
section {
    position: relative;
    width: 100%;
    z-index: 2;
}
.solution {
    z-index: 1;
    padding-top: calc(44 / var(--width) * 100vw);
    padding-bottom: calc(56 / var(--width) * 100vw);
}
.solution img {
    width: calc(979 / var(--width) * 100vw);
    margin: 0 auto;
}
.fv-bottom {
    margin-top: calc(-10 / var(--width) * 100vw);
}
footer {
    margin-top: calc(-6 / var(--width) * 100vw);
}
a {
    position: absolute;
}
.header-btn {
    top: 0;
    left: 0;
    height: 100%;
    width: calc(600 / var(--width) * 100vw);
}
.fv-btn {
    bottom: calc(56 / var(--width) * 100vw);
    left: calc(280 / var(--width) * 100vw);
    width: calc(853 / var(--width) * 100vw);
}
.slider01-box {
    position: absolute;
    top: calc(130 / var(--width) * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: 76%;
    z-index: 1;
}
.slider01 {
    overflow: hidden;
}
.slider01-box.pc {
    display: block;
}
.slider01-box.sp {
    display: none;
}
.swiper-button-prev01,
.prev-arrow {
    width: calc(57 / var(--width) * 100vw);
    position: absolute;
    top: 50%;
    left: calc(-8 / var(--width) * 100vw);
    transform: translateY(-50%);
    z-index: 2;
    cursor: pointer;
}
.swiper-button-next01,
.next-arrow {
    width: calc(57 / var(--width) * 100vw);
    position: absolute;
    top: 50%;
    right: calc(-8 / var(--width) * 100vw);
    transform: translateY(-50%);
    z-index: 2;
    cursor: pointer;
}
.slide05-sp {
    width: 50%;
}
.reasons-box-bg {
    position: absolute;
    top: calc(77 / var(--width) * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: calc(1525 / var(--width) * 100vw);
    z-index: 1;
}
.reasons-box-bg.pc {
    display: block;
}
.reasons-box-bg.sp {
    display: none;
}
.reasons .slider01-box {
    top: calc(698 / var(--width) * 100vw);
}
.btn-area02 .slider01-box {
    top: calc(686 / var(--width) * 100vw);
}
.btn01 {
    bottom: calc(118 / var(--width) * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: calc(853 / var(--width) * 100vw);
}
.reasons-btn {
    top: calc(138 / var(--width) * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: calc(896 / var(--width) * 100vw);
    z-index: 3;
}
.btn02 {
    top: calc(121 / var(--width) * 100vw);
    left: 50%;
    transform: translateX(-50%);
    width: calc(896 / var(--width) * 100vw);
}
.fv-phone {
    position: absolute;
    right: calc(220 / var(--width) * 100vw);
    bottom: 0;
    width: calc(525 / var(--width) * 100vw);
    height: calc(444 / var(--width) * 100vw);
    z-index: 1;
}
.fv-slider-box {
    position: absolute;
    right: calc(307.5 / var(--width) * 100vw);
    top: 73.6%;
    /* top: calc(1108 / var(--width) * 100vw); */
    /* bottom: calc(-504 / var(--width) * 100vw); */
    width: calc(410 / var(--width) * 100vw);
    transform: rotate(8deg);
    z-index: 2;
    border-top-left-radius: calc(40 / var(--width) * 100vw);
    border-top-right-radius: calc(40 / var(--width) * 100vw);
    overflow: hidden;
    user-select: none;
}
.fv-slider {
    overflow: hidden;
}
.fv-slider-wrapper-item {
    height: 100%;
}
/* .fv-slider-wrapper-item08 ,
.fv-slider-wrapper-item09 ,
.fv-slider-wrapper-item10 ,
.fv-slider-wrapper-item11 {
    padding-top: calc(90 / var(--width) * 100vw);
    background-color: #ecedee;
} */
.fv-slider-wrapper-item img {
    margin: auto;
}
.faq {
    background-color: #e3f8f5;
    padding-bottom: calc(10 / var(--width) * 100vw);
}
.faq .faq-box {
    width: 100%;
    overflow: hidden;
    max-height: calc(126 / var(--width) * 100vw);
    width: calc(1600 / var(--width) * 100vw);
    margin-bottom: calc(80 / var(--width) * 100vw);
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 0 calc(5 / var(--width) * 100vw) 0 #555555;
    border-radius: calc(10 / var(--width) * 100vw);
    cursor: pointer;
    transition: max-height 0.3s ease-in-out;
}
.faq .faq-box.open {
    max-height: calc(300 / var(--width) * 100vw);
}

@media (max-width: 780px) {
    .solution {
        padding-top: calc(36 / var(--width) * 100vw);
        padding-bottom: calc(36 / var(--width) * 100vw);
    }
    .solution img {
        width: calc(669 / var(--width) * 100vw);
    }
    .header-btn {
        width: calc(400 / var(--width) * 100vw);
    }
    .fv-btn {
        bottom: calc(45 / var(--width) * 100vw);
        left: 50%;
        transform: translateX(-50%);
        width: calc(602 / var(--width) * 100vw);
    }
    .btn01 {
        bottom: calc(81 / var(--width) * 100vw);
        left: 50%;
        transform: translateX(-50%);
        width: calc(597 / var(--width) * 100vw);
    }
    .reasons-box-bg.pc {
        display: none;
    }
    .reasons-box-bg.sp {
        display: block;
    }
    .reasons-box-bg {
        top: calc(48 / var(--width) * 100vw);
        width: calc(750 / var(--width) * 100vw);
    }
    .reasons .slider01-box {
        top: calc(418 / var(--width) * 100vw);
    }
    .reasons-btn {
        top: calc(86 / var(--width) * 100vw);
        left: 50%;
        transform: translateX(-50%);
        width: calc(597 / var(--width) * 100vw);
    }
    .btn-area02 .slider01-box {
        top: calc(410 / var(--width) * 100vw);
    }
    .btn02 {
        top: calc(86 / var(--width) * 100vw);
        left: 50%;
        transform: translateX(-50%);
        width: calc(597 / var(--width) * 100vw);
    }
    .slider01-box {
        top: calc(86 / var(--width) * 100vw);
        width: calc(660 / var(--width) * 100vw);
    }
    .slider01-box.pc {
        display: none;
    }
    .slider01-box.sp {
        display: block;
    }
    .slick-slide {
        margin: 0 calc(10 / var(--width) * 100vw);
    }
    .swiper-button-prev01,
    .prev-arrow {
        width: calc(49 / var(--width) * 100vw);
        height: calc(49 / var(--width) * 100vw);
        left: calc(-14 / var(--width) * 100vw);
        background: center center / contain no-repeat url("../images/arrow-prev01.webp");
    }
    .swiper-button-next01,
    .next-arrow {
        width: calc(49 / var(--width) * 100vw);
        height: calc(49 / var(--width) * 100vw);
        right: calc(-14 / var(--width) * 100vw);
        background: center center / contain no-repeat url("../images/arrow-next01.webp");
    }
    .fv-phone {
        position: absolute;
        right: calc(200 / var(--width) * 100vw);
        bottom: calc(178 / var(--width) * 100vw);
        width: calc(396 / var(--width) * 100vw);
        height: auto;
    }
    .fv-slider-box {
        position: absolute;
        right: calc(265 / var(--width) * 100vw);
        top: 64.6%;
        width: calc(310 / var(--width) * 100vw);
    }
    .fv-slider-box::before {
        position: absolute;
        content: "";
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50%;
        background-color: #f4fffd;
        z-index: 2;
    }
    .fv-btn {
        z-index: 4;
    }
    .faq .faq-box {
        max-height: calc(72 / var(--width) * 100vw);
        width: calc(700 / var(--width) * 100vw);
    }
    .faq .faq-box.faq04-sp {
        max-height: calc(104 / var(--width) * 100vw);
    }
    .faq .faq-box.open,
    .faq .faq-box.faq04-sp.open {
        max-height: calc(200 / var(--width) * 100vw);
    }
}