@charset "utf-8";
/* ==========================================================================
   亚星前台 · 移动端自适应覆盖样式
   --------------------------------------------------------------------------
   作用：把 980px 固定宽的老版前台布局，在 <=1024px 的屏幕上改成流式自适应。
   原则：PC 端（>1024px）完全不受影响，所有规则都在媒体查询内部。
   引入：index.html / zckh.html / dljm.html / yxdr.html 的 <head> 中，
         紧跟 style.css 之后引入本文件。
   ========================================================================== */

@media (max-width: 1024px) {

	/* ---------------------------------------------------------------- 1. 基础 */
	html {
		-webkit-text-size-adjust: 100%;
		text-size-adjust: 100%;
	}
	body {
		overflow-x: hidden;
		display: flex;
		flex-direction: column;
		min-height: 100vh;
	}
	img {
		max-width: 100%;
	}

	/* 整页刚好一屏：页脚贴底，中间内容区垂直居中 */
	.content {
		flex: 1 0 auto;
		display: flex;
		flex-direction: column;
	}
	.content > .w {
		flex: 1 0 auto;
		display: flex;
		flex-direction: column;
	}
	.content > .w > .w {
		width: 100%;
		flex: 1 0 auto;
		display: flex;
		flex-direction: column;
		min-width: 0;
	}
	.content .footer {
		margin-top: auto;
	}

	/* ------------------------------------------------- 2. 头部：logo + 图片导航 */
	.top {
		height: auto;
		background-size: auto 100%;
	}
	.w1 {
		width: auto;
		max-width: 980px;
		height: auto;
		margin: 0 auto;
		padding: 8px 10px 10px;
		box-sizing: border-box;
		background-size: auto 100%;
	}
	.top_bj {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	.logo {
		position: static;
		float: none;
		width: auto;
		height: auto;
		padding: 0;
		flex: 0 0 auto;
	}
	.logo a {
		width: auto;
		height: auto;
	}
	.logo img {
		display: block;
		width: 104px;
		height: auto;
	}
	.lanmu {
		float: none;
		width: 100%;
		flex: 1 1 100%;
		padding-top: 8px;
	}
	.lanmu ul {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
		gap: 8px;
	}
	.lanmu ul li {
		float: none;
		width: auto;
		height: auto;
		min-width: 0;
		flex: 1 1 0;
		margin: 0;
	}
	.lanmu ul li a {
		display: block;
		width: 100%;
		height: auto;
	}
	.lanmu ul li a img {
		display: block;
		width: 100%;
		max-width: 88px;
		height: auto;
		margin: 0 auto;
		padding: 0;
	}
	.lanmu ul li a:hover {
		background: none;
	}

	/* ----------------------------------------------------------- 3. 轮播 banner */
	.banner {
		width: 100%;
		max-width: 980px;
		height: auto;
		margin: 0 auto;
		background-size: 100% 100%;
	}
	/* 978x316 的图用 32.31% 的 padding 撑高度，保持比例且不留空 */
	.slider {
		width: 100%;
		height: 0;
		padding-top: 32.31%;
		margin: 0 auto;
		overflow: hidden;
	}
	.conbox {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.conbox > div {
		width: 100%;
	}
	.conbox img {
		display: block;
		width: 100%;
		height: auto;
	}

	/* -------------------------------------------------------------- 4. 主体容器 */
	.w {
		width: auto;
		max-width: 980px;
		margin: 0 auto;
	}
	.content > .w {
		width: 100%;
		padding: 0 10px;
		box-sizing: border-box;
	}
	.w .w {
		padding: 0;
	}
	.con {
		width: 100%;
		box-sizing: border-box;
	}

	/* 首页里两个空的占位块（推荐位容器、float 清除）在移动端不再占高度 */
	.left .tuijian,
	.content > .w > .w > .clear {
		display: none;
	}

	/* --------------------------- 5. 首页三张推荐位：卡片化，横向滑动查看 */
	.left {
		position: relative;
		float: none;
		width: 100%;
		min-width: 0;
		flex: 1 0 auto;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.left .mt10 {
		display: flex;
		flex: 0 0 auto;
		width: 100%;
		min-width: 0;
		flex-wrap: nowrap;
		justify-content: flex-start;
		align-items: center;
		gap: 10px;
		padding: 12px 0;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x proximity;
		scroll-padding: 0 10px;
		scrollbar-width: none;
	}
	.left .mt10::-webkit-scrollbar {
		display: none;
	}
	.left .mt10 .ting {
		float: none;
		flex: 0 0 auto;
		width: 64vw;
		max-width: 250px;
		min-width: 0;
		height: auto;
		aspect-ratio: 228 / 227;
		margin: 0;
		background-size: 100% 100%;
		scroll-snap-align: start;
	}
	.left .mt10 .ting:last-child {
		margin-right: 2px;
	}

	/* ------------------------------------------------------------- 6. 页脚 */
	.footer {
		width: 100%;
		padding-top: 8px;
		background-color: #190003;
	}
	.footer .tx {
		margin: 0;
	}
	.footer .tx img {
		display: block;
		width: 100%;
		max-width: 794px;
		height: auto;
		margin: 0 auto;
	}
	.footer .bottom {
		height: auto;
		min-height: 0;
		padding-bottom: 12px;
		background-size: auto 100%;
	}
	.footer .bottom p {
		padding: 10px 12px 12px;
		font-size: 12px;
		line-height: 18px;
	}

	/* ------------------------------------------- 7. 代理加盟页（dljm.html）表格 */
	.con1 {
		padding: 0;
	}
	.con1 .container {
		max-width: 100%;
		margin: 20px auto;
		padding: 0 12px;
		box-sizing: border-box;
	}
	.con1 h2 {
		font-size: 16px;
		line-height: 1.4;
		margin: 22px 0 12px;
		padding: 10px 12px;
		border-radius: 8px;
	}
	.con1 table {
		font-size: 12px;
		margin-bottom: 24px;
	}
	.con1 th,
	.con1 td {
		padding: 8px 5px;
		line-height: 1.5;
		word-break: break-word;
	}

	/* ------------------------------------------- 8. 注册页 iframe（zckh.html） */
	.zckh-frame {
		width: 100%;
		max-width: 981px;
		margin: 0 auto;
	}
	iframe[name="mainsky"] {
		display: block;
		width: 100%;
		max-width: 100%;
		min-height: 560px;
		border: 0;
	}

	/* ------------------------------------------------- 9. 右下角浮动客服图 */
	#floatright {
		right: 5px !important;
		top: auto !important;
		bottom: 124px !important;
	}
	#floatright img {
		width: 72px;
		height: auto;
	}
	/* 注册页在手机上不挂固定浮图，避免遮住“确定注册 / 重置”按钮 */
	.page-register #floatright {
		display: none;
	}
}

/* ==========================================================================
   平板/横屏（600px ~ 1024px）：头部恢复成「logo 左 + 导航右」的横排
   ========================================================================== */
@media (min-width: 600px) and (max-width: 1024px) {
	.logo {
		flex: 0 0 auto;
	}
	.logo img {
		width: 132px;
	}
	.lanmu {
		flex: 1 1 auto;
		width: auto;
		padding-top: 0;
		margin-left: auto;
	}
	.lanmu ul {
		justify-content: flex-end;
		gap: 10px;
	}
	.lanmu ul li {
		flex: 0 0 auto;
		width: auto;
	}
	.lanmu ul li a img {
		max-width: 118px;
	}
}

/* ==========================================================================
   小屏手机（<=480px）进一步压缩
   ========================================================================== */
@media (max-width: 480px) {
	.logo img {
		width: 88px;
	}
	.lanmu ul {
		gap: 5px;
	}
	.lanmu ul li a img {
		max-width: 100%;
	}
	.footer .bottom p {
		font-size: 11px;
		line-height: 17px;
	}
	.con1 h2 {
		font-size: 15px;
	}
	.con1 th,
	.con1 td {
		font-size: 11px;
		padding: 7px 4px;
	}
	#floatright img {
		width: 62px;
	}
}