body,dl,dd,ul,ol,h1,h2,h3,h4,h5,h6,p,form,header,section,article,footer{margin:0;}
body,button,input,select,textarea{font:12px/1.5 tahoma,'\5FAE\8F6F\96C5\9ED1',sans-serif}
h1,h2,h3,h4,h5,h6{font-size:100%}
em,b{font-style:normal}
a,a:hover{text-decoration:none}
img{border:0}
body{box-sizing: border-box; min-width: 1270px; background: #0f1722;}
button,input,select,textarea{font-size:100%;outline:none}
table{border-collapse:collapse;border-spacing:0}
td,th,ul,ol{padding:0}
ul li{list-style:none;}
/* reset end */
/***底部***/
#afooter {position: relative;padding: 30px 0;text-align: center;font: normal 12px/19px Tahoma;z-index: 10;background-color: #191219;}
#afooter, #afooter a {color: #c0c0c0;text-decoration: none;}

.wrapper *{-webkit-box-sizing: border-box; box-sizing: border-box;}
.wrapper{position:relative;*zoom:1;margin:0 auto;overflow:hidden; width: 100%; max-width: 1920px;}
.wrapper img{display: block;}
.wrapper .main{width: 1268px; margin: 0 auto; position: relative; z-index: 2;}
.wrapper .hid{text-indent:-9999px;font-size:0px;overflow:hidden;width:0px;height:0px;}
.wrapper .hidden{text-indent:-9999px;font-size:0px;}
.clearfix:after{clear:both;display:block;visibility:hidden;height:0;content:" ";font-size:0}
.clearfix{*zoom:1}


.my-fleet-list .car-box{ background:url(//game.gtimg.cn/images/val/act/a20230301act/pc/car-spr.png) no-repeat;}
.my-fleet-list li.car1.on .car-box{ width:202px; height:480px; background-position:-536px -0px;}
.my-fleet-list li.car1 .car-box{ width:202px; height:480px; background-position:-660px -480px;}
.my-fleet-list li.car2.on .car-box{ width:220px; height:520px; background-position:-0px -632px;}
.my-fleet-list li.car2 .car-box{ width:220px; height:520px; background-position:-220px -632px;}
.my-fleet-list li.car3.on .car-box{ width:268px; height:632px; background-position:-0px -0px;}
.my-fleet-list li.car3 .car-box{ width:268px; height:632px; background-position:-268px -0px;}
.my-fleet-list li.car4.on .car-box{ width:220px; height:520px; background-position:-440px -632px;}
.my-fleet-list li.car4 .car-box{ width:220px; height:520px; background-position:-220px -632px;}
.my-fleet-list li.car5.on .car-box{ width:202px; height:480px; background-position:-738px -0px;}
.my-fleet-list li.car5 .car-box{ width:202px; height:480px; background-position:-660px -480px;}


.spr{ background:url(//game.gtimg.cn/images/val/act/a20230301act/pc/spr.png) no-repeat;}
.spr.btn-add-i{ width:78px; height:78px; background-position:-475px -0px;}
.spr.btn-add{ width:78px; height:78px; background-position:-475px -78px;}
.spr.btn-bind-mob{ width:152px; height:49px; background-position:-406px -172px;}
.spr.btn-close{ width:40px; height:40px; background-position:-334px -204px;}
.spr.btn-f5{ width:30px; height:35px; background-position:-374px -204px;}
.spr.btn-next-i{ width:70px; height:44px; background-position:-194px -204px;}
.spr.btn-next{ width:61px; height:62px; background-position:-553px -0px;}
.spr.btn-prev-i{ width:70px; height:44px; background-position:-264px -204px;}
.spr.btn-prev{ width:61px; height:62px; background-position:-553px -62px;}
.spr.btn-video-i{ width:51px; height:52px; background-position:-558px -157px;}
.my-fleet-list li.car1 .name,.my-fleet-list li.car5 .name{ width:194px; height:32px; background-position:-0px -195px;}
.my-fleet-list li.car2 .name,.my-fleet-list li.car4 .name{ width:211px; height:32px; background-position:-195px -172px;}
.my-fleet-list li.car3 .name{ width:257px; height:32px; background-position:-195px -0px;}
.spr.ornament{ width:13px; height:9px; background-position:-452px -0px;}
.spr.ornament1{ width:13px; height:9px; background-position:-475px -156px;}
.spr.plus{ width:34px; height:33px; background-position:-553px -124px;}
.spr.round1{ width:140px; height:140px; background-position:-195px -32px;}
.spr.round2{ width:140px; height:140px; background-position:-335px -32px;}
.spr.round3{ width:195px; height:195px; background-position:-0px -0px;}
.sel .spr.tick{ width:31px; height:21px; background-position:-0px -227px;}
.spr.tick{ width:31px; height:21px; background-position:-31px -227px;}


.spr-ani{ background:url(//game.gtimg.cn/images/val/act/a20230301act/pc/spr-ani.png) no-repeat;}
.spr-ani.ani-logo1{ width:38px; height:47px; background-position:-1811px -126px;}
.spr-ani.ani-logo2{ width:38px; height:126px; background-position:-1773px -0px;}
.spr-ani.ani-logo3{ width:38px; height:126px; background-position:-1811px -0px;}
.spr-ani.guide{ width:41px; height:55px; background-position:-1770px -126px;}
.spr-ani.rectangle1{ width:76px; height:17px; background-position:-744px -209px;}
.spr-ani.rectangle2{ width:38px; height:47px; background-position:-1770px -181px;}
.spr-ani.rectangle3{ width:236px; height:25px; background-position:-508px -209px;}
.spr-ani.rectangle4{ width:508px; height:25px; background-position:-0px -209px;}
.spr-ani.riot{ width:51px; height:7px; background-position:-820px -209px;}
.spr-ani.t1{ width:1049px; height:104px; background-position:-0px -105px;}
.spr-ani.t2{ width:1138px; height:105px; background-position:-0px -0px;}
.spr-ani.t3{ width:721px; height:103px; background-position:-1049px -109px;}
.spr-ani.t4{ width:415px; height:103px; background-position:-1138px -0px;}
.spr-ani.t5{ width:220px; height:109px; background-position:-1553px -0px;}


.btn-val-comm{padding: 9px 6px 8px; position: relative; height: 75px;overflow: hidden;}
.btn-val-comm.gray{cursor: default; pointer-events: none;}
.btn-val-comm:after,.btn-val-comm:before{content: ''; width: 100%; height: 28px; left: 0; border: 1px solid #798283; position: absolute; box-sizing: border-box; -webkit-transition: height .3s ease-in-out; transition: height .3s ease-in-out;}
.btn-val-comm:after{top: 0; border-bottom: none;}
.btn-val-comm:before{bottom: 0; border-top:none;}
.btn-val-comm .btn-main{width: 100%; height: 100%; position: relative; display: block; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/btn-mask.png); background: #ff4654;}
.btn-val-comm .btn-main:before{ content: ''; position:absolute;top:0;left:-10px;z-index:2;width:120%;height:100%;background-color:#0f1923; -webkit-transition: -webkit-transform .3s ease-in-out; transition: transform .3s ease-in-out; -webkit-transform:skew(-10deg) translateX(-100%);transform:skew(-10deg) translateX(-100%);}

.btn-val-comm .btn-main .txt{display: block; width: 100%; height: 100%; line-height: 58px; text-align: center; color: #fff; font-size: 24px; position: relative; z-index: 3; letter-spacing: 3px;-webkit-transition: color .3s ease-in-out; transition: color .3s ease-in-out; font-weight: bold;}
.btn-val-comm .btn-main .txt:after{content: ''; position: absolute; right: 0; bottom: 0; width: 6px; height: 6px; background: #000; -webkit-transition: background .3s ease-in-out; transition: background .3s ease-in-out;}
.btn-val-comm:hover .btn-main .txt:after{ background: #fff;}
.btn-val-comm:hover .btn-main:before{-webkit-transform: translateX(0) skew(-10deg);transform: translateX(0) skew(-10deg)}
.btn-val-comm:hover:before,.btn-val-comm:hover:after{ height: 40px;}
.btn-val-comm.gray:hover:before,.btn-val-comm.gray:hover:after{height: 28px;}

.btn-val-comm.gray .btn-main,.btn-val-comm.gray .btn-main:before{ background: #616161;}
.btn-val-comm.gray .btn-main .txt:after,.btn-val-comm.gray:hover .btn-main .txt:after{background: #ff4654;}

.wrapper .title-box{position: absolute; overflow: hidden;}
.wrapper .title-box p{-webkit-transform: translateY(200%);transform: translateY(200%);-webkit-transition: -webkit-transform .65s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition: -webkit-transform .65s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition: transform .65s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition: transform .65s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform .65s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.wrapper .title-box.var-ani p{-webkit-transform: translateY(0%);transform: translateY(0%);}

.wrapper .page-line{width: 1px; height: 100%; position: absolute; left: 50%; margin-left: -810px; top: 0;}

.page1{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg1.jpg) 50% 0 no-repeat; height: 1024px; position: relative;}
.page2{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg2.jpg) 50% 0 no-repeat; height: 834px; position: relative; z-index: 2;}
.page3{ background: #0f1722 url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg3.jpg) 50% 0 no-repeat; padding-bottom: 100px; position: relative; z-index: 3;}
.page4{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg4.jpg) 50% 0 no-repeat; height: 1085px; position: relative; overflow: hidden; z-index: 4;}
.page5{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg5.jpg) 50% 0 no-repeat; height: 811px; position: relative; z-index: 5;}
.page6{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg6.jpg) 50% 0 no-repeat; height: 984px; position: relative; z-index: 6;}


.page1 .main-box{width: 991px; position: absolute; left: 50%; margin-left: -20px; top: 626px; padding-top: 73px; font-size: 0; text-align: center;}
.page1 .title-box{width: 977px; height: 394px; left: 50%; margin-left: -482.5px; top: -461px;}
.page1 .title-box p{background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/v1-slogan.png) no-repeat; width: 100%; height: 100%;}
.page1 .btn-video{position: absolute; left: 50%; margin-left: -28px; top: -23px; width: 61px; height: 61px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/btn-video.png) no-repeat;}
.page1 .page-line{background: #676c6f;}
.page1 .login-box{font-size: 21px; line-height: 40px; color: #ebe8e1; height: 44px;}
.page1 .login-box a{ color: #ff4654;}
.page1 .btn-reserve{display: block; margin: 0 auto 18px; width: 322px;}
.page1 .btn-tick{display: inline-block; vertical-align: top; *zoom:1; *display: inline; color: #ebe8e1; font-size: 21px; line-height: 40px; height: 40px; margin-top: 14px; position: relative; padding-left: 40px; transition: .3s ease-out color }
.page1 .btn-tick.hide{display: none;}
.page1 .btn-tick i{position: absolute; left: 0; top: 10px;}
.page1 .btn-tick:hover{color: #ff4654;}

.page1 .btn-website{position: absolute; right: 40px; top: 40px; color: #ece7e1; height: 30px; border-bottom: 1px solid #ece7e1; font-size: 20px; z-index: 6;}
.page1 .btn-website:hover,.page1 .btn-bind-mob:hover,.page1 .btn-wegame:hover{color: #ff4654; border-bottom: 1px solid #ff4654;}
.page1 .btn-bind-mob,.page1 .btn-wegame{color: #ece7e1; height: 30px; border-bottom: 1px solid #ece7e1; font-size: 20px; text-shadow: 0 0 5px rgba(20,54,67,.83); display: inline-block; vertical-align: top; *zoom:1; *display: inline; margin: 0 200px;}
.page1 .btn-wegame{ margin-top: 18px;}
.page1 .btn-wegame.hide{display: none;}

.page2 .page-line{background: #5f222c; top: -48px; height: 120%; z-index: 2;}
.page2:after{content: ''; position: absolute; left: 50%; top: -48px; width: 1920px; height: 48px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/p2-after.png) no-repeat; margin-left: -960px;}
.page2 .main{padding-top: 296px;}
.page2 .title-box{left: 220px; top: 139px;}
.page2 .cell{width: 66px; height: 70px; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg-cell1.png); background: #fff; position: absolute; left: 2px; top: 143px;}
.page2 .line{width: 88px; height: 1px; background: #5f222c; position: absolute; left: 135px; top: 267px;}
.page2 .ani-logo1{position: absolute; left: -271px; top: 0;}
.page2 .rectangle1{position: absolute; left: -297px; top: 724px;}
.page2 .card-face-list{width: 950px; font-size: 0; text-align: center; float: left; display: inline; margin-left: -2px; position: relative;}
.page2 .card-face-list li{position: absolute;}
.page2 .card-face-list .card1{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/card1.png) 50% 0 no-repeat; background-size: cover;}
.page2 .card-face-list .card2{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/card2.png) 50% 0 no-repeat; background-size: cover;}
.page2 .card-face-list .card3{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/card3.png) 50% 0 no-repeat; background-size: cover;}
.page2 .card-face-list .card4{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/card4.png) 50% 0 no-repeat; background-size: cover;}
.page2 .card-face-list .card5{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/card5.png) 50% 0 no-repeat; background-size: cover;}
.page2 .card-face-list .card{width: 100%; height: 100%;}
.page2 .txt-box{float: right; width: 433px; margin-top: -8px; display: inline; position: relative;}
.page2 .rectangle-box{position: absolute; overflow: hidden; left: 0; top: 326px; width: 52px;}
.page2 .txt-box ul{font-size: 19px; line-height: 24px; text-align: justify; color: #ece7e1; height: 177px;}
.page2 .txt-box li{padding-left: 22px; position: relative; padding-bottom: 15px;}
.page2 .txt-box li span{font-weight: bold; color: #fff;}
.page2 .txt-box li i{position: absolute; left: 0; top: 10px;}

.page2 .btn-lottery{display: block; width: 100%;}
.page2 .btn-val-comm:after,.page2 .btn-val-comm:before{ border-color: #fff;}
.page2 .btn-val-comm .btn-main{ background: #0f1722;}
.page2 .btn-val-comm .btn-main:before{background: #fff;}
.page2 .btn-val-comm:hover .btn-main .txt{ color: #000;}
.page2 .btn-val-comm.gray:hover .btn-main .txt{color: #fff;}
.page2 .btn-val-comm .btn-main .txt:after{ background: #fff;}
.page2 .btn-val-comm:hover .btn-main .txt:after{ background: #000;}
.page2 .btn-val-comm.gray .btn-main,.page2 .btn-val-comm.gray .btn-main:before{ background: #616161;}
.page2 .btn-val-comm.gray .btn-main .txt:after,.page2 .btn-val-comm.gray:hover .btn-main .txt:after{background: #ff4654;}
.page2 .btn-val-comm.gray:after,.page2 .btn-val-comm.gray:before{border-color: #616161;}

.page2 .btn-share{position: absolute; width: 193px; height: 53px; right: 0; top: 304px;}
.page2 .btn-share:after,.page2 .btn-share:before{ border-color: #fff; height: 22px;}
.page2 .btn-share:hover:after,.page2 .btn-share:hover:before{height: 30px;}
.page2 .btn-share .btn-main{ background: #ece7e1;}
.page2 .btn-share .btn-main:before{background: #000;}
.page2 .btn-share .btn-main .txt{ color: #ff4654; line-height: 36px; font-size: 17px;}
.page2 .btn-share:hover .btn-main .txt{ color: #fff;}
.page2 .btn-share .btn-main .txt:after{ background: #000;}
.page2 .btn-share:hover .btn-main .txt:after{ background: #fff;}

.page3 .main{padding-top: 326px;}
.page3 .page-line{background: #676c6f;}
.page3:after{content: ''; width: 150px; height: 104px; background: #ece7e1; position: absolute; left: 50%; margin-left: -960px; bottom: 0; z-index: 3;}
.page3 .title-box{left: 0; top: 173px;}
.page3 .ani-logo2{position: absolute; left: -271px; top: 95px;}
.page3 .cell{width: 66px; height: 70px; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg-cell2.png); background: #ff4654; position: absolute; left: 1202px; top: 300px;}
.page3 .rectangle{width: 9px; height: 9px; background: #676c6f; position: absolute; left: -181px; top: 563px;}
.page3 .rectangle1{width: 9px; height: 9px; background: #ff4654; position: absolute; left: 1201px; top: 433px;}
.page3 .rectangle2{width: 9px; height: 9px; background: #ff4654; position: absolute; left: 1258px; top: 433px;}
.page3 .rule-list{ height: 187px;}
.page3 .rule-list li{font-size: 20px; line-height: 25px; color: #ece7e1; padding-left: 27px; position: relative; padding-bottom: 14px; width: 1145px; text-align: justify;}
.page3 .rule-list li i{position: absolute; left: 0; top: 8px;}
.page3 .rule-list li span{ color: #fff; font-weight: bold;}
.page3 .gift-box{height: 474px; position: relative;}
.page3 .gift-box .gift-tips{ color: #ff4654; font-size: 20px; line-height: 30px; position: absolute; left: 82px; top: -44px;}
.page3 .gift-box .skin{position: absolute; width: 1111px; height: 424px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/p3-skin.png) no-repeat; left: 81px; top: -10px;}
.page3 .btn-video{position: absolute; right: 0; bottom: 14px; width: 68px; height: 69px; border: 1px solid #fff; overflow: hidden; background: #ff4654;}
.page3 .btn-video:before{ content: ''; position:absolute;top:0;left:-10px;z-index:2;width:140%;height:100%;background-color:#0f1923; -webkit-transition: -webkit-transform .3s ease-in-out; transition: transform .3s ease-in-out; -webkit-transform:skew(-10deg) translateX(-100%);transform:skew(-10deg) translateX(-100%);}
.page3 .btn-video:hover:before{-webkit-transform: translateX(0) skew(-10deg);transform: translateX(0) skew(-10deg)}
.page3 .btn-video:after{content: ''; width: 4px; height: 4px; position: absolute; right: 0; bottom: 0; background: #fff; z-index: 3;}
.page3 .btn-video i{position: absolute; left: 50%; top: 50%; margin-top: -26px; margin-left: -26px; z-index: 3;}
.page3 .gif{width: 300px; height: 300px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/p3-gif.png) no-repeat; position: absolute; left: 129px; top: 41px;}

.page3 .recruit-box{position: relative; width: 322px; margin: 0 auto;}
.page3 .recruit-box.hide-btn{height: 75px; width: 100%; margin: 30px 0;}
.page3 .recruit-box .btn-recruit{display: block; margin: 30px 0 60px;}
.page3 .recruit-box.hide-btn .btn-recruit{display: none;}
.page3 .recruit-box .btn-recruit.hide{display: none;}
.page3 .recruited-box{min-height: 80px;}
.page3 .recruited-box.hide-btn .btn-recruit{display: none;}
.page3 .recruit-box .num-box{position: absolute; left: 350px; top: 50%; margin-top: -41px; width: 200px;}
.page3 .recruit-box.hide-btn .num-box{ width: 100%; position: static; width: 100%; font-size: 0; text-align: left;}
.page3 .recruit-box.hide-btn .num-box a{display: inline-block; vertical-align: top; *zoom:1; *display: inline; position: static; margin-right: 40px;}
.page3 .recruit-box .num-box.change-btn0{left: -473px; top: 810px;}
.page3 .recruit-box .num-box.change-btn1{left: -473px;  top: 11px;}
.page3 .recruit-box .num-box a{font-size: 24px; line-height: 41px; color: #ece7e1; border-bottom: 1px solid #ece7e1; white-space: nowrap;}
.page3 .recruit-box .num-box a span{margin-left: 10px;}
.page3 .recruit-box .num-box a.hide{display: none;}
.page3 .recruit-box .num-box a:hover{ color: #f3434d; border-bottom: 1px solid #f3434d;}


.page3 .hide{display: none;}
.page3 .fleet-num{height: 41px; position: relative; overflow: hidden; z-index: 3;}
.page3 .fleet-num p{color: #ece7e1; font-size: 24px; line-height: 41px; float: left; display: inline; min-width: 230px;}
.page3 .fleet-num p span{margin-left: 10px;}
.page3 .fleet-num a{float: left; display: inline; margin-top: 6px;}
.page3 .fleet-num a:hover{-webkit-filter: brightness(1.2); filter: brightness(1.2);}
.page3 .my-fleet-list{font-size: 0; text-align: center; margin-top: -17px; width: 120%; margin-left: -10%; height: 670px;}
.page3 .my-fleet-list li{display: inline-block; vertical-align: top; *zoom:1; *display: inline; margin: 0 20px; position: relative;}
.page3 .car-box{position: relative; margin: 0 auto;}
.page3 .my-fleet-list .car1,.page3 .my-fleet-list .car5{width: 202px; padding-top: 75px;}
.page3 .my-fleet-list .car2,.page3 .my-fleet-list .car4{width: 220px; padding-top: 54px;}
.page3 .my-fleet-list .car3{width: 268px;}
.page3 .my-fleet-list .avatar-box{ position: absolute; left: 50%; top: 50%; overflow: hidden; transform: translate(-50%,-66%); border-radius:50%; display: none;}
.page3 .my-fleet-list .on .avatar-box{display: block;}
.page3 .my-fleet-list .avatar-box img{width: 100%; height: 100%;}
.page3 .my-fleet-list .car1 .avatar-box{width: 140px; height: 140px; box-shadow: 0 0 26px #ffb376; border: 2px solid #ffb376;}
.page3 .my-fleet-list .car2 .avatar-box{width: 158px; height: 158px; box-shadow: 0 0 26px #41a4d3; border: 2px solid #41a4d3;}
.page3 .my-fleet-list .car3 .avatar-box{width: 194px; height: 194px; box-shadow: 0 0 26px #f3434d; border: 2px solid #f3434d;}
.page3 .my-fleet-list .car4 .avatar-box{width: 158px; height: 158px; box-shadow: 0 0 26px #2ae2a7; border: 2px solid #2ae2a7;}
.page3 .my-fleet-list .car5 .avatar-box{width: 140px; height: 140px; box-shadow: 0 0 26px #e037ff; border: 2px solid #e037ff;}
.page3 .my-fleet-list .btn-add{position: absolute; top: 50%; margin-top: -39px; margin-left: -39px; left: 50%;}
.page3 .my-fleet-list .btn-add i{display: block; opacity: 0; transition: .3s ease-out opacity;}
.page3 .my-fleet-list .btn-add:hover i{opacity: 1;}
.page3 .my-fleet-list .on .btn-add{display: none;}
.page3 .my-fleet-list .name{font-size: 17px; color: #11171d; line-height: 32px; text-align: center; position: absolute; left: 50%; top: 50%; transform: translateX(-50%); display: none;}
.page3 .my-fleet-list li.on .name{display: block;}
.page3 .my-fleet-list .name strong{display: block; color: #ece7e1; font-size: 17px; line-height: 24px; font-weight: normal;}
.page3 .my-fleet-list .name span{display: block;}
.page3 .my-fleet-list .car1 .name,.page3 .my-fleet-list .car5 .name{margin-top: 75px; padding: 0 40px;}
.page3 .my-fleet-list .car2 .name,.page3 .my-fleet-list .car4 .name{margin-top: 87px; padding: 0 50px;}
.page3 .my-fleet-list .car3 .name{ margin-top: 110px; padding: 0 70px;}
.page3 .recruited-box .btn-recruit{ margin: 0 auto; display: block; width: 322px;}

.page3 .friend-fleet-list{width: 1268px; height: 247px; font-size: 0; text-align: center; padding-top: 37px; margin-top: 18px; position: relative;}
.page3 .friend-fleet-list:after{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 416px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/v1-friend-fleet-bg.png) no-repeat; pointer-events: none;}
.page3 .hide-btn .friend-fleet-list:after{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 247px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/friend-fleet-bg.png) no-repeat; pointer-events: none;}
.page3 .friend-fleet-list li{display: inline-block; vertical-align: top; *zoom:1; *display: inline; width: 234px; position: relative;}
.page3 .friend-fleet-list i{position: absolute; left: 50%; margin-left: -70px; top: -6px; opacity: 0; transition: .3s ease-out opacity;}
.page3 .friend-fleet-list .round2,.page3 .friend-fleet-list .on .round1,.page3 .friend-fleet-list li:hover .round1{opacity: 1;}
.page3 .friend-fleet-list .on .round2,.page3 .friend-fleet-list li:hover .round2{opacity: 0;}
.page3 .friend-fleet-list .avatar-box{width: 128px; height: 128px; margin: 0 auto 17px; border-radius:50%; overflow: hidden; position: relative; border: 2px solid #545a5f;}
.page3 .friend-fleet-list .on .avatar-box{border-color: #f3434d;}
.page3 .friend-fleet-list .avatar-box img{width: 100%; display: none;}
.page3 .friend-fleet-list .on .avatar-box img{display: block;}
.page3 .friend-fleet-list .name{ color: #ece7e1; opacity: 0; font-size: 17px; line-height: 30px;}
.page3 .friend-fleet-list .on .name{opacity: .4;}
.page3 .friend-fleet-list a{width: 100%; height: 100%; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/add.png) 50% 50% no-repeat; display: block; background-size: 130px 130px; transition: .3s ease all;}
.page3 .recruited-box.hide-btn .friend-fleet-list a,.page3 .recruited-box.hide-btn .my-fleet-list .btn-add{ display: none;}
.page3 .recruited-box.hide-btn .friend-fleet-list,.page3 .recruited-box.hide-btn .my-fleet-list .btn-add{pointer-events: none;}
.page3 .friend-fleet-list li:hover a{ background-size: 260px 260px;}
.page3 .friend-fleet-list li:hover .avatar-box{border-color: #f3434d;}
.page3 .friend-fleet-list li:hover .round1{opacity: 1;}
.page3 .friend-fleet-list.nobody a{display: none;}
.page3 .friend-fleet-list.nobody li:hover .round1{opacity: 0;}
.page3 .friend-fleet-list.nobody li:hover .round2{opacity: 1;}
.page3 .friend-fleet-list.nobody li:hover .avatar-box{border-color: #545a5f; }

.swiper-container{position: relative; overflow: hidden;}
.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;}
.swiper-container-vertical>.swiper-wrapper {-webkit-box-orient: vertical;-moz-box-orient: vertical;-ms-flex-direction: column;-webkit-flex-direction: column;flex-direction: column;}
.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform; overflow: hidden;}
.swiper-invisible-blank-slide{visibility:hidden}

.page4 .page-line{background: #676c6f;}
.page4:after{content: ''; width: 350px; height: 20px; background: #ff4654; left: 50%; bottom: 0; position: absolute; margin-left: 616px; z-index: 2;}
.page4 .title-box{left: -4px; top: 141px;}
.page4 .rectangle1{ width: 20px; height: 20px; background: #676c6f; position: absolute; left: -258px; top: 83px;}
.page4 .rectangle2{width: 9px; height: 9px; background: #ff4654; position: absolute; left: -181px; top: 690px;}
.page4 .logo1{width: 1735px; height: 250px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg-logo1.png) no-repeat; top: 1010px; position: absolute; left: -144px;}
.page4 .main{padding-top: 330px;}
.page4 .sw-wrapper{position: relative; height: 680px;}
.page4 .swiper-container{position: absolute; width: 1041px; left: 50%; margin-left: -521px; top: 0; height: 583px;}
.page4 .swiper-container:after{content: ''; position: absolute; bottom: 0; right: -12px; background: #ff4654; width: 12px; height: 356px;}
.page4 .swiper-container .swiper-videobox{width: 100%; height: 100%; background: #000;}

.page4 .btn-play{display: none;}

.page4 .riot-games{display: none;}

.page5 .page-line{background: #676c6f;}
.page5 .main{padding-top: 306px; height: 100%;}
.page5 .title-box{left: 854px; top: 128px;}
.page5 .mask-box{width: 1617px; height: 714px; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/p5-mask.png); position: absolute; bottom: 47px; left: -58px; pointer-events: none;}
.page5 .mask-box p{ background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg-logo2.png) no-repeat; width: 1600px; height: 230px; position: absolute; bottom: -119px; left: -109px;}
.page5:after{content:"";width: 294px; height: 22px; position: absolute; left: 50%; margin-left: -960px; bottom: -1px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/p5-after.png) no-repeat;}
.page5 .ani-logo1{position: absolute; left: -271px; top: 16px;}
.page5 .rectangle{width: 9px; height: 9px; background: #5f222c; position: absolute; left: -181px; top: 298px;}
.page5 .line{position: absolute; height: 1px; width: 120px; background: #ece7e1; top: 214px; left: 496px;}
.page5 .role{width: 819px; height: 945px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/p5-role.png) no-repeat; position: absolute; left: 50%; margin-left: -961px; top: -133px; pointer-events: none;}
.page5 .follow-list{font-size: 0; text-align: center; padding-left: 374px;}
.page5 .follow-list li{height: 360px; display: inline-block; vertical-align: top; *zoom:1; *display: inline; width: 170px; position: relative; text-align: center; padding-top: 230px; margin-left: 120px;}
.page5 .code-box{width: 212px; height: 202px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/p5-bg1.png) no-repeat; padding-top: 19px; position: absolute; left: 50%; margin-left: -106px; top: -220px; transform: translateY(50px); opacity: 0; transition: .3s ease all; pointer-events: none;}
.page5 .code-box p{width: 164px; height: 164px; margin: 0 auto;}
.page5 .code-box .code1{background: url(//game.gtimg.cn/images/val/act/a20230301act/ewm1.png) no-repeat; background-size: 100% 100%;}
.page5 .code-box .code2{background: url(//game.gtimg.cn/images/val/act/a20230301act/ewm3.png) no-repeat; background-size: 100% 100%;}
.page5 .code-box .code3{background: url(//game.gtimg.cn/images/val/act/a20230301act/ewm2.png) no-repeat; background-size: 100% 100%;}
.page5 .icon-box:hover .code-box{opacity: 1; transform: translateY(0);}
.page5 .icon-box{width: 172px; height: 172px; position: absolute; left: 50%; margin-left: -86px; bottom: 164px;}
.page5 .icon-box .plus{position: absolute; right: 7px; bottom: 7px;z-index: 4;}
.page5 .round3{ position: absolute; left: 50%; margin-left: -98px; top: 12px; pointer-events: none;}
.page5 .icon1{background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/iocon1.png) no-repeat;}
.page5 .icon2{background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/iocon2.png) no-repeat;}
.page5 .icon3{background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/iocon3.png) no-repeat; width: 173px;}
.page5 .icon4{background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/iocon4.png) no-repeat; height: 184px;}
.page5 .follow-list p{font-size: 18px; line-height: 30px; color: #ece7e1;}
.page5 .follow-list h3{font-size: 18px; line-height: 30px; color: #ece7e1; font-weight: normal; width: 120%; margin-left: -10%; height: 43px;}
.page5 .follow-list a{display: block;}

.page6 .main{padding-top: 304px;}
.page6 .page-line{background: #676c6f;}
.page6 .title-box{top: 113px; left: 0;}
.page6 .ani-logo3{position: absolute; left: -271px; top: 52px;}
.page6 .rectangle{width: 9px; height: 9px; background: #ff4654; position: absolute; left: -181px; top: 704px;}
.page6 .rectangle-box{position: absolute; overflow: hidden; top: 845px; left: 0;}
.page6 .rectangle-box i{display: block;}
.page6 .cell2{width: 66px; height: 70px; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg-cell2.png); background: #8f9292; position: absolute; left: 634px; top: 54px;}
.page6 .cell1{width: 66px; height: 70px; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg-cell1.png); background: #8f9292; position: absolute; left: -136px; top: 850px;}
.page6 .scrollbar-box{height: 440px; overflow-y: auto; scrollbar-width:none}
.page6 .scrollbar-box::-webkit-scrollbar {width:2px;height:2px;}
.page6 .scrollbar-box::-webkit-scrollbar-track-piece {background-color:transparent;}
.page6 .scrollbar-box::-webkit-scrollbar-thumb {background-color:transparent;}
.page6 .rule-list li{padding-bottom: 36px; text-align: justify; width: 750px;}
.page6 .rule-list h4{ position: relative; padding-left: 24px; color: #13181f; font-size: 25px; line-height: 36px; font-weight: normal;}
.page6 .rule-list .ornament{position: absolute; left: 0; top: 13px;}
.page6 .rule-list p{ color: #676c6f; font-size: 21px; padding-left: 24px; line-height: 34px;}
.page6 .rule-list p a{ color: #676c6f; text-decoration: underline; white-space: nowrap; transition: .3s ease-out color;}
.page6 .rule-list p a:hover{color: #ff4654;}
.page6 .btn-rule{position: absolute; color: #ff4654; font-size: 20px; line-height: 30px; z-index: 8; left: 0; top: 242px; padding-right: 18px;transition: .3s ease-out color;}
.page6 .btn-rule i{position: absolute; right: 0; top: 50%; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/btn-rule.png) no-repeat; width: 12px; height: 19px; margin-top: -8px; background-color: #ff4654; transition: .3s ease-out background-color;}
.page6 .btn-rule:hover{ color: #000;}
.page6 .btn-rule:hover i{background-color: #000;}
.page6 .guide{position: absolute; top: 760px; left: 0; z-index: 3;}


.dia{display: none; outline: none;}
.dia,.dia *{-webkit-box-sizing: border-box; box-sizing: border-box;}
.dia .btn-close{position: absolute; right: -30px; top: -30px; -webkit-transition: .3s ease all; transition: .3s ease all;}
.dia .btn-close:hover{-webkit-transform: rotate(90deg); transform: rotate(90deg);}

.dia-video,.video-box{width:1000px;height:560px;box-sizing: content-box;}
.dia-video{border: 2px solid #ff4654;}

.dia-spr{ background:url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-spr.png) no-repeat;}
.dia-spr.btn-close{ width:28px; height:28px; background-position:-1727px -0px;}
.dia-spr.btn-comm1{ width:250px; height:103px; background-position:-1477px -0px;}
.dia-spr.btn-comm2{ width:459px; height:103px; background-position:-1018px -0px;}
.dia-spr.input{ width:509px; height:77px; background-position:-0px -0px;}
.dia-spr.tel{ width:509px; height:77px; background-position:-509px -0px;}


.dia .btn-val-comm{height: 103px;}
.dia .btn-main .txt{line-height: 86px;}
.dia .btn-val-comm:after,.dia .btn-val-comm:before{ border-color: #fff;}
.dia .btn-val-comm .btn-main{ background: #0f1722;}
.dia .btn-val-comm .btn-main:before{background: #fff;}
.dia .btn-val-comm:hover .btn-main .txt{ color: #000;}
.dia .btn-val-comm.gray:hover .btn-main .txt{color: #fff;}
.dia .btn-val-comm .btn-main .txt:after{ background: #fff;}
.dia .btn-val-comm:hover .btn-main .txt:after{ background: #000;}
.dia .btn-val-comm.gray .btn-main,.dia .btn-val-comm.gray .btn-main:before{ background: #616161;}
.dia .btn-val-comm.gray .btn-main .txt:after,.dia .btn-val-comm.gray:hover .btn-main .txt:after{background: #ff4654;}
.dia .btn-val-comm.gray:after,.dia .btn-val-comm.gray:before,.dia .btn-val-comm.gray:hover:after,.dia .btn-val-comm.gray:hover:before{border-color: #616161;}
.dia .btn-val-comm:before,.dia .btn-val-comm:after{ height: 46px;}
.dia .btn-val-comm:hover:before,.dia .btn-val-comm:hover:after{ height: 60px;}


.dia-tips{width: 642px; height: 590px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg1.png) no-repeat; padding-top: 125px;}
.dia-tips .tips-box{font-size: 30px; line-height: 63px; color: #ece7e1; text-align: center; height: 288px; display:flex; display:-webkit-flex; align-items:center; justify-content:center;}
.dia .btn-comm2{ margin: 0 auto; width: 459px; display: block;}
.dia .comm-tips{ padding: 0 50px;}

.dia .btn-box{font-size: 0; text-align: center; width: 140%; margin-left: -20%;}
.dia .btn-box a{display: inline-block; vertical-align: top; *zoom:1; *display: inline; margin: 0 6px; width: 250px;}

.dia-bind{width: 642px; height: 750px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg2.png) no-repeat; padding: 165px 66px 0;}
.dia-bind .congrats{ color: #ece7e1; font-size: 60px; font-weight: bold; line-height: 80px;}
.dia-bind .congrats-tip{ color: #dbd7d0; font-size: 21px; line-height: 33px; display: none;}
.dia-bind .congrats-tips{ color: #ece7e1; font-size: 24px; line-height: 35px;}
.dia-bind .input-list{margin-top: 35px; height: 234px; overflow: hidden;}
.dia-bind .input-list li{position: relative; margin-bottom: 35px; padding-left: 174px; padding-top: 8px; padding-right: 8px;}
.dia-bind .input-list .input-tips{position: absolute; left: 0; top: 0; color: #0f1722; text-align: right; font-size: 24px; line-height: 77px; width: 140px;}
.dia-bind .input-list input{width: 100%; height: 58px; display: block; line-height: 58px; color: #0f1722; font-size: 24px; border: none; background: transparent; outline: none;}
.dia-bind .input-list .code-box{width: 146px; right: 13px; top: 14px; height: 49px; position: absolute; text-align: center; line-height: 49px; font-size: 18px; }
.dia-bind .input-list .code-box p{width: 100%; height: 100%; background: #d4d0d0; color: #0f1722;}
.dia-bind .input-list .code-box a{width: 100%; height: 100%; background: #d4d0d0; position: absolute; left: 0; top: 0; color: #0f1722;}
.dia-bind .input-list .code-box a.hide{display: none;}
.dia-bind .input-list .code-box a:hover{background: #000; color: #fff;}

.dia-bind-small{height: 590px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg1.png) no-repeat; padding-top: 116px;}
.dia-bind-small .input-list li{margin-bottom: 35px;}
.dia-bind-small .input-list{height: 224px;}
.dia-bind-small .congrats{display: none;}
.dia-bind .small-show,.dia-bind-small .congrats-tip{display: none;}
.dia-bind-small .small-show{display: inline;}



.dia-tips .cancel-tips{text-align: center; color: #ece7e1; font-size: 30px; line-height: 40px; padding-top: 85px;}
.dia-tips .tel{margin: 20px auto 68px; color: #ece8e0; font-size: 30px; line-height: 80px; height: 80px; text-align: center;}


.dia-gift{width: 642px; height:910px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg3.png) no-repeat; padding-top: 150px;}
.dia-gift2{width: 642px; height:1010px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg4.png) no-repeat; padding-top: 150px;}
.dia-gift .btn-close,.dia-invite .btn-close{top: 0;}
.dia .gift-box{width: 177px; height: 351px; margin: 0 auto; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-gift1.png) no-repeat;}

.dia-gift .gift-congrats{ color: #ece7e1; font-size: 30px; line-height: 46px; width: 550px; margin: 35px auto; text-align: center;}
.dia-gift .gift-congrats span{font-weight: bold;}
.dia-gift2 .gift-tips{width: 550px; text-align: center; font-size: 30px; line-height: 46px; color: #ece7e1; margin: 0 auto;}
.dia-gift2 .gift-tips1{margin-top: 43px; font-size: 21px; line-height: 30px; opacity: .8;}
.dia-gift2 .gift-tips2{margin-top: 14px; margin-bottom: 52px;}
.dia-gift2 .gift-tips2 span{font-weight: bold;}

.dia-invite{width: 642px; height:910px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg3.png) no-repeat; padding-top: 147px;}
.dia-invite .invite-gift{width: 574px; height: 299px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-gift2.png) 50% 50% no-repeat; background-size: contain; margin: 0 auto;}
.dia-invite .invite-tips{ color: #ece7e1; font-size: 30px; line-height: 37px; width: 536px; margin: 34px auto 0; text-align: center;}
.dia-invite .invite-tips span{color: #fff;}
.dia-invite .invite-tip span{font-weight: bold; color: #fff}
.dia-invite .invite-tip{font-size: 22px; line-height: 33px; color: #ece7e1; width: 536px; margin: 16px auto 46px; text-align: center;}

.dia-invite-guest{width: 642px; height:813px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg5.png) no-repeat; padding-top: 147px;}
.dia-invite-guest-big{padding-top: 135px; height: 910px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg3.png) no-repeat;}
.dia-invite-guest .invite-gift{width: 574px; height: 299px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-gift2.png) 50% 50%  no-repeat; background-size: contain; margin: 0 auto;}
.dia-invite-guest-big .invite-gift{height: 437px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-gift3.png) 50% 50% no-repeat; background-size: contain;}
.dia-invite-guest .invite-tips{ color: #ece7e1; font-size: 30px; line-height: 37px; width: 536px; margin: 14px auto 0; text-align: center;}
.dia-invite-guest .invite-tip{font-size: 22px; line-height: 33px; color: #ece7e1; width: 536px; margin: 16px auto 46px; text-align: center;}
.dia-invite-guest-big .invite-tip{margin-bottom: 30px;}
.dia-invite-guest .invite-tip span{font-weight: bold; color: #fff;}
.dia-invite-guest .invite-tips span{ color: #fff}


.create-box{position: absolute; top: 0; width: 1165px; height: 670px; z-index: 99; left: -1500px; overflow: hidden;}

.create101{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg101.png) no-repeat;}
.create102{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg102.png) no-repeat;}
.create103{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg103.png) no-repeat;}
.create104{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg104.png) no-repeat;}
.create105{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg105.png) no-repeat;}
.create106{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg106.png) no-repeat;}
.create107{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg107.png) no-repeat;}
.create108{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg108.png) no-repeat;}
.create109{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg109.png) no-repeat;}
.create110{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg110.png) no-repeat;}
.create111{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg111.png) no-repeat;}
.create112{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg112.png) no-repeat;}

.create201{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg201.png) no-repeat;}
.create202{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg202.png) no-repeat;}
.create203{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg203.png) no-repeat;}
.create204{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg204.png) no-repeat;}
.create205{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg205.png) no-repeat;}
.create206{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg206.png) no-repeat;}
.create207{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg207.png) no-repeat;}
.create208{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg208.png) no-repeat;}
.create209{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg209.png) no-repeat;}
.create210{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg210.png) no-repeat;}
.create211{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg211.png) no-repeat;}
.create212{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg212.png) no-repeat;}

.create301{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg301.png) no-repeat;}
.create302{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg302.png) no-repeat;}
.create303{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg303.png) no-repeat;}
.create304{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg304.png) no-repeat;}
.create305{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg305.png) no-repeat;}
.create306{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg306.png) no-repeat;}
.create307{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg307.png) no-repeat;}
.create308{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg308.png) no-repeat;}
.create309{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg309.png) no-repeat;}
.create310{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg310.png) no-repeat;}
.create311{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg311.png) no-repeat;}
.create312{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/c-bg312.png) no-repeat;}

.create-box.style1 .propaganda{position: absolute; width: 540px; height: 220px; left: 64px; top: 307px;}
.style1 .propaganda1{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p101.png) no-repeat;}
.style1 .propaganda2{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p102.png) no-repeat;}
.style1 .propaganda3{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p103.png) no-repeat;}
.style1 .propaganda4{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p104.png) no-repeat;}
.style1 .propaganda5{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p105.png) no-repeat;}
.style1 .propaganda6{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p106.png) no-repeat;}

.create-box.style2  .propaganda{position: absolute; width: 620px; height: 180px; left: 66px;}
.style2 .propaganda1{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p201.png) no-repeat; top: 74px;}
.style2 .propaganda2{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p202.png) no-repeat; top: 30px;}
.style2 .propaganda3{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p203.png) no-repeat; top: 28px;}
.style2 .propaganda4{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p204.png) no-repeat; top: 29px;}
.style2 .propaganda5{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p205.png) no-repeat; top: 35px;}
.style2 .propaganda6{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p206.png) no-repeat; top: 25px;}

.create-box.style3  .propaganda{position: absolute; width: 630px; height: 200px; left: 480px;}
.style3 .propaganda1{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p301.png) no-repeat; top: 107px;}
.style3 .propaganda2{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p302.png) no-repeat; top: 50px;}
.style3 .propaganda3{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p303.png) no-repeat; top: 58px;}
.style3 .propaganda4{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p304.png) no-repeat; top: 67px;}
.style3 .propaganda5{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p305.png) no-repeat; top: 113px;}
.style3 .propaganda6{ background: url(//game.gtimg.cn/images/val/act/a20230301act/create/p306.png) no-repeat; top: 44px;}

.create-box .img-box{width: 120px; height: 120px; position: absolute; right: 49px; bottom: 58px;}
.create-box.style2 .img-box{right: 20px; bottom: 20px;}
.create-box.style3 .img-box{right: 1022px; bottom: 48px;}
.create-box .img-box img{display: block; width: 100%;}
.create-box .nickname{position: absolute; left: 66px; bottom: 56px; color: #ede6de; font-size: 30px; line-height: 40px; }
.create-box.style2 .nickname{ color: #ff4655; bottom: 418px;}
.create-box.style3 .nickname{ color: #ff4655; bottom: 374px; left: 480px;}

.dia-create{height: 780px; width: 1165px;}
.dia-create .img-box{width: 100%; height: 670px;}
.dia-create .img-box img{display: block; width: 100%;}
.dia-create .btn-box{padding-top: 34px;}
.dia-create .btn-box a{width: 324px; height: 78px; margin: 0 64px;}
.dia-create .btn-val-comm:before, .dia-create .btn-val-comm:after{ border-color: #798283; height: 30px;}
.dia-create .btn-val-comm .btn-main{background: #ff4654;}
.dia-create .btn-val-comm .btn-main:before{background: #000;}
.dia-create .btn-val-comm .btn-main .txt{line-height: 61px;}
.dia-create .btn-val-comm:hover .btn-main .txt{color: #fff;}
.dia-create .btn-val-comm:hover .btn-main .txt:after{ background: #ff4654;}
.dia-create .create-tips{display: none;}

.dia-tips h3{ color: #ece7e1; font-size: 60px; line-height: 80px; padding:30px 60px 20px; font-weight: bold;}
.dia-tips h4{ color: #ece7e1; font-size: 24px; line-height: 35px; font-weight: normal; padding:0 60px; text-align: justify; height: 150px;}

.wrapper img.dom2img-result{display: none;}
.h5-show{display: none;}


.page6 .guide{ -webkit-animation: btnarrow .6s ease-in infinite alternate; animation: btnarrow .6s ease-in infinite alternate;}
.page6 .guide.hide{display: none; -webkit-animation: none; animation: none;}
@-webkit-keyframes btnarrow{0%{-webkit-transform:translateY(0)}100%{-webkit-transform:translateY(20px)}}
@keyframes btnarrow{0%{transform:translateY(0)}100%{transform:translateY(20px)}}

.channel-box{position: absolute; left: 60px; top: 24px; z-index: 3;}
.channel-box i{display: block; width: 144px; height: 40px;}
.channel-box .channel-1021{ background: url(//game.gtimg.cn/images/val/act/a20230301act/adtag/pc-1021.png) 0 50% no-repeat; }
.channel-box .channel-1033{ background: url(//game.gtimg.cn/images/val/act/a20230301act/adtag/pc-1033.png) 0 50%  no-repeat;}
.channel-box .channel-1034{ background: url(//game.gtimg.cn/images/val/act/a20230301act/adtag/pc-1034.png) 0 50%  no-repeat;}
.channel-box .channel-1050{ background: url(//game.gtimg.cn/images/val/act/a20230301act/adtag/pc-1050.png) 0 50%  no-repeat;}


.honour-box{position: absolute; left: 0; top: -999px; background: url(//game.gtimg.cn/images/val/act/a20230301act/create/v1-honour.jpg) no-repeat; width: 1200px; height: 674px; z-index: -9;}
.honour-box .honour-name{position: absolute; left: 620px; bottom: 40px; width: 230px; height: 35px; line-height: 35px; text-align: center; color: #ece7e1; font-size: 24px;}


.loading-mask{position: fixed; left: 0; top: 0; bottom: 0; right: 0; background: rgba(0,0,0,.7); z-index: 100010; display: none;}
.loading-mask.show{display: block;}
.loading-mask .loading-main{position: absolute; left: 0; top: 50%; height: 120px; width: 100%; margin-top: -60px;}
.loading-mask .loading-main i{ display: block; width: 68px; height: 68px; margin: 0 auto; background: url(//game.gtimg.cn/images/val/act/a20230301act/loading.png) no-repeat;}
.loading-mask.show .loading-main i{ -webkit-animation: rotation 3s linear infinite; nimation: rotation 3s linear infinite;} 
.loading-mask .loading-main p{font-size: 20px; line-height: 50px; text-align: center; color: #fff;}

@-webkit-keyframes rotation {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes rotation {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

@media only screen and (max-width: 1700px){.page1 .main-box{margin-left: 0; left: auto; right: -26px;}}



.dia-rule{width: 642px; height:910px; background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/dia-bg3.png) no-repeat; padding-top: 150px; color: #ece7e1;}
.dia-rule .scrollbar-box{width: 550px; margin: 0 auto; height: 700px; overflow-y: auto; padding-right: 20px;}
.dia-rule .scrollbar-box::-webkit-scrollbar {width:3px;height:3px;}
.dia-rule .scrollbar-box::-webkit-scrollbar-track-piece {background-color:rgba(236,231,225,0);}
.dia-rule .scrollbar-box::-webkit-scrollbar-thumb {background-color:rgba(236,231,225,.5);}
.dia-rule li{padding-bottom: 30px; text-align: justify;}
.dia-rule h5{ font-size: 28px; font-weight: bold; line-height: 40px; text-indent: -.5em;}
.dia-rule h6{ font-size: 22px; font-weight: bold; line-height: 30px; padding-top: 10px;}
.dia-rule p{ font-size: 22px; line-height: 32px; padding-top: 6px;}

.dia-gift .btn-close,.dia-gift2 .btn-close,.dia-invite .btn-close,.dia-invite-guest-big .btn-close,.dia-rule .btn-close{ top: 0;}

.page1 .btn-video{-webkit-animation: aniZoom 1.5s infinite; animation: aniZoom 1.5s infinite;}
@keyframes aniZoom{50%{transform: scale(1.2);}}

.wegame-mask{position: fixed; top:0; left: 0; width: 100%; height: 100%; z-index: 10001; display: none;}
.wegame-box{position: absolute; top:0; width: 500px; padding-bottom: 15px; left: 50%; margin-left: -250px; background: #fff;  border-radius:5px;}
.wegame-box p{font-size: 18px; color: #333; line-height: 30px; text-align: center; padding-top: 5px;}
.wegame-box .btn-box{font-size: 0; text-align: center; padding-top: 10px;}
.wegame-box .btn-box a{display: inline-block; vertical-align: top; *zoom:1; *display: inline; background: #1a73e8; color: #fff; font-size: 16px; width: 100px; line-height: 30px; margin: 0 10px; border-radius:5px;}
.wegame-box .btn-box a:hover{-webkit-filter: brightness(1.1); filter: brightness(1.1);}

/*2023年6月12日 新增*/
.page1 .btn-bind-mob{display: none;}
.dia-gift .extract-box{width: 177px; height: 410px; margin: 0 auto;}
.dia-gift .extract-box img{width: 100%;}
.dia-invite-guest .receive-tips{ color: #ece7e1; font-size: 30px; line-height: 37px; width: 536px; margin: 35px auto; text-align: center;}
.dia-invite-guest .receive-tips span{color: #fff;}


.guide-spr,.page3 .my-fleet-list .complete-guidance{ background:url(//game.gtimg.cn/images/val/act/a20230301act/pc/v1-guide.png) no-repeat;}
.guide-spr.guide1,.page3 .my-fleet-list .car1 .complete-guidance,.page3 .my-fleet-list .car5 .complete-guidance{ width:232px; height:71px; background-position:-0px -163px;}
.guide-spr.guide2,.page3 .my-fleet-list .car2 .complete-guidance,.page3 .my-fleet-list .car4 .complete-guidance{ width:246px; height:74px; background-position:-0px -89px;}
.guide-spr.guide3,.page3 .my-fleet-list .car3 .complete-guidance{ width:300px; height:89px; background-position:-0px -0px;}
.guide-spr.guide4{ width:170px; height:67px; background-position:-246px -89px;}
.guide-spr.guide5{ width:232px; height:71px; background-position:-232px -163px;}


.page3 .my-fleet-list .complete-guidance{position: absolute; display: none;}
.page3 .my-fleet-list .complete-guidance.show{display: block;}
.page3 .car1 .complete-guidance,.page3 .car5 .complete-guidance{ top: 46px; left: -6px;}
.page3 .car2 .complete-guidance,.page3 .car4 .complete-guidance{ top: 46px; left: -8px;}
.page3 .car3 .complete-guidance{ top: 56px; left: -10px;}


.page3 .friend-fleet-list .guide-box{ width: 232px; position: absolute; left: 50%; margin-left: -116px; bottom: 22px; height: 71px; justify-content:center; z-index: 3; display: none;}
.page3 .friend-fleet-list .show-guide .guide-box{ display:flex; display:-webkit-flex; align-items:center;}
.page3 .friend-fleet-list .guide5,.page3 .friend-fleet-list .guide-box:hover .guide4{ display: none;}
.page3 .friend-fleet-list .guide4,.page3 .friend-fleet-list .guide-box:hover .guide5{ display: block;}

.page3 #friend-recruitedBox{padding-bottom: 169px;}
.page3 .friend-fleet-list .show-guide .avatar-box,.page3 .friend-fleet-list .show-guide:hover .avatar-box{border-color: #66e5da;}


.v7-spr,.page7 .swiper-container:after{ background:url(//game.gtimg.cn/images/val/act/a20230301act/pc/v7-spr.png) no-repeat;}
.v7-spr.btn-next-i{ width:54px; height:32px; background-position:-829px -0px;}
.v7-spr.btn-next{ width:46px; height:46px; background-position:-783px -0px;}
.v7-spr.btn-prev-i{ width:54px; height:32px; background-position:-829px -32px;}
.v7-spr.btn-prev{ width:46px; height:46px; background-position:-783px -46px;}
.v7-spr.decorate,.page7 .swiper-container:after{ width:139px; height:93px; background-position:-644px -0px;}
.v7-spr.tit{ width:644px; height:103px; background-position:-0px -0px;}


.page7{background: url(//game.gtimg.cn/images/val/act/a20230301act/pc/v1-bg7.jpg) 50% 0 no-repeat; height: 952px; position: relative; z-index: 4;display: none;}
.page7 .main{padding-top: 258px;}
.page7 .cell{width: 66px; height: 70px; -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/bg-cell1.png); background: #fff; position: absolute; left: 2px; top: 83px;}
.page7 .ani-logo1{position: absolute; left: -271px; top: -47px;}
.page7 .title-box{left: 595px; top: 121px;}
.page7 .sw-wrapper{width: 1197px; height: 497px; margin: 0 auto; position: relative; padding-left: 26px;}
.page7 .sw-wrapper:before{content:""; width: 1044px; height: 412px; background: #ece7e1; position: absolute; left: 20px; top: -6px;}
.page7 .swiper-container{ -webkit-mask: url(//game.gtimg.cn/images/val/act/a20230301act/pc/v1-p7-mask.png);}
.page7 .swiper-container:after{content: ''; position: absolute; left: 0; bottom: 0; z-index: 3; pointer-events: none;}
.page7 .swiper-slide a{display: block; height: 100%; position: relative; overflow: hidden;}
.page7 .swiper-slide img{width: 100%; height: 100%; object-fit: cover; transition: .3s ease-out transform;}
.page7 .swiper-slide a:hover img{transform: scale(1.1);}
.page7 .btn-prev,.page7 .btn-next{position: absolute; top: 205px;}
.page7 .btn-prev i,.page7 .btn-next i{position: absolute; top: 50%; margin-top: -16px; transition: .3s ease-out transform;}
.page7 .btn-prev{left: -92px;}
.page7 .btn-prev i{left: 15px;}
.page7 .btn-prev:hover i{transform: translateX(-40px);}
.page7 .btn-next{right: -92px;}
.page7 .btn-next i{right: 15px;}
.page7 .btn-next:hover i{transform: translateX(40px);}
.page7 .swiper-pagination{font-size: 0; text-align: left; margin-top: 19px;}
.page7 .swiper-pagination span{ background: #ece7e1; width: 32px; height: 6px; display: inline-block; vertical-align: top; *zoom:1; *display: inline; margin-right: 8px;}
.page7 .swiper-pagination span.swiper-pagination-bullet-active{ background: #000;}

.create-box.style1 .patch{width: 194px; height: 100px; position: absolute; left: 844px; top: 380px; background: url(//game.gtimg.cn/images/val/act/a20230301act/create/patch1.png) no-repeat;}
.create-box.style2 .patch{width: 184px; height: 94px; position: absolute; left: 256px; top: 543px; background: url(//game.gtimg.cn/images/val/act/a20230301act/create/patch2.png) no-repeat;}
.create-box.style3 .patch{width: 180px; height: 335px; position: absolute; left: 973px; top: 317px; background: url(//game.gtimg.cn/images/val/act/a20230301act/create/patch3.jpg) no-repeat;}


.page3 .btn-starting{width: 322px; display: block; margin:40px auto;}
.page3 .btn-starting.hide{display: none;}
