/* CSS Document */
html, body { height: 100%; }
body { max-width: 1920px; margin: 0 auto; padding: 0; font-family: Arial,'Microsoft YaHei'; background: #f3f3f3; }
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: #000; 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; }
.icon { background-image: url('../testimg/icons.png'); display: inline-block; position: relative; background-repeat: no-repeat; }

/*手机版菜单按钮点击效果样式*/
.menu-bar { position: absolute; display: none; right: 0; top: 50%; margin-top: -14px; -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: #000; }
.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: #000; }
.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: #000; }
/* Header 样式end */
#banner { background: #fff; padding: 2px 2px; }

/**** Header--style--begin ****/
#Header { width: 100%; z-index: 99; padding: 0 30px; }
#Header .logo { padding: 10px 0; }
#Header .logo a { font-size: 20px; font-weight: 600; line-height: 20px; text-transform: uppercase; }
#Header .left { float: left; width: 40%; }
#Header .right { float: right; width: 60%; }
#Header .main { z-index: 99; width: 100%; position: relative; padding-top: 50px; }
#Header .top { position: absolute; right: 0; top: 0; padding: 10px 0; }
#Header .top li { float: right; margin-left: 20px; }
#Header .lang a { font-size: 12px; color: #000; text-transform: uppercase; line-height: 30px; }
#Header .nav {  float: right; }
#Header .nav .nav-li { float: left; text-align: center; position: relative; }
#Header .nav .nav-li > a { display: block; position: relative; margin: 0 10px; }
#Header .nav .nav-li > a abbr { font-size: 16px; color: #1d1d1d; font-weight: 600; line-height: 45px; display: block; }
#Header .nav li:hover > a, #Header .nav li.cur > a { }
#Header .search { float: right; }
#Header .search .icon-search { font-size: 16px; color: #666; line-height: 40px; text-align: center; padding: 20px; cursor: pointer; display: none; }
#Header .search form { display: block; width: 230px; height: 30px; background: #fff; overflow: hidden; border-radius: 5px; box-sizing: border-box; }
#Header .search form input { font-size: 14px; color: #333; line-height: 30px; height: 30px; padding: 0 5px; float: left; }
#Header .search form input[name="KeyWord"] { width: 85%; color: #666; }
#Header .search form input[type="button"] { width: 15%; border-left: none; background: #a9a9a9 url('../images/icon-s.png') no-repeat center center; }


/**** Footer--style--begin ****/
#Footer { padding: 10px 30px; }
#Footer .main a { display: inline-block; font-size: 12px; color: #555454; line-height: 30px; text-transform: uppercase; }
#Footer .main .Print { margin-right: 10px; }
#Footer .main .icon { width: 21px; height: 21px; top: 6px; margin-right: 9px; }
#Footer .main .sociallink { display: none; }
#Footer .Copyright p { text-align: left; font-size: 12px; color: #555454; line-height: 30px; text-transform: uppercase; }

a span.icon-print { background-position: -84px -11px; }
a:hover span.icon-print { background-position: -84px -32px; }
a span.icon-socialmedia { background-position: -189px -11px; }
a:hover span.icon-socialmedia { background-position: -273px -11px; }
a span.icon-top { background-position: -105px -11px; }
a:hover span.icon-top { background-position: -105px -32px; }

/* ICONS */
a span.icon-socialmedia-twitter { background-position: -252px -32px; }
a:hover span.icon-socialmedia-twitter { background-position: -252px -11px; }
a span.icon-socialmedia-google { background-position: -231px -32px; }
a:hover span.icon-socialmedia-google { background-position: -231px -11px; }
a span.icon-socialmedia-fb { background-position: -210px -32px; }
a:hover span.icon-socialmedia-fb { background-position: -210px -11px; }
a span.icon-socialmedia-wb { background-position: -295px -32px; }
a:hover span.icon-socialmedia-wb { background-position: -295px -11px; }
a span.icon-socialmedia-rr { background-position: -316px -32px; }
a:hover span.icon-socialmedia-rr { background-position: -316px -11px; }


@media (max-width: 1200px) {
    .container { width: 100%; padding: 0 10px; margin: 0 auto; }
}

@media (max-width: 1025px) {
    body { padding-top: 60px; }
    .menu-bar { display: block; }
    #Header { position: fixed; left: 0; top: 0; width: 100%; height: 60px; background: #e2e2e2; padding: 0 10px; }
    #Header .left { width: 50%; }
    #Header .right { width: 50%; }
    #Header .main { padding: 0; }
    #Header .logo a { line-height: 40px; }
    #Header .top { position: relative; padding: 15px 0; }
    #Header .search { margin-right: 40px; }
    #Header .main .nav { display: none; position: fixed; background: #fff; left: 0; top: 60px; width: 100%; border-top: 1px solid #e3e3e3; overflow: scroll; height: 100%; }
    #Header .main .nav > ul { overflow: scroll; padding-bottom: 100px; height: 100%; }
    #Header .nav .nav-li { float: none; width: 100%; position: relative; }
    #Header .nav .nav-li > a { border: none; padding: 0 10px; margin: 0; }
    #Header .nav .nav-li > a abbr { text-align: left; border-bottom: 1px solid #f1f1f1; font-size: 16px; color: #000; line-height: 50px; display: block; }
    #Header .nav .nav-li .Down { background: url('../images/icon_hide01.png') no-repeat right 10px center; }
    #Header .nav .nav-li.cur .Down { background: #d90000 url('../images/icon_show01.png') no-repeat right 10px center; }
    #Header .nav .nav-li.cur a abbr { }
    #Header .nav .nav-li .nav-down { display: none; padding-left: 20px; text-align: left; width: auto; position: relative; top: auto; left: auto; }
    #Header .nav .nav-li .nav-down li a { font-size: 14px; color: #333; line-height: 40px; border-bottom: 1px solid #f1f1f1; display: block; }
    #Header .nav .nav-li .nav-down li:hover a { }

    #Footer .f-nav li a { margin: 0 10px; }
}

@media (max-width: 768px) {
    #Header .logo a { font-size: 16px; }
    #Header .top { padding: 10px 0; }
    #Header .top li { margin-left: 10px; }
    #Header .lang a { line-height: 40px; }
    #Header .search { position: relative; }
    #Header .search .icon-search { display: block; background: #ccc url('../images/icon-s.png') no-repeat center center; border-radius: 100%; }
    #Header .search form input { height: 40px; line-height: 40px; border: 1px solid #e1e1e1; border-radius: 2px; }
    #Header .search form { position: fixed; top: 60px; left: 0; width: 100%; padding: 10px; height: 60px; border-radius: 0; display: none; }
}

@media (max-width: 640px) {
    #banner { padding: 10px; }
    #Header .logo a { line-height: 20px; }
}

@media (max-width: 480px) {
    #Footer { padding: 10px 0; }
}


@media (max-width: 420px) {
    #Header .logo a { font-size: 14px; }
    #Header .left { width: 45%; }
    #Header .right { width: 55%; }
}

@media (max-width: 380px) {
    #Header .logo a { font-size: 12px; }
}

@media (max-width: 321px) {
}
