/*----------------サポート体制--------------------*/
/*　WebP対応の場合　*/
.webp #support #subimage{
background: url(../images_webp/support/subimage.webp) no-repeat center center;
}
/*　WebP非対応の場合　*/
.no-webp #support #subimage{
	background: url("../images/support/subimage.jpg") no-repeat center center;
}
#support01{
	padding-top: 70px;
	padding-bottom: 80px;
}
#support01 .inner1{
	position: relative;
}
/*　WebP対応の場合　*/
.webp #support01 .inner1 .container{
background: url(../images_webp/support/support_bg1.webp) no-repeat center center;
}
/*　WebP非対応の場合　*/
.no-webp #support01 .inner1 .container{
	background: url("../images/support/support_bg1.png") no-repeat center center;
}
#support01 .inner1 .container{
	position: relative;
	z-index: 2;
	padding: 50px 0;
}
#support01 .inner1::before{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:10%;
	left:0;
	width: 25%;
	height:75%;
	z-index: 1;
}
#support01 .inner1::after{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:10%;
	right:0;
	width: 25%;
	height:75%;
	z-index: 1;
}
#support02{
	padding-bottom: 60px;
	background: #fddbe4;
}
#support02 .en img{
	margin-top: -35px;
}
#support03 h2{
	max-width: 800px;
	margin: 0 auto;
	background: url("../images/support/support_img2.png") no-repeat center center;
	background-size:cover;
	text-align: center;
	padding:60px 50px;
	border-radius: 0 20px 0 20px;
}
#support03 h2 div{
	display:inline-block;
	background: #fff;
	font-size:140%;
	padding: 20px 50px;
	border-radius: 0 20px 0 20px;
}
#support03 ul{
	justify-content: flex-start;
	background: url("../images/support/support_img3.png") no-repeat right 5% bottom 50px;
}
#support03 ul li .img{
	margin-bottom: 20px;
	position: relative;
	text-align: center;
}
#support03 ul li .img .ttl{
	position: absolute;
	left: 0;
	bottom:20px;
	width: 100%;
	margin-bottom: 0;
	padding-top: 0;
	text-align: center;
}
#support04{
	position: relative;
}
/*　WebP対応の場合　*/
.webp #support04::before{
background: url(../images_webp/support/kyouiku.webp) no-repeat center bottom;
}
/*　WebP非対応の場合　*/
.no-webp #support04::before{
	background: url("../images/support/kyouiku.png") no-repeat center bottom;
}

#support04::before{
	content: " ";
	display: block;
	width: 100%;
	height: 450px;
	background-size:cover !important;
}
#support04 .inner1{
	position: relative;
}
#support04 .inner1 .container{
	position: relative;
	z-index: 2;
}
#support04 .inner1::before{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:0;
	left:0;
	width: 38%;
	height:90%;
	z-index: 1;
}
#support04 .inner2{
	max-width: 1300px;
	margin: 0 auto;
	padding: 50px 0;
	background: url("../images/common/bg01.png");
}
#support04 .inner2 ul{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}
#support04 .inner2 ul li{
	position: relative;
	width: 46%;
	padding:90px 30px 30px;
	background: #fff;
	box-shadow: 0 0 8px #ccc;
}
#support04 .inner2 ul li .point{
	width: 106px;
	height: 74px;
	position: absolute;
	left: 50%;
	top:-2px;
	padding-top: 10px;
	margin-left: -53px;
	background: url("../images/support/point_bg.png") no-repeat center bottom;
	background-size:100%;
	color: #fff;
	line-height: 1.3;
	font-size:90%;
}
#support05{
	position: relative;
	padding-bottom: 80px;
}
#support05::before{
	content: " ";
	width: 100%;
	height: 250px;
	background: url("../images/support/message_bg.jpg") no-repeat center center;
	background-size:cover;
	display: block;
}
#support05 .message{
	margin-top: -40px;
	margin-bottom: 30px;
}
#support05 .boxstyle01 figure.fig01{
	width: 40%;
	text-align: center;
}
#support05 .boxstyle01 .text1{
	width: 58%;
}
#support05 .boxstyle01 figure.fig02{
	width: 30%;
	text-align: center;
}
#support05 .boxstyle01 .text2{
	width: 68%;
}


