@charset "utf-8";
/* CSS Document */

/*TOP
----------------------------------------------------------------*/
.topMain{
	background-color:#fcf4df;
	background-image:url(../img/slideBg.png);
	background-position:bottom;
	background-repeat:no-repeat;
	height:370px;
	margin-bottom:70px;
}

.topMain div.topInner{
	width:980px;
	margin:0 auto ;
	padding:20px 0 0 0;
	position:relative;	
}

#bxslider{
	width:715px ;
	height:340px;
	/* box-shadow */
	box-shadow:4px 3px 8px -1px #e2e3e2;
	-moz-box-shadow:4px 3px 8px -1px #e2e3e2;
	-webkit-box-shadow:4px 3px 8px -1px #e2e3e2;
	float:left;
	z-index:1;
}
.bx-wrapper .bx-controls-direction a {
    z-index: 9998 !important;
}
#bxslider div img {
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	}
.qSearch{
	width:220px;
	position:absolute;
	right:0;
	top:20px;
	background:#facc2e;
	z-index:5;
}

.qSearch h2{
	text-align:center;
	border-bottom:2px solid #f5ab1c;
	color:#ed5900;
	font-size:17px;
	font-weight:bold;
	margin:10px;
	padding:0 0 10px 0;
}

.qSearch dl{
	margin:20px;
}

.qSearch dl dt{
	color:#ffffff;
	font-size:15px;
	font-weight:bold;
	padding:0 0 3px 0;
}

.qSearch dl dd{
	padding:0 0 10px 0;
}

.qSearch dl dd input{
	
	padding:3px;
}

.qSearch dl dd select{
	width:180px;
	padding:3px;
}

input.quickBtn{
	background:#ed7600;
	color:#ffffff;
	font-size:18px;
	border:1px solid #ed7600;
	width:180px;
	padding:2px;
	cursor:pointer;
	margin:0 20px 33px 20px;
}

.bnr_rps{
	display:none;
}
/* Guide line banner */
.guideline_banners {
    text-align: center; 
    margin: 20px auto 90px;    
}
.guideline_banners img {
    border: 1px solid #eee;
    margin: 0 10px;
}

/* Recommended Ryokans */
h2.recTitle{
	margin-bottom:15px;
}

div.recRyokan{
	float:left;
	width:306px;
	height:370px;
	margin:0 20px 25px 0;
	border-left:1px solid #e0e0e0;
	border-right:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	box-sizing: border-box;
}

div.recRyokan dl{
	margin:16px 10px 16px 10px;
	display:block;
	position:relative;
}
div.recRyokan dl dt{
	color:#666666;
	font-size:15px;
	font-weight:bold;
	padding-bottom:10px;
	display:block;
	width:210px;
}
div.recRyokan dl dt.long{
	font-size:13px;
	padding-bottom:10px;
}
div.recRyokan dl dt a{
	color:#666666;
}
div.recRyokan dl dd.prefTxt{
	padding:0 0 0 15px;
	position:absolute;
	top:0;
	right:0;
}
div.recRyokan dl dd.readTxt{
	border-top:1px solid #cccccc;
	color:#666666;
	padding-top:10px;
	font-size: 14px;
	line-height:1.3em;
}
.boxtype01{
	box-sizing: border-box;
	border-top:5px solid #993300;
}
.boxtype02{
	box-sizing: border-box;
	border-top:5px solid #ff6699;
}
.boxtype03{
	box-sizing: border-box;
	border-top:5px solid #458e62;
}
.boxtype04{
	box-sizing: border-box;
	border-top:5px solid #9966cc;
}
.boxtype05{
	box-sizing: border-box;
	border-top:5px solid #ff9933;
}
.boxtype06{
	box-sizing: border-box;
	border-top:5px solid #3181c3;
}
.colorType01{
	background:url(../img/areaMark02.png) no-repeat 0 5px;
	color:#993300;
}
.colorType02{
	background:url(../img/areaMark03.png) no-repeat 0 5px;
	color:#ff6699;
}
.colorType03{
	background:url(../img/areaMark04.png) no-repeat 0 5px;
	color:#458e62;
}
.colorType04{
	background:url(../img/areaMark05.png) no-repeat 0 5px;
	color:#9966cc;
}
.colorType05{
	background:url(../img/areaMark06.png) no-repeat 0 5px;
	color:#ff9933;
}

.colorType06{
	background:url(../img/areaMark07.png) no-repeat 0 5px;
	color:#3181c3;
}

.topL{
	width:475px;
	float:left;
	margin: 0 0 30px 0;
}
.topR{
	width:475px;
	float:right;
}
.fb-page{
		width: 470px;
		margin: auto 0;
	}
dl.topics {
    overflow: hidden;
    zoom: 1;
	font-size:13px;
	line-height:1.5em;
}
dl.topics dt {
    width: 100px;
    float: left;
    clear: both;
	color:#999999;
	padding-top:20px;
}
dl.topics dd {
    padding: 0 0 5px 120px;
	border-bottom:1px solid #999;
	padding-top:20px;
}

.bnrArea{
	border-top: 2px solid #CCC;
}
.bnrArea ul{
	margin:30px 0;
}
.bnrArea ul li{
	float:left;
	margin:0 13px 0 0;
	padding-bottom:15px;
}
.bnrArea ul li:nth-child(4n){
	margin:0 0 0 0;
}

.bxslider01 li {
  width: 672px;  /* トリミングしたい幅 */
  height: 400px; /* トリミングしたい高さ */
  overflow: hidden;
  position: relative;
}
.bxslider01 li img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}


/* Privacy Policy
----------------------------------------------------------------*/ 
.policy ol {
    padding-left: 30px;    
}
#WARAPPER #CONTENTS.policy h4 {
    margin: 20px 20px 15px;
}
#WARAPPER #CONTENTS.policy ol li > ul li {
    list-style-type: none;
    padding: 0 0 5px 0;
}
#WARAPPER #CONTENTS.policy ol li > ul {
    margin-top: 10px;
}
#WARAPPER #CONTENTS.policy ol {
    margin-top: 10px;
}
#WARAPPER #CONTENTS .color-back {
    background:#EEDCD0;
    width: 80%;
    margin:20px 40px;
    padding:20px 0;
}
/* Accommodations
----------------------------------------------------------------*/
div.tabContent {
	width:100%;
	margin: auto 0;}

.tab ul{
	overflow:hidden;	
}
.tab li{
		width:125px;
		display:table-cell;
		height: 50px;
		margin-right:1px;
		padding:0.5% 3%; 	
		text-align:center; 
		font-family : Arial ;
		font-size: 0.9em;
		font-weight:600;
		vertical-align:middle;
		border-top-right-radius: 15px;
		border-top-left-radius: 15px;
		}

