/* CSS Document */

/*
 *
 * Name : 招采进宝专题页
 * Author : 易招标研发中心UI设计组，叶慈航
 * Version : v1.0.0
 * Date : 2015-07-24 19:58
 *
 */



/* ========== CSS Reset，重置样式，清除浏览器默认样式 ========== */

/* 防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */
html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    color: #000;
}
body {
}
/* 内外边距通常让各个浏览器样式的表现位置不同 */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    margin: 0;
    padding: 0;
}
/* 重设 HTML5 标签, IE 需要在 js 中 createElement(TAG) */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
/* HTML5 媒体文件跟 img 保持一致 */
audio, canvas, video {
    display: inline-block;
     *display: inline;
     *zoom: 1;
}
/* 要注意表单元素并不继承父级 font 的问题 */
body, button, input, select, textarea {
    font: 12px/1.5 '微软雅黑','Microsoft Yahei','宋体',sans-serif;
}
input, select, textarea {
    font-size: 100%;
}
/* 去掉浏览器默认的外轮廓 */
input, button, select, textarea {
    outline: none;
}
/* 去掉各Table  cell 的边距并让其边重合 */
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/* IE bug fixed: th 不继承 text-align*/
th {
    text-align: inherit;
}
/* 去除默认边框 */
fieldset, img {
    border: 0;
}
/* ie6 7 8(q) bug 显示为行内表现 */
iframe {
    display: block;
}
/* 去掉 firefox 下此元素的边框 */
abbr, acronym {
    border: 0;
    font-variant: normal;
}
/* 一致的样式 */
del {
    text-decoration: line-through;
}
address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: 500;
}
/* 去掉列表前的标识, li 会继承 */
ol, ul {
    list-style: none;
}
/* 对齐是排版最重要的因素, 别让什么都居中 */
caption, th {
    text-align: left;
}
/* 让标题都自定义, 适应多个系统应用 */
h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: 500;
}
/* 在<q>标签之间的文字两头加上引号 */
q:before, q:after {
    content: '';
}
/* 统一上标和下标 */
sub, sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}

/* 正常链接 未访问、已访问 */
a {
    color: #3c88e9;
}
/* 鼠标悬停 */
a:hover {
    color: #ff6600;
}
/* 默认不显示下划线，保持页面简洁 */
ins, a {
    text-decoration: none;
}
/* ========== CSS Reset End ========== */



/* ========== CSS Custom，自定义页面样式 ========== */

/* ----- 页面布局，两列右侧自适应布局 ----- */
body {
    min-width: 1100px;
    min-height: 456px;
}

/*  文字颜色公用类  */
.text-green {
    color: #2cc17b;
}
.text-orange {
    color: #ff6600;
}
.text-red {
    color: red;
}
.text-gray {
    color: #999;
}


/* ========== CSS Function & Status 功能样式与常用状态，从常用样式方法中抽离，使用频率较高 ========== */

