﻿/* CSS Reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, img, button{margin: 0;padding: 0;border: 0;}
html{-webkit-text-size-adjust:none; }
body{font-size:12px;*overflow-x:hidden;margin:0; padding:0;}
table{border-collapse:collapse; border-spacing:0;}
ol, ul, li{ list-style:none;}
blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;}
a{ text-decoration:none;color:#1a1a1a;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;} 
a:hover{text-decoration:none;color:#000;} 
a:focus{outline:0px dotted;text-decoration:none;}
a:focus, input:focus{ -moz-outline-style: none; text-decoration:none;} 
a *{-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;} 
* {font-family: 'Gotham-Bold',Arial,"微软雅黑","黑体",'宋体';color:#1a1a1a;font-style: normal;}
input,select,textarea {-webkit-appearance: none;border-radius: 0;}
input[type="button"], input[type="submit"], input[type="reset"],input[type="text"],input[type="password"] {-webkit-appearance: none; font-size:14px;}
input::-webkit-input-placeholder {color:#999;}
input::-moz-input-placeholder {color: #999;}
input::-ms-input-placeholder {color: #999;}
.fl{ float:left;}
.fr{ float:right;}
.clear { clear:both;}
.alltransition {-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}
body sup {display: inline-block!important;vertical-align: top;}
.blackbg {background: #000;}
.alpha0{filter:alpha(Opacity=0);-moz-opacity:0;opacity:0;}
.no-touch { height:100%;}
.no-touch body{ overflow:hidden;height:100%;}
.pcshow { display:block;}
.mbshow { display:none !important;}
.relative {position: relative;}
.h100 {overflow:hidden;height:100%;}
.h100 body{ overflow:hidden;height:100%;}
.clearfix{  *zoom: 1;}
.clearfix::after{content: ''; display: block; height: 0;clear: both;overflow: hidden; visibility: hidden;}


.img-enlarge {overflow: hidden;}
.img-enlarge img {cursor: pointer; transition: all 0.6s;width: 100%; height: 100%; }
.img-enlarge:hover img{  transform: scale(1.1);}

.nav_mobile.top-100 {}
.nav_mobile.top-100 .mheader{top: -120px;}
.nav_mobile.scfixed {}
.nav_mobile.scfixed .mheader {width:350px;height:100px;}
.nav_mobile.scfixed .mlogo {width:230px;height:100px;}
.nav_mobile.scfixed .eader-nav {width:120px;height:100px;}
.nav_mobile.scfixed .cd-nav-trigger{width:120px;height:100px;}
.nav_mobile.scfixed *{-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}

.slideUp .mheader{top: -120px;}
.slideDown .mheader{top: 0px;}
.cased .slideDown .mheader{ height:100px;}


/* mobile nav */
.nav_mobile{display: block;position: relative;}
.mheader {width:350px;height:120px;position:fixed;left: 0;top: 0;z-index: 93; background:#FFF;overflow: hidden;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}
.mlogo {display: block; width:230px;height:120px;overflow: hidden;background: url(../images/logo-h.jpg) center no-repeat; z-index: 94; float:right; background-color: #2B5F53;}
.header-nav {width:120px;height:120px;background:#282828; position:relative;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}

.cd-nav-trigger{width:120px;height:120px;position: absolute;z-index:898;top:0;left:0;overflow: hidden;text-indent: 100%;white-space: nowrap;-webkit-transition: -webkit-transform 0.2s;-moz-transition: -moz-transform 0.2s;transition: transform 0.2s;}
.cd-nav-trigger span{ opacity:.6;background:#fff;position: absolute; left: 50%; top: 50%; bottom: auto; right: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width:30px; height: 2px;}
.cd-nav-trigger span::before, .cd-nav-trigger span:after{content: ''; position: absolute; top: 0; right: 0; width: 100%; height: 100%; background: inherit; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform 0.2s, width 0.2s; -moz-transition: -moz-transform 0.2s, width 0.2s; transition: transform 0.2s, width 0.2s;}
.cd-nav-trigger span::before{-webkit-transform-origin: right top; -moz-transform-origin: right top; -ms-transform-origin: right top; -o-transform-origin: right top; transform-origin: right top; -webkit-transform: translateY(-8px); -moz-transform: translateY(-8px); -ms-transform: translateY(-8px); -o-transform: translateY(-8px); transform: translateY(-8px);}
.cd-nav-trigger span::after{-webkit-transform-origin: right bottom; -moz-transform-origin: right bottom; -ms-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: translateY(8px); -moz-transform: translateY(8px); -ms-transform: translateY(8px); -o-transform: translateY(8px); transform: translateY(8px);}

.cd-nav-trigger:hover span {opacity:1;}


.no-touch .cd-nav-trigger{-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
.no-touch .cd-nav-trigger span{background:#fff;}
.no-touch .cd-nav-trigger span::after,.no-touch .cd-nav-trigger span::before{width: 50%;background:#fff;}
.no-touch .cd-nav-trigger span::before{-webkit-transform: translateX(2px) translateY(1px) rotate(45deg);-moz-transform: translateX(2px) translateY(1px) rotate(45deg);-ms-transform: translateX(2px) translateY(1px) rotate(45deg);-o-transform: translateX(2px) translateY(1px) rotate(45deg);transform: translateX(2px) translateY(1px) rotate(45deg);}
.no-touch .cd-nav-trigger span::after{-webkit-transform: translateX(2px) translateY(-1px) rotate(-45deg);-moz-transform: translateX(2px) translateY(-1px) rotate(-45deg);-ms-transform: translateX(2px) translateY(-1px) rotate(-45deg);-o-transform: translateX(2px) translateY(-1px) rotate(-45deg);transform: translateX(2px) translateY(-1px) rotate(-45deg);}

.cd-nav-container{background-color:#080808;position: fixed; z-index:91; top:0px; left: 0; width: 100%; height: 100%;overflow:hidden; 
-webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: -webkit-transform 0.4s 0s; -moz-transition: -moz-transform 0.4s 0s; transition: transform 0.4s 0s,
}

.cd-nav-container.is-visible{-webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0);-webkit-overflow-scrolling: touch;}


.cd-close-nav{position: absolute; height: 44px; width: 44px; right:6%; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); overflow: hidden; text-indent: 100%; white-space: nowrap; -webkit-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s;}
.cd-close-nav::after, .cd-close-nav::before{content: ''; position: absolute; height:1px; width: 32px; left: 50%; top: 50%; background-color: #666; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.cd-close-nav::after{-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg); -o-transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg);}
.cd-close-nav::before{-webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg); -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg); -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg); transform: translateX(-50%) translateY(-50%) rotate(-45deg);}

.no-touch .cd-close-nav:hover{opacity: .8;}
.cd-nav {width:83%; padding-left:17%;}
.cd-nav li{ margin: auto; overflow:hidden;position: relative;}
.cd-nav li * {-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}
.cd-nav li a{ position: relative; display:inline-block; margin: 1.55% auto auto;padding-bottom: 1.55%; padding-left:30px;overflow:hidden;}
.cd-nav li a h3 {font-size:36px;color:#666;display:block; text-transform: uppercase; min-width: 180px;}
.cd-nav li a h2 {font-size:34px;padding-bottom:10px;color:#fff;display:block; position:absolute; left:230px;min-width: 200px;top:0; z-index:1; background:#080808; opacity:0;}
/*
.cd-nav li a:hover{color:#fff;}
.cd-nav li a h2::after {content: '';width:1%;height:2px;background:#fff;position:absolute;left:0px;bottom:0px;} 
.cd-nav li a:hover h2::after {width:100%;}  
*/
.cd-nav li a:hover h2{display:block;left:30px; opacity:1;} 
.cd-nav li a:hover h3{color:#080808;} 
.cd-nav li a i { display: block; position:absolute; left:0px; top:10px; font-size:14px; color:#666; font-weight:bold;} 
.cd-nav li a:hover i{color:#fff;} 
.cd-overlay{position: fixed; height: 100%; width: 100%; top: 0; left: 0; cursor: pointer; visibility: hidden; opacity: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: opacity 0.4s 0s, visibility 0s 0.4s; -moz-transition: opacity 0.4s 0s, visibility 0s 0.4s; transition: opacity 0.4s 0s, visibility 0s 0.4s; z-index:19;}
.cd-overlay.is-visible{opacity: 1; visibility: visible; -webkit-transition: opacity 0.4s 0s, visibility 0s 0s; -moz-transition: opacity 0.4s 0s, visibility 0s 0s; transition: opacity 0.4s 0s, visibility 0s 0s;}


.cd-nav li a h4 {display:block; }
.cd-nav li a h4 span {font-size:46px;color:#666;text-transform: uppercase;}
.cd-nav li a h4::before{content:'';position:absolute;height:70%;top: 0;width:100%;border-width:1px 0;border-color:#fff;border-style:solid;left:0;-webkit-transform:translate3d(-101%,0,0);transform:translate3d(-101%,0,0);-webkit-transition:-webkit-transform .5s;transition:transform .5s}
.cd-nav li a h4:hover::before{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.cd-nav li a h4 span{display:inline-block;position:relative;-webkit-transform:perspective(1000px) rotate3d(0,1,0,0deg);transform:perspective(1000px) rotate3d(0,1,0,0deg);-webkit-transition:-webkit-transform .5s,color .5s;transition:transform .5s,color .5s}
.cd-nav li a:hover h4 span{color:#fff;-webkit-transform:perspective(1000px) rotate3d(0,1,0,360deg);transform:perspective(1000px) rotate3d(0,1,0,360deg)}
.cd-nav li a h4 span:nth-child(8),.cd-nav li a:hover h4 span:first-child{-webkit-transition-delay:0s;transition-delay:0s}
.cd-nav li a h4 span:nth-child(7),.cd-nav li a:hover h4 span:nth-child(2){-webkit-transition-delay:.1s;transition-delay:.1s}
.cd-nav li a h4 span:nth-child(6),.cd-nav li a:hover h4 span:nth-child(3){-webkit-transition-delay:.2s;transition-delay:.2s}
.cd-nav li a h4 span:nth-child(5),.cd-nav li a:hover h4 span:nth-child(4){-webkit-transition-delay:.3s;transition-delay:.3s}
.cd-nav li a h4 span:nth-child(4),.cd-nav li a:hover h4 span:nth-child(5){-webkit-transition-delay:.4s;transition-delay:.4s}
.cd-nav li a h4 span:nth-child(3),.cd-nav li a:hover h4 span:nth-child(6){-webkit-transition-delay:.5s;transition-delay:.5s}
.cd-nav li a h4 span:nth-child(2),.cd-nav li a:hover h4 span:nth-child(7){-webkit-transition-delay:.6s;transition-delay:.6s}
.cd-nav li a h4 span:first-child,.cd-nav li a:hover h4 span:nth-child(8){-webkit-transition-delay:.7s;transition-delay:.7s}
.cd-nav li a h4 span { min-width: 15px;}




.cd-nav-container.is-visible .cd-nav li{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}
.cd-nav-container.is-visible .cd-nav li.dnav1 {-webkit-animation-duration:.7s;animation-duration:.7s;}
.cd-nav-container.is-visible .cd-nav li.dnav2 {-webkit-animation-duration:.8s;animation-duration:.8s;}
.cd-nav-container.is-visible .cd-nav li.dnav3 {-webkit-animation-duration:.9s;animation-duration:.9s;}
.cd-nav-container.is-visible .cd-nav li.dnav4 {-webkit-animation-duration:1.0s;animation-duration:1.0s;}
.cd-nav-container.is-visible .cd-nav li.dnav5 {-webkit-animation-duration:1.1s;animation-duration:1.1s;}

 


.cd-encontact { background:#121212; position:absolute; right:0px; top:0px; width:30%; height:60%; z-index:5; text-align:center;} 
.cd-encontact h4 { color:#656565; font-size:20px; padding-bottom:20px;}
.cd-encontact li { overflow:hidden; padding:10px 0;} 
.cd-encontact li h5{color:#656565; font-size:14px;font-family: 'Gotham-Book',Arial,"微软雅黑","黑体",'宋体';} 
.cd-encontact li h5 strong {color:#fff; font-size:14px;} 
.cd-encontact li a{ display:inline-block; margin:1%; padding:18px; overflow:hidden;border-radius:100%; background:url(../images/qq-b.svg) center no-repeat #666; background-size:45%;opacity:.3;} 
.cd-encontact li a:hover { opacity:1;}
.cd-cncontact { background:#1c1c1c; position:absolute; right:0px; bottom:0px; width:30%; height:40%; z-index:5;text-align:center;} 
.cd-cncontact i { display:block; margin:auto; width:25px; height:25px; background:url(../images/add-b.svg) center no-repeat; background-size:100%; opacity:.4;}
.cd-cncontact li { overflow:hidden; padding:10px 0; color:#939393; font-size:12px; line-height:24px;} 
.cd-cncontact li a {display:inline-block; position:relative; color:#CCC; padding-bottom:5px; overflow:hidden;opacity:.4;font-family: Arial;}
.cd-cncontact li a::after {content: '';width:100%;height:1px;background:#ccc;position:absolute;left:0px;bottom:0px;}  
.cd-cncontact li a:hover { opacity:1;color:#fff;}


.cd-nav-container .d-table {padding-top: 120px;}
.cd-nav-container .cd-encontact .d-table,.cd-nav-container .cd-cncontact .d-table{padding-top: 0px;}


.cd-nav-container .mhtel { border-top: 1px solid #212121;overflow: hidden; text-align: left; margin: 2% 80px 0 80px;}
.cd-nav-container .mhtel h3 {display: inline-block;border-radius:3px; margin-top: 15%;background: #000 url("../images/ctel.svg") 10% center no-repeat;background-size: 10%; padding: 10px 20px 10px 40px;border: 1px solid rgba(255,255,255,.5);overflow: hidden;opacity: 0.5;text-align: center;}
.cd-nav-container .mhtel h3 a {color: #fff;font-size: 16px;}




.header_top { background:#000; position: fixed; left:0; top:-100px; width:100%; height:60px; z-index:999;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;transition:all .5s ease;}
.ht_fixed { top:0;}
.header_content{ overflow:hidden;width:87%; height:60px; margin:auto;}
.h_logo{ background: url(../images/logo-b2.png) left center no-repeat;background-size:100%; width:100px; height:60px; display:block; float:left;position: relative;}
.header_nav{float:right;width:75%; text-align:right;}
.header_nav  li{margin-left:40px; display:inline-block;}
.header_nav  li a{ font-size:14px;display:block;padding-top: 0;line-height: 60px;color: #bababa;text-decoration:none;}
.header_nav  li a span {color: #bababa;}
.header_nav  li a:hover,.header_nav  li a:hover span{color: #fff;}
.hnone .mheader{ top: -140px;}
.htlogo {float:left;}
.htlogo .h_logo{float:left;opacity: .9;}
.htlogo h6{float:left; display:block; font-size:14px; line-height:60px; margin-left: 15px;padding-left: 14px; color:#bababa; position:relative;}
.htlogo h6::after {content: '';width:1px;height: 20px;background: #bababa;position: absolute;left:0;top:50%; margin-top:-9px; opacity:.3;}
.header-nav-tel{margin-left:20px;display: inline-block;color: rgb(99, 90, 90); font-size: 14px;padding-left:20px;position: relative; color: #FFF;}
.header-nav-tel::before {content: '';width: 1px;height: 20px;background: #bababa;position: absolute;left: 0;top: 50%;margin-top: -9px;opacity: .3;}


 




.rolling-top {position: fixed; right:2%;bottom:10%;width: 30px; height: 80px; z-index: 999; display:none;cursor: pointer;}
.rolling-top h6 {font-size: 12px;color: #666;width: 10px;position:absolute;right:-5px;bottom:-20px;font-weight: normal;}
.rolling-top span { position: relative;width:100%;height:100%; display: block;}
.rolling-top i{ display: block;height:10px; width: 1px;position:absolute;left:50%;top:10%; margin-left: -1px; background: #666;animation: rolling-top 2000ms infinite ease-out;-webkit-animation: rolling-top 2000ms infinite ease-out;}
@keyframes rolling-top{
	0%{height:100px;top:85%;opacity: 0;} 
	100%{height:30px;top:10%;opacity: 1;}
}
.rolling-top:hover h6{color: #fa8d3e;}
.rolling-top:hover i{background: #fa8d3e;}



/* 滚动内容样式 */
.scroll_main{width:100%;display: block;}
.scroll_wrap {width:100%;height: 610px;position: relative;}
.scroll_cont{height: 100%;overflow: hidden; padding-right:5%;}
.scroll_bar{position: absolute;top:0;right:0;width:4px;height: 100%;background-color: #ededed;}
.scroll_slider{position: absolute;top:0px;right:0px;width:4px;height:100px;background-color:#1a1a1a; overflow:hidden;opacity:1.5; cursor:pointer;z-index: 9;}
.scroll_slider:hover{background-color:#fa8d3e;}


.aside-right {position: fixed; top: 75%; margin-top: -78px; right: 0; width: 50px; z-index:90;}
.aside-right .aside-wrap {width: 100%;display: none;}
.aside-right ul li {position: relative; width: 50px; height: 50px; margin-bottom: 2px; margin-left: 0; cursor: pointer;}
.aside-right ul li a {display: block; width: 100%; height: 100%;}
.aside-right ul li.aside-wc a {background: #b2b2b2 url(../images/aside-wc.svg) no-repeat center;}
.aside-right ul li.aside-wc .wechat-code {display: none; position: absolute; left: -130px; top: -35px; z-index: 1000; width: 120px; height: auto; padding:2px; background:#FFF;}
.aside-right ul li.aside-wc .wechat-code:before{position:absolute;right:-15px;top:50px;content:'';border-left:8px #fff dashed;border-top:8px transparent dashed;border-right:8px transparent dashed;border-bottom:8px transparent solid;}
.aside-right ul li.aside-wc .wechat-code img {display: block; width: 100%; height:auto; max-width: 100%;}
.aside-right ul li.aside-qq a {background: #b2b2b2 url(../images/aside-qq.svg) no-repeat center;}
.aside-right ul li.aside-top a {background: #b2b2b2 url(../images/aside-top.svg) no-repeat center;}
.aside-right ul li.aside-wc a:hover {background: #ff6a00 url(../images/aside-wc.svg) no-repeat center;}
.aside-right ul li.aside-qq a:hover {background: #ff6a00 url(../images/aside-qq.svg) no-repeat center;}
.aside-right ul li.aside-top a:hover {background: #ff6a00 url(../images/aside-top.svg) no-repeat center;}
.aside-right ul li.aside-fulltop a {background: #b2b2b2 url(../images/aside-top.svg) no-repeat center;}
.aside-right ul li.aside-fulltop a:hover {background: #ff6a00 url(../images/aside-top.svg) no-repeat center;}


