﻿
html,body{ width: 100%; height: 100%; overflow: hidden; }
.pageSwiper{ width: 100%; height: 100%; position: relative;}
.swiper-slide{ width: 100%; height: 100%; position:relative;}
.video-js { position: absolute; left: 0; top:0%; width: 100%; } 

.kvTitle{width: 22.4%;position: absolute;top: 0;height: 100%;background: url(../image/kv_title.png) right center no-repeat;left: 50%;background-size: 100% auto;margin-left: -11.2%;}
.kvBg{position: absolute;top: 50%;left: 0;margin-top: -27.75%;}
.kvCars{ width: 100%; }
.kvCars div{width: 26.6%;padding-top: 18%;position: absolute;top: 50%;margin-top: -1.5%;}
.kvCars div.kvCar1{background: url(../image/kv_car1.png) 0 0 no-repeat;background-size:100% auto;left: 42.5%;}
.kvCars div.kvCar2{background: url(../image/kv_car2.png) 0 0 no-repeat;background-size:100% auto;left: 31.5%;}
.kvCars div.kvCar3{background: url(../image/kv_car3.png) 0 0 no-repeat;background-size:100% auto;left: 56%;}
.kvCars div.kvCar4{background: url(../image/kv_car4.png) 0 0 no-repeat;background-size:100% auto;left: 18.5%;}
.kvCars div.kvCar5{background: url(../image/kv_car5.png) 0 0 no-repeat;background-size:100% auto;left: 68%;}

