@charset "UTF-8";
.header > .h-main > .menu, .footer > .ft-container, .footer > .ft-container .ft-qr, .modal .modal-info-main .edit-form, .modal .modal-info-main .edf-line, .xc_pages, .get_var_code, .n_download .n_download_main li { *zoom: 1; }
.header > .h-main > .menu:before, .footer > .ft-container:before, .footer > .ft-container .ft-qr:before, .modal .modal-info-main .edit-form:before, .modal .modal-info-main .edf-line:before, .xc_pages:before, .get_var_code:before, .n_download .n_download_main li:before, .header > .h-main > .menu:after, .footer > .ft-container:after, .footer > .ft-container .ft-qr:after, .modal .modal-info-main .edit-form:after, .modal .modal-info-main .edf-line:after, .xc_pages:after, .get_var_code:after, .n_download .n_download_main li:after { content: ""; display: table; }
.header > .h-main > .menu:after, .footer > .ft-container:after, .footer > .ft-container .ft-qr:after, .modal .modal-info-main .edit-form:after, .modal .modal-info-main .edf-line:after, .xc_pages:after, .get_var_code:after, .n_download .n_download_main li:after { clear: both; }

.iconfont, .num-picker > .control > span, .n_heads > .n_main .collection:before, .n_heads > .n_main .telephone:before, .n_heads > .n_main .times:before, .n_download .n_download_main li > span .app_span:before { -moz-user-select: none; /*火狐*/ -webkit-user-select: none; /*webkit浏览器*/ -ms-user-select: none; /*IE10*/ -khtml-user-select: none; /*早期浏览器*/ user-select: none; }

/** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. 0. sassCore's style */
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ overflow-y: scroll; /* 0 */ -webkit-overflow-scrolling: touch; /* 0 */ }

/** 1. Remove default margin 0. sassCore's style. */
body { margin: 0; /* 1 */ font-size: 14px; /* 0 */ line-height: 1.5; /* 0 */ color: #333; /* 0 */ background-color: #fff; /* 0 */ }

/* HTML5 display definitions ========================================================================== */
/** Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }

/** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. 3. Correct `inline-block` display in IE 6/7. */
audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ *display: inline; /* 3 */ *zoom: 1; /* 3 */ }

/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/** Address `[hidden]` styling not present in IE 8/9/10. Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */
[hidden], template { display: none; }

/* Links ========================================================================== */
/** 1. Remove the gray background color from active links in IE 10. 2. Improve readability when focused and also mouse hovered in all browsers. 0. sassCore's style. */
a { background: transparent; /* 1 */ text-decoration: none; /*  !* 0 *! text-decoration:none; @if length($linkColor) > 1{ color:nth($linkColor,1); &:hover{ color:nth($linkColor,2); } } @else { color:$linkColor; &:hover{ color:darken($linkColor,10%); } }*/ }
a:active, a:hover { outline: 0; /* 2 */ }

/* Text-level semantics ========================================================================== */
/** Address styling not present in IE 8/9/10/11, Safari, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }

/** Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */
b, strong { font-weight: bold; }

/** Address styling not present in Safari and Chrome. */
dfn { font-style: italic; }

/** Address styling not present in IE 8/9. */
mark { background: #ff0; color: #000; }

/** Address inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* Embedded content ========================================================================== */
/** 1. Remove border when inside `a` element in IE 8/9/10. 2. Improve image quality when scaled in IE 7. 0. sassCore's style. */
img { border: 0; /* 1 */ vertical-align: middle; /* 0 */ -ms-interpolation-mode: bicubic; /* 2 */ }

/** Correct overflow not hidden in IE 9/10/11. */
svg:not(:root) { overflow: hidden; }

/* Grouping content ========================================================================== */
/** Address differences between Firefox and other browsers. */
hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; }

/** 1. Contain overflow in all browsers. 2. Improve readability of pre-formatted text in all browsers. */
pre { overflow: auto; /* 1 */ white-space: pre; /* 2 */ white-space: pre-wrap; /* 2 */ word-wrap: break-word; /* 2 */ }

/** 1. Address odd `em`-unit font size rendering in all browsers. 2. Correct font family set oddly in IE 6, Safari 4/5, and Chrome. */
code, kbd, pre, samp { font-family: monospace, monospace; /* 1 */ _font-family: 'courier new', monospace; /* 1 */ font-size: 1em; /* 2 */ }

