@charset "UTF-8";

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

UPDATE 2020.07.11

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



*{
	background-repeat:no-repeat;
	line-height:140%;
	margin:0;
	padding:0;
	outline: none
}

*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
 
a {text-decoration:none; overflow:hidden; color:#333}
a:hover {color:#666}

img {border: none; line-height:0; vertical-align:bottom;max-width: 100%;-webkit-backface-visibility: hidden}
img[data-echo]{ 
	min-width:50px; 
	min-height:50px; 
	background-image:url(../images/common/loader-white.gif); 
	background-position:center center;
	border:solid 1px #ddd;
	border-radius:5px
}
img[data-echo].loaded{background-image:none}


.clear{clear:both; height:0; line-height:0; font-size:0}

.space10 {height: 10px}
.space20 {height: 20px}
.space30 {height: 30px}
.space40 {height: 40px}
.space100 {height: 100px}

.mt5{margin-top:5px}
.mt10{margin-top:10px}
.mt20{margin-top:20px}
.mt30{margin-top:30px}
.mt40{margin-top:40px}
.mt50{margin-top:50px}

.mb5{margin-bottom:5px}
.mb10{margin-bottom:10px}
.mb20{margin-bottom:20px}
.mb30{margin-bottom:30px}
.mb40{margin-bottom:40px}
.mb50{margin-bottom:50px}

.ml5{margin-left:5px}
.ml10{margin-left:10px}
.ml20{margin-left:20px}
.ml30{margin-left:30px}
.ml40{margin-left:40px}
.ml50{margin-left:50px}

.mr5{margin-right:5px}
.mr10{margin-right:10px}
.mr20{margin-right:20px}
.mr30{margin-right:30px}
.mr40{margin-right:40px}
.mr50{margin-right:50px}


.font10{font-size:10px}
.font12{font-size:12px}
.font14{font-size:14px}
.bold{font-weight:bold}
.txt-left{text-align:left}
.txt-center{text-align:center}
.txt-right{text-align:right}
.red{color:#C00}

ul li{list-style: none}

.alpha{
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}

.alpha:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.75;
	opacity:0.75;
}

.wrap-alpha a{
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}
.wrap-alpha a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.75;
	opacity:0.75;
}

.transition-01{ 
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.transition-02{ 
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}
.transition-03{ 
	-webkit-transition: all 0.6s ease-out;
	-moz-transition: all 0.6s ease-out;
	-o-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}



/* Scroll Trigger */

.trigger{
	-webkit-transition: -webkit-transform 1.0s ease, opacity 1.0s ease;	
	transition: transform 1.0s ease, opacity 1.0s ease;	
}
.trigger-2{
	-webkit-transition: -webkit-transform  1.0s ease .3s, opacity  1.0s ease .3s;	
	transition: transform 1.0s ease .3s, opacity 1.0s ease .3s;	
}
.trigger-3{
	-webkit-transition: -webkit-transform  1.0s ease .6s, opacity  1.0s ease .6s;	
	transition: transform 1.0s ease .6s, opacity 1.0s ease .6s;	
}


.trigger-num1{
	transition: transform 1.0s ease, opacity 1.0s ease;	
}
.trigger-num2{
	transition: transform 1.0s ease .2s, opacity 1.0s ease .2s;	
}
.trigger-num3{
	transition: transform 1.0s ease .4s, opacity 1.0s ease .4s;	
}


.invisible {
	-webkit-transition: opacity .5s ease;
	-moz-transition: opacity .5s ease;
	-o-transition: opacity .5s ease;
	-ms-transition: opacity .5s ease;
	transition: opacity .5s ease;
	opacity: 0.0;
}

.visible {
	-webkit-transition: opacity 1.0s ease;
	-moz-transition: opacity 1.0s ease;
	-o-transition: opacity 1.0s ease;
	-ms-transition: opacity 1.0s ease;
	transition: opacity 1.0s ease;
	opacity: 1.0;
}

.fromTopIn{
	-webkit-transform: translate(0,0);	
	-moz-transform: translate(0,0);
	-o-transform: translate(0,0);
	-ms-transform: translate(0,0);
	transform: translate(0,0);
	opacity: 1.0;
}

.fromTopOut{
	-webkit-transform: translate(0,-10px);	
	-moz-transform: translate(0,-10px);
	-o-transform: translate(0,-10px);
	-ms-transform: translate(0,-10px);
	transform: translate(0,-20px);
	opacity: 0.0;
}

.fromBottomIn{
	-webkit-transform: translate(0,0);	
	-moz-transform: translate(0,0);
	-o-transform: translate(0,0);
	-ms-transform: translate(0,0);
	transform: translate(0,0);
	opacity: 1.0;
}

.fromBottomOut
{
	-webkit-transform: translate(0,10px);	
	-moz-transform: translate(0,10px);
	-o-transform: translate(0,10px);
	-ms-transform: translate(0,10px);
	transform: translate(0,20px);
	opacity: 0.0;
}

.fromLeftIn
{
	-webkit-transform: translate(0,0);	
	-moz-transform: translate(0,0);
	-o-transform: translate(0,0);
	-ms-transform: translate(0,0);
	transform: translate(0,0);
	opacity: 1.0;
}

.fromLeftOut
{
	-webkit-transform: translate(-10px,0);	
	-moz-transform: translate(-10px,0);
	-o-transform: translate(-10px,0);
	-ms-transform: translate(-10px,0);
	transform: translate(-20px,0);
	opacity: 0.0;
}

.fromRightIn
{
	-webkit-transform: translate(0,0);	
	-moz-transform: translate(0,0);
	-o-transform: translate(0,0);
	-ms-transform: translate(0,0);
	transform: translate(0,0);
	opacity: 1.0;
}

.fromRightOut
{
	-webkit-transform: translate(10px,0);	
	-moz-transform: translate(10px,0);
	-o-transform: translate(10px,0);
	-ms-transform: translate(10px,0);
	transform: translate(20px, 0);
	opacity: 0.0;
}

.scaleUpIn
{
	-webkit-transform: scale(1.0,1.0);
	-moz-transform: scale(1.0,1.0);
	-o-transform: scale(1.0,1.0);
	-ms-transform: scale(1.0,1.0);
	transform: scale(1.0,1.0);
	opacity: 1.0;
}

.scaleUpOut
{
	-webkit-transform: translate(0,0);	
	-moz-transform: translate(0,0);
	-o-transform: translate(0,0);
	-ms-transform: translate(0,0);
	transform: scale(1.2,1.2);
	opacity: 0.0;
}

.scaleDownIn
{
	-webkit-transform: scale(1.0,1.0);	
	-moz-transform: scale(1.0,1.0);
	-o-transform: scale(1.0,1.0);
	-ms-transform: scale(1.0,1.0);
	transform: scale(1.0,1.0);
	opacity: 1.0;
}

.scaleDownOut
{
	-webkit-transform: scale(0.7,0.7);	
	-moz-transform: scale(0.7,0.7);
	-o-transform: scale(0.7,0.7);
	-ms-transform: scale(0.7,0.7);
	transform: scale(0.7,0.7);
	opacity: 0.0;
}

.rotateIn{
	-webkit-transform: rotate(0deg)scale(1);
	transform: rotate(0deg)scale(1);
	opacity: 1.0;
}
.rotateOut{
	-webkit-transform: rotate(30deg) scale(.9);
	transform: rotate(30deg) scale(.9);
	opacity: 0.0;
}


.bd-01{background: linear-gradient(transparent 60%, rgba(252,238,33,.6) 0%); font-weight: bold}
.bd-02{background: linear-gradient(transparent 60%, rgba(228,0,3,.4) 0%); font-weight: bold}
.bd-03{background: linear-gradient(transparent 60%, rgba(0,65,219,0.50)  0%); font-weight: bold}

.cursor{cursor:pointer; cursor:hand}

th,td{text-align:left}

input[type="text"]:focus {outline: 0;}
button:focus {outline: 0;-webkit-appearance: none;border-radius: 0;}

#back-top {
	position: fixed;
	bottom: 20px;
	left:20px;
	z-index:1000;
	display: none
}
#back-top img{width: 50px; height: 50px}

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

#back-top {right:10px; bottom:70px}
#back-top img{width: 40px; height: 40px}

}
/** Loader **/

#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #fff;
  z-index: 998;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 160px;
  height: 200px;
  margin-top: -80px;
  margin-left: -80px;
  text-align: center;
  z-index: 999;
}
#loader p{font-size:12px; margin-top:30px; letter-spacing: 1.5px}
#loader .num1{
	animation: flash1 1s 0s infinite;
}
#loader .num2{
	animation: flash2 1s 0s infinite;
}
#loader .num3{
	animation: flash3 1s 0s infinite;
}

@keyframes flash1 {
	0% {
		opacity: 0
	}
	33% {
		opacity: 1
	}
	100% {
		opacity: 1
	}
}
@keyframes flash2 {
	0% {
		opacity: 0
	}
	33% {
		opacity: 0
	}
	66% {
		opacity: 1
	}
	100% {
		opacity: 1
	}
}
@keyframes flash3 {
0% {
		opacity: 0
	}
	66% {
		opacity: 0
	}
	99% {
		opacity: 1
	}
	100% {
		opacity: 1
	}
}


.clearfix:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
.clearfix { display: inline-table}
.clearfix{zoom:1}/** for IE7 **/

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

.link a{/*color:#0052a5*/color:#0071bc}
.link a:hover{opacity: .8}

#window-size{position: fixed; bottom:10px; left: 10px; width: 200px; background-color: #fff; font-size: 16px; font-weight: bold; z-index: 9999; text-align: center;padding: 10px; display: none}

#ie-notice{background-color: #fff; padding: 10px; text-align: center; font-size: 16px; font-weight: bold; color:red}



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

COMMON

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



.cols-2{font-size:0;}
.cols-2 .col{font-size:14px; display: inline-block; vertical-align: top; width :50%}

.cols-3{font-size:0;}
.cols-3 .col{font-size:14px; display: inline-block; vertical-align: top; width :33.33333%}

.cols-4{font-size:0;}
.cols-4 .col{font-size:14px; display: inline-block; vertical-align: top; width :25%}

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

.cols-2 .col,
.cols-3 .col,
.cols-4 .col{display: block; width :100%}

}


.reset{ font-size:0; letter-spacing:.5}
.reset li{font-size:14px; letter-spacing:normal}

.full{width:100%; height:auto}

.hr-list{letter-spacing: -0.5em}
.hr-list li{display:inline-block; vertical-align:top;letter-spacing: normal}

.table-style-01{width:100%}
.table-style-01 table{width:100%;border-collapse:separate;border-spacing:1px;}
.table-style-01 th{padding:10px; text-align:right;}
.table-style-01 td{padding:10px;}


