/**ZUI*/
:root{
	--primary-blue: #2563eb;
	--light-blue: #60a5fa;
	--primary-purple: #8b5cf6;
	--light-purple: #a78bfa;
	--gray-100: #f3f4f6;
	--gray-200: #e5e7eb;
	--gray-300: #d1d5db;
	--gray-500: #6b7280;
	--gray-700: #374151;
	--gray-900: #1f2937;
	--white: #ffffff;
	--shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
	--shadow-md: 0 4px 12px rgba(37, 99, 235, 0.1);
	--shadow-lg: 0 8px 24px rgba(139, 92, 246, 0.12);
	--radius-sm: 6px;
	--radius-md: 10px;
	--radius-lg: 14px;
	--transition: all 0.24s ease;
}
.zui{
	--zui-column-gap: 20px;
	--zui-block-padding-top:150px;
	--zui-block-padding-bottom:150px;
	--zui-column-gap: 20px;
	--zui-item-padding: 32px;
	--zui-item-padding-end: 32px; /**非对称时使用75px*/
	--zui-item-h3-lineheight: 1.25;
	--zui-item-h3-fontweight: 600;
	--zui-item-h3-fontsize: 28px;
	
	--zui-item-h3-padding-start: 10px;
	--zui-item-h3-padding-end: 10px;
	
	--zui-item-p-lineheight: 1.7;	
	--zui-item-p-fontweight: 400;
	--zui-item-p-fontsize: 17px;
	--zui-item-p-margin-top: 0.8em;
	
	--zui-item-viewport-items: 87.5vw;
	
	--zui-item-radius: 28px;
	
	/**图标大小*/
	--zui-item-icon-width: 48px;
	--zui-item-icon-height: 48px;
	
	--zui-scroll-padding: calc(50vw - min(1680px, var(--zui-item-viewport-items)) / 2);
	
	--zui-item-width-all: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 0) / 1);
	--zui-item-width-half: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 1) / 2);
	--zui-item-width-col3: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 2) / 3);
	
	/**通栏平分网格*/
	--zui-item-width-col1: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 0) / 1);
	--zui-item-width-col2: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 1) / 2);
	--zui-item-width-col3: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 2) / 3);
	--zui-item-width-col4: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 3) / 4);
	--zui-item-width-col5: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 4) / 5);
	--zui-item-width-col6: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 5) / 6);
	--zui-item-width-col7: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 6) / 7);
	--zui-item-width-col8: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 7) / 8);
	--zui-item-width-col9: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 8) / 9);
	--zui-item-width-col10: calc((100vw - var(--zui-scroll-padding) * 2 - var(--zui-column-gap) * 9) / 10);
	
	
	/**相对于容器节点平分网格，适用于容器宽度已知，子元素平分宽度*/
	--zui-grid-padding: 0px;
	--zui-width-col1: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 0) / 1);
	--zui-width-col2: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 1) / 2);
	--zui-width-col3: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 2) / 3);
	--zui-width-col4: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 3) / 4);
	--zui-width-col5: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 4) / 5);
	--zui-width-col6: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 5) / 6);
	--zui-width-col7: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 6) / 7);
	--zui-width-col8: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 7) / 8);
	--zui-width-col9: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 8) / 9);
	--zui-width-col10: calc((100% - var(--zui-grid-padding) * 2 - var(--zui-column-gap) * 9) / 10);
	
	--zui-item-col2-textwidth: 350px;
	--zui-item-col2-textpadding: 120px;
	
	--zui-item-picture-padding: 64px;
	--zui-text-c-padding: 20px;
	
	/**Text-flow*/
	--zui-text-h3-lineheight: 1.25;
	--zui-text-h3-fontweight: 600;
	--zui-text-h3-fontsize: 28px;
	--zui-text-h3-color: rgba(0, 113, 227, 1);
	--zui-text-p-lineheight: 1.353;	
	--zui-text-p-fontweight: 400;
	--zui-text-p-fontsize: 17px;
	--zui-text-p-margin-top: 0.8em;
	--zui-text-p-color: #252525;
	--zui-text-a-color: rgba(0, 113, 227, 1);
	--zui-text-a-hover: #f00;
	
	--zui-button-background: rgba(0, 113, 227, 1);
	--zui-button-color: #fff;
	
	/**header标题颜色*/
	--zui-head-title-color: #000;
	--zui-head-desc-color: #888;
	--zui-item-title-color: #000;
	--zui-item-text-color: #666;
	--zui-content-color: #666;
	
	--zui-head-padding-bottom: 70px;
	
	/**头部标题字体*/
	--zui-head-h2-fontsize: 56px;
	--zui-head-h2-lineheight: 60px;
	--zui-head-h2-fontweight:600;

	--primary-blue: #2563eb;
	--light-blue: #60a5fa;
	--primary-purple: #8b5cf6;
	--light-purple: #a78bfa;
	--gray-100: #f3f4f6;
	--gray-200: #e5e7eb;
	--gray-300: #d1d5db;
	--gray-500: #6b7280;
	--gray-700: #374151;
	--gray-900: #1f2937;
	--white: #ffffff;
	--shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
	--shadow-md: 0 4px 12px rgba(37, 99, 235, 0.1);
	--shadow-lg: 0 8px 24px rgba(139, 92, 246, 0.12);
	--radius-sm: 6px;
	--radius-md: 10px;
	--radius-lg: 14px;
	--transition: all 0.24s ease;
}
.zui div{box-sizing:border-box;}
.zui a{color:var(--zui-text-a-color);text-decoration: none}
.zui a:hover{color:var(--zui-text-a-hover)}

