@charset "utf-8";
/* technology.css 核心技术页面独立样式 */
.tech-main{
    background:#fff;
}
.bottom-gap {
    height:80px;
}
/* banner 690px */
.tech-banner{
    width:100%;
    height:690px;
    background:url("../img/xwbanner.jpg") center / cover no-repeat;
    position:relative;
}
.tech-banner .banner-inner{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
}
.tech-banner .banner-title{
    font-size:40px;
    font-weight:bold;
    color:#ffffff;
    padding-left:calc((100% - 1200px)/2);
}
/*面包屑 */
.tech-bread{
    margin-top:15px;
    font-size:16px;
}
.tech-bread .bread-gray{
    color:#cccccc;
}
.tech-bread .bread-active{
    color:#006dc4;
}
/*通用区块间距 */
.tech-section{
    margin-top:100px;
}
/* 内容容器最大1400px */
.tech-inner-1400{
    max-width:1400px;
    margin:0 auto;
    padding-left:20px;
    padding-right:20px;
}
/*满屏背景容器 100vw */
.tech-full-bg{
    width:100vw;
    margin-left:calc(-50vw + 50%);
}
/*板块标题 */
.tech-head{
    text-align:center;
    margin-bottom:70px;
}
.tech-big-title{
    font-size:40px;
    font-weight:bold;
    color:#222;
    margin-0 0 20px;
}
.tech-sub-title{
    font-size:20px;
    color:#666666;
	padding-top:20px;
}
/* ========= tech-brief第一板块样式 ========= */
.tech-brief-bg{
    background:url("../img/tech-brief-bg.jpg") center / cover no-repeat;
}
.brief-content{
    padding-top:5px;
}
.brief-big-title{
    font-size:40px;
    font-weight:bold;
    color:#222;
    line-height:1.4;
    margin-bottom:55px;
}
.brief-desc{
    font-size:20px;
    color:#666666;
    line-height:1.7;
    margin-bottom:50px;
}
/*按钮容器，按钮一行，间隔20px */
.brief-btn-wrap{
    display:flex;
    gap:20px;
}
.brief-btn{
    display:inline-block;
    padding:14px 36px;
    background-color:#f7f7f7;
    border-radius:999px;
    text-decoration:none;
    color:#222;
    font-size:16px;
    transition:0.25s;
}
.brief-btn:hover{
    background-color:#e9e9e9;
}
/* 特性模块：一行展示，间隔100px，禁止换行；小屏幕横向滚动；距离底部95px */
.brief-feature-grid{
    margin-top:115px;
    display:flex;
    gap:100px;
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:95px;
}
.feature-item{
    flex-shrink:0;
    text-align:center;
}
/*上方蓝色数字：数字大，单位小16px */
.feature-num{
    color:#0081cc;
    font-weight:bold;
    margin-bottom:10px;
}
.feature-num strong{
    font-size:40px;
}
.feature-num span{
    font-size:16px;
}
/*下面文字字号16px */
.feature-text{
    font-size:16px; /* ✅文字16px */
    color:#222;
}

/* 移动端适配补充 */
@media(max-width:768px){
    .brief-big-title{
        font-size:28px;
    }
    .brief-content{
        padding-top:50px;
    }
    .brief-feature-grid{
        gap:60px;
    }
    .feature-num strong{
        font-size:30px;
    }
    .brief-btn-wrap{
        flex-wrap:wrap;
    }
}
@media(max-width:480px){
    .brief-feature-grid{
        gap:40px;
    }
}

