/***********************公共样式***********************/
*{box-sizing: border-box;}
html,body{width: 100%;height: 100%; 
 user-select: none; /* 防止选择文本 */  
		    -webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */
}
/** reset **/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, img{border:medium none;margin: 0;padding: 0;font-size: 100%;}
body,button, input, select, textarea{font-size: 12px;font-family: "microsoft yahei","Gulim ", sans-serif;}
h1, h2, h3, h4, h5, h6{font-weight: normal;}
input,button,img{border: none;background: none;}
button {cursor: pointer;}
input[type="text"],
input[type="password"],button{outline: none;-webkit-appearance:none;}
em,i{font-style:normal;}
ul, ol{list-style: none;}
a{text-decoration: none;
	color:#333;
}
a,a:hover,a:active,a:visited,a:link,a:focus{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    outline:none;
    text-decoration: none;
}
img{border:0px;  outline-width:0px;  vertical-align:top;}
.clearfix {*zoom: 1;} 
.clearfix:before, .clearfix:after {display: block; line-height: 0; content: "";} 
.clearfix:after {clear: both;} 
.fl {float:left;}
.fr {float:right;}

/* @charset "utf-8"; */

:root {
  --bgColor: #fff;
  --color: #333;
}
* {
  padding: 0;
  margin: 0;
  outline: none;
}

img {
  -moz-user-select: none; /* 火狐浏览器 */
  -webkit-user-select: none; /* 谷歌浏览器 */
  -ms-user-select: none; /* IE10+ */
  user-select: none; /* 标准语法 */
}
.search-engine,
.search-engine-list li {
  margin: 0;
  padding: 0;
  /* �������ģ��,������� */
  box-sizing: border-box;
}

/* �÷�ie�����Ĭ��Ҳ��ʾ��ֱ����������ֹ��������������˸ */
/* html { overflow-y: scroll; } */
.sousuo {
  padding: 12px 10px 30px 10px;


height:106px;


    }

.search {
  position: relative;
  width: 100px;
  margin: 0 auto;
  min-width:400px;
  
}
.search-box {
  /*transition: 0s all linear;*/
  height:50px;
  /*box-shadow: 0px 0px 2px 0px #ccc;*/
  /* border-radius: 10px; */
  overflow: hidden;
  display: -webkit-flex;
  /* Safari */
  display: flex;
  flex-wrap: wrap;
  border:2px solid #ddd;
  /*box-shadow: 0 2px 3px #0000000f;*/
  border-radius:20px;
  margin-bottom:10px;
margin-top:20px;
background-color: rgba(255, 255, 255, 0.5);  
  min-width:400px;

}
.search-box:hover { border:2px solid #ffffff;
box-shadow: 0px 1px 7px  #999999;
}

.search-box:focus-within { border:2px solid #ffffff;
box-shadow: 0px 1px 7px  #999999;  background-color:white;
}

#search-icon {
  /* ������ͼ�� */
  display: block;
  position: absolute;
  top: 7.5px;
  width: 60px;
  height: 36px;
  overflow: hidden;
  text-align: center;
  font-size: 20px;
  cursor: pointer;
}
#search-img {
  display: none;
  position: absolute;
  top: 6.5px;
  width: 48px;
  height: 38px;
  overflow: hidden;
  text-align: center;
  cursor: pointer;
  left: 8px;
}
 /* 搜索按钮 开始*/

    .search-button {  
        position: absolute;  
        right: 12px;  
        top: 0;  
       
		display: flex;  
	margin-top:8px;
border:0;
    }  
	.search-button img{ height:33px;  border:0;
		width:33px;}
      
   /* 搜索按钮 结束*/
   .search-input {
   box-sizing: border-box;
   font-family: "SF-Pro-Display-Semibold", "PingFangSC-Regular",
     "Microsoft YaHei UI", "Microsoft YaHei", helvetica, sans-serif;
   flex:10;
   
   height: 50px;
   font-size: 18px;
   color: #000000de;
   border: none;
   outline: none;
   /*padding: 12px 0px;*/
   padding-left: 60px;
   padding-right: 30px;
     /* 宽度设置 */
   } 
input::-webkit-input-placeholder {
  font-size: 18px;
  font-family: "SF-Pro-Display-Semibold", "PingFangSC-Regular",
    "Microsoft YaHei UI", "Microsoft YaHei", helvetica, sans-serif;
  letter-spacing: 1px;
  color: #999999;
}
.hot-text {
  position: relative; 
  margin: 10px 10px 5px;
  overflow: hidden;
  color: #999;
  font-size: 14px;
  /* display: flex; */
}