/*-------------------------sp----------------------------*/
@media screen and (min-width: 767px) and (max-width: 1099px) {
/*　WebP対応の場合　*/
.webp #support01{
background: url(../images_webp/support/support_bg1.webp) no-repeat center top 20px;
		background-size:100%;
}
/*　WebP非対応の場合　*/
.no-webp #support01{
		background: url("../images/support/support_bg1.png") no-repeat center top 20px;
		background-size:100%;
}

	#support01{
		padding: 30px 0;
	}
	#support01 .inner1 .container{
		background: none !important;
		padding:20px 0;
	}
	#support01 .inner1::after,#support01 .inner1::before{
		content: none;
	}
	#support01 .inner1 p{
		text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff,0 0 3px #fff;
	}
	#support03 h2 div{
		font-size:120%;
	}
	#support03 ul{
		background-size:50%;
	}
	#support04::before{
		height: 300px;
	}
	#support04 .inner2 ul li{
		padding: 90px 20px 30px;
	}
}

@media (max-width: 767px) {
	#support01{
		padding-top: 20px;
		padding-bottom: 30px;
	}
	#support01 .inner1 .container{
		padding:10px;
		background:none;
	}
	#support01 .inner1::before{
		content: none;
	}
/*　WebP対応の場合　*/
.webp #support01 .inner1::after{
background: url(../images_webp/support/support_bg1_sp.webp) no-repeat  center center;
		background-size:contain;
}
/*　WebP非対応の場合　*/
.no-webp #support01 .inner1::after{
		background: url("../images/support/support_bg1_sp.png") no-repeat  center center;
		background-size:contain;
}
	#support01 .inner1::after{
		margin-top: 10px;
		width: 100%;
		height: 150px;
		position: static;
		display: block;
	}
	#support01 .inner1 .container p br{
		display: none;
	}
	#support02{
		padding-bottom: 30px;
	}
	#support02 .en img{
		margin-top: -25px;
		width: 120px;
	}
	#support02 .boxstyle01 figure{
		margin-bottom: 10px;
	}
	#support03 h2{
		padding: 20px 30px;
	}
	#support03 h2 div{
		font-size:130%;
		padding: 15px;
		width: 90%;
		margin: 0 auto;
		text-align: center;
	}
	#support03 ul{
		padding-bottom: 150px;
		background-size:180px;
		background-position: center bottom;
	}
	#support03 ul li .img .ttl{
		bottom:10px;
	}
	.ulstyle02 li{
		width:98%;
		margin-bottom: 20px;
	}
	#support04::before{
		height: 200px;
	}
	#support04 .inner1::before{
		width: 80%;
		height: 40%;
	}
	#support04 .inner2{
		padding:30px 0;
	}
	#support04 .inner2 ul li{
		width: 98%;
		padding: 90px 20px 20px;
		margin-bottom: 20px;
	}
	#support04 .inner2 ul li:last-of-type{
		margin-bottom: 0;
	}
	#support05{
		padding-bottom: 20px;
	}
	#support05::before{
		background-position: left 90% center;
		height: 200px;
	}
	#support05 .boxstyle01 figure,#support05 .boxstyle01 .text1,#support05 .boxstyle01 .text2{
		width: 100% !important;
	}
	#support05 .boxstyle01 figure{
		margin-bottom: 20px;
	}
	#support05 .boxstyle01 figure.fig02{
		padding: 0 25%;
	}
	#support05 .message{
		margin-top: -20px;
	}
	#support05 .message img{
		width: 120px;
	}
}