@charset "utf-8";

/*
	Theme Name: NICHISHIKI EN
	Version: 1.0
*/


/****************************************

          GENERAL SETTING

*****************************************/

html, body { margin: 0; padding: 0; }

body {
	color: #333;
	font-size:12px;
	font-family: "Helvetica", "Lucida Grande", 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', MeiryoKe_PGothic, 'メイリオ', Meiryo,Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	line-height:1.8;
	background: url(img/bg.png) 0 0 repeat;
}
.canta { font-family: 'Cantarell', sans-serif; }
.spr{
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.articleWrap:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	font-size: 0.1em;
	line-height: 0;
	visibility:hidden;
	}
.articleWrap{display:inline-block;}
/* Hides from IE-mac */
*html .articleWrap{height:1%;}
.articleWrap{display:block;}
/* End hide from IE-mac */

.clear { clear: both; }
.trs {
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.trs:hover {
  filter:alpha(opacity=70);
  -moz-opacity:0.7;
  opacity:0.7;
  zoom:1;
}

/****************************************

				COMMON

*****************************************/

#fade{
  width: 100%;
  height: 100%;
  min-height: 100%;
  display: none;
  background: url(img/bg.png) 0 0 repeat #FFF;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 110;
}
#container{
  width: 100%;
  height: 100%;
  min-height: 100%;
  visibility: hidden;
}


/* ------ TOOLBAR ------ */

#toolbarWrap{
	background:#7bb261;
	color:#FFF;
	border-bottom: 3px solid #57933b;
	height:40px;
}
.home #toolbarWrap{ border-bottom: 3px solid #57933b; }

#toolbar{
	width:1080px;
	margin:0 auto;
	padding-top:5px;
}

#toolbar p.copy{
  line-height: 30px;
  float: left;
  text-shadow: 0 -1px 1px #57933b;
}

#toolbar p.btn_sitemap,
#toolbar p.btn_about{
	margin-left:18px;
  line-height: 30px;
  float: right;
  text-shadow: 0 -1px 1px #57933b;
}

#toolbar p a{
	color:#FFF;
}

#toolbar p a.sitemap span.ico,
#toolbar p a.Inquiries span.ico{
  width: 23px;
  height: 23px;
  background: url(img/parts.png) 0 0 no-repeat;
  display: block;
  float: left;
  margin-top: 3px;
}
#toolbar p a.sitemap span.ico{ background-position: -284px -17px; }
#toolbar p a.Inquiries span.ico{ background-position: -307px -17px; }
#toolbar p a.sitemap span.txt,
#toolbar p a.Inquiries span.txt{ padding-left: 5px; }

#toolbar .btn_language{
	padding:5px 0 0 0;
  margin: 0 0 0 10px ;
	width:170px;
	height:24px;
	background:#FFF;
  float: right;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  position: relative;
}
#toolbar .btn_language p#btn-la{
	color:#898989;
	background: url(img/btn_arrow_down_green.png) no-repeat 0px 4px;
	padding-left:15px;
	margin:0px 0 0 10px;
	display:block;
  cursor: pointer;
}
#toolbar .btn_language a{
	color:#898989;
	padding-left:15px;
	margin:0px 0 0 10px;
	display:block;
}
.la-list{
  width: 170px;
  height: auto;
  background-color: #FFF;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  position: absolute;
  top: 23px;
  left: 50%;
  margin-left: -85px;
  display: none;
  z-index: 60;
  padding: 6px 0 0;
}
.la-list li{
  font-size: 12px;
  padding: 5px 0;
}

#sp_menu{
  width: 30px;
  height: 30px;
  margin: 0 10px 0 0;
  float: right;
  display: none;
}
#sp_menu span{
  width: 30px;
  height: 30px;
  display: block;
  background: url(img/parts.png) -330px -17px no-repeat;
}
#sp_search{
  width: 30px;
  height: 30px;
  margin: 0 7px 0 0;
  float: right;
  display: none;
}
#sp_search span{
  width: 30px;
  height: 30px;
  display: block;
  background: url(img/parts.png) -330px -77px no-repeat;
}

#sp_menu_box{
  width: 100%;
  height: auto;
  background: url(img/bg_header.png) 0 0 repeat #f8f8f8;
  z-index: 20;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  border-top: 3px solid #7bb261;
  border-bottom: 3px solid #7bb261;
  display: none;
}
#sp_menu_box ul{
  padding: 35px 25px 10px;
}
#sp_menu_box li{
  clear: both;
  font-size: 13px;
  letter-spacing: 1px;
  margin: 0 0 25px;
}
#sp_menu_box li a{ color: #333; }
#sp_menu_box li span.ico{
  width: 30px;
  height: 30px;
  float: left;
  margin: -5px 10px 0 0;
  background: url(img/parts.png) 0 0 no-repeat;
}

#sp_menu_box li .ryokan span.ico{ background-position: -408px 0; }
#sp_menu_box li .ranking span.ico{ background-position: -438px 0; }
#sp_menu_box li .what span.ico{ background-position: -468px 0; }
#sp_menu_box li .about span.ico{ background-position: -498px 0; }
#sp_menu_box li .info span.ico{ background-position: -528px 0; }
#sp_menu_box li .photo span.ico{ background-position: -558px 0; }

#sp_search_box{
  color: #333;
  width: 100%;
  height: auto;
  background: url(img/bg_header.png) 0 0 repeat #f8f8f8;
  z-index: 20;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  border-top: 3px solid #7bb261;
  border-bottom: 3px solid #7bb261;
  display: none;
}
#sp_search_box h3{
  color: #111;
  font-size: 16px;
  text-align: center;
  padding: 20px 0 0;
}
#sp_search_box .widget_taxonomy-drill-down{
  width: 280px;
  margin: 0 auto;
  padding: 10px 0 20px;
}
#sp_search_box .taxonomy-drilldown-dropdowns select{
  width: 278px;
}

.btn-close{
  width: 30px;
  height: 30px;
  position: absolute;
  top: 7px;
  right: 7px;
}
.btn-close span{
  width: 30px;
  height: 30px;
  display: block;
  background: url(img/parts.png) -330px -47px no-repeat;
}



/****************************************

          HEADER

*****************************************/

header{ background: #252525; height:450px;
/* box-shadow */ box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset; } 
header#toppage{ border-bottom: 4px solid #DDD; }
header#bottom_page{ width: 249px; height: auto; float: left; background: none; box-shadow: none; padding: 23px 0; } 
#headerInner{ width:1080px; margin:0 auto; padding:23px 0; } 
header #gl_navi{ float:left; width:248px; height:404px; background: url(img/bg_header.png) ; /* box-shadow */ box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 6px 1px; -webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 6px 1px; -moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 6px 1px; } 
header#bottom_page #gl_navi{ margin: 0 0 30px; } 
header #gl_navi #logo{ width: 135px; height: 106px; margin:30px 0 0 55px; } 
header #gl_navi #logo a{ width: 135px; height: 106px; background: url(img/parts.png) 0 -59px no-repeat; display: block; } header nav ul{ padding:28px 0 0 8px; } 
header nav li{ height:58px; background: url(img/gl_line.png) no-repeat 0px 0px; letter-spacing: 1px; } 
header nav li a{ color:#000; line-height: 58px; font-size:12px; padding: 0 0 0 46px; display: block; } 
header nav li.ryokan a{ background: url(img/navi_icon_ryokan.png) no-repeat 12px center; }
header nav li.what a{ background: url(img/navi_icon_what.png) no-repeat 12px center; }
header nav li.ranking a{ background: url(img/navi_icon_ranking.png) no-repeat 12px center; }
header nav li.about a{ background: url(img/navi_icon_about.png) no-repeat 12px center; }

#gl_nav_s{
	width: 248px;
	height: auto;
  margin: 0 0 30px;
  clear: both;
	background: url(img/bg_gl_nav_s.png) ;
	box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 2px 1px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 2px 1px;
	-moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 2px 1px;
}
#gl_nav_s nav ul{ padding: 0 8px; }
#gl_nav_s nav ul li{
  height: 58px;
  background: url(img/gl_line.png) no-repeat 0px 0px;
  letter-spacing: 1px;
}
#gl_nav_s nav ul li.first{ background: none; }
#gl_nav_s nav ul li a{
  color: #000;
  line-height: 58px;
  font-size: 12px;
  padding: 0 0 0 10px;
  display: block;
}

#gl_nav_s nav ul li a.information span,
#gl_nav_s nav ul li a.photogallery span{
  width: 25px;
  height: 30px;
  background: url(img/parts.png) 0 0 no-repeat;
  display: block;
  float: left;
  margin: 13px 12px 13px 0;
}
#gl_nav_s nav ul li a.information span{ background-position: -50px -260px; }
#gl_nav_s nav ul li a.photogallery span{ background-position: -75px -260px; }


/****************************************

          TOP

*****************************************/

/* ------ TOP SLIDER ------ */

.slider { width: 804px; float: right; height: 404px; }
.bg_img { padding: 4px 0 0; }
.slides { text-align: center; width: 804px; }
.slides li a { display: block; width: 804px; height: 343px; }
.slides img { vertical-align: bottom; }
.bx-wrapper { position: relative; }
.bx-pager { overflow: hidden; margin: 15px -12px 0 0; }
.bx-pager li { float: left; width: 104px; margin-right: 12px; }
.bx-pager a { overflow: hidden; display: block; width: 104px; height: 44px; }
.bx-pager li img { width: 100%; }
.bx-pager a img { opacity: 0.3; filter: alpha(opacity=30); vertical-align: bottom; }
.bx-pager a.active img { opacity: 1; filter: alpha(opacity=100); }
.home .slider .bx-controls-direction {
  filter:alpha(opacity=0);
  -moz-opacity:0.0;
  opacity:0.0;
  zoom:1;
}
.home .slider:hover .bx-controls-direction {
  filter:alpha(opacity=100);
  -moz-opacity:1.0;
  opacity:1.0;
}
.home .bx-prev,
.home .bx-next {
  position: absolute;
  top: 150px;
  right: 0;
  width: 48px;
  height: 48px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 100;
}

.home .bx-next { background-image: url(img/bx-next.png); opacity: 0.5; } 
.home .bx-prev { background-image: url(img/bx-prev.png); left: 0; opacity: 0.5; }

#contentsWrap { padding: 30px 0 0; }
.s-comment{
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #000;
  opacity: 0.6;
}
.s-comment p{
  color: #FFF;
  font-size: 11px;
  padding: 5px 10px;
}

#contents {
	width:1080px;
	margin:0 auto;
}


/* ------ AD TEXT AREA ------ */

