@charset "utf-8";


/* A Modern CSS Reset */
*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role="list"],ol[role="list"]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}table{border-collapse: collapse;border-spacing: 0;width: 100%;}

:root {
    --base_font-size: 16px;
    --wrapper: min(92% , 1180px);
    --gradation: linear-gradient(135deg, #43BFB8 0% , #3D9ECB 100%);
}

html {
    font-size: 1rem;
}

body {
    position: relative;
    font-family: "Noto Sans JP",-apple-system,Helvetica Neue,Hiragino Kaku Gothic ProN,"メイリオ",meiryo,sans-serif;
    font-size: var(--base_font-size);
    font-weight: 400;
    font-optical-sizing: auto;
    font-style: normal;
    line-height: 1.5;
    color: #495151;
}

.font_dm-sans {
    font-family: "DM Sans", serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}
.font_montserrat {
    font-family: "Montserrat", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

img {
    max-width: 100%;
    height: auto;
}

embed,
iframe,
object {
    max-width: 100%;
}

address {
    font-style: normal;
}

a {
    color:#0075C2;
    text-decoration: underline;
}

ul,ol {
    padding-left: 1.5rem;
}

.pc {
    display: none!important;
}

@media only screen and (min-width: 1024px) , print {
    :root {
        --base_font-size: 18px;
    }
    .pc {
        display: inherit!important;
    }
    .mobile {
        display: none!important;
    }
}


.block {
    display: block!important;
}
.ib {
    display: inline-block;
}

.hide {
    display: none!important;
}
.w_60 {
    width: 60px!important;
}
.w_80 {
    width: 80px!important;
}
.w_100 {
    width: 100px!important;
}
.w_120 {
    width: 120px!important;
}
.w_180 {
    width: 180px!important;
}
.w_200 {
    width: 200px!important;
}
.w_240 {
    width: 240px!important;
}
.w_260 {
    width: 260px!important;
}
.w_300 {
    width: 100%;
    max-width: 300px!important;
}
.w_30per {
    width: 30%!important;
}
.w_50per {
    width: 50%!important;
}
.mw_max_content {
    max-width: max-content!important;
}
.w_auto {
    width: auto!important;
}
.h_auto {
    height: auto!important;
}

.ga-0 {
    gap: 0px!important
}
.ga-1 {
    gap: 4px!important
}
.ga-2 {
    gap: 8px!important
}
.ga-3 {
    gap: 12px!important
}
.ga-4 {
    gap: 16px!important
}
.ga-5 {
    gap: 20px!important
}
.ga-6 {
    gap: 24px!important
}
.ga-7 {
    gap: 28px!important
}
.ga-8 {
    gap: 32px!important
}
.ga-9 {
    gap: 36px!important
}
.ga-10 {
    gap: 40px!important
}
.ga-11 {
    gap: 44px!important
}
.ga-12 {
    gap: 48px!important
}
.ga-13 {
    gap: 52px!important
}
.ga-14 {
    gap: 56px!important
}
.ga-15 {
    gap: 60px!important
}
.ga-16 {
    gap: 64px!important
}
.ga-auto {
    gap: auto!important
}
.gr-0 {
    row-gap: 0px!important
}
.gr-1 {
    row-gap: 4px!important
}
.gr-2 {
    row-gap: 8px!important
}
.gr-3 {
    row-gap: 12px!important
}
.gr-4 {
    row-gap: 16px!important
}
.gr-5 {
    row-gap: 20px!important
}
.gr-6 {
    row-gap: 24px!important
}
.gr-7 {
    row-gap: 28px!important
}
.gr-8 {
    row-gap: 32px!important
}
.gr-9 {
    row-gap: 36px!important
}
.gr-10 {
    row-gap: 40px!important
}
.gr-11 {
    row-gap: 44px!important
}
.gr-12 {
    row-gap: 48px!important
}
.gr-13 {
    row-gap: 52px!important
}
.gr-14 {
    row-gap: 56px!important
}
.gr-15 {
    row-gap: 60px!important
}
.gr-16 {
    row-gap: 64px!important
}
.gr-auto {
    row-gap: auto!important
}
.gc-0 {
    column-gap: 0px!important
}
.gc-1 {
    column-gap: 4px!important
}
.gc-2 {
    column-gap: 8px!important
}
.gc-3 {
    column-gap: 12px!important
}
.gc-4 {
    column-gap: 16px!important
}
.gc-5 {
    column-gap: 20px!important
}
.gc-6 {
    column-gap: 24px!important
}
.gc-7 {
    column-gap: 28px!important
}
.gc-8 {
    column-gap: 32px!important
}
.gc-9 {
    column-gap: 36px!important
}
.gc-10 {
    column-gap: 40px!important
}
.gc-11 {
    column-gap: 44px!important
}
.gc-12 {
    column-gap: 48px!important
}
.gc-13 {
    column-gap: 52px!important
}
.gc-14 {
    column-gap: 56px!important
}
.gc-15 {
    column-gap: 60px!important
}
.gc-16 {
    column-gap: 64px!important
}
.gc-auto {
    column-gap: auto!important
}
.ma-0 {
    margin: 0!important
}
.ma-1 {
    margin: 4px!important
}
.ma-2 {
    margin: 8px!important
}
.ma-3 {
    margin: 12px!important
}
.ma-4 {
    margin: 16px!important
}
.ma-5 {
    margin: 20px!important
}
.ma-6 {
    margin: 24px!important
}
.ma-7 {
    margin: 28px!important
}
.ma-8 {
    margin: 32px!important
}
.ma-9 {
    margin: 36px!important
}
.ma-10 {
    margin: 40px!important
}
.ma-11 {
    margin: 44px!important
}
.ma-12 {
    margin: 48px!important
}
.ma-13 {
    margin: 52px!important
}
.ma-14 {
    margin: 56px!important
}
.ma-15 {
    margin: 60px!important
}
.ma-16 {
    margin: 64px!important
}
.ma-auto {
    margin: auto!important
}
.mx-0 {
    margin-right: 0!important;
    margin-left: 0!important
}
.mx-1 {
    margin-right: 4px!important;
    margin-left: 4px!important
}
.mx-2 {
    margin-right: 8px!important;
    margin-left: 8px!important
}
.mx-3 {
    margin-right: 12px!important;
    margin-left: 12px!important
}
.mx-4 {
    margin-right: 16px!important;
    margin-left: 16px!important
}
.mx-5 {
    margin-right: 20px!important;
    margin-left: 20px!important
}
.mx-6 {
    margin-right: 24px!important;
    margin-left: 24px!important
}
.mx-7 {
    margin-right: 28px!important;
    margin-left: 28px!important
}
.mx-8 {
    margin-right: 32px!important;
    margin-left: 32px!important
}
.mx-9 {
    margin-right: 36px!important;
    margin-left: 36px!important
}
.mx-10 {
    margin-right: 40px!important;
    margin-left: 40px!important
}
.mx-11 {
    margin-right: 44px!important;
    margin-left: 44px!important
}
.mx-12 {
    margin-right: 48px!important;
    margin-left: 48px!important
}
.mx-13 {
    margin-right: 52px!important;
    margin-left: 52px!important
}
.mx-14 {
    margin-right: 56px!important;
    margin-left: 56px!important
}
.mx-15 {
    margin-right: 60px!important;
    margin-left: 60px!important
}
.mx-16 {
    margin-right: 64px!important;
    margin-left: 64px!important
}
.mx-auto {
    margin-right: auto!important;
    margin-left: auto!important
}
.my-0 {
    margin-top: 0!important;
    margin-bottom: 0!important
}
.my-1 {
    margin-top: 4px!important;
    margin-bottom: 4px!important
}
.my-2 {
    margin-top: 8px!important;
    margin-bottom: 8px!important
}
.my-3 {
    margin-top: 12px!important;
    margin-bottom: 12px!important
}
.my-4 {
    margin-top: 16px!important;
    margin-bottom: 16px!important
}
.my-5 {
    margin-top: 20px!important;
    margin-bottom: 20px!important
}
.my-6 {
    margin-top: 24px!important;
    margin-bottom: 24px!important
}
.my-7 {
    margin-top: 28px!important;
    margin-bottom: 28px!important
}
.my-8 {
    margin-top: 32px!important;
    margin-bottom: 32px!important
}
.my-9 {
    margin-top: 36px!important;
    margin-bottom: 36px!important
}
.my-10 {
    margin-top: 40px!important;
    margin-bottom: 40px!important
}
.my-11 {
    margin-top: 44px!important;
    margin-bottom: 44px!important
}
.my-12 {
    margin-top: 48px!important;
    margin-bottom: 48px!important
}
.my-13 {
    margin-top: 52px!important;
    margin-bottom: 52px!important
}
.my-14 {
    margin-top: 56px!important;
    margin-bottom: 56px!important
}
.my-15 {
    margin-top: 60px!important;
    margin-bottom: 60px!important
}
.my-16 {
    margin-top: 64px!important;
    margin-bottom: 64px!important
}
.my-auto {
    margin-top: auto!important;
    margin-bottom: auto!important
}
.mt-0 {
    margin-top: 0!important
}
.mt-1 {
    margin-top: 4px!important
}
.mt-2 {
    margin-top: 8px!important
}
.mt-3 {
    margin-top: 12px!important
}
.mt-4 {
    margin-top: 16px!important
}
.mt-5 {
    margin-top: 20px!important
}
.mt-6 {
    margin-top: 24px!important
}
.mt-7 {
    margin-top: 28px!important
}
.mt-8 {
    margin-top: 32px!important
}
.mt-9 {
    margin-top: 36px!important
}
.mt-10 {
    margin-top: 40px!important
}
.mt-11 {
    margin-top: 44px!important
}
.mt-12 {
    margin-top: 48px!important
}
.mt-13 {
    margin-top: 52px!important
}
.mt-14 {
    margin-top: 56px!important
}
.mt-15 {
    margin-top: 60px!important
}
.mt-16 {
    margin-top: 64px!important
}
.mt-auto {
    margin-top: auto!important
}
.mr-0 {
    margin-right: 0!important
}
.mr-1 {
    margin-right: 4px!important
}
.mr-2 {
    margin-right: 8px!important
}
.mr-3 {
    margin-right: 12px!important
}
.mr-4 {
    margin-right: 16px!important
}
.mr-5 {
    margin-right: 20px!important
}
.mr-6 {
    margin-right: 24px!important
}
.mr-7 {
    margin-right: 28px!important
}
.mr-8 {
    margin-right: 32px!important
}
.mr-9 {
    margin-right: 36px!important
}
.mr-10 {
    margin-right: 40px!important
}
.mr-11 {
    margin-right: 44px!important
}
.mr-12 {
    margin-right: 48px!important
}
.mr-13 {
    margin-right: 52px!important
}
.mr-14 {
    margin-right: 56px!important
}
.mr-15 {
    margin-right: 60px!important
}
.mr-16 {
    margin-right: 64px!important
}
.mr-auto {
    margin-right: auto!important
}
.mb-0 {
    margin-bottom: 0!important
}
.mb-1 {
    margin-bottom: 4px!important
}
.mb-2 {
    margin-bottom: 8px!important
}
.mb-3 {
    margin-bottom: 12px!important
}
.mb-4 {
    margin-bottom: 16px!important
}
.mb-5 {
    margin-bottom: 20px!important
}
.mb-6 {
    margin-bottom: 24px!important
}
.mb-7 {
    margin-bottom: 28px!important
}
.mb-8 {
    margin-bottom: 32px!important
}
.mb-9 {
    margin-bottom: 36px!important
}
.mb-10 {
    margin-bottom: 40px!important
}
.mb-11 {
    margin-bottom: 44px!important
}
.mb-12 {
    margin-bottom: 48px!important
}
.mb-13 {
    margin-bottom: 52px!important
}
.mb-14 {
    margin-bottom: 56px!important
}
.mb-15 {
    margin-bottom: 60px!important
}
.mb-16 {
    margin-bottom: 64px!important
}
.mb-auto {
    margin-bottom: auto!important
}
.ml-0 {
    margin-left: 0!important
}
.ml-1 {
    margin-left: 4px!important
}
.ml-2 {
    margin-left: 8px!important
}
.ml-3 {
    margin-left: 12px!important
}
.ml-4 {
    margin-left: 16px!important
}
.ml-5 {
    margin-left: 20px!important
}
.ml-6 {
    margin-left: 24px!important
}
.ml-7 {
    margin-left: 28px!important
}
.ml-8 {
    margin-left: 32px!important
}
.ml-9 {
    margin-left: 36px!important
}
.ml-10 {
    margin-left: 40px!important
}
.ml-11 {
    margin-left: 44px!important
}
.ml-12 {
    margin-left: 48px!important
}
.ml-13 {
    margin-left: 52px!important
}
.ml-14 {
    margin-left: 56px!important
}
.ml-15 {
    margin-left: 60px!important
}
.ml-16 {
    margin-left: 64px!important
}
.ml-auto {
    margin-left: auto!important
}
.pa-0 {
    padding: 0!important
}
.pa-1 {
    padding: 4px!important
}
.pa-2 {
    padding: 8px!important
}
.pa-3 {
    padding: 12px!important
}
.pa-4 {
    padding: 16px!important
}
.pa-5 {
    padding: 20px!important
}
.pa-6 {
    padding: 24px!important
}
.pa-7 {
    padding: 28px!important
}
.pa-8 {
    padding: 32px!important
}
.pa-9 {
    padding: 36px!important
}
.pa-10 {
    padding: 40px!important
}
.pa-11 {
    padding: 44px!important
}
.pa-12 {
    padding: 48px!important
}
.pa-13 {
    padding: 52px!important
}
.pa-14 {
    padding: 56px!important
}
.pa-15 {
    padding: 60px!important
}
.pa-16 {
    padding: 64px!important
}
.px-0 {
    padding-right: 0!important;
    padding-left: 0!important
}
.px-1 {
    padding-right: 4px!important;
    padding-left: 4px!important
}
.px-2 {
    padding-right: 8px!important;
    padding-left: 8px!important
}
.px-3 {
    padding-right: 12px!important;
    padding-left: 12px!important
}
.px-4 {
    padding-right: 16px!important;
    padding-left: 16px!important
}
.px-5 {
    padding-right: 20px!important;
    padding-left: 20px!important
}
.px-6 {
    padding-right: 24px!important;
    padding-left: 24px!important
}
.px-7 {
    padding-right: 28px!important;
    padding-left: 28px!important
}
.px-8 {
    padding-right: 32px!important;
    padding-left: 32px!important
}
.px-9 {
    padding-right: 36px!important;
    padding-left: 36px!important
}
.px-10 {
    padding-right: 40px!important;
    padding-left: 40px!important
}
.px-11 {
    padding-right: 44px!important;
    padding-left: 44px!important
}
.px-12 {
    padding-right: 48px!important;
    padding-left: 48px!important
}
.px-13 {
    padding-right: 52px!important;
    padding-left: 52px!important
}
.px-14 {
    padding-right: 56px!important;
    padding-left: 56px!important
}
.px-15 {
    padding-right: 60px!important;
    padding-left: 60px!important
}
.px-16 {
    padding-right: 64px!important;
    padding-left: 64px!important
}
.py-0 {
    padding-top: 0!important;
    padding-bottom: 0!important
}
.py-1 {
    padding-top: 4px!important;
    padding-bottom: 4px!important
}
.py-2 {
    padding-top: 8px!important;
    padding-bottom: 8px!important
}
.py-3 {
    padding-top: 12px!important;
    padding-bottom: 12px!important
}
.py-4 {
    padding-top: 16px!important;
    padding-bottom: 16px!important
}
.py-5 {
    padding-top: 20px!important;
    padding-bottom: 20px!important
}
.py-6 {
    padding-top: 24px!important;
    padding-bottom: 24px!important
}
.py-7 {
    padding-top: 28px!important;
    padding-bottom: 28px!important
}
.py-8 {
    padding-top: 32px!important;
    padding-bottom: 32px!important
}
.py-9 {
    padding-top: 36px!important;
    padding-bottom: 36px!important
}
.py-10 {
    padding-top: 40px!important;
    padding-bottom: 40px!important
}
.py-11 {
    padding-top: 44px!important;
    padding-bottom: 44px!important
}
.py-12 {
    padding-top: 48px!important;
    padding-bottom: 48px!important
}
.py-13 {
    padding-top: 52px!important;
    padding-bottom: 52px!important
}
.py-14 {
    padding-top: 56px!important;
    padding-bottom: 56px!important
}
.py-15 {
    padding-top: 60px!important;
    padding-bottom: 60px!important
}
.py-16 {
    padding-top: 64px!important;
    padding-bottom: 64px!important
}
.pt-0 {
    padding-top: 0!important
}
.pt-1 {
    padding-top: 4px!important
}
.pt-2 {
    padding-top: 8px!important
}
.pt-3 {
    padding-top: 12px!important
}
.pt-4 {
    padding-top: 16px!important
}
.pt-5 {
    padding-top: 20px!important
}
.pt-6 {
    padding-top: 24px!important
}
.pt-7 {
    padding-top: 28px!important
}
.pt-8 {
    padding-top: 32px!important
}
.pt-9 {
    padding-top: 36px!important
}
.pt-10 {
    padding-top: 40px!important
}
.pt-11 {
    padding-top: 44px!important
}
.pt-12 {
    padding-top: 48px!important
}
.pt-13 {
    padding-top: 52px!important
}
.pt-14 {
    padding-top: 56px!important
}
.pt-15 {
    padding-top: 60px!important
}
.pt-16 {
    padding-top: 64px!important
}
.pr-0 {
    padding-right: 0!important
}
.pr-1 {
    padding-right: 4px!important
}
.pr-2 {
    padding-right: 8px!important
}
.pr-3 {
    padding-right: 12px!important
}
.pr-4 {
    padding-right: 16px!important
}
.pr-5 {
    padding-right: 20px!important
}
.pr-6 {
    padding-right: 24px!important
}
.pr-7 {
    padding-right: 28px!important
}
.pr-8 {
    padding-right: 32px!important
}
.pr-9 {
    padding-right: 36px!important
}
.pr-10 {
    padding-right: 40px!important
}
.pr-11 {
    padding-right: 44px!important
}
.pr-12 {
    padding-right: 48px!important
}
.pr-13 {
    padding-right: 52px!important
}
.pr-14 {
    padding-right: 56px!important
}
.pr-15 {
    padding-right: 60px!important
}
.pr-16 {
    padding-right: 64px!important
}
.pb-0 {
    padding-bottom: 0!important
}
.pb-1 {
    padding-bottom: 4px!important
}
.pb-2 {
    padding-bottom: 8px!important
}
.pb-3 {
    padding-bottom: 12px!important
}
.pb-4 {
    padding-bottom: 16px!important
}
.pb-5 {
    padding-bottom: 20px!important
}
.pb-6 {
    padding-bottom: 24px!important
}
.pb-7 {
    padding-bottom: 28px!important
}
.pb-8 {
    padding-bottom: 32px!important
}
.pb-9 {
    padding-bottom: 36px!important
}
.pb-10 {
    padding-bottom: 40px!important
}
.pb-11 {
    padding-bottom: 44px!important
}
.pb-12 {
    padding-bottom: 48px!important
}
.pb-13 {
    padding-bottom: 52px!important
}
.pb-14 {
    padding-bottom: 56px!important
}
.pb-15 {
    padding-bottom: 60px!important
}
.pb-16 {
    padding-bottom: 64px!important
}
.pl-0 {
    padding-left: 0!important
}
.pl-1 {
    padding-left: 4px!important
}
.pl-2 {
    padding-left: 8px!important
}
.pl-3 {
    padding-left: 12px!important
}
.pl-4 {
    padding-left: 16px!important
}
.pl-5 {
    padding-left: 20px!important
}
.pl-6 {
    padding-left: 24px!important
}
.pl-7 {
    padding-left: 28px!important
}
.pl-8 {
    padding-left: 32px!important
}
.pl-9 {
    padding-left: 36px!important
}
.pl-10 {
    padding-left: 40px!important
}
.pl-11 {
    padding-left: 44px!important
}
.pl-12 {
    padding-left: 48px!important
}
.pl-13 {
    padding-left: 52px!important
}
.pl-14 {
    padding-left: 56px!important
}
.pl-15 {
    padding-left: 60px!important
}
.pl-16 {
    padding-left: 64px!important;
}

.mt_s {
    margin-top: clamp(8px , 3vw , 16px)!important;
}
.mb_s {
    margin-bottom: clamp(8px , 3vw , 16px)!important;
}
.mt_sm {
    margin-top: clamp(16px , 4.5vw , 32px)!important;
}
.mb_sm {
    margin-bottom: clamp(16px , 4.5vw , 32px)!important;
}
.mt_m {
    margin-top: clamp(36px , 6vw , 72px)!important;
}
.mb_m {
    margin-bottom: clamp(36px , 6vw , 72px)!important;
}
.mt_ml {
    margin-top: clamp(48px , 8vw , 100px)!important;
}
.mb_ml {
    margin-bottom: clamp(48px , 8vw , 100px)!important;
}
.mt_l {
    margin-top: clamp(64px , 10vw , 160px)!important;
}
.mb_l {
    margin-bottom: clamp(64px , 10vw , 160px)!important;
}
.pt_m {
    padding-top: clamp(36px , 6vw , 72px)!important;
}
.pb_m {
    padding-bottom: clamp(36px , 6vw , 72px)!important;
}
.pt_ml {
    padding-top: clamp(48px , 8vw , 100px)!important;
}
.pb_ml {
    padding-bottom: clamp(48px , 8vw , 100px)!important;
}
.pt_l {
    padding-top: clamp(64px , 10vw , 160px)!important;
}
.pb_l {
    padding-bottom: clamp(64px , 10vw , 160px)!important;
}

.border_0 {
    border: 0!important;
}

.pointer {
    cursor: pointer;
}

.underline {
    text-decoration: underline;
}
.nowrap {
    white-space: nowrap;
}

.fw {
    font-weight: 700;
}
.fw_500 {
    font-weight: 500;
}
.fw_600 {
    font-weight: 600;
}
.small {
    font-size: 0.8em;
}
.small2 {
    font-size: 0.64em;
}

.fs_xs {
    font-size:min(3.4666vw , calc(var(--base_font-size) - 2px));
}
.fs_s {
    font-size:min(3.7333vw , var(--base_font-size));
}
.fs_m {
    font-size: min(4.26666vw , calc(var(--base_font-size) + 2px));
}
.fs_ml {
    font-size: min(4.8vw , calc(var(--base_font-size) + 4px));
}
.fs_l {
    font-size: min(4.8vw , calc(var(--base_font-size) + 6px));
}
.fs_xl {
    font-size: min(6.4vw , calc(var(--base_font-size) + 10px));
}
.fs_xxl {
    font-size: min(6.4vw , calc(var(--base_font-size) + 18px));
}
.fs_xxxl {
    font-size: min(6.4vw , calc(var(--base_font-size) + 22px));
}
.fs_xxxxl {
    font-size: min(9.6vw , calc(var(--base_font-size) + 42px));
}
.f11 {
    font-size: 11px;
}
.f12 {
    font-size: 12px;
}
.f14 {
    font-size: 14px;
}
.f15 {
    font-size: 15px;
}
.f16 {
    font-size: 16px;
}
.f18 {
    font-size: 18px;
}
.f24 {
    font-size:24px;
}
.f28 {
    font-size:28px;
}
.f36 {
    font-size: 36px;
}
.f48 {
    font-size: 48px;
}
.f56 {
    font-size: 56px;
}
.text-left {
    text-align: left!important;
}
.text-center {
    text-align: center!important;
}
.text-right {
    text-align: right!important;
}
.lh01 {
    line-height: 1.4;
}
.lh02 {
    line-height: 1.25;
}
.lh03 {
    line-height: 1.8;
}
.lh04 {
    line-height: 1;
}
.d-flex {
    display: flex;
}
.flex-column {
    flex-direction: column!important;
}
.flex-row {
    flex-direction: row!important;
}
.flex-row-reverse {
    flex-direction: row-reverse!important;
}
.flex-wrap {
    flex-wrap: wrap!important;
}
.justify-content-start {
    justify-content: flex-start!important;
}
.justify-content-end {
    justify-content: flex-end!important;
}
.justify-content-center {
    justify-content: center!important;
}
.justify-content-between {
    justify-content: space-between!important;
}
.justify-content-around {
    justify-content: space-around!important;
}
.align-items-start {
    align-items: flex-start!important;
}
.align-items-end {
    align-items: flex-end!important;
}
.align-items-center {
    align-items: center!important;
}
.align-items-baseline {
    align-items: baseline!important;
}
.align-items-stretch {
    align-items: stretch!important;
}
.flex-none {
    flex: none;
}

.d-grid {
    display: grid;
}
.grid-col2 {
    grid-template-columns: 1fr 1fr;
}
.grid-col3 {
    grid-template-columns: 1fr 1fr 1fr;
}
.gap01 {
    gap:min(16vw , 120px);
}
.position-relative {
    position: relative;
}
.border_bottom01 {
    border-bottom: 1px solid #C8C7C7;
}

.wrapper {
    width: var(--wrapper);
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.grecaptcha-badge {
    visibility: hidden;
}
.title_wrap{
    display: grid;
    gap: min(4.2666666vw, 32px);
    font-weight: 700;
}
.pink{
    color: #E63556;
}
.blue{
    color: #00AECB;
}
.bg_white{
    background-color: #ffffff;
}
.bg_light_gray{
    background-color: #F7F7F7;
}

/* main
-------------------------------*/
.main{
    background:#fff;
    padding: 14px 0 32px;
}
.main_area{
    width: min(96%, 1761px);
    margin: 0 auto;
}
.main_header{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding: 6px 0 12px;
}
.main_logo img{
    display:block;
    height: 50px;
    width:auto;
}
.main_grid{
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    background:#fff;
    min-height: 560px;
    display:grid;
    grid-template-columns: minmax(420px, 560px) minmax(520px, 680px);
    column-gap: 18px;
    align-items: center;
    justify-content: center;
}
.main_grid::before{
    content:"";
    position:absolute;
    top:0; bottom:0;
    left:50%;
    transform: translateX(-50%);
    width: min(1761px, 100%);
    z-index:0;
    pointer-events:none;
    background-image:url("../img/background.webp");
    background-repeat:no-repeat;
    background-position:center;
    background-size: cover;
    opacity: .95;
}
.main_left,
.main_right{
    position:relative;
    z-index:1;
}
.main_phone{
    width: min(100%, 520px);
    margin: 0 auto;
    transform: translateX(18px);
}
.main_right{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
}
.main_badge{
    width: min(100%, 580px);
}
.main_catch{
    width: min(100%, 720px);
    margin-bottom: 18px;
}
.main_text{
    margin:0;
    line-height: 1.9;
}
.main_ctawrap{ 
    margin-top: 26px;
}
.main_cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:15px;
    padding: 15px 35px;
    min-width: 350px;
    border-radius:999px;
    background: linear-gradient(90deg, #E41C45 0%, #F35640 100%);
    color:#fff;
    text-decoration:none;
    transition: filter .2s ease, transform .2s ease;
}
.main_cta:hover{ filter: brightness(.9); }
.main_cta:active{ transform: translateY(1px); }
.main_ctaarrow{ font-size:12px; line-height:1; }

@media (max-width: 1024px){
    .main_logo img{
        height: 32px;
    }
    .main_grid{
        grid-template-columns: 1fr;
        row-gap: 22px;
        padding: 22px 16px;
        min-height: auto;
        justify-items: center;
    }
    .main_phone{
        transform:none;
    }
    .main_grid::before{
        width: 100%;
        background-size: cover;
        background-position: center;
    }
    .main_cta{
        min-width: 100%;
        max-width: 350px;
    }
}

/* problem
-------------------------------*/
.problem{
    position: relative;
    padding: 64px 0 72px;
    overflow: hidden;
}
.problem .wrapper{
    position: relative;
}
.problem_head{
    padding-top: 80px;
    transform: translateX(-15px);
    text-align: center;
    max-width: 550px;
    width: 85vw;
    margin: 0 auto;
}
.problem_head img{
    width: 550px;
}
.problem_top{
    position: relative;
    padding-bottom: 64px;
}
.problem_top::before{
    content:"";
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 100vw;
    height: 680px;
    background: url("../img/problem_back01.svg") no-repeat center bottom;
    background-size: cover;
    z-index: 0;
    pointer-events:none;
}
.problem_top > *{
    position: relative;
    z-index: 1;
}
.problem_cards{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    width: min(1100px, 100%);
    margin: 0 auto;
}
.problem_card{
    position: relative;
    background: #fff;
    box-shadow: 0 10px 24px rgba(0,0,0,.12);
    padding: 24px 22px 28px;
}
.problem_num{
    position: absolute;
    top: 0;
    left: 0;
    background: #5B6B6C;
    color: #fff;
    padding: 12px 16px;
    border-radius: 0px 0 12px 0;
}
.problem_img{
    margin: 20px 0 25px;
    min-height: 110px;
    display: flex;
    justify-content: center;
}
.problem_img img{
    width: 150px;
    height: 150px;
}
.problem_cardtext{
    text-align: center;
    line-height: 1.6;
    max-width: 18em;
    margin: 0 auto;
}
.problem_cardtext strong{
    font-weight: 700;
}
.problem_deco2{
    position: absolute;
    left: 50%;
    bottom: -50px;
    transform: translateX(-50%);
    width: 65px;
    height: 65px;
    z-index: 2;
}
.problem_deco2 img{
    width: 100%;
    height: auto;
    display: block;
}
.problem_bottom{
    position: relative;
}
.bg_dots{
    position: absolute;
    top: 62%;
    transform: translateY(-50%);
    width: 280px;
    height: 360px;
    background-image: url("../img/problem_back02.svg") !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
}
.bg_dots-left{
    left: 0;
    top: 35%
}
.bg_dots-right{
    right: 0;
    top: 75%;
}
.problem_solveinner{
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 15px;
    width: min(980px, 100%);
    margin: 0 auto;
    margin-top: 70px;
    align-items: center;
}
.problem_solve,
.problem_solveinner{
    position: relative;
    z-index: 1;
}
.problem_solveillust img{
    width: 140px;
}
.problem_solvecontent{
    text-align: center;
}
.problem_solvetitle img{
    width: min(720px, 100%);
    margin: 0 auto 14px;
    display: block;
}
.problem_gradation{
    display: inline-block;
    background: linear-gradient(135deg, #0694AB 0%, #05B3D0 100%);
    color: #fff;
    padding: 10px 18px;
    margin: 0 auto 14px;
    border-radius: 0;
}
.problem_desc{
    line-height: 2;
    margin: 0;
}
@media (max-width: 1024px){
    .problem_cards{
        grid-template-columns: 1fr;
        width: min(560px, 100%);
        gap: 18px;
    }
    .problem_img{
        margin: 0 0 0 20px;
    }
    .problem_top::before{
        height: 100%;
    }
    .problem_solveinner{
        grid-template-columns: 1fr;
        width: min(620px, 100%);
    }
    .problem_solvecontent{
        order: 1;
    }
    .problem_solveillust{
        order: 2; 
    }
    .problem_solveillust img{
        margin: 12px auto 0;
        width: 130px;
        display: block;
    }
}

/* point
-------------------------------*/
.point {
    background-color: #F3FAFB;
}
.point_content {
    max-width: 1000px;
    margin: 0 auto 84px;
    position: relative;
}
.point_num {
    width: auto;
    position: absolute;
    bottom: 10px;
    left: 0;
    top: 40%;
}
.point_num_r {
    right: 0;
    left: auto;
}
.point_num01 {
    left: -80px;
}
.point_num02,.point_num04{
    right: -70px;
}
.point_num03{
    left: -85px;
}
.point_box {
    display: flex;
    align-items: center;
    gap: 32px;
    position: relative;
}
.point_img {
    width: 360px;
    margin: 0;
    text-align: center;
}
.point_text {
    margin: 0;
    max-width: 500px;
}
@media only screen and (max-width: 1024px) {
    .point_content {
        max-width: none;
        margin-bottom: 84px;
    }
    .point_num {
        position: static;
        width: 40px;
        margin: 0 auto 8px;
    }
    .point_num01{
        width: 29px;
    }
    .point_box {
        display: block;
    }
    .point_img {
        width: 50%;
        margin: 0 auto 16px;
    }
    .point_text {
        margin: 0 auto;
        max-width: max-content;
        width: 80%;
        text-align: center;
    }
    .point_text p .ib{
        display: inline;
    }
}

/* function
-------------------------------*/
.function{
    position: relative;
    padding: 84px 0 110px;
    overflow: hidden;
    background: #fff;
}
.function::before{
    content:"";
    position: absolute;
    inset: 0;
    background: url("../img/function_back.webp") no-repeat center;
    background-size: cover;
    pointer-events: none;
    z-index: 0;
}
.function .wrapper{
    position: relative;
    z-index: 1;
}
.function_grid{
    width: min(1000px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 40px 28px;
    justify-items: center;
}
.function_card{
    position: relative;
    width: 100%;
    max-width: 400px;
    height: 650px;
    background: #fff;
    border-radius: 25px 0;
    box-shadow: 0 14px 30px rgba(0,0,0,.12);
    padding: 30px 20px 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.function_grid .function_card:nth-child(1){
    grid-column: 1 / span 2;
}
.function_grid .function_card:nth-child(2){
    grid-column: 3 / span 2;
}
.function_grid .function_card:nth-child(3){
    grid-column: 5 / span 2; 
}
.function_grid .function_card:nth-child(4){
    grid-column: 2 / span 2; 
}
.function_grid .function_card:nth-child(5){
    grid-column: 4 / span 2;
}
.function_num{
    position: absolute;
    left: 0;
    top: -3px;
    width: 65px;
    height: 65px;
    z-index: 2;
}
.function_num img{
    width: 100%;
    height: 100%;
    display: block;
}
.function_img{
    width: 200px;
    height: 200px;
    margin: 30px auto;
    display: grid;
    place-items: center;
}
.function_img img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}
.function_cardtitle{
    color: #05B3D0;
    text-align: center;
    line-height: 1.45;
}
.function_cardtext{
    line-height: 2;
    color: #333;
    margin: 0;
    width: 100%;
    max-width: 26em;
}
@media (max-width: 1024px){
    .function{
        padding: 70px 0 90px;
    }
    .function_grid{
        grid-template-columns: 1fr;
        gap: 36px;
        justify-items: center;
    }
    .function_grid .function_card:nth-child(1),
    .function_grid .function_card:nth-child(2),
    .function_grid .function_card:nth-child(3),
    .function_grid .function_card:nth-child(4),
    .function_grid .function_card:nth-child(5){
        grid-column: auto;
    }
    .function_card{
        width: min(90%, 320px);
        height: 550px;
    }
}

/* flow
-------------------------------*/
.flow{
    background:#F3FAFB;
    padding: 96px 0 110px;
}
.flow_steps{
    width: min(1100px, 100%);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.flow_step{
text-align: center;
}
.flow_circle{
    width: 250px;
    height: 250px;
    background: #fff;
    border-radius: 50%;
    /*box-shadow: 0 14px 26px rgba(0,0,0,.08);*/
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}
.flow_circle img{
    width: 90px;
    height: auto;
}
.flow_title{
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 6px;
}
.flow_sub{
    font-size: 18px;
    color: #555;
}
.flow_arrow{
    flex: 0 0 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
    transform: translateY(-40px);
}
.flow_arrow img{
    display: block;
    width: 30px;
    height: auto;
}
@media (max-width:1024px){
    .flow_steps{
        flex-direction: column;
        gap: 10px;
    }
    .flow_step{
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .flow_circle{
        margin-bottom: 5px;
        width: 190px;
        height: 190px;
        margin-left: auto;
        margin-right: auto;
    }
    .flow_circle img{
        width: 80px;
    }
    .flow_arrow{
        transform: none;
        width: 100%;
        flex: none;
        justify-content: center;
    }
    .flow_arrow img{
        width: 30px;
        transform: rotate(90deg);
        margin: 0 auto;
    }
}

/* plan
-------------------------------*/
.plan{
    position: relative;
    padding: 96px 0;
    background: #fff;
}
.plan .wrapper{
    position: relative;
}
.plan_box{
    position: relative;
    width: min(1100px, 100%);
    margin: 48px auto 0;
    border: 3px solid #00AECB;
    border-top: 15px solid #00AECB;
    border-radius: 14px;
    padding: 68px 56px 44px;
    background: #fff;
    overflow: hidden;
}
.plan_price{
    align-items: center;
    text-align: center;
}
.plan_line{
    border: 0;
    height: 2px;
    background: rgba(0,0,0,.08);
    margin: 30px 0 0;
}
.plan_note{
    margin: 22px 0 0;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    color: #7B848A;
}
.plan .bg_dots-left{
    top: 35%;
}
.plan .bg_dots-right{
    top:85%;
}
@media (max-width: 1024px){
    .plan{
        padding: 72px 0;
    }
    .plan_box{
        width: min(720px, 92vw);
        padding: 46px 22px 34px;
    }
    .plan_note{
        font-size: 16px;
        line-height: 1.7;
    }
}

/* お問い合わせ
-------------------------------*/
.contact_wrap {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
}
.contact_wrap label {
    font-size: min(4.26666vw , 20px);
}
.form_l {
    background-color: #fff;
    border: 2px solid #DDDDDD;
    border-radius: 8px;
    padding: min(3.2vw , 22px);
    display: block;
    width: 100%;
    font-size: min(4.26666vw , 20px);
}
.form_select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    background: url(../img/arrow.svg) no-repeat right 12px center;
    background-size: 12px;
    border: 2px solid #DDDDDD;
    border-radius: 8px;
    padding: min(3.2vw , 22px);
    padding-right: 28px;
    display: block;
    color: inherit;
    font-size: min(4.26666vw , 20px);
}
.form_checkbox {
    position: relative;
}
.form_checkbox input {
        position: absolute;
        z-index: -1;
}
.form_checkbox label {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
}
.form_checkbox label::before {
    content: "";
    width: 32px;
    height: 32px;
    border: 2px solid #999;
    border-radius: 4px;
    background-color: #fff;
    flex: none;
}
.form_checkbox label::after {
    border-right: 4px solid #E63556;
    border-bottom: 4px solid #E63556;
    content: '';
    display: block;
    height: 28px;
    width: 16px;
    left: 8px;
    margin-top: -7px;
    position: absolute;
    transform: rotate(45deg);
    opacity: 0;
}
.form_checkbox input[type=checkbox]:checked + label::after {
    opacity: 1;
}
.policy {
    background: #fff;
    border: 1px solid #ddd;
    padding: 12px;
    max-height: 320px;
    overflow: auto;
}
.btn {
    background-color: #E63556;
    border-radius: 8px;
    color: #fff;
    padding: min(4.26666vw , 28px) 16px;
    text-align: center;
    display: inline-block;
    text-decoration: none;
    border: 0;
    transition: 0.3s;
    cursor: pointer;
    letter-spacing: 0.15rem;
}
.btn:hover{
    filter: brightness(.9); 
}
.btn-block {
    width: 100%;
}
.contact_checks{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 20px;
}
.contact_check{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    line-height: 1.4;
}
.contact_check input{
    width: 15px;
    height: 15px;
    cursor: pointer;
}
.contact_check span{
    user-select: none;
}
.required {
    display: inline-block;
    border: 2px solid;
    color: #CC2828;
    border-radius: 20px;
    font-size: min(3.2vw , 20px);
    padding: 4px 8px;
    line-height: 1;
    margin-left: 8px;
}

/* complete html
-------------------------------*/
.complete_header{
	background: #E63556;
	text-align: center;
	font-size: 24px;
	padding: 1em 0 1em;
}
.complete_header>h2{
	max-width: none;
}
.complete_header>h2>a{
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}
.complete_logo{
    margin-top: 20px;
}
.complete_main{
	max-width: 1000px;
	margin: 0 auto;
}
.complete_area{
	max-width: 700px;
	margin: 2em auto;
	background: #fff;
	padding: 2em;
}
.complete_area h2{
	text-align: center;
	font-size: 2rem;
	font-weight: bold;
	padding-bottom: 1em;
}
.complete_text>p{
	margin-bottom: 1em;
}
.complete_btn{
    text-align: center;
}
@media (max-width: 1024px){
    .complete_logo{
        height: 32px;
        width: auto;
    }
}

.footer{
    background-color: #E63556;
}
.footer p{
    color: 
        #FFFFFF;
}

/* アニメーション
-------------------------------*/
.fadeup {
  opacity: 0;
  transform: translateY(48px);

  animation-name: fadeUp;
  animation-duration: 1s;
  animation-timing-function: ease-out;
  animation-fill-mode: both;
  animation-timeline: view();
  animation-range: entry 30% cover 50%;
}
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(48px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@supports not (animation-timeline: view()) {
  .fadeup {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .fadeup {
    animation: none;
    opacity: 1;
    transform: none;
  }
}