body{
	 
	  overflow-x: hidden;
	  color:#333333;
	  /*font-family: Tahoma, Arial;
	  font-size:14px;*/
	  
	  font-family: 'Conv_db_helvethaica_x55';
	  font-size:20px;
	  
	  line-height:22px;
	  background:url(../img/bg.png);
	  
	   -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
 
}
a{  
	-webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
::-moz-selection {
	background: #333333;
	color: white;
	text-shadow: none;
}

::selection {
	background: #333333;
	color: white;
	text-shadow: none;
}


.upper{ text-transform:uppercase}

.green{ color:#00a453}
.white{ color:#fff !important}
.orange{ color:#e69d37}
.blue{ color:#4385a5}
.brown{ color:#743605}
.black{ color:#414141}
.gray{ color:#333333}
.red{ color:#e20a17}
.red2{ color:#c3222e}
.star{ color:#e50707}
.bold{ font-weight:bold}

a.orange{ color:#e69d37}
a.blue{ color:#4385a5}
a.brown{ color:#97866b}
 

.font10{ font-size:10px;}
.font11{ font-size:11px;}
.font12{ font-size:12px; line-height:18px;}
.font13{ font-size:13px; line-height:16px;}
.font14{ font-size:14px;}
.font15{ font-size:15px;}
.font16{ font-size:16px;}
.font17{font-size:17px;}
.font18{ font-size:18px;}
.font20{ font-size:20px;}
.font21{ font-size:21px;}
.font22{ font-size:22px;}
.font24{ font-size:24px; line-height:24px}
.font26{ font-size:26px}
.font28{ font-size:28px;}
.font30{ font-size:30px}
.font32{ font-size:32px}
.font34{ font-size:34px;}
.font36{ font-size:36px; line-height:40px}
.font40{ font-size:40px; line-height:40px}
.font48{ font-size:48px; line-height:40px}
.font50{ font-size:50px;}

.img_fullwidth{ width:100%}
.text_top{ vertical-align:top; top:3px; position:relative;}
 


b, strong{ font-weight:700}
h1,h2,h3,h4{ 
	font-weight:normal; 
	line-height:25px;
	font-size:16px;
	color:#333333;
	font-family:'HelveticaNeueLTStd-Bd'; /*HelveticaNeueLTStd-Md*/
}
 
.button{
	display:inline-block;
	width:auto;
	padding:0 20px;
	height:35px;
	width:auto;
	color:#fff;
	line-height:25px;
	text-align:center;
	position:relative;
	background-color:#808080;
	font-family: 'HelveticaNeueLTStd-Roman';
	font-size:17px;
 	
	-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
		 
}
 
.button:hover{ 
	color:#fff;
	background-color:#000;
	text-decoration:none
}

button.button{
	border:0px;
	padding-top:0px;
	height:35px;
	display:inline-block;
	display:table-cell;
	
		-webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.button.large{
	font-size:24px;
	padding-left:40px;
	padding-right:40px;
	padding-top:1px;
	height:37px;
}
 
.button.gray{background-color:#4c4c4c;}
.button.gray:hover{ background-color:#333}
button.button.disable{display:none;}

a.button{
	line-height: 33px;
    padding: 0 20px;
	color:#ffffff;
}
 
.button + .button{ margin-left:5px}
.buttons .spaceL{ width:5px; display:table-cell; height:10px}
.buttons{
	display:block;
	margin:10px 0 10px;
}
 
.nomargin_bottom{ margin-bottom:0 !important}

 
.icons{
	display:inline-block;
	position:relative;
	vertical-align:top;
	background-image:url(../img/icons.png);
	background-repeat:no-repeat;
}

.icon_ig{
	width:18px;
	height:18px;
	background-position:0 0;
}
.icon_fb{
	width:19px;
	height:18px;
	background-position:-21px 0;
}
.icon_tw{
	width:19px;
	height:18px;
	background-position:-41px 0;
}

   
   
           
   
.show-phone-small{ display:none}    

.page{ 
	height:100%;
	width:100%;
	min-height:600px
} 

header{
	display:block;
	width:100%;
	height:105px;
	background-color:#fff;
}  
.body{
	width:100%;
	float:left;
	margin-top:30px;
}

.logo_site a{
	float:left;
	width:140px;
	height:87px;
	margin-top:5px;
	background:url(../img/logo.jpg) 0 0 no-repeat;
	
	-webkit-transition:none;
       -moz-transition:none;
         -o-transition:none;
        -ms-transition:none;
            transition:none;
}

.lang{
	float:left;
	font-family: 'db_helvethaica_x75_bd';
	font-size:16px;
	margin-top:10px;
}
.lang a { 
	padding:0 3px; 
	display:inline-block; 
	line-height:12px;
}
.lang a.active{ color:#333333}
.lang .en{
	padding-left:4px;
	border-left:1px solid #999999;
	font-size:14px
}

.follow{
	float:right;
	margin-top:12px;
}
.follow .icons{
	margin-left:5px;
	position:relative;
	top:0;
	opacity: 0.5; 
	filter:alpha(opacity=50); 
	
}
.follow .icons:hover{
	opacity: 1; 
	filter:alpha(opacity=100);
}

 
.nav-parallax{
	-webkit-transition: all 0.2s ease-in-out;
       -moz-transition: all 0.2s ease-in-out;
         -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
}
.sticky.nav-parallax{
	position:fixed;
	left:0px;
	right:0;
	top:0px;
	
	padding:10px 0 8px;
	
  -webkit-box-shadow:  0 1px 7px rgba(0, 0, 0, 0.3);
     -moz-box-shadow: 0 1px 7px rgba(0, 0, 0, 0.3);
          box-shadow: 0 1px 7px rgba(0, 0, 0, 0.3);
	
	background:#fff;
	z-index:999;
}

.banner{
	width:100%;
	margin:0;
	padding:0px;
	float:left
}
nav.city{
	width:100%;
	height:2px;
	text-align:center;
	position:relative;
	z-index:99
} 
nav.city .menu{
	position:relative;
	z-index:99;
	top:-50px;
}
.intro{ position:relative;}
.intro nav.city{
	position:absolute;
	bottom:50px;
}
.intro nav.city .menu{ 
	top:auto;
}

.yunomori_logo img{
	position:absolute;
	left:50%;
	top:50%;
	width:285px;
	height:175px;
	margin:-90px 0 0 -150px;
	opacity:0
}

.article{
	margin:0 auto 50px;
	width:710px;
}
.article p{
	line-height:24px;
	margin:18px 0
}
.article h1{
	font-size:26px;
	line-height:35px;
	color:#333333;
	margin:0;
}
.article h2{
	font-family: 'db_helvethaica_x75_bd';
	font-weight:normal;
	font-size:24px;
	line-height:26px;
	margin-top:20px
}
.article h3{
	font-family: 'db_helvethaica_x75_bd';
	font-weight:normal;
	font-size:21px;
	margin-top:20px
}
.article img.left{
	float:left;
	margin-right:20px;
}

.article h2 + p{ margin-top:12px}
.article_table{ width:100%}
.article_table + .article_table{ margin-top:30px}

.article ul.no_list{list-style-type:none;}
.article ul.no_list li,
.article ol li{ position:relative; padding-bottom:5px;}
.article ul.no_list li:before{ content:'';}
.article ul.indent{
	margin:15px 0 0 206px;
	padding:0 0 0 74px;
}
.article ul.no_list .order{
	position:absolute;
	left:-74px;
	top:0px;
}

.article ul
.og-details ul.list{
	padding:0px;
	margin:0px;
}
.og-details ul.list{ margin-top:15px}
.article ul li,
.og-details ul.list li{ 
	list-style-type:none; 
	position:relative;
	padding-left:15px;
	padding-bottom:5px;
}
.og-details ul.list li{
	height:auto;
	line-height:18px;
	width:auto;
	display:block;
}
.article ul li:before,
.og-details ul.list li:before{
	content:'-';
	position:absolute;
	left:0px;
	top:2px;
}
 

.box_left{float:left;}
.box_right{float:right;}

.home.box_left{width:24%;}
.home.box_left img{ margin-top:25px;}
.home.box_right{width:72%}
 
.thumbnail_expand_wrap{
	float:left;
	width:100%;
}
.thumbnail_expand_wrap.spa_treatment{
	width:50%;
	margin:auto;
	float:none
}

.thumbnail_hover{
	position:relative;
	display:block;
	width:100%;
	height:100%
}

.thumbnail_hover:before{
	position: absolute;
	bottom:0;
	left: 0;
	top:0px;
	right:0px;
	padding:0;
	width: 100%;
	height:100%;
	display:block;
	text-align:center;
	z-index:99;
	background:rgba(51,51,51, 0.6);
	opacity: 0; 
	filter:alpha(opacity=0); 
	content:'';
	
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
 
	-webkit-transform: scale3d(0.9,0.9,1);
	transform: scale3d(0.9,0.9,1);
} 

.thumbnail_title{
	position: absolute;
	left: 0;
	bottom:0;
	width:100%;
	padding:7px 10px 5px;
	display:block;
	text-align:center;
	z-index:99;
	background:url(../img/thumbnail_caption_bg.png) 0 0 no-repeat;
	font-family: 'HelveticaNeueLTStd-Bd';
	font-size:14px;
	color:#fff;
	
 -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

 
.thumbnail_hover:hover:before,
.thumbnail_hover:hover .thumb_icons{
	opacity: 1; 
	filter:alpha(opacity=100); 
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}

.thumbnail_hover:hover .thumbnail_title{
	background:transparent
}

.thumb_icons{
	width:170px;
	height:170px;
	display:block;
	margin:30px auto 25px;
	background:url(../img/thumbnail_icons.png) 0 0 no-repeat;
	
	position:absolute;
	left:50%;
	top:0px;
	margin-left:-80px;
	z-index:99;
	
	opacity: 0; 
	filter:alpha(opacity=0); 
	
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
 
	-webkit-transform: scale3d(0.9,0.9,1);
	transform: scale3d(0.9,0.9,1);

}
.package .thumb_icons{ background:none}
.og-grid li a img.thumb_icons { position:absolute; margin-left:-85px}

.icon_onsen{background-position:0 0;}
.icon_soda_spa{background-position:-187px 0;}
.icon_jet_bath{background-position:-373px 0;} 
.icon_garden_bath{background-position:-560px 0;}
 
.icon_bath_individual{background-position:0 -180px;}
.icon_cold_bath{background-position:-186px -180px;}
.icon_salt_sauna{background-position:-371px -180px;}
.icon_steam_room{background-position:-562px -180px;}

.icon_thai_massage{background-position:0px -370px;} 
.icon_aroma_massage{background-position:-188px -370px;} 
.icon_herbal_massage{background-position:-371px -370px;} 
.icon_scrub_massage{background-position:-561px -370px} 

.thumb .og-details-inner{ position:relative;}
.thumb .og-details-inner:before{
	content:'';
	position:absolute;
	z-index:9;
	left:0;
	top:-300px;
	width:170px;
	height:170px;
	display:block;
	margin:20px auto 0;
	background:url(../img/thumbnail_icons.png) 0 0 no-repeat;
}

.onsen_spa .og-details-inner.item-0:before{background-position:0 0;} 
.onsen_spa .og-details-inner.item-1:before{background-position:-187px 0;} 
.onsen_spa .og-details-inner.item-2:before{background-position:-373px 0;} 
.onsen_spa .og-details-inner.item-3:before{background-position:-560px 0;} 
.onsen_spa .og-details-inner.item-4:before{background-position:0 -180px;} 
.onsen_spa .og-details-inner.item-5:before{background-position:-186px -180px;} 
.onsen_spa .og-details-inner.item-6:before{background-position:-371px -180px;} 
.onsen_spa .og-details-inner.item-7:before{background-position:-562px -180px;} 

.spa_treatment .og-details-inner.item-0:before{background-position:0px -364px;} 
.spa_treatment .og-details-inner.item-1:before{background-position:-188px -364px;} 
.spa_treatment .og-details-inner.item-2:before{background-position:-371px -364px;} 
.spa_treatment .og-details-inner.item-3:before{background-position:-561px -364px} 

.package .thumb .og-details-inner:before{ background:none}
 
.parallax_container .box_overlay.article{
	width:560px;
	background:rgba(255,255,255,0.8);
	padding:30px 40px;
	margin:200px auto;
	
}
.background.height400{ height:400px}
 
/*fullscreen bg*/ 
.fullscreen,
.content_outer {
    width:100%;
    min-height:100%;
}
.not-fullscreen,
.not-fullscreen .content_outer,
.fullscreen.not-overflow,
.fullscreen.not-overflow .content-a {
    height:100%;
    overflow:hidden;
}


.content_outer{
	display:table;
}
.content_inner{
	display:table-cell;
    position:relative;
	vertical-align:middle;
	text-align:center;
} 
/*end fullscreen bg*/ 


.contact{
	background:#333333;
	color:#fff;
	margin-top:30px;
}
.contact_inner{
	padding:20px;
	display:block;
}
.contact.box_left{ width:400px;}
.contact.box_right{ width:585px; margin-left:15px}

.contact.box_right .article{
	width:auto;
	padding:0 60px;
	margin:15px 0 0
}
.contact.box_right .article p{
	margin:15px 0;
}
.contact.box_right .article h3 + p{ margin-top:-8px}

.contact h2,
.contact h3{
	font-family: 'HelveticaNeueLTStd-Bd';
	font-size:26px;
	font-weight:normal;
	margin-top:0;
	margin-bottom:20px;
	color:#fff;
}
.contact h3{ font-size:17px; margin-top:20px}
.contact .button{ width:100%}
.contact textarea{height:360px}

.facility_wrap{
	margin-left:-10px;
	margin-top:130px;
}
.facility_thumb{
	background-color:#000000;
	margin-left:10px;
	width:325px;
	float:left;
	color:#fff;
	position:relative;
	cursor:pointer;
}
.facility_icon{
	width:180px;
	height:180px;
	position:absolute;
	left:50%;
	margin-top:-90px;
	margin-left:-95px;
	border:4px solid #000000;
	background-color:#fff;
	-webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
		  
	-webkit-transition: all 0.2s ease-in-out;
       -moz-transition: all 0.2s ease-in-out;
         -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
}
.facility_icon img{
	position:relative;
	left:9px;
	top:9px;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
}
.facility_icon:before,
.facility_icon:after{
	position:absolute;
 
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
		  
	-webkit-transition: all 0.2s ease-in-out;
       -moz-transition: all 0.2s ease-in-out;
         -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
}
.facility_icon:before{
	border:4px solid transparent;
	content:'';
	height:186px;
	width:186px;
	left:-4px;
	top:-4px;
}

.facility_icon:after{
	border:1px solid transparent;
	width:160px;
	height:160px;
	content:'';
	left:9px;
	top:9px;
}

.facility_text{
	padding:145px 50px 50px; 
	display:block;
}
.facility_text h2{
	margin:0px;
	color:#fff;
	font-size:16px;
}
.facility_text > p{ margin-top:30px;}
.facility_text > h2 + p{ margin-top:0}
.facility_thumb:hover .facility_icon{ border:4px solid #fff;} 
.facility_thumb:hover .facility_icon:after{border:1px solid #000000;}
.facility_thumb:hover .facility_icon:before{border:1px solid #000000;}

.facility_icon.active{border:4px solid #fff;}
.facility_icon.active:after{border:1px solid #000000;}
.facility_icon.active:before{border:1px solid #000000;}


.facility_detail_wrap{
	display:block;
	border:4px solid #000;
	margin-top:130px;
	background:url(../img/square_line.png);
}

#facility_detail .cafa_icons{
	background:url(../img/cafe-title.png) 0 0 no-repeat;
	display:inline-block;
	position:relative;
}
#facility_detail .beverage{
	width:278px;
	height:130px;
	background-position: 0 0;
}
#facility_detail .dessert{
	background-position: 0 -132px;
	width: 258px;
    height: 122px;
}
#facility_detail .snack{
	background-position: 0 -258px;
	width: 250px;
    height: 110px;
}

#facility_detail.accordion{ margin-top:100px; margin-bottom:40px}
#facility_detail .accordion-group{ text-align:center; margin-bottom:20px}

.cafa_image_clearfix{
	display:block;
	height:10px;
	width:100%;
}
.cafa_image{ vertical-align:top}

 

.parallax_container .article{
	margin-top:40px;
	margin-bottom:40px;
}
.parallax_container .article h2{ margin-top:10px}
.fullscreen.intro{
	background-size:cover;
}

.press.box_left{
	width:600px;
	float:left;
}
.press .accordion-heading{
	padding-top:20px;
	padding-bottom:20px;
}

.press .accordion-heading a{
	font-size:26px;
	color:#333333;
	font-family:'HelveticaNeueLTStd-Md';
}
.press .accordion-heading .icons{ 
	width:27px;
	height:17px;
	float:right;
	margin-top:2px
}
.box_left .icon_arrow_down{background-position:-29px -41px;}
.box_left .icon_arrow_up{background-position:1px -41px;}

.box_right .icon_arrow_down{background-position:-29px -22px;}
.box_right .icon_arrow_up{background-position:1px -22px;}
  

.press h2{
	margin:20px 0;
	font-size:26px;
	color:#333333;
	font-family:'HelveticaNeueLTStd-Md';
}
.press_inner{
	padding:20px;
	background:#333333;
}


.press_blog{
	background:#fff;
	padding:10px 15px 15px 15px;
	margin-bottom:15px;
}
.press_blog h3{
	border-bottom:2px solid #333;
	font-size:21px;
	margin:5px 0 10px;
	padding-bottom:5px;
	font-family: 'HelveticaNeueLTStd-Roman';
}
.press_blog h3 a{color:#333333}

.press_blog p{ margin:0}


.press.box_right{
	float:left;
	width:375px;
	background:#ccc;
	margin-left:20px;
}
.press.box_right .accordion-heading{ background:#333333}
.press.box_right .accordion-heading{ padding-bottom:0}
.press.box_right .accordion-heading a{ color:#fff}
.press.box_right h2{ 
	color:#fff;
	background:#333333;
	margin:0;
	padding:20px 20px 0;
}
 
/******/
#press .collapse{ overflow:visible}
.masonry{ margin-left:-20px}
.grid_item {
	width: 50%; 
	margin-bottom:20px;
}
.grid_inner{ 
	margin-left:20px;
	position:relative;
}
 
.grid_item img {
	margin: 0px;
	padding: 0px;
	display: block;
}
.grid_item h2 {
	position:absolute;
	top:50%;
	left:0px;
	text-align:center;
	color:#fff;
	z-index:999;
	width:100%;
	font-size:19px;
	line-height:20px;
	margin-top:-13px;
	
	opacity: 0; 
	filter:alpha(opacity=0); 
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
 
	-webkit-transform: scale3d(0.9,0.9,1);
	transform: scale3d(0.9,0.9,1);
}
 
.grid_overlay{
	position: absolute;
	bottom:-10px;
	left:-10px;
	top:-10px;
	right:-9px;
	padding:0;
	/*width: 100%;*/
	 
	display:block;
	text-align:center;
	z-index:99;
	background:rgba(0,0,0, 0.8);

	opacity: 0; 
	filter:alpha(opacity=0); 
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale3d(0.9,0.9,1);
	transform: scale3d(0.9,0.9,1);
}

.grid_item:hover .grid_overlay,
.grid_item:hover h2{
	opacity: 1; 
	filter:alpha(opacity=100); 
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}


/******/

.gallery_wrapper{
	width:100%;
	background:#333
}

.gallery {
    float: left;
    margin-bottom: 15px;
    margin-top: 15px;
    position: relative;
    width: 100%;
}

.checkbox{
	margin:5px 0 5px;
	padding:0px;
	width:100%;
	list-style-type:none;
	float:left;
}
.checkbox li{
	width:50%;
	float:left;
	font-family: 'HelveticaNeueLTStd-Roman';
	font-size:15px;
	padding:0 0 18px; 
}

/*Radio & Checkbox*/


.radio input[type=radio],
.checkbox input[type=checkbox] {
	display: none;
}
.checkbox label:before,
.radio label:before {
	content: "";
	display: inline-block;

	width: 18px;
	height: 18px;

	margin-right: 10px;
	position: absolute;
	left: 0;
	bottom:0;
	background-color: #fff;
	 
}

.radio label:before {
	width: 16px;
	height: 16px;
	bottom:0;
	
}
.radio label {
	margin-bottom: 10px;
	position:relative;
	padding-left:30px; 
}
.checkbox label {
	position:relative;
	padding-left:30px; 
	margin-bottom:0;
	text-align:left;
	line-height:17px
}
 
.radio input[type=radio]:checked + label:after {
    content: "";
    color: #ffa800;
	background-color:#ffa800;
	border-radius: 50%;
	position:absolute;
	left:3px;
	bottom:3px;
	width:10px;
	height:10px;
}
.radio.middle label:before{
	bottom:28%;
}
.radio.middle input[type="radio"]:checked + label:after{bottom:33%;}
@media screen and (-webkit-min-device-pixel-ratio:0) {
	.radio.middle input[type="radio"]:checked + label:after{bottom:34%;}
}

.checkbox input[type=checkbox]:checked + label:before {
	content: "\2713";
	text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
	font-size: 18px;
	color: #ffa800;
	text-align: center;
    line-height: 17px;
}

 
.radio, 
.checkbox{ padding-left:0; position:relative}
/**/

footer{
	margin-top:100px;
}
footer.gallery_page{margin-top:40px;}

.backtotop{
	float:left;
	width:100%;
	height:auto;
	text-align:right;
	position:fixed;
	bottom:0;
}

.backtotop a{
	display:block;
	float:right;
	margin:0 5px 0 0;
	line-height:30px;
	font-size:8px;
	color:#fff;
	text-transform:uppercase;
	position:relative;
	z-index:99;
	 
	 width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	
	border-bottom: 20px solid #b2b2b2;
}
.backtotop a:hover{border-bottom: 20px solid #333;}

.backtotop a span{ display:block; margin-left:-8px}