@charset "utf-8";
/* ===================================================

◇　Responsive Base CSS　◇

====================================================== */
/* ---------------------------------------------------
	common
------------------------------------------------------ */

@media screen and (max-width: 640px) {
	.ver_pc{ display: none;}
	.ver_sp{ display: block;}
}



/* ---------------------------------------------------
	Top Nav & Header
------------------------------------------------------ */
@media screen and (max-width: 1000px) {
	#top_nav { }
	#top_nav ul{ width: 100% !important;}
	#top_nav li { margin-right: 1% !important; }
	#top_nav #tn_tokuten { width: 35%; margin: 0 1% 0 0;}
	#top_nav #tn_bus     { width: 13%; margin: 0 1% 0 0;}
	#top_nav #tn_tel     { width: 18%; margin: 0 1% 0 0;}
	#top_nav #tn_plan    { width: 16%; margin: 0;}
	#top_nav #tn_cancel  { width: 13%; margin: 0;}

	#header  { margin: 15px 0; padding: 0 1%; width: 98%; position: relative;}
	#head_nav { float: right; margin-top: 60px;}
	#head_nav li:not(:nth-child(-n+2)) { display: none;}

	/*
	#change_switch{ top: 10px; right: 10px; position:absolute; margin: 0; padding: 0;}
	#change_switch li  { display: block; float: left; margin: 0 0 0 10px;}
	#change_switch li a{ display: block; margin: 0; padding: 10px 25px; }
	*/
}
@media screen and (max-width: 768px) {
	#top_nav { height: auto !important; }
	#top_nav #tn_tokuten { width: 41%; margin: 0 1% 0 0;}
	#top_nav #tn_bus     { width: 15%; margin: 0 1% 0 0;}
	#top_nav #tn_tel     { width: 21%; margin: 0 1% 0 0;}
	#top_nav #tn_plan    { width: 19%; margin: 0;}
	#top_nav #tn_cancel  { display: none; }


/*
	#head_logo    { clear: both; float: none; margin: 0 0 20px; width: 70% !important; }
	#head_logo img{ display: inline-block; float: none;}
	#head_logo a  { display: block; width: 0 auto;}
*/
}
@media screen and (max-width: 640px) {
	#top_nav #tn_tokuten { width: 23%; margin: 0 1% 0 0;}
	#top_nav #tn_bus     { width: 25%; margin: 0 1% 0 0;}
	#top_nav #tn_tel     { width: 13.5%; margin: 0 1% 0 0;}
	#top_nav #tn_plan    { width: 34%; margin: 0;}
	#top_nav li img{ width:  100%;}

	#head_nav { float: none; margin-top: 10px;}

	/*
	#head_logo  { padding: 0 50px 0 0; width: 100% !important; box-sizing:border-box; }
	#top_nav ul { margin: 0 auto; width: 98% !important;}
	*/
	/* #change_switch{ top: 0; } */
}



/* ---------------------------------------------------
	G-nav
------------------------------------------------------ */
@media screen and (max-width: 1000px) {
	#nav_wrap { padding: 0 1%; width: 98%; position:relative;}
	#open_menu{
		display: block; /* top: -63px; */ right: 20px; position: fixed;
		margin: 0 0 10px; /* background: #3d2a18; */ box-sizing: border-box;
		z-index: 20;
	}
	/* #open_menu span{ display: block; padding: 5px;} */
	#open_menu img{ display: block; width: 40px; height: 40px;}

	#open_menu:hover{ text-decoration: none; background-color: #554533;}
	#gn_09, #gn_010, #gn_close, .add_menu{ display: block;}
	#gnav .add_menu a { display: block;}

}
@media screen and (max-width: 768px) {
	#open_menu{ top: -80px; /*width: 25%;*/}
}
@media screen and (max-width: 640px) {
	/* #header   { padding: 0;} */
	/*
	#open_menu{ top: 0; right: 0; margin: 0 0 15px; width: 100%; height: 30px; position: relative; }
	#open_menu span{ padding: 5px; line-height: 30px; background-position: 98% center;}
	*/
	#head_logo{ width: 100%; float: none; text-align: center;}
	#head_logo img{ display: inline-block; float: none;}
}
@media screen and (max-width: 414px) {
	#open_menu{ /* top: -185px;*/ right: 5px;}
	#header_wrap { padding: 60px 0px 0px;}
	#head_logo { width: auto; margin: 0 55px 0 0; padding: 0; text-align:left;}
	#head_logo img{ display: inline-block; margin: 0; width: 48%;}
}
@media screen and (max-width: 320px) {
	#open_menu{ top: -70px;}
	#header_wrap { padding: 60px 0px 0px;}
	#header { margin: 10px auto 15px !important;}
}


