/* stylelint-disable @abema/no-color-scheme */
/* stylelint-disable @abema/no-color-scheme */
:root {
  --abema-yellow: #ddaa00;
  --abema-green: #16deb5;
  --abema-purple: #a873ff;
  --payperview-blue: #02d1d6;
  --black: #000000;
  --transparent-black: rgba(0, 0, 0, 0);
  --dark-strong: #171717;
  --dark-strong-80: rgba(23, 23, 23, 0.8);
  --transparent-dark-strong: rgba(23, 23, 23, 0);
  --dark-basic: #212121;
  --dark-basic-80: rgba(33, 33, 33, 0.8);
  --transparent-dark-basic: rgba(33, 33, 33, 0);
  --dark-basic-hover: #373737;
  --pale-weak: #f5f5f5;
  --light-basic: #e6e6e6;
  --light-basic-50: rgba(230, 230, 230, 0.5);
  --white: #ffffff;
  --white-8: rgba(255, 255, 255, 0.08);
  --white-12: rgba(255, 255, 255, 0.12);
  --white-30: rgba(255, 255, 255, 0.3);
  --white-40: rgba(255, 255, 255, 0.4);
  --white-50: rgba(255, 255, 255, 0.5);
  --smoke-basic: #999999;
  --smoke-strong: #767676;
  --dark-weak: #333333;
  --dark-stronger: #0b0b0b;
  --smoke-week: #cccccc;
  --gray: #211f23;
  --yellow: #272204;
  --brown: #4b3a00;
  --abema-purple-hover: #af7eff;
  --black-80: rgba(0, 0, 0, 0.8);
  --black-70: rgba(0, 0, 0, 0.7);
  --black-60: rgba(0, 0, 0, 0.6);
  --black-50: rgba(0, 0, 0, 0.5);
  --black-40: rgba(0, 0, 0, 0.4);
  --black-30: rgba(0, 0, 0, 0.3);
  --black-20: rgba(0, 0, 0, 0.2);
  --black-12: rgba(0, 0, 0, 0.12);
  --black-8: rgba(0, 0, 0, 0.08);
}
:root {
  --color-primary: var(--abema-yellow);
  --color-primary-hover: #dfb015;
  --color-primary-hover-label: #dfb015;
  --color-primary-15: rgba(221, 170, 0, 0.15);
  --color-primary-22: rgba(221, 170, 0, 0.22);
  --color-accent: #f0163a;
  --color-accent-hover-legacy: #bb122e;
  --color-accent-hover: #f34461;
  --color-coin: #ffc400;
  --color-green: var(--abema-green);
  --color-green-12: rgba(22, 222, 181, 0.12);
  --color-green-24: rgba(22, 222, 181, 0.24);
  --color-green-hover: #44e5c5;
  --color-purple-20: rgba(168, 115, 255, 0.2);
  --bg-white: var(--white);
  --bg-black: var(--black);
  --bg-transparent-black: var(--transparent-black);
  --bg-regular: var(--dark-strong);
  --bg-floating-regular: var(--dark-strong-80);
  --bg-transparent-regular: var(--transparent-dark-strong);
  --bg-highlight: var(--color-accent);
  --bg-transparent-hover: var(--white-8);
  --bg-dark-stronger: var(--dark-stronger);
  --bg-dark-stronger-hover: var(--dark-basic);
  --bg-dark-weak: var(--dark-weak);
  --bg-sub: var(--dark-basic);
  --bg-floating-sub: var(--dark-basic-80);
  --bg-transparent-sub: var(--transparent-dark-basic);
  --bg-sub-hover: var(--dark-basic-hover);
  --bg-text-box-background: #f5f5f5;
  --bg-text-box-background-active: #ffffff;
  --bg-select: #d8d8d8;
  --bg-primary: var(--color-primary);
  --bg-smoke-basic: var(--smoke-basic);
  --bg-progress-bar: var(--smoke-strong);
  --bg-timetable-bar: var(--dark-weak);
  --bg-past-timetable-bar: var(--smoke-strong);
  --bg-title-card: #212121;
  --bg-dropdown-item: var(--dark-basic);
  --bg-dropdown-item-active: rgba(255, 255, 255, 0.1);
  --bg-dropdown-item-hover: #373737;
  --bg-popup-overlay: var(--black-50);
  --bg-user-thumbnail-overlay: var(--black-50);
  --bg-input-text-dark: var(--dark-basic);
  --bg-input-text-light: var(--white);
  --bg-attention-cell: #fde3e7;
  --bg-light-basic: var(--light-basic);
  --bg-smoke-week: var(--smoke-week);
  --bg-black-80: var(--black-80);
  --bg-black-70: var(--black-70);
  --bg-black-60: var(--black-60);
  --bg-black-50: var(--black-50);
  --bg-black-40: var(--black-40);
  --bg-black-30: var(--black-30);
  --bg-black-20: var(--black-20);
  --bg-black-12: var(--black-12);
  --bg-white-12: var(--white-12);
  --bg-white-30: var(--white-30);
  --bg-white-40: var(--white-40);
  --bg-white-50: var(--white-50);
  --bg-white-8: var(--white-8);
  --bg-black-8: var(--black-8);
  --bg-gray: var(--gray);
  --bg-yellow: var(--yellow);
  --bg-brown: var(--brown);
  --bg-green: var(--abema-green);
  --bg-green-12: var(--color-green-12);
  --bg-green-24: var(--color-green-24);
  --bg-placeholder: var(--dark-weak);
  --bg-card-placeholder: #1c1c1c;
  --bg-card-texts-placeholder: var(--dark-basic);
  --bg-card-text-placeholder: #1c1c1c;
  --bg-title-placeholder: var(--dark-basic);
  --bg-genre-placeholder: var(--dark-basic);
  --bg-new-placeholder: var(--white-12);
  --bg-preview: var(--dark-weak);
  --lt-bg-regular: #ffffff;
  --lt-bg-hover: #f5f5f5;
  --lt-bg-program-regular: #eeeeee;
  --lt-bg-program-now-regular: #fcf6e5;
  --lt-bg-program-now-hover: #e6e0d0;
  --lt-bg-program-past-regular: #eeeeee;
  --lt-bg-program-past-hover: #e9e9e9;
  --lt-bg-program-future-regular: #ffffff;
  --lt-bg-program-future-hover: #fafafa;
  --lt-bg-program-pause-regular: #eeeeee;
  --lt-bg-primary: var(--color-primary);
  --lt-bg-placeholder: #f5f5f5;
  --onload-bg-placeholder: #0b0b0b;
  --gray-bg-regular: #f5f5f5;
  --font-size-xxxxl: 28px;
  --font-size-xxxl: 24px;
  --font-size-xxl: 22px;
  --font-size-xl: 18px;
  --font-size-l: 16px;
  --font-size-m: 14px;
  --font-size-s: 13px;
  --font-size-xs: 12px;
  --font-size-xxs: 10px;
  --font-size-title-l: 32px;
  --font-size-title-m: 27px;
  --font-size-title-s: 22px;
  --font-size-mb-xxxl: 24px;
  --font-size-mb-xxl: 18px;
  --font-size-mb-xl: 16px;
  --font-size-mb-l: 15px;
  --font-size-mb-m: 14px;
  --font-size-mb-s: 12px;
  --font-size-mb-xs: 10px;
  --font-size-mb-xxs: 9px;
  --font-size-mb-title-l: 27px;
  --font-size-mb-title-m: 20px;
  --font-size-mb-title-s: 17px;
  --font-color-placeholder: var(--smoke-basic);
  --font-color-primary: var(--color-primary);
  --font-color-regular: var(--light-basic);
  --font-color-danger: var(--color-accent);
  --font-color-warning: var(--color-accent);
  --font-color-info: var(--smoke-basic);
  --font-color-link: var(--color-primary);
  --font-color-link-hover: #c5c5c5;
  --font-color-white: var(--white);
  --font-color-smoke: var(--smoke-basic);
  --font-color-smoke-weak: var(--smoke-week);
  --font-color-smoke-strong: var(--smoke-strong);
  --font-color-dark-basic: var(--dark-basic);
  --font-color-black60: var(--black-60);
  --font-color-dark-strong: var(--dark-strong);
  --font-color-payperview: var(--payperview-blue);
  --font-color-green: var(--abema-green);
  --font-color-purple: var(--abema-purple);
  --lt-font-color-primary: var(--color-primary);
  --lt-font-color-regular: var(--dark-basic);
  --lt-font-color-danger: var(--color-accent);
  --lt-font-color-info: var(--smoke-basic);
  --lt-font-color-link: var(--color-primary);
  --lt-font-color-link-hover: #c5c5c5;
  --font-family-sans-serif:
    "CopyRight", "Emoji", "Hiragino Sans", "BIZ UDPGothic Alphabet", "BIZ UDGothic", Meiryo,
    sans-serif;
  --font-family-for-alphanumeric: helvetica, arial, sans-serif;
  --border-width: 1px;
  --border-color: #333333;
  --border-color-sub: #555555;
  --border-color-faint-white: rgba(255, 255, 255, 0.12);
  --border-color-faint-black: rgba(0, 0, 0, 0.12);
  --border-primary-color: var(--color-primary);
  --border-info-color: var(--smoke-basic);
  --border-dark-basic: var(--dark-basic);
  --border-light-basic: var(--light-basic);
  --border-dark-basic-hover: var(--dark-basic-hover);
  --border-regular-color: #ffffff;
  --border-universal-color: #e6e6e6;
  --border-mobile-seek-bar: #999999;
  --border-color-balloon: var(--light-basic-50);
  --border-color-white-50: var(--white-50);
  --lt-border-color: #eeeeee;
  --lt-border-color-sub: #dddddd;
  --lt-border-info-color: var(--smoke-basic);
  --button-opacity-hover: 0.9;
  --button-opacity-active: 0.7;
  --button-opacity-disabled: 0.4;
  --button-label-size-xs: 12px;
  --button-label-size-m: 14px;
  --button-label-size-l: 16px;
  --button-label-size-xl: 20px;
  --button-primary-color: #ffffff;
  --button-primary-label-color: var(--color-primary);
  --button-primary-border: 1px solid var(--color-primary);
  --lt-button-primary-color: var(--color-primary);
  --lt-button-primary-label-color: var(--dark-basic);
  --lt-button-primary-color-hover: var(--color-primary-hover);
  --button-primary-outline-color: var(--border-info-color);
  --button-primary-bg-color-hover: rgba(221, 170, 0, 0.9);
  --button-primary-bg-color-active: rgba(221, 170, 0, 0.7);
  --new-button-primary-label-color: var(--dark-basic);
  --new-button-primary-bg-color: var(--color-primary);
  --new-button-primary-hover-bg-color: var(--color-primary-hover);
  --button-primary-dark-color: var(--dark-basic);
  --button-primary-dark-label-color: var(--color-primary);
  --button-primary-dark-hover-color: var(--dark-basic-hover);
  --button-primary-purple-label-color: var(--dark-basic);
  --button-primary-purple-bg-color: var(--abema-purple);
  --button-primary-purple-hover-color: var(--abema-purple-hover);
  --button-secondary-color: var(--light-basic);
  --button-secondary-label-color: var(--dark-basic);
  --button-secondary-hover-color: var(--white);
  --button-secondary-outline-color: var(--border-info-color);
  --button-danger-color: var(--color-accent);
  --button-danger-label-color: var(--white);
  --button-danger-hover-color: var(--color-accent-hover);
  --button-danger-outline-color: var(--border-info-color);
  --button-dark-color: var(--dark-basic);
  --button-dark-label-color: var(--light-basic);
  --button-dark-hover-color: var(--dark-basic-hover);
  --button-dark-outline-color: var(--border-info-color);
  --button-toggle-color: #ffffff;
  --button-toggle-label-color: var(--color-primary);
  --button-toggle-border: 1px solid var(--color-primary);
  --button-toggle-color-disable: #ffffff;
  --button-toggle-label-color-disable: #c4c4c4;
  --button-toggle-border-disable: 1px solid #f5f5f5;
  --button-toggle-color-active: #f5f5f5;
  --button-toggle-color-active-hover: var(--color-accent);
  --button-toggle-label-color-active: var(--smoke-basic);
  --button-toggle-label-color-active-hover: #ffffff;
  --button-toggle-border-active: 1px solid #f5f5f5;
  --button-toggle-border-active-hover: 1px solid var(--color-accent);
  --button-line-color: #00b900;
  --button-line-label-color: #ffffff;
  --button-color: #000000;
  --button-border: 1px solid #444444;
  --button-border-color: #444444;
  --button-label-color: #ffffff;
  --button-color-hover: #212121;
  --button-border-color-hover: #444444;
  --button-label-color-hover: #e9e9e9;
  --lt-button-color: #ffffff;
  --lt-button-border: 1px solid #dddddd;
  --lt-button-border-color: #dddddd;
  --lt-button-label-color: var(--smoke-basic);
  --lt-button-color-hover: #f2f2f2;
  --lt-button-border-hover: 1px solid #d1d1d1;
  --lt-button-border-color-hover: #d1d1d1;
  --lt-button-label-color-hover: #848484;
  --lt-button-danger-color: var(--color-accent);
  --lt-button-danger-label-color: #ffffff;
  --lt-button-danger-color-hover: var(--color-accent-hover-legacy);
  --lt-button-danger-label-color-hover: #f2f2f2;
  --lt-button-add-my-video-color: #e6e6e6;
  --lt-button-add-my-video-color-hover: var(--lt-bg-regular);
  --lt-button-add-my-video-active-color: var(--color-primary);
  --lt-button-add-my-video-active-hover-color: var(--color-primary);
  --lt-button-add-my-video-disabled-color: #a8a8a8;
  --lt-button-add-my-video-disabled-hover-color: #a8a8a8;
  --button-normal-color: var(--light-basic);
  --button-normal-label-color: var(--dark-basic);
  --button-weak-light-color: var(--light-basic);
  --button-weak-light-label-color: var(--dark-basic);
  --radius: 4px;
  --space: 4px;
  --time-table-space: 8px;
  --mobile-space-above-footer: 40px;
  --duration: 0.5s;
  --easing: linear;
  --fading-duration: 0.1s;
  --fading-easing: linear;
  --opacity: 0.7;
  --opacity-disabled: 0.7;
  --content-min-width: 724px;
  --content-max-width: 1024px;
  --content-max-width-for-vod: 1280px;
  --mobile-content-width: 640px;
  --editable-font-size: 13px;
  --lt-editable-font-color: #171717;
  --editable-border-width: var(--border-width);
  --lt-editable-border-color: var(--lt-border-color);
  --editable-border-radius: var(--radius);
  --icon-color-black: #000000;
  --icon-color-defalt: #171717;
  --icon-color-white: #ffffff;
  --icon-color-dark-basic: var(--dark-basic);
  --icon-color-light-basic: var(--light-basic);
  --icon-color-gray: var(--smoke-basic);
  --icon-color-red: var(--color-accent);
  --icon-color-primary: var(--color-primary);
  --icon-color-universal: #999999;
  --icon-color-smoke-strong: var(--smoke-strong);
  --icon-color-coin: var(--color-coin);
  --balloon-color-white: var(--white);
  --tooltip-controller-hover-delay: 0.3s;
  --tooltip-horizontal-padding: calc(var(--space) * 2);
  --tooltip-vertical-padding: var(--space);
  --tooltip-arrow-size: 7px;
  --tooltip-arrow-padding-from-container-side: 14px;
  --scrollbar-base-width: 14px;
  --scrollbar-thumb-width: 8px;
  --scrollbar-face-color: var(--smoke-basic);
  --shadow: 0px 2px 7px 0px var(--black-30);
  --shadow-color-black: var(--black);
  --button-shadow: 0 0 calc(6 * var(--space)) rgba(0, 0, 0, 0.12);
  --thumbnail-first-layer-shadow: var(--smoke-basic);
  --thumbnail-second-layer-shadow: var(--smoke-strong);
  --focus-outline-color: var(--color-primary);
  --overlay-color-thumbnail: rgba(0, 0, 0, 0.7);
  --overlay-color-modal: rgba(0, 0, 0, 0.7);
  --ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  --ease-out-cubic: cubic-bezier(0.33, 1, 0.68, 1);
  --ease-in-out-cubic: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-out-quad: cubic-bezier(0.5, 1, 0.89, 1);
  --ease-in-out-quad: cubic-bezier(0.45, 0, 0.55, 1);
  --ease-in-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --z-continue-button: 2;
  --z-timetable-paused: 2;
  --z-timetable-side-slot-detail: 2;
  --z-balloon: 1;
  --z-side-navigation-dropdown-menu: 1;
  --z-dropdown-menu: 3;
  --z-mobile-vod-navigation: 1;
  --z-now-broadcasting-label: 1;
  --z-tv-base-overlay: 1;
  --z-timetable-time-axis: 2;
  --z-header-search-area: 2;
  --z-timetable-header: 3;
  --z-timetable-navigation: 4;
  --z-tv-screen-overlay: 3;
  --z-ad-reserve-button: 4;
  --z-side-controller: 4;
  --z-tv-screen-muted-button: 4;
  --z-tv-screen-chase-button: 11;
  --z-tv-slot-switch-angle-button: 13;
  --z-tv-slot-catchup-chase-button: 13;
  --z-tv-slot-payperview-comment-wrapper: 12;
  --z-tv-slot-payperview-chase-button: 13;
  --z-tv-slot-angle-list-modal: 16;
  --z-vote: 3;
  --z-comment-form: 4;
  --z-full-screen-controllers: 10;
  --z-video-common: 10;
  --z-video-view-in-app: 10;
  --z-video-event-handler: 10;
  --z-video-container: 11;
  --z-video-control: 14;
  --z-video-control-bg: 12;
  --z-video-next-program-info: 14;
  --z-video-skip: 14;
  --z-ppv-vote: 14;
  --z-video-comment-count-button: 13;
  --z-video-ad-control: 15;
  --z-video-mute-button: 16;
  --z-footer: 10;
  --z-timetable-button: 10;
  --z-eyecatch: 10;
  --z-scroll-float-wrapper: 11;
  --z-eyecatch-blind: 11;
  --z-sticky-header: 11;
  --z-linear-balloon: 11;
  --z-linear-toast: 11;
  --z-onboarding-modal: 11;
  --z-header: 12;
  --z-vod-screen: 13;
  --z-mobile-floating-app-button: 13;
  --z-sticky-drawer: 14;
  --z-chaseplay-catchup-notice: 14;
  --z-tutorial: 20;
  --z-popup: 30;
  --z-notification: 31;
  --z-sidenav: 12;
  --z-breaking-news: 11;
  --z-index-hero-footer: 1;
  --z-top-level-overlay: 40;
  --z-premium-plan-cta: 3;
  --z-premium-plan-feature-card: 2;
  --z-premium-plan-hero-content: 1;
  --z-channel-card-link-on-hover: 1;
  --z-tv-area-layout-bottom-layer: 0;
  --z-tv-area-layout-middle-layer: 1;
  --z-tv-area-layout-top-layer: 2;
  --z-faded-expandable-block-content-collapsed: 1;
  --z-video-right-aligned-my-list-appeal: 11;
  --z-premium-top-floating-button: 1;
  --z-premium-top-new-all-header-button: 1;
  --z-premium-top-only-contents-header-button: calc(var(--z-premium-plan-hero-content) + 1);
  --z-search-results-list-item-clickable-area: 1;
  --z-search-results-list-item-my-list-button: 2;
  --z-feature-area-list-item-clickable-area: 1;
  --z-feature-area-list-item-my-list-button: 2;
  --z-content-list-list-item-clickable-area: 1;
  --z-content-list-list-item-my-list-button: 2;
  --z-select-menu-list: 3;
  --z-history-item-clickable-area: 1;
  --z-history-item-delete-button: 2;
  --z-live-event-floating-area: 2;
  --z-contentlist-list-item-clickable-area: 1;
  --z-contentlist-list-item-my-list-button: 2;
  --header-height: 68px;
  --tv-footer-height: 64px;
  --mobile-floating-app-button-height: 48px;
  --timetable-col-width: 180px;
  --linear-side-panel-width: 320px;
  --card-width: 242px;
  --card-radius: 4px;
  --card-transition: 0.15s linear;
  --card-hover-opacity: 0.7;
  --card-hover-transition: 0.3s ease-out;
  --carousel-card-margin: calc(var(--space) * 3);
  --section-radius: 2px;
  --vod-genre-navigation-link-color-hover: #2e2e2e;
  --vod-genre-navigation-expand-button-fill-color: #e6e6e6;
  --vod-genre-navigation-expand-button-fill-color-hover: #ffffff;
  --button-transition: border 0.1s ease-out, color 0.1s ease-out;
  --modal-transition-duration: 300ms;
  --modal-top-and-bottom-padding: calc(var(--space) * 8);
  --focus-outline: 1px dotted var(--font-color-info);
  --archive-comment-comment-area-bg: rgb(11, 11, 11);
  --archive-comment-comment-area-bg-with-alpha: rgba(11, 11, 11, 0.9);
  --archive-comment-waiging-bg: rgba(11, 11, 11, 0.5);
  --notification-background-color: var(--dark-basic);
  --notification-border-color: var(--dark-weak);
  --notification-link-color: var(--color-primary);
  --notification-link-hover-color: var(--color-primary-hover);
  --ima-skip-button-bg: rgba(23, 23, 23, 0.8);
  --ima-skip-button-bg-hover: rgba(23, 23, 23, 1);
  --timetable-channel-header-height: 55px;
  --timetable-time-axis-width: 24px;
  --timetable-time-axis-mb-width: 20px;
  --timetable-slot-detail-width: 280px;
  --timetable-item-vertical-padding: calc(var(--space) * 2);
  --timetable-item-horizontal-padding: calc(var(--space) * 3);
  --timetable-item-my-list-icon-padding-right-from-container: var(--space);
  --timetable-item-my-list-icon-padding-top-from-container: var(--space);
  --step-indicator-color: var(--smoke-basic);
  --step-indicator-color-active: var(--white);
  --sns-share-width: 80px;
  --link-hover-background: var(--white-8);
  --link-block-hover-transition: opacity var(--fading-duration) var(--fading-easing);
  --link-inline-hover-transition: background-color var(--fading-duration) var(--fading-easing);
  --link-inline-padding: 3px;
  --base-share-button-scale-ratio: 1.1;
  --infinity: 99999;
}
html{-webkit-text-size-adjust:100%;box-sizing:border-box;tab-size:4;word-break:normal}
*,:after,:before{background-repeat:no-repeat;box-sizing:inherit}
:after,:before{text-decoration:inherit;vertical-align:inherit}
*{margin:0;padding:0}
hr{color:inherit;height:0;overflow:visible}
details,main{display:block}
summary{display:list-item}
small{font-size:80%}
[hidden]{display:none}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
a{background-color:transparent}
a:active,a:hover{outline-width:0}
code,kbd,pre,samp{font-family:monospace,monospace}
pre{font-size:1em}
b,strong{font-weight:bolder}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-.25em}
sup{top:-.5em}
table{border-color:inherit;text-indent:0}
iframe{border-style:none}
input{border-radius:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-decoration{-webkit-appearance:none}
textarea{overflow:auto;resize:vertical}
button,input,optgroup,select,textarea{font:inherit}
optgroup{font-weight:700}
button{overflow:visible}
button,select{text-transform:none}
[role=button],[type=button],[type=reset],[type=submit],button{cursor:pointer}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button:-moz-focusring{outline:1px dotted ButtonText}
[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}
button,input,select,textarea{background-color:transparent;border-style:none}
a:focus,button:focus,input:focus,select:focus,textarea:focus{outline-width:0}
select{-moz-appearance:none;-webkit-appearance:none}
select::-ms-expand{display:none}
select::-ms-value{color:currentColor}
legend{border:0;color:inherit;display:table;max-width:100%;white-space:normal}
::-webkit-file-upload-button{-webkit-appearance:button;color:inherit;font:inherit}
[disabled]{cursor:default}
img{border-style:none}
progress{vertical-align:baseline}
[aria-busy=true]{cursor:progress}
[aria-controls]{cursor:pointer}
[aria-disabled=true]{cursor:default}
input,
button,
select,
textarea {
  color: inherit;
  font: inherit;
}
a:focus,
a:active,
a:hover,
button:focus,
input:focus,
select:focus,
textarea:focus {
  outline-width: initial;
}
/**
 * 絵文字のコードポイントのみに絵文字フォントが当たるように unicode-range 指定で定義する
 * See https://github.com/abema/abema-web/issues/9042
 */
@font-face {
  font-family: 'Emoji';
  src:
    local('Segoe UI Emoji'), local('Segoe UI Symbol'), local('Apple Color Emoji'),
    local('Noto Color Emoji'), local('Noto Emoji');
  unicode-range:
    U+200d, U+203c, U+2049, U+20e3, U+2122, U+2139, U+2194-2199, U+21a9-21aa, U+2328, U+23cf,
    U+23ed-23ef, U+23f1-23f2, U+23f8-23fa, U+24c2, U+25aa-25ab, U+25b6, U+25c0, U+25fb-25fc,
    U+2600-2604, U+260e, U+2611, U+2618, U+261d, U+2620, U+2622-2623, U+2626, U+262a, U+262e-262f,
    U+2638-263a, U+2640, U+2642, U+265f-2660, U+2663, U+2665-2666, U+2668, U+267b, U+267e, U+2692,
    U+2694-2697, U+2699, U+269b-269c, U+26a0, U+26a7, U+26b0-26b1, U+26c8, U+26cf, U+26d1, U+26d3,
    U+26e9, U+26f0-26f1, U+26f4, U+26f7-26f9, U+2702, U+2708-2709, U+270c-270d, U+270f, U+2712,
    U+2714, U+2716, U+271d, U+2721, U+2733-2734, U+2744, U+2747, U+2763-2764, U+27a1, U+2934-2935,
    U+2b05-2b07, U+3030, U+303d, U+3297, U+3299, U+fe0f, U+1f170-1f171, U+1f17e-1f17f, U+1f202,
    U+1f237, U+1f308, U+1f321, U+1f324-1f32c, U+1f336, U+1f37d, U+1f396-1f397, U+1f399-1f39b,
    U+1f39e-1f39f, U+1f3cb-1f3ce, U+1f3d4-1f3df, U+1f3f3, U+1f3f5, U+1f3f7, U+1f43f, U+1f441,
    U+1f4fd, U+1f549-1f54a, U+1f56f-1f570, U+1f573-1f579, U+1f587, U+1f58a-1f58d, U+1f590, U+1f5a5,
    U+1f5a8, U+1f5b1-1f5b2, U+1f5bc, U+1f5c2-1f5c4, U+1f5d1-1f5d3, U+1f5dc-1f5de, U+1f5e1, U+1f5e3,
    U+1f5e8, U+1f5ef, U+1f5f3, U+1f5fa, U+1f6cb, U+1f6cd-1f6cf, U+1f6e0-1f6e5, U+1f6e9, U+1f6f0,
    U+1f6f3;
}
/**
 * コピーライトマークがヒラギノで小さくなってしまうので、英数字用フォントに切り替える
 */
@font-face {
  font-family: 'CopyRight';
  src: local('helvetica'), local('arial');
  unicode-range: U+00A9;
}
/**
 * Windows 環境で英字のみプロポーショナルフォントに切り替える
 */
@font-face {
  font-family: 'BIZ UDPGothic Alphabet';
  font-weight: 400;
  src: local('BIZ UDPGothic');
  unicode-range: U+00-7f;
}
@font-face {
  font-family: 'BIZ UDPGothic Alphabet';
  font-weight: 700;
  src: local('BIZ UDPGothic Bold');
  unicode-range: U+00-7f;
}
html,
body,
#root {
  height: 100%;
  width: 100%;
}
body {
  background-color: #000000;
  color: #e6e6e6;
  font-family: "CopyRight", "Emoji", "Hiragino Sans", "BIZ UDPGothic Alphabet", "BIZ UDGothic", Meiryo,
    sans-serif;
}
/* https://github.com/twbs/bootstrap/blob/1df098361cac04217d6a464c80e890c4335ecb5c/scss/mixins/_visually-hidden.scss#L8-L18 */
[data-visually-hidden] {
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value */
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}
/* https://github.com/abema/abema-web/commit/7dea5e88cb46ba67c366390d2a066fb3c9565a8c */
/* Scrollbar - Firefox */
* {
  /* stylelint-disable-next-line plugin/browser-compat */
  scrollbar-color: #999999 transparent;
}
/* Scrollbar - Chrome / Safari (Webkit) */
*::-webkit-scrollbar {
  background-color: transparent;
  width: 14px;
}
/* stylelint-disable-next-line plugin/browser-compat */
*::-webkit-scrollbar-track {
  background-color: transparent;
}
/* stylelint-disable-next-line plugin/browser-compat */
*::-webkit-scrollbar-thumb {
  background: #999999;
  background-clip: content-box;
  border: calc((14px - 8px) / 2) solid transparent;
  border-radius: calc(4px * 4);
}
*::-webkit-scrollbar:horizontal {
  background-color: transparent;
  height: 14px;
}
/**
 * mdx の変換により生成されるコンポーネント用のスタイル
 * tools/add_mdx_class_name.mjs を使って .mdx を付与している
 */
