/* CSS Document */

/* ------------------------- 共通仕様(S) ----------------------------------- */

*{
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro W3', 'ＭＳ Ｐゴシック', メイリオ, Meiryo, Arial, verdana, sans-serif;
	word-break: break-all;
}

body{
	color: #333333;
	margin: 0px;
	font-size: 75%;
}

form{
	margin:0px;
	padding:0px;
}

a {
	color: #333333;
}

img{
	border:none;
}

h1, h2, h3 {
	font-size: 100%;
	margin: 0;
	padding: 0;
}


br.clear{
	line-height:0;
	font-size:0;
	clear:both;
}


#wrapper{
	width:900px;
	margin:0 auto;
}

/* ------------------------- 共通仕様(E) ----------------------------------- */


/* ------------------------- ヘッダー部分(S) ----------------------------------- */


#header .lang_link {
	width: 400px;
	overflow: hidden;
	position:absolute;
	right: 26px;
	top: 8px;
	list-style:none;
	margin:0;
	padding:0;
}

	#header .lang_link li {
		float: right;
		padding-left: 12px;
		background-image:url(../image/common/lang_mark.png);
		background-position:left center;
		background-repeat:no-repeat;
		font-size: 10px;
		line-height: 13px;
		margin-left: 4px;
	}

		#header .lang_link li a {
			color: #ffffff;
		}

#header{
	width:900px;
	height:137px;
	overflow:hidden;
	background-color:#000000;
	position:relative;
}

#header h1{
	width:650;
	height:102px;
	float:left;
	display:inline;
}

#header #right_menu{
	width:250px;
	height:102px;
	float:left;
	display:inline;
	background-image:url(../image/common/header_menu_bg.gif);
}

#header #right_menu .lang{
	list-style:none;
	padding:0;
	margin:17px 0 0 0;
	color:#FFFFFF;
}

#header #right_menu .lang a{
	color:#FFFFFF;
}

#header #right_menu .lang li{
	float:right;
	display:inline;
	padding:0;
	margin:0 15px 0 0;
}

#header #right_menu .contact{
	list-style:none;
	padding:0;
	margin:19px 0 0 0;
}

#header #right_menu .contact li{
	float:right;
	display:inline;
	padding:0;
	margin:0 15px 0 0;
}

#header #g_navi{
	list-style:none;
	overflow:hidden;
	padding:0;
	margin:0;
	background-image:url(/image/common/menu_btn_back.png);
}

#header #g_navi li{
	float:left;
	display:inline;
	padding:0;
	margin:0;
}

/* ------------------------- ヘッダー部分(E) ----------------------------------- */


/* ------------------------- パンくずナビ(S) ----------------------------------- */
#p_navi{
	list-style:none;
	overflow:hidden;
	padding:10px;
	margin:0;
}

#p_navi li{
	float:left;
	display:inline;
	padding:0;
	margin:0;
}

/* ------------------------- パンくずナビ(E) ----------------------------------- */


/* ------------------------- 下段ナビ(S) --------------------------------------- */
#bottom_navi{
	border:solid 1px #CCCCCC;
	padding:15px 15px 15px 30px;
	margin-bottom:20px;
}

#bottom_navi .contents_navi{
	margin-bottom:15px;
	font-size:130%;
}

#bottom_navi .info_navi{
	margin-bottom:15px;
}

#bottom_navi .hotel_address{
}

#bottom_navi .hotel_address strong.hotel_name{
	display:block;
	font-size:130%;
	text-decoration:underline;
}

#bottom_navi address{
	font-style:normal;
}


/* ------------------------- 下段ナビ(E) --------------------------------------- */

/* ------------------------- グループナビ(S) --------------------------------------- */
#group_navi{
	width:869px;
	border:solid 1px #CCCCCC;
	background-color:#D9ECE4;
	padding:15px;
	overflow:hidden;
	padding:0 0 15px 29px;
	margin: 0px;
}

#group_navi li{
	float:left;
	display:inline;
	width:160px;
	height:84px;
	margin:20px 10px 0 0;
	overflow:hidden;
}

#group_navi li img{
	margin-bottom:9px;
	display:block;
}


/* ------------------------- グループナビ(E) --------------------------------------- */

/* ------------------------- フッター部分(S) ----------------------------------- */
#footer{
	width:900px;
	overflow:hidden;
	padding:20px 0 0 0;
}

#footer .menu{
	width:900px;
	padding:0 0 5px 0;
	margin:0 0 5px 0;
	border-bottom:solid 1px #000000;
	list-style:inside;
	overflow:hidden;
}

#footer .menu li{
	margin-right:15px;
	float:left;
}

#footer .copy{
	text-align:right;
}
/* ------------------------- フッター部分(E) ----------------------------------- */



/* ------------------------- コンテンツ配置部分(S) ----------------------------------- */

