@charset "utf-8";
body {
	background-image: url(images/bg_w.jpg);
    color: #34271d;
}
body,h1,h2,h3,h4,h5,h6 {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

img {
    max-width: 100%;
}
section {
	margin: 60px 0 120px;
}
.hfbg {
	background-color: #39302B;
	background-image: url(images/header_bg.jpg);
	padding: 30px 0;
	min-height: 50px;
	color: #fff;
}
.hfbg.header {
	margin: 0 0 60px;
	-webkit-box-shadow: inset 0px 17px 40px rgba(0,0,0,0.65),0px 0px 18px rgba(0,0,0,0.85);
	box-shadow: inset 0px 17px 40px rgba(0,0,0,0.65),0px 0px 18px rgba(0,0,0,0.85);
}
.hfbg.footer {
    margin: 60px 0 15px;
}
.sitelogo {
	float: left;
	width: auto;
}
.sitelogo img {
	max-width: 100%;
}
#header {
    position: relative;
}
#header .eng a {
    color: #ddd;
    margin: -18px 0 10px;
    font-family: 'Merriweather', serif;
}
#header .mobilenav {
		display: none;
	}
#header .mainnav {
	position: relative;
	margin: 13px -15px 0 0;
}
#header .mainnav ul {
    padding: 0;
	list-style-type: none;
	margin: 0;
	list-style: none outside none;
	float: right;
	position: relative;
}
#header .mainnav ul li {
    height: 43px;
    margin: 0 15px;
    display: inline-block;
    text-indent: -9999px;
	float: left;
	position: relative;
}

a #information {
    width: 196px;
	background-image: url(images/navi_infomation.png);
    background-position: left top;
}
a #nature {
    width: 120px;
	background-image: url(images/navi_nature.png);
    background-position: left top;
}
a #access {
    width: 90px;
	background-image: url(images/navi_access.png);
    background-position: left top;
}
a #livecam {
    width: 128px;
	background-image: url(images/navi_livecam.png);
    background-position: left top;
}
a:hover #information,
a:hover #nature,
a:hover #access,
a:hover #livecam {
	background-position: left bottom;
}

#introduction {
    margin-top: 0px;
}
#introduction h1,
#ryokan h1 {
    text-align: center;
    margin: 60px auto 40px;
}

#introduction p,
#yado .description {
    text-align: center;
    font-size: 1.3em;
    line-height: 1.6em;
}
#introduction .slide {
	-webkit-box-shadow: 0px 5px 18px 1px rgba(0,0,0,0.50);
	box-shadow: 0px 5px 18px 1px rgba(0,0,0,0.50);
	margin-bottom: 60px;
}

.yado h2 {
    margin: 15px auto 3px;
    font-size: 2.4em;
/*    font-weight: 700;*/
}
#ryokan .yado p {
    margin: 0 0 30px;
}
.yado.third {
	margin-bottom: 35px;
}
#nature .sepa {
    margin-bottom: 60px;
}
.yado img {
	-webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.30);
	box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.30);
/*	border: 6px solid #F0F0F0;*/
}
.yado h2 img {
	-webkit-box-shadow: none;
	box-shadow: none;
}
.yumegurigo {
	background-image: url(images/yumeguri_bg.png);
	background-size: contain;
    background-repeat: no-repeat;
	min-height: 420px;
    padding: 25px;
}
.yumeguri.title {
    max-width: 90%;
	text-align: center;
	margin: 30px auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.yumeguri.time button {
    font-size: 1.3em;
    width: 6em;
}

.news h1,
.yumegurichou h1,
.shidouin h1 {
    margin: auto 0 6px;
}
/** fb **/
.news .fb-page {
    /* background-color: #fff; */
    /* border-radius: 8px; */
    margin-bottom: 20px;
}
.news .fb_iframe_widget,
.news .fb_iframe_widget span,
.news .fb_iframe_widget iframe[style]{ /* max-width: 100%!important; */ }

@media (max-width:1199px){
	.news .fb_iframe_widget span {
		height: 468px !important;
	}
	.news .fb_iframe_widget span iframe {
		height: 468px !important;
		width: 100% !important;
	}
	.news .fb_iframe_widget span iframe #facebook body div div #u_0_0 div div#u_0_p._h7l {
		height: 404px !important;
		max-height: 404px !important;
		width: 100% !important;
	}
	.news .fb_iframe_widget span iframe #facebook body div div #u_0_0 div {
		width: 100% !important;
	}
}



.yumegurichou {
    background-color: rgba(255,255,255,0.35);
	padding: 8px 20px 8px;
	border-radius: 8px;
}
.yumegurichou-photo {
	float: right;
}
.shidouin {
    margin-top: 25px;
	padding: 8px 15px 5px;
	border-radius: 8px;
	background-color: rgba(0, 0, 0, 0.05);
}

