﻿/* CSS common */
.clearFloat:after {
	height: 0px;content: ".";
	clear: both;visibility: hidden;
	display: block;
}
.clearFloat { zoom: 1; }
*{margin: 0px;padding: 0px;}
img{margin: 0;border: none;}
.fl{float:left;}
.fr{float: right;}
a{text-decoration: none;font-family: "微软雅黑";transition: all 0.3s ease;}
dl, ul{list-style:none;}
input{outline: none;font-family: "微软雅黑";}
i,em{font-style: normal;}
body{font-family:"微软雅黑";background-color: #f9f9f9;}
.w1142{width: 1142px;margin: auto;min-width: 1142px;}

/*首页*/
.head{height: 134px;box-shadow: 0 2px 10px rgba(0,0,0,0.1);background-color: #fff;}
.head .logo{height: 134px;line-height: 134px;display: flex;align-items: center;}
.head .logo img{vertical-align: middle;max-height: 90px;margin-right: 15px;}
.head .right .right_top{padding-top: 25px;line-height: 100%;color: #dedede;font-size: 14px;text-align: right;}
.head .right .right_top a{margin: 0 10px;color: #767676;font-size: 14px;transition: all 0.3s ease;}
.head .right .right_top a:hover{color: #008cd6;}
.head .right .nav{margin-top: 36px;}
.head .right .nav li{float: left;margin-left: 40px;text-align: center;position: relative;}
.head .right .nav li::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 50%;
    width: 0;
    height: 2px;
    background-color: #008cd6;
    transition: all 0.3s ease;
    transform: translateX(-50%);
}
.head .right .nav li:hover::after {
    width: 100%;
}
.head .right .nav li p{color: #323232;font-size: 15px;font-weight: 500;}
.head .right .nav li span{color: #888888;font-size: 12px;display: block;margin-top: 5px;}
.head .right .nav li:hover p{color: #008cd6;}
.head .right .nav li.li_select p{color: #008cd6;}
.head .right .nav li.li_select::after {
    width: 100%;
}

.banner_in{height: 421px;min-width: 1142px;background: url(../images/index2.jpg) no-repeat center;background-size: cover;}
.banner .slideBox{width:1142px; height:421px;overflow:hidden; position:relative;border-radius: 8px;box-shadow: 0 4px 15px rgba(0,0,0,0.1);}
.banner .slideBox .hd{height:20px;overflow:hidden; position:absolute;bottom:15px; z-index:1;left: 0;width: 100%;}
.banner .slideBox .hd ul{ overflow:hidden; zoom:1;text-align: center;}
.banner .slideBox .hd ul li{display:inline-block;width:12px; height:12px;background: url(../images/index6.png) no-repeat center; cursor:pointer;margin: 0 5px;transition: all 0.3s ease;}
.banner .slideBox .hd ul li.on{background: url(../images/index7.png) no-repeat center;transform: scale(1.2);}
.banner .slideBox .bd{ position:relative; height:100%; z-index:0;}
.banner .slideBox .bd li{ zoom:1; vertical-align:middle; }
.banner .slideBox .bd img{ width:1142px; height:421px; display:block;border-radius: 8px;}

.message{margin-top: 30px;background: #fff;padding: 15px 20px;border-radius: 8px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);}
.message .left .left_sp{padding-left: 26px;background: url(../images/index8.png) no-repeat left center;font-size: 15px;color: #666;line-height: 16px;}
.message .left .left_sp span{color: #00aeef;font-weight: 600;}
.message .left .left_new{margin-left: 8px;}
.message .left .left_new li{line-height: 16px;padding: 8px 0;}
.message .left .left_new li a{color: #323232;font-size: 14px;display: inline-block;width: 210px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;transition: all 0.3s ease;}
.message .left .left_new li a:hover{color: #008cd6;transform: translateX(5px);}
.message .left .left_new li span{margin-left: 20px;color: #666;font-size: 14px;}
.message .more a{display: inline-block;padding-right: 20px;background: url(../images/index9.png) no-repeat right center;color: #f7941d;font-size: 14px;transition: all 0.3s ease;}
.message .more a:hover{color: #ff8b00;transform: translateX(-5px);}

.about{margin-top: 40px;}
.about .about_det{width: 370px;margin-right: 16px;float: left;background: #fff;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 15px rgba(0,0,0,0.08);transition: all 0.3s ease;}
.about .about_det:hover{transform: translateY(-5px);box-shadow: 0 5px 20px rgba(0,0,0,0.15);}
.about .about_det3{float: right;margin-right: 0;}
.about .about_det .ig{width: 370px;height: 217px;overflow: hidden;}
.about .about_det .ig img{width: 370px;height: 217px;vertical-align: middle;transition: all 0.6s;}
.about .about_det .ig:hover img{transform: scale(1.1);}
.about .about_det p{color: #323232;font-size: 18px;line-height: 100%;margin: 20px 0;text-align: center;font-weight: 500;}

.news{margin-top: 50px;}
.news .tit{text-align: center;margin-bottom: 25px;}
.news .tit p{color: #323232;font-size: 28px;line-height: 100%;font-weight: 600;}
.news .tit span{display: inline-block;height: 22px;line-height: 22px;padding: 0 15px;color: #888888;font-size: 14px;border-bottom: solid 4px #008cd6;margin-top: 12px;}
.news .det{margin-top: 20px;}
.news .det .fon{width: 560px;background: #fff;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 15px rgba(0,0,0,0.08);transition: all 0.3s ease;padding-bottom: 20px;}
.news .det .fon:hover{transform: translateY(-5px);box-shadow: 0 5px 20px rgba(0,0,0,0.15);}
.news .det .fon .ig{width: 560px;height: 328px;overflow: hidden;}
.news .det .fon .ig img{width: 560px;height: 328px;vertical-align: middle;transition: all 0.6s;}
.news .det .fon .ig:hover img{transform: scale(1.1);}
.news .det .fon p{color: #323232;font-size: 20px;line-height: 100%;margin: 18px 0 15px 0;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;padding: 0 20px;font-weight: 500;}
.news .det .fon .more{margin: 8px 0 0 20px;}
.news .det .fon .more a{display: inline-block;padding-right: 20px;background: url(../images/index9.png) no-repeat right center;color: #f7941d;font-size: 14px;transition: all 0.3s ease;}
.news .det .fon .more a:hover{color: #ff8b00;transform: translateX(5px);}

.video{position: relative;margin-top: 50px;}
.video .ig img{width: 1142px;height: 554px;vertical-align: middle;border-radius: 10px;}
.video .ig_bg{position: absolute;top: 0;left: 0;z-index: 2;}
.video .ig_bg img{width: 1142px;height: 554px;border-radius: 10px;box-shadow: 0 5px 25px rgba(0,0,0,0.15);}
.video .ig_btn{position: absolute;top: 50%;left: 50%;z-index: 3;margin-left: -51px;margin-top: -51px;width: 102px;height: 102px;background: url(../images/index17.png) no-repeat center;transition: all 0.3s ease;}
.video:hover .ig_btn{background: url(../images/index18.png) no-repeat center;top: 50%;left: 50%;margin-left: -63px;margin-top: -63px;width: 126px;height: 126px;transform: rotate(360deg);}

.products{margin-top: 50px;padding-bottom: 50px;}
.products .tit{text-align: center;margin-bottom: 25px;}
.products .tit p{color: #323232;font-size: 28px;line-height: 100%;font-weight: 600;}
.products .tit span{display: inline-block;height: 22px;line-height: 22px;padding: 0 15px;color: #888888;font-size: 14px;border-bottom: solid 4px #008cd6;margin-top: 12px;}
.products .det{position: relative;margin-top: -16px;}
.products .det .more{text-align: right;margin-bottom: 15px;}
.products .det .more a{display: inline-block;padding-right: 20px;background: url(../images/index9.png) no-repeat right center;color: #f7941d;font-size: 14px;transition: all 0.3s ease;}
.products .det .more a:hover{color: #ff8b00;transform: translateX(-5px);}
.products .det ul{margin-top: 25px;display: flex;justify-content: space-between;}
.products .det ul li{width: 270px;height: 245px;position: relative;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 15px rgba(0,0,0,0.08);transition: all 0.3s ease;}
.products .det ul li:hover{transform: translateY(-5px);box-shadow: 0 5px 20px rgba(0,0,0,0.15);}
.products .det ul li img{vertical-align: top;width: 270px;height: 234px;border-radius: 8px;}
.products .det ul li .li_hover{position: absolute;top: 0;left: 0;width: 270px;height: 245px;background: url(../images/index23.png) no-repeat center;background-size: cover;z-index: 2;display: none;border-radius: 8px;transition: all 0.3s ease;}
.products .det ul li .li_hover p{line-height: 234px;padding-left: 25px;color: #fff;font-size: 20px;font-weight: 500;}
.products .det ul li:hover .li_hover{display: block;}

.footer1_in{padding: 40px 0;background: #989ea3;min-width: 1142px;}
.footer1 .left{margin-left: 25px;}
.footer1 .left dl{float: left;width: 120px;}
.footer1 .left dl dt{margin-bottom: 20px;}
.footer1 .left dl dt a{color: #fff;font-size: 16px;font-weight: bold;}
.footer1 .left dl dt a:hover{color: #f1f1f1;text-decoration: underline;}
.footer1 .left dl dd{line-height: 28px;}
.footer1 .left dl dd a{color: #fff;font-size: 14px;transition: all 0.3s ease;}
.footer1 .left dl dd a:hover{color: #f1f1f1;transform: translateX(5px);}
.footer1 .right{text-align: center;padding-right: 30px;}
.footer1 .right .qrcode{margin-bottom: 15px;}
.footer1 .right .p1 span{display: inline-block;padding-left: 30px;background: url(../images/index25.png) no-repeat left center;color: #fff;font-size: 16px;line-height: 30px;}
.footer1 .right .p2 span{display: inline-block;padding-left: 30px;background: url(../images/index26.png) no-repeat left center;color: #fff;font-size: 16px;line-height: 30px;}
.footer2_in{min-width: 1142px;background: #005bac;padding: 15px 0;}
.footer2 p{text-align: center;color: #fff;font-size: 14px;line-height: 22px;}

.company-logo {
    max-height: 100px;
    margin-right: 15px;
    border-radius: 8px;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.fadeIn {
    animation: fadeIn 1s ease-in-out;
}

@keyframes slideInUp {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.slideInUp {
    animation: slideInUp 0.8s ease-out;
}






