#contents .other-useful-websites {
  clear: both;
  width: auto;
  padding: 0 ;
	margin-bottom:30px;
  background-color: #FFF;
	box-shadow:rgba(212, 212, 212, 0.407843) 0px 0px 1px 1px;
	-webkit-box-shadow:rgba(212, 212, 212, 0.407843) 0px 0px 1px 1px;
	-moz-box-shadow:rgba(212, 212, 212, 0.407843) 0px 0px 1px 1px;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
}
#contents .other-useful-websites ul {
  text-align: center;
	justify-content:space-between;
  padding: 10px 20px 5px;
}
#contents .other-useful-websites ul li{
  font-size: 11px;
  display: inline-block;
  padding: 0 20px;
}


/* ------ RIGHT ------ */

#right {
	float:right;
	width:803px;
	padding-bottom:50px;
}
#right h2 {
	margin-bottom:20px;
	font-size:1.4em;
	letter-spacing: 1px;
	text-shadow: 0 1px 1px #FFF;
	color:#000;
}
#right h2.tit-sr{ letter-spacing: 0; }
#right h2.tit-sr span{  }

#contents span.ico,
#gallery span.ico{
  width: 25px;
  height: 30px;
  background: url(img/parts.png) 0 0 no-repeat;
  display: block;
  float: left;
  margin-right: 3px;
}
#contents #pop-ranking span.ico{ height: 32px; background-position: 0 -260px; margin: -3px 8px 0 0; }
#contents .info-post span.ico,
#contents #tit-info span.ico,
#contents .information span.ico{ margin-right: 8px; background-position: -50px -260px; }
#contents .information.ryokan-list span.ico{ background-position: -125px -260px; margin: 0 8px 0 0; }
#contents .ryokan-name span.ico{ background-position: -125px -260px; margin: 0 8px 0 0; }
#contents .search .adv-search span.ico{ width: 25px; height: 25px; background-position: -25px -262px; display: inline-block; float: none; margin-bottom: -6px; }
#contents .search span.ico{ width: 30px; background-position: -409px -2px; }
h4.adv-search{
  font-size: 12px;
  letter-spacing: 1px;
  text-align: center;
  margin: 0 0 15px;
  }
#contents #tit-photo span.ico,
#gallery span.ico{ background-position: -75px -260px; margin: -2px 10px 0 0; }
#contents #tit-airport span.ico { background-position: -225px -260px; margin: -2px 10px 0 0; }
#contents #tit-location span.ico,
#contents #tit-aboutryokan span.ico{ background-position: -125px -260px; margin: -2px 8px 0 0; }
#contents #tit-tripadvisor span.ico{ background-position: -50px -290px; margin: -2px 8px 0 0; }
#contents #tit-address span.ico{ background-position: 0 -290px; margin: -2px 8px 0 0; }
#contents #tit-price span.ico{ background-position: -150px -260px; margin: -2px 8px 0 0; }
#contents #tit-private-use span.ico{ background-position: -175px -260px; margin: -2px 8px 0 0; }
#contents #tit-reserve span.ico{ background-position: -200px -260px; margin: -2px 8px 0 0; }
#contents #tit-related span.ico{ background-position: -25px -290px; margin: 0 5px 0 0; }
#contents .page-header h1 span.ico{ background-position: -100px -260px; margin: -2px 8px 0 0; }
#contents  ul li span.ico{  }

#contents .ryokan-category li.ico{
  width: 20px;
  height: 20px;
  background: url(img/parts.png) -75px -294px no-repeat;
  display: block;
  float: left;
  margin: 0 10px 0 0;
}

#right hr,
hr.pencil {
	height:2px;
	margin:20px 0;
	border:none;
	background:url(img/line.png) repeat-x;
}

article{
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
}
#right .articleWrap {
	width:803px;
	flex-wrap:wrap;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
}

#right .search { width:803px; position: relative; }

#right .search article {
	width:185px;
	margin:0 0 15px 18px;
	padding:20px 0 16px;
	text-align:center;
	background-color: #FFF;
  float: left;
  position: relative;

	/* border-radius */
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;

	/* box-shadow */
	box-shadow:rgba(0, 0, 0, 0.0470588) 0px 0px 3px 1px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.0470588) 0px 0px 3px 1px;
	-moz-box-shadow:rgba(0, 0, 0, 0.0470588) 0px 0px 3px 1px;
}
#right .search article.icon_serch_1,
#right .search article.icon_serch_2{
  width: 388px;
  text-align: center;
}
#right .search article.icon_serch_1,
#right .search article.icon_serch_3 {
	margin-left:0px;
  clear: both;
}
.c-tit-selected a{ color: #000; }
.c-tit-selected a:hover{ color: #666; }

.relation-wrap{
  clear: both;
  margin: 15px 20px 20px;
  padding: 15px 15px 1px;
  text-align: center;
  background: url(img/bg.png) 0 0 repeat;
  border: 1px solid #EEE;
  border-radius: 4px;
  text-shadow: 0 1px 1px #FFF;
}
.relation-box{
  margin: 0 0 15px;
}
.pic-relation img{
  width: 25%;
  height: auto;
  float: left;
  border: 3px solid rgb(255, 255, 255);
  box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
  -webkit-box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
  -moz-box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
}
#right .relation-wrap h3{
  color: #555;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 1px;
  text-align: center;
  display: inline-block;
  border-bottom: 2px solid #5580B3;
  margin: 0 auto 20px;
}
#right .relation-wrap h4{
  text-align: left;
  margin-left: 32%;
  padding: 3px 0 0;
}
#right .relation-wrap h4 a{ color: #333; }
#right .search article.icon_serch_1 .relation-wrap .p-excerpt p,
#right .search article.icon_serch_2 .relation-wrap .p-excerpt p{
  font-size: 11px;
  text-align: left;
  margin-left: 32%;
  padding: 5px 0 0;
}
.articleWrap .relation-wrap ul.location{
  color: #888;
  font-size: 10px;
  line-height: 1.4;
  text-align: left;
  margin: 0 0 0 32%;
  padding: 0;
}
.articleWrap .relation-wrap ul.location li{
  display: inline-block;
  padding: 0 8px 0 0;
}

#right .search article p {
  font-size: 0.8rem;
	min-height:45px;
	padding:0 10px 5px;
	line-height: 1.6;
}

#right .search article .btn-select-cat {
	display: inline-block;
	margin: 0 17px;
	color: #FFF;
	letter-spacing: 1px;
  padding: 5px 12px 2px;
  background-color: #4a8dc5;
  border-bottom: 3px #3878ae solid;
  border-radius: 6px;
}

#right .search article .btn-select-cat img { margin-right:5px; }
#right .search article img.ico-search{
  width: 150px;
  height: auto;
}

#right .search article.icon_serch_1 img.ico-search,
#right .search article.icon_serch_2 img.ico-search{
  width: 180px;
  height: auto;
  float: left;
}
#right .search article.icon_serch_1 p,
#right .search article.icon_serch_2 p{
  padding: 20px 20px 10px 0;
  margin-left: 181px;
  text-align: left;
}

article.icon_serch_3,
article.icon_serch_4,
article.icon_serch_5,
article.icon_serch_6{ cursor: pointer; }

.select-cat{ position: relative; }
#right .search article.icon_serch_1 .select-cat,
#right .search article.icon_serch_2 .select-cat{ text-align: center; }
.wrap-category{
  width: 120%;
  height: auto;
  background-color: #f8f8f8;
  border: 1px solid #FFF;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  position: absolute;
  top: 30px;
  left: 50%;
  margin-left: -60%;
  z-index: 10;
  display: none;
}
.wrap-category ul{
  padding: 20px 20px 10px;
}
#right .search article .wrap-category  a{
  display: block;
  margin: 0 0 5px;
  padding: 4px 8px;
  background: none;
  color: #333;
  letter-spacing: 0;
}

#search-form{
  position: relative;
  width: 794px;
  margin: 10px 0 30px;
  padding: 25px 0 16px;
  text-align: center;
  background-color: #FFF;
  position: relative;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  box-shadow: rgba(0, 0, 0, 0.0470588) 0px 0px 3px 1px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.0470588) 0px 0px 3px 1px;
  -moz-box-shadow: rgba(0, 0, 0, 0.0470588) 0px 0px 3px 1px;
}
#right #search-form h4{
  color: #333;
  font-size: 16px;
  text-align: left;
  padding: 0 0 5px 20px;
  position: relative;
}

.howtouse .howtouse-ico { display: inline-block; width: 11px; height: 11px; background: url(img/btn_arrow_right_green.png) no-repeat left center; }
.tit-wrap .howtouse { position: absolute; top: 0; right: 20px; font-size: 12px; }
#search-form .howtouse { position: absolute; top: 20px; right: 20px; font-size: 12px; }

#right #search-form h4 span.ico{
  width: 25px;
  height: 30px;
  background: url(img/parts.png) -25px -260px no-repeat;
  display: block;
  float: left;
  margin-top: -7px;
  margin-right: 5px;
}
#search-form .widget_taxonomy-drill-down ul{
  margin: 15px 20px 20px;
  padding: 15px 10px 10px;
  background: url(img/bg.png) 0 0 repeat;
  border: 1px solid #EEE;
  border-radius: 4px;
}
#search-form .widget_taxonomy-drill-down li{
  width: 45%;
  display: inline-block;
  margin: 0 2% 14px;
  text-align: left;
}
#search-form .widget_taxonomy-drill-down li label{
  color: #555;
  font-size: 13px;
  padding: 0 0 5px;
  display: inline-block;
}
#search-form .taxonomy-drilldown-dropdowns select{
  width: 100%;
}

#right .information .articleWrap article {
	width:249px;
	margin: 0 0 30px 26px;
	text-shadow: 0 1px 1px #FFF;
  float: left;
  cursor: pointer;
}
#right .information .articleWrap article:nth-child(3n+1) { margin-left:0px; }
#right .information.reated-articles .articleWrap article{ margin-bottom: 30px; }
#right .information.reated-articles .articleWrap article:nth-child(3n+1) { margin-left:0px; clear: both; }

#right .information .articleWrap article .image img {
  width: 225px;
  height: auto;
	margin:0 auto 10px;

	/* border */
	border:5px solid rgb(255, 255, 255);

	/* box-shadow */
	box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-webkit-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-moz-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
}

#right .information .articleWrap article h3 ,
#right .information .articleWrap article p { padding:0 0 5px; }

#right .information .articleWrap article h3 {
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}
#right .information .articleWrap article h3 a{ color: #5580b3; }

#right .information .articleWrap article .update {
  font-size: 11px;
  padding-bottom: 3px;
}
#right .information .articleWrap article .text {
	padding-bottom: 10px;
	font-size: 12px;
	font-weight: normal;
	color:#666666;
}

