/* CSS Reset */
html,body,iframe,div,span,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,p,a,strong,img,form,fieldset,legend,label{padding:0;margin:0;font-size:100%;vertical-align:baseline;border:0;outline:0;}
body{line-height:1;}
ul,ol{list-style:none;}
a{text-decoration:none;}
a:hover{text-decoration:underline;}
select,input,button{vertical-align:middle;}
table{border-spacing:0;border-collapse:collapse;}
html{zoom:expression(function(ele){ele.style.zoom="1";document.execCommand("BackgroundImageCache",false,true);}(this));}
*html,*html body{background-image:url(about:blank);background-attachment:fixed;}

/* Blank */
.bk1,.bk2,.bk3,.bk4,.bk5,.bk6,.bk7,.bk8,.bk9,.bk10,.bk11,.bk12,.bk13,.bk14,.bk15,.bk16,.bk17,.bk18,.bk19,.bk20{font:1px/1px Arial;clear:both;overflow:hidden;}
.bk1{height:1px;}.bk2{height:2px;}.bk3{height:3px;}.bk4{height:4px;}.bk5{height:5px;}.bk6{height:6px;}.bk7{height:7px;}.bk8{height:8px;}.bk9{height:9px;}.bk10{height:10px;}.bk11{height:11px;}.bk12{height:12px;}.bk13{height:13px;}.bk14{height:14px;}.bk15{height:15px;}.bk16{height:16px;}.bk17{height:17px;}.bk18{height:18px;}.bk19{height:19px;}.bk20{height:20px;}

.clearFix:after{display:block;clear:both;content:'';}
.clearFix{zoom:1;}
.fl{display:inline-block;float:left;}
.fr{display:inline-block;float:right;}

