@media screen and (max-width:768px) {
	*{
		margin:0;padding: 0;
		box-sizing: border-box;
	}

	html,body{
		height: 100%;
		width: 100%;
	}
	/* 内容容器：居中+上移40px+右移3px，匹配你的布局 */
	.content{
		width: 95%; /* 更宽适配3列按钮 */
		max-width: 400px;
		display: flex;
  		flex-direction: column;
 		align-items: center;
  		gap: 25px; /* 搜索框与分类模块的间距 */
  		position: absolute;
  		top:26%;
  		left: 50%;
  		transform: translateX(calc(-50% + 28px));
  		margin-top: -40px;
	}

	/* 搜索区域：保持对齐+固定尺寸 */
	.content .baidu{
		position: relative;
		width: 100%;
		max-width: 400px;
		height: 40px;
		left: 50%;
		transform: translateX(-50%);
	}

	.content .baidu-2{
		height: 40px;
	}

	.content .baidu #Select-2{
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 80px;
		height: 34px;
		border: 2px solid #ddd;
		border-radius: 4px 0 0 4px;
	}

	.content .baidu .Select-box {
		display: none;
		float: none;
	}

	.content .baidu .Select-box li{
		background-color: yellow;
		display: none;
		float: none;
		width: 4.69rem;
	}

	.content .baidu #kw-2{
		width: calc(100% - 160px); /* 适配搜索框宽度，不挤 */
		height: 34px;
		border: 2px solid #ddd;
		position: absolute;
		left: 85px;
		top: 50%;
		transform: translateY(-50%);
		padding-left: 10px;
	}

	.content .baidu #su-2 {
	    width: 80px;
	    text-align: center;
	    line-height: 34px;
	    position: absolute;
	    background-color: blue;
	    border: 2px solid blue;
	    right: 0;
	    border-radius: 0 4px 4px 0;
	    height: 34px;
	    top: 50%;
	    transform: translateY(-50%);
	    color: white;
	}

	#su-2:hover{
		background-color: blue;
	}

	#su-2:active{
		background-color: blue;
		box-shadow: none;	
	}

	/* ========== 匹配截图的手机版分类布局（3列按钮） ========== */
	/* 1. 分类模块的父容器：上下排列，分类间留间距 */
	.content > div:not(.baidu) {
		width: 100% !important;
		display: flex !important;
		flex-direction: column !important;
		gap: 20px !important; /* 分类之间的间距，和截图一致 */
		padding: 0 !important;
	}

	/* 2. 单个分类模块（常用·网站/远程·代理等）：内部3列排按钮 */
	.content > div:not(.baidu) > .category { /* 分类容器，若没有类则用*>div */
		width: 100% !important;
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 8px !important; /* 按钮之间的小间距 */
	}

	/* 兼容无.category类的情况 */
	.content > div:not(.baidu) > div {
		width: 100% !important;
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 8px !important;
	}

	/* 3. 分类标题（常用·网站等）：独立占行，匹配截图样式 */
	.content > div:not(.baidu) > div > p,
	.content > div:not(.baidu) > .category > p {
		width: 100% !important;
		height: auto !important;
		line-height: 40px !important;
		font-size: 18px !important;
		color: #fff !important; /* 截图里的白色标题 */
		margin: 0 0 10px 0 !important;
		text-align: left !important; /* 截图里标题左对齐 */
	}

	/* 4. 按钮：3列布局，匹配截图样式 */
	.content > div:not(.baidu) > div > button,
	.content > div:not(.baidu) > div > a,
	.content > div:not(.baidu) > .category > button,
	.content > div:not(.baidu) > .category > a {
		width: calc(33.33% - 5px) !important; /* 刚好3列，减去间距 */
		height: 45px !important; /* 截图里的按钮高度 */
		line-height: 45px !important; /* 文字垂直居中 */
		text-align: center !important;
		background: #a07941 !important; /* 截图里的棕色按钮 */
		color: white !important;
		border: none !important;
		border-radius: 4px !important;
		font-size: 16px !important;
		float: none !important;
	}

	/* 底部样式 */
	.footer{  
		display: none;
	}

	.footer1{
		display: block;
		text-align: center;
		position: relative;
		padding-top: 10px;
		bottom: 0;
		color:white;
	}

	input[type="button"], input[type="submit"], input[type="reset"] {
	-webkit-appearance: none;
	}

	textarea {  -webkit-appearance: none;}  
	
}
