@charset "UTF-8";
html, body { margin: 0; }

html { font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; color: #333; }

a { text-decoration: none; }

.visible-xs, .visible-xs-up, .visible-xs-down, .visible-sm, .visible-sm-up, .visible-sm-down, .visible-md, .visible-md-up, .visible-md-down, .visible-lg, .visible-lg-up, .visible-lg-down { display: none; }
.hidden{ display: none !important; }
@media (max-width: 768px) { .visible-xs { display: block; } }
@keyframes fade-frames { 0% { opacity: 1; }
  50% { opacity: 0.8; }
  100% { opacity: 1; } }

@keyframes scale-frames { 0% {
    transform: scale3d(0.2, 0.2, 1); }
  50% {
    transform: scale3d(1.4, 1.4, 1); }
  100% {
    transform: scale3d(0.2, 0.2, 1); } }

.baner-spark:nth-child(1) { width: 18px; height: 18px; animation-name: move-frames-1; animation-duration: 8441ms; animation-delay: 4544ms; }

@keyframes move-frames-1 { from {
    transform: translate3d(50vw, 102vh, 0); }
  to {
    transform: translate3d(2vw, -117vh, 0); } }

.baner-spark:nth-child(1) .circle { animation-delay: 3734ms; }

.baner-spark:nth-child(2) { width: 18px; height: 18px; animation-name: move-frames-2; animation-duration: 9921ms; animation-delay: 5982ms; }

@keyframes move-frames-2 { from {
    transform: translate3d(89vw, 108vh, 0); }
  to {
    transform: translate3d(72vw, -123vh, 0); } }

.baner-spark:nth-child(2) .circle { animation-delay: 2516ms; }

.baner-spark:nth-child(3) { width: 8px; height: 8px; animation-name: move-frames-3; animation-duration: 10427ms; animation-delay: 3649ms; }

@keyframes move-frames-3 { from {
    transform: translate3d(85vw, 107vh, 0); }
  to {
    transform: translate3d(30vw, -133vh, 0); } }

.baner-spark:nth-child(3) .circle { animation-delay: 731ms; }

.baner-spark:nth-child(4) { width: 12px; height: 12px; animation-name: move-frames-4; animation-duration: 10951ms; animation-delay: 8909ms; }

@keyframes move-frames-4 { from {
    transform: translate3d(50vw, 104vh, 0); }
  to {
    transform: translate3d(74vw, -122vh, 0); } }

.baner-spark:nth-child(4) .circle { animation-delay: 2526ms; }

.baner-spark:nth-child(5) { width: 10px; height: 10px; animation-name: move-frames-5; animation-duration: 7642ms; animation-delay: 2502ms; }

@keyframes move-frames-5 { from {
    transform: translate3d(9vw, 108vh, 0); }
  to {
    transform: translate3d(39vw, -126vh, 0); } }

.baner-spark:nth-child(5) .circle { animation-delay: 2755ms; }

.baner-spark:nth-child(6) { width: 20px; height: 20px; animation-name: move-frames-6; animation-duration: 8439ms; animation-delay: 455ms; }

@keyframes move-frames-6 { from {
    transform: translate3d(29vw, 101vh, 0); }
  to {
    transform: translate3d(21vw, -109vh, 0); } }

.baner-spark:nth-child(6) .circle { animation-delay: 3506ms; }

.baner-spark:nth-child(7) { width: 16px; height: 16px; animation-name: move-frames-7; animation-duration: 7539ms; animation-delay: 3595ms; }

@keyframes move-frames-7 { from {
    transform: translate3d(11vw, 101vh, 0); }
  to {
    transform: translate3d(31vw, -125vh, 0); } }

.baner-spark:nth-child(7) .circle { animation-delay: 749ms; }

.baner-spark:nth-child(8) { width: 14px; height: 14px; animation-name: move-frames-8; animation-duration: 7480ms; animation-delay: 2680ms; }

@keyframes move-frames-8 { from {
    transform: translate3d(15vw, 101vh, 0); }
  to {
    transform: translate3d(88vw, -111vh, 0); } }

.baner-spark:nth-child(8) .circle { animation-delay: 1888ms; }

.baner-spark:nth-child(9) { width: 20px; height: 20px; animation-name: move-frames-9; animation-duration: 9087ms; animation-delay: 9461ms; }

@keyframes move-frames-9 { from {
    transform: translate3d(100vw, 107vh, 0); }
  to {
    transform: translate3d(40vw, -130vh, 0); } }

.baner-spark:nth-child(9) .circle { animation-delay: 1721ms; }

.baner-spark:nth-child(10) { width: 18px; height: 18px; animation-name: move-frames-10; animation-duration: 9860ms; animation-delay: 8969ms; }

@keyframes move-frames-10 { from {
    transform: translate3d(74vw, 110vh, 0); }
  to {
    transform: translate3d(30vw, -127vh, 0); } }

.baner-spark:nth-child(10) .circle { animation-delay: 1801ms; }

.baner-spark:nth-child(11) { width: 24px; height: 24px; animation-name: move-frames-11; animation-duration: 9292ms; animation-delay: 9812ms; }

@keyframes move-frames-11 { from {
    transform: translate3d(29vw, 108vh, 0); }
  to {
    transform: translate3d(58vw, -135vh, 0); } }

.baner-spark:nth-child(11) .circle { animation-delay: 3834ms; }

.baner-spark:nth-child(12) { width: 20px; height: 20px; animation-name: move-frames-12; animation-duration: 7920ms; animation-delay: 2180ms; }

@keyframes move-frames-12 { from {
    transform: translate3d(10vw, 105vh, 0); }
  to {
    transform: translate3d(18vw, -123vh, 0); } }

.baner-spark:nth-child(12) .circle { animation-delay: 1995ms; }

.baner-spark:nth-child(13) { width: 18px; height: 18px; animation-name: move-frames-13; animation-duration: 7293ms; animation-delay: 6446ms; }

@keyframes move-frames-13 { from {
    transform: translate3d(26vw, 107vh, 0); }
  to {
    transform: translate3d(15vw, -123vh, 0); } }

.baner-spark:nth-child(13) .circle { animation-delay: 1282ms; }

.baner-spark:nth-child(14) { width: 22px; height: 22px; animation-name: move-frames-14; animation-duration: 9677ms; animation-delay: 5675ms; }

@keyframes move-frames-14 { from {
    transform: translate3d(80vw, 102vh, 0); }
  to {
    transform: translate3d(76vw, -110vh, 0); } }

.baner-spark:nth-child(14) .circle { animation-delay: 542ms; }

.baner-spark:nth-child(15) { width: 18px; height: 18px; animation-name: move-frames-15; animation-duration: 8055ms; animation-delay: 7418ms; }

@keyframes move-frames-15 { from {
    transform: translate3d(7vw, 103vh, 0); }
  to {
    transform: translate3d(100vw, -129vh, 0); } }

.baner-spark:nth-child(15) .circle { animation-delay: 2100ms; }

.baner-spark:nth-child(16) { width: 20px; height: 20px; animation-name: move-frames-16; animation-duration: 9673ms; animation-delay: 871ms; }

@keyframes move-frames-16 { from {
    transform: translate3d(58vw, 102vh, 0); }
  to {
    transform: translate3d(86vw, -126vh, 0); } }

.baner-spark:nth-child(16) .circle { animation-delay: 2783ms; }

.baner-spark:nth-child(17) { width: 22px; height: 22px; animation-name: move-frames-17; animation-duration: 8468ms; animation-delay: 2038ms; }

@keyframes move-frames-17 { from {
    transform: translate3d(65vw, 108vh, 0); }
  to {
    transform: translate3d(35vw, -134vh, 0); } }

.baner-spark:nth-child(17) .circle { animation-delay: 346ms; }

.baner-spark:nth-child(18) { width: 18px; height: 18px; animation-name: move-frames-18; animation-duration: 9523ms; animation-delay: 2150ms; }

@keyframes move-frames-18 { from {
    transform: translate3d(48vw, 102vh, 0); }
  to {
    transform: translate3d(97vw, -127vh, 0); } }

.baner-spark:nth-child(18) .circle { animation-delay: 2065ms; }

.baner-spark:nth-child(19) { width: 20px; height: 20px; animation-name: move-frames-19; animation-duration: 9472ms; animation-delay: 428ms; }

@keyframes move-frames-19 { from {
    transform: translate3d(63vw, 107vh, 0); }
  to {
    transform: translate3d(39vw, -122vh, 0); } }

.baner-spark:nth-child(19) .circle { animation-delay: 2105ms; }

.baner-spark:nth-child(20) { width: 18px; height: 18px; animation-name: move-frames-20; animation-duration: 10290ms; animation-delay: 8685ms; }

@keyframes move-frames-20 { from {
    transform: translate3d(39vw, 106vh, 0); }
  to {
    transform: translate3d(21vw, -128vh, 0); } }

.baner-spark:nth-child(20) .circle { animation-delay: 246ms; }
/*页头*/
.top-link { overflow: hidden; opacity: 1; background-color: #fff; }

.top-link ul { list-style: none; margin: 0; padding: 8px 15px; overflow: hidden; }

.top-link ul li { float: left; text-align: center; border-right: 1px solid #ddd; font-size: 12px; margin-right: 10px; padding-right: 10px; line-height: 0; }

.top-link ul li:last-child { border: none; margin: 0; padding: 0; }

.top-link ul li .brand { float: left; margin-right: 5px; }

.top-link ul li img, .top-link ul li svg { display: block; float: left; margin-right: 5px; }

.top-link ul li a { float: left; color: #888; line-height: 16px; height: 16px; overflow: hidden; }

.float-right { float: right !important; }

/*sparkcss*/


.enter-sm { display: none; }

.main-banner { position: relative; top: 0; bottom: 0; left: 0; right: 0; background-image: url(banner.jpg); background-position: center top; background-repeat: no-repeat; width: 100%;background-size: cover;}

.main-banner .enter { position: absolute; margin: 0 auto; left: 0; right: 0; bottom: 90px; z-index: 99; width:207px; animation: txt 2s linear; }

.main-banner .enter a img { display: block; transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; -webkit-transition: all linear .3s; animation: more 1s linear infinite;border-radius: 50px; border:none;}


@keyframes txt { 0% { opacity: 0; }
  100% { opacity: 1; } }

.spark-banner { position: absolute; top: 20%; bottom: 0; left: 0; right: 0; overflow: hidden; }

.baner-spark { position: absolute; -ms-transform: translateY(-10vh); transform: translateY(-10vh); animation-iteration-count: infinite; animation-timing-function: linear; }

.baner-spark .circle { width: 100%; height: 100%; border-radius: 50%; mix-blend-mode: screen; background-image: radial-gradient(#f4bb60, #f4b060 12%, rgba(153, 255, 255, 0) 56%); animation: fadein-frames 20000ms infinite, scale-frames 5s infinite; }



@media (max-width: 768px) { 
  .bdshare-slide-button{display:none !important;}
  .spark-banner {display:none;}
  .main-banner { background-image: url(banner-sm.jpg); position: absolute; left: 0; right: 0; bottom: 0; top:0; background-size: 100% 100%; height:auto; }
  .enter { display: none; }
  .enter-sm { display: block; position: absolute; margin: 0 auto; left: 0; right: 0; bottom: 70px; z-index: 99; width:120px; animation: txt 2s linear; }
  .enter-sm a { display: block; }
  .enter-sm a img { display: block; transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; -webkit-transition: all linear .3s; animation: more 1s linear infinite; border-radius: 50px;  width:120px;} }
