/* GLOBAL STYLES */ html, body { width: 100%; height: 100%; margin: 0; padding: 0; font-family: "Microsoft Yahei", arial, 瀹嬩綋; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100% !important; text-size-adjust: 100% !important; -moz-text-size-adjust: 100% !important; } html, body, div, span, h1, h2, h3, h4, h5, h6, em, img, strong, sub, sup, tt, dd, dl, dt, form, label, table, caption, tbody, tfoot, thead, tr, th, td, ul, li, p, a, section, a { margin: 0; padding: 0; font-weight: normal; } a { text-decoration: none !important; } input, select, textarea { vertical-align: middle; } img { border: 0; margin: 0; padding: 0; display: block; width: 100%; } ul, li { list-style-type: none; } a { blr: expression(this.onFocus=this.blur()); text-decoration: none; } * { margin: 0; padding: 0; border: 0; } div, a { tap-highlight-color: rgba(0, 0, 0, 0); focus-ring-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-focus-ring-color: rgba(0, 0, 0, 0); -moz-tap-highlight-color: rgba(0, 0, 0, 0); -moz-focus-ring-color: rgba(0, 0, 0, 0); } header{ width:100%; height:80px; position:fixed; left:0; top:0; box-shadow:0 0 10px #ccc; background-color:#fff; z-index: 10; } .header-c{ width:1400px; margin: 0 auto; height:100%; } .logo{ width: 305px; float: left; margin-top: 1.5%; } .nav{ width:52.4%; float:right; overflow:hidden; } .nav li{ float:left; margin-left:4.6%; padding:0 4px; line-height:77px; font-size:18px; border-bottom:3px solid #fff; } .nav li a{ color:#000; } .nav li.active,.nav li:hover{ border-bottom:3px solid #8A0780; } .nav li.active a,.nav li:hover a{ color:#8A0780; } footer { width: 100%; padding: 40px 0; background: #333333; } .footer-c{ width:1400px; margin: 0 auto; } .footer-c::after{ content: ''; clear:both; display:block; } .footer-left{ width:41.6%; float:left; } .footer-left2{ width: 9%; float: left; margin-left: 2%; } .footer-left-title{ width:100%; overflow:hidden; color:#CCCCCC; } .footer-left-title img{ width:26px; display:inline-block; margin-right:11px; vertical-align:middle; } .footer-left-ul{ width:94%; margin-left:6%; } .footer-left-ul li{ position:relative; width:20%; float:left; margin-top:4%; box-sizing:border-box; padding-left:10px; border-left:2px solid #ccc; color:#ccc; } .footer-left-ul li a{ color:#ccc; } .footer-left-ul li:hover{ border-left:2px solid #fff; color:#fff; } .footer-right{ width:43.2%; float:right; margin-top: 3%; } .footer-right-top{ width:100%; } .footer-xx{ display:inline-block; margin-right:30px; font-size:16px; color:#ccc; margin-bottom:3%; } .footer-xx1{ width: 170px; margin-right: 19px; } .footer-xx2{ width: 370px; margin-right: 0; } .footer-xx img{ width:25px; display:inline-block; margin-right:12px; vertical-align:middle; } .footer-line{ width:100%; height:1px; background-color:#4D4D4D; margin-bottom:3%; } .footer-right-bottom{ width: 100%; margin-bottom: 0px; font-size: 14px; margin-top: 40px; text-align: center; color: #ccc; } .footer-bottom{ width:100%; } .footer-left-erweima{ width:80px; position:absolute; left:0; top:150%; display:none; } .footer-left-erweima1{ width:80px; position:absolute; left:0; bottom:150%; display:none; } .footer-left-ul>li:hover{ z-index:10; } .footer-left-ul>li:hover .footer-left-erweima,.footer-left-ul>li:hover .footer-left-erweima1{ display:block; } .footer-left2{ display: flex; align-items: center; } .footer-left2 p{ font-size: 12px; color: #cccccc; writing-mode: vertical-lr; margin-left: 3%; } @media screen and (max-width: 1400px) { .header-c { width: 1200px; } .nav { width: 60.4%; } .footer-c { width: 1200px; } }