|
|
@@ -13,6 +13,9 @@ html {
|
|
|
font: 12px/1.5 PingFang sc, "Helvetica Neue", Helvetica, Tahoma, Arial, SimSun, TW-Sung, "WenQuanYi Bitmap Song", "AR PL UMing CN", "AR PL UMing HK", "AR PL UMing TW", "AR PL UMing TW MBE", serif; // font-family: $yahei;
|
|
|
text-rendering: optimizeLegibility;
|
|
|
-webkit-font-smoothing: antialiased;
|
|
|
+ &::-webkit-scrollbar{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
body {
|
|
|
@@ -43,7 +46,7 @@ body {
|
|
|
.mod-title {
|
|
|
height: 68px;
|
|
|
background: top center no-repeat;
|
|
|
- @for $i from 1 through 2{
|
|
|
+ @for $i from 1 through 3{
|
|
|
&.title#{$i}{
|
|
|
background-image: url(../img/bg-title#{$i}.png?1);
|
|
|
}
|
|
|
@@ -205,16 +208,36 @@ body {
|
|
|
}
|
|
|
}
|
|
|
video {
|
|
|
- height: 1080px;
|
|
|
- width: 1920px;
|
|
|
display: block;
|
|
|
margin: 0 auto;
|
|
|
}
|
|
|
+ .btn-group{
|
|
|
+ position: absolute;
|
|
|
+ top: -4px;
|
|
|
+ right: 20px;
|
|
|
+ z-index: 9;
|
|
|
+ a{
|
|
|
+ display: inline-block;
|
|
|
+ width: 300px;
|
|
|
+ height: 105px;
|
|
|
+ cursor: pointer;
|
|
|
+ transform: scale(0.75);
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ &:hover{
|
|
|
+ filter: brightness(1.3);
|
|
|
+ }
|
|
|
+ @for $i from 1 through 3{
|
|
|
+ &.b#{$i}{
|
|
|
+ background: url(../img/b#{$i}.png) no-repeat 100% / 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
.mod-gift {
|
|
|
- height: 1570px;
|
|
|
+ height: 2250px;
|
|
|
background: url(../img/bg.png) top center no-repeat;
|
|
|
- margin-top: -94px;
|
|
|
+ margin-top: -135px;
|
|
|
position: relative;
|
|
|
z-index: 1;
|
|
|
box-sizing: border-box;
|
|
|
@@ -223,7 +246,7 @@ body {
|
|
|
width: 860px;
|
|
|
height: 382px;
|
|
|
background: url('../img/box-bg.png?__sprite') no-repeat 100% / 100%;
|
|
|
- margin: 26px auto 160px auto;
|
|
|
+ margin: 26px auto 0px auto;
|
|
|
.mod-list {
|
|
|
ul {
|
|
|
height: 379px;
|
|
|
@@ -255,8 +278,8 @@ body {
|
|
|
text-align: center;
|
|
|
overflow: hidden;
|
|
|
img {
|
|
|
- height: 56px;
|
|
|
- width: 56px;
|
|
|
+ height: 90px;
|
|
|
+ width: 90px;
|
|
|
max-height: 100%;
|
|
|
max-width: 100%;
|
|
|
display: inline-block;
|
|
|
@@ -293,6 +316,31 @@ body {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .btn-lq{
|
|
|
+ width: 274px;
|
|
|
+ height: 75px;
|
|
|
+ background: url('../img/btn-lq.png') no-repeat 100% / 100%;
|
|
|
+ cursor: pointer;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ margin: 26px auto;
|
|
|
+ &:hover{
|
|
|
+ filter: brightness(1.2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tips{
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 115px;
|
|
|
+ h6{
|
|
|
+ font-weight: bolder;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #d7daf9;
|
|
|
+ line-height: 32px;
|
|
|
+ }
|
|
|
+ p{
|
|
|
+ font-size: 14px;
|
|
|
+ color: #b8bef9;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
.mod-version {
|
|
|
overflow: hidden;
|
|
|
@@ -459,7 +507,7 @@ body {
|
|
|
width: 864px;
|
|
|
height: 448px;
|
|
|
background: url('../img/video-img.png') no-repeat 100% / 100%;
|
|
|
- margin: 49px auto 0 auto;
|
|
|
+ margin: 49px auto 90px auto;
|
|
|
position: relative;
|
|
|
i.play{
|
|
|
width: 88px;
|
|
|
@@ -477,6 +525,72 @@ body {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .mod-news{
|
|
|
+ display: flex;
|
|
|
+ width: 860px;
|
|
|
+ margin: 20px auto 0 auto;
|
|
|
+ .news-left{
|
|
|
+ width: 65%;
|
|
|
+ margin-right: 3%;
|
|
|
+ }
|
|
|
+ .news-right{
|
|
|
+ width: 32%
|
|
|
+ }
|
|
|
+ .news-title{
|
|
|
+ width: 100%;
|
|
|
+ border-bottom: 1px solid #646fbf;
|
|
|
+ height: 43px;
|
|
|
+ margin-bottom: 18px;
|
|
|
+ margin-top: 25px;
|
|
|
+ span{
|
|
|
+ color: #fff;
|
|
|
+ font-size: 18px;
|
|
|
+ padding-bottom: 16px;
|
|
|
+ border-bottom: 2px #646fbf solid;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .video-list{
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ }
|
|
|
+ .video-list .video-item{
|
|
|
+ width: calc(33.33% - 10px);
|
|
|
+ margin-right: 15px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ height: 140px;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ &:hover{
|
|
|
+ text-decoration: none;
|
|
|
+ transform: translateY(-5px);
|
|
|
+ }
|
|
|
+ &:nth-child(3n) {
|
|
|
+ margin-right: 0px;
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ color: #6678d1;
|
|
|
+ line-height: 1.1;
|
|
|
+ }
|
|
|
+ img{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .news-list{
|
|
|
+ a{
|
|
|
+ display: flex;
|
|
|
+ white-space: nowrap;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #6678d1;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+ span:first-child{
|
|
|
+ display: inline-block;
|
|
|
+ width: 80%;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
|
|
|
@@ -506,4 +620,127 @@ body {
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
}
|
|
|
+ .lq-box{
|
|
|
+ position: absolute;
|
|
|
+ width: 850px;
|
|
|
+ height: 184px;
|
|
|
+ background-color: #121537;
|
|
|
+ border: 1px solid #3147a3;
|
|
|
+ left: 50%;
|
|
|
+ top: 50%;
|
|
|
+ transform: translate3d(-50%, -50%, 0);
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 28px 56px;
|
|
|
+ p{
|
|
|
+ font-size: 16px;
|
|
|
+ color: #556fd6;
|
|
|
+ }
|
|
|
+ i.x{
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+ position: absolute;
|
|
|
+ right: 0px;
|
|
|
+ top: 0px;
|
|
|
+ background: url('../img/close.png?__sprite') no-repeat 100% / 100%;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .lq-code{
|
|
|
+ display: flex;
|
|
|
+ margin-top: 20px;
|
|
|
+ input{
|
|
|
+ width: 480px;
|
|
|
+ height: 65px;
|
|
|
+ background-color: #0e112f;
|
|
|
+ color: #556fd6;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 65px;
|
|
|
+ border: none;
|
|
|
+ outline: none;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 20px;
|
|
|
+ }
|
|
|
+ button{
|
|
|
+ outline: none;
|
|
|
+ border: none;
|
|
|
+ width: 120px;
|
|
|
+ height: 65px;
|
|
|
+ background-color: #1f2563;
|
|
|
+ color: #556fd6;
|
|
|
+ margin-left: 15px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bolder;
|
|
|
+ }
|
|
|
+ a:last-child{
|
|
|
+ width: 120px;
|
|
|
+ height: 65px;
|
|
|
+ background-color: #d4b138;
|
|
|
+ color: #fff;
|
|
|
+ margin-left: 15px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bolder;
|
|
|
+ line-height:65px;
|
|
|
+ text-align: center;
|
|
|
+ &:hover{
|
|
|
+ text-decoration: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+@media screen and (max-width: 800px) {
|
|
|
+ #bg-video{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .page-index .mod-primary .btn-group{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .page-index .mod-primary{
|
|
|
+ background: url('../img/banner.png') no-repeat center;
|
|
|
+ }
|
|
|
+ .page-index .mod-gift{
|
|
|
+ padding-top: 141px;
|
|
|
+ }
|
|
|
+ .page-index .mod-gift .mod-inner{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ background: none !important;
|
|
|
+ }
|
|
|
+ .page-index .mod-gift .mod-inner .mod-list ul{
|
|
|
+ height: auto;
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+ .page-index .mod-gift .mod-inner .mod-list ul li{
|
|
|
+ margin: 10px;
|
|
|
+ }
|
|
|
+ .page-index .mod-video{
|
|
|
+ width: 100%;
|
|
|
+ height: 30vh;
|
|
|
+ }
|
|
|
+ .page-index .mod-news{
|
|
|
+ width: 100%;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .page-index .mod-news .news-left{
|
|
|
+ width: 100%;
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+ .page-index .mod-news .news-right{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .cover .lq-box{
|
|
|
+ width: 100%;
|
|
|
+ padding: 14px 10px;
|
|
|
+ height: auto;
|
|
|
+ }
|
|
|
+ .dwCommonFooter{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ #dw-topbar{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ body{
|
|
|
+ padding: 0 !important;
|
|
|
+ }
|
|
|
+}
|
