/* =========================
   概要紹介ページで使うスタイル
========================= */

.category {
	background:url(../img/bg_cate_ttl.jpg) no-repeat 0 0;
	background-size:cover;
}

section.services {
	padding:2rem 0 10rem;
}

section.services .title {
	margin-bottom:7rem;
	line-height:1.3;
}

.attention {
	margin-top:6.5rem;
	text-align:center;
}

.services .container img {
	max-width:100%;
}


/* ========= バナー ========= */

.bnr_area, .bnr_area ul {
	width:100%;
	max-width:1400px;
	margin:0 auto;
}

.bnr_area:after {
	clear: both;
	height: 0;
	line-height: 0;
	visibility: hidden;
	display: block;
	content:"";
}

.bnr_area ul li a{
	width:33.3%;
	height:180px;
	background-size:contaion;
	float:left;
	position: relative;
}

.bnr_area ul li a:first-child { width:33.3%; }
.bnr_area ul li a:hover { opacity:0.8; }

.bnr_area ul li.bnr_01 a { background:url(../../img/bnr_01.jpg) no-repeat 0 0; }
.bnr_area ul li.bnr_02 a { background:url(../../img/bnr_02.jpg) no-repeat 0 0; }
.bnr_area ul li.bnr_03 a { background:url(../../img/bnr_03.jpg) no-repeat 0 0; }

.bnr_area ul li a span{
	color:#fff;
	font-size:2rem;
	letter-spacing:0.08em;
	position: absolute;
	top: 50%;
	left: 30%;
	transform: translate(-20%, -50%);
	webkit-transform: translate(-20%, -50%);/* - Safari用 */
	/*white-space:nowrap;*/
}

.bnr_area ul li a span:before{
	font-family: 'FontAwesome' ;
	padding-right: 5px ;
	content: '\f105' ;
	color:#fff;
}

@media screen and (max-width: 1100px) {
	.bnr_area ul li a span{ 
		left: 30%;
		transform: translate(-20%, -50%);
		webkit-transform: translate(-20%, -50%);/* - Safari用 */ 
	}
}