@charset "utf-8";
/* CSS Document */


.flow_list{ display:block; width:90%; margin:30px auto; border:#999999 solid 1px; border-radius:10px; background-color:#FFFFFF;}
.list_title{ display:flex; flex-wrap:no-wrap; justify-content:space-around; margin: 4% auto 0 auto;}
p.list_numb{ display:block; width:16%; margin-left:4%; color:#FF9900; font-size:36px; font-weight:bold;}
p.flow_list_title{ display:block; width:75%; color:#C60; font-size:16px; font-weight:bold; margin-top:-0.5%;}
span.flow_list_title_ss{ font-size:12px; font-weight:100;}
span.flow_list_title_l{ color:#FF9900; font-size:38px;}
p.flow_list_naiyo{ display:block; width:100%; margin:0 auto; padding:3% 5% 3% 5%; color:#333; font-weight:bold; text-align:justify;}

.list_image{ display:flex; flex-wrap:wrap; height:auto; align-items:flex-start; justify-content:space-between;}
p.flow_list_naiyo_image{ display:block; width:100%; margin:0 auto; padding:3% 5% 0 5%; color:#333; font-weight:bold; text-align:justify;}
img.flo_cap{ display:block; width:90%; margin:20px auto;}

p.triangle{ display:block; width:100%; text-align:center; color:#FF6600; font-size:30px;}


@media (min-width: 468px) {
.flow_list{ display:block; width:90%; margin:30px auto; border:#999999 solid 1px; border-radius:10px; background-color:#FFFFFF;}
.list_title{ display:flex; flex-wrap:no-wrap; justify-content:space-around; margin: 4% auto 0 auto;}
p.list_numb{ display:block; width:16%; margin-left:4%; color:#FF9900; font-size:42px; font-weight:bold;}
p.flow_list_title{ display:block; width:75%; color:#C60; font-size:16px; font-weight:bold;}
span.flow_list_title_ss{ font-size:12px; font-weight:100;}
span.flow_list_title_l{ color:#FF9900; font-size:44px; margin-top:-0.5%;}
p.flow_list_naiyo{ display:block; width:100%; margin:0 auto; padding:3% 5% 5% 5%; color:#333; font-weight:bold;}
p.triangle{ display:block; width:100%; text-align:center; color:#FF6600; font-size:30px;}
}


@media (min-width: 768px) {
.flow_list{ display:block; width:90%; margin:30px auto; border:#999999 solid 1px; border-radius:10px; background-color:#FFFFFF;}
.list_title{ display:flex; flex-wrap:no-wrap; justify-content:space-around; margin: 4% auto 0 auto;}
p.list_numb{ display:block; width:16%; margin-left:4%; color:#FF9900; font-size:52px; font-weight:bold;}
p.flow_list_title{ display:block; width:75%; color:#C60; font-size:16px; font-weight:bold; margin-top:0%;}
span.flow_list_title_ss{ font-size:12px; font-weight:100;}
span.flow_list_title_l{ color:#FF9900; font-size:50px;}
p.flow_list_naiyo{ display:block; width:100%; margin:0 auto; padding:3% 5% 5% 5%; color:#333; font-weight:bold;}
p.triangle{ display:block; width:100%; text-align:center; color:#FF6600; font-size:30px;}

.list_image{ display:flex; flex-wrap:no-wrap;}
p.flow_list_naiyo_image{ display:block; width:65%; margin:0 auto; padding:3% 5% 0 5%; color:#333; font-weight:bold; text-align:justify;}
img.flo_cap{ display:block; width:32%; margin:0 3% 3% auto;}
}

@media (min-width: 1200px) {
.flow_list{ display:block; width:90%; margin:30px auto; border:#999999 solid 1px; border-radius:10px; background-color:#FFFFFF;}
.list_title{ display:flex; flex-wrap:no-wrap; justify-content:space-around; margin: 4% auto 0 auto;}
p.list_numb{ display:block; width:16%; margin-left:4%; margin-top:-0.5%; color:#FF9900; font-size:56px; font-weight:bold;}
p.flow_list_title{ display:block; width:75%; color:#C60; font-size:16px; font-weight:bold;}
span.flow_list_title_ss{ font-size:12px; font-weight:100;}
span.flow_list_title_l{ color:#FF9900; font-size:50px; margin-top:0;}
p.flow_list_naiyo{ display:block; width:100%; margin:0 auto; padding:3% 5% 5% 5%; color:#333; font-weight:bold;}
p.triangle{ display:block; width:100%; text-align:center; color:#FF6600; font-size:30px;}
}