html, body, div, span, applet, object, iframe, h1, h2, h3,
h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address,
big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot,
thead, tr, th, td, input, select {margin:0; padding:0; border:0 none; outline:0; color:inherit;}
html, body {width:100%; height:100%;}
body {margin:0 auto; font:12px/1 "Microsoft Yahei", "微软雅黑", sans-serif; vertical-align:baseline; overflow-y:scroll;}
h1 {font-weight:bold; font-size:18px; line-height:18px; color:#474545;}
h3 {font-weight:normal; font-size:12px; color:#746969;}
h2, h4, h5, h6 {font-weight:normal; font-size:100%;}
table {border-collapse:separate; border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
a {text-decoration:none;}
p {line-height:22px; text-align:justify;}
a img, iframe {border:none;}
a:link {color:inherit;}
:focus {outline:0;}
/*img{ vertical-align:top;}*/
ol, ul {list-style:none;}
input, textarea, select, button {font-weight:inherit; font-size:inherit; *font-size:100%; font-family:inherit;}
/* == clearfix == */
.clearfix:after {display:block; height:0; clear:both; content:"\200B";}
.clearfix {*zoom:1;}/*IE/7/6*/
/* == 以上 reset Css == */
/**************** 全局公用样式 ****************/
body {_overflow:hidden;max-width: 1200px;min-width: 1130px;}
.g-wrap {position:relative; margin:0 auto; width:1200px; height:100%;}
#header {position:relative; z-index:5; height:99px; background-color:#fff;}
#logo {position:absolute; top:26px; left:1px; width:220px; height:57px; background:url(../images/logo.png) no-repeat 0 0;}
#nav {position:absolute; top:0; right:0; z-index:4; height:100%; background-color:#fff; overflow:hidden;}
#nav li {float:left; height:100%; -webkit-transition:background-color 700ms; transition:background-color 700ms;}
#nav .n1 {width:58px;}
#nav .n2, #nav .n3, #nav .n5, #nav .n6, #nav .n7, #nav .n8 {width:83px;}
#nav .n4 {width:96px;}
#nav li a {position:relative; z-index:2; display:block; width:100%; height:100%; font-weight:bold; font-size:13px; line-height:99px; 
           text-align:center; color:#666; -webkit-transition:color 200ms; transition:color 200ms;}
#nav li a.on {color:#fff;}
#nav li a span {position:absolute; left:0; top:0; z-index:2; width:100%; height:100%;}
#nav li a .bkg {top:100%; z-index:1; background-color:#bf393e; -webkit-transition:top 200ms; transition:top 200ms;}
#nav li a.on .bkg,
#nav li a:hover .bkg {top:0;}

#shop {position:absolute; bottom:0; right:0; z-index:5; width:78px; height:100%; background:#efefef; border-left:1px solid #e5e5e5;}
#shop:hover{background:#c5c5c5;}
#shop {width:170px;}
#shop .btn-lang {position:absolute;top:0; text-align:center;display:block;width:100%; height:100%; font-weight:bold; font-size:13px; 
 line-height:76px; color:#666369; -webkit-transition:color 300ms; transition:color 300ms;}
 
 
 
#shop .header-nwbtn{ position:absolute;top:0; right:0px; padding:0 10px; padding-right: 15px; width:auto; 
 height:100%; font-weight:bold; font-size:13px; line-height:76px; color:#666369; 
 background: url(../images/head-nw-icon.png) right center no-repeat;
 -webkit-transition:all 300ms; transition:all 300ms;}
#shop .header-nwbtn:hover, #shop .header-nwbtn.on{ color: #ff2424; background: url(../images/head-nw-icon-on.png) right center no-repeat;}
#content {position:relative; overflow:hidden;}
#subNav {position:absolute; top:0; left:0px; z-index:4; width:100%; height:61px;}
#subNav .g-wrap .item {position:absolute; top:-100%;height:100%; background-color:#4c4a4f; -webkit-transition:top 300ms; transition:top 300ms;}
#subNav .g-wrap .about {left:772px;width:530px;padding-left:68px;}
#subNav .g-wrap .news {left:855px;/*width:450px*/;padding-left:67px;}
#subNav .g-wrap .relation {left:938px;width:432px; padding-left:80px}
#subNav .g-wrap .service {left:1034px;width:252px;padding-left:67px;}
#subNav .g-wrap .citizenship {left:710px; padding:0 67px;}
#subNav .g-wrap .search {right:0; width:238px; height:44px; border:8px solid #4c4a4f;}
#subNav .g-wrap .search input { padding:0 20px; width:200px; height:44px; line-height:44px; }
#subNav .g-wrap .langs {right:0; padding:0 15px; width:224px;}
#subNav .g-wrap .nwmenu{ right: 0; top: -409px; width: 254px; height: auto; background-color: #4c4a4f; -webkit-transition: 300ms; transition: 300ms;}
#subNav .g-wrap .nwmenu .nwmenu-inner{ padding: 30px; width: 210px; max-height: 349px; overflow: hidden;}
#subNav .g-wrap .nwmenu .nwmenu-inner .nwi-box{ margin-bottom: 10px;}
#subNav .g-wrap .nwmenu .nwi-tit{ float: left; width: 50px; color: #8f8c92; font-size: 12px;}
#subNav .g-wrap .nwmenu .nwmenu-list{ float: right; margin-top: -5px; width: 140px;} 
#subNav .g-wrap .nwmenu .nwmenu-list li a{ float: none; padding: 0; line-height: 22px; color: #d2ced5; font-size: 12px;font-weight: normal; -webkit-transition: color 300ms; transition: color 300ms;}
#subNav .g-wrap .nwmenu .nwmenu-list li a:hover{ color: #f63b34;}
#subNav .g-wrap .on {top:0; z-index: 2;}
#subNav .g-wrap .item a {float:left; padding:0 16px; font-weight:bold; font-size:13px; 
 line-height:61px; color:#d2ced5;-webkit-transition:color 300ms; transition:color 300ms;}
#subNav .g-wrap .item a:hover {color:#3587b9;}
#subNav .g-wrap .item #on {color: #003b96;}
#footer {height:200px;border-top: 2px solid #c5c5c5;overflow:hidden;}
#reference {height:64px; line-height:64px; border-bottom:1px solid #f2f2f2;}
#copyright{height:136px;}
#reference a {-webkit-transition:color 300ms;transition:color 300ms;}
#reference a:hover {color:#3587b9;}
#reference div * {font-weight:bold; font-size:13px; color:#2e2e57;}
#reference .left {float:left;width:850px;}
#reference .left * {float:left; height:100%; line-height:64px;}
#reference .left a {padding-left:42px; background:no-repeat 0 17px;margin-right:60px;}
#reference .left .a1 {background-image:url(../images/refer_icon_1.png);}
#reference .left .a2 {background-image:url(../images/refer_icon_2.png);}
#reference .left .a3 {background-image:url(../images/refer_icon_life.png);}
#reference .right {float:right; width:327px; text-indent:20px; background:#f2f2f2;border-left:1px solid #e5e5e5}
#copyright .g-wrap .fl {float:left;width:873px; font-weight:bold;color:#4b4b51;margin-top: 60px;}
#copyright .g-wrap .fr {float:left;height:144px; padding-top:20px;padding-left:20px;width:300px; 
font-weight:bold; color:#4b4b51; border-left:1px solid #f2f2f2;position:relative;}
#copyright .g-wrap .fr .wechart{position:absolute;top:15px;right:20px;transition: all .2s;}
#copyright .g-wrap .fr .wechart:hover {transform: scale(1.2);}
#copyright .g-wrap div a {-webkit-transition:color 300ms; transition:color 300ms; color:#4b4b51;}
#copyright .g-wrap div a:hover {color:#3587b9}



#n-nav-wrap{
    position: absolute;
    top: 0;
    right: 0;
    height: 99px;
  }
  #n-nav{
    padding: 0;
    margin: 0;
    list-style: none;
    font-size: 0;
    height: 99px;
  }
  .n-nav-item{
    position: relative;
    display: inline-block;
  }
  #n-nav .n-nav-item.n-active a::before{
    height: 100%;

  }
  #n-nav .n-nav-item.n-active a{
    color: #fff;
  }
  #n-nav a{
    display: block;
    padding: 0 20px;
    line-height: 99px;
    font-weight: bold;
    font-size: 13px;
    color:#666;
    text-decoration: none;
    transition: color 0.2s;
  }
  #n-nav a:hover{
    color:#fff;
  }
  #n-nav a::before{
    content: "";
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #bf393e;
    height: 0;
    z-index: -1;
    transition: height 0.2s;
  }
  #n-nav a:hover::before{
    height: 100%;
  }


  .n-sub-nav{
    width: auto;
    z-index: 9999999;
    height: 0;
    overflow: hidden;
    background-color: #4c4a4f;
    position:fixed;
    transition: height 0.2s;
  }
  .n-sub-nav a{
    display: inline-block;
    padding: 0 20px;
    line-height: 60px;
    font-weight: bold;
    font-size: 13px;
    color:#d2ced5;
    text-decoration: none;
    transition: color 0.2s;
  }
  .n-sub-nav a:hover{
    color: #bf393e;
  }
  .n-sub-nav .n-active{
    color: #bf393e;
  }
  .n-show{
    display:inline-block;
    height: 60px;
  }

  
  .n-clearfix::after,.n-clearfix::before{
    content: "";
    display: table;
  }
  .n-clearfix::after{
    clear: both;
  }