@charset "utf-8";
.yearList{
	margin:20px auto 0px auto;
	min-height:600px;
	font-size:16px;
	padding: 0;
}

.yearList li{
	list-style:none;
	text-align:center;
	position:relative;
	margin-bottom: 2px;
	text-align:  left;
}
.yearList li.year{display:none;clear: both;}
.yearList li .year-inner{width: 53%;position:  relative;}
.yearList li .year-inner{content:'';clear:both;display:block}
.yearList li .year-inner .word-zone:hover ul{background: #005bac;color:  #fff;}
.yearList li .year-inner .word-zone:hover ul li{border-color:#fff;}
.yearList li .year-inner .word-zone ul{padding: 20px;transition: all 1s;}
.yearList li .year-inner .word-zone ul li{margin-bottom: 5px;border-bottom: 1px dotted #949494;padding: 5px 10px;}
.yearList li:nth-child(odd) .year-inner .date-zone{display: inline-block;width: 70px;float: right;text-align:  center;position:  absolute;right: 0;}
.yearList li:nth-child(odd) .year-inner .word-zone{float: right;position:  relative;margin-right: 120px;transition:  all 1s;}
.yearList li:nth-child(odd) .year-inner .word-zone:after{content:'';background: #b6b6b6;width:1px;height: calc(100% - 65px);right: -86px;top: 70px;position:absolute;}
.yearList li:nth-child(even) .year-inner .date-zone{display: inline-block;width: 70px;position:  absolute;left: -3px;}
.yearList li:nth-child(even) .year-inner{float: right;}
.yearList li:nth-child(even) .year-inner .word-zone{margin-left: 120px;position:  relative;transition:  all 1s;}
.yearList li:nth-child(even) .year-inner .word-zone:after{content:'';background: #b6b6b6;width:1px;height: calc(100% - 65px);left: -88px;top: 70px;position:absolute;}
.yearList li strong{
	    font-size: 21px;
	    display:block;
	    color: #333;
	    display: inline-block;
	    padding: 5px 7px;
	    -webkit-transition: all 0.2s ease-in-out;
	    -moz-transition: all 0.2s ease-in-out;
	    -o-transition: all 0.2s ease-in-out;
	    transition: all 0.2s ease-in-out;
}

.yearList li .yearPoint{
	text-align:center;
	background:#b6b6b6;
	width:8px;
	height:8px;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	margin:5px auto 10px auto;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	text-indent:-9999px;
}

.yearList li .vline{
	width:1px;
	background:#b6b6b6;
	/* min-height:80px; */
	margin:5px auto 5px auto;
}

.yearList li .vline_2{ min-height:100px;}
.yearList li .vline_3{/* min-height:25px; */}
.yearList li .vline.long{height:230px;}
.yearList li .vline.mid{height:60px;}
.yearList li .vline.mid2{height:100px;}
.yearList li .vline.mid3{height:140px;}

.yearList li .float{
	position:absolute;
	background-color:#FFF;
	top:0;
	padding:20px;
	width:38%;
	max-width:460px;
	text-align:left;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
    -webkit-transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
    -o-transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
    transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.yearList li .year-inner .word-zone .arrowRight, .yearList li .year-inner .word-zone .arrowRight2{
	width:10px;
	height:56px;
	position:absolute;
	top:-10px;
	left:-10px;
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.yearList li .year-inner .word-zone .arrowRight{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
	background:url(leftArrow.gif) no-repeat left top;
}

.yearList li .year-inner .word-zone .arrowRight2{
	filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity: 0;
	background:url(leftArrow.gif) no-repeat -400px -15px;
}

.yearList li .year-inner .word-zone .arrowLeft, .yearList li .year-inner .word-zone .arrowLeft2{
	width:10px;
	height:56px;
	position:absolute;
	top:120px;
	right:-10px;
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.yearList li .year-inner .word-zone .arrowLeft{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
	background:url(rightArrow.gif) no-repeat right top;
}

.yearList li .year-inner .word-zone .arrowLeft2{
	filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity: 0;
	background:url(rightArrow.gif) no-repeat -389px -15px;
}

.yearList li .float.left{right:0%;}
.yearList li .float.right{left:0%;}

.yearList li .float ul{margin-bottom:-6px;padding: 0;}

.yearList li .float ul li{
	margin:0;
	min-height:20px;
	text-align:left;
	line-height:1.5em;
	/*word-break:break-all; ±j¨î­^¤å³æµüÂ_¦æ*/
	
	/*¦Û°Ê´«¦æ*/
	word-wrap: break-word; 
¡@¡@word-break: normal; 
}

.yearList li .float img{
	max-width: 100%;
	display:block;
	margin:0px -15px -16px -15px;
	border-radius: 5px;
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
}
.float span{ display:block; font-weight:bold; color:#333; margin-bottom:10px;    border-bottom: 1px dashed #dcdcdc;}
.yearList li:hover h4{
	font-size:18px;
	background: #b6b6b6;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.yearList li:hover strong{
	color: #005bac;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.yearList li:hover .float{
	background:#dedede;
	top:20px;
	-moz-transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
    -webkit-transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
    -o-transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
    transition:top 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.yearList li:hover .yearPoint{
	background:#2c8de2;
	width:12px;
	height:12px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

.yearList li .year-inner .word-zone:hover .arrowRight, .yearList li .year-inner .word-zone:hover .arrowLeft{
	top:20px;
	filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity: 0;
	-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

.yearList li .year-inner .word-zone:hover .arrowRight2, .yearList li .year-inner .word-zone:hover .arrowLeft2{
	top:20px;
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
	-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
	/*-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;*/
}

.Right_pic{margin: 0 auto;width: 100%;}
.Right_pic img{width:100%;margin-bottom:20px;}
.Left_pic{ float:left; margin:0px 0px 20px 20px; width:40%;}
.pic{ padding:0 0 20px 20px;}

@media screen and (max-width:996px) {
	.yearList li:nth-child(even) .year-inner{width: 55.8%}

}


@media screen and (max-width:768px) {
	.yearList li:nth-child(odd) .year-inner,.yearList li:nth-child(even) .year-inner{width: 100%}
	.yearList li:nth-child(odd) .year-inner .date-zone,.yearList li:nth-child(even) .year-inner .date-zone{width: 100%;position: inherit;float: inherit;text-align: center;}
	.yearList li:nth-child(odd) .year-inner .word-zone,.yearList li:nth-child(even) .year-inner .word-zone{position: inherit;float: inherit;margin-right: 0;margin-left:0;width: 100%;}
	.yearList li:nth-child(odd) .year-inner .word-zone:after{width: 1px;height: 30px;right: 47.3vw;top: 0;}
	.yearList li:nth-child(even) .year-inner .word-zone:after{width: 1px;height: 30px;left: 47.3vw;top: 0;}
	.yearList li .year-inner .word-zone ul li{text-align: center;}
}

@media screen and (max-width:640px) {

.yearList li strong{
	width:100%;
	display:block;
}

.yearList li .float ul li{text-align:center;}
.yearList li .float{ position:inherit; width:90%; margin-left:5%; }
.yearList li .yearPoint{
	text-align:left;
	background:#b6b6b6;
	width:8px;
	height:8px;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	margin:5px auto 10px auto;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	text-indent:-9999px;
}

.yearList li .vline{
	width:1px;
	background:#b6b6b6;
	min-height:3px;
	margin:auto;
}
.Left_pic,.Right_pic {  float: none; width: 100%;}
.yearList li .year-inner .word-zone .arrowLeft2,.yearList li .year-inner .word-zone .arrowRight2  {   display: none;}

.yearList li:nth-child(odd) .year-inner .word-zone:after{right: 45.4vw;}
.yearList li:nth-child(even) .year-inner .word-zone:after{left:44.5vw;}


}

@media screen and (max-width:480px) {
	.yearList li:nth-child(even) .year-inner .word-zone:after,.yearList li:nth-child(odd) .year-inner .word-zone:after{display: none;}
}