@charset "UTF-8";
@supports (-webkit-touch-callout:none) {
    html {
        height: -webkit-fill-available
    }
    body {
        min-height: 100vh;
        min-height: -webkit-fill-available
    }
}
body {
    overflow-y: scroll
}
body.fixed {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0
}
body.is-opening-fixed {
    position: fixed;
    width: 100%;
    overflow: hidden
}
html {
    font-size: 62.5%
}
body {
    color: #000;
    font-size: 1.6rem;
    line-height: 1.2;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-feature-settings: "palt";
    word-break: normal;
    overflow-wrap: break-word;
    position: relative;
    margin: 0;
    overflow-x: hidden
}
body * {
    box-sizing: border-box
}
body.preload * {
    transition: none !important
}
::after, ::before {
    box-sizing: border-box
}
input, select, textarea {
    font-size: 16px
}
input:-ms-input-placeholder, select:-ms-input-placeholder, textarea:-ms-input-placeholder {
    font-family: "Noto Sans JP", sans-serif;
    color: #000;
    opacity: .6;
    font-size: 1.6rem;
    line-height: 1.875;
    letter-spacing: .1em
}
input::placeholder, select::placeholder, textarea::placeholder {
    font-family: "Noto Sans JP", sans-serif;
    color: #000;
    opacity: .6;
    font-size: 1.6rem;
    line-height: 1.875;
    letter-spacing: .1em
}
h1, h2, h3, h4, h5, h6, p {
    margin: 0;
    padding: 0;
    border: 0;
    font-style: normal;
    vertical-align: baseline
}
h1, h2, h3, h4, h5, h6 {
    color: #000;
    font-weight: 400
}
dd, dl, dt {
    margin: 0;
    padding: 0
}
a {
    color: #000;
    transition: all .3s ease;
    text-decoration: none
}
a[href^="tel:"] {
    pointer-events: auto;
    text-decoration: none !important
}
a i {
    text-decoration: none
}
a img, a::after, a::before {
    transition: all .3s ease
}
img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom
}
em {
    font-style: italic
}
ol {
    margin: 0;
    padding: 0
}
ol li {
    margin: 0;
    padding: 0
}
ul {
    margin: 0;
    padding: 0;
    list-style: none
}
ul li {
    margin: 0;
    padding: 0
}
table {
    border-spacing: 0
}
table td {
    position: relative;
    z-index: 1;
    padding: 0
}
table td.sp {
    z-index: 2
}
table th {
    padding: 0
}
figure {
    margin: 0
}
br.pc {
    display: none
}
br.custom {
    display: none
}
.opening-animation {
    position: fixed;
    inset: 0;
    background-color: #fff;
    z-index: 9999;
    transition: opacity .6s ease;
    --base-anim-end: 2.3s
}
.opening-animation.is-fadeout {
    opacity: 0;
    pointer-events: none
}
.opening-animation__inner {
    position: relative;
    width: 28.5rem;
    height: 100%;
    margin-inline: auto;
    display: grid;
    place-content: center;
    place-items: center;
    perspective: 1200px;
    transform-style: preserve-3d
}
.opening-animation__img-wrap {
    width: 100%;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 1.6rem;
    flex-wrap: nowrap;
    overflow: visible
}
.opening-animation__img {
    position: relative;
    flex: 0 0 auto
}
.opening-animation__img.is-hidden {
    display: none
}
.opening-animation__img img {
    display: block;
    width: 100%;
    height: auto
}
.opening-animation__img.z-1 {
    z-index: 1;
    animation: animation-1 1.3s linear 1s both
}
.opening-animation__img.z-1 img {
    width: 5.7rem
}
.opening-animation__img.z-2 {
    z-index: 2;
    animation: animation-2 1.3s linear 1s both
}
.opening-animation__img.z-2 img {
    width: 7.5rem
}
.opening-animation__img.z-3 {
    z-index: 3;
    animation: animation-3 1.3s linear 1s both
}
.opening-animation__img.z-3 img {
    width: 6.7rem
}
.opening-animation__img.z-4 {
    z-index: 4;
    animation: animation-4 1.3s linear 1s both
}
.opening-animation__img.z-4 img {
    width: 3.7rem
}
.opening-animation__img.last {
    margin-top: -9rem;
    opacity: 0;
    will-change: transform, opacity, filter;
    animation: opening-pop-in .9s cubic-bezier(.2, .8, .2, 1) both;
    animation-delay: calc(var(--base-anim-end) + 200ms)
}
.opening-animation__img.last img {
    width: 6.8rem
}
.opening-animation__text-first {
    text-align: center;
    margin: 2rem auto 0;
    font-weight: 900;
    color: #2b8dcd;
    font-size: 3.2rem;
    line-height: 1;
    letter-spacing: .07em;
    white-space: nowrap;
    overflow: hidden;
    max-height: 8.1rem;
    animation: opening-text-out .45s ease both;
    animation-delay: var(--base-anim-end)
}
.opening-animation__text-last {
    position: relative;
    text-align: center;
    max-width: 72rem;
    margin: 0 auto;
    font-weight: 900;
    color: #f70;
    font-size: 4.9rem;
    line-height: 1;
    letter-spacing: .01em;
    white-space: nowrap;
    overflow: visible;
    opacity: 0;
    will-change: transform, opacity, filter;
    transform-origin: center;
    animation: opening-pop-in .9s cubic-bezier(.2, .8, .2, 1) both;
    animation-delay: calc(var(--base-anim-end) + 350ms)
}
.opening-animation__text-last::before {
    content: "";
    position: absolute;
    top: -4rem;
    left: .5rem;
    background: url(../images/opening_material_left_sp.svg) no-repeat center/contain;
    width: 4.1rem;
    height: 4.2rem
}
.opening-animation__text-last::after {
    content: "";
    position: absolute;
    top: -4rem;
    right: .5rem;
    background: url(../images/opening_material_right_sp.svg) no-repeat center/contain;
    width: 4.1rem;
    height: 4.1rem
}
@keyframes animation-1 {
    0% {
        left: 0;
        transform: translateX(0)
    }
    70% {
        left: 50%;
        transform: translateX(-40%)
    }
    100% {
        left: 50%;
        transform: translateX(-40%);
        visibility: hidden
    }
}
@keyframes animation-2 {
    0% {
        left: 0;
        transform: translateX(0)
    }
    70% {
        left: 25%;
        transform: translateX(-47.5%)
    }
    100% {
        left: 25%;
        transform: translateX(-47.5%);
        visibility: hidden
    }
}
@keyframes animation-3 {
    0% {
        right: 0;
        transform: translateX(0)
    }
    70% {
        right: 25%;
        transform: translateX(25%)
    }
    100% {
        right: 25%;
        transform: translateX(25%);
        visibility: hidden
    }
}
@keyframes animation-4 {
    0% {
        right: 0;
        transform: translateX(0)
    }
    70% {
        right: 50%;
        transform: translateX(46.5%)
    }
    100% {
        right: 50%;
        transform: translateX(46.5%);
        visibility: hidden
    }
}
@keyframes opening-text-out {
    0% {
        opacity: 1;
        transform: translateY(0);
        max-height: 8.1rem
    }
    100% {
        opacity: 0;
        transform: translateY(-8px);
        max-height: 0
    }
}
@keyframes opening-pop-in {
    0% {
        opacity: 0;
        transform: translateZ(-220px) scale(.86)
    }
    100% {
        opacity: 1;
        transform: translateZ(0) scale(1)
    }
}
.color-accent {
    color: #ff813e
}
.bg-key {
    background-color: #ffe16a
}
.header {
    position: fixed;
    z-index: 99;
    top: 0;
    right: 0;
    width: 100%;
    height: 7rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-left: 1.5rem;
    background-color: #fff
}
.header__logo {
    margin-top: -1rem
}
.header__logo img {
    width: 14rem
}
.header__logo.is-appeared {
    opacity: 1;
    pointer-events: all
}
.header__nav-overwrap {
    display: flex
}
.header__nav-wrap {
    display: none
}
.header__nav-list {
    display: flex;
    align-items: center;
    gap: 3rem;
    gap: clamp(1.8rem, -.6rem + 1.875vw, 3rem)
}
.header__nav-link {
    font-size: 1.6rem;
    font-size: clamp(1.5rem, 1.3rem + .15625vw, 1.6rem);
    line-height: 1.8;
    letter-spacing: .05em;
    opacity: .7
}
.header__link-wrap {
    width: 7rem
}
.header__link {
    height: 100%;
    background-color: #0071bc;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    font-weight: 700;
    color: #fff;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .01em
}
.header__link > .icon {
    margin-top: -1px
}
.header__link > .icon img {
    width: 3.1rem
}
.header__link > .text {
    display: none
}
.header__sp-nav-btn {
    width: 7rem;
    aspect-ratio: 1;
    background-color: #000;
    border: none;
    display: grid;
    place-content: center;
    position: relative;
    z-index: 1001;
    transition: opacity .2s ease
}
.header__sp-nav-btn > .line {
    position: relative;
    width: 3rem;
    height: .18rem;
    background-color: #fff
}
.header__sp-nav-btn > .line::after, .header__sp-nav-btn > .line::before {
    content: "";
    position: absolute;
    left: 0;
    width: 3rem;
    height: .18rem;
    background-color: #fff
}
.header__sp-nav-btn > .line::before {
    top: -1rem
}
.header__sp-nav-btn > .line::after {
    bottom: -1rem
}
.header__sp-nav-btn > .line, .header__sp-nav-btn > .line::after, .header__sp-nav-btn > .line::before {
    transition: transform .25s ease, top .25s ease, bottom .25s ease, background-color .25s ease, opacity .2s ease
}
.header__sp-nav-wrap {
    position: fixed;
    top: 7rem;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
    background-color: #f6f7f9;
    padding: 6rem 3rem 11rem;
    z-index: 1000;
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
    background: #f6f7f9 url(../images/header_nav_bg.png) no-repeat left -12rem bottom/104.1rem auto
}
.header__sp-nav-link {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    padding-block: 2rem;
    font-weight: 500;
    font-size: 1.6rem;
    line-height: 1.09;
    letter-spacing: .07em
}
.header.is-open .header__sp-nav-wrap {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0);
    transition: opacity .25s ease, transform .25s ease
}
.header.is-open .header__sp-nav-btn > .line {
    background-color: transparent
}
.header.is-open .header__sp-nav-btn > .line::before {
    top: 0;
    transform: rotate(45deg)
}
.header.is-open .header__sp-nav-btn > .line::after {
    bottom: auto;
    top: 0;
    transform: rotate(-45deg)
}
.footer {
    padding: 6rem 2rem 14rem
}
.footer__inner {
    display: flex;
    flex-direction: column;
    align-items: center
}
.footer__logo img {
    width: 20rem
}
.footer__list {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem
}
.footer__list-link {
    text-align: center;
    display: block;
    font-weight: 400;
    font-size: 1.4rem;
    line-height: 1.8;
    letter-spacing: .05em
}
.footer__copyright {
    margin-top: 2rem
}
.footer__copyright small {
    font-weight: 400;
    font-size: 1.2rem;
    line-height: 1.8;
    letter-spacing: .05em
}
.section-ttl-wrap {
    display: grid;
    place-content: center;
    place-items: center;
    gap: .5rem
}
.section-ttl {
    font-weight: 700;
    font-size: 3.2rem;
    line-height: 1.2;
    letter-spacing: .07em
}
.section-ttl-en {
    position: relative;
    font-family: "Plus Jakarta Sans", sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: .07em
}
.section-ttl-en::after, .section-ttl-en::before {
    content: "";
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    width: 1rem;
    height: .2rem;
    background-color: #0071bc
}
.section-ttl-en::before {
    left: -1.5rem
}
.section-ttl-en::after {
    right: -1.5rem
}
.section-bgwrap {
    background-color: #d9ecfc;
    padding: 2rem 2rem
}
.common-layout {
    border-radius: 2rem;
    background-color: #fff
}
.common {
    display: flex;
    flex-direction: column;
    padding-inline: 2rem
}
.common__ttl-wrap {
    flex: 1 0 auto
}
.common__ttl {
    font-weight: 700;
    font-size: 3.2rem;
    line-height: 1.2;
    letter-spacing: .07em
}
.common__ttl-en {
    position: relative;
    font-family: "Plus Jakarta Sans", sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: .07em;
    margin-top: .6rem;
    margin-left: 1.5rem
}
.common__ttl-en::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -1.5rem;
    translate: 0 -50%;
    width: 1rem;
    height: .2rem;
    background-color: #0071bc
}
.common__desc {
    margin-top: 1.5rem;
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .07em
}
.common-catch {
    padding-inline: 2rem;
    font-weight: 700;
    font-size: 2.4rem;
    line-height: 1.3;
    letter-spacing: .05em;
    margin-top: 3.5rem
}
.fixed-btn {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 11
}
.fixed-btn a {
    display: block;
    position: relative;
    width: 100%
}
.fixed-btn a .txt {
    color: #fff;
    aspect-ratio: 1/1;
    width: 5.4rem;
    font-size: 1rem;
    line-height: 1.2;
    position: absolute;
    left: 8.3rem;
    top: .8rem
}
.fixed-btn a .img img {
    width: 100%
}
.mv {
    position: relative;
    overflow: hidden
}
.mv__inner {
    position: relative;
    padding-bottom: 1.3rem;
    margin-bottom: 6rem
}
.mv__bg-img {
    position: absolute;
    left: 50%;
    bottom: 0;
    translate: -50% 0;
    z-index: 3;
    width: 104.1rem;
    height: 17.5rem;
    background: url(../images/mv_bg_sp.png) no-repeat center bottom/104.1rem auto
}
.mv__left-wrap {
    position: relative;
    z-index: 5
}
.mv__left-inner {
    margin-top: 13rem;
    padding: 0 3rem 3.3rem
}
.mv__text {
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.8;
    letter-spacing: .1em
}
.mv__text .color {
    color: #f0a400
}
.mv__large {
    font-weight: 700;
    font-size: 4.2rem;
    line-height: 1.2;
    letter-spacing: .1em
}
.mv__large .color {
    color: #f0a400
}
.mv__logo-wrap {
    margin-top: 2.5rem
}
.mv__logo-text {
    font-weight: 500;
    color: #f0a400;
    font-size: 1.2rem;
    line-height: 1.5;
    letter-spacing: .07em
}
.mv__service-logo {
    margin-top: -1.4rem
}
.mv__service-logo img {
    width: 24rem
}
.mv__desc {
    display: none;
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    color: #fff
}
.mv__desc > .text {
    display: inline-block;
    background-color: #0071bc;
    font-weight: 700;
    font-size: 1.6rem;
    padding: .6rem 1rem
}
.mv__desc > .text.last {
    margin-top: .5rem
}
.mv__desc-sp {
    display: block;
    position: absolute;
    bottom: -6rem;
    left: 7.25vw;
    z-index: 10
}
.mv__right-wrap {
    background-color: #f6f7f9;
    padding-bottom: 6.7rem
}
.mv__right-inner {
    position: relative;
    z-index: 5
}
.mv__right-img img {
    max-width: 82.8rem;
    width: 100%
}
.slick-wrap {
    margin-top: -6.2rem;
    position: relative;
    z-index: 5;
    background-color: #bad4e5;
    padding-block: 5rem 2rem;
    overflow: hidden
}
.slick-wrap .slick-top .slick-item {
    margin-inline: 1rem
}
.slick-wrap .slick-bottom .slick-item {
    margin-inline: 1rem
}
.slick-top .slick-item img {
    width: 24rem;
    height: auto;
    aspect-ratio: 327/182
}
.slick-bottom {
    margin-top: 2rem;
    display: flex;
    overflow: hidden;
    background-color: #fff
}
.slick-bottom__loop {
    animation: scroll-right 30s infinite linear .5s both;
    display: flex
}
.slick-bottom__item {
    width: 15.2rem;
    margin-inline: 1rem
}
.slick-bottom__item img {
    display: block;
    width: 100%
}
@keyframes scroll-right {
    from {
        transform: translateX(-100%)
    }
    to {
        transform: translateX(0)
    }
}
.structure {
    padding: 8.8rem 2rem 0
}
.structure__inner {
    display: contents
}
.structure__title > .text {
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.2;
    letter-spacing: .01em
}
.structure__title > .text-large {
    display: block;
    font-weight: 700;
    font-size: 4.2rem;
    line-height: 1.2;
    letter-spacing: .05em
}
.structure__text {
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .05em;
    margin-top: 1rem
}
.structure__img-wrap {
    margin-top: 3.2rem
}
.structure__img {
    max-width: 50rem;
    margin-inline: auto
}
.structure__img img {
    width: 78.3rem
}
.structure__summary-wrap {
    position: relative;
    padding: 8.5rem 2rem 2rem;
    background-color: #ffe75e;
    margin-inline: calc(50% - 50vw)
}
.structure__summary-wrap::before {
    content: "つまり";
    width: 13.8rem;
    height: 4.8rem;
    position: absolute;
    top: 0;
    left: 50%;
    translate: -50% 0;
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1;
    letter-spacing: .05em;
    padding-top: .6rem;
    text-align: center;
    background-color: #fff;
    clip-path: polygon(0 0, 100% 0, 50% 100%)
}
.structure__summary-text {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem
}
.structure__summary-text .color {
    color: #ff5900
}
.structure__summary-text > .text {
    display: inline-block;
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .05em
}
.structure__summary-text.large {
    display: block;
    text-align: center
}
.structure__summary-text.large > .text {
    font-weight: 700;
    font-size: 3.2rem;
    line-height: 1.4;
    letter-spacing: .05em
}
.structure__summary-text.large > .pc-only {
    display: none
}
.reason {
    position: relative;
    background-color: #f6f7f9;
    padding-top: 8rem;
    overflow: hidden
}
.reason__title-container {
    max-width: 50rem;
    margin: 0 auto
}
.reason__title-en {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 700;
    color: #0071bc;
    font-size: 9rem;
    line-height: 1;
    letter-spacing: .08em;
    opacity: .1;
    white-space: nowrap
}
.reason__title-wrap {
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
    z-index: 2;
    margin-top: 13.5rem;
    background-color: #f6f7f9;
    padding: 1.4rem 2rem
}
.reason__title-text {
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.2;
    letter-spacing: .11em
}
.reason__title {
    margin-top: .7rem;
    font-weight: 700;
    font-size: 3.2rem;
    line-height: 1.2;
    letter-spacing: .01em
}
.reason__material-container {
    max-width: 50rem;
    margin-inline: auto;
    position: relative
}
.reason__material {
    position: absolute;
    top: 13.5rem;
    top: -26.5rem;
    right: 0;
    z-index: 1
}
.reason__material img {
    width: 34rem
}
.reason__reason-wrap {
    position: relative;
    z-index: 1;
    margin-top: 1.2rem
}
.reason__reason-box {
    border-radius: 1rem 0 0 1rem;
    max-width: 97.6vw;
    margin-left: auto;
    padding: 5rem 3rem 3rem;
    background-color: #fff
}
.reason__reason-box.second {
    padding: 5rem 3rem 3rem;
    border-radius: 0 1rem 1rem 0;
    margin-top: 3rem;
    margin-left: 0;
    margin-right: auto
}
.reason__reason-img {
    text-align: center
}
.reason__reason-img img {
    width: 30rem
}
.reason__reason-img.second img {
    width: 36.4rem
}
.reason__text-wrap {
    margin-top: 3rem;
    max-width: 50rem;
    margin-inline: auto
}
.reason__black-back {
    width: -moz-fit-content;
    width: fit-content;
    padding: .2rem .7rem;
    background-color: #000;
    color: #fff;
    font-weight: 700;
    font-size: 1.4rem;
    line-height: 1.3;
    letter-spacing: .05em
}
.reason__black-back.second {
    display: inline;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone
}
.reason__text {
    margin-top: 1.2rem;
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.6;
    letter-spacing: .05em
}
.reason__color {
    margin-top: -.3rem;
    color: #0071bc;
    font-weight: 700;
    font-size: 3.2rem;
    line-height: 1.3;
    letter-spacing: .05em
}
.reason__list {
    margin-top: 2.4rem
}
.reason__list-item {
    position: relative;
    border-radius: 1rem;
    background-color: #f6f7f9;
    padding: 1.8rem 2rem;
    margin-top: 1rem
}
.reason__list-en {
    white-space: nowrap;
    position: absolute;
    left: 6.5rem;
    top: -.9rem;
    translate: -50% 0;
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #0071bc;
    font-weight: 700;
    font-size: 1.3rem;
    line-height: 1.5;
    letter-spacing: .1em
}
.reason__list-ja {
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .05em
}
.reason__effect-container {
    position: relative;
    margin-top: -4.1rem;
    padding: 14.1rem 2rem 5rem
}
.reason__effect-material {
    position: absolute;
    inset: 0;
    width: 100%
}
.reason__effect-material img {
    width: 100%
}
.reason__effect-inner {
    position: relative;
    z-index: 2
}
.reason__effect-bg-wrap {
    background-color: rgba(90, 151, 199, .9);
    border: .5rem solid transparent
}
.reason__effect {
    background-color: rgba(255, 255, 255, .9);
    padding: 4.2rem 1rem 1.5rem
}
.reason__effect-intro {
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    font-weight: 500;
    font-size: 1.8rem;
    line-height: 1.6;
    letter-spacing: .07em
}
.reason__effect-large {
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: .5rem;
    margin-inline: auto;
    font-weight: 700;
    font-size: 2.4rem;
    line-height: 1.6;
    letter-spacing: .03em
}
.reason__effect-list {
    margin-top: 2rem
}
.reason__effect-item {
    position: relative;
    padding: 3rem 2rem;
    background-color: #fff
}
.reason__effect-item:not(:first-of-type) {
    margin-top: 1rem
}
.reason__effect-item-inner {
    position: relative;
    max-width: 37rem;
    margin-inline: auto
}
.reason__effect-text {
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.4;
    letter-spacing: .07em;
    padding-left: 6rem
}
.reason__effect-text > .color {
    color: #f70
}
.reason__effect-sub {
    margin-top: 1.7rem;
    margin-left: 1.5em
}
.reason__effect-sub-item {
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .07em
}
.reason__effect-img {
    position: absolute;
    top: 0;
    left: 0
}
.reason__effect-img img {
    width: 5rem
}
.reason__pickup {
    position: relative;
    margin-top: 5rem;
    padding: 4.7rem 1.7rem 1.7rem;
    border: .3rem solid #fff
}
.reason__pickup-title {
    text-align: center;
    position: absolute;
    top: -2.2rem;
    left: 50%;
    translate: -50% 0;
    width: 85.1%;
    background-color: #ffe16a;
    padding: .8rem 2rem;
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .05em
}
.reason__pickup-title::before {
    content: "";
    position: absolute;
    bottom: -.8rem;
    left: 50%;
    translate: -50% 0;
    width: 1.1rem;
    height: .9rem;
    background-color: #ffe16a;
    clip-path: polygon(0 0, 100% 0, 0 100%)
}
.reason__pickup-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(16.2rem, 1fr));
    gap: 1rem
}
.reason__pickup-item {
    text-align: center;
    display: grid;
    place-content: center;
    background-color: #fff;
    padding: 2rem;
    height: 8.8rem;
    font-weight: 500;
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: .05em
}
.cta-first {
    position: relative;
    z-index: 2;
    padding: 9.2rem 2rem 0;
    background-color: #fff
}
.cta-first__text-wrap {
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto
}
.cta-first__text {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.8rem;
    line-height: 1.4
}
.cta-first__text > .color {
    color: #f70
}
.cta-first__large {
    text-align: center;
    margin-top: .5rem;
    font-weight: 700;
    font-size: 3.2rem;
    line-height: 1.4;
    letter-spacing: .1em
}
.cta-first__large .color {
    color: #f70
}
.cta-first__large > .pc-only {
    display: none
}
.cta-first__large > .sp-only {
    display: inline-block;
    text-align: center
}
.cta-first__large > .sp-only > .color {
    padding-inline: .5rem
}
.cta-first__link-wrap {
    position: relative;
    background-color: #004a7c;
    margin: 2rem calc(50% - 50vw) 0;
    padding: 4.2rem 2rem 2rem
}
.cta-first__link-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    translate: -50% 0;
    width: 6rem;
    height: 2rem;
    background-color: #fff;
    clip-path: polygon(0 0, 100% 0, 50% 100%)
}
.cta-first__link-text {
    text-align: center;
    color: #fff;
    font-weight: 500;
    font-size: 1.4rem;
    line-height: 1.6;
    letter-spacing: .05em
}
.cta-first__btn-wrap {
    margin-top: 1rem;
    margin-inline: auto;
    max-width: 128rem;
    display: flex;
    flex-direction: column;
    gap: 2rem
}
.cta-first__btn {
    text-align: center;
    max-width: 50rem;
    width: 100%;
    height: 9.3rem;
    margin-inline: auto;
    border: .3rem solid #fff;
    border-radius: 2rem;
    display: grid;
    place-content: center;
    font-weight: 700;
    color: #fff;
    font-size: 1.8rem;
    line-height: 1.4;
    letter-spacing: .05em;
    position: relative
}
.cta-first__btn.link-trial {
    background-color: #f70
}
.cta-first__btn.link-contact {
    background-color: #0071bc
}
.cta-first__btn > .tab {
    border-radius: .3rem;
    background-color: #fff;
    display: grid;
    place-content: center;
    position: absolute;
    top: -.9rem;
    left: -1.1rem;
    width: 10rem;
    height: 3rem;
    color: #f70;
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 1.6;
    letter-spacing: .05em
}
.cta-first__btn > .tab::before {
    content: "";
    position: absolute;
    bottom: -.5rem;
    left: 6.8rem;
    width: 1.2rem;
    height: .6rem;
    background-color: #fff;
    clip-path: polygon(0 0, 80% 0, 100% 100%)
}
.voice {
    padding: 7rem 0 5rem
}
.voice__catch {
    font-size: 2rem
}
.voice__contents-wrap {
    position: relative;
    margin-top: 2.5rem;
    border-top: 1px solid #000;
    padding: 4rem 2rem 0
}
.voice__material {
    position: absolute;
    top: -8.2rem;
    right: .8rem
}
.voice__material img {
    width: 10rem
}
.voice__contents {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4rem
}
.voice__item {
    display: flex;
    flex-direction: row-reverse;
    gap: 1.7rem
}
.voice__txt {
    position: relative;
    background-color: #0071bc;
    border-radius: 1rem;
    padding: 3rem;
    min-height: 25.1rem;
    display: flex;
    flex-direction: column
}
.voice__txt::before {
    content: "";
    position: absolute;
    top: 1.9rem;
    left: -1.4rem;
    width: 1.9rem;
    height: 1.6rem;
    background-color: inherit;
    clip-path: polygon(0 0, 100% 0, 100% 100%);
    transform: 5deg
}
.voice__txt > .txt {
    font-weight: 500;
    color: #fff;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .03em
}
.voice__txt > .name {
    display: block;
    font-weight: 500;
    font-size: 1.4rem;
    line-height: 1.8;
    letter-spacing: .05em;
    color: rgba(255, 255, 255, .5);
    margin-top: auto
}
.voice__img {
    flex-shrink: 0
}
.voice__img img {
    width: 6.9rem;
    aspect-ratio: 1
}
.benefits {
    position: relative;
    margin-top: 2rem;
    padding-block: 7rem 5rem;
    padding-inline: 2rem
}
.benefits__contents-wrap {
    position: relative;
    margin-top: 1rem
}
.benefits__outer-material {
    position: absolute;
    top: -29rem;
    right: -4rem;
    width: 16rem;
    height: 9rem
}
.benefits__outer-material img{
    transform: scale(-1, 1);
}
.benefits__outer-material .achieve{
    position: absolute;
    width: 100%;
    left: 50%;
    top: 55%;
    transform: translate(-50%,-50%);
    color: #f70;
    font-size: clamp(1.4rem,1.8vw,3.2rem);
    font-weight: bold;
    text-align: center;
}
.benefits__outer-material .achieve span{
    display: block;
}
.benefits__outer-material .achieve .lead{
    color: #000;
    font-size: 90%;
}
.benefits__outer-material .achieve em{
    font-family: "Plus Jakarta Sans",sans-serif;;
    font-style: normal;
    font-size: 180%;
}
.benefits__contents {
    border: .2rem solid #000;
    padding: 0 3rem;
    background-color: #fff;
    display: grid;
    grid-template-columns: 1fr
}
.benefits__item {
    position: relative;
    padding: 4rem 0;
    min-height: 20.2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem
}
.benefits__item.m--border::after, .benefits__item.m--border::before {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: .2rem;
    background: linear-gradient(to right, #000, #000 .4rem, transparent .4rem) repeat-x left bottom/.8rem .2rem
}
.benefits__item.m--border::before {
    left: 0
}
.benefits__item.m--border::after {
    top: auto;
    bottom: 0
}
.benefits__ttl {
    display: flex;
    align-items: center;
    background-color: #ffe16a;
    font-weight: 500;
    font-size: 2rem;
    line-height: 1.2;
    letter-spacing: .05em;
    padding-inline: 2rem;
    border-radius: 11.1rem
}
.benefits__ttl > .fz13 {
    font-weight: 500;
    font-size: 1.4rem;
    line-height: 1.2;
    letter-spacing: .05em
}
.benefits__ttl > .fz28 {
    font-weight: 500;
    font-size: 2rem;
    line-height: 1.2;
    letter-spacing: .05em
}
.benefits__benefit > .num {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 700;
    font-size: 6rem;
    line-height: 1
}
.benefits__benefit .unit {
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1
}
.benefits__desc {
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .05em;
    margin-top: -.6rem
}
.benefits__material {
    position: absolute;
    top: 25.4rem;
    right: 2rem
}
.benefits__material img {
    width: 10rem
}
.cases {
    margin-top: 2rem;
    padding-top: 7rem
}
.cases__contents-wrap {
    margin-top: 4.5rem;
    border-top: 1px solid #000
}
.cases__contents {
    display: grid;
    grid-template-columns: 1fr
}
.cases__item {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 2rem 2rem 4rem
}
.cases__item:last-of-type {
    border-top: 1px solid #000
}
.cases__num {
    position: absolute;
    top: .8rem;
    right: .8rem;
    display: grid;
    place-content: center;
    place-items: center;
    background-color: #0071bc;
    border-radius: 100vmax;
    width: 5.8rem;
    aspect-ratio: 1
}
.cases__num > .case {
    color: #fff;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    font-size: 1rem;
    line-height: 1;
    letter-spacing: .05em
}
.cases__num > .num {
    color: #fff;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 400;
    font-size: 1.9rem;
    line-height: 1;
    letter-spacing: .05em
}
.cases__about {
    color: #f70;
    text-align: center;
    font-weight: 500;
    font-size: 2rem;
    line-height: 1.6;
    letter-spacing: .05em;
    order: 1
}
.cases__desc-wrap {
    margin-top: 2rem;
    order: 2
}
.cases__desc {
    margin-top: 1rem;
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .03em
}
.cases__desc-name {
    margin-top: 1rem;
    font-weight: 400;
    font-size: 1.4rem;
    line-height: 1.6;
    letter-spacing: .03em;
    color: rgba(0, 0, 0, .5)
}
.cases__img {
    order: 0
}
.cases__img img {
    width: 100%;
    aspect-ratio: 668/406
}
.support {
    margin-top: 2rem;
    padding: 7rem 2rem 5rem
}
.support__contents {
    display: flex;
    flex-direction: column;
    gap: 4rem
}
.support__catch {
    margin-top: 3.3rem;
    font-weight: 700;
    font-size: 2.4rem;
    line-height: 1.3;
    letter-spacing: .05em
}
.support__desc {
    margin-top: 1rem;
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: .03em
}
.support__note {
    margin-top: 1.5rem;
    font-weight: 400;
    font-size: 1.4rem;
    line-height: 1.6
}
.support__img-wrap img {
    width: 33.4rem
}
.price {
    position: relative;
    background-color: #eff0f2;
    padding: 21rem 2rem 10rem;
    clip-path: polygon(0 0, 100% 0, 100% 96.7%, 50% 100%, 0 96.7%)
}
.price__over-wrap {
    position: relative
}
.price__material {
    position: absolute;
    z-index: 2;
    top: 6.6rem;
    left: 50%;
    translate: -50% 0
}
.price__material img {
    width: 13.6rem
}
.price__desc {
    margin: 3.5rem auto 0;
    width: -moz-fit-content;
    width: fit-content;
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.3;
    letter-spacing: .1em
}
.price__contents-inner {
    margin-top: 1.5rem
}
.price__inline-box {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem
}
.price__box-item {
    position: relative;
    max-width: 45rem;
    width: 100%;
    padding: 3rem 2rem;
    background-color: #fff;
    border-radius: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center
}
.price__box-item:nth-of-type(2)::before, .price__box-item:nth-of-type(3)::before {
    content: "";
    position: absolute;
    top: -2.5rem;
    left: 50%;
    translate: -50% 0;
    background: url(../images/price_plus.svg) no-repeat center/contain;
    width: 2rem;
    aspect-ratio: 1
}
.price__box-item:nth-of-type(4) {
    border: .4rem solid #ff813e
}
.price__box-item:nth-of-type(4)::before {
    content: "";
    position: absolute;
    top: -3rem;
    left: 50%;
    translate: -50% 0;
    background: url(../images/price_equal_sp.svg) no-repeat center/contain;
    width: 1.4rem;
    height: 2.1rem
}
.price__box-txt {
    text-align: center;
    font-weight: 400;
    font-size: 2rem;
    line-height: 1.4;
    letter-spacing: .05em
}
.price__box-txt:not(:has(br)) {
    margin-top: .3rem
}
.price__box-num {
    margin-top: .6rem;
    white-space: nowrap
}
.price__box-num.m--minus {
    margin-top: .6rem
}
.price__box-num:has(.zero) {
    margin-top: .6rem
}
.price__box-num:has(.sum) {
    margin-top: .6rem
}
.price__box-num > .num {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 700;
    font-size: 5rem;
    line-height: 1
}
.price__box-num > .num.zero {
    font-size: 7rem
}
.price__box-num > .unit {
    font-weight: 700;
    font-size: 2rem;
    line-height: 1
}
.price__box-note {
    margin-top: .5rem;
    font-weight: 400;
    font-size: 1.4rem;
    letter-spacing: .05em;
    line-height: 1.6
}
.price__note {
    margin-top: 1rem;
    font-weight: 400px;
    font-size: 1.4rem;
    line-height: 2;
    letter-spacing: .03em
}
.faq {
    background-color: #eff0f2;
    padding: 8.8rem 2rem 15rem;
    clip-path: polygon(0 0, 50% 4.3%, 100% 0, 100% 100%, 0 100%)
}
.faq__ttl {
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto
}
.faq__list-wrap {
    margin-top: 3rem
}
.faq__tab-menu {
    height: 6rem;
    width: 28rem;
    margin-inline: auto;
    position: relative
}
.faq__tab-initial {
    cursor: pointer
}
.faq__tab-initial > .txt {
    position: relative;
    height: 6rem;
    font-size: 1.4rem;
    line-height: 1.5;
    letter-spacing: .05em;
    display: grid;
    place-items: center;
    padding-inline: 3rem 6rem
}
.faq__tab-initial > .js-current {
    position: relative;
    justify-content: left
}
.faq__tab-initial > .js-current::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(0, -50%);
    width: 4rem;
    height: 6rem;
    background: #000 url(../images/faq_tab_icon.svg) no-repeat center/1.2rem .8rem
}
.faq__tab-initial > .js-current.is-active::before {
    transform: translate(0, -50%) scale(1, -1)
}
.faq__tab-menu-list {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    height: auto
}
.faq__tab-menu-item {
    height: 6rem;
    gap: .4rem;
    background-color: #fff;
    cursor: pointer;
    font-size: 1.4rem;
    line-height: 1.5;
    letter-spacing: .05em;
    padding-inline: 3rem;
    display: grid;
    place-content: center;
    justify-content: left
}
.faq__tab-panel {
    margin-top: 3rem;
    transition: all .3s
}
.faq__panel-box {
    display: none
}
.faq__panel-box.is-show {
    display: block
}
.faq__contents {
    position: relative;
    background-color: #fff;
    margin-top: 3rem;
    padding: 2.6rem 2rem 2.6rem 4rem;
    border: .3rem solid transparent;
    border-radius: 2rem;
    cursor: pointer
}
.faq__contents.is-open {
    border-color: #ffe16a
}
.faq__question {
    position: relative;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: .05em;
    padding-right: 3rem
}
.faq__question::before {
    font-family: "Plus Jakarta Sans", sans-serif;
    content: "Q";
    position: absolute;
    top: -4.8rem;
    left: -5.6rem;
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .05em;
    width: 5.6rem;
    aspect-ratio: 1;
    border-radius: 100vmax;
    background-color: #ffe16a;
    display: grid;
    place-content: center
}
.faq__question::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    translate: 0 -50%;
    background: url(../images/faq_arrow.svg) no-repeat center/contain;
    width: 1.7rem;
    height: 1.9rem
}
.faq__question.is-open::after {
    background: url(../images/faq_arrow_active.svg) no-repeat center/contain
}
.faq__answer-wrap {
    transition: all .3s;
    opacity: 0;
    visibility: hidden
}
.faq__answer-wrap.is-open {
    opacity: 1;
    visibility: visible
}
.faq__answer-inner {
    margin-top: 2rem
}
.faq__answer {
    position: relative;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: .1em
}
.cta {
    position: relative;
    background-color: #004a7c;
    padding: 4rem 2rem 3rem
}
.cta__material {
    position: absolute;
    top: -11rem;
    left: 50%;
    translate: -50% 0
}
.cta__material img {
    width: 12rem
}
.cta__link-wrap {
    margin-inline: auto;
    max-width: 128rem;
    display: flex;
    flex-direction: column;
    gap: 2rem
}
.cta__btn {
    text-align: center;
    max-width: 50rem;
    width: 100%;
    height: 9.3rem;
    margin-inline: auto;
    border: .3rem solid #fff;
    border-radius: 2rem;
    display: grid;
    place-content: center;
    font-weight: 700;
    color: #fff;
    font-size: 1.8rem;
    line-height: 1.4;
    letter-spacing: .05em;
    position: relative
}
.cta__btn.link-trial {
    background-color: #f70
}
.cta__btn.link-contact {
    background-color: #0071bc
}
.cta__btn > .tab {
    border-radius: .3rem;
    background-color: #fff;
    display: grid;
    place-content: center;
    position: absolute;
    top: -.9rem;
    left: -1.1rem;
    width: 10rem;
    height: 3rem;
    color: #f70;
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 1.6;
    letter-spacing: .05em
}
.cta__btn > .tab::before {
    content: "";
    position: absolute;
    bottom: -.5rem;
    left: 6.8rem;
    width: 1.2rem;
    height: .6rem;
    background-color: #fff;
    clip-path: polygon(0 0, 80% 0, 100% 100%)
}
@media screen and (min-width:961px) {
    body {
        font-size: 1.8rem
    }
    a[href^="tel:"] {
        pointer-events: none;
        text-decoration: none !important
    }
    br.pc {
        display: inline
    }
    br.sp {
        display: none
    }
    .opening-animation__inner {
        width: 72rem
    }
    .opening-animation__img-wrap {
        gap: 4rem;
        justify-content: flex-start
    }
    .opening-animation__img {
        width: auto
    }
    .opening-animation__img img {
        width: auto
    }
    .opening-animation__img.z-1 img {
        width: 15rem
    }
    .opening-animation__img.z-2 img {
        width: 19.5rem
    }
    .opening-animation__img.z-3 img {
        width: 17.4rem
    }
    .opening-animation__img.z-4 img {
        width: 9.9rem
    }
    .opening-animation__img.last {
        margin-top: -22rem
    }
    .opening-animation__img.last img {
        width: 17rem
    }
    .opening-animation__text-first {
        margin: 4rem auto 0;
        max-width: 72rem;
        font-size: 8.1rem
    }
    .opening-animation__text-last {
        font-size: 12.3rem
    }
    .opening-animation__text-last::before {
        top: -11rem;
        left: 3rem;
        background: url(../images/opening_material_left.svg) no-repeat center/contain;
        width: 9.9rem;
        height: 10.4rem
    }
    .opening-animation__text-last::after {
        top: -11rem;
        right: 3rem;
        background: url(../images/opening_material_right.svg) no-repeat center/contain;
        width: 9.9rem;
        height: 10.4rem
    }
    .header {
        top: 0;
        height: 8rem;
        padding-left: 3rem
    }
    .header__logo {
        margin-top: 0
    }
    .header__logo img {
        width: 19.3rem
    }
    .header__nav-overwrap {
        display: contents
    }
    .header__nav-wrap {
        flex-shrink: .5;
        display: block
    }
    .header__link-wrap {
        position: static;
        height: 100%;
        width: auto
    }
    .header__link {
        padding: 0 3.2rem;
        width: 28rem;
        width: clamp(26rem, 22rem + 3.125vw, 28rem);
        font-size: 2.2rem
    }
    .header__link > .icon img {
        width: 3.1rem
    }
    .header__link > .text {
        display: inline
    }
    .header__sp-nav-btn {
        display: none
    }
    .footer {
        padding: 8rem 2rem
    }
    .footer__inner {
        display: block;
        max-width: 128rem;
        margin-inline: auto
    }
    .footer__logo img {
        width: 24.5rem
    }
    .footer__list {
        grid-template-columns: repeat(3, max-content);
        gap: 3.5rem
    }
    .footer__list-link {
        text-align: start
    }
    .footer__copyright small {
        font-size: 1.4rem
    }
    .section-ttl-wrap {
        gap: 1.5rem
    }
    .section-ttl {
        font-size: 6.8rem;
        letter-spacing: .15em
    }
    .section-ttl-en {
        font-size: 2rem;
        letter-spacing: .14em
    }
    .section-ttl-en::after, .section-ttl-en::before {
        width: 4.75rem
    }
    .section-ttl-en::before {
        left: -5.75rem
    }
    .section-ttl-en::after {
        right: -5.75rem
    }
    .section-bgwrap {
        padding: 4rem 4rem
    }
    .common {
        flex-direction: row;
        justify-content: space-between;
        gap: 2rem;
        max-width: 172rem;
        margin-inline: auto;
        padding-inline: 4rem
    }
    .common__ttl-wrap {
        flex: 1 0 clamp(56rem, -44rem + 78.125vw, 106rem)
    }
    .common__ttl {
        font-size: 6.8rem;
        letter-spacing: .15em;
        white-space: nowrap
    }
    .common__ttl-en {
        font-size: 2rem;
        letter-spacing: .14em;
        margin-top: 1.5rem;
        margin-left: 5.75rem
    }
    .common__ttl-en::before {
        left: -5.75rem;
        width: 4.75rem
    }
    .common__desc {
        margin-top: 1.5 rem;
        font-size: 1.8rem;
        line-height: 1.8
    }
    .common-catch {
        max-width: 172rem;
        margin: 4rem auto 0;
        padding-inline: 4rem;
        font-size: 4rem;
        line-height: 1.2;
        letter-spacing: .1em
    }
    .fixed-btn {
        bottom: 0;
        left: auto;
        right: 0
    }
    .fixed-btn a .txt {
        padding: 2.3rem 1rem;
        width: 8.8rem;
        border-radius: 1.1rem;
        text-align: center;
        font-size: 1.7rem;
        line-height: 1.2;
        font-weight: 900;
        background-color: #000;
        top: auto;
        bottom: calc(100% - 1rem);
        left: 50%;
        transform: translate(-50%, 0)
    }
    .fixed-btn a .txt::after {
        content: "";
        width: 2.4rem;
        height: 2.1rem;
         border-left: 30px solid transparent;
        border-right: 30px solid transparent;
        border-top: 30px solid black;
        position: absolute;
        left: 50%;
        bottom: -1.4rem;
        transform: translate(-50%, 0)
    }
    .fixed-btn a .img img {
        width: 10rem
    }
    .mv {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 82rem
    }
    .mv__inner {
        display: contents
    }
    .mv__bg-img {
        width: 192rem;
        height: 36.7rem;
        background: url(../images/mv_bg.png) no-repeat center bottom/192rem auto
    }
    .mv__left-wrap {
        flex: 1 1 50%;
        height: 100%
    }
    .mv__left-inner {
        margin-top: 20rem;
        padding: 0;
        padding-left: clamp(6rem, -30.2rem + 28.28125vw, 24.1rem)
    }
    .mv__text {
        font-size: 3.7rem;
        font-size: clamp(2.8rem, 1rem + 1.40625vw, 3.7rem);
        letter-spacing: .2em
    }
    .mv__large {
        font-size: 7.8rem;
        font-size: clamp(6rem, 2.4rem + 2.8125vw, 7.8rem)
    }
    .mv__logo-wrap {
        margin-top: 3.5rem
    }
    .mv__logo-text {
        font-size: 2.4rem;
        letter-spacing: .1em
    }
    .mv__service-logo {
        margin-top: -2.8rem
    }
    .mv__service-logo img {
        width: 53.4rem
    }
    .mv__desc {
        display: block;
        text-align: center;
        margin-top: 14.5rem;
        margin-top: clamp(10rem, 1rem + 7.03125vw, 14.5rem);
        background-color: #0071bc
    }
    .mv__desc > .text {
        background-color: transparent;
        font-size: 2.4rem;
        font-size: clamp(2rem, 1.2rem + .625vw, 2.4rem);
        line-height: 1.6;
        letter-spacing: .05em;
        padding: 0 1rem 0 1rem
    }
    .mv__desc > .text.last {
        margin-top: 0;
        padding: 0 1rem 0 0
    }
    .mv__desc::before {
        content: "";
        position: absolute;
        right: -1.3rem;
        top: 0;
        width: 1.3rem;
        height: 100%;
        background-color: #0071bc;
        clip-path: polygon(0 0, 100% 0, 0 50%, 100% 100%, 0 100%)
    }
    .mv__desc-sp {
        display: none
    }
    .mv__right-wrap {
        flex: 1 1 50%;
        height: 100%;
        padding-left: 5.7rem;
        padding-bottom: 0
    }
    .mv__right-inner {
        margin-top: 15.5rem
    }
    .mv__right-img img {
        max-width: 100%;
        width: 67.4rem
    }
    .slick-wrap {
        position: static;
        margin-top: 0;
        padding-block: 0 4rem
    }
    .slick-top .slick-item img {
        width: 32.7rem
    }
    .slick-bottom {
        margin-top: 4rem
    }
    .slick-bottom__loop {
        animation-duration: 20s
    }
    .structure {
        padding: 18rem 2rem 0
    }
    .structure__inner {
        display: block;
        max-width: 146rem;
        margin-inline: auto;
        padding-bottom: 6rem
    }
    .structure__text-wrap {
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: 106.4rem
    }
    .structure__title > .text {
        font-size: 2.88rem
    }
    .structure__title > .text-large {
        display: inline-block;
        font-size: 7.7rem
    }
    .structure__text {
        margin-top: 0;
        font-size: 2rem
    }
    .structure__img-wrap {
        margin-top: 2.5rem
    }
    .structure__img {
        max-width: none;
        margin: 0
    }
    .structure__img img {
        width: 146rem
    }
    .structure__summary-wrap {
        padding: 8.5rem 2rem 5.5rem
    }
    .structure__summary-wrap::before {
        width: 20.2rem;
        height: 7rem;
        font-size: 2.4rem;
        padding-top: 1.1rem
    }
    .structure__summary-text > .text {
        font-size: 3.4rem;
        letter-spacing: .07em
    }
    .structure__summary-text.large {
        display: flex;
        gap: 2rem;
        gap: clamp(.5rem, -2.5rem + 2.34375vw, 2rem);
        margin-top: -1.2rem
    }
    .structure__summary-text.large > .text {
        font-size: 6rem;
        font-size: max(4.5rem, 3.13vw);
        line-height: 1.6;
        letter-spacing: .07em
    }
    .structure__summary-text.large > .sp-only {
        display: none
    }
    .structure__summary-text.large > .pc-only {
        display: block
    }
    .reason {
        padding-top: 20rem;
        overflow: wrap
    }
    .reason__title-container {
        margin: 0;
        margin-left: 20.9rem;
        margin-left: clamp(5rem, -26.8rem + 24.84375vw, 20.9rem);
        max-width: none
    }
    .reason__title-en {
        font-size: 19.3rem;
        font-size: clamp(16rem, 9.4rem + 5.15625vw, 19.3rem);
        white-space: normal
    }
    .reason__title-wrap {
        width: auto;
        margin-top: -5rem;
        text-indent: 1em;
        background-color: transparent;
        padding: 0
    }
    .reason__title-text {
        font-size: 2.66rem
    }
    .reason__title {
        margin-top: 1.8rem;
        font-size: 5.4rem
    }
    .reason__material-container {
        display: contents
    }
    .reason__material {
        top: 0;
        z-index: 0
    }
    .reason__material img {
        width: 60.5rem;
        width: clamp(45rem, 14rem + 24.21875vw, 60.5rem)
    }
    .reason__reason-wrap {
        margin-top: 5.6rem
    }
    .reason__reason-box {
        border-radius: 0 1rem 1rem 0;
        max-width: 169rem;
        margin-left: 0;
        margin-right: auto;
        display: flex;
        justify-content: flex-end;
        gap: 20rem;
        padding: 5.3rem 2.6rem 5.3rem
    }
    .reason__reason-box.second {
        border-radius: 1rem 0 0 1rem;
        padding: 5.3rem 10rem 5.3rem;
        margin-top: 5rem;
        margin-left: auto;
        margin-right: 0;
        flex-direction: row-reverse;
        gap: 13rem
    }
    .reason__reason-img img {
        width: 43.2rem
    }
    .reason__reason-img.second img {
        width: 53.7rem
    }
    .reason__text-wrap {
        flex: 0 0 60.2rem;
        max-width: none;
        margin: 0
    }
    .reason__black-back.second {
        display: block
    }
    .reason__black-back {
        padding: 1px .9rem;
        font-size: 2rem;
        line-height: 1.5
    }
    .reason__text {
        margin-top: 2.8rem;
        font-size: 2.8rem;
        letter-spacing: .07em
    }
    .reason__color {
        margin-top: -.3rem;
        font-size: 4.6rem;
        line-height: 1.6;
        letter-spacing: .07em
    }
    .reason__list {
        margin-top: 5rem;
        display: grid;
        grid-template-columns: repeat(3, 19.4rem);
        gap: 1rem
    }
    .reason__list-item {
        padding: 3rem 2rem 2rem;
        margin-top: 0
    }
    .reason__list-en {
        left: 50%;
        top: -1rem;
        translate: -50% 0;
        font-size: 1.5rem;
        letter-spacing: .21em
    }
    .reason__list-ja {
        text-align: center;
        line-height: 1.8
    }
    .reason__effect-container {
        padding: 14.1rem 2rem 10rem
    }
    .reason__effect-inner {
        max-width: 128rem;
        margin-inline: auto
    }
    .reason__effect-bg-wrap {
        border: 2rem solid transparent
    }
    .reason__effect {
        padding: 8.8rem 5rem 10rem
    }
    .reason__effect-intro {
        font-size: 2.66rem;
        letter-spacing: .1em
    }
    .reason__effect-large {
        text-align: start;
        font-size: 4.4rem;
        letter-spacing: .01em
    }
    .reason__effect-list {
        margin-top: 4.2rem;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 3rem
    }
    .reason__effect-item:not(:first-of-type) {
        margin-top: 0
    }
    .reason__effect-item {
        display: flex;
        padding: 3.2rem 4rem;
        gap: 3rem
    }
    .reason__effect-item-inner {
        display: contents
    }
    .reason__effect-text-wrap {
        flex: 0 .5 auto
    }
    .reason__effect-text {
        font-size: 2.4rem;
        padding-left: 0
    }
    .reason__effect-sub-item {
        line-height: 1.8
    }
    .reason__effect-img {
        position: static;
        flex: 0 .5 16rem
    }
    .reason__effect-img img {
        width: 16rem
    }
    .reason__pickup {
        margin-top: 7rem;
        padding: 6.5rem 7.5rem;
        border: .5rem solid #fff
    }
    .reason__pickup-title {
        width: -moz-fit-content;
        width: fit-content;
        font-size: 1.9rem;
        padding: .8rem 2.8rem
    }
    .reason__pickup-list {
        grid-template-columns: repeat(4, 1fr);
        gap: 2rem
    }
    .reason__pickup-item {
        padding: 1rem;
        height: 11rem;
        font-size: 2.2rem
    }
    .cta-first {
        padding: 13.5rem 2rem 0
    }
    .cta-first__text {
        gap: 1rem;
        font-size: 3.2rem
    }
    .cta-first__large {
        margin-top: 1rem;
        text-align: start;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1.5rem;
        font-size: 6.5rem
    }
    .cta-first__large > .pc-only {
        display: inline
    }
    .cta-first__large > .sp-only {
        display: none
    }
    .cta-first__link-wrap {
        margin: 4rem calc(50% - 50vw) 0;
        padding: 8.3rem 2rem 9rem
    }
    .cta-first__link-wrap::before {
        width: 9rem;
        height: 3.1rem
    }
    .cta-first__link-text {
        font-size: 3rem;
        line-height: 1.8
    }
    .cta-first__btn-wrap {
        margin-top: 1.5rem;
        flex-direction: row;
        gap: 3rem
    }
    .cta-first__btn {
        max-width: 100%;
        border: .5rem solid #fff;
        height: 14.3rem;
        font-size: 3.2rem;
        letter-spacing: .1em
    }
    .cta-first__btn > .tab {
        border-radius: .6rem;
        top: -1.3rem;
        left: -1.7rem;
        width: 16.2rem;
        height: 4.9rem;
        font-size: 2rem
    }
    .cta-first__btn > .tab::before {
        bottom: -.9rem;
        left: 11rem;
        width: 2rem;
        height: 1rem
    }
    .voice {
        padding: 8rem 0 4rem
    }
    .voice__catch {
        margin-top: 6rem;
        font-size: 4rem;
        font-size: clamp(3.5rem, -.3636363636rem + 2.2727272727vw, 4rem)
    }
    .voice__contents-wrap {
        margin-top: 5rem;
        padding: 4rem 6rem
    }
    .voice__material {
        top: -20rem;
        right: 7rem
    }
    .voice__material img {
        width: 24.8rem
    }
    .voice__contents {
        grid-template-columns: repeat(4, 1fr);
        gap: clamp(2.5rem, -4.5rem + 5.46875vw, 6rem)
    }
    .voice__item {
        flex-direction: column;
        align-items: center;
        gap: 3rem
    }
    .voice__txt {
        border-radius: 4rem;
        padding: clamp(1.8rem, -.6rem + 1.875vw, 3rem) clamp(2rem, -2rem + 3.125vw, 4rem);
        min-height: 28.7rem
    }
    .voice__txt::before {
        left: clamp(6rem, -4rem + 7.8125vw, 11rem);
        bottom: -2.4rem;
        top: auto;
        width: 3.9rem;
        height: 2.6rem;
        clip-path: polygon(0 0, 100% 0, 100% 100%)
    }
    .voice__txt > .txt {
        font-size: clamp(1.6rem, 1.2rem + .3125vw, 1.8rem);
        line-height: 1.8;
        letter-spacing: .05em
    }
    .voice__img {
        flex-shrink: 1
    }
    .voice__img img {
        width: 13.1rem
    }
    .benefits {
        margin-top: 8rem;
        padding-block: 8rem 10rem;
        padding-inline: 0
    }
    .benefits__inner {
        max-width: 172rem;
        margin-inline: auto
    }
    .benefits__contents-wrap {
        margin-top: 6.5rem;
        padding-inline: 4rem
    }
    .benefits__outer-material {
        top: -14.1rem;
        right: clamp(1rem, -31rem + 25vw, 17rem);
        width: 36rem;
        width: clamp(28rem, 12rem + 12.5vw, 36rem);
        height: auto;
        aspect-ratio: 360/235
    }
    .benefits__outer-material .achieve{
        top: 48%;
    }
    .benefits__contents {
        border: .4rem solid #000;
        max-width: clamp(100rem, 48rem + 40.625vw, 126rem);
        padding: 6rem 0;
        grid-template-columns: repeat(3, 1fr)
    }
    .benefits__item {
        min-height: 29.9rem;
        padding: 5rem clamp(3rem, 1rem + 1.5625vw, 4rem) 2rem;
        gap: 2.5rem
    }
    .benefits__item.m--border::after, .benefits__item.m--border::before {
        width: .2rem;
        height: 100%;
        background: url(../images/dots_line.svg) repeat center top/contain
    }
    .benefits__item.m--border::after {
        right: 0
    }
    .benefits__ttl {
        position: absolute;
        top: -8.5rem;
        left: 50%;
        translate: -50% 0;
        display: grid;
        place-content: center;
        place-items: center;
        width: 11.8rem;
        aspect-ratio: 1;
        border-radius: 100vmax;
        font-size: 2.8rem;
        padding-inline: 0
    }
    .benefits__ttl > .fz13 {
        font-size: 1.3rem
    }
    .benefits__ttl > .fz28 {
        margin-top: 1rem;
        font-size: 2.8rem
    }
    .benefits__benefit > .num {
        font-size: 8.2rem
    }
    .benefits__benefit .unit {
        font-size: 3.6rem
    }
    .benefits__desc {
        font-size: 1.8rem;
        line-height: 1.8;
        padding-inline: clamp(4rem, 3rem + .78125vw, 4.5rem);
        margin-top: 0
    }
    .benefits__material {
        top: auto;
        bottom: 0;
        right: clamp(1rem, -13.8rem + 11.5625vw, 8.4rem)
    }
    .benefits__material img {
        width: clamp(29rem, 1rem + 21.875vw, 43rem)
    }
    .cases {
        margin-top: 8rem;
        padding-top: 8rem
    }
    .cases__contents-wrap {
        margin-top: 6rem
    }
    .cases__contents {
        grid-template-columns: repeat(2, 1fr)
    }
    .cases__item {
        align-items: center;
        flex-direction: row-reverse;
        padding: 4rem 4rem 6rem
    }
    .cases__item:first-of-type {
        border-right: 1px solid #000
    }
    .cases__item:last-of-type {
        border-top: none
    }
    .cases__num {
        top: -.7rem;
        left: 2.6rem;
        right: auto;
        width: 7.6rem
    }
    .cases__num > .case {
        font-size: 1.2rem
    }
    .cases__num > .num {
        font-size: 2.5rem
    }
    .cases__about {
        text-align: start;
        line-height: 1.3;
        order: 0
    }
    .cases__desc-wrap {
        flex: 0 1 46rem;
        margin-left: 3rem;
        order: 1;
        margin-top: 0
    }
    .cases__desc {
        font-size: 1.8rem;
        line-height: 1.8;
        letter-spacing: .05em
    }
    .cases__desc-name {
        letter-spacing: .05em;
        line-height: 1.8
    }
    .cases__img {
        order: 2;
        flex: 0 1 35rem
    }
    .cases__img img {
        width: 34.9rem;
        aspect-ratio: 350/212
    }
    .support {
        margin-top: 8rem;
        padding: 4.4rem 10rem
    }
    .support__contents {
        max-width: 164rem;
        margin-inline: auto;
        flex-direction: row;
        gap: 9.7rem;
        align-items: center;
        justify-content: center
    }
    .support__text-wrap {
        flex: 0 1 91.7rem;
        margin-top: -1rem
    }
    .support__catch {
        margin-top: 4rem;
        font-size: 4rem
    }
    .support__desc {
        margin-top: 2rem;
        font-size: 1.8rem;
        line-height: 1.8;
        letter-spacing: .05em
    }
    .support__note {
        margin-top: 3rem;
        font-size: 1.6rem
    }
    .support__img-wrap {
        flex: 0 0 63.1rem
    }
    .support__img-wrap img {
        width: 63.1rem
    }
    .price {
        padding: 38rem 2rem 17.8rem;
        clip-path: polygon(0 0, 100% 0, 100% 89.6%, 50% 100%, 0 89.6%)
    }
    .price__material {
        top: 9.7rem
    }
    .price__material img {
        width: 27.8rem
    }
    .price__desc {
        margin: 8rem auto 0;
        font-size: 4rem
    }
    .price__contents-inner {
        max-width: 128rem;
        margin: 4rem auto 0
    }
    .price__inline-box {
        grid-template-columns: repeat(4, 1fr);
        gap: 5.9rem
    }
    .price__box-item {
        max-width: none;
        width: auto;
        padding: 3rem 4rem
    }
    .price__box-item:nth-of-type(2)::before, .price__box-item:nth-of-type(3)::before {
        top: calc(50% + .5rem);
        left: -4.7rem;
        translate: 0 -50%;
        width: 3.3rem
    }
    .price__box-item:nth-of-type(4)::before {
        top: calc(50% + .5rem);
        left: -4.3rem;
        translate: 0 -50%;
        background: url(../images/price_equal.svg) no-repeat center/contain;
        width: 3rem;
        height: 2.1rem
    }
    .price__box-txt:not(:has(br)) {
        margin-top: 1.3rem
    }
    .price__box-num {
        margin-top: 2.6rem
    }
    .price__box-num.m--minus {
        margin-top: 1rem
    }
    .price__box-num:has(.zero) {
        margin-top: 2.3rem
    }
    .price__box-num:has(.sum) {
        margin-top: 2rem
    }
    .price__box-num > .num {
        font-size: 4.8rem
    }
    .price__box-num > .num.zero {
        font-size: 7.7rem
    }
    .price__box-num > .unit {
        font-size: 2.4rem
    }
    .price__box-note {
        margin-top: 1.5rem
    }
    .price__note {
        margin-top: 6rem;
        font-size: 1.6rem;
        letter-spacing: .05em
    }
    .faq {
        padding: 27rem 6rem 25rem;
        clip-path: polygon(0 0, 50% 8.4%, 100% 0, 100% 100%, 0 100%)
    }
    .faq__inner {
        max-width: 128rem;
        margin-inline: auto
    }
    .faq__list-wrap {
        margin-top: 3.5rem
    }
    .faq__tab-menu {
        height: auto;
        width: auto
    }
    .faq__tab-initial {
        display: none
    }
    .faq__tab-initial > .txt {
        padding-inline: 0
    }
    .faq__tab-menu-list {
        max-width: 112rem;
        margin-inline: auto;
        grid-template-columns: repeat(4, 1fr)
    }
    .faq__tab-menu-item {
        text-align: center;
        justify-content: center;
        height: 9.4rem;
        font-size: 1.8rem;
        border-radius: 0;
        padding-inline: 0
    }
    .faq__tab-menu-item:nth-of-type(1) {
        border-radius: 9rem 0 0 9rem
    }
    .faq__tab-menu-item:nth-of-type(4) {
        border-radius: 0 9rem 9rem 0
    }
    .faq__tab-menu-item.current {
        background-color: #000;
        color: #fff;
        cursor: auto
    }
    .faq__tab-panel {
        margin-top: 4rem
    }
    .faq__contents {
        max-width: 122rem;
        margin-left: auto;
        padding: 2rem 3rem 2rem 6rem;
        border: .5rem solid transparent;
        border-radius: 4rem
    }
    .faq__question {
        font-size: 2rem;
        padding-right: 0
    }
    .faq__question::before {
        top: calc(-50% - .5rem);
        left: -10.3rem;
        font-size: 2.8rem;
        width: 8rem
    }
    .faq__answer-inner {
        margin-top: 3.5rem;
        padding-bottom: 1.5rem
    }
    .faq__answer {
        font-size: 1.8rem;
        line-height: 1.8
    }
    .cta {
        padding: 8rem 4rem
    }
    .cta__material {
        top: -23rem
    }
    .cta__material img {
        width: 25.6rem
    }
    .cta__link-wrap {
        flex-direction: row;
        gap: 3rem
    }
    .cta__btn {
        max-width: 100%;
        border: .5rem solid #fff;
        height: 14.3rem;
        font-size: 3.2rem;
        letter-spacing: .1em
    }
    .cta__btn > .tab {
        border-radius: .6rem;
        top: -1.3rem;
        left: -1.7rem;
        width: 16.2rem;
        height: 4.9rem;
        font-size: 2rem
    }
    .cta__btn > .tab::before {
        bottom: -.9rem;
        left: 11rem;
        width: 2rem;
        height: 1rem
    }
}
@media screen and (max-width:960px) {
    .fixed-btn {
        width: 100%
    }
    .fixed-btn a .txt {
        text-align: center;
        left: 22%;
        top: 26%;
        font-size: clamp(1.5rem, 0.5rem + 1.875vw, 3rem);
        width: auto;
    }
    .fixed-btn a .img {
        display: block;
        width: 100%;
        background-color: #ff6915
    }
    .benefits__common {
        padding-left: 0
    }
    .benefits__common-catch {
        padding-left: 0
    }
    .benefits__benefit {
        margin-top: -1rem
    }
    .faq__tab-inner {
        width: 100%;
        height: 6rem;
        overflow: hidden;
        position: absolute;
        top: 0;
        left: 0;
        overflow: hidden;
        border-radius: 3rem;
        background-color: #fff;
        transition: all .3s
    }
}
@media screen and (max-width:414px) {
    html {
        font-size: 2.4154589372vw
    }
}
@media (min-width:961px) and (max-width:1280px) {
    html {
        font-size: .78125vw
    }
}
@media (min-width:960px) and (max-width:1700px) {
    br.custom {
        display: inline
    }
}
@media print {
    body {
        font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif
    }
}
@media (any-hover:hover) {
    .fixed-btn a:hover {
        filter: brightness(1.2)
    }
}
/*# sourceMappingURL=maps/styles.css.map */



