@charset "UTF-8";

/*------------------------------------------------------------------------
ホテルモントレラスール那覇
------------------------------------------------------------------------*/
#topmainimg .bgvideowrap {
	position: relative;
	padding-bottom: 56.25%;
	/*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
}

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

.bgvideowrap .pc {
	display: block;
}

.bgvideowrap .sp {
	display: none;
}

@media all and (max-width: 680px) {
	#topmainimg .bgvideowrap {
		padding-bottom: 0;
	}

	.bgvideowrap .pc {
		display: none;
	}

	.bgvideowrap .sp {
		display: block;
	}

	.video-wrap {
		position: relative;
		width: 100%;
		height: auto;
	}

	.video-wrap .playBtn {
		width: 120px;
		position: absolute;
		top: 40%;
		left: 37%;
		color: #FFF;
		font-size: 1.4em;
		font-weight: 600;
		background: url(../img/top/btn_play.png) no-repeat 50% 0;
		background-size: 80px;
		padding: 50px 0 0 0;
		opacity: 0.8;
		z-index: 10;
	}

	.video-wrap .playBtn.play {
		background: url(../img/top/bnt_stop.png) no-repeat 50% 0;
		background-size: 100px;
		opacity: 0.5;
	}
}

@media all and (max-width: 1024px) {
	#topmainimg .bgvideowrap {
		height: auto;
	}
}

a.sitelogo {
	background: rgba(239, 185, 34);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjOTQwODIyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZkMDYxYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
	background: -moz-linear-gradient(-45deg, rgba(239, 185, 34, 1) 0%, rgba(200, 183, 34, 1) 100%);
	background: -webkit-linear-gradient(-45deg, rgba(239, 185, 34, 1) 0%, rgba(200, 183, 34, 1) 100%);
	background: linear-gradient(135deg, rgba(239, 185, 34, 1) 0%, rgba(200, 183, 34, 1) 100%);
	filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#940822', endColorstr='#6d061c', GradientType=1);
	z-index: 100;
}

a.sitelogo h1 {
	background: url(../img/common/sitelogo_mark.svgz) no-repeat center center;
	background-size: 80px;
}

.cd-primary-nav ul.gmenu li.nav_btn:before {
	background-color: rgba(239, 185, 34, 1);
}

.header-hide a.sitelogo h1 {
	background: url(../img/common/sitelogo_mark.svgz) no-repeat center center;
	background-size: 30px !important;
}

#pagettl,
#pagettl_nosub {
	background: rgb(255, 255, 255);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
	background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 100%);
	background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 100%);
	background: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 100%);
	filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eaeaea', GradientType=1);
}

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

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

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


/*------------------------------------------------------------------------
ヘッダーフ予約ボタン
------------------------------------------------------------------------*/

.cd-primary-nav ul.header_menu li ul.btn_res li {
	height: 100%;
	font-size: 12px;
}

.cd-primary-nav ul.header_menu li ul.btn_res li>a {
	padding: 30px 0;
	height: 16px;
}

.header-hide .cd-primary-nav ul.header_menu li ul.btn_res li>a {
	padding: 11px 0;
	height: 16px;
}

/*------------------------------------------------------------------------
フッター予約ボタン
------------------------------------------------------------------------*/

@media screen and (max-width: 780px) {
	ul.btn_res_bottom {
		position: fixed;
		bottom: 0;
		left: 0;
		display: block;
		box-sizing: border-box;
		width: 100% !important;
		text-align: center;
		padding: 0;
		list-style: none;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		overflow: auto;
		font-size: 0;
	}

	ul.btn_res_bottom li {
		display: table-cell;
		font-size: 12px;
		line-height: 1;
		vertical-align: middle;
		font-weight: 300;
		margin: 0;
		padding: 0;
		text-transform: capitalize;
	}

	ul.btn_res_bottom li#resstay {
		display: table-cell;
		width: 90% !important;
	}

	ul.btn_res_bottom li {
		display: table-cell;
		width: 10% !important;
		background-color: #ccc;
	}

	ul.btn_res_bottom li:nth-child(2)>a {
		position: relative;
		display: block;
		width: 100%;
		height: 38px;
		font-size: 0;
		margin: 0 0;
		padding: 0 0 0 0;
		overflow: hidden;
		background-color: rgba(50, 50, 50, 1);
		color: rgba(255, 255, 255, 0);
	}

	ul.btn_res_bottom li:nth-child(2)>a:hover {
		background-color: rgba(80, 80, 80, 1);
	}

	ul.btn_res_bottom li:nth-child(2)>a:before {
		position: absolute;
		top: 16px;
		left: 50%;
		display: block;
		width: 10px;
		height: 10px;
		margin-left: -6px;
		border-left: 2px solid rgba(255, 255, 255, 1);
		border-bottom: 2px solid rgba(255, 255, 255, 1);
		content: "";
		-webkit-transform: rotate(135deg);
		-moz-transform: rotate(135deg);
		-o-transform: rotate(135deg);
		-ms-transform: rotate(135deg);
		transform: rotate(135deg);
	}
}

