/** 
--- 功能: 所有模块化的样式
--- 日期: 2025-03-28
--- by: xwq
**/



/*******************  一. 股票(chinastock)  *******************/



/** ##.1.股市：页面主导航组件 **/
.twonav{
	display: flex;
}
.twonav .tnleft{flex: 1;}
.twonav .layui-nav{
	padding: 0;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}
.twonav .layui-nav .layui-nav-more{
	right: 14px;
}
.twonav .layui-bg-gray {
	background-color: none!important;
	color: #5f5f5f!important;
}
.twonav .layui-nav .layui-nav-item {
	line-height: 46px;
	margin-right: 15px;
	}
.twonav .layui-nav .layui-nav-item a{
	font-size: 16px;  
	padding: 0 20px;
}
/* 当a标签包含i标签时 */
.twonav .layui-nav .layui-nav-item a:has(> i) {
	padding-right: 30px;
  }
.twonav .layui-nav .layui-nav-item a:not(:has(> i)) {

}


.twonav .layui-nav .layui-nav-item:hover{
	background-color: var(--text-005-color);
	transition: all .2s;
	-webkit-transition: all .2s;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}
.twonav .layui-nav .layui-this{
	background: rgba(78,70,180,0.1);
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}
.twonav .layui-nav .layui-this a{
	color: rgba(78,70,180,1);
}
.twonav .layui-nav .layui-this:after, 
.twonav .layui-nav-bar {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0px;
	background-color: var(--text-005-color);
	transition: all .2s;
	-webkit-transition: all .2s;
	pointer-events: none;
}
.twonav .ntflag{ width: 34px; display: inline-block;}
.twonav .ntflag img{ width: 100%; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
.twonav .ntmark{
	font-size: 16px;
}
.twonav .ntnavt{
	font-size: 16px;
}

.twonav .ntname{
	font-size: 16px;
}
.twonav .layui-nav-child{
	min-width: 500px;
	top: 56px;
	border: 1px solid var(--text-005-color);
	box-shadow: 0 60px 120px 0 rgba(13,13,13,.04);
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}

.twonav .tnright{
	padding-top: 6px;
	width: 300px; 
}
.twonav .tnright .layui-input{

}
.twonav .tnright .tosearch{
	display: flex;
} 


/** ##.2.弹框：选择地区 **/ 
.fgchoose{padding: 20px; }
.fgtitle{
	font-size: 13px;
	letter-spacing: 1px;
}
.fglist{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}
.fglist .item{display: flex; padding: 10px 0; cursor: pointer;}
.fglist .item:hover{background: var(--text-005-color);}
.fglist .item .thumb{width: 30px;}
.fglist .item .thumb img{ width:100%; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; }
.fglist .item .info{ margin-left: 6px;}
.fglist .item .info .fgcn{
	font-size: 16px;
	font-weight: bold;
	line-height: 20px;
}
.fglist .item .info .fgen{
	font-size: 12px;
	line-height: 20px;

}


/** ##.3.弹框：选股器/产业研究/指数 共用 **/  
.fgpicker{  display: grid; grid-template-columns: repeat(5, 1fr); padding: 20px 0;}

.fgpicker .pickeritem{width: 160px;overflow: hidden; padding: 0 20px; border-right: 1px solid var(--tag-gray-line-color);}
.fgpicker .pickeritem:last-child{border-right: none;}

.pickeritem .pktitle {display: flex; justify-content: left; 
	align-items: center; }
.pickeritem .pktitle .icon{
	background: rgba(78,70,180,0.06);
	width: 36px;
	height: 36px;
	margin-right: 6px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}
.pickeritem .pktitle .icon i{ font-size: 20px;}
.pickeritem .pktitle .name{font-size: 16px;}

.pickeritem .pklist{ padding-bottom: 15px; margin-top: 10px;}
.pickeritem .pklist a{font-size: 14px!important; padding: 0!important;white-space: nowrap;     
	overflow: hidden;       
	text-overflow: ellipsis;  }
.pickeritem .pklist a:hover{
	background:rgba(78,70,180,0.15)!important;
	padding: 0 10px!important;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}

 
.pickeritem .pktitle .flag{ 
	width: 30px;
	height: 30px;
	margin-right: 6px;
	display: flex;
	justify-content: center;
	align-items: center; 
}
.pickeritem .pktitle .flag img{ width: 100%;}
.pickeritem .pkindexlist{ padding-bottom: 15px; margin-top: 10px;}
.pickeritem .pkindexlist a{font-size: 14px!important; padding: 6px 0!important;white-space: nowrap;     
	overflow: hidden;       
	text-overflow: ellipsis;  }
.pickeritem .pkindexlist a:hover{
	background:rgba(78,70,180,0.15)!important;
	padding: 6px 10px!important;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}
.pickeritem .pkindexlist .i1{font-size: 14px; line-height: 24px;}
.pickeritem .pkindexlist .i2{font-size: 12px; line-height: 16px;}





.fgindexitem{padding: 6px 0px!important;}
.fgindexitem .i1{font-size: 14px; line-height: 20px;}
.fgindexitem .i2{font-size: 12px; line-height: 14px;}

/** ##.4.弹框：行业 **/   
.fgindustry{  display: grid; grid-template-columns: repeat(3, 1fr); padding: 10px 0;}
.fgindustry .fgindsitem{width: 160px;overflow: hidden; padding: 0 20px; border-right: 1px solid var(--tag-gray-line-color);}
.fgindustry .fgindsitem:last-child{border-right: none;}

.fgindsitem .layui-colla-icon{
	position: absolute;
	left: unset!important;
	right: 0px!important;
	top: 0;
	font-size: 14px;
	}
.fgindsitem .layui-colla-title {
		position: relative;
		height: 42px;
		line-height: 42px;
		padding: 0 0px;
		color: #333;
		background: none!important;
		cursor: pointer;
		font-size: 14px;
		overflow: hidden;
		}
.fgindsitem .layui-collapse{
	border: none;
}
.fgindsitem .layui-colla-item{
	border: none;
	margin: 7px 0;
}
.fgindsitem .layui-colla-item:hover{ background: rgba(78,70,180,0.07); border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; }
.fgindsitem .layui-colla-content{
	border: none;
	padding: 0;
}
.institle{
	display: flex; justify-content: left; align-items: center; 
}
.institle .icon{
	background: rgba(78,70,180,0.07);
	width: 42px;
	height: 42px;
	margin-right: 6px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}
.institle .icon i{ font-size: 20px;}
.institle .name{font-size: 16px;}
.inslist a{font-size: 14px!important; padding: 6px 0!important;white-space: nowrap;     
	overflow: hidden;       
	text-overflow: ellipsis;  }
.inslist a:hover{
	background:rgba(78,70,180,0.15)!important;
	padding: 6px 10px!important;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}






/** ##.5.股市：页面中的标题(普通版) **/    
.onetitle{
	display: flex;
	font-size: 20px;
	padding: 18px 0px;
	letter-spacing: 1px;
	color: var(--text-08-color);
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}
.onetitle .ctl{flex: 1; color: var(--text-07-color); font-weight: bold;}
.onetitle .ctr{font-size:12px; text-align: right; height: 25px; line-height: 25px;  position: relative; color: var(--text-07-color);}
.onetitle .ctr button{position: absolute; top: -15px; right: -12px;}
.onetitle .ctr b{color: var(--text-06-color);}
.onetitle .ctr a{color: var(--text-06-color);}
.onetitle .ctr em{color: var(--cxui-a-color); font-style: normal;}



/** ##.6.股市：页面中的标题(普通版) **/    
.onetitlebase{
	display: flex;
	font-size: 20px;
	padding: 18px 0px;
	letter-spacing: 1px;
	color: var(--text-08-color);
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}
.onetitlebase .ctl{flex: 1; color: var(--text-07-color); font-weight: bold;}
.onetitlebase .ctr{font-size:12px; text-align: right; height: 25px; line-height: 25px;  position: relative; color: var(--text-07-color);}
 

/** ##.7.股市：页面中的标题（复杂版） **/     
.onetitlepro{display:flex;font-size:20px;padding:18px 0;letter-spacing:1px;color:var(--text-08-color);border-radius:4px}
.onetitlepro .ctl{flex: 1; }
 
.onetitlepro .profilter{display: flex; justify-content: left; align-items: center;}
.onetitlepro .stktitle{color: var(--text-07-color); font-weight: bold;}

.onetitlepro .stkcase{margin-left: 10px; margin-right: 15px;}
.onetitlepro .stkcase .casename{ border: 1px solid #ddd; height: 30px; line-height: 30px; padding: 6px 8px 6px 12px; cursor: pointer; display: flex; justify-content: left; align-items: center; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
.onetitlepro .stkcase .casename:hover{ background: #f1f3f5;}
.onetitlepro .stkcase .casename span{font-size: 18px; font-weight: bold;}

.onetitlepro .stkoperate{display: flex; justify-content: left; align-items: center; }
.onetitlepro .stkoperate .cdptips{background:#fff;border:1px solid #f3f5f5;border-radius:50%;margin-right:10px;width:40px;height:40px;font-size:18px}




.onetitlepro .ctr{font-size:12px; text-align: right; height: 25px; line-height: 25px;  position: relative; color: var(--text-07-color);}
.onetitlepro .ctr button{position: absolute; top: 6px; right: 0px;}
.onetitlepro .ctr b{color: var(--text-06-color);}
.onetitlepro .ctr a{color: var(--text-06-color);}
.onetitlepro .ctr em{color: var(--cxui-a-color); font-style: normal;}

/** 弹窗的效果**/
.prodropera { width: 220px; background: #fff; border-radius: 6px; box-shadow: 0 60px 120px 0 rgba(13,13,13,.04); }

	.droplist{padding:8px 0}
	.droplist a,.tobuilt{display:flex;align-items:center;padding:8px 12px;color:#333;text-decoration:none;transition:background-color .2s}
	.droplist a:hover,.tobuilt:hover{background-color:#f5f5f5}
	.droplist .icon{font-size:18px;margin-right:8px;color:#555;display:flex;align-items:center}
	.droplist .name{font-size:15px}

	.droprecently{border-top:1px solid #e0e0e0;padding:8px 0}
	.droprecently .tit{padding:8px 12px;font-size:12px;color:#888}
	.droprecently .recenlist{display:flex;flex-direction:column}
	.droprecently .recenlist a{padding:8px 12px;font-size:15px;color:#333;text-decoration:none;display:flex;align-items:center}
	.droprecently .recenlist a:hover{background-color:#f5f5f5}
	.droprecently .recenlist a .icon{margin-right:8px}
	.droprecently .tobuilt{margin-top:8px;text-align:center;cursor:pointer;color:#1a73e8}
	.droprecently .tobuilt .icon{color:#1a73e8}
	
 
	
/** 估值用户的方案统一处理**/
.guzhicase{margin-left: 10px; margin-right: 15px;}
.gzhy{background: var(--cxui-btn-type-background);color: var(--cxui-btn-type-text-color);border: 1px solid var(--cxui-btn-type-line-color);}
.gztj{background-color: var(--cxui-btn-warm-background); color: var(--cxui-btn-warm-text-color);}
.gzyh{background: var(--cxui-btn-subs-background); color: var(--cxui-btn-subs-text-color);border: 1px solid var(--cxui-btn-subs-line-color);}
 

.gzcasename{ border: 1px solid #ddd;   padding: 8px 8px 8px 10px; cursor: pointer; display: flex; justify-content: left; align-items: center; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
.gzcasename:hover{ background: #f1f3f5;}
.gzcasename .type{ font-size: 12px; padding: 4px 6px;  margin-right: 10px; border-radius:4px;}
.gzcasename .name{ font-size:16px;color:#333;text-decoration:none; }



.gzdropercase {width: 320px; background: #fff; border-radius: 6px; box-shadow: 0 60px 120px 0 rgba(13,13,13,.04); }
.gzdrocase{border-top:1px solid #e0e0e0;padding:8px 0}
.gzdrocase .tit{padding:8px 12px;font-size:12px;color:#888} 
.gzdrocase .recenlist{display:flex;flex-direction:column}
.gzdrocase .recenlist a{padding:8px 12px; text-decoration:none;display:flex;align-items:center}
.gzdrocase .recenlist a:hover{background-color:#f5f5f5}
.gzdrocase .recenlist a .icon{margin-right:8px} 
.gzdrocase .recenlist .type{ font-size: 12px; padding: 4px 6px;  margin-right: 10px; border-radius:4px;}
.gzdrocase .recenlist .name{ font-size:16px;color:#333;text-decoration:none; }






/** ##.股市：K线图-多种切换 **/ 
.kchartool{display: flex;  }
.lefswitch{flex: 1;}
.kchartool i{font-size: 16px;}
.rigsetting{width: 200px; text-align: right;}









/** ##.股市详情页：公司介绍组件**/
.stkcompany .toper{
	/**display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;**/
	display: flex;
	margin-bottom: 10px;
}
.stkcompany .toper .item{ margin-right: 20px;display: flex; align-items: center;}
.stkcompany .toper .item .icon{
	display: grid; 
	align-items: center; 
	text-align: center;
	background: #f1f3f4;
	height: 30px;
	line-height: 30px;
	width: 30px;	
	margin-right: 6px;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-ms-border-radius:4px;
	-o-border-radius:4px;
}
.stkcompany .toper .item .icon i{ 
	font-size: 20px;
	color: var(--text-06-color);
}
.stkcompany .toper .item .name span{ 
	margin-right: 10px; 
	display: inline-block;
	height: 30px;
	line-height: 30px;font-size: 16px; opacity: 0.8; }
.stkcompany .toper .item .info{ 
	font-size: 16px;height: 30px;
	line-height: 30px;}
.stkcompany .toper .item .info a{ font-size: 16px;}
.stkcompany .intro{margin-top: 16px;}
.stkcompany .intro .text{ font-size: 16px; line-height: 26px; text-align: justify;}

 


/** ##.股市详情页：关键数据组件 **/
 
.stkeydata {
	color: white;
	column-count: 3; /* 列数 */
	column-gap: 20px; /* 列间距 */
}
.stkeydata .keycard {
	background: var(--bgmain2-color);
	display: inline-block;
	width: 100%;
	padding: 20px;
	break-inside: avoid;
	/*防止内容被分割到不同列*/box-sizing: border-box;
	margin-bottom: 20px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
}
.stkeydata .keycard  .title {
	font-weight: bold;
	margin-bottom: 12px;
	color: var(--text-08-color);
	font-size: 16px
}
.stkeydata .keycard  .row {
	display: flex;
	justify-content: space-between;
	margin: 8px 0;
	padding: 4px 0;
}
  
.stkeydata .keycard  .label {
	flex: 1; 
	color: var(--text-06-color);
}

.stkeydata .keycard  .value {
	flex: 1;
	text-align: right;
	color: var(--text-09-color);
	font-family: Consolas, monospace;
}


/** ##.行业详情：行业名称**/
.inTypeToper{ 
	margin-bottom: 5px;
}

.intypewarp{
margin-top: 12px;
display: flex;
align-items: center;
}

.intypewarp .intyicon {
display: flex;
align-items: center;
flex: 1;
}

.intypewarp .intyicon .hyicon {
display: flex;
align-items: center;
justify-content: center;
background: var(--text-005-color);
height: 68px;
width: 68px;
margin-right: 10px;
border-radius: 100%;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
-ms-border-radius: 100%;
-o-border-radius: 100%;
}
.intypewarp .intyicon .hyicon .ti {
font-size: 36px;
color: var(--text-07-color);
}
.intypewarp .intyicon .hyinfo .hyname{
font-size: 28px;
font-weight: bold;
}
.intypewarp .intytool{
width: 100px;
}

.intypedes{
	margin-top: 10px;
	font-size: 16px;
	line-height: 26px;
	margin-left: 0px;
}





/***主框架..二级导航***/
.secondnav{
	display: block;
}
.secondnav .csitem{
	display: inline-block;
    background: var(--btgp-normal-bg);
    color: var(--text-08-color);
    border: 1px solid var(--text-01-color);
    margin-right: 12px;
    padding: 12px 28px;
    border-radius: 6px;
    font-size: 15px;
}
.secondnav .csitem:hover {
    opacity: .8;
    filter: alpha(opacity=80); 
    border: 1px solid var(--btgp-active-bg);
	color:var(--btgp-active-bg);
}
.secondnav .active{
    background: var(--btgp-active-bg);
    color: var(--whiter-color);
    border: 1px solid var(--text-02-color);
}
.secondnav .active:hover{
	background: var(--btgp-active-bg);
    color: var(--whiter-color);
    border: 1px solid var(--text-02-color);
}

/***主框架..三级导航***/
.thirdnav{
	display: block;
}
.thirdnav .csitem{
    display: inline-block;
    background: var(--btgp-normal-bg);
    color: var(--text-08-color);
    border: 1px solid var(--text-01-color);
    margin-right: 8px;
    margin-bottom: 8px;
    padding: 10px 24px;
    border-radius: 4px;
    font-size: 15px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}
.thirdnav .csitem:hover {
    opacity: .8;
    filter: alpha(opacity=80); 
    border: 1px solid var(--btgp-active-bg);
	color:var(--btgp-active-bg);
}
.thirdnav .active{
    background: var(--btgp-active-bg);
    color: var(--whiter-color);
    border: 1px solid var(--text-02-color);
}
.thirdnav .active:hover{
	background: var(--btgp-active-bg);
    color: var(--whiter-color);
    border: 1px solid var(--text-02-color);
}
 

/***主框架..四级导航--简单筛选***/
.fournav{
	display: block;
}
.fournav .csitem{
    display: inline-block;
    background: var(--btgp-normal-bg);
    color: var(--text-08-color);
    border: 1px solid var(--text-01-color);
    margin-right: 8px;
    margin-bottom: 8px;
    padding: 6px 14px;
    border-radius: 4px;
    font-size: 15px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}
.fournav .csitem:hover {
    opacity: .8;
    filter: alpha(opacity=80); 
    border: 1px solid var(--btgp-active-bg);
	color:var(--btgp-active-bg);
}
.fournav .active{
    background: var(--btgp-active-bg);
    color: var(--whiter-color);
    border: 1px solid var(--text-02-color);
}
.fournav .active:hover{
	background: var(--btgp-active-bg);
    color: var(--whiter-color);
    border: 1px solid var(--text-02-color);
}
 


/** 2.搜索效果（search）**/
.search-reminder { width: 500px; position: relative; display: inline-block; }
.search-reminder .ti{font-size:16px; top: -2px; color: var(--text-08-color);} 
.seare-dropdown{ display: none; width: 100%;position: absolute;  top: 38px;
  border: 1px solid rgba(0,0,0,0.05);
  box-shadow: 0 60px 120px 0 rgba(13,13,13,.04); 
  background:var(--bgmain-search-color); border-radius: 6px; height: 300px; overflow-y: auto; z-index: 1; }

.seare-dropdown.show { display: block; }
.seare-dropdown .tipsimg{width: 220px; margin: 10px auto 0;}
.seare-dropdown .tipsimg img{width: 100%; text-align: center;}
.seare-dropdown .tipstit{text-align: center; font-size: 16px; font-weight: bold; margin-bottom: 8px;}
.seare-dropdown .tipsdes{text-align: center; font-size: 14px; color: #333;}
.seare-dropdown .seahistory{padding: 10px;}
.seare-dropdown .shtit{ color: rgba(var(--cdp-main-rgb), 0.9);font-size: 14px; font-weight: bold; margin-bottom: 12px; height: 36px; line-height: 36px; position: relative;}
.seare-dropdown .shtit .ti{position: absolute; right: 0; top: 10px; cursor: pointer;}
.seare-dropdown .shlist span{background: #f2f4f5; color: #333; padding: 4px 8px; border-radius: 4px; margin-right: 10px; margin-bottom: 10px; border-radius: 20px;}
.seare-dropdown .shlist_indiv span{background: #f2f4f5; color: #333; padding: 4px 8px; border-radius: 4px; margin-right: 10px; margin-bottom: 10px; border-radius: 20px;}


.search-stock-list .scl-item{display: flex; padding: 0px 20px; border-bottom: 1px solid #f2f4f5; height: 58px; } 
.search-stock-list .scl-item:hover{ background: #f2f4f5;}
.search-stock-list .scl-item .ca{flex: 3;}
.search-stock-list .scl-item .cb{flex: 1;font-size: 15px;  white-space: nowrap; display: flex; align-items: center;}
.search-stock-list .scl-item .cc{flex: 1;font-size: 15px; white-space: nowrap; display: flex; align-items: center; }
.search-stock-list .scl-item .ca .tit{font-size: 15px; font-weight: bold; margin-top: 8px;}
.search-stock-list .scl-item .ca .base{margin-top: 4px; font-size: 11px;}
.search-stock-list .scl-item .ca .base .jys{ padding: 4px; background: #f2f4f5; margin-right: 8px;}
.search-stock-list .scl-item .ca .base .code{font-size: 13px;}

.search-chain-list .chi-item{display: flex; padding: 12px 20px; border-bottom:  1px solid var(--text-005-color);; }
.search-chain-list .chi-item:hover{ background: var(--hover-background); cursor: pointer;}
.search-chain-list .chi-item .ca .t1{color: rgba(var(--cdp-main-rgb), 0.8);	background: rgba(var(--cdp-base-rgb), 0.2); font-size: 12px; padding: 2px 4px; margin-right: 6px;}
.search-chain-list .chi-item .ca .t2{color: rgba(var(--cdp-main-rgb), 0.8);	background: rgba(var(--cdp-base-rgb), 0.2); font-size: 12px; padding: 2px 4px; margin-right: 6px;}
.search-chain-list .chi-item .ca .tit{ color: rgba(var(--cdp-main-rgb), 0.9); font-size: 15px; font-weight: bold; margin-top: 8px;}


.search-dropdown{  border: 1px solid rgba(0,0,0,0.05);
	box-shadow: 0 60px 120px 0 rgba(13,13,13,.04);
	background:var(--bgmain-search-color);}




/** 选股器：基础-筛选条件 **/
.selectnav{
	display: flex;
}
.selectnav .tnleft{flex: 1;}
.selectnav .tnleft .layui-bg-gray{background: none!important;}
.selectnav .layui-nav{
	padding: 0;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}
.selectnav .layui-nav .layui-nav-more{
	right: 14px;
}
.selectnav .layui-bg-gray {
	color: #5f5f5f!important;
}
.selectnav .layui-nav .layui-nav-item {
	line-height: 40px;
	border: 1px solid var(--text-005-color);
	background: #fff;
	margin-right: 10px;
	margin-bottom: 10px;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}
.selectnav .layui-nav .layui-nav-item a{
	font-size: 16px;
	color: #000;
	padding: 0 30px 0 20px;
}
.selectnav .layui-nav .layui-nav-item:hover{
	background-color: var(--text-005-color);
	transition: all .2s;
	-webkit-transition: all .2s;
}
.selectnav .layui-nav .layui-this{
	background: rgba(78,70,180,0.1);
}
.selectnav .layui-nav .layui-this a{
	color: rgba(78,70,180,1);
}
.selectnav .layui-nav .layui-this:after, 
.selectnav .layui-nav-bar {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0px;
	background-color: var(--text-005-color);
	transition: all .2s;
	-webkit-transition: all .2s;
	pointer-events: none;
}
 
.selectnav .layui-nav-child{
	min-width: 300px;
	top: 46px;
	padding: 0;
	z-index: 99999999;
	border: 1px solid var(--text-005-color);
	box-shadow: 0 60px 120px 0 rgba(13,13,13,.04);
	border-radius: 6px; 
}  
.selectnav .layui-input, .selectnav .layui-select, .selectnav .layui-textarea{height: 43px; line-height: 43px; border: none;}
.selectnav .layui-form-item{margin-bottom: 0;}
.selectnav .layui-inline{margin-bottom: 0; margin-right: 0;}
.selectnav .layui-form-item .layui-input-inline{margin-right: 0;}
.selectnav .layui-form-mid{margin: 0 10px!important;}


.selectnav .tnright{
	width: 126px;
	text-align: right;
	height: 60px;
}
.selectnav .tnright button{ height: 42px;}


.selconwarp {
	background: #fff;
	border-radius: 6px;
  }
.selconwarp .seltit {
	padding: 0px 16px;
	font-size: 12px;
	line-height: 34px;
	color: #888;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.5px;
  }
  
  .selconlist {
	border-top: 1px solid #eeeeee;
	padding: 8px 0;
  }
  
  .seltypetext {
	display: flex;
	flex-direction: column;
  }
  
  .seltypetext a {
	display: flex;
	align-items: center;
	padding: 10px 16px;
	color: #333!important;
	text-decoration: none;
	transition: background-color 0.2s;
	font-size: 15px;
	position: relative;
  }
   
  .seltypetext a:hover {
	background-color: #f5f5f5;
  }
  
  .seltypetext a span {
	display: inline-block;
	margin-right: 8px;
  }
  .seltypetext a span:nth-child(1){ font-weight: bold;}
  .seltypetext a span:nth-child(2){font-size: 12px;}

  .seltypetext .acitve span,
  .seltypetext .acitve i{
	color: var(--cxui-a-color);
  }
  .seltypetext a i {
	position: absolute;
	right: 18px;
	top: 10px;
	font-size: 18px;
  }
  .seltypeform{padding: 0 30px 0 20px;}
  .seltypeform .layui-form-checkbox{display: block; margin: 12px 0;}

  .selcontool {
	border-top: 1px solid #e0e0e0;
	display: flex;
	justify-content: space-between;
  }
  .selcontool a{
	display: flex!important; 
	justify-content: center; 
	align-items: center; 
	padding: 10px 0!important;
	color: #333;
	text-decoration: none;
	transition: background-color 0.2s;
	font-size: 15px;
	flex: 1;
	border-right: 1px solid #e0e0e0;
  }
  .selcontool a:last-child{
	border-right: none;
  }
  .selcontool a:hover {
	background-color: #f5f5f5;
  }
  .selcontool .icon {
	margin-right: 4px; 
  }
  .selcontool .icon i{
	font-size: 20px;
	color: #333!important;
  }
  .selcontool .name {
	font-size: 15px;
	color: #333!important;
  }
  
 



/** 选股器：Pro-高级筛选条件 **/

/** 此处注意：
最外层如果不需要滚动条，就要设置高度并hidden滚动条
 **/

.stcfilterwarp{	height: 600px; overflow: hidden;}

.stctitle{  position: sticky; top: 0; background: #e8e8e8; padding: 10px 15px; z-index: 2;display: flex; justify-content: left; align-items: center; border-top-left-radius: 6px; border-top-right-radius: 6px; }
.stctitle .leftinfo{flex: 1;display: flex; justify-content: left; align-items: center; } 
.stctitle .leftinfo .ttclose{
  background: #fff;
  margin-right: 12px;
  cursor: pointer;
  height: 32px;
  width: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
} 
.stctitle .leftinfo .ttclose i{ font-size: 20px;} 
.stctitle .leftinfo .ttclose:hover{ background: #f1f2f3;} 
.stctitle .leftinfo .ttname{font-size: 18px;} 
.stctitle .rightbut{width: 400px; text-align: right;}
.stctitle .rightbut button{margin-left: 15px;}


 /* 弹窗容器样式 */
 .no-outer-scroll-container {
	display: flex;
	height: 600px;
	overflow: hidden; 
}
.scroll-panel {
	box-sizing: border-box;
	height: 100%;
	overflow-y: auto; 
	position: relative;
}
.left-panel {
	padding: 15px;
	border-right: 1px solid #e6e6e6;
	width: 300px;
	padding-bottom: 70px;
}
.right-panel {
	flex: 1;
	background-color: #fff;
	padding-bottom: 70px;
}
.panel-content {
	min-height: 100%; 
}
 
/**左侧筛选导航**/
.stknav .active{background: #ececec;} 
.stksearch{ margin-bottom: 10px;}
.stknavlist .typeitem{ border-bottom: 0px solid #f3f4f5; margin: 15px 0; }
.stknavlist .typeitem:hover{background: #ececec;} 
.stknavlist .typewarp{display:flex;align-items:center;gap:10px}
.stknavlist .typewarp .icon{display:flex;justify-content:center;align-items:center}
.stknavlist .typewarp .iconbg{display:flex;justify-content:center;align-items:center;
	width:52px;height:52px;background:#f5f5f5;
        border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px}
.stknavlist .typewarp .iconbg i{font-size:20px}
.stknavlist .typewarp .info{flex:1}
.stknavlist .typewarp .info .name{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.stknavlist .typewarp .info .name .tit{font-size:14px;font-weight:500}
.stknavlist .typewarp .info .name .num{font-size:11px;color:#FF9F43; background: rgba(255, 159, 67, 0.16); padding: 2px 5px;}
.stknavlist .typewarp .info .des{font-size:12px;color:#999}


/**右侧内容列表**/
.stkcont{ position: relative; } 
.stkcont .content-block { margin-bottom: 20px;}
.stkcont .contoper{ display: flex; padding:10px; background: #f1f2f3; border-radius:4px ; -webkit-border-radius:4px ; -moz-border-radius:4px ; -ms-border-radius:4px ; -o-border-radius:4px ; }
.stkcont .contoper .contit{flex: 1;display:flex;justify-content:left;align-items:center }
.stkcont .contoper .contit .icon{display:flex;justify-content:center;align-items:center; margin-right: 6px;}
.stkcont .contoper .contit .iconbg{display:flex;justify-content:center;align-items:center;
									width:32px;height:32px;background:#fff;
        							border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px}
.stkcont .contoper .contit .iconbg i{font-size:16px}
.stkcont .contoper .contit .name{font-size: 16px; font-weight: bold;}
.stkcont .contoper .tool{ width: 200px; text-align: right; }

.stkcont .contlist{margin-top: 10px; padding: 0 15px;}
.stkcont .contlist .layui-form{display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;}
.stkcont .contlist .cont-item .cititle{display: flex; height:26px; line-height: 26px; padding: 0 10px;}
.stkcont .contlist .cont-item .cititle .lftit{flex: 1;}
.stkcont .contlist .cont-item .cititle .lftit span{ color: var(--text-05-color);}
.stkcont .contlist .cont-item .cititle .rgtool{ width: 30px; text-align: right; display: none;}
.stkcont .contlist .cont-item .cititle .ti{ cursor: pointer; color: var(--text-04-color);}
.stkcont .contlist .cont-onecol{grid-column: 1 / -1; /**需要一行展示**/ }

.stkcont .layui-form-item{margin-bottom: 0;}
.stkcont .layui-form-item .layui-inline{margin-bottom: 0;}
.numinterval{ display: flex;}
.numinterval .cfinput{width: 400px;}
.numinterval .rgrang{flex: 1;margin-top: 15px;}



/** 产业研究 **/




/** 3.典型组件（typical）**/
.stkdown{
	color: #28c76f;
}
.stkup{
	color: #ea5455;
}

.tyhotindex{display: grid;grid-template-columns: repeat(6, 1fr);gap: 20px;}
.index-item{ border: 1px solid var(--text-01-color); padding: 10px; background: var(--bgmain2-color); border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px;}
.index-item:hover{border: 1px solid var(--primary-color);}
.index-item .name{font-size: 18px; font-weight: 700;color: var(--text-08-color);}
.index-item .total{margin-top: 4px;}
.index-item .total .t1{font-size: 16px; font-weight: 500;}
.index-item .price{margin-top: 8px;}
.index-item .price .t3{margin-right: 10px;}







/*******************  二. 股票详情页 *******************/


/***0,股票公共部分***/
/** ##.股市详情页：股票核心信息组件**/

.stkheader{margin-bottom: 20px;}

.numlevel1{font-size: 40px;}
.numlevel2{font-size: 22px;}
.numlevel3{font-size: 18px;}
.digit{font-family: HarmonyOS_Sans_Bold;}

 
.stktoper{display: flex;}
.stktoper .namelf{ flex: 1; display: flex;}
.stktoper .namelf .logo{margin-right: 20px; width: 80px;}
.stktoper .namelf .logo img{ width: 100%; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -ms-border-radius:100%; -o-border-radius:100%; }

.stktoper .namelf .info .core{ display: flex; align-items: flex-end;  margin-bottom: 12px;}
.stktoper .namelf .info .core .abbrev{ font-size: 28px; height: 34px; margin-right: 10px; font-weight: 600;}

.stktoper .other .area{background: #d0efff;font-size: 12px; padding: 2px 4px; margin-right: 4px;}
.stktoper .other .code{margin-right: 8px;}
.stktoper .other .flag{display: inline-block; width: 16px;}
.stktoper .other .flag img{width: 100%;}
.stktoper .other .exchange{margin-right: 6px;}
.stktoper .other .industry{ margin-right: 2px; padding: 4px 2px 4px 8px;}
.stktoper .other .industry:hover{background: #ecf9ff;}
.stktoper .other .plate{cursor: pointer;padding: 4px 2px 4px 8px;}
.stktoper .other .plate:hover{background: #ecf9ff;}



.stktoper .induswarp{display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;  width: 380px;}
.stktoper .induswarp .indcard{ background: #f1f2f3; padding: 10px 12px; display: flex;}
.stktoper .induswarp .indcard .cdtit{flex: 1;}
.stktoper .induswarp .indcard .cdtit .cd1{font-size: 15px;}
.stktoper .induswarp .indcard .cdtit .cd2{font-size: 12px;}
.stktoper .induswarp .indcard .cdnum{width: 80px;text-align: right;}



.stktoper .stkdata .lina{ display: flex; align-items: flex-end; margin: 10px 0;}
.stktoper .stkdata .lina .price{margin-right: 14px;display: flex; align-items: flex-end;}
.stktoper .stkdata .lina .price .now{margin-right:6px;height: 30px; line-height: 30px; }
.stktoper .stkdata .lina .price .unit{font-size: 14px;}
.stktoper .stkdata .lina .icon{margin-right: 10px;}
.stktoper .stkdata .lina .icon i{font-size: 20px;}
.stktoper .stkdata .lina .nums{margin-right: 10px; height: 20px;}
.stktoper .stkdata .lina .stkend{color: rgba(var(--cdp-main-rgb), 0.6); font-size: 12px;}
.stktoper .stkdata .linb{color: var(--text-07-color); display: flex;} 
.stktoper .stkdata .linb .text1{margin-right: 15px;}
.stktoper .stkdata .linb .text2{margin-right: 10px;}



.stktoper .namerg{} 
.stktoper .mychoose{margin-bottom: 12px;}
.stktoper .mychoose i{font-size: 14px; }
.stktoper .mychoose button{margin-left: 8px;}
.stktoper .tosearch{ }
.stktoper .tosearch .search-reminder{width: 100%; display: flex; justify-content: right; align-items: center;}

.stktoper .setags{width: 300px;}
.stktoper .colortag .title{font-size: 14px; margin-bottom: 6px;}
.stktoper .colortag .list{display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px;}
.stktoper .colortag .list a{padding: 4px; text-align: center;}
.stktoper .colortag .list a:hover{background: #f2f3f4;}
.stktoper .colortag .list i{ font-size: 18px;}
.stktoper .colortag .list .check{ background: #f2f3f4;}
.stktoper .customize{margin-top: 8px;}
.stktoper .customize .title{font-size: 14px; margin-bottom: 6px;}
.stktoper .customize .list a{ display: inline-block;
			height: 24px; line-height: 24px;
			font-size: 13px; color: var(--text-06-color);
			padding: 0px 8px; margin-bottom: 10px; margin-right: 10px;
			border: 1px solid #b4b4b4; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; }
.stktoper .customize .tool{margin-top: 6px;}
.stktoper .customize .list .check{ background: #f2f3f4; border: 1px solid #f2f3f4;}


 
/***1,股票详情页-主导航***/

.cnstockDetop{ display: flex; justify-content: left; align-items: center;}
.cnstockDetop .cnstocknav{ flex: 1; } 
.cnstockDetop .cnstocknav .comdetNav .twoNitem{height: 50px; line-height: 50px;}
.cnstockDetop .cntoguzhi{width: 140px;display: flex; justify-content: right; align-items: center;}

.cnstocktwoNav{ display: flex;  flex-wrap: wrap; gap: 15px; }
.cnstocktwoNav a{ text-align: center; padding: 6px 20px;  display: inline-block; border: 1px solid var(--text-01-color); color: var(--text-08-color); border-radius:20px;}
.cnstocktwoNav a:hover{ background: var(--bgmain2-hover-color);}
.cnstocktwoNav a.noallowed{ color: var(--text-05-color); border: 1px solid var(--text-005-color); pointer-events: none;}
 



/***0,股票公共部分***/


/* a 各模版主标题 */
.mkone-title{display: flex; justify-content: left; align-items: center; height: 24px; line-height: 24px; margin-bottom: 10px;}
.mkone-title .lfinfo{flex:1;  padding-left: 0px;display: flex;  justify-content: left; align-items: center; }
.mkone-title .lfinfo .name{font-size: 18px; font-weight: bold;  color: rgba(var(--cdp-main-rgb), 1);  }
.mkone-title .lfinfo .tips{font-weight: 400; margin-left: 4px; margin-right: 6px; font-size: 13px; color: rgba(var(--cdp-main-rgb), 0.7); margin-top: 2px;  line-height: 24px;}

.mkone-title .rgset{ display: flex; justify-content: right; align-items: center; }
.mkone-title .rgset .layui-form-item{margin-bottom: 0;}
.mkone-title .rgset .layui-form-item{ margin-bottom: 0;}
.mkone-title .rgset .layui-form-radio{margin: 0 10px 0 0; padding-right: 0;}
.mkone-title .rgset .layui-form-radio>i{margin-right: 4px; font-size: 18px;}

.mkone-title .rgset .titoperate .cdptips{ background: #f1f3f4; height: 30px; width: 30px; margin-left: 10px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
.mkone-title .rgset .titoperate .cdptips .ti{font-size: 16px;}

/* b 各模版子标题 */
.mktwo-title{display: flex; justify-content: left; align-items: center; padding: 12px 15px; border-bottom: 1px solid rgba(var(--cdp-main-rgb), 0.05);}
.mktwo-title .lfinfo{flex:1;  padding-left: 0px;display: flex;  justify-content: left; align-items: center; }
.mktwo-title .lfinfo .name{font-size: 18px; font-weight: bold;  color: rgba(var(--cdp-main-rgb), 1);   }
.mktwo-title .lfinfo .tips{font-weight: 400; margin-left: 4px; margin-right: 6px; font-size: 13px; color: rgba(var(--cdp-main-rgb), 0.7); margin-top: 2px;  line-height: 24px;}
.mktwo-title .rgset{ display: flex; justify-content: right; align-items: center; }
.mktwo-title .rgset .layui-form-item{margin-bottom: 0;}
.mktwo-title .rgset .layui-form-item{ margin-bottom: 0;}
.mktwo-title .rgset .layui-form-radio{margin: 0 10px 0 0; padding-right: 0;}
.mktwo-title .rgset .layui-form-radio>i{margin-right: 4px; font-size: 18px;}
.mktwo-title .rgset .titoperate .cdptips{ background: #f1f3f4; height: 30px; width: 30px; margin-left: 10px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
.mktwo-title .rgset .titoperate .cdptips .ti{font-size: 16px;}

.morelink{font-size: 12px; opacity: 0.88;}
 
/* c 模块框架 */
.mkone-content{ min-height: 40px;}
.mktwo-content{ min-height: 40px;}


/* d 核心数据 */
.madata-container{ display: flex; flex-wrap: wrap; gap: 20px; font-size: 15px;}
.madata-container .leftcolumn{background: var(--text-005-color);  padding: 8px 20px; border-radius: 8px; width: 600px;}
.madata-container .leftcolumn .malabel{ width: 110px!important;  color: #666;  color: var(--text-06-color); }
.madata-container .leftcolumn .mavalue{ text-align: left!important; }

.madata-container .rightcolumn{ background: var(--text-005-color); padding: 8px 20px; border-radius: 8px; flex: 1; display: flex; flex-wrap: wrap; gap: 30px;}
.madata-container .madata-column{flex: 1;}

.madata-container .madata-item {margin: 8px 0; display: flex; justify-content: left; align-items: center; }
.madata-container .madata-item .malabel{ width: 140px; color: #666;  color: var(--text-06-color); }
.madata-container .madata-item .malabel i{font-size: 18px; margin-right: 4px;}
.madata-container .madata-item .mavalue{ flex: 1; text-align: right;  color: var(--text-08-color)}







/** ##.1.杜邦分析图 **/
 .dupont-title{background: #f5f5f5;}
 .dupont-title .layui-inline{margin-bottom: 0;}
        /* 主容器 */
        .dupont-container { 
          margin: 0 auto;
            width: 1200px;
            height: 680px;
            padding-bottom: 50px;
            position: relative;
            background-color: #fff; 
            overflow: hidden;
        }
        
        /* 流程图容器 */
        .flow-container {
            position: relative;
            width: 100%;
            height: 100%;
            background-image: url('../../img/dupont.png');
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
        }
        
        /* 节点基础样式 */
        .dpnode {
            position: absolute;  
            background-color: rgba(255, 255, 255, 0.7);
            border: 1px solid #ddd;
            border-radius: 5px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            box-sizing: border-box; 
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }
        
        .dpnode-title {   
            background-color: rgba(173, 216, 230, 0.7); 
            font-size: 12px;
            font-weight: bold;  
            padding: 4px;
            border-radius: 5px 5px 0 0; 
            display: flex;
            flex-wrap: wrap; 
            align-items: center;
            justify-content: center;
            text-align: center; 
            white-space: normal; 
            word-break: break-word; 
        }
        
        /* 节点标题 */
        .dpnode-tita{height: 24px; padding: 0 6px;}
        .dpnode-titb{min-width: 120px;}
        .dpnode-titc{width: 80px; height: 40px;}
        .dpnode-titd{width: 80px; height: 40px;}
        .dpnode-tite{width: 80px; height: 24px; }




        .dpleft-content {
            font-size: 12px;
            text-align: center; 
            width: 100%;
        }
        .dpleft-content .value{
          font-size: 14px;
          color: #ffae00;
          background:#fff;
          height: 20px;
          line-height: 20px;
            border-radius: 0 0 5px 5px ; 
        }
        .dpleft-content .number{
          font-size: 14px; 
          background:#f5f5f5;
          color: #222; 
          height: 20px;
          line-height: 20px; 
            border-radius: 0 0 5px 5px ;  
        }




        /* 节点定位 */
.dptopa{top:0;}
        .dpleft-a1{left:50%;transform:translateX(-50%)}
.dptopb{top:16%;}
        .dpleft-b1{top:16%;left:22%}
        .dpleft-b2{top:16%;left:44.6%}
        .dpleft-b3{left:67.6%}
.dptopc{top:31%;}
        .dpleft-c1{left:23.3%}
        .dpleft-c2{left:34.8%}
        .dpleft-c3{left:46.4%}
        .dpleft-c4{left:58%}
        .dpleft-c5{left:70%}
        .dpleft-c6{left:81%}
.dptopd{top:50%;}
        .dpleft-d1{left:0%}
        .dpleft-d2{left:12%}
        .dpleft-d3{left:23%}
        .dpleft-d4{left:34.5%}
        .dpleft-d5{left:46%}
        .dpleft-d6{left:58%}
        .dpleft-d7{left:69.4%}
        .dpleft-d8{left:81%}
        .dpleft-d9{left:92%}
.dptope{top:66%;}
        .dpleft-e1{left:5.6%}
        .dpleft-e2{left:17%}
        .dpleft-e3{left:29%}

.dptopf{top:86%;}
        .dpleft-f1{left:5.6%}
        .dpleft-f2{left:17%}
        .dpleft-f3{left:29%}


        /* 响应式调整 */
        @media (max-width: 768px) {
            .dupont-container {
                width: 95%;
                height: 70vh;
            }
            
            .dpnode {
                width: 100px;
                height: 70px;
            }
            
            .dpnode-title {
                font-size: 12px;
            }
            
            .dpleft-content {
                font-size: 10px;
            }
        }
















/*******************  二. 估值助手(guzhi)  *******************/

 

 #casefixetop {
  position: sticky;
  top: 0;
  z-index: 999999; 
  padding: 0 7.5px;
  margin-bottom: 5px;
} 
 #casefixetop .onetitlepro{
	background-color: #fff;
	padding: 10px;
	border-bottom: 0px solid #f2f2f2;
	box-shadow: 0 -1px 12px 0 rgba(0,0,0,0.08);
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
}

.gzbottom {
	position: fixed;
	bottom: 0; 
	left: 0;
	right: 0;
	box-sizing: border-box; 
	z-index: 999999;
}
.gzfixedwarp{
	max-width: 1440px;
	margin: 0 auto;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	background-color: #fff;  
	border-top: 0px solid #D9DADC; 
	box-shadow: 0 -1px 12px 0 rgba(0,0,0,0.08); 
	 
}
.gzfixedwarp .process-title{ padding: 10px 20px;}

.avg-cont{display:flex;gap:20px; padding: 0px 20px 10px;}
.avg-cont .card{ flex:1; display: flex; justify-content: center; align-items: center; text-align: center; padding: 10px 0; border-radius: 4px; }

.avg-cont .card:nth-child(1){background: #e3f2fd;}
.avg-cont .card:nth-child(2){background: #e8f5e9;}
.avg-cont .card:nth-child(3){background: #ffebee;}
.avg-cont .card:nth-child(4){background: #f3e5f5;}

.avg-cont .card .title{ border-right: 1px solid #ddd; width: 60px; }
.avg-cont .card .title .name{color:#222; font-weight: bold; font-size:12px;}
.avg-cont .card .title .icon{ margin-top: 4px; padding: 2px 4px;}
.avg-cont .card .title .icon i{ background: #fff; font-size: 18px;}

.avg-cont .card .grid{display: grid; grid-template-columns: repeat(5, 1fr);}
.avg-cont .card .item{display:flex;flex-direction:column;align-items:center}
.avg-cont .card .label{color:#444;font-size:12px;margin-bottom:4px}
.avg-cont .card .value{color:#2c3e50;font-weight:700;font-size:15px}


/*********** 1. 可比公司法 ***********/


/** ##.估值头部区域**/
 

.guzhitoper{display: flex;}
.guzhitoper .namelf{ flex: 1; display: flex;}
.guzhitoper .namelf .logo{margin-right: 10px; width: 60px;}
.guzhitoper .namelf .logo img{ width: 100%; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -ms-border-radius:100%; -o-border-radius:100%; }

.guzhitoper .namelf .info{margin-right: 15px;}
.guzhitoper .namelf .info .core{ display: flex; align-items:center;  margin-top: 2px; margin-right: 6px;}
.guzhitoper .namelf .info .core .abbrev{ font-size: 20px; font-weight: 500; margin-right: 6px;}
.guzhitoper .namelf .info .core .other .code{ font-size: 15px;}
.guzhitoper .namelf .info .stkdata{display: flex; height: 28px;}
.guzhitoper .namelf .info .stkdata .lina{ display: flex; align-items:center;}
.guzhitoper .namelf .info .stkdata .lina .icon{margin-right: 4px;}
.guzhitoper .namelf .info .stkdata .lina .icon i{ margin-top: -2px;   font-size: 20px; display: inline-block;}
.guzhitoper .namelf .info .stkdata .lina .price{ margin-right: 10px;}
.guzhitoper .namelf .info .stkdata .lina .price .now{font-size: 24px; font-weight: bold;}
.guzhitoper .namelf .info .stkdata .lina .price .unit{font-size: 14px;}
.guzhitoper .namelf .info .stkdata .lina .nums{  font-size: 16px; margin-top: 6px; margin-right:10px;}

.guzhitoper .namelf .info .stkdata .linb{ color: var(--text-07-color); display: flex;} 
.guzhitoper .namelf .info .stkdata .linb .gztips{ height: 24px; line-height: 24px; margin-top: 5px;} 
.guzhitoper .namelf .info .stkdata .linb .gztips .cxtlshowcont{text-align: center;}
 
.guzhitoper .namelf .info .stkprice{color: #ff9f43; margin-top: 4px;}
.guzhitoper .namelf .info .stkprice .now{font-size: 16px;}


.guzhitoper .namelf .switch{padding-top: 12px;} 
.guzhitoper .namerg{margin-top: 12px;}
.guzhitoper .namerg .thirdnav .csitem{ margin-right: 0; margin-left: 15px;}


/** ##.估值场景区域**/
 
/* 自定义每个 div 的宽度 */
.gzw1 { flex: 0 0 10%; text-align: left;} /* 估值法 */
.gzw2 { flex: 0 0 13%; text-align: center;} /* 标的PS */
.gzw3 { flex: 0 0 25%;  text-align: center;} /* 溢价水平 */
.gzw4 { flex: 0 0 15%; text-align: center;} /* 估算股价 */
.gzw5 { flex: 0 0 15%; text-align: center;} /* 估算市值 */
.gzw6 { flex: 0 0 22%; } /* 推荐场景 */

.gzscene { display: flex; width: 100%; }
.gzscene .topitem { box-sizing: border-box;}
 
/* 估值场景统一header */
.gzcardtop{ background: #f1f3f4; border-radius: 4px; margin-bottom: 5px;}
.gzcardtop .topitem{padding: 10px 0; text-align: center;}
.gzcardtop .toptitle{text-align: center;}
.gzcardtop .toptitle .name{display: flex; justify-content: center; align-items: center; }
.gzcardtop .toptitle .name .title{font-size: 16px; font-weight: bold;}
.gzcardtop .toptitle .name .cdptips{ margin-left: 4px;}
.gzcardtop .toptitle .name .cdptips i{  font-size: 16px;}
.gzcardtop .toptitle .des{font-size: 12px; margin-top: 2px;}


/* 估值场景单独card */
.gzcarditem{padding: 8px 0;}
.gzcarditem .cdptips{ background: #f2f3f4; border-radius:2px ; padding: 4px; margin-left: 6px; -webkit-border-radius:2px ; -moz-border-radius:2px ; -ms-border-radius:2px ; -o-border-radius:2px ; }
.gzcarditem:hover{background: #f2f3f4;}

.gzname{line-height: 34px; font-weight: bold; font-size: 16px; padding-left: 10px;}
.gzobject{display: flex; justify-content: center; align-items: center; }
.gzobject .default .layui-input{width: 100px; text-align: center; padding-left: 0;}
.gzobject .default{position: relative;}

.gzpremium{display: flex; justify-content: center; align-items: center; }
.gzpremium .layui-form-item{margin-bottom: 0;}
.gzpremium .layui-form-item .layui-inline{margin-bottom: 0; margin-right: 0;}
.gzpremium .layui-form-mid{padding: 7px 0!important; margin: 0 6px!important;}
.gzpremium .layui-input-inline{margin-right: 0; position: relative;}
.gzpremium .layui-input{text-align: center; padding-right:24px; padding-left: 0;}

.gznumbs{line-height: 34px; font-size: 18px;} 
.gznumbs em{margin: 0 1px;}
.gznumbs span{}
.gznumbs.price{color: #f03d3f;}
.gznumbs.market{color: #ff9f43;}

.gzsecne {display: flex; justify-content: center;  align-items: center; }
.gzsecne .text { flex: 1; line-height: 34px; height: 34px; max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gzsecne .more {  width: 78px;}
 
.notips{opacity: 0.6; pointer-events: none;transition: none !important; animation: none !important;}


/* 没有权限 */
.gzlimit .gzobject{ opacity: 0.6;}
.gzlimit .gzobject .locked{display: block!important; position: absolute; top: 7px; right: 4px;}
.gzlimit .gzobject .locked i{font-size: 18px;}
.gzlimit .gzobject .layui-input{pointer-events: none; padding-right: 10px;}
.gzlimit .gzpremium{opacity: 0.6;}
.gzlimit .gzpremium .layui-input-inline .locked{display: block!important; position: absolute; z-index: 9; top: 7px; right: 4px;}
.gzlimit .gzpremium .layui-input-inline .locked i{font-size: 18px;}
.gzlimit .gzpremium .layui-input-inline .layui-input-affix{display: none;}
.gzlimit .gzpremium .layui-input-inline .layui-input{pointer-events: none; padding-right: 10px;}
.gzlimit .cdptips{pointer-events: none;transition: none !important; animation: none !important;}









/* 0、各板块的操作序号 */
.process-step{position: absolute; top:22px; left: 0px;}
.process-step i{font-size: 30px; color: rgba(var(--cdp-main-rgb), 0.14);}

/* 对比条件筛选 */ 
.guzhirange{display: flex; justify-content: left; align-items: center; margin-top: 10px; margin-bottom: 5px; } 
.guzhirange .csitem{margin-bottom: 0;}


/* 1、各步骤的标题 */
.process-title{display: flex; justify-content: left; align-items: center; height: 24px; line-height: 24px;}
.process-title .lfinfo{flex:1;  padding-left: 0px;display: flex;  justify-content: left; align-items: center; }
.process-title .lfinfo .name{font-size: 18px; font-weight: bold;  color: rgba(var(--cdp-main-rgb), 1);  }
.process-title .lfinfo .tips{font-weight: 400; margin-left: 4px; margin-right: 6px; font-size: 13px; color: rgba(var(--cdp-main-rgb), 0.7); margin-top: 2px;  line-height: 24px;}

.process-title .rgset{ display: flex; justify-content: right; align-items: center; }
.process-title .rgset .layui-form-item{margin-bottom: 0;}
.process-title .rgset .layui-form-item{ margin-bottom: 0;}
.process-title .rgset .layui-form-radio{margin: 0 10px 0 0; padding-right: 0;}
.process-title .rgset .layui-form-radio>i{margin-right: 4px; font-size: 18px;}

.process-title .rgset .titoperate .cdptips{ background: #f1f3f4; height: 30px; width: 30px; margin-left: 10px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
.process-title .rgset .titoperate .cdptips .ti{font-size: 16px;}


/* 2、对比条件筛选 */ 
.guzhicompare{margin-top: 0px;}
.guzhicompare .layui-tabs-body{ padding: 0;}
.guzhicompare .layui-tabs-item{padding: 0;}

.gzways{ margin-right: 580px;}
.gzcase{display: flex; justify-content: left; align-items: center; margin-top: 5px; } 
	
/* 对比方式切换 */
.casenav{background: #fff;}
.casenav .layui-tabs-header:after, 
.casenav .layui-tabs-scroll:after{border-bottom: none;}
.casenav .layui-tabs-header{ border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
.casenav .layui-tabs-header li{min-width: 116px; font-size: 15px; font-weight: 400; }
.casenav .layui-tabs-header .layui-this{ background: #d5d2ff; color: #4e46b4; font-weight: bold;}
.casenav .layui-tabs-header .layui-this:after{border-bottom: none;}
.casenav .layui-tabs-header li:nth-child(1){border: 1px solid #dfdfdf; border-right: none;border-top-left-radius:4px; border-bottom-left-radius: 4px;}
.casenav .layui-tabs-header li:nth-child(2){border: 1px solid #dfdfdf; border-left: none;border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
.casenav .layui-tabs-header .layui-this, 
.casenav .layui-tabs-header li:hover{ color: #4e46b4;}

/* 选择公司范围--暂时没有用到 */
.gzcomper{  height: 32px;  display: flex; justify-content: left; align-items: center; background: #fff4f4; border: 1px solid #ffe2e2; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; }
.gzcomper .textitem{padding-left: 10px;}
.gzcomper .markitem{margin-left: 10px;}
.gzcomper .markitem .layui-form-item{ margin-bottom: 0;}
.gzcomper .markitem .layui-form-radio{margin: 0 10px 0 0; padding-right: 0;}
.gzcomper .markitem .layui-form-radio>i{margin-right: 4px; font-size: 18px;}


/* 对比行业/对比方案切换管理 */
.filercase{  position: absolute; top: 1px; left: 272px; }
.filercase .topexplace{display: flex; justify-content: left; align-items: center; }

.topself .topthis{padding: 0 12px; background: #d5d2ff; color: #4e46b4; height: 40px; line-height: 40px; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; }

.topmanage{display: flex; justify-content: left; align-items: center; margin-left: 10px; }
.topmanage .cdptips{  background: #fff;
    border: 1px solid #f3f5f5;
    border-radius: 50%;
    margin-right: 6px;
    width: 40px;
    height: 40px;
    font-size: 18px;
}
 

/* 添加公司/筛选条件 1 */
.filerset{ }
.filercard{margin-top: 20px;}
.filercard .filname{  display: flex; justify-content: left; align-items: center; font-weight: bold; position: relative;}
.filercard .filname .icon{background: #f1f3f4; border-radius: 2px; padding: 4px; margin-right: 6px; }
.filercard .filname .icon i{font-size: 15px;}
.filercard .filname .name{font-size: 16px;  color: rgba(var(--cdp-main-rgb), 0.8); padding-left: 4px;}
.filercard .filname .tips{font-weight: 400; margin-left: 4px; font-size: 13px; color: rgba(var(--cdp-main-rgb), 0.7); line-height: 16px;
position: absolute; right: 0;}


.filercard .filcont{} 
.filercard .filcont .layui-nav-item{line-height: 32px; margin-right: 15px; margin-top: 10px; margin-bottom: 0;}
.filercard .filcont .selectnav .layui-nav-child{top: 36px;} 
.filercard .filcont  .layui-input, .filercard .filcont  .layui-select, .filercard .filcont .layui-textarea{height:32px; line-height: 32px;}
.filercard .filcont .selectnav .layui-nav .layui-nav-item a { padding: 0 20px 0 10px;}
.filercard .filcont .selectnav .layui-nav .layui-nav-more{right: 6px;}

.selectmark{margin-top: 10px;}
.selectmark .layui-form-item{margin-bottom: 0;}
.selectmark .layui-form-item{ margin-bottom: 0;}
.selectmark .layui-form-radio{margin: 0 10px 0 0; padding-right: 0; line-height: 18px;}
.selectmark .layui-form-radio>i{margin-right: 4px; font-size: 18px;}

.layui-form-radio:hover>*, .layui-form-radioed, .layui-form-radioed>i {
	color: var(--btgp-active-bg);
}

/* 添加公司/筛选条件 2 */
.fileritem{  display: flex; justify-content: left; align-items: center; position: relative;  }

.fileritem .filname{  margin-right: 8px;margin-top: 10px; }
.fileritem .filname .name{font-size: 15px;  color: rgba(var(--cdp-main-rgb), 0.8);}

.fileritem .filcont{}
.fileritem .filcont .layui-nav-item{line-height: 32px; margin-right: 15px; margin-top: 10px; margin-bottom: 0;}
.fileritem .filcont .selectnav .layui-nav-child{top: 36px;} 
.fileritem .filcont  .layui-input, .fileritem .filcont  .layui-select, .fileritem .filcont .layui-textarea{height:32px; line-height: 32px;}
.fileritem .filcont .selectnav .layui-nav .layui-nav-item a { padding: 0 20px 0 10px;}
.fileritem .filcont .selectnav .layui-nav .layui-nav-more{right: 6px;}

.filbutton{margin-top: 10px;}


/* 3、对比过程 */ 
 

/* 表格上方操作工具 */
.filertool{ margin-bottom: 10px; display: flex;  }
.filertool .tooleft{flex: 1; display: flex; justify-content: left; align-items: center;  }

.filertool .tooleft .filname{display: flex; justify-content: left; align-items: center; font-weight: bold;}
.filertool .tooleft .filname i{background: #f1f3f4; font-size: 18px; border-radius: 2px; padding: 4px; margin-right: 6px; }
.filertool .tooleft .filname em{ font-style: normal; font-weight: bold;}

.filertool .toolright{flex: 1; display: flex; justify-content: right; align-items: center;}

.filertool .tooleft button{margin-right: 10px;}
.filertool .toolright button{margin-left: 10px;}

/* 表格上方筛选条件 */
.gzfliter{  display: flex; justify-content: left; align-items: center; position: relative; margin-bottom: 10px;  }
 
.gzfliter .filcont{}
.gzfliter .filcont .layui-nav-item{line-height: 32px; margin-right: 15px; margin-top: 10px; margin-bottom: 0;}
.gzfliter .filcont .selectnav .layui-nav-child{top: 36px;} 
.gzfliter .filcont  .layui-input, .gzfliter .filcont  .layui-select, .gzfliter .filcont .layui-textarea{height:32px; line-height: 32px;}
.gzfliter .filcont .selectnav .layui-nav .layui-nav-item a { padding: 0 20px 0 10px;}
.gzfliter .filcont .selectnav .layui-nav .layui-nav-more{right: 6px;}
 

/* 表格中样式优化*/



/* 4、对比结果 */ 
.topresult{
	 position: absolute;
	 top: 0px;
	 right: 0px;
	 z-index: 99;
	 width: 560px;
	 margin-left: 20px;
}

.resultwarp{ padding:0px;}


.gzresultable{ margin-top: 15px; 
	background: rgba(var(--cdp-red-rgb), 0.1);
	border-radius:6px ;}
.gzresultable table{width:100%;border-collapse:collapse}
.gzresultable td,
.gzresultable th{border:0px solid #eee;padding:9px 12px;text-align:left}
.gzresultable th{background-color:#f2f2f2;position:sticky;top:0}
.gzresultable thead th{background:#f1f2f4; padding: 13px 15px;}
.gzresultable .cdptips{ background: #fff; padding: 4px; border-radius:2px ; }

.gzresultable tr th:nth-child(2){text-align:center}
.gzresultable tr td:nth-child(2){text-align:center}
.gzresultable tr th:nth-child(3){text-align:center}
.gzresultable tr td:nth-child(3){text-align:center}
.gzresultable tr th:nth-child(4){text-align:center}
.gzresultable tr td:nth-child(4){text-align:center}
.gzresultable tr th:nth-child(5){text-align:center}
.gzresultable tr td:nth-child(5){text-align:center}





/*********** 2. 现金流折算 ***********/


/* 1、流程切换标题 */ 
.valstepheader{ background: #f1f2f4; padding: 10px 20px; display:flex;justify-content:left;align-items:center}
.valstepheader .lfintro{flex: 1; font-size: 18px; font-weight: bold;}
.valstepheader .rgtool{flex: 1; display:flex;justify-content:right;align-items:center}


/* 2、流程切换 */ 
.cxflut1-tolabeling{background: #fff;  margin: 0 auto; padding: 20px;}
 

:root{--step-active-color:#4e46b4;
	--step-inactive-color:#e6e6e6;
	--step-completed-color:#665fcf;
	--step-text-color:#333;
	--step-active-text-color:#fff;
	--cxflut1-step-title-color:#999;
	--step-active-title-color:#4e46b4;
	--cxflut1-step-connector-height:2px
}
.cxflut1-step-container{position:relative}
.cxflut1-stepbutton{position:absolute;bottom:0;right:0}
.cxflut1-step-header{display:flex; padding: 0 60px 15px;}
.cxflut1-step-item{flex:1;text-align:center;position:relative}
.cxflut1-step-number{display:inline-block;width:30px;height:30px;line-height:30px;border-radius:50%;background-color:var(--step-inactive-color);color:var(--step-text-color);margin-bottom:5px;position:relative;z-index:1}
.cxflut1-step-item.completed .cxflut1-step-number{background-color:var(--step-completed-color);color:var(--step-active-text-color)}
.cxflut1-step-item.active .cxflut1-step-number{background-color:var(--step-active-color);color:var(--step-active-text-color)}
.cxflut1-step-title{font-size:14px;color:var(--cxflut1-step-title-color)}
.cxflut1-step-title span{ font-size: 12px; margin-left: 4px; background: var(--step-inactive-color); padding: 2px 4px; border-radius:2px ; -webkit-border-radius:2px ; -moz-border-radius:2px ; -ms-border-radius:2px ; -o-border-radius:2px ; }
.cxflut1-step-item.completed .cxflut1-step-title{color:var(--step-completed-color)}
.cxflut1-step-item.active .cxflut1-step-title{color:var(--step-active-title-color);font-weight:700}
.cxflut1-step-content{min-height:200px; padding: 0 20px;}

.cxflut1-step-connector{position:absolute;top:15px;left:-50%;width:100%;height:var(--cxflut1-step-connector-height);background-color:var(--step-inactive-color);z-index:0}
.cxflut1-step-item.active .cxflut1-step-connector,.cxflut1-step-item.completed .cxflut1-step-connector{background-color:var(--step-completed-color)}
.cxflut1-step-item:first-child .cxflut1-step-connector{display:none}
.cxflut1-step-pane{display:none}
.cxflut1-step-pane.active{display:block}





/* 2、头部的数据汇总 */ 
.valuatop-title{ background: #f2f3f4;}
.valuatop-title .gzname{ font-size: 18px; font-weight: bold; color: rgba(var(--cdp-main-rgb), 1);}

.valcomtopheight{
	height: 140px; overflow: hidden;
}
.comparison-container {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
.method {
	text-align: center;
}
.method .method-title {
	font-weight: bold;
	font-size: 18px; 
}
.method .price {
	font-size: 30px;
	font-weight: bold;
	color: #FF8C00; 
	margin-top: 15px;
}
.method .price-label {
	margin-top: 7px;
	font-size: 12px;
	color: #666; 
}
.method .premium {
	background-color: #f0f0f0;
	padding: 8px 12px;
	border-radius: 4px; 
	font-size: 14px;
	margin-top: 16px;
}
.method .premium-value {
	color: #FF0000;
	font-weight: bold;
}



.parameters-container {
	display: grid;
	grid-template-columns: repeat(2, 1fr); 
}
.parameter{
	text-align: center;
	padding: 10px 0;
	border-bottom: 1px solid rgba(var(--cdp-main-rgb), 0.1); 
	border-right: 1px solid rgba(var(--cdp-main-rgb), 0.1);
} 
.parameter:nth-child(2){  border-right: none;}
.parameter:nth-child(3){  border-bottom: none;}
.parameter:nth-child(4){  border-bottom: none; border-right: none;}
 
.parameter .par-name {
	color: rgba(var(--cdp-main-rgb), 0.9);
	font-size: 16px; 
}
.parameter .par-value {
	color: #FF8C00;
	font-size: 24px;
	margin-top: 5px;
	font-weight: bold;
} 



.interpret-container{
}
.intinfo{
	font-size: 15px;
	color: rgba(var(--cdp-main-rgb), 0.9);
	margin-bottom: 6px; 
	line-height: 22px;
	text-align: justify;
}

.note {
	font-size: 13px;
	color: var(--text-05-color);
	font-style: italic;
}

 

/* 3、各流程中的内容 */ 




.restitle{font-size: 20px; margin-top: 20px;}
 

.cxflut1-inputtable table{width:100%;border-collapse:collapse}
.cxflut1-inputtable td,.cxflut1-inputtable th{border:1px solid #eee;padding:4px 8px;text-align:left}
.cxflut1-inputtable th{background-color:#f2f2f2;position:sticky;top:0}
.cxflut1-inputtable tr:nth-child(even){background-color:#f9f9f9}
.cxflut1-inputtable thead th{background:#f1f1f1}
.cxflut1-inputtable tr th:nth-child(1){text-align:left;width:240px}
.cxflut1-inputtable tr td:nth-child(1){text-align:left;width:240px}
.cxflut1-inputtable tr th:nth-child(2){text-align:left;width:130px}
.cxflut1-inputtable tr td:nth-child(2){text-align:left;width:130px}
.cxflut1-inputtable tr th:nth-child(3){text-align:left;}
.cxflut1-inputtable tr td:nth-child(3){text-align:left;}


.valpane-title{ background: #f2f3f4; padding: 10px 15px;  display: flex; justify-content: left; align-items: center; position: relative;}
.valpane-title .name{font-size: 16px; font-weight: bold; color: rgba(var(--cdp-main-rgb), 0.9);}
.valpane-title .tips{margin-left: 4px;}
.valpane-title .text{position: absolute; right: 15px;}


.panel-title {
	font-size: 15px;
	font-weight: bold; 
	color: #333;
	margin-bottom: 10px;
}


/**第一步**/


#demoTabsHeader2  .layui-this{background: var(--cxui-btn-type-background); color: var(--cxui-btn-type-text-color); border: 1px solid var(--cxui-btn-type-line-color);}
#demoTabsBody2 .test-item{display: none;}

.step1-container{
	display: flex;  
}
.step1-container .step1-left {
	flex: 4;
	border-right: 1px solid #eee;
	padding: 10px 40px 0px 0;
}
.step1-container .step1-right {
	flex: 2;  
	padding: 10px 0 0 40px;
}
 
.step1-container .layui-btn-container button{margin-right: 15px;}



.step1-container .layui-btn-container{margin-top: 15px; margin-bottom: 15px;}

.step1-container .layui-form{display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;}
.step1-container .layui-form-item{margin-bottom: 0;}
.step1-container .layui-form-text .layui-form-label {
	float: none;
	width: 100%;
	border-radius: 2px;
	box-sizing: border-box;
	text-align: left;
	padding: 0;
}
.step1-container .layui-form-text .layui-input-block {
		margin: 0;
		left: 0;
		top: -1px;
		margin-top: 10px;
}



.result-dalist{margin-top: 24px; margin-bottom: 12px;}
.result-dalist .result-item {
	margin-bottom: 10px;
	padding-bottom: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px dashed #eee;
}
.result-dalist .result-item:last-child{
	padding-bottom: 6px;
	border-bottom: none;}
.result-dalist .result-item  .result-label {
	font-weight: bold;
	color: #666;
}
.result-dalist .result-item .result-value {
	font-weight: bold;
	color: #333;
	font-size: 16px;
}

 
.betabtn{
	display: flex; margin-top: 10px; justify-content: left;
	align-items: center;}
.betabtn .tips {
		font-size: 12px;
		color: #999;  
		margin-left: 10px;
}
.betabtn button{height: 38px; line-height: 38px;}





/**第2步**/


.step2-container{  
	padding: 10px 0;
}
.step2-warp{
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px;
}
.step2-panel{
	flex: 1; 
} 

.step2-container .layui-tab-content{padding: 0;}
.step2-container .layui-tab-title{margin-bottom: 20px;}
.step2-container .layui-form{display: grid; grid-template-columns: repeat(1, 1fr); gap: 0px;}
.step2-container .layui-form-item{margin-bottom: 15px;}
.step2-container .layui-form-text .layui-form-label {
	float: none;
	width: 100%;
	border-radius: 2px;
	box-sizing: border-box;
	text-align: left;
	padding: 0;
	position: relative;
}
.step2-container .layui-form-text .layui-form-label em{
	position: absolute;
	right: 0;
	font-style: normal;
} 
.step2-container .layui-form-text .layui-input-block {
		margin: 0;
		left: 0;
		top: -1px;
		margin-top: 10px;
}

.step2-container .tsinput .layui-form-label{ color: var(--cxui-btn-warm-text-color)!important;} 
.step2-container .tsinput .layui-input{background: var(--cxui-btn-warm-background)!important;color: var(--cxui-btn-warm-text-color)!important;}




 





/**第3步**/

.step3-container{ 
 padding-top: 10px;
}
 .freermb-card{}

.freermbtool{display: flex; margin-bottom: 10px;} 
.freermbtool .rmbleft{ flex: 1; display: flex; justify-content: left; align-items: center;  }
.freermbtool .rmbright{ flex: 1; display: flex; justify-content: right; align-items: center;  }
.freermbtool .rmbleft .freetool-btn-item{margin-right: 15px;}
.freermbtool .rmbright .freetool-btn-item{margin-left: 15px;}


.freetool-btn-item .cxui-btn-group .active{background: var(--cxui-btn-type-background);
	color: var(--cxui-btn-type-text-color);
	border: 1px solid var(--cxui-btn-type-line-color);}
.freetool-btn-item .cxui-btn-group .groupitem{border: 1px solid var(--text-005-color);}
.freetool-btn-item .cxui-btn-group .groupitem:last-child{border-right:1px solid var(--text-005-color);}


.freermbtable {
    width: 100%;
    overflow: hidden;
    position: relative;
    border: 1px solid #ddd;
    border-radius: 4px;
}
.freermbtable .table-container {
    display: flex;
    width: 100%;
}
.freermbtable .fixed-column {
    width: 200px;
    position: sticky;
    left: 0;
    background-color: #fff;
    z-index: 2;
    box-shadow: 2px 0 5px rgba(0,0,0,0.1);
}
.freermbtable .scrollable-columns {
    display: flex;
    overflow-x: auto;
    flex: 1;
    -webkit-overflow-scrolling: touch;
}


.fixed-cell, 
.header-cell, 
.data-cell {
   	height: 34px;
	padding: 0 10px;
    border-bottom: 1px solid #eee;
    text-align: right;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-end;
	position: relative;
}
.fixed-cell { 
    height: 34px;
    padding: 0 10px;
    text-align: left;
    justify-content: flex-start;
    background-color: #fff;
} 

.fixed-header {
    font-weight: bold;
    background-color: #f5f5f5;
    position: sticky;
    top: 0;
    z-index: 3;
}

.header-cell {
    font-weight: bold;
    background-color: #f5f5f5;
    position: sticky;
    top: 0;
    min-width: 180px;
}
.cellindent{
	padding-left: 25px;
}

.data-column {
    display: flex;
    flex-direction: column;
    min-width: 180px; 
}

.data-cell {
    background-color: #fff;
} 
.data-cell:hover {
    background-color: #f9f9f9;
}
.data-cell .layui-input{
	text-align: right;
	padding: 0 12px;
}

.scrollable-columns::-webkit-scrollbar {
    height: 8px;
}

.scrollable-columns::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.scrollable-columns::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.scrollable-columns::-webkit-scrollbar-thumb:hover {
    background: #555;
}



/**第4步**/

.step4-container{
 padding-top: 10px;}
#demoTabsHeader  .layui-this{background: var(--cxui-btn-type-background); color: var(--cxui-btn-type-text-color); border: 1px solid var(--cxui-btn-type-line-color);}
#demoTabsBody .test-item{display: none;}

.step4-table{ margin-top: 15px; border-radius:6px ;}
.step4-table table{width:100%;border-collapse:collapse}
.step4-table td{border:1px solid #eee;padding:8px 12px; }
.step4-table tr td:nth-child(1){text-align:left;width: 200px; font-size: 16px;}
.step4-table tr td:nth-child(2){text-align:right;width: 200px; font-size: 16px;}
.step4-table tr td:nth-child(3){text-align:left; color: rgba(var(--cdp-main-rgb), 0.8); line-height: 24px; font-size: 15px;} 

.step4-table .layui-input{text-align: right;}

.step4-container .layui-btn-container button{margin-right: 15px;}


/*********** 3. 估值区间图 ***********/


.footbset{ background: #f1f2f4; padding: 8px 10px; margin-bottom: 10px; }
.footbset .layui-form-item .layui-inline{margin-bottom: 0;}
.footbset .layui-form-mid{line-height: 15px;}
.footbset  .layui-form-item{margin-bottom: 0px;}
.footbset .layui-input-wrap{ position: relative;  }
.footbset .layui-input-wrap::after {
    content: "%";
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    pointer-events: none;
	z-index: 9999;
  }
 
















/*******************  二. 列表模块(cplist)  *******************/






/*******************  三. 表格模块(cptable)  *******************/

/** 1.一个完整的列表模块（stklist）**/
.stklist{
	background: var(--bgmain2-color); padding: 0 10px 10px;
}

.tabtoper{display: flex; border-bottom: 1px solid var(--text-005-color);}
.tabtoper .stkhorizontal{ width: 80px; margin-right: 10px;}
.tabtoper .stkhorizontal .horizset{ height:30px; margin-top: 10px; background: none;  border: none;  padding: 0 10px; cursor: pointer;}
.tabtoper .stkhorizontal .horizset:hover{ background: var(--text-005-color); opacity: 0.88;}

.tabtoper .stktabs{flex: 1;}
.tabtoper .stktool{width:300px; display: flex;justify-content: right; align-items: center;  }
.tabtoper .stktool .cxui-btn-group{margin-right: 15px;}

.tabtoper .layui-tabs-header:after, .tabtoper .layui-tabs-scroll:after{border-bottom: none;}
.tabtoper .layui-tabs-header{height: 46px;}
.tabtoper .layui-tabs-header li{line-height: 46px; font-size: 15px; letter-spacing: 2px;}
.tabtoper .layui-tabs-header .layui-this, 
.tabtoper .layui-tabs-header li:hover{ color: var(--btgp-active-bg);}
.tabtoper .layui-tabs-header .layui-this:after{border-bottom: 3px solid var(--btgp-active-bg);}



.gztabtoper{margin: 0 auto;text-align: center;}
.gztabtoper .name{line-height: 20px;}
.gztabtoper .unit{font-size: 12px; line-height: 16px; font-weight: 300;}


/**1、表格默认高度**/
.stktable .layui-table-cell {
	height: 46px;
	line-height:46px;
    /* 新增居中方案 */
    display: flex;
    align-items: center;
}

.stkcodeplus{position: initial; width: 100%; padding: 0;}
.stkcodeplus .layui-input{
	position: absolute;
	top: 9px;
	width: 234px;
	padding-left: 30px;
		z-index: 8;}
.stkcodeplus i{position: relative; 
		left: 10px;
		z-index: 9;}

.tabstock {
	  height: 100%;
	  display: inline-flex;
	  align-items: center;
	  line-height: normal;
}
.stock-logo {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.stock-logo img {
    width: 100%;
    height: auto;
    object-fit: contain; 
}
.stock-code {
    height: 24px;
    line-height: 24px; 
    margin: 0 8px; 
    font-size: 14px;
    background-color: var(--bgmain-search-color);
    color: rgba(var(--cdp-main-rgb), 0.9);
	padding: 0px 6px;
}
.stock-name {
    line-height: 40px; 
    font-size: 16px;
}

.stock-numb{ font-size: 16px;}
.stock-unit{ font-size: 12px; color: var(--text-07-color); margin-left: 4px;}

.stock-center{margin: 0 auto; text-align: center;}

.stock-lead .thmub{width: 30px; display: inline-block;}
.stock-lead .thmub img{width: 100%;}
.stock-lead .name{margin-left: 6px; min-width: 100px; display: inline-block;}

.stock-star i{ color: #ea5455; margin: 0 2px;}

/**2、表格调整高度**/
.stktable .setheight .layui-table-cell {
	height: 74px;
	line-height: 74px;
	font-size: 16px;
    /* 新增居中方案 */
    display: flex;
    align-items: center;
}
.stktable .setheight .tabstock{position: relative;}
.stktable .setheight .tabstock .stock-name{position: absolute; top:0; left: 60px;}
.stktable .setheight .tabstock .stock-code{position: absolute; bottom:0; left: 60px; margin: 0;}
.stktable .setheight .stock-logo { width: 50px; height: 50px; }

.stktable .setheight .tabprice{position: relative; height: 38px;}
.stktable .setheight .stock-numb{ position: absolute; top:0; left: 0px;}
.stktable .setheight .stock-unit{ position: absolute; bottom:0; left: 0px; margin: 0;}


.stkindutable .layui-table-cell{line-height: 22px!important; min-height: 46px;  }
.stkindutable .stock-name{line-height: 22px!important;}

/*******************  四. 筛选模块(cpfilter)  *******************/





/*******************  五. 图表模块(cpchart)  *******************/


#chart-container {
	width: 100%;
	height: 300px;
	margin: 20px auto;
}
 




/*******************  七. 典型页面(cpmain)  *******************/
 

/******2·表格卡片样式切换*****/
.view-content {
    display: none;
}

.view-content.active {
    display: block;
}



/******3·纯样式实现tips*****/
.cdptips {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transform: translateY(0);
}
.cdptips:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); 
}
.cdptips i {
    transition: transform 0.3s ease, color 0.2s ease;
}

.cdptips:hover i {
    transform: scale(1.1);
}

.cdptips .tooltip {
    position: absolute;
    top: -40px;
    max-width: 440px;
    min-width: 100px;
    text-align: center;
    font-size: 12px;
    background: #515151;
    color: #fff;
    padding: 6px 8px;
    border-radius: 6px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transform: translateY(10px);
    pointer-events: none; 
}
.cdptips .tooltip::before {
    position: absolute;
    content: "";
    height: 8px;
    width: 8px;
    background: #515151;
    bottom: -3px;
    left: 50%;
    transform: translate(-50%) rotate(45deg);
    transition: background 0.2s ease;
}

.cdptips:hover .tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.cdptips:hover span,
.cdptips:hover .tooltip {
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.1);
} 
.tipblack:hover .tooltip,
.tipblack:hover .tooltip::before {
    background: #515151;
    color: white;
    fill: white;
}
  
.tipblack:hover{
	opacity: 0.88;
}
 
/******4·图标提示文字内容*****/ 
.cell-tip-wrapper {
display: inline-flex;
align-items: center;
position: relative;
top: 2px;
}
.cell-tip-wrapper i{
color: rgba(var(--cdp-main-rgb), 0.7);
cursor: pointer;
font-size: 16px;
display: inline-flex;
transition: transform 0.2s;
}
.cell-tip-wrapper:hover .cell-tip-icon {
transform: scale(1.1);
}
.cell-tip-text {
position: absolute;
left: 100%;
top: 50%;
transform: translateY(-50%) translateX(-10px);
margin-left: 8px;
background: rgba(0,0,0,0.85);
color: white;
text-align: justify;
padding: 12px 15px;
border-radius: 4px;
font-size: 13px;
line-height: 1.5;
max-width: 400px;
width: max-content;
opacity: 0;
pointer-events: none;
z-index: 100;
white-space: normal;
word-wrap: break-word;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
transition: 
	opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.cell-tip-wrapper:hover .cell-tip-text {
opacity: 1;
transform: translateY(-50%) translateX(0);
}