*{
    box-sizing: border-box;
}
.main-box{
    padding-bottom:50px;
}
.proTitle{
    margin-top:50px;
}
.proTitle h1{
    font-size:30px;
    font-weight:700;
    color:#000;
}
.proTitle span{
    display:block;
    width:200px;
    height:2px;
    background:#000;
    margin:10px auto 10px;
}
.proNav{
    margin-bottom:50px;
}
.proNav li,.proNav li a{
    display:inline-block;
}
.proNav li a{
    padding:0 5px;
    color:#af772a;
    font-size:20px;
}
.proNav li a:hover,.proNav li.cur a{
    color:#000;
}
/*正文样式*/
div[class*='col']{
    padding:0;
}
.proContent{
    width:100%;
    margin:0 auto;
    display:none;
}
.proContent>div{
    position:relative;
    margin-bottom:20px;
}
.proContent>div a{
    display:block;
    width:100%;
}
.proPop{
    width:100%;
    height:100%;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    background:rgba(255,255,255,0.7);
    color:#000;
    display:none;
}
.proPop div.caption{

    width:100%;


}


.proPop{
    width: 100%;
}

.proPop div>span{
    font-size: 20px;
}
.on{
  display:block;
}
.thumbnail{
    border:none;
}

.proContent>div a {
    width: 100%;
    height: 100%;
}
.proContent>div a div{

    width: 100%;
    height:100%;
    margin: 0 auto ;
    text-align: center;
}
.proContent>div a div img{
    width: 100%;
    height:100%;
    display:block;
    margin:0 auto;
    float: none;
}
.proContent>div{
    position: relative;
}

.proPop h2{
    width:85%;
}
.proPop .caption{
    width: 100%;
    height: 100%;
    text-align: center;
    overflow: hidden;
    padding:0;
}
.proPop .caption h2{
    width: 200px;
    font-size: 50px;
    line-height: 30px;
    margin: 0 auto;
}
.proPop .caption h2{
    width:98%;
    font-size: 50px;
    margin: 0 auto;
}
@media screen and (max-width:1200px) {
    .proContent{
        width:100%;
    }
}

@media (max-width: 768px) { 
    .proContent>div{
        width: 100%;
        height: 100%;
         margin-left:0;
    }

.proContent>div a div>img{
    margin:0 auto;
    width:100%;
    height:100%;
  }
   .proPop .caption{
    position: relative;
   }
     .proPop .caption h2 ,  .proPop .caption span{
      position: absolute;
      top:30%;
     }
      .proPop .caption span{
        width: 95%;
        left:50%;
        -webkit-transform: translateX(-50%);
           -moz-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
             -o-transform: translateX(-50%);
                transform: translateX(-50%);
            top:45%;
            font-size: 35px;
      }
      .proTitle{
        margin-top:15px;
      }
      .proTitle span{
        height: 1px;
        margin:10px auto;
      }
      .proNav{
        margin-bottom: 26px;
      }
}
@media (max-width:640px){
       .proPop .caption h2{
           font-size:55px;
           top:30%;
        }
        .proPop .caption span{
            width: 100%;
           font-size:35px;
           top:45%;
           margin:0 auto;
           padding:0 20px;
        }
}
@media (max-width:480px){
       .proPop .caption h2{
           font-size:38px;
           top:30%;
        }
        .proPop .caption span{
            width: 100%;
           font-size:25px;
           top:47%;
           margin:0 auto;
           padding:0 20px;
        }
}

@media (max-width:320px){
       .proPop .caption h2{
           font-size:35px;
           top:20%;
        }
        .proPop .caption span{
            width: 100%;
           font-size:20px;
           top:40%;
           margin:0 auto;
           padding:0 20px;
        }
}

/*修改图片的大小结束=========================*/
@media (min-width:768px){
  .proPop{
    overflow:hidden;
  }
.proPop div.caption{
  position: absolute;
  top:30%;

}
  .proPop .caption h2{
    line-height: 60px;
  }
  .proPop .caption span{
    font-size: 30px;
  }
}
@media (min-width:992px){
.proPop div.caption{
  top:25%;
  font-size: 45px;
}
  .proPop .caption h2{
    line-height: 60px;
  }
  .proPop .caption span{
    font-size: 28px;
    display:block;
    line-height: 33px;
    width: 95%;
    margin:0 auto;


  }
}
@media (min-width:1200px){
  .proPop div.caption {
    top:30%;
 
  }
  .proPop .caption h2{
    line-height: 50px;
       font-size: 42px;
  }
  .proPop .caption span{
    font-size: 28px;

 }
}
@media (min-width:1360px){
  .proPop div.caption {
    top:30%;
 
  }
  .proPop .caption h2{
    line-height: 50px;
       font-size:45px;
       margin-bottom: 10px;
  }
  .proPop .caption span{
    font-size: 30px;
    margin:0 auto ;
  text-align: center;
  padding:0;
 }
}
@media (min-width:1600px){
  .proPop div.caption {
    top:33%;
 
  }
  .proPop .caption h2{
    line-height: 50px;
       font-size:50px;
  }
  .proPop .caption span{
    font-size: 35px;
    margin:0  auto;

 }
}
@media (min-width:1800px){
  .proPop div.caption {
    top:35%;
 
  }
  .proPop .caption h2{
    width: 85%;
    line-height:60px;
       font-size:65px;
  }
  .proPop .caption span{
    font-size: 35px;
    margin:0  auto;

 }
}