#main_contents{
	width:900px;
	overflow:hidden;
}

/* ------------------------- コンテンツ配置部分(E) ----------------------------------- */


/* ------------------------- コンテンツ配置部分左(S) ----------------------------------- */

#left_contents{
	width:650px;
	display:inline;
	float:left;
}

#left_contents h2.subtitle{
	margin:0 0 15px 0;
	padding:0;
}

#left_contents h2.subtitle_t{
	margin:0 0 15px 0;
	padding:0 0 0 20px;
	background-image:url("/image/common/subtitle_t.jpg");
	height:30px;
	line-height:30px;
	font-size:16px;
	color:#2D2134;
}

#left_contents h2.subtitle_b{
	margin:0 0 15px 0;
	padding:0 0 0 20px;
	background-image:url("/image/common/h2_bg_b.jpg");
	height:30px;
	line-height:30px;
	font-size:16px;
	color:#2D2134;
}

#left_contents h3.lead{
	background-image:url(../../image/common/h3_lead.jpg);
	height:30px;
	width:620px;
	margin:0 0 15px 0;
	padding:0 15px 0 15px;
	line-height:30px;
	vertical-align:middle;
	color:#333333;
}

#left_contents .contents_box{
	margin:0 0 30px 0;
}

#left_contents .contents_box a.backtotop{
	background-image:url(../image/common/backtotop_bg.gif);
	background-repeat:repeat-x;
	width:100px;
	height:24px;
	line-height:24px;
	vertical-align:middle;
	text-align:center;
	float:right;
	display:inline;
	font-size:80%;
}

/* ------------------------- コンテンツ配置部分左(E) ----------------------------------- */


/* ------------------------- サイドバー配置部分(S) ----------------------------------- */
#sidebar{
	width:240px;
	display:inline;
	float:right;
}

#sidebar .box{
	margin-bottom:5px;
}

/* ------------------------- サイドバー配置部分(E) ----------------------------------- */


/* ------------------------- 宿泊予約部分(S) ----------------------------------- */
#reserve_search{
	width:240px;
	margin-bottom:15px;
}

#reserve_search .body{
	width:200px;
	padding:0 20px;
	background-image:url(../image/common/reserv_side.jpg);
	background-repeat:repeat-y;
}

#reserve_search .body h3{
	padding:15px 0 0 0;
}

#reserve_search .search_box{
	text-align:right;
	padding:15px 0 0 0;
}
/* ------------------------- 宿泊予約部分(E) ----------------------------------- */


/* ------------------------- おすすめプラン(S) ----------------------------------- */
#side_recommend_plan{
	margin:0 0 5px 0;
	border:solid 1px #CCCCCC;
	width:228px;
	padding:3px 5px 15px 5px;
}

#side_recommend_plan h2{
	margin-bottom:10px;
}

#side_recommend_plan .body{
	padding:0 10px;
}

#side_recommend_plan .image{
	float:left;
	display:inline;
	width:55px;
	height:55px;
	margin-right:10px;
	margin-bottom:10px;
}


#side_recommend_plan .doc{
	float:left;
	display:inline;
	width:140px;
	margin-bottom:10px;
}

#side_recommend_plan .checkall{
	text-align:right;
}
/* ------------------------- おすすめプラン(E) ----------------------------------- */


/* ------------------------- おすすめ季節情報(S) ----------------------------------- */

#side_recommend_season{
	margin:5px 0 5px 0;
	border:solid 1px #CCCCCC;
	width:228px;
	padding:3px 5px 15px 5px;
}

#side_recommend_season h2{
	margin-bottom:10px;
}

#side_recommend_season .body{
	padding:0 10px;
}

#side_recommend_season .image{
	float:left;
	display:inline;
	width:55px;
	height:55px;
	margin-right:10px;
	margin-bottom:10px;
}


#side_recommend_season .doc{
	float:left;
	display:inline;
	width:140px;
	margin-bottom:10px;
}


#side_recommend_season .checkall{
	text-align:right;
}
/* ------------------------- おすすめ季節情報(E) ----------------------------------- */


/* ------------------------- スタッフブログ(S) ----------------------------------- */
#side_staff{
	margin:0 0 5px 0;
	border:solid 1px #CCCCCC;
	width:228px;
	padding:3px 4px 15px 4px;
}

#side_staff h2{
	margin-bottom:10px;
}

#side_staff #rss_colum{
	padding:0 10px;
}

#side_staff #rss_colum .date{
	float:left;
	display:inline;
	width:65px;
	margin-bottom:5px;
}


#side_staff #rss_colum .title{
	float:left;
	display:inline;
	width:143px;
	margin-bottom:5px;
}

/* ------------------------- スタッフブログ(E) ----------------------------------- */


/* ------------------------- ツイッター(S) ----------------------------------- */
#twitter{
	margin:0 0 5px 0;
	width:240px;
}

