html,body{
  --page-padding:24px 12px;
  --card-border:8px;
  --color-text:#333;
  --card-bg:#fff;
  --swiper-dot-opacity:.2;
  --swiper-btn-size:24px;
  --swiper-btn-bgc:#fff;
  --swiper-btn-border:0 0 5px 0 rgba(112,112,112,0.25);
}

.in1line{
  display:-webkit-box !important;
  overflow:hidden;
  text-overflow:ellipsis;
  word-break:break-all;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:1;
}

.in2line{
  display:-webkit-box !important;
  overflow:hidden;
  text-overflow:ellipsis;
  word-break:break-all;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2;
}

.main_box{
  flex:1;
  transition:all .4s;
  padding:0 16px 0 16px;
  overflow-y: unset;
  height:100%;
  box-sizing:border-box;
  outline:none;
}

.main_box .info_swiper{
  --swiper-height:350px;
}

.back_return{
  position:fixed;
  bottom:80px;
  right:14px;
  width:40px;
  height:40px;
  cursor:pointer;
  opacity:1;
  display:none;
  background-color:#000;
  border-radius:50%;
  text-align:center;
}

.back_return img{
  width:60%;
  height:auto;
  margin-top:9px;
}

.swiper{
  height:var(--swiper-height);
  --swiper-navigation-color:var(--color-text);
  --swiper-pagination-color:var(--color-text);
  --swiper-pagination-bullet-inactive-color:var(--color-text);
  --swiper-pagination-bullet-inactive-opacity:var(--swiper-dot-opacity);
}

.swiper .swiper-button-next:after,.swiper .swiper-button-prev:after{
  font-size:10px;
}

.swiper .swiper-button-next.swiper-button-disabled,.swiper .swiper-button-prev.swiper-button-disabled{
  opacity:.55;
}

.swiper .swiper-button-next,.swiper .swiper-button-prev{
  border-radius:50%;
  background-color:var(--swiper-btn-bgc);
  box-shadow:var(--swiper-btn-border);
  height:var(--swiper-btn-size);
  width:var(--swiper-btn-size);
  text-align:center;
  line-height:var(--swiper-btn-size);
}

.swiper .swiper-button-lock{
  display:block;
}

.swiper-slide img{
  width:100%;
  height:100%;
  border-radius:10px;
}

.flex{
  display:flex;
}

.flex-a-c{
  align-items:center;
}

/* 滚动条样式 */
::-webkit-scrollbar {
  width: 16px;
  height: 0;
}

.y_hidden::-webkit-scrollbar {
  width: 0;
  height: 0;
}

::-webkit-scrollbar-thumb {
  border-radius: 12px;
  background-color: #d8d8d8;
  background-clip: padding-box;
  border: 6px solid transparent;
  transition: background-color 0.3s ease, border-color 0.3s ease; 
}

::-webkit-scrollbar-thumb:hover {  
  background-color: #a6a6a6;  
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

/* 加载动画 */
.loadding {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  background-color: #fff;
  font-size: 32px;
  color: #000;
  font-weight: bold;
  letter-spacing: 2px;
  animation: fade-out 3s ease-in-out;
  animation-fill-mode: forwards;
  z-index: 9999;
}

.loadding_bg {
  width: 800px;
  aspect-ratio: 16/9;
  margin-top: -10%;
}

.loadding_title {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 15px;
}

@keyframes fade-out {
  0% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

/* 懒加载动画 */
.fade-in {
  transition: opacity 0.5s;
}

.fade-in.loaded {
  opacity: 1;
}

img {
  width: 100%;
  height: auto;
  -webkit-user-drag: none;
}

.cursor {
  cursor: pointer;
}

.rank_item_classicgames {
  width: calc((100% - 0.75rem * (5 - 1)) / 5);
}