/**/
@charset 'utf-8';
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
html {
    line-height: 1.15; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
    margin: 0;
}
/**
 * Add the correct display in IE 9-.
 */
article, aside, footer, header, nav, section {
    display: block;
}
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}
/* Grouping content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */
figcaption, figure, main {
    /* 1 */
    display: block;
}
/**
 * Add the correct margin in IE 8.
 */
figure {
    margin: 1em 40px;
}
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
    -webkit-box-sizing: content-box;
       -moz-box-sizing: content-box;
            box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
    font-family: monospace; /* 1 */
    font-size: 1em; /* 2 */
}
/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
    background-color: transparent; /* 1 */
    -webkit-text-decoration-skip: objects; /* 2 */
}
/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    -webkit-text-decoration: underline dotted;
       -moz-text-decoration: underline dotted;
            text-decoration: underline dotted; /* 2 */
}
/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b, strong {
    font-weight: bolder;
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code, kbd, samp {
    font-family: monospace; /* 1 */
    font-size: 1em; /* 2 */
}
/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
    font-style: italic;
}
/**
 * Add the correct background and color in IE 9-.
 */
mark {
    background-color: #ff0;
    color: #000;
}
/**
 * Add the correct font size in all browsers.
 */
small {
    font-size: 80%;
}
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sub {
    bottom: -0.25em;
}
sup {
    top: -0.5em;
}
/* Embedded content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
audio, video {
    display: inline-block;
}
/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
    display: none;
    height: 0;
}
/**
 * Remove the border on images inside links in IE 10-.
 */
img {
    border-style: none;
}
/**
 * Hide the overflow in IE.
 */
/* stylelint-disable */
svg:not(:root) {
    overflow: hidden;
}
/* stylelint-enable */
/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button, input, optgroup, select, textarea {
    font-family: sans-serif; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
}
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button, input {
    /* 1 */
    overflow: visible;
}
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button, select {
    /* 1 */
    text-transform: none;
}
/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button, html [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button; /* 2 */
}
/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner, [type='button']::-moz-focus-inner, [type='reset']::-moz-focus-inner, [type='submit']::-moz-focus-inner {
    border-style: none;
    padding: 0;
}
/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring, [type='button']:-moz-focusring, [type='reset']:-moz-focusring, [type='submit']:-moz-focusring {
    outline: 1px dotted ButtonText;
}
/**
 * Correct the padding in Firefox.
 */
fieldset {
    padding: 0.35em 0.75em 0.625em;
}
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
}
/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    display: inline-block; /* 1 */
    vertical-align: baseline; /* 2 */
}
/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
    overflow: auto;
}
/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type='checkbox'], [type='radio'] {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
}
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type='number']::-webkit-inner-spin-button, [type='number']::-webkit-outer-spin-button {
    height: auto;
}
/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type='search'] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
}
/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */
[type='search']::-webkit-search-cancel-button, [type='search']::-webkit-search-decoration {
    -webkit-appearance: none;
}
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
}
/* Interactive
   ========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
details, menu {
    display: block;
}
/*
 * Add the correct display in all browsers.
 */
summary {
    display: list-item;
}
/* Scripting
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
canvas {
    display: inline-block;
}
/**
 * Add the correct display in IE.
 */
template {
    display: none;
}
/* Hidden
   ========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
[hidden] {
    display: none;
}
/* FullScreen
   ========================================================================== */
/**
 * reset the background for element when it is in fullscreen status
 */
:-webkit-full-screen {
    background: transparent;
}
@charset 'utf-8';
@charset 'utf-8';
/**
 * A thin layer on top of normalize.css that provides a starting point more
 * suitable for web applications.
 */
@charset 'utf-8';
/**
 * Theme definition
 *
 * This defines the theme in fundamental terms, but not how it is applied to
 * the components. That is done in `theme-map.css`.
 */
/**
 * Fonts
 */
:root {
    /* xy-ui主题色 */
    --themeColor: #ff5d23;

    --fontSize: 12px;
    --fontFamily: -apple-system, 'Microsoft Yahei', sans-serif;
    --lineHeight: 1.5;
    --HeaderHeight: 62px;
    --WindowMinWidth: 1360px;

    /* Standard color */
    --colorA0: #ff5d23;
    --colorA1: #ff5d23;
    --colorA2: #f00;
    --colorA3: #2b94ff;
    --colorA4: #245bb6;
    --colorA5: #80b750;

    /* Standard dark color (light color background) */
    --colorB0: #000;
    --colorB1: #333;
    --colorB2: #666;
    --colorB3: #999;
    --colorB4: #1e1e1e;

    /* Standard light color (dark color background) */
    --colorC0: #fff;
    --colorC1: #f4f5f9;
    --colorC2: #d3ded3;
    --colorC3: #ccc;
    --colorC4: #aaa;

    /* Other colors (dark color background) */
    --colorD0: #8d93a1;
    --colorD1: #828992;
    --colorD2: #6d757a;
    --colorD3: #5d6b7a;
    --colorD4: #2c3e50;

    /* Theme color */
    --colorMain: var(--colorA0);
    --colorText: var(--colorB1);
    --colorBlockBackground: #ddd;
    --colorBackground: #fff;
    --gap: 5px;
    --gapMid: 10px;
    --gapBig: -webkit-calc(var(--gap) + var(--gapMid));
    --gapBig: -moz-calc(var(--gap) + var(--gapMid));
    --gapBig: calc(var(--gap) + var(--gapMid));
    --gapLarge: -webkit-calc(2 * var(--gapMid));
    --gapLarge: -moz-calc(2 * var(--gapMid));
    --gapLarge: calc(2 * var(--gapMid));
}
html, body {
    min-height: 100%;
}
/**
 * 1. Prevent padding and border from affecting element width
 * https://goo.gl/pYtbK7
 * 2. Change the default font family and font size in all browsers (opinionated)
 * 3. Correct the line height in all browsers.
 */
html {
    height: 100%;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box; /* 1 */
    font-family: -apple-system, 'Microsoft Yahei', sans-serif;
    font-family: var(--fontFamily); /* 2 */
    font-size: 12px;
    font-size: var(--fontSize); /* 2 */
    line-height: 1.5;
    line-height: var(--lineHeight); /* 3 */
}
/**
 * As a best practice, apply a default `color & background-color`.
 */
body {
    color: #333;
    color: var(--colorText);
    background-color: #fff;
    background-color: var(--colorBackground);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: antialiased;
}
/**
 * Removes the default spacing and border for appropriate elements.
 */
blockquote, dl, dd, h1, h2, h3, h4, h5, h6, figure, p, pre {
    margin: 0;
}
/*
* reset all <h> tag font size
*/
h1, h2, h3, h4, h5, h6 {
    font-size: 12px;
    font-size: var(--fontSize);
    font-weight: 400;
}
button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}
button {
    background: transparent;
    border: 0;
    padding: 0;
}
/**
 * Work around a Firefox/IE bug where the transparent `button` background
 * results in a loss of the default `button` focus styles.
 */
button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color;
}
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}
iframe {
    border: 0;
}
ol, ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
/**
 * Suppress the focus outline on elements that cannot be accessed via keyboard.
 * This prevents an unwanted focus outline from appearing around elements that
 * might still respond to pointer events.
 */
[tabindex='-1']:focus {
    outline: none !important;
}
a {
    color: #333;
    color: var(--colorText);
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: color 0.3s;
    -o-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}
a:hover {
    color: #ff5d23;
    color: var(--colorMain);
}
/**
 * 1. The value of display in Firefox 3.6 is inline.
 * 2. Fix for Firefox bug: an image styled `max-width:100%` within an
 * inline-block will display at its default size, and not limit its width to
 * 100% of an ancestral container.
 * !important removed by yangkun for video boradcast image
 */
