@charset "utf-8"; .green { color: #029d1e; } .orange { color: #ffa000; } .blue { color: #4badff; } .pq_icon { background-image: url(../images/pq_icon.png); background-repeat: no-repeat } .m_box { background: #FFF } .input_t { border: 1px solid #dedede; font-size: 14px; font-family: "微软雅黑"; color: #999; line-height: 20px; padding: 9px 15px; margin: 0; transition: border-color 0.3s linear 0s } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px transparent inset !important; background-color: transparent; background-image: none; transition: background-color 50000s ease-in-out 0s; //背景色透明 生效时长 过渡效果 启用时延迟的时间 } .input_yes { border-color: #80ce8e; } .input_error { border-color: #ffaf8d; } /*下拉列表*/ .select_down * { margin: 0; padding: 0 } .select_down { float: left; display: inline; border: 1px solid #e8e8e8; padding: 9px 15px } .select_down div { float: left } /* 子选择器,在FF等非IE浏览器中识别 */ .select_down>div { min-width: 120px; height: 20px; overflow: hidden } /* 通配选择符,只在IE浏览器中识别 */ *html .select_down div select { display: block; float: left; margin: -2px } .select_down div>select { display: block; border: none; font-size: 14px; font-family: "微软雅黑"; color: #999; height: 20px; min-width: 120px; margin: 0; padding: 0px } .select_down:hover { border: 1px solid #CCC } .select_down select>option { text-indent: 2px; //option在FF等非IE浏览器缩进2px} /*按钮*/ .btn_game { display: inline-block; border-width: 1px; border-style: solid; border-radius: 3px; font-size: 14px; font-family: "微软雅黑"; line-height: 43px; height: 43px; padding: 0 20px; cursor: pointer; margin: 0 5px; transition: all 0.3s linear } .btn_game_c1 { border-color: #a7d6af; color: #029d1e } .btn_game_c1:hover { background: #029d1e; border-color: #029d1e; color: rgba(255, 255, 255, 0.8) } .btn_game_c2 { border-color: #f3c5ad; color: #ff6716 } .btn_game_c2:hover { background: #ff6716; border-color: #ff6716; color: rgba(255, 255, 255, 0.8) } .btn_game_c3 { border-color: #c7d0e7; color: #4563ae } .btn_game_c3:hover { background: #4563ae; border-color: #4563ae; color: rgba(255, 255, 255, 0.8) } .game_btn1, .game_btn2, .game_btn3 { display: inline-block; background: #fe5a5a; border: none; border-radius: 3px; font-size: 16px; font-family: "微软雅黑"; color: rgba(255, 255, 255, 0.8); text-align: center; min-width: 140px; line-height: 45px; height: 45px; cursor: pointer; transition: background 0.3s linear } .game_btn1:hover { background: #fe3636; color: rgba(255, 255, 255, 0.8) } .game_btn2 { background: #ff9c00 } .game_btn2:hover { background: #ff8800; color: rgba(255, 255, 255, 0.8) } .game_btn3 { background: #4badff } .game_btn3:hover { background: #4badff; color: rgba(255, 255, 255, 0.8) } /*图标*/ .ic16_home, .ic16_fav, .ic16_exit, .ic16_people, .ic16_menue, .ic16_phone, .ic16_plus, .ic16_mail { display: inline-block; width: 16px; height: 16px; margin-top: -3px; vertical-align: middle; transition: all 0.2s linear } .ic16_home { background-position: 0 -80px; } .ic16_exit { background-position: 0 -32px } .ic16_people { background-position: 0 -48px } .ic16_menue { background-position: 0 -64px } .ic16_phone { background-position: 0 -80px } .ic16_plus { background-position: 0 -96px } .ic16_mail { background-position: 0 -112px } /*星星*/ .icon_stars { display: inline-block; background: url(../images/icon_stars.png) 0 0 no-repeat; text-align: left; width: 75px; height: 15px; line-height: 15px; vertical-align: middle } .icon_stars i { display: inline-block; background: url(../images/icon_stars.png) 0 -15px no-repeat; width: 100%; height: 15px; line-height: 15px } .icon_stars2 { display: inline-block; background: url(../images/icon_stars.png) 0 -30px no-repeat; text-align: left; width: 84px; height: 17px; line-height: 15px; vertical-align: middle } .icon_stars2 i { display: inline-block; background: url(../images/icon_stars.png) 0 -47px no-repeat; width: 100%; height: 17px; line-height: 17px } /*进度100%*/ .progre_slider { background: #ccc; display: inline-block; border-radius: 2px; line-height: 4px; height: 4px; width: 120px; vertical-align: middle; overflow: hidden } .progre_slider .goso { background: #ff6716; display: inline-block; border-radius: 2px; line-height: 4px; height: 4px } /*翻页*/ .page { text-align: center; line-height: 30px } // .page a, .page span{display:inline-block; border-radius:3px; font-size:14px; color:#999; line-height:35px; padding:0 15px; vertical-align:middle; transition:all 0.3s linear} // .page a:hover{background:#EEE} // .page .updow{font-family:"宋体"} // .page .on, .page .on:hover{background-color:#ff6364; color:rgba(255,255,255,0.8)} // .page span{background:#ffc100; color:rgba(255,255,255,0.8)} .page a, .page span { display: inline-block; border-radius: 3px; font-size: 12px; line-height: 12px; color: #333; padding: 6px 12px; transition: all 0.3s; background-color: #f7f7f7; border: 1px solid #e6e6e6; } .page span, .page a:hover, .page a.on { background-color: #ffc100; color: #fff; border-color: #ffc100; } /*弹出层*/ .popup_box { background: #FFF; position: fixed; top: 50%; left: 50%; _position: absolute; z-index: 998 } .popup_box .popup_title { background: #fafafa; height: 50px; line-height: 50px; padding: 0 30px } .popup_box .popup_title h3 { display: inline-block; font-size: 18px; font-weight: 100; color: #333 } .popup_box .popup_close { display: block; background: url(../images/x_but.png) no-repeat; width: 18px; height: 18px; position: absolute; top: 15px; right: 20px; transition: all 0.2s linear } .popup_box .popup_close:hover { transform: rotate(180deg) } .popup_bg { display: none; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100vh; position: fixed; _position: absolute; z-index: 997 } /*弹出层礼包领取*/ .popup_gift_box { width: 600px; min-height: 300px; margin: -150px 0 0 -300px; _top: expression(documentElement.scrollTop + 100 + "px"); } .popup_gift_info { padding: 20px } .popup_gift_info li { font-size: 14px; line-height: 35px; position: relative } .popup_gift_info label { display: block; float: left; font-size: 14px; color: #999; text-align: right; line-height: 35px; width: 150px; padding-right: 10px } .popup_gift_info .rc { padding-left: 160px } /*min*/ .min { background: #f7f7f7; border-bottom: 1px solid #e8e8e8; font-size: 12px; color: #999; line-height: 31px; height: 31px; min-width: 1200px } #ok_login { display: block; } .min .line { display: block; float: left; height: 11px; border-left: 1px dotted #ddd; margin: 10px; } .min a { display: block; float: left; color: #525252; transition: all 0.3s linear } .min a:hover { color: #03b4f5 } .min a:hover .ic16_home { background-position: -16px 0 } .min a:hover .ic16_fav { background-position: -16px 0 } .min a:hover .ic16_exit { background-position: -16px -32px } .min a:hover .ic16_people { background-position: -16px -48px } .min a:hover .ic16_menue { background-position: -16px -64px } .min a:hover .ic16_phone { background-position: -16px -80px } .min a:hover .ic16_mail { background-position: -16px -112px } /*搜索*/ .min_search { float: left; background: #FFF; border: 1px solid #03b4f5; border-radius: 5px; height: 21px; margin: 4px 0 0 685px; position: relative } .min_search li { float: left; line-height: 23px } .min_search .search_input { background: none; border: none; font-size: 14px; color: #999; line-height: 21px; height: 21px; width: 115px; margin: -5px 0 0 12px; } .min_search .search_btn { /*background-position: -160px -45px;*/ background-position: -194px -45px; background-color: #fff; border-radius: 0 5px 5px 0; border-left: 1px solid #03b4f5; border-top: none; border-bottom: none; border-right: none; width: 34px; height: 21px; padding: 0; cursor: pointer; vertical-align: top; transition: all 0.3s linear } .min_search:hover .search_btn { /*background-position: -194px -45px;*/ border-left: 1px solid #03b4f5 } /*.min_search:hover { border-color: #03b4f5 }*/ /*游戏信息*/ .min_game_down { float: right; position: relative } .min_game_down:hover .min_game_list { visibility: visible; opacity: 1; top: 30px } .min_game_down .menu_hd { display: block; font-size: 14px; color: #525252; line-height: 31px; height: 31px } .min_game_down .menu_hd .arrow { display: inline-block; border-top: 5px solid #cbcdd1; border-left: 5px solid transparent; border-right: 5px solid transparent; height: 0; line-height: 0; margin-left: 10px; position: relative; transition: all 0.2s linear } .min_game_down .menu_hd .arrow em { display: inline-block; border-top: 5px solid #f7f7f7; border-left: 5px solid transparent; border-right: 5px solid transparent; height: 0; line-height: 0; margin-left: 10px; position: absolute; top: -7px; left: -15px; transition: all 0.2s linear } .min_game_down .menu_hd_on .arrow { border-top: 5px solid #ff9c00; transform: rotate(180deg) } .min_game_down .menu_hd_on { color: #ff9c00 } .min_game_down .menu_hd_on .ic16_menue { background-position: -16px -64px } /*游戏名称*/ .min_game_list { background: #FFF; border: 1px solid #e8e8e8; border-right: none; width: 294px; position: absolute; top: 60px; right: 0; visibility: hidden; opacity: 0; transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28); z-index: 99 } .min_game_list .arrow { display: inline-block; border-bottom: 7px solid #cbcdd1; border-left: 7px solid transparent; border-right: 7px solid transparent; height: 0; line-height: 0; position: absolute; top: -7px; right: 52px } .min_game_list .arrow em { display: inline-block; border-bottom: 7px solid #FFF; border-left: 7px solid transparent; border-right: 7px solid transparent; height: 0; line-height: 0; position: absolute; top: 1px; right: -7px } .min_game_list li { float: left; border-right: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8; width: 146px } .min_game_list li a { display: block; float: none; font-size: 12px; font-family: "微软雅黑"; color: #525252; line-height: 30px; padding-left: 25px } .min_game_list li a:hover { background: #fafafa; color: #ff9c00 } .min_game_list .name { display: inline-block; padding-right: 5px } .min_game_list .title { background: linear-gradient(to bottom, #FFF, #fafafa); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#fafafa'); border-bottom: 1px solid #e8e8e8; border-right: 1px solid #e8e8e8; height: 30px; padding: 0 10px } .min_game_list .more { display: block; float: none; border-top: 1px solid #e8e8e8; border-right: 1px solid #e8e8e8; font-weight: bold; color: #9f9f9f; text-align: center; line-height: 30px; margin-top: -1px } .min_game_list .more:hover { background: #fafafa; color: #ff9c00 } .min_game_list .more i { transition: all 0.2s linear } .min_game_list .more:hover i { transform: rotate(180deg) } .min_game_list .min_ic_hot { display: inline-block; width: 9px; height: 9px; background-position: -250px 0 } .min_game_list .min_ic_new { display: inline-block; width: 9px; height: 9px; background-position: -259px 0 } /* 头部 */ .head { background-color: #fff; background-color: rgba(255, 255, 255, 0.6); width: 100%; position: relative; top: 0; left: 0; z-index: 11; box-shadow: 0 3px 4px rgba(0, 0, 0, 0.05); } .head .m1200 { position: relative; } .head .logo { width: 190px; height: 100px; float: left; line-height: 100px; } .head .logo img { width: 190px; height:60px; } .head .nav { float: right; margin-right: -30px; } .head .nav li { float: left; padding: 0 10px; position: relative; } .head .nav li .on { background: #ffffff; } .head .nav li:after { content: ''; width: 2px; height: 2px; background-color: #999; position: absolute; right: 0; top: 49px; } .head .nav li:last-child:after { display: none; } .head .nav li a { font-size: 18px; height: 100px; padding: 0 10px; line-height: 100px; color: #999; display: block; position: relative; } .head .nav li a:before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; width: 0px; height: 5px; background-color: #03b4f5; transition: 0.3s; } .head .nav li a:hover:before, .head .nav li a.on:before { width: 100%; } .head .nav li a:hover, .head .nav li a.on { color: #ff7e00; } .head .top-menu { width: 100px; height: 100px; float: right; background: #ffd600; position: relative; transition: 0.3s; } .head .top-menu em { width: 27px; height: 2px; display: inline-block; background-color: #333; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; transition: 0.3s; } .head .top-menu em:before, .head .top-menu em:after { content: ''; width: 27px; height: 2px; display: inline-block; background-color: #333; position: absolute; left: -999px; right: -999px; margin: auto; transition: 0.3s; } .head .top-menu em:before { top: -10px; } .head .top-menu em:after { top: 10px; } .head .top-menu.show { background: #282b2d; } .head .top-menu.show em:before, .head .top-menu.show em:after { background-color: #ffd600; top: 0; width: 34px; border-radius: 2px; } .head .top-menu.show em:before { transform: rotate(45deg); } .head .top-menu.show em:after { transform: rotate(-45deg); } .head .top-menu.show em { background-color: transparent; } /* 热门推荐游戏 */ .game-menu-box { width: 100%; padding-bottom: 80px; position: absolute; top: 100px; background-color: #313334; background-color: rgba(40, 43, 45, 0.9); display: none; } .game-menu-box .top { height: 94px; border-top: 6px solid #ffd600; line-height: 94px; padding: 0 35px; background-color: #282b2d; background-color: rgba(40, 43, 45, 0.9); } .game-menu-box .top p { font-size: 22px; color: #fff; } .game-menu-box .top span { float: right; font-size: 12px; margin-left: 45px; position: relative; } .game-menu-box .top span:before { content: ''; width: 12px; height: 12px; display: inline-block; background: url(../images/pq_icon.png) no-repeat; position: absolute; left: -15px; top: 40px; } .game-menu-box .top .icon-h:before { background-position: -322px -45px; } .game-menu-box .top .icon-n:before { background-position: -310px -45px; } .game-menu-box .game-list-box:after { content: ''; clear: both; height: 0; display: block; } .game-menu-box .game-list { width: 565px; padding-left: 35px; float: left; position: relative; } .game-menu-box .game-list:after { content: ''; width: 1px; height: 100%; background-color: #626262; position: absolute; right: 0; top: 0; } .game-menu-box .game-list p { font-size: 18px; line-height: 1em; padding: 25px 0 15px; color: #fff; position: relative; text-indent: 0.7em; } .game-menu-box .game-list p:before { content: ''; width: 3px; height: 18px; background-color: #ffd600; position: absolute; left: 0; top: 25px; } .game-menu-box .game-list ul:after { content: ''; clear: both; height: 0; display: block; } .game-menu-box .game-list li { float: left; width: 30.33333%; padding-right: 3%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; } .game-menu-box .game-list li a { color: #fff; font-size: 12px; line-height: 30px; position: relative; } .game-menu-box .game-list li a:hover { color: #ffd600; } .game-menu-box .game-list li a:after { width: 12px; height: 12px; content: ''; position: absolute; right: -15px; top: 50%; margin-top: -6px; background: url(../images/pq_icon.png) no-repeat; } .game-menu-box .game-list-new li a:after { background-position: -310px -45px; } .game-menu-box .game-list-hot li a:after { background-position: -322px -45px; } .game-menu-box .top-menu-hide { width: 59px; height: 22px; background: url(../images/pq_icon.png) no-repeat -160px -263px; position: absolute; bottom: 25px; left: 0; right: 0; margin: auto; cursor: pointer; } /*页脚*/ .foot { background-color: #282b2d; min-width: 1200px; padding: 29px 0; } .foot_logo { padding: 13px 25px 0 177px; } .foot_info { border-left: 1px dotted #b3b3b3; padding: 0 0 5px 30px; } .foot_logo img{ width:190px; height:auto; max-height:60px; } /*页脚导航*/ .foot_nav { font-size: 14px; color: #acacac; padding-bottom: 10px } .foot_nav .line { display: inline-block; padding: 0 15px; color: rgba(255, 255, 255, 0.3); } .foot .split_line { width: 100%; height: 1px; background: rgba(255, 255, 255, 0.06); margin: 20px 0 10px; } .foot_tips { font-size: 14px; color: #fff; text-align: center; opacity: 0.6; } .foot_nav a { display: inline-block; color: #fff } .foot_nav a:hover { color: #f39d0a } /*版权*/ .foot_copy { font-size: 12px; color: #fff; line-height: 22px } .foot_copy a { color: #fff; } .foot_copy a:hover { color: #f39d0a } .foot_copy a img { position: relative; top: -1px; } .foot.index-foot { margin-top: 0; } .foot.user_foot { background-color: #fff; border: none; margin-top: 0; } .foot .foot_user { border-left: none; text-align: center; } .foot .foot_user .foot_nav a { color: #525252; } .foot .foot_user .foot_nav a:hover { color: #f39d0a; } .foot .foot_user .foot_nav .line { color: #525252; } .foot .foot_user .foot_copy, .foot .foot_user .foot_copy a { color: #656565; } .foot .foot_user .foot_copy a:hover { color: #f39d0a } /*浮动层*/ .float_contact_position { width: 1200px; margin: 0 auto; } .float_contact { position: fixed; bottom: 80px; right: -130px; z-index: 999; right: 10px; } .float_contact .float-bg { width: 52px; height: 143px; background: url(../images/float_contact.png); position: absolute; top: 0; left: 0; z-index: 3; } .float_contact ul { width: 52px; height: 171px; padding-top: 14px; } .float_contact ul li { float: left; width: 100%; margin-bottom: 9px; position: relative; } .float_contact ul li a { width: 100%; height: 37px; display: inline-block; float: left; position: relative; z-index: 9; } .float_contact .kf_pic { visibility: hidden; opacity: 0; transition: 0.3s; width: 160px; height: 30px; padding: 10px 20px; background-color: #fff; border-radius: 6px; position: absolute; left: -200px; top: 0px; box-shadow: 0 0 7px rgba(0, 0, 0, 0.2); z-index: 4; } .float_contact .kf_pic a { width: 100%; } .float_contact .kf_pic img { vertical-align: middle; } .float_contact .kf_pic span { width: 30px; height: 30px; display: inline-block; float: left; margin-right: 5px; } .float_contact .kf_pic b { padding-top: 25px; line-height: 33px; } .float_contact .kf_pic .arrow { width: 23px; height: 26px; display: inline-block; background: url(../images/arrow.png); position: absolute; right: -20px; top: 12px; } .float_contact .wx_pic { visibility: hidden; opacity: 0; transition: 0.3s; width: 200px; height: 200px; background-color: #fff; border-radius: 6px; position: absolute; left: -200px; top: -20px; box-shadow: 0 0 7px rgba(0, 0, 0, 0.2); z-index: 4; text-align:center; } .float_contact .wx_pic img { width: 160px; border-radius: 6px; } .float_contact .wx_pic .arrow { width: 23px; height: 26px; display: inline-block; background: url(../images/arrow.png); position: absolute; right: -20px; top: 35px; } .float_contact .rz_pic { visibility: hidden; opacity: 0; transition: 0.3s; position: absolute; width: 142px; height: 210px; left: -85px; bottom: -42px; } .float_contact .rz_pic .close { width: 18px; height: 18px; display: inline-block; cursor: pointer; position: absolute; bottom: 70px; right: 47px; z-index: 10; } .float_contact .rz_pic .rz-bg1 { position: absolute; top: 0; left: 0; z-index: 2; cursor: pointer; } .float_contact .rz_pic .rz-bg2 { position: absolute; top: 0; left: 0; z-index: 8; cursor: pointer; } .float_contact ul .active { opacity: 1; visibility: visible; left: -211px; } .float_contact .rz .active { opacity: 1; visibility: visible; left: -96px; } /*底部弹窗*/ .bottom-popup { width: 100%; height: 200px; position: fixed; bottom: 0; z-index: 9999; background: url(../images/bottom_popup_bg.png) center no-repeat; } .bottom-popup .down { display: block; width: 100%; height: 100%; } .close { width: 50px; height: 50px; background: #4d1e98; ; border-radius: 25px; position: absolute; top: 10px; right: 20px; cursor: pointer; } .close:hover { background: #341466; }