.banner {
    height: 520px;
    background: linear-gradient(#04CD41, #0EC96B 70%);
}

/*系统*/
.xt-col{
    margin-bottom: 50px;
}
.col {
  background: #fff;
  padding: 50px 0;
  text-align: center;
}
.col .h2 {
  text-align: center;
  font-size: 30px;
  line-height: 42px;
  color: #444;
  margin-bottom: 20px;
  letter-spacing: 2px;
}
.xt-col .h2 span{
    color: #5cc30d;
}
.xt-col .content{
    display: grid;
    grid-template-areas:"ul xt_img" "a xt_img";
    align-items: end;

}
.xt-col .content ul{
    grid-area: ul;
}
.xt-col .content ul li{
    float: left;
    width: 120px;
    margin: 0 20px;
    height: 190px;
}
.xt-col .content ul li .img .icon{
    display: block;
    margin: 0 auto;
    border-radius: 50%;
}
.xt-col .content ul li h3{
    text-align: center;
    margin: 12px 0 16px;
    font-weight: 700;
}

.xt-col .content .btn{
    display: block;
    width: 160px;
    height: 54px;
    border-radius: 4px;
    text-align: center;
    line-height: 54px;
    color: #fff;
    background: #f53636;
    font-size: 16px;
    margin-left: 20px;
    grid-area: a;
}
.xt_img{
    grid-area: xt_img;
}
.xt-col .content .btn:hover{
    opacity: .9;
}
.bg-xt_01 {
    width: 84px; height: 84px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1786px -10px;
}
.bg-xt_02 {
    width: 84px; height: 84px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1890px -10px;
}
.bg-xt_03 {
    width: 84px; height: 84px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1994px -10px;
}
.bg-xt_04 {
    width: 84px; height: 84px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -2098px -10px;
}
.bg-xt_05 {
    width: 84px; height: 84px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -2202px -10px;
}
/*功能*/
.gn-col{margin-top: 623px;}
.gn-col .h2 span{
    color: #08d497;
}
.gn-col .content ul{
    padding: 30px 2px;
}
.gn-col .content ul li{
    border: 1px solid #dcdcdc;
    width: 252px;
    height: 252px;
    margin: 16px;
}
.gn-col .content ul li:hover{
    box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
}
.gn-col .content ul li .img .icon{
    display: block;
    margin: 30px auto;
}
.gn-col .content ul li h3{
    font-size: 20px;
}
.gn-col .content ul li p{
    margin: 12px 48px;
    color: #666;
}
.col .core{
     display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    
}
.bg-gn_01 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1018px -10px;
}
.bg-gn_02 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1114px -10px;
}
.bg-gn_03 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1210px -10px;
}
.bg-gn_04 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1306px -10px;
}
.bg-gn_05 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1402px -10px;
}
.bg-gn_06 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1498px -10px;
}
.bg-gn_07 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1594px -10px;
}
.bg-gn_08 {
    width: 76px; height: 76px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -1690px -10px;
}

/*营销裂变*/
.yx-col{
    background: url("/static/pc_img/weapp/mo-bg.jpg") no-repeat center;
    height: 519px;
}
.yx-col .h2{
    color: #fff;
}
.yx-col .p{
    color: #fff;
}
.yx-col .content ul{
    margin: 0 -10px;
    margin-top: 56px;
}
.yx-col .content ul li{
    float: left;
    background: #fff;
    border-radius: 8px;
    width: 270px;
    height: 100px;
    margin: 10px;
}
.yx-col .content ul li .img{
    float: left;
    padding: 18px 10px;
}
.yx-col .content ul li .img .icon{
    display: block;
}
.yx-col .content ul li h3{
    margin-top: 28px;
    margin-bottom: 8px;
    font-weight: 700;
    overflow: hidden;
}
.yx-col .content ul li p{
    color: #666;
    overflow: hidden;
    padding-right: 1px;
}

.bg-yx_01 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -10px -10px;
}
.bg-yx_02 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -94px -10px;
}
.bg-yx_03 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -178px -10px;
}
.bg-yx_04 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -262px -10px;
}
.bg-yx_05 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -346px -10px;
}
.bg-yx_06 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -430px -10px;
}
.bg-yx_07 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -514px -10px;
}
.bg-yx_08 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -598px -10px;
}
.bg-yx_09 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -682px -10px;
}
.bg-yx_10 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -766px -10px;
}
.bg-yx_11 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -850px -10px;
}
.bg-yx_12 {
    width: 64px; height: 64px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -934px -10px;
}

