@charset "utf-8";
a{transition:all 0.5s;}
#header {
	position: relative;
	padding: 0 0 5px 0;
	color: #333;
	font-size: 1em;
	margin: 0.5em 0 0.8em 0;
}
#header .region {
	padding: 0 0 1em 0;
	overflow: hidden;
}
#header .region a {
	color: #069
}
#header .region a:hover {
	text-decoration: underline;
}
#header h1 {
	font-size: 2.1em;
	line-height: 1.2;
	overflow: hidden;
	margin: 0.1em 0 0 0;
}
#header h1 a {
	color: #069;
}
#header h1 a::after{content:"，";display: inline;opacity: 0;font-size: 0.5em;
}
#header h1 a:hover {
	text-decoration: underline;
}
#header h1 .level {
	display: inline-block;
	font-size: 20px;
	background: url(../_inc/gridlist/images/grid_stars.svg);
	background-size:auto 2em;
	height: 1em;
	vertical-align: middle;
	margin: 0;
}
#header h1 .size50,
#header h1 .stars5{
     width: 5em;
}
#header h1 .size45,
#header h1 .stars45{
     width: 4.5em;
}
#header h1 .size40,
#header h1 .stars4{
     width: 4em;
}
#header h1 .size35,
#header h1 .stars35{
     width: 3.5em;
}
#header h1 .size30,
#header h1 .stars3{
     width: 3em;
}
#header h1 .size25,
#header h1 .stars25{
     width: 2.5em;
}
#header h1 .size20,
#header h1 .stars2{
     width: 2em;
}
#header h1 .size10,
#header h1 .stars1{
     width: 1em;
}

#header h2 {
	font-size: 1.1em;
	line-height: 1.2em;
	font-weight: normal;
	margin: 0.2em 0;
}
.type{margin:0;display: flex;flex-wrap: wrap;font-size:1em;max-width: 100%;}
.type li{flex:0 0 auto;margin:5px 5px 0 0}
.type li a{display: block; background:rgba(0,0,0,0.1);border-radius:5px;padding:0.2em 0.9em;color:#444}
.type li a:hover{background: rgba(0,0,0,0.6);color:#fff;}
.legitimate {
    color: #900;
    margin: 0.5em 0 .5em;
	font-size: 0.92em;
}
#header .link {
	margin: 0 0 0.3em 0;
	font-size: 1.2em;
	line-height: 1.2em;
}
#header .link a {
	color: #069;
}
#header .link a:hover {
	text-decoration: underline;
}
#header .price {
	color: #000;
	font-size: 1em;line-height: 1.6em;
	font-weight: bold;
}
#header .price em {
	color: #c00;
	font-size: 1.9em;
	font-style: normal; line-height: 1.1em;
}
#header .price b {
	color: #c00;
	font-size: 1em;
	font-style: normal;
	padding-right: 0.25em;
}
#header .price i {
	font-style: normal;
	font-weight: normal;
}
#header #share {
	position: absolute;
	right: 0.5em;
	top: -2.5em;
	font-size: 1.1em;
}
#header .value {
	position: absolute;
	right:0;
	bottom: 0.75em;
	font-size: 1.3em;line-height: 1.2;vertical-align: middle;
}
#header .header_tripadvisor{margin: 8px 0 4px 0;}
#header .header_tripadvisor a{color:#000;}
#header .header_tripadvisor a:hover{text-decoration: underline;}
.ncc{float: left;vertical-align: middle;}
.ncc img{width:115px;margin:0 10px  0 0;display:block;}
#header .booking {
	display: block;
	float: right;
	margin: 0 0 0 0.5em;
}
#header .booking a {
	display: block;
	width:96px;
	text-align: center;
	background: #f90;
	color: #fff;
	font-size: 1em;
	line-height: 1.7em;
	margin: 0.4em 0 0 0;
}
#header .booking a:hover {
	background: #f60;
	color: #fff;
}
/*main*/

