@charset "utf-8";
/*==================================================================
  Page_V2026.css  黄页专属样式
  依赖：本文件之前需先引入 Public_V2026.css
==================================================================*/
/*主体*/
#site-famous{width:100%;min-height:auto;box-sizing:border-box;border:#b6d2f9 1px solid;background:#FFF;display:flex;flex-direction:row}
/* #site-famous 是 flex row，.modulefamous 唯一子项必须显式撑满 100% */
.modulefamous{width:100%;min-width:0}

.ftitle{height:40px;line-height:40px;position:relative;border-top:none;border-left:none;border-right:none;background:#f3f7fb url('/images/ftitlebg.png') repeat-x top center;overflow:hidden}
.ftitle ul{list-style:none;position:absolute;top:5px;padding-left:5px;height:36px;font-size:16px;text-align:center;border-bottom:1px solid #b6d2f9}
.ftitle li{float:left;display:block;cursor:pointer;min-width:200px;color:#016aae;height:36px;line-height:36px}
.ftitle li.hover{padding:0px;background:#fff;min-width:200px;height:36px;line-height:36px;border-left:1px solid #b6d2f9;border-top:1px solid #b6d2f9;border-right:1px solid #b6d2f9;color:#016aae;font-weight:bold;border-bottom:none}

#famous{padding: 4px 8px;min-height:auto;clear:both;}
#famous ul{list-style:none}

.city_index_title,
.description_con{margin:5px;line-height:36px; color:#333}
/*新站黄页20条*/
.page_site_list{text-align:left;padding:10px;font-size:16px;clear:both;}
.page_site_list h2{text-align:center;color:#016aae;font-size:16px;font-weight:bold;padding:10px 0 5px;}
.page_site_list ul{list-style:none;display:flex;flex-wrap:wrap;width:100%;}
.page_site_list ul li{flex:0 0 calc(100% / 4);text-align:left;padding:2px;height:50px;line-height:50px;border-bottom:1px #aaccee dotted;overflow:hidden;box-sizing:border-box;}

/*封面主页 中文名站 —— 多列 flex 网格布局（项目配色 #016aae → #7d2bd1 hover） */
#china_site{width:var(100%-30px);overflow:hidden;position:relative;z-index:1;padding:4px 2px;}

/* 通用 ul：flex wrap 多列网格容器 */
#china_site ul{
  list-style:none;
  padding:4px 2px;
  margin:0;
  display:flex;
  flex-wrap:wrap;
  width:100%;
  box-sizing:border-box;
}

/* ====== 1. 搜索名站 #topsite（6列均分 + sprite 图标 + 两个 a 用 &middot; 分隔） ====== */
#china_site ul#topsite{
  border-bottom:1px solid #e6effa;
  padding:6px 2px;
}
#china_site ul#topsite li{
  flex:0 0 calc(100% / 6);    /* 关键：flex 容器内用 flex-basis 均分，不写 width */
  height:36px;
  line-height:36px;
  text-align:center;
  font-size:18px;
  font-weight:bold;
  color:#333;
  white-space:nowrap;
  overflow:hidden;
  box-sizing:border-box;
}
/* sprite 图标容器（合并 L45+L47 两条重复规则） */
#topsite li em{
  display:inline-block;
  width:16px;
  height:16px;
  zoom:1;
  vertical-align:middle;
  margin-right:3px;
  background:url(/images/ico_gz007net2024.png) no-repeat;
}
/* sprite 图标位置（原 PNG 坐标，保持不变） */
#topsite em.baidu{background-position:-284px -500px}
#topsite em.n163{background-position:-200px -500px}
#topsite em.sohu{background-position:-221px -500px}
#topsite em.qq{background-position:-263px -500px}
#topsite em.taobao{background-position:-307px -500px}
#topsite em.sina{background-position:-245px -500px}

/* ====== 2. 各类网站 / 全国导航（6列普通链接 + 蓝圆点前缀） ====== */
/* #china_site ul 已是 flex wrap 容器（见 L31-39 通用规则） */
#china_site ul:not(#topsite) li{
  flex:0 0 calc(100% / 6);    /* 6 列均分，与搜索名站一致 */
  height:36px;
  line-height:36px;
  padding:0 12px 0 20px;
  position:relative;
  box-sizing:border-box;
  white-space:nowrap;
  overflow:hidden;
  text-align:left;
}
/* 蓝圆点前缀（项目蓝 #016aae，与博客/百科圆点统一） */
#china_site ul:not(#topsite) li::before{
  content:"";
  position:absolute;
  left:6px;
  top:50%;
  transform:translateY(-50%);
  width:5px;
  height:5px;
  background:#EBEBEB;
  border-radius:50%;
  box-shadow:0 0 0 2px rgba(1,106,174,0.12);
}
#china_site ul:not(#topsite) li a{
  display:block;
  color:#333;
  text-decoration:none;
  font-size:16px;
  transition:color 0.2s ease;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#china_site ul:not(#topsite) li a:hover{
  color:#016aae;
  text-decoration:none;
}
/* 每 4 行（6列×4=24个 li）底部添加一条点画线 —— 项目边框蓝 #b6d2f9 */
#china_site ul:not(#topsite) li:nth-child(24n+19),
#china_site ul:not(#topsite) li:nth-child(24n+20),
#china_site ul:not(#topsite) li:nth-child(24n+21),
#china_site ul:not(#topsite) li:nth-child(24n+22),
#china_site ul:not(#topsite) li:nth-child(24n+23),
#china_site ul:not(#topsite) li:nth-child(24n+24){
  border-bottom:1px dotted #b6d2f9;
}

