@charset "utf-8";
.industryMain{
	margin:0 auto;
	padding:0 0 35px 0;
	text-align:left;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', '游ゴシック', 'YuGothic', '游ゴシック体', 'Yu-Gothic', 'メイリオ', Meiryo, 'MS Pゴシック','MS PGothic', Verdana, Arial, Helvetica, sans-serif;
	background:url(../images/main_bg.jpg) no-repeat 50% 0;
}
.industryMain:after{
	content:"";
	display:block;
	clear:both;
}
/**/
.mainTitle{
	margin:0 auto;
	width:901px;
	height:855px;
	position:relative;
	clear:both;
	overflow:hidden;
}
.mainTitle h1{
	padding: 0;
	margin:65px 0 0 0;
	clear:both;
}
.mainTitle h2{
	margin:50px 0 0 0;
	width:315px;
	font-size:140%;
	line-height:130%;
	clear:both;
}
.mainTitle p{
	margin:30px 0 0 0;
	width:315px;
	font-size:115%;
	line-height:200%;
	clear:both;
}
.layout01{
	background:url(../images/bg01.jpg) no-repeat 50% 0;
	clear:both;
	height:700px;
}
.layout01 .inner{
	margin:0 auto;
	width:901px;
	height:700px;
	color:#fff;
	position:relative;
	clear:both;
}
.layout01 .txt{
	margin:0;
	width:460px;
	position:absolute;
	right:0;
	bottom:45px;
}
.layout01 h2{
	margin:0;
}
.layout01 p{
	margin:25px 0 0 0;
	font-size:115%;
	line-height:200%;
}
.layout02{
	padding:70px 0 0 0;
	height:630px;
	background:url(../images/bg02.jpg) no-repeat 50% 0;
	clear:both;
}
.layout02 .inner{
	margin:0 auto;
	width:901px;
	height:630px;
	position:relative;
	clear:both;
}
.layout02 h2{
	margin:0 auto;
	width:901px;
	text-align:center;
}
.layout02 p{
	margin:0 143px;
	text-align:left;
	position:absolute;
	width:615px;
	bottom:65px;
	font-size:115%;
	line-height:200%;
}
.layout03{
	padding:0 0 400px 0;
	background:#fff url(../images/bg03.jpg) no-repeat 50% 100%;
	clear:both;
}
.layout03 .inner{
	margin:0 auto;
	width:901px;
	position:relative;
	clear:both;
}
.layout03 h2{
	margin:70px auto 0 auto;
	width:901px;
	text-align:center;
}
.layout03 p{
	margin:30px auto 0 auto;
	text-align:left;
	width:615px;
	font-size:115%;
	line-height:200%;
}
.showcase{
	margin:0;
	padding:30px 0 20px 0;
	background:#242415;
	border-top:solid 1px #242415;
	clear:both;
}
.showcase h2{
	margin:0 auto;
	width:901px;
	text-align:center;
	font-size:190%;
	font-weight:normal;
	line-height:120%;
	color:#ccc;
}
.showcase ul{
	margin:25px auto 0 auto;
	width:901px;
	list-style:none;
	clear:both;
}
.showcase ul:after{
	content:"";
	display:block;
	clear:both;
}
.showcase li{
	margin:10px 0;
	padding:0 15px;
	width:270px;
	height:180px;
	float:left;
	display:block;
	background:#242415;
	overflow:hidden;
}
.showcase li.showcase01{
	background:url(../images/showcase_img01.jpg) no-repeat 50% 0;

}
.showcase li.showcase02{
	background:url(../images/showcase_img02.jpg) no-repeat 50% 0;

}
.showcase li.showcase03{
	background:url(../images/showcase_img03.jpg) no-repeat 50% 0;

}
.showcase li.showcase04{
	background:url(../images/showcase_img04.jpg) no-repeat 50% 0;

}
.showcase li.showcase05{
	background:url(../images/showcase_img05.jpg) no-repeat 50% 0;

}
.showcase li.showcase06{
	background:url(../images/showcase_img06.jpg) no-repeat 50% 0;

}
.showcase li.showcase07{
	background:url(../images/showcase_img07.jpg) no-repeat 50% 0;

}
.showcase li.showcase08{
	background:url(../images/showcase_img08.jpg) no-repeat 50% 0;

}
.showcase li.showcase09{
	background:url(../images/showcase_img09.jpg) no-repeat 50% 0;

}
.showcase li a{
	padding:70px 0;
	text-align:center;
	display:block;
	width:270px;
	height:40px;
	background: url(../images/showcase_bg.png) repeat-x 0 0;
	opacity:0;
	filter: Alpha(opacity=0);
}
.showcase li a:link,
.showcase li a:visited{
	color:#fff;
	text-decoration:none;
}
.showcase li a:hover,
.showcase li a:active{
	opacity: 1;
	color:#fff;
	text-decoration:none;
}
.showcase li a span{
	visibility:hidden;
	font-size:140%;
	font-weight:bold;
	display:block;
}
.showcase li a span.icon{
	padding:2px 0 2px 24px;
	background:url(../images/zoom.png) no-repeat 0 50%;
	font-size:100%;
	font-weight:normal;
	display:inline-block;
	/* display:inline; */
	/* zoom:1; */
}
.product{
	margin:0 auto;
	padding:30px 0;
	width:901px;
}

