/*** index.css is the style of "index.jsp" ***/
/*
 * The "i" represents "index"
 * The "h" represents "head"
 * The "b" represents "body"
 * The "f" represents "foot"
 * The "nav" represents "navigation"
 * The "u" represents "up"
 * The "d" represents "down"
 */

/* The head of index */      
.i_h{
	width: 100%;
	height: 44px;
	background-color:#FFFFFF;
}
.i_h_nav{
	width: 80%;
	height: 44px;
	line-height: 44px;
	float: left;
}
.i_h_u{
	float: left;
	width: 10%;
	height: 44px;
	line-height: 44px;
}

.i_h_logo{
	width: 10%;
	height: 100%;
	text-align: center;
	float: left;
}
.i_h_logo img{
	cursor: pointer;
	height: 100%;
}
.i_h_nav ul{
	list-style: none;
	padding: 0 0;
	margin:0 10% 0 10%;
	width: 95%;
	height: 100%;
}
.i_h_nav_s{
	background-color: rgba(96,96,96,0.08);
}
.i_h_nav ul li{
	list-style: none;
	float: left;
	width: 10%;
	height: 100%;
	margin: 0 1% 0 1%;
	color: #000000;
	font-size: 18px;
	text-align: center;
	white-space: nowrap;
	cursor:pointer;
}
.i_h_u div{
	float: left;
	width: 40%;
	height: 100%;
	margin: 0 5% 0 5%;
	cursor: pointer;
	text-align: center;
}
.i_h_b{
	width: 100%;
	height: 0.6%;
	background-color: #A7CE39;
}

/* The slide of index 
 * "s" represents slide
 * "u" represents up
 * "d" represents down
 * */
.i_s{
	width: 100%;
	height: 80%;
	position: relative;
}
#slide{
	width: 100%;
	height: 100%;
	position: relative;
}
.one{
	width:100%;
	height:100%;
	position:absolute;
}
.one_img{
	width: 100%;
	height: 100%;
	position:absolute;
}
.one_img img{
	width: 100%;
	height: 100%;
}
.one_title{
	width: 80%;
	height: 60%;
	margin:10% 10% 10% 10%;
	position:absolute;
	font-size:2vw;
	color: #A7CE39;
	display:none;
}
.slide_bar{
	white-space: nowrap;
	width: 20%;
	height: 10%;
	margin:0% 40% 0% 40%;
	position: absolute;
	bottom: 0;
}
.slide_bar div{
	display:inline-block;
	width: 20%;
	margin:2% 2% 2% 2%;
	height: 10px;
	border:1px solid #A7CE39;
	cursor: pointer;
}
.one_select{
	background-color:#A7CE39;
}


/* The body of index
 * "b" represents body
 * "t" represents title
 * "m" represents more
 * "c" represents content
 * "o" represents one
 * */
.i_b_t{
 	width: 100%;
	font-size:2.4vw;
	height: 80px;
	line-height: 80px;
	text-align:center;
 }
.i_b_m{
 	width: 94%;
	font-size:1.2vw;
	height: 34px;
	text-align: right;
}
.i_b{
	width: 100%;
	height: 39.6%;
	margin: 0.2% 0% 0.2% 0%;
	white-space: nowrap;
}
.i_b_o{
	width: 23.4%;
	height: 100%;
	padding: 0% 0.5% 0% 0.5%;
	display: inline-block;
	position: relative;
}
.i_b_c{
	width: 90%;
	height: 100%;
	padding:0 5% 0 5%;
	background-color: rgba(255,255,255,0.9);
	white-space: initial;
	overflow-x: hidden;
	overflow-y: auto;
	position: absolute;
	color:#000000;
	display:none;
}
.i_b_c h2{
	text-align: center;
}
.i_b_star{
	background: url(../../img/sys/stars.png) no-repeat 0 0;
	width: 94px;
	height: 14px;
	background-position: 0 0;
}
.i_b_img{
	width:100%;
	height:100%;
	position: absolute;
}
.i_b_img img{
	width:100%;
	height:100%;
}

/* The foot of index 
 * "l" represents left
 * "m" represents middle
 * "r" represents right
 * "b" represents bottom
 * */
.i_f{
	width: 70%;
	height: 30%;
	padding:2% 15% 2% 15%;
	background-color:#CCCCCC;
}
.i_f ul{
	list-style: none;
	padding: 0 0;
	width: 100%;
	height: 100%;
}
.i_f ul li{
	list-style: none;
	width: 100%;
	height: 10%;
	margin: 2% 0 2% 0;
	color: #000000;
	cursor:pointer;
}
.i_f_l{
	width: 30%;
	height: 100%;
	float: left;
}
.i_f_m{
	width: 30%;
	height: 100%;
	margin: 0% 5% 0% 5%;
	float: left;
}
.i_f_r{
	width: 30%;
	height: 100%;
	float: left;
}
.i_f_b{
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-align:center;
	float: left;
	background-color:#CCCCCC;
}