@media screen and (min-width: 770px) { .swiper1-pagination { display: none; } }

@media screen and (max-width: 770px) { .swiper-container .swiper-wrapper .slide1 .demo-content .discript { width: 80%; }
  .swiper-container .swiper-wrapper .slide1 .demo-content .discript h2 { font-weight: normal; font-size: 22px; line-height: 30px; margin-bottom: 10px; }
  .swiper-container .swiper-wrapper .slide1 .demo-content .discript div { line-height: 22px; font-size: 12px; }
  .swiper-container .swiper-wrapper .slide1 .demo-content .discript a { font-size: 12px; margin-top: 8px; }
  .car-ad-menu { display: none; }
  .swiper1-pagination { width: 100%; position: absolute; left: 0; bottom: 60px; height: 40px; z-index: 40; }
  .swiper1-pagination .pagination-body { height: 100%; line-height: 30px; width: 82%; position: relative; margin: 0 auto; text-align: center; }
  .swiper1-pagination .pagination-body .arrow-left, .swiper1-pagination .pagination-body .arrow-right { width: 8px; height: 14px; position: absolute; top: 50%; margin-top: -7px; }
  .swiper1-pagination .pagination-body .arrow-left { background: url(../image/phone/arrow-left.png) no-repeat; -moz-background-size: 100% 100%; background-size: 100% 100%; left: 0; }
  .swiper1-pagination .pagination-body .arrow-right { background: url(../image/phone/arrow-right.png) no-repeat; -moz-background-size: 100% 100%; background-size: 100% 100%; right: 0; }
  .swiper1-pagination .pagination-body .line-controller { width: -webkit-calc(100% - 20px); width: -moz-calc(100% - 20px); width: calc(100% - 20px); height: 1px; background-color: #515158; position: relative; display: inline-block; }
  .swiper1-pagination .pagination-body .line-controller .car-brandlogo { width: 120px; height: 40px; position: absolute; right: 27%; margin-top: -20px; }
  .swiper1-pagination .pagination-body .line-controller .line-circle { width: 8px; height: 8px; background: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; position: absolute; top: -4px; }
  .swiper1-pagination .pagination-body .line-controller .line-circle-1 { left: 15%; }
  .swiper1-pagination .pagination-body .line-controller .line-circle-2 { left: 25%; }
  .swiper1-pagination .pagination-body .line-controller .line-circle-3 { right: 11%; }
  .swiper1-pagination .pagination-body .swiper-container-33 .swiper-slide { background: none; }
  .swiper1-pagination .pagination-body .swiper-container-33 .swiper-slide img { width: 100%; height: 100%; }
  .swiper-container .swiper-wrapper .slide3 .swiper-container h2 { font-size: 18px; font-weight: normal; line-height: 22px; margin-bottom: 8px; }
  .swiper-container .swiper-wrapper .slide3 .swiper-container { width: 100%; }
  .slide3 .swiper-container-3 .swiper-slide .section-body { padding: 120px 14% 0; color: #fff; }
  .slide3 .swiper-container-3 .swiper-slide .section-body .h2-2 { margin-bottom: 20px; }
  .slide3 .swiper-container-3 .swiper-slide .section-body .car-text { line-height: 28px; font-size: 12px; }
  .slide3 .swiper-container-3 .swiper-slide .section-body .showcar-pic { width: 100%; height: 180px; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; }
  .slide3 .swiper-container-3 .swiper-slide .section-body .showcar-pic img { width: 100%; }
  .swiper-container .swiper-wrapper .slide4 .demo-content .form-consult { width: 88%; padding: 5px 20px; background: #fff; left:auto; bottom:auto; }
  .swiper-container .swiper-wrapper .slide4 .demo-content .form-consult .form-header h2 { font-weight: normal; font-size: 18px; line-height: 20px; margin-bottom: 15px; }
  .swiper-container .swiper-wrapper .slide4 .demo-content .form-consult .form-header p { font-size: 12px; line-height: 14px; }
  .swiper-container .swiper-wrapper .slide4 .demo-content .form-consult .from-consult-list .from-consult-item { color: #1e1e1e; height: 28px; line-height: 26px; margin-bottom: 10px; }
  .swiper-container .swiper-wrapper .slide4 .demo-content .form-consult .from-consult-list .from-consult-item input { font-size: 12px; }
  .swiper-container .swiper-wrapper .slide4 .demo-content .form-consult .form-submit { margin: 20px 0 15px 0; }
  .swiper-container .swiper-wrapper .slide4 .demo-content .form-consult .form-submit { font-size: 14px; }
  .slide5 { background: url(../image/bg5.png) no-repeat; -moz-background-size: 100% 100%; background-size: 100% 100%; }
  .slide5 .demo-content { z-index: 3; position: absolute; width: 100%; height: 100%; }
  .slide5 .demo-content .content-list { width: 100%; height: 100%; }
  .slide5 .demo-content .content-list ul { overflow: hidden; position: absolute; width: 100%; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);padding-top:90px;}
  .slide5 .demo-content .content-list ul > a { float: left; width: 50%; }
  .slide5 .demo-content .content-list ul > a:nth-child(1n) { padding-right: 20px; }
  .slide5 .demo-content .content-list ul > a:nth-child(1n) .upload { float: right; }
  .slide5 .demo-content .content-list ul > a:nth-child(2n) { padding-left: 20px; }
  .slide5 .demo-content .content-list ul > a:nth-child(2n) .upload { float: left; }
  .slide5 .demo-content .content-list ul > a:nth-child(1), .slide5 .demo-content .content-list ul > a:nth-child(2) { margin-bottom: 30px; }
  .slide5 .demo-content .content-list ul li b { font-size: 20px; }
  .slide5 .demo-content .content-list ul li .un-upload { display: none; }
  .slide5 .demo-content .content-list ul li .upload { padding: 2px; }
  .slide5 .demo-content .content-list ul li .upload img { width: 120px; height: 120px; }
  .slide5 .demo-content .content-list ul li .upload .p1, .slide5 .demo-content .content-list ul li .upload .p2 { display: block; text-align: center; font-size: 14px; font-weight: normal; }
  .slide5 .demo-content .content-list ul li .upload .p1 { padding-top: 10px; line-height: 40px; font-size: 22px; }
  .slide5 .demo-bg .c-puzzle__piece:nth-of-type(1) { left: -80%; }
  .slide5 .demo-bg .c-puzzle__piece:nth-of-type(2) { left: 36%; }
  .slide5 .demo-bg .c-puzzle__piece:nth-of-type(3) { left: 50%; }
  #qs-tools a { -webkit-animation: zoomOut 1.5s ease 0s 1 both; -moz-animation: zoomOut 1.5s ease 0s 1 both; -o-animation: zoomOut 1.5s ease 0s 1 both; animation: zoomOut 1.5s ease 0s 1 both; }
  .slide5.swiper-slide-active #qs-tools a:nth-of-type(1) { -webkit-animation: bounceInLeft 1s ease 0s 1 both; -moz-animation: bounceInLeft 1s ease 0s 1 both; -o-animation: bounceInLeft 1s ease 0s 1 both; animation: bounceInLeft 1s ease 0s 1 both; }
  .slide5.swiper-slide-active #qs-tools a:nth-of-type(2) { -webkit-animation: bounceInRight 1s ease 0.4s 1 both; -moz-animation: bounceInRight 1s ease 0.4s 1 both; -o-animation: bounceInRight 1s ease 0.4s 1 both; animation: bounceInRight 1s ease 0.4s 1 both; }
  .slide5.swiper-slide-active #qs-tools a:nth-of-type(3) { -webkit-animation: bounceInLeft 1s ease 0.6s 1 both; -moz-animation: bounceInLeft 1s ease 0.6s 1 both; -o-animation: bounceInLeft 1s ease 0.6s 1 both; animation: bounceInLeft 1s ease 0.6s 1 both; }
  .slide5.swiper-slide-active #qs-tools a:nth-of-type(4) { -webkit-animation: bounceInRight 1s ease 0.8s 1 both; -moz-animation: bounceInRight 1s ease 0.8s 1 both; -o-animation: bounceInRight 1s ease 0.8s 1 both; animation: bounceInRight 1s ease 0.8s 1 both; }
  .slide3 .swiper-container-3 .swiper-slide .section-body { padding: 80px 10% 0; }
  .swiper-container .swiper-wrapper .slide3 .container-4 .swiper2-pagination { margin-left: 0; width: 72%; height: 30px; left: 14%; bottom: -70px; /*.arrow-top{ margin-top: -9px; } .arrow-btm{ margin-top: -15px; width: 30px; height: 30px; }*/ }
  .swiper-container .swiper-wrapper .slide3 .container-4 .swiper2-pagination .time { display: none; }
  .swiper-container .swiper-wrapper .slide3 .container-4 .swiper2-pagination .arrow-none, .swiper-container .swiper-wrapper .slide3 .container-4 .swiper2-pagination .arrow-more { position: absolute; }
  .swiper-container .swiper-wrapper .slide3 .container-4 .swiper2-pagination .arrow-none { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); }
  .swiper-container .swiper-wrapper .slide3 .container-4 .swiper2-pagination .arrow-more { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); }
  .swiper-container .swiper-wrapper .slide3 .container-4 .swiper2-pagination .line { width: -webkit-calc(100% - 60px); width: -moz-calc(100% - 60px); width: calc(100% - 60px); height: 1px; background: #fff; left: 24px; top: 50%; } }

@media screen and (max-width: 750px) { .swiper-container .swiper-wrapper .slide1 { background: url(../image/phone/bg-01.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-01 { background: url(../image/phone/car-bg-01.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-02 { background: url(../image/phone/car-bg-02.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-03 { background: url(../image/phone/car-bg-03.png) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-04 { background: url(../image/phone/car-bg-04.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-05 { background: url(../image/phone/car-bg-05.png) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-06 { background: url(../image/phone/car-bg-06.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-07 { background: url(../image/phone/car-bg-07.png) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }

  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-08 { background: url(../image/phone/car-bg-08.png) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }

  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-09 { background: url(../image/phone/car-bg-09.png) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }

  .swiper-container .swiper-wrapper .slide2 .brand-animation .swiper-slide-10 { background: url(../image/phone/car-bg-10.jpg?v=1) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
 
  .swiper-container .swiper-wrapper .slide3 { background: url(../image/phone/bg-03.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide4 { background: url(../image/phone/bg-04.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; }
  .swiper-container .swiper-wrapper .slide5 { background: url(../image/phone/bg-05.jpg) no-repeat; background-position: center center; -moz-background-size: cover; background-size: cover; } }

.swiper-slide-active .home-animation h2 { -webkit-animation: fadeInLeft 1.5s ease 0.1s 1 both; -moz-animation: fadeInLeft 1.5s ease 0.1s 1 both; -o-animation: fadeInLeft 1.5s ease 0.1s 1 both; animation: fadeInLeft 1.5s ease 0.1s 1 both; }

.swiper-slide-active .home-animation > div { -webkit-animation: fadeInRight 1.5s ease 0.6s 1 both; -moz-animation: fadeInRight 1.5s ease 0.6s 1 both; -o-animation: fadeInRight 1.5s ease 0.6s 1 both; animation: fadeInRight 1.5s ease 0.6s 1 both; }

.swiper-slide-active .home-animation a { -webkit-animation: fadeInLeft 1.5s ease 0.9s 1 both; -moz-animation: fadeInLeft 1.5s ease 0.9s 1 both; -o-animation: fadeInLeft 1.5s ease 0.9s 1 both; animation: fadeInLeft 1.5s ease 0.9s 1 both; }

.slide2.swiper-slide-active .swiper-slide-active .brand-title { -webkit-animation: bounceIn 2s ease 0.1s 1 both; -moz-animation: bounceIn 2s ease 0.1s 1 both; -o-animation: bounceIn 2s ease 0.1s 1 both; animation: bounceIn 2s ease 0.1s 1 both; }

.slide2.swiper-slide-active .swiper-slide-active .des-brand { -webkit-animation: bounceIn 2s ease 0.6s 1 both; -moz-animation: bounceIn 2s ease 0.6s 1 both; -o-animation: bounceIn 2s ease 0.6s 1 both; animation: bounceIn 2s ease 0.6s 1 both; }

.active-circle .brand-img { -webkit-animation: jackInTheBox 1s ease 0s 1 both; -moz-animation: jackInTheBox 1s ease 0s 1 both; -o-animation: jackInTheBox 1s ease 0s 1 both; animation: jackInTheBox 1s ease 0s 1 both; }

.brand-img { -webkit-animation: zoomOut 1s ease 0s 1 both; -moz-animation: zoomOut 1s ease 0s 1 both; -o-animation: zoomOut 1s ease 0s 1 both; animation: zoomOut 1s ease 0s 1 both; }

.circle-hover .circle-name { -webkit-animation: jackInTheBox 1.0s ease 0s 1 both; -moz-animation: jackInTheBox 1.0s ease 0s 1 both; -o-animation: jackInTheBox 1.0s ease 0s 1 both; animation: jackInTheBox 1.0s ease 0s 1 both; }

.circle-hover.active-circle .circle-name { display: none !important; }

.slide2 #car-ad-menu { animation: bounceOutRight 1s ease 0s 1 both; }

.slide2.swiper-slide-active #car-ad-menu { animation: bounceInLeft 1s ease 0s 1 both; }

.news-animation .text-des h2, .news-animation .text-des .car-text { opacity: 0; -webkit-transition: 0.3s all ease-out 0.3s; -o-transition: 0.3s all ease-out 0.3s; -moz-transition: 0.3s all ease-out 0.3s; transition: 0.3s all ease-out 0.3s; }

.slide3.swiper-slide-active .swiper-slide-active .news-animation .text-des h2, .slide3.swiper-slide-active .swiper-slide-active .news-animation .text-des .car-text { opacity: 1; }

.news-animation .text-des .h2-2 { -webkit-transition-delay: 0.6s; -moz-transition-delay: 0.6s; -o-transition-delay: 0.6s; transition-delay: 0.6s; }

.news-animation .text-des .car-text { -webkit-transition-delay: 0.8s; -moz-transition-delay: 0.8s; -o-transition-delay: 0.8s; transition-delay: 0.8s; }

.slide3.swiper-slide-active .news-animation .swiper-slide-active .h2-1 { -webkit-animation: lightSpeedIn 1.0s ease 0.5s 1 both; -moz-animation: lightSpeedIn 1.0s ease 0.5s 1 both; -o-animation: lightSpeedIn 1.0s ease 0.5s 1 both; animation: lightSpeedIn 1.0s ease 0.5s 1 both; }

.slide3.swiper-slide-active .news-animation .swiper-slide-active .h2-2 { -webkit-animation: lightSpeedIn 1.0s ease 0.8s 1 both; -moz-animation: lightSpeedIn 1.0s ease 0.8s 1 both; -o-animation: lightSpeedIn 1.0s ease 0.8s 1 both; animation: lightSpeedIn 1.0s ease 0.8s 1 both; }

.slide3.swiper-slide-active .news-animation .swiper-slide-active .car-text { -webkit-animation: lightSpeedIn 1.0s ease 1.1s 1 both; -moz-animation: lightSpeedIn 1.0s ease 1.1s 1 both; -o-animation: lightSpeedIn 1.0s ease 1.1s 1 both; animation: lightSpeedIn 1.0s ease 1.1s 1 both; }

.slide3 .h2-1, .slide3 .h2-2, .slide3 .car-text { -webkit-animation: fadeOutLeft 0.5s ease 0s 1 both; -moz-animation: fadeOutLeft 0.5s ease 0s 1 both; -o-animation: fadeOutLeft 0.5s ease 0s 1 both; animation: fadeOutLeft 0.5s ease 0s 1 both; }

.slide3.swiper-slide-active .news-animation .swiper-slide-active .showcar-pic { -webkit-animation: zoomIn 1.0s ease 1.4s 1 both; -moz-animation: zoomIn 1.0s ease 1.4s 1 both; -o-animation: zoomIn 1.0s ease 1.4s 1 both; animation: zoomIn 1.0s ease 1.4s 1 both; }

.slide3 .showcar-pic { -webkit-animation: zoomOutLeft 0.7s ease 0s 1 both; -moz-animation: zoomOutLeft 0.7s ease 0s 1 both; -o-animation: zoomOutLeft 0.7s ease 0s 1 both; animation: zoomOutLeft 0.7s ease 0s 1 both; }

.slide3.swiper-slide-active .swiper2-pagination { -webkit-animation: bounceInLeft 1.5s ease 0.3s 1 both; -moz-animation: bounceInLeft 1.5s ease 0.3s 1 both; -o-animation: bounceInLeft 1.5s ease 0.3s 1 both; animation: bounceInLeft 1.5s ease 0.3s 1 both; }

.slide4.swiper-slide-active .form-consult { -webkit-animation: bounceInLeft 2s ease 0s 1 both; -moz-animation: bounceInLeft 2s ease 0s 1 both; -o-animation: bounceInLeft 2s ease 0s 1 both; animation: bounceInLeft 2s ease 0s 1 both; }

.slide4.swiper-slide-active .form-consult .form-header { -webkit-animation: bounceInRight 1.5s ease 0.2s 1 both; -moz-animation: bounceInRight 1.5s ease 0.2s 1 both; -o-animation: bounceInRight 1.5s ease 0.2s 1 both; animation: bounceInRight 1.5s ease 0.2s 1 both; }

.slide4.swiper-slide-active .form-consult .from-consult-list { -webkit-animation: bounceInRight 1.5s ease 0.4s 1 both; -moz-animation: bounceInRight 1.5s ease 0.4s 1 both; -o-animation: bounceInRight 1.5s ease 0.4s 1 both; animation: bounceInRight 1.5s ease 0.4s 1 both; }

.slide4.swiper-slide-active .form-consult .form-submit { -webkit-animation: bounceInRight 1.5s ease 0.8s 1 both; -moz-animation: bounceInRight 1.5s ease 0.8s 1 both; -o-animation: bounceInRight 1.5s ease 0.8s 1 both; animation: bounceInRight 1.5s ease 0.8s 1 both; }

.slide4.swiper-slide-active .form-consult .line-agreement { -webkit-animation: bounceInRight 1.5s ease 1.2s 1 both; -moz-animation: bounceInRight 1.5s ease 1.2s 1 both; -o-animation: bounceInRight 1.5s ease 1.2s 1 both; animation: bounceInRight 1.5s ease 1.2s 1 both; }

.slide4 .form-consult { -webkit-animation: bounceOutLeft 1.5s linear 0s 1 both; -moz-animation: bounceOutLeft 1.5s linear 0s 1 both; -o-animation: bounceOutLeft 1.5s linear 0s 1 both; animation: bounceOutLeft 1.5s linear 0s 1 both; }

.nav-content { height: 0; -webkit-transition: all 1s linear; -o-transition: all 1s linear; -moz-transition: all 1s linear; transition: all 1s linear; }

.nav-hover .nav-content { height: 230px; }