.fl { float:left} 
.mt10 { margin-left:10px;}
.ml50 { margin-left:50px;}
/*top*/

.clearfix{zoom:1}
.warp{width: 1200px; margin-left: auto; margin-right: auto;}
.microHei{font-family:"Microsoft YaHei"}



/*header*/
#header{background:url(../images/brief_01.jpg) repeat-x;height: 60px;padding-top: 0; width:100%;}
#header a.fl{height: 60px}
#header .ban { float:right; width:40px; height:40px; margin-top:5px;}
#header #demo {overflow:hidden;height:50px; line-height:50px;width:900px; color:#d2d2ca;   white-space:nowrap; float:left; margin-top:5px; font-size:18px; margin-left:150px;}
.top_logo { position:absolute; top:5px; left:50%; width:50px; height:50px; background:url(../images/top_logo.png); z-index:1000;margin-left:-600px}

/* CSS Document */
#Version{width:100%;height:920px;position:relative;overflow:hidden;}
#Flash{width:1920px;height:900px;position:absolute;left:50%;margin:0px auto -272px -960px;z-index:1;}
#Header{margin:0 auto -290px -960px;width:1920px;height:900px;position:relative;left:50%;}
.hao123 { width:260px; height:20px;  top:5px; left:50%; margin-left:-550px; filter:alpha(opacity=20);    -moz-opacity:0.2;    -khtml-opacity: 0.2;  opacity: 0.2; position:absolute; z-index:5;  }

/*a12*/
#Download{width: 280px;height: auto; overflow:hidden;margin-bottom: 16px; float:right; }
#Download .box{width: 280px;height: 149px;overflow: hidden;background:#F00;display: block}
#Download .box:hover{background-position: right top}
#Download h3{height: 90px;visibility: hidden}
#Download p{line-height: 19px;text-align: center}
#Download p a{color: #ffd600;margin-right: 14px}
#Download ul{float: left; width:280px;line-height: 42px; margin-left:15px;}
#Download ul li{float: left; width:124px; margin:0px 0px 2px 3px}
#Download ul li a{width: 124px;text-align: center;color: #ce9812;display: block;background: url(../images/a_bg3.png) repeat left top; height:42px;}
#Download ul li a:hover{font-weight: bold;color: #faf805;text-decoration: none;background: url(../images/a_bg3.png) no-repeat -126px 0px;}


.ml10 { margin-left:10px;}
/*a13*/
.m3_div { margin:0 auto; width:1200px; margin-bottom:50px;}
.m3_zb { width:1200px; height:auto; overflow:hidden;  margin:0 auto; padding:10px 00px 00px 00px ;}

.m3_zb_3 { width:371px;  height:auto; overflow:hidden;  padding:20px 10px 10px 10px;float:left;   background:#4a3728  url(../images/img03.png) left top no-repeat; border:#6b5a46 1px solid; position:relative; }
.in01 { position:absolute; width:371px; height:35px; background:url(../images/icon02.png) no-repeat; top:0px;  left:50px;}
.m3_zb_3 .role-itemsy { width: 370px; height: auto; float: left; position: relative; }
.m3_zb_3 .role-itemsy img { width:365px; height:auto; overflow:hidden; margin-top:10px;  border:#6b5a46 2px solid;border-radius:15px;}
.m3_zb_3 .role-itemsy .role-dec { position: absolute; width: 100%; height: 100%; left: -300%; transition: all 0.5s; }
.m3_zb_3 .role-itemsy .role-dec-bg { width: 100%; height: 100%; position: absolute; top:0px; left:0; background-color: #000; opacity: 0.7; }
.m3_zb_3 .role-itemsy .role-dec-cont { padding: 18px; color: #FFFFFF; position: absolute; line-height: 24px; }
.role-itemsy:hover .role-dec { top:0px; left:0px; }


.m3_zb_2 { width:572px;  height:auto; overflow:hidden;  padding:20px 10px 10px 10px;float:left;   background:#4a3728  url(../images/img03.png) left top no-repeat; border:#6b5a46 1px solid; position:relative; }
.in02 { position:absolute; width:572px; height:35px; background:url(../images/icon02.png) no-repeat; top:0px; left:150px;}
.m3_zb_2 .role-itemsk { width: 570px; height: auto; float: left; position: relative; }
.m3_zb_2 .role-itemsk img { width:565px; height:auto; overflow:hidden; margin-top:10px;  border:#6b5a46 2px solid;border-radius:15px;}
.m3_zb_2 .role-itemsk .role-dec { position: absolute; width: 100%; height: 100%; left: -300%; transition: all 0.5s; }
.m3_zb_2 .role-itemsk .role-dec-bg { width: 100%; height: 100%; position: absolute; top:0px; left:0; background-color: #000; opacity: 0.7; }
.m3_zb_2 .role-itemsk .role-dec-cont { padding: 18px; color: #FFFFFF; position: absolute; line-height: 24px; }
.role-itemsk:hover .role-dec { top:0px; left:0px; }


.m3_zb_1 { width:1180px;  height:auto; overflow:hidden;  padding:20px 10px 10px 10px;float:left;   background:#4a3728  url(../images/img03.png) left top no-repeat; border:#6b5a46 1px solid; position:relative; margin-bottom:10px}
.in03 { position:absolute; width:1180px; height:35px; background:url(../images/icon02.png) no-repeat; top:0px; left:455px;}
.m3_zb_1 .role-itemsk { width: 1180px; height: auto; float: left; position: relative; }
.m3_zb_1 .role-itemsk img { width:1152px; height:auto; overflow:hidden; margin-top:10px;  border:#6b5a46 2px solid;border-radius:15px;
    margin-left: 10px;
}
.m3_zb_1 .role-itemsk .role-dec { position: absolute; width: 100%; height: 100%; left: -300%; transition: all 0.5s; }
.m3_zb_1 .role-itemsk .role-dec-bg { width: 100%; height: 100%; position: absolute; top:0px; left:0; background-color: #000; opacity: 0.7; }
.m3_zb_1 .role-itemsk .role-dec-cont { padding: 18px; color: #FFFFFF; position: absolute; line-height: 24px; }
.role-itemsk:hover .role-dec { top:0px; left:0px; }


.m1 { width:1100px; height:auto;  overflow:hidden; margin:0 auto; }