@charset "utf-8"; /* CSS Document */ @font-face { font-family: 'HarmonyOS_Sans_SC_Regular'; src: url('HarmonyOS_Sans_SC_Regular.ttf'); } * {outline: 0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box} html {font: normal 14px "HarmonyOS_Sans_SC_Regular";-webkit-text-size-adjust: 100%} body {padding: 0;margin: 0 auto;font-size: 16px; line-height: 1.8; color: #666666;background: #fff; overflow-x: hidden;font-family: 'HarmonyOS_Sans_SC_Regular'; -webkit-text-size-adjust: none; /*鍙栧嚭鐐瑰嚮鍑虹幇鍗婇€忔槑鐨勭伆鑹茶儗鏅?/ -webkit-tap-highlight: rgba(0,0,0,0); } input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;} ul,li, form, dl, dt, dd, div, ol,figure,aside,menu,nav,.mp h1,.mp h2,.mp h3,.mp h4,.mp p{padding: 0;margin: 0; } .ul, .ul li {list-style: none;} table {border-collapse: collapse;border-spacing: 0} table td {border-collapse: collapse;font-size: 14px;} select, input, textarea {font-size: 14px;color: #333;border-radius: 0;-webkit-border-radius: 0;font-family: "HarmonyOS_Sans_SC_Regular";} img{border: none;max-width: 100%;vertical-align: middle;} a {color: #333333;text-decoration: none;noline:-webkit-tap-highlight-color:rgba(0,0,0,0);/* 鍘绘帀閾炬帴瑙︽懜楂樹寒 */} a:hover { color: #169d4c; text-decoration: none;} a:focus {outline: none;-moz-outline: none;} .mp *{ font-weight: normal} pre{ white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word; margin:0; font-family: "HarmonyOS_Sans_SC_Regular"; text-align:justify; text-justify:inter-ideograph; } .clear {clear: both;height: 0px;overflow: hidden;zoom: 0;} .clearfix {*zoom:1;}/*IE/7/6*/ .clearfix:after { content:''; display:block; height:0; clear:both; } img.nopic{ display: none!important} .dot{display: block;white-space: nowrap; text-overflow: ellipsis;overflow: hidden;} .dot2, .dot3, .dot4, .dot5{display: -webkit-box;display: box;overflow: hidden;text-overflow: ellipsis;word-break: break-all;-webkit-box-orient: vertical;} .dot2{-webkit-line-clamp: 2;} .dot3{-webkit-line-clamp: 3;} .dot4{-webkit-line-clamp: 4;} .dot5{-webkit-line-clamp: 5;} .box_absolute{ position: absolute;width:100%; height: 100%;} .ytable{ display:table; width:100%; height: 100%; table-layout: fixed;} .ytable-cell{ display:table-cell; vertical-align:middle;} .zoomimg .pic { overflow: hidden; position: relative} .zoomimg .pic .ispic{background: no-repeat center center; background-size: cover; display: block; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -o-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear; background-size: cover} .zoomimg:hover .pic .ispic{ -webkit-transform: scale(1.1,1.1); -moz-transform: scale(1.1,1.1); -o-transform: scale(1.1,1.1); -ms-transform: scale(1.1,1.1); transform: scale(1.1,1.1);} @media(max-width:1024px){ body{ font-size: 14px;} } .top_h{ height: 100px;} .header{ position:fixed; width: 100%; z-index: 101; background: rgba(255,255,255,0.8)} .header .auto{ padding-top:20px; padding-bottom: 20px;} .header .logo{ position: absolute; max-width: 50%} .header .other{ position: absolute; right: 0; transform: translateY(10px); z-index: 5} .header .other:before{ content:''; position: absolute; width: 1px; height: 50%; top: 25%; background: #d7d7d7;} .top_search{ float: left; position: relative;height: 40px; padding-left: 40px;} .top_search a{ display: inline-block; cursor: pointer; width: 40px; height: 40px; background: url("../images/top_search_icon.png") no-repeat center center;} .top_search .box{ display: none; right: 0; position: absolute; width:220px; background:#fff; padding:0px 30px 0px 10px; border-radius: 0 0 5px 5px; box-shadow: 0 0 0 5px rgba(24,145,63,0.5)} .top_search .box .text{ border: none; width: 100%; height:40px; background: #fff;} .top_search .box a{ position: absolute; right: 10px;} .top_lan{ float: right; padding-left:30px; position: relative} .top_lan a{ display: block;padding-left: 30px; padding-right: 14px; line-height: 40px;} .top_lan dt{position: relative;cursor: pointer;background: url("../images/top_lan_icon.png") no-repeat left center;padding: 0 20px 0 30px;margin-top: 5px;} .top_lan dt:before{content: '';top: 8px;position: absolute;right: 0;width:6px;height:6px;border-right: solid 1px #575757;border-bottom: solid 1px #575757;transform: rotate(45deg)} .top_lan dd{ width: 100%; position: absolute; display: none; padding: 5px 0; background: rgba(24,145,63,0.5); border-radius: 0 0 10px 10px;} .top_lan dd a{ color: #fff} .top_menu{ margin: auto;padding: 10px 0; width:78%;} .top_menu ul{ padding-left: 10%} .top_menu li{ float: left; /*width: 11%;*/ padding: 0 2.5%; position: relative} .top_menu li b{ line-height: 40px; font-weight: normal; position: relative} .top_menu .sub{display: none; padding: 10px 0; } .top_menu .sub span{ display: block} .top_menu .sub a{ display: block;} .top_menu li#m11{ display: none} @media(min-width:1024px){ .top_menu li.aon b a{ color: #18913f} .top_menu li.aon b:after{ content: ''; position: absolute; left: 0; bottom:-10px; width: 100%; height: 3px; background: #18913f} .top_menu .sub{ width: 150%; left: -25%; padding: 20px 0; text-align: center; position: absolute;background: rgba(24,145,63,0.5); border-radius: 0 0 10px 10px;} .top_menu .sub a{ color: #fff;} .top_menu .sub a:hover{ background: #169d4c} } @media(max-width:1520px){ .top_menu li{ padding: 0 2%;} .top_menu li b{ font-size: 15px;} } @media(max-width:1200px){ .top_menu ul{ padding-left: 12%} .top_menu li b{ font-size: 14px;} .top_search{ padding-left:10px;} .top_lan{ padding-left: 10px;} } @media(max-width:1024px){ .wap_nav{ position: fixed; top:10px; right: 4%; width: 40px; height: 40px; background: #18913f; border-radius: 50%} .wap_nav:before, .wap_nav:after{ content: ''; position: absolute; right: 30%; height:2px; background: #fff;transition:transform 0.5s;-webkit-transition:transform 0.5s;-ms-transition:transform 0.5s;} .wap_nav:before{ top: 27%;width: 50%; } .wap_nav:after{ bottom: 27%;width: 40%; } .wap_nav a{ position: absolute; display: block; top: 50%; right: 30%; width:30%; height:2px; margin-top: -1.5px; background: #fff;transition:width 0.3s;-webkit-transition:width 0.3s;-ms-transition:width 0.3s;} .wap_nav.on a{width: 0;} .wap_nav.on:before{top:45%;transform: rotate(45deg);-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);} .wap_nav.on:after{ bottom:45%;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg);} .wap_nav.on:before, .wap_nav.on:after{ right:25%; width:50%} .top_h{ height: 60px;} .header .auto{padding-top:5px; padding-bottom: 5px} .header .other{ right:70px;} .header .logo{ position: relative} .header .logo img{ height: 50px;} .header .other{transform: translateY(5px);} .header .other:before{ display: none} .top_menu{ position:fixed; left: -200%; top: 60px; width: 60%; height: 100vh; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1); transition: 0.5s} .top_menu ul{ padding-left: 0} .top_menu li{ padding-left: 10%; float: none; border-bottom: solid 1px #efefef} .top_menu li b{ display: block; font-size: 17px;} .top_menu li.has-sub b:before{ content: ''; position: absolute; width: 100%; height: 100%;} .top_menu .sub{ opacity: 0.8; font-size: 15px; background: #efefef} .top_menu .sub a{ padding: 5px 10px;} .top_menu .op{position: absolute; width: 40px; height: 100%; height: 100%; transition: 0.3s; right: 0; top: 0;} .top_menu .op:before, .top_menu .op:after{position: absolute; content: ''; width: 12px; height: 2px; background: #fff; left: 50%; top: 50%; transform: translate(-50%,-50%);} .top_menu .op:before, .top_menu .op:after { background: #ccc;} .top_menu .op:after { width: 2px; height: 12px;} .top_menu .op.click { transform: rotate(45deg);} .nav-show .top_menu{ left: -2%; } } .footer{ padding-top: 3%; background: #f9f9f9} .footer .bot_menu{ padding-right: 300px; padding-bottom:3%; min-height:200px} .footer .bot_menu li{ float: left; width: 14%} .footer .bot_menu li b{ display: block; line-height: 50px; font-weight: normal} .footer .bot_menu li b:after{ content: ''; display: block; width:30px;; height: 1px; background: #d5d5d5} .footer .bot_menu li .sub{ padding: 10px 0;} .footer .bot_menu li span{ padding: 2.5% 0; display: block; font-size: 14px;} .footer .bot_menu li span a{ color: #999999} .footer .bot_menu li span a:hover{ color: #18913f} .footer .bot_menu li#bot8, .footer .bot_menu li#bot11{ display: none} .footer .other{ position: absolute; right: 0; top: 0; text-align: right; font-size: 14px; line-height: 30px;} .footer .other .tel{ font-size: 32px; padding-bottom:6%} .footer .other .tel span{ display: none} .footer .other .tel b{ font-weight: normal;} .footer .other .text, .footer .other .ewm, .footer .other .share{ padding-right: 116px;} .footer .other .ewm{ position: relative; margin-bottom: 15px;} .footer .other .ewm img{ position: absolute; width: 100px; right:0; top:-30px;} .share{ height: 32px;} .share dl{ position: relative; display: inline-block;} .share dt a{ cursor: pointer; display: inline-block; width: 32px; height: 32px; background: #f0f0f0 no-repeat center center; border-radius: 100px;} .share dd{ display: none; position: absolute; width: 120px; right:0; bottom:0px; background: #fff; border: solid 1px #ededed; padding:5px; background: #fff} .share .weixin a{ background-image: url("../images/share_weixin.png")} .share .sina{ padding: 0px 10px;} .share .sina a{ background-image: url("../images/share_sina.png")} .share .douyin a{ background-image: url("../images/share_douyin.png")} .copyright{ padding: 2.4% 0; position: relative;font-size: 14px; color: #fff; background: #18913f} .copyright:before{ content: ''; position: absolute; top: 0px; left: 0; width: 70%; height: 10px; background: #006835} .copyright:after{ content: ''; position: absolute; top: -25px; right: 0; width: 30%; height: 10px; background: #18913f} .copyright .icon{ position: absolute; left: 70%; top: -25px; margin-left: -50px;} .copyright a{ color: #fff; display: inline-block} .copyright .icp{ margin: 0 10px;} .copyright .fl{ float: left} .copyright .fr{ float: right} .copyright .fr span:nth-child(2){ padding:0 15px; margin: 0px 12px; border-left: solid 1px #8cc89f;border-right: solid 1px #8cc89f} @media(max-width:1200px){ .footer .bot_menu li{ width: 25%} .footer .bot_menu li span{ padding: 0} .footer .bot_menu li:nth-child(5){ clear: both} .footer .other .tel{ font-size:26px} } @media(max-width:768px){ .footer .bot_menu{ padding-right: 270px;} .footer .bot_menu li{width:50%} .footer .bot_menu li .sub{ display: none} } @media(max-width:640px){ .footer .bot_menu{ display: none} .footer .other{ position: relative; padding-bottom:10%} .footer .other .tel{ font-size:22px;padding-bottom:4%;} .copyright{ padding-top: 4%} .copyright a.icp, .copyright a.wanhu{display: none} .copyright .fl, .copyright .fr{ float: none; text-align: center} .copyright .fl{ font-size: 13px;} } .auto{ width:83.333%; max-width: 1600px; margin: auto; position: relative} @media(max-width:1300px){ .auto{ width:90%;} } @media(max-width:1200px){ .auto{ width:94%;} } .banner{ position: relative} .banner img{ display: block; width: 100%} .banner .wap{ display: none} .banner .box_absolute{ z-index: 100} .banner h2{ color: #fff; line-height: 1; } .banner h2 span{ display: block; font-style:oblique;font-weight: bold} .banner h2 span.en{ font-size:4vw; opacity: 0.1;text-transform: uppercase } .banner h2 span.cn{ font-size:3.2vw;} .banner .slick-dots{ bottom: 10%} .banner .slick-dots li:not(.slick-active) button{ background: #fff} @media(max-width:1024px){ .banner .pc{ display: none} .banner .wap{ display:block} } .menu{ border: solid 1px #ececec; position: relative; z-index: 100} .menu ul li{ padding-right: 80px; font-size: 18px; display: inline-block; line-height: 68px; position: relative} .menu ul li a:hover, .menu ul li.aon a{ color: #169d4c} .menu .a_hover:after{ content: ''; position: absolute; bottom:-7px; left: 25%; width:12px; height:12px; background: #fff; border-bottom: solid 1px #ececec;border-right: solid 1px #ececec; transform:rotate(45deg)} .menu .sub{ display: none; padding: 20px 0; position: absolute; width: 160%; white-space: nowrap; z-index: 10;} .menu .sub dl{border: solid 1px #ececec; padding:2% 2% 2% 4%;background: #fff;} .menu .sub span{ font-size: 16px; display: block; padding:1% 0; line-height: 50px;} .menu .sub span a{ color: #999999; display: block; padding-left: 60px; position: relative; white-space: nowrap; text-overflow:ellipsis; overflow:hidden;} .menu .sub span .icon{ position: absolute; left: 0; display: block; width: 50px; height: 50px; overflow: hidden;} .menu .sub span a:hover img, .menu .sub span.aon img{transform: translateY(50px); filter: drop-shadow(#18913f 0 -50px); } .menu ul li.aon .sub span a{color: #999999;} .menu .sub span a:hover, .menu .sub span.aon a, .menu ul li.aon .sub span a:hover{ color: #169d4c} .menu .two{ position: relative} .menu .three { position: absolute;border: solid 1px #ececec; left:98%; min-width: 200px; background: #fff; opacity: 0.9; top: 0; display: none} .menu .three em{ display: block; font-style: normal;} .menu .three em a{color: #999999; font-size: 15px; padding: 0px 10px; line-height: 40px;} .menu .three em a:hover{color: #169d4c;} @media(max-width:1024px){ .menu ul li{ padding-right:40px; font-size:18px; line-height:50px; } } @media(max-width:768px){ .menu ul li{ padding-right:30px; font-size:16px; line-height:40px; } } .sub_menu {text-align: center;} .sub_menu h1{ font-size: 30px; color: #333333; font-weight: normal} .sub_menu ul { padding: 2% 0} .sub_menu ul li{ display: inline-block; line-height: 30px; padding: 0px 35px;} .sub_menu ul li a{ position: relative; display: inline-block} .sub_menu ul li a:after{ content: ''; position: absolute; display: block; width: 0px; height: 3px; margin: auto; left: 0; right: 0; bottom: -10px; transition: 0.5s} .sub_menu ul li span{ display: inline-block;padding: 0px 35px;} .sub_menu ul .aon a{ color: #169d4c} .sub_menu ul .aon a:after{ width: 100%; background: #169d4c} .sub_menu div{ display: none; padding-bottom: 20px;} .sub_menu dl{ display: none; margin-top: 10px;} @media(max-width:768px){ .sub_menu ul li{padding: 0px 15px;} .sub_menu ul li span{padding: 0px 15px;} } .location{ line-height: 20px; padding-top: 4%; padding-bottom: 4%; text-align: right; font-size: 14px; overflow: hidden} .location a{ position: relative; display: inline-block; margin-right: 20px;} .location a:after, .location a:nth-child(1):before{ content: ''; position: absolute; width: 20px; height: 20px; top: 0; display: block; } .location a:nth-child(1){ color: #fff;} .location a:nth-child(1):before{ left: -15px; background: url("../images/location_home.jpg") no-repeat left} .location a:after{right:-20px; background: url("../images/location_jt.jpg") no-repeat center} .location span{ display: inline-block; color: #87caa1} .f15{ font-size: 15px;} .f16{ font-size: 16px;} .f18{ font-size: 18px;} .f20{ font-size: 20px;} .f24{ font-size: 24px;} .f26{ font-size: 26px;} .f30{ font-size: 30px;} .f32{ font-size: 32px;} .f36{ font-size: 36px;} @media(max-width:1024px){ .f15{ font-size: 14px;} .f16{ font-size: 15px;} .f18{ font-size: 16px;} .f20{ font-size: 18px;} .f24{ font-size: 22px;} .f26{ font-size: 24px;} .f30{ font-size: 26px;} .f32{ font-size: 27px;} .f36{ font-size: 28px;} } @media(max-width:640px){ .f15{ font-size: 13px;} .f16{ font-size: 15px;} .f18{ font-size: 15px;} .f20{ font-size: 16px;} .f24{ font-size: 20px;} .f26{ font-size: 21px;} .f30{ font-size: 22px;} .f32{ font-size: 24px;} .f36{ font-size: 25px;} } .Pages{ padding:4% 0; text-align: center} .Pages span, .Pages span.p_page a.a_first, .Pages span.p_page a.a_end{ display: none} .Pages span.p_page{ display: block} .Pages span.p_page a{ display: inline-block; position: relative; margin: 0px 10px;} .Pages span.p_page em{ font-style: normal} .Pages span.p_page em a{ line-height: 50px; min-width: 50px; padding:0px 5px; border-radius: 4px;} .Pages span.p_page em a.a_cur{ color: #fff; background: #169d4c;} .Pages span.p_page a.a_prev:before, .Pages span.p_page a.a_next:before{ content: ''; position: absolute; margin: auto; top: 0; bottom: 0; width: 8px; height: 8px; border-right: solid 2px #bfbfbf; border-bottom: solid 2px #bfbfbf} .Pages span.p_page a.a_prev:before{ left:-23px; transform: rotate(135deg)} .Pages span.p_page a.a_next:before{ right:-23px; transform: rotate(-45deg)} @media(max-width:640px){ .Pages span.p_page em a{ line-height:32px; min-width:32px; } .Pages span.p_page a.a_prev,.Pages span.p_page a.a_next{ display: none; } .Pages span.p_page a{ margin: 0px 5px; } } .sitemap{ padding-bottom: 4%} .sitemap li{ padding: 1% 0; border-bottom: dashed 1px #eee} .sitemap li span{ display: inline-block; opacity: 0.8; padding-right: 15px;} .font_list li{ position: relative; padding: 2.2% 0; border-bottom: solid 1px #ebebeb} .font_list li span{ float: right} .font_list li a{ padding-left: 20px;} .font_list li:before{ content:''; position: absolute; top: 50%; margin-top: -2.5px; background: #18913f; width: 5px; height: 5px; border-radius: 100px;} .stock_iframe{ padding-top: 2%; padding-bottom: 4%} .stock_iframe iframe{ width: 100%; height: 500px; border: none} .article_info .title{ text-align: center; padding-bottom: 4%; border-bottom: solid 1px #e8e9eb} .article_info .title h1{ color: #333; padding:2% 0;} .article_info .title span{ padding-left: 26px; background: url("../images/time_icon.jpg") no-repeat left} .article_info .article{ padding: 4% 0; max-width: 1300px; margin: auto} .article_info .article img{ height: auto!important} .other_list{ line-height: 42px; padding:5% 0; border-top: solid 1px #e8e9eb} .other_list .back{ width: 150px; text-align: center; display: inline-block; float: right; color: #18913f; border: solid 1px #008442; border-radius:30px;} .other_list .back:hover{ color: #fff; background: #008442} .other_list ul{ width: 70%} .other_list ul i{font-style: normal; color: #999999} .category_intro{text-align: center; padding-bottom: 3%} .category_intro:after{ content: ''; display: block; margin: auto; margin-top: 30px; width: 80px; height: 3px; background: #169d4c} .category_intro .txt{ max-width: 800px; margin: auto;} .product_list{ min-height: 200px;} .product_list ul{ margin-left: -1.137%; margin-right: -1.137%} .product_list li{ float: left; width: 20%; padding: 1.137%;} .product_list .pic img{ display: none} .product_list .pic a{ padding-bottom: 100%} .product_list .info{ display: table; width: 100%; background-color: #f8f9fa; padding: 10px; height: 60px; text-align: center; line-height: 20px;} .product_list .txt{ display: table-cell; vertical-align: middle} .product_list .txt a span{transform: translatey(-4px);display: -webkit-inline-box;width: 12px; margin-left: -5px;} @media(max-width:1024px){ .product_list li{width:33.333%;} } .product_info .info .title{ color: #333;} .product_info .info .title a{ color: #333;} .product_info .info .title:after{ content: ''; margin-top: 10px; display: block; width: 60px; height: 2px; background: #169d4c} .product_info .info .txt{ padding-top: 6%; padding-bottom: 8%; color: #666666} .product_info .info .txt *{ color: #666666!important} .product_info .info .back{display: inline-block; color: #18913f; border: solid 1px #18913f; text-align: center; width: 150px; line-height: 46px; border-radius: 30px;} .product_info .info .back:hover{ background: #006835; border-color: #006835} .product_info strong{ font-weight: 600;} .product_info .photo .pic{ background: no-repeat center center; background-size: cover} .product_info .photo img{ width: 100%;} .product_info .photo .pic{ padding-bottom:75%;} .product_info .big_pic { margin-bottom: 25px;} .product_info .small_pic{ padding: 0 42px;} .product_info .small_pic .item{ padding: 0 8px;} .product_info .small_pic .pic{ border: solid 1px #ffffff; cursor: pointer} .product_info .small_pic .slick-current .pic{ border-color: #169d4c} .product_info .small_pic .slick-arrow{ height: 100%; background-color: #f4f4f4; border-color: #f4f4f4;border-radius: 0;} .product_info .small_pic img{display: none;} .product_info .hizoom{height: 540px!important;} .product_details{ padding:4% 0} .product_details .sub_title{ border-bottom: solid 1px #f2f2f2} .product_details .sub_title span{text-transform: capitalize;color: #333333; line-height: 3; margin-bottom: -1px; display: inline-block;border-bottom: solid 2px #169d4c; font-weight: normal;} .product_details .sub_title .span{margin-left: 20px;border-bottom: none;} .product_details .sub_title .span:hover{border-bottom: solid 2px #169d4c;} .product_details .ul_txt li{ position: relative; padding-left: 20px;} .product_details .ul_txt li:before{ content:''; position: absolute; left: 0; top: 15px; background: #169d4c; width: 4px; height: 4px; border-radius: 100px;} .product_details .info{ padding: 3% ;} .product_details .info:not(.table_box) *{ color: #666666!important} .product_details .table_box{ overflow-x: auto} .product_details .table_box table, .product_details .table_box td{ border: solid 1px #ebebeb!important} /*.product_details .table_box tr:nth-child(odd) td{ background: #f6faf7; color: #87a591!important}*/ .product_details .table_box tr:nth-child(n+4) {display:none;} .product_details .table_box td{ padding: 10px!important;} .product_details .table_box .firstRow td{ background: #4cad73!important; color: #fff!important} .product_details .table_box .firstRow td *{ color: #fff!important} .product_details .sub_green, .product_details .sub_green *{ color: #169d4c!important} .tableMore {clear:both; text-align:center; color:#18913f; padding:2.5% 0; cursor:pointer;} .tableMore .icon {width:36px; margin:0 auto 5px;} .tableMore .icon i {display:block; padding-bottom:100%; border-radius:50%; background-color:#18913f; position:relative;} .tableMore .icon i:before,.tableMore .icon i:after {content:''; display:block; position:absolute; background-color:#fff;} .tableMore .icon i:before {width:60%; height:3px; left:20%; top:50%; margin-top:-1.5px;} .tableMore .icon i:after {width:3px; height:60%; left:50%; top:20%; margin-left:-1.5px;} .tableMore .text i {font-style:normal;} .tableMore.loaded .icon i:after {opacity:0;} .tableMore.loaded .text {display:none;} .tableMore:hover .icon i {background-color:#a8a8a8;} .product_details .gallery { margin:3% 3% 0; max-width: 800px;} .product_details .gallery .slick-prev{ left: -3%} .product_details .gallery .slick-next{ right: -3%} .product_details .gallery .box{ padding: 2%; border: solid 1px #ddd;; margin: 1%} .product_details .gallery .pic { padding-bottom: 2%} .product_details .gallery i {display:block; padding-bottom:73%; background:no-repeat center center; background-size:cover; border-radius: 6px;} .product_details .gallery .txt{ line-height: 20px; height: 40px;font-size: 15px;} @media(max-width:1024px){ .product_info .info .back{width: 120px; line-height:38px;} } @media(min-width:768px){ .product_info .list_img{ float: left; width:39%} .product_info .info{ float: right; width:50.448%} .product_details .gallery.listbox .item{ float: left; width: 50%} } .product_info .slick-slider { position:relative;z-index: 1; display: block;-webkit-touch-callout: none;-ms-touch-action: pan-y; touch-action: pan-y;-webkit-tap-highlight-color: transparent} .product_info .slick-list { position: relative; z-index: 1;display: block; overflow: hidden;} .product_info .slick-list:focus {outline: none} .product_info .slick-list.dragging {cursor: pointer;cursor: hand;} .product_info .slick-slider .slick-track, .product_info .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0)} .product_info .slick-track {position: relative; top: 0; left: 0; display: block;} .product_info .slick-track:before, .product_info .slick-track:after{display: table; content: '';} .product_info .slick-track:after{ clear: both;} .product_info .slick-loading .slick-track { visibility: hidden;} .product_info .slick-slide{ display: none; float: left;min-height: 1px;} [dir = 'rtl'] .slick-slide {float: right;} .product_info .slick-slide .slick-loading img { display: none;} .product_info .slick-slide .dragging img { pointer-events: none;} .product_info .slick-initialized .slick-slide { display: block;} .product_info .slick-loading .slick-slide { visibility: hidden;} .product_info .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;} .product_info .slick-arrow .slick-hidden { display: none;} .product_info .big{margin-bottom:20px;} .product_info .big li figure{border:1px solid #e5e5e5; padding-bottom:75%; background-size:contain;} .product_info .small{ padding:0 30px; position: relative;} .product_info .small .slick-arrow{position:absolute;height:100%;top: 30px;width:25px;z-index:10;cursor:pointer;border: 0;background: none;padding: 0;} .product_info .small .slick-prev{ left:0;} .product_info .small .slick-next{ right:0;} .product_info .small .slick-disabled{ cursor:default;} .product_info .small .slick-arrow span{ font-size:20px; color:#ccc;} .product_info .small li figure{margin:0 auto;padding-bottom: 66%;background-size:contain;max-width:90%;border:1px solid #e5e5e5; background-repeat: no-repeat;} .product_info .small li.slick-current figure{border-color:#18913f;} .zoomContainer{ z-index:100;} .zoomContainer .zoomWindowContainer>div{height:100%!important} .news_slick{ padding:3% 0} .news_slick .slick_js{background: #f8f9fa} .news_slick .item{ position: relative} .news_slick .pic{ position: absolute; width:50%; height: 100%;} .news_slick .pic a{ display: block; height: 100%} .news_slick .pic img{ display: none} .news_slick .txt{ padding: 3.8% 3.8% 3.8% 53.8%} .news_slick h3{ line-height: 36px; height: 72px; margin-top: 5%} .news_slick p{ height: 60px; margin:8% 0; color: #999999} .news_slick time{ padding-left: 26px; background: url("../images/time_icon.jpg") no-repeat left} .news_slick .more{ color: #18913f; padding-right: 26px; background: url("../images/more_icon.png") no-repeat right} .news_slick .slick-dots{ width: auto; right:4%; left: auto} .news_list{ padding:3% 0} .news_list ul{ margin-left: -1.9%; margin-right: -1.9%} .news_list li{ float: left; width: 33.333%; padding:1.2% 1.9%; line-height: 30px;} .news_list .pic a{ padding-bottom:56%;} .news_list .pic img{ display: none} .news_list .txt{ padding:5% 0} .news_list p{ height: 60px; margin: 12px 0; color: #999999} .news_list time{ padding-left: 26px; background: url("../images/time_icon.jpg") no-repeat left} @media(max-width:960px){ .news_list li{ width: 50%} } @media(max-width:480px){ .news_slick .pic{ position: relative; width: 100%} .news_slick .pic img{ display: block; width: 100%} .news_slick .txt{ padding: 4% 2%} .news_list li{ width: 100%} } .jobs_list { padding: 4% 0;} .jobs_list .title{transition: 0.5s; position: relative; border-bottom: solid 1px #f7f7f7} .jobs_list .title:before{ content: ''; position: absolute; right:3%; top: 50%; transform: rotate(-135deg); width: 8px; height: 8px; border-right: solid 2px #999999; border-bottom: solid 2px #999999; transition: 0.5s} .jobs_list .title.first:before{content: none;} .jobs_list .title li{ float: left; width: 16%; padding:1.3% 0; text-align: center} .jobs_list .title li.n1{ padding-left:4%; width: 27%; text-align: left} .jobs_list .title.show{ color: #fff; background: #169d4c; margin-bottom: 0;} .jobs_list .title.show:before{ border-color: #fff; transform: rotate(45deg); margin-top: -4px;} .jobs_list .first{ color: #169d4c; background: #f7f7f7} .jobs_list .list{ padding-top: 9px;} .jobs_list .list .title{ cursor: pointer} .jobs_list .info{ display: none; background: #f7f7f7; padding:3%; line-height: 2.5; position: relative;} .jobs_list .info .sub{ color: #333;} .jobs_list .info .txt{ color: #666; padding-bottom: 4%} .jobs_list .info .txt_wap{ padding-bottom: 4%; display: none} .jobs_list .info .txt_wap p{ padding: 0; margin: 0} .jobs_list .info .txt_wap span{ color: #999} .jobs_list .info .apply{ } .jobs_list .info .apply a{background: #169d4c; text-align: center; color: #fff; line-height:48px; width: 150px; display: block; border-radius:30px} @media (max-width:768px) { .jobs_list .title li.wap{ display: none} .jobs_list .title li.n1{ width: 65%} .jobs_list .title li.n5{ width: 25%} .jobs_list .info .txt_wap{ display: block} } @media(max-width: 640px){ .jobs_list .info .apply{top: 3%; bottom: auto;} .jobs_list .info .apply a{line-height: 40px; width: 120px;} } .form_all{ position: relative; padding-top: 4%; padding-bottom: 6%} .form_all .text{ width: 100%; min-height:38px; padding: 0px 12px; background: #f8f9fa; border:none;} .form_all textarea.text{ min-height: 150px; padding-top: 12px;} .form_all .box_title{ line-height: 38px; width:100px; position: absolute; text-align: right} .form_all .box_input{ padding-left: 110px;} .form_all .box_input label{padding-right: 15px;} .form_all .one_row, .form_all .box{ padding-bottom:15px;} .form_all .box_button{ text-align: center} .form_all .box_button .btn_submit{ font-size: 16px; cursor: pointer;background: #169d4c; text-align: center; color: #fff; line-height:38px; width:168px; border-radius:30px; border: none;} .form_all .box_button .btn_submit:hover{ background: #006835} .form_all .queueList{ margin: 0} .form_all .placeholder .webuploader-pick{ background: #006835} .form_all .yzm_box .text{max-width: 100px} .form_all .form_err{ color: #ff0000} @media (min-width:960px) { .form_all .box_title{ width: 110px;} .form_all .box_input{ padding-left: 140px;} .form_all .one_row, .form_all .box{ padding-bottom: 26px;} .form_all .box{ width: 48%;} .form_all .box:nth-child(odd){ float: left} .form_all .box:nth-child(even){ float: right} } @media(max-width: 640px){ .form_all .box_title{ width:80px;} .form_all .box_input{padding-left: 90px;} } .company_list{ padding-bottom:2%} .company_list ul{ margin-left: -1.2%; margin-right: -1.2%} .company_list li{ float: left; width: 50%; padding:1.2%;} .company_list .box{ position: relative; background: #f5f7fa} .company_list .pic{ position: absolute; width:31.2%; height: 100%;} .company_list .pic a{ display: block; height: 100%} .company_list .pic img{ display: none} .company_list .txt{ padding: 4.5% 4.5% 4.5% 38%} .company_list h3{ line-height:3} .company_list h3:after{ content: ''; display: block; width: 20px; height: 2px; background: #169d4c} .company_list p{ height:150px; margin-top: 8%; line-height: 30px; color: #999999} @media(max-width: 640px){ .company_list li{ float: none; width: 100%} } .contact_info{ position: relative; margin-bottom: 5%;} .contact_info .contact{ width:100%} .contact_info .info{ padding: 2% 0;width:37%;float:left;margin-right:3%;} .contact_info .info h2{ color: #333} .contact_info h4{font-size:18px;text-align:left;color:#169d4c;margin-bottom:10px;} .contact_info .ul_txt li{ padding:8px 0px 8px 30px; color: #666666; line-height: 20px; position: relative} .contact_info .ul_txt li img{ left: 0; position: absolute} .contact_info .other{ font-size: 14px; color: #999999} .contact_info .tel{ color: #169d4c; font-size: 24px; padding-bottom:5%; padding-top: 3%; margin-bottom:5%; border-bottom: solid 1px #e6e7e8} .contact_info .tel span{ position: relative; padding-left: 30px; color: #666666; font-size: 16px;} .contact_info .tel b{ font-weight: normal; display: inline-block;font-size:26px;color:#169d4c} .contact_info .tel img{ left: 0; top: 0; position: absolute;} .contact_info .other .tel{display:none;} .contact_info .text, .contact_info .ewm, .contact_info .share{ padding-left: 116px;} .contact_info .ewm{ position: relative; margin-bottom: 15px;} .contact_info .ewm img{ position: absolute; width: 100px; left:0; top:-30px;} .contact_info .map{ position: absolute; right: 0; top: 0; width: 59.5%; height: 100%;} .contact_info .map img{ max-width: inherit} .contact_company { padding:5% 0; border-top: solid 1px #ebebeb; margin-left: -1.2%; margin-right: -1.2%} .contact_company .list{ float: left; width: 33.333%; padding: 1.2%} .contact_company h2{ line-height:3; margin-bottom: 6%} .contact_company h2:after{ content: ''; display: block; width: 20px; height: 2px; background: #169d4c} .contact_company pre{opacity: 0.8; line-height: 32px;text-align: unset;} .contact_company .info{ color: #333; padding:6%; min-height: 290px; background: #f5f6f7; transition: 0.1s} .contact_company .info:hover{ color:#fff; background: #169d4c} .contact_company .info:hover h2:after{background: #fff} .contact_company .item {display: flex;flex-wrap: wrap;} .contact_company .item .info{ height: 100%;} @media(max-width:1024px){ .contact_info .contact{ width:100%; padding-top: 3%} .contact_info .map{ position: relative; width: 100%; height:320px;} .contact_info .tel{ font-size: 22px; padding-bottom:5%; padding-top:2%; margin-bottom:5%;} .contact_company .list{ width: 50%} } @media(max-width:640px){ .contact_company .list{ float: none;width: 100%} .contact_company .info{ min-height: inherit; padding: 2% 3% 3% 3%} .contact_company h2{margin-bottom: 2%;} .contact_company pre{line-height:26px;} .contact_info .info{width:100%} } .photo_list{ padding:3% 0} .photo_list ul{ margin-left: -1.2%; margin-right: -1.2%} .photo_list li{ float: left; width: 33.333%; padding:1.2%; line-height: 30px;} .photo_list .pic a{ padding-bottom:56%;} .photo_list .pic img{ display: none} .photo_list .txt{ padding:5%; background: #f5f7fa} .photo_list p{ height: 60px; margin: 12px 0; color: #999999} @media(max-width:960px){ .photo_list li{ width: 50%} } @media(max-width:480px){ .photo_list li{ width: 100%} } .download_list {margin-left: -1.2%; margin-right: -1.2%} .download_list li{ float: left; width:25%; padding: 1.2%} .download_list time{ color: #999999} .download_list h3{ line-height: 30px; height: 60px; margin-bottom: 4%; margin-top: 2%} .download_list p{ max-width: 200px; position: relative;} .download_list p:before{ content: ''; position: absolute; left: 50%; top: 20%; width: 1px; height: 60%; background: #cccfd1} .download_list p a{ color: #666; padding-right: 32px; display: inline-block; position: relative} .download_list p a:after{ content: ''; position: absolute; right: 0; top: 0; width: 25px; height: 100%; background: no-repeat right} .download_list p a.browse{ float: left} .download_list p a.browse:after{background-image: url("../images/icon_browse.png")} .download_list p a.download{ float: right} .download_list p a.download:after{background-image: url("../images/icon_download.png")} .download_list .info{ padding:8%; background: #f2f6f9; transition: 0.1s} .download_list .info:hover{ background: #169d4c} .download_list .info:hover time, .download_list .info:hover a{ color: #fff!important} .download_list .info:hover p a:after{filter: grayscale(100%) brightness(500%); } .form_box1{width: 100%; height: 100%; position: fixed; background-color: rgba(0,0,0,0.5); display: none; left: 0; top: 0; z-index: 50;} .form_box1 .form{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; max-width: 400px; padding: 30px; background-color: #fff; height: auto;} .form_box1 .close{z-index: 1000; position: absolute; top: 30px; right: 30px; background: url(../images/out.png)no-repeat center; width: 17px; height: 17px;} .form_box1 .close:hover{cursor: pointer;} .form_box1 .input_box{margin: 15px 0;} .form_box1 label{font-size: 14px;} .form_box1 .input{width: 100%; padding: 10px; border-radius: 2px; border: 1px solid #ccc;} .form_box1 .download{padding: 0 20px; ; font-size: 14px; color: #fff; background-color: #169d4cd7; border: 1px solid #169d4c; line-height: 45px; height: 45px;} .form_box1 .download:hover{background-color: #169d4c} @media(max-width:1024px){ .download_list li{ width: 33.333%} } @media(max-width:640px){ .download_list li{ width:50%} } .search_certificate{padding: 3% 0;} .search_certificate .title{font-size: 19px; line-height: 1.375; padding: 20px 0 10px; text-align: center;} .search_certificate .form_item{padding: 2%; } .search_certificate .form_box{padding: 10px; border: 1px solid #ccc;} .search_certificate .input_box{padding: 5px 0;} .search_certificate .tit{font-size: 21px;text-transform: capitalize;} .search_certificate .txt{padding: 10px 0 20px; line-height: 1.4; box-sizing: content-box;} .search_certificate .tips{color: #ff0000;} .search_certificate .tips a{color: #005293;} .search_certificate .ts{ color: #999;} .search_certificate .ts span, .search_certificate label span{ color: #ff0000} .search_certificate label{font-size: 14px;} .search_certificate .input_box label{ margin-right: 20px;} .search_certificate .input, .search_certificate .text{width: 100%; padding: 10px; border-radius: 2px; border: 1px solid #ccc;} .search_certificate textarea{ height: 100px} .search_certificate .download, .search_certificate .btn{padding: 0 20px; ; font-size: 14px; color: #fff; background-color: #169d4cd7; border: 1px solid #169d4c; line-height: 45px; height: 45px; width: 30%; margin: auto; display: block; text-align: center; cursor: pointer;} .search_certificate .download:hover, .search_certificate .btn:hover{background-color: #169d4c} .search_certificate .two .input_box{ width: 48%;} .search_certificate .two .input_box:nth-child(1){ float: left} .search_certificate .two .input_box:nth-child(2){ float: right} .search_certificate .three .input_box{ width:32%; float: left} .search_certificate .three .input_box:nth-child(2){ margin: 0 2%} .search_certificate .con { position:relative;} .search_certificate .box{ position: relative;} .search_certificate .con .download {width:135px; position:absolute; right:0; top:0; height:41px; line-height:41px;} .search_certificate .list {margin-bottom:3.29%;} .search_certificate .list li {line-height:1.875em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-bottom:1px dashed #e4e4e4; padding:8px 0; list-style:none;} .search_certificate .list a {color:#555;} .search_certificate .list li h2{font-size: 18px;font-weight: normal;} .search_certificate .list li aside{font-size: 15px;} .search_certificate .list a:hover {color:#169d4c;} .search_certificate .box{ padding-right: 0; overflow: visible} .search_certificate .sub-list .box:before{ content: ''; cursor: pointer;position: absolute; right: 0;border-left: solid 1px #ccc; background: url("../images/icon-jt.png") no-repeat center center; width: 40px; height: 100%;} .search_certificate .sub-list ul{ position: absolute; width: 100%;border: solid 1px #ccc; background:rgb(235 235 235 / 92%); z-index: 10; display: none; max-height: 398px; overflow: auto; } .search_certificate .sub-list ul li{ padding: 5px 10px; border-bottom: solid 1px #ccc;} @media(min-width:768px){ .search_certificate .form_item .fl{ float: left;width:40%;} .search_certificate .form_item .fr{ float: right;width:58%;} .search_certificate .fl .input_box{padding: 15px 0;} .search_certificate .fr .input_box{padding: 8px 0;} .search_certificate .form_box{padding: 30px; } } @media(max-width:1024px){ .search_certificate .con {padding-right:0;} .search_certificate .con .download {position:static; width:100%; margin-top:5px;} } @media(max-width:768px){ .search_certificate .form_item .fr{ margin-top: 3%} } .about_us h1.f30{font-weight: normal; color: #333333; text-align: center; padding:0 0 2% 0; margin: 0; line-height: 2} #About{ padding-bottom: 5%} #About .info{ color: #666666} #About h1.f30{ text-align: left; margin-bottom: 3%;} #About h1.f30:after{ content: ''; display: block; margin-top:15px; width: 50px; height: 2px; background: #000000} #About .txt2{ color: #999999; padding: 4% 0;} #About .txt2 p{ float: left; width: 20%; line-height:1.2} #About .txt2 p b{ font-size: 1.2vw; width: 90%; font-weight: normal; display: block; color: #169d4c; border-right: solid 1px #d0ebdb} #About .txt2 p:last-child b{ border-right: none} #About .show_video img, #About .show_video .play_video{ opacity: 0} #About .photo { position: relative; max-width: 620px;} #About video{ position: absolute; width: 100%; height: 100%; position: absolute} #About .play_video{ position: absolute; margin: auto; left: 0; right: 0; top: 0; bottom: 0; background: #fe8b1e ; width: 0; height: 0; padding: 5.3%; border-radius: 100%} #About .play_video i{ display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 5; background: url("../images/video_icon.png") no-repeat center center} #About .play_video:before, #About .play_video:after{ content:''; position: absolute; margin: auto; top: 0; bottom: 0; background: #fe8b1e; opacity: 0.2; border-radius: 100%} #About .play_video:before{width: 130%; height: 130%;left: -15%; right: -15%; animation:mymove 3s infinite;-webkit-animation:mymove 3s infinite;} #About .play_video:after{width: 150%; height: 150%;left: -25%; right: -25%; animation:mymove 5s infinite;-webkit-animation:mymove 5s infinite;} @media(min-width:1024px){ #About .fl_fr .info{ float: left; width:55%; line-height: 36px;} #About .fl_fr .photo{ float: right; width: 40%;} } @media(max-width:640px){ #About .txt2 p{ width: 50%; padding: 2% 0} #About .txt2 p b{ font-size: 5vw; } #About .txt2 p:nth-child(2) b{ border-right: none} } #Culture{ padding: 5% 0; background:#f7f9fa url("../images/culture_bg.png") no-repeat left top; background-size: 50%} #Culture ul{ margin-left: -1%; margin-right: -1%} #Culture li{ float: left; width: 20%; padding:1%} #Culture h4{ line-height: 2; padding:5% 0; margin-bottom:15%; border-bottom: solid 1px #ebebeb} #Culture .icon img{ width: 35px;} #Culture pre{ color: #666666; line-height: 30px;} #Culture .txt{ background: #fff; padding:18% 10% 5% 10%; min-height: 360px; box-shadow: 0 0 24px rgba(0,0,0,0.05)} #Culture .txt:hover{ background: #169d4c} #Culture .txt:hover h4, #Culture .txt:hover pre{ color: #fff} #Culture .txt:hover .icon{filter: grayscale(100%) brightness(500%); } #Culture .txt:hover h4{ border-bottom-color: #2ea75e} @media(max-width:1024px){ #Culture li{ width: 33.333%} } @media(max-width:640px){ #Culture li{ width:100%; float: none} #Culture .txt{ padding: 5%; min-height: inherit} #Culture h4{ padding: 2% 0; margin-bottom:2%; } } /* #Honor{padding: 5% 0 10% 0; } #Honor .list{ padding: 0 5%; max-width: 1380px; margin: auto; position: relative;background: url("../images/honor_bg_c.jpg") repeat-x bottom} #Honor .list:before, #Honor .list:after{ content: ''; position: absolute; width: 10%; height: 84px; bottom: 0; background: no-repeat} #Honor .list:before{ left: 0; background-image: url("../images/honor_bg_l.jpg"); background-position: left top} #Honor .list:after{ right: 0; background-image: url("../images/honor_bg_r.jpg"); background-position: right top} #Honor .pic{ position: relative;max-width: 175px; padding:2.5%; margin: auto; } #Honor .pic a{ padding-bottom: 146.5%; display: block; background: no-repeat center center; background-size: contain} #Honor .pic img{ display: none} #Honor h4{ text-align: center; margin-top:45px; line-height:20px; height:40px;} #Honor .slick-dots{ bottom: -10%;} #Honor .slick-dots li button{ width: 15px; height: 15px;} #Honor .slick-dots li.slick-active button{ background: #18913f} */ #History{ padding: 4% 0; background:#e8eef0 url("../images/history_bg.jpg") no-repeat left top; background-size:cover} #History .list{ position: relative; text-align: center;} #History .list img{ width: 100%;} /* #History .list:before{ content: ''; position: absolute; left: 5%; width: 90%; height: 1px; top: 50%; background: #e0e0e0} */ #History .info{ position: relative; width: 150%; height: 210px; display: table;padding: 0 8%; border-left: solid 1px #e0e0e0} #History .info figure{padding-bottom: 90%;background-size:cover;} #History .txt{ display: table-cell} #History h4{ font-size: 40px; color: #333} #History .info:hover h4{ color: #169d4c} #History .info:before{ content: ''; left: -5px; position: absolute; width: 9px; height: 9px; border-radius: 100%; background: #e0e0e0; box-shadow: 0 0 0 5px #fff} #History .item{ padding: 10px;} #History .item:nth-child(odd){ padding-bottom:210px} #History .item:nth-child(even){ padding-top: 243px} #History .item:nth-child(odd) .info:before{bottom: 0; } #History .item:nth-child(even) .info:before{top: 0; } #History .item:nth-child(even) .txt{ vertical-align: bottom} @media(max-width:1024px){ #History h4{ font-size:30px; } } @media(max-width:640px){ #History h4{ font-size:20px; } } /*index*/ .index_banner{ position: relative} .index_banner img{ width: 100%;} .index_banner .wap{ display: none} .index_banner .slick-dots li button{width:16px; height: 16px; background: none; border: solid 1px #fff} .index_banner .slick-dots li.slick-active button{ background: #008442; border-color: #008442} .index_banner .search{ position: absolute; z-index: 99; width: 100%; bottom: 30%} .index_banner .search .box{ position: relative;background: #fff; border-radius: 30px; padding: 10px 70px 10px 20px; max-width: 490px;} .index_banner .search .box .text{ width: 100%; height: 40px; border: none; color: #dadada} .index_banner .search .box a{ position: absolute; right: 20px; width: 40px; height: 40px; bottom: 10px;display: inline-block; cursor: pointer; background: url("../images/top_search_icon.png") no-repeat center center;} @media(max-width:1024px){ .index_banner .pc{ display: none} .index_banner .wap{ display:block} .index_banner .search{ position: relative; box-shadow: 0 0 10px rgba(0,0,0,0.1)} .index_banner .search .box{ margin: auto;} } .index_part .sub_title{ color: #333; margin-bottom:40px;} .index_part .sub_title:after{ content: ''; display: block; margin-top:15px; width: 50px; height: 2px; background: #000000} .index_part .more{ padding-top: 20px;} .index_part .more a{display: inline-block; color: #18913f; border: solid 1px #18913f; text-align: center; width: 150px; line-height: 46px; border-radius: 30px;} .index_part .more a:hover{ background: #006835; border-color: #006835} @media(max-width:1024px){ .index_part .sub_title.f30{ margin-bottom:20px;} .index_part .more a{width: 120px; line-height:38px;} } .index_part #About{ padding-top: 4% ;padding-bottom: 4%; background: url("../images/index_about_bg.jpg") no-repeat left bottom; background-size: 100%;} .index_part #About .txt2 p b{ color: #666666} #stats{ display: none} #Product{ padding-top: 4%; position: relative; background: #f9f9f9;} #Product .tab_box .item{ text-align: center; cursor: pointer;} #Product .tab_box .item .icon{ overflow: hidden; width: 50px; height: 50px; margin: auto} #Product .tab_box .item .yuan{ position: relative; padding: 20px 0} #Product .tab_box .item .yuan:before, #Product .tab_box .item .yuan:after{ content: ''; position: absolute; display: block; width:40%; height: 1px; top: 50%; background: #e4e4e4} #Product .tab_box .item .yuan:before{ left: 0} #Product .tab_box .item .yuan:after{ right: 0} #Product .tab_box .item .yuan i{ display:inline-block;border: solid 1px #7c7c7c;border-radius: 20px; padding: 5px;line-height: 0; } #Product .tab_box .item .yuan i:before{ content: ''; display: inline-block; background: #7c7c7c; width: 6px; height: 6px; border-radius: 20px;} #Product .tab_box .item.slick-current .yuan i{ border-color: #008442} #Product .tab_box .item.slick-current .yuan:after, #Product .tab_box .item.slick-current .yuan i:before{background: #008442; } #Product .tab_box .item.slick-current .icon img{transform: translateY(50px); filter: drop-shadow(#18913f 0 -50px); } #Product .tab_box .item.slick-current h4{ color: #18913f} #Product .list_box { margin-top: 6%} #Product .list_box pre{ line-height: 36px;} #Product .list_box .item .pic{border-radius: 10px; overflow: hidden} #Product .list_box .num{ font-size: 24px; line-height: 40px; color: #bbd7c1; text-align: right;position: absolute; z-index:100; width: 20%; padding:10px 20px; right: 45.775%; bottom: 0; background: #18913f; border-radius: 0 0 10px 0} #Product .list_box .num:before{ content: ''; position: absolute; left: 30%; top: 50%; width: 40%; height: 1px; background: #8cc89f} #Product .list_box .slick-dots{ width: auto; left: 35%; bottom:10px; z-index: 101; line-height: 40px;} #Product .list_box .slick-dots li{ display: none;} #Product .list_box .slick-dots li.slick-active{ display: block} #Product .list_box .slick-dots li.slick-active button{font-size: 24px; color: #fff; background:none; height: 40px} #Product #particles-js{ position: absolute; width: 100%; height: 100%; top: 0; bottom: 0 } #Product .count-particles{ display: none} #Product canvas{ display:block; vertical-align:bottom; } @media(min-width:1200px){ #Product .slick_js{ transform:translateY(100px)} } @media(min-width:768px){ #Product .list_box .item .pic{ float: left; width:54.225%; } #Product .list_box .item .pic a{ padding-bottom:58.14%;} #Product .list_box .item .pic img{ display: none} #Product .list_box .item .info{ float: right; width: 40%} } @media(max-width:1200px){ #Product .list_box pre{ line-height: 26px;} } @media(max-width:768px){ #Product .list_box .num{ right: 0; font-size: 16px; padding: 0 10px;} #Product .list_box .slick-dots{ left: 80%; bottom: 0} #Product .list_box .slick-dots li.slick-active button{font-size: 16px;} } #NewsTechnology{ padding-top: 3%; padding-bottom: 3%} #NewsTechnology .fl_box .item{ position: relative; padding: 2.2% 0; border-bottom: solid 1px #efefef} #NewsTechnology .fl_box .item:first-child{ padding-top: 0; padding-bottom: 4%; margin-bottom: 4%} #NewsTechnology .fl_box .item:first-child time{ padding-left: 26px; display: block; margin-bottom: 10px; background: url("../images/time_icon.jpg") no-repeat left} #NewsTechnology .fl_box .item:first-child pre{color: #999999; line-height: 30px; height: 60px; margin: 15px 0} #NewsTechnology .fl_box .item .view{ color: #18913f; padding-right: 26px; background: url("../images/more_icon.png") no-repeat right} #NewsTechnology .fl_box .item:not(:first-child) time{ float: right; padding-left: 10px;} #NewsTechnology .fl_box .item:not(:first-child) a{ padding-left: 20px;} #NewsTechnology .fl_box .item:not(:first-child) h4:before{ content:''; position: absolute; top: 50%; margin-top: -2.5px; background: #18913f; width: 5px; height: 5px; border-radius: 100px;} #NewsTechnology .fl_box .item:not(:first-child) .pic, #NewsTechnology .fl_box .item:not(:first-child) pre, #NewsTechnology .fl_box .item:not(:first-child) .view{ display: none} #NewsTechnology .fl_box .box{ position: relative} #NewsTechnology .fl_box .info{ position: relative} #NewsTechnology .fr_box{ max-width: 500px;} #NewsTechnology .fr_box .info{ position: relative; border-radius:8px; overflow: hidden;} #NewsTechnology .fr_box .info:before{ content:''; position: absolute; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(24,145,63,0), #18913f 90%); } #NewsTechnology .fr_box .txt{ z-index: 2; color: #fff; position: absolute; padding:7%; width: 100%; bottom: 5%} #NewsTechnology .fr_box h4{ line-height: 42px;} #NewsTechnology .fr_box .more{ padding-top:8%} #NewsTechnology .fr_box .more a{ color: #fff; border-color:#fff; } #NewsTechnology .slick-dots{ position: relative; bottom: auto; padding: 4% 0} @media(min-width:1024px){ #NewsTechnology .fl_box{ float: left; width: 62.5%} #NewsTechnology .fl_box .item:first-child .pic{ width:30.242%; height: 100%; position:absolute} #NewsTechnology .fl_box .item:first-child .pic a{ height: 100%; background-size: cover} #NewsTechnology .fl_box .item:first-child .pic img{ display: none} #NewsTechnology .fl_box .item:first-child .info{ float: right; width:63.5%} #NewsTechnology .fr_box{ float: right; width:31.53%} } @media(min-width:1200px){ #NewsTechnology{ padding-top:12%;} } @media(max-width:1024px){ #NewsTechnology .fl_box .item:first-child .pic a{ background: no-repeat!important} } @media(max-width:768px){ #NewsTechnology .fl_box .item:first-child .info{ padding-top: 4%} #NewsTechnology .fl_box .item:first-child time{ position: absolute; top: -30px; line-height: 30px; padding-right: 10px; border-radius: 0 5px 0 0; background-color: #fff} #NewsTechnology .fl_box .item:not(:first-child) time{ font-size: 13px} } @keyframes mymove { 0%{transform: scale(1); } 25%{ transform: scale(1.1); } 50%{transform: scale(1);} 75%{ transform: scale(1.1);} } /*Floor002691 */ /*.Floor002691{ position:relative; z-index:1; background:#f6f6f6; overflow:hidden; padding:2% 0 7% 0;}*/ .Floor002691{padding: 5% 0; } .Floor002691 .list-scroll{ padding: 0 5%; max-width: 1380px; margin: auto; position: relative;background: url("../images/honor_bg_c.jpg") repeat-x bottom} .Floor002691 .list-scroll:before, .Floor002691 .list-scroll:after{ content: ''; position: absolute; width: 10%; height: 84px; bottom: 0; background: no-repeat} .Floor002691 .list-scroll:before{ left: 0; background-image: url("../images/honor_bg_l.jpg"); background-position: left top} .Floor002691 .list-scroll:after{ right: 0; background-image: url("../images/honor_bg_r.jpg"); background-position: right top} .Floor002691 .title{font-family: "AkzidenzGroteskBQ BdCnd"; color:#2c6542; text-transform:uppercase; text-align:center; font-size:30px; padding:3% 0;} .Floor002691 .list{padding-bottom:4%;} .Floor002691 .list dl{ text-align:center; display:table; width:100%; max-width:610px; margin:0 auto;} .Floor002691 .list dl dd{float:left;width: 33.33%;} .Floor002691 .list dl dd span{display:inline-block;font-size: 20px;cursor:pointer;padding-bottom:5px;border-bottom:2px solid transparent;} .Floor002691 .list dl dd.on span{color: #18913f;border-bottom-color: #18913f;} .Floor002691 .list .Intro{ padding-top: 4%;} .Floor002691 .slick-slider {position: relative;display: block;-webkit-touch-callout: none;-ms-touch-action: pan-y; touch-action: pan-y;-webkit-tap-highlight-color: transparent} .Floor002691 .slick-list { position: relative; z-index: 1;display: block;/*overflow: unset;*/} .Floor002691 .slick-list:focus {outline: none} .Floor002691 .slick-list.dragging {cursor: pointer;cursor: hand;} .Floor002691 .slick-slider .slick-track, .Floor002691 .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0)} .Floor002691 .slick-track {position: relative; top: 0; left: 0; display: block;} .Floor002691 .slick-track:before, .Floor002691 .slick-track:after{display: table; content: '';} .Floor002691 .slick-track:after{ clear: both;} .Floor002691 .slick-loading .slick-track { visibility: hidden;} .Floor002691 .slick-slide{ display: none; float: left; min-height: 1px;} [dir = 'rtl'] .slick-slide {float: right;} .Floor002691 .slick-slide .slick-loading img { display: none;} .Floor002691 .slick-slide .dragging img { pointer-events: none;} .Floor002691 .slick-initialized .slick-slide { display: block;height: 335px;} .Floor002691 .slick-loading .slick-slide { visibility: hidden;} .Floor002691 .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;} .Floor002691 .slick-arrow .slick-hidden { display: none;} .Floor002691 .slick-prev{ left: -5%;} .Floor002691 .slick-next{ right: -5%;} .Floor002691 .list-scroll li.slick-slide a{display:block;/* max-width: 175px; */margin:0 auto;transition:0.3s;padding-bottom: 100%;background: no-repeat center top;background-size: contain;} .Floor002691 .list-scroll li.slick-slide a:hover{ color:#2c6542;} .Floor002691 .list-scroll li .pic{/* overflow:hidden; */position: relative;max-width: 175px;padding: 0;margin: auto;} .Floor002691 .list-scroll li .pic img{display:block;width:100%;transition:0.3s;display: none;} .Floor002691 .list-scroll li.slick-slide a:hover .pic img{ transform:scale(1.12);} .Floor002691 .list-scroll li .txt{text-align:center;padding: 2%;font-size: 16px;} .Floor002691 .list-scroll .slick-dots{ text-align:center; padding-top:20px;} .Floor002691 .list-scroll .slick-dots li{display:inline-block;cursor:pointer;margin: 0 10px;width: 15px;height: 15px;background: #bfbfbf;border-radius:50%;padding: 0;} .Floor002691 .list-scroll .slick-dots li button{ display:none;} .Floor002691 .list-scroll .slick-dots li.slick-active{background: #18913f;} .Floor002691 .more{ text-align:center; padding:3% 0;} .Floor002691 .more a{ position:relative; display:block; max-width:250px; margin:0 auto; width:60%; color:#fff; background:#2c6542; text-transform:uppercase; font-size:12px;border:1px solid #dcdcdc; line-height:58px;transition:800ms ease all;} .Floor002691 .more a:hover{ color:#2c6542; background:#fff; border-color:transparent;} .Floor002691 .more a::before, .Floor002691 .more a::after{content:'';position:absolute;height:3px;width:0;background: #2c6542;transition:400ms ease all;} .Floor002691 .more a::before{top:-1px;right:0;} .Floor002691 .more a::after{left:0;bottom:-1px;} .Floor002691 .more a:hover:before, .Floor002691 .more a:hover:after{width:100%;transition:800ms ease all;} @media(max-width:480px){ .Floor002691 .list-scroll li.slick-slide:nth-child(2n-1) a{ margin-top:0;} .Floor002691 .list dl dd span{font-size:18px;} } .Other002907 {position: fixed;right: 10px;bottom: 10%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);z-index: 200;border: 1px solid #eee;border-bottom: 0;width: 295px;background-color: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.2);padding: 20px;} .Other002907 ol{font-size:20px;color: #333;margin-bottom: 20px;} .Other002907 li{line-height: 35px;padding-left: 30px;background: url(../images/Map002364-icon2.png) no-repeat center left;font-size: 14px;color: #767676;} .Other002907 li:nth-child(2){background-image:url(../images/Map002364-icon.png);} #download {padding: 3% 0;} #download .list {margin-bottom: 3.5%;} #download li {font-size: 16px; line-height: 1.875em; border-bottom: 1px dashed #e6e6e6; padding: 2% 0;} @media only screen and (max-width: 768px){ #download {padding: 5% 0;} #download .list {margin-bottom: 5%;} #download li {font-size: 14px; padding: 3.5% 0;} } .Map002793 .auto_1440{max-width:1440px;margin: 0 auto;} @media(max-width:1440px){ .Map002793 .auto_1440{ padding:0 2%;} } .Map002793{ padding-bottom: 8%;} .Map002793 p{font-size: 16px;text-align: center;margin-bottom: 2em;} .Map002793 .box{ position: relative;} .Map002793 .box img{ display: block; width: 100%;} .Map002793 .con{position: absolute;left: 0;top: 0;width: 100%;max-height: 100%;overflow: auto;color: #fff;padding: 3%;} .Map002793 .con h2{margin: 0 0 3em 0;font-size: 36px;line-height: normal;} .Map002793 .con h2 span{display: block;font-size: 14px;font-weight: normal;} .Map002793 .con .txt{max-width: 1006px;line-height: 30px;overflow: hidden;} .Map002793 .con ul{ display: table; width: 50%; float: left;} .Map002793 .con li{ display: table-row;} .Map002793 .con ol{font-size: 24px;margin-bottom: 15px;} .Map002793 .con ul:nth-child(2) li span:first-child{ width: 120px;} .Map002793 .con .txt:after{ margin: 3% 0 4%;} .Map002793 .con .more{ width: 140px; line-height: 36px; text-align: center; background: rgba(255,255,255,0.5); color: #595656; display: block;} .Map002793 .con .more:before{ content: ''; display: inline-block; width: 15px; height: 15px; background: url("../images/Map002793-icon.png") no-repeat center; vertical-align: middle; margin-right: 5px;} .Map002793 .tab_span li{float: left;color: #888888;background: #f5f5f5;text-transform: uppercase;width: 13.4%;padding: 20px 10px;margin-right: 1%;margin-top: 25px;cursor: pointer;font-size: 12px;min-height: 160px;} .Map002793 .tab_span b{display: block;font-size: 18px;color: #555;line-height: 30px;height: 60px;} .Map002793 .tab_span li:last-child{ margin-right: 0;} .Map002793 .tab_span li.on{background: #18913f;color: #eee;position: relative;} .Map002793 .tab_span li.on b{ color: #fff;} .Map002793 .tab_span li.on:before{ content: '';position: absolute;left: 50%;transform: translateX(-50%);-ms-transform: translateX(-50%);-moz-transform: translateX(-50%);-webkit-transform:rotate translateX(-50%);-o-transform:rotate translateX(-50%);border: 10px solid transparent;border-bottom-color: #595656;bottom: 100%;} @media(max-width:1000px){ .Map002793 .tab_span{ display: none;} .Map002793 .box{ display: block!important; margin-bottom: 2%;} .Map002793 .con ul{width: 100%; float: none;} } @media(max-width:640px){ .Map002793 .con{ position: static; color: #555;} .Map002793 .con h2{ font-size: 20px;} .Map002793 .con li span{ min-width: 80px;} .Map002793 .con .more{background:#ddd;} } .product_details .swiper { width: 100% !important; height: 100%; } /* .product_details .slick-track{ width: 100% !important; }*/ .product_details .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .product_details .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } .fixed_right{ position: fixed; text-align: center; left: 0; bottom: 0; width: 100%;background: #f3f3f3; border: 1px solid #dcdcdc; z-index: 200;} .fixed_right a{ display: block; width: 100%;color: #fff; font-size: 18px;line-height: 60px;} .fixed_right .more{ display: inline-block;margin-left: 30px;font-size: 14px; margin-bottom: 5px; border-radius: 3px;background-color: #ffffff;padding: 10px 20px; color: #18913f; line-height: normal;} .fixed_right .close{position: absolute; top: 1px; right: 40px; width: 60px; height: 60px; cursor: pointer;} .fixed_right .close::before, .fixed_right .close::after{ content: ''; width: 2px; height: 50%; left: 50%; top: 25%; position: absolute; background-color: #000; border-radius: 2px;} .fixed_right .close::before{ transform: rotate(45deg);} .fixed_right .close::after{ transform: rotate(-45deg);} .search_certificate .list2 a{ padding-right: 100px; position: relative;} .search_certificate .list2 a .icon{position: absolute; top: 0; text-align: center; width: 90px; right: 10px;background: url(../images/TextList002798-icon.png) no-repeat left 12px center #fff; padding-left: 30px; border: 1px #18913f solid; color: #18913f; line-height: 28px;} /*Banner002826 */ .Banner002826{position: relative; z-index: 1;} /*忙鈥撀姑β斥€?*/ /*.Banner002826 li.slick-slide{position: relative;} .Banner002826 li.slick-slide img{display: block;width: 100%;} .Banner002826 li.slick-slide video{position: absolute; z-index: 10; left: -100%; top: -100%; min-height: 100%; min-width: 100%; opacity: 0; transition: 0.3s;} .Banner002826 li.video-show video{left: 50%;opacity: 1;top: 50%; transform: translate(-50%,-50%);} .Banner002826 li.slick-slide .open-video{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3) url(../images/Banner002826_play.png) no-repeat center center;background-size: auto 50px; z-index: 20;transition: 0.3s;} .Banner002826 li.video-show .open-video{opacity: 1;} @media(min-width:1025px){ .Banner002826 li.slick-slide img.wap{display: none;} } @media(max-width:1024px){ .Banner002826 li.slick-slide img.pc{display: none;} }*/ /*忙鈥撀姑β斥€?茂录艗2茂录艗3*/ .Banner002826 li.slick-slide{position: relative;} .Banner002826 li.slick-slide img{display: block;width: 100%;} .Banner002826 li.slick-slide video{position: absolute; z-index: 10; left: 50%; top: 50%; transform: translate(-50%,-50%);min-height: 100%; min-width: 100%;} @media(min-width:1025px){ .Banner002826 li.slick-slide img.wap{display: none;} } @media(max-width:1024px){ .Banner002826 li.slick-slide img.pc{display: none;} .Banner002826 li.slick-slide video{left: -100%;top: 100%; opacity: 0;} .Banner002826 li.slick-slide .open-video{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3) url(../images/Banner002826_play.png) no-repeat center center;background-size: auto 50px; z-index: 20;} .Banner002826 li.video-show .open-video{left: -100%;opacity: 0; transform: translateX(-100%);} .Banner002826 li.video-show video{left: 50%; top: 50%; opacity: 1;} } /*忙鈥撀姑β斥€? 忙路禄氓艩聽忙鈥櫬︹€澛久ε掆€懊┾€櫬?氓录鹿莽陋鈥?/ /*.Banner002826 .open-video{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3) url(../images/Banner002826_play.png) no-repeat center center;background-size: auto 50px; z-index: 20; cursor: pointer;} .video-openbox{position:fixed;left:0;height:100%;width:100%; z-index:500;background:rgba(0,0,0,0.5); top:0;} .video-openbox .ytable{height: 100%;} .video-openbox .close{position: absolute;right: 20px;top: 20px; width: 30px; height: 30px; cursor: pointer; z-index: 10; cursor: pointer;} .video-openbox .close:before, .video-openbox .close:after{position: absolute;width: 100%; left: 0; top: 50%; height: 3px; margin-top: -1.5px; background: #fff; content: '';transform: rotate(45deg);-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);} .video-openbox .close:after{transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg);} .video-openbox video{max-width: 1200px; margin: 0 auto;display: block;}*/ .slick-slider {position: relative;display: block;-webkit-touch-callout: none;-ms-touch-action: pan-y; touch-action: pan-y;-webkit-tap-highlight-color: transparent} .slick-list { position: relative; z-index: 1;display: block; overflow: hidden;} .slick-list:focus {outline: none} .slick-list.dragging {cursor: pointer;cursor: hand;} .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0)} .slick-track {position: relative; top: 0; left: 0; display: block;} .slick-track:before, .slick-track:after{display: table; content: '';} .slick-track:after{ clear: both;} .slick-loading .slick-track { visibility: hidden;} .slick-slide{ display: none; float: left; min-height: 1px;} [dir = 'rtl'] .slick-slide {float: right;} .slick-slide .slick-loading img { display: none;} .slick-slide .dragging img { pointer-events: none;} .slick-initialized .slick-slide { display: block;} .slick-loading .slick-slide { visibility: hidden;} .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;} .slick-arrow .slick-hidden { display: none;} .Banner002826 .slick-dots{position: absolute;left: 96%;transform: translate(-50%,0);bottom: 7%;overflow: hidden;z-index: 10;} .Banner002826 .slick-dots li{float: left;width: 16px;height: 16px;position: relative;border-radius: 50%;/* border: 1px solid #fff; */cursor: pointer;/* background: #008442; */padding: 0px;} .Banner002826 .slick-dots li:not(:last-child){margin-right: 10px;} .Banner002826 .slick-dots li:before{position: absolute;left: 0px;top: 0px;right: 0px;bottom: 0px;border-radius: 50%;background: rgba(255,255,255,.0);transition: 0.3s;content: '';border: 1px solid #fff;} .Banner002826 .slick-dots li.slick-active{background: #18913f;} .Banner002826 .slick-dots li.slick-active:before{transform: scale(0);-webkit-transform: scale(0);-ms-transform: scale(0);} .Banner002826 .slick-dots li button{display: none;} @media(max-width:640px){ .Banner002826 .slick-dots li{width: 10px; height: 10px;} .Banner002826 .slick-dots li:not(:last-child){margin-right: 4px;} } .iframe_message{ max-width: 800px; margin: auto} .iframe_message iframe{width: 100%; height:560px; border: none}