/* Header */
#header_area{width:auto;height:auto;}
#header_area .top_box{position:fixed;top:0;left:0;z-index:10;width:100%;height:32px;background:#F9F9F9;border-bottom:1px solid #DBDBDB;_position:absolute;_top:expression(eval(document.documentElement.scrollTop));}
#header_area .top_box .top{position:relative;z-index:0;width:1000px;height:32px;margin:0 auto;}
#header_area .top_box .top a.index{float:left;margin:4px 12px 0 0;font:12px/2 Simsun;color:#666;}
#header_area .top_box .top a.index:hover{color:#F60;}
#header_area .top_box .top a.client{float:left;margin:4px 12px 0 0;font:12px/2 Simsun;color:#666;}
#header_area .top_box .top a.client:hover{color:#F60;}
#header_area .top_box .top span.d{float:right;padding:6px 0 0;font:12px/20px Simsun;color:#999;}
#header_area .top_box .top a.add_favorite{float:right;width:30px;height:20px;padding:0 0 0 17px;margin:6px 0 0 8px;font:12px/20px Simsun;text-align:center;color:#666;background:url(https://www.doyo.cn/Tpl/web/Public/images/favorite_bg.png) 0 3px no-repeat;text-decoration:none;}
#header_area .top_box .top a.add_favorite:hover{color:#F60;background:url(https://www.doyo.cn/Tpl/web/Public/images/favorite_bg.png) 0 -47px no-repeat;}
#header_area .top_box .top .login{float:right;width:600px;height:20px;padding:6px 0 0;font:12px/20px Simsun;text-align:right;color:#999;}
#header_area .top_box .top .login a{display:inline-block;margin:0 8px;color:#666;}
#header_area .top_box .top .login a:hover{color:#F60;}
#header_area .top .login a.name{margin:0 10px 0 0;font-family:Verdana;color:#2791D0;}
#header_area .top .login a.name:hover{color:#F60;}
#header_area .top_box .top .top_nav{position:absolute;top:1px;left:132px;z-index:1;width:63px;height:29px;}
#header_area .top_box .top .top_nav .nav_box{display:none;position:absolute;top:28px;left:0;z-index:2;width:130px;height:auto;background:#FFF;border:1px solid #CCC;overflow:hidden;}
#header_area .top_box .top .top_nav .nav_box div{float:left;width:50px;padding:6px 0 3px 10px;}
#header_area .top_box .top .top_nav .nav_box a{font:12px/2 Simsun;color:#333;}
#header_area .top_box .top .top_nav .nav_box a:hover{color:#F60;}
#header_area .top_box .top .top_nav .t{position:absolute;top:1px;left:1px;z-index:1;z-index:3;width:36px;height:28px;padding:0 0 0 25px;font:12px/28px Simsun;color:#333;background:url(https://www.doyo.cn/Tpl/web/Public/images/topbar_ico.png) no-repeat 7px 8px;cursor:default;}
#header_area .top_box .top .care_doyo{position:absolute;top:1px;left:195px;z-index:1;width:96px;height:29px;}
#header_area .top_box .top .care_doyo .care_box{display:none;position:absolute;top:28px;left:0;z-index:2;width:250px;height:140px;padding:5px 0 0;background:#FFF;border:1px solid #CCC;}
#header_area .top_box .top .care_doyo .care_box .wechat{float:left;width:120px;height:140px;font:12px/2 Simsun;text-align:center;color:#666;}
#header_area .top_box .top .care_doyo .care_box .wechat img{display:block;width:110px;height:110px;margin:0 auto;}
#header_area .top_box .top .care_doyo .care_box .weibo{float:right;width:120px;height:140px;}
#header_area .top_box .top .care_doyo .care_box .weibo img{display:block;width:110px;height:110px;margin:0 auto;}
#header_area .top_box .top .care_doyo .care_box .weibo .weibo_link{display:inline-block;width:62px;height:22px;margin:0 0 0 30px;background:url(https://www.doyo.cn/Tpl/web/Public/images/topbar_ico.png) 0 -100px no-repeat;}
#header_area .top_box .top .care_doyo .t{position:absolute;top:1px;left:1px;z-index:1;z-index:3;width:81px;height:28px;padding:0 0 0 13px;font:12px/28px Simsun;color:#666;background:url(https://www.doyo.cn/Tpl/web/Public/images/topbar_ico.png) no-repeat 74px -38px;cursor:default;}
#header_area .top_box .top .top_nav div.active,#header_area .top_box .top .care_doyo div.active{top:0;left:0;background-color:#FFF;border:1px solid #CCC;border-bottom:none;}
#header_area .middle_box{width:auto;height:100px;background:url(https://s.doyo.cn/material/images/web/page_2014/header_big_bg.png) center 0 repeat-x;}
#header_area .middle{width:980px;height:100px;margin:0 auto;}
#header_area .middle .logo{float:left;width:280px;height:100px;}
#header_area .middle .logo h2{display:none;}
#header_area .middle .logo .main_logo{display:block;width:130px;height:59px;margin:17px 0 0 14px;background:url(https://s.doyo.cn/material/images/web/logo_png24_bg.png) 0 0 no-repeat;}
#header_area .middle .search{float:left;width:430px;height:83px;padding:17px 0 0 0;}
#header_area .middle .search .bar{position:relative;z-index:3;width:426px;height:42px;padding:4px 0 4px 4px;background:#ECE8E6;}
#header_area .middle .search .bar .key{float:left;width:333px;height:40px;padding:0 0 0 12px;font:14px/2.8 SimSun;color:#333;background:#FFF;border:solid #DCD8D4;border-width:1px 0 1px 1px;}
#header_area .middle .search .bar .button{float:left;width:75px;height:42px;padding:0;background:url(../images/page_2014/header_bg.png) 25px 8px no-repeat #867E79;border:1px solid #7B736F;cursor:pointer;}
#header_area .middle .search .bar .button_hover{background:url(../images/page_2014/header_bg.png) 25px -42px no-repeat #6F665F;border:1px solid #6F665F;}
#header_area .middle .search .bar .auto_box{display:none;position:absolute;top:45px;left:4px;z-index:1;width:344px;height:auto;background:#FFF;border:solid #D9D9D9;border-width:0 1px 1px 1px;overflow:hidden;}
#header_area .middle .search .bar .auto_box a{display:block;width:324px;height:48px;padding:10px;font:12px/2 SimSun;color:#333;border-top:1px solid #D9D9D9;overflow:hidden;text-decoration:none;}
#header_area .middle .search .bar .auto_box a:hover{color:#F60;}
#header_area .middle .search .bar .auto_box a.hover{background:#F6F6F6;}
#header_area .middle .search .bar .auto_box a.active{background:#EEE;}
#header_area .middle .search .bar .auto_box a img{float:left;width:48px;height:48px;margin:0 10px 0 0;}
#header_area .middle .search .bar .auto_box a span{display:inline-block;margin:4px 0 0 0;color:#AAA;}
#header_area .middle .search .word{width:422px;height:24px;padding:2px 8px 0 8px;font:12px/2 SimSun;color:#999;overflow:hidden;}
#header_area .middle .search .word a{display:inline-block;margin:0 8px 0 0;color:#999;}
#header_area .middle .search .word a:hover{color:#F60;}
#header_area .middle .link{position:relative;z-index:0;float:right;width:150px;height:50px;padding:26px 0 0 0;text-align:right;}
#header_area .middle .link a{display:inline-block;padding:7px 10px;margin:0 7px 0 0;font:12px/1.5 SimSun;color:#FFF;background:#F90;}
#header_area .middle .link a:hover{background:#F60;}
#header_area .bottom_box{width:auto;height:43px;background:#0091FF;}
#header_area .bottom{width:980px;height:43px;margin:0 auto;}
#header_area .bottom .nav{float:left;width:810px;height:43px;}
#header_area .bottom .nav a{display:inline-block;height:36px;padding:4px 16px 3px 16px;font:18px/2 'Microsoft YaHei',SimSun;color:#FFF;vertical-align:middle;}
#header_area .bottom .nav a:hover{color:#FF0;text-decoration:none;}
#header_area .bottom .nav a.active{background:#035CC1;}
#header_area .bottom .nav a.active:hover{color:#FF0;}
#header_area .bottom .nav a.index{padding:4px 25px 3px 25px;}
#header_area .bottom .nav a.chinajoy{background:url(../images/new_item.gif) 123px 5px no-repeat;}
#header_area .bottom .nav span{display:inline-block;width:2px;height:43px;vertical-align:middle;background:url(../images/page_2014/header_bg.png) -98px 4px no-repeat;}
#header_area .bottom .other{float:right;width:166px;height:26px;padding:11px 0 0 0;text-align:right;}
#header_area .bottom .other a{display:inline-block;height:24px;padding:1px 10px;margin:0 7px 0 0;font:12px/2 SimSun;color:#003066;background:#D0ECFF;}
#header_area .bottom .other a:hover{color:#F60;}