.historySwiper,.historySwiper2{width: 100%;height: 100%;background: url(../image/histroy_bg.jpg) left 0 repeat-x #fff;background-size: auto 100%;}
.historySwiper2 img.w100{position: absolute;top: 50%;margin-top: -28%;}
.historySwiper .swiper-slide,.historySwiper2 .swiper-slide{ overflow: hidden;}
.historySwiper2 .swiper-slide{ float:left; z-index: 1 }
.historyItem{width: 100%;height: 100%;}
.historyImg{position: absolute;left: 0;top: 50%;width: 100%;height: 0;padding-top: 56.25%;margin-top: -28%;overflow:hidden;}
.historyImg1{ width: 105.625%;margin-top: -40%; padding-top:74.1%;/*transform: scale(0.5,0.5);-webkit-transform:scale(0.5,0.5)*/}
.historyImg img{ position: absolute; left: 0; height: 100%;top: 0;}
/* .historyItem3 .historyImg,.historyItem4 .historyImg{ width: 0%;} */
/* .historyTitle1{width: 15em;left: 50%;margin: -19.5% 0 0 -7.25%;position: absolute;top: 50%;}
.historyTitle2{width: 18.5em;left: 16%;margin: -20% 0 0 0;position: absolute;top: 50%;}
.historyTitle2_1{width: 14em;left: 47%;margin: 12.5% 0 0 0;position: absolute;top: 50%;}
.historyTitle2_2{width: 13em;left: 74%;margin: -11% 0 0 0;position: absolute;top: 50%;}
.historyTitle3{width: 25em;left: 54%;margin: -20% 0 0 0;position: absolute;top: 50%;}
.historyTitle4{width: 18em;left: 13%;margin: 11% 0 0 0;position: absolute;top: 50%;}
.historyTitle4_1{width: 12em;left: 47%;margin: 14% 0 0 0;position: absolute;top: 50%;}
.historyTitle4_2{width: 9em;left: 66%;margin: -17% 0 0 0;position: absolute;top: 50%;} */
.historyTitle4_img{width: 100%;margin-bottom: 1em;display: none;}
.historyTitle h4{padding:0 0 1em 0;font-weight: normal;position: relative;margin-bottom: 0.5em;color: #444444;display: none;}
.historyTitle h4::after{ content:" "; position: absolute; bottom:0; left: 0;  border-bottom: 1px solid #99003a; width:4em; }
.historyTitle h4 strong{color: #99003a;font-weight: bold;background: url(../image/text_icon.png) left center no-repeat;background-size:auto 100%;display: block;padding-left: 1em;line-height: 1em;margin-bottom: 0.5em;}
.historyImg2{width:44%;left: 2%;margin: -7% 0 0 0;position: absolute;top: 50%;}
.historyImg3_1{width:31.6%;left: 3%;margin: -32% 0 0 0;position: absolute;top: 50%;display: none;}
.historyImg3_2{width:43.85%;left: 42%;margin: -6% 0 0 0;position: absolute;top: 50%;}
.historyImg4_1{width:49.1%;right: 0%;margin: -2.5% 0 0 0;position: absolute;top: 50%;}
.hisPrev.prev{bottom: 0%;margin-bottom: 2.5%;left: 8%;}
.hisNext.next{bottom: 0%;margin-bottom: 2.5%;right: 8%;}
.hisLine{position: absolute;width: 74%;border-bottom: 1px solid #dddddd;bottom: 0;margin-bottom: 3.3%;left: 13%;z-index: 2;}
.hisLine span{position: absolute;left: 0;top: 0;width: 7%;height: 0;padding-top: 1%;background: url(../image/l.png) center center no-repeat;background-size: 100% auto;margin-top: -0.5%;}
.historyImg5{width: 49%;left: 35%;margin: -15% 0 0 0;position: absolute;top: 50%;}
.historyTitle5{width: 21em;left: 13%;margin: -20% 0 0 0;position: absolute;top: 50%;}
.historyTitle5_1{width: 28em;left: 54%;margin: -15% 0 0 0;position: absolute;top: 50%;}

.historyImg6{width: 48%;right: -1%;margin: -8% 0 0 0;position: absolute;top: 50%;}
.historyTitle6{width: 18em;left: 13%;margin: -19% 0 0 0;position: absolute;top: 50%;}
.historyTitle6_1{width: 16em;right: 10%;margin: -19% 0 0 0;position: absolute;top: 50%;}
.historyImg6_list{width: 15%;position: absolute;left: 11%;top: 50%;margin-top: -12%;}

.historyImg7{width:44%;left: 2%;margin: -7% 0 0 0;position: absolute;top: 50%;}
.historyTitle7{width: 18em;left: 20%;margin: -17% 0 0 0;position: absolute;top: 50%;}

.historyImg8{width: 35%;left: 0%;margin: -11% 0 0 0;position: absolute;top: 50%;}
.historyImg8_1{width: 32%;right: 2%;margin: 2% 0 0 0;position: absolute;top: 50%;}
.historyImg8_2{width: 18em;left: 13%;margin: 11% 0 0 0;position: absolute;top: 50%;}
.historyTitle8{width: 18%;left: 39%;margin: -21% 0 0 0;position: absolute;top: 50%;}
.historyTitle8_1{width: 18%;left: 60%;margin: -17% 0 0 0;position: absolute;top: 50%;}
.historyTitle8_2{width: 18%;left: 80%;margin: -17% 0 0 0;position: absolute;top: 50%;}
.historyTitle8_3{width: 18em;left: 56%;margin: 11% 0 0 0;position: absolute;top: 50%;}

.historyImg9{width: 33%;left: 9%;margin: -4% 0 0 0;position: absolute;top: 50%;}
.historyImg9_1{width: 31.5%;left: 24%;margin: -24% 0 0 0;position: absolute;top: 50%;}
.historyTitle9{width: 18em;left: 8%;margin: -20% 0 0 0;position: absolute;top: 50%;}
.historyTitle9ImgList{width: 12.2%;height: 0;padding-top: 17%;right: 7%; margin: -17% 0 0 0;position: absolute;top: 50%;background: url(../image/ht9.png) 0 0 no-repeat;background-size:100% auto;}
.historyCircle{position: absolute;left: -5em;height: 0;padding-top: 70%;background: #99003a;}
.historyCircle::before{content:' ';position: absolute;left: 0;top: 0;background: #99003a;height: 100%;width: 1px;}
.historyCircle span{display: block;position: absolute;cursor: pointer;width: 20px;left: -10px;height: 20px;}
.historyCircle span::before{ content:' '; position: absolute;border-radius: 50%; left:50%; top: 50%;background: #99003a;width:10px;padding-top:10px; margin:-5px 0 0 -5px;  }
.historyCircle span.active{transform: scale(2,2);}
.historyCircle span.c1{top: -5px;}
.historyCircle span.c2{top: 33%;}
.historyCircle span.c3{top: 64%;}
.historyCircle span.c4{bottom: -5px;}
.historyText{ }
.historyImgText{/* display: none; */opacity: 0;position: absolute;left: 0;top: 0;width: 100%;}
.historyImgText.active{-webkit-animation:fadeInDown2 0.8s 1 ease 0s forwards;animation:fadeInDown2 0.8s 1 ease 0s forwards;}
.historyImgText img{ }
.historyImgText .historyTitle9_1{margin-top: 1em;}
.historyImgText .historyTitle9_2{margin-top: 1em;}
.historyImgText .historyTitle9_3{margin-top: 1em;}
.historyImgText .historyTitle9_4{margin-top: 1em;}

.carSwiper{ width: 100%; height: 100%;opacity: 0 }
.carSwiper .swiper-slide{ overflow: hidden;}
.carBg{ position: absolute; left: 0; top: 0; }
.carTitle{position: absolute;top: 50%;width: 100%;left: 0;margin: -17% 0 0 0;text-align: center;}
.carTitle strong{ font-weight: normal;display: block;}
.carTitle p{ margin-top: 1em; letter-spacing: 1px }
.white{ color: #fff;}
.carCar{position: absolute;top: 50%;width: 46%;left: 25.5%;margin: -8% 0 0 0;}
.carsItem{position: absolute;width: 40%;left: 30%;top: 50%;margin-top: 13.5%;z-index: 2;text-align: center;}
.carIcon{width: 12.5%;display: inline-block;padding-top: 8%;margin: 0 1%;cursor: pointer;}
.carIcon.icon1{background: url(../image/c1.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon2{background: url(../image/c2.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon3{background: url(../image/c3.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon4{background: url(../image/c4.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon5{background: url(../image/c5.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon6{background: url(../image/c6.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon1.active{background: url(../image/cc1.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon2.active{background: url(../image/cc2.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon3.active{background: url(../image/cc3.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon4.active{background: url(../image/cc4.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon5.active{background: url(../image/cc5.png) center center no-repeat; background-size: 100% auto;}
.carIcon.icon6.active{background: url(../image/cc6.png) center center no-repeat; background-size: 100% auto;}
.carsBtn{position: absolute;bottom: 0;margin-bottom: 3%;left: 50%;z-index: 2;width: 400px;margin-left: -200px;}
.carsBtn a{background: #99003a;border:1px solid #99003a;width: 45%;color: #fff;text-align: center;border-radius: 5px;display: block;float: left;padding: 15px 0;margin: 0 2.5%; letter-spacing: 4px; }
.prev{position: absolute;width: 2%;height: 0;background: url(../image/prev.png) center center no-repeat;left: 2%;background-size: 100% auto;padding-top: 2%;z-index: 2;text-indent: -9999em;cursor: pointer;}
.carsPrev{top: 50%;margin-top: -1%;left: 8%;}
.next{position: absolute;width: 2%;height: 0;background: url(../image/next.png) center center no-repeat;right: 2%;background-size: 100% auto;padding-top: 2%;z-index: 2;text-indent: -9999em;cursor: pointer;}
.carsNext{top: 50%;margin-top: -1%;right: 5%;}
.prev.grayPrev{background: url(../image/prev_gray.png) center center no-repeat;background-size: 100% auto; }
.next.grayNext{background: url(../image/next_gray.png) center center no-repeat;background-size: 100% auto; }
.bgTop{position: absolute;top: 0;width: 100%;left: 0;padding-top: 17%;background: url(../image/car_bg1.png) 0 0 no-repeat;background-size: 100% auto;}
.bgBottom{position: absolute;bottom: 0;width: 100%;left: 0;padding-top: 12%;background: url(../image/car_bg2.png) 0 0 no-repeat;background-size: 100% auto;}

.slide4{background: #f7f8f8;}
.tecItem{width: 96%;position: absolute;left: 2%;height: 74%;top: 16%;overflow: hidden;}
.btnI{position: absolute;right: 6%;bottom: 0;margin-bottom: 8%;}
.tecTitle{width: 22em;text-align: right;}
.tecTitle strong{ font-weight: normal;display: block;}
.tecTitle p{ margin-top: 0.5em; letter-spacing: 1px;text-transform:Uppercase; }
.more{background: #99003a;border:1px solid #99003a;width: 180px;color: #fff;text-align: center;border-radius: 5px;display: block;padding: 15px 0;margin: 7% 0 0 0;letter-spacing: 4px;float: right;}

.pageNav{position: absolute;left: 3%;z-index: 2;top: 50%;margin-top: -126px; display: none;}
.pageNav li{position: relative;margin: 0.5em 0;position: relative;border-radius: 50px;width: 6em;height: 30px;line-height: 30px;}
.pageNav li span{
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
    background: #99003a;
    /* display: none; */
    }
.pageNav li em{
    display: block;
    cursor: pointer;
    opacity: 0;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
    font-style: normal;
    padding: 2% 0;
    color: #ffffff;
    position: absolute;
    left: 0;
    width: 6em;
    top: 0;
    margin-top: -15px;
    background: rgba(153,0,58,0.8);
    border-radius: 50px;
    text-align: center;
} 
.pageNav li.active{}
.pageNav li.active span{
    opacity: 0;
    }
.pageNav li.active em{
    opacity: 1;
    }


.botton:hover{ border:1px solid #99003a; background: #fff; color: #99003a;  }

/* .historyTitle{  position: absolute;left: 50%;top: 50%;} */
.historyTitle1{ }
.historyTitle strong{font-weight: normal;padding-left: 1em;color: #99003a;background: url(../image/text_icon.png) left center no-repeat;background-size:auto 100%;display: block;margin-bottom: 0.8em;}
.historyTitle p{color: #444444;line-height: 1.65em;letter-spacing: 0.02em;}
.historyTitle p span.strong{display: block;font-weight: bold;}


.historyTitle strong,.historyTitle p{ display: none;}
.historyText .historyTitle strong,.historyText .historyTitle p{ display: block;}
.historyTitle1{width: 5%;height:0;padding-top: 15%;right: 14%;margin: -4.5% 0 0 -7.25%;position: absolute;top: 50%;background: url(../image/ht1.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle2{width: 10.5%;height:0;padding-top: 18%;left: 15%;margin: -18% 0 0 0;position: absolute;top: 50%;background: url(../image/ht2_1.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle2_1{width: 6.5%;height: 0;padding-top: 15%;left: 46%;margin: 5.5% 0 0 0;position: absolute;top: 50%;background: url(../image/ht2_2.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle2_2{width: 10%;height: 0;padding-top: 13%;right: 10%;position: absolute;top: 50%;background: url(../image/ht2_3.png) 0 0 no-repeat;background-size:100% auto;margin-top: -19%;}
.historyTitle3{width: 13.2%;height: 0;padding-top: 22%;left: 50%;margin: -18% 0 0 0;position: absolute;top: 50%;background: url(../image/ht3.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle4{width: 10.8%;height: 0;padding-top: 19%;left: 3%;position: absolute;top: 50%;background: url(../image/ht4_1.png) 0 0 no-repeat;background-size:100% auto;margin-top: 0%;}
.historyTitle4_1{width: 5%;height: 0;padding-top: 15%;left: 48%;margin: 10% 0 0 0;position: absolute;top: 50%;background: url(../image/ht4_2.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle4_2{width: 5.5%;height: 0;padding-top: 15%;left: 75%;margin: -16% 0 0 0;position: absolute;top: 50%;background: url(../image/ht4_3.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle5{width: 7.2%;height: 0;padding-top: 23%;left: 37%;margin: -17% 0 0 0;position: absolute;top: 50%;background: url(../image/ht5_1.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle5_1{width: 3%;height: 0;padding-top: 8%;right: 8%;margin: 0;position: absolute;top: 50%;background: url(../image/ht5_3.png) 0 0 no-repeat;background-size:100% auto;left: auto;margin-top: -18%;}
.historyTitle5_2{width: 12%;height: 0;padding-top: 15%;left: 80%;margin: 5% 0 0 0;position: absolute;top: 50%;background: url(../image/ht5_2.png) 0 0 no-repeat;background-size:100% auto;}

.historyTitle6{width:93px;height: 0;padding-top: 15%;left: 13%;margin: -19% 0 0 0;position: absolute;top: 50%;display: none;}
.historyTitle6_1{width: 11.25%;height: 0;padding-top: 22%;right: 40%;margin: -19% 0 0 0;position: absolute;top: 50%;background: url(../image/ht6.png) 0 0 no-repeat;background-size:100% auto;}


.historyTitle7{width: 5%;height: 0;padding-top: 15%;left: 25%;margin: -18% 0 0 0;position: absolute;top: 50%;background: url(../image/ht7.png) 0 0 no-repeat;background-size:100% auto;}

.historyTitle8{width: 10%;height: 0;padding-top: 24%;left: 42%;margin: -19% 0 0 0;position: absolute;top: 50%;background: url(../image/ht8_1.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle8_1{width: 8.5%;height: 0;padding-top: 20%;left: 60%;margin: -19% 0 0 0;position: absolute;top: 50%;background: url(../image/ht8_2.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle8_2{width: 12.75%;height: 0;padding-top: 19%;left: 73%;margin: -19% 0 0 0;position: absolute;top: 50%;background: url(../image/ht8_3.png) 0 0 no-repeat;background-size:100% auto;}
.historyTitle8_3{width: 3%;height: 0;padding-top: 15%;left: 65%;margin: 9% 0 0 0;position: absolute;top: 50%;background: url(../image/ht8_4.png) 0 0 no-repeat;background-size:100% auto;}

/* .historyTitle9{width: 12.2%;height: 0;padding-top: 17%;right: 7%; margin: -17% 0 0 0;position: absolute;top: 50%;background: url(../image/ht9.png) 0 0 no-repeat;background-size:100% auto;} */
.historySwiper2 .historyTitle9{ left: 73%;}

.botton{ transition: all 0.5s;}

.header{-webkit-animation:fadeInUp 0.8s 1 ease 0s forwards; animation:fadeInUp 0.8s 1 ease 0s forwards; }
.slide1.animation .kvBg{-webkit-animation:fadeIn 0.8s 1 ease 0s forwards; animation:fadeIn 0.8s 1 ease 0s forwards; }
.slide1.animation .kvCar5{-webkit-animation:fadeInLeft2 0.8s 1 ease 1s forwards; animation:fadeInLeft2 0.8s 1 ease 1s forwards;}
.slide1.animation .kvCar4{-webkit-animation:fadeInRight2 0.8s 1 ease 1s forwards; animation:fadeInRight2 0.8s 1 ease 1s forwards;}
.slide1.animation .kvCar3{-webkit-animation:fadeInLeft2 0.8s 1 ease 0.5s forwards; animation:fadeInLeft2 0.8s 1 ease 0.5s forwards;}
.slide1.animation .kvCar2{-webkit-animation:fadeInRight2 0.8s 1 ease 0.5s forwards; animation:fadeInRight2 0.8s 1 ease 0.5s forwards;}
.slide1.animation .kvCar1{-webkit-animation:fadeIn 0.8s 1 ease 0s forwards; animation:fadeIn 0.8s 1 ease 0s forwards;}

.nextP{-webkit-animation:fadeInDown 0.8s 1 ease 1.5s forwards; animation:fadeInDown 0.8s 1 ease 1.5s forwards;}
.nextP span{  animation: next .5s linear infinite alternate; -webkit-animation: next .5s linear infinite alternate;}


.slide3.animation .cars1.ani .carTitle,.slide3.animation .cars2.ani .carTitle,.slide3.animation .cars3.ani .carTitle,.slide3.animation .cars4.ani .carTitle,.slide3.animation .cars5.ani .carTitle{-webkit-animation:fadeInUp 0.8s 1 ease 0.5s forwards; animation:fadeInUp 0.8s 1 ease 0.5s forwards;}
.slide3.animation .carSwiper{-webkit-animation:fadeIn 0.8s 1 ease 0s forwards; animation:fadeIn 0.8s 1 ease 0s forwards; }
.slide3.animation .cars1.ani .carCar,.slide3.animation .cars2.ani .carCar,.slide3.animation .cars3.ani .carCar,.slide3.animation .cars4.ani .carCar,.slide3.animation .cars5.ani .carCar{-webkit-animation:fadeInRight 0.8s 1 ease 0.5s forwards; animation:fadeInRight 0.8s 1 ease 0.5s forwards;}
.slide3.animation .carsItem{-webkit-animation:fadeInDown 0.8s 1 ease 1.5s forwards; animation:fadeInDown 0.8s 1 ease 1.5s forwards;}
.slide3.animation .carsBtn{-webkit-animation:fadeInDown 0.8s 1 ease 2s forwards; animation:fadeInDown 0.8s 1 ease 2s forwards;}
.slide3.animation .carsPrev{-webkit-animation:fadeInLeft 0.8s 1 ease 2.5s forwards; animation:fadeInLeft 0.8s 1 ease 2.5s forwards; left:10%;}
.slide3.animation .carsNext{-webkit-animation:fadeInRight 0.8s 1 ease 2.5s forwards; animation:fadeInRight 0.8s 1 ease 2.5s forwards;}

.slide4.animation .tecImg{ -webkit-animation:fadeIn 0.8s 1 ease 0s forwards; animation:fadeIn 0.8s 1 ease 0s forwards;}
.slide4.animation .tecTitle{-webkit-animation:fadeInDown 0.8s 1 ease 0.4s forwards; animation:fadeInDown 0.8s 1 ease 0.4s forwards;}
.slide4.animation .more{-webkit-animation:fadeInDown 0.8s 1 ease 0.8s forwards; animation:fadeInDown 0.8s 1 ease 0.8s forwards;}


.slide5.animation .serviceList{-webkit-animation:fadeInUp 0.8s 1 ease 0s forwards; animation:fadeInUp 0.8s 1 ease 0s forwards;}
.slide5.animation .footer{-webkit-animation:fadeInDown 0.8s 1 ease 0s forwards; animation:fadeInDown 0.8s 1 ease 0s forwards;}

.slide2.animation .hisLine{ -webkit-animation:fadeInDown 1.2s 1 ease 1s forwards; animation:fadeInDown 1.2s 1 ease 1s forwards;}
.slide2.animation .hisPrev{ -webkit-animation:fadeInLeft 1.2s 1 ease 1s forwards; animation:fadeInLeft 1.2s 1 ease 1s forwards;}
.slide2.animation .hisNext{ -webkit-animation:fadeInRight 1.2s 1 ease 1s forwards; animation:fadeInRight 1.2s 1 ease 1s forwards;}

.historyItem1.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 liner 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem1.animation .historyTitle1{-webkit-animation:fadeInUp 0.8s 1 ease 0.5s forwards; animation:fadeInUp 0.8s 1 ease 0.5s forwards;  }

.historyItem2.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem2.animation .historyImg2{-webkit-animation:fadeInLeft 1s 1 ease 0.6s forwards; animation:fadeInLeft 1s 1 ease 0.6s forwards;  }
.historyItem2.animation .historyTitle2{-webkit-animation:fadeIn 0.8s 1 ease 1.5s forwards; animation:fadeIn 0.8s 1 ease 1.5s forwards;  }
.historyItem2.animation .historyTitle2_1{-webkit-animation:fadeIn 0.8s 1 ease 1.9s forwards; animation:fadeIn 0.8s 1 ease 1.9s forwards;  }
.historyItem2.animation .historyTitle2_2{-webkit-animation:fadeIn 0.8s 1 ease 2.3s forwards; animation:fadeIn 0.8s 1 ease 2.3s forwards;  }

.historyItem3.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem3.animation .historyImg3_1{-webkit-animation:fadeIn 1.2s 1 ease 0s forwards; animation:fadeIn 1.2s 1 ease 0s forwards;  }
.historyItem3.animation .historyImg3_2{-webkit-animation:fadeInRight 0.8s 1 ease 0.8s forwards; animation:fadeInRight 0.8s 1 ease 0.8s forwards;  }
.historyItem3.animation .historyTitle3{-webkit-animation:fadeIn 0.8s 1 ease 2s forwards; animation:fadeIn 0.8s 1 ease 2s forwards;  }

.historyItem4.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem4.animation .historyImg4_1{-webkit-animation:fadeInLeft 1s 1 ease 0.8s forwards; animation:fadeInLeft 1s 1 ease 0.8s forwards;  }
.historyItem4.animation .historyTitle4{-webkit-animation:fadeIn 0.8s 1 ease 1.5s forwards; animation:fadeIn 0.8s 1 ease 1.5s forwards;  }
.historyItem4.animation .historyTitle4_1{-webkit-animation:fadeIn 0.8s 1 ease 2.3s forwards; animation:fadeIn 0.8s 1 ease 2.3s forwards;  }
.historyItem4.animation .historyTitle4_2{-webkit-animation:fadeIn 0.8s 1 ease 1.9s forwards; animation:fadeIn 0.8s 1 ease 1.9s forwards;  }


.historyItem5.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem5.animation .historyImg5{-webkit-animation:fadeInRight 1s 1 ease 0.8s forwards; animation:fadeInRight 1s 1 ease 0.8s forwards;  }
.historyItem5.animation .historyTitle5{-webkit-animation:fadeIn 0.8s 1 ease 1.5s forwards; animation:fadeIn 0.8s 1 ease 1.5s forwards;  }
.historyItem5.animation .historyTitle5_1{-webkit-animation:fadeIn 0.8s 1 ease 2.3s forwards; animation:fadeIn 0.8s 1 ease 2.3s forwards;  }
.historyItem5.animation .historyImg6_list {-webkit-animation:fadeIn 0.8s 1 ease 1s forwards; animation:fadeIn 0.8s 1 ease 1s forwards; }


.historyItem6.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem6.animation .historyImg6{-webkit-animation:fadeInRight 1s 1 ease 0.8s forwards; animation:fadeInRight 1s 1 ease 0.8s forwards;  }
.historyItem6.animation .historyTitle6{-webkit-animation:fadeIn 0.8s 1 ease 1.5s forwards; animation:fadeIn 0.8s 1 ease 1.5s forwards;  }
.historyItem6.animation .historyTitle6_1{-webkit-animation:fadeIn 0.8s 1 ease 2.3s forwards; animation:fadeIn 0.8s 1 ease 2.3s forwards;  }

.historyItem7.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem7.animation .historyTitle7{-webkit-animation:fadeIn 0.8s 1 ease 1.5s forwards; animation:fadeIn 0.8s 1 ease 1.5s forwards;  }

.historyItem8.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem8.animation .historyImg8_1{-webkit-animation:fadeInLeft 1s 1 ease 0.8s forwards; animation:fadeInLeft 1s 1 ease 0.8s forwards;  }
.historyItem8.animation .historyImg8{-webkit-animation:fadeInRight 1s 1 ease 0.8s forwards; animation:fadeInRight 1s 1 ease 0.8s forwards;  }
.historyItem8.animation .historyTitle8{-webkit-animation:fadeIn 1s 1 ease 1.6s forwards; animation:fadeIn 1s 1 ease 1.6s forwards;  }
.historyItem8.animation .historyTitle8_1{-webkit-animation:fadeIn 1s 1 ease 2.5s forwards; animation:fadeIn 1s 1 ease 2.5s forwards;  }
.historyItem8.animation .historyTitle8_2{-webkit-animation:fadeIn 1s 1 ease 3.4s forwards; animation:fadeIn 1s 1 ease 3.4s forwards;  }
.historyItem8.animation .historyTitle8_3{-webkit-animation:fadeIn 1s 1 ease 4.4s forwards; animation:fadeIn 1s 1 ease 4.4s forwards;  }


.historyItem9.animation .historyImg{-webkit-animation:fadeIn 1.2s 1 linear 0s forwards; animation:fadeIn 1.2s 1 linear 0s forwards;  }
.historyItem9.animation .historyImg9{-webkit-animation:fadeInLeft 1s 1 ease 1.5s forwards; animation:fadeInLeft 1s 1 ease 1.5s forwards;  }
.historyItem9.animation .historyImg9_1{-webkit-animation:fadeInUp 1s 1 ease 0.8s forwards; animation:fadeInUp 1s 1 ease 0.8s forwards;  }
.historyItem9.animation .historyTitle9{-webkit-animation:fadeIn 0.8s 1 ease 2.3s forwards; animation:fadeIn 0.8s 1 ease 2.3s forwards;  }
.historyItem9.animation .historyTitle9ImgList{-webkit-animation:fadeIn 0.8s 1 ease 3.1s forwards; animation:fadeIn 0.8s 1 ease 3.1s forwards;  }



@media screen and ( max-height: 850px ) {
    .carTitle {
        position: absolute;
        top: 50%;
        width: 100%;
        left: 0;
        margin: -13% 0 0 0;
    }
    .carCar{    position: absolute;
        top: 50%;
        width: 40%;
        left: 29.5%;
        margin: -8% 0 0 0;}
    .carsItem{    position: absolute;
        width: 34%;
        left: 33%;
        top: 50%;
        margin-top: 10.5%;
        z-index: 2;
    }
}










