/* section styles 
add date : 1005 */
/* add page : cases , support */

section{
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
}

.section_blue{
    background: var(--blue-50, #F1F8FE);
}
.section_blue_45{
    background: var(--blue-45, #D9EAFE);
}
.section_yellow_30{
    background: var(--yellow-30, #FFF3D3);
}
.section_public_cta{
    margin-bottom: 80px;
}

@media screen and (max-width: 880px) {
    .section_public_cta{
        margin-bottom: 64px;
    }
}

span{
    color: var(--black, #252729);
    font-family: "Noto Sans JP";
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
h2,
h1{
    font-family: "Noto Sans JP";
    font-style: normal;
    font-weight: 700;
}


.section_main{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-top: 80px;
    padding-bottom: 80px;
    gap: 40px;
    width: 100%;
}
.section_main .title{
    color: var(--black, #252729);
    text-align: center;

}
.section_main .title span,
.section_main .title h2,
.section_main .title h1{
    font-size: 40px;
    line-height: normal;
    color: var(--black, #252729);
}
.section_main .title span br,
.section_main .title p br,
.section_main .title h2 br,
.section_main .title h1 br{
    display: none;
}
@media screen and (max-width: 1023px) {
    .section_main #blu_title span br,
    .section_main #blu_title h2 br,
    .section_main #blu_title h1 br{
        display: block;
    }
}
@media screen and (max-width: 880px) {
    .section_main .title span,
    .section_main .title h2,
    .section_main .title h1{
        font-size: 24px;
    }
    .section_main {
        padding-top: 64px;
        padding-bottom: 64px;
        gap: 24px;
    }
}
@media screen and (max-width: 780px) {
    .section_main .title span br,
    .section_main .title h2 br,
    .section_main .title h1 br{
        display: block;
    }
}