#footer .yado a {
    color: #fff;
}
#footer .yado dl,
#footer .yado ul{
    padding: 0;
    margin: 0;
}
#footer .yado dt {
	clear: both;
	font-size: 1.2em;
	font-weight: normal;
}
#footer .yado dd {
    font-size: 0.8em;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 3px;
}
#footer .yado ul {
    list-style: none;
}
#footer .yado li {
    font-size: 1.1em;
    margin-bottom: 0.8em;
}
#footer .sangyou {
	text-align: right;
	clear: both;
	padding-top: 30px;
}

#yado .data {
    font-size: 1.15em;
}
#yado .data h1,
#yado .data h2 {
/*	box-shadow: inset 0 2px 2px rgba(49,27,20,0.20);*/
	padding: 10px;
	border-radius: 3px;
	background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,0.80) 0%,rgba(255,255,255,0.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(255,255,255,0.80) 0%,rgba(255,255,255,0.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(255,255,255,0.80) 0%,rgba(255,255,255,0.00) 100%);
	background-image: linear-gradient(180deg,rgba(255,255,255,0.80) 0%,rgba(255,255,255,0.00) 100%);
/*	-webkit-box-shadow: inset 0 2px 2px rgba(49,27,20,0.20);*/
	font-size: 1.2em;
}
#ryokan .data h3,
#yado .data h3,
#nature .data h2,
#nature .data h3,
#access .data h3,
#livecam .data h3 {
    margin-top: 0;
}
#ryokan .data.other .row,
#yado .data.other .row,
#nature .data.other .row,
#access .data.other .row,
#livecam .data.other .row {
    margin: 15px 0;
}
#nature h1,
#access h1 {
    margin-bottom: 60px;
}
#ryokan .yumegurichou,
#yado .yumegurichou,
#nature .yumegurichou,
#access .yumegurichou,
#livecam .yumegurichou {
    margin-top: 60px;
    min-height: 190px;
}
#ryokan .yumegurichou img,
#yado .yumegurichou img,
#nature .yumegurichou img,
#access .yumegurichou img,
#livecam .yumegurichou img {
    margin-top: 5px;
}


.table thead>tr>th,
.table tbody>tr>th,
.table tfoot>tr>th,
.table thead>tr>td,
.table tbody>tr>td,
.table tfoot>tr>td {
    border-top: 1px solid #B99F86;
}
.table th {
    width: 7em;
}
.pp_10 p {
    padding: 0 10px 10px;
}
/*
#nature .photo {
    padding-left: 0px;
    padding-right: 0px;
    margin-right: 15px;
}
*/
#yado .photo {
    margin-bottom: 30px;
}
#gmap {
	width: 100%;
	height: 500px;
	margin-bottom: 30px;
}
#gmap img {
	max-width: none;
}

/*** ソーシャルボタン ***/
.snsb {
/*	overflow: hidden;*/
    margin: 0;
    padding: 0;
    list-style: none;
}
.snsb li {
	float: right;
	margin-right: 6px;
}
.snsb iframe {
	margin: 0 !important;
}

/* Twitter */
.count-o {
    -webkit-border-radius: 2px !important;
    border-radius: 2px !important;
}
.vcount .count-o i, .rtl.vcount .count-o i, .vcount .count-o u, .rtl.vcount .count-o u {
    margin: 0 0 -5px -5px !important;
    border: 5px transparent solid !important;
}
.vcount #count {
    font-size: 16px !important;
    width: 100% !important;
    height: 32px !important;
    line-height: 32px !important;
}
.vcount .btn-o {
    margin-top: 41px !important;
}
/* Google+ */
.b1 {
    text-align: center !important;
    margin-bottom: 7px !important;
    width: 48px !important;
    height: 32px !important;
    border: 1px solid #aaa !important;
}
/** 詳しくはこちらボタン **/
#nature .btn {
    background-color: #8e6b4f;
    color: #fff;
    width: 100%;
    margin: 15px 0 15px;
    padding: 8px;
}
#nature .btn:hover {
    background-color: #9b795f;
    color: #fff;
}
#nature .btn:active {
    background-color: #7c6149;
    color: #f7f7f7;
}

/** 予約ボタン **/
#yado .btn {
    background-color: #AE6363;
    color: #fff;
    width: 100%;
}
#yado .btn:hover {
    background-color: #b96f6f;
    color: #fff;
}
#yado .btn:active {
    background-color: #a35c5c;
    color: #f7f7f7;
}
/** TOP スライダー **/
#slider {
	margin:0;
	padding:0;
}
.slider ul {
    margin: 0 0 25px !important;
    padding: 0px !important;
    list-style: none !important;
}
.slider li img {
    min-width: 100% !important;
}
#sliderimg02,
#sliderimg03,
#sliderimg04,
#sliderimg05,
#sliderimg06,
#sliderimg07 {
    display:none;
}
.bx-wrapper .bx-viewport {
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
border:none !important;
background-color:transparent !important;
left: 0 !important;
}

