

.top-text{
    text-align: center;
    margin-top:6.3vw;
    color: white;
}
.top-text h4{
    font-size: 1.5vw;
}
.top-text p{
    margin-top:4.06vw;
    font-size:1.1vw;
    line-height: 2.5vw;
    padding-bottom:4.06vw;
}


.bg-gray{
    background-color: #E8E8E8;
}



.section-info{
    position: relative;
    padding-top:5.63vw;
}

.section-image{
    width:64.4vw;
    height:28.33vw;
    position: absolute;
    right:0;
}
.section-image::before{
    content:"";
    width:70%;
    height:28.33vw;
    display: block;
    background-color: #E8E8E8;
    transform: skewX(-32deg);
    position: absolute;
    top:0;
    left:-55%;
    z-index:2
}
.section-image img{
    width:100%;
    height:100%;
    object-fit: cover;
    z-index: 1;
}



.section-text{
    width:20.83vw;
    position: absolute;
    top:10vw;
    left:10%;
    z-index: 3;
}
.section-text h5{
    font-size:1.3vw;
    text-align: center;
}
.section-text p{
    margin-top:2.81vw;
    font-size: 1.1vw;
    line-height: 2vw;
}




/*不動産売買仲介の流れ*/
.flow{
    padding-top:35vw;
}
.flow h5{
    font-size:1.3vw;
    text-align: center;
}

.flow-content{
    width:63.33vw;
    margin:0 auto;
}


.flow-section{
    margin-top:2.6vw;
}
.flow-flex{
    display: flex;
    align-items: center;
}

.flow-number{
    width:4.9vw;
    height:4.9vw;
    background-color: black;
    margin-right:2.34vw;
}
.flow-number p{
    color:white;
    font-size:1.4vw;
    line-height:4.9vw;
    text-align: center;
}

.flow-title p{
    font-size:1.4vw;
    font-weight: 600;
}

.flow-text{
    margin-left:7.24vw;
    margin-top:1.09vw;
    font-size:1.1vw;
    line-height:2.5vw;
}



.contact-btn{
    text-align: center;
    margin-top:7.81vw;
    transition: .5s;
}
.contact-btn a{
    display: inline-block;
    background-color: black;
    color: white;
    text-decoration: none;
    padding:2.86vw 7.81vw;
}
.contact-btn p{
    font-size:1.1vw;
}

.contact-btn:hover{
    opacity: .8;
}




/*不動産買取再生*/
.purchase-playback .section-image{
    left:0;
}
.purchase-playback .section-image::before{
    transform: skewX(32deg);
    left:86%;
}

.purchase-playback .section-text{
    top:10vw;
    left:70%;
    z-index: 3;
}



/*不動産買取再生の流れ*/
.purchase-playback-flow{
    margin-top:35vw;
}

.purchase-playback-flow h5{
    font-size:1.3vw;
    text-align: center;
}

.purchase-playback-flow img{
    width:69.17vw;
    height:36.82vw;
    display: block;
    margin:5vw auto 8vw auto; 
}



/*リノベーション*/
.renovation{
    width:69.17vw;
    margin:0 auto;
}
.renovation h5{
    font-size:1.5vw;
    margin-bottom:5.16vw;
}

.renovation-example{
    width:100%;
}

.bg-white{
    width:100%;
    background-color:#EFEFEF;
}



.example{
    width:61.41vw;
    margin:0 auto;
    display: flex;
    flex-wrap: wrap;
}


.example-section p{
    font-size:1.1vw;
}

.example-section{
    width:50%;
    margin:3.65vw auto;
}
.example-section.room-example{
    width:100%;
}


.example-title{
    text-align: center;
    margin-bottom:1.72vw;
}


.example-img{
    display: flex;
    justify-content: space-around;
}
.example-img img{
    width:13.54vw;
    height:19.43vw;
    object-fit: cover;
}
.example-img p{
    text-align: center;
    margin-top:1.72vw;
}



.works-btn{
    text-align: center;
    margin:7.29vw 0;
}
.works-btn a{
    display: inline-block;
    color: white;
    background-color: black;
    text-decoration: none;
    padding:2.81vw 13.02vw;
    transition: .5s;
}
.works-btn p{
    font-size:1.1vw;
}

.works-btn a:hover{
    opacity: .8;
}









/*不動産投資*/
.investment-content{
    margin-top:35vw;
}



.investment-copy{
    font-weight: bold;
    text-align: center;
    font-size:1.3vw;
    line-height:2.5vw;
}


.investment-info{
    width:69.17vw;
    margin:6.77vw auto;
}

.investment-text .choose-title{
    font-weight: bold;
    font-size:1.3vw;
    margin-bottom:3.65vw;
}

.investment-text p{
    font-size:1.1vw;
}




.investment-method{
    margin-top:4.95vw;
}

