/* !important 增加权重 */
#fp-nav ul li span{background-color: white !important;}   /* 右侧小圆点 */


.beianhao {width: 100%;height: 65px;position: fixed;left: 0;top: 0px;z-index: 121; background:white; border-bottom: 3px groove black;
    white-space: nowrap;  text-overflow:ellipsis; overflow: hidden;} 
.beianhao a {color:  black; text-decoration:none;width: 25%; float: left; text-align: center; line-height: 64px;font-size: 1.1em;font-weight:600;} 
.beianhao a:hover{ border-bottom: 4px groove red; background:rgba(248, 3, 3, 0.04); }



.back1 {background: url('images/back1.jpg') no-repeat; background-size: cover;} /* 第一页背景 */

.bullet {width: 100%;height: 100%;position: absolute;left: -100%;background: url('images/bullet.png')  no-repeat;
        bottom: -2200px;animation: bulletmove 16s linear infinite ;z-index: 21; }  /* 剑1 */
@keyframes bulletmove{100%{ left: 100%; bottom: 300px;  opacity: 0.8;} } /* 第一页剑移动 */
.bullet2 {width: 100%;height: 100%;position: absolute;right: -100%;background: url('images/bullet2.png')  no-repeat;
    top: 0px;transform: scaleY(0.1);animation: bulletmove2 33s linear infinite ;z-index: 21; }  /* 剑2 */
@keyframes bulletmove2{100%{ right: 100%; transform: scaleY(1); opacity: 0.8;} } /* 第一页剑移动 */

/* 闪电 和里面的5张图片  margin-left: -320px; 是为了居中 */
.aurora{width: 100%;height: 100%;position: relative;left: 35%;margin-left: -320px; /* background-color: pink; */top:-15%;}
.aurora div{position: absolute;width: 100%;height: 100%;transform: scale(1.3,1.3);} /* scale(1.8,1.8) 缩放1.8  就是xy均扩大1.8倍 */
.aurora div:nth-child(1){background: url('images/j1.png') no-repeat;opacity: 0; animation: lightshow 2s linear infinite alternate;}
.aurora div:nth-child(2){background: url('images/j2.png') no-repeat;opacity: 0; animation: lightshow 2s linear 3s infinite alternate;}
.aurora div:nth-child(3){background: url('images/j3.png') no-repeat;opacity: 0; animation: lightshow 2s linear 6s infinite alternate;}
.aurora div:nth-child(4){background: url('images/j4.png') no-repeat;opacity: 0; animation: lightshow 2s linear 9s infinite alternate;}
.aurora div:nth-child(5){background: url('images/j5.png') no-repeat;opacity: 0; animation: lightshow 2s linear 12s infinite alternate;}
@keyframes lightshow{ 0%{opacity: 0;}  100%{opacity: 0.6;} }

/* box 中间框*/
.box {position:absolute;left: 50%;top:50%;width: 180px; height: 220px;margin-left: -90px; margin-top: -110px;
    z-index: 70;background:rgb(253, 239, 239);padding: 5px;animation: boxmove 1s linear; border: 2px groove rgba(253, 219, 219, 0.5);}
 @keyframes boxmove{0% {transform: scale(0.1,0.1);}   100% {transform: scale(1,1); }}
.box-1 { text-align: center;background: rgb(253, 225, 225);width: 84%;height: 58%;
    border: 15px solid white;transition:all 0.3s;}
.box-1:hover{ border: 15px solid rgb(250, 201, 201);}

