html,
body {
  font: 14px/1.571429 'Microsoft YaHei', 'Droid Sans', 'wenquanyi micro hei',
    sans-serif;

  color: #76838f;

  margin: 0;

  width: 100%;

  max-width: 100%;

  min-width: 320px;

  min-height: 100%;
}

body {
}

ul,
li {
  list-style: none;
}

dl,
ol,
ul {
  margin-top: 0;

  margin-bottom: 0;

  padding-left: 0;
}

a {
  text-decoration: none;

  color: #333;
}

input,
button {
  outline: none;
}

#nav {
  position: fixed;

  top: 0;

  left: 0;

  height: 90px;

  background-color: #fff;

  display: flex;

  width: 100%;

  align-items: center;

  padding: 0 30px;

  z-index: 99;

  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

#nav .container-fluid {
  width: 76%;

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 0;
}

#nav .navlist ul {
  display: flex;

  align-items: center;
}

#nav .navlist > ul > li {
  position: relative;

  margin-right: 20px;

  height: 90px;

  display: flex;

  justify-content: center;

  align-items: center;
}

#nav .navlist > ul > li.active {
  border-bottom: 2px solid #007934;
}

#nav .navlist > ul > li > a {
  display: block;

  padding: 7.5px 8px;
  font-size: 17px;
  color: #333;
}

#nav .navlist > ul > a i {
  font-size: 12px;
}

#nav .navlist > ul > li .submenu {
  position: absolute;

  display: none;

  top: 101%;

  right: 0;

  background-color: #fff;

  z-index: 12;
}
@media (min-width: 767px) {
  #nav .navlist > ul > li:hover .submenu {
    display: block;
    z-index: 9999;
  }
}

#nav .navlist > ul > li .submenu > ul {
  display: flex;

  flex-wrap: wrap;
}

#nav .navlist > ul > li .submenu > ul li {
  position: relative;

  width: 180px;

  line-height: 35px;

  border-bottom: 1px solid #e0e0e07a;

  text-align: center;
}

#nav .navlist > ul > li .submenu > ul li a {
  display: flex;

  width: 100%;

  justify-content: center;

  padding: 0 14px;

  color: #333;
}

#nav .navlist > ul > li .submenu > ul li:hover .lastmenu {
  display: block;
}

.submenu .lastmenu {
  position: absolute;

  top: 0px;

  left: 100%;

  background-color: #fff;

  display: none;
}

.submenu .lastmenu ul {
  display: flex;

  flex-wrap: wrap;

  width: 200px;
}

.submenu .lastmenu ul li {
  width: 200px;

  line-height: 30px;

  border-left: 1px solid #e0e0e07a;

  border-bottom: 1px solid #e0e0e07a;

  padding-left: 10px;
}

.logo {
  width: 180px;

  height: 60px;
}

#nav .search {
  position: relative;
}

#nav .search:hover .searchBox {
  display: block;
}

#nav .search .searchBox {
  display: none;

  position: absolute;

  top: 100%;

  right: -25px;

  width: 230px;

  height: 40px;

  background: #007934;

  transition: all 0.3s;
}

#nav .search .searchBox::after {
  position: absolute;

  top: -20px;

  right: 18px;

  content: '';

  display: block;

  width: 0;

  height: 0;

  line-height: 0;

  border: 10px solid transparent;

  border-bottom-color: #007934;
}

#nav .search .searchBox form {
  display: flex;

  flex-wrap: nowrap;

  height: 100%;
}

#nav .search .searchBox input {
  width: 75%;

  height: 100%;

  border: none;

  background: transparent;

  padding: 0 15px;

  color: #aeb1b3;
}

#nav .search .searchBox button {
  width: 25%;

  border: none;

  background: transparent;

  padding: 0 5px;
}

footer {
  padding: 40px 0;

  background-color: #000;
}

footer p {
  color: #999;
}

footer p a {
  color: #999;
}

#nav .m-searchBox {
  display: none;
}

#nav .menu {
  display: none;
}

.paged {
  padding-top: 40px;

  display: flex;

  justify-content: center;

  align-items: center;
}