/* 清理浮动 */
.f-clear:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
.f-clear {
    zoom: 1; /* for IE6 IE7 */
}
/* 单行文字溢出时出现省略号，需设定宽度 */ 
.f-text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* 默认浅色的渐变 */
.f-linear {
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));
    background: -moz-linear-gradient(top, #ffffff, #f5f5f5);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5');
    background: -o-linear-gradient(top, #ffffff, #f5f5f5);
    background: linear-gradient(top, #ffffff, #f5f5f5);
}
.f-linear:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eeeeee));
    background: -moz-linear-gradient(top, #ffffff, #eeeeee);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee');
    background: -o-linear-gradient(top, #ffffff, #eeeeee);
    background: linear-gradient(top, #ffffff, #eeeeee);
}
.f-linear:active {
    background: #eee;
}
/* 蓝色的渐变 */
.f-linear-blue {
    background: -webkit-gradient(linear, left top, left bottom, from(#47a0ff), to(#3c96ff));
    background: -moz-linear-gradient(top, #47a0ff, #3c96ff);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#47a0ff', endColorstr='#3c96ff');
    background: -o-linear-gradient(top, #47a0ff, #3c96ff);
    background: linear-gradient(top, #47a0ff, #3c96ff);
}
.f-linear-blue:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#60adff), to(#54a3ff));
    background: -moz-linear-gradient(top, #60adff, #54a3ff);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#60adff', endColorstr='#54a3ff');
    background: -o-linear-gradient(top, #60adff, #54a3ff);
    background: linear-gradient(top, #60adff, #54a3ff);
}
.f-linear-blue:active {
    background: -webkit-gradient(linear, left top, left bottom, from(#4789e6), to(#4f92f1));
    background: -moz-linear-gradient(top, #4789e6, #4f92f1);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4789e6', endColorstr='#4f92f1');
    background: -o-linear-gradient(top, #4789e6, #4f92f1);
    background: linear-gradient(top, #4789e6, #4f92f1);
}
/* 绿色的渐变 */
.f-linear-green {
    background: -webkit-gradient(linear, left top, left bottom, from(#2cc17b), to(#21b06d));
    background: -moz-linear-gradient(top, #2cc17b, #21b06d);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2cc17b', endColorstr='#21b06d');
    background: -o-linear-gradient(top, #2cc17b, #21b06d);
    background: linear-gradient(top, #2cc17b, #21b06d);
}
/* 支持chrome 下小于12px字体的情况 */
.f-webkit-adjust {
    -webkit-text-size-adjust: none;
}
.f-block {
	display: block;
}
.f-inline {
	display: inline-block;
    *display: inline;
    *zoom: 1;
}
/* 显示与隐藏, 通常用来与 JS 配合 */
.z-show {
    display: block;
}
.z-hide {
    display: none;
}
.m-form-item .u-input.z-hide, .m-form-item .u-textarea.z-hide, .m-form-item .u-select.z-hide {
    display: none;
}




/* --- 首页布局 --- */

/* 大背景 */
.topWrappers, .secondWrappers, .thirdWrappers{
    position: relative;
	overflow:hidden;
}
.topWrappers {
	height: 682px;
	background: url(../images/topWrappers.png) no-repeat scroll center top;
	background-color:#fff;
}
.secondWrappers{
	background-color:#fff;
	height: 765px;
}
.thirdWrappers{
	background-color:#0062b3;
	height: 798px;
}
.fourthWrappers{
	background-color:#f6f6f7;
	height: 708px;
}
.fifthWrappers{
	background-color:#fff;
	height: 1035px;
}
.fifthWrappers{
	background-color:#fff;
	height: 1035px;
}
.sixthWrappers{
	background-color:#3e4959;
	height: 1000px;
}
.foot{
	background-color:#444444;
}


/* 框架 */
.outWrappers{
	width:1000px;
	height:500px;
	margin:0 auto;
}
.outWrappers2{
	width:1000px;
	margin:0 auto;
}
.outWrappers3{
	width:1000px;
	margin:0 auto;
	padding:35px 0px;
	text-align: center;
	color:#999;
}

/* 居中内容背景 */
.first-con{
	position:relative;
}
.second-con{
	position:relative;
	background: url(../images/secondWrappers-bg.png) no-repeat 552px 164px;
	height: 765px;
}

.fourth-con{
	background: url(../images/fourthWrappers-bg.png) no-repeat  71px 217px;
	position:relative;
	height: 708px;
}
.fifth-con{
	height:1035px;
	position:relative;
}
.sixth-con{
	height:1000px;
	background: url(../images/sixthWrappers-bg.png) no-repeat  3px 282px;
	position:relative;
}


/* 按钮 */
.outWrappers .button,.slide2 .button2,.slide2 .button4{
	height: 24px;
	margin:318px 0px 0px 38px;
	float:left;
	position:absolute;
	border-radius: 6px;
	font-size:16px;
	padding:10px 18px;
	color:#fff;
	cursor: pointer;
	background-color:#ff4e00;
	-webkit-transition:background-color 0.3s linear;
	-moz-transition:background-color 0.3s linear;
	-ms-transition:background-color 0.3s linear;
	-o-transition:background-color 0.3s linear;
	transition:background-color 0.3s linear;
	*width:80px;
}
.slide2 .button2{
	margin:185px 0px 0px 416px;
}
.slide2 .button4{
	margin:185px 0px 0px 56px;
}
.outWrappers .button:hover, .slide2 .button2:hover, .slide2 .button4:hover{
	filter:alpha(opacity=80); 
	-moz-opacity:0.8; 
	opacity:0.8;
}
.outWrappers .button span, .slide2 .button2 span, .slide2 .button4 span{
	width:4px;
	height: 8px;
	display:block;
	background: url(../images/button-arrow.png) no-repeat;
	float: right;
	margin: 8px 0px 0px 8px;
	*margin: -15px 0px 0px 8px;
}

.outWrappers .button3{
	width:8empx;
	height: 2em;
	margin:20px 20px 0px 850px;
	background: url(../images/home.png) no-repeat  0px 4px;
	float:left;
	position:absolute;
	font-size:14px;
	padding:0px 0px 0px 25px;
	color:#999;
}
.outWrappers .button3:hover{
	color: #ff6600;
}

/* 按钮淡入 */
@keyframes fade-in {
0% {opacity: 0;}/*初始状态 透明度为0*/
40% {opacity: 0;}/*过渡状态 透明度为0*/
100% {opacity: 1;}/*结束状态 透明度为1*/
}
@-webkit-keyframes fade-in {/*针对webkit内核*/
0% {opacity: 0;}
40% {opacity: 0;}
100% {opacity: 1;}
}
.outWrappers .button, .outWrappers .button2,.outWrappers .button4{
animation: fade-in;/*动画名称*/
animation-duration: 1.5s;/*动画持续时间*/
-webkit-animation:fade-in 1.5s;/*针对webkit内核*/
}

/*第二幕*/
.slide{
	width:100%;
	height:526px;
	position:relative;
	top:0px;
	left:0px;
}
.slide .m-hd{
	width:100%;
	height:82px;
	border:none;
	background:none;
	z-index:10;
	position: relative;
}
.slide .head{
	background-color:#fff;
	filter:alpha(opacity=60); 
	-moz-opacity:0.6; 
	opacity:0.6;
	z-index:8;
	height: 82px;
	width:100%;
	position: absolute;
}
.slide .m-hd .word{
	z-index:8;
	height: 82px;
	position: absolute;
	margin-left:-200px;
	*margin-left:-800px;
	font-size:17px;
	margin-top:28px;
	color:#333;
}
.slide .head:hover{
	filter:alpha(opacity=80); 
	-moz-opacity:0.8; 
	opacity:0.8;
}

.slide .m-hd ul,.slide .m-hd2 ul{ zoom:1; width:702px;margin:0px auto;z-index:10;padding-left:298px;}
.slide .m-hd ul li{
	background-image: url(../images/secondWrappers-head.png);
	cursor: pointer;
	height:69px;
	width:69px;
	float:left;
	margin: 6px 6px 0px 0px;
}
.slide .m-hd ul li.on{background-image: url(../images/secondWrappers-head2.png);}
.slide .m-hd ul .s1{
	background-position: 0px 0px;
}
.slide .m-hd ul .s2{
	background-position: -76px 0px;
}
.slide .m-hd ul .s3{
	background-position: -152px 0px;
}
.slide .m-hd ul .s4{
	background-position: -227px 0px;
}
.slide .m-hd ul .s5{
	background-position: -304px 0px;
}
.slide .m-hd ul .s6{
	background-position: -380px 0px;
}
.slide .m-hd ul .s7{
	background-position: -456px 0px;
}
.slide .m-hd ul .s8{
	background-position: -532px 0px;
}
.slide .m-bd{
	position:relative;
	width:100%;
	height:526px;
	z-index:0;
	margin-top:-82px;
}
.slide .m-bd li{
	position:relative;
	width:100%;
	height:526px;
	z-index:0;
	position: absolute;
	top:0px;
}
.slide .m-bd .b1{
	background: url(../images/secondWrappers-bg.png) no-repeat scroll center center;
}
.slide .m-bd .b2{
	background: url(../images/secondWrappers-bg2.png) no-repeat scroll center center;
}
.slide .m-bd .b3{
	background: url(../images/secondWrappers-bg3.png) no-repeat scroll center center;
}
.slide .m-bd .b4{
	background: url(../images/secondWrappers-bg4.png) no-repeat scroll center center;
}
.slide .m-bd .b5{
	background: url(../images/secondWrappers-bg5.png) no-repeat scroll center center;
}
.slide .m-bd .b6{
	background: url(../images/secondWrappers-bg6.png) no-repeat scroll center center;
}
.slide .m-bd .b7{
	background: url(../images/secondWrappers-bg7.png) no-repeat scroll center center;
}
.slide .m-bd .b8{
	background: url(../images/secondWrappers-bg8.png) no-repeat scroll center center;
}



/*文字定位*/
.f-title{
   position:absolute;
   top:300px;
   text-align:center;
   width:1000px;
   font-size:48px;
   color:#333;
}
.f-title2{
   position:absolute;
   top:390px;
   text-align:center;
   width:1000px;
   font-size:22px;
   color:#666;
}
.f-button{
   position:absolute;
   top:458px;
   left:410px;
   text-align:center;
   width:180px;
   height:50px;
   padding-top:12px;
   border-radius: 2px;
   background-color:#277eff;
   font-size:24px;
   color:#fff;
   cursor:pointer;
}
.f-button:hover{
   background-color:#2d6fd0;
   color:#fff;
}
.f-title3{
   position:absolute;
   top:118px;
   left:12px;
   text-align:left;
   width:436px;
   font-size:40px;
   color:#333;
}
.f-title4{
   position:absolute;
   top:216px;
   left:24px;
   text-align:left;
   width:436px;
   font-size:18px;
   color:#666;
   line-height:45px;
   text-indent:2em;
}
.f-title5{
   position:absolute;
   top:105px;
   text-align:center;
   width:1000px;
   font-size:36px;
   color:#fff;
}
.f-title6{
   position:absolute;
   top: 215px;
   width:925px;
   padding-left:75px;
   font-size:24px;
   color:#fff;
}
.f-title6 .block{
   float:left;
   top:280px;
   width:218px;
   height:46px;
   margin: 0px 30px 26px 30px;
   padding-top:186px;
}
.f-title6 .b1{
   background: url(../images/thirdWrappers-bg.png) no-repeat center top;
}
.f-title6 .b2{
   background: url(../images/thirdWrappers-bg2.png) no-repeat center top;
}
.f-title6 .b3{
   background: url(../images/thirdWrappers-bg3.png) no-repeat center top;
}
.f-title6 .b4{
   background: url(../images/thirdWrappers-bg4.png) no-repeat center top;
}
.f-title6 .b5{
   background: url(../images/thirdWrappers-bg5.png) no-repeat center top;
}
.f-title7{
   width:218px;
   height:46px;
   text-align:center;
   float:left;
   font-size:18px;
   color:#fff;
   line-height:26px;
}
.f-title8{
   width:1000px;
   text-align:center;
   font-size:36px;
   color:#333;
   position:absolute;
   top:108px;
}
.f-title9{
   position:absolute;
   top: 215px;
   width:930px;
   padding-left:70px;
   color:#fff;
}
.f-title9 .block{
   float:left;
   width:260px;
   height:150px;
   margin: 0px 23px 42px 23px;
   padding-top:180px;
   position: relative;
}
.f-title9 .b1{
   background: url(../images/fifthWrappers-bg.png) no-repeat center top;
}
.f-title9 .b2{
   background: url(../images/fifthWrappers-bg2.png) no-repeat center top;
}
.f-title9 .b3{
   background: url(../images/fifthWrappers-bg3.png) no-repeat center top;
}
.f-title9 .b4{
   background: url(../images/fifthWrappers-bg4.png) no-repeat center top;
}
.f-title9 .b5{
   background: url(../images/fifthWrappers-bg5.png) no-repeat center top;
}
.f-title9 .b6{
   background: url(../images/fifthWrappers-bg6.png) no-repeat center top;
}


.f-title10{
   position:absolute;
   top:225px;
   left:515px;
   text-align:left;
   width:436px;
   font-size:18px;
   color:#666;
   line-height:45px;
   text-indent:2em;
}

.f-title11{
   position:absolute;
   top:184px;
   text-align:center;
   width:260px;
   font-size:18px;
   color:#333;
}
.f-title11 span{
   margin:0 3px;
   font-size:24px;
   color:#317de7;
}
.f-title14{
   position:absolute;
   top:230px;
   text-align:left;
   width:260px;
   font-size:14px;
   line-height:30px;
   color:#666;
}
.f-title15{
   width:1000px;
   text-align:center;
   font-size:36px;
   color:#fff;
   position:absolute;
   top:108px;
}
.f-title16{
   width:1000px;
   text-align:center;
   font-size:26px;
   color:#becdf1;
   position:absolute;
   top:200px;
}

.outWrappers3 a{
	color:#999;
}
.outWrappers3 a:hover{
	color:#F60;
}

/*边栏APP*/
.app{
	position: fixed;
    top: 20%;
	right: 20px;
	z-index: 100;
}



/* ========== CSS Function & Status End ========== */