@charset='utf-8';
/* 隐藏 */
.ph-head-box{ display: none; }
.carousel-box{ display: none; }
.ph-bottom-bot{ display: none; }

/*本例css*/
.www51buycom { width:1200px; height:350px;position: relative; overflow:hidden; margin:0 auto 35px auto;}
.www51buycom a{ blr: expression(this.onFocus=this.blur()); outline: none; }
/*数字按钮样式*/
/*控制居中的时候，需要定位left50%，然后margin负当前DIV的宽度*/
.www51buycom .num { overflow:hidden; height: 12px;  bottom:20px; zoom:1; z-index:3; position: absolute;  left: 50%;  display: inline-block;  -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0);  transform: translate(-50%, 0);}
.www51buycom .num li { width: 12px; height: 12px; line-height: 112px; text-align: center; font-family: "微软雅黑", Arial; color: #FFFFFF; background: #262626; margin:0 3px; border-radius:12px; cursor:pointer; float: left; }
.www51buycom .num li.on { background: #c00900;} /*当前项*/


/*上一个  下一个*/
.www51buycom .next,.prev  { display: none; width: 40px; height: 100px; background: url(../images/btn.png) no-repeat; position: absolute; top: 115px;}
.www51buycom .prev { left: 0; }


/* 产品 */
.in-pro-box{ width: 1200px; height: auto; overflow: hidden; padding: 50px; margin: 0 auto; }
.in-pro-box .in-pro-white{ width: 100%; height: 30px; }
.in-pro-left{ width: 300px; overflow: hidden; min-height: 600px; background: #60bdde; box-sizing: border-box; padding: 35px 0; overflow: hidden; float: left;}

.in-pro-left .pro-nav ul li em{ display: block; width: 70%; height: 1px; position: absolute; left: 15%; bottom: 0; background: rgba(255,255,255,0.5);}
.in-pro-left .pro-nav ul li:hover em{ display: block; animation: fadeInUp 0.5s linear 0s alternate forwards; width: 100%; height: 53px; background: #83888b; left: 0; }
.in-pro-rht{ width: 900px; height: 600px; float: left; }
.in-pro-rht ul li{ display: block; width: 300px; height: 300px; position: relative; box-sizing: border-box; border:solid 1px #eee; float: left; overflow: hidden;}
.in-pro-rht ul li:hover .line1{ display: block; width: 1px; height: 100%; left: 0; bottom: 0; background: #60bdde; position: absolute; animation: lineone 0.2s linear 0s alternate forwards; opacity: 0;}
.in-pro-rht ul li:hover .line2{ display: block; width: 100%; height: 1px; left: 0; top: 0; background: #60bdde; position: absolute; position: absolute; animation: linetwo 0.2s linear 0.4s alternate forwards; opacity: 0;}
.in-pro-rht ul li:hover .line3{ display: block; width: 1px; height: 100%; right: 0; top: 0; background: #60bdde; position: absolute; animation: lineone 0.2s linear 0.6s alternate forwards; opacity: 0;}
.in-pro-rht ul li:hover .line4{ display: block; width: 100%; height: 1px; right: 0; bottom: 0; background: #60bdde; position: absolute; animation: linetwo 0.2s linear 0.8s alternate forwards; opacity: 0;}
.in-pro-rht ul li img{ width: 300px; height: 300px; }

/* 解决方案 */
.in-cas-box{ width: 100%; height: auto; overflow: hidden; padding: 50px 0; background: #f5f5f5; }
.in-cas-box .in-cas-cen{ width: 1200px; height: auto; margin: 0 auto; overflow: hidden; }
.in-cas-list{ width: 1200px; height: 254px; margin-bottom: 20px; margin-top: 30px; }
.in-cas-list ul li{ display: block; width: 590px; height: 254px; float: left; border-radius: 5px; overflow: hidden;}
.in-cas-list ul li img{ width: 590px; height: 254px; }
.in-cas-list ul li:first-child{ margin-right: 20px; }
.in-cas-ad{ width: 1200px; height: 254px; border-radius: 5px; overflow: hidden; margin-bottom: 20px;}
.in-cas-ad img{ width: 1200px; height: 254px;  }
.in-cas-nav{ width: 1200px; height: 350px; float: left; }
.in-cas-nav dl{ display: block; width: 285px; height: 350px; float: left; margin-left: 20px; }
.in-cas-nav dl:first-child{ margin-left: 0; }
.in-cas-nav dl dt{ display: block; width: 285px; height: 208px; }
.in-cas-nav dl dt img{ width: 285px; height: 208px; }
.in-cas-nav dl dd{ text-align: center; width: 285px; height: 142px; box-sizing: border-box; padding: 25px 20px; }
.in-cas-nav dl dd span{ font-size: 18px; padding-bottom: 15px; display: block; }
.in-cas-nav dl a:hover dd span{ color: #333 !important; }
.in-cas-nav dl a:hover dd p{ color: #666 !important; }
.in-cas-nav dl a:hover{ color: #333 !important;}

/* 关于我们 */
.in-about-box{ width: 1200px; height: auto; overflow: hidden; padding: 50px 0; margin: 0 auto; }
.about-txt{ display: block; width: 1200px; height: 278px; margin-top: 30px;}
.about-txt dt{ display: block; width: 600px; height: 278px; float: left; }
.about-txt dt img{ width: 600px; height: 278px; }
.about-txt dd{ display: block; width: 600px; height: 278px; box-sizing: border-box; padding: 40px 110px 0 65px;  float: left;}
.about-txt dd h2{ font-size: 36px; color: #008fc1; }
.about-txt dd span{ display: block; font-size: 18px; color: #24acdc; padding: 15px 0 10px 0; }
.about-txt dd p{ font-size: 13px; color: #555; line-height: 26px; }
.about-txt dd a{ display: block; width: 123px; height: 38px; background: #60bdde !important; color: #fff !important; line-height: 38px; text-align: center; margin-top: 15px; }
.about-txt dd a em{ font-style: normal; font-family: '宋体'; padding-left: 7px; }
.about-btn{ width: 1200px; height: 120px;  }
.about-btn a{ display: block; width: 600px; height: 120px; float: left; overflow: hidden; }
.about-btn a img{ width: 600px; height: 120px; }

/* 品牌展示 */
.in-brand-box{ width:1200px; height: auto; overflow: hidden; margin: 0 auto; padding-bottom: 50px;}
.in-brand-list{ width: 1200px; height: auto; overflow: hidden; margin-top: 30px; }
.in-brand-list ul li{display: block; width: 228px; height: 118px; float: left; border:solid 1px #eee; margin:5px; position: relative;}
.in-brand-list ul li img{ width: 228px; height: 118px; }
.in-brand-list ul li:hover .line1{ display: block; width: 1px; height: 100%; left: 0; bottom: 0; background: #60bdde; position: absolute; animation: lineone 0.2s linear 0s alternate forwards; opacity: 0;}
.in-brand-list ul li:hover .line2{ display: block; width: 100%; height: 1px; left: 0; top: 0; background: #60bdde; position: absolute; position: absolute; animation: linetwo 0.2s linear 0.4s alternate forwards; opacity: 0;}
.in-brand-list ul li:hover .line3{ display: block; width: 1px; height: 100%; right: 0; top: 0; background: #60bdde; position: absolute; animation: lineone 0.2s linear 0.6s alternate forwards; opacity: 0;}
.in-brand-list ul li:hover .line4{ display: block; width: 100%; height: 1px; right: 0; bottom: 0; background: #60bdde; position: absolute; animation: linetwo 0.2s linear 0.8s alternate forwards; opacity: 0;}