@charset "utf-8";
/* CSS Document */

.banner-wrapper {
/* background: url("../images/banner/game-banner.jpg") no-repeat top center; */
display: flex;
align-items: center;
justify-content: center;
height:400px;
}
.type{ width: 0;
    overflow: hidden;
    white-space:nowrap;
    display:block;
    border-right: 3px solid #f9d566;
    animation: typewriter 10s steps(40, end) infinite, blinking-cursor 0.8s step-end infinite;
    animation-fill-mode: forwards;
    margin: 0 auto;
  }
  
  @keyframes typewriter {
    0% { width:0 }
    25% { width: 70% }
    48% { width: 100% }
    50% { width: 100% }
    55% { width: 100% }
    75% { width: 70%; }
    85% { width: 30%; }
    100% { width: 0; }
  }
  
  @keyframes blinking-cursor {
    from { border-color: transparent }
    to { border-color: #f9d566 }
  }    



  .s-text img{display: block; margin: 0 auto; height:180px;}
  .s-text .title{color: #162243;  font-size:20px; text-align: center; line-height:32px; font-weight: 500;  position: absolute; width: 100%; left:50%; transform: translateX(-50%);}
  .s-text .title span{font-size:25px;}

/*----------------------------------    */
.section-title{  display: flex;
  justify-content: center;
  align-items: center; margin-top:20px;} 

  .section-title h3{ color: var(--red); font-weight: 600; 
  margin: 0 0 15px;
  width: 97%;
  display: flex;
  justify-content: center;
  align-items: center;

}

.section-title img{width:25px;}

.section-title h3:after {
  content: "";
  border: 0;
  border-bottom:1px dashed #eee;
  background: #999;
  margin: 0 0px;
  flex: 1 0 20px;
}


.show-r{font-size:20px; font-weight: 500; margin-bottom:15px;}  
.show-r span{color:var(--red); font-weight:600;}

.box{ margin: 0 auto 30px;  border-radius: 15px; padding: 20px; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;} 
.box .title a{color:#555; font-size: 21px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
.box .title a:hover{text-decoration: underline; color: var(--red);}
.box p{color: #777; font-size: 17px; line-height: 26px;}
.box .url{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  font-size: 13px; color: #666; margin-bottom: 10px;}
.box .more{color: #777; font-size: 16px;}

/* -------------------------- */


/* .not-found {margin-bottom: 50px;}
.not-found  img{display: block; margin: 0 auto 30px; height:200px;}
.not-found  p{font-size:30px; text-align: center; line-height:25px; font-weight: 500; color: #49598c;}
.not-found span{font-size: 18px;} */


.top{display: flex; flex-direction: row; align-items: center; margin-bottom:8px;}
.s-img{width: 50px; height:50px; flex: 0 0 50px;}
.s-img img{ border-radius:5px; height:50px; border: 1px solid #c8c8c8; padding: 1px; width: 50px; object-fit: cover;}
.text{ margin-left: 10px; overflow: hidden; flex: 0 1 1;}
.no-img.text{margin-left: 0px;}


.v-more{color: #fff; background: var(--red); padding:4px 10px; border-radius:5px; width: fit-content; margin:0 0 20px 15px;}


/* -------------responsive------------- */
@media only screen and (max-width:1279px) { .s-text{margin-top:-25px;}}