/* ===================================================================
CSS
 file name  :  fp.css
=================================================================== */
@media screen and (min-width: 769px) {
/* PC用のスタイル記述 */
#lifestyle{
	margin-top:20px;
}
.fp_text{
	margin-top:20px;
}
#trouble{
	margin-left:25px;
	margin-top:15px;
}
#trouble li{
	margin-bottom:5px;
	width:330px;
	float:left;
	list-style-image:url(../images/fp/circle.png);
}
#trouble li .sub_title{
	color:#13B3AC;
}
#fp_ex li{
	margin-top:20px;
	border:1px solid #BBBBBB;
	background:#F6F6F8;
	padding:10px 20px;
}
#fp_ex li a{
	display:block;
	color:#00A3D8;
	text-decoration:none;
}
#fp_ex li a:hover{
	text-decoration:underline;
}
#flow{
	margin-top:20px;
}
#flow li{
	background:#F3F2ED;
	font-size:90%;
}
#flow li span{
	color:#FFFFFF;
	background:#00306D;
	width:100px;
	text-align:center;
	display:inline-block;
	margin-right:10px;
	padding:5px 0;
}
.arrow{
	margin:5px 0;
	text-align:center;
}
}
@media screen and (max-width: 768px) {
/* スマートフォン用のスタイル記述 */
#main_text{
	margin-top:10px;
}
#lifestyle{
	margin-bottom:10px;
}
.fp_text{
	margin:10px 20px;
}
#trouble{
	margin-left:40px;
	margin-top:10px;
}
#trouble li{
	margin-bottom:5px;
	width:330px;
	float:left;
	list-style-image:url(../images/fp/circle.png);
}
#trouble li .sub_title{
	color:#13B3AC;
}
#fp_ex li{
	border-bottom:1px solid #BBBBBB;
	background:#F6F6F8;
	padding:10px 20px;
}
#fp_ex li a{
	display:block;
	color:#00A3D8;
	text-decoration:none;
}
#fp_ex li a:hover{
	text-decoration:underline;
}
#flow li{
	background:#F3F2ED;
}
#flow li span{
	color:#FFFFFF;
	background:#00306D;
	text-align:center;
	display:block;
}
.arrow{
	margin:5px 0;
	text-align:center;
}
}