@charset "utf-8";

/* CSS Document */

/* @font-face { font-family: 'FOT-AnitoStd-M'; src: url(./FOT-AnitoStd-M.otf); } */

/*------------------------------------------------------------------------------------------------------------------
　base style
-------------------------------------------------------------------------------------------------------------------*/

* {
	-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}


body {	
	color:#010101;
	font-size:16px;
	margin:0;
	height:100%;
	position:relative;
	font-family: "BIZ UDPGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height:1.6;
	overflow-x:hidden;
}


@media screen and (max-width: 750px) {
	body {	font-size: 22px;}
}




.ipad #primary, .safari #primary {
	width: 1200px !important;
	max-width: 1200px !important;
	overflow: hidden !important;
}

@media screen and (max-width: 750px) {
	#primary, .safari #primary, .ios #primary {
		width: 750px !important;
		max-width: 750px !important;
		overflow: hidden;
	}
}

a:link {color:#010101; text-decoration:underline;}
a:visited {color:#010101; text-decoration:underline;}
a:hover {color:#e0afa0; text-decoration:underline;}

img {
	border:0;
	vertical-align: bottom;
}

a[href^="tel:"] {
    pointer-events:none;
	text-decoration: none;
}

@media screen and (max-width: 750px) {
	a[href^="tel:"] {
		pointer-events:auto;
	}
}

/*------------------------------------------------------------------------------------------------------------------
　font-size
-------------------------------------------------------------------------------------------------------------------*/

h1{font-size:32px;margin: 0;}
h2{font-size:24px;margin: 0;}
h3{font-size:20px;margin: 0;}
h4{font-size:18px;margin: 0;}
h5{font-size:16px;margin: 0;}
h6{font-size:14px;margin: 0;}


@media screen and (max-width: 750px) {
	h1{font-size:38px;}
	h2{font-size:30px;}
	h3{font-size:26px;}
	h4{font-size:24px;}
	h5{font-size:22px;}
	h6{font-size:20px;}
}




#contents-primary h2{
	text-align: center;
	margin-bottom: 50px;
}

#contents-primary h2 span{
	position: relative;
	padding:0 170px;
}

#contents-primary h2 span:before{
	content: "";
	position: absolute;
	width: 163px;
	height:39px;
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: -30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);	
}

#contents-primary h2 span:after{
	content: "";
	position: absolute;
	width: 163px;
	height:39px;	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	right: -30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}





/*------------------------------------------------------------------------------------------------------------------
　preparation
-------------------------------------------------------------------------------------------------------------------*/

#lineup-font-size-sampler { display:none; }

div:after, section:after, article:after, ul:after {
    content: "";
    display: block;
    clear: both;
}

.link a {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:block;
	text-indent:100%;
	overflow:hidden;
	white-space:nowrap;
}

/*------------------------------------------------------------------------------------------------------------------
　expression
-------------------------------------------------------------------------------------------------------------------*/

.clear { clear:both; }

.under { margin-bottom:30px !important; }
.under-db { margin-bottom:60px !important; }
.under-harf { margin-bottom:15px !important; }

.right { float:right; margin-left:30px; margin-bottom:15px; margin-top:5px;}
.left { float:left; margin-right:30px; margin-bottom:15px; margin-top:5px;}

.text-center { text-align:center; }
.text-left { text-align:left; }
.text-right { text-align:right; }

.first { padding-top:0 !important; margin-top:0 !important; }
.last { padding-bottom:0 !important; margin-bottom:0 !important; }

.ro img:hover,.ro:hover {
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}

.dropshadow {
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.17);
  -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.17);
  -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.17);
}

/* 画像のぼやけ対策 */
.rendering {
	backface-visibility: hidden;
	filter: blur(0);
	image-rendering: -webkit-optimize-contrast;
}

/*------------------------------------------------------------------------------------------------------------------
　img align for wordpress
-------------------------------------------------------------------------------------------------------------------*/

.aligncenter {
    display: block;
    margin: 0 auto;
		max-width:100%;
}
.alignright { float: right; margin-left:30px; max-width:400px !important; }
.alignleft { float: left; margin-right:30px; max-width:400px !important; }

.aligncenter img, .alignright img, .alignleft img {
	max-width:100%;
	height:auto;
}

@media screen and (max-width: 1150px) {
	.aligncenter, .alignright, .alignleft {
			display: block;
			margin-left: auto;
			margin-right: auto;
			float: none;
			max-width:100%;
			text-align:center;
	}
}

/*------------------------------------------------------------------------------------------------------------------
　wp-pagenavi
-------------------------------------------------------------------------------------------------------------------*/

.wp-pagenavi {
	padding: 10px 20px 10px !important;
	display:block !important;
	clear:both !important;
	text-align: center;
}

@media screen and (max-width: 750px) {
	.wp-pagenavi {
		transform-origin: center;
		transform: scale(1.4,1.4);
	}
}

.wp-pagenavi a ,.wp-pagenavi span.pages, .wp-pagenavi span.extend {
		color:#333333 !important;
		text-shadow:0px 1px #F6F6F6 !important;
		padding:6px 9px 6px 9px !important;
		border:solid 1px #B6B6B6 !important;
		box-shadow:0px 1px #EFEFEF !important;
		-moz-box-shadow:0px 1px #EFEFEF !important;
		-webkit-box-shadow:0px 1px #EFEFEF !important;
		background:#E6E6E6 !important;
		background:-moz-linear-gradient(top,#FFFFFF 1px,#F3F3F3 1px,#E6E6E6) !important;
		background:-webkit-gradient(linear,0 0,0 100%,color-stop(0.02,#FFFFFF),color-stop(0.02,#F3F3F3),color-stop(1,#E6E6E6)) !important;
		font-size:12px !important;
		margin-right:8px !important;
		text-decoration:none !important;
}

@media screen and (max-width: 750px) {
	.wp-pagenavi a ,.wp-pagenavi span.pages, .wp-pagenavi span.extend{
	  font-size: 20px!important;
	}	
}


.wp-pagenavi a:hover {
		color:#fff !important;
		text-shadow:0px 1px #e0afa0 !important;
		border-color:#e0afa0 !important;
		background:#e0afa0 !important;
		/*background:-moz-linear-gradient(top,#9FE355 1px,#79BF4A 1px,#599F2F) !important;
		background:-webkit-gradient(linear,0 0,0 100%,color-stop(0.02,#9FE355),color-stop(0.02,#79BF4A),color-stop(1,#599F2F)) !important;*/
		color:#FFFFFF !important;
		box-shadow:0px 1px #e0afa0 !important;
		-moz-box-shadow:0px 1px #e0afa0 !important;
		-webkit-box-shadow:0px 1px #e0afa0 !important;

}
 .wp-pagenavi span.current{
		padding:6px 9px 6px 9px !important;
		border:solid 1px #DCDCDC !important;
		color:#fff !important;
		box-shadow:0px 1px #e0afa0 !important;
		-moz-box-shadow:0px 1px #e0afa0 !important;
		-webkit-box-shadow:0px 1px #e0afa0 !important;
		margin-right:8px !important;
		text-shadow:0px 1px #e0afa0 !important;
		border-color:#e0afa0 !important;
		background:#e0afa0 !important;
		/*background:-moz-linear-gradient(top,#9FE355 1px,#79BF4A 1px,#599F2F) !important;
		background:-webkit-gradient(linear,0 0,0 100%,color-stop(0.02,#9FE355),color-stop(0.02,#79BF4A),color-stop(1,#599F2F)) !important;*/
}



/*------------------------------------------------------------------------------------------------------------------
　fancybox-button
-------------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 750px) {	
 
	.fancybox-button {
		height: 80px;
		width: 80px;
	}
	
	.fancybox-navigation .fancybox-button {
		height: 120px;
		width: 90px;
	}
	
	.fancybox-infobar{font-size:18px;}
	
	.fancybox-caption{font-size: 24px;}
}



/*------------------------------------------------------------------------------------------------------------------
　Google site search
-------------------------------------------------------------------------------------------------------------------*/

.g-search-form {
	width: 247px;
	height: 41px;
	border-radius: 3px;
	display: inline-block;
}

/* Googleカスタム検索ボックスのレイアウト調整 start */

.gsc-control-cse {
	padding: 0 !important;
	border: none !important;
}

.gsc-input-box {
	border: none !important;
}

.gsib_a {
	padding: 0 !important;
}

table.gsc-search-box, form.gsc-search-box {
	margin-bottom: 0 !important;
}

.gsc-search-button {
	position: absolute !important;
	z-index: 99 !important;
	top: 0;
	right: 0;
}

.g-search-form {
	vertical-align: top !important;
	position: absolute !important;
	top: 0 !important;
	right: 259px !important;
}

.g-search-form form {
	position: relative;
}

.g-search-form input[type=text] {
	width: 100% !important;
	height: 41px !important;
	border-radius: 3px !important;
	background-color: #f9f9f9 !important;
	border: 1px solid #d9d9d9 !important;
	padding: 11.5px !important;
	padding-left: 15px !important;
	position: absolute !important;
	top: 15px !important;
	left: 0 !important;
	background-position: center left 15px !important;
}

.g-search-form button {
	background-image: url("../image/header/search-button.png") !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-color: #ffb400 !important;
	border-radius: 3px !important;
	width: 48px !important;
	height: 32px !important;
	border: none !important;
	position: absolute !important;
	top: 17.5px !important;
	right: 5px !important;
}

.g-search-form button svg {
	display: none !important;
}

.gsst_a {
	display: none !important;
}


/*------------------------------------------------------------------------------------------------------------------
　primary
-------------------------------------------------------------------------------------------------------------------*/

#primary {
	width:100%;
	height:100%;
	min-width:640px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

@media screen and (max-width: 750px) {
	#primary {
		width: 750px;
		min-width: 750px;
		overflow: hidden;
	}
}

article {
	width:100%;
	max-width: 1200px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	transition:0.3s;
	box-sizing:border-box;
}

@media screen and (max-width: 1440px) {
	article {
		width:100%;
		padding-left:30px;
		padding-right:30px;
	}
}

/*------------------------------------------------------------------------------------------------------------------
　mainvisual
-------------------------------------------------------------------------------------------------------------------*/
#mainvisual{
	position: relative;
}

#mainvisual:before{
	position: absolute;
	content:"";
	background-repeat: no-repeat;
	background-size:contain;
	background-position: left;
	background-image: url("../image/contents/top/mainvisual/flame-left.png");
	width:401px;
	height: 765px;
	left:0;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	z-index: 1;
}

#mainvisual:after{
	position: absolute;
	content:"";
	background-repeat: no-repeat;
	background-size:contain;
	background-position: left;
	background-image: url("../image/contents/top/mainvisual/flame-right.png");
	width:209px;
	height: 765px;
	right:0;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	z-index: 2;
}






#mainvisual .bxslider .panel{
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	width:100%;
	height:800px;
}

#mainvisual .bxslider .panel.room1{
	background-image: url("../image/contents/top/mainvisual/slider01.jpg");
}


#mainvisual .bxslider .panel.room2{
	background-image: url("../image/contents/top/mainvisual/slider03.jpg");
}

#mainvisual .bxslider .panel.bath1{
	background-image: url("../image/contents/top/mainvisual/slider04.jpg");
}


