@charset "UTF-8";

html{width: 100%;}
body{font:500 14px/1.3 "microsoft yahei",Microsoft YaHei,sans-serif;}
.arrowUp:before{border-bottom-color:#666;left:0;top:0;}
.arrowUp:after{border-bottom-color:#fff;left:0;top:1px;}
.arrowDown:before{border-top-color:#666;left:0;bottom:0;}
.arrowDown:after{border-top-color:#fff;left:0;bottom:1px;}
.arrowLeft:before{border-right-color:#666;top:0;left:0;}
.arrowLeft:after{border-right-color:#fff;top:0;left:1px;}
.arrowRight:before{border-left-color:#666;top:0;right:0;}
.arrowRight:after{border-left-color:#fff;top:0;right:1px;}
a:hover .arrowUp:before{border-bottom-color:#ce3f51;}
a:hover .arrowDown:before{border-top-color:#ce3f51;}
a:hover .arrowLeft:before{border-right-color:#ce3f51;}
a:hover .arrowRight:before{border-left-color:#ce3f51;}
a{color:#000;text-decoration:none;}
/*a:visited{color:#000;text-decoration:none;}*/
a:hover{color:#d90000;text-decoration:none;}
a:active{color:#d90000;text-decoration:none;}
.red{color: #f00;}
.pd10{padding: 0 10px;}
.comWidth{width: 1200px; margin: 0 auto;}
.icon{background: url(../images/icon_s.png) no-repeat; display: inline-block;}

.mainWrap{padding-top: 138px;}
.videoPlayBtn{display: block; width: 90px; height: 90px; position: absolute; left: 50%; top: 50%; margin-left: -45px; margin-top: -58px; cursor: pointer; background: url(../images/play_btn.png) no-repeat;}
img{
	max-height: 100%;
	vertical-align: middle;
	cursor: pointer;  
    /*transition: all 0.6s;*/
}
.magnifyImg{
    width: 276px;
    height: 190px;
    padding-bottom: 10px;
	overflow: hidden;
    border-bottom: 1px solid #eaeaea;
}
.magnifyImg img{
    display: block;
    margin: auto;
	-webkit-transition: all 1s;
    transition: all 1s;
}
.magnifyImg img:hover{
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
.magnifyImgs{
	overflow: hidden;
}
.magnifyImgs img{
	transition: transform 12s cubic-bezier(.23, 1, .32, 1); transform: scale(1);
}
.magnifyImgs img:hover{  
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}
.-image--fixed {
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
}
/** header **/
.header{position: fixed; height: 138px; z-index: 999; background: #fff; width: 100%; box-shadow: 0px 2px 6px 4px rgba(109, 109, 109,.4);}
.topBarBox{background: #4c4c4c;}
.topBar{height: 40px; line-height: 40px; color: #fff; background: #4c4c4c;}
.topBar .fr {
    height: 40px;overflow: hidden;
    }
.topBar .fr span,.top-icon1{
    float: left; height: 40px; line-height: 40px;
    }
.top-icon1{width: 20px; background: url(../images/icon01.png) 0 50% no-repeat;}
.header .topBar .comWidth{ position:relative;}
.top-icon2{margin-left: 60px; padding-left: 27px; background: url(../images/icon02.png) 0 50% no-repeat;}
.header .topBar .top-icon2{ float:left; height:40px;}
.header .topBar .top-icon2 > a{ padding-left:10px;}
.header .topBar .top-icon2 > a span{ display:block; width:75px; background:url(../images/icon08.png) 100% 50% no-repeat;}
.header .topBar .top-icon2 .ul{ display:none; position:absolute; width:120px; background:#4c4c4c; right: 20px; z-index:99; line-height:35px;}
.header .topBar .top-icon2:hover .ul{ display:block;}
.header .topBar .top-icon2 .ul li{ text-align:center; border-top:1px solid #cfcfcf;}
.header .topBar .top-icon2 .ul a{ color:#555; font-size:12px; color:#fff; padding:0 10px; text-align:center;}
.header .topBar .top-icon2 .ul a:hover{ color:#fff;}

.topBar a{color: #fff;}
.navWrap{position: relative; height: 98px;}
.logoBox{margin-top: 16px;}

.headrWrap .nav{ float:left; margin-left: 80px; font-size:12px; padding-top:18px;}
.headrWrap .nav .one > li{ float:left; padding: 0 15px; background: url(../images/nav-line.png) 100% 50% no-repeat;}
.headrWrap .nav .one > li > a{ line-height:78px; display:block; border-bottom:2px solid #fff; font-size:18px; position:relative;}
.headrWrap .nav .one > li > a i{ display:none;}
.headrWrap .nav .one > li.on > a{ border-color:#002870;}
.headrWrap .nav .one > li:hover > a i{ display:block; position:absolute; background:url(../images/pic_top_down_i.png); width:9px; height:8px; left:50%; bottom:-2px; margin-left:-6px;}
.headrWrap .nav .two{ display:none; position:absolute; width:100%; left:0; top:98px; background:#fff; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; padding:0 185px 30px 185px; overflow:hidden; z-index:90;border-top: 1px solid #d90000;}
.headrWrap .nav .two > li{ float:left; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:0; width:16.6%; padding-top:30px;}
.headrWrap .nav .two > li > a{ display:inline-block; font-size:15px;}

.headrWrap .nav .two.two3{padding: 0 100px 30px 200px;}
.headrWrap .nav .two4 .three dl,.headrWrap .nav .two5 .three dl{ margin:0; width: 155px; float: left; }
.headrWrap .nav .two5 .three dl dt,.headrWrap .nav .two5 .three dl dd,
.headrWrap .nav .two4 .three dl dt,.headrWrap .nav .two4 .three dl dd{ margin:0; width:100%; float: left; }
.headrWrap .nav .two4 .three dl dt,.headrWrap .nav .two5 .three dl dt{ font-size: 16px; flex-flow:bold }
.headrWrap .nav .two5 .three .block{ padding-left:10px; }
.headrWrap .nav #nav5 .two5 .three .block{ padding-left:90px;}

.headrWrap .nav .two2{ display:none; position:absolute; width:100%; left:0; top:98px; background:#fff; overflow:hidden; z-index:90; padding-bottom:10px;border-top: 1px solid #d90000;}
.headrWrap .nav .two2 .tab li{ float:left; width:16.6%; text-align:center; border-bottom:1px solid #c7c7c7;}
.headrWrap .nav .two2 .tab li a{ display:block; font-size:16px; color:#0c0c0c; line-height:58px; position:relative;}
.headrWrap .nav .two2 .tab li.on a{ background:none;}
.headrWrap .nav .two2 .tab li a span{ display:inline-block; position:relative;}
.headrWrap .nav .two2 .tab li i{ display:block; width:100%; height:3px; bottom:-2px; position:relative;}
.headrWrap .nav .two2 .tab li.on i{ background:#d90000;}
.headrWrap .nav .three{ padding:20px; text-align:center; display:inline-block;}
.headrWrap .nav .three dl{ margin:0; width: 290px; float: left; text-align: left;}
.headrWrap .nav .list li:first-child dl{ width: 260px;}
.headrWrap .nav .list li:first-child dl:nth-child(4){ width: 170px;}
.headrWrap .nav .list li:first-child dl:nth-child(5){ width: 210px;}
.headrWrap .nav .three dl dt,.headrWrap .nav .three dl dd{ margin:0; width:100%; float: left;line-height: 28px; }
.headrWrap .nav .three dl dt{ font-size:14px; color: #333;}
.headrWrap .nav .three dl dd{ display:inline-block; font-size:13px; color: #666; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.headrWrap .nav .three dl dd a{ padding-left: 20px; background:url(../images/button_top_down_off.png) 5px center no-repeat; }
.headrWrap .nav .three dl dd a:hover{ background:url(../images/button_top_down_on.png) 5px center no-repeat;}

.headrWrap .search{float: right;}
.headrWrap form{display: inline-block; margin: 0px 10px; width: 145px; height: 32px; line-height: 32px; background: #cfcfcf;  -moz-border-radius:15px; -ms-border-radius:15px; -webkit-border-radius: 15px; border-radius:15px; position: relative; top: 40px;}
.headrWrap form .textbox{float: left; margin-left: 10px; width: 100px; height: 32px; line-height: 32px; border: 0 none; background: none; color: #fff;}
input::-webkit-input-placeholder,input::-ms-input-placeholder {
    color: #fff;
    }

input:focus::-webkit-input-placeholder,
input:focus::-ms-input-placeholder {
    color: #fff;
    }
.headrWrap form .submit{ width: 32px; height: 32px; border: 0 none; background: url(../images/icon03.png) no-repeat 50% 50%; text-indent: -999px; cursor: pointer;}


.iconHome{background-position: 0 -193px; width: 28px; height: 28px; vertical-align: sub; margin-right: -8px;}
span.cur .iconHome{background-position: 0 -30px;}
.navItem > a{font-size: 18px; display: inline-block; padding: 0 10px 0 10px; border-right: 1px solid #999; line-height: 1;}
.headrWrap .cur a{color: #d90000;}
.iconSearch{background-position: 0 -70px; display: inline-block; width: 20px; height: 20px; margin-left: 8px; vertical-align: -2px;}
/** header **/

/** footer **/
.footer{background: #383838;}
.footWrap{padding: 50px 40px;}
.floor2{ border-top: 1px solid #484848; padding-top: 22px; padding-bottom: 40px;}
.floor2 p{color: #e6e6e6;}
.footLeft{float: left; width: 260px;}
.fStock, .fTell{margin-top: 50px;}
.iconStock{background-position: 0 -102px; width: 36px; height: 36px; vertical-align: bottom; margin-right: 14px;}
.stockTxt span{display: block; color: #e5e5e5;}
.iconTel{background-position: 0 -144px; width: 37px; height: 37px; vertical-align: bottom; margin-right: 14px;}
/*.footRight{margin-left: 300px;}*/
.footNav{padding: 0 60px 0 40px; border-left: 1px solid #484848; min-height: 214px; }
.footNav dt{color: #fff; font-size: 18px; margin-bottom: 18px;}
.footNav dt a{color: #fff;}
.footNav dd{line-height: 32px; color: #e5e5e5;}
.footNav dd::before{content: "•"; padding-right: 5px; color: #808080;}
.footNav dd a{color: #e5e5e5;}
.footNav dd a:hover{color: #d90000;}
.fqrcode{height: 86px;}
.footNav:last-child{border-left: none;}
.footNav:last-child dd::before{content: ""}

.footNav .icon1 {
    margin-bottom: 10px;
    padding-left: 20px;
    height: 20px;
    line-height: 20px;
    background: url(../images/icon06.png) 0 50% no-repeat;
    color: #fff;
    }
.footNav .icon2 {
    margin-bottom: 10px;
    padding-left: 20px;
    height: 20px;
    line-height: 20px;
    background: url(../images/icon07.png) 0 50% no-repeat;
    color: #fff;
    }
.footNav .icon-link{
    padding-top: 15px;
    }
.footNav .icon-link span{
    display: inline-block;
    margin-right: 10px;
    }
/** footer **/

/** 通用面包屑导航及二级菜单 **/

#nav {
    position: relative;
    top: -138px; // 偏移值
    display: block;
    height: 0;
    overflow: hidden;
}
.navigatWrap{background: #f5f5f5;}
.navigation{line-height: 70px; color: #888;}
.navigation a{color: #888;}
.navigation a:hover{color: #d90000;}
.subNavItem{display: inline-block; height: 42px; text-align: center; padding: 0 38px; position: relative; border-radius: 3px;}
.subNavItem span{color: #444; line-height: 41px;}
.subNavItem span.navEnTxt{margin-top: 8px;}
.subNavWrap{text-align: center; padding: 28px 0 50px;}
.subNavWrap a.cur{background: #d90000;}
.subNavWrap a.cur span{color: #fff;}
.subNavItem:hover span{color:#d90000;}
.subNavItem .arrowDown{display: none;}
.subNavWrap a.cur .arrowDown{display: inline-block; position: absolute; bottom: -6px;left: 50%; margin-left: -3px;}
.subNavWrap a.cur .arrowDown:before{border-top-color: #d90000;}
.subNavWrap a.cur .arrowDown:after{border-top-color: #d90000;}
.navCnTxt{font-size: 18px;}
/** 通用面包屑导航及二级菜单 **/

/** 通用分页 **/
.page-area {clear: both;margin: 30px auto;letter-spacing: -0.34em;text-align: center;}
.pages,.page-area a, .page-area span, .page-area i, .page-area input { display: inline-block; *display: inline; zoom: 1; vertical-align: top; letter-spacing: normal; text-align: center; }
.page-area .prev, .page-area .next {width: 28px;height: 26px;line-height: 26px;border: 1px solid #d5d5d5;margin-left: 10px;}
.page-area .page-number a {margin-left: 10px;width: 26px;height: 26px;line-height: 26px;border: 1px solid #d5d5d5;}
.page-area .page-number i { margin-left: 10px; }
.page-area .page-number a.on {background: #d90000;color: #ffffff;border: 1px solid #d90000;}
.page-area .textbox {margin-left: 8px;margin-right: 8px;padding-left: 10px;padding-right: 10px;width: 20px;height: 25px;line-height: 25px;border: 1px solid #c9c9c9;}
.page-area .button {margin-left: 10px;width: 50px;height: 26px;line-height: 26px;background: #d90000;color: #ffffff;border: 1px solid #d90000;font-size: 14px;font-family: "Microsoft YaHei";cursor: pointer;border-radius: 4px;}
.page-area .tj { padding-left: 10px; padding-right: 10px; height: 26px; line-height: 26px; }
.page-area .button-area { padding-left: 10px; padding-right: 10px; height: 26px; line-height: 26px; }
/** 通用分页 **/

/*main css*/
.main-im{position:fixed;right:10px;bottom:28px;z-index:100;width:60px;height:50px;}
.main-im .qq-container{width:60px;height:50px;}
.main-im .img-qq{max-width:60px;display:block;}
.main-im .whats-show{width:112px;height:137px;background:#ffffff;border-radius:10px;border:1px solid #dddddd;position:absolute;left:-125px;top:-92px;display:none;}
.main-im .whats-show .whats-sanjiao{width:0;height:0;border-style:solid;border-color:transparent transparent transparent #ffffff;border-width:6px;left:112px;top:108px;position:absolute;z-index:2;}
.main-im .whats-show .whats-sanjiao-big{width:0;height:0;bordesr-style:solid;border-color:transparent transparent transparent #dddddd;border-width:8px;left:112px;top:106px;position:absolute;}
.main-im .whats-show .whats-ma{width:104px;height:104px;padding-left:5px;padding-top:5px;}
.main-im .whats-show .whats-txt{position:absolute;top:110px;left:7px;width:100px;margin:0 auto;text-align:center;}


/*自定义一个透明度从0到1的动画，它的名称是fade-in*/
@keyframes fade-in{  
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-webkit-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-ms-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-o-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-moz-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
.animation-block .animate-2 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -ms-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .1s;
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
}

.animation-block .animate-3 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .2s;
    -webkit-transition-delay: .2s;
    transition-delay: .2s;
}

.animation-block .animate-4 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .3s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
}

.animation-block .animate-5 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .4s;
    -webkit-transition-delay: .4s;
    transition-delay: .4s;
}

.animation-block .animate-6 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .5s;
    -webkit-transition-delay: .5s;
    transition-delay: .5s;
}

.animation-block .animate-7 {
    -ms-transition-delay: .6s;
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

.animation-block .animate-8 {
    -ms-transition-delay: .7s;
    -webkit-transition-delay: .7s;
    transition-delay: .7s;
}

.animation-block .animate-9 {
    -ms-transition-delay: .8s;
    -webkit-transition-delay: .8s;
    transition-delay: .8s;
}

.animation-block .animate-10 {
    -ms-transition-delay: .9s;
    -webkit-transition-delay: .9s;
    transition-delay: .9s;
}
.animation-block.animated .animate-1,.animation-block.animated .animate-2,.animation-block.animated .animate-3,.animation-block.animated .animate-4 {
    opacity: 1;
    -ms-transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}