/*reset css*/ 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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, menu, nav, output, section, summary, time, mark, audio, video, input { margin: 0; padding: 0; border: 0; font-weight: normal; vertical-align: baseline; -webkit-tap-highlight-color: transparent; -ms-tap-highlight-color: transparent; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } /*reset css end*/ /*flex*/ .flex { display: flex !important; } .flex-inline { display: inline-flex !important; } /*flex-direction*/ .flex-row { flex-direction: row; } .flex-column { flex-direction: column; } .row-reverse { flex-direction: row-reverse; } .column-reverse { flex-direction: column-reverse; } /*flex-wrap*/ .flex-wrap { flex-wrap: wrap; } .flex-nowrap { flex-wrap: nowrap; } /*justify-content*/ .space-around { justify-content: space-around; } .space-between { justify-content: space-between; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .justify-center { justify-content: center; } /*align-items*/ .stretch { align-items: stretch; } .align-start { align-items: flex-start; } .align-end { align-items: flex-end; } .align-middle { align-items: center; } /*同时获得 .justify-center 和 .align-middle 样式*/ .flex-center { justify-content: center; align-items: center; } /*以下辅助类应用于弹性盒子元素*/ /*order*/ .flex-first { order: -1; } .flex-last { order: 1; } /*flex*/ .flex-auto { flex: auto; } .flex-none { flex: none; } /*align-self*/ .selft-stretch { align-self: stretch; } .align-self-start { align-self: flex-start; } .align-self-end { align-self: flex-end; } .align-self-middle { align-self: center; } /*flex end*/ /*custom by zyc*/ html, body, #app { position: relative; width: 100%; height: 100%; overflow: hidden; } body { font-family: "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif; } a { text-decoration: none; } li { list-style: none; } small, .small { font-size: 80%; } .large { font-size: 150%; } strong, .strong { font-weight: bolder; } .thin { font-weight: lighter; } .row { position: relative; width: 100%; } .col-1 { width: 8.33333333%; } .col-2 { width: 16.66666667%; } .col-2-4 { width: 20%; } .col-3 { width: 25%; } .col-4 { width: 33.33333333%; } .col-5 { width: 41.66666667%; } .col-6 { width: 50%; } .col-7 { width: 58.33333333%; } .col-8 { width: 66.66666667%; } .col-9 { width: 75%; } .col-10 { width: 83.33333333%; } .col-11 { width: 91.66666667%; } .col-12 { width: 100%; } .col-1, .col-2, .col-2-4, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 { float: left; } .text-left { text-align: left; } .text-center { text-align: center; } .text-right { text-align: right; } .pull-right { float: right !important; } .pull-left { float: left !important; } .block { display: block !important; } .inline { display: inline !important; } .inline-block { display: inline-block !important; } .clearfix:before, .clearfix:after { display: table; content: " "; } .clearfix:after { clear: both; } .relative { position: relative; } .lh20 { line-height: 20px; } .lh22 { line-height: 22px; } .lh24 { line-height: 24px; } .lh26 { line-height: 26px; } .lh28 { line-height: 28px; } .lh30 { line-height: 30px; } .fs10 { font-size: 10px; } .fs11 { font-size: 11px; } .fs12 { font-size: 12px; } .fs13 { font-size: 13px; } .fs14 { font-size: 14px; } .fs15 { font-size: 15px; } .fs16 { font-size: 16px; } .fs17 { font-size: 17px; } .fs18 { font-size: 18px; } .fs20 { font-size: 19px; } .fs20 { font-size: 20px; } .c333 { color: #333; } .c666 { color: #666; } .c999 { color: #999; } .cccc { color: #ccc; } .cfff { color: #fff; } .bg333 { background-color: #333; } .bg666 { background-color: #666; } .bg999 { background-color: #999; } .bgccc { background-color: #ccc; } .bgddd { background-color: #ddd; } .bgeee { background-color: #eee; } .bgfff { background-color: #fff; } .mg5 { margin: 5px; } .mg10 { margin: 10px; } .mg15 { margin: 15px; } .mg20 { margin: 20px; } .mg-t0 { margin-top: 0; } .mg-r0 { margin-right: 0; } .mg-b0 { margin-bottom: 0; } .mg-l0 { margin-left: 0; } .mg-t5 { margin-top: 5px; } .mg-r5 { margin-right: 5px; } .mg-b5 { margin-bottom: 5px; } .mg-l5 { margin-left: 5px; } .mg-t10 { margin-top: 10px; } .mg-r10 { margin-right: 10px; } .mg-b10 { margin-bottom: 10px; } .mg-l10 { margin-left: 10px; } .mg-t15 { margin-top: 15px; } .mg-r15 { margin-right: 15px; } .mg-b15 { margin-bottom: 15px; } .mg-l15 { margin-left: 15px; } .mg-t20 { margin-top: 20px; } .mg-r20 { margin-right: 20px; } .mg-b20 { margin-bottom: 20px; } .mg-l20 { margin-left: 20px; } .pd5 { padding: 5px; } .pd10 { padding: 10px; } .pd15 { padding: 15px; } .pd20 { padding: 20px; } .pd-t0 { padding-top: 0; } .pd-r0 { padding-right: 0; } .pd-b0 { padding-bottom: 0; } .pd-l0 { padding-left: 0; } .pd-t5 { padding-top: 5px; } .pd-r5 { padding-right: 5px; } .pd-b5 { padding-bottom: 5px; } .pd-l5 { padding-left: 5px; } .pd-t10 { padding-top: 10px; } .pd-r10 { padding-right: 10px; } .pd-b10 { padding-bottom: 10px; } .pd-l10 { padding-left: 10px; } .pd-t15 { padding-top: 15px; } .pd-r15 { padding-right: 15px; } .pd-b15 { padding-bottom: 15px; } .pd-l15 { padding-left: 15px; } .pd-t20 { padding-top: 20px; } .pd-r20 { padding-right: 20px; } .pd-b20 { padding-bottom: 20px; } .pd-l20 { padding-left: 20px; } /*超出部分省略号*/ .txtover { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .txtover-2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .txtover-3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } /*custom by zyc end*/