﻿@charset "UTF-8";
*{padding: 0; margin: 0;}
html{background: #f5f5f5; height: 100%;}
body{color:#525151; font-family: "微软雅黑"; min-height: 100%; outline:0;font-size:14px; }
li,ul{list-style:none}
 input::-webkit-input-placeholder { color: #ccc; }
a{color:#525151;text-decoration:none;background-color:transparent; text-decoration: none!important;}
a:hover,a:focus{outline:0; text-decoration:none; color:#333}
p,ol,h1,h2,h4,h5,h3,ul { margin: 0; padding: 0;} 
img{max-width: 100%;}
.menubtn{float: right; margin-right: -10px; display: none;  height: 36px;}
.menubtn{  padding:0 10px;}
.menubtn span,.menubtn span:before,.menubtn span:after{width:24px; height:2px; border-radius: 10px; background: #666666; transition: all 0.5s;}
.menubtn span{width:30px; margin-top: 17px;}
.menubtn span{  display:block; position: relative;}
.menubtn span:before{position: absolute; content: ""; top: -8px;}
.menubtn span:after{position: absolute; content: ""; bottom: -8px;}
.menubtn.active span{background: 0;}
.menubtn.active span:before{ transform: rotate(45deg); top: 0;}
.menubtn.active span:after{transform: rotate(-45deg);bottom: 0;}

.head{padding-top: 30px ;padding-bottom: 30px;}
.menu{ background: #e5e5e5;}
.menu ul{display: flex; justify-content: space-between; margin-bottom: 0;}
.menu ul li{ width: 100%; }
.menu ul a{display: block; padding:10px 0;color: #333; text-align: center;}
.menu li.active a{ background: #fcd006;}
.menu li:hover a{ background: #ddd;}

.banner1{ display: flex; align-items: center; height: 509px; justify-content: center; overflow: hidden;}
.banner1 img{height: 100%; width: 100%; object-fit: cover; max-width:inherit; }

.titall{position: relative; width: 100%; max-width: 1200px; margin: 80px auto  60px auto; display: flex; align-items: flex-end; justify-content: center;}
.titall span{ width: 100%; height: 2px; border-bottom: 1px solid #eee; margin-bottom: 5px; position: relative;}
.titall span::before{content: ""; width: 40px; height: 2px; background: #555; position: absolute;}
.titall span:first-child:before{right: 0;}
.titname{flex-shrink: 0; text-align: center;font-size: 32px;}
.titname h3{ line-height: 100%; margin: 0; padding: 0 30px;font-size: 32px;}
.titname h3 i{  color: #5275f7; font-style: normal;}
.titname .titen{color: #999; font-family:Verdana, Geneva, Tahoma, sans-serif; font-weight: lighter;text-transform : uppercase}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev{right: 0px;}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{left: 0px;}
.leftmenu{ border: 1px solid #ddd;}
.leftmenu li{ border-bottom: 1px solid #ddd;}
.leftmenu li>a{ line-height: 60px; font-size: 16px; color: #111; padding: 0 20px 0 70px;position: relative;}
.leftmenu li>a:before{position: absolute; content: ""; width: 23px; height: 23px; background: url(../images/dot1.png) no-repeat; left: 35px; top: 0px; transform: rotate(90deg); transition: all .5s;}
.leftmenu li>a.active:before{transform: rotate(0deg);}
.leftmenu .smenu{padding: 0 70px 15px 70px; margin-top: -10px; }
.leftmenu .smenu a{display: block; color: #666; padding: 3px 0;}

.tabs{display: block; overflow: hidden; border-bottom: 1px solid #e1e1e1;}
.tabs li{float: left; margin-right: 3px;}
.tabs li a{ display: block; border-radius: 2px 2px 0 0; background: linear-gradient(#e6e6e6, #e6e6e6 50%,#e1e1e1 51%); padding: 8px 40px;}
.tabs li.active a{ background: linear-gradient(#2e7ecd, #2e7ecd 50%,#0968c4 51%); color: #fff; }
.tabs div a{ padding: 8px 0; display: block; font-size: 12px; color: #0968c4;}
.pordlist{padding-top: 15px;}
.pordlist  .pordtextnav{padding: 10px 10px 10px 10px; line-height: 200%;text-indent: 2em}
 .pordtextnav h2{padding: 20px 0; font-size: 24px;text-align:center }
 .pordtextnav p{ padding: 10px 0; line-height: 160%;text-indent: 2em}
.pordlist span{ display: inline-block; border-radius: 2px;transition: all .5s; font-size: 12px; color: #204a9e; background: #dedede; padding: 5px 10px; margin-top: 10px;}
.pordlist a{ display: block; text-align: center; margin: 10px 0;}
.pordlist a:hover span{ background: #204a9e; color: #fff;}
.pordlist a:hover .imgbox img{  transform: scale(1.1);}
.pordlist .imgbox{ height:185px; overflow: hidden;}
 .imgbox img{width: 100%; height: 100%; object-fit: cover; transition: all .5s;}

.tabs01{ overflow: hidden;}
.tabs01 li{ width: 50%; float: left; padding: 0 10px 10px 0;}
.tabs01 li:nth-child(even){ padding-right: 0;}
.tabs01 li a{ display: block; border: 1px  solid #222; padding: 8px 10px 8px 20px;}
.tabs01 li a:hover{ background: #f5f5f5;}
.tabs01 li.active a{border: 1px solid #204a9e; background: #204a9e;}
.tabs01 li.active a *{color: #fff;}
.tabs01 li a span{font-size: 12px; color: #999;}
.tabs01 li a p{color:#111; font-size: 16px; background: url(../images/dot2.png) 100% center no-repeat;}
.tabs01 li span,
.tabs01 li p{ display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}


.imglist1 .imgbox{ height: 325px;}
.foot{background: #3f4f8c; padding: 50px 0; margin-top: 50px;}
.foot p{color: #fff; line-height: 160%;}
.foot p a{color: #fff; line-height: 160%;}


.faqtit{ background: #255be4; color: #fff; padding: 15px;} 
.faqtit h3{font-size: 16px; padding-bottom: 5px; }
.faqtit p a{ float: right; color: #fff;font-size: 12px;}
.faq ul{border: 1px solid #ddd; padding: 15px 20px;}

.faq ul li{ border-bottom: 1px dotted #aaa; padding: 20px 0;}
.faq ul li:last-child{border: none;}
.faq ul li p{ position:relative; margin-bottom:10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.faq ul li p::before{ background: #5275f7;margin-right: 8px; line-height: 100%; border-radius: 2px; color: #fff;padding: 5px; font-size: 12px; display: inline-block;}
.faq ul li p:nth-child(1):before{ background: #6a6a6a;content: "问";}
.faq ul li p:nth-child(2):before{ background: #255be4;content: "答";}
.faq ul li a:hover p{color: #5275f7;}
.newstit{ line-height: 100%; border-left: 2px solid #5275f7; padding-left: 10px; font-size: 20px; }
.newstit a{ float: right; color: #5275f7;font-size: 12px;}

.news li a{ display: block; border-bottom: 1px dotted #aaa; padding:38px 0; position: relative;}
.news li a:hover p{ color: #5275f7;}
.news li p{color: #222; font-size: 18px; padding-bottom: 10px; overflow: hidden; padding-right: 100px; text-overflow: ellipsis; white-space: nowrap;}
.news li ol{color: #888;overflow: hidden; padding-right: 100px; text-overflow: ellipsis; white-space: nowrap;}
.news a span{position: absolute; right: 0; background: #eee; bottom:0; padding: 10px 30px; font-family: Arial, Helvetica, sans-serif; font-weight: lighter;}
.news a span i{ display: block; text-align: center; font-size: 48px; font-style: normal; line-height: 100%;}

.tabs02 { display: flex; justify-content:center; align-items: center; margin-bottom: 30px;}
.tabs02 li{width: 20%;}
.tabs02 a{display: flex; margin: 0 auto; align-items: center; justify-content: center; text-align: center; background: url(../images/tabg1.png) no-repeat center center; background-size: 100%; width: 110px; height: 110px;}
.tabs02 a p{color: #111;}
.tabs02 a span{display: block; font-size: 10px; color: #999;}
.tabs02 li.active a{background: url(../images/tabg2.png) no-repeat center center; background-size: 100%; }

.process{position: relative;}
.process .swiper_btn{ display: none;}
.swiper03 .swiper-wrapper{ display: flex;justify-content: space-between; }
.swiper03 .swiper-slide{flex-shrink: inherit; width: auto;}
.swiper03 .swiper-slide .liuc{position: relative;}
.swiper03 .swiper-slide .liuc:before{ position: absolute; content: ""; background: url(../images/arrow.png); width: 40px; height: 27px; right: -80px; top: 50%; margin-top: -25px;}
.swiper03 .swiper-slide p{text-align: center; font-size: 18px; padding-top: 15px;}

.factory{display: flex;}
.factoryleft{width: 60%;height: 450px; background-color: #b8b8b8;}
.factoryleft img{width: 100%; height: 100%; object-fit: cover;}
.factoryright{width: 40%; background: #404040; height: 450px; padding: 70px 30px; color: #fff;}
.factoryright h3{ font-size: 30px; display: inline-block; border-bottom: 3px solid #5173f0; margin-bottom: 30px; padding-bottom: 10px;}
.factoryright ol{font-size: 20px; line-height: 150%; height: 200px; overflow: hidden;}
.factoryright  a{display: inline-block; font-size: 20px ; padding: 10px 30px; background: #545454; color: #fff;}
.factoryright  a:hover{ background: #5173f0;}

.bgbox{ padding: 50px 0;}
.bg1{background: url(../images/bg1.jpg) no-repeat center center;}
.bg2{background: url(../images/linkbg.png) no-repeat center center;}
.bg3{background: url(../images/bg3.jpg) no-repeat center center;}
.bg4{background: url(../images/bg4.jpg) no-repeat center center; background-size: cover;}
.bg5{background: url(../images/bg5.jpg) no-repeat center center;}

.process,.factory,.swiper01{margin-bottom: 50px;}
.swiper02 .swiper-slide{box-shadow: 5px 5px 10px rgba(0,0,0,.1);}
.swiper-slide-shadow-left,.swiper-slide-shadow-right{display: none;}
.swiper01 p{ position: absolute; bottom: 0; left: 0; text-align: center; color: #fff; background: rgba(82,117,247,.6); width: 100%; padding: 5px;}
.swiper01 .swiper-slide-active{box-shadow: 0 0 15px rgba(0,0,0,.1);}
.swiper01,.swiper03,.pordlist{padding-bottom: 30px;}
.swiper01  .swiper-pagination,.swiper03 .swiper-pagination{bottom:0px;}
.tel{float: right; padding-top: 7px;}
.fixbox{ background: url(../images/service.png) no-repeat; width: 195px; height: 388px; position: fixed; right: -170px; top: 50%; margin-top: -200px; transition: all .5s;}
.fixbox:hover{ right: 0;}
.fixbox ul{padding-left: 45px; padding-right: 15px; padding-top: 80px;}
.fixbox li {padding: 8px 0;}
.fixbox li a{ display: block; background: #fff; border-radius: 5px; text-align: center; padding: 7px 0;}
.fixbox li a:hover{ background: #caedff; color: #5275f7;}
.next01,.prev01{margin-top: -55px;}
.pagination .active a{  background: #6787f8; color: #fff;}
.textnav h2{padding: 20px 0; font-size: 24px;}
.textnav p{ padding: 10px 0; line-height: 160%;text-indent: 2em}


.g-kefu{ width:100%; background:#5275f7; position:fixed; bottom:0; z-index:101; height:55px; display: none;}
.g-kefu ul li{ width:25%; text-align:center; float:left; padding:8px 0 5px 0; position:relative;}
.g-kefu ul li:before{ position:absolute; content:""; width:1px; height:100%; background:#5b7efa; top:0; right:1px;}
.g-kefu ul li:after{ position:absolute; content:""; width:1px; height:100%; background:#496ceb; top:0; right:0;}
.g-kefu ul li:last-child:before,.g-kefu ul li:last-child:after{ background:none;}
.g-kefu ul li em{ width:24px; display:block; margin:0 auto;}
.g-kefu ul li a{ font-size:14px; color:#fff;}
.swiperbanner .swiper-pagination-bullet{ background: #fff; opacity: .8;}
.swiperbanner .swiper-pagination-bullet-active {
    opacity: 1;
    background: #007aff;
}
@media (max-width:1000px) {
    .g-kefu{display: block;}
    .foot{padding-bottom:100px;}
    .swiper-button-next,.swiper-button-prev{ transform: scale(.6);}
    .tabs01 li a span{font-size: 10px;}
    .tabs02 a{width: 100px; height: 100px;}
    .tabs02 li{width: auto;}
    .factory{display: block;}
    .tabs02{justify-content: space-between;}
    .factoryleft,.factoryright{width: 100%; height: 300px;}
    .factoryright h3{font-size: 18px;}
    .factoryright ol{font-size: 14px; height: auto; margin-bottom: 30px;}
    .factoryright a{font-size: 14px;}

    .tabs{margin-top: 30px; margin-left: -5px; margin-right: -5px;}
    .pordlist span{margin-top: 5px; padding: 3px 10px;}
    .pordlist a{ margin: 5px 0;}
    .tabs li{width: 50%; margin: 0; padding: 5px;}
    .tabson{margin:20px 0 0 0;}
    .tabson li{ width: auto; padding: 0;}
    .tabson li a{ padding: 8px 15px;}
    .news{margin-top: 30px;}
    .news a span{padding: 30px 20px;}
    .news a span i{font-size: 30px;}
    .pordlist .row,.imglist1 .row{margin-left:-5px; margin-right: -5px;}
    .pordlist .row [class*=col-xs-],.imglist1 .row [class*=col-xs-]{padding: 0 5px;}
    .pordlist .imgbox,.imglist1 .imgbox{ height: 252px;}
    .process .swiper_btn{ display: block;}
    .swiper03 .swiper-slide{flex-shrink: 0; width: 100%;}
    .swiper03 .swiper-slide .liuc img{ display: block; margin: 0 auto;}
    .swiper03 .swiper-slide .liuc:before{display: none;}
    .foot .logo2{ width: 50%; max-width: 250px; margin: 0 auto;}
    .footcont{padding:25px 0;}
.banner1{height: 200px;}
.titall{margin: 25px auto  25px auto;}
.titname h3{padding: 0 10px;}
.titname,
.titname h3{ font-size: 18px;}
.head{ padding-top: 15px ;padding-bottom:15px;}
 .menubtn{display: block;}
 .tel{ width:100px ; float: left; margin-right: -20px; overflow: hidden; padding-top: 6px; margin-left: 15px;}
 .tel img{margin-left: -25px;}
 .logo{ width: 200px; padding-top: 6px;}
 .menu{display: none;}
 .menu a{border-bottom: 1px solid #ddd;}
 .menu ul{ display: block;}
 .menu .container{padding: 0;}
 .fixbox{display: none;}
 .foot{ text-align: center;}
 .changelg{display: none;}
}
.changelg{ padding: 15px 0 0 50px;}