@charset "utf-8";


/*PC・タブレット・スマホ共通設定
---------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
body {
	margin: 0px;
	padding: 0px;
	color: #444;	/*全体の文字色*/
	font-family:"游明朝","Yu Mincho","游明朝体","YuMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo, Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;	/*フォント指定*/
	font-size: 14px;	/*文字サイズ*/
	line-height: 2;		/*行間*/
	background: #f3f6ec;	/*背景色*/
	-webkit-text-size-adjust: none;
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form{margin:0px;padding:0px;}
ul{list-style-type:none;}
img{border:none;max-width:100%;height:auto;}
table{border-collapse:collapse;font-size:100%;border-spacing:0;}
iframe{width:100%;}

/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: #444;	/*リンクテキストの色*/
			/*同上*/
}
a:hover {
	color: #186901;			/*マウスオン時の文字色（全体）*/
	text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}

/*ヘッダー（サイトロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	width: 100%;	/*横一杯使う為に100%指定*/
	border-top: 5px solid #186901;	/*上部の線の幅、線種、色*/
	background: #fff;	/*背景色（古いブラウザ用）*/


}
/*サイト幅にしたheader内のブロック*/
header #inner {
	width: 980px;	/*幅。「#menubar ul」と「#contents」と数字を揃える。*/
	height: 100px;	/*高さ*/
	margin: 0 auto;
	position: relative;
	z-index: 100;
}
/*ロゴ画像*/
header #logo {
	position: absolute;
	left: 10px;	/*header #innerに対して左から10pxの場所に配置*/
	top: 20px;	/*header #innerに対して上から20pxの場所に配置*/
}
/*電話番号パーツ*/
header #tel {
	font-family:"ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo;	/*フォント種類*/
	position: absolute;
	right:10px;	/*header #innerに対して右から10pxの場所に配置*/
	top:50px;	/*header #innerに対して上から50pxの場所に配置*/
	background: url(../images/icon_tel.png) no-repeat left center/15px;	/*電話アイコンの読み込み*/
	padding-left: 25px;
	font-size: 24px;	/*文字サイズ*/
	letter-spacing: 0em;	/*文字間隔を少し広くとる設定。通常がいいならこの行削除。*/
}
header #tel img{vertical-align:middle;}
/*電話番号パーツの受付時間部分*/
header #tel span {
	font-size: 12px;	/*文字サイズ*/
	letter-spacing: normal;	/*文字間隔を通常にする設定*/
}

/*「ご予約・お問い合わせはこちらから」ボタン
---------------------------------------------------------------------------*/
#contact {
	position: absolute;
	right: 10px;	/*header #innerに対して右から10pxの場所に配置*/
	top: 0px;	/*header #innerに対して上から0pxの場所に配置*/
	font-size: 16px;	/*文字サイズ*/
