.proBox {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin-bottom:50px;
}

.proContainer {
    width: 100%;
    height: auto;
    overflow: hidden;
    font-size: 0px;
    margin: 1rem auto;
}

.proLi {
    position: relative;
    padding: 0;
    font-size: 14px;
    float: left;
}

.porTbox {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    border: 1px solid #d7d7d7;
    background-color: #ffffff;
}

.proImg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    transition: all .5s ease;
}

.porBbox {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 39px;
    padding: 20px 0px 0px;
    border: 1px solid #d7d7d7;
    text-indent: 10px;
    background-color: #ffffff;
    border-top: none;
}

.proTitle {
    font-size: 14px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.proSummry {
    color: #777;
    white-space: nowrap;
    overflow: hidden;
    margin: 10px 0;
    text-overflow: ellipsis;
}

.lookDetail {
    position: relative;
    display: block;
    color: #777;
    height: 38px;
    line-height: 38px;
    top: -29px;
}

.arrowsR {
    position: absolute;
    top: 50%;
    right: 27px;
    transform: translate(0, -50%);
    width: 30px;
}

.arrowsR img {
    position: absolute;
    transition: all .5s ease;
}

.harr {
    opacity: 0;
}

.showBox {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(0,0,0,.6);
    transition: all 0.5s ease;
}

.showBoxLink {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: block;
    width: 60%;
    color: #fff;
    text-align: center;
    font-size: 14px;
    padding: 0.5rem 0;
}


.showBoxLink:hover
{
    color:#ffffff;
}

.showBoxLink::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 1px;
    background: #fff;
    transition: all .5s ease;
}

.showBoxLink::after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 1px;
    background: #fff;
    transition: all .5s ease;
}

@media only screen and (min-width: 769px) {
    .proLi {
        height: 364px;
        margin-right: 12px;
        width: 23.9%;
        margin-top: 27px;
        margin-bottom: 42px;
    }

    .lookDetail:hover .barr {
        opacity: 0;
    }

    .lookDetail:hover .harr {
        opacity: 1;
    }

    .proLi:hover .showBox {
        opacity: 1;
    }

    .proLi:hover .proImg {
        transform: translate( -50%, -50%) scale(1.1);
    }

    .proLi:hover .showBoxLink::before {
        width: 1rem;
    }

    .proLi:hover showBoxLink::after {
        width: 1rem;
    }
}

@media only screen and (max-width: 1024px) and (min-width: 769px) {
    .proContainer {
        max-width:900px;
    }

    .proLi {
        width: 50%;
        height: 400px;
    }
}

.p_page .pre .iconfont:before {
    shadow-angle: 0px;
    shadow-distance: 0px;
    shadow-angle-ofInset: 0px;
    shadow-distance-ofInset: 0px;
}

.p_page .next .iconfont:before {
    shadow-angle: 0px;
    shadow-distance: 0px;
    shadow-angle-ofInset: 0px;
    shadow-distance-ofInset: 0px;
}

.p_more .iconfont:before {
    shadow-angle: 0px;
    shadow-distance: 0px;
    shadow-angle-ofInset: 0px;
    shadow-distance-ofInset: 0px;
}

.p_loading .iconfont:before {
    shadow-angle: 0px;
    shadow-distance: 0px;
    shadow-angle-ofInset: 0px;
    shadow-distance-ofInset: 0px;
}

{
    max-height: none;
    padding-top: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
    min-height: 0px;
    margin-right: 0px;
    margin-left: 0px;
    max-width: none;
    width: 100%;
    margin-top: 0px;
    margin-bottom: 0px;
    min-width: 0px;
    height: auto;
    padding-right: 0px;
}