.tab li a {
		color:#fff;
		text-decoration:none;
}
.tab li a:link,.tab li a:visited, .tab li a:active {
		color:#fff;
		text-decoration:none;
}
.tab li a:hover {
		text-decoration:underline;
		color:#fff;
}	

.tab li.all {
	color: #ed7600;
	background-color:#fff;
	border: 3px solid #f4a253;
	border-bottom: 0;
}
.tab li.all a {
	color: #ed7600;
	text-decoration:none;
}
.tab li.all a:visited {
	color: #ed7600;
	text-decoration:none;
}
.tab li.all a:hover {
	text-decoration:underline;
	color: #ed7600;
}	
	
.tab li.select{
	opacity:0.8;}
.content{
	background:#fff; 
	margin: 0 0 40px;
	min-height:150px;
}
.content#all{
	border-top: 4px solid #ed7600;
}
.content#hokaido {
	border-top: 4px solid #b6cc5e;
}
.content#tohoku {
	border-top: 4px solid #ac6242;
}
.content#kanto {
	border-top: 4px solid #e479a3;
}
.content#chubuHokuriku {
	border-top: 4px solid #349363;
}
.content#kinki {
	border-top: 4px solid #8d73b1;
}
.content#chugokuShikoku {
	border-top: 4px solid #f4a253;
}
.content#kyushuOkinawa {
	border-top: 4px solid #3181c3;
}

.content table.tb_map{
	border-collapse:collapse;
	width: 90%;
	margin:0 5% 0;
	color:#404040;
	font-size: 0.9em;
	line-height:1.2em;
}
.content table.tb_map:nth-child(1){
	margin-top:3.5%;
}

#WARAPPER #CONTENTS div.content h2 {
	text-align: center;
	padding:3.5% 0 0 0;
	font-size: 1.2em;
	font-weight:600;
	border: none;
 }
 #WARAPPER #CONTENTS h2.ryokanName {
	font-family : Arial;
	color:#ee7700;
	padding:3.5% 0 0 55px;
	font-size: 2.2em;
	font-weight:500;
	border: none;
	position:relative;
	border-bottom:2px dotted #f99832;
	padding-bottom:10px;
	margin-bottom:20px;
	filter:dropshadow(color=#fff,offX= 0,offY=-1)
	dropshadow(color=#fff,offX= 1,offY= 0)
	dropshadow(color=#fff,offX= 0,offY= 1)
	dropshadow(color=#fff,offX=-1,offY= 0);
	 
	text-shadow: 2px 2px 0px #fff, -2px 2px 0px #fff,
				 2px -2px 0px #fff,  -2px -2px 0px #fff,
				  3px 3px 4px #999;	
 }
  #WARAPPER #CONTENTS h2.ryokanName::before{
	  position:absolute;
	  content:url(../../images/detail/h2icon.png);
	  left:0;

  }
	
.tb_map th:nth-child(1){
	width: 13%;
}
.tb_map th:nth-child(2){
	width: 25%;
}
.tb_map th:nth-child(4) {
	width: 50%;
}
.tb_map th,
.tb_map td{
	border-collapse:collapse;
	border: 1px #bfbfbf solid;
	padding:5px ;
	vertical-align:middle;
}

.tb_map th,
.tb_map th a{
	text-align:center;
	font-weight:bolder;
}
.maptop th{
	text-align:left;
}
.maptop th.bgcol_gray{
	background:#e6e6e6;
	text-align:center;
	color:#404040;
}
ul.bdcol_grl li{
	border-color: #b6cc5e ; 
}
ul.bdcol_br li{
	border-color: #ac6242 ; 
}
ul.bdcol_pink li{
	border-color: #e479a3;
}
ul.bdcol_gr li{
	border-color:#349363 ;
}
ul.bdcol_or li{
	border-color: #f4a253;
}
ul.bdcol_bl li{
	border-color: #3181c3; 
}
ul.bdcol_pu li{
	border-color: #8d73b1;
}
	

/*.tb_map th.bgcol_grl, .tb_map th.bgcol_grl01, .tb_map th.bgcol_grl02, .tb_map th.bgcol_grl03 {
	background:#66b821;
}*/
.bgcol_grl {
	background:#b6cc5e ;
	color:#fff;
}
.bgcol_grl2{
	background:#f0f9e3;
	font-weight:bolder;
}
.bgcol_br{
	background:#ac6242 ;
	color:#fff;
}
.bgcol_br2{
	background:#f1e9dc;
	font-weight:bolder;
}
.bgcol_pink{
	background:#e479a3;
	color:#fff;
}
.bgcol_pink2{
	background:#feecec;
	font-weight:bolder;
}
.bgcol_or {
	background:#f4a253;
	color:#fff;
}
.bgcol_or2{
	background:#feeede;
	font-weight:bolder;
}
.bgcol_bl{
	background:#3181c3;
	color:#fff;
}
.bgcol_bl2{
	background:#e6e9f3;
	font-weight:bolder;
}
.bgcol_gr {
	background:#349363 ;
	color:#fff;
}
.bgcol_gr2{
	background:#e2f1dd;
	font-weight:bolder;
}
.bgcol_pu {
	background: #8d73b1;
	color:#fff;
}
.bgcol_pu2{
	background:#f1e2f0;
	font-weight:bolder;
}
.tb_map td.bgcol_b{
	background:#e2f1dd;
	font-weight:bolder;
}
@media screen and (max-width: 840px) {
  	.tab li.twol {
		  font-size: 0.8em;
	  }	
}
@media screen and (max-width: 640px) {
	div.tabContent {
		width:100%;
		margin: auto 0;
		box-sizing:border-box;}
	.tab{overflow:hidden; }
	.tab ul{
		width:100%;		
	}
	.tab li{
		width:18%;
		float:left;
		height: 33px;
		line-height: 2em;
		margin-right:1px;
		padding: 2% 3%; 
		vertical-align:middle;
		}
	.tab li.all {
		width:17%;
		color: #ed7600;
		height: 30px;

	}		
	.tab li.select{
		opacity:0.65;}
	.content{
		background:#fff; 
		margin: 0 0 40px;
	}
    	.tab li{	
		padding: 0; 
		font-size: 0.7em;
		height: auto;
        min-height: 50px;
		line-height: 1.3em;
        width: 48%;  
        position: relative;
	}
    .tab li a {
        font-size: 14px;
        line-height: 1.3em;
        position: absolute;
        top: 50%;
        left:0;
        right: 0;
        transform: translateY(-50%)
    }
	.tab li.all {
		height: auto;
        width: 48%;
	}
	.tab li.twol {
		font-size: 0.5em;
		line-height: 1.2em; 
	}
}
@media screen and (max-width: 480px) {

	table.tb_map {
		width: 95%;
		margin: auto 5%;
	}
	table.tb_map tr {
		width: 100%;
		display:block;	
	}
	.tb_map td{
		display: block;
		width: auto;
	}	
	.rsp{
		visibility:hidden;
	}
	.rsp2{
	    display:inline-block;
	}
	.pcr {
		display:none;
	}
	#WARAPPER #CONTENTS div.content h2 {
		padding: 15% 0 0 0;
		font-size: 1.2em;
	 }
	.tb_map th.pref{
		display:block;
		width: 95%;
		margin: 10px 0 0 0;	
	}	
	.tb_map th.pref2 {
		width: 94%;
		border: none;
	}
	.tb_map th.city{
		width:94%;
		margin:0;
		border: none;
		border-top: 1px #bfbfbf solid;
	}
	
	.tb_map td:nth-child(1) {
		width: 33%;
		padding:0;
		margin: 0 0 0 0;
		clear:both;
		float: left;
		border: none;
	}
	.tb_map td:nth-child(2),
	.tb_map td:nth-child(3) {
		width: 55%;
		padding:5px;
		margin: 0 0 0 40%;
 	}
	.tb_map td:nth-child(2) {
		margin:10px 0 0 40%;
 	}
	.tb_map td.bgcol_br3{
		background:#f1e9dc;
		font-weight:bolder;
		padding:7px;
	}	
	.tb_map td.bgcol_grl3{
		background:#f0f9e3;
		font-weight:bolder;
		padding:7px;
	}
	.tb_map td.bgcol_pink3{
		background:#feecec;
		font-weight:bolder;
		padding:7px;
	}	
	.tb_map td.bgcol_or3{
		background:#feeede;
		font-weight:bolder;
		padding:7px;
	}	
	.tb_map td.bgcol_bl3{
		background:#e6e9f3;
		font-weight:bolder;
		padding:7px;
	}	
	.tb_map td.bgcol_gr3{
		background:#e2f1dd;
		font-weight:bolder;
		padding:7px;
	}
	.tb_map td.bgcol_pu3{
		background:#f1e2f0;
		font-weight:bolder;
		padding:7px;
	}	
}
	
/*施設詳細ページ
----------------------------------------------------------------*/
div.slider {
    max-width:620px;
	/*width:100%;*/
    display:block;
    margin:20px auto;
}
 
ul.bxslider01 li {/*メインスライダー*/
    display:block;
    width:100%;

		border: 6px solid #fff;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		border-radius:5px;
	} 
ul.bxslider01 li img{
    display:block;
    width:100%;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	
}

ul.bxslider02 li {/*サムネイル*/
    padding: 10px 0 10px;
}
ul.bxslider02 li a {/*サムネイル*/
    display:block;
    width:110px;
    height:65px;
	/*height:57px;*/
}
 
ul.bxslider02 li a img{/*サムネイルの画像*/
    display:block;
    width:100%;
    height:auto;
	max-width: 100%;
}
 
div.controlWrap {
    width:100%;
    display:block;
    position:relative;
    margin:0 auto;
}
 
div.controlWrap p#PrevIcon a{/*矢印画像（前へ）*/
    display:block;
    width:17px;
    height:24px;
    position:absolute;
    background:url(../img/btn_prev.png) left center no-repeat;
    color:#fff;
    top:20px;
    left:30px;
    text-indent:-9999px;
	padding: 7px 0 10px;
}
 