font-weight:bold;
}
#contact a {
	font-family:"ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo;	/*フォント種類*/

	text-decoration: none;
	display: inline-block;
	background: #ffb017;	/*背景色（古いブラウザ用）*/
	background: -webkit-gradient(linear, left top, left bottom, from(#ffb017), to(#ff8a17));	/*グラデーション*/
	background: -webkit-linear-gradient(#ffb017, #ff8a17);	/*同上*/
	background: linear-gradient(#ffb017, #ff8a17);			/*同上*/
	color: #FFF;	/*文字色*/
	padding: 4px 20px 8px;	/*上、左右、下へのボックス内の余白*/
	border-radius: 0px 0px 8px 8px;	/*角丸のサイズ。左上、右上、右下、左下。*/
	box-shadow: 0px 4px 8px rgba(0,0,0,0.2);	/*右へ、下へ、ぼかし幅の順の影の設定。rgba以降は色の設定。「0,0,0」はrgbでの色で、黒。「0.2」が透明度で20%の意味。*/
	text-shadow: #a65b1e 0px -1px;	/*色、右へ、下へ、テキストの影の設定。下にマイナス設定をしているので上に影が入る事になる。*/
}
/*マウスオン時*/
#contact a:hover {
	padding: 8px 20px 12px;	/*上、左右、下へのボックス内の余白*/
}

/*メインメニュー
---------------------------------------------------------------------------*/
#menubar {
	width: 100%;
	background: #b4e285;	/*背景色（古いブラウザ用）*/
		/*background: rgba(255,255,255,0.9);*/
	background: -webkit-gradient(linear, left top, left bottom, from(#f7fcf0), to(#daf2b9));	/*グラデーション*/
	background: -webkit-linear-gradient(#f7fcf0, #daf2b9);	/*同上*/
	background: linear-gradient(#f7fcf0, #daf2b9);
overflow:hidden;


}
#menubar ul {
	width: 980px;	/*幅。「header #inner」と「#contents」と数字を揃える。*/
	margin: 0 auto;
}
/*メニュー１個あたりの設定*/
#menubar li {
	float: left;	/*左に回り込み*/
	border-left: 1px solid #f5f5f5;	/*左の線の幅、線種、色*/
	border-top: 1px solid #f5f5f5;		/*左の線の幅、線種、色*/
	border-right: 1px solid #f5f5f5;	/*左の線の幅、線種、色*/
	width: 194px;	/*メニュー幅*/
	font-size: 14px;	/*文字サイズ*/
	line-height: 1.8;	/*行間*/

}
#menubar li a {
	display: block;
	text-decoration: none;
	background: #fff;	/*背景色（古いブラウザ用）*/
		/*background: rgba(255,255,255,0.9);*/
	background: -webkit-gradient(linear, left top, left bottom, from(#f4fceb), to(#d6f0b0));	/*グラデーション*/
	background: -webkit-linear-gradient(#f4fceb, #d6f0b0);	/*同上*/
	background: linear-gradient(#f4fceb, #d6f0b0);
padding:15px 15px;

}
#menubar li a::first-letter {
	border-left: 3px solid #186901;	/*左側のアクセント用ラインの幅、線種、色*/
	padding-left: 10px;	/*アクセントラインと文字の間にとる余白*/
	padding-bottom: 18px;
}
/*英語表記*/
#menubar li span {
	display: block;
	font-size: 10px;	/*文字サイズ*/
	padding-left: 15px;	/*アクセントラインと文字の間にとる余白*/
	letter-spacing: 0.2em;	/*文字間隔を少し広くとる設定。通常がいいならこの行削除。*/
}
/*マウスオン時、現在表示中のメニュー設定*/
#menubar a:hover,
#menubar li.current a {
	background: #daf2b9;	/*背景色*/
color:#333333;
}
/*スマホ用メニューを表示させない*/
#menubar-s {
	display: none;
}
/*３本バーアイコンを表示させない*/
#menubar_hdr {
	display: none;
}




/*コンテンツ（左右ブロックを囲むボックス）
---------------------------------------------------------------------------*/
#contents {
	clear: both;
	width: 1000px;	/*幅。「header #inner」と「#menubar ul」と数字を揃える。*/
	margin: 0 auto;
background:#ffffff;
padding:20px;
overflow:hidden;
}



.instagram-gallery{margin:auto !important;display:block;}

ul.instagram-gallery__list {
  display: flex;
  flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}
li.instagram-gallery__item{
  position: relative;
  width: 30.3%;
margin:1%;

}
li.instagram-gallery__item:before{
  content: "";
  display: block;
  padding-top: 100%;
}
li.instagram-gallery__item img{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  object-fit: cover;
}



/*メインコンテンツ
---------------------------------------------------------------------------*/
#main {
	float: left;	/*左側に回り込み*/
	width: 720px;	/*幅*/
margin:0;
}
/*mainコンテンツのh2タグの設定*/
#main h2 {
	clear: both;
	margin-bottom: 0px;
	font-size: 100%;
	background: #fff;	/*背景色（古いブラウザ用）*/
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dee4d1));	/*グラデーション*/
	background: -webkit-linear-gradient(#fff, #dee4d1);	/*同上*/
	background: linear-gradient(#fff, #dee4d1);			/*同上*/
	padding: 7px 15px;	/*上下、左右への余白*/
	border-radius: 4px 4px 0px 0px;	/*角丸のサイズ*/
	border-left: solid 1px #b5b5b5;		/*左側への線の線種、幅、色*/
	border-top: solid 1px #b5b5b5;		/*上側への線の線種、幅、色*/
	border-right: solid 1px #b5b5b5;	/*右側への線の線種、幅、色*/
	border-bottom: solid 5px #186901;	/*下側への線の線種、幅、色*/
}
/*mainコンテンツのh3タグの設定*/
#main h3 {
	clear: both;
	margin-bottom: 15px;
	font-size: 100%;
	background: #fed988;	/*背景色*/
	padding: 4px 15px;	/*上下、左右への余白*/
	border: 1px solid #e4e4e4;	/*枠線の幅、線種、色*/
	border-radius: 4px;	/*角丸のサイズ*/
}
/*mainコンテンツのh3タグの１文字目への設定*/
#main h3::first-letter {
	border-left: 3px solid #186901;	/*左側のアクセント用ラインの幅、線種、色*/
	padding-left: 10px;	/*アクセントラインと文字の間にとる余白*/
}