/*#mainvisual .bxslider .panel.girlsplan{
	background-image: url("../image/contents/top/mainvisual/slider02.jpg");
	position: relative;
	background-position:center top;
}

#mainvisual .bxslider .panel.girlsplan .girlsplan-message{
	background-image: url("../image/contents/top/mainvisual/girlsplan-messeage.png");
	width:949px;
	background-position: center right;
	background-repeat: no-repeat;
	height: 202px;
	margin-left:0;
	position: absolute;
	bottom: 80px;
	left: 0;
	background-size: contain;
}

@media screen and (max-width: 1600px) {
#mainvisual .bxslider .panel.girlsplan .girlsplan-message{
	width:calc( 100% - 360px);
	margin-left: -360px;
}
}

@media screen and (max-width: 1440px) {
#mainvisual .bxslider .panel.girlsplan .girlsplan-message{
	width:calc( 100% - 250px);
	margin-left: -250px;
	background-position: center right 100px;
}
}



@media screen and (max-width: 1250px) {
#mainvisual .bxslider .panel.girlsplan .girlsplan-message{
	width:calc( 100% - 150px);
	margin-left: -150px;
	background-position: center right 125px;
}
}


@media screen and (max-width: 1000px) {
#mainvisual .bxslider .panel.girlsplan .girlsplan-message{
	background-image: url("../image/contents/top/mainvisual/sp-girlsplan-messeage.png");
	width:650px;
	height: 258px;
	margin-left: 0px;
	background-position:top left;
	
}
}
*/


/*------------------------------------------------------------------------------------------------------------------
　header
-------------------------------------------------------------------------------------------------------------------*/

header{
	background-color: #463f3a;
	position: relative;
	height: 120px;
	line-height: 1;
}

@media screen and (max-width: 750px) {
	header{height: 130px;}
}

header .description{
	font-size:12px;
	color:#bcb8b1;
	padding-top: 20px;
	display: block;
}

@media screen and (max-width: 750px) {
	header .description{
		font-size:18px;
		letter-spacing: -0.025em;
	}
}

header .logo{
	display: inline-block;
/*	width: 219px;
	height: 71px;*/
}
header .logo a{
	padding-top: 15px;
	display: block;
}

@media screen and (max-width: 750px) {
	header .logo a{padding-top: 20px;}
}

header .option{
	position: absolute;
	right:30px;
	top:20px;
}

@media screen and (max-width: 1050px) {
	header .option{
		right:90px;
		top:25px;
	}
}

@media screen and (max-width: 870px) {
	header .option{
		right:120px;
	}
}

@media screen and (max-width: 800px) {
	header .option{
		top:50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
		right:0;
		margin-top: -12px;
	}
}

@media screen and (max-width: 750px) {
	header .option{
		margin-top: 0px;
		right: 15px;
	}
}


header .option .address{
	font-size:14px;
	color:#bcb8b1;
	display: inline-block;
	padding-right: 30px;
}


@media screen and (max-width: 1050px) {
	header .option .address{
		display: block;
		padding-right: 30px;
		padding-bottom: 15px;
	}
}

@media screen and (max-width: 800px) {
	header .option .address{
		display: none;
	}
}

header .option .address span{display: inline-block;}
header .option .address span:first-child{padding-right: 15px;}

@media screen and (max-width: 870px) {
	header .option .address span{display: block;}
}


header .option .tel{
	display: inline-block;
}


@media screen and (max-width: 800px) {
	header .option .tel{
		/*display: none;*/
	}
}


header .option .tel a{
	position: relative;
	font-size:24px;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	padding-left: 30px;
}


@media screen and (max-width: 750px) {
	header .option .tel a{font-size:28px;}
}

header .option .tel a:before{
	position: absolute;
	content:"";
	background-image: url("../image/header/tel-icon.png");
	width:20px;
	height: 31px;
	background-repeat: no-repeat;
	background-size: contain;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}




/*------------------------------------------------------------------------------------------------------------------
　navi
-------------------------------------------------------------------------------------------------------------------*/

.navimenu {
  display: block;
}
.navimenu ul {
  padding: 0;
  list-style: none;
	margin-bottom: 0;
}

.navimenu li{ 
	display: inline-block;
	/*border-right: #7a716b 2px solid;*/
	position: relative;
}

.navimenu li:before{
	content: "";
	position: absolute;
	right: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	background-color: #7a716b;
	width: 2px;
	height: 25px;
}

.navimenu li:first-child::after{
	content: "";
	position: absolute;
	left: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	background-color: #7a716b;
	width: 2px;
	height: 25px;
}

.navimenu a{
	 text-decoration: none;
	 border-bottom: none;
	 display: block;
	 position: relative;
	padding:25px 20px;	
	color:#fff;	
}

.navimenu a.current{
	position: relative;
}

.navimenu a.current:before{
	content: "";
	position: absolute;
	background-color: #e0afa0;
	width: 100%;
	height: 3px;
	bottom: -2px;
	left: 0;
}

.navimenu a::before{
	  position: absolute;
	  content: '';
	  bottom: -2px;
	  left: 0;
	  width: 0;
	  height: 3px;
	  background-color: #e0afa0;
	  transition: all 0.5s ease 0s;
}


.navimenu a:hover {cursor: pointer;color: #e0afa0;}
.navimenu a:hover::before{width: 100%;}


.pc-menu{
	position: absolute;
	right: 30px;
	bottom: 0;

}

@media screen and (max-width: 1050px) {
	.pc-menu {
		display: none;
	}
}




/*------------------------------------------------------------------------------------------------------------------
　navi spメニュー
-------------------------------------------------------------------------------------------------------------------*/

.header-primary nav.sp-menu {
	display: none;
}

@media screen and (max-width: 1050px) {
	.header-primary nav.sp-menu {
	display: block;
	}


.navimenu-toggle {
	cursor: pointer;
	background-color: #e0afa0;
	border: 0;
	padding: 10px;
	height: 70px;
	width: 70px;
	position: fixed;
	/*position: absolute;*/
	right: 30px;
	top:25px;
	display: inline-block;
	z-index: 999;
	outline:none;
}

@media screen and (max-width: 750px) {
	.navimenu-toggle {top:30px;}
}
	
/*.navimenu-toggle:hover {
	background-color: #fff;
	border: 3px solid #e0afa0;
	outline: none;
}*/

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
   outline: none;
}	
	
.navimenu-toggle-bar {
  display: block;
  width: 50px;
  height: 3px;
  background-color: #fff;
  -webkit-transition: 0.15s cubic-bezier(0.75, -0.55, 0.25, 1.55);
  transition: 0.15s cubic-bezier(0.75, -0.55, 0.25, 1.55);
}
	
/*	
.navimenu-toggle:hover .navimenu-toggle-bar{
background-color: #e0afa0;
width: 47px;
}	
*/	
.navimenu-toggle-bar + .navimenu-toggle-bar {
  margin-top: 9px;
}

.navimenu-toggle.active .navimenu-toggle-bar {
  margin: 0;
  position: absolute;
}
.navimenu-toggle.active .navimenu-toggle-bar:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.navimenu-toggle.active .navimenu-toggle-bar:nth-child(2) {
  opacity: 0;
}
.navimenu-toggle.active .navimenu-toggle-bar:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}


  .sp-navimenu-nav{
    display: none;
  }	
	
  .sp-navimenu-nav {
	width: 100%; 
	position: fixed;
	background-color: #7a716b;
	height:100vh;
	top: 0;
	left: 0;
	padding: 50px!important;
	z-index: 99;
	text-align: center;
	margin-top: 0;
	box-sizing: border-box;
	min-width: 750px;
  }
	
	
.sp-navimenu-nav .description{font-size: 20px;}	
	
@media screen and (max-width: 750px) {
	.sp-navimenu-nav .description{font-size: 22px;}	
}	
	
@media screen and (max-width: 900px) {
	.sp-navimenu-nav .description span{display: block;margin-bottom: 10px;}
}
	
	
	
 .sp-navimenu-nav a.logo:hover::before{background: transparent;content:none;}
	
  .sp-navimenu-nav ul{
	list-style: none;
	 margin-top: 30px;
  	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
 	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  }	
  .sp-navimenu-nav li{
	box-sizing: border-box;	
	width: calc(33.33% - 30px);
	height: 60px;
	  text-align: center;
	  border-radius: 50px;
	  position: relative;
	margin-right: 15px;
	  display: inline-block;
	  margin-bottom: 30px;
	  text-indent: -15px;
  }
	
@media screen and (max-width: 800px) {
	 .sp-navimenu-nav li{width: calc( 50% - 7.5px);}
	
	.sp-navimenu-nav li:nth-child(2n){margin-right: 0;}
}		
	

.sp-navimenu-nav li:first-child{text-indent: 0;}	
	
.sp-navimenu-nav li:before{background-color:#bcb8b1;margin-top: 6px;}

.sp-navimenu-nav li:first-child::after{background-color:#bcb8b1;margin-top: 6px;}
.sp-navimenu-nav li:nth-child(4n)::after{
	background-color:#bcb8b1;
	margin-top: 6px;
	content: "";
	position: absolute;
	left: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	width: 2px;
	height: 25px;
}
	
	
@media screen and (max-width: 800px) {
.sp-navimenu-nav li:nth-child(4n)::after{content:none;}	
.sp-navimenu-nav li:nth-child(2n+1)::after{
	background-color:#bcb8b1;
	margin-top: 6px;
	content: "";
	position: absolute;
	left: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	width: 2px;
	height: 25px;
}
}	
	
/*.sp-navimenu-nav li:first-of-type {display: block;width: 100%;margin-bottom: 50px;}	
.sp-navimenu-nav li:first-of-type a:hover::before{background: transparent;content:none;}
*/	
	
 .sp-navimenu-nav li:last-child {
    border: 0;
  }
 .sp-navimenu-nav li a {
    width: 100%;
   /*text-indent:120%;*/
    position: relative;
	box-sizing: border-box;
	font-size: 24px;
  }


.sp-navimenu-nav a:hover{color: #e0afa0;}	
	
.navimenu-nav-open {
  display: block !important;
}
.navimenu-nav-open .navimenu-nav-child {
  display: block;
}	
	
.sp-navimenu-nav .sp-option{
	position: relative;
	margin: auto;
	box-sizing: border-box;
	right: 0;
	top: 0;
	margin-top: 50px;
}

.sp-navimenu-nav .sp-option .address{font-size: 24px;padding-right: 0px;color: #bcb8b1;}	

.sp-navimenu-nav .sp-option .tel a{
	position: relative;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	margin-left: 20px;
}
	
.sp-navimenu-nav .sp-option .tel a:hover::before{background: transparent;content:none;}	

.sp-navimenu-nav .sp-option .tel a span{position: relative;padding-left: 50px;}	
	
.sp-navimenu-nav .sp-option .tel a span:before{
	position: absolute;
	content:"";
	background-image: url("../image/header/sp-tel-icon.png");
	width:32px;
	height: 50px;
	background-repeat: no-repeat;
	background-size: contain;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	background-color: transparent;
}
	
}	


/*------------------------------------------------------------------------------------------------------------------
　sidebar
-------------------------------------------------------------------------------------------------------------------*/

#sidebar {
	display: none;
	position: fixed;
	top: 0;
	right: -320px;
	z-index: 100;
	transition: 0.3s;
	background-color: #151515;
	width: 100%;
	height: 100%;
	max-width: 320px;
	box-sizing: border-box;
	padding-top: 30px;
}

.iphone #sidebar, .iphone #android, .iphone #ipad {
	overflow: scroll;
}

#sidebar.active {
	right: 0;
}

#sidebar-button {
	display: none;
	position: fixed;
	top: 30px;
	right: 30px;
	width: 80px;
	height: 80px;
	background-color: #0039b7;
	z-index: 100;
	box-sizing: border-box;
	padding-top: 14px;
	padding-left: 15px;
	transition: 0.3s;
}

#sidebar-button.active {
	right: 340px;
}

#sidebar-button button {
	transform: scale(0.8,0.8);
	transform-origin: center;
}

