@media screen and (min-width: 768px) {
  .main {
    width: 1200px;
    margin: 0 auto;
  }

  .banner {
    color: #fff;
    width: 100%;
  }

  .banner img {
    width: 100%;
  }

  .banner > div {
    margin-top: -54px;
  }

  .banner p {
    text-align: center;
    margin-bottom: 6px;
    letter-spacing: 2px;
    font-weight: bold;
  }

  .navs {
    position: relative;
    height: 102px;
    width: 100%;
    margin-top: 68px;
    background: url('../img/nav.png') no-repeat center;
    background-size: contain;
  }

  .navs a {
    position: absolute;
    bottom: 7px;
    width: 108px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 24px;
    color: #fff;
    border-radius: 8px;
  }

  .navs a:hover {
    box-shadow: 3px 3px 5px 0px #74B8FF, -3px -3px 4px 0px #74B8FF;
    background-color: #74B8FF;
  }

  .navs a:first-child {
    left: 212px;
  }

  .navs a:nth-child(2) {
    left: 386px;
  }

  .navs a:nth-child(3) {
    left: 560px;
  }

  .navs a:nth-child(4) {
    left: 736px;
  }

  .navs a:nth-child(5) {
    left: 910px;
  }

  .nav_item {
    width: 100%;
    margin-top: 45px;
    padding: 0 68px;
  }

  .nav_item .title {
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 16px;
  }

  .nav_item .des {
    line-height: 38px;
    text-indent: 2em;
    font-size: 20px;
  }

  .nav_item span {
    color: #999;
  }

  .nav_item .content:hover .des {
    text-decoration: underline;
  }

  #n1 {
    height: 633px;
    margin-top: 80px;
    padding-top: 128px;
    background: url('../img/n1.png') no-repeat center;
    background-size: contain;
  }

  #n2 {
    height: 633px;
    padding-top: 106px;
    background: url('../img/n2.png') no-repeat center;
    background-size: contain;
  }
  #n3 {
    padding: 0 70px;
    padding-top: 120px;
    height: 892px;
    background: url('../img/n3.png') no-repeat center;
    background-size: contain;
  }
  #n4 {
    padding-top: 166px;
    height: 1162px;
    background: url('../img/n4.png') no-repeat center;
    background-size: contain;
  }
  #n5 {
    padding-top: 190px;
    height: 1774px;
    background: url('../img/n5.png') no-repeat center;
    background-size: contain;
  }
  #n6 {
    padding-top: 138px;
    margin-bottom: 30px;
    height: 576px;
    background: url('../img/n6.png') no-repeat center;
    background-size: contain;
  }

  #n1 .item, #n2 .item, #n3 .item, #n5 .item {
    display: flex;
  }

  #n1 .item:first-child, #n2 .item:first-child  {
    margin-bottom: 40px;
  }

  #n1 img, #n2 img {
    width: 304px;
    height: 170px;
    margin-right: 36px;
  }

  #n3 .item {
    margin-bottom: 24px;
  }

  #n3 img, #n4 .imgs img, #n5 img {
    width: 326px;
    height: 180px;
    margin-left: 24px;
  }

  #n4 .content {
    margin-bottom: 38px;
  }

  #n5 .item {
    margin-bottom: 60px;
  }

  #n4 .imgs {
    display: flex;
    justify-content: space-between;
  }

  #n4 .imgs img {
    margin: 0;
  }

  #n6 {
    color: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
  }

  #n6 .item {
    flex: 50%;
    padding-left: 108px;
  }

  #n6 .item p {
    font-size: 26px;
  }

  #n6 .item p:first-child {
    font-size: 30px;
  }



}