﻿/* 初始化 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 头部导航栏 */
.nav-part {
  position: relative;
  height: 868px;
}

.logo {
  display: inline-block;
  width: 200px;
  height: 82px;
}

.logo:hover{
  cursor: pointer;
}

.nav {
  display: flex;
  justify-content: space-between;
  height: 82px;
  opacity: 1;
  transition: opacity 0.5s linear;
}
.nav:hover{
  background: linear-gradient(to bottom, #34352D, transparent);
  opacity: 0.8;
}
.nav-space {
  display: inline-block;
  width: 80px;
  height: 82px;
}

.nav-list {
  display: inline-block;
  width: 840px;
  height: 82px;
}
.nav-list-ul {
  display: flex;
}
.nav-list-item {
  display: inline-block;
  width: 140px;
  height: 82px;
  line-height: 82px;
  text-align: center;
  font-size: 18px;
  color: #fff;
  position: relative;
}
.nav-list-item > a {
  color: #fff;
}
.nav-list-item > a:hover {
  cursor: pointer;
  color: #ffd489;
  text-decoration: none;
}

.nav-list-item::after{
  position: absolute;
  display: block;
  width: 5px;
  height: 30px;
  content: "";
  background: url("../image/menu-separator.png");
  margin-top: -56px;
}

.nav-video{
  position: absolute;
  width: 100%;
  /* height: 996px; */
  top: 0;
  z-index: -1;
}

/* 核心内容栏 */
.main-part {
  height: 2790px;
  background-image: url("../image/bg-img.jpg");
}

.main-separator {
  height: 24px;
}

/* 核心内容栏第一行 */
.main-row1 {
  width: 1200px;
  height: 400px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

.row1-part {
  display: inline-block;
}

/* 核心内容栏第二行 - 左 */
.main-row1-left {
  width: 180px;
  background: #f3cc97;
}

.row1-left-fn {
  height: 80px;
  line-height: 80px;
  text-align: center;
  border: 2px solid #cfa56b;
}

.row1-left-fn > a {
  color: #8d5238;
  font-size: 24px;
}

.row1-left-fn > a:hover {
  cursor: pointer;
  color: #fff;
}

/* 核心内容栏第二行 - 中 */
.main-row1-center {
  width: 722px;
}

.main-row1-center > img {
  width: 100%;
  height: 100%;
}

/* 核心内容栏第二行 - 右 */
.main-row1-right {
  width: 260px;
  height: 400px;
  background: #973f38;
}

.row1-right-top {
  width: 260px;
  height: 326px;
}

.row1-right-bottom {
  width: 260px;
  height: 74px;
  line-height: 74px;
  text-align: center;
  font-size: 18px;
  background: #f5cf8f;
  color: #8d5238;
}

/* 核心内容栏第二行 */
.main-row2 {
  width: 1200px;
  height: 1600px;
  margin: 0 auto;
  /* background: blue; */
  display: flex;
  justify-content: space-between;
}

.row2-part {
  display: inline-block;
}

/* 核心内容栏第二行 - 左 */
.main-row2-left {
  width: 180px;
  height: 395px;
  background: url("../image/left.jpg");
}

/* 核心内容栏第二行 - 中 */
.main-row2-center {
  width: 728px;
  height: 1600px;
  /* background: hotpink; */
  border: 1px solid #ccc;
}

.main-row2-center-server {
  width: 728px;
  height: 312px;
}

.server-header {
  display: flex;
  height: 40px;
  background: linear-gradient(45deg, #973f38, #7c623f);
}

.server-table-th {
  display: inline-block;
  width: 182px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border: 1px solid #281c17;
  color: #ffffff;
}

.server-table {
  display: flex;
  height: 68px;
}

.server-table-td {
  display: inline-block;
  width: 182px;
  height: 68px;
  line-height: 68px;
  text-align: center;
  border: 1px solid #281c17;
}

.td-download > a:hover {
  cursor: pointer;
  color: #941313;
}

.server-table-open {
  background: #f5d168;
}

.main-row2-center-introduce {
  margin-top: 16px;
  font-size: 14px;
  color: #9a3f37;
  padding-left: 36px;
  padding-right: 36px;
}

/* 核心内容栏第二行 - 右 */
.main-row2-right {
  width: 260px;
  height: 394px;
  background: url("../image/right.jpg");
}

/* 底部栏 */
.footer-part {
  height: 74px;
  background: F0F0F0;
}

.bg-footer {
  height: 10px;
  background: url("../image/bg-footer.png");
}

.footer-tip {
  height: 64px;
  line-height: 64px;
  text-align: center;
  font-size: 16px;
  color: #8e8e8e;
}