.search-hot-text .history .history-header {
  position: relative;
  margin: 10px 10px 5px;
  overflow: hidden;
  color: #999;
  font-size:14px;
  display: flex;
  justify-content: space-between;
}
.history-header #clear {
  cursor: pointer;
}
.search-hot-text .history .history-body {
  margin: 0 5px;
  overflow: hidden;
}
.search-hot-text .history .history-body .item {
  width:49%;
  position: relative;
  float: left; 
}
.search-hot-text .history .history-body .item:hover > #clearHistory {
  display: block !important;
  cursor: pointer;
}
.history-body .item #clearHistory {
  position: absolute;
   top:8px;
  width:30px;
  height:20px;
  color:red;
   background-color: #ddd; 
  right:8px;
padding-left:6px;
 border-radius:10px;  

}
.search-hot-text .history .history-body .item span {
  display: block;
margin:5px;
  overflow: hidden;
  color: #111;
  line-height:25px;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
margin-left:20px;
font-size:15px;
padding-left:10px; 
  border-radius:6px;  
 background-color: #f4f2f2; 
}



.search-hot-text ul {
  margin: 0;
  padding: 0;

}
/* 下拉提示词样式 */
.search-hot-text ul li {
  /* ���������ؼ�����ʾ�� */
  cursor: pointer;
  line-height:30px;
  font-size: 16px;
  color: #222;
  cursor: pointer;
  list-style: none;
  border-bottom: 1px solid #eee;
  overflow: hidden; /* 添加此属性以隐藏超出容器的内容 */

}


/* FIXME: 改动部分 */
.search-hot-text {  
  position: fixed;  
  /* 使用 transform: translateX(-50%); 来实现水平居中 */  
  left: 50%;  
  transform: translateX(-50%);  
  z-index: 100;  
  width: 42%; /* 或者使用具体的像素值，但保持响应式 */  
  border-radius: 5px 5px 15px 15px;  
  border-top: none;  
  background-color:white;  
  height:360px;  
  overflow: hidden; /* 添加此属性以隐藏超出容器的内容 */
  min-width:370px; /* 确保元素不会小于这个宽度 */  
  /* 如果需要，可以添加 box-shadow 或其他样式 */  
  
}

.search-hot-text ul li:hover {
 
  color: #2196f3;
  cursor: pointer;
}
/*搜索提示数字*/
.search-hot-text ul li span {
  -webkit-tap-highlight-color: #00000000;
  list-style: none;
  cursor: pointer;
  box-sizing: border-box;
  display: inline-block;
  width:24px;
  height:20px;
  font-size:1px;
  text-align: center;
  margin-right: 10px;
  border-radius: 10px;
  color: #535353;
}
.search-engine {
  position: absolute;
  top:51px;
  background-image: linear-gradient(to bottom, #ddd, #eeeeee);
  border-radius:18px;
  box-shadow: 0 1px 6px 0 #999;
padding:5px;
z-index:100;
max-width:190px;
}
.search-engine-head {
  overflow: hidden;
top:1px;

 
}
.search-engine-tit {
  float: left;
  margin: 0;
  font-size:11px;
  color: white;
}
.search-engine-list::after {
  content: "";
  width: 70px;
  height: 18px;
  position: absolute;
  top: -15px;
  left: 5px;

}
/* FIXME: 改动部分 */
.search {
  /* width:360px; */
  /* vw单位 代表view width 即视窗宽度 */
  width: calc(42%);
}

.search-engine-list {  
  display: flex;  
  flex-wrap: wrap; /* 这在这里不是必需的，但如果你有更多的列可能会用到 */  
  list-style: none; /* 移除默认的列表样式 */  
  padding: 0; /* 移除默认的padding */  
  /* 可以设置一个最大宽度，但在这个例子中我们让.search-engine-list充满其容器 */  

}  
  
.search-engine-list li {  
  /* 使用flex-basis来设置每个列表项的基础宽度，这里假设我们想要两列 */  
  /* 注意：这里的50%是基于.search-engine-list的宽度 */  
  flex: 0 0 50%; /* flex-grow: 0, flex-shrink: 0, flex-basis: 50% */  
  margin: 0 0 7px; /* 在列与列之间不留水平间距，只在项与项之间留垂直间距 */  
  height: 30px; /* 或者根据需要设置高度 */  
  font-size: 13px;  
  font-weight: 600;  
  display: flex; /* 如果需要在列表项内部也使用flex布局 */  
  align-items: center; /* 如果需要垂直居中列表项内的内容 */  
  cursor: pointer;  
  color: #333;  
  
  /* 其他样式... */  
}  
  
/* 额外的样式，用于演示或适应不同情况 */  
.search-engine-list {  
  max-width:90%; /* 可选：限制列表的最大宽度 */  
  margin: auto; /* 可选：如果设置了max-width，这可以让列表在页面中居中 */  
}

.search-engine-tool {
  float: right;
  margin-right: 15px;
  font-size:15px;
  color: white;
 padding-top:6px;
  cursor: pointer;
}
/* .search-engine-list li { 
  margin: 0 10px 10px 0;
} */

.icon {
  width: 3.1em;
  height:2.1em;
  vertical-align: -0.6em;
  fill: currentColor;
  overflow: hidden;
  padding: 0 5px 0 1px;
  user-select: none; /* 防止选择文本 */
  		    -webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */}
  	/* 加载指示器样式 */

}
.iconImage {
  
  width: 3.1em;
  height:2.1em;
}