.box-link{ cursor: pointer; display: block; opacity: 1; -webkit-transition: opacity .4s ease; -moz-transition: opacity .4s ease; -ms-transition: opacity .4s ease; transition: opacity .4s ease; }
.box-link:hover{ opacity: 0.5; }
.springs{ text-align: center; }
#ranking-content .springs{ text-align: left; }
#ranking-content a.spring{ margin: 0 0 6px -5px;}
@media screen and (max-width: 479px) {
#ranking-content .springs{ text-align: center; }
}
a.spring.hokkaido, a.spring.aomori, a.spring.iwate, a.spring.akita, a.spring.miyagi, a.spring.yamagata, a.spring.fukushima, a.spring.yamanashi, a.spring.gunma, a.spring.tochigi, a.spring.kanagawa, a.spring.chiba, a.spring.niigata, a.spring.nagano, a.spring.shizuoka, a.spring.izu-peninsula, a.spring.ishikawa, a.spring.gifu, a.spring.mie, a.spring.toyama, a.spring.hyogo, a.spring.wakayama, a.spring.kyoto, a.spring.shiga, a.spring.yamaguchi, a.spring.tottori, a.spring.shimane, a.spring.okayama, a.spring.hiroshima, a.spring.kagawa, a.spring.ehime, a.spring.tokushima, a.spring.kumamoto, a.spring.saga, a.spring.nagasaki, a.spring.oita, a.spring.kagoshima, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido, a.spring.hokkaido{ display: none; }
a.spring{ color: #5580b3; font-size: 11px; line-height: 12px; text-shadow: none; vertical-align: baseline; display: inline-block; padding: 5px 10px 5px; margin: 0 2px 6px 2px; background-color: #F9F9F9; border: 1px solid #5580b3; box-shadow: 0 1px 1px #FFF; border-radius: 15px; -webkit-transition: background-color 0.3s, color 0.3s; -moz-transition: background-color 0.3s, color 0.3s; transition: background-color 0.3s, color 0.3s; }
a.spring:hover{ color: #FFF; background-color: #5580b3; }

.articleWrap ul.location{
  color: #888;
  font-size: 10px;
  line-height: 1.4;
  text-align: center;
  padding: 0;
  margin: 0 0 10px;
}
.articleWrap ul.location li{
  display: inline-block;
  padding: 0 4px;
}


#right .information .articleWrap article a.readmore {
	display:block;
	margin:0 34px;
	padding:4px 8px;
	background:#5580b3;
	color:#ffffff;
	text-align:center;
	letter-spacing: 1px;
	text-shadow: none;
  display: none !important;

	/* border-radius */
	border-radius:2px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
}

#right .information .articleWrap article a img {
	margin-right:5px;
}

.articleWrap .howtouse {
  font-size: 11px;
}


/* ------ LEFT ------ */

#left {
	float:left;
	width: 249px;
	padding-bottom:35px;
}

#left .box,
header#bottom_page .box {
	padding-bottom:35px;
	background-color: #f6f6f6;
  text-align: center;

	/* border-radius */
	border-radius: 4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;

	/* box-shadow */
	box-shadow:rgb(232, 232, 231) 0px 0px 4px 1px inset;
	-webkit-box-shadow:rgb(232, 232, 231) 0px 0px 4px 1px inset;
	-moz-box-shadow:rgb(232, 232, 231) 0px 0px 4px 1px inset;
}
#left .box#pop-ranking{ padding-top: 20px; }

#left h2 {
	padding:17px 0 25px;
	text-align:center;
}
#left #pop-ranking h2{
  width: 163px;
  height: 61px;
  background: url(img/parts.png) -135px -89px no-repeat;
  padding: 0;
  margin: 0 auto 5px;
}
#left #pop-ranking .tit-wrap{ margin: 0 0 20px; }
#left #pop-ranking .tit-wrap .r-update{
  color: #999;
  font-size: 11px;
}

#pop-ranking ul.location{
  color: #888;
  font-size: 10px;
  line-height: 1.4;
  text-align: center;
  padding: 0;
  margin: 0 0 10px;
}
#pop-ranking.ranking-post ul.location{ text-align: left; }

#pop-ranking ul.location li{
  display: inline-block;
  padding: 0 4px;
}
#pop-ranking.ranking-post ul.location li{ padding: 0 8px 0 0; }

#left article { padding:0 20px 35px 19px; }
#left #pop-ranking article { padding:0 0 25px; }
#pop-ranking .image { position:relative; }
#pop-ranking .image span {
	position: absolute;
	left: -3px;
	top: -5px;
	width: 23px;
	height: 43px;
  z-index: 10;
}
#left article p{ text-align: left; }

#pop-ranking .image span{
  width: 25px;
  height: 25px;
  background: url(img/parts.png) 0 0 no-repeat;
}
#pop-ranking .image span.rank1,
#pop-ranking .image span.rank2,
#pop-ranking .image span.rank3{ height: 45px; }


#pop-ranking .image span.rank1 { background-position: 0 -165px; }
#pop-ranking .image span.rank2 { background-position: -25px -165px; }
#pop-ranking .image span.rank3 { background-position: -50px -165px; }
#pop-ranking .image span.rank4 { background-position: 0 -210px; }
#pop-ranking .image span.rank5 { background-position: -25px -210px; }
#pop-ranking .image span.rank6 { background-position: -50px -210px; }
#pop-ranking .image span.rank7 { background-position: -75px -210px; }
#pop-ranking .image span.rank8 { background-position: -100px -210px; }
#pop-ranking .image span.rank9 { background-position: -125px -210px; }
#pop-ranking .image span.rank10 { background-position: -150px -210px; }
#pop-ranking .image span.rank11 { background-position: -175px -210px; }
#pop-ranking .image span.rank12 { background-position: -200px -210px; }
#pop-ranking .image span.rank13 { background-position: 0 -235px; }
#pop-ranking .image span.rank14 { background-position: -25px -235px; }
#pop-ranking .image span.rank15 { background-position: -50px -235px; }
#pop-ranking .image span.rank16 { background-position: -75px -235px; }
#pop-ranking .image span.rank17 { background-position: -100px -235px; }
#pop-ranking .image span.rank18 { background-position: -125px -235px; }
#pop-ranking .image span.rank19 { background-position: -150px -235px; }
#pop-ranking .image span.rank20 { background-position: -175px -235px; }

#pop-ranking .tags.no-link ul{
  padding: 10px 0 0;
  text-align: left;
}
#left #pop-ranking .tags.no-link ul{
  padding: 7px 0 0;
  text-align: center;
}
#pop-ranking .tags.no-link ul li{
  margin-left: -5px;
}
#pop-ranking .image img {
  width: 200px;
  height: auto;
  margin: 0 0 10px;
  vertical-align: bottom;
	border:5px solid rgb(255, 255, 255);
	box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-webkit-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-moz-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
}

#left .btn {
	display: inline-block;
  margin: 0 0 20px;
	padding:9px 20px 6px;
	background:#55b376;
	color:#ffffff;
	text-align:center;
  line-height: 1.1;
	letter-spacing: 1px;
  border-bottom: 3px #48a569 solid;

	/* border-radius */
	border-radius:6px;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
}

#left .btn:hover { background:#7dc797; }
#left .btn img { margin-right:5px; }

#left article h3 {
	text-align:center;
	font-size: 14px;
  line-height: 1.6;
	margin-bottom: 5px;
}

#left article h3 a:link {color:#333333; text-decoration:underline;}
#left article h3 a:active {color:#333333; text-decoration:underline;}
#left article h3 a:hover {color:#666666; text-decoration:underline;}
#left article h3 a:visited {color:#333333; text-decoration:underline;}

.badge{ margin: 0 0 30px; }


/* ------ PHOTO GALLERY ------ */

#gallery {
	clear:both;
	width:100%;
	margin-bottom:50px;
	padding: 25px 0 4px;
	background-color: #ececec;
  text-align: center;
  position: relative;
  overflow: hidden;

	/* box-shadow */
	box-shadow:rgb(232, 232, 231) 0px 0px 5px 3px inset;
	-webkit-box-shadow:rgb(232, 232, 231) 0px 0px 5px 3px inset;
	-moz-box-shadow:rgb(232, 232, 231) 0px 0px 5px 3px inset;
}

#gallery .tit-wrap {
  text-align: center;
	padding-bottom:20px;
  display: inline-block;
}

#gallery .tit-wrap h2 {
	padding: 0 20px 0 0;
	font-size:1.3em;
	color:#444444;
  text-align: left;
	text-shadow: 0 1px 1px #FFF;
	letter-spacing: 1px;
  display: inline-block;
}
#gallery .tit-wrap .category{ display: inline-block; }
#gallery .tit-wrap .category a {
  height: 30px;
  color: #5580b3;
	display: block;
	padding: 2px 13px;
	text-align: center;
	background-color: #FFF;
  line-height: 35px;
  letter-spacing: 1px;

	/* border-radius */
	border-radius:6px;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
  
  border-bottom: 3px #DDD solid;
}

#gallery .tit-wrap .category a img { padding-right:5px; }
#gallery .carousel div { text-align:center; }

#gallery .carousel div img {
  width: 90%;
  height: auto;
	margin: 0 auto;
	/* border */
	border:5px solid rgb(255, 255, 255);

	/* box-shadow */
	box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-webkit-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-moz-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
}

#gallery .carousel div p {
	width: 100%;
	padding-top: 4px;
	margin: 0 auto;
	text-align: center;
	font-size: 0.8rem;
}


/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: none; touch-action: none; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; zoom: 1; }
.slick-track:before, .slick-track:after { content: ""; display: table; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 200px; width: 32px; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; top: 50%; margin-top: -115px; padding: 0; border: none; outline: none; }
.slick-prev:focus, .slick-next:focus { outline: none; }
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color: white; opacity: 0.85; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: 0px; }
.slick-prev:before { content: url("img/btn_gallery_l.png"); }
.slick-next { right: 0px; }
.slick-next:before { content: url("img/btn_gallery_r.png"); }

/* Dots */
.slick-slider { margin-bottom: 25px; }

.slick-dots { position: absolute; bottom: -45px; list-style: none; display: block; text-align: center; padding: 0px; width: 100%; }
.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0px 5px; padding: 0px; cursor: pointer; }
.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0; font-size: 0; color: transparent; padding: 5px; cursor: pointer; }
.slick-dots li button:focus { outline: none; }
.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "\2022"; width: 20px; height: 20px; font-family: "slick"; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-dots li.slick-active button:before { opacity: 0.75; }

/* ------ OTHER USEFUL WEBSITES ------ */

.other-useful-websites {
  clear: both;
  width: 1080px;
  margin: 0 auto 30px;
  text-align: center;
  background: #f6f6f6;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  box-shadow: rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -webkit-box-shadow: rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -moz-box-shadow: rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
}