#main h5 {
	clear: both;
	margin-bottom: 15px;
	font-size: 100%;
	background: #ff6600;	/*背景色*/
	padding: 4px 15px;	/*上下、左右への余白*/
	border: 1px solid #e4e4e4;	/*枠線の幅、線種、色*/
	border-radius: 4px;	/*角丸のサイズ*/
color:#fff;
}
/*mainコンテンツの段落タグ設定*/
#main p {
	padding: 7px 15px 14px;	/*上、左右、下への余白*/
}
#main p + p {
	padding-top: 0px;
}
#main h2 + p,
#main h3 + p {
	padding-top: 0px;
	margin-top: -5px;
}

#main .post1 p {
padding:0px 0 15px 0;
}

#main .post1 ul.li_ex{
clear:both;
} 

#main .post1 ul.li_ex li{
float:left;
width:48%;
display:block;
margin-right:1%;
} 
.lists_date img{width:60px;}

/*「お部屋のご紹介」と「ご宿泊プラン」の各ブロック
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
#main section.list,
#main section.list3,
#main section.list2 {
	background: #fff;	/*背景色*/
	border: 1px solid #e4e4e4;	/*枠線の幅、線種、色*/
	margin-bottom: 15px;	/*ボックスの下に空ける余白*/
	position: relative;
	overflow: hidden;
padding:10px;
}
#main section.list2 {
	padding: 15px;
}
#main section.list a {
	padding: 15px;
	text-decoration: none;
	display: block;
	overflow: hidden;
}
/*ボックス内の段落タグ設定*/
#main section.list p,
#main section.list3 p,
#main section.list2 p {
	padding: 0px;
		/*margin-left: 170px;左側の写真幅とのバランスをとって設定*/	
}
/*ボックス内の写真設定*/
#main section.list figure img,
#main section.list2 figure img {
	float: left;	/*画像を左へ回り込み*/
	width: 140px;		/*写真の幅*/
	background: #fff;	/*画像の背景色。ここでは枠線と画像の間の色になります。*/
	padding: 5px;			/*余白。ここに上の行で設定した背景色が出ます。*/
	border: 1px solid #CCC;	/*枠線の幅、線種、色*/
}
/*ボックス内のh4タグ設定*/
#main section.list h4,
#main section.list2 h4 {
	font-size: 100%;
	margin-bottom: 0.5em;
	color: #000;		/*文字色*/
	border-bottom: 1px solid #CCC;	/*下線の幅、線種、色*/
}
/*ボックス内のh4タグの１文字目への設定*/
#main section.list h4::first-letter,
#main section.list2 h4::first-letter {
	border-left: 3px solid #186901;	/*左側の線の幅、線種、色*/
	padding-left: 10px;	/*線と文字との余白*/
}
/*マウスオン時のボックス*/
#main section.list a:hover {
	background:#FCFDCA;
}

table.hikaku td{font-size:14px;}


/*「ご宿泊プラン」の各ブロック内のテーブル
---------------------------------------------------------------------------*/
#main section.list table,
#main section.list3 table,
#main section.list2 table {
	font-size: 12px;	/*文字サイズ*/
	background: #FFF;	/*背景色*/
	width: 100%;		/*テーブル幅*/
	margin-bottom: 5px;
		/*margin-left: 170px;左側の写真幅とのバランスをとって設定*/	
}
#main section.list table,#main section.list table td,#main section.list table th,
#main section.list2 table,#main section.list2 table td,#main section.list2 table th {
	border: 1px solid #CCC;	/*枠線の幅、線種、色*/
}
#main section.list table td,#main section.list table th,
#main section.list2 table td,#main section.list2 table th {
	padding: 1%;	/*テーブル内の余白*/
}
/*色のついた見出しブロック*/
#main section.list table th,
#main section.list2 table th {
	width: 20%;		/*幅*/
	text-align: left;		/*文字をセンタリング*/
	font-weight: normal;	/*デフォルトの太字を標準にする設定*/
	background: #f3f3f3;	/*背景色*/