@media screen and (max-width: 1150px) {
	#sidebar {
		display: block;
	}
	#sidebar-button {
		display: block;
	}
}

.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.menu-trigger {
  position: relative;
  width: 50px;
  height: 44px;
  background: none;
  border: none;
  appearance: none;
  cursor: pointer;
}
.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #fff;
  border-radius: 4px;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 20px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}

.menu-trigger span:nth-of-type(1) {
  animation: menu-bar01 .75s forwards;
}
@keyframes menu-bar01 {
  0% {
    transform: translateY(20px) rotate(45deg);
  }
  50% {
    transform: translateY(20px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}
.menu-trigger span:nth-of-type(2) {
  transition: all .25s .25s;
  opacity: 1;
}
.menu-trigger span:nth-of-type(3) {
  animation: menu-bar02 .75s forwards;
}
@keyframes menu-bar02 {
  0% {
    transform: translateY(-20px) rotate(-45deg);
  }
  50% {
    transform: translateY(-20px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}
.menu-trigger.active span:nth-of-type(1) {
  animation: active-menu-bar01 .75s forwards;
}
@keyframes active-menu-bar01 {
  0% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(20px) rotate(0);
  }
  100% {
    transform: translateY(20px) rotate(45deg);
  }
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  animation: active-menu-bar03 .75s forwards;
}
@keyframes active-menu-bar03 {
  0% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(-20px) rotate(0);
  }
  100% {
    transform: translateY(-20px) rotate(-45deg);
  }
}

/*------------------------------------------------------------------------------------------------------------------
　footer
-------------------------------------------------------------------------------------------------------------------*/

#footer {
	width:100%;
	background-color: #463f3a;
	padding: 50px 0 100px;
	text-align: center;
}

#footer .footer-menu{
  padding: 0;
  list-style: none;
  margin: 0 auto;
  	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;	
}

#footer .footer-menu li{ 
	display: inline-block;
	/*border-right: #7a716b 2px solid;*/
	position: relative;
}

#footer .footer-menu li:before{
	content: "";
	position: absolute;
	right: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	background-color: #7a716b;
	width: 2px;
	height: 25px;
}

#footer .footer-menu li:last-child:before{
	content: none;
}


#footer .footer-menu li a{
	 text-decoration: none;
	 border-bottom: none;
	 display: block;
	 position: relative;
	padding:25px 20px;	
	color:#fff;	
}

#footer .footer-menu li a::before{
	  position: absolute;
	  content: '';
	  bottom: -2px;
	  left: 0;
	  width: 0;
	  height: 3px;
	  background-color: #e0afa0;
	  transition: all 0.5s ease 0s;
}

#footer .footer-menu li a:hover {cursor: pointer;color: #e0afa0;}
#footer .footer-menu li a:hover::before{width: 100%;}



#footer .logo{display: block;text-align: center;padding: 25px;}

#footer .option{margin-bottom: 70px;}

#footer .option .description{color: #bcb8b1;display: block;margin-bottom: 15px;}

#footer .option .description span{display: inline-block;}


#footer .option .address{color: #bcb8b1;display: block;margin-bottom: 15px;}

#footer .option .tel{
	display: inline-block;
}

#footer .option .tel a{
	position: relative;
	font-size:24px;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	padding-left: 30px;
}

@media screen and (max-width: 750px) {
	#footer .option .tel a{font-size: 28px;}
}

#footer .option .tel a:before{
	position: absolute;
	content:"";
	background-image: url("../image/footer/tel-icon.png");
	width:20px;
	height: 31px;
	background-repeat: no-repeat;
	background-size: contain;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


#footer .cc {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	display: block;
	padding-top: 25px;
	padding-bottom: 25px;
	text-align: center;
	background-color: #e0afa0;
	color: #323232;
	font-weight: normal;
	padding-right: 180px;
}


@media screen and (max-width: 750px) {
	#footer .cc{
		padding-right: 200px;
		width: 750px;
		max-width: 750px;
	
	}
}

#footer .cc br{display: none;}


@media screen and (max-width: 750px) {
	#footer .cc br{display: block;}
}




.topback a {
	position:absolute;
	bottom:0px;
	right:60px;
	background-color:#e0afa0;
	border-radius: 90px 90px 0 0;
	width: 180px;
	height: 140px;
	display:block;
	padding-top: 90px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
}


.topback a:hover{
  transform: translateY(-10px);
  transition-duration: 0.5s;
}




@media screen and (max-width: 750px) {
	.topback a {width: 200px;bottom:30px;right: 30px;}
}



.topback a:before{
	content: "";
	position: absolute;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);	
	top: 30px;
	background-image:url(../image/footer/topback.png);
	background-repeat: no-repeat;
	background-position: center;
	width: 72px;
	height: 38px;
}



/*------------------------------------------------------------------------------------------------------------------
　additional
-------------------------------------------------------------------------------------------------------------------*/

#contents-primary {
	position:relative;
}

#contents {
	position:relative;
}

/*----------------------------------------------------------------------------
   home
------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------
   トップ　ホテルティアラについて
------------------------------------------------------------------------------*/

#top-about {
	position: relative;
	background-color:#f4f3ee;
	padding: 70px 0;
}

#top-about:before{
	content: "";
	position: absolute;
	width: 1424px;
	height: 100%;
	background-image: url("../image/contents/top/about-bg.png");	
	background-size: contain;
	background-position: left -200px;
	background-repeat: no-repeat;
	left: 0;
	top: 0px;
}

@media screen and (max-width: 1200px){
	#top-about:before {
		background-position: -150px -250px;
	}
}


@media screen and (max-width: 1000px){
	#top-about:before {
		background-position: -350px -450px;
	}
}


@media screen and (max-width: 750px) {
	#top-about:before{
		background-position: -400px -570px;
	}
}



#top-about .content{
	position: relative;
	padding: 50px;
	border: dotted 5px #463f3a;
	margin: auto;
}

@media screen and (max-width: 1440px) {
	#top-about .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1200px) {
	#top-about .content{
	padding: 50px 30px;
	}
}
@media screen and (max-width: 1000px) {
	#top-about .content{
	padding: 50px 30px 20px;
	}
}


#top-about .content:before{
	content: "";
	position: absolute;
	width: 162px;
	height:27px;
	background-image: url("../image/contents/top/about-flame-up.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: 50%;
	top: -35px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);	
}


#top-about .content:after{
	content: "";
	position: absolute;
	width: 162px;
	height:27px;
	background-image: url("../image/contents/top/about-flame-down.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: 50%;
	bottom: -35px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);	
}


#top-about .content .box:before{
	content: "";
	position: absolute;
	width: 21px;
	height:151px;
	background-image: url("../image/contents/top/about-flame-left.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: -30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);	
}

#top-about .content .box:after{
	content: "";
	position: absolute;
	width: 21px;
	height:151px;
	background-image: url("../image/contents/top/about-flame-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	right: -30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);	
}

#top-about h2 span br{display: none;}

@media screen and (max-width: 800px) {
	#top-about h2 span{display: block;}
	#top-about h2 span br{display: block;}
}

#top-about h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}


#top-about h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}		
	
@media screen and (max-width: 800px) {
#top-about h2 span:before{left:-15px;}
#top-about h2 span:after{right:-15px;}
}


#top-about .description{
	margin-bottom: 50px;
	text-align: center;
}

@media screen and (max-width: 750px) {
	#top-about .description{
		text-align: left;
		letter-spacing: -0.015em;
	}
	
	#top-about .description .sp-none{display: none;}
}



#top-about .gallery{
	list-style: none;
	padding-left: 0;
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	margin:0 -15px;
}


@media screen and (max-width: 1000px) {
	#top-about .gallery{
	  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
		-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;	
	}
}

#top-about .gallery li{
	width: 33.33%;
	padding: 0 15px;
	position: relative;
}

@media screen and (max-width: 1000px) {
	#top-about .gallery li{
		width: 50%;
		margin-bottom: 30px;
	}
	
	#top-about .gallery li:first-of-type{margin: 0 30px 30px;}
	
	
}


#top-about .gallery li:before{
	content: "";
	position: absolute;
	width: 221px;
	height:220px;
	background-image: url("../image/contents/top/photo-flame-left.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: 0px;
	top:-10px;
}


@media screen and (max-width: 1200px) {
	#top-about .gallery li:before{
		width: 70%;
		height:100%;
		background-position: top;
	}	
}





#top-about .gallery li:after{
	content: "";
	position: absolute;
	width: 221px;
	height:220px;
	background-image: url("../image/contents/top/photo-flame-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	right: 0;
	bottom:-10px;
}


@media screen and (max-width: 1200px) {
	#top-about .gallery li:after{
		width: 70%;
		height:100%;
		background-position: bottom;
	}	
}

#top-about .gallery li img{width: 100%;height: auto;}


/*----------------------------------------------------------------------------
   トップページ　ピックアップ
------------------------------------------------------------------------------*/

#top-pickup {
	position: relative;
	/*margin: 70px auto;*/
	background-image: url("../image/contents/top/pickup-bg.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}



#top-pickup .content{
	padding: 70px 0;	
}


@media screen and (max-width: 1440px) {
	#top-pickup .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1100px) {
	#top-pickup .content{
		padding: 70px 0 40px;	
	}

}



#top-pickup h2{color: #fff;}

#top-pickup h2 span:before{
	background-image: url("../image/common/title-whiteaccent-left.png");	
}


#top-pickup h2 span:after{
background-image: url("../image/common/title-whiteaccent-right.png");	
}		
	

#top-pickup .box{
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;	
	margin:0 -15px;
}

/*
@media screen and (max-width: 1100px) {
	#top-pickup .box{
	  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
		-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;	
	}
}
*/
#top-pickup .box .item{
	/*width: 33.33%;
	padding: 0 15px;*/
	width: 460px; /*410+30+30*/
	padding: 0 25px;
	position: relative;
}

@media screen and (max-width: 1200px){
	#top-pickup .box .item{
		padding: 0 15px;
		width: 440px; /*410+30+30*/
	}
}

@media screen and (max-width: 1000px) {
	#top-pickup .box .item{
		width: 50%;
	}
}


/*@media screen and (max-width: 1100px) {
	#top-pickup .box .item{
		width: 50%;
		margin-bottom: 30px;
	}
	
	/*#top-pickup .box .item:first-of-type{margin: 0 30px 30px;}
}*/


#top-pickup .box .item .thum{
	width:100%;
	/*height: 245px;*/
	height: 264px;
	background-position: center top;
    background-repeat: no-repeat;
}

#top-pickup .box .item:nth-child(1) .thum{
	background-image: url("../image/contents/top/pickup-thum01.jpg");
}

/*
#top-pickup .box .item:nth-child(2) .thum{
	background-image: url("../image/contents/top/pickup-thum02.jpg");
}
*/
#top-pickup .box .item:nth-child(2) .thum{
	background-image: url("../image/contents/top/pickup-thum02.jpg");
}


@media screen and (max-width: 900px) {
	#top-pickup .box .item .thum{
		/*background-size: contain;*/
	}
	#top-pickup .box .item:nth-child(2) .thum{background-position: 20% top;}	
}


#top-pickup .box .item h3{
	font-size: 42px;
	font-weight: bold;
  	text-shadow : 
       3px  3px 1px #ffffff,
      -3px  3px 1px #ffffff,
       3px -3px 1px #ffffff,
      -3px -3px 1px #ffffff,
       3px  0px 1px #ffffff,
       0px  3px 1px #ffffff,
      -3px  0px 1px #ffffff,
       0px -3px 1px #ffffff; 
	color:#8a817c;
	padding-left: 30px;
	position: absolute;
	margin-top: -50px;
}

@media screen and (max-width: 1200px) {
	#top-pickup .box .item h3{
	padding-left: 20px;
	letter-spacing: -0.025em;
	}	
}