.caseMenu{text-align: center;margin-top: 45px;}
.caseMenuUl{
    display: flex;
    justify-content: center;
}
.caseMenuName{padding: 9px 36px;font-size: 16px;}
.caseNvaN{color: #858585;position: relative;z-index: 2;display: block;}
.caseMenu li.active .caseMenuClick{opacity:1;-webkit-animation: onmove .2s ease-in-out;-moz-animation: onmove .2s ease-in-out;-ms-animation: onmove .2s ease-in-out;-o-animation: onmove .2s ease-in-out;animation: onmove .2s ease-in-out;}
.caseMenu li.active .caseNvaN{color: #141414;}
.caseMenu li.active2 .caseMenuClick{opacity:1;-webkit-animation: onmove2 .2s ease-in-out;-moz-animation: onmove2 .2s ease-in-out;-ms-animation: onmove2 .2s ease-in-out;-o-animation: onmove2 .2s ease-in-out;animation: onmove2 .2s ease-in-out;}
.caseMenu li.active2 .caseNvaN{color: #141414;}
.caseDesCon{margin-top: 75px;}
.caseImgs{width:640px;position: absolute;}
.caseImgs img{width:100%;}
.caseConList{right: 57px;position: absolute;width: 557px;text-align: left;}
.caseImgItem{transform: scale(0.92);top:22px;width: 304px;height: 540px;z-index:1;box-shadow: 0 0 25px 0 rgba(0,0,0,.15);position: absolute;}
.caseImgItem1{left:-5px;}
.caseImgItem2{transform: scale(1);top:0px;left:160px;z-index: 2}
.caseImgItem3{right:0;}
.caseConHead{border-bottom: 1px solid #cccccc;padding: 7px 0 12px;}
.caseHeadTitle{text-overflow: ellipsis;white-space: nowrap;overflow: hidden;display: block;font-size: 34px;color: #000;font-weight: 500;}
.caseHeadDes{text-overflow: ellipsis;white-space: nowrap;overflow: hidden;color: #8d8d8d;font-size: 16px;display: block;padding-top: 8px;padding-bottom: 0px;}
.caseMenu ul li.on {
    background: #ffcf00;
    border-radius: 50px;
}
.caseMenu .caseConList .tempsMain .tempsUl li.on{
   background: none; 
}
.introMain{margin-top: 20px;}
.introTitle{font-size:14px;color:#767676;font-weight: bold;display: block;}
.introDes{height:71px;font-size:14px;padding-top:5px;color:#767676;line-height: 22px;text-overflow:ellipsis;word-break:break-all;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.tempsMain{margin-top: 43px;}
.tempsUl{margin-top:15px;}
.tempsItem{width: 146px;height: 146px;overflow: hidden;border-radius: 14px;}

.tempsBtns{margin-top: 32px;}
.tempsBtn{display:inline-block;background: #ffcf00;color: #000;padding: 11px 26px;border-radius: 50px;font-size: 14px;}
.tempsBtnTip{color: #b8b8b8;padding-left: 15px;}
.webWidth {
    width: 1300px;
}
.commonHeadTitle{color: #000;font-size: 26px;display: block;}
.commonHeadDes{color: #a3a3a3;font-size: 16px;display: block;margin-top: 3px;margin-bottom: 3px;}
.module{position: absolute;background: #fff;z-index: 2;display:none;left: 0;}
.commonHead{display: block;text-align: center;}
.caseMenu ul li.on .module {
    display: block;
    z-index: 2;
    left: 50%;
    margin-left: -650px;
}
.on .caseNvaN {
    color: #141414
}

.tempsItem>img{width:100%;}

/*切换*/
.worksItem {
    background: #333;
    border-radius: 30px;
    width: 291px;
    height: 591px;
    padding: 8px;
    overflow: hidden;
}
.worksItemImg {
    padding-top: 33px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 30px;
}
.worksList li:hover {
    margin-top: -2px;
}
.worksList li {
    float: left;
    margin: 0 9px;
}
/*.zs-col .h2 span{*/
/*    color: #ff8400;*/
/*}*/
/*页面展示*/
.al-col{
    background: #f4f4f4; margin-top: 668px;
}
.al-col .content ul li:hover{
    box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
}
.al-col .content ul li .icon{
    display: block;
    margin: 20px auto;
}
/*适用线下门店商户*/
.hy-col .content ul{
    margin-top: 50px;
}
.col .store{
    display: flex;
    justify-content: space-between;
}
.hy-col .content ul li .img{
    margin-bottom: 12px;
}
.hy-col .content ul li .img .icon{
    display: block;
    margin: 0 auto;
}
.hy-col .content ul li span{
    font-size: 16px;
}

.bg-al_01 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -3458px -10px;
}
.bg-al_02 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -3718px -10px;
}
.bg-al_03 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -3978px -10px;
}
.bg-al_04 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -4238px -10px;
}
.bg-al_05 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -4498px -10px;
}
.bg-al_06 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -4758px -10px;
}
.bg-al_07 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -5018px -10px;
}
.bg-al_08 {
    width: 240px; height: 240px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -5278px -10px;
}
.bg-hy_01 {
    width: 172px; height: 172px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -2306px -10px;
}
.bg-hy_02 {
    width: 172px; height: 172px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -2498px -10px;
}
.bg-hy_03 {
    width: 172px; height: 172px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -2690px -10px;
}
.bg-hy_04 {
    width: 172px; height: 172px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -2882px -10px;
}
.bg-hy_06 {
    width: 172px; height: 172px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -3074px -10px;
}
.bg-hy_05 {
    width: 172px; height: 172px;
    background: url("/static/pc_img/weapp/icon-bg.png") no-repeat -3266px -10px;
}