padding:3px;
}

#main section.list table.ta_sankou_toso th{
width:50%;
color:#000000;
}

#main section.list table.ta_sankou_toso td{
text-align:center;
}

#main section.list table.ta_sankou_toso th.aligncenter{
text-align:center;
}

#main section.list table.ta_sankou_toso th.bg1{
background:#ffff33;
}

#main section.list table.ta_sankou_toso th.bg2{
background:#ffcc33;
}

#main section.list table.ta_sankou_toso th.bg3{
background:#b5ff33;
}

#main section.list table.ta_sankou_toso th.bg4{
background:#8cedfe;
}

.bg5{background:#ffff99;}
.bg6{background:#60ac53;color:#fff;}
.bg7{background:#c1def0;}
.bg8{background:#fe9d35;color:#fff;width:auto;float:left;padding:10px 10px;margin-right:10px;margin-bottom:7px;min-width:140px;text-align:center;}
.text16{
font-size:16px;
font-weight:bold;

}
.text20{
font-size:20px !important;
font-weight:bold;
}
@media screen and (max-width:800px){
.bg8{background:#fe9d35;color:#fff;width:auto;float:none;padding:10px 10px;margin-right:10px;margin-bottom:7px;min-width:140px;text-align:center;}
.text20{
font-size:16px !important;
font-weight:bold;
}
}

.text_red16{
font-size:16px;
font-weight:bold;
color:#ff0000;
}
.text_blue16{
font-size:16px;
font-weight:bold;
color:#198905;
}

.case{
clear:both;
padding:15px 0;
overflow:hidden;
}

/*白い説明用ブロック*/
#main section.list table td,
#main section.list2 table td {
	width: 30%;	/*幅*/
}
#main section.list3 table.ta_utiwake td {	/*幅*/
text-align:center;
}

.post1{
background:#ffffff;
padding:15px;
margin:0 0 25px 0;
border-left:#999999 1px solid;
border-right:#999999 1px solid;
border-bottom:#999999 1px solid;
border-radius:0 0 5px 5px;
overflow:hidden;
}


.post2{
background:#ffffff;
padding:15px;
margin:0 0 25px 0;
border:#f5f5f5 1px solid;
border-radius:5px;
}


.post2 ul.sitemap_li li{
margin-left:25px;
padding-top:10px;
}
.post2 ul ul{
list-style:disc;
margin-left:25px;
}
 .tt1 {
	font-size: 100%;
	background: #fed988;	/*背景色*/
	padding: 4px 10px;	/*上下、左右への余白*/
}

.font120{
font-size:120%;
}

.aligncenter{text-align:center;}
img.aligncenter{
margin:0 auto;
}

img.alignleft{
float:left;
margin:0 10px 10px 0;
}
.alignleft{
float:left;
margin:0 10px 5px 0;
}
img.alignright{
float:right;
margin:0 0px 10px 10px;
}

.green20{
color:#2f9f2c;
font-weight:bold;
font-size:18px;
}
.color_red{
color:#ff0000;
}
.color_ye{
color:#ffff99;
}
a.color_ye{
text-decoration: underline dotted #ffff99;
}
.color_ore{
color:#ff6600;
}

.color_green{
color:#2f9f2c;
}

.text_em, .color_ore{
color:#ff7200;
}
.text_em{
font-weight:bold;
}

ul.mark_disc{
list-style-type:disc;
margin-left:15px;
}
.marginbottom15{
margin-bottom:15px;
}

.post1 h4 {
clear:both;
margin-top:20px;
background-color:#2f9f2c;
	background: -webkit-gradient(linear, left top, left bottom, from(#63c05a), to(#0e8502));	/*グラデーション*/
	background: -webkit-linear-gradient(#63c05a, #0e8502);	/*同上*/
	background: linear-gradient(#63c05a, #0e8502);	
color:#ffffff;
padding:5px;
border-radius:5px 5px 0 0;
margin-bottom:3px;
}


.post1 h5 {
clear:both;
font-size:14px;
}


.post1 h4.first{
margin-top:0
}



.post1 img a{
margin:0px;

}

#main .post1 ul.work{
clear:both;
display:block;
} 

#main .post1 div{
clear:both;
}

#main .post1 ul.work li{
float:left;
width:49%;
display:block;
margin-right:1%;
} 

#main .post1 ul.work li:last-child{
margin-bottom:20px;
}

#main .post1 ul.work li p{
margin:0px;
padding:10px 0 0px 0;

}


#main .post1 ul.pola li{
float:left;
width:32%;
display:block;
margin-right:1%;
} 

#view{
clear:both;
text-align:right;
}
#view a{
color:#ff6600;
font-size:90%;

}

