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

/*===========================================
　LAYOUT,BASE
===========================================*/
#main{
	padding:0;
}
#main h1{
	background:none;
	height:auto;
	line-height:auto;
	color:#fff;
	padding-left:20px;
	margin-bottom:50px;
}
#main h2{
	border-left:none;
	line-height:1.5;
	padding-left:0;
}
#contents{
	background-color:#fff;
}
#contents-in{
	width:100%;
	padding-bottom:0;
}

@media screen and (min-width:992px){
#global-header{
	height:92px;
	border-bottom:none;
}
}
/*===========================================
　MAIN VISUAL
===========================================*/
#main-visual{}
#image-gallery{
	width:100%;
	position:relative;
}
#image-gallery .image-list li{
	position:absolute;
	top:0;
	left:0;
	width:100%;
}
#image-gallery .image-list li:first-child{
	position:relative;
}
#image-gallery .image-list li .caption{
	position:absolute;
	top:20px;
	left:10px;
}
#image-gallery .image-list li .caption h1{
	line-height:1.7;
	font-size:20px;
	font-size:2.0rem;
	letter-spacing:0.03em;
}
#image-gallery .image-list li .caption h1 span{
	background:rgba(255,255,255,0.7);
	padding:0.15em 0.3em;
}
@media screen and (min-width:600px){
	#image-gallery .image-list li .caption h1{
		font-size:24px;
		font-size:2.4rem;
	}
}
@media screen and (min-width:992px){
	#image-gallery .image-list li .caption{
		position:absolute;
		top:35px;
		left:50%;
		width:960px;
		margin-left:-480px;
	}
	#image-gallery .image-list li .caption h1{
		font-size:31px;
		font-size:3.1rem;
	}
}
@media screen and (min-width:1056px){
	#image-gallery .image-list li .caption{
		width:1024px;
		margin-left:-512px;
	}
	#main-visual{
		background-color:#000;
	}
	#image-gallery{
		max-width:1400px;
		margin:0 auto;
	}
}

/*===========================================
　BUSINESS ITEM1
===========================================*/
#main .business-item1 h2{
	font-size:1.7px;
	font-size:1.7rem;
}
@media screen and (min-width:992px){
	#main .business-item1 h2{
		font-size:28px;
		font-size:2.8rem;
	}
}
.business-item1 ul li{
	margin-bottom:20px;
}
.business-item1 ul li .visual{
	position:relative;
}
.business-item1 ul li a{
	background-color:#fff;
	/*box-shadow:0 4px 4px rgba(0,0,0,0.15);*/
	border-top:4px solid #e60000;
	display:block;
	text-decoration:none;
	-webkit-transition:all 0.2s ease-out;
	   -moz-transition:all 0.2s ease-out;
	        transition:all 0.2s ease-out;
}
.business-item1 ul li .caption{
		padding:10px;
}
.business-item1 ul li h3{
	color:#666;
	font-weight:bold;
	font-size:17px;
	font-size:1.7rem;
	margin:8px 0;
}
.business-item1 ul li h3:after{
	content:"\f105";
	font-family:'FontAwesome';
	float:right;
	font-size:85%;
	color:#e90000;
}
.business-item1 ul li p{
	color:#333;
}

@media screen and (min-width:600px){
.business-item1 ul{
		margin-left:-20px;
	}
.business-item1 ul:after{
	content:"";
	display:table;
	clear:both;
}
.business-item1 ul li{
	width:33.3333%;
	padding-left:20px;
	margin-bottom:20px;
	float:left;
}
}
@media screen and (min-width:992px){
	.business-item1 ul{
		margin-left:-20px;/*1024PXで1PX差分あり*/
	}
	.business-item1 ul li{
		width:25%;
		padding-left:21px;
		margin-bottom:21px;
	}
	.business-item1 ul li .visual:after{
		content:"";
		width:100%;
		height:100%;
		display:block;
		position:absolute;
		top:0;
		left:0;
		-webkit-transition:background 0.3s ease-out;
		   -moz-transition:background 0.3s ease-out;
				transition:background 0.3s ease-out;
		background:rgba(0,0,0,0);
	}
	.business-item1 ul li a:hover .visual:after{
		background:rgba(0,30,220,0.3);
	}
}

