/* フォント */
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

body {
	font-family: 'Noto Sans JP', sans-serif;
    color: #444444 ;
    font-feature-settings: 'palt' on;
    color: #242424;
    font-kerning: none;
}

.pageTop{
    z-index: 10;
}

.p-section-top {
    background: #CEF2FF;
    position: relative;
}

.p-section-top__deco {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%,0);
    max-width: 1440px;
    width: 100%;
    aspect-ratio: 5 / 5;
    @media screen and (min-width: 737px) {
        aspect-ratio: 1440 / 633;
    }
}
.p-section-top__deco-img{
    position: absolute;
    top: 0;
    left: 0;
}
.p-section-top__deco-img.-num01{
    top: 0;
    left: calc(1317% / 3.75 / 5);
    width: calc(548.77% / 3.75 / 4);
    aspect-ratio: 548.77 / 206.99;
    animation: floating 6s ease-in-out infinite;
    @media screen and (min-width: 737px) {
        top: 0;
        left: calc(1000% / 14.4);
        width: calc(548.77rem / 16);
    }
}
.p-section-top__deco-img.-num02{
    top: calc(291% / 3.75 / 1.5);
    left: calc(-16% / 3.75 / 5);
    width: calc(272.09% / 3.75 / 4);
    aspect-ratio: 272.09 / 139.8;
    animation: floating2 6s ease-in-out infinite;
    @media screen and (min-width: 737px) {
        top: calc(301% / 6.33);
        left: calc(-16% / 14.4);
        width: calc(272.09rem / 16);
    }
}
.p-section-top__deco-img.-num03{
    top: calc(330% / 3.75 / 1.5);
    left: calc(1697% / 3.75 / 5);
    width: calc(208.09% / 3.75 / 4);
    aspect-ratio: 208.09 / 106.91;
    animation: floating3 6s ease-in-out infinite;
    @media screen and (min-width: 737px) {
        top: calc(330% / 6.33);
        left: calc(1150% / 14.4);
        width: calc(208.09rem / 16);
    }
}
.p-section-top__deco-img.-num04{
    top: calc(417% / 3.75 / 1.5);
    left: calc(550% / 3.75 / 5);
    width: calc(174% / 3.75 / 4);
    aspect-ratio: 174 / 71.95;
    animation: floating 6.5s ease-in-out infinite;
    @media screen and (min-width: 737px) {
        top: calc(437% / 6.33);
        left: calc(280% / 14.4);
        width: calc(174rem / 16);
    }
}
.p-section-top__deco-img.-num05{
    top: calc(481% / 3.75 / 1.5);
    left: calc(850% / 3.75 / 5);
    width: calc(125% / 3.75 / 4);
    aspect-ratio: 125 / 45.34;
    animation: floating3 6.5s ease-in-out infinite;
    @media screen and (min-width: 737px) {
        top: calc(541% / 6.33);
        left: calc(235% / 14.4);
        width: calc(125rem / 16);
    }
}

.p-section-top::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: calc(-6 / 375 * 100vw);
    background-image: url(../img/pic_train_right_before.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: calc(135 / 375 * 100vw);
    height: calc(21 / 375 * 100vw);
    z-index: 1;
    @media screen and (min-width: 737px) {
        background-image: url(../img/pic_train_right_before_pc.png);
        right: calc(2rem / 1.6);
        bottom: calc(-0.9rem / 1.6);
        width: calc(36.8rem / 1.6);
        height: calc(4.1rem / 1.6);
    }
}

/* メインビジュアル */
.p-mv{
    --mv-bg-color: #C1EBF7;
    width: 100%;
    /* background: #C1EBF7; */
    /* background: linear-gradient(to bottom, #56AFD7 0, #56AFD7 calc(110% / 7.9), #C1EBF7 calc(110% / 7.9), #C1EBF7 calc(690% / 7.9), transparent calc(690% / 7.9)); */
    background: linear-gradient(to bottom, var(--mv-bg-color) 0, var(--mv-bg-color) calc(689% / 7.9), transparent calc(689% / 7.9));
}
.p-mv__header{
    max-width: 1440px;
    margin: 0 auto;
    font-size: calc(24vw / 3.75);
    font-weight: 600;
    letter-spacing: 0.2em;
    background: #56AFD7;
    color: #fff;
    aspect-ratio: 375 / 70;
    display: flex;
    justify-content: center;
    align-items: center;
    @media screen and (min-width: 737px) {
        height: calc(110rem / 16);
        font-size: calc(40rem / 16);
        aspect-ratio: initial;
    }
}
.p-mv__body{
    max-width: 1440px;
    display: block;
    margin: 0 auto;
    /* aspect-ratio: 1440 / 579; */
    width: 100%;
    height: 100%;
    /* background: #80C4E1; */
    position: relative;
}
.p-mv__pc{
    position: relative;
    aspect-ratio: 1440 / 680;
    display: none;
    @media screen and (min-width: 737px) {
        display: block;
    }
}
.p-mv__sp{
    position: relative;
    aspect-ratio: 375 / 274;
    display: block;
    @media screen and (min-width: 737px) {
        display: none;
    }
}
.p-mv__img,
.p-mv__coment01,
.p-mv__coment02{
    position: absolute;
    left: 0;
    top: 0;
    transition: transform 0.8s ease-in-out, opacity 0.8s ease-in-out;
}
.p-section-top:not(.is-show) .p-mv__img:not(.-num02):not(.-num04),
.p-section-top:not(.is-show) .p-mv__coment01,
.p-section-top:not(.is-show) .p-mv__coment02{
    opacity: 0;
}
.p-section-top:not(.is-show) .p-mv__img.-num03,
.p-section-top:not(.is-show) .p-mv__img.-num05,
.p-section-top:not(.is-show) .p-mv__img.-num06,
.p-section-top:not(.is-show) .p-mv__img.-num07{
    transform: translateY(8%);
}
.p-mv__img.-num01{
    transition-duration: 1.8s, 1.8s;
}
.p-mv__img.-num02{
    transition-delay: 0s, 0s;
}
.p-mv__img.-num03{
    transition-delay: 2.0s, 2.0s;
    left: calc(4.4958% / 3.75 / 2);
    top: calc(156.8624% / 2.74 / 2);
    width: calc(118.3065% / 3.75 / 2);
    @media screen and (min-width: 737px) {
        left: calc(226.0683% / 14.4 / 2);
        top: calc(369.3302% / 6.8 / 2);
        width: calc(317.6968% / 14.4 / 2);
    }
}
.p-mv__img.-num04{
    left: calc(90% / 3.75 / 2);
    top: 0;
    width: calc(20% / 3.75 / 2);
    @media screen and (min-width: 737px) {
        left: calc(450% / 14.4 / 2);
        top: 0;
        width: calc(60% / 14.4 / 2);
    }
}
.p-mv__img.-num05{
    transition-delay: 2.0s, 2.0s;
    left: calc(88.7281% / 3.75 / 2);
    top: calc(196.431% / 2.74 / 2);
    width: calc(120.1306% / 3.75 / 2);
    @media screen and (min-width: 737px) {
        left: calc(446.2545% / 14.4 / 2);
        top: calc(417.4584% / 6.8 / 2);
        width: calc(418.9012% / 14.4 / 2);
    }
}
.p-mv__img.-num06{
    transition-delay: 2.2s, 2.2s;
    left: calc(544.2478% / 3.75 / 2);
    top: calc(228.7646% / 2.74 / 2);
    width: calc(205.7522% / 3.75 / 2);
    @media screen and (min-width: 737px) {
        left: calc(1846.2055% / 14.4 / 2);
        top: calc(521.189% / 6.8 / 2);
        width: calc(525.2178% / 14.4 / 2);
    }
}
.p-mv__img.-num07{
    transition-delay: 2.4s, 2.4s;
    transition-duration: 1.0s, 1.0s;
    left: calc(212.7671% / 3.75 / 2);
    top: calc(217.5245% / 2.74 / 2);
    width: calc(324.5275% / 3.75 / 2);
    @media screen and (min-width: 737px) {
        left: calc(1024.5032% / 14.4 / 2);
        top: calc(520.7474% / 6.8 / 2);
        width: calc(811.4015% / 14.4 / 2);
    }
}
.p-mv__coment01 {
    transition-delay: 3.4s, 3.4s;
    position: absolute;
    left: calc(-8% / 3.75);
    top: calc(2% / 2.74);
    width: calc(137.5% / 3.75);
    animation: floating 8s ease-in-out infinite;
    @media screen and (min-width: 737px) {
        left: calc(246.25% / 14.4);
        top: calc(77.2% / 6.8);
        width: calc(220% / 14.4);
    }
}
.p-mv__coment02 {
    transition-delay: 3.4s, 3.4s;
    position: absolute;
    left: auto;
    right: calc(-7.5% / 3.75);
    top: calc(-10% / 2.74);
    width: calc(137.5% / 3.75);
    animation: floating2 8.5s ease-in-out infinite;
    @media screen and (min-width: 737px) {
        left: calc(1011% / 14.4);
        top: calc(129% / 6.8);
        width: calc(220% / 14.4);
    }
}

