.main .box .sub-category>div {
  padding: 12px 0 0 2.1%;
  font-size: 18px;
  box-sizing: border-box;
}

/* .main .box .item {
  border: 1px solid #0E121D;
  height: 20vh;
  width: 20%;
  border-radius: 6px;
  background: #0E121D;
  padding: 5px;
  min-width: 90px;
  margin: 20px 0 0 10px;
  float: left;
  overflow: hidden;
  transition: all .3s;
} */

body {
  margin: 0;
  padding: 0;
  /* 乔--加box-sizing: border-box;可以保证加了margin 或者padding一起算入 */
  box-sizing: border-box;
  background: #0E121D;
}

.main .box {
  padding-top: 10px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  grid-auto-rows: 16vh;
  gap: 10px 20px;
  box-sizing: border-box;
}

.main .box .item {
  border: 1px solid #0E121D;
  border-radius: 6px;
  background: #0E121D;
  overflow: hidden;
  transition: all .3s;
  box-sizing: border-box;
}


/* 确保第一个和最后一个.item不受负边距影响 */
.main .box .item:first-child {
  margin-left: 0;
}

.main .box .item:last-child {
  margin-right: 0;
}

.main .box .ad-space {
  grid-row: span 2;
  grid-column: span 3;
  /* 跨两列 */
  width: 100%;
  height: 250px;
  background-color: #ccc;
  /* 广告背景色 */
  /* 其他广告样式 */
}

.main .box .item:hover {
  transform: translateY(-5px);
  border: 1px solid #e4ecf3;
  box-shadow: 1px 2px 3px #f2f6f8;
}

.main .box .item .no-logo {
  color: #3273dc;
  font-weight: bold;
  font-size: 14px;
}

.main .box .item .logo {
  width: 90px;
  height: 90px;
  position: relative;
  font-size: 14px;
  font-weight: 700;
  color: #3273dc;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 .1rem;
  margin: 0 auto;
  text-align: center;
}

.main .box .item .logo img {
  width: 90px;
  height: 90px;
  /* border-radius: 50%; */
  vertical-align: middle;

  /* 圆角显示 */
  border-radius: 9px;
  -webkit-border-radius: 9px;
  -moz-border-radius: 9px;
}

h5 {
  font-size: 10px;
  color: #fff;
  text-align: center;
  margin: 5px 0px;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: block;
}

/* .main .box .item .desc {
  color: gray;
  font-size: 12px;
  padding-top: 10px;
  height: 35px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
} */

a[target="right"] {
  text-decoration: none;
}

.navbarBox{
  width: 100%;
  height: 40px;
  background-color: #141A2A;

  display: flex; /* 使用Flexbox */
  align-items: center; /* 垂直居中 */
  padding: 0; /* 去掉按钮默认的填充，确保图标不被压缩 */
  justify-content: space-between; /* 在子元素之间分配空间 */
  box-sizing: border-box; /* 确保padding和border不会增加元素的总宽度 */
}

.navbarBox .Box{
  background-color: #141A2A;
  border: none;
}

/* ===================首页样式========================= */
/* 搜索框样式 */
.search-box-container {
  box-sizing: border-box;
  /* margin-top: 15px; */
  margin: 15px 0;
  display: flex;
  justify-content: center;
}

.search-box {
  box-sizing: border-box;
  width: 95%;
}

#search-input {
  padding: 10px;
  box-sizing: border-box;
  width: 100%;
  color: #fff;
  border: 2px solid #425461;
  border-radius: 10px;
  background-color: #273346;
  /* 点击后颜色 */
  outline-color: rgb(153, 153, 255);
  font-size: 15px;
  font-family: "Microsoft soft";
}

/* 轮播图 */
.carousel-container {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  max-width: 600px;
  height: 100px;
  overflow: hidden;
  border-radius: 20px;
  margin: 0 auto;
  /* border: 4px solid #FFFF66;
			-webkit-animation: twinkling 1s infinite ease-in-out; */
}

.carousel {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.carousel-item {

  min-width: 100%;
  box-sizing: border-box;
}

.carousel-item img {
  width: 100%;
  display: block;
}

button.prev,
button.next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0);
  color: white;
  border: none;
  padding: 5px;
  cursor: pointer;
  z-index: 10;
  user-select: none;
  box-sizing: border-box;
}

button.prev {
  left: 2px;
  color: rgba(0, 0, 0, 0.3);
  font-size: 1.5em;
}

button.next {
  right: 2px;
  color: rgba(0, 0, 0, 0.3);
  font-size: 1.5em;
}

@-webkit-keyframes twinkling {
  0% {
    border-color: #FFFF66;
    box-shadow: 0 0 10px rgba(0, 255, 0, .2), inset 0 0 10px rgba(0, 255, 0, .1), 0 1px 0 #393;
  }

  100% {
    border-color: #6f6;
    box-shadow: 0 0 25px rgba(0, 255, 0, .6), inset 0 0 15px rgba(125, 231, 125, 0.4), 0 1px 0 #6f6;
  }
}

/* 分类标签 */
.popular-section {
  width: 100%;
  height: 50px;
  /* 根据需要调整高度 */
  display: flex;
  /* 如果需要水平布局其他元素，可以使用flex */
  align-items: center;
  /* 垂直居中 */
  /* justify-content: center; */
  /* 水平居中（如果标题需要居中） */
  /* border: 1px solid #ccc; */
  /* background: rgb(37, 37, 37); */
}

.popular-title {
  margin: 0;
  /* 移除默认的margin */
  font-size: 1.5em;
  /* 根据需要调整字体大小 */
  color: rgb(255, 255, 255);
  /* 设置字体颜色 */
  text-align: center;
  /* 如果需要标题居中，虽然在这里可能由父容器的justify-content控制 */
  margin-left: 15px;
  font-weight: bold;
}


/* 首页游戏内容 */
.div_MainGame {
  /* display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box; */

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  grid-auto-rows: 22vh;
  gap: 10px 20px;
}

.div_MainGame>div {
  flex: 1 0 calc(30%);
  margin: 5px;
  box-sizing: border-box;
}

.item {
  /* 这个选择器针对每个游戏项目的内层div，即包含logo和标题的div */
  text-align: center;
  /* 文本居中 */
}

.logo img {
  max-width: 100%;
  /* 确保图片不会超出容器宽度 */
  height: auto;
  /* 保持图片比例 */
}

/* 显示更多按钮的样式 */
.show-more {
  width: 100%;
  /* 使按钮占据整行 */
  text-align: center;
  /* 文本居中 */
  /* margin-top: 20px; */
  /* 与上面的游戏项目保持一定间距 */
  /* padding: 10px 0; */
  /* 上下内边距 */
  /* background-color: #f0f0f0; */
  /* 可选：背景色 */
  /* border-top: 1px solid #ccc; */
  /* 可选：上边框 */
}

.show-more a {
  text-decoration: none;
  /* 去除下划线 */
  color: rgb(255, 255, 255);
  /* 可选：链接文字颜色 */
  /* padding: 5px 10px; */
  /* 可选：内边距，使点击区域更大 */
  display: inline-block;
  /* 使内边距生效 */
}

/* 分类边框 */
.divBorder{
  margin: 10px 0;
  /* background-color: black; */
  /* border-top: 2px solid;
  border-bottom: 2px solid;
  border-image: linear-gradient(to right, #ff6347, #ffa500) 1; */
}