#twitter .body{
	background-image:url(../image/common/twitter_body.jpg);
	padding:0 10px 11px 25px;
	height:170px;
	width:205px;
}


#twitter #tweet_list{
	overflow:auto;
	height:170px;
	width:205px;
}
/* ------------------------- ツイッター(E) ----------------------------------- */


/* ------------------------- モバイル(S) ----------------------------------- */
#mobile_qr{
	margin:0 0 5px 0;
	padding:0;
	border:solid 1px #CCCCCC;
}

#mobile_qr h3{
	margin:0 0 10px 0;
	padding:0;
}

#mobile_qr .qr_img{
	float:left;
	display:inline;
	width:80px;
	height:80px;
	margin:0 10px 10px 10px;
}


#mobile_qr .doc{
	font-size:80%;
	padding:0 10px 0 0;
}
/* ------------------------- モバイル(E) ----------------------------------- */
/* ------------------------- クチコミ(S) ----------------------------------- */
#reviews{
	margin:0 0 5px 0;
	border:solid 1px #CCCCCC;
	width:228px;
	padding:3px 4px 15px 4px;
}

#reviews iframe{
	width:210px;
	height:200px;
	margin:0 0 10px 0;
}

#reviews .note{
	padding:0 10px;
}
/* ------------------------- クチコミ(E) ----------------------------------- */

/* ------------------------- おしらせ(S) ----------------------------------- */

#notice{
	width:240px;
	margin:0 0 5px 0;
}

#notice h2{
	padding:0;
	margin:0;
}

#notice .box{
	border:1px solid #CCCCCC;
	padding:10px 13px;
}

#notice .box .link{
	margin-top:15px;
	text-align:right;
}

/*　海麓園用　*/




#header{
	width:900px;
	height:137px;
	overflow:hidden;
	background-color:#000000;
	position:relative;
}

#header h1{
	width:650;
	height:102px;
	float:left;
	display:inline;
}

#header #right_menu{
	position:absolute;
	right:0;
	background-image:none;
}


/* ------------------------------------------------------------------------
                        　　　 レスポンシブ
--------------------------------------------------------------------------- */
@media screen and (min-width: 768px){
    #responsible, .drawer-hamburger{
        display:none !important;
    }

	.footer_pagetop{
    	display:none !important;
    }

	.side_title{
		font-size:0px;
	}
}

