@charset "utf-8";
/* top, service */
.c_flex_btnr {
    display: flex;
    align-items: flex-end;
    gap: 1em 1.8em;
}
.c_flex_btnr > p {
    /* margin-bottom: .4rem; */
}
.title_double_simple {
    font-size: 280%;
}
.title_double_simple > span {
    display: block;
    color:#bfbfbf;
    font-size: 74%;
    font-weight: 600;
    line-height: 1.2;
}
.title_double_simple > em {
    display: block;
    padding-top: .2em;
    font-weight: 900;
    line-height: 1.2;
}
.flex_2col_imgr,
.flex_2col_imgl {
    display: flex;
    align-items: center;
    gap: 1rem 1.5rem;
    margin: 1.5rem auto 0;
}
.flex_2col_imgr {
    flex-direction: row-reverse;
}
.f2i_img > a {
    display: block;
    border-radius: 15px;
    overflow: hidden;
}
.f2i_img img {
    transform: scale(1);
    transition: all .5s ease-in-out;
}
.f2i_img:hover img {
    transform: scale(1.2);
    transition: all .5s ease-in-out;
}
.f2i_text > h4 {
    margin: 0.5rem auto 0;
    color: #a6c161;
    font-size: 150%;
    font-weight: 700;
    line-height: 1.5;
}
.f2i_text > p {
    margin: 1.5rem auto 0;
    font-size: 94%;
    font-weight: 500;
}
.service_area {
    position: relative;
    z-index: 1;
}
.bg_round_lgreen::before,
.bg_round_dgreen::before,
.bg_round_gray::before {
    content:  "";
    display: block;
    width: 50%;
    height: 15rem;
    position: absolute;
    z-index: -1;
    left: 0;
    top: 2rem;
    background: #f5f9ea;
    border-radius: 0 50px 50px 0;
}
.bg_round_dgreen::before {
    background: #eeefea;
}
.bg_round_gray::before {
    background: #eaeaea;
}


@media screen and (min-width: 1201px){

}
@media screen and (max-width: 1200px){

}
@media screen and (max-width: 1040px){

}
@media screen and (max-width: 950px){

}
@media screen and (max-width: 768px){

}
@media screen and (max-width: 650px){
    /* top, service */
    .c_flex_btnr {
        flex-wrap: wrap;
    }
    .c_flex_btnr > p {
        min-width: 100%;
        max-width: 100%;
    }
    .flex_2col_imgr, .flex_2col_imgl {
        flex-wrap: wrap;
    }
    .f2i_img {
        min-width: 100%;
        text-align: center;
    }
    .f2i_text {
        min-width: 100%;
        text-align: center;
    }
    .f2i_text > p {
        margin: 1rem auto 0;
        text-align: left;
    }
    .f2i_text > div {
        margin-top: 1rem !important;
    }
}
@media screen and (max-width: 479px){

}
@media screen and (max-width: 320px){

}