.product h2{
	font-size:190%;
	font-weight:normal;
	line-height:120%;
	margin:0 auto;
	text-align:center;
}
.product ul{
	margin:55px auto 0 auto;
	padding:0 15px;
	width:871px;
	list-style:none;
	clear:both;
}
.product ul:after{
	content:"";
	display:block;
	clear:both;
}
.product li{
	padding:0 15px;
	width:260px;
	float:left;
	display:block;
}
.product li.left{
	float:left;
	display:block;
}
.product li.left .img{
	padding:12px 0;
	text-align:center;
}
.product li.center{
	float:left;
	display:block;
}
.product li.right .img{
	padding:0;
	text-align:center;
}
.product li.right{
	float:left;
	display:block;
}
.product li.right .img{
	padding:4px 0;
	text-align:center;
}
.product dl{
	margin:35px 0 0 0;
	padding:0;
}
.product dt{
	margin:0;
	padding:0;
}
.product dt a{
	background:url(/common/images/arrow02.gif) no-repeat 0 50%;
	clear: both;
	padding: 0 0 0 15px;
}
.product dd{
	margin:5px 0 0 0;
	padding:0;
}

.info{
	margin:0 auto;
	width:880px;
	clear:both;
}
.info:after{
	content:"";
	display:block;
	clear:both;
}
.info .left{
	padding:15px 20px;
	width:232px;
	float:left;
	border:solid 4px #e9eaea;
}
.info .left dl{
	margin:0;
	padding:0;
}
.info .left dt{
	margin:0;
	padding:15px 0 15px 50px;
	background:url(../images/info_icon01.gif) no-repeat 0 50%;
	font-size:140%;
	font-weight:bold;
	color:#12305a;
}
.info .left dd{
	margin:0;
	padding:5px 0 0 0;
}
.info .left dd a{
	background:url(/common/images/arrow02.gif) no-repeat 0 50%;
	clear: both;
	padding: 0 0 0 15px;
}
.info .right{
	padding:15px 20px;
	width:532px;
	float:right;
	border:solid 4px #e9eaea;
}
.info .right:after{
	content:"";
	display:block;
	clear:both;
}
.info .right dl{
	margin:0;
	padding:0;
	float:left;
	width:205px;
}
.info .right dt{
	margin:0;
	padding:15px 0 15px 50px;
	background:url(../images/info_icon02.gif) no-repeat 0 50%;
	font-size:140%;
	font-weight:bold;
	color:#12305a;
}
.info .right dd{
	margin:0;
	padding:5px 0 0 0;
}
.info .right .btn{
	margin:0;
	padding:0;
	float:right;
	width:300px;
	position:relative;
}
.info .right .btn img{
	position:absolute;
	bottom:0;
}

