.hide{
	display: none;
}
*{
	padding: 0;
	margin: 0;
}
.timeline{
	width:750px;
	margin: auto;
	height: 80px;
	background: url(../images/timeline-bg.jpg) 0 0 repeat-x;
	margin-top: 400px;
}

.timeline .layout{
	position: relative;
	height: 100%
}

.timeline .event-wrap{
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: relative
}

.timeline .btn-next,.timeline .btn-pre{
	position: absolute;
	top: -15px;
	width: 30px;
	height: 30px;
	z-index: 10;
	display: none;
}

.timeline .btn-next:hover,.timeline .btn-pre:hover{
	top: -17px;
	width: 35px;
	height: 35px
}

.timeline .btn-pre{
	left: 0;
	background: url(../images/ar_prev.png) no-repeat;
	background-size: cover;
}

.timeline .btn-pre:hover{
	background: url(../images/ar_prevon.png) no-repeat;
	background-size: cover;
}

.timeline .btn-next{
	right: 0;
	background: url(../images/ar_next.png) no-repeat;
	background-size: cover;
}

.timeline .btn-next:hover{
	background: url(../images/ar_nexton.png) no-repeat;
	background-size: cover;
}

.timeline .event-list{
	width: 9600px;
	right: 0;
	position: absolute;
	overflow: hidden;
	height: 60px
}

.timeline .event{
	width: 150px;
	float: left;
	text-align: center;
	position: relative
}
.timeline .event .dot{
	width: 19px;
	height: 10px;
	margin-bottom: 15px;
	display: inline-block;
}

.timeline .event .date{
	font-size: 24px;
	color: #666
}
.timeline .event.cur .dot{
	background: url(../images/arrow_timeline.jpg) no-repeat center top;
}

.timeline .event-con
{
	position: absolute;
	bottom: 120px;
	left: 0 !important;
	width: 100%;
	text-align: center;
	font-size: 24px;
	color: #222;
}
.timeline .event-con .img{
	font-size: 0;
	margin: 0 20px 40px;
}
.timeline .event-con .img img{
	width: 230px;
	margin-right: 10px;
}
.timeline .event-con .img img:last-child{
	margin-right: 0;
}