@media screen and (max-width: 767px){
	.side_box{
		margin:0 !important;
		width:auto !important;
		border:none !important;

	}

	.side_title{
		margin:0 0 15px 0 !important;
		padding:0 0 0 20px !important;
		background-image:url("/image/common/subtitle_t.jpg");
		height:30px !important;
		line-height:30px !important;
		font-size:16px !important;
		color:#133038;
	}

	.side_title img{
		display:none;
	}

    #wrapper{
        width: auto;
    }

    #header{
        display:none !important;
        width: 100%;
    }


    #responsible {
        position: relative;
        width: 100%;
        min-height:60px;
        height: auto;

		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#865d41+0,683300+100 */
		background: #865d41; /* Old browsers */
		background: -moz-linear-gradient(top,  #865d41 0%, #683300 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #865d41 0%,#683300 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #865d41 0%,#683300 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#865d41', endColorstr='#683300',GradientType=0 ); /* IE6-9 */



		display:table;
  		border-collapse: collapse;
    }
    #responsible a.top{
		display:block;
		height:100%;
		text-decoration:none;
        display:table-row !important;
        color:#ffffff;
	}
    #responsible h1{
        width: 100px;
        height: auto;
        text-align: center;
        line-height: 1.2;
        display:table-cell !important;
        vertical-align:middle;
        padding:5px 0px;
    }

    #responsible span{
        display: block;
        width: auto;
        padding:5px 50px 5px 0;
        overflow: hidden;
        line-height: 1.2;
        outline-width: 100px;

        font-size:10px;
        display:table-cell;
        vertical-align:middle;
    }

    .drawer-hamburger{
        position: absolute;
        width: 50px;
        height: 50px;
        padding: 0 10px;
    }

    #top_pr{
    	display:none;
    	/*
    	overflow:hidden;
    	height:auto !important;
    	margin-bottom:5px !important;
    	*/
    }

    #main_contents{
        width:100%;
        overflow:hidden;
    }

    #left_contents{
        float: none;
        width: 100%;
    }
    #sidebar{
        float: none;
        width: 100%;
    }

    #top_contents{
        width: 100%;
    }
    #top_contents img{
        width: 100%;
        height: auto;
    }

    .banner_box{
        width: 100%;
    }

    .banner_box a img{
        width: 92%;
		margin:0 4%;
        height: auto;
    }

    .map iframe{
        width: 100%;
	    height: 280px;
    }
    #footer{
        width: 100%;
    }



	.drawer-hamburger-icon, .drawer-hamburger-icon:before, .drawer-hamburger-icon:after{
		background-color:#ffffff;
	}
	.drawer-brand{
		display:none !important;
	}
	.drawer-default{
		background-color:white;
	}
	.drawer-default ul{
		margin-bottom: 3px;
	    border-top: solid 1px #cccccc;
	}
	.drawer-default .drawer-menu-item{
		border-bottom:1px solid #cccccc;
		padding-bottom:10px;
	}
	.drawer-default .drawer-menu-item a{
		color:#333333;
		display:block;
	}

	#sidebar .box{
		margin-bottom:20px;
	}

	#sidebar .box img{
		margin:0 auto;
		display:block;
	}
	#side_recommend_season{
		width:92%;
	    padding: 10px 0 15px 0;
		margin:0 4%;
		margin-bottom:20px;
	}
	#side_recommend_season h2 img{
		width:100% !important;
		height:auto !important;
	}
    #side_recommend_season .doc{
		width:71%;
	}
	#side_recommend_season .image{
		width:25%;
		height:75px;
	}
	#side_recommend_season .image a{
		width:100% !important;
		height:100% !important;
	}

	#side_staff{
		width:92%;
		margin:0 4%;
	    padding: 10px 0 15px 0;
		margin-bottom:20px;
	}
	#side_staff h2 img{
		width:100% !important;
		height:auto !important;
	}
	#side_staff #rss_colum .date{
		width:26%;
	}
	#side_staff #rss_colum .title{
		width:74%;
	}

	#twitter{
		display:none;
	}
	#mobile_qr{
		display:none;
	}
	#mobile_qr h3 img{
		width:100% !important;
		height:auto !important;
	}

	#bottom_navi .contents_navi{
		display:none;
	}
	#bottom_navi .info_navi{
		display:none;
	}

	#group_navi{
		width:100%;
		padding:10px 0 0 0;
	}
	#group_navi li{
		width:46%;
		margin:0 2%;
		height:auto;
		padding-bottom:10px;
	    min-height: 87px;
	    font-size:11px;
	}
	#group_navi li.right{
	}
	#group_navi li img{
		width:100% !important;
		height:auto !important;
	}
	#bottom_navi{
		width: 83%;
		margin: 0 4%;
		margin-bottom: 20px;
		padding: 15px 0% 15px 9%;
	}


    #left_contents .contents_box .backtotop{
    	display:none !important;
    }

    .footer_pagetop{
		background-image:url(../image/common/backtotop_bg.gif);
		background-repeat:repeat-x;
		width:auto;
		height:auto;
		display:block;
		padding:3px;
		vertical-align:middle;
		text-align:center;
		float:right;
		font-size:80%;
		margin-right:5px;
		font-size:12px;
    }


	#footer .menu{
		width:100%;
		padding:10px;
		box-sizing:border-box;
	}
	#footer .menu li{
		margin-right:4px;
		float:none;
		display: inline-block;
	}
	#footer .menu li a{
		width:auto;
		font-size:11px;
	}

	#footer .copy{
		font-size:11px;
	}

	#reserve_search .body{
		width:92%;
		background-image:none;
		padding: 0;
    	margin: 0 4%;
	}
	#reserve_search{
	    padding: 3px 4px 15px 4px;
	}
	#reserve_search img{
		display:none;
	}
	.line select {
    	margin: 0 0 0 8%;
	}
    .line .res{
    	display:inline;
    	margin-right:15%;
	}
	.button_cover{
		width:100%;
		text-align:center;
		margin-bottom: -34px;
	}
	.search_button{
		float:none !important;
		margin:15px !important;
		width:80%;
		margin: 15px 10% !important;
		margin-left:0 !important;
	}

	.search_button input{
		width:100%;
	}
	#nitteiarea select{
		width:75%;
	}
	.check_button{
	    margin-top: 42px;
 	}

}
 .line .res{
    display:inline;
}
.head{
	float: left;
    margin-top: 4px;
    width: 44px;
}
.line{
	margin-top:5px;
	margin-bottom:7px;
}
h2.rsp_dis_none{
	margin-bottom:-10px;
}
#booking_inner strong {
    margin-bottom: 5px;
    display: block;
    padding-top:0px;
}
input.date {
    margin-bottom: 5px;
    width:40px;
}
.button_cover {
    margin-top: 7px;
}


@media screen and (min-width: 768px){
    .telpc{
        display:inline;
    }
    .telsp{
        display:none;
    }
}
@media screen and (max-width: 767px){
    .telpc{
        display:none;
    }
    .telsp{
        display:inline;
    }
}

.side_banner{
    margin-bottom:10px;
}
@media screen and (max-width: 767px){
    .side_banner img{
        width:100%;
    }
}