.p-button-pc{
    @media screen and (min-width: 737px) {
        margin: 0 0 0 auto;
        width: calc(20.4rem / 1.6);
        display: flex;
        flex-direction: column;
        gap: calc(1rem / 1.6);
        /* margin-top: calc(-250rem / 16); */
        position: relative;
        z-index: 1;
        /* position: fixed;
        bottom: calc(8rem / 1.6); */
        right: 0;
        position: absolute;
        top: min(50vw,730px);
    }
}

.p-button-pc a {
    transition: filter 300ms;
    @media (hover: hover) and (pointer: fine) {
        &:hover {
            filter: brightness(1.1);
        }
    }
}

/* PC追従ボタン */
.p-button-move{
    @media screen and (min-width: 737px) {
        margin: 0 0 0 auto;
        width: calc(7rem / 1.6);
        display: flex;
        flex-direction: column;
        gap: calc(1rem / 1.6);
        /* margin-top: calc(-250rem / 16); */
        position: relative;
        z-index: 1;
        right: 0;
        position: fixed;
        bottom: calc(8rem / 1.6);
        opacity: 0;
        transition: opacity 700ms ease-out;
    }
}

.p-button-move.-fixed {
    @media screen and (min-width: 737px) {
        opacity: 1;
    }
}

.p-button-move.-end {
    @media screen and (min-width: 737px) {
        position: absolute;
        bottom: calc(9.5rem / 1.6);
        opacity: 1;
    }
}

.p-button-move a {
    transition: filter 300ms;
    @media (hover: hover) and (pointer: fine) {
        &:hover {
            filter: brightness(1.1);
        }
    }
}

/* SP固定ボタン */
.p-button-sp {
    margin: calc(1.8rem / 1.6) calc(15 / 375 * 100vw) 0;
    /* background-color:#F2F4F7; */
    display: flex;
    gap: calc(15 / 375 * 100vw);
}

.p-button-sp__01 {
    width: calc(190 / 375 * 100vw);
}

.p-button-sp__02 {
    width: calc(140 / 375 * 100vw);
}

/* MV下テキストエリア */
.p-text-area{
    padding: calc(3.5rem / 1.6) calc(30 / 375 * 100vw) calc(7rem / 1.6);
    position: relative;
    @media screen and (min-width: 737px) {
        padding: calc(6rem / 1.6) calc(4rem / 1.6) calc(9.5rem / 1.6) calc(4rem / 1.6);
        display: flex;
        justify-content: center;
        margin-right: calc(8.4rem / 1.6);
    }
}

/* .p-text-area::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: calc(-28 / 375 * 100vw);
    background-image: url(../img/pic_train_left.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: calc(156 / 375 * 100vw);
    height: calc(75 / 375 * 100vw);
    z-index: 2;
    @media screen and (min-width: 737px) {
        bottom: calc(-7.5rem / 1.6);
        width: calc(41.2rem / 1.6);
        height: calc(19.7rem / 1.6);
    }
} */

