@charset "utf-8";
/* ===================首页样式========================== */
/* common */
.com-tip{font-size:16px;color:#777;line-height:24px;font-weight:500}
.com-tit+.com-tip{margin-top:15px}

/* banner */
.banner .bg{display:block;overflow:hidden;width:100%}
.banner .bg img{height:100vh;width:100%}
.banner .swiper-container-horizontal>.swiper-pagination-bullets{bottom:58px}
.banner .swiper-pagination-bullet{width:10px;height:10px;background:#fff;opacity:1;transition:all .8s ease}
.banner .swiper-pagination-bullet-active{width:40px;border-radius:30px}
.banner .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 5px}
.banner .swiper-slide-active .banner-cont .content{transform:translateY(0);opacity:1}
.banner-cont{position:absolute;left:0;top:0;width:100%;height:100%}
.banner-cont .contain{display:flex;align-items:center;justify-content:center;height:100%}
.banner-cont .content{display:inline-block;color:#fff;background:rgba(0,0,0,.5);padding:80px 120px 70px;text-align:center;opacity:0;transform:translateY(-10px);transition:all 1s ease .2s}
.banner-cont .content .max_tit{font-weight:bold;border-bottom:5px solid #096fc8;text-align:center;color:#096fc8;display:inline-block}
.banner-cont .content .max_tit+.title{margin-top:20px}
.banner-cont .content .title{font-weight:500;text-align:center}
.banner-cont .content .title i{font-style:normal;font-weight:700;color:transparent;text-stroke:1px #fff;-webkit-text-stroke:1px #fff}
.banner-cont .content ._icon{display:flex;margin-top:30px;flex-wrap:wrap}
.banner-cont .content ._icon li{width:20%;text-align:center;transition:all 1s ease}
.banner-cont .content ._icon li .icon{height:32px;display:flex;align-items:flex-end;justify-content:center}
.banner-cont .content ._icon li .sub-tit{font-weight:500;margin-top:14px}
.banner-cont .content ._text{margin-top:20px;display:flex;flex-wrap:wrap;margin-left:36px}
.banner-cont .content ._text li{font-size:22px;font-weight:500;position:relative;margin-right:18px;padding-right:18px}
.banner-cont .content ._text li:after{content:'';width:3px;height:20px;right:0;top:50%;transform:translateY(-50%);background:#fff;position:absolute}
.banner-cont .content ._text li:last-child:after{display:none}

/* 关于我们 */
.index-about{background:#f4f4f4 url(../images/index/index-about-bg.jpg) no-repeat bottom right}
.index-about .lft{width:74%}
.index-about .lft .text{font-size:16px;line-height:26px;color:#777;max-width:800px}
.index-about .lft .data li+li{margin-left:110px}
.index-about .lft .data .num{font-size:18px;color:#333;line-height:1}
.index-about .lft .data .num .timer{display:inline-block;line-height:1;margin-right:10px;font-family:OPPOSANS-B;color:#096fc8}
.index-about .lft .data .tit{font-size:16px;color:#555;margin-top:10px}
.index-about .rgt{width:26%}
.index-about .rgt .desc{color:#333;font-weight:500}
.index-about .rgt .player{display:inline-block;font-size:16px;line-height:1;font-weight:500;transition:all .4s ease}
.index-about .rgt .player i{width:66px;height:66px;background:#fff;margin-left:auto;margin-right:auto;border-radius:50%;display:block;position:relative;margin-bottom:10px;transition:all .4s ease;box-shadow:1px 19px 21px 0 rgba(35,154,208,.1)}
.index-about .rgt .player i:after{content:"";width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid #096fc8;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin-left:2px}
.index-about .rgt .player:hover{color:#096fc8}

/* 服务范围 */
.index-serve .contain{z-index:2}
.index-serve .heading{overflow:hidden}
.index-serve .heading .bg{position:absolute;bottom:-110px;right:-40px;z-index:-1}
.index-serve .content{padding-top:276px;z-index:2}
.index-serve .content .bg{position:absolute;padding-top:26.1234%;left:0;top:0;width:100%;z-index:-1}
.index-serve .content .bg img{position:absolute;left:0;top:0;opacity:0;transition:all .6s ease}
.index-serve .content .bg img.active{opacity:1}
.index-serve .content ul{background:#0764c0 url(../images/index/index-serve-in-bg.jpg) no-repeat center/cover;color:#fff;display:flex;flex-wrap:wrap}
.index-serve .content ul li{width:20%;padding:86px 36px 100px 40px}
.index-serve .content ul li+li{border-left:1px solid rgba(58,167,167,.3)}
.index-serve .content ul li .tit{font-weight:500;line-height:1;position:relative;padding-bottom:20px}
.index-serve .content ul li .tit:after{content:'';width:18px;height:2px;background:#fff;position:absolute;left:0;bottom:0;transition:width .4s ease}
.index-serve .content ul li .list{display:flex;flex-wrap:wrap;margin-top:10px;margin-left:-30px}
.index-serve .content ul li .list p{font-size:15px;margin-top:10px;margin-left:30px}
.index-serve .content ul li .list p:nth-child(odd){min-width:32%}
.index-serve .content ul li.active .tit:after{width:100%}

/* 成功案例 */
.index-case .content .tab-cell:not(:first-child){display:none}
.index-case .content .list-item{display:flex;justify-content:space-between;padding-right:15px}
.index-case .content .list-item .bg{transition:all .6s ease}
.index-case .content .list-item:first-child{margin-top:-15px}
.index-case .content .list-item li{width:50%;display:flex;flex-wrap:wrap;align-items:flex-start}
.index-case .content .list-item .item{margin:15px 0 0 15px;display:block;position:relative;padding-top:32.3%;width:calc(50% - 15px);color:#fff;overflow:hidden}
.index-case .content .list-item .item.max{width:100%;padding-top:66.075%}
.index-case .content .list-item .item.max-width{width:100%}
.index-case .content .list-item .item .in{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.58);display:flex;flex-direction:column;justify-content:center;padding:0 56px;opacity:0;visibility:hidden;transition:all .6s ease}
.index-case .content .list-item .item .in .in-title{font-size:20px;font-weight:500;transform:translateY(20px);transition:all .6s ease .2s;opacity:0}
.index-case .content .list-item .item .in .desc{margin-top:15px;font-size:15px;transform:translateY(20px);opacity:0;transition:all .6s ease .3s}
.index-case .content .list-item .item .in .link{display:flex;flex-wrap:wrap;align-items:center;margin-top:35px;opacity:0;transform:translateY(20px);transition:all .6s ease .4s}
.index-case .content .list-item .item .in .link i{display:block;background:url(../images/index/link-icon.png) no-repeat center/100%;width:16px;height:16px}
.index-case .content .list-item .item .in .link label{font-size:14px;font-weight:500;margin-left:10px}
.index-case .content .list-item .item .title{position:absolute;left:0;bottom:0;width:100%;padding:26px;font-size:18px;font-weight:500;background:linear-gradient(180deg,rgba(255,255,255,0) 0,rgba(0,0,0,.6) 100%);transition:all .4s ease}
.index-case .content .list-item .item:hover .bg{transform:scale(1.02)}
.index-case .content .list-item .item:hover .title{opacity:0;transform:translateY(100%)}
.index-case .content .list-item .item:hover .in{opacity:1;visibility:visible}
.index-case .content .list-item .item:hover .desc,.index-case .content .list-item .item:hover .in-title,.index-case .content .list-item .item:hover .link{opacity:1;transform:translateY(0)}
.menu-tab{display:flex;flex-wrap: wrap}
.menu-tab a{font-size:15px;color:#797979;font-weight:500;transition:color .4s ease}
.menu-tab li{padding-left:26px;position:relative}
.menu-tab li:after{content:'';width:12px;height:12px;border-radius:50%;border:3px solid #096fc8;position:absolute;left:0;top:6px;transform:scale(0);transition:all .4s ease}
.menu-tab li.active:after{transform:scale(1)}
.menu-tab li:hover a{color:#096fc8}
.menu-tab li+li{margin-left:20px}

/* 新闻 */
.index-news .item-cell:not(:first-child){display:none}
.index-news .item-cell .lft{width:68.5%}
.index-news .item-cell .lft .nav{border:1px solid #ededed;border-right:0;border-bottom:0;width:27.5%}
.index-news .item-cell .lft .nav .item{padding:0 40px;position:relative;height:33.33%}
.index-news .item-cell .lft .nav .item:after{content:'';width:100%;height:1px;background:#ededed;bottom:0;left:0;position:absolute;transition:all .8s ease}
.index-news .item-cell .lft .nav .item:hover .title{color:#096fc8}
.index-news .item-cell .lft .nav .item:hover i{background-color:#096fc8;border-color:#096fc8;background-image:url(../images/index/arrow-right-w.png)}
.index-news .item-cell .lft .slider{width:72.5%}
.index-news .item-cell .lft .slider img,.index-news .item-cell .rgt .pic img{transition:all .6s ease;transform:scale(1.04)}
.index-news .item-cell .lft .slider:hover img,.index-news .item-cell .rgt:hover img{transform:scale(1)}
.index-news .item-cell .lft .slider .swiper-slide{padding-top:67.121%;overflow:hidden}
.index-news .item-cell .rgt{width:31.5%;padding-left:22px}
.index-news .item-cell .rgt .item{height:100%}
.index-news .item-cell .rgt .info{height:50%;background:#f5f5f5;display:flex;flex-direction:column;justify-content:center;padding:0 46px}
.index-news .item-cell .rgt .pic{height:50%;overflow:hidden}
.index-news .item-cell .item{display:flex;flex-direction:column;justify-content:center;background:#f5f5f5}
.index-news .item-cell .item .title{font-size:16px;line-height:24px;color:#333;font-weight:500;transition:all .4s ease}
.index-news .item-cell .item .desc{color:#777;margin-top:10px}
.index-news .item-cell .item span{font-size:14px;color:#888}
.index-news .item-cell .item i{border-radius:30px;background:url(../images/index/arrow-right.png) no-repeat center/15px auto;display:block;width:34px;height:22px;border:1px solid #d1d1d1;transition:all .4s ease}
.index-news .item-cell .item.active:after{background:#096fc8!important}
.index-news .item-cell .item:hover .title{color:#096fc8}
.index-news .item-cell .item:hover i{background-color:#096fc8;border-color:#096fc8;background-image:url(../images/index/arrow-right-w.png)}

/* -------------------------PC端--------------------------- */
@media all and (max-width:1700px) {
    /* 1600 × (900) */
    .banner-cont .content{padding: 60px 90px}
    .index-about .lft{width: 70%}
    .index-about .lft .data li + li{margin-left: 80px}
    .index-about .rgt .player i{width: 60px;height: 60px}
    .index-serve .content ul li{padding: 60px 30px 80px}
    .index-serve .content ul li .list p{margin-left: 20px}
    .index-serve .content ul li .list{margin-left: -20px}
    .index-news .item-cell .lft .nav .item{padding: 0 30px}
    .index-news .item-cell .rgt .info{padding: 0 40px}
}

@media all and (max-width:1599px) {
    /* 1440 × (700)  */
    .index-case .content .list-item .item .in{padding: 0 40px}
    .index-case .content .list-item .item .in .desc{margin-top: 10px}
    .index-case .content .list-item .item .in .link{margin-top: 25px}
    .index-case .content .list-item .item .title{padding: 20px}
    .menu-tab li{padding-left: 20px}
    .index-news .item-cell .lft .nav .item{padding: 0 20px}
    .index-news .item-cell .item .title{font-size: 15px;line-height: 22px}
    .index-case .content .list-item .item .in .in-title{font-size: 18px}
    .banner-cont .content ._text li{font-size:20px}
    .index-about{background-position:bottom -110px right}
}

@media all and (max-width:1439px) {
    /* 1360 */
}

@media all and (max-width:1359px) {
    /* 1280 */
}

@media all and (max-width:1279px) {
    /* 1152 × (700) */
    .banner .swiper-pagination-bullet-active{width: 32px}
    .banner-cont .content{padding: 50px 70px}
    .banner-cont .content ._icon li .sub-tit{margin-top: 5px}
    .index-about .rgt{width: 28%}
    .index-about .lft{width: 66%}
    .index-about .lft .data li + li{margin-left: 60px}
    .index-about .lft .data .num .timer{margin-right: 5px}
    .index-serve .content{padding-top: 160px}
    .index-serve .content ul li{padding: 50px 30px}
    .index-serve .content ul li .tit{padding-bottom: 15px}
    .menu-tab li + li{padding-left: 15px}
    .index-case .content .list-item .item{width:calc(50% - 10px);margin: 10px 0 0 10px}
    .index-case .content .list-item:first-child{margin-top: -10px}
    .index-case .content .list-item .item .in{padding: 0 20px}
    .index-case .content .list-item .item .in .in-title{font-size: 16px}
    .index-case .content .list-item .item .in .desc{font-size: 14px}
    .index-case .content .list-item .item .in .link{margin-top: 20px}
    .index-news .item-cell .lft{width: 100%}
    .index-news .item-cell .rgt{width: 100%;padding-left: 0;margin-top: 30px}
    .index-news .item-cell .rgt .item{flex-direction: row-reverse}
    .index-news .item-cell .rgt .pic{height: auto;width: 72.5%}
    .index-news .item-cell .rgt .info{height: auto;width: 27.5%;padding: 0 25px}
    .index-news .item-cell .item i{width: 30px;height: 18px;background-size: 11px auto}
}

@media all and (max-width:1151px) {
    /* 1024 */
    .banner .banner-cont .content{transform: none;opacity: 1}
}


/* ------------------------手机端-------------------------- */
@media all and (max-width:1000px) {
    /* 平板设备 720 适配 */
    .banner .bg img{height: calc(100vh - 60px)}
    .banner .swiper-container-horizontal > .swiper-pagination-bullets{bottom: 40px}
    .banner-cont .content .max_tit+.title{margin-top:10px}
    .banner-cont .content .max_tit{border-width:3px}
    .banner-cont .content ._text li{font-size:18px;margin-right:10px;padding-right:10px}
    .banner-cont .content ._text li:after{height:12px;width:2px}
    .banner-cont .content ._text{margin-left:20px;margin-top:15px}
    .banner-cont .content ._icon{margin-top:15px}
    .banner-cont .content ._text li:after{height:16px;width:2px}
    .banner-cont .content ._icon li .sub-tit{font-size: 18px}
    .banner-cont .content .title i{display: block}
    .banner-cont .content{padding: 20px;width: 100%}
    .banner .swiper-pagination-bullet{width: 8px;height: 8px}
    .banner .swiper-pagination-bullet-active{width: 26px}
    .com-tit + .com-tip{margin-top: 2px}
    .index-about .lft{width: 100%}
    .index-about .rgt{width: 100%;margin-top: 30px}
    .index-about .rgt .player i{width: 44px;height: 44px}
    .index-about .lft .data{justify-content: center}
    .index-serve .content .bg{padding-top: 300px}
    .index-serve .content ul li .tit{font-size: 18px;padding-bottom: 10px}
    .index-serve .content ul li .tit:after{height: 1px}
    .index-serve .content{padding-top:120px}
    .index-serve .content ul li{padding: 30px 10px}
    .index-serve .content ul li .list p{font-size: 14px;margin-top: 6px}
    .index-case .heading .rgt,.index-case .heading .lft,.index-news .heading .rgt,.index-news .heading .lft{width: 100%}
    .index-case .heading{padding-bottom: 20px}
    .menu-tab{justify-content: center;margin-top: 20px;width: 100%}
    .com-tit,.com-tip{text-align: center}
    .com-tit .en{left:50%;transform:translate(-50%,-50%)}
    .index-case .content .list-item .item .title{font-size: 16px;padding: 15px}
    .index-case .content .list-item li{width: 100%}
    .index-case .content .list-item{flex-wrap: wrap}
    .index-news .content{margin-top: 20px}
    .index-news .item-cell .lft{flex-wrap: wrap-reverse}
    .index-news .item-cell .lft .nav{width: 100%}
    .index-news .item-cell .lft .nav .item{padding: 20px}
    .index-news .item-cell .lft .slider{width: 100%}
}
@media all and (max-width:640px) {
    /* 移动终端以上 360 适配 */
    .com-tit+.com-tip{margin-top:10px}
    .banner-cont .content{padding: 20px 10px}
    .banner .bg img{height: auto;min-height: 360px}
    .banner-cont .content ._text li{font-size:14px}
    .banner .swiper-container-horizontal > .swiper-pagination-bullets{bottom: 20px}
    .banner-cont .content ._icon li .sub-tit{font-size: 12px}
    .com-tip{font-size: 15px;line-height: 22px}
    .index-about .lft .text{font-size: 15px;line-height: 24px}
    .index-about .lft .data li+li{margin: 20px 0 0}
    .index-about .lft .data{flex-wrap: wrap}
    .index-about .lft .data li{width: 50%;margin-top: 20px;text-align: center}
    .index-about .lft .data .tit{font-size: 15px;margin-top: 5px}
    .index-about{background-size: contain}
    .index-serve .content ul li{width: 100%}
    .index-serve .content ul li + li{border-left: 0;border-top: 1px solid rgba(58, 167, 167, 0.3)}
    .menu-tab li:after{display: none}
    .menu-tab li + li{padding: 0}
    .menu-tab li.active a{color: #239ad0}
    .index-case .heading{padding-bottom: 15px}
    .index-case .content .list-item .item:hover .in{display: none}
    .index-case .content .list-item .item .in .in-title{font-size: 15px}
    .index-case .content .list-item .item .in .desc{font-size: 13px;margin-top: 5px}
    .index-case .content .list-item .item .in .link{margin-top: 15px}
    .index-case .content .list-item .item .in .link label{font-size: 12px}
    .index-case .content .list-item .item:hover .title{opacity: 1;transform: none}
    .index-case .content .list-item .item .title{font-size: 15px;padding: 10px}
    .index-case .content .list-item .item{width: calc(50% - 5px);margin: 5px 0 0 5px}
    .index-news .content{margin-top: 15px}
    .index-news .item-cell .item{flex-wrap: wrap}
    .index-news .item-cell .rgt .info{width: 100%;padding: 20px}
    .index-news .item-cell .rgt .pic{width: 100%}
    .index-news .item-cell .rgt{margin-top: 20px}
    .index-serve .content ul li .list p:nth-child(odd){min-width: 0}
    .index-news .item-cell .lft .nav .item{height: auto}
    .menu-tab li{padding-left: 0}
    .menu-tab a{font-size: 14px}
    .menu-tab li+li{margin-left: 12px}
}