@media (min-width: 979px)  {
	.menu li:hover .dropdown-menu {display: block;}
	.accordion-body.collapse{ height:auto !important}
	
}
@media (max-width: 1169px)   {}

@media (min-width: 1290px) and (max-width: 1315px){}
 
@media (min-width: 1024px) and (max-width: 1290px){}

 
 
/****phone and tablet****/
@media (max-width: 979px) {
	.page{ position:relative; overflow:hidden}
	
	.navbar{ padding:10px 0}
	.lang{ margin-top:3px}
	.follow{ margin-top:5px}
	.navbar .btn-navbar{ margin-top:2px}
	.navbar.sticky .btn-navbar{ margin-top:0}
	
	.contact h2{ font-size:20px}
	.article h2{ margin-top:10px; }
	.article p{ margin:10px 0}
	
	.menu_city{
		width:100%;
		margin-bottom:60px;
	}
	.menu_city a{
		display:inline-block !important;
		color:#;
		padding:0 20px !important;
		text-transform:uppercase;
		width:auto !important;
		border:0 !important
	}
	
    .navbar .nav > li.menu_city:hover > a:before{
		background:#fff
	}
	.navbar .nav > li.menu_city > a:hover:before,
	.navbar .nav > li.menu_city > a.active:before{
		content:'';
		position:absolute;
		left:auto;
		top:50%;
		margin-top:-3px;
		margin-left:-11px;
		width:6px;
		height:6px;
		background:#b2b2b2;
		-webkit-border-radius:50%;
		 -moz-border-radius:50%;
			  border-radius:50%;
	}
 
	
	.article_table td{
		display:block;
		width:100%
	}
	ul,ol{ margin:10px 0 10px 35px}
	ul.indent{ margin-left:30px}
	
	.backtotop{ text-align:center}
	.backtotop a{ float:none; margin-right:auto; margin-left:auto}
 
}
 
/****tablet****/
 
@media only screen and (min-width : 768px) and (max-width : 1024px){
	/*Portrait & Landscape*/
}

@media (min-width: 768px) and (max-width: 979px) {
	/* For portrait layouts only */	
	
	
	.banner_caption{
		width:200px;
		height:auto;
		margin-left:-100px;
		margin-top:-60px;
	}	 
	.background.height400{ height:350px}
	.background.height580{ height:520px}
	
	.parallax_container .box_overlay.article{ margin-top:150px; margin-bottom:150px}
	
	.contact.box_left{ width:258px;}
	.contact.box_right{ width:450px;}
	.contact.box_right .article{ padding:0 25px}
	
	.thumbnail_expand_wrap.spa_treatment{ width:100%}
	.facility_wrap{ margin-left:-20px;}
	.facility_thumb{
		width:228px;
		margin-left:20px;
	}
	.facility_text{ padding:145px 20px 20px}
	
	.press h2{ font-size:20px;}
	.press_blog h3{ font-size:18px}
	.press.box_left{width:425px;}
	.press.box_right{
		margin-left:15px;
		width:282px;
	}
	.masonry{ margin-left:-15px}
	.grid_item {margin-bottom:15px}
    .grid_inner{ margin-left:15px}
	
	.grid_overlay{
		left:-8px;
		right:-8px;
		bottom:-8px;
		top:-8px;
	}
	
	.accordion-body.collapse{ height:auto !important}
	
	#facility_detail .accordion-group{ margin-bottom:0}
	#facility_detail .accordion-body{
		width:1000px;
		margin-top:-40px;
	}
	
	#facility_detail .beverage{
		height: 91px;
    	width: 200px;
		background-size:200px
	}
	#facility_detail .dessert{
		height: 91px;
    	width: 200px;
		background-size:215px;
		background-position:0 -101px;
	}
	#facility_detail .snack{
		width: 200px;
    	height: 81px;
    	background-size: 205px;
		background-position:0 -188px;
	}
	
	#facility_detail #collapseOne.accordion-body{
		-webkit-transform: scale3d(0.75,0.75,0.75);
		transform: scale3d(0.75,0.75,0.75);
		width:1000px;
		margin-left:-142px
	}
	#facility_detail #collapseTwo.accordion-body{
		margin-left:-145px;
		-webkit-transform: scale3d(0.7,0.7,0.7);
		transform: scale3d(0.7,0.7,0.7);
	}
	
	#facility_detail #collapseThree.accordion-body{
		-webkit-transform: scale3d(0.68,0.68,0.68);
		transform: scale3d(0.68,0.68,0.68);
		margin-left:-140px;
	}
}
 