.p-text-area::before {
    content: "";
    position: absolute;
    right: 0;
    /* bottom: calc(-6 / 375 * 100vw); */
    bottom: 0;
    aspect-ratio: 395/153;
    background-image: url(../img/pic_train_right.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: calc(152.4vw / 3.75);
    @media screen and (min-width: 737px) {
        right: calc(-10rem / 1.6);
        width: calc(39.5rem / 1.6);
    }
}

.p-text-area__deco{
    position: absolute;
    width: calc(158.72vw / 3.75);
    left: 0;
    bottom: 0;
    aspect-ratio: 396 / 188;
    transform: translateY(calc(63% / 1.88));
    @media screen and (min-width: 737px) {
        width: calc(396rem / 16);
    }
}
.p-text-area__train{
    aspect-ratio: 333 / 40;
    height: calc(15vw / 3.75 );
    width: auto;
    position: absolute;
    bottom: calc(63% / 1.88);
    left: 0;
    transform: translate(100vw);
    z-index: 1;
    @media screen and (min-width: 737px) {
        height: calc(3rem / 1.6);
    }
}
.p-text-area__deco.is-show .p-text-area__train{
    animation: train 6s linear infinite 0.5s;
    @media screen and (min-width: 737px) {
        animation: train 12s linear infinite 0.5s;
    }
}
.p-text-area__deco-img.-num01{
    position: absolute;
    width: calc(300% / 3.96);
    right: 0;
    top: calc(33% / 1.88);
    aspect-ratio: 300 / 92;
}
.p-text-area__deco-img.-num02{
    position: absolute;
    width: calc(336% / 3.96);
    left: 0;
    bottom: 0;
    aspect-ratio: 336 / 188;
    z-index: 2;
}
.p-text-area__deco-img.-num03{
    position: absolute;
    width: calc(142% / 3.96);
    right: calc(60% / 3.96);
    top: calc(103% / 1.88);
    aspect-ratio: 142 / 25;
    z-index: 2;
}

.p-text-area__inner{
    @media screen and (min-width: 737px) {
        display: flex;
        gap: calc(8.7rem / 1.6);
        max-width: calc(115.2rem / 1.6);
    }
}

.p-mv-txt-title{
    display: flex;
    /* justify-content: center; */
    font-size: calc(22 / 375 * 100vw);
    font-weight: 600;
    line-height: 1.481;
    letter-spacing: 0.08em;
    color: #0082CD;
    /* margin: 0 calc(-10 / 375 * 100vw); */
    @media screen and (min-width: 737px) {
        font-size: calc(4rem / 1.6);
        margin: 0;
    }
}

.p-mv-txt{
    font-size: calc(14 / 375 * 100vw);
    line-height: 1.875;
    font-weight: 500;
    letter-spacing: 0.04em;
    margin-top: calc(2.4rem / 1.6);
    @media screen and (min-width: 737px) {
        font-size: calc(2rem / 1.6);
        flex: 1;
        font-feature-settings: initial;
    }
}

.p-point {
    position: relative;
    padding: calc(4rem / 1.6) 0  0;
    @media screen and (min-width: 737px) {
        padding: calc(10rem / 1.6) 0  0;
    }
}

.p-point-title {
    display: flex;
    flex-direction: column;
    gap: calc(12 / 375 * 100vw);

    @media screen and (min-width: 737px) {
        gap: calc(2.1rem / 1.6);
        margin-bottom: calc(-20.8rem / 1.6);
    }
}

.p-point-title-en {
    color: #0082CD;
    font-size: calc(12 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.4;
    display: block;
    padding-left: calc(30 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        font-size: calc(2rem / 1.6);
        padding-left: calc(4rem / 1.6);
    }
}

.p-point-title-ja {
    color: #0082CD;
    font-size: calc(21 / 375 * 100vw);
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
    padding-left: calc(42 / 375 * 100vw);
    position: relative;
    width: fit-content;
    display: flex;
    gap: calc(9 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        writing-mode: vertical-rl;
        flex-direction: column;
        font-size: calc(2.8rem / 1.6);
        padding-left: calc(12rem / 1.6);
        gap: calc(1.2rem / 1.6);
    }
}

.p-point-title-ja::before {
    content: "";
    width: calc(30 / 375 * 100vw);
    height: calc(0.2rem / 1.6);
    position: absolute;
    top: 0;
    left: 0;
    background: #0082CD;
    @media screen and (min-width: 737px) {
        width: calc(10rem / 1.6);
    }
}


/* 3つのポイント */
.p-point-subtitle{
    font-size: calc(18 / 375 * 100vw);
    /* text-align: right; */
    text-align: center;
    padding: 0 calc(26 / 375 * 100vw);
    color: #444;
    font-weight: 600;
    line-height: 1.33;
    letter-spacing: 0.12em;
    margin-top: calc(3.5rem / 1.6);
    @media screen and (min-width: 737px) {
        font-size: calc(24 / 1440 * 100vw);
        margin-top: calc(-16.8rem / 1.6);
    }
}

.p-img-point{
    /* object-fit: none;
    margin-left: calc(5.8rem / 1.6); */
    width: calc(225 / 375 * 100vw);
    display: block;
    /* margin: calc(1.8rem / 1.6) calc(29 / 375 * 100vw) 0 auto; */
    margin: calc(35rem / 16) auto 0;
    @media screen and (max-width: 736px) {
        padding-right: calc(0.8rem / 1.6);
    }
}

.p-img-point-pc{
    @media screen and (min-width: 737px) {
        min-width: calc(480rem / 16);
        width: calc(375 / 1440 * 100vw);
        display: block;
        margin: calc(1.2rem / 1.6) auto 0;
        position: relative;
        padding-bottom: calc(9rem / 1.6);
    }
}

.p-coment{
    width: calc(270 / 1440 * 100vw);
    position: absolute;
    top: calc(28.5rem / 1.6);
    right: calc(23.5rem / 1.6);
}

.p-point-intro__body{
    background: url(../img/bg-point01_sp.png), linear-gradient(to bottom, transparent 0%, transparent 25%, #F2F4F7 25%, #F2F4F7 100%);
    background-size: 100% auto, 100% 100%;
    background-repeat: no-repeat, no-repeat;
    @media screen and (max-width: 736px) {
        margin-top: -20vw;
        padding: 25% 0;
    }
    @media screen and (min-width: 737px) {
        background: url(../img/bg-point01_pc.png), linear-gradient(to bottom, transparent 0%, transparent 50%, #F2F4F7 50%, #F2F4F7 100%);
        background-size: 100% 100%, 100% 100%;
        background-repeat: no-repeat, no-repeat;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        padding: calc(5rem / 1.6) calc(3rem / 1.6);
    }
}
.p-point-intro__nav{
    --gap: 1.25em;
    display: flex;
    gap: var(--gap);
    margin: 0 auto;
    @media screen and (max-width: 736px) {
        flex-direction: column;
        width: calc(345% / 3.75);
        margin-top: calc(40vw / 3.75);
    }
    @media screen and (min-width: 737px) {
        --gap: 6em;
        max-width:  calc(122rem / 1.6);
    }
}
.p-point-intro__nav-item{
    width: 100%;
    position: relative;
    @media screen and (max-width: 736px) {
        display: flex;
        justify-content: space-between;
        /* background: rgba(255,255,255,0.6);
        border: 1px solid rgba(0,0,0,0.05); */
        border-radius: 1em;
        padding: 1em 0.75em 1.375em;
    }
    @media screen and (min-width: 737px) {
        width: calc((100% - (var(--gap) * 2)) / 3);
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 700ms ease-out, transform 700ms ease-out;
        padding-bottom: 3em;
    }
}
.p-point-intro__nav-item{
    cursor: pointer;
}
.p-point-intro__nav-item:before{
    @media screen and (max-width: 736px) {
        content:"";
        width: 75%;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        background: #fff;
        border-radius: 2em;
    }
}

.-animated .p-point-intro__nav-item{
    opacity: 1;
    transform: translateY(0);
}

.p-point-intro__nav-item-header,
.p-point-intro__nav-text,
.p-point-intro__nav-button{
    transition: filter 500ms ease-out;
    position: relative;
}
.p-point-intro__nav-item-header {
    @media screen and (max-width: 736px) {
        width: 50%;
    }
}
.p-point-intro__nav-text{
    @media screen and (max-width: 736px) {
        width: 43%;
        white-space: nowrap;
    }
}
.p-point-intro__nav-button{
    @media screen and (max-width: 736px) {
        padding-bottom: 0.75em;
    }
    @media screen and (min-width: 737px) {
        justify-content: center;
    }
}
.p-point-intro__nav-button .c-button__inner{
    @media screen and (max-width: 736px) {
        margin-left: 57%;
    }
}

.p-point-intro__nav-item:hover .p-point-intro__nav-item-header,
.p-point-intro__nav-item:hover .p-point-intro__nav-text,
.p-point-intro__nav-button{
    filter: brightness(1.1);
}

.p-point-intro__nav-illust {
    display: block;
    z-index: 1;
    position: relative;
    @media screen and (max-width: 736px) {
        margin-right: auto;
        width: calc(336% / 4.06);
    }
    @media screen and (min-width: 737px) {
        margin-left: auto;
        width: calc(356% / 4.06);
    }
}

.p-point-intro__nav-number {
    position: absolute;
    top: 0;
    aspect-ratio: 85.72 / 63.72;
    @media screen and (max-width: 736px) {
        width: calc(110% / 4.06);
        right: 0;
        transform: translate(30%, 10%);
    }
    @media screen and (min-width: 737px) {
        width: calc(100% / 4.06);
        left: 0;
        transform: translate(-20%, 25%);
    }
}

.p-point-intro__nav-number-img {
    position: absolute;
    object-fit: contain;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.p-point-intro__nav-text {
    position: relative;
    font-weight: 700;
    line-height: 1.4;
    color: #56AFD7;
    font-size: calc(14vw / 3.75);
    z-index: 1;
    white-space: nowrap;
    @media screen and (min-width: 737px) {
        font-size: calc(2.2rem / 1.6);
        text-align: center;
        margin-top: 0.5em;
    }
}
.p-point-intro__nav-item.-num02 .p-point-intro__nav-text{
    color: #ED7980;
}
.p-point-intro__nav-item.-num03 .p-point-intro__nav-text{
    color: #D79D00;
}

.p-point-intro__nav-button{
    
    --button-color: ;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    z-index: 2;
    @media screen and (min-width: 737px) {
        justify-content: center;
    }
}
.p-point-intro__nav-button .c-button__inner{
    width: 6em;
    display: flex;
    align-items: flex-end;
    font-size: calc(11vw / 3.75);
    font-weight: 400;
    line-height: 1;
    padding: 0.25em 0.25em 0.5em 1.25em;
    border: none;
    background: transparent;
    @media screen and (min-width: 737px) {
        width: 8em;
        font-size: calc(1.4rem / 1.6);
        background: #fff;
        padding: 0.6em 0.5em 0.8em 2em;
    }
}
.p-point-intro__nav-button .c-button__inner:before,
.p-point-intro__nav-button .c-button__inner:after{
    transform: translateY(-50%) rotate(90deg);
    /* width: 1.4em; */
    @media screen and (max-width: 736px) {
        right: 0.5em;
    }
}


.c-balloon-comment {
    content: "";
    background-image: url(../img/balloon-comment_sp.svg);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    aspect-ratio: 610 / 168;
    width: calc(305 / 375 * 100vw);
    display: flex;
    gap: 0.5em 1em;
    padding: 1.875em 1.66666em;
    align-items: center;
    font-weight: 500;
    line-height: 1.5;
    font-size: calc(12vw / 3.75);
    @media screen and (min-width: 737px) {
        background-image: url(../img/balloon-comment_pc.svg);
        background-size: contain;
        background-repeat: no-repeat;
        aspect-ratio: 274 / 181;
        width: calc(27.4rem / 1.6);
        flex-direction: column;
        justify-content: center;
        padding: 0 3em 0.75em 2.5em;
        font-size: calc(1.5rem / 1.6);
        text-align: center;
    }
}
.c-balloon-comment.-reverse{
    background-image: url(../img/balloon-comment-reverse_sp.svg);
    background-size: contain;
    background-repeat: no-repeat;
    @media screen and (max-width: 736px) {
        aspect-ratio: 173.5 / 125;
        flex-direction: column;
        justify-content: center;
        width: calc(173.5 / 375 * 100vw);
        padding: 1em 1em 1em 2em;
    }
    @media screen and (min-width: 737px) {
        background-image: url(../img/balloon-comment-reverse_pc.svg);
        background-size: contain;
        background-repeat: no-repeat;
    }
}

.c-balloon-comment__text {
    @media screen and (max-width: 736px) {
    flex: 1;
    }
}

.p-point-intro__balloon-comment {
    @media screen and (max-width: 736px) {
        left: 50%;
        bottom: 0.5em;
        transform: translate(-50%,100%);
    }
    @media screen and (min-width: 737px) {
        right: 0;
        top: 0;
        transform: translateY(-80%);
    }
}
.p-point-03__balloon-comment {
    right: 50%;
    transform: translateX(50%);
    top: 105%;
    @media screen and (min-width: 737px) {
        right: 0;
        top: calc(-13rem / 1.6);
        transform: none;
    }
}
.p-point-03-benefits__balloon-comment.c-balloon-comment {
    right: calc(-10 / 375 * 100vw);
    transform: translateY(-100%);
    top: calc(-20vw / 3.75);
    width: calc(187.5 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        right: calc(1rem / 1.6);
        top: calc(-24rem / 1.6);
        transform: none;
        width: calc(32rem / 1.6);
        padding: 1em 1em 0.75em 1em;
    }
}
.p-point-03-benefits__balloon-comment .c-balloon-comment__text{
    @media screen and (max-width: 736px) {
        text-align: center;
    }
}
.p-point-03-benefits__balloon-comment .c-balloon-comment__link{
    @media screen and (max-width: 736px) {
        padding: calc(12vw / 3.75) calc(36vw / 3.75) calc(12vw / 3.75) calc(8vw / 3.75);
    }
}

.p-section-point{
    background-color:#F2F4F7;
    padding-top: calc(20 / 375 * 100vw);
    @media screen and (max-width: 736px) {
        padding-bottom: calc(20 / 375 * 100vw);
    }
    @media screen and (min-width: 737px) {
        padding-top: calc(8rem / 1.6);
        /* padding: calc(10rem / 1.6) 0; */
    }
}
.p-section-point + .p-section-point{
    padding-top: calc(20 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        padding-top: calc(10.4rem / 1.6);
    }
}

.p-section-point.-yellow {
    padding-bottom: calc(130 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        padding-bottom:  calc(15.4rem / 1.6);
    }
}

.p-section-point__top {
    position: relative;
    @media screen and (min-width: 737px) {
        max-width: 1240px;
        width: 92%;
        margin: 0 auto;
    }
}

.p-section-point .p-section-point__content {
    @media screen and (min-width: 737px) {
        max-width: calc(90rem / 1.6);
        width: calc(900% / 12.4);
        margin-left: auto;
        padding-top: calc(7rem / 1.6);
    }
}
.p-section-point.-pink .p-section-point__content {
    @media screen and (min-width: 737px) {
        margin-right: auto;
        margin-left: 0;
    }
}


.p-section-point__slider {
    box-shadow: calc(11 / 375 * 100vw) calc(13 / 375 * 100vw) #56AFD7;
    width: calc(231 / 375 * 100vw);
    border-radius: calc(30 / 375 * 100vw);
    margin-left: calc(-17 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        box-shadow: calc(2rem / 1.6) calc(2rem / 1.6) #56AFD7;
        max-width: calc(45.3rem / 1.6);
        width: calc(453% / 12.4);
        border-radius: calc(4.5rem / 1.6);
        margin-left: auto;
        left: calc(-6.6rem / 1.6);
        top: 0;
        position: absolute;
    }
}

.p-section-point.-pink .p-section-point__slider {
    box-shadow: calc(11 / 375 * 100vw) calc(13 / 375 * 100vw) #EE888F;
    @media screen and (min-width: 737px) {
        box-shadow: calc(-2rem / 1.6) calc(2rem / 1.6) #EE888F;
        border-radius: calc(4.5rem / 1.6);
        left: auto;
        right: calc(-6.6rem / 1.6);
    }
    @media screen and (max-width: 736px) {
        margin-left: calc(150 / 375 * 100vw);
    }
}

.p-section-point.-yellow .p-section-point__slider {
    box-shadow: calc(11 / 375 * 100vw) calc(13 / 375 * 100vw) #EAB800;
    @media screen and (min-width: 737px) {
        box-shadow: calc(2rem / 1.6) calc(2rem / 1.6) #EAB800;
        border-radius: calc(4.5rem / 1.6);
    }
}

.p-section-point__slider-img {
    border-radius: calc(30 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        border-radius: calc(4.5rem / 1.6);
    }
}

.p-section-point__label{
    @media screen and (min-width: 737px) {
        display: flex;
        /* justify-content: center; */
        /* align-items: flex-start; */
        align-items: center;
        gap: calc(2.4rem / 1.6);
        /* margin-left: calc(23rem / 1.6); */
        margin-left: calc(9rem / 1.6);
        /* transform: translateY(70px); */
        /* transform: translateY(calc(7rem / 1.6)); */
        /* transform: translateX(calc(10rem / 1.6)) translateY(calc(-51rem / 1.6)); */
    }
}

.p-section-point.-pink .p-section-point__top .p-section-point__label {
    @media screen and (min-width: 737px) {
        /* margin-left: -520px; */
        margin-left: calc(50% - (36rem / 1.6));
    }
}

.p-section-point__number {
    position: absolute;
    top: calc(75 / 375 * 100vw);
    right: calc(47 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        position: static;
        top: calc(8.8rem / 1.6);
        right: calc(78.9rem / 1.6);
    }
}

.p-section-point.-pink .p-section-point__number {
    left: calc(36 / 375 * 100vw);  
    right: initial;
}

.p-section-point.-yellow .p-section-point__number {
    right: calc(36 / 375 * 100vw);
}

.p-section-point__number-img {
    /* width: calc(72 / 375 * 100vw); */
    width: auto;
    height: calc(62 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        width: calc(9.9rem / 1.6);
        height: auto;
    }
}

.p-section-point.-pink .p-section-point__number-img {
    /* width: calc(114 / 375 * 100vw); */
    @media screen and (min-width: 737px) {
        width: calc(11.4rem / 1.6);
        height: auto;
    }  
}

.p-section-point.-yellow .p-section-point__number-img {
    /* width: calc(115 / 375 * 100vw); */
    @media screen and (min-width: 737px) {
        width: calc(11.5rem / 1.6);
        height: auto;
    }
}

.p-section-point__title{
    position: absolute;
    top: calc(154 / 375 * 100vw);
    left: calc(47 / 375 * 100vw);
    display: flex;
    flex-direction: column;
    gap: 0.3928571428em;
    align-items: flex-start;
    font-size: calc(28 / 375 * 100vw);
    font-weight: 900;
    line-height: 1;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        position: static;
        top: calc(12.6rem / 1.6);
        left: calc(78.9rem / 1.6);
        font-size: calc(3.5rem / 1.6);
        line-height: 1.5;
        gap: 0;
    }
}

.p-section-point.-pink .p-section-point__title {
    left: calc(15 / 375 * 100vw);
}

.p-section-point.-yellow .p-section-point__title {
    left: calc(71 / 375 * 100vw);
}

.p-section-point__title-line{
    background-color: #FFFFFF;
    box-decoration-break: clone;
    padding: 0.25em 0.5em 0.35em;
    display: inline-block;
    color: #56AFD7;
    @media screen and (min-width: 737px) {
        background-color: transparent;
        padding: 0;
    }
}

.p-section-point.-pink .p-section-point__title-line{
    color: #ED7980;
}

.p-section-point.-yellow .p-section-point__title-line{
    color: #EAB800;
}

.p-section-point__box{
    background-color:#FFFFFF ;
    margin: calc(46 / 375 * 100vw) calc(15 / 375 * 100vw) 0;
    border-radius: calc(30 / 375 * 100vw);
    padding: calc(60 / 375 * 100vw) calc(20 / 375 * 100vw) calc(40 / 375 * 100vw);
    position: relative;
    @media screen and (min-width: 737px) {
        /* padding: calc(7.5rem / 1.6) calc(9rem / 1.6)); */
        margin: 0 0 0 auto;
        border-radius: calc(3rem / 1.6);
        padding: calc(7.5rem / 1.6) calc(50% - (36rem / 1.6)) calc(7.1rem / 1.6);
        margin-top: calc(3rem / 1.6) ;
        max-width: calc(90rem / 1.6);
    }
}

.p-section-point.-pink .p-section-point__box{
    @media screen and (min-width: 737px) {
        margin: calc(3rem / 1.6) auto 0 0;
    }
}

.p-section-point.-yellow .p-section-point__box{
    /* padding-top: calc(52 / 375 * 100vw); */
    padding-top: 0;

    @media screen and (min-width: 737px) {
        padding-top: calc(8.3rem / 1.6);
    }
}

.p-section-point__ilustration{
    position: absolute;
    @media screen and (max-width: 736px) {
        left: 50%;
        transform: translateX(-50%);
        top: calc(-60 / 375 * 100vw);
        width: calc(239 / 375 * 100vw);
    }
    @media screen and (min-width: 737px) {
        width: calc(299% / 9);
        height: auto;
        top: 2.5em;
        right: calc(50% - (41rem / 1.6));
        left: auto;
        transform: translateY(-100%);
        margin: auto;
    }
}
.p-section-point.-yellow .p-section-point__ilustration img{
    display: block;
    position: relative;
    z-index: 1;
}

.c-balloon-comment__link{
    position: relative;
    z-index: 1;
    display: block;
    padding: calc(8vw / 3.75) calc(46vw / 3.75) calc(8vw / 3.75) calc(16vw / 3.75);
    background-color: #D79D00;
    border-radius: calc(14vw / 3.75);
    border: 2px solid #EAB800;
    font-size: calc(12vw / 3.75);
    color: #FFFFFF;
    text-decoration: none;
    text-align: left;
    font-weight: 600;
    line-height: 1.33;
    letter-spacing: 0.04em;
    transition: filter 300ms;
    font-feature-settings: initial;
    width: fit-content;
    margin: 0 auto;
    height: fit-content;
    @media screen and (min-width: 737px) {
        display: flex;
        align-items: center;
        padding: calc(0.8rem / 1.6) calc(3.7rem / 1.6) calc(0.8rem / 1.6) calc(1.2rem / 1.6);
        border-radius: 16px;
        font-size: calc(1.4rem / 1.6);
        letter-spacing: 0.08em;
        margin: 0;
    }
    @media (hover: hover) and (pointer: fine) {
        &:hover {
            filter: brightness(1.2)
        }
    }
}

.c-balloon-comment__link::before {
    right: calc(8 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        right: calc(1rem / 1.6);
    }
}

.c-balloon-comment__link::after {
    right: calc(13 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        right: calc(1.5rem / 1.6);
    }
}

.p-section-point__benefits-balloon .c-balloon-comment__link {
    position: absolute;
    right: calc(18 / 375 * 100vw);
    bottom: calc(25 / 375 * 100vw);
    z-index: 1;
}
@media screen and (max-width: 736px) {
    .p-section-point__benefits-balloon .c-balloon-comment__link {
        padding: calc(8vw / 3.75) calc(46vw / 3.75) calc(8vw / 3.75) calc(26vw / 3.75);
    }
}

@media screen and (min-width: 737px) {
    .p-section-point__benefits-balloon .c-balloon-comment__link {
        right: calc(16.8rem / 1.6);
        bottom: calc(18.8rem / 1.6);
        top: initial;
    }
}

.c-balloon-comment__link::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(11 / 375 * 100vw);
    width: calc(18 / 375 * 100vw);
    height: calc(18 / 375 * 100vw);
    margin: auto;
    border-radius: 50%;
    background-color: #fff;
    @media screen and (min-width: 737px) {
        right: calc(1rem / 1.6);
        width: calc(1.8rem / 1.6);
        height: calc(1.8rem / 1.6);
    }
}

.c-balloon-comment__link::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(16 / 375 * 100vw);
    width: calc(8 / 375 * 100vw);
    height: calc(9 / 375 * 100vw);
    margin: auto;
    /* border-top: 6px solid transparent;
    border-right: 0 solid transparent;
    border-left: calc(9 / 375 * 100vw) solid #FFFFFF;
    border-bottom: calc(6 / 375 * 100vw) solid transparent;
    box-sizing: border-box; */
    background-image: url(../img/arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: brightness(0) saturate(100%) invert(54%) sepia(98%) saturate(493%) hue-rotate(9deg) brightness(94%) contrast(101%);
    @media screen and (min-width: 737px) {
        right: calc(1.5rem / 1.6);
        width: calc(0.8rem / 1.6);
        height: calc(0.9rem / 1.6);
    }
}

.p-section-point__txt-title{
    font-size: calc(16 / 375 * 100vw);
    color: #333;
    font-weight: 600;
    line-height: 1.5;
    @media screen and (min-width: 737px) {
        font-size: calc(2.8rem / 1.6);
        font-feature-settings: initial;
    }
}

.p-section-point__note-mark{
    font-size: calc(10vw / 3.75);
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0.08em;
    display: inline-block;
    transform: translateY(-35%);
    @media screen and (min-width: 737px) {
        font-size: 50%;
    }
}

.p-section-point__note{
    font-size: calc(16 / 375 * 100vw);
    color: #333;
    font-weight: 600;
    line-height: 1.5;
    @media screen and (min-width: 737px) {
        font-size: calc(2.8rem / 1.6);
        font-feature-settings: initial;
    }
}

.p-section-point.-yellow .p-section-point__txt-title{
    font-feature-settings: initial;
    @media screen and (max-width: 736px) {
        padding-top: calc(140 / 375 * 100vw);
    }
}

.p-section-point__txt-subtitle{
    font-size: calc(16 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        font-size: calc(2.1rem / 1.6);
    }
}

.p-section-point__txt{
    font-size: calc(14 / 375 * 100vw);
    margin-top: calc(20 / 375 * 100vw);
    line-height: 1.8;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        font-size: calc(1.8rem / 1.6);
        margin-top: calc(2.4rem / 1.6);
    }
}

.p-section-point__coment{
    color: #444;
    font-size: calc(12 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.5;
    margin-top: calc(15 / 375 * 100vw);
    display: flex;
    flex-direction: column;
    gap: calc(12 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        font-size: calc(1.2rem / 1.6);
        line-height:1;
        margin-top: calc(1.6rem / 1.6);
        gap: calc(2rem / 1.6);
    }
}

.p-section-point.-yellow .p-section-point__coment{
    margin-top: calc(19 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        margin: calc(2rem / 1.6) 0 calc(1.5rem / 1.6);
        font-size: calc(1.4rem / 1.6);
    }
}

/* ボタン */
.p-section-btns {
    --section-btns-gap: calc(10 / 375 * 100vw);
    margin-top: calc(30 / 375 * 100vw);
    display: flex;
    flex-direction: column;
    gap: var(--section-btns-gap);
    @media screen and (min-width: 737px) {
        --section-btns-gap: calc(2rem / 1.6);
        margin-top: calc(5.4rem / 1.6);
        flex-direction: row;
        justify-content: flex-start;
        flex-wrap: wrap;
        /* width: calc(100% + calc(2.4rem / 1.6)); */
    }
}
.p-section-btns.-fill {

}

.p-section-point.-pink .p-section-btns {
    margin-top: calc(30 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        margin-top: calc(5.4rem / 1.6);
    }
}

.p-section-btns.-graph {
    margin-top: calc(25 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        margin-top: calc(5rem / 1.6);
    }
}

.p-section-btns.-benefits {
    margin-top: calc(118 / 375 * 100vw);
    padding-bottom: calc(40 / 375 * 100vw);
    position: relative;
    @media screen and (min-width: 737px) {
        margin-top: calc(3rem / 1.6);
        padding-bottom: calc(6rem / 1.6);
    }
}

/* .p-section-btns.-benefits::before {
    content: "";
    position: absolute;
    left: calc(-3 / 375 * 100vw);
    bottom: calc(52 / 375 * 100vw);
    background-image: url(../img/sec03-picture02_sp.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: calc(316 / 375 * 100vw);
    height: calc(119 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        content: none;
    }
} */
.c-button{
    --button-color: #56AFD7;
    --button-color-filter: brightness(0) saturate(100%) invert(60%) sepia(66%) saturate(348%) hue-rotate(153deg) brightness(93%) contrast(90%);
    text-decoration: none;
    font-size: calc(14 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.75;
    letter-spacing: calc(0.32 / 375 * 100vw);
    color: #000000;
    text-align: left;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        font-size: calc(1.6rem / 1.6);
        letter-spacing: 0.02em;
        line-height: 1.2181;
    }
}
.c-button__inner{
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.6875em 1.3125em;
    background: #FFFFFF;
    border-radius: 2.5em;
    border: 1px solid var(--button-color);
    color: inherit;
    transition: background 300ms, color 300ms;
    text-decoration: inherit;
    @media screen and (min-width: 737px) {
        padding: 0.9375em 2.25em 0.9375em 1.25em;
    }
}
.c-button__inner::before,
.c-button__inner::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 1.1875em;
    aspect-ratio: 1 / 1;
    width: 0.9375em;
    height: auto;
    margin: auto;
    border-radius: 50%;
    /* transition: background 300ms;
    transition: filter 300ms; */
    @media screen and (min-width: 737px) {
        right: calc(1.4rem / 1.6);
    }
}
.c-button__inner::before {
    background: var(--button-color);
    transition: background 300ms;
}
.c-button__inner::after {
    background-image: url(../img/arrow.svg);
    background-size: 55%;
    background-position: 50% 52.5%;
    background-repeat: no-repeat;
    /* transition: filter 300ms; */
}

.c-button{
    @media (hover: hover) and (pointer: fine) {
        &:not(.-cancel-hover):hover .c-button__inner {
            background: var(--button-color);
            color: #fff;
        }
        &:not(.-cancel-hover):hover .c-button__inner::before {
            background: #fff;
        }
        &:not(.-cancel-hover):hover .c-button__inner::after {
            filter: var(--button-color-filter);
        }
    }
}

.c-button.-fill{
    color: #ffffff;
}
.c-button.-fill .c-button__inner{
    background: var(--button-color);
}
.c-button.-fill .c-button__inner::before {
    background: #ffffff;
}
.c-button.-fill .c-button__inner::after {
    filter: var(--button-color-filter);
}
.c-button.-fill {
    @media (hover: hover) and (pointer: fine) {
        &:not(.-cancel-hover):hover .c-button__inner {
            background: #ffffff;
            color: var(--button-color);
        }
        &:not(.-cancel-hover):hover .c-button__inner::before {
            background: var(--button-color);
        }
        &:not(.-cancel-hover):hover .c-button__inner::after {
            filter: none;
        }
    }
}

.c-button.-pink{
    --button-color: #ED7980;
    --button-color-filter: brightness(0) saturate(100%) invert(55%) sepia(40%) saturate(1403%) hue-rotate(314deg) brightness(108%) contrast(85%);
}
.c-button.-yellow{
    --button-color: #EAB800;
    --button-color-filter: brightness(0) saturate(100%) invert(75%) sepia(61%) saturate(2017%) hue-rotate(3deg) brightness(96%) contrast(101%);
}

.p-section-point__headline{
    font-size: calc(15 / 375 * 100vw);
    letter-spacing: 0.06em;
    /* height: calc(40 / 375 * 100vw); */
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5em 0;
    margin: calc(26 / 375 * 100vw) 0 calc(20 / 375 * 100vw);
    color: #ED7980;
    border-top: 2px solid #ED7980;
    border-bottom: 2px solid #ED7980;
    font-weight: 600;
    line-height: 1.375;
    @media screen and (min-width: 737px) {
        font-size: calc(1.8rem / 1.6);
        /* height: calc(4rem / 1.6); */
        margin: calc(3.5rem / 1.6) 0 calc(2rem / 1.6);
    }
}

.p-section-point.-yellow .p-section-point__headline{
    color: #D79D00;
    border-color: #D79D00;
    margin-bottom: 0;
    margin-top: calc(20 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        margin-top: calc(4rem / 1.6) ;
    }
}

.p-section-point__headline.-headline02{
    margin: calc(50 / 375 * 100vw) 0 calc(18 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        /* margin: calc(2.1rem / 1.6) 0 calc(2rem / 1.6); */
        margin: calc(5rem / 1.6) 0 calc(2rem / 1.6);
    }
}

.p-section-point.-yellow .p-section-point__headline.-benefits{
    @media screen and (min-width: 737px) {
        margin-top: calc(3rem / 1.6);
    }
}

.p-section-point__graph {
    @media screen and (min-width: 737px) {
        position: relative;
        margin-top: calc(3.8rem / 1.6);
    }
}

.p-section-point.-yellow .p-section-point__graph {
    @media screen and (min-width: 737px) {
        margin-top: calc(1.5rem / 1.6);
    }
}

.p-section-point.-pink .p-section-point__graph::before {
    @media screen and (min-width: 737px) {
        content: "";
        background-image: url(../img/sec02-picture02_pc.png);
        background-size: contain;
        background-repeat: no-repeat;
        width: calc(19.4rem / 1.6);
        height: calc(35.7rem / 1.6);
        display: block;
        position: absolute;
        top: calc(3rem / 1.6);
        right: 4%;
        transform: translateX(100%);
    }
}

.p-section-point__graph-before {
    display: block;
    margin: 0 auto calc(16vw / 3.75);
    width: 100%;
    max-width: calc(288vw / 3.75);
    @media screen and (min-width: 737px) {
        margin-bottom:  calc(16rem / 16);
        max-width: calc(288rem / 16);
    }
}

.p-section-point.-yellow .p-section-point__graph-before {
    margin: calc(13 / 375 * 100vw) auto 0;
    width: calc(181 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        margin-top:  calc(3.8rem / 1.6);
        margin-bottom:  calc(10rem / 16);
        max-width: calc(198rem / 16);
    }
}
.p-section-point.-pink .p-section-point__graph{
    width: 100%;
    margin-right: auto;
    @media screen and (min-width: 737px) {
        max-width: 622px;
    }
}
.p-section-point.-yellow .p-section-point__graph{
    margin-right: auto;
    margin-left: auto;
    @media screen and (min-width: 737px) {
        max-width: 476px;
    }
}
.p-section-point__graph-img{
    display: block;
}

.p-btn-important {
    --gap-x: calc(10vw / 3.75);
    --gap-y: calc(10vw / 3.75);
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap-y) var(--gap-x) ;
    @media screen and (min-width: 737px) {
        --gap-x: calc(20% / 7.2);
        --gap-y: calc(1.4rem / 1.6);
        justify-content: space-between;
    }
}

.p-btn-important a{
    position: relative;
    display: flex;
    align-items: center;
    /* width: 144px; */
    width: calc((100% - var(--gap-x)) / 2);
    padding: calc(8vw / 3.75) calc(24vw / 3.75) calc(8vw / 3.75) calc(12vw / 3.75);
    background-color: #D7616D;
    border-radius: calc(10vw / 3.75);
    border: 2px solid #ED7980;
    font-size: calc(14vw / 3.75);
    color: #FFFFFF;
    text-decoration: none;
    text-align: left;
    /* margin: 0 35px; */
    font-weight: 600;
    line-height: 1.33;
    letter-spacing: 0.04em;
    transition: background 300ms;
    @media screen and (min-width: 737px) {
        display: flex;
        align-items: center;
        width: calc((100% - var(--gap-x) * 2) / 3);
        min-height: calc(5.9rem / 1.6);
        padding: calc(0.88888888rem / 1.6) calc(1.77777rem / 1.6);
        border-radius: calc(15rem / 16);
        font-size: calc(1.4rem / 1.6);
        letter-spacing: 0.08em;
    }
    @media (hover: hover) and (pointer: fine) {
        &:not(.-cancel-hover):hover {
            background: #FF848C;
        }
    }
}

.p-btn-important a::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(6 / 375 * 100vw);
    width: calc(18 / 375 * 100vw);
    height: calc(18 / 375 * 100vw);
    margin: auto;
    border-radius: 50%;
    background-color: #fff;
    @media screen and (min-width: 737px) {
        right: calc(1rem / 1.6);
        width: calc(1.8rem / 1.6);
        height: calc(1.8rem / 1.6);
    }
}