.bothclear{
clear:both;
}
.marginbottom20{
margin-bottom:20px;
}
.marginleft20{
margin-left:20px;
}
.margintop20{
margin-top:20px;
}


.faq {
  margin-bottom: 32px; /* 各Q&Aの下に余白 */
}

.faq__dt, .faq__dd {
  position: relative;
  padding-left: 24px;
}

.faq__dt::before, .faq__dd::before {
  font-weight: bold;
  position: absolute;
  left: 0;
  top: 0;
}

.faq__dt {
  font-weight: bold; /* 質問文は太字にしてみました */
  border-bottom: 1px solid #999;
  margin-bottom: 4px; /* 下にちょい余白 */
}

.faq__dt::before {
  content: 'Q.';
  color: #c80021; /* 「Q」の文字色 */
}

.faq__dd::before {
  content: 'A.';
  color: #0085C8; /* 「A」の文字色 */
}
/*サブコンテンツ
---------------------------------------------------------------------------*/
#sub {
	float: right;	/*右に回り込み*/
	width: 245px;	/*幅*/

}
/*subコンテンツ内のh2タグ設定*/
#sub h2 {
	font-size: 100%;
	padding-bottom: 10px;
}
/*subコンテンツのh2タグの１文字目への設定*/
#sub h2::first-letter {
	border-left: 3px solid #186901;	/*左側のアクセント用ラインの幅、線種、色*/
	padding-left: 10px;
}

#sub img.sidemenu{
margin-bottom:3px;
}

/*サブコンテンツ内のメニュー
---------------------------------------------------------------------------*/
/*メニュー全体の設定*/
#sub ul.submenu {
	margin-bottom: 15px;	/*メニューブロックの下に空けるスペース*/
	border-top: solid 1px #b5b5b5;	/*上の線の線種、幅、色*/
}



/*メニュー１個ごとの設定*/
#sub ul.submenu li {
	/*背景色*/
	border-bottom: solid 1px #b5b5b5;	/*下の線の線種、幅、色*/


}
#sub ul.submenu li a {
	background-color:#fff;
background-image: url(../images/arrow11.png);
background-position:2% 50%;
background-repeat:no-repeat;
	text-decoration: none;
	display: block;
	padding: 10px 0 10px 25px;	/*メニュー内の余白。上下、左右への設定。*/
}

/*サブコンテンツ内のbox1
---------------------------------------------------------------------------*/
#sub .box1 {
	padding: 15px;			/*ボックス内の余白*/
	margin-bottom: 15px;	/*ボックスの下に空けるスペース*/
	background: #ffffff;	/*背景色*/
	border: solid 1px #b5b5b5;	/*線の線種、幅、色*/
}
/*box1内のメニューの設定*/
#sub .box1 ul.submenu {
	margin-bottom: 0px;
}

/*フッター設定
---------------------------------------------------------------------------*/
footer {
	clear: both;
	background: #333;	/*背景色*/
	color: #fff;	/*文字色*/
	font-size: 85%;	/*文字サイズ*/


}
footer a {
	color: #fff;

}
footer a:hover {
	color: #fff;
}
footer .pr {
	display: block;
	font-size: 80%;
}

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	width: 940px;	/*幅*/
	margin: 0 auto;
	overflow: hidden;
	padding: 20px 0px;
}
/*１行分の設定*/
#footermenu ul {
	float: left;	/*左に回り込み*/
	width: 18%;		/*幅。今回は５列作ったのでここの幅18%と下のpaddingの2%でトータル20%になるよう設定。列に応じて調整して下さい。*/
	padding-right: 2%;
}

