You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1292 lines
21 KiB
CSS

body {
/* background: url(../../images/selfbuilt/header-bg.jpg) top center no-repeat;
background-color: #eee; */
}
.header-main, .message-wrap, .news-box {
overflow: hidden
}
.header-toolbar {
margin-top: 170px;
width: 100%;
height: 70px;
position: relative
}
.header-toolbar .erweima img {
width: 112px;
height: 112px
}
.erweima {
font-size: 0;
z-index: 10;
width: 187px;
height: 187px;
border: 10px solid #cacedb
}
.erweima-desc {
line-height: 22px;
margin-left: 142px;
color: #fafafa;
font-size: 16px;
padding: 8px 0
}
.message p, .message-wrap a, .message-wrap p {
font-size: 14px
}
.message {
padding: 0 5px;
margin-top: 11px;
margin-left: 38px;
position: relative
}
.message p {
color: #fafafa;
line-height: 20px
}
.message-wrap {
height: 28px;
width: 215px
}
.message-wrap input {
width: 145px;
height: 28px;
line-height: 28px;
border: none;
background: #fff;
padding: 0 5px
}
.message-wrap a {
display: block;
width: 60px;
text-align: center;
line-height: 28px;
litter-spacing: 10px;
background: #4d38d1;
color: #fff
}
#js-list-outer-n1, .lunbo, .main {
background: #fff
}
.package {
position: absolute;
right: 20px;
top: -65px;
z-index: 10;
width: 107px;
height: 108px
}
.package a {
display: block;
width: 100%;
height: 100%
}
.header-main {
width: 100%;
height: 333px;
margin-bottom: 20px
}
.header-main-x {
width: 100%;
height: 221px;
margin-bottom: 20px;
overflow: hidden;
}
.lunbo {
width: 592px;
height: 333px
}
.lunbo-x {
width: 592px;
height: 221px;
background: #fff;
}
.slideBox, .slideUl, .slideUl img, .slideUl li {
width: 100%;
height: 100%
}
.slideUl {
position: relative
}
.slideUl li {
position: absolute;
left: 0;
top: 0
}
.news-box {
width: 401px;
height: 333px
}
.news-box-x {
width: 401px;
height: 221px
}
.news-header {
width: 100%;
height: 220px;
border-bottom: 1px solid #dedede;
border-left: 1px solid #ccc
}
.news-header > ul > li {
width: 75px;
height: 50px;
font-size: 18px;
line-height: 50px;
text-align: center;
float: left
}
.news-header > ul > li a {
color: #454545;
display: inline-block;
width: 100%;
height: 16px;
line-height: 16px;
border-right: 1px solid #ccc
}
.news-header > ul > li.current {
font-weight: 700;
border-bottom: 2px solid #e95d26
}
.news-header > ul > li.current > a {
color: #e95d26
}
.news-header > ul li.tab-more {
width: 160px;
float: right;
font-size: 12px;
text-align: right
}
.news-header > ul li.tab-more a {
margin-top: 16px;
border: none;
color: #666;
display: inline-block;
width: 20px;
height: 20px;
background-image: url(../../images/selfbuilt/smallcon.png);
background-position: -70px -20px
}
.news-header > ul li.tab-more a:hover {
background-position: -70px -42px
}
.tab-box {
width: 100%;
height: 100%;
display: none;
overflow: auto
}
.media-tab, .media-tab > ul, .wrap {
overflow: hidden
}
.news {
margin: 15px 5px 0 0
}
.news > li {
padding-bottom: 6px;
border-bottom: 1px dashed #ccc;
height: 22px;
font: 14px/22px SimSun, NSimSun;
margin-top: 13px
}
.news-date {
float: right;
color: #666
}
.news-type {
color: #065974;
font-weight: 700
}
.news > li a {
color: #504e4e;
margin-left: 12px;
transition: all .2s ease-in .1s;
-webkit-transition: all .2s ease-in .1s;
-o-transition: all .2s ease-in .1s
}
.news > li a:hover {
text-decoration: underline;
padding-left: 10px
}
.main {
width: 100%;
height: 450px
}
.wrap {
width: 1200px;
margin: 0 auto
}
.footwrap-bg {
background: #fff;
height: 180px
}
.media {
margin-top: 20px
}
.media-title, .raiders-title {
height: 54px;
line-height: 54px
}
.media-more, .media-tab > ul > li {
line-height: 50px
}
.media-more a {
color: #898989;
font-size: 12px
}
.media-tab {
width: 700px
}
.media-tab > ul {
border-left: #efefef 1px solid
}
.media-tab > ul > li {
font-size: 15px;
text-align: center;
float: left;
height: 50px;
width: 333px;
border-right: #efefef 1px solid;
background-color: #fcfcfc;
border-top: 1px solid #efefef;
border-bottom: 1px solid #efefef
}
.media-tab > ul > li a {
color: #454545
}
.media-tab > ul > li.current {
background-color: #fff;
border-top: 2px solid #4d38d1;
height: 49px
}
.media-tab-box {
width: 700px;
height: 326px;
display: none;
overflow: auto
}
.raiders-tab, .raiders-tab > ul, .raiders-tab > ul > li {
overflow: hidden
}
.media-tab-box ul {
margin: 37px 0 0 18px
}
.media-tab-box ul li {
float: left;
position: relative;
margin: 0 16px 16px 0;
width: 200px;
height: 110px;
overflow: hidden
}
.media-tab-box ul li a img {
width: 200px;
height: 110px;
transition: all .4s ease-in .1s;
-webkit-transition: all .4s ease-in .1s;
-o-transition: all .4s ease-in .1s
}
.media-tab-box ul li a div {
position: absolute;
bottom: 0;
width: 100%;
left: 0;
height: 30px;
line-height: 30px;
color: #fff;
text-align: center;
background: #333;
filter: alpha(opacity=80);
opacity: .8
}
.media-tab-box ul li a:hover div {
color: #f16600
}
.media-tab-box ul li a:hover img {
transform: scale(1.2);
-webkit-transform: scale(1.2);
-o-transform: scale(1.2)
}
.meida-tv {
display: block;
width: 670px;
height: 100%
}
.meida-tv img {
width: 670px;
height: 320px
}
.raiders {
margin-top: 6px;
width: 500px
}
.raiders-tab {
width: 495px;
border: 1px solid #efefef;
height: 250px
}
.raiders-tab > ul > li {
float: left;
width: 99px;
text-align: center;
padding: 82px 0 8px;
font-size: 18px
}
.raiders-tab > ul > li a {
font-weight: 400;
color: #a98f8f
}
li.xs {
background: url(../../images/selfbuilt/raiders-tab-icon.png) no-repeat
}
li.fb {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -102px 0 no-repeat
}
li.jjc {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -202px 0 no-repeat
}
li.zt {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -302px 0 no-repeat
}
li.qt {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -402px 0 repeat-x
}
li.xs.current {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -1px -93px no-repeat
}
li.fb.current {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -103px -93px no-repeat
}
li.jjc.current {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -203px -93px no-repeat
}
li.zt.current {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -303px -93px no-repeat
}
li.qt.current {
background: url(../../images/selfbuilt/raiders-tab-icon.png) -403px -93px no-repeat
}
.raiders-tab-box {
width: 490px;
height: 160px;
display: none;
overflow: auto
}
.raiders-news > li {
height: 22px;
font: 12px/22px SimSun, NSimSun;
margin-top: 8px
}
.raiders-news-date {
float: right;
color: #666
}
.raiders-news-type {
color: #065974;
font-weight: 700
}
.service-title, .wechart-title {
font-weight: bolder;
font-size: 18px
}
.raiders-news > li a {
color: #504e4e;
margin-left: 12px;
transition: all .2s ease-in .1s;
-webkit-transition: all .2s ease-in .1s;
-o-transition: all .2s ease-in .1s
}
.raiders-news > li a:hover {
text-decoration: underline;
padding-left: 10px
}
.raiders-other ul li {
float: left;
padding: 1px 15px;
border-right: #ccc 1px solid;
margin-top: 15px
}
.raiders-other ul li a {
color: #454545
}
.raiders-other ul li a:hover {
color: #e67e22;
text-decoration: underline
}
.service {
width: 1200px;
height: 238px;
margin: 23px auto 0
}
.syjl-wechart {
margin: 18px 0 18px 90px;
width: 330px;
height: 108px
}
.wechart-img {
width: 148px;
height: 148px
}
.wechart-title {
color: #333;
margin: 17px 0 0 20px
}
.wechart-desc {
color: #333;
font-size: 18px;
margin: 5px 0 0 20px;
line-height: 20px
}
.game-wechart {
margin: 15px 80px 15px 120px;
width: 400px;
height: 150px
}
.service-box {
margin: 40px 80px 40px 120px;
width: 400px;
color: #333
}
.service-title {
color: #333;
line-height: 24px
}
.service-box p {
margin-top: 10px;
line-height: 22px;
font-size: 18px;
color: #333
}
.head-carsousel {
width: 100%;
height: 981px;
position: absolute;
z-index: -1;
top: 0;
left: 0
}
.head-carsousel li {
width: 100%;
height: 100%;
position: relative;
text-align: center;
overflow: hidden
}
.head-carsousel li img {
height: 100%;
width: 1920px;
position: absolute;
left: 50%;
top: 0;
margin-left: -960px
}
.sign-box {
background: red;
position: absolute;
top: 695px;
left: 58%;
margin-left: -500px
}
.header-video {
margin: 330px 0 0 180px
}
.con2-mid, .four, .sign-trigger, .two {
margin-right: 5px
}
.header-video > a {
width: 208px;
height: 80px;
display: inline-block;
background-image: url(../../images/selfbuilt/hvideo.png);
background-position: 0 -85px
}
.header-video > a:active, .header-video > a:hover {
background-image: url(../../images/selfbuilt/hvideo.png);
background-position: 0 0
}
.header-words {
width: 100%;
height: 30px;
margin-top: 300px;
margin-bottom: 5px
}
.header-words p {
color: #fafafa;
line-height: 35px;
font-size: 14px;
text-align: center;
width: 207px;
height: 35px;
background: url(../../images/selfbuilt/ewm-mask.png)
}
.android a, .ios-zb a {
display: block;
width: 100%;
height: 64px
}
.android a {
background: url(../../images/selfbuilt/dload.jpg) 0 -64px
}
.ios-zb a {
background: url(../../images/selfbuilt/dload.jpg)
}
.android a:hover {
background: url(../../images/selfbuilt/dload-hover.jpg) 0 -64px
}
.ios-zb a:hover {
background: url(../../images/selfbuilt/dload-hover.jpg)
}
.ios-zb {
margin-top: 1px
}
.n-list-title li {
width: 50%;
height: 39px;
float: left
}
.current .kf-android, .current .kf-ios, .kf-android, .kf-ios {
height: 100%;
width: 100%;
display: inline-block
}
.current .kf-ios {
background: url(../../images/selfbuilt/kf-tab.png) 0 -42px
}
.current .kf-android {
background: url(../../images/selfbuilt/kf-tab.png) -200px -81px
}
.kf-ios {
background: url(../../images/selfbuilt/kf-tab.png)
}
.kf-android {
background: url(../../images/selfbuilt/kf-tab.png) -200px 39px
}
.kf-table {
height: 293px;
padding: 0 14px;
background: #fff
}
.kf-content, .kf-title {
width: 100%;
height: 39px;
line-height: 39px;
border-bottom: 1px dashed #ccc
}
.kf-content > li, .kf-title > li {
float: left;
width: 33%;
text-align: center
}
.kf-title > li {
color: #e95d26;
font-size: 16px
}
.kf-content > li {
font-size: 14px;
color: #333
}
.con-gift {
width: 207px;
height: 221px;
display: inline-block;
background: url(../../images/selfbuilt/gift.jpg);
position: absolute;
}
.con2-left-bot, .media-con, .mj-con {
position: relative
}
.con-gift:hover {
background: url(../../images/selfbuilt/gift.jpg) -208px 0
}
.con2-left-bot {
margin-top: 167px;
background: #fff;
height: 166px
}
.con2-left-bot .title {
color: #e95d26;
font-size: 18px;
text-align: center;
margin-bottom: 10px;
padding-top: 30px
}
.con2-left-bot .input > input {
width: 182px;
height: 33px;
border: none;
background: #e3e2e2;
color: #a1a0a0;
padding-left: 5px
}
.con2-left-bot .input {
text-align: center
}
.con2-left-bot .send a {
width: 100px;
height: 37px;
display: inline-block;
font-size: 18px;
background: #e95d26;
line-height: 37px;
color: #fff;
border-radius: 10px
}
.con2-left-bot .send a:hover {
background-color: #e95d26
}
.con2-left-bot .send {
text-align: center;
margin-top: 8px
}
/*.header-wrap {*/
/*background: url(../../images/selfbuilt/header-bg.jpg) top center no-repeat*/
/*}*/
.con2-mid {
border-bottom: 2px solid #dedede;
height: 50px
}
.con2-rt {
width: 100%;
height: 100%
}
.con2-rt li {
width: 198px;
height: 109px;
float: left
}
.con2-rt li > a {
width: 100%;
height: 100%;
display: inline-block
}
.con2-rt > .sign-trigger > a {
background: url(../../images/selfbuilt/list.jpg) no-repeat
}
.con2-rt > .one > a {
background: url(../../images/selfbuilt/list.jpg) -204px 0 no-repeat
}
.con2-rt > .two > a {
background: url(../../images/selfbuilt/list.jpg) 0 -113px no-repeat
}
.con2-rt > .three > a {
background: url(../../images/selfbuilt/list.jpg) -204px -113px no-repeat
}
.con2-rt > .four > a {
background: url(../../images/selfbuilt/list.jpg) 0px -226px no-repeat
}
.con2-rt > .five > a {
background: url(../../images/selfbuilt/list.jpg) -204px -226px no-repeat
}
.con2-rt > .sign-trigger > a:hover {
background: url(../../images/selfbuilt/list-hover.jpg) no-repeat
}
.con2-rt > .one > a:hover {
background: url(../../images/selfbuilt/list-hover.jpg) -204px 0 no-repeat
}
.con2-rt > .two > a:hover {
background: url(../../images/selfbuilt/list-hover.jpg) 0 -113px no-repeat
}
.con2-rt > .three > a:hover {
background: url(../../images/selfbuilt/list-hover.jpg) -204px -113px no-repeat
}
.con2-rt > .four > a:hover {
background: url(../../images/selfbuilt/list-hover.jpg) 0px -226px no-repeat
}
.con2-rt > .five > a:hover {
background: url(../../images/selfbuilt/list-hover.jpg) -204px -226px no-repeat
}
.five, .three {
margin-right: 0
}
.one {
margin-right: 5px;
}
.five, .four, .two {
margin-top: 5px
}
.media, .role {
width: 100%;
height: 410px
}
.mj {
width: 100%;
height: 270px;
margin-top: 30px
}
.jietu {
margin-top: 20px
}
.role-con {
height: 366px;
border: 1px solid #dedede;
border-right: none
}
.media-con {
height: 353px
}
.mj-con {
width: 100%;
height: 200px;
overflow: hidden;
background: #fff
}
.media-icon, .role-icon {
background-repeat: no-repeat;
vertical-align: middle
}
.media-list > li, .role-list > li {
float: left;
position: relative
}
.role-list a {
position: absolute;
top: 214px;
right: 123px;
width: 25px;
height: 117px;
line-height: 88px;
opacity: 0
}
.jietu-title, .media-title, .mj-title, .role-title {
font-size: 20px;
color: #666;
height: 49px;
line-height: 49px
}
.jietu-title span, .media-title span, .mj-title span, .role-title span {
font-size: 14px
}
.role-icon {
display: inline-block;
background-image: url(../../images/selfbuilt/role.png);
width: 25px;
height: 31px;
margin: 0 5px
}
.jietu-icon, .media-icon, .mj-icon {
margin-right: 4px;
display: inline-block
}
.media-icon {
background-image: url(../../images/selfbuilt/media.png);
width: 21px;
height: 25px;
background-size: 100%
}
.mj-icon {
background-image: url(../../images/selfbuilt/hg.png);
width: 22px;
height: 23px
}
.jietu-icon {
background-image: url(../../images/selfbuilt/jt.png);
width: 20px;
height: 20px
}
.media-list {
width: 100%;
height: 100%
}
.media-list > :first-child {
width: 796px;
height: 100%
}
.media-list > :nth-child(n+2) {
width: 198px;
height: 174px;
margin: 0 0 4px 4px
}
.media-list div {
position: absolute;
bottom: 0;
width: 100%;
color: #fff;
background: rgba(0, 0, 0, .5);
text-indent: 10px
}
.media-list > :first-child div {
height: 40px;
line-height: 40px;
font-size: 18px
}
.media-list > :nth-child(n+2) div {
height: 32px;
line-height: 32px;
font-size: 14px
}
.media-list a {
width: 100%;
height: 100%;
display: inline-block;
overflow: hidden
}
.media-list img {
width: 100%;
height: 100%;
position: relative;
transition: all .4s ease-in .1s;
-webkit-transition: all .4s ease-in .1s;
-o-transition: all .4s ease-in .1s
}
.media-list img:hover {
transform: scale(1.2);
-webkit-transform: scale(1.2);
-o-transform: scale(1.2)
}
.mj-list {
height: 100%;
width: 6000px
}
.mj-list li {
float: left;
display: inline-block;
margin-right: 80px;
margin-top: 20px;
position: relative;
z-index: 5
}
.mj-list li:hover span {
color: #e95d26
}
.mj-line {
position: absolute;
width: 6000px;
height: 1px;
left: 125px;
border-bottom: 1px dotted #ccc;
z-index: 0;
top: 80px
}
.jietu-con {
width: 100%;
height: 366px;
overflow: hidden
}
.jietu-list {
width: 120%;
height: 100%
}
.jietu-list > li {
float: left;
height: 100%;
position: relative;
overflow: hidden
}
.jietu-list div {
float: left;
height: 100%
}
.jietu-list .little-item {
position: absolute;
left: 0;
overflow: hidden
}
.jietu-list .little-item img {
height: 100%
}
.foot-wrap {
width: 100%;
min-height: 600px;
}
.media .media-list .media-mask {
width: 100%;
height: 100%;
display: inline-block;
background: rgba(41, 67, 90, .6)
}
.media .media-play {
width: 84px;
height: 84px;
cursor: pointer;
display: inline-block;
position: absolute;
z-index: 11;
background-image: url(../../images/selfbuilt/m-play.png);
background-repeat: no-repeat;
left: 337px;
top: 126px
}
.media .media-list .media-mask:hover {
background: rgba(41, 67, 90, 0)
}
.icon-mj1, .icon-mj1:hover {
background-position: 12px 0
}
.news-import {
width: 100%;
display: inline-block;
height: 62px;
line-height: 60px;
text-align: center;
border-bottom: 1px dotted #dedede
}
.news-import a {
font-size: 20px;
color: #e95d26
}
.little-item img {
border-right: 6px solid #fff
}
.big-item img {
border: 1px solid #dedede;
width: 589px;
height: 364px
}
.mj-list span {
position: absolute;
top: 140px;
left: 60px;
font-size: 14px;
color: #606060
}
.big-item {
width: 598px
}
.little-item {
width: 153px
}
.wechart-desc p {
margin-bottom: 4px
}
.message-icon {
display: inline-block;
width: 19px;
height: 19px;
margin-right: 3px;
vertical-align: middle;
background-image: url(../../images/selfbuilt/msg.jpg)
}
.role-list {
width: 100%;
height: 100%
}
.role-list li {
width: 33.33333%;
height: 100%;
overflow: hidden
}
.icon-mj1 {
background-image: url(../../images/selfbuilt/xn.png);
width: 160px;
height: 133px
}
.icon-mj1:hover {
background-image: url(../../images/selfbuilt/xn-hover.png);
width: 160px;
height: 133px
}
.icon-mj2, .icon-mj2:hover {
background-position: -148px 0;
width: 160px;
height: 133px
}
.icon-mj2 {
background-image: url(../../images/selfbuilt/xn.png)
}
.icon-mj2:hover {
background-image: url(../../images/selfbuilt/xn-hover.png)
}
.icon-mj3, .icon-mj3:hover {
background-position: -313px 0
}
.icon-mj3 {
background-image: url(../../images/selfbuilt/xn.png);
width: 160px;
height: 133px
}
.icon-mj3:hover {
background-image: url(../../images/selfbuilt/xn-hover.png);
width: 160px;
height: 133px
}
.icon-mj4, .icon-mj4:hover {
background-position: -465px 0;
width: 160px;
height: 133px
}
.icon-mj4 {
background-image: url(../../images/selfbuilt/xn.png)
}
.icon-mj4:hover {
background-image: url(../../images/selfbuilt/xn-hover.png)
}
.icon-mj5, .icon-mj5:hover {
background-position: -620px 0
}
.icon-mj5 {
background-image: url(../../images/selfbuilt/xn.png);
width: 160px;
height: 133px
}
.icon-mj5:hover {
background-image: url(../../images/selfbuilt/xn-hover.png);
width: 160px;
height: 133px
}
.icon-mj6, .icon-mj6:hover {
background-position: -780px 0;
width: 160px;
height: 133px
}
.icon-mj6 {
background-image: url(../../images/selfbuilt/xn.png)
}
.icon-mj6:hover {
background-image: url(../../images/selfbuilt/xn-hover.png)
}
.icon-mj7, .icon-mj7:hover {
background-position: -930px 0
}
.icon-mj7 {
background-image: url(../../images/selfbuilt/xn.png);
width: 160px;
height: 133px
}
.icon-mj7:hover {
background-image: url(../../images/selfbuilt/xn-hover.png);
width: 160px;
height: 133px
}
.icon-mj8, .icon-mj8:hover {
background-position: -1090px 0;
width: 160px;
height: 133px
}
.icon-mj8 {
background-image: url(../../images/selfbuilt/xn.png)
}
.icon-mj8:hover {
background-image: url(../../images/selfbuilt/xn-hover.png)
}
.role-list img {
width: 100%
}
.ewm {
font-size: 0;
border: 10px solid rgba(255, 255, 255, .6);
position: relative
}