@CHARSET "UTF-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, dl, dt, dd, ol, ul, li, fieldset, form, label, input, button, select, textarea, img, table, th, td, article, aside, footer, header, hgroup, menu, nav, output, section, summary, time, mark, audio, video, p{padding:0;margin:0;border: 0 none;color: rgba(255,255,255,1);line-height: 18px;font: 16px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;list-style:none;}
input, textarea, a{outline: none;resize: none;}
a{text-decoration: none;
  -moz-transition: background 0.4s ease-in-out, opacity 0.4s ease-in-out, border 0.4s ease-in-out, color 0.4s ease-in-out, box-shadow 0.4s ease-in-out, border-radius 0.4s ease-in-out;
  -webkit-transition: background 0.4s ease-in-out, opacity 0.4s ease-in-out, border 0.4s ease-in-out, color 0.4s ease-in-out, box-shadow 0.4s ease-in-out, border-radius 0.4s ease-in-out;
  -o-transition: background 0.4s ease-in-out, opacity 0.4s ease-in-out, border 0.4s ease-in-out, color 0.4s ease-in-out, box-shadow 0.4s ease-in-out, border-radius 0.4s ease-in-out;
  -ms-transition: background 0.4s ease-in-out, opacity 0.4s ease-in-out, border 0.4s ease-in-out, color 0.4s ease-in-out, box-shadow 0.4s ease-in-out, border-radius 0.4s ease-in-out;
  transition: background 0.4s ease-in-out, opacity 0.4s ease-in-out, border 0.4s ease-in-out, color 0.4s ease-in-out，box-shadow 0.4s ease-in-out, border-radius 0.4s ease-in-out;}
.clr{clear: both;}
*{margin: 0; padding: 0;}
a{-webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-user-select: none;-moz-user-focus: none;-moz-user-select: none;}
@font-face{font-family: zkcjh;src:url(../fonts/字魂143号-正酷超级黑.ttf);}
html, body{width: 2160px;height: 3840px;background: url(../images/bg.jpg) center center no-repeat;margin: auto;background-size: 100%;}
video::-webkit-media-controls{ display:none !important; }