/* ===== スライダー共通変数 ===== */

.slider-wrap {
    margin-top: 0;
    position: relative;
    z-index: 5;
    background-color: #bad4e5;
    padding-block: 2rem 2rem;
    overflow: hidden;
}

.slider {
  --gap: 16px;          
  --speed: 20s;        
  --card-width: 300px;  
  --radius: 20px;       
  --bg: #bad4e5;
}

.slider {
  overflow: hidden;
  width: 100%;
  background: var(--bg);
  padding-block: 0 3rem;    /* お好みで */
}

/* ★ ジャンク対策のキモ */
.slide-track {
  display: inline-flex;          /* 子要素合計に合わせる */
  width: max-content;            /* 総幅の再計算を避ける */
  gap: var(--gap);
  animation: scroll-left var(--speed) linear infinite;

  /* 合成系ヒント */
  will-change: transform;
  backface-visibility: hidden;
  transform: translate3d(0,0,0);
}

/* ホバー/タップで一時停止（任意） */
.slider:hover .slide-track,
.slider:active .slide-track {
  animation-play-state: paused;
}

/* カードは固定幅で走らせる（アニメ中に幅が変わらないように） */
.slide {
  flex: 0 0 var(--card-width);
  aspect-ratio: 300 / 174;   /* 実寸に合わせて比率固定（≒ 16:9 に近い） */
  border-radius: var(--radius);
  overflow: hidden;
  background: #eee;
}

