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

.contentBox .leftBox{
	padding:0 50px 0 0;}

.contentBox .rightBox{
	padding:0;}

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

ul.roomList{
	position: relative;
	z-index: 2;
	margin:38px 0 0 0;
	box-shadow: 3px 3px 12px rgba(0,0,0,0.1),-3px -3px 12px rgba(0,0,0,0.1);}

ul.roomList li{
	position: relative;
	padding:0;}
ul.roomList li .item{
	background:#FFF;
}
ul.roomList li .ImgBox{
	padding: 0;
}
ul.roomList li .Img{
	width: 50%;
    position: absolute;
    bottom: 0;
    top: 0;
    overflow: hidden;}
ul.roomList li:nth-child(2n+1) .ImgBox{
	float: right;
}
ul.roomList li .Img a{
	display:block;}

ul.roomList li .Img img{
	display: block;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;}

ul.roomList li .Txt{
	float: right;
	padding: 55px 65px 48px 65px;}
ul.roomList li:nth-child(2n+1) .Txt{
	float: left;
}
ul.roomList li .Txt h3{
	font-size:20px;}

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

ul.roomList li .Txt h3 strong a{
	position:relative;
	display:block;
	font-size:26px;
	color:#222;
	font-family: "新細明體";
	padding-bottom:10px;}

ul.roomList li .Txt h3 strong a:hover{
	color:#da2441;}
ul.roomList li .Txt h3 em{
	font-family: 'Raleway', sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #9e8261;
	text-transform: uppercase;
	letter-spacing: 2px;
}
ul.roomList li .Txt p{
	margin-top:35px;
	font-size:15px;
	color:#666;
	line-height:1.8;
	height:90px;}
ul.roomList li .Txt .btn{
	text-align: left;
	margin-top: 25px;
}
ul.roomList li .Txt .btn a{
	background: #444444;
	margin-right: 5px;
}
ul.roomList li .Txt .btn a.booking{
	background: #688c5d;
}
ul.roomList li .Txt .btn a:after{
	display: none;
}
ul.roomList li .Txt .btn a:hover,
ul.roomList li .Txt .btn a.booking:hover{
	background: #e8608e;
}	
/******內頁******/
.contentBox{}

.contentBox .leftBox .Img{}

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

.contentBox .leftBox h3{
	margin:10px 0 20px 0;
	border:none;}

.contentBox .rightBox .link{
	margin-bottom:40px;}

.contentBox .rightBox .link a{
	display:inline-block;
	padding:10px 15px;
	
	font-size:16px;
	color:#FFF;
	box-shadow:2px 2px 2px #CCC;
	border-radius:3px;
	text-align:center;
	
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	transition:none;}

@media (max-width: 1023px){
	.contentBox .leftBox{
		padding:0 0 30px 0;}
	ul.roomList{
		box-shadow: none;
	}
	ul.roomList li{
		display: inline-block;
		width: 50%;
		float: left;
		box-sizing: border-box;
		padding: 0 5px;
		background: none;
		
	}
	ul.roomList li .item{
		box-shadow: 3px 3px 12px rgba(0,0,0,0.1);
	}
	ul.roomList li .ImgBox,
	ul.roomList li:nth-child(2n+1) .ImgBox{
		float: none;
	}
	ul.roomList li .Img{
		width: 100%;
		position: static;
	}
	ul.roomList li .Img img{
		width: 100%;
		height: auto;
		object-fit: none;
	}
	ul.roomList li .Txt{
		float: none;
		padding: 40px 20px;
		text-align: center;
	}
	ul.roomList li .Txt .btn{
		text-align: center;
	}
	ul.roomList li .Txt .btn a{
		padding: 13px 25px;
	}
}

/*640*/
@media (max-width: 640px){
	ul.roomList li{
		width: 100%;
		padding: 0 0 20px 0;
	}
}

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