@charset "utf-8";
/* =========================================================
   亮紫科技 lanz-tech.com —— 移动端适配样式
   建立：2026-09-07
   作用域：所有引入本文件的页面（首页 / 产品 / 服务 / 新闻 / 关于）
   加载顺序：必须在 basics.css、index-effects.css 之后
   说明：本文件只写媒体查询，不改动桌面端（>1280px）表现
   ========================================================= */

/* ============ 移动端汉堡按钮（默认隐藏，仅窄屏显示） ============ */
.m-menu-btn{ display:none; }

/* =====================================================================
   一、≤1280px：解除固定宽度限制，容器流式化
   ===================================================================== */
@media screen and (max-width: 1280px) {

	html,body{ min-width: 0 !important; }

	.w1200{
		display: block;
		width: 100% !important;
		max-width: 1200px;
		padding-left: 15px;
		padding-right: 15px;
		box-sizing: border-box;
	}

	/* 各区块自带的 min-width 会让页面横向溢出，全部解除 */
	.product_index,
	.product_banner,.index_banner,.about_banner,
	.news_banner,.contact_banner,.service_banner{ min-width: 0 !important; }

	/* 首页最新资讯三栏：宽度写死 1275px，改为按容器自适应 */
	.index_news_cont{ width: 100% !important; }
	.index_news_cont li{ width: 32%; margin-right: 2%; }
	.index_news_cont li:last-child{ margin-right: 0; }
	.index_news_cont li dt{ width: 100%; }

	/* 品牌简介背景块：原为 70vw + min-width:600px，窄屏会溢出 */
	.index_brand li .brand_title_bg{
		left: 0;
		margin-left: 0;
		width: 100%;
		min-width: 0;
	}

	/* 关于页公司简介大图：固定 1200px */
	.brief{
		width: 100% !important;
		max-width: 1200px;
		background-size: cover;
		background-position: center center;
	}
}

/* =====================================================================
   二、≤1024px：平板布局（两栏 → 单栏过渡）
   ===================================================================== */
