@charset "UTF-8";
.menu-bar {
  display: none;
}

.btn-menu {
  position: relative;
  width: 30px; /* 设置图标的宽度 */
  height: 20px; /* 设置图标的高度 */
  box-sizing: border-box;
}
.btn-menu span {
  display: block;
  position: absolute;
  height: 3px; /* 设置每条横线的高度 */
  width: 100%; /* 设置每条横线的宽度为容器的100% */
  background: #FDD000; /* 设置横线的颜色 */
  border-radius: 1.5px; /* 可选：为横线添加圆角 */
  opacity: 1; /* 设置横线的透明度 */
  left: 0; /* 确保横线从容器的左侧开始 */
  transform: rotate(0deg); /* 初始时，不旋转横线 */
  transition: 0.25s ease-in-out; /* 添加过渡效果，使动画更平滑 */
}
.btn-menu span:nth-child(1) {
  top: 0; /* 第一条横线的位置 */
}
.btn-menu span:nth-child(2), .btn-menu span:nth-child(3) {
  top: 9px; /* 第二条和第三条横线的位置（堆叠在一起） */
}
.btn-menu span:nth-child(4) {
  top: 18px; /* 如果需要第四条横线，可以这样设置其位置 */
}

.is-open span:nth-child(1), .is-open span:nth-child(4) {
  width: 0;
  left: 50%;
}
.is-open span:nth-child(2) {
  transform: rotate(45deg);
}
.is-open span:nth-child(3) {
  transform: rotate(-45deg);
}

.header {
  width: 100%;
  z-index: 99;
  position: fixed;
  left: 0;
  top: 0;
  background: #fff;
}
.header .main {
  height: 8rem;
}
.header .logo {
  width: 12.9rem;
}

/*  滚动后 显示的阴影分割线 */
.header.active {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.nav > ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.nav > ul li a {
  font-size: 1.6rem;
  color: #333;
  padding: 0 1.6rem;
}
.nav > ul li:hover a,
.nav > ul .cur a {
  color: #FDD000;
  font-weight: bold;
}

@media (max-width: 1025px) {
  .menu-bar {
    display: block;
  }
  .nav {
    background: #fff;
    display: none;
    position: fixed;
    left: 0;
    top: 8rem;
    width: 100%;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  }
  .nav > ul {
    display: flex;
    flex-direction: column;
  }
  .nav > ul li {
    text-align: center;
  }
  .nav > ul li a {
    line-height: 5rem;
  }
}

/*# sourceMappingURL=header.css.map */