.picture-box {
	background: #fff;
	position:relative
}
.picture-box .pictures {
	display: none;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	position:relative;
	z-index:1
}
.picture-box .pictures li{
	position:relative;
	z-index:1;
	width:100%;
	height:672px;
}

.picture-box .tit{
	width:50%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	z-index:99999999;

	background: rgba(0,0,0,.2) none repeat scroll 0 0!important;
	padding:100px 60px 0 80px;
	overflow:hidden
}
.picture-box .tit h2{
	width:100%;
	color:#FFF;
	font-size:26px;
	line-height:80px

}
.picture-box .tit p{
	line-height:33px; font-size:16px; color:#FFF;

}
.tit::after{
	width:100%;
	
}

.picture-box .pictures ul, .picture-box .pictures ol {
	display: inline-block;
*display:inline;
*zoom:1;
	margin: 0;
	padding: 1em 0
}
.picture-box .pictures ul li, .picture-box .pictures ol li {
	display: inline-block;
*display:inline;
*zoom:1;
	width: 60px;
	height: 60px;
	margin: 10px 5px;
	cursor: pointer;
	border: 1px solid #333
}
.picture-box .pictures ul li.active, .picture-box .pictures ol li.active {
	border-color: #fff
}
.picture-box .viewport {
	width:100%;
	height: 672px;
	background-position: center center;
	background-repeat: no-repeat;
	position: relative;
	margin: auto;
	
}
.picture-box .viewport .loading {
	display: none;
	width:100px;
	height:100px;
	background-image: url(picture-box-loading.gif);
	position: absolute;
	top: 1em;
	right: 1em
}
.picture-box .toolbar {
	text-align: center;
	position:absolute;
	right:-5px;
	bottom:-5px;
}
.picture-box .toolbar a.prev, .picture-box .toolbar a.next, .picture-box .toolbar a.zoom {
	display: inline-block;
*display:inline;
*zoom:1;
	width:50px;
	height:50px;
	background: transparent url(picture-box-buttons.png) no-repeat;
	margin:0 !important;
	border: 0;
	overflow: hidden
}
.picture-box .toolbar a.prev {
	background-position: 0 0
}
.picture-box .toolbar a {
	padding:0;
	margin:0
}
.picture-box .toolbar a.next {
	background-position: -50px 0;
	margin-left:-5px !important
}
.picture-box .toolbar a.zoom {
	background-position: -100px 0
}
.picture-box.zoomin {
	position: absolute;
	background-color: #333;
	z-index: 9999
}
.picture-box.zoomin .pictures {
	display: block
}
.picture-box.zoomin .viewport {
	margin-top: 3em;
	width: 800px;
	height: 600px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 0 10px #000;
	-moz-box-shadow: 0 0 10px #000;
	-ms-box-shadow: 0 0 10px #000;
	-o-box-shadow: 0 0 10px #000;
	box-shadow: 0 0 10px #000
}
.picture-box.zoomin .toolbar a.prev {
	background-position: 0 -50px
}
.picture-box.zoomin .toolbar a.next {
	background-position: -50px -50px
}
.picture-box.zoomin .toolbar a.zoom {
	background-position: -100px -50px
}