.zui-m-style .logo >a:hover{color:var(--main-logo-color, #fff)}

.zui-title-desc{}
/**width:87.5vw;max-width: 1650px;*/
.zui-head header{display: flex;align-items: flex-start; justify-content: space-between;padding-bottom: var(--zui-head-padding-bottom);gap:28px;margin:0 auto;}
.zui-no-head-padding .zui-head header{padding-bottom:0;}
.zui-no-head .zui-head{display:none}

.zui-head header h2,.zui-head header h2 a,.zui-head header h2 span{font-size: var(--zui-head-h2-fontsize, 56px); line-height: var(--zui-head-h2-lineheight, 60px);   font-weight: var(--zui-head-h2-fontweight, 600);color:var(--zui-head-title-color)}
.zui-head header h3,.zui-head header h3 a,.zui-head header h3 span{font-size: var(--zui-head-h2-fontsize, 56px); line-height: var(--zui-head-h2-lineheight, 60px);   font-weight: var(--zui-head-h2-fontweight, 600);color:var(--zui-head-title-color)}
.zui-head header h1,.zui-head header h1 a,.zui-head header h1 span{font-size: var(--zui-head-h2-fontsize, 56px); line-height: var(--zui-head-h2-lineheight, 60px);   font-weight: var(--zui-head-h2-fontweight, 600);color:var(--zui-head-title-color)}
.zui-head header div{line-height: var(--zui-head-h2-lineheight, 60px); }


.zui-head-desc{color:var(--zui-head-desc-color)}
.zui-content{color:var(--zui-content-color)}

.zui-scroll{width: 100%;overflow: scroll;scroll-snap-type:none;scrollbar-width:none;transition: 0.5s all ease;scroll-behavior: smooth;}
.zui-no-scroll{width: 100%;overflow: hidden;scroll-snap-type:none;scrollbar-width:none;transition: 0.5s all ease;scroll-behavior: smooth;}
/**width:87.5vw;max-width: 1650px;*/
.zui-op-buttons{min-height:60px;margin:0 auto;}
.zui-ops{text-align: right;overflow: hidden;margin-top:12px;padding-right:12px;}
.zui-ops .zui-op{display:inline-block;cursor:pointer;width:36px;height:36px;border-radius:50%;background:#aaa;text-align: center;overflow: hidden;line-height: 36px;outline: none;user-select: none;}
.zui-ops .zui-op.zui-op-disabled{color:#efefef;}
/**按钮*/
.zui-btn{background:var(--zui-button-background);color:var(--zui-button-color);border-radius: 960px;font-size: 17px;line-height: 1.17648;font-weight: 400;display:inline-block;vertical-align: middle;padding:10px 20px;cursor:pointer;transition: all 0.3s ease}
.zui-btns{background:var(--zui-button-background);color:var(--zui-button-color);border-radius: 960px;font-size: 12px;line-height: 1.17648;font-weight: 400;display:inline-block;vertical-align: middle;padding:6px 12px;cursor:pointer;transition: all 0.3s ease}
.zui-btnm{background:var(--zui-button-background);color:var(--zui-button-color);border-radius: 960px;font-size: 12px;line-height: 1.17648;font-weight: 400;display:inline-block;vertical-align: middle;padding:8px 15px;cursor:pointer;transition: all 0.3s ease}

.zui-btn.red{background:#fd5957;}
.zui-btn.blue{background:#0d378b;}
.zui-btn.green{background:#36c470;}
.zui-btn.yellow{background:#febc2a;}
.zui-btn.orange{background:#f27620;}
.zui-btn.lblue{background:#4b9efe;}


.zui-btns.red{background:#fd5957;}
.zui-btns.blue{background:#0d378b;}
.zui-btns.green{background:#36c470;}
.zui-btns.yellow{background:#febc2a;}
.zui-btns.orange{background:#f27620;}
.zui-btns.lblue{background:#4b9efe;}


.zui-btnm.red{background:#fd5957;}
.zui-btnm.blue{background:#0d378b;}
.zui-btnm.green{background:#36c470;}
.zui-btnm.yellow{background:#febc2a;}
.zui-btnm.orange{background:#f27620;}
.zui-btnm.lblue{background:#4b9efe;}

.zui-btn:hover{opacity: 0.8}
.zui-btns:hover{opacity: 0.8}
.zui-btnm:hover{opacity: 0.8}
/*块底部的通栏*/
.zui-full-block{width:87.5vw;max-width: 1650px;margin:0 auto;}
.zui-wrap{width:87.5vw;max-width:1650px;margin:0 auto}


/**item card*/
.zui-itemcard{	
	padding-top:var(--zui-block-padding-top);
	padding-bottom:var(--zui-block-padding-bottom);
	
	
}
.zui-item-card-container{
	display:block;
	width: 100%;
	grid-template-rows: 100%;/*repeat(1, auto);*/
    grid-template-columns: max-content;
    grid-auto-flow: column;
    grid-column-gap: var(--zui-column-gap);
    column-gap: var(--zui-column-gap);
    grid-row-gap: 0px;
    row-gap: 0px;
    /*width: -moz-fit-content;
    width: fit-content;
	*/
	
}

/**网格主容器（直接子级为项，默认显示一行）,其中padding可以通过zui-no-padding去掉*/
.zui-item-card-items{    
	display: grid;
    grid-template-rows: repeat(1, auto);
    grid-template-columns: max-content;
    grid-auto-flow: column;
    grid-column-gap: var(--zui-column-gap);
    column-gap: var(--zui-column-gap);
    grid-row-gap: 0px;
    row-gap: 0px;
    /*width: -moz-fit-content;
    width: fit-content;*/
	width: 100%;
    margin: 0;
    list-style: none;
	padding:0 var(--zui-scroll-padding);
	
}
.zui-no-scroll .zui-item-card-items{max-width:100%;width:100%;overflow: hidden}
.zui-no-padding .zui-item-card-items{padding:0;}

.zui-padding-top150{padding-top:150px;}

.zui .block-padding-top,.zui.block-padding-top{padding-top: var(--zui-block-padding-top, 150px)}
.zui .block-padding-bottom,.zui.block-padding-bottom{padding-top: var(--zui-block-padding-bottom, 150px)}


.zui-item-card-items>li,.zui-item-card-items >div,.zui-item-card-items>span{height:100%;}

.zui-item{position:relative;transition: all ease 0.3s;overflow: hidden;min-width: 0;}

.zui-item .zui-item-frame{border-radius:var(--zui-item-radius);background:#fff;height:100%;overflow: hidden;width:100%;/*max-width:100vw*/}

.zui-item .zui-item-frame .zui-item-viewport{height:100%;width:100%;overflow: hidden}
.zui-item .zui-item-frame .zui-item-viewport{height:100%;width:100%;overflow: hidden}

.zui-item:hover{transform:scale3d(1.01,1.01,1.01)}

.zui-item .zui-item-c{height: 100%;width:100%;max-width:100%;overflow: hidden}
.zui-item .zui-item-c .zui-item-content{padding:var(--zui-item-padding);padding-right:var(--zui-item-padding-end);word-break: break-all;max-width: 100%;}

/*width:var(--zui-item-icon-width, 48px);*/
.zui-item-icon img{max-width:100%;height:var(--zui-item-icon-height, 48px);object-fit: contain}

/**图片要在最底部时，需要把容器高设置成100%*/
.zui-item .zui-item-c .zui-item-picture{display:block;overflow: hidden;max-width:100%;width:100%;text-align: center;position: relative;bottom:0;line-height: 0;}
.zui-item-picture >div{padding:var(--zui-item-picture-padding);box-sizing: border-box;overflow: hidden}
.zui-item .zui-item-c .zui-item-picture img{max-width:100%;min-width: 100%;overflow: hidden;display:block;height:auto;}

.zui-item .zui-item-c >.zui-item-col1{display:flex;justify-content: space-between;flex-direction: column;height:100%;width: 100%;box-sizing: border-box;}

.zui-item .zui-item-c >.zui-item-col2{
	display:grid;
	grid-template-columns: calc(var(--zui-item-col2-textwidth) + var(--zui-item-col2-textpadding) * 2) 1fr;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
}

.zui-item .zui-item-c >.zui-item-col2-pic{
	display:grid;
	grid-template-columns: 1fr calc(var(--zui-item-col2-textwidth) + var(--zui-item-col2-textpadding) * 2);
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
}
.zui-item .zui-item-c >.zui-item-col2 .zui-item-content{padding:var(--zui-item-col2-textpadding);}
.zui-item .zui-item-c >.zui-item-col2-pic .zui-item-content{padding:var(--zui-item-col2-textpadding);}

.zui-item .zui-item-c >.zui-item-col2 .zui-item-content >.zui-item-text{width:var(--zui-item-col2-textwidth)}
.zui-item .zui-item-c >.zui-item-col2-pic .zui-item-content >.zui-item-text{width:var(--zui-item-col2-textwidth)}

.zui-item .zui-item-c >.zui-item-col-n{
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    justify-content: space-between;
    align-items: stretch;
    overflow: hidden;
}

.zui-item .zui-item-c .zui-item-text h3{line-height:var(--zui-item-h3-lineheight);font-weight:var(--zui-item-h3-fontweight);font-size:var(--zui-item-h3-fontsize);color:var(--zui-item-title-color);padding-top:var(--zui-item-h3-padding-start,0px);padding-bottom:var(--zui-item-h3-padding-end,0px)}
.zui-item .zui-item-c .zui-item-text p{line-height:var(--zui-item-p-lineheight);font-weight:var(--zui-item-p-fontweight);font-size:var(--zui-item-p-fontsize);margin-top:var(--zui-item-p-margin-top,0.8em);color:var(--zui-item-text-color)}

/*文本流*/
.zui-text-c{padding:var(--zui-text-c-padding)}
.zui-text-flow{line-height:var(--zui-text-h3-lineheight);}
.zui-text-flow h3{line-height:var(--zui-text-h3-lineheight);font-weight:var(--zui-text-h3-fontweight);font-size:var(--zui-text-h3-fontsize);color:var(--zui-text-h3-color)}
.zui-text-flow p{line-height:var(--zui-text-p-lineheight);font-weight:var(--zui-text-p-fontweight);font-size:var(--zui-text-p-fontsize);color:var(--zui-text-p-color)}
.zui-text-flow a{color:var(--zui-text-a-color);font-size:var(--zui-text-p-fontsize)}
.zui-text-flow.zui-noli >ul{list-style: none;padding:0;margin:0;}
.zui-text-flow.zui-noli >li>li{list-style: none;padding:0;margin:0;}

.zui-item .zui-item-b{position: absolute;right:20px;bottom:20px;}

/**固定一列*/
.zui-one-col .zui-item-card-items,.zui-numcol-1 .zui-item-card-items{
	grid-template-columns:1fr;grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-one-col .zui-item .zui-item-frame,.zui-numcol-1 .zui-item .zui-item-frame{width:var(--zui-item-width-all)}

/**固定两列*/
.zui-two-col .zui-item-card-items,.zui-numcol-2 .zui-item-card-items{
	grid-template-columns:1fr 1fr;grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-two-col .zui-item .zui-item-frame,.zui-numcol-2 .zui-item .zui-item-frame{width:var(--zui-item-width-half)}

/**固定三列*/
.zui-three-col .zui-item-card-items,.zui-numcol-3 .zui-item-card-items{
	grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-three-col .zui-item .zui-item-frame,.zui-numcol-3 .zui-item .zui-item-frame{width:var(--zui-item-width-col3)}

/**固定四列*/
.zui-four-col .zui-item-card-items,.zui-numcol-4 .zui-item-card-items{
	grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}
.zui-four-col .zui-item .zui-item-frame,.zui-numcol-4 .zui-item .zui-item-frame{width:var(--zui-item-width-col4)}

/**固定五列*/
.zui-five-col .zui-item-card-items,.zui-numcol-5 .zui-item-card-items{
	grid-template-columns:repeat(auto-fill, minmax( max(320px, calc((100% - (var(--zui-column-gap) * 4)) / 5)), 1fr));/*minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);*/
	grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-five-col .zui-item .zui-item-frame,.zui-numcol-5 .zui-item .zui-item-frame{width:100%;overflow: hidden}

/**固定六列*/
.zui-six-col .zui-item-card-items,.zui-numcol-6 .zui-item-card-items{
	grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-six-col .zui-item .zui-item-frame,.zui-numcol-6 .zui-item .zui-item-frame{width:var(--zui-item-width-col6)}

/**固定列N=任意，最小宽度320*/
.zui-col-w320 .zui-item-card-items,.zui-numcol-w320 .zui-item-card-items{
	grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));/*minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);*/
	grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-col-w320 .zui-item .zui-item-frame,.zui-numcol-w320 .zui-item .zui-item-frame{width:100%;overflow: hidden}

/**固定列N=任意，最小宽度480*/
.zui-col-w480 .zui-item-card-items,.zui-numcol-w480 .zui-item-card-items{
	grid-template-columns:repeat(auto-fill, minmax(480px, 1fr));/*minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);*/
	grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-col-w480 .zui-item .zui-item-frame,.zui-numcol-w480 .zui-item .zui-item-frame{width:100%;overflow: hidden}
/**固定列N=任意，最小宽度320*/
.zui-col-w240 .zui-item-card-items,.zui-numcol-w240 .zui-item-card-items{
	grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
	grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-col-w240 .zui-item .zui-item-frame,.zui-numcol-w240 .zui-item .zui-item-frame{width:100%;overflow: hidden}

/**固定列最多2列，最小宽度320*/
.zui-col-w2-320 .zui-item-card-items,.zui-numcol-w2-320 .zui-item-card-items{
	grid-template-columns:repeat(auto-fill, minmax( max(320px, calc((100% - var(--zui-column-gap)) / 2)), 1fr));
	grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-col-w2-320 .zui-item .zui-item-frame,.zui-numcol-w2-320 .zui-item .zui-item-frame{width:100%;overflow: hidden}
/**固定列最多2列，最小宽度480*/
.zui-col-w2-480 .zui-item-card-items,.zui-numcol-w2-480 .zui-item-card-items{
	grid-template-columns:repeat(auto-fill, minmax( max(480px, calc((100% - var(--zui-column-gap)) / 2)), 1fr));
	grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-col-w2-480 .zui-item .zui-item-frame,.zui-numcol-w2-480 .zui-item .zui-item-frame{width:100%;overflow: hidden}


/**固定列最多N列，最小宽度w，N由style中的--zui-COLN:定义，最小宽度由--zui-MINW定义*/
.zui-col-n-w .zui-item-card-items,.zui-numcol-n-w .zui-item-card-items{
	/*--zui-COLN: 2;
	--zui-MINW: 320px;*/
	grid-template-columns:repeat(auto-fill, minmax( max(var(--zui-MINW, 320px), calc((100% - var(--zui-column-gap) * (var(--zui-COLN, 2) - 1)) / var(--zui-COLN, 2))), 1fr));
	grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    row-gap: var(--zui-column-gap);
}

.zui-col-n-w .zui-item .zui-item-frame,.zui-numcol-n-w .zui-item .zui-item-frame{width:100%;overflow: hidden}

/**通用平均分配N列，--zui-N指定最大列数，--zui-W: 指定最小宽度（像素）*/
/*--zui-N: 2;
	--zui-W: 320px;
	--zui-gap: 0px;
	--zui-gap-col: 0px;
	--zui-gap-row: 0px*/
.zui-n-col{
	
	--zui-computed-col-gap: var(--zui-gap-col, var(--zui-gap, 0px));
	--zui-computed-row-gap: var(--zui-gap-row, var(--zui-gap, 0px));
	
	
	display:grid;
	grid-template-columns:repeat(auto-fill, minmax( max( min(var(--zui-W, 320px), 100%), calc((100% - var(--zui-computed-col-gap, 0px) * (var(--zui-N, 2) - 1)) / var(--zui-N, 2))), 1fr) );
	grid-template-rows:1fr;
	grid-auto-flow:row dense;
	
	grid-row-gap: var(--zui-computed-row-gap, 0px);
    row-gap: var(--zui-computed-row-gap, 0px);
	
	grid-column-gap: var(--zui-computed-col-gap, 0px);
	column-gap: var(--zui-computed-col-gap, 0px);
}
/**通用平均分配N行，--zui-N指定最大行数，--zui-H: 指定最高度（像素）*/
.zui-n-row{
	/*--zui-N: 2;
	--zui-H: 320px;
	--zui-gap: 0px;
	--zui-gap-col: 0px;
	--zui-gap-row: 0px*/
	--zui-computed-col-gap: var(--zui-gap-col, var(--zui-gap, 0px));
	--zui-computed-row-gap: var(--zui-gap-row, var(--zui-gap, 0px));
	display:grid;
	grid-template-rows:repeat(auto-fill, minmax( max(var(--zui-H, max-content), calc((100% - var(--zui-computed-row-gap, 0px) * (var(--zui-N, 2) - 1)) / var(--zui-N, 2))), 1fr));
	grid-template-columns:1fr;
	grid-auto-flow:column dense;
	
	grid-row-gap: var(--zui-computed-row-gap, 0px);
    row-gap: var(--zui-computed-row-gap, 0px);
	
	grid-column-gap: var(--zui-computed-col-gap, 0px);
	column-gap: var(--zui-computed-col-gap, 0px);
	
	transition: all ease 0.5;
}
/**一个块显示内容*/
.zui-block{
	padding: var(--zui-pt, var(--zui-p, 30px)) var(--zui-pr, var(--zui-p, 30px)) var(--zui-pb, var(--zui-p, 30px))  var(--zui-pl, var(--zui-p, 30px));
	margin:0;
	background: var(--zui-block-bg, #f4f9ff);
	border: var(--zui-block-bd, 1px solid #f4f9ff);
	border-radius: var(--zui-bdr, 20px);
	transition: all ease 0.5s;
}
.zui-block:hover{
	transform: translateY(-4px);
	border: var(--zui-block-hover-bd, 1px solid #fd9cc8);
    box-shadow: 0 10px 30px color-mix(in srgb, var(--zui-block-hover-bdcolor, #fd9cc8) 40%, transparent);
}
.zui-block.zui-bg-white{background:#ffffff}
.zui-block.zui-bg-gray{background:#efefef}
.zui-block.zui-bg-dark{background:#333333}

.zui-block .zui-content{display:flex;flex-direction: column}
.zui-content >h2,.zui-content >h3{
	font-size:var(--zui-title-fs, 24px);
	line-height: var(--zui-title-lh, 1.3);padding:var(--zui-title-p, 24px 0px);
	margin:var(--zui-title-m, 0px);font-weight:500;
	display: flex;justify-items: center;align-items: center;
	gap:16px
}
.zui-content >h2>svg,.zui-content >h3>svg,.zui-content >h2>img,.zui-content >h3>img{flex-shrink: 0;}
.zui-content> div{font-size:var(--zui-p-fs, 14px);line-height: var(--zui-p-lh, 1.4);padding:var(--zui-p-p, 0px);margin:var(--zui-p-m, 0px 0px 16px 0px);overflow: hidden}
.zui-content .zui-desc{color:var(--zui-desc-color, #666666)}

.zui-icon img{max-width:100%;height:var(--zui-item-icon-height, 48px);object-fit: contain}
.zui-head-center .zui-content >h2,.zui-head-center .zui-content >h3,.zui-head-center .zui-content >h4{text-align: center;justify-content: center;}
.zui-head-center .zui-content .zui-icon{text-align: center;}

.zui-block.zui-bg-dark ,.zui-block.zui-bg-dark *{color:var(--zui-dark-color, #ffffff);}

.zui-image img{max-width:100%;object-fit: contain}

.zui-page-title h1{font-size:32px;line-height: 1.4;padding:0px 0px;font-weight: bold;white-space: nowrap}
.zui-pt-0{padding-top:0;}
.zui-pb-0{padding-bottom:0;}

.zui-flow{display:flex;flex-direction: column;gap:var(--zui-flow-gap, 16px)}

.zui-tree{}
.zui-tree-node{position: relative;}
.zui-tree-label{line-height: 1.414;padding-top:var(--zui-tree-mt, 10px);display: flex;position: relative}
.zui-tree-label a,.zui-tree-label span,.zui-tree-label div,.zui-tree-label p{line-height: 1.414;}
.zui-tree-childs{padding-left:var(--zui-tree-left, 20px)}


/**一组显示内容
head
ncols
可定义块尺寸，--zui-pt,--zui-p,--zui-bg等
*/
.zui-group{}
.zui-group-title{display:flex;align-content: center;align-items: stretch;justify-content: space-between}
.zui-group-title h2{font-size:30px;line-height: 1.3;padding: 10px 0px 30px 0px;font-weight:bold;}
.zui-group-title h2, .zui-group-title h2 *{color:#1d1d1f}

.zui-group-title-desc{color:#888;text-align: center;max-width: 960px;margin:0 auto;}

.zui-group-title h1{line-height: 1.3;padding: 10px 0px 30px 0px;font-weight:bold;}
.zui-group-title h1, .zui-group-title h1 *{color:#1d1d1f;font-size:48px;}
/**head-title居中*/
.zui-title-center .zui-group-title{justify-content: center;align-items: center;align-content: center;}
.zui-title-center .zui-group-title{justify-content: center;align-items: center;align-content: center;}
.zui-title-center .zui-group-head{padding-bottom:60px;}
.zui-title-center .zui-group-title-desc{color:#888;text-align: center;max-width: 960px;margin:0 auto;}
/**Tabc*/
.zui-tabc{overflow: hidden;border-radius: var(--zui-tab-box-br, 16px);background: var(--zui-tab-box-bg, #f4f9ff);}
.zui-tabc-head{overflow: hidden;background: var(--zui-tab-hd-bg, #e1f3ff);display: flex;justify-items: center;padding:var(--zui-tab-hd-pd, 6px 16px);}
.zui-tabs{display: flex;justify-items: center;gap:var(--zui-tab-gap, 16px);flex-direction: row;}
.zui-tab-block{display:none;transition: all ease 0.5s;}
.zui-tab{overflow: hidden;border-radius: var(--zui-tab-br, 5px);cursor: pointer;padding:var(--zui-tab-pd, 5px 10px);transition: all ease 0.5s;}
.zui-tab.zui-act{background: var(--zui-tab-act-bg, #fd9cc8);}
.zui-tab-block.zui-act{display:block}

.zui-tablist{padding:var(--zui-tab-content-pd, 16px);}


/**Public define*/

.zui-background-lgray{background:rgba(246,246,248,1)}
.zui-background-lgray .zui-item .zui-item-frame{background:#fff}

.zui-background-white{background:rgba(255,255,255,1)}
.zui-background-white .zui-item .zui-item-frame{background:rgba(246,246,248,1)}

.zui-no-padding,.zui-itemcard.zui-no-padding{padding:0;}
.zui-no-padding-top,.zui-itemcard.zui-no-padding-top{padding-top:0;}
.zui-no-padding-bottom,.zui-itemcard.zui-no-padding-bottom{padding-bottom:0;}
.zui-no-padding-left,.zui-itemcard.zui-no-padding-left{padding-left:0;}
.zui-no-padding-right,.zui-itemcard.zui-no-padding-right{padding-right:0;}


.zui-title-desc{padding-top:var(--zui-block-padding-top);	padding-bottom:var(--zui-block-padding-bottom);}
.zui-full-frame{
	margin:0 auto;width:87.5vw;max-width: 1650px;
	
}


@media only screen and (max-width:960px)
{
	.zui{
		--zui-head-h2-fontsize: 36px;
		--zui-head-h2-lineheight: 40px;
	}
	.zui-item .zui-item-c >.zui-item-col2{grid-template-columns:1fr}
	.zui-item .zui-item-c >.zui-item-col2 .zui-item-picture >div{padding:0;}
	.zui-item .zui-item-c >.zui-item-col2 .zui-item-content{padding:24px;width:auto}
	
	.zui-item .zui-item-c >.zui-item-col2-pic{grid-template-columns:1fr}
	.zui-item .zui-item-c >.zui-item-col2-pic .zui-item-picture >div{padding:0;}
	.zui-item .zui-item-c >.zui-item-col2-pic .zui-item-content{padding:24px;width:auto}
	
	.zui-two-col .zui-item-card-items,.zui-numcol-2 .zui-item-card-items{
		grid-template-columns: 1fr; grid-template-rows:1fr;grid-auto-flow:row;grid-row-gap: var(--zui-column-gap);
    	row-gap: var(--zui-column-gap);
	}
	.zui-two-col .zui-item .zui-item-frame,.zui-numcol-2 .zui-item .zui-item-frame{width:var(--zui-item-width-all)}
	
	.zui-four-col .zui-item-card-items,.zui-numcol-4 .zui-item-card-items{
		grid-template-columns:1fr 1fr;
	}
	.zui-four-col .zui-item .zui-item-frame,.zui-numcol-4 .zui-item .zui-item-frame{width:var(--zui-item-width-col2)}
	
	.zui-five-col .zui-item-card-items,.zui-numcol-5 .zui-item-card-items{
		grid-template-columns:1fr 1fr;
	}
	.zui-five-col .zui-item .zui-item-frame,.zui-numcol-5 .zui-item .zui-item-frame{width:var(--zui-item-width-col2)}
	
	.zui-six-col .zui-item-card-items,.zui-numcol-6 .zui-item-card-items{
		grid-template-columns:1fr 1fr;
	}
	.zui-six-col .zui-item .zui-item-frame,.zui-numcol-6 .zui-item .zui-item-frame{width:var(--zui-item-width-col2)}
	
	
	.zui-item .zui-item-c >.zui-item-col-n{grid-template-columns: auto;}
}

@media only screen and (max-width:640px)
{
	.zui{
		--zui-column-gap: 20px;
		--zui-block-padding-top:64px;
		--zui-block-padding-bottom:64px;
		--zui-column-gap: 20px;
		--zui-item-padding: 24px;
		--zui-item-padding-end: 24px;
		
		--zui-item-h3-fontsize: 20px;
		--zui-item-h3-fontweight:500;
		
		
		--zui-head-h2-fontsize: 32px;
		--zui-head-h2-fontweight: 500;
		
		--zui-item-radius: 0px;
	}
	.zui-head header{padding-bottom: 16px;display:block;}
	/*
	.zui-head header h2,.zui-head header h2 a,.zui-head header h2 span{font-size: 32px; line-height: 1.071;   font-weight: 500;}
	.zui-head header h3,.zui-head header h3 a,.zui-head header h3 span{font-size: 32px; line-height: 1.071;   font-weight: 500;}
	.zui-head header h1,.zui-head header h1 a,.zui-head header h1 span{font-size: 32px; line-height: 1.071;   font-weight: 500;}
	*/
	.zui-three-col .zui-item-card-items,.zui-numcol-3 .zui-item-card-items{
		grid-template-columns:1fr;
	}
	.zui-three-col .zui-item .zui-item-frame,.zui-numcol-3 .zui-item .zui-item-frame{width:var(--zui-item-width-col1)}
	
	.zui-four-col .zui-item-card-items,.zui-numcol-4 .zui-item-card-items{
		grid-template-columns:1fr;
	}
	.zui-four-col .zui-item .zui-item-frame,.zui-numcol-4 .zui-item .zui-item-frame{width:var(--zui-item-width-col1)}
	
	.zui-five-col .zui-item-card-items,.zui-numcol-5 .zui-item-card-items{
		grid-template-columns:1fr ;
	}

	.zui-five-col .zui-item .zui-item-frame,.zui-numcol-5 .zui-item .zui-item-frame{width:var(--zui-item-width-col1)}
	
	.zui-six-col .zui-item-card-items,.zui-numcol-6 .zui-item-card-items{
		grid-template-columns:1fr ;
	}

	.zui-six-col .zui-item .zui-item-frame,.zui-numcol-6 .zui-item .zui-item-frame{width:var(--zui-item-width-col1)}

	.zui-wrap-full{padding-left:16px;padding-right:16px;}
}


/**zui-sq6*/
.zui-sq6-ui-div{
	width:100%;min-height:200px;position: relative;
	overflow: hidden;

	--w:200px;
	--h: calc(var(--w, 200px));

	height: calc(var(--h, 200px) * 4 + 20px);

	--RB: calc(var(--w) * 0.5);
	--RH: calc(var(--w) * 0.866);
	--RH3: calc(var(--w) * 0.866 * 3);
	--RH2: calc(var(--w) * 0.866 * 2);

	--cw: calc(100%);
	--ch: calc(100%);

	--LB: calc(var(--w) * 0.067 * 2 - 2px);

}
.zui-sq6-ui-div >div.zui-sq6-b{
	position: absolute;
	display: block;
	width:calc(var(--w, 200px));
	height:calc(var(--h, 200px));
	background:linear-gradient(to bottom, #435bd4 0%, #ad60f0 100%);
	overflow: hidden;

	--rcx: calc(var(--cw, 800px) / 2);
	--rcy: calc(var(--ch, 800px) / 2);


	--R: 0px;
	--Cos: 1;
	--Sin: 0;

	--cx: calc(var(--rcx) + (var(--R) * var(--Cos)));
	--cy: calc(var(--rcy) + (var(--R) * var(--Sin)));

	left: calc(var(--cx) - (var(--w, 200px) / 2));
	top: calc(var(--cy) - (var(--h, 200px) / 2));	

	clip-path: polygon(25% 6.69872981%, 0% 50%, 25% 93.301270189%, 75% 93.301270189%, 100% 50%, 75% 6.69872981%);
	
	transition: all ease 0.5s;

	cursor: pointer;
	
	box-sizing: border-box;
	
	z-index: 1;
}
/**Content*/
.zui-sq6-ui-div >div.zui-sq6-b >div{
	display:flex;width:100%;height:100%;overflow: hidden;
	text-align: center;color:#fff;
	flex-direction: column;
	justify-content: center;
}
.zui-sq6-ui-div >div.zui-sq6-b >div h2,.zui-sq6-ui-div >div.zui-sq6-b >div h3{margin:0;padding:0;line-height:1.5;font-size:18px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap}
.zui-sq6-ui-div >div.zui-sq6-b >div p{margin:0;padding:0;line-height:1.2;font-size:14px;color:#efefef;}
.zui-sq6-ui-div >div.zui-sq6-b >div .zui-sq6-ui-desc{display:none}

.zui-sq6-ui-div >div.zui-sq6-c >div h2,.zui-sq6-ui-div >div.zui-sq6-c >div h3{font-size:24px;}

@media only screen and (max-width: 1280px) 
{
	.zui-sq6-ui-div{
		--w:150px;
	}
	.zui-sq6-ui-div >div.zui-sq6-b >div h2{font-size:16px;}
	.zui-sq6-ui-div >div.zui-sq6-b.zui-sq6-c >div h2{font-size:18px;}
}
@media only screen and (max-width: 960px) 
{
	.zui-sq6-ui-div{
		--w:120px;
	}
	.zui-sq6-ui-div >div.zui-sq6-b >div h2{font-size:14px;}
	.zui-sq6-ui-div >div.zui-sq6-b >div p{font-size:12px;}
	.zui-sq6-ui-div >div.zui-sq6-b.zui-sq6-c >div h2{font-size:16px;}

}
@media only screen and (max-width: 720px) 
{
	.zui-sq6-ui-div{
		--w:100px;
	}
	.zui-sq6-ui-div >div.zui-sq6-b >div h2{font-size:12px;}
	.zui-sq6-ui-div >div.zui-sq6-b >div p{font-size:10px;}
	.zui-sq6-ui-div >div.zui-sq6-b.zui-sq6-c >div h2{font-size:14px;}

}
@media only screen and (max-width: 640px) 
{
	.zui-sq6-ui-div{
		--w:80px;
	}
	.zui-sq6-ui-div >div.zui-sq6-b >div h2{font-size:12px;}
	.zui-sq6-ui-div >div.zui-sq6-b >div p{font-size:10px;display:none}
	.zui-sq6-ui-div >div.zui-sq6-b.zui-sq6-c >div h2{font-size:12px;}

}
@media only screen and (max-width: 480px) 
{
	.zui-sq6-ui-div{
		--w:64px;
	}
	.zui-sq6-ui-div >div.zui-sq6-b >div h2{font-size:10px;}

}
@media only screen and (max-width: 398px) 
{
	.zui-sq6-ui-div{
		--w:60px;
	}

}
@media only screen and (max-width: 360px) 
{
	.zui-sq6-ui-div{
		--w:50px;
	}

}
/**Backgrounds*/

.zui-sq6-ui-div >div.zui-sq6-bg1{		
	background:linear-gradient(to bottom, #0d378b 0%, #0d378b 100%);
}
.zui-sq6-ui-div >div.zui-sq6-bg2{
	background:linear-gradient(to bottom, #fd5957 0%, #fd5957 100%);
}
.zui-sq6-ui-div >div.zui-sq6-bg3{		
	background:linear-gradient(to bottom, #36c470 0%, #36c470 100%);
}
.zui-sq6-ui-div >div.zui-sq6-bg4{		
	background:linear-gradient(to bottom, #4b9efe 0%, #4b9efe 100%);
}
.zui-sq6-ui-div >div.zui-sq6-bg5{		
	background:linear-gradient(to bottom, #f44848 0%, #f44848 100%);
}
.zui-sq6-ui-div >div.zui-sq6-bg6{		
	background:linear-gradient(to bottom, #f27620 0%, #f27620 100%);
}
.zui-sq6-ui-div >div.zui-sq6-bg7{background:linear-gradient(to bottom, #c749d5 0%, #8664ed 100%);}
/**方向与半径*/
.zui-sq6-ui-div >div.zui-sq6-s1{
	--Cos: 0.866;
	--Sin: 0.5;

	--R: calc((var(--w, 200px) / 2) * 2 - var(--LB));
}
.zui-sq6-ui-div >div.zui-sq6-s2{
	--Cos: 0;
	--Sin: 1;

	--R: calc((var(--w, 200px) / 2) * 2 - var(--LB));
}
.zui-sq6-ui-div >div.zui-sq6-s3{
	--Cos: -0.866;
	--Sin: 0.5;

	--R: calc((var(--w, 200px) / 2) * 2 - var(--LB));
}
.zui-sq6-ui-div >div.zui-sq6-s4{
	--Cos: -0.866;
	--Sin: -0.5;

	--R: calc((var(--w, 200px) / 2) * 2 - var(--LB));
}
.zui-sq6-ui-div >div.zui-sq6-s5{
	--Cos: 0;
	--Sin: -1;

	--R: calc((var(--w, 200px) / 2) * 2 - var(--LB));
}
.zui-sq6-ui-div >div.zui-sq6-s6{
	--Cos: 0.866;
	--Sin: -0.5;

	--R: calc((var(--w, 200px) / 2) * 2 - var(--LB));	
}

/*相对位置*/
.zui-sq6-ui-div >div.zui-sq6-rs1{		
	--rcx: calc(var(--cw, 800px) / 2 + (var(--R) * 0.866));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--R) * 0.5));


}	
.zui-sq6-ui-div >div.zui-sq6-rs2{		
	--rcx: calc(var(--cw, 800px) / 2 + (var(--R) * 0));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--R) * 1));
}
.zui-sq6-ui-div >div.zui-sq6-rs3{		
	--rcx: calc(var(--cw, 800px) / 2 + (var(--R) * (-0.866)));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--R) * 0.5));
}
.zui-sq6-ui-div >div.zui-sq6-rs4{		
	--rcx: calc(var(--cw, 800px) / 2 + (var(--R) * (-0.866)));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--R) * (-0.5)));
}
.zui-sq6-ui-div >div.zui-sq6-rs5{		
	--rcx: calc(var(--cw, 800px) / 2 + (var(--R) * (0)));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--R) * (-1)));
}
.zui-sq6-ui-div >div.zui-sq6-rs6{		
	--rcx: calc(var(--cw, 800px) / 2 + (var(--R) * (0.866)));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--R) * (-0.5)));
}

.zui-sq6-ui-div >div.zui-sq6-rs16{		
	--rcx: calc(var(--cw, 800px) / 2 + (var(--RB) * 3) + (2px * 2));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--RB) * 0) + 0px);
}

.zui-sq6-ui-div >div.zui-sq6-rs34{		
	--rcx: calc(var(--cw, 800px) / 2 - (var(--RB) * 3) - (2px * 2));
	--rcy: calc(var(--ch, 800px) / 2 + (var(--RB) * 0) + 0px);
}


.zui-sq6-ui-div >div.zui-sq6-b:hover{background:linear-gradient(to right, #c99bf2 0%, #4b43d4 100%);transform: scale3d(1.2, 1.2, 1.2);z-index:3;}

.zui-ani-15s{
	animation-duration: 1.5s !important;
	-webkit-animation-duration: 1.5s !important;
	animation-fill-mode: both !important;
	-webkit-animation-fill-mode: both !important;
}
.zui-ani-10s{
	animation-duration: 1.0s !important;
	-webkit-animation-duration: 1.0s !important;
	animation-fill-mode: both !important;
	-webkit-animation-fill-mode: both !important;
}
@keyframes zui-fade-right
{
	from {
		opacity: 0;
		-webkit-transform: translate(200%,0); 
		transform: translate(200%,0); 
	}
	to {
		opacity:1;
		-webkit-transform: translate(0px,0); 
		transform: translate(0px,0); 
	}
}
@keyframes zui-fade-left
{
	from {
		opacity: 0;
		-webkit-transform: translate(-200%,0); 
		transform: translate(-200%,0); 
	}
	to {
		opacity:1;
		-webkit-transform: translate(0px,0); 
		transform: translate(0px,0); 
	}
}
@keyframes zui-fade-up
{
	from {
		opacity: 0;
		-webkit-transform: translate(0,-200%); 
		transform: translate(0,-200%); 
	}
	to {
		opacity:1;
		-webkit-transform: translate(0px,0); 
		transform: translate(0px,0); 
	}
}
@keyframes zui-fade-down
{
	from {
		opacity: 0;
		-webkit-transform: translate(0,200%); 
		transform: translate(0,200%); 
	}
	to {
		opacity:1;
		-webkit-transform: translate(0px,0); 
		transform: translate(0px,0); 
	}
}
@keyframes zui-fade-scale
{
	from {
		opacity: 0;
		transform: scale3d(0,0,0)
	}
	to {
		opacity:1;
		transform: scale3d(1.2,1.2,1.2)
	}
}
.zui-fade-scale {
	animation-name: zui-fade-scale;
	-webkit-animation: zui-fade-scale;
}
.zui-fade-left {
	animation-name: zui-fade-left;
	-webkit-animation: zui-fade-left;
}
.zui-fade-right {
	animation-name: zui-fade-right;
	-webkit-animation: zui-fade-right;
}
.zui-fade-up {
	animation-name: zui-fade-up;
	-webkit-animation: zui-fade-up;
}
.zui-fade-down {
	animation-name: zui-fade-down;
	-webkit-animation: zui-fade-down;
}

.zui-sq6-ui-con{overflow: hidden;position: relative;background: #e3e3fd}

.zui-sq6-ui-con >.zui-sq6-ui-pop{
	position: absolute;
	--w: max(240px, calc(50%));
	--h: max(180px, calc(70%));
	
	--l: calc((100% - var(--w)) / 2);
	--t: calc((100% - var(--h)) / 2);
	
	left: calc(var(--l));
	top: calc(var(--t));
	
	width: calc(var(--w));
	height: calc(var(--h));
	
	background:#fff;
	border:1px solid #ccc;
	border-radius: 20px;
	
	z-index:4;
	overflow: hidden;
	box-sizing: border-box;
	
	display:none;
}
@media only screen and (max-width: 640px) 
{
.zui-sq6-ui-con >.zui-sq6-ui-pop{
	position: absolute;
	--w: max(240px, calc(90%));
	--h: max(180px, calc(90%));
}

}
.zui-sq6-ui-pop >div{padding:16px;max-height: 100%;overflow: hidden;overflow-y: auto;}
.zui-sq6-ui-pop >span{display:block;position: absolute;right: 15px; top:5px;}
.zui-sq6-ui-close{display:inline-block;width:40px;height:40px;border-radius: 50%;line-height: 40px;text-align: center;background:#6960f8;color:#fff;font-weight: bold;cursor: pointer}

.zui-sq6-ui-pop-text img{max-width: 100%;}
/**zui-sq6-end*/


div.zui-ctls div.zui-field{position:relative;margin-bottom:calc(var(--mb, 16px));}

div.zui-field .zui-label{display:block;clear:both;font-weight: bold;line-height:2;white-space: nowrap;font-size:16px;color:#666;position: relative}

div.zui-field >div.zui-ctl{position:relative;box-sizing: border-box;}
div.zui-field >div.zui-ctl p.errortip{display:none;padding:10px 5px;color:#f00;font-weight: bold;background: #F7D8D8}
div.zui-field >div.zui-ctl p.suctip{display:none;padding:10px 5px;color:#080;font-weight: bold}
div.zui-field >div.zui-ctl .opbtns{position:absolute;line-height:35px;top:1px;bottom:1px;right:16px;max-width: 30%; text-overflow: ellipsis; white-space: nowrap;overflow: hidden}
div.zui-field p.desc{color:#aaa;margin-top:10px}

div.zui-field >div.zui-ctlext{margin-top:5px;overflow: hidden;}

div.zui-ctl{position:relative;box-sizing: border-box;}
div.zui-ctl .resuploadfilec{top:0;bottom:0;}
div.zui-ctl input[type="text"],div.zui-ctl input[type="password"],
div.zui-ctl input[type="date"],div.zui-ctl input[type="time"],div.zui-ctl input[type="number"],
div.zui-ctl input[type="tel"],div.zui-ctl input[type="email"],div.zui-ctl input[type="url"],
div.zui-ctl textarea,div.zui-ctl select,div.zui-ctl.zui-select >div
{
	width:100%;display:block;line-height:1.8;padding:6px 10px;margin:0;
	font-size:calc(var(--font-size, 16px));
	border:1px solid #ccc;border-radius: 3px;box-sizing: border-box;background:#fff;
	color:#111;
}

div.zui-ctl input[type="text"]:focus,div.zui-ctl input[type="password"]:focus,
div.zui-ctl input[type="date"]:focus,div.zui-ctl input[type="time"]:focus,div.zui-ctl input[type="number"]:focus,
div.zui-ctl input[type="tel"]:focus,div.zui-ctl input[type="email"]:focus,div.zui-ctl input[type="url"]:focus,
div.zui-ctl textarea:focus{border:1px solid #0e7fe1;box-shadow: 3px 3px 3px rgba(0,0,0,0.1) inset}

div.zui-upline{position:relative;}
div.zui-upline input[type="file"]{position:absolute;left:0;right:0;top:0;bottom:0;opacity: 0;z-index: 2;}
.zui-upbtn{padding:6px 0px;font-size:calc(var(--font-size, 16px));cursor: pointer;}

div.zui-ctl textarea{height:auto;min-height:40px;padding-top:10px;padding-bottom:10px;}
div.zui-ctl select{opacity: 0;position:absolute;top:0;left:0;right:0;bottom:0;border:none;}
div.zui-ctl.zui-select >div{
	line-height:1.8;padding:6px 10px;font-size:calc(var(--font-size, 16px));
	padding-right:30px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	background:url(/verip_private/eappui/styles/select_arrow.png) no-repeat right 10px top 15px;	
}


div.zui-ctl input[readonly],div.zui-ctl input[disabled],div.zui-ctl select[readonly],
div.zui-ctl select[disabled],div.zui-ctl textarea[readonly],div.zui-ctl textarea[disabled],
div.zui-ctl.zui-select div.disabled{background:#ddd;}
div.zui-ctl.zui-select div.disabled{background:#ddd url(/verip_private/eappui/styles/select_arrow.png) no-repeat right 10px top 15px;}

div.zui-ctl .picpreview{position:absolute;left:0;bottom:0;right:0;top:0}

.zui-line-items{display:flex;align-items: center;gap:10px}

.zui-sub-title{font-weight: bold;font-size:20px;margin-bottom: 30px;line-height: 1.2;}
/**Timeline*/
.zui-timeline {
	position: relative;
	padding-left: 42px;
}

.zui-timeline-light,.zui-light{
	--bg-main: #f7f9fc;
	--bg-card: #ffffff;
	--bg-glass: #f0f4f8;
	--text-primary: #1e293b;
	--text-secondary: #64748b;
	--text-muted: #94a3b8;
	--line-gradient: linear-gradient(180deg, #6366f1, #8b5cf6, #ec4899);
	--shadow-soft: 0 8px 30px rgba(15, 23, 42, 0.08);
	--shadow-hover: 0 12px 40px rgba(99, 102, 241, 0.12);
	--radius-lg: 16px;
	--radius-md: 10px;
	--radius-sm: 6px;
	--status-done: #10b981;
	--status-processing: #3b82f6;
	--status-pending: #f59e0b;
	--status-reject: #ef4444;
}

.zui-timeline::before {
	content: "";
	position: absolute;
	left: 10px;
	top: 0;
	bottom: 0;
	width: 3px;
	background: var(--line-gradient);
	border-radius: 99px;
}

.zui-timeline-item {
	position: relative;
	margin-bottom: 36px;
	animation: fadeSlideUp 0.6s ease-out forwards;
	opacity: 0;
	transform: translateY(20px);
	animation-delay: var(--delay, 0.1s);
}
/*
.zui-timeline-item:nth-child(1) { animation-delay: 0.1s; }
.zui-timeline-item:nth-child(2) { animation-delay: 0.25s; }
.zui-timeline-item:nth-child(3) { animation-delay: 0.4s; }
.zui-timeline-item:nth-child(4) { animation-delay: 0.55s; }
.zui-timeline-item:nth-child(5) { animation-delay: 0.7s; }
*/

@keyframes fadeSlideUp {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.zui-timeline-dot {
	position: absolute;
	left: -42px;
	top: 16px;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #ffffff;
	border: 3px solid #6366f1;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15);
}

.zui-timeline-dot::after {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #6366f1;
}

.zui-timeline-card {
	background: var(--bg-card);
	border: 1px solid rgba(99, 102, 241, 0.08);
	border-radius: var(--radius-lg);
	padding: 24px;
	box-shadow: var(--shadow-soft);
	transition: all 0.3s ease;
}

.zui-timeline-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-hover);
	border-color: rgba(99, 102, 241, 0.18);
}

.zui-card-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 14px;
	flex-wrap: wrap;
	gap: 10px;
}

.zui-event-time {
	font-size: 13px;
	color: var(--text-muted);
	display: flex;
	align-items: center;
	gap: 6px;
}

.zui-event-time svg {
	width: 14px;
	opacity: 0.6;
}
.zui-status-tags {
	display:flex;
	flex-wrap: wrap;
	gap:10px;
}
.zui-status-tag {
	padding: 5px 14px;
	border-radius: 960px;
	font-size: 12px;
	font-weight: 600;
}

.zui-status-done,.zui-status-ok,.zui-status-sure,.zui-status-finish,.zui-status-2,.zui-status-5 {
	background: rgba(16, 185, 129, 0.12);
	color: #059669;
}

.zui-status-processing,.zui-status-0,.zui-status-wait {
	background: rgba(59, 130, 246, 0.12);
	color: #2563eb;
}

.zui-status-pending,.zui-status-1 {
	background: rgba(245, 158, 11, 0.12);
	color: #d97706;
}

.zui-status-reject,.zui-status-3 {
	background: rgba(239, 68, 68, 0.12);
	color: #dc2626;
}
.zui-status-cancel,.zui-status-4 {
	background: rgba(239, 68, 68, 0.12);
	color: #dc2626;
}
.zui-event-title {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 10px;
	color: var(--text-primary);
}

.zui-event-desc {
	font-size: 14px;
	line-height: 1.7;
	color: var(--text-secondary);
	margin-bottom: 20px;
}

.zui-btn-group {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	align-items: center;
}
.menu_copy_items .zui-btn-group {
	padding: 16px 0px;
}
.dataops .zui-btn-group {
	justify-content: flex-end;
}
.zui-btn {
	line-height: 40px;
	height: 40px;
	padding: 0px 14px;
	border-radius: var(--radius-sm);
	font-size: 14px;
	font-weight: 500;
	border: none;
	cursor: pointer;
	transition: all 0.25s ease;
}
/**Small button*/
.zui-btn-s {
	height: 32px;
	padding: 0 12px;
	font-size: 13px;
	font-weight: 400;
	line-height: 32px;

	border-radius: var(--radius-sm);
	cursor: pointer;
	transition: all 0.25s ease;

	vertical-align: middle;
	align-items: center;

	background: linear-gradient(135deg, var(--primary-blue), #3b82f6);
	color: #fff;
	box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}



.zui-btn-blue {
	background: linear-gradient(135deg, var(--primary-blue), #3b82f6);
	color: #fff;
	box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}
.zui-btn-blue:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
}
.zui-btn-red1 {
	background: linear-gradient(135deg, #ef4444, #f87171);
	color: white;
}
.zui-btn-purple {
	background: linear-gradient(135deg, var(--primary-purple), var(--light-purple));
	color: white;
}
.zui-btn-gray {
	background: var(--gray-100);
	color: var(--gray-700);
}
.zui-btn-gray:hover {
	background: var(--gray-200);
}
.zui-btn-lgray {
	background: var(--gray-100);
	color: var(--gray-700);
}
.zui-btn-lgray:hover {
	background: var(--gray-200);
}

.zui-btn-primary,.zui-btn-normal {
	background: linear-gradient(90deg, #6366f1, #8b5cf6);
	color: #fff;
}

.zui-btn-primary:hover,.zui-btn-normal:hover {
	opacity: 0.92;
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(99, 102, 241, 0.25);
}

.zui-btn-secondary,.zui-btn-gray {
	background: var(--bg-glass);
	color: #475569;
	border: 1px solid rgba(99, 102, 241, 0.12);
}

.zui-btn-secondary:hover,.zui-btn-gray:hover {
	background: #e2e8f0;
}

.zui-btn-danger,.zui-btn-red {
	background: rgba(239, 68, 68, 0.12);
	color: #dc2626;
	border: 1px solid rgba(239, 68, 68, 0.18);
}

.zui-btn-danger:hover , .zui-btn-red:hover {
	background: rgba(239, 68, 68, 0.18);
}
.zui-btn-green {
	background: rgba(68, 239, 145, 0.12);
	color: #14e459;
	border: 1px solid rgba(3, 41, 20, 0.329);
}

.zui-btn-green:hover {
	background: rgba(85, 238, 154, 0.12);
}

/**page*/
.page-header {
	margin-bottom: 28px;
	margin-top: 16px;
}
.page-title,.page-header h1 {
	font-size: 26px;
	font-weight: 600;
	background: linear-gradient(90deg, var(--primary-blue), var(--primary-purple));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	letter-spacing: 0.5px;
	padding:0;margin:0;
}
.page-desc {
	margin-top: 6px;
	color: var(--gray-500);
	font-size: 14px;
}

/**通用带阴影的卡片*/
.zui-card {
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	overflow: hidden;
	background: #fff;
	margin-bottom: 28px;
}

.zui-pd20{padding:20px}
.zui-card .istat-echart{padding:16px;}
.zui-searchbar,.zui-card.zui-searchbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;

    gap: 20px;
    padding: 20px;
    background: var(--white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}


.zui-searchbar .search-basic .search-basic-buttons{
	display: flex;
	align-items: center;
}
.zui-search-adv,.search-layout.search-showadv .search-adv.zui-search-adv{
	display:flex;
	gap:10px;
	flex-direction: column;
}

.zui-search-fields{
	display:flex;
	gap:10px;
	flex-wrap: wrap;
	align-items: center;
}
.zui-search-fields  .search-item{
	display:flex;
	flex-direction: column;
	gap: 6px;
}
.search-item >.label,.search-item >span:first-child {
	font-size: 13px;
	text-align: left;
	color: var(--gray-500);
}
.search-item.e40recycle{
	background: none;
}
.search-item >.zui-ctl {
	min-height: 40px;
	padding: 0 0px;
	font-size: 14px;
	transition: var(--transition);
	margin:0;
	margin-bottom: 0px;
	display: flex;
	align-items: center;
	gap:5px;
}
.search-item >input[type=text], .search-item >select,
.search-item .zui-ctl>input[type=text], .search-item .zui-ctl>select ,
.search-item input[type=text],.search-item input[type=number]
{
	width: 160px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--gray-300);
	border-radius: var(--radius-sm);
	font-size: 14px;
	transition: var(--transition);
	background: #fff;
	margin:0;
	margin-bottom: 0px;
}
.search-item input[type=text]:focus, .search-item input[type=number]:focus, .search-item >select:focus,.search-item .ctl>input:focus, .search-item .ctl>select:focus {
	outline: none;
	border-color: var(--primary-blue);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.rowsearch .search-item #q{margin-bottom: 0;}

.zui-search-ctl-btn{display:flex;flex-wrap: wrap;gap:10px;padding-right:50px;align-items: end;}

.zui-mb{margin-bottom: 28px;}
.zui-mb0{margin-bottom: 0px;}

.zui-table,.zui .datagrid{
	border-collapse: collapse;
}
.zui-table thead tr,.zui-table tr.head,.zui .datagrid thead tr,.zui .datagrid tr.head{
	background: linear-gradient(90deg, #f8faff, #faf5ff);
}
.zui-table thead tr td,.zui-table tr.head td,.zui .datagrid thead tr td,.zui .datagrid tr.head td{
	background: none!important;
	background: none;
}
.zui-table tr td,.zui-table.datagrid tr td,.zui .datagrid tr td,.zui .datagrid tr td {
	padding: 18px 14px;
	font-size: 14px;
	line-height: 1.571;
	border-bottom: 1px solid var(--gray-100);
}

.zui-table tr,.zui .datagrid tr {
	transition: var(--transition);
}

.zui-table thead tr th,.zui-table tr.head td,.zui .datagrid thead tr th,.zui .datagrid tr.head td {
	padding: 16px 14px;
	font-weight: 600;
	font-size: 14px;
	color: var(--gray-700);
	border-bottom: 1px solid var(--gray-200);
	border-top: none;
}
.zui .datagrid tr td[align=right]{
	text-align: right;
}

.zui-table tr:hover,.zui .datagrid tr:hover {
	background-color: #f7faff;
}
.zui-table .zui-btn-group,.zui .datagrid .zui-btn-group {
	display: flex;
	gap: 8px;
}

td.dtopcell{width:75px}
/* 复选框美化 */
input[type="checkbox"] {
	width: 16px;
	height: 16px;
	accent-color: var(--primary-purple);
	cursor: pointer;
}
.zui .viewmain .viewbody{padding:32px}
.zui .rbutton , .zui .button{color:#fff}
.zui a.rbutton , .zui a.button{color:#fff}

.zui span.tab{
	display:flex;gap:10px;flex-wrap: wrap;background: none;
	visibility: visible!important;
	
}
.zui span.tab >span{
      font-size: 15px;
      cursor: pointer;
      border-bottom: 3px solid transparent;
      color: var(--gray-500)!important;
      transition: var(--transition);
      font-weight: 500;
      flex-shrink: 0;
	  line-height: 26px;
	  border-top:none!important;
	  background: none;
	  width: auto!important;
	  flex-basis: auto!important;
	  border-right:none!important;
	  transition: all ease 0.5s;
}
.zui span.tab >span a{
	padding: 12px 22px!important;
      font-size: 15px;
      cursor: pointer;
      border-bottom: 3px solid transparent;
      color: var(--gray-500)!important;
}
.zui  span.tab > span > a{padding:0;}
.zui .rowtab{border-bottom: 1px solid var(--gray-200);margin-bottom: 28px;padding-bottom:0;padding:0}

.zui span.tab >span:hover{
	color: var(--primary-blue);
    background-color: var(--gray-100)!important;
	border-bottom-color: var(--primary-blue);
}
.zui span.tab >span:hover a{
	color: var(--primary-blue)!important;
}
.zui span.tab > span.act{
	border-bottom-color: var(--primary-purple);
	color: var(--primary-blue)!important;
}
.zui span.tab  > span.act a{color: var(--primary-blue)!important;}

.zui-card.rowsearch,.zui-card.rowsearch.rowtab{
	padding:20px;background: var(--white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
	border-bottom: none;
}

@media (max-width: 640px) {
	.zui-timeline {
		padding-left: 30px;
	}

	.zui-timeline-dot {
		left: -30px;
		width: 20px;
		height: 20px;
	}

	.zui-timeline-dot::after {
		width: 8px;
		height: 8px;
	}


	.zui-timeline-card {
		padding: 18px;
	}

	.zui-searchbar .rowsearch {
        text-align: left;
    }
	.zui .viewmain .viewbody,.zui .viewmain .viewbody{
		padding:8px;
	}

	.zui span.tab{justify-content: space-between;}

	.zui span.tab >span a{
		padding: 5px 6px!important;
		font-size:14px;
		line-height: 20px;
	}
}