@charset "utf-8";

/* CSS 鼠标效果 */

@font-face {

    font-family: 'Titillium Web';

    src: url('fonts/TitilliumWeb-ExtraLight.woff2') format('woff2'),

        url('fonts/TitilliumWeb-ExtraLight.woff') format('woff'),

        url('fonts/TitilliumWeb-ExtraLight.ttf') format('truetype');

    font-weight: 200;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Titillium Web';

    src: url('fonts/TitilliumWeb-Light.woff2') format('woff2'),

        url('fonts/TitilliumWeb-Light.woff') format('woff'),

        url('fonts/TitilliumWeb-Light.ttf') format('truetype');

    font-weight: 300;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Titillium Web';

    src: url('fonts/TitilliumWeb-Regular.eot');

    src: url('fonts/TitilliumWeb-Regular.eot?#iefix') format('embedded-opentype'),

        url('fonts/TitilliumWeb-Regular.woff2') format('woff2'),

        url('fonts/TitilliumWeb-Regular.woff') format('woff'),

        url('fonts/TitilliumWeb-Regular.ttf') format('truetype');

    font-weight: 400;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Titillium Web';

    src: url('fonts/TitilliumWeb-SemiBold.woff2') format('woff2'),

        url('fonts/TitilliumWeb-SemiBold.woff') format('woff'),

        url('fonts/TitilliumWeb-SemiBold.ttf') format('truetype');

    font-weight: 600;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Titillium Web';

    src: url('fonts/TitilliumWeb-Bold.woff2') format('woff2'),

        url('fonts/TitilliumWeb-Bold.woff') format('woff'),

        url('fonts/TitilliumWeb-Bold.ttf') format('truetype');

    font-weight: bold;

    font-style: normal;

    font-display: swap;

}



* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding: 0; margin: 0;}

