:root { --width: 1 / 1366 * 100vw; }
@media (max-width: 780px) { :root { --width: 1 / 375 * 100vw; } }
.pc{display: block;} .sp{display: none;}
@media (max-width: 780px) {.pc{display: none;} .sp{display: block;}}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Noto Sans JP', sans-serif;
}
header,
main,
footer {
    margin: 0 auto;
}
img {
    width: 100%;
    height: auto;
}
.about {
width: calc(263 * var(--width));
}
section {
    position: relative;
}
.btn {
    position: absolute;
    height: auto;
    z-index: 2;
}
.fv-btn {
    bottom: calc(43 * var(--width));
    right: calc(113 * var(--width));
    width: calc(624 * var(--width));
}
.sec_03-btn {
    bottom: calc(40 * var(--width));
    left: calc(202 * var(--width));
    width: calc(624 * var(--width));
}
.sec_05-btn {
    bottom: calc(45 * var(--width));
    right: calc(112 * var(--width));
    width: calc(624 * var(--width));
}
.sec_07-btn {
    bottom: calc(47 * var(--width));
    left: calc(443 * var(--width));
    width: calc(484 * var(--width));
}
.sec_11-btn {
    bottom: calc(48 * var(--width));
    left: calc(371 * var(--width));
    width: calc(624 * var(--width));
}
footer {
    background: #333333;
    padding: calc(20 * var(--width)) 0;
}
.footer-inner {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(20 * var(--width));
}
footer a {
    color: #fff;
    font-size: calc(14 * var(--width));
}

@media screen and (max-width: 780px) {
    .fv-btn {
        bottom: calc(18 * var(--width));
        right: calc(18 * var(--width));
        width: calc(337 * var(--width));
    }
    .sec_03-btn {
        bottom: calc(18 * var(--width));
        left: calc(18 * var(--width));
        width: calc(337 * var(--width));
    }
    .sec_05-btn {
        bottom: calc(20 * var(--width));
        right: calc(12 * var(--width));
        width: calc(337 * var(--width));
    }
    .sec_07-btn {
        bottom: calc(40 * var(--width));
        left: calc(20 * var(--width));
        width: calc(337 * var(--width));
    }
    .sec_11-btn {
        bottom: calc(20 * var(--width));
        left: calc(20 * var(--width));
        width: calc(337 * var(--width));
    }
    .sec_10 {
        padding-bottom: calc(30 * var(--width));
        background: #1944B2;
    }
    .sec_10-inner {
        position: absolute;
        top: calc(140 * var(--width));
        width: 100%;
        padding-bottom: calc(40 * var(--width));
    }
    .swiper-button-next, .swiper-button-prev {
        width: calc(30 * var(--width));
        height: calc(30 * var(--width));
        top: calc(250 * var(--width));
    }
    .swiper-button-next {
        right: calc(3 * var(--width));
    }
    .swiper-button-prev {
        left: calc(3 * var(--width));
    }
    .swiper-button-next:after, .swiper-button-prev:after {
        display: none;
    }
    .swiper-pagination-bullet {
        width: calc(11 * var(--width));
        height: calc(11 * var(--width));
        background-color: #fff;
        margin: 0 calc(3 * var(--width)) !important;
    }
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
        width: calc(11 * var(--width));
        height: calc(11 * var(--width));
        background-color: #ffff00;
    }
    .footer-inner {
        flex-direction: column;
        gap: calc(10 * var(--width));
    }
    footer a {
        font-size: calc(12 * var(--width));
    }
}