/* =========================================================
   前台排版优化  layout-optimize.css
   ---------------------------------------------------------
   原则：
   1. 只做样式覆盖，不改动任何 HTML / 后端代码；
   2. 所有规则限定作用域，不影响后台(HLht)与其它主题；
   3. 品牌色取自 Logo：红 #cc0001 / 深灰 #262626。
   引入方式：在 BottomNav1.ascx / Controls/BottomNav.ascx /
             partner.aspx 中，紧随 main.css 之后引入本文件。
   ========================================================= */


/* ---------------- 全局 ---------------- */
/* 整体背景：还原主题自带的 bodybj.gif（1366×582，main.css 里是 repeat-x）。
   逐像素取样确认这张图是「横向完全均匀的垂直渐变」，所以用等价的纯 CSS 渐变
   替换它：配色 1:1 还原，又不再依赖 1366px 位图（更宽的屏幕要横向平铺、
   高分屏下还是位图拉伸）。取样点如下（y = 距页顶的像素）：
     0    #050505   顶部纯黑，衬在深色页头后面
     105  #1b1b1b   页头下缘
     125  #2b2b2b
     140  #3a3a3a
     160  #4d4c4c
     180  #686767
     200  #7c7a7a
     220  #8c8b8b   页头投影渐隐
     257  #9d9b9b
     258  #ffffff   一条 1px 亮线
     261  #d8deea   淡蓝底（参考图里那段浅蓝）
     285  #e1e5ef
     300  #e6e9f2
     320  #eceff5
     340  #f5f6fa
     360  #fbfbfd
     390  #ffffff   之后全白
   原图纵向 582px，用 background-size 固定住这个长度、横向拉满，
   更长的页面在渐变结束后回落到纯白。 */
body{
	font-size:14px;
	line-height:1.6;
	color:#444;
	background-color:#fff;
	background-image:linear-gradient(to bottom,
		#050505 0, #1b1b1b 105px, #2b2b2b 125px, #3a3a3a 140px, #4d4c4c 160px,
		#686767 180px, #7c7a7a 200px, #8c8b8b 220px, #9d9b9b 257px,
		#ffffff 258px, #ffffff 260px, #d8deea 261px, #e1e5ef 285px,
		#e6e9f2 300px, #eceff5 320px, #f5f6fa 340px, #fbfbfd 360px,
		#ffffff 390px, #ffffff 100%);
	background-repeat:no-repeat;
	background-size:100% 582px;
	-webkit-font-smoothing:antialiased;
}
a{ -webkit-transition:color .15s ease, background .15s ease, opacity .15s ease; transition:color .15s ease, background .15s ease, opacity .15s ease; }
p{ font-size:14px; line-height:1.8; }


/* ---------------- 1. 页头 ---------------- */
/* 原问题：.header_top 固定 75px，而 Logo 实际 100px 高（408x100），
   头部内容向下溢出 45px，压住导航区。 */
.header_top{
	height:auto;                      /* 取消 75px 定高，随内容撑开 */
	overflow:hidden;                  /* 收住内部浮动 */
	padding:16px 0;
	background:#1f1f22;               /* 深色页头：Logo 为深色底，深色页头才能融为一体 */
	border-bottom:3px solid #cc0001;  /* 品牌红分隔线，衔接下方红色导航 */
}
.header_top .header_18{
	display:flex;                     /* Logo 与热线电话左右分布、垂直居中 */
	align-items:center;
	justify-content:space-between;
}
.header_top .logo{ float:none; padding:0; }
.header_top .logo img{
	display:block;
	height:56px;                      /* 原 100px 等比缩小，页头不再超高 */
	width:auto;
	background:none;
	padding:0;
}
.right_login{
	float:none;
	width:auto;
	background:none;                  /* 去掉 10x36 切图平铺出的条纹背景 */
	padding:0;
}
.header_top .right_login .telBox{ display:flex; align-items:center; }
.header_top .divclear{
	float:none;
	width:auto;
	padding:0;
	margin-right:12px;
	color:#9d9da2;                    /* “全国统一服务热线”说明文字 */
	font-size:14px;
}
.header_top .header_tel{
	float:none;
	padding-top:0;
	color:#fff;                       /* 深色页头上的号码用白色最醒目 */
	font-size:26px;
	font-weight:700;
	font-family:Arial,"Microsoft YaHei";
	letter-spacing:1px;
	line-height:1;
}


/* ---------------- 2. 主导航 ---------------- */
/* 原问题：导航条无背景（nav_bj.jpg 等切图缺失），仅靠 body 背景图
   顶部深色带撑场面；且 .div_leftkong 占 298px 空白、菜单整体偏左。 */
.container_ban{
	height:auto;
	background:#cc0001;               /* 品牌红导航条 */
	box-shadow:0 2px 6px rgba(0,0,0,.18);
}
.container_ban .content{ display:flex; }
.div_leftkong{ display:none; }        /* 删除 298px 占位空块 */
.nav_navbar{
	float:none;
	width:100%;
	display:flex;
}
.nav_navbar > li{
	float:none;
	flex:1 1 auto;
	text-align:center;
}
.nav_navbar > li > a{
	display:block;
	height:56px;
	line-height:56px;
	padding:0 10px;
	font-size:16px;
	color:#fff;
	letter-spacing:2px;
	text-shadow:none;
}
.nav_navbar > li > a:hover{
	color:#fff;
	background:rgba(0,0,0,.16);       /* 悬停加深 */
	box-shadow:inset 0 -4px 0 rgba(255,255,255,.9);
}


/* ---------------- 3. 主体两栏容器 ---------------- */
/* 原问题：.divfelt/.divright 固定 600px 高，右栏实际内容 ~676px，
   溢出压到下方友情链接区；.boxcontent 因内部全浮动而高度塌陷。 */
.divbox{ padding:20px 0 8px; min-height:0; }
.boxcontent{
	background:#fff;                  /* boxbj.gif 本身即白底卡片，改纯色+投影 */
	border-radius:6px;
	box-shadow:0 3px 14px rgba(0,0,0,.08);
	padding:20px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
	height:auto;
	min-height:0;
}
.boxcontent::after{ content:""; display:table; clear:both; }   /* 清除浮动，高度恢复正常 */

.divright{
	float:left;
	width:300px;
	margin:0;
	height:auto;
	min-height:0;
}
.divfelt{
	float:right;
	width:640px;                      /* 1000 - 20*2(容器内边距) - 300 - 20(栏间距) */
	height:auto;
	min-height:0;
}


/* ---------------- 4. Banner 轮播 ---------------- */
.div_banner_h{ float:none; width:100%; height:auto; }
.slick{
	width:100%;
	height:220px;
	margin-bottom:0;
	border-radius:6px;
	overflow:hidden;
	box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.slick img{
	width:100%;
	height:220px;
	object-fit:cover;                 /* 1920x460 素材裁切填充，不再拉伸变形 */
}
/* ---- 轮播的左右箭头与导航点 ----
   slick.css 里 .slick-slider 自带 margin-bottom:30px，箭头默认放在
   left/right:-25px（在画面外）—— 会被上面 .slick 的 overflow:hidden 直接裁掉，
   导航点则用 margin-top:-30px 硬拽上来。这里统一压回画面内侧。 */
.slick.slick-slider{ margin-bottom:0; }
.slick .slick-prev,
.slick .slick-next{
	top:50%;
	width:36px; height:36px;
	margin-top:-18px;
	border-radius:50%;
	background:rgba(0,0,0,.28);
	z-index:2;
	opacity:.65;                      /* 平时半透明可见，悬停变实 */
	-webkit-transition:opacity .2s ease, background-color .2s ease;
	transition:opacity .2s ease, background-color .2s ease;
}
.slick .slick-prev{ left:10px; }
.slick .slick-next{ right:10px; }
.slick:hover .slick-prev,
.slick:hover .slick-next{ opacity:1; }
.slick .slick-prev:hover,
.slick .slick-next:hover{ background:rgba(204,0,1,.85); }
.slick .slick-prev:before,
.slick .slick-next:before{
	font-family:"slick";
	font-size:16px;
	line-height:36px;
	color:#fff;
	opacity:1;
}
.slick .slick-prev.slick-disabled:before,
.slick .slick-next.slick-disabled:before{ opacity:.3; }
/* 导航点：贴在 Banner 底部居中，未选中半透明白，选中品牌红 */
.slick .slick-dots{
	bottom:10px;
	margin-top:0;
	z-index:2;
}
.slick .slick-dots li{
	width:12px; height:12px;
	margin:0 4px;
}
.slick .slick-dots li button{
	width:12px; height:12px;
	padding:0;
	border-radius:50%;
	background:rgba(255,255,255,.55);
	box-shadow:0 1px 3px rgba(0,0,0,.25);
	-webkit-transition:background-color .2s ease, -webkit-transform .2s ease;
	transition:background-color .2s ease, transform .2s ease;
}
.slick .slick-dots li button:before{ content:none; }   /* 去掉 slick 自带的 • 字符 */
.slick .slick-dots li.slick-active button{
	background:#cc0001;
	-webkit-transform:scale(1.15);
	transform:scale(1.15);
}


/* ---------------- 5. 公告 / 通知选项卡 ---------------- */
/* 结构：Default.aspx 里只留空的 #tab > ul 与 #cont 两个占位容器，
   标签文字、先后顺序、栏目名与文章列表全部由 Default.aspx.cs 的
   CreateGrant() 依据后台栏目表动态生成（原来是写死的两个 li 与 News1/News2）。 */
#grant{
	width:100%;
	height:auto;                      /* 原 180px 定高放不下 5 条新闻 */
	margin:16px 0 0;
	border:1px solid #e6e6e6;
	border-top:3px solid #cc0001;
	border-radius:0 0 4px 4px;
	background:#fff;
	overflow:hidden;                  /* 让圆角裁掉 tab 的灰底 */
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
#tab{
	height:46px;
	background:#f7f7f7;
	border-bottom:1px solid #e6e6e6;
}
#tab ul{ margin:0; padding:0; height:46px; list-style:none; }
#tab ul li{
	float:left;
	position:relative;
	width:auto;
	min-width:132px;
	height:45px;
	line-height:45px;
	margin:0;
	padding:0 26px;
	border:none;
	background:none;
	color:#666;
	font-size:15px;
	text-align:center;
	cursor:pointer;
	-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;
	-webkit-box-sizing:border-box; box-sizing:border-box;
	-webkit-transition:color .15s ease, background .15s ease;
	transition:color .15s ease, background .15s ease;
}
#tab ul li:hover{ color:#cc0001; }
#tab ul li.hover{                   /* setTab() 激活态类名为 hover */
	border:none;
	background:#cc0001;
	color:#fff;
	font-weight:bold;
	filter:none;                      /* 清掉旧版 IE 渐变滤镜 */
}
#tab ul li.hover:hover{ color:#fff; }
#tab ul li.hover:after{             /* 激活态下方的小三角，指向内容区 */
	content:"";
	position:absolute;
	left:50%;
	bottom:-1px;
	width:0;
	height:0;
	margin-left:-6px;
	border:6px solid transparent;
	border-top-color:#cc0001;
	border-bottom-width:0;
}
#cont{
	min-height:126px;                 /* 各栏目条数不同，给个下限避免切 tab 时高度乱跳 */
	margin:0;
	padding:4px 18px 14px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
