body,html{ margin: 0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size: 16px; color: #333; position: relative;}
li{list-style: none;}
*{margin:0;padding:0; box-sizing: border-box;}
button,input,textarea{outline:none;font: inherit;    border: none;
    -webkit-appearance: none;
    border-radius: 0;}


input::placeholder,textarea::placeholder{
    color: #888; 
}
a,a:focus,a:hover{text-decoration:none}
@font-face {
   font-family:'NotoSansSC-Regular';
   src:url('../fonts/NotoSansSC-Regular.woff2') format('woff2'),
       url('../fonts/NotoSansSC-Regular.woff') format('woff'),
	    url('../fonts/NotoSansSC-Regular.ttf') format('truetype');
 font-weight: normal;
     font-style: normal;
     font-display: swap;
}
@font-face {
   font-family:'NotoSansSC-Light';
   src:url('../fonts/NotoSansSC-Light.woff2') format('woff2'),
       url('../fonts/NotoSansSC-Light.woff') format('woff');
 font-weight: normal;
     font-style: normal;
     font-display: swap;
}

@font-face {
   font-family:'NotoSansSC-Thin';
   src:url('../fonts/NotoSansSC-Thin.woff2') format('woff2'),
       url('../fonts/NotoSansSC-Thin.woff') format('woff');
    font-weight: normal;
     font-style: normal;
     font-display: swap;
}

header{ position: absolute;width: 100%;  z-index: 1000;top: 0; }
#header.bg{ background: rgba(255, 255, 255, 1);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15)}


.pos_c { padding-top: 90px; text-align: center;}
.pos_c a{  line-height: 90px; font-size: 16px; font-weight: 100; color: #666;}
.pos_con{ background: #f1f1f1; height: 90px;}
.pos_con h2{ font-size: 16px; color: #666;}

.warp90{ max-width: 1920px; padding: 0 7rem;margin: 0 auto;}
.banner img{ width: 100%; height: auto;}
.head_con{ display: flex; justify-content: space-between;align-items: center; }
.headico{ display: flex; position: absolute;right: 10%;}
.language_sub{ display: none;   
    position: absolute;
    left: -15px;
    line-height: 35px}
.yy{ padding-right: 10px;position: relative;}
.y_ico,.search{cursor: pointer;}
.y_ico img,.search img{ width: 20px;}
.yy:hover .language_sub{ display: block;}
.language_sub a{ display: block;   
    text-align: center;
    color: #fff;}

.yy .language_sub a:hover{ color: #3457b1;}

#header.c .language_sub a{ color: #000;}
/*.c .headico.m{position: relative;}*/







.nav ul{ display: flex;}
#header.c .nav ul>li a{color: #000;}
.nav ul  li{ flex: 1; height: 90px; position: relative; padding: 0 50px;}
.nav ul  li a{ display: block; line-height: 90px; font-size: 22px; color: #fff; text-align: center; text-transform: uppercase;}
#header.bg .nav ul  li a{color: #000;}

#header  .nav ul li .sub{    position: absolute;
    background: rgba(255,255,255,0.3);
    padding: 0.5rem 0;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    min-width: 200px;
    -webkit-clip-path: inset(0 0 100% 0);
    clip-path: inset(0 0 100% 0);
    transition: 0.5s;}

#header  .nav ul li:hover .sub{-webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);}

#header  .nav ul li .sub a{ display: block;
    padding: 0 1rem;
    text-align: center;
    line-height: 2.5rem;
    transition: 0.3s;
    font-size: .8rem;
    color: #fff;}
	
#header  .nav ul li .sub a:hover{background: #fff;
    color: #000;}	

   
#header .nav ul li:before{content: "";
    display: block;
    width: 50%;
    height: 3px;
    background: #fff;
    position: absolute;
    left: 20%;
    bottom: 0;
    transform: scaleX(0);
    transition: 0.5s;}
#header .nav ul li:hover:before{    transform: scale(1);}
#header.c .nav ul li .sub{background: #fff;}
#header.c .nav ul li .sub a{color: #000;}
#header  .nav ul li .sub a:hover{background: #f5f5f5;}
.pro_tit{font-size: 36px; font-weight: 300; padding: 50px 0px;font-family:'NotoSansSC-Thin';}
.procon{position: relative;}
.p_more{position: absolute; right: 0; top: 5rem;}
.p_more a{text-transform: uppercase; color: #666; font-size: 14px;}
.h_pro_list{ display: flex;justify-content: space-between; flex-wrap: wrap; }
.h_pro_list .h_li{ width: calc((100% - 5.5rem) / 2);margin-right: 5.5rem;
    float: left;
    margin-bottom: 5.5rem; position: relative;}
.h_pro_list .h_li:nth-child(2n){    margin-right: 0;}
.p_img img{ width: 100%; display: block;}
.p_text{position: relative;}
.p_textcon{ margin-top: 1rem; width:35rem; }
.p_text h2{font-size: 36px; margin-bottom: 1.5rem; text-transform: uppercase;}
.p_text p{font-size: 20px; color: #666666;}
.more{  display: inline-block;
    padding: .8rem 4rem;
    background-color: #3e6ae1;
    color: #fff;
    transition: all .5s;}
.more:hover{ background-color: #3457b1;}
.p_text .more{position: absolute;
    bottom: 0;
    right: 0;}

.home_f{ background: #f7f7f7; padding: 5rem 4rem;}
.home_f h3{ font-size: 36px; font-weight: 100; font-family:'NotoSansSC-Thin'; display: block; width: 60rem;}
.home_fcon{ position: relative;}
.home_fcon .more{ position: absolute; top: 3rem; right: 5rem;}
.carscon{ display: flex; margin-top: 80px; justify-content: space-between;}
.c_textcon{ text-align: center; margin-top: 25px;}
.c_textcon h2{ font-size: 18px; font-weight: 400; color: #000;}
.cars_li span { display: block; width: 100%; text-align: center;}
.cars_li span a{ color: #999; line-height: 45px;}
.pro .warp90{ max-width:1440px; margin: 0 auto; padding: 0;}
.ny_menu{ width: 20%;}
.ny_menu .email a{    display: block;
    line-height: 60px;
    color: #fff;
    background: #3457b1;
    text-align: center;
    border-radius: 100px;
    margin-top: 40px;}
.prolist{ width: 78%;display: flex;
    flex-wrap: wrap}
.prolist .cars_li{width: 33.3333%; padding: 0 15px 15px;}	
.car_img{height:235px; overflow:hidden}
.car_img img{ width: 100%; display: block; height:100%; object-fit:cover}
.menu_n{ background: #f5f5f5;padding: 0 40px 40px;}
.menu_n a{ display:block; line-height: 70px; border-bottom: 1px rgba(51, 51, 51,0.2)  solid; font-size: 18px; color: #333; }
.menu h2{ font-size: 1.2rem; line-height: 70px; color: #fff; background: #3e6ae1; display: block; padding-left: 30px;}
.menu_n a:hover{ color: #3457b1;border-bottom: 1px #3457b1 solid; }
.menu_n a.active{color: #3457b1;border-bottom: 1px #3457b1 solid; }
.ny_f{margin-bottom: 90px;}
.ny_banner{position: relative;}
.ny_banner .pos{text-align: center; position: absolute; top: 45%; text-transform: uppercase; color: #fff; width: 100%;}
.ny_banner .pos  h2{ display: block; font-size: 35px;}
.pos h2 a{ color:#fff;}

.ny_banner img{ width: 100%; display: block;}
.aboutcon{margin-top: 80px; }
.aboutcon .about1{display: flex; justify-content: space-between;}
.aboutcon .about1 .about1_fl{ width: 45%;}
.aboutcon .about1 .about1_fr{ width: 50%;}
.aboutcon .about1 .about1_fr img{ width: 100%;}  
.about1_fl h3{ font-size: 30px; font-family: "NotoSansSC-Thin";}
.about1_fl p{line-height: 25px; margin-top: 30px;color: #666;}

.about_num ul{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.about_num ul li{flex: 1; padding: 50px 0px;} 
.about_num h5{ font-size: 48px; color:#3457b1;}
.about_num span{color:#666;}
.about_num h5 span{ color:#3457b1;}
.case_con h2{ font-size: 36px; text-align: center; text-transform: uppercase; margin-bottom: 20px;}
.case_text{    background: #f1f1f1;padding: 20px;}
.case_text p{font-size: 20px;
    line-height: 35px;
    font-weight: 600;}
.case_date{    font-size: 16px;
    color: #666;
    margin-top: 5px;
    display: block;}	
.c_more{    color: #333;
    text-align: center;
    width: 100%;
    display: block;
    margin-top: 50px;}
.c_more a{padding:.8rem 4rem; background: #f1f1f1; color: #333;}
.c_more a:hover{background: #3457b1; color: #fff;}
.about_case{ background: #f9f9f9; padding: 80px 0px;}

.case_list{ display: flex;}
.case_li img{ width: 100%; display: block; height:100%;object-fit:cover}
.case_img{height:300px; overflow:hidden;}

.faq{ width: 78%;}
.faq_t{ margin-bottom: 60px;}
.faq_t p{ font-size: 16px; color: #666;line-height: 30px;}
.faq_t  h2{ font-size: 32px; color: #333; margin-bottom: 25px;}
.faq_li{ padding: 30px 20px; box-shadow: 0px 0px 15px #ddd;  margin-bottom: 25px;}
.faq_tit,.faq_a{ display: flex;}
.faq_tit span{    width: 25px;
    height: 25px;
    background: #3e6ae1;
    text-align: center;
    line-height: 25px;
    color: #fff;
    border-radius: 5px;}
.faq_tit h3{padding-left: 20px;}
.faq_a{ margin-top: 20px;}

.faq_a span{    width: 25px;
    height: 25px;
    background: #aaa;
    text-align: center;
    line-height: 25px;
    color: #fff;
    border-radius: 5px;}
.faq_a_con{ width: calc(100% - 45px); padding-left: 20px; color: #666; line-height: 25px;}	
.lx{ margin-top: 80px; display: flex;justify-content: space-between;}
.lx_t h2{ font-size: 36px; display: block; position: relative; padding-bottom: 20px;}
.lx_t h2::after{position: absolute; width: 100px; height: 10px; background: #3457b1; bottom: 0; left: 0; content: "";}
.lx_t h3{ font-size: 36px; padding: 20px 0px;}	
.lx_fl{ width: 45%;}
.lx_fr{ width: calc(100% - 50%); padding: 50px 30px; border:1px #b4b4b4 solid}
.lx_con .p{ line-height: 25px; margin-bottom: 20px; font-size: 24px;}	
.inquiry-form input{ display: block; line-height: 60px; padding-left: 10px;width: 100%;    border-bottom: 1px solid #E9E9E9;}
.inquiry-form{ margin-top: 50px;}
.inquiry-form textarea{    border-bottom: 1px solid #E9E9E9; height: 200px; padding-top: 20px; width: 100%; padding-left: 10px;
    resize: none;}
	
#tj{ padding: 20px 40px; background: #3457b1; color: #fff; margin-top: 20px; font-size: 18px; font-weight: 600;}	
.lx_con{ margin-top: 50px;}
.lx_map{ margin-bottom: 90px;}
.cars_img{ width: 50%;}
.cars_img img{ width: 100%;}
.cars_text{ width: 45%;}
.cars_text .c_tit{    padding: 20px;}
.c_tit h2{  font-size: 36px; margin-bottom: 20px;}  
.c_tit p{    line-height: 30px;color: #666; padding-bottom: 50px; border-bottom: 1px #ddd solid;}
.c_num ul{ display:flex; justify-content: space-between;flex-wrap: wrap;}
.c_num ul li{ width: 33.333%; padding: 20px;}
.c_num ul li h3{font-size: 30px;}
.c_num ul li span{    color: #666;
    margin-top: 10px;
    display: inline-block;
    padding-bottom: 5px;
    border-bottom: 1px #ddd solid;}
.pro-btn{ display: flex; margin-top: 50px;}
.pro-btn a{    background: #3e6ae1; width: 200px;
    border-radius: 40px;
    color: #fff;
    text-align: center;
    height: 60px;
    line-height: 60px;
    display: inline-block;}
.pro-btn a:hover{background: #3457b1;}	
.pro-btn a:last-child	{    background: #2b2b2b;
	    margin-left: 2%;}
.pro-btn a:last-child:hover{background: #3457b1;}
footer{ height: 90px;}
footer p{line-height: 90px; text-align: center;}
.pro_xq{ margin-top: 100px;}
.pro_xq .xq_c{ font-size: 2rem;font-weight: 600;    text-align: center;
    margin-bottom: 50px;}
.xqcon img{max-width: 100%;}
.caselist{display: flex; flex-wrap: wrap; justify-content: space-between;}
.caselist .case_li{ width:calc(33.333% - 40px);  margin: 0 20px 20px;background: #f1f1f1; padding-bottom: 50px;}
.caselist .case_li span{    display: block;text-align: center;}
.caselist .case_li span a{    font-size: 14px;
    padding: 10px 20px;
    display: inline-block;
    background: #000;
    color: #fff;
    margin-top: 20px;
    border-radius: 100px;}
.caselist .case_li:hover span a{background: #3457b1;}
.cars_img .mySwiper2 {
      height: 80%;
      width: 100%;
    }

 .cars_img   .mySwiper {
      height: 20%;
      box-sizing: border-box;
      padding: 10px 0;
    }

 .cars_img   .mySwiper .swiper-slide {
      width: 25%;
      height: 100%;
      opacity: 0.4;
    }

 .cars_img   .mySwiper .swiper-slide-thumb-active {
      opacity: 1;
    }

  .cars_img  .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
	
	
.search-dialog-box{    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 12rem;
    z-index:10000000000;
    opacity: 0;
    visibility: hidden;
    transition: .6s;
    /* overflow: hidden; */}
.search-dialog-box.on{    opacity: 1;
    visibility: visible;}
.search-dialog-box .search-bg{    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 0;
    margin: 0;
    background: rgba(0,0,0,.7);
    background-size: cover;
    background-repeat: no-repeat;
    /* z-index: 1; */
    transform-origin: center center;
    transition: height .8s cubic-bezier(.77,0,.175,1);}	
	
.search-dialog-box.on .search-bg{    height: 100vh;}	
.search-dialog-box form{margin: 0 200px; position: relative;}
.pub-close {
    position: absolute;
    width: 3rem;
    height: 3rem;
    z-index: 10;
    right: 1.5rem;
    top: 1.35rem;
    background-color: rgba(255,255,255,.1);
    border-radius: 100%;
}
.pub-close .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color:#f09c3c;
    border-radius: 100%;
    transition: transform .3s;
}
.pub-close i {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  background-position: center;
    background-size: 0.75rem;
    background-repeat: no-repeat;
    background: url(../img/close.png) no-repeat center;
	transition:.6s}
.pub-close i:hover{ transform:rotate(180deg)}
.searchcon{
position: absolute;
    z-index: 100000;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;}
.search-input{ float: left;   width: 50rem;
    margin: 0 auto;
    padding: 0 0.5rem 0 1.5rem;
    background-color: rgba(255,255,255,.1);    position: relative;
    box-sizing: border-box;
    transition: all .3s;
    max-width: 94%;}
.search-input input{
    height: 4.5rem;
    width: calc(100% - 3.5rem);
    background-color: transparent;
    font-size: 1.25rem;
    line-height: .5rem;
    color: #fff;
    transition: all .3s;}	
.search-dialog-box:before{content:"";position:absolute;top:0;height:0;background: #000;transition: .6s;left: 0;right: 0;z-index: 1;}
.search-dialog-box.on:before{ height:100%}	
	::placeholder{
	     color: #fff;
	  }
.searchcon button{    position: absolute;
    right: 63px;
    top: 30%;
    width: 32px;
    height: 32px;
    background: url(../img/searchf.png) no-repeat center;
     border: none; 
     box-sizing: border-box; 
     display: block; 
    z-index: 10000;}	
	
.contain-1200{ width: 1200px; margin: auto;}
	
	
	
	
	
	
	
	
	
	
.lx_map img{display: block; width: 100%;}	
	 .navBtn{display: none;}
.web_logo{ display: none;}	 







@media (max-width: 1200px)	{
      video{ width:100% !important; height:auto}
	.pc_logo,.nav{ display: none;}
	.web_logo{display: block;  width: 200px;
    margin-top: 5px;}

	header{ position: relative; height: 50px;}
	.headico{display: none;}
.warp90{max-width: 100%;    padding: 0 1rem}
.pro_tit{font-size: 20px;    padding: 10px 0px;}
footer{height: auto;}
footer p{    line-height: 20px;
    font-size: 12px;
    padding: 10px 0px;
    color: #999;}
.ny_banner .pos h2{font-size: 1rem;}
.carscon{margin-top: 2rem; flex-wrap: wrap;}	
.ny_menu,.prolist{width: 100%;}	
.menu h2{color: #000;background: none;}	
.menu_n a	{    font-size: 1rem;flex: 1;}
.menu_n{    display: flex;     padding: 0 1rem;}
.ny_menu .email a{display: none;}
.prolist{margin-top: 20px;}
.pos_c a{    line-height: 2rem;
    font-size: 1rem;}
.pos_con{height: 2rem;}	
.cars_img,.cars_text{width: 100%;}
.c_num ul li h3{font-size: 1rem;}
.cars_img{padding: 0 20px;}
.lx_fl,.lx_fr{width: 100%;}
.lx{flex-wrap: wrap;margin-top:2rem}
.aboutcon .about1 .about1_fl,.aboutcon .about1 .about1_fr{width: 100%;}
.aboutcon .about1{flex-wrap: wrap;}
.about_num h5 span.counter,.about_num h5{font-size: 2rem;}
.about_num li span{font-size: 12px;}
.aboutcon{margin-top: 2rem;}
.about1_fl h3{font-size: 1.5rem;}
.about1_fl p{line-height: 1.8rem;}
.faq{width: 90%; margin: auto;}
.faq_tit h3{    width: calc(100% - 45px);}
.faq_t h2{font-size: 2rem; margin-top: 2rem;}
.p_text h2{    font-size: 25px;margin-bottom: .3rem;}

.nav_f{display: flex; justify-content: space-between;
    flex-wrap: wrap;}
	
.nav_f a{font-size: 12px !important; padding-right:12px;color: #666; position: relative;}	
.nav_f a::after{position: absolute; right: -4px;top:17px; vertical-align: middle;  width: 1px; height: 15px; background: #ddd; content: "";}	
.nav_f a:last-child::after{ display: none;}
.web_nav{position: absolute;  width:21px; height: 18px; right: 23px;     top: 20px;display: block;}
			.header-btn span.line{
					    width: 100%;
				    height: 2px;
				    position: absolute;
				    left: 0;
				    background-color: #005bac;
				    transition: all .2s;
				    transform-origin: center;
				    display: block;
				}
				 .header-btn .line1{
					    top: 0;
				}
				 .header-btn .line2{
					        top: 50%;
				    margin-top: -1px;
				}
				 .header-btn .line3{
					    bottom: 0;}
						
	.pho-header{
					top:1rem;
					height:calc(100% - 1rem);
				}
				.pho-header ul li dt{
					font-size:0.3rem;
					line-height:1rem;
					margin-bottom:0;
				}
				.pho-header ul li dd{
					font-size:0.26rem;
					line-height:0.8rem;
					padding-left:0.2rem;
				}
				.pho-header ul{
					margin-top:0.2rem;
				}
			.pho-header{
				position:absolute;
				top:50px;
				height: calc(100% - 30%);
			background-color:rgba(255,255,255,0.9);
				left:0;
				width:100%;
				padding-bottom: 50px;
				z-index:100000000;
				display:none;
				padding-bottom: 20px;
				overflow-y: scroll;
				padding-top: 20px;
				box-shadow: 5px 5px 5px 0 rgba(0,0,0,.1);
					height: 100vh;
			}
			.pho-header ul{
				width:87.5%;
				margin: 0 auto;
				
			}
			.pho-header ul li {
				      display: block;
					      line-height: 50px;
						  border-bottom: 1px #ddd solid;
						      padding: 10px 0px;
			}
			.pho-header ul li a{ color: #000;}
			.header-btn.cur .line{
			    top: 50%;
			    bottom: auto;
			    margin-top: -1px;
			
			}
			.header-btn.cur .line1{
			    transform: rotate(45deg);
			}
			.header-btn.cur .line2{
				    opacity: 0;
			    filter: alpha(opacity=0);
			}
			 .header-btn.cur .line3{
				transform: rotate(-45deg);
			}
			
			.pho-header ul{ display: block;}
 
#header.c .logo img{ width:200px;margin-top: 5px;}
.pos_c{padding-top:20px}
.p_textcon{width: 25rem}

.p_text p{font-size:14px}
.p_text .more{    padding: .8rem 2rem;}
.home_fcon .more{position:initial; margin-top:20px}
body,html{font-size:12px}
.home_f h3{font-size:25px}





}
@media (max-width: 768px){
	.h_pro_list .h_li{width: 100%; margin-right: 0;margin-bottom:1rem}
	.p_text .more{position: initial; margin-top: 20px;}
	.home_f{padding: 1rem;}
	.home_f h3{width: 100%;font-size: 20px;}
	.home_fcon .more{position: initial;    padding: 0.5rem 1rem;}
	.p_more{display: none;}
	.prolist .cars_li{width: 50%;}
	.pro-btn a{    height: 2rem; width: auto; padding: 0 2rem;
    line-height: 2rem;}
	.pro_xq{ margin-top: 20px;}
	.caselist .case_li{width: 100%;}
	.p_textcon{ width:100% !important}
}

@media (max-width: 1449px) and (min-width:1201px){
    
    .p_textcon{  width: 23rem;}

     .p_text p{    font-size: 16px;} 
    .p_text .more{    padding: .8rem 2rem;}
    .home_fcon .more{top: 4rem;}
    
}






@media (max-width: 1770px) and (min-width:1450px){
    
   .p_text p{    font-size: 16px;} 
    .p_text .more{    padding: .8rem 2rem;}
     .home_fcon .more{top: 4rem;}
    body,html{font-size:14px}
}

@media (max-width:1200px) and (min-width:1023px){
    
    .p_textcon{  width: 30rem;}
    
    
    
}