/*===========================================
　business-item2
===========================================*/
.business-item2{
	padding-top:0;
}
.business-item2 h2{
	display:none;
}
.business-item2 ul li{
	margin-bottom:21px;
	position:relative;
}
.business-item2 ul li .caption{
	float:left;
	height:80px;
	display:table;
	width:100%;
	padding-right:5px;
	padding-right:110px;
}
.business-item2 ul li .visual{
	position:absolute;
	top:0;
	right:0;
	width:80px;
	height:80px;
	overflow:hidden;
}
.business-item2 ul li .visual img{
	width:100%;
	height:auto;
}
.business-item2 ul li a{
	width:100%;
	display:block;
	background-color:#aaa;
	color:#fff;
	text-decoration:none;
	display:table;
	/*box-shadow:0 4px 4px rgba(0,0,0,0.15);*/
}
.business-item2 ul li.b1 a{background-color:#29abe2;}
.business-item2 ul li.b2 a{background-color:#eb0000;}
.business-item2 ul li.b3 a{background-color:#39b54a;}

.business-item2 ul li h3{
	margin:0;
	font-size:17px;
	font-size:1.7rem;
	line-height:1.4;
	color:#fff;
	text-decoration:none;
	display:block;
	vertical-align:middle;
	background:url(../images/common/arr-r.png) no-repeat center right;
	background-size:10px;
	padding-left:10px;
	display:table-cell;
	vertical-align:middle;
}

@media screen and (min-width:600px){
	.business-item2 ul li .caption{
		width:100%;
		height:100px;
		padding-left:10px;
		padding-right:210px;
	}
	.business-item2 ul li .visual{
		width:200px;
		height:100px;
	}
}
@media screen and (min-width:992px){
	.business-item2 ul{
		margin-left:-21px;
	}
	.business-item2 ul li{
		width:50%;
		padding-left:21px;
		float:left;
		margin-bottom:21px;
		position:relative;
	}
	.business-item2 ul li a{
		-webkit-transition:all 0.2s ease-out;
		   -moz-transition:all 0.2s ease-out;
				transition:all 0.2s ease-out;
	}
	.business-item2 ul li.b1 a:hover{background-color:rgb(34,140,185);}
	.business-item2 ul li.b2 a:hover{background-color:rgb(193,0,0);}
	.business-item2 ul li.b3 a:hover{background-color:rgb(47,148,61);}

	.business-item2 ul:after{
		content:"";
		display:table;
		clear:both;
	}
	.business-item2 ul li .caption{
		width:100%;
		height:88px;
		padding-left:5px;
		padding-right:190px;
	}
	.business-item2 ul li .visual{
		width:176px;
		height:auto;
	}
}

/*===========================================
　business-item1,2 共通
===========================================*/
.business-item1 ul li a:hover,
.business-item2 ul li a:hover{
	box-shadow:0 1px 5px rgba(0,0,0,0.4);
}

/*===========================================
　NEWS
===========================================*/
#news{
	position:relative;
}
#news h2{
	background:url(../images/common/ttl_news.png) no-repeat;
	background-size:94px;
	text-indent:-9999px;
	overflow:hidden;
	margin-bottom:10px;
	height:28px;
}
#news .see-all a{
	color:#e90000;
	text-decoration:none;
}
#news .see-all a:before{
	content:"\f105";
	font-family:fontAwesome;
	padding-right:0.5em;
	-webkit-transition:all 0.3s ease-out;
	   -moz-transition:all 0.3s ease-out;
	        transition:all 0.3s ease-out;
}
#news .see-all a:hover:before{
	padding-left:0.3em;
	padding-right:0.2em;
}


