@charset "utf-8";
/* CSS Document */

#products { margin: 0 auto; padding: 80px 0px 80px 0px; }
.probox { display: flex; justify-content: space-between; align-items: start; }

/* 产品展示 */
#products .list { flex: 1; margin-left: 45px; }
#products .list ul li { width: calc((100% - 143px)/4); margin: 0 45px 45px 0; float: left; border: 1px solid #e6e7e7; transition: all .3s; }
#products .list ul li:nth-child(4n) { margin: 0 0 45px 0; }
#products .pro_details { flex: 1; margin-left: 45px; }

@media (max-width:1199.98px) {
.probox { flex-direction: column; }
#products .list { margin-left: 0px; margin-top: 30px; width: 100%; }
#products .list ul li:nth-child(4n) { margin: 0 30px 30px 0; }
#products .list ul li { width: calc((100% - 66px)/3); margin: 0 30px 30px 0; }
#products .list ul li:nth-child(3n) { margin: 0 0 30px 0; }
#products .pro_details { margin-left: 0px; margin-top: 30px; width: 100%; }
}

@media (max-width:767.98px) {
#products .list ul li:nth-child(3n) { margin: 0 30px 30px 0; }
#products .list ul li:nth-child(4n) { margin: 0 30px 30px 0; }
#products .list ul li { width: calc((100% - 34px)/2); margin: 0 30px 30px 0; }
#products .list ul li:nth-child(2n) { margin: 0 0 30px 0; }
}

#products .list ul li .tit { display: flex; align-items: center; justify-content: center; height: 50px; text-align: center; transition: all .3s; background: #F7F7F7; }
#products .list ul li .tit p { color: #333333; padding: 0 10px; line-height: 23px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: all .3s; }
#products .list ul li:hover { border: 1px solid #114fb7; }
#products .list ul li:hover .tit { background: #114fb7; }
#products .list ul li:hover .tit p { color: #FFFFFF; }

