@charset "utf-8";
/* CSS Document */
img{
	max-width: 100%;
	height: auto;
}

body{
	position: relative;
	font-family: 'Text Me One', sans-serif, 'Noto Sans JP';
}

main{
	padding:10px;
	line-height:1.5;
	box-shadow: 0 0 10px 2px rgba(0,0,0,0.5);
	border: 5px solid #fff;
	margin:50px 10px;
}

main h2{
	width: 300px;
	margin:20px auto 30px;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
	padding: 10px 0;
	font-size: 1.25em;
	text-align: center;
	border-radius: 10px;
}
main h3{
	color:#8A7924;
	font-size:1em;
	text-align:center;
	background:url(../images/oukan.png) no-repeat top center,
				url(../images/oukan2.png) no-repeat bottom center;
	padding:40px 0;
	font-family: 'Noto Sans JP';
	margin:50px 0 50px;
}
main .text{
	font-family: 'Noto Sans JP';
	padding:50px 0;
	margin-bottom:30px;
	text-align:center;
	background:url(../images/top_left.png) no-repeat top left,
				url(../images/top_right.png) no-repeat top right,
				url(../images/bottom_left.png) no-repeat bottom left,
				url(../images/bottom_right.png) no-repeat bottom right;
}
main .img{
	max-width:300px;
	max-height:300px;
	display:block;
	margin:0 auto;
	box-shadow: 0 0 10px 2px rgba(0,0,0,0.5);
	border: 5px solid #fff;
	margin-bottom:30px;
}
main .fee{
	text-align:left;
	font-family: 'Noto Sans JP';
	margin:70px 0 20px;
}
main .box{
	max-width:300px;
	box-shadow: 0 0 10px 2px rgba(138,121,36,0.7);
	border-radius:10px;
	padding:10px;
	margin:10px auto;
}
main .title{
	text-align:center;
	color:#8A7924;
	font-size:1.25em;
	background:url(../images/top.png) no-repeat top center,
				url(../images/bottom.png) no-repeat bottom center;
	padding:20px 0;
	margin:30px 0 20px;
}

main .nagare{
	text-align:center;
	font-family: 'Noto Sans JP';
	margin:70px 0 20px;
}
main .nagare span{
	font-size:1.25em;
	color:#8A7924;
}
.bikou{
	text-align:left;	
	margin:30px 0 50px;
}
.header{
	position: relative;
	height: 100vh;
	background: url(../images/ws.jpg) center center no-repeat;
	background-size: cover;
}
.contact{
	margin: 20px auto;
	font-family: 'Noto Sans JP';
	font-size: 1em;
	text-align: center;
	color: #999;
}

.contact a{
  display: block;
  color: #000;
  text-decoration: none;
  font-size: 50px; 
  text-align: center;
}
.contact a:hover{
  color: #F4A460;
}


@media screen and (min-width: 768px) {
	main{
	text-align:center;
	max-width: 800px;
	margin:50px auto;
	padding:20px 0 50px;
	}
	main .fee p{
	display:flex;
	justify-content: center;
	align-items: center;
	}
	main .bikou{
	display:flex;
	justify-content: center;
	align-items: center;
	}
	main .title{
	margin:70px 0 20px;	
	}
	main .text{
	width:400px;
	margin:30px auto;
	}
	main .img{
	max-width:500px;
	max-height:500px;
	}
	main .fee{
	margin:50px 150px 20px;
	}
	.bikou{
	margin:30px 100px 50px;
	}
}