@media screen and (max-width: 680px) {
	ul.btn_res_bottom li#resstay {
		width: 90%;
	}

	ul.btn_res_bottom li:nth-child(2) {
		display: block;
		width: 10%;
		float: right;
		box-sizing: border-box;
		background-color: #ccc;
	}

	ul.btn_res_bottom li:nth-child(2)>a {
		width: 100%;
	}

	ul.link_footer {
		text-align: left;
	}

	ul.link_footer li {
		box-sizing: border-box;
		width: 100%;
		padding: 0 0 0 0px;
		margin-bottom: 10px;
	}
}


/*------------------------------------------------------------------------
トップページ
------------------------------------------------------------------------*/

.logomain {
	display: block;
	position: absolute;
	bottom: 50px;
	right: 50px;
	width: 300px;
	height: 0;
	overflow: hidden;
	padding: 200px 0 0 0;
	background: url(../img/common/sitelogo.svgz) no-repeat center center;
	background-size: contain;
	z-index: 10;
}

#topmainimg .flexslider .slides li {
	background: url(../img/top/mainimg1.webp) no-repeat center center;
	background-size: cover;
}

#topmainimg .flexslider .slides li:nth-child(2) {
	background: url(../img/top/mainimg2.webp) no-repeat center center;
	background-size: cover;
}

#topmainimg .flexslider .slides li:nth-child(3) {
	background: url(../img/top/mainimg3.webp) no-repeat center center;
	background-size: cover;
}

#topmainimg .flexslider .slides li:nth-child(4) {
	background: url(../img/top/mainimg4.webp) no-repeat center center;
	background-size: cover;
}

#topmainimg .flexslider .slides li:nth-child(5) {
	background: url(../img/top/mainimg5.webp) no-repeat center center;
	background-size: cover;
}

@media screen and (max-width: 480px) {
	.logomain {
		display: block;
		position: absolute;
		bottom: 60px;
		right: auto;
		left: 50%;
		width: 200px;
		height: 0;
		overflow: hidden;
		padding: 140px 0 0 0;
		margin: 0 0 0 -100px;
		background: url(../img/common/sitelogo.svgz) no-repeat center center;
		background-size: contain;
		z-index: 10;
	}
}


/*------------------------------------------------------------------------
宿泊
------------------------------------------------------------------------*/

.img_stay_main {
	background: url(../img/top/img_top_stay.jpg) no-repeat center center;
	background-size: cover;
}


/*------------------------------------------------------------------------
レストラン
------------------------------------------------------------------------*/

.img_rest_main {
	background: url(../img/top/img_top_rest.jpg) no-repeat center center;
	background-size: cover;
}

.logorest {
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 18px;
	font-weight: normal;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "HGS明朝E", "ＭＳ 明朝", "MS PMincho", serif;
	padding: 140px 0 0 0;
	text-align: center;
}

.logorest span {
	font-size: 24px;
}



.logorest_s span {
	font-size: 24px;
}

.logo_escale {
	background: url(../img/restaurant/logo_escale.svgz) no-repeat center top;
	background-size: 240px;
}

.logo_zuientei {
	background: url(../img/restaurant/logo_zuientei.svgz) no-repeat center top;
	background-size: 240px;
}

.logo_saiun {
	background: url(../img/restaurant/logo_saiun.svgz) no-repeat center top;
	background-size: 240px;
}

.logo_leaf {
	background: url(../img/restaurant/logo_leaf.svgz) no-repeat center top;
	background-size: 240px;
}

.img_rest_esca {
	background: url(../img/restaurant/img_rest_esca.jpg) no-repeat center center;
	background-size: cover;
}

.img_rest_zuien {
	background: url(../img/restaurant/img_rest_zuien.jpg) no-repeat center center;
	background-size: cover;
}

.img_rest_saiun {
	background: url(../img/restaurant/img_rest_saiun.jpg) no-repeat center center;
	background-size: cover;
}

.img_rest_leaf {
	background: url(../img/restaurant/img_rest_leaf.jpg) no-repeat center center;
	background-size: cover;
}

.mds_roomname_sub {
	margin: 0 0 2px 0;
	padding: 0;
	font-size: 16px;
	line-height: 1.2;
	font-weight: 300;
}

.mds_roomname {
	margin: 0 0 20px 0;
	padding: 0;
	font-size: 20px;
	font-weight: normal;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "HGS明朝E", "ＭＳ 明朝", "MS PMincho", serif;
	text-align: left;
}

.mds_roomname span {
	font-size: 32px;
}

@media all and (max-width: 800px) {
	.logorest {
		padding: 120px 0 0 0;
	}

	.logo_escale {
		background-size: 200px;
	}

	.logo_zuientei {
		background-size: 200px;
	}

	.logo_saiun {
		background-size: 200px;
	}

	.logo_leaf {
		background-size: 200px;
	}
}

