@charset "Shift_JIS";

#contentsWrap{
	width:100%;
	max-width: 1680px;
	min-width: 960px;
	margin:0 auto;
	background: url("../../images/location/01/back.png") center top;
	background-size: cover;
	padding-bottom:40px;
}

#contentsWrap .caption{
	color:#000;
}

.fullimg img{
	width:100%;
}

.fullimg .imgcaption{
	width:96%;
	max-width: 1280px;
	margin:10px auto 0;
}

.fullimg .imgcaption .caption{
	text-align: right;
}

.section{
	width:96%;
	max-width: 1280px;
	margin:130px auto 0;
}

.section h3{
	width:804px;
	margin:0 auto;
	padding-bottom:10px;
	border-bottom:1px solid #231815;
}

.section .sectionInner .inner{
	margin-top:40px;
}

#sapporo{
	position: relative;
}

#sapporo::after{
	position: absolute;
	content: '';
	display: block;
	width:60%;
	height:294px;
	z-index:1;
	left:0;
	top:286px;
	background: rgba(234,229,218,.5);
}

#sapporo .section{
	position: relative;
	z-index:2;
}

#sapporo .fbox{
	margin-top:40px;
	position: relative;
	z-index:0;
}

#sapporo .txtBox{
	width:960px;
	height:506px;
	margin:0 auto;
}

#sapporo .txtBox p{
	margin-top:75px;
}

#sapporo .imgBox{
	width:50%;
	max-width: 640px;
	position: absolute;
	right:0;
	top:0;
}

#sapporo .fullimg{
	margin-top:110px;
}

#sapporoarea{
	position: relative;
}

#sapporoarea::after{
	position: absolute;
	content: '';
	display: block;
	width:60%;
	height:374px;
	z-index:1;
	right:0;
	top:155px;
	background: rgba(113,178,183,.2);
}

#sapporoarea .section{
	position: relative;
	z-index:2;
}
#sapporoarea h4 img{
	margin:0 0 0 auto
}

#sapporoarea .fbox{
	margin-top:40px;
	position: relative;
}

#sapporoarea .fbox .txtBox{
	width:960px;
	margin:0 auto;
}

#sapporoarea .fbox .txtBox h5 img{
	margin:0 0 0 auto;
}

#sapporoarea .fbox .txtBox p.pc{
  width:410px;
	margin:80px 0 0 auto;
}

#sapporoarea .fbox .img1{
	position: absolute;
	left:0;
	top:0;
	width:50%;
}

#sapporoarea .fbox .img1 img{
	width:100%;
}

#sapporoarea .fbox .img2{
	position: absolute;
	right:5%;
	top:340px;
	width:33.3%;
}

#sapporoarea .fbox .img2 img{
	width:100%;
}

#sapporoarea .fbox .img3{
	margin:300px 0 0 210px;
}

#susukinoarea{
	position: relative;
}

#susukinoarea::after{
	position: absolute;
	content: '';
	display: block;
	width:60%;
	height:374px;
	z-index:1;
	left:0;
	top:200px;
	background: rgba(209,136,145,.2);
}

#susukinoarea .section{
	position: relative;
	z-index:2;
}

#susukinoarea .fbox{
	margin-top:40px;
	position: relative;
	z-index:0;
}

#susukinoarea .txtBox{
	width:960px;
	height:506px;
	margin:0 auto;
}

#susukinoarea .txtBox p{
	margin-top:75px;
}

#susukinoarea .fbox .img1{
	position: absolute;
	right:0;
	top:0;
	width:50%;
}

#susukinoarea .fbox .img1 img{
	width:100%;
}

#susukinoarea .fbox .img2{
	position: absolute;
	left:5%;
	top:425px;
	width:33.3%;
}

#susukinoarea .fbox .img2 img{
	width:100%;
}

#susukinoarea .fbox .img3{
	width:284px;
	margin:140px 210px 0 auto;
}

#maruyama{
	position: relative;
}

#maruyama .section{
	position: relative;
	z-index:2;
}

#maruyama h3{
	width:594px;
}

#maruyama .fullimg{
	margin-top:40px;
}

#maruyama .fbox{
	margin-top:90px;
	position: relative;
	z-index:0;
	display:flex;
	justify-content: space-between;
}

#maruyama .txtBox p{
	margin-top:75px;
}

#maruyamapark{
	position: relative;
	padding-bottom:30px;
}

#maruyamapark .section{
	position: relative;
	z-index:2;
}

#maruyamapark .fbox{
	margin-top:40px;
	position: relative;
	z-index:0;
}

#maruyamapark .txtBox{
	width:960px;
	height:506px;
	margin:0 auto;
}