/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
	clear: both;
	text-align: center;
	background: #111;	/*背景色*/
padding:10px;
}
#copyright a {
	text-decoration: none;
}

/*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/
/*ブロック全体の設定*/
#new dl{
	padding-left: 15px;
	margin-bottom: 15px;
	overflow: auto;	/*高さ指定を超えるとiframe風にスクロールが出る設定。全部表示させたいならこの行と下のheightの行を削除。*/
	height: 140px;	/*ボックスの高さ*/
}
/*日付設定*/
#new dt {
	font-weight: bold;	/*太字にする設定。標準がいいならこの行削除。*/
	float: left;
	width: 8em;
}
/*記事設定*/
#new dd {
	padding-left: 8em;
}

/*テーブル
---------------------------------------------------------------------------*/
/*ta1設定*/
.ta1 {
	width: 100%;
	margin-bottom: 15px;
	background: #fff;	/*背景色*/
}
.ta1, .ta1 td, .ta1 th {
	border: 1px solid #eaeaea;	/*テーブルの枠線の幅、線種、色*/
	padding: 5px;	/*ボックス内の余白*/
	word-break: break-all;
}
/*テーブル１行目に入った見出し部分*/
.ta1 th.tamidashi {
	width: auto;
	text-align: left;	/*左よせ*/
	background: #cce6f6;	/*背景色*/
}
/*左側ボックス*/
.ta1 th {
	width: 140px;	/*幅*/
	text-align: center;	/*センタリング*/
	background: #fcfcfc;	/*背景色*/
}

/*PAGE TOP設定
---------------------------------------------------------------------------*/
#pageTop {

  position: fixed;
  bottom: 20px;
  right: 10px;

}

 

#pageTop a {
  display: block;
  z-index: 999;
  padding: 5px 10px 10px 10px;
  border-radius: 3px;
  width: 15px;
  height: 15px;
  background-color: #555555;
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  opacity: 0.8;
}

 

#pageTop a:hover {
  text-decoration: none;
  opacity: 0.9;
}



/*NEWアイコン
---------------------------------------------------------------------------*/
.newicon {
	background: #F00;	/*背景色*/
	color: #FFF;		/*文字色*/
	font-size: 10px;	/*文字サイズ*/
	border-radius: 2px;	/*角丸のサイズ*/
	padding: 0px 5px;
	margin: 0px 5px;
}

/*その他
---------------------------------------------------------------------------*/
.look {background: #dcdcdc;}
.mb15,.mb1em {margin-bottom: 15px;}
.clear {clear: both;}
ul.disc {padding: 0em 25px 1em;list-style: disc;}
.color1 {color: #a2000d;}
.pr {font-size: 10px;}
.wl {width: 96%;}
.ws {width: 50%;}
.c {text-align: center;}
.r {text-align: right;}
.l {text-align: left;}


*,*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}
a.btn--orange {
  color: #fff !important;
  background-color: #eb6100;
  border-bottom: 5px solid #b84c00;
}
a.btn--orange:hover {
  margin-top: 3px;
  color: #fff !important;
  background: #f56500;
  border-bottom: 2px solid #b84c00;
}

.btn,
a.btn,
button.btn {
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

a.btn--orange.btn--border-solid {
  border: 2px solid #b84c00;

}
.fontsize22{font-size:22px;}



/*画面幅800px以上の設定
---------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:801px){

.sm_only{
display:none;
}

.padding20{
margin:0 auto;
min-width:630px;
padding-left:40px;
padding-right:40px;
}

.sm_none{
display:none;
}

}
/*画面幅800px以下の設定
---------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:800px){

/*ヘッダー（サイトロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*サイト幅にしたheader内のブロック*/
header #inner {
	width: auto;
}
header #logo {
	width: 50%;
	top: 7px;	/*header #innerに対して上から20pxの場所に配置*/
}

header #logo img {
max-height:90px;
}

