@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/ban_prev.png) no-repeat;}
.banner .slick-next {right: 10%; display: none;background:url(../images/ban_next.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:#0054aa;width: 17px;height: 17px;border-radius: 17px;border:0; box-shadow:0; -webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
.slick-dots .slick-active button {background:#e50016;border:0; width:45px;} 

.tit{ font:42px "Microsoft YaHei UI"; text-align:center; color:#111; height:140px;}
.tit a{ color:#333;}
.tit em{ display:block; font-size:20px; padding:15px 0 0; margin-top:8px; color:#555; background:url(../images/line.png) no-repeat center top;}

.pro{padding-top:75px; height:1253px; background:url(../images/pro_bg.jpg) no-repeat center 317px; overflow:hidden;}
.prot{ height:100px; overflow:hidden; position:relative;}
.prot h3{ width:237px; height:90px; float:left; margin-right:3px; background:#0054aa; font:22px "Microsoft YaHei UI"; font-weight:bold; text-align:center;}
.prot h3 a{ display:block; color:#fff; padding-top:22px;}
.prot h3 em{ display:block; font:12px "Microsoft YaHei UI"; opacity:0.5; line-height:20px;}
.prot h3:last-child{ margin-right:0;}
.prot .cur{ background:#e50016;-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}

.pro1,.pro2{ height:602px;}
.pro1 h3{ width:644px; height:602px; float:left; position:relative; overflow:hidden;}
.pro1 h3 img{ display:block;width:644px; height:602px;}
.pro1 dl{ width:545px; float:right; margin-top:40px;}
.pro1 dt{ height:48px; margin-bottom:32px;}
.pro1 dt a{ display:block; float:left; width:103px; height:46px; background:#e5e5e5; border:1px solid #e5e5e5; float:left; margin-right:4px; font:16px "Microsoft YaHei UI"; text-align:center; color:#555; line-height:46px;}
.pro1 dt a:hover{ border:1px solid #0054aa;}
.pro1 dt a:last-child{ margin-right:0;}
.pro1 dd{ height:460px;}
.pro1 dd p{ width:260px; height:195px; float:left; margin-bottom:25px;}
.pro1 dd p:nth-child(2n){ float:right;}
.pro1 dd p:nth-child(2n-1){ clear:both;}
.pro1 dd p img{ display:block; width:260px; height:195px;}
.pro1 dd p:hover img{ border:4px solid #0054aa; width:252px; height:187px;}
.pro1 h3:before{content: '';
            cursor: pointer;
            position: absolute;
            left: -100%;
            top: 0;
            width: 100%;
            height: 100%;
            background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
            transform: skewx(-25deg);}
.pro1 h3:hover:before{
            left: 100%;
            -moz-transition: 1s;
            -o-transition: 1s;
            -webkit-transition: 1s;
            transition: 1s;
        }
.pro3{ height:345px; margin-top:40px;}
.pro3 li{ width:289px; border:1px solid rgba(255,150,0,0); float:left; margin-right:12px;}
.pro3 li img{ display:block; width:100%;}
.pro3 li em{ display:block; height:56px; font:16px "Microsoft YaHei UI"; line-height:56px; color:#333; overflow:hidden; text-align:center;}
.pro3 li:hover{border:1px solid rgba(255,150,0,1);}
.pro3 li:hover em{ color:#ff9600;}

.fang{ height:875px; padding-top:60px; background:#efefef;}
.fang .content{ width:1400px; margin:0 auto;}
.fangt{ height:60px; margin-bottom:23px;}
.fangt h3{ width:240px; height:60px; margin-right:2px; font:18px "Microsoft YaHei UI"; text-align:center; line-height:60px; float:left;}
.fangt h3 a{ display:block; background:#0054aa; color:#fff;}
.fangt h5 a{ display:block; float:right; width:190px; height:60px; font:18px "Microsoft YaHei UI"; text-align:center; line-height:60px; background:#0054aa; color:#fff;}
.fangt h3:nth-child(5){ margin-right:0;}
.fangt .cur a{ background:#e50016;-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}
.fang1 dl{ height:541px; background:url(../images/fang_bg.jpg) no-repeat right top;}
.fang1 dt{ width:720px; height:541px; float:left; overflow:hidden;}
.fang1 dt img{ display:block;width:720px; height:541px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.fang1 dd{ width:445px; margin-top:60px; background:#fff; border-radius:12px; padding:30px 40px 0; margin-left:55px; height:400px; float:left;}
.fang1 dd h3 a{ display:block; font:30px "Microsoft YaHei UI"; color:#111;}
.fang1 dd p{ font:16px "Microsoft YaHei UI"; line-height:30px; color:#666; margin:12px 0 40px;}
.fang1 dd h5{ height:200px;}
.fang1 dd h5 span{ display:block; width:186px; float:left;}
.fang1 dd h5 span img{ display:block; width:100%;}
.fang1 dd h5 span em{ display:block; width:70px; height:70px; background:#ff9600; border-radius:70px; font:16px "Microsoft YaHei UI"; text-align:center; line-height:70px; color:#fff; margin:-35px auto 0; position:relative;}
.fang1 dd h5 span:last-child{ float:right;}
.fang1 dd h5 span:last-child em{ background:#e50016;}
.fang1 dl:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.fang1 dl:hover dd h3 a{ color:#ff9600; font-weight:bold;}


.super{ background:url(../images/ys_bg.jpg) no-repeat center 140px; margin-top:75px;}
.super1{ height:2063px; background:url(../images/ys_bg2.jpg) no-repeat center bottom;}
.super dl{ width:460px; height:410px; margin-top:45px; float:right; clear:both;}
.super dt{ height:106px;}
.super dt b{ display:block; width:104px; border-right:2px solid #e6e6e6; float:left;}
.super dt b img{ display:block;}
.super dt span{ display:block; float:right; width:340px; font:30px  "Microsoft YaHei UI"; font-weight:bold; color:#0054aa; position:relative; margin-top:5px;}
.super dt span em{ display:block; font:16px "Microsoft YaHei UI"; color:#b3b3b3; padding-top:6px; letter-spacing:3px;}
.super dd h4{ background:#e7e7e7; padding:16px 20px; font:26px "Microsoft YaHei UI"; color:#0054aa; margin-bottom:30px;}
.super dd p{ font:16px "Microsoft YaHei UI"; line-height:30px; color:#666;}
.super dl:nth-child(2),.super dl:nth-child(4){ float:left;}
.super dl:nth-child(2){ margin-top:100px;}
.super dl:nth-child(2) dt span,.super dl:nth-child(2) dd p{ color:#fff;}
.super dl:nth-child(2) dt span em{ color:#6698cc;}
.super dl:nth-child(2) dd h4{ color:#fff; background:#e50016;}
.super dl:nth-child(3) dd h4{ width:440px;}
.super dl:nth-child(3){ margin-top:135px;}
.super dl:nth-child(4){ margin-top:60px;}
.super 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;}


.case{ background:url(../images/case_bg.jpg) no-repeat center top; height:880px; padding-top:87px; overflow:hidden;}
.case1 {width: 100%;min-width: 1200px;height: 391px;position: relative;}
.case2{width: 940px;position: absolute;left: 50%;margin-left: -470px;}
.case1 .tempWrap{overflow: visible !important;}
.case1 dl { position: relative; float:left; margin:0 10px 40px !important; width:940px; height:650px;}
.case1 dt{width:940px; height:530px; overflow:hidden; margin-top:50px; position:relative;}
.case1 dt img{ display:block; width:940px; height:530px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.case1 dt a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.case1 dt em{ display:block; width:100%; height:100%; background:rgba(0,84,170,0.5); position:absolute; top:0;}
.case1 dd{display:none; background:#efefef; padding:25px 60px; position:relative;}
.case1 dd h3{ font:16px "Microsoft YaHei UI";color:#0054aa;}
.case1 dd h3 a{ display:block; color:#0054aa;}
.case1 dd h3 em{font:26px "Microsoft YaHei UI"; line-height:28px; color:#333333; display:block; padding-top:8px;}
.case1 dd p{ width:210px; height:210px; border-radius:210px; position:absolute; top:-125px; right:60px;}
.case1 dd p img{width:210px; height:210px; border-radius:210px; display:block;}
.case1 .cur1 dd{ display:block;}
.case1 .cur1 dt{ margin:0;}
.case1 .cur1 dt em{ display:none;}
.case1 dl:hover dd h3 em{ font-weight:bold; color:#e50016;}
.prev2{width:62px;height: 62px;top:300px;z-index: 9;cursor: pointer;left: 50%;margin-left: -601px; background:url(../images/case_l.png) no-repeat center top; overflow:hidden;}
.next2{width:62px;height: 62px;top:300px;z-index: 9;cursor: pointer;left: 50%;margin-left: 540px;background:url(../images/case_r.png) no-repeat center top;overflow:hidden;}


.news{ height:780px; overflow:hidden;}
.dy{ width:610px; overflow:hidden;}
.dyt{ height:60px; border-bottom:2px solid #666; margin-bottom:30px;}
.dyt h3{ font:24px "Microsoft YaHei UI"; font-weight:bold; line-height:60px; color:#333; margin-right:40px; float:left;}
.dyt h3 a{ display:block; color:#333;}
.dyt h5 a{ display:block; float:right; font:14px Arial, Helvetica, sans-serif; text-transform:uppercase; color:#666; line-height:60px;}
.dyt h3 a:hover,.dyt .cur a,.dy li a:hover,.dy dl:hover dd h3 a{ color:#0054aa; font-weight:bold;}
.dy dl{ height:238px; margin-bottom:35px; background:#f1f1f1; height:238px;}
.dy dt{ width:238px; height:238px; float:left; overflow:hidden;}
.dy dt img{ display:block;width:238px; height:238px;transition: all 0.3s linear 0s;}
.dy dd{ width:320px; float:left; padding:35px 0 0 22px;}
.dy dd h3 a{ display:block; font:16px "Microsoft YaHei UI"; font-weight:bold; line-height:30px; color:#333;}
.dy dd p{ font:16px "Microsoft YaHei UI"; line-height:24px; color:#666; margin-top:12px;}
.dy li{ font:16px "Microsoft YaHei UI"; height:44px; line-height:44px; overflow:hidden;}
.dy li a{ display:block; color:#666;}
.dy li em{ float:right;}
.dy dl:hover dt img,.faq dl:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}

.faq{ width:500px; float:right; overflow:hidden;}
.faq h2{height:60px; border-bottom:2px solid #666; margin-bottom:30px;font:24px "Microsoft YaHei UI"; font-weight:bold; line-height:60px;}
.faq h2 a{ color:#333; }
.faq h2 em{display:block; float:right; font:14px Arial, Helvetica, sans-serif; text-transform:uppercase; color:#666; line-height:60px;}
.faq dl{height:120px; border-bottom:1px solid #dcdcdc; padding:15px 0; overflow:hidden;}
.faq dt{ width:120px; height:120px; float:left; overflow:hidden;}
.faq dt img{ display:block;width:120px; height:120px;transition: all 0.3s linear 0s;}
.faq dd{ width:355px; float:right;}
.faq dd h3 a{ display:block; font:16px "Microsoft YaHei UI"; font-weight:bold; line-height:40px; font-weight:bold; overflow:hidden; height:40px; color:#333;}
.faq dd p{ font:16px "Microsoft YaHei UI"; line-height:24px; height:48px; overflow:hidden; color:#666; margin-top:12px;}
.faq dl:hover dd h3 a{ font-weight:bold; color:#0054aa;}


.about{ background:url(../images/about_bg.jpg) no-repeat center top; height:864px; overflow:hidden;}
.about dl{ width:470px; float:left; margin-top:90px;}
.about dt{ padding-bottom:25px; border-bottom:1px solid #fff; font:48px "Microsoft YaHei UI"; font-weight:bold; color:#333;}
.about dt a{ display:block; color:#333;}
.about dt em{ display:block; font:18px "Microsoft YaHei UI"; color:#555; padding-top:10px;}
.about dt i{ display:block; font-size:68px; color:#fff;}
.about dd p{ margin:60px 0 54px; font:16px "Microsoft YaHei UI"; line-height:30px; color:#333;}
.about dd span a{ display:block; width:175px; height:56px; background:#e50016; font:16px "Microsoft YaHei UI"; text-align:center; line-height:56px; color:#fff;}
.about ul{ width:600px; float:right; margin-top:105px;}
.about li{ width:300px; height:300px; float:left; background:rgba(0,84,170,0.8); font:30px "Microsoft YaHei UI"; color:#fff;}
.about li a{ display:block; color:#fff; padding:60px 0 0 65px;}
.about li:nth-child(1){ margin-left:300px;}
.about li img{ display:block; margin-bottom:33px;}
.about li em{ display:block; font:12px "Microsoft YaHei UI"; text-transform:uppercase; margin-top:10px;white-space: nowrap;overflow: hidden; text-overflow: ellipsis;}
.about li:nth-child(3){ background:#c20113;}

.link{ background:#c40013; font:14px "Microsoft YaHei UI"; line-height:54px; color:#fff;}
.link a{ display: inline-block;padding:0 26px; font:14px "Microsoft YaHei";line-height:54px; height:54px; position:relative; color:#fff;}
.link a:hover{font-weight:bold; text-decoration:underline;}
.link a:last-child{ padding-right:0;}

@media (min-width: 1200px) and (max-width: 1680px) {
    .fangt h5 a{ width:140px; margin-left:2px; float:left;}
}


@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);
  }
}