.text-red{ color: #8f1d22;}
.text-white{ color: #fff;}
.align-center{ text-align: center;}
.gray-bg{ background: #f5f5f5;}
.white-bg{ background: #fff;}
.red-bg{ background: #8f1d22;}
.img-width{ width: 100%;}
.nproduct_banner{width:100%;position:relative;overflow: hidden; height: 680px;}
.product_banner_bg{position: absolute;width: 100%;height: 100%; color: #fff; background-position: center center; background-size: cover; transition: background-size 4s ease-in-out; height: 680px;} 

.product_banner_bg:hover{}
@keyframes smoothScale {
  0% {
    background-size: auto 100%;
  }
  100% {
    background-size: auto 110%;
  }
}

.product_banner_bg .banner_content{height: 100%;display: flex;flex-direction: column;justify-content: center;}
.nproduct_banner .banner-en{ font-size: 30px;line-height: 40px; font-family: Impact; text-transform: uppercase; }
.nproduct_banner .banner-title h3{font-weight:400;font-size:60px;line-height:80px;color:#fff}
.nproduct_banner .banner-ds{ width: 55%; font-size: 16px;line-height: 32px;}
@media only screen and (max-width:750px) {
   .nproduct_banner{width:100%;position:relative;overflow: hidden; height: 320px;}
    .product_banner_bg{position: absolute;width: 100%;  color: #fff;  }
    .nproduct_banner img{transition: all 0.5s ease-in-out; }
    .nproduct_banner:hover img{transform: scale(1.05);}
    .banner-en{ font-size: 14px;line-height: 40px;  text-transform: uppercase;}
    .nproduct_banner .banner-title h3{font-weight:400;font-size:18px;line-height:30px;color:#fff}
    .nproduct_banner .banner-ds{ width: 100%; font-size: 12px;line-height: 24px;}
}
  .el-row {
    margin-bottom: 20px;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .frame-item i {
  animation: frameicon 8s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
  transform: translateZ(0);
  will-change: transform;
  display: inline-block; /* 确保transform正常工作 */
}

.frame-item:hover i {
  animation: frameicon 12s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
  filter: drop-shadow(0 0 6px currentColor);
}

@keyframes frameicon {
  0%, 100% { 
    transform: rotate(0deg) scale(1);
  }
  25% { 
    transform: rotate(12deg) scale(1.05);
  }
  75% { 
    transform: rotate(-12deg) scale(1.05);
  }
}

/* 移动端优化 */
@media (max-width: 768px) {
  .frame-item i {
    animation-duration: 10s; /* 移动端慢一些 */
  }
  .frame-item:hover i {
    animation-duration: 5s;
  }
}
.product-title{ text-align: center;  font-weight: 400; margin-bottom: 30px;} 
.product-title h3{ font-size: 30px; line-height: 40px;}
.product-title p{ font-size: 16px; line-height: 40px;}
.pro_page_col1{    padding: 30px 20px;    background: #8f1d22; color: #fff;   border-radius: 10px; position: relative; font-size: 18px; line-height: 36px; min-height: 15vh;}

.pro_page_col1 i{ position: absolute; bottom: 8vh; right: 20px; font-size: 150px; color: #9b3438; transition: all 0.5s ease-in-out;}
.pro_page_col1:hover i{ transform: scale(1.15) rotate(15deg);}
.pro_page_col1 p{ position: relative;  z-index: 10;}
.pro-page1-bg1{  background: url("../product/c2-2.jpg") no-repeat center center; background-size: cover;}
.pro_page_icon{ background: #fff; text-align: center; padding: 60px 0; border-radius: 10px; color: #8f1d22;}
.pro_page_icon i{ font-size: 80px;  transition: all 0.5s ease-in-out;}
.pro_page_icon:hover i{ transform: scale(1.15);}

.pro_page_icon p{ font-size: 20px; line-height: 30px; font-weight: 600;}
.pro_page1-bg2{  background: url("../product/ipt3_video_cover.png") no-repeat right top;  position: relative; background-size: contain; animation: pulse 4s ease-in-out infinite;}
@keyframes pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.02);
  }
}

.pro_page1-bg2 .pro-logo{width: 200px; position: absolute; top: 50px; left: 50px;}
.pro_page1-bg2 .pro_page_box {color:#8f1d22; display: flex; flex-direction: column; justify-content: center; height: 300px; padding: 40px 0;}
.pro_page1-bg2 .pro_page_col2 {width:55%;}
.pro_page1-bg2 .pro_page_col2 h3{ font-size: 28px; padding-bottom: 30px; letter-spacing: 3px;}
.pro_page1-bg2 .pro_page_col2 p{ font-size: 18px; line-height: 36px; font-weight: 400;}
@media only screen and (max-width:750px) {  
  .pro_page_col1{ min-height: 20vh; margin-bottom: 20px;}
  .pro_page1-bg2 .pro_page_col2{width: 100%;}
}

.pro-page2-bg{  background: url(../product/c2-2.jpg) no-repeat center center; background-size: cover;}
.pro-page2-content-col1{ display: flex;justify-content: center; align-items: center;  width: 100%; gap: 0; box-sizing: border-box; background: #8f1d22;}
.pro-page2-content-col1 .pro-page2-content-img,.pro-page2-content-col1 .pro-page2-content-ds{flex: 1;box-sizing: border-box;}
.pro-page2-content-col1 .pro-page2-content-img{position: relative; overflow: hidden;}
.pro-page2-content-col1 .pro-page2-content-img img{ width: 100%; height: 100%; object-fit: cover; transition: all 0.5s ease-in-out;}
.pro-page2-content-col1 .pro-page2-content-img:hover img{ transform: scale(1.15);}

.pro-page2-content-col1 .pro-page2-content-ds{flex: 1; box-sizing: border-box; color: #fff;}
.pro-page2-content-col1 .pro-page2-content-ds p{ font-size: 18px; line-height: 36px; font-weight: 400; padding: 0 20px; width: 90%;}
.pro-page2-content-item{ text-align: center; padding: 60px 0 0;}
.pro-page2-content-item span{ font-size: 30px; line-height: 40px; font-weight: 600; color:#8f1d22;}
.pro-page2-content-item p{ font-size: 18px; line-height: 36px; }

.pro-page2-bg2{  background: url(../product/c2-3.jpg) no-repeat; background-position: center center; background-size: cover; display: flex; justify-content: center; align-items: center; animation: continuousScale 10s ease-in-out infinite alternate;}
@keyframes continuousScale {
  0% {
    background-size: cover ;
  }
  100% {
    background-size: cover;
  }
}

@media only screen and (max-width:750px) {  
  .pro-page2-content-col1{ flex-direction: column;}
}
.china-map-container{width:100%;height:100vh;background:#001540;position:relative;overflow:hidden}
#china-map{width:100%;height:100%}
.map-title{text-align:center;color:white;padding:20px 0 10px;font-size:24px;font-weight:bold}
.map-subtitle{text-align:center;color:#a0a0a0;padding-bottom:20px;font-size:16px}
.map-legend{position:absolute;bottom:30px;right:30px;background:rgba(0,21,64,0.8);padding:10px 15px;border-radius:5px;color:white;font-size:14px}
.legend-item{display:flex;align-items:center;margin:5px 0}
.legend-color{width:15px;height:15px;border-radius:50%;margin-right:8px}
.bubble-tooltip{position:absolute;background:rgba(0,0,0,0.8);color:white;padding:8px 12px;border-radius:4px;font-size:14px;pointer-events:none;opacity:0;transition:opacity 0.3s;z-index:1000}



.pro-page3 .pro-page3-content-col-item{ background: #8f1d22; color: #fff; border-radius: 15px; padding: 20px 0; text-align: center;}
.pro-page3 .pro-page3-content-col-item i{ font-size: 60px; transition: all 0.5s ease-in-out;}
.pro-page3 .pro-page3-content-col-item:hover i{ transform: scale(1.15);}

.pro-page3 .pro-page3-content-col-item p{ font-size: 18px; line-height: 36px; font-weight: 400; padding: 0 20px;}

.pro-page3 .pro-page3-content-col1 .pro-page3-content-col1-item{ padding: 20px; position: relative; background: #8f1d22; margin-bottom: 30px;}
.pro-page3 .pro-page3-content-col1 .pro-page3-content-col1-item p{ background: #8f1d22; padding: 10px 20px; border-radius: 10px; position: absolute; top: 0; left: 50%; transform: translate(-50%, -10px); font-size: 18px; line-height: 30px; font-weight: 600; color: #fff;}
.pro-page3 .pro-page3-content-col1 .pro-page3-content-col1-item .img{ background: #fff; padding:30px 20px 20px}

/* 文字内容：初始隐藏在图片下方，hover 时上浮显示 */
.pro-page3-content-col1-item .dstext {
  position: absolute;
  left: 0;
  bottom: 0;

  height: calc(100% - 60px);
  margin: 20px;
  padding: 30px 20px 20px; /* 内边距，避免文字贴边 */
  background: linear-gradient(to top, rgba(145, 0, 0, 1) 0%, rgba(255, 255, 255, 0) 100%); /* 渐变背景，提升文字可读性 */
  color: #fff; /* 文字白色，对比明显 */
  font-size: 16px;
  line-height: 2.0;
  text-align: justify;
  align-items: center;
  display: grid;
  /* 初始状态：透明 + 向下偏移，完全隐藏 */
  opacity: 0;
  transform: translateY(30px);
  /* 动画过渡：丝滑显示/隐藏 */
  transition: 
    opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none; /* 避免文字遮挡 hover 事件 */
}

/* Hover 状态：文字显示 + 图片优化 */
.pro-page3-content-col1-item:hover {
  box-shadow: 0 5px 15px rgba(0,0,0,0.15); /* 阴影加深，提升层次感 */
}

.pro-page3-content-col1-item:hover .img img {
  filter: brightness(0.7); /* 图片变暗 30%，让文字更清晰 */
  transform: scale(1.03); /* 图片轻微放大（可选，增强动感） */
}

.pro-page3-content-col1-item:hover .dstext {
  opacity: 1; /* 文字显隐 */
  transform: translateY(0); /* 文字上浮到正常位置 */
}

.pro-page3-content-col2{ display: flex; justify-content: center; align-items: center; padding:40px 20px; transition: all 0.5s ease-in-out; background-size: cover; background-repeat: no-repeat; background-color: #e0e0e0; background-position: center;}
.pro-page3-content-col2:hover{ background-size:cover;}


.pro-page3-content-col2-item{ flex: 1; }

.pro-page3-content-col2-item h3{ font-size: 24px; line-height: 40px; font-weight: 600; margin-bottom: 20px; color: #8f1d22;}
.pro-page3-content-col2-item p{ font-size: 18px; line-height: 36px; font-weight: 400;}


.pro-page4{display: flex; justify-content: center; align-items: center; text-align: center; background-size: cover; background-position: center center; background-repeat: no-repeat; background-attachment: fixed;}
.pro-page4 .product_content_title{ text-align: center;}
.pro-page4 .product_content_title .title{ font-size: 40px; line-height: 40px; font-weight: 600; margin-bottom: 20px;}
.pro-page4 .product_content_title p{ font-size: 18px; line-height: 36px; font-weight: 400; width: 80%; margin: 0 auto;}

.pro-page5 .intro-cards{ display: flex; justify-content: center; align-items: top; gap: 20px;}
.pro-page5 .intro-cards .intro-card{ width: calc(50% - 15px);background-color: #fff;border-radius: 8px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);overflow: hidden; }
.pro-page5 .intro-cards .intro-card .intro-card-img{ width: 100%;  overflow: hidden; }
.pro-page5 .intro-cards .intro-card .intro-card-img img{ width: 100%; height: 100%; object-fit: cover; transition: all 0.5s ease-in-out;}
.pro-page5 .intro-cards .intro-card:hover .intro-card-img img{ transform: scale(1.15);}

.pro-page5 .intro-cards .intro-card p{ font-size: 16px; line-height: 32px; padding: 20px;}


.pro-page5-gray-bg{background: url("../product/c5-3.jpg") no-repeat center center; background-size: cover;}
.pro-page5 .core-frame{ display: grid; grid-template-columns: repeat(2, 1fr); justify-content: center; align-items: center; gap: 20px;}
.pro-page5 .core-frame .frame-item{ background: #fff; padding: 20px; box-shadow: 0 0 10px rgba(0,0,0,.1);}
.pro-page5 .core-frame .frame-item{background-color:#fff;border-radius:8px;padding:20px;gap:15px;box-shadow:0 2px 8px rgba(0,0,0,0.03)}
.pro-page5 .core-frame .frame-item .item-head{ display: flex; align-items: center; gap: 10px;}
.pro-page5 .core-frame .frame-item .item-head h4{font-size:18px;font-weight:600;margin-bottom:8px;color:#333}
.pro-page5 .core-frame .frame-item .icon {width:50px;height:50px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;}
.pro-page5 .core-frame .frame-item .icon.red{background-color:#b32424}
.pro-page5 .core-frame .frame-item .icon.purple{background-color:#9c27b0}
.pro-page5 .core-frame .frame-item .icon.green{background-color:#4caf50}
.pro-page5 .core-frame .frame-item .icon.orange{background-color:#ff9800}
.pro-page5 .core-frame .frame-item .icon .iconfont{font-size:34px}

.pro-page5 .core-frame .frame-item .content p{color:#666;line-height:1.6;font-size:16px; padding: 15px 0;}
.pro-page5 .function-tabs {padding-bottom:0;}
.pro-page5 .function-tabs .el-tabs__header{ display: flex;  justify-content: center; align-items: center; border-bottom: 1px solid rgba(0,0,0,0.1);}
.pro-page5 .function-tabs .el-tabs__item{ font-size: 18px; line-height: 36px; font-weight: 600;}
.pro-page5 .function-tabs .el-tabs__item:hover{color:#8f1d22;}
.pro-page5 .function-tabs .el-tabs__active-bar{height:4px;background-color:#8f1d22;border-radius:2px}
.pro-page5 .function-tabs .el-tabs__item.is-active{color:#8f1d22; }
.pro-page5 .function-tabs .function-content{display: grid; grid-template-columns: repeat(2, 1fr); justify-content: center; align-items: top; gap: 20px; margin: 20px 0;}
.pro-page5 .function-tabs .function-content .function-text{font-size:16px;line-height:2.6;color:#666}
.pro-page5 .function-tabs .function-content .function-img{width:100%;height:100%;object-fit:cover;border-radius:8px;}



.pro-title{color:#fff;margin-bottom:40px}
.shutter-container{width:100%;overflow:hidden}
.shutter-wrapper{display:flex;transition:height 0.6s cubic-bezier(0.34,1.56,0.64,1)}
.shutter-item{flex:1;height:600px;cursor:pointer;overflow:hidden;border:none;transition:all 0.5s cubic-bezier(0.34,1.56,0.64,1);background-color:#1a244b}
.shutter-item.active{flex:4;height:600px;z-index:10}
.shutter-item.inactive{flex:0.8;filter:brightness(0.8)}
.shutter-content{width:100%;height:100%;position:relative}
.shutter-thumbnail{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;text-align:center; background-position: center;}
.shutter-item.active .shutter-thumbnail{opacity:0;pointer-events:none; position: relative;}
.thumb-img{position: absolute; transform: translate(-50%, -50%); object-fit:contain;margin-bottom:15px}
.shutter-item .shutter-thumbnail .thumb-title{font-size:18px;font-weight:500;writing-mode: vertical-rl; color: #fff; opacity: 0.8;}

.shutter-detail{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;opacity:0;pointer-events:none;transition:opacity 0.3s 0.2s}
.shutter-item.active .shutter-detail{opacity:1;pointer-events:auto}
.detail-img{width:50%;height:100%;object-fit:cover}
.detail-info{width:50%;padding:40px;color:#fff;display:flex;flex-direction:column;justify-content:center}
.detail-title{font-size:28px;margin-bottom:20px;color:#ffffff}
.detail-desc{font-size:16px;line-height:1.8;margin-bottom:30px;color:#e0e0e0}
@media (max-width:1200px){.shutter-item.active{flex:3;height:600px}
.detail-info{padding:30px}
.detail-title{font-size:24px}
}@media (max-width:992px){.shutter-item{height:250px}
.shutter-item.active{height:400px}
.detail-desc{font-size:14px}
}@media (max-width:768px){.shutter-wrapper{flex-direction:column}
.shutter-item{width:100%;height:150px;margin:5px 0}
.shutter-item.active{flex:1;height:400px}
.shutter-item.inactive{flex:1;height:100px}
.shutter-detail{flex-direction:column}
.detail-img,.detail-info{width:100%;height:50%}
.detail-info{padding:20px}
}
@media screen and (max-width:768px) {
  .pro-page5 .intro-cards{ display: grid; grid-template-columns: repeat(1, 1fr); justify-content: center; align-items: top; gap: 20px;}
  .pro-page5 .intro-cards .intro-card{ width: calc(100% - 15px);background-color: #fff;border-radius: 8px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);overflow: hidden; }
  .pro-page5 .function-tabs .function-content{display: grid; grid-template-columns: repeat(1, 1fr); justify-content: center; align-items: top; gap: 20px; margin: 20px 0;}
}

.pro-page6 .intro-cards{ display: grid; grid-template-columns: repeat(2, 1fr); justify-content: center; align-items: top; gap: 20px;}
.pro-page6 .intro-cards .intro-card{background-color: #fff;border-radius: 8px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);overflow: hidden; }
.pro-page6 .intro-cards .intro-card .intro-card-img{ width: 100%;  overflow: hidden;}
.pro-page6 .intro-cards .intro-card .intro-card-img img{ width: 100%; height: 100%; object-fit: cover;transition: all 0.3s ease-in-out;}
.pro-page6 .intro-cards .intro-card:hover .intro-card-img img{ transform: scale(1.15); }

.pro-page6 .intro-cards .intro-card h3{ font-size: 20px; line-height: 40px; font-weight: 600; padding: 20px 20px 0px;}
.pro-page6 .intro-cards .intro-card p{ font-size: 16px; line-height: 32px; padding: 20px;}

.pro-page6-bg5{ background: url('../product/c6-5.jpg') no-repeat center center; background-size: cover; }

.pro-page6 .core-frame{ display: grid; grid-template-columns: repeat(2, 1fr); justify-content: center; align-items: center; gap: 20px;}

.pro-page6 .core-frame .frame-item{background-color:#fff;border-radius:8px;padding:20px;gap:15px;box-shadow:0 2px 8px rgba(0,0,0,0.03); display: flex;}
.pro-page6 .core-frame .frame-item .icon {width:80px;height:80px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff; background: linear-gradient(135deg,#ff5a5f,#b60000);}
.pro-page6 .core-frame .frame-item .icon .iconfont{font-size:40px}
.pro-page6 .core-frame .frame-item .content h4{font-size:20px;font-weight:600;margin-bottom:8px;color:#333}
.pro-page6 .core-frame .frame-item .content p{color:#666;line-height:1.6;font-size:16px;}

.pro-page6-bg6{ background: url('../product/c6-6.jpg') no-repeat center center; background-size: cover; padding: 180px 0; }
.pro-page6-bg6 .product-title{ color: #fff; margin-bottom: 40px; text-align: left; }
.pro-page6-bg6 .product-title h3{ font-size: 32px; line-height: 48px; font-weight: 600; }
.pro-page6-bg6 .product-title p{ font-size: 16px; line-height: 32px;  width: 20%;}
@media (max-width:750px){
    .intro-cards,.core-frame{grid-template-columns: repeat(1, 1fr) !important; }
    .pro-page6-bg6{ padding: 30px 0; background-size: cover; max-height: 300px !important; }
    
    .pro-page6-bg6 .product-title{ text-align: center; }
	.pro-page6-bg6 .product-title p{ width: 100%;}
}

.product-table{margin: 20px 0;}

@media (max-width: 768px){ 
}

.pro-page7 .core-frame{ display: grid; grid-template-columns: repeat(3, 1fr); justify-content: center; align-items: center; gap: 20px;}
.pro-page7 .core-frame .frame-item{ background: linear-gradient(135deg,#810105,#b60000);border-radius:8px;padding:20px;gap:15px;box-shadow:0 2px 8px rgba(0,0,0,0.03); text-align: center; color: #fff; height: 100%;}
.pro-page7 .core-frame .frame-item .content .iconfont{font-size:80px}
.pro-page7 .core-frame .frame-item .content h4{font-size:20px;font-weight:600;margin-bottom:8px;}
.pro-page7 .core-frame .frame-item .content p{line-height:1.6;font-size:16px;}
.pro-page8-bg3{ background: url('/static/product/c1-2.jpg') no-repeat center center; background-size: cover;  }



.pg9process-section{padding:40px 0}
.steps-wrapper{position:relative;display:flex;justify-content:space-between;align-items:start;height:120px;margin:40px 0 20px;padding:0 20px}
.step-item{display:flex;flex-direction:column;align-items:center;cursor:pointer;z-index:10;transition:all 0.3s ease;width:20%}
.step-dot{width:24px;height:24px;border-radius:50%;background:#eee;display:flex;align-items:center;justify-content:center;transition:all 0.4s cubic-bezier(0.25,1,0.5,1);position:relative}
.step-dot.active{background:rgba(201,31,55,0.1);transform:scale(1.2)}
.step-dot-inner{width:12px;height:12px;border-radius:50%;background:#ccc;transition:all 0.4s cubic-bezier(0.25,1,0.5,1)}
.step-dot.active .step-dot-inner{background:#c91f37;transform:scale(1.4)}
.step-text{margin-top:12px;font-size:14px;color:#666;transition:all 0.3s ease;text-align:center;line-height:2.8}
.step-text.active{color:#c91f37;font-weight:600;transform:translateY(-2px)}
.steps-line-container{position:absolute;top:50%;left:40px;right:40px;height:4px;z-index:1}
.base-line{width:100%;height:100%;background:#eee;border-radius:2px}
.active-line{position:absolute;top:0;left:0;height:100%;border-radius:2px;background:#c91f37;transition:width 0.6s cubic-bezier(0.34,1.56,0.64,1)}
.dynamic-curve{position:absolute;top:0;height:4px;background:#c91f37;border-radius:2px;transition:all 0.8s cubic-bezier(0.25,1,0.5,1);transform-origin:left center;z-index:2;opacity:0;width:0}
.show-curve-1{opacity:0;width:50%;left:25%;transform:translateY(-20px) scaleX(1.2);border-radius:50% 50% 2px 2px}
.show-curve-2{opacity:0;width:50%;left:50%;transform:translateY(-15px) scaleX(1.1);border-radius:50% 50% 2px 2px}
.show-curve-3{opacity:0;width:25%;left:50%;transform:translateY(-12px) scaleX(1.05);border-radius:50% 50% 2px 2px}
.content-switch-wrapper{margin-bottom:20px;text-align: center;}
.content-item{line-height:1.8;color:#555}
.content-item h4{color:#c91f37;font-size:16px;margin:15px 0 10px;font-weight:600}
.content-item p{margin-bottom:10px}
.content-item ul{list-style:disc;margin-left:20px;margin-bottom:15px}
.content-item ul li{margin-bottom:5px}
.content-slide-enter-from{opacity:0;transform:translateX(30px)}
.content-slide-leave-to{opacity:0;transform:translateX(-30px)}
.content-slide-enter-active,.content-slide-leave-active{transition:all 0.5s cubic-bezier(0.34,1.56,0.64,1)}
@media (max-width:768px){.steps-wrapper{height:auto;flex-wrap:wrap;margin:20px 0}
.step-item{width:33.333%;margin-bottom:20px}
.steps-line-container{display:none}
.content-switch-wrapper{padding:20px 15px}
}

.pro-page10 .intro-cards{ display: grid; grid-template-columns: repeat(2, 1fr); justify-content: center; align-items: top; gap: 20px;}
.pro-page10 .intro-cards .intro-card{background-color: #fff;border-radius: 8px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);overflow: hidden; position: relative; }
.pro-page10 .intro-cards .intro-card .intro-card-abs{ position: absolute; bottom: 0; left: 0; display: flex; width: 100%;flex-direction: column; justify-content: center; align-items: center; color: #fff; background-color: rgba(168, 0, 0, 0.8); }
.pro-page10 .intro-cards .intro-card .intro-card-img{ width: 100%;  overflow: hidden; }
.pro-page10 .intro-cards .intro-card .intro-card-img img{ width: 100%; height: 100%; object-fit: cover; transition: all 0.3s ease-in-out; }
.pro-page10 .intro-cards .intro-card:hover .intro-card-img img{ transform: scale(1.1); }

.pro-page10 .intro-cards .intro-card h3{ font-size: 20px; line-height: 40px; font-weight: 600; padding: 20px 20px 0px;}
.pro-page10 .intro-cards .intro-card p{ font-size: 18px; line-height: 40px; }
.product-btn{background-color: #c91f37;color: #fff;border-radius: 15px;padding: 20px ;font-size: 24px;line-height: 32px; width: 80%; margin: 20px auto; }
.product-btn:hover{background-color: #a80000;}
@media (max-width:768px){
  .pro-page10 .intro-cards .intro-card p{ font-size: 16px; line-height: 32px; }
}

.pro-page11 .core-frame{ display: grid; justify-content: center; align-items: center; gap: 20px;}
.pro-page11 .core-frame-columns11{ grid-template-columns: repeat(3, 1fr);}
.pro-page11 .core-frame-columns12{ grid-template-columns: repeat(2, 1fr);}
.pro-page11 .core-frame-columns4{ grid-template-columns: repeat(4, 1fr);}

.pro-page11 .core-frame .frame-item{ position: relative; margin-top: 60px;}
.pro-page11 .core-frame .frame-item .icon{ position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%);  background-color: rgba(168, 0, 0, 0.8); padding: 10px; border-radius: 50%; width: 80px; height: 80px; display: flex; justify-content: center; align-items: center; color: #fff;}
.pro-page11 .core-frame .frame-item .icon .iconfont{font-size:60px}
.pro-page11 .core-frame .frame-item .content{ background: #fff; padding:60px 20px 20px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); height: 140px;}
.pro-page11 .core-frame .frame-item .content h4{font-size:20px;font-weight:600;margin-bottom:8px; text-align: center; color: #c91f37;}
.pro-page11 .core-frame .frame-item .content p{line-height:1.6;font-size:16px;}

.pro-page17{ background-size: cover; transition:all 0.5s cubic-bezier(0.34,1.56,0.64,1);}
.pro-page17:hover{ background-size: cover;}
.pro-page17 .product-title{ padding: 60px 0; text-align: left; width: 50%;}
.pro-page17 .product-title h3{ font-size: 40px; line-height: 60px; font-weight: 600;  color: #fff;}
.pro-page17 .product-title p{ font-size: 20px; line-height: 40px; font-weight: 400;  color: #fff;}
.pro-page17 .product-titley{text-align: center; padding: 40px 0px;}
.pro-page17 .product-titley h3{ font-size: 40px; line-height: 60px; font-weight: 600;  }
.pro-page17 .product-titley p{ font-size: 20px; line-height: 40px; font-weight: 400;}

.pro-page17 .shutter-wrapper{display:flex;transition:height 0.6s cubic-bezier(0.34,1.56,0.64,1)}

.pro-page17 .shutter-item{flex:1;height:600px;cursor:pointer;overflow:hidden;border:none;transition:all 0.5s cubic-bezier(0.34,1.56,0.64,1);border-left:1px solid rgba(255,255,255,0.6) !important; background-color: transparent;}
.pro-page17 .shutter-item.active{flex:4;height:600px;z-index:10}
.pro-page17 .shutter-item.inactive{flex:0.8;filter:brightness(0.8)}
.pro-page17 .shutter-content{width:100%;height:100%;position:relative}
.pro-page17 .shutter-thumbnail{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;text-align:center; background-position: center;}
.pro-page17 .shutter-item.active .shutter-thumbnail{opacity:0;pointer-events:none; position: relative;}
.pro-page17 .shutter-item.active .shutter-thumbnail .thumb-img{position: absolute; transform: translate(-50%, -50%); object-fit:contain;margin-bottom:15px}
.pro-page17 .shutter-item .shutter-thumbnail .thumb-title{font-size:18px;font-weight:500;writing-mode: vertical-rl; color: #fff; opacity: 0.8;}

.pro-page17 .shutter-detail{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;opacity:0;pointer-events:none;transition:opacity 0.3s 0.2s}
.pro-page17 .shutter-item.active .shutter-detail{opacity:1;pointer-events:auto}
.pro-page17 .detail-img{width:50%;height:100%;object-fit:cover}
.pro-page17 .detail-info{width:50%;padding:40px;color:#fff;display:flex;flex-direction:column;justify-content:center}
.pro-page17 .detail-title{font-size:28px;margin-bottom:20px;color:#ffffff}
.pro-page17 .detail-desc{font-size:16px;line-height:1.8;margin-bottom:30px;color:#e0e0e0}
@media (max-width:1200px){.pro-page17 .shutter-item.active{flex:3;height:600px}
.pro-page17 .detail-info{padding:30px}
.pro-page17 .detail-title{font-size:24px}
}@media (max-width:992px){.pro-page17 .shutter-item{height:250px}
.pro-page17 .shutter-item.active{height:400px}
.pro-page17 .detail-desc{font-size:14px}
}@media (max-width:768px){.pro-page17 .shutter-wrapper{flex-direction:column}
.pro-page17 .shutter-item{width:100%;height:150px;margin:5px 0}
.pro-page17 .shutter-item.active{flex:1;height:400px}
.pro-page17 .shutter-item.inactive{flex:1;height:100px}
.pro-page17 .shutter-detail{flex-direction:column}
.pro-page17 .detail-img,.pro-page17 .detail-info{width:100%;height:50%}
.pro-page17 .detail-info{padding:20px}
}

.pro-page18 .core-frame{ display: grid; grid-template-columns: repeat(4, 1fr); justify-content: center; align-items: center; gap: 20px;}
.pro-page18 .core-frame-columns3{ grid-template-columns: repeat(3, 1fr);}
.pro-page18 .core-frame .frame-item{background-color:#8f1d22;border-radius:8px;padding:20px;gap:15px;box-shadow:0 2px 8px rgba(0,0,0,0.03); display: flex;flex-direction: column; align-items: center;}
.pro-page18 .core-frame .frame-item .icon {width:80px;height:80px;border-radius:50%;align-items:center; text-align: center; line-height: 80px; justify-content:center;color:#8f1d22; background: #fff;}
.pro-page18 .core-frame .frame-item .icon .iconfont{font-size:40px}
.pro-page18 .core-frame .frame-item .content{text-align: center;}
.pro-page18 .core-frame .frame-item .content h4{font-size:20px;font-weight:600;margin-bottom:8px;color:#ffffff}
.pro-page18 .core-frame .frame-item .content p{color:#ffffff;line-height:1.6;font-size:16px; }

.process-container{position:relative;width:1024px;margin:20px auto; display: flex; flex-direction: column;}
.process-container .process-step{position:relative;}
.process-container .left-content .step-content{margin-left: calc(50% + 40px);}
.process-container .right-content .step-content{margin-right: calc(50% + 40px); text-align: right;}


.step-node{position:absolute;left:50%;top:0;transform:translate(-50%,0%);width:40px;height:40px;border-radius:50%;background-color:#8f1d22;display:flex;align-items:center;justify-content:center}
.node-number{color:#fff;font-weight:bold;font-size:16px}
.step-content{margin-bottom:10px}
.step-title{color:#8f1d22;font-size:18px;margin:0 0 5px 0}
.step-desc{color:#000;font-size:14px;margin:0;line-height:1.5}
.step-line{position:absolute;left:50%;top:40px;width:2px;height:30px;background-color:#8f1d22}

@media screen and (max-width: 1200px) {
  .process-container{width: 100%;}
  .process-container .process-step{margin-bottom: 20px;}
  .process-container  .step-content{padding-top: 50px;}
  .process-container .left-content .step-content{margin-left: 10px;}
  .process-container .right-content .step-content{margin-right: 10px; margin-left: 10px; text-align: left;}

  .process-container .step-line{display: none;}
}

.pro-page19 .el-col{display: flex;}
.pro-page19 .product-item{padding: 20px; border-radius: 8px; flex: 1; display: flex; flex-direction: column; align-items: center; background-color: #fff; height: 480px;transition: all 0.3s cubic-bezier(0.34,1.56,0.64,1);}
.pro-page19 .product-item:hover{transform: translateY(-5px); box-shadow: 0 4px 12px rgba(0,0,0,0.1);}

.pro-page19 .product-item p{font-size:16px;line-height:1.6;color:#333333;margin-bottom:10px; text-align: left;}
.pro-page19 .product-card{height: 100%; border-radius: 8px; padding: 10px 0px;}
.pro-page19 .product-card .product-item {width: 100%; height: 80px; object-fit: contain; position: relative;}
.pro-page19 .product-card .product-item::after{content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background-color: #e0e0e0;}
.pro-page19 .product-card .el-col:last-child .product-item::after {  width: 0;  height: 0;}
@media (max-width:768px){
  .pro-page19 .product-card .el-col{flex-direction: column;}
  .pro-page19 .product-card .el-col .product-item{height: 80px;}
}



.pro-page20 .product-card{height: 100%; border-radius: 8px; padding: 20px 0px; margin-bottom: 20px;}
.pro-page20 .product-card .product-item {width: 100%; object-fit: contain; position: relative; text-align: center;}
.pro-page20 .product-card .product-item::after{content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background-color: #e0e0e0;}
.pro-page20 .product-card .el-col:last-child .product-item::after {  width: 0;  height: 0;}


.pro-page20 .product-card-col{ background-color: #f8f1f1; padding: 20px; border-radius: 8px;}
.pro-page20 .product-card-col .product-item {width: 100%; object-fit: contain; position: relative; text-align: center; }
.pro-page20 .product-card-col .product-item::after{content: ''; position: absolute; top: 0; right: -10px; width: 1px; height: 100%; background-color: #e0e0e0;}
.pro-page20 .product-card-col .el-col:last-child .product-item::after {  width: 0;  height: 0;}

.pro-page20 .product-card-btn{text-align: center; padding: 30px 0px; position: relative;}
.pro-page20 .product-card-btn::after{content: '\e6e2'; font-family: 'iconfont'; color: #8f1d22; position: absolute; top: -10px; left: 50%; transform: translateX(-50%); font-size: 20px;}
.pro-page20 .product-card-btn::before { content: '\e6e2'; font-family: 'iconfont'; color: #8f1d22; position: absolute; bottom: -10px;left: 50%; transform: translateX(-50%); font-size: 20px;}
.pro-page20 .product-card-btn .el-button{padding: 20px 20px; font-size: 16px; width: 100%; background: #8f1d22; border: none; color: #fff; border-radius: 8px;}

.pro-page21 .core-frame{ display: grid; grid-template-columns: repeat(2, 1fr); justify-content: center; align-items: top; gap: 20px;}
.pro-page21 .core-frame .frame-item{background-color:#8f1d22;border-radius:8px;padding:20px;box-shadow:0 2px 8px rgba(0,0,0,0.03); display: flex;flex-direction: column; align-items: center;  margin-bottom: 20px;}
.pro-page21 .core-frame .frame-item .icon {width:80px;height:80px;border-radius:50%;align-items:center; text-align: center; line-height: 80px; justify-content:center;color:#8f1d22; background: #fff;}
.pro-page21 .core-frame .frame-item .icon .iconfont{font-size:40px}
.pro-page21 .core-frame .frame-item .content{text-align: center;}
.pro-page21 .core-frame .frame-item .content h4{font-size:20px;font-weight:600;margin-bottom:8px;color:#ffffff}
.pro-page21 .core-frame .frame-item .content p{color:#ffffff;line-height:1.6;font-size:16px; }