/*　WebP対応の場合　*/
.webp #other_regions #subimage{
background: url(../images_webp/other_regions/subimage.webp) no-repeat center center;
}
/*　WebP非対応の場合　*/
.no-webp #other_regions #subimage{
	background: url("../images/other_regions/subimage.jpg") no-repeat center center;
}
/*　WebP対応の場合　*/
.webp #other_regions01{
background: url(../images_webp/other_regions/other_r_bg1.webp) no-repeat center center;
	background-size:cover;
}
/*　WebP非対応の場合　*/
.no-webp #other_regions01{
	background: url("../images/other_regions/other_r_bg1.jpg") no-repeat center center;
	background-size:cover;
}
#other_regions01 .container3{
	padding:80px 0 120px;
}
/*　WebP対応の場合　*/
.webp #other_regions01 .container3{
background: url(../images_webp/other_regions/other_r_bg2.webp) no-repeat center center;
	background-size:contain;
}
/*　WebP非対応の場合　*/
.no-webp #other_regions01 .container3{
	background: url("../images/other_regions/other_r_bg2.png") no-repeat center center;
	background-size:contain;
}
#other_regions01 p{
	line-height: 2;
	text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 3px #fff, 0 0 5px #fff;
	font-weight: bold;
}
#other_regions02 h3.textstyle01{
	padding: 5px 30px;
}
#other_regions02 .inner1{
	position: relative;
}
#other_regions02 .inner1 .container{
	position: relative;
	z-index: 2;
}
#other_regions02 .inner1::before{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:0;
	left:0;
	width: 38%;
	height:100%;
	z-index: 1;
}
#other_regions02 .inner1 figure{
	padding: 20px 0;
}
#other_regions02 .inner2{
	position: relative;
	padding-top:40px;
}
#other_regions02 .inner2::before{
	content: " ";
	position: absolute;
	left: 0;
	top:0;
	background: url("../images/common/bg04.png");
	width: 100%;
	height: 100px;
}
#other_regions02 .inner2 .container{
	position: relative;
	z-index: 2;
}
#other_regions03{
	position: relative;
	border-bottom:solid  #fddbe4 50px;
}
#other_regions03::before{
	content: " ";
	display: block;
	width: 100%;
	height: 450px;
	margin-bottom: 50px;
	background-size:cover !important;
}
/*　WebP対応の場合　*/
.webp #other_regions03::before{
background: url(../images_webp/other_regions/other_r_bg3.webp) no-repeat center bottom;
}
/*　WebP非対応の場合　*/
.no-webp #other_regions03::before{
	background: url("../images/other_regions/other_r_bg3.png") no-repeat center bottom;
}
#other_regions03 .inner1{
	position: relative;
}
#other_regions03 .inner1 .container{
	position: relative;
	z-index: 2;
}
#other_regions03 .inner1::before{
	content: " ";
	background: rgba(255,194,209,0.5);
	position: absolute;
	top:0;
	right:0;
	width: 38%;
	height:100%;
	z-index: 1;
}
#other_regions03 .inner2{
	padding: 50px 0 70px;
	background: url("../images/common/bg01.png");
}
#other_regions03 .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;
}
#other_regions03 .inner2 ul li:last-of-type{
	margin-bottom: 0;
}
#other_regions03 .inner2 ul li figure{
	width: 26%;
	text-align: center;
}
#other_regions03 .inner2 ul li .text{
	width: 70%;
}

#other_regions04{
	background: #fff;
	padding: 70px 0;
}
#other_regions04 .ulstyle01{
	max-width: 680px;
	margin: 0 auto;
}
#other_regions04 .ulstyle01 li{
	width: 43%;
	margin-bottom: 30px;
}
#other_regions04 .ulstyle01 li a{
	display: block;
	padding:30px 40px 30px 30px;
	color: #fff;
	background: #4eb8ef url("../images/common/list02.png") no-repeat center right 5%;
	border-radius: 0 10px 0 10px;
	transition: 0.5s;
}
#other_regions04 .ulstyle01 li a:hover{
	text-decoration: none;
	background: #56b3e3 url("../images/common/list02.png") no-repeat center right 4%;
}
/*-------------------------sp----------------------------*/
@media screen and (min-width: 767px) and (max-width: 1099px) {
	#other_regions01 .container3{
		padding-left: 5%;
		padding-right: 5%;
		background-position: center top;
	}
}

@media (max-width: 767px) {
	#other_regions01 .container3{
		padding: 30px 5% 50px;
		background-position: center top !important;
	}
	#other_regions01 p{
		line-height: 1.8;
	}
	#other_regions02 .inner1::before{
		width: 80%;
		height: 45%;
	}
	#other_regions02 .inner2::before{
		height: 60px;
	}
	#other_regions02 .inner2 h3{
		padding: 0 10%;
		margin-bottom: 10px !important;
	}
	#other_regions02 .inner2 figure{
		margin-bottom: 10px;
	}
	#other_regions02 .inner2 .boxstyle01{
		margin-bottom: 30px !important;
	}
	#other_regions02 h3.textstyle01{
		padding: 10px 30px;
	}
	#other_regions03::before{
		height: 200px;
		margin-bottom: 20px;
	}
	#other_regions03 .inner1::before{
		width: 80%;
		height: 33%;
	}
	#other_regions03 .inner1 .boxstyle01 figure{
		padding-top: 10px;
	}
	#other_regions03 .inner2 ul li{
		flex-wrap: wrap;
		padding: 20px;
		margin-bottom: 20px;
	}
#other_regions03 .inner2 ul li figure{
		width: 100%;
		padding: 0 20%;
		margin-bottom: 15px;
	}
#other_regions03 .inner2 ul li .text{
		width: 100%;
	}
	#other_regions03 .inner2{
		padding: 30px 0 30px;
	}
	#other_regions04{
		padding: 30px;
	}
	#other_regions04 .ulstyle01 li{
		width: 90%;
		margin-bottom: 20px;
	}
	#other_regions04 .ulstyle01 li:last-of-type{
		margin-bottom: 0;
	}
	#other_regions04 .ulstyle01 li a{
		padding: 20px 40px 20px 30px;
	}
}