
@charset "utf-8";		/* 文本保存传输形式设定 */ /* CSS Document */

/*本页三个部分：1、各个页面都使用主体body设置；2、顶部的导航栏，3、banner的样式；4、tedian分样式 4、footer两个统一部分样式*/
/* 页面尺寸：banner画面按1920宽，主页面宽按50%设置，相当于960 */
/* 页面整体居中*/

/*== 5-1 【页面整体】 开始 《》《》《》《》《》《》《》《》《》《》《》《》*/

body{
	margin:0;		/* 居中显示 */
	padding:0;
	font-family:"微软雅黑";		/* 字体默认微软雅黑 */
	background-color: #f5f5f5;		/* 整体背景浅灰色 */
	color: #000000;		}		/* 文字设定深灰 */
a{	color: #525252;				/*灰色字体*/
	text-decoration : none;} 	/*不显示下划线*/
h2{ font-size: 1.4em;
	font-weight: normal;
	color:#2D2C2C; }
h3{ font-size: 1.1em;}

.span_duan{		/* 单项特点文字*/
	margin-top: 0px;
	font-size: 0.9em;
	line-height: 150%;
	color:#6d6b6c;	}

.span_icon{	/* 单项特点标题*/
	line-height: 2.5em;
	vertical-align:top;  /*图片为40px，用于对齐*/
	font-weight:580;
	color:#1A1A1A;	}


/*== 5-1 【页面整体】 结束《》《》《》《》《》《》《》《》《》《》《》《》*/

/*== 5-2 【导航】 开始 《》《》《》《》《》《》《》《》《》《》《》《》*/
.topnav_bar{		/* 导航条背景容器 */
	width: 100%;
	height:50px;		/* 为了背景效果固定高度 */
	background-image: url( ../image/header_bg.gif);		/* 背景3D阴影图片 */
    position:fixed;		/* 页面滚动不跟随，仍然显示*/
	top:0px; 
	z-index:90;	} 	/* 图层设在上面，不被遮盖*/
.topnav_d{		/* 导航内容居中显示容器 */
	width:60%;		
	margin:auto;
	text-align: right;
	height:20px;	}		/* 固定高度，为迁就背景阴影 */
.topnav_d a {		/* 导航条链接 */
    line-height: 40px;
	font-size: 1em;
	color: #2A2A2A;
	padding: 10px 15px 10px 15px;	}	/* 文字间距居中，切随显示屏缩减 */
.topnav_d a:hover {		/* 链接颜色修改 */
  background-color: #99CC66;	/* 背景色变深色 */
  color: #ffffff;	}
/*== 5-2 【导航】  结束《》《》《》《》《》《》《》《》《》《》《》《》《》*/

/*== 5-3 【banner】 开始 》》》》》》》》》》》》》》》》》》》》》》》》*/
/* banner的容器 */
.banner_d{ 	
	width:100%;
	padding-top: 50px;		/* 下移出导航条叠加在最上面的50px */
	height: auto;		/* 随屏幕及图片改变 */
	margin:0 auto; 			/* 居中显示 */
	overflow: hidden; }		/* 下面元素不会上移叠压显示 */
							/* text-align:center;  让图片居中显示 */

/*== 5-3 【banner】 结束《《《《《《《《《《《《《《《《《《《《《《《*/

/*== 5-4 【tedian】 开始 《》《》《》《》《》《》《》《》《》《》《》《》*/
/*用于首页和产品页展示卖点。div大框内放5个小div小框，4个图文，1个换行*/
.te_d{   /* 放置特点的大框，图片以不重复背景设置 */
	margin: auto;		/* 居中显示 */
	width: 50%;		/* 大框统一 */
	height: auto;
	padding: 20px 0px 30px 0px}
.te_d_list{		/* 单项特点框 */
	width: 170px;
	padding: 15px 15px 15px 20px;
	background-color: #ffffff;	 
	float: left}
.te_img{
	float: left; 
	padding-left: 100px;}
/*== 5-4【tedian】 结束《》《》《》《》《》《》《》《》《》《》《》《》《》*/

/*== 5-5 【tip】 开始 《》《》《》《》《》《》《》《》《》《》《》《》*/
/*用于产品页tip和展示卖点。div大框内放5个小div小框，4个图文，1个换行*/



/*== 5-5 【footer】   开始 》》》》》》》》》》》》》》》》》》》》》》》》*/

/* 页脚设定*/
/* Div嵌套太多，如果有float,就会出现底层背景色没法显示问题，故把二维码用背景方式显示 */
.footerbar{			/* 横向占满空间*/
	width: 100%;	/* 不要设固定高度，防止窄屏幕变形*/
	height: auto;	
	font-size: 0.9em;
	color: #cccccc;		/* 浅色文字 */
	background-color: #333333;	}		/* 底色接近黑色 */
.footer{			/* 居中显示容器 */
	width: 50%;
	margin: auto;	/* 居中显示 */
	height: auto;	}	

.contact{		/* 40%居中显示的容器 */
	width: 80%;
	margin-top: 10px;
	float: left;}	/* 占满方式 */
.contact div{		/* 文字显示跟随图片宽度 */
	float: left;		/* 跟随显示 */
	margin:auto; }	/* 维护相邻元素间距 */
					/* 为了与图片居中显示 */
.contact span{line-height: 55px; margin-right: 10px;}
.contact img{margin: 10px 5px 20px 5px;	float: left;}		/* 加宽用文字图标相同高度 */  	/* 跟随显示 */

.text_d{
	margin: auto; 	text-align: center; }
.text_d p{margin: auto;	clear: both}  	/* 段落部分另起显示 */
.text_d a{margin: auto;	color:#cccccc;	}	/* 链接颜色 */

/* 二维码处理 */
.sqcord{
	margin-top: 10px;
	float:left;}		/* 靠右显示 */
	

/* 用于结束float的空白div */
.cleardiv{
	clear: both;	}	
	
/*== 3-3 【footer】  结束《《《《《《《《《《《《《《《《《《《《《《《《《*/
