﻿.sass-intro-banner
{
    width: 100%;
    height: 9.6rem;
}
.sass-intro-banner .intro-banner-bg
{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.sass-intro-banner .intro-banner-bg:after
{
    position: absolute;
    width: 140%;
    height: 8rem;
    content: ' ';
    z-index: 7;
    background: url("../jpg/c06p0k.jpg") center/cover no-repeat;
    top: 0;
    left: -20%;
    border-radius: 0 0 50% 50%;
}
.intro-banner-bg .collect-circular-wrap
{
    position: absolute;
    left: 3.6rem;
    top: -.6rem;
    width: 12rem;
    height: 12rem;
    border-radius: 50%;
    background-color: rgba(255,255,255,.1);
    backdrop-filter: saturate(100%) blur(10px);
    z-index: 9;
}
.intro-banner-bg .collect-circular-wrap .text-ylz-logo
{
    display: block;
    margin-top: 2rem;
    margin-left: 2.94rem;
    width: 2.8rem;
    height: .9rem;
}
.intro-banner-bg .collect-circular-wrap .text-logo-intro
{
    display: block;
    margin-top: .34rem;
    margin-left: 2.94rem;
    width: 5.9rem;
    height: .42rem;
}
.intro-banner-bg .collect-circular-wrap .text-ylz-intro
{
    margin-top: .32rem;
    margin-left: 2.94rem;
    width: 6.1rem;
    font-weight: 400;
    font-size: .16rem;
    color: #fff;
    line-height: .24rem;
    text-align: justify;
}
.intro-banner-bg .circular-green-icon
{
    position: absolute;
    content: '';
    top: .3rem;
    right: 2.9rem;
    width: 2.14rem;
    height: 2.14rem;
    border-radius: 50%;
    background-color: #06b880;
    z-index: 8;
    transform: translateX(-50%);
}/*start intro list*/
.sass-intro-banner .intro-banner-bg .intro-list
{
    position: absolute;
    width: 100%;
    left: 0;
    bottom: .56rem;
    display: flex;
    justify-content: space-between;
    padding: 0 2.4rem;
    z-index: 11;
}
.intro-banner-bg .intro-list .intro-item
{
    position: relative;
    width: 4.64rem;
    height: 3.2rem;
    background-color: #fff;
    border-radius: .16rem;
    box-shadow: 0 0 1px 0 rgba(48,49,51,.05),0 16px 24px 0 rgba(48,49,51,.1);
    transition: all .15s ease-in-out;
}
.intro-banner-bg .intro-list .intro-item:hover
{
    background-color: #06b880;
    box-shadow: 0 .24rem .4rem 0 rgba(10,101,73,.15),0 0 .01rem 0 rgba(42,75,65,.05);
}
.intro-banner-bg .intro-list .intro-item .intro-item-icon
{
    display: none;
    position: absolute;
    top: -.4rem;
    right: 0;
    width: 2.08rem;
    height: 2.2rem;
}
.intro-banner-bg .intro-list .intro-item:hover .intro-item-icon
{
    display: block;
}
.intro-banner-bg .intro-list .intro-item .title
{
    display: inline-block;
    position: relative;
    font-weight: 500;
    margin-left: .64rem;
    margin-top: 1.2rem;
    color: #323233;
    font-size: .64rem;
    line-height: .9rem;
    z-index: 2;
}
.intro-banner-bg .intro-list .intro-item .title:after
{
    position: absolute;
    content: ' ';
    right: -.24rem;
    top: -.36rem;
    width: .96rem;
    height: .96rem;
    background: url("/assets/images/sass-intro/circle_normal.png") center/cover no-repeat;
    z-index: -1;
}
.intro-banner-bg .intro-list .intro-item:hover .title
{
    color: #fff;
}
.intro-banner-bg .intro-list .intro-item:hover .title:after
{
    background: url("/assets/images/sass-intro/circle_hover.png") center/cover no-repeat;
}
.intro-banner-bg .intro-list .intro-item:hover .content
{
    color: #fff;
}
.intro-banner-bg .intro-list .intro-item .content
{
    margin-left: .64rem;
    margin-top: .24rem;
    color: #7e7f7f;
    font-size: .26rem;
    line-height: .37rem;
}/*视频介绍*/
.ylz-intro-video
{
    padding: .22rem 2.4rem .64rem 2.4rem;
}
.title-wrap .title-wrap
{
    font-size: 0;
}
.ylz-intro-video .title-name
{
    display: inline-block;
    position: relative;
    margin-bottom: .64rem;
    font-size: .4rem;
    font-weight: 400;
    color: #323233;
    line-height: .56rem;
    z-index: 10;
}
.ylz-intro-video .title-name::after
{
    position: absolute;
    right: -.7rem;
    bottom: 0;
    width: 1.5rem;
    height: .12rem;
    background: #06b880;
    content: '';
    z-index: -1;
}
.ylz-intro-video .video-list
{
    display: flex;
    justify-content: center;
}
.ylz-intro-video .video-list .video-item
{
    position: relative;
    width: 7rem;
    height: 3.76rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.ylz-intro-video .video-list .video-item .play-btn
{
    position: absolute;
    top: 50%;
    left: 50%;
    display: inline-block;
    width: .74rem;
    height: .74rem;
    transform: translateX(-50%) translateY(-50%);
    cursor: pointer;
    background: url("../png/e7o9wu.png") center/cover no-repeat;
    z-index: 2;
}
.ylz-intro-video .video-list .video-item .mask
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.5);
    z-index: 1;
}/*视频播放遮罩*/
.video-play-mask
{
    width: 100%;
    height: 100%;
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,.85);
    z-index: 999;
}
.video-play-mask .video-wrap
{
    position: absolute;
    left: 50%;
    top: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translateX(-50%) translateY(-50%);
}
.video-play-mask .video-wrap .video-player
{
    width: 8.96rem;
}
.video-play-mask .video-wrap .close-btn
{
    margin-top: .6rem;
    display: inline-block;
    width: .3rem;
    height: .3rem;
    background: url("../png/j86ih6.png") center/cover no-repeat;
    cursor: pointer;
}/*四大场景赋能*/
.four-scene-wrap
{
    display: flex;
    flex-direction: column;
    padding: .64rem 2.4rem .4rem 2.4rem;
}
.four-scene-wrap .title-name
{
    display: inline-block;
    margin-bottom: .64rem;
    position: relative;
    font-size: .4rem;
    color: #323233;
    z-index: 10;
}
.four-scene-wrap .title-name:after
{
    position: absolute;
    right: -.77rem;
    bottom: .04rem;
    content: '';
    width: 1.5rem;
    height: .1rem;
    background-color: #06b880;
    z-index: -1;
}
.four-scene-wrap .scene-group
{
    position: relative;
    display: flex;
    justify-content: space-between;
    margin-bottom: .24rem;
}
.four-scene-wrap .scene-group .scene-item
{
    position: relative;
    padding: .16rem .14rem .16rem .64rem;
    display: flex;
    justify-content: space-between;
    width: 7.08rem;
    height: 3.44rem;
    background: #f5f6f7;
    border-radius: 16px;
    border: 1px solid #c9cfcd;
    transition: all .3s ease-in-out;
}
.four-scene-wrap .scene-group .scene-item:first-child
{
    margin-right: .24rem;
}
.four-scene-wrap .scene-group .scene-item:first-child:hover
{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background: linear-gradient(133deg,#5fdbb4 0%,#06b880 100%);
    border-radius: .16rem;
    border: .01rem solid #c9cfcd;
    z-index: 8;
}
.four-scene-wrap .scene-group .scene-item:last-child:hover
{
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    background: linear-gradient(133deg,#5fdbb4 0%,#06b880 100%);
    border-radius: .16rem;
    border: .01rem solid #c9cfcd;
    z-index: 8;
}
.scene-group .scene-item .scene-item-intro .title
{
    padding-top: 1.47rem;
    position: relative;
    color: #323233;
    font-weight: 600;
    font-size: .64rem;
    line-height: .78rem;
    z-index: 1;
}
.scene-group .scene-item:hover .scene-item-intro .title
{
    padding-top: .83rem;
}
.scene-group .scene-item .scene-item-intro .one
{
    position: relative;
}
.scene-group .scene-item .scene-item-intro .two
{
    position: relative;
}
.scene-group .scene-item .scene-item-intro .three
{
    position: relative;
}
.scene-group .scene-item .scene-item-intro .four
{
    position: relative;
}
.scene-group .scene-item .scene-item-intro .one:after
{
    position: absolute;
    content: '';
    left: 0;
    bottom: 0;
    z-index: -1;
    width: 2.6rem;
    height: 1.6rem;
    background: url("../png/6objxb.png") center/cover no-repeat;;
}
.scene-group .scene-item .scene-item-intro .two:after
{
    position: absolute;
    content: '';
    left: 0;
    bottom: 0;
    z-index: -1;
    width: 2.6rem;
    height: 1.6rem;
    background: url("../png/8s8vky.png") center/cover no-repeat;;
}
.scene-group .scene-item .scene-item-intro .three:after
{
    position: absolute;
    content: '';
    left: 0;
    bottom: 0;
    z-index: -1;
    width: 2.6rem;
    height: 1.6rem;
    background: url("../png/hkwdib.png") center/cover no-repeat;;
}
.scene-group .scene-item .scene-item-intro .four:after
{
    position: absolute;
    content: '';
    left: 0;
    bottom: 0;
    z-index: -1;
    width: 2.6rem;
    height: 1.6rem;
    background: url("/assets/images/sass-intro/04_normal.png") center/cover no-repeat;;
}
.scene-group .scene-item:hover .scene-item-intro .one:after
{
    width: 2.6rem;
    height: 1.6rem;
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    z-index: -1;
    background: url("../png/ynyoqj.png") center/cover no-repeat;;
}
.scene-group .scene-item:hover .scene-item-intro .two:after
{
    width: 2.6rem;
    height: 1.6rem;
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    z-index: -1;
    background: url("../png/z3qtcr.png") center/cover no-repeat;;
}
.scene-group .scene-item:hover .scene-item-intro .three:after
{
    width: 2.6rem;
    height: 1.6rem;
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    z-index: -1;
    background: url("../png/qf8hgw.png") center/cover no-repeat;;
}
.scene-group .scene-item:hover .scene-item-intro .four:after
{
    width: 2.6rem;
    height: 1.6rem;
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    z-index: -1;
    background: url("../png/m3fydr.png") center/cover no-repeat;;
}
.scene-group .scene-item .scene-item-intro .intro
{
    display: none;
    margin-top: .32rem;
    width: 6.54rem;
    font-size: .2rem;
    font-weight: 400;
    color: #fff;
    line-height: .32rem;
}
.scene-group .scene-item:hover .scene-item-intro .intro
{
    display: block;
}
.scene-group .scene-item .scene-item-form
{
    position: absolute;
    right: 0;
    top: 0;
    padding: .16rem .14rem;
    height: 100%;
    display: flex;
    opacity: 0;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    transition: opacity .2s ease-in .4s;
}
.scene-group .scene-item:hover .scene-item-form
{
    opacity: 1;
}
.scene-group .scene-item .scene-item-form .form-item
{
    display: none;
    justify-content: center;
    min-width: 3.2rem;
    padding: .1rem .17rem;
    font-size: .32rem;
    line-height: .45rem;
    border-radius: .12rem;
    font-weight: 400;
    border: .01rem solid #4bdbae;
    background: linear-gradient(180deg,#37c598 0%,rgba(6,184,128,0) 100%);
    color: #fff;
    text-align: center;
}
.scene-group .scene-item:hover .scene-item-form .form-item
{
    display: flex;
}/* start 系统架构*/
.system-organization
{
    padding: .64rem 2.4rem;
    background: #06b880 url("/assets/images/sass-intro/all-flow-bg.png") center/cover no-repeat;
}
.system-organization .title-wrap
{
    text-align: right;
}
.system-organization .title-wrap .title-name
{
    margin-bottom: .64rem;
    display: inline-block;
    position: relative;
    font-size: .4rem;
    color: #fff;
    z-index: 10;
}
.system-organization .title-wrap .title-name:after
{
    position: absolute;
    left: -.74rem;
    bottom: .04rem;
    content: '';
    width: 1.5rem;
    height: .1rem;
    background-color: #048059;
    z-index: -1;
}
.system-organization .process-title
{
    margin-bottom: .64rem;
    text-align: center;
    font-size: .4rem;
    font-weight: 500;
    color: #fff;
    line-height: .56rem;
}
.system-organization .system-node-list
{
    display: flex;
}
.system-organization .system-node-list .node
{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.system-organization .system-node-list .node .node-icon
{
    margin-bottom: .08rem;
    width: .72rem;
    height: .72rem;
}
.system-organization .system-node-list .node .name
{
    font-size: .32rem;
    color: #323233;
    line-height: .58rem;
}
.system-organization .system-node-list .start-node
{
    width: 2.86rem;
    height: 2rem;
    background: url("/assets/images/sass-intro/start-node.png") center/cover no-repeat;
}
.system-organization .system-node-list .process-node
{
    width: 2.75rem;
    height: 2rem;
    background: url("../png/ofs33i.png") center/cover no-repeat;
}/* start 核心功能模块*/
.core-function-model
{
    padding: .64rem 2.4rem;
    background: #059c6c url("../png/msc8vz.png") center/cover no-repeat;
}
.core-function-model .title-name
{
    margin-bottom: .64rem;
    font-weight: 500;
    font-size: .4rem;
    line-height: .56rem;
    text-align: center;
    color: #fff;
}
.core-function-model .core-model-list
{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .64rem;
}
.core-function-model .core-model-list .model-foot
{
    margin-top: -.3rem;
}
.core-function-model .core-model-list .model-head-item
{
    display: flex;
    justify-content: space-between;
}
.core-function-model .core-model-list .model-head-item .model-item
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 3.2rem;
    height: 3.2rem;
    background: url("/assets/images/sass-intro/model.png") center/cover no-repeat;
}
.core-function-model .core-model-list .model-head-item .model-item .model-log
{
    width: .72rem;
    height: .72rem;
    margin-bottom: .06rem;
}
.core-function-model .core-model-list .model-head-item .model-item .model-name
{
    font-size: .32rem;
    line-height: .58rem;
    color: #323233;
}
.core-function-model .core-intro-list
{
    display: flex;
    justify-content: space-between;
}
.core-function-model .core-intro-list .core-intro-item
{
    position: relative;
    width: 3.42rem;
    height: 2.35rem;
    border-radius: .16rem;
    border: .01rem solid #fff;
    overflow: hidden;
}
.core-function-model .core-intro-list .core-intro-item .title
{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: .08rem 0;
    font-size: .24rem;
    line-height: .33rem;
    background-color: rgba(50,50,51,.6);
    color: #fff;
    text-align: center;
}
.core-function-model .core-intro-list .core-intro-item:first-child
{
    background: url("../png/3s71u4.png") center/cover no-repeat;
}
.core-function-model .core-intro-list .core-intro-item:nth-child(2)
{
    background: url("../png/vopree.png") center/cover no-repeat;
}
.core-function-model .core-intro-list .core-intro-item:nth-child(3)
{
    background: url("../jpg/45k690.jpg") center/cover no-repeat;
}
.core-function-model .core-intro-list .core-intro-item:nth-child(4)
{
    background: url("../png/zaea1p.png") center/cover no-repeat;
}/*底层技术支撑*/
.bottom-technology-root
{
    padding: .64rem 2.4rem;
    background: #06b880 url("../png/5akhal.png") center/cover no-repeat;
}
.bottom-technology-root .bottom-technology-title
{
    margin-bottom: .64rem;
    font-size: .4rem;
    font-weight: 500;
    color: #fff;
    line-height: .56rem;
    text-align: center;
}
.bottom-technology-wrap
{
    position: relative;
    display: flex;
    justify-content: space-between;
}
.bottom-technology-wrap .technology-center-icon
{
    position: absolute;
    width: 2.9rem;
    height: 2.9rem;
    left: 50%;
    transform: translateX(-50%);
    background: url("../png/06aigu.png") center/cover no-repeat;
}
.bottom-technology-wrap .technology-item
{
    width: 6.1rem;
    height: 3.05rem;
    padding: .21rem .49rem .05rem .49rem;
    background: linear-gradient(180deg,#37c598 0%,rgba(6,184,128,0) 100%);
    border-radius: .16rem;
    border: .01rem solid #4bdbae;
}
.bottom-technology-wrap .technology-item .title-name
{
    margin-bottom: .24rem;
    font-size: .36rem;
    font-weight: 500;
    color: #fff;
    line-height: .5rem;
    text-align: center;
}
.bottom-technology-wrap .technology-item .intro-list
{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.bottom-technology-wrap .technology-item .intro-list .intro-item
{
    margin-bottom: .24rem;
    width: 2.45rem;
    padding: .17rem 0;
    border-radius: .12rem;
    font-size: .32rem;
    font-weight: 400;
    color: #fff;
    line-height: .45rem;
    text-align: center;
    background-color: rgba(255,255,255,.3);
}/* 典型客户用例 */
.customer-demo-wrap
{
    display: flex;
    flex-direction: column;
    padding: .64rem 2.4rem;
}
.customer-demo-wrap .title-name
{
    margin-bottom: .64rem;
    display: inline-block;
    position: relative;
    font-size: .4rem;
    color: #323233;
    z-index: 10;
}
.customer-demo-wrap .title-name:after
{
    position: absolute;
    right: -.77rem;
    bottom: .04rem;
    content: '';
    width: 1.5rem;
    height: .1rem;
    background-color: #06b880;
    z-index: -1;
}
.customer-demo-wrap .demo-list
{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.customer-demo-wrap .demo-list .demo-item
{
    position: relative;
    padding: .4rem .64rem;
    width: 7.08rem;
    height: 4rem;
    border-radius: .16rem;
    background: #f5f6f7 url("../png/pstjny.png") center/cover no-repeat;
}
.customer-demo-wrap .demo-list .demo-item:hover
{
    box-shadow: 0 .16rem .24rem 0 rgba(48,49,51,.1),0 0 .01rem 0 rgba(48,49,51,.05);
}
.customer-demo-wrap .demo-list .demo-item:first-child
{
    margin-right: .24rem;
}
.customer-demo-wrap .demo-list .demo-item .demo-name
{
    margin-bottom: .42rem;
    font-size: .64rem;
    font-weight: 600;
    color: #323233;
    line-height: .78rem;
}
.customer-demo-wrap .demo-list .demo-item .demo-intro
{
    width: 4.24rem;
    font-size: .2rem;
    font-weight: 400;
    color: #7e7f7f;
    line-height: .32rem;
    text-align: justify;
}
.customer-demo-wrap .demo-list .demo-item .demo-icon
{
    position: absolute;
    top: .32rem;
    right: .32rem;
    width: 1.3rem;
    height: 1.3rem;
}