.table-style-02{width:100%;background-color:#ccc}
.table-style-02 table{width:100%;border-collapse:separate;border-spacing:1px;}
.table-style-02 th{text-align:right; padding:8px 10px; vertical-align:top; white-space:nowrap;background:#eee}
.table-style-02 td{ padding:8px 10px; background-color:#fff}

.bt-blue a{color:#fff; display:block; padding:15px 10px; text-align:center; background-color:#269FE0;-webkit-border-radius: 5px;-moz-border-radius:5px;border-radius:5px; border-bottom:solid 3px #069}
.bt-blue a:hover{background-color:#CCC}

.bt-blue-02 a{color:#fff; display:block; padding:10px 10px; text-align:center; background-color:#269FE0;-webkit-border-radius: 4px;-moz-border-radius:4px;border-radius:4px}
.bt-blue-02 a:hover{background-color:#CCC}

.bt-orange a{color:#fff; display:block; padding:15px 10px; text-align:center; background:#F90;-webkit-border-radius: 5px;-moz-border-radius:5px;border-radius:5px; border:solid 1px #fff;
	background: -moz-linear-gradient(top ,#F90, #F60);
    background: -webkit-gradient(linear, left top, left bottom, from(#F90), to(#F60));
    background: linear-gradient(to bottom, #F90, #F60);
}
.bt-orange a:hover{background:#F60}


body{
	-webkit-text-size-adjust: 100%;
	word-break: break-all;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
}
.mincho{font-family:"游明朝体", "Yu Mincho", YuMincho, "ＭＳ Ｐ明朝", "MS PMincho",'Hiragino Mincho ProN', serif;}

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

body{
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
}
.mincho{font-family:'Hiragino Mincho ProN',"ＭＳ Ｐ明朝", "MS PMincho", serif;}

}

.inner{width:100%; max-width: 1200px; margin:0 auto; position:relative}


/**  Slick Base  fadeする場合はslick.cssの読み込みが必要**/

.slick{overflow: hidden; width: 100%; position: relative;-webkit-backface-visibility: hidden}
.slick li.slick-slide{display: inline-block; vertical-align: middle;overflow: hidden}
.slick li.slick-slide img{width: 100%; height: auto}
.slick li.slick-slide iframe{width: 100%; height: 700px}

#video{width: 1400px; height: 700px}

.slick-arrow{position: absolute; top:50%; font-size: 50px; margin-top: -50px; z-index: 2}
.slick-prev{left:10px}
.slick-next{right:10px}

.slick-dots{text-align: center; position: absolute; bottom:0px; left: 0 ;width: 100%}
.slick-dots li{display: inline-block; width: 10px; height: 10px; margin: 0 5px; background-color:rgba(249,249,249,.6); border-radius: 100%; text-indent: -9999px; cursor: pointer}
.slick-dots li.slick-active{background-color:#eee}

@media screen and (max-width: 840px) {
.slick-dots{bottom:10px}
}
@media screen and (max-width: 500px) {
.slick-dots{bottom:0}
.slick-dots li{width: 6px; height: 6px; margin: 0 3px}
}


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

HEADER

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

#header{background-color: rgba(0,0,0,.4);position: fixed;top:0; left: 0; width: 100%;padding: 10px; height: 80px; z-index: 9999; -webkit-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
#header.on{background-color: rgba(0,0,0,0);top:-80px}
.hotel #header{padding-top: 5px}
#header .inner{opacity: 1;-webkit-transition: all 0.4s ease-out;transition: all 0.4s ease-out;display: block}
#header.on .inner{opacity: 0}

#logo{color:#fff; font-size: 16px; letter-spacing: 2px; font-weight: normal; display: inline-block;vertical-align: middle; margin-right: 100px}
#logo a{color:#fff}


#logos{display: inline-block; vertical-align: middle}
#logos li{display: inline-block; margin: 0 10px; vertical-align: middle}

#header nav{display: inline-block;  vertical-align: middle}
#gnav li{display: inline-block; margin: 0 10px;text-align: center;vertical-align: middle}
#gnav li a{color:#fff; font-size: 14px; letter-spacing: 2px}
#gnav li a span{font-size: 10px;display: block;}

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

#logos{display: none}
#gnav{display: none}
#asia #logo{padding-top: 0px}

}

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

#header{height: 50px}
#logo{font-size: 10px; padding-top: 0}
#logo img{max-height: 40px}

}



#op-menu{position: fixed; top:0; right:0; background-color: rgba(0,0,0,.4);height: 80px; width: 80px; cursor:pointer; z-index: 9999;}
#op-menu:hover,
#header.on #op-menu{background-color: rgba(0,0,0,.8);}
#op-menu .line{position: absolute;left: 30px;width: 30px; height: 1px; background-color: #fff;}
#op-menu .line-1{top:30px}
#op-menu .line-2{top:40px}

@media (min-width: 800px) {
#op-menu:hover .line-1{top:27px}
#op-menu:hover .line-2{top:43px}
}

#op-menu.active .line-1{
	-webkit-transform: rotate(-34deg);
	transform: rotate(-34deg);
	top:35px
}
#op-menu.active .line-2{	
	-webkit-transform: rotate(34deg);
	transform: rotate(34deg);
	top:35px
}


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

#op-menu{height: 50px; width: 50px}
#op-menu .line{left: 15px;width: 25px; height: 1px; background-color: #fff;}
#op-menu .line-1{top:17px}
#op-menu .line-2{top:27px}
#op-menu:hover .line-1{top:17px}
#op-menu:hover .line-2{top:27px}
#op-menu.active .line-1{
	-webkit-transform: rotate(-34deg);
	transform: rotate(-34deg);
	top:24px
}
#op-menu.active .line-2{	
	-webkit-transform: rotate(34deg);
	transform: rotate(34deg);
	top:24px
}
}



#show-menu{width: 100%; height: 100%; position: fixed; top:0; left: 0; background-color:rgba(0,0,0,.95); z-index: 9998; display: none;padding-top: 100px;overflow: auto}
#show-menu li{text-align: center; font-size: 30px; color:#fff}
#show-menu li a{color:#fff; display: block; padding: 15px; border-bottom:solid 1px #111; letter-spacing: 2px;margin-top: 15px; opacity: 0;transition: all .8s ease}
#show-menu li a.on{margin-top: 0; opacity: 1}
#show-menu li a span{font-size: 12px;display: block;}
#show-menu li:first-child a{border-top:solid 1px #111}
@media (min-width: 800px) {
#show-menu li a:hover{background-color: #111;padding-left: 0px}
}
#show-menu .sns-icons{text-align: center}
#show-menu .sns-icons li{display: inline-block;}
#show-menu .sns-icons li a{ border:none!important; padding: 15px 10px}
#show-menu .sns-icons li a:hover{background-color: #000; padding: 15px 10px}

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

#show-menu{padding-top: 30px}
#show-menu li{font-size: 18px}
#show-menu li a span{font-size: 10px}

}



.bt{display: block; color:#fff; border:solid 1px #fff; width: 250px; text-align: center; padding: 10px; font-size: 14px; letter-spacing: 2px; font-weight: bold;position: relative; overflow: visible}
@media (min-width: 800px) {
.bt:hover{color:#2d1508; background-color: #fff}
}
.bt::after{content:""; display: block; width: 50px; height: 1px; background-color: #fff; position: absolute; top:50%; left: -30px; z-index: 2; margin-top: -1px;opacity: 1;transition: all 0.2s ease-out;animation: anime2 3s ease infinite;}
@media (min-width: 800px) {
.bt:hover::after{background-color: #2d1508}
}
@keyframes anime2 {
  0% {left: -30px;opacity: 1}

  20% {
    left: -20px
  }
  90% {
    left: -20px;opacity: 1
  }
  100% {
    left: -20px;opacity: 0
  }
}

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

SLIDE

*********************************************** **/
#slide{position: relative;width: 100%}

#slide-1{height: 100%;width: 100%}

#slide-1 .slick-slide{
  opacity: 0;
  position: relative
}
#slide-1 .slick-slide.on{
  opacity:1
}
#slide-1 .slick-slide img{
  transition: 8s ease;
  transform: scale(1);
  width: 100%
}
#slide-1 .slick-slide.on img{
  transform: scale(1.05);
}

#slide-1 .slick-dots{text-align: center; position: absolute; bottom:0px; left: 0 ;width: 100%}
#slide-1 .slick-dots li{display: inline-block; width: 10px; height: 10px; margin: 0 5px; background-color: transparent; border:solid 1px #eee; border-radius: 100%; text-indent: -9999px; cursor: pointer}
#slide-1 .slick-dots li.slick-active{background-color:#eee}

.wrap-news{width: 100%; padding: 15px 10px; font-size: 14px}
.wrap-news span{letter-spacing: 1px; font-size: 12px}
.wrap-news a{font-size: 14px;margin-left: 15px; text-decoration: underline}
.wrap-news .fa{margin-left: 10px}


#no-slide{height: 300px; background-color: antiquewhite}
#no-slide h2{position: absolute; top:inherit;left:0; width: 100%; text-align: center; font-size: 38px; color:#000; text-shadow: 0px 0px 0px #fff;letter-spacing: 3px;font-weight: 400;padding-top: 150px}

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

#no-slide h2{font-size: 28px}

}

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

#slide-1{text-align: center;height: 500px}
#slide-1 img{width: auto!important;max-width: inherit; height: 500px}

#slide-1 .slick-slide{text-align: center}
#slide-1 .slick-dots{bottom:0px; left: 0 ;width: 100%}
#slide-1 .slick-dots li{display: inline-block; width: 10px; height: 10px; margin: 0 5px; background-color: transparent; border:solid 1px #eee; border-radius: 100%; text-indent: -9999px; cursor: pointer}

.wrap-news{background-color: #f5f5f5}
.wrap-news span{display: none}
.wrap-news a{margin-left: 0}

#no-slide{height: 200px}
#no-slide h2{font-size: 24px; color:#000;padding-top: 100px;letter-spacing: 1px}

}

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

BOOKING

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

#booking{background-color: #2d1508; color:#fff;}
#booking .inner{padding: 30px 10px}
#booking .bt{position: absolute;top:20px; right:10px;}
#booking p{font-size: 18px; letter-spacing: 2px}


/*
@media screen and (max-width: 500px) {

#booking{position: fixed; bottom:0; left: 0; width: 100%; z-index: 9997}
#booking .inner{padding: 5px 10px}
#booking p{display: none}
#booking .bt{position: relative;top:inherit; right:inherit; margin: 0 auto;border:none;padding: 15px}
#booking .bt::after{display:none}
#booking p{font-size: 16px}

}*/

.bt-chat{display: block;width:120px; height: 120px;position:fixed; bottom:20px; right:10px; z-index: 9999;background-color: #2d1508;color:#fff; text-align: center;border-radius: 100%;padding:30px 10px 0;font-size: 14px;box-shadow: 0 0 3px #333;font-weight: bold;}
.bt-chat:hover{color:#fff;margin-bottom:5px;}

@media screen and (max-width: 500px) {
	#booking{position: fixed; bottom:0; left: 0; width: 100%; z-index: 9997}
	#booking .inner{padding: 5px 10px}
	#booking p{display: none}

	#booking .bt.bt-show-policy {width:50%!important; position: fixed;top:inherit;bottom:0; left:0;right:inherit; margin: inherit;border:none;padding: 15px; z-index: 9997;background-color: #2d1508;}

	#booking .bt.show-chat {width:50%!important; position: fixed;top:inherit;bottom:0; right:0; margin: inherit;border:none;padding: 15px; z-index: 9997;background-color: #754c24;}

	#booking .bt::after{display:none}
	#booking p{font-size: 16px}

	.bt-chat{display: none;}
	
}



.wrap-chat{background-color: #e9ecf4;position: fixed;bottom:10px;right:10px;z-index: 99999;width:90%; height: 90%;box-shadow:0 0 3px #000; border-radius: 6px;max-width: 400px;max-height:700px;display:none;}

@media screen and (max-width: 500px) {
.wrap-chat{bottom:5%;right:5%}
}


.chat-header{background-color: #a67c52;color:#fff;padding: 10px;position: relative;border-radius: 6px 6px 0 0 ;}
.chat-header p{font-size: 14px; font-weight: bold;letter-spacing: 1px;}
.chat-header .icon{background-color: #42210b;border-radius: 100px;width: 50px; height: 50px;display: inline-block;vertical-align: middle;padding: 13px 5px 0;margin-right: 10px;}
.chat-header .bt-close{position: absolute;top:20px;right:20px;width: 20px; height: 20px;;}
.chat-header .bt-close::before{content:""; width: 20px;height:1px;background-color: #fff;display: block;transform:rotate(45deg);position: absolute;top:12px; right:0px}
.chat-header .bt-close::after{content:""; width: 20px;height:1px;background-color: #fff;display: block;transform:rotate(-45deg);position: absolute;top:12px; right:0px}


.chat-body{padding: 20px 10px 50px;overflow-y:scroll;height:80%}
.chat-body .icon{background-color: #42210b;border-radius: 100px;width: 30px; height: 30px;display: inline-block;vertical-align: middle;padding: 0 2px;margin-right: 10px;}

.chat{padding: 10px 0;}
.firstchat{display: block;}
.chat-item{width:auto;max-width:74%; background-color: #fff;padding: 10px;display: inline-block;vertical-align: top;word-wrap: break-word;}
.chat-a .chat-item{border-radius: 0 5px 5px 5px;box-shadow: 1px 1px 3px #999;}
.chat p{font-size: 12px;line-height: 160%;}

.chat ul{margin-top:10px;text-align: center;display: flex;flex-wrap: wrap;}
.chat li{font-weight: bold; font-size: 13px; background-color: #ddd; padding: 10px 2px; border-radius: 3px;width:calc(50% - 10px);  text-align: center;margin: 0 2px 10px;vertical-align: top;}


/*
.chat ul{margin-top:10px;text-align: center;}
.chat li{font-weight: bold; font-size: 13px; background-color: #ddd; padding: 10px 2px; border-radius: 3px;width:calc(50% - 10px); display:inline-block; text-align: center;margin: 0 2px 10px;vertical-align: top;}
*/
.chat-b{text-align: right;}
.chat-b .chat-item{border-radius: 5px 0 5px 5px;box-shadow: 1px 1px 3px #999;text-align:left}

.chat-body .time{font-size: 10px;vertical-align: bottom;display: inline-block;margin:0 5px;}

.chat-layer{background-color:rgba(0,0,0,.8);position: fixed;top:0;left:0;z-index: 99998;width:100%; height: 100%;display:none}


.chat-footer{background-color: #42210b;color:#fff;position: relative;border-radius: 0 0 6px 6px;padding: 20px;text-align: center;position: absolute;bottom:0; left:0;width:100%}
.chat-footer a{text-align: center;font-size: 14px; color:#fff;font-weight: bold;letter-spacing:1px}








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

CONCEPT

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


#sec-03{position: relative; overflow-x: hidden}
#sec-03 .inner{padding: 50px 20px; text-align: center}
#sec-03 h2{font-size: 40px; font-weight: 400; letter-spacing: 2px; color: #2d1508;margin-bottom: 30px}
#sec-03 .desc{line-height: 200%; margin-bottom: 80px; font-size: 14px;letter-spacing: 1px}
#sec-03 h3.title{font-size: 28px; letter-spacing: 2px;margin-bottom: 50px;position: relative; width: 300px;margin: 0 auto 50px auto}
#sec-03 h3.title::before{content:""; width: 70px; height: 1px; position: absolute;left: -50px; top:50%; display: block; background-color: #333}
#sec-03 h3.title::after{content:""; width: 70px; height: 1px; position: absolute;right: -50px; top:50%; display: block; background-color: #333}

#sec-03 .col{padding: 10px;position: relative;overflow: hidden}
#sec-03 .col p{margin-top: 10px; color:#2d1508;letter-spacing: 1px}

#sec-03 .bg-l{position: absolute; top:30px; left: -200px; z-index: -1; width: 600px;opacity: .5}
#sec-03 .bg-r{position: absolute; top:30px; right: -200px;z-index: -1; width: 600px;opacity: .5}
@media (min-width: 800px) {
#sec-03 a:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}
}
#sec-03 .wrap-img{overflow: hidden;position: relative}
#sec-03 .wrap-img .logo{position: absolute; top:50%; left: 50%; margin: -40px 0 0 -70px; width: 140px}

.pc{display: block}
.sp{display: none}


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

.pc{display: none}
.sp{display: block}
#sec-03 .inner{padding: 30px 20px}
#sec-03 h2{font-size: 30px}
#sec-03 .desc{margin-bottom: 40px}
#sec-03 h3.title{font-size: 18px; letter-spacing: 2px;margin-bottom: 50px;position: relative; width: 210px;margin: 0 auto 40px auto}
#sec-03 h3.title::before{content:""; width: 50px; height: 1px; position: absolute;left: -50px; top:50%; display: block; background-color: #333}
#sec-03 h3.title::after{content:""; width: 50px; height: 1px; position: absolute;right: -50px; top:50%; display: block; background-color: #333}

#sec-03 .col{padding: 10px;position: relative;overflow: hidden}
#sec-03 .col p{margin-top: 10px; color:#2d1508;letter-spacing: 1px}

#sec-03 .bg-l{position: absolute; top:30px; left: -250px; z-index: -1; width: 600px;opacity: .2}
#sec-03 .bg-r{position: absolute; top:30px; right: -250px;z-index: -1; width: 600px;opacity: .3}


#sec-03 .wrap-img{overflow: hidden;position: relative}
#sec-03 .wrap-img .logo{position: absolute; top:50%; left: 50%; margin: -40px 0 0 -70px; width: 140px}


}



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

SPECIAL COUPON

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


#sec-04,
#sec-coupon{height: 350px; background-image: url(../images/top/slide/2091.jpg); background-position: center center; background-size: cover;position: relative}


#sec-04::after,
#sec-coupon::after{content:""; width: 100%; height: 350px; background-color: rgba(0,0,0,.4); position: absolute; top:0; left: 0; z-index: 1}
#sec-04 .wrap-coupon,
#sec-coupon .wrap-coupon{position: absolute; top:50%;left: 50%; margin: 50px 0 0 -125px;  z-index: 2; border:solid 1px #fff; padding: 30px;padding-top: 50px; text-align: center; width: 250px; height: 250px;color:#fff;display: block;overflow: hidden}

#sec-04 .wrap-coupon::before,
#sec-coupon .wrap-coupon::before{content:"";width: 50px; height: 1px; display: block; background-color: #fff; position: absolute; top:50%; left: -20px;transition: all 0.2s ease-out;animation: anime2 3s ease infinite;}
#sec-04 .wrap-coupon::after,
#sec-coupon .wrap-coupon::after{content:"";width: 250px; height: 250px; display: block; background-color: #fff; position: absolute; top:0; left: -250px;transition: all 0.2s ease-out;z-index: -1}

@media (min-width: 800px) {
#sec-04 .wrap-coupon:hover,
#sec-coupon .wrap-coupon:hover{background-color:rgba(255,255,255,1); color:#000}
#sec-04 .wrap-coupon:hover::after,
#sec-coupon .wrap-coupon:hover::after{left: 0}
#sec-04 .wrap-coupon:hover::before,
#sec-coupon .wrap-coupon:hover::before{background-color: #000}
}


#sec-04 h3.title,
#sec-coupon h3.title{letter-spacing: 2px; font-size: 26px; font-weight: bold;
-webkit-transform: rotate(-25deg);transform: rotate(-25deg);margin: 20px 0 10px -40px;border-bottom:none}
#sec-04 p,
#sec-coupon p{font-size: 12px;letter-spacing: 2px;-webkit-transform: rotate(-25deg);transform: rotate(-25deg);margin: 0 0 0 10px; text-align: center}




.wrap-coupons{position: fixed; z-index: 9999; width: 100%; top:100px;color:#fff; z-index: 99999;display: none}
.wrap-coupons a{color:#fff;display: block;position: relative}
.wrap-coupons .item{text-align: center;max-width: 800px; margin: 0 auto 10px;padding: 20px; border:solid 1px #fff}
@media (min-width: 800px) {
.wrap-coupons .item:hover{opacity: .8}
}
.wrap-coupons .item i{font-size: 30px;position: absolute; top:50%;margin-top: -15px; right: 0px}
.wrap-coupons .item-01{background-color: #2a150f}
.wrap-coupons .item-02{background-color: #f4b81d}
.wrap-coupons .item-03{
background: #d62d1b; 
background: -webkit-linear-gradient(to top, #eaa013 50%, #d62d1b);
background: linear-gradient(to top, #eaa013 50%, #d62d1b );
}
.wrap-coupons .item img{width: 100%; max-width: 250px}

.layer{position: fixed; top:0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.9); z-index: 9999; overflow: auto;display: none}
.layer .bt-close{color:#fff; font-size: 30px;position: absolute;top:10px; right:30px; z-index: 9999}



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

#sec-04,
#sec-coupon{background-position: center center}

}

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

.wrap-coupons{overflow: auto;height: 100%;top:50px;padding: 10px}
.wrap-coupons .item{padding: 10px}
.wrap-coupons .item i{font-size: 20px;margin-top: -10px}
.wrap-coupons .item img{width: 100%; max-width: 150px}
.wrap-coupons .item p{font-size: 12px}
.layer{position: fixed; top:0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.9); z-index: 9999; overflow: auto;display: none}
.layer .bt-close{color:#fff; font-size: 20px!important;position: absolute;top:10px; right:10px; z-index: 9999}

}

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

SNS

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


#sec-05{padding: 50px 0; background-color: #eee; text-align: center}
#sec-05 .follow{font-size: 18px; font-weight: bold; letter-spacing: 2px}
#sec-05 .follow::after{content:""; width: 50px; height: 1px; background-color: #333; margin: 30px auto; display: block}
#sec-05 .sns-icons li{display: inline-block;margin: 0 5px}
#sec-05 .sns-icons li i{font-size: 40px; color:#444}

.show-pop{position: relative}
.sns-icons .icon{display: inline-block; width: 40px; height: 40px; vertical-align: middle}
.pop{width: 287px; height: 122px; background-image: url(../images/fukidashi.png);position: absolute; bottom:0px; left: -120px;padding-top: 20px;display: none}
.pop.on{bottom:30px}
.pop a img{max-width: 80px}
@media (min-width: 800px) {
.pop a:hover img{opacity: .8}
}

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

.pop{width: 200px; height: inherit; background-image: none; background-color: rgba(0,0,0,.9); position: absolute; bottom:40px!important; left: -40px;padding: 10px 0;display: none}
.sns-icons .icon{width: 30px; height: 30px;}
.pop.on{bottom:30px}
.pop a img{max-width: 60px}

}
/** ***********************************************

FOOTER

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

#footer .inner{padding: 50px 0 0; text-align: center}
#footer p.mincho{font-size: 18px; font-weight: bold;letter-spacing: 2px; margin-bottom: 50px}
#footer .bg-logo{max-width: 100px; position: absolute; top:10px; left: 50%; margin-left: -50px; z-index: -1}

#footer a{font-size: 12px; margin: 0 10px;}
#copyright{display: block; margin: 30px auto; font-size: 10px; letter-spacing: 2px}



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

#footer .inner{padding-bottom: 50px}
#footer p.mincho{font-size: 12px;}
#footer .bg-logo{max-width: 60px;top:20px; margin-left: -30px}
#footer a{font-size: 10px; margin: 0 10px;}

}



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

ASIA

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

#asia #sec-03 .inner{padding: 50px 20px 80px; max-width: 840px}
#asia #sec-03 .desc{ margin-bottom: 0px; font-size: 16px;letter-spacing: 1px}

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

#asia #sec-03 .inner{padding: 60px 20px; max-width: 840px}
#asia #sec-03 .desc{ margin-bottom: 0px; font-size: 16px;letter-spacing: 1px}
#asia #sec-03 h2{font-size: 34px;}

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

#asia #sec-03 .inner{padding: 60px 20px}
#asia #sec-03 h2{font-size: 28px;}
#asia #sec-03 .desc{ margin-bottom: 0px; font-size: 14px;text-align: left}

}

#asia #sec-04{background-image: url(../images/asia/room-img.jpg); text-align: center;height: 400px;}
#asia #sec-04::after{height: 400px}
#asia #sec-04 h3{font-size: 50px; text-shadow: 3px 3px 3px #333; color:#fff; letter-spacing: 3px; font-weight: 300}
#asia #sec-04 .txts{position: relative; z-index: 2;padding: 80px 0 0 0}
#asia #sec-04 .bt{margin: 50px auto 0; padding: 18px 0; font-size: 16px;}
#asia #sec-04 p{-webkit-transform: rotate(0deg);transform: rotate(0deg)}


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

#asia #sec-04{height: 300px;}
#asia #sec-04::after{height: 300px}
#asia #sec-04 h3{font-size: 40px}
#asia #sec-04 .txts{position: relative; z-index: 2;padding: 60px 0 0 0}
#asia #sec-04 .bt{margin: 50px auto 0; padding: 18px 0; font-size: 16px}

}


@media screen and (max-width: 500px) {
#asia #sec-04 h3{font-size: 34px;font-weight: 400}
#asia #sec-04 .bt{margin: 50px auto 0;width:250px; padding: 10px 0; font-size: 16px}
}

#asia #sec-concept .inner{padding: 100px 10px; max-width: 1200px}
#asia #sec-concept .col-img{width: 35%}
#asia #sec-concept .col-txt{padding-right: 50px;width: 65%}
#asia #sec-concept .wrap-img{max-width: 400px; height: 400px; overflow: hidden;position: relative;margin: 0 auto}
#asia #sec-concept .wrap-img img{width: auto; height: auto;  position: absolute; top:0; left: 0; right:0; bottom:0; margin: auto;}

#asia #sec-concept p{font-size: 16px; letter-spacing: 1px; line-height: 220%; font-weight: 300}
.bt-bk{border:solid 1px #000; color:#000;margin: 50px 0 0; padding: 18px 0; font-size: 16px}
.bt-bk::after{background-color: #000}
@media (min-width: 800px) {
.bt-bk:hover{background-color: #000; color:#fff}
.bt-bk:hover::after{background-color: #eee}
}


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

#asia #sec-concept .inner{padding: 30px}
#asia #sec-concept .col-img{width: 100%; margin-top: 20px}
#asia #sec-concept .col-txt{padding-right: 0;width: 100%}
#asia #sec-concept .wrap-img{height: 250px}
#asia #sec-concept p{font-size: 14px;line-height: 200%}
.bt-bk{margin: 50px auto 0;}

}


#sec-campaign{border-top:solid 1px #ddd; padding-top: 10px; text-align: center}
.title-bd{font-size: 30px; letter-spacing: 2px;margin: 30px auto 50px}
#sec-campaign .slick{padding-bottom: 50px;margin-bottom: 20px}
#sec-campaign .slick-arrow{position: absolute; top:50%; font-size: 40px; margin-top: -50px; z-index: 2; font-weight: 300;opacity: .6}
#sec-campaign .slick-prev{left:5%}
#sec-campaign .slick-next{right:5%}

#sec-campaign .slick li.slick-slide{opacity: .4}
#sec-campaign .slick li.slick-active{opacity: 1}

#sec-campaign .slick-dots li{background-color:rgba(0,0,0,.2)}
#sec-campaign .slick-dots li.slick-active{background-color:#000}


#sec-campaign .inner{padding: 50px 20px 50px; max-width: inherit; background-color: #f5f5f5}
#sec-campaign .bns{text-align: center;}
#sec-campaign .bns li{display: inline-block; vertical-align: middle; margin: 10px}



#sec-map{line-height: 0; border-bottom:solid 1px #fff}
#sec-map iframe{width: 100%; height: 400px}

#sec-05 .ft-nav{border-top:solid 1px #ddd; padding-top: 40px; margin-top: 30px; text-align: center}
#sec-05 .ft-nav li{display: inline-block; }
#sec-05 .ft-nav li a{display: block;  font-size:14px;margin-right:14px; padding-right: 15px; border-right:solid 1px #ccc}
#sec-05 .ft-nav li:last-child a{border-right:none}


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

#sec-05 .ft-nav li a{margin-bottom: 10px; font-size: 12px}
.title-bd{font-size: 18px; margin: 10px auto 30px}

}

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

#sec-campaign .bns li{margin: 10px 5px; width: 45%}
#sec-campaign .bns img{width: auto; height: auto}

}


#sec-news{border-top:solid 1px #ddd; padding-top: 10px; text-align: center; padding-bottom: 50px}
#sec-news .inner{max-width: 800px;padding: 0 10px}
.news-list li{border-bottom:solid 1px #ddd; padding-bottom: 9px; margin-bottom: 10px; text-align: left}
.news-list li span.date{font-size: 13px; margin-right: 20px; letter-spacing: 2px}
.news-list li a{color:#0071bc}
.news-list span.new{background-color: #de1c24; color:#fff; font-size: 12px; padding: 0 10px; display: inline-block}
.news-page{min-height: 300px; padding: 50px 0!important}


#sec-topic{border-top:solid 1px #ddd; padding-top: 10px; text-align: center; padding-bottom: 50px}
#sec-topic .inner{min-height: 200px}

.topic-list li{padding: 10px;position:relative}
.topic-list li a{position:relative;display: block}
.topic-list .wrap-img{width: 100%; height: 200px; background-position: center; background-size: cover}
.topic-list .name{margin-top: 10px; text-align: left}
.topic-list .more{font-size: 12px;margin-top: 10px; display: block;color:#0071bc}
.topic-list li a .new{position: absolute; top:0; left: 0; background-color: #de1c24; color:#fff;  font-size: 12px; padding: 0 10px; display: block}


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

.topic-list li a{font-size: 13px}
.news-list li span.date{font-size: 10px; margin-right: 10px;letter-spacing: 1px}
.news-list li a{font-size: 12px}
.news-list span.new{font-size: 10px;padding: 0 5px}

}

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

.topic-list li{padding: 0 10px 20px;width: 100%}
.topic-list li p.name{font-size: 12px!important}

}


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

ROOM/CHARGE

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

.no-hd-img{padding-top: 140px;background-color:rgba(45,21,7,1.00); color:#fff; text-align: center;position: relative}
.no-hd-img h2{letter-spacing: 2px;padding: 20px 10px ;color:#fff;display: block!important;font-size: 30px!important}
.no-hd-img .back{border:none; background-color: rgba(45,21,7,1.00);font-size: 14px; padding: 10px 20px;position: absolute;top:-50px; left: 10px;border-radius: 100px;border:solid 1px #eee;width: 150px}
.no-hd-img .back a{color:#fff;display: block}
.sec-common{padding: 50px 0}

.page #slide-1{height: 650px}
.page h2{position: absolute; top:300px;left:0; width: 100%; text-align: center; font-size: 38px; color:#fff; text-shadow: 2px 2px 2px #333;letter-spacing: 3px;font-weight: 400}

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

.page #slide-1{height: 500px}
.page #slide-1 img{width: auto;max-width: inherit; height: 500px}
.page h2{position: absolute; top:50%;left:0; width: 100%; text-align: center; color:#fff; text-shadow: 2px 2px 2px #333;letter-spacing: 3px;font-weight: 400;font-size: 28px}

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

.sec-common{padding: 0}
.page h2{font-size: 24px}

}

#sec-rooms .block{margin-bottom: 50px;position: relative}
#sec-rooms .col{padding: 10px}
#sec-rooms .r-type{font-size: 28px; font-weight: 400; letter-spacing: 2px;margin-bottom: 20px;color:#2d1508}


#sec-rooms .detail{display: none; position: absolute; top:50%; left:50%;margin: -20px 0 0 -100px; text-align: center;width: 200px; color:#fff;letter-spacing: 1px;background-color: rgba(0,0,0,.8);padding: 20px 10px}
#sec-rooms .slide-room a:hover .detail{display: block}

#sec-rooms .wrap-price table{width: 100%;border-spacing: 0}
#sec-rooms .wrap-price th{text-align: center;color:#fff;background-color: #2d1508;padding: 10px 5px;font-size: 13px;font-weight: 300;line-height: 180%}
#sec-rooms .wrap-price td{padding: 15px 5px 0;font-size: 14px;text-align: center;letter-spacing: 2px}
#sec-rooms .wrap-price th a{color:#fff; text-decoration: underline;position: relative;display: block;overflow: visible}
.tooltip{text-align: left; position: absolute;bottom:40px;left: 0; background-color: #efefcb; color:#333;padding: 10px;display: block; text-decoration: none;width: 170px;box-shadow: 2px 2px 1px #333;letter-spacing: 1px;display: none;z-index: 2}
.tooltip.last{left:inherit;right:0;width: 250px}
#sec-rooms .wrap-price th a:hover .tooltip{display: block}
#sec-rooms .wrap-price th span{display: block; font-size: 11px}
#sec-rooms .wrap-price .note{font-size: 12px; margin-top: 20px; text-align: right}

#sec-rooms .bts{margin-top: 30px; text-align: center}
#sec-rooms .bt{border:solid 1px #000; color:#000;display: inline-block;padding: 15px 10px}
#sec-rooms .bt:after{display: none}
#sec-rooms .bt-2{background-color: #efefcb}

@media screen and (max-width: 500px) {
#sec-rooms{padding-top: 30px}
#sec-rooms .bt{margin-bottom: 10px;font-size: 12px}
#sec-rooms .r-type{font-size: 20px;position: absolute;top:0;z-index: 2}
#sec-rooms .block{margin-bottom: 30px;padding-top: 30px}
#sec-rooms .wrap-price th{text-align: center;color:#fff;background-color: #2d1508;padding: 5px;font-size: 12px;font-weight: 300;line-height: 180%}
#sec-rooms .wrap-price td{padding: 15px 0px 0;font-size: 12px;text-align: center;letter-spacing: 2px}
#sec-rooms .wrap-price .note{font-size: 10px; margin-top: 20px; text-align: left}
}

.slide-room li.slick-slide{position: relative}
.slide-room .num{background-color: rgba(0,0,0,.8);display: block; position: absolute; top:0; left: 0; font-size: 16px; font-weight: bold;padding: 10px 20px;color:#fff}

.slide-thumbs{padding: 10px 5px 40px}
.slide-thumbs li.slick-slide{padding: 0 5px;cursor:pointer}
.slide-thumbs .slick-dots{text-align: center; position: absolute; bottom:0px; left: 0 ;width: 100%}
.slide-thumbs .slick-dots li{display: inline-block; width: 10px; height: 10px; margin: 0 3px;background-color:rgba(0,0,0,.2); border-radius: 100%; text-indent: -9999px; cursor: pointer}
.slide-thumbs .slick-dots li.slick-active{background-color:#000}
.slide-thumbs .slick-arrow{position: absolute; color:#eee;top:50%; font-size: 24px; margin-top: -40px; z-index: 2}
.slide-thumbs .slick-prev{left:15px}
.slide-thumbs .slick-next{right:15px}

@media screen and (max-width: 840px) {
#sec-rooms .col{padding: 10px;width: 100%}
.slide-thumbs {display: none!important}
}
@media screen and (max-width: 500px) {
.slide-room .num{font-size: 14px;padding: 5px 10px;}
}



/** 料金表 **/
.wrap-price-table{width: 100%; height: 100%; position: fixed;top:0;left: 0; background-color: rgba(0,0,0,.9);z-index: 9999;padding-top: 30px; overflow: auto;display: none}

.wrap-price-table .tab-menu{margin-bottom: 20px;width: 800px;margin: 0 auto 30px;font-size: 0}
.wrap-price-table .tab-menu li{text-align: center;display: inline-block;margin: 0;font-size: 14px}
.wrap-price-table .tab-menu li a{color:#333; font-size: 16px;display: block; padding: 8px 30px;text-align: center; min-width: 150px; background-color: #fff}
.wrap-price-table .tab-menu li:first-child a{border-radius: 3px 0 0 3px}
.wrap-price-table .tab-menu li:last-child a{border-radius: 0 3px 3px 0}
.wrap-price-table .tab-menu li a.on{background-color:#b90c0c;color:#fff;font-weight: bold}


.wrap-price-table table{width: 900px; margin: 0 auto 30px; border-spacing: 1px;background-color: #ddd}
.wrap-price-table table th{background-color:rgba(90,64,51,1.00);padding: 6px 10px;font-size:13px;text-align: center;color:#fff;letter-spacing: 1px}
.wrap-price-table table td{background-color: #fff;padding: 15px 10px;font-size:14px;text-align: center;letter-spacing: 1px}
.wrap-price-table table td.td-gray{background-color: #eee!important; font-weight:bold}
.wrap-price-table table .tr2 th{background-color:rgba(104,86,67,1.00)}
.wrap-price-table table .tr3 th{background-color:rgba(135,112,87,1.00)}

.bt-close{font-size: 30px; color:#ddd; font-style: normal;position: fixed; top:10px; right:30px;cursor: pointer}

td.tp-c,
td.tp-b,
td.tp-a,
td.tp-s,
td.tp-ss{white-space:nowrap}

td.thisroom{width: 40%;background-color: #eee!important;font-weight: bold}

.this-room{position: relative;display: block;margin-top: 50px; background-color: #fff}
.this-room .tab-menu li a{color:#fff; font-size: 16px;display: block; padding: 8px 30px;text-align: center; min-width: 150px; background-color: #333}


@media screen and (max-width: 840px) {
.wrap-price-table {padding: 20px}
.wrap-price-table .tab-menu{width: 100%}
.wrap-price-table .tab-menu li a{font-size: 14px}
.wrap-price-table table{width: 100%}
.wrap-price-table table th{padding: 6px;font-size:12px}
.wrap-price-table table td{padding: 6px;font-size:12px}
.bt-close{font-size:30px!important; top:10px; right:10px}
}
@media screen and (max-width: 500px) {
.wrap-price-table{width:100%;overflow-x: scroll; -webkit-overflow-scrolling: touch;overflow-scrolling: touch}
.wrap-price-table table{width: 600px}
}


/** ポップアップ部屋 **/
.wrap-room{background-color: rgba(0,0,0,.95);position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 9999;padding-top: 50px;padding-bottom: 100px; overflow: auto;color:#fff;display: none}
#sec-room_type .wrap-room{position: inherit; z-index: 1!important}

.wrap-room .in{max-width: 900px;margin: 0 auto;position: relative}
.wrap-room .desc{color:#fff;padding: 30px 10px}
.wrap-room .desc p{line-height: 180%;font-size: 16px}
.wrap-room .num{font-size: 28px;letter-spacing: 1px;padding: 3px;font-weight: normal; position: relative}
.wrap-room .type{font-size: 14px;letter-spacing: 1px;font-weight: normal}
.wrap-slide{position: relative;}
.wrap-room .bts{text-align: center}

.pop-slide-room{border:solid 3px #fff;margin-bottom: 20px}
.pop-slide-room iframe{width: 100%; height: 580px!important}

.pop-room-thumbs{width: 458px; margin: 0 auto}
.pop-room-thumbs .slick-slide{border:solid 1px #000;position: relative}
.pop-room-thumbs .slick-current{border:solid 1px #fff}
.pop-room-thumbs li{margin: 0 5px}
.pop-room-thumbs .movie{background-color: #000;width: 100%;height: 70px}
/*.pop-room-thumbs .movie::after{content:"";display: block;width: 100%;height: 100%;background-color: rgba(0,0,0,.4);position: absolute;top:0;left: 0}*/
.pop-room-thumbs .movie i{color:#fff;position: absolute;top:50%;left: 50%; margin: -10px 0 0-10px;font-size: 20px; z-index: 2}


.pop-room-thumbs .slick-arrow{position: absolute; color:#eee;top:50%; font-size: 24px; margin-top: -18px; z-index: 2}
.pop-room-thumbs .slick-prev{left:15px}
.pop-room-thumbs .slick-next{right:15px}

.wrap-room .wrap-info{max-width: 700px; margin: 0 auto}
.wrap-room .bt{border:none;display: inline-block;padding: 20px 10px; background-color: rgba(45,21,7,1.00);color:#fff;margin: 0 10px;font-size: 16px}
.wrap-room .bt:after{display: none}
.wrap-room .bt-2{background-color: #efefcb;color:#333}
i.bd{display: inline-block;width: 30px;height: 8px;margin-right: 10px; border-top:solid 1px #fff}
.wrap-room .bt-2 i.bd{border-top:solid 1px #333}

.wrap-room .prev,
.wrap-room .next{font-size: 20px;color:#fff;letter-spacing: 2px;border-bottom:solid 1px #fff; padding-bottom: 5px;position: fixed;top:50%;margin-top: -10px}
.wrap-room .prev{left:5%;padding-left: 20px; line-height: 120%}
.wrap-room .prev::after{content:"前の部屋";display: block;font-size: 12px;color:#666}

.wrap-room .next{right:5%;padding-right: 20px; line-height: 120%}
.wrap-room .next::after{content:"次の部屋";display: block;font-size: 12px;color:#666}


.roompage{display: block;position: relative;padding: 0;background-color: #fff;color:#333}
.roompage .desc{color:#333;padding: 30px 10px}
.roompage .prev,
.roompage .next{display: none}
.roompage .bt-1{color:#fff!important}
.roompage .slick-slide{border:solid 1px #fff}
.roompage .slick-current{border:solid 1px #000}

@media screen and (max-width: 840px) {
.pop-slide-room{border:none;margin-bottom: 0px}
.pop-slide-room iframe{height: 450px!important}
.pop-room-thumbs{margin-top: 20px}
.wrap-room{padding-top: 120px}
.wrap-room .prev,
.wrap-room .next{font-size: 14px;border-bottom:none; padding-bottom: 5px;position: absolute;top:-70px; margin-top: 0px}
.wrap-room .prev{left:0px;padding: 10px; line-height: 120%; background-color: #222}
.wrap-room .next{right:0px;padding: 10px; line-height: 120%; background-color: #222}
.wrap-room .prev::after{content:"前の部屋";display: block;font-size: 12px;color:#666}
.wrap-room .next::after{content:"次の部屋";display: block;font-size: 12px;color:#666}
.wrap-room .desc p{line-height: 160%}
}
@media screen and (max-width: 500px) {
.pop-slide-room iframe{height: 246px!important}
.pop-room-thumbs{display: none!important}
.wrap-room .next{font-size: 12px}
.wrap-room .prev::after{font-size: 10px}
.wrap-room .next::after{font-size: 10px}
.wrap-room .desc p{line-height: 160%;font-size: 14px}
.wrap-room .bt{display: none}
}




/** TRAVEL **/
#sec-travel .desc{margin-bottom: 30px;font-size: 16px;letter-spacing: 1px}
#sec-travel .topic-list li{margin-bottom: 20px}
#sec-travel p.name{font-size: 15px;letter-spacing: 1px}
#sec-travel .topic-list li .more{font-size: 14px}
#sec-travel i.icon-new{position: absolute; top:0;left: 0; display: block; font-style: normal;z-index: 10;width: 100px;text-align: center;font-size: 10px;padding: 2px;background-color: #de1c24;color:#fff}



#pager{margin-top: 30px;text-align: center}
#pager span{display: inline-block;vertical-align: top;width: 30px; height: 30px;background-color: rgba(90,64,51,1.00); color: #fff;padding-top: 2px;font-size: 16px;margin: 0 2px;border-radius: 3px}
#pager a{display: inline-block;vertical-align: top;width: 30px; height: 30px;background-color: #eee;padding-top: 2px;font-size: 16px;margin: 0 2px;border-radius: 3px}


@media screen and (max-width: 500px) {
#sec-travel .desc{margin-bottom: 10px}
#sec-travel .desc p{padding: 10px;font-size: 14px}
}



/** ACCESS **/
#sec-access{max-width: 900px;margin: 0 auto}
#sec-access .col{padding: 10px}
#sec-access .col-1{text-align: center}
#sec-access table{width: 100%;margin: 0 0 20px 0}
#sec-access th{padding: 10px; background-color: #eee;font-size: 16px;letter-spacing: 1px}
#sec-access td{padding: 10px; background-color: #fff;font-size: 16px;letter-spacing: 1px}
#sec-access .bt{background-color:#efefcb;  border:solid 1px #000; color:#000;display: inline-block;padding: 15px 10px;margin-top: 30px; width: 100%;  max-width: 600px!important;  font-size: 16px}
#sec-access .bt i{font-size: 24px;margin-right: 5px}
#sec-access .bt:after{display: none}


@media screen and (max-width: 500px) {
#sec-access {padding: 30px 0}
#sec-access table th{display: block;font-size: 14px}
#sec-access table td{display: block;font-size: 14px}
#sec-access .block{padding: 0 10px;font-size: 14px}
#sec-access .bt{font-size: 14px}
}



/** SURPRISE **/
#sec-surprise{max-width: 800px;margin: 0 auto}
#sec-surprise .desc{padding-bottom: 20px}
#sec-surprise p{margin-bottom: 1em;line-height: 160%}
#sec-surprise h3.title{margin-bottom: 10px}
#sec-surprise .form{width: 100%; background-color:#f5f5f5;padding: 10px}
#sec-surprise .form td{padding: 10px; vertical-align: top}
#sec-surprise label{display: block; font-size: 16px;margin-bottom: 5px}
#sec-surprise .req{font-size: 10px; color:#de1c24}
#sec-surprise .form input[type="text"],
#sec-surprise .form input[type="email"]{width: 100%; padding: 8px; font-size: 16px;
border: 1px solid #bbbbbb;border-radius: 2px;background: #fff;}
#sec-surprise .note{font-size: 10px}
td.td50{width: 50%}
td.td100{width: 100%}
.no-pd{padding-top: 0!important}
.pdb0{padding-bottom: 0!important}

#sec-surprise .form textarea{width: 100%; height: 200px; padding: 8px; font-size: 16px;
border: 1px solid #bbbbbb;
	border-radius: 2px;
	background: #ffffff;
}
#sec-surprise label.label-radio{display: inline-block; vertical-align: middle; margin-right: 10px;padding: 10px}

#sec-surprise .bt-submit{border:none;display: inline-block;padding: 20px 10px; background-color: rgba(45,21,7,1.00);color:#fff;margin: 0 10px;font-size: 16px; font-weight: 500;width: 50%}
#sec-surprise .bt-back{background-color: #999;width: 40%}
#sec-surprise .disabled{opacity: .6}
#sec-surprise .error{font-size: 12px; color:#de1c24}
.cp_ipselect {
	overflow: hidden;
	width: 100%;
	margin: 0;
	text-align: center;
}
.cp_ipselect select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}

.cp_ipselect select::-ms-expand {
    display: none;
}
.cp_ipselect.cp_sl01 {
	position: relative;
	border: 1px solid #bbbbbb;
	border-radius: 2px;
	background: #ffffff;
}
.cp_ipselect.cp_sl01::before {
	position: absolute;
	top: 15px;
	right: 0.9em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #666666;
	pointer-events: none;
}
.cp_ipselect.cp_sl01 select {
	padding: 8px 38px 8px 8px;
	color: #666666;
	font-size: 16px
}



.wrap-form{width: 100%;font-size: 0;overflow: hidden}
.wrap-form form{width:100%;margin-left: 0;display: inline-block;vertical-align: top;font-size: 14px;display: block}
.wrap-form form.on{margin-left: -100%}
.confirm {width: 100%;display: inline-block;vertical-align: top;font-size: 14px;display: none}
.confirm table{width: 100%}
.confirm th{background-color: #eee;padding: 10px;font-size: 16px;width: 200px}
.confirm td{background-color: #fff;padding: 10px;font-size: 16px}



@media screen and (max-width: 840px) {
#sec-surprise p{padding: 0 10px 1em}
#sec-surprise h3.title{padding-left: 10px;}
}
@media screen and (max-width: 500px) {

#sec-surprise{padding-top: 30px}
#sec-surprise p{font-size: 14px; padding: 0 10px 1em}
#sec-surprise h3.title{margin-bottom: 10px;padding-left: 10px;font-size: 16px}
#sec-surprise .form{width: 100%; background-color:#f5f5f5;padding: 10px}
#sec-surprise .form td{padding: 10px}
#sec-surprise label{display: block; font-size: 16px;margin-bottom: 5px}
#sec-surprise .form input[type="text"],
#sec-surprise .form input[type="email"]{width: 100%; padding: 8px; font-size: 16px;
border: 1px solid #bbbbbb;border-radius: 2px;background: #ffffff;}
#sec-surprise .note{font-size: 10px}
td.td50{width: 100%;display: block; font-size: 12px}
td.td100{width: 100%;font-size: 12px}
td.td50 label,
td.td100 label,
td label{font-size: 14px!important}
.no-pd{padding-top: 0!important}
.pdb0{padding-bottom: 0!important}
#sec-surprise .form textarea{width: 100%; height: 200px; padding: 8px; font-size: 16px;
border: 1px solid #bbbbbb;
	border-radius: 2px;
	background: #ffffff;
}
#sec-surprise label.label-radio{display: inline-block; vertical-align: middle; margin-right: 10px;padding: 10px}
#sec-surprise .bt-submit{width: 100%;margin: 0; margin-bottom: 10px; font-size: 14px; padding: 10px}
#sec-surprise .bt-back{width: 100%;margin: 0; margin-bottom: 30px; font-size: 14px; padding: 10px}


.confirm th{background-color: #eee;padding: 10px;font-size: 14px;width: 100%;display: block}
.confirm td{background-color: #fff;padding: 10px;font-size: 14px;width: 100%;display: block}


}



.wrap-policy{background-color: rgba(0,0,0,.95);position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 10000;padding-top: 50px;padding-bottom: 100px; overflow: auto;display: none}
.wrap-policy .in{max-width:800px; margin: 0 auto;border:solid 1px #333; padding: 30px 40px; background-color: #fff; position: relative;color:#333}
.wrap-policy h3{text-align: center; margin-bottom: 30px}
.wrap-policy li{list-style: disc;margin-left: 10px; margin-bottom: 1em;}
.wrap-policy textarea{display: block; padding: 3px; font-size: 14px;margin-bottom: 1em;max-width: 100%; height: 200px}
.wrap-policy label{display: block; margin-bottom: 1em;text-align: center}
.wrap-policy .note{font-size: 14px; margin-bottom: 30px}
.wrap-policy .bt{background-color: #b90c0c;margin: 0 auto;padding: 20px; font-size: 16px;max-width: 300px;width: auto}
.wrap-policy .bt::after{display:none}
@media (min-width: 800px) {
.wrap-policy .bt:hover{color:#fff; opacity:.8}
}
.wrap-policy .disabled{ pointer-events: none;opacity: .4}

@media screen and (max-width: 500px) {
.wrap-policy{padding-top: 0px}
.wrap-policy .in{border:none; padding: 40px 30px 3px}
.wrap-policy  h3{font-size: 16px}
.wrap-policy li{list-style: disc;margin-left: 10px; margin-bottom: 1em;font-size: 14px}
.wrap-policy textarea{display: block; padding: 3px; font-size: 14px;margin-bottom: 1em;max-width: 100%; height: 200px}
.wrap-policy label{display: block; margin-bottom: 1em;text-align: center}
.wrap-policy .note{font-size: 14px; margin-bottom: 30px}
.wrap-policy .bt{background-color: #b90c0c;margin: 0 auto;padding: 20px; font-size: 16px;max-width: 300px;width: auto}
}





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

PAGE CONCEPT

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



#concept .block{padding-bottom: 50px}
#concept .block p{font-size: 16px; margin-bottom: 1em; line-height: 180%; letter-spacing: 1px}


#concept .block-1{max-width: 800px; margin: 0 auto}
#concept .block-1 h3{font-size: 50px; text-shadow: 3px 3px 3px #ccc; letter-spacing: 3px; font-weight: 500; text-align: center; margin-bottom: 50px; padding-top: 50px}
#concept .block-1 p{font-size: 18px;  line-height: 180%; letter-spacing: 1px}

#concept .block-2{max-width: 900px; margin: 0 auto}
#concept .block-2 img{width: 100%; height: auto; display: block; margin-bottom: 30px}


#concept .block-3{background-image: url(../asia/images/95.jpg); background-size: 500px; background-repeat: repeat;padding-bottom: 0}
#concept .block-3 .in{max-width: 900px; margin: 0 auto;padding: 50px 0}
#concept .block-3 h3{font-size: 38px; text-shadow: 3px 3px 3px #ccc; letter-spacing: 3px; font-weight: 500; text-align: center; margin-bottom: 50px}
#concept .block-3 img{width: 100%; height: auto; display: block; margin-top: 30px}
#concept .wrap-img{padding: 0 10px}
#concept .col{padding: 10px}


#concept .block-4{background-color: #efefcb}
#concept .block-4 .in{max-width: 900px; margin: 0 auto;padding: 50px 0 0}
#concept .block-4 h3{font-size: 42px; letter-spacing: 3px; font-weight: 500; text-align: center; margin-bottom: 50px}
#concept .block-4 img{width: 100%; height: auto; display: block; margin-top: 30px}


#concept .block-4 .title-h4{background-color: rgba(45,21,9,1.00); color:#fff; font-size: 18px; padding: 15px 30px; letter-spacing: 2px}
#concept .block-4 .texts{padding: 20px 20px 40px;}
#concept .block-4 .texts:last-child{padding-bottom: 0}
#concept .block-4 .bt{border:solid 1px #000; color:#000; background-color: #fff; display: inline-block;padding: 15px 10px; font-size: 16px}
#concept .block-4 .bt::after{background-color: #2d1508}


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

#concept .block{padding: 0 10px 50px}

#concept .block-1 h3{font-size: 36px}
#concept .block p{padding: 0 20px;font-size: 16px}
#concept .block-3 h3{font-size: 30px}
#concept .block-4 h3{font-size: 30px}
#concept .block-4 .title-h4{font-size: 16px}
#concept .block-4 p{padding: 0 10px}

}

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

#concept .block{padding: 0 0px 50px}
#concept .col{padding: 0 10px}
#concept .block-1 h3{font-size: 30px}
#concept .block p{padding: 0 10px;font-size: 14px}
#concept .block-2 img{margin-bottom: 10px}
#concept .block-3 h3{font-size: 26px}
#concept .block-3 img{margin-top: 10px}
#concept .block-4 h3{font-size: 26px}
#concept .block-4 .title-h4{font-size: 16px;padding: 15px 10px;}
#concept .block-4 .texts{padding: 20px 0px 40px;}
#concept .block-4 img{margin-top: 10px}
#concept .block-4 .bt{margin: 20px auto 0; display: block}


}



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

PAGE MEMBERS

*********************************************** **/
#sec-member-policy .inner{max-width: 900px}
#sec-member-policy .block{padding: 50px 0;border-bottom:solid 1px #ddd}
#sec-member-policy .block:last-child{border-bottom:none}
#sec-member-policy h3.mincho{font-size: 28px;margin-bottom: 20px}
#sec-member-policy .block p{font-size: 16px; margin-bottom: 1em; line-height: 180%; letter-spacing: 1px;padding: 0 0px}

#sec-member-policy .wrap-price{padding: 20px 0px}
#sec-member-policy .wrap-price table{width: 100%;border-spacing: 0}
#sec-member-policy .wrap-price th{text-align: center;color:#fff;background-color: #2d1508;padding: 10px 5px;font-size: 13px;font-weight: 300;line-height: 180%;border-bottom:solid 1px #ddd}
#sec-member-policy .wrap-price td{padding: 15px 10px;font-size: 14px;text-align: left;letter-spacing: 2px;border-bottom:solid 1px #ddd}

#sec-member-policy .block-1 tr:nth-of-type(2n) td{background-color: #eee}
#sec-member-policy .block-1 tr td:nth-of-type(1){white-space: nowrap;font-weight: bold}
#sec-member-policy .block-1 tr td:nth-of-type(4){width: 250px}


#sec-member-policy .wrap-price th a{color:#fff; text-decoration: underline;position: relative;display: block;overflow: visible}
.tooltip{text-align: left; position: absolute;bottom:40px;left: 0; background-color: #efefcb; color:#333;padding: 10px;display: block; text-decoration: none;width: 170px;box-shadow: 2px 2px 1px #333;letter-spacing: 1px;display: none;z-index: 2}
.tooltip.last{left:inherit;right:0;width: 250px}
@media (min-width: 800px) {
#sec-member-policy .wrap-price th a:hover .tooltip{display: block}
}

#sec-member-policy .wrap-price th span{display: block; font-size: 11px}
#sec-member-policy .wrap-price .note{font-size: 12px; margin-top: 20px; text-align: right}


#sec-member-policy .block-2 tr:nth-of-type(2n) td{background-color: #eee}
#sec-member-policy .block-2 tr td:nth-of-type(1){white-space: nowrap;font-weight: bold}
#sec-member-policy .block-2 tr td:nth-of-type(2){width: 200px}
#sec-member-policy .block-2 tr td:nth-of-type(4){white-space:nowrap}

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

#sec-member-policy .block{padding: 30px 10px}

}

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


#sec-member-policy h3.mincho{font-size: 18px;margin-bottom: 10px}
#sec-member-policy .block p{font-size: 12px}
#sec-member-policy .wrap-price th{text-align: center;color:#fff;background-color: #2d1508;padding: 5px;font-size: 12px;font-weight: 300;line-height: 180%}
#sec-member-policy .wrap-price td{padding: 10px;font-size: 12px;text-align: center;letter-spacing: 2px}
#sec-member-policy .wrap-price .note{font-size: 10px; margin-top: 20px; text-align: left}

#sec-member-policy .wrap-price{width: 100%; overflow-x: auto}
#sec-member-policy .wrap-price table{width: 700px}

}



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

PAGE NEWS

*********************************************** **/
#sec-news .block{padding: 50px}


#sec-page .inner{max-width: 900px;padding: 0 10px}
#sec-page p{margin-bottom: 1em; line-height: 180%}
#sec-page dt{margin-bottom: 10px}
#sec-page dd{margin-bottom: 1em; line-height: 180%}
#sec-page img{max-width: 100%;height: auto}

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

#sec-page .inner{padding: 20px 10px}
#sec-page p{font-size: 14px}
#sec-page a{font-size: 14px}

}

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

PAGE TRAVEL

*********************************************** **/
#travel-top{}
#cover{background-position: center; background-size: cover;height: 200px; text-align: center; font-size: 20px;padding-top: 120px;position: relative}
#cover::after{content:""; display: block; width: 100%; height: 200px; background-color: rgba(0,0,0,.4);position: absolute;top:0; left: 0}
#cover h2{letter-spacing: 2px; font-weight: normal;color:#fff;position: relative; z-index: 2}

.bnavi{padding: 5px 10px; max-width: 1200px; margin: 0 auto}
.bnavi li{display: inline-block;font-size: 12px;color:#999}
.bnavi li::after{content: " / "}
.bnavi a{font-size: 12px}


#sec-2cols{padding: 0 10px}
#sec-2cols .left-contents{width: 70% ;padding-bottom: 50px; min-height: 500px}
#sec-2cols .right-contents{width: 25%;margin-left: 5%;padding-top: 60px }

h3.title{font-size: 26px;border-bottom:solid 1px #eee; padding-bottom: 5px;margin-top: 20px;margin-bottom: 5px;letter-spacing: 1px}
#sec-2cols .left-contents .date,
#sec-single .date{font-size: 12px; color:#666;letter-spacing: 1.5px;display: block; text-align: right}

#sec-2cols h4.title-01{color:rgba(106,168,79,1.00);font-size: 22px; margin-bottom: 30px;padding: 5px; border-bottom:solid 1px #333;letter-spacing: 2px}
#sec-2cols h4.title-02{font-size: 22px; margin-bottom: 30px; background-color: #eee;padding: 5px 10px; border-left:solid 4px #000;letter-spacing: 2px}
#sec-2cols h4.title-03{font-size: 22px; margin-bottom: 30px;padding: 5px 10px; letter-spacing: 2px}

.article{padding-top: 20px}
.article p{font-size: 16px; margin-bottom: 1em;line-height: 180%;letter-spacing: 1px}
.article img{width:auto;height: auto; max-width: 100%; display: block; margin-bottom: 1em}


.article iframe{max-width: 100%;height: 300px}


.article .block{margin-bottom: 3em}
.article .cols-2 .img{margin-bottom: 3em}
.article .cols-2 .txt{margin-bottom: 3em}
.block-type-2 .txt{padding-left: 20px}
.block-type-3 .txt{padding-right: 20px}

#sec-2cols .right-contents .item{border-bottom:solid 1px #ddd; margin-bottom: 20px; padding-bottom: 15px}
#sec-2cols .right-contents h4{font-size: 18px;margin-bottom: 15px}
#sec-2cols .right-contents .cat li{list-style: disc;margin-left: 20px;margin-bottom: 5px}
#sec-2cols .right-contents .new-articles li{margin-bottom: 10px;font-size: 13px; font-weight: 300}
#sec-2cols .right-contents .new-articles li .date{display: block; font-size: 10px; color:#999;margin-bottom: 3px;letter-spacing: 1px}
#sec-2cols .right-contents .new-articles a{line-height: 180%}

.tags a{background-color: #eee;font-size: 12px; padding: 0 10px}

#sec-2cols .left-contents .news-block{min-height: 300px}

@media screen and (max-width: 840px) {
#sec-2cols{padding: 0}
#sec-2cols .left-contents{width: 100% ;padding-bottom: 50px;padding: 0 10px}
#sec-2cols .right-contents{width: 100%;margin-left: 0;padding-top: 0px; background-color: #eee;padding: 0 10px;}
#sec-2cols .right-contents .item:first-child{border-top:solid 1px #ddd; padding-top: 20px }
#sec-2cols .right-contents .cat li{display: inline-block}
}

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

#cover{font-size: 16px;padding-top: 105px}

.bnavi li{display: inline-block;font-size: 10px;color:#999}
.bnavi a{font-size: 10px}
#sec-2cols h3.title{font-size: 20px}
#sec-2cols .left-contents .date{font-size: 10px}
.article p{font-size: 14px}
#sec-2cols .right-contents h4{font-size: 16px}

}


/** NEWS DETAIL **/
#sec-single{max-width: 900px; margin: 0 auto; padding: 30px 10px}
.news-block{min-height: 200px;}
#sec-single .back{color:#333; background-color: #eee; display: block; padding: 10px; width: 200px; text-align: center; font-size: 14px; margin: 30px 0}






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

RANA

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

#rana #sec-03 .inner{padding: 50px 20px 80px; max-width: 840px}
#rana #sec-03 .desc{ margin-bottom: 0px; font-size: 16px;letter-spacing: 1px}

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

#rana #sec-03 .inner{padding: 60px 20px; max-width: 840px}
#rana #sec-03 .desc{ margin-bottom: 0px; font-size: 16px;letter-spacing: 1px}
#rana #sec-03 h2{font-size: 34px;}

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

#rana #sec-03 .inner{padding: 60px 20px}
#rana #sec-03 h2{font-size: 28px;}
#rana #sec-03 .desc{ margin-bottom: 0px; font-size: 14px;text-align: left}

}

#rana #sec-04{background-image: url(../images/asia/a305.jpg); text-align: center;height: 400px;}
#rana #sec-04::after{height: 400px}
#rana #sec-04 h3{font-size: 50px; text-shadow: 3px 3px 3px #333; color:#fff; letter-spacing: 3px; font-weight: 300}
#rana #sec-04 .txts{position: relative; z-index: 2;padding: 80px 0 0 0}
#rana #sec-04 .bt{margin: 50px auto 0; padding: 18px 0; font-size: 16px;}
#rana #sec-04 p{-webkit-transform: rotate(0deg);transform: rotate(0deg)}


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

#rana #sec-04{height: 300px;}
#rana #sec-04::after{height: 300px}
#rana #sec-04 h3{font-size: 40px}
#rana #sec-04 .txts{position: relative; z-index: 2;padding: 60px 0 0 0}
#rana #sec-04 .bt{margin: 50px auto 0; padding: 18px 0; font-size: 16px}

}


@media screen and (max-width: 500px) {
#rana #sec-04 h3{font-size: 34px;font-weight: 400}
#rana #sec-04 .bt{margin: 50px auto 0;width:250px; padding: 10px 0; font-size: 16px}
}

#rana #sec-concept .inner{padding: 100px 10px; max-width: 1200px}
#rana #sec-concept .col-img{width: 35%}
#rana #sec-concept .col-txt{padding-right: 50px;width: 65%}
#rana #sec-concept .wrap-img{max-width: 400px; height: 400px; overflow: hidden;position: relative;margin: 0 auto}
#rana #sec-concept .wrap-img img{width: auto; height: auto;  position: absolute; top:0; left: 0; right:0; bottom:0; margin: auto;}

#rana #sec-concept p{font-size: 16px; letter-spacing: 1px; line-height: 220%; font-weight: 300}
.bt-bk{border:solid 1px #000; color:#000;margin: 50px 0 0; padding: 18px 0; font-size: 16px}
.bt-bk::after{background-color: #000}
@media (min-width: 800px) {
.bt-bk:hover{background-color: #000; color:#fff}
.bt-bk:hover::after{background-color: #eee}
}

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

#rana #sec-concept .inner{padding: 30px}
#rana #sec-concept .col-img{width: 100%; margin-top: 20px}
#rana #sec-concept .col-txt{padding-right: 0;width: 100%}
#rana #sec-concept .wrap-img{height: 250px}
#rana #sec-concept p{font-size: 14px;line-height: 200%}
.bt-bk{margin: 50px auto 0;}

}







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

PALMS

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

#palms #sec-03 .inner{padding: 50px 20px 80px; max-width: 840px}
#palms #sec-03 .desc{ margin-bottom: 0px; font-size: 16px;letter-spacing: 1px}

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

#palms #sec-03 .inner{padding: 60px 20px; max-width: 840px}
#palms #sec-03 .desc{ margin-bottom: 0px; font-size: 16px;letter-spacing: 1px}
#palms #sec-03 h2{font-size: 34px;}

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

#palms #sec-03 .inner{padding: 60px 20px}
#palms #sec-03 h2{font-size: 28px;}
#palms #sec-03 .desc{ margin-bottom: 0px; font-size: 14px;text-align: left}

}

#palms #sec-04{background-image: url(../images/asia/a305.jpg); text-align: center;height: 400px;}
#palms #sec-04::after{height: 400px}
#palms #sec-04 h3{font-size: 50px; text-shadow: 3px 3px 3px #333; color:#fff; letter-spacing: 3px; font-weight: 300}
#palms #sec-04 .txts{position: relative; z-index: 2;padding: 80px 0 0 0}
#palms #sec-04 .bt{margin: 50px auto 0; padding: 18px 0; font-size: 16px;}
#palms #sec-04 p{-webkit-transform: rotate(0deg);transform: rotate(0deg)}


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

#palms #sec-04{height: 300px;}
#palms #sec-04::after{height: 300px}
#palms #sec-04 h3{font-size: 40px}
#palms #sec-04 .txts{position: relative; z-index: 2;padding: 60px 0 0 0}
#palms #sec-04 .bt{margin: 50px auto 0; padding: 18px 0; font-size: 16px}

}


@media screen and (max-width: 500px) {
#palms #sec-04 h3{font-size: 34px;font-weight: 400}
#palms #sec-04 .bt{margin: 50px auto 0;width:250px; padding: 10px 0; font-size: 16px}
}

#palms #sec-concept .inner{padding: 100px 10px; max-width: 1200px}
#palms #sec-concept .col-img{width: 35%}
#palms #sec-concept .col-txt{padding-right: 50px;width: 65%}
#palms #sec-concept .wrap-img{max-width: 400px; height: 400px; overflow: hidden;position: relative;margin: 0 auto}
#palms #sec-concept .wrap-img img{width: auto; height: auto;  position: absolute; top:0; left: 0; right:0; bottom:0; margin: auto;}

#palms #sec-concept p{font-size: 16px; letter-spacing: 1px; line-height: 220%; font-weight: 300}
.bt-bk{border:solid 1px #000; color:#000;margin: 50px 0 0; padding: 18px 0; font-size: 16px}
.bt-bk::after{background-color: #000}

@media (min-width: 800px) {
.bt-bk:hover{background-color: #000; color:#fff}
.bt-bk:hover::after{background-color: #eee}
}

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

#palms #sec-concept .inner{padding: 30px}
#palms #sec-concept .col-img{width: 100%; margin-top: 20px}
#palms #sec-concept .col-txt{padding-right: 0;width: 100%}
#palms #sec-concept .wrap-img{height: 250px}
#palms #sec-concept p{font-size: 14px;line-height: 200%}
.bt-bk{margin: 50px auto 0;}

}




/** FOOTER INFO **/
#sec-06 .inner{padding: 0 10px}
.f-info .col-1{width: 20%; vertical-align: middle}
.f-info .col-2{width: 30%; vertical-align: middle;padding-left: 20px}
.f-info .col-3{width: 50%; vertical-align: middle;padding-left: 20px}
.f-info .col-1 img{max-width: 200px;width: 100%}
.f-info .col-2 h4.hotel-name{font-size: 30px;line-height: 100%;margin-bottom: 10px;letter-spacing: 2px}
.f-info .col-2 h4.hotel-name span{font-size: 16px;letter-spacing: 1px}
.f-info .col-2 .address{font-style: normal; display: block; font-size: 16px;letter-spacing: 1px}
.f-info .wrap-phone{border:solid 1px #000; padding: 20px; text-align: center}
.f-info .col-3 p.p1{font-size: 16px; font-weight: bold}
.f-info .col-3 p.p2{font-size: 42px;letter-spacing: 2px; font-weight: bold}
.f-info .col-3 p.p2 i{font-size: 30px}
.f-info .col-3 p.p3{font-size: 16px; font-weight: bold}

.f-menu{margin-top: 50px}
.f-menu .col-1{width: 20%;margin-top: 28px}
.f-menu .col-2{width: 80%; padding-left: 20px}
.f-menu h4{font-size: 20px; letter-spacing: 2px}
.f-menu ul{border-top:solid 5px #000}
.f-menu li a{font-size: 16px; display: block; padding: 20px 15px; background-color: #fff;border-bottom:solid 1px #000;border-right:solid 1px #000; letter-spacing: 1px;position: relative;
-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;}
.f-menu li a::after{content:"▶"; display: block; position: absolute; top:50%; right:10px; font-size: 10px; margin-top: -12px;}

@media (min-width: 800px) {
.f-menu li a:hover{background-color: #eee;opacity: 1}
}


.f-menu li a span{font-size: 10px;display: block;position: absolute; bottom:5px; left: 20px}

.f-menu .col-2 ul{font-size: 0}
.f-menu .col-2 li{display: inline-block; width: 25%;font-size: 16px}

.f-menu .col-1 li a{border-right:none}
.f-menu .col-2 li:nth-of-type(4n) a{border-right:none}



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

.f-menu{margin-top: 50px}
.f-menu .col-1{width: 25%;margin-top: 26px}
.f-menu .col-2{width: 75%; padding-left: 20px}
.f-menu h4{font-size: 18px}
.f-menu ul{border-top:solid 3px #000}
.f-menu li a{font-size: 14px; display: block; padding: 15px 10px; background-color: #fff;border-bottom:solid 1px #000;border-right:solid 1px #000; letter-spacing: 1px;}
.f-menu li a::after{right:5px; font-size: 10px; margin-top: -10px;}

.f-menu .col-2 li{font-size: 14px}

}

@media screen and (max-width: 900px) {
.f-info{max-width: 600px; margin: 0 auto}
.f-info .col-1{width: 40%; vertical-align: middle}
.f-info .col-2{width: 60%; vertical-align: middle;padding-left: 20px}
.f-info .col-3{width: 100%; vertical-align: middle;padding-left: 0px;padding-top: 30px}

.f-menu{max-width: 600px; margin: 50px auto 0}
.f-menu .col-1{width: 100%;margin-top: 0px; margin-bottom: 30px}
.f-menu .col-2{width: 100%; padding-left: 0px}
.f-menu .col-1 ul{font-size: 0}
.f-menu .col-1 li{display: inline-block; width: 50%;font-size: 16px}
.f-menu .col-1 li:first-child{border-right:solid 1px #000}
}


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


.f-info .col-1 img{max-width: 150px}
.f-info .col-2 h4.hotel-name{font-size: 20px}
.f-info .col-2 h4.hotel-name span{font-size: 14px}
.f-info .col-2 .address{font-size: 14px}

.f-info .col-3 p.p1{font-size: 14px; font-weight: bold}
.f-info .col-3 p.p2{font-size: 32px;letter-spacing: 2px; font-weight: bold}
.f-info .col-3 p.p2 i{font-size: 25px}
.f-info .col-3 p.p3{font-size: 14px; font-weight: bold}


.f-menu .col-2 li{width:50%}
.f-menu .col-2 li:nth-of-type(2n) a{border-right:none}

}

@media screen and (max-width: 500px) {
#sec-06.sec-common{padding: 30px 0}
.f-info .col-2 h4.hotel-name{margin-bottom: 5px}
.f-info .col-2 h4.hotel-name span{font-size: 10px;}
.f-info .col-2 .address{font-size: 12px}
.f-info .col-1{width: 30%!important; display: inline-block!important;vertical-align: middle}
.f-info .col-2{width: 70%!important; display: inline-block!important;vertical-align: middle;padding-left: 20px}

.f-menu .col-2 li a{font-size: 12px;padding: 10px 10px 20px}
.f-menu li a span{bottom:5px; left: 10px}
.f-menu .col-1 li a,
.f-menu .col-2 li.no-sp a{font-size: 12px;padding: 15px 10px}
}


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

LP

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


.lp-content{text-align: center;padding-top: 80px}

.lp-title{margin-bottom: 50px;letter-spacing: 2px; font-weight: normal}
.lp-title.size1{font-size: 74px}
.lp-title.size2{font-size: 64px}
.lp-title.size3{font-size: 54px}
.lp-title.size4{font-size: 44px}
.lp-title.size5{font-size: 34px}

.lp-content .lp-block{margin-bottom: 50px; position: relative;padding-top: 50px;padding-bottom: 50px}
.lp-content .lp-block.inner{padding-left: 30px; padding-right: 30px}

.lp-content .lp-block iframe{max-width: 100%; min-height: 50vh}
.lp-content .lp-block img{max-width: 100%; width: 100%; height: auto}

.lp--hd3{margin-bottom: 50px;letter-spacing: 2px; font-weight: normal}
.lp--hd3.size1{font-size: 54px}
.lp--hd3.size2{font-size: 44px}
.lp--hd3.size3{font-size: 34px}
.lp--hd3.size4{font-size: 24px}
.lp--hd3.size5{font-size: 20px}


.layout1 .wrap-img{margin-bottom: 50px}
.lp-content .desc p{font-size: 20px;letter-spacing: 1px; line-height: 180%}

.lp-content .desc p.size1{font-size: 40px}
.lp-content .desc p.size2{font-size: 30px}
.lp-content .desc p.size3{font-size: 20px}
.lp-content .desc p.size4{font-size: 18px}


.layout2 .wrap-img{margin-bottom: 50px}
.layout2 .desc{}

.layout3{display: flex; flex-wrap: wrap}
.layout3 .wrap-txt{margin-bottom: 50px;width: 45%;padding-right: 30px;text-align: left}
.layout3 .wrap-img{margin-bottom: 50px; width: 55%}
.layout3 .desc p{font-size: 18px;letter-spacing: 1px; line-height: 160%}


.layout4{display: flex; flex-wrap: wrap}
.layout4 .wrap-txt{margin-bottom: 50px;width: 45%;padding-left: 30px;text-align: left}
.layout4 .wrap-img{margin-bottom: 50px; width: 55%}

.layout4 .desc p{font-size: 18px;letter-spacing: 1px; line-height: 160%}


.layout5 .bg-w{margin: -100px auto 0; max-width: 90%; padding: 150px 30px 50px; background-color: rgba(255,255,255,.8);position: relative; z-index: 10}
.layout5 .lp--hd3::after{content:""; display: block; width: 60%; height: 1px; background-color: #333;margin: 30px auto}



@media (max-width: 840px) {



.lp-content{text-align: center;padding-top: 50px}

.lp-title{margin-bottom: 30px;letter-spacing: 2px; font-weight: normal}
.lp-title.size1{font-size: 60px}
.lp-title.size2{font-size: 50px}
.lp-title.size3{font-size: 40px}
.lp-title.size4{font-size: 30px}
.lp-title.size5{font-size: 24px}

.lp-content .lp-block{margin-bottom: 50px; position: relative;padding-top: 30px;padding-bottom: 30px}
.lp-content .lp-block.inner{padding-left: 20px; padding-right: 20px}

.lp-content .lp-block iframe{width: 100%; min-height: 50vh}

.lp--hd3{margin-bottom: 50px;letter-spacing: 2px; font-weight: normal}
.lp--hd3.size1{font-size: 40px}
.lp--hd3.size2{font-size: 30px}
.lp--hd3.size3{font-size: 24px}
.lp--hd3.size4{font-size: 20px}
.lp--hd3.size5{font-size: 18px}


.layout1 .wrap-img{margin-bottom: 30px}
.lp-content .desc p{font-size: 18px;letter-spacing: 1px; line-height: 180%}

.lp-content .desc p.size1{font-size: 30px}
.lp-content .desc p.size2{font-size: 20px}
.lp-content .desc p.size3{font-size: 18px}
.lp-content .desc p.size4{font-size: 14px}


.layout2 .wrap-img{margin-bottom: 30px}

.layout3{display: flex; flex-wrap: wrap}
.layout3 .lp--hd3,
.layout4 .lp--hd3{margin-bottom: 20px}
.layout3 .wrap-txt{margin-bottom: 30px;width: 50%;padding-right: 20px}
.layout3 .wrap-img{margin-bottom: 30px; width: 50%}



.layout4{display: flex; flex-wrap: wrap}
.layout4 .wrap-txt{margin-bottom: 30px;width: 50%;padding-left: 20px}
.layout4 .wrap-img{margin-bottom: 30px; width: 50%}



.layout5 .bg-w{margin: -100px auto 0; max-width: 90%; padding: 150px 30px 50px; background-color: rgba(255,255,255,.8);position: relative; z-index: 10}
.layout5 .lp--hd3::after{content:""; display: block; width: 80%; height: 1px; background-color: #333;margin: 30px auto}


}




@media (max-width: 500px) {




.lp-title{margin-bottom: 30px;letter-spacing: 2px; padding: 0 20px}
.lp-title.size1{font-size: 50px}
.lp-title.size2{font-size: 40px}
.lp-title.size3{font-size: 30px}
.lp-title.size4{font-size: 20px}
.lp-title.size5{font-size: 16px}

.lp-content .lp-block{margin-bottom: 30px; position: relative;}
.lp-content .lp-block.inner{padding-left: 10px; padding-right: 10px}

.lp-content .lp-block iframe{width: 100%; min-height: 50vh}

.lp--hd3{margin-bottom: 30px;letter-spacing: 2px; font-weight: normal}
.lp--hd3.size1{font-size: 30px}
.lp--hd3.size2{font-size: 20px}
.lp--hd3.size3{font-size: 18px}
.lp--hd3.size4{font-size: 16px}


.layout1 .wrap-img{margin-bottom: 30px}
.lp-content .desc p{font-size: 18px;letter-spacing: 1px; line-height: 180%}

.lp-content .desc p.size1{font-size: 20px}
.lp-content .desc p.size2{font-size: 18px}
.lp-content .desc p.size3{font-size: 16px}
.lp-content .desc p.size4{font-size: 14px}


.layout2 .wrap-img{margin-bottom: 30px}

.layout3{display: block; flex-wrap: wrap}
.layout3 .lp--hd3,
.layout4 .lp--hd3{margin-bottom: 20px}
.layout3 .wrap-txt{margin-bottom: 30px;width: 100%;padding-right: 0px;text-align: center}
.layout3 .wrap-img{margin-bottom: 30px; width: 100%}



.layout4{display: block; flex-wrap: wrap}
.layout4 .wrap-txt{margin-bottom: 30px;width: 100%;padding-left: 0px;text-align: center}
.layout4 .wrap-img{margin-bottom: 30px; width: 100%}



.layout5 .bg-w{margin: -50px auto 0; max-width: 90%; padding: 80px 10px 30px; background-color: rgba(255,255,255,.8);position: relative; z-index: 10}
.layout5 .lp--hd3::after{content:""; display: block; width: 90%; height: 1px; background-color: #333;margin: 30px auto}

.noppading .lp--hd3{padding: 0 10px}
.lp-content .desc{padding: 0 10px}
}