.copyright {
	text-align: center;
	margin-bottom: 20px;
}

/*** スクロールJAVA系 ***/
#scrollDown {
	position: fixed;
	left: 50%;
	bottom: 0;
	margin-left: -60px;
	width: 120px;
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	z-index: 9999;
	display: none;
}

#page-top {
    position: fixed;
    bottom: 26px;
    right: 10px;
    font-size: 13px;
}
#page-top a {
	text-decoration: none;
	color: #FFF;
	text-align: center;
	display: block;
	border-radius: 4px;
	padding: 10px;
	background-color: rgba(55,46,41,0.80);
}
#page-top a:hover {
	text-decoration: none;
	background-color: rgba(67,58,53,0.80);
}
.emergency {
	padding: 20px 10%;
	background-color: rgba(255,255,255,0.50);
	font-size: 1.25em;
	margin-top: -30px;
	border-radius: 6px;
	margin-bottom: 30px;
	-webkit-box-shadow: 0px 4px 8px rgba(0,0,0,0.10);
	box-shadow: 0px 4px 8px rgba(0,0,0,0.10);
	font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "MS P明朝", "MS PMincho", "MS 明朝", serif;
}





@media (max-width:1199px){
	#header .mainnav {
		position: relative;
		margin: 13px -15px 0 0;
	}
	#header .mainnav ul {
		padding: 0;
		list-style-type: none;
		margin: 0;
		list-style: none outside none;
		float: right;
		position: relative;
	}
	#header .mainnav ul li {
		height: 39px;
		margin: 0 15px;
		display: inline-block;
		text-indent: -9999px;
		float: left;
		position: relative;
	}
	a #information {
		width: 176px;
		background-image: url(images/navi_infomation.png);
		background-position: left top;
	}
	a #nature {
		width: 108px;
		background-image: url(images/navi_nature.png);
		background-position: left top;
	}
	a #access {
		width: 81px;
		background-image: url(images/navi_access.png);
		background-position: left top;
	}
	a #livecam {
		width: 115px;
		background-image: url(images/navi_livecam.png);
		background-position: left top;
	}
	a #information,
	a #nature,
	a #access,
	a #livecam {
	background-size: cover;
	}
	a:hover #information,
	a:hover #nature,
	a:hover #access,
	a:hover #livecam {
	background-position: center 39px;
	}
	.yumeguri.time button {
		font-size: 1.1em;
		width: 5em;
	}
}
@media (max-width:991px){
	section {
		margin: 30px 0 30px;
	}
	.sitelogo {
		margin: -30px 0 0;
		width: 100%;
	}
	.yumegurichou-photo {
		float: none;
	}
	#header .mainnav {
		position: relative;
		margin: 13px 0 0;
		overflow: hidden;
		clear: both;
	}
	#header .mainnav ul {
		padding: 0;
		list-style-type: none;
		margin: 10px 0 0;
		list-style: none outside none;
		float: left;
		position: relative;
		left: 50%;
	}
	#header .mainnav ul li {
		height: 39px;
		margin: 0 15px;
		display: inline-block;
		text-indent: -9999px;
		float: left;
		position: relative;
		left: -50%;
	}
	#footer .sangyou {
		text-align: left;
		clear: none;
	}
	#yado .photo {
		margin-bottom: 0px;
	}
	#footer .yado.first,
	#footer .yado.second,
	#footer .yado.third {
		z-index: 999;
	}
}

@media (max-width:767px){
	#footer .yado.third {
		clear: both;
		padding-top: 35px;
	}
	#footer .sangyou {
		padding-top: 0;
	}
}
@media (max-width:639px){
	.sitelogo {
		margin: -8px 0 0;
		text-align: center;
	}
	.sitelogo img {
		width: 100%;
		max-width: 200px;
	}
	.hfbg {
		padding: 30px 0 10px;
	}
	#header .eng a {
		margin: -28px 0 0;
	}
	#header .mainnav {
		display: none;
	}
	#header .mobilenav {
		display: initial;
		width: 100%;
	}
	#header .mobilenav ul {
		margin: 3px 2%;
		padding: 0;
		list-style: none;
		box-sizing: border-box;
	}
	#header .mobilenav ul li {
		padding: 9px 2px;
		float: left;
		width: 50%;
		background-color: rgba(255, 255, 255, 0.10);
		text-align: center;
		border: 1px solid #39302B;
		font-size: 15px;
		border-radius: 4px;
	}
	#header .mobilenav a {
		color: #fff;
	}
	
	#footer .yado dd {
		font-size: 0.6em;
	}
	#footer .sangyou {
		text-align: center;
		clear: both;
		padding-top: 20px;
	}
	#footer .yado.first {
		padding-right: 0px;
	}
	
}