﻿.content{ width:1066px; overflow:hidden; margin:21px auto 25px auto;}
.box{ width:256px;height:231px; background:url(../img/box_bg.png) no-repeat; float:left; margin-left:14px;}
.box .title{ width:228px; height:28px; margin:2px auto 0 auto; background:url(../img/title.png) bottom no-repeat;}
.box .title span{ float:left; color:#1f1f1f; line-height:29px;}
.box .title em{ line-height:29px; font-size:12px;}
.box .title a{ float:right; line-height:29px; color:#605ca8; font-size:10px;}
.box .title a:hover{ color:#00adef;}

.about{ margin-left:0;}
.about img{ width:232px; height:76px;margin: 15px 0 9px 9px;}
.about  p.con{display:block;/* width:230px; */margin: 0 0 0 6px; overflow:hidden; line-height:25px; font-size:12px;}


.product-left{overflow:hidden; text-align:left; position:relative; width:220px;  margin:16px 0 0 16px; height:160px;  border:1px solid #d7d5d5;}
.product-left .hd{ overflow:hidden; position:absolute; top:70px; left:-1px; width:223px; height:26px;}
.product-left .hd .prev{ display:block; width:22px; height:26px; position:absolute; left: 1px; top: 0;  z-index:99;  overflow:hidden; cursor:pointer; background:url(../img/prev1.png) no-repeat;}
.product-left .hd .next{display:block;  width:22px; height:26px; position:absolute; right: 1px; top: 0;  z-index:99;   overflow:hidden; cursor:pointer;  background:url(../img/next1.png) no-repeat;}
.product-left .hd .prev:hover{  background:url(../img/prev2.png) no-repeat;}
.product-left .hd .next:hover{  background:url(../img/next2.png) no-repeat;}
.product-left .bd{ overflow:hidden;}

.product-left .bd ul{display:block;float:left; margin:0; padding:0; z-index:98;}
.product-left .bd ul li{ width:220px; height:160px; float:left; }
.product-left .bd ul li img{ width:220px; height:160px; float:left;}

.contact p.info{ margin:11px 0 0 14px; line-height:24px; color:#0a0a0a; font-size:12px;}
.contact span.mail{ background:url(../img/mail_bg.jpg) no-repeat; margin:20px  0 0 15px; padding-left:35px; font-size:10px; display:block; width:164px; height:23px; line-height:23px; color:#174f99;}
.contact span.qq{ background:url(../img/qq_bg.jpg) no-repeat; margin:7px  0 0 15px; padding-left:35px; font-size:10px; display:block; width:164px; height:23px; line-height:23px;color:#174f99;}



@media screen and (max-width:880px){
    .content{width: 92vw;padding: 4vw;margin: 0;}
    .box{width:100%;margin-bottom:20px;height: auto;float: none;background-size: cover;background-color: #f0f1f1;margin-left: 0;padding: 4vw;box-sizing: border-box;border-radius: 10px;}
    .box .title{width:100%;background-position-x: left;/* background-size: 100%; */position: relative;}
    .box .title:after{content:"";position:absolute;width:100%;height:1px;background:#e8e9e9;bottom:0;left:0;}
    .about img{width:100%;margin-left:0;height: auto;}
    .about p.con{width:100%;margin: 0;}
    .product-left{width:100%;margin-left:0;height: 220px;}
    .product-left .hd{width:100%;top: calc(50% - 13px);}
    .product-left .bd ul li{height: auto;width: 100%;}
    .product-left .bd ul li a{width:100%;height:auto}
    .product-left .bd ul li img{height: 220px;width: 100%;}
    .tempWrap{width: 100%!important;}
    .product-left .bd ul{display: flex;}
    .product-left .hd .prev,.product-left .hd .next{opacity:;margin-top:0}
}