/*Í¨ÓÃ*/
.box1{background-color:#EDEDED; width:100%; padding-top:30px;}
.box2{width:80%; margin:0 auto; background-color:#fff; padding:2%;}
/*left*/
.left{float:left; width:20%;}
.left .nav_line .head1{text-align:center; background-color:#00a29c;}
.left .nav_line .head1 h1{font-weight:bold;  color:#fff;  line-height:70px; }
.left ul{border:1px solid #00a29c;}
.left .nav_line li{text-align:center; line-height:50px; height:50px; overflow:hidden; border-bottom:1px dashed #666;}
.left .nav_line li a{color:#1a1a1a; font-size:14px; font-weight:bold; width:100%; display: inline-block}
.left .nav_line li:hover a{background-color:#e6a200; color: #fff;}
.left .phone{padding-top:20px;}
.left .phone h1{font-size:18px; color:#fff; line-height:60px; font-weight:bold; text-align:center; background-color:#00a29c;}
.left .phone .line{padding:10px;}
.left .phone .line li{line-height:30px;}
/*right*/
.right{float:right; width:78%; margin-left:1%; border:1px solid #ccc}
.right .head{border-bottom:2px solid #00a29c; }
.right .head h1{float:left; font-size:18px; font-weight:bold; padding-left:40px; line-height: 50px; color:#1a1a1a;
    background:url("../img/icon5.png") no-repeat 10px center}
.right .link{float:right;padding-right:1%;}
.right .link span,.right .link a,.right .link p{float:left; line-height: 50px;}
.right .link span,.right .link p{color:#999;}
.right .link a{color:#e6a200}
.right .link a:hover{color:#8f1f20;}
@media screen and (max-width:768px){
    .box1{padding-top:10px;background-color:#fff}
    .box2{width:96%}
    .left{width:100%;}
    .left .nav_line .head1 h1{ background:none;}
    .left .nav_line li{background:none; float:left; width:50%; line-height:40px; height:40px;}
    .left ul li a{font-size:14px}
    .left .phone{display:none}
    .right{ width:100%; margin-left:0; margin-top:20px;}
    .right .link{display:none}
}
@media screen and (max-width:1024px) and (min-width:769px){
    .box2{width:98%; padding:0;}
    .left{ width:20%;}
    .left .phone h1{ background-position:15px center}
}
/*foot1*/
.foot{width:24%; margin:20px auto;}
.foot .current{background-color:#999; color:#fff;}
.foot li a {float:left; width:20px; height:20px; text-align:center; border:1px solid #999; line-height:20px;
    margin-left:5px;}
.foot li a:hover{background-color:#999;color:#fff;}
.foot .last{float:left; line-height:22px; padding-left:5px;}
@media screen and (max-width:768px){
    .foot{width:100%}
}
@media screen and (max-width:1024px) and (min-width:768px){
    .foot{width:34%}
}
/*about*/
.about{margin:1%;}
.about p{text-indent:2em;font-size:14px;line-height:28px;}
.about img, .about p img { max-width: 100%; width: auto; margin: 0 auto; display: block;}
/*news*/
.news{margin-top:20px;}
 .news li{ border-bottom: 1px dashed #ccc; padding:0 40px 0; line-height:42px; height:42px; overflow:hidden;
     background:url("../img/news01.png") no-repeat 15px center}
.news li span{color:#ccc; float:right;margin-left:10px; }
.news li:hover{background-color: #f0f0f0; }
.news li:hover a{color:#e6a200; font-weight:bold }
@media screen and (max-width:768px){
     .news li{background:none; padding:0 10px;}
}
@media screen and (max-width:1024px) and (min-width:768px){
    .news li{padding:0 3% 0 5%}
}
/*news01_child*/
.news_child{margin:1%; padding-top:10px;}
.news_child h2{font-size:16px; color:#000; text-align:center}
.news_child h3{ color:#e6a200; float:left; padding:0 22%; line-height: 40px; font-size:14px;}
.news_child h4{color:#e6a200; float:left; line-height: 40px; font-size:14px;}
.news_child p{text-indent:2em; line-height:28px; font-size:14px;}
.news_child p img { width: auto; max-width: 100%; height: auto; margin: 0 auto; display: block;}
.page{border-top:1px dashed #ccc; padding:1%;}
.page li{line-height:30px;}
.page li p{float:left; }
.page li a{color:#e6a200;}
.page li a:hover{border-bottom:1px solid #e6a200;}
@media screen and (max-width:768px){
    .news_child h3{padding:0 8%;}
}
@media screen and (max-width:1024px) and (min-width:769px){
    .news_child h3{padding:0 20%;}
}
/*product*/
.products{margin-left:2%}
.products li{float:left; width:22.7%; height:210px; margin-top:2%; margin-right:2%; border:1px solid #dadada; overflow:hidden;
    position:relative; }
.products li img{width:100%; height:210px; transition:all 0.5s;}
.products li p{background-color:#000; font-size:14px; color:#fff; text-align: center; line-height:40px;
    position:absolute; left:0; bottom:0; width:100%; opacity:0.7; height:40px; overflow:hidden;}
.products li:hover img{width:110%; height:110%;}
@media screen and (max-width:768px){
    .products li{ width:30.6%; height:110px;}
    .products li p{ line-height:30px;height:30px;}
    .products li img{ height:110px}
}
@media screen and (max-width:1024px) and (min-width:768px){
    .products li{ width:31%;}
}
/*ÈÙÓþ*/
.honors{margin-left:2%}
.honors li{float:left; width:22.7%; height:195px; margin-top:2%; margin-right:2%; border:1px solid #dadada; overflow:hidden;
    position:relative; }
.honors li img{width:100%; height:195px;}
.honors li .word{background-color:#000; font-size:14px; color:#fff; text-align: center; position:absolute; left:0; bottom:0;
    width:100%; opacity:0.7; height:40px; overflow:hidden;  transition:all 0.6s;}
.honors li h3{height:40px; line-height:40px; overflow:hidden; padding:1%}
.honors li p{height:20px; overflow:hidden; padding:1%}
.honors li:hover .word{height:100%;}
.honors li:hover h3{padding-top:60px;}
@media screen and (max-width:768px){
    .honors li{ width:30.6%; height:110px;}
    .honors li p{ line-height:30px;height:30px;}
    .honors li img{ height:110px}
}
@media screen and (max-width:1024px) and (min-width:768px){
    .honors li{ width:31%;}
}
/*Éè±¸*/
.equipment{margin-left:2%}
.equipment li{width:22.7%; float:left; margin-top:2%; margin-right:2%; cursor: pointer; background-color:#e5e5e5;
    border:1px solid transparent;}
.equipment li:hover{background-color:#e6a200;  border:1px solid #e6a200;}
.equipment img{width:100%; height:210px;}
.equipment li p{ font-size:14px; color:#1a1a1a; text-align:center; line-height:30px;
    height:30px; overflow:hidden;}
.equipment li:hover p{color:#fff;}
@media screen and (max-width:768px){
    .equipment li{ width:30.6%;}
    .equipment li img{ height:110px}
}
@media screen and (max-width:1024px) and (min-width:768px){
    .equipment li{ width:31%;}
}
/*ÁôÑÔ*/
.note form { width: 80%; margin: 20px auto; text-align: center; }
.note form table { display: inline-block; }
.note form h4 { font-size: 24px; font-weight: bold; color:#e6a200; margin-bottom: 30px; }
.note form input, .note form textarea, .note form select { width: 400px; height: 35px; border: 1px solid #ddd; color: #333;
    font: 14px "microsoft yahei", Arial, Helvetica, sans-serif; }
.note form textarea { height: 150px; }
.note form .submit { width: 120px; height: 50px; border-radius: 5px; background: #e6a200; color: #fff; font-size: 16px; }
.note form .submit:hover { box-shadow: 0 0 5px; }
.note form tr td { height: 50px; }
.note form tr .td1 { width: 80px; text-align: right; }
@media (max-width: 1024px) and (min-width: 768px) {
    .note form { width: 100%; }
}
@media (max-width: 767px) {
    .note form { width: 100%; }
    .note form h4 { font-size: 20px; }
    .note form input,.note form textarea,.note form select { width: 180px; font-size: 13px; }
    .note form textarea { height: 120px; }
    .note form .submit { height: 40px; }
    .note form tr td { height: 40px; }
}