.mml-page,
.mml-ellipsis {
  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  display: inline-block;

  line-height: 20px;

  min-width: 20px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  text-align: center;
}

.mml-page {
  width: 30px;

  height: 30px;

  font-family: din-2014, sans-serif;

  font-weight: 400;

  font-style: normal;

  font-size: 14px;

  line-height: 30px;

  text-align: center;

  color: #4d4d4d;

  cursor: pointer;

  margin: 0 5px;
}

.mml-active,
.mml-page:hover {
  background-color: #007934;

  -webkit-box-shadow: 0px 8px 18px 0px rgba(67, 235, 75, 0.3);

  box-shadow: 0px 8px 18px 0px rgba(67, 235, 75, 0.3);

  color: #fff !important;
}

.mml-page.mml-page-next,
.mml-page.mml-page-prev {
  width: auto;

  height: auto;

  color: #888 !important;

  background-color: transparent !important;

  font-size: 12px;

  -webkit-box-shadow: none !important;

  box-shadow: none !important;

  margin: 0 10px;

  font-weight: 600;
}

.mml-page.mml-page-next i::before,
.mml-page.mml-page-prev i::before {
  font-weight: 900 !important;
}

.breadCrumb {
  height: 40px;

  line-height: 40px;

  background-color: #fff;
}

.breadCrumb a,
.breadCrumb span {
  color: #333 !important;
}

.breadCrumb svg {
  vertical-align: text-bottom;
}

.breadCrumb .container {
  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;
}

.topping {
  display: none;

  position: fixed;

  right: 10px;

  bottom: 10vh;

  background-color: #007934;
}

.topping i::before {
  width: 100%;

  text-align: center;

  font-size: 30px;

  display: inline-block;

  width: 40px;

  height: 40px;

  line-height: 40px;

  color: #fff;
}

@media (max-width: 767px) {
  #nav {
    padding: 0 20px;
  }

  #nav .container-fluid {
    width: 100%;
  }

  #nav .navlist {
    /* display: none; */
  }

  #nav .m-searchBox {
    display: block;
  }

  #nav .menu {
    display: block;

    font-size: 25px;

    padding: 5px;
  }

  .m-searchBox {
    height: 40px;
  }

  .m-searchBox input,
  .m-searchBox button {
    border: none;

    border-radius: 40px;

    height: 40px;

    background: #e0e0e07a;
  }

  .m-searchBox input {
    padding: 0 20px;

    width: 65%;

    color: #777777;
  }

  .m-searchBox button {
    width: 40px;

    height: 40px;
  }

  .m-searchBox input,
  .m-searchBox form {
    display: flex;
  }

  #nav .navlist > ul > li.active {
    border: none;
  }

  #nav .navlist > ul > li.active a {
    color: #007934;
  }

  #nav .navlist {
    position: absolute;

    top: 100%;

    left: 0;

    width: 100%;

    height: calc(100vh - 80px);

    padding-bottom: 20px;

    background-color: #fff;

    display: none;

    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);

    overflow: auto;
  }

  #nav .navlist ul {
    display: block;

    width: 100%;
  }

  #nav .navlist ul li {
    width: 100%;
  }

  #nav .navlist > ul > li {
    display: block;

    padding-left: 20px;

    justify-content: flex-start;

    height: auto;
  }

  #nav .navlist > ul > li i {
    padding: 5px 0;

    padding-left: 5px;

    padding-right: 8px;
  }

  #nav .search {
    display: none !important;
  }

  #nav .navlist > ul > li > a {
    display: inline-block;

    padding-left: 6px;
  }

  #nav .navlist > ul > li .submenu {
    position: static;
  }

  #nav .navlist > ul > li .submenu > ul {
    display: block;
  }

  #nav .navlist > ul > li .submenu > ul li {
    width: 100%;

    text-align: left;
  }

  #nav .navlist > ul > li .submenu > ul > li > a {
    display: block;

    padding-left: 20px;
  }

  .submenu .lastmenu {
    position: static;

    display: block;

    border: none;
  }

  #nav .submenu .lastmenu li a {
    padding-left: 30px !important;

    display: block !important;
  }

  #nav ul li {
    border: none !important;
  }

  footer {
    padding: 40px 20px;
  }
}
