/* CSS Document */
@charset "utf-8";
html, body { height: 100%; font-size: 16px; line-height: 1.5; color: #333; }
body {  margin: 0 auto; padding: 0; font-family: Arial; padding-top: 80px; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
audio:not([controls]) { display: none; height: 0; }
[hidden], template { display: none; }
a { background: transparent; text-decoration: none; -webkit-tap-highlight-color: transparent; color: #333; }
a:focus, a:hover { color: #fff; text-decoration: none; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
img { border: 0; vertical-align: middle; max-width: 100%; border: none; margin: 0; }
svg:not(:root) { overflow: hidden; }
em, i { font-style: normal; }
hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; }
pre { overflow: auto; white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
legend { border: 0; padding: 0; }
textarea { overflow: auto; resize: vertical; }
optgroup { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }
html, button, input, select, textarea { font-family: "Microsoft YaHei"; }
input::-moz-placeholder, textarea::-moz-placeholder { color: #666; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #666; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #666; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, h5, h6, p, figure, form, blockquote { margin: 0; }
ul, ol, li, dl, dd { margin: 0; padding: 0; }
li { list-style: none; }
ul, ol { list-style: none outside none; }
.fl { float: left; }
.fr { float: right; }
.left { float: left; }
.right { float: right; }
.tr { text-align: right; }
.tl { text-align: left; }
.tc { text-align: center; }
.clear { clear: both; height: 0px; line-height: 0px; zoom: 1; }
.clear:before, .clear:after { content: ""; display: table; }
.clear:after { clear: both; }
.clearfix:after,
.clearfix:before { content: ""; display: table; clear: both; }
.clearfix:after { clear: both; zoom: 1; }
.rel { position: relative; }
.abs { position: absolute; }
.ov { overflow: hidden; }
input, textarea { font-family: "Microsoft yahei"; font-size: 0.14rem; color: #fff; border: none; outline: medium none; }
.wrapper { overflow: hidden; }
.container { margin: 0 auto; width: 1200px; }

/* Header menu begin */
.menu-bar { position: absolute; display: none; right: 15px; top: 50%; margin-top: -12px; -webkit-transition: -webkit-transform .25s ease-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; -webkit-transition: top .25s ease-in-out; transition: transform .25s ease-out; transition: top .25s ease-in-out; }
.menu-bar .btn-menu { display: block; box-sizing: border-box; width: 30px; text-align: center; text-decoration: none; border-bottom: none; }
.menu-bar .btn-menu .menu-line { display: block; width: 30px; height: 3px; margin: 8px auto; border-radius: 2px; background-color: #edb100; }
.menu-bar .btn-menu .menu-line.menu-line-top { margin-top: 0; -webkit-transition: -webkit-transform .25s ease-out, background-color .25s ease-out; transition: transform .25s ease-out, background-color .25s ease-out; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: 0 50%; -ms-transform-origin: 0 50%; transform-origin: 0 50%; }
.menu-bar.is-open .btn-menu .menu-line.menu-line-top { width: 36px; -webkit-transform: rotate(45deg) translate(-1px, -1px) scaleX(1); -ms-transform: rotate(45deg) translate(-1px, -1px) scaleX(1); transform: rotate(45deg) translate(-1px, -1px) scaleX(1); background-color: #edb100; }
.menu-bar .btn-menu .menu-line.menu-line-middle { -webkit-transition: opacity .25s ease-out, background-color .25s ease-out; transition: opacity .25s ease-out, background-color .25s ease-out; opacity: 1; }
.menu-bar.is-open .btn-menu .menu-line.menu-line-middle { opacity: 0; }
.menu-bar .btn-menu .menu-line.menu-line-bottom { margin-bottom: 0; -webkit-transition: -webkit-transform .25s ease-out, background-color .25s ease-out; transition: transform .25s ease-out, background-color .25s ease-out; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: 0 50%; -ms-transform-origin: 0 50%; transform-origin: 0 50%; }
.menu-bar.is-open .btn-menu .menu-line.menu-line-bottom { width: 36px; -webkit-transform: rotate(-45deg) translate(-2px, 1px) scaleX(1); -ms-transform: rotate(-45deg) translate(-2px, 1px) scaleX(1); transform: rotate(-45deg) translate(-2px, 1px) scaleX(1); background-color: #edb100; }
/* Header menu end */
#menuBox { display: none; }

/**** Header--style--begin ****/
#Header { width: 100%; z-index: 99; position: fixed; left: 0; top: 0; background: #fff; height: 80px; }
#Header .logo { float: left; padding: 10px 0 14px 0;  }
#Header.active { box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1); }
#Header .nav { float: right; }
#Header .nav .nav-li { float: left; text-align: center; position: relative; margin: 0 15px; }
#Header .nav .nav-li > a { padding: 0 10px; line-height: 80px; font-size: 16px; color: #333; display: block; position: relative; transition: all 0.5s linear; -o-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
#Header .nav .nav-li:hover a, #Header .nav .nav-li.cur a { color: #edb100; }
#Header .nav .nav-li .nav-down { display: none; position: absolute; left: 0; top: 100px; width: 200px; z-index: 99; background: #fff; text-align: center; overflow: hidden; box-shadow: 1px 1px 5px #888; }
#Header .nav .nav-li .nav-down li { float: none; display: block; width: 100%; }
#Header .nav .nav-li .nav-down li a { position: relative; font-size: 14px; line-height: 50px; color: #7d7d7d; padding: 0 20px; text-align: left; display: block; transition: all 0.1s linear; }
#Header .nav .nav-li .nav-down li a > .icon-Arrow { position: absolute; right: 30px; line-height: 50px; height: 50px; display: block; top: 0; font-size: 16px; transition: all 0.3s linear; opacity: 0; filter: alpha(opacity=0); }
#Header .nav .nav-li .nav-down li > a::after { z-index: -1; position: absolute; width: 0; height: 100%; background: #d6222d; display: block; content: ""; left: 0; top: 0; transition: all 0.2s linear; }
#Header .nav .nav-li .nav-down li > a:hover { color: #fff; }
#Header .nav .nav-li .nav-down li > a:hover::after { width: 100%; }
#Header .nav .nav-li .nav-down li > a:hover > .icon-Arrow { right: 20px; opacity: 1; filter: alpha(opacity=100); }
#Header .nav .tool-li { margin-left: 8%; float: right; }
.mfyy-btn{ display: block; margin: 18px 0; width: 144px; font-size: 16px; color: #fff; line-height: 44px; border-radius: 22px; text-align: center; background: #edb100 url(../testimg/icon-mfyy.png) no-repeat left 18px center; background-size: 30px; padding-left: 20px;}

#Header .nav .nav-li #Pro-sub { position: fixed; top: 100px; left: 0; width: 1920px; padding: 30px; }
#Header .nav .nav-li #Pro-sub ul { width: 1200px; margin: 0 auto; }
#Header .nav .nav-li #Pro-sub li { float: left; width: 14%; border-right: 1px solid #ddd; height: 210px; }
#Header .nav .nav-li #Pro-sub li:last-child { border: none; }
#Header .nav .nav-li #Pro-sub dl { text-align: left; }
#Header .nav .nav-li #Pro-sub dl dt a { font-size: 14px; color: #000; font-weight: bold; }
#Header .nav .nav-li #Pro-sub dl dd a { border-bottom: none; font-size: 14px; color: #666; line-height: 40px; padding-right: 10px; }
#Header .nav .nav-li #Pro-sub dl dd a i { font-size: 12px; float: left; margin-right: 5px; }
#Header .nav .nav-li #Pro-sub dl dd a:hover { color: #e60012; }

/**** Header--style--end   ****/


/**** Footer--style--begin ****/
#Footer { position: relative; background: #222; }
.footer .main {  padding: 70px 0 40px 0; }
.footer .main .left { float: left; width: 36%; }
.footer .main .right { width: 60%; }
.footer .fot-zxrx{ margin-top: 25px; font-size: 16px; color: #fff; line-height: 40px; display: block;}
.footer .fot-zxrx span{ display: block; line-height: 1.2;}
.footer .fot-zxrx strong{ display: block; font-size: 24px; font-family: Arial;}
.f-nav dl{ float: left; width: 20%; padding-left: 40px;}
.f-nav dt { font-size: 16px; color: #fff; line-height: 50px; font-weight: 500; }
.f-nav dd a {font-size: 14px; line-height: 36px; color: #fff; display: block; transition: all 0.2s linear; opacity: 0.3; }
.f-nav dd a:hover { opacity: 1; }
.f-nav dl:first-child{ padding-left: 0;}
#Footer .bottom { padding: 20px 0; border-top: 1px solid #353535; font-size: 14px; color: #fff;  line-height: 40px;}
#Footer .bottom .left p {opacity: 0.1;}
#Footer .bottom a { font-size: 14px; color: #fff;  line-height: 40px; display: inline-block; margin: 0 10px; }
#Footer .bottom .right { opacity: 0.1; }
#Footer .bottom .right a:hover { opacity: 1; color: #fff; }

/**** Footer--style--end   ****/

/*�Ҳ๫���ͷ������ʽbegin*/
#fixedTop { position: fixed; right: 5%; bottom: 6%; width: 46px; height: 46px; z-index: 999; cursor: pointer; opacity: 0; filter: alpha(opacity=0); transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; transform: translateY(300%); -moz-transform: translateY(300%); -webkit-transform: translateY(300%); }
#fixedTop.show { opacity: 1; filter: alpha(opacity=1); transform: translateY(0); -moz-transform: translateY(0); -webkit-transform: translateY(0); }
/*�Ҳ๫���ͷ������ʽend*/

.owl-theme { position: relative;}
.owl-theme .owl-controls .owl-nav [class*=owl-] { position: absolute; top: 50%; width: 50px; height: 50px; margin-top: -25px; border-radius: 50%; transition: all 0.3s linear; opacity: 0; filter: alpha(opacity=0); }
.owl-theme .owl-controls .owl-nav .owl-prev { left: -100px; background: #ddd url('/assets/images/arrow-left.png') no-repeat center center; background-size: 50px; }
.owl-theme .owl-controls .owl-nav .owl-next { right: -100px; background: #ddd url('/assets/images/arrow-right.png') no-repeat center center; background-size: 50px;}
.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{ background-color: #e7bc01;}
.other-owl.owl-theme .owl-controls .owl-nav .owl-prev { left: -60px; opacity: 1;}
.other-owl.owl-theme .owl-controls .owl-nav .owl-next { right: -60px; opacity: 1;}

.case-Item{ margin: 16px;}
.case-Item .pic{ border-radius: 5px; position: relative; overflow: hidden;}
.case-Item .pic img{ width: 100%; transition: all 0.3s linear;}
.case-Item h3{ font-size: 16px; color: #333; line-height: 30px; margin: 10px 0; text-align: center; font-family: 500; transition: all 0.3s linear;}
.case-Item:hover .pic img{ transform: scale(1.1);}
.case-Item:hover h3{ color: #edb100;}

.service{ padding: 100px 0;}
.service-owl{margin: 30px -10px 0; }
.service .service-Item { margin: 0 10px; position: relative;}
.service .service-Item .pic{ position: relative; }
.service .service-Item .pic img{ width: 100%; }
.service .service-Item .pic::before{ display: block; content: ""; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3);}
.service .service-Item .intro{ padding: 180px 40px 70px; text-align: center; position: absolute; z-index: 3; top: 0; left: 0; width: 100%; height: 100%;   transition: all 0.3s linear; }
.service .service-Item .intro::before{ display: block; content: ""; z-index: 2; position: absolute; left: 0; top: 229px; width: 100%; height: 150%; background: url(../testimg/servicebg.png) no-repeat bottom center; background-size: 100% 100%; transition: all 0.3s linear;}
.service .service-Item .intro img{ width: 70px; height: 60px; display: block; margin: 0 auto; transition: all 0.3s linear;}
.service .service-Item .intro h3{ font-size: 24px; color: #fff; line-height: 40px; font-weight: 500; margin-top: 120px; transition: all 0.3s linear;}
.service .service-Item .intro .top{ position: relative; z-index: 5;}
.service .service-Item .intro .bot{ position: absolute; left: 0; bottom: -100%; width: 100%; text-align: center;  z-index:5; transition: all 0.3s linear;}
.service .service-Item .intro .bot span{ display: block; font-size: 16px; color: #fff; line-height: 40px; }
.service .service-Item .intro .bot .service-btn{ width: 150px; margin: 20px auto 0; padding-left: 20px; line-height: 50px; background: #edb100 url(../testimg/icon-zxfw.png) no-repeat left 20px center; text-align: center; border-radius: 25px;}
.service .service-Item:hover .intro::before{ top: -50%; }
.service .service-Item:hover .intro{  padding-top: 90px; }
.service .service-Item:hover .intro h3{ margin-top: 20px;}
.service .service-Item:hover .intro .bot{  bottom: 70px;}


@media (min-width: 1200px) {

    #Header .nav > ul { display: flex; display: -webkit-box; width: 100%; }
}

@media (min-width: 1024px) {
    #Header .logo{width: 23%;}
    #Header .nav{ width: 75%;}
   
}

@media (max-width: 1360px) {
    .container { width: 1000px; }
    #Header .nav .nav-li { margin: 0 5px; }
    #Header .nav .tool-li{ margin-left: 0; padding-left: 20px;}

}



@media (max-width: 1025px) {
    body { padding-top: 61px; }
    .container { padding: 0 15px; width: 100%; }
    .menu-bar { display: block; }
    #Header { height: 60px; }
    #Header .logo { padding: 0; }  
    #Header .nav { background: #fff; display: none; position: fixed; background: #fff; left: 0; top: 60px; width: 100%; }
    #Header .nav > ul { padding-bottom: 100px; }
    #Header .nav .nav-li { float: none; width: 100%; position: relative; margin: 0; }
    #Header .nav .nav-li > a { padding: 0 10px; line-height: 50px; text-align: left; }
  
    .footer .main .left,.footer .main .right{ width: 100%; position: relative;}
    #Footer .mfyy-btn{ position: absolute; right: 0; bottom: 0;}
    .f-nav dl{ width: 100%; padding-left: 0; }
    .f-nav dl dt{ background: url(../images/icon_hide.png) no-repeat right center; background-size: 18px;}
    .f-nav dl.cur dt{ background-image: url(../images/icon_show.png);}
    .f-nav dl dd{ padding-left: 20px; display: none;}

    #Footer .bottom .left,#Footer .bottom .right{ width: 100%; text-align: center;}
    #Footer .bottom .left p{ opacity: 0.2; line-height: 1.2;}
    #Footer .bottom {  line-height: 20px;}
    #Footer .bottom a{ line-height: 20px;}

    .case-owl{ margin: 0;}
    .service-owl{ margin: 20px 0 0;}    
    .case-Item{ margin: 5px;}
	.other-owl.owl-theme .owl-controls .owl-nav .owl-prev { left: 0; opacity: 0;}
	.other-owl.owl-theme .owl-controls .owl-nav .owl-next { right: 0; opacity: 0;}
	



}

@media (max-width: 768px) {
    html, body { font-size: 14px; }
   
}

@media (max-width: 640px) {
    .container { padding: 0 15px; }
   
}

@media (max-width: 480px) {
  
}


@media (max-width: 420px) {
    html, body { font-size: 12px; }
   
}

@media (max-width: 380px) {
  
}

@media (max-width: 321px) {
  
}