#search-clear {
  /* ���������ؼ��� */
 position:absolute;
  top: 20px;
  right:50px;
  width: 30px;
  height: 30px;
  line-height:20px;
  text-align: center;
  margin-top: -10px;
  color: #333;

  cursor: pointer;
  user-select: none; /* 防止选择文本 */
  		    -webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */}
  	/* 加载指示器样式 */
  
  
}
 
.search-engine::before {
  content: "";
  position: absolute;
   top:-10px/* 根据你的需要调整位置 */
  left:12px; /* 根据你的需要调整位置 */
  width:20px; /* 三角形的底边宽度 */
  height:10px; /* 三角形的高度 */
  background-color: var(--main-color); /* 使用CSS变量定义颜色 */
  transform: rotate(45deg); /* 旋转伪元素以形成三角形 */
  transform-origin: 0 100%; /* 设置旋转的基点 */
z-inddex: -1;
  }

/* 接下来，我们需要使用 ::after 伪元素来覆盖掉菱形的一半，从而只显示一个三角形 */
 .search-engine::after {
   content: "";
   position: absolute;
 top:-10px; /* 根据你的需要调整位置 */
   left:12px; /* 根据需要调整以覆盖菱形的一半 */
   width:20px; /* 与 ::before 相同 */
   height:10px; /* 与 ::before 相同 */
   background-color: #ddd; /* 使用背景色来覆盖掉不需要的部分 */
   transform: rotate(-45deg); /* 反向旋转以覆盖掉 ::before 的一部分 */
   transform-origin: 100% 100%; /* 设置旋转的基点 */
   z-inddex: -1;
 
 }

.hot-row-cell{
  position: relative;
  padding-right:24px;
}

.search-icon{
  display: inline-block;
  width:30px;
  height: 30px;
  background: url(../image/search.png) no-repeat center;
  background-size: cover;
  
}

.arrow-icon {
  display: inline-block;
  width:20px;
  height:20px;
  background: url(../image/Arrow-top-left.png) no-repeat center;
  /* background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAAAnBAMAAAB+jUwGAAAAKlBMVEUAAADR0dHMzMzPz8/Nzc3Nzc3Nzc3MzMzMzMzMzMzNzc3Ozs7MzMzMzMwenBEEAAAADXRSTlMABNkZr/ijVTTxlX1u3UxzJQAAAI1JREFUKM+Fy7EJQkEQRdEnNmBmFSZ2YBNmvwRBOxBsxCbMLUIFg+1FBeGwO8GfZJjLmdxaP/tVkqkNc0zSZqL37378tvnLXY0bVNyi4hIVg0ZEIwaNiEZERbSLqIiK6BBRERVRERULFVERFVERFUcqoiIqomJPp2cqPbxS6fqUQp3o3YVeU+n7XOPikg+2ELMK5oFHHwAAAABJRU5ErkJggg==); */
  background-size: cover;
  position: absolute;
  /* top: 15px; */
  right: 15px; cursor: pointer;
 
  user-select: none; /* 防止选择文本 */
  		    -webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */}
  	/* 加载指示器样式 */
}


.nav-top{
  display:flex;
  justify-content:space-between;
  /* margin-left: 30px !important;
  margin-right: 30px !important; */

  margin-left: 20px !important;
  margin-right: 20px !important;
}


