@charset "utf-8";
body{font-family: "Microsoft YaHei";}
.content{width:83.33%;min-width: 1200px;max-width:1920px; margin: 0 auto;}
i,em,b{font-style: normal;}


.tit{font-size:52px;color:#333; text-align:center; font-weight:bold;}
.tit a{ display:block; color:#333;}
.tit em{ display:block; font-size:22px;padding-top:6px; font-weight:normal; padding-bottom:25px; background:url(../images/line.png) no-repeat center bottom;}

/**/
.number{ height:135px; border-bottom:1px solid #e5e5e5; overflow:hidden; margin-top:45px;}
.number li{ font-size:18px; float:left; color:#838383; width:28.33%;}
.number li span{ display:block; color:#18288a; font-size:48px;}
.number li span em{ font-size:18px;}
.number li:last-child{ float:right; width:15%;}
@media (max-width: 1680px) {
.number li{width:27.33%;}
.number li:last-child{ width:18%;}
}
/**/
.guide{ position:relative; margin:110px 0 0; height:770px; background:url(../images/guide_bg.jpg) no-repeat center bottom;}
.guide_w{ width:28.3125%; float:left; margin-top:6.75rem;}
.guide_w h5 img{ display:block; width:100%;}
.guide_w p{ width:80.573%; margin-top:1.875rem; font-size:16px; line-height:30px; color:#666;}
.guide dl{ position:relative; width:40.5625%; float:left; margin-left:2%; }
.guide dt{ float:left;float:left; border-radius:20rem;position:relative;}
.guide img{ display:block; width:100%;}
.guide dt em{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../images/guide_v.png) no-repeat center center;}
.guide dd{ width:39.44%; position:absolute; bottom:0; left:-10%;}

.guide ul{ margin-top:6.75rem; width:25%; float:right; border-top:1px solid #e5e5e5;}
.guide li img{ display:block; float:left; width:4.4375rem; height:4.4375rem;transition:all .3s linear 0s}
.guide li{ padding:1.5rem 0; border-bottom:1px solid #e5e5e5;transition:all .3s linear 0s}
.guide li span{ display:block; width:71.25%; float:right;}
.guide li em{ display:block; font-size:24px; color:#333;}
.guide li i{ display:block; font-size:16px; line-height:30px; color:#666; margin-top:1rem;}
.guide li:hover{border-bottom:1px solid #18288a;transform:translateY(-6px)}
.guide li:hover em{ color:#18288a; font-weight:bold;}
.guide li:hover img{transform:rotateY(180deg)}
@media (max-width: 1680px) {

}
@media (max-width: 1440px) {
.guide{ height:670px;}	
}
@media (min-width: 1200px) and (max-width: 1400px) {

}
/**/
.liny{ background:#f7f7f7; position:relative; min-width:1200px; max-width:1920px; width:100%; overflow:hidden; padding:100px 0 0; margin:0 auto;}
.liny_con{}
.liny_con dl{ position:relative; margin-top:34px;}
.liny_con dt img{ display:block; width:100%;}
.liny_con dd{ position:absolute; top:8.125rem; left:8.33%; width:26%;}
.liny_con dd h3 a{ display:block; font-size:42px; color:#fff; font-weight:bold;}
.liny_con dd p{ font-size:16px; line-height:30px; color:#fff; padding:1.4rem 0 2.4rem;}
.liny_con dd span{ display:block; font-size:18px; color:#fff;}
.liny_con dd span em{ display:inline-block; position:relative; padding:0 30px 0 16px;}
.liny_con dd span em:before{ content:""; position:absolute; top:9px; left:0; width:4px; height:4px; border:2px solid #fff; border-radius:5px;}
.liny_con dd b{ display:block; margin-top:2.625rem; width:157px; height:50px; background:url(../images/liny_btn.png) no-repeat; font-size:18px; line-height:50px; color:#fff;transition:all .3s linear 0s;}
.liny_con dd b a{ display:block; color:#fff; padding-left:60px; font-weight:normal;}
.liny_con dd b:hover{transform:translateY(-6px)}
.liny_tit{ height:11.875rem; border-top:1px solid rgba(255,255,255,0.3); position:relative; margin-top:-11.875rem; z-index:2; background: url(../images/liny_bg.png) no-repeat center bottom; background-size:100% 100%;}
.liny_tit li{ width:25%; height:11.875rem; float:left; border-right:1px solid rgba(255,255,255,0.3); box-sizing:border-box; font-size:28px; text-align:center;}
.liny_tit li a{ display:block; color:#fff; height:9.75rem; position:relative;}
.liny_tit li a:before{ content:""; position:absolute; bottom:0; left:50%; width:34px; height:2px; background:rgba(255,255,255,0.3); margin-left:-17px;}
.liny_tit li em{ display:block; font-size:36px; padding:2.5rem 0 0.5rem;}
.liny_tit li:hover,.liny_tit .cur{ background:rgba(24,40,138,0.9);transition:all .3s linear 0s;}
@media (max-width: 1680px) {
.liny_con dd{ top:8.125rem; }
}
@media (max-width: 1440px) {
.liny_con dd{ top:6.125rem; }
.liny_tit{ height:9rem; margin-top:-9rem;}
.liny_tit li{ height:9rem;}
.liny_tit li em{font-size:32px; padding:1.5rem 0 0.5rem;}
.liny_tit li a{ height:7.75rem; }
}
/**/
.case{ position:relative; min-width:1200px; max-width:1920px; width:100%; overflow:hidden; margin:120px auto 0; }
.case_tit{ width:1200px; margin:34px auto; height:85px;}
.case_tit li{ width:20%; float:left; border-right:1px solid #e6e6e6; box-sizing:border-box; font-size:22px; text-align:center;}
.case_tit li:last-child{ border:0;}
.case_tit li em{ display:block; width:46px; height:46px; margin:0 auto 17px;}
.case_tit li a{ display:block; color:#333;}
.case_tit li a:hover{ color:#18288a; font-weight:bold;}
.case_tit li:hover{ margin-top:-10px;-webkit-transition: 1s;-moz-transition: 1s;transition: 1s;}
.case_con li{ width:33%; float:left; margin:0 0.46% 0.625rem 0; position:relative; overflow:hidden;}
.case_con li:before{content: '';
            cursor: pointer;
            position: absolute;
            left: -100%;
            top: 0;
            width: 100%;
            height: 100%;
            background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            transform: skewx(-25deg);}
.case_con li:hover:before{left: 100%;
            -moz-transition: 1s;
            -o-transition: 1s;
            -webkit-transition: 1s;
            transition: 1s;}
.case_con li img{ display:block; width:100%;}
.case_con li em{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../images/case_v.png) no-repeat center center;}
.case_con li span{ display:block; position:absolute; bottom:0; left:0; width:100%; height:3.75rem; background:url(../images/case_bg.png) no-repeat center bottom; background-size:100 100%; text-align:center; color:#fff; padding-top:4.375rem; line-height:3.75rem; font-size:18px;}
.case_con li:nth-child(3n){ margin-right:0;}
.case_con li:hover span{font-weight:bold;}

.case h5{ margin:45px 0 60px; text-align:center; font-size:18px; color:#333;}
.case h5 a{ display:block; width:160px; height:53px; border-radius:40px; background:#f7a413; font-size:18px; text-align:center; line-height:53px; color:#fff; margin:0 auto; font-weight:normal;transition:all .3s linear 0s;}
.case h5 span{ font-weight:normal; display:inline-block; background:url(../images/case_lx.png) no-repeat left 13px; padding-left:35px; margin-top:12px;}
.case h5 span em{ font-size:28px; font-weight:bold;}
.case h5 a:hover{transform:translateY(-6px)}



/**/
.g_pro{ background:#f7f7f7; padding:78px 0 0;min-width:1200px; max-width:1920px; width:100%; overflow:hidden; margin:0 auto;}
.pro{ margin-top:49px;display: flex;justify-content: flex-start;flex-wrap: initial;overflow: hidden;}
.g_pro dl{ width:18.25%; float:left; margin-right:0.625%; overflow:hidden; position:relative;-webkit-transition: 0.8s all;transition: 0.8s all;}
.g_pro dt{ position:relative;overflow:hidden;}
.g_pro dt:before{ content:"";position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7);}
.g_pro dt img{ display:block;object-fit: cover;}
.g_pro dt h5{ width:100%; text-align:center; position:absolute; top:14.2rem; color:#fff; font-size:28px; font-weight:normal;}
.g_pro dt h5 em{ display:block; width:57px; height:52px; margin:0 auto 30px;}
.g_pro dt h5 em img{display:block; width:57px; height:52px;}
.g_pro dt h5 i{ display:block; font-size:16px; color:rgba(255,255,255,0.6); margin-top:15px; padding-top:6rem; background:url(../images/ys_line.png) no-repeat center 1rem; background-size:140px auto;}
.g_pro dl:last-child{ margin-right:0;}
.g_pro dd{ display:none; width:88%; background:#fff; position:absolute; bottom:20px; left:6%;-webkit-transition: 1s;-moz-transition: 1s;transition: 1s; height:145px;}
.g_pro dd h3{ width:34%; float:left; text-align:center; font-size:34px; color:#18288a;}
.g_pro dd h3 b{ display:block; font-size:110px; font-weight:normal; position:relative; margin-top:-40px; line-height:110px;}
.g_pro dd p{ width:62.5%; float:right; margin-top:24px; font-size:16px; line-height:30px; color:#333;}
.g_pro dd p span{ display:block; padding-left:18px; position:relative;}
.g_pro dd p span:before{ content:""; position:absolute; top:9px; left:0; width:4px; height:4px; border:2px solid #18288a; border-radius:5px;}
.g_pro .cur{  flex: 1 1 63.3125%;width:63.3125%;-webkit-transition: 1s;-moz-transition: 1s;transition: 1s;}
.g_pro .cur dt h5{ display:none;}
.g_pro .cur dt:before{ width:0; height:0; background:none;}
.g_pro .cur dd{ left:7%; display:block;}

@media (max-width: 1680px) {
.g_pro dd h3{ width:30%;font-size:28px; }
.g_pro dd h3 b{ font-size:100px; }
.g_pro dd p{ width:66.5%;}
}
@media (max-width: 1600px) {

}
@media (max-width: 1440px) {

}
@media (min-width: 1200px) and (max-width: 1400px) {
.g_pro dd p{ font-size:14px; }
}

/**/
.cooper{ padding:130px 0 90px; background:#f7f7f7;min-width:1200px; max-width:1920px; width:100%; overflow:hidden; margin:0 auto;}
.coo_con dl{ margin:34px 0; width:48%; float:left; background:#fff;}
.coo_con dt{ position:relative;}
.coo_con dt img{ display:block; width:100%;}
.coo_con dt em{ display:block; position:absolute; bottom:-65px; right:30px; width:82px; height:97px; background:url(../images/bo.png) no-repeat;}
.coo_con dd{ padding:30px 18% 30px 4%; font-size:24px; color:#333;}
.coo_con dd a{ color:#333;}
.coo_con dd em{ display:block; font-size:16px; color:#666; padding-top:10px;}
.coo_con dl:nth-child(2n){ float:right;}
.coo_arr{ height:50px;}
.coo_tit{ width:80%; float:left; margin-top:21px; height:8px; background:#e6e7ee; border-radius:10px;}
.coo_tit a{ display:block; float:left; width:17%; float:left; border-radius:10px; height:8px;}
.coo_tit .cur{ background:#18288a;}
.coo_l{ cursor:pointer; width:50px; height:50px; background:url(../images/cooper_l.png) no-repeat; float:left; margin:0 6px 0 22px;}
.coo_r{ cursor:pointer; width:50px; height:50px; background:url(../images/cooper_r.png) no-repeat; float:left;}
.coo_arr h5 a{ display:block; width:10%; height:50px; border-radius:50px; float:right; color:#fff; background:#f7a413; text-align:center; line-height:50px; font-weight:normal; font-size:16px;}
.coo_arr h5 a:hover{ background:#18288a;-webkit-transition: 1s;-moz-transition: 1s;transition: 1s;}
/**/

@media (min-width: 1200px) and (max-width: 1400px) {
}

/**/

@media (max-width: 1440px) {}}
@media (max-width: 1400px) {
}
@media (max-width: 1366px) {
}
@media (max-width: 1360px) {
}
@media (min-width: 1200px) and (max-width: 1400px) {
}


/**/
@media (min-width: 1200px) and (max-width: 1400px) {
}
@keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}
100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}
}




/**/
.new{ padding:110px 0;min-width:1200px; max-width:1920px; width:100%; overflow:hidden; margin:0 auto;}
.dy{ margin-top:10px; width:64.6875%;}
.new_tit{ height:88px; font:24px "Microsoft YaHei UI"; font-weight:bold; line-height:88px; overflow:hidden;}
.new_tit a{ color:#333;}
.new_tit em{ float:right; font-size:14px; color:#999; text-transform:uppercase; font-weight:normal;}
.dy1{ width:48.3%; height:39.375rem; background:#f7f7f7; overflow:hidden;}
.dy1 dt{ overflow:hidden;}
.dy1 dt img{ display:block; width:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.dy1 dd{ padding:20px 8%;}
.dy1 dd h3 a{ display:block; font-size:22px; line-height:35px; color:#1a1a1a; font-weight:normal;}
.dy1 dd p{ font:16px "Microsoft YaHei UI"; line-height:30px; color:#737373; margin:11px 0;}
.dy1 dd em{ display:block; font-size:14px; color:#4c4c4c; font-weight:bold;}
.dy ul{ margin:0 8%; border-top:1px solid #e0e0e0; padding-top:20px;}
.dy1 li{ font-size:16px; line-height:32px; overflow:hidden; position:relative;}
.dy1 li a{ color:#333333; padding-left:25px;}
.dy1 li:before{ content:""; position:absolute; top:11px; left:0; width:4px; height:4px; border:2px solid #18288a; border-radius:5px;}
.dy1 li a:hover,.dy1 dl:hover dd h3 a,.faq1 dl:hover dt a{ color:#18288a; font-weight:bold;}
.dy1 dl:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}

.faq{ width:30.9375%;margin-top:10px;}
.faq1{height:35.375rem; background:#f7f7f7; padding:2rem 0; overflow:hidden;}
.faq11{height:35.375rem; overflow:hidden;}
.faq1 dl{ margin:35px 8% 35px 10%;}
.faq1 dt a{ display:block; font-size:22px; color:#333; line-height:35px; position:relative;}
.faq1 dt a:before{ content:""; position:absolute; top:12px; left:-20px; width:4px; height:4px; border:2px solid #18288a; border-radius:5px;}
.faq1 dd{font:16px "Microsoft YaHei UI"; line-height:30px; color:#737373; margin:11px 0;}

@media (max-width: 1440px) {

}
@media (min-width: 1200px) and (max-width: 1400px) {
	
}

/**/
.about{ background:#fafaf9 url(../images/about.jpg) no-repeat center top; padding:7.5rem 0 0 ;min-width:1200px; max-width:1920px; width:100%; overflow:hidden; margin:0 auto;}
.about dd{ width:61.25%;}
.about dd h3 em{ display:block; font-size:52px;}
.about dd h3 a{ display:block; font:24px "Microsoft YaHei UI"; font-weight:bold; color:#fff; line-height:50px;}
.about dd p{ margin:2rem 0 3rem; font-size:18px; line-height:30px; color:#fff;}
.about dd span{ display:block;width:157px; height:50px; background:url(../images/liny_btn.png) no-repeat; font-size:18px; line-height:50px; color:#fff;}
.about dd span a{ display:block; color:#fff; padding-left:60px; font-weight:normal;}
.about dt{ margin-top:6.125rem; position:relative;}
.about dt img{ display:block; width:100%;}
.about dt em{ display:block; width:100%; height:70px; position:absolute; bottom:0; left:0;}
.about dt em img{width:30.875%; margin:0 auto; display:block;}
@media (max-width: 1680px) {
.about dd h3 em{ font-size:48px;}
}
@media (max-width: 1600px) {

}
@media (max-width: 1440px) {
	.about dd h3 em{ font-size:40px;}
}

/*友情链接*/
.g_link{ font:16px "Microsoft YaHei UI"; line-height:60px; position:relative; margin-top:-100px;}
.g_link p{ width:60%;}
.g_link a{color:rgba(255,255,255,0.6); display:inline-block; padding-right:25px;}
.g_link a:hover{ text-decoration:underline; color:#fff;}

@media (min-width: 1200px) and (max-width: 1400px) {
	.number .content,.guide .content,.cooper .content,.oem .content,.new .content,.about .content,.g_link .content,.sou .content,.pic .content{ width:1200px; margin:0 auto;}
	}


@-webkit-keyframes spin{
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*animation*/
@-webkit-keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}