.product_content {
	width: 1200px;
	overflow: hidden;
	margin: 0 auto;
}
.product_box {
	width: 100%;
	overflow: hidden;
	padding: 30px 0px 20px;
	margin: 0px 0 0px;
	float:left;
}
.product_box .box_title {
	width: 100%;
	height: 40px;
	overflow: hidden;
}
.box_title h4 {
	font-size: 18px;
	color: #4c4d52;
	line-height: 40px;
	float: left;
	font-weight: bold;
}
.product_search {
	width: 328px;
	height: 40px;
	overflow: hidden;
	float: right;
}
.product_search input {
	width: 240px;
	height: 40px;
	border: none;
	background-color: #f9f9f9;
	padding: 0 0 0 15px;
	font-size: 16px;
}
.product_search input::-webkit-input-placeholder { 
	color: #949494;
}
.product_search input:-moz-placeholder{ 
	color: #949494; 
}
.product_search input:-ms-input-placeholder{ 
	color: #949494;
}
.product_search input:placeholder{ 
	color: #949494;
}
.product_search button {
	width: 70px;
	height: 40px;
	border: none;
	background-color: #be1a1f;
	float: right;
	font-size:16px;
	color: #ffffff;
	font-weight:normal;
}
.product_list {
	width: 100%;
	overflow: hidden;
	margin: 25px 0 0;
	border-top: 1px solid #f0f0f0;
	padding: 30px 0 0;
}
.product_list a {
	display: block;
	width: calc(50% - 40px);
	width: -moz-calc(50% - 40px);
	width: -webkit-calc(50% - 40px);
	overflow: hidden;
	margin: 0 80px 40px 0;
	float: left;
}
.product_list a:nth-of-type(2n){
	margin: 0 0 40px;
}
.product_list a .list_img {
	width: 215px;
	overflow: hidden;
	float: left;
	border: 1px solid #eaeaea;
}
.list_img img {
	width: 100%;
	transition: all 1s;
}
.product_list a .list_txt {
	width: calc(100% - 255px);
	width: -moz-calc(100% - 255px);
	width: -webkit-calc(100% - 255px);
	overflow: hidden;
	float: left;
	margin: 0 0 0 40px;
	color: #888888;
	font-size: 16px;
}
.list_txt p {
	height: 80px;
	overflow: hidden;
}
.list_txt h4 {
	font-size: 18px;
	color: #4c4d52;
	line-height: 25px;
	height: 25px;
	margin: 15px 0 10px;
	overflow: hidden;
}
.list_txt span {
	display: block;
	color: #949494;
	width: 75px;
	overflow: hidden;
	margin: 40px 0 0;
	padding: 0 0 0 18px;
	background: url(../images/pl.png) no-repeat left center;
}
.product_list a:hover .list_img img {
	transform: scale(1.15);
}
.product_list a:hover .list_txt h4 {
	color: #f3f4f6;
}
.product_list a:hover .list_txt span {
	color: #f3f4f6;
}



.pro-con-list{ width: 96%; margin: 0 auto 35px auto;}
.pro-section-list{ width: 98%; margin:20px auto 10px auto;}
.pro-section-list li{float:left; min-width:98px;width:23.5%;text-align:left;font-size:16px; margin-bottom:15px; min-height: 30px;
padding: 0 10px 0 0;margin-left: 1%;}
.link_xx{ width: 100%; height: 2px; background: #be1a1f;}
.pro-section-list li a{  font-size:16px;color:#be1a1f; display:inline-block; font-weight: bold;}
.pro-section-list li:hover a{ /*border-bottom:3px solid #b8251d; padding-bottom:3px;*/color: #b8251d;}
.pro-section-list li.select{ /*border-bottom:3px solid #b8251d;padding-bottom:3px; */background: #b8251d;}
.pro-section-list li  a.select{ color: #b8251d;border-bottom: 2px solid #b8251d; padding-bottom:6px;}
.pro-item{ float:left; width:31.3%; cursor:pointer;background:#FFF; position:relative; margin-bottom: 30px; margin-left: 3%;}
.pro-item:nth-of-type(3n+1){ margin-left: 0}
.pro-item .tit{position:absolute; width:100%; left:50%; bottom:0px; font-size: 15px;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);}
.pro-item .tit{ display:block; width:82%; height:40px; background:#be1a1f; color:#FFF; margin:0 auto; line-height:40px; text-align:center; }

.pro-item-select{
background: -webkit-linear-gradient(#ffffff,#A2BFDF);
background: -o-linear-gradient(#ffffff,#A2BFDF);
background: -moz-linear-gradient(#ffffff,#A2BFDF);
background: linear-gradient(#ffffff,#A2BFDF);
-moz-box-shadow: 3px 3px 5px #888888;
box-shadow: 3px 3px 5px #888888;}




.porBbox {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 36px;
    padding: 20px 0px 0px;
    border: 1px solid #d7d7d7;
    text-indent: 10px;
    background-color: #ffffff;
    border-top: none;
}

.proTitle {
    font-size: 14px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.proSummry {
    color: #777;
    white-space: nowrap;
    overflow: hidden;
    margin: 10px 0;
    text-overflow: ellipsis;
}

.lookDetail {
    position: relative;
    display: block;
    color: #777;
    height: 38px;
    line-height: 38px;
    top: -29px;
}