@charset "UTF-8";
@layer foundation,layout,component,project,utility;
@layer foundation{
    *,:after,:before{
        background-repeat:no-repeat;
        box-sizing:border-box
    }
    :after,:before{
        text-decoration:inherit;
        vertical-align:inherit
    }
    :where(:root){
        cursor:default;
        line-height:1.5;
        overflow-wrap:break-word;
        tab-size:4;
        -webkit-tap-highlight-color:transparent;
        -webkit-text-size-adjust:100%;
        -moz-text-size-adjust:100%;
        text-size-adjust:100%
    }
    :where(body){
        margin:0
    }
    :where(h1){
        font-size:2em;
        margin:.67em 0
    }
    :where(dl,ol,ul) :where(dl,ol,ul){
        margin:0
    }
    :where(hr){
        color:inherit;
        height:0
    }
    :where(nav) :where(ol,ul){
        list-style-type:none;
        padding:0
    }
    :where(nav li):before{
        content:"​";
        float:left
    }
    :where(pre){
        font-family:monospace,monospace;
        font-size:1em;
        overflow:auto
    }
    :where(abbr[title]){
        text-decoration:underline;
        -webkit-text-decoration:underline dotted;
        text-decoration:underline dotted
    }
    :where(b,strong){
        font-weight:bolder
    }
    :where(code,kbd,samp){
        font-family:monospace,monospace;
        font-size:1em
    }
    :where(small){
        font-size:80%
    }
    :where(audio,canvas,iframe,img,svg,video){
        vertical-align:middle
    }
    :where(iframe){
        border-style:none
    }
    :where(svg:not([fill])){
        fill:currentColor
    }
    :where(table){
        border-collapse:collapse;
        border-color:currentColor;
        text-indent:0
    }
    :where(button,input,select){
        margin:0
    }
    :where(button,[type=button i],[type=reset i],[type=submit i]){
        -webkit-appearance:button
    }
    :where(fieldset){
        border:1px solid #a0a0a0
    }
    :where(progress){
        vertical-align:initial
    }
    :where(textarea){
        margin:0;
        resize:vertical
    }
    :where([type=search i]){
        -webkit-appearance:textfield;
        outline-offset:-2px
    }
    ::-webkit-inner-spin-button,::-webkit-outer-spin-button{
        height:auto
    }
    ::-webkit-input-placeholder{
        color:inherit;
        opacity:.54
    }
    ::-webkit-search-decoration{
        -webkit-appearance:none
    }
    ::-webkit-file-upload-button{
        -webkit-appearance:button;
        font:inherit
    }
    :where(dialog){
        background-color:#fff;
        border:solid;
        color:#000;
        height:fit-content;
        left:0;
        margin:auto;
        padding:1em;
        position:absolute;
        right:0;
        width:fit-content
    }
    :where(dialog:not([open])){
        display:none
    }
    :where(details>summary:first-of-type){
        display:list-item
    }
    :where([aria-busy=true i]){
        cursor:progress
    }
    :where([aria-disabled=true i],[disabled]){
        cursor:not-allowed
    }
    :where([aria-hidden=false i][hidden]){
        display:initial
    }
    :where([aria-hidden=false i][hidden]:not(:focus)){
        clip:rect(0,0,0,0);
        position:absolute
    }
    :root{
        --vw:1vw;
        --vh:1vh;
        --leading-trim: calc(.5em - .5lh) ;
        --leading-trim-en: calc(.5cap - .5lh) ;
        --color-white:#fff;
        --color-black:#000;
        --color-transparent:#0000;
        --color-text-base:#1f2937;
        --font-family:"Noto Sans JP","Hiragino Kaku Gothic Pro","Meiryo",sans-serif;
        --font-family-en:"Outfit","Roboto","Noto Sans JP","Hiragino Kaku Gothic Pro","Meiryo",sans-serif;
        --font-family-heading:var(--font-family-base);
        --layer-base:0;
        --layer-dropdown:1000;
        --layer-sticky:2000;
        --layer-fixed:3000;
        --layer-modal-backdrop:4000;
        --layer-modal:5000;
        --layer-popover:6000;
        --layer-tooltip:7000;
        --layer-header:8000;
        --layer-toast:9000;
        --duration-standard:.3s;
        --duration-decelerated:.25s;
        --duration-accelerated:.2s;
        --duration-emphasized-standard:.5s;
        --duration-emphasized-decelerated:.4s;
        --duration-emphasized-accelerated:.2s;
        --linear:cubic-bezier(0,0,1,1);
        --ease:cubic-bezier(.25,.1,.25,1);
        --ease-in:cubic-bezier(.42,0,1,1);
        --ease-out:cubic-bezier(0,0,.58,1);
        --ease-in-out:cubic-bezier(.42,0,.58,1);
        --ease-in-sine:cubic-bezier(.47,0,.745,.715);
        --ease-out-sine:cubic-bezier(.39,.575,.565,1);
        --ease-in-out-sine:cubic-bezier(.445,.05,.55,.95);
        --ease-in-quad:cubic-bezier(.55,.085,.68,.53);
        --ease-out-quad:cubic-bezier(.25,.46,.45,.94);
        --ease-in-out-quad:cubic-bezier(.455,.03,.515,.955);
        --ease-in-cubic:cubic-bezier(.55,.055,.675,.19);
        --ease-out-cubic:cubic-bezier(.215,.61,.355,1);
        --ease-in-out-cubic:cubic-bezier(.645,.045,.355,1);
        --ease-in-quart:cubic-bezier(.895,.03,.685,.22);
        --ease-out-quart:cubic-bezier(.165,.84,.44,1);
        --ease-in-out-quart:cubic-bezier(.77,0,.175,1);
        --ease-in-quint:cubic-bezier(.755,.05,.855,.06);
        --ease-out-quint:cubic-bezier(.23,1,.32,1);
        --ease-in-out-quint:cubic-bezier(.86,0,.07,1);
        --ease-in-expo:cubic-bezier(.95,.05,.795,.035);
        --ease-out-expo:cubic-bezier(.19,1,.22,1);
        --ease-in-out-expo:cubic-bezier(1,0,0,1);
        --ease-in-circ:cubic-bezier(.6,.04,.98,.335);
        --ease-out-circ:cubic-bezier(.075,.82,.165,1);
        --ease-in-out-circ:cubic-bezier(.785,.135,.15,.86);
        --ease-in-back:cubic-bezier(.6,-.28,.735,.045);
        --ease-out-back:cubic-bezier(.175,.885,.32,1.275);
        --ease-in-out-back:cubic-bezier(.68,-.55,.265,1.55);
        --ease-standard:cubic-bezier(.4,0,.2,1);
        --ease-decelerated:cubic-bezier(0,0,.2,1);
        --ease-accelerated:cubic-bezier(.4,0,1,1);
        --ease-emphasized-standard:cubic-bezier(.2,0,0,1);
        --ease-emphasized-decelerated:cubic-bezier(.05,.7,.1,1);
        --ease-emphasized-accelerated:cubic-bezier(.4,0,.6,1)
    }
    @keyframes fade-in{
        0%{
            opacity:0
        }
        to{
            opacity:1
        }
    }
    @keyframes fade-out{
        0%{
            opacity:1
        }
        to{
            opacity:0
        }
    }
    @keyframes slide-up{
        0%{
            opacity:0;
            transform:translateY(20px)
        }
        to{
            opacity:1;
            transform:translateY(0)
        }
    }
    @keyframes slide-down{
        0%{
            opacity:0;
            transform:translateY(-20px)
        }
        to{
            opacity:1;
            transform:translateY(0)
        }
    }
    @keyframes slide-left{
        0%{
            opacity:0;
            transform:translate(20px)
        }
        to{
            opacity:1;
            transform:translate(0)
        }
    }
    @keyframes slide-right{
        0%{
            opacity:0;
            transform:translate(-20px)
        }
        to{
            opacity:1;
            transform:translate(0)
        }
    }
    @keyframes zoom-in{
        0%{
            opacity:0;
            transform:scale(.95)
        }
        to{
            opacity:1;
            transform:scale(1)
        }
    }
    @keyframes zoom-out{
        0%{
            opacity:1;
            transform:scale(1)
        }
        to{
            opacity:0;
            transform:scale(.95)
        }
    }
    @keyframes spin{
        0%{
            transform:rotate(0)
        }
        to{
            transform:rotate(1turn)
        }
    }
    @keyframes floating{
        0%{
            transform:translateY(0) rotate(0)
        }
        50%{
            transform:translateY(-28px) rotate(1deg)
        }
        to{
            transform:translateY(0) rotate(0)
        }
    }
    *,:after,:before{
        margin:0
    }
    :where(html){
        font-size:16px;
        height:100%;
        min-width:390px;
        width:100%;
        -webkit-tap-highlight-color:transparent;
        -webkit-font-smoothing:subpixel-antialiased;
        -moz-osx-font-smoothing:auto;
        scrollbar-gutter:stable
    }
    :where(body){
        background-color:#e5263f;
        color:var(--color-text-base);
        font-family:var(--font-family);
        font-size:clamp(14px,calc(var(--vw)*.17873 + 13.29759px),16px);
        line-height:1.6;
        min-height:100%;
        padding:0;
        width:100%;
        word-break:break-all
    }
    :where(main){
        overflow-x:hidden
    }
    :where(h1,h2,h3,h4,h5,h6){
        font-size:1em;
        font-weight:inherit
    }
    :where(i,cite,em,address,dfn){
        font-style:normal
    }
    :where(a){
        color:inherit;
        text-decoration:none
    }
    :where(ul,ol){
        list-style:none;
        padding:0
    }
    :where(iframe,img,input,video,select,textarea){
        height:auto;
        max-width:100%
    }
    :where(small){
        font-size:100%
    }
    :where(input,select,textarea){
        background-color:initial;
        border:1px solid WindowFrame;
        color:inherit;
        font:inherit;
        letter-spacing:inherit;
        padding:.25em .5em
    }
    :where(input,textarea){
        outline:none
    }
    :where(select){
        appearance:none;
        border-radius:0
    }
    :where(select[multiple]){
        background-image:none
    }
    :where(input[type=text]){
        line-height:normal
    }
    :where([type=text]::-ms-clear){
        visibility:hidden
    }
    :where([type=password]::-ms-reveal){
        visibility:hidden
    }
    :where([type=number]::-webkit-inner-spin-button),:where([type=number]::-webkit-outer-spin-button){
        appearance:none
    }
    :where(fieldset){
        border:0;
        min-width:auto;
        padding:0
    }
    :where(legend){
        display:block
    }
    :where([type=color i],[type=range i]){
        border-width:0;
        padding:0
    }
    :where(button,input[type=submit]){
        appearance:none;
        background:none;
        border:none;
        color:inherit;
        cursor:pointer;
        font:inherit;
        letter-spacing:inherit;
        line-height:inherit;
        outline:none;
        padding:0
    }
    input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{
        -webkit-appearance:none
    }
    :where(input[type=number]){
        -moz-appearance:textfield
    }
    :where([aria-disabled=true]),:where([disabled]){
        cursor:not-allowed
    }
}
@layer layout{
    .l-wrapper{
        display:flex;
        flex-direction:column;
        min-height:100vh
    }
    .l-main{
        flex:1;
        max-width:100%;
        overflow-x:hidden
    }
    @supports (overflow-x:clip){
        .l-main{
            overflow-x:clip
        }
    }
}
@layer component;
@layer project{
    .p-header{
        display:none
    }
    .p-header__logo{
        height:auto;
        pointer-events:auto;
        width:282px
    }
    .p-header__logo img{
        height:auto;
        width:100%
    }
    .p-front{
        height:100%;
        position:relative;
        width:100%
    }
    .p-front__main{
        height:auto;
        left:0;
        margin:auto;
        overflow:hidden;
        position:absolute;
        right:0;
        top:0;
        width:100%;
        z-index:2
    }
    .p-front__main img{
        border-bottom-left-radius:80px;
        border-bottom-right-radius:80px;
        height:auto;
        width:100%
    }
    .p-front__mainCard{
        left:0;
        position:absolute;
        right:0;
        top:clamp(621px,calc(var(--vw)*157.86667 + .584px),1213px);
        width:100%
    }
    .p-front__mainCardSlide{
        align-items:center;
        display:flex;
        gap:19px;
        width:100%
    }
    .p-front__mainCardSlide li{
        height:auto;
        min-width:calc(var(--vw)*46.56489);
        width:auto
    }
    .p-front__mainCardSlide li img{
        border-radius:4px;
        height:auto;
        width:100%
    }
    .p-front__mainStep{
        bottom:clamp(1520px,calc(var(--vw)*386.93333 - .648px),2971px);
        left:0;
        position:absolute;
        right:0;
        width:100%
    }
    .p-front__mainStepSlide{
        overflow-x:auto;
        scrollbar-width:none;
        width:100%;
        -ms-overflow-style:none;
        align-items:center;
        display:inline-flex;
        gap:16px;
        padding:0 clamp(71px,calc(var(--vw)*17.86667 + .784px),138px);
        pointer-events:auto
    }
    .p-front__mainStepSlide::-webkit-scrollbar{
        display:none
    }
    .p-front__mainStepSlide li{
        height:auto;
        min-width:calc(var(--vw)*63.35878);
        width:auto
    }
    .p-front__mainStepSlide li img{
        border-radius:16px;
        height:auto;
        width:100%
    }
    .p-front__cont{
        display:none
    }
    .p-front__copyright{
        bottom:0;
        height:122px;
        margin:auto;
        position:absolute;
        right:clamp(80px,calc(var(--vw)*25.78125 - 118px),146px);
        top:0;
        width:15px
    }
    .p-front__copyright img{
        height:auto;
        width:100%
    }
    .p-front__circle{
        animation:spin 100s linear infinite;
        display:none;
        will-change:transform
    }
    .p-front__circle img{
        height:auto;
        width:100%
    }
    .p-front__box{
        left:clamp(20px,calc(var(--vw)*17.96875 - 118px),66px);
        position:absolute;
        top:50%;
        transform:translateY(-50%);
        width:auto
    }
    .p-front__boxHead{
        display:none
    }
    .p-front__boxHeadVis{
        width:auto
    }
    .p-front__boxHeadVis img{
        border-radius:16px;
        height:auto;
        width:100%
    }
    .p-front__boxHeadBtn{
        align-items:center;
        display:inline-flex;
        flex-direction:column;
        gap:8px;
        width:auto
    }
    .p-front__boxHeadBtn span{
        display:block;
        height:auto;
        width:276px
    }
    .p-front__boxHeadBtn span img{
        height:auto;
        width:100%
    }
    .p-front__boxHeadBtn ul{
        align-items:center;
        display:flex;
        gap:16px
    }
    .p-front__boxHeadBtn ul li{
        height:auto;
        width:162px
    }
    .p-front__boxHeadBtn ul li img{
        height:auto;
        width:100%
    }
    .p-front__boxFoot{
        align-items:center;
        display:inline-flex;
        flex-direction:column;
        gap:16px;
        width:auto
    }
    .p-front__boxFootName{
        height:auto;
        width:clamp(145px,calc(var(--vw)*14.84375 + 31px),183px)
    }
    .p-front__boxFootName img{
        height:auto;
        width:100%
    }
    .p-front__boxFootSns{
        align-items:center;
        display:flex;
        flex-direction:column;
        gap:16px
    }
    .p-front__boxFootSns li{
        height:50px;
        width:50px
    }
    .p-front__boxFootSns li img{
        height:auto;
        width:100%
    }
    .p-front__cloud{
        animation:floating 5s ease-in-out infinite;
        display:block;
        height:auto;
        position:absolute;
        z-index:-1
    }
    .p-front__cloud img{
        height:auto;
        opacity:.13;
        width:100%
    }
    .p-front__cloud--1{
        left:calc(var(--vw)*-.99206);
        top:calc(var(--vw)*6.34921);
        width:calc(var(--vw)*23.34656)
    }
    .p-front__cloud--2{
        animation-delay:.2s;
        bottom:calc(var(--vw)*-13.49206);
        left:calc(var(--vw)*-2.24868);
        width:calc(var(--vw)*31.21693)
    }
    .p-front__cloud--3{
        right:calc(var(--vw)*-8.13492);
        top:calc(var(--vw)*9.52381);
        width:calc(var(--vw)*28.24074)
    }
    .p-front__cloud--4{
        animation-delay:.4s;
        right:calc(var(--vw)*35.3836);
        top:calc(var(--vw)*34.8545);
        width:calc(var(--vw)*20.43651)
    }
    .p-front__cloud--5{
        animation-delay:.3s;
        bottom:calc(var(--vw)*-13.0291);
        right:calc(var(--vw)*-6.74603);
        width:calc(var(--vw)*26.25661)
    }
    @media print and (width>=768px),screen and (width>=768px){
        .p-front__main{
            filter:drop-shadow(1px 4px 40px rgba(0,0,0,.16));
            padding:44px 0;
            width:393px
        }
        .p-front__main img{
            border-radius:34px
        }
        .p-front__mainCard{
            top:665px
        }
        .p-front__mainCardSlide li{
            min-width:183px
        }
        .p-front__mainStep{
            bottom:1564px
        }
        .p-front__mainStepSlide{
            padding:0 71px
        }
        .p-front__mainStepSlide li{
            min-width:249px
        }
        .p-front__cont{
            display:block;
            height:100vh;
            inset:0;
            margin:auto;
            overflow:hidden;
            position:fixed;
            width:100%;
            z-index:1
        }
    }
    @media print and (width>=1024px),screen and (width>=1024px){
        .p-header{
            display:block;
            height:auto;
            left:0;
            margin:auto;
            padding:32px;
            pointer-events:none;
            position:fixed;
            right:0;
            top:0;
            width:100%
        }
        .p-front__main{
            left:auto;
            right:clamp(64px,calc(var(--vw)*28.89344 - 231.86885px),205px)
        }
        .p-front__copyright{
            bottom:auto;
            right:clamp(24px,calc(var(--vw)*11.27049 - 91.40984px),79px);
            top:44px
        }
        .p-front__circle{
            display:block;
            height:calc(var(--vw)*70.83333);
            position:absolute;
            right:clamp(-118px,calc(var(--vw)*7.17213 - 191.44262px),-83px);
            top:40.8759124088vh;
            width:calc(var(--vw)*70.83333)
        }
        .p-front__box{
            bottom:0;
            gap:120px;
            height:100%;
            margin:auto 0;
            top:0;
            transform:translateY(0);
            width:clamp(560px,calc(var(--vw)*65.57377 - 111.47541px),880px)
        }
        .p-front__box,.p-front__boxHead{
            align-items:center;
            display:inline-flex;
            flex-direction:column;
            left:0
        }
        .p-front__boxHead{
            gap:32px;
            position:absolute;
            right:0;
            top:21.2721584984vh;
            width:auto
        }
        .p-front__boxFoot{
            bottom:8.9676746611vh;
            left:0;
            position:absolute;
            right:0
        }
        .p-front__boxFootName{
            width:183px
        }
        .p-front__boxFootSns{
            flex-direction:row
        }
    }
    @media print and (width>=1512px),screen and (width>=1512px){
        .p-front__main{
            right:calc(var(--vw)*13.5582)
        }
        .p-front__copyright{
            right:calc(var(--vw)*5.22487)
        }
        .p-front__circle{
            height:1071px;
            right:calc(var(--vw)*-5.48942);
            width:1071px
        }
        .p-front__box{
            width:calc(var(--vw)*58.20106)
        }
        .p-front__cloud--1{
            left:-15px;
            top:96px;
            width:353px
        }
        .p-front__cloud--2{
            bottom:-204px;
            left:-34px;
            width:472px
        }
        .p-front__cloud--3{
            right:-123px;
            top:144px;
            width:427px
        }
        .p-front__cloud--4{
            right:535px;
            top:527px;
            width:309px
        }
        .p-front__cloud--5{
            bottom:-197px;
            right:-102px;
            width:397px
        }
    }
}
@layer utility{
    .u-desktopOnly{
        display:none
    }
    .u-visuallyHidden{
        border:0;
        clip:rect(0 0 0 0);
        clip-path:inset(50%);
        height:1px;
        margin:-1px;
        overflow:hidden;
        padding:0;
        position:absolute;
        white-space:nowrap;
        width:1px
    }
    .u-leadingTrim:after,.u-leadingTrim:before{
        block-size:1px;
        content:"";
        display:block;
        inline-size:0
    }
    .u-leadingTrim:before{
        margin-block-end:var(--leading-trim)
    }
    .u-leadingTrim:after{
        margin-block-start:var(--leading-trim)
    }
    .u-leadingTrimStart:before{
        margin-block-end:var(--leading-trim)
    }
    .u-leadingTrimEnd:after,.u-leadingTrimStart:before{
        block-size:1px;
        content:"";
        display:block;
        inline-size:0
    }
    .u-leadingTrimEnd:after{
        margin-block-start:var(--leading-trim)
    }
    @media print and (width>=768px),screen and (width>=768px){
        .u-mobileOnly{
            display:none
        }
        .u-desktopOnly{
            display:block
        }
    }
}