#grant .product_3SS{ padding-left:0; }   /* 去掉真实新闻列表的额外缩进 */
#grant .s4_n ul{ margin:0; padding:0; list-style:none; }
/* 行样式大部分由第 16 节的 .product_3SS ul li 提供，这里只做本区块的收尾修正 */
#grant .s4_n li{
	width:auto;                       /* 原 640px 与容器不匹配 */
	min-height:36px;
	line-height:36px;
	margin:0;
	padding:0 2px;
	color:#555;                       /* 原 olive 橄榄绿过时 */
	border-bottom:1px dashed #e9e9e9;
	-webkit-transition:background .15s ease; transition:background .15s ease;
}
#grant .s4_n li:hover{ background:#fcfcfc; }
#grant .s4_n li a{ color:#555; }
#grant .s4_n li a:hover,
#grant .s4_n li:hover .teb_litext_left a{ color:#cc0001; text-decoration:none; }
/* 标题给右侧日期让出固定宽度，超出部分省略号收尾（原来写死 85%，长日期会换行） */
#grant .s4_n li .teb_litext_left{
	float:left;
	width:auto;
	max-width:74%;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
#grant .s4_n li .teb_litext_left img{ margin:-2px 6px 0 0; vertical-align:middle; }
#grant .s4_n li .date_right{
	float:right;
	width:auto;
	margin-left:10px;
	color:#999;
	font-size:12px;
	font-family:Arial,Helvetica,sans-serif;
}
/* 「更多」行：不再跟着列表画分隔虚线 */
#grant .s4_n li.s4_more{ border-bottom:none; }
#grant .s4_n li .new_t2{ float:right; color:#999; font-size:12px; }
#grant .s4_n li .new_t2 a{ color:#cc0001; font-size:12px; }
#grant .s4_n li .new_t2 a:hover{ color:#a80001; text-decoration:none; }
#grant .s4_n li .new_t2 a:after{ content:"\203A"; margin-left:2px; }
/* 该栏目暂无文章时的占位行 */
#grant .s4_n li.s4_empty{
	height:96px;
	line-height:96px;
	border-bottom:none;
	color:#bbb;
	text-align:center;
}
#grant .s4_n li.s4_empty:hover{ background:none; }