.mask-loading{
  position: fixed;
  top: 0;
  right: 0;
  bottom:0;
  left:0;
  width:100vw !important;
  height:100vh !important;
  background: rgba(255,255,255,0.01);
  z-index:10;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loading-icon{
  display:flex;
  align-items:center;
  height: 48px;
  margin-left:auto;
  visibility: hidden;

  transform: scale(2.4);
}

.loading-icon-show{
  visibility: visible;
}

@keyframes spinner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(1turn); cursor: pointer;
  }
}

 /* 输入框隐藏自带X叉*/  
    				#txt::-ms-clear {  /* 针对IE和Edge */
    				    display: none;  
    				}  
    				  
    				#txt::-webkit-search-decoration,  
    				#txt::-webkit-search-cancel-button,  
    				#txt::-webkit-search-results-button,  
    				#txt::-webkit-search-results-decoration {  /* 针对WebKit内核的浏览器，如Chrome和Safari */  
    				    display: none;  
    				}
					 /* 输入框按钮box，目的防止输入框文字到达一定数量跑出来*/  
    					.rgr{width:55px; }
						/* 搜索历史显示部位*/  
						#recommend{ overflow: hidden;  display:none;  }
						
						
						
						.autocomplete-suggestion {
						        display: none !important;
						        visibility: hidden !important;
						    }
						
						   .Searchreturn{
						   position:fixed;
						   width:70px;
						   height:70px;
						   bottom:0%;
						   left:40%;
						   right:60%;
						   
						   }
						   .Searchreturn img{
						   width:70px;
						   height:70px;
						   user-select: none; 
						   		   
						   }
				.hidetop{ }		  
			#logohu{display: grid; place-items:center;margin-top:0%;
			user-select: none; /* 防止选择文本 */
			-webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */
			
			}
						   #home-logo{ width:265px; height:63px; margin-top:10px;  
						   user-select: none; /* 防止选择文本 */
						   -webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */
						   
						   }
						    #wallpaper-logo{ width:265px; height:65px;margin-top:10px; display:none; 
							user-select: none; /* 防止选择文本 */
							-webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */
							}
						         
						           @keyframes spin {
						               0% { transform: rotate(0deg); }
						               100% { transform: rotate(360deg); }
						           }
						           /* 网页内容的样式 */
						           #content {
						               opacity: 0; /* 初始时不可见 */
						               transition: opacity 1s ease-in-out; /* 平滑过渡效果 */
						           }
						   
						    		
						            #content {
						                opacity: 0; /* 初始时不可见 */
						                transition: opacity 1s ease-in-out; /* 平滑过渡效果 */
						            }
						
						.posts:hover {
						  
						    background-color:white;
						
						}
						
						.statement {  
						  width:33%; /* 或者使用min-width和max-width来限制宽度范围 */  
						  height: 30px;  
						background-color: rgba(255, 255, 255, 0.7);
						  overflow: hidden; /* 添加此属性以隐藏超出容器的内容 */
						  border-radius: 20px;  
						  line-height: 30px;  
						  bottom: 10px; /* 调整为从底部留出一些空间 */  
						  position: absolute;  
						  left: 50%; /* 将元素向左移动50%的父元素宽度 */  
						  transform: translateX(-50%); /* 向左移动自身宽度的50%，以实现水平居中 */  
						  text-align: center;  
						  font-size: 13px;  
						  color: #999;  
						  min-width:340px; /* 确保元素不会小于这个宽度 */  
						  
						  
						}
						
						.Toparea{width: 100%; height:60px; }
					.set{width:40px; height:40px;float: right; margin-right:50px;  margin-top: 20px;
					 background-color: rgba(200, 200, 200, 0.5);
					 cursor: pointer;   border-radius:50%; }
						.set img{width:30px; height:30px;  margin-top:5px; margin-left:5px;   
						user-select: none; /* 防止选择文本 */
						-webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */
						}
				.app-wrapper{width:150px; height:150px;  float:left;  bottom:5%;
/* 相对于浏览器窗口的右侧 */ z-index: 1000;   position: fixed; display: none; }
				
				.app{width:110px; height:110px; float: left; }
				.app img{width:110px; height:110px; margin-top: 10px; margin-left: 10px;}
				.appname{color: #888; margin-left:25px; font-size:16px; font-weight: 600;margin-top: 1px;}
				.appclose{ float: left;  font-size:30px;  color: #888; margin-left: 10px;  cursor: pointer; font-weight: 100;}
				.hidden {  
				   
				}
						
						.custom-underline {  
							float: right;
						
						    /* 移除默认的下划线 */  
						    text-decoration: none;  
						    /* 添加自定义的下划线（使用border-bottom） */  
						    border-bottom:3px solid gray; /* 你可以根据需要更改颜色 */  
						    /* 可选：添加一些内边距来避免文本与下划线过于接近 */  
						    padding-bottom: 2px;  
						    /* 其他样式，如字体大小、颜色等 */  
						    color: gray; /* 保持与下划线颜色一致或根据需要更改 */  
							font-size:16px;
							font-weight: 600;
							margin-top:25px;
							margin-right:30px;
						}  
						.custom-underline:hover {  
						  color:#4371cb;  
						}
						.hidden-div {  
						            display: none; /* 默认隐藏 */  
						        }  
							#hiddenDiv{
								 position: fixed; /* 相对于浏览器窗口定位 */  
								  top:77px;
								    right:15px; /* 距离浏览器窗口右侧20px */  
								    width:230px; /* 宽度 */  
								    height:260px; /* 高度 */  
								    background-color: #eee; /* 背景颜色 */  
								    z-index: 1000; /* 确保它位于其他元素之上 */  
								    /* 添加一些内边距和文本样式，以便更好地展示 */  
								    padding: 10px;  
								    box-sizing: border-box; /* 防止内边距和边框增加额外宽度 */  
								    text-align: center; 
									border-radius:15px;
								 box-shadow: 0 0 6px 0 #414141;
								}	
						 #hiddenDiv::after {
						   content: "";
						   position: absolute;
						 top:-10px; /* 根据你的需要调整位置 */
						   left:163px; /* 根据需要调整以覆盖菱形的一半 */
						   width:20px; /* 与 ::before 相同 */
						   height:10px; /* 与 ::before 相同 */
						   background-color: #eee; /* 背景颜色 */ 
						   transform: rotate(-45deg); /* 反向旋转以覆盖掉 ::before 的一部分 */
						   transform-origin: 100% 100%; /* 设置旋转的基点 */
						   z-inddex: -1;
						
						 
						 }
					
						#gearImage {
						    transition: transform 0.5s; /* 添加过渡效果 */}
						.set-moerpic{
						
						    /* 移除默认的下划线 */  
						    text-decoration: none;  
						    /* 添加自定义的下划线（使用border-bottom） */  
						    border-bottom:3px solid #575758; /* 你可以根据需要更改颜色 */  
						    /* 可选：添加一些内边距来避免文本与下划线过于接近 */  
						 
						    /* 其他样式，如字体大小、颜色等 */  
						    color: #575758; /* 保持与下划线颜色一致或根据需要更改 */  
							font-size:16px;
							font-weight:700;
							width:100px;
							margin: 0 auto;
						margin-bottom:10px;
					
						}  
						 
				.setting-switch input {
				 cursor: pointer;
				 position: absolute;  
				 margin-top:1px;
				 left:1px;  
				 border: 0;  
				 -webkit-appearance: none;  
				 outline: 0;  
				 margin-left:85px;   
				}  
						.setting-switch input:before {  
						font-size:14px;
						  width:60px;  text-align: center;
						  height:28px;  
						 content:"= 关";
						 color:#eee;font-weight:900;
						  background-color: #c9c9c9;  
						  cursor: pointer;  
						  display: inline-block;  
						  position: relative;  
						  vertical-align: middle;  
						  -webkit-box-sizing: content-box;  
						  box-sizing: content-box;  
						  border-color: #c9c9c9;   
						  -webkit-box-shadow: #dfdfdf 0 0 0 0 inset;  
						  box-shadow: #dfdfdf 0 0 0 0 inset;  
						  -webkit-transition: border .4s, -webkit-box-shadow .4s;  
						  transition: border .4s, box-shadow .4s;  
						  -webkit-background-clip: content-box;  
						  border-radius: 50px;  
						  background-clip: content-box;  
						line-height:28px;
						}  
						.setting-switch input:checked:before {   
						  -webkit-box-shadow: #c04b4b 0 0 0 0.16rem inset;  
						  box-shadow: #c04b4b 0 0 0 0.16rem inset;  
						  background-color:#c04b4b;
						  content:"开 =";
						  color:#c29797;
						  transition: border .4s, box-shadow .4s, background-color 1.2s;  
						  -webkit-transition: border .4s, -webkit-box-shadow .4s, background-color 1.2s;  
						  background-color: #c04b4b; font-size:14px;line-height:28px;
						 font-weight: 900;
						}  
						  
						.setting-switch input:checked:after {  
						    left: 2.2rem; 
						}  
						.setting-switch input:after {  
						  content: '';  
						  width: 20px;  
						  height:20px;  
						  position: absolute;  
						  top: 50%; 
						line-height:28px;
						   left: 0.3rem;  
						  -webkit-transform: translateY(-50%);  
						  transform: translateY(-50%);  
						  border-radius: 50%;  
						  border: none;  
						  background-color: #fff;  
						  -webkit-box-shadow: 0 0.01rem 0.03rem rgba(0, 0, 0, .4);  
						  box-shadow: 0 0.01rem 0.03rem rgba(0, 0, 0, .4);  
						  -webkit-transition: left .2s;  
						  transition: left .2s;  
						}
	
						
						
						.hotnews{width:42%;  height:358px; margin: 0 auto;  background-color: rgba(255, 255, 255, 0.5);  border-radius:10px; margin-top:15                                              px; 
						 }
								 
									  
					
                         
                        
                        .option {
                            cursor: pointer;
                          padding-top:5px;
                          padding-right:20px;
                          padding-left: 20px;
						  padding-bottom: 10px;
                          /* 不设置 padding-bottom */
                            user-select: none;
                            position: relative;
                            font-size: 15px;
                            color: #666;
                            text-decoration: none;
                            float: left;
                          left: 35%;
                        }
                        
                        .option::after {
                            content: "";
                            position: absolute;
                            left:22px;
                            bottom: 0;
                            width: 25px; /* 调整宽度以适应实际需求 */
                            height: 3.5px;
                            background-color: #4371cb;
                            visibility: hidden;
                            opacity: 0;
                            transition: visibility 0.3s, opacity 0.3s;
                        }
                         
                         .option.selected {
                             color: #444; /* 当选中时，文字颜色变为较深的颜色 */
                             font-weight: 600;
                         }
                         
                         .option.selected::after {
                             visibility: visible;
                             opacity: 1;
                         }
                         
                         
                         
                         
                         		    }  
                         		  
                         		    .content {  
                         		        display: none;  
                         		        /* 其他样式 */  
                         		    }  
                         		  
                         		    .content.visible {  
                         		        display: block;  
                         		    }  	
	
	
					
					
					
					
					
					
									  .history-area::-webkit-scrollbar {
									         display: none; /* 隐藏Webkit内核浏览器的滚动条 */
									     }
									     .history-area {
									         -ms-overflow-style: none;  /* IE 和 Edge */
									         scrollbar-width: none;  /* Firefox */
									         overflow-y: auto; /* 保持滚动功能 */
									     }
										 
										  #custom-engine-url {
										      width:200px; /* 示例宽度，根据实际情况调整 */
										      overflow: hidden; /* 隐藏超出容器的内容 */
										      text-overflow: ellipsis; /* 当内容溢出时显示省略号 */
										      white-space: nowrap; /* 不换行 */
											    /* 更改 placeholder 文本大小的 CSS */  
												background-color:#ddd;
												border-radius:10px;
												height:30px;
												font-size:15px;
												font-weight: 700;
											 
										  }
										      /* 更改 placeholder 文本大小的 CSS */  
										      #custom-engine-url::placeholder {  
										          font-size: 14px; /* 或者你想要的任何大小 */  
										          color: #808080; /* 也可以更改颜色 */  
										      }  
											  #recommend{margin-top:60px; font-size:15px;}
											  .ad-box{width: 100%; height:300px; background-color:#fff;}
	#collect{width:60px; height:60px; margin-left:50px; cursor: pointer; margin-top:20px; 
	 position:fixed;  user-select: none; /* 防止选择文本 */  
		    -webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */
	}	