/* Forms ========================================================================== */
/** Known limitation: by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. */
/** 1. Correct color not being inherited. Known issue: affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */
button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ }

/** Address `overflow` set to `hidden` in IE 8/9/10/11. */
button { overflow: visible; }

/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */
button, select { text-transform: none; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. 4. Remove inner spacing in IE 7 without affecting normal text inputs. Known issue: inner spacing remains in IE 6. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; /* 4 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** Remove inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
input { line-height: normal; }

/** It's recommended that you don't attempt to style these elements. Firefox's implementation doesn't respect box-sizing, padding, or width.  1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. 3. Remove excess padding in IE 7. Known issue: excess padding remains in IE 6. */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */ }

/** Fix the cursor style for Chrome's increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari and Chrome (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; }

/** Remove inner padding and search cancel button in Safari and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Define consistent border, margin, and padding. */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 1. Correct `color` not being inherited in IE 8/9/10/11. 2. Remove padding so people aren't caught out if they zero out fieldsets. 3. Correct alignment displayed oddly in IE 6/7. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ *margin-left: -7px; /* 3 */ }

/** 1. Remove default vertical scrollbar in IE 8/9/10/11. 0. sassCore's style */
textarea { overflow: auto; /* 1 */ resize: vertical; /* 0 */ }

/** Don't inherit the `font-weight` (applied by a rule above). NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */
optgroup { font-weight: bold; }

/* Tables ========================================================================== */
/** Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

/** Address CSS quotes not supported in IE 6/7. */
q { quotes: none; }

html, button, input, select, textarea { font-family: "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", "Helvetica Neue", Helvetica, Tahoma, sans-serif; }

h1, h2, h3, h4, h5, h6, p, figure, form, blockquote { margin: 0; }

ul, ol, li, dl, dd { margin: 0; padding: 0; }

ul, ol { list-style: none outside none; }

h1, h2, h3 { line-height: 2; font-weight: normal; }

h1 { font-size: 21px; }

h2 { font-size: 18.2px; }

h3 { font-size: 16.38px; }

h4 { font-size: 14px; }

h5, h6 { font-size: 11.9px; }

