@charset "UTF-8";
/* CSS Document */
/*PC*/
@media print, screen and (min-width: 768px) {
/* hed
---------------------------------------------*/
#hed {
background: url("../images/process/mv_img.jpg") no-repeat center;
}

/* process
---------------------------------------------*/
#process {
position: relative;
margin: 0 auto 180px;
}

#process .section_wrap {
width: 100%;
margin: 0 auto;
}

#process .flex_wrap {
width: 95%;
margin: 0 0 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}

#process .flex_wrap:nth-of-type(2n) {
margin: 160px auto 160px 0;
flex-direction: row-reverse;
}

#process .flex_wrap:last-child {
margin-bottom: 0;
}

#process .flex_wrap .txtbox {
width:45%;
}


#process .flex_wrap .txtbox h2 {
display: table;
padding: 5px 15px;
box-sizing: border-box;
background: #f4901b;
font-size: 2.6rem;
line-height: 1;
color: #FFF;
border-radius:50rem;
margin-bottom: 30px;
}

#process .flex_wrap .txtbox .company_list{
margin-bottom: 10px;
}


#process .flex_wrap .txtbox .company_list li{
display:inline-block;
padding: 5px 20px 6px;
box-sizing: border-box;
text-align: center;
font-size: 1.6rem;
font-weight:600;
line-height: 1;
color: #FFF;
border-radius: 50rem;
margin-right: 15px;
}

#process .flex_wrap .txtbox .company_list li.bg01{
background: #ffa300;
}

#process .flex_wrap .txtbox .company_list li.bg02{
background: #ffc600;
}

#process .flex_wrap .txtbox .company_list li:last-child{
margin-right: 0;
}

#process .flex_wrap .txtbox h3 {
font-size:3.6rem;
margin-bottom: 20px;
}

#process .flex_wrap .txtbox .illust {
width: 80%;
margin: 0 auto 60px;
}

#process .flex_wrap .txtbox p {
font-size: 1.8rem;
line-height: 2.2;
font-weight: 600;
}

#process .flex_wrap .imgbox {
width:50%;
}

#process .button a{
margin: auto;
}

}
/*sp*/
@media only screen and (max-width: 767px) {
/* hed
---------------------------------------------*/
#hed {
background: url("../images/process/mv_img.jpg") no-repeat center;
}

/* process
---------------------------------------------*/
#process {
position: relative;
margin: 0 auto 60px;
}

#process .section_wrap {
width: 100%;
margin: 0 auto;
}

#process .flex_wrap {
width: 90%;
margin: 0 auto 40px;
}

#process .flex_wrap:nth-of-type(2n) {

}

#process .flex_wrap:last-child {
margin-bottom: 0;
}

#process .flex_wrap .txtbox {
width:100%;
}


#process .flex_wrap .txtbox h2 {
display: table;
padding: 5px 15px;
box-sizing: border-box;
background: #f4901b;
font-size: 2rem;
line-height: 1;
color: #FFF;
border-radius:50rem;
margin-bottom: 10px;
}

#process .flex_wrap .txtbox .company_list{
margin-bottom: 10px;
}


#process .flex_wrap .txtbox .company_list li{
display:inline-block;
padding: 5px 20px 6px;
box-sizing: border-box;
text-align: center;
font-size: 1.2rem;
font-weight:600;
line-height: 1;
color: #FFF;
border-radius: 50rem;
margin-right: 15px;
}

#process .flex_wrap .txtbox .company_list li.bg01{
background: #ffa300;
}

#process .flex_wrap .txtbox .company_list li.bg02{
background: #ffc600;
}

#process .flex_wrap .txtbox .company_list li:last-child{
margin-right: 0;
}

#process .flex_wrap .txtbox h3 {
font-size:2.2rem;
margin-bottom: 20px;
}

#process .flex_wrap .txtbox .illust {
width: 100%;
margin: 0 auto 60px;
}

#process .flex_wrap .txtbox p {
font-size: 1.2rem;
line-height: 2.2;
font-weight: 600;
}

#process .flex_wrap .imgbox {
width:70%;
margin:30px auto 0;
}

#process .button a{
margin: auto;
}

}