@charset "utf-8";
/* CSS Document */
#loading{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:url(../images/footer_bg.jpg);
	transition:all 0.6s cubic-bezier(0.6, 0, 1, 1);
	z-index:10000;}
#loading.finish{
	top:-100%;}
#loading .load{
	opacity:0;
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-150px;
	margin-top:-151px;
	transition:all 2s ease;}
#loading .load.show{
	margin-top:-101px;
	opacity:1;}
#loading .line{
	position:relative;
	text-align:center;
    margin-top: 20px;}
.mainArea{
	padding:0;}
.bannerArea ul li{
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	height: 100vh;
}
.bannerArea ul li img{
	display: none!important;
}
h2{
	text-align: center;
	letter-spacing: 2px;
	position: relative;
	z-index: 1;
}

h2 strong{
	display: none;
	font-size: 18px;
	color: #363032;
	font-weight: normal;
	padding-bottom: 10px;
}
h2 em{
	color: #363032;
	font-size: 35px;
	font-weight: normal;
	display: inline-block;
	position: relative;
	padding-bottom: 26px;
}
h2 em:after{
	content: url(../images/title.png);
	position: absolute;
	left: 50%;
	margin-left: -58px;
	bottom: -3px;

}
.bannerArea .Txt{
	position: absolute;
	top: calc(100%/5);
	left: 35%;
	color: #fff;
	text-shadow: 3px 3px 3px rgba(0,0,0,0.7);
}
.bannerArea .Txt p.chinese{
	position: relative;
	font-size: 1.5em;
	text-align: right;
	
	display: inline-block;
	padding-right: 30px;
}
.bannerArea .Txt p.chinese strong{
	display: block;
	font-weight: normal;
	margin-right: -5px;
}
.bannerArea .Txt p.chinese:after{
	content: "";
	position: absolute;
	right: 10px;
	top: -5px;
	width: 1px;
	height: 92px;
	background: #fff;
	transform: rotate(20deg);
}
.bannerArea .Txt p.chinese b{
	font-weight: normal;
	font-size: 1.9em;
	padding: 0 7px;
}
.bannerArea .Txt p.chinese em{
	display: inline-block;
	letter-spacing: 7px;
	margin-top: 15px;
}
.bannerArea .Txt p.english{
	display: inline-block;
	font-size: 1.4em;
	padding-left: 9px;
}
.bannerArea .Txt p.english strong{
	margin-left: -9px;
	display: block;
	font-size: 2em;
	font-weight: normal;
}
.bannerArea .Txt p.detail{
	text-align: center;
	font-size: 1.2em;
	line-height: 2.2;
	letter-spacing: 5px;
	margin-top: 30px;
}
/**最新消息**/
.newsArea{
	padding:165px 0 130px 0;}
.newsArea h2:after{
	content: "WELCOME";
	position: absolute;
	left: 0;
	top: -60px;
	width: 100%;
	text-align: center;
	font-size: 160px;
	color: #f6f6f6;
	font-family: 'Cardo', serif;
	font-weight: normal;
	z-index: -1;
}
.newsArea ul{
	margin: 80px -14px 0 -14px;
}

.newsArea ul li{
	padding:0 14px;}

.newsArea ul li .Img{
	}

.newsArea ul li .Img a{
	display:block;}

.newsArea ul li .Img img{
	display:block;
	width:100%;}

.newsArea ul li .Txt{
	text-align: center;
	padding: 30px 5px 0 5px;
	overflow:hidden;}

.newsArea ul li .Txt h3{
	font-size:18px;}

