@charset "utf-8";

/*--index style--*/
/*大图*/
#Focus { max-width:100%; height:470px; overflow:hidden; margin:0 auto 60px;}/* 根据模板的宽度及需要，修改width与height的值 */
#Focus .big{ position:relative;}
#Focus .big li { width:100%; height:470px; position:absolute; top:0; left:0;margin:0; padding:0; opacity:0;}/* width与height的值与#Focus保持一致 */
#Focus .textcont{position:absolute;width:800px; height:60px; padding:0 20px;  z-index:2; left:50%; margin-left:-250px;}
#Focus .textcont h2{ font-size:30px; font-family:Tahoma, Geneva, sans-serif; line-height:30px; margin:250px 0 10px 0px; text-shadow:-3px -4px 6px #111; }
#Focus .textcont p{ margin:10px 0 10px 0px; width:400px; }
#Focus .textcont a.btn{background:#cc2525; margin:0px; box-shadow:0px 4px 0px #9e1c1c; border-radius:6px; font-size:30px; font-weight:bold; display:block; width:280px; line-height:60px; text-align:center;  height:60px}
#Focus .textcont a.btn:active {   box-shadow:inset 0px -1px 0px #9e1c1c;  top:4px;}
#Focus .small{width:1160px; height:60px; padding:0 20px;  text-align:right; margin:0 auto;  position:absolute ;  z-index:1; left:50%; margin-left:-600px; top:500px;}
#Focus .small1,#Focus .small2,#Focus .small3,#Focus .small4{background:url(../images/banner_small.png) no-repeat; width:51px; height:60px;display:inline-block; _display:inline; _zoom:1; margin-left:5px; cursor:pointer; }
#Focus .small1{ background-position: 0 0px; }
#Focus .small2{ background-position: -56px 0px; }
#Focus .small3{ background-position: -112px 0px; }
#Focus .small4{ background-position: -168px 0px; }
#Focus .small1.on{ background-position: 0 -63px; }
#Focus .small2.on{ background-position: -56px -63px; }
#Focus .small3.on{ background-position: -112px -63px; }
#Focus .small4.on{ background-position: -168px -63px; }


.focus_reg .fb_icon, .focus_reg .rc_icon, .focus_reg .gg_icon, .focus_reg .tw_icon, .focus_reg .icon_fb, .focus_reg .icon_tw, .focus_reg .icon_gg, .focus_reg .icon_sc {background: url(../../images/icon1.png) no-repeat;width: 25px;height: 27px;display: inline-block;vertical-align: middle;}
.focus_reg .fb_icon{ margin-right:5px;}
.focus_reg .tw_icon{ background-position:-87px 0;}
.focus_reg .rc_icon{ background-position:-30px 0;}
.focus_reg .gg_icon{ background-position:-60px 0;}
.focus_reg a.facebook_btn {
    background: linear-gradient(top , rgb(62, 102, 171) , rgb(44, 77, 150) 100%);
    background: -o-linear-gradient(top , rgb(62, 102, 171) , rgb(44, 77, 150) 100%);
    background: -ms-linear-gradient(top , rgb(62, 102, 171) , rgb(44, 77, 150) 100%);
    background: -moz-linear-gradient(top , rgb(62, 102, 171) , rgb(44, 77, 150) 100%);
    background: -webkit-linear-gradient(top , rgb(62, 102, 171) , rgb(44, 77, 150) 100%);
    box-shadow: 0px 4px 0px #254188;
    width: 120px;
    height: 29px;
    border-radius: 4px;
    display: inline-block;
    font-size: 14px;
    padding-top: 7px;
    text-indent: 4px;
    margin: 5px 0 5px;
    position: relative;
    text-align: left;
    text-decoration: none;
    outline: none;
    color: #fff;
}

.focus_reg a.google_btn {
background: linear-gradient(left , rgb(249, 122, 105) , rgb(210, 81, 65) 100%);
background: -o-linear-gradient(left , rgb(249, 122, 105) , rgb(210, 81, 65) 100%);
background: -ms-linear-gradient(left , rgb(249, 122, 105) , rgb(210, 81, 65) 100%);
background: -moz-linear-gradient(left , rgb(249, 122, 105) , rgb(210, 81, 65) 100%);
background: -webkit-linear-gradient(left , rgb(249, 122, 105) , rgb(210, 81, 65) 100%);
box-shadow: 0px 4px 0px #b12117;
}

.focus_reg a.twitter_btn {
background: linear-gradient(left , rgb(91, 192, 251) , rgb(48, 155, 232) 100%);
background: -o-linear-gradient(left , rgb(91, 192, 251) , rgb(48, 155, 232) 100%);
background: -ms-linear-gradient(left , rgb(91, 192, 251) , rgb(48, 155, 232) 100%);
background: -moz-linear-gradient(left , rgb(91, 192, 251) , rgb(48, 155, 232) 100%);
background: -webkit-linear-gradient(left , rgb(91, 192, 251) , rgb(48, 155, 232) 100%);
box-shadow: 0px 4px 0px #1b77d9;
}