.method-bg{
    background-color: white;
    padding-bottom:2vw;
}

.method-name p{
    display: inline-block;
    background-color: black;
    color: white;
    padding:1.72vw 3.75vw;
    font-size:1.1vw;
}


.method-content{
    width:61.67vw;
    margin:3.44vw auto;
}
.method-content p{
    font-size:1.1vw;
    line-height:2.5vw;
}

.method-img{
    width:50vw;
    height:12vw;
    margin:2.17vw auto;
}
.method-img img{
    width:100%;
    height:100%;
}

.method-info{
    font-size:1.1vw;
    line-height:2.5vw;
    margin-top:7.19vw;
}















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

@media(max-width:599px){


    .top-text{
        text-align: center;
        margin-top:8.97vw;
        color: white;
    }
    .top-text h4{
        font-size: 5vw;
    }
    .top-text p{
        width:88.72vw;
        margin:4.06vw auto 0 auto;
        font-size:3.5vw;
        line-height: 6vw;
        padding-bottom:12.82vw;
    }



    .section-info{
        padding-top:7.69vw;
    }
    
    .section-image{
        width:90%;
        height:40.26vw;
        right:50%;
        transform: translate(50%);
    }
    .section-image::before{
        display: none;
    }



    .section-text{
        width:90%;
        top:55vw;
        left:5%;
    }
    .section-text h5{
        font-size:4.5vw;
    }
    .section-text p{
        font-size: 3.5vw;
        line-height: 6vw;
    }






    /*不動産売買仲介の流れ*/
    .flow{
        padding-top:90vw;
    }
    .flow h5{
        font-size:4.5vw;
    }

    .flow-content{
        width:90%;
    }


    .flow-section{
        margin-top:2.6vw;
    }

    .flow-number{
        width:13vw;
        height:13vw;
        margin-right:4vw;
    }
    .flow-number p{
        font-size:3.5vw;
        line-height:13vw;
    }

    .flow-title p{
        font-size:3.5vw;
    }

    .flow-text{
        margin-left:17vw;
        margin-top:3vw;
        font-size:3.5vw;
        line-height:6vw;
    }



    .contact-btn{
        margin-top:15.38vw;
    }
    .contact-btn a{
        padding:7.69vw 23.08vw;
    }
    .contact-btn p{
        font-size:3.5vw;
    }




    /*不動産買取再生*/
    .purchase-playback .section-image{
        left:-40%;
    }


    .purchase-playback .section-text{
        width:90%;
        top:55vw;
        left:5%;
    }



    /*不動産買取再生の流れ*/
    .purchase-playback-flow{
        margin-top:90vw;
    }

    .purchase-playback-flow h5{
        font-size:4.5vw;
    }

    .purchase-playback-flow img{
        width:90%;
        height:47.95vw;
        display: block;
        margin:7.69vw auto 15.38vw auto; 
    }




    /*リノベーション*/
    .renovation{
        width:90%;
    }
    .renovation h5{
        font-size:4.5vw;
        text-align: center;
        margin-bottom:9.49vw;
    }


    .bg-white{
        padding:3vw 0;
    }

    .example{
        width:90%;
        flex-flow: column;
    }


    .example-section p{
        font-size:3.5vw;
    }

    .example-section{
        width:100%;
    }
    .example-section.room-example .example-img{
        flex-wrap: wrap;
    }

    .example-section.room-example .example-title{
        text-align: center;
    }

    .example-title{
        margin-bottom:3vw;
    }

    .example-img img{
        width:37.95vw;
        height:54.36vw;
    }


    .works-btn{
        margin:10.26vw 0;
    }
    .works-btn a{
        padding:7.69vw 35.9vw;
    }
    .works-btn p{
        font-size:3.5vw;
    }




    /*不動産投資*/
    .investment-content{
        margin-top:80vw;
    }



    .investment-copy{
        font-size:3.5vw;
        line-height:6vw;
    }


    .investment-info{
        width:90%;
        margin:6.77vw auto;
    }

    .investment-text .choose-title{
        font-size:3.5vw;
    }

    .investment-text p{
        font-size:3.5vw;
    }




    .investment-method{
        margin-top:4.95vw;
    }

    .method-bg{
        padding-bottom:2vw;
    }

    .method-name p{
        padding:5.13vw 11.54vw;
        font-size:3.5vw;
    }


    .method-content{
        width:90%;
        margin:3.44vw auto;
    }
    .method-content p{
        font-size:3.5vw;
        line-height:8vw;
    }

    .method-img{
        width:100%;
        height:20.87vw;
        margin:7.69vw auto;
    }
    .method-img img{
        width:100%;
        height:100%;
    }

    .method-info{
        font-size:3.5vw;
        line-height:8vw;
        margin-top:7.19vw;
    }


}