.p-btn-important a::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(11 / 375 * 100vw);
    width: calc(8 / 375 * 100vw);
    height: calc(9 / 375 * 100vw);
    margin: auto;
    /* border-top: 6px solid transparent;
    border-right: 0 solid transparent;
    border-left: calc(9 / 375 * 100vw) solid #FFFFFF;
    border-bottom: calc(6 / 375 * 100vw) solid transparent;
    box-sizing: border-box; */
    background-image: url(../img/arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: brightness(0) saturate(100%) invert(57%) sepia(16%) saturate(1721%) hue-rotate(305deg) brightness(84%) contrast(102%);
    @media screen and (min-width: 737px) {
        right: calc(1.5rem / 1.6);
        width: calc(0.8rem / 1.6);
        height: calc(0.9rem / 1.6);
    }
}

.p-considering {
    position: relative;
}

.p-considering::before {
    content: "";
    background-image: url(../img/pic_train_right.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    width: calc(213 / 375 * 100vw);
    height: calc(109 / 375 * 100vw);
    display: block;
    position: absolute;
    top: calc(-71 / 375 * 100vw);
    right: 0;
    mix-blend-mode: multiply;
    @media screen and (min-width: 737px) {
        background-image: url(../img/pic_train_right.png);
        background-size: 100% 100%;
        width: calc(54.5rem / 1.6);
        height: calc(22.8rem / 1.6);
        top: calc(-1.8rem / 1.6);
        right: calc(7rem / 1.6);
        width: calc(54.5rem / 1.6);
        height: calc(22.8rem / 1.6);
        top: 0;
        right: calc(7rem / 1.6);
    }
}
/* 
.p-text-area::before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    aspect-ratio: 395/153;
    background-image: url(../img/pic_train_right.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: calc(152.4vw / 3.75);
    @media screen and (min-width: 737px) {
        right: calc(-10rem / 1.6);
        width: calc(39.5rem / 1.6);
    }
} */

.p-considering::after {
    content: "";
    background-image: url(../img/bg-shareholders_sp.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    width: calc(375 / 375 * 100vw);
    height: calc(203 / 375 * 100vw);
    display: block;
    position: absolute;
    top: calc(-80 / 375 * 100vw);
    left: 0;
    @media screen and (min-width: 737px) {
        background-image: url(../img/bg-shareholders_pc.png);
        width: 100%;
        height: 343px;
        top: calc(6.6rem / 1.6);
        background-size: 100% 100%;
    }
}

.p-considering__inner {
    position: relative;
    padding-bottom: calc(115 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        padding-bottom: calc(15rem / 1.6);
    }
}

.p-considering__inner::before {
    @media screen and (min-width: 737px) {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: calc(28rem / 1.6);
        /* background: red; */
        background: #F2F4F7;
        z-index: -1;
    }
}

.c-title {
    display: flex;
    flex-direction: column;
    gap: calc(12 / 375 * 100vw);
    position: relative;
    z-index: 1;
    @media screen and (min-width: 737px) {
        /* gap: 28px; */
        gap: calc(2.1rem / 1.6);
    }
}

.c-title.-information {
    @media screen and (min-width: 737px) {
        position: absolute;
    }
}

.c-title-en {
    color: #0082CD;
    font-size: calc(12 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.4;
    display: block;
    padding-left: calc(30 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        font-size: calc(2rem / 1.6);
        padding-left:  calc(4rem / 1.6);
    }
}

.c-title-ja {
    color: #0082CD;
    font-size: calc(21 / 375 * 100vw);
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
    display: block;
    padding-left: calc(42 / 375 * 100vw);
    position: relative;
    width: fit-content;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        font-size: calc(2.8rem / 1.6);
        padding-left: calc(12rem / 1.6);
        writing-mode: vertical-rl;
        display: flex;
        flex-direction: column;
        gap: calc(1.2rem / 1.6);
    }
}

.c-title-ja::before {
    content: "";
    width: calc(30 / 375 * 100vw);
    height: 2px;
    position: absolute;
    top: 0;
    left: 0;
    background: #0082CD;
    @media screen and (min-width: 737px) {
        width: calc(10rem / 1.6);
    }
}

.c-title-ja span {
    @media screen and (min-width: 737px) {
        display: block;
    }
}

.p-considering-list {
    margin-top: calc(70 / 375 * 100vw);
    padding: 0 calc(30 / 375 * 100vw);
    display: flex;
    flex-direction: column;
    gap: calc(45 / 375 * 100vw);
    position: relative;
    z-index: 1;
    @media screen and (min-width: 737px) {
        margin: calc(4.2rem / 1.6) auto 0;
        padding: 0 calc(4rem / 1.6);
        flex-direction: row;
        max-width: calc(116rem / 1.6);
        gap: calc(4.5rem / 1.6);
    }
}

.p-considering-list-item {
    @media screen and (min-width: 737px) {
        display: flex;
        flex-direction: column;
        width: calc(100% / 3 - calc(4.5rem / 1.6) / 3);
    }
}

.p-considering-list-item img {
    border-radius: calc(10 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        border-radius:  calc(2rem / 1.6);
    }
}

.p-considering-list-item-box {
    @media screen and (min-width: 737px) {
        flex: 1;
    }
}

.p-considering-list-item-title {
    color: #0082CD;
    font-size: calc(18 / 375 * 100vw);
    font-weight: 600;
    line-height: 1.16667;
    margin-top: 1.25em;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        margin-top: calc(3rem / 1.6);
        font-size: calc(2.4rem / 1.6);
    }
}

.p-considering-list-item-txt {
    color: #444;
    font-size: calc(16 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.6;
    margin-top: 1.25em;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        margin-top: calc(2.1rem / 1.6);
        font-size: calc(1.6rem / 1.6);
    }
}

.c-button2__inner {
    display: inline-flex;
    padding: calc(9 / 375 * 100vw) calc(45 / 375 * 100vw) calc(9 / 375 * 100vw) calc(29 / 375 * 100vw);
    align-items: center;
    /* gap: 8px; */
    border-radius: calc(30 / 375 * 100vw);
    border: 1px solid #56AFD7;
    color: #000;
    font-size: calc(14 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.75;
    letter-spacing: calc(0.28 / 375 * 100vw);
    text-decoration: none;
    margin-top: 1.25em;
    position: relative;
    background: #fff;
    font-feature-settings: initial;
    transition: background 300ms, color 300ms;
    @media screen and (min-width: 737px) {
        margin-top: calc(2.7rem / 1.6);
        border-radius: calc(3rem / 1.6);
        padding: calc(0.9rem / 1.6) calc(4.2rem / 1.6) calc(0.9rem / 1.6) calc(2.6rem / 1.6);
        font-size: calc(1.4rem / 1.6);
    }
    @media (hover: hover) and (pointer: fine) {
        &:hover {
            background: #56AFD7;
            color: #fff;
        }
        &:hover::before {
            background: #fff;
        }
        &:hover::after {
            filter: brightness(0) saturate(100%) invert(84%) sepia(41%) saturate(4108%) hue-rotate(169deg) brightness(88%) contrast(89%);
        }
    }
}

.c-button2__inner::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(19 / 375 * 100vw);
    width: calc(15 / 375 * 100vw);
    height: calc(15 / 375 * 100vw);
    margin: auto;
    border-radius: 50%;
    background-color: #56AFD7;
    transition: background 300ms;
    @media screen and (min-width: 737px) { 
        right:  calc(2.2rem / 1.6);
        width:  calc(1.5rem / 1.6);
        height: calc(1.5rem / 1.6);
    }
}

.c-button2__inner::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc(23 / 375 * 100vw);
    width: calc(7 / 375 * 100vw);
    height: calc(8 / 375 * 100vw);
    margin: auto;
    background-image: url(../img/arrow.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transition: filter 300ms;
    @media screen and (min-width: 737px) {
        right: calc(2.6rem / 1.6);
        width: calc(0.7rem / 1.6);
        height: calc(0.8rem / 1.6);
    }
}

.p-text-area__train{
    aspect-ratio: 333 / 40;
    height: calc(15vw / 3.75 );
    width: auto;
    position: absolute;
    bottom: calc(63% / 1.88);
    left: 0;
    transform: translate(100vw);
    z-index: 1;
    @media screen and (min-width: 737px) {
        height: calc(3rem / 1.6);
    }
}
.p-information-train {
    position: absolute;
    bottom: -1px;
    left: 0;
    aspect-ratio: 333 / 40;
    height: calc(15vw / 3.75 );
    width: auto;
    transform: translateX(100vw);
    animation: train 6s linear infinite 0.5s;
    @media screen and (min-width: 737px) {
        animation: train 12s linear infinite 0.5s;
        height: calc(3rem / 1.6);
    }
}

.p-information {
    overflow: hidden;
    background: #0082CD;
    padding: calc(50 / 375 * 100vw) 0 calc(100 / 375 * 100vw);
    position: relative;
    @media screen and (min-width: 737px) {
        padding: calc(5rem / 1.6) 0 calc(12rem / 1.6);
    }
}

.p-information .c-title-en {
    color: #fff;
}

.p-information .c-title-ja {
    color: #fff;
}

.p-information .c-title-ja::before {
    background: #fff;
}

.p-information-list {
    margin-top: calc(70 / 375 * 100vw);
    padding: 0 calc(30 / 375 * 100vw);
    display: flex;
    flex-direction: column;
    gap: calc(45 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        width: calc(89.7rem / 1.6);
        margin: auto;
        padding: calc(4.6rem / 1.6) calc(3rem / 1.6) 0 calc(4.3rem / 1.6);
    }
}

.p-information-list-item {
    @media screen and (min-width: 737px) {
        display: flex;
        gap: calc(4.5rem / 1.6);
    }
}

.p-information-list-item-img {
    @media screen and (min-width: 737px) {
        width: calc(44.9rem / 1.6);
    }
}

.p-information-list-item-img img{
    border-radius: calc(10 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        border-radius:  calc(2rem / 1.6);
    }
}

.p-information-list-item-right {
    @media screen and (min-width: 737px) {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        /* flex: 1; */
    }
}

.p-information-list-item-title {
    color: #fff;
    font-size: calc(18 / 375 * 100vw);
    font-weight: 600;
    line-height: 1.16667;
    margin-top: 1.25em;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        font-size: calc(2.4rem / 1.6);
        margin-top: 0;
    }
}
.p-point-02__button{
    @media screen and (min-width: 737px) {
        width: calc((100% - (var(--section-btns-gap) * 2)) / 3);
    }
}
.p-information-list-item-txt {
    color: #fff;
    font-size: calc(14 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.6;
    margin-top: 1.25em;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        font-size: calc(1.6rem / 1.6);
        margin-top: calc(2.1rem / 1.6);
    }
}

