@charset "utf-8";

/*CSSのリセット*/
*{
margin: 0;
padding: 0;
}
body{
background-image: url(img/bg.jpg);
background-color:#FCEED3;
color:#663300;
}
a{
text-decoration:none;
}


article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
display: block;
}

html{
line-height : 160%;
font-size:14px;
}

img{
border:0px;
}

h2{
font-size:16px;
}

header{
margin-top:20px;
width:100%;
text-align:center;
background-image: url(img/bg.png);
background-position:center top;
background-repeat:no-repeat;
-moz-background-size:cover;
background-size:cover;
}

hgroup{
float:none;
margin-top:20px;
margin-bottom:20px;
}

nav ul li a{
display:block;
}

nav{
display:none;
margin-top:50px;
}
nav ul{
overflow:hidden;
}
nav li{
float:left;
}
#menu_mobile{
display:block;
}

#contents{
margin:0 auto;
width:93.75%;
margin-top:20px;
}

.prev{
margin-bottom:20px;
}
.prev p{
font-size:16px;
margin-top:20px;
margin-bottom:20px;
line-height:180%;
}

.img_center{
margin-bottom:20px;
}

.area{
display:block;
padding:10px;
clear:both;
float:left;
border:#663300 solid 1px;
font-weight:bold;
margin-right:20px;
margin-bottom:20px;
font-size:16px;
}

#contents table {
clear:both;
border-collapse: collapse;
border: 1px #000 solid;
}
#contents td {
padding:5px;
}

.contents_img{
clear:both;
float:left;
margin-bottom:10px;
width:100%;
}
.contents_txt{
float:left;
margin-bottom:10px;
width:100%;
}

.contents_txt h2{
margin-top:10px;
margin-bottom:10px;
}
.contents_txt p{
margin-top:10px;
margin-bottom:10px;
}
.contents_img2{
clear:both;
float:left;
margin-top:10px;
margin-bottom:10px;
margin-right:10px;
width:100%;
}
.contents_txt2{
float:left;
margin-bottom:10px;
width:100%;
}

.contents_img2 h2{
margin-top:10px;
margin-bottom:10px;
}
.contents_img2 p{
margin-bottom:10px;
}

.contents_img3{
clear:both;
float:left;
margin-bottom:10px;
width:100%;
}
.contents_txt3{
float:left;
margin-bottom:10px;
width:100%;
}

.contents_txt3 h2{
margin-top:10px;
margin-bottom:10px;
}
.contents_txt3 p{
margin-top:10px;
margin-bottom:10px;
}

.contents_l{
clear:both;
float:left;
margin-right:10px;
margin-bottom:10px;
width:100%;
}
.contents_l h2{
margin-top:10px;
margin-bottom:10px;
}

.contents_r{
float:left;
margin-bottom:10px;
width:100%;
}

.contents_r h2{
margin-top:10px;
margin-bottom:10px;
}

.max{
clear:both;
margin-bottom:10px;
width:100%;
}
.max h2{
margin-top:10px;
margin-bottom:10px;
}
.max p{
margin-top:10px;
margin-bottom:10px;
}

.pic480{
/* transform: rotate(1deg); 全体を回転 */
width:360px;
background-color:#fff;
padding:10px;
/*影を消す*/
-webkit-box-shadow: 0 0 0 0 #8d8c8c;
-moz-box-shadow: 0 0 0 0 #8d8c8c;
 box-shadow: 0 0 0 0 #8d8c8c;
margin-bottom:10px;
}
.pic360{
/* transform: rotate(1deg); 全体を回転 */
width:360px;
background-color:#fff;
padding:10px;
/*影を消す*/
-webkit-box-shadow: 0 0 0 0 #8d8c8c;
-moz-box-shadow: 0 0 0 0 #8d8c8c;
 box-shadow: 0 0 0 0 #8d8c8c;
margin-bottom:10px;
}
.pic320{
/* transform: rotate(1deg); 全体を回転 */
width:320px;
background-color:#fff;
padding:10px;
/*影を消す*/
-webkit-box-shadow: 0 0 0 0 #8d8c8c;
-moz-box-shadow: 0 0 0 0 #8d8c8c;
 box-shadow: 0 0 0 0 #8d8c8c;
margin-bottom:10px;
}

.pic300{
/* transform: rotate(1deg); 全体を回転 */
width:300px;
background-color:#fff;
padding:5px;
/*影を入れる*/
-webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
-moz-box-shadow: 0 10px 8px -6px #8d8c8c;
 box-shadow: 0 10px 8px -6px #8d8c8c;
margin-bottom:10px;
}
.pic200{
/* transform: rotate(-1deg); 全体を回転 */
width:200px;
background-color:#fff;
padding:10px;
/*影を入れる*/
-webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
-moz-box-shadow: 0 10px 8px -6px #8d8c8c;
 box-shadow: 0 10px 8px -6px #8d8c8c;
margin-bottom:20px;
}
.pic150{
/* transform: rotate(-1deg); 全体を回転 */
width:150px;
background-color:#fff;
padding:10px;
/*影を入れる*/
-webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
-moz-box-shadow: 0 10px 8px -6px #8d8c8c;
 box-shadow: 0 10px 8px -6px #8d8c8c;
margin-bottom:10px;
}

