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

/*===============================*/
/*//サービス//*/
/*===============================*/

#flow_wrap .contents{
width: 688px;
border: 1px solid #DFDFDF;
border-top: none;
padding: 10px 0 8px 0;
margin-bottom: 5px;
}

#flow_wrap .box{
background: #F5F8FB;
width: 670px;
margin: 0 auto;
padding-bottom: 30px;
}

#flow_menu{
position: relative;
height: 224px;
}
#flow_menu li{
position: absolute;
}
#flow01{ z-index: 6; top: 70px; left: 20px;}
#flow02{ z-index: 5; top: 60px; left: 121px;}
#flow03{ z-index: 4; top: 50px; left: 224px;}
#flow04{ z-index: 3; top: 40px; left: 326px;}
#flow05{ z-index: 2; top: 30px; left: 428px;}
#flow06{ z-index: 1; top: 20px; left: 524px;}

#wrap{
background: url(../../flow/img/wrap_bg.jpg) left top repeat-y;
width: 602px;
margin: 0 auto;
}
#wrap li{ position: relative;}
#step01{
background: url(../../flow/img/step01.jpg) left top no-repeat;
width: 602px;
height: 192px;
}
#step02{
background: url(../../flow/img/step02.jpg) left top no-repeat;
width: 602px;
height: 260px;
}
#step02 .step_image{
position: absolute;
top: 24px;
right: 13px;
}
#step02 .btn{
position: absolute;
top: 160px;
right: 45px;
}
#wrap .about{
width: 270px;
position: absolute;
top: 38px;
left: 51px;
}
#step03{
background: url(../../flow/img/step03.jpg) left top no-repeat;
width: 602px;
height: 331px;
line-height: 1.4;
}
#step04{
background: url(../../flow/img/step04.jpg) left top no-repeat;
width: 602px;
height: 253px;
}
#step04 .png{
position: absolute;
top: -10px;
right: 0;
}
#step05{
background: url(../../flow/img/step05.jpg) left top no-repeat;
width: 602px;
height: 234px;
}
#step05 .png{
position: absolute;
right: 40px;
top: 0;
}
#step06{
background: url(../../flow/img/step06.jpg) left top no-repeat;
width: 602px;
height: 196px;
}
#step06 .caution{
border: 3px solid #CC0000;
padding: 5px 10px;
}