/*
* author:wangjia;
* date:20160527;
*/


.box{ width: 100%; height: 800px; position: relative; z-index: 1;}
.none { display:none}


.box3{ position: relative; margin-top:-300px }
.box3 .main{ width: 1130px; height:auto; overflow:hidden; position: absolute; top:160px; left: 50%; margin-left: -565px; }
.box3 .subbox{ float: left; display: inline; margin-bottom: 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; overflow: hidden; position: relative;}
.box3 .subbox_b{width: 558px; height: 332px; }
.box3 .subbox_c{width: 838px; height: 290px; }
.box3 .subbox_s{width: 272px; height: 290px;margin-left:10px; }
.box3 .subbox_5{width: 550px; height: 332px;margin-left:10px; }
.box3 .tit{ width: 100%; height: 65px; position: relative; float: left;}
.box3 .titbg{ width: 100%; height: 65px; background: #3c2130; position: absolute; top: 0; left: 0; opacity: 0.8;filter:alpha(opacity=80); z-index: 1; }
.box3 .tit-nav{ width: 100%; height: 65px; position: absolute; top: 0; left: 0; z-index: 2;}
.box3 .tit-nav span{ min-width: 50px; height: 50px; float: left; font: normal 16px/50px "Microsoft Yahei"; color: #fff; text-align: center; margin-top: 10px; margin-left: 20px; cursor: pointer;}
.box3 .tit-nav .current{border-bottom: 5px solid #fff;  }
.box3 .tit-nav a{ float: right; margin-top: 20px; margin-right: 15px; font: normal 30px/1 Arial; color: #FFF; text-align: center; text-decoration: none;}
.box3 .tit h3{ position: absolute; width: 100%; height: 32px; top: 10px; font: bold 22px/32px "Microsoft Yahei"; color: #fff; text-align: center; z-index: 2;}
.box3 .tit p{  position: absolute; width: 100%; height: 20px; top: 45px; font: 10px/1 "Microsoft Yahei"; color: #fff; text-align: center; opacity: 0.2; z-index: 2; text-transform: uppercase;}


.box3 .cont{ width: 100%; height: 267px; float: left; position: relative; border-top: 1px solid rgba(255,255,255,.1);}
.box3 .contbg{ width: 100%; height: 267px; background: #480036; position: absolute; left: 0; bottom: 0;  opacity: 0.8;filter:alpha(opacity=80); z-index: 1;}
.box3 .cont dl{ width: 495px; margin: 0 auto; position: relative; z-index: 2;}
.box3 .cont dl a{ width: 85%; display: inline-block; color: #fff; opacity: 0.8;overflow: hidden; white-space:nowrap;text-overflow:ellipsis;text-overflow: ellipsis;-ms-text-overflow: ellipsis;-o-text-overflow: ellipsis;-moz-binding: url("ellipsis.xml#ellipsis");}
.box3 .cont dl a:hover{opacity: 1;}
.box3 .cont dt{ width: 100%; height: 55px; font: normal 16px/55px "Microsoft Yahei"; color: #FFF; text-align: center; }
.box3 .cont dt a{ display: inline-block; width: 90%; overflow: hidden; white-space:nowrap;text-overflow:ellipsis;text-overflow: ellipsis;-ms-text-overflow: ellipsis;-o-text-overflow: ellipsis;-moz-binding: url("ellipsis.xml#ellipsis"); font-weight: bold; }
.box3 .cont dd{ width: 100%; height: 32px; border-top: 1px solid #292c33; font: normal 14px/32px "Microsoft Yahei"; color: #fff;  margin-bottom: 5px;}
.box3 .cont span{ float: right; opacity: 0.6;}

.box3 .info .slider{ width: 550px; height: 332px; overflow: hidden;}
.box3 .info ul{ width:1000px; height: 332px; }
.box3 .info li{ width: 550px; height: 332px; float: left; position: relative;}
.box3 .info li img{ position: absolute; top: 0; left: 0; width:550px; height:332px;}
.box3 .info li .text{ width: 100%; height: 50px; background: #3c0028; position: absolute; left: 0; bottom: 0; opacity: 0.6;filter:alpha(opacity=60); }
.box3 .info li h3{ width: 215px; height: 30px; font: normal 24px/30px "Microsoft Yahei"; color: #FFF; position: absolute; top: 290px; left: 30px; overflow: hidden;white-space:nowrap;
text-overflow:ellipsis;text-overflow: ellipsis;-ms-text-overflow: ellipsis;-o-text-overflow: ellipsis;-moz-binding: url("ellipsis.xml#ellipsis");}
.box3 .info li p{ width: 215px; font: normal 16px/30px "Microsoft Yahei"; color: #FFF; position: absolute; top: 240px; left: 30px; width: 215px;}
.box3 .info .page{ width: 550px; position: absolute;  height: 14px; bottom: 5px; margin-left:450px; z-index: 2;}
.box3 .info .page span{ display: inline-block; width:14px; height: 14px; background: #fff; border-radius: 7px; margin: 0 5px; opacity: 0.5;filter:alpha(opacity=50); }
.box3 .info .page .current{ width: 40px; opacity: 1;transition:width 0.5s; -webkit-transition:width 0.5s;filter:alpha(opacity=100);}

.box3 .feature{ background: url(../images/feature.png) no-repeat; }
.box3 .feature .more{ position: absolute; width: 164px; height: 45px; background: #000; border: 1px solid #aaa; opacity: 0.4;filter:alpha(opacity=40); border-radius: 22px; top: 190px; left: 55px; font: normal 16px/45px "Microsoft Yahei"; text-align: center; color: #fff; transition:opacity 0.5s; -webkit-transition:opacity 0.5s; }
.box3 .feature .more:hover{ opacity: 0.7;filter:alpha(opacity=70);}

.media .m-cont{ width: 520px; height: 172px; position: absolute; top: 30px; left: 20px; z-index: 2;}
.media .m-cont img{ float: left;width:195px;height:164px;display:block;}
.media .m-cont ul{ width: 300px; float: left; margin-left: 17px;}
.media .m-cont li{ width: 100%; height: 33px; font: normal 14px/33px "Microsoft Yahei"; border-bottom: 1px solid #242629; color: #bbb;}
.media .m-cont li a{display: inline-block; width: 80%; overflow: hidden; white-space:nowrap;text-overflow:ellipsis;text-overflow: ellipsis;-ms-text-overflow: ellipsis;-o-text-overflow: ellipsis;-moz-binding: url("ellipsis.xml#ellipsis"); color: #fff; opacity: 0.8; }
.media .m-cont li a:hover{ opacity: 1;}

.flink{ width: 520px; height: 42px; position: absolute; left: 20px; bottom: 20px; z-index: 2;}
.flink .prev,.flink .next{ width: 14px; height: 25px; position: absolute; top: 10px; background: url(../images/arr-s.png) no-repeat; opacity: 0.5; filter:alpha(opacity=50)}
.flink .prev{ left: 0; background-position: 0 0 ;}
.flink .next{ right: 0; background-position: 0 -25px;}
.flink .prev:hover,.flink .next:hover{ opacity: 1;}
.flink .slider{ position: absolute; width: 448px; overflow: hidden; left: 30px;}
.flink .slider a{float: left; width: 104px; height: 40px; margin-left: 8px; background: #fff; }

.sns .cont{ position: relative;}
.sns a{ width: 50%; height: 133px; position: absolute; background: url(../images/sns.png) no-repeat; z-index: 2; opacity: 0.4;filter:alpha(opacity=40); transition:opacity 0.5s; -webkit-transition:opacity 0.5s; }
.sns a:hover{ opacity: 1;filter:alpha(opacity=100);}
.sns .a1{ top: 0; left: 0; border-right: 1px solid #2d2b2f; border-bottom: 1px solid #222124; background-position: 35px 40px ;}
.sns .a2{ top: 0; left: 50%; border-bottom: 1px solid #2d2b2f; background-position: -95px 40px;}
.sns .a3{ top: 50%; left: 0; border-right: 1px solid #222124; background-position: 35px -90px;  }
.sns .a4{ top: 50%; left: 50%; background-position: -95px -90px;}
.sns .cont img{ position: absolute; top: 80px; left: 5px; z-index: 2;width:126px; height:126px;}

.service .tit h3{ line-height: 50px; font-size: 20px;}
.service .link{ width: 100%; position: absolute; z-index: 2; left: 0px; top: 22px;}
.service .link a{ width: 120px; float: left; margin-left: 15px; font: normal 16px/3 "Microsoft Yahei"; color: #fff; opacity: 0.8;}
.service .link a:hover{ opacity: 1;}
.service .tel{position: absolute; z-index: 2; width: 100%; height: 60px; left: 0; bottom: 0; border-top: 1px solid #222124; font: bold 16px/60px "Microsoft Yahei"; color: #fff; text-align: center;}

.box3 .tip{ float: left; width: 100%; padding-top:10px; margin-top: 70px; border-top: 1px solid #5f5f63; font: normal 14px/2 "Microsoft Yahei"; color: #89898d;}
.box3 .tip h3{ font: bold 16px/2 "Microsoft Yahei"; color: #89898d;}

@keyframes movetip{
	0%{ bottom: 40px;}
	50%{ bottom: 30px;}
	100%{ bottom: 40px;}
}
.scroll-tip{ position: fixed; z-index: 2; width: 65px; height: 49px; background: url(../images/downtip.png) no-repeat; left: 50%; margin-left: -32px; bottom:30px;
-webkit-animation:linear movetip 2s infinite;
}

.floatbar{ position: fixed; z-index: 3;}
.floatdown{ width: 144px; height: 281px; background: url(../images/floatbar.png) no-repeat; right: 0px; top: 50%; margin-top: -140px;}
.floatdown p{ width: 108px; height: 14px; float: left; margin-top: 12px; margin-left: 20px; font: normal 12px/14px "Microsoft Yahei"; color: #fff; text-indent: 18px;  background: url(../images/down_icon.png) left center no-repeat;}
.floatdown .dl_ewm{ float: left; margin-left: 20px; margin-top: 8px; margin-bottom: 10px;}
.floatdown .dl_btn{ float: left; margin-left: 8px; margin-top: 3px; opacity: 0.8;filter:alpha(opacity=80); transition:opacity 0.5s; -webkit-transition:opacity 0.5s;}
.floatdown .dl_btn:hover{ opacity: 1;}
.floatdown .sns-ewm{ position: absolute; bottom: -140px; left: 10px;}

.floatorder{ width: 144px; height: 200px; background: url(../images/floatorder.png) no-repeat;right: 0px; top: 50%; margin-top: -140px;}
.floatorder .dl_ewm{ float: left; margin-left: 17px; margin-top: 32px; }

.maskdiv{ width: 100%; height: 1200px; position: fixed; top: 0; left: 0; background: #000; opacity: 0.7;filter:alpha(opacity=70); z-index: 100;}
.pop-video{ width: 720px; height: 400px; background: #000; padding: 5px; position: fixed; top: 50%; left: 50%; margin-top: -200px; margin-left: -360px; z-index: 101;}

.pop-order,.pop-down{ width: 760px; height: 540px; position: fixed; top: 50%; left: 50%; margin-top: -270px; margin-left: -380px; background: #fff; border-radius: 10px; z-index: 101;}
.popbox .close{ width: 50px; height: 50px; cursor: pointer; position: absolute; top: 0; right: -60px; background: url(../images/close.png) no-repeat; }
.popbox h2{ width: 100%; height: 88px; font: bold 32px/88px "Microsoft Yahei"; color: #1f1f29; text-align: center;}
.popbox .steps{ width: 420px; display: table; height: auto; padding: 20px 0 30px; margin: 0 auto; border-top: 1px solid #737373; border-bottom: 1px solid #737373; }
.popbox .step{ width: 100%; float: left; margin-top: 15px; font: normal 18px/28px "Microsoft Yahei";}
.popbox .step span{ float: left; width: 95px; height: 25px; border-right: 1px solid #1f1f29; font: bold 25px/1 "Microsoft Yahei";}
.popbox .step p{  margin-left: 130px;}
.popbox .steps .tip{ float: left; margin-top: 20px; font: normal 14px/1.5 "Microsoft Yahei"; color: #333; text-align: center;}
.popbox .ewm{ width: 420px; height: 155px; margin: 0 auto;}
.popbox .ewm .mshop{ float: left; width: 150px; height: 150px; margin-top: 20px;}
.popbox .ewm .dl{ width: 222px; height: 66px; float: left; background: url(../images/dlbtn.png) no-repeat; margin-left: 20px;}
.popbox .ewm .dl-app{ margin-top: 20px; background-position: 0 0 ;}
.popbox .ewm .dl-and{ background-position: 0 -66px; margin-top: 15px;}
.popbox .sns{ width: 450px; margin: 0 auto; margin-top: 30px; clear: both; font: normal 16px/2 "Microsoft Yahei"; color: #1f1f29;}
.popbox .sns p{ margin-left: 15px;}
.popbox .sns .p2{ font-weight: bold; letter-spacing: -1px;}
.popbox .sns .green{ color: #f20505;}
.popbox .sns .red{ color: #308a5d;}