/* header.css 文件中的媒体查询 */
@media screen and (max-width: 768px) {
  .container > .header .wrap .menu-wrap ul {
    font-size: 14px; /* 减小导航菜单文字大小 */
  }
  .container > .header .wrap .btn-wrap div {
    padding: 5px 10px; /* 调整按钮内边距 */
    font-size: 12px; /* 减小按钮文字大小 */
  }
  .container > .header .wrap .btn-wrap div:not(:last-child) {
    padding: 5px 15px; /* 增加按钮内边距 */
  }
  .container > .header .wrap .menu-wrap > ul > li {
    margin: 0 5px; /* 调整菜单项之间的间距 */
  }
  .container > .header .wrap .menu-wrap > ul > li.active::after {
    display: none; /* 移除活动菜单项下方的装饰线 */
  }
}


* {
  margin: 0;
  padding: 0;
  font-family: Avenir, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB","Helvetica Neue", Helvetica, Arial, "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
}

.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

html, body {
  height: 100%;
  width: 100%;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
}

a:active {
  color: inherit;
}

a:visited {
  color: inherit;
}

a:link {
  color: inherit;
}

a:hover {
  color: inherit;
}

.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
.container {
/*  height: 100%;
  width: 100%;  */
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.container > .header {
  height: 120px;
  width: 100%;
  background-color: transparent;
  position: fixed;
  top: 0; 
  z-index: 99;
  transition: all 0.2s ease;
}

.container > .header.active {
  height: 70px;
  background-color: #4633af;
  transition: all 0.2s ease;
  box-shadow: 0 6px 3px 0 rgba(0, 0, 0, 0.1);
}

.container > .header > .wrap {
  width: 1280px;
  height: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  
}
.container > .header > .wrap > .logo > img {
  vertical-align: middle;
}
.container > .header > .wrap > .logo > img:first-child {
  height: 36px;
  margin-right: 16px;
}
.container > .header > .wrap > .logo > img:last-child {
  height: 36px;
}
.container > .header > .wrap > .menu-wrap {
  display: flex;
  align-items: center;
}

/* 移动端汉堡菜单 - 默认隐藏 */
.mobile-menu-btn {
  display: none;
}

.container > .header > .wrap > .menu-wrap > ul {
  display: flex;
  height: 100%;
  font-size: 20px;
  color: #fff;
  justify-content: space-around;
  align-items: center;
  font-weight: bold;
}

.container > .header > .wrap > .menu-wrap > ul > li {
  height: 30px;
  margin: 0 10px;
  cursor: pointer;
}

.container > .header > .wrap > .menu-wrap > ul > li.active {
  color: #FDCE15;
  font-weight: bold;

}

.container > .header > .wrap > .menu-wrap > ul > li.active::after {
  content: '';
  display: block;
  height: 1px;
  width: 80%;
  background-color: #FDCE15;
  margin: 3px auto 0 auto;
}

.container > .header > .wrap > .menu-wrap > .btn-wrap {
  display: flex;
  align-items: center;
}

.container > .header > .wrap > .menu-wrap > .btn-wrap > div {
  margin: 0 10px;
  margin-bottom: 6px;
}

.container > .header > .wrap > .menu-wrap .btn-wrap div {
  transition: background-color 0.3s, border-color 0.3s;
}

.container > .header > .wrap > .menu-wrap > .btn-wrap > div:not(:last-child) {
  padding: 3px 20px;
  font-size: 1.125rem;
  font-weight: normal;
  color: #ffffff;
  border-radius: 7px;
  cursor: pointer;
  border: 1.5px solid #ffffff;
  transition: all 1s;
}
.container > .header > .wrap > .menu-wrap > .btn-wrap > div:nth-of-type(1):hover {
  background-color: #3E8EF1;
  border: 1px solid #3E8EF1;
  transition: all 1s;
}
.container > .header > .wrap > .menu-wrap > .btn-wrap > div:nth-of-type(2):hover {
  background-color: #ff993a;
  border: 1px solid #ff993a;
  transition: all 1s;
}

.container > .header > .wrap > .menu-wrap > .btn-wrap > .flag-wrap {
  font-size: 2.125rem;
}