#main {
	float: left;
	width: 100%;
	position: relative;
	margin:0 -320px 0 0;
	padding:0 320px 0 0;
}
#album {
	position: relative;
	width: 100%;
	height: 620px;
}
#album.no_pic{background:#F2F2F2;text-align: center;overflow: hidden;}
#album.no_pic span{display: block;position: relative;margin:auto;top:50%;transform:translateY(-50%);}
#pic1{margin: 0 0 25px 0;height:525px}
#pic1 .swiper-slide{width:100%;height: 100%;display: block}
#pic1 .swiper-slide .pic_l{background:#000;width:100%;height:471px;overflow: hidden; position: relative;text-align: center}
#pic1 .swiper-slide img{opacity: 0;transition:opacity 0.3s;position: relative;top:50%;max-width:100%;transform:translateY(-50%);}
#pic1 .swiper-slide img.swiper-lazy-loaded{opacity:1;}
#pic1 .swiper-slide .pic_txt{display: block;font-size:0.9em;min-height: 1.6em;line-height: 1.6}
#pic1 .swiper-slide span{display: block;}
#pic1 .swiper-pagination{display: none;}
#pic2 .swiper-slide{width:90px;opacity: 0.3;}
#pic2 .swiper-slide img {
width: 100%;
}
#pic2 .swiper-slide.active-nav{opacity:1;}
.pic_menu{line-height: 1.5; position:absolute;top:514px;left: 0;width: 100%;border-bottom: 1px solid #CCC;z-index:2;white-space: nowrap;overflow: auto;display: block;}
.pic_menu li{width:auto;display: inline-block;}
.pic_menu a{display: block;text-align:center;padding: 0 1em;width: 100%;color:#000;border-bottom: 3px solid #fff;transition:border 0.5s;}
.pic_menu a:hover{border-bottom: 3px solid #CCC;}
.pic_menu li.v a{border-bottom: 3px solid #C00;}
/*  */
.mobile_cal {
	display: none;
}
.mobile_button {
	text-align: center;
	padding: 20px 0;
}
.mobile_button a {
	display: block;
	text-align: center;
	font-weight: bold;
	background: #fcae12;
	color: #000;
	font-size: 1.5em;
	line-height: 1.5em;
	margin: 0.4em 0 0 0;
}
.mobile_button a:hover {
	background: #F7C768;
	color: #000;
}
/*side*/

#side {
	float: left;
	width: 300px;
	margin: 0 0 0 20px;
	overflow: hidden; 
	position:relative;
	min-height: 620px;
}
#side iframe {
	width: 100%;
	height: 400px;
	margin: 10px 0 0 0;
}
#side iframe#tripadvisor_iframe {
	height: 300px;
}
#map {
	position: relative;
	font-size: 1em;
	margin: 0;
	line-height: 1.2em;
	padding: 0;
}
#map a {
	display: block;
	color: #000;line-height: 1.5em;
}
#map a:hover {
	color: #c00;
}
#map a .icon,
li.project_name h3 .icon{
	display: inline-block;
	background:url(../images/i.png) top center;
	background-size: 1.03em auto;
	width: 1em;
	height: 1em;
	border-radius:50%;
	font-size: 1.2em;
	margin: 0 0 0.1em 0.2em;
}
#map a:hover .icon {background-position: bottom center}
#map .img {display:block;background-position:center center;
	width: 100%;
	max-width: 500px;
	height:97px;
	border-radius: 0;
	border: 1px solid #ccc;
	margin: 6px auto 3px auto;background-image: url(../images/mapbg.jpg);
}
#qrcode {
	font-size: 1.05em;
	text-align: center; bottom:-6px; right:0;
	position: absolute;
	margin:0;
	line-height: 0;
	background: #FFF;
	padding: 0;
}
#qrcode img {
	margin: 0 0 0.3em 0;
}
#qrcode a {
	color: #666;
}
#qrcode h3 {
	display: block;
	padding: 0;
	font-weight: normal;
}
/* iframe load圖 */
iframe{background: url(../images/loadinfo.gif) no-repeat center center;}
iframe[src]{background:none;}

/*tripadvisor*/
.tripadvisor_button {
	display: none;
}
.tripadvisor_iframe {
    width: 300px;
    float: right;
    border: 1px solid #CCC;
    height: 100px;
    margin: 0;
}
/*text*/

#text {
	padding: 1em 1em 1em 0.5em;
	font-size: 1.05em;
	line-height: 1.5em;
	color: #444;
	position: relative;
	overflow: hidden;
	margin: 0;
}
#text h3 {
	font-size: 1.05em;
	color: #000;
	margin: 0 0 0.3em 0;
}
#text .othermsg {
	margin: 0 0 1em 0;
}
#text p {
	margin: 0 0 1em 0;
}
#text .more {
	color: #069;
}
#text .more a {
    color: #069;
    display: block;
    padding: 0 0 0 0;
    margin: 0 0 0.5em 0;
}
#text .more a::before{content: " ";display:inline-block;width: 0.5em;height: 0.5em;border:2px solid #069;border-width:2px 2px 0 0;transform: rotate(45deg);margin: 0 0.3em;vertical-align: middle;
}
#text .more a:hover:before {border-color:#009;
}
#text .more a:hover {
	color: #009;text-decoration: underline
}
/*facility*/

#facility {
	position: relative;
	margin: 0 0 0 0;
	font-size: 0.97em;
	line-height: 1.2em;
	overflow: hidden;
	padding: 1em 0;
	display: block;
	vertical-align: top;
	width: auto;
}
#facility h3 {
	font-size: 1.15em;
	display: block;
	margin:0 0 0.3em 0;
	
}
#facility ul{color:#000; margin:0 0 2em 0;}
#facility ul::after{content: " ";display: block;clear: both;}
#facility li {float: left;width:16.666666%;}
#facility p{line-height: 1.6;padding:0.2em 0 0.3em 0}
#facility .svg_icon{
  display: inline-block;
  width: 1em;
  height: 1em;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