.p-information .c-button2__inner {
    border-color: #fff;
}


.p-section-point-02__intro-image{
    margin-top: calc(20 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        margin-top: calc(2rem / 1.6);
    }
}

.p-section-point__headline2 {
    color: #FFF;
    font-size: calc(18 / 375 * 100vw);
    font-weight: 600;
    line-height: 1.22222;
    border-radius: calc(10 / 375 * 100vw);
    background: #EAB800;
    padding: calc(14 / 375 * 100vw) calc(18 / 375 * 100vw);
    margin-top: calc(40 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        font-size: calc(2.2rem / 1.6);
        border-radius: calc(1rem / 1.6);
        padding: calc(1.4rem / 1.6) calc(3rem / 1.6);
        margin-top: calc(3rem / 1.6);
    }
}

.p-section-point__headline2.-benefits {
    @media screen and (min-width: 737px) {
        margin-top: calc(6rem / 1.6);
        position: relative;
    }
}

/* .p-section-point__headline2.-benefits2::before {
    @media screen and (min-width: 737px) {
        content: "";
        position: absolute;
        right: 0;
        bottom: calc(7rem / 1.6);
        background-image: url(../img/sec03-picture02_pc.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: calc(47.4rem / 1.6);
        height: calc(19.4rem / 1.6);
    }
} */