img {
    display: inline-block; /* 1 */
    -webkit-user-drag: none;
    border: 0;
    vertical-align: middle;
}
table {
    border-collapse: collapse;
}
i, em {
    font-style: normal;
}
@charset 'utf-8';
@-webkit-keyframes slideDown {
    from {
        -webkit-transform: translateY(-5%);
                transform: translateY(-5%);
    }

    to {
        -webkit-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-moz-keyframes slideDown {
    from {
        -moz-transform: translateY(-5%);
             transform: translateY(-5%);
    }

    to {
        -moz-transform: translateY(0%);
             transform: translateY(0%);
    }
}
@-o-keyframes slideDown {
    from {
        -o-transform: translateY(-5%);
           transform: translateY(-5%);
    }

    to {
        -o-transform: translateY(0%);
           transform: translateY(0%);
    }
}
@keyframes slideDown {
    from {
        -webkit-transform: translateY(-5%);
           -moz-transform: translateY(-5%);
             -o-transform: translateY(-5%);
                transform: translateY(-5%);
    }

    to {
        -webkit-transform: translateY(0%);
           -moz-transform: translateY(0%);
             -o-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-webkit-keyframes slideDownMid {
    from {
        -webkit-transform: translateY(-30%);
                transform: translateY(-30%);
    }

    to {
        -webkit-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-moz-keyframes slideDownMid {
    from {
        -moz-transform: translateY(-30%);
             transform: translateY(-30%);
    }

    to {
        -moz-transform: translateY(0%);
             transform: translateY(0%);
    }
}
@-o-keyframes slideDownMid {
    from {
        -o-transform: translateY(-30%);
           transform: translateY(-30%);
    }

    to {
        -o-transform: translateY(0%);
           transform: translateY(0%);
    }
}
@keyframes slideDownMid {
    from {
        -webkit-transform: translateY(-30%);
           -moz-transform: translateY(-30%);
             -o-transform: translateY(-30%);
                transform: translateY(-30%);
    }

    to {
        -webkit-transform: translateY(0%);
           -moz-transform: translateY(0%);
             -o-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-webkit-keyframes slideDownFadeMid {
    from {
        -webkit-transform: translateY(-30%);
                transform: translateY(-30%);
        opacity: 0;
    }

    to {
        -webkit-transform: translateY(0%);
                transform: translateY(0%);
        opacity: 1;
    }
}
@-moz-keyframes slideDownFadeMid {
    from {
        -moz-transform: translateY(-30%);
             transform: translateY(-30%);
        opacity: 0;
    }

    to {
        -moz-transform: translateY(0%);
             transform: translateY(0%);
        opacity: 1;
    }
}
@-o-keyframes slideDownFadeMid {
    from {
        -o-transform: translateY(-30%);
           transform: translateY(-30%);
        opacity: 0;
    }

    to {
        -o-transform: translateY(0%);
           transform: translateY(0%);
        opacity: 1;
    }
}
@keyframes slideDownFadeMid {
    from {
        -webkit-transform: translateY(-30%);
           -moz-transform: translateY(-30%);
             -o-transform: translateY(-30%);
                transform: translateY(-30%);
        opacity: 0;
    }

    to {
        -webkit-transform: translateY(0%);
           -moz-transform: translateY(0%);
             -o-transform: translateY(0%);
                transform: translateY(0%);
        opacity: 1;
    }
}
@-webkit-keyframes slideUp {
    from {
        -webkit-transform: translate(0, 5%);
                transform: translate(0, 5%);
    }

    to {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}
@-moz-keyframes slideUp {
    from {
        -moz-transform: translate(0, 5%);
             transform: translate(0, 5%);
    }

    to {
        -moz-transform: translate(0, 0);
             transform: translate(0, 0);
    }
}
@-o-keyframes slideUp {
    from {
        -o-transform: translate(0, 5%);
           transform: translate(0, 5%);
    }

    to {
        -o-transform: translate(0, 0);
           transform: translate(0, 0);
    }
}
@keyframes slideUp {
    from {
        -webkit-transform: translate(0, 5%);
           -moz-transform: translate(0, 5%);
             -o-transform: translate(0, 5%);
                transform: translate(0, 5%);
    }

    to {
        -webkit-transform: translate(0, 0);
           -moz-transform: translate(0, 0);
             -o-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}
@-webkit-keyframes slideUpMid {
    from {
        -webkit-transform: translateY(30%);
                transform: translateY(30%);
    }

    to {
        -webkit-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-moz-keyframes slideUpMid {
    from {
        -moz-transform: translateY(30%);
             transform: translateY(30%);
    }

    to {
        -moz-transform: translateY(0%);
             transform: translateY(0%);
    }
}
@-o-keyframes slideUpMid {
    from {
        -o-transform: translateY(30%);
           transform: translateY(30%);
    }

    to {
        -o-transform: translateY(0%);
           transform: translateY(0%);
    }
}
@keyframes slideUpMid {
    from {
        -webkit-transform: translateY(30%);
           -moz-transform: translateY(30%);
             -o-transform: translateY(30%);
                transform: translateY(30%);
    }

    to {
        -webkit-transform: translateY(0%);
           -moz-transform: translateY(0%);
             -o-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-webkit-keyframes slideUpBig {
    from {
        -webkit-transform: translateY(70%);
                transform: translateY(70%);
    }

    to {
        -webkit-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-moz-keyframes slideUpBig {
    from {
        -moz-transform: translateY(70%);
             transform: translateY(70%);
    }

    to {
        -moz-transform: translateY(0%);
             transform: translateY(0%);
    }
}
@-o-keyframes slideUpBig {
    from {
        -o-transform: translateY(70%);
           transform: translateY(70%);
    }

    to {
        -o-transform: translateY(0%);
           transform: translateY(0%);
    }
}
@keyframes slideUpBig {
    from {
        -webkit-transform: translateY(70%);
           -moz-transform: translateY(70%);
             -o-transform: translateY(70%);
                transform: translateY(70%);
    }

    to {
        -webkit-transform: translateY(0%);
           -moz-transform: translateY(0%);
             -o-transform: translateY(0%);
                transform: translateY(0%);
    }
}
@-webkit-keyframes slideRight {
    from {
        -webkit-transform: translateX(-5%);
                transform: translateX(-5%);
    }

    to {
        -webkit-transform: translateX(0%);
                transform: translateX(0%);
    }
}
@-moz-keyframes slideRight {
    from {
        -moz-transform: translateX(-5%);
             transform: translateX(-5%);
    }

    to {
        -moz-transform: translateX(0%);
             transform: translateX(0%);
    }
}
@-o-keyframes slideRight {
    from {
        -o-transform: translateX(-5%);
           transform: translateX(-5%);
    }

    to {
        -o-transform: translateX(0%);
           transform: translateX(0%);
    }
}
@keyframes slideRight {
    from {
        -webkit-transform: translateX(-5%);
           -moz-transform: translateX(-5%);
             -o-transform: translateX(-5%);
                transform: translateX(-5%);
    }

    to {
        -webkit-transform: translateX(0%);
           -moz-transform: translateX(0%);
             -o-transform: translateX(0%);
                transform: translateX(0%);
    }
}
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
@-o-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
@-webkit-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
@-moz-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
@-o-keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
@charset 'utf-8';
.Icon-Change {
    width: 13px;
    height: 11px;
    vertical-align: -1px;
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    -o-transition: -o-transform 0.2s;
    -moz-transition: transform 0.2s, -moz-transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s;
}
.Icon-More {
    width: 7px;
    height: 11px;
    vertical-align: -1px;
}
.Icon-Live {
    width: 18px;
    height: 13px;
    vertical-align: -2px;
}
.Icon-UpIcon {
    width: 14px;
    height: 10px;
    vertical-align: -1px;
}
.Icon-Video {
    width: 13px;
    height: 11px;
    vertical-align: -1px;
}
.Icon-Zan {
    width: 13px;
    height: 12px;
    vertical-align: -1px;
}
.Icon-Time {
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/b678e6da9f0162aa98a7e67db4848299.png) no-repeat 0 0;
    vertical-align: -1px;
}
.icon-author-type-1, .icon-author-type-2, .icon-author-type-3 {
    width: 100%;
    height: 100%;
    display: inline-block;
    background-repeat: no-repeat;
    -moz-background-size: 100% 100%;
      -o-background-size: 100% 100%;
         background-size: 100% 100%;
    vertical-align: middle;
}
.icon-author-type-1 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/ba43aed5110d9a9f57d0b7bb2478c5ff.svg);
}
.icon-author-type-2 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/508600e68f75a8282bac734e708f8454.svg);
}
.icon-author-type-3 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/ee53def2fc79824429506ab54ae84b8a.svg);
}
.Icon-Time {
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/b678e6da9f0162aa98a7e67db4848299.png) no-repeat 0 0;
    vertical-align: -1px;
}
.icon-author-type-1, .icon-author-type-2, .icon-author-type-3 {
    width: 100%;
    height: 100%;
    display: inline-block;
    background-repeat: no-repeat;
    -moz-background-size: 100% 100%;
      -o-background-size: 100% 100%;
         background-size: 100% 100%;
    vertical-align: middle;
}
.icon-author-type-1 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/ba43aed5110d9a9f57d0b7bb2478c5ff.svg);
}
.icon-author-type-2 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/508600e68f75a8282bac734e708f8454.svg);
}
.icon-author-type-3 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/ee53def2fc79824429506ab54ae84b8a.svg);
}
body {
    min-height: 100%;
}
body.is-Fullscreen {
    overflow: hidden;
}
a, button, input, textarea, select {
    font-family: inherit;
    outline: 0;
}
a:focus, button:focus, input:focus, textarea:focus, select:focus {
        outline: 0;
    }
svg {
    fill: currentColor;
    stroke: currentColor;
    stroke-width: 0;
    pointer-events: visibleStroke;
}
/* stylelint-disable */
* {
    outline: 0;
}
*:focus {
        outline: 0;
    }
/* stylelint-enable */
input::-ms-clear {
    display: none;
}
.clearFix::before, .clearFix::after {
        content: ' '; /* 1 */
        display: table; /* 2 */
    }
.clearFix::after {
        clear: both;
    }
/* hack for safari rendering bug*/
.passport-iframe-shadow, .passport-iframe-con {
    -webkit-transform: translate(0, 0);
       -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
         -o-transform: translate(0, 0);
            transform: translate(0, 0);
}
.passport-iframe-con {
    -webkit-animation: slideDownMid 0.2s cubic-bezier(0.18, 0.89, 0.32, 1.28) forwards;
       -moz-animation: slideDownMid 0.2s cubic-bezier(0.18, 0.89, 0.32, 1.28) forwards;
         -o-animation: slideDownMid 0.2s cubic-bezier(0.18, 0.89, 0.32, 1.28) forwards;
            animation: slideDownMid 0.2s cubic-bezier(0.18, 0.89, 0.32, 1.28) forwards;
}
.（⊙\.⊙） {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3500;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    background: #fff center/cover no-repeat;
    text-align: center;
    white-space: nowrap;
}
.（⊙\.⊙） .\:-O {
        width: 30px;
        height: 30px;
        position: absolute;
        right: 7px;
        top: 5px;
    }
.（⊙\.⊙） .（\/\/▽\/\/） {
        display: inline-block;
        vertical-align: middle;
        height: 100%;
    }
.（⊙\.⊙） .o_O {
        display: inline-block;
        vertical-align: middle;
    }
.（⊙\.⊙） .o_O .๑乛◡乛๑ {
            margin-top: 22px;
            height: 20px;
            font-size: 24px;
            font-weight: 700;
            line-height: 20px;
            text-align: center;
            color: #414141;
        }
.（⊙\.⊙） .o_O .\(\*\^__\^\*\) {
            overflow: hidden;
            text-align: justify;
            display: inline-block;
            text-justify: distribute-all-lines;
            font-size: 0;
        }
.（⊙\.⊙） .o_O .\(\*\^__\^\*\):after {
                display: inline-block;
                width: 100%;
                content: ' ';
            }
.（⊙\.⊙） .o_O .\(\*\^__\^\*\) .\^O\^ {
                position: relative;
                display: inline-block;
                vertical-align: middle;
                margin: 80px 0 0;
                padding: 0 100px;
                font-size: 20px;
                color: #ff5a12;
                text-align: center;
            }
.（⊙\.⊙） .o_O .\(\*\^__\^\*\) .\^O\^::before {
                    position: absolute;
                    content: '';
                    top: 40px;
                    bottom: 40px;
                    width: 1px;
                    left: -1px;
                    background: #ddd;
                }
.（⊙\.⊙） .o_O .\(\*\^__\^\*\) .\^O\^[data-rel='chrome'] i {
                    display: block;
                    width: 102px;
                    height: 102px;
                    margin: 15px auto;
                    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/fb0ae395dd53d19e9621be509bfefe0b.png) no-repeat;
                }
.（⊙\.⊙） .o_O .\(\*\^__\^\*\) .\^O\^[data-rel='firefox'] i {
                    display: block;
                    width: 102px;
                    height: 102px;
                    margin: 15px auto;
                    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/1627a56bd2ad1611cd85661fa6015ced.png) no-repeat;
                }
.（⊙\.⊙） .o_O .\(\*\^__\^\*\) .\^O\^[data-rel='edge'] i {
                    display: block;
                    width: 102px;
                    height: 102px;
                    margin: 15px auto;
                    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/0121b4eda25cdf6246c2eabccba5f339.png) no-repeat;
                }
.（⊙\.⊙） .o_O .\(¬､¬\) {
            margin: 48px 48px 0 73px;
        }
