@charset "UTF-8";
/* CSS Document */
/* 基本-モバイルファースト ======================================================================================================== */

#common_main_title .p01{
position: relative;
}
#common_main_title .p01 .p01_02{
width: 40vw;
position: absolute;
bottom: 0;
right: -10vw;
}





#flowchat li{
display: flex;
padding-bottom: 40px;
position: relative;
}
#flowchat li::after{
content: "";
display: block;
width: 2px;
height: 100%;
background-color: #b3203a;
position: absolute;
top: 0;
left: 30px;
z-index: 1;
}
#flowchat li:last-child{
padding-bottom: 0px;
}
#flowchat li:last-child:after{
display: none;
}
#flowchat li .num{
width: 60px;
height: 60px;
border-radius: 50%;
color: #fff;
font-weight: bold;
line-height: 1;
background-color: #b3203a;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: relative;
z-index: 10;
}
#flowchat li .num span{
display: block;
}
#flowchat li .num em{
display: block;
font-size: 30px;
}
#flowchat li .inner{
flex: 1;
margin-left: 1em;
margin-top: 1em;
}
#flowchat li .text h3{
font-size: 20px;
font-weight: bold;
}
#flowchat li .text em{
display: block;
color: #b3203a;
}

#flowchat li .illust{
text-align: center;
}


/* スマホのみ======================================================================================================== */
@media screen and (max-width: 750px){
#common_main_title .p01 .p01_02{
-webkit-transform: scale(-1, 1);
transform: scale(-1, 1);

}

}


/* PCのみ======================================================================================================== */
@media print and (min-width: 751px), screen and (min-width: 751px){

#common_main_title .p01{
position: absolute;
}
#common_main_title .p01 .p01_02{
width: auto;
position: absolute;
bottom: 0;
right: -4vw;
}

#flowchat li{
padding-bottom: 80px;
}
#flowchat li::after{
left: 60px;
}
#flowchat li .num{
width: 120px;
height: 120px;
}
#flowchat li .num span{
font-size: 20px;
}
#flowchat li .num em{
font-size: 50px;
}
#flowchat li .inner{
display: flex;
margin-left: 30px;
margin-top: 0px;
}
#flowchat li .text{
flex: 1;
margin-right: 30px;
}
#flowchat li .text h3{
font-size: 30px;
margin-top: 30px;
}
#flowchat li .text em{
font-size: 20px;
}
#flowchat li .text p{
font-size: 16px;
}



#flowchat li .illust{
width: 240px;
}


}