@charset "utf-8";
/* CSS Document */
body{ background:#000; font-family:Verdana, Geneva, sans-serif; font-size:13px; margin:0 auto; -webkit-text-size-adjust:none;}
.clean{ clear:both;}
#wrapper{ background:url(../images/primary/bg.jpg) no-repeat center top; width:100%;}
#container{width:990px;  overflow:hidden;margin:0 auto;}
#container .header{height:127px;*height:141px; padding:9px 14px 0 14px;}
#container .header .logo{ float:left; position:relative;}
#container .header .logo h1{ position:absolute; top:-9999px;}
#container .header .top_nav{ float:right; padding-top:10px;}
#container .header .nav{ padding-top:6px; font-size: 0; }
.top_nav-mobile{ display: none;  margin: 15px auto;  text-align: center; }
.top_nav-mobile a{ color: #fff; display: inline-block; vertical-align: middle; margin-right: 5px; }
.top_nav-mobile a:hover{ color: #dcdcdc;}

.red{ color:#F00;}

/*footer*/
#container .footer{background:url(../images/index/line_bg1.jpg) repeat-x top; color:#7a7979; font-size:11px; line-height:26px; margin-top:7px; width:958px; padding:16px 0px 16px 8px;}
#container .footer .link{ float:right; }
#container .footer .link a{ color:#b8b8b8; text-decoration:none; }
#container .footer .link a:hover{ color:#fff; text-decoration:underline; }
#container .footer a{color:#999; text-decoration:none; }
#container .footer a:hover{ color:#fff; text-decoration:underline; }
.footer-detail{ float: left; }
.footer-copyright{ float:right; }




@media only screen and (max-width: 990px) {
#wrapper{ overflow: hidden; }
#container{ width: 100%; padding: 0 15px; }
#container .footer{ width: 100%; box-sizing: border-box; text-align: center; padding: 15px 10px; }
#container .footer .link{ display: block; float: none; }
.footer-detail{ float: none; }
.footer-copyright{ float: none; }
.cf{ display: block; }
.nav{ display: none; }
#container .header{ padding: 15px; }
#container .header .top_nav{ float: none; text-align: center; }
#container .header .logo{ display: inline-block; float: none; }
}

@media only screen and (max-width: 640px) {

#container .header .logo img{ width: 400px; }
/*#container .header{ height: 100px; }*/

}

@media only screen and (max-width: 400px) {

#container .header .logo img{ width: 320px; }

}



@media only screen and (max-width: 375px) {

#container .header .logo img{ width: 300px; }
.top_nav{ display: none;}
.top_nav-mobile{ display: block; }
}

@media only screen and (max-width: 320px) {

#container .header .logo img{ width: 250px; }
/*#container .header{ height: 90px; }*/
}