/** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-theme .owl-dots, .owl-theme .owl-nav { text-align: center; -webkit-tap-highlight-color: transparent } .owl-theme .owl-nav { margin-top: 10px } .owl-theme .owl-nav [class*=owl-] { color: #FFF; font-size: 14px; margin: 5px; padding: 4px 7px; background: #D6D6D6; display: inline-block; cursor: pointer; border-radius: 3px } .owl-theme .owl-nav [class*=owl-]:hover { background: #869791; color: #FFF; text-decoration: none } .owl-theme .owl-nav .disabled { opacity: .5; cursor: default } .owl-theme .owl-nav.disabled+.owl-dots { margin-top: 10px } .owl-theme .owl-dots .owl-dot { display: inline-block; zoom: 1 } .owl-theme .owl-dots .owl-dot span { width: 10px; height: 10px; margin: 5px 7px; background: #D6D6D6; display: block; -webkit-backface-visibility: visible; transition: opacity .2s ease; border-radius: 30px } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #869791 } #banner .item{display:inline-block; background-position:center; background-repeat:no-repeat; background-size:cover; } #banner .owl-nav{ margin:0px; } #banner .owl-nav button{position:absolute; top:50%; margin-top:-21px; width:42px; height:42px; outline:none; } #banner .owl-nav button.owl-prev{ left:30px; background:url(left.png) no-repeat center;} #banner .owl-nav button.owl-next{ right:30px; background:url(right.png) no-repeat center;} #banner .item{width: 100vw; font-size:0px;} #banner .item a{position:relative; z-index:1;display:block; width:100%; height:100%; text-align:center;overflow:hidden;} #banner .item a img.banner1{width:100%; height:auto;} #banner .item a img.banner2{ width:100%; height:auto;} @media(min-width:992px) { #banner .item a img.banner1{ display:block;} #banner .item a img.banner2{ display:none;} } @media(max-width:992px) { #banner .item{ height:auto;} #banner .item a img.banner1{ display:none;} #banner .item a img.banner2{ display:block;} #banner .owl-nav button.owl-prev{ left:5px; background:url(left.png) no-repeat center;} #banner .owl-nav button.owl-next{ right:5px; background:url(right.png) no-repeat center;} } .index-p-title {padding: 60px 15px 20px;} /*首页产品标题*/ #index-product{ padding:15px 0px; } #index-product .item{ /* inline-block去除懒加载导致的初始高度错误 */ text-align:center; } #index-product .item .index-p-i{ display:block; width:100%; overflow:hidden;} #index-product .item .index-p-i img{ display:block; transform:scale(1); transition:all .3s; } #index-product .item:hover .index-p-i img{ transform:scale(1.15);} #index-product .item .index-p-name{ display:inline-block; width:100%; padding:20px 0px; font-size:16px; line-height:1em; color:#333; text-align:center; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden; transition:all .3s; } #index-product .item:hover .index-p-name{ color:#018f45;} #index-product .owl-nav button{position:absolute; top:35%; width:42px; height:42px; outline:none; margin:0px;opacity:0;transition:all .3s; } #index-product .owl-nav button.owl-prev{ left:0px; background:url(left.png) no-repeat center,rgba(0,0,0,0.2); } #index-product .owl-nav button.owl-next{ right:0px; background:url(right.png) no-repeat center,rgba(0,0,0,0.2);} #index-product:hover .owl-nav button{opacity:1;transition:all .4s; } #index-product:hover .owl-nav button.owl-prev{transform:translate(-50%,0%);} #index-product:hover .owl-nav button.owl-next{transform:translate(50%,0%);} #index-product .owl-nav button.owl-prev:hover{background:url(left.png) no-repeat center,rgba(0,0,0,0.6); } #index-product .owl-nav button.owl-next:hover{background:url(right.png) no-repeat center,rgba(0,0,0,0.6);} a.index-p-more{ position:relative;display:inline-block; padding:0px 25px; font-size:14px; line-height:32px; color:#999; border:1px solid #ccc; border-radius:20px; margin-bottom:60px; overflow:hidden;transition:all .3s;} a.index-p-more:after{ content:""; position: absolute; z-index:-1;top: 50%;left: 50%;width: 0%;height: 0%;background-color:#018f45;transition:all .3s;} a.index-p-more:hover{color:#fff; border:1px solid #018f45; } a.index-p-more:hover:after{ content:""; position: absolute; z-index:-1;top: 0px;left: 0%; width: 100%; height:100%} #index-news{ margin-bottom:30px;} #index-news .item{ font-size:0px; margin:15px 0px; border-radius:0px 0px 4px 4px; box-shadow:0px 0px 0px rgba(0,0,0,0);transition:all .4s;} #index-news .item .index-news-i{ position:relative; display:block; overflow:hidden;} #index-news .item .index-news-i>img{ transform:scale(1.2);transition:all .4s; } #index-news .item:hover .index-news-i>img{ transform:scale(1);} #index-news .item .index-n-title{ display:inline-block; width:100%; padding:15px 0px 5px; font-size:16px; line-height:36px;color:#333;white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden;} #index-news .item:hover .index-n-title{ color:#018f45;} #index-news .item span{ font-size:13px; color:#999;} #index-news .item p{ margin:10px 0px; font-size:14px; color:#333; line-height:24px; height:72px; display: block; display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;} #index-news .item .news-more{ font-size:15px; color:#018f45;} #index-news .owl-dots .owl-dot{ outline:none;} #index-news .owl-dots .owl-dot span{ color:#ccc;transition:all .3s;} #index-news .owl-dots .owl-dot.active span, #index-news .owl-dots .owl-dot:hover span{ width:20px; background:#018f45;} .about-fztitle{ text-align:center;} .about li .about-fztitle h3:after{ content:""; position: absolute; z-index:1;bottom: 0px; left: 50%; margin-left:-15px; width: 30px;height: 1px;background-color:#333;transition:all .3s;} #about-fz{ float:left; position:relative; z-index:2;} #about-fz:after{ content:""; position: absolute; z-index:-1;top: 60px;left: 0%;width: 100%;height:1px;background-color:#f2f2f2;} #about-fz a{ display:inline-block; font-size:20px; line-height:56px; color:#333; border-bottom:3px solid #018f45; margin-bottom:20px;} #about-fz a b{ font-size:26px; line-height:56px; vertical-align:middle;} #about-fz .owl-nav button{position:absolute; top:10px; width:42px; height:42px;outline:none; margin:0px; background:none;transition:all .3s; } #about-fz .owl-nav button i{ font-size:30px; line-height:42px; color:#333;transition:all .3s; } #about-fz .owl-nav button:hover i{color:#018f45; } #about-fz .owl-nav button.owl-prev{ left:0px; } #about-fz .owl-nav button.owl-next{ right:0px;} #about-fz .owl-nav button:hover{opacity:1;transition:all .4s; } #about-fz .owl-nav button.owl-prev:hover{transform:translate(-50%,0%);} #about-fz .owl-nav button.owl-next:hover{transform:translate(50%,0%);} @media(max-width:768px) { #about-fz .owl-nav button{position:absolute; top:80px; } #about-fz .owl-nav button.owl-prev{ left:10px; } #about-fz .owl-nav button.owl-next{ right:10px;} #about-fz .owl-nav button.owl-prev:hover{transform:translate(0%,0%);} #about-fz .owl-nav button.owl-next:hover{transform:translate(0%,0%);} } #product-img .item{display:inline-block; background-position:center; background-repeat:no-repeat; background-size:cover; } #product-img .owl-nav{ margin:0px; } #product-img .owl-nav button{position:absolute; top:50%; margin-top:-21px; width:42px; height:42px; outline:none; background:none;} #product-img .owl-nav button i{ font-size:30px; line-height:42px; color:#333;transition:all .3s; } #product-img .owl-nav button:hover i{color:#018f45; } #product-img .owl-nav button.owl-prev{ left:30px;} #product-img .owl-nav button.owl-next{ right:30px;} @media(max-width:992px) { #banner .owl-nav button.owl-prev{ left:5px;} #banner .owl-nav button.owl-next{ right:5px; } } #ability-jc .item .enlarge-img{ overflow:hidden;} #ability-jc .item .enlarge-img img{transform:scale(1);transition:all .3s; } #ability-jc .item:hover .enlarge-img img{transform:scale(1.15);} #ability-jc .item span{ font-size:14px; color:#333;} #ability-jc .item:hover span{ color:#018f45;} #ability-jc .owl-nav button{position:absolute; top:30%; width:42px; height:42px;outline:none; margin:0px; background:rgba(0,0,0,0.4);transition:all .3s; } #ability-jc .owl-nav button:hover{ background:rgba(31,121,211,0.8); } #ability-jc .owl-nav button i{ font-size:30px; line-height:42px; color:#fff;transition:all .3s; } #ability-jc .owl-nav button.owl-prev{ left:-25px; } #ability-jc .owl-nav button.owl-next{ right:-25px;} #ability-jc .owl-nav button:hover{opacity:1;transition:all .4s; } #ability-jc .owl-nav button.owl-prev:hover{transform:translate(-20%,0%);} #ability-jc .owl-nav button.owl-next:hover{transform:translate(20%,0%);} @media(max-width:768px) { #ability-jc .owl-nav button{position:absolute; } #ability-jc .owl-nav button.owl-prev{ left:10px; } #ability-jc .owl-nav button.owl-next{ right:10px;} #ability-jc .owl-nav button.owl-prev:hover{transform:translate(0%,0%);} #ability-jc .owl-nav button.owl-next:hover{transform:translate(0%,0%);} } #logo { margin-bottom: 50px; } #logo .owl-stage{display: flex;} #logo .item{display: flex;align-items: center; height:100%; justify-content: center; border: 1px dotted #e0e0e0; }