@import "https://img1.tiancitycdn.com/mh/homepage/v8/css/base.css";html body{background:#383838;width:100%;min-width:1240px}#loading{width:100%;height:100%;position:fixed;top:0;left:0;background:#000;z-index:20;font-size:18px;color:#cfd1cc;z-index:101}#loading .box{width:100%;height:1px;background:#414141;margin:0 auto;position:relative;top:50%;transform:translateY(-50%);left:0}#loading .box span{height:1px;background:#c4c4c4;position:relative;top:0;left:0;display:block}#loading .box p{font-size:16px;line-height:30px;color:#c0c0c0;text-align:center}.wraper{width:100%;margin:0 auto;min-width:1200px;max-width:1920px;position:relative;overflow:hidden}.wraper .quick{width:190px;height:283px;right:0;position:fixed;z-index:10;top:1300px}.wraper .quick a{width:100%;height:47px;display:flex;justify-content:center;align-items:center;color:#ffe8b9;text-align:center;font-size:18px;box-sizing:border-box;background:url(../images/bg-top.png) no-repeat}.wraper .quick a.g1{height:71px;background-position:0 0;padding-top:30px}.wraper .quick a.g2{background-position:0 -71px}.wraper .quick a.g3{background-position:0 -118px}.wraper .quick a.g4{background-position:0 -165px}.wraper .quick a.top{height:70px;background-position:0 -212px;padding-bottom:24px}.wraper .quick a:hover,.wraper .quick a.on{color:#c9ff62}.wraper .header{width:100%;height:1000px;margin:0 auto;position:relative;overflow:hidden}.wraper .header #obindex{width:139px;height:86px;left:50%;margin-left:-550px;top:40px;position:absolute;background:url(../images/logo.png) no-repeat;text-indent:-999em;overflow:hidden;display:block;z-index:10}.wraper .header .layer{width:1200px;height:100%;margin:0 auto;position:relative}.wraper .header .layer .npc{width:1920px;height:1000px;position:absolute;top:0;left:50%;margin-left:-960px;z-index:1}.wraper .header .layer .npc::after{content:"";width:100%;height:100%;position:absolute;left:0;top:0;background:url(../images/npc1.png) center top / contain no-repeat;animation:breathe 3.5s ease-in-out infinite;transform-origin:bottom center}.wraper .header .layer .mask{width:1920px;height:1000px;background:url(../images/mask.png) no-repeat;position:absolute;top:0;left:50%;margin-left:-960px;z-index:5}.wraper .header .layer .bgimg{width:1920px;height:1000px;background:url(../images/bg-header.jpg) no-repeat;position:absolute;top:0;left:50%;margin-left:-960px}.wraper .header .layer .slogan{width:960px;height:409px;position:absolute;top:472px;left:50%;margin-left:-525px;z-index:8}.wraper .header .layer .slogan .slogan-text{width:548px;height:80px;position:absolute;left:207px;top:-24px;background:url(../images/slogan-text.png) no-repeat;z-index:1}.wraper .header .layer .slogan .slogan-name{width:100%;height:100%;position:absolute;left:0;top:0;background:url(../images/slogan-name.png) no-repeat;z-index:2}.wraper .header .layer .btn-vd{width:147px;height:99px;position:absolute;left:50%;margin-left:-25px;top:322px;z-index:12;background:url(../images/bg-video.png) no-repeat;text-indent:-9999px}.wraper .header .layer .btn-vd::after{content:"";width:100%;height:100%;position:absolute;left:0;top:0;background:url(../images/bg-video.png) no-repeat}.wraper .header .layer .btn-vd:hover::after{background-position:center bottom}.wraper .header .layer .nav{height:44px;position:absolute;right:-33px;top:27px;z-index:10}.wraper .header .layer .nav a{width:123px;height:44px;margin:0 6px;display:block;float:left;font-size:15px;color:#b9d3f5}.wraper .header .layer .nav a span{width:123px;height:44px;line-height:42px;text-align:center;display:block;color:#fff;background:url(../images/nav.png) no-repeat;text-shadow:1px 1px 1px #357003,1px 1px 1px #357003,1px -1px 1px #357003,-1px -1px 1px #357003;transition:margin .3s ease-in-out 0s}.wraper .header .layer .nav a:hover span{margin-top:-10px;filter:brightness(1.3)}.wraper .header .layer .light{position:absolute;left:50%;bottom:0;width:1920px;margin-left:-960px;height:420px;display:block;z-index:1;opacity:10;transform-origin:center top}.wraper .header .layer .light span{position:absolute;left:auto}.wraper .header .layer .lv1{top:45%}.wraper .header .layer .lv2{top:20%}.wraper .header .layer .lv3{top:24%}.wraper .header .layer .lv4{top:28%}.wraper .header .layer .lv5{top:60%}.wraper .header .layer .lv6{top:53%}.wraper .header .layer .lv7{top:50%}.wraper .header .layer .lv8{top:65%}.wraper .header .layer .lv9{top:60%}.wraper .header .layer .lv10{top:50%}.wraper .header .layer .lv11{top:54%}.wraper .header .layer .leave span{z-index:4;position:absolute;right:-100px}.wraper .content{width:100%;margin:0 auto;position:relative;z-index:8}.wraper .content .title{width:450px;height:147px;margin:47px auto 0;text-indent:-9999px;position:absolute;left:50%;top:0}.wraper .content .txt{height:195px;margin:0 auto;display:flex;align-items:center;box-sizing:border-box;padding:30px 100px 0}.wraper .content .txt strong{font-size:28px;color:#5c961d;text-align:center;line-height:32px}.wraper .content .txt strong span{font-size:22px;color:#93613e;display:block;margin-bottom:5px}.wraper .content .txt p{flex:1}.wraper .content .story{width:100%;height:952px;position:relative;background:url(../images/bg-box1.jpg) no-repeat center top}.wraper .content .story .title{width:805px;margin-left:-500px;background:url(../images/tit1.png) no-repeat center bottom}.wraper .content .story .box{width:805px;height:338px;position:absolute;left:50%;top:225px;margin-left:-500px;z-index:4;background:url(../images/story-box.png) no-repeat;display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center}.wraper .content .story .box strong{font-size:22px;color:#93613e;margin-bottom:20px;display:block}.wraper .content .story .box p{font-size:16px}.wraper .content .story .n1{width:1284px;height:988px;position:absolute;left:50%;top:-82px;margin-left:-280px;background:url(../images/npc2.png) no-repeat;z-index:5;pointer-events:none}.wraper .content .weapon{width:100%;height:913px;position:relative;z-index:4;background:url(../images/bg-box2.jpg) no-repeat center top}.wraper .content .weapon .title{width:930px;margin-left:-340px;background:url(../images/tit2.png) no-repeat center bottom}.wraper .content .weapon .box{width:930px;height:688px;background:url(../images/txt-1.png) no-repeat;position:absolute;left:50%;top:225px;margin-left:-340px}.wraper .content .weapon .box .txt strong{margin:0 122px 0 21px}.wraper .content .weapon .swiper_cont{position:relative;width:100%;margin:0 auto;z-index:4}.wraper .content .weapon .swiper_cont .btn{display:none}.wraper .content .weapon .swiper_cont .swiper-pagination{display:none}.wraper .content .weapon .swiper_cont .tit{height:100px;width:100%;position:absolute;left:0;top:-130px;text-indent:-9999px;background:url(../images/tit2.png) no-repeat center bottom}.wraper .content .weapon .n1{width:439px;height:1146px;position:absolute;left:50%;top:-62px;margin-left:-576px;background:url(../images/npc3.png) no-repeat;pointer-events:none}.wraper .content .equip{width:100%;height:1215px;position:relative;z-index:3;background:url(../images/bg-box3.jpg) no-repeat center top}.wraper .content .equip .title{width:1124px;margin-left:-562px;background:url(../images/tit3.png) no-repeat center bottom}.wraper .content .equip .box{width:1124px;height:914px;background:url(../images/txt-2.png) no-repeat;position:absolute;left:50%;top:225px;margin-left:-562px}.wraper .content .equip .box .txt strong{margin:0 122px 0 0}.wraper .content .equip .swiper_cont{position:relative;width:100%;margin:0 auto;z-index:4}.wraper .content .equip .swiper_cont .swiper-wrapper{margin:0 auto}.wraper .content .equip .swiper_cont .swiper-wrapper .swiper-slide{opacity:0 !important}.wraper .content .equip .swiper_cont .swiper-wrapper .swiper-slide.swiper-slide-active{opacity:1 !important}.wraper .content .equip .swiper_cont .btn{width:72px;height:84px;-webkit-filter:grayscale(100%);filter:grayscale(100%)}.wraper .content .equip .swiper_cont .btn::after{width:100%;height:100%;content:"";background:url(../images/bg-arr.png) no-repeat}.wraper .content .equip .swiper_cont .btn:hover{-webkit-filter:grayscale(0%);filter:grayscale(0%)}.wraper .content .equip .swiper_cont .btn.swiper-button-next{right:82px}.wraper .content .equip .swiper_cont .btn.swiper-button-next::after{background-position:right top}.wraper .content .equip .swiper_cont .btn.swiper-button-prev{left:82px}.wraper .content .equip .swiper_cont .btn.swiper-button-prev::after{background-position:left top}.wraper .content .equip .swiper_cont .swiper-pagination{display:none}.wraper .content .equip .n1{width:406px;height:230px;position:absolute;left:50%;top:892px;margin-left:-754px;background:url(../images/leave.png) no-repeat;pointer-events:none}.wraper .content .skill{width:100%;height:1320px;position:relative;background:url(../images/bg-box4.jpg) no-repeat center top}.wraper .content .skill .title{width:960px;margin-left:-479px;background:url(../images/tit4.png) no-repeat center bottom}.wraper .content .skill .swiper_cont{position:relative;width:960px;height:1100px;z-index:4;position:absolute;left:50%;top:450px;margin-left:-479px}.wraper .content .skill .swiper_cont .swiper-pagination{top:-220px;height:200px;bottom:auto;margin:0 auto}.wraper .content .skill .swiper_cont .swiper-pagination-bullets{font-size:0}.wraper .content .skill .swiper_cont .swiper-pagination-bullets span{width:254px;height:100%;margin:0;display:inline-block;background:url(../images/jn-btn.png) 0 0 no-repeat;border-radius:0;opacity:1;border:0;position:relative;color:#fff}.wraper .content .skill .swiper_cont .swiper-pagination-bullets span::before{content:"";width:27px;height:27px;position:absolute;left:50%;bottom:-41px;margin-left:-13px;background:url(../images/jn-btn-on.png) no-repeat}.wraper .content .skill .swiper_cont .swiper-pagination-bullets span:nth-child(1){background-position:-19px 0}.wraper .content .skill .swiper_cont .swiper-pagination-bullets span:nth-child(2){background-position:-273px 0}.wraper .content .skill .swiper_cont .swiper-pagination-bullets span:nth-child(3){background-position:-527px 0}.wraper .content .skill .swiper_cont .swiper-pagination-bullets span:hover,.wraper .content .skill .swiper_cont .swiper-pagination-bullets span.swiper-pagination-bullet-active{background-position-y:-216px}.wraper .content .skill .swiper_cont .swiper-pagination-bullets span:hover::before,.wraper .content .skill .swiper_cont .swiper-pagination-bullets span.swiper-pagination-bullet-active::before{background-position:center right}.wraper .content .skill .swiper_cont .video-container{width:960px;height:540px;z-index:2;margin:30px auto 0;position:relative}.wraper .content .skill .swiper_cont .video-container::after{content:"";position:absolute;left:-21px;top:-21px;width:995px;height:584px;z-index:1;background:url(../images/jn-box.png) no-repeat}.wraper .content .skill .swiper_cont .video-container img,.wraper .content .skill .swiper_cont .video-container video{width:100%;height:100%;cursor:pointer;position:absolute;left:0;top:0;z-index:2}.wraper .content .skill .swiper_cont .swiper-slide p{width:100%;height:138px;background:url(../images/jn-txt.png) no-repeat center top;font-size:22px;color:#93613e;display:flex;justify-content:center;align-items:center;text-align:center}.wraper .content .skill .swiper_cont .swiper-slide{opacity:0 !important}.wraper .content .skill .swiper_cont .swiper-slide.swiper-slide-active{opacity:1 !important}#popvd{width:888px;height:500px;background:#000;display:none}#popvd .popbox{width:100%;height:100%;overflow:hidden}#popvd .close{width:48px;height:48px;position:absolute;top:0;right:-50px;display:block;text-indent:-9999px;background:url(https://image.tiancity.com/player/images/close_btn.jpg) no-repeat;cursor:pointer}#obindex{opacity:0;filter:blur(10px)}.layer .bgimg,.layer .btn-vd{opacity:0;transform:scale(1.3);filter:blur(10px)}.layer .slogan-name{opacity:0;filter:blur(10px);transform:scale(1.5)}.layer .slogan-text{opacity:0;filter:blur(10px);transform:translate(0, -150px)}.layer .npc{opacity:0;filter:blur(10px);transform:scale(1.3) translate(-200px, 0)}.load_complate #obindex{filter:blur(0);opacity:1;transition:all 1s ease}.load_complate .layer .bgimg,.load_complate .layer .npc,.load_complate .layer .slogan-text,.load_complate .layer .btn-vd,.load_complate .layer .slogan-name{filter:blur(0);transform:scale(1) translate(0, 0);opacity:1;transition:all 1s ease}.load_complate .layer .npc{transition-delay:.2s}.load_complate .layer .slogan-text{transition-delay:.3s}.load_complate .layer .btn-vd{transition-delay:.6s}.load_complate .layer .slogan-name{transition-delay:.5s}.wraper .nav a{transform:translateY(50px) scale(1.2);opacity:0;filter:blur(10px)}.load_complate .nav a{transform:translateY(0) scale(1);opacity:1;transition:all .5s ease;filter:blur(0)}.load_complate .nav a:nth-child(1){transition-delay:.8s}.load_complate .nav a:nth-child(2){transition-delay:.9s}.load_complate .nav a:nth-child(3){transition-delay:1s}.load_complate .nav a:nth-child(4){transition-delay:1.1s}@keyframes breathe{0%,100%{transform:translate(0, 0) scaleY(1) scaleX(1)}50%{transform:translate(0, 0) scaleY(1.01) scaleX(1.015)}}