.tel_postal{
letter-spacing: 0.2em;
}

#onsen{
clear:both;
text-align:center;
}
#onsen1{
float:none;
width:320px;
}
#onsen2{
float:none;
width:320px;
}
#onsen3{
float:none;
width:320px;
}

.seasons{
clear:both;
text-align:center;
}
.seasons1{
float:none;
width:310px;
margin:5px;
}
.seasons2{
float:none;
width:310px;
margin:5px;
}
.seasons3{
float:none;
width:310px;
margin:5px;
}

.im_menu{
font-size:18px;
}

#access_l{
width:100%;
margin-right:0px;
clear:both;
float:left;
margin-bottom:10px;
width:100%;
}
#access_r{
width:100%;
float:left;
margin-bottom:10px;
width:100%;
}

footer {
margin-top:20px;
width:100%;
padding : 12px 0;
color : white;
text-align : center;
background-color:#663300;
overflow: auto;
}

@media screen and (min-width:960px){
	.contents_img{
	clear:both;
	float:left;
	margin-bottom:20px;
	width:400px;
	}
	.contents_txt{
	float:left;
	margin-bottom:50px;
	width:550px;
	}

	.contents_txt h2{
	margin-top:60px;
	margin-bottom:60px;
	}
	.contents_txt p{
	margin-top:40px;
	margin-bottom:80px;
	}
	.contents_img2{
	clear:both;
	float:left;
	margin-top:40px;
	margin-bottom:20px;
	margin-right:20px;
	width:500px;
	}
	.contents_txt2{
	float:left;
	margin-bottom:50px;
	width:400px;
	}

	.contents_img2 h2{
	margin-top:60px;
	margin-bottom:60px;
	}
	.contents_img2 p{
	margin-bottom:80px;
	}

	.contents_img3{
	clear:both;
	float:left;
	margin-bottom:20px;
	width:250px;
	}
	.contents_txt3{
	float:left;
	margin-bottom:50px;
	width:700px;
	}

	.contents_txt3 h2{
	margin-top:30px;
	margin-bottom:30px;
	}
	.contents_txt3 p{
	margin-top:30px;
	margin-bottom:80px;
	}

	.contents_l{
	clear:both;
	float:left;
	margin-right:20px;
	margin-bottom:20px;
	width:460px;
	}
	.contents_l h2{
	margin-top:60px;
	margin-bottom:60px;
	}

	.contents_r{
	float:left;
	margin-bottom:50px;
	width:460px;
	}

	.contents_r h2{
	margin-top:60px;
	margin-bottom:60px;
	}

	.max{
	clear:both;
	margin-bottom:20px;
	width:100%;
	}
	.max h2{
	margin-top:30px;
	margin-bottom:30px;
	}
	.max p{
	margin-top:30px;
	margin-bottom:80px;
	}
	.pic480{
	/* transform: rotate(1deg); 全体を回転 */
	width:480px;
	background-color:#fff;
	padding:10px;
	/*影を入れる*/
	-webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
	-moz-box-shadow: 0 10px 8px -6px #8d8c8c;
	 box-shadow: 0 10px 8px -6px #8d8c8c;
	margin-bottom:20px;
	}
	.pic360{
	/* transform: rotate(1deg); 全体を回転 */
	width:360px;
	background-color:#fff;
	padding:10px;
	/*影を入れる*/
	-webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
	-moz-box-shadow: 0 10px 8px -6px #8d8c8c;
	 box-shadow: 0 10px 8px -6px #8d8c8c;
	margin-bottom:20px;
	}
	.pic320{
	/* transform: rotate(1deg); 全体を回転 */
	width:320px;
	background-color:#fff;
	padding:10px;
	/*影を入れる*/
	-webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
	-moz-box-shadow: 0 10px 8px -6px #8d8c8c;
	 box-shadow: 0 10px 8px -6px #8d8c8c;
	margin-bottom:20px;
	}

	hgroup{
	margin-left:auto;
	margin-right:auto;;
	}
	hgroup h1{
	margin-top:10px;
	margin-bottom:20px;
	}
	h2{
	margin-bottom:20px;
	}

	header{
	width:100%;
	text-align:left;
	}
	hgroup{
	float:left;
	margin-top:100px;
	margin-right:80px;
	}
	nav{
	display:block;
	}
	#menu_mobile{
	display:none;
	}
	#menu{
	text-align:center;
	width:960px;
	display:block;
	margin:0 auto;
	overflow:hidden;
	}
	#contents{
	width:960px;
	text-align:left;
	overflow:hidden;
	padding-bottom:20px;
	}
	.img_center{
	margin-left:250px;
	}
	footer{
	margin:0 auto;
	}

	#onsen{
	clear:both;
	width:960px;
	}
	#onsen1{
	float:left;
	}
	#onsen2{
	float:left;
	}
	#onsen3{
	float:left;
	}

	.seasons{
	width:960px;
	}
	.seasons1{
	float:left;
	}
	.seasons2{
	float:left;
	}
	.seasons3{
	float:left;
	}

	#access_l{
	clear:both;
	float:left;
	width:500px;
	}
	#access_r{
	width:440px;
	float:left;
	margin-bottom:50px;
	}
}