@charset "UTF-8";
/* ---------------------------------------------------------------
	Search.css
--------------------------------------------------------------- */
/* ---------------------------------------------------
	共通
------------------------------------------------------ */
#search_List{}

#search_List h2,
#search h2{
	background: url(../../search/img/title_bg.png) no-repeat center top;
}

#search_List #contents,
#search #contents{
	background: url(../../search/img/contents_bg.jpg) no-repeat left top;
}

#search_List table,
#search table {width: 100%; border-collapse: collapse;}

/* ---------------------------------------------------
	お宿一覧
------------------------------------------------------ */
#search_List section{ margin: 0 auto; width: 100%;}
#search_List section>h3{ margin: 35px auto 30px; text-align: center;}
#search_List section>p{ margin: 0 auto 50px; color: #321406; text-align: center;}

#search_List #contents .acc_tit { display: none;}
#search_List .item{ margin: 0 30px 0 0; padding: 0 0 100px; width: 250px; float: left;}
#search_List .item:nth-of-type(8n),
#search_List .item:last-of-type{ margin: 0;}
#search_List .item:nth-of-type(8n+2){ clear: both;}

#search_List .item>img{ margin: 0 0 15px;}
#search_List .item h4 {
	margin: 0 0 15px; padding: 0 0 0 15px; font-size: 16px; line-height: 1.6;
	color: #482e00; background: url(../../search/img/h4_bg.gif) no-repeat left top;
}
#search_List .item h4 a:hover { text-decoration: none;}
#search_List .item p { margin:  15px 0;}

#search_List .item table{ margin: 15px 0; line-height: 1.4; table-layout: fixed;}
#search_List .item th{ padding: 10px 0; width: 85px; text-align: center; background: #f0e3d1;}
#search_List .item td{ padding: 10px; background: #fff;}

#search_List .item table,
#search_List .item th,
#search_List .item td { border: solid 1px #cbb493;}

#search_List .item>a { float: right;}
#search_List .item>a:hover img { -ms-filter: "alpha( opacity=70 )"; filter: alpha( opacity=70 ); opacity:0.70;}


/* ---------------------------------------------------
	お宿詳細
------------------------------------------------------ */
#search #s_nav {
	clear: both; margin: 50px auto 0; padding: 0 0 8px; width: 975px;
	text-align: right; background: url(../../search/img/snav_bg.jpg) repeat-x center bottom;
}
#search #s_nav a { display: block; float: left;}
#search #s_nav a:hover img { -ms-filter: "alpha( opacity=70 )"; filter: alpha( opacity=70 ); opacity:0.70;}
#search #s_nav img {}

#search section{
	margin: -1px auto 0; padding: 40px 30px; width: 975px; box-sizing: border-box;
	background: #fff; border: 1px solid #dcd0c0;
}

#search #detail_info th,
#search #detail_info td,
#search .detail th,
#search .detail td{ border: 1px solid #cbb493;}


#search #detail_info{ margin: 0 0 25px; border-bottom: 1px solid #b5afa0;}
#search #detail_info #data{ width: 505px; float: left;}

#search #detail_info h3{
	margin: 0 0 25px; padding: 0 0 5px; font-size: 26px; color: #482e00; line-height: 1.4;
	border-bottom: 1px solid #cc8814;
}
#search #detail_info h3 span{
	display: inline-block; padding: 3px 0 3px 20px;
	border-left: 8px solid #cc8814;
}

#search #detail_info p{ margin: 0 0 15px; line-height: 1.6;}
#search #detail_info #tel { font-size: 18px; font-weight: bold;}

#search #detail_info #tel span{
	display: inline-block; margin: 0 15px 0 0; padding: 2px 20px 0;
	color: #fff; font-size: 13px; font-weight: normal; background: #482e00;
}

#search #detail_info th, #search #detail_info td{ padding: 5px 15px;}
#search #detail_info th { width: 220px; font-weight: normal; text-align: left; background: #f0e3d1; box-sizing: border-box;}
#search #detail_info td a:hover { text-decoration: none;}
#search #detail_info>img{ margin: 50px 0 0; float: right;}

#search #detail_info #reserve{ clear: both; padding: 30px 0; text-align: center;}
#search #detail_info #reserve a { display: inline-block; margin: 0 auto;}
#search #detail_info #reserve a:hover img { -ms-filter: "alpha( opacity=70 )"; filter: alpha( opacity=70 ); opacity:0.70;}


#search .detail { width: 50%; box-sizing: border-box;}
#search .detail:nth-child(even){ padding: 0 50px 50px 30px; float: left;}
#search .detail:nth-child(odd){ padding: 0 30px 50px 50px; float: right;}

