/*h3*/
.flow h3,
.contractor h3{
    font-size: 2rem;
    padding-bottom:1.75rem;
    margin-bottom:1.75rem;
    color:#FF77AD;
    border-bottom:solid #FF77AD 1px;
}

/*ご依頼までの流れ*/
.flow_wrapper{
    margin-top:8rem;
}
.flow_content{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top:4rem;
    border-bottom: solid #FF77AD 1px;
    padding-bottom:4rem;
}
.flow_content:nth-of-type(6){
    border:none;
}

.flow_content img{
    width:35%;
    height:auto;
}
.flow_info{
    width:calc((100% - 35%) - 5%);
}
.flow_ttl{
    display: flex;
    align-items: center;
}
.flow_ttl .flow_number{
    color:white;
    background-color: #FF77AD;
    padding:.5rem 1.5rem;
    display: inline-block;
    border-radius: 9999px;
}
.flow_ttl .flow_name{
    color:black;
    font-weight: 600;
    font-size: 1.75rem;
    margin-left:1.75rem;
}
.flow_info .flow_txt{
    margin-top:1.75rem;
}

.contact_btn_wrapper{
    width:100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top:1.25rem;
}
.flow .contact_btn.line{
    margin-top:0;
}
.flow .contact_btn.tel{
    margin-right:0;
}
.settlement{
    background-color: white;
    margin-top:2rem;
    border:solid 1px #FF77AD;
}
.settlement a{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    padding:1.5rem 0;
}
.settlement a img:first-of-type{
    width:40%;
    height:auto
}
.settlement a img:last-of-type{
    width:20%;
    height:auto;
}



/*業者の紹介*/
.contractor{
    margin-top:6rem;
    margin-bottom:3rem;
}
.contractor .contractor_info span{
    display:block;
    color:#FF77AD;
    font-weight: 600;
    background-color: white;
    padding:.5rem 2rem;
    margin-bottom:1rem;
    width:50%;
    text-align: center;
}
.contractor .contractor_info p{
    width:100%;
}



/*----------------------------------------------------------------------
レスポンシブ
------------------------------------------------------------------------*/
/*------------------------------------------
1024px以下
--------------------------------------------*/
@media(max-width:1024px){
    /*ご依頼の流れ*/
    .flow .contact_btn.line{
        margin-top:2rem;
    }
}



/*------------------------------------------
768px以下
--------------------------------------------*/
@media(max-width:768px){
    /*ご依頼の流れ*/
    .contact_btn {
        width: 60% !important;
    }
    .contact_btn_wrapper {
        flex-flow: column;
        align-items: flex-start;
    }
    .contact_btn.mail{
        margin-top:2rem;
    }

    /*業者の紹介*/
    .contractor .contractor_info span{
        width:100%;
    }
}


/*------------------------------------------
600px以下
--------------------------------------------*/
@media(max-width:600px){
    /*ご依頼の流れ*/
    .flow_content{
        flex-flow: column;
        align-items: center;
    }
    .flow_content img{
        width: 70%;
    }
    .flow_info{
        width: 90%;
        margin-top: 3rem;
    }
}



/*------------------------------------------
425px以下
--------------------------------------------*/
@media(max-width:425px){
     /*ご依頼の流れ*/
     .flow_content img {
        width: 90%;
    }
    .contact_btn_wrapper{
        margin-top: 2rem;
    }
    .contact_btn {
        width: 100% !important;
    }


    /*電子決済*/
    .settlement a{
        flex-flow: column;
    }
    .settlement a img:first-of-type{
        width: 70%;
    }
    .settlement a img:last-of-type{
        width: 40%;
    }
}