body{ font-size: 18px; color: #666; overflow-x: hidden; font-family:"Titillium Web",'Noto Sans SC',"PingFang SC","Microsoft YaHei",Arial,sans-serif;}

ul,li,ol,dl,dt,dd,p,h1,h2,h3,h4,h5,h6,header,footer{ list-style: none; padding: 0; margin: 0; display: block;}

input,textarea,select,button{ font-size: 16px; outline:none; font-family:"Titillium Web","Noto Sans SC","Microsoft YaHei",Helvetica,Arial,Verdana,sans-serif; }

svg{ border: none;}

::-webkit-input-placeholder {color: #999;}

::-moz-placeholder {color: #999;}

:-ms-input-placeholder {color: #999;}



a { text-decoration: none; color:#333; transition: color 0.56s ease;}

a:hover{ color: #f3b259;}



.clearfix:after{content:"";height:0;line-height:0;display:block;visibility:hidden;clear:both}

.clearfix{zoom:1;}

.clear{ clear:both}

.overflow{overflow-y:hidden;}



img{ display: inline-block; vertical-align:middle;max-width:100%;max-height:100%;height: auto; border: none;}



.wrap{ width: 1520px; margin: 0 auto;}

.ovh{overflow: hidden;}



::-webkit-scrollbar { width: 8px;  height: 8px; background-color: rgba(24, 24, 24, .07); }

::-webkit-scrollbar-thumb {background: rgba(24, 24, 24, .3); border-radius: 8px; transition: background 0.4s ease;}

::-webkit-scrollbar-thumb:hover {background: #34495e;}



/*顶部*/

.header{ width: 100%; position: fixed; left: 0; top: 0; z-index: 9999;}

.header .wrap{height:186px;  position: relative; display: flex; align-items:flex-end;  transition: all 0.4s; }

.header .logo{ height: 186px; padding:9px 0 0; overflow: hidden; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); transition: all 0.4s;}

.header .nav{ width: 100%; margin-bottom: 15px;}

.header .nav>ul>li{ line-height: 35px; position: relative;}

.header .nav>ul>li>a{ font-size: 18px; color: #000; transition: all .4s; display: block;}

.header .nav>ul>li>a.tit{ position: relative;}

.header .nav>ul>li>a.tit::before{ content: ""; width: 13px; height: 7px; background: url(../images/icon15.png) no-repeat center; position: absolute; right: -20px; top: 50%; margin-top: -3px;}

.header .nav>ul>li a:hover{ color: #f3b259;}

.header .nav>ul>li.on>a{ color: #f3b259; }

.header .nav>ul>li:nth-child(4){ margin-right: 250px;}

.header .subnav{ width:220px; background: #fff; position: absolute; left: 50%; top: 35px; transform: translateX(-50%); padding:10px 20px; box-shadow: 0 8px 10px rgba(0, 0, 0, .1); overflow: hidden; display: none;}

.header .subnav a{ font-size: 15px; line-height: 1.1; display: block; margin: 13px 0;}

.header .lang{line-height: 35px; font-size: 18px; color: #000; position: relative;}

.header .lang::before{ content: ""; width: 13px; height: 7px; background: url(../images/icon15.png) no-repeat center; position: absolute; right: -20px; top: 50%; margin-top: -3px;}

.header .lang .subnav{ width: 100px; text-align: center;}

.header .search form{ display: flex;}

.header .search button{ width: 32px; height: 28px; background: url(../images/icon01.png) no-repeat center; border: none; margin-right: 5px; cursor: pointer;}

.header .search input{ width: 130px; height: 28px; background: none; border: none; border-bottom: #a7aaac solid 1px;}

.menu-toggle{display: none;}



.header.index{ background: #e0eef8;}

.header.fixed {background: #e0eef8; box-shadow:0 0 15px rgba(0, 0, 0, .1);}

.header.fixed .wrap{ height: 120px; }

.header.fixed .logo{ height: 120px;}



/*首页bannner*/

.banner { position: relative; margin-top: 182px;}

.banner .swiper-button-next:after,.banner .swiper-button-prev:after{ display: none;}

.banner .swiper-button-prev,.banner .swiper-button-next{ width: 50px; height: 50px; background-size: contain !important; display: none;}

.banner:hover .swiper-button-prev,.banner:hover .swiper-button-next{ display: block;}

.banner .swiper-button-prev{ background: url(../images/banner_arrow_left.png) no-repeat center; left: 20px;}

.banner .swiper-button-next{ background: url(../images/banner_arrow_right.png) no-repeat center; right: 20px;}

.banner .shubiao{ width: 25px; position: absolute;	left: 50%;	bottom: 60px; z-index: 66; display: flex; justify-content: space-between; transform: translateX(-50%);}

.banner .shubiao span i{ width: 25px; height: 38px;	border: 2px #222 solid; border-radius: 13px; display: block;}

.banner .shubiao span i:after{ content: ""; display: block;	width: 3px;	border-radius: 3px;	height: 8px; background: #222;	margin: 3px auto 0;	animation: mouse 1s linear infinite;-webkit-animation: mouse 1s linear infinite;}

@keyframes mouse{

	0% {transform: translateY(0px);}

	50% {transform: translateY(10px);}

	100% {transform: translateY(0px);}

}

@-webkit-keyframes mouse{

	0% {transform: translateY(0px);}

	50% {transform: translateY(10px);}

	100% {transform: translateY(0px);}

}



.neiBanner{ height: 476px; background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; align-items: center; justify-content: center;  position: relative;}

.neiBanner .bannerText{ width: 100%; padding-top: 100px;}

.neiBanner .bannerText h3{ font-size: 48px; color: #000; line-height: 1; font-weight: bold;}



.more{ padding:0 80px 0 35px; background: #0072c3 url(../images/icon02.png) no-repeat right 12px center; font-size: 16px; color: #fff; font-weight: 200; line-height: 55px; display: inline-block; position: relative; transition: all 0.4s;}

.more::before{ content: ""; width: 1px; height: 100%; background: #fff; position: absolute; right: 44px; top: 0; z-index: 11;}

.more:hover{ background: #005a9b url(../images/icon02.png) no-repeat right 12px center; color: #fff;}



.title{ margin-bottom: 50px;}

.title h2{ font-size: 48px; color: #000; line-height: 1; font-weight: normal; text-align: center;}



.ntitle{ text-align: center;  margin-bottom:50px;}

.ntitle h2{font-size: 41px; color: #333; line-height: 1; font-weight: normal;}

.ntitle span{ color: #0066cc;}

.ntitle dt{ color: #888; margin-top: 25px;}



.indexOne{ padding-bottom: 95px;}

.indexOne .con{ width: 50%; padding:30px 80px;}

.indexOne .con .tit{ font-size: 41px; color: #333; line-height: 1; margin-bottom: 40px;text-align: center;}

.indexOne .con .tit span{ color: #0066cc;}

.indexOne .con .text{ line-height: 2; margin-bottom: 80px;}

.indexOne .pic{ width: 50%;}

.indexOne .pic img{ width: 100%;}



.indexTwo{ background: #f4f4f4;}

.indexTwo .wrap{ position: relative;}

.indexTwo .title{ width: 100%; position: absolute; left: 0; top: 60px;}

.indexTwo .title h2{ font-size: 38px;}

.indexTwo .box ul li{ width: 25%;}

.indexTwo .box ul li .item a{ height: 480px; padding: 160px 50px 0; text-align: center; display: block; transition: all 0.4s;}

.indexTwo .box ul li .item a:hover{ background: #fff;}

.indexTwo .box ul li .item .tit{ font-size: 36px; color: #000; line-height: 1; text-transform: uppercase; margin:20px 0 10px;}

.indexTwo .box ul li .item .text{ text-align: left; color: #333; margin-bottom: 40px;}

.indexTwo .box ul li .item .more{ padding:0 50px 0 18px; width: 140px; line-height: 40px; font-size: 12px; background-size: 15px auto; background-position:right 10px center; margin: 0 auto; opacity: 0;  transition: all 0.4s;}

.indexTwo .box ul li .item .more::before{ right: 32px;}

.indexTwo .box ul li .item a:hover { padding: 130px 50px 0; }

.indexTwo .box ul li .item a:hover .more{ opacity: 1;}



.indexThree{ padding: 80px 80px 100px;}

.indexThree .box{ margin-bottom: 80px;}

.indexThree .box ul{ margin:0 -15px;}

.indexThree .box ul li{ width: 20%; padding: 0 15px;}

.indexThree .box ul li a{ padding: 30px; border: #e5e4e4 solid 1px; display: block;}

.indexThree .box ul li dl{ padding-bottom: 85%;}

.indexThree .box ul li dl::before{ content: ""; width: 100%; height: 100%; background: url(../images/logo.png) no-repeat center; position: absolute; left: 0; top: 0; z-index: 11; opacity: 0; transition: opacity 0.4s;}

.indexThree .box ul li dl img { padding: 10px;}

.indexThree .box ul li h3{ color: #666; text-align: center;  font-size: 17px; font-weight: normal; margin-top: 10px;}

.indexThree .box ul li a:hover dl::before{ opacity: 0.3;}



.indexFour .picBox{ width: 66%; position: relative;}

.indexFour .picBox .swiper-slide dl{ padding-bottom: 41.1%;}

.indexFour .swiper-button-prev,.indexFour .swiper-button-next{ color: #fff;}

.indexFour .swiper-button-prev{ left: 25px;}

.indexFour .swiper-button-next{ right:25px;}

.indexFour .inews{ width: 34%; background: #0072c3; padding: 36px 90px 36px 36px;}

.indexFour .inews .tit{ margin-bottom: 10px;}

.indexFour .inews .tit h3{ font-size: 16px; text-transform: uppercase; color: #fff; font-weight: 200; line-height: 1; border-bottom: #fff solid 1px; padding-bottom: 15px;}

.indexFour .inews .tit h2{ font-size: 36px; text-transform: uppercase; color: #fff; font-weight: normal; line-height: 1; padding-top: 13px;}

.indexFour .inews .con dd{ font-size: 16px; color: #fff; font-weight: 300; margin-bottom: 30px;}

.indexFour .inews .con h3{ font-size: 18px; color: #fff; font-weight: 300; margin-bottom: 30px;}

.indexFour .inews .con dt{ height: 64px; font-size: 16px; color: #fff; font-weight: 200; line-height: 2; margin-bottom: 20px; overflow: hidden;}

.indexFour .inews .con dl{ font-size: 18px; color: #fff; font-weight: 200;}



.bread{ line-height: 56px; text-transform: uppercase;}



.neiNav{ border-bottom: #b5b5b5 solid 1px;}

.neiNav a{ line-height: 60px; margin: 0 50px; padding: 0 30px; position: relative;}

.neiNav a.on::before{ content: ""; width: 100%; height: 6px; background: #0072c3; position: absolute; left: 0; bottom: 0;}



.about{ padding: 100px 0 0;}

.about .con{ width: 50%; padding-right: 60px;}

.about .con .tit{ font-size: 38px; color: #333; line-height: 1; margin-bottom: 40px;}

.about .con .tit span{ color: #0066cc;}

.about .con .text{ line-height: 2; margin-bottom: 80px;}

.about .pic{ width: 50%;}

.about .pic img{ width: 100%;}



.num{ padding: 65px 0;}

.num ul li{ display: flex;}

.num ul li ol{ margin-left: 20px;}

.num ul li h3{ color: #000; line-height: 1;  display: flex; }

.num ul li h3 b{ font-size: 36px; }



.why{ padding: 50px 0 120px;}

.why .con{ padding: 0 80px;}

.why .box{ margin: 0 -5px;}

.why .box .item{ width: 25%; padding: 0 5px; display: flex; flex-direction: column;}

.why .box .item:nth-child(even){ flex-direction: column-reverse;}

.why .box .item .pic dl{ padding-bottom: 77.8%;}

.why .box .item .textBox{ background: #e0eef8; padding-bottom: 77.8%; position: relative;}

.why .box .item .textBox ol{ padding: 15px; text-align: center; color: #000; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}

.why .box .item .textBox ol h3{ font-size: 24px; margin-bottom: 10px;}



.honor{ padding: 50px 0 120px;}

.honor .con{ padding: 0 80px;}

.honor .box ul{ margin: 0 -25px;}

.honor .box ul li{ width: 25%; text-align: center; padding: 0 25px; margin-bottom: 20px;}

.honor .box ul li dl{ padding-bottom:131.79%;}

.honor .box ul li h3{ font-size: 16px; font-weight: normal; margin-top: 10px;}



.products{ padding: 50px 100px 100px;}

.products .box{ padding-bottom: 30px;}

.products .box ul{ margin:0 -15px;}

.products .box ul li{ width: 20%; padding: 0 15px; margin-bottom: 30px;}

.products .box ul li a{ padding: 30px; border: #e5e4e4 solid 1px; display: block;}

.products .box ul li dl{ padding-bottom: 85%;}

.products .box ul li dl::before{ content: ""; width: 100%; height: 100%; background: url(../images/logo.png) no-repeat center; position: absolute; left: 0; top: 0; z-index: 11; opacity: 0; transition: opacity 0.4s;}

.products .box ul li dl img { padding: 10px;}

.products .box ul li h3{ color: #666; text-align: center;  font-size: 17px; font-weight: normal; margin-top: 10px;}

.products .box ul li a:hover dl::before{ opacity: 0.3;}



.proview{ padding: 10px 0 100px;}

.proview .proHead .pic{ width: 50%; padding-right: 100px;}

.proview .proHead .pic dl{ padding-bottom: 100%; border: #ccc solid 1px;}

.proview .proHead .pic dl img{ padding: 15px;}

.proview .proHead .con{ width: 50%; padding: 0 45px; display: flex; flex-direction: column-reverse; justify-content: space-between;}

.proview .proHead .con .tit{ margin-bottom: 20px;}

.proview .proHead .con .tit h1{ font-size:30px; font-weight: 300; color: #0072c3; line-height: 1.4;}

.proview .proHead .con .text{ height: 400px; overflow-y: auto; padding-right: 10px;}

.proview .proHead .con .picList{}

.proview .proHead .con .picList ul{ margin: 0 -13px;}

.proview .proHead .con .picList ul li{ width: 25%; padding: 0 13px;}

.proview .proHead .con .picList ul li dl{ padding-bottom: 100%; border: #ccc solid 1px; cursor: pointer;}

.proview .proHead .con .picList ul li dl img{ padding: 10px;}

.proview .proCon{ padding: 100px 0;}

.proview .proCon .tabNav{ margin-bottom: 30px;}

.proview .proCon .tabNav li{ width: 170px; height: 56px; line-height: 56px; text-align: center; background: #0072c3; color: #fff; margin-right: 20px; cursor: pointer;}

.proview .proCon .tabNav li.on{ background: #005c9e;}

.proview .proCon .tabCon .item{ display: none;}

.proview .proCon .tabCon .item.on{ display: block;}

.viewPage{ border-top: 1px solid #555; padding: 30px 0;}

.viewPage a{ width: 47%;}

.viewPage a:nth-child(2){ text-align: right;}



.news{ padding: 50px 0 100px;}

.news ul{ margin: 0 -44px;}

.news ul li{ width: 33.33%; padding: 0 44px; margin-bottom: 80px;}

.news ul li a{ padding: 25px 25px 70px; border: #dbdbdb solid 1px; display: block; position: relative;}

.news ul li a::before{ content: ""; width: 30px; height: 30px; background: url(../images/icon16.png) no-repeat center; background-size: contain; position: absolute; right: 25px; bottom: 25px;}

.news ul li a:hover{ background: #deebf4;}

.news ul li dd{ color: #000; margin-bottom: 5px;}

.news ul li .tit{ margin-bottom: 10px;}

.news ul li .tit h3{ font-size: 22px; color: #000; font-weight: normal; line-height: 1.2;}

.news ul li .text{ height: 120px; color: #222; font-size: 16px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:5; overflow: hidden;}



.newsView{ padding: 50px 0 100px;}

.newsView .newsHed{ border-bottom: 1px solid #555; text-align: center; padding-bottom: 20px;}

.newsView .newsHed h1{ font-size: 24px; font-weight: normal; color: #000; margin-bottom: 10px;}

.newsView .newsHed p{ color: #666;}

.newsView .text{ padding: 60px 0; color: #666; line-height: 2;}



.video{ padding: 50px 0 100px;}

.video ul{ margin: 0 -45px;}

.video ul li{ width: 33.33%; padding: 0 45px; margin-bottom: 80px;}

.video ul li ol{ padding: 22px; background: #f7f9fc; border: #d5d6d9 solid 1px; cursor: pointer; transition: all 0.4s;}

.video ul li ol:hover{background: #f0f0f0;}

.video ul li ol h3{ height: 52px; font-size: 22px; color: #222; font-weight: 600; line-height: 26px; overflow: hidden; margin-bottom: 15px;}

.video ul li ol .pic{ margin-bottom: 22px; position: relative;}

.video ul li ol .pic::before{ content: ""; width: 100%; height: 100%; background: url(../images/icon17.png) no-repeat center; position: absolute; left: 0; top: 0; z-index: 11;}

.video ul li ol .pic dl{ padding-bottom: 46.5%; background: #e7edf7;}

.video ul li ol dd{ font-size: 16px; color: #222;}

.video ul li ol dt{width: 30px; height: 30px; background: url(../images/icon16.png) no-repeat center; background-size: contain; }



.contact{ padding: 10px 0 60px;}

.contact .box{ padding: 0 200px;}

.contact .text{ font-size: 24px; text-align: center; color: #222; line-height: 1.8;}



.message .box{ padding: 20px 100px 100px;}

.message .box ul p{ color: #000; margin-bottom: 15px;}

.message .box ul li{ width: 48%; margin-bottom: 30px;}

.message .box ul li input{ width: 100%; line-height: 74px; border: #ededed solid 1px; padding-left: 50px;}

.message .box ul li.person input{ background:#f9f9f9 url(../images/icon18.png) no-repeat 20px center;}

.message .box ul li.tel input{ background:#f9f9f9 url(../images/icon19.png) no-repeat 20px center;}

.message .box ul li.email input{ background:#f9f9f9 url(../images/icon20.png) no-repeat 20px center;}

.message .box ul li.address input{ background:#f9f9f9 url(../images/icon21.png) no-repeat 20px center;}

.message .box ul ol.content textarea{ background:#f9f9f9 url(../images/icon22.png) no-repeat 20px 18px;}

.message .box ul ol textarea{ width: 100%; height: 222px; line-height: 2; border: #ededed solid 1px; padding:10px 50px;}

.message .box ul button{ width: 208px; height: 50px; border: #5e7ad3 solid 1px; background: #fff; font-size: 18px; margin: 60px auto 0; display: block; cursor: pointer;}



.footer{ padding-bottom: 70px;}

.footer .email{ padding: 70px 0; background: #e4e5e7;}

.footer .email .tit h3{ font-size: 18px; font-weight: normal; color: #333;}

.footer .email .tit h2{ font-size: 48px; color: #333;}

.footer .email .con p{font-size: 18px; font-weight: normal; color: #333; margin-bottom: 8px;}

.footer .email .con ol{ border-bottom: #333 solid 1px; position: relative;}

.footer .email .con ol input{ width: 100%; height: 45px; border: none; background: none; font-size: 18px;}

.footer .email .con ol button{ width: 32px; height: 45px; border: none; background: url(../images/icon07.png) no-repeat center; position: absolute; right: 0; top: 0; cursor: pointer;}

.footer .fmain{ padding: 70px 0 20px;}

.footer .fmain .tit{ font-size: 20px; color: #000; font-weight: bold; line-height: 2; border-bottom: #c9d1dd solid 1px; margin-bottom: 15px;}

.footer .fmain .fnav .item{ width: 290px; margin-right: 70px;}

.footer .fmain .fnav .item .box a{ font-size: 16px; color: #666; font-weight: 300; display: block; margin-bottom: 10px;}

.footer .fmain .fnav .item .box a:hover{ color: #f3b259;}

.footer .fmain .fcontact{ width: 290px;}

.footer .fmain .fcontact .box{ font-size: 16px; color: #666; font-weight: 300;}

.footer .fmain .fcontact .box ul li{ margin-bottom: 10px; padding-left: 25px; position: relative;}

.footer .fmain .fcontact .box ul li i{ position: absolute; left: 0; top: 0;}

.footer .share{ padding: 25px 0;}

.footer .share a{ margin: 0 6px;}

.footer .copyright{ color: #666; text-align: center; font-weight: 300;}

.footer .copyright .box{ padding: 18px 0; border-top: #c9d1dd solid 1px;}



/*===/分页=============================*/

.fenye { text-align: center; font-size: 15px; width: 100%; height: 40px; margin: 10px 0 0px;}

.fenye .prev, .fenye .next { width: 40px; height: 40px; line-height: 40px; color: #8a8a8a;margin-right: 5px; display: inline-block; font-family: "宋体";font-size: 17px; background: #fff; border: #EBEBEB solid 1px;border-radius: 6px;}

.fenye a { width: 40px; height: 40px; line-height: 40px;  color: #8a8a8a; margin-right: 5px;display: inline-block; background: #fff; border: #EBEBEB solid 1px; border-radius: 6px;}

.fenye a:hover {color: #fff; background: #242a34; border: #242a34 solid 1px;}

.fenye a.current { color: #fff;  background: #242a34; margin-right: 5px; border: #242a34 solid 1px;}



/*搜索框*/

.search-dialog-box{display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 999999999;}

.search-dialog-box .black{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, .8);}

.search-dialog{position: absolute;left:50%;top:50%;box-sizing:border-box;width: 680px;padding: 20px 30px;transform: translate(-50%,-50%);background-color: #fff;box-shadow: 0 0 10px rgba(0,0,0,.33);border-radius:50px;}

.search-dialog input[type=text]{float: left;width: 86%;border: none; padding: 0;font-size:18px;line-height: 28px; height:28px;color: #999; background-color: #fff;border-radius: 0;}

.search-dialog input[type=submit] {float: right; width:28px; height:28px; background-repeat: no-repeat; background-position: center; background-size: 100%; border: none; padding: 0; background-image: url(../images/search-btn.png);background-color: transparent; cursor: pointer;}



/* 弹出框 */

.tccBox{display: none; position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 999999;}

.tccBox .black{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, .8);}

.tccBox .BoxCon{padding: 20px;position: absolute;left:50%;top:50%;box-sizing:border-box;transform: translate(-50%,-50%); color: #999;}

.tccBox .BoxCon .off{ width: 29px; height: 29px; background:url(../images/off.png) no-repeat center; position: absolute; top: -15px; right: -15px; cursor: pointer;}

.tccBox .BoxCon ul video{ max-width: 1000px;}





@media (max-width: 1680px) {

}



@media (max-width: 1550px) {

.wrap{ width: 100%; padding: 0 50px;}



.indexThree { padding: 80px 50px 100px;}

.why .con{ padding: 0;}

.honor .con{ padding: 0;}

.products { padding: 50px 50px 100px;}



}



@media (max-width: 1440px) {

body{ font-size: 16px;}

.wrap{ padding: 0 30px;}



.title h2 { font-size: 36px;}

.ntitle h2{ font-size: 36px;}



.more { padding: 0 70px 0 20px; font-size: 14px; line-height: 45px;}



.neiBanner .bannerText h3{ font-size: 40px;}



.indexOne .con { padding: 30px 30px;}

.indexOne .con .tit{ font-size: 36px;}

.indexOne .con .text{ margin-bottom: 50px;}

.indexTwo .box ul li .item .tit{ font-size: 26px;}

.indexThree { padding: 80px 30px 100px;}



.indexFour .inews .con dd{ margin-bottom: 20px;}

.indexFour .inews .tit h2{ font-size: 30px;}

.indexFour .inews .con h3{ margin-bottom: 15px;}



.about .con .tit{ font-size: 36px;}

.products { padding: 50px 30px 100px;}

.proview .proHead .con .text{ height: 320px; overflow-y: auto;}

.video ul li ol h3{ font-size: 18px;}



.contact .text{ font-size: 20px;}



.message .box ul li input{ line-height: 56px;}



.footer { padding-bottom: 30px;}

.footer .email .tit h2{ font-size: 40px;}

.footer .fmain { padding: 50px 0 20px;}

}



@media (max-width: 1366px) {

    .indexFour .inews{ padding: 35px;}

    .indexFour .inews .con dd{ margin-bottom: 10px;}

    .indexFour .inews .con dt{ height: 40px; line-height: 20px;}

}



@media (max-width: 1300px) {

body{ font-size: 15px;}

}



@media (max-width: 1240px) {

.wrap{ padding: 0 20px;}





.header .nav>ul>li>a{ font-size: 16px;}



.title { margin-bottom: 36px;}

.title h2 { font-size: 30px;}



.indexOne{ padding-bottom: 50px;}

.indexOne .con .tit{ font-size: 30px; margin-bottom: 20px;}

.indexOne .con .text{ line-height: 1.6; margin-bottom: 30px;}



.indexTwo .title h2{ font-size: 30px;}

.indexTwo .box ul li .item a{ padding: 150px 30px 0;}

.indexTwo .box ul li .item a:hover { padding: 130px 30px 0;}

.indexTwo .box ul li .item .tit { font-size: 22px;}



.indexThree { padding: 60px 20px 80px;}

.indexThree .box { margin-bottom: 50px;}



.indexFour .inews .tit h2 { font-size: 25px;}



.about .con .tit { font-size: 30px;}



.products { padding: 50px 20px 100px;}



.news ul { margin: 0 -20px;}

.news ul li{ padding: 0 20px; margin-bottom: 40px;}

.news ul li .tit h3{ font-size: 18px;}

.news ul li .text{ font-size: 15px;}



.video ul { margin: 0 -20px;}

.video ul li{ padding: 0 20px; margin-bottom: 40px;}



}



@media (max-width: 1030px) {



    .header .wrap{ height: 120px;}

    .header .logo{ height: 120px;}

    .header .nav>ul>li>a {font-size: 15px; }

    .header .nav>ul>li:nth-child(4) { margin-right: 130px; }

    .header .search input{ width: 100px;}



    .banner { margin-top: 122px; }



    .neiBanner{ height: 320px;}

    .neiBanner .bannerText h3 { font-size: 30px; }



    .ntitle h2 { font-size: 26px; }



    .indexOne .con .tit{ font-size: 26px;}



    .indexThree .box ul li a{ padding: 15px;}

    .indexThree .box ul li h3{ font-size: 15px;}



    .indexFour .picBox .swiper-slide dl{ padding-bottom: 55%;}



    .about { padding: 60px 0 0; }

    .about .con { padding-right: 35px; }

    .about .con .tit { font-size: 26px; }

    .about .con .text{ line-height: 1.8; margin-bottom: 0;}



    .products .box ul li a{ padding: 15px;}

    .products .box ul li h3{ font-size: 15px;}



    .proview .proHead .con{ padding: 0;}

    .proview .proHead .con .tit h1{ font-size: 20px;}
    .proview .proHead .con .text{ height: 200px; overflow-y: auto;}


    .contact .text{ font-size: 18px;}



    .footer .fmain .fnav .item{ width: 270px; margin-right: 50px;}

    .footer .fmain .fnav .item .box a{ font-size: 15px; margin-bottom: 5px;}

    .footer .fmain .fcontact{ width: 270px;}

    .footer .fmain .fcontact .box{ font-size: 15px;}

}



@media screen and (max-width:750px){

    body{ font-size: 14px; padding-top: 60px;}

    .wrap{ width: 100%; padding: 0 15px;}



    .mt{ margin: 0;}



    .header{ width: 100%; height:60px; background:#fff; box-shadow: 0 0 3px rgba(0, 0, 0, .3);  position: fixed; top: 0; left: 0; z-index: 99999999; }

    .header .wrap{ height: 60px;}

    .header .logo{ height: 60px; padding: 7px 0; position: relative; transform: inherit; left: 0;}

    .header .nav{  position: fixed; top: 60px; left: 0; width: 100%; height: calc(100vh - 60px);  background: #fff; display: none;}

    .header .nav>ul{ display: block;  position: relative; z-index: 111;}

    .header .nav>ul>li{ margin-right: 0; line-height: 46px; border-bottom: #eee solid 1px; float: none;}

    .header .nav>ul>li>a{ padding: 0 15px; font-size: 15px; display: block;}

    .header .nav>ul>li>a.tit::before{right: 15px;}

    .header .nav>ul>li:nth-child(4){ margin-right: 0;}

    .header .subnav{ width: 100%; background: #f8fcff; position: relative; left: 0; top: 0; transform: inherit; box-shadow:inherit; padding: 15px;}

    .header .lang::before{ display: none;}

    .header .lang>a{ padding:0 15px; line-height: 50px;}

    .header .lang .subnav{ width: 100%; display: block;}

    .header .search { padding: 0 15px; margin-top: 10px;}

    .header .search input { width: calc(100% - 35px); }



    .header .menu-toggle{ width:60px; height:60px; position:absolute; right:0; top:0; z-index:99999; display:block;}

    .header .menu-toggle span{ width:35px; height:2px; background:#000;display:block; position:relative; opacity:1;transition:all 300ms; margin:30px 0 0 12px;}

    .header .menu-toggle span:before{ content:"";width:35px; height:2px; background:#000;display:block; position:absolute; left:0; top:-10px;transition:all 300ms;}

    .header .menu-toggle span:after{ content:"";width:35px; height:2px; background:#000;display:block;position:absolute; left:0; top:10px;transition:all 300ms;}

    .header .menu-toggle.cur span{background-color:transparent;}

    .header .menu-toggle.cur span:before{transform:rotate(45deg); top:0px;}

    .header .menu-toggle.cur span:after{transform:rotate(-45deg); top:0px;}



    .banner { margin-top: 0; }

    .banner .swiper-button-prev, .banner .swiper-button-next { width: 28px; height: 28px;}

    .banner .shubiao{ display: none;}



    .neiBanner{ height: 130px;}

    .neiBanner .bannerText{ padding-top: 0;}

    .neiBanner .bannerText h3 { font-size: 22px; text-align: center;}



    .title{ margin-bottom: 30px;}

    .title h2{ font-size: 24px;}



    .ntitle{ margin-bottom: 30px;}

    .ntitle h2 { font-size: 22px; line-height: 1.2; }

    .ntitle dt{ margin-top: 15px;}



    .more { padding: 0 60px 0 15px; font-size: 13px; line-height: 40px; }



    .indexOne{ display: block; padding-bottom: 0;}

    .indexOne .con{ width: 100%; padding: 30px 15px 30px;}

    .indexOne .con .tit { font-size: 20px; }

    .indexOne .pic{ width: 100%;}



    .indexTwo{ padding: 45px 0 30px;}

    .indexTwo .title{ position: relative; top: 0;}

    .indexTwo .title h2 { font-size: 24px; }

    .indexTwo .box ul li{ width: 50%;}

    .indexTwo .box ul li .item a { height: 210px; padding: 20px 10px 0; }

    .indexTwo .box ul li .item a:hover { padding: 30px 10px 0; }

    .indexTwo .box ul li .item a:hover .more{ display: none;}

    .indexTwo .box ul li .item i{ height: 30px; display: block;}

    .indexTwo .box ul li .item .tit { font-size: 16px; }

    .indexTwo .box ul li .item .text{ font-size: 13px; text-align: center; margin-bottom: 0;}



    .indexThree { padding: 45px 15px 55px; }

    .indexThree .box { margin-bottom: 30px; }

    .indexThree .box ul{ margin: 0 -5px;}

    .indexThree .box ul li{ width: 50%; padding: 0 5px; margin-bottom: 10px;}

    .indexThree .box ul li:nth-child(5){ display: none;}

    .indexThree .box ul li dl img { padding: 5px;}



    .indexFour{ display: block;}

    .indexFour .picBox{ width: 100%;}

    .indexFour .inews{ width: 100%; padding: 25px;}

    .indexFour .inews .tit h2 { font-size: 20px; }

    .indexFour .inews .con h3{ font-size: 16px;}

    .indexFour .inews .con dd{ font-size: 15px;}

    .indexFour .inews .con dt{ font-size: 15px;}

    .indexFour .inews .con dl{ font-size: 14px;}



    .neiNav a { line-height: 45px; margin: 0 8px; padding: 0 5px; }

    .neiNav a.on::before{ height: 2px;}



    .about { padding: 40px 0 0; }

    .about .wrap{ display: block;}

    .about .con{ width: 100%; padding: 0; margin-bottom: 25px;}

    .about .con .tit { font-size: 20px; margin-bottom: 20px;}

    .about .pic{ width: 100%;}



    .num { padding: 45px 0; }

    .num ul li{ width: 50%; margin-bottom: 10px;}

    .num ul li i{ height: 30px;}

    .num ul li ol { margin-left: 10px;}

    .num ul li h3 b { font-size: 23px; }



    .why { padding: 45px 0 70px; }

    .why .box { margin: 0 ;}

    .why .box .item{ width: 50%; padding: 0;}

    .why .box .item .textBox ol h3{ font-size: 16px;}

    .why .box .item .textBox ol dt{ font-size: 14px; line-height: 1.2;}



    .honor { padding: 45px 0 70px; }

    .honor .box ul { margin: 0 -5px;}

    .honor .box ul li{ width: 50%; padding: 0 5px; margin-bottom: 10px;}

    .honor .box ul li h3{ font-size: 14px; margin-top: 5px;}



    .products { padding: 20px 15px 70px; }

    .products .box ul { margin: 0 -5px;}

    .products .box ul li{ width: 50%; padding: 0 5px; margin-bottom: 10px;}

    .products .box ul li a { padding: 10px; }

    .products .box ul li dl img{ padding: 5px;}

    .products .box ul li h3 { font-size: 14px; }



    .proview { padding: 10px 0 50px; }

    .proview .proHead{ display: block;}

    .proview .proHead .pic{ width: 100%; padding: 0; margin-bottom: 10px;}

    .proview .proHead .con{ width: 100%; display: block;}

    .proview .proHead .con .tit{ margin-top: 20px;}

    .proview .proHead .con .tit h1 { font-size: 18px; }

    .proview .proHead .con .text{ height: auto; overflow-y: inherit; padding-right: 0;}

    .proview .proCon { padding: 30px 0; }

    .proview .proCon .tabNav { margin-bottom: 20px; }

    .proview .proCon .tabNav li { width: 125px; height: 40px; line-height: 40px; margin-right: 10px;}



    .news { padding: 20px 0 50px; }

    .news ul{ margin: 0 0 20px;}

    .news ul li{ width: 100%; padding: 0; margin-bottom: 10px;}

    .news ul li a { padding: 20px 20px 50px;}

    .news ul li a::before{ width: 20px; height: 20px; right: 20px; bottom: 20px;}

    .news ul li .tit h3 { font-size: 17px; }

    .news ul li .text { height: 80px; font-size: 14px; line-height: 20px; }



    .newsView { padding: 10px 0 50px; }

    .newsView .newsHed h1{ font-size: 18px;}

    .newsView .text {padding: 30px 0;line-height: 1.7;}



    .video { padding: 20px 0 70px; }    

    .video ul { margin: 0 0 20px; }

    .video ul li{ width: 100%; padding: 0; margin-bottom: 15px;}

    .video ul li ol{ padding: 16px;}

    .video ul li ol h3 { font-size: 17px; line-height: 1.3; margin-bottom: 10px;}

    .video ul li ol dd{ font-size: 14px;}

    .video ul li ol dt{ width: 20px; height: 20px;}



    .contact .box{ padding: 0;}

    .contact .text { font-size: 16px; }

    

    .message .box {padding: 0px 0 70px;}

    .message .box ul p{ margin-bottom: 10px;}

    .message .box ul li{ width: 100%; margin-bottom: 15px;}

    .message .box ul li input { line-height: 45px;  font-size: 14px;}

    .message .box ul ol textarea{ height: 140px; font-size: 14px; line-height: 1.6;}

    .message .box ul button { width: 160px; height: 40px; font-size: 15px; margin: 25px auto 0;}



    .footer{ padding: 0;}

    .footer .email{ padding: 40px 0;}

    .footer .email .wrap{ display: block;}

    .footer .email .tit h3{ font-size: 14px;}

    .footer .email .tit h2 { font-size: 22px; }

    .footer .email .con p{ font-size: 14px;}

    .footer .email .con ol input{ font-size: 15px;}

    .footer .email .con ol button{ background-size: 20px auto;}

    .footer .fmain{ display: none;}



    /*===/分页=============================*/

    .fenye { text-align: center; font-size: 14px; width: 100%; height: 40px; margin: 10px 0 0px;}

    .fenye .prev, .fenye .next { width: 34px; height: 34px; line-height: 32px; margin-right: 2px; font-size: 16px; }

    .fenye a { width: 34px; height: 34px; line-height: 32px; margin-right:2px;}

    .fenye a:hover {color: #fff; background: #242a34; border: #242a34 solid 1px;}

    .fenye a.current { color: #fff;  background: #242a34; margin-right: 2px; border: #242a34 solid 1px;}



    .tccBox .BoxCon{ width: 100%;}

    .tccBox .BoxCon ul video{ width: 100%;}

    .tccBox .BoxCon .off { width: 18px; height: 18px; top: -10px; right: 18px;}



    .search-dialog{ width: 95%;}

}