/*地域密着*/
.kinds_info{
    width:90%;
    margin:4rem auto 0 auto;
}
.kinds_info span:not(.border){
    font-size: 2rem;
    font-weight: 700;
}


/*地域密着フロー*/
.merit{
    margin-top:6rem;
    display: flex;
    justify-content:center;
    align-items: center;
}
.merit img{
    width:40%;
    height:auto;
}
.merit_wrapper{
    width:100%;
}
.merit_wrapper .merit_ttl{
    font-weight: 700;
    color:black;
    text-align: center;
    padding:2rem 0;
    width:80%;
    margin:0 auto;
    position: relative;
}
.merit_wrapper .merit_ttl::after{
    content:"";
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 1.563rem solid transparent;
    border-left: 1.563rem solid transparent;
    border-top: 1.25rem solid #C3C3C3;
    border-bottom: 0;
    position: absolute;
    bottom:-2.5rem;
    left:50%;
    transform: translateX(-50%);
}
.merit_wrapper .merit_ttl:last-of-type::after{
    display: none;
}
.merit_wrapper .merit_ttl:nth-of-type(n+2){
    margin-top:4rem;
}
.merit_wrapper .merit_ttl:first-of-type{
    background-color: #FFE5EF;
}
.merit_wrapper .merit_ttl:nth-of-type(2){
    background-color: #FFCEE1;
}
.merit_wrapper .merit_ttl:nth-of-type(3){
    background-color: #FF9DC3;
}
.merit_wrapper .merit_ttl:nth-of-type(4){
    background-color: #FF79AD;
}



/*お客様にとって*/
.no_1{
    text-align: center;
    color:black;
    display: inline-block;
    position: relative;
    margin:6rem auto 0 auto;
    left:50%;
    transform: translateX(-50%);
}
.no_1::before{
    content:"";
    display: block;
    border-left: solid 2px black;
    height:100%;
    top:0;
    left:-2rem;
    transform: rotate(-25deg);
    position: absolute;
}
.no_1::after{
    content:"";
    display: block;
    border-left: solid 2px black;
    height:100%;
    top:0;
    right:-2rem;
    transform: rotate(25deg);
    position: absolute;
}
.no_1 span{
    font-size: 2.5rem;
    font-weight: 700;
    color:#ed005e;
    position: relative;
}
.no_1 span::after{
    content:"";
    display: block;
    width:100%;
    height:1rem;
    background-color: yellow;
    position: absolute;
    bottom:-.5rem;
    left:0;
    z-index: -1;
}



/*対応エリア*/
/*対応エリア*/
.area{
    margin-top:8rem;
}
.area h3{
    text-align: center;
    border-bottom: none;
}
.area .area_prefecture{
    background-image: url(http://localhost/mamp.test/wp-content/uploads/2025/04/26314605.jpg);
    background-size: cover;
    padding:2rem 0;
    border-radius: 1.75rem;
    margin:2rem auto;
}
.area .area_prefecture ul{
    display: flex;
    align-items: center;
    justify-content:center;
}
.area .area_prefecture ul li{
    margin:0 1.75rem;
    font-weight: 700;
    font-size: 1.75rem;
    color:black;
    position: relative;
}
.area .area_prefecture ul li::after{
    content:"/";
    display: block;
    margin:0 1.75rem 0 3rem;
    position: absolute;
    top:0;
    left:50%;
}

.area_city {
    margin-top:4rem;
}
.area_city h3{
    background-color: #fe458f;
    padding:2rem 0;
    color:white;
    border-radius: 1.75rem 1.75rem 0 0;
    margin-bottom:0;
}
.area_city ul{
    background-color: white;
    padding:1.5rem 0 3.5rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.area_city ul li{
    margin:0 0.875rem;
    margin-top:2rem;
    border-right:solid #050000 1px;
    padding-right:1.75rem;
}
.area_attention{
    margin-top:1rem;
}



/*----------------------------------------------------------
レスポンシブ
-----------------------------------------------------------*/


/*------------------------------------------
1200px以下
--------------------------------------------*/
@media(max-width:1200px){
    /*お客様にとって*/
    .no_1::before{
        left:-4rem;
    }
    .no_1::after{
        right:-4rem;
    }
}


/*------------------------------------------
768px以下
--------------------------------------------*/
@media(max-width:768px){
}



/*------------------------------------------
600px以下
--------------------------------------------*/
@media(max-width:600px){
    /*地域密着フロー*/
    .merit{
        flex-flow: column-reverse;
    }
    .merit img{
        width:60%;
        margin-top:4rem;
    }


    /*お客様にとって*/
    .no_1 span{
        font-size: 2rem;
    }
}


/*------------------------------------------
425px以下
--------------------------------------------*/
@media(max-width:425px){
    /*地域密着フロー*/
    .merit_wrapper .merit_ttl{
        width:100%;
    }


    /*お客様にとって*/
    .no_1::before,
    .no_1::after{
        display: none;
    }


    /*対応エリア*/
    .area {
        margin-top: 4rem;
    }
    .area_city h3{
        padding: 1rem 0;
    }
    .area_city ul{
        padding: 0rem 0 2rem 0;
    }
    .area_city ul li{
        margin: 2rem 0.875rem 0 0.875rem;
    }
}


/*------------------------------------------
375px以下
--------------------------------------------*/
@media(max-width:375px){
     /*地域密着フロー*/
     .merit img{
        width:80%;
     }
}