.other-useful-websites ul { padding: 20px 20px 15px; }
.other-useful-websites li{
	display: inline-block;
	padding:0 0 0 20px;
	margin:0 0 4px 10px;
	background:url(img/btn_arrow_blank.png) no-repeat left center;
}
.other-useful-websites ul li h2 { display: inline; }
.other-useful-websites ul li.tit {
	padding:0 0 0 20px;
	margin:0 0 4px 0;
	background:none;
}


/* ------ BANNER AREA ------ */

#bannerArea {
  clear: both;
	width: 1080px;
	margin: 0 auto 30px;
  text-align: center;
}
#bannerArea li{
  width: 30%;
  margin: 0 1%;
  display: inline-block;
}
#bannerArea img {
  width: 335px;
  height: auto;
  border-radius: 3px;
  transition: .3s ease;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
}
#bannerArea img:hover{ opacity: 0.7; }


/* ------ LOCAL BANNER AREA ------ */

#localbannerArea {
  clear: both;
}
#localbannerArea li{
  margin-bottom: 30px;
}
#localbannerArea img {
  width: 249px;
  height: auto;
  border-radius: 3px;
  transition: .3s ease;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
}
#localbannerArea img:hover{ opacity: 0.7; }

/****************************************

          TOPIC PATH

*****************************************/

.topicPath {
  margin: 0 0 35px;
  background: #fff;
  border-top: 2px #EEE solid;
  border-left: 1px #f7f7f7 solid;
  border-right: 1px #f7f7f7 solid;
  border-bottom: 1px #f7f7f7 solid;
}
.topicPath ul { padding: 10px; }
.topicPath li { display: inline; color: #5580b3; }
.topicPath li a { color: #555; }

/****************************************

          TAGS

*****************************************/

#left .box, header#bottom_page .box.tags,
#sort-area.box.tags {
  padding: 0;
  clear: both;
  margin: 0 0 20px;
  background: #f6f6f6;
  /* border-radius */
	border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  /* box-shadow */
  box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
}
#sort-area.box.tags{ margin: 0 0 30px; }
#sort-area.box.tags ul{
  margin: 0 0 25px;
  padding: 17px 15px 10px;
}
#sort-area.box.tags ul.state{ margin: 0; border-bottom: 1px #e8e8e8 solid; }

.tags ul { padding: 15px 10px 20px; }
.tags.no-link ul { padding: 0; text-align: center; }
.tags li { display: inline-block; }

.tags a ,
#sort-area.tags a {
  color: #5b9743 !important;
  font-family: Helvetica,"lucida grande",tahoma,verdana,arial,sans-serif;
  font-size: 12px;
  line-height: 12px;
  vertical-align: baseline;
  display: block;
  padding: 5px 10px;
  margin: 0 2px 6px 2px;
  background-color: #fff;
  border: 1px solid #7bb261;
  border-radius: 15px;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}
.tags a ,#sort-area.tags a:hover { color: #fff !important; background-color: #7bb261;  border: 1px solid #7bb261; }
#sort-area.tags a.cr  { color: #fff !important; background-color: #7bb261; }
.tags a:active {
  position: relative;
  top:1px;
}

.tags.no-link span{
  color: #999;
  font-family: Helvetica,"lucida grande",tahoma,verdana,arial,sans-serif;
  font-size: 11px;
  line-height: 12px;
  vertical-align: baseline;
  text-shadow: 0 1px 1px #FFF;
  display: block;
  padding: 5px 10px 5px;
  margin: 0 2px 6px 2px;
  background-color: #F9F9F9;
  border: 1px solid #888;
  box-shadow: 0 1px 1px #FFF;
  border-radius: 15px;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}
.ico-related span{
  color: #999;
  font-family: Helvetica,"lucida grande",tahoma,verdana,arial,sans-serif;
  font-size: 11px;
  line-height: 12px;
  vertical-align: baseline;
  text-shadow: 0 1px 1px #FFF;
  display: block;
  padding: 0px 10px 5px;
  margin: 0 2px 6px 2px;
  background-color: #F9F9F9;
  border: 1px solid #CCC;
  box-shadow: 0 1px 1px #FFF;
  border-radius: 15px;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}
.ico-related.btn-ryokan span {
  color: #fff;
  background: #5580b3;
  text-shadow: 0 1px 1px #3566a0;
}
.ico-related-ryokan,
.ico-related-info,
.ico-related-photo{
  display: inline-block;
  width: 16px;
  height: 16px;
  position: relative;
  top: 4px;
  margin: 0 5px 0 0;
  background: url(img/parts.png) 0 0 no-repeat;
}
.ico-related-ryokan{ background-position: -251px -323px;}
.ico-related-photo{ background-position: -54px -323px;}
.ico-related-info{ background-position: -275px -323px;}

.ico-related{ text-align: center; }
.ico-related span{
  display: inline-block;
  line-height: 11px;
}

#terms-location .term-item ul{ display: none !important; }


header#bottom_page .box.tags h3{
  font-size: 13px;
  text-align: center;
  letter-spacing: 1px;
  padding-top: 20px;
  display: inline-block;
}
#contents header#bottom_page .box.tags #tit-photo span.ico,
header#bottom_page .box.tags h3 span.ico{
  width: 25px;
  height: 30px;
  margin-top: -5px !important;
}

.ryokan-category.tags ul {
  padding: 0;
}

.ryokan-category.tags { display: none; }
.ryokan-content article .ryokan-category.tags { display: block; }

@media screen and (max-width: 769px) {
.ryokan-category.tags { display: block; }
.ryokan-content article .ryokan-category.tags { display: none; }
}

/****************************************

          SEARCH BOX

*****************************************/


h3#tit-searchbox{
  font-size: 13px;
  text-align: center;
  letter-spacing: 1px;
}
h3#tit-searchbox span.ico{
  width: 25px;
  height: 30px;
  background: url(img/parts.png) -25px -260px no-repeat;
  display: block;
  float: none;
  margin: 0 auto;
}

#left .box, header#bottom_page .box#seach_box{
  padding: 20px 15px 10px;
  margin: 0 0 30px;
  clear: both;
}
#seach_box img.ico-search{
  width: 30%;
  float: left;
  margin: 0 0 10px;
}
#seach_box .select-cat{
  clear: both;
  text-align: center;
}
#seach_box .articleWrap article{
  margin: 0 0 20px;
}
#seach_box .articleWrap p{
  font-size: 11px;
  line-height: 1.6;
  text-align: left;
  margin: 10px 0 10px;
}

#seach_box .articleWrap .btn-select-cat{
  display: block;
  margin: 0;
  padding: 0;
  color: #666666;
  letter-spacing: 1px;
  padding: 4px 8px;
  background-color: #FFF;
  border-bottom: 3px #EEE solid;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}
#seach_box .articleWrap .btn-select-cat img{
  margin: 0 6px 0 0;
}

#seach_box .wrap-category {
  width: 120%;
  height: auto;
  background-color: #FFF;
  border: 1px solid #EEE;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  position: absolute;
  top: -100%;
  right: 0;
  margin: 0 0 0 100px;
  z-index: 50;
  display: none;
  text-align: left;
}
#seach_box .wrap-category a{
  display: block;
  margin: 0 0 5px;
  padding: 4px 8px;
  background: none;
  color: #333;
  letter-spacing: 0;
}

.taxonomy-drilldown-checkboxes li, .taxonomy-drilldown-dropdowns li{
  margin: 0 0 10px;
}
.taxonomy-drilldown-checkboxes li, .taxonomy-drilldown-dropdowns li label{
  font-size: 13px;
}
select{
  -webkit-appearance: none;
  width: 218px;
  padding: 0 12px;
  box-shadow: 0 1px 1px #DDD;
  background-color: #FFF;
  color: #666;
  font-size: 13px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border: #CCC solid 1px;
  vertical-align: middle;
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
}
#seach_box .articleWrap .widget p{ padding: 5px 0 0; }
 input[type="submit"]{
  font-family: 'Cantarell', sans-serif;
  display: block;
  margin: 0 auto;
  padding: 5px 15px;
  letter-spacing: 1px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border: 0;
  border-bottom: 3px #57933b solid;
  border-radius: 4px;
  background: none;
  -webkit-appearance: none;
  background: #7bb261;
  color: #FFF;
  text-decoration: none;
  font-size: 13px;
  line-height: normal;
  cursor: pointer;
}
input[type="submit"]:hover{ background: #82ba67; }



/****************************************

          INFORMATION

*****************************************/

.entry-inner {
  width: 803px;
  padding: 20px 0 0;
}

.info-post {
  text-align: left;
  margin: 0 0 20px;
}

.main-image,
.main-image-s {
  margin: 0 0 15px;
  line-height: 0;
	border:5px solid rgb(255, 255, 255);
	box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-webkit-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
	-moz-box-shadow:rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
}
#right .info-post h1 {  margin: 0 0 20px; }
.date { margin: 0 0 10px; }
.main-image img,
.main-image-s img{
  width: 100%;
  height: auto;
}

.entry{ text-align: left; }
.entry p{ font-size: 13px; margin: 0 0 15px; }
.entry p a{ color: #7bb261; }

.alignleft{
  float: left;
  margin: 5px 25px 25px 0;
}
.alignright{
  float: right;
  margin: 5px 0 25px 25px;
}
.entry img{
  border: 5px solid rgb(255, 255, 255);
  box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
  -webkit-box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
  -moz-box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
}


.article-cat{ float: right; }
.article-cat a{
  color: #FFF;
  font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
  font-size: 11px;
  line-height: 12px;
  vertical-align: baseline;
  display: inline-block;
  padding: 5px 10px;
  margin: 0 3px 6px 3px;
  background-color: #7bb261;
  border-radius: 10px;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -o-transition: all 0.6s;
  transition: all 0.6s;
}

/****************************************

          RYOKAN

*****************************************/

.ryokan-text {
  float: left;
  width: 420px;
}

#right h1 {
  font-size: 18px;
  line-height: 1;
}
#right h1 .small{
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0;
  padding: 0 0 0 10px;
}
#right h2 {
  background-repeat: no-repeat;
  background-position: left center;
}
#right h3 {
  margin: 0 0 5px;
  color: #5580b3;
  font-size: 14px;
  line-height: 1;
}

#right h3 {
  min-height: 20px;
  margin: 0 0 15px;
  line-height: 1.8;
  background-repeat: no-repeat;
  background-position: left center;
}

.not-found { clear: both; }

#ryokan-right h3 { font-weight: bold; }

#right h4 {
  margin: 0 0 5px;
  font-size: 14px;
  line-height: 1;
}
#right .ryokan-text h3{ margin: 0 0 5px; }


/* ------ RYOKAN HEADER ------ */

.ryokan-header {
  position: relative;
  margin: 0 0 23px;
}
#right .ryokan-header h1{
  line-height: 40px;
  padding-right: 100px;
}
.ryokan-logo {
  float: left;
  margin-right: 10px;
}
.ryokan-logo img { height: 40px; }