/* ====== 通用链接基础规则 ====== */
#china_site a:link,#china_site a:visited{text-decoration:none}
#china_site a:hover{text-decoration:none}

/*0851-0859 - 按钮式布局*/
.dzs{width:100%;margin:0 auto;clear:both;padding:20px;box-sizing:border-box;}
.dzs ul{display:flex;flex-wrap:wrap;width:100%;gap:6px;}
.dzs ul li{flex:0 0 calc((100% - 50px) / 5);height:36px;line-height:36px;text-align:center;box-sizing:border-box;}
.dzs ul li a{display:block;width:100%;padding:0 10px 0 22px;background:linear-gradient(180deg,#e8f0fe 0%,#d2e1f8 100%);border:1px solid #bad5f0;border-radius:8px;color:#3b5998;text-decoration:none;transition:all 0.3s ease;box-shadow:inset 0 1px 0 rgba(255,255,255,0.6);box-sizing:border-box;overflow:hidden;}
.dzs ul li a:hover{background:linear-gradient(180deg,#f3dae0 0%,#ddc3e0 100%);border-color:#c7a0d0;color:#6a1b9a;box-shadow:0 4px 12px rgba(106,27,154,0.2),inset 0 1px 0 rgba(255,255,255,0.5);transform:translateY(-1px);}

/*全省99个县市区导航*/
#gzdaohang{height:auto;overflow:hidden}
#guizhoudaohang{width:100%;overflow:hidden}
#guizhoudaohang ul{padding:5px 8px;display:flex;flex-wrap:wrap;overflow:hidden}
#guizhoudaohang li{float:left;padding:5px;margin:2px 8px 2px 8px;line-height:30px;;border:#CCC 1px solid; background:#F8F8F8;display:block;list-style:none;white-space:nowrap}
#guizhoudaohang li a:link,#guizhoudaohang li a:active{color:#666}
#guizhoudaohang li a:hover{color:#F00}
#guizhoudaohang li a:visited{color:#00F}
#guizhoudaohang .state{margin-left:5px;padding-left:10px;padding-right:18px; background:#016aae;}
#guizhoudaohang li.state a{color:#FFF}

/*黄页header - 三列同行布局（LOGO占剩余空间，两广告列紧挨）*/
#header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 12px 15px 28px;
    box-sizing: border-box;
    overflow: visible;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
    border-bottom: none;
}

/* 第一列：单位LOGO与标题（flex:1 占满左侧所有剩余空间） */
#logoco {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
}

.logo-icon {
    display: flex;
    align-items: center;
    min-width: 0;
}

/* 左侧紫色图标块（简化：纯色 + 轻描边，与标题文字色 #4a0099 统一） */
.logo-icon i {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    font-size: 36px;
    font-style: normal;
}

.logo-icon h1 {
    margin: 0;
    font-size: 26px;
    font-weight: bold;
    color: #181818;
    white-space: nowrap;
    overflow: visible;        /* 倒影在外部，不允许裁切 */
    text-overflow: ellipsis;
    max-width: 100%;
    line-height: 1;           /* 收窄行高，让倒影紧贴文字底部 */
}

/* span：relative定位是关键，overflow:visible确保倒影不被裁 */
.logo-icon span {
    position: relative;
    display: inline-block;
    max-width: 100%;
    overflow: visible;
    vertical-align: baseline; /* 基线对齐：让文字与它的倒影严格上下对称 */
    line-height: 1;
}

/* 文字倒影效果 - 文字正下方（镜像垂直翻转 + 间隙 + 柔和渐隐） */
.logo-icon span::after {
	content: attr(data-text);
	position: absolute;
	top: calc(100% + 33px);  /* 原文与倒影之间加 3px 间隙，参考图效果不是紧贴 */
	left: 0;
	width: 100%;
	line-height: 1;         /* 倒影文字比例与原文一致，不压扁 */
	transform: scaleY(-1);  /* 只做垂直翻转 */    
	transform-origin: top center; /* 以「伪元素的顶部（即原文底部那侧）」为翻转轴 */
	color: #666666;
	opacity: 0.42;
	pointer-events: none;
	white-space: nowrap;
	/* 渐隐：贴近原文处已半透 → 越往下越淡至全透明（参考图渐变风格） */
	-webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0) 100%);
	mask-image: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.55) 100%);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	filter: blur(0.3px);
}
.Yellowpage_flag{
    position: relative;
    display: inline-block;
    vertical-align: top;        /* 与按钮顶部对齐 */
    margin-left: 8px;        /* 往右靠一点 */
    margin-top: -40px;         /* 往上推到按钮顶部之上，形成右上角角标 */
    padding: 2px 6px;
    background: linear-gradient(135deg, #ff9900 0%, #ff3300 100%);
    color: #fff;
    border-radius: 10px;
    font-size: 11px;
    font-weight: bold;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(125,43,209,0.3);
    z-index: 2;
}
/* 第二列：250x60 广告 */
.g250x60 {
    flex: 0 0 250px;
    width: 250px;
    height: 60px;
    margin-right: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
	background: linear-gradient(180deg, #aaccee 0%, #bad5f0 100%);
}

.g250x60 img {
    height: 60px;
    width: 250px;
    max-width: 100%;
    display: block;
    object-fit: contain;
    border: 1px solid #e6effa;
    border-radius: 4px;
    box-sizing: border-box;
}

/* 第三列：468x60 广告（紧挨第二列，只留6px间距） */
.g468x60 {
    flex: 0 0 468px;
    width: 468px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.g468x60 img {
    height: 60px;
    width: 468px;
    max-width: 100%;
    display: block;
    object-fit: contain;
    border: 1px solid #e6effa;
    border-radius: 4px;
    box-sizing: border-box;
}
/*黄页Guide - 面包屑导航*/
#guide{
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    background: linear-gradient(90deg, #f3f7fb 0%, #e8f0fe 50%, #d2e1f8 100%);
    border: 1px solid #b6d2f9;
    border-radius: 6px;
    box-sizing: border-box;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
    margin-bottom: 1px;
}
#guide .guide_left{
    flex: 1;
    display: flex;
    align-items: center;
    min-width: 0;
    height: 48px;
    line-height: 48px;
    font-size: 14px;
    color: #666;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#guide .guide_left > span{
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
}
#guide .guide_left span{
    color: #999;
    margin: 0 4px;
}
#guide .guide_left a{
    color: #016aae;
    text-decoration: none;
    transition: all 0.2s ease;
}
#guide .guide_left a:hover{
    color: #7d2bd1;
    text-decoration: underline;
}
#guide .guide_left strong{
    color: #333;
    font-weight: bold;
    margin-left: 4px;
}
#guide .guide_right{
    flex-shrink: 0;
    margin-left: 15px;
    height: 48px;
    line-height: 48px;
    font-size: 14px;
    color: #333333;
    padding: 0 14px;
    border-left: 2px solid #ebebeb;
    border-radius: 0 4px 4px 0;
    letter-spacing: 0.5px;
}
#guide .guide_right span{
    display: inline-block;
}