#top-pickup .box .item h3:before{
	content: "";
	position: absolute;
	width:387px;
	height:33px;
	background-image: url("../image/contents/top/pickup-title-accent-up.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: -25px;
	bottom:-10px;
}



@media screen and (max-width: 1440px) {
	#top-pickup .box .item h3:before{
		width: 330px;
		height:100%;
		background-position: bottom;
	}	
}



#top-pickup .box .item .pickup-text{
	margin: 0;
	padding:50px 15px 25px 30px;
	background-color:#fff;
	font-size: 20px;
}

@media screen and (max-width: 1300px) {
	#top-pickup .box .item .pickup-text{
	letter-spacing: -0.025em;
	}	
}


@media screen and (max-width: 1200px) {
	#top-pickup .box .item .pickup-text{
		padding-left: 20px;
		letter-spacing: -0.055em;
	}	
}


@media screen and (max-width: 750px) {
	#top-pickup .box .item .pickup-text{font-size: 24px;letter-spacing: -0.015em;}
	
	#top-pickup .box .item:nth-child(3) .pickup-text br{display: none;}	

}



/*----------------------------------------------------------------------------
   トップ　お部屋のご案内
------------------------------------------------------------------------------*/

#top-guide {
	position: relative;
	/*margin: 70px auto;*/
	padding:70px 0;
	background-color: #f4f3ee;
}


#top-guide .content{
	position: relative;
	/*padding: 50px;*/
}

@media screen and (max-width: 1440px) {
	#top-guide .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1100px) {
	#top-guide .content{
		
	}

}




#top-guide h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}


#top-guide h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}		
	

#top-guide .description{
	margin-bottom: 50px;
	text-align: center;
}

#top-guide .description span{display: inline-block;}

#top-guide .banner{
	list-style: none;
	padding-left: 0;
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: 0;
}


@media screen and (max-width: 960px) {
	#top-guide .banner{	
			-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
}

#top-guide .banner li{
	margin-right: 50px;
	position: relative;
	width: 410px;
/* 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;	*/
}



@media screen and (max-width: 1200px) {
	#top-guide .banner li{
		margin-right: 30px;
	}
	
}

@media screen and (max-width: 960px) {
	#top-guide .banner li{
		margin-right: 0px;
	}
	
	#top-guide .banner li:first-child{margin-bottom: 30px;}
}



/*
@media screen and (max-width: 1000px) {
	#top-guide .banner li{
		width: calc(50% - 15px);
	}
}
*/

#top-guide .banner li:last-child{margin-right: 0;}



#top-guide .banner li a{
/*	display: block;*/
display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;	
	width: 100%;
	height: 149px;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;	
	text-decoration: none;
	color:#463f3a;
	padding: 30px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;	
}

@media screen and (max-width: 750px) {
	#top-guide .banner li a{font-size: 28px;}
	
}

#top-guide .banner li:nth-child(1) a{background-image: url("../image/contents/top/room-button01.png");}

#top-guide .banner li:nth-child(2) a{background-image: url("../image/contents/top/room-button02.png");}


#top-guide .banner li a:hover{
	box-shadow: 5px 5px 5px rgba(70,63,58,0.5);
	transform: translateY(-5px);
	transition-duration: 0.5s;
	filter: brightness(1.1);
	color:#e0afa0;
}

#top-guide .banner li a span{
  	text-shadow : 
       2px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  2px 2px rgba(255, 255, 255, 0.8),
       2px -2px 2px rgba(255, 255, 255, 0.8),
      -2px -2px 2px rgba(255, 255, 255, 0.8),
       2px  0px 2px rgba(255, 255, 255, 0.8),
       0px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  0px 2px rgba(255, 255, 255, 0.8),
       0px -2px 2px rgba(255, 255, 255, 0.8);
}



/*----------------------------------------------------------------------------
   トップ　room(共通)
------------------------------------------------------------------------------*/


#top-room .content{
	position: relative;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;	
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 50px 0;
}


@media screen and (max-width: 1440px) {
	#top-room .content{
	margin: auto;
	width: calc(100% - 100px);
	}
}

@media screen and (max-width: 1100px) {
	#top-room .content{
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;	
	}
}

#top-room .content:before{
	content: "";
	position: absolute;
	width: 38px;
	height:277px;
	background-image: url("../image/contents/top/room-flame-left.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: -60px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


#top-room .content:after{
	content: "";
	position: absolute;
	width: 38px;
	height:277px;
	background-image: url("../image/contents/top/room-flame-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	right: -60px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


#top-room .content .box{
	width: calc(100% - 340px);
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;	
}

@media screen and (max-width: 1100px) {
	#top-room .content .box{
  	width: 100%;
	}
}




#top-room .content .box .item{
	width: calc( 50% - 15px);
	margin-right: 30px;
	position: relative;
	margin-bottom: 50px;
}

#top-room .content .box .item:nth-child(2n){margin-right: 0px;}



#top-room .content .box .item a{text-decoration: none;display: block;position: relative;}

#top-room .content .box .item a::before{ /* ボタンと同じサイズの白い半透明の疑似要素beforeを作成し、非表示にしておく */
    display: none;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #FFF;
    opacity: 0.25;
}


#top-room .content .box .item a:hover{
  box-shadow: 5px 5px 5px rgba(70,63,58,0.5);
  transform: translateY(-5px);
  transition-duration: 0.5s;
/*filter: brightness(1.1);	*/
}


#top-room .content .box .item a:hover::before { /* マウスホバー時に先程作成したbeforeを表示させる */
    display: block;
}


#top-room .content .box .item img{width: 100%; height: auto; cursor: pointer;}


#top-room .content .box .item .room-no{
	font-size: 60px;
  	font-family: "FOT-MatisseEleganto Pro";
	font-weight: normal;
	text-shadow: 0px 2px 3.04px rgba(0, 0, 0, 0.15);
	color: #fff;
	font-style: italic;
	position: absolute;
	left: 15px;
	bottom: -50px;
}



#top-room .content .room-title{
	width: 340px;
	text-align: center;
	color: #fff;
	padding: 0 15px;
}

@media screen and (max-width: 1100px) {
	#top-room .content .room-title{
  	width: 100%;
	}
}



#top-room .content .room-title h2.rank{
	position: relative;
  	font-size: 36px;
  	font-family: "FOT-MatisseEleganto Pro";
	font-weight: normal;
	padding: 84px 0;
	margin-bottom: 30px;
	display: block;	
}

#top-room .content .room-title h2.rank:before{
	content: "";
	position: absolute;
	width: 167px;
	height:84px;
	background-image: url("../image/contents/top/rank-title-accent-up.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: 0;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
#top-room .content .room-title h2.rank:after{
	content: "";
	position: absolute;
	width: 167px;
	height:84px;
	background-image: url("../image/contents/top/rank-title-accent-down.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	bottom: 0;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

#top-room .content .room-title .description{
	font-size: 18px;
	margin-top: 0px;
	margin-bottom: 0;
}

@media screen and (max-width: 750px) {
	#top-room .content .room-title .description{font-size: 24px;}
	
}


@media screen and (max-width: 1100px) {
	#top-room .content .room-title .description{
		margin-bottom: 50px;
	}
}

#top-room .content .room-title .description span{display: inline-block;}

#top-room #top-room-rank1 .content .room-title .description span:first-of-type{display: block;}


#top-room-rank4,#top-room-rank2 {
	position: relative;
	background-image: url("../image/contents/top/room-odd-bg.jpg");
	background-position: center;
	background-size: cover;
}


#top-room-rank3,#top-room-rank1 {
	position: relative;
	background-image: url("../image/contents/top/room-even-bg.jpg");
	background-position: center;
	background-size: cover;
}

@media screen and (max-width: 1100px) {
	#top-room-rank3 .content,#top-room-rank1 .content{
  	-ms-flex-wrap: wrap-reverse;
	flex-wrap: wrap-reverse;
	}
}






/*----------------------------------------------------------------------------
   トップページ　お知らせ
------------------------------------------------------------------------------*/

#top-news{
	position: relative;
	background-color: #f4f3ee;
}

#top-news .content{
	padding: 70px 0;
	
}


@media screen and (max-width: 1440px) {
	#top-news .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1000px) {
	#top-news .content{
		padding: 70px 0 40px;
	}

}




#top-news h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}


#top-news h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}		


#top-news .news-box{
	list-style: none;
	padding-left: 0;
	margin: 0;
	margin-bottom: 50px;
}

#top-news .news-box li{border-bottom: 1px #9e9e9e dotted;}
#top-news .news-box li:first-child{border-top: 1px #9e9e9e dotted;}


#top-news .news-box li a{
	padding: 30px;
	padding-right: 60px;
	position: relative;
	display: block;
	text-decoration: none;
}

@media screen and (max-width: 1000px) {
	#top-news .news-box li a{padding-right: 80px;}	
}





#top-news .news-box li a:before{
	content: "";
	position: absolute;
	width: 30px;
	height:30px;
	background-image: url("../image/common/arrow-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: 50%;
	right: 30px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


#top-news .news-box li a .data{color:#bf751f;display: inline-block;margin-right: 30px;}
#top-news .news-box li a .title{color:#221a17;display: inline-block;}


@media screen and (max-width: 1000px) {
	#top-news .news-box li a .title{display: block;}	
}



#top-news .news-box li a:hover .title{color:#e0afa0;text-decoration: underline;}

#top-news .banner{
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	padding-left: 0;
	list-style: none;
}

#top-news .banner li{
	width: calc( 25% - 22.5px);
	margin-right: 30px;
	border: 1px solid #c6c6c6;
}

@media screen and (max-width: 1000px) {
	#top-news .banner li{width: calc( 50% - 15px);margin-bottom: 30px;}
	
	#top-news .banner li:nth-child(2n){margin-right: 0;}
}

#top-news .banner li:nth-child(4n){margin-right: 0;}
#top-news .banner li:last-child{margin-right: 0;}

#top-news .banner li a{display: block;background-color: #fff;text-align: center;}

#top-news .banner li a img{max-width: 100%;height: auto;}

#top-news .banner li a:hover{opacity: 0.8;}




/*----------------------------------------------------------------------------
   blog template custom
------------------------------------------------------------------------------*/

.blog .content {
	margin-bottom: 50px;
	transition: 0.2s;
}

@media screen and (max-width: 1240px) {
	.blog .content {
		padding-left: 30px;
	}
	.subpage.blog #contents article {
		padding-right: 360px !important;
	}
}

.blog .content h3 {
	font-size: 28px !important;
	/*line-height: 85px;*/
	background-color: #e0afa0 !important;
	color: #fff;
	margin-top: 50px;
	padding:15px;
	border-radius: 5px;
}

.blog .content h4 {
	border-radius: 5px;
}

.blog .content h4 span {
	color: #bf751f !important;
}

@media screen and (max-width: 750px) {
	.blog .content h4 span{
	  font-size: 22px!important;
	}	
}


.blog .content .post img{border-radius: 5px;}

.blog .content .post img.aligncenter, .blog .content .post img.alignleft, .blog .content .post img.alignright {
	border-radius: 5px;
}

.blog #content-sidebar .blog-latest li {
	background-image: url("../img/contents/top/merit-detail-ar.png");
	background-position: center right;
	background-repeat: no-repeat;
}


.blog #content-sidebar .blog-latest li a span {
  color: #bf751f!important;
}

@media screen and (max-width: 750px) {
	.blog #content-sidebar .blog-latest li a span {
	  font-size: 22px!important;
	}	
}



/*------------------------------------------------------------------------------------------------------------------
下層ページ 共通
-------------------------------------------------------------------------------------------------------------------*/