/* 通用滚动条样式 */
.collect-Window {
 width: 500px;
 box-shadow: 0 0 6px 0 #c27405;
 margin-left: 40px;
 z-index: 1001;
 border-radius: 20px;
 margin-top: -35px;
 background-color: #faf8e5;
 position: fixed;
 display: none;
 min-height: 0;
 max-height: calc(600px);
 overflow-y: auto;
}

/* WebKit 核心浏览器（Chrome, Safari, etc.） */
.collect-Window::-webkit-scrollbar {
   height:80%;
}

.collect-Window::-webkit-scrollbar-track {
    background: #faf8e5; /* 滚动条轨道颜色 */
    border-radius: 10px; /* 轨道圆角 */
}

.collect-Window::-webkit-scrollbar-thumb {
    background-color: #8eb2f1; /* 滚动条滑块颜色 */
    border-radius: 10px; /* 滑块圆角 */
    border: 3px solid #faf8e5; /* 滑块透明度 */
}

/* Firefox */
* {
    scrollbar-width: thin; /* “auto” 或 “thin” 或 “none” */
    scrollbar-color: #8eb2f1 #faf8e5;
	
}

/* IE 和 Edge */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .collect-Window {
        ms-overflow-style: -ms-autohiding-scrollbar;
    }
}

