.roomList{
	overflow:hidden;
}
.roomList >div{
	float:left;
	width:33%;
}
.roomList .roombox{
	margin: 0 20px 40px;
	border: 1px solid #ebebeb;
	position:relative; 
}
.roomList .roombox .photo{
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
}
.roomList .roombox .photo a{
	display:block;
}
.roomList .roombox .photo a img{
	width:100%;
}
.roomList .roombox .info{
	position:absolute;
	bottom:0;
	width:100%;
	left:0;
}
.roomList .roombox .info h3{
    text-align: center;
    position: relative;
    padding: 20px;
	overflow: hidden;
}
.roomList .roombox .info h3 a{
	color:#444141;
	position:relative;
	z-index:2;
	font-size: 17px;
	display:block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.roomList .roombox .info h3 a img{
	margin-right: 7px;
    vertical-align: bottom;
}
#p-intro{
	overflow:hidden;
	margin: 0 50px;
}
#p-intro .imgshow{
	float:left;
	width:48%;
}
#p-intro .imgshow li{
	outline:none;
}
#p-intro .imgshow li p{
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:contain;
}
#p-intro .imgshow li img{
	width:100%;
}
#p-intro .p-s-detail{
	float:right;
	width:48%;
}
#p-intro .p-s-detail h3{
	font-size: 24px;
    color: #242424;
	line-height: 150%;
	margin-bottom: 20px;
}
#p-intro .p-s-detail h3 img{
	margin-right: 10px;
    vertical-align: sub;
}
#p-intro .p-s-detail h4{
	color: #2e2e2e;
    font-size: 17px;
    line-height: 150%;
}
#p-intro .p-s-detail p{
	margin: 10px 0 30px;
    color: #595959;
    font-size: 15px;
    line-height: 150%;
}
#p-detail{
	margin: 50px 50px 0;
}
#p-detail .tabs{
	position:relative;
}
#p-detail .tabs:after{
	content:'';
	background:#ececec;
	display:block;
	width:100%;
	height:1px;
	position:absolute;
	top:49%;
	left:0;
	z-index: -1;
}
#p-detail .tabs li{
	display:inline-block;
	background:#fff;
}
#p-detail .tabs li span{
	color: #212121;
    font-size: 17px;
    font-weight: bold;
    display: inline-block;
	background-image:url(/images/02/pro/p-detail-bg.png);
	background-repeat:no-repeat;
	background-position:50% 50%;
	width:152px;
    height: 42px;
    text-align: center;
    line-height: 42px;
    padding-right: 10px;
}
#other{
    box-shadow: 0 0 15px #f2f2f2;
    margin: 30px 15px;
    padding: 30px;	
}
#other h2{
    text-align: center;
    border-bottom: 1px solid #ececec;
    padding: 40px 0;
    margin: 0 0 50px;
    font-size: 26px;
    font-weight: normal;
}
#other h2 img{
	vertical-align: sub;
    margin-right: 5px;
    display: inline-block;
}
@media screen and (min-width: 980px) {
	.roomList .roombox .info h3:after{
		display: block;
		position: absolute;
		top: 0;
		left: -50%;
		background: #fff;
		width: 200%;
		height: 400%;
		content: '';
		border-radius: 90%;
	}
	.roomList .roombox:hover .info h3 a{
		color:#fff;
	}
	.roomList .roombox:hover .info h3:after{
		background: #f4a7b9;
	}
}
@media screen and (max-width: 1280px) {
	.roomList .roombox{
		margin: 0 10px 20px;
	}
	#p-intro{
	    margin: 0;	
	}
	#p-detail{
		margin: 40px 0 0;	
	}
}
@media screen and (max-width: 980px) {
	.roomList >div{
		width:50%;
	}
	.roomList .roombox .info h3{
	    background: #fff;	
		padding: 10px;
	}
}
@media screen and (max-width: 768px) {
	#p-intro .imgshow,
	#p-intro .p-s-detail{
		width:100%;
		margin-bottom:20px;
	}
	#p-intro .p-s-detail h3{
	    font-size: 20px;	
	}
}
@media screen and (max-width: 640px) {
	.roomList .roombox .info h3 a{
		font-size: 14px;	
	}
	.roomList .roombox .info h3 a img{
		vertical-align: inherit;
		height: 16px;		
	}
	.roomList .roombox{
		margin: 0 5px 10px;
	}
}
@media screen and (max-width: 480px) {
	.roomList .roombox .info h3{
	    padding: 5px;	
	}
	#other{
		padding: 20px 0;	
		box-shadow: none;
		margin: 0;	
	}
}