#search .detail h4 { margin: 0 0 25px; padding: 0 0 10px; border-bottom: 3px solid #e6cc99;}
#search .detail .flex_thum_fade{ margin: 0 auto 15px; text-align: center; position: relative;}
#search .detail .flex-control-thumbs{ margin: 5px auto;}
#search .detail .flex-control-thumbs li{ width: 25%; padding: 0 1%; box-sizing: border-box;}

#search .detail figure{ margin: 0 auto 15px; text-align: center;}

#search .detail .flex_thum_fade .slides img,
#search .detail figure img{ border: 1px solid #cbb493;}

#search .detail p { margin: 15px auto; line-height: 1.6;}

#search .detail th {
	width: 80px; padding: 5px; color: #fff; text-align: center;
	font-weight: normal; background: #977a51;
}
#search .detail td { padding: 5px 10px;}


#search .inq{
	clear: both; display: table; position: relative;
	margin: 35px auto 70px; padding: 14px 10px 14px 110px; width: 975px;
	box-sizing: border-box; border: 2px solid #d1a75f;
	background: url(../../search/img/bn_bg.png) no-repeat left top;
}

#search .inq h4{ top: -20px; left: 15px; position: absolute;}
#search .inq>img,
#search .inq .tel-link,
#search .inq>a { display: table-cell; vertical-align: middle;}

#search .inq .tel-link{ padding: 0 30px 0 20px;}
#search .inq a:hover img { -ms-filter: "alpha( opacity=70 )"; filter: alpha( opacity=70 ); opacity:0.70;}



/* ---------------------------------------------------
	ご予約の流れ
------------------------------------------------------ */
#flow h2{ background: url(../../search/img/flow/title_bg.png) no-repeat center top;}
#flow #contents{ clear: both; margin: 0 auto; width: 100%; max-width: 1100px;}

#flow h3{
	margin: 0 auto; padding: 25px 0 50px; text-align: center;
	background:
		url(../../search/img/flow/tit_bg_l.png) no-repeat left top,
		url(../../search/img/flow/tit_bg_r.png) no-repeat right bottom;
}
#flow section>p{ margin: -15px auto 50px; text-align: center; font-size: 14px; font-weight: bold;}

#flow section a { color: #a6448a; text-decoration: underline;}
#flow section a:hover{ text-decoration: none;}

#flow section span{ display: inline-block;}
#flow .note { margin: 15px 0 0; color: #a6448a; text-align: center;}

#flow div[id^="sec0"]>div>p,
#flow #sec01 .reply {
	padding: 25px 15px; font-size: 14px; text-align: center;
	background: #fff; border: 2px solid #dcd0c0;
}
#flow div[id^="sec0"]>div>img { display: block; margin: 15px auto;}

#flow #sec01{ width: 700px; float: left;}
#flow #sec01 #tit_area{
	margin: 0 0 15px; padding: 25px 15px; text-align: center; position: relative;
	background: #41271b url(../../search/img/flow/sec_tit_bg.jpg) no-repeat left top;
}
#flow #sec01 #tit_area h4 { }
#flow #sec01 #tit_area a { position: absolute; top: 50%; right: 25px; margin: -13px 0 0 0;}
#flow #sec01 #tit_area a:hover img { -ms-filter: "alpha( opacity=70 )"; filter: alpha( opacity=70 ); opacity:0.70;}

#flow #sec01>div p { margin: 0 0 15px;}
#flow #sec01>div dl{ margin: 10px 0 0; padding: 15px; text-align: left; background: #f5eaf0;}
#flow #sec01>div dt{
	margin: 0 0 10px; padding: 0 0 0 20px;
	background: url(../../search/img/flow/flow_icon.png) no-repeat 0 4px;
}

#flow #sec02 { width: 355px; float: right;}
#flow #sec02 .acc_tit { display: none;}
#flow #sec02 dl{
	margin: 0 0 15px; padding: 15px;
	background: #41271b url(../../search/img/flow/sec_tit_bg.jpg) no-repeat left top;
}
#flow #sec02 dt{ padding: 20px 0 30px; text-align: center;}
#flow #sec02 dd{ padding: 15px 20px; background: #fff;}
#flow #sec02 ul{ margin: 15px 0 0;}
#flow #sec02 li{ padding: 0 0 0 20px; background: url(../../search/img/flow/flow_icon.png) no-repeat 0 4px;}

#flow .comp{
	margin: 0 0 15px; padding: 25px 0; text-align: center;
	background: url(../../search/img/flow/btn_comp_bg.jpg);
}



/* ---------------------------------------------------
	clear
------------------------------------------------------ */
#search_List section:after,
#search_List .item:after,
#search #s_nav:after,
#search section:after,
#search #detail_info:after,
#search .slides:after,
#search #reservation:after,
#flow section:after,
#flow #tit_area:after{ clear: both; content: "."; display: block; height: 0; font-size: 0; visibility: hidden; }