/* wrapper */
#wrapper{width:1012px;height:auto;margin:0 auto;background:#FFF;}

/* rank_nav */
#rank_nav{width:auto;height:33px;padding:17px 0 0 0;font:12px/14px Simsun;color:#959595;}
#rank_nav a{float:left;color:#666;}
#rank_nav a:hover{color:#F90;text-decoration:none;}
#rank_nav span{float:left;width:5px;height:15px;margin:1px 6px 0 8px;background:url(../images/rank/sprit.png) 0 2px no-repeat;}

/* main rank_menu */
#main .rank_menu{float:left;width:140px;height:auto;padding:0 9px 10px 9px;border:1px solid #DBDBDB;}
#main .rank_menu h2{position:relative;z-index:0;width:auto;height:17px;padding:17px 0 15px 5px;border-bottom:1px dashed #D0D0D0;}
#main .rank_menu h2 a{display:block;width:100%;height:22px;font:bold 16px/20px 'Microsoft Yahei';color:#333;overflow:hidden;}
#main .rank_menu h2 a:hover{color:#F90;text-decoration:none;}
#main .rank_menu h2.active{color:#F90;}
#main .rank_menu h2.active em{background:url(../images/rank/sprit.png) -50px 0 no-repeat;}
#main .rank_menu em{position:absolute;top:10px;left:-9px;width:6px;height:31px;}
#main .rank_menu .game_type{width:auto;height:auto;padding:3px 0 0 0;}
#main .rank_menu .game_type a{display:inline;float:left;width:65px;height:30px;padding:0 0 0 5px;margin:4px 0 0 0;font:14px/30px 'Microsoft Yahei';color:#909090;background:#FFF;overflow:hidden;}
#main .rank_menu .game_type a:hover{color:#F90;}
#main .rank_menu .game_type .active{color:#F90;}

/* main rank_content */
#main .rank_content{float:left;width:820px;height:auto;margin:0 0 0 32px;}

