@charset "UTF-8";
/*!
	Timeline - v0.0.1
	ilker Yılmaz
	https://github.com/ilkeryilmaz/timeline
 */
.timeline-container {
  position: relative; }
  .timeline-container::after {
    content: '';
    display: table;
    clear: both; }

.timeline {
  width: 100%; }

.timeline-list {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 0;
  padding: 0; }

.timeline-list-wrap {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  transform: translate3d(0, 0, 0);
  transition: transform 1s cubic-bezier(0.455, 0.03, 0.515, 0.955); }

.timeline-item {
  float: left;
  width: 1200px; margin-bottom:70px;


  box-sizing: border-box; }

.timeline-dots-wrap {
  position: absolute;
  overflow: hidden; }

  .timeline-horizontal .timeline-dots-wrap {
    width: 100%;
    height:90px; background: url("../images/timeline-bg.png") 0 70px  repeat-x;}
  .timeline-vertical .timeline-dots-wrap {
    width: 65px;
    height: 100%;
    top: 0; }
  .timeline-dots-wrap.bottom {
    bottom: -80px; }
  .timeline-dots-wrap.top {
    top: -50px; }
  .timeline-dots-wrap.left {
    left: -65px; }
  .timeline-dots-wrap.right {
    right: -70px; }

.timeline-dots {
  margin: 0;
  padding: 0;
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 1s cubic-bezier(0.455, 0.03, 0.515, 0.955); }
  .timeline-horizontal .timeline-dots { display: flex; margin:0 auto; overflow:hidden; flex-wrap: nowrap; width:5000px;
    }
  .timeline-vertical .timeline-dots {
    background: url("../images/timeline-vertical-bg.png") left repeat-y; }
  .timeline-dots li {
    transition: all 1s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    list-style: none;
     }
    .timeline-horizontal .timeline-dots li {
      flex: 0 0 200px;
      text-align: center; padding-bottom:30px; padding-top:10px;}
    .timeline-vertical .timeline-dots li {
      width: 100%; }
    .timeline-dots li.slide-active button {
      color:rgba(240,131,30);
      font-size: 34px; font-weight:bold;background: url("../images/date-iconhou.png") center center no-repeat; }
  .timeline-dots button {
    cursor: pointer;
    border: none;
    outline: none;
    color: #c9caca;
    font-size: 26px; font-weight:bold;
    transition: all 1s cubic-bezier(0.455, 0.03, 0.515, 0.955); }
    .timeline-horizontal .timeline-dots button {
      background: url("../images/date-icon.png")  center center no-repeat; 
      padding-bottom: 100px;}
    .timeline-vertical .timeline-dots button {
      background: url("../images/date-icon-vertical.png") left no-repeat;
      padding-left: 15px; }



.timeline-list {
  width: 1200px; margin:0 auto; }
  
.timeline-biao h1{ display:inline-block; color:#3e3a39; font-size:60px; font-family:Arial, Helvetica, sans-serif;}
.timeline-biao{ position:relative; margin-bottom:60px;}
.timeline-biao::after {
            content: '';
            position: absolute;
            bottom: -20px;
            left: 0;
           height: 7px; width:95px;
            background:rgb(240,131,30);
            transform: translateY(-50%);
            z-index: -1;
      
        }

.timeline-biao h2{ display:inline-block;color:#3e3a39; font-size:35px;}
.timeline-detail-list p{ font-size:18px; margin-bottom:15px;}
.timeline-detail-list p strong{ color:rgb(240,131,30);  font-weight:bolder; margin-right:2%;}

.timeline-visual {
    float: left;
    width: 48%;

}
.timeline-visual img{ width:100%;}

.timeline-detail {
    float: left;
    width: 44%;
    margin:40px 3% 0 3%;
 
}

@media (max-width:640px) {
	
.timeline-horizontal .timeline-dots li{ flex: 0 0 100px;}	
.timeline-dots li.slide-active button{ font-size:22px;}
.timeline-dots button{font-size:20px;}
.timeline-item{ width:340px; margin-bottom:40px; position:relative; min-height:400px; }
.timeline-list{width:340px; }
.timeline-detail{ float:none; width:100%; margin:20px 0 0 0; position:absolute;top:250px; left:0;}

.timeline-detail-list p{ font-size:15px; margin-bottom:10px;}
.timeline-visual{ float:none; width:100%;margin-top:30px; position:absolute;top:0; left:0; height:250px;}
.timeline-biao::after{ height:0;}	
.timeline-biao h1{ color:#e7e7e7;  font-size:80px;}
.timeline-biao h2{ font-size:80px; color:#e7e7e7;}
.timeline-biao{ display:none;}
.fazhan{ padding:50px 0 150px 0;}

	
	
	}
