/* ------ SNS LIST ------ */

.single-ryokan #sns-list {position: absolute;bottom: -5px;right: 0;}
.facebook {}
.twitter { position: relative; top:7px;}
.googleplus { position: relative; top:7px;}

#sns-list li,
#right .post-single #sns-list li{
  display: inline-block;
  text-align: right;
  margin-left: 10px;
}
.single-photo #sns-list,
.single-info #sns-list,
#right .post-single #sns-list{
  display: inline-block;
  padding: 10px 10px 5px 20px;
  margin: 0 0 15px;
  background-color: #EEE;
  border: 1px solid #DDD;
  border-radius: 4px;
}
.single-photo #sns-list li,
.single-info #sns-list li,
#right .post-single #sns-list li{
  margin-left: 0;
  margin-right: 10px;
}
.single-photo  .entry,
.single-info .entry,
.page .entry{
  margin: 0 0 20px;
}


#right .post-single ul#sns-list{
  margin: 0;
}
#sns-list li a {
  display: block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: left center;
}

#sns-list li a.facebook,
#sns-list li a.twitter,
#sns-list li a.googleplus { background-image: url(img/parts.png) ;background-repeat: no-repeat; }

#sns-list li a.facebook { background-position: 0 -345px ;}
#sns-list li a.twitter { background-position: -25px -345px ;}
#sns-list li a.googleplus { background-position: -50px -345px ;}

/* ------ RYOKAN SLIDER ------ */

#slider { margin: 0 0 23px; background: url(img/bg-slider.png) repeat left top; }
.gallery-slides .slid { float: right; padding: 10px; }
.slid-image{ position: relative; text-align: center; }
.slid-caption { position: absolute; top: 0; left: 10px; width: 783px; height: 532px; text-align: center; }
.slid-caption p { position: absolute; bottom: 0; left: 0; padding: 15px; color: #fff; width: 753px; background: #000; opacity: 0.0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; }
.slid-caption:hover p { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
.gallery-slides .slid img{ max-width: 783px; max-height: 522px; }
.slid a:hover img { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
.gallery-bx-pager { text-align: center; padding: 0 0 10px 10px; }
.gallery-bx-pager li { width: 40px; height: auto; margin-right: 10px; line-height: 0; font-size: 0; display: inline-block; }
.gallery-bx-pager li img { width: 100%; }
.gallery-bx-pager a img { opacity: 0.3; filter: alpha(opacity=30); }
.gallery-bx-pager a.active img { opacity: 1; filter: alpha(opacity=100); }


/* ------ CONTENT ------ */

.content {
  margin: 0 0 30px;}
.content p {
  margin: 0 0 20px;}

.tripadvisor {
  margin: 0 0 30px;
  padding: 26px 0 0;
  background: url(img/line2.png) repeat-x left top;
}

.tripadvisor .copyright a {
	display: inline-block;
	margin:0 0 15px 10px;
	padding:0 0 0 20px;
	background:url(img/btn_arrow_blank.png) no-repeat left 5px;
}

.tripadvisor .widget {
  display: block;
  height: 180px;
  width: 100%;
  margin: 0 0 15px;
}
.official-site a {
	display: inline-block;
	margin:0 0 15px 10px;
	padding:0 0 0 20px;
	background:url(img/btn_arrow_blank.png) no-repeat left center;
}
/* ------ RYOKAN RIGHT ------ */

#ryokan-right {
  float: right;
  width: 348px;
}

/* ------ RYOKAN RESERVE ------ */

.reserve-box {
  padding: 20px;
  margin-bottom: 20px;
  background: #fff;
  /* border-radius */
	border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  /* box-shadow */
  box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 3px 1px;
  -webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 3px 1px;
  -moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 3px 1px;
}

.reserve-button-list {}

li.reserve-button {
  margin: 0 0 8px;
  padding: 0;
}
li.reserve-button ul {
  padding: 8px 0 8px 135px;
  background-position: 10px center;
  background-repeat: no-repeat;
  border-bottom: 1px #999 dotted;
}
li.reserve-button ul.knt { background-image: url(img/logo-knt.png); }
li.reserve-button ul.japanican { background-image: url(img/logo-japanican.png); }
li.reserve-button ul.nta { background-image: url(img/logo-nta.png); }
li.reserve-button ul.other { background-image: url(img/logo-other.png); }
li.reserve-button ul.official { background-image: url(img/logo-official.png); }

#ryokan-right li.reserve-button li a {
  color: #FFF;
  letter-spacing: 1px;
  display: block;
  padding: 5px 12px 5px 12px;
  margin: 5px 0;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 1px;
  text-shadow: 0 -1px 1px #1b58ae;
  box-shadow: 0 1px 1px #EEE;
  background: #4297db;
  border-bottom: 4px #2e7ad4 solid;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}
#ryokan-right li.reserve-button li a span{
  font-size: 12px;
  letter-spacing: 0;
}


/* ------ RYOKAN DETAIL ------ */

.ryokan-detail{
  padding: 0 20px;
  margin-bottom: 20px;
  background: #fff;
  /* border-radius */
	border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  /* box-shadow */
  box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 3px 1px;
  -webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 3px 1px;
  -moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 3px 1px;
}

.detail-average { padding: 20px 0 20px; }
.detail-private{
  padding: 20px 0 20px;
  border-top: 1px #999 dotted;
}

.ryokan-detail dt,
.ryokan-detail dd { display: inline; }
.ryokan-detail dt { font-size: 12px; }

.ryokan-detail p span,
.ryokan-detail dd span {
  color: #7bb261;
  font-size: 18px;
}
.ryokan-detail dd span{ padding-left: 5px; }

.ryokan-detail p span.pass,
.ryokan-detail dd span.pass { color: #444; }

.help-nav{ padding: 10px 0 0; }


/* ------ RYOKAN ADDRESS ------ */

.ryokan-address,
.reated-articles,
.ryokan-category {
  clear: both;
  margin: 0 0 35px;
  padding: 26px 0 0;
  background: url(img/line2.png) repeat-x left top;
}

.ryokan-category {
  margin: 0 0 20px;
  padding: 26px 0 0;
}

.acf-map {
	height: 400px;
	margin: 0 0 20px;
	border: 5px #fff solid;
  /* box-shadow */
  box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 6px 1px;
  -webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 6px 1px;
  -moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 6px 1px;
}
.txt-address {
  margin: 0 0 20px;
}

.ryokan-address p a { color: #7bb261; }

/* ------  ------ */

.thumb-image {
  position: relative;
}

.ryokan-cat-icon {
  position: absolute;
  top: -12px;
  left: 6px;
}

.ryokan-cat-icon li {
  float: left;
  display: block;
  width: 24px;
  height: 24px;
  margin: 0 5px 0 0;
  background-repeat: no-repeat;
  background-position: center center;
}

.ryokan-cat-icon li.openbaths {  background-image: url(../img/icon-openbaths.png);}
.ryokan-cat-icon li.privatebaths {  background-image: url(../img/icon-privatebaths.png);}

#slider {
  position: relative;
}

#slider .bx-controls-direction {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  -webkit-transition: 0.6s ease-in-out;
  -moz-transition: 0.6s ease-in-out;
  -o-transition: 0.6s ease-in-out;
  transition: 0.6s ease-in-out;
  filter:alpha(opacity=0);
  -moz-opacity:0.0;
  opacity:0.0;
  zoom:1;
}

#slider:hover .bx-controls-direction {
  filter:alpha(opacity=100);
  -moz-opacity:1.0;
  opacity:1.0;
  zoom:1;
}

#slider .bx-prev,
#slider .bx-next {
  position: absolute;
  top: 266px;
  right: 0;
  width: 48px;
  height: 48px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center center;
}

#slider .bx-next { background-image: url(img/bx-next.png); opacity: 0.5; } 
#slider .bx-prev { background-image: url(img/bx-prev.png); left: 0; opacity: 0.5; }

#right .post-single {
  margin: 0 0 30px;
}

#right .post-single .page-header {
  margin: 0 0 20px;
  padding: 0;
}

#right .post-single h2 {
  margin: 0 0 15px;
  padding: 0;
}

#right .post-single h3 {
  margin: 0 0 15px;
}

#right .post-single h4 {
  margin: 0 0 0;
}

#right .post-single p {
  margin: 0 0 40px;
}

a.howtouse:link ,
a.howtouse:active ,
a.howtouse:visited ,
a.howtouse:hover ,
.ryokan-name a:link ,
.ryokan-name a:active ,
.ryokan-name a:visited ,
.ryokan-name a:hover ,
#right .post-single p a:link ,
#right .post-single p a:active ,
#right .post-single p a:visited ,
#right .post-single p a:hover ,
.ryokan-text a:link, #ryokan-right a:link ,
.ryokan-text a:active , #ryokan-right a:active ,
.ryokan-text a:visited, #ryokan-right a:visited ,
.ryokan-text a:hover, #ryokan-right a:hover {color: #7bb261;text-decoration: none;}
.other-useful-websites a:link  {color: #666;text-decoration: none;}
.other-useful-websites a:active {color: #666;text-decoration: none;}
.other-useful-websites a:visited {color: #666;text-decoration: none;}
.other-useful-websites a:hover {color: #999;text-decoration: none;}

#right .post-single ul,
#right .post-single ol {
  margin: 0 0 40px 20px;
}

#right .post-single ul.note {
  margin: 0 0 40px 0;
}

#right .post-single ul.note2 {
  margin: 0 0 0;
}

#right .post-single ul li {
  margin: 0 0 5px;
  padding: 0;
  list-style: disc;
}

#right .post-single ol li {
  margin: 0 0 10px;
  padding: 0;
  list-style: decimal;
}

#right .post-single .note li,
#right .post-single .note2 li {
  text-indent: -1em;
  padding: 0 0 0 1em;
  list-style: none;
  color: #777;
}

#right .ryokan-list .articleWrap article h3 {
  text-align: center;
  color: #333;
  text-decoration: underline;
  margin: 0 0 5px;
  padding: 0;
}

.cat-description{
  color: #555;
  font-size: 13px;
  padding: 0 0 25px;
}

/* wp-pagenavi */

.wp-pagenavi{
  padding-top: 20px;
  text-align: left;
}
.wp-pagenavi span,.wp-pagenavi a {
  display: inline-block;
  padding: 7px 8px;
  font-size: 14px;
  line-height: 1;
  color: #7bb261;
  margin: 0 10px 10px 0;
  border-top: 1px #e8e8e8 solid;
  border-right: 1px #e8e8e8 solid;
  border-left: 1px #e8e8e8 solid;
  border-bottom: 3px #DDD solid;
  background: #fff;
	border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}