@media screen and (max-width: 1024px) {

	.head{ height: 64px; }
	.logo{ padding-top: 12px; }
	.logo img{ width: 132px; height: auto; }
	.nav li{ height: 64px; }
	.nav li dt a{ padding: 12px 16px; font-size: 15px; }

	.product_title h2{ font-size: 32px; height: auto; line-height: 1.4; }
	.product_title p{ font-size: 16px; height: auto; padding: 8px 0 20px; }

	/* 注意：.list_banner 必须写在 .index_banner 之前——首页同时带两个 class，
	   同权重下后写的规则生效，否则首页大图会被内页高度覆盖 */
	.list_banner{ height: 260px; }
	.list_banner h2{ font-size: 26px; padding: 96px 0 0 0; height: auto; }

	.index_banner{ height: 420px; }
	.index_banner h2{ font-size: 32px; padding: 150px 0 0 0; height: auto; }
	.index_banner p{ font-size: 18px; }

	/* 品牌简介：上下堆叠 */
	.index_brand li{ width: 100%; height: auto; }
	.index_brand li .brand_title_bg{ display: none; }
	.index_brand{ background-color: #FAFAFA; }
	.index_brand li h2{ margin: 30px 0 14px 0; height: auto; font-size: 32px; }
	.index_brand li p{ padding: 10px 0; text-indent: 0; }

	.aboutlist_cont li{ width: 50%; }

	/* 首页最新资讯标题带 .whitespace(nowrap)，窄屏会撑破卡片，改为单行省略 */
	.index_news_cont li dd a{
		display: block;
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	/* 产品列表：原为「左图 50% + 右侧绝对定位文案」，窄屏会溢出，改为上下堆叠 */
	.product_cont li{ margin: 0 0 30px 0; }
	.product_cont li dt{ width: 100%; }
	.product_cont li dd{
		position: static;
		left: auto;
		top: auto;
		width: 100% !important;
		height: auto;
		padding: 16px 16px;
		box-sizing: border-box;
		background-color: #f8f8f8;
	}
	.product_cont li dd *{ width: 100% !important; text-indent: 0; }
	.product_cont li dd h3{ padding: 8px 0 6px 0; }
	.product_cont li .ddleft{ text-align: left; }

	.product_cont2 li{ width: 50%; }
	.product_cont2 li dt,.product_cont2 li dd{ width: 100%; }
	.product_cont2 li dd{ height: auto; }

	/* 产品详情：左图 390 + 右文 450 超出容器，改为堆叠 */
	.cont_top dt,.cont_top dd{ float: none !important; width: 100% !important; }
	.cont_top dt{ height: auto; }
	.cont_top dd{ padding: 16px 0 0 0; }

	/* 新闻列表：左图 250 + 右文 860 超出容器，改为堆叠 */
	.news_list li dt{ float: none; width: 100%; height: 220px; }
	.news_list li dd{ float: none; width: 100%; padding: 14px 0 0 0; }

	.service_cont{ padding: 30px 20px; }

	.footer_cont{ height: auto; padding: 25px 0; overflow: hidden; }
	.footer_nav_list{ float: none !important; width: 100%; }
	.footer_nav_list li{ width: 25% !important; padding-left: 0; box-sizing: border-box; }
}

/* =====================================================================
   三、≤767px：手机端
   ===================================================================== */
@media screen and (max-width: 767px) {

	/* ---------- 全局基础 ---------- */
	html{ font-size: 14px; -webkit-text-size-adjust: 100%; }
	body{
		min-width: 0 !important;
		overflow-x: hidden;
		word-wrap: break-word;
		word-break: break-word;
	}

	img{ max-width: 100%; height: auto; }

	/* 编辑器产出的表格 / 内联宽高，一律收敛到屏宽内 */
	.cont_info table,.news_info table,.about_cont table,
	.service_cont table,.brief table,.main table{ width: 100% !important; height: auto !important; }
	.cont_info img,.news_info img,.about_cont img,
	.service_cont img,.brief img,.main img,.index_news_cont img{
		max-width: 100% !important;
		height: auto !important;
	}

	.cont{ padding: 15px 0 20px 0; }

	/* ---------- 顶部导航：汉堡菜单 ---------- */
	.head{ height: 54px; position: relative; }
	.head .w1200{ padding: 0 12px; position: static; }
	.logo{ padding: 11px 0 0 0; }
	.logo img{ width: 120px; height: auto; }

	.m-menu-btn{
		display: block;
		position: absolute;
		right: 12px;
		top: 15px;
		width: 26px;
		height: 20px;
		z-index: 1002;
		cursor: pointer;
	}
	.m-menu-btn span{
		display: block;
		width: 26px;
		height: 2px;
		margin: 0 0 6px 0;
		background: #1c2434;
		border-radius: 2px;
		transition: all .28s ease;
	}
	.head.nav-open .m-menu-btn span:nth-child(1){ transform: translateY(8px) rotate(45deg); }
	.head.nav-open .m-menu-btn span:nth-child(2){ opacity: 0; }
	.head.nav-open .m-menu-btn span:nth-child(3){ transform: translateY(-8px) rotate(-45deg); }

	.nav{
		display: none;
		float: none !important;
		position: absolute;
		top: 54px;
		left: 0;
		width: 100%;
		background: #fff;
		border-top: 1px solid #f0f0f0;
		box-shadow: 0 6px 16px rgba(0,0,0,.10);
		z-index: 1001;
	}
	.head.nav-open .nav{ display: block; }

	.nav li{ float: none; height: auto; }
	.nav li dt a{
		display: block;
		height: auto;
		padding: 13px 16px;
		line-height: 22px;
		font-size: 15px;
		text-align: left;
		color: #333;
		border-bottom: 1px solid #f2f2f2;
	}
	.nav li dt a.cur{ color: #1A6BE6; }
	/* 覆盖 index-effects.css 的下划线动画（桌面态的左右缩进在窄屏不适用） */
	body .nav li dt a::after{ left: 16px; right: auto; bottom: 8px; width: 30px; }
	.nav li dd{ display: none; }

	/* ---------- Banner ---------- */
	/* 同上：.list_banner 在前，.index_banner 在后 */
	.list_banner{ height: 170px; background-size: cover; }
	.list_banner h2{ font-size: 21px; padding: 52px 0 0 0; height: auto; line-height: 1.4; }
	.list_banner p{ font-size: 13px; padding: 6px 12px 0 12px; }

	.index_banner{ height: 250px; background-size: cover; }
	.index_banner h2{ font-size: 22px; padding: 84px 0 0 0; height: auto; line-height: 1.4; }
	.index_banner p{ font-size: 13px; padding: 8px 12px 0 12px; }

	/* ---------- 首页：产品中心 ---------- */
	.product_title{ padding: 22px 0 0 0; }
	.product_title h2{ font-size: 24px; height: auto; line-height: 1.4; }
	.product_title p{ font-size: 13px; height: auto; padding: 8px 0 16px 0; line-height: 1.6; }

	.product_index li{ width: 100%; }
	.product_index li dt img{ width: 100%; height: auto; }
	.product_index li dd{
		position: absolute;
		left: 0;
		top: 50%;
		width: 100%;
		transform: translateY(-50%);
		text-align: center;
	}
	.product_index dd a{ opacity: 1; width: 118px; height: 40px; line-height: 40px; font-size: 15px; }
	.product_index dd p{ padding: 12px 0; font-size: 20px; }
	.product_index dd p,.product_index dd img{ top: 0; }

	/* ---------- 首页：品牌简介 ---------- */
	.index_brand li{ width: 100%; height: auto; }
	.index_brand li .brand_title_bg{ display: none; }
	.index_brand{ background-color: #FAFAFA; }
	.index_brand li h2{ margin: 24px 0 12px 0; height: auto; font-size: 26px; line-height: 34px; }
	.index_brand li p{ padding: 8px 0; text-indent: 0; font-size: 14px; line-height: 24px; }
	.index_brand li .more{ width: 128px; height: 42px; line-height: 42px; font-size: 15px; margin: 6px 0 24px 0; }

	/* ---------- 首页：最新资讯 ---------- */
	.index_news{ padding: 24px 0 0 0; }
	.index_news_title{ height: auto; }
	.index_news_title h2{ font-size: 21px; line-height: 30px; }
	.index_news_title .more{ width: 92px; height: 34px; line-height: 34px; font-size: 13px; }
	.subhead{ font-size: 34px; line-height: 44px; }
	.index_news_cont{ position: static; top: 0; width: 100% !important; padding: 12px 0 0 0; }
	.index_news_cont li{ width: 100%; margin: 0 0 18px 0; }
	.index_news_cont li dt{ width: 100%; height: 190px; }
	.index_news_cont li dd{ padding: 10px 0 0 0; font-size: 13px; }
	.index_news_cont li dd a{ font-size: 16px; padding: 12px 0; line-height: 22px; }
	.index_news_cont li dd p{ height: auto; }

	/* ---------- 内页标签栏（产品/服务/关于） ---------- */
	.service_tab{ height: 48px; }
	.service_tab li{ padding: 0 10px; }
	.service_tab li a{ height: 48px; line-height: 46px; font-size: 15px; }
	.float_tab.fixed{ position: static !important; box-shadow: none; }

	.service_title{ height: auto; line-height: 1.5; padding: 14px 0; }
	.service_title h2{ font-size: 21px; line-height: 30px; }
	.service_title_cont{ position: static; top: 0; font-size: 14px; line-height: 24px; }
	.service_title .fleft,.service_title .fright{ float: none !important; }

	/* ---------- 产品列表页 ---------- */
	.product_cont li{ margin: 0 0 22px 0; }
	.product_cont li dt{ width: 100%; }
	.product_cont li dd{
		position: static;
		left: auto;
		top: auto;
		width: 100% !important;
		height: auto;
		padding: 14px 12px;
		box-sizing: border-box;
		font-size: 14px;
		line-height: 24px;
	}
	.product_cont li dd *{ width: 100% !important; text-indent: 0; }
	.product_cont li dd h3{ font-size: 17px; line-height: 28px; padding: 6px 0 4px 0; }
	.product_cont li .ddleft{ text-align: left; }

	.product_cont2 li{ width: 100%; }
	.product_cont2 li dt,.product_cont2 li dd{ width: 100%; }
	.product_cont2 li dd{ height: auto; }

	/* ---------- 产品详情页 ---------- */
	.cont_top dt,.cont_top dd{ float: none !important; width: 100% !important; }
	.cont_top dt{ width: 100% !important; height: auto; }
	.cont_top dd{ padding: 14px 0 0 0; }
	.cont_top dd h1{ font-size: 20px; line-height: 30px; padding: 10px 0; }
	.cont_top dd .tel{ width: 100%; max-width: 303px; background-size: contain; margin: 18px 0 0 0; }
	.cont_top dd table p{ width: 100%; white-space: normal; }

	.cont_basic{ padding: 22px 0 0 0; }
	.cont_basic_tab li{ width: 50%; }
	.cont_basic_cont{ padding: 20px 0; }

	/* ---------- 新闻列表 / 详情 ---------- */
	.news_list li{ padding: 16px 0; }
	.news_list li dt{ float: none; width: 100%; height: 190px; }
	.news_list li dd{ float: none; width: 100%; padding: 12px 0 0 0; }
	.news_list li dd h3{ font-size: 16px; line-height: 24px; }

	.news_info{ line-height: 28px; }
	.news_info h1{ font-size: 20px; line-height: 30px; }
	.author{ padding: 10px 0; }
	.share{ position: static; padding: 6px 0 0 0; }
	.article_wechat{ left: 0; top: -130px; }
	/* 上下篇按钮：原 42% 宽 + 左右 50px 内边距会撑破窄屏，改为整行 + border-box */
	.updown a{
		display: block;
		width: 100% !important;
		box-sizing: border-box;
		margin: 0 0 8px 0;
		font-size: 14px;
	}
	.updown .up{ padding: 0 12px 0 40px; background-position: 4% center; }
	.updown .down{ padding: 0 40px 0 12px; text-align: right; background-position: 96% center; }

	/* ---------- 关于我们 ---------- */
	.aboutlist_cont li{ width: 100%; border-left: 1px solid #F5F5F5; }
	.aboutlist_cont dt{ padding: 30px 0 0 0; }
	.brief{ height: auto; padding: 18px 0; }
	.brief p{ width: 100%; padding: 8px 12px; font-size: 14px; box-sizing: border-box; }
	.map{ padding: 20px 0 0 0 !important; }
	.map > div{ height: 240px !important; }

	/* ---------- 服务内容页 ---------- */
	.service_cont{ padding: 18px 12px; }
	.service_cont p{ font-size: 14px; line-height: 24px; }
	.service_cont img{ margin: 18px 0 0 0; }

	.hezuo{ padding-top: 22px; }
	.hezuo_tab{ height: auto; line-height: 1.6; font-size: 15px; margin: 10px 0 0 0; }
	.hezuo_tab li{ margin: 0 8px 6px 8px; }
	.hezuo_cont{ padding: 18px 0 0 0; }
	.hezuo_cont li{ width: 46%; margin: 1.5%; }
	.hezuo_cont li img{ max-width: 100%; height: auto; }

	.cont_list .slide_bg{ height: 100%; }

	/* ---------- 成功案例 ---------- */
	.case li{ padding: 0 0 18px 0; width: 100%; }

	/* ---------- 分页 ---------- */
	.page{ padding: 18px 0; }
	.page li a,.page li span{ padding: 5px 9px; font-size: 13px; }

	/* ---------- 底部 ---------- */
	.footer_cont{ height: auto; padding: 22px 0 10px 0; text-align: center; }
	.footer_logo{ float: none !important; padding: 0; }
	.footer_logo img{ width: 140px; height: auto; }
	.contact_footer{ padding: 16px 0 0 0; }
	.contact_footer dt,.contact_footer dd{ height: auto; float: none !important; display: inline-block; vertical-align: middle; }
	.contact_footer dt img{ width: 22px; height: auto; }
	.contact_footer dd{ padding: 0 0 0 6px; font-size: 14px; line-height: 26px; }
	.contact_footer dl{ margin: 0 0 6px 0; }

	.footer_nav_list{ float: none !important; width: 100%; padding: 16px 0 0 0; overflow: hidden; }
	.footer_nav_list li{
		float: left;
		width: 50% !important;
		padding: 0 0 14px 0 !important;
		line-height: 26px;
		font-size: 13px;
		text-align: left;
	}
	.footer_nav_list li:nth-child(odd){ clear: both; }

	.copyright{ height: auto; line-height: 22px; padding: 12px 0; font-size: 11px; }
}

/* =====================================================================
   四、≤380px：小屏手机微调
   ===================================================================== */
@media screen and (max-width: 380px) {
	.logo img{ width: 104px; }
	.index_banner h2{ font-size: 20px; }
	.list_banner h2{ font-size: 19px; }
	.product_title h2{ font-size: 21px; }
	.hezuo_cont li{ width: 100%; margin: 0 0 12px 0; }
}