@charset "utf-8";
body{ margin:0px; padding:0px; font-size:12px; background:#fff;line-height:25px; font-family: "microsoft Yahei",Verdana, Geneva, sans-serif;}
ul,li{ margin:0px; padding:0px; list-style:none;}
a{ color:#333; text-decoration:none;}
a:hover{ text-decoration:underline;}


.index{ clear: both; display: block; width: 1200px; margin: 40px auto; }
.indexC{ clear: both; display: block; width: 1200px; margin: 0px auto; }
.clear{ clear: both; display: block; }


/* top style */
.topMargin{ clear: both; display: block; height: 45px;}

.topFiex{ clear: both; position: fixed; width: 100%; left: 0px; top: 0px; display: -webkit-box; width: 100%; height: 45px; line-height: 45px; background: #1d66cf; color: #fff; z-index: 3000; }
.topBack{ display: block; width: 60px; text-align: center; }
.topBack a{ clear: both; display: block; height: 45px; line-height: 45px; color: #fff; font-size: 15px; }
.topTit{ display: block; height: 45px; line-height: 45px; -webkit-box-flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0px 15px; font-size: 16px; text-align: center; }
.topMenu{ display: block; width: 60px; text-align: center;}
.topMenu img{ border: 0px;}


.toggleMenu{ clear: both; display: none; background: #f6f4f4; position: fixed; width: 100%; left: 0px; top: 45px; height: 100%; z-index: 3000; font-size: 16px; overflow: auto; }
.toggleMenu strong{ clear: both; display: block; height: 45px; line-height: 45px; text-indent: 1em; color: #fff; background: #1d66cf; border-top: 1px solid #fff; }
.toggleMenu strong a{ color: #fff; }
.toggleMenu ul{ clear: both; }
.toggleMenu ul li{ clear: both; display: block; border-bottom: 1px solid #e3e3e3; height: 40px; line-height: 40px; text-indent: 1.5em; }
.toggleMenu ul li a{ font-size: 13px;}



.headerMenuList{ clear: both; display: block; margin: 10px 0px;}
.headerMenuList ul{ clear: both; display: -webkit-box; margin-top: 10px; }
.headerMenuList ul a{ display: block; -webkit-box-flex: 1; margin: 0px 10px; height: 35px; line-height: 35px; background: #1d66cf; border-radius: 4px; color: #fff; font-size: 14px; text-align: center; }


/* banner */
.swiper-container-banner { clear: both; display: block; width: 100%; margin: 0px auto; overflow: hidden; position: relative; }
.swiper-container-banner .swiper-slide a{ clear: both; display: block; width: 100%; }
.swiper-container-banner .swiper-slide a img{ border: 0px; width: 100%; }
.swiper-container-banner .swiper-pagination span{ width: 10px; height: 10px; margin: 0px 40px; }


/* index-tit */
.index-tit{ display: flex; flex-direction: column; margin-bottom: 30px; justify-content: center; align-items: center;}
.index-tit strong{ display: flex; font-size: 30px; color: #444; margin-bottom: 20px;}
.index-tit p{ display: flex;}


/* index-news */
.index-news{ clear: both; display: block; width: 90%; margin: 50px auto 0px; }
.index-news-tit{ clear: both; display: flex; align-items: flex-end; margin-bottom: 10px;}
.index-news-tit-l{ display: flex; flex-direction: column; flex: 1;}
.index-news-tit-r{ display: flex;}
.index-news-tit-r a{ color:#7c7c7c;}

.index-news-tit strong{ clear: both; display: block; font-size: 30px; color: #444; margin-bottom: 10px;}
.index-news-tit span{ color: #7c7c7c;}


.index-news-list-pic{ display: flex; width: 100%; height: 200px; position: relative; }
.index-news-list-pic a{ position: absolute; width: 100%; height: 100%; left: 0px; top: 0px;}
.index-news-list-pic img{ border: 0px; width: 100%; height: 100%; }
.index-news-list-pic span{ display: flex; width: 100%; padding: 15px 0px; position: absolute; left: 0px; bottom: 0px; background-color: rgba(0,0,0,0.5); color: #fff; font-size: 18px; justify-content: center; align-items: center;}

.index-news-list-txt{ display: flex; flex: 1; flex-direction: column; width: 100%; margin: 20px auto 0px; }
.index-news-list-txt li{ display: flex; flex-direction: column; background-color: #f7f7f7; padding: 15px; box-sizing: border-box; margin-bottom: 15px; color: #777;}
.index-news-list-txt li strong{ font-size: 17px;}
.index-news-list-txt li span{ margin: 7px 0px; }
.index-news-list-txt li p{ display: flex; margin: 0px; padding: 0px; font-size: 12px; line-height: 20px; }

/*  index-pro  */
.index-pro{ clear: both; display: block; background: url(../images/product_bg.jpg) center top no-repeat; background-size: 100% 100%; padding: 50px 0px;}

.index-pro .index-tit, .index-pro .index-tit strong{ color: #fff;}


/* index-pro swiper */
.swiper-container-pro { clear: both; display: block; width: 90%;  position: relative; margin: 0px auto;padding-bottom: 50px; overflow: hidden;  }
.proPic{ clear: both; width: 100%; }
.proPic img{ clear: both; display: block; border: 0px; max-width: 100%; max-height: 100%; box-sizing: border-box; }
.proTit{ clear: both; display: block; text-align: center; background: #fff; font-size: 14px; padding: 10px 0px; }
.swiper-container-pro .swiper-pagination span{ width: 15px; height: 15px; margin: 0px 20px; bottom: -20px; background-color: #1d66cf; }


/* index-case */
.index-case{ clear: both; display: block; padding: 50px 0px;}
.index-case-c{ clear: both; display: flex; width: 90%; margin: 0px auto; flex-direction: column; }
.index-case-list{ display: flex; width: 100%;}



.swiper-container-case { clear: both; display: block; width: 90%;  position: relative; margin: 0px auto; padding-bottom: 30px; overflow: hidden; }
.swiper-container-case .swiper-pagination span{ width: 15px; height: 15px; margin: 0px 20px; background-color: #1d66cf; }



/* index-about */
.index-about{ clear: both; display: block; background-color: #f5f5f5; padding: 50px 0px;}
.index-about-c{ clear: both; display: block; width: 90%; margin: 0px auto;}

.index-about-list{ display: flex; width: 100%;}
.index-about-list li{ display: flex; flex: 1; margin-right: 25px; height: 120px; position: relative;}
.index-about-list li:nth-child(3){ margin-right: 0px;}
.index-about-list li p{ width: 100%; height: 120px; position: absolute; left: 0px; bottom: 0px; margin: 0px; padding: 0px;}
.index-about-list li p img{ clear: both; display: block; width: 100%; height: 100%; border: 0px;}
.index-about-list li span{ width: 100%; height: 50px; overflow: hidden; position: absolute; left: 0px; bottom: 0px; background-color: rgba(0, 0, 0, 0.7); color: #fff; font-size: 20px; text-align: center;}




/* product channel */
.pageBanner{ clear: both; display: block;}
.pageBanner img{ border: 0px; width: 100%;}

.productChannel{ clear: both; display: -webkit-box; width: 100%; background: #fff; }
.leftList{ display: block; width: 90px; height: 100%; background: #f4f5f9; overflow: auto; }
.leftList li{ clear: both; display: block; text-align: center; padding: 10px 0px; }
.leftList .cur{ background: #fff; box-shadow: -3px 3px 8px #ccc; border-left: 4px solid #1d66cf; }
.leftList li i{ clear: both; display: block; }
.leftList li i img{ border: 0px; width: 30px; height: 30px;}
.leftList li span{ clear: both; display: block;}



.product{ display: block; -webkit-box-flex: 1; margin: 15px;}

.productList{ clear: both; display: block; }
.productList ul{ clear: both; display: -webkit-box; }
.productList li{ display: block; -webkit-box-flex: 1; margin: 10px; text-align: center; box-shadow: -2px 2px 10px #ccc; }
.productList li p{ clear: both; display: block; margin: 0px; padding: 0px; }
.productList li p img{ border: 0px; max-width: 100%; max-height: 100%; }
.productList li span{ clear: both; display: block; height: 35px; line-height: 35px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; background: #67c5f5; }
.productList li span a{ color: #fff; }

.proImgPic{ clear: both; display: block; text-align: center; }
.proImgPic img{ border: 0px; max-width: 700px; }


/* sub style */

.page{ clear: both; display: block; margin-top: 20px; background: #fff; padding: 10px; }
.pageList{ clear: both; display: block; margin: 30px auto; width: 100%; }
.pageList a{ float: left; display: inline-block; margin-right: 10px; height: 30px; line-height: 30px; padding: 0px 10px; background: #f7f7f7; border: 1px solid #e3e3e3; }
.pageList b{ float: left; display: inline-block; margin-right: 10px; height: 30px; line-height: 30px; padding: 0px 10px; background: #1767CA; color: #FFF; }




/* product content tab */
.productContent{ clear: both; display: block; margin-top: 30px; }
.productContentTit{ clear: both; display: -webkit-box; height: 40px; margin: 15px; background: #fff; border: 1px solid #1d66cf; border-radius: 5px; }
.productContentTit a{ display: block; -webkit-box-flex: 1; height: 40px; line-height: 40px; font-size: 15px; text-align: center; border-right: 1px solid #1d66cf; }
.productContentTit a:nth-child(4n){ border-right: 0px;}
.productContentTit a:hover{ text-decoration: none; }
.productContentTit .cur{ background: #1d66cf; color: #fff; }

.productContentTxt{ clear: both; display: block; background: #fff; border-top: none; }
.productTabTxt{ clear: both; display: block; margin: 15px;}
.productTabTxt img{ border: 0px; max-width: 100%; height: auto;}


.h3title{ clear: both; display: block; background: #e3e3e3; margin-top: 20px; }
.h3title span{ display: inline-block; height: 35px; line-height: 35px; color: #fff; background: #1d66cf; margin: 0px; padding: 0px 20px; height: 35px; line-height: 35px; font-size: 14px;}

.h3txt{ clear: both; display: block; margin: 0px; padding: 10px 15px; background: #fff; }
.h3txt p{ clear: both; display: block; margin: 0px; padding: 0px;}
.h3txt img{ border: 0px; max-width: 100%; height: auto; }
.productSmallTxt{ clear: both; display: block; font-size: 14px; margin: 15px 0px; color: #666;}


/* message */
.messageTop{ clear: both; display: block; margin: 20px; padding: 0px; background: #1d66cf; color: #fff; }
.messageLeft{ clear: both; display: block; margin: 0px 20px; padding: 20px 0px; }
.messageLeft span{ clear: both; display: block; height: 60px; line-height: 60px; font-size: 16px;}

.messageIcon{ clear: both; display: -webkit-box; background: #e3e3e3; padding: 20px 0px 20px 0px; }
.messageIcon li{ display: block; -webkit-box-flex: 1; margin: 0px 20px; }
.messageIcon li a{ clear: both; display: block; width: 100%; text-align: center;}
.messageIcon li img{ border: 2px solid #1d66cf; border-radius: 10px; }
.messageIcon li span{ clear: both; display: block; width: 100%; color: #fff; font-size: 12px; border-radius: 3px; background: #fff; color: #1d66cf; text-align: center; }

.messageTxt{ clear: both; display: block; margin: 20px; background: #fff; padding: 20px; font-size: 14px; }

.messageForm{ clear: both; display: block; margin: 0px;}
.messageFormLeft{ clear: both; display: block; background: #fff; padding: 20px; }
.messageFormLeft form{ clear: both; display: block; padding: 0px;}
.messageLi{ clear: both; display: -webkit-box; font-size: 12px; margin-bottom: 10px; }
.messageLi span{ display: block; width: 100px; height: 25px; line-height: 25px; background: #1d66cf; color: #fff; text-align: center;}
.messageLi p{ display: block; -webkit-box-flex: 1; margin: 0px 0px 0px 10px; padding: 0px;}
.messageLi p input{ clear: both; display: block; width: 100%; border: 1px solid #e3e3e3; background: #f7f7f7; height: 23px; line-height: 23px; }
.messageLi textarea{ clear: both; display: block; width: 100%; height: 100px; border: 1px solid #e3e3e3; background: #f7f7f7; }

.messageFormRight{ clear: both; display: none; margin: 10px 0px 0px; background: #fff; text-align: center; }
.messageFormRight p{ clear: both; display: block; margin: 0px; padding: 0px;}
.messageFormRight p img{ border: 0px; border-radius: 10px; border: 2px solid #1d66cf; width: 80px;}
.messageFormRight span{ clear: both; display: block; line-height: 12px; background: #fff; color: #1d66cf; color: #333; border-radius: 5px; }

.messageBtn{ clear: both; display: block; margin-left: 110px;}
.messBtn{ clear: both; display: block; height: 40px; line-height: 40px; border-radius: 0px; background: #1d66cf; color: #fff; padding: 0px 20px; margin: 0px; cursor: pointer; -webkit-appearance:none; border: 0px; font-size: 14px;}


/* news */
.newsChannel{ clear: both; display: -webkit-box; margin: 15px; border: 1px solid #1d66cf; background: #fff; border-radius: 5px;}
.newsChannel li{ display: block; -webkit-box-flex: 1; text-align: center; height: 35px; line-height: 35px; border-right: 1px solid #1d66cf; }
.newsChannel li:nth-child(3n){ border-right: 0px; }
.newsChannel .cur{ background: #1d66cf; }
.newsChannel .cur a{ color: #fff;}

.newsList{ clear: both; display: block; margin: 15px; background: #fff; }
.newsList ul{ clear: both; display: block; margin: 0px 10px; border-bottom: 1px solid #e3e3e3; }
.newsList li{ clear: both; display: -webkit-box; padding: 10px 0px; }
.newsList .newsPic{ display: block; width: 135px; height: 135px; }
.newsList .newsPic img{ border: 0px; width: 135px; height: 135px; }
.newsList .newsTxt{ display: block; -webkit-box-flex: 1; margin: 0px 10px; height: 135px; position: relative; }
.newsTit{ clear: both; display: block; line-height: 30px; font-size: 16px; }
.newsDate{ position: absolute; right: 0px; bottom: 0px; height: 30px; line-height: 30px; color: #666; font-size: 12px; }


.newsPageInfo{ clear: both; display: block; background: #fff; padding: 15px;}
.newsPageTit{ clear: both; display: block; font-size: 18px; font-weight: bold; color: #2d70b7;}
.newsPageTime{ clear: both; display: block; font-size: 13px; color: #777;}

.newsPageTxt{ clear: both; display: block; margin: 20px 0px; background: #fff; padding: 15px; font-size: 14px;}
.newsPageTxt img{ border: 0px; max-width: 100%; height: auto; display: inline-block;}
.newsPageTxt p{ clear: both; display: block; margin: 0px; padding: 0px;}

/* about page */
.aboutChannel{ clear: both; display: -webkit-box; margin: 0px; background: #fff; }
.aboutChannel li{ display: block; -webkit-box-flex: 1; text-align: center; height: 40px; line-height: 40px; }
.aboutChannel li a{ clear: both; display: block; font-size: 16px;}
.aboutChannel .cur{ border-bottom: 3px solid #1d66cf;}
.aboutChannel .cur a{ color: #1d66cf;}




/* copyright */
.copymargin{ clear: both; display: block; height: 50px;}

.copy_txt{ clear: both; display: flex; flex-wrap: wrap; background: url(../images/copy_txt.jpg) center top no-repeat; padding: 50px 0px 0px; justify-content: space-evenly;}
.copy_txt li{ display: flex; width: 40%; margin-bottom: 50px; justify-content: center; align-items: center; flex-direction: column; color: #fff; }
.copy_txt li strong{ display: flex; font-size: 40px; margin-bottom: 20px;}
.copy_txt li span{ display: flex; justify-content: center; align-items: center; text-align: center;}


.copy_right{ display: flex; width: 100%; flex-direction: column; background-color: #39424b; padding: 20px 0px; }

.copy_menu{  display: flex; width: 100%; }
.copy_menu ul{ display: flex; flex: 1; flex-direction: column; justify-content: center; align-items: center;}
.copy_menu ul li{ display: flex; margin-bottom: 10px;}
.copy_menu ul li img{ border: 0px; width: 120px; height: 120px; }
.copy_menu ul li a{ font-size: 14px; color: #a2a5a8; }
.copy_menu ul li strong { margin-bottom: 15px; font-size: 17px; color: #fff; }
.copy_menu ul li strong a{ font-size: 17px; color: #fff; }


.copy-text{  display: block; text-align: center; width: 100%; color: #fff; }
.copy-text a{ color: #fff; }



.copyright{ clear: both; display: -webkit-box; width: 100%; position: fixed; left: 0px; bottom: 0px; border-top: 1px solid #e3e3e3; background: #1d66cf; text-align: center; z-index: 3000;}

.copyright li{ display: block; -webkit-box-flex: 1; }
.copyright li span{ clear: both; display: block; height: 50px; line-height: 50px; color: #fff; font-size: 16px;}


.copyrightImg{ width: 100%; }
.copyrightImg img{ border: 0px; width: 100%; }