@charset "utf-8";
@import url(reset.css);
@import url(base.css);
@import url(common.css);




/*-------------------------------------------------------------------
	pagetitle
-------------------------------------------------------------------*/

#wrap #pagetitle {
	background:url(../image/quality/quality_bg.jpg) center center no-repeat;
	background-size:cover;
}

#wrap #pagetitle .title {
	width:960px;
	margin:0 auto;
	padding:200px 0 150px;
}


#container {
	background:#E6F7FF;
	width:100%;
	padding:0 0 50px;
}

/*-------------------------------------------------------------------
	quality
-------------------------------------------------------------------*/

#quality {
	width:780px;
	padding:0 90px 80px;
	position:relative;
	margin:0 auto;
	background:#FFF;
}

#quality .top {
	background:url(../image/common/content_line.png) repeat-x #FFF;
	position:absolute;
	top:-80px;
	left:0;
	width:100%;
	z-index:99;
	height:80px;
}

#quality .relabox {
	position:relative;
	margin:0 0 70px;
}

#quality .relabox.end {
	margin:0;
}

#quality .relabox .number {
	position:absolute;
	top:0;
	left:0;
}

#quality .relabox h2 {
	font-size:1.8em;
	font-weight:500;
	text-align:center;
	margin:0 0 70px;
	color:#133785;
	font-weight:500;
}

#quality .relabox h2 span {
	padding-bottom:15px;
	border-bottom:3px solid #133785;
	display:inline-block;
}

#quality .relabox dl dt {
	margin:30px 0 0;
}

#quality .relabox dl dd.link {
	margin:50px 0 0;
	text-align:right;
}

#quality .relabox dl dd.link a {
	display:inline-block;
	width:250px;
	line-height:1.0;
	border:1px solid #133785;
	color:#133785;
	text-align:center;
	font-size:1.1em;
	background:#E6F7FF;
	padding:15px 0;
}

#quality .relabox dl dd.link a span {
	background:url(../image/quality/quality_arrow.png) left center no-repeat;
	padding-left:30px;
}

#quality .relabox dl dd.link a:hover {
	text-decoration:none;
	background:#CEEFFF;
}


/*===============================================
  画面の横幅が980px以下に適用
===============================================*/
@media screen and (max-width: 980px){
	
	/* pagetitle */
	
	#wrap #pagetitle {
		background-size:auto 100%;
	}

	#wrap #pagetitle .title {
		padding:100px 0 50px;
		width:94%;
	}
	
	#container {
		padding:0 0 30px !important;
	}
	
	#quality {
		width:94%;
		padding:0 0 30px;
	}

	#quality .top {
		background-size:100% auto;
		top:-20px;
		height:20px;
	}

	#quality .relabox {
		margin:0 0 50px;
		padding:10px 5% 0;
	}
	
	#quality .relabox .number {
		position:static;
		text-align:center;
		margin-bottom:10px;
	}

	#quality .relabox h2 {
		margin:0 0 20px;
	}

	#quality .relabox h2 span {
		padding-bottom:10px;
	}

	#quality .relabox dl dd.link {
		margin:30px 0 0;
		text-align:center;
	}

	#quality .relabox dl dd.link a {
		width:100%;
	}

}

/*===============================================
  画面の横幅が768px以下に適用
===============================================*/
@media screen and (max-width: 768px){
	

}

/*===============================================
  画面の横幅が640px以下に適用
===============================================*/
@media screen and (max-width: 640px){
	
	
}