.menu {
  border-radius: 5px;
  box-sizing: border-box;
  background-color: #292e32;
}

.menu dl {
  float: left;
  width: 100%;
  padding: 15px 0;
  border-top: 1px solid rgba(255, 255, 255, .1);
}

.menu dt,
.menu dd {
  float: left;
  line-height: 40px;
  text-align: center;
}

.menu dt {
  width: 8%;
  font-size: 15px;
  color: #777777;
}

.menu dt a {
  color: #fff;
}

.menu dt a:hover {
  color: #fff;
}

.menu dt:after {
  content: "";
  position: absolute;
  z-index: 1;
  margin: 13px 36px 0;
  width: 1px;
  height: 16px;
  background: rgba(255, 255, 255, .2);
}

.menu dd {
  width: 11.5%;
  font-size: 15px;
  color: #fff;
}

.menu dd a {
  color: #fff;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.menu dd a:hover {
  color: #fff;
}

/* 响应式：屏幕小于等于 750px */
@media screen and (max-width: 750px) {
  .menu {
    margin: 0px 0 0;
    border-radius: 0;
    padding: 0;
    width: 100%;
  }

  .menu dl {
    padding: 6px 0;
  }

  .menu dt {
    width: 14%;
    line-height: 60px;
    font-size: 14px;
  }

  .menu dt:after {
    margin: 22px 3% 0;
  }

  .menu dt2 {
    width: 14%;
    line-height: 30px;
    font-size: 15px;
    font-weight: 500;
  }

  .menu dt2:after {
    margin: 7px 3% 0;
  }

  .menu #subMenuBox {
    display: block !important;
  }

  .menu dd {
    width: 21.5%;
    line-height: 30px;
    font-size: 13px;
  }
}
/* ========== area ========== */
.area {
	width: 100% !important;
	max-width: 750px !important;
	margin: 0 auto
}

/* ========== links-top ========== */
.links-top {
	overflow: hidden;
	margin: auto;
	margin-bottom: 5px;
	background: #F5DEB3;
	margin-top: 5px
}

.links-top ul.icon-list {
	list-style: none
}

.links-top ul {
	list-style: none
}

.links-top ul li {
	float: left;
	padding: 5px 0;
	width: 10%;
	text-align: center
}

.links-top ul li img {
	margin: 0 auto;
	padding: 4px;
	width: 55px;
	height: 55px;
	border-radius: 5px
}

.links-top ul li a div {
	font-size: 10px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: bold;
	color: #f35626;
	background-image: -webkit-linear-gradient(92deg, #f35626, #feab3a);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	-webkit-animation: hue 10s infinite linear;
}

.links-top ul li a button {
	width: 0.57rem;
	height: 0.3rem;
	line-height: .3rem;
	margin: 0.2rem auto 0 auto;
	border: 1px solid #fff;
	border-radius: 0.8rem;
	color: white;
	background-color: #ff4ba1;
	font-size: 12px;
	margin-top: 5px;
	box-shadow: rgb(5 24 74 / 37%) 0px 2px 6px 0px;
	background-image: linear-gradient(125deg, #ff4ba1, orange, #8476ee, #00ff00);
	background-size: 400%;
	animation: bganimation 20s infinite
}

/* ========== animations ========== */
@-webkit-keyframes hue {
	from {
		-webkit-filter: hue-rotate(0deg);
		-moz-filter: hue-rotate(0deg)
	}

	to {
		-webkit-filter: hue-rotate(-360deg);
		-moz-filter: hue-rotate(-360deg)
	}
}

@keyframes bganimation {
	0% {
		background-position: 0% 50%
	}

	50% {
		background-position: 100% 50%
	}

	100% {
		background-position: 0% 50%
	}
}

/* ========== responsive ========== */
@media screen and (max-width:768px) {
	.links-element ul li {
		width: 33.3333%
	}

	.links-top ul.icon-list li {
		width: 20%
	}
}

@media screen and (max-width:544px) {
	.links {
		padding: 0 5px
	}

	.links-element ul li {
		width: 49%
	}

	.links-top ul.icon-list li {
		width: 20%
	}

	.icon-list {
		max-width: 82%;
	}
}