/* Theme Name: jiuhong Version: 1.0 Description: 安徽领聚数字作为Google中国区核心合作伙伴,拥有安徽省唯一的一家Google出海体验中心,为安徽本土化外贸企业出海提供一站式服务——网站搭建,谷歌SEO优化,谷歌竞价,谷歌SNS社媒营销等。 Author: 版权所有：安徽领聚 */ *{ padding: 0; margin: 0; } :root { --i_color:#FADB14; --top1_height:36px; --top2_height:100px; } .wrap { width: 92vw; max-width: 1500px; margin-left: auto; margin-right: auto; } /* header */ header {height: 136px;} @media screen and (max-width:1042px) { header{height: 60px;} } .i_header{position: fixed;top: 0;left: 0;width: 100%;z-index: 2014;} .top_header{ background: #333333; height: var(--top1_height); display: flex; flex-wrap: nowrap; } .top_line_left{ display: flex; align-items: center; width: 78%; height: 100%; } .query{ width: 2%; background-color: #FADB14; height: 100%; border-radius: 75% 0 0 0; } .top_line_right{ padding-left: 12%; width: 21%; height: 100%; background-color: var(--i_color); } .top_iphone_list{ padding-left: 16.2%; display: flex; gap: 0 170px; height: 100%; display: flex; align-items: center; } .top_iphone_list iconify-icon{ color: #fff; font-size: 19px; } .top_iphone_list a{ color: #fff; font-size: 14px; } .top_iphone_list li{gap: 0 5px; display: flex; align-items: center;} .top_line_right{ display: flex; align-items: center; } .top_area_al{ display: flex; color: #fff; align-items: center; gap: 0 20px; } .top_area_al iconify-icon{ font-size: 20px; color: #333333; } @media screen and (max-width:1400px) { } @media screen and (max-width:1366px) { .top_iphone_list {padding-left: 5%;} } @media screen and (max-width:1200px) { .top_iphone_list{gap: 0 130px;} } @media screen and (max-width:1042px) { .top_header{display: none;} .header{height: 60px;} } @media screen and (max-width:959px) { } @media screen and (max-width:767px) { } @media screen and (max-width:560px) {} .logo{height:100%; display:flex; align-items:center} .logo img{height:75%} .top_cont{height: var(--top2_height); background-color: #fff;} .top{ height: 100%; display: flex; align-items: center;} .i_nav {margin-left: 13%;display: -webkit-flex;display: flex;flex-wrap: nowrap;} .i_nav>li {position: relative;margin: 0 15px;} .i_nav>li>a {display: block;font-size: 16px;color: #333;line-height: var(--top2_height);white-space: nowrap;-webkit-border-radius: 8px;border-radius: 8px;} .i_nav li:hover .sub-menu{display: block;} .i_nav>.current-menu-item>a,.i_nav>.current-category-ancestor>a,.i_nav>.current-post-ancestor>a,.i_nav>.current-menu-ancestor>a,.i_nav>.current-menu-parent>a,.i_nav>li:hover>a,.i_nav .curr>a {transition: all 0.3s ease;position: relative;color: var(--i_color);} .i_nav .sub-menu {display: none;position: absolute;border-top: 0 solid var(--i_color);background: #fff;min-width: 160px;overflow: hidden;} .i_nav .sub-menu li {position: relative;} .i_nav .sub-menu li::before,.i_nav .sub-menu li::after {content: '';position: absolute;bottom: 0;height: 1px;} .i_nav .sub-menu li::before {left: 0;width: 100%;background: rgb(0 0 0 / 8%);} .i_nav .sub-menu li::after {right: 0;width: 0;background: var(--i_color);} .i_nav .sub-menu a {display: block;padding: 0 80px 0 20px;font-size: 15px;color: #333;line-height: 40px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;position: relative;left: 0;} .i_nav .sub-menu li:hover::after {right: initial;left: 0;width: 100%;} .i_nav .sub-menu li:hover a {left: 16px;} .i_nav .sub-menu li:hover a {color: var(--i_color);} .i_nav .sub-menu li:hover a::before {left: 0;} .i_nav .sub-menu li,.i_nav .sub-menu li::after,.i_nav .sub-menu a,.i_nav .sub-menu a::before {-webkit-transition: all .5s ease;transition: all .5s ease} @media screen and (max-width:1440px) { .top_iphone_list{padding-left: 6.5%;} .top_line_left{width: 105%;} .i_nav>li>a{font-size: 14PX;} .i_nav{margin-left: 8%;} .top_r {margin-right: -35px;} } @media screen and (max-width:1366px) { .i_nav>li{margin: 0 9px;} } @media screen and (max-width:1200px) { .i_nav>li>a{font-size: 12px;} } @media screen and (max-width:1042px) { .top_cont{height: 60px;} } @media screen and (max-width:959px) { } @media screen and (max-width:767px) { } @media screen and (max-width:560px) {} /* top seacher */ .top_search_ico{cursor: pointer;} .top_search_ico iconify-icon{ font-size: 23px; } .top_r{ margin-right: -40px; margin-left: auto; display: flex; gap: 0 20px; } span iconify-icon{ font-size: 20px; white-space: nowrap; } .top_search { --search_height: 38px; } .top_search { display: none; opacity: 0; position: fixed; top: 158px; left: 0; width: 100%; padding: 16px 0; background: #FFF; -webkit-transition: all .3s ease; transition: all .3s ease; z-index: 1; } .top_search.on { z-index: 2023; border-top: 1px solid #666; display: block; opacity: 1; top: 136px; box-shadow: 0 6px 6px rgb(0 0 0 / 8%); } .top_search form { width: 80%; margin: 0 auto; max-width: 500px; display: -webkit-flex; display: flex; flex-wrap: wrap; box-sizing: border-box; border: 1px solid #0C3F9B; overflow: hidden; } .top_search_ipt { width: calc(100% - var(--search_height) * 2); height: var(--search_height); box-sizing: border-box; padding: 0 0 0 12px; } .top_search_btn { font-size: 0; color: #FFF; width: calc(var(--search_height) * 2); height: var(--search_height); background: #0C3F9B url(static/images/public/search_w1.svg) no-repeat center; background-size: 24px; cursor: pointer; } /* language */ .top_languages iconify-icon{ color: #777; font-size: 24px; } .top_languages { margin-right: 20px; padding-right: 20px; display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; height: var(--header_height); position: relative; } .top_languages iconify-icon { font-size: 24px; cursor: pointer; color: #333; } .top_languages.on>iconify-icon { color: #777; } .top_language_list { visibility: hidden; opacity: 0; position: absolute; top: calc(var(--top2_height) - 38px); right: 0; z-index: 2; -webkit-transition: all .3s ease; transition: all .3s ease } .top_language_list.on { visibility: visible; opacity: 1; /* top: var(--top2_height); */ box-shadow: 4px 6px 10px rgb(0 0 0 / 10%); } .top_language_list ul { overflow: hidden; } .top_language_list li { background: #FFF; } .top_language_list a>span { display: block; padding: 0 14px; min-width: 100px; overflow: hidden } .top_language_list img, .top_language_list .trp-ls-language-name { display: inline-block; vertical-align: middle; margin-left: 8px; font-size: 12px; color: #666; line-height: 30px } .top_language_list .sub-menu li:hover { cursor: pointer; background: var(--i_color) } .top_language_list li:hover .trp-ls-language-name { color: #FFF; background-color: var(--i_color2); } .top_languages, .top_languages>i { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease } .top_language_list .sub-menu li{ display: flex; align-items: center; height: 30px; } @media screen and (max-width:1556px) { } @media screen and (max-width:1440px) { } @media screen and (max-width:1366px) { .i_nav {margin-left: 5%;} .top_r {margin-right: -36px; gap: 0 1px;} } @media screen and (max-width:1200px) { .top_r {margin-right: -36px; gap: 0 11px;} .i_nav{margin-left: 4%;} } @media screen and (max-width:1100px) { .i_nav>li{margin: 0 9px;} } @media screen and (max-width:1086px) { .i_nav>li{margin: 0 7px;} .top_languages{margin-right: 0; padding-right: 0;} } @media screen and (max-width:1042px) { .top_r{margin-right: 0px;} .i_nav{display: none;} .top_languages{margin-right: 20px; } .top_language_list{top: 42px;} .top_search.on{top: 60px;} } @media screen and (max-width:959px) { } @media screen and (max-width:767px) { } @media screen and (max-width:560px) {} /* 移动端导航按钮 */ #showid .sub-menu{display: none; position: relative ; top: 273px; left: -176px;} /* #showid ul>li:nth-child(8):hover .sub-menu{ display: block; } */ #showid{display: none;} /* #showid ul>li:hover{background-color: var(--i_color);} */ @media screen and (max-width:1042px) { #showid ul{ position: absolute; top: 31px; left: -114px; } #showid li{background-color:#fff; border-bottom: 1px solid #000; height: 38px; display: flex;align-items: center;justify-content: center; width: 176px; } #showid li>a{color: #222; font-size: 18px;} } @media screen and (max-width:768px) { #showid ul{ position: absolute; top: 31px; left: -170px; } } @media screen and (max-width:560px) { #showid ul{ position: absolute; top: 31px; left: -160px; } #showid li>a{color: #222; font-size: 12px;} } @media screen and (max-width:393px) { #showid ul{ position: absolute; top: 31px; left: -160px; } } .nav_menu {position: relative;width: 22px;height: 16px;display: none;cursor: pointer} .nav_menu i {display: block;width: 100%;height: 2px;position: absolute;top: 50%;margin-top: -1px;background: #222;border-radius: 10px;transition: 0.5s} .nav_menu::before,.nav_menu::after {content: "";width: 100%;height: 2px;background: #225;position: absolute;left: 0;border-radius: 10px;transition: 0.5s} .nav_menu::before {top: 0;} .nav_menu::after {bottom: 0;} .nav_menu.on i {opacity: 0} .nav_menu.on::before {transform: rotate(45deg);top: 50%;margin-top: -2px} .nav_menu.on::after {transform: rotate(-45deg);top: 50%;margin-top: -2px} @media screen and (max-width:1042px) { .nav_menu {display: block !important} } /* -=---------------------banner--------------------------- */ /* banner */ .banner{width:100%; position:relative;margin-top:calc(var(--header_top) + var(--header_height));} .banner .swiper-slide{height:0; overflow:hidden; padding-bottom:59vh; position:relative;padding-bottom: 36.4%;} .banner .swiper-slide>img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover} .banner .swiper-slide video{position:absolute; left:0; top:0; width:100%; height:100%!important; object-fit:cover; z-index:2} .banner .swiper-slide{width: 100%;display: block;transition:all 0.3s ease;} .banner .swiper-button-prev, .banner .swiper-button-next{position:absolute;top:50%;transform:translate(0,-50%);width:60px;height:60px;z-index:999;outline:none;cursor:pointer;-moz-user-select:none; /*火狐*/-webkit-user-select:none; /*webkit浏览器*/-ms-user-select:none; /*IE10*/-khtml-user-select:none; /*早期浏览器*/user-select:none;-webkit-border-radius:200px; -moz-border-radius:200px; border-radius:200px;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-ms-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;} .banner .swiper-button-prev{left:-60px; background:rgba(0,0,0,.6) url(static/imgs/arrow_left_kx_bai.svg) no-repeat center; background-size:26px} .banner .swiper-button-next{right:-60px; background:rgba(0,0,0,.6) url(static/imgs/arrow_right_kx_bai.svg) no-repeat center; background-size:26px} .banner:hover .swiper-button-prev{left:4%} .banner:hover .swiper-button-next{right:4%} .banner .swiper-button-prev:hover, .banner .swiper-button-next:hover{background-color:var(--i_color)} .banner .pagination-all{position:absolute;bottom: 5%;left: 13.8%;transform:translate(-50%,0);cursor:pointer;z-index:10;} .banner .swiper-pagination {position: relative;display: flex;display: -webkit-flex;align-items: center;text-align: left;} .banner .swiper-pagination-bullet {width: 10px;height: 10px;border-radius: 50%;box-sizing: border-box;background: rgba(255, 255, 255, 0.5);opacity: 1;margin: 0 10px;position: relative;z-index: 4;transition: width,height,background-color 0.5s;-webkit-transition: width,height,background-color 0.5s;-moz-transition: width,height,background-color 0.5s;-ms-transition: width,height,background-color 0.5s;} .banner .swiper-pagination-bullet-active {background: transparent; position: relative;width: 18px;height: 18px;border-radius: 50%;border: 4px solid #fff;} @keyframes banner_img_in { 0%, 5% {-webkit-clip-path: inset(0 0 0 100%);clip-path: inset(0 0 0 100%);transform: scale(1.2);transform-origin: 0 50%;} 100% {-webkit-clip-path: inset(0 -1px 0 0);clip-path: inset(0 -1px 0 0);transform: scale(1);transform-origin: 0 50%;} } @keyframes banner_img_out{ 0% {transform: scale(1);transform-origin: 100% 50%;} 100% {transform: scale(1.1);transform-origin: 100% 50%;} } @media screen and (max-width:1440px){ /* .banner .swiper-slide {padding-bottom: 51vh;} */ } @media screen and (max-width:1024px){ .banner .swiper-slide {padding-bottom: 36vh;} } @media screen and (max-width:959px){ .banner .swiper-slide {padding-bottom: 31vh;} .banner .swiper-button-prev, .banner .swiper-button-next{display:none!important} .banner .pagination-all{bottom:30px;} } @media screen and (max-width:767px){ .banner .swiper-slide{padding-bottom: 24vh;} } @media screen and (max-width:560px){ .banner .swiper-slide{padding-bottom: 21vh;} .banner .pagination-all{bottom:26px} } /* --------------------banner文字------------------- */ .banner_text1{position: absolute;top: 50%;left: 11%;transform: translate(0,-50%);} .banner_text1 h1{font-size: 40px;color: #fff;font-weight: bold;} .banner_text1 h1 span{font-size: 20px;color: white;font-weight: normal;} .banner_text1 h3{font-size: 20px;color: #fff;margin-top: 10px;line-height: 150%;} .banner_text1 p{font-size: 20px;color: #fff;margin-top: 10px;line-height: 36px; display: inline-block; padding: 0 26px; background-color: #333333; border-radius: 20px; cursor: pointer;} .banner_p{margin-top: 40px;} .banner_text1 p:hover{ background-color: var(--i_color); color: #333; } @media screen and (max-width:1440px){ .banner_text1{position: absolute;top: 50%;left: 4%;transform: translate(0,-50%);} .banner_text1 h1{font-size: 30px;} } @media screen and (max-width:1200px){ .banner_text1 h1{font-size: 26px;} .banner_text1 h1 span{font-size: 18px;} .banner_text1 h3{font-size: 16px;margin-top: 5px;} .banner_text1 p{font-size: 16px;margin-top: 5px;} } @media screen and (max-width:1024px){ .banner_text1 h1{font-size: 20px;} .banner_text1 h1 span{font-size: 14px;} .banner_text1 h3{font-size: 16px;margin-top: 5px;} .banner_text1 p{font-size: 14px;margin-top: 5px;} .banner_p{margin-top: 10px;} } @media screen and (max-width:958px){ .banner_text1 h1{font-size: 18px;} .banner_text1 h1 span{font-size: 12px;} .banner_text1 h3{font-size: 16px;margin-top: 5px;} .banner_text1 p{font-size: 12px;margin-top: 5px;} .banner_p{margin-top: 5px;} } @media screen and (max-width:768px){ .banner_text1 h1{font-size: 15px;} .banner_text1 h1 span{font-size: 12px;} .banner_text1 h3{font-size: 14px;margin-top: 5px;} .banner_text1 p{font-size: 12px;margin-top: 5px;} .banner_p{display: none;} } @media screen and (max-width:560px){ .banner_p{margin-top: 5px;} .banner_text1 h3{display: none;} } .banner_text2{position: absolute;top: 50%;left: 11%;transform: translate(0,-50%);} .banner_text2 h2{font-size: 38px;color: #ff9d36;font-weight: bold; text-transform: uppercase;} .banner_text2 h2 span{font-size: 20px;color: white;font-weight: normal;} .banner_text2 h3{font-size: 20px;color: #FFF;margin-top: 10px;line-height: 150%;} .banner_text2 p{font-size: 20px;color: #fff;margin-top: 10px;line-height: 36px; display: inline-block; padding: 0 26px; background-color: #333333; border-radius: 20px; cursor: pointer;} .banner_text2 p:hover{ background-color: var(--i_color); color: #333; } @media screen and (max-width:1440px){ .banner_text2{position: absolute;top: 50%;left: 4%;transform: translate(0,-50%);} .banner_text2 h2{font-size: 30px;} } @media screen and (max-width:1200px){ .banner_text2 h2{font-size: 26px;} .banner_text2 h2 span{font-size: 18px;} .banner_text2 h3{font-size: 16px;margin-top: 5px;} .banner_text2 p{font-size: 16px;margin-top: 5px;} } @media screen and (max-width:1024px){ .banner_text2 h2{font-size: 20px;} .banner_text2 h2 span{font-size: 14px;} .banner_text2 h3{font-size: 16px;margin-top: 5px;} .banner_text2 p{font-size: 14px;margin-top: 5px;} .banner_p{margin-top: 10px;} } @media screen and (max-width:958px){ .banner_text2 h2{font-size: 18px;} .banner_text2 h2 span{font-size: 12px;} .banner_text2 h3{font-size: 16px;margin-top: 5px;} .banner_text2 p{font-size: 12px;margin-top: 5px;} .banner_p{margin-top: 5px;} } @media screen and (max-width:768px){ .banner_text2 h2{font-size: 18px;} .banner_text2 h2 span{font-size: 12px;} .banner_text2 h3{font-size: 16px;margin-top: 5px;} .banner_text2 p{font-size: 12px;margin-top: 5px;} .banner_p{display: none;} } @media screen and (max-width:560px){ .banner_text2 h2{font-size: 14px;text-shadow: 1px 1px 0px rgb(255 255 255 / 100%);} .banner_text2 h2 span{font-size: 12px;} .banner_text2 h3{display: none; font-size: 14px;margin-top: 5px;text-shadow: 1px 1px 0px rgb(0 0 0 / 100%);} .banner_text2 p{font-size: 12px;margin-top: 5px;} .banner_p{margin-top: 5px;} } .banner_text3{position: absolute;top: 50%;left: 11%;transform: translate(0,-50%);} .banner_text3 h2{font-size: 40px;color: #333;font-weight: bold; display: inline-block;} .banner_text3 h2 span{font-size: 20px;color: white;font-weight: normal; text-transform: uppercase;} .banner_text3 h3{font-size: 20px;color: #333;margin-top: 10px;line-height: 150%; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;} .banner_text3 p{font-size: 20px;color: #fff;margin-top: 10px;line-height: 36px; display: inline-block; padding: 0 26px; background-color: #333333; border-radius: 20px; cursor: pointer;} .banner_text3 p:hover{ background-color: var(--i_color); color: #333; } @media screen and (max-width:1440px){ .banner_text3{position: absolute;top: 50%;left: 4%;transform: translate(0,-50%);} .banner_text3 h2{font-size: 30px;} } @media screen and (max-width:1200px){ .banner_text3 h2{font-size: 26px;} .banner_text3 h2 span{font-size: 18px;} .banner_text3 h3{font-size: 16px;margin-top: 5px;} .banner_text3 p{font-size: 16px;margin-top: 5px;} } @media screen and (max-width:1024px){ .banner_text3 h2{font-size: 20px;} .banner_text3 h2 span{font-size: 14px;} .banner_text3 h3{font-size: 16px;margin-top: 5px;} .banner_text3 p{font-size: 14px;margin-top: 5px;} .banner_p{margin-top: 10px;} } @media screen and (max-width:958px){ .banner_text3 h2{font-size: 18px;} .banner_text3 h2 span{font-size: 12px;} .banner_text3 h3{font-size: 16px;margin-top: 5px;} .banner_text3 p{font-size: 12px;margin-top: 5px;} .banner_p{margin-top: 5px;} } @media screen and (max-width:768px){ .banner_text3 h2{font-size: 18px;} .banner_text3 h2 span{font-size: 12px;} .banner_text3 h3{font-size: 16px;margin-top: 5px;} .banner_text3 p{font-size: 12px;margin-top: 5px;} .banner_p{display: none;} } @media screen and (max-width:560px){ .banner_text3 h2{font-size: 18px;} .banner_text3 h2 span{font-size: 12px;} .banner_text3 h3{font-size: 16px;margin-top: 5px; text-shadow: 1px 1px 0 #FFF;} .banner_text3 p{font-size: 12px;margin-top: 5px;} .banner_p{margin-top: 5px;} } @media screen and (max-width:393px){ .banner_text3 h2{font-size: 18px;} .banner_text3 h3{font-size: 14px;} } .b_cont{position:absolute; top:50%; transform:translate(0,-50%);width: 100%; z-index: 2;} .b_cont_txt{width: 30%; position: relative; left: 6%;z-index: 2;} .b_cont_txt p{font-size: 38px;color: #ff9d36;font-weight: bold;} .b_cont_txt h5{margin: 20px 0 50px; font-size: 20px;color: #FFF;} .b_cont_txt dl{display:-webkit-inline-flex; display:inline-flex; flex-wrap:wrap;flex-direction: column;gap: 14px 0;} .b_cont_txt dt{padding: 10px 20px; text-align: center; background: #333;-webkit-border-radius:200px; border-radius:200px;cursor: pointer;} .b_cont_txt dt h6{font-size: 20px;color: #FFF;} .b_cont_txt dt:hover{background: var(--i_color);} .b_cont_txt dt:hover h6{color: #333;} .b_cont>a{position:absolute; top:50%; transform:translate(0,-50%); right: 4%; max-width:72%;} .b_cont>a img{width: 100%;} @media screen and (max-width:1440px) { .b_cont_txt{left: 4%;} .b_cont_txt{width: 36%;} .b_cont_txt p{font-size: 32px;} .b_cont_txt h5{font-size: 18px;} .b_cont>a{right: 2%; max-width: 70%;} } @media screen and (max-width:1366px) {} @media screen and (max-width:1200px) { .b_cont_txt p{font-size: 28px;} .b_cont_txt h5{margin: 18px 0 30px; font-size: 16px;} .b_cont_txt dt h6{font-size: 16px;} } @media screen and (max-width:1024px) { .b_cont_txt{width: 50%;} .b_cont_txt p{font-size: 22px;} .b_cont_txt h5{margin: 10px 0 20px; font-size: 14px;} .b_cont_txt dl{gap: 10px 0;} .b_cont>a{max-width: 66%;} } @media screen and (max-width:768px) { .b_cont_txt{width: 70%;} .b_cont_txt p{font-size: 18px;text-shadow: 1px 1px 0 #000;} .b_cont_txt h5{text-shadow: 1px 1px 0 #000;} .b_cont_txt dl{display: none;} .b_cont>a{max-width: 72%;} } @media screen and (max-width:560px) { .b_cont_txt{width: 90%;} .b_cont>a{max-width: 88%;} .b_cont_txt h5{display: none;} } /* main */ main {position: relative;background: #FAFAFA;z-index: 5;max-width: 100%;} /* Category */ .i_roller_lists { position: relative; /* overflow: hidden */ } .i_roller_list{overflow: initial !important;} .i_roller_lists .swiper-wrapper { display: -webkit-flex; display: flex; position: relative; width: 100% } .i_roller_lists .swiper-slide { flex-shrink: 0; position: relative; overflow: hidden; } .Category_products_list li>a{height: 60px; width: 100%;} .title p{color: #333333; font-size: 40px; line-height: 70px; display: inline-block; font-weight: bolder;} .title{ padding: 10px 0; position: relative; margin-bottom: 50px;} .title h2{height: 4px; width: 6%; background-color: #FADB14;} .title h3{color: #999999; font-size: 18px; margin-top: 10px; display: inline-block;} .v_all{ position: absolute; right: 0; top: 50%; padding: 5px 20px; background-color: #EAEAEA; border-radius: 30px; font-size: 18px; line-height: 36px; cursor: pointer; } .v_all::before{ opacity: 0; content: ''; position: absolute; left: 0; transform: translate(0, 0); top: 0; width: 0; height: 100%; background: var(--i_color); border-radius: 30px; } .v_all i { display: block; text-align: center; font-size: 18px; color: var(--i_color); line-height: 40px; position: relative; color: #333333; } .v_all:hover i { color: #FFF; } .v_all:hover::before{ opacity: 1; width: 102%; -webkit-transition: all .6s ease; transition: all .6s ease; border-radius: 30px; } .Category{ padding-top: 55px; background: url(./static/imgs/catageories.webp) no-repeat 0 0;} .Category_products_list{ margin-bottom: 100px; display: flex; justify-content: space-between; } .Category_products_list li{ position: relative; width: 24%; } .Category_products_list li>a>img{ width: 100%; } .Category_products_list li>a>p{ padding: 6px 0; height: 48px; background-color: #EAEAEA; width: 100%; position: absolute; bottom: 0; left: 0; border-radius: 30px 30px 0 0; color: #000000; font-size: 24px; line-height: 48px; text-align: center; } .hover_img:hover+p{ background-color: var(--i_color); } .bottom_v_all{ position: relative; padding: 10px 20px; background-color: #EAEAEA; border-radius: 30px; font-size: 18px; line-height: 36px; cursor: pointer; } .bottom_v_all::before{ opacity: 0; content: ''; position: absolute; left: 0; transform: translate(0, 0); top: 0; width: 0; height: 100%; background: var(--i_color); } .bottom_v_all i { text-align: center; font-size: 18px; color: var(--i_color); line-height: 40px; position: relative; color: #333333; } .bottom_v_all:hover i { color: #FFF; } .bottom_v_all:hover::before{ opacity: 1; width: 102%; -webkit-transition: all .6s ease; transition: all .6s ease; border-radius: 30px; } .button{text-align: center; display: none;} @media screen and (max-width:1440px) { } @media screen and (max-width:1366px) {} @media screen and (max-width:1200px) { .Category_products_list li>a>p{height: 45px;line-height: 45px; font-size: 20px;} } @media screen and (max-width:1042px) { .title{margin-top: 0;} .title p{font-size: 30px;} .Category{padding-bottom: 60px;} .Category_products_list{flex-wrap: wrap;} .Category_products_list li>a>p{height: 60px;line-height: 60px; font-size: 20px;} .Category_products_list li{width: 49%; margin-bottom: 20px;} } @media screen and (max-width:968px) { .v_all{display: none;} .button{display: block; margin-top: 20px;} } @media screen and (max-width:767px) { .Category_products_list li>a>p{height: 50px;line-height: 50px; font-size: 20px;} .Category{padding-bottom: 60px;} } @media screen and (max-width:560px) { .title{margin-bottom: 20px;} .Category_products_list{margin-bottom: 20px;} .title p{font-size: 24px;} .title h3{font-size: 14px;} .bottom_v_all i{font-size: 15px;} .Category_products_list li>a>p{height: 25px;line-height: 25px; font-size: 14px;} .Category{padding-bottom: 40px; padding-top: 20px;} } @media screen and (max-width:393px) { .Category {padding-top: 20px;} .Category{padding-bottom: 40px;} } /* proudct_display */ .proudct_display{ background-image: url(./static/imgs/displaybackground.webp); position: relative; background-size: cover; padding-bottom: 70px; } .display{display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;box-sizing: border-box;padding: 60px 0 20px;} .display .title{font-size: 30px;color: #222;font-weight: bold;text-transform: uppercase;} .display_up_ul{display: flex;display: -webkit-flex;flex-wrap: wrap; position: absolute; right: 0; cursor: pointer;} .display_up_ul li{margin-left: 15px;border: 1px solid #fff; border-radius: 30px; } .display_up_ul li a{font-size: 18px;color: #fff;transition: all 0.3s ease;padding: 2px 10px; display: block;} .display_up_ul li:hover{background-color: var(--i_color);} .display_up_ul li:hover a{color: #222;} .display_up_ul .current{background-color: var(--i_color) !important;} /* .proudct_display .title{position: absolute; top: 90px;} */ .title .tit_p{color: #fff; font-weight: bolder;} .title .tit_h{color: #fff;} .proudct_display .title{padding-top: 100px;} .hot_up_active a{color: #fff !important;} .display_area{display: flex;display: -webkit-flex;flex-wrap: wrap;text-align: center; gap: 45px 16px;} .display_area li{width: 24.2%; position: relative;} .display_area li>a>.img{ position: relative; overflow: hidden; } .display_area li>a>.img img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover } .display_area li>a>.img::before{ content: ''; display: block; padding-bottom: 87%; } #tab_cont1 .display_area li p{ padding: 6px 0; text-transform: uppercase; height: 40px; background-color: #EAEAEA; width: 100%; left: 0; color: #000000; font-size: 18px; line-height: 40px; text-align: center; position: relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } #tab_cont1 .display_area li>a:hover p{ background-color: var(--i_color); } .v_button{ text-align: center; margin-top: 60px; } .v_all_p{ position: relative; display: inline-block; padding: 5px 20px; background-color: #EAEAEA; border-radius: 30px; font-size: 18px; line-height: 36px; cursor: pointer; } .v_all_p::before{ opacity: 0; content: ''; position: absolute; left: 0; transform: translate(0, 0); top: 0; width: 0; height: 100%; border-radius: 30px; background: var(--i_color); } .v_all_p i { display: block; text-align: center; font-size: 18px; color: var(--i_color); line-height: 40px; position: relative; color: #333333; } .v_all_p:hover i { color: #FFF; } .v_all_p:hover::before{ opacity: 1; width: 100%; -webkit-transition: all .6s ease; transition: all .6s ease; border-radius: 30px; } @media screen and (max-width:1440px){ #tab_cont1 .display_area li p{ height: 50px; line-height: 50px; font-size: 20px; } .title .tit_p{font-size: 30px;} .title .tit_h{font-size: 16px;} .display_area{gap: 45px 7px;} .display_area .title{font-size: 24px;} .hot_up_ul li{margin-left: 5px;border: 1px solid #d6d6d6;} .hot_up_ul li a{padding: 10px 15px;} } @media screen and (max-width:1042px){ .display_up_ul{bottom: -25px;} .title .tit_h{font-size: 14px;} .title .tit_p{font-size: 24px;} .v_all_p i{font-size: 14px;} .display_up_ul li a{font-size: 14px;} #tab_cont1 .display_area li p{height: 30px; line-height: 30px; font-size: 14px;} } @media screen and (max-width:713px){ .v_button{margin-top: 20px;} .proudct_display .title{ padding-top: 40px;} .display_area .title{font-size: 24px;} .display_area {gap: 20px 9px;} .display_area li{width: 49%;} .proudct_display{padding-bottom: 40px;} } @media screen and (max-width:680px){ #tab_cont1 .display_area li>a p{height: 20px; line-height: 20px; font-size: 14px;} } @media screen and (max-width:510px){ /* .display_area{display: block;} */ .display_area {gap: 45px 6px; padding-top: 20px;} .title .tit_h{overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;} } @media screen and (max-width:393px){ #tab_cont1 .display_area li>a p{bottom: 0px; height: 20px; line-height: 20px; font-size: 14px;} .display_up_ul li{margin-left: 8px;} .display_up_ul li a{font-size: 12px;} .proudct_display{padding-bottom: 40px;} .proudct_display .title{padding-top: 20px;} } /* companiy */ .company{display: flex; gap: 0 60px; background-image: url(./static/imgs/compa.webp); padding-bottom: 80px; background-size: cover;} .company_left{ width: 50%; } .company_wrap{display: flex; margin-top: 80px; gap: 0 50px;} .company_left .title{width: 100%; margin-top: 0;} .company_left .title p{font-size: 40px;} .company_left .title h3{font-size: 18px; color: #222; margin-bottom: 20px;} .company_left .title span{font-size: 18px; padding: 3px 20px; background-color: #EAEAEA; border-radius: 25px; margin-top: 20px;} .company_right{ box-sizing: border-box; } .company_right{width: 49%; position: relative;} .company_left_list{display: flex; gap: 0 15px; cursor: pointer; } .company_left_list li{width: 32%; border: 1px solid #ccc; border-radius:15px; box-sizing: border-box; padding: 40px 20px;} .company_left_list>li>h3{font-size: 24px; line-height: 24px; text-align: center; font-weight: bolder;} .company_left_list>li>h4{font-size: 18px; text-align: center; font-weight: bolder; line-height: 24px;} .company_left_list>li>p{font-size: 14px; line-height: 24px; color: #666666; text-align: center; margin-top: 20px;} .company_left_list li:hover{background-color: var(--i_color);} .company_right_img{height: 100%; width: 100%;} .company_right_img img{ top: 25px; position: absolute; width: 100%; left: 5px; /* height: 100%; */ object-fit: cover } /* .img1{ position: absolute; top: 23px; left: 60px; z-index: 1; } */ .company_right_img::after { content: ''; display: block; padding-bottom: 68.5%; } @media screen and (max-width:1440px){ .company_left .title p{font-size: 34px;} .company_left .title h3{font-size: 16px;} } @media screen and (max-width:1366px){ .company_left .title p{font-size: 30px;} .company_left .title h3{font-size: 15px;} } @media screen and (max-width:1200px){ .company_wrap{flex-wrap: wrap;} .company_left{margin-bottom: 40px;} .company_right{ width: 100%; } .company_left{ width: 100%; } .img1{ left: 30px; } .img2{ left: 40px; } } @media screen and (max-width:768px){ .company_left .title p{font-size: 24px;} .company_left .title h3{font-size: 14px;} .company_left_list li{padding: 30px 5px;} .company_wrap{margin-top: 40px;} } @media screen and (max-width:680px){ .company_left_list>li>h3{font-size: 24px;} .company_left_list>li>h4{font-size: 16px;} .company_left_list>li>p{font-size: 14px;} .img1{ left: 20px; } .img2{ left: 30px; } } @media screen and (max-width:680px){ .company_left_list{flex-wrap: wrap; justify-content: center;} .company_left_list li{width: 80%;} } /* Company_Display */ .Company_Display{background-color: #fff; padding-bottom: 80px; padding-top: 60px; width: 100%; position: relative;overflow: hidden;} .Company_Display .title{margin-top: 0;} .line{width: 65%; height: 2px; background-color: #cccc; position: absolute; right: 0; top: 13.5%;} .i_roller_list { position: relative; overflow: hidden } .i_roller_list .swiper-wrapper { display: -webkit-flex; display: flex; position: relative; width: 100% } .i_roller_list .swiper-slide { position: relative; flex-shrink: 0; position: relative; overflow: hidden; } .i_roller_list .img { width: 100%; position: relative; overflow: hidden } .i_roller_list .img::before { content: ""; display: block; padding-bottom: 66% } .i_roller_list .img img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover } .i_roller_list .txt { margin-top: 14px; text-align: center; } .i_roller_list .txt p { bottom: 14px; width: 100%; visibility: hidden; position: absolute; background-color: var(--i_color); font-size: 24px; padding: 10px 0; line-height: 24px; border-radius: 24px 24px 0 0; color: #000000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .i_roller_list .swiper-slide:hover p { visibility: visible; } .i_roller_list .img img { -webkit-transition: all 1s ease; transition: all 1s ease } .roller-prev, .roller-next { position: absolute; top: 46%; transform: translate(0, -50%); width: 40px; height: 60px; z-index: 3; cursor: pointer; outline: none; -webkit-user-select: none; user-select: none } .roller-prev { left: 0; background: rgb(255 255 255 / 85%) url(static/images/public/arrow/hollow/arrow_l_b.svg) no-repeat center; background-size: 20px } .roller-next { right: 0; background: rgb(255 255 255 / 85%) url(static/images/public/arrow/hollow/arrow_r_b.svg) no-repeat center; background-size: 20px } .roller-pagination { display: block; margin-top: 30px; text-align: center } .roller-pagination .swiper-pagination-bullet { width: 6px; height: 6px; display: inline-block; margin: 0 4px; background: #AAA; -webkit-border-radius: 100px; border-radius: 100px; outline: none } .roller-pagination .swiper-pagination-bullet-active { width: 26px; background: var(--i_color) } .roller-pagination .swiper-pagination-bullet { -webkit-transition: all .5s ease; transition: all .5s ease } @media screen and (max-width:1440px) { .line{width: 67%; top: 14.5%;} } @media screen and (max-width:1200px) { .line{width: 65%; top: 16.5%;} } @media screen and (max-width:1024px) { .line{width: 65%; top: 20.5%;} .Company_Display{padding-bottom: 40px;} .i_roller_list{display:flex;justify-content:center; flex-wrap:wrap} .i_roller_list .txt p { font-size: 14px; } .roller-prev, .roller-next { margin:0 4px; position: initial; transform: none; width:36px;height: 36px; background-color: #f1f1f1; } } @media screen and (max-width:900px) { .line{width: 65%; top: 22.5%;} } @media screen and (max-width:800px) { .line{width: 60%; top: 22.5%;} } @media screen and (max-width:768px) { .line{width: 60%; top: 16.5%;} .i_roller_list .txt p { font-size: 13px; } } @media screen and (max-width:690px) { .line{width: 52%; top: 17.5%;} } @media screen and (max-width:560px) { .line{width: 52%; top: 19.5%;} .roller-pagination { margin-top: 20px; } @media screen and (max-width:490px) { .line{width: 48%; top:27.5%;} } @media screen and (max-width:425px) { .line{width: 40%; top:13.5%;} } } /* How to buy */ .osa_cont { padding-bottom: 68px; padding-top: 100px; display: -webkit-flex; display: flex; flex-wrap: nowrap; align-items: center; } .osa_cont .i_tit { margin-bottom: 0; width: 34%; } .osa_cont .i_tit h2{ padding-bottom: 20px; font-size: 40px; font-weight: bolder; } .osa_cont .i_tit h3{ width: 14%; height: 4px; background-color: var(--i_color); } .osa_cont .i_tit h6{font-size: 18px; line-height: 30px; color: #999999; padding-top: 15px;} .osa_list { align-items: center; width: 60%; margin-left: auto; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; } .osa_list dt { width: 16%; font-size: 20px; text-align: center; position: relative; } .osa_list dt>i { position: absolute; top: 28%; right: -15px; font-size: 30px; color: #c9c9c9; } .osa_list dt:last-child i { display: none; } .osa_list .ico { width: 86px; height: 86px; margin: 0 auto; background: #585858; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease } .osa_list .ico img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 50px; } .osa_list .ico:hover{background-color:var(--i_color); color: #222;} .osa_list .ico img:hover{color: #222;} .osa_list p { margin-top: 18px; font-size: 15px; color: #333; text-transform: lowercase; } .osa_list dt:hover .ico { -webkit-transform: scale(1.15, 1.15); transform: scale(1.15, 1.15); } .osa_list dt:hover>i { animation: lr .5s linear 0s infinite alternate } .progress_line{height: 1px; background-color: #D8D8D8; width: 100%;} .progress_line_before{ width: 40%; height: 1px; background-color: var(--i_color); } @keyframes lr { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0) } 100% { -webkit-transform: translate(10px, 0); transform: translate(10px, 0) } } @media screen and (max-width:1500px) { .osa_list .ico { width: 80px; height: 80px; } .osa_list dt{height: 115px;} } @media screen and (max-width:1366px) { .osa_list dt{height: 115px;} } @media screen and (max-width:1200px) { .osa_list .ico { width: 70px; height: 70px; } .osa_list .ico img { height: 40px; } .osa_list dt>i { top: 20%; } } @media screen and (max-width:1042px) { .osa_cont { display: block; } .osa_cont .i_tit { width: 100%; } .osa_list { width: 100%; margin: 40px 0 0 0; } } @media screen and (max-width:1042px) { .osa_list dt{height: 105px;} } @media screen and (max-width:768px) { .osa_list .ico { width: 60px; height: 60px; } .osa_list .ico img { height: 34px; } .osa_list p { font-size: 14px; } .osa_list dt>i { font-size: 24px; } } @media screen and (max-width:560px) { .osa_cont .i_tit h3{width: 5%;} .osa_list .ico { width: 44px; height: 44px; } .osa_list .ico img { height: 24px; } .osa_list p { margin-top: 10px; font-size: 12px; } .osa_list dt>i { right: -8px; font-size: 16px; } .osa_list dt>i>img{width: 13px;} } /* Machinery brand */ .Machinery_brand{padding-bottom: 80px;} .Machinery_brand h2{text-align: center; font-size: 40px; line-height: 70px; margin-top: 70px; font-weight: bolder;} .logo_list { position: relative; overflow: hidden } .logo_list .swiper-wrapper { display: -webkit-flex; display: flex; position: relative; width: 100%; -webkit-transition-timing-function: linear; -moz-transition-timing-function: linear; -ms-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; } .logo_list .swiper-slide { flex-shrink: 0; position: relative; overflow: hidden; background: #FFF; } .logo_list .swiper-slide::before { content: ""; display: block; padding-bottom: 42% } .logo_list .swiper-slide img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; object-fit: contain } @media screen and (max-width:1200px) { .osa_cont .i_tit h2{font-size: 30px;} .osa_cont .i_tit h6{font-size: 14px;} .Machinery_brand h2{font-size: 30px;} } @media screen and (max-width:1024px) { .osa_cont{padding-top: 40px;} .osa_cont{padding-bottom: 40px;} .Machinery_brand h2{margin-top: 20px;} .Machinery_brand{padding-bottom: 40px;} } @media screen and (max-width:960px) { } @media screen and (max-width:560px) { .osa_cont .i_tit h6{line-height: 20px;} .osa_cont .i_tit h2{font-size: 24px;} .osa_cont .i_tit h6{font-size: 14px;} .Machinery_brand h2{font-size: 24px;} } /* ---------------------footer --------------------------------------*/ footer{ position: relative; width: 100%; background-image: url('static/imgs/footerbac.webp'); background-size: cover; background-repeat: no-repeat; } .footer_bac{ box-sizing: border-box; padding: 80px 0 70px 0; } .footer{ display: flex; display: -webkit-flex; flex-wrap: wrap; } .footer_area{ width: 65.7%; } .footer_area_title{ display: flex; display: -webkit-flex; gap: 0 20px; box-sizing: border-box; align-items: center; padding-bottom: 20px; border-bottom: 1px solid #fff; margin-bottom: 80px; } .footer_area_title p{font-size: 18px; color: #fff;} .footer_area_al{ gap: 0 20px; display: flex; display: -webkit-flex; } .footer_area_al dt a{ display: block; } .footer_area_al iconify-icon{ font-size: 30px; color: #ccc; transition: all 0.3s ease; } .footer_area_al dt:hover iconify-icon{ transform: translateY(-8px); color: var(--i_color); } .footer_area_all{ display: flex; display: -webkit-flex; flex-wrap: wrap; } .footer_area_all h2{ font-size: 30px; text-transform: uppercase; color: white; display: inline-block; box-sizing: border-box; padding-bottom: 10px; position: relative; margin-bottom: 25px; } /* .footer_area_all h2::after{ content: ''; width: 115%; height: 1px; position: absolute; bottom: 0; left: 0; background-color: #D0D0D0; } */ /* .footer_area_all h2::before{ content: ''; width: 40px; height: 3px; position: absolute; bottom: -1px; left: 0; background-color: var(--i_color); z-index: 2; } */ .footer_contact{ margin-bottom: 80px; width: 51%; } .footer_contact_ul li{ margin-bottom: 20px; } .footer_contact_ul li a{ display: flex; display: -webkit-flex; align-items: center; margin-bottom: 19px; } .footer_contact_ul li>a>iconify-icon{ font-size: 30px; color: var(--i_color); } .footer_contact_ul li a p{ font-size: 18px; line-height: 32px; color: white; margin-left: 10px; box-sizing: border-box; padding-right: 5%; transition: all 0.3s ease; } .footer_contact_ul li:hover p{ color: var(--i_color); } .whatsapp_qr{display: table; margin-top: 20px; text-align: center;} .whatsapp_qr img{height: 100px;} .whatsapp_qr p{margin-top: 4px; font-size: 14px;color: #FFF;} .footer_follow{ width: 26%; } .footer_products{ width: 23%; } .footer_a_ul{ } .footer_a_ul li{ margin-bottom: 20px; } .footer_a_ul li a{ font-size: 16px; color: white; line-height: 24px; text-transform: uppercase; transition: all 0.3s ease; } .footer_a_ul li a:hover{ color: var(--i_color); } .footer_form{ padding-top: 4%; box-sizing: border-box; padding-left: 6%; width: 34.3%; } .footer_form_area{ width: 100%; border: 1px solid #FFFFFF; box-sizing: border-box; padding: 50px 9% 30px 9%; border-radius: 25px; } .footer_form_area h3{ font-size: 30px; color: var(--i_color); text-transform: uppercase; box-sizing: border-box; padding-bottom: 15px; } .footer_form_area span{ font-size: 15px; line-height: 24px; color: #969696; } #wpforms-264 { padding-top: 15px; --input_font_size: 16px; --input_height: 46px } #wpforms-form-264 { width: 100%; position: relative; overflow: hidden } #wpforms-264 input, #wpforms-264 button { margin: 0; padding: 0; border: none; background: none } #wpforms-264 .wpforms-field { padding: 0; margin: 0 } #wpforms-264 .wpforms-field-label { font-size: 0; } #wpforms-264 .wpforms-required-label { position: absolute; top: 20px; left: 8px; font-size: 16px; color: #F00 } #wpforms-264 .wpforms-field { width: 100%; background: transparent; padding-bottom: 20px; position: relative; overflow: hidden } #wpforms-264 .wpforms-field-container input, #wpforms-264 textarea { width: 100%; max-width: 100% !important; min-width: 100%; font-size: var(--input_font_size); color: #333; height: var(--input_height); box-sizing: border-box; background: #F6F6F6; padding: 0 20px; overflow: hidden; -webkit-transition: all .5s ease; transition: all .5s ease } #wpforms-264 .wpforms-field-container input:hover, #wpforms-264 textarea:hover { border-color: var(--i_color); } #wpforms-264 input { line-height: var(--input_height); border-radius: 5px; } #wpforms-264 textarea { line-height: 22px; min-height: 100px; padding: 15px 20px; border-radius: 5px; height: 100px; } #wpforms-264 input::-webkit-input-placeholder, #wpforms-264 textarea::-webkit-input-placeholder { color: #909090; font-size: var(--input_font_size) } #wpforms-264 input::-moz-placeholder, #wpforms-264 textarea::-moz-placeholder { color: #909090; font-size: var(--input_font_size) } #wpforms-264 input::-ms-input-placeholder, #wpforms-264 textarea::-ms-input-placeholder { color: #909090; font-size: var(--input_font_size) } #wpforms-264-field_1-error, #wpforms-264-field_2-error, #wpforms-264-field_3-error, #wpforms-264-field_4-error, #wpforms-264-field_5-error, #wpforms-264-field_6-error { position: absolute; font-size: 12px; color: #A90909; } #wpforms-264 .wpforms-field-container { width: 100%; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; overflow: hidden } #wpforms-264 .wpforms-submit-container { padding: 0 !important; overflow: hidden; position: relative; margin-left: auto; width: 100%; } #wpforms-264 .wpforms-submit-container button { width: 50%; height: 48px; font-size: 16px; font-weight: bold; color: #333; background: var(--i_color); line-height: 48px; cursor: pointer; position: relative; border-radius: 25px; } #wpforms-264 .wpforms-submit-container img { position: absolute; top: 50%; transform: translate(0, -50%); right: 4px } #wpforms-264 .wpforms-submit-container button{ position: relative; overflow: hidden; } @media screen and (max-width:1600px) { } @media screen and (max-width:1440px) { .footer_form_area h3 {font-size: 26px;} } @media screen and (max-width:1366px) { .footer_contact_ul li a p br{display: none;} } @media screen and (max-width:1200px) { .footer_form {padding-left: 4%;} } @media screen and (max-width:1024px) { .footer_area_title>img{height:80px} .footer_products{display: none;} .footer_contact {width: 60%;} .footer_follow {width: 40%;} } @media screen and (max-width:960px) { .footer_contact {width: 100%;} .footer_contact_ul li a p{font-size: 16px;} .footer_follow{display: none;} .footer_area {width: 58%;} .footer_form {width: 42%;} } @media screen and (max-width:768px) { #wpforms-264 .wpforms-submit-container button{line-height: 40px; line-height: 40px; font-size: 14px;} .footer_area_title{margin-bottom: 20px;} .footer_area_title p{font-size: 16px;} .footer_area {width: 100%;} .footer_form {width: 100%;margin-bottom: 40px;} .footer_form {padding-left: 0%;} .footer {flex-direction: column-reverse;} .footer_form_area {padding: 50px 3% 30px 3%;} } @media screen and (max-width:560px) { .footer_area_title>img{height:60px} .footer_area_title p{font-size: 14px;} } @media screen and (max-width:448px) { .footer_area_title p{font-size: 12px;} } @media screen and (max-width:393px) { } /* footer_max */ .footer_max{ background-color:var(--i_color); border-radius: 20px 20px 0 0; width: 100%; } .footer_max_area{ display: block; display: -webkit-flex; flex-wrap: wrap; justify-content: space-between; box-sizing: border-box; padding: 20px 0; } .footer_max_area p{ font-size: 18px; color: #000000; } .footer_max_area a{ font-size: 18px; color: #000000; transition: all 0.3s ease; } @media screen and (max-width:960px) { .footer_bac{padding: 40px 0 40px 0;} .footer_contact{ margin-bottom: 40px; } .footer_max_area {padding: 20px 0;} } @media screen and (max-width:768px) { /* .footer_max_area {display: none;} */ .footer_max_area p{text-align: center; font-size: 14px; display: flex; align-items: center;} } @media screen and (max-width:560px) { .footer_max_area{padding: 5px 0;} } @media screen and (max-width:393px) { .footer_max_area{justify-content: center;} .footer_max_area a{text-align: center;} .footer_max_area p{text-align: center;} .footer_max_area{padding: 0;} } /* -------------------------------------- 侧边客服 -------------------------------------- */ .aside_right{position:fixed; right:-50px; bottom:20%; z-index:999999;transition: all 0.5s ease;} .aside_right.on{ right:10px; } .aside_right li{position:relative; cursor:pointer;} .aside_right li>a{display:block;transition: all 0.3s ease; width:48px;margin-top: 5px;border-radius: 50%; height:48px; background:#808080; display:flex; justify-content:center; align-items:center; z-index:3} .aside_right em{display:block; margin:0 auto; width:20px; height:20px;} .aside_right li:nth-child(1) em{background:url(static/imgs/aside_ico_whatsapp.svg) no-repeat center; background-size:contain} .aside_right li:nth-child(2) em{background:url(static/imgs/aside_ico_tel.svg) no-repeat center; background-size:contain} .aside_right li:nth-child(3) em{background:url(static/imgs/email.svg) no-repeat center; background-size:contain} .aside_right li:nth-child(4) em{background:url(static/imgs/top1.svg) no-repeat center; background-size:contain} .aside_right li>a:hover{background:var(--i_color);} .side_tel_box, .side_qr_box{position:absolute; box-shadow:-1px 2px 6px rgba(0,0,0,.2); display:flex; justify-content:center; align-items:center; z-index:-1} .side_tel_box{top:7px; right:-300px; width:180px; background:#FFF} .side_qr_box{top:50%; transform:translate(0,-50%); right:-180px; width:120px; height:120px; background:#FFF} .side_tel_box h6{padding:8px 0; font-size:14px; color:#666} .side_tel_box h6 a{line-height:20px} .side_tel_box a:hover{color:var(--i_color)} .side_qr_box img{width:90%; height:90%} .aside_right li:hover .side_tel_box, .aside_right li:hover .side_qr_box{right:48px} .side_tel_box, .side_qr_box{-webkit-transition:all .3s ease; -moz-transition:all .3s ease; -ms-transition:all .3s ease; -o-transition:all .3s ease; transition:all .3s ease} /* 侧边客服 表单 */ #aside_mask_bg{display:none; position:fixed; top:0%; left:0%; width:100%; height:100%; background:rgba(0,0,0,.6); z-index:9999999999998} #aside_sc_from{display:none; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); width:800px; box-sizing: border-box; padding:60px 40px;border-radius: 20px; background:#e2e2e2; z-index:9999999999999; overflow:auto} #aside_sc_from .tit{margin-bottom:40px} .Machinery_brand h2#aside_sc_from .tit h2{font-size:26px; color:#333; text-align: center;text-transform: uppercase; font-weight:bold; line-height:30px} .wpforms-field-description{color: #9e9e9e; font-size: 14px;} #wpforms-272{--input_font_size:16px; --input_height:42px} #wpforms-272{width:100%; margin:0 auto; padding:0} #wpforms-form-272{width:100%; overflow:hidden} #wpforms-272 input, #wpforms-272 button{margin:0; padding:0; border:none; background:none} #wpforms-272 .wpforms-field{padding:0; margin:0} #wpforms-272 .wpforms-error-container{line-height:16px} #wpforms-272 .wpforms-field-container{width:100%; display:-webkit-flex; display:flex; flex-wrap:wrap; overflow:hidden} #wpforms-272 .wpforms-submit-container{padding:0!important; width:170px; height:var(--input_height); background:var(--i_color);border-radius: 20px; position:relative;margin:0 auto;} #wpforms-272 .wpforms-field{position: relative;} #wpforms-272 .wpforms-field-label{font-size: 0;} #wpforms-272 .wpforms-field-label span{position: absolute;top: 15px;left: 3px;font-size: 14px;color: red;} #wpforms-272 .wpforms-field{width:100%; margin-bottom:10px; padding-bottom:20px; background:transparent; overflow:hidden} #wpforms-272 .wpforms-field:nth-child(1){margin-right:20px} #wpforms-272 .wpforms-field:nth-child(1), #wpforms-272 .wpforms-field:nth-child(2){width:calc(50% - 10px)} #wpforms-272 input{height:var(--input_height)} #wpforms-272 textarea{min-height:100px} #wpforms-272 input, #wpforms-272 textarea{width:100%;border: 0; max-width:100%!important; font-size:var(--input_font_size);border-radius: 10px;background-color: white; color:#222; box-sizing:border-box; line-height:var(--input_height); padding:0 10px} #wpforms-272 input::-webkit-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 input::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 input::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 input::-ms-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 textarea::-webkit-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 textarea::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 textarea::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 textarea::-ms-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-272 #wpforms-272-field_1-error, #wpforms-272 #wpforms-272-field_2-error, #wpforms-272 #wpforms-272-field_3-error, #wpforms-272 #wpforms-272-field_4-error{position:absolute; font-size:14px} #wpforms-272 .wpforms-submit-container button{overflow: hidden;border-radius: 20px; width:100%; height:var(--input_height); font-size:16px; color:#FFF; line-height:var(--input_height); cursor:pointer; text-transform:uppercase; position:relative; z-index:2} #wpforms-272 .wpforms-submit-container img{position:absolute; top:50%; transform:translate(0,-50%); right:4px} .close{position:absolute; top:0; right:0; display:block; width:50px; height:50px; background:url(static/imgs/close_1_hei.svg) no-repeat center; background-size:contain} .close:hover{-webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); transform:rotate(180deg)} .close{-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease} #wpforms-272 .wpforms-submit-container:hover{background-color: var(--i_color2);animation: a 0.5s 1 linear;animation-delay: 0.01s;} @media screen and (max-width:1200px){ .aside_right a{width:42px; height:42px} .aside_right em{width:18px; height:18px} } @media screen and (max-width:959px){ /* .aside_right{display:none} */ #aside_sc_from {width: 80%;} } @media screen and (max-width:767px){ #aside_sc_from{padding: 40px 20px;} .Machinery_brand h2#aside_sc_from .tit h2{font-size: 20px;} } @media screen and (max-width:560px){ .aside_right{display: none;} #aside_sc_from {width: 87%;} } /* 移close动端底部 */ .footer_phone_show{display: none;} .footer_phone{position: fixed;bottom: 0;left: 0;width: 100%;background-color: white;z-index: 999;} .footer_phone{width: 100%;display: flex;display: -webkit-flex;flex-direction: row;} .footer_phone li{width: 50%;padding: 13px;border-right: 1px solid rgba(211,211,211,1);border-top: 1px solid rgba(211,211,211,1);} .footer_phone li:nth-child(3){border-right: 0px;} .footer_phone a{display: block;width: 100%;display: flex;display: -webkit-flex;justify-content: center;} .footer_phone iconify-icon {font-size: 23px;} .footer_phone p{font-size: 25px;color: #333333;font-family: Arial;line-height: 23px;margin-left: 10px;} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ } @media screen and (max-width:1024px){ .footer_phone_show{display: block; height: 50px;} } @media screen and (max-width:768px){ .footer_phone p{font-size: 18px;} .footer_max_area{padding: 20px 0;} .footer_max_area a{font-size: 16px;} } @media screen and (max-width:560px){ .footer_max_area{padding: 20px 0; justify-content: center;} } @media screen and (max-width:407px){ .footer_phone p{font-size: 14px;} .footer_max_area{padding: 10px 0;} } @media screen and (max-width:393px){ .footer_max_area{padding: 10px 0;} .Machinery_brand h2#aside_sc_from .tit h2{ font-size: 20px; } .close { top: 0; right: 0; } } /* ---------------------about ---------------------------------*/ .aboutbanner{position: relative;} .aboutbanner_img{ position: relative; width: 100%; overflow: hidden; } .aboutbanner_img img{width: 100vw;max-height: 560px;object-fit: cover;} .i_about_text{ position: absolute; top: 50%; left: 11%; transform: translateY(-50%); color: #fff; font-size: 36px; text-transform: uppercase; } .mianbaoxie{margin-top: 5px; gap: 0 5px; display: flex; padding-left: 5px;} .mianbaoxie a{display: flex; align-items: center;} .mianbaoxie a>span{font-size: 18px; text-transform: lowercase; color: #fff; line-height: 20px;} .mianbaoxie i{font-size: 18px; text-transform: lowercase;} .mianbaoxie a>span:hover{color: var(--i_color);} /* about_us */ .about_us{ box-sizing: border-box; padding: 100px 0; display: flex; display: -webkit-flex; flex-wrap: wrap; align-items: flex-end; } .about_us_left{ width: 50%; } .about_us_left h2{ line-height: 48px; font-size: 36px; box-sizing: border-box; position: relative; font-weight: bolder; } .about_us_left h3{width: 8%; height: 4px; background-color: var(--i_color); margin: 10px 0 20px 0;} .about_us_left span{font-size: 18px; line-height: 18px; color: #666666;} /* .about_us_left h2::after{ content: ''; position: absolute; display: block; width: 60px; height: 60px; top: 0%; left: 0%; transform: translate(0%,0%); background: linear-gradient(104deg, rgba(129,255,255,1) 0%, rgba(129,255,255,0) 85%); clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%); z-index: -1; */ /* } */ .about_us_text{ display: flex; display: -webkit-flex; flex-direction: column; gap: 30px 0; } .about_us_text p{ font-size: 18px; line-height: 31px; color: #333; margin-top: 15px; } .about_us_right{ width: 50%; box-sizing: border-box; padding-left: 20px; } .about_us_right img{ width: 100%; } .about_us_ul{ display: flex; display: -webkit-flex; flex-wrap: wrap; justify-content: space-between; box-sizing: border-box; padding-bottom: 100px; } .about_us_ul li{ } .about_us_ul li h3{ font-size: 60px; color: var(--i_color); font-weight: bold; } .about_us_ul li h4{ display: inline-block; text-align: center; font-size: 16px; color: #1A1919; } .about_us_ul .roll_num_list{display: flex;} .about_us_ul .roll_num_list>h3{ font-size: 60px; color: var(--i_color); font-weight: bold; } .about_us_ul .roll_num_list>span{ font-size: 60px; color: var(--i_color); font-weight: bold; } @media screen and (max-width:1600px) { } @media screen and (max-width:1440px) { .i_about_text p{font-size: 30px;} .mianbaoxie a>span{font-size: 18px;} .i_about_text{left: 5%;} .about_us_left h2{font-size: 32px;} .about_us_text p {font-size: 16px;line-height: 25px;} .about_us_text {gap: 20px 0;} .about_us {padding: 80px 0;} .about_us_ul {padding-bottom: 80px;} } @media screen and (max-width:1366px) { } @media screen and (max-width:1200px) { .about_us_left h2{font-size: 28px;} .about_us {padding: 60px 0;} .about_us_ul {padding-bottom: 60px;} } @media screen and (max-width:1024px) { .about_us_ul .roll_num_list>h3{font-size: 40px;} .about_us_ul .roll_num_list>span{font-size: 40px;} .i_about_text p{font-size: 24px;} .mianbaoxie a>span{font-size: 18px;} } @media screen and (max-width:960px) { .about_us_left h2{font-size: 24px;} .about_us_left {width: 100%;margin-bottom: 40px;} .about_us_text p {font-size: 14px;line-height: 24px;} .about_us_right {width: 70%;padding-left: 0;margin: 0 auto;} .about_us_left h2 br{display: none;} .about_us_ul li h3 {font-size: 40px;} } @media screen and (max-width:767px) { .about_us_left h2{line-height: 40px;} .i_about_text p{font-size: 20px;} .mianbaoxie a>span{font-size: 14px;} .about_us_right {width: 90%;} .about_us_ul li h4 {font-size: 14px;} .about_us_ul li{width: 50%;} .about_us_ul{gap: 20px 0;} .about_us {padding: 40px 0;} } @media screen and (max-width:560px) { .i_about_text p{font-size: 18px;} .mianbaoxie a>span{font-size: 12px;} .about_us_right {width: 100%;} .i_about_text{left: 5%;} } @media screen and (max-width:425px) { } /* about_advantage */ .about_advantage_area{ background-image: url(./static/imgs/displaybackground.webp); box-sizing: border-box; background-size: cover; padding: 30px 0 90px 0; } .about_advantage{ } .about_advantage .title_img img{ background-color: #EAF8FF; } .about_advantage_all{ display: flex; display: -webkit-flex; flex-wrap: wrap; box-sizing: border-box; } .about_advantage_left{ width: 46.5%; } .about_advantage_right{ width: 53.5%; } .about_advantage_tp{ display: flex; display: -webkit-flex; justify-content: space-between; } .about_advantage_tp>div{ width: 100%; } .about_advantage_img{ position: relative; overflow: hidden; } .about_advantage_img::after{ content: ''; display: block; padding-bottom: 95%; } .about_advantage_img img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; object-fit: cover; } .about_advantage_right{ box-sizing: border-box; padding-left: 4%; } .about_advantage_right li{ box-sizing: border-box; padding: 35px 3%; border-radius: 30px; overflow: hidden; cursor: pointer; } .about_advantage_right li h2{ font-size: 22px; color: #FADB14; text-transform: uppercase; margin-bottom: 5px; line-height: 22px; } .about_advantage_right li h3{ font-size: 20px; line-height: 32px; color: #fff; } .about_advantage_right .current{ background-color:var(--i_color); } .about_advantage_right .current h2,.about_advantage_right .current h3{ color: #222222; } .titles p{color: #fff; font-size: 40px; line-height: 70px; display: inline-block;} .titles{margin-top: 55px; padding: 10px 0; position: relative; margin-bottom: 50px;} .titles h2{height: 4px; width: 5%; background-color: #FADB14;} .titles span{color: #fff; font-size: 18px; line-height: 70px;} @media screen and (max-width:1600px) { } @media screen and (max-width:1440px) { .about_advantage_right li h2 {font-size: 22px;} .about_advantage_right li {padding: 35px 3%} } @media screen and (max-width:1366px) { } @media screen and (max-width:1200px) { } @media screen and (max-width:1024px) { } @media screen and (max-width:960px) { .titles{margin-bottom: 40px;} .titles p{font-size: 30px;} .titles span{font-size: 14px; line-height: 40px; } .about_advantage_left {width: 60%;margin: 0 auto; margin-bottom: 20px;} .about_advantage_right {width: 100%;padding-left: 0%;} } @media screen and (max-width:767px) { .about_advantage_right li h2{font-size: 20px;} .about_advantage_area{padding: 30px 0 20px 0;} .titles{margin-top: 0;margin-bottom: 40px;} .about_advantage_right li{padding: 25px 3%;} .about_advantage_right li h3{font-size: 14px; line-height: 20px;} .titles p{font-size: 24px;} .about_advantage_left {width: 80%;} .titles span{font-size: 14px; line-height: 20px; } } @media screen and (max-width:560px) { .map{margin-bottom: -10px;} .about_advantage_left {width: 100%;} } @media screen and (max-width:425px) { .Company_Display{padding-top: 0;} } /* contact_us */ .map{padding-top: 80px; position: relative; background-color: #fff; margin-bottom: -70px;height: 767px;} .map iframe { width: 100%; height: 100% !important; } .contact_us{background-color: #fff; padding-bottom: 70px;} .contact_us h1{ text-align: center; margin-bottom: 10px; font-weight: bolder; font-size: 40px; } .contact_us h2{ margin: auto; width: 2%; height: 4px; background-color: var(--i_color); text-align: center; } .contact_us_lists{ gap: 0 8px; display: flex; } .contact_us_lists li{ align-items: center; padding:20px 0 20px 34px; display: flex; width: 33%; background-color: #F3F3F3; } .contact_us_lists li .cion_contact{width: 14%; height: 77%; display: flex;align-items: center;justify-content: center; background-color: var(--i_color);} .contact_us_lists li .cion_contact iconify-icon{font-size: 20px;} .contact_us_lists li>a{ width: 86%; } .contact_us_lists{margin-top: 30px;} .contact_us_lists li>a>p{ box-sizing: border-box; font-size: 16px; line-height: 28px; margin-left: 24px; } /* .contact_us_lists li:nth-child(1){ width: 28%; } .contact_us_lists li:nth-child(2){ width: 28%; } .contact_us_lists li:nth-child(3){ width: 36%; } */ @media screen and (max-width:1440px) { } @media screen and (max-width:1366px) { .contact_us_lists li .cion_contact{ width: 13%; height: 59%; } .contact_us_lists li>a>p{ font-size: 14px; } } @media screen and (max-width:1288px) { .contact_us_lists li .cion_contact { height:58%; } .contact_us_lists li>a>p{ font-size: 12px; } } @media screen and (max-width:1152px) { .contact_us_lists li .cion_contact { width: 16%; } .contact_us_lists li>a>p{ line-height: 20px; } } @media screen and (max-width:960px) { .contact_us h1{font-size: 30px;} .contact_us_lists li{padding-left: 19px;} } @media screen and (max-width:767px) { .contact_us h1{font-size: 24px;} .contact_us_lists li>a>p{font-size: 14px;} .contact_us{padding-bottom: 20px;} .contact_us_lists{flex-wrap: wrap; gap: 10px 0;} .contact_us_lists li{width: 100%; height: 120px;} } @media screen and (max-width:560px) { .map{margin-bottom: -31px;} .contact_us_lists li{width: 100%; height: 100px;} .contact_us_lists li .cion_contact{width: 12%;} } @media screen and (max-width:425px) { .contact_us_lists li{width: 100%; height: 80px;} .contact_us_lists li .cion_contact{width: 12%;} } /* ---------------------new------------------------ */ /* News */ /* inpage title */ .in_tit { margin-bottom: 40px; } .in_tit h2 { font-size: 36px; color: #333; font-weight: bold; } .in_tit h3{margin: auto; width: 2%; height: 4px; background-color: var(--i_color);} .in_tit h6 { margin-top: 10px; font-size: 18px; color: #333; } .in_tit_c { padding-top: 40px; text-align: center; } @media screen and (max-width:1440px) { .in_tit h2 { font-size: 34px; } } @media screen and (max-width:1366px) { .in_tit h2 { font-size: 32px; } } @media screen and (max-width:1200px) { .in_tit h2 { font-size: 30px; } .in_tit h6 { font-size: 17px; } } @media screen and (max-width:1024px) { .in_tit { margin-bottom: 30px; } .in_tit h2 { font-size: 26px; } .in_tit h6 { font-size: 16px; } } @media screen and (max-width:768px) { .in_tit h2 { font-size: 22px; } .in_tit h6 { font-size: 15px; } } @media screen and (max-width:560px) { .in_tit h2 { font-size: 18px; } .in_tit h6 { font-size: 14px; } } .in_n_list {} .in_n_list li { padding: 36px 0; border-bottom: 1px solid #CCC; } .in_n_list li:first-child { border-top: 1px solid #CCC; } .in_n_list a { display: -webkit-flex; display: flex; flex-wrap: nowrap; align-items: center; } .in_n_list .img { width: 18%; position: relative; flex-shrink: 0; overflow: hidden } .in_n_list .img::before { content: ""; display: block; padding-bottom: 90% } .in_n_list .img::after { content: ''; position: absolute; right: 0; bottom: -10%; width: 100%; height: 10%; background: var(--i_color2); -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%); clip-path: polygon(100% 0, 0% 100%, 100% 100%); -webkit-transition: all .5s ease; transition: all .5s ease } .in_n_list .img img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover } .in_n_list .txt { margin-left: 50px; } .in_n_list h5 { font-size: 24px; color: #333; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .in_n_list h6 { margin: 30px 0; font-size: 18px; color: #333; line-height: 30px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .in_n_list i { font-size: 16px; color: #333; } .in_n_list a:hover .img::after { bottom: 0; } .in_n_list a:hover h5 { color: var(--i_color); font-weight: bold; } @media screen and (max-width:1440px) {} @media screen and (max-width:1366px) {} @media screen and (max-width:1200px) {} @media screen and (max-width:1024px) { .in_n_list li { padding: 26px 0; } .in_n_list .txt { margin-left: 40px; } .in_n_list h5 { font-size: 20px; } .in_n_list h6 { margin: 20px 0; font-size: 15px; line-height: 24px; } .in_n_list i { font-size: 15px; } } @media screen and (max-width:768px) { .in_n_list li { padding: 20px 0; } .in_n_list .img { width: 130px; } .in_n_list .txt { margin-left: 30px; } .in_n_list h5 { font-size: 17px; -webkit-line-clamp: 3 } .in_n_list h6 { margin: 10px 0; line-height: 18px; -webkit-line-clamp: 1 } .in_n_list h6, .in_n_list i { font-size: 14px; color: #777; } } @media screen and (max-width:560px) { .in_n_list h5 { font-size: 16px; } } /* Number of pages */ .in_page_box { margin-top: 60px; text-align: center; overflow: hidden } .in_page { display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } .in_page li { min-width: 32px; margin: 0 4px; } .in_page a, .in_page span { display: block; padding: 0 12px; line-height: 32px; font-size: 14px; color: #666; background: #FFF; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; border: 1px solid var(--border_color); overflow: hidden; } .in_page>i { margin-top: 14px; width: 100%; font-size: 13px; color: #888; } .in_page a:hover, .in_page .active_page a, .in_page .active_page span { border-color: var(--i_color) !important; background: var(--i_color); color: #FFF !important } @media screen and (max-width:1024px) { .in_page_box { margin-top: 40px; } } @media screen and (max-width:768px) { .in_page li { min-width: 28px; } .in_page a, .in_page span { line-height: 28px; padding: 0 10px; } } @media screen and (max-width:560px) { .in_page_box { margin-top: 30px; } } /* ---------------contact------------------- */ /* contact us */ .in_contact {background-color: #fff;} .contact_cont { display: -webkit-flex; display: flex; flex-wrap: wrap; } .contact_cont>.c_list { width: 42%; gap: 10px 0; } .c_list li { box-sizing: border-box; padding: 30px; background: #F3F3F3; display: -webkit-flex; display: flex; flex-wrap: nowrap; } .c_list li:not(:last-child) { margin-bottom: 58px; } .c_list .ico { width: 64px; height: 64px; background: var(--i_color); position: relative; flex-shrink: 0; } .c_list .ico i { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 30px; color: #FFF; } .c_list span { margin-left: 28px; } .c_list span p { margin-bottom: 8px; font-size: 18px; color: #333; } .c_list span a, .c_list span h5 { font-size: 22px; color: #333; line-height: 31px; } .c_form { width: 56.5%; margin-left: auto; box-sizing: border-box; padding: 40px; background: #F3F3F3; } #wpforms-277 { --input_font_size: 18px; --input_height: 50px } #wpforms-form-277 { width: 100%; position: relative; overflow: hidden } #wpforms-277 input, #wpforms-277 button { margin: 0; padding: 0; border: none; background: none } #wpforms-277 .wpforms-field { padding: 0; margin: 0 } #wpforms-277 .wpforms-field-label { font-size: 0; } #wpforms-277 .wpforms-required-label { position: absolute; top: 20px; left: 5px; font-size: 16px; color: #F00 } #wpforms-277 .wpforms-field { width: 100%; background: transparent; padding-bottom: 26px; position: relative; overflow: hidden } #wpforms-277 .wpforms-field-container input, #wpforms-277 textarea { width: 100%; max-width: 100% !important; min-width: 100%; font-size: var(--input_font_size); color: #333; height: var(--input_height); background: #FFF; padding: 0 16px; overflow: hidden; -webkit-transition: all .5s ease; transition: all .5s ease } #wpforms-277 .wpforms-field-container input:hover, #wpforms-277 textarea:hover { border-color: var(--i_color); } #wpforms-277 input { line-height: var(--input_height) } #wpforms-277 textarea { line-height: 22px; min-height: 100px; padding: 6px 16px } #wpforms-277 input::-webkit-input-placeholder, #wpforms-277 textarea::-webkit-input-placeholder { color: rgb(0 0 0 / 40%); font-size: var(--input_font_size) } #wpforms-277 input::-moz-placeholder, #wpforms-277 textarea::-moz-placeholder { color: rgb(0 0 0 / 40%); font-size: var(--input_font_size) } #wpforms-277 input::-ms-input-placeholder, #wpforms-277 textarea::-ms-input-placeholder { color: rgb(0 0 0 / 40%); font-size: var(--input_font_size) } #wpforms-277-field_1-error, #wpforms-277-field_2-error, #wpforms-277-field_3-error, #wpforms-277-field_4-error, #wpforms-277-field_5-error, #wpforms-277-field_6-error { position: absolute; font-size: 12px; color: #A90909; } #wpforms-277 .wpforms-field-container { width: 100%; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; overflow: hidden } #wpforms-277 .wpforms-submit-container { width: 220px; text-align: center; padding: 0; margin-top: 20px; overflow: hidden; position: relative; } #wpforms-277 .wpforms-submit-container button { width: 100%; height: 46px; font-size: 18px; color: #222; line-height: 46px; background: var(--i_color); cursor: pointer; position: relative; z-index: 2 } /* #wpforms-277 .wpforms-submit-container button:hover { background: var(--i_color2) } */ #wpforms-277 .wpforms-submit-container iconify-icon{ font-size: 30px; position: absolute; top: 50%; transform: translate(0, -50%); right: 20px; z-index: 2; } @media screen and (max-width:1366px) { .c_list span a, .c_list span h5{font-size: 18px;} } @media screen and (max-width:1024px) { .contact_cont>.c_list {width: 100%;} .c_list .ico{width: 50px;height: 50px;} .c_list .ico i{font-size: 24px;} .c_list span p{font-size: 16px;} .c_list span a, .c_list span h5{font-size: 17px;} .c_list li:not(:last-child){margin-bottom: 16px;} .c_form{width: 100%;margin-top: 20px;padding: 30px;} #wpforms-277 { --input_font_size: 16px; --input_height: 40px } #wpforms-277 .wpforms-submit-container{width: 180px;} #wpforms-277 .wpforms-submit-container button{font-size: 15px;height: 40px;line-height: 40px;} } @media screen and (max-width:768px) { .c_list li{padding: 20px;} .c_form{padding: 30px 20px;} } @media screen and (max-width:560px) { .c_list li:not(:last-child){margin-bottom: 10px;} .c_list .ico{width: 40px;height: 40px;} .c_list .ico i{font-size: 18px;} .c_list span{margin-left: 20px;} .c_list span p{font-size: 15px;} .c_list span a, .c_list span h5{font-size: 15px;line-height: 20px;} #wpforms-277 .wpforms-submit-container button{font-size: 14px;} } /* -----------------------Excavators------------------------ */ .zs_log{padding: 38px 0 42px 0; width: 100%;} .zs_log_list{display: flex; gap: 0 5px; width: 100%;} .zs_log_list li{width: 13%; display: flex; align-self: center; justify-content: center;} .zs_log_list li>a>img{width: 100%; height: 100%;} @media screen and (max-width:1440px) { } @media screen and (max-width:1366px) { } @media screen and (max-width:1200px) { .zs_log_list{display: flex; gap: 0 15px; width: 100%;} } @media screen and (max-width:1366px) { } @media screen and (max-width:978px) { .zs_log_list{display: flex; gap: 0 5px; width: 100%;} } @media screen and (max-width:800px) { .zs_log_list li{width: 23%; margin-bottom: 10px;} .zs_log_list{flex-wrap: wrap;} .zs_log_list{gap: 0 18px;} .zs_log{padding: 30px 0;} } @media screen and (max-width:680px) { .zs_log_list{flex-wrap: wrap; } .zs_log_list li{width: 24%;} .zs_log_list li{margin-bottom: 10px;} .zs_log_list{display: flex; gap: 0 18px; width: 100%;} } @media screen and (max-width:460px) { .zs_log_list li>a>img{width: 90%;} .zs_log {padding: 20px 0;} .zs_log_list{display: flex; gap: 0 5px; width: 100%;} } @media screen and (max-width:393px) { .zs_log_list li{margin-bottom: 10px;} .zs_log_list{gap: 0 4px;} .zs_log {padding: 25px 0;} } .m_products_bac{background-color: #fff;} .products_bac{box-sizing: border-box;text-align: center;} .m_title{width: 100%; padding-top: 40px;} .m_title>p{font-size: 40px; line-height: 70px; font-weight: bolder;} .m_title h3{width: 5%; height: 4px; background-color: var(--i_color); margin: auto;} .m_title span{font-size: 18px; line-height: 70px;} /* products_list */ .products_list{display: flex;flex-wrap: wrap;gap: 50px 20px;margin-top: 20px;margin-bottom: 100px;} .products_list li{width: calc((100% - 60px) / 4);background: #EAEAEA;} .products_list li a{display: block;width: 100%; position: relative;} .products_list_img{position: relative;overflow: hidden;} .products_list_img::after{content: '';display: block;padding-bottom: 85%;} .products_list_img img{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 100%;height: 100%;object-fit: cover;} .products_list_text{background-color: #EAEAEA;box-sizing: border-box;padding: 12px 3% 12px 3%;transition: all 0.3s ease; width: 100%;} .products_list_text h2{font-size: 18px;color: #222;transition: all 0.3s ease;text-align: center;} .products_list li:hover .products_list_text{background-color: var(--i_color);} .products_list li:hover h3,.products_list li:hover h3 span{color:white ;} @media screen and (max-width:1440px){ .products_list_text {padding: 10px 3% 15px 3%;} } @media screen and (max-width:1200px){ .products_bac{padding: 0 0 80px} } @media screen and (max-width:1024px){ .products_list_text h2{font-size: 16px;} .m_title>p{font-size: 30px;} .m_title span p{font-size: 16px; line-height: 50px;} .products_list {gap: 40px 20px;margin-top: 30px;margin-bottom: 80px;} } @media screen and (max-width:959px){ .products_list_text h2{font-size: 14px;} .products_dl dt {width: calc((100% - 30px) / 4);} /* .products_bac{padding: 60px 0;} */ } @media screen and (max-width:767px){ .products_bac{padding: 0 0;} .products_list li {width: calc((100% - 20px) / 2);} .products_list {margin-top: 40px;margin-bottom: 40px;} .products_dl dt {width: calc((100% - 10px) / 2);} .m_products_bac .m_title{padding-top: 20px;} .m_title>p{font-size: 20px; line-height: 20px; line-height: 40px;} .m_title span p{font-size: 14px; line-height: 24px;} .products_list_text h2{font-size: 14px;} .products_list_text {padding: 10px 3%;} } @media screen and (max-width:393px){ .products_list_text h2{font-size: 12px;} } /* 页数 */ /* Number of pages */ .in_page_box {text-align: center;overflow: hidden;margin-top: 0px;} .in_page {display: -webkit-flex;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;} .in_page li {margin: 0 4px;} .in_page a,.in_page span {display: block;padding: 0 17px;line-height: 40px;font-size: 14px;border-radius: 50%;color: #666;overflow: hidden;transition: all 0.3s ease;border: 1px solid rgba(51, 51, 51, 0.3);} .in_page li{margin:0 4px;} .in_page>i {margin-left: 10px;font-size: 0px;color: #888;} .in_page a:hover,.in_page .active_page a,.in_page .active_page span {background: var(--i_color);color: #fff !important} @media screen and (max-width:1024px) { .in_page a,.in_page span {padding: 0 15px;line-height: 35px;font-size: 14px;border-radius: 30px;} .in_page_box {margin-top: 0px;} } @media screen and (max-width:767px) { .in_page>i {display: block;width: 100%;margin-top: 10px;font-size: 0px;} } /*------------------------------product detail --------------------------------*/ .in_det_all{background-color: #fff; padding-top: 50px;} .in_det { --img_size: 600px } .in_det { padding-bottom: 80px; display: flex; position: relative; overflow: hidden } /* 轮播图 */ .products_pic_list { width: var(--img_size); overflow: hidden; position: relative } .gallery-top { margin-bottom: 20px; box-sizing: border-box; overflow: hidden; position: relative } .gallery-top .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex } .gallery-top .swiper-slide { flex-shrink: 0; position: relative; cursor: pointer; overflow: hidden } .gallery-top .swiper-slide:before { content: ""; display: block; padding-bottom: 75% } .gallery-top .swiper-slide img { position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%); /* width: 100%; */ height: 100%; object-fit: contain } .pro_slt { margin-top: 70px; position: relative } .gallery-thumbs { width: calc(100% - 80px); margin: 0 auto; overflow: hidden } .gallery-thumbs .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; cursor: pointer; display: flex } .gallery-thumbs .swiper-slide { box-sizing: border-box; border: 1px solid #ccc; flex-shrink: 0; position: relative; overflow: hidden } .gallery-thumbs .swiper-slide:before { content: ""; display: block; padding-bottom: 94% } .gallery-thumbs .swiper-slide-thumb-active { border-color: #0C3F9B } .gallery-thumbs .swiper-slide img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; object-fit: contain } /* 左右箭头 */ .ppl-button-prev, .ppl-button-next { position: absolute; bottom: 0; width: 30px; height: 100%; z-index: 999; outline: none; cursor: pointer; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; -khtml-user-select: none; user-select: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .ppl-button-prev { left: 0; background: url(static/images//public/arrow_left_hollow_hei.svg) no-repeat center; background-size: 22px } .ppl-button-next { right: 0; background: url(static/images//public/arrow_right_hollow_hei.svg) no-repeat center; background-size: 22px } .products_pic_list .swiper-button-disabled { opacity: .3; cursor: not-allowed } .single_grid_right{width: 55%;box-sizing: border-box;padding-left: 6%;} .single_grid_right h1{font-size: 30px;color: #222;font-weight: bold;text-transform: uppercase;padding: 20px 0;border-bottom: 1px solid #d6d6d6;} .single_grid_right .grid_detail{padding: 4% 0 4% 0;font-size: 18px; color: #333;line-height: 150%; border-bottom: 1px solid #d6d6d6; } .single_grid_right .grid_detail>p{font-size: 18px; line-height: 36px;} .single_grid_right .grid_dl{display:-webkit-flex;display:flex;flex-shrink:0;position:relative;cursor:pointer;text-align: center; margin-bottom: 4%;} .grid_dl dt{width: 33.3%;background-color: #333333;padding: 3% 1%;margin-right: 2%;} .grid_dl dt:last-child{margin-right: 0;} .grid_dl dt p{font-size: 16px;color: #fff;line-height: 160%;} .single_right_btn{margin: 30px 0;} .single_right_btn a{display: inline-block;font-size: 18px;color: #222;box-sizing: border-box;padding: 13.5px 45px;border-radius: 40px;border: 1px solid #d6d6d6;margin-right: 30px;transition: all 0.3s ease;} .single_right_btn a:hover{background-color: var(--i_color);color: white;} .single_right_tag{display: flex;display: -webkit-flex;flex-wrap: wrap;margin-bottom: 20px;} .single_right_tag p{font-size: 18px;color: #222;font-weight: bold;} .single_right_tag a{font-size: 18px;color: #666666;margin-left: 15px;text-transform: capitalize;transition: all 0.3s ease;} .single_right_tag a:hover{color: var(--i_color);} .single_right_share{display: flex;display: -webkit-flex;align-items: center;} .single_right_share p{font-size: 18px;color: #222;display: inline-block;font-weight: bold;} .single_share_ul{display: flex;display: -webkit-flex;} .single_share_ul li{margin-left: 18px;} .single_share_ul li a{display: block;width: 100%;} .single_share_ul li a iconify-icon{font-size: 30px;color: #D8D8D8;transition: all 0.3s ease;} .single_share_ul li a iconify-icon :hover{color: var(--i_color);transform: translateY(-5px);} @media screen and (max-width:1365px) { .single_grid_right {padding-left: 4%;} .single_grid_right .grid_detail {padding: 4% 0;} .grid_dl dt h4 {font-size: 18px;} .single_grid_right h1{font-size: 24px;} .single_grid_right .grid_detail{font-size: 16px;} } @media screen and (max-width:1042px) { .grid_dl dt h4 {font-size: 20px;} .single_right_btn a{padding: 13.5px 25px; margin-right: 15px;} } @media screen and (max-width:961px) { .in_det{margin-bottom: 40px;} .single_grid_right h1{font-size: 20px;} .single_share_ul li a iconify-icon{font-size: 24px;} .products_pic_list{margin: auto;} .in_det{flex-wrap: wrap;} .single_grid_right {width: 100%;padding-left: 0%;} .single_grid {justify-content: center;} .single_grid_left {width: 50%;} } @media screen and (max-width:767px) { .in_det{margin-bottom: 0;} .single_grid_left {width: 80%;} } @media screen and (max-width:560px) { .single_right_btn a {margin-right: 20px;} .single_grid_left {width: 100%;} .grid_dl dt h4 {font-size: 18px;} } @media screen and (max-width:450px) { .single_right_btn a {margin-right: 20px; padding: 13.5px 20px;} .single_grid_left {width: 100%;} } /* Introduction */ .Introduction_all{background-color: #fff;} .Related_all{margin-bottom: 80px; background-color: #fff;} .Introduction{border-bottom: 1px solid #ccc; margin-bottom: 38px;} .Introduction_left{width: 230px; } .Introduction_left p{font-size: 20px; padding: 15px 35px; background-color: var(--i_color); border-radius: 0 30px 0 0 ; text-transform: uppercase; font-weight: bolder;} .Introduction_text p{font-size: 16px; line-height: 32px; padding-bottom: 20px;} .Introduction_text_list{display: flex; flex-wrap: wrap; gap: 10px 30px; margin-top: 20px;} .Introduction_text_list li{ width: 49%; } .Introduction_text_list li>a>img{ width: 100%; } @media screen and (max-width:1440px){ .Introduction_text_list{gap: 10px 26px;} .Introduction_left p{font-size: 16px; padding: 15px 25px;} } @media screen and (max-width:860px){ .Introduction_left{width: 180px;} } @media screen and (max-width:680px){ .Related_all{margin-bottom: 20px;} .Introduction_left p{font-size: 15px; padding: 10px 25px;} } @media screen and (max-width:542px){ .Introduction_text_list{gap: 10px 6px;} } .Related_products{padding-top: 80px;} .Introduction_lefts{width: 300px;} .Introduction_lefts p{font-size: 20px; padding: 15px 35px; background-color: var(--i_color); border-radius: 0 30px 0 0 ; text-transform: uppercase; font-weight: bolder;} .in_ce_list { width: 100%; position: relative; overflow: hidden } .in_ce_list .swiper-wrapper { display: -webkit-flex; display: flex; position: relative; width: 100% } .in_ce_list .swiper-slide { cursor: pointer; width: 100%; position: relative; overflow: hidden; background: #EAEAEA; flex-shrink: 0; } .in_ce_list .swiper-slide a{display: block;width: 100%;} .in_ce_list .swiper-slide>a>.imgs{width: 100%;position: relative;overflow: hidden;z-index: 2;} .in_ce_list .swiper-slide>a>.imgs::before { content: ""; display: block; padding-bottom: 89% } .in_ce_list .swiper-slide img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; transform: translate(-50%,-50%); object-fit: cover; transition: all 0.3s ease; z-index: -1; } .in_ce_list .swiper-wrapper>li>a>p{ padding: 6px 0; font-size: 18px; text-align: center; width: 100%; background-color: #EAEAEA; cursor: pointer; } .in_ce_list .swiper-wrapper li:hover p{background-color: var(--i_color);} @media screen and (max-width:1200px){ .in_ce_list .swiper-wrapper>li>p{line-height: 37px;} } @media screen and (max-width:970px){ .Introduction_lefts {width: 230px;} .Introduction_lefts p{font-size: 16px; padding: 10px 20px;} .Related_products{margin-top: 40px;} .in_ce_list .swiper-wrapper>li>p{line-height: 37px; font-size: 14px;} } @media screen and (max-width:680px){ .in_ce_list .swiper-wrapper>li>a>p{line-height: 15px; font-size: 14px;} .Related_products{margin-top: 20px; padding-top: 20px;} .in_ce_list .swiper-wrapper>li>p{line-height: 37px; font-size: 12px;} } @media screen and (max-width:560px){ .in_ce_list .swiper-wrapper>li>p{line-height: 27px; font-size: 12px;} } /* -------------------single new------------------------ */ .banner_top{margin-top: calc(var(--header_height) + var(--header_top)) ;} /* Article */ .in_news_art {box-sizing: border-box;padding: 60px 0;} .in_news_art_tit {border-bottom: 1px solid #DDD;margin-bottom: 30px;text-align: center;position: relative;} .in_news_art_tit h1 {margin-left: auto;margin-right: auto;font-size: 34px;font-weight: bold;} .n_tit_time {margin: 40px 0 26px;display: -webkit-flex;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;} .n_tit_time>p {font-size: 16px;color: #363636;margin-right: 28px;padding-right: 28px;position: relative;} .n_tit_time>p::before {content: '';position: absolute;top: 50%;transform: translate(0, -50%);right: 0;width: 1px;height: 10px;background: #AAA;} .n_share {display: -webkit-flex;display: flex;flex-wrap: wrap;align-items: center;} .n_share p {font-size: 16px;color: #363636;} .n_share a {margin-left: 20px;} .n_share a iconify-icon {font-size: 20px;} .n_share a:hover iconify-icon {color: var(--i_color);} @media screen and (max-width:1440px) { .in_news_art_tit h1 {font-size: 28px;} .n_tit_time {margin: 30px 0 26px;} } @media screen and (max-width:1200px) { .in_news_art_tit h1 {font-size: 24px;} } @media screen and (max-width:1024px) { .in_news_art_tit h1 {font-size: 22px;} .n_tit_time {margin: 20px 0 22px;} } @media screen and (max-width:768px) { .in_news_art_tit h1 {font-size: 18px;} .n_tit_time>p,.n_share p {font-size: 15px;} } @media screen and (max-width:560px) { .in_news_art_tit h1 {font-size: 17px;} .n_tit_time>p {margin-right: 14px;padding-right: 14px;} .n_tit_time>p,.n_share p {font-size: 14px;} .n_share a i {font-size: 18px;} } .n_navigation {margin-top: 80px;padding-top: 20px;border-top: 1px solid var(--border_color);display: -webkit-flex;display: flex;flex-wrap: wrap;align-items: center;} .n_navigation ul {width: 80%;} .n_navigation li {margin: 12px 0;} .n_navigation li a {display: -webkit-flex;display: flex;flex-wrap: nowrap;align-items: baseline;} .n_navigation li p {margin-right: 6px;font-size: 16px;color: #363636;font-weight: bold;transition: all 0.3s ease;} .n_navigation li a:hover p {color: var(--i_color);} .n_back {margin-left: auto;padding: 12px 30px;background: var(--i_color);-webkit-border-radius: 30px;border-radius: 30px;} .n_back i {font-size: 16px;color: #FFF;} .n_back b {margin-left: 6px;font-size: 15px;color: #FFF;font-weight: bold;} @media screen and (max-width:1024px) { .n_navigation ul {width: 76%;} .n_back b {font-size: 14px;} } @media screen and (max-width:768px) { .n_navigation {margin-top: 60px;} .n_navigation ul {width: 100%;} .n_navigation li p {font-size: 15px;} .n_back {margin:14px 0 0 0;} } @media screen and (max-width:560px) { .n_navigation {margin-top: 40px;} .n_navigation li p {font-size: 14px;} .n_back {padding: 8px 22px;margin: 10px 0 0 0;} .n_back i {font-size: 15px;} } /* -------------------thanks--------------- */ .thanks{padding-top: 100px; margin:0px auto 100px; text-align:center;box-sizing: border-box; } .thanks h2{margin-bottom:20px; font-size:30px; color:#222; font-weight:bold} .thanks a{z-index: 2; display: flex;display: -webkit-flex;justify-content: center; position: relative; transition: all 1s ease;} .btns {height: 4em;width: 12em;display: flex;align-items: center;justify-content: center;background: transparent;border: 0px solid black;cursor: pointer;} .btns:hover p{color: var(--i_color);} .wrapperss {height: 2em;width: 8em;position: relative;background: transparent;display: flex;justify-content: center;align-items: center;} .thanks .text {font-size: 17px;z-index: 1;color: #000;padding: 4px 12px;border-radius: 4px;background: rgba(255, 255, 255, 0.7);transition: all 0.5s ease;} .flower {display: grid;grid-template-columns: 1em 1em;position: absolute;transition: grid-template-columns 0.8s ease;} .flower1 {top: -12px;left: -13px;transform: rotate(5deg);} .flower2 {bottom: -5px;left: 8px;transform: rotate(35deg);} .flower3 {bottom: -15px;transform: rotate(0deg);} .flower4 {top: -14px;transform: rotate(15deg);} .flower5 {right: 11px;top: -3px;transform: rotate(25deg);} .flower6 {right: -15px;bottom: -15px;transform: rotate(30deg);} .petal {height: 1em;width: 1em;border-radius: 40% 70% / 7% 90%;background: linear-gradient(rgba(238,30,35,1), #fffcb3);border: 0.5px solid #fff;z-index: 0;transition: width 0.8s ease, height 0.8s ease;} .two {transform: rotate(90deg);} .three {transform: rotate(270deg);} .four {transform: rotate(180deg);} .btns:hover .petal {background: linear-gradient(#E870A5, #FFEFF6);border: 0.5px solid #FFEFF6;} .btns:hover .flower {grid-template-columns: 1.5em 1.5em;} .btns:hover .flower .petal { width: 1.5em; height: 1.5em; } .btns:hover .text { background: rgba(255, 255, 255, 0.4); } .btns:hover div.flower1 { animation: 15s linear 0s normal none infinite running flower1; } @keyframes flower1 { 0% { transform: rotate(5deg); } 100% { transform: rotate(365deg); } } .btns:hover div.flower2 { animation: 13s linear 1s normal none infinite running flower2; } @keyframes flower2 { 0% { transform: rotate(35deg); } 100% { transform: rotate(-325deg); } } .btns:hover div.flower3 { animation: 16s linear 1s normal none infinite running flower3; } @keyframes flower3 { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .btns:hover div.flower4 { animation: 17s linear 1s normal none infinite running flower4; } @keyframes flower4 { 0% { transform: rotate(15deg); } 100% { transform: rotate(375deg); } } .btns:hover div.flower5 { animation: 20s linear 1s normal none infinite running flower5; } @keyframes flower5 { 0% { transform: rotate(25deg); } 100% { transform: rotate(-335deg); } } .btns:hover div.flower6 { animation: 15s linear 1s normal none infinite running flower6; } @keyframes flower6 { 0% { transform: rotate(30deg); } 100% { transform: rotate(390deg); } } /* 当前位置 */ .in_position{padding:14px 0;} .in_position a{display:block; float:left; font-size:16px; color:#222; position:relative; line-height:20px; text-transform:uppercase} .in_position a:not(:last-child):after{content:">"; margin:0 4px; color:#222} .in_position a:last-child{color:var(--i_color)!important} .in_position a:hover{color:var(--i_color)} @media screen and (max-width:959px){ .in_position{padding:10px 0;} .in_position a{font-size:15px} } @media screen and (max-width:767px){ .in_position{padding:6px 0;} .in_position a{font-size:14px} } @media screen and (max-width:560px){ .in_position{padding:2px 0;} .in_position a{font-size:12px} } /* 隐私政策 */ /* 隐私政策 */ .privacy{margin-bottom: 100px;padding-top: 70px; background-color: #fff;} #header{background-color: rgb(0 0 0 / 57%) !important;} .privacy_cont ol{ list-style: none;} .privacy_cont .tit{margin-bottom:30px} .privacy_cont .tit h2{font-size:24px; text-align:center; font-weight:bold} .privacy_cont article, .privacy_cont article *{font-size:14px; color:#666; line-height:24px;margin: 0;} .foot {top: 130px;} .privacy ol {padding: 0px;} @media screen and (max-width:1200px){ .privacy{margin-bottom: 50px;} } @media screen and (max-width:959px){ .privacy{margin-bottom: 30px;} } .in_position_gray{ background-color: #f4f4f4; } .in_position_gray a{ color: #333; } .in_position_gray a:not(:last-child):after{ color: #333; } .banner_top{ margin-top:calc( var(--header_height) + var(--header_top)); } /* ---------------------search---------------- */ /* 搜索页 */ .search{background-color: white;} .in_search_tit{padding-bottom:70px; text-align:center;background-color: white;} .in_search_tit h2{font-size:34px; color:var(--i_color); font-weight:bold; text-transform:uppercase;padding-top: 40px;} .in_search_tit p{margin:16px 0; font-size:24px; color:#757575} .in_search{width:510px; margin:0 auto; border:1px solid #ccc; overflow:hidden} .in_search .search_ipt{float:left; box-sizing:border-box; padding-left:10px; width:calc(100% - 110px); font-size:15px; color:#333; line-height:46px} .in_search .search_btn{float:right; width:110px; height:46px; line-height:46px; background:var(--i_color); font-size:18px; color:#FFF;cursor: pointer;} input[type="text"]::placeholder { font-size: 16px; } @media screen and (max-width:1440px){ .in_search_tit{} .in_search_tit h2{font-size:32px} .in_search_tit p{font-size:22px} .pd_other li{width: 23%;margin-bottom: 60px;} } @media screen and (max-width:1366px){ .in_search_tit h2{font-size:28px} .in_search_tit p{font-size:20px} .in_search .search_btn{font-size:16px} } @media screen and (max-width:1200px){ .in_search_tit{padding-bottom:60px} .in_search_tit h2{font-size:26px} .in_search_tit p{margin:10px auto 16px; font-size:18px} .pd_other li{width: 23%;margin-bottom: 40px;} } @media screen and (max-width:959px){ .in_search_list li{margin-bottom:30px} .in_search_tit h2{font-size:24px} .in_search_tit p{font-size:17px} .pd_other li{width: 23%;margin-bottom: 20px;} } @media screen and (max-width:767px){ .in_search_tit{padding-bottom:40px} .in_search{width:90%} .in_search_tit h2{font-size:22px} .in_search_tit p{font-size:16px} } @media screen and (max-width:560px){ .in_search_tit{padding-bottom:34px} .in_search{width:94%} .in_search_tit h2{font-size:20px} .in_search_tit p{font-size:14px} .in_search .search_ipt{line-height:38px} .in_search .search_btn{height:38px; line-height:38px} } /* search results list */ .in_search_list { padding-bottom: 60px; overflow: hidden; } .in_search_list li { box-sizing: border-box; border: 1px solid var(--border_color); margin-bottom: 26px; } .in_search_list a { display: block; padding: 20px; } .in_search_list h2 { font-size: 18px; color: #212121; font-weight: bold; position: relative; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .in_search_list h6 { margin: 10px 0; font-size: 14px; color: #666; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .in_search_list i { display: inline-block; padding: 6px 10px; font-size: 13px; color: var(--i_color); background: #EDEDED; -webkit-border-radius: 4px; border-radius: 4px; } @media screen and (max-width:1024px) { .in_search_list h2 { font-size: 15px; white-space: initial; } .in_search_list h6 { font-size: 13px; } .in_search_list i { font-size: 12px; } } @media screen and (max-width:959px) {} @media screen and (max-width:767px) { .in_search_list li { margin-bottom: 20px; } } @media screen and (max-width:560px) { .in_search_list { padding-bottom: 30px } } /* 当前位置 */ .in_position{padding:14px 0;} .in_position a{display:block; float:left; font-size:16px; color:#fff; position:relative; line-height:20px; text-transform:uppercase} .in_position a:not(:last-child):after{content:">"; margin:0 4px; color:#fff} .in_position a:last-child{color:var(--i_color)!important} .in_position a:hover{color:var(--i_color)} @media screen and (max-width:959px){ .in_position{padding:10px 0;} .in_position a{font-size:15px} } @media screen and (max-width:767px){ .in_position{padding:6px 0;} .in_position a{font-size:14px} } @media screen and (max-width:560px){ .in_position{padding:2px 0;} .in_position a{font-size:12px} } .form_hide{ display: none !important; } /* 产品详情 表单 */ #aside_mask_bg1{display:none; position:fixed; top:0%; left:0%; width:100%; height:100%; background:rgba(0,0,0,.6); z-index:9999999999998} #aside_sc_from1{display:none; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); width:800px; padding:60px 40px;border-radius: 20px; background:#e2e2e2; z-index:9999999999999; overflow:auto} #aside_sc_from1 .tit{margin-bottom:40px} #aside_sc_from1 .tit h1{font-size:26px; color:#333; text-align: center;text-transform: uppercase; font-weight:bold; line-height:30px} #wpforms-269{--input_font_size:16px; --input_height:42px} #wpforms-269{width:100%; margin:0 auto; padding:0} #wpforms-form-269{width:100%; overflow:hidden} #wpforms-269 input, #wpforms-269 button{margin:0; padding:0; border:none; background:none} #wpforms-269 .wpforms-field{padding:0; margin:0} #wpforms-269 .wpforms-error-container{line-height:16px} #wpforms-269 .wpforms-field-container{width:100%; display:-webkit-flex; display:flex; flex-wrap:wrap; overflow:hidden} #wpforms-269 .wpforms-submit-container{padding:0!important; width:170px; height:var(--input_height); background:var(--i_color);border-radius: 20px; position:relative;margin:0 auto;} #wpforms-269 .wpforms-field{ position: relative; } #wpforms-269 .wpforms-field-label{ font-size: 0; } #wpforms-269 .wpforms-field-label span{ position: absolute; top: 15px; left: 3px; font-size: 14px; color: red; } #wpforms-269 .wpforms-field{width:100%; margin-bottom:10px; padding-bottom:20px; background:transparent; overflow:hidden} #wpforms-269 .wpforms-field:nth-child(1){margin-right:20px} #wpforms-269 .wpforms-field:nth-child(1), #wpforms-269 .wpforms-field:nth-child(2){width:calc(50% - 10px)} #wpforms-269 input{height:var(--input_height)} #wpforms-269 textarea{min-height:100px} #wpforms-269 input, #wpforms-269 textarea{width:100%;border: 0; max-width:100%!important; font-size:var(--input_font_size);border-radius: 10px;background-color: white; color:#222; box-sizing:border-box; line-height:var(--input_height); padding:0 10px} #wpforms-269 input::-webkit-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 input::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 input::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 input::-ms-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 textarea::-webkit-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 textarea::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 textarea::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 textarea::-ms-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-269 #wpforms-269-field_1-error, #wpforms-269 #wpforms-269-field_2-error, #wpforms-269 #wpforms-269-field_3-error, #wpforms-269 #wpforms-269-field_4-error{position:absolute; font-size:14px} #wpforms-269 .wpforms-submit-container button{overflow: hidden;border-radius: 20px; width:100%; height:var(--input_height); font-size:16px; color:#FFF; line-height:var(--input_height); cursor:pointer; text-transform:uppercase; position:relative; z-index:2} #wpforms-269 .wpforms-submit-container img{position:absolute; top:50%; transform:translate(0,-50%); right:4px} #wpforms-269 .wpforms-submit-container:hover{ background-color: var(--i_color2); animation: a 0.5s 1 linear; animation-delay: 0.01s; } @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ } @media screen and (max-width:959px){ /* .aside_right{display:none} */ #aside_sc_from1 {width: 80%;} } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ #aside_sc_from1 {width: 87%;} } /* video */ /* eject videos */ .company_right_img i {display: block;width: 98px;height: 98px;background: url(static/imgs/video_cilcle.png) center no-repeat;background-size: cover;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);animation: video 10s linear infinite;cursor: pointer;} .company_right_img i::after {content: '';position: absolute;top: 50%;left: 50%;box-sizing: border-box;padding-left: 3%;transform: translate(-50%,-50%);width: 33px;height: 33px;background: url(static/imgs/video_san.png) center no-repeat;background-size: cover;animation: no_video 10s linear infinite;} .vd_box_auto{position: relative;z-index: auto;} .vd_box {display: none;position: fixed;top: 52%;left: 50%;transform: translate(-50%, -50%);z-index: 2014;width: 60%;max-height: 90%;} .vd_box::before {content: '';display: block;padding-bottom: 56.25%;} .close_v {position: absolute;top: -20px;right: -20px;width: 40px;height: 40px;background: var(--i_color);z-index: 2;-webkit-border-radius: 50%;border-radius: 50%;cursor: pointer;} .close_v::before {content: '+';position: absolute;top: 50%;left: 50%;font-size: 44px;color: #FFF;-webkit-transform: translate(-50%, -50%) rotate(45deg);transform: translate(-50%, -50%) rotate(45deg)} .vd_box iframe {position: absolute;top: 0;right: 0;width: 100%;height: 100%;background: #000;object-fit: contain;} @media screen and (max-width:1024px) { .vd_box {width: 80%;} .close_v::before {font-size: 40px;} } @media screen and (max-width:768px) { .vd_box {width: 88%;} .close_v {top: -15px;right: -15px;width: 30px;height: 30px;} .close_v::before {font-size: 30px;} } .c_new_list{width: 100px; background: #fff; position: absolute; top: 136px; right: 573px; display: none;} .c_new_list li{border-bottom: 1px solid #ccc; text-align: center; padding: 10px 0;} .c_new_list li>a{font-size: 18px; text-align: center;} .i_nav li:nth-child(8):hover+.c_new_list{ display: block; } /* 重置标签样式 */ .news_article, .news_article * { margin: revert; padding: revert; list-style: revert; } .news_article b { font-weight: bold; } .news_article a { text-decoration: underline; } .news_article figure { margin-left: auto; margin-right: auto; } .wp-block-column figure img { width: 100%; } .news_article img { /* margin-top: 0.3rem; margin-bottom: 0.3rem; */ max-width: 100% !important; height: initial !important } .news_article h1, .news_article h2, .news_article h3, .news_article h4, .news_article h5, .news_article h6 { font-weight: bold; } .has-text-align-center { text-align: center; } /* .news_article ul,.news_article li,.news_article ol{list-style: revert;} */ /* .news_article ul,.news_article ol{padding-left: 0.22rem;margin-top: 0.3rem;margin-bottom: 0.3rem;} .news_article li{margin-top: .1rem;margin-bottom: 0.1rem;} */ .news_article .aligncenter { margin-left: auto; margin-right: auto; } .news_article .wp-caption { max-width: 100% !important; } /* 默认表格 */ .news_article table { margin-top: 0.2rem; margin-bottom: 0.2rem; width: 100% !important; max-width: 100% !important; background: #FFF; border-collapse: collapse !important; border-spacing: 0 !important; overflow-x: auto; } .news_article tbody { width: 100% !important; max-width: 100% !important } .news_article table tr, .news_article table td { max-width: 100% !important } .news_article table tr, .news_article table td, .news_article table tr p, .news_article table td p { margin: 0; padding: 0 } /* .news_article table tr:nth-child(odd) { background: rgba(0, 0, 0, .04) } */ .news_article table td { padding: 8px; border: 1px solid var(--border_color) }