/*公共标题*/ .gg_title h3 { text-align: center; font-size: 30px; line-height: 45px; color: #6d6d6d; font-weight: 400; margin: 0px; } .gg_title a:hover h3{ color: #df002c; } .gg_note { margin: 15px auto 20px auto; font-size: 16px; color: #666; text-align: center; font-weight: bold; } .gg_line { width: 250px; height: 3px; margin: 0 auto; position: relative; background-color: #e6e6e6; display: none; } .gg_line::before { content: ""; position: absolute; width: 100%; height: 5px; bottom: 0; left: 0; background-color: #d8251e; visibility: hidden; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); transition-duration: 0.5s; transition-timing-function: ease-in-out; transition-delay: 0s; } .gg_line span { width: 50px; height: 5px; background-color: #d8251e; display: block; vertical-align: middle; top: -2px; left: 50%; margin-left: -25px; position: absolute; } @media screen and (max-width: 769px) { .gg_title h3 { text-align: center; font-size: 24px; line-height: 30px; } .gg_note { margin: 15px auto; padding: 0px 20px; font-size: 14px; } } @media screen and (max-width: 769px) { .gg_note { margin: 10px auto; } } /*轮播*/ .swiper { width: 100%; max-width: 1920px; overflow: hidden; margin: 0 auto; /* height: 840; */ background: #fff; position: relative; } .swiper .swiper-container { width: 100%; max-width: 1920px; margin: 0 auto; height: 840px; } .swiper .swiper-slide { width: 100%; position: relative; overflow: hidden; text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; opacity: 1; -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; } .swiper .swiper-slide a img { width: 100%; object-fit: cover; height: 100%; } .swiper .swiper-pagination-bullet { width: 20px; height: 20px; text-align: center; opacity: 1; background: rgba(0, 0, 0, 0.4); margin: 0 8px !important; } .swiper .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1; background:#d8251e !important; } .swiper-container-horizontal>.swiper-pagination-bullets{ bottom: 30px; } /* .swiper .swiper-container:hover .swiper-button-next, .swiper .swiper-container:hover .swiper-button-prev { display: block; } */ .swiper .swiper-button-next, .swiper .swiper-button-prev { margin-top: -50px; z-index: 10; padding: 10px 5px; opacity: 0; width: 50px; height: 50px; border-radius: 100%; background-color: rgba(0, 0, 0, 0.4); transition: all 0.4s; } .swiper-button-next:after,.swiper-button-prev:after{ font-size: 24px; color: #fff !important; } .swiper a { width: 100%; height: 100%; display: inline-block; } .swiper a img { width: 100%; } .swiper:hover .swiper-button-next, .swiper:hover .swiper-button-prev { opacity: 1; } @media screen and (max-width: 769px) { .swiper .swiper-container:hover .swiper-button-next, .swiper .swiper-container:hover .swiper-button-prev { display: none !important; } .benners.swiper { height: 280px; } .benners .swiper-container { height: 280px !important; } .swiper .swiper-slide a img { position: initial; width: 100%; height: 280px; object-fit: cover; margin-left: 0%; } } @media screen and (max-width: 580px) { .benners.swiper { height: 240px; } .benners .swiper-container { height: 240px !important; } .swiper .swiper-slide a img{ height: 240px; } .swiper-container-horizontal>.swiper-pagination-bullets { bottom: 10px; } .swiper .swiper-pagination-bullet { width: 10px; height: 10px; } } /*idx_pro start*/ .idx_pro { background-color: none; padding: 60px 0 0 0; } .idx_pro .idx_pro_con { width: 100%; margin: 0 auto; text-align: center; } .idx_pro .idx_pro_title h3 { text-align: center; font-size: 30px; color: #6d6d6d; margin: 0; /*font-weight: bold;*/ } .idx_pro .idx_pro_more { margin: 20px auto; font-size: 16px; color: #666; } .idx_pro .draw_line { width: 250px; height: 3px; margin: 0 auto; position: relative; background-color: #e6e6e6; } .idx_pro .draw_line span { width: 50px; height: 5px; background-color: #d8251e; display: block; vertical-align: middle; top: -2px; left: 50%; margin-left: -25px; position: absolute; } .idx_pro_list { width: 100%; max-width: 1600px; margin: 40px auto 20px auto; overflow: hidden; display: flex; justify-content: space-between; } @media screen and (max-width: 1600px) { .idx_pro_list { width: 98%; padding: 0 1%; } } @media screen and (min-width: 1601px) { .idx_pro_list { width: 100%; } } .idx_pro_left { position: relative; display: inline-block; width: 48%; overflow: hidden; } .idx_pro_left_img { position: relative; padding-bottom: 88%; } .idx_pro_left img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; margin: 0 auto; } .idx_pro_left_title { display: block; position: absolute; bottom: 0; height: 50px; width: 100%; z-index: 250; background-color: rgba(0, 0, 0, 0.2); transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s; cursor: pointer; } .idx_pro_left .idx_pro_left_title a { display: block; font-size: 22px; width: 100%; line-height: 50px; color: #fff; } .idx_pro_left:hover .idx_pro_left_title a { font-size: 26px; } .idx_pro_left:hover .idx_pro_left_title a.more { width: 80px; height: 30px; line-height: 30px; font-size: 16px; border: 1px solid #d8251e; background-color: #d8251e; color: #fff; margin: 0 auto; } .idx_pro_left:hover .idx_pro_left_title { top: auto; bottom: 0; height: 100%; padding: 30% 0; } .idx_pro_right { display: inline-block; width: 48%; } .idx_pro_right_top_flex { display: flex; } .idx_pro_right_top { position: relative; overflow: hidden; margin-bottom: 4%; width: 50%; } .idx_pro_right_top_img { position: relative; padding-bottom: 84%; } .idx_pro_right_top img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; margin: 0 auto; } .idx_pro_right_top_title { display: block; position: absolute; bottom: 0; height: 50px; width: 100%; z-index: 250; background-color: rgba(0, 0, 0, 0.2); transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s; cursor: pointer; } .idx_pro_right_top .idx_pro_right_top_title a { display: block; font-size: 22px; width: 100%; line-height: 50px; color: #fff; } .idx_pro_right_top:hover .idx_pro_right_top_title a { font-size: 26px; } .idx_pro_right_top:hover .idx_pro_right_top_title a.more { width: 80px; height: 30px; line-height: 30px; font-size: 16px; border: 1px solid #d8251e; background-color: #d8251e; color: #fff; margin: 0 auto; } .idx_pro_right_top:hover .idx_pro_right_top_title { top: auto; bottom: 0; height: 100%; padding: 30% 0; } .idx_pro_right_bottom { position: relative; overflow: hidden; } .idx_pro_right_bottom_img { position: relative; padding-bottom: 42%; } .idx_pro_right_bottom img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; margin: 0 auto; object-fit: cover; } .idx_pro_right_bottom_title { display: block; position: absolute; bottom: 0; height: 50px; width: 100%; z-index: 250; background-color: rgba(0, 0, 0, 0.2); transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s; cursor: pointer; } .idx_pro_right_bottom .idx_pro_right_bottom_title a { display: block; font-size: 22px; width: 100%; line-height: 50px; color: #fff; } .idx_pro_right_bottom:hover .idx_pro_right_bottom_title a { font-size: 26px; } .idx_pro_right_bottom:hover .idx_pro_right_bottom_title a.more { width: 80px; height: 30px; line-height: 30px; font-size: 16px; border: 1px solid #d8251e; background-color: #d8251e; color: #fff; margin: 0 auto; } .idx_pro_right_bottom:hover .idx_pro_right_bottom_title { top: auto; bottom: 0; height: 100%; padding: 15% 0; } @media screen and (max-width: 769px) { .idx_pro_list { flex-direction: column; } .idx_pro_left, .idx_pro_right { width: 100%; } .idx_pro_right { margin-top: 20px; } .idx_pro_right_bottom_img { padding-bottom: 84%; } } @media screen and (max-width: 580px) { .idx_pro { padding-top: 40px; } .idx_pro_list { margin: 15px auto 10px auto; } .idx_pro_right_top_flex { flex-direction: column; } .idx_pro_right_top { width: 100%; } .idx_pro_right_bottom img{ object-fit: contain; width: auto !important; } } /*制定方案*/ .case_box { padding-top: 60px; } .casecont { margin-top: 40px; position: relative; } .casecont .slidelb { position: relative; } .slidelb .box { position: absolute; top: calc(50% - 140px); left: 10%; padding: 60px 70px 50px 70px; display: block; width: 675px; background-color: rgba(0, 0, 0, 0.25); border-radius: 12px; transform: translateY(-50%); z-index: 2; } .box h3 { font-size: 30px; font-weight: 700; color: #eee; line-height: 1.8; } .box p { font-size: 18px; line-height: 1.8; font-weight: 400; color: #f5f5f5; } .box a { display: inline-block; vertical-align: top; margin-top: 35px; padding: 0 20px; line-height: 40px; font-size: 18px; color: #fff; border: 1px solid #fff; /* border-radius: 40px; */ -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; } .box a:hover { background-color: #d8251e; border-color: #d8251e; } .case_lb img { width: 100%; object-fit: cover; min-height: 400px; } .case_thumbs { position: absolute; left: 0; bottom: 25px; width: 100%; padding: 0 100px; z-index: 9; } .case_thumbs .swiper-slide { display: flex; padding: 16px; cursor: pointer; transition: all .3s; background-color: rgba(0, 0, 0, 0.6); align-items: center; } .case_thumbs .swiper-slide .img { margin-right: 16px; position: relative; overflow: hidden; } .case_thumbs .swiper-slide .img img { width: 110px; height: 110px; display: block; } .case_thumbs .swiper-slide .info { flex: 1; } .info .info-title { font-size: 18px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .info span { margin-top: 20px; display: inline-block; font-size: 24px; color: #888; line-height: 1; } .case_thumbs .swiper-slide:after { content: ''; position: absolute; bottom: -10px; left: 10px; right: 10px; height: 0; background: rgba(249, 135, 94, 0.8); -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } .case_thumbs .swiper-container { padding-top: 10px; } .case_thumbs .swiper-slide-thumb-active { transform: translateY(-10px); } .case_thumbs .swiper-slide-thumb-active:after { height: 10px; } @media screen and (max-width: 1600px) { .slidelb .box { top: calc(50% - 70px); padding: 40px 60px 40px 60px; } .box h3 { font-size: 24px; } .box p { font-size: 16px; margin: 10px 0px; } .case_thumbs .swiper-slide .img { width: 90px; height: 90px; } } @media screen and (max-width: 1200px) { .dzmbxq { display: none !important; } .box a { margin-top: 15px; padding: 0 15px; line-height: 36px; font-size: 16px; } .slidelb .box { width: 50% !important; } .info .info-title { font-size: 16px; } } @media screen and (max-width: 769px) { .slidelb .box { padding: 30px 40px 30px 40px; } .box a { margin-top: 8px; padding: 0 10px; line-height: 24px; font-size: 13px; } .box h3 { font-size: 18px; margin-top: 0px; } .case_thumbs { padding: 0 30px; } .info .info-title { font-size: 14px; margin: 0px; } .case_thumbs .swiper-slide .img { width: 55px; height: 55px; } .info span { margin-top: 0px; display: inline-block; font-size: 20px; line-height: 1; } } @media screen and (max-width: 580px) { .case_box { padding-top: 40px; } .casecont { margin-top: 25px; } } /*领域*/ .aboutus { width: 100%; padding: 60px 0; background: #fefcfc; } .aboutus .aboutus_more { background-color: transparent; height: 20px; color: #666; } .aboutus .aboutus_con { width: 100%; margin: 0 auto; padding: 0; text-align: center; } .aboutus .aboutus_title h3 { text-align: center; font-size: 30px; color: #6d6d6d; /*font-weight: bold;*/ } .aboutus .aboutus_stitle { text-align: center; color: #666; } .aboutus .aboutus_stitle h4 { font-size: 23px; line-height: 1; color: #666; } .aboutus .aboutus_stitle h5 { font-size: 17px; line-height: 1; color: #666; } .aboutus .aboutus_list { width: 100%; max-width: 1600px; padding:0px 0; margin: 0 auto; } @media screen and (max-width: 1600px) { .aboutus .aboutus_list { width: 98%; padding: 0 1%; } } @media screen and (min-width: 1601px) { .aboutus .aboutus_list { width: 100%; } } .aboutus .aboutus_list ul { font-size: 0; } .aboutus .aboutus_list ul li { display: inline-block; width: 18%; margin: 1%; height: auto; min-height: 230px; background: #f8f8f8; text-align: center; vertical-align: bottom; position: relative; border: 0 !important; } .aboutus .aboutus_list ul li div#three1, .aboutus .aboutus_list ul li div#three2, .aboutus .aboutus_list ul li div#three3, .aboutus .aboutus_list ul li div#three4, .aboutus .aboutus_list ul li div#three5, .aboutus .aboutus_list ul li div#three6, .aboutus .aboutus_list ul li div#three7, .aboutus .aboutus_list ul li div#three8 { width: 100%; height: 100%; position: absolute; vertical-align: middle; } .aboutus .aboutus_list ul li div#con_three_1, .aboutus .aboutus_list ul li div#con_three_2, .aboutus .aboutus_list ul li div#con_three_3, .aboutus .aboutus_list ul li div#con_three_4, .aboutus .aboutus_list ul li div#con_three_5, .aboutus .aboutus_list ul li div#con_three_6, .aboutus .aboutus_list ul li div#con_three_7, .aboutus .aboutus_list ul li div#con_three_8 { display: none; width: 100%; height: 100%; vertical-align: middle; position: absolute; background-color: #d8251e; opacity: 1; color: #fff; filter: opacity(1); font-size: 16px; padding: 120px 6px 0 6px; line-height: 1.5; } .aboutus .aboutus_list ul li div.hover { display: block; } .aboutus .aboutus_list ul li img { width: 80px; margin-top: 20px; transition: all 0.4s; } .aboutus .aboutus_list ul li h3 { font-size: 16px; color: #656565; font-weight: bold; line-height: 35px; } .aboutus .aboutus_list ul li h4 { font-size: 13px; line-height: 20px; color: #656565; } .aboutus .aboutus_list ul li:hover img{ transform:scale(1.1); } .aboutus .aboutus_list ul li:hover{ box-shadow: 0 0 14px rgba(0, 0, 0, 0.2); } @media screen and (max-width: 580px) { .aboutus { padding: 40px 0; } .aboutus .aboutus_title h3 { font-size: 24px; margin: 0px; } .aboutus .aboutus_list ul li { width: 48%; min-height: 210px; } .aboutus .aboutus_list ul li h3 { font-size: 16px; } .aboutus .aboutus_list ul li h4 { font-size: 12px; } .idx_pro_left_img .idx_pro_left_title, .idx_pro_right_top .idx_pro_right_top_title { height: 100%; padding: 30% 0; } .idx_pro_right_top .idx_pro_right_top_title a.more ,.idx_pro_left .idx_pro_left_title a.more{ width: 80px; height: 30px; line-height: 30px; font-size: 16px; border: 1px solid #d8251e; background-color: #d8251e; color: #fff; margin: auto; } .idx_pro_right_bottom .idx_pro_right_bottom_title ,.idx_pro_right_bottom:hover .idx_pro_right_bottom_title{ height: 100%; padding: 30% 0; } .idx_pro_right_bottom .idx_pro_right_bottom_title a.more { width: 80px; height: 30px; line-height: 30px; font-size: 16px; border: 1px solid #d8251e; background-color: #d8251e; color: #fff; margin: 0 auto; } } /*新闻*/ .news { width: 100%; margin: 0px auto; padding: 60px 0 40px 0; background-color: #f2f6f7; } .news .news_list { width: 100%; max-width: 1600px; margin: 40px auto; overflow: hidden; } @media screen and (max-width: 1600px) { .news .news_list { width: 98%; padding: 0 1%; } } @media screen and (min-width: 1601px) { .news .news_list { width: 100%; } } .news .news_list { display: flex; flex-wrap: wrap; } .news .news_list .news_top_li { position: relative; width: 38%; margin-right: 2%; overflow: hidden; } .news .news_list .news_top_li .news_top_li_img { padding-bottom: 65%; position: relative; display: block; } .news .news_list .news_top_li .news_top_li_img img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; margin: 0 auto; } .news .news_list .news_top_li .news_top_stitle { width: 100%; height: 55px; line-height: 55px; margin: 0 auto; font-weight: 100; font-size: 17px; text-align: center; display: block; overflow: hidden; text-overflow: ellipsis; background: #d8251e; } .news .news_list .news_top_li .news_top_stitle a { position: relative; display: block; color: #fff; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .news .news_list .news_list_li { width: 19%; height: 100%; padding-bottom: 55px; margin-left: 1%; background-color: #fff; overflow: hidden; transition: all 0.3s; } .news .news_list_con { padding-bottom: 130%; position: relative; display: block; } .news .news_list_info { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; margin: 0 auto; text-align: left; } .news .news_list_li:hover, .news .news_list_li:hover .news_list_info, .news .news_list_li:hover .news_list_stitle a, .news .news_list_li:hover .news_list_desc, .news .news_list_li:hover .news_list_more a { background-color: #d8251e; color: #fff; } .news .news_list_li:hover .news_list_time span.date { color: #fff; border-bottom: 2px solid #fff; } .news .news_list_li:hover .news_list_time span.year { color: #fff; } .news .news_list_info .news_list_stitle { font-size: 16px; padding: 20px; color: #333; display: block; } .news_list_stitle a { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .news .news_list_info .news_list_desc { margin: 0px 0; padding: 0 20px; color: #767676; font-size: 14px; } .news .news_list_info .news_list_time { display: inline-block; height: 90px; margin: 0; padding: 20px 20px 0 20px; text-align: center; color: #000; vertical-align: middle; } .news .news_list_info .news_list_time span.date { width: 50px; display: block; font-size: 34px; height: 45px; line-height: 45px; border-bottom: 2px solid #999; text-align: left; color: #d8251e; } .news .news_list_info .news_list_time span.year { width: 100px; font-size: 16px; display: block; height: 45px; line-height: 45px; color: #999; text-align: left; } .news .news_list_info .news_list_more { padding: 20px; height: 20px; } .news .news_list_info .news_list_more a { color: #d8251e; } @media screen and (max-width: 1200px) { .news .news_list { justify-content: space-between; } .news .news_list .news_top_li { width: 100%; margin-right: 0px; } .news .news_list .news_list_li { width: 32%; margin-top: 2%; margin-left: 0px; } .news .news_list_con { padding-bottom: 100%; } } @media screen and (max-width: 769px) { .news .news_list .news_list_li { width: 100%; } .news .news_list .news_list_li { padding-bottom: 0px; } .news .news_list_con { padding-bottom: 80%; } .news .news_list { margin-bottom: 0px; } .news { padding: 40px 0; } .news .news_list .news_top_li .news_top_stitle { height: 40px; line-height: 40px; font-size: 13px; } .news .news_list { margin: 25px auto; } .news .news_list_info .news_list_time span.date { width: 30px; display: block; font-size: 24px; height: 45px; line-height: 45px; } .news_list_stitle a { font-size: 14px; } .news .news_list_info .news_list_desc { font-size: 13px; } } @media screen and (max-width:580px) { .news .news_list_con { padding-bottom: 70%; } } /*合作客户*/ .hzbj{background-repeat: no-repeat;background-size: cover; padding: 100px 0px 110px 0px;} .hz_box{display:flex;align-items: center; max-width: 660px;margin: auto;justify-content: space-between;} .hz_box p{width: 88px;height: 2px;background-color:rgba(224, 224, 224, 1);} .hz_box h2{font-size:28px;color: #fff;line-height: 36px;} .hztitle{text-align: center;margin-top: 30px;} .hztitle span{font-size: 16px;line-height: 30px; color: #fff;display: inline-block;} .hztitle p{font-size: 16px;line-height: 30px; color: #fff;} .helogo{display: flex;justify-content: space-between;flex-flow: wrap;margin: 75px 0px 15px 0px;} .helogo .logoitem{width: 15%;overflow: hidden;margin-top: 15px;margin-bottom: 15px;} .logoitem img{border-radius: 20px 0px;transition: 1s;width: 100%;background-color: #fff;} .logoitem img:hover {transform: scale(1.1);} @media screen and (max-width:769px){ .helogo .logoitem{ width: 48%; margin-left: 0% !important; margin: 8px 0px; } .hz_box h2{ font-size: 24px; } .hztitle span{ font-size: 13px; line-height: 24px; } .hztitle p{ font-size: 13px; line-height: 24px; } .helogo{margin: 0px 0px 15px 0px;} .hzbj{padding: 40px 0px;} .hztitle { text-align: center; margin-top: 10px; } } /* 生产基地 */ .scjd_box{margin-top: 60px;} .factory_box{display: flex;margin-top: 40px;} .factory_box .disimg{flex: 1;position: relative;} .disimg>img{width: 100%;} .disimg .mask { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #d8251e; opacity: 0; transition: all .2s; } .disimg:hover .mask { opacity: .7; } .jdtext_box{ position: absolute; left: 0; bottom: 20%; width: 100%; box-sizing: border-box; padding: 0 45px; text-align: center; } .jdtext_box .icon { width: 60px; margin: 0 auto; } .jdtext_box .tit{ font-size: 26px; line-height: 30px; margin: 20px 0px; color: #fff; } .jdtext_box .about-con { color: #fff; text-align: left; display: none; line-height: 36px; font-size: 14px; } @media screen and (max-width: 1200px) { .jdtext_box .tit { font-size: 24px; line-height: 30px; margin: 10px 0px; } .jdtext_box .about-con{ line-height: 24px; font-size: 13px; } .jdtext_box .icon { width: 50px; } .jdtext_box .icon img{ width: 50px; } } @media screen and (max-width: 992px) { .factory_box{ flex-flow: wrap; } .factory_box .disimg{ flex: none !important; width: 100%; } } @media screen and (max-width: 580px){ .aboutct p{ line-height: 24px; font-size: 12px; color: #999; } .sub-tit .en{ font-size: 60px; line-height: 60px; } .sub-tit .cn{ font-size: 20px; line-height: 20px; color: #333; margin-top: -20px; } .sub-tit .line{ width: 40px; height: 4px; background-color: rgba(0,0,0,.1); margin: 20px auto 0; } .aboutct{ margin-top: 15px; } .factory_box{ margin-top: 10px; } .jdtext_box .about-con{ display: block !important; } .jdtext_box .tit{ font-size: 20px; line-height: 24px; } /* .disimg .mask{ opacity: .7; } */ .jdtext_box{ bottom: 30%; } .scjd_box{margin-top: 50px;} }