@media all and (max-width: 480px) {
	.logorest {
		padding: 80px 0 0 0;
	}

	.logo_escale {
		background-size: 140px;
	}

	.logo_zuientei {
		background-size: 140px;
	}

	.logo_saiun {
		background-size: 140px;
	}

	.logo_leaf {
		background-size: 140px;
	}
}


/*------------------------------------------------------------------------
スパ
------------------------------------------------------------------------*/

.img_spa_main {
	background: url(../img/spa/img_spa_main.jpg) no-repeat center center;
	background-size: cover;
}

.ttl_spa {
	display: block;
	overflow: hidden;
	width: 300px;
	height: 0;
	margin: 0 auto 10px auto;
	padding: 140px 0 0 0;
	font-size: 12px;
	font-weight: normal;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "HGS明朝E", "ＭＳ 明朝", "MS PMincho", serif;
	text-align: center;
	background: url(../img/spa/logo_spa.svgz) no-repeat center center;
	background-size: contain;
}

.ttl_spa_s {
	display: block;
	overflow: hidden;
	width: 200px;
	height: 0;
	margin: 0 auto 0px auto;
	padding: 90px 0 0 0;
	font-size: 12px;
	font-weight: normal;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", "YuMincho", "HGS明朝E", "ＭＳ 明朝", "MS PMincho", serif;
	text-align: center;
	background: url(../img/spa/logo_spa.svgz) no-repeat center center;
	background-size: contain;
}

.img_spa_bodycare {
	background: url(../img/spa/img_bodycare.jpg) no-repeat center center;
	background-size: cover;
}

.img_spa_aroma {
	background: url(../img/spa/img_aroma.jpg) no-repeat center center;
	background-size: cover;
}

.img_spa_skin {
	background: url(../img/spa/img_skin.jpg) no-repeat center center;
	background-size: cover;
}

.img_spa_lounge {
	background: url(../img/spa/img_lounge.jpg) no-repeat center center;
	background-size: cover;
}

@media all and (max-width: 480px) {
	.ttl_spa {
		width: 160px;
		padding: 70px 0 0 0;
	}

	.ttl_spa_s {
		width: 160px;
		padding: 70px 0 0 0;
	}
}


/*------------------------------------------------------------------------
プラン一覧
------------------------------------------------------------------------*/

ul.planlist li a .icon_new {
	background: url(../img/common/icon_new.svg) no-repeat 0 0;
	background-size: contain;
}

ul.planlist li a .price span {
	color: rgba(239, 185, 34);
}


/*------------------------------------------------------------------------
宿泊おすすめ情報
------------------------------------------------------------------------*/

#stay_recomm .list_thumb_wrap {
	background: url(../img/stay/bg_stay_recomm.jpg) no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
}


/*------------------------------------------------------------------------
おすすめプラン
------------------------------------------------------------------------*/

#recomm_plan ul.slides li a .price span {
	color: rgba(239, 185, 34);
}


/*------------------------------------------------------------------------
お知らせ一覧
------------------------------------------------------------------------*/

.icon_category {
	background-color: rgba(239, 185, 34);
}


.voice li:nth-child(1) {
	padding: 0 30px 0 20px;
	width: 230px;
}

.voice li:nth-child(2) {
	padding: 0 30px 0 20px;
	width: 230px;
	border-left: 1px dotted rgba(0, 0, 0, 0.1);
}

@media all and (max-width:680px) {
	.voice li:nth-child(2) {
		border-left: none;
	}

}

/* チャットボット非表示 */
.talkappibot,
#talkappi-chat-greeting,
#talkappi-chat-icon {
	visibility: hidden;
}

/* 宿泊TOP隙間 */
/* #stay #pagettl {
	margin: 0;
} */

/* TOPリード文 */
.hotel_lead {
	display: block;
	position: absolute;
	bottom: 66vh;
	right: 0vw;
	width: 100vw;
	height: 0;
	color: white;
	font-size: 26px;
	text-align: center;
	font-weight: 400;
	z-index: 11;
	font-family: "BIZ UDMincho", serif;
	font-style: normal;
}

@media (min-width:600px) {
	.hotel_lead {
		bottom: 62vh;
		font-size: 36px;
		font-weight: 600;
		font-family: "BIZ UDMincho", serif;
		font-weight: 400;
		font-style: normal;
	}
}

/* プラン非表示 */
#recomm_plan .plan3,
#recomm_plan .plan4 {
	display: none;
}

#recomm_plan .slick-dots li:nth-child(3),
#recomm_plan .slick-dots li:nth-child(4) {
	display: none;
}

/* クラブモントレのhover幅調整 */
@media only screen and (min-width: 1280px) {
	.cd-primary-nav ul.header_menu li.cd_info>a {
		padding: 10px 0px;
		width: 100%;
		max-width: 80%;
		margin: 0 auto;
	}
}

/* お問合せTEL */
#hotelinfo
footer .tel_num {
	font-size: 24px;
}