.focus_reg a.raidcall_btn {
background: linear-gradient(top , rgb(30, 168, 232) , rgb(10, 125, 178) 100%);
background: -o-linear-gradient(top , rgb(30, 168, 232) , rgb(10, 125, 178) 100%);
background: -ms-linear-gradient(top , rgb(30, 168, 232) , rgb(10, 125, 178) 100%);
background: -moz-linear-gradient(top , rgb(30, 168, 232) , rgb(10, 125, 178) 100%);
background: -webkit-linear-gradient(top , rgb(30, 168, 232) , rgb(10, 125, 178) 100%);
box-shadow: 0px 4px 0px #076ea4;
}

.focus_reg a.raidcall_btn, a.twitter_btn, a.google_btn {
width: 40px;
display: inline-block;
height: 30px;
border-radius: 4px;
padding-top: 6px;
text-align: center;
position: relative;
margin-left: 5px;
text-decoration: none;
outline: none;
color: #fff;
}

#Focus .focus_mid{ margin:0 auto; width:1200px; position:relative;}
#Focus .focus_reg{ border-radius:10px;background: url(../../images/index/ap60.png);width:260px; height:270px; z-index:10; position:absolute; top:85px; padding:15px; text-align:center;} 
.online{ font-family:Arial, Helvetica, sans-serif; font-size:23px; color:#FFF; text-align:left; margin:10px 0 15px;}
.online_num{ margin-bottom:5px; background:url(../../images/index/online_num.png) no-repeat top left;  height:60px; font-family:Arial, Helvetica, sans-serif; font-size:58px; color:#42bfec; line-height:58px;letter-spacing:18px; text-align:left; display:block; text-indent:8px; margin-left:5px}
#Focus .focus_reg .or{ height:20px; line-height:20px; margin:8px 0;}
#Focus .focus_reg .or span,#Focus .or b{ display:inline-block; vertical-align: middle; ;}
#Focus .focus_reg .or span{ width:40px; text-align:center; }
#Focus .focus_reg .or b{ width:42%; border-bottom:1px solid #d6d4d0}
#Focus .focus_reg input[type="button"]{ width:248px;  height:35px; border-radius:3px; font-size:18px; margin:10px 0 15px; color:#fff; position:relative; }
#Focus .focus_reg input[type="button"]{background:#dd0707;   box-shadow:0px 4px 0px #a70000; }
#Focus .focus_reg input[type="button"]:active {   box-shadow:inset 0px -1px 0px #a70000;  top:4px;}

#Focus .focus_after{ border-radius:10px;background: url(../../images/index/ap60.png);width:290px; height:285px; z-index:10; position:absolute; top:85px; padding-top:15px; text-align:center;} 
#Focus .focus_after h3{ color:#000000; line-height:40px; height:40px;  }
#Focus .focus_after p{ line-height:140%;}
#Focus .focus_after li.fl{ border-right:1px solid #bac2b7;}
#Focus .focus_after li{ width:142px; color:#000; height:80px;} 
#Focus .focus_after .mb10{ margin-bottom:10px;}
#Focus .focus_after a{ color:#118daa; text-transform:uppercase; margin-left:5px;}
#Focus .focus_after_out{background: url(../../images/index/ap60.png); height:100px;display:block; padding-top:10px;}
#Focus .focus_after_link a{ margin:0 10px; line-height:32px;}
.lv0,.lv1,.lv2,.lv3,.lv4,.lv5,.lv6,.lv7,.lv8,.lv9{ background:url(../images/lv_icon.png) no-repeat; display:inline-block; width:42px; height:20px; vertical-align: sub ;}
.lv1{ background-position:0 -22px}
.lv2{ background-position:0 -44px}
.lv3{ background-position:0 -66px}
.lv4{ background-position:0 -88px}
.lv5{ background-position:0 -110px}
.lv6{ background-position:0 -132px}
.lv7{ background-position:0 -154px}
.lv8{ background-position:0 -176px}
.lv9{ background-position:0 -198px}
.nav_mid{ position:absolute; top:576px; height:58px; width:100%;
border-top:2px solid #58daf8;
background: #002b34;
background: -moz-linear-gradient(top,  #002b34 0%, #08404a 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#002b34), color-stop(100%,#08404a));
background: -webkit-linear-gradient(top,  #002b34 0%,#08404a 100%);
background: -o-linear-gradient(top,  #002b34 0%,#08404a 100%);
background: -ms-linear-gradient(top,  #002b34 0%,#08404a 100%);
background: linear-gradient(to bottom,  #002b34 0%,#08404a 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002b34', endColorstr='#08404a',GradientType=0 );
    }
.nav_mid li{ float:left; width:25%; font-size:14px; font-family:Arial, Helvetica, sans-serif; line-height:58px; text-transform:uppercase; text-align:center; }
.nav_mid_iocn1,.nav_mid_iocn2,.nav_mid_iocn3,.nav_mid_iocn4{ background:url(../../images/nav_midicon.png) no-repeat; display:inline-block; width:46px; height:46px; vertical-align:middle;}
.nav_mid_iocn2{ background-position:-48px 0;}
.nav_mid_iocn3{ background-position:-96px 0;}
.nav_mid_iocn4{ background-position:-152px 0;}
.nav_mid li a{ display:block; width:100%; height:56px; margin-top:-2px; padding-top:4px;}
.nav_mid li a:hover{ background:url(../../images/nav_mid_hover.png) bottom center no-repeat;;}
.nav_mid li a.ative{ background:url(../../images/nav_mid_ative.png) no-repeat top center;   }

.index_rc{ background:url(../../images/index_rc.jpg) no-repeat top center; background-size: cover; height:600px;font-family:Arial, Helvetica, sans-serif; font-size:16px; line-height:180%; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./resources/webgame/images/index_rc.jpg',sizingMethod='scale');}
.index_rc .pw{ padding-top:43px;}
.index_rc h3{ font-size:30px; margin-left:84px; text-transform:uppercase; margin-bottom:230px;}
.index_rc p{ margin-left:60px;}
.index_rc .rc_btn{ width:280px;  height:55px; border-radius:5px; font-size:24px; padding:5px 10px; margin:15px 0; color:#fff; position:relative;background:#64af18;   box-shadow:0px 4px 0px #469410; display:block; text-align:center; line-height:55px; text-shadow:1px 2px 1px #5b9f16; }
.index_rc .rc_btn:active {   box-shadow:inset 0px -1px 0px #469410;  top:4px;}
.index_rc .rc_btc_icon{ background:url(../../images/rc_btn.png) no-repeat; display:inline-block; width:45px; height:35px; vertical-align:middle; margin-right:5px;}

.index_site{ background:url(../../images/site_bg.gif) repeat; height:552px; text-align:center; padding-top:50px}
.index_site h3{ font-family:Tahoma, Geneva, sans-serif; font-size:48px; font-weight:normal; margin-bottom:60px;}
.index_site p{ font-family:Arial, Helvetica, sans-serif; line-height:180%; font-size:16px;}
.index_site .site_step{ background: url(../../images/gb_site.png) no-repeat top center; height:240px; position:relative; font-family:Arial, Helvetica, sans-serif; line-height:180%; font-size:16px;}
.index_site .site_step li{ position:absolute; top:170px;  width:300px;}
.index_site .site_step1{ left:135px;}
.index_site .site_step2{left:530px;}
.index_site .site_step3{left:850px;}
.index_site .site_text{ width:980px; text-align:left; margin:0 auto 35px;;}
.index_site .site_btn{ width:230px;  height:55px; border-radius:5px; font-size:24px; padding:5px 10px; margin:15px  auto; color:#fff; position:relative;background:#f79305;   box-shadow:0px 4px 0px #f56f03; display:block; text-align:center; line-height:55px; text-shadow:1px 2px 1px #e18504; }
.index_site .site_btn:active {   box-shadow:inset 0px -1px 0px #f56f03;  top:4px;}

.all_game{ background: url(../../images/game_bg.jpg) top center no-repeat;background-size: cover; height:491px;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./resources/webgame/images/game_bg.jpg',sizingMethod='scale');}
.all_game .pw{}
.all_game .fl{ padding:25px 0 0 28px;}
.all_game .title{ height:50px;  line-height:50px;  background:url(../../images/title_bg.png) no-repeat 7px top; text-indent:62px; font-size:30px; font-family: Arial, Helvetica, sans-serif;}
.all_game .title2{background:url(../../images/title_bg.png) no-repeat 0 -60px; width:165px; height:30px;  line-height:32px;  font-size:18px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; position:absolute; top:35px; left:0px; text-indent:14px; z-index:2;}
.all_game .games{ position:relative; width:430px; padding:60px 0 28px 28px; height:270px;}
.all_game .game_list { opacity:0; visibility:hidden; position:absolute}
.all_game .game_list li{ background:url(../../images/game_list.png) no-repeat; width:90px; height:105px; float:left; margin:-15px 10px 0 0; cursor:pointer; line-height:400px; overflow:hidden;}
.all_game .game_list li:hover{}
.all_game .gam_sort a{ display:inline-block; padding:5px 10px; background:#1ec3e9; margin:5px; border-radius:3px; font-size:14px;}
.all_game .gam_sort a:hover{background:#72e5ff;-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out; }
.all_game .gam_sort a.ative{ background:#fff; color:#1c7a9c}
.all_game .game_info{ position:relative; width:601px; height:491px;}
.all_game .game_cont{ position:absolute; top:-10px; left:0px; visibility:hidden; opacity:0; width:600px; height:170px; padding:330px 0px 0 0px}
.all_game .game_cont h3{ font-size:20px; line-height:30px; height: 33px;}
.all_game .game_cont p{ height:73px; overflow:hidden; margin-bottom:10px;}
.all_game .game_cont a.btn{background:#20c3e6; margin:0px;position: relative;   box-shadow:0px 4px 0px #1badc6; border-radius:6px; font-size:20px;  display:block; width:180px; line-height:38px; text-align:center;  height:38px}
.all_game .game_cont a.btn:active {   box-shadow:inset 0px -1px 0px #1badc6;  top:4px;}
.all_game .game_info img{ position:absolute; top: 0;left:0;}
.all_game .game_list .item1{ background-position:0 0;margin-left:50px;}
.all_game .game_list .item2{ background-position:-100px 0;}
.all_game .game_list .item3{ background-position:-200px 0;}
.all_game .game_list .item4{ background-position:-300px 0;}
.all_game .game_list .item5{ background-position:-400px 0;}
.all_game .game_list .item6{ background-position:-500px 0;}
.all_game .game_list .item7{ background-position:-600px 0;}
.all_game .game_list .item8{ background-position:-700px 0;}
.all_game .game_list .item9{ background-position:-800px 0;}
.all_game .game_list .item10{ background-position:-900px 0;}
.all_game .game_list .item1.hover{ background-position:0 -110px;}
.all_game .game_list .item2.hover{ background-position:-100px -110px;}
.all_game .game_list .item3.hover{ background-position:-200px -110px;}
.all_game .game_list .item4.hover{ background-position:-300px -110px;}
.all_game .game_list .item5.hover{ background-position:-400px -110px;}
.all_game .game_list .item6.hover{ background-position:-500px -110px;}
.all_game .game_list .item7.hover{ background-position:-600px -110px;}
.all_game .game_list .item8.hover{ background-position:-700px -110px;}
.all_game .game_list .item9.hover{ background-position:-800px -110px;}
.all_game .game_list .item10.hover{ background-position:-900px -110px;}

.buzz{ border-top: 6px solid #1ec3e9; height:500px;}
.buzz_title{}
.buzz_title li{ float:left;font-size:30px; color:#fff;  padding:22px 45px; font-weight:bold; cursor: pointer;}
.buzz_title li.ative{ background:#1ec3e9; border-radius:0 0 3px 3px; color:#000f14;}
.buzz .pw{ position:relative;}
.news_list{ zoom:1; padding:15px 5px; overflow:hidden; position:absolute;visibility:hidden;opacity:0;  }
.news_list li{ float:left; width:555px;zoom:1; margin:28px 20px; color:#255964; font-family:Tahoma;}
.news_list li img{float:left; margin-right:28px; border-radius:3px;height:140px;}
.news_list li h4{ font-size:18px; color:#fff; margin-bottom:8px;}
.news_list li h4 a{color:#fff;}
.news_list .line{ background:#001418; height:1px; line-height:1px; display:block; clear:both;}
.news_list .read_more{ background: url(../../images/title_bg.png) no-repeat -174px -66px; margin-top:10px; display: inline-block; width:98px; text-indent:10px;}
.sitelink{zoom:1; margin-top:390px;}
.sitelink li{ float:left; display:inline; margin-left:30px;}
.sitelink li:first-child{margin-left:0;}

.footer{ background:url(../../images/footer_bg.jpg) no-repeat top center; height:280px; background-size: cover;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./resources/webgame/images/footer_bg.jpg',sizingMethod='scale');}
.footer_logo{ margin:40px 0 25px; }
.footer_link{ font-family:Arial, Helvetica, sans-serif; margin:0 5px; display: inline-block; }
.footer_link a{ margin:0 7px; display: inline;}
.socia{ margin:20px 0 58px; overflow:hidden; zoom:1;}
.socia li{display: inline-block; margin:0 10px;}
.socia li a{ background:url(../../images/socia.png) no-repeat; height:42px; width:145px; font-size:11px; line-height:120%; color:#6a6a6a; text-align:left; padding:12px 0 0 160px; display:block;border-bottom: none;}
.socia li a.facebook{ background-position: 0 0}
.socia li a.twitter{ background-position: 0 -58px}
.socia li a.youtube{ background-position: 0 -116px}
.socia li a:hover{ opacity:0.8}

/*--pop signup---*/
.pop_signup{ position:absolute; top:200px; left:300px;}
.pop_title{ background:#001216; height:58px; line-height:58px;}
