@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: 766px;height: 1074px;}
.line_svg svg{transform: scale(2);position: absolute;margin: auto;left: 0;right: 0;top: 0;bottom: 0;}
.path{-webkit-animation: slide 25s linear infinite;}
.path_t{-webkit-animation: slide_t 25s linear infinite;}
ul.round{position: absolute;margin: auto;width: 766px;height: 1074px;left: 0;right: 0;top: 0;bottom: 0;z-index: 2;}
ul.round li{background: #fff;border-radius: 100%;position: absolute;animation: bs 25s infinite;}
ul.round li.one{width: 114px;height: 114px;left: 262px;top: 900px;}
ul.round li.two{width: 44px;height: 44px;left: 82px;top: 412px;}
ul.round li.thr{width: 44px;height: 44px;left: 0px;top: 160px;}
ul.round li.fou{width: 114px;height: 114px;left: 50px;top: 0px;}
ul.round li.fiv{width: 44px;height: 44px;left: 334px;top: 0px;}
ul.round li.six{width: 78px;height: 78px;left: 454px;top: 4px;}
ul.round li.sev{width: 44px;height: 44px;left: 458px;top: 198px;}
ul.round li.eig{width: 44px;height: 44px;left: 544px;top: 616px;}
ul.round li.nin{width: 44px;height: 44px;left: 598px;top: 812px;}
ul.round li.ten{width: 44px;height: 44px;left: 720px;top: 946px;}
ul.round li.ele{width: 44px;height: 44px;left: 88px;top: 1026px;}
ul.round li:nth-of-type(1){animation-delay: .1s;}
ul.round li:nth-of-type(2){animation-delay: 1.4s;}
ul.round li:nth-of-type(3){animation-delay: 2.2s;}
ul.round li:nth-of-type(4){animation-delay: 2.5s;}
ul.round li:nth-of-type(5){animation-delay: 3.2s;}
ul.round li:nth-of-type(6){animation-delay: 3.5s;}
ul.round li:nth-of-type(7){animation-delay: 4.0s;}
ul.round li:nth-of-type(8){animation-delay: 5.2s;}
ul.round li:nth-of-type(9){animation-delay: 5.7s;}
ul.round li:nth-of-type(10){animation-delay: 7.2s;}
ul.round li:nth-of-type(11){animation-delay: 7.2s;}
ul.round li a{display: block;height: 100%;}
ul.round_t{position: absolute;margin: auto;width: 766px;height: 1074px;left: 0;right: 0;top: 0;bottom: 0;z-index: 1;}
ul.round_t li{background: #fff;border-radius: 100%;position: absolute;animation: sh 25s infinite;}
ul.round_t li.one{width: 114px;height: 114px;left: 262px;top: 900px;}
ul.round_t li.two{width: 44px;height: 44px;left: 82px;top: 412px;}
ul.round_t li.thr{width: 44px;height: 44px;left: 0px;top: 160px;}
ul.round_t li.fou{width: 114px;height: 114px;left: 50px;top: 0px;}
ul.round_t li.fiv{width: 44px;height: 44px;left: 334px;top: 0px;}
ul.round_t li.six{width: 78px;height: 78px;left: 454px;top: 4px;}
ul.round_t li.sev{width: 44px;height: 44px;left: 458px;top: 198px;}
ul.round_t li.eig{width: 44px;height: 44px;left: 544px;top: 616px;}
ul.round_t li.nin{width: 44px;height: 44px;left: 598px;top: 812px;}
ul.round_t li.ten{width: 44px;height: 44px;left: 720px;top: 946px;}
ul.round_t li.ele{width: 44px;height: 44px;left: 88px;top: 1026px;}
ul.round_h{position: absolute;margin: auto;width: 766px;height: 1074px;left: 0;right: 0;top: 0;bottom: 0;z-index: 1;}
ul.round_h li{background: #fff;border-radius: 100%;position: absolute;animation: sh 25s infinite;}
ul.round_h li.one{width: 114px;height: 114px;left: 262px;top: 900px;}
ul.round_h li.two{width: 44px;height: 44px;left: 82px;top: 412px;}
ul.round_h li.thr{width: 44px;height: 44px;left: 0px;top: 160px;}
ul.round_h li.fou{width: 114px;height: 114px;left: 50px;top: 0px;}
ul.round_h li.fiv{width: 44px;height: 44px;left: 334px;top: 0px;}
ul.round_h li.six{width: 78px;height: 78px;left: 454px;top: 4px;}
ul.round_h li.sev{width: 44px;height: 44px;left: 458px;top: 198px;}
ul.round_h li.eig{width: 44px;height: 44px;left: 544px;top: 616px;}
ul.round_h li.nin{width: 44px;height: 44px;left: 598px;top: 812px;}
ul.round_h li.ten{width: 44px;height: 44px;left: 720px;top: 946px;}
ul.round_h li.ele{width: 44px;height: 44px;left: 88px;top: 1026px;}
.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 1400px;}
    30%{stroke-dasharray:1400px 1400px;}   }

@keyframes slide_t {
    0%{stroke-dasharray:0;}
    27%{stroke-dasharray:0 800px;}
    44%{stroke-dasharray:800px 800px;}   }

@keyframes bs {
   2%{box-shadow: 0 0 60px rgba(255,255,255,1);}   }

@keyframes sh {
  46%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  54%{box-shadow: 0 0 60px rgba(255,255,255,1);}
  62%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  70%{box-shadow: 0 0 60px rgba(255,255,255,1);}
  78%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  86%{box-shadow: 0 0 60px rgba(255,255,255,1);}
  94%{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: 383px;height: 537px;}
.line_svg svg{transform: scale(1);}
ul.round{width: 383px;height: 537px;}
ul.round li.one{width: 57px;height: 57px;left: 131px;top: 450px;}
ul.round li.two{width: 22px;height: 22px;left: 41px;top: 206px;}
ul.round li.thr{width: 22px;height: 22px;left: 0px;top: 80px;}
ul.round li.fou{width: 57px;height: 57px;left: 25px;top: 0px;}
ul.round li.fiv{width: 22px;height: 22px;left: 167px;top: 0px;}
ul.round li.six{width: 39px;height: 39px;left: 227px;top: 2px;}
ul.round li.sev{width: 22px;height: 22px;left: 229px;top: 99px;}
ul.round li.eig{width: 22px;height: 22px;left: 272px;top: 308px;}
ul.round li.nin{width: 22px;height: 22px;left: 299px;top: 406px;}
ul.round li.ten{width: 22px;height: 22px;left: 360px;top: 473px;}
ul.round li.ele{width: 22px;height: 22px;left: 44px;top: 513px;}
ul.round_t{width: 383px;height: 537px;}
ul.round_t li.one{width: 57px;height: 57px;left: 130px;top: 450px;}
ul.round_t li.two{width: 22px;height: 22px;left: 41px;top: 206px;}
ul.round_t li.thr{width: 22px;height: 22px;left: 0px;top: 80px;}
ul.round_t li.fou{width: 57px;height: 57px;left: 25px;top: 0px;}
ul.round_t li.fiv{width: 22px;height: 22px;left: 167px;top: 0px;}
ul.round_t li.six{width: 39px;height: 39px;left: 227px;top: 2px;}
ul.round_t li.sev{width: 22px;height: 22px;left: 229px;top: 99px;}
ul.round_t li.eig{width: 22px;height: 22px;left: 272px;top: 308px;}
ul.round_t li.nin{width: 22px;height: 22px;left: 299px;top: 406px;}
ul.round_t li.ten{width: 22px;height: 22px;left: 360px;top: 473px;}
ul.round_t li.ele{width: 22px;height: 22px;left: 44px;top: 513px;}
ul.round_h{width: 383px;height: 537px;}
ul.round_h li.one{width: 57px;height: 57px;left: 131px;top: 450px;}
ul.round_h li.two{width: 22px;height: 22px;left: 41px;top: 206px;}
ul.round_h li.thr{width: 22px;height: 22px;left: 0px;top: 80px;}
ul.round_h li.fou{width: 57px;height: 57px;left: 25px;top: 0px;}
ul.round_h li.fiv{width: 22px;height: 22px;left: 167px;top: 0px;}
ul.round_h li.six{width: 39px;height: 39px;left: 227px;top: 2px;}
ul.round_h li.sev{width: 22px;height: 22px;left: 229px;top: 99px;}
ul.round_h li.eig{width: 22px;height: 22px;left: 272px;top: 308px;}
ul.round_h li.nin{width: 22px;height: 22px;left: 299px;top: 406px;}
ul.round_h li.ten{width: 22px;height: 22px;left: 360px;top: 473px;}
ul.round_h li.ele{width: 22px;height: 22px;left: 44px;top: 513px;}
.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 {
  46%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  54%{box-shadow: 0 0 30px rgba(255,255,255,1);}
  62%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  70%{box-shadow: 0 0 30px rgba(255,255,255,1);}
  78%{box-shadow: 0 0 0 rgba(255,255,255,1);}
  86%{box-shadow: 0 0 30px rgba(255,255,255,1);}
  94%{box-shadow: 0 0 0 rgba(255,255,255,1);}   }

}