.wp-pagenavi a:hover {
  background: #EEE;
}
.wp-pagenavi span.current {
  border-top: 1px #57933b solid;
  border-right: 1px #57933b solid;
  border-left: 1px #57933b solid;
  border-bottom: 3px #57933b solid;
	background: #7bb261;
  color: #fff;
}

/****************************************

          ryokan-name

*****************************************/


#right .ryokan-name .articleWrap {
  margin: 0 0 40px;
}

#right .ryokan-name .articleWrap h2 {
  margin: 0 0 5px;
	padding:10px;
	background-color: #f6f6f6;

	/* border-radius */
	border-radius: 4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;

	/* box-shadow */
	box-shadow:rgb(232, 232, 231) 0px 0px 4px 1px inset;
	-webkit-box-shadow:rgb(232, 232, 231) 0px 0px 4px 1px inset;
	-moz-box-shadow:rgb(232, 232, 231) 0px 0px 4px 1px inset;
}

#right .ryokan-name h3 {
  margin: 0 0 10px;
	padding:10px;
	font-size: 16px;
  background: url(img/line2.png) repeat-x left bottom;

}

#right .ryokan-name h4 {
  margin: 0 0 5px 10px;
}

#right .ryokan-name li {
  margin: 0 0 5px 32px;
  list-style: square;
}

#right .ryokan-name ul.ryokan-name-list li { margin: 0 5px 5px 0; list-style: none; }
#right .ryokan-name h4 a { color: #5580b3; }
.ryokan-name .articleWrap ul { margin: 0 0 20px; }
.ryokan-name .ryokan-name-ico { display: inline-block; width: 11px; height: 11px; margin: 0 5px 0 0; background: url(img/btn_arrow_right_blue.png) no-repeat left center; }

/****************************************

          RANKING

*****************************************/

#pop-ranking.ranking-post .image{
  margin: 0 20px 0 0;
  float: left;
}
#pop-ranking.ranking-post article{
  margin: 0 ;
  padding: 25px 0 ;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #EEE;
}
#pop-ranking.ranking-post article:first-child{ border-top: none; }
#pop-ranking.ranking-post article:last-child{ border-bottom: none; }
#pop-ranking.ranking-post article h3{
  font-size: 1.3em;
  padding: 5px 0;
  margin: 0;
  letter-spacing: 0;
}
#pop-ranking.ranking-post article h3 a{
  color: #333333;
}
#pop-ranking.ranking-post article { margin: 0; }
#pop-ranking.ranking-post article a.readmore{
  font-size: 0.7rem;
  display: inline-block;
  margin: 15px 0 0;
  padding: 3px 5px;
  background: #5580b3;
  color: #ffffff;
  text-align: center;
  letter-spacing: 1px;
  text-shadow: none;
  border-radius: 2px;
  -webkit-border-radius: 2px;
}
#pop-ranking.ranking-post article a.readmore img {
  margin-right: 5px;
}
.ranking-tag { margin-left: 225px; }
@media screen and (max-width: 480px) {
  .ranking-tag { margin-left: 0; }
}

/****************************************

          Inquiries about our website

*****************************************/

.form-inner { margin: 0 0 40px; }
.wpcf7 dl {
  clear: both;
  width: 100%;
  font-size: 14px;
}
.wpcf7 dl dt {
  float: left;
  width: 30%;
  padding: 10px 5% 10px 0;
  text-align: right;
}
.wpcf7 dl dd {
  float: left;
  width: 59%;
  padding: 10px 0 10px 5%;
  border-left: 1px #ddd solid;
}
.wpcf7 dl dt span,
.wpcf7-not-valid-tip,
.wpcf7-validation-errors {
  color: #e03d30;
}
.wpcf7-validation-errors { margin: 0 0 20px; }
.submit-inner {
  text-align: center;
  margin: 0 0 40px;
}
.wpcf7 .text input,
.wpcf7 .text textarea{
  width: 95%;
  color: #666;
  font-size: 13px;
  border: none;
  outline: none;
  border: 1px solid #EEE;
  border-top: 3px #EEE solid;
  border-radius: 6px;
  padding: 10px 10px;
}
.screen-reader-response { color: #e03d30; }
.screen-reader-response ul { display: none; }


/****************************************

          PAGES

*****************************************/

#right .page-header h1{
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 1px;
}

#right .ranking-header{
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 1px;
  margin-bottom: 20px;
}



#page-top{
  width: 48px;
  height: 175px;
  position: fixed;
  bottom: 200px;
  right: 0;
  z-index: 100;
  display: none;
}
#page-top a{
  width: 48px;
  height: 175px;
  display: block;
  background: url(img/parts.png) -360px 0 no-repeat;
}

.error404 h1,
.error404 .entry{
  text-align: center;
}


/****************************************

          FOOTER

*****************************************/

footer { background:url(img/bg_footer.png); }

footer #inner {
	position: relative;
	margin:0 auto;
	width:1080px;
	height: 440px;
}

footer #inner a:link {color:#818181; text-decoration:underline;}
footer #inner a:active {color:#818181; text-decoration:underline;}
footer #inner a:hover {color:#666666; text-decoration:underline;}
footer #inner a:visited {color:#666666; text-decoration:underline;}

footer #inner .navi0 {
	width:758px;
	position: absolute;
	top: 0;
	left: 0;
	border-right:1px solid #363636;
}

footer #inner .navi01,
footer #inner .navi02,
footer #inner .navi03  {
	padding:30px 0px;
	border-right:1px solid #0e0e0e;
	border-bottom:1px solid #0e0e0e;
	justify-content:center;
}

footer #inner .navi01 .logo {
  float: left;
  margin-right: 30px;
}

footer #inner .navi01 ul ,
footer #inner .navi02 ul ,
footer #inner .navi03 ul {
	flex-wrap:wrap;
	align-items:center;
}

footer #inner .navi01 li ,
footer #inner .navi02 li ,
footer #inner .navi03 li {
	display: inline-block;
	padding:0 20px;
	margin:0 0 4px 20px;
	background:url(img/btn_arrow_gray.png) no-repeat left center;
}

footer #inner .navi01 li.tit ,
footer #inner .navi02 li.tit ,
footer #inner .navi03 li.tit {
	display: inline-block;
	padding:0 20px 0 0;
	margin:0 0 4px 20px;
	background: none;
	color:#818181;
}

footer #inner .navi01 li.tit :hover,
footer #inner .navi02 li.tit :hover ,
footer #inner .navi03 li.tit :hover {
  opacity: 1;
}


footer #inner .navi03 li {
	background:url(img/btn_arrow_blank.png) no-repeat left center;
}

footer #inner .navi02,
footer #inner .navi03 {
	border-top:1px solid #363636;
	border-bottom:1px solid #0e0e0e;
}

footer #inner .about-the-site {
	padding:30px 20px 10px 20px;
	color:#818181;
	border-right:1px solid #0e0e0e;
	border-top:1px solid #363636;
}

footer #inner .copy {
	padding:10px 0px 30px 20px;
	color:#818181;
	border-right:1px solid #0e0e0e;
}

/* ------ FACEBOOK ------ */

footer #inner .facebook {
	width:290px;
	padding:20px 0 30px 30px;
	border-left: none;
	position: absolute;
	top: 0;
	right: 0;
}

footer #inner .facebook h4 {
  width: 111px;
  height: 30px;
	margin-bottom:15px;
  background: url(img/parts.png) -135px -165px no-repeat;
}

footer #inner .facebook .pluginBoxDivider{ border-top: 1px solid #424447; }



/****************************************

          TABLET

*****************************************/