#subvisual{
    position: relative;
    width: 100%;
	background-image: url("../image/common/bg-subvisual.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    height:300px;
    background-position: 50%;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    z-index: 0;
	padding-top: 70px;
	overflow: hidden;
	
}	


#subvisual h1{
	color: #fff;
	padding:15px;
	position: relative;
	text-align: center;
	line-height: 1.0;

}

#subvisual h1:before{
	content:"";
	background-image: url("../image/common/subvisual-title.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: 181px;
	height: 85px;
	top:-85px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	position: absolute;
	
}

#subvisual h1 span{margin-left: 10px;}

/*------------------------------------------------------------------------------------------------------------------
下層ページ パンくず
-------------------------------------------------------------------------------------------------------------------*/
.breadcrumb{background-color: #f4f3ee;}


.breadcrumb-list{
	padding-left: 0;
	display: block;
	list-style: none;
	padding-top: 30px;
	/*padding-bottom: 30px;*/
	margin-bottom: 0;
	margin-top: 0;
}

.breadcrumb-list li{
	position: relative;
	margin-right: 50px;
	display: inline-block;
}

.breadcrumb-list li:before{
  content: '';
  width: 10px;
  height: 10px;
  border: 0;
  border-top: solid 2px #371e25;
  border-right: solid 2px #371e25;
  position: absolute;
  top: 50%;
  right: -30px;
  margin-top: -8px;
  transform: rotate(45deg);	
	
}

.breadcrumb-list li:last-child{margin-right: 0;}
.breadcrumb-list li:last-child::before{content: none;}

.breadcrumb-list li.current{font-weight: bold;}

.breadcrumb-list li a{text-decoration: underline;}



/*------------------------------------------------------------------------------------------------------------------
当ホテルについて
-------------------------------------------------------------------------------------------------------------------*/

#room .introduce {
	position: relative;
	padding:70px 0;
	background-color: #f4f3ee;
}


#room .introduce .content{
	position: relative;
}

@media screen and (max-width: 1440px) {
	#room .introduce .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1100px) {
	#room .introduce .content{
		
	}

}

#room .introduce h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}


#room .introduce h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}		
	

#room .introduce .description{
	margin-bottom: 50px;
	text-align: center;
}

#room .introduce .description span{display: inline-block;}

#room .introduce .banner{
	list-style: none;
	padding-left: 0;
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: 0;
}


@media screen and (max-width: 960px) {
	#room .introduce .banner{	
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;		
	}
}

#room .introduce .banner li{
	margin-right: 50px;
	position: relative;
	width: calc(33.33% - 33.33px);
}


#room .introduce .banner li:last-child{margin-right: 0;}

@media screen and (max-width: 1440px) {
	#room .introduce .banner li{
		margin-right: 30px;
		width: calc(33.33% - 20px);		
	}
	
}

@media screen and (max-width: 960px) {
	#room .introduce .banner li{
		width: calc(50% - 15px);
	}
#room .introduce .banner li:first-child{margin-left: 30px;margin-bottom: 30px;}
	
}


#room .introduce .banner li a{
	display: block;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;	
	text-decoration: none;
	color:#463f3a;
	cursor: pointer;
}


@media screen and (max-width: 750px) {
	#room .introduce .banner li a{font-size: 28px;}
}


#room .introduce .banner li a img{width: 100%;height: auto;}



#room .introduce .banner li a span{
  	text-shadow : 
       2px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  2px 2px rgba(255, 255, 255, 0.8),
       2px -2px 2px rgba(255, 255, 255, 0.8),
      -2px -2px 2px rgba(255, 255, 255, 0.8),
       2px  0px 2px rgba(255, 255, 255, 0.8),
       0px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  0px 2px rgba(255, 255, 255, 0.8),
       0px -2px 2px rgba(255, 255, 255, 0.8);
	position: absolute;
	left: 30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	display: block;
}

#room .introduce .banner li a:hover{
	box-shadow: 5px 5px 5px rgba(70,63,58,0.5);
	transform: translateY(-5px);
	transition-duration: 0.5s;
	filter: brightness(1.1);
	color:#e0afa0;
}



#room .introduce .banner li a:hover::before {
    display: block;
}


#room .price{
	padding:70px 0 55px;
	background-image: url("../image/contents/room/price-bg.jpg");
	background-repeat: repeat;
}

#room .price h2{color: #fff;}

#room .price h2 span:before{
	background-image: url("../image/common/title-whiteaccent-left.png");	
}

#room .price h2 span:after{
background-image: url("../image/common/title-whiteaccent-right.png");	
}		
	
#room .price .description{text-align: right;color: #fff;padding-right: 30px;}

#room .price .content{
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	margin:30px auto 0;
}

@media screen and (max-width: 1440px) {
	#room .price .content{
	width: calc(100% - 60px);
	}
}

#room .price .content .box{
	width: calc(50% - 25px);
    padding: 50px;
    margin-bottom: 50px;
    position: relative;
    background-color: #fff;
	  background-image: 
	  url("../image/contents/room/price-flame-left.png"),
	   url("../image/contents/room/price-flame-right.png"),
	   url("../image/contents/room/price-flame-rightdown.png"),
	  url("../image/contents/room/price-flame-leftdown.png");
	background-repeat: no-repeat;
background-position: left 10px top 10px,right 10px top 10px,right 10px bottom 10px,left 10px bottom 10px;
	background-size: 80px 80px;
	text-align: center;
}

#room .price .content .box:nth-child(1){margin-right: 50px;}

/*#room .price .content .box:nth-child(3){width: 100%;/*margin-bottom: 0;}*/
#room .price .content .box:nth-child(3){margin-right: 50px;}
#room .price .content .box:nth-child(4){height: 70%;display: flex;flex-direction: column;justify-content: center;}

@media screen and (max-width: 1440px) {
	#room .price .content .box{
	width: calc(50% - 15px);
	margin-bottom: 30px;
	}
	#room .price .content .box:nth-child(1){margin-right: 30px;}	
	#room .price .content .box:nth-child(3){margin-right: 30px;}	
}

@media screen and (max-width: 1000px) {
	#room .price .content .box{
	width: 100%;
	}
	#room .price .content .box:nth-child(1){margin-right: 0px;}	
	#room .price .content .box:nth-child(3){margin-right: 0px;}	
}







#room .price .content .box:before{
    content: '';
    position: absolute;
	top:20px;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);	
	width: calc(100% - 200px);
	height: calc(100% - 48px);
	border-top: 4px double #ba9950;
	border-bottom: 4px double #ba9950;
}

#room .price .content .box:after{
	content: '';
    position: absolute;
	top:50%;
	left: 20px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);	
	width: calc(100% - 48px);
	height: calc(100% - 200px);
	border-left: 4px double #ba9950;
	border-right: 4px double #ba9950;
}


#room .price .content .box .price-plan{line-height: 1.2;}

#room .price .content .box .price-plan h3{
	font-size: 36px;
	font-weight: bold;
  	text-shadow : 
       3px  3px 1px #ffffff,
      -3px  3px 1px #ffffff,
       3px -3px 1px #ffffff,
      -3px -3px 1px #ffffff,
       3px  0px 1px #ffffff,
       0px  3px 1px #ffffff,
      -3px  0px 1px #ffffff,
       0px -3px 1px #ffffff; 
	color:#8a817c;
	position: relative;
	/*padding-left: 30px;*/
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}

@media screen and (max-width: 1200px) {
	#room .price .content .box .price-plan h3{
	letter-spacing: -0.025em;
	}	
}

#room .price .content .box .price-plan h3 span{display: block;font-size:24px;}

#room .price .content .box .price-plan h3:before{
	content: "";
	position: absolute;
	width: 100%;
	height: 30px;
	background-image: url("../image/contents/top/pickup-title-accent-up.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	bottom: -10px;	
}


#room .price .content .box .price-description{}


#room .price .content .box .price-description h4{color: #463f3a;}
#room .price .content .box .price-description h4 span:first-child{margin-right: 15px;}

#room .price .content .box .price-description h4 span:last-child{
    font-size: 34px;
	letter-spacing: -0.05em;
}

@media screen and (max-width: 1440px) {
	#room .price .content .box .price-description h4 span:first-child{margin-right: 0px;display: block;}
}

#room .price .content .box .price-description dl{
	margin: 0;
	margin-bottom: 50px;
	position: relative;
}


#room .price .content .box .price-description dl:before{
    position: absolute;
    left: 50%;
    bottom: -25px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: calc(100% - 60px);
    height: 2px;
    content: '';
    background-image: -webkit-linear-gradient(90deg,#ba9950 0%, #ceb278 50%,#ba9950 100%);
    background-image: linear-gradient(90deg, #e3d3b2 0%, #e3d3b2 25%,#f9f4ed 50%,#e3d3b2 75%,#e3d3b2 100%);	
/*    background-image: -webkit-linear-gradient(90deg, #ba9950 0%, #ceb278 30%, #d5be8c 60%,#e3d3b2 100%);
    background-image: linear-gradient(90deg, #ba9950 0%, #ceb278 30%, #e3d3b2 60%,#f9f4ed 100%);*/	
}



#room .price .content .box .price-description dl dd{
	margin: 0;
}




.room-content .content{
	position: relative;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;	
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;		
	padding: 50px 0;
}


@media screen and (max-width: 1440px) {
	.room-content .content{
	margin: auto;
	width: calc(100% - 100px);
	}
}

/*
@media screen and (max-width: 1100px) {
	.room-content .content{
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;	
	}
}
*/
.room-content .content:before{
	content: "";
	position: absolute;
	width: 38px;
	height:277px;
	background-image: url("../image/contents/top/room-flame-left.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: -60px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


.room-content .content:after{
	content: "";
	position: absolute;
	width: 38px;
	height:277px;
	background-image: url("../image/contents/top/room-flame-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	right: -60px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


.room-content .content .box{
	width: calc(100% - 340px);
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;	
}

@media screen and (max-width: 1100px) {
	.room-content .content .box{
  	width: 100%;
	}
}


.room-content .content .box .item{
	width: calc( 50% - 15px);
	margin-right: 30px;
	position: relative;
	margin-bottom: 50px;
}

.room-content .content .box .item:nth-child(2n){margin-right: 0px;}

.room-content .content .box .item a{text-decoration: none;display: block;position: relative;}

.room-content .content .box .item a::before{
    display: none;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #FFF;
    opacity: 0.25;
}


.room-content .content .box .item a:hover{
  box-shadow: 5px 5px 5px rgba(70,63,58,0.5);
  transform: translateY(-5px);
  transition-duration: 0.5s;
}


.room-content .content .box .item a:hover::before {
    display: block;
}


.room-content .content .box .item img{width: 100%; height: auto; cursor: pointer;}


.room-content .content .box .item .room-no{
	font-size: 60px;
  	font-family: "FOT-MatisseEleganto Pro";
	font-weight: normal;
	text-shadow: 0px 2px 3.04px rgba(0, 0, 0, 0.15);
	color: #fff;
	font-style: italic;
	position: absolute;
	left: 15px;
	bottom: -50px;
}



.room-content .content .room-title{
	width: 100%;
	text-align: center;
	color: #fff;
	padding: 0 15px;
}

.room-content .content .room-title h2.rank{
	position: relative;
  	font-size: 36px;
  	font-family: "FOT-MatisseEleganto Pro";
	font-weight: normal;
	padding: 84px 0;
	margin-bottom: 30px;
	display: block;	
}

.room-content .content .room-title h2.rank:before{
	content: "";
	position: absolute;
	width: 167px;
	height:84px;
	background-image: url("../image/contents/top/rank-title-accent-up.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: 0;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
.room-content .content .room-title h2.rank:after{
	content: "";
	position: absolute;
	width: 167px;
	height:84px;
	background-image: url("../image/contents/top/rank-title-accent-down.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	bottom: 0;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.room-content .content .room-title .description{
	font-size: 18px;
	margin-top: 0px;
	margin-bottom: 50px;
}

@media screen and (max-width: 750px) {
	.room-content .content .room-title .description{font-size: 24px;}
	
}


.room-content .content .room-title .description span{display: inline-block;}

.room-content #room-rank1 .content .room-title .description span:first-of-type{display: block;}


#room-odd {
	position: relative;
	background-image: url("../image/contents/top/room-odd-bg.jpg");
	background-position: center;
	background-size: cover;
}


#room-even {
	position: relative;
	background-image: url("../image/contents/top/room-even-bg.jpg");
	background-position: center;
	background-size: cover;
}


#room-rank4,#room-rank2 {
	position: relative;
	background-image: url("../image/contents/top/room-odd-bg.jpg");
	background-position: center;
	background-size: cover;
}


#room-rank3,#room-rank1 {
	position: relative;
	background-image: url("../image/contents/top/room-even-bg.jpg");
	background-position: center;
	background-size: cover;
}


#room-rank3 .content,#room-rank1 .content{
-ms-flex-wrap: wrap-reverse;
flex-wrap: wrap-reverse;
}




/*------------------------------------------------------------------------------------------------------------------
アクセス
-------------------------------------------------------------------------------------------------------------------*/


#access.access{
	position: relative;
	background-color:#f4f3ee;
	padding: 70px 0;
}


@media screen and (max-width: 1100px) {
	#access.access{
		padding-bottom: 0;
	}
}