div.controlWrap p#NextIcon a{/*矢印画像（次へ）*/
    display:block;
    width:17px;
    height:24px;
    position:absolute;
    background: url(../img/btn_next.png) left center no-repeat;
    color:#fff;
    top:20px;
    right:30px;
    text-indent:-9999px;
	padding: 7px 0 10px;
}

div.pageHalf{
	width:350px;
}

div.pageHalf dl {
    overflow: hidden;
    zoom: 1;
	font-size:12px;
	line-height: 1.4em;
}

div.pageHalf dl dt {
    width: 80px;
    float: left;
    clear: both;
    font-weight: bold;
	text-align:center;
	color:#ffffff;
	background:#f0912d;
	margin-bottom:10px;
	padding:8px 0;
}

div.pageHalf dl dd {
    padding: 8px 0 8px 100px;
	margin-bottom:10px;
}

.notesArea{
	background:#f2f1ef;
	padding:20px 0;
}

.notesArea h4{
	clear:both;
	border-bottom:2px solid #746f66;
	font-size:13px;
	font-weight:bold;
	margin-bottom:10px;
	padding:0 0 7px 4px;
}

.notesArea div.w322L{
	width:322px;
	float:left;
	margin:0 0 0 20px;
}

.notesArea div.w322R{
	width:322px;
	float:right;
	margin:0 20px 0 0;
}

.notesArea ul li{
	font-size:12px;
	list-style-type:disc;
	margin-left:35px;
	padding-bottom:18px;
}

.notesArea ul.listType li{
	float:left;
	width:120px;
	margin-left:35px;
}
	
.reserveBtn{
	text-align:center;
	margin:10px auto !important;
	width:100%;
}

.reserveBtn a:link,
.reserveBtn a:visited{
	padding:10px 20px;
	color:#F60;
	font-weight:bold;
	font-size:17px;
	background:#FC6;
	border:2px solid #f0912d;
}

.reserveBtn a:hover{
	background:none;
	text-decoration:none;
}

/*HOW TO BOOK
----------------------------------------------------------------*/
#WARAPPER #CONTENTS ol {
	margin:20px;
    padding-left: 15px;
}

#WARAPPER #CONTENTS ol li{
    padding:0 0 10px 0;
	list-style-type: decimal;
    color: #666666;
    font-size: 0.9em;
}

#WARAPPER #CONTENTS ol li a{
	text-decoration:underline;
}

#WARAPPER #CONTENTS section.pageBox ol li{
	margin-left:30px;
	padding:0 0 10px 0;
}
#WARAPPER #CONTENTS .confirmation table ol li {
    font-size: 14px;
}
/************************* SEARCH ACCOMMODATION ************************/
table.search_AC{
	margin:; clear:both;
	width:50%;
	margin: 15px 25% 55px;
}
table.search_AC thead th, table.search_AC tbody td, table.search_AC tbody th, table.search_AC tfoot th
{ border:#bfbfbf 1px solid; padding:7px 10px; border-collapse:collapse;
	vertical-align:middle;
	}
	
