
a { background: transparent; text-decoration: none; -webkit-tap-highlight-color: transparent; color: #333; }
a:focus, a:hover { color: #066fc0; text-decoration: none; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }



/*Bootstrap--style--begin*/
.container {max-width: 1500px; margin: 0 auto; }

/*Bootstrap--style--end*/
.menu-bar { position: absolute; display: none; right: 20px; top: 50%; margin-top: -12px; z-index: 999; }
.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: #016cbd; }
.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: #016cbd; }

.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: #016cbd; }


#Header { position: fixed; left: 0; top: 0; width: 100%; z-index: 9999; -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
    -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
    -ms-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
    -o-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);
    box-shadow: 3px 3px 3px rgba(0,0,0,0.12)}

#Header .logo {float: left;  height: 74px; line-height: 74px;padding-left: 5px;}

#Header .main {background: #fff;  height: 74px;}
#Header .main .nav {float: right; width:calc(100% - 300px);}
#Header .main .nav .nav-li { float: left; position: relative; width: 15%; text-align: center; }
#Header .main .nav .nav-li > a { font-size: 16px; color: #000000; line-height: 74px; overflow: hidden; height: 74px; display: block; position: relative; }
#Header .main .nav .nav-li abbr { display: block; background: #016cbd; position: absolute; top: -74px; left: 0; width: 100%; transition: all 0.3s; color: #fff;}
#Header .main .nav .nav-li span { display: block; position: relative; top: 0; left: 0; width: 100%; transition: all 0.3s; }
#Header .main .nav .nav-li .nav-down { position: absolute; left: 0; top: 74px; width: 100%; background:#fff; display: none; z-index: 9999; }
#Header .main .nav .nav-li a.selected span{border-bottom: 4px solid #016cbd; height: 74px;}
#Header .main .nav .nav-li .nav-down a { font-size: 14px; color: #333; line-height: 24px; text-align: center; display: block; transition: all 0.3s; padding:10px 0; }
#Header .main .nav .nav-li:hover abbr { top: 0; }
#Header .main .nav .nav-li:hover span { top: 74px; }
#Header .main .nav .nav-li .nav-down a:hover { background: #016cbd; color: #fff; }
#Header .main .nav .nav-li.selected abbr { top: 0; }
#Header .main .nav .nav-li.selected span { top: 74px; }

#Header .search-li { float: left; }
#Header .search { position: relative; }
#Header .search .icon-search { font-size: 18px; color: #000; line-height: 74px; padding: 0 20px;cursor: pointer; }
#Header .search .icon-search:hover { color: #016cbd;}
#Header .search form { position: absolute; right: 0; top: 74px; height: 40px; width: 380px;display: none; }
#Header .search form input { float: left; }
#Header .search form input[name="KeyWord"] { width:calc(100% - 70px);font-size: 14px; color: #333; line-height: 40px; height: 40px; border: 1px solid #ccc; padding: 0 10px;  }
#Header .search form input[type="submit"] { width: 48px; height: 40px; background: url('404.png') no-repeat center center; }

#Header .lang-li { float: left; line-height: 74px; }
#Header .menu-lang { position: relative; }

.menu-lang { float: left; }
.menu-lang .fa-globe { color: #000; margin-right: 5px;font-size: 16px;}
@media only screen and (max-width: 640px) {
    #Header .main {background: #fff;  height: 60px; overflow: hidden;}
    #Header .logo {float: left;  height: 60px; line-height: 60px;padding-left:5px;}
    #Header .logo img{width:108px; height: 40px;}
}
/* ==================================
   menu
   ================================== */
.menu { position: relative; }
/* menu-hd */
.menu-hd { position: relative; z-index: 1002; overflow: hidden; height: 74px; line-height: 74px; padding: 0 20px 0 6px; font-size: 13px;}
.menu-hd:hover{color: #016cbd;}
.menu-hd:hover .fa-globe { color: #016cbd;}
/* menu-bd */
.menu-bd { display: none; position: absolute; z-index: 1001; }
.menu-bd-panel {background: #fff; min-width: 115px; text-align: center; }
.menu-bd-panel a { display: block; padding: 0 5px; line-height: 40px; white-space: nowrap; color: #6C6C6C }
/* menu arrow */
.menu-hd .fa-angle-down {position: absolute; height: 74px; line-height: 74px; top: 0; right: 0px; font-size: 16px;}
/* menu hover */

.menu-bd-panel a:hover { background: #016cbd; color: #fff;}

@media only screen and (max-width: 980px) {
    .menu-bar { display: block; }
    #Header .main .nav { position: fixed; left: 0; width: 100%; height: 100%; top: 60px; background: #fff; padding: 0 10px; display: none; }
    #Header .main .nav > ul { height: 100%; width: 100%; position: relative; padding-bottom: 100px; overflow: scroll; }
    #Header .main .nav .nav-li { float: none; width: 100%; }
    #Header .main .nav .nav-li > a { border-bottom: 1px solid #f0f0f0; text-align: left; }
    #Header .main .nav .nav-li abbr { padding: 0 10px; background: url('404.png') no-repeat right 10px center #016cbd; }
    #Header .main .nav .nav-li span { padding: 0 10px; background: url('404.png') no-repeat right 10px center; color: #333; }
    #Header .main .nav .nav-li .nav-down { position: relative; left: 0; top: 0; padding: 0 20px; }
    #Header .main .nav .nav-li .nav-down a { border-bottom: 1px solid #f1f1f1; text-align: left; padding:10px; }
    #Header .main .nav .nav-li:first-child abbr { background: #016cbd; }
    #Header .main .nav .nav-li:first-child span { background: none; }
    #Header .search-li { width: 100%; }
    #Header .search .icon-search { display: none; }
    #Header .search form { position: relative; left: 0; top: 0; width: 100%; display: block; }
    #Header .menu-hd{display: none;}
    .menu-lang { display: block;margin-top: 0; }
    .menu-bd{display: block;}
    .menu-bd { position: relative; z-index: 1001; margin-top: 0; }
.menu-bd-panel { padding: 5px 0; border:none;width: 200px; margin-left: 5px;}
.menu-bd-panel a { display: block; float: left; padding: 0 5px; line-height: 28px; white-space: nowrap; color: #6C6C6C }
}