#access.access h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}

#access.access h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}	


#access.access .content{
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
/*  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;*/	
}

@media screen and (max-width: 1440px) {
	#access.access .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1100px) {
	#access.access .content{
  	-webkit-box-orient: vertical;
  	-webkit-box-direction: reverse;
  	-ms-flex-direction: column-reverse;
  	flex-direction: column-reverse;
	}
}


#access.access .content .box{
	width: calc( 50% - 15px );
	margin-right: 30px;
}

#access.access .content .box:last-child{margin-right: 0;}

@media screen and (max-width: 1100px) {
#access.access .content .box{
		width: 100%;
	    margin-right: 0px;
		margin-bottom: 30px;
	}
}



#access.access .description{margin-bottom: 30px;}

#access.access .content .box .item{
	background-color: #fff;
	padding: 30px;
}

#access.access .content .box .item dl{
	position: relative;
}

#access.access .content .box .item dl dt{
	width: 100px;
	padding: 15px;
	position: absolute;
   top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	
}

#access.access .content .box .item dl dd{
	padding-left:120px;
	margin-left: 0;
}


#access.access .gmap {
height: 0;
overflow: hidden;
padding-bottom: 800px;
position: relative;
}


@media screen and (max-width:1100px) {
	#access.access .gmap {
	padding-bottom: 56.25%;
	}
}


#access.access .gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}

#access.access .root{
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	margin:0 -15px;
	padding-top: 50px;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}


#access.access .root .root-item{
	width: 50%;
	padding: 0 15px;
	position: relative;
	margin-bottom: 30px;
}


#access.access .root .root-item img{
	width: 100%;
	height: auto;
}

#access.access .root .root-item .root-text{
	letter-spacing: -0.075em;
	margin: 0 0 15px;
	padding: 15px;
	background-color: #fff;
}




/*----------------------------------------------------------------------------
   お部屋共通
------------------------------------------------------------------------------*/

#room .introduce {
	position: relative;
	padding:70px 0;
	background-color: #f4f3ee;
}


#room .introduce .content{
	position: relative;
}

@media screen and (max-width: 1440px) {
	#room .introduce .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1100px) {
	#room .introduce .content{
		
	}

}



#room .introduce h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}


#room .introduce h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}		
	

#room .introduce .description{
	margin-bottom: 50px;
	text-align: center;
}

#room .introduce .description span{display: inline-block;}


#room .introduce .banner{
	list-style: none;
	padding-left: 0;
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: 0;
}


@media screen and (max-width: 960px) {
	#room .introduce .banner{	
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;		
	}
}



#room .introduce .banner li{
	margin-right: 50px;
	position: relative;
	width: 410px;
}


#room .introduce .banner li:last-child{margin-right: 0;}

@media screen and (max-width: 1440px) {
	#room .introduce .banner li{
		margin-right: 30px;
	}
}


@media screen and (max-width: 960px) {
	#room .introduce .banner li{
		margin-right: 30px;
		width: calc(50% - 15px);
	}
	
}

/*@media screen and (max-width: 960px) {
	#room .introduce .banner li{
		width: calc(50% - 15px);
	}
#room .introduce .banner li:first-child{margin-left: 30px;margin-bottom: 30px;}
	
}*/

#room .introduce .banner li a{
	display: block;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;	
	text-decoration: none;
	color:#463f3a;
	cursor: pointer;
}


@media screen and (max-width: 750px) {
#room .introduce .banner li a{font-size: 28px;}
}

#room .introduce .banner li a img{width: 100%;height: auto;}

#room .introduce .banner li a span{
  	text-shadow : 
       2px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  2px 2px rgba(255, 255, 255, 0.8),
       2px -2px 2px rgba(255, 255, 255, 0.8),
      -2px -2px 2px rgba(255, 255, 255, 0.8),
       2px  0px 2px rgba(255, 255, 255, 0.8),
       0px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  0px 2px rgba(255, 255, 255, 0.8),
       0px -2px 2px rgba(255, 255, 255, 0.8);
	position: absolute;
	left: 30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	display: block;
}

#room .introduce .banner li a:hover{
	box-shadow: 5px 5px 5px rgba(70,63,58,0.5);
	transform: translateY(-5px);
	transition-duration: 0.5s;
	filter: brightness(1.1);
	color:#e0afa0;
}


#room .introduce .banner li a:hover::before { /* マウスホバー時に先程作成したbeforeを表示させる */
    display: block;
}





@media screen and (max-width: 960px) {
	#room .introduce .banner.room-banner li:first-child{margin-left: 0px;margin-bottom: 0px;}
}



#room .room-gallery,#room .room-gallery.rank4,#room .room-gallery.rank2{
	background-image: url("../image/contents/room/room-bg.jpg");
}

#room .room-gallery.rank1,#room .room-gallery.rank3{
	background-image: url("../image/contents/room/room-bg-even.jpg");
}


#room .room-gallery .content{
	padding: 70px 0;
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;		
	margin:0 -15px;
}


@media screen and (max-width: 1440px) {
	#room .room-gallery .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}



@media screen and (max-width:1000px) {
	#room .room-gallery .content{padding-bottom: 40px;}
}


#room .room-gallery .content .gallery-content{
	width: 50%;
	/*padding: 68px 15px;*/
	padding: 0px 15px;
	position: relative;
}

@media screen and (max-width:1000px) {
	#room .room-gallery .content .gallery-content{
		width: calc(100% - 30px);
		margin-bottom: 50px;
	}
}


#room .room-gallery .content .bx-viewport:before{
	content: "";
	position: absolute;
	width: 187px;
	height:100px;
	background-image: url("../image/contents/room/gallery-flame-left.png");
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: 0;
	left: 0px;
	z-index: 1;
}

#room .room-gallery .content .gallery-content h2{
	position: relative;
  	font-size: 36px;
  	font-family: "FOT-MatisseEleganto Pro";
	font-weight: normal;
	/*padding: 84px 0;*/
	margin-bottom: 30px;
	display: block;	
	color: #fff;
}

#room .room-gallery .content .gallery-content h2:before{
	content: "";
	position: absolute;
	width: 80px;
	height:80px;
	background-image: url("../image/contents/room/gallery-title-left.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: -15px;
	left: 0;
}
#room .room-gallery .content .gallery-content h2:after{
	content: "";
	position: absolute;
	width: 80px;
	height:80px;
	background-image: url("../image/contents/room/gallery-title-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	bottom: -15px;
	right:0;
}


#room .room-gallery .content .gallery-content .gallery-box{
	list-style: none;
	padding-left: 0;
	margin: 0;
}

#room .room-gallery .content .gallery-content .gallery-box p{
	margin: 0;
	background-color: #fff;
	padding: 15px;
    padding-right: 45px;	
}

@media screen and (max-width:1000px) {
	#room .room-gallery .content .gallery-content .gallery-box p{
		padding: 15px;
	}
}



#room .room-gallery .content .gallery-content .gallery-box img{width: 100%;height: auto;position: relative;}

#room .room-gallery .content .gallery-content .gallery-box p{position: relative;}


#room .room-gallery .content .gallery-content .gallery-box p:before{
	content: "";
	position: absolute;
	width: 187px;
	height:100px;
	background-image: url("../image/contents/room/gallery-flame-right.png");
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: -100px;
	right: 0px;
	z-index: 1;
}



#room .room-gallery .content .custom-thumb{
	width: 50%;
	padding: 0 15px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	margin: 0 -7.5px;
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;	
}

@media screen and (max-width:1000px) {
	#room .room-gallery .content .custom-thumb{
		/*width: calc(100% - 30px);*/
		width: 100%;
		margin: 0;
	}
}


#room .room-gallery .content .custom-thumb a{
	/*margin: 0 7.5px 15px;
	display: inline-block;*/
	width: 33.33%;
	padding: 0 7.5px;
	position: relative;
	margin-bottom: 15px;
	/*background:#333;*/
	cursor: pointer;
}

@media screen and (max-width:1000px) {
	#room .room-gallery .content .custom-thumb a{
	width: 33.33%;
	padding: 0 15px;
	margin-bottom: 30px;
	}
}

#room .room-gallery .content .custom-thumb a:hover{	filter: brightness(1.1);}

#room .room-gallery .content .custom-thumb a img{width:100%; height: auto;opacity: 0.7;}

#room .room-gallery .content .custom-thumb a.active img{
  opacity: 1;/*選択されているものは透過しない*/
}


#room .room-price{
	padding:70px 0 55px;
	background-image: url("../image/contents/room/price-bg.jpg");
	background-repeat: repeat;
}

#room .room-price h2{color: #fff;}

#room .room-price h2 span:before{
	background-image: url("../image/common/title-whiteaccent-left.png");	
}

#room .room-price h2 span:after{
background-image: url("../image/common/title-whiteaccent-right.png");	
}		
	
#room .room-price .description{text-align: right;color: #fff;padding-right: 30px;}



#room .room-price .content{
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	margin:30px auto 0;
}

@media screen and (max-width: 1440px) {
	#room .room-price .content{
	width: calc(100% - 60px);
	}
}

#room .room-price .content .box{
	width: calc(50% - 25px);
    padding: 50px;
	margin-right: 50px;
    margin-bottom: 50px;
    position: relative;
    background-color: #fff;
	  background-image: 
	  url("../image/contents/room/price-flame-left.png"),
	   url("../image/contents/room/price-flame-right.png"),
	   url("../image/contents/room/price-flame-rightdown.png"),
	  url("../image/contents/room/price-flame-leftdown.png");
	background-repeat: no-repeat;
background-position: left 10px top 10px,right 10px top 10px,right 10px bottom 10px,left 10px bottom 10px;
	background-size: 80px 80px;
	text-align: center;
display:flex;
justify-content:center;
align-items:center;
flex-direction: column;
}

#room .room-price .content .box:nth-child(2n){margin-right: 0;}

@media screen and (max-width: 1440px) {
	#room .room-price .content .box{
	width: calc(50% - 15px);
	margin-bottom: 30px;
	margin-right: 30px;	
	}
}