#maruyamapark .fbox .txtBox p.pc{
  width:410px;
	margin:0 0 0 auto;
}

#maruyamapark .fbox .imgBox{
	position: absolute;
	left:0;
	top:0;
	width:50%;
}

#sapporoarea .fbox .img1 img{
	width:100%;
}

#parkmap{
	display:flex;
	justify-content: space-between;
	flex-wrap: wrap;
	position: relative;
	margin-top:40px;
}

#parkmap .prot{
	margin-top:35px;
}

#parkmap .prot#prot1{
	margin-top:0;
	position: absolute;
	right:0;
	top:-200px;
}
/**************************************************************************************/
/**************************************************************************************/
/* SP Site*/
/**************************************************************************************/
/**************************************************************************************/
@media screen and (max-width: 640px) {
	
	#contentsWrap{
		min-width: inherit;
	}
	
	.fullimg .imgcaption{
		width:90%;
	}
	
	.section{
		width:100%;
		margin:80px auto 0;
	}

	.section h3{
		width:90% !important;
	}

	.section .sectionInner .inner{
		margin-top:30px;
	}

	#sapporo::after{
		display: none;
	}

	#sapporo .txtBox{
		width:100%;
		height:auto;
	}
	
	#sapporo .txtBox h5{
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}

	#sapporo .txtBox p{
		margin-top:5%;
		padding:5% 5% 10%;
		background: rgba(234,229,218,.5);
	}

	#sapporo .imgBox{
		width:78.5%;
		max-width: 502px;
		position: static;
		margin:-5% auto 0;
	}

	#sapporo .fullimg{
		width:90%;
		margin: 40px auto 0;
	}
	
	#sapporo .phbox img{
		width:56.6%;
	}
	
	#sapporoarea::after{
		display: none;
	}
	
	#sapporoarea .fbox .txtBox{
		width:100%;
	}
	
	#sapporoarea .txtBox h5{
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}

	#sapporoarea .txtBox p{
		margin-top:5%;
		padding:5% 5% 20%;
		background: rgba(113,178,183,.2);
	}

	#sapporoarea .fbox .img1{
		position: static;
		width:78.2%;
		max-width: 500px;
		margin:-10% auto 0;
	}

	#sapporoarea .fbox .img2{
		position: static;
		width:78.2%;
		max-width: 500px;
		margin:20px auto;
	}

	#sapporoarea .fbox .img2 img{
		width:70.0%;
		margin: 0 0 0 auto;
	}

	#sapporoarea .fbox .img3{
		width:78.2%;
		max-width: 500px;
		margin:20px auto;
	}
	
	#sapporoarea .fbox .img3 img{
		width:56.8%;
		margin: 20px 0 0;
	}
	
	#susukinoarea::after{
		display: none;
	}
	
	#susukinoarea .fbox .txtBox{
		width:100%;
		height:auto;
	}
	
	#susukinoarea .txtBox h5{
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}

	#susukinoarea .txtBox p{
		margin-top:5%;
		padding:5% 5% 20%;
		background: rgba(209,136,145,.2);
	}
	
	#susukinoarea .fbox .img1{
		position: static;
		width:78.2%;
		max-width: 500px;
		margin:-10% auto 0;
	}

	#susukinoarea .fbox .img2{
		position: static;
		width:78.2%;
		max-width: 500px;
		margin:20px auto;
	}

	#susukinoarea .fbox .img2 img{
		width:70.0%;
		margin: 0 auto 0 0;
	}

	#susukinoarea .fbox .img3{
		width:78.2%;
		max-width: 500px;
		margin:20px auto;
	}
	
	#susukinoarea .fbox .img3 img{
		width:56.8%;
		margin: 20px 0 0 auto;
	}

	#maruyama::after{
		display: none;
	}

	#maruyama .fullimg{
		width:90%;
		margin:30px auto 0;
	}

	#maruyama .fbox{
		margin-top:60px;
		height:auto;
		display: block;
	}

	#maruyama .txtBox{
		width:100%;
		margin:0 auto;
	}

	#maruyama .txtBox p{
		margin-top:30px;
	}
	
	#maruyama .imgBox{
		margin-top:30px;
	}

	#maruyamapark .fbox{
		width:90%;
		margin:30px auto 0;
	}

	#maruyamapark .txtBox{
		width:100%;
		height:auto;
	}

	#maruyamapark .fbox .imgBox{
		position: static;
		width:100%;
		margin-top:30px;
	}

	#sapporoarea .fbox .img1 img{
		width:100%;
	}

	#parkmap{
		margin-top:30px;
	}

	#parkmap .prot{
		margin-top:35px;
		width:46.9%;
	}

	#parkmap .prot#prot1{
		margin-top:35px;
		position: static;
	}
}