@charset "UTF-8";

body{
    font-family: "Noto Sans JP";
}

.header_flex{
    display: flex;
    height: calc(100vw * ( 50 / 1440));
    gap: calc(100vw * ( 40 / 1440));
    justify-content: center;
    align-items: center;
}

.header_logo-all{
    width: calc(100vw * (188 / 1440));
}
.header_logo-Individual{
    width: calc(100vw * (125 / 1440));
}
.header_logo-all img,
.header_logo-Individual img{
    width: 100%;
    height: auto;
}


@media screen and (max-width: 768px) {
    .header_flex{
        height: calc(100vw * (58 / 375));
        gap: calc(100vw * ( 40 / 375));
    }

    .header_logo-all{
        width: calc(100vw * (188 / 375));
    }
    .header_logo-Individual{
        width: calc(100vw * (125 / 375));
    }   
}

/* 1. kv */
.main-label{
    color: #ffffff;
    text-align: center;
    font-weight: 700;
    font-size: calc(100vw * (16 / 1440));
    margin: calc(100vw * (14 / 1440)) auto;
}

.main-img_flex{
    text-align: center;
    background-color: #132E61;
    color: #ffffff;
}
.main-img_flex{
    display: flex;
}
.main-img_flex img{
    width: 100%;
    height: auto;
}
.main-img_area{
    width: calc(100vw * (678 / 1440));
}
.main-img_text-area{
    width: calc(100vw * (538 / 1440));
    padding-top: calc(100vw * (70 / 1440));
    padding-bottom: calc(100vw * (70 / 1440));
    padding-left: calc(100vw * (120 / 1440));
    padding-right: calc(100vw * (104 / 1440));
    background: var(--05, linear-gradient(91deg, #132E61 1.1%, #384F7B 50.16%, #132E61 99.21%));
    box-sizing: content-box;
}
    .main-img_text-title_img{
        width: calc(100vw * (538 / 1440));
        height: calc(100vw * (185 / 1440));
        text-align: center;
    }
.main-img_min_content-area{
    display: grid;
    grid-template-columns: repeat(4, calc(100vw * (119 / 1440)));
    justify-content: center;    
    padding-top: calc(100vw * (22 / 1440));
    padding-bottom: calc(100vw * (0 / 1440));
    padding-left: 0;
    padding-right: 0;
}

.main-img_min_content{
    color: #ffffff;
    text-align: center;
    width: calc(100vw * (125 / 1440));
    height: calc(100vw * (125 / 1440));
    font-size: calc(100vw * (20 / 1440));
    border: solid 1px #ffffff;
    border-radius:  calc(100vw * (62.5 / 1440));
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 140%;
}
.entry_botton{
    display: flex;
    background-color: #FF7A00;
    justify-content: space-between;
    align-items: center;
    border: 2px solid rgba(0, 0, 0, 0.07);
    border-radius: calc(100vw * (36 / 1440));
    margin-top: calc(100vw * (47 / 1440));
    margin-bottom: calc(100vw * (0 / 1440));
    margin-left: calc(100vw * (8 / 1440));
    margin-right: calc(100vw * (8 / 1440));
}
.entry_botton:hover{
    background: #ffa24d;
}
.entry_botton-white{
    background-color: #ffffff;
    color: #FF7A00;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 110%;
    font-weight: 700;

    margin: calc(100vw * (13 / 1440));
    font-size: calc(100vw * (16 / 1440));
    border-radius: calc(100vw * (21 / 1440));
    width: calc(100vw * (88 / 1440));
    height: calc(100vw * (36 / 1440));
}
.entry_botton-text{
    font-size: calc(100vw * (22 / 1440));
}
.entry_botton-text .hiragana{
    font-size: calc(100vw * (17 / 1440));
}
.entry_botton-text .min-text{
    font-size: calc(100vw * (16 / 1440));
}
.entry_botton-arrow{
    margin-right: calc(100vw * (15 / 1440));
}
.entry_botton-text{
    color: #ffffff;
    font-weight: 700;
}
.pc-only .main-img_flex-top{
    width: calc(100vw * (678 / 1440));
}
.pc-only .main-img_flex-left{
    width: calc(100vw * (294 / 1440));
}
.pc-only .main-img_flex-right{
    width: calc(100vw * (384 / 1440));
}

@media screen and (max-width: 768px) {
    .main-label{
        margin: calc(100vw * (14 / 375)) auto;
    }
    .header_flex{
        height: calc(100vw * (50 / 375));
        justify-content: space-between;
        padding-left: calc(100vw * (16 / 375));
        padding-right: calc(100vw * (16 / 375));
    }
    .header_logo-all{
        width: calc(100vw * (136.362 / 375));
        padding-top: calc(100vw * (16 / 375));
        padding-bottom: calc(100vw * (16 / 375));
    }
    .header_logo-all img{
        width: calc(100vw * (136.362 / 375));
    }
    .header_logo-Individual{
        width: calc(100vw * (96 / 375));
        padding-top: calc(100vw * (8.5 / 375));
        padding-bottom: calc(100vw * (8.5 / 375));
    }
    .header_logo-Individual img{
        width: calc(100vw * (96 / 375));
    }
    .main-img_flex-right{
        display: flex;
        width: calc(100vw * (215 / 375));
        justify-content: center;
        align-items: center;
    }
    .main-img_flex-left {
        display: flex;
        width: calc(100vw * (160 / 375));
        font-size: calc(100vw * (14 / 375));
        justify-content: center;
        align-items: center;
        line-height: 140%;
    }
    .main-img_flex img{
        width: 100%;
        height: auto;
    }

    .main-img_text-area{
        width: 100%;
        padding-top: calc(100vw * (0 / 375));
        padding-bottom: calc(100vw * (0 / 375));
        padding-left: calc(100vw * (0 / 375));
        padding-right: calc(100vw * (0 / 375));
        padding: calc(100vw * (36 / 375)) 0;
    }
    .main-img_text-title_img{
        margin: auto;
        width: calc(100vw * (337 / 375));
        height: calc(100vw * (126 / 375));
        text-align: center;
    }
    .main-img_min_content-area{
        margin: calc(100vw * (22 / 375))auto 0;
        grid-template-columns: repeat(4, calc(100vw * (84 / 375)));
    }
    .main-img_min_content{
        width: calc(100vw * (90 / 375));
        height: calc(100vw * (90 / 375));
        font-size: calc(100vw * (14 / 375));
        border-radius:  calc(100vw * (45 / 375));
    }

    .entry_botton{
        width: calc(100vw * (310 / 375));
        margin-top: calc(100vw * (28 / 375));
        margin-bottom: calc(100vw * (0 / 375));
        margin-right: calc(100vw * (37.5 / 375));
        margin-left: calc(100vw * (37.5 / 375));
        border-radius: calc(100vw * (36 / 375));
    }
    .entry_botton-white{
        margin: calc(100vw * (5 / 375));
        font-size: calc(100vw * (14 / 375));
        border-radius: 50%;
        width: calc(100vw * (58 / 375));
        height: calc(100vw * (58 / 375));
    }
    .entry_botton-text{
        font-size: calc(100vw * (18 / 375));
    }
    .entry_botton-text .hiragana{
        font-size: calc(100vw * (16 / 375));
    }
    .entry_botton-text .min-text{
        font-size: calc(100vw * (14 / 375));
    }
    .entry_botton-arrow{
        margin-right: calc(100vw * (15 / 375));
    }

}

@media (min-width: 500px) and (max-width: 1280px) {
    .main-img_text-title_img {
        height: calc(100vw * (70 / 375));
    }
}

/* 2. solutions-section */
.solutions-section{
    margin-top: calc(100vw * (84 / 1440));
    margin-bottom: calc(100vw * (120 / 1440));
}
.solutions-section .section-title{
    width: calc(100vw * (700 / 1440));
    color: #132E61;
    text-align: center;
    font-size: calc(100vw * (40 / 1440));
    font-weight: 400;
    line-height: 160%;
    letter-spacing: calc(100vw * (2.4 / 1440));
    margin-bottom: calc(100vw * (16 / 1440));
    margin-left: auto;
    margin-right: auto;
}
.step-line{
    width: calc(100vw * (700 / 1440));
    margin-left: auto;
    margin-right: auto;
}

.solutions-grid{
    display: grid;
    grid-template-columns: repeat(2, calc(100vw * (469 / 1440)));
    gap: calc(100vw * (32 / 1440));
    margin-top: calc(100vw * (48 / 1440));
    justify-content: center;
    align-items: center;
}
.solution-item{
    width: calc(100vw * (469 / 1440));
    border-radius: calc(100vw * (10 / 1440));
    border: 1px solid #132E61;
    overflow: hidden;
}
.solution-title{
    color: #ffffff;
    text-align: center;
    background: linear-gradient(91deg, #132E61 1.1%, #384F7B 50.16%, #132E61 99.21%);
    padding: calc(100vw * (16 / 1440));
    font-size: calc(100vw * (24 / 1440));
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}
.solution-box{
    padding: calc(100vw * (24 / 1440)) calc(100vw * (16 / 1440));
}
.solution-box_label_before{
    background-color: #D1D1D1;
    color: #333;
    text-align: center;
    font-size: calc(100vw * (14 / 1440));
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}
.solution-before{
    display: flex;
    align-items: center;
    margin-top: calc(100vw * (14.5 / 1440));
}
.solution-before .icon{
    width: calc(100vw * (70 / 1440));
    min-width: calc(100vw * (70 / 1440));
    height: calc(100vw * (70 / 1440));
    margin-right: calc(100vw * (8 / 1440));
}
.solution-before p{
    color: #333;
    font-size: calc(100vw * (16 / 1440));
    font-weight: 500;
    line-height: 160%;
}
.solutions-arrow{
    width:  100%;
    margin: calc(100vw * (16 / 1440)) auto;
}
.solution-box_label_after{
    background-color: #D6DCE7;
    color: #132E61;
    text-align: center;
    font-size: calc(100vw * (14 / 1440));
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}
.solution-after{
    margin-top: calc(100vw * (9 / 1440));
}
.solution-after p{
    color: #132E61;
    text-align: center;
    font-size: calc(100vw * (18 / 1440));
    font-weight: 500;
    line-height: 160%;
}

@media screen and (max-width: 768px) {
    .solutions-section{
        margin-top: calc(100vw * (64 / 375));
        margin-bottom: calc(100vw * (80 / 375));
    }
    .solutions-section .section-title{
        width: calc(100vw * (285 / 375));
        font-size: calc(100vw * (29 / 375));
        letter-spacing: calc(100vw * (1.8 / 375));
        margin-bottom: calc(100vw * (16 / 375));
    }
    .step-line{
        width: 100%;
        max-width: 279px;
        margin: 0 auto calc(100vw * (32 / 375)) auto;
    }


    .solutions-grid{
        display: grid;
        grid-template-columns: repeat(1, calc(100vw * (345 / 375)));
        gap: calc(100vw * (32 / 375));
        margin-top: calc(100vw * (32 / 1440));
    }
    .solution-item{
        width: calc(100vw * (345 / 375));
        border-radius: calc(100vw * (10 / 375));
    }
    .solution-title{
        padding: calc(100vw * (16 / 375));
        font-size: calc(100vw * (24 / 375));
    }
    .solution-box{
        padding: calc(100vw * (24 / 375)) calc(100vw * (16 / 375));
    }
    .solution-box_label_before{
        font-size: calc(100vw * (14 / 375));
    }
    .solution-before{
        margin-top: calc(100vw * (9 / 375));
    }
    .solution-before .icon{
        width: calc(100vw * (70 / 375));
        min-width: calc(100vw * (70 / 375));
        height: calc(100vw * (70 / 375));
        margin-right: calc(100vw * (8 / 375));
    }
    .solution-before p{
        font-size: calc(100vw * (16 / 375));
    }
    .solutions-arrow{
        width:  100%;
        margin: calc(100vw * (16 / 375)) auto;
    }
    .solution-box_label_after{
        font-size: calc(100vw * (14 / 375));
    }
    .solution-after{
        margin-top: calc(100vw * (9 / 375));
    }
    .solution-after p{
        color: #132E61;
        font-size: calc(100vw * (18 / 375));
    }
}

/* 3. solutions-section */
.features-section{
    background-color: #132E61;
    margin: auto;
    padding: calc(100vw * (120 / 1440)) 0;
}
.features-section .section-title{
    text-align: center;
    color: #ffffff;
    width: calc(100vw * (670 / 1440));
    margin:0 auto calc(100vw * (64 / 1440));
    padding: calc(100vw * (32 / 1440)) 0 calc(100vw * (40 / 1440));
    position: relative;
}
.features-section .section-title::before{
    content: "";
    position: absolute;
    display: block;
    width: calc(100vw * (81 / 1440));
    height: calc(100vw * (51 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='81' height='51' viewBox='0 0 81 51' fill='none'%3e%3cpath d='M80.5 0.5L0.5 50.5' stroke='%23A8D414' stroke-linecap='round'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    left: 0;
    top: 0;
    background-size: cover;
}
.features-section .section-title::after{
    content: "";
    position: absolute;
    display: block;
    width: calc(100vw * (81 / 1440));
    height: calc(100vw * (51 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='81' height='51' viewBox='0 0 81 51' fill='none'%3e%3cpath d='M80.5 0.5L0.5 50.5' stroke='%23A8D414' stroke-linecap='round'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    right: 0;
    bottom: 0;
    background-size: cover;
}

.section-title_sub{
    font-size: calc(100vw * (18 / 1440));
    font-weight: 500;
    line-height: 160%;
    letter-spacing: calc(100vw * (1.08 / 1440));
}
.section-title_main{
    font-size: calc(100vw * (56 / 1440));
    font-weight: 400;
    line-height: 120%;
    letter-spacing: calc(100vw * (3.36 / 1440));
}
.section-title_main span{
    font-family: "Noto Serif JP";
    font-size: calc(100vw * (72 / 1440));
    letter-spacing: calc(100vw * (4.32 / 1440));
}
.features-flex{
    display: grid;
    grid-template-columns: repeat(3, calc(100vw * (307 / 1440)));
    gap: calc(100vw * (32 / 1440));
    justify-content: center;
}
.feature-card{
    border-radius: calc(100vw * (6 / 1440));
    border-top: 4px solid #A8D414;
    background: #FFF;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    flex: 1 0 0;
    padding: calc(100vw * (32 / 1440)) calc(100vw * (24 / 1440));
    gap: calc(100vw * (24 / 1440));
}
.feature-card_side-line{
    border-left: 1px solid #132E61;
    padding-left: calc(100vw * (20 / 1440));
}
.feature-num{
    color: #132E61;
    font-family: "Noto Serif JP";
    font-size: calc(100vw * (14 / 1440));
    font-weight: 400;
    line-height: 150%;
    letter-spacing: calc(100vw * (0.56 / 1440));
}
.feature-title{
    color: #132E61;
    font-size: calc(100vw * (24 / 1440));
    font-weight: 400;
    line-height: 140%;
    letter-spacing: calc(100vw * (1.44 / 1440));
}
.feature-img{
    width: 100%;
    height: auto;
}
.feature-desc{
    color: #333;
    font-size: calc(100vw * (16 / 1440));
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
}

@media screen and (max-width: 768px) {
    .features-section{
        margin: auto;
        padding: calc(100vw * (64 / 375)) 0 calc(100vw * (80 / 375));
    }
    .features-section .section-title{
        width: calc(100vw * (345 / 375));
        margin-bottom: calc(100vw * (40 / 375));
        padding: calc(100vw * (32 / 375)) 0 calc(100vw * (40 / 375));
    }
    .features-section .section-title::before{
        width: calc(100vw * (80 / 375));
        height: calc(100vw * (50 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='81' height='51' viewBox='0 0 81 51' fill='none'%3e%3cpath d='M80.5 0.5L0.5 50.5' stroke='%23A8D414' stroke-linecap='round'/%3e%3c/svg%3e");
    }
    .features-section .section-title::after{
        width: calc(100vw * (80 / 375));
        height: calc(100vw * (50 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='81' height='51' viewBox='0 0 81 51' fill='none'%3e%3cpath d='M80.5 0.5L0.5 50.5' stroke='%23A8D414' stroke-linecap='round'/%3e%3c/svg%3e");
    }
    .section-title_sub{
        font-size: calc(100vw * (14 / 375));
        font-weight: 500;
        line-height: 160%;
        letter-spacing: calc(100vw * (0.84 / 375));
    }
    .section-title_main{
        font-size: calc(100vw * (42 / 375));
        font-weight: 400;
        line-height: 120%;
        letter-spacing: calc(100vw * (2.52 / 375));
        margin-top: calc(100vw * (8 / 375));
    }
    .section-title_main span{
        font-size: calc(100vw * (64 / 375));
        letter-spacing: calc(100vw * (3.84 / 375));
    }
    .features-flex{
        display: grid;
        grid-template-columns: repeat(1, calc(100vw * (297 / 375)));
        gap: calc(100vw * (32 / 375));
    }
    .feature-card{
        border-radius: calc(100vw * (6 / 375));
        padding: calc(100vw * (32 / 375)) calc(100vw * (24 / 375));
        gap: calc(100vw * (24 / 375));
    }
    .feature-card_side-line{
        padding-left: calc(100vw * (20 / 375));
    }
    .feature-num{
        font-size:  calc(100vw * (14 / 375));
        letter-spacing:  calc(100vw * (0.56 / 375));
    }
    .feature-title{
        font-size:  calc(100vw * (24 / 375));
        letter-spacing:  calc(100vw * (1.44 / 375));
    }
    .feature-desc{
        color: #333;
        font-size: calc(100vw * (16 / 375));
        font-style: normal;
        font-weight: 500;
        line-height: 160%;
    }
}

/* 4.tool-section */
.tool-section{
    color: #FFF;
    background-color: #132E61;
    position: relative;
    padding: calc(100vw * (0 / 1440)) 0 calc(100vw * (120 / 1440));
}
.tool-section::before{
    content: '';
    position: absolute;
    background-image: url(/camp/insurance_33/img/point_deco01_pc.svg);
    background-repeat: no-repeat;
    width: calc(100vw * (454 / 1440));
    height: calc(100vw * (754 / 1440));
    bottom: 0;
    left: 0;
}
.tool-section::after{
    content: '';
    position: absolute;
    background-image: url(/camp/insurance_33/img/point_deco02_pc.svg);
    background-repeat: no-repeat;
    width: calc(100vw * (400 / 1440));
    height: calc(100vw * (624 / 1440));
    bottom: 0;
    right: 0;
}
.tool-section .container{
    position: relative;
    border: 1px solid #FFF;
    width: calc(100vw * (840 / 1440));
    margin: auto;
    padding: calc(100vw * (40 / 1440));
    box-sizing: content-box;
}
.text-wrap{
    position: absolute;
    text-align: center;
    background-color: #132E61;
    width: calc(100vw * (280 / 1440));
    padding: calc(100vw * (5 / 1440));
    top: calc(100vw * (13 / 1440) * -1);
    left: 0;
    right: 0;
    margin-inline: auto;
}
.tool-section .section-title{
    margin-bottom: calc(100vw * (40 / 1440));
}
.tool-section .section-title-sub{
    color: #FFF;
    text-align: center;
    font-size: calc(100vw * (24 / 1440));
    font-weight: 400;
    line-height: 150%;
}
.tool-section .section-title-main{
    color: #FFF;
    text-align: center;
    font-size: calc(100vw * (32 / 1440));
    font-weight: 400;
    line-height: 150%;
}
@media screen and (max-width: 768px) {
    .tool-section{
        padding: calc(100vw * (0 / 375)) 0 calc(100vw * (80 / 375));
    }
    .tool-section::before{
        content: '';
        position: absolute;
        background-image: url(/camp/insurance_33/img/point_deco_sp.svg);
        width: calc(100vw * (375 / 375));
        height: calc(100vw * (265 / 375));
        bottom: 0;
        left: 0;
    }
    .tool-section .container{
        position: relative;
        border: 1px solid #FFF;
        width: calc(100vw * (315 / 375));
        margin: auto;
        padding: calc(100vw * (32 / 375)) calc(100vw * (15 / 375));
        box-sizing: content-box;
    }
    .text-wrap{
        position: absolute;
        text-align: center;
        background-color: #132E61;
        width: calc(100vw * (163 / 375));
        padding: calc(100vw * (5 / 375));
        top: calc(100vw * (13 / 375) * -1);
        font-size: calc(100vw * (14 / 375));
        left: 0;
        right: 0;
        box-sizing: content-box;
    }
    .tool-section .section-title{
        margin-bottom: calc(100vw * (24 / 375));
    }
    .tool-section .section-title-sub{
        font-size: calc(100vw * (14 / 375));
        line-height: 150%;
    }
    .tool-section .section-title-main{
        font-size: calc(100vw * (22 / 375));
        line-height: 150%;
    }
    
}

@media (min-width: 769px) and (max-width: 938px) {
    .tool-section .container {
        padding: calc(100vw * (75 / 1440));
    }
}

/* 4.tool-section youtube */
.custom-youtube {
    width: calc(100vw * (840 / 1440));
    height: calc(100vw * (468 / 1440));
    display: block;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .custom-youtube {
        width: calc(100vw * (305 / 375));
        height: calc(100vw * (170 / 375));
    }
}


/* 5.flow-section */
.flow-section{
    display: flex;
    padding: calc(100vw * (80 / 1440)) 0;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    background-color: #F3F3F3;
}
.flow-section .section-title{
    color: #132E61;
    text-align: center;
    font-family: "Noto Sans JP";
    font-style: normal;
    width: calc(100vw * (430 / 1440));
    height: calc(100vw * (56 / 1440));
    margin: 0 auto 0;
    padding: calc(100vw * (32 / 1440)) 0 calc(100vw * (40 / 1440));
    font-weight: 400;
    line-height: 140%;
    font-size: calc(100vw * (40 / 1440));
    letter-spacing: calc(100vw * (1.8 / 1440));
    position: relative;
    box-sizing: content-box;
}
.flow-section .section-title::before{
    content: "";
    position: absolute;
    display: block;
    width: calc(100vw * (61 / 1440));
    height: calc(100vw * (39 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    left: 0;
    top: 0;
    background-size: cover;
}
.flow-section .section-title::after{
    content: "";
    position: absolute;
    display: block;
    width: calc(100vw * (61 / 1440));
    height: calc(100vw * (39 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    right: 0;
    bottom: 0;
    background-size: cover;
}

.flow-flex{
    width: calc(100vw * (1130 / 1440));
    display: flex;
    gap: calc(100vw * (37 / 1440));
}
.flow-step{
    width: calc(100vw * (322 / 1440));
    display: flex;
    padding: calc(100vw * (32 / 1440)) calc(100vw * (15 / 1440)) calc(100vw * (24 / 1440));
    margin-top: calc(100vw * (48 / 1440));
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: calc(100vw * (10 / 1440));
    border-radius: calc(100vw * (6 / 1440));
    align-self: stretch;
    position: relative;
    box-sizing: content-box;
    background-color: #ffffff;
    position: relative;
}
.flow-step::after{
    content: "";
    position: absolute;
    margin: auto;top: 50%;
    transform: translateY(-50%);
    right: calc(100vw * (25 / 1440) * -1);
    display: block;
    width: calc(100vw * (13 / 1440));
    height: calc(100vw * (24 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='24' viewBox='0 0 13 24' fill='none'%3e%3cpath d='M12.5191 12.2996C12.9201 11.9073 12.9201 11.262 12.5191 10.8697L1.69922 0.287296C1.06612 -0.331911 0 0.116638 0 1.0022L0 22.1671C0 23.0527 1.06612 23.5012 1.69922 22.882L12.5191 12.2996Z' fill='%23D1D1D1'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: contain;
}
.flow-step:last-of-type::after{
    background-image: none;
}
.step-label{
    position: absolute;
    display: flex;
    padding: calc(100vw * (4 / 1440)) calc(100vw * (10 / 1440)) calc(100vw * (3 / 1440));
    justify-content: center;
    align-items: center;
    gap: calc(100vw * (10 / 1440));
    top: 0;
    left: 0;
    border-radius: calc(100vw * (6 / 1440)) 0;
    background: #A8D414;
    color: #132E61;
    text-align: center;    
    font-size: calc(100vw * (14 / 1440));
    font-weight: 400;
    line-height: 160%;
    letter-spacing: calc(100vw * (0.84 / 1440));
}
.flow-step-main{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(100vw * (15 / 1440));
    align-self: stretch;
}
.step-icon{
    width: calc(100vw * (90 / 1440));
    height: calc(100vw * (90 / 1440));
}
.step-icon img{
    width: 100%;
    height: auto;
}
.step-text{
    width: calc(100vw * (220 / 1440));
    color: #132E61;
    gap: calc(100vw * (4 / 1440));
}
.step-title{
    font-size: calc(100vw * (22 / 1440));
    font-weight: 500;
    line-height: 160%;
    margin-bottom: calc(100vw * (5 / 1440));
}
.step-desc{
    color: #333333;
    font-size: calc(100vw * (16 / 1440));
    font-weight: 500;
    line-height: 160%;
}
.note-text{
    color: #6A6A6A;
    font-size:  calc(100vw * (10 / 1440));
    font-weight: 500;
    line-height: 160%;
    position: relative;
    margin-left: calc(100vw * (15 / 1440));
}
.note-text::before{
    position: absolute;
    width: calc(100vw * (10 / 1440));
    height: calc(100vw * (10 / 1440));
    content: "※";
    left: calc(100vw * (15 / 1440) * -1);
    display: block;
}

@media screen and (max-width: 768px) {
    .flow-section{
        padding: calc(100vw * (64 / 375)) calc(100vw * (20 / 375)) calc(100vw * (80 / 375));
    }
    .flow-section .section-title{
        width: calc(100vw * (335 / 375));
        height: calc(100vw * (42 / 375));
        padding: calc(100vw * (32 / 375)) 0  calc(100vw * (40 / 375));
        font-size: calc(100vw * (30 / 375));
        letter-spacing: calc(100vw * (1.8 / 375));
    }
    .flow-section .section-title::before{
        width: calc(100vw * (61 / 375));
        height: calc(100vw * (39 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    }
    .flow-section .section-title::after{
        width: calc(100vw * (61 / 375));
        height: calc(100vw * (39 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    }

    .flow-flex{
        width: calc(100vw * (305 / 375));
        margin: calc(100vw * (40 / 375)) auto 0;
        gap: calc(100vw * (37 / 375));
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .flow-step{
        width: calc(100vw * (305 / 375));
        padding: calc(100vw * (32 / 375)) calc(100vw * (15 / 375)) calc(100vw * (24 / 375));
        gap: calc(100vw * (10 / 375));
        border-radius: calc(100vw * (6 / 375));
        box-sizing: border-box;
        position: relative;
    }
    .flow-step::after{
        content: "";
        position: absolute;
        margin: auto;
        top: auto;
        bottom: calc(100vw * (25 / 375) * -1);
        right: 0;
        left: 0;
        transform: none;
        display: block;
        width: calc(100vw * (24 / 375));
        height: calc(100vw * (13 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='13' viewBox='0 0 24 13' fill='none'%3e%3cpath d='M10.8694 12.5191C11.2616 12.9201 11.907 12.9201 12.2992 12.5191L22.8816 1.69922C23.5009 1.06612 23.0523 0 22.1667 0H1.00184C0.116278 0 -0.332267 1.06612 0.28694 1.69922L10.8694 12.5191Z' fill='%23D1D1D1'/%3e%3c/svg%3e");
        background-repeat: no-repeat;
        background-size: contain;
    }
    .step-label{
        padding: calc(100vw * (4 / 375)) calc(100vw * (10 / 375)) calc(100vw * (3 / 375));
        gap: calc(100vw * (10 / 375));
        border-radius: calc(100vw * (6 / 375)) 0;
        font-size: calc(100vw * (14 / 375));
        letter-spacing: calc(100vw * (0.84 / 375));
    }
    .flow-step-main{
        gap: calc(100vw * (15 / 375));
    }
    .step-icon{
        width: calc(100vw * (90 / 375));
        height: calc(100vw * (90 / 375));
    }
    .step-icon img{
        width: 100%;
        height: auto;
    }
    .step-text{
        width: calc(100vw * (220 / 375));
        gap: calc(100vw * (4 / 375));
    }
    .step-title{
        font-size: calc(100vw * (20 / 375));
        margin-bottom: calc(100vw * (5 / 375));
    }
    .step-desc{
        font-size: calc(100vw * (16 / 375));
    }
    .note-text{
        font-size:  calc(100vw * (10 / 375));
        margin-left: calc(100vw * (15 / 375));
    }
    .note-text::before{
        width: calc(100vw * (10 / 375));
        height: calc(100vw * (10 / 375));
        left: calc(100vw * (15 / 375) * -1);
    }
}


/* 6.faq-section */
.faq-section{
    padding: calc(100vw * (80 / 1440)) 0;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    background-color: #ffffff;
}
.faq-section .section-title{
    color: #132E61;
    text-align: center;
    font-family: "Noto Sans JP";
    font-style: normal;
    width: calc(100vw * (410 / 1440));
    height: calc(100vw * (64 / 1440));
    margin: 0 auto 0;
    padding: calc(100vw * (32 / 1440)) 0 calc(100vw * (40 / 1440));
    font-weight: 400;
    line-height: 140%;
    font-size: calc(100vw * (40 / 1440));
    letter-spacing: calc(100vw * (2.4 / 1440));
    position: relative;
    box-sizing: content-box;
}
.faq-section .section-title::before{
    content: "";
    position: absolute;
    display: block;
    width: calc(100vw * (61 / 1440));
    height: calc(100vw * (39 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    left: 0;
    top: 0;
    background-size: cover;
}
.faq-section .section-title::after{
    content: "";
    position: absolute;
    display: block;
    width: calc(100vw * (61 / 1440));
    height: calc(100vw * (39 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    right: 0;
    bottom: 0;
    background-size: cover;
}
.faq-section .container{
    width: calc(100vw * (970 / 1440));
    margin: 0 auto;
}
.accordion{
    margin-top: calc(100vw * (48 / 1440));
    border-top: 1px solid #ccc;
}
.accordion-item {
    display: flex;
    padding: calc(100vw * (24 / 1440)) calc(100vw * (30 / 1440)); 
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    border-bottom: 1px solid #ccc;
}

.accordion-header {
    background: none;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    padding: 0;
    
    color: #132E61;
    font-size: calc(100vw * (18 / 1440));
    font-weight: 700;
    line-height: 160%;
    position: relative;
    padding-right: calc(100vw * (50 / 1440)); 
    margin-left: calc(100vw * (34 / 1440));
}

.accordion-header::before {
    content: "Q.";
    position: absolute;
    color: #132E61;
    text-align: center;
    font-size: calc(100vw * (24 / 1440));
    font-weight: 500;
    line-height: 120%;
    left: calc(100vw * (34 / 1440) * -1);
    top: 0;
}

.accordion-header::after {
    content: "＋";
    position: absolute;
    right: calc(100vw * (20 / 1440));
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(100vw * (32 / 1440));
    height: calc(100vw * (32 / 1440));
    border-radius: 50%;
    background-color: #132E61;
    color: #fff;
    font-size: calc(100vw * (20 / 1440));
    font-weight: 400;
    line-height: 1;
    transition: all 0.3s ease;
}
.accordion-item.is-active .accordion-header::after {
    content: "－";
}

.accordion-content {
    height: 0;
    overflow: hidden;
    transition: height 0.3s ease-out;
    width: 100%;
    
    color: #333333;
    font-size: calc(100vw * (16 / 1440));
    font-weight: 500;
    line-height: 160%;
    position: relative;
    margin-left: calc(100vw * (27 / 1440));
}

.accordion-content::before {
    content: "A.";
    position: absolute;
    color: #333333;
    text-align: center;
    font-size: calc(100vw * (20 / 1440));
    font-weight: 500;
    line-height: 120%;
    left: calc(100vw * (27 / 1440) * -1);
    top: calc(100vw * (30 / 1440));
}

.accordion-content-inner {
    padding-top: calc(100vw * (30 / 1440));
}
.faq-section > .container >.note-text{
    margin-top: calc(100vw * (80 / 1440));
}

@media screen and (max-width: 768px) {
    .faq-section{
        padding: calc(100vw * (64 / 375)) 0 calc(100vw * (80 / 375));
    }
    .faq-section .section-title{
    }
    .faq-section .section-title{
        width: calc(100vw * (335 / 375));
        height: calc(100vw * (48 / 375));
        padding: calc(100vw * (32 / 375)) 0  calc(100vw * (40 / 375));
        font-size: calc(100vw * (30 / 375));
        letter-spacing: calc(100vw * (2.4 / 375));
    }
    .faq-section .section-title::before{
        width: calc(100vw * (61 / 375));
        height: calc(100vw * (39 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    }
    .faq-section .section-title::after{
        width: calc(100vw * (61 / 375));
        height: calc(100vw * (39 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='61' height='39' viewBox='0 0 61 39' fill='none'%3e%3cpath d='M60.5 0.5L0.5 38.5' stroke='%23132E61' stroke-linecap='round'/%3e%3c/svg%3e");
    }
    .faq-section .container{
        width: calc(100vw * (335 / 375));
    }
    .accordion{
        margin-top: calc(100vw * (48 / 375));
    }
    .accordion-item {
        padding: calc(100vw * (24 / 375)) calc(100vw * (16 / 375)); 
    }

    .accordion-header {
        font-size: calc(100vw * (18 / 375));
        padding-right: calc(100vw * (70 / 375)); 
        margin-left: calc(100vw * (34 / 375));
    }

    .accordion-header::before {
        font-size: calc(100vw * (24 / 375));
        left: calc(100vw * (34 / 375) * -1);
    }

    .accordion-header::after {
        right: calc(100vw * (30 / 375));
        width: calc(100vw * (32 / 375));
        height: calc(100vw * (32 / 375));
        font-size: calc(100vw * (20 / 375));
    }
    .accordion-content {
        width: 100%;
        font-size: calc(100vw * (16 / 375));
        margin-left: calc(100vw * (27 / 375));
    }

    .accordion-content::before {
        font-size: calc(100vw * (20 / 375));
        left: calc(100vw * (27 / 375) * -1);
        top: calc(100vw * (30 / 375));
    }

    .accordion-content-inner {
        width: calc(100vw * (270 / 375));
        padding-top: calc(100vw * (30 / 375));
    }
    .faq-section > .container >.note-text{
        margin-top: calc(100vw * (80 / 375));
    }
}

/* 7.footer */
footer{
    background: #3F3F3F;
}
footer .container{
    color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: calc(100vw * (24 / 1440)) calc(100vw * (16 / 1440));
    gap: calc(100vw * (24 / 1440));
}
.footer-link{
    position: relative;
    font-size: calc(100vw * (10 / 1440));
    font-weight: 400;
    line-height: 150%;
    text-decoration-line: underline;
}
.footer-link::after{
    content: "";
    position: absolute;
    width: calc(100vw * (12 / 1440));
    height: calc(100vw * (12 / 1440));
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3e%3cmask id='path-1-inside-1_2485_6639' fill='white'%3e%3cpath d='M4.5 3.75H2.25V9.75H8.25V7.5H9V10.5H1.5V3H4.5V3.75Z'/%3e%3c/mask%3e%3cpath d='M4.5 3.75H2.25V9.75H8.25V7.5H9V10.5H1.5V3H4.5V3.75Z' fill='white'/%3e%3cpath d='M4.5 3.75V4.5H5.25V3.75H4.5ZM2.25 3.75V3H1.5V3.75H2.25ZM2.25 9.75H1.5V10.5H2.25V9.75ZM8.25 9.75V10.5H9V9.75H8.25ZM8.25 7.5V6.75H7.5V7.5H8.25ZM9 7.5H9.75V6.75H9V7.5ZM9 10.5V11.25H9.75V10.5H9ZM1.5 10.5H0.75V11.25H1.5V10.5ZM1.5 3V2.25H0.75V3H1.5ZM4.5 3H5.25V2.25H4.5V3ZM4.5 3.75V3H2.25V3.75V4.5H4.5V3.75ZM2.25 3.75H1.5V9.75H2.25H3V3.75H2.25ZM2.25 9.75V10.5H8.25V9.75V9H2.25V9.75ZM8.25 9.75H9V7.5H8.25H7.5V9.75H8.25ZM8.25 7.5V8.25H9V7.5V6.75H8.25V7.5ZM9 7.5H8.25V10.5H9H9.75V7.5H9ZM9 10.5V9.75H1.5V10.5V11.25H9V10.5ZM1.5 10.5H2.25V3H1.5H0.75V10.5H1.5ZM1.5 3V3.75H4.5V3V2.25H1.5V3ZM4.5 3H3.75V3.75H4.5H5.25V3H4.5Z' fill='white' mask='url(%23path-1-inside-1_2485_6639)'/%3e%3cpath d='M5.25 1.5H10.5V6.75' stroke='white' stroke-width='0.75'/%3e%3cpath d='M10.5 1.5L4.5 7.5' stroke='white' stroke-width='0.75'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: cover;
}
.copyright{
    position: relative;
    font-size: calc(100vw * (10 / 1440));
    font-weight: 400;
    line-height: 150%;
}

@media screen and (max-width: 768px) {
    footer .container{
        padding: calc(100vw * (24 / 375)) calc(100vw * (16 / 375));
        gap: calc(100vw * (24 / 375));
    }
    .footer-link{
        font-size: calc(100vw * (10 / 375));
    }
    .footer-link::after{
        width: calc(100vw * (12 / 375));
        height: calc(100vw * (12 / 375));
        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3e%3cmask id='path-1-inside-1_2485_6639' fill='white'%3e%3cpath d='M4.5 3.75H2.25V9.75H8.25V7.5H9V10.5H1.5V3H4.5V3.75Z'/%3e%3c/mask%3e%3cpath d='M4.5 3.75H2.25V9.75H8.25V7.5H9V10.5H1.5V3H4.5V3.75Z' fill='white'/%3e%3cpath d='M4.5 3.75V4.5H5.25V3.75H4.5ZM2.25 3.75V3H1.5V3.75H2.25ZM2.25 9.75H1.5V10.5H2.25V9.75ZM8.25 9.75V10.5H9V9.75H8.25ZM8.25 7.5V6.75H7.5V7.5H8.25ZM9 7.5H9.75V6.75H9V7.5ZM9 10.5V11.25H9.75V10.5H9ZM1.5 10.5H0.75V11.25H1.5V10.5ZM1.5 3V2.25H0.75V3H1.5ZM4.5 3H5.25V2.25H4.5V3ZM4.5 3.75V3H2.25V3.75V4.5H4.5V3.75ZM2.25 3.75H1.5V9.75H2.25H3V3.75H2.25ZM2.25 9.75V10.5H8.25V9.75V9H2.25V9.75ZM8.25 9.75H9V7.5H8.25H7.5V9.75H8.25ZM8.25 7.5V8.25H9V7.5V6.75H8.25V7.5ZM9 7.5H8.25V10.5H9H9.75V7.5H9ZM9 10.5V9.75H1.5V10.5V11.25H9V10.5ZM1.5 10.5H2.25V3H1.5H0.75V10.5H1.5ZM1.5 3V3.75H4.5V3V2.25H1.5V3ZM4.5 3H3.75V3.75H4.5H5.25V3H4.5Z' fill='white' mask='url(%23path-1-inside-1_2485_6639)'/%3e%3cpath d='M5.25 1.5H10.5V6.75' stroke='white' stroke-width='0.75'/%3e%3cpath d='M10.5 1.5L4.5 7.5' stroke='white' stroke-width='0.75'/%3e%3c/svg%3e");
    }
    .copyright{
        font-size: calc(100vw * (10 / 375));
    }
}

/* 8.float_btn */
.float_btn {
    position: fixed;
    bottom: calc(100vw * (0 / 1440));
    left: 0;
    width: 100%;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    opacity: 0;
    transform: translateY( calc(100vw * (20 / 1440)) );
    transition: opacity 0.4s ease, transform 0.4s ease;
    background: rgba(255, 255, 255, 0.80);
    box-shadow: 0 0 calc(100vw * (13 / 1440)) 0 rgba(0, 0, 0, 0.10);
}
.float_btn .entry_botton{
    margin: calc(100vw * (20 / 1440)) auto;
}

.float_btn.is-active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
@media screen and (max-width: 768px) {
    .float_btn {
        transform: translateY( calc(100vw * (20 / 375)));
    }
    .float_btn .entry_botton{
        margin: calc(100vw * (20 / 375)) auto;
    }
}


@media screen and (min-width: 769px) {
    .sp-only{
        display: none !important;
    }
}
@media screen and (max-width: 768px) {
    .pc-only{
        display: none !important;
    }
}