font-size:2em;
	vertical-align: middle
}
#community {
	position: relative;
	margin: 0;
	font-size: 1em;
	line-height: 1.2em;
	border-top: 1px solid #CCC;
	padding: 1em 0;
}
#community h2 {
}
#community .txt {
}
.hr {
	border-bottom: 1px solid #ccc;
	height: 0px;
	width: 100%;
}
/*room*/

#rooms td.discount {
	text-align: left;
}
#rooms td.discount span {
	color: red;
}
td.Meal img {
	width: 15px;
}
/*footer*/

#footer {
	width: 100%;
}
#footer .box {
	padding: 0;
}

/*pad*/
@media (max-width: 1200px) {
div#content .size100 {
	padding: 0 10px;
}
}

@media (max-width:990px) {
#main {
	float: none;
	width: 100%;
	margin:0;
	padding:0;
}
	#header{padding: 0 0 5px 2%;}
	#header .value{right: 2%;}
#album{height:64vw;margin:0 0 160px 0;}
#album.no_pic{margin:0;}
.pic_menu{top:64vw;margin:40px 0 0 0}
#pic1{margin:0 0 50px 0;height:auto;}
#pic1 .swiper-slide .pic_l{height:64vw;}
#pic1 .swiper-slide .pic_txt{padding:0 0 0 2%;}	
#text {
	padding: 1em 2%;
}
	#facility {
    margin: 0 2%;
}
/* }

@media (max-width:768px) { */
#side {
	float: left;
	width: 100%;
	margin: 20px 0 10px 0;
	min-height: 0;
}
#map {
	width: 100%;
}
#map  span[property='vcard:street-address']{
	padding: 0 2%;
}
.mobile_cal {
	display: block;
	margin: 10px 0;
}
.mobile_button {
	text-align: center;
	padding: 20px 0;
/*	background: #360;*/
	color: #fff;
	font-size: 1.2em;
}
.mobile_cal ul {
	display: none;
}
.mobile_cal ul.open {
	display: table;
	width: 100%;
}
.mobile_cal ul li {
	display: table-cell;
	width: 33.34%;
	padding: 15px;
	background: #84AD33;
	color: #fff;
}
.mobile_cal input {
	vertical-align: middle;
	width: 75px;
	padding: 5px;
}
.mobile_cal select {
	padding: 2px;
}
aside#qrcode, #side iframe, #rooms {
	display: none;
}

.tripadvisor_button {
	display: block;
	padding: 6px 0;
	margin: 20px 2% 0;
	text-align: center;
	background: #F3F3F3;
	border: 1px solid #CCC;
	color:#797979;
	overflow:hidden;cursor: pointer;
	transition: .4s all;
}
.tripadvisor_button.op{max-height: 0;
	padding:0;
    border-top:0;
}
.tripadvisor_button:hover{
	background: #fff;
}
.tripadvisor_button img {
	max-width: 180px;
	vertical-align: middle;
	width: 45vw;
}
.tripadvisor_iframe {
	float: none;
	width: 96%;
	max-height: 0;
	margin:0 0 0 2%;
	border: 0;
	transition: .4s all;
	-moz-transition: .4s all;
	-webkit-transition: .4s all;
	-o-transition: .4s all;
}
.tripadvisor_iframe.op {
	max-height: 20em;
	border: 1px solid #CCC;
	border-top: 0;
}
/*月曆*/
div#ui-datepicker-div {
	padding: 0;
	background: #fff;
}
.ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all {
	border-radius: 0;
	border: 0;
	background: #336600;
	color: #fff;
}
.ui-datepicker th {
	background-color: #FFC;
}
th.ui-datepicker-week-end {
	background-color: #FE9;
}
.legitimate {margin: 0.5em 2% 2em 2%;}
#facility .legitimate {margin: 0.5em 0 0 0;}
}
@media (max-width:900px) {
#header .value {
	position: static;
	padding: 0.3em 0 0 0;
}
#header .booking{box-shadow:0 -3px 10px #FFF;float: none;position:fixed;bottom:0;left:0;width: 100%;margin:0;z-index:10}
#header .booking a{font-size: 1.2em;padding: 0.1em 0;width:100%;border-top:1px solid #FFF;margin: 0 auto;}
	
.value .ncc{float:right;}
.ncc img{width: 25vw; margin: 0;}
}
/*mobile*/
@media (max-width:740px) {
#new-footer {
    padding: 0 0 60px 0;
}
#header {
	position: static;
}
#header #share {
	top: 4em;
}
.pic_menu li{width:6em;}
	#facility li {
    width:33.3333%;
	}
}

@media (max-width:480px) {
#facility li {
    width:50%;
}
.mobile_cal ul li {
	display: inline-block;
	width: 100%;
}
.type{font-size: 0.87em;}
.type li a{padding:0.2em 0.6em;}
}