*{
	max-width: 1080px;
	width: 100%;
	margin: 0 auto;
	font-family: "M PLUS 1p", sans-serif;
  font-weight: 400;
  font-style: normal;
}
body{
	position: relative;
    margin: 0 auto;
}
ul,li{
	list-style: none;
}
img{
	width: 100%;
}
#header{
	position: absolute;
	top: 1.5em;
    left: 1.5em;
	min-width: 50px;
	width: 15%;
}
#main {
    padding-top: min(100px, 10vw);
}
#main > div{
    text-align: center;
}
.map{
	width: 75%;
    margin: 3em auto;
}
.button a{
	display: flex;
	background: #664125;
	color: #FFFFFF;
	text-decoration: none;
	width: 60%;
	height: 2em;
	justify-content: center;
    align-items: center;
	border-radius: 0.5em;
	font-weight: 700;
}
.button a::after{
	font-family: "Font Awesome 5 Free";
	content: "\f0da";
	margin-left: 0.5em;
}
.sp{
	display: none;
}
.opentext{
	text-align: center;
	margin-top: 2.5em;
	font-size: clamp(14px,2vw,20px);
	line-height: 2;
}
.bg{
	background-color: #F5F0EA;
	max-width: 1080px;
	padding-bottom: 3em;
}
.ashiato{
	margin: 3em auto;
}
.ttl{
	background: url("../img/main_bg.webp");
	background-size: cover;
}
.open{
	background-color: #664125;
}

@media all and (max-width:500px){	
	#main {
		padding-top: max(6vh, 7vw);
	}
	.map{
		width: 80%;
		margin: 1.5em auto;
}
	.sp{
		display: block;
}
	.opentext{
		margin-top: 3em;
		line-height: 2;
}
	.ashiato{
		margin: 1.2em auto;
}
	.bg{
		padding-bottom: 1.5em;
}
}