#environment #subimage{
	background: url("../images/environment/subimage.jpg") no-repeat center center;
}
#environment01{
	background: url("../images/environment/kyouiku_bg1.jpg") no-repeat center center;
	background-size:cover;
}
#environment01 .inner1{
	position: relative;
	max-width: 1920px;
	margin:0 auto;
	padding:120px 0;

}
#environment01 .inner1 .chatlady1{
	position: absolute;
	right: 0;
	top:10%;
	width: 20%;
}
#environment01 .inner1 .chatlady2{
	position: absolute;
	left:3%;
	bottom:5%;
	width: 18%;
}
#environment01 .inner1 h2{
	line-height:1.8;
}
#environment01 .inner1 p{
	position: relative;
	z-index: 2;
	line-height: 2;
	text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 5px #fff;
}
#environment02 .inner1,#environment02 .inner3,#environment04 .inner1,#environment04 .inner2{
	position: relative;
}
#environment02 .inner1 .container,#environment02 .inner3 .container,#environment04 .inner1 .container,#environment04 .inner2 .container{
	position: relative;
	z-index: 2;
}
#environment02 .inner1::before{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:0;
	right:0;
	width: 38%;
	height:100%;
	z-index: 1;
}
#environment02 .inner2{
	background: url("../images/common/bg01.png");
}
#environment02 .inner2 ul li{
	margin-bottom:40px;
	padding: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: #e8c0d3;
	border-radius: 0 30px 0 30px;
}
#environment02 .inner2 ul li:last-of-type{
	margin-bottom: 0;
}
#environment02 .inner2 ul li figure{
	width: 26%;
	text-align: center;
}
#environment02 .inner2 ul li .text{
	width: 70%;
}
#environment02 .inner3::before{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:0;
	left:0;
	width: 38%;
	height:100%;
	z-index: 1;
}
#environment02 .inner3 figure{
	padding: 30px 0;
}

#environment03{
	position: relative;
	border-bottom:solid  #fddbe4 50px;
}
#environment03::before{
	content: " ";
	display: block;
	width: 100%;
	height: 450px;
	background-size:cover !important;
}
/*　WebP対応の場合　*/
.webp #environment03::before{
background: url(../images_webp/environment/technic_bg.webp) no-repeat center bottom;
}
/*　WebP非対応の場合　*/
.no-webp #environment03::before{
	background: url("../images/environment/technic_bg.png") no-repeat center bottom;
}

#environment03 h2.hstyle01 span.txt10{
	display: block;
	text-align: center;
}
#environment03 .boxstyle01 section{
	padding: 30px;
	background: #fff;
	box-shadow:0 0 8px #ccc;
}
#environment03 .boxstyle01 section figure{
	margin-bottom: 20px;
	text-align: center;
}
#environment03 .boxstyle01 section h3{
	margin-bottom: 10px;
	text-align: center;
}
#environment03 .boxstyle01 section .textstyle02{
	padding: 15px;
	margin-bottom: 10px;
	text-align: center;
	font-size:120%;
	background: url("../images/environment/textstyle1.png") no-repeat center center;
}
#environment03 .boxstyle01 section .point{
	margin-bottom: 20px;
	padding: 15px 15px 15px 90px;
	background:#f1dae5 url("../images/environment/point1.png") no-repeat left 20px center;
}
.cp_box {
  position: relative;
}
.cp_box label {
  position: absolute;
  z-index: 1;
	left: 50%;
  bottom: 30px;
}
.cp_box label:after {
  position: absolute;
  z-index: 2;
  bottom:0;
  left: 50%;
	width:150px;
	height:28px;
  padding:12px 10px;
	text-align: center;
  content: ' 続きを読む';
  transform: translate(-50%, 0);
		border-radius: 30px;
		background: #6eb6e7;
	color: #fff;
}
.cp_box input {
  display: none;
}
.cp_box .cp_container {
  overflow: hidden;
  height: 150px;
  transition: all 0.5s;
}
.cp_box input:checked+label {
	 bottom:0;
}
.cp_box input:checked+label:after {
  content: ' 閉じる';
}
.cp_box input:checked~.cp_container {
  height: auto;
  padding-bottom: 70px;
  /* 閉じるボタンのbottomからの位置 */

  transition: all 0.5s;
}
#environment04 .inner1{
	max-width: 1440px;
	margin:20px auto 60px;
	background-size:36% !important;
	background: url("../images/environment/hiketu_bg.png") no-repeat right top;
}
#environment04 .inner1 .boxstyle01 figure{
	padding-top: 5%;
	display: flex;
	align-items:flex-end;
}
#environment04 .inner1 .boxstyle01 figure img{
	display: block;
	width: 65%;
}
#environment04 .inner2::before{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:0;
	left:0;
	width: 38%;
	height:100%;
	z-index: 1;
}

/*-------------------------sp----------------------------*/
@media screen and (min-width: 767px) and (max-width:1099px) {
	#environment03::before{
		height: 300px;
	}
	#environment03 .boxstyle01 section .textstyle02{
		background-size:100%;
		padding: 10px 30px;
		line-height: 1.5;
	}
}

@media (max-width: 767px) {
	#environment01 .inner1{
		padding: 30px 10px;
	}
	#environment01 .inner1 .chatlady2{
		bottom: inherit;
		top:13%;
		left: 0%;
		width:22%;
		z-index: 1;
	}
	#environment01 .inner1 h2{
		position: relative;
		z-index: 2;
	}
	#environment02 .inner1::before{
		width: 80%;
		height: 35%;
	}
#environment02 .inner2 ul li{
		flex-wrap: wrap;
		padding: 20px;
		margin-bottom: 20px;
	}
#environment02 .inner2 ul li figure{
		width: 100%;
		padding: 0 20%;
		margin-bottom: 10px;
	}
#environment02 .inner2 ul li .text{
		width: 100%;
	}
	#environment02 .inner3::before{
		width: 80%;
		height: 37%;		
	}
	#environment02 .inner3 figure{
		padding: 10px 0;
	}
	#environment03{
		border-bottom-width: 30px;
	}
	#environment03::before{
		height: 200px;
	}
	#environment03 .boxstyle01 section{
		padding: 20px;
		margin-bottom: 20px;
	}
	#environment03 .boxstyle01 section:last-of-type{
		margin-bottom: 0;
	}
	#environment03 .boxstyle01 section h3{
		margin-bottom: 0;
	}
	#environment03 .boxstyle01 section .textstyle02{
		background-size:100%;
		padding: 10px 30px;
		line-height: 1.5;
	}
	#environment04 .inner1{
	background-size:68% !important;
		margin-top: 20px;
		margin-bottom: 30px;
	}
	#environment04 .inner1 .boxstyle01 figure{
		padding: 0 20% 0 0;
	}
	#environment04 .inner2::before{
		width: 80%;
		height:35%;
	}
}

/*-----------------------------------------------------*/