/* 产品详情 */
.pro_details h1 { color: #666666; text-align: center; line-height: 1.5; font-size: 3.6rem; }
.pro_details .info { text-align: center; font-weight: 300; font-size: 1.4rem; color: #aaa; padding-bottom: 45px; border-bottom: 1px solid #ddd; }

@media (max-width:1679px) {
.pro_details h1 { font-size: 3.4rem; }
.pro_details .info { font-size: 1.4rem; }
}

@media (max-width:1439px) {
.pro_details h1 { font-size: 3.2rem; }
.pro_details .info { font-size: 1.3rem; }
}

@media (max-width:1365px) {
.pro_details h1 { font-size: 3rem; }
.pro_details .info { font-size: 1.3rem; }
}

@media (max-width:991.98px) {
.pro_details h1 { font-size: 2.4rem; }
.pro_details .info { font-size: 1.2rem; color: #aaa; padding-bottom: 25px; border-bottom: 1px solid #ddd; }
}


.ne-pro-part02 { width: 100%; background: #f7f7f7; margin-top: 15px; }
.Menubox ul li { float: left; height: 60px; line-height: 60px; text-align: center; padding: 0px 1.5%; font-size: 18px; cursor: pointer; transition: all .35s; }
.Menubox ul li.hover { background: #114fb7; color: #FFFFFF; }
.Contentbox { background: #FFFFFF; padding-top: 30px; }
.CbContainer { line-height: 2; }
.CbContainer img { max-width: 100%; display: block; }

@media screen and (max-width:1399.98px) {
.Menubox ul li { height: 50px; line-height: 50px; }
}

@media screen and (max-width:767.98px) {
.Menubox ul li { font-size: 16px; padding: 0px 2%; }
}

.CbContainer table { width: 100%; border-collapse: collapse; }
.CbContainer table th { border: 1px solid #ddd; padding: 5px; }
.CbContainer table th:hover { background-color: #f5f5f5!important; }
.CbContainer table td { border: 1px solid #ddd; padding: 5px; }
.CbContainer table td:hover { background-color: #f5f5f5!important; }

.hh_back { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; }
.hh_back div { flex: 1; }
.hh_back>a { display: inline-block; font-size: 16px; color: #114fb7; font-weight: 300; text-align: center; }
.hh_back>a::before { content: '\e613'; font-family: 'iconfont_kf'; display: block; font-size: 3rem; margin-bottom: 9px; }
.hh_back>a:hover { color: #114fb7; }
#hh_backurl p { line-height: 26px; font-size: 16px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }

@media (max-width:1439px) {
.hh_back>a::before { font-size: 2.8rem; }
}

@media (max-width:1365px) {
.hh_back>a { font-size: 1.8rem; margin: auto 13px; }
.hh_back>a::before { font-size: 2.8rem; }
}

@media (max-width:1279px) {
.hh_back { margin-top: 30px; }
.hh_back>a { font-size: 14px; }
.hh_back>a::before { font-size: 2rem; }
#hh_backurl p { font-size: 14px; }
}

/* 产品选型列表 */
#products .pro-title { background: #114fb7; color: #FFFFFF; font-size: 22px; font-weight: bold; padding: 25px 20px; border-top-left-radius: 4px; border-top-right-radius: 4px; }
#products .prolist { position: relative; z-index: 80; top: 0; left: 0; width: 500px; display: block; box-sizing: border-box; text-align: left; box-shadow: 0 0 20px rgba(0, 0, 0, .2); border-radius: 0 0px 0px 0; }
#products .prolist>ul { display: block; }
#products .prolist>ul>li { position: relative; display: block; border-bottom: 1px solid #ddd; }
#products .prolist>ul>li>span.on { position: absolute; z-index: 30; right: 0; top: 0; cursor: pointer; text-align: center; width: 80px; height: 84px; line-height: 84px; color: rgba(17,79,183,1); transition: all .3s; }
#products .prolist>ul>li>span.on>i { font-size: 2rem; font-weight: bold; }
#products .prolist>ul>li.active>span.on { color: rgba(255,255,255,1); }
#products .prolist>ul>li.active>a { font-weight: bold; color: #fff; background: rgba(17,79,183,0.7); background: linear-gradient(to right bottom, rgba(17,79,183,0.7), rgba(17,79,183,0.7)); }
#products .prolist>ul>li>a { position: relative; display: block; font-size: 1.8rem; padding: 20px 0 20px 100px; }
#products .prolist>ul>li>a>img { display: inline-block; vertical-align: center; height: 60px; width: auto; margin-right: 10px; border-radius: 10%; }
#products .prolist>ul>li>div.show { display: block; }
#products .prolist>ul>li>div { display: none; padding: 30px 0 30px 100px; background: #f7f7f7; }
#products .prolist>ul>li>div>a { position: relative; display: block; padding: 20px 15px; font-size: 1.6rem; transition: all .35s; }
#products .prolist>ul>li>div>a:after { position: absolute; z-index: 5; left: 0; top: 50%; margin-top: -3px; width: 6px; height: 6px; border-radius: 100%; border: 1px solid transparent; background: rgba(17,79,183,1); content: ''; transition: all .35s; }
#products .prolist>ul>li>div>a:hover:after { background: none; border: 1px solid rgba(17,79,183,1); }

@media (max-width: 1520px) {
#products .prolist { width: 28%; }
}

@media (max-width: 1360px) {
#products .prolist { width: 28%; }
#products .prolist>ul>li>a { font-size: 1.6rem; }
#products .prolist>ul>li>a>img { height: 54px; }
#products .prolist>ul>li>span.on { width: 70px; height: 114px; line-height: 114px; }
#products .prolist>ul>li>span.on>i { font-size: 1.8rem; }
#products .prolist>ul>li>div>a { font-size: 1.4rem; }
}

@media (max-width:1199.98px) {
#products .prolist { float: none; width: 100%; background: #f7f7f7; }
#products .prolist>ul { display: flex; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
#products .prolist>ul>li { position: relative; float: left; width: calc((100% - 4px)/4); background: #fff; border-right: 1px solid #ddd; }
#products .prolist>ul>li>span.on { display: none; }
#products .prolist>ul>li>a { font-size: 1.4rem; padding: 15px; text-align: center; }
#products .prolist>ul>li>a>img { display: block; height: 60px; margin: 0 auto 10px auto; }
#products .prolist>ul>li>div { position: absolute; z-index: 80; left: 0; padding: 30px; background: rgba(17,79,183,1); }
#products .prolist>ul>li>div.show { display: none; }
}

@media (max-width: 980px) {
#products .prolist>ul>li { width: calc((100% - 3px)/3); }
#products .display>.list>ul>li { width: 48%; margin-right: 0; margin-bottom: 4%; }
#products .display>.list>ul>li:nth-child(even) { float: right; }
}

@media (max-width: 640px) {
#products .display { padding: 0 0px; }
#products .display>.list>ul>li { width: 100%; float: none; }
#products .display>.list>ul>li:nth-child(even) { float: none; }
}

@media (max-width: 520px) {
#products .prolist>ul>li { width: calc((100% - 2px)/2); }
#products .prolist>ul>li>a { font-size: 1.2rem; padding: 10px; }
#products .prolist>ul>li>a>img { height: 50px; }
}

/* 分页页码 */
.pageSty { margin-top:0px; padding-top:5px; }