@charset "utf-8";
html{color:#000;background:#FFF; }
body { color:#666;font:12px/1.231 "Microsoft Yahei";} /*网站字体颜色*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;} 
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}
input,select{vertical-align:middle;}
i,em{ font-style:normal;}
select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}
table{font-size:inherit;font:100%; border-collapse:collapse;}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
/*title*/
h1 { font-size:32px;}
h2 { font-size:26px;}
h3 { font-size:20px;}
h4 { font-size:14px;}
h5 { font-size:12px;}
h6 { font-size:10px;}

.mt10{ margin-top:10px;}

a { color:#666; text-decoration:none;}  /*for ie f6n.net*/
a:focus{outline:0;} /*for ff f6n.net*/
.vam { vertical-align:middle;}
.clear{ clear:both; height:0; line-height:0; font-size:0;}
.clearfix:after{ content:""; clear:both; height:0; visibility:hidden; display:block;}
.clearfix{*zoom:1}
p{ word-spacing:-1.5px;}
.tr { text-align:right;}
.tl { text-align:left;}
.center { text-align:center;}
.fl { float:left;}
.fr { float:right;}
.pa{ position:absolute;}
.pr{ position:relative}
/* -- 购物车外部框架 -- */
.cart_header , .cart_content , .cart_footer { width:760px; margin:0 auto;}

/* -- 页面整体布局 -- */
.header , .content , .footer { width:1200px; margin:0 auto;  }
.h_nav li a:-webkit-any-link{ display:block;}






/* -- 以上部分以前resetcommon -- */



/* -- 首页样式开始 -- */
.clearfix{*zoom:1}
i,em{ font-style:normal;}

body{min-width: 1200px;max-width: 1920px;margin: 0 auto;overflow-x: hidden; width: 100%;}

.bantest {position: relative;width: 100%;overflow: hidden;}  
.banner{ width:100%; position:relative;}
.banner .slick-dotted.slick-slider{ margin:0;}
.banner img{ display:block; width:100%;}
.banner .slick-arrow {position: absolute;font-size: 0;top: 50%;z-index: 9; width:73px; height: 73px; margin-top: -73px;border: 0; outline: none;overflow:hidden;}
.banner .slick-prev {left: 10%; display: none; background:url(../images/fang_l.png) no-repeat;}
.banner .slick-next {right: 10%; display: none;background:url(../images/fang_r.png) no-repeat;}   
.slick-dots { position: absolute;left: 50%; font-size:0; bottom: 8%;width: 300px;text-align: center;margin-left: -175px;z-index: 11;}
.slick-dots li {display: inline-block;margin: 0 8px; }
.slick-dots li button {display: block;background: #e60012;width: 10px;height: 10px;color: #1352ba; border-radius: 10px;border-color:#e60012; -webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
.slick-dots .slick-active button {background-color: #e60012;border-color: #e60012;width: 40px;} 

.tit{ font:44px "Microsoft YaHei UI"; font-weight:bold; color:#393c42; text-align:center;}
.tit a{ color:#393c42;}
.tit em{ display:block; font:20px "Microsoft YaHei UI"; color:#666; padding-top:8px;}


.guide{ margin:70px 0 0; height:640px;}
.guide p{ font:14px "Microsoft YaHei UI"; line-height:27px; color:#666; text-align:center; padding:20px 0 26px; margin-top:24px; background:url(../images/guide_line.png) no-repeat center top;}
.guide .guide_img{ height:225px; padding:13px 15px; background:#153960; margin-bottom:30px;}
.guide .guide_img img:nth-child(2){ margin-left:15px;}
.guide .guide_img img:last-child{ float:right;}
.guide li{ text-align:center; font:16px "Microsoft YaHei UI"; color:#666; float:left; position:relative;}
.guide li:before{ content:""; position:absolute; top:10px; right:0; width:1px; height:90px; background:#d8d8d8;}
.guide li:last-child:before{ background:none;}
.guide li:nth-child(1){ width:197px; text-align:left;}
.guide li:nth-child(2){ width:308px;}
.guide li:nth-child(3){ width:380px;}
.guide li:last-child{ float:right; width:230px;}
.guide li span{ display:block; font:72px Arial, Helvetica, sans-serif; color:#153960;}
.guide li em{ display:inline-block; width:23px; height:23px; background:#cb0912; font:14px "Microsoft YaHei UI"; text-align:center; line-height:23px; border-radius:23px; color:#fff;}

.qustion{ background:#f7f7f7; padding-top:65px;}
.qustion1{ margin-top:60px; background:url(../images/qustion_line.png) no-repeat center top; background-size:100% auto; }
.qustion dl{width:19.27%; float:left; margin-right:0.88%;}
.qustion dt{ height:90px; text-align:center; font:30px Arial, Helvetica, sans-serif; color:#153960; line-height:90px; position:relative;}
.qustion dt:before{ content:""; position:absolute; top:0; left:50%; width:10px; height:10px; border-radius:10px; background:#153960; margin-left:-5px;}
.qustion dd{ background:#fff url(../images/qustion_q.png) no-repeat center 48px;}
.qustion dd p{ height:100px; padding:120px 6% 0 6%; font:16px "Microsoft YaHei UI"; text-align:center; line-height:30px; color:#353b42;}
.qustion dd img{ display:block; width:100%;}
.qustion dl:nth-child(4) p,.qustion dl:nth-child(5) p{height:150px; padding:70px 6% 0 6%;}
.qustion dl:nth-child(5){ margin:0;}
.qustion dl dd:hover{transform: translateY(-10px);transition: all 0.5s linear;-webkit-transition: all 0.5s linear;-moz-transition: all 0.5s linear;-o-transition: all 0.5s linear;}
@media (min-width: 1200px) and (max-width: 1366px) {
.qustion dd p{font:14px "Microsoft YaHei UI";line-height:30px;}
.qustion dl:nth-child(4) p{ padding:70px 1% 0 4%;line-height:33px; text-align:left;}
.qustion dl:nth-child(5) p{line-height:26px;text-align:left;height:190px; padding:30px 6% 0 6%;}
}

.guan1{margin-top:17px;position:relative;}
.guan1,.guan1 img{width:100%;display:block;}
.guan1 h3{position:absolute; font:24px "Microsoft YaHei UI"; color:#333; top:15%;left:50%;margin-left: -600px;z-index:2;}
.guan1 h3 em{ display:block; font-size:40px; font-weight:bold; padding:12px 0 30px;}
.guan1 h3 span{ display:block; width:205px; height:55px; background:#cb0912 url(../images/guan_arr.png) no-repeat 125px center; font:14px "Microsoft YaHei UI"; border-radius:3rem; line-height:55px;}
.guan1 h3 span a{ display:block; color:#fff; padding-left:50px;}

.fang{ padding-top:80px; overflow:hidden;}
.fangt{height:133px; margin-top:48px; overflow:hidden;}
.fangt span{ width:171px; float:left; position:relative; font:18px "Microsoft YaHei UI"; text-align:center; color:#353b42;display:block}
.fangt span:before{ content:""; position:absolute; top:2px; right:0; width:1px; height:82px; background:#ccc;}
.fangt span:last-child:before{ background:none;}
.fangt span a{ display:block; color:#353b42;}
.fangt span em{ display:block; width:43px; height:43px; margin:0 auto 10px; border-radius:43px; border:2px solid #cb0912; box-sizing:border-box;}
.fangt span em img{transition: .5s; width:100%;}
.fangt span a:hover,.fangt .cur a{ font-weight:bold; color:#cb0912; text-decoration:underline;}
.fangt span a:hover em img,.fangt .cur img{ margin-top:-40px;}
.fangt span a:hover em,.fangt .cur em{ background:#cb0912; border:2px solid #cb0912; box-sizing:border-box;}
.fang1 {width: 100%;min-width: 1200px;height: 600px;position: relative;}
.fang2{width: 1200px;position: absolute;left: 50%;margin-left: -600px;}
.fang1 .tempWrap{overflow: visible !important;}
.fang1 .tempWrap .fang3{margin-left: -1236px !important;}
.fang1 dl { position: relative; height:600px; float:left; margin:0 12px 40px !important; width:1200px; box-shadow:0.1rem 0.1rem 1rem #ccc;}
.fang1 dt{width:1200px; height:600px; overflow:hidden; position:relative;}
.fang1 dt em{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(21,57,96,0.8);}
.fang1 dt img{ display:block; width:1200px; height:600px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.fang1 dt a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.fang1 dd{ position:absolute; bottom:22px; left:27px; width:1146px; background:rgba(21,57,96,0.8);padding:30px 0; border-bottom:3px solid #cb0912; display:none;}
.fang1 dd strong{ font:24px "Microsoft YaHei UI"; font-weight:bold; color:#333333;}
.fang1 dd i{font:14px "Microsoft YaHei UI";  color:#fff; position:absolute; top:38px; left:650px;}
.fang1 dd strong a{ display:block; color:#fff; padding-left:40px;}
.fang1 dd p{font:14px "Microsoft YaHei UI"; line-height:24px; color:rgba(255,255,255,0.5); padding:4px 0 0 40px;}
.fang1 dd span a{ display:block; width:116px; height:121px; background:#cb0912 url(../images/guan_arr.png) no-repeat center center; position:absolute; top:0; right:0;}
.fang1 .cur1 dt:before{ background:none;}
.fang1 .cur1 dd{ display:block;}
.fang1 .cur1 dt em{display:none;}
.prev2{width:32px;height: 60px;top:240px;z-index: 9;cursor: pointer;left: 50%;margin-left: 600px; background:url(../images/fang_l.png) no-repeat;}
.next2{width:32px;height: 60px;top:240px;z-index: 9;cursor: pointer;left: 50%;margin-left: 600px;background:url(../images/fang_r.png) no-repeat;}
.prev2{margin-left:-760px;}
.next2{margin-left:710px;}

.product{ height:400px; overflow:hidden;}
.product .product_ti{ height:100px; background:url(../images/pro_line.png) repeat-x center center; font:20px "Microsoft YaHei UI"; font-weight:bold; line-height:100px;}
.product .product_ti em{ background:#fff; padding-right:8px;}
.product .product_ti a{ color:#353b42;}
.product .product_ti span{background:#fff; float:right; font-size:16px; padding-left:20px; font-weight:normal;}
.product li{ width:281px; float:left; margin-right:26px;}
.product li img{display:block;width:281px;height: 204px;}
.product li em{ display:block; font:16px "Microsoft YaHei UI"; height:40px; line-height:40px; color:#666; overflow:hidden; text-align:center;}
.product li:hover img{ border:0.2rem solid #153960; box-sizing:border-box;}
.product li:hover em{ font-weight:bold; color:#153960;}

.super{ background:#f7f7f7; padding:77px 0 0 0; position:relative;height:888px;}
@media (min-width: 1200px) and (max-width: 1366px) {
.super{ height:700px;}
}
@media (min-width: 1367px) and (max-width: 1440px) {
.super{ height:726px;}
}
@media (min-width: 1441px) and (max-width: 1600px) {
.super{ height:780px;}
}
@media (min-width: 1601px) and (max-width: 1680px) {
.super{ height:808px;}
}
.supert{ width:1200px; height:125px; margin:30px auto 0;}
.supert .supert_hot{ width:219px; float:left;border-left:1px solid #b9b9b9; height:80px; padding-left:20px; font:20px "Microsoft YaHei UI"; color:#353b42;}
.supert .supert_hot span{ display:block; position:relative; width:61px; height:53px; margin-bottom:4px;}
.supert .supert_hot span em{position:absolute;width:100%;height:100%;top:0;left:0;-webkit-transform: translateX(0) rotate(0);transform: translateX(0) rotate(0);-webkit-transition: all 0.35s ease-out;transition: all 0.35s ease-out;}
.supert .supert_hot span i{position:absolute;width:100%;height:100%;top:0;left:0;opacity:1;visibility:hidden;-webkit-transform: scale(0.5);transform: scale(0.5);-webkit-transition: all 0.1s ease 0.2s;transition: all 0.1s ease 0.2s;}
.supert .cur{ font-weight:bold; color:#cb0912; position:relative; }
.supert .cur:before{ content:""; position:absolute; top:0; left:-1px; width:2px; height:48px; background:#cb0912;}
.supert .cur em{opacity: 0;visibility:hidden;-webkit-transform: translateX(100%) rotate(180deg);transform: translateX(100%) rotate(180deg);}
.supert .cur i{visibility:visible;opacity:1;-webkit-transform:scale(1);transform:scale(1);}
.super1 dt{ max-height:649px;min-height:456px;}
.super1 dt img{ display:block; width:100%;max-height:649px;min-height:456px;}
.super1 dd{ width:1200px; height:170px; margin:-170px auto 0; position:relative;}
.super1 dd .sudd{ background:#1e3753; height:170px; padding-left:360px; position:relative; margin-left:-360px;}
.super1 dd strong{ font:34px "Microsoft YaHei UI"; font-weight:bold; color:#fff; padding:36px 0 7px;}
.super1 dd p{ font:14px "Microsoft YaHei UI"; line-height:26px; color:rgba(255,255,255,0.5); padding-left:20px; position:relative; width:1000px;}
.super1 dd p:before{ content:""; position:absolute; left:0; top:8px; width:3px; height:3px; border-radius:3px; border:2px solid #8c99a7;}
.super_arr{ height:170px; width:170px; background:#cb0912; position:absolute; bottom:1px; left:50%; margin-left:430px; text-align:center; font:30px "宋体"; font-weight:bold; color:#fff; line-height:170px;}
.super_arr a{color:#fff; padding:0 18px; cursor:pointer; position:relative;}
.super_arr a:last-child{ border:0;}


.new{ height:460px; width:1200px; margin:100px auto 0; position:relative;}
.new .tit{ text-align:left; height:260px; height:160px; float:left;}
.newt{ width:205px;float:left;}
.newt span{ font:14px "Microsoft YaHei UI"; font-weight:bold; line-height:50px; }
.newt span a{ display:block; height:50px; border-bottom:1px solid #c7c6c3; color:#000;}
.newt .cur a{ color:#c70000; border-bottom:1px solid #c70000; background:url(../images/new_arr.png) no-repeat right center;}
.new1{width:835px; float:right; position:relative; margin-top:-160px;}
.new dl{ width:835px; overflow:hidden; }
.new dd{ width:440px; float:left;}
.new dd em{ display:block; height:80px; border-bottom:1px solid #ccc; font:48px Arial, Helvetica, sans-serif; color:#666;}
.new dd strong{ font:24px "Microsoft YaHei UI"; line-height:38px; margin:34px 0; height:76px;}
.new dd strong a{ color:#333;}
.new dd p{ font:14px "Microsoft YaHei UI"; line-height:25px; color:#666;}
.new dd span a{ display:block; margin-top:34px; width:75px; height:32px; font:14px "Microsoft YaHei UI"; color:#333; border-bottom:2px solid #333;}
.new dt{ width:330px; float:right;}
.new dt img{ display:block; width:330px; height:330px;}
.new dt em{ display:block; height:70px; background:#cb0912; font:18px "Microsoft YaHei UI"; text-align:center; color:#fff; line-height:70px;}
.new dl:hover dd h3 a,.new dl:hover dd span a,.new_hot li a:hover{ color:#cb0912;}
.newt2{ height:6px; text-align:center;}
.newt2 a{ display:inline-block; width:6px; height:6px; border-radius:6px; background:#3d3d3d; margin:0 6px;}
.newt2 .cur2{ background:#cb0912;}

.new_hot{ width:1200px; margin:0 auto; height:240px; overflow:hidden;}
.new_hot .new_hot_tel{ font:16px "Microsoft YaHei UI"; color:#666; background:url(../images/new_lx.png) no-repeat left top; padding-top:34px;width:220px; float:left;}
.new_hot .new_hot_tel em{ display:block; font:26px Arial, Helvetica, sans-serif; font-weight:bold; color:#333; line-height:38px; margin-top:34px;}
.new_hot ul{ width:835px; border-top:1px solid #ccc; float:right;}
.new_hot li{ width:340px; font:16px "Microsoft YaHei UI"; color:#666; margin-top:26px;}
.new_hot li a{ display:block; color:#666;}
.new_hot li em{ display:block; font:18px "Microsoft YaHei UI"; color:#000; margin-bottom:6px;}
.new_hot li em i{ font:14px "Microsoft YaHei UI"; padding-left:8px;}
.new_hot li:nth-child(2n-1){ float:left;}
.new_hot li:nth-child(2n){ float:right;}

.about{ background:url(../images/about_bg.jpg) no-repeat center top; height:793px; overflow:hidden;}
.about .content{ position:relative;}
.about1{ height:370px; width:690px; margin-top:120px; float:left;}
.about1 dt{ font:48px Arial, Helvetica, sans-serif; font-weight:bold; color:#fff; margin-bottom:15px;}
.about1 dd p{ font:16px "Microsoft YaHei UI"; line-height:52px; color:#fff; padding-left:20px; position:relative;}
.about1 dd p:before{ content:""; position:absolute; top:21px; left:0; width:6px; height:6px; border-radius:6px; border:2px solid #fff;}
.aboutt{ width:560px; position:absolute; top:0; right:0;}
.aboutt .aboutt_hot{ font:20px "Microsoft YaHei UI"; color:#fff; background:url(../images/aout_dot1.png) no-repeat left center; padding-left:35px; position:absolute;}
.aboutt .aboutt_hot:nth-child(1){ top:184px; left:305px;}
.aboutt .aboutt_hot:nth-child(2){top:310px; left:235px;}
.aboutt .aboutt_hot:nth-child(3){top:440px; left:140px;}
.aboutt .aboutt_hot:nth-child(4){top:570px; left:16px;}
.aboutt .cur{background:url(../images/aout_dot2.png) no-repeat left center;}
.about span{ width:222px; height:50px; background:#cb0912 url(../images/guan_arr.png) no-repeat 140px center; border-radius:3rem; font:16px "Microsoft YaHei UI"; line-height:50px;}
.about span a{ display:block; color:#fff; padding-left:60px;}

.pic{ height:180px; background:#f3f3f3; padding:50px 0;}
.pic dl{ width:299px; height:180px; border-right:1px solid #cdcdcd; float:left; text-align:center;}
.pic a:last-child dl{ border:0;}
.pic dt{ width:82px; height:82px; background:#23303e; border-radius:82px; margin:0 auto 24px;}
.pic dd h4{ font:18px "Microsoft YaHei UI"; color:#333;}
.pic dd p{ width:190px; font:14px "Microsoft YaHei UI"; line-height:22px; color:#666; margin:14px auto 0;}
.pic dl:hover{transform: translateY(-10px);transition: all 0.5s linear;-webkit-transition: all 0.5s linear;-moz-transition: all 0.5s linear;-o-transition: all 0.5s linear;}
.pic dl:hover dt{ background:#cb0912;}
.pic dl:hover dd h4{ font-weight:bold; color:#cb0912;}

.link{ height:70px;font:14px "Microsoft YaHei"; color:#fff; line-height:70px; background:#23303e;}
.link a{ display: inline-block; font:14px "Microsoft YaHei"; color:#fff; line-height:70px; height:70px; padding:0 25px;}
.link a:hover{font-weight:bold; text-decoration:underline; color:#cb0912;}


@keyframes living {
    0%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 6px;
    }
    50%{
        transform: scale(1);
        /* opacity: 0.7; */margin-top:0px;
    }
    100%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 6px;
    }
}
@keyframes living1 {
    0%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 0;
    }
    50%{
        transform: scale(1);
        /* opacity: 0.7; */margin-top: 0;
    }
    100%{
        transform: scale(1);
        /* opacity: 1; */margin-top: 0;
    }
}
@-webkit-keyframes spin{
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*animation*/
@-webkit-keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}