/*メインメニュー
---------------------------------------------------------------------------*/
#menubar ul {
	width: auto;
	padding-bottom: 0px;

}
/*メニュー１個あたりの設定*/
#menubar li {
	width: 50%;
	margin: 0;
	border-bottom: 1px solid #dcdcdc;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
#menubar li:nth-child(odd) {
	border-right: none;
}
/*３本バーアイコンを表示させない*/
#menubar_hdr {
	display: none;
}
.pc_only{
display:none;
}
/*コンテンツ
---------------------------------------------------------------------------*/
#contents {
	width: auto;
	margin: 2%;
padding:10px;
}

/*main,subコンテンツ
---------------------------------------------------------------------------*/
#main, #sub {
	float: none;
	width: auto;
}
#sub {
text-align:center;
}
#sub img {
margin:10px;
}
#sub aside {
text-align:left;
}

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	width: 90%;
}

/*その他
---------------------------------------------------------------------------*/
body.s-n #sub {
	display: none;
}

.padding20{
margin:0 auto;
max-width:100%;
padding-left:20px;
padding-right:20px;
}



}





/*画面幅650px以下の設定
---------------------------------------------------------------------------*/
@media screen and (max-width:650px){

/*ヘッダー（サイトロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ロゴ画像*/
header #inner {
	overflow: hidden;
}

header #logo {
	width: 70%;
}
/*電話番号パーツ
header #tel {
	background: none;
	line-height: 1.2;
	text-align: right;
}*/
/*電話番号パーツの受付時間部分
header #tel span {
	display: block;
}*/

header #tel {display:none;}

.pc_only{
display:none;
}
/*「ご予約・お問い合わせはこちらから」ボタン
---------------------------------------------------------------------------*/
#contact {
	font-size: 14px;
}
#contact span {
	display: none;
}


#main .post1 ul.work li{
float:none;
width:100%;
display:block;
margin-right:0%;
} 



.padding20{
width:94%;
padding-left:5px;
padding-right:5px;
}

#sub {
text-align:center;
}
#sub img {
margin:10px auto;
}
#sub aside {
text-align:left;
}


}



/*画面幅480px以下の設定
---------------------------------------------------------------------------*/
@media screen and (max-width:480px){

/*ヘッダー（サイトロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ロゴ画像*/
header #logo {
	width: 80%;
}
/*サイト幅にしたheader内のブロック*/
header #inner {
	height: 120px;
}
/*ロゴ画像*/
header #logo {
	position: absolute;
	left: 10px;
	top: 10px;
}

header #tel {display:none;}


.pc_only{
display:none;
}
/*「ご予約・お問い合わせはこちらから」ボタン
---------------------------------------------------------------------------*/
#contact {
	position: absolute;
	left: 10px;
	top: 70px;
}
#contact a {
	display: block;
	text-align: center;
	border-radius: 8px;
}

/*メインメニュー
---------------------------------------------------------------------------*/
#menubar-s {
	border-radius: 8px;
	border: 1px solid #b5b5b5;
	margin: 0px 10px 20px;
	background: #fff;
}
#menubar-s li {
	border-top: 1px solid #b5b5b5;
	background: url(../images/arrow1.png) no-repeat 95% center/19px;
}
#menubar-s li:first-child {
	border-top: none;
}
#menubar-s li a {
	display: block;
	text-decoration: none;
	padding: 8px;
}
/*英語表記*/
#menubar-s li span {
	display: none;
}
/*スマホ用メニューを非表示から表示に切り替える*/
#menubar-s {
	display: block;
}
/*PC用メニューを非表示にする*/
#menubar {
	display: none;
}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;
	position: absolute;
	top: 0px;		/*上から10pxの場所に配置*/
	right: 10px;	/*右から10pxの場所に配置*/
	width: 30px;	/*幅*/
	border: 1px solid #000;	/*枠線の幅、線種、色*/
	border-top: none;
	border-radius: 0px 0px 4px 4px;	/*角丸のサイズ*/
	padding: 12px 10px 5px;	/*上、左右、下へのボックス内余白*/
	background: #fff;	/*背景色*/
	z-index: 200;
}
/*３本のバー（1本あたり）*/
#menubar_hdr span {
	display: block;
	border-top: 2px solid #000;	/*枠線の幅、線種、色*/
	border-radius: 2px;	/*角丸のサイズ*/
	margin-bottom: 7px;	/*バー同士の余白*/
}