/* 画像は全面フィット。幅/高さを指定済みなのでレイアウトが安定 */
.slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ★ 無限ループ。内容2セット前提で “半分” だけ移動 */
@keyframes scroll-left {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

/* 動きが苦手なユーザー配慮（任意） */
@media (prefers-reduced-motion: reduce) {
  .slide-track { animation: none; transform: none; }
}

/* もしスマホでカードを少し小さくしたい場合（固定値で切替。clampは使わない） */
@media (max-width: 480px) {
  .slider { --speed: 160s; --gap: 12px; --card-width: 150px; --radius: 10px;  }

}

@media (max-width: 820px) {
.slider-wrap {
    margin-top: -6.2rem;
}
.mv__desc-sp {
    display: block;
    position: absolute;
    bottom: 0;
    left: 7.25vw;
    z-index: 10;
}	
}

.slider-mini {
  --gap: 40px;          
  --speed: 50s;        
  --card-width: 130px;  
  --radius: 0;       
  --bg: #ffffff;

}

.slider-mini {
  overflow: hidden;
  width: 100%;
  background: var(--bg);
  padding-block: 0;    /* お好みで */
}

/* ★ ジャンク対策のキモ */
.slide-track-mini {
  display: inline-flex;          /* 子要素合計に合わせる */
  width: max-content;            /* 総幅の再計算を避ける */
  gap: var(--gap);
  animation: scroll-right var(--speed) linear infinite;

  /* 合成系ヒント */
  will-change: transform;
  backface-visibility: hidden;
  transform: translate3d(0,0,0);
}

/* ホバー/タップで一時停止（任意） */
.slider-mini:hover .slide-track-mini,
.slider-mini:active .slide-track-mini {
  animation-play-state: paused;
}

/* カードは固定幅で走らせる（アニメ中に幅が変わらないように） */
.slide-mini {
  flex: 0 0 var(--card-width);
  aspect-ratio: 300 / 174;   /* 実寸に合わせて比率固定（≒ 16:9 に近い） */
  border-radius: var(--radius);
  overflow: hidden;
  background: #ffffff;
}

/* 画像は全面フィット。幅/高さを指定済みなのでレイアウトが安定 */
.slide-mini img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ★ 無限ループ。内容2セット前提で “半分” だけ移動 */
@keyframes scroll-right {
  from { transform: translate3d(-50%,0, 0 ); }
  to   { transform: translate3d(0, 0, 0); }
}

/* 動きが苦手なユーザー配慮（任意） */
@media (prefers-reduced-motion: reduce) {
  .slide-track-mini { animation: none; transform: none; }
}

/* もしスマホでカードを少し小さくしたい場合（固定値で切替。clampは使わない） */
@media (max-width: 480px) {
  .slider-mini { --speed: 50s; --gap: 0; --card-width: 100px; --radius: 0;  }

}

@media (max-width: 820px) {
.slider-wrap-mini {
    margin-top: -6.2rem;
}
}