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

.play { width: 360px; height: 400px; margin: 0px auto 0; background-color: #fff;border: 1px solid #ccc;}

.big_pic { width: 360px; height: 320px; overflow: hidden; position: relative;text-align:center }

.big_pic li { width: 360px; height: 320px; overflow: hidden; position: absolute; top: 0; left: 0; z-index: 0; }

.mark_left { width: 180px; height: 320px; position:absolute; left: 0; top: 0;  filter: alpha(opacity:10); opacity: 0.1; z-index:3000; }

.mark_right { width: 180px; height: 320px; position: absolute; left: 180px; top: 0;  filter: alpha(opacity:10); opacity: 0.1; z-index: 3000; }

.big_pic .prev { width: 60px; height: 60px; background:url(../images/btn.png) no-repeat; position: absolute; top: 130px; left: 10px; z-index: 3001; filter:alpha(opacity:0); opacity:0; cursor:pointer; }

.big_pic .next { width: 60px; height:60px; background:url(../images/btn2.png) no-repeat 0;position: absolute; top: 130px; right: 10px; z-index: 3001; filter:alpha(opacity:0); opacity:0; cursor: pointer; }

.big_pic .text { position:absolute; left: 10px; top:302px; z-index:3000; color: #ccc; }
.big_pic .length { position:absolute; right: 10px; bottom: 4px; z-index:3000; color:#ccc; }
.small_pic {width:340px; height:80px; position:relative; top:7px; left:10px; overflow: hidden; }
.small_pic ul { height:80px; position:absolute; top: 0; left: 0;}
.small_pic li { width: 80px; height: 75px; float: left;padding-right: 7px; background: url(../images/loading.gif) no-repeat center center; cursor: pointer; filter: alpha(opacity:30); opacity:0.3; }
.small_pic img { width: 80px;}


.big_pic li img {width:320px; height:320px;}