table.search_AC thead th{
	background:#f6efdf;
	color:#592906; font-weight:bold; 
	text-align: center;
}
table.search_AC tbody td, table.search_AC tbody th{
	text-align:left;
}
table.search_AC tbody th {  font-weight:bold;}
table.search_AC ul.with {overflow:hidden;}
table.search_AC ul.with li { width:50%; float:left; padding: 3px 0 ; }
table.search_AC ul.with li span { padding: 0 0 0 3px; font-size: 15px;}


table.search_AC tfoot th {  text-align:center; border:none; padding:7px 10px;}


/************************ 一週間カレンダー **************************************/
table#style00 { float:right;margin:0 0 20px;}
table.calender{clear:both;text-align:left; margin: 0; width:100%}

table.calender td, table.calender th {vertical-align: middle;}

#page01 {width:100%;}
#page02 {width:620px;}

.calbox{padding:0px 3px;height:20px;line-height:22px;width:100px;float:left; margin:2px 10px 0 3px;}
#boxGo { position:relative;  bottom:-11px;}

thead.controls tr th{}
.date_nav .date_from label{display:block;float:left;line-height:22px;padding:5px 5px 5px 10px;}
.date_from_nav{text-align:center;}

th.top_left_corner{  }
th.top_right_corner{  }

th.date{padding:0;margin:0;width:40px;height:60px;}
th.date span{display:block;text-align:center;}
th.date span.day_name{font-size:11px;font-weight:bold;white-space:nowrap;}
th.date span.day{font-size:15px;margin:-4px 0;}
table#style00 thead.controls { }
table#style00 thead.controls tr th.date_navigation{padding:0px; background:none; border:none;}
table#style00 thead.controls tr th.date_nav{background:none;border:none; color:#333;}
table#style00 thead.controls tr th.date_nav .date_from{display:inline-block;}

.date_nav ul.back a.day{background-position:-50px 0px;}
.date_nav ul.back a.day:active{background-position:-50px -20px;}
.date_nav ul.back a.week{background-position:0px 0px;}
.date_nav ul.back a.week:active{background-position:0px -20px;}
.date_nav ul.forward a.day{background-position:-100px 0px;}
.date_nav ul.forward a.day:active{background-position:-100px -20px;}
.date_nav ul.forward a.week{background-position:-150px 0px;}
.date_nav ul.forward a.week:active{background-position:-150px -20px;}

