@charset "utf-8";
@import url(base.css);
.header{width: 100%;background: #333;padding: 0 5%;box-sizing: border-box;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;
z-index: 100; height: 80px;}


.onheader{position: fixed;top: 0;}
.header h1{display: block;box-sizing; line-height: 80px; border-box;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s; float: left; width: 30%;}
.daohang{ float: right; width: 50%; height: 80px; }
.header h1 img{height: 40px; line-height: 40px; }
.header h1 a{display: block;font-size: 32px;font-weight: 500;color: #fff;}
.header ul li{float: left;width: 25%;box-sizing: border-box; line-height: 80px;}
.header ul li a{display: block;font-size: 18px;color: #fff; text-align: center;}
.header ul li:nth-child(2){text-align: center;}
.header ul li:nth-child(3){text-align: center;}
.header ul li:nth-child(4){text-align: center;}
.header ul li:nth-child(5){text-align: center;}
.header ul li:nth-child(6){text-align: center;}
.header ul li:last-child{text-align: right;}
.banner{width: 100%;}
.bannercon{display: none;}
.banner ul li{width: 100%;}
.banner ul li a{display: block;width: 100%;height: 100%;}
.banner ul li a img{width: 100%;display: block;height: 100%;object-fit: cover;}
.pages .swiper-pagination-bullet{height: 8px;width: 25px;border: 2px solid #fff;opacity: 1;background: transparent;border-radius: 10px;}
.pages .swiper-pagination-bullet-active{opacity: 1;background: #fff;}
.contertext{width: 100%;background: #333;padding: 60px 5%;box-sizing: border-box;}
.contertext ul li{float: left;width: 45%;}
.contertext ul li:nth-child(2n){margin-left: 10%;}
.contertext ul li p{font-size: 16px;color: #fff;opacity: 0.8;line-height: 30px;}
.conter{width: 100%;background: #333;padding: 0 5%;box-sizing: border-box;}
.conter ul li{width: 100%;margin-bottom: 20px;position: relative;overflow: hidden;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;}
.conter ul li:last-child{margin-bottom: 0;}
.conter ul li a{display: block;width: 100%;}
.conterimg{width: 100%;overflow: hidden;border-radius: 4px;}
.conterimg img{display: block;width: 100%;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;border-radius: 4px;}
.conter ul li p{padding: 15px 0;box-sizing: border-box;font-size: 16px;color: #fff;overflow: hidden;position: absolute;bottom: -51px;left: 0;
text-overflow:ellipsis;white-space: nowrap;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;}
.conter ul li:hover{padding-bottom: 55px;box-sizing: border-box;}
.conter ul li:hover .conterimg img{transform: scale(1.1);-ms-transform:scale(1.1);-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);}
.conter ul li:hover p{bottom: 0;}
.top{cursor: pointer;font-size: 0.9em;position: fixed;text-align: center;z-index: 9999; -webkit-transition: background-color 0.2s ease-in-out;-moz-transition: background-color 0.2s ease-in-out;opacity: 0;
    -ms-transition: background-color 0.2s ease-in-out;transition: background-color 0.2s ease-in-out;background: #121212;color: #ffffff;border-radius: 3px;padding-left: 12px;padding-right: 12px;padding-top: 12px;padding-bottom: 12px;right: 20px;bottom: 45px;}
.top:hover{background: #93000a;color: #fff;}
.footer{width: 100%;height: 60px;background: #333;padding: 0 5%;box-sizing: border-box;border-top: 1px solid #121212;}
.footercon{width: 100%;margin: 0 auto;}
.footercon p{font-size: 16px;color: #fff;opacity: 0.8;line-height: 59px;float: left;}
.footercon p a{font-size: 16px;color: #fff;opacity: 0.8;}
.footerconright{float: right;padding-top: 21px;box-sizing: border-box;}
.footerconright ul li{float: left;margin-right: 20px;position: relative;}
.footerconright ul .weixin:hover .piwx{display: block;}
.piwx{width: 120px;height: 120px;background: #fff;padding: 10px;box-sizing: border-box;border-radius: 4px;position: absolute;top: -124px;left: 50%;margin-left: -60px;display: none;}
.piwx img{width: 100%;height: 100%;}
.footerconright ul li:last-child{margin-right: 0;}
.footerconright ul li a{display: block;}
.footerconright ul li a img{width: 20px;height: 20px;}
/* 案例 */
.caseconter{padding: 40px 5%;box-sizing: border-box;width: 100%;background: #333;}
.casecontered{width: 100%;}
.casecontered ul li{float: left;width: 33.3%;position: relative;height: 300px;overflow: hidden;}
.casecontered ul li a{display: block;height: 300px;}
.caseimg{width: 100%;overflow: hidden;height: 300px;}
.caseimg img{display: block;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;height: 100%;object-fit: cover;width: 100%;}
.casecontered ul li:hover .caseimg img{transform: scale(1.1);-ms-transform:scale(1.1);-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);}
.casetext{position: absolute;bottom: -100%;left: 0;background: rgba(0,0,0,0.5);width: 100%;height: 100%;padding: 25px;box-sizing: border-box;
display: flex;flex-direction: column;justify-content: flex-end;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;}
.casetext h5{font-size: 18px;color: #fff;font-weight: 500;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.casetext i{display: block;width: 50px;height: 3px;background: #fff;margin: 20px 0;}
.casetext p{font-size: 14px;color: #fff;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;line-height: 22px;}
.casecontered ul li:hover .casetext{bottom: 0;}
/* 详情 */
.caseconxq{width: 85%;margin: 0 auto;}
.htkg_newcon{width: 100%;}
.htkg_navlist{width: 100%;margin-bottom: 25px;}
.htkg_navlist span{font-size: 14px;color: #fff;font-weight: 500;opacity: 0.3;}
.htkg_navlist strong{font-size: 14px;color: #fff;font-weight: 500;opacity: 0.3;}
.htkg_navlist a{font-size: 14px;color: #fff;font-weight: 500;opacity: 0.3;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;}
.htkg_navlist a:hover{color: #CD0200;}
.casexqtitle{width: 100%;}
.casexqtitle h5{font-size: 24px;color: #fff;border-bottom: 1px solid #f4f4f4;font-weight: 500;padding-bottom: 20px;box-sizing: border-box;text-align: center;}
.caseconters{width: 100%;padding: 40px 0;box-sizing: border-box;}
.caseconters p{font-size: 16px;color: #fff;text-indent: 2em;line-height: 28px;margin-bottom: 20px;}
.caseconters p img{display: block;margin: 0 auto;width: 100%;}
/* 联系我们 */
.contact{width: 100%;margin-bottom: 80px;}
.contact img{display: block;width: 100%;}
.contactlist{width: 85%;margin: 0 auto;}
.contactlist h5{font-size: 18px;color: #fff;font-weight: 500;margin-bottom: 20px;}
.contactlist p{font-size: 18px;color: #fff;line-height: 30px;}
.contactimg{width: 100%;padding-top: 40px;box-sizing: border-box;padding-bottom: 60px;}
.contactimg ul li{width: 140px;height: 140px;float: left;margin-right: 40px;}
.contactimg ul li:last-child{margin-right: 0;}
.contactimg ul li img{width: 100%;display: block;height: 100%;}
/* 关于我们 */
.aboutcon{width: 100%;}
.aboutcon h3{font-size: 42px;color: #fff;font-weight:500;}
.aboutconter{width: 100%;}
.aboutconteright{width: 50%;float: right;}
.aboutconterlist{width: 100%;margin-bottom: 60px;}
.aboutconterlist h5{font-size: 24px;color: #fff;font-weight: 500;margin-bottom: 20px;}
.aboutconterlist ul li{font-size: 16px;color: #fff;margin-bottom: 8px;width: 55%;float: left;}
.aboutconterlist ul li:nth-child(2n){float: left;width: 45%;}
.aboutconterlist p{font-size: 16px;color: #fff;margin-bottom: 8px;}
.aboutlist{width: 100%;}
.aboutlist ul li{float: left;width: 24%;margin-right: 1.3%;}
.aboutlist ul li:last-child{margin-right: 0;}
.aboutimg{width: 100%;overflow: hidden;border-radius: 4px;}
.aboutimg img{width: 100%;display: block;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;}
.aboutext{width: 100%;padding: 10px 0;box-sizing: border-box;}
.aboutext h5{font-size: 16px;color: #fff;font-weight: 500;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.aboutext h6{font-size: 16px;color: #fff;font-weight: 500;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;margin-bottom: 10px;}
.aboutext p{font-size: 16px;color: #fff;font-weight: 500;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.aboutlist ul li:hover .aboutimg img{transform: scale(1.1);-ms-transform:scale(1.1);-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);}
/* 新闻中心 */
.newcon{width: 100%;}
.newcon ul{position: relative;}
.newcon ul li{float: left;position: absolute;}
.newcon ul li a{display: block;}
.newimg{width: 100%;overflow: hidden;border-radius: 4px;}
.newimg img{display: block;width: 100%;transition:.5s;-moz-transition: .5s;-webkit-transition: .5s;-o-transition: .5s;}
.newtext{width: 100%;padding: 10px 0;box-sizing: border-box;}
.newtext h5{font-size: 16px;color: #fff;font-weight: 500;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;margin-bottom: 5px;}
.newtext p{font-size: 14px;color: #fff;font-weight: 500;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.newcon ul li:hover .newimg img{transform: scale(1.1);-ms-transform:scale(1.1);-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);}
/******************************响应式**************************************/
@media screen and (max-width: 1600px) {
	
}
@media screen and (max-width: 1550px) {
	
}
@media screen and (max-width: 1024px) {
	.caseconxq{width: 100%;}
	.footercon{width: 100%;}
}
@media screen and (max-width: 768px) {
	
}
@media screen and (max-width: 568px) {
	.header{ height: 100px; }
.daohang{ float: right; width: 100%; height: 30px; line-height: 30px; }
	.header ul li{ line-height: 20px; }
	.header h1{padding: 15px 0; line-height: 30px;}
	.header h1 a{font-size: 24px;}
	.header ul li a{font-size: 14px;}
	.contertext ul li:nth-child(2n){ margin-right: 10px; margin-left: 0px; }
	.banner{display: none;}
	.bannercon{width: 100%;height: 300px;}
	.bannercon ul li{width: 100%;height: 300px;}
	.bannercon ul li a{display: block;height: 300px;}
	.bannercon ul li a img{width: 100%;display: block;height: 300px;object-fit: cover;}
	.contertext{padding: 20px 5%;}
	.contertext ul li{width: 100%;}
	.footercon p{font-size: 14px;line-height: 1.5;text-align: center;padding-top: 5px;box-sizing: border-box;}
	.footerconright{display: none;}
	.casecontered ul li{width: 100%;border-radius: 4px;margin-bottom: 20px;}
	.htkg_navlist span{font-size: 14px;}
	.htkg_navlist a{font-size: 14px;}
	.casexqtitle h5{font-size: 18px;}
	.caseconters{padding: 20px 0 0 0;}
	.caseconters p{font-size: 14px;line-height: 22px;}
	.caseconters p:last-child{margin-bottom: 0;}
	.contact{margin-bottom: 20px;}
	.contactlist{width: 100%;}
	.aboutcon h3{font-size: 24px;margin-bottom: 20px;}
	.aboutconteright{float: none;width: 100%;}
	.aboutconterlist{margin-bottom: 40px;}
	.aboutlist ul li{width: 100%;margin-right: 0;margin-bottom: 20px;}
	.aboutlist ul li:last-child{margin-bottom: 0;}
}