/* * @主色: #0063bb * @Author: ding * @Date: * @Last Modified by: jinbo * @Last Modified time: 2020-09-10 14:12:56 */ .icon{ -moz-transition: all ease-in-out 1s; -webkit-transition: all ease-in-out 1s; -o-transition: all ease-in-out 1s; -ms-transition: all ease-in-out 1s; transition: all ease-in-out 1s; } /*product*/ .sect_prod{background: url(?/Theme/Home/web/css/../img/pro-bg.png) center no-repeat;background-size: cover;} .pro-index{padding-bottom: 100px;padding-top: 100px;} .pro-t strong{display: block;padding-top: 20px;font-size: 30px;line-height: 64px;color: #333;position: relative;} .pro-t strong:before{content: "";display: block;position: absolute;width: 60px;height: 8px;left: 0;top: 0;background: #0063bb} .pro-t span{font-size: 18px;line-height: 24px;color: #999;text-transform: uppercase;} .pro-block{padding-top: 24px;position: relative;} .pro-block .swiper-wrapper{} .pro-block .swiper-wrapper .swiper-slide{width: 14.28%;} .pro-box{margin: 0 8%;position: relative;overflow: hidden;padding:25px 0;height: 100%} .swiper-slide.odd .pro-box{margin: 123px 8% 0;} .pro-box .zc_icon {width: 30%;position: absolute;z-index: 2;left: 50%;margin-left: -25px;top:0;height: 50px; } .pro-box .zc_icon img {width: 100%;} .pro-box .mask{box-sizing: border-box;padding: 30px 6% 6%;color: #fff;height: 300px;} .pro-box .mask a{border-bottom: transparent 2px solid;} .pro-box .mask a.b{font-size: 16px;line-height: 30px;color: #fff;display: block;min-height: 60px;border-bottom: 1px dashed #79befc;} .pro-box .mask span{display: block;font-size: 12px;line-height: 20px;text-transform: uppercase;position: relative;} /*.pro-box .mask span:after{content: "";display: block;position: absolute;width: 1px;height: 30px;left: 0;top: 200%;background: #fff;}*/ .pro-box .mask ul{display: block;margin-top: 12px;position: relative;/*-webkit-transform: translateX(-120%);-ms-transform: translateX(-120%);-o-transform: translateX(-120%);transform: translateX(-120%);*/overflow: hidden;} .pro-box .mask ul li a{font-size: 14px;line-height: 30px;color: #fff;} .pro-box .mask.color{background: #0164bb;} .pro-box:hover .icon{background-position: right;} .pro-box:hover .mask.color{background: rgba(0,99,187,.7);} .pro-box:hover .mask span:after{opacity: 0;} /*.pro-box:hover .mask ul{-webkit-transform: translateX(0);-ms-transform: translateX(0);-o-transform: translateX(0);transform: translateX(0);}*/ .pro-box a:hover{border-color: #fff;} /* about us*/ .sect_us{background: url(?/Theme/Home/web/css/../img/about-bg.jpg) center no-repeat;background-size: cover;} .about-t{position: relative;padding-bottom: 36px;z-index: 1;color: #fff;} .about-t strong{font-size: 30px;line-height: 36px;color: #fff;} .about-t:after{content: "about us";display: block;position: absolute;left: 0;top: 0;z-index: -1;font-size: 72px;line-height: 72px;color: #999;opacity: .12;text-transform: uppercase;font-weight: bold;} .about-block{padding-top: 2%;position: relative;} .about{background: #fff;padding: 0;color: #686868;overflow: hidden;} .about .mabout {padding:20px 25px 21px;overflow: hidden;} .about .mabout h2 {font-size: 18px;line-height: 40px;color: #333;} .about .mabout p {font-size: 14px;color: #686868;line-height: 25px;} .about .mabout a {display: inline-block;float: right;color: #cf0101;font-size: 14px;line-height: 25px;} .about-video{padding: 0;overflow: hidden;height: 100%;position: relative;} .about-video iframe {position: absolute;left: 0;right: 0;top:0;bottom: 0;} .about-tbs{text-align: center;padding-top: 2%;} .about-tbs .tbs{display: inline-block;width: 18.4%;margin-right: 2%;box-sizing: border-box;background: #fff;font-size: 0;} .about-tbs .tbs:last-child{margin-right: 0;} .about-tbs .tbs .tbs-box{display: block;padding: 4%;text-align: left;color: #fff;} .about-tbs .tbs .tbs-box.box1{background: #65a4f1} .about-tbs .tbs .tbs-box.box2{background: #0096bb} .about-tbs .tbs .tbs-box.box3{background: #00bba3} .about-tbs .tbs .tbs-box.box4{background: #9abb00} .about-tbs .tbs .tbs-box.box5{background: #bb9100} .about-tbs .tbs .tbs-box i{display: block;float: left;font-size: 40px;line-height: 66px;height: 66px;margin-right: 10px;} .about-tbs .tbs .tbs-box p{font-size: 18px;line-height: 36px;} .about-tbs .tbs .tbs-box span{font-size: 14px;line-height: 30px;text-transform: uppercase;display: block;height: 30px;overflow: hidden;} .about-tbs .tbs .tbs-box:hover{background: #fff} .about-tbs .tbs .tbs-box:hover i,.about-tbs .tbs .tbs-box:hover span, .about-tbs .tbs .tbs-box:hover p{color: #0063bb} /*advant*/ .sect_ad{} .advant-box{padding: 20px;text-align: center;} .advant-box i{display: inline-block;width: 84px;height: 84px;line-height: 84px;font-size: 48px;border-radius: 50%;margin-bottom: 24px;color: #0063bb;border:#0063bb 1px solid;} .advant-box p{padding-top: 20px;position: relative;font-size: 14px;line-height: 24px;} .advant-box p span{display: block;} .advant-box p:before{content: "";display: block;position: absolute;top: 0;left: 50%;width: 60px;height: 1px;background: #0063bb;margin-left: -30px;} /*hotsale*/ .hotsale-tabs{text-align: center;} .hotsale-tabs a{display: inline-block;font-size: 18px;line-height: 36px;border-bottom: #ccc 1px solid;position: relative;padding: 0 30px;} .hotsale-tabs a.active{border-color: #0063bb;color: #0063bb} .hotsale{padding-top: 30px;} .hotsale-box{display: block;border:#ccc 1px solid;padding: 10px;text-align: center;} .hotsale-box:hover{border-color: #0063bb} .hotsale-box p{font-size: 16px;line-height: 32px;} .hotsale-box span{display: inline-block;font-size: 12px;line-height: 24px;border-radius: 12px;padding: 0 20px;background: #0063bb;color: #fff;} /*鸭脖全站官网有限公司新闻*/ .sect_news {padding: 3rem 0;overflow: hidden;} .sect_news .xwbox {padding: 0;overflow: hidden;background:#f6f6f6;margin-bottom: 20px;} .sect_news .xwbox a{display: block;} .sect_news .xwbox .icon {padding: 0;overflow: hidden;} .sect_news .xwbox .icon img {height: 100%;width: 100%;object-fit: contain;} .sect_news .xwbox a .c{padding: 18px 12px;} .sect_news .xwbox a .c strong{display: block;font-size: 16px;line-height: 30px;color: #333;overflow: hidden; text-overflow:ellipsis; white-space: nowrap;} .sect_news .xwbox a .c span{font-size: 12px;line-height: 20px;color: #999} .sect_news .xwbox a .c p{font-size: 14px;line-height: 24px;height: 48px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;color: #333;} .sect_news .xwbox a:hover .c{background: #0164bb} .sect_news .xwbox a:hover .c p,.sect_news .xwbox a:hover .c span,.sect_news .xwbox a:hover .c strong{color: #fff;} .sect_news .xwbox a:hover .icon img {transform: scale(1.2);transition:all 0.5s;} /*新闻*/ .sect_new { background: #f6f6f6;} .news-box{padding: 15px 0;} .news-box a{display: block;} .news-box a big{font-size: 16px;line-height: 30px;color: #333;position: relative;} .news-box a big:after{content: "";display: block;position: absolute;left: 0;bottom: 0;width: 0;height: 1px;background: #0063bb;} .news-box a p{font-size: 14px;line-height: 24px;height: 48px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;color: #666;} .news-box a span{font-size: 14px;line-height: 18px;color: #666;} .news-box a:hover big{color: #0063bb;} .news-box a:hover big:after{width: 100%;} .news-more{text-align: center;} .news-more a{display: inline-block;font-size: 16px;line-height: 36px;border-radius: 18px;padding: 0 20px;background: #0063bb;color: #fff;} .news-more a:hover{background: #fff;color: #0063bb} @media screen and (max-width:1450px){ .pro-box .mask ul li a {font-size: 12px;} .about .mabout { padding: 5px 25px;} } @media screen and (max-width:1200px){ }