@pic:#2C89DD;
.header_top{
  width: 100%;
  height: 207px;
  background: url("../images/h6.jpg") no-repeat center top;
  .top{
    text-align: left;
    height: 40px;
    line-height: 40px;
  }
  .box{
    height: 115px;
    .logo{
       margin-top: 10px;
    }
    .right{
      width: 250px;padding-left: 60px;
      height: 52px;
      background: url("../images/h5.png") no-repeat left center;
      p{
        line-height: 26px;
      }
      .txt1{
        font-size: 18px;
        color: #D6322D;
      }
      .txt2{
        font-size: 30px;
        color: black;
        font-weight: 600;
        letter-spacing: 1px;
      }
    }
  }
}
.header_nav{
  width: 100%;
  height: 52px;
  background: url("../images/h2.jpg") no-repeat center;
  text-align: center;
  li{
    display: inline-block;
    vertical-align: top;
    width: 145px;
    height: 52px;
     text-align: center;
    line-height: 52px;
    color: white;
    background: url("../images/h3.png") no-repeat left center;
    a{
      color: white;
      font-size: 16px;
    }
  }
  li:first-child{
    background: 0;
    margin-right: -4px;
  }
  li:hover,li.hover{
    background: url("../images/h1.jpg") no-repeat right;
    background-size: 144px 52px;
  }
  li:hover a,li.hover a{
     color: #1B1B1B;
  }
}

.product{
  width: 100%;
  height: 730px;
  background: url("../images/p2.png") no-repeat center;
  margin-top: -20px;
  position: relative;
  z-index: 10000;
  .nav{
    text-align: center;
    margin-top: 220px;
    p{
      display: inline-block;
      height: 50px;
      vertical-align: top;
      margin: 0 10px;
      a{
        display: block;
        height: 40px;
        line-height: 40px;
        padding: 0 24px;
        font-size: 18px;
        color: white;
        background: url("../images/d2.png") no-repeat;
        background-size: 100% 40px;
      }
    }
    p.hover{
      background: url("../images/d1.png") no-repeat bottom center;
      a{
        background: @pic;
      }
    }

  }
  .box{
    height: 382px;
    background: #F5F4F4;
    margin-top: 40px;
    li{
      display: none;
    }
    .left{
      width: 510px;
      padding:35px 43px 0;
      h2{
        font-size: 29px;
        color: @pic;
        line-height: 35px;
      }
      p.txt1{
        font-size: 23px;
        letter-spacing: 1px;
        height: 43px;
        border-bottom: 2px solid #B7B5B7;
        line-height: 30px;
        color: #B1B1B1;
      }
      .box1{
        padding: 30px 0 0 30px;
        font-size: 16px;
        line-height: 28px;
        color: #26272B;
        p{
          line-height: 28px;

        }

      }
    }
    .right{
      width: 604px;
    }
  }
}

.demo1{
  width: 100%;
  height: 428px;
  background: url("../images/p7.jpg") no-repeat center;
  margin-top: 15px;

}
.product_list{
  overflow: hidden;
  padding-top: 100px;
  ul{

    li{
      width: 294px;
      float: left;
      margin-right: 8px;
      .pic{
        display: block;
        width: 294px;
        height: 208px;
        overflow: hidden; margin-bottom: 10px;

        img:hover{
          transition: 0.4s;
          transform: scale(1.2);
        }
      }

      p{
        line-height: 26px;
        a{
          color: white;
        }
        text-align: center;
        font-size: 16px;
      }
    }
  }
}

.demo2{
  padding: 75px 0;
  text-align: center;
  background: #E1E1E1;
}

.demo3{
  width: 100%;
  height: 643px;
  position: relative;
  background: url("../images/i6.png") no-repeat center;
  margin-top: -91px;
  z-index: 8;
}


.demo4{
  width: 100%;
  margin-top: 60px;
  .tit{
    display: block;
    margin: 0 auto;
  }
  ul{
    width: 1280px;
    margin: 40px auto 0;
    text-align: center;
    li{
      display: inline-block;
      vertical-align: top;
      margin:14px;
    }
  }
}


.about{
  width: 100%;
  height: 684px;
  background: url("../images/a3.png") no-repeat center bottom;
  margin-top: -136px;
  position: relative;
  z-index: 8;
  .txt{
    width: 1150px;
    margin: 370px auto 0;
    color: white;
    font-size: 16px;
    p{
      line-height: 28px;
    }

  }
  .more{
    display: block;
    width: 148px;
    height: 48px;
    border: 1px solid white;
    border-radius: 5px;
    margin: 40px auto 0;
    text-align: center;
    line-height: 48px;
    color: white;
    font-size: 20px;
  }
}


.news{
  padding: 60px 0;
  background: #EEEEEE;
  .tit{
    display: block;
    margin: 0 auto;
  }
  ul{
    li{
      margin-top: 58px;
      float: left;
      width: 550px;
       .txt1{
         font-size: 20px;
         padding-left: 40px;
         line-height: 30px;
         height: 30px;
         background: url("../images/n2.png") no-repeat left center;
         a{
           color: #232323;
         }
         span{
           color: #232323;
         }
       }
      .txt2{
        font-size: 16px;
        padding-left: 40px;
        margin-top: 5px;
        line-height: 25px;
      }
    }
    li:nth-child(even){
      float: right;
    }
  }
}


.footer{
  padding-top: 10px;
  background: #181515;
  color: white;
  text-align: center;
  .footer_nav{
    width: 100%;
    text-align: center;
    line-height: 30px;
    a{
      color: white;
      font-size: 16px;
      padding: 0 20px;
    }
  }
  .footer_address{
    font-size: 16px;
    height: 60px;
    line-height: 60px;
  }
  .footer_bottom{
    width: 100%;
    height: 35px;
    background: black;
    line-height: 35px;
    color: white;
    strong{
      font-weight: 500;
      padding: 0 20px;
      a{
        color: white;
      }
    }
  }
}