.line_svg{position: absolute;margin: auto;left: 0;right: 0;top: 0;bottom: 0;width: 1548px;height: 828px;}
.line_svg svg{transform: scale(2);position: absolute;margin: auto;left: 0;right: 0;top: 0;bottom: 0;}
.path{-webkit-animation: slide 15s linear infinite;}
.path_t{-webkit-animation: slide_t 15s linear infinite;}
ul.round{position: absolute;margin: auto;width: 1548px;height: 828px;left: 0;right: 0;top: 0;bottom: 0;z-index: 2;}
ul.round li{background: #fff;border-radius: 100%;position: absolute;animation: bs 15s infinite;}
ul.round li.one{width: 44px;height: 44px;left: 356px;top: 540px;}
ul.round li.two{width: 114px;height: 114px;left: 0px;top: 446px;}
ul.round li.thr{width: 44px;height: 44px;left: 428px;top: 280px;}
ul.round li.fou{width: 44px;height: 44px;left: 1030px;top: 342px;}
ul.round li.fiv{width: 44px;height: 44px;left: 1096px;top: 184px;}
ul.round li.six{width: 76px;height: 76px;left: 1360px;top: 2px;}
ul.round li.sev{width: 44px;height: 44px;left: 1502px;top: 154px;}
ul.round li.eig{width: 114px;height: 114px;left: 1128px;top: 714px;}
ul.round li.nin{width: 44px;height: 44px;left: 1184px;top: 530px;}
ul.round li:nth-of-type(1){animation-delay: 0s;}
ul.round li:nth-of-type(2){animation-delay: 0.5s;}
ul.round li:nth-of-type(3){animation-delay: 1.4s;}
ul.round li:nth-of-type(4){animation-delay: 2.6s;}
ul.round li:nth-of-type(5){animation-delay: 2.9s;}
ul.round li:nth-of-type(6){animation-delay: 3.5s;}
ul.round li:nth-of-type(7){animation-delay: 3.8s;}
ul.round li:nth-of-type(8){animation-delay: 1.5s;}
ul.round li:nth-of-type(9){animation-delay: 2.0s;}
ul.round li a{display: block;height: 100%;}
ul.round_t{position: absolute;margin: auto;width: 1548px;height: 828px;left: 0;right: 0;top: 0;bottom: 0;z-index: 1;}
ul.round_t li{background: #fff;border-radius: 100%;position: absolute;animation: sh 15s infinite;}
ul.round_t li.one{width: 44px;height: 44px;left: 356px;top: 540px;}
ul.round_t li.two{width: 114px;height: 114px;left: 0px;top: 446px;}
ul.round_t li.thr{width: 44px;height: 44px;left: 428px;top: 280px;}
ul.round_t li.fou{width: 44px;height: 44px;left: 1030px;top: 342px;}
ul.round_t li.fiv{width: 44px;height: 44px;left: 1096px;top: 184px;}
ul.round_t li.six{width: 76px;height: 76px;left: 1360px;top: 2px;}
ul.round_t li.sev{width: 44px;height: 44px;left: 1502px;top: 154px;}
ul.round_t li.eig{width: 114px;height: 114px;left: 1128px;top: 714px;}
ul.round_t li.nin{width: 44px;height: 44px;left: 1184px;top: 530px;}
ul.round_h{position: absolute;margin: auto;width: 1548px;height: 828px;left: 0;right: 0;top: 0;bottom: 0;z-index: 1;}
ul.round_h li{background: #fff;border-radius: 100%;position: absolute;animation: sh 15s infinite;}
ul.round_h li.one{width: 44px;height: 44px;left: 356px;top: 540px;}
ul.round_h li.two{width: 114px;height: 114px;left: 0px;top: 446px;}
ul.round_h li.thr{width: 44px;height: 44px;left: 428px;top: 280px;}
ul.round_h li.fou{width: 44px;height: 44px;left: 1030px;top: 342px;}
ul.round_h li.fiv{width: 44px;height: 44px;left: 1096px;top: 184px;}
ul.round_h li.six{width: 76px;height: 76px;left: 1360px;top: 2px;}
ul.round_h li.sev{width: 44px;height: 44px;left: 1502px;top: 154px;}
ul.round_h li.eig{width: 114px;height: 114px;left: 1128px;top: 714px;}
ul.round_h li.nin{width: 44px;height: 44px;left: 1184px;top: 530px;}
.layer{width: 1600px;height: 3080px;margin: auto;position: absolute;top: 0;bottom: 0;left: 0;right: 0;}
.layer .head{width: 660px;height: 920px;margin: auto;border: 20px solid rgba(255,255,255,0.8);border-radius: 40px;position: relative;z-index: 4;box-shadow: 0 24px 32px rgba(0,0,0,0.1);}
.layer .head img{border-radius: 20px;width: 660px;}
.layer .head video{border-radius: 20px;width: 660px;height: 920px;}
.layer .box{width: 1600px;height: 2600px;background: rgba(255,255,255,0.95);border-radius: 40px;position: absolute;bottom: 0;z-index: 3;}
.layer .box .play{position: absolute;z-index: 9;right: 0;top: 0;}
.layer .box .play a{display: block;width: 180px;height: 180px;}
.layer .box .play a img{width: 108px;height: 108px;margin: 36px;}
.layer .box .title{text-align: center;padding: 560px 100px 0;}
.layer .box .title h4{font-family: zkcjh;font-size: 72px;color: #091E44;margin: 0 0 20px;}
.layer .box .title span{font-family: PingFang SC;font-size: 42px;color: #091E44;}
.layer .box .txt{padding: 48px 100px 0;}
.layer .box .txt p{font-family: PingFang SC;font-size: 42px;color: #091E44;margin: 48px 0;font-weight: 400;text-align: left;}
.btn_a{position: absolute;z-index: 10;width: 320px;margin: auto;left: 0;right: 0;height: 236px;bottom: 72px;}
.btn_a a{position: absolute;bottom: 0;left: 0;right: 0;margin: auto;width: 304px;}
.btn_a a img{width: 300px;}

@keyframes slide {
    0%{stroke-dasharray:0 1200px;}
    30%{stroke-dasharray:1200px 1200px;}   }

@keyframes slide_t {
    0%{stroke-dasharray:0 800px;}
    20%{stroke-dasharray:800px 800px;}   }

@keyframes bs {
   2%{box-shadow: 0 0 60px rgba(255,255,255,1);}   }

@keyframes sh {
  48%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  56%{box-shadow: 0 0 60px rgba(255,255,255,1);}
  64%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  72%{box-shadow: 0 0 60px rgba(255,255,255,1);}
  80%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  88%{box-shadow: 0 0 60px rgba(255,255,255,1);}
  96%{box-shadow: 0 0 0 rgba(255,255,255,1);}   }

@media screen and (max-width: 1920px){
html, body{width: 1080px;height: 1920px;}
.line_svg{width: 774px;height: 414px;}
.line_svg svg{transform: scale(1);}
ul.round{width: 774px;height: 414px;}
ul.round li.one{width: 22px;height: 22px;left: 178px;top: 270px;}
ul.round li.two{width: 57px;height: 57px;left: 0px;top: 223px;}
ul.round li.thr{width: 22px;height: 22px;left: 214px;top: 140px;}
ul.round li.fou{width: 22px;height: 22px;left: 515px;top: 171px;}
ul.round li.fiv{width: 22px;height: 22px;left: 548px;top: 92px;}
ul.round li.six{width: 38px;height: 38px;left: 680px;top: 1px;}
ul.round li.sev{width: 22px;height: 22px;left: 751px;top: 77px;}
ul.round li.eig{width: 57px;height: 57px;left: 564px;top: 357px;}
ul.round li.nin{width: 22px;height: 22px;left: 592px;top: 265px;}
ul.round_t{width: 774px;height: 414px;}
ul.round_t li.one{width: 57px;height: 57px;left: 0px;top: 223px;}
ul.round_t li.two{width: 22px;height: 22px;left: 214px;top: 140px;}
ul.round_t li.thr{width: 22px;height: 22px;left: 515px;top: 171px;}
ul.round_t li.fou{width: 22px;height: 22px;left: 548px;top: 92px;}
ul.round_t li.fiv{width: 38px;height: 38px;left: 680px;top: 1px;}
ul.round_t li.six{width: 22px;height: 22px;left: 751px;top: 77px;}
ul.round_t li.sev{width: 22px;height: 22px;left: 178px;top: 270px;}
ul.round_t li.eig{width: 57px;height: 57px;left: 564px;top: 357px;}
ul.round_t li.nin{width: 22px;height: 22px;left: 592px;top: 265px;}
ul.round_h{width: 774px;height: 414px;}
ul.round_h li.one{width: 57px;height: 57px;left: 0px;top: 223px;}
ul.round_h li.two{width: 22px;height: 22px;left: 214px;top: 140px;}
ul.round_h li.thr{width: 22px;height: 22px;left: 515px;top: 171px;}
ul.round_h li.fou{width: 22px;height: 22px;left: 548px;top: 92px;}
ul.round_h li.fiv{width: 38px;height: 38px;left: 680px;top: 1px;}
ul.round_h li.six{width: 22px;height: 22px;left: 751px;top: 77px;}
ul.round_h li.sev{width: 22px;height: 22px;left: 178px;top: 270px;}
ul.round_h li.eig{width: 57px;height: 57px;left: 564px;top: 357px;}
ul.round_h li.nin{width: 22px;height: 22px;left: 592px;top: 265px;}
.layer{width: 800px;height: 1540px;}
.layer .head{width: 330px;height: 460px;border: 10px solid rgba(255,255,255,0.8);border-radius: 20px;box-shadow: 0 12px 16px rgba(0,0,0,0.1);}
.layer .head img{border-radius: 10px;width: 330px;}
.layer .head video{border-radius: 10px;width: 330px;height: 460px;}
.layer .box{width: 800px;height: 1300px;border-radius: 20px;}
.layer .box .play a{width: 90px;height: 90px;}
.layer .box .play a img{width: 54px;height: 54px;margin: 18px;}
.layer .box .title{padding: 280px 50px 0;}
.layer .box .title h4{font-size: 36px;margin: 0 0 10px;}
.layer .box .title span{font-size: 21px;}
.layer .box .txt{padding: 24px 50px 0;}
.layer .box .txt p{font-size: 21px;margin: 24px 0;}
.btn_a{width: 160px;height: 118px;bottom: 36px;}
.btn_a a{width: 152px;}
.btn_a a img{width: 150px;}

@keyframes bs {
   2%{box-shadow: 0 0 30px rgba(255,255,255,1);}   }

@keyframes sh {
  48%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  56%{box-shadow: 0 0 30px rgba(255,255,255,1);}
  64%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  72%{box-shadow: 0 0 30px rgba(255,255,255,1);}
  80%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  88%{box-shadow: 0 0 30px rgba(255,255,255,1);}
  96%{box-shadow: 0 0 0 rgba(255,255,255,1);}   }
}











