﻿@charset "utf-8";
/* CSS Document */

body { font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑","Source Han Sans SC","Noto Sans CJK SC",sans-serif; font-size:12px; color:#333; background-color:#fff; -webkit-text-size-adjust:100%}
* { margin:0; padding:0;}
a { color:#333333; text-decoration:none;}
a:hover {text-decoration:none; cursor:pointer}
.clear{clear:both;}
img{ border:0}
ul{list-style-type:none}

.top_r{ float:right; }
.top_r span{ display:block; line-height:28px; font-size:18px; color:#d9372f}

.dh_bg{ width:100%; height:40px; background-color:#eb8a1a;}
.dh{ width:1000px; height:40px; overflow:hidden; margin:0 auto;}
.dh a{ display:block; float:left; width:90px; height:40px; overflow:hidden; font-size:18px; line-height:40px; text-align:center; color:#FFFFFF; margin:0px 26px 0 26px; transition:background-color .18s ease}
/* 悬停 / 键盘聚焦：整块加深一档（原来的文字上移 2px 几乎不可感知） */
.dh a:hover,
.dh a:focus-visible{ background-color:#d1730a}
/* 当前所在栏目：更深一档；当前页（非仅栏目归属）再加粗区分 */
.dh a.current{ background-color:#c96a06}
.dh a.current:not(.current-section){ font-weight:700}

.index_01{ width:1000px; height:594px; overflow:hidden; margin:0 auto; margin-top:50px}
.index_01 .one{ float:left; width:320px; height:594px; overflow:hidden; margin-right:20px}
.index_01 .one .tit{ float:left; width:320px; height:49px; overflow:hidden; background-image:url(../images/index_01_titbg.jpg); text-align:center; font-size:20px; color:#FFFFFF; line-height:38px}
.index_01 .one .tit a span{ color:#FFFFFF}
.index_01 .one .img{ float:left; width:320px; height:363px; overflow:hidden; margin-top:7px}
.index_01 .one img{ float:left; width:320px; height:363px}
.index_01 .one .con{ float:left; width:318px; height:154px; line-height:22px; overflow:hidden; color:#777; margin:22px 0 0 2px}

.index_02{ width:1000px; height:352px; overflow:hidden; margin:0 auto; margin-top:50px}

.index_02 .left{ float:left; width:558px; height:352px; overflow:hidden;}
.index_02 .left img{ float:left; width:558px; height:352px;}

.index_02 .right{ float:left; width:432px; height:352px; overflow:hidden; margin-left:10px;}
.index_02 .right .tit{ float:left; width:432px; height:44px; overflow:hidden; text-align:center; line-height:44px; color:#d9251b; font-weight:bold; font-size:22px}
.index_02 .right .con{ float:left; width:416px; height:135px; overflow:hidden; background-image:url(../images/index_02_right_conbg.jpg); line-height:35px; margin-top:4px; font-size:18px; color:#FFFFFF; padding-left:8px; padding-right:8px;}
.index_02 .right .con .con_z{ float:left; line-height:65px}
.index_02 .right .r1{ float:left; width:212px; height:154px; overflow:hidden; margin-top:15px}
.index_02 .right .r2{ float:left; width:212px; height:154px; overflow:hidden; margin-left:8px; margin-top:15px;}
.index_02 .right .r1 img{ float:left; width:212px; height:154px}
.index_02 .right .r2 img{ float:left; width:212px; height:154px}

.index_03{ width:1000px; height:737px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_03 img{ float:left; width:1000px; height:737px;}

.index_04{ width:1000px; height:348px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_04 img{ float:left; width:1000px; height:348px;}

.index_05{ width:1000px; height:270px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_05 img{ float:left; width:1000px; height:270px;}

.index_06{ width:1000px; height:673px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_06 .img{ float:left; width:499px; height:673px;}
.index_06 .img img{ float:left; width:499px; height:673px;}

.index_06 .con{ float:left; width:480px; height:673px; overflow:hidden; margin-left:20px;}
.index_06 .con .tit{ float:left; width:480px; height:50px; overflow:hidden; line-height:70px; font-size:25px; color:#d82119}
.index_06 .con .tit span{ float:left; font-size:46px; line-height:50px; margin-right:10px}
.index_06 .con .detail{ float:left; width:480px; line-height:24px; font-size:16px; margin-top:28px; margin-bottom:60px}

.index_07{ width:1000px; height:348px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_07 img{ float:left; width:1000px; height:348px;}

.index_08{ width:1000px; height:185px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_08 img{ float:left; width:1000px; height:185px;}

.index_09{ width:1000px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_09 img{ float:left; width:1000px;}

.index_10{ width:1000px; height:380px; overflow:hidden; margin:0 auto; margin-top:50px}

.index_10 .left{ float:left; width:499px; height:380px; overflow:hidden;}
.index_10 .left img{ float:left; width:499px; height:380px;}

.index_10 .right{ float:left; width:487px; height:380px; overflow:hidden; margin-left:14px;}

.index_10 .right .con{ float:left; width:487px; height:80px; overflow:hidden; font-size:27px; line-height:40px; color:#eb8b1b}
.index_10 .right .con span{ color:#d91f15}
.index_10 .right .r1{ float:left; width:238px; height:287px; overflow:hidden; margin-top:13px}
.index_10 .right .r2{ float:left; width:238px; height:287px; overflow:hidden; margin-left:11px; margin-top:13px;}
.index_10 .right .r1 img{ float:left; width:238px; height:287px}
.index_10 .right .r2 img{ float:left; width:238px; height:287px}

.index_11{ width:1000px; height:348px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_11 img{ float:left; width:1000px; height:348px;}

.index_12{ width:1000px; overflow:hidden; margin:0 auto; margin-top:50px;}
.index_12 img{ float:left; width:1000px; height:95px;}

/*--------neiye---------*/
.procate_box{ width:100%; background-image:url(../images/pro_cate_bg.gif); background-repeat:repeat-y; background-position:center 0px}

.pro_cate_one{ width:1000px; height:611px; overflow:hidden; margin:0 auto; margin-top:70px;}
.pro_cate_one .con{ float:left; width:350px; height:370px; overflow:hidden; margin-top:237px; margin-left:5px}
.pro_cate_one .con span{ float:left; width:350px; height:34px; overflow:hidden; line-height:34px; font-size:20px}
.pro_cate_one .con font{ float:left; width:350px; height:26px; overflow:hidden; line-height:26px; font-size:14px}
.pro_cate_one .con .pco_a{ float:left; width:95px; height:32px; overflow:hidden; background-image:url(../images/pco_a_bg.jpg); color:#FFFFFF; line-height:32px; font-size:20px}
.pro_cate_one .con .pco_a b{ margin-left:7px; font-weight:normal}

/*--------neiye---------*/

/* 应用菜单顶部横幅。列表与详情页由 assets/css/yycd.css 负责，
   旧站那种「20 块 .yycd_list 堆在一页」的版式已废弃，相关规则一并删除 */
.yycd_banner{ width:100%; position:relative;}
.yycd_banner img{ width:100%; height:auto;}

/*--------neiye---------*/

.news_banner{ width:100%; position:relative;}
.news_banner img{ width:100%;}

.news_list{ width:1000px; height:50px; margin:0 auto; overflow:hidden; line-height:80px}
.news_list b{ float:left; width:60px; height:50px; overflow:hidden; text-align:center; font-size:18px; font-weight:normal} 
.news_list span{ float:left; width:790px; height:50px; overflow:hidden; font-size:18px} 
.news_list span a:hover{ color:#eb891a}
.news_list font{ float:left; width:150px; height:50px; overflow:hidden; text-align:center; font-size:18px; font-weight:normal} 

.news_detail_box{ width:1000px; margin:0 auto}
.news_detail{ float:left; width:1000px; margin-top:15px; font-size:14px; line-height:28px;}
.news_detail .news_detail_tit{ float:left; width:1000px; height:40px; overflow:hidden; line-height:40px; text-align:center; margin-bottom:10px}
.news_detail .news_detail_tit span{ font-size:20px; margin-right:20px}
.news_detail .news_detail_tit font{ font-size:14px; margin-right:20px}

/*--------neiye---------*/

.contact_banner{ width:100%; position:relative;}
.contact_banner img{ width:100%;}

.contact_detail_box{ width:1000px; margin:0 auto}
.contact_detail{ float:left; width:1000px; margin-top:25px; font-size:14px; line-height:28px}

.contact_box1{ float:left; width:528px; height:480px; overflow:hidden; margin-left:10px; font-size:16px; line-height:32px}
.contact_box1 .tit{ float:left; width:528px; height:50px; overflow:hidden; line-height:50px; font-size:28px; margin-bottom:10px;}

.contact_box2{ float:left; width:462px; height:480px; overflow:hidden;}
.contact_box2 .tit{ float:left; width:462px; height:50px; overflow:hidden; line-height:50px; font-size:28px; margin-bottom:10px;}

.contact_box3{ float:left; width:1000px; height:90px; overflow:hidden; background-image:url(../images/contact_box3_bg.jpg); background-repeat:no-repeat; margin-top:30px; line-height:32px; font-size:20px}
.contact_box3 .con{ margin-left:135px; color:#d4150c}

.contact_box4{ float:left; width:1000px;}

/*--------neiye---------*/

.about_banner{ width:100%; position:relative;}
.about_banner img{ width:100%;}

.about_con_tit{ width:1000px; height:80px; overflow:hidden; margin:0 auto; margin-top:40px; background-image:url(../images/about_con_tit.jpg); background-repeat:no-repeat; line-height:88px; color:#FFF}
.about_con_tit span{ margin-left:15px; font-size:26px}

.about_con_box{ width:1000px; margin:0 auto; font-size:12px; line-height:24px}

.about_detail1{ float:left; width:1000px; min-height:500px; margin-top:40px;}

.about_detail2{ float:left; width:1000px; min-height:407px; margin-top:40px;}

.about_detail3{ float:left; width:1000px; min-height:521px; margin-top:40px;}

.about_detail4{ float:left; width:1000px; min-height:300px; margin-top:40px;}

.about_detail5{ float:left; width:1000px; min-height:300px; margin-top:40px;}

.about_detail6{ float:left; width:1000px; min-height:300px; margin-top:40px;}

.about_detail7{ float:left; width:1000px; min-height:300px; margin-top:40px;}
.about_detail7 .one{ float:left; width:474px; height:560px; margin-right:52px; margin-bottom:50px}
.about_detail7 .one .imgbox{ float:left; width:474px; height:358px; overflow:hidden; background-color:#c1c1c1}
.about_detail7 .one .imgbox img{ float:left; width:422px; height:340px; margin:34px 0 0 26px}
.about_detail7 .one .tit{ float:left; width:474px; height:54px; overflow:hidden; line-height:54px; font-size:20px; text-align:center; color:#d6271f; background-color:#c1c1c1}
.about_detail7 .one .con{ float:left; width:422px; height:136px; overflow:hidden; line-height:36px; font-size:20px; margin-left:26px; margin-top:10px;}





.about_detail8{ float:left; width:1000px; min-height:300px; margin-top:40px; font-size:22px; color:#333; line-height:50px}

/*--------neiye---------*/

.prodetail_menu1{ width:1000px; height:28px; overflow:hidden; margin:0 auto; margin-top:60px; font-size:18px; line-height:28px; background-image:url(../images/pro_detail_dian1.jpg); background-repeat:no-repeat}
.prodetail_menu1 b{ font-weight:normal}
.prodetail_menu1 span{ margin-right:8px; margin-left:10px}
.prodetail_menu1 font{ font-size:18px; color:#eb891a}

.prodetail_menu2{ width:1000px; height:236px; overflow:hidden; margin:0 auto; margin-top:50px}
.prodetail_menu2 .prodetail_menu2_img{ float:left; width:646px; height:236px;}
.prodetail_menu2 .con{ float:left; width:354px; height:236px; overflow:hidden; background-color:#f7d100}
.prodetail_menu2 .con .detail{ float:left; width:316px; height:150px; overflow:hidden; margin:40px 0 0 38px; line-height:38px; font-size:20px}

.prodetail_box1{ width:1000px; height:700px; overflow:hidden; margin:0 auto; margin-top:70px; position:relative}
.prodetail_box1 .prodetail_box1_img{ float:left; width:1000px; height:700px;}
.prodetail_box1 .conbox{ position:absolute; width:464px; height:700px; overflow:hidden; z-index:100; right:0px}
.prodetail_box1 .conbox .tit{ float:left; width:464px; height:70px; overflow:hidden; line-height:70px; font-size:34px; color:#d7190b}
.prodetail_box1 .conbox .con{ float:left; width:464px; font-size:18px; line-height:30px; margin:0 0 40px 0}

.prodetail_box2{ width:1000px; height:580px; overflow:hidden; margin:0 auto; margin-top:70px}
.prodetail_box2 .img1{ float:left; width:500px; height:247px;}
.prodetail_box2 .con1{ background-color:#dededc}
.prodetail_box2 .con2{ background-color:#c1c1c1}
.prodetail_box2 .con{ float:left; width:500px; height:333px }
.prodetail_box2 .con .tit{ float:left; width:460px; height:70px; overflow:hidden; line-height:70px; font-size:30px; color:#d7190b; margin-left:26px}
.prodetail_box2 .con .detail{ float:left; width:460px; height:250px; overflow:hidden; line-height:32px; font-size:18px; margin-left:26px}

.prodetail_box3{ width:1000px; height:745px; overflow:hidden; margin:0 auto; margin-top:43px;}
.prodetail_box3 .tit{ float:left; width:1000px; height:84px; overflow:hidden; line-height:84px; font-size:34px; color:#d7190b}
.prodetail_box3_img{ float:left; width:1000px; height:661px}

.prodetail_box4{ width:1000px; height:460px; overflow:hidden; margin:0 auto; margin-top:70px}
.prodetail_box4 .one{ float:left; width:480px; height:206px; overflow:hidden; margin:0 40px 48px 0}
.prodetail_box4 .one img{ float:left; width:210px; height:206px; margin-right:33px}
.prodetail_box4 .one .tit{ float:left; width:237px; height:50px; overflow:hidden; line-height:50px; margin-top:15px; font-size:24px; color:#d7190b}
.prodetail_box4 .one .con{ float:left; width:237px; height:120px; overflow:hidden; line-height:30px; font-size:18px}

.prodetail_box5{ width:1000px; height:406px; overflow:hidden; margin:0 auto; margin-top:70px;}
.prodetail_box5_img1{ float:left; width:500px; height:406px; margin-right:24px}
.prodetail_box5 .tit{ float:left; width:476px; height:38px; overflow:hidden; line-height:38px; font-size:36px; color:#d7190b}
.prodetail_box5 .con{ float:left; width:476px; height:114px; overflow:hidden; line-height:38px; font-size:18px; margin-top:12px}
.prodetail_box5_img2{ float:left; width:476px; height:222px; margin-top:20px}

.prodetail_box6{ width:1000px; height:411px; overflow:hidden; margin:0 auto; margin-top:70px;}
.prodetail_box6 img{ float:left; width:1000px; height:411px;}

.prodetail_box7{ width:1000px; height:334px; overflow:hidden; margin:0 auto; margin-top:70px;}
.prodetail_box7 img{ float:left; width:1000px; height:334px;}

.prodetail_box8{ width:1000px; height:570px; overflow:hidden; margin:0 auto; margin-top:70px;}
.prodetail_box8 img{ float:left; width:1000px; height:570px;}

.prodetail_box9{ width:1000px; height:606px; overflow:hidden; margin:0 auto; margin-top:50px;}
.prodetail_box9 img{ float:left; width:1000px; height:606px;}

.prodetail_box10{ width:1000px; height:334px; overflow:hidden; margin:0 auto; margin-top:50px;}
.prodetail_box10 img{ float:left; width:1000px; height:334px;}

.prodetail_box11{ width:1000px; height:660px; overflow:hidden; margin:0 auto; margin-top:50px;}
.prodetail_box11 a{ display:block; float:left; width:220px; height:292px; overflow:hidden; margin:0px 40px 75px 0px}
.prodetail_box11 a img{ float:left; width:220px; height:243px;}
.prodetail_box11 a span{ float:left; width:220px; height:25px; overflow:hidden; text-align:center; line-height:26px; font-size:20px}
.prodetail_box11 a font{ float:left; width:220px; height:25px; overflow:hidden; text-align:center; line-height:26px; font-size:16px}
.prodetail_box11 a:hover span{ color:#eb891a}
.prodetail_box11 a:hover font{ color:#eb891a}

.prodetail_box12{ width:1000px; height:196px; overflow:hidden; margin:0 auto; margin-top:50px;}
.prodetail_box12 img{ float:left; width:1000px; height:196px;}









/************  QQ FLOAT  ***********/
.qq_box{ width:189px; height:296px; overflow:hidden; position:fixed; right:-154px; top:180px; z-index:999}
.qqbox_left_01{ float:left; width:35px; height:145px; overflow:hidden; margin:96px 0 0 0; background-image:url(../images/qqbox_left_02.jpg); cursor:pointer; display:block}
.qqbox_left_02{ float:left; width:35px; height:145px; overflow:hidden; margin:96px 0 0 0; background-image:url(../images/qqbox_left_02.jpg); cursor:pointer; display:none}
.qqbox_right{ float:left; width:154px; height:296px; overflow:hidden; background-image:url(../images/qqbox_right_bg.jpg)}
.qqbox_right .con1{ float:left; width:149px; height:20px; overflow:hidden; text-align:center; font-size:16px; line-height:20px; color:#333; margin-top:87px; margin-left:3px}
.qqbox_right .qq_dian{ float:left; width:113px; height:35px; overflow:hidden; background-image:url(../images/qq_dianbg.jpg); text-decoration:none; margin:13px 15px 5px 18px}
.qqbox_right .qq_dian span{ font-size:14px; color:#FFF; margin-left:47px; text-decoration:none; line-height:32px}
.qqbox_right .con2{ float:left; width:149px; height:20px; overflow:hidden; text-align:center; font-size:16px; line-height:20px; color:#333; margin-top:20px; margin-left:3px}
.qqbox_right .con3{ float:left; width:149px; height:20px; overflow:hidden; text-align:center; font-size:16px; line-height:20px; color:#333; margin-top:10px; margin-left:3px; color:#d00901; font-weight:bold}
/************  QQ FLOAT  ***********/
/* 返回顶部：内联 SVG 圆形按钮（替代旧站 31px 位图）。
   可点击区扩到 44px，是移动端舒适触达的下限；半透明深底在
   浅色正文和深色页脚上都够清楚，悬停变主题红。

   默认收起：刚打开页面还在顶部时它没有任何用处，反而盖住内容，
   因此 opacity/visibility 双关 + pointer-events:none（既不显示也不可点，
   同时从无障碍树里移除，屏幕阅读器不会念到一个看不见的按钮）。
   滚动超过阈值（横屏半屏 / 竖屏三分之一屏）后由 assets/js/float.js 加上 .is-show 淡入。
   visibility 的过渡延迟到 .3s，是为了让「淡出」走完再隐藏，
   而 .is-show 里把延迟归零，保证「淡入」立刻可见。 */
.totop_box{
	width:44px; height:44px; position:fixed; right:20px; bottom:20px;
	display:flex; align-items:center; justify-content:center;
	border:0; padding:0; border-radius:50%;
	background:rgba(30,30,30,.78); color:#fff; cursor:pointer;
	box-shadow:0 2px 8px rgba(0,0,0,.18);
	-webkit-tap-highlight-color:transparent;
	opacity:0; visibility:hidden; pointer-events:none;
	transform:translateY(8px);
	transition:opacity .3s ease, transform .3s ease, visibility 0s .3s,
		background-color .25s ease, box-shadow .25s ease
}
.totop_box.is-show{
	opacity:1; visibility:visible; pointer-events:auto;
	transform:translateY(0);
	transition:opacity .3s ease, transform .3s ease, visibility 0s 0s,
		background-color .25s ease, box-shadow .25s ease
}
.totop_box:hover{ background:#da251c; box-shadow:0 4px 12px rgba(218,37,28,.32) }
.totop_box svg{ display:block; transition:transform .25s ease }
.totop_box:hover svg{ transform:translateY(-2px) }


/* ==================================================================
   现代化补充（2026-09 迁移优化）
   —— HTML5 语义结构 / WebP 图片 / 原生交互 / 无障碍
   ================================================================== */

/* <picture> 只负责挑选图片格式，本身不产生盒子，
   保证加上 WebP 之后版式与原来 <img> 的写法完全一致 */
picture { display: contents; }

/* 徽标按块级排版：HTML5 标准模式下，行内图会多出基线以下的行盒空隙，
   改块级后与旧站（XHTML 近标准模式）像素一致 */
.foot-logo svg { display: block; }

/* 页头 Logo 悬停光晕 —— 七彩霞光带流动。纯 CSS、零图片、零额外请求。
   为什么要拆成父子两层：CSS 规定遮罩在 filter **之后**生效，所以 mask 与 blur
   若写在同一个元素上，模糊出来的光晕会被遮罩重新裁掉。于是
   ::before 负责「按 logo.svg 的轮廓裁出形状」，父层 .logo-halo 负责
   「把已经裁好的形状模糊成辉光」—— 顺序正好。
   .logo-halo 用 inset:0、blur 属 ink overflow：不改布局，也不参与可滚动溢出区，
   不会像 padding/width 那样把横向滚动条带回来。
   blur 取 6px 是算出来的：徽标盒顶距窗口顶 8px（.site-top 上内边距）+ 盒内到
   图形上沿还有 3.4px ≈ 11.4px 净空，而模糊的可见扩散约 2σ。取 6px → 12px 刚好
   收得住；取到 7px 以上，最顶端那圈淡光会被窗口边切出一道硬边。
   注：页脚 logo 是 <div> 不是链接，非交互元素不给 hover 反馈，故不套用 */
@property --milim-halo-angle { syntax:'<angle>'; initial-value:0deg; inherits:false }

.logo { position:relative; display:block }
.logo-img { display:block; position:relative; z-index:1; height:70px; width:auto }
.logo-halo {
	position:absolute; inset:0; z-index:0;
	filter:blur(6px) saturate(1.5);
	opacity:0; visibility:hidden;
	transition:opacity .45s ease, visibility 0s .45s;
	pointer-events:none
}
.logo-halo::before {
	content:''; position:absolute; inset:0;
	/* 赤 橙 黄 绿 青 蓝 紫；首尾同色，转满一周无缝衔接 */
	background:conic-gradient(from var(--milim-halo-angle),
		#ff3b30, #ff9500, #ffd60a, #34c759, #00c7be, #0a84ff, #bf5af2, #ff3b30);
	-webkit-mask:url(../images/logo.svg) center/contain no-repeat;
	        mask:url(../images/logo.svg) center/contain no-repeat;
	animation:milim-halo-flow 6s linear infinite
}
/* 淡入时 visibility 立刻翻开、透明度慢慢来；收起时反过来
   （基态的 visibility 延迟到淡出结束才生效） */
.logo:hover .logo-halo,
.logo:focus-visible .logo-halo {
	opacity:1; visibility:visible;
	transition:opacity .45s ease, visibility 0s 0s
}
@keyframes milim-halo-flow { to { --milim-halo-angle:360deg } }

/* 页头 / 页脚容器（原来写在模板内联样式里，收进 CSS 便于维护） */
.site-top { margin:0 auto; padding:8px 0; display:flex; justify-content:space-between; align-items:center; width:1000px }
/* 页脚。width:100% 若留在 content-box 下，盒子总宽会变成「视口宽 + 40px」：
   页面每页都被撑出一条横向滚动条（全站横向溢出的根因），而且内部 1000px
   居中容器的内容框中心会落在「视口中心 + 20px」，页脚内容整体右偏 20px。
   改成 border-box 后总宽恰为视口宽 —— 溢出消失，页脚内容回到真正的居中；
   深色背景两次都覆盖整幅视口宽，观感不变 */
.site-foot { box-sizing:border-box; margin-top:50px; padding:20px; width:100%; background-color:#1e1e1e }
.site-foot-inner { margin:0 auto; padding:8px 0; display:flex; justify-content:space-between; align-items:center; width:1000px }
.site-foot-text { color:#999 }
.site-foot-text a { color:#999 }
.foot-qr { margin-left:10px; width:90px; height:auto }
/* CSS 只约束宽度的图，必须显式等比，避免被 width/height 属性里的高度撑变形 */
.index_09 img { height:auto }

/* 顶部声明（原来写在模板内联样式里） */
.notice-box { width:1000px; margin:0 auto; padding:10px }
.notice-box .notice-tit { text-align:center; font-size:18px; margin:20px; font-weight:bold }
.notice-body { font-size:16px; line-height:150%; text-indent:2em }

html { scroll-behavior:smooth }

/* 横向溢出兜底 —— 这是安全网，不是修复本身（真正的根因见表头 .site-foot 注释）。
   本主题版式固定宽 1000px，其中首页公告栏 .notice-box 因 content-box 内边距
   实际占 1020px，所以视口 ≥ 1040px（1020 + 竖滚动条余量）时内容绝不会真的超出
   视口宽度，此时在根部裁掉横向溢出，任何零星元素都撑不出左右滚动条。
   窄屏不加这条：那时固定宽版式确实比屏幕宽，裁掉会让内容够不着、也无法拖动查看，
   宁可保留横向滚动 */
@media (min-width:1040px){
	html, body { overflow-x:hidden }
}

/* 在线客服浮层：CSS transition 取代原来的 jQuery animate */
.qq_box { transition:right .3s ease }
.qq_box.is-open { right:0 }
.qq_box.is-open .qqbox_left_01 { display:none }
.qq_box.is-open .qqbox_left_02 { display:block }

/* 键盘可达性：Tab 聚焦时给出清晰可见的描边 */
.dh a:focus-visible,
.qq_box a:focus-visible,
.totop_box:focus-visible { outline:2px solid #fff; outline-offset:-2px }
.index_01 .tit a:focus-visible,
.news_list span a:focus-visible { outline:2px solid #d9251b; outline-offset:2px }

/* 用户在系统里选择了「减少动态效果」时，关闭过渡动画 */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior:auto }
	.qq_box { transition:none }
	.totop_box, .totop_box svg { transition:none }
	.dh a { transition:none }
	.logo-halo { transition:none }
	.logo-halo::before { animation:none }
}




