/* CSS Document */
*{box-sizing:border-box;}
body{background:#fff; font-family: '微软雅黑', sans-serif;}
body a {transition: 0.5s all; -webkit-transition: 0.5s all; -o-transition: 0.5s all; -moz-transition: 0.5s all; -ms-transition: 0.5s all;}
ul,li{    list-style: none;
    list-style-type: none;}
 body {margin: 0px; padding: 0px; font-family:"Microsoft YaHei"; background:#fff;}
body, td, th {font-family: "Microsoft YaHei"; font-size: 14px; color: #666;}
a {font-family: "Microsoft YaHei"; color: #666; text-decoration: none; cursor: pointer }
a:hover {color: #006db8;text-decoration: none; }
div, dl, dt, dd, ul, ol, li, form,h1,h2,h3 {margin: 0px; padding: 0px;}
ul, ol, li {list-style: none; list-style-type: none;}
img {border: 0px;}
.clear{ clear:both; padding:0px; padding:0px; line-height:0px;}
.clearfix:after {content: ".";display: block;font-size: 0;height: 0;line-height: 0;overflow: hidden;visibility: hidden;width: 0;}
.clearfix:after {clear: both;}
.time03{transition: all 0.3s ease-in-out; -webkit-transition: 0.3s ease-in-out; -ms-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out;}
.time05{transition:all  0.5s ease-in-out; -webkit-transition: 0.5s ease-in-out; -ms-transition: 0.5s ease-in-out; -o-transition: 0.5s ease-in-out;}



#header{height:80px; width:100%; box-shadow: 0px 0px 5px #006db8; position: fixed; background:#fff; z-index: 99;}
#header .logo{float:left; height:56px; margin:12px 0px;}
#header .logo img{height:56px;}
#header .nav{float:right;}
#header .nav ul li{float:left; line-height: 80px; width:100px; position: relative; overflow: hidden; height:80px; overflow: hidden;}
#header .nav ul li a{display: block;  position: absolute; z-index: 11; width:100%; text-align: center;}
#header .nav ul li .mask{width:100%; height:100%; position: absolute;  top: 0; left: 0; z-index: 1;  z-index:10; background-color:#006db8; transform: translateY(-201%);transition: all 0.8s ease; opacity:0;}
#header .nav ul li:hover .mask{transform: translateY(0); opacity:1;}
#header .nav ul li.act .mask{transform: translateY(0); opacity:1;}
#header .nav ul li:hover a{color:#fff;}
#header .nav ul li.act a{color:#fff;}

#banner{padding-top: 80px;}
#banner img{max-width:100%;}
.swiper-pagination-bullet-active-main{background:#006db8;}


.indexcontainer{width:100%; max-width: 1920px;}
.indexcontainer img{width:100%; max-width:960px;}

.indextitbox{margin:72px auto 42px; text-align: center;}
.indextitbox .tit{margin:0px auto; width:230px;}
.indextitbox .tit h2{font-size: 42px;  color:#006db8; float:left; height: 56px; text-align: center;}
.indextitbox .tit i{font-size: 42px; color:#006db8; line-height: 64px; float:left; margin-right:10px;}
.indextitbox p{font-size: 14px; margin-top:12px;}

.fl{float:left;}
.fr{float:right;}

.indexbox{position:absolute; top:50%; transform: translateY(-50%); padding:0px 36px;}
.indexbox h2{font-size: 32px;color: #2c2c2c; text-transform: capitalize; margin-bottom: 0.8em;}
.indexbox h2 i{font-size:32px; padding-right:6px;}
.indexbox p{font-size: 16px; line-height: 32px; color:#2c2c2c;}
.indexbox a{display: block; width:120px; text-align: center; height:40px; line-height: 40px; color:#2c2c2c; background: #fff; margin-top: 2em; font-weight: bold;}
.indexbox a:hover{background: #006db8; color:#fff;}
.indexbox a i{padding-left: 12px;}


#product{width:100%; margin-bottom: 72px;}

.proitem{width:100%; box-sizing:border-box; padding:10px; }
.proitem a{display: block; border:1px solid #bfbfbf;}
.proitem img{max-width:100%;} 
.proitem h4{text-align:center; width:100%; height: 56px; line-height:56px; background: #eeeeee; color:#000;}
.proitem:hover h4{background: #006db8; color:#fff;}
.procon{line-height:28px;}
.procon img{max-width: 100%;}
.procon p{line-height:28px;}


#case{background: #f8f8f8; padding:1px 0px 72px;}
#case .caseitem{position: relative;}
.caseitem1{z-index:1;}
.caseitem2{z-index:2; margin-left:-30px; margin-top:60px;}
.caseitem3{z-index:3; margin-left:-30px; margin-top:0px;}
.caseitem4{z-index:4; margin-left:-30px; margin-top:60px;}
#case .caseitem h4{position:absolute; left:0px; bottom: 0px; width:100px; text-align: center; height:48px; line-height:48px; background: #006db8; color:#fff; font-size: 16px; font-weight: bold;}


.footeritem{margin-bottom: 12px;}
.footeritem h4{font-size: 16px;  color:#006db8; float:left; line-height: 32px; text-align: center;}
.footeritem i{font-size: 18px; color:#006db8; line-height: 32px; float:left; margin-right:10px;}

#footer{background: #f8f8f8; padding: 1px 0px 72px;}
#footer input{ box-sizing: border-box; width: 100%; padding:0px 24px; height:48px; border-radius:0; background-color:transparent; color:#666; font-size:12px;  margin-bottom:0px; border:1px solid #ccc; background: rgba(255, 255, 255, 0.05);}
#footer input::-webkit-input-placeholder{font-size:12px; line-height:30px; color: #6e6e6e; text-align: left;} 
#footer .text-content{box-sizing: border-box; width:100%; padding-left:24px; display: block; height:100px; padding-top: 10px; background-color:transparent; color:#666; border:1px solid #ccc;background: rgba(255, 255, 255, 0.05);}
#footer .text-content::-webkit-input-placeholder{color:#6e6e6e;}
#footer input.liuyan_btn{background:#006db8; border-radius: 10px; color:#fff; font-size: 16px;}
#footer .ewm{max-width: 80%; float:right;}

#copyright{background: #d9d9d9; line-height:48px;}
#copyright .support{text-align: right;}

.btn-menu{display: none;}

@media (max-width:1400px) {
	.indextitbox{margin:56px 0px 32px;}
	.indextitbox .tit h2{font-size: 36px; height: 44px;}
	.indextitbox .tit i{font-size: 36px; line-height: 52px;}

	.indexbox h2{font-size: 24px;}
	.indexbox h2 i{font-size: 24px;}
	.indexbox p{font-size: 14px; line-height: 2em;}
	.indexbox a{margin-top: 1.5em; height:36px; line-height: 36px;}
}
@media (max-width:1024px) {
	#case .caseitem img{width:260px;}
	.proitem h4{overflow: hidden;}
}

@media (max-width:768px) {
	.btn-menu { display:block; float: right; position: relative;  z-index: 111; background: transparent; cursor: pointer; padding: 24px 0; width: 26px; height: 16px; -webkit-transition: all ease .238s; -moz-transition: all ease .238s; transition: all ease .238s;}
	.btn-menu:before, .btn-menu:after, .btn-menu span { background-color: #006db8; -webkit-transition: all ease .238s; -moz-transition: all ease .238s; transition: all ease .238s; }
	.btn-menu:before, .btn-menu:after { content: ''; position: absolute; top: 0; height: 2px; width: 100%; left: 0; top: 50%; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }
	.btn-menu span { position: absolute; width: 100%; height: 2px; left: 0; top: 50%; overflow: hidden; text-indent: 200%; }
	.btn-menu:before { -webkit-transform: translate3d(0, -7px, 0); transform: translate3d(0, -7px, 0); }
	.btn-menu:after { -webkit-transform: translate3d(0, 7px, 0); transform: translate3d(0, 7px, 0); }
	.btn-menu.active span { opacity: 0; }
	.btn-menu.active:before { background-color: #006db8; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); }
	.btn-menu.active:after { background-color: #006db8; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); }

	#header{height:50px;}
	#header .logo{height:42px; margin:4px 0px;}
	#header .logo img{height:42px;}

	#header .nav{float:none;display:none; background:#fff; width:100%; box-shadow: 0px 0px 5px #006db8;}
	#header .nav ul li{float:none; line-height: 48px; width:100%; position: relative; overflow: hidden; height:48px; overflow: hidden;}
	#header .nav ul li a{display: block;  position: absolute; z-index: 11; width:100%; text-align: center;}
	#header .nav ul li .mask{width:100%; height:100%; position: absolute;  top: 0; left: 0; z-index: 1;  z-index:10; background-color:#006db8; transform: translateY(-201%);transition: all 0.8s ease; opacity:0;}
	#header .nav ul li:hover .mask{transform: translateY(0); opacity:1;}
	#header .nav ul li.act .mask{transform: translateY(0); opacity:1;}
	#header .nav ul li:hover a{color:#fff;}
	#header .nav ul li.act a{color:#fff;}

	#banner{padding-top: 50px;}

	.indextitbox{margin: 32px 0px 18px;}
	.indextitbox .tit{width:132px;}
	.indextitbox .tit h2{font-size: 24px; height: 32px;}
	.indextitbox .tit i{font-size: 24px; line-height: 36px;}
	.indextitbox p{font-size: 10px; padding: 0px 15px;}

	.indexbox{padding:0px 15px;}
	.indexbox h2{font-size: 16px;}
	.indexbox h2 i{font-size: 16px;}
	.indexbox p{font-size: 10px; line-height: 2em;}
	.indexbox a{margin-top: 0.6em; height:24px; line-height: 24px; width:80px; font-size:10px}

	.proitem h4{height:42px; line-height: 42px;}
	#product{margin-bottom: 36px;}
	#case .caseitem img{width:100%;}
	.caseitem2,.caseitem3,.caseitem4{margin:0px;}

	#case{padding-bottom:32px;}
	#footer .ewm{float:none; display:block; margin:12px auto;}
	#footer{padding-bottom: 32px;}

	#copyright{line-height:36px; font-size: 12px; text-align: center;}
	#copyright .support{text-align: center;}
}






.pagecon{padding:64px 48px 64px 0px; font-size: 15px; line-height:48px; color:#444;}
.pagecon p{text-indent: 2em;}
.pc{display: block;}
.mob{display: none;}

.page_nav{width:100%; background: #f8f8f8; padding: 20px 0 10px; position: relative;}
.nav_tit{padding-top: 38px; padding-left: 40px; position: absolute; left:0; top:-150px; height: 150px; width: 100%; background:#006db8; -webkit-background-size: cover; background-size: cover;}
.nav_tit h3{font-size: 24px;color: #fff;text-transform:uppercase;font-family: 'frandcm';}
.nav_tit h3{ font-size: 24px; color: #fff; text-transform:uppercase; font-family: 'frandcm';}
.nav_tit p{ color: #fff; font-size: 16px; position: relative; padding-bottom: 30px;}
.nav_tit p::after{ content: ""; width: 25px; height: 5px; background: #ddbd84; position: absolute; left:0; bottom:0;}

.page_nav li{ line-height: 35px; margin-bottom: 8px;}
.page_nav li i{ padding-right: 7px; color: #f8f8f8;}
.page_nav li a{ display: block; font-size: 16px; color: #000; padding-left: 10px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding-right: 5px;}
.page_nav li.sub_nav a{color: #fff; background: #006db8;}
.page_nav li.sub_nav i{color: #fff;}
.page_nav.page_navfix{position: fixed;z-index: 99; max-width:190px; top:230px;}

.new_inside{width:100%; padding: 64px 0px 64px 0px;}
.new_inside ul{width:100%;padding:0;}
.new_inside ul li{background:#ffffff;display:block;padding:24px;-webkit-transition: all .25s;-moz-transition: all .25s;-ms-transition: all .25s;-o-transition: all .25s;transition: all .25s;box-shadow: 0px 0px 20px 0px #eaeaea;margin-bottom:20px;position:relative;}
.new_inside ul li .news_time{position:absolute;left:24px;top:24px;width:90px;text-align:center;background:#666;padding:10px 0;overflow:hidden;border-radius:4px 0 4px 0;}
.new_inside ul li .news_time p{font-size:24px;font-weight:bold;color:#fff;}
.new_inside ul li .news_time span{font-size:14px;color:#fff;}
.new_inside ul li .news_con{padding-left:110px;}
.new_inside ul li .news_con p{font-size:15px;font-weight:bold;color:#515671;overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
.new_inside ul li .news_con span{display:block;font-size:14px;color:#999;line-height:22px;padding-top:5px;height:45px;overflow:hidden;}
.new_inside ul li:hover p a{ color:#006db8;}
.new_inside ul li:hover .news_time{ background:#006db8;}
.new_inside ul li:hover{cursor: pointer; box-shadow: 0px 0px 20px 0px #006db8}

.new_view{margin:0 auto; padding: 44px 0px 64px 0px;}
.new_view .title{ font-size:32px;font-weight:normal;padding:20px; text-align:center;}
.new_view .time{text-align:right; font-size:16px; color:#999;padding:0 20px 20px 20px; border-bottom:1px solid #eee;}
.new_view .content{margin:0 auto;padding:50px 0;}
.new_view .content{ font-size:16px; line-height:36px; color:#666;}
.new_view .content p{text-indent: 2em;}





#productbox{ padding: 64px 24px 64px 0px; width:100%;}
.proimg{position: relative; -webkit-transition: ease-in-out .3s; -o-transition: ease-in-out .3s; transition: ease-in-out .3s;}
.proimg_hover{ position: absolute; left:0; top:0; width: 100%; height: 100%; background:rgba(0,0,0,.6); opacity: 0; -webkit-transition: ease-in-out .3s; -o-transition: ease-in-out .3s; transition: ease-in-out .3s; text-align: center;}
.protit{ font-size: 14px; color: #666; padding:25px 0 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: center;}
.proimg_hover::after{ content: ""; display: inline-block; vertical-align: middle; height: 100%;}
.proimg_hover i{ display: inline-block; vertical-align: middle; color: #fff; font-size: 30px; margin:0px auto;}
.proitem:hover .proimg_hover{opacity: 1;}
.proitem:hover a{ -moz-box-shadow:0px 0px 8px #ccc;  -webkit-box-shadow:0px 0px 8px #ccc;  box-shadow:0px 0px 8px #ccc;}
.proitem .line{margin-top: 0px; width:0px; height:2px; background-color: #fff; transition: all 0.8s ease;}
.proitem:hover .line{ background-color: #006db8; width: 100%;}

.pro_name{font-size: 24px; color: #444; padding: 10px 0 25px;}
.product_detail{padding: 64px 48px 64px 0px;}
.product_detail .product_detail_img{border:1px solid #ddd;}
.prodesc{}
.cat_name{padding: 10px 0 25px; color:#006db8;}
.prodesc .desc{width:100%; padding:24px; background: #f2f2f2; border-radius: 12px;}
.prodesc .desc span{display:block; line-height:42px; font-size: 14px;}
.prodesc .desc span i{padding-right: 8px; font-size:16px; color:#006db8;}
.prodesc .pro_btn{padding-top:30px;overflow:hidden;}
.prodesc .pro_btn1{display:block;width:100%;margin-right:20px;height:55px;line-height:55px;text-align:center;font-size:16px;color:#fff;background:#006db8;border-radius:2px;float:left;border:1px solid #fff;}
.prodesc .pro_btn1:hover{background:#fff;border:1px solid #006db8;color:#006db8;}
.prodesc .pro_btn1 em{font-style: normal;}

.product_con{padding-right:0px; margin-top: 24px;}
.product_con .prod_tit{display: block; margin: 10px 0; padding: 0; border: 0px solid #006db8; border-left-width: 6px; background-color: #f2f2f2; color: #006db8; font-weight: bold; font-family: Courier New; line-height: 48px; padding-left: 12px;}

.prevpage{ padding-top: 38px; text-align: center;}
.prevpage a{ display: inline-block; vertical-align: middle; width: 120px; line-height: 34px; text-align: center; border:1px solid #c9c9c9; margin:0 10px;}
.prevpage a i{ font-size: 20px; padding:0 10px; display: inline-block;line-height: 38px;}


#workshop{}
#workshop img{max-width:100%;}
.workshopitem{}
.workshopitem img{border:1px solid #ddd;}
.workshopitem .tit{line-height:48px; text-align: center; overflow: hidden; height: 48px; margin-bottom: 0px; font-size: 14px;}
#news{padding-bottom: 72px;}
.indexnewsitem{padding:12px;}
.indexnewsitem a{display:block; border: 1px solid #ddd; padding:0px;}
.indexnewsitem img{max-width: 100%;}
.indexnewsitem .newscon{padding:12px;}
.indexnewsitem .newscon h3{font-size:18px; line-height: 36px; height: 36px; overflow: hidden;}
.indexnewsitem .newscon p{line-height:32px; font-size: 14px; margin-top:8px; height:96px; overflow: hidden;}
.indexnewsitem .newscon .newsmore{}
.indexnewsitem .newscon .newsmore span{ position:relative;z-index:100;}
.indexnewsitem .newscon .newsmore{width:124px; position:relative; border:0px solid #cdcdcd; color:#fff; background:#303030; transition:all .35s; height: 32px; line-height: 32px; text-align: center; border-radius: 16px; font-size:14px; display: block; margin:12px 0px 0px; float: right}
.indexnewsitem .newscon .newsmore:after{ position:absolute;z-index:99; left:0; bottom:0; width:100%;height:0; opacity:0; background:#006db8;border-radius: 16px; border:0px solid #cb1218; content:''; transition:all .35s;}
.indexnewsitem .newscon .newsmore:hover{border:0px solid #cb1218; color:#fff;}
.indexnewsitem .newscon .newsmore:hover:after{ height:100%;opacity:1;}
.indexnewsitem .newscon .newsmore:hover{border:0px solid #cb1218; color:#fff;}
.indexnewsitem .line{margin-top: 42px; width:0px; height:2px; background-color: #fff; transition: all 0.8s ease;}
.indexnewsitem:hover .line{ background-color: #006db8; width: 100%;}
.indexnewsitem:hover .newscon .newsmore:after{ height:100%;opacity:1;}
.indexnewsitem:hover h3{color:#666;}
.indexnewsitem:hover p{color:#666;}

#dituContent{min-height: 400px;}

@media (max-width:768px) {
	.pagecon{padding: 36px 0px; font-size: 12px; line-height: 28px;}
	.nav_tit{top:0px;}
	.page_nav{display: none;}

	.product_detail{padding:36px 0px;}

	.new_view .title{font-size:18px;}
	.new_view{padding:12px 0px 32px;}
	.new_view .content{font-size: 12px;}
	.prevpage a{width:80px;}
	.prevpage a i{font-size: 12px; padding:0px 0px 0px 0px;}
	.prevpage a:nth-child(2) i{font-size: 24px;}

	#productbox{padding:32px 0px;}
	#productbox .layui-row{padding:0px 8px;}
	#productbox .layui-col-space24{margin:0px;}

	.protit{padding:12px 0px;}

	.prodesc .desc{padding:12px;}
	.prodesc .desc span{line-height: 32px;}
}


.page_list,.pagination{text-align: center; margin-bottom: 10px;}
.page {
	display:inline-block;
	font: 16px/28px '微软雅黑', sans-serif;
	*display:inline;
	:1;
	*zoom:1;}
.page span,.page strong {
	float:left;}
.page a,
.page span.disabled,
.page strong {
	background:#FFF;
	border:1px solid #CCC;
	color:#333;
	float:left;
	font: 16px/24px  '微软雅黑', sans-serif;
	margin-right:5px;
	min-width:15px;
	padding:4px 8px;
	text-align:center;
	vertical-align:middle;
	white-space:nowrap;
	_width:15px;}
	.page strong{background:#006db8; color:#fff; }
.page a:hover {
	border:1px solid #006db8;
	color:#006db8;
	text-decoration:none;}
.page span.disabled {
	background:#FFF;
	border:1px solid #CCC;
	color:#CCC;}
.page span.ellipsis {
	float:left;
	font: 16px/24px '微软雅黑', sans-serif;
	line-height:22x;
	margin-right:5px;}
.page .page_txt {
	line-height:20px;
	float:right;
	width:auto;}
.page a.page-curpage {
	background:#3561db;
	border:1px solid #3561db;
	color:#FFF;
	font-weight:bold;}
.page input {
	font: 14px Verdana;
	padding:0 0 0 1px;
	width:40px;
	height:14px;}
