@charset "utf-8"; /*---------reset-------------------------*/ html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } html, body, div, span, object, iframe, 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, center, dl, dt, dd, ol, ul, li, fieldset, form, input, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -moz-tap-highlight-color: rgba(0, 0, 0, 0); -ms-touch-action: none; -webkit-touch-callout: none; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } body, button, input, select, textarea { font: 12px/1.5 \5FAE\8F6F\96C5\9ED1, tahoma, arial, \5b8b\4f53; } html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 { -webkit-text-size-adjust: none; } input, select, textarea { font-size: 100%; } table { border-collapse: collapse; border-spacing: 0; } th { text-align: inherit; } fieldset, img { border: 0; } iframe { display: block; } abbr, acronym { border: 0; font-variant: normal; } del { text-decoration: line-through; } address, caption, cite, code, dfn, em, th, var, i { font-style: normal; font-weight: 500; } ol, ul { list-style: none; } caption, th { text-align: left; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; } blockquote, q { quotes: none; } blockquote p:before, blockquote p:after, q:before, q:after { content: ''; content: none; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { font-size: 0; vertical-align: top; } a:active, a:hover, input[type="text"], textarea { outline: 0; } a:hover { text-decoration: none; } ins, a { text-decoration: none; } input[type="reset"], input[type="submit"], input[type="file"], input[type="radio"], input[type="checkbox"], select, button { cursor: pointer; } /*---------common-------------------------*/ .clearfix:after { visibility: hidden; display: block; font-size: 0; content: "."; clear: both; height: 0; } .clearfix { zoom: 1; } .fl, .fr { display: inline; } .fl { float: left; } .fr { float: right; } /*----Cross css base ------------------------------*/ .c-hide { display: none; } .c-hidden { overflow: hidden; zoom: 1; } .c-boxs { -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .c-main { margin: 0 auto; } .c-nowrap { max-width: 100%; _width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .c-nowrap-multi { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .c-break { word-break: break-all; } /* color and background -----------------------------------------------------------------------------*/ .c-fff { color: #fff; } .c-222 { color: #222; } .c-333 { color: #333; } .c-555 { color: #555; } .c-666 { color: #666; } .c-999 { color: #999; } .c-f00 { color: #f00; } .c-f60 { color: #f60; } .c-f90 { color: #f90; } .c-37a6ed { color: #37a6ed; } .c-5b5b5b { color: #5b5b5b; } .c-909090 { color: #909090; } .c-ff8100 { color: #ff8100; } .c-007cd9 { color: #007cd9; } .c-4dcd70 { color: #4dcd70; } .bgc-fff { background-color: #fff; } .bgc-f3f3f3 { background-color: #f3f3f3; } .bgc-f9f9f9 { background-color: #f9f9f9; } /* border -----------------------------------------------------------------------------*/ .c-border, .c-border-t, .c-border-b, .c-border-l, .c-border-r, .c-border-tb { border-color: #e1e1e1; border-style: solid; } .c-border { border-width: 1px } .c-border-t { border-top-width: 1px } .c-border-b { border-bottom-width: 1px } .c-border-l { border-left-width: 1px } .c-border-r { border-right-width: 1px } .c-border-tb { border-top-width: 1px; border-bottom-width: 1px } .c-border-d { border-style: dashed } /* button -----------------------------------------------------------------------------*/ .c-btn, .c-btn-full, .c-btn-large, .c-btn-big, .c-btn-small, .c-btn-tiny, .c-btn-screenful, .c-btn-icon, .c-btn-label, .c-btn-label-l, .c-btn-label-r { display: inline-block; zoom: 1; *display: inline; vertical-align: baseline; outline: none; cursor: pointer; border: 0; background: none; text-align: center; text-decoration: none; padding: 12px 34px; color: #fff; position: relative; font: 14px/1 \5FAE\8F6F\96C5\9ED1, tahoma, arial, \5b8b\4f53; line-height: normal !important; } .c-btn:hover, .c-btn:active { text-decoration: none; -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .c-btn-full { width: 100%; height: 100%; vertical-align: middle; } .c-btn-large { padding: 14px 40px; font-size: 18px; } .c-btn-big { padding: 10px 40px; font-size: 16px; } .c-btn-small { padding: 10px 18px; font-size: 12px; } .c-btn-tiny { padding: 6px 10px; font-size: 12px; } .c-btn-disable { cursor: default; background: #ccc; border: 0; color: #fff; } .c-btn-disable:hover, .c-btn-disable:active { background-color: #ccc; top: 0; } .c-btn-screenful, .c-btn-label-l, .c-btn-label-r { width: 100%; height: 100%; display: table; padding: 0; font-size: inherit } .c-btn-screenful .c-btn-span, .c-btn-label-l .c-btn-span, .c-btn-label-r .c-btn-span { display: table-cell; vertical-align: middle; } .c-btn-icon .iconfont, .c-btn-icon .icon { margin-right: 7px; } .c-btn.c-btn-arc, .c-btn-full.c-btn-arc, .c-btn-large.c-btn-arc, .c-btn-big.c-btn-arc, .c-btn-small.c-btn-arc, .c-btn-tiny.c-btn-arc, .c-btn-screenful.c-btn-arc, .c-btn-icon.c-btn-arc, .c-btn-label.c-btn-arc, .c-btn-label-l.c-btn-arc, .c-btn-label-r.c-btn-arc { border-radius: 1000px; } .c-btn.c-btn-radius, .c-btn-full.c-btn-radius, .c-btn-large.c-btn-radius, .c-btn-big.c-btn-radius, .c-btn-small.c-btn-radius, .c-btn-tiny.c-btn-radius, .c-btn-screenful.c-btn-radius, .c-btn-icon.c-btn-radius, .c-btn-label.c-btn-radius, .c-btn-label-l.c-btn-radius, .c-btn-label-r.c-btn-radius { border-radius: 6px; } .c-btn.c-btn-rounded, .c-btn-full.c-btn-rounded, .c-btn-large.c-btn-rounded, .c-btn-big.c-btn-rounded, .c-btn-small.c-btn-rounded, .c-btn-tiny.c-btn-rounded, .c-btn-screenful.c-btn-rounded, .c-btn-icon.c-btn-rounded, .c-btn-label.c-btn-rounded, .c-btn-label-l.c-btn-rounded, .c-btn-label-r.c-btn-rounded { border-radius: 2px; } .c-btn-label { position: relative } .c-btn-label-l i.iconfont, .c-btn-label-r i.iconfont, .c-btn-label-l i.icon, .c-btn-label-r i.icon { padding: 0 6px; display: inline-block; position: absolute; top: 0; height: 100%; line-height: 200%; background: rgba(0, 0, 0, .04) } .c-btn-label-l i.iconfont, .c-btn-label-l i.icon { left: 0; } .c-btn-label-r i.iconfont, .c-btn-label-r i.icon { right: 0; } .c-btn-label:hover i.iconfont, .c-btn-label-l:hover i.iconfont, .c-btn-label-r:hover i.iconfont { background: rgba(0, 0, 0, .1) } @media (max-width: 767px) { .c-btn, .c-btn-full, .c-btn-large, .c-btn-big, .c-btn-small, .c-btn-tiny, .c-btn-screenful, .c-btn-icon, .c-btn-label, .c-btn-label-l, .c-btn-label-r { -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } } /* position -----------------------------------------------------------------------------*/ .c-position-a { position: absolute; } .c-position-r { position: relative; *zoom: 1; } .c-position-f { position: fixed; } /* images and radius -----------------------------------------------------------------------------*/ .c-images-rounded, .border-radius-rounded { border-radius: 5px; } .c-images-cycle, .border-radius-circle { border-radius: 50%; } .border-radius-pill { border-radius: 1000px; } .c-images-thumbnail { padding: 5px; } .c-images-block { display: block; width: 100%; height: 100%; } /* spacing -----------------------------------------------------------------------------*/ .mt5 { margin-top: 5px; } .mt10 { margin-top: 10px; } .mt15 { margin-top: 15px; } .mt20 { margin-top: 20px; } .mt30 { margin-top: 30px; } .mt50 { margin-top: 50px; } .mt100 { margin-top: 100px; } .mb5 { margin-bottom: 5px; } .mb10 { margin-bottom: 10px; } .mb15 { margin-bottom: 15px; } .mb20 { margin-bottom: 20px; } .mb30 { margin-bottom: 30px; } .mb50 { margin-bottom: 50px; } .mb100 { margin-bottom: 100px; } .ml5 { margin-left: 5px; } .ml10 { margin-left: 10px; } .ml15 { margin-left: 15px; } .ml20 { margin-left: 20px; } .ml30 { margin-left: 30px; } .ml50 { margin-left: 50px; } .ml100 { margin-left: 100px; } .mr5 { margin-right: 5px; } .mr10 { margin-right: 10px; } .mr15 { margin-right: 15px; } .mr20 { margin-right: 20px; } .mr30 { margin-right: 30px; } .mr50 { margin-right: 50px; } .mr100 { margin-right: 100px; } .mlr5 { margin-left: 5px; margin-right: 5px; } .mlr10 { margin-left: 10px; margin-right: 10px; } .mlr15 { margin-left: 15px; margin-right: 15px; } .mlr20 { margin-left: 20px; margin-right: 20px; } .mlr30 { margin-left: 30px; margin-right: 30px; } .mlr50 { margin-left: 50px; margin-right: 50px; } .mlr100 { margin-left: 100px; margin-right: 100px; } .mtb5 { margin-top: 5px; margin-bottom: 5px; } .mtb10 { margin-top: 10px; margin-bottom: 10px; } .mtb15 { margin-top: 15px; margin-bottom: 15px; } .mtb20 { margin-top: 20px; margin-bottom: 20px; } .mtb30 { margin-top: 30px; margin-bottom: 30px; } .mtb50 { margin-top: 50px; margin-bottom: 50px; } .mtb100 { margin-top: 100px; margin-bottom: 100px; } .pt5 { padding-top: 5px; } .pt10 { padding-top: 10px; } .pt15 { padding-top: 15px; } .pt20 { padding-top: 20px; } .pt30 { padding-top: 30px; } .pt50 { padding-top: 50px; } .pt100 { padding-top: 100px; } .pb5 { padding-bottom: 5px; } .pb10 { padding-bottom: 10px; } .pb15 { padding-bottom: 15px; } .pb20 { padding-bottom: 20px; } .pb30 { padding-bottom: 30px; } .pb50 { padding-bottom: 50px; } .pb100 { padding-bottom: 100px; } .pl5 { padding-left: 5px; } .pl10 { padding-left: 10px; } .pl15 { padding-left: 15px; } .pl20 { padding-left: 20px; } .pl30 { padding-left: 30px; } .pl50 { padding-left: 50px; } .pl100 { padding-left: 100px; } .pr5 { padding-right: 5px; } .pr10 { padding-right: 10px; } .pr15 { padding-right: 15px; } .pr20 { padding-right: 20px; } .pr30 { padding-right: 30px; } .pr50 { padding-right: 50px; } .pr100 { padding-right: 100px; } .ptb5 { padding-top: 5px; padding-bottom: 5px; } .ptb10 { padding-top: 10px; padding-bottom: 10px; } .ptb15 { padding-top: 15px; padding-bottom: 15px; } .ptb20 { padding-top: 20px; padding-bottom: 20px; } .ptb30 { padding-top: 30px; padding-bottom: 30px; } .ptb50 { padding-top: 50px; padding-bottom: 50px; } .ptb100 { padding-top: 100px; padding-bottom: 100px; } .plr5 { padding-left: 5px; padding-right: 5px; } .plr10 { padding-left: 10px; padding-right: 10px; } .plr15 { padding-left: 15px; padding-right: 15px; } .plr20 { padding-left: 20px; padding-right: 20px; } .plr30 { padding-left: 30px; padding-right: 30px; } .plr50 { padding-left: 50px; padding-right: 50px; } .plr100 { padding-left: 100px; padding-right: 100px; } /* lists -----------------------------------------------------------------------------*/ .c-list-disc { list-style-type: disc; } .c-list-circle { list-style-type: circle; } .c-list-square { list-style-type: square; } .c-list-decimal { list-style-type: decimal; } .c-list-alpha { list-style-type: lower-alpha; } .c-list-roman { list-style-type: lower-roman; } .c-list-inline { padding-left: 0; margin-left: -5px; list-style: none; } .c-list-inline li { display: inline-block; padding-right: 5px; padding-left: 5px; } /* font -----------------------------------------------------------------------------*/ .c-simsun { font-family: \5b8b\4f53; } .c-bold { font-weight: bold; } .c-f12 { font-size: 12px; } .c-f13 { font-size: 13px; } .c-f14 { font-size: 14px; } .c-f15 { font-size: 15px; } .c-f16 { font-size: 16px; } .c-f17 { font-size: 17px; } .c-f18 { font-size: 18px; } .c-f20 { font-size: 20px; } .c-f22 { font-size: 22px; } .c-f24 { font-size: 24px; } .c-f28 { font-size: 28px; } .c-t-left { text-align: left; } .c-t-center { text-align: center; } .c-t-right { text-align: right; } .c-line-h1 { line-height: 1.8; } .c-line-h2 { line-height: 2.2; } /* Grid -----------------------------------------------------------------------------*/ .c-container:after, .c-row:after { content: ""; display: table; clear: both; } .c-container:after, .c-row:after { content: ""; display: table; clear: both; } .c-container { padding-top: 1px; margin-top: -1px; } .c-row { zoom: 1 } .width-100, .c-100 { width: 100%; } .width-90, .c-90 { width: 90%; } .width-80, .c-80 { width: 80%; } .width-75, .c-75 { width: 75%; } .width-70, .c-70 { width: 70%; } .width-66, .c-66 { width: 66.6%; } .width-65, .c-65 { width: 65%; } .width-60, .c-60 { width: 60%; } .width-50, .c-50 { width: 50%; } .width-40, .c-40 { width: 40%; } .width-35, .c-35 { width: 35%; } .width-33, .c-33 { width: 33.3%; } .width-30, .c-30 { width: 30%; } .width-25, .c-25 { width: 25%; } .width-20, .c-20 { width: 20%; } .width-10, .c-10 { width: 10%; } .c-row .c-90, .c-row .c-80, .c-row .c-75, .c-row .c-70, .c-row .c-66, .c-row .c-65, .c-row .c-60, .c-row .c-50, .c-row .c-40, .c-row .c-35, .c-row .c-33, .c-row .c-30, .c-row .c-25, .c-row .c-20, .c-row .c-10 { float: left; margin-left: 3%; } .c-row .c-90:first-child, .c-row .c-80:first-child, .c-row .c-75:first-child, .c-row .c-70:first-child, .c-row .c-66:first-child, .c-row .c-65:first-child, .c-row .c-60:first-child, .c-row .c-50:first-child, .c-row .c-40:first-child, .c-row .c-35:first-child, .c-row .c-33:first-child, .c-row .c-30:first-child, .c-row .c-25:first-child, .c-row .c-20:first-child, .c-row .c-10:first-child { margin-left: 0; } .c-row .c-90 { width: 89.7%; } .c-row .c-80 { width: 79.4%; } .c-row .c-75 { width: 74.25%; } .c-row .c-70 { width: 69.1%; } .c-row .c-66 { width: 65.66666666666666%; } .c-row .c-65 { width: 65.66666666666666%; } .c-row .c-60 { width: 58.800000000000004%; } .c-row .c-50 { width: 48.5%; } .c-row .c-40 { width: 38.2%; } .c-row .c-35 { width: 31.333333333333332%; } .c-row .c-33 { width: 31.333333333333332%; } .c-row .c-30 { width: 27.9%; } .c-row .c-25 { width: 22.75%; } .c-row .c-20 { width: 17.6%; } .c-row .c-10 { width: 7.3%; } .c-push-90, .c-push-80, .c-push-75, .c-push-70, .c-push-66, .c-push-65, .c-push-60, .c-push-50, .c-push-40, .c-push-35, .c-push-33, .c-push-30, .c-push-25, .c-push-20, .c-push-10 { position: relative; } .c-push-90 { left: 92.7%; } .c-push-80 { left: 82.4%; } .c-push-75 { left: 77.25%; } .c-push-70 { left: 72.1%; } .c-push-66 { left: 68.66666666666666%; } .c-push-65 { left: 68.66666666666666%; } .c-push-60 { left: 61.800000000000004%; } .c-push-50 { left: 51.5%; } .c-push-40 { left: 41.2%; } .c-push-35 { left: 34.33333333333333%; } .c-push-33 { left: 34.33333333333333%; } .c-push-30 { left: 30.9%; } .c-push-25 { left: 25.75%; } .c-push-20 { left: 20.6%; } .c-push-10 { left: 10.3%; } .c-row .c-push-right { float: right; } .c-row .c-role-right { margin-left: 3%; float: right; } .c-row .c-role-left { margin-left: 0; } .c-centered { float: none !important; margin: 0 auto !important; } .c-padding { padding: 20px; } .c-padding .c-100, .c-padding .c-90, .c-padding .c-80, .c-padding .c-75, .c-padding .c-70, .c-padding .c-66, .c-padding .c-65, .c-padding .c-60, .c-padding .c-50, .c-padding .c-40, .c-padding .c-35, .c-padding .c-33, .c-padding .c-30, .c-padding .c-25, .c-padding .c-20, .c-padding .c-10 { padding: 20px; } .c-split .c-90, .c-split .c-80, .c-split .c-75, .c-split .c-70, .c-split .c-66, .c-split .c-65, .c-split .c-60, .c-split .c-50, .c-split .c-40, .c-split .c-35, .c-split .c-33, .c-split .c-30, .c-split .c-25, .c-split .c-20, .c-split .c-10 { margin-left: 0; } .c-split .c-90 { width: 90%; } .c-split .c-80 { width: 80%; } .c-split .c-75 { width: 75%; } .c-split .c-70 { width: 70%; } .c-split .c-66 { width: 66.6%; } .c-split .c-65 { width: 65%; } .c-split .c-60 { width: 60%; } .c-split .c-50 { width: 50%; } .c-split .c-40 { width: 40%; } .c-split .c-35 { width: 35%; } .c-split .c-33 { width: 33.3%; } .c-split .c-30 { width: 30%; } .c-split .c-25 { width: 25%; } .c-split .c-20 { width: 20%; } .c-split .c-10 { width: 10%; } /* c-blocks -----------------------------------------------------------------------------*/ .c-blocks-2, .c-blocks-3, .c-blocks-4, .c-blocks-5, .c-blocks-6 { padding-left: 0; list-style: none; } .c-blocks-2:after, .c-blocks-3:after, .c-blocks-4:after, .c-blocks-5:after, .c-blocks-6:after { content: ""; display: table; clear: both; } .c-blocks-2 li, .c-blocks-3 li, .c-blocks-4 li, .c-blocks-5 li, .c-blocks-6 li, .c-blocks-2 div, .c-blocks-3 div, .c-blocks-4 div, .c-blocks-5 div, .c-blocks-6 div { height: auto; float: left; } .c-blocks-2 li, .c-blocks-2 div { width: 50%; } .c-blocks-3 li, .c-blocks-3 div { width: 33.333333333333332%; } .c-blocks-4 li, .c-blocks-4 div { width: 25%; } .c-blocks-5 li, .c-blocks-5 div { width: 20%; } .c-blocks-6 li, .c-blocks-6 div { width: 16.666666666666666%; } .c-blocks-2 li li, .c-blocks-3 li li, .c-blocks-4 li li, .c-blocks-5 li li, .c-blocks-6 li li, .c-blocks-2 div div, .c-blocks-3 div div, .c-blocks-4 div div, .c-blocks-5 div div, .c-blocks-6 div div { float: none; margin: 0; } /* tools -----------------------------------------------------------------------------*/ .visible-xs, .visible-sm, .visible-md, .visible-lg { display: none !important; } .visible-xs-block, .visible-xs-inline, .visible-xs-inline-block, .visible-sm-block, .visible-sm-inline, .visible-sm-inline-block, .visible-md-block, .visible-md-inline, .visible-md-inline-block, .visible-lg-block, .visible-lg-inline, .visible-lg-inline-block { display: none !important; } @media (max-width: 767px) { .visible-xs { display: block !important; } table.visible-xs { display: table; } tr.visible-xs { display: table-row !important; } th.visible-xs, td.visible-xs { display: table-cell !important; } .visible-xs-block { display: block !important; } .visible-xs-inline { display: inline !important; } .visible-xs-inline-block { display: inline-block !important; } .hidden-xs { display: none !important; } } @media (min-width: 768px) and (max-width: 991px) { .visible-sm { display: block !important; } table.visible-sm { display: table; } tr.visible-sm { display: table-row !important; } th.visible-sm, td.visible-sm { display: table-cell !important; } .visible-sm-block { display: block !important; } .visible-sm-inline { display: inline !important; } .visible-sm-inline-block { display: inline-block !important; } .hidden-sm { display: none !important; } } @media (min-width: 992px) and (max-width: 1199px) { .visible-md { display: block !important; } table.visible-md { display: table; } tr.visible-md { display: table-row !important; } th.visible-md, td.visible-md { display: table-cell !important; } .visible-md-block { display: block !important; } .visible-md-inline { display: inline !important; } .visible-md-inline-block { display: inline-block !important; } .hidden-md { display: none !important; } } @media (min-width: 1200px) { .visible-lg { display: block !important; } table.visible-lg { display: table; } tr.visible-lg { display: table-row !important; } th.visible-lg, td.visible-lg { display: table-cell !important; } .visible-lg-block { display: block !important; } .visible-lg-inline { display: inline !important; } .visible-lg-inline-block { display: inline-block !important; } .hidden-lg { display: none !important; } }