@media screen and (min-width: 1080px) {
  header#toppage{ background: url(img/yuge.gif) repeat-x center top #252525; }
  #right .info-post h1{ float: left; }
  #seach_box .articleWrap { display: block !important; }
  footer{ background: url(img/yuge.gif) bottom center repeat #000; }
  footer #inner .navi0{ border-right: 1px solid #1f1f1f; }
  footer #inner .navi02,
  footer #inner .about-the-site{ border-top: 1px solid #1f1f1f; }
}
@media screen and (max-width: 1079px) {

  .home #toolbarWrap { border-bottom: 3px solid #57933b; }
  #right h2{ text-align: center; display: inline-block; }
  #right .ryokan-name h4 { margin: 0 0 10px 0; }
  #right .ryokan-name li {
    margin: 0 0 10px 0;
    list-style: none;
  }
	header{
    padding: 75px 0 0;
		background:none;
		height:auto;
		/* box-shadow */
		box-shadow:none;
  }
  header#toppage{ border: none; }
  header#bottom_page{
    width: 100%;
    height: auto;
    float: none;
    background: none;
    box-shadow: none;
    padding: 35px 0 0;
  }

	#toolbarWrap{
		width: 100%;
		background:#7bb261;
		color:#FFF;
		border-bottom: 3px solid #57933b;
		height:40px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 105;
	}
	#toolbar{
		width: 100%;
		margin:0 auto;
		padding-top:5px;
	}
	#toolbar p.copy{ display: none; }
  #sp_search,
  #sp_menu{ display: block; }

  header nav{ display: none; }

  #toolbar p.btn_sitemap, #toolbar p.btn_about { padding: 0 0 0 10px; margin: 0; float: left; }
  #toolbar p a.sitemap span.txt,
  #toolbar p a.Inquiries span.txt{ display: none; }
  #toolbar .btn_language{ width: 130px; float: left; margin: 0 0 0 10px; }
  .la-list{
    width: 130px;
    margin-left: -65px;
  }
  
  #contents{ padding-top: 43px; }
  .home #contents{ padding-top: 0; }
  
	#headerInner{
	  width: 100%;
		margin: 0 auto;
		padding: 0;
	}
	header #gl_navi{
		float:none;
    width: 100%;
		height:auto;
		min-height:100%;
		background: none;
		/* box-shadow */
		box-shadow: none;
	}
  header#bottom_page #gl_navi{ margin: 0 0 10px; }
  header#toppage #gl_navi{ margin: 0 0 20px; }
  header #gl_navi #logo{
    width: 250px;
    height: 59px;
    margin: 0 auto;
  }
  header #gl_navi #logo a{
    width: 250px;
    height: 59px;
    background: url(img/parts.png) 0 0 no-repeat;
    display: block;
  }
	header nav ul{
		padding:28px 5px 0 5px;
		justify-content:space-between;
	}
	header nav li{
    width: 23%;
    height: auto;
    float: left;
    margin: 0 1%;
		background: none;
    text-align: center;
		letter-spacing: 1px;
	}
	header nav li a{
		max-height:28px;
		padding: 0 0 10px;
		display:block;
		font-size:12px;
		color:#000;
	}
	header nav li.ryokan a,
	header nav li.what a,
	header nav li.ranking a,
	header nav li.about a{ line-height: 1.5; background: none; }
	header nav li.ryokan a{ border-bottom:3px solid #5781b1; }
	header nav li.ranking a{ border-bottom:3px solid #59b278; }
	header nav li.what a{ border-bottom:3px solid #b15c57; }
	header nav li.about a{ border-bottom:3px solid #9eb25b; }

	/* ------ SLIDER ------ */

  .slider { float: none; width: 100%; height: auto; padding: 15px 0 0; background: url(img/bg-slider.png) repeat left top; /* box-shadow */ box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -webkit-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
  -moz-box-shadow:rgba(0, 0, 0, 0.100000) 0px 0px 4px 1px inset;
   border-top: 4px solid #DDD; border-bottom: 4px solid #DDD; }
  .slider .bx-wrapper{ margin: 0; }
  .slider .bx-wrapper li img{ width: 100%; }
  .slider a:hover img { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
  .slides li a { overflow: hidden; display: block; width: 100%; }
  .bg_img { padding: 4px 0 0; }
  .slides { text-align: center; min-width: 100%; }
  .bx-controls-direction{ display:none; }
  .bx-pager { width: 100%; margin: 0; overflow: hidden; }
  .slider .bx-wrapper{ margin: 0; }
  .slider .bx-wrapper li img{ width: 100%; }
  .bx-pager{ text-align: center; padding-top: 5px; }
  .bx-pager li{ width: 19px; text-align: center; display: inline-block; float: none; margin: 0; }
  .bx-pager li a{ display: block; width: 17px; height: 17px; background: url(img/parts2x.png) -267px 0 no-repeat; background-size: 800px 800px; margin: 0 auto; }
  .bx-pager li a img{ display: none; }
  .bx-pager li a.active{ background-position: -250px 0; }
  #contentsWrap, #contents{ width: 100%; }

  /* ------ SEARCH BOX ------ */

  header#bottom_page .box.tags,
  header#bottom_page .box#seach_box{
    width: 96%;
    margin: 0 2% 20px;
  }
  header#bottom_page .box#seach_box{
    padding: 0;
    margin-bottom: 0;
  }
  header#bottom_page .box#seach_box h3#tit-searchbox{ padding: 10px 0; }
  header#bottom_page .box#seach_box hr.pencil{ margin: 0 15px 15px; }
  #seach_box .wrap-category {
    width: 100%;
    top: 30px;
    left: 50%;
    margin-left: -50%;
  }
  #seach_box .articleWrap{ display: none; margin: 0 15px 10px; }
  #seach_box .articleWrap article{
    width: 23%;
    margin: 0 1% 15px;
    float: left;
  }
  #seach_box .articleWrap article.icon_serch_5{ clear: both; }
  #search-form{ display: none; }
  

  /* ------ AD TEXT AREA ------ */

  #contents .other-useful-websites { display: none; }
  #contents .other-useful-websites ul { flex-wrap:wrap; justify-content:space-between; }

  /* ------ RIGHT ------ */

	#right {
    width: 100%;
		float:none;
		padding-bottom:50px;
	}

  #right hr{ margin: 35px 0; }

  #right .search,
	#right .articleWrap { width: 100%; }
	#right .search,
  #right .information { text-align: center; }

  .topicPath{ text-align: center; }
  .tit-wrap{
    text-align: center;
    display: inline-block;
    margin: 0 auto 5px;
  }

  #right .search article.icon_serch_1,
  #right .search article.icon_serch_2{
    width: 48%;
    margin: 0 1% 15px;
  }
  #right .search article.icon_serch_3{
    margin: 0 1% 15px;
  }
  #right .search article{
    width: 23%;
    margin: 0 1% 15px;
  }

  #right .information .articleWrap article,
  #right .information .articleWrap article:nth-child(3n+1){
    width: 28.3333%;
    margin: 0 2.5% 15px;
    text-align: left;
  }

  #right .search article img.ico-search{ width: 90%; margin: 0 5%; }
  #right .search article.icon_serch_1 img.ico-search,
  #right .search article.icon_serch_2 img.ico-search{ margin: 0; }
  #right .information .articleWrap article .image img{
    width: 90%;
    margin: 0 5% 10px;
  }

  .article-cat{ float: none; }


	/* ------ LEFT ------ */

	#left {
		float:none;
		width: 100%;
		padding-bottom:35px;
	}
  #left .box{ border-radius: 0; }

  #left .box#pop-ranking { padding-top: 30px; }
  #left #pop-ranking h2{
    width: 191px;
    height: 30px;
    background: url(img/parts.png) -135px -59px no-repeat;
  }
  #left #pop-ranking .articleWrap{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
  }
  #left #pop-ranking article{
    width: 28.3333%;
    margin: 0 2.5% 15px;
    padding: 0;
    text-align: left;
    float: left;
  }
  #left #pop-ranking article .image{
    width: 90%;
    margin: 0 5%;
  }
  #left #pop-ranking article .image img{ width: 100%; }
  #left #pop-ranking article p{ display: none; }


  .info-post{ text-align: center; }

  .ryokan-cat-link,
  #gl_nav_s,
  #pc-sidebar,
  .badge{ display: none; }


  /* ------ PHOTO GALLERY ------ */

	#gallery {
		clear:both;
		width:100%;
    min-width: 100%;
	}

  /* ------ RYOKAN SINGLE ------ */
  .ryokan-text{ width: 55%; }
  #ryokan-right { width: 38%; }


  /* ------ COMMON ------ */

  .entry-inner {
    width: 96%;
    margin: 0 2%;
  }
  .single-ryokan .entry-inner {
    width: 100%;
    margin: 0;
    padding: 20px 0 0;
  }
  .single-ryokan .topicPath,
  .single-ryokan .ryokan-header{
    width: 94%;
    margin-right: 3%;
    margin-left: 3%;
  }
  .ryokan-content{
    width: 94%;
    margin: 0 3%;
  }

  #right .page-header h1{ display: inline-block; }
  .slid-image{
    position: relative;
	  width: 100%;
	  height: auto;
  	text-align: center;
  }
  .slid-caption{ display: none; }
  .gallery-slides .slid img{
	  width: 100%;
	  height: auto;
  }
  
  .wp-pagenavi{ text-align: center; }
  .wp-pagenavi span,
  .wp-pagenavi a { margin: 0 5px 10px; }


  /* ------ RANKING ------ */

  #right .ranking-header h1 { display: inline-block; }

	/* ------ other-useful-websites ------ */

  .other-useful-websites {
    width: 100%;
    margin: 0 0 30px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;

  }

	/* ------ BANNER AREA ------ */

	#bannerArea {
		width: 100%;
		margin:0 auto 30px;
	}
	#bannerArea img {
		width: 100%;
		margin: 0;
	}


	/* ------ FOOTER ------ */

	footer #inner {
		position: relative;
		margin:0 auto;
		width: 100%;
    height: auto;
	}

	footer #inner .navi0 {
		width: 100%;
		position:static;
		border-right:none;
    border-top: 1px solid #363636;
	}

	footer #inner .navi01,
	footer #inner .navi02,
	footer #inner .navi03  {
		padding:30px 20px;
		border-right:none;
		border-bottom:1px solid #0e0e0e;
		justify-content:center;
	}

	footer #inner .navi01 .logo { display: none; }

	footer #inner .navi01 ul ,
	footer #inner .navi02 ul ,
	footer #inner .navi03 ul {
		flex-wrap:wrap;
		align-items:center;
	}

	footer #inner .navi01 li ,
	footer #inner .navi02 li ,
	footer #inner .navi03 li {
		display: inline-block;
		padding:0 0 0 20px;
		margin:0 0 4px 10px;
		background:url(img/btn_arrow_gray.png) no-repeat left center;
	}

  footer #inner .navi01 li.tit ,
	footer #inner .navi02 li.tit ,
	footer #inner .navi03 li.tit {
		display: inline-block;
		padding:0 0 0 20px;
		margin:0 0 4px -10px;
	}

	footer #inner .navi02,
	footer #inner .navi03 {
		border-right:none;
		border-top:1px solid #363636;
		border-bottom:1px solid #0e0e0e;
	}

	footer #inner .copy {
		padding:15px 20px;
		color:#818181;
	}


	/* ------ FACEBOOK ------ */

	footer #inner .facebook {
		position: static;
    width: 100%;
		padding:20px 0 30px;
		border-left:none;
    border-bottom: 1px solid #0e0e0e;
	}
  .facebook-inner{ padding: 0 30px; }

  footer #inner .facebook .fb-like-box,
  footer #inner .facebook span,
  footer #inner .facebook iframe{
    width: 100% !important;
  }

	footer #inner .facebook .pluginBoxDivider {
		border-top: 1px solid #424447;
	}


}


@media screen and (max-width: 840px) {
  .tit-wrap .howtouse { display: block; position: relative; top: 0; right: 0; margin-bottom: 10px; }
  .entry-inner{
    clear: both;
    float: none;
    width: auto;
    margin: 0 0 20px;
    padding: 20px 10px 0;
    text-align: center;
  }
  .single-ryokan .entry-inner{ text-align: left; }
	
  .ryokan-text,
  .ryokan-address,
  .reated-articles,
  #ryokan-right{
    clear: both;
    float: none;
    width: auto;
    margin: 0 0 20px;
    padding: 20px 0 0;
    text-align: center;
  }
  .tripadvisor { text-align: center; }
  .entry-inner article,
  .ryokan-text article,
  article,
  .ryokan-address article,
  .reated-articles article,
  .reserve-box{ text-align: left; }
  .ryokan-text { padding: 0; }
  .ryokan-address { padding: 20px 0 0; }
  .reated-articles { padding: 20px 0 0; }
  #contents .ryokan-category li.ico{
    display: inline-block;
    float: none;
  }

}

/****************************************

          SMART PHONE

*****************************************/


@media screen and (max-width: 769px) {

  header nav li{ letter-spacing: 0; }
  #right .search article.icon_serch_1,
  #right .search article.icon_serch_2{   width: 48%;   margin: 0 1% 15px; }
  #right .search article.icon_serch_3{ clear: both; }
  #right .search article, #right .search article.icon_serch_3{   width: 30.3333%;   margin: 0 1.5% 15px; }
  #seach_box .articleWrap article{  width: 30.3333%;   margin: 0 1.5% 15px; }
  #right .search article.icon_serch_6{ clear: both; }
  .slides li a { height: auto; }
  }

