@charset "utf-8";
/* CSS Document */
body{ background:#f5f5f5;}

.pro-b{ background-image:url(../img/int-banner2.jpg); background-repeat:no-repeat; background-position:50% 50%; background-size:cover; position:relative;}

.pro-nav{ background:#fff;}
.pro-menu{ padding:40px 0;}

.menu-item{ width:280px; float:left; margin-right:20px;}
.menu-item:last-child{ margin-right:0;}
.menu-item a{ display:block; border:1px solid #dcdcdc; background:#fff; padding:50px 20px;}
.menu-item a:hover{ background:#0d2f89; border:1px solid #0d2f89;}
.menu-item a dl dt{ width:40px; height:40px;float:right;}
.pro-ico1{ background:url(../img/pro_ico1.png) no-repeat center; background-size:contain;}
.pro-ico2{ background:url(../img/pro_ico2.png) no-repeat center; background-size:contain;}
.pro-ico3{ background:url(../img/pro_ico3.png) no-repeat center; background-size:contain;}
.pro-ico4{ background:url(../img/pro_ico4.png) no-repeat center; background-size:contain;}
.menu-item a:hover .pro-ico1{background:url(../img/pro_ico1_h_w.png) no-repeat center; background-size:contain;}
.menu-item a:hover .pro-ico2{background:url(../img/pro_ico2_h_w.png) no-repeat center; background-size:contain;}
.menu-item a:hover .pro-ico3{background:url(../img/pro_ico3_h_w.png) no-repeat center; background-size:contain;}
.menu-item a:hover .pro-ico4{background:url(../img/pro_ico4_h_w.png) no-repeat center; background-size:contain;}
.menu-item a dl dd{ display:table-cell; vertical-align:top;}
.menu-item a dl dd h3{ font-size:18px; font-weight:normal; margin-bottom:2px;}
.menu-item a dl dd p{ font-size:12px; color:#999;}
.menu-item a:hover h3{ color:#fff;}
.menu-item a:hover p{ color:#fff;}


.pro-con{ padding:40px 0;}

.pro-cell{ width:580px; float:left; margin-right:20px; margin-bottom:20px;}
.pro-cell:nth-child(2n+0){ margin-right:0;}
.pro-cell a{ display:block; padding:20px; background:#fff; position:relative;transition:all 0.3s;}
.pro-cell a:hover{ box-shadow:0 0 21px rgba(0,0,0,0.17); transition:all 0.3s;}
.pro-cell a dl dt{ width:290px; height:290px;float:right;}
.pro-cell a dl dt img{ display:block; width:100%;}
.pro-cell a dl dd{ display:table-cell; vertical-align:top;padding:35px 30px 20px 20px;}
.pro-cell a dl dd span{ font-size:16px;}
.pro-cell a dl dd h2{ font-size:28px; font-weight:normal; margin:10px 0;word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:all 0.3s;}
.pro-cell a dl dd h2.pro_h2_en{ font-size:20px;word-break:normal;}
.pro-cell a dl dd p{ font-size:12px; color:#999; line-height:22px;word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.pro-cell a dl dd i{ display:block; border:1px solid #ccc; font-size:14px; color:#999; text-align:center; width:80px; padding:1px 0; margin-top:40px;position: absolute;
bottom:70px; left: 40px;transition:all 0.3s;}
.pro-cell a:hover dl dd h2{ color:#0d2f89;transition:all 0.3s;}
.pro-cell a:hover dl dd i{background:#0d2f89; color:#fff;border:1px solid #0d2f89;transition:all 0.3s;}

.more-pro{ display:block; width:22%; min-width:250px; margin:0 auto 80px; border:2px solid #dcdcdc; background:#fff;font-size:24px; text-align:center; padding:10px 0; color:#999; border-radius:50px;}
.more-pro:hover{ background:#0d2f89; color:#fff;border:2px solid #0d2f89;}

/*产品二级页面结束*/

/*产品三级页面*/
.pro-three{ padding:40px 0;}
.pro-nm{text-align:center; margin-bottom:40px;}
.pro-nm dl{ font-size:0;}
.pro-nm dl dt{ display:inline-block; margin-right:10px; vertical-align:middle;}
.pro-nm dl dd{ display:inline-block;vertical-align:middle; text-align:left;}
.pro-nm dl dd h2{ font-size:30px; font-weight:normal;}
.pro-nm dl dd p{ font-size:12px; color:#999;}
.nm1{ background:url(../img/pro_ico3.png) no-repeat left center;}

.pro-nav .current{ padding-top:40px;}
.pro-three-nav { text-align:center;position:relative;}
.pro-three-nav ul{ font-size:0;}
.pro-three-nav ul li{ display:inline-block;}
.pro-three-nav ul li a{ display:block; font-size:16px; padding:5px 30px; border-radius:50px;}
.pro-three-nav ul li.current{ border-bottom:none; padding:0; margin:0;}
.pro-three-nav ul li.current a,.pro-three-nav ul li a.cur,.pro-three-nav ul li a:hover{ background:#092885; color:#fff;}

/*产品详情*/
.product-detail{ background:#fff; padding:40px 0 80px;}
.pro-detail-left{ width:580px; float:left;}
.pro-detail-left .int{ padding-right:20px;}
.pro-title span{ font-size:24px; color:#666;}
.pro-title h2{ font-size:46px; color:#333; font-weight:normal; margin:10px 0 0;}
.pro-text{ font-size:14px; line-height:24px;}

/*产品图片切换*/
.pro-detail-right{ width:580px;height:580px; float:right;  background:#333; overflow:hidden;}
.pro-detail-right .slider{position: relative;width: 100%;height: auto;overflow: hidden;}
.pro-detail-right .slides{height: auto;overflow: hidden;-webkit-backface-visibility: hidden;-webkit-transform-style: preserve-3d;-webkit-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-moz-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-ms-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);-o-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.pro-detail-right .slide{height: auto;float: left;clear: none;}
.pro-detail-right .slide .box img{ display:block; width:100%;}
.pro-detail-right .slider-arrow{position: absolute;display: block;margin-bottom: -20px;width: 40px;height: 40px;line-height: 40px;text-decoration: none;text-align: center;color: #fff;font-size: 2em;background-color: #333;background-color: rgba(50,50,50,.3);border-radius: 50%;}
/*左右按钮样式及放置位置*/
.pro-detail-right .arrowsWrapper{ display:none;}
.pro-detail-right .slider-arrow--right{bottom: 50%;right: 30px;}
.pro-detail-right .slider-arrow--left{bottom: 50%;left: 30px;}
.pro-detail-right .slider-nav{position: absolute;bottom: 0;}
.pro-detail-right .slider-nav__item{/*nva样式*/width:8px;height:8px;float: left;clear: none;display: block;margin: 0 5px;background: #b0b0b0;border-radius: 100%;}
.pro-detail-right .slider-nav__item--current{background: #333;} /*被选中后的样式*/


.recom-pro h3{ font-size:24px; color:#666; font-weight:normal; margin-bottom:40px;}
.recom-pro{ padding:40px 0 80px;}
.recom-cell{ width:380px; margin-right:20px; float:left; text-align:center;}
.recom-cell:last-child{margin-right:0;}
.recom-cell .recom-a,.recom-cell .recom-a img{ width:100%; display:block; background:#fff;}
.recom-cell .recom-a:hover{box-shadow:0 0 21px rgba(0,0,0,0.17);}
.recom-cell p{ padding:20px 0;}
.recom-cell p a{ font-size:18px;}






@media (min-width:1200px) {

	}
@media (max-width:1200px){
    .menu-item{width: 23.5%;margin-right: 2%;}
	.menu-item a{padding: 20% 4%;}
	.pro-cell{width: 49%;margin-right: 2%;margin-bottom: 2%; }
	.pro-cell a dl dt{ width:220px; height:220px;}
	.pro-cell a dl dd{padding: 10% 4%;}
	.pro-cell a dl dd h2{ font-size:24px;}
	
	.pro-detail-left{ width:470px;}
	.pro-detail-right{ width:470px;height:470px;}
	.pro-title span{ font-size:16px;}
	.pro-title h2{ font-size:24px;}
	.pro-text{ font-size:12px;}
	.recom-cell{ width:32%; margin-right:2%;}
	
	.pro-cell a dl dd i{position: absolute;bottom: 16%;left: auto;}
	.pro-three-nav ul li a{ padding:5px 10px; font-size:14px;}
	
	}


@media (max-width:992px){
	.menu-item a{ padding:9%;}
	.menu-item a dl dd h3{padding-top: 7px;}
	.menu-item a dl dd p{ display:none;}
	
	.pro-cell a dl dt{ float:none; margin:0 auto;}
	.pro-cell a dl dd{ text-align:center;}
	.pro-cell a dl dd i{ margin:4% auto 0;}
	
	.pro-detail-right{ float:none; margin:0 auto;}
	.pro-detail-left{ float:none; margin:0 auto; width:100%;}
	
	}

@media (max-width:750px){	
    .pro-b{padding-bottom:45%;}

    .pro-menu{ padding:5% 0;}
    .menu-item a dl dt{ float:none; margin:0 auto 4%;}
	.menu-item a dl dd{ display:block; text-align:center;}
	.menu-item a dl dd h3{ padding:0; margin:0; font-size:12px;}
	
	.pro-con{ padding:20px 0;}
	.pro-cell{ width:100%; margin-right:0; margin-bottom:4%;}
	.pro-cell a dl dd{ padding:8% 0; display:block;}
	.pro-cell a dl dd i{ position:static;}
	
	.product-detail{ padding:4% 0;}
	.pro-detail-right{ margin-bottom:4%;width: 354px;height: 354px;}
	.pro-detail-left .int{ padding-right:0;}
	.recom-cell{ width:100%; margin:0;}
	.recom-cell p a{ font-size:16px;}
	.pro-cell a dl dd h2{ font-size:18px;}

	.pro-nm{ margin-bottom:20px;}
	.pro-three-nav{ min-height:75px;}
    .pro-three-nav ul{width: 90%;position: absolute;top: 0;left: 0;left: 50%;margin-left: -45%; z-index:10;background:#fff; border-radius:5px; box-shadow:0 0 2px rgba(0,0,0,0.2); overflow:hidden;}
	.pro-three-nav ul li{display: none;margin: 0;}
	.pro-three-nav ul li.mn{ display:block;}
	.pro-three-nav ul li.mn span{ display:block; font-size:14px; padding:15px 30px; text-align:center;}
	.pro-three-nav ul li.mn span i{ display:inline-block; vertical-align:middle; margin-right:10px;}
	.pro-three-nav ul li.mn span em{display:inline-block;vertical-align:middle; width:10px; height:10px; background-image:url(../images/sj.png);background-repeat:no-repeat; background-size:contain;}
	.pro-three-nav ul li.current{display: block;}
	.pro-three-nav ul:hover{background-image: none;box-shadow:0 0 10px rgba(0,0,0,0.2);}
    .pro-three-nav ul:hover li{display: block;}
    .pro-three-nav ul:hover .current{background: url(images/check.png) no-repeat 10px 7px;}
	.pro-three-nav ul li a{ font-size:14px; border-radius:0; padding:15px 0;border-bottom:1px dotted #dcdcdc;}
	.pro-three-nav ul li:nth-child(2) a,.pro-three-nav ul li:last-child a,.pro-three-nav ul li.current a{ border-bottom:none;}
	
	
	}


@media (max-width:320px){	
    .menu-item a{ padding:5% 0;}
    .pro-detail-right{ width:300px; height:300px;}
	}