@charset "utf-8";

/*清零*/
body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, table, td, img, div, dl, dt, dd, input { margin: 0; padding: 0; border: 0; }
body { font-size: 14px; font-family: 'simsun'; }
ul, ol { list-style-type: none; }
select, input, img { vertical-align: middle; outline: none; }
img{ border:none;}
ul{
    list-style:none;
}
a { text-decoration: none;  blr: expression(this.onfocus=this.blur());
outline: none; color: #fff; }
a:hover {  text-decoration: none; }
.clearfix:after { content: ""; display: block; clear: both; }
.clearfix { zoom: 1; }
.fl { float: left; }
.fr { float: right;}
.rows{ margin:10px 0; clear: both; margin-bottom: 20px;}
.rows:after { content: ""; display: block; clear: both; }

body{ background:#0d0119 url(/uploads/image/hrimages/bodytop.jpg) no-repeat 50% 32px;}

.container{ width: 930px; height: auto; margin:0 auto;}
.container .head{}
.head .logo{ display: inline-block; width: 250px; height: 138px; margin: 26px 0 18px 74px;}
.head .nav{ height: 60px; line-height: 60px; text-align: center; }
.head .nav ul{ width: 76%; margin: 0 auto;}
.head .nav li{ float: left; display: inline-block; width: 16%;}
.head .nav li a{ font-size: 16px; line-height: 60px; display: inline-block; }
.head .nav li a:hover{ color: #f00;}

/***********/
.area1_title{ height: 38px; line-height: 40px; color: #fff; font-size: 14px; margin-bottom: 10px;}
.area2{ height: 128px; background: url(/uploads/image/hrimages/free.jpg) no-repeat; height: 130px;}
.area2_left p.title{ background: url(/uploads/image/hrimages/span.png) no-repeat; display: inline-block;  width: 44px; padding: 40px 18px; color: #fff; font-size: 20px;text-align: center; float: left; margin:2px;}
.area2_left a{ display: block; width: 74px; height: auto; float: left;  background: url(/uploads/image/hrimages/img1_bg.jpg) no-repeat;  margin: 0 5px 0 4px;margin-top: 17px; position: relative;}
.area2_left a img{ width: 68px; height: 68px; padding: 3px;}
.area2_left a span{ display: block; height: 20px; line-height: 20px; text-align: center; color: #3d6f95; font-size: 12px; padding-top: 5px;}
.area1_title .first{ color: #3d6f95;}
.area2_left a:hover .hover_img{ position: absolute; width: 103px; height: 88px;content: ""; top:-7px; left:-13px; z-index: 3; background: url(/uploads/image/hrimages/hover_hero.png) no-repeat;}

.area3_left{ width: 566px;  height: 434px; border: 2px solid #2d1d5e;}
.area3_left .sublist{}
.area3_left .sublist a{ width: 180px; height: 126px; display: inline-block; margin-left: 8px; margin-right: -10px; }
.area3_left .sublist a.sub_img1{background: url(/uploads/image/hrimages/img2_01.jpg) no-repeat 0 9px;}
.area3_left .sublist a.sub_img1:hover{background: url(/uploads/image/hrimages/img2_01_hover.jpg) no-repeat 50%;}
.area3_left .sublist a.sub_img2{background: url(/uploads/image/hrimages/img2_02.jpg) no-repeat 0 9px;}
.area3_left .sublist a.sub_img2:hover{background: url(/uploads/image/hrimages/img2_02_hover.jpg) no-repeat 50%;}
.area3_left .sublist a.sub_img3{background:  no-repeat 0 9px;}
.area3_left .sublist a.sub_img3:hover{background:  no-repeat 50%;}
.sub_link{ width: 566px; height: 102px; margin-top: -2px;}
.sub_link a{ display: inline-block; height: 102px; background: url(/uploads/image/hrimages/all_hero.jpg) no-repeat 50% 0; width: 566px;}
.sub_link a:hover{background: url(/uploads/image/hrimages/all_hero_hover.jpg) no-repeat 50% 0;}
 
 .sub_type_child{ width: 134px; height: 206px; position: relative; float: left; margin-left: 6px;}
 .sub_type_child a{ display: inline-block; padding-top: 11px; position: relative;}
 .sub_type_child a img{ width: 134px; height: 184px;}
 .sub_type_child a span.bg{ display: block;  height: 38px;position: absolute; bottom: 2px; left:1px;opacity: 0.5; filter:alpha(opacity=50); background: #000;width: 98%;}
  .sub_type_child a .mar{ width: 137px; height: 224px; position: absolute; left:-1px; top:-3px;}
 .sub_type_child p{ line-height: 38px; text-align: center; position: absolute; bottom: 10px; left:1px;  width: 98%; color: #fff; font-size: 14px; font-family: 'microsoft yahei';}
 div.num1:hover .mar{ background: url(/uploads/image/hrimages/img15_bg.png) no-repeat;}
 div.num1:hover p{ color: #f42a5c;  display: block;}
 div.num2:hover .mar{ background: url(/uploads/image/hrimages/img16_bg.png) no-repeat; top:-5px; left:-2px;}
 div.num2:hover p{ color: #f02ce6;  display: block;}
 div.num3:hover .mar{ background: url(/uploads/image/hrimages/img17_bg.png) no-repeat; top:-5px;}
 div.num3:hover p{ color: #a9f3f5;  display: block;}
 div.num4:hover .mar{ background: url(/uploads/image/hrimages/img18_bg.png) no-repeat;}
 div.num4:hover p{ color: #6af8f7;  display: block;}


.area3_right{ width: 350px; height: auto;}
.area3_right .news_title{ margin-bottom: 10px;}
.area3_right .news_title a{ width: 348px; height: 116px; display: block; margin: 0 auto; background: url(/uploads/image/hrimages/new_title.jpg) no-repeat; }
.area3_right .news_title a:hover{ background: url(/uploads/image/hrimages/new_title_hover.jpg) no-repeat;}
.area3_right .news_list{ width: auto; margin-bottom: 10px; background: #150939;}
.area3_right .news_list .news_tit{ font-weight: normal; font-style: normal; height: 33px; line-height: 33px; border-top: 1px solid #2d1d5e; border-bottom: 1px solid #2d1d5e; position: relative;}
.area3_right .news_list .news_tit span{ font-size: 14px; color: #fff; display: inline-block; padding-left: 10px;}
.area3_right .news_list .news_tit a{ display: inline-block; width:46px; height: 16px; position: absolute; right: 10px; top:8px; background: url(/uploads/image/hrimages/more.png) 50% 0;}
.area3_right .news_list .news_tit a:hover{background: url(/uploads/image/hrimages/more.png) 50% -34px;}
.area3_right .news_list ul{ padding: 10px 0;}
.area3_right .news_list li{ height: 32px; padding-left: 26px; position: relative; line-height: 32px; overflow: hidden;}
.area3_right .news_list li a{ font-size: 12px; color: #3d6f95; padding-left: 2px;}
.area3_right .news_list li a:hover{ color: #48ccdc}
.area3_right .news_list li span{ width: 5px; height: 7px; background: url(/uploads/image/hrimages/small.png) no-repeat; font-style: normal; font-weight: normal; position: absolute; left:15px; top:14px; display: block;}

/****页尾***/
.footer{height:200px;background:url(/uploads/image/hrimages/foter.jpg) no-repeat center 0;}
#footer{line-height:25px;text-align:center;padding-top:30px; width: 930px; margin: 0 auto;}
#footer p{color:#9d9d9d;}
#footer p a:link,#footer p a:visited{color:#9d9d9d;}
#back{position: fixed; margin-left:960px; bottom: 100px; width: 47px; height: 47px;}
#back a{ width: 47px; height: 47px; display: inline-block; background: url(/uploads/image/hrimages/icon.png) no-repeat -110px -56px;}
#back a:hover{background: url(/uploads/image/hrimages/icon.png) no-repeat -181px -56px;}

.hero_tab{ position: relative; height: 162px;}
.hero_tab .hero_tab_a{ display: inline-block; width: 120px; height: 32px; background: url(/uploads/image/hrimages/hero_tab.jpg) no-repeat 0 0; position: absolute; right: 0; top:-45px;}
.hero_tab a.hero_tab_a:hover{ background: url(/uploads/image/hrimages/hero_tab.jpg) no-repeat 0 -54px;}
.hero_tab .hero_child{}
.hero_tab .hero_child a{ display: inline-block; width: 25px; height: 25px; position: absolute; bottom: 30px;}
.hero_tab .hero_child a.btn1{ left:42px;}
.hero_tab .hero_child a.btn2{ left:74px;}

.search{ position: relative;}
.search .name{ font-size: 14px; color: #fff;}
.search .oform input{ height: 26px; width: 660px; background: #0f0323; border: 1px solid #2d1d5e; border-radius: 5px; color: #76349d; line-height: 26px; padding-left: 15px;}
.search .btn{ width: 200px; height: 32px; position: absolute; right: 0; top:00px; text-align: right}
.search .btn .copy,.search .btn .set,.search .btn .share{ width: 55px; height: 30px; line-height: 30px; text-align: center; display: inline-block; background: url(/uploads/image/hrimages/icon.png) no-repeat 1px -254px;}
.search .btn a.copy:hover,.search .btn a.set:hover,.search .btn div.share:hover{ background: url(/uploads/image/hrimages/icon.png) no-repeat -75px -254px;}
.search .btn .share{ position: relative; color: #fff; cursor: pointer;}
.search .btn .share .share_box{ background: #491b64; width: 128px; height: 104px; border: 1px solid #76349d; border-radius: 5px; position: absolute; left: -75px; top:32px; z-index: 5; display: none;}
.search .btn .share .share_box a{ display: block; margin: 0 10px; padding-left: 42px; height: 34px; border-bottom:1px solid #602881; line-height: 34px; color: #fff; text-align: left; position: relative;}
.search .btn .share .share_box a span{ position: absolute; left:10px; top:6px; width: 23px; height: 23px; display: inline-block;}
.search .btn .share .share_box .sina span{ background: url(/uploads/image/hrimages/icon.png) no-repeat 0 0; }
.search .btn .share .share_box .qq span{ background: url(/uploads/image/hrimages/icon.png) no-repeat 0 -34px; }
.search .btn .share .share_box .wxin span{ background: url(/uploads/image/hrimages/icon.png) no-repeat 0 -70px; }

.search .btn .share .share_box a.sina:hover span{ background: url(/uploads/image/hrimages/icon.png) no-repeat -50px 0; }
.search .btn .share .share_box a.qq:hover span{ background: url(/uploads/image/hrimages/icon.png) no-repeat -50px -34px; }
.search .btn .share .share_box a.wxin:hover span{ background: url(/uploads/image/hrimages/icon.png) no-repeat -50px -70px; }

.talent_left{ width: 366px; height: auto; background: #150939;}
.talent_left .tal_box{ margin: 0 12px; margin-top: 10px; border-bottom: 1px solid #2d1d5e; padding-top: 10px; padding-bottom: 16px;}
.talent_left .tal_box .tal_num1{ position: relative;}
.talent_left .tal_box .tal_num1 .tal_img{ width: 57px; height: 57px; display: inline-block; background: url(/uploads/image/hrimages/item_bg.png) no-repeat center center; position: relative;}
.talent_left .tal_box .tal_num1 .tal_img:hover{ background: url(/uploads/image/hrimages/scarab_hover.png) no-repeat center center;-webkit-transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear; -moz-transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear; -o-transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear; transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear;}
.talent_left .tal_box .tal_num1 .tal_img img{ position: absolute; left:2px; top:2px; width: 53px; height: 53px;}
.talent_left .tal_box .tal_num1 .a_title{ position: absolute; display: inline-block; left:70px; top:0px; color: #47ccdd;}
.talent_left .tal_box .tal_num1 .a_title span{ color: #fe78fb;}
.talent_left .tal_box .tal_num1 .a_btn{ display: inline-block; width: 78px; height: 32px; background: url(/uploads/image/hrimages/icon.png) no-repeat -100px -153px; position: absolute; right: 0; top:-10px; color: #fff; text-align: center; line-height: 32px; font-size: 12px;}
.talent_left .tal_box .tal_num1 .time{ color: #ff76ff;  position: absolute; right: 0; top:32px; font-size: 12px;}
.talent_left .tal_box .intro_blue{ color: #3b6f96; line-height: 18px; font-size: 12px; padding: 3px 0}
.talent_left .tal_box .intro_blue span{ color: #47ccdd;}
.talent_left .tal_box .intro_red{ line-height: 18px; color: #76349d; font-size: 12px;}
.talent_left .tal_box .intro_red span{ color: #ff76ff;}

.talent_left .cur .tal_num1 .a_title,.talent_left .cur .tal_num1 .a_btn,.talent_left .cur .tal_num1 .a_title span,.talent_left .cur .tal_num1 .time,.talent_left .cur .intro_blue,.talent_left .cur .intro_blue span,.talent_left .cur .intro_red,.talent_left .cur .intro_red span{ color: #666666;}
.talent_left .cur .tal_num1 .a_btn{ background: url(/uploads/image/hrimages/icon.png) no-repeat -1px -153px;}


.talent_right{ width: 530px; height: auto;}
.talent_right .tal_list{ height: 94px; position: relative;}
.talent_right .tal_list .tal_num{ width: 38px; height: 32px; display: inline-block; background: url(/uploads/image/hrimages/icon.png) no-repeat -50px -204px; float: left; margin-right: 12px; line-height: 32px; color: #fff; text-align: center; margin-top: 12px;}
.talent_right .tal_list .tal_list_item{ width: 57px; height: 57px; display: inline-block; position: relative; margin-right: 5px; background: url(/uploads/image/hrimages/scarab_hover.png) no-repeat center center; }
.talent_right .tal_list .tal_list_item img{ width: 53px; height: 53px; position: absolute; left:2px; top:2px;}
/*.talent_right .tal_list a.tal_list_item:hover .mar{ width: 57px; height: 57px; display: inline-block; background: url(/uploads/image/hrimages/item_bg.png) no-repeat; position: absolute; left:0; top:0;}*/
.talent_right .tal_list .tal_list_item:hover{ background: url(/uploads/image/hrimages/item_bg.png) no-repeat center center;-webkit-transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear; -moz-transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear; -o-transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear; transition: background 0.3s cubic-bezier(.17, .67, .88, 1.25), color 0.2s linear;}
.talent_right .tal_list .tal_list_desc{ width: 146px; padding: 5px 8px; line-height: 18px; color: #76349d; background: #150939; font-size: 12px; position: absolute; right: 0; top:0;min-height: 47px;}
.talent_right .tal_list .tal_list_desc span{ color: #ff76ff; font-size: 12px; }
.talent_right .tal_btn{ margin-bottom: 30px; }
.talent_right .tal_btn p{ color: #fff; font-size: 14px; padding: 15px 0;}
.talent_right .tal_btn a{ display: inline-block; width: 155px; height: 66px; background: url(/uploads/image/hrimages/pic_bg.png) no-repeat 0 0; text-align: center; line-height: 47px;}
.talent_right .tal_btn a:hover{background-position: -159px 0;}


/******弹出层*****/
.heroes_skill_tip{ width: 439px; height: auto; background:#0d0119; position: absolute; left:45%; top:45%; }
.heroes_skill_tip .heros_bg{ border-left:1px solid #3e287c;}
.heroes_skill_tip .heroes_skill_up{ background: #281562; border-left:1px solid #3e287c; border-right:1px solid #3e287c; position: relative;min-height: 72px;}
.heroes_skill_tip .heroes_skill_up .heroes_img{ position: absolute; width: 73px; height: 73px; display: inline-block; left:20px; top:-15px; text-align: center; background: url(/uploads/image/hrimages/pic_bg.png) no-repeat 0 -83px; }
.heroes_skill_tip .heroes_skill_up .heroes_img img{ padding-top: 4px; width: 63px; height: 63px;}
.heroes_skill_tip .heroes_skill_up .heroes_skill_title{ display: inline-block; position: absolute; top:-15px; color: #fff; left:110px;}
.heroes_skill_up .heroes_skill_title .title{ font-size: 16px; color: #48ccdc; padding-right: 10px;}
.heroes_skill_up .heroes_skill_title .number{ color: #999999;}
.heroes_skill_up .heroes_skill_intro{ width: 320px; color: #fff; position: absolute; left:110px; top:10px; font-size: 12px; line-height: 18px;}
.split{ border-bottom: 1px solid #2d1d5e; margin: 0 20px;}
.heroes_skill_down{ background: #281562; border: 1px solid #3e287c; border-top:none; padding-bottom: 15px;}
.heroes_skill_down .title{ color: #3d6f95; font-size: 12px; line-height: 18px; height: 18px; padding: 10px 0 6px 0;padding-left: 20px; }
.hero_skill_list{ margin: 0 3px;}
.hero_skill_list a{ display: inline-block; width: 50px; height: 50px; float: left; margin-left: 10px; margin-top: 6px; text-align: center; background: url(/uploads/image/hrimages/hero_skill_bg.jpg) no-repeat;}
.hero_skill_list a img{ margin-top: 4px; margin-left: 0px;}

/**************/
.details{ min-height: 940px; background: url(/uploads/image/hrimages/detail_bg.jpg) no-repeat 50% bottom;}
.talent_detail{ border: 1px solid #361266; background: #0f0323;}
.talent_detail_box{ padding: 15px 20px 0px 20px; background: url(/uploads/image/hrimages/split_top.png) no-repeat 50% -1px;}
.talent_detail_box h3{ font-style: normal; font-weight: normal; font-size:34px; font-family: 'microsoft yahei'; color: #fff;}
.talent_detail_box .up{ margin: 10px 0;}
.talent_detail_box .talent_detail_img{ width: 72px; height: 72px; display: inline-block; float: left; background: url(/uploads/image/hrimages/pic_bg.png) 0 -82px; text-align: center;}
.talent_detail_box .talent_detail_img img{ width: 64px; height: 64px; padding-top: 4px;}
.talent_detail_box .up .title{ float: left; margin-left: 10px; color: #fff; font-size: 16px; height: 24px; padding-bottom: 4px; width: 90%;}
.talent_detail_box .up .title span{ color: #ff77fd; padding-left: 20px; font-size: 12px;}
.talent_detail_box .up .delete{ float: left; margin-left: 10px; color: #999999; font-size: 12px;width: 90%;padding-bottom: 8px;}
.talent_detail_box .up .intro{float: left; margin-left: 10px; color: #999999; font-size: 12px;width: 90%;}
.talent_detail_box .split{ height: 3px; background: url(/uploads/image/hrimages/split_bg.png) no-repeat 50% 0; border-bottom: none; margin: 20px 0 15px 0;}
.talent_detail_box .down{ padding-bottom: 15px; }
.talent_detail_box .down .title{ color: #fff; display: inline-block; font-size: 16px; float: left;}
.talent_detail_box .down a{ display: inline-block;  width: 72px; height: 72px; background: url(/uploads/image/hrimages/pic_bg.png) 0 -82px; float: left; text-align: center; margin-left: 30px; position: relative;}
.talent_detail_box .down a img{width: 64px; height: 64px; padding-top: 4px; }
.talent_detail_box .down a:hover .mar{ width: 102px; height: 88px; display: inline-block; background: url(/uploads/image/hrimages/pic_bg.png) -84px -74px; position: absolute; left:-15px; top:-7px;}
.bottom_bg {background: url(/uploads/image/hrimages/split_bot.png) no-repeat 50% 1px; height: 33px; margin-top:-15px;}


.skill_detail{ position: relative;}
.skill_detail .ski_del_img{ width: 150px; height: 100px; display: inline-block; position: absolute; right: 30px; top:34px; text-align: center;}
/*.skill_detail .ski_del_img img{ width: 148px; height: 98px; padding: 1px;}
.skill_detail a.ski_del_img:hover { background: #e84bec}*/
.skill_detail .up .intro{ width: 72%}
.skill_detail .btnstart{display: inline-block; width: 36px; height: 42px; background: url(/uploads/image/hrimages/icon.png) no-repeat -108px 0; position: absolute; margin-left: 14px; position: absolute;top:27px; left:53px; }
.skill_detail .btnstart:hover{background-position: -157px 0;}

.hero_list_search{ background:#0e0323 url(/uploads/image/hrimages/split_top.png) no-repeat 50% -1px; border:1px solid #1b0c33;}
.hero_list_type{ width: 132px; height: 123px; float: left; display: inline-block; position: relative; text-align: center; margin-left: 20px;}
.hero_list_type .title{ display: inline-block; width: 80px; height: 32px; background: url(/uploads/image/hrimages/icon.png) no-repeat 0 -106px; margin: 14px auto; line-height: 32px; color: #9081bf; font-size: 12px; cursor: pointer;}
.hero_list_type a{ width: 39px; height: 33px; display: inline-block; position: absolute; background: url(/uploads/image/hrimages/icon.png) no-repeat 0 -203px; text-align: center;}
.hero_list_type a:hover{background: url(/uploads/image/hrimages/icon.png) no-repeat -49px -203px;}
.hero_list_type a .mar{ width: 25px; height: 25px; background: url(/uploads/image/hrimages/type.png) no-repeat 0 0; margin-top: 4px; display: inline-block; }
.hero_list_type a:hover .mar{background: url(/uploads/image/hrimages/type.png) no-repeat 0 -54px;}
.hero_list_type a.hero_type_num1{ left:0 ;bottom:32px;}
.hero_list_type a.hero_type_num1 .mar{ background-position: 2px 0;}
.hero_list_type a.hero_type_num1:hover .mar{ background-position: 2px -54px;}
.hero_list_type a.hero_type_num2{ left:31px;bottom:14px;}
.hero_list_type a.hero_type_num2 .mar{ background-position: -25px 0;}
.hero_list_type a.hero_type_num2:hover .mar{ background-position: -25px -54px;}
.hero_list_type a.hero_type_num3{ left:62px;bottom:32px;}
.hero_list_type a.hero_type_num3 .mar{ background-position: -52px 0;}
.hero_list_type a.hero_type_num3:hover .mar{ background-position: -52px -54px;}
.hero_list_type a.hero_type_num4{ left:93px;bottom:14px;}
.hero_list_type a.hero_type_num4 .mar{ background-position: -79px 0;}
.hero_list_type a.hero_type_num4:hover .mar{ background-position: -79px -54px;}

.otype2{ width:104px; margin-left: 26px;}
.otype2 a.hero_type_num1 .mar{ background-position: -118px 0;}
.otype2 a.hero_type_num1:hover .mar{ background-position: -118px -54px;}
.otype2 a.hero_type_num2 .mar{ background-position: -150px 0;}
.otype2 a.hero_type_num2:hover .mar{ background-position: -150px -54px;}
.otype2 a.hero_type_num3 .mar{ background-position: -183px 0;}
.otype2 a.hero_type_num3:hover .mar{ background-position: -183px -54px;}

.otype3{ width: 104px; margin-left: 40px;}
.otype3 a .mar{ background: none; color: #7463a9; font-size: 12px; line-height: 25px;}
.otype3 a:hover .mar{ background: none; color: #bdaeea;}
.hero_search{ width: 424px; background: url(/uploads/image/hrimages/search.png) no-repeat 0 0; height: 46px; float: left; margin-left: 38px; margin-top: 38px; position: relative;}
div.hero_search:hover{ background: url(/uploads/image/hrimages/search.png) no-repeat 0 -86px;}
.hero_search .search_form .btnsearch{ width: 34px; height: 34px; display: inline-block; position: absolute; right: 14px; top:6px;}
.hero_search .search_form .text{ background: none ; height: 24px; line-height: 24px; width: 360px; margin-top: 10px; margin-left: 15px;  color: #a9a9a9 }
div.hero_search:hover .text{ color: #fff}
.hero_list_search .bottom_bg{ width: 100%; float: left; margin-top: -33px;}

/*****hero******/
.hero_list{ margin: 30px 0 20px 0; width: 102%; min-height:300px;}
.hero_list_item {padding: 30px 0;width: 216px;float: left;margin-right: 20px;}
.hero_list_item a {width: 100%;display: block;color: #fff;position: relative;cursor: pointer;}
.hero_list_box {height: 300px;width: 206px;padding: 5px;background: #14324e;background:url(/uploads/image/hrimages/hero_bg.png) no-repeat; position: relative;}
.hero_list_box .h_img {height: 300px;width: 206px;vertical-align: top;}
.hero_list_item h4 {font-size: 16px;font-weight: normal;line-height: 30px;padding-left: 2px;padding-top: 10px;color: #48ccdc;position: relative;z-index: 10;}
.hero_list_item .hero_heading {font-size: 12px;color: #fff;line-height: 28px;height: 28px;position: relative;z-index: 10;}
.hero_list_item .hero_heading span {width: 25px;height: 25px;display: block;float: left;vertical-align: top;margin-right: 5px;}
.hero_list_item a .hover-border {position: absolute;height: 490px;content: "";top: -95px;left: -62px;width: 340px;z-index: 3;opacity: 0;background: url(/uploads/image/hrimages/hero_hover.png) top center no-repeat;transition: opacity .5s ease 0s; display: none;}
.hero_list_item a:hover .hover-border {display: block;opacity: 1;}
.hero_list_box .icon_name{ position: absolute; right: 10px; bottom: 13px; }
.hero_list_item .hero_heading .hero_icon{ padding-right: 10px; padding-left: 3px;}

.focus{ height: 645px; border: 1px solid #2d1d5e;}
.h_skill{ }
.h_skill .h_skill_btn a{display: inline-block;width: 155px;height: 66px;background: url(/uploads/image/hrimages/pic_bg.png) no-repeat 0 0;text-align: center;line-height: 47px;}
.h_skill .h_skill_btn a:hover{}
.h_skill_list{ margin-bottom: 0px; width: 102%;}
.h_skill_title{ display: block; height: 36px; margin: 10px 0;}
.h_skill_title a{ display: inline-block; width: 78px; height: 32px; background: url(/uploads/image/hrimages/icon.png) no-repeat -100px -153px; line-height: 32px; text-align: center;}
.h_skill_box { width: 300px; height: 210px; background: url(/uploads/image/hrimages/skill_list.png) no-repeat; position: relative; display: inline-block; float: left; margin-right: 16px; margin-bottom: 16px;}
.h_skill_box .h_skill_body { margin: 0 20px ; padding-top: 20px; padding-bottom: 10px;}
.h_skill_box .h_skill_body a{ width: 72px; height: 72px; display: inline-block; float: left; background: url(/uploads/image/hrimages/pic_bg.png) no-repeat 0 -82px; text-align: center;}
.h_skill_box .h_skill_body a img{ width: 64px; height: 64px; padding-top: 4px;}
.h_skill_box .h_skill_body p{ float: left;  margin-left: 14px;}
.h_skill_box .h_skill_body p.p_title{ font-size: 16px; color: #48ccdc; height: 20px; padding-bottom: 8px;}
.h_skill_box .h_skill_body p.p_title span{ color: #ff77fd;}
.h_skill_box .h_skill_body p.p_desc{ color: #999999;}
.h_skill_box .intro{ margin: 0 20px; color: #3d6f95; line-height: 18px; font-size: 12px;}
.h_skill_box .split{ position: absolute; bottom: 33px; left:0px; height: 2px; border-bottom: 1px solid #2d1d5e; margin-right: 20px; width: 86%;}
.h_skill_box .second{ color: #ff77fd; font-size: 12px;  position: absolute; bottom: 10px; right: 20px;}
div.h_skill_box:hover{ background: url(/uploads/image/hrimages/skill_list_hover.png) no-repeat;}
div.h_skill_box:hover .h_skill_body p.p_desc{ color: #cbcbcb}
div.h_skill_box:hover .intro{ color: #48ccdc;}
div.h_skill_box:hover .split{ border-color: #672b78}

.h_talent{ position: relative;}
.h_talent .talent_btn{width: 276px; height: 248px; display: inline-block; position: absolute; right: 20px; top:0; background: url(/uploads/image/hrimages/talent.png) no-repeat 0 0;}
.h_talent a.talent_btn:hover{ background: url(/uploads/image/hrimages/talent_hover.png) no-repeat 0 0;}
.h_talent .h_skill_btn a{display: inline-block;width: 155px;height: 66px;background: url(/uploads/image/hrimages/pic_bg.png) no-repeat 0 0;text-align: center;line-height: 47px;}
.talent_tab{ width: 560px; border: 2px solid #2d1d5e;}
.talent_tab dt{ background: #31144b;}
.talent_tab span{ width: 80px; height: 41px; display: inline-block; border-bottom: 1px solid #2d1d5e; text-align: center; font-size: 18px; color: #cccccc; line-height: 40px; background: #31144b; float: left; font-family: 'microsoft yahei'; cursor: pointer;}
.talent_tab span.current{ color: #ff77fd; border-bottom:1px solid #0d0119; background: #0d0119;  }
.talent_tab dd { display: none;}
.talent_tab dd a {display: block;width: 72px;height: auto;float: left;background: url(/uploads/image/hrimages/pic_bg.png) no-repeat 0 -82px;margin: 20px 0px 15px 0;position: relative; margin-left: 30px;}
.talent_tab dd a img {width: 64px;height: 64px;padding: 4px;}
.talent_tab dd a:hover .hover_img{ position: absolute; width: 103px; height: 88px;content: ""; top:-7px; left:-13px; z-index: 3; background: url(/uploads/image/hrimages/pic_bg.png) no-repeat -86px -74px;}
.talent_tab dd a{ margin-bottom:10px; *padding-bottom: 15px; }
.talent_tab dd a em{ font-size:12px; font-family:"微软雅黑"; line-height:26px; font-style:normal; }
/******新闻资讯***/
.hero_news_left{ width: 566px; float: left; height: auto; background: #150939;}
.hero_news .news_title{ height: 33px; width: auto; border-top:1px solid #2d1d5e; border-bottom:1px solid #2d1d5e;  color: #fff;line-height: 33px; font-size: 12px; padding-left: 15px; position: relative;}
.hero_news .news_title a{display: inline-block; width:46px; height: 16px; position: absolute; right: 10px; top:8px; background: url(/uploads/image/hrimages/more.png) 50% 0;}
.news_desc{ margin:0 30px; padding: 30px 0;}
.news_desc .news_img{ width: 170px; height: 130px; display: inline-block; float: left; background: #31144b;}
.news_desc .news_img img{ width: 166px; height: 126px; padding: 2px;}
.news_desc a.news_img:hover{ background: #e84bec;}
.news_desc h3{ float: left; margin-left: 10px; font-size: 16px; color: #7ee8f5; display: inline-block; width: 324px; height: 45px;}
.news_desc h3 a{ color: #7ee8f5; font-size: 16px;}
.news_desc .intro{ color: #cccccc; font-size: 12px; line-height: 20px; float: left;width: 324px; margin-left: 10px; height: 72px;}
.news_desc .come{ color: #666666; font-size: 12px; float: left; margin-left: 10px; }
.hero_news_left .split{ margin: 0 30px; height: 2px; border-bottom: 1px solid #2d1d5e;}

.hreo_news_right{ width: 350px; float: right; background: #150939}
.news_video{ margin: 0 20px; padding: 24px 0 9px 0;}
.news_video .news_video_img{ width: 150px; height: auto; display: block; position: relative;}
.news_video .news_video_img img{ width: 148px; height: 98px; border: 1px solid #2d1d5e; margin-bottom: 14px;}
.news_video .news_video_img span{ width: 100%; line-height: 22px; color: #cccccc; text-align: center; display: inline-block; font-size: 12px;}
.news_video a.news_video_img:hover img{ border:1px solid #e84bec;}
.news_video .news_video_img .start{ position: absolute; left:53px; top:27px; width: 47px; height: 47px; border: none;}
.news_video a.news_video_img:hover .start{ border: none;}
.hreo_news_right .split{ margin: 0 30px; height: 2px; border-bottom: 1px solid #2d1d5e;}

/*******焦点图*******/
.focus{ position: relative;}
.focus .hero_tab_a{ display: inline-block; width: 120px; height: 32px; background: url(/uploads/image/hrimages/hero_tab.jpg) no-repeat 0 0; position: absolute; right: 0; top:-45px;}
.focus a.hero_tab_a:hover{ background: url(/uploads/image/hrimages/hero_tab.jpg) no-repeat 0 -54px;}
.focus_img{ position: absolute; left:1px; top:1px; width: 925px; height: 644px; overflow: hidden;}
.focus_img ul{width: 925px; height: 644px; overflow: hidden; }
.focus_img .focus_li{ width: 100%; height: 100%; overflow: hidden; position: relative; background: url(/uploads/image/hrimages/herobg.jpg) 0 -37px;}
.focus_img .focus_li a{ display: block; width: 100%; height: 100%}
.focus_img .focus_li a img{ width: 100%; margin-left: 200px;}
.focus_img .focus_li .price{ position: absolute; right: 24px; top:20px; color: #48ccdc; font-family: 'microsoft yahei'; font-size: 16px;}
.focus_img .focus_li .price span{ color: #ffffff;}
.focus_btn{ position: absolute; z-index: 2; right: 10px; bottom: 14px; width: 200px; height: 102px;}
.focus_btn span{ width: 16px; height: 30px; display: block; position: absolute; top:45%; background: url(/uploads/image/hrimages/icon.png) no-repeat 0 0; cursor: pointer;}
.focus_btn span.prev{ background-position: 0px -352px; left:0;}
.focus_btn span.next{ right: 0;background-position: -52px -352px;}
.focus_btn .focus_box{ width: 158px; position: absolute; left:23px; overflow: hidden; top:13px; height: 90px;}
.focus_btn .focus_box li{ float: left; margin-left: 14px; margin-right: 14px;  background:url(/uploads/image/hrimages/focus.png) no-repeat; margin-top: 24px; }
.focus_btn .focus_box li a{ width: 48px; height: 48px; margin: 1px; display: block;position: relative;}
.focus_btn .focus_box a .mar{ background: none; width: 86px; height: 94px;position: absolute; left:-26px; top:-24px; background-size: 100%; z-index: 9}
.focus_btn .focus_box a:hover .mar{ background: url(/uploads/image/hrimages/thumb.png) no-repeat 8px 0; }

.focus_left{ width: 388px; height: 643px; position: absolute; top:1px; left:1px;}
.focus_left .block{ width: 388px; height: 643px;position: absolute; top:0; left:0; z-index: 3; background: #140922; opacity: 0.9; filter:alpha(opacity=90);}
.focus_left .focus_cont{ width: 388px; height: 643px; position: absolute; z-index: 5; left:0; top:0;}
.focus_cont .focus_cont_sec1{ margin: 0 16px; position: relative; background: url(/uploads/image/hrimages/fl_split.png) no-repeat 50% bottom; padding-bottom: 5px;}
.focus_cont .focus_cont_sec1 .title{ color: #fff; font-size: 34px; font-family: 'microsoft yahei'; display: inline-block; padding-top: 18px;text-shadow: 1px 1px 30px #27258d;}
.focus_cont .focus_cont_sec1 .f_img1{ position: absolute; top:8px; left:230px;}
.focus_cont .focus_cont_sec1 .f_img2{ position: absolute; top:20px; right: 18px;}
.focus_cont .focus_cont_sec1 .hero_name{ color: #48ccdc; font-size: 20px; font-family: 'microsoft yahei'; height: 50px; line-height: 50px; padding-left: 3px;text-shadow: 1px 1px 30px #00e0ff;}
.focus_cont .focus_cont_sec1 .hero_name a{ display: inline-block; width: 36px; height: 42px; background: url(/uploads/image/hrimages/icon.png) no-repeat -108px 0; position: absolute; margin-left: 14px; }
.focus_cont .focus_cont_sec1 .hero_name a:hover{ background-position: -157px 0;}
.focus_cont_sec2{ background: url(/uploads/image/hrimages/fl_split.png) no-repeat 50% bottom; padding-bottom: 5px;}
.focus_cont_sec2 p{ color: #6b5895; font-size: 12px; line-height: 20px; padding: 20px 0; margin: 0 16px;}

.focus_cont_sec3 {margin: 0 16px; padding: 2px 15px; margin-bottom: 30px;}
.focus_cont_sec3 li{ float: left; width: 160px; position: relative; margin-top: 12px;}
.focus_cont_sec3 li .title{ color: #999999;  font-size: 12px; position: absolute; left:36px; top:4px;}
.focus_cont_sec3 .power{ position: absolute; left:37px; bottom: 0; height: 10px;}
.focus_cont_sec3 .power span{ float: left; display: inline-block; width: 7px; height: 7px; background: #3a2d57; margin-right: 2px;}
.focus_cont_sec3 .hero_power1 span.on{ background: #ff77fd;}
.focus_cont_sec3 .hero_power2 span.on{ background: #58baff;}
.focus_cont_sec3 .hero_power3 span.on{ background: #a27ce7;}
.focus_cont_sec3 .hero_power4 span.on{ background: #a27ce7;}

.focus_cont_sec4{ margin: 0 20px;  height: auto; position: relative; height: 270px;}
.focus_cont_sec4 .m_levelwrap{ height: 20px; width: 94%; margin: 0 auto; margin-bottom: 18px;}
.focus_cont_sec4 .j_scrollbtn{ width: 55px; height: 19px; display: inline-block; background: url(/uploads/image/hrimages/lv.png) no-repeat; position: absolute; left:0; z-index: 6; line-height: 18px;}
.focus_cont_sec4 .levelline{ border-top: 1px solid #bf3ebe; position: absolute; left:0; top:9px; z-index: 5; width: 100%; height: 1px;}
.j_propertypanel{ margin-bottom: 26px;}
.f_proterty {overflow: hidden;color: #999999;font-size: 12px;line-height: 23px;margin-top: 8px;}
.f_proterty dt {float: left;text-align: right;width: 65px;}
.f_proterty dd {overflow: hidden;position: relative;}
.f_proterty dd .f_colorframe {float: left;width: 230px;height: 21px;background: #150a26;border: 1px solid #250e35;}
.f_proterty dd .f_textshow {float: left;width: 33px;margin-left: 8px;}
.f_proterty dd .f_step {position: absolute;top: 0;left: 36%; color: #fff;}
.f_proterty .f_proterty_color {display: block;height: 100%;}
.f_proterty .f_proterty_health {background: #27e543;}
.f_proterty .f_proterty_healthregen {background: #068406;}
.f_proterty .f_proterty_mana {background: #1269c3;}
.f_proterty .f_proterty_manaregen {background: #0654a5;}
.f_proterty .f_proterty_damage {background: #c74c10;}
.f_proterty .f_proterty_manaregen {background: #96390b;}

.property{ height: 25px;}
.property p{ width: 151px; height: 25px; }
.property p span{ height: 25px; display: inline-block; float: left;}
.property p.sp1{ float: left;}
.property p.sp1 .sp_bg{ width: 2px; background: #bf3ebe; float: left;}
.property p.sp1 .sp_title{ float: right; width: 136px; background: #3a2d57; line-height: 25px;  padding-left: 10px; color: #fff; font-size: 12px; margin-left: 3px;}
.property p.sp2{ float: left; margin-left: 20px;}
.property p.sp2 .sp_bg{ width: 2px; background: #48ccdc; float: left;}
.property p.sp2 .sp_title{ float: left; width: 136px; background: #133457; line-height: 25px;  padding-left: 10px; color: #fff; font-size: 12px; margin-left: 3px; }
.property p.sp1 .sp_title .power,.property p.sp2 .sp_title .power{ position: absolute; z-index: 50;}

/****阴影***/
.focus_show{ width: 100%; height: 35px; background: url(/uploads/image/hrimages/top.png) no-repeat 50% 0; position: absolute; bottom: -35px;}

/***视频播放器****/
.video{ position: absolute; right:52px; top:172px; background: #000; z-index: 7; width: 486px; height: 300px;}
.video .btnclose{ width: 50px; height: 50px; display: inline-block; color: #fff; font-weight: bold; font-size: 30px; position: absolute; right: -50px; top:0; text-align: center; background: url(/uploads/image/hrimages/btnclose.jpg) no-repeat; font-family: 'microsoft yahei';}
.video .play{ width: 100%; height: 100%}

/***下拉列表***/
.hero_rotation{ background:#1f0736 url(/uploads/image/hrimages/top.png) no-repeat 50% 0; position: absolute; left:0; top:0; width: 930px; height: auto;z-index: 9999;}
.hero_row{ width: 840px; margin: 0 auto; margin-top: 24px;  text-align: center;}
.hero_row .hero_row_sec{ text-align: center; }
/*.hero_row .hero_row_sec a{ display: inline-block; width: 68px; height: 77px; position: relative; float: left; margin-right: 5px; *z-index: 9;}
.hero_row .hero_row_sec a:hover .mar{ position: absolute; left:-9px; top:-10px; display: inline-block; width: 85px; height: 92px; background: url(/uploads/image/hrimages/hexagon-frames_h.png) no-repeat; z-index: 66; background-size:100% ;}
.hero_row .hero_row_sec a .title{  width: 100px; height: 32px; background: url(/uploads/image/hrimages/icon.png) no-repeat 0 -305px; position: absolute; right: -110px; top:20px; text-align: center;color: #fff; line-height: 32px; font-size: 12px; display: none; z-index: 77; }
.hero_row .hero_row_sec a:hover .title{ display: block;}
.hero_row .even{ margin-left: 37px;}
.hero_row .even a{ top:-13px; }
.hero_row .odd a{ top:-26px; }
.hero_row .evens{ width:170px; margin-left: 257px;}
.hero_row .evens a{ top:-39px;}*/
.hero_row_sec .hero{display: inline-block;position: relative;width: 68px; height: 68px;text-align: left;margin: 0 2px; *float:left;}
.hero_row_sec .hero .icon_wrap,.hero_row_sec .hero .link_wrap{width: 100%;height: 100%;position: relative;display: inline-block;overflow: visible;}
.hero_row_sec .hero .icon_wrap .icon,.hero_row_sec .hero .link_wrap .icon{display: inline-block;overflow: hidden;
-webkit-transform: scalex(1.60) scaley(1.02) rotate(45deg) translate(11px,4px);
-moz-transform: scalex(1.60) scaley(1.02) rotate(45deg) translate(11px,4px);
transform: scalex(1.60) scaley(1.02) rotate(45deg) translate(11px,4px);height: 53px;width: 52px;text-align: center;}
.hero_row_sec .hero .icon_wrap .icon img, .hero_row_sec .hero .link_wrap .icon img{-webkit-transform: rotate(-45deg) scalex(0.56) translate(0px,-15px);
-moz-transform: rotate(-45deg) scalex(0.56) translate(0px,-15px);
transform: rotate(-45deg) scalex(0.56) translate(0px,-15px);width: 68px; height: 68px;}
.hero_row_sec .hero .link_wrap{position: absolute;top: 0;left: 0;}
.hero_row_sec .hero .link_wrap a{overflow: visible;cursor: pointer;z-index: 100; display: inline-block;
-webkit-transform: scalex(1.60) scaley(1.02) rotate(45deg) translate(11px, 4px);
-moz-transform: scalex(1.60) scaley(1.02) rotate(45deg) translate(11px, 4px);
transform: scalex(1.60) scaley(1.02) rotate(45deg) translate(11px, 4px);
height:52px;
width: 53px;
text-align: center;}

.hero_row_sec .hero .icon_wrap:after, .hero_row_sec .hero:hover .link_wrap:after{position: absolute;left: -1px;top: -7px;height: 93px;width: 82px;content: "";z-index: 1;background: url(/uploads/image/hrimages/hexagon.png) 0 0 no-repeat;}
.hero_row_sec .hero.selected .icon_wrap:after,.hero_row_sec .hero:hover .icon_wrap:after{left:-9px;top:-10px;background:url(/uploads/image/hrimages/hexagon_current.png) no-repeat; z-index: 6}
.hero_row_sec .hero .link_wrap s{height: 23px;line-height: 23px;text-align: center;background:url(/uploads/image/hrimages/title_bg.png) 0 0 no-repeat;right:-60px;position:absolute;top:13px;display:none;font-size:12px;text-decoration:none;color:#fff;white-space:nowrap; color: #fff; z-index: 8; width: 70px;}
.hero_row_sec .hero:hover .link_wrap s{display:block; z-index: 99999;}
.hero_row_sec .row{ margin-bottom: 0px;}
.hero_row_sec .hero .icon_wrap img{ padding-top: 1px;}



.hero_show{ position: absolute; bottom: 0; background: url(/uploads/image/hrimages/bottom.png) no-repeat 50% 0; height: 35px; width: 100%; z-index: 8;}
.hero_row .hero_row_sec a img{}

/********ie7*****/
.hero_row .hero_row_sec a:hover .mar{ *z-index: 100;}
.hero_row .evens{ *margin-left: 89px;}
.h_skill_box .h_skill_body p.p_title,.h_skill_box .h_skill_body p.p_desc{ *display: block; *width: 150px;}
.hero_list_search{ *height: 125px;}
.search .btn .copy, .search .btn .set, .search .btn .share{ *float: left; *margin-left: 10px;}
.area3_left .sublist a{ *margin-right: -2px;}
#back{ *margin-left: 514px;}
.hero_row .hero_row_sec a img{ *position: absolute; *z-index: 10; *left:0; *top:0;}
.hero_row .hero_row_sec a:hover{ *z-index: 10;}


		.property p .sp_title{ position:relative; z-index:10;}
		.atvalue{ font-style:normal;}
		.property p .sp_title span{ position:relative; z-index:10;}
		.property p .sp_title .atbg{ position:absolute; background:#bf3ebe; height:25px; left:0; top:0; z-index:0;}
		.property p.sp2 .sp_title .atbg{background:#336666}
		
	 	.focus_cont_sec4 .m_levelwrap{ position:relative; width: 94%;}
		.focus_cont_sec4 .j_scrollbtn{ cursor:pointer; text-align:center; color: #f44cf3;;}
	 	.cur img,.gray{ filter:;filter:gray;-webkit-filter:grayscale(100%); -moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);	}
    	.heroes_skill_tip{ display:none;}
		.alpha{filter:alpha(opacity=0); -moz-opacity:0; opacity:0;}
		
		.talent_right .tal_list .tal_list_desc{  max-height:69px; overflow:hidden;}
	 	.tal_list_desc{ display:none;}
	 	.tal_num1 img,.tal_list_item img{ height:57px; width:57px;}
		.talent_right .tal_list a.tal_list_item.on { background: url(/uploads/image/hrimages/item_bg.png) no-repeat center center;}
		.copy{ position:relative;}
		.copy .alpha{ position:absolute; width:55px; height:30px; top:0; left:0;}
		
		
		span.icon_name{ display:inline-block; height:34px; width:28px; background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -160px -90px;}
		span.icon_name.diablo{  background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -195px -90px; }
		.hero_tab .hero_child a{height:34px; width:28px; background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -160px -90px;}
		.hero_tab .hero_child a.diablo{  background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -195px -90px; }
		span.icon_name.starcraft, .hero_child .starcraft{ background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -230px -90px; }
		.hero_tab .hero_child a.starcraft{ background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -230px -90px; }
		.hero_tab .hero_child a.btn2{height:32px; width:32px; background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -5px -92px;}
		.hero_tab .hero_child a.btn2.type2{ background-position:-40px -92px; }
		.hero_tab .hero_child a.btn2.type3{ background-position:-75px -92px; }
		.hero_tab .hero_child a.btn2.type4{ background-position:-110px -92px; }
		.hero_tab h2{ color:#fff; font-size:34px; position:absolute; top:30px; left:38px;font-weight:normal; font-family:"微软雅黑";}
		.hero_tab h4{ color:#ff77fd;font-size:12px; position:absolute; top:80px; left:40px; font-weight:normal; font-family:"宋体";}
		
		.hero_list_item .hero_heading span.hero_icon{display:inline-block; height:32px; width:32px; background:url(/uploads/image/hrimages/hs-fliter.png) no-repeat -5px -95px; padding-right:0; vertical-align:middle;}
		.hero_list_item .hero_heading span.hero_icon.type2{ background-position:-40px -95px; }
		.hero_list_item .hero_heading span.hero_icon.type3{ background-position:-75px -95px; }
		.hero_list_item .hero_heading span.hero_icon.type4{ background-position:-110px -95px; }
		
		
		.hero_list_type a.on {background: url(/uploads/image/hrimages/icon.png) no-repeat -49px -203px;}



/*********新增样式*******/
.hero_tab{ height: 100px;}
.hero_child{ height: 98px; position: relative;}
.hero_tab .hero_child .hero_img{ width: 93px; height: 93px; display: block; position: absolute; left:0; top:0; background: url(/uploads/image/hrimages/item_big.jpg) no-repeat; text-align: center;}
.hero_child .hero_img img{ width: 85px; height: 85px; padding-top:4px;}
.hero_tab h2{ left:103px; top:-9px;}
.hero_tab h4{top:40px; left: 103px;}
.hero_tab .hero_child a{ bottom: 4px;}
.hero_tab .hero_child a.btn1{left:101px;}
.hero_tab .hero_child a.btn2{ left:129px;}
.h_skill_box{ margin-bottom: 16px;}
.h_skill_list{ margin-bottom: 0}
.focus_btn .focus_box li{ position: relative;}
.focus_btn .focus_box li p{ position: absolute; z-index: 777; font-size: 12px; left:0; bottom: -25px; color: #fff; height: 16px; width: 75px; *width: 80px; overflow:hidden;
   white-space:nowrap;text-overflow:ellipsis;text-overflow: ellipsis;/* ie/safari */-ms-text-overflow: ellipsis;-o-text-overflow: ellipsis;/* opera */-moz-binding: ;/*firefox*/}
.focus_btn .focus_box{ height: 104px;}
.focus_btn{ bottom: 25px;}
.hero_row{ padding-bottom: 35px;}
.move_play{position: absolute;left: 50%;top:50%;background: #000;z-index: 7;width: 486px;height: 300px; margin-left:-243px; margin-top: -150px;}
.move_play .btnclose {width: 50px;height: 50px;display: inline-block;color: #fff;font-weight: bold;font-size: 30px;position: absolute;right: -50px;top: 0;text-align: center;background: url(/uploads/image/hrimages/btnclose.jpg) no-repeat;font-family: 'microsoft yahei';}

.movelast,.movenext{ background: url(/uploads/image/hrimages/newarrow_01.png) no-repeat -10px -0px; position:absolute;  top:2px; width: 8px;height: 30px;right:-7px;}
.movelast{background-position: 0 0px; left:-5px; }
.newbox{float:right; width:800px;}
.newbox a{ margin-bottom:10px;}
.backtolist{ font-family:"微软雅黑"; z-index:1;  right:1px; top:0px; position:absolute; display:inline-block; background:#491b64; height:30px; font-size:14px; color:#fff; padding:0 15px; border-radius:6px; border:#76349d solid 1px; line-height:30px;}
.backtolist:hover{ background:#682b8c;}


.heroes_skill_tip{ z-index:20}

.section01{background-color:#220e32;margin-bottom:15px;position:relative;}
.section01 dl{padding:13px 0 10px;}
.section01 dt,.section01 dd{float:left;margin-left:13px;display:inline;}
.section01 dt{width:24px;}
.section01 dd{float:left;text-align:center;color:#b3d4fc;width:74px;position:relative;}
.section01 a{text-align:center;color:#b3d4fc;}
.section01 dd img{width:70px;height:70px;border:2px solid #6d66ca;margin-bottom:5px;display:block;}
.section01 .hidemes{top:40px;left:-14px;position:absolute;display:none;}
.section01 dd.on{z-index:2;}
.section01 dd.on .hidemes{display:block;}

.free-box{
    width:929px;
    height:130px;
    font-family: "simsun";
    background: url(/uploads/image/hrimages/bg-hero.jpg) no-repeat;
}
.free-tit{
    width:35px;
    height:74px;
    float:left;
    font-family: "microsoft yahei";
    font-size:16px;
    color:#fff;
    margin-top:19px;
    margin-left:20px;
    padding-top:17px;
    padding-left:2px;
    margin-right: 7px;
}
.free-list{
    float:left;
}
.free-list li{
    display: block;
    float:left;
    width:74px;
    margin-top: 19px;
    margin-left: 11px;
}
.free-list li a{
    display: inline-block;
    width:74px;
    color:#3d6f95;
}
.free-list li a:hover{
    color:#48ccdc;
}
.free-list li a:hover dl{
    background: url(/uploads/image/hrimages/img-bg-hov.jpg) no-repeat;
}
.free-list li dl{
    display:block;
    width:68px;
    height:68px;
    position: relative;
    padding:3px;
    background: url(/uploads/image/hrimages/img-bg.jpg) no-repeat;
}
.free-list li span{
    width:74px;
    height:26px;
    display: block;
    text-align: center;
    line-height: 26px;
    font-size: 12px;
    margin-top: 2px;
}
.free-list li i{
    width: 19px;
    height:16px;
    font-style: normal;
    font-size: 12px;
    position: absolute;
    top:4px;
    right:5px;
    text-align: center;
    line-height: 16px;
    color:#b1f7ff;
    background: url(/uploads/image/hrimages/num-bg.png) no-repeat;
}
.free-list li img{
    width: 68px;
}
.spactive{
    color:#48ccdc;
    background:url(/uploads/image/hrimages/tit-bg.jpg) no-repeat;
}