header {
	background-image: none;
	height: auto;
}

#mv {
	width: 100%;
	background: url(../images/top/mv_l.jpg) no-repeat center center;
	background-size: auto 100%;
	position: relative;
	margin-bottom: 50px;
}
@media screen and (min-width: 1600px) {
	#mv {
	}
}
#mv h2 {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -213px;
	margin-left: -135px;
}
.top1 {
	width: 90%;
	margin: 0px auto 50px;
}
.top1 dt {
	text-align: center;
	font-weight: 600;
	font-size: 160%;
	color: #00579D;
	margin-bottom: 25px;
	line-height: 170%;
}
.top1 dd {
	text-align: center;
}
.top2 {
	max-width: 1090px;
	width: 90%;
	margin: 0px auto 60px;
	display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
.top2 li {
	width: 32%;
	margin-right: 2%;
	border: #018CDF 1px solid;
	padding: 20px;
	margin-bottom: 20px;
}
.top2 li:nth-child(3n) {
	margin-right: 0;
}
.top2 li dl {
	margin-bottom: 15px;
}
.top2 li dt {
	color: #0058A4;
	font-weight: 600;
	font-size: 110%;
	line-height: 160%;
	margin-bottom: 10px;
}
.top2 li dt a {
	color: #0058A4;
	font-weight: 600;
	border-bottom: #fff 1px dashed;
}
.top2 li dt a:hover {
	border-bottom: #0058A4 1px dashed;
}
.top2 li dt span {
	display: block;
	line-height: 100%;
	color: #fff;
	margin-bottom: 10px;
	padding: 5px 5px 5px 10px;
	font-size: 90%;
}
.top2 li dt span.cate1 {
	background-color: #0058A4;
}
.top2 li dt span.cate2 {
	background-color: #00B285;
}
.top2 li dt span.cate3 {
	background-color: #0085B2;
}
.top2 li dd {
	line-height: 160%;
}
.top2 li .ph {
	margin-bottom: 0;
	text-align: center;
	overflow: hidden;
    max-width: 307px;/* トリミングしたい枠の幅 */
	width: 100%;
    height: 180px;/* トリミングしたい枠の高さ */
    position: relative;
}
.top2 li .ph img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}
.top2 li dd {
  width: 100%;
  height: 70px;
  overflow: hidden;
  position: relative;
}

