@charset "utf-8";

@import url("typo.css");
.iconfont{ font-size: inherit;}
html { font-size: 72.5%;}
body, button, input, select, textarea { color: #444; font-weight: 400; font-size: 1.4rem; line-height: 1.6; word-wrap: break-word; }
body{ font-size:14px;}
a { color: #2a2a2a; text-decoration: none; }
a:hover{ text-decoration: none; }
img {vertical-align: middle; }
button, input, select, textarea { font-size: 100%;  margin: 0; padding: 0;  vertical-align: baseline;  *vertical-align: middle; -webkit-appearance:none; appearance:none; border: none; outline: none; background: inherit;}
textarea { overflow: auto; vertical-align: top;}
.float-box{position:fixed; left: 0; top: 0; right: 0; bottom: 0;}
.fl { float:left; }
.fr { float:right; }
.tl { text-align:left; }
.tc { text-align:center; }
.tr { text-align:right; }
.max-font { font-size: 2rem }
.large-font { font-size: 1.8rem }
.mid-font { font-size: 1.4rem }
.small-font { font-size: 1.2rem }
.min-font { font-size: 1rem }
.mt5{ margin-top:5px;}
.mt8{ margin-top:8px;}
.mt10{ margin-top:10px;}
.mt12{ margin-top:12px;}
.mt15{ margin-top:15px;}
.mt16{ margin-top:16px;}
.mt18{ margin-top:18px;}
.mt20{ margin-top:20px;}
.mr5{ margin-right:5px;}
.mr8{ margin-right:8px;}
.mr10{ margin-right:10px;}
.mr12{ margin-right:12px;}
.mr15{ margin-right:15px;}
.mr16{ margin-right:16px;}
.mr18{ margin-right:18px;}
.mr20{ margin-right:20px;}
.mb5{ margin-bottom:5px;}
.mb8{ margin-bottom:8px;}
.mb10{ margin-bottom:10px;}
.mb12{ margin-bottom:12px;}
.mb15{ margin-bottom:15px;}
.mb16{ margin-bottom:16px;}
.mb18{ margin-bottom:18px;}
.mb20{ margin-bottom:20px;}
.ml5{ margin-left:5px;}
.ml8{ margin-left:8px;}
.ml10{ margin-left:10px;}
.ml12{ margin-left:12px;}
.ml15{ margin-left:15px;}
.ml16{ margin-left:16px;}
.ml18{ margin-left:18px;}
.ml20{ margin-left:20px;}
.pt5{ padding-top:5px;}
.pt8{ padding-top:8px;}
.pt10{ padding-top:10px;}
.pt12{ padding-top:12px;}
.pt15{ padding-top:15px;}
.pt16{ padding-top:16px;}
.pt18{ padding-top:18px;}
.pt20{ padding-top:20px;}
.pr5{ padding-right:5px;}
.pr8{ padding-right:8px;}
.pr10{ padding-right:10px;}
.pr12{ padding-right:12px;}
.pr15{ padding-right:15px;}
.pr16{ padding-right:16px;}
.pr18{ padding-right:18px;}
.pr20{ padding-right:20px;}
.pb5{ padding-bottom:5px;}
.pb8{ padding-bottom:8px;}
.pb10{ padding-bottom:10px;}
.pb12{ padding-bottom:12px;}
.pb15{ padding-bottom:15px;}
.pb16{ padding-bottom:16px;}
.pb18{ padding-bottom:18px;}
.pb20{ padding-bottom:20px;}
.pl5{ padding-left:5px;}
.pl8{ padding-left:8px;}
.pl10{ padding-left:10px;}
.pl12{ padding-left:12px;}
.pl15{ padding-left:15px;}
.pl16{ padding-left:16px;}
.pl18{ padding-left:18px;}
.pl20{ padding-left:20px;}
.p5{ padding: 5px;}
.p8{ padding: 8px;}
.p10{ padding:10px;}
.p15{ padding:15px;}
.p20{ padding:20px;}
.m5{ margin: 5px;}
.m8{ margin: 8px;}
.m10{ margin:10px;}
.m15{ margin:15px;}
.m20{ margin:20px;}

html .delay2{-webkit-animation-delay: 0.2s;animation-delay: 0.2s;}
html .delay3{-webkit-animation-delay: 0.3s;animation-delay: 0.3s;}
html .delay4{-webkit-animation-delay: 0.4s;animation-delay: 0.4s;}
html .delay5{-webkit-animation-delay: 0.5s;animation-delay: 0.5s;}
html .delay6{-webkit-animation-delay: 0.6s;animation-delay: 0.6s;}
html .delay7{-webkit-animation-delay: 0.7s;animation-delay: 0.7s;}
html .delay8{-webkit-animation-delay: 0.8s;animation-delay: 0.8s;}
html .delay9{-webkit-animation-delay: 0.9s;animation-delay: 0.9s;}
html .delay10{-webkit-animation-delay: 1s;animation-delay: 1s;}
html .delay11{-webkit-animation-delay: 1.1s;animation-delay: 1.1s;}
html .delay12{-webkit-animation-delay: 1.2s;animation-delay: 1.2s;}
html .delay13{-webkit-animation-delay: 1.3s;animation-delay: 1.3s;}
html .delay14{-webkit-animation-delay: 1.4s;animation-delay: 1.4s;}
html .delay15{-webkit-animation-delay: 1.5s;animation-delay: 1.5s;}
html .delay16{-webkit-animation-delay: 1.6s;animation-delay: 1.6s;}
html .delay17{-webkit-animation-delay: 1.7s;animation-delay: 1.7s;}
html .delay18{-webkit-animation-delay: 1.8s;animation-delay: 1.8s;}
html .delay19{-webkit-animation-delay: 1.9s;animation-delay: 1.9s;}
html .delay20{-webkit-animation-delay: 2s;animation-delay: 2s;}
html .delay21{-webkit-animation-delay: 2.1s;animation-delay: 2.1s;}
html .delay22{-webkit-animation-delay: 2.2s;animation-delay: 2.2s;}
html .delay23{-webkit-animation-delay: 2.3s;animation-delay: 2.3s;}
html .delay24{-webkit-animation-delay: 2.4s;animation-delay: 2.4s;}
html .delay25{-webkit-animation-delay: 2.5s;animation-delay: 2.5s;}
html .delay26{-webkit-animation-delay: 2.6s;animation-delay: 2.6s;}

/*color*/
.green{ color: #09bb07;}
.red{ color: #E64340;}
.grey{ color: grey;}
.blank{ color:white;}
/*公用css动画效果*/
a,.menu a:after,.fea i,.fea li:after,.app a img,.scenes li span,.daicon li span,.app span.demo,.tab li,.case-box,.test-app,.test-app img,.daili-list i,.daili-list,.ganyan .text,.ganyan img,.daicon ol li,a.uline:after,.more:after,.apply input,.swiper-pagination-switch{transition: all .3s ease;}
a.uline{ position: relative;}
a.uline:hover{text-decoration: none; margin-left:3px;}
a.uline:after{ content: ""; display:block; position:absolute; left:0; bottom: 0; width: 0; border-bottom: 1px solid #09BB07;}
a.uline:hover:after{ width: 100%;}
html{ background: #fff;}
html,body{ min-width: 1280px;}
.clearfix { display:block; zoom:1; }
.clearfix::after { content:"."; display:block; height:0; clear:both; visibility:hidden; font-size:0; }

.wrap{ width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto;}

/*首页代码开始*/
/*hader 代码*/
.header{position: fixed;top: 0;left: 0;width: 100%;z-index: 99;-wekbit-transition: all .4s linear;transition: all .4s linear;}

.header-fixed {background:#fff;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;box-shadow: 0 0 10px rgba(0,0,0,.1);z-index: 999;}
.header-fixed .header-box{padding: 5px 50px;}
.header-fixed .header_nav a{color: #000;}
.header .header_logo{padding: 16px 0;}
.header img{width: 284px;height: 38px;}
.header_nav li{float: left;margin-left: 20px;}
.header_nav a{color: #fff;font-size: 16px;line-height: 70px;padding-bottom: 10px;position: relative;cursor: pointer;display: block;}
.header_nav a:before{content: '';display: block;width: 0;height: 2px;background: #fdd000;position: absolute;bottom: 25px;left: 50%;-wekbit-transform: translateX(-50%);transform: translateX(-50%);-webkit-transition: all .4s linear;transition: all .4s linear;}
.header_nav a.active:before{width: 100%;}

.header_refer{padding: 18px 0;font-size: 16px;}
.header_refer a{display:inline-block;margin-left: 20px;height: 33px;line-height: 33px;}
.header_refer .load{color: #fff;}
.header_refer .load.active{color: #333;}
.header_refer .logon{color: #27231b;background: #fdb100;padding: 0 12px;}


/*首页轮播图*/
.swiper-container{height: 530px; background: #666;}
.swiper-containe{height: 440px;}
.pagination { position: absolute; z-index: 20; left: 0; right:0; text-align: center;  bottom: 10px; }
.swiper-pagination-switch { display: inline-block; width: 30px; height: 3px; margin:0 3px; background:rgba(255,255,255,0.5); cursor: pointer; position: relative; }
.swiper-active-switch::after{ content: ""; display: block; position: absolute; left: 0; top: 0; bottom: 0; width: 100%; animation: swiper-active-switch 6s linear forwards; transform:scaleX(0); transform-origin: left center; background: #fff;}
@keyframes swiper-active-switch{
  0%{ transform: scaleX(0);}
  100%{transform: scaleX(1);}}
.swiper-container .focus{ display: block; width: 100%; height: 100%;background-position: center center;    background-size: auto 100%;}

/*简洁好用的小程序制作平台*/
.title h2{font-size: 34px;font-weight: 500;}
.title p{font-size: 20px;color:#7e7e7d;margin-top: 4px;}

.terrace{padding: 100px 0 107px;}
.terrace_Min{margin-top: 60px;}
.terraceFl{width: 170px;height: 486px;font-size: 16px;border-right: 1px solid #000;}
.terraceFl img{width: 58px;height: 54px;display: block;margin: 1px auto 8px;}
.terraceFl li{margin-bottom: 46px;position: relative;padding-right: 40px;box-sizing: border-box;color: #93918d;}
.terraceFl li:last-child{margin: 0;}
.terraceFl li.active{color: #000;}
.terraceFl li.active .img,.terraceFl .img_in,.terraceFr li{display: none;}
.terraceFl li.active .img_in,.terraceFr li.active{display: block;}
.terraceFl li:before{content: '';display: block;width: 6px;height: 0;background: #000;top: -1px;right: 0;position: absolute;}
.terraceFl li:hover.active:before,.terraceFl li.active:before{height: 87px;}
.terraceFr{width: 1028px;padding-left: 30px;box-sizing: border-box}
.terraceFr ul{box-shadow: 0 10px 10px rgba(0,0,0,.05);}
.terraceFr_fl{width: 324px;height: 486px;position: relative;color: #fff;}
.terraceFr_text{width: 100%;height: 100%;padding:72px 68px 70px 35px;box-sizing: border-box;}
.terraceFr_fl img{position: absolute;top: 0;left: 0;width: 100%;z-index: -1;}
.terraceFr_fl h3{font-size: 24px;font-weight: 500;margin-bottom: 35px;}
.terraceFr_fl p{color: rgba(255,255,255,.6);}
.terraceFr_fl a{width: 141px;height: 44px;line-height: 44px;border: 1px solid #fdd000;font-size: 20px;color: #fdd000;text-align: center;display: block;position: absolute;bottom:46px;left: 34px;background: #282d31;}
.terraceFr_fr{width: 674px;}
.terraceFr_fr img{width: 100%;}

/*为超过120个行业提供小程序解决方案*/
.scheme{padding: 100px 0 112px;background: #fafafa;}
.scheme .schemeMin{margin-top: 30px;}
.scheme ul{margin-right: -24px;}
.scheme li{float: left;margin:20px 20px 0 0;position: relative;}
.scheme li a{display: block;color: #fff;font-size: 30px;}
.scheme li .img{overflow: hidden;}
.scheme li,.scheme .img img{width: 286px;height: 367px;-webkit-transition: all 0.4s linear;transition: all 0.4s linear;}
.scheme .schemePre{position: absolute;top: 50%;left: 50%;-wekbit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);text-align: center;}
.scheme .schemePre  img{width: 111px;height: 72px;margin-bottom: 16px;}
.scheme li:hover{box-shadow: 0 0 20px rgba(0,0,0,.3);}
.scheme li:hover .img img{-wekbit-transform: scale(1.05);transform: scale(1.05);}

/*小程序优秀案例*/
.case{padding: 100px 0;}
.caseTab{border-bottom: 1px solid #cbcbcb;margin-top: 35px;}
.caseTab li{float: left;padding: 0 52px 20px;font-size: 20px;color: #7b7b7a;cursor: pointer;}
.caseTab li.active{position: relative;color: #000;font-size: 24px;}
.caseTab li:before{content: '';display: block;width: 0;height: 5px;background: #fdd000;position: absolute;bottom: -3px;left: 50%;-wekbit-transform: translateX(-50%);transform: translateX(-50%);-webkit-transition: all .4s linear;transition: all .4s linear;}
.caseTab li.active:before{width: 43px;}
.caseBOx,.videoFix{display: none;}
.caseBOx.active,.videoFix.active{display: block;}
.caseFl{width: 610px;padding-top: 125px;}
.caseFl h3{font-size: 34px;font-weight: 600;margin-bottom: 33px;}
.caseFl p{font-size: 16px;}
.caseUl{margin-top: 80px;}
.caseUl li{float: left;margin-right: 30px;}
.caseUl li img{width: 142px;height: 142px;-webkit-transition: all 0.4s linear;transition: all 0.4s linear;border-radius: 50%;}
.caseUl li.active img{-webkit-transform: scale(1.2);transform: scale(1.2);box-shadow: 0 0 26px rgba(0,0,0,.08);}
.caseFr{width: 280px;height: 534px;box-shadow: 0 0 20px rgba(0,0,0,.1);border-radius: 46px;margin-top: 60px;position: relative;overflow: hidden;}
.caseFr .caseBox{position: absolute;top: 0;left: 0;}
.caseFr li{padding: 15px;float: left;width: 280px;height: 534px;box-sizing: border-box;}

/*魔方视频*/
.homeVideo{position: relative;height: 440px;overflow: hidden;}
.homeVideo .videoBg{width: 100%;height: 440px;-webkit-transition: all 0.4s linear;transition: all 0.4s linear;}
.homeVideo_text{position: absolute;top: 50%;left: 50%;-wekbit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}
.homeVideo_text img{width: 96px;height: 96px;}
.homeVideo .videoBg:hover{-wekbit-transform: scale(1.05);transform: scale(1.05);}
.homeVideo_text p{font-size: 34px;color: #fff;margin-top: 15px;}


/*合作伙伴数量*/
.cooperate{font-size: 30px;background: url(../dgimages/moFang/jiaMeng_bg.png) no-repeat;height: 420px;color: #fff;    padding: 62px 0;box-sizing: border-box;}
.cooperate_num span{color: #fdd000;font-size: 65px;font-weight: 600;vertical-align: -3px;}
.cooperate_btn{margin-top: 67px;}
.cooperate_btn a{width: 170px;height: 50px;line-height: 50px;border: 1px solid #fdd000;color: #fdd000;font-size: 22px;margin: 0 50px;display: inline-block;-wekbit-transition: all .4s linear;transition: all .4s linear;}
.cooperate_btn a:hover{-wekbit-transform: translateY(-5px);transform: translateY(-5px);}
.cooperate_btn .cooperate_two{background: #fdd000;color: #000;}

/*合作伙伴列表*/
.friend{padding: 80px 0;background: #fafafa;}
.friendList{overflow: hidden;padding: 0 10px 14px 14px;}
.friendList ul{margin-right: -40px;}
.friendList li{margin-right: 42px;background: #fff;border-radius: 91px;margin-top: 36px;-wekbit-transition: all .4s linear;transition: all .4s linear;}
.friendList li:hover{box-shadow: 0 0 20px rgba(0,0,0,.08);}
.friendList img{width: 262px;height: 91px;}
.friendList li{float: left;}

/*小程序模块页面样式*/
.moduleNav{box-shadow: 0 10px 10px rgba(211,211,211,.2);margin-bottom: 60px;}
.moduleNav li{float: left;width: 25%;font-size: 20px;color:#75726d;height: 77px;line-height: 77px;cursor: pointer;}
.moduleNav li img{margin-right: 20px;}
.moduleNav li.active{color: #333;position: relative;}
.moduleNav li.active:before{content: '';display: block;width: 130px;height: 3px;background: #303030;position: absolute;bottom: 0;left: 50%;-wekbit-transform: translateX(-50%);transform: translateX(-50%);}
.moduleNav li .two,.moduleNav li.active .one{display: none;}
.moduleNav li.active .two{display: inline-block;}

.moduleList{overflow: hidden;margin-bottom: 28px;}
.moduleList ul{margin-right: -30px;display: none;}
.moduleList ul.active{display: block;}
.moduleList li{float: left;width: 380px;height:291px;margin-right: 30px;margin-bottom: 52px;}
.moduleList li .bigImg{width: 100%;}
.moduleList_fl{margin: -30px 0 15px 20px;position: relative;z-index: 2;}
.moduleList span{width: 63px;height: 63px;border-radius: 50%;box-shadow: 0 10px 10px rgba(0,0,0,.05);background: #fff;display: block;}
.moduleList span img{width: 44px;height: 44px;margin: 0 auto;display: block;padding: 10px 0;}
.moduleList h2{width: 220px;height: 83px;line-height: 83px;text-align: center;color: #fff;font-weight: 600;background: rgba(68,105,129,.8);position: absolute;bottom: 24px;left: 50%;-wekbit-transform: translateX(-50%);transform: translateX(-50%);font-size: 28px;-webkit-transition: all .4s linear;transition: all .4s linear;}
.moduleList li:hover h2{bottom:0;}
.moduleList h3,.moduleList p{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.moduleList h3{font-weight: 600;margin: 35px 0 0 10px;}
.moduleList .info{position: relative;padding-top: 14px;font-size: 16px;}
.moduleList .info img{position: absolute;top: 16px;right: 0;}
.moduleList p{color: #807e7b;margin-top: 5px;padding-left: 20px;}


/*精选案例商家*/
.business{background: #fafafa;padding: 60px 0 50px;overflow: hidden;}
.business ul{margin-right: -40px;}
.business li{float: left;width: 580px;padding: 30px;box-sizing: border-box;background: #fff;margin: 40px 40px 0 0;}
.business img{margin-right: 40px;}
.business h3{font-size: 24px;font-weight: 600;position: relative;padding-bottom: 7px;}
.business h3:before{content: '';display: block;position: absolute;bottom: 0;left: 0;width: 45px;height: 2px;background: #fdd000;}
.business_list{margin-bottom: 26px;}
.business .business_un{margin-top: 14px;}
.business dd{float: left;height: 30px;line-height: 30px;padding: 0 26px;border-radius: 30px;margin:11px 20px 0 0;position: relative;}
.business dd:before{content: '';display: block;width: 5px;height: 5px;background: #fff;border-radius: 50%;position: absolute;top: 13px;left: 5px;}
.business dd.one{background: #b5e6f6;color: #0b65b1;}
.business dd.two{background: #fce7d8;color: #e66b3c;}

/*模块与方案咨询*/
.consult{background: url(../dgimages/moFang/mokuan_pic.jpg) no-repeat;height: 308px;padding: 60px 0 66px;box-sizing: border-box;}
.consult .title p{color: #000;margin-top: 24px;}
.consult a{width: 170px;height: 50px;line-height: 50px;background: #fdd000;display: inline-block;font-size: 22px;margin-top: 40px;-wekbit-transition: all .4s linear;transition: all .4s linear;}
.consult a:hover{-webkit-transform: translateY(-10px);transform: translateY(-5px);box-shadow: 0 5px 10px rgba(253,208,0,.4);}

/*页面底部*/
.foot{background: #1f1f1d;padding: 100px 0 120px;}
.footFl>img{width: 260px;height: 70px;}
.footFl p{margin-top:24px;}
.footFl p img{margin-right:24px;}
.footFr{ }
.footFr li{float: left;margin-right: 70px;max-width:220px;}
.footFr li:last-child{margin-right:0;}
.footFr span{color: #fff;font-size: 22px;}
.footFr dl{margin-top: 20px;}
.footFr dd a,.footFr dd{color: rgba(255,255,255,.5);font-size: 14px;line-height: 32px;}

/*礼品卡页面*/
.gif .header,.Join .header{position: fixed;top: 0;left: 0;width: 100%;z-index: 999;-wekbit-transition: all .4s linear;transition: all .4s linear;box-shadow: 0 0 10px rgba(0,0,0,.1);}
.gif .header:hover,.Join .header{background:#fff;}
.gif .header-fixed,.Join .header-fixed {background:#fff;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;box-shadow: 0 0 10px rgba(0,0,0,.1);}
.gif .header_nav a,.Join .header_nav a{color: #333;}

/*大图*/
.gifBnner .wrap{position: relative;}
.gifBnner{background: url(../dgimages/moFang/banner_gif.jpg) center top no-repeat;height: 590px;margin-top: 80px;    overflow: hidden;}
.gifBnner h3{font-size: 60px;font-weight: 600;}
.gifBnner_text{width: 576px;}
.gifBnner_text{position: absolute;top: 0;right: 0;}
.gifBnner_text h3{margin-top: 80px;}
.gifBnner_text p{font-size: 22px;color: #787774;margin-top: 5px;position: relative;padding-bottom: 26px;}
.gifBnner_text p:before{content: '';display: block;width: 116px;height: 3px;background: #fa5452;position: absolute;bottom: 0;left: 0;}
.gifBnner_text h4{font-size: 24px;font-weight: 600;margin-top: 50px;}
.gifBnner_modu li{float: left;height: 36px;line-height: 36px;background: #ffe3e3;color: #f4514f;padding: 0 12px;border-radius: 4px;margin:14px 38px 0 0;font-size: 22px;}
.gifBnner_ma{margin-top: 60px;}
.gifBnner_ma li{float: left;}
.gifBnner_ma li img{width: 138px;height: 138px;}

/*四大功能*/
.gifFun{padding: 100px 0;background: #fafafa;position: relative;z-index: 99;}
.gifFun li{float: left;width: 25%;font-size: 22px;}
.gifFun img{width: 94px;height: 79px;display: block;margin: 0 auto 30px;}

/*老客带新客，社交新玩法*/
.gifPlay{padding: 100px 0 80px;}
.gifPlayMin{position: relative;margin-top: 50px;}
.gifPlayPro{width: 633px;height: 623px;position: relative;margin: 0 auto;}
.gifPlayPro .caseFr{position: absolute;top: 15px;left: 0;right: 0;margin: 0 auto;height: 548px;}
.gifPlayPro .caseFr img{width: 251px;height: 518px;}
.gifPlay_ul{position: absolute;top: 0;left: 0;right: 0;}
.gifPlay_ul li{position: absolute;width: 320px;padding: 30px 20px;box-sizing: border-box;box-shadow: 0 3px 5px rgba(0,0,0,.05);font-size: 20px;}
.gifPlay_ul li.active{border: 2px solid #fa5452;box-sizing: border-box;}
.gifPlay_ul li:first-child{top: 100px;left:30px;}
.gifPlay_ul li:nth-child(2){top: 324px;left:16px;}
.gifPlay_ul li:nth-child(3){top: 100px;right:30px;}
.gifPlay_ul li:nth-child(4){top: 340px;right:5px;width: 344px;}
.gifPlay_ul li img{width: 49px;height: 58px;position: absolute;top: 50%;left: 15px;z-index: -1;-wekbit-transform: translateY(-50%);transform: translateY(-50%);}

/*礼品卡模块应用场景*/
.gifScene{padding: 110px 0 135px;background: #fafafa;}
.gifSceneMin{margin-top: 90px;}
.gifScene_fl{background: #fff;}
.gifScene_fl li{width: 340px;height: 113px;line-height: 113px;font-size: 24px;cursor: pointer;}
.gifScene_fl li.active{background: #fa5452;color:#fff;}
.gifScene_fr{width: 860px;position: relative;}
.gifScene_fr li{display: none;}
.gifScene_fr li.active{display: block;}
.gifScene_fr li img{height: 565px;}
.gifScene_text{position: absolute;top: 0;left: 0;bottom: 0;right: 0;z-index: 99;color: #fff;padding: 170px;height: 565px;box-sizing: border-box;}
.gifScene_text h3{font-size: 40px;position: relative;padding-bottom: 15px;font-weight: 500;}
.gifScene_text h3:before{content: '';display: block;width: 56px;height: 1px;background: #ccc;position: absolute;bottom: 0;left: 0;}
.gifScene_text p{font-size: 20px;margin-top: 20px;}

/*8大核心功能，助你玩转社交营销*/
.gifight{padding: 110px 0 124px;}
.gifightMin{overflow: hidden;margin-top: 30px;}
.gifight ul{margin-right: -45px;}
.gifight li{width: 574px;height: 157px;border: 2px solid #edeef3;padding: 0 43px;box-sizing: border-box;float: left;margin:37px 45px 0 0;}
.gifight li h3{font-size: 24px;font-weight: 600;}
.gifight li img{width: 93px;height: 90px;padding: 30px 0;}
.gifight_fr{margin-left: 30px;width: 360px;position: relative;height: 153px;}
.gifight_fr p{font-size: 20px;color: #a4a4a4;margin-top: 10px;line-height: 28px;}
.gifightBox{position: absolute;top: 50%;-wekbit-transform: translateY(-50%);transform: translateY(-50%);}

/*招商加盟页面*/
section.banner{margin-top: 80px;}
section.banner .wrapper {position: relative;overflow: hidden;width: 100%;height: 480px;background-color: #f6f8fb}
section.banner .wrapper .motion {transition: transform .2s linear}
section.banner .wrapper .text {position: absolute;z-index: 3;top: 160px;left: 50%;	transform: translateX(-50%)}
section.banner .wrapper .text img {width: 423px}
section.banner .wrapper .circle {position: absolute;z-index: 2;top: 50%;left: 50%;border: 1px solid #ccd4e1;border-radius: 1000px;transform: translate(-50%, -50%)}
section.banner .wrapper .circle .point {position: absolute;z-index: 1;top: 50%;left: 50%;width: 0;height: 0}
section.banner .wrapper .circle .point:before {content: "";position: absolute;top: -4px;right: -4px;width: 9px;height: 9px;border-radius: 9px;background-color: #d5dbe6}
section.banner .wrapper .circle .icon {position: absolute;z-index: 2;top: 50%;left: 50%;width: 0;height: 0;transform: 2s all linear}
section.banner .wrapper .circle .icon .icon-inner {position: relative;box-sizing: border-box;width: 56px;height: 56px;top: -28px;left: -28px;border: 1px solid #a4afc0;	border-radius: 10000px;background-color: #f2f4f8;transform: translate(-50%, -50%)}
section.banner .wrapper .circle .icon .icon-inner:after,section.banner .wrapper .circle .icon .icon-inner:before {content: "";position: absolute;z-index: -1;top: -1px;right: -1px;display: block;width: 54px;height: 54px;border: 1px solid #a4afc0;border-radius: 1000px;transform: scale(1);animation: wave 6s ease-in-out infinite}
section.banner .wrapper .circle .icon .icon-inner:after {animation-delay: 2s}
section.banner .wrapper .circle .icon .icon-inner img {position: absolute;top: 50%;left: 50%;width: 48px;transform: translate(-50%, -50%)}
section.banner .wrapper .circle-1 {width: 640px;height: 640px}
section.banner .wrapper .circle-2 {width: 940px;height: 940px}
section.banner .wrapper .circle-3 {width: 1240px;height: 1240px}
section.banner .wrapper .bgicon {position: absolute;top: 0;height: 100%}
section.banner .wrapper .bgicon img {height: 100%}
section.banner .wrapper .icon-1 {left: 0}
section.banner .wrapper .icon-2 {right: 0;transform: scaleX(-1)}
section.banner .wrapper .icon-3 {top: 380px;left: 40px;width: 46px;height: 46px}
section.banner .wrapper .icon-4 {top: 90px;right: 4480px;width: 46px;height: 46px}
section.banner .wrapper .icon-5 {top: 330px;right: 260px;width: 58px;height: 42px}
section.banner .wrapper .icon-6 {top: 140px;left: 160px;width: 90px;height: 12px}
section.banner .wrapper .icon-7 {top: auto;right: 100px;bottom: 120px;width: 90px;height: 12px}

@keyframes wave {
	0% {
		opacity: .6;
		transform: scale(1)
	}
	to {
		opacity: 0;
		transform: scale(1.8)
	}
}



.JoinIcon{padding: 72px 0 80px;}
.JoinIcon li{float: left;width: 25%;font-size: 18px;font-weight: 500;}
.JoinIcon img{width: 54px;height: 58px;margin-right: 20px;}

/*夺冠魔方优势*/
.JoinAd,.JoinPower{padding: 100px 0;background: #fafafa;}
.JoinA_dMin{margin-top: 30px;overflow: hidden;}
.JoinA_dMin ul{margin-right: -55px;;}
.JoinA_dMin li{width: 361px;height: 227px;border: 1px solid #d1d1d1;margin-right: 55px;float: left;}
.JoinA_dMin dl{padding: 30px 24px;box-sizing: border-box}
.JoinA_dMin h3{font-size: 22px;color: #fff;text-align: center;background: url(../dgimages/moFang/youshi_tit.jpg) no-repeat;width:361px;height:61px;line-height: 61px;text-shadow: 0 0 10px rgba(0,0,0,.1);font-weight: 500;}

.JoinA_dMin dl img{float: left;width: 16px;height: 16px;margin-top: 3px;}
.JoinA_dMin dl p{overflow:hidden; text-overflow:ellipsis;white-space:nowrap;margin-left: 25px;}
.JoinA_dMin dd{margin-bottom: 20px;}
.JoinA_dMin dd:last-child{margin: 0;}


/*小程序行业先行者*/
.JoinFirst{padding: 100px 0;}
.JoinFirst_Min{margin-top: 60px;}
.JoinFirst li{width: 20%;float: left;}
.JoinFirst .num{font-size: 40px;font-weight: 600;position: relative;}
.JoinFirst .num:before{content: '';display: block;width: 100%;height: 15px;background: #fdd000;position: absolute;bottom: 10px;left: 0;z-index: -1;}
.JoinFirst .text{font-size: 20px;color: #807e7b;display: block;}

/*我们的实力*/
.JoinPower_Min .swiper-container{background: none;}
/*夺冠魔方代理扶持政策*/
.JoinPolicy{padding: 100px 0 115px;}
.JoinFive li{float: left;width: 20%;}
.JoinFive{position: relative;margin-top: 40px;}
.JoinFive:before{content: '';display: block;width: 100%;height: 1px;background: #dbdbdb;position: absolute;top: 32px;left: 0;z-index: -1;}
.JoinFive img{width: 56px;height: 65px;background: #fff;padding: 0 30px;}
.JoinFive h3{font-size: 24px;font-weight: 500;color: #000;margin: 10px 0 15px;}
.JoinFive p{font-size: 16px;color: #807e7b;padding: 0 40px;}

.JoinFour{margin:77px -40px 0 0;}
.JoinFour li{width: 579px;height: 136px;border: 1px solid #d7d7d7;padding: 17px 27px;box-sizing: border-box;float: left;margin:0 40px 40px 0;}
.JoinFour h3{font-size: 18px;color: #000;position: relative;font-weight: 500;padding-bottom: 10px;}
.JoinFour h3:before{content: '';display: block;position: absolute;bottom: 0;left: 0;width: 32px;height: 3px;background:linear-gradient(to right, #fd9500, #fdd000)}
.JoinFour p{color: #807e7b;font-size: 18px;margin-top: 6px;}

/*明星代理商*/
.JoinStart{padding: 100px 0 110px;background: #fafafa;}
.JoinStart ul{margin: 60px -42px 0 0;}
.JoinStart li{width: 374px;height: 474px;background: #fff;padding: 43px 30px 60px;box-sizing: border-box;margin-right: 40px;float: left;box-shadow: 0 0 10px rgba(0,0,0,.01);}
.JoinStart h3{font-size: 20px;font-weight: 600;text-align: center;margin: 20px 0 15px;}
.JoinStart p{font-size: 16px;color: #666;}
.JoinStart img{width: 279px;height: 157px;margin: 0 auto;display: block;}

.JoinIn{padding: 100px 0 110px;}
.JoinIn_fl{width: 434px;margin-top: -23px;}
.JoinInUp{height: 124px;}
.JoinIn_fl .JoinIn_p{font-size: 24px;line-height: 70px;}
.JoinInUp span{width: 20px;height: 5px;background: #191c3d;display: inline-block;
margin-top: 38px;margin-left: 14px;}
.JoinIn_fl .JoinIn_p span{animation: target 2s infinite 1s linear;}
.JoinIn_fl .JoinIn_h3 span{animation: target 2s infinite 3s linear;}
@keyframes target {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}
.JoinIn_fl .JoinIn_h3{font-size: 36px;font-weight: 500;line-height: 64px;margin-top: -5px;}
.JoinIn_fl ul{margin-top: 44px;}
.JoinIn_fl li{margin-bottom: 23px;line-height: 34px;}
.JoinIn_fl li a{width:412px;height: 40px;line-height: 40px;border-radius: 5px;background: #fdd000;text-align: center;font-size: 16px;display: block;}
.JoinIn_fl li:last-child{margin: 0;}
.JoinIn_fl li span{float: left;}
.JoinIn_fl input{width: 200px;height: 34px;line-height: 34px;padding: 0 10px;float: left;border: 1px solid #cecece;}
.JoinIn_fl select{height: 34px;line-height: 34px;padding: 0 10px;border: 1px solid #cecece;width: 164px;color: #868582;text-align: right;margin-right: 10px;}

.JoinIn_fr .map{width: 586px;height: 282px;}
.JoinIn_fr li{margin-top: 15px;}
.JoinIn_fr li img{vertical-align: -4px;}


.Modular-box .left{width: 354px;height: 540px;margin-left:56px;background-size: 100%;position: relative;}
.Modular-box .swiper-container {width: 260px;height: 544px;margin: 39px 0 0 55px;border-radius: 24px 24px 0 0;}
.arrow-left,.arrow-right{position: absolute;top: 50%;margin-top: -15px;width: 40px;height: 40px;z-index:999;display: block;}
.arrow-left {background: url(../dgimages/moFang/left.png) no-repeat left top;left: -60px;}
.arrow-left:hover{background: url(../dgimages/moFang/left_hover.png) no-repeat left top;}
.arrow-right {background: url(../dgimages/moFang/right.png) no-repeat left bottom;right: -60px;}
.arrow-right:hover{background: url(../dgimages/moFang/right_hover.png) no-repeat left top;}
.Modular-box .right{margin-left: 30%;padding: 60px 0 0 60px;}
.Modular-box .right h2{font-size: 50px;}
.Modular-box h2 i{font-style: initial;font-size: 30px;}
.Details-info img{max-width: 100%;display: inline-block;margin: 20px auto;}
.Modular-box .right-info{border:1px solid #f1f1f1;background: #fbfbfb;}
.Modular-box .info-item{padding-bottom: 0;}
.Modular-box .info-item h3{color:#09BB07;font-weight: 700;}
.Modular-box .info-item span{background: #fff;padding: 10px 30px;margin:0 16px 16px 0;font-size: 14px;border-radius: 3px;display: inline-block;box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);}
.Details h2{padding: 30px 20px;font-size: 36px;background: #09BB07;background: linear-gradient(45deg, #09BB07, #2bc792);color: #fff;}


/* 弹框效果 */
.fix{position: fixed;bottom: 0;left: 0;width: 100%;height: 100%;z-index: 9999;-webkit-animation: popupbg 0.2s ease forwards;-webkit-opacity: 0;padding-bottom: 60rpx;}

.fixBg{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .6);}
.fixScaleBox,.fixTransBox{background: #fff;position: absolute;left:50%;}

/* 移动动画效果 */
.fixTransBox{bottom: 0;-webkit-animation: popup 0.2s ease forwards;-webkit-opacity: 0;-wekbit-transform: translate(-50%,100%);transform: translate(-50%,100%);width: 100%;}

.popup{ -webkit-animation: popupbg 0.2s ease forwards;  -webkit-opacity: 0;}
@-webkit-keyframes popupbg {
  0% { -webkit-opacity: 0;}
  100%{ -webkit-opacity: 1;}
}
.popup .popup-box{ -webkit-animation: popup 0.2s ease forwards;-wekbit-transform: translate(-50%,100%);transform: translate(-50%,100%); -webkit-opacity: 0;}
@-webkit-keyframes popup {
  0% { -wekbit-transform: translate(-50%,100%);transform: translate(-50%,100%); -webkit-opacity: 0;}
  100%{-wekbit-transform: translate(-50%,0%);transform: translate(-50%,0%);-webkit-opacity: 1;}
}

/* 缩放动画效果 */
.fixScaleBox{top: 50%;-webkit-animation: popupp 0.2s ease forwards;-webkit-opacity: 0;-wekbit-transform: translate(-50%,-50%) scale(.01);transform: translate(-50%,-50%) scale(.01);width: 100%;}

.popup .popup-box{ -webkit-animation: popupp 0.2s ease forwards;-wekbit-transform: translate(-50%,-50%) scale(.01);transform: translate(-50%,-50%) scale(.01); -webkit-opacity: 0;}
@-webkit-keyframes popupp {
  0% { -wekbit-transform: translate(-50%,-50%) scale(.01);transform: translate(-50%,-50%) scale(.01); -webkit-opacity: 0;}
  100%{-wekbit-transform: translate(-50%,-50%) scale(1);transform: translate(-50%,-50%) scale(1);-webkit-opacity: 1;}
}


/*视频弹框*/
.videoBox{width: 800px;height: 400px;border-radius: 10px;padding: 20px;}
.videoBox .close{width: 50px;height: 50px;background: #fff;box-shadow: 0 0 10px rgba(0,0,0,.3);position: absolute;top: -20px;right: -20px;border-radius: 50%;}

.videoBox .close:before,.videoBox .close:after{content: '';display: block;width: 2px;height: 30px;background: #afaeae;position: absolute;top: 50%;left: 50%;}
.videoBox .close:before{-wekbit-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);}
.videoBox .close:after{-wekbit-transform: translate(-50%,-50%) rotate(-45deg);transform: translate(-50%,-50%) rotate(-45deg)}