/* 其他浏览器（如 Opera 12.1 及更低版本） */
.collect-Window {
    scrollbar-face-color: #8eb2f1;
    scrollbar-arrow-color: #8eb2f1;
    scrollbar-base-color: #faf8e5;
    scrollbar-highlight-color: #faf8e5;
    scrollbar-shadow-color: #faf8e5;
    scrollbar-3dlight-color: #faf8e5;
    scrollbar-darkshadow-color: #faf8e5;
}
.addtip{color:#dc860b; text-align: center; }


	
	#ChatAI{width:40px; height:40px; float: right;   margin-right:50px; cursor: pointer; margin-top: 20px; 
	user-select: none; /* 防止选择文本 */
			    -webkit-user-drag: none; /* 禁止拖动（在Chrome, Safari, Opera上有效） */
	}	


.Chat-Window {
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: fixed; /* 使用 fixed 以相对于视口定位 */
    top: 0;
    left: 0;
    z-index: 1001;
    display: none;
    border-radius: 0px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    user-select: none; /* 防止选择文本 */
    -webkit-user-drag: none; /* 禁止拖动 */
    margin: 0; /* 确保没有外边距影响布局 */
    padding: 0; /* 确保没有内边距影响布局 */
    box-sizing: border-box; /* 使用 border-box 模型 */
    overflow: hidden; /* 防止内部内容溢出产生滚动条 */
}

	 .close-button{margin-right:10px; font-size:25px;font-weight:600; float:right; cursor: pointer; }
 