.p-section-point__inner {
    @media screen and (min-width: 737px) {
        padding: 0 calc(3rem / 1.6);
    }
}

.p-section-point__inner.-benefits {
    padding-bottom: 0;

    @media screen and (min-width: 737px) {
        padding-bottom: 0;
        position: relative;
    }
}

.p-section-point__txt02 {
    color: #283638;
    font-size: calc(14 / 375 * 100vw);
    line-height: 1.8;
    margin-top: calc(11 / 375 * 100vw);
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        font-size: calc(1.8rem / 1.6);
        margin-top: calc(4rem / 1.6);
    }
}

.p-section-point__benefits {
    display: flex;
    flex-direction: column;
    gap: calc(15 / 375 * 100vw);
    margin-top: calc(15 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        flex-direction: row;
        gap: calc(0.5rem / 1.6);
        margin-top: calc(1rem / 1.6);
    }
}

.p-section-point__benefits-item.-one {
    @media screen and (min-width: 737px) {
        width: calc(20rem / 1.6);
    }
}

.p-section-point__benefits-item.-two {
    @media screen and (min-width: 737px) {
        width: calc(20rem / 1.6);
    }
}

.p-section-point__benefits-item.-three {
    @media screen and (min-width: 737px) {
        width: calc(25rem / 1.6);
    }
}

