@charset "utf-8";
html{
    font-size:18px;
}
.top_480B{
    width:100%;
    height:480px;
    position: relative;
    background-position: center center;
    background-size: cover;
}
/*あとで画像を変更する*/
.top_imgD{
    background-image: url(image/dispatch.jpg);
    color:white;
}

/*派遣とは*/
.with_dispatch{
    width:100%;
    height:auto;
    background-color: #F1F1F1;
    padding-top:50px;
    padding-bottom:50px;
    margin-bottom:100px;
}

.dis_sub_title{
    font-size:40px;
    font-family: 'Noto Serif JP', serif;
    text-align: center;
    margin-bottom: 50px;
    font-weight: 600;
}
.dis_sub_title_text{
    font-size:50px;
    position:relative;
}

.dis_sub_title_text_mini{
    font-family: 'Noto Serif JP', serif;
    font-size:40px;
    text-align: center;
}

/*下線_____________________*/
.dis_sub_title_text:after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: -5px;/*線の上下位置*/
    display: inline-block;
    width: 150%;/*線の長さ*/
    height: 2px;/*線の太さ*/
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);/*位置調整*/
    background-color: black;/*線の色*/
    border-radius: 2px;/*線の丸み*/
}

.flex_2split{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    /*    flex-wrap: wrap;*/
}

.flex_2split_parts{
    width:95%;
    margin-left:2.5%;
    margin-right:2.5%;
    position:relative;
}


.with_dispatch_image{
    background-image: url("image/with_dispatch.png");
    background-position:center;
    background-size: contain;
    background-repeat: no-repeat;
    max-width:100%;
    height:250px;
}
.with_dispatch_text{
    margin-top:40px;
    line-height:25px;
}


/*派遣のメリット各コンテンツ-----------*/
.merit_contents{
    height:auto;
    width:95%;
    margin:auto;
    padding:10px 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color:#EEEEEE;

}
/*コンテンツ2分割*/
.merit_in_area{
    width:46%;
    margin:auto 2%;
}
.merit_in_area h4{
    font-size:20px;
}

/*画像の配置------------------------*/
.merit_image_all{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
    height:210px;
    margin-top:20px;
    margin-bottom:20px;
}
.merit_imageA{
    background-image: url("image/life_andlocation_.png");
}
.merit_imageB{
    background-image: url("image/skill_up.png");
}
.merit_imageC{
    background-image: url("image/experience.png");
}
.merit_imageD{
    background-image: url("image/Consultation.png");
}
/*5段目の設定*/
.merit_last{
    background-color: #747474;
    height:auto;
    padding-top:20px;
    padding-bottom: 20px;
    color:#FFFFFF;
}
/*flexboxで中央寄せ*/
.flex_Alignment{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.merit_last_redbox{
    width:400px;
    height:90px;
    background-color: #D70C19;
    position: relative;
    font-size:22px;
    font-weight:bold;
}

.plus_area{
    margin:30px auto;
    text-align: center;
}

.structure {
    background-image: url("image/how_it_works.png");
    background-position:center;
    background-size: contain;
    background-repeat: no-repeat;
    max-width:100%;
    height:300px;
}

.structure_all{
    border-top:solid 2px #707070;
    margin-top:100px;
    background-color: #FFFFFF;
}





@media screen and (max-width:768px) {
    html{
        font-size:16px;
    }

    .top_480B{
        height:300px;
    }

    .title_text_sub{
        font-size:32px;
    }
    .contents_inside{
        width:100%;
    }
    .flex_2split{
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
    .flex_2split_parts{
        width:90%;
    }

    .dis_sub_title_text{
        font-size:28px;
    }
    .dis_sub_title_text_mini{
        font-size:24px;
    }

    .merit_in_area{
        width:90%;
    }
    .merit_contents{
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding:30px 0px;
    }
    
    .merit_image_all{

        height:120px;
        margin-top:10px;
        margin-bottom:10px;
    }
    

    .dis_sub_title_text:after{
        width: 130%;/*線の長さ*/
    }

    .merit_last_redbox{
        font-size:20px;
        width:300px;
        font-weight:bold;
    }
    .merit_in_area h4{
        font-size:18px;
    }


}