@charset "utf-8";

#main > .inner{
	padding-top: 210px;
}

#main .h.title{
	background-image: url(../img/bg_h_01.jpg);
}

#area_01 .row.row_01{
	margin-top: 35px;
}

#area_01 .col.col_01{
	width: 455px;
}

#area_01 .h.h_01{
	background: #002886 url(../img/arrow_01.png) no-repeat scroll right center;
	font-size: 14px;
	color: #fff;
	line-height: 1.0;
}

#area_01 .h.h_01 > a{
	display: block;
	padding: 18px 20px;
}

#area_01 .h.h_02{
	border-bottom: 1px dotted #ccc;
	padding: 12px 10px 12px 30px;
}

#area_01 .ico.ico_01 > li{
}

#area_01 .ico.ico_01.cols > li{
	float: left;
	width: 48%;
}

#area_01 .ico.ico_01.cols > li.odd{
	margin-right: 4%;
}

#area_01 .ico.ico_01 > li > a{
	display: block;
	padding: 14px 10px 14px 30px;
	background: transparent url(../img/ico_arrow_01.png) no-repeat scroll 10px center;
	font-size: 13px;
	border-bottom: 1px dotted #ccc;
}

#area_01 .ico.ico_02 > li{
}

#area_01 .ico.ico_02 > li > a{
	display: block;
	padding: 12px 10px 12px 40px;
	background: transparent url(../img/ico_arrow_02.png) no-repeat scroll 30px center;
	font-size: 13px;
	border-bottom: 1px dotted #ccc;
}
@media screen and (min-width: 768px) { /* ---- PC ---- */
	#area_01 .ico.ico_01 > li > a:hover,
	#area_01 .ico.ico_02 > li > a:hover{
		text-decoration: underline;
	}
}

@media screen and (max-width: 740px){
	#main > .inner{
		padding-top: 0;
	}

	#area_01 .row.row_01{
		margin-top: 0;
	}

	#area_01 .row.row_01 > .leftside,
	#area_01 .row.row_01 > .rightside{
		float: none;
		margin-top: 30px;
	}

	#area_01 .col.col_01{
		width: auto;
	}

	#area_01 .h.h_01{
		background-image: url(../img/arrow_01_sp.png);
		background-size: 20px auto;
	}

	#area_01 .ico.ico_01 > li{
	}
	#area_01 .ico.ico_01 > li a{
		background-image: url(../img/ico_arrow_01_sp.png);
		background-size: 11px auto;
	}

	#area_01 .ico.ico_02 > li a{
		background-image: url(../img/ico_arrow_02_sp.png);
		background-size: 4px auto;
	}
}