.box-1 a { font-size: 1.3em;color: #FFFFFF; cursor: pointer;text-decoration:none; transition:all 1s;display:block;
    line-height:125px; animation: boxmove1 2s linear infinite alternate;}
 @keyframes boxmove1{  100% {color: #050007ea;}}
 .box-text { font-size: 1.1em;color: black;  text-align: center; line-height:70px; font-weight:600;}

 


 .box.leave{animation:logoleave 0.6s linear forwards ;}  /*换页移动设置 */
 @keyframes logoleave{100%{transform: translate(0,750px);} }/* 重上往下移动750px forwards保持结束时的样子*/
 .box.now{animation:logonow 0.6s linear forwards ;} /*换页移动设置 */
 @keyframes logonow{0%{transform: translate(0,750px);}  100%{transform: translate(0,0);} }/* 回去的坐标*/



 .back2{background: url('images/back2.jpg')  no-repeat;background-size: cover;} /* 第二页背景 */
 /* 3个星球 */
 .ball2{width: 600px;height: 546px;background: url('images/fire6.png');position: absolute;
     left: 55%;top:50%;animation: ball3 5s linear infinite;}
 @keyframes ball3{from{transform: rotate(0); }  to{transform: rotate(360deg);} }/* 旋转360度 */

 .star5 {width: 100%;height: 100%;position: absolute;top:0;left: 0; /* 第一页小星星1 */
    background: url('images/star5.png');animation: starmove 10s linear infinite ;opacity: 0.4;}
@keyframes starmove{100%{background-position-x:-1920px ;opacity: 0;}} /* star 背景向左x轴移动1920 1920是图片宽度*/
.star6 {width: 100%;height: 100%;position: absolute;top:0;right: 0; /* 第一页小星星2 */
    background: url('images/star5.png'); animation: starmove1 30s linear infinite ;opacity: 0.4;}
@keyframes starmove1{100%{background-position-x:1920px ; opacity: 0;}} /* star 背景向左x轴移动1920 1920是图片宽度*/









.xz1 {width: 65%; margin: 0 auto;background-color: hsla(0, 100%, 100%, 0.3); margin-top:65px;}
.xz2 {font-family: Arial, Helvetica, sans-serif;border-collapse: collapse;width: 100%;text-align: center;font-size: 0.9em;font-weight:600;}
.xz2 td , .xz2 th {border: 1px groove  #FFF;padding: 8px;text-align: center;}
.xz2 th {background-color: hsla(0, 100%, 100%, 0.6);color: black;width: 25%;}
.xz2 tr:hover, .xz2 th:hover {background-color: #ddd;}
.xz3 {font-size: 1.3em;  height:130px; }
.xz6 {width: 32%;background-color: #4CAF50; border: 2px groove  #FFF ;color: white;padding: 15px 0;text-align: center;margin: 0 auto;
  text-decoration: none;display: inline-block;font-size: 1.0em;cursor: pointer;float: left;}
.xz6:not(:last-child) {border-right: none; /* 阻止双边框 */}
.xz6:hover {background-color: rgb(255, 99, 71);}
.xz7 ol {list-style:none; color:Crimson ;margin-left: -3%;}




.yxlb1 {width: 65%; margin: 0 auto; background-color: hsla(0, 100%, 100%, 0.3); margin-top:65px;}
.yxlb2 {font-family: Arial, Helvetica, sans-serif;border-collapse: collapse;width: 100%;text-align: center;font-size: 0.9em;font-weight:600;}
.yxlb2 td , .yxlb2 th {border: 1px groove  #FFF;padding: 8px;text-align: center;}
.yxlb2 th {background-color: hsla(0, 100%, 100%, 0.6);color: black;width: 25%;}

.yxlb2 tr:hover, .yxlb2 th:hover {background-color: #ddd;}

.yxlb3 {font-size: 1.3em;  height:130px; }
.yxlb4 {color:red;} 
.yxlb4 input {width: 200px;} 

.yxlb6 {width: 60%;background-color: #4CAF50; border: 2px groove   #FFF;color: white;padding: 25px 12px;text-align: center;margin: 0 auto;
  text-decoration: none;display: inline-block;font-size: 1.0em;cursor: pointer;}
.yxlb6:hover {background-color: rgb(255, 99, 71);}
.yxlb7 ol {text-align: justify;margin-left: -3%;}
.yxlb8 ol {list-style:none; color:red ; font-size: 1.1em;margin-left: -3%;line-height:35px;}







@media screen and (max-width: 1280px) {
    .xz1 {width: 85%;}
    .yxlb1 {width: 85%; }
    .yxlb4 input {width: 180px;} 

    }
    
    
    
    
    
    
    
    
    
    
    
@media screen and (max-width: 992px) {
    .xz1 {width: 100%;}
    .yxlb1 {width: 100%; }   
    .yxlb4 input {width: 130px;} 
    
    
    }
    
    
    
    
    
    
    
    
    
    
    
    @media screen and (max-width: 600px) {
        .yxlb4 input {width: 70px;} 
        
    
    }