.date_nav ul{padding:0;margin:0;vertical-align:middle;}
.date_nav ul li{display:block;float:left;}
.date_nav ul a{width:50px;display:block;background:url(../img/buttons.png) no-repeat;width:50px;height:20px;overflow:hidden;text-indent:-9999px;overflow:hidden;}
.date_nav ul.forward{display:inline;float:right;}
.date_nav label,.date_nav span{color:#333; font-weight:bold;}
.date_nav span{width:250px;}
.date_nav .date_from{height:17px;line-height:22px; padding-bottom:5px;}
th.date span.month{font-size:11px;font-weight:normal;}

table.calender thead th{height:40px;background:#F6EFDF;padding:0 5px; border: solid 1px #bfbfbf;color:#592906;}
table.calender th.note{font-weight:normal;font-size:11px; background:#eeeeee; color:#333; }
table.calender td{background:#F6EFDF;padding:3px 5px;border: solid 1px #bfbfbf;}

#WARAPPER #CONTENTS table.calender#page01 td.room_name p{/*white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;-ms-text-overflow:ellipsis;text-overflow:ellipsis;*/width:212px;margin:0;color:#592906; font-weight:bold;}

table.calender#page02 td.room_name p{width:242px;margin:0;color:#592906; font-weight:bold;
}
table.calender td.room_name {}
table.calender td.book_now{width:40px; }
table.calender th.weekend{background:#ede0c2;}
table.calender td.rate{width:40px;padding:2px;background:#FFF;text-align:center;}

table.calender#page01 td.rate:hover{background:#d2e1e6;}
table.calender td.rate a{text-decoration:none;display:inline-block;}
table.calender td.rate span,table.calender td.rate a{width:100%;line-height:39px;}
table.calender td.rate span.wide,table.calender td.rate a.wide{font-size:10px;}

table.calender td.weekend{background:#eeeeee; }
table.calender tr.grouping td{background:#fff;height:1px;font-weight:bold;font-size:1.1em;}
table.calender tr.grouping td.blank{padding:0px;}

a.details{font-size:11px;padding-left:12px;background:url(../img/acc/details2.png) left center no-repeat;}
a.photos{font-size:11px; margin-left:25px; padding-left:18px;background:url(../img/photo.png) left center no-repeat;}

/**************  検索結果ページテーブル ****************/
.content table.tb_mapCal{
	border-collapse:collapse;
	width: 90%;
	margin:0 5% 0;
	color:#404040;
	font-size: 0.9em;
	line-height:1.2em;
}
table.tb_mapCal td:nth-child(1){width:15%}
table.tb_mapCal td:nth-child(2){width:30%; font-weight: 600;}
table.tb_mapCal td.rate{width:40px;padding:2px;background:#FFF;text-align:center;}
table.tb_mapCal td.rate a{text-decoration:none;display:inline-block;}
table.tb_mapCal td.rate span,table.calender td.rate a{width:100%;line-height:39px;}
table.tb_mapCal td.rate span.wide,table.tb_mapCal td.rate a.wide{font-size:10px;}
table.tb_mapCal th.date{padding:15px 0 5px;margin:0;width:40px; height:100%;background:#eee;}
.tb_mapCal th, .tb_mapCal td{
	border-collapse:collapse;
	border: 1px #bfbfbf solid;
	padding:5px ;
	vertical-align:middle;
}
.tb_mapCal th, .tb_mapCal th a{
	text-align:center;
	font-weight:bolder;
}

/************** 予約ページ ****************/
h2.room {font-size: 23px; font-weight:700;}
h2.room span{font-size: 18px; font-weight:700; padding: 0 0 0 10px;}

table.step0 { width:100%;margin: 10px 0; /*background:#FFF;*/}
table.step0 th, table.step0 td { border: none; padding:5px;}
table.step0 a.photos {font-size: 15px;}
.checkin{padding:0; border:none;}
.checkin ol{margin:0;order:0;overflow:hidden;zoom:1; padding:10px 0;}
.checkin ol li{list-style-image:none;list-style-type:none;margin-right:15px;0;white-space:nowrap;display:inline;float:left;padding-left:24px;padding-right:10px; }
.checkin ol li label{font-size: 14px; font-weight:bold; padding-right:5px;display:block;float:left; color:#ed7600;  }

/*step2*/
.bg01,.bg02  { background:#ede0c2;; color:#FFF; font-weight:bold; }
.bg02 { background:#592906;}
table#style02 {width: 100%; margin: auto 0;}
table#style02 th.date_nav{ font-size: 14px;}
table.step2, .step2a, .step2b { width:95%; margin:15px 2.5%; clear:both;}
table.step2 thead th, .step2a thead { }
table.step2 th, table.step2 td { border: solid 1px #bfbfbf; padding:5px; vertical-align:middle;}
table.step2a th, table.step2a td { border: solid 1px #bfbfbf; padding:5px; vertical-align:middle;}
table.step2b th, table.step2b td { border: solid 1px #bfbfbf; padding:5px; vertical-align:middle;}
table.step2 tbody td, .step2a tbody td, .step2b tbody td { background:#FFF;}
.step2b tbody td { text-align: center;}
.step2b tbody tr:last-child td {height: 36px;}
table.step2 tfoot, .step2a tfoot { border: solid 1px #bfbfbf; background:#fff;}
table.step2 tfoot td, .step2a tfoot td{ border:none;}
table.step2a td.rate2 {width: 8%;}
#parts_price table.step2a td {text-align: right;}
#parts_price table.step2a td:last-child { width: 30%}
.rate2 { text-align:center;  }
.rate3 { } .rate4 {}
.rate3 span { font-weight:bold;}

.style03 { font-weight:bold; font-size:16px;}
.roomcol{padding-left:10px}
.roomcol{font-weight:normal;font-size:11px}
.roomcol ol, .roomcol ul{margin:0;padding:0;border:0;overflow:hidden;*zoom:1}
.roomcol ol li, .roomcol ul li{list-style-image:none;list-style-type:none;margin-left:0px;display:inline;float:left;padding-left:4px;padding-right:4px;word-wrap: break-word; white-space: normal;}
.roomcol ul li span.title { font-weight:bold; color: #ff5900; font-size:16px;}

.planpic { float:left; padding-right:10px; padding-bottom:10px;}
.box01 {
	width:430px;
	border: solid 1px #bfbfbf;
	padding:5px;
	float:left;
	margin-bottom: 10px;
	background:#FFF;
	 }
.box03 {  padding:5px; margin: 10px 0;}
.box03 .container { width:100%; margin:auto 0;}
.box03 h3 span { font-size: 12px; color:#4d4d4d; padding-left:10px;	}

.button, .button2 { color:#FFF; font-weight:bold; padding:3px 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; border:none; cursor: pointer; background:#592906;}
.button3 { color:#FFF; font-weight:bold; padding:3px 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; border:none; cursor: pointer; background:#ed5900; margin-top:45px;}
.button2 { background:#b367b2;}
.button a, .button2 a { color:#FFF; }
input:hover, .button2:hover { opacity:0.8;}
.button2 a:hover { text-decoration:none;}

.box03 input[type="text"], .box03 select,.box03 textarea {width:100%; padding: 5px}
.box03 li#boxGo input {width:auto; margin: -5px 0 10px 0;}
.box03 input.button,.box03 input.button3 {width:20%; padding:7px 0;}
.box03 input.check  {width:auto;}
.list_photo {padding-top:10px;}

table.step3 { margin: 10px 0; width:95%; margin:auto 2.5%; clear:both;}
table.step3 th, table.step3 td {  padding:10px 10px; margin: 0;}
table.step3 th { font-weight:bold; width:30%; font-size:14px;}
table.step3 td { font-weight:bold; width:70%; font-size:14px;}
.adjust01 { position:relative; top:3px; right:-3px;}
.adjust02 { position:relative; top:-2px; right:-3px;}
.fwb { font-weight:bold;}
.notes { color: #f0912d;    padding: 0 0 0 3px;    font-size: 12px;}
form .notes { color: #cc3406; font-size: 14px; font-weight: 600}
.notes02 { font-size: 12px; font-weight:normal;color:#666}

ol li#boxGo {margin: 12px 0 0 10px}
#roomDetail h2 {margin: 0; padding: 30px 0;}

#WARAPPER #CONTENTS #step2_conf ol{  margin: 10px 0 5px 10px; }
#WARAPPER #CONTENTS #step2_conf td > ol li{ padding: 0; display:block; font-size: 16px; float: none; text-align:left;}
#WARAPPER #CONTENTS #step2_conf td > ol li::after { content:" / "; padding-right: 7px;}
#WARAPPER #CONTENTS #step2_conf td > ol li:last-child::after { content:""; padding-right: 0;}

div.logo_list ul{
	margin-bottom:30px;
}
div.logo_list ul li{
	display:inline;
	margin:0 10px 0 20px;
	padding-bottom:20px;
}

@media screen and (max-width:640px) {
	#page01 {width: 100%; margin: auto 0; }
	table#style00 { float:none; width:95%; margin:auto 2.5% 20px;}
	div#parts_cal{width: 100%;　margin: 25px 0 55px;}
	.roomcol{text-align:center}
	.date_nav .date_from input{
		display:block;
		float:left;
		line-height:18px;
		padding:0 5px;
		margin: 0 0 0 5px;
		}
	
	table.calender { width: 100%;  }
	table.calender tr{ width: 100%;}
	table.calender thead.controls tr th{ 	
		}
	table.calender th.note{
		font-weight:normal;font-size:13px; line-height:1.4em; background:#eeeeee; color:#333;padding: 5px 0 0 10px; }
	table.calender th.note { clear: both; display:block; margin: auto 0; }	
	table.calender th, table.calender td { min-height: 55px; }	
    table#style00 th.date_from_nav {
        width: 50%;
        padding: 0;        
    }
    table#style00 thead.controls tr th.date_nav .date_from {
        display: flex;
    }    
    .date_nav .date_from label {
        margin: -10px 0 0 10px;
        padding: 3px 5px 2px 5px;
        font-size: 15px;
    }
    .date_nav ul.forward {
        width: 100%;
    }
    .date_nav ul li {
        width: auto;
    }
	table.calender th.date {
		width: 14.25%;
		float: left;
		padding: 0.5% 0.2% 0.3%;
		border:none;
	}
	
	/*table.calender th.date:last-child {border-width: 0px 1px 0px 1px;	}*/
	table.calender  tr.grouping td { display:none; }		
	table.calender div.roomWrap{ margin: auto 0; overflow:hidden }
	table.calender td.room_name {
		display:block;
		margin: auto 0;
		font-size: 85%;
	}
	table.calender td.rate {
		width: 14.25%;
		float: left;
		border:none;
		padding: 0.2%;
		margin: 0 0 5px;		
		font-size: 12px;
		white-space: nowrap;
    }
    table.step0 th, table.step0 td {
        width: 100%;
        display: block;
        text-align: center;
    }
    #WARAPPER #CONTENTS form.checkin ol {
        margin: 0px;
        padding-left: 0px;
    }
    #WARAPPER #CONTENTS form.checkin ol li {
        width: 100%;
    }
    
	#WARAPPER #CONTENTS table.calender#page01 td.room_name p{ width:212px;margin:4px 0 0;color:#592906; font-weight:bold; }

	a.photos{ font-size:12.5px;margin-bottom:5px;background:url(../img/photo.png) left center no-repeat;}

    table.step2 {width: 100%;margin: 20px 0%;}
	table.step2 th, table.step2 td { border-top:none; border: solid 0px #bfbfbf;}
	table.step2 th:first-child, table.step2 td:first-child { border-top: solid 1px #bfbfbf;}

	table.step2 thead {display:block; float:left; width: 35%}
    
    .confirmation table.step2.wide thead ,
    .confirmation #parts_option table.step2 thead,
    .confirmation #parts_option table.step2 tbody,
    .confirmation #parts_option table.step2 tr {display:block; float:none; width: 100%}
    .confirmation table.step2.wide tbody {width: 100%}
    .confirmation table.step2.wide th, .confirmation table.step2.wide td {display: block; text-align: center; margin: 0;}
    .confirmation #parts_option table.step2 {
        display: block;
    }
    .confirmation #parts_option table.step2 td {
        min-height: 40px;
        padding: 5px 20px 0;
        text-align: center;
    }
    .confirmation #parts_option table.step2 th {
        margin: 0;
    } 

    #WARAPPER #CONTENTS .confirmation table ol {
        margin: 10px;
    }
    #WARAPPER #CONTENTS #step4 h4 {
        text-align: center;
    }
    .confirmation table.step2 {display:flex;width: 100%}
    
	table.step2 th { width:13%; display: block; width: auto; min-height: 52px;}
	table.step2 th, .step2a th {font-size: 14px;}
	table.step2 th:first-child { text-align: center;}
	
	table.step2 tbody{ display: block; width: 65%; overflow-x: auto; float:left }
	table.step2 tbody tr{ display:block;}
	table.step2 td{  border-left:none; display: block; min-height: 52px;padding: 10px 20px 0;}
	#step2_conf table.step2  th:first-child { height: 130px}
	#step2_conf table.step2  td:first-child { height: 130px}
	#parts_room2 table.step2  th:first-child { height: 50px}
	#parts_room2 table.step2  td:first-child { height: 50px}
	table.step2a , table.step2b{width: 100%;margin: 20px 0%;}
	table.step2a thead tr th{display: block; width: 96%; }
	table.step2a tbody tr{ display: block;  width: 100%;}
	table.step2a td::before {
	  content: attr(data-label);
	  float: left;
	  font-weight: bold;
	}
	table.step2a td {display: block; width:96%; min-height: 20px; border-width:0px 1px 1px 1px;}
	table.step2a td:nth-child(4n) {border-bottom: solid 2px #bfbfbf;}
	table.step2a td.rate2 {width: 96%; min-height: 44px;}
	div#roomDetail table.step2a tr:first-child td:first-child {border-width:1px 1px 1px 1px;}
	#parts_price table {width: 100%; margin: 0 0 45px;}
	#parts_price table.step2a td {text-align:center;}
	#parts_price table.step2a td:last-child { width: 96%}
  	table.step3 th { display: block; width: 100%; padding:5px 10px 0; margin: 5px 0 0;}
	table.step3 td { display: block; width:100%; padding:2px 10px 0; margin: 0 0 10px;}
    .confirmation table.step3 th, .confirmation table.step3 td {
        padding: 5px;
        text-align: center;
    }
    .confirmation table.step3 th {
        background: rgba(237,118,0, 0.8);
        color: #fff;
    }
    .confirmation table.step3 th .notes{
        color: #fff;
    }
	.box03 {padding: 0px ;}
	.box03 input.button, .box03 input.button3 {width:40%; padding:7px 0;}
	.box03 h4 {margin: 15px 0 0;}
	.box04 input[type="text"], .box04 select,.box04 textarea {width:100%;}
	.box04 input.button, .box04 input.button3 {width:40%; padding:7px 0;}
	.box04 input.check  {width:auto;}
    #fm_step3 .button {
        margin: 30px auto 40px;
    }

	table.tb_mapCal { width: 100%; border-bottom: 1px #bfbfbf solid; }
	table.tb_mapCal tr{ width: 100%;}
	table.tb_mapCal th.date {
		width: 13.83%;
		float: left;
		border-width: 0;
		padding: 20px 0.2% 10px;
	}
	table.tb_mapCal th.date:last-child {
		border-right:1px solid #eee;
		}
	.tb_mapCal th.city{
		width:100%;
		margin:0;
		border: none;
		padding: 10px 0;
		line-height:1.5em;
	}
	table.tb_mapCal div.roomWrap{ margin: auto 0; }
	table.tb_mapCal td.room_name {
		display:block;
		margin: auto 0;
		font-size: 85%;
	}
	table.tb_mapCal td.rate {
		width: 13.87%;
		float: left;
		border:none;
		padding: 0.2%;
		margin: 0 0 10px;		
		font-size: 12px;
		white-space: nowrap;
	}
   table.search_AC{
		width:80%;
		margin: 15px 10% 40px;
	}
	table.search_AC ul.with li { width:100%; float:none; padding: 3px 0;}
	div.logo_list ul li{
		display:inherit;
	}
}
@media screen and (max-width:540px) {
	.date_nav ul.forward{display:block;float:right; margin: 0 0 0 10px;}
	th.top_right_corner{  float:right; margin-right: 10px;}
	.date_nav .date_from label{
		display:block;
		float:left;
		line-height:22px;
		padding: 0;
		margin: 0px 0 0 10px;
		}
	table.step2 th:first-child.ocu,table.step2 td:first-child.ocu { height: 350px}
	div.logo_list ul li{
		display:inherit;
	}
}


/*INFO
----------------------------------------------------------------*/

dl.adressList {
    overflow: hidden;
    zoom: 1;
	font-size:12px;
	margin:20px;
}

.adressList dt {
    width: 280px;
    float: left;
    clear: both;
	font-size:15px;
    font-weight: bold;
	text-align:left;
	color:#f0912d;
	margin-bottom:10px;
	padding:8px 0;
}

.adressList dd {
    padding: 12px 0 8px 280px;
	margin-bottom:10px;
	border-bottom:1px solid #CCC;
}

dl.info {
    overflow: hidden;
    zoom: 1;
	font-size:14px;
	line-height:1.5em;
	margin:20px;
}

.info dt {
    width: 280px;
    float: left;
    clear: both;
	font-size:14px;
    font-weight: bold;
	text-align:left;
	color:#f0912d;
	margin-bottom:10px;
	padding:8px 0;
}
.info dd {
    padding: 8px 0 8px 280px;
	margin-bottom:10px;
	border-bottom:1px solid #CCC;

}

/*TIPS
----------------------------------------------------------------*/
div.tipsBox{
	float:left;
	width:580px;
}

div.tipsBox ol{
	margin:20px 40px !important;
	color:#333;
}


/*FROM
----------------------------------------------------------------*/

section table { width: 100%; }
section th, section td  { padding: 10px; border: none; margin:0 0 5px 0; }
section th  { background: none; color:#f0912d; font-weight:bold; }
 
/*----------------------------------------------------
  .demo01
----------------------------------------------------*/
table.formList {width:90%; margin:auto 5%}
.formList th  { width: 30%; text-align: left; }

.formList table th{
	font-weight:normal;
}

@media screen and (max-width:1024px) {
    dl.adressList {
		width: 100%;
		margin:20px 0;
	}
	div.slider {
        width:100%;
        height:100%;
        margin:0 0 20px;
	}
	ul.bxslider01 li {/*メインスライダー*/
		width:100%;	
		max-width:672px;
		border: none;
	}
	
	ul.bxslider01 li img{
		width:100%;
		height:auto;
	}	
	div.controlWrap {
		width:90%;
		display:block;
		position:relative;
		margin:auto 5%;
	}	
	ul.bxslider02 li a {/*サムネイル*/
		width:110%;
		height:100%;
	}	 
	ul.bxslider02 li a img{/*サムネイルの画像*/
		width:100%;
		height:auto;
	}
	div.controlWrap p#PrevIcon a{/*矢印画像（前へ）*/
		width:17px;
		height:24px;
		top:15px;
		left:-30px;
	}	 
	div.controlWrap p#NextIcon a{/*矢印画像（次へ）*/	
		width:17px;
		height:24px;
		top:15px;
		right:-30px;
	}
    div.pageHalf{
		width:100%;
		margin: 30px 0;
	}
	.notesArea {
		width: 100%;
		margin: 0 0 30px 0;
	}	
	.notesArea div.w322L{
		width:90%;
		float:none;
		margin:auto 5%;
	}	
	.notesArea div.w322R{
		width:90%;
		float:none;
		margin:auto 5%;
	}
	.notesArea ul {
		margin: 0 0 0 30px;
	}	
	div.recRyokan{
	  float:left;
	  width:32%;
	  height:370px;
	  margin:0 1.5% 5% 0;
	}
	div.recRyokan:nth-child(3n){
	  margin:0 0 5% 0;
	}
	div.recRyokan img{
	  width:100%;
	}
	div.recRyokan dl dt{
	  width:100%;
	  margin: auto 0;
	}
	div.recRyokan dl dd.prefTxt{
		padding:0 0 0 15px;
		margin: 25px 0 5px 0;
		position:absolute;
		right: 0;
		top:0;
	}
	div.recRyokan dl dd.readTxt{
		border-top:1px solid #cccccc;
		color:#666666;
		margin: 20px 0 0;
 		padding:5px 5px;
		line-height:1.3em;
	}
  	.topL{
		width:48%;
		float:left;
		margin: 0;
	}
  	.topR{
		width:45%;
		float:right;
		margin: 5px 0 30px 0;
	}
    
	.fb-page{
		width: 100% !important;
		margin: auto 0;
	}
	.bnrArea{
		width: 90%;
		margin: 0 5% 40px 5%;
	}
	.bnrArea ul li{
		float:left;
		width:30%;
		margin:0 1.5% 0 0;
		padding-bottom:15px;
	}
	.bnrArea ul li:nth-child(4n){
		margin:0 1.5% 0 0;
	}
	.bnrArea ul li:nth-child(3n){
		margin:0 0 0 0;
	}
    div.tipsBox{
		float: none;
		width: 100%;
		margin: 0;
	}
    div.tipsBox + .floatR {
        float: none;
        padding-top: 10px;
        text-align: center;
    }
	.tipsBoxL{
		float:left;
		width:45%;
	}
	.tipsBoxR{
		float:left;
		width:40%;
	}
	 #bxslider{
		width:100% ;
		height:100%;
		/* box-shadow */
		box-shadow:4px 3px 8px -1px #e2e3e2;
		-moz-box-shadow:4px 3px 8px -1px #e2e3e2;
		-webkit-box-shadow:4px 3px 8px -1px #e2e3e2;
		float:left;
	 }
	 #bxslider div {		
		border: 6px solid #fff;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		border-radius:10px;
	}	
	#bxslider div img {
		-moz-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
	
	}
	.topMain{
		height:auto;
		padding-bottom:4%;
		margin-bottom:35px;
    }
	.topMain div.topInner{
		width: 90%;	
		margin: auto 5%;		
	}
	.topMain .bx-wrapper {
		width:70%;
		max-width: 750px;	
		position:relative;
		float:left;
	}
	.topMain .bx-wrapper img {
		width:100%;
		height:auto;
		display: block;
	}	
	.qSearch{
		width:25%;
		float:left;
		height: auto;
		position:static;
	}	
	.qSearch h2{
		font-size:1em;
	}	
	.qSearch dl{
		margin:0.7em;
	}
	.qSearch dl dt{
		color:#ffffff;
		font-size:0.7em;
		font-weight:bold;
		padding:0 0 0.7em 0;
	}
	.qSearch dl dd{
		padding:0 0 20px 0;
	}	
	.qSearch dl dd input{
		width: 90%;
		padding:3px;
	}		
	.qSearch dl dt{
		color:#ffffff;
		font-size:15px;
		font-weight:bold;
		padding:0 0 7px 0;
	}	
   .qSearch dl dd select{
		width:90%;
		padding:3px;
	}	
	input.quickBtn{
		font-size:0.8em;
		width:90%;
		padding:2px;
		margin:0 5% 2.6em 5%;
	}
}
@media screen and (max-width: 980px) {
	.topMain .bx-wrapper {
		width:100%;
		max-width: 750px;	
		position:relative;
		float:none;	
	}
	.qSearch{
		width:100%;
		margin: 3em 0 0.3em;
		float:none;
		height: auto;		
	}	
	.qSearch h2{
		font-size:1em;
		padding: 0.3em;
 	}	
	.qSearch dl{
		margin:0.7em;
	}
	.qSearch dl dt{
		font-size:0.8em;
		padding:0.2em 0 0.2em 0;
		float:left;
		width: 15%;
	}
	.qSearch dl dd{
		padding:0 0 0.3em 0;
		float:left;
		width: 35%;
	}
	.qSearch dl dt.ddClear{
		clear: both;
	}	
	.qSearch dl dd input{
		width: 90%;
		padding:3px;		
	}
   .qSearch dl dd select{
		width:90%;
		padding:3px;
	}	
	input.quickBtn{
		font-size:0.8em;
		width:40%;
		padding:3px;
		margin:0.2em 0 1.4em 5.5%;
		float:left;		
	}
}

@media screen and (max-width: 640px) {
    #WARAPPER #CONTENTS .color-back {
        width: 100%;
        margin:20px auto;
        padding: 10px 10px 20px;
    }
    #WARAPPER #CONTENTS section.pageBox ol li {
        margin-left: 15px;
        padding: 0 0 10px 0;
        font-size: 0.9em;
    }
    section.pageBox ul li {
        font-size: 0.9em;
    }
    div.tipsBox ol {
        margin: 20px 30px !important;
        color: #333;
    }
    .notesArea ul {
        margin: 0 0 0 0px;
    }
    .notesArea ul.listType li {
        float: none;
        width: 100%;
        margin-left: 30px;
    }
    .notesArea ul li {
        font-size: 14px;
        padding-bottom: 10px;
        margin-left: 30px;
    }
    .bnr_rps{
		display:inherit;
	}
	.bnr_pc{
		display:none;
	}
    div.recRyokan{
	  float:left;
	  width:48%;
	  height:370px;
	  margin:0 1.4% 5% 0;
	}
	div.recRyokan:nth-child(3n+1){
	  margin:0 0 5% 0;
	}
	div.recRyokan:nth-child(2n+1){
	  margin:0 2.5% 5% 0;	  
	}
	.topL{
	  width:100%;
	  float:none;
	}
    .topR {
	  width: 90%;
	  float: none;
	  margin: 13% auto 35px;
	}
    .youtube {
      position: relative;
      width: 100%;
      padding-top: 56.25%;
    }
    .facebook {
      position: relative;
      width: 100%;
        margin: 10% auto 35px;
    }
    .youtube > iframe, .facebook iframe {
      position: absolute;
      top: 0;
      right: 0;
      width: 100% !important;
      height: 100% !important;
    }
    .bnrArea {
        padding-top: 35px;
    }
	.bnrArea ul{
		width: 90%;
        display: inline;
	}
	.bnrArea ul li{
	  width: 47%;
	  float:left;
	  margin:0 0 0 0;
	  padding-bottom:15px;
	}
	.bnrArea ul li:nth-child(odd){
	  margin:0 5% 0 0;
	}
	.bnrArea ul li:nth-child(4n){
		margin:0 0 0 0;
	}
    .adressList dt {
        width: 100%;
        float: none;        
        text-align:left;
        margin-bottom:5px;
        padding: 0px 10px;
    }
    .adressList dd {
         width: 100%;
        font-size: 14px;
        padding: 0px 10px 5px;
        margin-bottom:10px;
        border-bottom:1px solid #CCC;
    }
    div.pageHalf dl dt {
        width: 100%;
        float: none;
        text-align: center; 
        margin-bottom: 5px;
        padding: 8px 0;
        }
    div.pageHalf dl dd {
        width: 100%;
        float: none;
        font-size: 14px;
        padding: 3px 5px 8px 5px;
      }
}


@media screen and (max-width: 480px) {
    .qSearch dl dt{
		font-size:0.8em;
		padding:0.2em 0 0.2em 0;
		float:left;
		width: 35%;
	}
	.qSearch dl dd{
		padding:0 0 0.3em 0;
		float:left;
		width: 65%;
	}
	.qSearch dl dt.ddClear{
		clear: both;
	}	
	.qSearch dl dd input{
		width:96%;
		padding:3px ;		
	}
   .qSearch dl dd select{
		width:100%;
		padding:3px;
	}	
	input.quickBtn{
		font-size:0.8em;
		width:80%;
		padding:3px;
		margin:0.2em 0 1.4em 10%;
		float:left;		
	}
	.bnr_rps{
		display:inherit;
	}
	.bnr_pc{
		display:none;
	}
	div.ryokanWrapper { width: 80%; margin: auto 10%; }

	div.recRyokan{
	  float:none;
	  width:100%;
	  height:auto;
	  margin:0 5% 10% 0;
	}
	div.recRyokan:nth-child(3n+1),
	div.recRyokan:nth-child(odd){
	  margin:0 5% 10% 0;
	}
	.bnrArea ul{
	  width: 90%;
	  margin: 30px 5% 0 5%;
	}
	.bnrArea ul li{
	  width: 100%;
	  float:none;
	  margin:0 0 0 0;
	  padding-bottom:15px;
	  text-align: center;
	}
	.bnrArea ul li:nth-child(odd){
		margin:0;
	}
    .formList { width:90%; margin: 0 5%; }
    .formList th,
    .formList td{
        width: 100%;
        display: block;
        border-top: none;
        padding:0 5px;
    }
	.formList th{
	    padding-top:10px;
    }
    .formList table th,
    .formList table td{
        width: 100%;
        display:inherit;
        border-top: none;
    }
    	ul.bxslider02 li {/*サムネイル*/
		padding:0;
		margin: 0 ;
	}	
	ul.bxslider02 li a {/*サムネイル*/
		width:120%;
		height:100%;
		padding:0;
	}	 
	ul.bxslider02 li a img{/*サムネイルの画像*/
		width:100%;
		padding:0;
	}
	div.controlWrap {
		margin:10px 5%;
	}
	div.controlWrap p#PrevIcon a{/*矢印画像（前へ）*/
		width:17px;
		height:24px;
		top:30%;
		left:-27px;
	}
	 
	div.controlWrap p#NextIcon a{/*矢印画像（次へ）*/	
		width:17px;
		height:24px;
		top:30%;
		right:-25px;
	}
	.bxslider01 li {
	  height: 300px; /* トリミングしたい高さ */
	}
    table#style02 th.top_left_corner, table#style02 th.top_right_corner {
        padding: 10px 0 0 0;
    }
    table#style00 {
        width: 100%;
        margin: 0 auto 20px;
    }
    table#style00 thead.controls tr th {
        padding: 0px;
    }
    table#style00 .date_nav ul li {
        float: none;
    }
    .date_nav .date_from label {
        margin-top: -6px;
        width: 100%;
        text-align: center;
    }
    table#style00 thead.controls tr th.date_nav .date_from {
        display: block;
    }
    .date_nav .date_from input {
        width: 100%;
        text-align: center;
    }
    table#style00 thead.controls tr th.top_right_corner {
        margin-right: 0;        
    }
    #toggle h1 {
        width: 64%;
    }
}
@media only screen and (min-width : 764px ) and ( -webkit-min-device-pixel-ratio : 2 ){
  .iframe_box {
   width: 320px !important;
  }
}