/*第二板块：高度840px满屏轮播 */
.tech-slide-full{
    width:100vw;
    margin-left:calc(-50vw + 50%);
    height:840px;
    position:relative;
    overflow:hidden;
}
.tech-slide-bg{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center;
    transition:background-image 0.4s ease;
}
.tech-slide-content{
    position:relative;
    z-index:2;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    padding-top:190px;
    padding-bottom:30px;
}
.slide-text-box .slide-title{
    font-size:40px;
    font-weight:bold;
    color:#fff;
    margin-bottom:35px;
}
.slide-text-box .slide-desc{
    font-size:20px;
    color:#ffffff;
    max-width:700px;
    line-height:1.7;
}
/*底部5个切换按钮容器：半透明圆角背景 gap=0 */
.tech-tab-buttons{
    display:flex;
    justify-content:space-between;
    gap:0;
    background:rgba(255,255,255,0.45);
    border-radius:12px;
    overflow:hidden;
}
.tech-tab-item{
    flex:1;
    text-align:center;
    padding-top:16px;
    padding-bottom:16px;
    cursor:pointer;
    transition:0.25s;
    /* 删除原来border-right分割线，父容器半透明整体圆角，子项不要边框 */
    border-right:none;
}
/* hover、active 自身圆角由父容器 overflow:hidden 裁剪 */
.tech-tab-item.active,
.tech-tab-item:hover{
    background-color:#0081cc;
}
.tech-tab-item.active .tab-text,
.tech-tab-item:hover .tab-text{
    color:#ffffff;
}
.tab-icon img{
    height:36px;
    margin-bottom:12px;
}
.tab-text{
    font-size:18px;
    color:#111;
    transition:0.25s;
}

/*第三板块：蒙版自动轮播 */
.mask-slide-full{
    width:100vw;
    margin-left:calc(-50vw + 50%);
    overflow:hidden;
}
.mask-slide-outer{
    max-width:1400px;
    margin:0 auto;
    overflow:hidden;
}
.mask-slide-list{
    display:flex;
    gap:24px;
    transition:transform 0.5s ease;
}
.mask-slide-item{
    flex-shrink:0;
    width:960px; /* ✅焦点图尺寸改为960px */
    position:relative;
    opacity:0.4;
    transition:opacity 0.4s;
}
.mask-slide-item img{
    width:100%;
    height:auto;
    border-radius:12px;
    display:block;
}
/*中间激活项不透明 */
.mask-slide-item.active{
    opacity:1;
}
/*图片叠加文字层 */
.mask-slide-text{
    position:absolute;
    left:30px;
    top:160px;
    color:#ffffff;
}
.mask-slide-text h4{
    font-size:30px;
    font-weight:bold;
    margin:0 0 18px 0;
}
.mask-slide-text .line-white{
    width:120px; /* ✅白线约加长2倍 */
    height:1px;
    background:#ffffff;
    margin-bottom:15px;
}
.mask-slide-text p{
    font-size:16px;
    font-weight:normal;
    margin:0;
}

/*移动端适配 */
@media(max-width:1200px){
    .mask-slide-item{
        width:720px;
    }
}
@media(max-width:768px){
    .mask-slide-item{
        width:calc(100vw - 40px);
    }
    .mask-slide-text{
        left:20px;
        top:80px;
    }
    .mask-slide-text h4{
        font-size:22px;
    }
    .mask-slide-text .line-white{
        width:80px;
    }
}

/*第四板块：4列卡片 */
.four-card-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    column-gap:36px;
    row-gap:30px;
}
.four-card-item{
    background:#f8f8f8;
    border-radius:12px;
    padding:93px 15px 40px 15px; /* ✅top93px，左右15px */
    text-align:center;
}
.four-card-icon{
    width:60px;
    height:60px;
    /*background-color:#0081cc;
    border-radius:50%;*/
    margin:0 auto 25px auto; /* ✅图标水平居中，向下间隔25px */
}
.four-card-item h4{
    font-size:18px;
    font-weight:bold;
    color:#222;
    margin:0 0 65px 0; /* ✅标题向下间隔65px */
}
.four-card-item p{
    font-size:16px;
    font-weight:normal;
    color:#666;
    line-height:1.7;
}

/*移动端适配 */
@media(max-width:1440px){
    .tech-inner-1400{
        width:96%;
    }
}
@media(max-width:768px){
    .tech-banner .banner-title{
        font-size:30px;
        padding-left:20px;
    }
    .tech-big-title{
        font-size:28px;
    }
    .tech-slide-full{
        height:auto;
        min-height:600px;
    }
    .tech-tab-buttons{
        flex-wrap:wrap;
    }
    .tech-tab-item{
        flex-basis:48%;
        border-right:none;
    }
    .four-card-grid{
        grid-template-columns:repeat(2,1fr);
        column-gap:24px;
    }
}
@media(max-width:480px){
    .four-card-grid{
        grid-template-columns:1fr;
    }
    .four-card-item{
        padding-top:60px;
    }
}