.newsArea ul li .Txt h3 a{
	font-weight: normal;
	color:#363032;}

.newsArea ul li .Txt h3 a:hover{
	text-decoration:underline;}
.newsArea ul li .Txt .date{
	margin-top: 20px;
	color: #dcb669;
}
.newsArea ul li .Txt .date span{
	color: #c8c8c8;
	margin-right: 3px;
}
.newsArea ul li .Txt .date em{
	text-decoration: underline;
}
.newsArea ul li .Txt p{
	margin-top:24px;
	color: #858585;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 25px;
    height: 50px;
    overflow: hidden;
}

/*推薦商品/房型*/
.featureArea{
	position: relative;
	background: rgb(195,84,87); /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover, rgba(195,84,87,1) 0%, rgba(156,35,45,1) 100%); /* FF3.6-15 */
	background: -webkit-radial-gradient(center, ellipse cover, rgba(195,84,87,1) 0%,rgba(156,35,45,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: radial-gradient(ellipse at center, rgba(195,84,87,1) 0%,rgba(156,35,45,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c35457', endColorstr='#9c232d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	padding:90px 0;}
.featureArea .feature_bg{
	position: absolute;
	right: 0;
	top: 25px;
	background:url(../images/book_title.jpg);
	width: calc(100%/2.57);
	height: 100%;
	z-index: 0;
}
.featureArea ul{
	}

.featureArea ul li{
	padding:7px 0;}

.featureArea ul li .Img{
	float: right;
	position:relative;
	overflow:hidden;
	padding: 0 0 0 7px;
	}

.featureArea ul li .Img a{
	display:block;}

.featureArea ul li .Img img{
	display:block;
	width:100%;
	transition:all 0.6s ease;}
.featureArea ul li .Img:hover img{
	transform:scale(1.08);}
.featureArea ul li .Txt{
	padding: 0 30px 0 0;
	}

.featureArea ul li .Txt h3{
	}

.featureArea ul li .Txt h3 strong{
	font-weight:normal;}

.featureArea ul li .Txt h3 strong a{
	position:relative;
	display:block;
	font-size:23px;
	color:#fff;
	padding-bottom:5px;}
.featureArea ul li .Txt p.price{
	display: none;
}
.featureArea ul li .Txt span{
	font-size: 23px;
	color: #fff;
	text-transform: uppercase;
}
.featureArea ul li .Txt p{
	margin-top:40px;
	font-size:15px;
	color:#f3dfc3;
	line-height:1.8;
	height:100px;}
.featureArea ul li .Txt a.btn{
	margin-top: 35px;
	display: inline-block;
	color: #ddb971;
	font-style: italic;
	padding-right: 15px;
	background: url(../images/read.png) right top 6px no-repeat;
}
.featureArea ul li .Txt a.btn:hover{
	padding-right:25px;}
.featureArea .detailBox{
	position: relative;
	z-index: 1;
	padding: 22px 0 19px 50px;
	background:url(../images/room_icon.png) right top no-repeat;
}
.featureArea .detailBox p.price{
	font-size: 28px;
	color: #9e222d;
	font-style: italic;
	margin-bottom: 45px;
	line-height: 1;
}
.featureArea .detailBox p{
	font-size: 15px;
	color: #9e222d;
	line-height: 1.8;
}
.featureArea .detailBox a.btn_booking{
	margin-top: 50px;
	display: inline-block;
	font-size: 15px;
	color: #fff;
	padding: 16px 48px;
	background: #3a3738;
}
.featureArea .detailBox a.btn_booking:hover{
	background: #bf9c50;
}

.facArea{
	padding: 120px 0 130px 0;
	position: relative;}
.facArea:before{
	content: "";
	position: absolute;
	bottom: -98px;
	left: 50%;
	width: 1px;
	height: 153px;
	background:#dab866;
	z-index: 1;
}
.facArea ul{
	margin-top: 50px;
}
.facArea ul li{
	padding-bottom: 20px;
}
.facArea ul li .Img{
	position: relative;
	z-index: 1;
	width: 920px;
	padding: 0;
}
.facArea ul li .Img:after{
	content: "";
	position: absolute;
	left: 10px;
	top: 10px;
	width: 100%;
	height: 100%;
	border: 1px solid #c2a86c;
	z-index: -1;
}
.facArea ul li .Img img{
	width: 100%;
	display: block;
	height: 500px;
}
.facArea ul li .Txt{
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	z-index: 2;
}
.facArea ul li .Txt .detail{
	position: absolute;
	left: 0;
	bottom: 52px;
	width: 100%;
	box-sizing: border-box;
	padding: 40px 0 95px 0;
	background:url(../images/fac_txt.jpg);
}
.facArea ul li .Txt h3{
	display: none;
}
.facArea ul li .Txt .detail p{
	font-size: 15px;
	color: #656565;
	padding: 0 22px 0 40px;
	line-height: 1.8;
	height: 135px;
}
.facArea ul li .Txt .detail a.more{
	color: #fff;
	display: block;
	padding: 13px 15px;
	text-align: right;
	background: #9c232d;
	position: absolute;
    bottom: 17px;
    right: 22px;
    width: calc(100% - 39px);
    letter-spacing: 1px;
}
.facArea ul li .Txt .detail a.more:hover{
	background:#3a3738;}
.facArea ul li .Txt .detail a.more:after{
	content: "";
	position: absolute;
	left: 0;
	top: -7px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 7px 13px;
	border-color: transparent transparent #680508 transparent;
}
.facArea ul li .Txt .detail a.more:hover:after{
	border-color: transparent transparent #080808 transparent;}
.facArea ul li .Txt .detail a.more i{
	margin-left: 45px;
}
.facArea .slick-dots{
	margin: 0;
	top: 0;
	bottom: auto;
	right: 15px;
	width: auto;
}
.facArea .slick-dots li{
	vertical-align: top;
	padding: 0;
	width:auto;
	height: 190px;
	overflow: hidden;
	margin: 10px 12px 0 12px;
}
.facArea .slick-dots li a{
	font-family: 'cwTeXMing', serif;
	font-size: 17px;
	text-align: left;
	color: rgba(156,35,45,1);
	line-height: 1.1;
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	direction: rtl!important;/*设置文字在FF中竖排*/
	direction:inherit;
	layout-flow:vertical-ideographic;
}
.facArea .slick-dots li.slick-active a{
	color: #bf9c50;
}
/*關於我們*/
.aboutArea{
	background: url(../images/about_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
	padding:168px 0 123px 0;
	overflow:hidden;
	position: relative;
	text-align:center;}
.aboutArea:after{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(158,34,45,0.92);}
.aboutArea .wrap{
	position: relative;
	z-index: 1;
}
.aboutArea h2{
	padding-bottom: 35px;
	position: relative;
}
.aboutArea h2:after{
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 60px;
	height: 1px;
	margin-left: -30px;
	background: rgba(238,236,224,0.5);
}
.aboutArea h2 strong{
	display: inline-block;
	font-size: 26px;
	color: #fff;
	letter-spacing: 8px;
}
.aboutArea h2 strong b{
	color: #dab866;
	font-size: 40px;
	font-weight: normal;
	letter-spacing: 10px;
}
.aboutArea h2 em{
	font-size: 15px;
	color: #fff;
	padding:0;}
.aboutArea h2 em:after{
	display: none;
}

.aboutArea .Txt{
	margin-top: 60px;
	font-size:15px;
	color:#fff;
	line-height:1.8;}

.aboutArea .btn{
	margin-top:80px;
	text-align:center;}

.aboutArea .btn a{
	display:inline-block;
	padding:12px 15px 12px 55px;
	color:#fff;
	background:rgba(255,255,255,0.35);
	border:1px solid #fff;
	letter-spacing: 1px;}
.aboutArea .btn a i{
	margin-left: 35px;
}
.aboutArea .btn a:hover{
	background:rgba(255,255,255,0.5);}
/*圖文外連*/
.linkArea{
	padding:140px 0 133px 0;}
.linkArea p.title{
	text-align: center;
	font-size: 15px;
	color: #858585;
	line-height: 1.8;
	margin: 60px 0 70px 0;
}
.linkArea ul{
	margin:0 -13px;}

.linkArea ul li{
	padding:0 13px;}

.linkArea ul li .Img a{
	position: relative;
	display: block;
	background:rgb(158,34,35);
}

.linkArea ul li .Img img{
	display:block;
	width:100%;
	display:block;
	width:100%;
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;}

.linkArea ul li .item .Img:hover img{
	opacity: 0.15;}

.linkArea ul li .Img a:after{
	content: "";
	position: absolute;
	top: 13px;
	right: 13px;
	bottom: 13px;
	left: 13px;
	background: url(../images/dec_line.png) no-repeat;
	background-size: 100% 100%;
	opacity: 0;
	transition: all 0.6s ease;
}
.linkArea ul li .Img a:hover:after{
	opacity: 1;
}
.linkArea ul li .Img a:before{
	content: "DETAIL";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 114px;
	height: 60px;
	margin-left: -57px;
	margin-top: 0;
	line-height: 60px;
	text-align: center;
	color: #FFF;
	background: url(../images/hover.png) no-repeat;
	opacity: 0;
	transition: all 0.6s ease;}
.linkArea ul li .item .Img a:hover:before{
	opacity: 1;
	margin-top: -30px;
}
.linkArea ul li .Txt{
	padding: 25px 0 0 0;}

.linkArea ul li .Txt h3{
	
	font-size:20px;}

.linkArea ul li .Txt h3 strong{
	font-weight:normal;}

.linkArea ul li .Txt h3 strong a{
	position:relative;
	display:block;
	font-size:18px;
	color:#363032;
	padding-bottom:15px;}

.linkArea ul li .Txt p{
	font-size:13px;
	color:#858585;
	line-height:1.8;
	height:50px;}

/*廣告跑馬燈*/
.adArea{
	padding:40px 0 75px 0;
	border-top: 4px solid #dcb669;
	}

.adArea ul li{
	padding:0;}

.adArea .item{}

.adArea .Img img{
	display:block;
	margin: 0 auto;}
.adArea .Img img:hover{
	opacity:0.9;}
.adArea h4{
	display:none;}

@media (min-width: 2485px){
	.featureArea:after {
    	width: calc(100%/2.4);}
}
@media (max-width:1345px){
	.facArea .slick-dots li{
		height:10px;}	
}
@media (max-width: 1160px){
	.featureArea ul li .Txt a.btn{
		margin-top: 0;
	}
	.featureArea .detailBox{
		padding: 0 0 0 50px;
	}
	.facArea ul li .Img{
		width: 75%;
	}
	.facArea ul li .Img img{
		height: auto;
	}
	.newsArea h2:after{
		display: none;
	}
}
@media (max-width: 1080px){
	.facArea .slick-dots{
		top: auto;
		bottom: -30px;
		width: 100%;
		right: 0;
		text-align: center;
	}
	.facArea ul li .Txt h3 {
	    display: block;
	    margin-bottom: 10px;
	    padding: 0 22px 0 22px;
	}
	.facArea ul li .Txt h3 a{
	    font-size: 16px;
	    color: #9c232d;
	    font-weight: normal;
	}
	.facArea ul li .Txt .detail p{
		padding: 0 22px;
	}
	.facArea ul li .Txt .detail{
		bottom: 32px;
	}
	.facArea ul li{
		padding: 0;
	}
}
@media (max-width: 1024px){
	.featureArea .feature_bg{
		display: none;
	}
	.featureArea .detailBox{
		display: none;
	}
	.featureArea ul li .Txt p.price{
		display: block;
		margin: 0;
		height: auto;
		margin-top: 10px;
		color: #dab86c;
    	font-size: 18px;
	}
	.featureArea ul li .Txt p{
		margin: 10px 0 0 0;
	}
	.featureArea ul li .Txt span {
    	font-size: 19px;}
    .featureArea .slick-dots li button:before{
    	background: #eed3ba;
    }
}
@media (max-width: 768px){

	.newsArea{
		padding: 65px 0;
	}
	.newsArea ul{
		margin: 40px -14px 0 -14px;
	}
	.facArea ul li .Img{
		width: 100%;
	}
	.facArea ul li .Txt{
		position: relative;
		height: auto;
		margin-top: -80px;
    	padding: 10px;
		width:100%;
	}
	.facArea ul li .Img:after{
		display:none;}
	.facArea ul li .Txt .detail a.more{
		width:calc(100% - 60px);
		right:30px;}
	.facArea ul li .Txt .detail{
		position: static;
		padding: 40px 0 65px 0;
	}
	.bannerArea .Txt {
	    top: 20%;
	    left: 0;
	    text-align: center;
	    width: 100%;}
}

@media (max-width: 640px){
	.featureArea ul li .Img{
		padding: 0;
	}
	.featureArea .leftBox{
		padding: 10px 0;
	}
	.featureArea ul li .Txt {
	    padding: 20px 0 0 0;
	    text-align: center;
	}
	.linkArea{
		padding: 80px 0 130px 0;
	}
	.featureArea ul li .Txt a.btn{
		margin-bottom:10px;}
}

@media (max-width: 480px){
	.aboutArea h2 strong{
		padding-left: 0;
	}
	.bannerArea .Txt p.chinese{
		display: block;
		text-align: center;
		padding: 0;
		font-size: 1em;
	}
	.bannerArea .Txt p.chinese strong{
		margin-right:0;}
	.bannerArea .Txt p.chinese:after{
		display: none;
	}
	.bannerArea .Txt p.english{
		display: block;
		padding: 10px 0 0 0;
	}
	.bannerArea .Txt p.english strong{
		font-size: 1.7em;}
	.newsArea ul{
		margin: 40px 0 0 0;
	}
	.newsArea ul li{
		padding: 0;
	}
	.aboutArea h2 strong{
		font-size: 20px;
	}
	.aboutArea h2 strong b{
		font-size: 30px;
	}
}
@media (max-width: 320px){
	h2 em{
		font-size: 30px;
	}
}