#index h1{width:auto;padding:0 0 14px 0;font:26px/36px 'Microsoft Yahei';color:#333;border-bottom:1px solid #CCC;}
#index .rank_area{width:820px;height:auto;overflow:hidden;}
#index .rank_box{width:860px;height:auto;}
#index .rank_list{float:left;width:389px;height:auto;margin:15px 40px 0 0;overflow:hidden;}
#index .rank_list .title{position:relative;z-index:0;width:auto;height:28px;}
#index .rank_list .title h2{float:left;width:160px;height:28px;font:18px/28px 'Microsoft Yahei';overflow:hidden;}
#index .rank_list .title h2 em{float:left;width:40px;height:28px;background:url(../images/rank/sprit.png) -10px 0 no-repeat;}
#index .rank_list .title h2 .danji_icon{background:url(../images/rank/sprit.png) 0 -94px no-repeat;}
#index .rank_list .title h2 .wangluo_icon{background:url(../images/rank/sprit.png) -50px -97px no-repeat;}
#index .rank_list .title h2 .shouji_icon{background:url(../images/rank/sprit.png) -100px -100px no-repeat;}
#index .rank_list .title h2 .wangye_icon{background:url(../images/rank/sprit.png) -150px -94px no-repeat;}
#index .rank_list .title h2 .flash_icon{background:url(../images/rank/sprit.png) -200px -97px no-repeat;}
#index .rank_list .title h2 a{color:#404040;}
#index .rank_list .title h2 a:hover{color:#F90;}
#index .rank_list .title .label{float:right;width:100px;height:16px;margin:8px 0 0 0;font-size:12px;overflow:hidden;}
#index .rank_list .title .label span{padding:0 5px;font:12px/13px 'Microsoft Yahei';text-align:center;cursor:default;}
#index .rank_list .title .label span.active{color:#F90;}
#index .rank_list ul{display:none;width:388px;height:auto;margin:17px 0 0 0;border-right:1px solid #CCC;}
#index .rank_list ul.active{display:block;}
#index .rank_list ul li{width:388px;height:35px;}
#index .rank_list ul em{float:left;width:14px;height:auto;margin:0 14px 0 7px;font:normal 12px/35px 'Microsoft Yahei';text-align:center;color:#A9A8A8;}
#index .rank_list ul div{float:left;width:316px;height:34px;padding:0 0 0 10px;margin:0 7px 0 0;border-bottom:1px dashed #CCC;overflow:hidden;}
#index .rank_list ul a{float:left;width:250px;height:35px;font:12px/34px 'Microsoft Yahei';color:#333;overflow:hidden;}
#index .rank_list ul a:hover{color:#F90;}
#index .rank_list ul i{float:right;width:60px;height:35px;font:normal 12px/34px 'Microsoft Yahei';text-align:right;color:#999;}
#index .rank_list ul span{display:none;float:left;width:10px;height:35px;background:url(../images/rank/sprit.png) -20px 20px no-repeat;}
#index .rank_list ul .more{height:26px;}
#index .rank_list ul .more a{float:right;width:auto;height:auto;margin:0 26px 0 0;}
#index .rank_list ul .up_icon{background:url(../images/rank/sprit.png) -100px 10px  no-repeat;}
#index .rank_list ul .middle_icon{background:url(../images/rank/sprit.png) -150px 10px no-repeat;}
#index .rank_list ul .down_icon{background:url(../images/rank/sprit.png) -200px 18px no-repeat;}