/*コンテンツ
---------------------------------------------------------------------------*/
#contents {
	width: auto;
	margin: 1%;
padding:10px;
}

/*「お部屋のご紹介」と「ご宿泊プラン」の各ブロック
---------------------------------------------------------------------------*/
/*ボックス内の段落タグ設定*/
#main section.list p,
#main section.list2 p {
	margin-left: 0;
}
/*ボックス内の写真設定*/
#main section.list figure img,
#main section.list2 figure img {
	float: none;
	width: 100% !important;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
/*ボックス内のh4タグ設定*/
#main section.list h4,
#main section.list2 h4 {
	margin-left: 0;
}

/*「ご宿泊プラン」の各ブロック内のテーブル
---------------------------------------------------------------------------*/
#main section.list table,
#main section.list2 table {
	margin-left: 0;
	width: 100%;
}

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
	display: none;
}

/*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/
section#new h2.open {
	background: url(../images/btn_minus.png) no-repeat right center/34px 34px, -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e5e5e5));	/*グラデーション*/
	background: url(../images/btn_minus.png) no-repeat right center/34px 34px, -webkit-linear-gradient(#fff, #e5e5e5);	/*同上*/
	background: url(../images/btn_minus.png) no-repeat right center/34px 34px, linear-gradient(#fff, #e5e5e5);			/*同上*/
}
section#new h2.close {
	background: url(../images/btn_plus.png) no-repeat right center/34px 34px, -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e5e5e5));	/*グラデーション*/
	background: url(../images/btn_plus.png) no-repeat right center/34px 34px, -webkit-linear-gradient(#fff, #e5e5e5);	/*同上*/
	background: url(../images/btn_plus.png) no-repeat right center/34px 34px, linear-gradient(#fff, #e5e5e5);
}

/*テーブル
---------------------------------------------------------------------------*/
/*テーブル内の左側*/
.ta1 th {
	width: 100px;
	padding: 5px;
}
/*テーブル内の右側*/
.ta1 td {
	width: auto;
	padding: 5px;
}

/*その他
---------------------------------------------------------------------------*/
.ws,.wl {
	width: 90%;
}

img.alignleft{
float:none;
margin:10px auto;
}
img.alignright{
float:none;
margin:10px auto;
}

.post1{
border:0px;
}
#main .post1 ul.pola li{
float:none;
width:100%;
display:block;
margin-right:0%;
} 

}


/*641px～PC　PC上では見えないようにする*/
@media screen and (min-width:641px){
	.footer_area{
		display: none;
}	
}

/*スマホ～641pxの幅サイズまで    background-color: rgba( 0, 0, 0, 0.6 );*/
@media screen and (max-width:640px){
.footer_area {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;

	z-index: 10000;
}
.footer_area .footer_area_inner {
    position: relative;
    width: 100%;
    margin: 0px auto;
    padding: 10px 0;
	margin-right: 0px;
}
.footer_area .footer_area_inner1 {
width:33.333%;
float:left;
text-align:center;
background:#2d7cb4;
padding-top:10px;
padding-bottom:10px;
font-size:16px;
font-weight:bold;
}
.footer_area .footer_area_inner2{
width:33.333%;float:left;
text-align:center;
background:#808080;
padding-top:10px;
padding-bottom:10px;
font-size:16px;
font-weight:bold;
}
.footer_area .footer_area_inner3{
width:33.333%;float:left;
text-align:center;
background:#06c755;
padding-top:10px;
padding-bottom:10px;
font-size:16px;
font-weight:bold;
}
.footer_area .footer_area_inner1 a, .footer_area .footer_area_inner2 a, .footer_area .footer_area_inner3 a{ 
color:#ffffff;
text-decoration:none;
}



}



.tbl-r02 th {
  background: #f1f1f1;
  border: solid 1px #ccc;
  padding: 5px;
font-weight:normal;
text-align:left;
}
table.tbl-r02 td {
　border: solid 1px #ccc !important;
  padding: 5px;
}
 
@media screen and (max-width: 644px) {
  .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl-r02 {
    width: 100%;
  }
  .tbl-r02 th,
  .tbl-r02 td {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
.ta1, .ta1 td{border:0px;}

 

.video iframe {max-height:230px !important;
}



}