@charset "UTF-8";
@import url(./main.css);
@import url(./commer.css);
@import url(./mbnav.css);
@import url(./banner.css);
body { --base-color: #00611a; min-height: 100vh; display: flex; flex-direction: column; }

.bgc-f6 { background-color: #f6f6f6; }

.page-main { flex: 1; }

.title { flex: 1; display: flex; flex-direction: column; align-items: center; position: relative; margin-bottom: 30px; }

.title_cn { color: var(--base-color); margin: 5px 0; font-size: 32px; font-weight: bold; letter-spacing: 4px; }

.title_en { color: #999; font-size: 16px; display: inline-block; margin-bottom: 20px; position: relative; }

.title_en:after { content: ""; position: absolute; width: 80px; background-color: var(--base-color); height: 3px; left: 50%; transform: translateX(-50%); bottom: -20px; }

.hover-scale { cursor: pointer; }

.hover-scale:hover img { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); }

.hover-translateY { cursor: pointer; }

.hover-translateY:hover { box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px; -webkit-transform: translateY(-2%); -moz-transform: translateY(-2%); -ms-transform: translateY(-2%); -o-transform: translateY(-2%); transform: translateY(-2%); }

.wz-text-p { font-size: 1rem; color: #363636; line-height: 1.7; text-align: justify; }

.wz-text-p2 { font-size: 1rem; color: #363636; line-height: 1.7; text-align: justify; text-indent: 2em; }

.wz-col { width: 100%; }

.wz-colbox { margin: -10px; }

.wz-row { padding: 10px; box-sizing: border-box; }

.wz-rowbox { overflow: hidden; width: 100%; border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px; background-color: #fff; }

.wz-title { font-weight: bold; font-size: 19px; margin-bottom: 10px; color: #000; }

.wz-img { width: 100%; overflow: hidden; object-fit: contain; }

.wz-img img { width: 100%; }

.wz-font { flex: 1; padding: 10px; }

.wz-text { font-size: 15px; text-align: justify; color: #525b69; }

.wz-time { font-size: 14px; color: #999; line-height: 14px; }

.wz-time .time-icon { width: 14px; height: 16px; margin-right: 10px; }

.card .wz-row:hover .wz-rowbox { box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; }

.card .wz-font { padding: 15px; }

.card .wz-title { margin-bottom: 0; }

.card .wz-text { font-size: 13px; color: #808080; flex: 1; margin: 8px 0; }

.card-two .wz-rowbox { background-color: #f2f2f2; display: block; overflow: hidden; border: 1px solid #e4e3f0; padding: 0.5rem; border-radius: 0; }

.card-two .wz-rowbox:hover p { color: var(--base-color); }

.card-two .wz-img { align-self: 370 / 215; }

.card-two .wz-font { padding: 2%; margin-top: 8px; background-color: #e0e9f2; }

.card-two .wz-font p { color: #333; text-align: center; font-size: 16px; color: #444; max-width: 72%; }

.card-two .wz-font span { margin: 0 8px; display: block; content: ""; width: 8px; height: 8px; background-color: var(--base-color); }

.technical .wz-img { aspect-ratio: 380 / 260; }

/* ===== 企业优势 开始 ===== */
/* 样式继承公共类名 wz- 中的样式 */
.advantage { background-color: #f6f6f6; }

.advantage-one .wz-img { aspect-ratio: 285 / 185; }

.advantage-two .wz-rowbox { padding: 15px; }

.advantage-two .wz-img { width: 64px; margin-bottom: 10px; aspect-ratio: 1 / 1; }

.advantage-two .wz-font { padding: 0; }

/* ===== 企业优势 结束 ===== */
/* ===== 企业文化 开始 ===== */
.culture-one .items { background-color: var(--base-color); color: #fff; padding: 20px; box-sizing: border-box; }

.culture-one .items h4 { font-size: 22px; color: #fff; font-weight: bold; margin-bottom: 10px; }

.culture-one .items p { line-height: 1.7; text-align: justify; color: rgba(255, 255, 255, 0.9); }

.culture-one .left-item { width: 50%; }

.culture-one .left-item .items { aspect-ratio: 1 / 1; width: 49%; }

.culture-one .right-item { width: 49%; align-self: normal; }

.culture-one .right-item .items { height: 100%; }

.culture-two { background-color: #fff; }

.culture-two .culture-item { width: 100%; box-sizing: border-box; background-color: #f4f5fa; display: flex; align-items: center; padding: 20px; border-radius: 10px; }

.culture-two .culture-item .icon-box { width: 70px; height: 70px; margin-right: 20px; }

.culture-two .culture-item .text-box { flex: 1; }

.culture-two .culture-item .text-box .h1 { font-weight: bold; font-size: 22px; color: #000; }

.culture-two .culture-item .text-box p { font-size: 14px; margin-top: 10px; color: #000; }

.culture-three { width: 100%; height: 592px; background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; }

.culture-three .title { color: #fff; margin-bottom: 50px; }

.culture-three .title_en, .culture-three .title_cn { color: inherit; }

.culture-three .title:after { background-color: #fff; }

.culture-three::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.37); }

.culture-three .culture-wrap { position: relative; z-index: 5; }

.culture-three .wz-colbox { height: 350px; }

.culture-three .wz-row { position: relative; }

.culture-three .wz-rowbox { box-shadow: none; padding: 20px; background-color: transparent; }

.culture-three .wz-row:not(:first-child)::after { content: ""; position: absolute; left: 0; top: 0; width: 1px; height: 100%; background: rgba(255, 255, 255, 0.3); }

.culture-three .wz-img { overflow: hidden; width: 50px; aspect-ratio: 1 / 1; object-fit: contain; margin-bottom: 20px; }

.culture-three .wz-text { font-size: 14px; text-align: center; color: #fff; }

.culture-three .wz-h2 { text-align: center; font-size: 18px; font-weight: normal; margin-bottom: 25px; color: #fff; position: relative; }

.culture-three .wz-h2::after { content: ''; position: absolute; width: 20px; height: 1px; background: #fff; left: 50%; bottom: -10px; transform: translateX(-50%); }

@media screen and (max-width: 768px) { .culture-one .culture-content { flex-direction: column; }
  .culture-one .items { padding: 15px; }
  .culture-one .items p { line-height: 1.5; }
  .culture-one .left-item { width: 100%; margin-bottom: 2%; }
  .culture-one .right-item { width: 100%; }
  .culture-one .right-item .items h4 { text-align: center; width: 100%; margin: 10px 0; }
  .culture-three .title { margin-bottom: 30px; }
  .culture-three .wz-row:after { content: none !important; }
  .culture-three .wz-rowbox { padding: 0px; }
  .culture-three .way { flex-direction: column; }
  .culture-three .way-left-wrapper { width: 100%; }
  .culture-three .way-right-wrapper { margin-top: 30px; width: 100%; } }

/* ======= 企业文化 结束 ===== */
/* ===== 办公环境 开始 ===== */
.office .wz-rowbox { border-radius: 0; box-shadow: none; }

/* ===== 办公环境 结束 ===== */
/* ===== 关于我们 开始 ===== */
.about .culture-one .culture-content { margin-bottom: 1%; }

@media screen and (max-width: 768px) { .about .culture-one .culture-content { margin-bottom: 2%; } }

.index .introduce-one .con h3 { font-weight: normal !important; }

.index .introduce-one .con .top-p { font-weight: normal !important; color: #999 !important; font-size: 15px !important; margin-bottom: 10px !important; }

.introduce-one .introduce-wrap:nth-child(1) .image-item { max-width: 480px; width: 46%; aspect-ratio: 480 / 305; }

.introduce-one .introduce-wrap:nth-child(2) { margin-top: 20px; }

.introduce-one .introduce-wrap:nth-child(2) .image-item { max-width: 535px; width: 46%; aspect-ratio: 535 / 310; }

.introduce-one .introduce-wrap .text-item { flex: 1; }

.introduce-one .introduce-wrap .con { max-height: 361px; overflow-y: auto; box-sizing: border-box; }

.introduce-one .introduce-wrap .con h3 { color: var(--base-color); font-weight: bold; font-size: 23px; }

.introduce-one .introduce-wrap .con .top-p { font-weight: bold; color: #333; margin-bottom: 5px; font-size: 18px; }

.introduce-one .introduce-value { min-height: 260px; background-position: center; background-repeat: no-repeat; background-size: cover; color: #fff; }

.introduce-one .introduce-value-wrap { width: 100%; }

.introduce-one .introduce-value h1 { font-weight: bold; margin-bottom: 20px; }

.introduce-one .introduce-value h1, .introduce-one .introduce-value p { color: inherit; }

.introduce-one .video-item { max-width: 520px; }

.introduce-two { background-size: 100% 450px; background-repeat: no-repeat; background-position: top center; }

.introduce-two .introduce-wrap { position: relative; }

.introduce-two .h1-title { margin-top: 40px; width: 100%; margin-bottom: 20px; text-align: center; font-weight: bold; font-size: 26px; color: var(--base-color); }

.introduce-two .wz-text-p2 { line-height: 2; margin-bottom: 40px; }

.introduce-two .text-box2 { align-self: flex-start; width: 60%; margin-top: 8%; }

.introduce-two .image-box { max-width: 443px; width: 37%; aspect-ratio: 443 / 510; position: absolute; bottom: 0; right: 0; }

@media only screen and (max-width: 1366px) { .introduce .introduce-one .text-item .con { max-height: 295px; } }

@media only screen and (max-width: 768px) { .introduce-one .introduce-wrap { flex-direction: column; }
  .introduce-one .introduce-wrap:nth-child(1) .text-item { margin-left: 0; }
  .introduce-one .introduce-wrap:nth-child(2) { margin-top: 0; }
  .introduce-one .introduce-wrap:nth-child(2) .text-item { margin-right: 0; }
  .introduce-one .introduce-wrap:nth-child(2) .image-item { margin-top: 20px; }
  .introduce-one .introduce-wrap .image-item { margin: 0 0 20px 0; max-width: 100% !important; width: 100% !important; display: flex; align-items: center; justify-content: center; aspect-ratio: auto !important; }
  .introduce-one .introduce-wrap .text-item .con { max-height: 100%; padding: 0; }
  .introduce-two { background-image: none !important; }
  .introduce-two .wz-text-p2 { margin-bottom: 10px; }
  .introduce-two .text-box2 { width: 100%; margin-top: 0; }
  .introduce-two .image-box { display: none; }
  .index .introduce-one .introduce-wrap .video-item { margin-top: 10px; margin-bottom: 0; margin-left: 0; }
  .index .introduce-one .introduce-wrap .image-item { margin-top: 10px; margin-bottom: 0; } }

.about-history .h3-txt { font-weight: bold; color: var(--base-color); margin: 30px 0 10px; }

.about-history .history-one .history-wrapper { padding: 40px 0; }

.about-history .history-one .hi-li { list-style-type: none; display: flex; align-items: stretch; font-size: 16px; }

.about-history .history-one .hi-year { padding: 20px 0; width: 15%; }

.about-history .history-one .hi-year .y-txt { margin-top: 10px; font-size: 20px; color: var(--base-color); }

.about-history .history-one .hi-year .p-txt { margin-top: 10px; font-size: 14px; }

.about-history .history-one .right-box { padding: 20px 0; border-bottom: 1px solid #e7cccc; flex: 1; }

.about-history .history-one .right-box .img-box { align-self: flex-start; width: 20%; border-radius: 6px; margin-right: 16px; aspect-ratio: 65 / 43; }

.about-history .history-one .right-box .img-box img { border-radius: inherit; }

.about-history .history-one .right-box .text-box { align-self: flex-start; flex: 1; }

.about-history .history-one .line-style { margin: 0 30px 0 20px; border-left: 1px solid #e7cccc; height: inherit; position: relative; }

.about-history .history-one .line-style:after { content: ""; position: absolute; top: 20%; background-color: var(--base-color); width: 8px; height: 8px; border-radius: 50%; left: -5px; }

.about-history .history-two { width: 100%; margin: 0 auto; padding-bottom: 2rem; }

.about-history .history-two .history-wrapper { margin: 0; padding: 0; width: 1200px; list-style: none; }

.about-history .history-two .hi-li { list-style-type: none; display: flex; align-items: center; /* margin-bottom: 40px; */ font-size: 16px; }

.about-history .history-two .hi-year { background-color: var(--base-color); width: 140px; padding: 10px; text-align: center; color: #fff; font-weight: bold; position: relative; z-index: 10; }

.about-history .history-two .hi-year::after { content: ""; position: absolute; left: 50%; top: 40px; height: 315px; width: 2px; background-color: var(--base-color); }

.about-history .history-two .right-box { margin-left: 100px; position: relative; flex: 1; }

.about-history .history-two .right-box:before { content: ""; position: absolute; left: -90px; top: 50%; width: 80px; border-bottom: 1px dashed var(--base-color); }

.about-history .history-two .right-box::after { content: ""; position: absolute; left: 0px; top: 50%; height: 45%; transform: translateY(-50%); border-left: 1px dashed var(--base-color); }

.about-history .history-two .type1 .right-box::after { height: 61%; }

.about-history .history-two .type2 .right-box::after { height: 77%; }

.about-history .history-two .type3 .right-box::after { height: 78%; }

.about-history .history-two .hi-text { padding: 10px 20px; background-color: #f8f8f8; margin: 10px 0 10px 50px; position: relative; }

.about-history .history-two .hi-text::after { content: ""; position: absolute; left: 3px; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; border-radius: 50%; background-color: var(--base-color); }

.about-history .history-two .hi-text::before { content: ""; position: absolute; left: -45px; top: 50%; width: 40px; border-bottom: 1px dashed var(--base-color); }

.about-history .history-two .hi-li:last-child { margin-bottom: 0; }

.about-history .history-two .hi-li:last-child .hi-year::after { content: none; }

.about-history .history-three { width: 100%; margin: 0 auto; padding-bottom: 2rem; }

.about-history .history-three .history-wrapper { margin: 0; padding: 0; width: 1200px; list-style: none; }

.about-history .history-three .hi-li { list-style-type: none; display: flex; align-items: center; /* margin-bottom: 40px; */ font-size: 16px; }

.about-history .history-three .hi-year { background-color: var(--base-color); width: 140px; padding: 10px; text-align: center; color: #fff; font-weight: bold; position: relative; z-index: 10; }

.about-history .history-three .hi-year::after { content: ""; position: absolute; left: 50%; top: 40px; height: 75px; width: 2px; background-color: var(--base-color); }

.about-history .history-three .right-box { position: relative; flex: 1; }

.about-history .history-three .hi-text { padding: 10px 20px; background-color: #f8f8f8; margin: 15px 0 15px 50px; position: relative; }

.about-history .history-three .hi-text::after { content: ""; position: absolute; left: 3px; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; border-radius: 50%; background-color: var(--base-color); }

.about-history .history-three .hi-text::before { content: ""; position: absolute; left: -45px; top: 50%; width: 40px; border-bottom: 1px dashed var(--base-color); }

.about-history .history-three .hi-li:last-child { margin-bottom: 0; }

.about-history .history-three .hi-li:last-child .hi-year::after { content: none; }

@media only screen and (max-width: 768px) { .about-history .history-one { overflow-x: auto; }
  .about-history .history-one .history-wrapper { width: 1200px; }
  .about-history .history-one .hi-year { width: 7%; }
  .about-history .history-one .right-box .img-box { width: 15%; }
  .about-history .history-two { overflow-x: auto; } }

/* ===== 关于我们 结束 ===== */
/* ===== 业务 开始 ===== */
.business .text-p { font-size: 1rem; color: #363636; line-height: 2; text-align: justify; text-indent: 2em; }

.business .wz-rowbox { border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px; }

.business .item { height: 100%; padding: 20px; }

.business .item .icon-box { max-width: 48px; width: 100%; aspect-ratio: 1 / 1; }

.business .item .text-box { margin-top: 10px; }

.business .item .text-box p { color: #333; }

/* ===== 业务 结束 ===== */
/* ===== 新闻中心 开始 ===== */
.news .wz-img { aspect-ratio: 387 / 265; }

@media screen and (max-width: 430px) { .news .wz-img { max-width: 100%; }
  .news .wz-img img { width: 100%; } }

/* ===== 新闻中心 结束 ===== */
/* ===== 资质证书 开始 ===== */
.aptitude .wz-img { aspect-ratio: 360 / 250; }

/* ===== 资质证书 结束 ===== */
/* ===== 人才招聘 开始 ===== */
.job-content { background-color: #f2f2f2; }

.job-content .items-list { background-color: #fff; padding: 16px; border-radius: 8px; margin-bottom: 16px; cursor: pointer; }

.job-content .items-list .avatar { width: 64px; margin-right: 16px; }

.job-content .items-list .right-box { flex: 1; }

.job-content .items-list .title-box { margin-bottom: 8px; font-size: 18px; }

.job-content .items-list .title-box .tit-txt { color: #000; }

.job-content .items-list .title-box .money-txt { margin-left: 8px; color: #f0902c; font-weight: 500; }

.job-content .items-list .desc-txt { color: #999; }

.job-content .items-list .desc-txt p { flex: auto; font-size: 14px; padding-right: 8px; }

.job-content .items-list .btn .icon { width: 25px; height: 25px; }

.job-content .items-list .detail-box { display: none; color: #999; margin: 20px 0; }

.job-content .items-list .detail-box h3 { color: #0b0e9e; font-size: 16px; padding: 10px 0; }

.job-content .items-list .detail-box p { flex: auto; line-height: 1.7; font-size: 0.9rem; }

.job-content .items-list .detail-box .email { margin-top: 10px; }

.job-two .wz-rowbox { box-shadow: none; border-radius: 0; background: #f3f3f4; padding: 2.75rem; position: relative; z-index: 1; background: -moz-linear-gradient(top, #f8f9fa 0%, #e5eaf1 100%); background: -webkit-gradient(linear, top, bottom, color-stop(0%, #f8f9fa), color-stop(100%, #e5eaf1)); background: -webkit-linear-gradient(top, #f8f9fa 0%, #e5eaf1 100%); background: -o-linear-gradient(top, #f8f9fa 0%, #e5eaf1 100%); background: -ms-linear-gradient(top, #f8f9fa 0%, #e5eaf1 100%); background: linear-gradient(to bottom, #f8f9fa 0%, #e5eaf1 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f9fa', endColorstr='#e5eaf1', GradientType=0); }

.job-two .top-box { border-bottom: 1px solid #cccdd1; padding-bottom: 25px; }

.job-two .top-box .avatar { width: 60px; margin-right: 30px; }

.job-two .top-box .right-box { font-size: 16px; color: #474747; }

.job-two .top-box .tit { font-size: 18px; margin-bottom: 5px; }

.job-two .top-box .time { font-size: 14px; color: #808080; }

.job-two .top-box .apply-btn { color: #fff; background-color: var(--base-color); }

.job-two .con { margin-top: 20px; height: 150px; overflow: auto; font-size: 14px; color: #808080; line-height: 1.8; }

@media screen and (max-width: 768px) { .job-two .wz-rowbox { padding: 20px; }
  .job-two .top-box { padding-bottom: 15px; }
  .job-two .right-box { flex-direction: column; align-items: start; }
  .job-two .right-box .apply-btn { width: 50%; margin-top: 10px; } }

/* 申请职位弹窗样式 */
.apply-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; }

.apply-modal-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); }

.apply-modal-content { position: relative; width: 90%; max-width: 500px; margin: 5% auto; background-color: #fff; border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); animation: modalFadeIn 0.3s ease; }

@keyframes modalFadeIn { from { opacity: 0;
    transform: translateY(-20px); }
  to { opacity: 1;
    transform: translateY(0); } }

.apply-modal-header { padding: 20px; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; background-color: #fff; border-radius: 8px 8px 0 0; }

.apply-modal-header h3 { margin: 0; font-size: 34px; font-weight: bold; color: #333; }

.btn-close { font-size: 30px; cursor: pointer; color: #999; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.3s; }

.btn-close:hover { background-color: #f0f0f0; color: #333; }

.apply-modal-body { padding: 20px; max-height: 70vh; overflow-y: auto; }

.form-group { margin-bottom: 15px; }

.form-group label { display: block; margin-bottom: 5px; font-weight: 500; color: #333; }

.form-group input, .form-group textarea { width: 100%; padding: 10px 12px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; box-sizing: border-box; transition: border-color 0.3s; }

.form-group input:focus, .form-group textarea:focus { outline: none; border-color: var(--base-color); box-shadow: 0 0 0 2px rgba(26, 173, 93, 0.2); }

.form-group textarea { resize: vertical; min-height: 100px; }

.form-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; }

.btn { padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s; display: inline-flex; align-items: center; justify-content: center; }

.btn-submit { background-color: var(--base-color); color: white; }

.btn-submit:hover { background-color: #179a50; transform: translateY(-1px); }

/* 响应式调整 */
@media screen and (max-width: 768px) { .apply-modal-content { width: 90%; margin: 10% auto; }
  .apply-modal-header { padding: 10px; }
  .apply-modal-header h3 { font-size: 22px; }
  .apply-modal-body { padding: 15px; }
  .form-group { margin-bottom: 10px; }
  .form-actions { flex-direction: column; }
  .btn { width: 100%; padding: 5px; } }

/* ===== 人才招聘 结束 ===== */
/* ===== 产品中心 开始 ===== */
.index .product .wz-img { aspect-ratio: 285 / 285; }

.product { /* 只对有子菜单的项目添加下拉箭头 */ }

.product .wz-text { margin: 0; }

.product-one { background-color: #f5f5f5; }

.product-one .left-wrapper { width: 250px; }

.product-one .left-wrapper .le-title { font-size: 22px; background-color: var(--base-color); color: #fff; padding: 15px 25px; border-radius: 30px 0 0 0; box-sizing: border-box; }

.product-one .left-wrapper .nav-menu { font-size: 16px; background-color: #fff; }

.product-one .left-wrapper .nav-menu a { cursor: pointer; padding: 14px 20px; color: #333; position: relative; border-top: 1px solid #ececec; display: flex; align-items: center; padding-left: 30px; }

.product-one .left-wrapper .nav-menu > .active { background-color: var(--base-color); color: #fff; }

.product-one .left-wrapper .nav-menu > .active::before { background-color: #fff; }

.product-one .left-wrapper .nav-menu > a::before { content: ""; border-radius: 50%; top: 50%; left: 15px; transform: translateY(-50%); width: 5px; height: 5px; background-color: var(--base-color); position: absolute; }

.product-one .left-wrapper .nav-menu > a:not(.active):hover { color: var(--base-color); }

.product-one .left-wrapper .nav-menu a { display: block; width: 100%; }

.product-one .left-wrapper .contact-us { margin-top: 30px; background-color: #fff; }

.product-one .left-wrapper .contact-us .le-title { border-radius: 0; }

.product-one .left-wrapper .contact-us-box { padding: 15px 20px; }

.product-one .left-wrapper .contact-us-box p { line-height: 1.7; font-size: 16px; color: #333; }

.product-one .right-wrapper { flex: 1; padding-left: 20px; }

.product-one .right-wrapper .wz-row { padding: 10px; }

.product-one .right-wrapper .wz-rowbox { border-radius: 0; padding: 10px 20px; }

.product-one .right-wrapper .wz-img { max-width: 300px; aspect-ratio: 1 / 1; }

.product-one .right-wrapper .wz-font { padding-bottom: 0; flex: 1; }

.product-one .right-wrapper .wz-text { font-weight: bold; text-align: center; font-size: 16px; }

.product-two { background-color: #fff; }

.product-two .bread { min-width: 200px; width: 250px; padding: 2%; background-color: #fff5f3; border-radius: 10px; align-self: flex-start; }

.product-two .bread .crumbs { margin-top: 10px; }

.product-two .bread .crumbs .items { cursor: pointer; padding: 10px 14px; box-sizing: border-box; display: block; color: inherit; }

.product-two .bread .crumbs .items:not(:last-child) { margin-bottom: 6px; }

.product-two .bread .crumbs .items a { color: #333; }

.product-two .bread .crumbs .items:hover { background-color: var(--base-color); border-radius: 6px; color: #fff; }

.product-two .bread .crumbs .items:hover a { color: #fff; }

.product-two .bread .crumbs .active { background-color: var(--base-color); border-radius: 6px; color: #fff; }

.product-two .bread .line { margin: 20px 0; border-top: 1px solid rgba(0, 0, 0, 0.06); }

.product-two .bread .contact-con .li-p { margin-top: 10px; }

.product-two .product_lists { padding-left: 30px; }

.product-two .product_lists .wz-img { max-width: 300px; aspect-ratio: 300 / 410; }

.product .navdemo { margin-top: 10px; width: 100%; }

.product .navdemo ul li { position: relative; }

.product .navdemo ul > li { cursor: pointer; padding: 10px 14px; box-sizing: border-box; }

.product .navdemo ul li:not(:last-child) { margin-bottom: 6px; }

.product .navdemo ul ul { margin-top: 10px; display: none; margin-left: 15px; /* 为子菜单添加背景色 */ }

.product .navdemo a { color: inherit; }

.product .navdemo ul ul { display: none; margin-left: 15px; /* 为子菜单添加背景色 */ }

.product .navdemo > ul > li:has( > ul) > a::after { content: '▶'; position: absolute; right: 10px; color: var(--base-color); transition: transform 0.3s ease; }

.product .navdemo > ul > li:has( > ul).active > a::after { content: "▼"; transform: rotate(0deg); }

.product .navdemo ul ul > li:has( > ul) > a::after { content: "▶"; position: absolute; right: 10px; font-size: 12px; transition: transform 0.3s ease; }

.product .navdemo ul ul > li:has( > ul).active > a::after { content: "▼"; transform: rotate(0deg); }

@media only screen and (max-width: 1043px) { .product-one .left-wrapper { display: none; }
  .product-one .right-wrapper { padding-left: 0; }
  .product-one .right-wrapper .wz-text { font-size: 14px; }
  .product-one .right-wrapper .wz-rowbox { padding: 10px; }
  .product-two .bread { display: none; }
  .product-two .product_lists { padding-left: 0; }
  .product-two .wz-font { padding: 10px; }
  .product-two .wz-title { font-size: 16px; }
  .product-two .wz-text { margin: 0; } }

/* ===== 产品中心 结束 ===== */
/* ===== 详情页 开始 ===== */
.detail .item_title { text-align: center; margin-bottom: 20px; }

.detail .item_title h1 { font-weight: bold; font-size: 24px; color: #333; }

.detail .item_title p { margin: 10px 0 10px; font-size: 16px; color: #999; }

.detail .item_container p { width: 100%; text-indent: 2em; color: #333; font-size: 16px; line-height: 1.7; margin-bottom: 10px; }

.detail .item_container p:has(img) img { text-indent: 0; margin: 0 auto; display: block; max-width: 100%; width: auto; }

/* ===== 详情页 结束 ===== */
/* ===== 联系我们 开始 ===== */
.contact-one .contact-left-wrapper { color: #000; margin-right: 20px; }

.contact-two .contact-left-wrapper { padding: 30px; color: #fff; height: 80%; background-color: var(--base-color); }

.contact-two .contact-left-wrapper .con-title .title-name { font-weight: bold; font-size: 22px; margin-bottom: 6px; }

.contact-three .contact-title { margin: 20px 0; display: flex; justify-content: space-between; }

.contact-three .contact-title .h1 { font-size: 24px; font-weight: normal; }

.contact-three .contact-title .h2 { font-size: 14px; margin-top: 6px; font-weight: normal; }

.contact-three .contact-title .logo { width: 160px; }

.contact-three .contact_container { display: flex; justify-content: space-between; margin: 30px 0; }

.contact-three .left-wrapper { width: 50%; display: flex; flex-wrap: wrap; justify-content: space-between; }

.contact-three .left-wrapper .items { width: 48%; box-sizing: border-box; background-color: #f2f2f2; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 210px; }

.contact-three .left-wrapper .items p { font-size: 18px; margin: 10px; }

.contact-three .left-wrapper .items h4 { font-weight: bold; font-size: 16px; padding: 0 16px; text-align: center; }

.contact-three .left-wrapper .items img { width: 82px; height: 82px; object-fit: contain; }

.contact-three .left-wrapper .items:nth-child(1), .contact-three .contact .left-wrapper .items:nth-child(2) { margin-bottom: 22px; }

.contact-three .right-wrapper { width: 48%; height: 450px; z-index: 10; }

.contact-three .contact_message { margin: 0px 0 30px; }

.contact-three .contact_message .message-title { display: flex; flex-direction: column; align-items: center; position: relative; }

.contact-three .contact_message .message-title-wrapper { display: inline-block; margin: 0 auto; text-align: left; background-color: #fff; z-index: 200; width: 100%; }

.contact-three .contact_message .message-title-cn { font-size: 24px; margin-bottom: 10px; font-weight: bold; color: var(--base-color); }

.contact-three .contact_message .message-title-en { font-size: 14px; }

.contact-three .from-box { margin: 40px 0 0; }

.contact-three .from-item { display: flex; flex-direction: column; flex: 1; margin-right: 20px; margin-bottom: 20px; }

.contact-three .from-item:last-child { margin-right: 0; }

.contact-three .from-item .from-le { color: #333; margin-bottom: 10px; font-size: 16px; }

.contact-three .from-item .from-ri { outline: none; padding: 10px; box-sizing: border-box; background-color: #f2f3f5; }

.contact-three .from-item input { flex: 1; background-color: transparent; }

.contact-three .textarea-item { display: flex; flex-direction: column; }

.contact-three .textarea-item .from-le { margin-bottom: 10px; }

.contact-three .textarea-item textarea { background-color: transparent; border-color: #fff; }

.contact-three .from-btn { cursor: pointer; margin-top: 40px; background-color: var(--base-color); height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 16px; border-radius: 4px; }

.contact-left-wrapper { flex: 1; box-sizing: border-box; }

.contact-left-wrapper .con-title .title-tit { font-size: 28px; }

.contact-left-wrapper .con-title .title-name { font-size: 18px; }

.contact-left-wrapper .con-title .title-en { font-size: 34px; font-weight: 600; margin-bottom: 6px; }

.contact-left-wrapper .ul-address { margin: 10px 0; }

.contact-left-wrapper .ul-address .li-p { font-size: 16px; line-height: 2; }

.contact .qr-code-wrapper { margin-top: 20px; }

.contact .qr-code-wrapper .qr-code { width: 126px; height: 124px; }

.contact .qr-code-wrapper .contact-btn { margin-top: 10px; background-color: var(--base-color); padding: 8px 28px; border-radius: 4px; font-size: 14px; border: none; color: #fff; cursor: pointer; }

.contact-right-wrapper { width: 60%; height: 400px; }

.contact .tdt-control-copyright img { width: auto; height: auto; }

.contact .map-title { font-size: 18px; color: var(--base-color); }

.contact .map-p { margin: 10px 0; font-size: 14px; }

@media only screen and (max-width: 768px) { .contact-one > div, .contact-two > div { flex-direction: column; }
  .contact-one .contact-left-wrapper, .contact-two .contact-left-wrapper { width: 100%; }
  .contact-one .contact-right-wrapper, .contact-two .contact-right-wrapper { margin-top: 30px; width: 100%; }
  .contact-three .contact_container { flex-direction: column; }
  .contact-three .left-wrapper { width: 100%; }
  .contact-three .left-wrapper .items p { font-size: 16px; }
  .contact-three .left-wrapper .items h4 { font-size: 14px; }
  .contact-three .logo { display: none; }
  .contact-three .right-wrapper { margin-top: 20px; width: 100%; }
  .contact-three .from-item { margin-right: 0; }
  .contact-three .from-box { margin-top: 20px; }
  .contact-three .from-con > div { flex-direction: column; }
  .contact-three .textarea-item .from-ri { height: 150px; } }

/* ===== 联系我们 结束 ===== */
/* ===== 案例展示 开始 ===== */
.case-one .wz-rowbox { border-radius: 4px; transition: all .2s; }

.case-one .wz-rowbox:hover { background-color: var(--base-color); }

.case-one .wz-rowbox:hover .wz-title { color: #fff; }

.case-one .wz-rowbox:hover .wz-img::before { top: 50%; opacity: 1; }

.case-one .wz-rowbox:hover .wz-img img { opacity: 0.6; }

.case-one .wz-img { position: relative; aspect-ratio: 410 / 280; }

.case-one .wz-img:before { font-size: 24px; line-height: 38px; position: absolute; z-index: 3; top: 60%; left: 50%; display: inline-block; width: 40px; height: 40px; margin-left: -20px; content: '+'; -webkit-transition: all .4s; transition: all .4s; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); text-align: center; opacity: 0; color: #fff; border: 1px solid #fff; border-radius: 50%; }

.case-one .wz-title { text-align: center; font-weight: normal; font-size: 16px; color: #333; }

.case-two .wz-rowbox { border-radius: 4px; transition: all .2s; }

.case-two .wz-row:hover .wz-rowbox { box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px; }

.case-two .wz-img { aspect-ratio: 410 / 280; position: relative; cursor: pointer; }

.case-two .wz-title { text-align: center; font-weight: normal; font-size: 16px; color: #333; }

/* 视频弹窗样式 */
.video-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); z-index: 9999; justify-content: center; align-items: center; }

.video-modal.active { display: flex; }

.video-modal-content { position: relative; width: 80%; max-width: 900px; height: 70vh; background-color: #000; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5); }

.close-video-btn { position: absolute; top: 15px; right: 15px; font-size: 30px; color: white; background: none; border: none; cursor: pointer; z-index: 10001; width: 40px; height: 40px; border-radius: 50%; background-color: rgba(0, 0, 0, 0.5); display: flex; justify-content: center; align-items: center; transition: background-color 0.3s; }

.close-video-btn:hover { background-color: rgba(255, 255, 255, 0.7); }

.video-container { width: 100%; height: 100%; position: relative; }

.video-player { width: 100%; height: 100%; object-fit: contain; }

/* 播放按钮样式 */
.play-button { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60px; height: 60px; background-color: rgba(255, 255, 255, 0.8); border-radius: 50%; display: flex; justify-content: center; align-items: center; opacity: 0.8; transition: all 0.3s ease; cursor: pointer; z-index: 10; }

.play-button:hover { opacity: 1; transform: translate(-50%, -50%) scale(1.1); background-color: white; }

.play-button::before { content: ""; width: 0; height: 0; border-top: 12px solid transparent; border-left: 20px solid #333; border-bottom: 12px solid transparent; margin-left: 4px; /* 微调三角形位置 */ }

/* ===== 案例展示 结束 ===== */
/* ===== 门店列表 开始 ===== */
.shop .nav { border-bottom: 1px solid #ebedf0; }

.shop .nav-box { display: flex; gap: 20px; }

.shop .nav-item { padding: 20px 10px; cursor: pointer; }

.shop .nav-item.active { position: relative; color: var(--base-color); font-size: 16px; }

.shop .nav-item.active:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background-color: var(--base-color); }

.shop .card .wz-title { flex: 1; }

.shop .card .wz-rowbox { box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px; }

.shop .card .wz-rowbox:hover { box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px; }

.shop .card .wz-row .status { color: #e06c1e; background-color: #dcfce7; border-radius: 50px; font-size: 12px; padding: 4px 8px; }

.shop .card .wz-row .line { border-bottom: 1px solid #f8f8f8; margin: 10px 0; }

.shop .card .wz-bt { color: #486bec; font-size: 15px; }

.shop .card .wz-table { width: 100%; border-collapse: collapse; font-size: 15px; }

.shop .card .wz-table td { padding: 6px; color: #262933; font-weight: 500; vertical-align: top; }

.shop .card .wz-table .label { color: #666; width: 150px; }

/* ===== 门店列表 结束 ===== */
/* ===== 公司照片 结束 ===== */
.company .left-wrap .wz-rowbox { aspect-ratio: 743 / 570; }

.company .left-wrap .wz-img { height: 100%; }

.company .right-wrap .wz-rowbox { aspect-ratio: 438 / 275; }

.company .right-wrap .wz-img { height: 100%; }

.company .wz-rowbox { box-shadow: none; }

.company .wz-img img { height: 100%; }

/* ===== 公司照片 结束 ===== */
.partner-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background-color: #eeeeee; }

.partner-grid .wz-img { aspect-ratio: 26 / 16; overflow: hidden; }

@media (max-width: 768px) { .partner-grid { grid-template-columns: repeat(2, 1fr); } }

/* ===== 分页组件 开始 ===== */
.pagination-container { padding: 20px 0; text-align: center; }

.pagination-desktop { display: flex; align-items: center; justify-content: center; gap: 10px; }

.page-btn { padding: 5px 14px; border: 1px solid #ddd; background-color: #fff; cursor: pointer; border-radius: 4px; font-size: 13px; color: #333; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; min-height: 32px; box-sizing: border-box; }

.page-btn:hover { background-color: #f5f5f5; }

.page-btn:disabled, .page-btn.disabled { color: #ccc; cursor: not-allowed; background-color: #f9f9f9; }

.page-number { width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #ddd; background-color: #fff; cursor: pointer; border-radius: 4px; font-size: 14px; color: #333; text-decoration: none; box-sizing: border-box; }

.page-number:hover { background-color: #f5f5f5; }

.page-number.active { background-color: var(--base-color); color: #fff; border-color: var(--base-color); cursor: default; }

.ellipsis { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; font-size: 14px; color: #666; }

.page-info { margin-left: 15px; color: #666; font-size: 14px; }

.page-numbers { display: grid; grid-auto-flow: column; gap: 10px; }

/* 隐藏桌面版分页 */
.hide-desktop { display: block; }

/* 显示移动版分页 */
.hide-mobile { display: none; }

/* 移动端分页样式 */
@media screen and (max-width: 768px) { /* 只显示上一页、下一页按钮和页数信息 */
  .pagination .page-btn:first-child, .pagination .page-btn:last-child, .page-info { display: block; }
  /* 重新设计移动端的布局 */
  .pagination-mobile { display: flex; align-items: center; justify-content: center; gap: 15px; }
  .pagination-mobile .page-btn { padding: 0; width: 30px; aspect-ratio: 1 / 1; font-size: 16px; }
  .pagination-mobile .page-info { font-size: 16px; margin: 0 10px; }
  /* 隐藏桌面版分页 */
  .hide-desktop { display: none; }
  /* 显示移动版分页 */
  .hide-mobile { display: block; } }

/* ===== 分页组件 结束 ===== */