/**
 * 云流程首页 style
 */
.tools-wrap img {width: .37rem;height: .37rem;}
.banner {height:3rem; color: #fff;background:url(https://sanger-sc-prod.oss-cn-shanghai.aliyuncs.com/static/img/web/pipeline/banner.jpg) no-repeat;background-size: cover;margin-top: 72px;display: flex;justify-content: center;align-items: center;text-align: center;position: absolute;top: 0;z-index: 9;}
.banner .txt {display: inline-block;padding-bottom: 0.1rem;
    opacity: 0;
    animation: fadeIn 3s forwards;  -webkit-animation: fadeIn 3s forwards;}
.banner .txt h5 {font-size: 0.4rem;font-weight:700;margin-bottom: 5px;}
.banner .txt p {font-size:0.16rem;margin-bottom: 0.36rem;letter-spacing:1px;}
.banner .txt .openKfChartBtn {display: inline-block;height: 0.44rem;line-height:0.44rem;border-radius: 30px;padding:0 0.18rem;color:#2E2F33;background:#fff;font-size: 0.16rem;transition:.3s ease;}
.banner .txt a:hover {opacity: .8;}

/*top 标题*/
.tools-top-title {font-size: 0.3rem;margin-bottom: 0.2rem;padding-top: 0.3rem;text-align: center;}
.tools-top-title span {font-size: 0.14rem;color:var(--tips);vertical-align:middle;margin-left: 0.2rem;}
.tools-wrap {display: flex;padding: 0.26rem 0 0.3rem 0;position: relative;background: #F9F9F9;}
.tools-content {flex:1;}

/*侧栏子导航*/
.tools-side-wrap {width:2.35rem;flex-shrink: 0;margin-right: 0.24rem;align-self: flex-start;position: sticky;top: 100px;left: 16px;}
.tools-side-wrap.end {align-self:flex-end;}
.tools-side-wrap.end .fixed {position: initial;}
.tools-side {padding-bottom:0.15rem;border-radius: 4px;}
.tools-side.fixed {position:sticky;width:100%;top:70px;}
.left_sidebar>ul>li {font-size: 0.14rem;margin-top: 6px;}
.left_sidebar>ul>li:first-child {margin-top: 0;}
.left_sidebar>ul>li a {color:#2E2F33;display:block;padding-left:0.35rem;transition:background .3s ease;padding: .14rem 0 .14rem .24rem;font-size: .16rem;display: flex;align-items: center;}
.left_sidebar>ul>li a .icon-wrapper {margin-right: .2rem;color: #6C757D;}
.left_sidebar>ul>li.current a {background:#DCE8F5;color:var(--primary);border-radius: 10px;}
.left_sidebar>ul>li.current a .icon-wrapper {color: var(--primary);}
.pipeline_wrap {margin-top: calc(3rem + 72px)}
.pipeline_wrap .icon-wrapper {width: 26px;height: 26px;margin-right: .2rem;display: flex;align-items: center;}
.pipeline_wrap .my-icon  {
    width: 100%;height: 100%;
    fill: currentColor
}
.cloud-process-title .icon-wrapper {margin-right: .1rem;}
.left_sidebar>ul>li:not(.current) a:hover {background:#f2f9ff;color:#07BE84;}
.left_sidebar>ul>li:not(.current) a:hover .icon-wrapper{color:#07BE84;}
  

/*筛选*/
.filter-box {position: relative;background: #fff;border-radius: 4px;margin-bottom: 25px;width: 7rem;border-radius: .5rem;margin-right: .18rem;}
.filter-box .search {position: relative;display: flex;align-items: center;}
.filter-box .search i {position: absolute;right:15px;color:#09B07F;font-size: 0.24rem;}
.filter-box .search input {height: 0.44rem;line-height: 0.44rem;border-radius: 0.5rem;padding:0 0.3rem;font-size: 0.14rem !important;color: rgba(46, 47, 51, .8)}
.filter-box .search-res {position: absolute;background-color: #fff;border-radius: 4px;max-height: 2.6rem;box-shadow: 0 6px 16px 2px rgb(7 12 20 / 8%);overflow: auto;z-index:10;width:100%;top:0.45rem;display: none;text-align: left;}
.filter-box .search-res li {
	height: 0.4rem;
    padding-left: 0.16rem;
    font-size: 0.14rem;
    color: #222;
    line-height: 0.4rem;
    cursor: pointer;
}
.filter-box .search-res li a {color:#333;display: block;line-height: 0.4rem;}
.filter-box .search-res li:hover {background-color: rgba(82,142,255,.08);color:var(--primary);}
.filter-box .search-res li:hover a {color:var(--primary);}
.filter-box .search-res li.nodata {color:#999;} 

/*内容放置区域*/
.app-list-wrap {min-height:4rem;}

.app-list-wrap .anchor {margin-bottom: .55rem;}
/*页面底部立即咨询层*/
.contact-bottom-layer {height:3.5rem;background:url(https://sanger-sc-prod.oss-cn-shanghai.aliyuncs.com/static/img/web/pipeline/bg_1.jpg) no-repeat;text-align:center;box-sizing: border-box;color: #fff;background-size: 100% 100%;display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;}
.contact-bottom-layer h5 {font-size: 0.32rem;font-weight:bold;margin-bottom: 0.2rem;}
.contact-bottom-layer p {font-size: 0.14rem;margin-bottom: 0.5rem;}
.contact-bottom-layer a {display: inline-block;color:#fff;background: linear-gradient(239deg, #00CE82, #2298EB, #2297E9 100%);border-radius:5px;height:0.54rem;line-height:0.54rem;width: 2.54rem;text-align: center;}
.contact-bottom-layer a:hover {color:#fff;}

/*云流程list*/
.cloud-process-title {font-size: 0.2rem;margin: 0 0 0.04rem .24rem;display: flex;align-items: center;}
.cloud-process-title .num_bg {width: 0.5rem;height: 0.21rem;text-align: center;line-height: 0.2rem;color: #2E2F33;font-size: 0.16rem;background-size: 100% auto;margin-left: 0.16rem;}
.cloud-process-list {display: flex;flex-wrap:wrap;}
.cloud-process {width:31%;border-radius: 4px;box-sizing: border-box;position: relative;overflow:hidden;box-shadow: 0px 0 5px 1px rgba(158,158,158,0.2);;transition: all 0.5s ease;background: #fff;padding: 0.24rem .3rem .24rem .22rem;margin-left: .3rem;margin-top: .26rem;}
.cloud-process .content {position: absolute;top: 0;left: 0;z-index: 2;display: flex;position: relative;width: 100%;height: 100%;}

.cloud-process .img {width: 1.08rem;height: 1.08rem;border-radius: 5px;}
.cloud-process .img img {border-radius: 10px;width: 100%;height: 100%;}
.cloud-process .right {margin-left: 0.2rem;position: relative;}
.cloud-process h5 {display: flex;align-items: center;font-size: 0.18rem;margin-bottom: 0.1rem;word-break:break-all;overflow : hidden;
    text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;color: #282A2D;position: relative;}
.cloud-process .desc {height:0.45rem;word-break:break-all;overflow : hidden;
text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-size: 0.14rem;color: #6C757D;}
.cloud-process .new {display: inline-block;background: #FF5E2C;font-size: .12rem;color: #fff;padding: .01rem .08rem;border-radius: 3px;margin-left: .16rem;}
.cloud-process .button {position: absolute;bottom: -.1rem;right: 0;font-size: 0.14rem;color: #09B07F;background: rgba(9, 176, 127, .11);padding: 0 .2rem;border-radius: .5rem;display: none;height: .32rem;line-height: .32rem;}
.cloud-process:hover {transform: translateY(-12px);}
.cloud-process:hover .button {display: block;}
