@charset "utf-8"; /*================================================= Reset ============================================================*/ html { color: #777; background-color: #f1f1f1; } body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, form, input, textarea, th, td { margin: 0; padding: 0; box-sizing: border-box; } ol, ul { list-style: none; } a { text-decoration: none; outline: none; } button, a:active, a:hover, a:focus, input { outline: none; } input:required:invalid, input:focus:invalid { box-shadow: none; } .clear { clear: both; } /* HTML5 标签支持 */ header, section, footer, aside, nav, article, figure { display: block; } /* 依次为 macOS Windows Linux 字体回退 */ h1, h2, a, p, span, div { font-weight: normal; font-family: "Helvetica Neue", "Hiragino Sans GB", "微软雅黑", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; } /*=============================================== END Reset ==========================================================*/ /*=================================================== 导航 ============================================================*/ .u_nav-wrapper { position: fixed; top: 0; width: 100%; background-color: white; border-bottom: 1px #ccc solid; z-index: 10; } .u_nav { max-width: 1400px; margin: auto; } .u_nav-left { margin: 18px; font-size: 16px; } .u_nav-right { margin: 18px; font-size: 14px; } .u_nav-left, .u_nav-input { float: left; } .u_nav-right { position: relative; top: 3px; float: right; } .u_nav-right > a { margin-right: 20px; } .u_nav-link { color: #777; } .u_nav-input, .u_nav-btn { float: left; position: relative; height: 38px; top: 10px; padding: 5px; font-size: 16px; color: #777; border: 1px lightgray solid; } .u_nav-input { display: block; width: 200px; border-right: 0; border-radius: 3px 0 0 3px; } /* PC 端搜索框组 */ .u_nav-btn { font-size: 14px; display: block; width: 80px; text-align: center; cursor: pointer; line-height: 24px; vertical-align: middle; border-radius: 0 3px 3px 0; } .u_nav-ul { position: relative; top: 7px; left: -6px; width: 80px; display: block; background-color: white; z-index: 5; } .u_nav-li { font-size: 14px; display: block; height: 35px; line-height: 30px; vertical-align: middle; } .u_nav-btn > ul { border: 0; } .u_nav-btn > ul > li { display: none; } .u_nav-btn:hover { border-bottom: 0; } .u_nav-btn:hover > ul { border: 1px lightgray solid; border-top: 0; border-radius: 0 0 3px 3px; } .u_nav-btn:hover > ul > li { display: block; } /* 移动端搜索框组 */ .um_nav-input-group { display: none; } @media (max-width: 1000px) { .u_nav-right,.u_nav-input-group { display: none; } .um_nav-input-group { display: block; } .um_nav-input, .um_nav-btn { display: block; height: 30px; margin-bottom: 10px; float: left; color: #777; padding: 5px; border: 1px lightgray solid; } .um_nav-input { margin-left: 15px; width: 130px; font-size: 12px; border-radius: 3px 0 0 3px; } .um_nav-btn { font-size: 12px; width: 50px; text-align: center; cursor: pointer; line-height: 20px; vertical-align: middle; border-left: 0; border-radius: 0; } .um_nav-btn:last-child { border-radius: 0 3px 3px 0; } } /*================================================= END 导航 ==========================================================*/ /*=================================================== main ===========================================================*/ .u_main-wrapper { max-width: 1200px; margin: 60px auto auto auto; } .main { margin: 10px; } .main-col { float: left; width: 33%; } .main-block { margin: 10px 5px 5px 5px; padding: 10px; background-color: white; } .block-title { display: block; margin: 5px auto 10px 15px; font-size: 18px; color: #337ab7; } .block-grid { float: left; width: 33%; text-align: center; height: 120px; } .block-grid > a { color: #777; } /* 矢量图标 */ .icon { position: relative; top: 10px; display: inline-block; width: 50px; height: 50px; stroke-width: 0; stroke: currentColor; fill: currentColor; } .footer { margin: 20px; font-size: 14px; color: #777; } .footer > a { color: #337ab7; } @media (max-width: 1000px) { .u_main-wrapper { margin: 100px auto auto auto; } .main-col { width: 100%; } } /*================================================= END main =========================================================*/