#public .header{position:relative;z-index:0;width:auto;height:auto;}
#public .header h1{width:auto;font:20px/36px 'Microsoft Yahei';color:#333;}
#public .header h1 em{float:left;width:40px;height:36px;background:url(../images/rank/sprit.png) -10px 0 no-repeat;}
#public .header h1 .danji_icon{float:left;width:40px;height:36px;background:url(../images/rank/sprit.png) 0 -89px no-repeat;}
#public .header h1 .wangluo_icon{float:left;width:40px;height:36px;background:url(../images/rank/sprit.png) -50px -92px no-repeat;}
#public .header h1 .shouji_icon{float:left;width:40px;height:36px;background:url(../images/rank/sprit.png) -100px -95px no-repeat;}
#public .header h1 .wangye_icon{float:left;width:40px;height:36px;background:url(../images/rank/sprit.png) -150px -90px no-repeat;}
#public .header h1 .flash_icon{float:left;width:40px;height:36px;background:url(../images/rank/sprit.png) -200px -93px no-repeat;}
#public .header span{position:absolute;top:0;left:0;z-index:0;width:5px;height:5px;background:url(../images/rank/sprit.png) -50px -50px no-repeat;}
#public .header b{float:left;margin:0 0 0 20px;font:16px/36px 'Microsoft Yahei';color:#333;}
#public .rank_list{margin:16px 0 0 0;background:url(../images/rank/border_dashed_bg.png) repeat-x;border-bottom:1px solid #CCC;}
#public .rank_list li{width:auto;height:100px;margin-top:-1px;font:normal 12px/13px 'Microsoft Yahei';vertical-align:top;border-top:1px dashed #CCC;border-bottom:1px solid #FFF;}
#public .rank_list li:hover{background:#F5FDFF;border:solid #CCC;border-width:1px 0 1px 0;}
#public .rank_list li.active{background:#F5FDFF;border:solid #CCC;border-width:1px 0 1px 0;}
#public .rank_list li.active .grade{display:none;}
#public .rank_list li.active .down{display:block;}
#public .rank_list li:hover .grade{display:none;}
#public .rank_list li:hover .down{display:block;}
#public .rank_list em{float:left;width:14px;height:10px;margin:44px 21px 0 8px;font:normal 12px/14px 'Microsoft Yahei';text-align:center;color:#A7A7A7;}
#public .rank_list .pic{float:left;width:58px;height:80px;margin:10px 0 0 0;}
#public .rank_list .pic img{display:block;width:100%;height:100%;}
#public .rank_list .name{float:left;width:238px;height:56px;margin:41px 0 0 31px;font:12px/18px 'Microsoft Yahei';color:#1997EE;white-space:nowrap;overflow:hidden;overflow:hidden;text-overflow:ellipsis;}
#public .rank_list .name:hover{color:#F90;}
#public .rank_list .type{float:left;width:122px;height:52px;margin:44px 0 0 20px;color:#868686;overflow:hidden;}
#public .rank_list .type:hover{color:#F90;}
#public .rank_list .size{float:left;width:85px;height:auto;margin:44px 0 0 0;font:normal 12px/13px 'Microsoft Yahei';color:#ADADAD;overflow:hidden;_margin:40px 0 0 0;}
#public .rank_list .popularity{float:left;width:120px;height:52px;margin:44px 0 0 0;color:#ADADAD;overflow:hidden;}
#public .rank_list .grade{float:left;width:100px;height:24px;margin:44px 0 0 0;overflow:hidden;}
#public .rank_list .grade div{float:left;width:60px;height:24px;margin:-6px 0 0 0;background:url(../images/rank/star_bg.png) 0 7px no-repeat;}
#public .rank_list .grade i{display:block;height:24px;background:url(../images/rank/star_bg.png) 0 -43px no-repeat;}
#public .rank_list .grade span{margin:0 0 0 7px;color:#BBB;}
#public .rank_list .down{display:none;float:left;width:82px;height:26px;margin:35px 0 0 0;font:12px/26px 'Microsoft Yahei';text-align:center;color:#FF6F00;background:#FFF;border:1px solid #CCC;overflow:hidden;}
#public .rank_list .down:hover{color:#FFF;background:#FF9C00;}

#public.shouji .rank_list .pic img{display:block;width:72px;height:72px;}
#public.shouji .rank_list .name{margin:41px 0 0 51px;}
#public.shouji .rank_list .type{width:112px;}
#public.shouji .rank_list .popularity{width:110px;}
#public.flash  .rank_list .pic img{display:block;width:72px;height:72px;}
#public.flash  .rank_list .name{margin:41px 0 0 51px;}
#public.flash  .rank_list .type{width:112px;}
#public.flash  .rank_list .popularity{width:110px;}

/* change_page */
.change_page{width:200px;height:auto;margin:20px auto;}
.change_page a{float:left;width:24px;height:24px;margin:0 4px 0 0;font:normal 12px/24px 'Microsoft Yahei';text-align:center;color:#4E4E4E;background:#DDD;}
.change_page a:hover{color:#FFF;background:#FF0018;text-decoration:none;}
.change_page .active{color:#FFF;background:#FF0018;}
.change_page .next{width:54px;}
.change_page .next:hover{background:#F90;}

/* footer_area */
#footer_area{width:auto;height:auto;padding:15px 0;border-top:2px solid #F9F9F9;}
#footer{width:980px;height:auto;margin:0 auto;font:12px/2 Arial;text-align:center;color:#999;}
#footer a{color:#666;}
#footer a:hover{color:#F90;}
#footer a.s{color:#666;}
#footer a.s:hover{color:#F90;}