#pagegg{margin:10px auto;width:100%;}
.ggdiv960x90{margin:0px auto;text-align:center;height:auto; overflow:hidden; background:#FEFEFE}
/*page_content*/
#page_txt{width:100%;padding:15px;box-sizing:border-box;background:#fff;}
#yellowpage{width:100%;background:#fff;border:1px solid #e6effa;border-radius:4px;overflow:hidden;}
#yellowpage ul{width:100%;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;border-bottom:1px solid #f3f7fb;}
#yellowpage ul li{padding:10px 12px;line-height:24px;font-size:14px;color:#333;box-sizing:border-box;}
#yellowpage ul li.pthead{flex:0 0 130px;background:#f3f7fb;color:#016aae;font-weight:bold;border-right:1px solid #e6effa;text-align:right;}
#yellowpage ul li:not(.pthead){flex:1;}
#yellowpage ul li h2{margin:0;font-size:18px;font-weight:bold;color:#181818;line-height:24px;}
#yellowpage ul li strong{color:#333;font-size:14px;}
#yellowpage .update_time{margin-left:10px;color:#999;font-size:12px;font-weight:normal;}
/*网址按钮效果*/
.btn_website{
	padding:20px; 
	font-size: 18px;
	text-align: center;
	border:1px solid #d2a000;
	box-shadow: 0 1px 2px #fedd71 inset,0 -1px 0 #a38b39 inset,0 -2px 3px #fedd71 inset;
	background: -webkit-linear-gradient(top,#fece34,#d8a605);
	background: -moz-linear-gradient(top,#fece34,#d8a605);
	background: linear-gradient(top,#fece34,#d8a605);
}

.btn_website:hover {
	color:#F00;
	border-top: 1px solid #ba8f06;
	box-shadow:-2px 0 1px #deb842 inset;
	background:-webkit-linear-gradient(right,#d5a406,#fdc40b 60%);
	background:-moz-linear-gradient(right,#d5a406,#fdc40b 60%);
	background:linear-gradient(right,#d5a406,#fdc40b 60%); 
	cursor: pointer;
}

/*网址URL图片容器 - 与 .Official_flag 角标配合（兄弟元素）*/
#page_url{
    display: inline-block;
    vertical-align: middle;      /* 与 .Official_flag 角标 inline-block 协同 */
    max-width: 100%;
    overflow: hidden;
}
#page_url img{
    display: block;
    max-width: 100%;
    height: auto;
    cursor: pointer;
    border: 1px solid #e6effa;
    border-radius: 6px;
    padding: 4px 8px;
    background: #fff;
    box-shadow: 0 1px 4px rgba(1,106,174,0.08);
    transition: all 0.25s ease;
    box-sizing: border-box;
}
#page_url img:hover{
    border-color: #bad5f0;
    box-shadow: 0 4px 12px rgba(1,106,174,0.15);
    transform: translateY(-1px);
}

/*官方网站角标 - 贴在 .btn_website 按钮的右上角（紫色胶囊徽章，与 .logo-icon / .page_prompt::before 紫色系统一）*/
#yellowpage .Official_flag{
    position: relative;
    display: inline-block;
    vertical-align: top;        /* 与按钮顶部对齐 */
    margin-left: -5px;        /* 往左拉叠到按钮右侧 */
    margin-top: -15px;         /* 往上推到按钮顶部之上，形成右上角角标 */
    padding: 2px 6px;
    background: linear-gradient(135deg, #ff8c33 0%, #ff6101 100%);
    color: #fff;
    border-radius: 10px;
    font-size: 11px;
    font-weight: bold;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(125,43,209,0.3);
    z-index: 1;
}
#yellowpage .gray{color:#999;font-size:14px;}
#yellowpage li p{margin:0 0 10px;font-size:14px;line-height:26px;color:#333;text-indent:2em;}
#yellowpage li p:last-child{margin-bottom:0;}

/*信息提示*/
.page_prompt{
    margin: 10px 20px;
    padding: 18px 20px 18px 52px;
    background: #f3f7fb;
    border: 1px solid #e6d0c0;
    border-left: 3px solid #e6d0c0;
    position: relative;
    box-sizing: border-box;
    transition: all 0.3s ease;
}
.page_prompt:hover{
    box-shadow: 0 4px 16px rgba(125,43,209,0.12), inset 0 1px 0 rgba(255,255,255,0.6);
    transform: translateY(-1px);
}
.page_prompt::before{
    content: "!";
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    line-height: 26px;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    background: linear-gradient(135deg, #ff8c33 0%, #ff6101 100%);
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(125,43,209,0.3);
}
.page_prompt p{
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 24px;
    color: #5a4a3a;
}
.page_prompt p:last-child{
    margin-bottom: 0;
}
.page_prompt b,
.page_prompt B{
    color: #ff6101;
    font-weight: bold;
    font-size: 15px;
}