@charset "utf-8";
/* CSS Document */

.contentBox .leftBox{
	padding:0 25px 0 0;
	border-right: 1px solid #ececec;
float:left;}

.contentBox .rightBox{
	float: right;
	padding:0 0 0 25px;}

.classNote{
	padding-bottom:10px;
	
	font-size:15px;
	color:#222;
	text-align:center;
	line-height:1.8;}

ul.roomList{
	margin:0 -15px;}


ul.roomList li{
	position: relative;
	
	float: left;
}
ul.roomList li .item {
	position:relative;
	overflow: hidden;
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.20);
}

ul.roomList li .item:before{
	content: "";
	z-index: 15;
	display: block;
	position: absolute;
	top: -80px;
	left: -80px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 80px 80px 0 0;
	border-color: #b59e74 transparent transparent transparent;
	transition: 0.9s;
}
ul.roomList li:hover .item:before{
	top: 0;
	left: 0;
	transition: 0.9s;
}
ul.roomList li .item:after{
	z-index: 20;
	color: #fff;
	content: "\f06e";
	font-family: fontAwesome;
	text-align: center;
	display: block;
	position: absolute;
	top: -80px;
	left: -80px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	transition: 0.9s;
}
ul.roomList li:hover .item:after{
	transition: 0.9s;
	top: 0;
	left: 0;
}
ul.roomList li .Txt{
background:#fff;
	padding: 30px 20px;
}
ul.roomList li .Txt h3{
	font-size: 21px;
	color: #000;
	font-weight: normal;
	padding-bottom: 10px;
	border-bottom: 1px solid #e6e6e6;
	margin-bottom: 15px;
}
ul.roomList li .Txt h3 a{
	color: #000;
}
ul.roomList li:hover .Txt h3 a{
	color:#38701a;
}
ul.roomList li .Txt h3 a strong{
	font-size: 14px;
	color:#38701a;
	margin-left: 10px;
	display: inline-block;
	font-weight: normal;
}
ul.roomList li .Txt p{
	width: 100%;
	color: #555555;
	line-height: 20px;
	height: 60px;
	overflow: hidden;
	font-size: 13px;
	margin-bottom: 15px;
}
ul.roomList li .Txt div.price{
	font-size: 13px;
	color: #888;
	font-family: 'Roboto', sans-serif;
padding:0;
}
ul.roomList li .Txt div.price b{
	font-weight: normal;
	color:#544c4a;
	font-size: 18px;
	padding:0 5px;
	display: inline-block;
	
}
ul.roomList li .Img {
	overflow: hidden;
	position:relative;
	z-index: 1;
}
ul.roomList li .Img a strong{
	transition:0.9s;
	position: absolute;
	color: #fff;
	text-align: center;
	top: 40px;
	opacity: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(38,35,36,0.80);
	z-index: 10;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";	
	font-size: 27px;
	font-weight: normal;
}
ul.roomList li .Img a strong span{
	display: block;
	position:absolute;
	top: 50%;
	left: 50%;
	transform:translate(-50%,-50%);
}
ul.roomList li:hover .Img a strong{
	transition:0.9s;
	top: 0px;
	opacity: 1;
}
ul.roomList li .Img img{
	z-index: 5;
	width: 100%;
	display: block;
}
		
/******內頁******/
.contentBox{}

.contentBox .Img{}

.contentBox .Img img{
	width:100%;}

.TitleEn{
	font-family: 'Roboto', sans-serif;
	font-size: 20px;
	color: #b59e74;
	margin: 0 0 10px 0;
}
div.price{
	font-size: 13px;
	color: #888;
	font-family: 'Roboto', sans-serif;
	padding-bottom: 30px;
}
div.price b{
	font-weight: normal;
	color:#000;
	font-size: 18px;
	padding:0 5px;
	display: inline-block;
	
}
.contentBox h4{
	color: #b59e74;
	display: inline-block;
	font-size: 15px;
	padding:5px 30px 10px 10px;
	border-bottom: 1px solid #b59e74;
	margin-bottom: 10px;
	position:relative;
}
.contentBox h4:after{
	content: "";
	display: block;
	width: 1px;
	height: 15px;
	background:#b59e74;
	transform: rotate(-25deg);
	position:absolute;
	right: 3px;
	bottom: -1px;
}

@media (max-width: 1023px){
.contentBox .leftBox{
	padding:0;
	border-right: none;
float:none;}

.contentBox .rightBox{
	float: none;
	padding:0;}
	
.TitleEn{
	margin: 0 10px 0 0;
	display: inline-block;
}
div.price{
	display: inline-block;
}
	
}

/*640*/
@media (max-width: 640px){}

/*480*/
@media (max-width: 480px){}
/*480 end*/