.menu { --menu-dropdown-width: 220px; }
html { scroll-behavior: smooth; }
.menu .sub-menu { background:#fff; padding:20px 10px; box-shadow:0 2px 10px rgba(0,0,0,.1); border-radius:8px; min-width: var(--menu-dropdown-width); }
.menu .sub-menu-list > .sub-menu-item { position: relative; }
.menu .sub-menu-list > .sub-menu-item > .sub-sub-menu { display: none; position: absolute; top: 0; left: 100%; background: #fff; padding: 20px 10px; box-shadow: 0 2px 10px rgba(0,0,0,.1); border-radius: 8px; min-width: var(--menu-dropdown-width); z-index: 1000; }
.menu .sub-menu-list > .sub-menu-item:hover > .sub-sub-menu { display: block; }
.menu .sub-sub-menu .sub-sub-menu-item a { font-size: 14px; color: #000; padding: 0.5rem 1.5rem; display: block; font-weight: 400; }
.menu .sub-menu .sub-menu-list .sub-menu-item a { font-size: 14px; color: #000; padding: 0.5rem 1.5rem; display: block; font-weight: 400; }
.menu .sub-sub-menu .sub-sub-menu-item a:hover { color: var(--primary-color); background-color: #f2f2f2; }
.menu .sub-menu .sub-menu-list .sub-menu-item a:hover { color: var(--primary-color); background-color: #f2f2f2; }
@media (max-width: 943px) {
  .menu .sub-menu-list > .sub-menu-item > .sub-sub-menu { position: relative; left: 0; top: auto; display: block; box-shadow: none; padding: 0; border-radius: 0; }
  .menu .sub-sub-menu .sub-sub-menu-item a { padding: 0.5rem 1rem; }
  .menu .sub-menu { box-shadow:none; padding:0; border-radius:0; min-width:auto; }
}
.product-wrapper aside { margin-top: 60px; }
.product-wrapper .left { width:100%; padding-bottom:20px; background-color:#fff; box-shadow:0px 8px 36.8px 3.2px rgba(0,0,7,0.1); border-radius:12px; overflow:hidden; }
.product-wrapper .row { align-items: flex-start; }
.product-wrapper aside { display:block; }
.product-wrapper aside .left { height: auto; }
.product-wrapper .left h3 { height:60px; line-height:60px; background-color:var(--primary-color); width:100%; padding:0 30px; font-size:20px; color:#fff; position:relative; margin:0; border-radius:12px 12px 0 0; }
.product-wrapper .left ul { list-style:none; margin:0; padding:0; }
.product-wrapper .left ul li h4 { height:42px; line-height:42px; font-size:16px; padding:0 30px 0 45px; position:relative; cursor:pointer; overflow:hidden; transition:all 0.4s ease-in-out; margin:0; border-radius:6px; }
.product-wrapper .left ul li h4:hover { background-color:#f2f2f2; }
.product-wrapper .left ul li.active h4 { background-color:#f2f2f2; }
.product-wrapper .left ul li h4 a { color:#333333; font-size:16px; display:block; }
.product-wrapper .left ul li h4::before { content:''; position:absolute; top:0; bottom:0; left:30px; margin:auto; width:3px; height:15px; background-color:#e5e5e5; transition:all 0.4s ease-in-out; }
.product-wrapper .left ul li h4::after { content:''; border:4px solid transparent; border-top:4px solid #888; border-bottom:none; position:absolute; width:0; height:0; right:30px; top:0; bottom:0; margin:auto; transform:rotateZ(-90deg); transition:all 0.4s ease-in-out; }
.product-wrapper .left ul li.active h4 a, .product-wrapper .left ul li h4:hover a { color:var(--primary-color); }
.product-wrapper .left ul li.active h4::before, .product-wrapper .left ul li h4:hover::before { background-color:var(--primary-color); }
.product-wrapper .left ul li.active h4::after, .product-wrapper .left ul li h4:hover::after { border-top-color:var(--primary-color); }
.product-wrapper .left ul li.active h4::after { transform:rotateZ(0); }
.product-wrapper .left ul li .pro-second { display:none; padding:0 0 12px 15px; margin:0 30px; border-bottom:0; }
.product-wrapper .left ul li .pro-second h6 { line-height:30px; height:30px; margin:6px 0; }
.product-wrapper .left ul li .pro-second .pro-third { line-height:30px; height:30px; margin:0 20px; }
.product-wrapper .left ul li .pro-second h6 a, .product-wrapper .left ul li .pro-second .pro-third a { font-size:14px; color:#999999; font-weight:normal; transition:all 0.4s ease-in-out; position:relative; display:block; padding-left:12px; padding-right:10px; border-radius:6px; }
.product-wrapper .left ul li .pro-second h6 a::before, .product-wrapper .left ul li .pro-second .pro-third a::before { content:''; width:8px; height:2px; background:#666; position:absolute; top:0; bottom:0; left:0; margin:auto; transition:all 0.4s ease-in-out; }
.product-wrapper .left ul li .pro-second h6.active a, .product-wrapper .left ul li .pro-second h6 a:hover, .product-wrapper .left ul li .pro-second .pro-third.active a, .product-wrapper .left ul li .pro-second .pro-third a:hover { color:var(--primary-color); background-color:#f2f2f2; }
.product-wrapper .left ul li .pro-second h6.active a::before, .product-wrapper .left ul li .pro-second h6 a:hover::before, .product-wrapper .left ul li .pro-second .pro-third.active a::before, .product-wrapper .left ul li .pro-second .pro-third a:hover::before { background:var(--primary-color); }
@media (min-width: 992px) {
  .product-wrapper .row > aside.col-lg-3 { flex: 0 0 15%; max-width: 15%; }
  .product-wrapper .row > .col-lg-9 { flex: 0 0 85%; max-width: 85%; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .product-wrapper .row > aside.col-md-4 { flex: 0 0 20%; max-width: 20%; }
  .product-wrapper .row > .col-md-8 { flex: 0 0 80%; max-width: 80%; }
}
@media (max-width: 991.98px) {
  .product-wrapper .left { display:block; width:100%; padding-bottom:30px; margin-bottom:30px; }
}

/* cases list - tink.hz animation and layout */
.container-outer { width: 100%; margin: auto; position: relative; height: 100%; }
.cases-list { padding: 80px 0; overflow: hidden; }
.cases-list .cases-list-item { float:left; width:calc((100% - 60px) / 3); margin-top:30px; margin-right:30px; position:relative; box-shadow:0px 8px 36.8px 3.2px rgba(0,0,7,0.1); }
.cases-list .cases-list-item:nth-child(-n + 3) { margin-top:0; }
.cases-list .cases-list-item:nth-child(3n) { margin-right:0; }
.cases-list .cases-list-item a:hover .item-box { box-shadow:0 2px 16px 0 rgba(66,123,255,0.2); }
.cases-list .cases-list-item a:hover .item-box .img .pic { transform:scale(1.1); }
.cases-list .cases-list-item a:hover .item-box .text-box .title { height:40%; background-color:#FFFFFF; }
.cases-list .cases-list-item a:hover .item-box .text-box .title h3 { margin-bottom:16px; color: var(--primary-color); }
.cases-list .cases-list-item a:hover .item-box .text-box .title h5 { opacity:1; max-width:100%; height:auto; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; max-height:72px; }
.cases-list .cases-list-item a:hover .item-box .wl .line { width:100%; }
.cases-list .cases-list-item a .item-box { transition:all .4s ease; position:relative; border-radius:12px; overflow:hidden; }
.cases-list .cases-list-item a .item-box .img { position: relative; width:100%; height:auto; overflow:hidden; }
.cases-list .cases-list-item a .item-box .img::before { position:absolute; content:""; top:0; left:0; right:0; bottom:0; background-color: rgba(27,24,37,0.3); transform: scaleY(0); transition: transform 500ms ease; transform-origin: bottom center; z-index:2; }
.cases-list .cases-list-item a .item-box .img .pic { transition: transform .4s ease; aspect-ratio: 4 / 3; width:100%; height:auto; background-position:center; background-size: contain; background-repeat: no-repeat; background-color: #f5f5f5; }
.cases-list .cases-list-item a:hover .item-box .img::before { transform: scaleY(1); }
.cases-list .cases-list-item a .item-box .text-box { position:absolute; bottom:0; z-index:11; width: 100%; }
.cases-list .cases-list-item a .item-box .text-box .title { transition:all .4s ease; width:100%; height:20%; padding:5% 5% 5% 5%; box-sizing:border-box; background-color:#FFFFFF; display:flex; flex-direction:column; gap:12px; }
.cases-list .cases-list-item a .item-box .text-box .title h3 { transition:all .4s ease; display:block; font-size:18px; font-weight:600; color:#333333; max-width:100%; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; max-height:28px; line-height:28px; margin-bottom:8px; }
.cases-list .cases-list-item a .item-box .text-box .title h5 { transition:all .4s ease; font-size:14px; font-weight:normal; color:#666; max-width:100%; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; max-height:0; line-height:24px; opacity:0; }
.cases-list .cases-list-item a .item-box .text-box .title .more { transition:all .4s ease; font-size:14px; font-weight:normal; opacity:.8; max-width:100%; height:20px; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; display:inline-block; line-height:20px; position:static; margin-top:14px; color: var(--primary-color); }
.cases-list .cases-list-item a .item-box .text-box .title .more i { width:12px; height:12px; position:absolute; margin-top:4px; margin-left:3px; }
.cases-list .cases-list-item a .item-box .wl { position:absolute; left:0; bottom:0; height:2px; width:100%; z-index:12; }
.cases-list .cases-list-item a .item-box .wl .line { width:0; transition: width .4s ease; height:2px; background-color: var(--primary-color); transform-origin: left; }

/* 自定义淡入左移动画，解决与垂直居中transform的冲突 */
@keyframes fadeInLeftCentered {
    from {
        opacity: 0;
        transform: translate3d(-100%, -50%, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, -50%, 0);
    }
}

@-webkit-keyframes fadeInLeftCentered {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, -50%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, -50%, 0);
    }
}

.wow.fadeInLeftCentered {
    visibility: visible;
    animation-name: fadeInLeftCentered;
    -webkit-animation-name: fadeInLeftCentered;
}

/* 为当前页面的横幅单独设置高度 */
.neibanner.contact-banner {
    height: 830px;
    position: relative;
    overflow: hidden;
}
.neibanner.contact-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* 联系信息定位在横幅上方左侧 */
.contact-overlay {
    position: absolute;
    top: 50%;
    left: 5%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.9);
    padding: 40px;
    border-radius: 8px;
    max-width: 500px;
    z-index: 10;
    /* 文字样式 */
    font-family: "微软雅黑", Arial, sans-serif;
}
/* 联系信息内的标题样式 */
.contact-overlay h4 {
    font-size: 16px;
    font-weight: 500;
    color: #666;
    margin-bottom: 10px;
}
.contact-overlay h3 {
    font-size: 32px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
}
.contact-overlay h5 {
    font-size: 18px;
    font-weight: 600;
    color: #555;
    margin-bottom: 30px;
}
.contact-overlay h6 {
    font-size: 16px;
    font-weight: 500;
    color: #333;
    margin: 5px 0;
}
.contact-overlay p {
    font-size: 14px;
    color: #888;
    margin: 0;
}
/* 分隔线样式 */
.contact_blline {
    height: 3px;
    width: 50px;
    background-color: #ff6b35;
    margin-bottom: 20px;
}
/* 联系信息列表样式 */
.contact-info-list {
    margin-top: 30px;
}
.contact-info-list .row {
    margin-left: -10px;
    margin-right: -10px;
}
.contact-info-list .col-6 {
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
}
/* 响应式调整 */
@media (max-width: 768px) {
    .neibanner.contact-banner {
        height: 800px;
    }
    .contact-overlay {
        left: 5%;
        right: 5%;
        max-width: none;
        padding: 30px;
    }
}

/* 地图容器样式 */
#myMap {
    overflow: hidden;
    width: 100%;
    height: 800px;
    margin: 0;
    font-family: "微软雅黑";
}

.flag-tags { display: inline-flex; gap: 6px; }
.flag-tag { display: inline-block; padding: 2px 6px; font-size: 12px; line-height: 1; border-radius: 4px; color: #fff; background: rgba(0,0,0,.55); }
.flag-tag.flag-top { background: #f56c6c; }
.flag-tag.flag-hot { background: #e6a23c; }
.case-wrapper .swiper-slide-img { position: relative; }
.case-wrapper .swiper-slide-img .flag-tags { position: absolute; top: 10px; left: 10px; z-index: 3; }
.case-wrapper .case-item-img { position: relative; }
.case-wrapper .case-item-img .flag-tags { position: absolute; top: 10px; left: 10px; z-index: 3; }
.product-wrapper .product-list .product-item .pic { position: relative; aspect-ratio: 1 / 1; overflow: hidden; }
.product-wrapper .product-list .product-item .pic img { width: 100%; height: 100%; object-fit: contain; }
.product-wrapper .product-list .product-item .pic .flag-tags { position: absolute; top: 10px; left: 10px; z-index: 3; }
.hero-zoom { overflow: hidden; }
.hero-zoom img { transform: scale(1); will-change: transform; animation: heroKenBurns 7000ms ease forwards; }
.hero-zoom:hover img { transform: scale(1.15); }
@keyframes heroKenBurns { from { transform: scale(1); } to { transform: scale(1.15); } }

/* 三大厂商 - 改为响应式轮播，复用案例风格 */
.sanda-wrapper .sanda-swiper { padding: 80px 0; overflow: hidden; }
.sanda-wrapper .swiper-wrapper { list-style: none; margin: 0; padding: 0; }
.sanda-wrapper .swiper-slide a .item-box { transition: all .4s ease; position: relative; border-radius: 12px; overflow: hidden; box-shadow: 0px 8px 36.8px 3.2px rgba(0,0,7,0.1); }
.sanda-wrapper .swiper-slide a .item-box .img { position: relative; width: 100%; height: auto; overflow: hidden; }
.sanda-wrapper .swiper-slide a .item-box .img::before { position: absolute; content: ""; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(27,24,37,0.3); transform: scaleY(0); transition: transform 500ms ease; transform-origin: bottom center; z-index: 2; }
.sanda-wrapper .swiper-slide a .item-box .img .pic { transition: transform .4s ease; aspect-ratio: 4 / 3; width: 100%; height: auto; background-position: center; background-size: contain; background-repeat: no-repeat; background-color: #f5f5f5; }
.sanda-wrapper .swiper-slide a .item-box .text-box { position: absolute; bottom: 0; z-index: 11; width: 100%; }
.sanda-wrapper .swiper-slide a .item-box .text-box .title { transition: all .4s ease; width: 100%; height: 20%; padding: 5% 5% 5% 5%; box-sizing: border-box; background-color: #FFFFFF; display: flex; flex-direction: column; gap: 12px; }
.sanda-wrapper .swiper-slide a .item-box .text-box .title h3 { transition: all .4s ease; display: block; font-size: 18px; font-weight: 600; color: #333333; max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; max-height: 28px; line-height: 28px; margin-bottom: 8px; }
.sanda-wrapper .swiper-slide a .item-box .text-box .title h5 { transition: all .4s ease; font-size: 14px; font-weight: normal; color: #666; max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; max-height: 0; line-height: 24px; opacity: 0; }
.sanda-wrapper .swiper-slide a .item-box .text-box .title .more { transition: all .4s ease; font-size: 14px; font-weight: normal; opacity: .8; max-width: 100%; height: 20px; display: inline-block; line-height: 20px; position: static; margin-top: 14px; color: var(--primary-color); }
.sanda-wrapper .swiper-slide a .item-box .text-box .title .more i { width: 12px; height: 12px; position: absolute; margin-top: 4px; margin-left: 3px; }
.sanda-wrapper .swiper-slide a .item-box .wl { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; z-index: 12; }
.sanda-wrapper .swiper-slide a .item-box .wl .line { width: 0; transition: width .4s ease; height: 2px; background-color: var(--primary-color); transform-origin: left; }
.sanda-wrapper .swiper-slide a:hover .item-box { box-shadow: 0 2px 16px 0 rgba(66,123,255,0.2); }
.sanda-wrapper .swiper-slide a:hover .item-box .img .pic { transform: scale(1.1); }
.sanda-wrapper .swiper-slide a:hover .item-box .img::before { transform: scaleY(1); }
.sanda-wrapper .swiper-slide a:hover .item-box .text-box .title { height: 40%; background-color: #FFFFFF; }
.sanda-wrapper .swiper-slide a:hover .item-box .text-box .title h3 { margin-bottom: 16px; color: var(--primary-color); }
.sanda-wrapper .swiper-slide a:hover .item-box .text-box .title h5 { opacity: 1; max-width: 100%; height: auto; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; max-height: 72px; }
.sanda-wrapper .swiper-slide a:hover .item-box .wl .line { width: 100%; }
.sanda-swiper .swiper-wrapper { list-style: none; margin: 0; padding: 0; }
.sanda-swiper { position: relative; padding-bottom: 40px; }
#sanda-swiper-pagination { position: absolute; bottom: 10px; left: 0; right: 0; display: flex; align-items: center; justify-content: center; }

/* 当出现 3 列及以上时，隐藏分页圆点 */
@media (min-width: 1280px) {
  .sanda-wrapper #sanda-swiper-pagination { display: none; }
}

@media (min-width: 1280px) {
  .page-list #sanda-swiper-pagination { display: none; }
}

.main-slider .swiper-silde-img { height: clamp(200px, 30vw, 450px) !important; min-height: 200px !important; width: 100%; object-fit: cover; }