#urlInput{font-size:20px;  width:300px;   margin-left:20px;  }

	.favorite {
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	   margin:8px;
	    padding:5px;
	    border: 1px solid #ccc;
	    border-radius: 5px;

			 background-color:white;;
			   
	}
	 
	.favorite .name {
		    flex-grow: 1;
		    text-decoration: none;
		    color: blue;
		    cursor: pointer;
			margin:50px;
			overflow: hidden; /* 添加此属性以隐藏超出容器的内容 */
			font-size:15px;
			
		}
		 
		 .favorite .name:hover {
		     text-decoration: underline;
		 }
		 
	.delete-button {
	    background-color: #c13030;
	    color: white;
	    border: none;
	    padding: 5px 10px;
	    cursor: pointer;
	    border-radius:5px;
		z-index:1000;
	
	
	}
		 
		 .delete-button:hover {
		     background-color: #a82828;
		}
			
	#changeBackground{ width:40px; height:20px; background-color:#7da6ec;color:#fff;font-size:15px;
	}
	#selectFile{width:40px; height:20px;background-color:#7da6ec;color:#fff;font-size:15px; border-radius:0 5px 5px 0; 
		
	}
	#clearBackground{width:40px; height:20px; background-color:#7da6ec;color:#fff;font-size:15px; 
		
	}
	#beauty{ width:40px; height:20px; background-color:#7da6ec;color:#fff;font-size:15px;border-radius:5px 0 0 5px; 
	}
	#custom-engine-ok{width:100px; height:30px; background-color:#7da6ec;color:#fff;font-size:15px; border-radius:5px; margin-top:10px;
		
	}
	#beauty:hover{background-color:#0057ee;}
	#changeBackground:hover{background-color:#0057ee;}
	#selectFile:hover{background-color:#0057ee;}
	#clearBackground:hover{background-color:#0057ee;}
	#custom-engine-ok:hover{background-color:#0057ee;}
	
	#addcollect{width:100px; height:50px;  background-color:#fffff9;
	margin-bottom:8px;
	border-radius:15px; font-weight:700; color:#222; font-size:15px;margin-right:20px; margin-top:8px;}
	#addcollect:hover{background-color:#fffff1;}
	
	#favorites .favorite .edit-button {
	    right:20px;
	    color:#222; /* 编辑按钮特有的样式 */
	    font-size:13px; /* 可以根据需要调整大小 */
		position: absolute;
		z-index: 1000;
		background-color:#8eb2f1;
		width:50px; height:20px;
		border-radius:5px;
		margin-top:3px;
		
	
	}
	#favorites .favorite .edit-button,
	#favorites .favorite .delete-button {
	    display: inline-block;
		
	}
	#favorites .favorite a.name {
	    width: calc(80% - 50px); /* 调整宽度以留出按钮的空间 */
	    overflow: hidden;
	    white-space: nowrap;
	    text-overflow: ellipsis;
		
	}
	
	/* 鼠标悬停时显示按钮 */
	#favorites .favorite:hover .edit-button,
	#favorites .favorite:hover .delete-button {
	    display: inline-block;
		
	}
	

	/* 为了确保按钮不会覆盖链接文本，可以增加一些额外的样式 */
	#favorites .favorite:hover a.name {
	    width: calc(85% - 50px); /* 调整宽度以留出按钮的空间 */
	    overflow: hidden;
	    white-space: nowrap;
	    text-overflow: ellipsis;
		
	}


        .favorite .name {
            display: inline-block;
            max-width:80%; /* 可以根据需要调整宽度 */
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
.edit-button,
.delete-button {
    display: inline-block;
}

.confirm-button,
.cancel-button {
    display: none;
}

/* 输入框样式 */
#favorites .name[type="text"] {
    width:80%;
    background-color: #eee;
    border-radius: 15px;
    padding: 5px;
margin-left:-1px;
height:30px;
  
}
	.name {
		font-weight: 600;
		color: #4575D3;
		position: absolute;
		z-index: 10;
		font-size: 15px;
			}