.relation{
	margin:0 auto;
	width:580px;
	clear:both;
}
.relation:after{
	content:"";
	display:block;
	clear:both;
}
.relation h2{
	font-size:190%;
	font-weight:normal;
	line-height:120%;
	margin:40px auto 15px auto;
	text-align:center;
}
.relation .left{
	padding:0;
	width:280px;
	float:left;
}
.relation .left dl{
	margin:0;
	padding:0;
}
.relation .left dt{
	margin:0;
	padding:0;
}
.relation .left dd{
	margin:0;
	padding:5px 0 0 0;
}
.relation .left dd a{
	background:url(/common/images/arrow02.gif) no-repeat 0 50%;
	clear: both;
	padding: 0 0 0 15px;
}
.relation .right{
	padding:0;
	width:280px;
	float:right;
}
.relation .right dl{
	margin:0;
	padding:0;
}
.relation .right dt{
	margin:0;
	padding:0;
}
.relation .right dd{
	margin:0;
	padding:5px 0 0 0;
}
.relation .right dd a{
	background:url(/common/images/arrow02.gif) no-repeat 0 50%;
	clear: both;
	padding: 0 0 0 15px;
}
.btnScroll01 { 
	position: absolute;  
	bottom: 40px;
	text-align:center;
	width:100%;
}
.bottomBg{
	background:#fff;
}

@media screen and (max-width: 750px) {
	.industryMain {
		background: none;
	}
	.footstepBox {
		width: auto;
	}
	.mainTitle {
		width: auto;
		padding: 0 15px;
		background: url(../images/main_bg.jpg) no-repeat -275px 100px / 250% auto;
	}
	.mainTitle h2 {
		position: relative;
		z-index: 2;
		width: auto;
		line-height: 1.5;
	}
	.mainTitle p {
		position: relative;
		z-index: 2;
		width: auto;
		line-height: 1.7;
	}
	.mainTitle h2::before,
	.mainTitle p::before {
		content: '';
		position: absolute;
		z-index: -1;
		width: 120%;
		height: 120%;
		background: #fff;
		opacity: .7;
		filter: blur(20px);
	}
	.layout01 {
		height: auto;
		padding-bottom: 60px;
		background-size: 100% auto;
		background-position: center top;
	}
	.layout01 .inner {
		width: auto;
		height: 100%;
		padding: 0 15px;
	}
	.layout01 h2 img {
		width: 100%;
		object-fit: contain;
	}
	.layout01 .txt {
		position: unset;
		width: 100%;
		padding: 142px 15px 0;
		color: #333;
	}
	.layout01 .txt p {
		margin: 12px 0 0 0;
		line-height: 1.7;
	}
	.layout02 {
		padding: 0;
		width: auto;
		height: auto;
		background: linear-gradient(180deg, #f4f4f4 5%, #d3d1d4 63%);
	}
	.layout02 .inner {
		width: auto;
		height: 100%;
		padding: 20px 15px 60px;
		background: url(../images/bg02.jpg) no-repeat center 40px / 150% auto;
	}
	.layout02 h2 {
		width: 100%;
	}
	.layout02 h2 img {
		width: 100%;
		object-fit: contain;
	}
	.layout02 p {
		position: unset;
		width: auto;
		margin: 150px 0 0;
		line-height: 1.7;
	}
	.layout03 {
		padding: 40px 15px 100px;
		/* margin-bottom: 40px; */
		background-size: 100%;
	}
	.layout03 .inner {
		width: auto;
	}
	.layout03 h2 {
		width: 100%;
		margin-top: 0;
	}
	.layout03 h2 img {
		width: 100%;
		object-fit: contain;
	}
	.layout03 p {
		width: auto;
		margin: 10px 0 0;
		line-height: 1.7;
	}
	.showcase {
		padding: 40px 15px;
	}
	.showcase h2 {
		width: 100%;
	}
	.showcase ul {
		width: auto;
		padding: 0;
	}
	.showcase li {
		float: none;
		padding: 0;
		margin: 10px auto;
	}
	.showcase li a {
		width: 100%;
		height: 100%;
	}
	.relation {
		width: auto;
	}
	.relation h2 {
		margin: 60px auto 15px;
	}
	.relation .left,
	.relation .right {
		float: none;
		margin: auto;
	}
	.relation .right {
		margin: 15px auto 0;
	}
}