input:-moz-placeholder, textarea:-moz-placeholder { color: #ccc; }

input::-moz-placeholder, textarea::-moz-placeholder { color: #ccc; }

input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #ccc; }

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #ccc; }

body { font-family: "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; font-size: 14px; line-height: 1.5; width: 100%; text-align: center; position: relative; overflow: hidden; }

@font-face { font-family: "iconfont"; src: url("../fonts/iconfont.eot");
  /* IE9*/
  src: url("../fonts/iconfont.eot#iefix") format("embedded-opentype"), url("../fonts/iconfont.woff") format("woff"), url("../fonts/iconfont.ttf") format("truetype"), url("../fonts/iconfont.svg#iconfont") format("svg");
  /* iOS 4.1- */ }
a[href*="www.cnzz.com"] { display: none; }

.iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.num-picker > .control > span, .n_heads > .n_main .collection:before, .n_heads > .n_main .telephone:before, .n_heads > .n_main .times:before, .n_download .n_download_main li > span .app_span:before { font-family: "iconfont" !important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

body { font-family: "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; font-size: 14px; line-height: 1.5; min-width: 1200px; position: relative; color: #333; }

a { color: #666; }
a:hover { color: #999; }

/*主样式*/
.header { width: 100%; text-align: center; height: 70px; box-shadow: 0 0 3px #eee; background: #fff; }
.header > .h-main { width: 1200px; margin: auto; position: relative; height: 72px; }
.header > .h-main > .logo { float: left; width: 380px; box-sizing: border-box; height: 70px; text-align: left; padding-left: 80px; line-height: 70px; color: #666; font-size: 24px; font-weight: normal; letter-spacing: 1px; background: url("../images/logo.png") 15px 10px no-repeat; position: relative; }
.header > .h-main > .logo.new-year { background: url("../images/logo-new-year.png") 8px center no-repeat; }
.header > .h-main > .logo.new-year:after { display: none; }
.header > .h-main > .logo.logo-2 { background: url("../images/uc-logo-2.png") left center no-repeat; }
.header > .h-main > .logo.logo-2:after { display: none; }
.header > .h-main > .logo:after { content: ""; display: block; position: absolute; width: 150px; height: 30px; background: url("../images/texts.png") 4px 7px no-repeat; right: 15px; top: 20px; }
.header > .h-main > .menu { float: left; margin: 16px 0 0 45px; }
.header > .h-main > .menu > a { float: left; padding: 0 10px; margin: 0 10px; line-height: 36px; height: 36px; font-size: 16px; letter-spacing: 1px; color: #666; cursor: pointer; font-weight: normal; /*@include transition(0.2s);*/ }

.header > .h-main > .menu > a:hover { background: #0073fc; color: #fff; }
.header > .h-main > .links { position: absolute; right: 0; height: 70px; font-size: 16px; line-height: 70px; box-sizing: border-box; padding-right: 30px; font-weight: normal; font-family: "SimHei"; }
.header > .h-main > .links span { color: #999; }
.header > .h-main > .links a { border: 2px solid #2b75f3; padding: 5px 20px; border-radius: 30px; -webkit-transition: 0.2s; -ms-transition: 0.2s; -moz-transition: 0.2s; transition: 0.2s; }
.header > .h-main > .links a:hover { color: #fff; background-color: #2b75f3; }

.footer { width: 100%; position: relative; background: #18212a; z-index: 2; }
.footer > .ft-container { width: 1200px; margin: auto; display: block; position: relative; }
.footer > .ft-container .fot-logo { width: 280px; height: 360px; float: left; background: url("../images/logo-fot.png") center no-repeat; }
.footer > .ft-container .ft-warp { float: left; width: 600px; padding-top: 40px; }
.footer > .ft-container .ft-warp > a { width: 360px; height: 50px; display: block; line-height: 50px; color: #fff; text-align: center; background: #298eea; font-size: 18px; margin-left: 120px; font-weight: normal; letter-spacing: 1px; cursor: pointer; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; font-family: "SimHei"; }
.footer > .ft-container .ft-warp > a:hover { background: #1474cc; }
.footer > .ft-container .ft-warp > h4 { margin-top: 35px; height: 35px; line-height: 35px; box-sizing: border-box; padding-left: 190px; display: block; position: relative; font-size: 12px; }
.footer > .ft-container .ft-warp > h4.fot-icon-1 > i { background: #ff3d3d; }
.footer > .ft-container .ft-warp > h4.fot-icon-2 > i { background: #0586d0; }
.footer > .ft-container .ft-warp > h4.fot-icon-3 > i { background: #0e904b; }
.footer > .ft-container .ft-warp > h4 > b { position: absolute; left: 86px; font-size: 18px; font-weight: bold; color: #fff; }
.footer > .ft-container .ft-warp > h4 > i { width: 35px; height: 35px; line-height: 36px; text-align: center; position: absolute; left: 30px; top: 0; color: #fff; background: #ff3d3d; border-radius: 3px; font-size: 24px; font-weight: 300; }
.footer > .ft-container .ft-warp > h4 > span { float: left; margin-right: 35px; color: #ccc; font-weight: 300; }
.footer > .ft-container .ft-warp > h4 > a { float: left; margin-right: 35px; color: #ccc; font-weight: 300; font-size: 14px; cursor: pointer; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.footer > .ft-container .ft-warp > h4 > a:hover { color: #fff; }
.footer > .ft-container .ft-qr { box-sizing: border-box; padding-top: 135px; float: left; }
.footer > .ft-container .ft-qr > .item { width: 132px; float: left; }
.footer > .ft-container .ft-qr > .item > img { width: 132px; height: 132px; display: block; background: #fff; box-sizing: border-box; padding: 2px; }
.footer > .ft-container .ft-qr > .item > h4 { line-height: 54px; font-weight: normal; color: #999; }
.footer > .ft-container .ft-qr > .item:nth-child(1) { margin-right: 55px; }
.footer .ft-bar { width: 100%; line-height: 50px; color: #aaa; background: #272727; text-align: center; font-weight: 300; }
.footer .ft-bar > a { color: rgba(255, 255, 255, 0.8); }
.footer .ft-bar > a:hover { color: #fff; }
.footer .ft-simple { background: #d10b09; box-sizing: border-box; padding-top: 10px; line-height: 28px; font-size: 14px; letter-spacing: 1px; color: rgba(0, 0, 0, 0.6); height: 100px; }
.footer .ft-simple > .link { color: #7f0001; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; font-weight: bold; margin: 0 15px; position: relative; display: inline-block; }
.footer .ft-simple > .link:hover { color: #000; }
.footer .ft-simple > .link:after { width: 2px; height: 12px; background: #7f0001; content: ""; position: absolute; top: 8px; right: -16px; }
.footer .ft-simple > p { font-weight: bold; color: #7f0001; font-size: 12px; }

.footer-uc { width: 100%; height: 150px; display: table; vertical-align: middle; background: #f5f6f7; }
.footer-uc > p { display: table-cell; vertical-align: middle; text-align: center; line-height: 24px; letter-spacing: 1px; color: #aaa; font-size: 12px; }
.footer-uc > p > span:last-of-type:after { display: none; }
.footer-uc > p > a { cursor: pointer; }
.footer-uc > p > a:hover { color: #333; }
.footer-uc > p > span, .footer-uc > p > a { margin: 0 12px; position: relative; color: #aaa; }
.footer-uc > p > span:after, .footer-uc > p > a:after { width: 3px; height: 12px; position: absolute; content: ''; background: #d7d7d7; border-radius: 3px; top: 3px; right: -12px; display: block; }

.modal { width: 100%; height: 100%; display: none; position: fixed; top: 0; left: 0; z-index: 1000; background: rgba(0, 0, 0, 0.2); -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; opacity: 0; filter: alpha(opacity=0); }
.modal.active { opacity: 1; filter: alpha(opacity=100); }
.modal.active > .modal-main { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.modal.failed i.failed { display: block !important; }
.modal.info i.info { display: block !important; }
.modal.error i.error { display: block !important; }
.modal.confirm i.confirm { display: block !important; }
.modal.success i.success { display: block !important; }
.modal.power i.power { display: block !important; }
.modal > .modal-main { position: absolute; top: 40%; left: 50%; text-align: center; background: #fff; min-width: 200px; border-radius: 8px; box-sizing: border-box; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-transform: translate(-50%, -200%); -ms-transform: translate(-50%, -200%); -moz-transform: translate(-50%, -200%); transform: translate(-50%, -200%); }
.modal > .modal-main > .title { width: 100%; height: 30px; line-height: 30px; color: #559bf8; font-size: 16px; letter-spacing: 1px; font-weight: normal; background: #eef5fe; border-radius: 8px 8px 0 0; }
.modal > .modal-main > .icon { width: 100%; box-sizing: border-box; padding: 0 20px; text-align: center; line-height: 90px; display: block; height: 90px; }
.modal > .modal-main > .icon > i { font-size: 50px; display: none; width: 100%; }
.modal > .modal-main > .icon > i.failed { color: #3a9bff; }
.modal > .modal-main > .icon > i.error { /*color:#cf4646;*/ color: #3a9bff; }
.modal > .modal-main > .icon > i.info { /*color:#04a5e6;*/ color: #3a9bff; }
.modal > .modal-main > .icon > i.confirm { /*color:#f0ad4e;*/ color: #3a9bff; }
.modal > .modal-main > .icon > i.success { /*color:#1fa67a;*/ color: #3a9bff; }
.modal > .modal-main > .icon > i.power { color: #3a9bff; }
.modal > .modal-main > .message { white-space: nowrap; box-sizing: border-box; padding: 0 20px 20px; line-height: 24px; color: #666; font-size: 14px; font-weight: bold; letter-spacing: 1px; }
.modal > .modal-main > .btn { width: 100%; text-align: center; padding: 10px 10px 20px 10px; box-sizing: border-box; }
.modal > .modal-main > .btn > a { display: inline-block; padding: 0 30px; color: #fff; border-radius: 30px; line-height: 30px; height: 30px; margin: 0 4px; cursor: pointer; background: #559bf8; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.modal > .modal-main > .btn > a:hover { background: #247ef6; }
.modal > .modal-main > .btn > a.cancel { background: #999; }
.modal > .modal-main > .btn > a.cancel:hover { background: #aaa; }
.modal > .modal-main > .btn > a.danger { background: #d9534f; }
.modal > .modal-main > .btn > a.danger:hover { background: #c9302c; }
.modal > .modal-main > .btn > a.success { background: #1abc9c; }
.modal > .modal-main > .btn > a.success:hover { background: #28e1bd; }

.modal.active .modal-info-main { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.modal .modal-info-main { position: absolute; -webkit-transform: translate(-50%, -100%); -ms-transform: translate(-50%, -100%); -moz-transform: translate(-50%, -100%); transform: translate(-50%, -100%); width: 360px; border-radius: 10px; background: #fff; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; left: 50%; top: 40%; overflow: hidden; box-sizing: border-box; padding: 10px 0 20px 0; }
.modal .modal-info-main > h4 { line-height: 28px; color: #666; font-size: 16px; font-weight: normal; text-align: center; letter-spacing: 1px; }
.modal .modal-info-main > h4 > span > i { font-size: 20px; position: relative; top: 2px; left: -3px; }
.modal .modal-info-main .error-info { line-height: 24px; position: relative; color: #f2555b; text-align: center; display: block; width: 100%; letter-spacing: 1px; }
.modal .modal-info-main .edit-form { width: 100%; margin-top: 5px; }
.modal .modal-info-main .edf-line { height: 32px; line-height: 32px; margin-bottom: 15px; }
.modal .modal-info-main .edf-line.edf-var > input { width: 130px; }
.modal .modal-info-main .edf-line.edf-var > img { width: 90px; height: 32px; float: left; margin-left: 5px; cursor: pointer; border-radius: 5px; }
.modal .modal-info-main .edf-line.edf-var > a { width: 90px; height: 32px; float: left; margin-left: 5px; cursor: pointer; border-radius: 5px; background: #00c3ff; color: #fff; line-height: 32px; letter-spacing: 1px; text-align: center; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.modal .modal-info-main .edf-line.edf-var > a.active { cursor: default; border: 1px solid #00c3ff; background: #fff; color: #ccc; font-size: 12px; letter-spacing: 0; }
.modal .modal-info-main .edf-line > label { width: 100px; height: 32px; float: left; padding-right: 10px; box-sizing: border-box; text-align: right; font-size: 14px; color: #666; }
.modal .modal-info-main .edf-line > input { height: 32px; line-height: 32px; float: left; border: 0; background: #f6f6f6; width: 225px; box-sizing: border-box; padding: 0 10px 0 15px; color: #666; outline: none; border-radius: 4px; }
.modal .modal-info-main .edf-line > input:focus { box-shadow: inset 0 0 4px #ccc; }
.modal .modal-info-main .edf-line > input::-webkit-input-placeholder { color: #d1d1d1; }
.modal .modal-info-main .edf-line > input:-moz-placeholder { color: #d1d1d1; }
.modal .modal-info-main .edf-line > input::-moz-placeholder { color: #d1d1d1; }
.modal .modal-info-main .edf-line > input:-ms-input-placeholder { color: #d1d1d1; }
.modal .modal-info-main .edf-btn-group { width: 100%; height: 35px; margin-top: 25px; line-height: 35px; }
.modal .modal-info-main .edf-btn-group > .edf-btn { display: inline-block; width: 100px; height: 35px; background: #00c3ff; color: #fff; margin: 0 4px; border-radius: 5px; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; letter-spacing: 2px; cursor: pointer; }
.modal .modal-info-main .edf-btn-group > .edf-btn:hover { background: #009ccc; }
.modal .modal-info-main .edf-btn-group > .edf-btn.cancel { background: #d0d0d0; }
.modal .modal-info-main .edf-btn-group > .edf-btn.cancel:hover { background: #c2c2c2; }

.page { width: 100%; text-align: center; position: absolute; display: block; left: 0; box-sizing: border-box; margin: auto; bottom: 40px; }
.page > .link { line-height: 26px; display: inline-block; height: 26px; padding: 0 10px; box-sizing: border-box; margin: 0 3px; cursor: pointer; border: 1px solid  #ccc; border-radius: 3px; color: #999; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.page > .link:hover { background: #00c3ff; color: #fff; border: 1px solid #00c3ff; }
.page > .link.cur { background: #00c3ff; color: #fff; border: 1px solid #00c3ff; }

.xc_pages { width: 100%; position: relative; display: block; }
.xc_pages > div { width: 100%; text-align: center; position: absolute; display: block; left: 0; box-sizing: border-box; margin: auto; bottom: 40px; }
.xc_pages > div > a { line-height: 26px; display: inline-block; height: 26px; padding: 0 10px; box-sizing: border-box; margin: 0 3px; cursor: pointer; border: 1px solid  #ccc; border-radius: 3px; color: #999; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.xc_pages > div > a:hover { background: #00c3ff; color: #fff; border: 1px solid #00c3ff; }
.xc_pages > div > a.cur { background: #00c3ff; color: #fff; border: 1px solid #00c3ff; }
.xc_pages > div > p { line-height: 26px; display: inline-block; height: 26px; padding: 0 10px; box-sizing: border-box; margin: 0 3px; border: 1px solid  #ccc; border-radius: 3px; color: #999; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.xc_pages > div > p.pageRemark { border: none; }

.num-picker { float: left; position: relative; height: 32px; width: 142px; }
.num-picker > label { width: 120px; float: left; position: relative; height: 32px; }
.num-picker > label > input { position: relative; width: 100%; height: 32px; background: #eee; text-align: center; color: #666; font-size: 16px; box-sizing: border-box; border: 0; outline: none; border-radius: 3px 0 0 3px; }
.num-picker > .control { width: 20px; float: left; height: 32px; margin-left: 2px; position: relative; }
.num-picker > .control > span { width: 100%; height: 15px; cursor: pointer; background: #eee; line-height: 16px; color: #8d8d8d; text-align: center; padding: 0; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; position: absolute; border: none; display: block; left: 0; outline: none; }
.num-picker > .control > span.disable { color: #fff; cursor: default; }
.num-picker > .control > span.disable:hover { color: #fff; cursor: default; background: #eee; }
.num-picker > .control > span.plus { top: 0; border-radius: 0 3px 0 0; }
.num-picker > .control > span.plus:after { content: "\e629"; }
.num-picker > .control > span.minus { bottom: 0; border-radius: 0 0 3px 0; }
.num-picker > .control > span.minus:after { content: "\e61b"; }
.num-picker > .control > span:hover { background: #d4d4d4; color: #666; }
.num-picker > .control > span.active { background: #999; color: #fff; }
.num-picker .error { position: absolute; width: 100%; box-sizing: border-box; padding: 5px; background: #f26326; color: #fff; line-height: 18px; font-size: 12px; text-align: center; display: none; top: calc(100% + 2px); }
.num-picker .error.active { display: block; }

.pay .vip-package { height: 100px; margin: 18px 0 30px 65px; line-height: 100px; box-sizing: border-box; padding-left: 180px; position: relative; text-align: left; }
.pay .vip-package > span { width: 180px; height: 100px; position: absolute; top: 0; left: 0; background: url("../images/n_pay.png") -265px -30px; }
.pay .vip-package > h4 { color: #555; font-size: 18px; }

.get_var_code { width: 100%; }
.get_var_code .val-img { float: right; width: 100px; height: 42px; margin-right: 5px; }
.get_var_code .phone_code { float: left; width: 110px; height: 42px; box-sizing: border-box; outline: none; padding: 0 5px; }

.float_md_qr { position: fixed; z-index: 10000; left: 0px; bottom: 200px; width: 54px; height: 54px; line-height: 54px; }
.float_md_qr:hover .hide_qr { -webkit-transform: translate(0) scale(1); -ms-transform: translate(0) scale(1); -moz-transform: translate(0) scale(1); transform: translate(0) scale(1); }
.float_md_qr > a { position: relative; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); color: #fff; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; display: block; border-radius: 4px; cursor: pointer; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.float_md_qr > a:hover { color: #00bcff; }
.float_md_qr > a > i { position: absolute; font-size: 40px; width: 100%; height: 100%; overflow: hidden; top: -2px; left: -1px; }
.float_md_qr .hide_qr { width: 140px; box-sizing: border-box; padding: 10px; background: rgba(0, 0, 0, 0.5); border-radius: 5px; position: absolute; top: calc(100% + 2px); left: 0; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); -moz-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); }
.float_md_qr .hide_qr > img { width: 120px; height: 120px; }
.float_md_qr .hide_qr > h4 { line-height: 20px; margin-top: 10px; font-size: 12px; color: #fff; font-weight: normal; }
.float_md_qr .hide_qr > h4 > i { position: relative; top: 2px; }

.n_heads { width: 100%; height: 30px; background-color: #3c3c3c; }
.n_heads > .n_main { position: relative; width: 1200px; margin: 0 auto; height: 100%; line-height: 30px; text-align: left; color: #fff; font-size: 12px; }
.n_heads > .n_main a { color: #fff; }
.n_heads > .n_main .collection { cursor: pointer; position: relative; margin-left: 40px; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.n_heads > .n_main .collection:before { content: "\e641"; display: block; position: absolute; top: -7px; left: -25px; font-size: 18px; color: #ffd800; }
.n_heads > .n_main .collection:after { content: " "; display: block; position: absolute; right: -20px; top: 3px; width: 1px; height: 13px; background-color: #fff; }
.n_heads > .n_main .collection:hover { color: #ffe345; }
.n_heads > .n_main .telephone { position: relative; margin-left: 70px; }
.n_heads > .n_main .telephone:before { content: "\e60a"; display: block; position: absolute; left: -30px; top: -5px; font-size: 18px; color: #fff; }
.n_heads > .n_main .times { margin-left: 60px; position: relative; }
.n_heads > .n_main .times:before { content: "\e73f"; display: block; position: absolute; left: -30px; top: -6px; font-size: 18px; color: #fff; }

.advertisement { position: relative; z-index: 3; width: 100%; height: 70px; }
.advertisement img { display: block; margin: 0 auto; width: 1200px; height: 100%; }
.advertisement span { display: block; position: absolute; top: 0; width: 50%; height: 100%; }
.advertisement span:first-child { left: 0; background-color: #ff481e; }
.advertisement span:last-child { right: 0; background-color: #ff00a1; }

.n_download { position: relative; width: 100%; background-color: #d01b26; }
.n_download:before { content: " "; display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 300px; height: 574px; background: url("../images/download_left.png") no-repeat 0px 0px #000; }
.n_download:after { content: " "; display: block; position: absolute; z-index: 1; right: 0; top: 0; width: 509px; height: 574px; background: url("../images/download_right.jpg") no-repeat 0px 0px #000; }
.n_download .n_download_main { position: relative; z-index: 2; margin: 0 auto; width: 850px; height: 574px; }
.n_download .n_download_main li { position: relative; cursor: pointer; margin-top: 100px; float: left; width: 250px; height: 365px; border-radius: 3px; margin-right: 50px; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.n_download .n_download_main li:last-child { margin-right: 0; }
.n_download .n_download_main li:hover { background-color: rgba(0, 0, 0, 0.1); }
.n_download .n_download_main li > span { position: relative; display: block; margin: 40px auto 20px auto; width: 165px; height: 165px; border-radius: 10px; border: 1px solid #fff; background-color: rgba(0, 0, 0, 0.1); }
.n_download .n_download_main li > span > i { margin: 15px auto 0px auto; display: inline-block; font-size: 70px; color: #fff; }
.n_download .n_download_main li > span > .port { display: inline-block; width: 140px; height: 34px; font-weight: 700; letter-spacing: 1px; line-height: 34px; color: #bb1822; text-align: center; background-color: #ffe300; border-radius: 17px; }
.n_download .n_download_main li > span .scanning { display: block; position: absolute; bottom: -210px; left: -18px; width: 200px; height: auto; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); -moz-transform: scale(0, 0); transform: scale(0, 0); }
.n_download .n_download_main li > span .scanning .triangle_up { position: absolute; top: 0; left: 93px; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 12px solid #fff; }
.n_download .n_download_main li > span .scanning > span { display: block; margin-top: 11px; padding-top: 10px; padding-bottom: 10px; width: 200px; height: 190px; border-radius: 10px; background-color: #fff; font-size: 12px; color: #2c1e10; }
.n_download .n_download_main li > span .scanning > span > img { display: block; margin: 5px auto 0 auto; width: 165px; height: 165px; }
.n_download .n_download_main li > span:hover .scanning { -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); -moz-transform: scale(1, 1); transform: scale(1, 1); }
.n_download .n_download_main li > span .app_span { position: absolute; top: -1px; right: 12px; width: 37px; height: 47px; background-color: #2b75f3; color: #fff; font-size: 12px; }
.n_download .n_download_main li > span .app_span:before { content: "\e617"; display: block; font-size: 20px; color: #fff; }
.n_download .n_download_main li p { margin-top: 10px; color: #fff; font-size: 14px; }
.n_download .n_download_main li p span { display: inline-block; padding: 0px 4px; border-radius: 3px; font-size: 12px; background-color: #2b75f3; }

.qq_contact { cursor: pointer; display: block; top: 104px; right: 0px; position: fixed; z-index: 100; color: #fff; font-size: 12px; width: 60px; text-align: center; padding-left: 30px; height: 60px; border-radius: 6px 0 0 6px; background-color: #c13e38; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.qq_contact:before { content: ""; display: block; position: absolute; top: -11px; right: 60px; width: 61px; height: 78px; background: url("../images/qq_img.png") 0px 0px; }
.qq_contact i, .qq_contact span { display: block; line-height: 23px; }
.qq_contact i { font-size: 26px; margin-top: 11px; }
.qq_contact:hover { background-color: #a60d06; }

.new-year-alert { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); z-index: 1999; top: 0; left: 0; opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; display: none; }
.new-year-alert.active { opacity: 1; filter: alpha(opacity=100); display: block; }
.new-year-alert.active > .na-main { -webkit-animation: flipIn 1.2s; -ms-animation: flipIn 1.2s; -moz-animation: flipIn 1.2s; animation: flipIn 1.2s; }
.new-year-alert > .na-main { position: absolute; width: 520px; height: 180px; top: calc(50% - 60px); left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; color: #fff; }
.new-year-alert > .na-main:after { width: 1440px; height: 640px; display: block; content: ""; position: absolute; z-index: 1; top: calc(50% + 20px); left: calc(50% - 26px); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: url("../images/new-year-alert.png") center no-repeat; }
.new-year-alert > .na-main > h4 { line-height: 46px; font-size: 28px; font-weight: normal; color: #fff; letter-spacing: 1px; }
.new-year-alert > .na-main > h6 { line-height: 36px; font-size: 20px; letter-spacing: 1px; font-weight: 300; }
.new-year-alert > .na-main > h5 { color: #feddb6; line-height: 36px; font-size: 20px; letter-spacing: 1px; font-weight: 300; }
.new-year-alert > .na-main > p { line-height: 34px; font-size: 20px; letter-spacing: 1px; }
.new-year-alert > .na-main > * { position: relative; z-index: 2; }
.new-year-alert > .na-main > .close { width: 66px; height: 66px; display: block; position: absolute; cursor: pointer; bottom: -244px; left: calc(50% - 22px); }

@-webkit-keyframes flipIn { from { -webkit-transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, 360deg); opacity: 0; filter: alpha(opacity=0); -webkit-animation-timing-function: ease-out; }
  40% { -webkit-transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, -60deg); -webkit-animation-timing-function: ease-in; }
  60% { -webkit-transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, 20deg); opacity: 1; filter: alpha(opacity=100); -webkit-animation-timing-function: ease-out; }
  75% { -webkit-transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, -12deg); -webkit-animation-timing-function: ease-in; }
  85% { -webkit-transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, 5deg); -webkit-animation-timing-function: ease-out; }
  92% { -webkit-transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, -2deg); -webkit-animation-timing-function: ease-in; }
  to { -webkit-transform: translate(-50%, -50%) perspective(2000px); -webkit-animation-timing-function: ease-out; } }
@keyframes flipIn { from { transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, 360deg); opacity: 0; filter: alpha(opacity=0); animation-timing-function: ease-out; }
  40% { transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, -60deg); animation-timing-function: ease-in; }
  60% { transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, 20deg); opacity: 1; filter: alpha(opacity=100); animation-timing-function: ease-out; }
  75% { transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, -12deg); animation-timing-function: ease-in; }
  85% { transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, 5deg); animation-timing-function: ease-out; }
  92% { transform: translate(-50%, -50%) perspective(2000px) rotate3d(0, 1, 0, -2deg); animation-timing-function: ease-in; }
  to { transform: translate(-50%, -50%) perspective(2000px); animation-timing-function: ease-out; } }
@media screen and (max-width: 1440px) { .qq_contact { top: 170px; } }