﻿/* CSS Document */
/*transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out;*/
@font-face{
    font-family: 'Bodoni';
    src:url(../fonts/BodoniStd-Italic.otf);
}
@font-face{
    font-family: 'Poppins';
    src:url(../fonts/Poppins-SemiBold.ttf);
}
@font-face{
    font-family: 'Lato';
    src:url(../fonts/LATO-LIGHT.WOFF.TTF);
}
@font-face{
    font-family: 'Playfair';
    src:url(../fonts/PlayfairDisplay-Regular.ttf);
}
@font-face{
    font-family: 'Sans';
	src:url(../fonts/OpenSans-Regular.ttf);
}
@font-face{
    font-family: 'Raleway';
    src:url(../fonts/Raleway-400-Regular.otf);
}



body,div,ul,li,h1,h2,h3,h4,h5,p,table,td,tr,p,dl,dt,dd{ padding:0; margin:0; list-style:none;}
body{ font-family: 'Sans'; font-size:14px; color:#262626;}
a{ color:#666; text-decoration:none; transition: .6s;}
a:hover{}
img{ border:0;}
.clear:after{content:""; display:block; clear:both;}
.fl-1,.fl-2,.fl-3,.fl-4,.fl-5,.fl-6,.fl-7,.fl-8,.fl-9,.fl-10,.fl-11,.fl-12{float:left;box-sizing:border-box; padding-left:25px; padding-right:25px;}
.fr-1,.fr-2,.fr-3,.fr-4,.fr-5,.fr-6,.fr-7,.fr-8,.fr-9,.fr-10,.fr-11,.fr-12{float:right;box-sizing:border-box; padding-left:25px; padding-right:25px;}
.fl-1,.fr-1{width:calc(100%/12);}
.fl-2,.fr-2{width:calc(100%/12*2);}
.fl-3,.fr-3{width:calc(100%/12*3);}
.fl-4,.fr-4{width:calc(100%/12*4);}
.fl-5,.fr-5{width:calc(100%/12*5);}
.fl-6,.fr-6{width:calc(100%/12*6);}
.fl-7,.fr-7{width:calc(100%/12*7);}
.fl-8,.fr-8{width:calc(100%/12*8);}
.fl-9,.fr-9{width:calc(100%/12*9);}
.fl-10,.fr-10{width:calc(100%/12*10);}
.fl-11,.fr-11{width:calc(100%/12*11);}
.fl-12,.fr-12{width:calc(100%/12*12);}
.pad10{padding-top: 10px;padding-bottom: 10px;}.pad20{padding-top: 20px;padding-bottom: 20px;}.pad30{padding-top: 30px;padding-bottom: 30px;}.pad40{padding-top: 40px;padding-bottom: 40px;}.pad50{padding-top: 50px;padding-bottom: 50px;}.pad60{padding-top: 60px;padding-bottom: 60px;}.pad70{padding-top: 70px;padding-bottom: 70px;}
.padt10{padding-top: 10px;}.padt20{padding-top: 20px;}.padt30{padding-top: 30px;}.padt40{padding-top: 40px;}.padt50{padding-top: 50px;}.padt60{padding-top: 60px;}.padt70{padding-top: 70px;}
.padb10{padding-top: 10px;}.padb20{padding-top: 20px;}.padb30{padding-top: 30px;}.padb40{padding-top: 40px;}.padb50{padding-top: 50px;}.padb60{padding-top: 60px;}.padb70{padding-top: 70px;}
.swiper-slide img{ max-width:100%;}
img{max-width: 100%;vertical-align: middle;/* aspect-ratio: 1/1; */}
.wid{ width:1200px; margin:0 auto;}
.wid:after{ content:""; display:block; clear:both;}
.mid_h2{font-size:26px; line-height:36px;color:#242e35; margin-bottom: 20px; padding-top: 15px;}
.mid_h3{ font-size:18px; line-height:28px; margin-bottom:10px;color:#333; padding-top: 20px;}
.mid_text p{ font-size:14px; color:#7e7e7e; line-height:26px; margin-bottom:10px;}
.mid_flex{display: flex; align-items: center;flex-wrap:wrap;}

.header{position: absolute; width: 100%; padding: 15px 5%; box-sizing: border-box; z-index: 1000;}
.logo{float: left;}
.language{float: right; line-height: 41px; margin: 6px 0 0 10px; padding: 0px 25px; background: #d83d45; color: #fff; font-size: 16px; border-radius: 50px;}
.language a{color: #fff;}
.language a:hover{text-decoration:underline;}
.language span{padding: 0 5px;}
.nav{float: right;}
.nav li{display: inline-block; padding: 10px 3px;}
.nav li>a{display: block; padding: 5px 15px; line-height: 25px; color: #fff; font-size: 15px; text-transform: uppercase; border-radius: 5px;}
.nav li:hover>a{background: #D83D45;}
.banner{position: relative; padding: 85px 5% 0; height:100vh;background:#8dc73f url(../images/banner_bg.jpg) no-repeat center top; box-sizing: border-box; overflow: hidden; z-index: 10;}
.banner_cont{position: absolute; opacity: 0; transform: translateY(0); transition: .5s;}
.banner_cont.act{opacity: 1; animation: picin .6s linear; z-index: 1000;}
.banner_cont.outact{transform: translateY(200px);}
.banner_text{position: relative; float: left; width: 35%; color: #fff; padding-top: 8%;}
.banner_text h2{font-size: 40px; line-height: 50px;}
.banner_text p{font-size: 18px; line-height: 34px; margin: 15px 0 35px;}
.banner_text a{display:inline-block; padding: 0 25px; line-height: 46px; font-size: 16px; color: #fff; background: #642f8e; border-radius: 50px;}
.banner_text a:hover{background: #866b9a;}
.banner_pic{float: right;width: 60%;padding-top: 2%;text-align: right;aspect-ratio: 1/1;display: flex;justify-content: center;align-items: flex-start;overflow: hidden;}
.banner_pic img{height: 80%;}
.banner_nav{position: absolute; left: 0;bottom: 0; width: 100%; padding: 0 5%; box-sizing: border-box;z-index: 2000;}
.banner_nav ul{display: flex;align-items: flex-end;}
.banner_nav li{width: 20%; display:flex;align-items: center;justify-content: center; text-align: center; color: #fff;height: 144px; line-height: 40px;font-size: 24px; overflow: hidden; cursor: pointer; transition: .6s;}
.banner_nav li.act{height: 170px; font-size: 30px;}
.banner_nav li:hover{height: 170px; font-size: 30px;}
.banner_nav li:nth-child(1){background: #6b4d81;}
.banner_nav li:nth-child(2){background: #1ccc46;}
.banner_nav li:nth-child(3){background: #02a6e5;}
.banner_nav li:nth-child(4){background: #d83d45;}
.banner_nav li:nth-child(5){background: #ed9c18;}
.banner_nav li:nth-child(1):hover{background: #7b6d85;}
.banner_nav li:nth-child(2):hover{background: #77cb8b;}
.banner_nav li:nth-child(3):hover{background: #55c1ea;}
.banner_nav li:nth-child(4):hover{background: #e87d83;}
.banner_nav li:nth-child(5):hover{background: #f4bc5f;}

.home_pro{padding: 100px 0; background: url(../images/home_probg.jpg) no-repeat center;}
.home_title{font-size: 40px; line-height: 50px; margin-bottom: 10px; color: #6c9c26; text-transform: uppercase; text-align: center;}
.home_des{font-size: 18px; line-height: 28px; color: #aaabad; text-align: center; font-style: italic;}
.home_pro_cont{margin-top: 70px;}
.home_pro_box{position:relative;float: left;width: 32%;margin-right: 2%;}
.home_pro_box .home_pro_pic{aspect-ratio: 1/1;overflow: hidden;display: flex;justify-content: center;align-items: center;}
.home_pro_box:nth-child(3n){ margin-right: 0;}
.home_pro_text{position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex;align-items: center; justify-content: center; text-align: center; background: rgba(108,156,38,.7); font-size: 24px; color: #fff; transition: .6s;}
.home_pro_num{position: absolute; left: 50%; bottom: -25px; width: 60px; height: 60px; line-height: 60px; text-align: center;font-size: 30px; font-weight: bold; color: #6c9c26; background: #fff; border-radius: 50%; transform: translateX(-50%);transition: .6s;}
.home_pro_box:hover .home_pro_text{background:rgba(255,255,255,.7); color: #6C9C26;}
.home_pro_box:hover .home_pro_num{background: #6C9C26; color: #fff;}

.home_com{padding: 120px 0;background: url(../images/home_combg.jpg) no-repeat center;{padding: 120px 0;background: url(../images/home_combg.jpg) no-repeat center;}
设置背景透明度50%;background-color: rgb(255 255 255 / 66%); /* 使用rgba设置背景色透明度50% */background-blend-mode: overlay; /* 混合模式让背景图片也透明 */background-size: cover;}
.home_com_cont{margin-top: 50px;font-size: 18px; color: #555653; line-height: 34px;}
.home_com_an{ text-align: center; margin-top: 50px;}
.home_com_an a{display: inline-block; padding: 0px 30px; line-height: 34px; height: 36px; background: #6c9c26; color: #fff; border-radius: 50px;}
.home_com_an a:hover{background: #1ccc46;}

.foot{padding: 35px 0 0; background: url(../images/foot_bg.jpg) no-repeat center top;}
.foot_box{font-size: 16px;}
.foot_box h2{color: #6c9c26; font-size: 30px; margin-bottom: 10px; text-transform: uppercase;}
.foot_box span{color: #6C9C26; font-weight: bold;}
.foot_box p{line-height: 24px; margin-bottom: 10px; color: #7e7e7e;}
.foot_box a{color: #7e7e7e;}
.foot_box a:hover{color: #6C9C26; text-decoration: underline;}
.copy{padding: 25px 0; background: #9bb42d;}
.copy_logo{float: left; margin-right: 20px;}
.copy_link{float: left; padding: 6px 0;}
.copy_link a{display: inline-block; width: 41px; height: 41px; text-align: center; color: #9BB42D; background: #fff; margin: 0 5px; border-radius: 50%;}
.copy_link a i{line-height: 40px; font-size: 18px;}
.copy_link a:hover{background: #9BB42D; color: #fff;}
.copy_text{float: right; line-height: 55px; color: #fff;}

.reture_top{position: fixed;right: 0; bottom: 10px; padding: 10px 0; width: 50px; text-align: center; line-height: 24px; background: #6C9C26; color: #fff; cursor: pointer; display: none;}

.nyabnner{position: relative; padding:135px 0 100px;background: url(../images/banner_bg.jpg) no-repeat center top;}
.probanner{padding: 85px 0 0px;}
.nyabnner h2{font-size: 40px; text-align: center;color: #fff; line-height: 50px; text-transform: uppercase; margin-bottom: 10px;}
.nyabnner p{max-width: 800px; text-align: center; margin: 0 auto; color: #fff; font-size: 18px; line-height: 28px;}
.mid_pos{ position: absolute; bottom: 0;left: 0; text-align:center; color:#fff;}
.mid_pos ul{ display:inline-block;padding:5px 20px; background: #642F8E;}
.mid_pos li{ display:inline-block;}
.mid_pos li a{ color:#fff; display:block; line-height:24px;}
.mid_pos li a:hover{ text-decoration:underline;}

.mid{padding: 0px 0 70px;}
.mid_left{text-align: right; padding: 35px 0;}
.mid_left a{display: inline-block; padding: 5px 15px; margin-left: 5px; line-height: 26px; background: #6C9C26; color: #fff; border-radius: 3px;}
/*.mid_left a.act{background: #1CCC46;}*/
.mid_left a:hover{background: #1CCC46;}

.about_adv{background: #02A6E5; color: #fff; margin: 50px 0; padding: 50px 0; text-align: center; font-size: 30px; line-height: 40px;}
.about_i{color: #D83D45; margin-right: 6px;}

.products_box{margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #dedede;}
.products_pic{float:left;width: 30%;overflow: hidden;aspect-ratio: 1/1;display: flex;align-items: center;justify-content: center;}
.products_pic img{transition: .6s;}
.products_pic:hover img{transform: scale(1.1);}
.products_text{float: left; width: 67%; margin-left: 3%;}
.products_text h3{font-size: 20px; line-height: 30px; margin-bottom: 10px;}
.products_text p{ line-height: 24px; height: 48px; overflow: hidden; color: #7e7e7e;}
.products_list{margin: 2% 0 3%;}
.products_list dl{position: relative;float: left;width: calc(25% - 10px);margin: 5px;border: 1px solid #dedede;text-align: center;box-sizing: border-box;overflow: hidden;aspect-ratio: 1/1;display: flex;align-items: center;justify-content: center;}
.products_list dt{}
.products_list dd a{position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: rgba(2,166,229,.6); color: #fff; font-size: 16px; padding: 0 10px; box-sizing: border-box; transform: translateY(100%);}
.products_list dl:hover dd a{ transform: translateY(0);}
.products_box_an a{display: inline-block; padding: 5px 15px; background: #D83D45; color: #fff; border-radius: 3px;}
.products_box_an a:hover{background: #02A6E5;}

.prolist{}
.prolist:after{ content:""; display:block; clear:both;}
.prolist dl{ width:25%; padding:0 1%; box-sizing:border-box; text-align:center; overflow:hidden; float:left;margin-bottom:15px;}
.prolist dl dt{position:relative;aspect-ratio: 1/1;border: 1px #ebebeb solid;display: flex;justify-content: center;align-items: center;overflow: hidden;}
.prolist dl dt img{max-width:100%;vertical-align:middle;/* border:1px #ebebeb solid; */box-sizing:border-box;}
.prolist dl dt span{ position:absolute; left:0; top:0; width:100%; height:100%; display:block; background:#ccc;background:rgba(193,44,32,0.2); opacity:0;transition:320ms;}
.prolist dl dt span:before{ content:"";width:100%;height:0;border-left:3px solid #c12c20;border-right:3px solid #c12c20;box-sizing:border-box;position:absolute;left:0;top:0;transition:320ms;}
.prolist dl dt span:after{ content:"";width:0;height:100%;border-top:3px solid #c12c20;border-bottom:3px solid #c12c20;box-sizing:border-box;position:absolute;left:0;top:0;transition:320ms;}
.prolist dl:hover span{ opacity:1;transition:320ms;}
.prolist dl:hover dt span:before{ height:100%; transition:330ms 200ms;}
.prolist dl:hover dt span:after{ width:100%; transition:330ms 200ms;}
.prolist dl dt span b{ position:absolute; left:50%; top:50%; margin:-23px 0 0 -23px; width:46px; height:46px; display:block; z-index:10;}
.prolist dl dt span b:before{ position:absolute; left:0; top:23px; content:"";width:100%;height:1px; background:#c12c20;transform:translateX(-200px);}
.prolist dl dt span b:after{ position:absolute; left:23px; top:0; content:"";width:1px;height:100%; background:#c12c20;transform:translateY(-200px);}
.prolist dl:hover dt span b:before{ transform:translateX(0); transition:355ms 180ms;}
.prolist dl:hover dt span b:after{ transform:translateY(0); transition:355ms 180ms;}
.prolist dl dd{ font-size:16px; padding:9px 0 19px; font-weight:bold;line-height:22px; overflow:hidden;}
.prolist dl:hover dd{ color:#c12c20;}

.procont_title{text-align: center; font-size: 32px; line-height: 42px; margin-bottom: 35px;}
.procont_pic{text-align: center;}
.procont_pic img{border: #ebebeb solid 1px; box-sizing: border-box;}
.procont_cont{border-top: 1px dashed #dedede;margin-top: 25px; padding-top: 15px;}

.pro_link{ text-align:center;padding: 50px 0;}
.pro_link h3{margin-bottom:10px; font-size:16px; line-height:28px;}
.pro_link_an a{ display:inline-block; width:50px; height:30px; margin:0 4px 4px 0; border:1px solid;}
.pro_link_an a i{ line-height:30px;}
.pro_link_an .facebook{ border-color:rgba(76,105,199,.3); color:#4c69c7;}
.pro_link_an .twitter{ border-color:rgba(42,190,235,.3); color:#2abeeb;}
.pro_link_an .google{ border-color:rgba(230,66,53,.3); color:#e64235;}
.pro_link_an .linkedin{ border-color:rgba(0,123,199,.3); color:#007bc7;}
.pro_link_an .facebook:hover{ border-color:#4c69c7;}
.pro_link_an .twitter:hover{ border-color:#2abeeb;}
.pro_link_an .google:hover{ border-color:#e64235;}
.pro_link_an .linkedin:hover{ border-color:#007bc7;}

.contact_info{float: left; width: 50%;}
.contact_info h2{font-size: 28px; line-height: 38px; margin-bottom: 20px;}
.contact_info p{font-size: 15px; line-height: 27px; margin-bottom: 10px; color: #7e7e7e;}
.contact_info i{width: 30px; text-align: center;color: #6C9C26;}

.message{float: left; width: 50%;}
.message p{ color:#85868c; font-size:15px; line-height:27px; margin-bottom:20px;}
.message input{ width:100%; font-size:14px; line-height:25px; padding:3px 12px; border:#e0e1e1 solid 1px; border-radius:1px; color:#8b8d94; margin-bottom:10px;box-sizing:border-box;}
.message input::-webkit-input-placeholder{color:#ccc;}
.message textarea{ width:100%; font-size:14px; line-height:25px; padding:3px 12px; border:#e0e1e1 solid 1px; border-radius:1px; color:#8b8d94; margin-bottom:10px;font-family: 'Sans';box-sizing:border-box;}
.message textarea::-webkit-input-placeholder{color:#ccc;}
.message a{ font-size:14px; line-height:38px; height:38px; color:#fff; padding:0 18px; background:#D83D45; display:inline-block; margin-top:10px;}
.message a:hover{ background:#0eade2;}
.contact_map{margin-top: 25px; height: 400px; background: #d6d6d6; padding: 5px 0; margin-bottom: -70px; overflow: hidden;}

.num{margin-right:10px;width: 20px;height: 20px;background: #02a6e5;text-align: center;line-height: 20px;color: #fff;display: inline-block;border-radius: 50%;}

.equ{ margin-top: 10px;}
.equ a{display:block; float:left; width: calc(100%/3 - 10px); margin: 0 15px 15px 0;}
.equ a:nth-child(3n){margin-right: 0;}




.js-m{opacity: 0; transition: 1s;transform: translateY(100px);}
.animate{opacity: 1; transform: translate(0) scale(1) rotate(0);}


@keyframes picin{
	from{opacity: 0; transform: translateX(200px);}
	to{opacity: 1; transform: translateX(0);}
}
@keyframes textin{
	from{opacity: 0; transform: translateX(-200px);}
	to{opacity: 1; transform: translateX(0);}
}

/*分页代码*/
.pagelist {clear:both; font-size: 12px; padding:20px 0;text-align:center;}
.pagelist a{ padding: 5px 9px; border: solid 1px #ddd; background: #fff; text-decoration: none;margin:3px; color:#666; font-family:宋体,arial,sans-serif;}
.pagelist a:visited, #nowpage { padding: 3px 8px; margin:3px; border: solid 1px #ddd; background: #fff; text-decoration: none; }
.pagelist a:hover, #nowpage{color:#97262a; background: #fff; border-color:#97262a; text-decoration: none;}

/*send*/
.pro_send{ padding-top:0px;}
.pro_send h2{ position:relative; font-size:24px; line-height:34px; color:#333; text-align:center; padding:40px 0 10px; margin-bottom:20px; border-top:1px solid #e0e1e1}
.pro_send h2:after{content:""; position:absolute; bottom:0; left:50%; margin-left:-30px;width:60px; height:3px; background:#D83D45;}
.pro_send p{ text-align:center; margin-bottom:15px; font-size:13px; line-height:23px; color:#85868c;}
.pro_send input{ width:100%; font-size:14px; line-height:25px; padding:5px 12px; border:#e0e1e1 solid 1px; border-radius:1px; color:#8b8d94; margin-bottom:10px;box-sizing:border-box;}
.pro_send input::-webkit-input-placeholder{color:#ccc;}
.pro_send textarea{ width:100%; font-size:14px; line-height:25px; padding:5px 12px; border:#e0e1e1 solid 1px; border-radius:1px; color:#8b8d94; margin-bottom:10px;font-family: 'Sans';box-sizing:border-box;}
.pro_send textarea::-webkit-input-placeholder{color:#ccc;}
.pro_send a{ font-size:14px; line-height:38px; height:38px; color:#fff; padding:0 18px; background:#D83D45; display:inline-block; margin-top:10px;}
.pro_send a:hover{ background:#0eade2;}

/*产品标签*/
.tag{ margin:50px 0 10px;}
.tag strong{ font-size:16px;}
.tag a{ padding:0px 10px; line-height:32px; display:inline-block; background:#ebebeb; margin:0 5px; border-radius:3px; color:#666;}
.tag a:hover{color:#000;}

.nav_tb{display:none;}
.nav_off{display:none;}

@media screen and (max-width:1599px){
	
	}

@media screen and (max-width:1199px){
.wid{width: 94%;}	
.header{padding: 15px 2%;}
.banner_text h2{font-size: 32px; line-height: 42px;}
.language{padding: 0 20px;}
.nav li > a{padding: 5px 10px;}
.banner_text p{margin: 10px 0 20px;}
.home_pro{padding: 70px 0;}
.home_com{padding: 70px 0;}
	}

@media screen and (max-width: 768px) {

	}

@media screen and (max-width: 480px) {
.fl-1,.fl-2,.fl-3,.fl-4,.fl-5,.fl-6,.fl-7,.fl-8,.fl-9,.fl-10,.fl-11,.fl-12{width:100%; padding:10px; padding:10px;}
.fr-1,.fr-2,.fr-3,.fr-4,.fr-5,.fr-6,.fr-7,.fr-8,.fr-9,.fr-10,.fr-11,.fr-12{width:100%; padding:10px; padding:10px;}

.header{}
.nav_tb{display:block; position:absolute; top:55px;right:20px; cursor:pointer;}
.logo img{ height: 40px;}
.language{margin: 0 0 0 5px; line-height: 31px; font-size: 14px; padding: 0 8px;}
.nav_off{position: fixed; top: 25px; right: 25px; display: block; z-index: 500; cursor: pointer; display: none;}
.nav{ position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.9); padding-top: 100px; z-index: 300; display: none;}
.nav li{display: block; text-align: center;}
.banner_text{width: 100%; padding-top: 0px;}
.banner_text h2{font-size: 28px; line-height: 38px;}
.banner_text p{font-size: 14px; line-height: 26px; margin: 6px 0 12px;}
.banner_text a{padding: 0 15px; line-height: 30px; font-size: 13px;}
.banner_pic{width: 100%; padding-top: 0px;}
.banner_nav{padding: 0;}
.banner_nav li{font-size: 12px; line-height: 20px; height: 66px;}
.banner_nav li.act{font-size: 14px; height: 86px;}
.home_pro{padding: 35px 0 0;}
.home_title{font-size: 30px; line-height: 40px;}
.home_des{font-size: 16px; line-height: 26px;}
.home_pro_cont{margin-top: 20px;}
.home_pro_box{width: 100%; margin-right: 0; margin-bottom: 50px;}
.home_com{padding: 0px 0 35px;}
.home_com_cont{margin-top: 25px; font-size: 13px; line-height: 24px;}
.home_com_an{margin-top: 25px;}
.foot_box{font-size: 14px;}
.copy{text-align: center; padding: 25px 0 0;}
.copy_logo,.copy_link,.copy_text{margin-right: 0; float: none;}
.copy_text{line-height: 26px; padding: 10px 0;}

.mid_left a{margin-bottom:8px;}
.prolist dl{width:50%;}
.equ a{width:100%;margin:0 0px 15px 0;}
.contact_info{width:100%;}
.message{width:100%;}
	}