@charset "utf-8";
/* CSS Document */

.wrapper { background:#f2f2f2 url("../images/header_bg.jpg") no-repeat 50% 0; }

.qrcode_scorll { position:fixed; top:110px; right:0; padding:0; color:#5d5d5d;}
.qrcode_scorll a { position:absolute; right:-520px; width:auto; height:auto; display:block; transition:all .2s;}
.qrcode_scorll a:hover { right:20px;}
.qrcode_scorll a:hover .scroll_bar {}
/*.qrcode_scorll:hover .scroll_bar { right:110px; transition:all .2s;}*/

.qrcode_scorll p.head { position:absolute; left:-80px; padding:60px 0 0; width:80px; height:30px; display:inline-block; background:#fff url("../images/icon_qrcode.jpg") no-repeat 50% 10px; background-size:50px; overflow:hidden; border-radius:10px 0 0 10px;}

.scroll_bar { top:0; right:-520px; padding:12px 10px; width:500px; background:#fff; border-radius:0 10px 10px 10px; color:#5d5d5d; z-index:99; font-size:12px;}
.scroll_bar p { margin:0 0 2px; padding:0 0 10px; width:160px; line-height:14px; display:inline-block; border-bottom:#eee 1px solid;}
.scroll_bar a:link, .scroll_bar a:visited { color:#5d5d5d;}
.scroll_bar a:hover {}
.scroll_bar strong {}
.scroll_bar em { height:auto; line-height:14px; font-style:normal; color:#7b7b7b;}
.scroll_bar img { width:128px;}
.scroll_bar .tit { margin:4px 0 0; padding:5px 0 10px 0; width:100%; color:#107298; border-bottom:none; font-size:16px;}
.scroll_bar .line { margin:10px 0 0; height:4px; display:block; background:url("../images/scroll_bar_line.png") no-repeat 50% 50%;}

.box_wrap { width:100%; height:auto; text-align:center;}
.box { margin:0 auto; width:1220px; height:auto;}

h4 { margin-bottom:30px; font-size:46px; line-height:46px; font-weight:normal; color:#444; text-align:center;}
h4 em { font-style:normal; color:#ec6d06;}
h4 i { font-style:normal; color:#fff;}

.header_wrap { width:100%; height:600px; overflow:hidden; text-align:center;}

.header { position:relative; margin:0 auto; width:1220px; height:550px; text-align:left;}
.logo { margin:16px 0 0 0; width:634px; height:379px; display:inline-block;background: url(../images/logo.png) no-repeat;}
.logo1 { margin:-40px 0 0 0; width:1000px; height:97px; display:inline-block;background: url(../images/btn-title.png) no-repeat;}
.header .logo span { width:246px; height:108px; display:block; text-indent:-999em;}
.indexad { position:absolute; top:55px; left:240px; width:600px; height:245px; display:block; text-indent:-999em;}

.content { width:1220px; height:auto;}

/* 按钮：注册、充值、下载 */
.qiuck_btn { float:left; width:290px; height:auto;}
.q_btn { display:inline-block; transition:all .2s;}
.q_btn a:link, 
.q_btn a:visited { height:100%; display:block; text-indent:-999em;}
.q_btn:hover { background-size:104%; background-position:-4px -4px; ba transition:all .4s;}
.reg { width:290px; height:180px; background:url("../images/index_regist_btn.png") no-repeat; background-size:100%;}
.btn_charger { float:left; width:145px; height:120px; background:url("../images/index_quick_button_charger.png") no-repeat; background-size:100%;}
.btn_download { width:145px; height:120px; background:url("../images/index_quick_button_download.png") no-repeat; background-size:100%;}

/* 大眼睛 */
.promo { float:left; width:465px; height:300px; display:inline-block; background:#eee;}
.promo img { width:100%;}

/* 新闻 */
.news { width:465px; height:300px; display:inline-block; background:#fff;}

.solution { position:relative;}
.solution span { position:absolute; top:14px; right:20px; font-size:24px; font-weight:bold; z-index:9;}
.solution .tab { position:relative; margin:0 20px; padding-top:3px; height:46px; border-bottom:#e5e5e5 2px solid; text-align:left;}
.solution .tab a { margin-right:1px; min-width:72px; width:72px; height:50px; line-height:50px; display:inline-block; text-decoration:none; text-align:center; font-size:18px; transition:all 0s;}
.solution .tab a:hover {text-decoration:none; transition:all 0s;}
.solution .tab a.on { height:44px; border-bottom:#ffb228 5px solid; text-decoration:none; font-weight:bold;}
.solution .tab a.on em { display: block;}

.solution .solution-info { position:relative; margin-left: 20px; width:425px; height:250px; overflow:hidden;}
.solution .solution-info ul { position:absolute; left:0; top:0;}
.solution .solution-info li { float: left; padding:4px 0 0 0; width:425px; text-align:left;}
.solution .solution-info li a { width:425px; height:39px; line-height:39px; display:block; border-bottom:#eee 1px dashed;}
.solution .solution-info li a em { float:right; color:#aaa; font-style:normal;}
.index_article_h,
.index_article_c { line-height:39px; font-size:18px; font-style:normal; font-weight:bold; text-align:center;}
.index_article_h { margin-bottom:2px; background:#fff6f0;}
.index_article_c { background:#fffcf3;}
.index_article_h a { color:#e60012;}
.index_article_c a { color:#eb6100;}

/* 按钮 四大天王 */
.quick_menu_btn { margin-bottom: 20px; padding:20px 0; width:1220px; height:140px; overflow:hidden;}
.quick_menu_btn ul { width:1240px;}
.quick_menu_btn li { float:left; margin-right:20px; width:290px; height:140px; display:inline-block;}
.quick_menu_btn li a:link,
.quick_menu_btn li a:visited { width:290px; height:140px; display:inline-block; overflow:hidden;}
.quick_menu_btn li a:link img,
.quick_menu_btn li a:visited img { transition:all .2s;}
.quick_menu_btn li a:hover img { transform: scale(1.04); transition:all .4s;}

/* 宠物 show */
.channel_petshow { padding:0; height:360px; background:#ddd url("../images/channel_bg_01.jpg") no-repeat 50% 100%; text-align:left;}
.tab_menu { float:left; width:290px; background:#e6f5ff; opacity:0.6;}
.tab_menu .cur { background:#2988cb; color:#fff;}
.tab_menu a:link,
.tab_menu a:visited { padding-left:40px; padding-top:13px; padding-bottom:13px; width:250px; height:64px; line-height:64px; display:inline-block; font-size:24px; font-weight:bold;}
.tab_menu a:hover { background:#2988cb; color:#fff;}
.tab_menu a span { padding-left:10px; vertical-align:top; height:64px; line-height:64px;}
.pet_detail { float:left; position:relative; width:930px; height:360px;}
.pet_detail div { position:absolute; top:-20px; width:930px; height:400px;}

/* 游戏资料 和 玩家交流 */
.channel_qmenu { padding:20px 0; height:480px; background:#ddd url("../images/channel_bg_01.jpg") no-repeat 50% 100%; text-align:left;}
.channel_qmenu .content { overflow:inherit;}
.content_sec { position:relative; width:600px; height:360px;}
.content_sec h3 { height:60px; line-height:60px; font-size:24px; font-weight:bold;}
.content_sec h3.m { margin-left:170px;}
.content_sec h3 em { float:right; font-style:normal;}

.pet_show { position:absolute; display:block; z-index:1;}
.doggy { top:-20px; left:-300px; width:461px; height:527px; background:url("../images/pet-01.png") no-repeat;}

.content_main { width:600px; height:400px; background:#fff; z-index:9;}

.qiuck_menu { margin-right:20px; margin-left:170px; padding:18px 10px; width:auto; height:auto; display:inline-block; border-top:#e5e5e5 2px solid; overflow:hidden;}
.qiuck_menu dt { float:left; margin-right:20px; padding-right:20px; width:40px; height:52px; line-height:26px; display:inline-block; border-right:#e5e5e5 2px dashed; font-size:20px; font-weight:bold; color:#999;}
.qiuck_menu dd { margin-right:16px; width:auto; height:26px; line-height:26px; display:inline-block; vertical-align:top;}

.promo_event span { padding:20px 0 20px 20px; display:inline-block;}
.forum_post { padding:0 20px;}
.forum_post li { height:41px; line-height:41px; border-bottom:#eee 1px dashed;}
.forum_post li a:link,
.forum_post li a:visited {}
.forum_post li a:hover {}
.forum_post li span { float:right; color:#aaa; font-style:normal;}

/* 活动截图展示 */
.event_show { padding:60px 0; width:1220px; height:224px;}
.event_show ul { width:1240px;}
.event_show li { position:relative; float:left; margin-right:20px; padding-bottom:4px; top:0; width:290px; height:auto; line-height:40px; display:inline-block; background:#fff; overflow:hidden; box-shadow:#ddd 0 0 20px; text-align:center; transition:all .2s;}
.event_show li a:link,
.event_show li a:visited { width:290px; height:auto; display:inline-block; overflow:hidden;}
.event_show li a:link img,
.event_show li a:visited img { width:100%; transition:all .4s;}
.event_show li a:hover img { transition:all .2s;}
.event_show li:hover { top:-4px; box-shadow:#c8c8c8 0 6px 10px; transition:all .2s;}