@media screen and (max-width: 1000px) {
	#room .room-price .content .box{
	width: 100%;
	margin-right: 0;
	}
}



#room .room-price .content .box:before{
    content: '';
    position: absolute;
	top:20px;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);	
	width: calc(100% - 200px);
	height: calc(100% - 48px);
	border-top: 4px double #ba9950;
	border-bottom: 4px double #ba9950;
}

#room .room-price .content .box:after{
	content: '';
    position: absolute;
	top:50%;
	left: 20px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);	
	width: calc(100% - 48px);
	height: calc(100% - 200px);
	border-left: 4px double #ba9950;
	border-right: 4px double #ba9950;
}


#room .room-price .content .box .price-plan{line-height: 1.2;width:100%;}

#room .room-price .content .box .price-plan h3{
	font-size: 36px;
	font-weight: bold;
  	text-shadow : 
       3px  3px 1px #ffffff,
      -3px  3px 1px #ffffff,
       3px -3px 1px #ffffff,
      -3px -3px 1px #ffffff,
       3px  0px 1px #ffffff,
       0px  3px 1px #ffffff,
      -3px  0px 1px #ffffff,
       0px -3px 1px #ffffff; 
	color:#8a817c;
	position: relative;
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}

@media screen and (max-width: 1200px) {
	#room .room-price .content .box .price-plan h3{
	letter-spacing: -0.025em;
	}	
}

#room .room-price .content .box .price-plan h3 span{display: block;font-size:24px;}

#room .room-price .content .box .price-plan h3:before{
	content: "";
	position: absolute;
	width: 100%;
	height: 30px;
	background-image: url("../image/contents/top/pickup-title-accent-up.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	bottom: -10px;	
}


#room .room-price .content .box .price-description{width:100%;}


#room .room-price .content .box .price-description h4{color: #463f3a;}
#room .room-price .content .box .price-description h4 span:first-child{margin-right: 15px;}

#room .room-price .content .box .price-description h4 span:last-child{
    font-size: 34px;
	letter-spacing: -0.05em;
}

@media screen and (max-width: 1440px) {
	#room .room-price .content .box .price-description h4 span:first-child{margin-right: 0px;display: block;}
}

#room .room-price .content .box .price-description dl{
	margin: 0;
	margin-bottom: 50px;
	position: relative;
}


#room .room-price .content .box .price-description dl:before{
    position: absolute;
    left: 50%;
    bottom: -25px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: calc(100% - 60px);
    height: 2px;
    content: '';
    background-image: -webkit-linear-gradient(90deg,#ba9950 0%, #ceb278 50%,#ba9950 100%);
    background-image: linear-gradient(90deg, #e3d3b2 0%, #e3d3b2 25%,#f9f4ed 50%,#e3d3b2 75%,#e3d3b2 100%);	
}



#room .room-price .content .box .price-description dl dd{
	margin: 0;
}


/*設備一覧（共通）*/

#facility.facility{
    position: relative;
    padding: 70px 0;
    /*background-color: #f4f3ee;*/
	background-image: url("../image/contents/room/facility-bg.png");
	background-repeat: repeat;
}

#facility.facility h2{color: #fff;}

#facility.facility h2 span:before{
	background-image: url("../image/common/title-whiteaccent-left.png");	
}

#facility.facility h2 span:after{
background-image: url("../image/common/title-whiteaccent-right.png");	
}		



#facility.facility .content{
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;	
	  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
/*-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;	
	margin:0 -15px;*/
	width: 1155px;
	margin: auto;
}

@media screen and (max-width: 1260px) {
	#facility.facility .content{
	width: calc(100% - 30px);
	-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;		
	}
}

#facility.facility .content .box{
    /*width: calc(20% - 15px);*/
	width: 150px;
    padding: 15px;
    margin: 7.5px 7.5px;
    position: relative;
    /*background-color: #dcd1c0;*/
	background-color: #ece7d9;
	color: #fff;
	text-align: center;
  	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;	
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;	
}


#facility.facility .content .box.select{
	background-color: #463f3a;
}

#facility.facility .content .box img{max-width: 100%;height: auto;}

#facility.facility .content .box p{margin: 0;margin-top: 15px;line-height: 1.2;}


#facility.facility .content .box p span{display: inline-block;}



#facility.facility .attention{
	padding-left: 0;
	margin-left: 35px;
	margin-top: 30px;

}


@media screen and (max-width: 1440px) {
		#facility.facility .attention{
		width: calc(100% - 30px);
		margin-left: 15px;				
	}
	
/*	#facility.facility .attention{
		width: 950px;
		margin: auto;		
		margin-top: 30px;
	}*/
}

@media screen and (max-width: 1260px) {
	#facility.facility .attention{
		width: 990px;
		margin-left: auto;
		margin-right: auto;
	}
}


@media screen and (max-width: 1100px) {
	#facility.facility .attention{
		width: calc(100% - 60px);
	}
}


/*@media screen and (max-width: 1000px) {
	#facility.facility .attention{
		width: calc(100% - 100px);
	}
}
*/

@media screen and (max-width: 850px) {
	#facility.facility .attention{
		width: calc(100% - 30px);
	}
}



#facility.facility .attention li{
	margin-left: 30px;	
    text-indent: -18px;
	list-style: none;
	margin-bottom: 15px;
}

#facility.facility .attention li:last-child{margin-bottom: 0;}

@media (max-width: 750px) {
	#facility.facility .attention li{
	margin-left: 35px;	
    text-indent: -22px;
		
	}
}

#facility.facility .attention li::before{
  position: relative;
  top: 0;
  left: 0;
  display: inline-block;
  content: '※';
  margin-right: 18px;
}

/*
#facility.facility .attention li span{display: inline-block;position: relative;text-indent: 0;}

@media (max-width: 750px) {
	#facility.facility .attention li span{display:block;}
}
*/


#facility.facility .attention li .pc-none{display: none;}

@media (max-width: 980px) {
	#facility.facility .attention li:nth-child(2) .pc-none{display:block;}
}

@media (max-width: 750px) {
	#facility.facility .attention li .pc-none{display:block;}
}







/*クレジットカード一覧（共通）*/

.credit-card{
	padding:30px 30px 15px;
	/*background-color:#f4f3ee;*/
	background-color:#fff;
	/*margin: 50px auto 0;*/
	margin: 0 auto;
	text-align: center;
}

@media screen and (max-width: 1440px) {
	.credit-card{
	width: calc(100% - 60px);
	margin-top: 20px;
	}
}

/*
@media screen and (max-width: 1000px) {
	.credit-card{
	width: calc(100% - 30px);
	}
}
*/
.credit-card .credit-content{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;	
	  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}


@media screen and (max-width: 1000px) {
	.credit-card .credit-content{
	padding:0 120px;
	}
}


@media screen and (max-width: 850px) {
	.credit-card .credit-content{
	padding:0 60px;
	}
}


.credit-card .description{text-align: center!important;color: #010101!important; padding-right: 0px!important;}



.credit-card img{margin-right: 15px;margin-bottom: 15px;}
.credit-card img:last-child{margin-right: 0px;}



#facility.facility .banner{
	list-style: none;
	padding-left: 0;
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: 0;
	margin-top: 50px;
}


#facility.facility .banner li{
	margin-right: 0px;
	position: relative;
	width: 410px;
}


#facility.facility .banner li a{
display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;	
	width: 100%;
	height: 149px;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;	
	text-decoration: none;
	color:#463f3a;
	padding: 30px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	background-color: #f4f3ee;
}

@media screen and (max-width: 750px) {
	#facility.facility .banner li a{font-size: 28px;}
	
}

#facility.facility .banner li:nth-child(1) a{background-image: url("../image/contents/room/room-banner.png");}

#facility.facility .banner li a:hover{
	box-shadow: 5px 5px 5px rgba(70,63,58,0.5);
	transform: translateY(-5px);
	transition-duration: 0.5s;
	filter: brightness(1.1);
	color:#e0afa0;
}

#facility.facility .banner li a span{
  	text-shadow : 
       2px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  2px 2px rgba(255, 255, 255, 0.8),
       2px -2px 2px rgba(255, 255, 255, 0.8),
      -2px -2px 2px rgba(255, 255, 255, 0.8),
       2px  0px 2px rgba(255, 255, 255, 0.8),
       0px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  0px 2px rgba(255, 255, 255, 0.8),
       0px -2px 2px rgba(255, 255, 255, 0.8);
}






/*------------------------------------------------------------------------------------------------------------------
お知らせ
-------------------------------------------------------------------------------------------------------------------*/

.blog .post{border-bottom:1px solid #e0afa0;padding-bottom: 50px;}

#info .breadcrumb{background-color: #fff;}


.blog #content-sidebar h2{background-color: #e0afa0 !important;}

@media screen and (max-width: 750px){
	.blog #content-sidebar h2{font-size:28px!important;}	
}

.blog .post h4 {margin-bottom: 30px;border-bottom: 2px dotted #e0afa0;padding-bottom: 15px;}


.blog #content-sidebar .blog-latest li a{position: relative;padding-right: 45px;}

.blog #content-sidebar .blog-latest li a:before{
	content: "";
	position: absolute;
	width: 30px;
	height:30px;
	background-image: url("../image/common/arrow-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: 50%;
	right: 0px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}


.blog #content-sidebar .blog-category li a {
	text-align: left!important;
	text-indent: 0px!important;
}

.blog #content-sidebar .blog-category li {
	margin-bottom: 5px;
}

.blog #content-sidebar .blog-category li a:after {
	content: ""!important;
	position: absolute;
	width: 20px!important;
	height:20px!important;
	background-image: url("../image/common/arrow-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	top: 50%;
	right: 10px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.blog #content-sidebar .blog-category li a:hover {
	border: 1px solid #e0afa0!important;
	color: #e0afa0!important;
}





/*------------------------------------------------------------------------------------------------------------------
プライバシーポリシー個人情報
-------------------------------------------------------------------------------------------------------------------*/
#privacypolicy .bg-subvisual h1 span{display: inline-block;}
#privacypolicy .bg-subvisual h1 span:last-child{margin-right: 0;}

@media screen and (max-width: 1000px) {
	#privacypolicy .bg-subvisual h1 span:first-child{
	margin-bottom: 15px;
	}
}

#privacypolicy .breadcrumb{background-color: #fff;}

#privacypolicy .content{
	padding: 50px 0;
	letter-spacing: 0.025em;
}

@media screen and (max-width: 1000px) {
#privacypolicy .content{
	letter-spacing: 0;
}
}

#privacypolicy .content p{margin:0;margin-bottom: 30px;padding:0 15px;}
#privacypolicy .content p.description{padding: 0;}

#privacypolicy .content h4{
	background-color: #e0afa0;
	border-radius: 5px;
	margin: 0;
	margin-bottom: 30px;
	padding: 10px 15px;;
	color: #fff;
}

#privacypolicy .content ul{
	margin:0;
/*	padding-left: 26px;	
    text-indent: -26px;*/
	list-style: none;
	margin-bottom: 30px;
	margin-left: 15px;
	padding-left: 0;
}

@media (max-width: 750px) {
	#subpage .privacy ul{
		padding-left: 50px;	
		text-indent: -50px;
	}	
}


#privacypolicy .content ul li{display: inline-block;/*margin-bottom: 10px;*/}
#privacypolicy .content ul li:first-child{display: inline-block;margin-right: 30px;}


#privacypolicy .content ul li::before{
  position: relative;
  top: 2px;
  left: 0;
  display: inline-block;
  width: 16px;
  height: 16px;
  content: '';
  border-radius: 100%;
  background: #d9c497;
  margin-right: 10px;
}

@media (max-width: 750px) {
	#privacypolicy .content ul li::before{
	  width: 22px;
	  height: 22px;
	  margin-right: 15px;
	}
}