@media screen and (max-width: 640px) {

  #right h2{ font-size: 1rem; text-align: center; display: inline-block; }
  #right .search article,
  #right .search article.icon_serch_3{
    width: 47%;
    margin: 0 1.5% 15px;
  }
  #right .search article:nth-child(3n+1),
  #right .search article:nth-child(4n+1),
  #right .search article.icon_serch_6 { clear: none; }

  #right .search article.icon_serch_1 p,
  #right .search article.icon_serch_2 p { padding-top: 0; }

  #right .search article.icon_serch_1,
  #right .search article.icon_serch_2 { text-align: center; }
  #right .search article.icon_serch_1 img.ico-search,
  #right .search article.icon_serch_2 img.ico-search { float: none; }
  #right .search article.icon_serch_1 p, #right .search article.icon_serch_2 p {
    margin: 0;
    padding: 0 10px 5px;
  }

  #seach_box .articleWrap article{
    width: 47%;
    margin: 0 1.5% 15px;
  }
  #seach_box .articleWrap article.icon_serch_4{ clear: none; }
  #seach_box .articleWrap article.icon_serch_5{ clear: none; }

  #right .information .articleWrap article,
  #right .information .articleWrap article:nth-child(3n+1){
    width: 95%;
    text-align: left;
    margin: 0 2.5% 30px !important;
  }
   .main-image,
  .main-image-s{
    border: none;
    background: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    margin: 0;
  }
  #right .information .articleWrap article .image img,
  .main-image img,
  .main-image-s img
  .single .reated-articles .main-image img,
  .single .reated-articles .main-image-s img{
    width: 25%;
    margin: 0 0 10px;
    float: left;
    border: 4px solid rgb(255, 255, 255);
    box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
    -webkit-box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
    -moz-box-shadow: rgba(216, 216, 216, 0.74902) 0px 0px 3px 1px;
  }
  .single #right .information .articleWrap article .image img,
  .single .main-image img,
  .single .main-image-s img{
    width: 100%;
    border: none;
    margin: 0 0 20px;
  }
  
  #right .ryokan-list .articleWrap article h3,
  #right .information.ryokan-list .articleWrap article .text p,
  #right .ryokan-list .articleWrap ul.location,
  #right .ryokan-list .tags.no-link ul,
  #right .information .articleWrap article p.update,
  #right .information .articleWrap article h3,
  #right .information .articleWrap article p,
  #right .information .articleWrap article a.readmore{
    text-align: left;
    padding: 0;
    margin: 0 0 0 32%;
  }


  #right .information .articleWrap article p.update{ font-size: 10px; margin-bottom: 5px; }
  #right .information .articleWrap article h3{ font-size: 0.9rem; }
  #right .information .articleWrap article .text{ margin-bottom: 10px; padding-bottom: 0; font-size: 11px; }
  #right .information .articleWrap article a.readmore{
    text-align: left;
    display: inline-block;
    padding: 3px 8px;
  }
  .ico-related{ text-align: left; margin: 0 0 0 32%; }

  #left #pop-ranking .articleWrap{
    display: block;
  }
  #left #pop-ranking article{
    width: 90%;
    margin: 0 5% 20px;
    float: none;
    clear: both;
  }

  #right .ranking-header{ margin: 0; }
  #right .ranking-header h1{ display: inline-block; }


  .ryokan-header{ margin: 0 0 0; }
  .single-ryokan .entry-inner{ text-align: center; }
  #sns-list,
  .single-ryokan #sns-list{
    position: relative;
    text-align: center;
    margin: 0 0 15px;
  }
  #right h1 {
    margin: 0 0 15px;
    font-size: 18px;
  }
  #right .ryokan-header h1{ line-height: 1.6; padding-right: 0; }
  .gallery-slides .slid,
  .slid-caption p {
    position: relative;
    bottom: 0;
    left: 0;
    padding: 5px;
    color: #fff;
    width: 100%;
    background: none;
    opacity: 1.0;
  	filter: alpha(opacity=100);
  	-ms-filter: "alpha(opacity=100)";
  }
  .slid-caption:hover p {
  	opacity: 1.0;
  	filter: alpha(opacity=100);
  	-ms-filter: "alpha(opacity=100)";
  }

  .ryokan-logo{
    float: none;
    margin: 0;
  }
  .gallery-bx-pager{ text-align: center; }
  .gallery-bx-pager li{
    width: 19px;
    text-align: center;
    display: inline-block;
    float: none;
    margin: 0;
  }
  .gallery-bx-pager li a{
    display: block;
    width: 17px;
    height: 17px;
    background: url(img/parts.png) -267px 0 no-repeat;
    margin: 0 auto;
  }
  .gallery-bx-pager li a img{ display: none; }
  .gallery-bx-pager li a.active{ background-position: -250px 0; }

  #bannerArea li{
    width: 90%;
    float: none;
    margin: 0 auto 10px;
  }

  #page-top{
    width: 175px;
    height: 48px;
    position: relative;
    bottom: 0;
    right: 0;
    z-index: 100;
    margin: 0 auto
  }
  #page-top a{
    width: 175px;
    height: 48px;
    display: block;
    background: url(img/parts.png) -360px -175px no-repeat;
  }
  .wpcf7 dl dt {
    float: none;
    width: 100%;
    padding: 10px 0 0;
    text-align: left;
  }
  .wpcf7 dl dd {
    float: none;
    width: 100%;
    padding: 0 0 10px;
    border-left: none;
    border-bottom: 1px #EEE solid;
  }
  .wpcf7 dl dd.submit-block {
    padding-top: 15px;
    text-align: center;
  }
  div.wpcf7 img.ajax-loader {
    width: auto;
    height: auto;
  }
}

@media screen and (max-width: 480px) {

  #right .search article,
  #right .search article.icon_serch_1,
  #right .search article.icon_serch_2,
  #right .search article.icon_serch_3,
  #seach_box .articleWrap article{
    width: 95%;
    margin: 0 2.5% 15px;
  }

  #right .search article .btn-select-cat{ padding: 6px 10px 2px; }
  #right .search article img.ico-search{
    width: 30%;
    margin: 0 2% 5px;
    float: left;
  }

  #right .search article.icon_serch_1,
  #right .search article.icon_serch_2 { text-align: left; }
  #right .search article.icon_serch_1 img.ico-search,
  #right .search article.icon_serch_2 img.ico-search {
    width: 30%;
    margin: 0 2% 5px;
    float: left;
  }
  #right .search article.icon_serch_1 p, #right .search article.icon_serch_2 p {
    padding: 5px 10px 10px 0;
    margin-left: 33%;
  }

  #right .search article.icon_serch_3 .btn-select-cat,
  #right .search article.icon_serch_4 .btn-select-cat,
  #right .search article.icon_serch_5 .btn-select-cat,
  #right .search article.icon_serch_6 .btn-select-cat{ margin: 0; }
  #right .search article p{
    text-align: left;
    min-height: 20px;
  }
  .select-cat{
    clear: none;
    text-align: left;
  }
  #right .search article.icon_serch_1 .select-cat,
  #right .search article.icon_serch_2 .select-cat{ text-align: center; }
  .wrap-category {
    width: 100%;
    left: 50%;
    margin-left: -50%;
  }

  #right h1 .small{
    display: block;
    padding: 10px 0 0 0;
  }

  #pop-ranking.ranking-post article{
    width: 90%;
    text-align: center;
    padding: 25px 5%;
  }
  #pop-ranking.ranking-post .image{
    margin: 0 0 5px;
    float: none;
  }
  #pop-ranking .image img{ width: 100%; }
  #pop-ranking.ranking-post article h3{ text-align: center; }
  #gallery .tit-wrap h2{ padding-right: 0; display: block; margin: 0 0 15px; }
  #pop-ranking.ranking-post { margin: 0 0 10px; }
  #pop-ranking .tags.no-link ul{
    padding: 10px 0 0;
    text-align: center;
  }
  #pop-ranking.ranking-post ul.location{ text-align: center; }
  #pop-ranking.ranking-post ul.location li{ padding: 0 4px; }
  #pop-ranking .tags.no-link ul li{ margin: 0; }

  .gallery-slides .slid img{
	  width: auto;
	  height: auto;
    max-width: 100%;
    max-height: 230px;
  }

  .entry img{
    clear: both;
    float: none;
    width: 95%;
    height: auto;
    margin: 10px 2% 20px
  }
  .acf-map{ height: 250px; }

  footer #inner .navi01 li,
	footer #inner .navi02 li{ display: block; }
	.other-useful-websites ul { padding: 20px 15px 15px; }
	.other-useful-websites ul li {
  	display: block;
  	text-align: left;
	}
	.other-useful-websites ul li.tit { padding:0 0 0 10px; }
  footer #inner .copy{ padding: 30px 10px; font-size: 0.5rem; text-align: center; letter-spacing: 1px; }
  .other-useful-websites li{ display: block; }
}



/****************************************

          RETINA DISPLAY

*****************************************/

@media (-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 2dppx),
(-webkit-min-device-pixel-ratio: 1.5),
only screen and (max-width: 999px) {
  header #gl_navi #logo a,
  #toolbar p a.sitemap span.ico,
  #toolbar p a.Inquiries span.ico,
  #contents .ryokan-category li.ico,
  #sp_menu a,
  #left #pop-ranking h2,
  #left article .image span,
  .gallery-bx-pager li a,
  footer #inner .facebook h4,
  span.ico,
  #pop-ranking .image span,
  #sp_menu span,
  #sp_search span,
  .btn-close span,
  #page-top a,
  #sns-list li a.facebook,
  #sns-list li a.twitter,
  #sns-list li a.googleplus,
  .ico-related-photo,.ico-related-ryokan,.ico-related-info, {
    background-image: url(img/parts2x.png) !important;
    background-size: 800px 800px !important;
  }
  li.reserve-button ul.knt { 
    background-image: url(img/logo-knt2x.png) !important;
    background-size: 110px 26px !important;
  }

  li.reserve-button ul.japanican { background-image: url(img/logo-japanican2x.png) !important;
    background-size: 110px 26px !important;
  }

  li.reserve-button ul.nta { background-image: url(img/logo-nta2x.png) !important;
    background-size: 110px 26px !important;
  }

  li.reserve-button ul.other { background-image: url(img/logo-other2x.png) !important;
    background-size: 110px 26px !important;
  }

  li.reserve-button ul.official { background-image: url(img/logo-official2x.png) !important;
    background-size: 110px 26px !important;
  }

}

/****************************************

          promotion

*****************************************/

.ad-image { position: relative; overflow: hidden; }
.ad-image:after {
  content: "Ad"; /* 表示するテキストをここで変えます */
  position: absolute;
  left: -60px;
  top: -5px;
  width: 100px;
  height: auto;
  padding: 20px 20px 10px;
  background: #fff;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  color: #e25d76;
  text-shadow: none;
  -webkit-transform: rotate(-45deg);  /* Safari,Chrome用 */
  -moz-transform: rotate(-45deg); /* Firefox用 */
  -o-transform: rotate(-45deg);  /* Opea用 */
  transform: rotate(-45deg); /* CSS3 */
}

@media screen and (max-width: 640px) { 
	.ad-image { float: left; width: 25%; }
	.ad-image img { width: 100%; border: 0; }
}