@charset "UTF-8";
/*==========================

	index

============================*/
header {
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index:1;
}
h1 {
	background: #ffffff;
	height: 250px;
	text-align: center;
	width: 250px;
    display: table-cell;
    vertical-align: middle;
}
h1 img {
	height: 118px;
}
.scrollDown {
	left: 0;
	margin: auto;
	position: absolute;
	top: 75vh;
	width: 7.5%;
}
.scrollDown a {
	display: block;
	margin: 0 auto;
	width: 15px;
	z-index: 4;
}
.ttlLine {/*コンテンツのボーダー付きタイトル*/
	margin: 0 0 20px;
}
.itemBlock a.aLabel {
	margin: 0 0 0 auto;
	padding: 0;
    line-height: 2;
    width: 150px;
}
/*==========================
	slider
============================*/
.catchcopy img {
	bottom: 0;
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0;
}
.slider {
	margin: 0 auto 180px;
	padding: 0 7.5%;
	position: relative;
	z-index: -1;
}
.full {
	position: relative;
	z-index: -1;
}
.full li {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 100vh;
  margin: 0;
}
.full .img01 {background-image: url(../img/js/slide_pc1.jpg);}
.full .img02 {background-image: url(../img/js/slide_pc2.jpg);}
.full .img03 {background-image: url(../img/js/slide_pc3.jpg);}
.full .img04 {background-image: url(../img/js/slide_pc4.jpg);}
.full .slick-dots {
	bottom: 4%;
	z-index: +1;
}
/*==========================
	layout
============================*/
.textNormal {margin: 0 0 20px;}
/*==========================
	service
============================*/
#service {
	margin: 0 7.5% 180px 14.5%;
}
#service .flexTexte {
	bottom: 10%;
	margin: auto;
	max-width: 700px;
	padding: 50px 20px 50px 0;
	position: absolute;
}
#service .flexImg {
	background: url(../img/index/img_service.jpg) no-repeat center center;
	float: right;
}
/*==========================
	lifeis
============================*/
#lifeis {
	margin: 0 14.5% 180px 7.5%;
}
#lifeis .flexTexte {
	bottom: 12%;
	margin: auto;
	max-width: 700px;
	position: absolute;
	right: 3%;
	z-index: 1;
}
#lifeis .ttlLife {
	top: -58%;
	margin: auto;
	position: absolute;
	z-index: 1;
	left: 0;
}
#lifeis .textBlock {
	padding: 30px 20px 80px 20px;
}
#lifeis .flexImg {
	background: url(../img/index/img_Life01.png) no-repeat center center;
	float: left;
	height: 660px;
	width: 68%;
}
/*==========================
	lowerlist
============================*/
#lowerlist {
	margin: 0 14.5% 180px 14.5%;
}
#lowerlist li {width: 48%;}
#lowerlist li:nth-child(odd) {float: left;}
#lowerlist li:nth-child(even) {float: right;}
#lowerlist li .imgBox {margin: 0 auto 30px;}
#lowerlist li .imgBox img {width:100%;}

@media screen and (max-width: 980px) {
	/*==========================
		service
	============================*/
	#service {margin: 0 7.5% 0 14.5%;}
	.textNormal {margin: 0 0 20px;}
	#service .flexTexte {
		bottom: 50px;
		margin: auto;
		max-width: 605px;
		padding: 20px;
		position: absolute;
		width: 60vw;
	}
	#service .flexImg {
		background: url(../img/index/img_service.jpg) no-repeat center center;
		float: right;
	}
	/*==========================
		lifeis
	============================*/
	#lifeis {
		margin: 0 14.5% 180px 7.5%;
	}
	#lifeis .textBlock {
		bottom: 20px;
		margin: auto;
		max-width: 485px;
		position: absolute;
		right: 11%;
		width: 60vw;
		z-index: 1;
	}
	#lifeis .ttlLife {
		top: -52vw;
		 margin: 0; 
		position: absolute;
		z-index: 1;
		left: -21vw;
		width: 40vw;
		/* background: rebeccapurple; */
	}
	#lifeis .flexTexte {
		padding: 30px 20px 80px 20px;
	}
	#lifeis .flexImg {
		background: url(../img/index/img_Life01.png) no-repeat center center;
		float: left;
		height: 660px;
		width: 68%;
	}
	/*==========================
		lowerlist
	============================*/
	#lowerlist {
		margin: 0 14.5% 180px 14.5%;
	}
	#lowerlist li {width: 48%;}
	#lowerlist li:nth-child(odd) {float: left;}
	#lowerlist li:nth-child(even) {float: right;}
	#lowerlist li .imgBox {margin: 0 auto 30px;}
	#lowerlist li .imgBox img {width:100%;}
}

