@charset "utf-8";
.clear{clear:both;display:block;height:0;overflow:hidden;}


/* history */
#history{width:1180px;height:525px;position:relative;margin:50px auto 50px auto;_background-image:url(about:blank);/*用浏览器空白页面作为背景*/_background-attachment:fixed; /* prevent screen flash in IE6 确保滚动条滚动时，元素不闪动*/    }
#historybox{width:100%;height:500px;  overflow: hidden; }
#circle{
	width:83px;height:83px;position:absolute;top:0;left:390px;border:6px solid rgba(0,0,0,0.15);border-radius:95px;text-indent:0;text-align:center;
	-webkit-transition:all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition:all 0.3s linear;
	transition:all 0.3s linear;
}
#circle .cmsk{height:83px;position:absolute;width:83px;top:0;left:0;}
#circle:hover{
	transform:rotate(360deg);
	-ms-transform:rotate(360deg);
	-moz-transform:rotate(360deg);
	-webkit-transform:rotate(360deg);
	-o-transform:rotate(360deg);
	border-color:rgba(0,0,0,0);
}
.clock{display:block;}
#circle:hover {border-color:rgba(255,255,255,0.6);background-color:#a5845f;}
#circle:hover .clock{display:block;}
#circle:hover .circlecontent{display:none;}
#circle span{font-size:18px;color:#b0b0b0;}
#circle .clock{
	background:url(clock.png) no-repeat 0 0;width:83px;height:83px;position:absolute;top:0;left:0;display:none;
	-webkit-transition:all 0.5s linear;
	-moz-transition:all 0.5s linear;
	-o-transition:all 0.5s linear;
	transition:all 0.5s linear;
	border-radius:0;
}
#circle:hover .clock{border-radius:83px;}
.timeyear{color:#b0b0b0;font-size:18px;line-height:20px;}
.timeblock{height:28px;margin-top:22px;margin-left:5px;}
.timeblock span{display:block;height:24px;width:18px;background:url(date.png) no-repeat 0 0;float:left;}
.timeblock .numf{background-position:0px -48px;}
.timeblock .nums{background-position:0px 0px;}
.timeblock .numt{background-position:0px -24px;}
.timeblock .numfo{background-position:0px -72px;}
#content{height:355px;width:100%;overflow:hidden;padding-top:30px;background: url('../img/vertical.png') no-repeat 50% 22px; }
.list{overflow:hidden;position:relative;}
.list li{vertical-align:bottom;overflow:hidden;position:relative;}
.liwrap{height:182px;margin:36px 0;}
.lileft{position:absolute;top:0;left:0px;height:182px;width:calc(50% - 25px);text-align:right;}

.lileft .hisct{ float:right; text-align:left; padding-right:36px; padding-left:10px}
.lileft .histt{ float:left;overflow: hidden;}


.lileft .hisct:after{       width: 0;
    height: 0;
    border-left: 8px solid #fff;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    margin-right: -4px;
    position: absolute;
    z-index: 1;
    left: 100%;
    top: 50%;
    content: '';
}


.liright .hisct{ float:left;text-align:left; padding-left:36px; padding-right:10px}
.liright .histt{ float:right;overflow: hidden;}


.liright .hisct:after{       width: 0;
    height: 0;
    border-right: 8px solid #fff;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    margin-left: -4px;
    position: absolute;
    z-index: 1;
    right: 100%;
    top: 50%;
    content: '';
}

.liright{position:absolute;top:0;right:0px;width:calc(50% - 25px);}
.histt{width:calc(50%); display:inline-block; }
.histt img{ width:315px; height:182PX; }

.hisct{    font-size: 14px;
    color: #383838;
    background: #fff;
    height: 182px;
    width: 50%;
    display: inline-block;
    line-height: 1.5rem;
    padding-top: 1.5rem;
	overflow:hidden;
} 
.date{ margin-top:91px;}
.md{font-size:0;color:#AEAEAE; display:none;}
.year{font-size:18px;color:#686868;}
.point{height:30px;width:30px;position:absolute;top:50%;left:50%;overflow:hidden;margin:-40px 0 0 -15px;}
.point b{height:7px;width:7px;background:#a5845f; border-radius:52px;margin:11px 0 0 11px;-webkit-transition:all 0.1s linear;
	-moz-transition:all 0.1s linear;
	-o-transition:all 0.1s linear;
	transition:all 0.1s linear;
	position:absolute;
	top:0;left:0;
}

.rowone .lileft .data{ display:none}
.rowone .liright .date{ display:none}

.rowtwo .lileft .date{ display:none}
.rowtwo .liright .data{ display:none}


.thiscur .lileft .histt{ box-shadow: 0 4px 6px #dcdcdc; height:182px;}

.thiscur .lileft .hisct{ box-shadow: 0 4px 6px #dcdcdc;}

.thiscur .liright .histt{ box-shadow: 0 4px 6px #dcdcdc; height:182px;}

.thiscur .liright .hisct{ box-shadow: 0 4px 6px #dcdcdc; }


.thiscur .point {border:1px solid #a5845f;height:30px;width:30px;position:absolute;top:50%;left:50%;border-radius:52px;margin:-40px 0 0 -15px;-webkit-transition:all 0.1s linear;
	-moz-transition:all 0.1s linear;
	-o-transition:all 0.1s linear;
	transition:all 0.1s linear;
	background:none;}
.thiscur .point b{height:7px;width:7px;background:#a5845f; border-radius:52px;margin:11px 0 0 11px;-webkit-transition:all 0.1s linear;
	-moz-transition:all 0.1s linear;
	-o-transition:all 0.1s linear;
	transition:all 0.1s linear;
	position:absolute;
	top:0;left:0;}
.thiscur .histt a{color:#a5845f;}
.histt a{
	font-size:24px;color:#747474;
	-webkit-transition:all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition:all 0.3s linear;
	transition:all 0.3s linear;
}
#arrow{ position: absolute;
    height: 100%;
    left: 50%;
    z-index: 2500;margin-left: -11px;}
*html #arrow{position:absolute;top:expression(eval(document.documentElement.scrollTop));margin-top:350px;
    height: 100%;
    text-align: center;
    width: 100%; z-index:2500}

#arrow ul li{
	display:block;height:22px;width:22px;background:url(../img/icons.png) no-repeat 0 0;cursor:pointer;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	-o-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}
#arrow ul li:active{}
#arrow ul .arrow_active{
	-webkit-transition:all 0.1s ease-in;
	-moz-transition:all 0.1s ease-in;
	-o-transition:all 0.1s ease-in;
	transition:all 0.1s ease-in;
}
#arrow ul .arrowup{background-position:0px -26px; margin: 0 auto;    margin-top: -26px;}
#arrow ul .arrowdown{    background-position: 0px 0px;
    position: absolute;
    bottom: 0;
    font-size: 18px;
    color: #a5845f;
    width: 250px;
    padding-left: 22px;
    margin-left: -35px;
    margin-top: 36px;margin-bottom: -26px;}



/** iPad **/
@media only screen and (min-width: 768px) and (max-width: 1024px) {

}


/** iPhone **/
@media only screen and (min-width: 320px) and (max-width: 767px) {
.pace .pace-progress {
    position: fixed;
    z-index: 20000;
    top: 50%;
    right: 50%;
    height: 5rem;
    margin-top: 10px;
}



#content{ padding-top:0}

.liright .hisct {
    float: left;
    text-align: left;
    padding-left: 10px;
    padding-right: 10px;
}

.lileft .hisct {
    float: right;
    text-align: left;
    padding-right: 10px;
    padding-left: 10px;
}

.hisct {
    padding-top: 10px;
}
.list li {
    vertical-align: bottom;
    /* overflow: hidden; */
    position: relative;
	overflow:visible
	}
	

.liwrap {
    height: 182px;
    margin: 72px 0 0px 0;
}
.storybg{ display:block}
.thiscur .point {
     top: 0;
    left: 50%;

}
.histt img {
    width: 315px;
   margin-left: -20%;
}

.date {
    margin-top: -60px;
    text-align: center;
}

#history {
    width: 100%;
/*    overflow: hidden;
*/}

#arrow ul .arrowdown {
    background-position: 0px 0px;
    position: absolute;
    bottom: 0;
    font-size: 18px;
    color: #a5845f;
     width: 100%; 
	     min-width: 100px;
    padding-left: 22px;
    margin-left: -35px;
    margin-top: 36px;
    margin-bottom: -26px;
}


.lileft {
    width: 100%;
}	


.point {
    left: 50%;    margin: -40px 0 0 -15px;     top: 0px;


	}

.liright {
    width: 100%;
}

}