@charset "utf-8";

/*Index*/
.banner{overflow:hidden; width:100%; position:relative;}
.banner img{width:100%}
.banner .swiper-slide {}
.banner .swiper-container .swiper-pagination{bottom:5%;left:50%; margin-left:-50px; width:100px;}
.banner .swiper-container .swiper-pagination .swiper-pagination-bullet{margin: 0 5px; display: block;  width: 40px;  border-radius: 4px; height: 5px;  float: left;background:#999}
.banner .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:#0a3387}
.productbox{overflow:hidden; padding:3% 0; }
.productbox h1{font-size: 24px; color:#333}
.productbox .list{overflow:hidden; margin-top:2%;}
.productbox .item{overflow:hidden; position:relative;display:block; float:left; width:23%; margin:1%; font-weight:bold; font-size:13px;}
.productbox .item p{position:absolute; top:0; left:5%; color:#333; line-height:30px; z-index:99}
.productbox .item img{width:100%;  transition: opacity 0.5s; opacity:1;transform: scale(1, 1);}
.productbox .item .img1{opacity:1; z-index:9}
.productbox .item .img2{opacity:0;position:absolute; top:0;}
.productbox .item:hover .img1{opacity:0}
.productbox .item:hover .img2{opacity:1;  }
.productbox .item:hover p{color:#fff}
.productbox .more{background: #f5f5f5;color: #333; display:block; margin:3% auto 0; width:200px; line-height:26px; padding:10px 30px; border-radius:3px; text-align:center; position:relative}
.productbox .more span{font-size:20px;}
.productbox .more::after{content: ''; width: 0; height: 2px; background: #fff; position: absolute;  bottom: 10px; left: 30px; transition: all 0.3s ease-in-out;}
.productbox .more:hover{background-color:#ca2b3d; color:#fff; padding:5px 30px 15px; }
.productbox .more:hover::after { width:140px;}
.productbox .more:hover span { color:#fff}
.productbox .item2{overflow:hidden; position:relative;display:block; float:left; width:390px;}
.productbox .item2:nth-child(2){margin:0 15px}
.productbox .item2 .t{position:absolute; top:5%; left:5%; z-index:9}
.productbox .item2 .t h3{color:#333; font-size:18px; line-height:35px; font-weight:bold;}
.productbox .item2 .t p{color:#666; line-height:20px; }
.productbox .item2 .m{width:100%;transition: all 0.3s ease-in-out;-webkit-transition: all ease-in-out 0.3s;transition: all ease-in-out 0.3s;}
.productbox .item2 .b{position:absolute; bottom:8%; left:5%;z-index:9}
.productbox .item2 .b span{position:relative; color:#333; line-height:30px; display:block;}
.productbox .item2 .b span::after{content: ''; width: 10px; height: 2px; background: #ca2b3d; position: absolute;  bottom: 0; left: 0; transition: all 0.3s ease-in-out;}
.productbox .item2:hover .m{ -webkit-transform: scale(1.05);-moz-transform: scale(1.05);transform: scale(1.05);}
.productbox .item2:hover .b span::after {width:100%;}
.henfubox{width:100%; overflow:hidden; position:relative;}
.henfubox img{width:100%;transition: all 1s ease-in-out;-webkit-transition: all ease-in-out 1s;transition: all ease-in-out 1s;}
.henfubox img:hover{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);transform: scale(1.05);}
.henfubox .text{position:absolute; top:10%; text-align:center; z-index:99}
.henfubox .text h2{color:#fff; font-size:28px; line-height:50px; }
.henfubox .text p{color:#fff; font-size:18px; line-height:28px; }
.companybox{padding:100px 0 120px; position:relative;background-color:#f2f2f2; overflow:hidden}
.companybox .leftbox{width:550px; position:relative;  float:left; }
.companybox .leftbox img {width:100%; height:435px}
.companybox .rightbox{width:600px; text-align:left; float:right; }
.companybox .rightbox h3{ color:#333; font-size:28px; line-height:36px; margin-top:10px; letter-spacing:2px;}
.companybox .rightbox h2{color:#0a3387; font-size:20px; font-weight:bold; line-height:30px; margin-top:30px; margin-bottom:15px; letter-spacing:2px;}
.companybox .rightbox .p1{color:#999; font-size:18px; text-transform:uppercase;  line-height: 20px; text-transform:uppercase}
.companybox .rightbox .p2{color:#333333; font-size:15px; line-height:30px; margin-bottom:10px; }
.companybox .rightbox .more{ background-color:#ca2b3d; padding:10px 15px; font-size:14px; color:#fff; margin-top:20px; border-radius:3px; display:block; float:left}
.newsbox{overflow:hidden; padding:5% 0; background-color:#fff;}
.newsbox .tit{overflow:hidden; margin:auto}
.newsbox .tit h2{position:relative; text-align:center; width:220px; height:50px; border:2px solid #ca2b3d; margin:auto; z-index:1}
.newsbox .tit h2 span{display:block; width:150px; left:50%; margin-left:-75px; color:#ca2b3d; font-size:28px; letter-spacing:2px; line-height:50px; z-index:9; background-color:#fff; position:absolute; bottom:-20px;}
.newsbox .tit p{color:#333; text-align:center; line-height:30px; margin-top:30px;}
.newsbox .boxs{overflow:hidden; margin-top:4%;}
.newsbox .boxs .top{border-bottom:8px solid #f6f6f6; overflow:hidden; padding:10px 0px;}
.newsbox .boxs .top h3{float:left; font-size:18px; color:#333; line-height:30px;}
.newsbox .boxs .top span{float:left; font-size:15px; color:#999; line-height:30px; padding-left:10px;}
.newsbox .boxs .top a{float:right; font-size:13px; color:#999; line-height:30px; }
.newsbox .leftimg{width:270px; float:left}
.newsbox .leftimg img{width:100%;}
.newsbox .cnews{width:420px; float:left; margin-left:45px;}
.newsbox .cnews .list{overflow:hidden; margin-top:20px;}
.newsbox .cnews .list a{background:url(/images/list_li.gif) no-repeat center left; display:block; line-height:30px; padding-left:10px; color:#555}
.newsbox .cnews .list a span{font-size:12px; color:#999; float:right; line-height:30px;}
.newsbox .inews{width:420px; float:left; margin-left:45px;}
.newsbox .inews .list a{display:block; overflow:hidden; padding:10px 0; border-bottom:1px dashed #ddd}
.newsbox .inews .list a:last-child{border:none}
.newsbox .inews .list a img{float:left; width:110px; margin-right:15px;}
.newsbox .inews .list a .tt{float:left;color:#555; width:295px; line-height:30px;}
.newsbox .inews .list a .summary{float:left; font-size:12px; color:#999;width:295px; line-height:20px;}

/*产品*/
.products{overflow:hidden}
.products .imglist{overflow:hidden; margin-top:2%}
.products .item{overflow:hidden; width:31.333%; margin:1% 1% 2%; float:left; border: 1px solid #ddd;}
.products .item img{width:100%;-webkit-transition: all linear 0.4s;transition: all linear 0.4s;z-index: 10;}
.products .item:hover img{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);transform: scale(1.05);}
.products .item p{line-height:40px; text-align:center; color:#333; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.productinfo{overflow:hidden}
.productinfo .imgwrap{width:100%; margin-top:2%; overflow:hidden}
.productinfo .imgwrap .pimg{width:52%; float:left }
.productinfo .imgwrap .summary{width:45%; margin-left:3%;float:left }
.productinfo .imgwrap .summary h1{font-weight:bold; font-size:20px; line-height:30px; border-bottom:1px solid #ddd; padding-bottom:10px; color:#333}
.productinfo .imgwrap .summary p{font-size:15px; line-height:26px; margin-top:15px;}
.productinfo .intro{overflow:hidden; margin-top:5%;}
.productinfo .tab-nav{overflow:hidden; padding:10px 0; border-bottom:1px solid #ddd;}
.productinfo .tab-nav a{display:block; float:left; line-height:30px; margin-right:20px; font-size:16px; color:#333; font-weight:bold}
.productinfo .tab-nav a.on{color:#ca2b3d}
.productinfo .tab-con{overflow:hidden;padding: 20px 5px;}
.productinfo .tab-con .con{display:block; }
.productinfo .tab-con .con img{max-width:100%; margin:10px auto;}
.productinfo .tab-con .con p{font-size:15px; color:#333; line-height:26px; margin-bottom:15px;}

/*新闻*/
.news{overflow:hidden}
.news .list{overflow:hidden; margin-top:25px;}
.news .item{overflow:hidden; display:block; font-size:15px; color:#333; line-height:46px;border-bottom:1px dashed #ddd; background:url(/images/list_li.gif) no-repeat center left; padding-left:20px}
.news .item span{float:right; line-height:46px; color:#999; font-size:13px;}
.news .item:hover{color:#ca2b3d}
.newsinfo {overflow:hidden;}
.newsinfo .content{padding:50px 80px 120px; background-color:#fff;margin-top: 2%; margin-bottom:3%;}
.newsinfo .content .tt h1{font-size:24px; font-weight:bold; color:#333; line-height:40px; text-align:center; letter-spacing:1px;}
.newsinfo .content .tt p{text-align:center}
.newsinfo .content .tt span{font-size:13px;  line-height:30px; color:#999; text-align:center}
.newsinfo .con{overflow:hidden; padding:2% 0 0;border-top: 1px solid #ddd; margin-top:10px;}
.newsinfo .con img{max-width:100%; margin:auto}
.newsinfo .con p{font-size:15px; line-height:24px; color:#333; margin-bottom:15px; }


@media only screen and (max-width:1200px) {
    /*Index*/
    .banner{margin-top:55px;}
    .banner .swiper-container .swiper-pagination{display:none}
    .productbox{overflow:hidden; padding:5% 2%; }
    .productbox h1{font-size: 18px; color:#333}
    .productbox .item{width:48%;  padding-top:5%;  border: 1px solid #ddd;}
    .productbox .item p{position:absolute; top:5%; left:5%; color:#333; line-height:30px; z-index:99}
    .productbox .more{width:100%; padding:5px 0;}
    .productbox .more span{font-size:20px;}
    .productbox .item2{ float:none; width:100%; height:450px; margin-bottom:2%;}
    .productbox .item2:nth-child(2){margin:0 0 2% 0;}
    .productbox .item2 .m{display:none}
    .henfubox .text{top:5%;}
    .henfubox .text h2{font-size:20px; line-height:40px; }
    .henfubox .text p{font-size:15px; line-height:28px; }
    .companybox{padding:0 0 5%;}
    .companybox .leftbox{width:100%; position:relative;  float:none; }
    .companybox .leftbox img {width:100%; height:auto}
    .companybox .rightbox{width:100%; text-align:center; float:none; padding:3%}
    .companybox .rightbox h3{ font-size:20px; line-height:36px; margin-top:10px; letter-spacing:0;}
    .companybox .rightbox h2{ font-size:16px; font-weight:bold; line-height:30px; margin-top:15px; margin-bottom:15px; letter-spacing:0;}
    .companybox .rightbox .p1{font-size:12px;}
    .companybox .rightbox .p2{color:#333333; font-size:14px; line-height:24px; margin-bottom:10px; }
    .companybox .rightbox .more{ padding:10px 0; font-size:14px; color:#fff; margin-top:20px; border-radius:3px; display:block; float:none}
    .newsbox{overflow:hidden; padding:5% 3%; background-color:#fff;}
    .newsbox .tit h2{ width:220px; height:50px; border:2px solid #ca2b3d; margin:auto; z-index:1}
    .newsbox .tit h2 span{width:50%; left:50%; margin-left:-25%; font-size:20px; letter-spacing:0; line-height:40px; bottom:-20px;}
    .newsbox .tit p{ line-height:30px; margin-top:10px;}
    .newsbox .boxs .top{border-bottom:5px solid #f6f6f6; }
    .newsbox .boxs .top h3{float:left; font-size:15px; color:#333; line-height:30px;}
    .newsbox .boxs .top span{float:left; font-size:13px; color:#999; line-height:30px; padding-left:10px;}
    .newsbox .boxs .top a{float:right; font-size:13px; color:#999; line-height:30px; }
    .newsbox .leftimg{display:none}
    .newsbox .cnews{width:100%; float:none; margin-left:0;}
    .newsbox .cnews .list{overflow:hidden; margin-top:20px;}
    .newsbox .cnews .list a{background:url(/images/list_li.gif) no-repeat center left; display:block; line-height:45px; padding-left:10px; color:#555}
    .newsbox .cnews .list a span{display:none;}
    .newsbox .inews{width:100%; float:none; margin-left:0; margin-top:3%}
    .newsbox .inews .list a{display:block; overflow:hidden; padding:10px 0; border-bottom:1px dashed #ddd}
    .newsbox .inews .list a img{float:left; width:110px; margin-right:15px;}
    .newsbox .inews .list a .tt{float:left;color:#555; width:295px; line-height:30px;}
    .newsbox .inews .list a .summary{float:left; font-size:12px; color:#999;width:295px; line-height:20px;}

    /*产品*/
    .products{overflow:hidden}
    .products  .leftbox .channelbox ul li{width:33.33%}
    .products  .rightbox{padding:3% 2%;}
    .products .item{overflow:hidden; width:48%; }
    .products .item p{line-height:40px; text-align:center; color:#333; font-size:14px;}
    .productinfo{overflow:hidden}
    .productinfo .imgwrap .pimg{width:100%; float:none }
    .productinfo .imgwrap .summary{width:100%; margin-left:0;float:none; margin-top:3% }
    .productinfo .imgwrap .summary h1{font-weight:bold; font-size:20px; line-height:30px; border-bottom:1px solid #ddd; padding-bottom:10px; color:#333}
    .productinfo .imgwrap .summary p{font-size:15px; line-height:26px; margin-top:15px;}
    .productinfo .intro{overflow:hidden; margin-top:5%;}
    .productinfo .tab-nav a{display:block; float:left; line-height:30px; margin-right:20px; font-size:15px; color:#333; font-weight:bold}

    /*新闻*/
    .news{overflow:hidden}
    .news .list{overflow:hidden; margin-top:10px;}
    .news .item{font-size:14px; }
    .news .item span{display:none}
    .newsinfo {overflow:hidden;}
    .newsinfo .content{margin-top: 0; margin-bottom:3%;}
    .newsinfo .content .tt h1{font-size:18px; line-height:1.5; text-align:center; letter-spacing:0;}
    .newsinfo .content .tt span{font-size:12px;  line-height:30px; color:#999; text-align:center}
    .newsinfo .con{overflow:hidden; padding:2% 0 0;border-top: 1px solid #ddd; margin-top:10px;}
    .newsinfo .con img{max-width:100%; margin:auto}
    .newsinfo .con p{font-size:15px; line-height:24px; color:#333; margin-bottom:15px; }

    .en.pages .leftbox ul li{width:50%;}
    .en.productbox h1{font-size:16px; text-align:center; line-height:30px;}
    .en.henfubox .text h2{font-size:16px; line-height:30px;}
    .en.companybox .rightbox h3{font-size:18px; line-height:1.5}
    .en.companybox .rightbox h2{font-weight:normal; font-size:15px; line-height:1.5}
    .en.products .leftbox .channelbox ul li, .en.productinfo .leftbox .channelbox ul li{width:100%;}
}