@media screen and (max-width: 786px) {
	/*==========================

		index

	============================*/
	header {
		left: 0;
		position: relative;
		right: 0;
		top: 0;
		width: 100%;
		z-index:1;
	}
	h1 {
		/* background: #222; */
		background: #ffffff;
		height: auto;
		text-align: center;
		width: 125px;
		display: block;
		vertical-align: middle;
		position: absolute;
		top: 0;
		left: 0;
		padding: 25px 30px;
	}
	h1 img {
		height: auto;
		width: 100%;
	}
	.logo {
		width: auto;
		margin: 0 auto;
	}
	.scrollDown {
		left: 0;
		margin: auto;
		position: absolute;
		top: 94vh;
		width: 7.5%;
	}
	.scrollDown a {
		display: block;
		margin: 0 auto;
		width: 10px;
		z-index: 4;
	}
	.ttlLine {/*コンテンツのボーダー付きタイトル*/
		margin: 0 0 8%;
	}
	.itemBlock a.aLabel {
		margin: 0 0 0 auto;
		padding: 0;
		line-height: 3;
		width: 42%;
	}
	/*==========================
		slider
	============================*/
	.catchcopy img {
		bottom: 0;
		left: 0;
		margin: auto;
		position: absolute;
		right: 0;
		text-align: center;
		top: 0;
		width: 13%;
	}
	.slider {
		background:#555;
		margin: 0 auto 20%;
		padding: 0;
		position: relative;
		z-index: 0;
	}
	.full {
		background:#ffffff;
		position: relative;
		z-index: -1;
		padding: 0 0 10% 8%;
	}
	.full li {
	  background-repeat: no-repeat;
	  background-size: cover;
	  background-position: center;
	  height: 100vh;
	  margin: 0;
	}
	.full .img01 {background-image: url(../img/js/slide_pc1.jpg);}
	.full .img02 {background-image: url(../img/js/slide_pc2.jpg);}
	.full .img03 {background-image: url(../img/js/slide_pc3.jpg);}
	.full .img04 {background-image: url(../img/js/slide_pc4.jpg);}
	.full .slick-dots {
		bottom: 4%;
		z-index: +1;
		display: none;
	}
	/*==========================
		layout
	============================*/
	.textNormal {margin: 0 0 10%;}
	/*==========================
		service
	============================*/
	#service {
		margin: 0 0 10%;
		padding: 20% 0 0 0;
	}
	#service .flexTexte {
		bottom: auto;
		margin: -4% 4% 0 0;
		max-width: 100%;
		padding: 8% 4% 8% 8%;
		position: relative;
		width: auto;
	}
	#service .flexImg {
		background: url(../img/index/img_service.jpg) no-repeat left top;
		float: none;
		margin: 0 0 0 4%;
		width: auto;
	}
	/*==========================
		lifeis
	============================*/
	#lifeis {margin: 0 0 10% 0;}
	#lifeis .textBlock {
		bottom: auto;
		margin: -4% 0 0 4%;
		max-width: 100%;
		padding: 8% 4% 8% 4%;
		position: relative;
		right: auto;
		width: auto;
	}
	#lifeis .ttlLife {
		display: none;
		left: -21vw;
		margin: 0; 
		position: absolute;
		top: -52vw;
		width: 40vw;
		z-index: 1;
	}
	#lifeis .flexTexte {
		bottom: auto;
		margin: auto;
		max-width: 100%;
		padding: 0;
		position: relative;
		right: auto;
		z-index: 1;
	}
	#lifeis .flexImg {
		background: url(../img/index/img_Life01.png) no-repeat left top;
		float: none;
		height: 40vh;
		margin: 0 4% 0 0;
		width: auto;
	}
	/*==========================
		lowerlist
	============================*/
	#lowerlist {
		margin: 0 0 10% 0;
	}
	#lowerlist li {
		background: #ffffff;
		margin: 0 auto;
		padding: 0 0 10%;
		width: 92%;
	}
	#lowerlist li:nth-child(odd) {
		float: none;
		margin: 0 auto 10%;
	}
	#lowerlist li:nth-child(even) {float: none;}
	#lowerlist .textBlock {padding: 0 4%;}
	#lowerlist li .imgBox {margin: 0 auto 10%;}
	#lowerlist li .imgBox img {width:100%;}
}