:root {
  /* FIXME: https://github.com/abema/abema-web/issues/22871 */
  /* stylelint-disable-next-line @abema/no-color-scheme */
  --mdx-hover-background: var(--white-8);
  /* NOTE: https://github.com/abema/abema-web/pull/13212#issuecomment-519354205 */
  --mdx-inline-padding: 3px;
}
h1.mdx {
  font-size: 32px;
  font-weight: bold;
  line-height: 1;
  margin-bottom: calc(4px * 4);
  padding: calc(4px * 4) 0 calc(4px * 5);
}
h2.mdx {
  font-size: 13px;
  margin-bottom: calc(4px * 4);
  margin-top: calc(4px * 11);
}
h3.mdx,
h4.mdx,
h5.mdx,
h6.mdx {
  font-size: 13px;
  margin-bottom: calc(4px * 2);
  margin-top: calc(4px * 4);
}
a.mdx {
  border-radius: 4px;
  color: #ddaa00;
  padding: 3px;
  text-decoration: none;
  transition: background-color 0.1s linear;
}
a.mdx:hover,
a.mdx:focus {
  background-color: rgba(255, 255, 255, 0.08);
}
p.mdx {
  font-size: 13px;
  line-height: 2;
}
li.mdx {
  line-height: 2;
  margin-left: calc(4px * 5);
}
ol.mdx {
  /* NOTE: Safari 等で番号付きリストの左端がずれる問題を防ぐ。フォントサイズ変更に対応できるよう rem を使用 */
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value */
  padding-left: 1rem;
}
hr.mdx {
  border: none;
  border-top: solid 1px rgba(255, 255, 255, 0.12);
  margin: calc(4px * 8) 0 calc(4px * 4);
}
@media screen and (max-width: 650px) {
  h1.mdx {
    font-size: 24px;
    line-height: 1.5;
    margin-bottom: calc(4px * 4);
  }
  h2.mdx,
  h3.mdx,
  h4.mdx,
  h5.mdx,
  h6.mdx {
    font-size: 14px;
  }

  p.mdx {
    font-size: 14px;
  }
}
.com-Callout {
  background-color: #212121;
  border-radius: 4px;
  padding: calc(4px * 4);
}
@media screen and (max-width: 650px) {
  .com-Callout {
    padding: calc(4px * 2);
  }
}
:root {
  --com-Layout-max-width: var(--content-max-width);
  --com-Layout-min-width: var(--content-min-width);
  --com-Layout-side-margin: calc(var(--space) * 6);
  --com-Layout-header-height--mobile: 44px;
}
.com-Layout {
  overflow: auto;
}
.com-Layout__markdown {
  overflow: hidden;
}
.com-Layout__wrapper {
  margin-bottom: calc(4px * 4);
  margin-top: 44px;
  overflow: hidden;
  padding: 0 calc(4px * 2);
}
.com-Layout__inner {
  margin: 0 auto calc(4px * 7);
}
@media screen and (min-width: 650.02px) {
  .com-Layout__wrapper {
    margin-bottom: calc(4px * 8);
    margin-top: calc(68px + 4px * 3);
    min-width: calc(724px + calc(4px * 6) * 2);
    padding: 0 calc(4px * 6);
  }

  .com-Layout__inner {
    max-width: 1024px;
    min-width: 724px;
    overflow-x: visible;
  }
}
.com-Breadcrumb {
  display: flex;
  font-size: 12px;
  padding: calc(4px * 4) 0;
}
.com-Breadcrumb__link {
  color: #999999;
}
.com-Breadcrumb__link--has-link {
  color: #e6e6e6;
}
.com-Breadcrumb__item {
  align-items: center;
  display: flex;
}
.com-Breadcrumb__arrow {
  color: #999999;
  flex-shrink: 0;
  height: 14px;
  width: 14px;
}
.com-Breadcrumb__item:last-child .link {
  color: #999999;
  cursor: default;
  user-select: none;
}
.com-Button {
  align-items: center;
  background-color: #ddaa00;
  border-radius: 4px;
  color: #212121;
  display: inline-flex;
  font-size: 14px;
  font-weight: bold;
  height: 44px;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  transition: border 0.1s ease-out, color 0.1s ease-out;
  width: 100%;
}
.com-Button:hover,
.com-Button:focus {
  background-color: #ddaa00;
  color: #212121;
}
:root {
  --com-Header-height--mobile: 44px;
}
.com-Header__wrapper {
  background-color: #000000;
  height: 68px;
  opacity: 1;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: calc(12 + 1);
}
.com-Header {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  height: 68px;
  justify-content: space-between;
  left: 0;
  position: fixed;
  top: 0;
  transition: width 0.5s cubic-bezier(0.33, 1, 0.68, 1);
  width: 100%;
  z-index: 12;
}
.com-Header__list {
  height: 100%;
  list-style: none;
}
.com-Header__logo {
  height: 60px;
  margin: 4px calc(4px * 3);
}
@media screen and (max-width: 650px) {
  .com-Header__wrapper {
    height: 44px;
  }
  .com-Header {
    height: 44px;
  }
  .com-Header__logo {
    height: 40px;
    /* figma に合わせる */
    /* stylelint-disable-next-line scale-unlimited/declaration-strict-value */
    margin: 2px;
  }
}
:root {
  /* FIXME: https://github.com/abema/abema-web/issues/22871 */
  /* stylelint-disable-next-line @abema/no-color-scheme */
  --com-Link--hover-background: var(--white-8);
  /* NOTE: https://github.com/abema/abema-web/pull/13212#issuecomment-519354205 */
  --com-Link--inline-padding: 3px;
}
.com-Link {
  border-radius: 4px;
  color: currentColor;
  display: inline-block;
  height: 100%;
  padding: 3px;
  position: relative;
  text-decoration: none;
  transition: background-color 0.1s linear;
  width: 100%;
}
.com-Link--has-link:hover,
.com-Link--has-link:focus {
  background-color: rgba(255, 255, 255, 0.08);
}
.com-LogoLink {
  align-items: center;
  color: #ffffff;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 116px;
}
.com-LogoLink__inner {
  display: block;
  height: 32px;
  width: 112px;
}
@media screen and (max-width: 650px) {
  .com-LogoLink {
    width: 85px;
  }
  .com-LogoLink__inner {
    height: 22px;
    width: 77px;
  }
}
.com-SVGImage {
  fill: currentColor;
}
.com-OptoutForm {
  margin: calc(4px * 10) 0;
}
.com-OptoutForm__status {
  display: inline-block;
  font-weight: bold;
  margin-top: calc(4px * 4);
}
.com-OptoutForm__button {
  margin-top: calc(4px * 6);
  width: 240px;
}
.com-OptoutForm__browser-info {
  color: #999999;
  margin-top: calc(4px * 6);
}
.com-SupportMailerButton {
  display: inline-block;
  margin-bottom: calc(4px * 8);
  margin-top: calc(4px * 4);
  width: 240px;
}