@charset "utf-8";

/*bodyの直接の子要素のh1タグ（ページ最上段にあるh1）設定
---------------------------------------------------------------------------*/
body > h1 {
	display: none;
}

/*コンテナー（HPを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	width: auto;
	margin-right: 6px;
	margin-left: 6px;
}

/*ヘッダー（サイト名ロゴが入ったブロック）
---------------------------------------------------------------------------*/
header {
	text-align: center;
}
/*h1ロゴの設定*/
header h1 {
	padding: 30px 0 30px 0;	/*左から、上、右、下、左への余白*/
}
header h1 img{
	vertical-align: middle;
}
header h1 img { 
    max-width: 100%; 
    height: auto; 
} 

/*上部のメインメニュー
---------------------------------------------------------------------------*/
/* メインメニュー */
nav#menu ul {
   list-style-type: none;
   float:left;
   list-style:none;
   background-color: #009933;	/*背景色（古いブラウザだとここの色のみが出ます）*/
   background-image: -webkit-gradient(linear, left top, left bottom, from(#00ff00), to(#009900));	/*グラデーション*/
   background-image: -webkit-linear-gradient(#00ff00, #009900);
   background-image: linear-gradient(#00ff00, #009900);
   border-radius: 10px 10px 10px 10px;	/*角丸のサイズ。それぞれ左上、右上、右下、左下への設定*/
   -webkit-box-shadow: 1px 2px 7px #c47a12;	/*影の設定。それぞれ右へ、下へ、ぼかし幅、色の設定。*/
   box-shadow: 1px 2px 7px #c47a12;
   margin-bottom: 25px; 
}


/* サブメニュー1段目 */
nav#menu ul ul {
   display:none;
   position: absolute;
   top:100%;
   left:0;
}

/* サブメニュー2段目以降 */
nav#menu ul ul ul {
   top:0;
   left:100%;
}

/* リスト */
nav#menu li {
   float:left;
   border-right: 1px dotted rgba(255,255,255,0.6);	/*メニューの右側の線の幅、線種、色（左３つの数字で色を指定、最後の小数点で透明度を指定）*/

}


nav#menu li:hover {
   background:#ddffff;
   position:relative;
}

nav#menu li:hover ul {
   display: block
}

nav#menu li li {
   clear:both;
   margin-left:0;
   background:#f5f5f5;
   border-bottom:1px solid #999999;
   border-left: 1px dotted rgba(255,255,255,0.6);	/*左側に線を入れる*/
}
nav#menu li li a:hover {
   margin-left:0;
   background:#ddffff;
}


nav#menu li ul {
   border-bottom:1px solid #999999;
   border-bottom:none;
}
nav#menu li a {
   display:block;
   width:160px;
   padding:10px 0;
   color:#ffffff;
   font-weight:bold;
   text-align:center;
   outline:none;
   -webkit-transition: 0.3s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
   transition: 0.5s;			/*同上*/
}

nav#menu li a.active {
   display:block;
   width:160px;
   padding:10px 0;
   color:#ffffff;
   background-color:#ddffff;
}

nav#menu li a:hover {
   color:#ff3333;	/*文字の色(赤)*/
   text-decoration:none;
}

nav#menu li li a {
   display:block;
   width:160px;
   padding:10px 2;
   color:#000000;
   line-height:20px;
   text-align:center;
   outline:none;
}

/*上部のメインメニューsliclkNav
---------------------------------------------------------------------------*/

#menu {
  display: none;
}
@media screen and (min-width : 800px) {
  body {
    margin: 0;
  }
  #content {
    margin: 0;
  }
  #menu {
    display: block;
  }
  .slicknav_menu {
    display: none;
  }
  i.fa.fa-caret-right {
    font-size: 14px;
    display: inline-block;
  }
}

/*コンテンツ（main,subを囲むブロック）
---------------------------------------------------------------------------*/
#contents {
	width: auto;
}

/*main,subコンテンツ
---------------------------------------------------------------------------*/
#main, #sub {
	float: none;
	width: auto;
}

/*トップページのメイン画像
---------------------------------------------------------------------------*/
#mainimg {
	height: auto;
	width: 100%;
}
#slide_image {
	height: auto;
	width: 100%;
	position: relative;
}
#slide_image2 {
	height: auto;
	width: 100%;
	position: absolute;
	left:0px;
	top:0px;
}

/*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/
#new p{
	overflow: auto;	/*高さ指定を超えるとiframe風にスクロールが出る設定。全部表示させたいならこの行と下のheightの行を削除。*/
	height: 250px;
	padding-left: 10px;
}

/*servic.html(宿泊)の製品紹介の画像
---------------------------------------------------------------------------*/
#main img {
	max-width: 100%;
	height: auto;
}
/*service2.html（宿泊の詳細ページ）
---------------------------------------------------------------------------*/
/*宿泊の詳細ページではメインメニューを表示させない設定 (削除)*/
#service2 nav#menu,
	display: none;
}

/*staff.html内の製品紹介の各ブロック
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
#main section.staff article {
	float: none;
	width: auto;
	height: auto;
	display: block;
}
/*ボックス内の段落タグ設定*/
#main section.staff article p {
	font-size: 14px;
	line-height: 2;
}
/*ボックス内の写真設定*/
#main section.staff article figure img {
	float: left;
	margin-right: 10px;
}

/*contact.html（お問い合わせページ）
---------------------------------------------------------------------------*/
/*お問い合わせページではサブコンテンツを表示させない設定*/
#contact #sub {
	display: none;
}

/*その他
---------------------------------------------------------------------------*/
/*写真の設定*/
#main img.wa {
	width: 100%;
	height: auto;
}