/****phone***/
@media (max-width: 767px) {
	body{ overflow-x:hidden; position:relative}
	.body{ margin-bottom:50px;}
	.container{
		width:auto;
		padding:0 15px !important;
	}
	.article{
		width:auto;
	}
	.article h1{ 
		font-size:18px;
		line-height:30px;
	}
	/*.article h2{ font-size:21px; line-height:23px;}*/
	.og-grid{ margin-left:0}
	
	
	
	.banner_caption{
		width:120px;
		height:auto;
		margin-left:-60px;
		margin-top:-30px;
	}
	ul.indent li{ padding-bottom:5px}
	.article ul li{ padding-bottom:8px}
	.parallax_container .article{ 
		width:auto;
		padding:0 15px;
	}
	.background.height400{ height:250px}
	.background.height580{ height:320px}
	.parallax_container .box_overlay.article{ 
		margin-top:50px; 
		margin-bottom:50px; 
		width:auto;
		padding:20px 20px;
	}
	
	.contact.box_left{ width:100%;}
	.contact.box_right{ width:100%; margin-top:0}
	.contact.box_right .article{ padding:0 0}
	.contact textarea{height:300px}
	
	.thumbnail_expand_wrap.spa_treatment{ width:100%}
	.facility_wrap{ margin-left:0; margin-top:100px}
	
	.facility_thumb{
		max-width:320px;
		width:100%;
		float:none;
		margin:0 auto 130px;
	}
	.facility_text{ padding:120px 20px 20px}
	.facility_text > p{ margin-top:0px;}
	
	.facility_detail_wrap{margin-top:100px}
	
	.yunomori_logo img{
		width:160px;
		height:auto;
		margin-left: -80px;
        margin-top: -50px;
	}
	.navbar.city .nav > li > a{ padding:7px 15px}
	.home.box_left img{ margin-top:0; margin-bottom:20px}
	.press.box_left{width:100%;}
	.press.box_right{
		margin-left:0;
		width:100%;
	}
	.masonry{ margin-left:-10px}
	.grid_item {margin-bottom:10px}
    .grid_inner{ margin-left:10px}
	.grid_overlay{
		left:0;
		right:0;
		bottom:0;
		top:0;
	}
	
	
	
	
	#press .collapse{ overflow:hidden}
	.press .accordion-heading{ padding:0}
	.press .accordion-heading a{ font-size:20px}
	.press.box_right .accordion-heading a{ padding-top:12px; padding-bottom:12px}
	.press_inner{ padding-top:5px;}
	.press_blog h3{ font-size:16px}
	.contact.box_left, .contact.box_right{ float:left;margin-left:0}
	
	#facility_detail .accordion-group{ margin-bottom:0}
	#facility_detail .beverage{
		height: 91px;
    	width: 200px;
		background-size:200px
	}   
	#facility_detail .dessert{
		height: 91px;
    	width: 200px;
		background-size:215px;
		background-position:0 -101px;
	}
	#facility_detail .snack{
		width: 220px;
		height: 86px;
    	background-size: 225px;
		background-position:0 -211px;
	}
	.cafa_image{ margin:0px 0px 20px !important}
	
	
}
@media (max-width: 620px) {}
@media (max-width: 550px) {
	.grid_item h2{ font-size:15px}
}
@media (max-width: 480px) {
	 header{ height:80px}
	.container{width:auto;}
	.home.box_left{width:100%; text-align:center}
	.home.box_right{width:100%;}
	
	.menu_city a { padding:0 10px !important}
	
	.article ul, .article  ol{ margin:10px 0 10px 15px}
	.article ul.indent{ margin-left:0px}
	
	.article  ul.no_list li, 
	.article  ol li{ padding-bottom:10px;}
	
	.navbar.city .nav > li > a{ padding:7px 10px}

}
 
@media (max-width: 374px) {
	.nav-collapse .nav {width:260px;}
	
	.press.box_left #grid{margin-left:0;}
	.masonry{ margin-left:0}
	.grid_item {width:100%; margin-bottom:5px}
    .grid_inner{ margin-left:0}
	
	.grid_item:before{left:0;}
}

@media (max-width: 320px) {
	 
} 


	 
/*Retina Display Media Query*/
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 

	 
	
     .icons{
		 background-image:url(../img/icons-retina.png);
		 background-size:150px;
	  }
	
	/*****************SET :: line-height ************************/
	
	.lang .en{ padding-left:6px;}
	.og-details h3{ padding-top:16px}
	.press .accordion-heading a,
	.press.box_right .accordion-heading a{ padding-top:6px; padding-bottom:0; line-height:45px}
	.press .accordion-heading .icons{ margin-top:12px;}
	.contact a{ color:#fff}
	.checkbox input[type="checkbox"]:checked + label::before{ line-height:25px}
	@media (max-device-width: 979px) {
		li{line-height:23px;}
		
		.nav-collapse .nav > li > a{ padding-top:12px}
		.navbar .nav > li.menu_city > a:hover:before, 
		.navbar .nav > li.menu_city > a.active:before{ margin-top:-5px}
		
		.article h3{ font-size:24px}
		.contact h3{ font-size:19px}
		.article p{ margin-bottom:20px}
		.article ul, 
		.article ol{ margin:10px 0 10px 25px}
		
		.facility_text > p{ line-height:26px}
		
		.grid_overlay{
			-webkit-transition:none;
			transition:none;
			
			-webkit-transform: scale3d(1,1,1);
			 transform: scale3d(1,1,1);		
		}
	}
	
	@media (min-width: 768px) {}
	
	@media (max-width: 767px) {
		.article h1{ font-size:22px;}
		
		
	}
	
}