.p-section-point__benefits-item.-romancecar {
    @media screen and (min-width: 737px) {
        width: calc(30rem / 1.6);
    }
}

.p-section-point__benefits-item-header {
    color: #444;
    text-align: center;
    font-size: calc(13 / 375 * 100vw);
    font-weight: 500;
    line-height: 1.42857;
    letter-spacing: 0.04em;
    background: #EBEDEF;
    padding: calc(10 / 375 * 100vw) 1em;
    @media screen and (min-width: 737px) {
        font-size: calc(1.4rem / 1.6);
        padding: calc(1rem / 1.6) 1em;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: calc(8rem / 1.6);
    }
}
.p-section-point__benefits-item-txt-line{
    font-size: calc(12 / 375 * 100vw);
    background: #fff;
    padding: 0.25em 1em;
    border-radius: 2em;
    display: inline-block;
    margin-top: 0.5em;
    font-weight: 600;
    @media screen and (min-width: 737px) {
        font-size: calc(1.2rem / 1.6);
    }
}


.p-section-point__plus {
    display: block;
    margin: calc(25 / 375 * 100vw) auto;
    width: calc(30 / 375 * 100vw);

    @media screen and (min-width: 737px) {
        width: calc(3rem / 1.6);
        margin: calc(1.5rem / 1.6) auto;
    }
}