.confirm-button {  
    display: none; /* 默认隐藏 */  
    background-color: #4CAF50; /* 背景色 */  
    color: white; /* 字体颜色 */  
    border: none; /* 无边框 */  
   border-radius:5px;
    cursor: pointer; /* 鼠标悬停样式 */  
    font-size: 16px; /* 字体大小 */  
	width:40px;
	height:30px;
	position: inherit;
margin-left:420px;


}


.select-ai{ width:80px; height:100%;  background-color:#fcfcfc; z-index:1001; position: fixed; border-left:2px solid #ccc;  right:0px;}
			
			.model-container {
			            display: flex;
			            flex-direction: column;
			            align-items: center;
			            gap: 10px;
			            margin-top: 20px;
			        }
			
			    
			
			        .aipic{
			            width:100%;
			            height:60px;
			            cursor: pointer;
					
			        }
			 
			        .aipic img { height:30px;width:60px;margin-left:10px; margin-top:8px;}
			#model-frame{
			            width:95%;
			            height:100%; /* 根据需要调整 */
			            border: none;
			          
					margin-left:-10px;
					position: absolute;

						}
		.selecte{
		            background-color: #e0e0e0;  
		        }
		   
	
			     hr {
			         border-top: 1px solid #ddd;
			         width:100%;
			         margin: 0 auto;
			      
			     }

		
			
		
		.model-buttons {
		    display: flex;
		    flex-direction: column;
		    align-items: center;
		    gap: 10px;
		    margin-top: 20px;
		    width: 100%;
		    max-width: 200px;
		    margin-left: auto;
		    margin-right: auto;
			height: 100%;
			
		}
				
		  .content-area {
		      position: relative;
		      height: 100%;
		  }
			
			        .iframe-container {
			            position: absolute;
			            top: 0;
			            left: 0;
			            right: 0;
			            bottom: 0;
			        }



.navbar{width:100%; height:300px;  padding-top:20px;  float: left; }
.navbar-container{margin-left:18px;}
.category{line-height:20px; font-size:15px; padding: 8px;}
.category span{font-weight:500; color:#4371cb;}
.category a{  margin-left:20px;}
.category a:hover{  text-decoration: underline; color: red;}
.Tianqi {
			       
			                   width:430px;
			                    margin-top: 5px;
			                    position: fixed; /* 鍥哄畾浣嶇疆 */
			                   right: 1px;
			                  bottom: 0px;
			                    z-index: 1000; /* 纭繚鍦ㄩ〉闈㈡渶涓婂眰 */
							
			              height:200px;
			                }
			            iframe {
			                width:80%;
			                height:100%;
							margin-left:50px;
			                border: none; /* 绉婚櫎iframe榛樿杈规 */
							
			            }
			        
			                /* 鍦ㄥ皬灞忓箷涓婇殣钘忓ぉ姘旀彃浠� */
			                @media (max-width: 768px) {
			                    .Tianqi {
			                        display: none; /* 闅愯棌鍏冪礌 */
			                    }
			                }
						.tianqihub {
						            position: absolute;
						            top: 0;
						            left: 0;
						            width:80%;
						            height:70%;
					
						            cursor: pointer;
											margin-top: 20px;
											margin-left:25%;
											  
						        }
						    