/* ---------------- 6. 服务中心图标区 ---------------- */
.div_help{
	float:none;
	width:100%;
	margin-top:16px;
	padding:0;
	background:#fff;
	border:1px solid #e6e6e6;
	border-top:3px solid #cc0001;
	border-radius:0 0 4px 4px;
	overflow:hidden;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.div_help .help_head{
	height:41px;
	line-height:41px;
	padding:0 14px;
	background:#f7f7f7;
	border-bottom:1px solid #e6e6e6;
	color:#333;
	font-size:15px;
	font-weight:bold;
}
.div_help ul{ list-style:none; margin:0; padding:0; }
.div_help ul:after{ content:""; display:block; clear:both; }
.div_help ul li{
	float:left;
	width:25%;
	margin:0;
	padding:18px 6px 16px;
	list-style:none;
	text-align:center;
	border-right:1px solid #f2f2f2;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.div_help ul li:last-child{ border-right:none; }
.div_help a{
	display:block;
	text-decoration:none;
	-webkit-transition:-webkit-transform .15s ease; transition:transform .15s ease;
}
.div_help a:hover{ transform:translateY(-4px); text-decoration:none; }
.div_help .help_icon{
	display:block;
	width:60px; height:60px;
	margin:0 auto 8px;
	padding:8px;
	background:#fdf3f3;               /* 淡红底衬，突出红色图标 */
	border:1px solid #f7dcdc;
	border-radius:14px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
	-webkit-transition:all .18s ease; transition:all .18s ease;
}
.div_help a:hover .help_icon{
	background:#cc0001;
	border-color:#cc0001;
}
.div_help .help_icon img{
	display:block;
	width:100%;
	height:100%;
	object-fit:contain;
}
.div_help a span{
	display:block;
	color:#555;
	font-size:14px;
	line-height:1.4;
	-webkit-transition:color .15s ease; transition:color .15s ease;
}
.div_help a:hover span{ color:#cc0001; }


/* ---------------- 7. 首页左右两栏等高布局 ---------------- */
/* 原问题：左栏内容比右栏短，快件跟踪下方留出一大块空白。
   改用 flex 让两栏等高，并让快件跟踪的输入框自动撑满剩余高度。 */
.boxcontent_home{
	display:-webkit-flex;
	display:flex;
	-webkit-align-items:stretch; align-items:stretch;
}
.boxcontent_home .divright{
	float:none;
	width:300px;
	-webkit-flex:0 0 300px; flex:0 0 300px;
	display:-webkit-flex; display:flex;
	-webkit-flex-direction:column; flex-direction:column;
}
.boxcontent_home .divright > .nTab,
.boxcontent_home .divright > .divpricetop2{
	-webkit-flex:0 0 auto; flex:0 0 auto;
}
.boxcontent_home .divfelt{
	float:none;
	width:auto;
	min-width:0;
	margin-left:20px;
	-webkit-flex:1 1 auto; flex:1 1 auto;
}
.boxcontent_home .div_trcak{
	-webkit-flex:1 1 auto; flex:1 1 auto;
	display:-webkit-flex; display:flex;
	-webkit-flex-direction:column; flex-direction:column;
}
.boxcontent_home .div_trcak form{
	-webkit-flex:1 1 auto; flex:1 1 auto;
	display:-webkit-flex; display:flex;
	-webkit-flex-direction:column; flex-direction:column;
}
.boxcontent_home .track_tex1{
	-webkit-flex:1 1 auto; flex:1 1 auto;
	height:auto;
	min-height:140px;
}
.boxcontent_home .div_input_f{
	-webkit-flex:0 0 auto; flex:0 0 auto;
}


/* ---------------- 8. 左栏：运费计算 / 客户登录 ---------------- */
.nTab{ float:none; width:100%; height:auto; min-height:0; margin-top:0; }
.nTab .TabTitle{ background:none; overflow:hidden; }
.nTab .TabTitle ul{ margin:0; padding:0; }
.nTab .TabTitle li{
	float:left;
	width:50%;
	height:40px;
	line-height:40px;
	margin:0;
	padding:0;
	text-align:center;
	cursor:pointer;
	background:#ececec;               /* 未选中：浅灰 */
	color:#777;
	font-size:14px;
	border:1px solid #e0e0e0;
	border-bottom:none;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.nTab .TabTitle li + li{ border-left:none; }
.nTab .TabTitle li.active{
	background:#cc0001;
	border-color:#cc0001;
	color:#fff;
	font-weight:bold;
}
.nTab .TabContent{
	width:100%;
	height:auto;
	min-height:0;
	margin:0;
	padding:14px;
	background:#fff;
	border:1px solid #e6e6e6;
	border-radius:0 0 4px 4px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
/* 清掉旧样式给 iframe 外层 li 加的定宽/虚线。
   这里必须限定成直接子级 ul>li：原来写的是后代选择器
   （#myTab0_Content0 ul li，优先级 1,0,2），会连同下面运费计算表单里的
   .div_price > ul > li（0,1,2）一起命中，把表单两行的 line-height 压成
   normal，行高只能由控件自己撑，两行间距就忽大忽小 —— 已经收窄。 */
#myTab0_Content0 ul, #myTab0_Content1 ul{ height:auto; }
#myTab0_Content0 > ul > li, #myTab0_Content1 > ul > li{
	width:auto; height:auto; line-height:normal; margin:0; padding:0;
	border:none; background:none;
}
#myTab0_Content0 > ul > li a{ padding-left:0; }
.parter_li{
	float:none; width:100%; height:140px; margin:0;
	border:none; display:block;
}                                  /* 运费计算 iframe 撑满选项卡 */
/* 客户登录（#myTab0_Content1）：与运费计算用同一套栅格 ——
   左侧 58px 标签栏 + 右侧通栏控件，三行等高 36px，行距 10px，按钮上方 12px。
   原来这两行被 main.css:1261 的 #myTab0_Content1 ul li（优先级 1,0,2）
   压成 height:20px、margin-left:20px、右边还留 277px 定宽，
   而里面的输入框是 34px 高，于是行行互相压、按钮紧贴输入框。 */
.div_login{ width:100%; height:auto; margin-top:0; }
.div_login > ul{ margin:0; padding:0; }
.div_login > ul > li{
	float:none;
	position:relative;
	width:100%; height:36px;
	line-height:36px;
	margin:0 0 10px; padding:0 0 0 58px;
	color:#666; font-size:13px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
/* 第三行是登录按钮，不吃标签栏，宽度与上面两个输入框一致 */
.div_login > ul > li:last-child{
	height:auto;
	margin:12px 0 0;
	padding-left:0;
}
/* main.css:1261 那条会压掉上面的规则，这里用带 ID 的选择器盖回来 */
#myTab0_Content1 .div_login > ul > li{
	float:none;
	width:100%; height:36px;
	margin:0 0 10px; padding:0 0 0 58px;
}
#myTab0_Content1 .div_login > ul > li:last-child{
	height:auto;
	margin:12px 0 0;
	padding-left:0;
}
.div_input_l{
	display:block;
	width:100%; height:36px; line-height:34px;
	margin:0; padding:0 10px;
	text-indent:0;
	border:1px solid #d9d9d9; border-radius:4px;  /* 与运价下拉框同一套外观 */
	color:#555; font-size:13px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.div_input_l:focus{
	outline:none;
	border-color:#cc0001;
	box-shadow:0 0 0 2px rgba(204,0,1,.12);
}
/* 登录按钮（.div_input）的外观统一见文末「26. 按钮统一」，
   与上方输入框的 12px 间距由上面 li:last-child 的 margin-top 负责。 */
/* 运费计算表单（.div_price，原在 partner.aspx，现在已内联进首页）
   ------------------------------------------------------------
   原问题：
   1) 第一行是 chosen 把 <select class="country"> 改写出来的 .chosen-single
      （灰色渐变底、1px #aaa 边框、5px 圆角、line-height:24px ≈ 26px 高，
       chosen.js 还内联写死 width:175px）；第二行是 .weight
      （白底、#d9d9d9 边框、3px 圆角、30px 高、150px 宽）。
      同一屏两个控件宽度/高度/圆角/底色全不一样，而且都只有 150~175px，
      下方的「计算」按钮却是通栏 270px，重心整个偏了；
   2) 上面那条 #myTab0_Content0 ul li 重置把两行的 line-height 压成 normal，
      行高只能靠控件撑，行距不均（已收窄为直接子级）；
   3) .div_input_p{ margin:2px 0 0 } 让按钮紧贴第二行。
   统一为：左侧 58px 标签栏 + 右侧通栏控件，三行等高 36px，行距 10/12px。 */
.div_price{
	float:none; width:100%; height:auto; margin:0; padding:0;
	background:#fff; border-radius:0;
	font-size:13px; color:#555;
}
.div_price ul{ margin:0; padding:0; }
/* 用 > ul > li 精确命中表单两行：写成后代选择器的话会连
   chosen 下拉里的 .chosen-results li 一起套上 58px 缩进和 36px 行高。 */
.div_price > ul > li{
	float:none;
	position:relative;
	width:100%; height:36px;
	line-height:36px;
	margin:0 0 10px; padding:0 0 0 58px;
	font-size:13px; color:#666;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.div_price > ul > li:last-child{ margin-bottom:0; }
/* main.css:1258 另有一条 #myTab0_Content0 ul li{ width:280px; height:20px;
   line-height:20px; margin-left:20px; border-bottom:1px dashed #999 }（优先级 1,0,2），
   是当年给「ul>li>iframe」结构写的；表单内联进来后它会把两行压成 20px 高、
   右侧留 280px 定宽、还带一条虚线，所以这里用带 ID 的选择器把它盖回去。 */
#myTab0_Content0 .div_price > ul > li{
	width:100%; height:36px;
	line-height:36px;
	margin:0 0 10px;
	padding:0 0 0 58px;
	border-bottom:none;
}
/* 两个选项卡共用的标签：统一落在左侧 58px 的栏里，
   右侧控件因此左右边缘都能对齐（运费计算 / 客户登录 都挂 .form_label） */
.form_label{
	position:absolute; left:0; top:0;
	width:58px; line-height:36px;
	color:#666; font-size:13px;
}
/* 这行里那个空的 <label class="control-label" for="weight"> 不再占位 */
.div_price > ul > li label.control-label{ display:none; }

/* ---- 地区下拉：把 chosen 的壳改成与输入框同一套外观 ---- */
.div_price .chosen-container{ width:100% !important; }  /* 反超 chosen.js 内联的 width:175px */
.div_price .chosen-container-single .chosen-single{
	height:36px;
	line-height:34px;
	padding:0 30px 0 10px;
	border:1px solid #d9d9d9;
	border-radius:4px;
	background:#fff;
	box-shadow:none;
	color:#555;
	font-size:13px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.div_price .chosen-container-single .chosen-single span{
	margin-right:0; line-height:34px; color:#555;
}
/* 原箭头是个空壳（div b 没背景），这里补一个纯 CSS 三角 */
.div_price .chosen-container-single .chosen-single div{
	top:0; right:0; width:30px; height:100%; background:none;
}
.div_price .chosen-container-single .chosen-single div b{
	position:relative; background:none;
}
.div_price .chosen-container-single .chosen-single div b:after{
	content:"";
	position:absolute; top:50%; right:10px;
	margin-top:-2px;
	width:0; height:0;
	border-left:4px solid transparent;
	border-right:4px solid transparent;
	border-top:5px solid #999;
}
/* 展开态：保持同一套边框，只换品牌色高亮，别再用原来的蓝色发光 */
.div_price .chosen-container-active .chosen-single{
	border-color:#cc0001;
	background:#fff;
	box-shadow:0 0 0 2px rgba(204,0,1,.12);
}
.div_price .chosen-container-active.chosen-with-drop .chosen-single{
	border-radius:4px 4px 0 0;
}
.div_price .chosen-container .chosen-drop{
	border:1px solid #d9d9d9;
	border-top:0;
	border-radius:0 0 4px 4px;
	box-shadow:0 8px 18px rgba(0,0,0,.10);
}
/* 下拉项：main.css 的 .div_price ul li 给它们压了 48px 定高，一并收一下 */
.div_price .chosen-results li{
	height:auto; min-height:26px;
	margin:0; padding:5px 8px;
	line-height:20px;
}
.div_price .chosen-results li.highlighted{ background:#cc0001; }  /* 原为橙色 #ff5c00 */

/* ---- 重量输入框：与上面的下拉同宽同高 ---- */
.div_price .weight{
	display:block;
	width:100%; height:36px;
	line-height:34px;
	margin:0; padding:0 10px;
	border:1px solid #d9d9d9;
	border-radius:4px;
	text-indent:0;
	color:#555; font-size:13px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.div_price .weight:focus{
	outline:none;
	border-color:#cc0001;
	box-shadow:0 0 0 2px rgba(204,0,1,.12);
}

/* ---- 计算按钮：与上方两行同宽，间距 12px ---- */
.div_price .div_input_p{ float:none; width:auto; height:auto; margin:12px 0 0; }
.div_price .div_input_finputp{ border-radius:4px; }

.weight{
	width:150px; height:30px; margin:0 0 0 2px;
	border:1px solid #d9d9d9; border-radius:3px; text-indent:6px;
}
.div_input_p{ float:none; width:auto; height:auto; margin:2px 0 0; }
.div_input_finputp{
	float:none;
	width:100%; height:34px; line-height:34px;
	margin:0;
	background:#cc0001;
	border:none; border-radius:3px;
	color:#fff; cursor:pointer; font-size:14px;
}


/* ---------------- 9. 左栏：运单跟踪 ---------------- */
.divpricetop2{
	float:none;
	width:100%;
	height:42px;
	margin:16px 0 0;
	padding:0;
	background:#f7f7f7;
	border:1px solid #e6e6e6;
	border-top:3px solid #cc0001;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.divpricetop2 .panel_title{
	display:block;
	height:41px;
	line-height:41px;
	padding:0 14px;
	color:#333;
	font-size:15px;
	font-weight:bold;
}
.div_trcak{
	float:none;
	width:100%;
	height:auto;
	margin:0;
	padding:14px;
	background:#fff;
	border:1px solid #e6e6e6;
	border-top:none;
	border-radius:0 0 4px 4px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.track_tex1{
	width:100%;
	height:140px;
	margin:0;
	padding:8px 10px;
	border:1px solid #d9d9d9;
	border-radius:3px;
	color:#666;
	font-size:13px;
	line-height:1.7;
	font-family:"Microsoft YaHei";
	resize:vertical;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.div_input_f{ float:none; width:auto; height:auto; margin:12px 0 0; }
.div_input_finput{
	float:none;
	min-width:86px;
	height:32px; line-height:32px;
	margin:0 10px 0 0;
	padding:0 18px;
	background:#cc0001;
	border:none;
	border-radius:3px;
	color:#fff;
	font-size:13px;
	cursor:pointer;
}
/* .div_input_finput 的 hover / active / focus 统一见文末「26. 按钮统一」。 */


/* ---------------- 10. 友情链接区 ---------------- */
.divpant{ margin-top:20px; }
.divpant .content{
	background:#fff;
	border-radius:6px;
	padding:16px 12px;
	box-shadow:0 3px 14px rgba(0,0,0,.06);
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.divpant .zlink img{ max-width:150px; height:auto; }   /* 170px 图略宽于 157px 单元格，缩放避免溢出 */
.divpant table{ width:100%; }
.partner_a{ display:inline-block; margin:0 10px 10px 0; }
.partner_a img{
	display:block;
	background:#fff;
	border:1px solid #e8e8e8;
	border-radius:3px;
}
.partner_a:hover img{ border-color:#cc0001; }


/* ---------------- 11. 页脚 ---------------- */
/* 这里必须保持 main.css 的 float:left，不能改成 float:none：
   页头 .header_top 与主体 .divbox 都是浮动元素，页脚一旦变成常规块，
   位置就不再排在浮动之后，而会落到 y=0，并且高度被撑满整页
   （实测 #footer 高 1134px、覆盖整站），
   结果就是这层 #1f1f22 把 body 的整体背景整片盖住 —— 背景渐变永远看不见。
   保持浮动后页脚才正常落在内容下方，body 背景才能在两侧露出来。 */
#footer{
	float:left;
	width:100%;
	padding:20px 0;
	background:#1f1f22;               /* 深色页脚，与深色页头首尾呼应 */
	border-top:3px solid #cc0001;
}
#footer .cpyright{ line-height:26px; font-size:13px; color:#9d9da2; }
#footer .cpyright a{ color:#9d9da2; }
#footer .cpyright a:hover{ color:#fff; text-decoration:none; }


/* ---------------- 13. 内页两栏（Content / Articles / Albums / Products） ---------------- */
/* 原问题：.divcleft 670px + .divcright 320px = 990px，而 .boxcontent 加了
   20px 内边距后可用宽度只有 960px，右栏被挤到下一行、页面高度异常。 */
.divcleft{
	float:left;
	width:640px;                      /* 960 - 300 - 20(栏间距) */
	min-height:0;
	margin:0;
}
.divcright{
	float:right;
	width:300px;
	min-height:0;
	margin:0;
}
.divcright > div{ margin-bottom:16px; }   /* 侧栏各块之间留白 */
.divcright .col-md-12, .divcright .box-margin-top{ padding:0; margin:0 0 16px; }


/* ---------------- 14. 面包屑 ---------------- */
.acticle_header{
	float:none;
	width:100%;
	margin:0 0 14px;
	padding:0 0 10px;
	border-bottom:1px solid #ececec;
	color:#999;
	font-size:13px;
	line-height:1.6;
}
.acticle_header a{ color:#666; }
.acticle_header a:hover{ color:#cc0001; text-decoration:none; }
.acticle_headerspan{               /* 原固定 62px 宽导致标题被截断 */
	width:auto;
	max-width:72%;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	margin-left:4px;
	color:#262626;
}


/* ---------------- 15. 栏目标题条（title2 / divtitle2） ---------------- */
/* 原问题：依赖 bt2.gif / bt4-bt1.gif 切图定宽 630px/290px，与新版容器不匹配。 */
.div_vv{ float:none; width:100%; margin:0 0 6px; }
.title2, .divtitle2{
	float:none;
	width:100%;
	height:auto;
	margin:0 0 14px;
	padding:0 0 10px;
	background:none;                  /* 去掉切图背景，改为品牌红下划线 */
	border-bottom:2px solid #cc0001;
	overflow:hidden;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
/* 选择器必须带 span：main.css 写的是 `.divtitle2 span.titlename`
   （优先级 0,2,1），只用 `.divtitle2 .titlename`（0,2,0）压不住，
   侧栏「新闻分类」会继续显示旧版绿色 >>> 切图 bt4-bt1.gif。 */
.title2 span.titlename, .divtitle2 span.titlename,
.title2 .titlename, .divtitle2 .titlename{
	float:left;
	width:auto;
	height:auto;
	line-height:28px;
	padding:0 14px 0 0;
	background:none;
	color:#262626;
	font-size:18px;
	font-weight:700;
	text-align:left;
	cursor:default;
}
.title2 span.more{
	float:right;
	height:auto;
	line-height:28px;
	background:none;
}
.title2 span.more a{ color:#999; font-size:13px; margin:0 4px; }
.title2 span.more a:hover{ color:#cc0001; text-decoration:none; }


/* ---------------- 16. 文章 / 新闻 / 下载列表 ---------------- */
.product_3, .product_3SS, .product_1, .product_2, .img_3{
	float:none;
	width:100%;
	margin:0;
	padding:0;
	border-top:none;
}
.product_3 ul li, .product_3SS ul li, .product_2 ul li, .img_3 ul li{
	width:100%;
	height:auto;
	min-height:36px;
	line-height:36px;
	margin:0;
	padding:0 4px;
	border-bottom:1px dashed #ececec;
	overflow:hidden;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.product_3 ul li a, .product_3SS ul li a, .product_2 ul li a, .img_3 ul li a{
	font-size:14px;
	color:#555;
	padding-left:6px;
}
.product_3 ul li a:hover, .product_3SS ul li a:hover,
.product_2 ul li a:hover, .img_3 ul li a:hover{
	color:#cc0001;
	text-decoration:none;
}
.product_3 ul li .pull-right, .product_3 ul li .date,
.product_3SS ul li .date_right, .img_3 ul li .date_right{
	float:right;
	margin-left:10px;                 /* 与标题之间留白，标题过长时可被省略号收掉 */
	color:#aaa;
	font-size:12px;
	font-family:Arial,Helvetica,sans-serif;
}
.product_1 ul li a{ font-size:14px; line-height:36px; padding-left:6px; }
/* 内页图片自适应，避免固定宽高在 640px 栏内溢出/变形（如产品列表 200x120 固定图） */
.divcleft img{ max-width:100%; height:auto; }
.product_3 .row, .img_3 .row{ margin:0 -8px; }
.product_3 .row > div, .img_3 .row > div{ padding:0 8px 16px; }


/* ---------------- 17. 分页 ---------------- */
.pager{
	height:auto;
	line-height:normal;
	padding:18px 0 8px;
	text-align:center;
	clear:both;
}
.pager a{ color:#666; text-decoration:none; }
.pager a:hover{ color:#cc0001; }
.pager input.PagerBtn, .pager input.PagerInput{
	height:28px; line-height:26px;
	border:1px solid #dcdcdc; border-radius:3px;
	background:#fff;
}


/* ---------------- 18. 侧栏登录框（Controls/Contact.ascx） ---------------- */
.celogin{
	float:none;
	width:100%;
	height:auto;
	margin:0 0 16px;
	padding:0;
	border:1px solid #e6e6e6;
	border-radius:4px;
	background:#fff;
	overflow:hidden;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.celongimg{                        /* 原为 290px 切图标题条 */
	float:none;
	width:100%;
	height:40px;
	background:#cc0001 url(bt3-bt1.gif) no-repeat left center;
}
.celogin ul{
	float:none;
	width:100%;
	margin:0;
	padding:14px;
	background:#fff;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.celogin ul li{
	float:none;
	width:100%;
	height:auto;
	margin-bottom:12px;
}
.celogin ul li span{
	float:none;
	display:inline-block;
	width:58px;
	color:#666;
	font-size:13px;
	vertical-align:middle;
}
.celogin_input{
	width:180px;
	height:32px;
	line-height:32px;
	padding:0 8px;
	border:1px solid #d9d9d9;
	border-radius:3px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.celogin_inputb{
	width:104px;
	height:32px;
	margin:0;
	background:#cc0001;
	border:none;
	border-radius:3px;
	color:#fff;
	cursor:pointer;
}


/* ---------------- 19. 内页广告条 ---------------- */
.divcebanner{
	float:none;
	width:100%;
	height:auto;
	margin:0 0 16px;
}
.divcebanner img{
	width:100%;
	height:auto;
	margin-left:0;
	border-radius:4px;
	display:block;
}


/* ---------------- 20. 正文内容区 ---------------- */
.divContentDiv{
	float:none;
	width:100%;
	margin:0;
	padding:0;
	font-size:14px;
	line-height:1.9;
	color:#444;
	word-wrap:break-word;
}
.divContentDiv img{ max-width:100%; height:auto; }
.divContentDiv table{ max-width:100%; }


/* ---------------- 21. Bootstrap 容器宽度与站点栅格对齐 ---------------- */
/* 原问题：Comments / Downloads / Recruit 用 .container 布局，
   bootstrap 默认 970/1170px，与其余页面 1000px 版心不一致。 */
.container{ width:1030px; max-width:1030px; }   /* 含左右 15px 内边距后正好 1000px 版心 */


/* ---------------- 22. 窄屏降级（<1000px） ---------------- */
@media (max-width:1040px){
	.container{ width:100%; max-width:none; }
}
@media (max-width:1000px){
	.content, .boxcontent{
		width:100%;
		-webkit-box-sizing:border-box; box-sizing:border-box;
	}
	.header_top .header_18{ -webkit-flex-wrap:wrap; flex-wrap:wrap; }
	.header_top .logo{ margin-bottom:8px; }
	.divfelt, .divright{
		float:none;
		width:100%;
		margin:0 0 16px;
	}
	.boxcontent_home{ display:block; }
	.boxcontent_home .divright{ width:100%; }
	.boxcontent_home .divfelt{ width:100%; margin-left:0; }
	.boxcontent_home .div_trcak,
	.boxcontent_home .div_trcak form{ display:block; }
	.boxcontent_home .track_tex1{ height:140px; }
	.divcleft, .divcright{
		float:none;
		width:100%;
		margin:0 0 16px;
	}
	.divpant .content{ margin:0 10px; width:auto; }
	.header_top .right_login .telBox{ -webkit-flex-wrap:wrap; flex-wrap:wrap; }
	.header_top .header_tel{ font-size:22px; }
	.nav_navbar{ -webkit-flex-wrap:wrap; flex-wrap:wrap; }
	.nav_navbar > li{ -webkit-flex:1 1 auto; flex:1 1 auto; min-width:88px; }
}


/* =========================================================
   23. 关键布局加固
   ---------------------------------------------------------
   老的 main.css 会在页面底部被重复引入（BottomNav 控件），
   同优先级规则会反超。这里用更高优先级的选择器把版心、
   两栏结构、背景色再钉一次，保证任何加载顺序下都不走样。
   ========================================================= */
html body{
	font-size:14px;
	line-height:1.6;
	color:#444;
	/* 页面整体背景同上面 body 规则（还原 bodybj.gif 的垂直渐变），
	   重复一遍是为了不被 main.css 的 body 背景反超。 */
	background-color:#fff;
	background-image:linear-gradient(to bottom,
		#050505 0, #1b1b1b 105px, #2b2b2b 125px, #3a3a3a 140px, #4d4c4c 160px,
		#686767 180px, #7c7a7a 200px, #8c8b8b 220px, #9d9b9b 257px,
		#ffffff 258px, #ffffff 260px, #d8deea 261px, #e1e5ef 285px,
		#e6e9f2 300px, #eceff5 320px, #f5f6fa 340px, #fbfbfd 360px,
		#ffffff 390px, #ffffff 100%);
	background-repeat:no-repeat;
	background-size:100% 582px;
}
html .divbox{ padding:20px 0 8px; min-height:0; }
html .boxcontent{
	width:1000px;
	height:auto; min-height:0;
	background:#fff;
	border-radius:6px;
	box-shadow:0 3px 14px rgba(0,0,0,.08);
	padding:20px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
html .divbox .divright{
	float:left; width:300px; height:auto; min-height:0; margin:0;
}
html .boxcontent_home{
	display:-webkit-flex; display:flex;
	-webkit-align-items:stretch; align-items:stretch;
}
html .boxcontent_home .divright{
	float:none; width:300px;
	-webkit-flex:0 0 300px; flex:0 0 300px;
	display:-webkit-flex; display:flex;
	-webkit-flex-direction:column; flex-direction:column;
}
html .boxcontent_home .divright > .nTab,
html .boxcontent_home .divright > .divpricetop2{
	-webkit-flex:0 0 auto; flex:0 0 auto;
}
html .boxcontent_home .divfelt{
	float:none; width:auto; min-width:0; margin-left:20px;
	-webkit-flex:1 1 auto; flex:1 1 auto;
}
html .boxcontent_home .div_trcak{
	-webkit-flex:1 1 auto; flex:1 1 auto;
	display:-webkit-flex; display:flex;
	-webkit-flex-direction:column; flex-direction:column;
}
html .boxcontent_home .div_trcak form{
	-webkit-flex:1 1 auto; flex:1 1 auto;
	display:-webkit-flex; display:flex;
	-webkit-flex-direction:column; flex-direction:column;
}
html .boxcontent_home .track_tex1{
	-webkit-flex:1 1 auto; flex:1 1 auto;
	height:auto; min-height:140px;
}
html .divbox .divfelt{
	float:right; width:640px; height:auto; min-height:0;
}
html .divbox .divcleft{
	float:left; width:640px; min-height:0; margin:0;
}
html .divbox .divcright{
	float:right; width:300px; min-height:0; margin:0;
}
html .divright .nTab{ float:none; width:100%; height:auto; min-height:0; }
html .divright .nTab .TabTitle li{
	width:50%; height:40px; line-height:40px;
	padding:0; margin:0;
	text-align:center;
	background:#ececec; color:#777; font-size:14px;
	border:1px solid #e0e0e0; border-bottom:none;
}
html .divright .nTab .TabTitle li.active{
	background:#cc0001; border-color:#cc0001; color:#fff; font-weight:bold;
}
html .divright .nTab .TabContent{
	width:100%; height:auto; min-height:0; margin:0; padding:14px;
	background:#fff;
	border:1px solid #e6e6e6; border-top:none;
	border-radius:0 0 4px 4px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
/* 同第 8 节：这里也必须限定为直接子级 ul>li。原来这条 html 前缀的
   （优先级 1,0,3）会连带命中运价表单的两行，把 line-height 压成 normal。 */
html #myTab0_Content0 > ul > li, html #myTab0_Content1 > ul > li{
	width:auto; height:auto; line-height:normal; margin:0; padding:0;
	border:none; background:none;
}
html .divright .parter_li{
	float:none; width:100%; height:140px; border:none; margin:0; display:block;
}
html .divright .divpricetop2{
	float:none; width:100%; height:42px; margin:16px 0 0; padding:0;
	background:#f7f7f7; border:1px solid #e6e6e6; border-top:3px solid #cc0001;
}
html .divright .divpricetop2 .panel_title{
	display:block; height:41px; line-height:41px; padding:0 14px;
	color:#333; font-size:15px; font-weight:bold;
}
html .divright .div_trcak{
	float:none; width:100%; height:auto; margin:0; padding:14px;
	background:#fff; border:1px solid #e6e6e6; border-top:none;
	border-radius:0 0 4px 4px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
html .divright .track_tex1{
	width:100%; height:140px; margin:0; padding:8px 10px;
	border:1px solid #d9d9d9; border-radius:3px;
	color:#666; font-size:13px; line-height:1.7;
	font-family:"Microsoft YaHei"; resize:vertical;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
html .divright .div_input_finput{
	float:none; min-width:86px; height:32px; line-height:32px;
	margin:0 10px 0 0; padding:0 18px;
	background:#cc0001; border:none; border-radius:3px;
	color:#fff; font-size:13px; cursor:pointer;
}
html .div_help{
	float:none; width:100%; margin-top:16px; padding:0;
	background:#fff; border:1px solid #e6e6e6; border-top:3px solid #cc0001;
	border-radius:0 0 4px 4px; overflow:hidden;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
html .div_help .help_head{
	height:41px; line-height:41px; padding:0 14px;
	background:#f7f7f7; border-bottom:1px solid #e6e6e6;
	color:#333; font-size:15px; font-weight:bold;
}
html .div_help ul li{
	float:left; width:25%; margin:0; padding:18px 6px 16px;
	list-style:none; text-align:center; border-right:1px solid #f2f2f2;
}
html .div_help .help_icon{
	display:block; width:60px; height:60px; margin:0 auto 8px; padding:8px;
	background:#fdf3f3; border:1px solid #f7dcdc; border-radius:14px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
html .div_help .help_icon img{
	display:block; width:100%; height:100%; margin:0 auto;
	object-fit:contain; border-radius:0;
}
html .div_help a span{ display:block; color:#555; font-size:14px; line-height:1.4; }
html .container{ width:1030px; max-width:1030px; }
html #footer{
	float:left;                       /* 同第 11 节：不能改成 float:none，否则页脚会铺满整页盖掉背景 */
	width:100%; padding:20px 0;
	background:#1f1f22; border-top:3px solid #cc0001;
}


/* =========================================================
   24. 内页模块排版
       Albums / Articles / Comments / Downloads / Products / Recruit
   ---------------------------------------------------------
   站点内页混着两套骨架：
     A 套（Albums / Articles / Products）
       .divbox > .boxcontent > .divcleft(640) + .divcright(300)
     B 套（Comments / Downloads / Recruit）
       .container > .row > .col-md-9(.col-md-push-3)
                          + .col-md-3(.col-md-pull-9)
   本节把 B 套补齐成与 A 套一致的视觉语言：
   统一版心 + 白底卡片 + 品牌红标题条 + 正文在左 / 侧栏在右。
   ========================================================= */

/* ---------- 24.1 B 套：Banner 容器 ---------- */
/* .containerbanner 在 main.css 里根本没有定义，Comments / Recruit 的
   Banner 会直接贴着浏览器左边缘，既无版心也没有圆角。 */
.containerbanner{
	width:1000px;
	margin:16px auto 0;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.containerbanner .col-md-12{ padding:0; }
.containerbanner img{
	display:block;
	width:100%;
	height:auto;
	border-radius:6px;
}

/* ---------- 24.2 B 套：主体白底卡片 ---------- */
.container-main{
	margin-top:16px;
	padding:20px 5px;               /* 5px + 栅格自带 15px = 与 A 套一致的 20px 内边距 */
	background:#fff;
	border-radius:6px;
	box-shadow:0 3px 14px rgba(0,0,0,.08);
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.container-main > .row{ margin-left:0; margin-right:0; }
.container-main > .row:after{ content:""; display:table; clear:both; }
/* 模板原用 push-3 / pull-9 把侧栏换到了左边，与 Albums / Articles /
   Products 的「正文在左、侧栏在右」正好相反，这里统一到右侧。
   1020px(1030 - 5*2 内边距) = 720 + 300，与 A 套 640 + 300 的比例接近。 */
.container-main > .row > .col-md-9.col-md-push-3{ width:720px; left:0; }
.container-main > .row > .col-md-3.col-md-pull-9{ width:300px; right:0; }

/* ---------- 24.3 A 套：搜索页栅格复位 ---------- */
/* Articles/Search 与 Products/Search 把 B 套的 .col-md-9.col-md-push-3
   塞进了 A 套的 .divcleft(640px)：75% 宽 + left:25% 会让正文缩到 480px
   并整体右移 160px，右侧空出一大块。这里还原成整栏。 */
.divcleft > .col-md-9.col-md-push-3{
	float:none;
	width:100%;
	left:0;
	margin:0;
	padding:0;
}

/* ---------- 24.4 栏目内容容器：去掉过时的蓝色边框 ---------- */
/* .product_4(招聘列表) / .wrapper2(留言) 原为蓝色 #A4CDED 边框，与品牌红
   不搭；它们紧贴 .title2 红色标题条下方，所以只保留左/右/下三边。 */
.product_4, .wrapper2{
	float:none;
	width:100%;
	margin:0 0 16px;
	padding:16px 18px;
	background:#fff;
	border:1px solid #ececec;
	border-top:none;
	border-radius:0 0 4px 4px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}

/* ---------- 24.5 详情页正文排版 ---------- */
.product_3 h4, .img_3 h4, .wrapper2 h4, .divContentDiv h4{
	margin:4px 0 10px;
	color:#262626;
	font-size:20px;
	font-weight:700;
	line-height:1.5;
}
.product_3 > p.text-center, .img_3 > p.text-center{
	margin:0 0 12px;
	color:#999;
	font-size:13px;
}
.product_3 > p.text-center span, .img_3 > p.text-center span{ margin:0 6px; }
.product_3 .first-line-indent,
.img_3 .first-line-indent,
.divContentDiv .first-line-indent{
	margin:0 0 12px;
	color:#444;
	font-size:14px;
	line-height:1.9;
	text-align:justify;
}
/* 上一条 / 下一条：label 与链接的间距和配色 */
.product_3 label, .img_3 label{
	display:inline-block;
	margin:0 6px 0 0;
	color:#999;
	font-weight:400;
}
.product_3 label + span a, .img_3 label + span a{ color:#555; }
.product_3 label + span a:hover, .img_3 label + span a:hover{
	color:#cc0001;
	text-decoration:none;
}

/* ---------- 24.6 文章 / 新闻列表 ---------- */
/* 行结构：<li><span class='atilcleli'>标题</span><span class="date pull-right">日期</span></li>
   标题左浮动 + 单行省略、日期右浮动，两者排在同一行，长标题也不会顶到日期上。
   注意不能用 display:block：块级盒会把后面的浮动日期整个挤到下一行，
   列表行会变成「标题一行 + 日期一行」的双高大个。 */
.product_3 ul li .atilcleli{
	float:left;
	max-width:76%;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
.product_3 ul li .atilcleli img{ margin-right:6px; vertical-align:middle; }
.product_3 ul li .atilcleli a{ padding-left:0; }

/* ---------- 24.7 下载列表 ---------- */
/* 每行是「标题 | 查看详细 / 立即下载」两列，下面跟一行小字信息。 */
.product_3 > .row > .col-md-9,
.product_3 > .row > .col-sm-9,
.product_3 > .row > .col-md-3,
.product_3 > .row > .col-sm-3{ padding-bottom:0; }
.product_3 > .row p{ margin:0 0 4px; }
.product_3 > .row > div:last-child{ text-align:right; white-space:nowrap; }
.product_3 > .row + p{ margin:0 0 12px; color:#999; font-size:13px; }
.product_3 > .row a:hover{ color:#cc0001; text-decoration:none; }

/* ---------- 24.8 招聘列表表格 ---------- */
/* .divtable 在 main.css 中未定义，只有 bootstrap 的 table-hover 生效，
   没有表头底色也没有单元格间距；最后一列是模板留下的空列，一并去掉。 */
.divtable{
	width:100%;
	border-collapse:collapse;
	background:#fff;
	font-size:14px;
}
.divtable th{
	padding:10px 12px;
	background:#f7f7f7;
	border-bottom:2px solid #cc0001;
	color:#333;
	font-size:15px;
	font-weight:700;
	text-align:left;
}
.divtable td{
	padding:10px 12px;
	border-bottom:1px solid #ececec;
	color:#555;
	vertical-align:middle;
}
.divtable tbody tr:hover td{ background:#fbfbfb; }
.divtable th:last-child, .divtable td:last-child{ display:none; }
.divtable .btn-link{ padding:0; color:#cc0001; }
.divtable .btn-link:hover{ color:#a80001; }
/* 原 .bottom_border 用 margin-top:-20px 往上顶，会把表格最后一行压住 */
.bottom_border{ height:0; margin-top:0; border-top:none; }

/* ---------- 24.9 招聘详情左栏信息表 ---------- */
.dtable{ width:100%; border-collapse:collapse; }
.dtable td{
	padding:8px 10px;
	border-bottom:1px dashed #ececec;
	color:#555;
	font-size:14px;
	line-height:1.7;
}
.dtable strong{ color:#333; font-weight:600; }

/* ---------- 24.10 留言列表 ---------- */
.message{
	margin:0 0 14px;
	padding:12px 16px;
	background:#fff;
	border:1px solid #ececec;
	border-radius:4px;
	-webkit-transition:border-color .15s ease, box-shadow .15s ease;
	transition:border-color .15s ease, box-shadow .15s ease;
}
.message:hover{
	border-color:#f0c9c9;
	box-shadow:0 2px 8px rgba(204,0,1,.08);
}
.message .row{ margin:0; }
.message .row > div{ padding:0; }
.message h5{ margin:0 0 6px; font-size:15px; }
.message h5 a{ color:#cc0001; }
.message h5 a:hover{ color:#a80001; text-decoration:none; }
.message .col-md-2, .message .col-sm-2{ text-align:right; white-space:nowrap; }
.message p{ margin:0 0 8px; color:#555; font-size:14px; line-height:1.8; }
/* 后台回复：原来是纯蓝字，改成带品牌红左边线的引用块 */
.comment_reply{
	margin:8px 0 0;
	padding:8px 12px;
	background:#fafafa;
	border-left:3px solid #cc0001;
	border-radius:0 3px 3px 0;
	color:#666;
	font-size:13px;
	line-height:1.8;
}
/* 留言详情里的回复区 */
.bs-dropzone{
	margin:12px 0 16px;
	padding:14px 16px;
	background:#fafafa;
	border:1px solid #ececec;
	border-left:3px solid #cc0001;
	border-radius:0 3px 3px 0;
	color:#666;
	font-size:14px;
	line-height:1.8;
}
/* 提交成功提示：原 width:98% + margin:10px 会撑破容器 */
.comment_info{
	width:auto;
	margin:0 0 16px;
	padding:10px 14px;
	background:#fffbe6;
	border:1px solid #ffe58f;
	border-radius:3px;
	color:#8a6d00;
	font-size:13px;
	line-height:1.7;
}

/* ---------- 24.11 相册 / 产品网格卡片 ---------- */
/* 原来图是靠写死的 style 撑尺寸，列宽一变就被压扁；这里改成固定比例的
   图片框 + 居中裁切，无论原图横竖都能排出整齐的网格。
   只作用于列表的 .row 直系栅格列，首页 owl 轮播的 .item 不受影响。 */
.row > .img-wrap{ margin-bottom:18px; }
.row > .img-wrap > a{
	display:block;
	position:relative;
	height:0;
	padding-bottom:75%;              /* 默认 4:3 */
	overflow:hidden;
	background:#fafafa;
	border:1px solid #eee;
	border-radius:3px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
	-webkit-transition:border-color .18s ease; transition:border-color .18s ease;
}
.row > .img-wrap:hover > a{ border-color:#cc0001; }
.row > .img-wrap > a > img{
	position:absolute;
	top:50%;
	left:50%;
	width:auto;
	height:auto;
	min-width:100%;
	min-height:100%;
	max-width:none;
	max-height:none;
	border:none;
	border-radius:0;
	-webkit-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
}
.img_3 .row > .img-wrap > a{ padding-bottom:75%; }       /* 相册 4:3 */
/* 产品图实测都是正方画布（710×710、680×680、350×350，只有 4 张旧图是 500×400），
   原来用 3:2 的框居中裁切，正方图上下会被切掉约 1/3；改成正方框 + 白底。 */
.product_3 .row > .img-wrap > a{
	padding-bottom:100%;
	background:#fff;
}
.row > .img-wrap p{
	margin:8px 0 0;
	max-height:42px;                 /* 标题最多两行，保证卡片等高 */
	overflow:hidden;
	font-size:14px;
	line-height:1.5;
}
.row > .img-wrap p a{ color:#555; }
.row > .img-wrap:hover p a{ color:#cc0001; text-decoration:none; }

/* ---------- 24.11b 产品列表：一行 3 个 ---------- */
/* 走查发现 Themes/Default/bootstrap.css 把栅格改过：
     .col-md-4 { width:25% }      .col-md-3 { width:33% }
   （与官方定义正好相反，bootstrap - 拷贝.css 里才是标准的 33%/25%）。
   所以产品列表模板里写的 col-md-4 实际排出了 4 列，640px 栏内每格只剩约 160px，
   图片又小又挤、标题栏也压得慌。这里不再依赖被改过的栅格类，直接按「一行 3 个」
   给列宽；视口 <992px 时本规则不生效，仍走模板里的 col-xs-6（一行 2 个）。 */
@media (min-width:992px){
	.product_3 > .row > .img-wrap{ width:33.33333333%; }
}
/* 一列从 160px 放宽到约 215px，图片完整显示（不裁切），标题也相应放大一点。 */
.product_3 .row > .img-wrap > a > img{
	min-width:0;                     /* 覆盖 24.11 的居中裁切，改为等比完整显示 */
	min-height:0;
	max-width:100%;
	max-height:100%;
	padding:8px;                     /* 图片与卡片边框之间留一点呼吸空间 */
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.product_3 .row > .img-wrap > a:hover{
	box-shadow:0 4px 14px rgba(0,0,0,.10);
}
.product_3 .row > .img-wrap p{
	margin:10px 0 0;
	max-height:48px;
	font-size:15px;
}
.product_3 .row > .img-wrap p a{ color:#444; }
.product_3 .row > .img-wrap:hover p a{ color:#cc0001; text-decoration:none; }

/* ---------- 24.12 在线留言 / 在线应聘表单 ---------- */
.form-horizontal .form-group{ margin-bottom:14px; }
.form-horizontal .control-label{ color:#555; font-weight:400; }
.form-horizontal .form-control{ border-color:#d9d9d9; border-radius:3px; }
.form-horizontal .form-control:focus{
	border-color:#cc0001;
	box-shadow:0 0 0 2px rgba(204,0,1,.12);
}
@media (min-width:768px){
	/* 留言表单把输入框压在 col-sm-3(25%) 里，比同页的 textarea 窄一半；
	   标签是 span.control-label，所以这里只放宽 div 那一列。 */
	.form-horizontal div.col-sm-3{ width:50%; }
}
.wrapper2 .btn-primary{
	background:#cc0001;
	border-color:#cc0001;
}
.wrapper2 .btn-primary:hover,
.wrapper2 .btn-primary:focus{
	background:#a80001;
	border-color:#a80001;
}
.wrapper2 .btn-link{ color:#cc0001; }
#CodeImage{
	display:inline-block;
	border:1px solid #d9d9d9;
	border-radius:3px;
	vertical-align:middle;
}
.text-brown{ color:#cc0001; }

/* ---------- 24.13 分页器品牌化 ---------- */
/* AspNetPager 实际输出（7.3.2）：
     <div class="pager text-center">            <- 页面自己包的容器
       <div class="Pager">                      <- 控件根，CssClass="Pager"
         <div class="CustomInfo">…</div>        <- 被 .CustomInfo{display:none} 隐藏
         <div class="Pager" style="width:60%;float:left">
           <a><span class=btnLink>首页</span></a> …
           <span class="CurrentPage"><span class=Pager>1</span></span>
         </div>
       </div>
     </div>
   main.css 里的 `.pager .Pager{padding:2px 0; width:100% !important; margin-top:5px}`
   会同时命中「内层容器 div.Pager」和「页码 span.Pager」：内层容器被拉成
   100% 宽并向左浮动，页码 span 也被 width:100% 撑成整行，再叠上
   `.Pager span span` 的底色，结果就是当前页「1」变成一条通栏红条，
   把 首页/上一页 与 下一页/尾页 挤成上下三行。
   下面用同等 !important + 更高优先级把这两处复位。 */
.pager div.Pager{
	float:none !important;            /* 覆盖内联 style="float:left" */
	width:auto !important;            /* 覆盖 main.css 的 width:100% !important */
	margin:0;
	padding:0;
}
.pager span.Pager{ width:auto !important; }   /* 页码只占按钮自身的宽度 */
/* 只有一页时 AspNetPager 输出的是 disabled 的 <a>（无 href），给它一个不可点的样式 */
.pager .Pager a[disabled]{ cursor:default; }
.pager .Pager a[disabled] span.Pager,
.pager .Pager a[disabled] span.btnLink{
	background:#fafafa;
	border-color:#ededed;
	color:#c2c2c2;
}
.pager{
	height:auto;
	line-height:normal;
	letter-spacing:0;
	padding:18px 0 6px;
}
.pager span.Pager, .pager span.btnLink{
	display:inline-block;
	min-width:28px;
	height:28px;
	line-height:26px;
	margin:0 2px 4px;
	padding:0 8px;
	border:1px solid #dcdcdc;
	border-radius:3px;
	background:#fff;
	color:#666;
	font-size:13px;
	text-decoration:none;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.pager .Pager a{ color:#666; text-decoration:none; }
.pager .Pager a:hover span.Pager,
.pager .Pager a:hover span.btnLink{
	background:#cc0001;
	border-color:#cc0001;
	color:#fff;
}
.pager .Pager span span{
	padding:0;
	background:#cc0001;
	border-color:#cc0001;
	color:#fff;
}
.pager input.PagerInput{
	height:28px;
	width:44px;
	line-height:26px;
	border:1px solid #dcdcdc;
	border-radius:3px;
	text-align:center;
}
.pager input.PagerBtn{
	height:28px;
	line-height:26px;
	margin:0 0 0 4px;
	padding:0 10px;
	background:#cc0001;
	border:1px solid #cc0001;
	border-radius:3px;
	color:#fff;
	font-size:13px;
	cursor:pointer;
}

/* ---------- 24.14 侧栏分类卡片 ---------- */
.divcright .product_1.category,
.divcright .category,
.container-main .category{
	padding:12px 14px;
	background:#fff;
	border:1px solid #ececec;
	border-top:none;
	border-radius:0 0 4px 4px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.category ul{ margin:0; padding:0; list-style:none; }
.category li{ line-height:34px; }
.category li img{ margin-right:6px; vertical-align:middle; }
.category .child{ padding-left:15px; }
.category li a{ color:#555; }
.category li a:hover{ color:#cc0001; text-decoration:none; }
/* .hover_1 是当前分类高亮，原来是蓝色 #09F */
.category li a.hover_1{ color:#cc0001; font-weight:700; }
/* 内页侧栏的分类列表（母版 CategoryDiv 输出的是 .divtitle2 + .product_11，
   不是上面的 .category）：原来是 #e2dfdf 灰色块 + 每行 40px 定高 + 蓝色
   当前项，与上方 .celogin 白底卡片以及品牌色都不统一。 */
.divcright .product_11{
	float:none;
	width:100%;
	margin:0;
	background:#fff;
	border:1px solid #e6e6e6;
	border-top:none;
	border-radius:0 0 4px 4px;
	overflow:hidden;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.divcright .product_11 ul{
	float:none;
	margin:0;
	padding:8px 14px;
}
.divcright .product_11 ul li,
.divcright .product_11 ul li ul li{
	float:none;
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	border-bottom:1px dashed #ececec;
	line-height:36px;
	-webkit-box-sizing:border-box; box-sizing:border-box;
}
.divcright .product_11 ul li:last-child{ border-bottom:none; }
.divcright .product_11 ul li img{ margin-right:6px; vertical-align:middle; }
.divcright .product_11 ul li a,
.divcright .product_11 ul li a:hover{
	display:inline;
	height:auto;
	color:#555;
	font-size:14px;
	line-height:36px;
}
.divcright .product_11 ul li a:hover{ color:#cc0001; }
.divcright .product_11 ul li a.hover_1{ color:#cc0001; font-weight:700; }


/* =========================================================
   25. 内页窄屏降级
   ========================================================= */
@media (max-width:1040px){
	.containerbanner{ width:100%; padding:0 10px; }
}
@media (max-width:991px){
	/* 栅格失效，两栏改为上下堆叠 */
	.container-main > .row > .col-md-9.col-md-push-3,
	.container-main > .row > .col-md-3.col-md-pull-9{
		width:100%;
		left:auto;
		right:auto;
		margin-bottom:16px;
	}
	.product_3 ul li .atilcleli{ max-width:68%; }
	.divtable th, .divtable td{ padding:8px 6px; font-size:13px; }
}


/* =========================================================
   26. 按钮统一
   ---------------------------------------------------------
   走查发现同一屏里的按钮有 5 套写法，尺寸和状态都不一致：
     .div_input          登录      100%×36px  (Default.aspx 客户登录)
     .div_input_finputp  计算      100%×34px  (partner.aspx，iframe 内)
     .div_input_finput   查询      约86×32px  (Default.aspx / track.aspx)
     .div_input_finputc  清空      track.aspx 在用，但 CSS 里根本没有这条规则，
                                   只能吃浏览器默认的灰色按钮
     .celogin_inputb     提交      104×32px   (Controls/Contact.ascx)
   而且只有 .div_input_finput 写了 hover。这里收成一套：
     36px 高 / 4px 圆角 / 14px 字号 / 统一过渡；
     hover 加深并带一点投影，active 下压 1px，focus 给品牌色外圈，
     disabled 转灰不可点。次要动作（清空 / Clear Up）走白底描边款，
     和实心红的主操作拉开层次。
   ========================================================= */
.div_input,
.div_input_finputp,
.div_input_finput,
.div_input_finputc,
.celogin_inputb{
	height:36px;
	line-height:34px;                 /* 36px 含 1px 上下边框，行高取 34px 才正中 */
	padding:0 18px;
	margin:0;
	border:1px solid transparent;
	border-radius:4px;
	font-family:"Microsoft YaHei";
	font-size:14px;
	font-weight:400;
	cursor:pointer;
	-webkit-box-sizing:border-box; box-sizing:border-box;
	-webkit-transition:background-color .18s ease, border-color .18s ease,
	                   box-shadow .18s ease, color .18s ease, -webkit-transform .06s ease;
	transition:background-color .18s ease, border-color .18s ease,
	           box-shadow .18s ease, color .18s ease, transform .06s ease;
}
/* 通栏的两个（登录 / 计算）保持占满整行 */
.div_input,
.div_input_finputp{
	float:none;
	display:block;
	width:100%;
}
/* 并排的小按钮（查询 / 清空）保持原间距与最小宽度 */
.div_input_finput,
.div_input_finputc{
	min-width:86px;
	margin:0 10px 0 0;
	font-size:13px;
}
.celogin_inputb{ width:104px; }

/* ---- 主按钮：品牌红实心 ---- */
.div_input,
.div_input_finputp,
.div_input_finput,
.celogin_inputb{
	background:#cc0001;
	border-color:#cc0001;
	color:#fff;
}
.div_input:hover,
.div_input_finputp:hover,
.div_input_finput:hover,
.celogin_inputb:hover{
	background:#b00001;
	border-color:#b00001;
	box-shadow:0 3px 10px rgba(204,0,1,.24);
}
.div_input:active,
.div_input_finputp:active,
.div_input_finput:active,
.celogin_inputb:active{
	background:#8f0001;
	border-color:#8f0001;
	box-shadow:none;
	-webkit-transform:translateY(1px);
	transform:translateY(1px);
}

/* ---- 次按钮：白底描边（清空 / Clear Up） ---- */
.div_input_finputc{
	background:#fff;
	border-color:#d9d9d9;
	color:#555;
}
.div_input_finputc:hover{
	background:#fff;
	border-color:#cc0001;
	color:#cc0001;
}
.div_input_finputc:active{
	background:#fff5f5;
	border-color:#a80001;
	color:#a80001;
	-webkit-transform:translateY(1px);
	transform:translateY(1px);
}

/* ---- 键盘聚焦：统一品牌色外圈，替掉浏览器默认描边 ---- */
.div_input:focus,
.div_input_finputp:focus,
.div_input_finput:focus,
.div_input_finputc:focus,
.celogin_inputb:focus{
	outline:none;
	box-shadow:0 0 0 3px rgba(204,0,1,.18);
}

/* ---- 禁用态 ---- */
.div_input:disabled,
.div_input_finputp:disabled,
.div_input_finput:disabled,
.div_input_finputc:disabled,
.celogin_inputb:disabled,
.div_input[disabled],
.div_input_finputp[disabled],
.div_input_finput[disabled],
.div_input_finputc[disabled],
.celogin_inputb[disabled]{
	background:#ececec;
	border-color:#e0e0e0;
	color:#b0b0b0;
	box-shadow:none;
	cursor:not-allowed;
	-webkit-transform:none;
	transform:none;
}

/* 页头搜索按钮（Controls/Search.ascx 的 #btnSearch / #btnSearch2）也统一过来 */
#btnSearch, #btnSearch2{
	border-radius:3px;
	-webkit-transition:background-color .18s ease, border-color .18s ease, color .18s ease;
	transition:background-color .18s ease, border-color .18s ease, color .18s ease;
}
#btnSearch:hover, #btnSearch2:hover,
#btnSearch:focus, #btnSearch2:focus{
	background:#cc0001;
	border-color:#cc0001;
	color:#fff;
}