@charset "utf-8";

$focus-width:680px;
$focus-height:330px;
$mask-height:64px;
.focus_wrap{
	position:relative;
	width:$focus-width;
	height:$focus-height;
	font-family:Microsoft YaHei;


	.focusBtn{
		display:block;
		position: absolute;
		height:48px;
		cursor:pointer;
		z-index: 2;
		top:130px;
		width: 46px;
	}
	#focusBtnL{
		left:0;
		background: url(left-none.gif) no-repeat;
	}

	#focusBtnR{
		right:0;
		background: url(right-none.gif) no-repeat;
	}
}

#focus_box{
	position:absolute;
	width:$focus-width;
	height:$focus-height;
	overflow:hidden;
	float:left;
	z-index: 1;

	#contentList li{
		float:left;
		position:relative;
		IMG{
			width:$focus-width;
			height:$focus-height;
		}
	}


	.mask{
		FILTER:alpha(opacity=60);
		opacity:0.6;
		width:100%;
		height:$mask-height;
		background-color:#000000;
		position:absolute;
		bottom:0;
		left:0;
		display:block;
	}
	.comt{
		width:60%;
		color:#ffffff;
		position:absolute;
		left:0;
		bottom:0;
		height:$mask-height;
		text-indent:10px;
		text-align:left;
		h2{
			margin-top: 10px;
		}
		p{
			font-size:13px;
			line-height: 30px;
		}
	}
}

#previewList{
	position:absolute;
	bottom:13px;
	right:12px;
	z-index: 2;
	li{
		list-style:none;
		float:left;
		width:20px;
		height:18px;
		FILTER:alpha(opacity=80);
		opacity:0.8;
		border:1px solid #FFFFFF;
		background-color:#FFFFFF;
		color:#D00000;
		text-align:center;
		cursor:pointer;
		margin-right:2px;
		padding-top:0px;
		overflow:hidden;
		&:hover,&.active{
			border:1px solid #FFFFFF;
			background-color:#FF0000;
			color:#FFFFFF;
			width:20px;
			height:18px;
			font-weight:bold;
			font-size:13px;
		}
	}
}