/* ---------------------------------------------------
	Search_area
------------------------------------------------------ */
@media screen and (max-width: 1000px) {
	#search_block{ width: 100%;}
	#search_block dl{ margin: 0 auto; padding: 10px 2%; width: 96%; line-height: 2;}
	#search_block dt{ padding: 0; width: 100%; float: none;}
	#search_block dd{ margin: 0 0 5px;}
	#search_block dd .nav{ width: auto; float: none; line-height: 2; }
	#search_block #search_icon { margin-top: 0; top: 15px; z-index: 19;}

	#search_block #search_msg dd p{ margin: 0 0 15px;}
	#search_block #search_msg dd a{ top: 0; left: 0; position: static;}
}
@media screen and (max-width: 768px) {
	#search_block #search_icon { top: -60px;}
}
@media screen and (max-width: 640px) {
	#search_block span,
	#search_block select{ display: inline-block;}
	#search_block #search_submit{ margin: 0;}

	#search_block .roomassign_select_table { border-bottom: 1px solid  #cfd1d4;}
	#search_block .roomassign_select_table dl { display: table; width: 100%; border-bottom: none; table-layout: fixed;}
	#search_block .roomassign_select_table dt,
	#search_block .roomassign_select_table dd { display: table-cell; padding: 10px; text-align: left;}
	#search_block .roomassign_select_table dt { width: 120px;}
	#search_block .roomassign_select_table dd { border: none;}

	#search_block #search_msg dd  { margin: 15px 10px 0;}

	#search_block .fukidashi_hyoujichi { float: left;}

	#search_block dl{ border-top: none;}
	#search_block .acc_tit{ padding: 0 0 0 10px; background-position: 130px center;}
	#search_block .acc_tit.active{ background-position: 130px center;}
	#search_block .acc_contents{}

	#search_block .split_item { display: block; float: none;}

	#searchtypearea { float: none; padding: 0 0 5px 0;}
}


/* ---------------------------------------------------
	Contents title
------------------------------------------------------ */
@media screen and (max-width: 1000px) {
	#title_col h2 { width: 100%; height: auto; padding: 27% 0 0 0; -webkit-background-size: cover; background-size: cover;}
}
@media screen and (max-width: 768px) {
	#title_col h2 { padding: 65px 0 50px; text-align: center;}
	#title_col h2 img,
	#cuisine #title_col h2 img { left: auto; bottom: auto; position: static;}
}


/* ---------------------------------------------------
	Contents / Layout & Post
------------------------------------------------------ */
@media screen and (min-width: 1000px) {
	.flexslider_con { height:513px; overflow: hidden;}
}
@media screen and (max-width: 1000px) {
	#contents  { margin: 0 1%; width: 98%; }
	#main_area { width: 100%; }

	#bread_area p { width: 96%; padding: 15px 0; margin: 0 auto; text-align: right;}

	/* contents */
	#cnav { width: 98%; margin: 0 auto;}
	#cnav li { width: 23.5%;}
	#cnav li:not(:last-child) { margin: 0 2% 0 0;}

	/* flexslider */
	.flexslider_con .flex-control-thumbs li { width: 32%;}
	.flexslider_con .flex-control-thumbs li:not(:last-child) { margin-right: 2%;}
	.flexslider_con .flex-direction-nav a { width: 8%; height: 0; padding: 0 0 8% 0;}
	.flexslider_con .flex-direction-nav a:before { width: 100%; height: 0; padding: 0 0 100% 0;}
}
@media screen and (max-width: 768px) {
	#main_area{ clear: both; margin: 0 auto 25px; width: 98%; max-width: 98%; float: none; }
	.flexslider_con .flex-direction-nav { display: block;}
}
@media screen and (max-width: 640px) {
	#cnav li { width: 49%; margin-bottom: 10px !important;}
	#cnav li:nth-child(2) { margin-right: 0;}
}

