body{background: #FFF;}
/*导航部分*/
.nav{width: 100%; height: 80px; box-shadow: 0 3px 3px 0 #CCC; background: #1A86FF;left: 0; top: 0; z-index: 999; overflow: hidden; transition: 0.3s}
.nav.index{background: rgba(255, 255, 255 ,0.8); box-shadow: 0 0 0 0 rgba(0,0,0,0.05);}
.nav.scroll{ background: #FFF; box-shadow: 0 3px 3px 0 rgba(0,0,0,0.05); transition: 0.3s}
.nav .layui-container{position: relative; transition: all 400ms ease-out;}
.nav .nav-logo{height: 100%; position: absolute; top: 0; right:25%; line-height: 80px;}
.nav .nav-list{display: inline-block; height: 80px;}
.nav .nav-list button{width:25px; height:34px; position: absolute; top:25px; left: 15px; background-color: transparent; border: none; outline: none; cursor: pointer;}
.nav .nav-list button .history{ width: 18px; height: 34px; display: block;background: url(../image/topleft.png) no-repeat center top; background-size: cover;}
.nav .layui-nav{width: 100%; position: absolute; top: 80px; right: 0; color: #000; background: transparent;}
.nav .layui-nav .layui-nav-item{display: block; line-height: 60px;}
.nav .layui-nav *{font-size: 18px;}
.nav .layui-nav .layui-nav-item a{padding: 0 0; color: #000;}
.nav .layui-nav-bar,
.nav .layui-nav .layui-this:after{height: 2px; background-color: #2db5a3;}
.nav .layui-nav .layui-this a
,.nav .layui-nav .layui-nav-item a:hover{color: #2db5a3;}

/*轮播*/
.topbanner{margin: 0 auto; width: 100%; text-align: center;}
.topbanner img{max-width:100%; height: auto;}

/*主体—产品*/
.main-product{padding-top: 0px; padding-bottom: 20px;}
.main-product p{font-size: 16px; color: #ababab; line-height: 28px;}
.main-product p.title
,.main-service p.title{color: #484848; font-size: 24px; text-align: center; line-height:80px;}
.main-product p.title span
,.main-service p.title span{color: #2db5a3;}
.main-product .content{border: 1px solid #DEDEDE; padding: 20px 16px 0 16px; text-align: center; transition: 0.3s;}
.main-product .content p.label{font-size: 18px; color: #939393; line-height:40px;}
.main-product .content .label a{font-size:18px; color: #939393;}
.main-product .content .slabel{font-size:16px; color: #939393; line-height: 22px; display: block; padding-bottom: 10px;}
.main-product .content:hover{box-shadow: 0 0 3px 3px #EEE; transition: 0.3s;}
.main-product .content img{transition: 2s; max-width: 120px; max-height: 120px;}
.main-product .content img:hover{transform: rotateY(180deg);}

/*主体-服务*/
.main-service{background: #f8f8f8;}
.main-service .content{position: relative;}
.main-service .content .content-left{width: 50%;}
.main-service .content .content-left img{width: 100%;}
.main-service .content .content-right{box-sizing: border-box; background: #FFF; padding:38px 40px 0 48px; width: 50%; height: 100%; position: absolute; top: 0; right: 0; transition: 0.3s; overflow: hidden;}
.main-service .content .content-right p{color: #adadad; line-height: 32px; overflow: hidden; text-overflow: ellipsis;}
.main-service .content .content-right p.label{font-size: 16px; color: #4a4a4a;}
.main-service .content .content-right span{display: block; width:65px; height: 2px; background: #2cb6a1; margin-bottom:10px;} 
.main-service .content .content-right:hover{box-shadow: 2px 2px 2px #EEE; transition: 0.3s;}
.main-service .service-more{padding-top: 80px; padding-bottom: 80px; text-align: center;}
.main-service .service-more a{padding: 10px 62px; font-size: 23px; line-height: 46px;color: #FFF; background: #7fd3c6; border-radius: 3px;}

/*底部*/
.footer{padding-bottom:30px; height: auto;background: #5e6664;}
.footer .footer-web{padding-top:20px; padding-bottom:15px;color: #a5aaa9; text-align: left !important;float: left; width: 100%;}
.footer .footer-web a{color: #a5aaa9; line-height: 22px; margin-right: 20px; transition: 0.3s;}
.footer .footer-web a:hover{color: #dce1e0; transition: 0.3s;}
.footer .footer-contact{color: #FFF;}
.footer .footer-contact .contact-top{line-height:22px;}
.footer .footer-contact .contact-bottom{line-height: 30px;}
.footer .footer-contact .footer-contact-images{padding-bottom:10px; padding-top: 10px;}
.footer .footer-contact .footer-contact-text{line-height:200%;}
.footer .footer-contact .footer-contact-text a{ color:#fff}

/** 产品 */
.banner{height: 320px; margin-top: 80px;}
.banner.product{background: url(../image/nav_img1.jpg) no-repeat center top; background-size: cover;}
.main.product{padding:10px 0 25px 0;}
.main.product .content{padding:20px 0; border-bottom: 1px solid #e8e8e8;}
.main.product .content .content-img{text-align:left;}
.main.product .content .content-img img{max-width:92%;}
.main.product .content .label{color: #565656; font-size: 30px; line-height: 42px; margin-top:0px;}
.main.product .content .detail{font-size: 16px; line-height: 28px; color: #d7d7d7; padding-bottom:0px;}
.main.product .content a{color: #a0d2cc; font-size: 16px; line-height: 38px; padding:10px 11px 10px 23px; border: 1px solid #a0d2cc; border-radius: 3px;}

/** 动态 */
.banner.news{background: url(https://ditufuwu.com/static/img/nav_img3.jpg) no-repeat center top; background-size: cover;}
.banner .title{padding-top: 170px;}
.banner .title.active{padding-top: 120px; transition: 1.5s;}
.banner .title p{color: #606060; font-size: 36px; text-align: center; line-height: 50px; letter-spacing: 5px;}
.banner .title p.en{font-size: 20px; letter-spacing: 3px;}
.main-news{padding: 70px 0 80px 0;}
.main-news .content > div{padding-bottom: 40px; border-bottom: 1px dashed #eaeaea; position: relative;}
.main-news .content .news-img{display: inline-block; width: 30%; vertical-align: top;}
.main-news .content .news-img img{max-width: 90%;}
.main-news .content .news-panel{display: inline-block; width: 70%; vertical-align: top; padding-left: 5px; box-sizing: border-box;}
.main-news .content .news-panel strong a{display: block; color: #555; font-size: 18px; line-height: 26px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}
.main-news .content .news-panel p.detail{color: #777; line-height: 24px;}
.main-news .content .news-panel p.read-push{color: #AAA; padding-top: 5px;}
.main-news #newsPage .layui-laypage{display: block; text-align: center; margin-top: 70px;}
.main-news #newsPage .layui-laypage a,.main-news #newsPage .layui-laypage span{font-size: 18px; line-height: 40px; height: 40px; margin-right: 20px; border-radius: 3px; color: #e3e3e3;}
/*动态详情页*/
.main-newsdate{margin-top:30px; text-align: center;}
.main-newsdate .news{text-align: left; line-height: 104px;}
.main-newsdate h1{padding-top: 6px;}
.main-newsdate .pushtime{color: #686868; font-size: 18px; line-height: 82px;}
.main-newsdate .introTop{padding-bottom: 28px; font-size: 18px; line-height: 20px; text-align: left;}
.main-newsdate .introBott{font-size: 18px; line-height: 42px; text-align: justify; padding: 40px 0 102px 0;}
.main-newsdate img{max-width: 100%;}


/** 案例 */
.banner.case{background: url(../image/nav_img2.jpg) no-repeat center top; background-size: cover;}
.main-case{padding: 10px 0 15px;}
.main-case .content{width: 48%; text-align: center; padding-top:20px; padding-bottom:10px; border-bottom: 1px solid #e6e6e6;}
.main-case .content.even{margin-left: 2%;}
.main-case .content .case-img{border: 1px solid #e2e2e2; overflow: hidden; max-width: 130px; max-height: 130px; border-radius:20px;}
.main-case .content .case-img img{width: 100%; transition: 2s;}
.main-case .content .case-img img:hover{transform: scale(1.2,1.2); transition: 2s;}
.main-case .content p.lable{padding-top: 13px; font-size: 30px; line-height:56px;}
.main-case .content p{font-size: 18px; line-height: 32px; color: #505050;}
.main-case #casePage .layui-laypage{display: block; text-align: center; margin-top: 100px;}
.main-case #casePage .layui-laypage a,.main-case #casePage .layui-laypage span{font-size: 18px; line-height: 40px; height: 40px; margin-right: 20px; border-radius: 3px; color: #e3e3e3;}

#previewdiv img{max-height: 100px; max-width: 100px;}
.map{height:400px;width:600px; max-width: 100%; max-height: 100%;}
.text-align-center{text-align: center;}
.msg-title{padding: 2em; font-size: 2em;}
.msg-title2{padding: 1em; font-size: 1.5em;}
.msg-content{padding:3em; padding-bottom: 5em; line-height: 200%;}
.clear{clear: both;}

@media screen and (max-width: 480px){
  .main-service .content .content-right{padding: 10px 10px 0 10px;}
  .main-service .content .content-right p{line-height:20px; font-size: 12px;}
  .main-news .content .news-panel p.read-push{font-size: 12px;}
  .main-case .content{padding-top: 20px;}
  .main-case .content p.lable{padding-top:0px; font-size: 18px; line-height: 38px;}
  .main-case .content p{font-size: 12px; line-height: 20px; color: #505050;}
  .main-about ul.aboutab{padding: 70px 0;}
  .main-about ul.aboutab li{padding: 0 15px; font-size: 16px; box-sizing: border-box;}
  .main-about .tabIntro .content .img{width: 100%;}
  .main-about .tabIntro .content .panel{width: 100%;}
  .main-about .tabIntro .content .panel.p_block{display: none;}
  .main-about .tabIntro .p_hidden{display: block;}
  .main-news #newsPage .layui-laypage a,.main-news #newsPage .layui-laypage span
  ,.main-case #casePage .layui-laypage a,.main-case #casePage .layui-laypage span{padding: 0 12px; font-size: 14px; line-height: 30px; height: 30px; margin-right: 4px;}
 .footer{padding-bottom:160px;}	
}
/*小屏幕*/
@media screen and (min-width: 768px){
  .nav{max-height: 80px;}
  .nav.index{background: rgba(255, 255, 255 ,0.3);}
  .nav .nav-list button{}
  .nav .layui-nav{width: auto; position: absolute; top: 0; padding: 0 5px; border-radius: 0; margin: 0;}
  .nav .layui-nav .layui-nav-item{display: inline-block; margin:0 53px; line-height: 80px;}
  .main-product p.title
  ,.main-service p.title{font-size: 36px; line-height: 116px;}
  .main.product .content .content-img{text-align: left;}
  .main-news .content .news-panel strong a{font-size: 20px; line-height: 30px;}
  .main-news .content .news-panel p.read-push{padding-top: 0; position: absolute; bottom: 40px;}
  .main-newsdate .pushtime{line-height: 142px;}
  .main-case .content{width: 45%;}
  .main-case .content.even{margin-left: 9%;}
  .main-about ul.aboutab li{padding: 0 32px; font-size: 24px; margin-left: 30px; line-height: 50px;}
  .main-about .tabIntro .content p{padding: 0 30px; font-size: 18px; line-height: 30px;}
  .main-about .tabJob .content p{font-size: 24px; line-height: 50px;}
  .main-about .tabJob .content p.title{font-size: 30px; line-height: 90px;}
  .main-about .tabJob .content ol li{font-size: 20px; line-height: 60px;}
  .main-about .tabCour .timeline:before{left: 50%;}
  .main-about .tabCour .timeline li{min-height: 195px; padding-top: 95px;}
  .main-about .tabCour .timeline li .cour-img{left: 50%; margin-left: -97.5px; width: 195px;}
  .main-about .tabCour .timeline li .cour-panel{padding-top: 55px; padding-left: 0;}
  .main-about .tabCour .timeline li.odd .cour-panel{text-align: right;}
}
@media screen and (min-width: 768px) and (max-width: 992px){
  .main.product .content div.right{padding-left: 20px;}
  .nav .layui-nav .layui-nav-item{margin:0 33px;}
  .main-service .content .content-right{padding: 10px 10px 0 15px;}
  .main-service .content .content-right span{margin-bottom: 20px;}
  .main-service .content .content-right p{line-height: 28px;}
  .main.product .content .label{line-height: 40px; margin-top: 0;}
  .main.product .content .detail{padding-bottom: 10px;}
}
/*大屏幕*/
@media screen and (min-width: 992px){
  .main.product .content{padding:30px 0;}
  .main.product .content div.right{padding-left: 0;}
  .main-news .content .news-img{width: 20%;}
  .main-news .content .news-panel{width: 80%;}
  .main-case .content{width:24%;}
  .main-case .content.even{margin-left: 0;}
  .main-case .content.center{margin-right: 3%; margin-left: 3%;}
  .main-about .tabIntro .content p{padding: 0 50px; font-size: 20px; line-height: 40px;}
}
/*超大屏幕*/
@media screen and (min-width: 1200px) {
  .main-news .content .news-img{width: 34%;}
  .main-news .content .news-panel{width: 65%;}
  .main-news .content:nth-child(odd){padding-right: 20px;}
  .main-news .content:nth-child(even){padding-left: 20px;}
  .main-about .tabCour .timeline li .cour-panel{padding-left: 50px;}
  .main-about .tabCour .timeline li.odd .cour-panel{padding-left: 0; padding-right: 50px;}
}
@media screen and (min-width: 1300px) {
  .layui-container{width: 1200px; padding: 0;}
  .main-about .tabJob .content:last-child{margin-bottom: 180px;}
  .nav .nav-logo{position: absolute; top: 0; right:43%;}
  .layui-col-space80{margin: -0px;}
  .layui-col-space80>*{padding: 0px;}
}
/*在线客服*/
.consult_contact {position: fixed; top: 200px; right: 0; width: 120px; margin: auto; cursor: pointer; z-index: 99;}
.consult_wrap{position:relative;width:110px;height:110px;margin:auto;margin-top:5px}
.consult_wrap .tip{position:absolute;right:91px;top:45px;display:none;width:164px;height:24px;border-radius:0 3px 3px 0;font-size:14px;line-height:24px;text-align:center;background:#3091f2;color:#fff;-webkit-transition:display 1s ease;transition:display 1s ease}
.consult_wrap .tip:after{
  position: absolute;
  right: -8px;
  top: 50%;
  content: "";
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 4px solid #3091f2;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.consult_contact img{
  position: absolute;
  left: 50%;
  top: 50%;
  width: auto;
  -webkit-transform: translate3d(-50%,-50%,0);
          transform: translate3d(-50%,-50%,0);
}
.consult_contact .staff_img{z-index: 999;border-radius: 100%;}
@keyframes ballRotate {
  0%{transform: rotate(0);}
  100%{transform: rotate(360deg);}
}
.consult_contact  .ball{top: 20px;width: auto;transform-origin: 0 38px;animation: ballRotate 2.5s infinite linear;z-index: 9999;}
@keyframes bg2Animation {
  0%{opacity: 0;}
  50%{opacity: 1;}
  100%{opacity: 0;}
}
.consult_contact .bg-2{animation:bg2Animation 2.5s infinite linear}
.consult_contact:hover .tip{display:block}
.contact_line_btn{position:relative;top:-25px;padding-bottom:30px}
.contact_line{width:2px;height:50px;background:#3091f2;margin:auto;margin-top:-25px}
.contact_btn{display:block;margin:auto;width:100px;line-height:28px;text-align:center;color:#fff;font-size:12px;background:#3091f2;border-radius:24px}
.contact_btn:hover, .contact_btn:link {color: #fff;}
.contact_group_btn {margin-top: -25px;}
.group_btn_box {position: relative;width: 50px;height: 50px;background: rgba(0, 0, 0, .6);margin: auto;margin-bottom: 10px;}
.group_btn_box:hover {background: rgba(0, 0, 0, .5);}
.group_btn_box > a {position: relative;display: block;width: 100%;height: 100%; text-align: center; line-height: 50px;}
.group_btn_box {line-height: 50px; text-align: center;}
.group_btn_box .layui-icon {color: #fff; font-size: 30px;}
.group_btn_box .layui-icon.layui-icon-top {font-size: 40px;}
.contact_group_btn > div:last-child {
  margin-bottom: 5px;
}
.hover_txt_box {display: none;align-items: center;position: absolute;top: 0;right: 49px;width: 154px;line-height: 60px;font-size: 16px;color: #fff;text-align: center;}
.phone_txt {width: 145px;background: rgba(0, 0, 0, .5);}
.qq_txt {}
.qq_txt a {display: block; height: 30px; line-height: 30px; overflow: hidden;}
.qq_txt a .layui-icon {vertical-align: bottom;}
.qq_txt a span {padding-left: 8px;}
.group_btn_box .layui-icon span {padding-left: 8px;}
.wx_btn .wx_code {position: initial;display: block;width: 126px;margin: auto; -webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
.wx_btn .hover_txt_box {top: -60px;}
.wx_btn .wx_code_box {position: relative; width: 126px;background: rgba(0, 0, 0, 0.9); padding: 10px;}
.wx_btn .wx_code_box {}
.wx_btn .wx_code_box li span {display: block; text-align: center; height: 30px; line-height: 30px;}
.hover_txt_box .arrow {display: block;width: 0px; height: 0px;border: 7px solid;border-color: transparent transparent transparent rgba(0, 0, 0, .5);}
.wx_arrow {position: relative;top: -40px;}
.class_qidian_wpa{opacity:0 !important;right: 0 !important;top: 0 !important;margin-top: 0 !important;opacity: 0 !important;position: absolute !important;height: 50px !important;width:50px !important}
.contact_line_btn .hover_txt_box {margin-top: 50px; top: 19px; right: 98px; width: 160px; border: solid 1px #3091F2}
.kf-box {background-color: #fff; padding: 10px 15px; overflow: hidden; height: auto; min-height: 250px}
.kf-box .kf-card {padding-bottom: 10px}
.kf-box .kf-header {height: 30px; line-height: 30px; font-size: 16px; overflow: hidden; color: #000; background-color: #eee; margin-bottom: 5px}
.kf-box .t {height: 25px; line-height: 25px; font-size: 16px; color: #000; overflow: hidden}
.kf-box .c {width: 130px; height: auto}
.kf-box .c img {position: initial; transform: initial; -webkit-transform: initial;}
@media screen and (max-width: 750px) {
	.consult_contact {top: initial; bottom: 0; width: 100%; background-color: #000; height: 44px;}
	.consult_contact .consult_wrap {width: 30%; height: 44px; float: left; display: none;}
	.consult_contact .contact_line_btn {width: 30%; float: left; top: 0;}
	.consult_contact .contact_line_btn .contact_line {display: none;}
	.consult_contact .contact_btn {margin: 7px 0 0 10px;}
	.consult_contact .contact_group_btn {float: right; margin-top: 0}
	.consult_contact .group_btn_box {float: left;}
	.consult_contact .hover_txt_box {top: -60px; right: -8px;}
	.consult_contact .hover_txt_box .arrow {display: none;}
	.contact_line_btn .hover_txt_box {top: initial; bottom: 65px; right: initial; left: 0}
	.wx_btn .wx_code_box {position: absolute; right: 0; bottom: -60px}
}