@charset "utf-8";
/* ==========================================================================
   首页样式 — 完全匹配目标站 www.czljhb.com
   参考: index-saikai.css + media.css
   ========================================================================== */

/* ====================== Header 导航栏 ====================== */
.header{
    width:100%;
    position:fixed;
    background:#fff;
    top:0;
    left:0;
    z-index:100;
    transition:all 300ms ease-in-out;
    box-sizing:initial;
    -webkit-box-sizing:initial;
}
.header .wrapper{
    position:relative;
    height:110px;
    transition:all 300ms ease-in-out;
}
.header .logo{
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
}
.header .logo img{
    display:block;
    height:80px;
    width:auto;
}
.header .nav{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
}
.header .nav>ul>li{
    margin-left:45px;
    float:left;
    text-align:center;
    position:relative;
}
.header .nav>ul>li:first-child{margin-left:0;}
.header .nav>ul>li:after{
    display:block;
    content:"&";
    color:#d7d7d7;
    font-size:12px;
    position:absolute;
    top:50%;
    right:-28px;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
}
.header .nav>ul>li:last-child:after{display:none;}
.header .nav>ul>li>a{
    font-size:14px;
    color:#999;
    line-height:110px;
    display:block;
    transition:all 300ms ease-in-out;
}
.header .nav>ul>li:hover>a{color:#0085ce;}
.thyNavStyle{color:#0085ce !important;}
/* 下拉菜单 */
.header .nav ul li .erji{
    width:130%;
    padding:0 10px;
    background:#fff;
    position:absolute;
    top:150px;
    left:50%;
    z-index:100;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
    transition:all 300ms ease-in-out;
    border-radius:10px;
    box-shadow:0 0 10px #808080;
    opacity:0;
    visibility:hidden;
}
.header .nav ul li .erji a{
    display:block;
    font-size:12px;
    height:25px;
    overflow:hidden;
    color:#999;
    text-align:center;
    padding:5px 0;
    border-bottom:1px dashed #eee;
}
.header .nav ul li .erji a:last-child{border-bottom:none;}
.header .nav ul li .erji a:hover{color:#0086cf;}
.header .nav ul li .erji:before{
    display:block;
    content:"";
    position:absolute;
    width:0;
    height:0;
    top:-7px;
    left:50%;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-bottom:7px solid #0086cf;
}
.header .nav>ul>li:hover .erji{
    top:80px;
    opacity:1;
    visibility:visible;
}
/* 右侧电话+语言 */
.header .wrapper .top-tel{
    position:absolute;
    top:13px;
    right:0;
}
.header .wrapper .top-tel p{
    float:left;
    font-size:14px;
    color:#0084ce;
    line-height:29px;
    padding-left:28px;
    background:url(../img/top-tel-bg.png) no-repeat left center;
    margin-right:40px;
}
.header .wrapper .top-tel p span{font-weight:700;}
.header .wrapper .top-tel a{
    display:block;
    float:left;
    width:25px;
    line-height:23px;
    font-size:14px;
    color:#999;
    border:1px solid #999;
    border-radius:50%;
    text-align:center;
}
.header .wrapper .top-tel a.active{
    color:#0084ce;
    border:1px solid #0084ce;
}
.header .wrapper .top-tel a:hover{
    color:#0084ce;
    border:1px solid #0084ce;
}
.header .wrapper .top-tel a:nth-child(2){margin-right:15px;}
/* 手机菜单按钮 */
.m-btn{
    display:none;
    position:absolute;
    cursor:pointer;
    right:20px;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    z-index:200;
}
.m-btn span{
    display:block;
    width:20px;
    height:2px;
    background:#0084ce;
    position:relative;
    transition:all 200ms cubic-bezier(.4,0,0,1);
}
.m-btn span::before,.m-btn span::after{
    content:'';
    display:block;
    height:2px;
    width:20px;
    background:#0084ce;
    position:absolute;
    left:0;
    transition:all 200ms cubic-bezier(.4,0,0,1);
}
.m-btn span:before{top:-8px;}
.m-btn span:after{bottom:-8px;}
.m-btn.active span{background:transparent;margin-left:10px;}
.m-btn.active span:before{
    transform:rotate(-48deg) translate(-6px,5px);
    -webkit-transform:rotate(-48deg) translate(-6px,5px);
    width:24px;
}
.m-btn.active span:after{
    transform:rotate(48deg) translate(-6px,-5px);
    -webkit-transform:rotate(48deg) translate(-6px,-5px);
    width:24px;
}
/* 移动端适配 */
@media(max-width:992px){
    .header .wrapper{height:60px;}
    .header .logo img{height:40px;}
    .m-btn{display:block;}
    .header .top-tel{display:none;}
    .header .nav{
        position:fixed;
        left:0;
        top:60px;
        width:100%;
        height:calc(100vh - 60px);
        background:#fff;
        z-index:199;
        overflow-y:auto;
        -webkit-overflow-scrolling:touch;
        padding:0;
        transform:translateX(-100%);
        -webkit-transform:translateX(-100%);
        transition:transform 0.35s ease;
    }
    .header .nav.show{
        transform:translateX(0);
        -webkit-transform:translateX(0);
    }
    .header .nav ul{
        width: 100%;
    }
    .header .nav ul li{
        display:block !important;
        float:none;
        margin-left:0;
        padding:0;
    }
    .header .nav ul li:after{display:none;}
    .header .nav>ul>li>a{
        line-height:50px;
        font-size:16px;
        padding:0px 20px;
        border-bottom:1px solid #f0f0f0;
        color:#333;
    }
    .header .nav ul li .erji{
        display:none;
        position:static;
        width:100%;
        opacity:1;
        visibility:visible;
        transform:none;
        box-shadow:none;
        border-radius:0;
        padding:0;
        background:#f9f9f9;
    }
    .header .nav ul li .erji:before{display:none;}
    .header .nav ul li .erji a{
        text-align:left;
        padding:10px 20px 10px 35px;
        font-size:14px;
        height:auto;
        line-height:1.6;
        border-bottom:1px solid #eee;
        color:#666;
    }
}
@media(min-width:993px) and (max-width:1200px){
    .header .nav ul li .erji{display:none !important;}
}

/* ====================== 全屏垂直滚动 Swiper ====================== */
.swiper-container-h{width:100%;height:100vh;position:relative;overflow:hidden;}
.swiper-container-h .slide1,
.swiper-container-h .slide2,
.swiper-container-h .slide3,
.swiper-container-h .slide4,
.swiper-container-h .slide5,
.swiper-container-h .slide6{overflow:hidden;}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    flex-direction: column;
}
/* 导航高亮 */
.thyNavStyle{color:#0085ce !important;}

/* Banner 轮播链接 */
.swiper-container-banner .swiper-slide a{display:block;width:100%;height:100%;}
.swiper-container-banner .banner-slide{height:100%;width:100%;background-size:cover;background-position:center center;background-repeat:no-repeat;}

/* ====================== slide1: Banner ====================== */
.slide1{height:100%;position:relative;background:#f5f5f5;}
.slide1 .swiper-container-banner{width:100%;height:100vh;}

/* 向下箭头动画 */
.xia{
    width:54px;
    height:54px;
    text-indent:-999em;
    background:url("../img/xia.png") no-repeat center;
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
    bottom:60px;
    z-index:6;
    cursor:pointer;
    animation:p_move 1000ms ease-in-out infinite alternate;
    -webkit-animation:p_move 1000ms ease-in-out infinite alternate;
}
@keyframes p_move{
    from{transform:translate(0,0) translateX(-50%);-webkit-transform:translate(0,0) translateX(-50%);}
    to{transform:translate(0,20px) translateX(-50%);-webkit-transform:translate(0,20px) translateX(-50%);}
}
@-webkit-keyframes p_move{
    from{transform:translate(0,0) translateX(-50%);-webkit-transform:translate(0,0) translateX(-50%);}
    to{transform:translate(0,20px) translateX(-50%);-webkit-transform:translate(0,20px) translateX(-50%);}
}

/* ====================== slide2: 关于联江 ====================== */
.slide2{
    height:100%;
    position:relative;
    background:#0084ce;
    background:-moz-linear-gradient(#fff,rgba(94,164,209,1));
    background:-webkit-linear-gradient(#fff,rgba(94,164,209,1));
    background:-o-linear-gradient(#fff,rgba(94,164,209,1));
}
.slide2 .wrapper{margin-top:37px;}

/* 标题盒子 — 居中横条 + 背景图 */
.titlebox{
    margin:0 auto;
    width:572px;
    opacity:0;
    transition:all 1000ms linear;
    -webkit-transition:all 1000ms linear;
    background:url(../img/titlebox-bg.png) no-repeat center;
    margin-bottom:35px;
}
.titleboxmove{opacity:1 !important;}
.titlebox p{
    font-size:28px;
    color:#333;
    letter-spacing:3px;
    text-align:center;
    font-weight:700;
}
.titlebox p span{color:#0085cf;}
.titlebox .samll{
    display:block;
    font-size:12px;
    color:#666;
    letter-spacing:7px;
    text-align:center;
}
.titlebox .samll:nth-of-type(1){margin-top:15px;}
.titlebox .samll:nth-of-type(2){margin-top:5px;}

/* 公司简介内容 */
.slide2 .com_con{width:1200px;}
.slide2 .com_con p{font-size:14px;color:#666;text-align:center;line-height:2;}
.slide2 .com_con p:nth-child(-n+3){margin-bottom:25px;}
.slide2 .com_con strong{color:#333;}

/* 查看详情按钮 — 菱形hover */
.slide2 .about-a{
    display:block;
    float:right;
    font-size:14px;
    color:#0086cf;
    line-height:40px;
    overflow:hidden;
    width:300px;
    text-align:center;
    position:relative;
    z-index:5;
    margin-top:30px;
}
.slide2 .about-a:before{
    position:absolute;
    content:'';
    z-index:-1;
    -webkit-transition:all .3s;
    -moz-transition:all .3s;
    transition:all .3s;
    width:100%;
    height:0;
    top:50%;
    left:50%;
    background:#0084ce;
    opacity:0;
    -webkit-transform:translateX(-50%) translateY(-50%) rotate(45deg);
    -moz-transform:translateX(-50%) translateY(-50%) rotate(45deg);
    -ms-transform:translateX(-50%) translateY(-50%) rotate(45deg);
    transform:translateX(-50%) translateY(-50%) rotate(45deg);
}
.slide2 .about-a:hover{color:#fff;}
.slide2 .about-a:hover:before{height:295%;opacity:1;}

/* 荣誉资质区域 */
.slide2 .rongyu{
    width:100%;
    height:305px;
    background:url(../img/com-img.png) no-repeat center;
}
.slide2 .rongyu .r-left{
    float:left;
    width:400px;
    margin-top:47px;
    position:relative;
}
.slide2 .rongyu .r-right{float:right;}
.swiper-container-rongyu .swiper-slide{background:none;}
.swiper-container-rongyu .swiper-slide a{display:block;width:100%;height:100%;}
.swiper-container-rongyu .swiper-slide .pic{
    width:100%;
    height:205px;
    position:relative;
}
.swiper-container-rongyu .swiper-slide .pic img{
    position:absolute;
    max-width:100%;
    max-height:100%;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
}
.swiper-button-prev-rongyu{
    width:16px;
    height:35px;
    background:url(../img/rongyu-left.png) no-repeat center;
    left:-10px;
}
.swiper-button-next-rongyu{
    width:16px;
    height:35px;
    background:url(../img/rongyu-right.png) no-repeat center;
    right:-10px;
}

/* 波浪动画 */
@keyframes move_wave{
    0%{transform:translateX(0) translateZ(0) scaleY(1)}
    50%{transform:translateX(-25%) translateZ(0) scaleY(0.55)}
    100%{transform:translateX(-50%) translateZ(0) scaleY(1)}
}
.waveWrapper{
    overflow:hidden;
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    margin:auto;
    width:100%;
    height:219px;
}
.waveWrapperInner{
    position:absolute;
    width:100%;
    overflow:hidden;
    height:100%;
}
.bgTop{z-index:15;opacity:0.5;}
.bgMiddle{z-index:10;opacity:0.75;}
.bgBottom{z-index:5;}
.wave{
    position:absolute;
    left:0;
    width:200%;
    height:100%;
    background-repeat:repeat no-repeat;
    background-position:0 bottom;
    transform-origin:center bottom;
}
.waveTop{background-size:50% 100px;}
.waveAnimation .waveTop{
    animation:move-wave 3s;
    -webkit-animation:move-wave 3s;
    -webkit-animation-delay:1s;
    animation-delay:1s;
}
.waveMiddle{background-size:50% 120px;}
.waveAnimation .waveMiddle{
    animation:move_wave 10s linear infinite;
    -webkit-animation:move_wave 10s linear infinite;
}
.waveBottom{background-size:50% 100px;}
.waveAnimation .waveBottom{
    animation:move_wave 15s linear infinite;
    -webkit-animation:move_wave 15s linear infinite;
}

/* ====================== slide3: 应用领域（手风琴） ====================== */
.slide3{height:100%;position:relative;}
.slide3 .wrapper{position:relative;margin-top:73px;}

/* 手风琴容器 */
.dh ul{position:relative;overflow:hidden;width:1200px;height:510px;margin-top:70px;}
.dh ul li{float:left;width:240px;overflow:hidden;height:100%;position:relative;cursor:pointer;margin-right:20px;}
.dh ul li:last-child{margin-right:0;}
.dh ul li a img{height:100%;width:100%;object-fit:cover;}
.dh ul li a{display:block;width:100%;height:100%;}

/* 暗色覆盖层 */
.dh ul li .layer{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    background:rgba(27,29,36,0.4);
    height:100%;
    overflow:hidden;
}
.dh ul li .layer .p1{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    width:100%;
}
/* 图标 */
.dh ul li .layer .p1 .yy-bg{width:40px;height:43px;margin:0 auto;}
.dh ul li .layer .p2{position:absolute;bottom:5px;right:-200%;display:none;}
.dh ul li .layer .p2 b,.dh ul li .layer .p2 span{display:block;font-weight:bold;font-size:20px;}
.dh ul li .layer .p1 b,.dh ul li .layer .p1 span{
    display:block;
    color:#fff;
    text-align:center;
    margin-top:10px;
}
.dh ul li .layer .p1 .col1{font-size:20px;font-weight:700;}
.dh ul li .layer .p1 .col2{font-size:14px;margin:10px 0 20px 0;text-transform:uppercase;}
.dh ul li .layer .p1 .col3{font-size:14px;}

/* hover 展开层 */
.layer-hover{
    position:absolute;
    width:100%;
    left:50%;
    top:-100%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    height:198px;
}
.layer-hover a{display:block;}
.layer-hover .yy-bg{display:block;width:40px;height:43px;margin:0 auto;}
.layer-hover .col1{display:block;color:#fff;text-align:center;font-size:20px;font-weight:700;margin-top:10px;}
.layer-hover .col2{display:block;color:#fff;text-align:center;font-size:14px;margin:10px 0 20px 0;text-transform:uppercase;}
.layer-hover .col3{display:block;color:#fff;text-align:center;font-size:14px;}
.dh ul li.curr{}

/* 展开内容框 */
.abox{
    position:absolute;
    bottom:-100%;
    left:0;
    width:100%;
    background:#fff;
    height:250px;
    padding:30px 25px;
    border:1px solid #d2d2d2;
    border-top:none;
}
.abox .abox-con{font-size:14px;color:#666;line-height:25px;}
.abox .yinyong-a{
    display:block;
    position:relative;
    width:225px;
    line-height:45px;
    height:45px;
    text-align:center;
    color:#0086cf;
    border:1px solid #0086cf;
    margin:0 auto;
    z-index:5;
    overflow:hidden;
    font-size:14px;
    margin-top:31px;
}
.abox .yinyong-a:before{
    position:absolute;
    content:'';
    z-index:-1;
    -webkit-transition:all .3s;
    -moz-transition:all .3s;
    transition:all .3s;
    width:100%;
    height:0;
    top:50%;
    left:50%;
    background:#0086cf;
    opacity:0;
    -webkit-transform:translateX(-50%) translateY(-50%) rotate(45deg);
    -moz-transform:translateX(-50%) translateY(-50%) rotate(45deg);
    -ms-transform:translateX(-50%) translateY(-50%) rotate(45deg);
    transform:translateX(-50%) translateY(-50%) rotate(45deg);
}
.abox .yinyong-a:hover:before{height:295%;opacity:1;}
.abox .yinyong-a:hover{color:#fff;}

/* ====================== slide4: 产品展示 ====================== */
.slide4{
    height:100%;
    position:relative;
    background:url("../img/slide4.jpg") center center / cover no-repeat;
}
.slide4 .wrapper{position:relative;margin-top:75px;}
.slide4 .content{
    width:1200px;
    height:566px;
    background:url(../img/probg.png) repeat;
    border-radius:8px;
    padding:15px;
}
.slide4 .content .innerbox{
    width:100%;
    height:100%;
    background:#fff;
    border-radius:8px;
}
.slide4 .content .innerbox ul li{
    float:left;
    margin-left:18px;
    margin-top:18px;
}
.slide4 .content .innerbox ul li a{display:block;}
.slide4 .content .innerbox ul li a .pic{
    width:270px;
    height:214px;
    border:1px solid #dcdcdc;
    overflow:hidden;
    position:relative;
}
.slide4 .content .innerbox ul li a p{font-size:14px;color:#666;margin-top:10px;}
.slide4 .content .innerbox ul li a .pic img{
    max-width:100%;
    max-height:100%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    transition:all 300ms ease-in-out;
}
.slide4 .content .innerbox ul li:hover a .pic img{
    transform:translate(-50%,-50%) scale(1.05);
    -webkit-transform:translate(-50%,-50%) scale(1.05);
}

/* ====================== slide5: 成功案例 ====================== */
.slide5{height:100%;}
.slide5 .wrapper{margin-top:75px;}
.slide5 .anlibox{position:relative;}
.slide5 .s-box{
    float:right;
    width:218px;
    height:218px;
    overflow:hidden;
}
.list-box.list-boxsec{background:url(../img/listsecbg.png) no-repeat left center;}
.slide5 .s-box.shdow{
    box-shadow:0px 0px 13px #e2e2e2;
    background:#fff;
    padding:0 30px;
    transition:all 300ms ease-in-out;
}
.slide5 .s-box.shdow:hover{box-shadow:0px 0px 13px #0084ce;}
.slide5 .s-box.shdow img{
    margin:0 auto;
    margin-bottom:20px;
    margin-top:50px;
}
.slide5 .s-box.four img{margin-top:67px;}
.slide5 .s-box.shdow p{font-size:14px;color:#666;line-height:30px;}
.slide5 .t-box{
    position:absolute;
    left:0;
    top:27px;
    width:325px;
    text-align:left;
    opacity:0;
    transition:all 1000ms ease-in-out;
}
.slide5 .t-box p:nth-child(1){font-size:28px;color:#0183ce;font-weight:700;}
.slide5 .t-box p:nth-child(2){font-size:16px;color:#0183ce;font-weight:200;line-height:25px;margin-top:20px;}

/* ====================== slide6: 合作客户 ====================== */
.slide6{height:100%;position:relative;}
.slide6 .wrapper{margin-top:20px;}
.slide6 .content{position:relative;}
.slide6 .swiper-container-hezuo .swiper-slide a{display:block;width:100%;}
.slide6 .swiper-container-hezuo .pic{
    width:100%;
    height:170px;
    border:1px solid #e5e5e5;
    overflow:hidden;
    position:relative;
    transition:all 300ms ease-in-out;
}
.slide6 .swiper-container-hezuo .pic img{
    max-width:100%;
    max-height:100%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    transition:all 300ms ease-in-out;
}
.slide6 .swiper-container-hezuo .swiper-slide:hover a .pic img{
    transform:scale(1.05) translate(-50%,-50%);
    -webkit-transform:scale(1.05) translate(-50%,-50%);
}
.slide6 .swiper-container-hezuo .swiper-slide:hover a .pic{border:1px solid #0085cf;}
.swiper-button-next-hezuo{
    width:20px;
    height:43px;
    background:url(../img/hezuo-right.png) no-repeat center;
    transition:all 300ms ease-in-out;
    right:-30px;
}
.swiper-button-prev-hezuo{
    width:20px;
    height:43px;
    background:url(../img/hezuo-left.png) no-repeat center;
    transition:all 300ms ease-in-out;
    left:-30px;
}
.swiper-button-next-hezuo:hover{background:url(../img/hezuo-right1.png) no-repeat center;}
.swiper-button-prev-hezuo:hover{background:url(../img/hezuo-left1.png) no-repeat center;}

/* ====================== slide7: 新闻动态 ====================== */
.slide7{
    height:100%;
    position:relative;
    background:url("../img/slide7.jpg") center center / cover no-repeat;
}
.slide7 .wrapper{margin-top:50px;}
.slide7 .news-left{float:left;width:50%;}
.slide7 .news-left .n-list{
    padding:25px 0 25px 65px;
    border-bottom:1px solid #fff;
    height:91px;
}
.slide7 .news-left .biaobox{
    line-height:50px;
    background:#0086cf;
    text-align:center;
    font-size:16px;
    color:#fff;
}
.slide7 .news-leftsec{background:url(../img/newsbg2.png) repeat;}
.slide7 .news-leftsec .n-list{padding:0;border-bottom:none;}
.slide7 .news-leftsec .n-list .title{
    padding:0 45px;
    border-bottom:1px dashed #fff;
    line-height:91px;
    font-size:16px;
    color:#666;
    transition:all 300ms ease-in-out;
}
.slide7 .news-leftsec .n-list:hover .title{color:#0086cf;font-weight:700;}
.slide7 .news-leftsec .biaobox{background:#444;}
.slide7 .news-left .time{
    float:left;
    width:40px;
    line-height:40px;
    background:#999;
    text-align:center;
    font-size:16px;
    color:#fff;
    font-weight:700;
    letter-spacing:2px;
    transition:all 300ms ease-in-out;
}
.slide7 .news-left .n-list:hover .time{background:#0086cf;}
.slide7 .news-left .text{
    float:left;
    width:488px;
    text-align:left;
    padding-left:25px;
    position:relative;
}
.slide7 .news-left .text .jiantou{
    position:absolute;
    width:0;
    height:14px;
    background:url(../img/news-img.png) no-repeat center;
    right:58px;
    top:46%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    transition:all 300ms ease-in-out;
    overflow:hidden;
}
.slide7 .news-left .n-list:hover .text .jiantou{width:89px;}
.slide7 .news-left .text .title{
    font-size:16px;
    color:#666;
    font-weight:700;
    transition:all 300ms ease-in-out;
}
.slide7 .news-left .n-list:hover .text .title{color:#0086cf;}
.slide7 .news-left .text .con{
    font-size:14px;
    color:#999;
    transition:all 300ms ease-in-out;
}
.slide7 .news-left .n-list:hover .text .con{color:#666;}

/* ====================== slide8: 联系我们 ====================== */
.slide8{position:relative;}
.slide8 .wrapper{margin-top:50px;}
.slide8 .content{
    width:100%;
    height:481px;
    background:url(../img/contact-bg.png) no-repeat center;
    position:relative;
}
.slide8 .c-left{
    float:left;
    width:420px;
    height:100%;
    background:url(../img/zuo.png) no-repeat left center;
    padding-top:53px;
}
.slide8 .c-left .c-list{text-align:left;padding-left:49px;}
.slide8 .c-left .c-list:nth-child(2){margin-top:63px;}
.slide8 .c-left .c-list:nth-child(3){margin-top:63px;}
.slide8 .c-left .c-list:nth-child(4){margin-top:65px;}
.slide8 .c-left .c-list p:nth-child(1){font-size:20px;color:#666;}
.slide8 .c-left .c-list p:nth-child(2){font-size:16px;color:#999;}
.slide8 .c-right{
    width:390px;
    text-align:left;
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
}
.slide8 .c-right .top p{
    float:left;
    width:50%;
    font-size:15px;
    color:#666;
    margin-bottom:40px;
}
.slide8 .c-right p{font-size:16px;color:#666;}
.slide8 .erbox{
    position:absolute;
    top:48%;
    left:51%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
}
.slide8 .erbox img{width:195px;}

/* ====================== .last 版权栏（每个slide底部） ====================== */
.last{
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    line-height:40px;
    z-index:20;
}
.last-center{float:left;}
.last-center p{
    font:12px 'Microsoft YaHei';
    color:#fff;
    line-height:40px;
}
.last-center p a{color:#fff;}
.last-right{position:inherit;float:right;}
.last-right a{
    font:12px 'Microsoft YaHei';
    color:#fff;
    line-height:40px;
}
/* slide4 和 slide8 暗色背景下的版权栏文字为白色 */
.slide4 .last p,.slide4 .last p a,.slide4 .last-right a{color:#fff;}
/* slide5 浅色背景 */
.slide2 .last p,.slide2 .last p a,.slide2 .last-right a,
.slide3 .last p,.slide3 .last p a,.slide3 .last-right a,
.slide6 .last p,.slide6 .last p a,.slide6 .last-right a,
.slide7 .last p,.slide7 .last p a,.slide7 .last-right a,
.slide8 .last p,.slide8 .last p a,.slide8 .last-right a,
.slide5 .last p,.slide5 .last p a,.slide5 .last-right a{color:#666;}

/* ====================== 翻页分页器 ====================== */
.swiper-pagination-h{
    position:fixed;
    right:30px;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    z-index:10;
}
.swiper-pagination-h .swiper-pagination-bullet{
    display:block;
    margin:10px 0;
    width:12px;
    height:12px;
    background:#ccc;
    opacity:1;
    border-radius:50%;
}
.swiper-pagination-h .swiper-pagination-bullet-active{background:#0086cf;}

/* ====================== 响应式适配 (max-width:1366px) ====================== */
@media screen and (max-width:1366px) and (max-height:680px){
    .titlebox .samll:nth-of-type(1){margin-top:0;}
    .titlebox p{font-size:24px;}
    .titlebox{margin-bottom:15px;}
    .xia{bottom:30px;}
    .slide2 .wrapper{margin-top:40px;}
    .slide2 .com_con p:nth-child(-n+3){margin-bottom:10px;}
    .slide2 .about-a{margin-top:10px;}
    .slide2 .rongyu{height:200px;background-size:15%;}
    .swiper-container-rongyu .swiper-slide .pic{height:177px;}
    .slide2 .rongyu .r-left{margin-top:15px;}
    .slide3 .wrapper{margin-top:65px;}
    .dh ul{margin-top:28px;height:390px;}
    .abox{height:217px;}
    .abox .yinyong-a{margin-top:20px;width:190px;line-height:35px;height:35px;}
    .abox .yinyong-a:hover:before{height:338%;}
    .dh ul li .layer .p1 .col1{font-size:16px;}
    .layer-hover .col1{font-size:16px;}
    .slide4 .wrapper{margin-top:84px;}
    .slide4 .content{height:426px;}
    .slide4 .content .innerbox ul li a .pic{height:151px;}
    .slide4 .content .innerbox ul li a p{margin-top:5px;}
    .slide5 .wrapper{margin-top:85px;}
    .slide5 .s-box{width:160px;height:160px;}
    .list-box.list-boxsec{background:none;}
    .slide5 .s-box.shdow img{margin-bottom:7px;margin-top:24px;}
    .slide5 .s-box.four img{margin-top:47px;}
    .slide5 .s-box.shdow p{line-height:20px;}
    .slide6 .wrapper{margin-top:74px;}
    .slide6 .swiper-container-hezuo .pic{height:135px;}
    .slide7 .wrapper{margin-top:82px;}
    .slide7 .news-leftfir .n-list{height:auto;padding:15px 0 15px 65px;}
    .slide7 .news-leftsec .n-list{padding:0;height:auto;}
    .slide7 .news-leftsec .n-list .title{line-height:70px;}
    .slide8 .wrapper{margin-top:82px;}
    .slide8 .content{height:373px;background-size:33%;}
    .slide8 .c-left{padding-top:59px;background-size:6%;}
    .slide8 .c-left .c-list p:nth-child(1){font-size:16px;}
    .slide8 .c-left .c-list p:nth-child(2){font-size:14px;}
    .slide8 .c-left .c-list:nth-child(2){margin-top:31px;}
    .slide8 .c-left .c-list:nth-child(3){margin-top:33px;}
    .slide8 .c-left .c-list:nth-child(4){margin-top:35px;}
    .slide8 .erbox img{width:160px;}
    .slide8 .erbox{top:46%;left:51%;}
}

/* ====================== 移动端适配 (max-width:992px) ====================== */
@media(max-width:992px){
    .wrapper{width:100%;padding:0 15px;}
    .swiper-container-h{height:auto;overflow:visible;}
    .swiper-container-h > .swiper-wrapper{flex-direction:column !important;transform:none !important;height:auto !important;}
    .swiper-container-h > .swiper-slide{height:auto !important;min-height:auto !important;overflow:visible;}
    .slide1 .swiper-container-banner{height:45vh;}
    .swiper-container-banner > .swiper-wrapper,.swiper-container-banner > .swiper-wrapper > .swiper-slide,.swiper-container-banner > .swiper-wrapper > .swiper-slide > a,.swiper-container-banner .banner-slide{height:100%;}
    .titlebox{position:relative;width:100% !important;height:auto;padding:15px;opacity:1 !important;background:none;margin-bottom:15px;}
    .titlebox p{font-size:18px;padding:10px 0;width:auto;}
    .titlebox .samll{width:auto;}
    .slide2 .wrapper,.slide3 .wrapper,.slide4 .wrapper,.slide5 .wrapper,.slide6 .wrapper,.slide7 .wrapper,.slide8 .wrapper{margin-top:20px;}
    .slide2 .com_con{width:100%;padding:0 15px;}
    .slide2 .com_con p{text-align:left;}
    .slide2 .about-a{float:none;margin:15px auto;width:auto;}
    .slide2 .rongyu{height:auto;background:none;}
    .slide2 .rongyu .r-left{width:100%;float:none;margin-top:0;margin-bottom:20px;}
    .slide2 .rongyu .r-right{float:none;}
    .swiper-container-rongyu .swiper-slide .pic{height:150px;}
    .waveWrapper{display:none;}
    .dh ul{width:100%;height:auto;flex-direction:column;}
    .dh ul li{width:100%;height:200px;margin-right:0;margin-bottom:10px;}
    .dh ul li .layer{height:100%;}
    .abox{position:relative;bottom:auto;height:auto;padding:15px;}
    .slide4 .content{width:100%;height:auto;padding:10px;}
    .slide4 .content .innerbox ul li{width:48%;margin-left:0;}
    .slide4 .content .innerbox ul li a .pic{width:100%;height:120px;}
    .slide5 .s-box{width:48%;height:150px;}
    .slide5 .s-box.shdow img{margin-top:15px;margin-bottom:5px;}
    .slide5 .t-box{position:relative;width:100%;opacity:1;padding:15px;}
    .slide6 .swiper-container-hezuo .pic{height:100px;}
    .slide7 .news-left{width:100%;float:none;margin-bottom:20px;}
    .slide7 .news-left .n-list{height:auto;padding:10px 15px;}
    .slide7 .news-left .text{width:100%;}
    .slide8 .content{height:auto;padding:20px 15px;background:none;}
    .slide8 .c-left{float:none;width:100%;background:none;padding-top:0;}
    .slide8 .c-left .c-list{padding-left:0;margin-top:15px !important;}
    .slide8 .c-right{position:relative;top:auto;transform:none;width:100%;}
    .slide8 .c-right .top p{width:100%;float:none;margin-bottom:10px;}
    .slide8 .erbox{position:relative;top:auto;left:auto;transform:none;margin:20px auto;}
    .last{position:relative;}
    .swiper-pagination-h{display:none;}
}

/* ============================================================
   移动端优化补充 (max-width:992px)
   说明：以下为在原有适配基础上【增量补充】，不覆盖上方已有规则。
   主要修复：① 手风琴 JS 内联宽度(419px)在手机上撑破布局 → 用 !important 压回单列卡片；
            ② slide4 平铺背景剔除、版权条居中、底部固定导航占位。
   ============================================================ */
@media(max-width:992px){
    /* —— slide3 手风琴：压回 global.js 设的内联 width/position，改为纵向卡片 —— */
    .dh ul{display:flex;flex-direction:column;}
    .dh ul li,
    .dh ul li.curr,
    .dh ul li.curr:hover{
        width:100% !important;
        height:auto !important;
        float:none !important;
        margin:0 0 20px 0 !important;
    }
    
    .dh ul li a img{height:160px !important;}
    .dh ul li .layer{
        position:relative !important;
        bottom:auto !important;
        left:auto !important;
        height:auto !important;
        padding:12px 15px;
        background:rgba(27,29,36,0.55);
    }
    .dh ul li .layer .p1{
        position:relative !important;
        left:auto !important;
        top:auto !important;
        transform:none !important;
        -webkit-transform:none !important;
    }
    .dh ul li .layer .p2{display:none !important;}
    .dh ul li .layer-hover{display:none !important;}
    .dh ul li .abox{
        position:relative !important;
        bottom:auto !important;
        height:auto !important;
        padding:15px;
    }

    /* —— slide4 产品面板在手机上去掉 probg 平铺背景，避免拥挤 —— */
    .slide4 .content{background:none;}

    /* —— 版权条 .last：手机上居中堆叠，避免左右 float 挤压 —— */
    .last{text-align:center;line-height:1.8;padding:10px 0;}
    .last-center,
    .last-right{float:none !important;text-align:center;}
    .last-center p,
    .last-right a{line-height:1.8;}

    /* —— 底部固定导航(m-footer)占位，避免最后一块内容被遮挡 —— */
    body{padding-bottom:70px;}
}

/* ============================================================
   超小屏手机 (max-width:576px) — 产品/案例改为单列，字号收敛
   ============================================================ */
@media(max-width:576px){
    .titlebox p{font-size:16px;}
    .titlebox .samll{font-size:13px;}
    .slide2 .com_con p{font-size:14px;}
    .slide4 .content .innerbox ul li{width:100%;}
    .slide4 .content .innerbox ul li a .pic{height:170px;}
    .slide5 .s-box{width:100%;height:auto;min-height:120px;padding:15px 10px;}
    .slide5 .s-box.shdow img{margin:10px auto 5px;}
    .slide6 .swiper-container-hezuo .pic{height:80px;}
    .slide8 .c-left .c-list p:nth-child(1){font-size:15px;}
}
