@font-face {
  font-family: SYHT;
  src: url('思源黑体2.0-ExtraLight.otf') format('opentype');
  font-weight: 200;
  /* 定义轻字体的 font-weight 值 */
}

@font-face {
  font-family: SYHT;
  src: url('思源黑体2.0-Light.otf') format('opentype');
  font-weight: 400;
  /* 定义轻字体的 font-weight 值 */
}

@font-face {
  font-family: SYHT;
  src: url('思源黑体2.0-Regular.otf') format('opentype');
  font-weight: 400;
  /* 定义轻字体的 font-weight 值 */
}

@font-face {
  font-family: SYHT;
  src: url('思源黑体2.0-Medium.otf') format('opentype');
  font-weight: 500;
  /* 定义轻字体的 font-weight 值 */
}

@font-face {
  font-family: SYHT;
  src: url('思源黑体2.0-Bold.otf') format('opentype');
  font-weight: 700;
  /* 定义轻字体的 font-weight 值 */
}

@font-face {
  font-family: SYHT;
  src: url('思源黑体2.0-Heavy.otf') format('opentype');
  font-weight: 900;
  /* 定义轻字体的 font-weight 值 */
}

@font-face {
  font-family: SYHT;
  src: url('思源黑体2.0-Bold.otf') format('opentype');
  font-weight: 700;
  /* 定义轻字体的 font-weight 值 */
}

/* Thin 100
ExtraLight 200
Light 300
Regular 400
Medium 500
SemiBold    600
Bold   700
ExtraBold  800
Black  900 */
html,
body {
  margin: 0;
  padding: 0;
  font-family: 'SYHT';
  width: 100%;
  display: block;
}

a {
  text-decoration: none;
}

/* 修改滚动条样式 */
::-webkit-scrollbar {
  width: 0px;
  /* 设置滚动条宽度 */
  background-color: #fff;
  /* 设置滚动条背景色 */
}

/* 修改滚动条滑块样式 */
::-webkit-scrollbar-thumb {
  background-color: #eee;
  /* 设置滚动条滑块的背景色 */
  border-radius: 0px;
  /* 设置滚动条滑块的倒角 */
}

/* 修改滚动条轨道样式 */
::-webkit-scrollbar-track {
  background-color: #fff;
  /* 设置滚动条轨道的背景色 */
  border-radius: 0px;
  /* 设置滚动条轨道的倒角 */
}

/* 隐藏整个横向滚动条 */
::-webkit-scrollbar {
  height: 0;
}

/* 添加媒体查询：适配小于1024px的屏幕 */
@media screen and (max-width: 1024px) {
  .nav-container {
    width: 100%;
    /*设置全宽*/
  }

  .nav-item {
    flex-grow: 1;
    /* 让导航栏按钮在容器中平分剩余空间 */
    max-width: 33.33%;
    /* 设置一个最大宽度，3个按钮分别占用1/3、1/3、1/3 */
    text-align: center;
    /* 按钮文本居中 */
  }
}

/* 导航栏样式 */
#navbar {
  position: absolute;
  top: 0;
  left: 0;
  height: 80px;
  /* 修改高度为80px */
  width: 100%;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.9), transparent);
  /* 修改背景色：逐渐透明，不透明度0.3 */
  display: flex;
  align-items: center;
  justify-content: center;
  /* 修改布局：导航栏按钮居中对齐 */
  z-index: 3;
  transition: opacity 0.3s;
  /* 过渡效果，0.3秒内改变透明度 */
}

/* 导航栏容器 */
.nav-container {
  font-size: 24px;
  max-width: 1400px;
  display: flex;
  justify-content: space-around;
  width: 100%;
}

/* 导航栏每个项目样式 */
.nav-item {
  color: #fff;
  font-weight: bold;
  /* 默认字体不加粗 */
  cursor: pointer;
  background-color: transparent;
  /* 默认背景透明 */
  padding: 8px 12px;
  transition: all 0.3s;
  /* 添加过渡动画 */
  line-height: 60px;
}

.nav-item:hover {
  font-weight: bold;
  /* 鼠标移入时字体加粗 */
  background-color: rgba(0, 0, 0, 0.6);
  /* 鼠标移入时背景变深 */
}

.nav-item>a {
  color: #fff;
  text-decoration: none;
}

.nav-item img {
  vertical-align: middle;
  /* 图片垂直居中对齐 */
}
/* 导航栏样式 */
#navbar {
  position: absolute;
  top: 0;
  left: 0;
  height: 80px;
  /* 修改高度为80px */
  width: 100%;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.9), transparent);
  /* 修改背景色：逐渐透明，不透明度0.3 */
  display: flex;
  align-items: center;
  justify-content: center;
  /* 修改布局：导航栏按钮居中对齐 */
  z-index: 3;
  transition: opacity 0.3s;
  /* 过渡效果，0.3秒内改变透明度 */
}

/* 导航栏容器 */
.nav-container {
  max-width: 1400px;
  display: flex;
  justify-content: space-around;
  width: 100%;
}

/* 导航栏每个项目样式 */
.nav-item {
  color: #fff;
  font-weight: bold;
  /* 默认字体不加粗 */
  cursor: pointer;
  background-color: transparent;
  /* 默认背景透明 */
  padding: 8px 12px;
  transition: all 0.3s;
  /* 添加过渡动画 */
  line-height: 60px;
}

.nav-item:hover {
  font-weight: bold;
  /* 鼠标移入时字体加粗 */
  background-color: rgba(0, 0, 0, 0.6);
  /* 鼠标移入时背景变深 */
}

.nav-item>a {
  color: #fff;
  text-decoration: none;
}

.nav-item img {
  vertical-align: middle;
  /* 图片垂直居中对齐 */
}

/* 网站头部 */
.header {
  border-bottom: 1px solid #fff;
  height: 611px;
  text-align: center;
  line-height: 60px;
  font-size: 50px;
  color: #fff;
  top: 0;
  width: 100%;
  z-index: 100;
  background: url(../images/zzxl/zzxl_01.jpg) center no-repeat #000;
}

.nav-container {
  margin: 0 auto;
  max-width: 1400px;
  padding: 0 20px;
}

/* 给文字加阴影*/
.nav-title {
  color: #fff;
  font-size: 50px;
  font-weight: 700;
  width: 100%;
  text-align: center;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
  padding-top: 470px;
}
 /* 导航栏样式结束 */

 /*标题样式*/
h1 {
  margin-bottom: 1em;
  font-size: 3em;
  text-align: center;
}
.w1 .about-us-image:nth-child(1) {
  display: none;
}
/* menu */
.nav-warp {
  display: none
}

@media (min-width: 300px) and (max-width: 980px) {  
  /* CSS rules */  
  /* html {
    font-size: 14px;
  }
  div#navbar {
    display: none;
  }
  div.about-us-container,div.contact-us-container{
    display: block;
  }
  div.contact-us-image-container{
    width: 100%;
  }
  img.about-us-image{
    width: 100%;
  } */
  
}