/* ---------------------------------------------------
	Main Area
------------------------------------------------------ */
@media screen and (max-width: 768px) {
	#single_area .post_body img,
	#single_area .post_body img.aligennone,
	#single_area .post_body img.aligncenter,
	#single_area .post_body img.alignleft,
	#single_area .post_body img.alignright { clear: both; float: none; margin: 0 auto 10px; max-width: 100%;}
	#single_area #commentform input,
	#single_area #commentform textarea{ width: 100%; max-width: 100%;}
}
@media screen and (max-width: 640px) {
	#single_area .post_body img,
	#single_area .post_body img.aligennone,
	#single_area .post_body img.aligncenter,
	#single_area .post_body img.alignleft,
	#single_area .post_body img.alignright { width: 100%; }
	#single_area #commentform   { margin: 0 0 25px; padding: 10px 0;}
	#single_area #commentform p { margin: 0 auto 15px; width: 96%;}
}

/* ---------------------------------------------------
	固定ページ
------------------------------------------------------ */
@media screen and (max-width: 1000px) {
	#page_area section { width: 98% !important;}
}
@media screen and (max-width: 768px) {
	#page_area section { padding: 122px 2% 58px 2%;}
}
@media screen and (max-width: 640px) {

}


/* ---------------------------------------------------
	Footer
------------------------------------------------------ */
@media screen and (max-width: 1000px) {

	#footer_wrap .acc_contents { margin: 0; width: 100% !important;}
	#footer  { margin: 0 auto; width: 98%; }
	#footer #add_area { width: 39%; float: left; }

	#footer #fnav_area{ width: 58%; float: right;}
	#fnav_area .fnav  { width: 33%; float: left;}
	#fnav_area .fnav li{ margin: 0 0 5px;}
	.center { border: none;}

	#backtop { width: 100%;}
	#copyright{ width: 100%;}
}
@media screen and (max-width: 768px) {

	#footer_wrap  { border: none; }
	#footer_wrap .acc_tit {
		display: block; margin: 0 10px; padding: 8px 2%;
		font-size: 13px; line-height: 20px; box-sizing: border-box;
	}
	#footer_wrap .acc_contents { margin: 15px 0 0; padding: 0 10px; width: 100%; box-sizing: border-box;}

	#footer { padding: 25px 0 0 !important; box-sizing:border-box; }
	#footer #add_area      { clear: both; margin: 0 auto; width: 96%; float: none; }
	#footer #add_area:after{ clear: both; content: "."; display: block; height: 0; font-size: 0; visibility: hidden; }
	#footer #ft_logo_area  { text-align:center; }
	#ft_logo_area img      { width: 49%;}

	#footer #address  { clear: none; margin: 0; padding: 15px 0 0; }
	#address p.time   { margin: 0;}
	#address p.address{ clear:both; margin: 20px 0 0;}

	#footer #fnav_area { clear: both; width: 100% !important; float: none; margin: 15px 0 0; padding: 15px 0; }
	#fnav_area .acc_tit { background-color: rgba(255,255,255,0.25);}
	#fnav_area .acc_contents { padding: 0 2%; width:  96%;}
	#fnav_area .fnav   { display: inline; margin: 0; width: auto; float: none; line-height: 2.5;}
	#fnav_area .fnav li{ padding: 0 0 0 15px; width: 50%; float: left; font-size: 13px; box-sizing: border-box;}


	#group_list_area .acc_tit { background-color: #dcd6d1;}
	.group_list { border-bottom: solid 1px #6b4737; }

	#fnav_area .acc_contents:after { clear: both; content: "."; display: block; height: 0; font-size: 0; visibility: hidden; }

}
@media screen and (max-width: 640px) {
	#footer { margin: 0 auto 15px; padding: 25px 0 0 !important; width: 98%; }
	#footer #ft_logo { margin: 15px auto 0; width: 100%; float: none; text-align: center; }
	#footer #ft_logo img { margin: 0 0 10px !important;}
	#footer #address { clear: both; margin: 0 auto; padding:  15px 0 0; text-align: center; }
	#footer #fnav_area{ clear: both; width: 100%; float: none; margin: 15px 0 0; padding: 15px 0; }
	#footer .fnav { clear: both; display:  block; margin: 0 auto; width: 96%; float: none; line-height: 2;}
	#fnav_area .fnav li{ width: 100%; float: none;}
}


/* 修正履歴
================================================================

・180125：上口（大門）：フッター #group_list 箇所レイアウト修正
・180604：大門：フッター #group_list_area 箇所 色・背景指定以外のスタイルを削除

================================================================ */
