www.0g.com/templates/static/css/pc/index.css
2021-08-30 15:55:46 +08:00

1018 lines
23 KiB
CSS

/*******************************index首页样式*********************/
/* basic-css */
/* 基本元素重置 */
html { overflow-x:hidden; }
*{margin:0; padding:0;}
body,html{font-size:12px; font-family:"Microsoft YaHei",SimSun,SimHei; color:#686868; background-color:#FFF; }
img{border:0;}
a{text-decoration:none; color:#404242; outline:none;}
div{margin:0 auto;}
li,dl,dt,dd{list-style-type:none;}
input,textarea,select,option,em,h1,h2,h3,h4,h4,h6,strong,span,li,dl,dt,td{font-size:12px;}
h1,h2,h3,h4,h5,h6,em,i{font-style:normal; font-weight:400; outline:none;}
/* 重用类样式 */
.f_l{float:left !important;}
.f_r{float:right !important;}
.no_margin{margin:0px !important;}
.no_border{border:0px !important;}
.no_bg{background:none !important;}
.clear_both{clear:both !important;}
.display_block{display:block !important;}
.text_over{overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; -moz-binding: url('ellipsis.xml#ellipsis');}
/* 重用自定义样式 */
.w_100{width:100%;}
.w_95{width:95%;}
.indextx{width:980px;margin:0 auto; margin-top:10px; background:#FFFFFF;}
.w_min_width{min-width:1200px;}
.w_1200{width:1200px;}
.w_1067{width:1067px;}
.w_980{width:980px;}
*{
margin: 0;
padding: 0;
}
html, body {
width: 100%;
height: auto !important;
max-width: 1920px;
min-width: 1280px;
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* header */
.header_full{
position: fixed;
width: 100%;
top: 0;
left: 0;
z-index: 999;
}
.header{
width: 1200px;
height: 90px;
}
/* left */
.logoImg{
position: relative;top: 11px;width: 245px;
}
/* right */
.top_right{width:748px;}
/* top_link */
.top_link{padding-top:24px;height:26px;line-height:26px;padding-right:35px;text-align:right;}
.top_link i{color:#686868;}
.top_link span,.top_link a{color:#46AAFE;}
.top_link a{font-size:13px;}
.top_link a:hover{text-decoration:underline;}
/* nav */
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.nav_bar{position:relative;z-index:1;height:42px;line-height:42px;color:#333;}
.nav{position:relative;top: 22px;width:748px;margin:0 auto; font-family:"Microsoft YaHei",SimSun,SimHei;font-size:14px;}
.nav a{color: white;}
.nav h3{font-size:100%;font-weight:normal;}
.nav h3 a{display:block;width:120px;text-align:center;font-size:18px;}
.nav h3 a:hover{color: #ffca00;}
.nav .m{float:right;position:relative;z-index:1;}
.nav .s{float:right;width:3px;text-align:center;color:#D4D4D4;font-size:12px;}
.nav .sub{display:none;position:absolute;left:-3px;top:42px;z-index:1;width:126px;border-top:0; background:#fff;}
.nav .sub li{text-align:center;margin-bottom:-1px;}
.nav .sub li a{display:block; border-bottom:1px solid #E6E4E3;height:28px;line-height:28px;color:#666;}
.nav .sub li a:hover{background:#1E95FB;color: #FFFFFF;}
.nav .block{height:3px;width:126px;background:#ffca00;position:absolute;left:0;bottom: 60px;;overflow:hidden;}
/* index - banner */
.full_banner{width:100%;position:relative;height:423px;background:#FFF;overflow:hidden;margin-top: 90px;}
.full_banner .bd{margin:0 auto;position:relative;z-index:0;overflow:hidden;}
.full_banner .bd ul{width:100% !important;}
.full_banner .bd li{width:100% !important;float:left;height:450px;overflow:hidden;text-align:center;}
.full_banner .bd li a{ display:block;height:450px;}
.full_banner .hd{width:100%;position:absolute;z-index:1;bottom:0;left:0;height:30px;line-height:30px;text-align:center;}
.full_banner .hd ul{text-align:center;padding-top:5px;}
.full_banner .hd ul li{cursor:pointer;display:inline-block;*display:inline;zoom:1;width:8px;height:8px;margin:5px;background:url(/templates/static/images/pc/tg_flash_p.png) -18px 0;overflow:hidden;
line-height:9999px;}
.full_banner .hd ul .on{background-position:0 0;}
/*中部样式*/
.main{
/*position: relative;bottom: 26px;*/
}
.hot-game .hot-game-area {
height: 390px;
overflow: hidden;
zoom: 1;
}
.hot-game .hot-game-area ul li {
float: left;
position: relative;
width: 290px;
height: 275px;
background: #ffd739;
margin: 0 20px;
}
.hot-game .hot-game-area ul li a {
display: block;
}
.hot-game .hot-game-area ul li .one-game-top {
height: 166px;
}
.hot-game .hot-game-area ul li .one-game-bottom {
height: 130px;
padding: 0 10px;
box-sizing: border-box;
}
.hot-game .hot-game-area ul li .one-game-bottom p {
font-size: 16px;
line-height: 25px;
color: #333333;
}
.hot-game .hot-game-area ul li .one-game-bottom p.lowred {
color: black;
}
.hot-game .hot-game-area ul li .one-game-bottom .game-name {
font-size: 20px;
line-height: 30px;
font-weight: bold;
text-align: center;
}
.hot-game .hot-game-area ul li .mask {
position: absolute;
z-index: 888;
left: 0;
top: 0;
width: 272px;
height: 156px;
background: rgba(0, 0, 0, 0.3);
display: none;
}
.hot-game .hot-game-area ul li .mask img {
position: absolute;
width: 103px;
height: 102px;
left: 50%;
margin-left: -51.5px;
top: 50%;
margin-top: -51px;
}
.hot-game .hot-game-area ul li:hover .mask {
display: block;
}
.hot-game .hot-game-area ul {
margin-right: 0;
}
.hot-game {
position: relative;
}
.hot-game .slide-ctrl ul {
position: absolute;
left: 50%;
top: 350px;
width: 60px;
margin-left: -30px;
}
.picScroll-left .prev {
background: url(/templates/static/images/pc/slide_left.png) no-repeat;
background-size: contain;
left: 0;
}
.picScroll-left .next {
right: 0;
background: url(/templates/static/images/pc/slide_right.png) no-repeat;
background-size: contain;
}
.picScroll-left .prev, .picScroll-left .next {
display: block;
width: 25px;
height: 47px;
overflow: hidden;
cursor: pointer;
position: absolute;
top: 130px;
}
.hot-game {
height: 320px;
position: relative;
margin: 0 auto;
}
.picScroll-left {
width: 1400px;
height: 390px;
position: relative;
}
.hot-game .hot-game-area ul li .one-game-top:before {
content: '';
position: absolute;
/*z-index: 100;*/
left: 0;
top: -6px;
width: 68px;
height: 67px;
background: url(/templates/static/images/pc/game_sign.png) no-repeat;
}
.picScroll-left .hd {
overflow: hidden;
height: 30px;
position: absolute;
bottom: 0;
left: 49.5%;
}
.picScroll-left .hd ul {
float: right;
overflow: hidden;
zoom: 1;
margin-top: 10px;
zoom: 1;
}
.picScroll-left .hd ul li {
float: left;
width: 9px;
height: 9px;
border: solid 1px #ffffff;
border-radius: 50%;
overflow: hidden;
margin-right: 5px;
text-indent: -999px;
cursor: pointer;
background: transparent;
}
.picScroll-left .hd ul li.on {
background: #ffca00
}
/*企业咨询*/
.bg-qyzx {
background: url(/templates/static/images/pc/efun_info_bg.jpg) center no-repeat;
background-size: 100% 100%;
height: 6.2rem;
background-position: center center;
}
.efun-info-wrap {
position: relative;
width: 100%;
}
.efun-info-wrap img {
display: block;
width: 100%;
}
.efun-info-wrap .efun-info {
width: 1200px;
position: absolute;
top: 0;
left: 50%;
margin-left: -602px;
}
.efun-info-wrap .efun-info h2 {
width: 100%;
font-size: 40px;
line-height: 140px;
text-align: center;
color: #ffffff;
}
.efun-info-wrap .efun-info .info-left {
float: left;
width: 450px;
height: 320px;
}
/* .efun-info-wrap .efun-info .info-left .video-top {
position: relative;
height: 250px;
background: url("../templates/static/images/pc/video_bg.jpg") no-repeat;
cursor: pointer;
}*/
.efun-info-wrap .efun-info .info-left .video-top .video-play {
position: absolute;
left: 50%;
top: 50%;
margin-left: -34px;
margin-top: -34px;
width: 85px;
height: 85px;
background: url("/templates/static/images/pc/video.png");
}
.efun-info-wrap .efun-info .info-left .text-bottom {
height: 56px;
background: #ffd739;
text-align: center;
line-height: 56px;
color: #333333;
font-size: 20px;
}
.efun-info-wrap .efun-info .info-right {
float: right;
width: 710px;
height: 368px;
border-top: 1px dashed #a3a3a3;
}
.efun-info-wrap .efun-info .info-right li {
height: 50px;
/* padding-top: 12px;
line-height: 22px;*/
border-bottom: 1px dashed #a3a3a3;
font-size: 14px;
/*color: #3a3a3a;*/
cursor: pointer;
}
.efun-info-wrap .efun-info .info-right li a {
display: block;
}
.efun-info-wrap .efun-info .info-right li p {
color: white;
font-size: 16px;
line-height: 50px;
}
.efun-info-wrap .efun-info .info-right li p:hover{
color: #000000;
/* font-size: 16px;
line-height: 50px;*/
}
.efun-info-wrap .efun-info .info-right li p.Time {
height: 27px;
font-size: 16px;
}
.efun-info-wrap .efun-info .info-right li p.Time {
font-size: 14px;
}
.efun-info-wrap .efun-info .info-right li:hover {
background-color:#ffca00;
}
.efun-info-wrap .efun-info .moreNews {
position: absolute;
right: 0;
top: 455px;
width: 171px;
height: 41px;
text-align: center;
line-height: 41px;
background: #dddfe1;
font-size: 16px;
color: #3a3a3a;
border: 1px solid #bec7cf;
border-radius: 5px;
background: #ffffff;
}
.efun-info-wrap .efun-info .moreNews:hover {
background: #dddfe1;
}
.aui-commentTxT {
width: 70%;
}
.bg-zpBox{
background-color: #000000;
position: relative;
bottom: 1px;
}
/*招聘信息*/
.efun-link {
display: none;
height: 190px;
padding: 50px 0 68px 0;
box-sizing: border-box;
}
.efun-link .link-center {
padding-left: 190px;
}
.efun-link .link-center a {
position: relative;
float: left;
display: block;
width: 319px;
height: 94px;
line-height: 94px;
background: #ffffff;
margin-left: 66px;
font-size: 24px;
/*color: #3f89ed;*/
text-indent: 153px;
border-radius: 10px;
-webkit-box-shadow: 0px 3px 14px #cccccc;
-moz-box-shadow: 0px 3px 14px #cccccc;
box-shadow: 0px 3px 14px #cccccc;
}
.efun-link .link-center .wanter:before {
content: '';
position: absolute;
top: 12px;
left: 63px;
width: 67px;
height: 60px;
color: #3f89ed;
background: url("/templates/static/images/pc/xinxi.png") no-repeat;
}
.efun-link .link-center .wanter:hover {
color: #0e0e0e;
background: #ffca00;
}
.efun-link .link-center .wanter:hover:before {
background: url("/templates/static/images/pc/xinxi.png") no-repeat;
}
.efun-link .link-center .linkWay:before {
content: '';
position: absolute;
top: 12px;
left: 63px;
width: 59px;
height: 64px;
color: #3f89ed;
background: url("/templates/static/images/pc/dianhua.png") no-repeat;
}
.efun-link .link-center .linkWay:hover {
color: #0e0e0e;
background: #ffca00;
}
.efun-link .link-center .linkWay:hover:before {
background: url("/templates/static/images/pc/dianhua.png") no-repeat;
}
/*底部*/
.footer{
/*background-image: linear-gradient(#0e0e0e, #242424, #383838,#333333);*/
background-image: linear-gradient(0deg,
#0e0e0e 0%,
#242424 50%,
#383838 100%),
linear-gradient(
#333333,
#333333);
background-blend-mode: normal,
normal;
height: 120px;
}
img{
vertical-align: middle;
}
/******************************************零游游戏(game)页面样式******************************************/
.outBox .hd .hd-wrap {
width: 100%;
height: 100%;
margin: 0 auto;
background-color: #333333;
}
.outBox .hd .hd-wrap ul {
width: 1400px;
margin: 0 auto;
height: 100%;
font-size: 0;
}
.outBox .hd .hd-wrap ul li {
width: 25%;
line-height: 74px;
display: inline-block;
cursor: pointer;
}
.outBox .hd .hd-wrap ul li span {
display: block;
text-align: center;
font-size: 22px;
color: #ffffff;
}
.outBox .hd .hd-wrap ul li.on {
background: #fecb00;
}
.outBox .hd .hd-wrap ul li.on span {
color:#0e0e0e;
}
/*游戏详情*/
.hotGameList{
display: flex;
align-items: center;
flex-direction: row;
flex-wrap: wrap;
}
.hotGameList li {
width: 272px;
overflow: hidden;
/*margin-bottom: 40px;
margin-right: 21px;*/
margin: 20px 39px;
}
/*鼠标移动效果*/
.slideInfo{
top: -233px;
width: 272px;
height: 158px;
background: rgba(0,0,0,.65);
padding: 10px;
transition: top linear .3s;
}
.hotGameList li:hover .slideInfo{
top:0;
transition:top linear .3s;
}
.slideInfo .fiveStars span{
background-position: -228px -285px;
}
.slideInfo .fiveStars span.halfColor{
background-position: -228px -308px;
}
.slideInfo .fiveStars span.noColor{
background-position:-10000px -10000px;
}
.downLoad{
display: inline-block;
padding:5px 10px;
border:1px solid #fff;
border-radius: 5px;
}
.marginB15{
margin-bottom:15px;
}
.jrGw{
position: relative;
bottom: 10px;
}
.popRight{
width:150px;padding-left: 15px;
color: white;
}
.Game_LXTab ul{
width: 1200px;
margin: 0 auto;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.Game_LXTab ul li{
padding: 30px 20px;
font-size: 20px;
color: white;
}
.Game_LXTab ul li.LeiX{
color: #fecb00;
}
.language_Tab ul{
width: 1200px;
margin: 0 auto;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.language_Tab ul li{
padding: 30px 20px;
font-size: 20px;
color: white;
}
.language_Tab ul li.active-on{
color: #fecb00;
}
/****************************************关于零游(AboutOg)页面样式***************************************/
.sectionList,.sectionListTwo,.sectionListThree{
padding: 0 0 37px 0;
}
.section_ptjz{
background:url(/templates/static/images/pc/ptjz.png) center 0 no-repeat;
}
.section_ptys{
background:url(/templates/static/images/pc/ptys.png) center 0 no-repeat;
}
.section_wlqx{
background:url(/templates/static/images/pc/wlqx.png) center 0 no-repeat;
}
.section_0gfc{
background:url(/templates/static/images/pc/bg_0gfc.png) center 0 no-repeat;
}
.recruitment:hover, .section_LxUs:hover{
background:url(/templates/static/images/pc/ptys.png) center 0 no-repeat;
}
.section_ptjz h2,.section_ptys h2,.section_wlqx h2,.section_0gfc h2{
width: 100%;
font-size: 40px;
line-height: 100px;
text-align: center;
}
.wid50{
width: 848px;
height: 408px;
}
.padding0180{
padding: 0 180px;
}
/***************************************加入零游(JoinOg)页面样式***************************************/
.recruitment{
height: 345px;
background-color: #000000;
}
.recruitment h2{
width: 100%;
font-size: 40px;
line-height: 100px;
text-align: center;
}
.recruitment_Icon{
width: 50%;
display: flex;
display: -webkit-box;
display: -webkit-flex;
justify-content: space-between;
align-items: center;
margin-top: 15px;
}
.recruitment_Icon li a img:hover{
opacity: 1;
/*CSS3鼠标经过小图标时图片产生一个圆形大边框*/
box-shadow: 0 0 0;
/*CSS3鼠标经过小图标放大且旋转360度动画*/
transform: rotate(0deg) scale(1.15);
-webkit-transform:rotate(0deg) scale(1.15);
-moz-transform:rotate(360deg) scale(1.15);
-ms-transform:rotate(360deg) scale(1.15);
-o-transform:rotate(360deg) scale(1.15);
}
.recruitment-Detail{
background:url(/templates/static/images/pc/bg-zpDe.jpg) center 0 no-repeat;
height: 815px;
}
.recruitment-Detail h2{
width: 100%;
font-size: 40px;
line-height: 100px;
text-align: center;
}
.listHeader ul{
width: 50%;
display: flex;
display: -webkit-box;
display: -webkit-flex;
justify-content: space-between;
align-items: center;
}
.on-active{
color: #ffca00;
}
.Size-item{
/*height: 630px;*/
background-color: #000000;
border-radius: 4px;
width: 88%;
margin-top: 30px;
}
.Size-item p:first-child{
padding: 20px 0 10px 20px;
color: #ffca00;
font-size: 20px;
}
.Size-item p:last-child{
padding: 20px 0 10px 20px;
/*padding: 5px 0 30px 20px;*/
font-size: 20px;
}
.Size-item p{
font-size: 18px;
color: #ffffff;
line-height: 25px;
padding: 5px 20px;
}
.colorffca00{
color: #ffca00;
}
/*************************************商务合作(Business)页面样式*********************************/
.section_LxUs{
background:url(/templates/static/images/pc/ptjz.png) center 0 no-repeat;
line-height: 93px;
}
.section_LxUs h2{
width: 100%;
font-size: 40px;
text-align: center;
}
/*联系我们*/
.SListBu{
display: flex;
justify-content: center;
}
.LixOne,.LixTwo{
float: left;
width: 320px;
height: 98px;
border-radius: 8px;
border: solid 2px #dcdcdc;
padding-left: 23px;
margin: 0 50px;
}
.numWe{
position: relative;
right: 48px;
top: 5px;
line-height: 27px;
color: #ffca00;
}
.numSize{
position: relative;
right: 19px;
top: 5px;
line-height: 27px;
color: white;
}
.numSize2{
position: relative;
right: 15px;
top: 5px;
line-height: 27px;
color: white;
}
.numSize3{
position: relative;
right: 11px;
top: 5px;
line-height: 27px;
color: white;
}
/*合作伙伴*/
.og-block-four {
background: url(/templates/static/images/pc/foot_bg.jpg) center no-repeat;
height: 360px;
}
.og-block-four h2{
width: 100%;
font-size: 40px;
line-height: 100px;
text-align: center;
}
.og-part-box {
height: 150px;
overflow: hidden;
margin-top: 39px;
}
.og-part-list>li{
float:left;
display:flex;
display: -webkit-box;
display:-webkit-flex;
align-items:center;
width:340px;
height:120px;
margin-right:30px;
overflow:hidden;
}
.og-part-list>li img{
margin:0 auto;
}
/*************************************列表页(list)面样式*********************************/
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap {
width: 100%;
/*padding-top: 40px;*/
box-sizing: border-box;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item {
width: 100%;
height: 200px;
padding: 24px 20px;
box-sizing: border-box;
cursor: pointer;
position: relative;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item .news-pic {
width: 282px;
height: 100%;
float: left;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item .news-pic img {
display: block;
width: 100%;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item .news-text {
width: 860px;
margin-top: 30px;
float: right;
overflow: hidden;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item .news-text .title {
font-size: 24px;
line-height: 40px;
color: white;
text-align: left;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item .news-text .text {
display: block;
width: 100%;
max-height: 150px;
font-size: 16px;
color:white;
line-height: 30px;
text-align: left;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item:before {
content: '';
width: 100%;
height: 1px;
background: #666666;
position: absolute;
bottom: 0;
left: 0;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item:hover:after {
content: '';
width: 6px;
height: 100%;
background-color: #ffca00;
position: absolute;
top: 0;
left: 0;
}
.news-efun-content .news-efun-news-lists .news-efun-news-item-wrap li.news-efun-news-item:hover .news-text .title {
color: #ffca00;
}
.marginB4{
margin-bottom: 4px;
}
/*列表下方的分页样式*/
.pager {
font-size: 12px;
line-height: 120px;
color:#000000;
text-align: center;
}
.pager i, .pager a.next, .pager a.end {
padding: 4px 8px;
margin-right: 8px;
line-height: 28px;
background-color: #a6937c;
color: #ffffff;
font-style: normal
}
.pager > i, .pager a:hover i {
border: 1px solid #f24854;
background: #f24854;
color: #fff
}
.pager .choose_page input {
width: 50px;
border: 0;
border-bottom: 1px solid silver;
text-align: center
}
.pager .choose_page button {
padding: 3px 20px;
color: #fff;
background: #f24854;
border: 0
}
.pager .choose_page button:hover {
background: #ef2c3a
}
/*************************************详情(detail)面样式*********************************/
.fh-hack{
border-radius: 5px;
border: solid 1px #c4c4c4;
position: relative;
top: 20px;
padding: 7px 40px;
color: #ffffff;
font-size: 18px;
}
.titleSize{
padding: 45px 0 23px 0;
font-size: 24px;
color: #ffca00;
}
.xinW{
font-size: 36px;
color: white;
position: relative;
padding: 9px;
left: 70px;
bottom: 59px;
border-bottom: 4px solid #ffca00;
}
.xinW2{
font-size: 36px;
width: 14%;
color: white;
position: relative;
padding: 4px;
left: 70px;
bottom: 59px;
border-bottom: 4px solid #ffca00;
}
.news-time{
height: 60px;
border-bottom: 1px solid #666666;
border-top: 1px solid #666666;
box-sizing: border-box;
}
.news-time span{
line-height: 60px;
}
.News_content p:first-child{
padding: 20px 0 10px 0;
line-height: 30px;
}
.News_content p{
font-size: 16px;
color: white;
padding: 10px 2px;
line-height: 25px;
}
.News_content>p>img{
min-width: 2%;
max-width: 100%;
text-align: center;
}
.News_content p:last-child{
padding-bottom: 20px;
}
.News_bottom{
display: flex;
padding: 50px 0;
border-top: 1px solid #666666;
}
.left_news{
width: 49%;
border-right: 1px solid #b7b7b7;
}
.Jx-w{
width: 40%;
margin: 0 auto;
padding-top: 10px;
color: white;
font-size: 16px;
}
.right-news{
width: 49%;
}
.first-page,.last-page{
background-color: #ffca00;
padding: 4px 15px;
}