/* Theme Name: Yizhihang Version: 1.0 Description: 安徽领聚数字作为Google中国区核心合作伙伴,拥有安徽省唯一的一家Google出海体验中心,为安徽本土化外贸企业出海提供一站式服务——网站搭建,谷歌SEO优化,谷歌竞价,谷歌SNS社媒营销等。 Author: 版权所有：安徽领聚 */ @charset "utf-8"; * { box-sizing: border-box; line-height: 150%; font-family: Arial, Helvetica, sans-serif; } :root { --i_color: #f69035; --i_color2: #E26D04; --bc_color: #232323; --font_color: #222; --top1_height: 0.4rem; /* 头部1高度 */ --top2_height: 0.8rem; /* 头部2高度 */ --header_height: calc(var(--top1_height) + var(--top2_height)); /* 头部高度 */ --border_color: rgba(0, 0, 0, 0.15); /* 默认边框颜色 */ } @media screen and (max-width: 1024px) { :root { --top1_height: 0.32rem; --top2_height: 0.56rem; } } @media screen and (max-width: 768px) { :root { --top2_height: 0.54rem; --border_color: rgba(0, 0, 0, 0.08); } } .wrap { width: 83.33%; max-width: 1600px; margin-left: auto; margin-right: auto; } @media screen and (max-width: 1440px) { .wrap { width: 90%; } } @media screen and (max-width: 1024px) { .wrap { width: 94%; } } .wrap_l { display: block; padding-left: 8.33%; } .wrap_r { display: block; padding-right: 8.33%; } @media screen and (max-width: 1600px) { .wrap_l { padding-left: 5%; } .wrap_r { padding-right: 5%; } } @media screen and (max-width: 1024px) { .wrap_l { padding-left: 3%; padding-right: 3%; } .wrap_r { padding-left: 3%; padding-right: 3%; } } .box { overflow: hidden; position: relative; } /* header */ header { position: fixed; top: 0; left: 0; width: 100%; z-index: 2014; background-color: #fff; box-shadow: 0px 0px 6px #ddd; } .top_line { display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; padding: 0 0.2rem; } .top_contact { display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; } .top_contact li:not(:last-child) { margin-right: 0.8rem; } .top_contact a { display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; height: var(--top1_height); gap: 0 0.06rem; } .top_contact iconify-icon { font-size: 0.24rem; color: #4d4d4d; } .top_contact p { font-size: 14px; color: #4d4d4d; margin-right: 0.2rem; } .top_contact a:hover p { color: var(--i_color); } @media screen and (max-width: 1200px) { .top_contact li:last-child { display: none; } } @media screen and (max-width: 1024px) { .top_contact { display: none; } } .top_media { margin-left: auto; display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.14rem; } .top_media li { display: flex; display: -webkit-flex; justify-content: center; align-items: center; } .top_media iconify-icon { font-size: 0.22rem; color: #909090; } .top_media li:hover iconify-icon { color: var(--i_color); } @media screen and (max-width: 1024px) { .top_media { height: var(--top1_height); } .top_media iconify-icon { font-size: 0.2rem; } } .top_cont { border-top: 1px solid #d8d8d8; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .top_cont .top { height: var(--top2_height); display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; } /* @media screen and (max-width:1024px) { .top_cont{background: #373737;} } */ /* logo */ .logo { display: -webkit-flex; display: flex; align-items: center; height: 100%; background: #f0f0f0; margin-right: 0.7rem; padding: 0 0.2rem; } .logo a { display: -webkit-flex; display: flex; align-items: center; height: 100%; position: relative; } .logo img { height: 0.48rem; object-fit: contain; } @media screen and (max-width: 1440px) { .logo { margin-right: 0.3rem; } .logo img { height: 0.5rem; } } @media screen and (max-width: 1366px) { } @media screen and (max-width: 1200px) { .logo img { height: 0.4rem; } } @media screen and (max-width: 1024px) { .logo img { height: 0.4rem; } } @media screen and (max-width: 560px) { .logo { margin-right: 0; } .logo img { height: 0.3rem; } } /* 导航 */ @media screen and (min-width: 1025px) { .i_nav { display: -webkit-flex; display: flex; flex-wrap: nowrap; gap: 0 0.6rem; z-index: 2014; } .i_nav > li { position: relative; } .i_nav > li > a { display: block; font-size: 16px; color: #222; line-height: var(--top2_height); white-space: nowrap; text-transform: uppercase; -webkit-border-radius: 0.08rem; border-radius: 0.08rem; } .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 > .active > a { color: var(--i_color); } .i_nav > li > .sub-menu { display: none; position: absolute; left: 0; min-width: 1.6rem; background: #fff; box-shadow: 0 0.06rem 0.1rem rgb(0 0 0 / 8%); font-size: 0; } .nav_dropdown_menu1 > .sub-menu, .nav_dropdown_menu2 > .sub-menu, .nav_dropdown_menu3 > .sub-menu, .nav_dropdown_menu4 > .sub-menu { display: none !important; } .i_nav > li > .sub-menu li { position: relative; border-bottom: 1px solid var(--border_color); } .i_nav > li > .sub-menu a { display: block; padding: 0 0.16rem; font-size: 0.15rem; color: #333; line-height: 0.36rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; position: relative; } .i_nav > li > .sub-menu > li:hover > a { background: var(--i_color); color: #fff; } .i_nav .sub-menu .sub-menu { position: absolute; top: 0; left: 100%; background: var(--i_color); min-width: 1.4rem; } .i_nav .sub-menu .sub-menu li { border-bottom-color: rgb(255 255 255 / 15%); } .i_nav .sub-menu .sub-menu a { font-size: 14px; color: #fff; } .i_nav .sub-menu .sub-menu li:hover { background: rgb(255 255 255 / 15%); } } @media screen and (max-width: 1500px) { .i_nav > li > a { font-size: 16px; } .i_nav { gap: 0 0.4rem; } } @media screen and (max-width: 1366px) { .i_nav > li > a { font-size: 15px; } .i_nav { gap: 0 0.35rem; } } @media screen and (max-width: 1200px) { .i_nav { gap: 0 0.38rem; } .i_nav > li > a { font-size: 14px; } } @media screen and (max-width: 1024px) { .i_nav { display: none; position: fixed; top: var(--header_height); left: 0; width: 100%; width: 100vw; max-height: calc(100vh - var(--header_height)); background: #fff; overflow-y: auto; z-index: 2; } /*滚动条*/ .i_nav::-webkit-scrollbar { width: 3px; height: 8px; } .i_nav::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); background: #555; } .i_nav::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); border-radius: 0; background: #f1f1f1; } .i_nav > li { margin: 0 0 !important; border-bottom: 1px solid var(--border_color); position: relative; } .i_nav > .menu-item-has-children span { display: block; position: absolute; top: 0; right: 0; width: 0.44rem; height: 0.44rem; background: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" viewBox="0 0 48 48"%3E%3Cpath fill="none" stroke="%23555" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M36 18L24 30L12 18"%2F%3E%3C%2Fsvg%3E') no-repeat center; background-size: 0.24rem; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .i_nav > .menu-item-has-children span.on { transform: rotate(180deg); background-size: 0.24rem; } .i_nav > li > a { padding: 0 3%; font-size: 0.16rem; color: #222; line-height: 0.44rem; text-transform: uppercase; } .i_nav > li > .sub-menu { display: none; } .i_nav > li > .sub-menu li { position: relative; } .i_nav .sub-menu a { padding: 0 0.4rem; font-size: 16px; color: #555; line-height: 0.4rem; position: relative; } /* .i_nav .sub-menu li:not(:last-child) { border-bottom: 1px solid var(--border_color) } */ .i_nav > li > .sub-menu b { position: absolute; top: 0; right: 0; width: 0.4rem; height: 0.4rem; background: url(static/images/public/arrow_down_hollow_hei.svg) no-repeat center; background-size: 0.16rem; } .i_nav > li > .sub-menu b.on { background: url(static/images/public/arrow_up_hollow_hei.svg) no-repeat center; background-size: 0.16rem; } .i_nav .sub-menu .sub-menu { display: none; } .i_nav .sub-menu .sub-menu a { padding: 0 0.6rem; font-size: 15px; color: #888; line-height: 0.36rem; position: relative; } .i_nav a { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } /* 移动端导航按钮 */ .nav_menu { /* position: absolute; right: 0; top: 50%; transform: translateY(-50%); */ position: relative; width: 22px; height: 16px; display: none; cursor: pointer; } .nav_menu i { display: block; width: 100%; height: 3px; position: absolute; top: 50%; margin-top: -2px; background: var(--i_color); border-radius: 0.1rem; transition: 0.5s; } .nav_menu::before, .nav_menu::after { content: ""; width: 100%; height: 3px; background: var(--i_color); position: absolute; left: 0; border-radius: 0.1rem; 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: 1024px) { .nav_menu { display: block !important; margin-right: 10px; } } /* 导航下拉 */ .nav_dropdown { position: fixed; top: var(--header_height); left: 0; width: 100%; background: #fff; z-index: 2013; } .nav_dropdown_item { display: none; padding: 0.4rem 0; } .nav_dropdown_list { display: -webkit-flex; display: flex; flex-wrap: nowrap; justify-content: center; gap: 0 3%; } .nav_dropdown_list dt { width: 100%; max-width: 3.8rem; } .nav_p_cat_name a { font-size: 0.2rem; color: var(--i_color); font-weight: 900; } .nav_dropdown_list ul { margin-top: 0.2rem; } .nav_dropdown_list li { position: relative; padding-left: 0.24rem; } .nav_dropdown_list li::before { opacity: 0.5; content: ""; position: absolute; top: 50%; transform: translate(0, -50%); left: 0; width: 0.2rem; height: 0.2rem; background: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" viewBox="0 0 24 24"%3E%3Cg fill="none" fill-rule="evenodd"%3E%3Cpath d="M24 0v24H0V0h24ZM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035c-.01-.004-.019-.001-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427c-.002-.01-.009-.017-.017-.018Zm.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093c.012.004.023 0 .029-.008l.004-.014l-.034-.614c-.003-.012-.01-.02-.02-.022Zm-.715.002a.023.023 0 0 0-.027.006l-.006.014l-.034.614c0 .012.007.02.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01l-.184-.092Z"%2F%3E%3Cpath fill="currentColor" d="M15.707 11.293a1 1 0 0 1 0 1.414l-5.657 5.657a1 1 0 1 1-1.414-1.414l4.95-4.95l-4.95-4.95a1 1 0 0 1 1.414-1.414l5.657 5.657Z"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E') no-repeat center; background-size: contain; } .nav_dropdown_list li a { display: block; padding: 0.06rem 0; font-size: 0.15rem; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .nav_dropdown_list li:hover a { margin-left: 8px; color: var(--i_color); } .top_r { --size: 0.36rem; } .top_r { margin-left: auto; display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; height: var(--top2_height); } /* search main */ .top_search { } .top_search form { width: 2.7rem; margin: 0 auto; max-width: 2.7rem; display: -webkit-flex; display: flex; flex-wrap: wrap; -webkit-border-radius: 2rem; border-radius: 2rem; background: #f0f0f0; overflow: hidden; } .top_search_ipt { width: calc(100% - var(--size)); height: var(--size); background: none; padding: 0 0 0 0.12rem; } .top_search_ipt::-webkit-input-placeholder { color: #999; font-size: 0.15rem; } .top_search_ipt::-moz-placeholder { color: #999; font-size: 0.15rem; } .top_search_ipt::-ms-input-placeholder { color: #999; font-size: 0.15rem; } .top_search_btn { font-size: 0; color: #999; width: var(--size); height: var(--size); background: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="32" height="32" viewBox="0 0 32 32"%3E%3Cpath fill="%23999" d="m29 27.586l-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9a9.01 9.01 0 0 1-9-9"%2F%3E%3C%2Fsvg%3E') no-repeat center; background-size: 0.24rem; cursor: pointer; } @media screen and (max-width: 1440px) { .top_search form { width: 2rem; } } @media screen and (max-width: 1200px) { .top_search form { width: 1.5rem; } } @media screen and (max-width: 1024px) { .top_search form { width: 1rem; } } @media screen and (max-width: 400px) { .top_search form { display: none; } } .top_language { margin: 0 0.2rem; height: var(--top2_height); position: relative; display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: center; } .top_language_btn { display: flex; display: -webkit-flex; align-items: center; flex-wrap: wrap; height: var(--size); position: relative; cursor: pointer; font-size: 16px; } .top_language_btn iconify-icon { font-size: 0.24rem; color: var(--font_color); } .top_language_btn b { margin-left: 0.1rem; } .language_list { opacity: 0; visibility: hidden; position: absolute; top: calc(var(--top2_height) + 0.2rem); right: 0; background: #fff; min-width: 1.2rem; z-index: 2016; box-shadow: 0 8px 0.1rem rgb(0 0 0 / 10%); -webkit-transition: all 0.4s ease; transition: all 0.4s ease; padding: 0.16rem 0.2rem; text-align: left; } .language_list.on { opacity: 1; visibility: visible; top: var(--top2_height); } .language_list dt > h6 { margin-bottom: 0.08rem; font-size: 0.17rem; font-weight: bold; white-space: nowrap; color: var(--font_color); } .curr_lang { margin-bottom: 0.12rem; padding-bottom: 0.12rem; border-bottom: 1px solid #eee; } .lang_list a { display: block; padding: 0.06rem 0; } .lang_list .trp-flag-image, .lang_list span img { display: none !important; } .lang_list .trp-ls-language-name { display: inline-block; padding-left: 0.3rem; font-size: 14px; line-height: 1.4; white-space: nowrap; position: relative; } .lang_list .trp-ls-language-name::before { content: ""; position: absolute; top: 50%; transform: translate(0, -50%); left: 0; width: 0.18rem; height: 0.18rem; box-sizing: border-box; border: 1px solid #aaa; -webkit-border-radius: 50%; border-radius: 50%; } .lang_list .trp-ls-language-name::after { display: none; content: ""; position: absolute; top: 50%; transform: translate(0, -50%); left: 0.06rem; width: 0.06rem; height: 0.06rem; background: var(--i_color); -webkit-border-radius: 50%; border-radius: 50%; } .lang_list li:hover .trp-ls-language-name::after, .curr_lang .trp-ls-language-name::after { display: block; } .lang_list li:hover .trp-ls-language-name, .curr_lang .trp-ls-language-name { color: var(--i_color); } @media screen and (max-width: 768px) { .language_list dt > h6 { font-size: 15px; } } @media screen and (max-width: 560px) { .lang_list .trp-ls-language-name { font-size: 13px; } .top_language_btn b { display: none; } .top_language { margin: 0 0.1rem; } } .full_header { height: var(--header_height); } @media screen and (max-width: 1024px) { } /* banner */ .banner { width: 100%; font-size: 0; overflow: hidden; position: relative; } .banner > .wave { position: absolute; left: 0; bottom: -1px; width: 100%; height: 98px; z-index: 33; } .banner > .wave img { position: absolute; left: 0; bottom: 0; width: 100%; max-height: 100%; object-fit: contain; } .banner .swiper-container { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; } .banner .swiper-wrapper { display: flex; position: relative; width: 100%; z-index: 1; } .banner .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-shrink: 0; height: 0; padding-bottom: 36.46%; position: relative; overflow: hidden; } .banner .swiper-slide > img, .banner .swiper-slide > a > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .banner-button-prev, .banner-button-next { display: block; position: absolute; top: 50%; transform: translate(0, -50%); width: 0.5rem; height: 0.5rem; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; z-index: 3; } .banner-button-prev { left: -0.6rem; } .banner-button-next { right: -0.6rem; } .banner-button-prev iconify-icon, .banner-button-next iconify-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0.5rem; color: #fff; } .banner-button-prev:hover iconify-icon, .banner-button-next:hover iconify-icon { color: var(--i_color2); } .banner:hover .banner-button-prev { left: 0.1rem; } .banner:hover .banner-button-next { right: 0.1rem; } .banner-pagination { position: absolute; left: 50% !important; transform: translate(-50%, 0); bottom: 0.3rem; text-align: center; z-index: 2; } .banner-pagination .swiper-pagination-bullet { width: 0.1rem; height: 0.1rem; display: inline-block; margin: 0 6px; background: #ccc; -webkit-border-radius: 50%; border-radius: 50%; outline: none; cursor: pointer; position: relative; } .banner-pagination .swiper-pagination-bullet-active { background: var(--i_color2); } @media screen and (max-width: 1200px) { .banner-button-prev, .banner-button-next { display: none; } } @media screen and (max-width: 1024px) { .banner .swiper-slide { height: 0; padding-bottom: 48%; } .banner > .wave { height: 76px; } .banner-button-prev, .banner-button-next { display: none; } } @media screen and (max-width: 768px) { .banner > .wave { height: 46px; } } @media screen and (max-width: 560px) { .banner .swiper-slide { padding-bottom: 60%; } .banner > .wave { height: 30px; } .banner-pagination { bottom: 0.14rem; } .banner-pagination .swiper-pagination-bullet { margin: 0 4px; width: 0.06rem; height: 0.06rem; } } .b_t1 { position: absolute; top: 21.14%; left: 8.85%; width: 40%; } .b_t1 h3 { color: #d47016; font-weight: bold; } .b_t1 h4 { font-weight: bold; margin-bottom: 0.4rem; } .b_t1 ul { display: flex; align-items: center; gap: 0.4rem; } .b_t1 ul li { display: flex; align-items: center; width: calc((100% - 2 * 0.4rem) / 3); gap: 0.1rem; border-right: 1px solid #80430c; } .b_t1 ul li img { width: 0.37rem; object-fit: contain; } .b_t1 ul li:last-child { border-right: none; } .b_t2 { position: absolute; top: 21.14%; left: 8.85%; width: 80%; } .b_t2 h3 { color: #144d34; font-weight: bold; padding-bottom: 0.3rem; position: relative; margin-bottom: 0.4rem; } .b_t2 h3 span { color: var(--i_color); font-weight: bold; } .b_t2 h3::before { content: ""; display: block; width: 15%; height: 0.03rem; background: linear-gradient(90deg, #f69035 0%, #f6903500 99%); position: absolute; left: 0; bottom: 0; } .b_t2 ul { display: flex; flex-direction: column; gap: 0.3rem; } .b_t2 ul li { display: flex; align-items: center; gap: 0.1rem; color: #144d34; } .b_t2 ul li img { width: 0.37rem; object-fit: contain; } .b_t3 { position: absolute; top: 19.71%; left: 8.33%; } .b_t3 h3 { } .b_t3 h4 { color: #76471f; font-weight: bold; position: relative; margin-bottom: 0.4rem; padding-bottom: 0.3rem; } .b_t3 h4::before { content: ""; display: block; width: 30%; height: 0.03rem; background: linear-gradient(90deg, #76471f 0%, #76471f00 99%); position: absolute; left: 0; bottom: 0; } .b_t3 ul { display: flex; flex-direction: column; gap: 0.2rem; } .b_t3 ul li { display: flex; align-items: center; gap: 0.1rem; } .b_t3 ul li img { width: 0.32rem; object-fit: contain; } @media screen and (max-width: 1550px) { .b_t1 { top: 15.14%; width: 45%; } .b_t2 { top: 16%; } .b_t3 { top: 12.71%; } } @media screen and (max-width: 1440px) { .b_t1 { top: 16%; width: 50%; } .b_t2 { top: 10%; } .b_t3 { top: 8.71%; } } @media screen and (max-width: 1366px) { } @media screen and (max-width: 1200px) { .b_t1 { width: 60%; } } @media screen and (max-width: 1024px) { .b_t1 { top: 25%; width: 65%; } .b_t1 ul { gap: 0.2rem; } .b_t1 ul li { width: calc((100% - 2 * 0.2rem) / 3); } .b_t2 ul li img { width: 0.3rem; } .b_t3 { top: 20%; } } @media screen and (max-width: 768px) { .b_t1 ul { display: none; } .b_t2 h3 { padding-bottom: 0.2rem; margin-bottom: 0.2rem; } .b_t2 ul { gap: 0.2rem; } .b_t3 { top: 15%; } .b_t3 h4 { margin-bottom: 0.2rem; padding-bottom: 0.2rem; } .b_t3 ul li img { width: 0.3rem; } } @media screen and (max-width: 560px) { .b_t1 h3 { font-size: 24px; margin-bottom: 0.1rem; } .b_t1 h4 { font-size: 18px; } .b_t2 ul { gap: 0.1rem; } .b_t2 h3 { padding-bottom: 0.1rem; margin-bottom: 0.1rem; } .b_t2 ul li img { width: 0.2rem; } .b_t3 ul { display: none; } } @media screen and (max-width: 375px) { .b_t2 ul { display: none; } .b_t3 h3 { font-size: 0.2rem; margin-bottom: 0.1rem; } .b_t3 h4 { font-size: 0.18rem; padding-bottom: 0.1rem; } } @media screen and (max-width: 320px) { .b_t1, .b_t2, .b_t3 { display: none; } } .i_tit h2 { display: table; font-size: 0.38rem; color: var(--font_color); font-weight: bold; text-transform: uppercase; position: relative; padding-left: 0.4rem; } .i_tit h2 i { position: absolute; top: 0; left: 0; width: 0.45rem; height: 100%; background: url(https://lingjuimg.com/wp-content/uploads/BengBuBoJing/2026/09/组-764-1.webp) no-repeat center/contain; background-size: 0.4rem; } .i_tit.center { text-align: center; } .i_tit.center h2 { margin: 0 auto; } .i_tit.center h6 { width: 40%; margin: 0.16rem auto; } .i_tit h6 { font-size: 0.18rem; color: #4d4d4d; } .i_tit.white h2 { color: #fff; } .i_tit.white h6 { color: #fff; } @media screen and (max-width: 1440px) { .i_tit h2 { font-size: 0.3rem; } } @media screen and (max-width: 1024px) { .i_tit h2 { font-size: 0.24rem; } .i_tit h2 i{ background-size: 0.35rem; } } @media screen and (max-width: 768px) { .i_tit h2 { font-size: 0.2rem; } .i_tit.center h6 { width: 100%; } } @media screen and (max-width: 560px) { .i_tit h2 { font-size: 0.18rem; } .i_tit h2 i{ background-size: 0.3rem; } } /* More btn */ .i_more { display: table; text-align: center; padding: 0.12rem 0.3rem; background: var(--i_color); border: 1px solid transparent; -webkit-border-radius: 7px; border-radius: 7px; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; position: relative; overflow: hidden; } .i_more span { width: 100%; flex-wrap: nowrap; display: flex; display: -webkit-flex; justify-content: center; align-items: center; } .i_more b { font-size: 0.18rem; color: #fff; margin-right: 6px; } .i_more svg { width: 0.2rem; height: 0.2rem; } .fill { fill: none; stroke: #fff; /* 图形原色的外轮廓颜色 */ stroke-width: 90px; /* 图形原色外轮廓的宽度 */ stroke-linecap: round; /* 两端的形状 */ } @keyframes move { /* 指定线条长度和间距 */ 0% { stroke-dasharray: 0 800px; } 100% { stroke-dasharray: 800px 0; } } .i_more:hover .fill { animation: move 1s linear; } .i_more.center { margin-left: auto; margin-right: auto; } .i_more.curr { background: var(--i_color2); } .i_more:hover { background: var(--i_color2); border-color: var(--i_color); } .i_more:hover b { color: #fff; } .i_more_l { background: none; border: 1px solid #e2e2e2; } .i_more_l b { color: #c8c8c8; } .i_more_list { display: flex; display: -webkit-flex; align-items: center; flex-wrap: wrap; } .i_more_list a { width: 40%; } .i_more_list a:first-child { margin-right: 0.2rem; } @media screen and (max-width: 1440px) { .i_more { padding: 0.1rem 0.22rem; } } @media screen and (max-width: 1024px) { .i_more b { font-size: 14px; } } @media screen and (max-width: 560px) { .i_more { padding: 6px 0.2rem; } .i_more b { font-size: 13px; } } /* More white btn */ .i_more_white { display: table; text-align: center; padding: 0.12rem 0.3rem; background: #fff; border: 1px solid #fff; -webkit-border-radius: 7px; border-radius: 7px; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; position: relative; overflow: hidden; } .i_more_white span { width: 100%; flex-wrap: nowrap; display: flex; display: -webkit-flex; justify-content: center; align-items: center; } .i_more_white b { font-size: 0.18rem; color: var(--i_color); margin-right: 6px; } .i_more_white svg { width: 0.2rem; height: 0.2rem; } .i_more_white .fill { stroke: var(--i_color); } .i_more_white:hover { background: var(--i_color2); } .i_more_white:hover b { color: #fff; } .i_more_white:hover .fill { stroke: #fff; animation: move 1s linear; } @media screen and (max-width: 1440px) { .i_more_white { padding: 0.1rem 0.22rem; } } @media screen and (max-width: 1024px) { .i_more_white b { font-size: 14px; } } @media screen and (max-width: 560px) { .i_more_white { padding: 6px 0.2rem; } .i_more_white b { font-size: 13px; } } /* -----------------------------------底部--------------------------------------- */ footer { background: url(static/images/bc_foot.webp) no-repeat center; background-size: cover; background-size: cover; position: relative; z-index: 10; } .f_top { padding-top: 0.7rem; padding-bottom: 0.3rem; border-bottom: 1px solid #fff; display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .f_top h6 { font-size: 0.38rem; color: #fff; font-weight: bold; line-height: 120%; } @media screen and (max-width: 1440px) { .f_top h6 { font-size: 0.3rem; } } @media screen and (max-width: 1024px) { .f_top h6 { font-size: 0.22rem; } } @media screen and (max-width: 560px) { .f_top h6 { font-size: 0.18rem; margin-bottom: 0.1rem; } } .f_media { display: -webkit-flex; display: flex; flex-wrap: wrap; gap: 0 0.16rem; } .f_media a { width: 0.38rem; height: 0.38rem; display: flex; display: -webkit-flex; justify-content: center; align-items: center; -webkit-border-radius: 6px; border-radius: 6px; padding: 0.1rem; } .f_media iconify-icon { font-size: 0.32rem; color: rgb(255 255 255 / 40%); } .f_media iconify-icon:hover { color: var(--i_color); } .f_box { display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; flex-direction: row-reverse; } .f_contact { width: 19.93%; } .f_nav { width: 34%; } .f_form { width: 26.56%; } .f_tit { font-size: 0.28rem; color: #fff; font-weight: bold; margin-bottom: 0.3rem; } .f_contact_list li { margin: 0.16rem 0; display: flex; display: -webkit-flex; align-items: center; } .f_contact_list p { font-size: 0.18rem; color: #fff; margin-bottom: 0.1rem; } .f_contact_list a, .f_contact_list span { font-size: 0.18rem; color: #fff; line-height: 200%; } .f_contact_list li:last-child a { background-color: var(--i_color); padding: 2px 16px; -webkit-border-radius: 0.5rem; border-radius: 0.5rem; display: inline-flex; align-items: center; border: 1px solid transparent; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .f_contact_list iconify-icon { color: #969696; font-size: 0.3rem; margin-right: 10px; } .qr img { margin-right: 0.1rem; max-width: 1.2rem; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .qr img:hover { transform: translateY(-6px); } .f_nav { display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; } .f_nav li > a { font-size: 0.18rem; color: #fff; } .f_nav a { display: block; font-size: 0.18rem; color: #fff; position: relative; margin-bottom: 0.2rem; text-transform: uppercase; } .f_nav a:hover { color: var(--i_color); } .f_form { position: relative; overflow: hidden; -webkit-border-radius: 0.1rem; border-radius: 0.1rem; } #wpforms-form-144 { --input_font_size: 16px; --input_height: 0.48rem; } #wpforms-form-144 { width: 100%; } #wpforms-form-144 input, #wpforms-form-144 button { margin: 0; padding: 0; border: none; background: none; } #wpforms-form-144 .wpforms-field { padding: 0; margin-bottom: 0.1rem; position: relative; } #wpforms-form-144 .wpforms-field-label { font-size: 0; } #wpforms-form-144 .wpforms-required-label { position: absolute; top: 0.1rem; left: 0.05rem; font-size: 0.16rem; color: #f00; } #wpforms-form-144 .wpforms-field-container input, #wpforms-form-144 textarea { width: 100%; max-width: 100% !important; min-width: 100%; border: none !important; font-size: var(--input_font_size); color: #969696; height: var(--input_height); box-sizing: border-box; background: #fff; padding: 0 0.16rem; overflow: hidden; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-border-radius: 0.1rem; border-radius: 0.1rem; } #wpforms-form-144 .wpforms-field-container input:hover, #wpforms-form-144 textarea:hover { border-color: var(--i_color); } #wpforms-form-144 input { line-height: var(--input_height); } #wpforms-form-144 textarea { line-height: 0.22rem; padding: 0.06rem 0.16rem; } #wpforms-form-144 input::-webkit-input-placeholder, #wpforms-form-144 textarea::-webkit-input-placeholder { color: #969696; font-size: var(--input_font_size); } #wpforms-form-144 input::-moz-placeholder, #wpforms-form-144 textarea::-moz-placeholder { color: #969696; font-size: var(--input_font_size); } #wpforms-form-144 input::-ms-input-placeholder, #wpforms-form-144 textarea::-ms-input-placeholder { color: #969696; font-size: var(--input_font_size); } #wpforms-form-144-field_1-error, #wpforms-form-144-field_2-error, #wpforms-form-144-field_3-error, #wpforms-form-144-field_4-error, #wpforms-form-144-field_5-error, #wpforms-form-144-field_6-error { position: absolute; font-size: 12px; color: #a90909; } #wpforms-form-144 .wpforms-field-container { width: 100%; } #wpforms-form-144 .wpforms-submit-container button { display: table; padding: 0.12rem 0.5rem; margin-top: 0.3rem; -webkit-border-radius: 0.3rem; border-radius: 0.3rem; font-size: 0.16rem; color: #fff; font-weight: bold; background: var(--i_color); cursor: pointer; position: relative; z-index: 2; transition: 0.5s ease; overflow: hidden; } #wpforms-form-144 .wpforms-submit-container img { position: absolute; top: 50%; transform: translate(0, -50%); right: 4px; z-index: 2; } #wpforms-form-144 .wpforms-submit-container button::before { content: ""; width: 200%; height: 200%; position: absolute; top: 100%; left: 50%; border-radius: 40%; transform: translateX(-50%); background: var(--i_color2); transition: 0.5s ease; z-index: -1; } #wpforms-form-144 .wpforms-submit-container button:hover { color: #fff; } #wpforms-form-144 .wpforms-submit-container button:hover::before { top: -10%; } @media screen and (max-width: 1024px) { #wpforms-form-54 { flex-wrap: wrap; } #wpforms-form-144 .wpforms-field { width: 100%; position: relative; } #wpforms-form-144 .wpforms-field-container { margin-right: 0; flex-wrap: wrap; justify-content: space-between; } #wpforms-form-144-field_1-container, #wpforms-form-144-field_3-container { width: 100% !important; } #wpforms-form-144 .wpforms-submit-container { margin: 0 auto; } } @media screen and (max-width: 768px) { #wpforms-form-144 { --input_font_size: 13px; --input_height: 0.4rem; } } @media screen and (max-width: 560px) { #wpforms-form-144-field_1-container, #wpforms-form-144-field_2-container, #wpforms-form-144-field_3-container { width: 100% !important; } } .f_copy { border-top: 1px solid rgb(255 255 255 / 60%); } .f_copy .wrap { display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; } .f_logo { background-color: var(--i_color); } .f_logo img { } .f_copy a, .f_copy p { font-size: 0.18rem; color: rgb(255 255 255 / 30%); line-height: 200%; display: flex; display: -webkit-flex; justify-content: center; align-items: center; } .f_copy a { border-left: 1px solid rgb(255 255 255 / 60%); border-right: 1px solid rgb(255 255 255 / 60%); padding: 0 0.4rem; } @media screen and (max-width: 1440px) { .f_top { padding-top: 0.6rem; } .f_tit { font-size: 0.24rem; } } @media screen and (max-width: 1024px) { .f_top { padding: 0.3rem 0 0.2rem; margin-bottom: 0.2rem; } .f_tit { font-size: 0.2rem; } .f_form { margin-bottom: 0.4rem; } .f_nav { display: none; } .f_contact, .f_form { width: 100%; } .f_contact_list p { font-size: 16px; } .f_contact_list a { font-size: 15px; } } @media screen and (max-width: 768px) { .f_copy a img { display: none; } .f_copy a { border: none; } .f_copy a, .f_copy p { width: 100%; padding: 0.1rem 0; text-align: center; font-size: 14px; line-height: 150%; } } #wpforms-form-141 { width: 100%; overflow: hidden; } .top_form { -webkit-border-radius: 0.1rem; border-radius: 0.1rem; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); padding: 0.4rem 0.3rem; background: #fff; position: relative; z-index: 10; margin-top: -1.2rem; } .top_form h6 { text-align: center; font-size: 0.36rem; color: var(--font_color); font-weight: bold; text-transform: uppercase; margin-bottom: 0.2rem; } @media screen and (max-width: 1440px) { .top_form { padding: 0.3rem 0.2rem; } .top_form h6 { font-size: 0.3rem; } } @media screen and (max-width: 1024px) { .top_form { padding: 0.2rem 0.1rem; margin-top: 0; } .top_form h6 { font-size: 0.2rem; } } #wpforms-141 { --input_font_size: 14px; --input_height: 0.46rem; } #wpforms-141 { margin: 0 0 0 auto; padding: 0; } #wpforms-form-141 { width: 100%; position: relative; overflow: hidden; } #wpforms-141 input, #wpforms-141 button { margin: 0; padding: 0; border: none; background: none; } #wpforms-141 .wpforms-field { padding: 0; margin: 0; } #wpforms-141 .wpforms-field-label { font-size: 0; } #wpforms-141 .wpforms-required-label { position: absolute; top: 0.06rem; left: 0.1rem; font-size: 0.16rem; color: #f00; } #wpforms-141 .wpforms-field-container input, #wpforms-141 textarea { width: 100%; max-width: 100% !important; min-width: 100%; font-size: var(--input_font_size); color: #333; height: var(--input_height); border: 1px solid #cdcdcd; -webkit-border-radius: 0.05rem; border-radius: 0.05rem; overflow: hidden; padding: 0.1rem; } #wpforms-141 input::-webkit-input-placeholder, #wpforms-141 textarea::-webkit-input-placeholder { color: rgb(0 0 0 / 40%); font-size: var(--input_font_size); } #wpforms-141 input::-moz-placeholder, #wpforms-141 textarea::-moz-placeholder { color: rgb(0 0 0 / 40%); font-size: var(--input_font_size); } #wpforms-141 input::-ms-input-placeholder, #wpforms-141 textarea::-ms-input-placeholder { color: rgb(0 0 0 / 40%); font-size: var(--input_font_size); } #wpforms-141-field_1-error, #wpforms-141-field_2-error, #wpforms-141-field_3-error, #wpforms-141-field_4-error, #wpforms-141-field_5-error, #wpforms-141-field_6-error { position: absolute; font-size: 12px; color: #a90909; } #wpforms-form-141 { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } #wpforms-141 .wpforms-field-container { width: 87%; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; overflow: hidden; } #wpforms-141 .wpforms-field-container > div { width: 28%; } #wpforms-141 .wpforms-field-container > div:nth-child(3) { width: 40%; } #wpforms-141 .wpforms-submit-container { text-align: center; padding: 0; overflow: hidden; position: relative; } #wpforms-141 .wpforms-submit-container button { margin-left: auto; display: table; padding: 0.1rem 0.5rem; text-transform: uppercase; height: 0.42rem; -webkit-border-radius: 0.06rem; border-radius: 0.06rem; font-size: 0.14rem; color: #fff; font-weight: bold; background: var(--i_color); cursor: pointer; position: relative; z-index: 2; } #wpforms-141 .wpforms-submit-container button:hover { background: #E26D04; } #wpforms-141 .wpforms-submit-container img { position: absolute; top: 50%; transform: translate(0, -50%); right: 4px; z-index: 2; } #wpforms-141 .wpforms-field-container .wpforms-field > input:hover, #wpforms-141 .wpforms-field-container textarea:hover, #wpforms-141 .wpforms-field-container .wpforms-field > input:focus, #wpforms-141 .wpforms-field-container textarea:focus { border: var(--i_color) 1px solid; outline: none; box-shadow: none; } @media screen and (max-width: 1024px) { #wpforms-141 .wpforms-field-container { width: 100%; } #wpforms-141 .wpforms-submit-container { margin: 0.1rem auto; } } @media screen and (max-width: 768px) { #wpforms-141 .wpforms-field-container > div { width: 100%; margin-bottom: 0.1rem; } #wpforms-141 .wpforms-field-container > div:nth-child(3) { width: 100%; } } /* ---------------------------------------------首页------------------------------ */ .i_n_tit { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .i_category { background: linear-gradient( 180deg, #fef3df 0%, #ffffff00 86%, #fef3df63 100% ); } .ic_list { display: flex; display: -webkit-flex; flex-wrap: wrap; } .ic_list li { width: 23%; margin-right: 2.6%; margin-bottom: 0.5rem; background-color: #ebebeb; } .ic_list li:nth-child(4n) { margin-right: 0; } @media screen and (max-width: 1024px) { .ic_list li { width: 48%; margin-right: 2%; } .ic_list li:nth-child(even) { margin-right: 0; } } .ic_list .img { position: relative; overflow: hidden; } .ic_list .img::before { content: ""; display: block; padding-bottom: 100%; } .ic_list .img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .ic_list iconify-icon { font-size: 0.4rem; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; opacity: 0; } .ic_list .txt { padding: 0.2rem; position: relative; } .ic_list .txt::before { content: ""; display: block; position: absolute; bottom: 100%; left: 50%; transform: translate(-50%, 0%); border: 0 solid transparent; } .ic_list li:hover .txt::before { border: 16px solid transparent; border-bottom-color: var(--i_color); } .ic_list .img::after { content: ""; display: block; width: 100%; height: 0%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.3); opacity: 0; } .ic_list li:hover .img::after { height: 100%; opacity: 1; } .ic_list h6 { text-align: center; text-transform: uppercase; font-size: 0.22rem; color: var(--font_color); font-weight: bold; position: relative; z-index: 2; } .ic_list li, .ic_list .txt::before, .ic_list .img::after, .ic_list iconify-icon, .ic_list h6 { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .ic_list li:hover { background-color: var(--i_color); } .ic_list li:hover h6 { color: #fff; } .ic_list li:hover iconify-icon { opacity: 1; } @media screen and (max-width: 1024px) { .ic_list .txt { padding: 0.1rem; } .ic_list h6 { font-size: 0.18rem; } } .brand_pic_list { width: 50%; display: flex; display: -webkit-flex; flex-wrap: wrap; justify-content: flex-end; } .brand_pic_list li { width: 20%; } .brand_pic_list a { display: block; width: 100%; position: relative; overflow: hidden; } .brand_pic_list a::before { content: ""; display: block; padding-bottom: 33%; } .brand_pic_list a img { max-width: 80%; object-fit: contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @media screen and (max-width: 1024px) { .brand_pic_list { width: 100%; margin-top: 0.2rem; } } .ip_list { width: 100%; padding: 0; margin: 0 auto; position: relative; overflow: hidden; z-index: 1; } .ip_list .swiper-wrapper { display: flex; position: relative; width: 100%; z-index: 1; } .ip_list .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-shrink: 0; position: relative; cursor: pointer; background: #fff; } .ip_list .wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .ip-button-prev, .ip-button-next { display: block; width: 0.45rem; height: 0.45rem; -webkit-border-radius: 6px; border-radius: 6px; background-color: var(--i_color); cursor: pointer; display: flex; display: -webkit-flex; justify-content: center; align-items: center; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .ip-button-prev iconify-icon, .ip-button-next iconify-icon { color: #fff; font-size: 0.24rem; } @media screen and (max-width: 1024px) { .ip-button-prev, .ip-button-next { width: 0.4rem; height: 0.4rem; } .ip_list iconify-icon { font-size: 0.18rem; } } @media screen and (max-width:560px){ .ip_list .wrap{ display: none; } } .ip-button-prev:hover, .ip-button-next:hover { transform: translateY(-6px); } .ip_list .swiper-wrapper { display: flex; position: relative; width: 100%; z-index: 1; -webkit-transition-timing-function: linear !important; -moz-transition-timing-function: linear !important; -ms-transition-timing-function: linear !important; -o-transition-timing-function: linear !important; transition-timing-function: linear !important; } .ip_list a { display: block; width: 100%; } .ip_list .img { width: 100%; position: relative; overflow: hidden; } .ip_list .img:before { content: ""; display: block; padding-bottom: 100%; } .ip_list .img img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain; } .ip_list .txt { position: absolute; top: 100%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); display: flex; display: -webkit-flex; justify-content: center; align-items: center; flex-direction: column; text-align: center; color: #fff; opacity: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .ip_list .txt iconify-icon { font-size: 0.3rem; } .ip_list h6 { margin-top: 0.2rem; width: 80%; font-size: 0.2rem; font-weight: bold; color: #fff; } .ip_list li:hover .txt { opacity: 1; top: 50%; } .ip_list li::after { content: ""; width: 100%; height: 0; background-color: var(--i_color); position: absolute; bottom: 0; left: 0; } .ip_list li:hover::after { height: 5px; } .ip_list li::before { content: ""; display: block; position: absolute; bottom: 0%; left: 50%; transform: translate(-50%, 0%); z-index: 2; border: 0 solid transparent; } .ip_list li:hover::before { border: 16px solid transparent; border-bottom-color: var(--i_color); } .ip_list li::after, .ip_list li::before { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .ia_list { display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; } .ia_list li:nth-child(2) { background-color: var(--i_color); } .ia_list li:first-child { width: 24%; } .ia_list li:nth-child(2) { width: 32%; padding: 0.6rem 0.5rem; transform: scale(110%); } .ia_list li:last-child { width: 40%; } .ia_list li:first-child img { width: 100%; } .ia_list article { color: #fff; line-height: 170%; max-height: 5rem; position: relative; overflow-y: auto; padding-right: 2%; } .ia_list article::-webkit-scrollbar { width: 2px; border-radius: 3px; } .ia_list article::-webkit-scrollbar-track { width: 1px; background-color: #d8d8d8; } .ia_list article::-webkit-scrollbar-thumb { background-color: var(--i_color); } .ia_list p { font-size: 0.18rem; color: var(); margin-top: 0.3rem; } .ia_tit h2 i { background: url(static/images/tit_white_icon.webp) no-repeat center/contain; } @media screen and (max-width: 1024px) { .ia_list li:first-child { width: 100%; display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .ia_list li:nth-child(2) { padding: 0.4rem 0.3rem; transform: scale(105%); } .ia_list li:first-child img { width: 49%; } .ia_list li:nth-child(2) { margin: 0.2rem 0; width: 100%; padding: 0.3rem 0.2rem; transform: scale(100%); } .ia_list li:last-child { width: 100%; } } @media screen and (max-width:560px){ .ip_list .txt { display: none; } } .ia_video { position: relative; overflow: hidden; } .ia_video { position: relative; overflow: hidden; } .ia_video::before { content: ""; display: block; padding-bottom: 100%; } .ia_video img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .i_v_btn::after { content: ""; display: block; width: 0.98rem; height: 0.98rem; background: url(static/images/video_cilcle.png) center no-repeat; background-size: cover; position: absolute; z-index: 10; top: 50%; left: 50%; transform: translate(-50%, -50%); animation: video 10s linear infinite; cursor: pointer; } .i_v_btn { position: absolute; top: 50%; left: 50%; box-sizing: border-box; padding-left: 3%; transform: translate(-50%, -50%); width: 0.33rem; height: 0.33rem; background: url(static/images/video_san.png) center no-repeat; background-size: contain; } @keyframes video { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } } @media screen and (max-width: 1440px) { .i_v_btn::after { width: 0.8rem; height: 0.8rem; } } @media screen and (max-width: 1024px) { } /* eject videos */ .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: -0.2rem; right: -0.2rem; width: 0.4rem; height: 0.4rem; 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: 0.44rem; 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: 0.4rem; } } @media screen and (max-width: 768px) { .vd_box { width: 88%; } .close_v { top: -0.15rem; right: -0.15rem; width: 0.3rem; height: 0.3rem; } .close_v::before { font-size: 0.3rem; } } @media screen and (max-width: 1024px) { .vd_box { width: 80%; } .close_v::before { font-size: 0.4rem; } } @media screen and (max-width: 768px) { .vd_box { width: 88%; } .close_v { top: -0.15rem; right: -0.15rem; width: 0.3rem; height: 0.3rem; } .close_v::before { font-size: 0.3rem; } } .i_ad { background: #f6f6f6; display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; position: relative; overflow: hidden; } .i_ad .img { width: 50%; } .i_ad .img img { width: 100%; height: 100%; object-fit: cover; } .ad_list li { display: flex; display: -webkit-flex; align-items: center; margin-bottom: 0.3rem; } .i_ad_txt { width: 50%; display: flex; display: -webkit-flex; justify-content: center; flex-direction: column; align-items: flex-start; padding-left: 5%; } .i_ad_txt .i_tit h6 { color: #999; } .ad_list .ico { min-width: 0.75rem; min-height: 0.75rem; display: flex; display: -webkit-flex; justify-content: center; align-items: center; background-color: var(--i_color); -webkit-border-radius: 50%; border-radius: 50%; margin-right: 0.2rem; } .ad_list .ico img { max-width: 0.6rem; -webkit-filter: brightness(100); -moz-filter: brightness(100); -o-filter: brightness(100); -ms-filter: brightness(100); filter: brightness(100); } .ad_list h6 { font-size: 0.28rem; font-weight: bold; } .ad_list p { font-size: 0.16rem; color: #999; margin-top: 0.1rem; } @media screen and (max-width: 1024px) { .i_ad { background: rgba(10, 31, 77, 0.5); } .i_ad .img { width: 100%; height: 100%; z-index: -1; opacity: 0.8; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .i_ad_txt { width: 100%; padding: 0.2rem; } .ad_list .ico { width: 0.6rem; height: 0.6rem; } .ad_list .ico img { max-width: 0.4rem; } .ad_list h6 { font-size: 0.2rem; } } .i_process { background: url(static/images/bc_ic.webp) no-repeat center; background-size: cover; } .i_process_list { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .i_process_list li { width: 19%; position: relative; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .i_process_list li:nth-child(even) { transform: translateY(0.36rem); } .i_process_list:hover li:nth-child(even) { transform: translateY(0); } .i_process_list:hover li:nth-child(odd) { transform: translateY(0.36rem); } .i_process_list a { display: block; width: 100%; height: 100%; z-index: 2; position: relative; overflow: hidden; padding: 0.5rem 0.3rem; background: #eee; text-align: center; border-bottom: 2px solid var(--i_color); } .i_process_list .img { margin: 0 auto; width: 0.8rem; height: 0.8rem; border-radius: 50%; position: relative; display: flex; display: -webkit-flex; justify-content: center; align-items: center; } .i_process_list .img img { max-width: 0.8rem; } .i_process_list span { display: table; width: 0.2rem; line-height: 0.2rem; background: #9c9c9c; -webkit-border-radius: 50%; border-radius: 50%; font-size: 0.16rem; color: #fff; text-align: center; position: absolute; top: -0.1rem; right: -0.1rem; z-index: 5; } .i_process_list h6 { text-transform: capitalize; margin: 0.1rem 0; font-size: 0.24rem; color: var(--font_color); font-weight: bold; } .i_process_list p { margin-bottom: 0.6rem; font-size: 0.16rem; color: #4d4d4d; } @media screen and (max-width: 1440px) { .i_process_list h6 { font-size: 0.2rem; } .i_process_list li { width: 23%; } } @media screen and (max-width: 768px) { .i_process_list .img { width: 0.6rem; height: 0.6rem; } .i_process_list li { width: 48%; margin-bottom: 0.6rem; } } .i_n_list { display: flex; display: -webkit-flex; flex-wrap: wrap; } .i_new .i_n_list li { width: calc((100% - 3 * 0.34rem) / 4); margin-right: 0.3rem; margin-bottom: 0.36rem; position: relative; overflow: hidden; } .i_new .i_n_list li:nth-child(4n) { margin-right: 0; } @media screen and (max-width: 1024px) { .i_new .i_n_list { justify-content: space-between; } .i_new .i_n_list li { width: 49%; margin-right: 0; } } @media screen and (max-width: 560px) { .i_new .i_n_list li { width: 100%; margin-right: 0; } } .i_n_list a { display: block; width: 100%; height: 100%; position: relative; z-index: 2; } .i_n_list .img { position: relative; overflow: hidden; } .i_n_list .img::before { content: ""; display: block; padding-bottom: 72.5%; } .i_n_list .img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .i_n_list .img::after { content: ""; width: 0; height: 100%; background: rgba(0, 0, 0, 0.3); position: absolute; top: 0; left: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .i_n_list li:hover .img::after { width: 100%; } .i_n_list .img iconify-icon { font-size: 0.3rem; color: #fff; position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%); z-index: 2; opacity: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .i_n_list li:hover .img iconify-icon { opacity: 1; } .i_n_list .txt { padding: 0.4rem 0.1rem; width: 86%; margin: 0 auto; margin-top: -0.26rem; background-color: #fff; position: relative; } .i_n_list .date { padding: 6px 0.3rem; color: #fff; font-size: 16px; background-color: var(--i_color); position: absolute; left: 0.2rem; top: -0.3rem; } .i_n_list h6 { text-transform: capitalize; font-size: 0.2rem; color: var(--i_color2); font-weight: bold; line-height: 120%; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .i_n_list h5 { font-size: 0.16rem; color: #4d4d4d; margin: 0.3rem 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .i_n_list .i_btn { margin: 0.3rem 0; } .in_more { display: table; padding: 0.12rem 0; position: relative; background: none; } .in_more b { display: flex; display: -webkit-flex; justify-content: center; align-items: center; color: var(--font_color); font-size: 0.18rem; } .in_more iconify-icon { margin-left: 6px; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .in_more:hover b { color: var(--i_color); } .in_more:hover iconify-icon { transform: rotate(45deg); } .i_n_list li:hover .in_more b { color: var(--i_color); } .i_n_list li:hover .in_more iconify-icon { transform: rotate(45deg); } .i_n_list li:hover h6 { color: var(--i_color); } @media screen and (max-width: 1024px) { .i_n_list h6 { font-size: 0.18rem; } .i_n_list h5 { margin: 0.1rem 0; } .in_more b { font-size: 0.16rem; } } .i_contact { width: 100%; max-width: 1920px; aspect-ratio: 1920 / 250; margin-left: auto; margin-right: auto; background: url(static/images/footer_top_bg.webp) no-repeat center; background-size: cover; position: relative; display: flex; } .i_contact .wrap { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; position: relative; z-index: 2; } .i_contact h6 { width: 37.31%; font-size: 0.26rem; color: #fff; font-weight: bold; } .i_contact .img { width: 35%; } .i_contact img { width: 100%; } .i_contact .txt { width: 30%; display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .i_contact p { font-size: 0.24rem; color: #fff; margin: 0; } .i_contact article a { font-size: 0.28rem; color: #fff; text-decoration: none; display: block; } @media screen and (max-width: 1440px) { .i_contact h6 { font-size: 0.2rem; } .i_contact p { font-size: 0.2rem; } .i_contact article a { font-size: 0.2rem; } } @media screen and (max-width: 1024px) { .i_contact img { z-index: -1; opacity: 0.5; height: 100%; object-fit: contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .i_contact h6 { padding-top: 0.05rem; width: 100%; } .i_contact .txt { width: 100%; margin: 0.1rem 0; } .i_contact h6 { font-size: 0.18rem; } .i_contact p { font-size: 0.18rem; } .i_contact article a { font-size: 0.18rem; } } @media screen and (max-width: 560px) { .i_contact { aspect-ratio: auto; } .i_contact h6 { padding-top: 0.2rem; } } /* -------------------内页--------------------- */ .in_banner { width: 100%; position: relative; overflow: hidden; } .in_banner .img { position: relative; z-index: 2; overflow: hidden; } .in_banner .img::after { content: ""; display: block; padding-bottom: 26.04%; } .in_banner .img img { width: 101%; height: 101%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .in_banner > .wrap { position: absolute; top: 32%; left: 50%; transform: translate(-50%, -50%); z-index: 2; } .in_banner h2 { font-size: 0.42rem; text-transform: capitalize; color: #fff; font-weight: 900; } @media screen and (max-width: 1440px) { .in_banner h2 { font-size: 0.3rem; font-weight: bold; } } @media screen and (max-width: 1024px) { .in_banner .img::after { padding-bottom: 36.04%; } } @media screen and (max-width: 768px) { .in_banner h2 { font-size: 0.26rem; } } @media screen and (max-width: 560px) { .in_banner h2 { font-size: 0.2rem; } } .in_position { position: absolute; bottom: 0; left: 0; z-index: 2; padding: 0.2rem 0; background: transparent; width: 100%; background-color: rgba(27, 13, 0, 0.45); } .in_position a { display: block; float: left; font-size: 16px; color: #fff; position: relative; line-height: 20px; text-transform: uppercase; } .in_position a:first-child { padding-left: 24px; background: url("https://api.iconify.design/carbon/home.svg?color=white") no-repeat left / contain; background-size: 16px; } .in_position a:not(:last-child):after { content: ">"; margin: 0 0.1rem; 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 a { font-size: 15px; } .in_position { padding: 0.1rem 0; position: relative; background-color: var(--i_color2); } } @media screen and (max-width: 767px) { .in_position a { font-size: 14px; } } @media screen and (max-width: 560px) { .in_position a { font-size: 12px; } } /* ----------------------contact--------------------------- */ .c_list { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; border-bottom: 1px solid #d8d8d8; } .c_list li { width: 23%; display: -webkit-flex; display: flex; align-items: center; } .c_list li:last-child img { max-width: 1.4rem; object-fit: contain; } .c_list .ico { width: 1rem; height: 1rem; background: var(--i_color); position: relative; flex-shrink: 0; } .c_list .ico iconify-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0.4rem; color: #fff; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .c_list li:hover .ico iconify-icon { transform: translate(-50%, -50%) rotateY(360deg); } .c_list .info { margin-left: 0.28rem; } .c_list .info span { margin-bottom: 8px; margin-right: 6px; font-size: 0.18rem; color: #333; font-weight: bold; display: block; } .c_list .info a, .c_list .info h5 { font-size: 0.18rem; color: #333; line-height: 0.26rem; } .c_list .info a { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .c_list .info a:hover { text-decoration: underline; color: var(--i_color); } @media screen and (max-width: 1366px) { .c_list .info a, .c_list .info h5 { font-size: 0.18rem; } } @media screen and (max-width: 1024px) { .c_list li { width: 48%; margin-bottom: 0.2rem; } .c_list .ico { width: 0.5rem; height: 0.5rem; } .c_list .ico iconify-icon { font-size: 0.24rem; } .c_list .info span { font-size: 17px; } .c_list .info a, .c_list .info h5 { font-size: 17px; } } @media screen and (max-width: 560px) { .c_list li { width: 100%; } .c_list .ico { width: 0.4rem; height: 0.4rem; } .c_list .info { margin-left: 0.2rem; } .c_list .info a, .c_list .info h5 { font-size: 15px; line-height: 0.2rem; } } .c_box { display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; align-items: center; } .c_box .txt { width: 28%; } .c_media { display: -webkit-flex; display: flex; flex-wrap: wrap; gap: 0 0.2rem; } .c_media p { width: 100%; font-size: 0.18rem; font-weight: bold; margin-bottom: 0.12rem; color: #222; } .c_media a { width: 0.38rem; height: 0.38rem; display: flex; display: -webkit-flex; justify-content: center; align-items: center; background: #cdcdcd; -webkit-border-radius: 3px; border-radius: 3px; padding: 0.1rem; } .c_media iconify-icon { font-size: 0.26rem; color: #fff; } .c_media a:hover { background: var(--i_color); } .c_form { width: 68%; background-color: #ededed; padding: 0.6rem; margin-bottom: 0.3rem; } .c_form h6 { font-size: 0.36rem; font-weight: bold; color: #222; margin-bottom: 0.2rem; } @media screen and (max-width: 1440px) { .c_form { padding: 0.4rem; } .c_form h6 { font-size: 0.3rem; } } @media screen and (max-width: 1024px) { .c_box .txt { width: 100%; margin-bottom: 0.2rem; } .c_form { width: 100%; padding: 0.2rem; } .c_form h6 { font-size: 0.22rem; } } #wpforms-147 { --input_font_size: 14px; --input_height: 50px; } #wpforms-147 .wpforms-field-description { margin: 0.2rem auto; font-size: 0.16rem; color: #333; line-height: 150%; } #wpforms-147 .wpforms-field { padding: 0; margin: 0; } #wpforms-147 .wpforms-field-label { font-size: 0; } #wpforms-147 .wpforms-required-label { position: absolute; top: 14px; left: 0; font-size: 16px; color: #f00; } #wpforms-147 .wpforms-field { width: 100%; background: transparent; margin-bottom: 0.2rem; position: relative; overflow: hidden; } #wpforms-147 .wpforms-field-container { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } #wpforms-147-field_1-container, #wpforms-147-field_2-container { width: 49% !important; } #wpforms-147-field_3-container, #wpforms-147-field_4-container { width: 100% !important; } #wpforms-147 input, #wpforms-147 textarea { width: 100%; max-width: 100% !important; min-width: 100%; font-size: var(--input_font_size); color: #333; height: var(--input_height); border: none; border-bottom: 1px solid #c4c4c4; padding: 0 10px; } #wpforms-147 textarea { line-height: 22px; min-height: 120px; padding: 10px; } #wpforms-147 button { display: table; padding: 0.1rem 0.5rem; margin-right: auto; margin-top: 0.3rem; background-color: var(--i_color); color: #fff; font-size: 0.18rem; position: relative; overflow: hidden; z-index: 2; border: none; -webkit-border-radius: 6px; border-radius: 6px; } #wpforms-147 .wpforms-submit-container button::before { content: ""; width: 200%; height: 200%; position: absolute; top: 100%; left: 50%; border-radius: 40%; transform: translateX(-50%); background: var(--i_color2); transition: 0.5s ease; display: block; z-index: -1; } #wpforms-147 .wpforms-submit-container button:hover { color: #fff; } #wpforms-147 .wpforms-submit-container button:hover::before { top: -10%; } #wpforms-147 input::-webkit-input-placeholder, #wpforms-147 textarea::-webkit-input-placeholder { color: #4d4d4d; font-size: var(--input_font_size); } #wpforms-147 input::-moz-placeholder, #wpforms-147 textarea::-moz-placeholder { color: #4d4d4d; font-size: var(--input_font_size); } #wpforms-147 input::-ms-input-placeholder, #wpforms-147 textarea::-ms-input-placeholder { color: #4d4d4d; font-size: var(--input_font_size); } #wpforms-147 .wpforms-field-container .wpforms-field > input { background: transparent; } #wpforms-147 .wpforms-field-container textarea { background: transparent; } #wpforms-147 .wpforms-field-container .wpforms-field > input:hover, #wpforms-147 .wpforms-field-container textarea:hover, #wpforms-147 .wpforms-field-container .wpforms-field > input:focus, #wpforms-147 .wpforms-field-container textarea:focus { border: none; border-bottom: var(--i_color) 1px solid; outline: none; box-shadow: none; } @media screen and (max-width: 1024px) { .i_form .wrap { padding: 0.4rem; } #wpforms-147 { --input_font_size: 16px; --input_height: 40px; } } @media screen and (max-width: 560px) { .i_form .wrap { padding: 0.2rem; } #wpforms-147-field_1-container, #wpforms-147-field_2-container { width: 100% !important; } #wpforms-147 button { margin-top: 0.1rem; } } /* 合作伙伴 */ .par_partner { position: relative; } .par_partner_list { width: 100%; padding: 0; margin: 0 auto; position: relative; overflow: hidden; z-index: 1; } .par_partner_list .swiper-wrapper { display: flex; position: relative; width: 100%; z-index: 1; } .par_partner_list .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-shrink: 0; position: relative; cursor: pointer; background: #fff; } .par_partner_list .img { width: 100%; position: relative; overflow: hidden; /* border: 1px solid #d6d6d6; */ } .par_partner_list .img:before { content: ""; display: block; padding-bottom: 34.19%; } .par_partner_list .img img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain; } .par_partner_list .img img { transition: all 0.5s linear; } .par_partner_list .swiper-wrapper { display: flex; position: relative; width: 100%; z-index: 1; -webkit-transition-timing-function: linear !important; -moz-transition-timing-function: linear !important; -ms-transition-timing-function: linear !important; -o-transition-timing-function: linear !important; transition-timing-function: linear !important; } /* -----------------------news--------------------------- */ .new_box { display: flex; display: -webkit-flex; flex-wrap: wrap; align-items: flex-start; justify-content: center; } .new_box .i_n_list { width: 100%; margin-right: auto; } .in_list li { width: calc(100% / 3 - 2%); margin-right: 3%; margin-bottom: 0.36rem; overflow: hidden; } .in_list li:nth-child(3n) { margin-right: 0; } @media screen and (max-width: 1024px) { .in_list { justify-content: space-between; } .in_list li { width: 49%; margin-right: 0; } } .n_r_box { width: 22%; margin-left: auto; } @media screen and (max-width: 959px) { .new_box .i_n_list { width: 100%; } .n_r_box { width: 100%; } } @media screen and (max-width: 560px) { .in_list li { width: 100%; } } .n_tit { font-size: 0.32rem; text-transform: uppercase; color: var(--font_color); margin-bottom: 0.1rem; } @media screen and (max-width: 1440px) { .n_tit { font-size: 0.24rem; } } @media screen and (max-width: 1024px) { .n_tit { font-size: 0.18rem; } } .n_list { padding-top: 0.1rem; border-top: 1px solid #ededed; } .n_list li { width: 100%; margin-bottom: 0.2rem; padding: 0.2rem 0; border-bottom: 1px solid #ededed; position: relative; } .n_list li::after { content: ""; width: 24%; height: 1px; background-color: var(--i_color); position: absolute; bottom: 0; left: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .n_list li:hover:after { width: 100%; } .n_list a { width: 100%; height: 100%; align-items: center; display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; } .n_list .img { width: 24%; position: relative; overflow: hidden; } .n_list .img::before { content: ""; display: block; padding-bottom: 70%; } .n_list .img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .n_list .img::after { content: ""; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); position: absolute; top: 0; left: 0; opacity: 0; } .n_list .img iconify-icon { font-size: 0.2rem; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; opacity: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .n_list .txt { width: 70%; font-size: 16px; color: var(--font_color); line-height: 150%; } .n_list h3 { font-size: 0.18rem; text-transform: uppercase; margin-bottom: 0.1rem; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .n_list .data { font-size: 14px; } .n_list li h3 { transition: all 0.5s ease; -webkit-transition: all 0.5s ease; } .n_list li:hover h3 { color: var(--i_color); } .n_list li:hover .img::after { opacity: 1; } .n_list li:hover .img iconify-icon { opacity: 1; } .n_gallery { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .n_gallery li { width: 32%; position: relative; overflow: hidden; margin-bottom: 0.1rem; } .n_gallery li::before { content: ""; display: block; padding-bottom: 100%; } .n_gallery li img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } /* ---------------about---------------- */ .in_about { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .in_about .txt { width: 36%; } .in_about article { width: 58%; background: url(static/images/bc_in_a.webp) no-repeat center; background-size: cover; } .in_about article, .in_about article * { font-size: 0.18rem; line-height: 150%; color: var(--font_color); } .in_about article * p { min-height: 20px; } @media screen and (max-width: 1024px) { .in_about .txt { width: 100%; } .in_about article { width: 100%; } } .b_num_list { display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; } .b_num_list dt { width: 28%; background: #eee; padding: 0.2rem; position: relative; } .b_num_list dt img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotateY(180deg); opacity: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .b_num_list dt:hover img { transform: translate(-50%, -50%); opacity: 1; } .b_num_list i { font-size: 0.52rem; color: #222; font-weight: bold; text-transform: uppercase; position: relative; z-index: 2; } .b_num_list p { padding-top: 0.2rem; font-size: 0.18rem; color: #222; font-weight: bold; line-height: 150%; position: relative; } .b_num_list p::after { content: ""; width: 0.2rem; height: 5px; background-color: var(--i_color); position: absolute; top: 0; left: 0; } .b_num_list dt:hover i { color: #fff; } .b_num_list dt:hover p { color: #fff; } @media screen and (max-width: 1440px) { .b_num_list i { font-size: 0.5rem; } } @media screen and (max-width: 1366px) { .b_num_list i { font-size: 0.4rem; } } @media screen and (max-width: 1024px) { .b_num_list i { font-size: 0.3rem; } .b_num_list p { margin-top: 0.1rem; font-size: 14px; } } @media screen and (max-width: 768px) { .b_num_list dt { width: 100%; margin-bottom: 0.2rem; } .b_num_list i { font-size: 0.2rem; } } .env { background: url(https://lingjuimg.com/wp-content/uploads/BengBuBoJing/2026/09/组-1241.png) no-repeat center; background-size: cover; } @media screen and (min-width: 560px) { .env { background-attachment: fixed; } } .env_list { position: relative; overflow: hidden; } .env_list .swiper-wrapper { display: -webkit-flex; display: flex; position: relative; width: 100%; } .env_list .swiper-slide { flex-shrink: 0; position: relative; } .env-prev, .env-next { width: 0.45rem; height: 0.45rem; background-color: var(--i_color); cursor: pointer; display: flex; display: -webkit-flex; justify-content: center; align-items: center; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .env-prev iconify-icon, .env-next iconify-icon { color: #fff; font-size: 0.24rem; } .env_but { display: flex; display: -webkit-flex; justify-content: center; align-items: center; } .env_list .swiper-button-disabled { cursor: not-allowed; } .env-pagination { display: none; text-align: center; } .env-pagination .swiper-pagination-bullet { width: 0.08rem; height: 0.08rem; display: inline-block; margin: 0 6px; background: #ccc; -webkit-border-radius: 50%; border-radius: 50%; outline: none; cursor: pointer; } .env-pagination .swiper-pagination-bullet-active { background: var(--i_color); } @media screen and (max-width: 560px) { .env-prev, .env-next { display: none; } .env-pagination { display: block; } } .env_list .img { width: 100%; position: relative; overflow: hidden; } .env_list .img::before { content: ""; display: block; padding-bottom: 67.17%; } .env_list .img img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .env_list .swiper-slide:hover img { width: 106%; height: 106%; } .in_ad { background: url(static/images/bc_in_ad.webp) no-repeat center; background-size: cover; } .in_ad_list { display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; } .in_ad_list li { width: 30%; box-sizing: border-box; text-align: left; padding: 0.3rem 0.2rem; background-color: #fff; } .in_ad_list .img { width: 1rem; height: 1rem; -webkit-border-radius: 50%; border-radius: 50%; display: flex; display: -webkit-flex; justify-content: center; align-items: center; } .in_ad_list img { max-width: 0.77rem; } .in_ad_list h6 { margin: 0.2rem auto; font-size: 0.28rem; text-transform: capitalize; color: var(--i_color2); font-weight: bold; } .in_ad_list p { font-size: 0.16rem; color: #4d4d4d; line-height: 150%; } .in_ad_list li, .in_ad_list p, .in_ad_list h6, .in_ad_list .img { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .in_ad_list li:hover .img { background: var(--i_color); transform: rotateY(180deg); } .in_ad_list li:hover img { -webkit-filter: brightness(100); -moz-filter: brightness(100); -o-filter: brightness(100); -ms-filter: brightness(100); filter: brightness(100); } @media screen and (max-width: 1440px) { .in_ad_list li { padding: 0.3rem 0.2rem; } .in_ad_list .img { width: 0.8rem; height: 0.8rem; } .in_ad_list img { max-width: 0.66rem; } } @media screen and (max-width: 1024px) { .in_ad_list .img { width: 0.6rem; height: 0.6rem; } .in_ad_list img { max-width: 0.5rem; } .in_ad .txt { width: 100%; margin-bottom: 0.3rem; } .in_ad_list li { padding: 0.2rem 0.1rem; } .in_ad article { font-size: 0.16rem; margin: 0.2rem 0 0.3rem; } } @media screen and (max-width: 768px) { .in_ad_list li { width: 100%; margin-bottom: 0.2rem; } .in_ad_list h6 { margin: 0.1rem 0; font-size: 0.18rem; } } @media screen and (max-width: 560px) { .in_ad_list img { max-width: 0.45rem; } .in_ad_list p, .in_ad article { font-size: 14px; } } .about_us_video { margin-top: -2rem; background: url("https://lingjuimg.com/wp-content/uploads/BengBuBoJing/2026/09/视频.webp") center no-repeat; background-size: cover; background-attachment: fixed; position: relative; } @media screen and (max-width: 560px) { .about_us_video { background-attachment: fixed; } } .in_ad { padding-bottom: 3rem; } @media screen and (max-width: 1024px) { .in_ad { padding-bottom: 2rem; } .about_us_video { margin-top: -1rem; } } @media screen and (max-width: 560px) { .in_ad { padding-bottom: 1rem; } .about_us_video { margin-top: -0.5rem; } } .about_us_video::after { content: ""; display: block; padding-bottom: 35%; } .about_us_i { display: block; width: 0.75rem; height: 0.75rem; -webkit-border-radius: 50%; border-radius: 50%; border: 5px solid var(--i_color2); background: url("https://api.iconify.design/ph/triangle-fill.svg?color=%2329abe2&rotate=90deg") center no-repeat; background-size: 0.3rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); cursor: pointer; z-index: 2; } .about_us_i::after { content: ""; position: absolute; transform: translate(-50%, -50%); border-radius: 50%; top: 50%; left: 50%; width: 110%; height: 110%; background-color: rgba(255, 255, 255, 0.3); animation: yuan 1.9s ease-in-out infinite; z-index: -1; } .about_us_i::before { content: ""; position: absolute; transform: translate(-50%, -50%); border-radius: 50%; top: 50%; left: 50%; width: 130%; height: 130%; background-color: rgba(255, 255, 255, 0.2); animation: yuans 1.5s ease-in-out infinite; z-index: -1; } @keyframes yuan { 0% { width: 110%; height: 110%; } 50% { width: 120%; height: 120%; } 100% { width: 110%; height: 110%; } } @keyframes yuans { 0% { width: 130%; height: 130%; } 50% { width: 150%; height: 150%; } 100% { width: 130%; height: 130%; } } @media screen and (max-width: 1024px) { .about_us_video::after { padding-bottom: 45%; } .about_us_i { width: 0.6rem; height: 0.6rem; } } @media screen and (max-width: 560px) { .about_us_i { width: 0.5rem; height: 0.5rem; border: 2px solid var(--i_color2); } .v_btn::before { border: 2px solid #fff; } } /* -------------------------products---------------------- */ .p_menu { display: flex; display: -webkit-flex; /* justify-content: space-between; */ flex-wrap: wrap; gap: 3%; } .p_menu li { width: calc((100% - 6 * 3%) / 7); background-color: #fff; text-align: center; position: relative; } .p_menu li::after { content: ""; width: 100%; height: 2px; background-color: var(--i_color); position: absolute; left: 0; bottom: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .p_menu li.current::after, .p_menu li:hover::after { height: 100%; } .p_menu a { display: block; font-size: 0.18rem; color: #333; text-transform: uppercase; padding: 0.1rem 0; position: relative; z-index: 2; } .p_menu li.current a, .p_menu li:hover a { color: #fff; } .p_tit { display: none; } @media screen and (max-width: 1024px) { .p_tit { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding: 0.1rem 0.2rem; background-color: var(--i_color2); } .p_tit p { font-size: 0.18rem; font-weight: bold; color: #fff; } .p_tit iconify-icon { font-size: 0.18rem; color: #fff; } .p_menu { display: none; margin: 0; width: 100%; } .p_menu li { width: 100%; max-width: 100%; } .p_menu a { font-size: 0.16rem; width: 100%; } } .in_p_list { display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; } .in_p_list li { width: 48%; background-color: #ededed; padding: 0.2rem; margin-bottom: 0.3rem; } .in_p_list a { display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .in_p_list .txt { width: 60%; } .in_p_list .img { width: 35%; position: relative; overflow: hidden; } .in_p_list .img::before { content: ""; display: block; padding-bottom: 100%; } .in_p_list .img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .in_p_list h6 { font-size: 0.2rem; color: var(--font_color); font-weight: bold; position: relative; padding-bottom: 0.1rem; margin-bottom: 0.1rem; border-bottom: 1px solid #d8d8d8; } .in_p_list h6::after { content: ""; width: 30%; height: 1px; background-color: var(--i_color); position: absolute; bottom: -1px; left: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .in_p_list li:hover h6::after { width: 100%; } .in_p_list li:hover h6 { color: var(--i_color); } .in_p_list .txt .ipl_box span { color: #d83600; } .ipl_p { margin-bottom: 0.2rem; } .ipl_box article * { margin: revert; padding: revert; list-style: revert; line-height: 1.5; } @media screen and (max-width: 1024px) { .in_p_list h6 { font-size: 0.18rem; } .in_p_list article, .in_p_list article * { font-size: 0.14rem; line-height: 150%; } .in_p_list li { width: 100%; } } @media screen and (max-width: 560px) { .in_p_list li { padding: 0.1rem; } .in_p_list h6 { font-size: 0.16rem; } .in_p_list .img { width: 100%; } .in_p_list .txt { width: 100%; margin-top: 0.1rem; } } /* Number of pages */ .in_page_box { margin-top: 0.3rem; 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: 0.32rem; margin: 0 0.04rem; } .in_page a, .in_page span { display: block; padding: 0 0.12rem; line-height: 0.32rem; font-size: 0.14rem; color: #666; background: #fff; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; border-radius: 1rem; border: 1px solid var(--border_color); overflow: hidden; } .in_page > i { margin-top: 0.14rem; width: 100%; font-size: 0.13rem; 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: 0.4rem; } } @media screen and (max-width: 768px) { .in_page li { min-width: 0.28rem; } .in_page a, .in_page span { line-height: 0.28rem; padding: 0 0.1rem; } } @media screen and (max-width: 560px) { .in_page_box { margin-top: 0.3rem; } } /* ------------------------详情页---------------------------- */ .pd_box { display: flex; display: -webkit-flex; align-items: flex-start; flex-wrap: wrap; } .pd_content { width: 56%; margin-right: auto; } .p_brief { width: 41%; margin-left: auto; } .txt_ul { display: flex; gap: 0.2rem 5%; flex-wrap: wrap; margin-top: 0.3rem; } .txt_ul li { width: calc((100% - 5%) / 2); padding-bottom: 0.1rem; border-bottom: 1px solid #d8d8d8; } .txt_ul li p { font-weight: bold; } .txt_price { font-size: 0.22rem; color: #d83600; } @media screen and (max-width: 1024px) { .pd_content, .p_brief { width: 100%; } .txt_ul li { width: 100%; } } /* atlas */ .p_atlas { height: 100%; position: relative; flex-shrink: 0; overflow: hidden; } .p_atlas::before { content: ""; display: block; padding-bottom: 80%; } .p_atlas_list { position: absolute; top: 0; left: 0; width: calc(100% - 20%); height: 100%; background: #fff; box-sizing: border-box; border: 1px solid #ddd; overflow: hidden; } .p_atlas_list .swiper-wrapper { display: -webkit-flex; display: flex; position: relative; height: 100%; } .p_atlas_list .swiper-slide { height: 100%; flex-shrink: 0; position: relative; overflow: hidden; cursor: pointer; } .p_atlas_list .swiper-slide img { width: 100%; height: 100%; object-fit: cover; } .p_atlas_list .swiper-slide iframe, .p_atlas_list .swiper-slide video { width: 100%; height: 100%; background: #000; object-fit: contain; } /* thumbnail */ .p_thumbnail { position: absolute; top: 0; right: 0; width: 18%; height: 100%; } .p_thumbnail_list { width: 100%; height: 100%; box-sizing: border-box; position: relative; overflow: hidden; } .p_thumbnail_list .swiper-wrapper { flex-direction: column; position: relative; width: 100%; } .p_thumbnail_list .swiper-slide { position: relative; box-sizing: border-box; border: 1px solid #ddd; overflow: hidden; cursor: pointer; } .p_thumbnail_list .swiper-slide::before { content: ""; position: absolute; width: 100%; height: 0; left: 0; top: 0; z-index: 1; background: rgba(0, 0, 0, 0.35); pointer-events: none; transition: all 0.35s ease; } .p_thumbnail_list .swiper-slide.swiper-slide-thumb-active::before { height: 100%; } .p_thumbnail_list .swiper-slide img { width: 100%; height: 100%; object-fit: cover; } @media screen and (max-width: 560px) { .p_atlas { height: auto; overflow: visible; } .p_atlas::before { display: none; } .p_atlas_list { position: relative; width: 100%; height: auto; aspect-ratio: 1 / 0.8; } .p_thumbnail { position: relative; top: auto; right: auto; width: 100%; height: 0; margin-top: 0.08rem; padding-bottom: calc((100% - 9%) / 4); } .p_thumbnail_list { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .p_thumbnail_list .swiper-wrapper { flex-direction: row; height: 100%; } .p_thumbnail_list .swiper-slide { height: 100% !important; } } .p_v_btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 0.32rem; height: 0.26rem; background: var(--i_color); -webkit-border-radius: 0.1rem; border-radius: 0.1rem; font-size: 0.12rem; color: #fff; } .p_v_btn::before { position: absolute; top: 50%; left: 52%; transform: translate(-50%, -50%); } .thumbnail-prev, .thumbnail-next { position: absolute; top: 50%; transform: translate(0, -50%); width: 0.5rem; height: 0.5rem; background: rgb(0 0 0 / 20%); z-index: 3; cursor: pointer; outline: none; -webkit-user-select: none; user-select: none; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; z-index: 3; } .thumbnail-prev { left: -0.6rem; } .thumbnail-next { right: -0.6rem; } .p_atlas:hover .thumbnail-prev { left: 0; } .p_atlas:hover .thumbnail-next { right: 0; } .thumbnail-prev iconify-icon, .thumbnail-next iconify-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0.26rem; color: #fff; } .p_atlas_list .swiper-button-disabled { cursor: not-allowed; } .thumbnail-prev:hover, .thumbnail-next:hover { background: var(--i_color); } .thumbnail-pagination { position: absolute; top: 0.16rem; right: 0.2rem; text-align: center; } .thumbnail-pagination, .thumbnail-pagination span { font-size: 0.18rem; color: #aaa; } .thumbnail-pagination .swiper-pagination-current { font-size: 0.34rem; color: var(--i_color); } .p_brief h1 { font-size: 0.2rem; color: var(--font_color); font-weight: bold; text-transform: capitalize; padding: 0.2rem 0.3rem; background-color: #fff; border-top: 2px solid var(--i_color); } .p_brief .txt { padding: 0.2rem 0.3rem; font-size: 0.22rem; color: var(--font_color); margin-top: 0.2rem; background-color: #fff; } .p_brief .i_more { width: 100%; } .share { display: -webkit-flex; justify-content: flex-end; display: flex; flex-wrap: wrap; align-items: center; } .share p { font-size: 0.2rem; font-weight: bold; color: #363636; } .share a { margin-left: 0.2rem; } .share a iconify-icon { font-size: 0.24rem; color: #d8d8d8; } .share a img { max-width: 0.24rem; opacity: 0.2; } .share a:hover iconify-icon { color: var(--i_color); } .tag { display: flex; display: -webkit-flex; flex-wrap: wrap; } .tag p, .tag a { font-size: 0.18rem; line-height: 200%; color: #333; } .tag p { width: 100%; font-weight: bold; color: var(--i_color2); } .tag a { display: table; padding: 0.1rem 0.2rem; background-color: #fff; margin-right: 0.15rem; position: relative; text-transform: capitalize; transition: all 0.3s ease; } .tag a:hover { color: var(--i_color); } .description h6 { font-size: 0.26rem; color: var(--i_color2); font-weight: bold; padding: 0.1rem 0; border-bottom: 1px solid #ddd; margin-bottom: 0.2rem; } .description article { font-size: 0.16rem; color: var(--font_color); } .description article * { line-height: 150%; } .description article p { min-height: 20px; } .r_p_list { position: relative; } .rp_l { position: relative; overflow: hidden; z-index: 1; } .r_p_list .swiper-wrapper { display: flex; position: relative; width: 100%; z-index: 1; } .r_p_list .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-shrink: 0; position: relative; cursor: pointer; } .rp-button-prev, .rp-button-next { width: 0.45rem; height: 0.45rem; -webkit-border-radius: 6px; border-radius: 6px; background-color: var(--i_color); cursor: pointer; display: flex; display: -webkit-flex; justify-content: center; align-items: center; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; } .rp-button-prev iconify-icon, .rp-button-next iconify-icon { color: #fff !important; font-size: 0.24rem; } .rp-button-prev:hover, .rp-button-next:hover { background: var(--i_color2); } .rp-button-prev { left: 5%; } .rp-button-next { right: 5%; } .rp-pagination { display: none; } @media screen and (max-width: 1024px) { .rp-pagination { display: block; text-align: center; margin-top: 0.3rem; } .rp-button-prev, .rp-button-next { display: none; } } .rp-pagination .swiper-pagination-bullet { width: 0.13rem; height: 0.15rem; display: inline-block; margin: 0 6px; background: #ccc; outline: none; cursor: pointer; } .rp-pagination .swiper-pagination-bullet-active { background: var(--i_color); } .r_p_list a { display: block; width: 100%; } .r_p_list h6 { font-size: 0.18rem; color: #222; font-weight: bold; margin: 0.22rem 0.2rem; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .r_p_list .img { width: 100%; position: relative; overflow: hidden; } .r_p_list .img::before { content: ""; display: block; padding-bottom: 99%; } .r_p_list .img img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain; } .r_p_list .img::after { content: ""; width: 100%; height: 0%; background: rgb(0 0 0 / 30%); position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 0); -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .r_p_list li:hover .img::after { height: 100%; } .r_p_list .img_box { position: relative; } .r_p_list .img_box::after { content: ""; width: 100%; height: 0; background-color: var(--i_color); position: absolute; bottom: 0; left: 0; } .r_p_list li:hover .img_box::after { height: 5px; } .r_p_list .img_box::before { content: ""; display: block; position: absolute; bottom: 0%; left: 50%; transform: translate(-50%, 0%); z-index: 2; border: 0 solid transparent; } .r_p_list li:hover .img_box::before { border: 16px solid transparent; border-bottom-color: var(--i_color); } .r_p_list .img_box::after, .r_p_list .img_box::before { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .r_p_list .rp_icon { font-size: 0.4rem; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; opacity: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .r_p_list li:hover .rp_icon { opacity: 1; } /* ---------------------------------contact_map------------------------------- */ .contact_map_bac { box-sizing: border-box; } .contact_map { height: 5.8rem; } .contact_map #simpleMap, .contact_map .fluid-width-video-wrapper, .contact_map iframe { width: 100%; height: 100% !important; } @media screen and (max-width: 1440px) { } @media screen and (max-width: 1200px) { .contact_map { height: 5rem; } } @media screen and (max-width: 1024px) { .contact_map { height: 4.5rem; } } @media screen and (max-width: 960px) { } @media screen and (max-width: 768px) { .contact_map { height: 4rem; } } @media screen and (max-width: 560px) { } @media screen and (max-width: 425px) { }