.top2 li dd:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 16px;
  bottom: 0;
  left: 0;
  box-shadow: 0 -6px 18px 3px #FFFFFF inset;
}
.top3 {
	width: 100%;
	margin: 0;
	display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
.top3 li {
	width: 25%;
	height: 500px;
	position: relative;
	background-size: auto 500px;
	overflow: hidden;
}
.top3 li:nth-child(1) {
	background: url(../images/top/ph01.jpg) no-repeat center center;
}
.top3 li:nth-child(2) {
	background: url(../images/top/ph02.jpg) no-repeat center center;
}
.top3 li:nth-child(3) {
	background: url(../images/top/ph03.jpg) no-repeat center center;
}
.top3 li:nth-child(4) {
	background: url(../images/top/ph04.jpg) no-repeat center center;
}
@media screen and (min-width: 2120px) {
	.top3 li:nth-child(1),
	.top3 li:nth-child(2),
	.top3 li:nth-child(3),
	.top3 li:nth-child(4) {
		background-size: 630px auto;
	}
}
.top3 li a {
	display: block;
	width: 100%;
	height: 100%;
	opacity:1;
    filter: alpha(opacity=100);
    -ms-filter: "alpha(opacity=100)";
    -moz-opacity:1;
    -khtml-opacity: 1;
}
.top3 li.ih-item.square.effect13 .img {
}
.top3 li a .plus {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -20px;
	margin-left: -20px;
	z-index: 99;
}
.top4 {
	width: 100%;
	background: url(../images/top/ill01.png) no-repeat left 100% bottom 0;
	background-size: 50% auto;
	background-color: #0096E7;
	padding: 40px 0 50px;
	margin-bottom: 40px;
}
.top4 .t4_in {
	max-width: 1150px;
	width: 90%;
	margin: 0px auto;
	color: #fff;
}
.top4 .t4_in h6 {
	text-align: center;
	font-weight: 600;
	font-size: 150%;
}
.top4 .t4_in .txt1 {
	text-align: center;
	font-weight: 500;
	margin-bottom: 50px;
}
.top4 .t4_in .txt2 {
	max-width: 450px;
	width: 50%;
	margin-bottom: 80px;
}
.top4 .t4_in .btn {
	max-width: 450px;
	width: 50%;
}
.top4 .t4_in .btn a {
	display: block;
	border: #fff 1px solid;
	text-align: center;
	color: #fff;
	font-size: 120%;
	font-weight: 400;
	line-height: 100%;
	padding: 20px 0;
	border-radius: 3px;
    -webkit-border-radius: 3px;/* for Safari and Chrome 対応*/
    -moz-border-radius: 3px;/* for Firefox 対応*/
}
.top4 .t4_in .btn a:hover {
}
.top5 {
    padding: 10px;
    overflow: hidden;
    position: relative;
}
.top5 ul {
	list-style: none outside none;
    float: left;
    margin: 0 0 0 0;
    padding: 0;
    position: relative;
    left: 50%;
}
.top5 li {
	float: left;
    margin-right: 5px;
    padding: 5px 10px;
    position: relative;
    left: -50%;
}
.robotics_banner {
	max-width: 560px;
	width: 90%;
	margin: 0px auto 70px;
}










@media screen and (max-width: 850px) {
	/* ---------------------------------------
	header
	--------------------------------------- */
	
	/* ---------------------------------------
	footer
	--------------------------------------- */
	
	
	/* ---------------------------------------
	
	--------------------------------------- */
	.top1 dt {
		font-size: 150%;
	}
	.top2 li dt br {
		display: none;
	}
	.top2 li dt {
		font-size: 100%;
	}
	.top3 li {
		width: 50%;
		height: 400px;
	}
	.ih-item.square.effect13 .info h5 {
		margin: 130px 0 0 0;
	}
	.ih-item.square.effect13 .info p {
		padding: 60px 0 0;
	}
	.top4 {
		padding: 40px 0 40px;
	}
	.top4 .t4_in .txt1 {
		margin-bottom: 30px;
	}
	.top4 .t4_in .txt2 {
		max-width: none;
		width: 100%;
		margin-bottom: 60px;
	}
	.top4 .t4_in .btn {
		max-width: none;
		width: 60%;
	}
}










@media screen and (max-width: 700px) {
	/* ---------------------------------------
	header
	--------------------------------------- */
	
	/* ---------------------------------------
	footer
	--------------------------------------- */
	
	/* ---------------------------------------
	
	--------------------------------------- */
	.top1 dt {
		font-size: 140%;
	}
	.top2 li,
	.top2 li:nth-child(3n) {
		width: 49%;
		margin-right: 2%;
		margin-bottom: 10px;
	}
	.top2 li:nth-child(2n) {
		margin-right: 0;
	}
	.top3 li {
		width: 100%;
		height: 300px;
	}
	.ih-item.square.effect13 .info h5 {
		margin: 80px 0 0 0;
	}
	.ih-item.square.effect13 .info p {
	}
	.top3 li:nth-child(1),
	.top3 li:nth-child(2),
	.top3 li:nth-child(3),
	.top3 li:nth-child(4) {
		background-size: 700px auto;
	}
	.top5 {
		position: static;
		padding: 0;
	}
	.top5 ul {
		float: none;
		position: static;
	}
	.top5 li {
		float: none;
		margin-right: 0;
		margin-bottom: 15px;
		padding: 0;
		position: static;
		text-align: center;
	}
}










@media screen and (max-width: 480px) {
	/* ---------------------------------------
	header
	--------------------------------------- */
	
	/* ---------------------------------------
	footer
	--------------------------------------- */
	
	/* ---------------------------------------
	
	--------------------------------------- */
	#mv {
		background: url(../images/top/mv_s.jpg) no-repeat center center;
		background-size: auto 100%;
	}
	.top1 dt {
		font-size: 110%;
		margin-bottom: 25px;
		text-align: left
	}
	.top1 dt br {
		display: none;
	}
	.top1 dd {
		font-size: 95%;
		text-align: left;
	}
	.top2 {
		width: 85%;
		margin: 0px auto 60px;
	}
	.top2 li,
	.top2 li:nth-child(2n),
	.top2 li:nth-child(3n) {
		width: 100%;
		margin-right: 0;
		margin-bottom: 10px;
	}
	.top3 li {
		width: 100%;
		height: 250px;
	}
	.ih-item.square.effect13 .info h5 {
		margin: 55px 0 0 0;
	}
	.ih-item.square.effect13 .info p {
	}
	.top3 li:nth-child(1),
	.top3 li:nth-child(2),
	.top3 li:nth-child(3),
	.top3 li:nth-child(4) {
		background-size: 480px auto;
	}
	.top4 {
		background-size: 60% auto;
	}
	.top4 .t4_in .txt2 {
		margin-bottom: 30px;
	}
	.top4 .t4_in .btn {
		width: 75%;
	}
}