.（⊙\.⊙） .o_O .\(¬､¬\) .\(｡ớ₃ờ\)ھ {
                float: left;
                width: 139px;
                height: 139px;
            }
.（⊙\.⊙） .o_O .\(¬､¬\) .\(๑ŐдŐ\)b {
                overflow: hidden;
                text-align: center;
            }
.（⊙\.⊙） .o_O .\(¬､¬\) .✿◡‿◡ {
                margin: 37px 0 0;
                font-size: 18px;
                line-height: 1;
                color: #666;
            }
.（⊙\.⊙） .o_O .\(¬､¬\) .︶ε╰✿ {
                display: block;
                margin: 20px auto 0;
                width: 182px;
                height: 33px;
            }
.（⊙\.⊙）[active] {
    display: block !important;
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/9f07779cbcdb62ecfa9c59fa54ec92d5.png);
}
[active] .ฅ’ω’ฅ {
    width: 263px;
    height: 227px;
    margin: 0 auto 45px;
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/1e2cfb24e0acf0851dab386dc8165737.png) center no-repeat;
}
douyu-message-manager {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    z-index: 3500;
}
demand-cover {
    overflow: hidden;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
    position: relative;
    display: block;
    height: 0;
    padding-bottom: 56.25%;
    background: #ddd;
    background: var(--colorBlockBackground);
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
    /* hack for safari border-radius bug */
    -webkit-filter: contrast(0.99);
            filter: contrast(0.99);
}
demand-cover:not(.not-video)::before {
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    bottom: 0;
    height: 48px;
    z-index: 1;
    background-image: -webkit-gradient(
        linear,
        left top, left bottom,
        from(rgba(0, 0, 0, 0)),
        to(rgba(0, 0, 0, 0.6))
    );
    background-image: -webkit-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
    background-image: -moz-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
    background-image: -o-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
    background-image: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
}
demand-cover:not(.not-video)::after {
    visibility: hidden;
    position: absolute;
    content: '';
    width: 40px;
    height: 40px;
    left: 50%;
    top: 50%;
    zoom: 0.9;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(2);
       -moz-transform: translate(-50%, -50%) scale(2);
        -ms-transform: translate(-50%, -50%) scale(2);
         -o-transform: translate(-50%, -50%) scale(2);
            transform: translate(-50%, -50%) scale(2);
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/37fa086920bfbdb7663e3ff7c10cc1bf.svg) no-repeat;
    z-index: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
demand-cover:hover:not(.not-video)::after {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
       -moz-transform: translate(-50%, -50%) scale(1);
        -ms-transform: translate(-50%, -50%) scale(1);
         -o-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
}
demand-card {
    overflow: hidden;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
    display: block;
    /* hack for safari border-radius bug */
    -webkit-filter: contrast(0.99);
            filter: contrast(0.99);
}
demand-card:hover demand-cover:not(.not-video)::after, demand-cover:hover:not(.not-video)::after {
    visibility: visible;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}
demand-cover douyu-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    -o-transition: -o-transform 0.3s ease-in-out;
    -moz-transition: transform 0.3s ease-in-out, -moz-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out, -moz-transform 0.3s ease-in-out, -o-transform 0.3s ease-in-out;
}
.Header[active='search'] demand-search-icon {
    display: none !important;
}
/* Generated By cn-font-split@4.11.2 https://www.npmjs.com/package/@konghayao/cn-font-split
CreateTime: Thu, 06 Feb 2025 08:52:51 GMT;
Origin File Name Table:
copyright: 2005 Albert-Jan Pool published by FSI Fonts und Software GmbH
fontFamily: DINPro-Medium
fontSubfamily: Regular
uniqueID: 7.460;FSI;DINPro-Medium
fullName: DINPro-Medium
version: Version 7.460;PS 7.046;hotconv 1.0.38
postScriptName: DINPro-Medium
trademark: DIN is a trademark of FSI Fonts und Software GmbH
manufacturer: FSI Fonts und Software GmbH
designer: Albert-Jan Pool
manufacturerURL: http://www.fontfont.com
designerURL: http://www.fontfont.com
licenseURL: http://www.fontfont.com/eula/license.html
preferredFamily: DINPro
preferredSubfamily: Medium
compatibleFullName: DINPro-Medium
 */
@font-face {
    font-family: 'DINPro-Medium';
    src: local('DINPro-Medium'), url('https://shark2.douyucdn.cn/front-publish/demand-v3-master/9c86a8036f01751b1d7b1bed6cce5d14.woff2') format('woff2');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+d, U+20-7e, U+a0-113, U+116-127, U+12a-12b, U+12e-131,
        U+134-137, U+139-13e, U+141-148, U+14c-14d, U+150-165, U+16a-173,
        U+178-17e, U+192, U+218-21b, U+237, U+2c6, U+2da, U+2dc, U+2013-2015,
        U+2018-201a, U+201c-201e, U+2020-2022, U+2026, U+2030, U+2039-203a,
        U+2044, U+20ac, U+2122, U+2191, U+2193, U+2212;
}
@font-face {
    font-family: 'DINPro-Medium';
    src: local('DINPro-Medium'), url('https://shark2.douyucdn.cn/front-publish/demand-v3-master/71955fbf4e9cee3b87b2107edb835776.woff2') format('woff2');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+2c7, U+2d8-2d9, U+2db, U+2dd, U+384-38a, U+38c, U+38e-3a1,
        U+3a3-3ce, U+3d0, U+401-40c, U+40e-44f, U+451-45c, U+45e-45f, U+490-491,
        U+2116, U+2126, U+2190, U+2192, U+2196-2199, U+2202, U+2206, U+220f,
        U+2211, U+2219-221a, U+221e, U+2224, U+2227, U+222b, U+2248, U+2260,
        U+2264-2265, U+22c5, U+25ca, U+fb01-fb02;
}
@charset 'utf-8';
:host {
    position: relative;
    pointer-events: auto;
}
.LoginInfo, .History, .UserInfo-Link {
    display: inline-block;
    vertical-align: middle;
    margin: 0 10px;
    color: inherit;
    font-size: 15px;
}
:host-context([mode='transparent']) .UserInfo-Link {
    -webkit-filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
            filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
}
:host-context(.is-Fix) .UserInfo-Link {
    -webkit-filter: none;
            filter: none;
}
.NoLogin {
    display: inline-block;
    vertical-align: middle;
}
:host-context([mode='transparent']) .NoLogin {
    -webkit-filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
            filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
}
:host-context(.is-Fix) .NoLogin {
    -webkit-filter: none;
            filter: none;
}
.NoLogin-btn {
    cursor: pointer;
    color: inherit;
    margin: 0 10px;
    font-size: 15px;
}
.NoLogin-btn:hover {
    color: #ff5d23;
    color: var(--colorA0);
}
.NoLogin-btnSplit {
    display: inline-block;
    vertical-align: middle;

    vertical-align: -2px;
    width: 1px;
    height: 13px;
    margin: 0 5px;
    background: currentColor;
    opacity: 0.4;
}
.Link-UploadBtn {
    display: inline-block;
    vertical-align: middle;

    width: 106px;
    height: 32px;
    line-height: 30px;
    text-align: center;
    margin: 0 0 0 10px;
    background-color: #ff5d23;
    background-color: var(--colorA0);
    -webkit-border-radius: 40px;
       -moz-border-radius: 40px;
            border-radius: 40px;
    font-size: 14px;
    color: #fff !important;
    color: var(--colorC0) !important;
    cursor: pointer;
}
.Link-UploadBtn:hover {
    background-color: #cc4b1c;
}
.Link-UploadIcon {
    width: 14px;
    height: 13px;
    vertical-align: -2px;
}
.LoginInfo-head, .LoginInfo-nickname {
    display: inline-block;
    vertical-align: middle;
}
.LoginInfo-DropDown {
    margin-right: 10px;
}
.LoginInfo-cont {
    display: inline-block;
    position: relative;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    margin-right: 10px;
}
.LoginInfo-avatar {
    display: block;
    overflow: hidden;
    -webkit-border-radius: 100%;
       -moz-border-radius: 100%;
            border-radius: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
}
.LoginInfo-msgNum {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 2px;
    min-width: 25px;
    font-size: 12px;
    font-size: var(--fontSize);
    line-height: 16px;
    -webkit-border-radius: 3em;
       -moz-border-radius: 3em;
            border-radius: 3em;
    -webkit-transform: translate(50%, 0);
       -moz-transform: translate(50%, 0);
        -ms-transform: translate(50%, 0);
         -o-transform: translate(50%, 0);
            transform: translate(50%, 0);
    background: #ff5d23;
    background: var(--colorA0);
    color: #fff;
    color: var(--colorC0);
    font-family: Helvetica, Arial, sans-serif;
    text-align: center;
}
.Menu {
    overflow: hidden;
    padding: 0 15px 15px;
    min-width: 100px;
}
.MenuItem {
    display: block;
    margin-top: 15px;
    line-height: 16px;
    cursor: pointer;
    text-align: center;
}
.LoginMenu-text {
    position: relative;
}
.Badge {
    position: absolute;
    bottom: 100%;
    left: 100%;
    -webkit-transform: translate(0, 50%);
       -moz-transform: translate(0, 50%);
        -ms-transform: translate(0, 50%);
         -o-transform: translate(0, 50%);
            transform: translate(0, 50%);
    white-space: nowrap;
    width: 25px;
    background: #ff5d23;
    background: var(--colorA0);
    -webkit-border-radius: 20px;
       -moz-border-radius: 20px;
            border-radius: 20px;
    font-size: 12px;
    color: #fff;
    color: var(--colorC0);
    font-style: normal;
    line-height: 16px;
    text-align: center;
}
.Menu-Additional {
    border-top: 1px solid #ddd;
}
.Logout {
    display: block;
    width: 100%;
    padding: 4px 0;
    border: none;
    background: none;
    cursor: pointer;
    text-align: center;
}
.LoginInfo-panel {
    position: absolute;
    top: 46px;
    left: -102px;
    right: -102px;
    z-index: 1;
    display: none;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1), 0 1px 4px 0 rgba(0, 0, 0, 0.2);
       -moz-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1), 0 1px 4px 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1), 0 1px 4px 0 rgba(0, 0, 0, 0.2);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-top: 46px;
}
.LoginInfo-cont:hover .LoginInfo-avatar {
    -webkit-transform: scale(1.8);
       -moz-transform: scale(1.8);
        -ms-transform: scale(1.8);
         -o-transform: scale(1.8);
            transform: scale(1.8);
    top: 24px;
    -webkit-transition: top 0.3s linear;
    -o-transition: top 0.3s linear;
    -moz-transition: top 0.3s linear;
    transition: top 0.3s linear;
    z-index: 2;
}
.LoginInfo-cont:hover .LoginInfo-panel {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.LoginInfo-panelAvatar {
    position: absolute;
    width: 70px;
    height: 70px;
    left: 50%;
    margin-left: -35px;
    top: -35px;
}
.LoginInfo-panelAvatar douyu-avatar {
    display: block;
    height: 100%;
    overflow: hidden;
    -webkit-border-radius: 100%;
       -moz-border-radius: 100%;
            border-radius: 100%;
}
.LoginInfo-panelNick {
    margin-bottom: 15px;
    color: #222;
    width: 80%;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    height: 22px;
    line-height: 22px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
}
.LoginInfo-panelInfo {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
    -webkit-justify-content: space-evenly;
       -moz-box-pack: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly;
    /* pointer-events: none; */
}
.LoginInfo-panelInfo .following, .LoginInfo-panelInfo .follower {
    cursor: pointer;
    text-align: center;
}
.LoginInfo-panelInfo .following:hover .f-title, .LoginInfo-panelInfo .following:hover .f-content, .LoginInfo-panelInfo .follower:hover .f-title, .LoginInfo-panelInfo .follower:hover .f-content {
    color: #ff5d23;
}
.LoginInfo-panelInfo .f-title {
    margin-bottom: 4px;
    font-size: 12px;
    color: #999;
    line-height: 17px;
    height: 17px;
}
.LoginInfo-panelInfo .f-content {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    color: #333;
    line-height: 20px;
    height: 20px;
}
.LoginInfo-panelLine {
    border-bottom: 1px solid #e7e7e7;
    width: 100%;
}
.LoginInfo-panelItem {
    color: #333;
    height: 48px;
    line-height: 48px;
    font-size: 14px;
    padding: 0 10%;
    text-align: left;
    cursor: pointer;
    width: 100%;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.LoginInfo-panelItem svg {
    color: #999;
    width: 22px;
    height: 22px;
    margin-right: 10px;
}
.LoginInfo-panelItem:hover {
    color: #f70;
}
.LoginInfo-panelItem:hover > svg {
        color: #f70;
    }
:root {
    --nav-font-size: 15px;
}
.Header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #fff;
    background: var(--colorC0);
    color: #666;
    color: var(--colorB2);
    height: 62px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    padding: 13px 48px;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
       -moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
            box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    white-space: nowrap;
    z-index: 1500;
    -webkit-transform: translate(0, 0);
       -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
         -o-transform: translate(0, 0);
            transform: translate(0, 0);
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
    pointer-events: none;
}
.Header[mode='transparent'] {
    position: absolute;
    background: transparent;
    -webkit-box-shadow: unset;
       -moz-box-shadow: unset;
            box-shadow: unset;
    color: #fff;
    color: var(--colorC0);
}
.Header[active='author'] {
    position: relative;
}
.Header.is-Fix {
    position: fixed;
    background: #fff;
    background: var(--colorC0);
    color: #666;
    color: var(--colorB2);
    -webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1), 0 1px 4px 0 rgba(0, 0, 0, 0.2);
       -moz-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1), 0 1px 4px 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1), 0 1px 4px 0 rgba(0, 0, 0, 0.2);
    -webkit-animation: slideDownMid cubic-bezier(0.47, 0, 0.75, 0.72) 0.3s forwards;
       -moz-animation: slideDownMid cubic-bezier(0.47, 0, 0.75, 0.72) 0.3s forwards;
         -o-animation: slideDownMid cubic-bezier(0.47, 0, 0.75, 0.72) 0.3s forwards;
            animation: slideDownMid cubic-bezier(0.47, 0, 0.75, 0.72) 0.3s forwards;
}
.Header-Main {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    pointer-events: auto;
}
.Header.is-Fix .Logo, .Logo {
    display: inline-block;
    vertical-align: middle;
    width: 143px;
    height: 32px;
    margin: 0 14px 0 0;
    -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
            flex-shrink: 0;
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/f29f611d26d0b66e8d36453e89aa3e90.png) center/cover no-repeat;
}
[mode='transparent'] .Logo {
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/c1bf262ae4ad118a06eb6d656da2bef8.png) center/cover no-repeat;
}
.Header.is-Fix .Nav {
    display: inline-block;
    vertical-align: middle;
    -webkit-filter: none;
            filter: none;
}
[mode='transparent'] .Nav {
    -webkit-filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
            filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
}
.Nav-Item {
    position: relative;
    display: inline-block;
    font-size: 15px;
    font-size: var(--nav-font-size);
    padding: 0 10px;
    cursor: pointer;
}
.Nav-Split {
    display: inline-block;
    width: 1px;
    height: 13px;
    margin: 0 6px;
    background: currentColor;
    opacity: 0.4;
    vertical-align: -1px;
}
.Nav-Item:first-child {
    padding-left: 8px;
}
.Nav-Link {
    color: currentColor;
}
.Header .Nav-Link:hover, .is-active .Nav-Link {
    color: #ff5d23;
    color: var(--colorA0);
}
.Nav-Link svg {
    width: 16px;
    height: 16px;
    vertical-align: -2px;
}
.PrivateLetterFrame {
    display: none;
    visibility: hidden;
    width: 750px;
    height: 550px;
    position: fixed;
    left: -750px;
    bottom: -550px;
    pointer-events: none;
}
.PrivateLetterFrame.is-active {
    visibility: show;
    pointer-events: auto;
}
.Header:not([mode='transparent']) demand-search-box::part(search-input), .is-Fix demand-search-box::part(search-input) {
    border: 1px solid #ccc;
    border: 1px solid var(--colorC3);
}
/**
 * Swiper 6.4.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2021 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: January 29, 2021
 */
