/* banner开始 */
.index-banner{height:100vh;width:100%;position:relative;}
.index-banner .banner{width:100%;height:100%;}
.index-banner .banner img,.index-banner .banner video{width:100%;height:100%;display:block;object-fit:cover;position:relative;}
.index-banner .banner .mb-bg{position:absolute;width:100%;height:100%;background:rgba(0,0,0,.3);top:0;left:0;}
.index-banner .wp-cont{padding-top:30vh;height:100%;}
.index-banner .wp-cont h1{margin-bottom:0.14rem;color:#fff;font-weight:normal;text-shadow:0px 1px 1px rgba(0,0,0,1);}
.index-banner .wp-cont h3{margin-bottom:0.1rem;color:#fff;/* opacity:0;*/text-shadow:0px 1px 1px rgba(0,0,0,1);}
.index-banner .wp-cont p{color:#fff;}
.index-banner .shubiao{position:absolute;right:calc(var(--wpPaddingNum) + var(--wpContPaddingNum));bottom:5vh;z-index:9;}
.index-banner .swiper-pagination{text-align:left;padding-left:calc(var(--wpPaddingNum) + var(--wpContPaddingNum));/* display:flex;*/bottom:6vh;}
.draw-h{display:block;border-radius:50%;text-align:center;position:relative}
.draw-h:before{content:"";display:block;width:100%;height:100%;position:absolute;left:0;top:0;border:1px solid rgba(100%,100%,100%,.5);border-radius:50%}
.index-banner .dots{width:26px !important;height:26px !important;display:inline-block;background:transparent;opacity:1;margin-right:13px;cursor:pointer;}
.index-banner .dots::before{content:'';display:block;border:0;background:#fff;transform:scale(.4);}
.index-banner .dots.on::before{background:var(--themeColor);}
.index-banner .dots.on svg.drawcircle circle{animation:svgrotate 8.2s forwards;}
/* banner结束 */
/* 数字滚动开始 */
.s-shuju{width:100%;overflow:hidden;position:relative;z-index:9;box-shadow:0 5px 12px 4px rgba(130,130,130,.1);padding:0.12rem 0;}
.s-shuju ul{display:grid;align-items:center;grid-template-columns:repeat(4,1fr);height:100%;}
.s-shuju ul li{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;}
.s-shuju ul li::before{content:'';position:absolute;right:0;width:1px;height:60%;background:#eeeeee;top:50%;transform:translate(0,-50%);}
.s-shuju ul li>div{display:flex;align-items:flex-end;}
.s-shuju ul li:last-child::before{display:none;}
.s-shuju ul li span{font-size:var(--f60);/* line-height:1.125;*/color:#343333;font-family:'num-font';margin-right:0.06rem;}
.s-shuju ul li div em{color:#343333;font-size:var(--f26);line-height:2.0;}
.s-shuju ul li p{color:#828282;font-size:var(--f19);line-height:1.5;letter-spacing:.02rem;}
/* 数字滚动结束 */
/* 您将拥有的SERVICES开始 */
.s-zhenghe{margin-top:0.3rem;display:flex;justify-content:center;}
.s-zhenghe li .s-zhtitle{height:0.875rem;background:#c7000b;position:relative;margin-top:0.125rem;display:block;}
.s-zhenghe li .s-zhtitle .s-zh1{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;color:#fff;padding-top:0.15rem;position:relative;z-index:0;transition:none!important;}
.s-zhenghe li .s-zhtitle .s-zh2{position:absolute;width:100%;height:100%;display:none;align-items:center;justify-content:center;/*gap:0.1875rem;*/top:0;left:0;background:#151515;transition:none!important;}
.s-zhenghe li.on .s-zhtitle{height:1rem;margin-top:0;}
.s-zhenghe li.on .s-zhtitle .s-zh1{display:none;}
.s-zhenghe li.on .s-zhtitle .s-zh2{display:flex;width:100%;}
.s-zhenghe li .s-zhtitle .s-zh2 h5{font-size:var(--f30);color:#fff;line-height:1.5;text-wrap:nowrap;}
.s-zhenghe li .s-zhtitle .s-zh2 img{max-height:0.78rem;width:auto;}
.s-zhenghe li .s-zhtitle .s-zh1 h5{font-size:var(--f26);line-height:1.5;}
.s-zhenghe li .s-zhtitle .s-zh1 p,.s-zhenghe li .s-zhtitle .s-zh2 p{font-size:var(--f16);line-height:1.5;color:#fff;text-wrap:nowrap;}
.s-zhenghe li .s-zhtitle .s-zh1 img{position:absolute;top:0;left:50%;transform:translate(-50%,0);z-index:-1;max-height:0.6rem;width:auto;}
.s-zhenghe li{width:18.4%;transition:none !important;overflow:unset!important;/* transition:all .3s cubic-bezier(.4,0,.2,1);*/}
.s-zhenghe li:first-child .s-zhtitle{border-radius:.0625rem 0 0 0;}
.s-zhenghe li:first-child .s-zhnr{border-radius:0 0 0 .0625rem;}
.s-zhenghe li:last-child .s-zhtitle{border-radius:0 .0625rem 0 0;}
.s-zhenghe li:last-child .s-zhnr{border-radius:0 0 .0625rem 0;}
.s-zhenghe li.on{/* width:27.4%;*/
border-radius:.0625rem;}
.s-zhenghe li.on .s-zhtitle{border-radius:.0625rem .0625rem 0 0;overflow:hidden;}
.s-zhenghe li:nth-child(odd) .s-zhnr{background:#e8e8e8;}
.s-zhenghe li:nth-child(even) .s-zhnr{background:#eeeeee;}
.s-zhenghe li .s-zhnr{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0.25rem 0.3125rem;height:100%;}
.s-zhenghe li.on .s-zhnr{display:none;}
.s-zhenghe li .s-zhnrs .swiper{width:2.3rem;/* width:100%;*/margin-top:0.1rem;padding-bottom:0.18rem;transition:none !important;/* max-height:.89rem;*/ height:1.3rem;overflow:hidden;}
.s-zhenghe li .s-zhnrs .swiper .swiper-wrapper{/* transition:none!important;*/}
.s-zhenghe li .s-zhnrs .swiper .swiper-wrapper *{/* transition:none !important;*/}
.s-zhenghe li .s-zhnrs .swiper .swiper-pagination-bullet{width:11px;height:11px;border:2px solid #d6d6d6;border-radius:50%;background:transparent;opacity:1;}
.s-zhenghe li .s-zhnrs .swiper .swiper-pagination-bullet-active{border:2px solid #c7000b;}
.s-zhenghe li .s-zhnrs .swiper-slide{/* display:grid;*//* gap:0.15rem;*/}
.s-zhenghe li .s-zhnrs .swiper-slide a{background:#f9f9f9;display:flex;align-items:center;justify-content:center;/* height:0.25rem;*/min-height:0.25rem;height:100%;color:#2b2b2b;font-size:0.09rem;line-height:1.5;text-wrap:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:0.045rem;flex-direction:column;transition:all .8s;}
.s-zhenghe li .s-zhnrs .swiper-slide a img{width:auto;height:32%;filter:var(--imgBlack);margin-bottom:0.04rem;}
.s-zhenghe li .s-zhnrs .swiper-slide a:hover{background:#d9d9d9;color:#070707;}
/*.s-zhenghe li .s-zhnrs .swiper-slide a:hover img{filter:var(--imgWhite);}*/
.s-zhenghe li .s-zhnr a{color:#818181;display:flex;align-items:center;justify-content:space-between;font-size:var(--f17);line-height:1.5;width:100%;}
.s-zhenghe li .s-zhnr a i{color:#c4c4c4;font-size:0.2rem;}
.s-zhenghe li .s-zhnrs{display:none;}
.s-zhenghe li .s-zhbox{transition:none;}
.s-zhenghe li.on .s-zhbox{box-shadow:0 5px 12px 4px rgba(152,152,152,.26);border-radius:0 0 .0625rem .0625rem;}
.s-zhenghe li.on .s-zhnrs{display:block;padding:0.175rem;background:#fff;height:calc(100% + 1rem);width:100%;border-radius:0 0 .0625rem .0625rem;overflow:hidden;min-height:2.05rem;}
.s-zhenghe li .s-zhbox{position:relative;}
.s-zhenghe li .s-zhnrs > p{color:#8c8c8c;font-size:var(--f16);line-height:2;text-align:left;height:3.8em;display:none;/* width:100%;*/width:2.15rem;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.s-zhenghe li.on .s-zhnrs p{display:-webkit-box;}
/* 您将拥有的SERVICES结束 */

/* 我们创造的CASES开始 */
/* 内容区 */
.s-uspro .wzkind-slide-for{margin-top:0.25rem;}
/* .s-uspro .wzkind-slide-for ul{* display:grid;* grid-template-columns:repeat(4,1fr);*}
* * .s-uspro .wzkind-slide-for ul li .img{* aspect-ratio:480/330;*}
* * .s-uspro .wzkind-slide-for ul li .img img{* transform:scale(1.05);*}
* * .s-uspro .wzkind-slide-for ul li a:hover .img img{* transform:scale(1.1);*}
* * .s-uspro .wzkind-slide-for ul li a{* position:relative;* overflow:hidden;* z-index:0;* display:block;*}
* * .s-uspro .wzkind-slide-for ul li a>img{* position:absolute;* left:0.2rem;* top:0.3125rem;* z-index:2;* width:auto;* height:.3rem;* object-fit:contain;* max-width:100%;*}
* * .s-uspro .wzkind-slide-for ul li a .hover-bg{* position:absolute;* height:1.21rem;* bottom:-100%;* z-index:1;* width:100%;* background:linear-gradient(to top,rgba(200,10,20,0.8),rgba(200,10,20,0));* transition:all .5s;*}
*/
/* .s-uspro .wzkind-slide-for ul li a::before{content:'';position:absolute;width:100%;height:1.2125rem;background:url(../images/hongmb.png)no-repeat;background-size:cover;left:0;bottom:-100%;transition:all .5s;z-index:1;}
.s-uspro .wzkind-slide-for ul li a:hover::before{bottom:0;}
*/
/* .s-uspro .wzkind-slide-for ul li a:hover .hover-bg{* bottom:0;*}
* * .s-uspro .wzkind-slide-for ul li a .hbjs{* position:absolute;* left:0;* bottom:0;* padding:0.175rem 0.2rem;* z-index:2;* width:100%;* opacity:0;* transition:all .5s;*}
* * .s-uspro .wzkind-slide-for ul li a .hbjs>div{* display:flex;* align-items:center;* justify-content:space-between;*}
* * .s-uspro .wzkind-slide-for ul li a .hbjs>div div i{* font-size:1.6em;*}
* * .s-uspro .wzkind-slide-for ul li a .hbjs>div div{* display:flex;* align-items:center;* gap:10px;* color:#fff;* font-size:var(--f14);* line-height:1.5;*}
* * .s-uspro .wzkind-slide-for ul li a .hbjs p{* font-size:var(--f18);* color:#fff;* line-height:1.5;*}
* * .s-uspro .wzkind-slide-for ul li a .hbjs h5{* font-size:var(--f25);* line-height:1.5;* color:#fff;*}
* * .s-uspro .wzkind-slide-for ul li a:hover .hbjs{* opacity:1;*}
*/
/* 我们创造的CASES结束 */
/* 网站建设与数字开发开始 */
.s-kaifa{overflow:hidden;height:3rem;}
.s-kaifa .bg{background:url(../images/s-kaifabg.jpg)center no-repeat;background-position:center;background-repeat:no-repeat;background-size:cover;width:100%;height:100%;top:0;left:0;z-index:-1;animation:bg-zoom 10s infinite;}
@keyframes bg-zoom{
	0%{transform:scale(1);}
	50%{transform:scale(1.15);}
	100%{transform:scale(1);}
}
.s-kaifa .wp-cont{display:flex;align-items:center;justify-content:space-between;padding:0.1rem calc(var(--wpContPaddingNum) + 0.2rem) 0;}
.s-kaifa .wp-cont>img{height:100%;object-fit:contain;width:auto;}
.s-kaifa .wp-cont>div{width:52%;}
.s-kaifa .wp-cont>div h5{color:#fff;font-size:var(--f39);line-height:1.5;margin-bottom:.075rem;}
.s-kaifa .wp-cont>div h6{color:#fff;font-size:var(--f20);line-height:1.5;}
.s-kaifa .wp-cont>div i{display:block;width:0.35rem;height:0.02rem;background:#fff;margin:0.1rem 0 0.3125rem;}
.s-kaifa .wp-cont>div p{font-size:var(--f18);line-height:2em;color:#fff;margin-bottom:0.2812rem;}
.s-kaifa .wp-cont>div div{display:flex;align-items:center;gap:0.2875rem;}
.s-kaifa .wp-cont>div div a{border:2px solid #fff;border-radius:0.1875rem;transition:all .5s;display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--f20);line-height:1.5;width:1.65rem;height:0.35rem;}
.s-kaifa .wp-cont>div div a:last-child{color:#0c0c0c;background:#fff;}
.s-kaifa .wp-cont>div div a:hover{/* color:#0c0c0c;* background:#fff;*/font-size:var(--f22);}
/* 网站建设与数字开发结束 */

/* 开发服务流程 开始 */
.s-flow{margin:0.3rem 0 0;background:url(../images/fuwuliucheng-bg.png) no-repeat top center;background-size:100%;}
.s-flow .s-flow-content{margin-top:0.25rem;width:100%;}
.s-flow .s-flow-content ul{height:360px;display:grid;grid-template-columns:repeat(8,1fr);}
.s-flow .s-flow-content ul li{cursor:pointer;border-right:1px #ddd dotted;font-weight:500;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative;}
.s-flow .s-flow-content ul li:hover img{animation:flipInY 1s;}
.s-flow .s-flow-content ul li:last-child{border-right:none;}
.s-flow .s-flow-content ul li p{font-size:18px;line-height:40px;color:#333;margin-bottom:8px;font-weight:500}
.s-flow .s-flow-content ul li h5{font-size:15px;line-height:36px;color:#666;font-weight:500}
.s-flow .s-flow-content .wrapper_ul3 li{border-bottom:none;}
/* 开发服务流程 结束 */

/* 留言咨询 开始 */
.s_lybd{padding:0.775rem 0;background:url(../images/s_lybd_bg.jpg) center no-repeat;background-size:cover;position:relative;overflow:hidden}
.s_lybd .flex{background:url(../images/s_lybd_img.jpg) center no-repeat;background-size:cover;border-radius:0.125rem;overflow:hidden;height:3.625rem}
.s_lybd .box{padding:0.4375rem 0.5625rem;color:#fff}
.s_lybd .top h2{font-size:0.25rem;font-weight:300;line-height:0.325rem;margin-bottom:0.125rem}
.s_lybd .top p{font-size:0.1rem;font-weight:300;margin-bottom:0.46875rem}
.s_lybd .ewm_box{display:flex;align-items:center;gap:0.3125rem;margin-bottom:0.25rem}
.s_lybd .ewm{position:relative;overflow:hidden}
.s_lybd .ewm svg{position:absolute;top:0;left:0;width:100%}
.s_lybd .ewm svg path{stroke:#fff;fill:none}
.s_lybd .ewm::before,.s_lybd .ewm::after{content:"";display:block;position:absolute;left:1px;right:1px;height:62%;z-index:1}
.s_lybd .ewm::before{bottom:100%;background:linear-gradient(to bottom,rgba(255,191,164,0),#d4042c)}
.s_lybd .ewm::after{top:100%;background:linear-gradient(to top,rgba(255,191,164,0),#d4042c)}
.s_lybd .ewm.actived::before{transform:translateY(270%);transition:transform 1.5s}
.s_lybd .ewm.actived::after{transition:transform 1.5s 1.5s;transform:translateY(-270%)}
.s_lybd .txt{display:flex;align-items:center;gap:.0625rem;animation:bounce 1.6s infinite}
@keyframes bounce{
	0%,20%,50%,80%,100%{transform:translateX(0)}
	40%{transform:translateX(-0.1rem)}
	65%{transform:translateX(-0.05rem)}
}
.s_lybd .ewm_box img{max-width:0.75rem;border-radius:0.0625rem}
.s_lybd .lx_box span{font-size:0.1rem;font-weight:300;color:#fff6f7;margin-bottom:.0625rem}
.s_lybd .lx_box h2{font-size:0.1875rem;color:#fff6f7;font-family:'Barlow-bold';letter-spacing:1px}
.s_lybd .txt svg{width:0.2rem;height:0.2rem;transform:rotate(270deg) scaleX(-1)}
.s_lybd .txt svg path{fill:#fff}
.s_lybd .right{padding:0.23125rem 0.7375rem;background:#fff5f6;width:100%;height:100%;max-width:5.8125rem;flex-shrink:0;border-radius:0.125rem}
.s_lybd .right h1{font-size:0.225rem;font-weight:300;color:#212121;margin-bottom:0.25rem}
.s_lybd form{display:grid;grid-template-columns:repeat(2,1fr);gap:0.15rem .0875rem}
.s_lybd form .inp input{padding:0.1375rem 0.16875rem;border-radius:0.5rem;border:1px solid #d1d1d1;font-size:0.1rem;font-weight:300;color:#757575;width:100%}
.s_lybd form .inp textarea{padding:0.1375rem 0.16875rem;border-radius:0.2rem;border:1px solid #d1d1d1;font-size:0.1rem;font-weight:300;color:#757575;width:100%;height:auto;resize:none;line-height:1.5}
.s_lybd form .inp.web,.s_lybd form .inp.service,.s_lybd form .inp.code{grid-column:span 2}
.s_lybd form .inp.code{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap}
.s_lybd form .inp.code input{width:100%;max-width:1rem;flex-shrink:0}
.s_lybd form .service{margin-bottom:0.125rem}
.s_lybd form .service h2{font-size:0.125rem;color:#212121;margin-bottom:0.125rem}
.s_lybd form .service .service-buttons{display:flex;flex-wrap:wrap;gap:.0625rem}
.s_lybd form .service .service-button{font-size:.0875rem;border-radius:0.5rem;color:#b1b1b1;padding:.0625rem .0875rem;border:1px solid #d1d1d1;transition:all .5s ease;cursor:pointer;position:relative}
.s_lybd form .service .service-button:hover,.s_lybd form .service .service-button.on{color:#fff;background-color:#d4042c;border-color:#d4042c}
.s_lybd form .service .service-button input{border:0;position:absolute;width:100%;height:100%;top:0;left:0;z-index:2;cursor:pointer}
.s_lybd form .inp.code .code_box{display:flex;align-items:center;gap:.0625rem}
.s_lybd form .inp.code button{width:100%;max-width:1.125rem;flex-shrink:0;padding:0.1375rem 0.16875rem;border-radius:0.5rem;background-color:#d4042c;font-size:0.1125rem;font-weight:300;color:#fff;transition:all .5s ease}
.s_lybd form .inp.code button:hover{transform:translateX(-0.1rem)}
/* 留言咨询 结束 */