/*------------------------------------------------------------------------------------------------------------------
お問い合わせ
-------------------------------------------------------------------------------------------------------------------*/
#contact .breadcrumb {
    background-color: #fff;
}

#contact .tel-content{
	position: relative;
	/*background-color:#f4f3ee;*/
	padding: 70px 0;
}


#contact .tel-content .content{
	position: relative;
	padding: 50px;
	border: dotted 5px #463f3a;
	margin: auto;
}

@media screen and (max-width: 1440px) {
	#contact .tel-content .content{
	margin: auto;
	width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1200px) {
	#contact .tel-content .content{
	padding: 50px 30px;
	}
}
@media screen and (max-width: 1000px) {
	/*#contact .tel-content .content{
	padding: 50px 30px 20px;
	}
	*/
}

#contact .tel-content .content:before{
	content: "";
	position: absolute;
	width: 162px;
	height:27px;
	background-image: url("../image/contents/contact/tel-flame-up.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: 50%;
	top: -35px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);	
}


#contact .tel-content .content:after{
	content: "";
	position: absolute;
	width: 162px;
	height:27px;
	background-image: url("../image/contents/contact/tel-flame-down.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: 50%;
	bottom: -35px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);	
}

#contact .tel-content .content .box{
	text-align: center;
}


#contact .tel-content .content .box:before{
	content: "";
	position: absolute;
	width: 21px;
	height:151px;
	background-image: url("../image/contents/contact/tel-flame-left.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	left: -30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);	
}

#contact .tel-content .content .box:after{
	content: "";
	position: absolute;
	width: 21px;
	height:151px;
	background-image: url("../image/contents/contact/tel-flame-right.png");	
	background-size: contain;
	background-position: left;
	background-repeat: no-repeat;
	right: -30px;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);	
}

#contact .tel-content h2 span br{display: none;}

@media screen and (max-width: 800px) {
#contact .tel-content h2 span{display: block;}
#contact .tel-content h2 span br{display: block;}
}

#contact .tel-content h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}

#contact .tel-content h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}		
	
@media screen and (max-width: 800px) {
#contact .tel-content h2 span:before{left:-15px;}
#contact .tel-content h2 span:after{right:-15px;}
}


#contact .tel-content .box .description span{display: inline-block;}

/*
#contact .tel-content a{
	position: relative;
	font-size:30px;
	font-weight: bold;
	text-decoration: none;
	color: #463f3a;
	padding-left: 42px;
}

#contact .tel-content a:before{
	position: absolute;
	content:"";
	background-image: url("../image/contents/contact/tel-icon.png");
	width:32px;
	height: 50px;
	background-repeat: no-repeat;
	background-size: contain;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

*/
#contact .tel-content .content .banner{
	list-style: none;
	padding-left: 0;
 	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: 0;
	margin-top: 30px;
}


@media screen and (max-width: 960px) {
	#contact .tel-content .content .banner{	
			-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
}

#contact .tel-content .content .banner li{
	margin-right: 50px;
	position: relative;
	width: 410px;
}



@media screen and (max-width: 1200px) {
	#contact .tel-content .content .banner{
		margin-right: 30px;
	}
	
}

@media screen and (max-width: 960px) {
	#contact .tel-content .content .banner li{
		margin-right: 0px;
	}
	
	#contact .tel-content .content .banner li:first-child{margin-bottom: 30px;}
}

#contact .tel-content .content .banner li:last-child{margin-right: 0;}

#contact .tel-content .content .banner li a{
/*	display: block;*/
display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;	
	width: 100%;
	height: 149px;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;	
	text-decoration: none;
	color:#463f3a;
	padding: 30px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;	
}

@media screen and (max-width: 750px) {
	#contact .tel-content .content .banner li a{font-size: 28px;}
	
}

#contact .tel-content .content .banner li:nth-child(1) a{background-image: url("../image/contents/top/room-button02.png");}


#contact .tel-content .content .banner li a:hover{
	box-shadow: 5px 5px 5px rgba(70,63,58,0.5);
	transform: translateY(-5px);
	transition-duration: 0.5s;
	filter: brightness(1.1);
	color:#e0afa0;
}

#contact .tel-content .content .banner li a span{
  	text-shadow : 
       2px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  2px 2px rgba(255, 255, 255, 0.8),
       2px -2px 2px rgba(255, 255, 255, 0.8),
      -2px -2px 2px rgba(255, 255, 255, 0.8),
       2px  0px 2px rgba(255, 255, 255, 0.8),
       0px  2px 2px rgba(255, 255, 255, 0.8),
      -2px  0px 2px rgba(255, 255, 255, 0.8),
       0px -2px 2px rgba(255, 255, 255, 0.8);
}




#contact .cancel-box{
	width: 100%;
    padding: 30px;
    margin-bottom: 50px;
    position: relative;
    background-color: #fff;
	  background-image: 
	  url("../image/contents/contact/cancel-flame-left.png"),
	   url("../image/contents/contact/cancel-flame-right.png"),
	   url("../image/contents/contact/cancel-flame-rightdown.png"),
	  url("../image/contents/contact/cancel-flame-leftdown.png");
	background-repeat: no-repeat;
background-position: left 5px top 5px,right 5px top 5px,right 5px bottom 5px,left 5px bottom 5px;
	background-size: 55px 55px;
	text-align: center;
}

@media screen and (max-width: 750px) {
	#contact .cancel-box{
		letter-spacing: -0.025em;
	}
}

#contact .cancel-box p span{display: inline-block;}


#contact .cancel-box h4{
	margin: 0;
	margin-bottom: 50px;
	position: relative;
}


#contact .cancel-box h4:before{
    position: absolute;
    left: 50%;
    bottom: -25px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: calc(100% - 60px);
    height: 2px;
    content: '';
    background-image: -webkit-linear-gradient(90deg,#ba9950 0%, #ceb278 50%,#ba9950 100%);
    background-image: linear-gradient(90deg, #e3d3b2 0%, #e3d3b2 25%,#f9f4ed 50%,#e3d3b2 75%,#e3d3b2 100%);	
}









#contact .mail-content{
	position: relative;
	padding: 70px 0;
	background-color:#f4f3ee;
}

#contact .mail-content h2 span:before{
	background-image: url("../image/common/title-pinkaccent-left.png");	
}

#contact .mail-content h2 span:after{
background-image: url("../image/common/title-pinkaccent-right.png");	
}		

#contact #mail_form{padding-top: 50px;}


@media screen and (max-width: 750px) {
	#mailform-layout .item {
		border-bottom: none!important;
	}
}







#mailform-layout .item .name {
	width: 230px!important;
}


@media screen and (max-width: 750px) {
	#mailform-layout .item .name{
		background-color: #e0afa0;
		width: 100%!important;
		padding: 15px;
		color: #fff;
	}
}


#mailform-layout .item .answer {
	padding-left: 260px!important;
}

@media screen and (max-width: 750px) {
	#mailform-layout .item .answer {
		padding-left: 15px!important;
		width: 100%;
		padding-top: 80px!important;
	}
}

span.flatpickr-weekday{font-size:100%;}
.flatpickr-weekdaycontainer > .flatpickr-weekday:nth-child(1){color: #FF0000;}
.flatpickr-weekdaycontainer > .flatpickr-weekday:nth-child(7){ color: #4593ea;}


#mailform-layout input[type=text],
#mailform-layout input[type=tel],
#mailform-layout input[type=email] {width: 100%;padding: 15px!important;	}


#mailform-layout .yourage input[type=text],
#mailform-layout .numpeople input[type=text]{width: 80px;margin-right: 10px;}


@media screen and (max-width: 750px) {
	#mailform-layout .yourage input[type=text],
#mailform-layout .numpeople input[type=text]{width: 100px!important;}	
}


.submit-button button {
	background-color: #e0afa0!important;
	color: #fff!important;
	border: 1px solid #e0afa0!important;
}

.submit-button button:hover {
	background-color: #a38e80!important;
	border: 1px solid #a38e80!important;
	color: #fff!important;
}


.submit-button button:after{
    width: 5px;
    height: 5px;
    border-top: 1px solid #e0afa0!important;
    border-right: 1px solid #e0afa0!important;
	right: 18px!important;
}

.submit-button button:hover:after{
    border-top: 1px solid #a38e80!important;
    border-right: 1px solid #a38e80!important;	
}

.submit-button button.pageback{
	color: #e0afa0!important;
	border: 1px solid #e0afa0!important;
	background-color: #fff!important;
	
}

.submit-button button.pageback:hover{
	background-color: #e0afa0!important;
	border: 1px solid #e0afa0!important;
	color: #fff!important;
}

.submit-button button.pageback:after{
    width: 5px;
    height: 5px;
    border-top: 1px solid #e0afa0!important;
    border-right: 1px solid #e0afa0!important;
		right: 21px;
		top: calc(50% - 3px)!important;
		transition: 0.2s;
}

input[type=radio]+label:before{border: 1px solid #e0afa0;}

input[type=radio]{
  position: absolute;
  opacity: 0;
  z-index: -1; 
display: block!important;	
}


input[type=radio]:hover+label:before {
	border-color:#e0afa0!important;
	background-color:#e0afa0!important;
}

input[type=radio]:checked+label:before {
	border-color:#e0afa0!important;
	background-color:#e0afa0!important;
}

#mailform-layout .postcode input:nth-of-type(1) {
	width: 80px!important;
}
#mailform-layout .postcode input:nth-of-type(2) {
	width: 100px!important;
}	


@media screen and (max-width: 750px) {
	input[type=text],input[type=tel],input[type=email] {
		padding: 15px!important;
		width: 100%!important;
	}

	#mailform-layout .postcode input:nth-of-type(1) {
		width: 80px!important;
	}
	#mailform-layout .postcode input:nth-of-type(2) {
		width: 100px!important;
	}	
	
	#mailform-layout .required{
    top: 50%!important;
    transform: translateY(-50%)!important;
    -webkit-transform: translateY(-50%)!important;
    -ms-transform: translateY(-50%)!important;
	right: 15px!important;
	font-size: 18px!important;
	}

}

select{
	position: relative;
	width: 100%;
	padding: 15px!important;
	background: #fff;
	border: 1px solid #cccccc;
	border-radius: 3px;
}

#mailform-layout input[type=text].calendar{
	width: 300px!important;
	margin-right: 40px;
	display: inline-block;
}

@media screen and (max-width:1000px) {
	#mailform-layout input[type=text].calendar{
		margin-right: 30px;
	}
}

@media screen and (max-width:950px) {
	#mailform-layout input[type=text].calendar{
		display: block;
		margin-bottom: 15px;
	}
}

@media screen and (max-width:750px) {
	#mailform-layout input[type=text].calendar{
		display: inline-block;
		margin-bottom: 0px;
	}
}

.flatpickr-current-month .flatpickr-monthDropdown-months{padding: 0!important;}


#mailform-layout .schedule{display: block;margin-bottom: 15px;}
#mailform-layout .schedule:nth-of-type(2){margin-bottom: 0px;}

#mailform-layout .schedule .time{
	position: relative;
	width:100px;
	display: inline-block;
	margin-right: 15px;
}

@media screen and (max-width:1000px) {
	#mailform-layout .schedule .time{
		margin-right: 15px;
	}
}

#mailform-layout .schedule .time:nth-of-type(2){margin-right: 40px;}

#mailform-layout .room{
	width:300px;
	display: block;
	margin-bottom: 15px;
}

#mailform-layout .room:nth-of-type(2){margin-bottom: 0px;}

.mailform-box{background-color: #fff!important;}

.mailform-setup-alart span{display: inline-block;}

.mailform-alart span{display: inline-block;}