@font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA') format('woff');font-weight:400;font-style:normal}
:root{--swiper-theme-color:#007aff}
.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}
.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-direction:column;flex-direction:column}
.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:-o-transform;-moz-transition-property:transform, -moz-transform;transition-property:transform;transition-property:transform, -webkit-transform, -moz-transform, -o-transform;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}
.swiper-container-android .swiper-slide, .swiper-wrapper{-webkit-transform:translate3d(0px,0,0);-moz-transform:translate3d(0px,0,0);transform:translate3d(0px,0,0)}
.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}
.swiper-container-multirow-column>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-direction:column;flex-direction:column}
.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}
.swiper-container-pointer-events{-ms-touch-action:pan-y;touch-action:pan-y}
.swiper-container-pointer-events.swiper-container-vertical{-ms-touch-action:pan-x;touch-action:pan-x}
.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:-o-transform;-moz-transition-property:transform, -moz-transform;transition-property:transform;transition-property:transform, -webkit-transform, -moz-transform, -o-transform}
.swiper-slide-invisible-blank{visibility:hidden}
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide{height:auto}
.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-moz-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:height,-o-transform;-moz-transition-property:transform,height,-moz-transform;transition-property:transform,height;transition-property:transform,height,-webkit-transform,-moz-transform,-o-transform}
.swiper-container-3d{-webkit-perspective:1200px;-moz-perspective:1200px;perspective:1200px}
.swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d}
.swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}
.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,right top, left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,left top, right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left bottom, left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-container-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}
.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}
.swiper-container-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}
.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper{-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory}
.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper{-webkit-scroll-snap-type:y mandatory;-ms-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory}
:root{--swiper-navigation-size:44px}
.swiper-button-next, .swiper-button-prev{position:absolute;top:50%;width:-webkit-calc(44px/ 44 * 27);width:-moz-calc(44px/ 44 * 27);width:calc(44px/ 44 * 27);width:-webkit-calc(var(--swiper-navigation-size)/ 44 * 27);width:-moz-calc(var(--swiper-navigation-size)/ 44 * 27);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:44px;height:var(--swiper-navigation-size);margin-top:-webkit-calc(-1 * 44px/ 2);margin-top:-moz-calc(-1 * 44px/ 2);margin-top:calc(-1 * 44px/ 2);margin-top:-webkit-calc(-1 * var(--swiper-navigation-size)/ 2);margin-top:-moz-calc(-1 * var(--swiper-navigation-size)/ 2);margin-top:calc(-1 * var(--swiper-navigation-size)/ 2);z-index:10;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;color:var(--swiper-theme-color);color:var(--swiper-navigation-color,var(--swiper-theme-color))}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}
.swiper-button-next:after, .swiper-button-prev:after{font-family:swiper-icons;font-size:44px;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;text-transform:none;-webkit-font-feature-settings:normal, ;-moz-font-feature-settings:normal, ;font-feature-settings:normal, ;font-variant:normal;font-variant:initial;line-height:1}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{left:10px;right:auto}
.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after{content:'prev'}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev{right:10px;left:auto}
.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after{content:'next'}
.swiper-button-next.swiper-button-white, .swiper-button-prev.swiper-button-white{--swiper-navigation-color:#ffffff}
.swiper-button-next.swiper-button-black, .swiper-button-prev.swiper-button-black{--swiper-navigation-color:#000000}
.swiper-button-lock{display:none}
.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;-moz-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}
.swiper-pagination.swiper-pagination-hidden{opacity:0}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom:10px;left:0;width:100%}
.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-moz-transform:scale(.33);-ms-transform:scale(.33);-o-transform:scale(.33);transform:scale(.33);position:relative}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-moz-transform:scale(.66);-ms-transform:scale(.66);-o-transform:scale(.66);transform:scale(.66)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-moz-transform:scale(.33);-ms-transform:scale(.33);-o-transform:scale(.33);transform:scale(.33)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-moz-transform:scale(.66);-ms-transform:scale(.66);-o-transform:scale(.66);transform:scale(.66)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-moz-transform:scale(.33);-ms-transform:scale(.33);-o-transform:scale(.33);transform:scale(.33)}
.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background:#000;opacity:.2}
button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}
.swiper-pagination-bullet-active{opacity:1;background:var(--swiper-theme-color);background:var(--swiper-pagination-color,var(--swiper-theme-color))}
.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0px,-50%,0);-moz-transform:translate3d(0px,-50%,0);transform:translate3d(0px,-50%,0)}
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);width:8px}
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s transform,.2s top;-o-transition:.2s transform,.2s top;-moz-transition:.2s transform,.2s top;transition:.2s transform,.2s top}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s transform,.2s left;-o-transition:.2s transform,.2s left;-moz-transition:.2s transform,.2s left;transition:.2s transform,.2s left}
.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s transform,.2s right;-o-transition:.2s transform,.2s right;-moz-transition:.2s transform,.2s right;transition:.2s transform,.2s right}
.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-theme-color);background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;transform-origin:left top}
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-moz-transform-origin:right top;-ms-transform-origin:right top;-o-transform-origin:right top;transform-origin:right top}
.swiper-container-horizontal>.swiper-pagination-progressbar, .swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}
.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}
.swiper-pagination-white{--swiper-pagination-color:#ffffff}
.swiper-pagination-black{--swiper-pagination-color:#000000}
.swiper-pagination-lock{display:none}
.swiper-scrollbar{-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}
.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}
.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}
.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;left:0;top:0}
.swiper-scrollbar-cursor-drag{cursor:move}
.swiper-scrollbar-lock{display:none}
.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;text-align:center}
.swiper-zoom-container>canvas, .swiper-zoom-container>img, .swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}
.swiper-slide-zoomed{cursor:move}
.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-moz-transform-origin:50%;-ms-transform-origin:50%;-o-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s infinite linear;-moz-animation:swiper-preloader-spin 1s infinite linear;-o-animation:swiper-preloader-spin 1s infinite linear;animation:swiper-preloader-spin 1s infinite linear;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:4px solid var(--swiper-theme-color);border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;border-top-color:transparent}
.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}
.swiper-lazy-preloader-black{--swiper-preloader-color:#000}
@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
@-moz-keyframes swiper-preloader-spin{100%{-moz-transform:rotate(360deg);transform:rotate(360deg)}}
@-o-keyframes swiper-preloader-spin{100%{-o-transform:rotate(360deg);transform:rotate(360deg)}}
@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}
.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}
.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}
.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;-moz-transition-property:opacity;transition-property:opacity}
.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}
.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}
.swiper-container-cube{overflow:visible}
.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-ms-transform-origin:0 0;-o-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}
.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}
.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-moz-transform-origin:100% 0;-ms-transform-origin:100% 0;-o-transform-origin:100% 0;transform-origin:100% 0}
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next+.swiper-slide, .swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}
.swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}
.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}
.swiper-container-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;-webkit-filter:blur(50px);filter:blur(50px)}
.swiper-container-flip{overflow:visible}
.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;z-index:1}
.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}
.swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}
.swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}
:root {
    --bannerHeight: 180px;
}
.Home-Banner {
    overflow: hidden;
    position: relative;
    display: block;
    width: 100%;
    height: 180px;
    height: var(--bannerHeight);
    background: #ddd;
    background: var(--colorBlockBackground);
    z-index: 1;
}
.Home-Banner-Holder {
    position: absolute;
    width: 100%;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
       -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
         -o-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    height: 100%;
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/a88970134c362935854b9e7db6477952.png) center/cover no-repeat;
    -webkit-filter: blur(2px);
            filter: blur(2px);
    -webkit-transition: -webkit-filter 0.2s;
    transition: -webkit-filter 0.2s;
    -o-transition: filter 0.2s;
    -moz-transition: filter 0.2s;
    transition: filter 0.2s;
    transition: filter 0.2s, -webkit-filter 0.2s;
}
.Home-Banner::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    height: 84px;
    background-image: -webkit-gradient(
        linear,
        left top, left bottom,
        color-stop(12%, rgba(0, 0, 0, 0.4)),
        to(rgba(0, 0, 0, 0))
    );
    background-image: -webkit-linear-gradient(
        top,
        rgba(0, 0, 0, 0.4) 12%,
        rgba(0, 0, 0, 0) 100%
    );
    background-image: -moz-linear-gradient(
        top,
        rgba(0, 0, 0, 0.4) 12%,
        rgba(0, 0, 0, 0) 100%
    );
    background-image: -o-linear-gradient(
        top,
        rgba(0, 0, 0, 0.4) 12%,
        rgba(0, 0, 0, 0) 100%
    );
    background-image: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.4) 12%,
        rgba(0, 0, 0, 0) 100%
    );
    z-index: 1;
}
body {
    min-width: 1062px;
}
.Layout-Main {
    max-width: 1062px;
    -webkit-transition: width 0.3s;
    -o-transition: width 0.3s;
    -moz-transition: width 0.3s;
    transition: width 0.3s;
    margin: 0 auto;
    padding-top: 60px;
}
.layout-Floor {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 12px;
}
.layout-FloorMain {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.Home-Rank {
    width: 335px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 24px;
}
demand-home-nav {
    display: block;
    min-height: 72px;
    margin: 30px 0 18px 0;
}
home-rank-list {
    width: 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
demand-home-uplist {
    display: block;
    margin: 10px 0 20px;
}
demand-floor-mod {
    position: relative;
    display: block;
    min-height: 452px;
}
.layout-Floor-Empty {
    position: absolute;
    width: 64px;
    height: 93px;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/5282279d6abfa711df0a6e03ddc9f038.png) center/cover no-repeat;
}
.layout-Floor-Loadding {
    position: absolute;
    width: 200px;
    height: 160px;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/bf48eaaf08c07fb5050f086541edbf3d.gif) center/cover no-repeat;
}
.layout-Lift {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.layout-LiftHolder.is-Left {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.layout-LiftHolder.is-Right {
    width: 0;
}
.Home-Hot {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 24px 0;
    height: 198px;
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
            backface-visibility: hidden;
}
.Home-HotSlider {
    position: relative;
    overflow: hidden;
    width: 344px;
    background: #ddd;
    background: var(--colorBlockBackground);
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
}
.Home-HotSlider demand-home-swiper {
    height: 0;
    padding-bottom: 57.5%;
    position: relative;
    display: block;
}
demand-home-rec-video {
    position: relative;
    margin: -10px 0 0 12px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.Home-HotList {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    margin: 0 0 0 -12px;
    -webkit-box-pack: start;
    -webkit-justify-content: start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
       -moz-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    text-align: left;
}
.Home-HotItem {
    width: -webkit-calc(100% / 4 - 12px);
    width: -moz-calc(100% / 4 - 12px);
    width: calc(100% / 4 - 12px);
    margin: 10px 0 0 12px;
}
.Home-HotItem > a {
    display: block;
}
.Home-HotItem:hover {
    -webkit-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
       -moz-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
            box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
}
.Home-HotItem:nth-child(n + 9) {
    display: none;
}
.Home-HotItem .Cover-Title {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;

    padding-bottom: 2px;
    color: #fff;
}
.HotItem-MoreInfo {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 6px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
       -moz-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    z-index: 2;
    -webkit-filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
            filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
}
.Home-HotItem:hover .HotItem-MoreInfo {
    top: 0;
    background: rgba(0, 0, 0, 0.68);
}
.HotItem-AnchorInfo {
    width: 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.HotItem-MoreInfoDetail .Icon-Play {
    width: 30px;
    height: 30px;
    margin-left: 10px;
}
.HotItem-MoreInfoDetail {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 8px 12px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-transform: translate(0, 100%);
       -moz-transform: translate(0, 100%);
        -ms-transform: translate(0, 100%);
         -o-transform: translate(0, 100%);
            transform: translate(0, 100%);
    pointer-events: none;
    z-index: 2;
    -webkit-transition: -webkit-transform 0.4s;
    transition: -webkit-transform 0.4s;
    -o-transition: -o-transform 0.4s;
    -moz-transition: transform 0.4s, -moz-transform 0.4s;
    transition: transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s, -moz-transform 0.4s, -o-transform 0.4s;
}
.Home-HotItem:hover .HotItem-MoreInfoDetail {
    -webkit-transform: translate(0, 0);
       -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
         -o-transform: translate(0, 0);
            transform: translate(0, 0);
}
.Home-HotItem:hover .Cover-Title {
    display: none;
}
.HotItem-MoreInfoDetailTitle {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    font-size: 14px;
    word-break: break-all;
    color: #fff;
    color: var(--colorC0);
}
.HotItem-MoreInfoDetailPanel {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-right: 28px;
}
.HotItem-MoreInfoDetailPanel demand-watch-later {
        position: absolute;
        right: 6px;
        bottom: 6px;
        display: block;
    }
.HotItem-AnchorInfo {
    width: 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    color: #ccc;
    color: var(--colorC3);
}
.HotItem-AnchorInfo .Cover-Anchor {
    color: #ccc;
    color: var(--colorC3);
}
.swiper-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.swiper-wrapper-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 48px;
    background-image: -webkit-gradient(
        linear,
        left top, left bottom,
        from(rgba(0, 0, 0, 0)),
        to(rgba(0, 0, 0, 0.4))
    );
    background-image: -webkit-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.4) 100%
    );
    background-image: -moz-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.4) 100%
    );
    background-image: -o-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.4) 100%
    );
    background-image: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.4) 100%
    );
    z-index: 10;
    color: #fff;
    padding: 6px 12px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    word-break: break-all;
    font-size: 14px;
    -webkit-filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
            filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
    pointer-events: none;
}
.swiper-wrapper-text-inner {
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;

    -webkit-box-flex: 1;

    -webkit-flex: 1;

       -moz-box-flex: 1;

        -ms-flex: 1;

            flex: 1;
    width: 0;
    margin-right: 12px;
    pointer-events: none;
}
.swiper-slide {
    overflow: hidden;
    text-align: center;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
demand-home-rec-video .swiper-slide {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
       -moz-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}
.swiper-button-prev {
    left: 0;
    -webkit-border-radius: 0 4px 4px 0;
       -moz-border-radius: 0 4px 4px 0;
            border-radius: 0 4px 4px 0;
}
.swiper-button-next {
    right: 0;
    -webkit-border-radius: 4px 0 0 4px;
       -moz-border-radius: 4px 0 0 4px;
            border-radius: 4px 0 0 4px;
}
.swiper-button-next, .swiper-button-prev {
    position: absolute;
    width: 22px;
    height: 59px;
    top: 50%;
    margin: 0;
    background: rgba(0, 0, 0, 0.4);
    color: #fff;
    color: var(--colorC0);
    -webkit-transform: translate(0, -50%);
       -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
         -o-transform: translate(0, -50%);
            transform: translate(0, -50%);
}
.swiper-button-next:hover, .swiper-button-prev:hover {
    color: #ff5d23;
    color: var(--colorA0);
}
.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 14px;
    content: '';
}
.swiper-slide douyu-img {
    min-width: 100%;
    min-height: 100%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    position: absolute;
    left: 50%;
    top: 50%;
}
.Home-HotSlider .swiper-pagination {
    position: relative;
    margin-bottom: 4px;
    pointer-events: auto;
}
.swiper-pagination-bullet {
    width: 4px;
    height: 4px;
    vertical-align: bottom;
    margin: 0 2px;
    opacity: 1;
    background: #fff;
    background: var(--colorC0);
    border: 1px solid #fff;
    border: 1px solid var(--colorC0);
    -webkit-transition: width 0.1s;
    -o-transition: width 0.1s;
    -moz-transition: width 0.1s;
    transition: width 0.1s;
}
.swiper-pagination-bullet:hover {
    background: #ff5d23;
    background: var(--colorA0);
}
.swiper-pagination-bullet-active {
    width: 16px;
    height: 18px;
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/acb8e105de4c7d05114bff9ba837dc28.png) center/cover no-repeat;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
            border-radius: 0;
    border: 0;
}
.swiper-pagination-bullet-active:hover {
    background: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/acb8e105de4c7d05114bff9ba837dc28.png) center/cover no-repeat;
}
.swiper-lazy-preloader {
    display: none;
}
.swiper-container-horizontal > .swiper-pagination-bullets {
    left: auto;
    width: auto;
    right: 12px;
    bottom: 12px;
}
.swiper-button-disabled {
    opacity: 0 !important;
    pointer-events: none !important;
}
.Home-HotItem demand-cover::before {
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    bottom: 0;
    height: 48px;
    z-index: 1;
    background-image: -webkit-gradient(
        linear,
        left top, left bottom,
        from(rgba(0, 0, 0, 0)),
        to(rgba(0, 0, 0, 0.6))
    );
    background-image: -webkit-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
    background-image: -moz-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
    background-image: -o-linear-gradient(
        top,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
    background-image: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 100%
    );
}
.Home-BlockTitle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 20px 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.BlockTitle-Icon {
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0, -50%);
       -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
         -o-transform: translate(0, -50%);
            transform: translate(0, -50%);
    -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
            border-radius: 8px;
    width: 36px;
    height: 36px;
}
.BlockTitle-Label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.BlockTitle-Label [slot='label'] {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.BlockTitle-Label [slot='addons'] {
    white-space: nowrap;
}
.Cover-Title {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    font-size: 14px;
    line-height: 19px;
    word-break: break-all;
}
.Home-CoverList .Cover-Title {
    min-height: 38px;
}
.BlockTitle-Action {
    white-space: nowrap;
    font-size: 0;
}
.Home-Label {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;

    font-size: 26px;
    margin: 0 6px 0 42px;
}
.Home-Btn {
    display: inline-block;
    vertical-align: middle;

    margin: 0 6px;
    border: 1px solid #d3ded3;
    border: 1px solid var(--colorC2);
    padding: 2px 10px;
    min-width: 52px;
    -webkit-border-radius: 10em;
       -moz-border-radius: 10em;
            border-radius: 10em;
    text-align: center;
    cursor: pointer;
    font-size: 12px;
    color: #999;
    color: var(--colorB3);
}
.Home-Btn:hover {
    color: #fff;
    color: var(--colorC0);
    background: #ff5d23;
    background: var(--colorA0);
    border-color: #ff5d23;
    border-color: var(--colorA0);
}
.Home-Tags {
    font-size: 0;
}
.Home-Tags .Home-Btn:nth-child(n) {
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    max-width: 100px;
}
.Home-Tags .Home-Btn:nth-child(n + 5) {
    display: none;
}
.Home-Tags .Home-Btn:hover {
    color: #ff5d23;
    color: var(--colorA0);
    background: transparent;
}
.Home-Btn:hover svg {
    color: #fff;
    color: var(--colorC0);
}
.Home-Btn svg {
    color: #ff5d23;
    color: var(--colorA0);
}
.Home-Btn:hover .Icon-Change {
    -webkit-transform: rotate(90deg);
       -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
         -o-transform: rotate(90deg);
            transform: rotate(90deg);
}
.Home-CoverList {
    margin: -20px 0 0 -12px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.Home-CoverItem {
    overflow: hidden;
    width: -webkit-calc(100% / 4 - 12px);
    width: -moz-calc(100% / 4 - 12px);
    width: calc(100% / 4 - 12px);
    margin: 18px 0 0 12px;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
       -moz-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    -webkit-transition: -webkit-box-shadow 0.3s ease-in-out;
    transition: -webkit-box-shadow 0.3s ease-in-out;
    -o-transition: box-shadow 0.3s ease-in-out;
    -moz-transition: box-shadow 0.3s ease-in-out, -moz-box-shadow 0.3s ease-in-out;
    transition: box-shadow 0.3s ease-in-out;
    transition: box-shadow 0.3s ease-in-out, -webkit-box-shadow 0.3s ease-in-out, -moz-box-shadow 0.3s ease-in-out;
}
.Home-CoverItem:hover {
    -webkit-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
       -moz-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
            box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
}
.Home-CoverItem:hover .Cover-VideoInfo {
    visibility: hidden;
}
.Home-CoverItem [slot='info'] {
    padding: 6px;
}
.Home-CoverItem:nth-child(n + 9) {
    display: none;
}
.is-Full .Home-CoverItem:nth-child(n) {
    display: block;
    width: -webkit-calc(100% / 6 - 12px);
    width: -moz-calc(100% / 6 - 12px);
    width: calc(100% / 6 - 12px);
}
.is-Full .Home-CoverItem:nth-child(n + 13) {
    display: none;
}
.Cover-VideoInfo {
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    color: #fff;
    color: var(--colorC0);
    bottom: 6px;
    right: 6px;
    left: 6px;
    z-index: 2;
    height: 17px;
    overflow: hidden;
    -webkit-filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
            filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.3));
}
.Cover-VideoNums {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 0;
    white-space: nowrap;
}
.Cover-VideoNumPlay {
    margin-right: 12px;
    font-size: 12px;
}
.Cover-VideoDuration, .Cover-VideoNumZan {
    font-size: 12px;
}
.Cover-Anchor-box {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
       -moz-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
.Home-Card:hover .Cover-Anchor {
        margin-right: 24px;
    }
.Home-Card:hover demand-watch-later {
        display: block;
        position: absolute;
        right: 0;
        bottom: 0;
    }
.Cover-Anchor {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    color: #999;
    color: var(--colorB3);
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    margin-right: 5px;
}
.Home-CoverItem:hover demand-cover:not(.not-video) douyu-img {
    -webkit-transform: scale(1.2);
       -moz-transform: scale(1.2);
        -ms-transform: scale(1.2);
         -o-transform: scale(1.2);
            transform: scale(1.2);
}
.Home-RecommandList {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-left: -12px;
}
.Home-RecommandItem:nth-child(n) {
    width: 0;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 -webkit-calc(100% / 6 - 12px);
       -moz-box-flex: 0;
        -ms-flex: 0 0 calc(100% / 6 - 12px);
            flex: 0 0 calc(100% / 6 - 12px);
    margin-left: 12px;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.21);
       -moz-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.21);
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.21);
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}
.Home-RecommandItem:nth-child(n + 7) {
    display: none;
}
.Home-RecommandItem:hover {
    overflow: hidden;
    -webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);

    -webkit-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);

       -moz-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);

            box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
}
.Home-RecommandItem:first-child {
    -webkit-transform-origin: 5% 50%;
       -moz-transform-origin: 5% 50%;
        -ms-transform-origin: 5% 50%;
         -o-transform-origin: 5% 50%;
            transform-origin: 5% 50%;
    position: relative;
    z-index: 2;
}
.Home-RecommandItem:nth-child(6) {
    position: relative;
    z-index: 2;
    -webkit-transform-origin: 100% 50%;
       -moz-transform-origin: 100% 50%;
        -ms-transform-origin: 100% 50%;
         -o-transform-origin: 100% 50%;
            transform-origin: 100% 50%;
}
.Home-RecommandItem demand-cover {
    padding-bottom: 100%;
}
.Home-RecommandItem .Cover-Title {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    margin: 12px;
    text-align: center;
}
.Home-Recommand {
    position: relative;
}
.Home-RecommandBtn {
    position: absolute;
    z-index: 10;
    top: 50%;
    width: 22px;
    height: 59px;
    -webkit-transform: translate(0, -50%);
       -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
         -o-transform: translate(0, -50%);
            transform: translate(0, -50%);
    margin-top: -24px;
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
    color: #fff;
}
.Home-RecommandBtn:hover {
    color: #ff5d23;
    color: var(--colorA0);
}
.Home-RecommandBtn.is-Prev {
    left: 0;
    -webkit-border-radius: 0 8px 8px 0;
       -moz-border-radius: 0 8px 8px 0;
            border-radius: 0 8px 8px 0;
}
.Home-RecommandBtn.is-Next {
    right: 0;
    -webkit-border-radius: 8px 0 0 8px;
       -moz-border-radius: 8px 0 0 8px;
            border-radius: 8px 0 0 8px;
}
#recommand-slide-button-prev, #recommand-slide-button-next {
    visibility: hidden;
    pointer-events: none;
    margin: 5px 0 0 0;
}
demand-home-rec-video:hover #recommand-slide-button-prev, demand-home-rec-video:hover #recommand-slide-button-next {
    visibility: visible;
    pointer-events: auto;
}
.Home-CategroyIcon {
    overflow: hidden;
    display: block;
    width: 32px;
    height: 32px;
    margin: 3px auto 0;
    -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
            border-radius: 8px;
    text-align: center;
}
.Home-CategroyChildIcon {
    width: 30px;
    height: 30px;
    margin-right: 10px;
}
.Home-CategroyList {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 12px 0;
    z-index: 10;
}
.Home-CategroyChildList {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-flow: row wrap;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap;
    -webkit-writing-mode: vertical-lr;
        -ms-writing-mode: tb-lr;
            writing-mode: vertical-lr;
    padding: 6px;
    max-height: 114px;
    text-align: left;
}
.Home-CategroyLink {
    display: block;
}
.Home-Categroy > .Home-CategroyLink {
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
}
.Home-CategroyChildLink {
    display: block;
    height: 20px;
    line-height: 20px;
    margin: 4px 6px;
    -webkit-writing-mode: horizontal-tb;
        -ms-writing-mode: lr-tb;
            writing-mode: horizontal-tb;
}
.Home-Categroy {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: -webkit-calc(100% / 14);
    width: -moz-calc(100% / 14);
    width: calc(100% / 14);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.Home-Categroy > .Home-CategroyLink, .Home-Categroy demand-home-nav-dropdown {
    display: block;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    padding: 0 5px;
    width: 100%;
}
.Home-Categroy demand-home-nav-dropdown::part(label) {
    display: block;
}
.Home-Categroy:nth-child(n + 15) {
    display: none;
}
.Home-CategroyLabel {
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    padding: 3px 5px;
    margin: 10px 0 0;
    background: #f4f5f9;
    background: var(--colorC1);
    color: #333;
    color: var(--colorB1);
    -webkit-border-radius: 2em;
       -moz-border-radius: 2em;
            border-radius: 2em;
    text-align: center;
    font-weight: 400;
    font-size: 12px;
}
.Home-CategroyLink:hover .Home-CategroyLabel {
    background-color: #ff5d23;
    background-color: var(--colorA0);
    color: #fff;
    color: var(--colorC0);
}
.Home-CategroyChildLabel {
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;

    font-size: 13px;
    font-weight: 400;
}
.Home-Up {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 55;
}
.Home-UpList {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    margin-left: -12px;
}
.Home-UpItem-Wrapper:nth-child(n) {
    position: relative;
    width: 0;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 -webkit-calc(100% / 6 - 12px);
       -moz-box-flex: 0;
        -ms-flex: 0 0 calc(100% / 6 - 12px);
            flex: 0 0 calc(100% / 6 - 12px);
    height: 118px;
    margin-left: 12px;
}
.Home-UpItem-Wrapper:nth-child(n + 7) {
    display: none;
}
.UpAnchor-Item {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border: 1px solid #ebe8e8;
    -webkit-border-radius: 13px;
       -moz-border-radius: 13px;
            border-radius: 13px;
    background: #fff;
    background: var(--colorC0);
}
.UpAnchor-AvatarGroup {
    position: relative;
    margin: 0 6px 0 0;
}
.Home-UpItem .UpAnchor-Avatar {
    overflow: hidden;
    display: block;
    width: 40px;
    height: 40px;
    -webkit-border-radius: 100%;
       -moz-border-radius: 100%;
            border-radius: 100%;
}
.UpAnchor-Label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 12px;
}
.UpAnchor-Label .anchor-auth {
    position: absolute;
    width: 11px;
    height: 11px;
    background: transparent center/100% 100% no-repeat;
    right: 0;
    bottom: 0;
}
.UpAnchor-Label .auth1 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/e1eaf71ef66e4618cf400e97905a341e.svg);
}
.UpAnchor-Label .auth2 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/1498d4e29114e8d27e7687fcfd23afca.svg);
}
.UpAnchor-Label .auth3 {
    background-image: url(https://shark2.douyucdn.cn/front-publish/demand-v3-master/f24821a5a700691c3e8bb86d0c7a533e.svg);
}
.UpAnchor-Info {
    width: 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1 auto;
       -moz-box-flex: 1;
        -ms-flex: 1 auto;
            flex: 1 auto;
}
.UpAnchor-Description {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    margin: 12px;
    min-height: 34px;
    color: #999;
    color: var(--colorB3);
    word-break: break-all;
}
.UpAnchor-Title {
}
.UpAnchor-FollowBtn.is-follow {
    background: #f4f5f9 !important;
    color: #999 !important;
}
.UpAnchor-Name {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 500;
    color: #1e1e1e;
}
.UpAnchor-VideoList, .UpAnchor-MoreInfo {
    display: none;
}
.Home-UpItem.is-hover .UpAnchor-Item {
    width: 280px;
    -webkit-border-radius: 16px;
       -moz-border-radius: 16px;
            border-radius: 16px;
    -webkit-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
       -moz-box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
            box-shadow: 0 3px 21px 0 rgba(0, 0, 0, 0.21);
    z-index: 1;
}
.Home-UpItem.is-hover .UpAnchor-MoreInfo {
    display: block;
    overflow: hidden;
    margin: 12px;
    color: #1e1e1e;
    white-space: nowrap;
}
.UpAnchor-MoreInfoItem {
    display: inline-block;
    vertical-align: middle;

    position: relative;
    margin-right: 12px;
}
.UpAnchor-MoreInfoItem strong {
    font-weight: 400;
}
.Home-UpItem.is-hover .UpAnchor-Description {
    min-height: 17px;
}
.Home-UpItem .UpAnchor-FollowBtn {
    display: block;
    width: 50px;
    height: 20px;
    border: 0;
    -webkit-border-radius: 10em;
       -moz-border-radius: 10em;
            border-radius: 10em;
    margin: 5px 0 0 0;
    background: #ff5d23;
    background: var(--colorA0);
    color: #fff;
    color: var(--colorC0);
    cursor: pointer;
}
.Home-UpItem.is-hover .UpAnchor-FollowBtn:hover {
    background: #cc4b1c;
}
.Home-UpItem.is-hover .UpAnchor-VideoList {
    display: block;
    margin: 0 12px 12px;
    padding-top: 12px;
    border-top: 1px solid #e8e8e8;
}
.UpAnchor-VideoItem {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.UpAnchor-VideoItem .UpAnchor-VideoCover {
    width: 80px;
    margin-right: 12px;
}
.UpAnchor-VideoItemInfo {
    width: 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.UpAnchor-VideoItemInfo .VideoItemInfo-Title {
    height: 35px;

    overflow: hidden;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 2;

    -o-text-overflow: ellipsis;

       text-overflow: ellipsis;
}
.UpAnchor-VideoItemInfo .VideoItemInfo-Time {
    color: #999;
    color: var(--colorB3);
    font-weight: normal;
}
.Footer {
    background: #3f3f3f;
    text-align: center;
    padding: 20px 0;
    color: #bbb;
    margin-top: 64px;
    -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
            align-self: stretch;
}
.Footer a {
    color: #bbb;
    vertical-align: middle;
}
.Footer h4 {
    text-align: left;
    font-size: 16px;
    color: #fff;
    margin-bottom: 20px;
}
.Footer-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
            align-content: space-between;
    margin-bottom: 50px;
}
.Footer-links {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.Footer-links ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
            align-content: space-between;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
}
.Footer-links li {
    height: 40px;
    display: inline-block;
    width: 107px;
    text-align: center;
    background: #464646;
    font-size: 12px;
    line-height: 40px;
    margin: 5px;
}
.Footer-products {
    width: 475px;
    margin-left: 37px;
}
.Footer-product {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.Footer-product .Footer-scan {
    width: 100px;
    font-size: 12px;
    color: #ffffff;
}
.Footer-product .Footer-scan-text {
    display: inline-block;
    margin-top: 15px;
}
.Footer-product .Footer-scan-img {
    height: 100px;
    display: block;
    width: 100%;
}
.Footer-product ul {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
       -moz-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
}
.Footer-product li {
    height: 40px;
    width: -webkit-calc(33.33% - 10px);
    width: -moz-calc(33.33% - 10px);
    width: calc(33.33% - 10px);
    text-align: center;
    background: #464646;
    font-size: 12px;
    line-height: 40px;
    margin: 5px;
}
.Footer-box {
    padding: 4px 0;
}
.Footer-divider {
    vertical-align: middle;
    margin: 0 5px;
}
.Footer-logo {
    width: 20px !important;
    height: 20px !important;
    margin-right: 5px;
    vertical-align: bottom;
}
.Footer-friendLink {
    margin: 0 auto 42px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    max-width: 80%;
}
.Footer-friendLink-title {
    -webkit-align-self: flex-start;
        -ms-flex-item-align: start;
            align-self: flex-start;
    color: #fff;
    font-size: 16px;
    padding-top: 8px;
    padding-bottom: 20px;
}
.Footer-friendLink-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
}
.Footer-friendLink-item {
    margin: 3px;
    display: block;
    width: 132px;
    height: 40px;
    padding: 0 10px;
    line-height: 40px;
    color: hsla(0, 0%, 100%, 0.6);
    text-align: center;
    background: #464646;
    font-size: 12px;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    white-space: nowrap;
}
@media (min-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2/1), (min-resolution: 2dppx) {
    body {
        -webkit-font-smoothing: subpixel-antialiased;
    }
}
@media screen and (max-width: 1150px) {
    .Header demand-search-box {
        display: none;
    }
}
@media screen and (min-width: 1150px) {
    .Header demand-search-icon {
        display: none;
    }
}
@media (min-width: 1920px) {
    .Home-Banner {
        height: 0 !important;
        padding-bottom: 9.373% !important;
    }
}
@media (min-width: 1466px) {
    .Layout-Main {
        max-width: 1062px;
    }
    .Header, body {
        min-width: 1062px;
    }

    .Home-CategroyLabel {
        font-size: 14px;
    }

    .Home-Hot {
        height: 230px;
    }

    .Home-HotItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 4 - 12px);
        width: -moz-calc(100% / 4 - 12px);
        width: calc(100% / 4 - 12px);
    }

    .Home-HotItem:nth-child(n + 9) {
        display: none;
    }

    .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 4 - 12px);
        width: -moz-calc(100% / 4 - 12px);
        width: calc(100% / 4 - 12px);
    }

    .Home-CoverItem:nth-child(n + 9) {
        display: none;
    }

    .is-Full .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 6 - 12px);
        width: -moz-calc(100% / 6 - 12px);
        width: calc(100% / 6 - 12px);
    }

    .is-Full .Home-CoverItem:nth-child(n + 13) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        display: block;
        width: 0;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 6 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 6 - 12px);
                flex: 0 0 calc(100% / 6 - 12px);
        margin-left: 12px;
        -webkit-transition: -webkit-transform 0.2s;
        transition: -webkit-transform 0.2s;
        -o-transition: -o-transform 0.2s;
        -moz-transition: transform 0.2s, -moz-transform 0.2s;
        transition: transform 0.2s;
        transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s;
    }

    .Home-RecommandItem:nth-child(n + 7) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        -webkit-transform-origin: 50% 50%;
           -moz-transform-origin: 50% 50%;
            -ms-transform-origin: 50% 50%;
             -o-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
    }

    .Home-RecommandItem:first-child {
        -webkit-transform-origin: 5% 50%;
           -moz-transform-origin: 5% 50%;
            -ms-transform-origin: 5% 50%;
             -o-transform-origin: 5% 50%;
                transform-origin: 5% 50%;
        position: relative;
        z-index: 2;
    }

    .Home-RecommandItem:nth-child(6) {
        position: relative;
        z-index: 2;
        -webkit-transform-origin: 100% 50%;
           -moz-transform-origin: 100% 50%;
            -ms-transform-origin: 100% 50%;
             -o-transform-origin: 100% 50%;
                transform-origin: 100% 50%;
    }

    .Home-UpItem-Wrapper:nth-child(n) {
        display: block;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 6 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 6 - 12px);
                flex: 0 0 calc(100% / 6 - 12px);
    }

    .Home-UpItem-Wrapper:nth-child(n + 7) {
        display: none;
    }

    .Home-Rank {
        width: 334px;
        margin-left: 24px;
    }

        .Home-Rank .RankListItem-img {
            width: 88px;
            height: 50px;
        }
    .Home-UpItem .UpAnchor-Avatar {
        width: 45px;
        height: 45px;
    }

    .UpAnchor-Label .anchor-auth {
        width: 14px;
        height: 14px;
    }
}
@media (min-width: 1474px) {
    .Layout-Main {
        max-width: 1224px;
    }
    .Header, body {
        min-width: 1224px;
    }

    .Home-CategroyLabel {
        font-size: 14px;
    }

    .Home-Hot {
        height: 230px;
    }

    .Cover-VideoNumPlay {
        margin-right: 9px;
    }

    .Home-HotSlider {
        width: 400px;
    }

    .Home-Rank {
        width: 392px;
        margin-left: 20px;
    }

        .Home-Rank .RankListItem-img {
            width: 102px;
            height: 58px;
        }

        .Home-Rank .RankListItem:hover .RankListItemCard {
            -webkit-transform: translate(-48%, 0px);
               -moz-transform: translate(-48%, 0px);
                -ms-transform: translate(-48%, 0px);
                 -o-transform: translate(-48%, 0px);
                    transform: translate(-48%, 0px);
        }
}
@media (min-width: 1680px) {
    .Layout-Main {
        max-width: 1430px;
    }
    .Header, body {
        min-width: 1430px;
    }

    .Home-CategroyLabel {
        font-size: 14px;
    }

    .Home-HotItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 5 - 12px);
        width: -moz-calc(100% / 5 - 12px);
        width: calc(100% / 5 - 12px);
    }

    .Home-HotItem:nth-child(n + 11) {
        display: none;
    }

    .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 5 - 12px);
        width: -moz-calc(100% / 5 - 12px);
        width: calc(100% / 5 - 12px);
    }

    .Home-CoverItem:nth-child(n + 11) {
        display: none;
    }

    .is-Full .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 7 - 12px);
        width: -moz-calc(100% / 7 - 12px);
        width: calc(100% / 7 - 12px);
    }

    .is-Full .Home-CoverItem:nth-child(n + 15) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        display: block;
        width: 0;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 7 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 7 - 12px);
                flex: 0 0 calc(100% / 7 - 12px);
        margin-left: 12px;
        -webkit-transition: -webkit-transform 0.2s;
        transition: -webkit-transform 0.2s;
        -o-transition: -o-transform 0.2s;
        -moz-transition: transform 0.2s, -moz-transform 0.2s;
        transition: transform 0.2s;
        transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s;
    }

    .Home-RecommandItem:nth-child(n + 8) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        -webkit-transform-origin: 50% 50%;
           -moz-transform-origin: 50% 50%;
            -ms-transform-origin: 50% 50%;
             -o-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
    }

    .Home-RecommandItem:first-child {
        -webkit-transform-origin: 5% 50%;
           -moz-transform-origin: 5% 50%;
            -ms-transform-origin: 5% 50%;
             -o-transform-origin: 5% 50%;
                transform-origin: 5% 50%;
        position: relative;
        z-index: 2;
    }

    .Home-RecommandItem:nth-child(7) {
        position: relative;
        z-index: 2;
        -webkit-transform-origin: 100% 50%;
           -moz-transform-origin: 100% 50%;
            -ms-transform-origin: 100% 50%;
             -o-transform-origin: 100% 50%;
                transform-origin: 100% 50%;
    }

    .Home-UpItem-Wrapper:nth-child(n) {
        display: block;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 7 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 7 - 12px);
                flex: 0 0 calc(100% / 7 - 12px);
    }

    .Home-UpItem-Wrapper:nth-child(n + 8) {
        display: none;
    }

    .Cover-VideoNumPlay {
        margin-right: 9px;
    }
}
@media (min-width: 1886px) {
    .Layout-Main {
        max-width: 1636px;
    }
    .Header, body {
        min-width: 1636px;
    }

    .Home-HotItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 6 - 12px);
        width: -moz-calc(100% / 6 - 12px);
        width: calc(100% / 6 - 12px);
    }

    .Home-HotItem:nth-child(n + 13) {
        display: none;
    }

    .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 6 - 12px);
        width: -moz-calc(100% / 6 - 12px);
        width: calc(100% / 6 - 12px);
    }

    .Home-CoverItem:nth-child(n + 13) {
        display: none;
    }

    .is-Full .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 8 - 12px);
        width: -moz-calc(100% / 8 - 12px);
        width: calc(100% / 8 - 12px);
    }

    .is-Full .Home-CoverItem:nth-child(n + 17) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        display: block;
        width: 0;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 8 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 8 - 12px);
                flex: 0 0 calc(100% / 8 - 12px);
        margin-left: 12px;
        -webkit-transition: -webkit-transform 0.2s;
        transition: -webkit-transform 0.2s;
        -o-transition: -o-transform 0.2s;
        -moz-transition: transform 0.2s, -moz-transform 0.2s;
        transition: transform 0.2s;
        transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s;
    }

    .Home-RecommandItem:nth-child(n + 9) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        -webkit-transform-origin: 50% 50%;
           -moz-transform-origin: 50% 50%;
            -ms-transform-origin: 50% 50%;
             -o-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
    }

    .Home-RecommandItem:first-child {
        -webkit-transform-origin: 5% 50%;
           -moz-transform-origin: 5% 50%;
            -ms-transform-origin: 5% 50%;
             -o-transform-origin: 5% 50%;
                transform-origin: 5% 50%;
        position: relative;
        z-index: 2;
    }

    .Home-RecommandItem:nth-child(8) {
        position: relative;
        z-index: 2;
        -webkit-transform-origin: 100% 50%;
           -moz-transform-origin: 100% 50%;
            -ms-transform-origin: 100% 50%;
             -o-transform-origin: 100% 50%;
                transform-origin: 100% 50%;
    }

    .Home-UpItem-Wrapper:nth-child(n) {
        display: block;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 8 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 8 - 12px);
                flex: 0 0 calc(100% / 8 - 12px);
    }

    .Home-UpItem-Wrapper:nth-child(n + 9) {
        display: none;
    }
}
@media (min-width: 2092px) {
    .Layout-Main {
        max-width: 1842px;
    }
    .Header, body {
        min-width: 1842px;
    }

    .Home-HotItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 7 - 12px);
        width: -moz-calc(100% / 7 - 12px);
        width: calc(100% / 7 - 12px);
    }

    .Home-HotItem:nth-child(n + 15) {
        display: none;
    }

    .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 7 - 12px);
        width: -moz-calc(100% / 7 - 12px);
        width: calc(100% / 7 - 12px);
    }

    .Home-CoverItem:nth-child(n + 15) {
        display: none;
    }

    .is-Full .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 9 - 12px);
        width: -moz-calc(100% / 9 - 12px);
        width: calc(100% / 9 - 12px);
    }

    .is-Full .Home-CoverItem:nth-child(n + 19) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        display: block;
        width: 0;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 9 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 9 - 12px);
                flex: 0 0 calc(100% / 9 - 12px);
        margin-left: 12px;
        -webkit-transition: -webkit-transform 0.2s;
        transition: -webkit-transform 0.2s;
        -o-transition: -o-transform 0.2s;
        -moz-transition: transform 0.2s, -moz-transform 0.2s;
        transition: transform 0.2s;
        transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s;
    }

    .Home-RecommandItem:nth-child(n + 10) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        -webkit-transform-origin: 50% 50%;
           -moz-transform-origin: 50% 50%;
            -ms-transform-origin: 50% 50%;
             -o-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
    }

    .Home-RecommandItem:first-child {
        -webkit-transform-origin: 5% 50%;
           -moz-transform-origin: 5% 50%;
            -ms-transform-origin: 5% 50%;
             -o-transform-origin: 5% 50%;
                transform-origin: 5% 50%;
        position: relative;
        z-index: 2;
    }

    .Home-RecommandItem:nth-child(9) {
        position: relative;
        z-index: 2;
        -webkit-transform-origin: 100% 50%;
           -moz-transform-origin: 100% 50%;
            -ms-transform-origin: 100% 50%;
             -o-transform-origin: 100% 50%;
                transform-origin: 100% 50%;
    }

    .Home-UpItem-Wrapper:nth-child(n) {
        display: block;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 9 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 9 - 12px);
                flex: 0 0 calc(100% / 9 - 12px);
    }

    .Home-UpItem-Wrapper:nth-child(n + 10) {
        display: none;
    }
}
@media (min-width: 2298px) {
    .Layout-Main {
        max-width: 2048px;
    }
    .Header, body {
        min-width: 2048px;
    }

    .Home-HotItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 8 - 12px);
        width: -moz-calc(100% / 8 - 12px);
        width: calc(100% / 8 - 12px);
    }

    .Home-HotItem:nth-child(n + 17) {
        display: none;
    }

    .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 8 - 12px);
        width: -moz-calc(100% / 8 - 12px);
        width: calc(100% / 8 - 12px);
    }

    .Home-CoverItem:nth-child(n + 17) {
        display: none;
    }

    .is-Full .Home-CoverItem:nth-child(n) {
        display: block;
        width: -webkit-calc(100% / 10 - 12px);
        width: -moz-calc(100% / 10 - 12px);
        width: calc(100% / 10 - 12px);
    }

    .is-Full .Home-CoverItem:nth-child(n + 21) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        display: block;
        width: 0;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 10 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 10 - 12px);
                flex: 0 0 calc(100% / 10 - 12px);
        margin-left: 12px;
        -webkit-transition: -webkit-transform 0.2s;
        transition: -webkit-transform 0.2s;
        -o-transition: -o-transform 0.2s;
        -moz-transition: transform 0.2s, -moz-transform 0.2s;
        transition: transform 0.2s;
        transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s;
    }

    .Home-RecommandItem:nth-child(n + 11) {
        display: none;
    }

    .Home-RecommandItem:nth-child(n) {
        -webkit-transform-origin: 50% 50%;
           -moz-transform-origin: 50% 50%;
            -ms-transform-origin: 50% 50%;
             -o-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
    }

    .Home-RecommandItem:first-child {
        -webkit-transform-origin: 5% 50%;
           -moz-transform-origin: 5% 50%;
            -ms-transform-origin: 5% 50%;
             -o-transform-origin: 5% 50%;
                transform-origin: 5% 50%;
        position: relative;
        z-index: 2;
    }

    .Home-RecommandItem:nth-child(10) {
        position: relative;
        z-index: 2;
        -webkit-transform-origin: 100% 50%;
           -moz-transform-origin: 100% 50%;
            -ms-transform-origin: 100% 50%;
             -o-transform-origin: 100% 50%;
                transform-origin: 100% 50%;
    }

    .Home-UpItem-Wrapper:nth-child(n) {
        display: block;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 -webkit-calc(100% / 10 - 12px);
           -moz-box-flex: 0;
            -ms-flex: 0 0 calc(100% / 10 - 12px);
                flex: 0 0 calc(100% / 10 - 12px);
    }

    .Home-UpItem-Wrapper:nth-child(n + 11) {
        display: none;
    }
}