.p-section-point__benefits-balloon {
    position: absolute;
    /* top: 0; */
    bottom: 100%;
    z-index: 1;
    @media screen and (max-width: 736px) {
        left: 4%;
        width: calc(128vw / 3.75);
    }
    @media screen and (min-width: 737px) {
        bottom: 0;
        right: calc(-0.4rem / 1.6);
        width: calc(22.2rem / 1.6);
    }
}

.p-section-point__simulator {
    border-radius: calc(20 / 375 * 100vw);
    background: #F2F4F7;
    margin-top: calc(30 / 375 * 100vw);
    padding: calc(30 / 375 * 100vw) calc(20 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        border-radius: calc(2rem / 1.6);
        margin-top: calc(5rem / 1.6);
        padding: calc(3rem / 1.6) calc(3.2rem / 1.6) calc(2.6rem / 1.6);
    }
}

.p-section-point__simulator-title {
    color: #004BA5;
    font-size: calc(14 / 375 * 100vw);
    font-weight: 600;
    line-height: 1.8;
    font-feature-settings: initial;
    @media screen and (min-width: 737px) {
        font-size: calc(1.6rem / 1.6);
        text-align: center;
    }
}

.p-section-point__simulator-box {
    margin-top: calc(6 / 375 * 100vw);
    @media screen and (min-width: 737px) {
        margin-top: calc(2.6rem / 1.6);
        display: flex;
        align-items: center;
        gap: calc(3.6rem / 1.6);
    }
}

.p-section-point__simulator-box-img {
    @media screen and (min-width: 737px) {
        width: calc(27.2rem / 1.6);
    }
}

.p-section-point__simulator-box-txt {
    color: #283638;
    font-size: calc(14 / 375 * 100vw);
    line-height: 1.8;
    font-feature-settings: initial;
    @media screen and (max-width: 736px) {
        margin-top: calc(6 / 375 * 100vw);
    }
    @media screen and (min-width: 737px) {
        flex: 1;
        font-size: calc(1.6rem / 1.6);
    }
}

.u-hidden-miw1440{
    @media screen and (min-width: 1440px) {
        display: none;
    }
}

.txt-lightblue{
    color: #56AFD7;
}

.txt-pink{
    color: #ED7980;
}

.txt-yellow{
    color: #D79D00;
}

.txt-blue{
    color: #004BA5;
}

.weight700	 {
	font-weight:700
}

.layout-mainArea {
    padding-bottom: 0 !important;
}

/* アニメーション */
.-animated.p-section-point__top {
    opacity: 1;
    transform: translateY(0);
}

@keyframes floating {
    0% {
        transform: translateY(-4%);
    }
    25% {
        transform: translateY(-7%);
    }
    50% {
        transform: translateY(-3%);
    }
    75% {
        transform: translateY(0%);
    }
    100% {
        transform: translateY(-4%);
    }
}
@keyframes floating2 {
    0% {
        transform: translateY(0%);
    }
    30% {
        transform: translateY(-4%);
    }
    60% {
        transform: translateY(-7%);
    }
    80% {
        transform: translateY(-3%);
    }
    100% {
        transform: translateY(0%);
    }
}
@keyframes floating3 {
    0% {
        transform: translateY(-7%);
    }
    20% {
        transform: translateY(-3%);
    }
    50% {
        transform: translateY(0%);
    }
    80% {
        transform: translateY(-4%);
    }
    100% {
        transform: translateY(-7%);
    }
}

@keyframes train {
    0% {transform: translate(100vw);}
    0.4%{transform: translate(calc(100vw - 0.6vw), -5%);}
    0.8%{transform: translate(calc(100vw - 1.2vw), 0);}
    4%{transform: translate(calc(100vw - 6vw), 0);}
    4.4%{transform: translate(calc(100vw - 6.6vw), -5%);}
    4.8%{transform: translate(calc(100vw - 7.2vw), 0);}

    20%{transform: translate(70vw, 0);}
    20.4%{transform: translate(calc(70vw - 0.6vw), -5%);}
    20.8%{transform: translate(calc(70vw - 1.2vw), 0);}
    24%{transform: translate(calc(70vw - 6vw), 0);}
    24.4%{transform: translate(calc(70vw - 6.6vw), -5%);}
    24.8%{transform: translate(calc(70vw - 7.2vw), 0);}

    40%{transform: translate(40vw, 0);}
    40.4%{transform: translate(calc(40vw - 0.6vw), -5%);}
    40.8%{transform: translate(calc(40vw - 1.2vw), 0);}
    44%{transform: translate(calc(40vw - 6vw), 0);}
    44.4%{transform: translate(calc(40vw - 6.6vw), -5%);}
    44.8%{transform: translate(calc(40vw - 7.2vw), 0);}

    60%{transform: translate(10vw, 0);}
    60.4%{transform: translate(calc(10vw - 0.6vw), -5%);}
    60.8%{transform: translate(calc(10vw - 1.2vw), 0);}
    64%{transform: translate(calc(10vw - 6vw), 0);}
    64.4%{transform: translate(calc(10vw - 6.6vw), -5%);}
    64.8%{transform: translate(calc(10vw - 7.2vw), 0);}

    80%{transform: translate(-20vw, 0);}
    80.4%{transform: translate(calc(-20vw - 0.6vw), -5%);}
    80.8%{transform: translate(calc(-20vw - 1.2vw), 0);}
    84%{transform: translate(calc(-20vw - 6vw), 0);}
    84.4%{transform: translate(calc(-20vw - 6.6vw), -5%);}
    84.8%{transform: translate(calc(-20vw - 7.2vw), 0);}

    100% {
        transform: translateX(-50vw);
    }
}