@charset "UTF-8";
@import url("/assets/gemini-scrollbar/gemini-scrollbar-573d21bf.css");
@import url("/assets/flatpickr/dist/flatpickr-f87cc8cb.css");
@import url("/assets/flatpickr/dist/themes/material_green-d8b89373.css");
@import url("/assets/shepherd.js/dist/css/shepherd-theme-square-dark-ee76aaea.css");
.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

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

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

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

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

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

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

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

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

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

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

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

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

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

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

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}

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

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

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

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

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

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
}

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

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

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

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

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

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

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

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

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

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

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

td,
th {
  padding: 0;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

html {
  font-family: "Roboto", "Helvetica", "Arial", sans-serif, "Droid Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic", "HiraginoSans-W3", "メイリオ", "Meiryo", "游ゴシック", YuGothic, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 300;
  font-size: 14px;
}
html * {
  box-sizing: border-box;
}

body {
  color: #222222;
  background-color: #ffffff;
  min-width: 320px;
}

input, textarea {
  color: #222222;
}

fieldset {
  border: none;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.2;
  font-weight: 300;
}

a {
  color: #84bd00;
  outline: none;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

p {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
p:first-child {
  margin-top: 0;
}
p:last-child {
  margin-bottom: 0;
}

button {
  position: relative;
  text-transform: none;
  border: none;
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  outline: none;
  line-height: 1.2;
}

.material-icons {
  vertical-align: middle;
  font-size: 24px;
}

ul, ol {
  padding-left: 2em;
}

.gm-scrollbar-container > .gm-scrollbar {
  opacity: 0 !important;
}
.gm-scrollbar-container:hover > .gm-scrollbar {
  opacity: 0.5 !important;
}

.gm-scrollbar.-horizontal {
  z-index: 20;
}
.hide-horizontal-scrollbar > .gm-scrollbar.-horizontal {
  display: none;
}

.gm-scrollbar.-vertical {
  z-index: 20;
}
.hide-vertical-scrollbar > .gm-scrollbar.-vertical {
  display: none;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 2em;
  margin-bottom: 0.5em;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
  margin-top: 0;
}

h1 {
  font-size: 4em;
  font-weight: 300;
}

h2 {
  font-size: 2em;
  font-weight: 300;
}

h3 {
  font-size: 1.5em;
  font-weight: 600;
}

h4 {
  font-size: 1.1em;
  font-weight: 600;
}

h5 {
  font-size: 1em;
  font-weight: 600;
  margin-bottom: 0.1em;
}

h6 {
  font-size: 0.85em;
  font-weight: 600;
  margin-bottom: 0.1em;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.content-padding, .content-auction .carousel-padding {
  padding: 15px !important;
}

.page-container {
  *zoom: 1;
  position: relative;
  z-index: 1;
}
.page-container:after {
  content: "";
  display: table;
  clear: both;
}

.page-main {
  position: fixed;
  left: 240px;
  right: 340px;
  top: 0;
  bottom: 0;
  overflow-x: visible;
  overflow-y: hidden;
  z-index: 1;
}
.page-container.without-extra-bar > .page-main {
  right: 0;
}
.page-main .page-main-scroll-panel {
  overflow-x: visible;
  overflow-y: auto;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .page-main {
    left: 0;
  }
  .page-main .page-main-scroll-panel {
    padding-bottom: 80px;
  }
}
@media screen and (max-width: 840px) {
  .page-main {
    right: 0;
    position: relative;
    width: auto;
    overflow: visible;
    z-index: 2;
  }
  .page-main .page-main-scroll-panel {
    padding-bottom: 0;
  }
}

.page-sidebar {
  position: fixed;
  width: 240px;
  top: 0;
  left: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.95);
  border-right: 1px solid #dddddd;
  overflow-x: visible;
  overflow-y: auto;
  z-index: 4;
  box-shadow: 1px 0 4px 0 rgba(48, 48, 48, 0.05);
  transition: left 250ms ease-in-out;
  padding-top: 75px;
  padding-bottom: 50px;
}
@media screen and (max-width: 1024px) {
  .page-sidebar {
    width: 80%;
    left: -240px;
    max-width: 240px;
    padding-top: 0;
  }
  .page-sidebar-opened .page-sidebar {
    left: 0;
  }
}

.page-sidebar-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(48, 48, 48, 0.5);
  z-index: 3;
  opacity: 0.1;
  visibility: hidden;
}
.page-sidebar-backdrop .close {
  display: block;
  width: 1.25em;
  height: 1.25em;
  line-height: 1.25em;
  background-color: rgba(255, 255, 255, 0.25);
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 4em;
  color: #ffffff;
  cursor: pointer;
  border-radius: 50%;
}
.page-sidebar-backdrop .close:hover {
  background-color: rgba(255, 255, 255, 0.5);
  transition: background-color 250ms ease-in-out;
}
.page-sidebar-opened .page-sidebar-backdrop {
  visibility: visible;
  transition: opacity 250ms ease-in-out;
  opacity: 1;
}

.page-extra {
  width: 340px;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  margin-top: -1px;
  border-left: 1px solid #dddddd;
  z-index: 2;
  box-shadow: -1px 0 4px 0 rgba(48, 48, 48, 0.05);
  display: flex;
  flex-flow: column;
  background: #ffffff;
}
.page-extra .page-extra-content {
  flex-grow: 1;
  flex-shrink: 1;
  overflow-x: visible;
  overflow-y: auto;
}
.page-extra .page-extra-footer {
  flex-grow: 0;
  flex-shrink: 0;
}
@media screen and (max-width: 840px) {
  .page-extra {
    z-index: 1;
    position: relative;
    width: auto;
    border-left: 0;
    box-shadow: none;
    display: block;
    margin-top: 0;
  }
  .page-extra .page-extra-content {
    overflow: visible;
  }
}

.gemini-scrollbar:not(.gm-prevented) {
  height: 100%;
  overflow-y: hidden !important;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.section-title {
  position: relative;
  color: #bbbbbb;
  font-size: 14px;
  font-weight: 300;
  margin: 2em 0 0.5em;
}
.section-title .nn-icon {
  font-size: 24px;
}

.chapter-title {
  font-size: 21px;
  color: #737373;
  margin: 2em 0 0.5em;
  padding: 10px;
  border-bottom: 1px solid #dddddd;
  box-shadow: 0 2px 0 rgba(48, 48, 48, 0.05);
}

.error-message-list {
  border-radius: 2px;
  background-color: #a94442;
  padding: 0.5em;
}

.error-message {
  color: #ffffff;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.loading-application {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  background-color: #fff;
}
.loading-application .inner {
  position: fixed;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.loading-application .logo {
  background: image-url("/images/logo-vertical.png") no-repeat center;
  background-size: contain;
  text-indent: -999em;
  width: 160px;
  height: 105.3333333333px;
}
@media screen and (max-width: 414px) {
  .loading-application .logo {
    width: 120px;
    height: 79px;
  }
}
.loading-application .description {
  margin-top: 1em;
  color: #737373;
}

.site-identity-container {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
}
.site-identity-container .content {
  display: block;
  width: 240px;
  height: 75px !important;
  background: rgba(255, 255, 255, 0.95);
  border-right: 1px solid #dddddd;
}
@media screen and (max-width: 1024px) {
  .site-identity-container {
    display: none;
  }
}

.site-identity-container.nn-card {
  position: relative;
  display: none !important;
}
.site-identity-container.nn-card .nn-card-inner {
  height: 60px;
}
@media screen and (max-width: 1024px) {
  .site-identity-container.nn-card {
    display: block !important;
  }
}

.site-identity {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 1em;
  font-weight: 300;
  margin: 0;
  transform: translate(-50%, -50%);
}
.site-identity .site-identity-image {
  width: auto;
}

.social-button {
  margin: 5px auto;
  font-weight: bold;
}
.social-button.twitter {
  color: #ffffff;
  background-color: #55acee;
}
.social-button.twitter:hover {
  background-color: rgba(85, 172, 238, 0.7) !important;
}
.social-button.google {
  color: #ffffff;
  background-color: #5c5c5c;
}
.social-button.google:hover {
  background-color: rgba(92, 92, 92, 0.7) !important;
}
.social-button.yahoojp {
  color: #ffffff;
  background-color: #FF0033;
}
.social-button.yahoojp:hover {
  background-color: rgba(255, 0, 51, 0.7) !important;
}

.for-development {
  position: fixed;
  z-index: 1000;
  bottom: 0;
  right: 0;
  background: rgba(48, 48, 48, 0.5);
  padding: 0.5em;
}

.brand {
  display: inline-block;
  background-size: 165px 25px;
  width: 165px;
  height: 25px;
  background-image: image-url("/images/logo-horizontal.png");
  overflow: hidden;
  text-indent: -99em;
}

.paragraph {
  margin-bottom: 2rem;
}
.paragraph .header {
  margin-bottom: 1.1rem;
  font-size: 1.1rem;
  font-weight: normal;
  border-left: solid 6px #84bd00;
  padding: 2px 0 2px 10px;
}

.browser-outdated {
  padding: 2em 4em;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.clearfix {
  *zoom: 1;
}
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.layout-flex {
  display: flex;
  justify-content: space-between;
}

.text-left,
tr.text-left > td,
tr.text-left > th,
table.text-left td,
table.text-left th {
  text-align: left !important;
}

.text-center,
tr.text-center > td,
tr.text-center > th,
table.text-center td,
table.text-center th {
  text-align: center !important;
}

.text-right,
tr.text-right > td,
tr.text-right > th,
table.text-right td,
table.text-right th {
  text-align: right !important;
}

.text-theme {
  color: #84bd00 !important;
}

.text-light {
  color: #737373 !important;
}

.text-muted {
  color: #bbbbbb !important;
}

.text-attention {
  color: #94403e !important;
}

.text-large {
  font-size: 1.5em !important;
}

.text-small {
  font-size: 0.85em !important;
}

.text-sm {
  font-size: 12px;
}

.bold {
  font-weight: 600;
}

.footnote {
  font-size: 0.75em;
  color: #737373;
  line-height: 1.2;
  margin: 0 auto 0.5em;
}

.nowrap {
  white-space: nowrap !important;
}

.inline-block {
  display: inline-block !important;
}

.cell-contains-ellipsis {
  max-width: 1px !important;
}

.fc-attention,
.fc-error {
  color: #a94442 !important;
}

.fc-theme {
  color: #84bd00 !important;
}

.fc-white {
  color: #ffffff !important;
}

.fc-black {
  color: #000000 !important;
}

.fc-black {
  color: #000000 !important;
}

.fs-ml {
  font-size: 16px !important;
}

.fs-base {
  font-size: 14px !important;
}

.fs-1em {
  font-size: 1em !important;
}

.fs-icon {
  font-size: 24px !important;
}

.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
}

.font-weight-normal {
  border-radius: 3px;
  color: #aaaaaa;
  background-color: #dddddd;
  font-size: 0.8em;
  font-weight: 300;
  padding: 0.125em 0.25em;
}
.font-weight-normal::before {
  content: "#";
}

@media screen and (min-width: 1025px) {
  .visible-narrow {
    display: none;
  }
  .visible-middle {
    display: none;
  }
  .hide-wide {
    display: none;
  }
}
@media screen and (min-width: 841px) and (max-width: 1024px) {
  .visible-narrow {
    display: none;
  }
  .visible-wide {
    display: none;
  }
  .hide-middle {
    display: none;
  }
}
@media screen and (max-width: 840px) {
  .visible-middle {
    display: none;
  }
  .visible-wide {
    display: none;
  }
  .hide-narrow {
    display: none;
  }
}
@media screen and (min-width: 415px) {
  .visible-phone {
    display: none;
  }
}
@media screen and (max-width: 414px) {
  .hide-phone {
    display: none;
  }
}
.w-xxs {
  width: 60px !important;
}

.w-xs {
  width: 80px !important;
}

.w-sm {
  width: 120px !important;
}

.w-md {
  width: 160px !important;
}

.w-ml {
  width: 200px !important;
}

.w-lg {
  width: 240px !important;
}

.w-xl {
  width: 320px !important;
}

.w-xxl {
  width: 400px !important;
}

.w-100pc, .w-full {
  width: 100% !important;
}

.w-50pc {
  width: 50% !important;
}

.w-75pc {
  width: 75% !important;
}

.w-66pc {
  width: 66.6666% !important;
}

.w-33pc {
  width: 33.3333% !important;
}

.w-25pc {
  width: 25% !important;
}

.ctrl-w-xs {
  width: 100px !important;
  max-width: 100% !important;
}

.ctrl-w-sm {
  width: 200px !important;
  max-width: 100% !important;
}

.ctrl-w-md {
  width: 300px !important;
  max-width: 100% !important;
}

.ctrl-w-lg {
  width: 400px !important;
  max-width: 100% !important;
}

.ctrl-w-xl {
  width: 500px !important;
  max-width: 100% !important;
}

.ctrl-w-full {
  width: 100% !important;
}

.mgn-none {
  margin: 0 !important;
}

.mgn-hor-none {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.mgn-ver-none {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.mgn-top-none {
  margin-top: 0 !important;
}

.mgn-rgt-none {
  margin-right: 0 !important;
}

.mgn-btm-none {
  margin-bottom: 0 !important;
}

.mgn-lft-none {
  margin-left: 0 !important;
}

.pdg-none {
  padding: 0 !important;
}

.pdg-hor-none {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.pdg-ver-none {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.pdg-top-none {
  padding-top: 0 !important;
}

.pdg-rgt-none {
  padding-right: 0 !important;
}

.pdg-btm-none {
  padding-bottom: 0 !important;
}

.pdg-lft-none {
  padding-left: 0 !important;
}

.mgn-xs {
  margin: 2px !important;
}

.mgn-hor-xs {
  margin-left: 2px !important;
  margin-right: 2px !important;
}

.mgn-ver-xs {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

.mgn-top-xs {
  margin-top: 2px !important;
}

.mgn-rgt-xs {
  margin-right: 2px !important;
}

.mgn-btm-xs {
  margin-bottom: 2px !important;
}

.mgn-lft-xs {
  margin-left: 2px !important;
}

.pdg-xs {
  padding: 2px !important;
}

.pdg-hor-xs {
  padding-left: 2px !important;
  padding-right: 2px !important;
}

.pdg-ver-xs {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

.pdg-top-xs {
  padding-top: 2px !important;
}

.pdg-rgt-xs {
  padding-right: 2px !important;
}

.pdg-btm-xs {
  padding-bottom: 2px !important;
}

.pdg-lft-xs {
  padding-left: 2px !important;
}

.mgn-sm {
  margin: 4px !important;
}

.mgn-hor-sm {
  margin-left: 4px !important;
  margin-right: 4px !important;
}

.mgn-ver-sm {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

.mgn-top-sm {
  margin-top: 4px !important;
}

.mgn-rgt-sm {
  margin-right: 4px !important;
}

.mgn-btm-sm {
  margin-bottom: 4px !important;
}

.mgn-lft-sm {
  margin-left: 4px !important;
}

.pdg-sm {
  padding: 4px !important;
}

.pdg-hor-sm {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.pdg-ver-sm {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.pdg-top-sm {
  padding-top: 4px !important;
}

.pdg-rgt-sm {
  padding-right: 4px !important;
}

.pdg-btm-sm {
  padding-bottom: 4px !important;
}

.pdg-lft-sm {
  padding-left: 4px !important;
}

.mgn-ms {
  margin: 0.5em !important;
}

.mgn-hor-ms {
  margin-left: 0.5em !important;
  margin-right: 0.5em !important;
}

.mgn-ver-ms {
  margin-top: 0.5em !important;
  margin-bottom: 0.5em !important;
}

.mgn-top-ms {
  margin-top: 0.5em !important;
}

.mgn-rgt-ms {
  margin-right: 0.5em !important;
}

.mgn-btm-ms {
  margin-bottom: 0.5em !important;
}

.mgn-lft-ms {
  margin-left: 0.5em !important;
}

.pdg-ms {
  padding: 0.5em !important;
}

.pdg-hor-ms {
  padding-left: 0.5em !important;
  padding-right: 0.5em !important;
}

.pdg-ver-ms {
  padding-top: 0.5em !important;
  padding-bottom: 0.5em !important;
}

.pdg-top-ms {
  padding-top: 0.5em !important;
}

.pdg-rgt-ms {
  padding-right: 0.5em !important;
}

.pdg-btm-ms {
  padding-bottom: 0.5em !important;
}

.pdg-lft-ms {
  padding-left: 0.5em !important;
}

.mgn-md {
  margin: 1em !important;
}

.mgn-hor-md {
  margin-left: 1em !important;
  margin-right: 1em !important;
}

.mgn-ver-md {
  margin-top: 1em !important;
  margin-bottom: 1em !important;
}

.mgn-top-md {
  margin-top: 1em !important;
}

.mgn-rgt-md {
  margin-right: 1em !important;
}

.mgn-btm-md {
  margin-bottom: 1em !important;
}

.mgn-lft-md {
  margin-left: 1em !important;
}

.pdg-md {
  padding: 1em !important;
}

.pdg-hor-md {
  padding-left: 1em !important;
  padding-right: 1em !important;
}

.pdg-ver-md {
  padding-top: 1em !important;
  padding-bottom: 1em !important;
}

.pdg-top-md {
  padding-top: 1em !important;
}

.pdg-rgt-md {
  padding-right: 1em !important;
}

.pdg-btm-md {
  padding-bottom: 1em !important;
}

.pdg-lft-md {
  padding-left: 1em !important;
}

.mgn-ml {
  margin: 2em !important;
}

.mgn-hor-ml {
  margin-left: 2em !important;
  margin-right: 2em !important;
}

.mgn-ver-ml {
  margin-top: 2em !important;
  margin-bottom: 2em !important;
}

.mgn-top-ml {
  margin-top: 2em !important;
}

.mgn-rgt-ml {
  margin-right: 2em !important;
}

.mgn-btm-ml {
  margin-bottom: 2em !important;
}

.mgn-lft-ml {
  margin-left: 2em !important;
}

.pdg-ml {
  padding: 2em !important;
}

.pdg-hor-ml {
  padding-left: 2em !important;
  padding-right: 2em !important;
}

.pdg-ver-ml {
  padding-top: 2em !important;
  padding-bottom: 2em !important;
}

.pdg-top-ml {
  padding-top: 2em !important;
}

.pdg-rgt-ml {
  padding-right: 2em !important;
}

.pdg-btm-ml {
  padding-bottom: 2em !important;
}

.pdg-lft-ml {
  padding-left: 2em !important;
}

.mgn-lg {
  margin: 4em !important;
}

.mgn-hor-lg {
  margin-left: 4em !important;
  margin-right: 4em !important;
}

.mgn-ver-lg {
  margin-top: 4em !important;
  margin-bottom: 4em !important;
}

.mgn-top-lg {
  margin-top: 4em !important;
}

.mgn-rgt-lg {
  margin-right: 4em !important;
}

.mgn-btm-lg {
  margin-bottom: 4em !important;
}

.mgn-lft-lg {
  margin-left: 4em !important;
}

.pdg-lg {
  padding: 4em !important;
}

.pdg-hor-lg {
  padding-left: 4em !important;
  padding-right: 4em !important;
}

.pdg-ver-lg {
  padding-top: 4em !important;
  padding-bottom: 4em !important;
}

.pdg-top-lg {
  padding-top: 4em !important;
}

.pdg-rgt-lg {
  padding-right: 4em !important;
}

.pdg-btm-lg {
  padding-bottom: 4em !important;
}

.pdg-lft-lg {
  padding-left: 4em !important;
}

.mgn-xl {
  margin: 6em !important;
}

.mgn-hor-xl {
  margin-left: 6em !important;
  margin-right: 6em !important;
}

.mgn-ver-xl {
  margin-top: 6em !important;
  margin-bottom: 6em !important;
}

.mgn-top-xl {
  margin-top: 6em !important;
}

.mgn-rgt-xl {
  margin-right: 6em !important;
}

.mgn-btm-xl {
  margin-bottom: 6em !important;
}

.mgn-lft-xl {
  margin-left: 6em !important;
}

.pdg-xl {
  padding: 6em !important;
}

.pdg-hor-xl {
  padding-left: 6em !important;
  padding-right: 6em !important;
}

.pdg-ver-xl {
  padding-top: 6em !important;
  padding-bottom: 6em !important;
}

.pdg-top-xl {
  padding-top: 6em !important;
}

.pdg-rgt-xl {
  padding-right: 6em !important;
}

.pdg-btm-xl {
  padding-bottom: 6em !important;
}

.pdg-lft-xl {
  padding-left: 6em !important;
}

.mgn-xxl {
  margin: 8em !important;
}

.mgn-hor-xxl {
  margin-left: 8em !important;
  margin-right: 8em !important;
}

.mgn-ver-xxl {
  margin-top: 8em !important;
  margin-bottom: 8em !important;
}

.mgn-top-xxl {
  margin-top: 8em !important;
}

.mgn-rgt-xxl {
  margin-right: 8em !important;
}

.mgn-btm-xxl {
  margin-bottom: 8em !important;
}

.mgn-lft-xxl {
  margin-left: 8em !important;
}

.pdg-xxl {
  padding: 8em !important;
}

.pdg-hor-xxl {
  padding-left: 8em !important;
  padding-right: 8em !important;
}

.pdg-ver-xxl {
  padding-top: 8em !important;
  padding-bottom: 8em !important;
}

.pdg-top-xxl {
  padding-top: 8em !important;
}

.pdg-rgt-xxl {
  padding-right: 8em !important;
}

.pdg-btm-xxl {
  padding-bottom: 8em !important;
}

.pdg-lft-xxl {
  padding-left: 8em !important;
}

.mgn-e4 {
  margin: 0.25em !important;
}

.mgn-hor-e4 {
  margin-left: 0.25em !important;
  margin-right: 0.25em !important;
}

.mgn-ver-e4 {
  margin-top: 0.25em !important;
  margin-bottom: 0.25em !important;
}

.mgn-top-e4 {
  margin-top: 0.25em !important;
}

.mgn-rgt-e4 {
  margin-right: 0.25em !important;
}

.mgn-btm-e4 {
  margin-bottom: 0.25em !important;
}

.mgn-lft-e4 {
  margin-left: 0.25em !important;
}

.pdg-e4 {
  padding: 0.25em !important;
}

.pdg-hor-e4 {
  padding-left: 0.25em !important;
  padding-right: 0.25em !important;
}

.pdg-ver-e4 {
  padding-top: 0.25em !important;
  padding-bottom: 0.25em !important;
}

.pdg-top-e4 {
  padding-top: 0.25em !important;
}

.pdg-rgt-e4 {
  padding-right: 0.25em !important;
}

.pdg-btm-e4 {
  padding-bottom: 0.25em !important;
}

.pdg-lft-e4 {
  padding-left: 0.25em !important;
}

.mgn-en {
  margin: 0.5em !important;
}

.mgn-hor-en {
  margin-left: 0.5em !important;
  margin-right: 0.5em !important;
}

.mgn-ver-en {
  margin-top: 0.5em !important;
  margin-bottom: 0.5em !important;
}

.mgn-top-en {
  margin-top: 0.5em !important;
}

.mgn-rgt-en {
  margin-right: 0.5em !important;
}

.mgn-btm-en {
  margin-bottom: 0.5em !important;
}

.mgn-lft-en {
  margin-left: 0.5em !important;
}

.pdg-en {
  padding: 0.5em !important;
}

.pdg-hor-en {
  padding-left: 0.5em !important;
  padding-right: 0.5em !important;
}

.pdg-ver-en {
  padding-top: 0.5em !important;
  padding-bottom: 0.5em !important;
}

.pdg-top-en {
  padding-top: 0.5em !important;
}

.pdg-rgt-en {
  padding-right: 0.5em !important;
}

.pdg-btm-en {
  padding-bottom: 0.5em !important;
}

.pdg-lft-en {
  padding-left: 0.5em !important;
}

.mgn-em {
  margin: 1em !important;
}

.mgn-hor-em {
  margin-left: 1em !important;
  margin-right: 1em !important;
}

.mgn-ver-em {
  margin-top: 1em !important;
  margin-bottom: 1em !important;
}

.mgn-top-em {
  margin-top: 1em !important;
}

.mgn-rgt-em {
  margin-right: 1em !important;
}

.mgn-btm-em {
  margin-bottom: 1em !important;
}

.mgn-lft-em {
  margin-left: 1em !important;
}

.pdg-em {
  padding: 1em !important;
}

.pdg-hor-em {
  padding-left: 1em !important;
  padding-right: 1em !important;
}

.pdg-ver-em {
  padding-top: 1em !important;
  padding-bottom: 1em !important;
}

.pdg-top-em {
  padding-top: 1em !important;
}

.pdg-rgt-em {
  padding-right: 1em !important;
}

.pdg-btm-em {
  padding-bottom: 1em !important;
}

.pdg-lft-em {
  padding-left: 1em !important;
}

.mgn-2em {
  margin: 2em !important;
}

.mgn-hor-2em {
  margin-left: 2em !important;
  margin-right: 2em !important;
}

.mgn-ver-2em {
  margin-top: 2em !important;
  margin-bottom: 2em !important;
}

.mgn-top-2em {
  margin-top: 2em !important;
}

.mgn-rgt-2em {
  margin-right: 2em !important;
}

.mgn-btm-2em {
  margin-bottom: 2em !important;
}

.mgn-lft-2em {
  margin-left: 2em !important;
}

.pdg-2em {
  padding: 2em !important;
}

.pdg-hor-2em {
  padding-left: 2em !important;
  padding-right: 2em !important;
}

.pdg-ver-2em {
  padding-top: 2em !important;
  padding-bottom: 2em !important;
}

.pdg-top-2em {
  padding-top: 2em !important;
}

.pdg-rgt-2em {
  padding-right: 2em !important;
}

.pdg-btm-2em {
  padding-bottom: 2em !important;
}

.pdg-lft-2em {
  padding-left: 2em !important;
}

.mgn-2em {
  margin: 2em !important;
}

.mgn-hor-2em {
  margin-left: 2em !important;
  margin-right: 2em !important;
}

.mgn-ver-2em {
  margin-top: 2em !important;
  margin-bottom: 2em !important;
}

.mgn-top-2em {
  margin-top: 2em !important;
}

.mgn-rgt-2em {
  margin-right: 2em !important;
}

.mgn-btm-2em {
  margin-bottom: 2em !important;
}

.mgn-lft-2em {
  margin-left: 2em !important;
}

.pdg-2em {
  padding: 2em !important;
}

.pdg-hor-2em {
  padding-left: 2em !important;
  padding-right: 2em !important;
}

.pdg-ver-2em {
  padding-top: 2em !important;
  padding-bottom: 2em !important;
}

.pdg-top-2em {
  padding-top: 2em !important;
}

.pdg-rgt-2em {
  padding-right: 2em !important;
}

.pdg-btm-2em {
  padding-bottom: 2em !important;
}

.pdg-lft-2em {
  padding-left: 2em !important;
}

.mgn-4em {
  margin: 4em !important;
}

.mgn-hor-4em {
  margin-left: 4em !important;
  margin-right: 4em !important;
}

.mgn-ver-4em {
  margin-top: 4em !important;
  margin-bottom: 4em !important;
}

.mgn-top-4em {
  margin-top: 4em !important;
}

.mgn-rgt-4em {
  margin-right: 4em !important;
}

.mgn-btm-4em {
  margin-bottom: 4em !important;
}

.mgn-lft-4em {
  margin-left: 4em !important;
}

.pdg-4em {
  padding: 4em !important;
}

.pdg-hor-4em {
  padding-left: 4em !important;
  padding-right: 4em !important;
}

.pdg-ver-4em {
  padding-top: 4em !important;
  padding-bottom: 4em !important;
}

.pdg-top-4em {
  padding-top: 4em !important;
}

.pdg-rgt-4em {
  padding-right: 4em !important;
}

.pdg-btm-4em {
  padding-bottom: 4em !important;
}

.pdg-lft-4em {
  padding-left: 4em !important;
}

.pdg-none {
  padding: 0 !important;
}

.mgn-ctrl-to-next {
  margin-right: 0.5em !important;
}

.mgn-icon-text {
  margin-right: 0.25em !important;
}

.vertical-align-top {
  vertical-align: top !important;
}
.vertical-align-top td, .vertical-align-top th {
  vertical-align: top !important;
}

.vertical-align-middle {
  vertical-align: middle !important;
}
.vertical-align-middle td, .vertical-align-middle th {
  vertical-align: middle !important;
}

.vertical-align-bottom {
  vertical-align: bottom !important;
}
.vertical-align-bottom td, .vertical-align-bottom th {
  vertical-align: bottom !important;
}

.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

.pull-middle-right {
  transform: translateY(-50%);
  position: absolute;
  right: 0;
  top: 50%;
}

.pull-middle-left {
  transform: translateY(-50%);
  position: absolute;
  left: 0;
  top: 50%;
}

.pull-middle-center {
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

.pull-top-right {
  position: absolute;
  top: 0;
  right: 0;
}

.pull-top-left {
  position: absolute;
  top: 0;
  left: 0;
}

.pull-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
}

.pull-bottom-left {
  position: absolute;
  bottom: 0;
  left: 0;
}

.bg-smoke {
  background-color: #ebebeb;
}

.with-blur {
  filter: blur(10px);
}
.no-cssfilters .with-blur {
  opacity: 0.75;
}

.no-cssfilters .for-blur-support-image {
  display: none !important;
}

.with-anim-spin {
  animation: spin 1.5s ease-in-out infinite;
}

.with-top-border {
  border-top: 1px solid #dddddd;
}

.nn-border-box {
  border: 1px solid #dddddd;
  margin: 1em 0.5em;
  padding: 0.5em 1em;
}

.visible-ja:not(:lang(ja)) {
  display: none;
}

.visible-en:not(:lang(en)) {
  display: none;
}

.hover {
  transition: 0.3s;
}
.hover:hover {
  opacity: 0.8;
}

.as-pointer {
  cursor: pointer;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.shepherd-target.shepherd-enabled {
  background-color: rgba(62, 165, 200, 0.5) !important;
  animation: nanairo 2.5s linear infinite;
}

.shepherd-element {
  z-index: 100;
  max-width: 300px;
}
.shepherd-element.shepherd-element-narrow {
  max-width: 240px;
}
.shepherd-element .shepherd-content {
  border-radius: 0;
}
.shepherd-element .shepherd-content header a.shepherd-cancel-link {
  color: #fff;
}
.shepherd-element .shepherd-content .shepherd-text {
  padding: 15px;
  font-size: 14px;
}
.shepherd-element .shepherd-content footer .shepherd-buttons li .shepherd-button {
  padding: 10px 12px;
  background: #84bd00;
  border-radius: 2px;
  font-size: 14px;
  letter-spacing: 0;
  transition: 0.3s;
  text-decoration: none;
}
.shepherd-element .shepherd-content footer .shepherd-buttons li .shepherd-button:hover {
  opacity: 0.7;
}
.shepherd-element.shepherd-has-title .shepherd-content header {
  border-bottom: 2px solid rgba(255, 255, 255, 0.3);
}
.shepherd-element.shepherd-has-title .shepherd-content header .shepherd-title {
  color: #679800;
}
.shepherd-element.shepherd-has-title[x-placement^=bottom] .popper__arrow {
  border-bottom-color: #fff;
}

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir=rtl] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* Slider */
.slick-loading .slick-list {
  background: #fff url("/assets/slick-carousel/slick/ajax-loader-5911f0f5.gif") center center no-repeat;
}

/* Icons */
@font-face {
  font-family: "slick";
  src: url("/assets/slick-carousel/slick/fonts/slick-447e0b23.eot");
  src: url("/assets/slick-carousel/slick/fonts/slick-447e0b23.eot?#iefix") format("embedded-opentype"), url("/assets/slick-carousel/slick/fonts/slick-74720559.woff") format("woff"), url("/assets/slick-carousel/slick/fonts/slick-a1735a41.ttf") format("truetype"), url("/assets/slick-carousel/slick/fonts/slick-c496ee3b.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}
.slick-prev:hover, .slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  outline: none;
  background: transparent;
  color: transparent;
}
.slick-prev:hover:before, .slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}
.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  color: #84bd00;
  opacity: 0.75;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -25px;
}
[dir=rtl] .slick-prev {
  left: auto;
  right: -25px;
}
.slick-prev:before {
  content: "←";
}
[dir=rtl] .slick-prev:before {
  content: "→";
}

.slick-next {
  right: -25px;
}
[dir=rtl] .slick-next {
  left: -25px;
  right: auto;
}
.slick-next:before {
  content: "→";
}
[dir=rtl] .slick-next:before {
  content: "←";
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
.slick-dots li button:hover, .slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: black;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

@font-face {
  font-family: "slick";
  src: url("/assets/slick-carousel/slick/fonts/slick-447e0b23.eot");
  src: url("/assets/slick-carousel/slick/fonts/slick-447e0b23.eot?#iefix") format("embedded-opentype"), url("/assets/slick-carousel/slick/fonts/slick-74720559.woff") format("woff"), url("/assets/slick-carousel/slick/fonts/slick-a1735a41.ttf") format("truetype"), url("/assets/slick-carousel/slick/fonts/slick-c496ee3b.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}
.slick-loading .slick-list {
  background: #fff image-url("/assets/slick-carousel/slick/ajax-loader-5911f0f5.gif") center center no-repeat;
}

#coupons .coupon {
  position: relative;
  background-color: #e8f5e9;
  color: #2e7d32;
}
#coupons .coupon .coupon-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#coupons .coupon .coupon-message {
  display: flex;
  align-items: center;
  gap: 6px;
}
#coupons .coupon .coupon-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
#coupons .coupon form {
  display: inline-block;
  flex-shrink: 0;
}
#coupons .coupon form .nn-button.as-link {
  font-weight: bold;
  margin: 0;
  padding: 0;
}
#coupons .coupon .coupon-icon {
  font-size: 1.25rem;
  flex-shrink: 0;
}
#coupons .coupon .countdown {
  font-weight: bold;
  white-space: nowrap;
  flex-shrink: 0;
  font-size: 0.85em;
}
#coupons .coupon .close {
  position: absolute;
  right: 4px;
  top: 4px;
  font-size: 1.25rem;
  font-weight: bold;
  padding: 4px 8px;
  opacity: 0.5;
  line-height: 1;
  background: none;
  border: none;
  cursor: pointer;
  color: inherit;
}
#coupons .coupon.as-trial {
  background-color: #e8f5e9;
  color: #2e7d32;
}
#coupons .coupon.as-trial30 {
  background-color: #ede7f6;
  color: #4527a0;
}
#coupons .coupon.as-comeback {
  background-color: #fff3e0;
  color: #e65100;
}
#coupons .coupon.as-sale {
  background-color: #fce4ec;
  color: #c62828;
}
#coupons .coupon.as-unlimited, #coupons .coupon.as-half-price {
  background-color: #e3f2fd;
  color: #1565c0;
}
#coupons .coupon.as-arrear {
  background-color: #fff8e1;
  color: #f57f17;
}
#coupons .coupon.as-urgent {
  background-color: #fff3e0;
  color: #e65100;
  border-left: 4px solid #ff9800;
}
#coupons .coupon.as-urgent .countdown {
  color: #e65100;
}
#coupons .coupon.as-critical {
  background-color: #fce4ec;
  color: #c62828;
  border-left: 4px solid #f44336;
  animation: pulse 2s ease-in-out infinite;
}
#coupons .coupon.as-critical .countdown {
  color: #c62828;
  font-size: 1em;
}
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.85;
  }
}
@media screen and (max-width: 840px) {
  #coupons .coupon {
    z-index: 1;
    position: relative;
    top: 0;
    padding: 10px 36px 10px 12px;
    animation-name: slideDown;
    animation-duration: 0.2s;
    animation-timing-function: ease-out;
    border-radius: 0;
  }
  @keyframes slideDown {
    0% {
      opacity: 0;
      transform: translateY(-10px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
}
@media screen and (min-width: 841px) {
  #coupons .coupon {
    z-index: 100;
    position: fixed;
    bottom: 16px;
    right: 16px;
    max-width: 400px;
    border-radius: 8px;
    padding: 12px 36px 12px 14px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    animation-name: slideUp;
    animation-duration: 0.3s;
    animation-timing-function: ease-out;
  }
  @keyframes slideUp {
    0% {
      opacity: 0;
      transform: translateY(20px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

.list-style-disc {
  list-style-type: disc !important;
  padding-left: 1em;
}
.list-style-disc li {
  margin-bottom: 0.5em;
}

.nn-ic-nanairo-color {
  overflow: hidden;
  color: transparent;
  display: inline-block;
  width: 32px;
  height: 24px;
  vertical-align: middle;
  background: image-url("/images/logo-mark.png") no-repeat center;
  background-size: contain;
}

@font-face {
  font-family: "nn-font";
  src: url("/assets/user/nn-font-531965df.ttf?emuksr") format("truetype"), url("/assets/user/nn-font-866f6d7f.woff?emuksr") format("woff"), url("/assets/user/nn-font-4c90e0f3.svg?emuksr#nn-font") format("svg");
  font-weight: 300;
  font-style: normal;
}
.nn-font, .progress .progress-pin::before {
  font-family: "nn-font" !important;
  speak: none;
  font-style: normal;
  font-weight: 300;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* material-fontsのスタイルに合わせるため =========== */
  vertical-align: middle;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.nn-ic-circle-coin:before {
  content: "\e900";
}

.nn-ic-arrow-bottom:before {
  content: "\e805";
}

.nn-ic-arrow-left:before {
  content: "\e806";
}

.nn-ic-arrow-right:before {
  content: "\e807";
}

.nn-ic-arrow-top:before {
  content: "\e808";
}

.nn-ic-auction:before {
  content: "\e809";
}

.nn-ic-circle-batsu:before {
  content: "\e80a";
}

.nn-ic-circle-info:before {
  content: "\e80c";
}

.nn-ic-circle-minus:before {
  content: "\e80d";
}

.nn-ic-circle-plus:before {
  content: "\e80f";
}

.nn-ic-clock:before {
  content: "\e810";
}

.nn-ic-email:before {
  content: "\e80b";
}

.nn-ic-event:before {
  content: "\e81b";
}

.nn-ic-favorite-line:before {
  content: "\e81c";
}

.nn-ic-favorite:before {
  content: "\e81d";
}

.nn-ic-label:before {
  content: "\e81e";
}

.nn-ic-list:before {
  content: "\e811";
}

.nn-ic-live:before {
  content: "\e812";
}

.nn-ic-man:before {
  content: "\e813";
}

.nn-ic-minus:before {
  content: "\e814";
}

.nn-ic-nanairo:before {
  content: "\e815";
}

.nn-ic-notification:before {
  content: "\e816";
}

.nn-ic-person:before {
  content: "\e817";
}

.nn-ic-picture:before {
  content: "\e818";
}

.nn-ic-plus:before {
  content: "\e819";
}

.nn-ic-power:before {
  content: "\e81a";
}

.nn-ic-send:before {
  content: "\e81f";
}

.nn-ic-settings:before {
  content: "\e820";
}

.nn-ic-snap:before {
  content: "\e823";
}

.nn-ic-timer:before {
  content: "\e826";
}

.nn-ic-video:before {
  content: "\e827";
}

.nn-ic-warning:before {
  content: "\e828";
}

.nn-ic-women:before {
  content: "\e829";
}

.nn-logo-nanairo-horizontal:before {
  content: "\e821";
}

.nn-logo-nanairo-mark:before {
  content: "\e822";
}

.nn-logo-nanairo-text:before {
  content: "\e825";
}

.nn-logo-nanairo-vertical:before {
  content: "\e824";
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-tbl-datasheet, .content-auction-bids .tbl-datasheet, #bids_info .bids-history .tbl-datasheet {
  margin: 1em 0;
  line-height: 1.2;
}
.nn-tbl-datasheet.as-bordered, .content-auction-bids .as-bordered.tbl-datasheet, #bids_info .bids-history .as-bordered.tbl-datasheet {
  border-top: 1px solid #dddddd;
}
.nn-tbl-datasheet.as-bordered td, .content-auction-bids .as-bordered.tbl-datasheet td, #bids_info .bids-history .as-bordered.tbl-datasheet td, .nn-tbl-datasheet.as-bordered th, .content-auction-bids .as-bordered.tbl-datasheet th, #bids_info .bids-history .as-bordered.tbl-datasheet th {
  border-bottom: 1px solid #dddddd;
}
.nn-tbl-datasheet.at-center, .content-auction-bids .at-center.tbl-datasheet, #bids_info .bids-history .at-center.tbl-datasheet {
  margin-left: auto;
  margin-right: auto;
}
.nn-tbl-datasheet thead th, .content-auction-bids .tbl-datasheet thead th, #bids_info .bids-history .tbl-datasheet thead th, .nn-tbl-datasheet thead td, .content-auction-bids .tbl-datasheet thead td, #bids_info .bids-history .tbl-datasheet thead td, .nn-tbl-datasheet tfoot th, .content-auction-bids .tbl-datasheet tfoot th, #bids_info .bids-history .tbl-datasheet tfoot th, .nn-tbl-datasheet tfoot td, .content-auction-bids .tbl-datasheet tfoot td, #bids_info .bids-history .tbl-datasheet tfoot td {
  background-color: #ebebeb;
}
.nn-tbl-datasheet th, .content-auction-bids .tbl-datasheet th, #bids_info .bids-history .tbl-datasheet th, .nn-tbl-datasheet td, .content-auction-bids .tbl-datasheet td, #bids_info .bids-history .tbl-datasheet td {
  text-align: left;
  padding: 0.35em 1em;
  vertical-align: top;
}
@media screen and (max-width: 414px) {
  .nn-tbl-datasheet th, .content-auction-bids .tbl-datasheet th, #bids_info .bids-history .tbl-datasheet th, .nn-tbl-datasheet td, .content-auction-bids .tbl-datasheet td, #bids_info .bids-history .tbl-datasheet td {
    padding: 0.25em 0.5em;
  }
  .nn-tbl-datasheet th:first-child, .content-auction-bids .tbl-datasheet th:first-child, #bids_info .bids-history .tbl-datasheet th:first-child, .nn-tbl-datasheet td:first-child, .content-auction-bids .tbl-datasheet td:first-child, #bids_info .bids-history .tbl-datasheet td:first-child {
    padding-left: 0;
  }
  .nn-tbl-datasheet th:last-child, .content-auction-bids .tbl-datasheet th:last-child, #bids_info .bids-history .tbl-datasheet th:last-child, .nn-tbl-datasheet td:last-child, .content-auction-bids .tbl-datasheet td:last-child, #bids_info .bids-history .tbl-datasheet td:last-child {
    padding-right: 0;
  }
}

.nn-tbl-structure td {
  vertical-align: middle;
  text-align: left;
  position: relative;
}
.nn-tbl-structure td:first-child {
  height: 40px;
}
.nn-tbl-structure td:last-child {
  text-align: right;
}

dl.nn-list {
  margin: 1em 0 1em 1em;
}
dl.nn-list dt {
  margin: 0;
  padding: 0;
  font-weight: 600;
}
dl.nn-list dt:not(:first-child) {
  margin-top: 0.5em;
}
dl.nn-list dd {
  margin: 0.25em 0 0 2em;
  padding: 0;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-box {
  *zoom: 1;
  background: #ffffff;
  padding: 1em;
  margin: 1em auto;
}
.nn-box:after {
  content: "";
  display: table;
  clear: both;
}

.nn-box-panel {
  box-shadow: 0 2px 2px 0 rgba(48, 48, 48, 0.05);
  max-width: 840px;
  width: 95%;
  padding: 2em;
  border: 1px solid #dddddd;
}
.nn-box-panel .subject {
  font-size: 2em;
  font-weight: 300;
  margin: 0 0 1em;
}
@media screen and (max-width: 480px) {
  .nn-box-panel .subject {
    font-size: 1.75em;
  }
}
.nn-box-panel .section-title {
  font-size: 1.25em;
  font-weight: 600;
  margin: 0 0 1em;
  color: #222222;
}
@media screen and (max-width: 480px) {
  .nn-box-panel {
    padding: 1em;
    width: 98%;
  }
}

.nn-box-with-caption {
  background-color: transparent;
}
.nn-box-with-caption .caption {
  background-color: #7d7d7d;
  color: #ffffff;
  font-weight: normal;
  font-size: 12px;
  display: block;
  margin: 0 16px;
  padding: 2px;
  text-align: center;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.nn-box-with-caption .body {
  background-color: #ffffff;
  border: 3px solid #dddddd;
  border-radius: 5px;
  margin: 0;
  padding: 10px 15px;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-row {
  margin: 0 auto 1.5em;
}

.nn-ctrl-group,
.nn-ctrl-wrapper {
  *zoom: 1;
  display: inline-block;
  position: relative;
  overflow: visible;
  line-height: 0;
  vertical-align: bottom;
  margin: 20px 2em 5px 0;
  padding: 0;
}
.nn-ctrl-group:after,
.nn-ctrl-wrapper:after {
  content: "";
  display: table;
  clear: both;
}
.nn-ctrl-group:last-child,
.nn-ctrl-wrapper:last-child {
  margin-right: 0;
}
.nn-ctrl-group.without-bottom-border .nn-ctrl-inner,
.nn-ctrl-wrapper.without-bottom-border .nn-ctrl-inner {
  border-bottom: hidden;
}

.nn-ctrl-group .nn-ctrl-wrapper {
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 1em;
}
.nn-ctrl-group .nn-ctrl-wrapper .nn-ctrl-inner {
  border-bottom: hidden;
}
.nn-ctrl-group .nn-ctrl-wrapper .nn-ctrl-inner::before {
  display: none;
}

.nn-radio-ctrl.nn-ctrl-wrapper,
.nn-checkbox-ctrl.nn-ctrl-wrapper,
.nn-toggle-ctrl.nn-ctrl-wrapper {
  margin-top: 0;
  margin-bottom: 0;
}

.nn-select-ctrl .nn-ctrl-inner:after {
  content: "";
  position: absolute;
  bottom: 0.5em;
  right: 5px;
  border: 5px solid transparent;
  border-top: 5px solid #bbbbbb;
}

.nn-ctrl {
  position: relative;
  z-index: 10;
}

.nn-ctrl-inner {
  *zoom: 1;
  display: block;
  position: relative;
  overflow: visible;
  margin: 0;
  line-height: 0;
  border-bottom: 1px solid #dddddd;
}
.nn-ctrl-inner:after {
  content: "";
  display: table;
  clear: both;
}
.nn-ctrl-inner::before {
  content: "";
  display: block;
  background: #84bd00;
  height: 2px;
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -1px;
  transition: ease-in-out 250ms;
}
.on-focus:not(.nn-ctrl-readonly) > .nn-ctrl-inner::before {
  right: 0;
}
.nn-ctrl-disabled .nn-ctrl-inner {
  border-bottom-style: dotted;
  color: #bbbbbb;
}
.with-ctrl-error .nn-ctrl-inner {
  border-color: #a94442;
}
.nn-ctrl-inner input, .nn-ctrl-inner select, .nn-ctrl-inner textarea {
  outline: none;
  display: inline-block;
  vertical-align: bottom;
  background: transparent;
}
.nn-ctrl-inner input[type=text],
.nn-ctrl-inner input[type=search],
.nn-ctrl-inner input[type=tel],
.nn-ctrl-inner input[type=url],
.nn-ctrl-inner input[type=email],
.nn-ctrl-inner input[type=password],
.nn-ctrl-inner input[type=datetime],
.nn-ctrl-inner input[type=date],
.nn-ctrl-inner input[type=month],
.nn-ctrl-inner input[type=week],
.nn-ctrl-inner input[type=time],
.nn-ctrl-inner input[type=number],
.nn-ctrl-inner input[type=file] {
  width: 280px;
  max-width: 100%;
  height: 30px;
  padding: 5px 0;
  border: none;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.2;
}
.with-ctrl-error .nn-ctrl-inner input[type=text],
.with-ctrl-error .nn-ctrl-inner input[type=search],
.with-ctrl-error .nn-ctrl-inner input[type=tel],
.with-ctrl-error .nn-ctrl-inner input[type=url],
.with-ctrl-error .nn-ctrl-inner input[type=email],
.with-ctrl-error .nn-ctrl-inner input[type=password],
.with-ctrl-error .nn-ctrl-inner input[type=datetime],
.with-ctrl-error .nn-ctrl-inner input[type=date],
.with-ctrl-error .nn-ctrl-inner input[type=month],
.with-ctrl-error .nn-ctrl-inner input[type=week],
.with-ctrl-error .nn-ctrl-inner input[type=time],
.with-ctrl-error .nn-ctrl-inner input[type=number],
.with-ctrl-error .nn-ctrl-inner input[type=file] {
  color: #a94442;
}
.nn-ctrl-inner input[type=checkbox],
.nn-ctrl-inner input[type=radio] {
  vertical-align: baseline;
  display: none;
}
.nn-ctrl-inner input[type=checkbox] + .nn-ctrl-option-label,
.nn-ctrl-inner input[type=radio] + .nn-ctrl-option-label {
  cursor: pointer;
}
.nn-ctrl-inner input[type=checkbox] + .nn-ctrl-option-label .mark-checkbox .mark-checked,
.nn-ctrl-inner input[type=radio] + .nn-ctrl-option-label .mark-checkbox .mark-checked {
  display: none;
}
.nn-ctrl-inner input[type=checkbox] + .nn-ctrl-option-label .mark-checkbox .mark-unchecked,
.nn-ctrl-inner input[type=radio] + .nn-ctrl-option-label .mark-checkbox .mark-unchecked {
  display: inline-block;
}
.nn-ctrl-inner input[type=checkbox]:checked + .nn-ctrl-option-label .mark-checkbox .mark-checked,
.nn-ctrl-inner input[type=radio]:checked + .nn-ctrl-option-label .mark-checkbox .mark-checked {
  display: inline-block;
}
.nn-ctrl-inner input[type=checkbox]:checked + .nn-ctrl-option-label .mark-checkbox .mark-unchecked,
.nn-ctrl-inner input[type=radio]:checked + .nn-ctrl-option-label .mark-checkbox .mark-unchecked {
  display: none;
}
.nn-ctrl-inner textarea {
  width: 280px;
  max-width: 100%;
  padding: 5px 0;
  border: none;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.2;
}
.with-ctrl-error .nn-ctrl-inner textarea {
  color: #a94442;
}
.nn-ctrl-inner select {
  appearance: none;
  width: 280px;
  max-width: 100%;
  height: 30px;
  padding: 5px 1.5em 5px 0;
  border: none;
  border-radius: 0;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.2;
  cursor: pointer;
}
.nn-ctrl-inner select::-ms-expand {
  display: none;
}
.with-ctrl-error .nn-ctrl-inner select {
  color: #a94442;
}

.nn-ctrl-extra {
  clear: both;
  display: block;
  margin: 0.25em auto;
}

.nn-ctrl-error {
  clear: both;
  display: inline-block;
  color: #ffffff;
  background-color: #a94442;
  border-radius: 2px;
  margin: 0.25em auto;
  padding: 0.125em 0.5em;
  font-size: 0.75em;
  line-height: 1.2;
}

.nn-ctrl-caret {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  color: #737373;
  cursor: pointer;
  z-index: 9;
}

.nn-ctrl-switch {
  display: inline-block;
  position: relative;
  width: 36px;
  height: 16px;
  border: 1px solid #dddddd;
  border-radius: 8px;
  background: #ebebeb;
  transform: translateY(2px);
  margin-right: 0.75em;
}
.nn-ctrl-switch::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 14px;
  border-radius: 7px;
  background: #84bd00;
  transition-duration: 250ms;
  transition-property: width;
}
.nn-ctrl-switch .handle {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  position: absolute;
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 10px;
  top: -3px;
  left: -3px;
  background: #ffffff;
  transition-duration: 250ms;
  transition-property: left, right;
}
.nn-toggle-ctrl.on-presence .nn-ctrl-switch::before {
  width: 100%;
}
.nn-toggle-ctrl.on-presence .nn-ctrl-switch .handle {
  left: 19px;
}

.nn-ctrl-option-label {
  display: inline-block;
  font-size: 14px;
  line-height: 30px;
  white-space: nowrap;
  vertical-align: baseline;
}
.nn-ctrl-option-label .mark-checkbox {
  font-size: 16px;
  margin-right: 0.125em;
  transform: translateY(-10%);
}
.nn-ctrl-option-label .mark-checkbox .mark-checked {
  color: #84bd00;
}

.nn-ctrl-label {
  display: inline-block;
  transition: ease-in-out 250ms;
  position: absolute;
  line-height: 1.2;
  white-space: nowrap;
  vertical-align: middle;
  z-index: 9;
  left: 0;
  transform: translateY(-100%);
  color: #84bd00;
  font-size: 12px;
  top: 0;
}
.with-label-action:not(.on-presence):not(.on-focus) > .nn-ctrl-inner > .nn-ctrl-label {
  transform: translateY(-50%);
  color: #bbbbbb;
  font-size: 16px;
  top: 15px;
}

.nn-ctrl-disabled input, .nn-ctrl-disabled textarea, .nn-ctrl-disabled select {
  color: #bbbbbb;
  cursor: default;
}
.nn-ctrl-disabled .nn-ctrl-caret {
  color: #bbbbbb;
}
.nn-ctrl-disabled .nn-ctrl-label {
  color: #bbbbbb;
}
.nn-ctrl-disabled .nn-ctrl-label::after {
  content: "remove_circle";
  color: #bbbbbb;
  transform: translateY(-15%);
  vertical-align: middle;
  margin-left: 0.25em;
}
.nn-ctrl-disabled .nn-ctrl-option-label {
  color: #bbbbbb !important;
  cursor: default !important;
}
.nn-ctrl-disabled .nn-ctrl-option-label .mark-checkbox * {
  color: #bbbbbb !important;
}
.nn-ctrl-disabled .fc-attention {
  color: #bbbbbb !important;
}
.nn-ctrl-disabled .nn-ctrl-switch::before {
  background: #ebebeb;
}

.nn-ctrl-clear {
  position: absolute;
  right: 0;
  z-index: 11;
  color: #bbbbbb;
}
.nn-ctrl-clear .nn-icon {
  color: #bbbbbb;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-button {
  min-width: 4.5em;
  min-height: 2.5em;
  padding: 0.65em 1em;
  font-weight: 300;
  font-size: 14px;
  line-height: 1;
  color: #737373;
  transition: 0.3s;
}
.nn-button:not(.locked):not(.as-disabled):hover {
  background-color: rgba(125, 125, 125, 0.2);
}
.nn-button.as-small {
  font-size: 12.6px;
  min-width: 0;
  min-height: 1.8em;
  padding: 0.35em 0.5em;
}
.nn-button.as-large {
  display: inline-block;
  padding: 0.75em 0.5em;
  width: 100%;
  border-radius: 10px !important;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}
.nn-button.as-large strong {
  display: block;
  margin: 0.1em 0 0.35em;
  font-size: 24px;
}
.nn-button.as-primary, .nn-button.as-default, .nn-button.as-attention, .nn-button.as-attention-vivid, .nn-button.as-muted, .nn-button.as-link, .nn-button.as-flat-muted, .nn-button.as-flat-primary, .nn-button.as-flat-attention, .nn-button.as-flat-attention-vivid, .nn-button.as-flat-white, .nn-button.as-flat-bordered {
  margin: 2px 5px;
  border-radius: 2px;
}
.nn-button.as-primary canvas, .nn-button.as-default canvas, .nn-button.as-attention canvas, .nn-button.as-attention-vivid canvas, .nn-button.as-muted canvas, .nn-button.as-link canvas, .nn-button.as-flat-muted canvas, .nn-button.as-flat-primary canvas, .nn-button.as-flat-attention canvas, .nn-button.as-flat-attention-vivid canvas, .nn-button.as-flat-white canvas, .nn-button.as-flat-bordered canvas {
  border-radius: 2px;
}
.nn-button.as-primary {
  color: #ffffff;
  background-color: #84bd00;
}
.nn-button.as-primary:not(.locked):not(.as-disabled):hover {
  background-color: rgba(132, 189, 0, 0.7);
}
.nn-button.as-default {
  background-color: #ffffff;
}
.nn-button.as-default:not(.locked):not(.as-disabled):hover {
  background-color: rgba(125, 125, 125, 0.2);
}
.nn-button.as-attention {
  color: #ffffff;
  background-color: #a94442;
}
.nn-button.as-attention:not(.locked):not(.as-disabled):hover {
  background-color: rgba(169, 68, 66, 0.7);
}
.nn-button.as-attention-vivid {
  color: #ffffff;
  background-color: #e5361f;
}
.nn-button.as-attention-vivid:not(.locked):not(.as-disabled):hover {
  background-color: rgba(229, 54, 31, 0.7);
}
.nn-button.as-muted {
  color: #ffffff;
  background-color: #999999;
}
.nn-button.as-muted:not(.locked):not(.as-disabled):hover {
  background-color: rgba(153, 153, 153, 0.7);
}
.nn-button.as-link {
  color: #84bd00;
}
.nn-button.as-link:not(.locked):not(.as-disabled):hover {
  background-color: rgba(132, 189, 0, 0.2);
}
.nn-button.as-flat-muted {
  color: #bbbbbb;
}
.nn-button.as-flat-primary {
  color: #84bd00;
}
.nn-button.as-flat-primary:not(.locked):not(.as-disabled):hover {
  background-color: rgba(132, 189, 0, 0.2);
}
.nn-button.as-flat-attention {
  color: #a94442;
}
.nn-button.as-flat-attention:not(.locked):not(.as-disabled):hover {
  background-color: rgba(169, 68, 66, 0.2);
}
.nn-button.as-flat-attention-vivid {
  color: #e5361f;
}
.nn-button.as-flat-attention-vivid:not(.locked):not(.as-disabled):hover {
  background-color: rgba(229, 54, 31, 0.2);
}
.nn-button.as-flat-white {
  color: #ffffff;
}
.nn-button.as-flat-white:not(.locked):not(.as-disabled):hover {
  background-color: rgba(125, 125, 125, 0.2);
}
.nn-button.as-flat-bordered {
  color: #84bd00;
  border: #84bd00 1px solid;
}
.nn-button.as-flat-bordered:not(.locked):not(.as-disabled):hover {
  background-color: rgba(132, 189, 0, 0.2);
}
.nn-button.as-shadowed {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
}
.nn-button.as-no-action {
  cursor: default;
}
.nn-button.locked {
  cursor: default;
}
.nn-button.as-disabled, .nn-button.as-disabled.as-primary, .nn-button.as-disabled.as-default, .nn-button.as-disabled.as-attention, .nn-button.as-disabled.as-muted, .nn-button.as-disabled.as-link, .nn-button.as-disabled.as-flat-primary, .nn-button.as-disabled.as-flat-attention, .nn-button.as-disabled.as-flat-white {
  color: #737373;
  background: #ffffff;
  opacity: 0.5;
}
.nn-button.as-icon {
  min-width: 2.5em;
  width: 2.5em;
  height: 2.5em;
  padding: 0;
  border-radius: 50%;
}
.nn-button.as-icon canvas {
  border-radius: 50%;
}
.nn-button.as-fab {
  min-width: 3.5em;
  width: 3.5em;
  height: 3.5em;
  padding: 0;
  border-radius: 50%;
}
.nn-button.as-fab canvas {
  border-radius: 50%;
}
.nn-button > .nn-icon {
  font-size: 24px;
  margin-top: -12px;
  margin-bottom: -12px;
}
.nn-button:first-child > .nn-icon {
  margin-right: 4px;
}
.nn-button:last-child > .nn-icon {
  margin-left: 4px;
}
.nn-button.as-icon > .nn-icon, .nn-button.as-fab > .nn-icon {
  margin-right: 0;
  margin-left: 0;
}

a.nn-button:not(.as-flat-muted), a.nn-button:not(.as-flat-primary), a.nn-button:not(.as-flat-attention), a.nn-button:not(.as-flat-attention-vivid), a.nn-button:not(.as-flat-white) {
  text-decoration: none;
}

.nn-button:disabled {
  pointer-events: none;
}

.nn-button.thumbnail.youtube:not(.locked):not(.as-disabled):hover {
  background-color: black;
  opacity: 0.9;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-icon {
  font-size: 24px;
  line-height: 1 !important;
}
.nn-icon.as-inline {
  font-size: 1.2em;
}
.nn-icon.as-theme {
  color: #84bd00;
}
.nn-icon.as-muted {
  color: #bbbbbb;
}
.nn-icon.as-attention {
  color: #a94442;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-pager-wrapper {
  *zoom: 1;
  text-align: center;
}
.nn-pager-wrapper:after {
  content: "";
  display: table;
  clear: both;
}

.nn-pager {
  margin: 1em auto 2em;
}
.nn-pager .item {
  display: inline-block;
  color: #737373;
  max-width: 3.5em;
  min-width: 0;
  width: 11%;
  margin: 0;
  padding: 0;
}
.nn-pager .item.is-current {
  opacity: 1;
  border-bottom: 2px solid #84bd00;
}
.nn-pager .more {
  color: #737373;
}
.nn-pager a:hover {
  text-decoration: none;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-card {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  color: #737373;
  width: auto;
  height: auto;
  min-height: 50px;
  background: #ffffff;
  font-size: 12px;
}
.nn-card.no-action-card {
  width: 100%;
}
.nn-card.as-disabled {
  opacity: 0.5;
}
.nn-card.ellipsis .nn-card-inner {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.nn-card.with-top-border {
  border-top: 1px solid #dddddd;
}
.nn-card.with-ranking-mark .nn-card-inner .thumbnail:after {
  position: absolute;
  top: 6px;
  left: 6px;
  z-index: 1;
  display: inline-block;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  background-color: #aba871;
  color: #ffffff;
  vertical-align: middle;
  text-align: center;
  line-height: 2em;
  font-size: 14px;
}
.nn-card.with-ranking-mark-1 .nn-card-inner .thumbnail:after {
  content: "1";
}
.nn-card.with-ranking-mark-2 .nn-card-inner .thumbnail:after {
  content: "2";
}
.nn-card.with-ranking-mark-3 .nn-card-inner .thumbnail:after {
  content: "3";
}
.nn-card.with-ranking-mark-4 .nn-card-inner .thumbnail:after {
  content: "4";
}
.nn-card.with-ranking-mark-5 .nn-card-inner .thumbnail:after {
  content: "5";
}
.nn-card.with-ranking-mark-6 .nn-card-inner .thumbnail:after {
  content: "6";
}
.nn-card.with-ranking-mark-7 .nn-card-inner .thumbnail:after {
  content: "7";
}
.nn-card.with-ranking-mark-8 .nn-card-inner .thumbnail:after {
  content: "8";
}
.nn-card.with-ranking-mark-9 .nn-card-inner .thumbnail:after {
  content: "9";
}
.nn-card.with-ranking-mark-10 .nn-card-inner .thumbnail:after {
  content: "10";
}
.nn-card.with-ranking-mark-11 .nn-card-inner .thumbnail:after {
  content: "11";
}
.nn-card.with-ranking-mark-12 .nn-card-inner .thumbnail:after {
  content: "12";
}
.nn-card.with-ranking-mark-13 .nn-card-inner .thumbnail:after {
  content: "13";
}
.nn-card.with-ranking-mark-14 .nn-card-inner .thumbnail:after {
  content: "14";
}
.nn-card.with-ranking-mark-15 .nn-card-inner .thumbnail:after {
  content: "15";
}
.nn-card.with-ranking-mark-16 .nn-card-inner .thumbnail:after {
  content: "16";
}
.nn-card.with-ranking-mark-17 .nn-card-inner .thumbnail:after {
  content: "17";
}
.nn-card.with-ranking-mark-18 .nn-card-inner .thumbnail:after {
  content: "18";
}
.nn-card.with-ranking-mark-19 .nn-card-inner .thumbnail:after {
  content: "19";
}
.nn-card.with-ranking-mark-20 .nn-card-inner .thumbnail:after {
  content: "20";
}
.nn-card.with-ranking-mark-21 .nn-card-inner .thumbnail:after {
  content: "21";
}
.nn-card.with-ranking-mark-22 .nn-card-inner .thumbnail:after {
  content: "22";
}
.nn-card.with-ranking-mark-23 .nn-card-inner .thumbnail:after {
  content: "23";
}
.nn-card.with-ranking-mark-24 .nn-card-inner .thumbnail:after {
  content: "24";
}
.nn-card.with-ranking-mark-25 .nn-card-inner .thumbnail:after {
  content: "25";
}
.nn-card.with-ranking-mark-26 .nn-card-inner .thumbnail:after {
  content: "26";
}
.nn-card.with-ranking-mark-27 .nn-card-inner .thumbnail:after {
  content: "27";
}
.nn-card.with-ranking-mark-28 .nn-card-inner .thumbnail:after {
  content: "28";
}
.nn-card.with-ranking-mark-29 .nn-card-inner .thumbnail:after {
  content: "29";
}
.nn-card.with-ranking-mark-30 .nn-card-inner .thumbnail:after {
  content: "30";
}
.nn-card.with-ranking-mark-31 .nn-card-inner .thumbnail:after {
  content: "31";
}
.nn-card.with-ranking-mark-32 .nn-card-inner .thumbnail:after {
  content: "32";
}
.nn-card.with-ranking-mark-33 .nn-card-inner .thumbnail:after {
  content: "33";
}
.nn-card.with-ranking-mark-34 .nn-card-inner .thumbnail:after {
  content: "34";
}
.nn-card.with-ranking-mark-35 .nn-card-inner .thumbnail:after {
  content: "35";
}
.nn-card.with-ranking-mark-36 .nn-card-inner .thumbnail:after {
  content: "36";
}
.nn-card.with-ranking-mark-37 .nn-card-inner .thumbnail:after {
  content: "37";
}
.nn-card.with-ranking-mark-38 .nn-card-inner .thumbnail:after {
  content: "38";
}
.nn-card.with-ranking-mark-39 .nn-card-inner .thumbnail:after {
  content: "39";
}
.nn-card.with-ranking-mark-40 .nn-card-inner .thumbnail:after {
  content: "40";
}
.nn-card.with-ranking-mark-41 .nn-card-inner .thumbnail:after {
  content: "41";
}
.nn-card.with-ranking-mark-42 .nn-card-inner .thumbnail:after {
  content: "42";
}
.nn-card.with-ranking-mark-43 .nn-card-inner .thumbnail:after {
  content: "43";
}
.nn-card.with-ranking-mark-44 .nn-card-inner .thumbnail:after {
  content: "44";
}
.nn-card.with-ranking-mark-45 .nn-card-inner .thumbnail:after {
  content: "45";
}
.nn-card.with-ranking-mark-46 .nn-card-inner .thumbnail:after {
  content: "46";
}
.nn-card.with-ranking-mark-47 .nn-card-inner .thumbnail:after {
  content: "47";
}
.nn-card.with-ranking-mark-48 .nn-card-inner .thumbnail:after {
  content: "48";
}
.nn-card.with-ranking-mark-49 .nn-card-inner .thumbnail:after {
  content: "49";
}
.nn-card.with-ranking-mark-50 .nn-card-inner .thumbnail:after {
  content: "50";
}
.nn-card.with-ranking-mark-51 .nn-card-inner .thumbnail:after {
  content: "51";
}
.nn-card.with-ranking-mark-52 .nn-card-inner .thumbnail:after {
  content: "52";
}
.nn-card.with-ranking-mark-53 .nn-card-inner .thumbnail:after {
  content: "53";
}
.nn-card.with-ranking-mark-54 .nn-card-inner .thumbnail:after {
  content: "54";
}
.nn-card.with-ranking-mark-55 .nn-card-inner .thumbnail:after {
  content: "55";
}
.nn-card.with-ranking-mark-56 .nn-card-inner .thumbnail:after {
  content: "56";
}
.nn-card.with-ranking-mark-57 .nn-card-inner .thumbnail:after {
  content: "57";
}
.nn-card.with-ranking-mark-58 .nn-card-inner .thumbnail:after {
  content: "58";
}
.nn-card.with-ranking-mark-59 .nn-card-inner .thumbnail:after {
  content: "59";
}
.nn-card.with-ranking-mark-60 .nn-card-inner .thumbnail:after {
  content: "60";
}
.nn-card.with-ranking-mark-61 .nn-card-inner .thumbnail:after {
  content: "61";
}
.nn-card.with-ranking-mark-62 .nn-card-inner .thumbnail:after {
  content: "62";
}
.nn-card.with-ranking-mark-63 .nn-card-inner .thumbnail:after {
  content: "63";
}
.nn-card.with-ranking-mark-64 .nn-card-inner .thumbnail:after {
  content: "64";
}
.nn-card.with-ranking-mark-65 .nn-card-inner .thumbnail:after {
  content: "65";
}
.nn-card.with-ranking-mark-66 .nn-card-inner .thumbnail:after {
  content: "66";
}
.nn-card.with-ranking-mark-67 .nn-card-inner .thumbnail:after {
  content: "67";
}
.nn-card.with-ranking-mark-68 .nn-card-inner .thumbnail:after {
  content: "68";
}
.nn-card.with-ranking-mark-69 .nn-card-inner .thumbnail:after {
  content: "69";
}
.nn-card.with-ranking-mark-70 .nn-card-inner .thumbnail:after {
  content: "70";
}
.nn-card.with-ranking-mark-71 .nn-card-inner .thumbnail:after {
  content: "71";
}
.nn-card.with-ranking-mark-72 .nn-card-inner .thumbnail:after {
  content: "72";
}
.nn-card.with-ranking-mark-73 .nn-card-inner .thumbnail:after {
  content: "73";
}
.nn-card.with-ranking-mark-74 .nn-card-inner .thumbnail:after {
  content: "74";
}
.nn-card.with-ranking-mark-75 .nn-card-inner .thumbnail:after {
  content: "75";
}
.nn-card.with-ranking-mark-76 .nn-card-inner .thumbnail:after {
  content: "76";
}
.nn-card.with-ranking-mark-77 .nn-card-inner .thumbnail:after {
  content: "77";
}
.nn-card.with-ranking-mark-78 .nn-card-inner .thumbnail:after {
  content: "78";
}
.nn-card.with-ranking-mark-79 .nn-card-inner .thumbnail:after {
  content: "79";
}
.nn-card.with-ranking-mark-80 .nn-card-inner .thumbnail:after {
  content: "80";
}
.nn-card.with-ranking-mark-81 .nn-card-inner .thumbnail:after {
  content: "81";
}
.nn-card.with-ranking-mark-82 .nn-card-inner .thumbnail:after {
  content: "82";
}
.nn-card.with-ranking-mark-83 .nn-card-inner .thumbnail:after {
  content: "83";
}
.nn-card.with-ranking-mark-84 .nn-card-inner .thumbnail:after {
  content: "84";
}
.nn-card.with-ranking-mark-85 .nn-card-inner .thumbnail:after {
  content: "85";
}
.nn-card.with-ranking-mark-86 .nn-card-inner .thumbnail:after {
  content: "86";
}
.nn-card.with-ranking-mark-87 .nn-card-inner .thumbnail:after {
  content: "87";
}
.nn-card.with-ranking-mark-88 .nn-card-inner .thumbnail:after {
  content: "88";
}
.nn-card.with-ranking-mark-89 .nn-card-inner .thumbnail:after {
  content: "89";
}
.nn-card.with-ranking-mark-90 .nn-card-inner .thumbnail:after {
  content: "90";
}
.nn-card.with-ranking-mark-91 .nn-card-inner .thumbnail:after {
  content: "91";
}
.nn-card.with-ranking-mark-92 .nn-card-inner .thumbnail:after {
  content: "92";
}
.nn-card.with-ranking-mark-93 .nn-card-inner .thumbnail:after {
  content: "93";
}
.nn-card.with-ranking-mark-94 .nn-card-inner .thumbnail:after {
  content: "94";
}
.nn-card.with-ranking-mark-95 .nn-card-inner .thumbnail:after {
  content: "95";
}
.nn-card.with-ranking-mark-96 .nn-card-inner .thumbnail:after {
  content: "96";
}
.nn-card.with-ranking-mark-97 .nn-card-inner .thumbnail:after {
  content: "97";
}
.nn-card.with-ranking-mark-98 .nn-card-inner .thumbnail:after {
  content: "98";
}
.nn-card.with-ranking-mark-99 .nn-card-inner .thumbnail:after {
  content: "99";
}
.nn-card.with-ranking-mark-100 .nn-card-inner .thumbnail:after {
  content: "100";
}
.nn-card .nn-card-inner {
  *zoom: 1;
  display: block;
  border-radius: 0;
  background: #ffffff;
  padding: 5px;
  width: 100%;
  height: auto;
  min-height: 50px;
  text-align: left;
  text-transform: none;
  font-weight: 300;
  font-size: 12px;
}
.nn-card .nn-card-inner:after {
  content: "";
  display: table;
  clear: both;
}
.nn-card .nn-card-inner > *:first-child {
  margin-top: 0;
}
.nn-card .nn-card-row {
  margin-top: 1em;
}
.nn-card .nn-card-row > *:first-child {
  margin-top: 0;
}
.nn-card .nn-card-row.with-top-margin {
  margin-top: 2em;
}
.nn-card * {
  line-height: 1.4;
}
.nn-card p:not(:last-child) {
  margin: 0 0 0.25em;
}
.nn-card button {
  color: inherit;
}
.nn-card .extra-icon {
  font-size: 24px;
}
.nn-card .thumbnail-wrapper {
  display: block;
  position: relative;
  margin: 0 0 5px;
  color: #ffffff;
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
}
.nn-card .thumbnail-wrapper .nn-icon {
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
}
.nn-card .thumbnail-wrapper .nn-favorite-mark {
  position: absolute;
  top: 2px;
  right: 2px;
}
.nn-card .thumbnail-wrapper .nn-emblem-mark {
  margin: 0.25em;
}
.nn-card .thumbnail-wrapper .content-type-icon {
  margin: 0.25em;
  line-height: 1;
}
.nn-card .thumbnail-wrapper .hdr-icon {
  width: 15%;
  margin-left: 12px;
  margin-top: 12px;
}
.nn-card .thumbnail-wrapper .hdr-icon img {
  width: 100%;
}
.nn-card .thumbnail-wrapper .content-meta {
  margin: 0.75em;
  text-shadow: -0.5px -0.5px 0 #505050, 0.5px -0.5px 0 #505050, -0.5px 0.5px 0 #505050, 0.5px 0.5px 0 #505050;
}
.nn-card .thumbnail-wrapper.rounded .thumbnail {
  border-radius: 50%;
}
.nn-card .thumbnail-wrapper.with-rounded-white-mask .thumbnail::before {
  content: "";
  background: url("/assets/user/rounded-white-mask-ef0c31ca.svg");
  background-size: 100% 100%;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.5;
}
.nn-card .thumbnail {
  display: block;
  width: 100%;
  height: 0;
  padding: 0 0 100%;
  margin: 0;
  background-color: #ebebeb;
  background-size: cover;
  color: #ffffff;
}
.nn-card .thumbnail.youtube {
  background-color: black;
}
.nn-card .subject,
.nn-card .subject a {
  font-size: 14px;
  color: #222222;
  font-weight: 600;
  margin: 0 0 2px;
  text-decoration: none;
}
.nn-card .caption {
  color: #737373;
  font-weight: 300;
  margin: 0 0 2px;
}
.nn-card .author,
.nn-card .meta {
  color: #737373;
  font-weight: 300;
  margin: 0 0 2px;
}
.nn-card .datetime {
  color: #bbbbbb;
}

.nn-card-list, .nn-card-list ul {
  list-style: none;
  margin: 0 auto;
  padding: 0;
}
.nn-card-list li {
  margin: 0;
  padding: 0;
}
.nn-card-list .section {
  position: relative;
}
.nn-card-list .section:not(:first-child) {
  border-top: 1px solid #dddddd;
}

.nn-card-list.as-tile {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  padding: 5px;
}
.nn-card-list.as-tile .nn-card {
  width: 33.333%;
}
.nn-card-list.as-tile .nn-card.with-card-extra {
  padding-bottom: 40px;
}
.nn-card-list.as-tile .nn-card .card-extra {
  position: absolute;
  bottom: 0;
  width: 100%;
  margin: 0;
  height: 40px;
}
@media screen and (min-width: 1901px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 20%;
  }
}
@media screen and (min-width: 1601px) and (max-width: 1900px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 25%;
  }
}
@media screen and (min-width: 1141px) and (max-width: 1600px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 33.333%;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1140px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 50%;
  }
}
@media screen and (min-width: 841px) and (max-width: 1024px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 33.333%;
  }
}
@media screen and (min-width: 641px) and (max-width: 840px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 33.333%;
  }
}
@media screen and (min-width: 421px) and (max-width: 640px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 50%;
  }
}
@media screen and (max-width: 420px) {
  .page-main .nn-card-list.as-tile .nn-card {
    width: 50%;
  }
}
.nn-card-list.as-tile .nn-card.card-cast.with-card-extra,
.nn-card-list.as-tile .nn-card.card-label.with-card-extra {
  padding-bottom: 64px;
}
.nn-card-list.as-tile .nn-card.card-cast .card-extra,
.nn-card-list.as-tile .nn-card.card-label .card-extra {
  height: 64px;
  padding-bottom: 27px;
  padding-top: 7px;
}
.nn-card-list.as-tile .nn-card.card-cast .card-extra.with-thumbnail,
.nn-card-list.as-tile .nn-card.card-label .card-extra.with-thumbnail {
  min-height: 44px;
  padding-left: 40px;
  padding-bottom: 64px;
  padding-top: 5px;
  padding-right: 5px;
}
.nn-card-list.as-tile .nn-card.card-cast .card-extra .thumbnail-wrapper,
.nn-card-list.as-tile .nn-card.card-label .card-extra .thumbnail-wrapper {
  position: absolute;
  left: 5px;
  top: 7px;
}
.nn-card-list.as-tile .nn-card.card-cast .card-extra .thumbnail,
.nn-card-list.as-tile .nn-card.card-label .card-extra .thumbnail {
  width: 30px;
  height: 30px;
  margin: 0;
  background-color: #ebebeb;
  background-size: cover;
  padding-bottom: 0;
}
.nn-card-list.as-tile .nn-card.card-cast .card-extra .caption,
.nn-card-list.as-tile .nn-card.card-label .card-extra .caption {
  font-size: 10px;
  text-align: left;
}
.nn-card-list.as-tile .nn-card.card-cast .card-extra .publish-at,
.nn-card-list.as-tile .nn-card.card-label .card-extra .publish-at {
  font-size: 10px;
  text-align: right;
}

.nn-card-list.as-list .section-title {
  background-color: #ffffff;
  margin: 0;
  font-size: 14px;
  padding: 17px 14px;
  min-height: 50px;
}
.nn-card-list.as-list .section-title.nn-card {
  padding: 0;
}
.nn-card-list.as-list .section-title .nn-card-inner {
  color: #bbbbbb;
  font-size: 14px;
}
.nn-card-list.as-list .section-title .nn-button {
  margin: -1em 0;
}
.nn-card-list.as-list .nn-card .nn-button.nn-card-inner {
  margin: 0;
}
.nn-card-list.as-list .nn-card .nn-button.nn-card-inner:hover {
  background-color: rgba(125, 125, 125, 0.2);
}
.nn-card-list.as-list .nn-card.with-thumbnail .nn-card-inner {
  min-height: 74px;
  padding-left: 86px;
}
.nn-card-list.as-list .nn-card.as-single .nn-card-inner {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 17px 14px;
}
.nn-card-list.as-list .nn-card.as-weak-message .nn-card-inner {
  padding: 17px 14px;
  color: #bbbbbb;
}
.nn-card-list.as-list .nn-card.with-card-icon .nn-card-inner {
  padding-left: 54px;
}
.nn-card-list.as-list .nn-card .card-icon {
  position: absolute;
  top: 50%;
  left: 14px;
  transform: translateY(-50%);
  font-size: 24px;
  margin-left: 0;
}
.nn-card-list.as-list .nn-card .card-icon-right {
  position: absolute;
  top: 50%;
  right: 5px;
  transform: translateY(-50%);
  font-size: 24px;
}
.nn-card-list.as-list .nn-card.with-card-icon-right .nn-card-inner, .nn-card-list.as-list .nn-card.with-card-extra .nn-card-inner {
  padding-right: 48px;
}
.nn-card-list.as-list .nn-card .card-extra {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
  right: 5px;
}
.nn-card-list.as-list .nn-card .card-extra .nn-button {
  margin: 0;
}
.nn-card-list.as-list .nn-card .nn-card-inner {
  padding: 7px 14px;
}
.nn-card-list.as-list .nn-card .thumbnail-wrapper {
  position: absolute;
  left: 14px;
  top: 7px;
}
.nn-card-list.as-list .nn-card .thumbnail {
  width: 60px;
  height: 60px;
  margin: 0;
  background-color: #ebebeb;
  background-size: cover;
  padding-bottom: 0;
}

.nn-card-list-header {
  *zoom: 1;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  border-bottom: 1px solid #dddddd;
}
.nn-card-list-header:after {
  content: "";
  display: table;
  clear: both;
}

.nn-card-list-footer {
  *zoom: 1;
  text-align: center;
  margin-top: 1em;
  margin-bottom: 2em;
}
.nn-card-list-footer:after {
  content: "";
  display: table;
  clear: both;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-label-card {
  position: relative;
  background: no-repeat center;
  background-size: cover;
  color: #ffffff;
}
.nn-label-card.is-locked {
  display: none;
}
.nn-label-card:before {
  content: "";
  display: block;
  padding-top: 50%;
}
.nn-label-card .content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 15px;
}
.nn-label-card, .nn-label-card .nn-button.as-icon {
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
}
.nn-label-card:hover {
  opacity: 0.8;
  cursor: pointer;
  transition: 0.3s;
}
.nn-label-card .nn-emblem-mark {
  display: block;
}
.nn-label-card .metaline {
  margin: -30px -15px -15px;
  padding: 30px 15px 15px;
  min-height: 90px;
}
.nn-label-card .metaline.with-gradient-shade {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
}
.nn-label-card .metaline .metaline-extra {
  float: right;
  min-height: 4em;
}
.nn-label-card .metaline .subject {
  margin: 0;
  font-size: 1.75em;
  font-weight: 300;
  line-height: 1.2;
}
.nn-label-card .metaline .subject > .nn-icon {
  font-size: 1.4em;
  transform: translate(0, -8%);
  margin-right: 0.25em;
  color: #bbbbbb;
}
.nn-label-card .metaline .caption {
  margin: 0.25em auto 0;
  font-size: 1.2em;
  font-weight: 300;
  line-height: 1.2;
}
@media screen and (max-width: 414px) {
  .nn-label-card .metaline .subject {
    font-size: 1.5em;
  }
  .nn-label-card .metaline .subject .nn-icon {
    font-size: 1.2em;
  }
  .nn-label-card .metaline .caption {
    font-size: 1em;
  }
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-big-panel {
  box-shadow: 0 2px 2px 0 rgba(48, 48, 48, 0.05);
  transform: translate(-50%, -50%);
  position: fixed;
  top: 48%;
  left: 50%;
  border: 1px solid #dddddd;
  max-width: 840px;
  width: 95%;
  padding: 2em;
  background-color: #ffffff;
}
.nn-big-panel .layout-flex > section {
  width: 47.5%;
}
.nn-big-panel .subject {
  font-size: 2em;
  font-weight: 300;
  margin: 0 0 1em;
}
.nn-big-panel .section-title {
  font-size: 1.25em;
  font-weight: 600;
  margin: 0 0 1em;
  color: #222222;
}
.nn-big-panel .social-button {
  width: 100%;
  font-weight: bold;
}
@media screen and (max-width: 480px) {
  .nn-big-panel .subject {
    font-size: 1.75em;
  }
}

.login-panel {
  margin: 2em auto;
  transform: translate(0, 0);
  top: auto;
  left: auto;
  position: relative;
}
.login-panel .brand {
  float: right;
}
@media screen and (max-width: 480px) {
  .login-panel .brand {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .login-panel .layout-flex {
    display: block;
  }
  .login-panel .layout-flex > section {
    margin-top: 2em;
    width: auto !important;
  }
}
@media screen and (min-width: 481px) and (max-width: 640px) {
  .login-panel {
    margin: 1em;
  }
}
@media screen and (max-width: 480px) {
  .login-panel {
    padding: 1em;
    margin: 1em auto;
  }
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-tag {
  display: inline-block;
  position: relative;
  font-size: 0.8em;
  padding: 0.2em 0.5em;
  border-radius: 0.3em;
  color: #ffffff;
  background-color: #737373;
  line-height: 1;
  text-align: center;
  vertical-align: middle;
}
.nn-tag.as-theme {
  background-color: #84bd00;
}
.nn-tag.as-muted {
  background-color: #bbbbbb;
}
.nn-tag.as-black {
  background-color: #303030;
}
.nn-tag.as-attention {
  background-color: #a94442;
}
.nn-tag.as-attention-vivid {
  background: #e5361f;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-thumbnail.thumbnail-image {
  width: 100%;
}
.nn-thumbnail.thumbnail-video {
  position: relative;
  top: 0;
  width: 100%;
}
.nn-thumbnail.thumbnail-video .thumbnail-video__progress {
  position: absolute;
  top: 0;
  height: 3px;
  width: 100%;
  background-color: transparent;
}
@keyframes progress {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
.nn-thumbnail.thumbnail-video .thumbnail-video__progress .thumbnail-video__progress-bar {
  background-color: #679800;
  height: 3px;
  animation: progress 0.5s linear 0s 1 normal;
}
.nn-thumbnail.thumbnail-video video {
  width: 100%;
}
.nn-thumbnail.thumbnail-video img {
  width: 100%;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-badge {
  display: inline-block;
  position: relative;
  font-size: 0.85em;
  padding: 0.4em;
  min-width: 1.8em;
  border-radius: 0.4em;
  background-color: #737373;
  line-height: 1;
  text-align: center;
  vertical-align: middle;
}
.nn-badge.as-theme {
  background-color: #84bd00;
  color: #ffffff;
}
.nn-badge.as-muted {
  background-color: #bbbbbb;
  color: #ffffff;
}
.nn-badge.as-black {
  background-color: #303030;
  color: #ffffff;
}
.nn-badge.as-attention {
  background-color: #a94442;
  color: #ffffff;
}
.nn-badge.as-rounded {
  border-radius: 1em;
  padding: 0.4em 1em;
}
.nn-badge.as-pointer {
  cursor: pointer;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-tooltip {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  font-size: 12px !important;
  padding: 0.5em 1em;
  z-index: 999;
  font-weight: 300;
  color: #ffffff;
  background: rgba(0, 0, 0, 0.9);
  border-radius: 4px;
  max-width: 32em;
  line-height: 1.4;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-data-banner {
  display: inline-block;
  position: relative;
  font-size: 1em;
  padding: 0;
  margin: 2px 5px;
  border: 3px solid #dddddd;
  overflow: hidden;
  vertical-align: middle;
  border-radius: 5px;
  white-space: nowrap;
  background: #ffffff;
}
.nn-data-banner.as-suspend-title {
  overflow: visible;
}
.nn-data-banner.as-suspend-title.as-top-margin-with-title {
  margin-top: 24px;
}
.nn-data-banner.as-suspend-title .title {
  padding: 2.5px 0.5em;
  line-height: 1;
  font-size: 12px;
  height: 19px;
  position: absolute;
  left: 5px;
  right: 5px;
  border-bottom: 3px solid #dddddd;
  border-radius: 5px 5px 0 0;
  transform: translateY(-100%);
}
.nn-data-banner.as-suspend-title .description {
  border-radius: 5px;
}
.nn-data-banner .title, .nn-data-banner .description {
  padding: 0.5em 0;
  margin: 0 1em;
  display: inline-block;
  text-align: center;
}
@media screen and (max-width: 414px) {
  .nn-data-banner .title, .nn-data-banner .description {
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
}
.nn-data-banner .title {
  font-weight: 600;
  background: #7d7d7d;
  color: #ffffff;
}
.nn-data-banner .description {
  font-weight: 300;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-column-layout {
  display: flex;
  flex-wrap: wrap;
}
.nn-column-layout .flex-grow-1 {
  flex-grow: 1;
}
.nn-column-layout > .nn-column {
  padding-bottom: 1.5em;
}
@media (max-width: 640px) {
  .nn-column-layout > .nn-column {
    flex: 0 0 100%;
  }
}
@media (min-width: 641px) {
  .nn-column-layout > .nn-column {
    flex: 0 0 50%;
  }
}
.nn-column-layout > .nn-column:not(:first-child) {
  border-left: 1px solid #dddddd;
}
@media (max-width: 640px) {
  .nn-column-layout > .nn-column-4 {
    flex-basis: 100%;
  }
}
@media (min-width: 641px) and (max-width: 1599px) {
  .nn-column-layout > .nn-column-4 {
    flex-basis: 50%;
  }
}
@media (min-width: 1600px) and (max-width: 1919px) {
  .nn-column-layout > .nn-column-4 {
    flex-basis: 33%;
  }
}
@media (min-width: 1920px) {
  .nn-column-layout > .nn-column-4 {
    flex-basis: 25%;
  }
}

.nn-column-layout-disabled > .nn-column:not(:first-child) {
  border-top: 1px solid #dddddd;
}

.flexbox .nn-column-layout {
  display: flex;
  justify-content: space-between;
}

.no-flexbox .nn-column-layout {
  float: left;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-favorite-mark.as-white {
  color: #ffffff;
}
.nn-favorite-mark.as-white:not(.locked):hover {
  background-color: rgba(255, 255, 255, 0.3);
}
.nn-favorite-mark.as-favorited {
  color: #e5361f;
}
.nn-favorite-mark.as-favorited:not(.locked):hover {
  background-color: rgba(229, 54, 31, 0.3);
}
.nn-favorite-mark .favorite-count {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-emblem-mark {
  width: 4.5em;
  height: 4.5em;
  background: no-repeat center;
  background-size: contain;
}
.nn-emblem-mark.as-rounded {
  background-size: cover;
  border-radius: 50%;
}
.nn-emblem-mark.as-large {
  width: 6.5em;
  height: 6.5em;
  margin-top: -2em;
}
.nn-emblem-mark.as-baseline {
  margin-top: 0;
}
@media screen and (max-width: 479px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 90px;
    height: 90px;
  }
}
@media screen and (min-width: 480px) and (max-width: 1151px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 120px;
    height: 120px;
  }
}
@media screen and (min-width: 1152px) and (max-width: 1279px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 150px;
    height: 150px;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1439px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 170px;
    height: 170px;
  }
}
@media screen and (min-width: 1440px) and (max-width: 1599px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 190px;
    height: 190px;
  }
}
@media screen and (min-width: 1600px) and (max-width: 1759px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 210px;
    height: 210px;
  }
}
@media screen and (min-width: 1760px) and (max-width: 1919px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 230px;
    height: 230px;
  }
}
@media screen and (min-width: 1920px) {
  .nn-emblem-mark.as-header-thumbnail {
    width: 250px;
    height: 250px;
  }
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-tab-panel {
  width: 100%;
  height: 48px;
  position: relative;
  z-index: 100;
}

.nn-tab-panel-header-wrapper {
  position: relative;
  height: 63px;
  margin-bottom: -15px;
  overflow: visible;
}

.nn-tab-panel-header-wrapper-fixed {
  position: relative;
  height: 63px -1px;
  margin-bottom: -15px;
  overflow: visible;
}
.nn-tab-panel-header-wrapper-fixed::before {
  content: ".";
  text-indent: -999em;
  overflow: hidden;
  display: block;
  width: 100%;
  height: 47px;
  background: rgba(255, 255, 255, 0.95);
  border-bottom: 1px solid #dddddd;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
}

.nn-tab-panel-header-scroll-panel {
  z-index: 111;
  position: relative;
  width: 100%;
  height: 63px;
  margin-bottom: -15px;
  overflow-x: auto;
  overflow-y: hidden;
}
.nn-tab-panel-header-scroll-panel .gm-scroll-view {
  padding-bottom: 0;
}

.nn-tab-panel-header {
  position: relative;
  z-index: 112;
  display: block;
  white-space: nowrap;
  list-style: none;
  overflow: visible;
  margin: 0;
  padding: 0;
  height: 48px;
}

.nn-tab-panel-header-spacer {
  display: inline-block;
  padding: 0;
  margin: 0;
  position: relative;
  width: 100px;
}

.nn-tab-panel-header-item {
  position: relative;
  display: inline-block;
  padding: 0;
  margin: 0;
}
.nn-tab-panel-header-item::after {
  position: absolute;
  content: ".";
  text-indent: -999em;
  overflow: hidden;
  display: block;
  left: 0;
  bottom: 0;
  right: 0;
  width: 0;
  height: 2px;
  background: #84bd00;
  transition: width 0.25s ease-out;
}
.nn-tab-panel-header-item.current::after {
  width: 100%;
}
.nn-tab-panel-header-item .nn-button {
  display: block;
  position: relative;
  padding: 0 1em;
  margin: 0;
  border-radius: 0;
  min-width: 100px;
  height: 48px;
  line-height: 48px;
  border: none;
  color: #737373;
  font-weight: 300;
  text-align: center;
}
.nn-tab-panel-header-item.current .nn-button {
  color: #222222;
}

.nn-tab-panel-content {
  display: block;
}

.nn-tab-panel-extra {
  position: absolute;
  right: 0;
  bottom: 15px;
  z-index: 120;
  transform: translateY(50%);
}

.main-tab-area.nn-tab-panel.nn-tab-panel-disappear-to-top .nn-tab-panel-header-wrapper-fixed {
  position: fixed;
  z-index: 110;
  top: 0;
  left: 240px;
  right: 340px;
  width: auto;
}
@media screen and (max-width: 1024px) {
  .main-tab-area.nn-tab-panel.nn-tab-panel-disappear-to-top .nn-tab-panel-header-wrapper-fixed {
    left: 0;
  }
}
@media screen and (max-width: 840px) {
  .main-tab-area.nn-tab-panel.nn-tab-panel-disappear-to-top .nn-tab-panel-header-wrapper-fixed {
    right: 0;
  }
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-footer-panel {
  transition: height 250ms ease-in-out;
  background: rgba(255, 255, 255, 0.95);
  position: fixed;
  bottom: 0;
  height: 0;
  z-index: 100;
  left: 240px;
  right: 340px;
  width: auto;
  display: flex;
  overflow: hidden;
}
.page-container.without-extra-bar .nn-footer-panel {
  right: 0 !important;
}
@media screen and (max-width: 1024px) {
  .nn-footer-panel {
    left: 0;
  }
  .nn-footer-panel.is-show {
    height: 48px;
    box-shadow: 0 -1px 4px 0 rgba(48, 48, 48, 0.05);
  }
}
@media screen and (max-width: 840px) {
  .nn-footer-panel {
    right: 0;
  }
}
.nn-footer-panel .nn-button {
  position: relative;
  flex-grow: 1;
  color: #737373;
  height: 48px;
  margin: 0;
  padding-left: 0;
  padding-right: 0;
}
.nn-footer-panel .nn-button .nn-badge {
  font-size: 10px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(75%, -100%);
}
.nn-footer-panel .nn-button .nn-icon {
  color: #737373;
}
.nn-footer-panel .nn-button .nn-icon,
.nn-footer-panel .nn-button .nn-ic-nanairo-color {
  transform: translateY(-30%);
}
.nn-footer-panel .nn-button .label {
  position: absolute;
  left: 50%;
  bottom: 4px;
  transform: translateX(-50%);
  margin-top: 2px;
  font-size: 9px;
  line-height: 1;
  white-space: nowrap;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-page-main-header {
  *zoom: 1;
  position: relative;
  padding: 15px;
  background: no-repeat center;
  background-size: cover;
}
.nn-page-main-header:after {
  content: "";
  display: table;
  clear: both;
}
.nn-page-main-header.with-cover-image {
  color: #ffffff;
}
.nn-page-main-header.with-cover-image, .nn-page-main-header.with-cover-image .nn-button.as-icon {
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
}
.nn-page-main-header .cover-image-spacer {
  width: 100%;
  height: 0;
  padding: 0 0 30%;
}
.nn-page-main-header .background-cover-image {
  z-index: -1;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: no-repeat center rgba(48, 48, 48, 0.5);
  background-size: cover;
}
.nn-page-main-header .subject {
  margin: 0;
  font-size: 1.75em;
  font-weight: 300;
  line-height: 1.2;
}
.nn-page-main-header .subject > .nn-icon {
  font-size: 1.4em;
  transform: translate(0, -8%);
  margin-right: 0.25em;
  color: #bbbbbb;
}
.nn-page-main-header .caption {
  margin: 0.25em auto 0;
  font-size: 1.4em;
  font-weight: 300;
  line-height: 1.2;
}
@media screen and (max-width: 414px) {
  .nn-page-main-header .subject {
    font-size: 1.5em;
  }
  .nn-page-main-header .subject .nn-icon {
    font-size: 1.2em;
  }
  .nn-page-main-header .caption {
    font-size: 1.2em;
  }
}
.nn-page-main-header .nn-emblem-mark.as-large {
  margin-top: -2em;
}
.nn-page-main-header .nn-emblem-mark.as-baseline {
  margin-top: 0;
}
.nn-page-main-header .top-icon-button-area {
  z-index: 1;
  position: absolute;
  top: 10px;
  right: 5px;
}
.nn-page-main-header .metaline {
  *zoom: 1;
  margin: -30px -15px -15px;
  padding: 30px 15px 15px;
}
.nn-page-main-header .metaline:after {
  content: "";
  display: table;
  clear: both;
}
.nn-page-main-header .metaline.with-gradient-shade {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
}
.nn-page-main-header .metaline-extra {
  float: right;
  min-height: 4em;
}
.nn-page-main-header .nn-emblem-mark {
  float: left;
  margin: 0 1em 0 0;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-page-sub-header {
  position: relative;
  margin-top: 2px;
  padding: 0.25em 15px;
  background: #dddddd;
  color: #ffffff;
}
.nn-page-sub-header .title {
  margin: 0;
  font-size: 1.25em;
  line-height: 1.2;
}
.nn-page-sub-header .title .nn-icon {
  font-size: 1.4em;
  transform: translate(0, -8%);
  margin-right: 0.25em;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-search-box label {
  font-size: 14px;
  color: #bbbbbb;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.nn-search-box input {
  position: absolute;
  font-size: 1.2em;
  width: 100%;
  height: 50px;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0 35px 0 70px;
  border: none;
  vertical-align: middle;
  background: none;
}
.nn-search-box input:focus {
  outline: none;
}
.nn-search-box .submit {
  display: block;
  position: absolute;
  right: -5px;
  top: 50%;
  border: none;
  min-width: 0;
  text-align: right;
  margin: 0;
  padding: 0;
  color: #737373;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-user-review-form {
  outline: none !important;
}
.nn-user-review-form .nn-user-review-body {
  width: 100%;
  margin-right: 0;
}
.nn-user-review-form .nn-user-review-body textarea {
  width: 100%;
}
.nn-user-review-form .nn-rating-mark-view {
  margin-top: 7px;
}
.nn-user-review-form .review-notice {
  float: right;
  padding: 0.9em 0.9em 0;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-user-timer-view-card {
  overflow: hidden;
}

.nn-user-timer-view {
  padding: 0 0 20px;
}
.nn-user-timer-view .open-detail {
  position: absolute;
  margin: 0;
  top: 0;
  right: 0;
}

.user-timer-pin-view {
  margin: 0 !important;
  width: 60px !important;
  height: 60px !important;
  top: 0.5em;
  right: 2px;
}
.user-timer-pin-view canvas {
  color: #ffffff;
}
.user-timer-pin-view .nn-icon {
  color: #84bd00 !important;
  font-size: 60px;
  text-shadow: 0 0 2px #303030;
}
.user-timer-pin-view .number {
  color: #ffffff;
  position: absolute;
  font-size: 18px;
  top: 46%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.progress {
  position: relative;
  width: auto;
  height: 4px;
  background-color: #bbbbbb;
  line-height: 0;
  margin: 40px auto 0;
}
.progress .progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 4px;
  background-color: #84bd00;
}
.progress .progress-pin {
  position: absolute;
  transform: translate(-50%, -100%);
  width: 40px;
  height: 40px;
  padding-top: 14px;
  font-size: 10px;
  line-height: 1;
  text-align: center;
  color: #ffffff;
}
.progress .progress-pin::before {
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 40px;
  color: #84bd00;
  content: "\e826";
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-rating-mark-view {
  display: inline-block;
  position: relative;
  overflow: hidden;
}
.nn-rating-mark-view .inner {
  display: block;
  position: relative;
}
.nn-rating-mark-view .rating-mark {
  display: inline-block;
  margin: 0;
  font-size: 14px;
  width: 14px;
  height: 14px;
  line-height: 14px;
}
.nn-rating-mark-view .rating-mark.active {
  color: #84bd00;
}
.nn-rating-mark-view .rating-mark.inactive {
  color: #bbbbbb;
}
.nn-rating-mark-view .overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: transparent;
}
.nn-rating-mark-view.editable .overlay {
  cursor: pointer;
}
.nn-rating-mark-view.large .rating-mark {
  font-size: 24px;
  width: 24px;
  height: 24px;
  line-height: 24px;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-sign {
  display: inline-block;
  color: #ffffff;
  padding: 0.7em 1em;
  margin: 4em auto;
  min-height: 2.5em;
  text-align: center;
  background-color: rgba(48, 48, 48, 0.5);
  border-radius: 0.5em;
  position: relative;
}
.nn-sign .nn-icon {
  font-size: 1.2em;
  margin-right: 0.25em;
}
.nn-sign.as-floating {
  position: absolute;
  top: 180px;
  left: 50%;
  transform: translateX(-50%);
}
.nn-sign.as-fix-centered {
  position: fixed;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.purchase-video-plans .remaining {
  *zoom: 1;
  font-size: 1.1em;
  font-weight: 600;
}
.purchase-video-plans .remaining:after {
  content: "";
  display: table;
  clear: both;
}
.purchase-video-plans .as-primary .volume-discount {
  color: #ffff4f;
  margin: 0 0.5em;
}
.purchase-video-plans .as-default .volume-discount {
  color: #e5361f;
  margin: 0 0.5em;
}

.image-tile {
  padding: 3px;
}
.image-tile .image-tile-item {
  display: none;
}
.image-tile .image-tile-column {
  float: left;
}
.image-tile .image-tile-column .image-tile-item {
  display: block;
  max-width: 100%;
  padding: 1px;
}
@media (min-width: 841px) {
  .image-tile .image-tile-column .image-tile-item {
    cursor: pointer;
  }
}

.nn-modal .modal-image-tile-item {
  width: auto;
  height: auto;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-video-player-wrapper {
  text-align: center;
  margin: 1em auto;
  text-shadow: none;
  /* VideoJSにより初期化されるまでは非表示 */
  /* https://github.com/videojs/video.js/issues/4852#issuecomment-419723313 */
  /* hide the captions settings item from the captions menu */
}
.nn-video-player-wrapper .nn-video-player:not(.vjs-fullscreen) {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  display: inline-block;
  position: relative;
  margin: auto;
  color: #ffffff;
  background: rgba(48, 48, 48, 0.75);
}
.nn-video-player-wrapper video#js-player:not([src]) {
  visibility: hidden;
}
.nn-video-player-wrapper .message {
  position: absolute;
  padding: 1em;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
}
> .nn-video-player-wrapper .message:last-child {
  margin-bottom: 0;
}
.nn-video-player-wrapper .video-js .vjs-text-track-display > div > div > div {
  color: rgb(255, 255, 255) !important;
  background-color: rgba(0, 0, 0, 0.3) !important;
  word-wrap: normal !important;
  word-break: normal !important;
  white-space: pre-line !important;
  font-style: normal !important;
  font-weight: 400 !important;
  text-align: center !important;
  text-decoration: none !important;
  line-height: 1.3em !important;
  padding: 0.1em 0.8em !important;
}
.nn-video-player-wrapper .vjs-texttrack-settings {
  display: none;
}
@media screen and (max-width: 480px) {
  .nn-video-player-wrapper .vjs-seek-button {
    display: none;
  }
}

.nn-modal-window.as-fullscreen .close {
  display: block;
  width: 35px;
  height: 35px;
  line-height: 35px;
  background-color: rgba(255, 255, 255, 0.25);
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 35px;
  color: #ffffff;
  cursor: pointer;
  border-radius: 50%;
}
.nn-modal-window.as-fullscreen .nn-video-player-wrapper {
  margin: 0 auto;
  padding: 0;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-video-picture-wrapper {
  text-align: center;
  margin: 1em auto;
  text-shadow: none;
}
.nn-video-picture-wrapper .nn-video-picture {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  display: inline-block;
  position: relative;
  margin: auto;
  color: #ffffff;
  background: rgba(48, 48, 48, 0.75);
  background-size: cover;
  cursor: pointer;
}
.nn-video-picture-wrapper .nn-video-picture .to-player-launch-button {
  width: 64px;
  height: 64px;
}
.nn-video-picture-wrapper .message {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
}
.nn-video-picture-wrapper .message .to-sign-up-button {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  color: #ffffff;
  background: #84bd00;
  font-size: 1.5em;
  white-space: pre;
}
.nn-video-picture-wrapper .message.error {
  background-color: #303030;
}
> .nn-video-picture-wrapper .message:last-child {
  margin-bottom: 0;
}
.nn-video-picture-wrapper .message.notice {
  background-color: #303030;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-overlays-container {
  position: relative;
  z-index: 1000;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

@keyframes hide-sticky {
  0% {
    opacity: 1;
    transform-origin: top;
    transform: scaleY(1);
  }
  100% {
    opacity: 0.1;
    transform-origin: top;
    transform: scaleY(0);
  }
}
.nn-stickies-container {
  position: fixed;
  z-index: 2;
  top: 10px;
  right: 10px;
  width: 320px;
}
@media screen and (max-width: 414px) {
  .nn-stickies-container {
    width: auto;
    top: auto;
    bottom: 10px;
    right: 10px;
    left: 10px;
  }
}
.nn-stickies-container .nn-sticky {
  margin: 0.5em auto;
}
.nn-stickies-container .nn-sticky.hide {
  display: none;
}
.nn-stickies-container .nn-sticky.hide-anim {
  animation: hide-sticky 0.25s;
}

.nn-sticky {
  *zoom: 1;
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  position: relative;
  margin: 2em auto;
  background: rgba(0, 0, 0, 0.9);
  color: #ffffff;
  font-size: 0.85em;
  font-weight: 300;
  overflow: hidden;
  padding: 10.5px 21px;
}
.nn-sticky:after {
  content: "";
  display: table;
  clear: both;
}
.nn-sticky .nn-sticky-icon {
  display: block;
}
.nn-sticky.as-theme .nn-sticky-icon {
  color: #84bd00;
}
.nn-sticky.as-attention .nn-sticky-icon {
  color: #a94442;
}
.nn-sticky.as-attention-vivid {
  color: #ffffff;
  background-color: #e5361f;
}
.nn-sticky.with-icon-top .nn-sticky-icon {
  position: relative;
  font-size: 32px;
  margin-top: 0;
  margin-bottom: 3.5px;
}
.nn-sticky.with-icon-left {
  padding-left: 52px;
}
.nn-sticky.with-icon-left .nn-sticky-icon {
  position: absolute;
  top: 7px;
  left: 21px;
}
.nn-sticky .thumbnail-wrapper {
  display: block;
  float: right;
  margin: 0 0 0.25em 0.5em;
}
.nn-sticky .thumbnail {
  width: 120px;
  height: 120px;
  background-color: #ebebeb;
  background-size: cover;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

@keyframes show-modal-overlay {
  0% {
    opacity: 0.1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes show-modal {
  0% {
    opacity: 0.1;
    transform: translate(-50%, -50%) scale(1, 0.1);
  }
  100% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1, 1);
  }
}
@keyframes hide-modal-overlay {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0.1;
  }
}
@keyframes hide-modal {
  0% {
    display: inherit;
    opacity: 1;
    transform: translate(-50%, -50%) scale(1, 1);
  }
  100% {
    display: none;
    opacity: 0.1;
    transform: translate(-50%, -50%) scale(1, 0.1);
  }
}
.nn-modals-container {
  position: relative;
  z-index: 1;
}
.nn-modals-container .nn-modal, .nn-modals-container .nn-react-modal {
  display: none;
  z-index: 1;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.nn-modals-container .nn-modal::before, .nn-modals-container .nn-react-modal::before {
  content: "";
  margin: 0;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(48, 48, 48, 0.5);
}
.nn-modals-container .nn-modal.show, .nn-modals-container .nn-react-modal.show {
  display: inherit;
  animation: show-modal-overlay 0.3s;
}
.nn-modals-container .nn-modal.show .nn-modal-window, .nn-modals-container .nn-react-modal.show .nn-modal-window {
  animation: show-modal 0.3s;
}
.nn-modals-container .nn-modal.show-without-anim, .nn-modals-container .nn-react-modal.show-without-anim {
  display: inherit;
}
.nn-modals-container .nn-modal.hide, .nn-modals-container .nn-react-modal.hide {
  display: none;
}
.nn-modals-container .nn-modal.hide-anim, .nn-modals-container .nn-react-modal.hide-anim {
  display: inherit;
  animation: hide-modal-overlay 0.3s;
}
.nn-modals-container .nn-modal.hide-anim .nn-modal-window, .nn-modals-container .nn-react-modal.hide-anim .nn-modal-window {
  animation: hide-modal 0.3s;
}
.nn-modals-container .nn-modal .nn-modal-window, .nn-modals-container .nn-react-modal .nn-modal-window {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.nn-modal-window {
  z-index: 2;
  margin: 1em auto;
  background: #ebebeb;
  max-height: 90%;
  width: 400px;
  min-width: 280px;
  max-width: 90%;
  overflow-x: hidden;
  overflow-y: auto;
}
@media screen and (max-width: 414px) {
  .nn-modal-window {
    width: 100%;
  }
}
.nn-modal-window.as-wide {
  width: 640px;
}
.nn-modal-window.as-fullscreen {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
  background: transparent;
  overflow: hidden;
}
.nn-modal-window.as-fullscreen .nn-modal-content {
  width: 100%;
  height: 100%;
  padding: 0;
}
.nn-modal-window .nn-tbl-datasheet, .nn-modal-window .content-auction-bids .tbl-datasheet, .content-auction-bids .nn-modal-window .tbl-datasheet, .nn-modal-window #bids_info .bids-history .tbl-datasheet, #bids_info .bids-history .nn-modal-window .tbl-datasheet {
  background-color: #ffffff;
}
.nn-modal-window .nn-tbl-datasheet thead th, .nn-modal-window .content-auction-bids .tbl-datasheet thead th, .content-auction-bids .nn-modal-window .tbl-datasheet thead th, .nn-modal-window #bids_info .bids-history .tbl-datasheet thead th, #bids_info .bids-history .nn-modal-window .tbl-datasheet thead th, .nn-modal-window .nn-tbl-datasheet thead td, .nn-modal-window .content-auction-bids .tbl-datasheet thead td, .content-auction-bids .nn-modal-window .tbl-datasheet thead td, .nn-modal-window #bids_info .bids-history .tbl-datasheet thead td, #bids_info .bids-history .nn-modal-window .tbl-datasheet thead td, .nn-modal-window .nn-tbl-datasheet tfoot th, .nn-modal-window .content-auction-bids .tbl-datasheet tfoot th, .content-auction-bids .nn-modal-window .tbl-datasheet tfoot th, .nn-modal-window #bids_info .bids-history .tbl-datasheet tfoot th, #bids_info .bids-history .nn-modal-window .tbl-datasheet tfoot th, .nn-modal-window .nn-tbl-datasheet tfoot td, .nn-modal-window .content-auction-bids .tbl-datasheet tfoot td, .content-auction-bids .nn-modal-window .tbl-datasheet tfoot td, .nn-modal-window #bids_info .bids-history .tbl-datasheet tfoot td, #bids_info .bids-history .nn-modal-window .tbl-datasheet tfoot td {
  background-color: #ffffff;
}

.nn-modal-content {
  *zoom: 1;
  padding: 1em 1.5em;
}
.nn-modal-content:after {
  content: "";
  display: table;
  clear: both;
}
.nn-modal-content .nn-button {
  transition: 0.1s;
}

.nn-modal-header {
  *zoom: 1;
  padding: 1em 1.5em 0.75em;
  background: #ffffff;
  color: #679800;
  border-bottom: 2px solid #84bd00;
  z-index: 2;
}
.nn-modal-header:after {
  content: "";
  display: table;
  clear: both;
}
.as-attention .nn-modal-header {
  color: #94403e;
  border-color: #a94442;
}
.nn-modal-header .fixed {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.nn-modal-header h1 {
  font-weight: 300;
  font-size: 1.1em;
  margin: 0;
}

.nn-modal-footer {
  *zoom: 1;
  padding: 0.5em 1.5em;
  background: #ffffff;
  text-align: center;
}
.nn-modal-footer:after {
  content: "";
  display: table;
  clear: both;
}
.nn-modal-footer .fixed {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.nn-modal-footer > .nn-button {
  margin-top: -0.125em;
  margin-bottom: -0.125em;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-flashes-container {
  position: fixed;
  top: 10px;
  right: 10px;
  left: 10px;
  z-index: 3;
  text-align: center;
}

.nn-flash {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  position: relative;
  margin: 0.5em auto;
  background: rgba(59, 89, 152, 0.95);
  color: #ffffff;
  font-size: 1.25em;
  padding: 1em 2em;
  font-weight: 300;
  overflow: hidden;
  text-align: center;
}
.nn-flash.as-attention {
  background: rgba(169, 68, 66, 0.95);
}
.nn-flash .nn-icon {
  color: #ffffff;
}
.nn-flash .close {
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-overlay-notice {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.75);
  z-index: 20;
  font-size: 0.85em;
}
.nn-overlay-notice::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.nn-overlay-notice.as-attention {
  color: #94403e;
}
.nn-overlay-notice.as-warning::before {
  background-color: rgba(48, 48, 48, 0.5);
}
.nn-overlay-notice.as-warning .content {
  box-shadow: 0 1px 2px rgba(48, 48, 48, 0.5);
  background-color: #94403e;
  color: #ffffff;
}
.nn-overlay-notice .content {
  max-width: 90%;
  width: 100%;
  border-radius: 4px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  padding: 1em;
}
.nn-overlay-notice p {
  font-size: inherit;
  margin: 0.25em 0;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-no-logged-in-top {
  text-align: center;
  font-size: 16px;
  line-height: 1.75;
  overflow: hidden;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top {
    font-size: 14px;
  }
}
.nn-no-logged-in-top button {
  line-height: 1.2;
  min-height: 0;
  padding: 0.25em 1em;
}
.nn-no-logged-in-top img {
  width: 100%;
}
.nn-no-logged-in-top section.section:not(:first-child) {
  *zoom: 1;
  margin: 4em auto;
}
.nn-no-logged-in-top section.section:not(:first-child):after {
  content: "";
  display: table;
  clear: both;
}
.nn-no-logged-in-top .main-visual-area {
  position: relative;
  width: 100%;
  height: 0;
  background: center no-repeat;
  background-size: cover;
  margin-bottom: 4em;
  padding-bottom: 50%;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top .main-visual-area {
    padding-bottom: 60%;
  }
}
@media screen and (max-width: 414px) {
  .nn-no-logged-in-top .main-visual-area {
    padding-bottom: 120%;
  }
}
.nn-no-logged-in-top .main-visual-area .main-visual-area-inner {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: center no-repeat;
  background-size: cover;
  padding-bottom: 50%;
  transition: opacity 0.5s ease-in-out;
}
.nn-no-logged-in-top .main-visual-area .main-visual-area-inner.top {
  animation: fadeOutMainVisual 6s ease-in-out 0s infinite alternate;
}
@keyframes fadeOutMainVisual {
  0% {
    opacity: 1;
  }
  42% {
    opacity: 1;
  }
  58% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.nn-no-logged-in-top .main-copy-area {
  position: absolute;
  width: 100%;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.nn-no-logged-in-top .section-head {
  text-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
  font-size: 2.5em;
  line-height: 1.2;
  position: relative;
}
@media screen and (max-width: 414px) {
  .nn-no-logged-in-top .section-head {
    font-size: 2.25em;
  }
}
.nn-no-logged-in-top .lead-text {
  margin: 2em auto;
  padding: 0 2em;
  max-width: 720px;
  line-height: 1.75;
  text-align: left;
}
.nn-no-logged-in-top .em-text {
  margin: 1em auto;
  padding: 0;
  font-size: 1.2em;
  line-height: 1.4;
}
.nn-no-logged-in-top .site-identity {
  transform: none;
  position: absolute;
  left: 1em;
  top: 1em;
}
.nn-no-logged-in-top .to-sign-in {
  text-align: right;
  padding: 1em;
  margin: 0;
}
.nn-no-logged-in-top .to-sign-in-button {
  font-size: 1em;
  border: 1px solid #222222;
  color: #222222;
}
.nn-no-logged-in-top .to-sign-in-button canvas {
  color: #ffffff;
}
.nn-no-logged-in-top .to-sign-up {
  margin: 2em auto;
}
.nn-no-logged-in-top .to-sign-up-button {
  display: inline-block;
  min-height: 1.5em;
  padding: 0.3em 1em;
  font-size: 1.5em;
}
.nn-no-logged-in-top .fig-trial {
  max-width: 600px;
  width: 100%;
}
.nn-no-logged-in-top #plan-detail-table-area {
  margin: 2em 0;
  padding: 1em;
  background: #E1EDE7;
  position: relative;
}
.nn-no-logged-in-top #plan-detail-table {
  margin: 1em auto;
  max-width: 840px;
}
.nn-no-logged-in-top #plan-detail-table table {
  margin: 1em auto;
  width: 100%;
  line-height: 1.2;
  font-size: 0.9em;
}
@media screen and (min-width: 841px) and (max-width: 1024px) {
  .nn-no-logged-in-top #plan-detail-table table {
    font-size: 0.85em;
  }
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #plan-detail-table table {
    font-size: 0.85em;
  }
}
@media screen and (max-width: 414px) {
  .nn-no-logged-in-top #plan-detail-table table {
    font-size: 0.8em;
  }
}
.nn-no-logged-in-top #plan-detail-table table tbody {
  border-bottom: 1px solid #ffffff;
}
.nn-no-logged-in-top #plan-detail-table table th {
  font-weight: 600;
}
.nn-no-logged-in-top #plan-detail-table table th, .nn-no-logged-in-top #plan-detail-table table td {
  padding: 0.5em 0.5em;
  vertical-align: middle;
}
.nn-no-logged-in-top #plan-detail-table table tr.section {
  border-top: 1px solid #ffffff;
}
.nn-no-logged-in-top #coin-detail-figure {
  *zoom: 1;
  margin: 2em auto;
  padding: 0 1em;
  width: 100%;
  max-width: 720px;
  position: relative;
}
.nn-no-logged-in-top #coin-detail-figure:after {
  content: "";
  display: table;
  clear: both;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #coin-detail-figure {
    max-width: 560px;
  }
}
.nn-no-logged-in-top #coin-detail-figure .item {
  float: left;
}
.nn-no-logged-in-top #coin-detail-figure .item-title {
  position: relative;
  overflow: visible;
  margin: 0 auto 10px;
  padding-bottom: 90%;
  width: 90%;
  height: 0;
  border-radius: 50%;
}
.nn-no-logged-in-top #coin-detail-figure .item-title .text {
  white-space: nowrap;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  padding: 0.5em;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #coin-detail-figure .item-title .text {
    font-size: 1.25em;
  }
}
@media screen and (max-width: 414px) {
  .nn-no-logged-in-top #coin-detail-figure .item-title .text {
    font-size: 1em;
  }
}
.nn-no-logged-in-top #coin-detail-figure .in, .nn-no-logged-in-top #coin-detail-figure .out {
  float: left;
  margin: 2em auto;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #coin-detail-figure .in, .nn-no-logged-in-top #coin-detail-figure .out {
    *zoom: 1;
    float: none;
  }
  .nn-no-logged-in-top #coin-detail-figure .in:after, .nn-no-logged-in-top #coin-detail-figure .out:after {
    content: "";
    display: table;
    clear: both;
  }
}
.nn-no-logged-in-top #coin-detail-figure .out {
  width: 40%;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #coin-detail-figure .out {
    width: 66.6666%;
  }
}
.nn-no-logged-in-top #coin-detail-figure .out .item {
  width: 50%;
}
.nn-no-logged-in-top #coin-detail-figure .out .item-title {
  color: #ffffff;
  background: #84bd00;
}
.nn-no-logged-in-top #coin-detail-figure .in {
  width: 60%;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #coin-detail-figure .in {
    width: 100%;
  }
}
.nn-no-logged-in-top #coin-detail-figure .in .item {
  width: 33.3333%;
}
.nn-no-logged-in-top #coin-detail-figure .in .item-title {
  color: #222222;
  background: #E1EDE7;
}
.nn-no-logged-in-top #coin-detail-figure .description {
  font-size: 0.9em;
  line-height: 1.4;
  padding: 0.5em;
  text-align: left;
}
@media screen and (max-width: 414px) {
  .nn-no-logged-in-top #coin-detail-figure .description {
    font-size: 0.8em;
  }
}
.nn-no-logged-in-top .faq-list-container {
  margin: 4em auto;
  padding: 0 1em;
  max-width: 840px;
  *zoom: 1;
}
.nn-no-logged-in-top .faq-list-container:after {
  content: "";
  display: table;
  clear: both;
}
.nn-no-logged-in-top .faq-list {
  font-size: 0.9em;
  text-align: left;
  margin: 1em 0;
  padding: 0 1em 0 3em;
  line-height: 1.75em;
  width: 50%;
  float: left;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top .faq-list {
    width: 100%;
    float: none;
  }
}
.nn-no-logged-in-top .faq-list .qes {
  position: relative;
  font-weight: 600;
  font-size: 1.1em;
  padding: 0;
  margin: 1em 0 0 0;
}
.nn-no-logged-in-top .faq-list .qes::before {
  position: absolute;
  display: block;
  content: "Q.";
  font-size: 1.1em;
  color: #84bd00;
  left: 5px;
  transform: translateX(-150%);
  vertical-align: middle;
}
.nn-no-logged-in-top .faq-list .ans {
  position: relative;
  padding: 0;
  margin: 0;
}
.nn-no-logged-in-top .link-line a {
  margin: 0 1em;
  white-space: nowrap;
}
.nn-no-logged-in-top .link-line a::before {
  content: "> ";
  display: inline;
}
.nn-no-logged-in-top .banner-picture {
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 40%;
  background: no-repeat center;
  background-size: cover;
}
.nn-no-logged-in-top .banner-picture-101 {
  background-image: url("/assets/user/pictures/banner-picture_01-d8b11e8c.jpg");
}
.nn-no-logged-in-top .banner-picture-102 {
  background-image: url("/assets/user/pictures/banner-picture_02-d4d57ab4.jpg");
}
.nn-no-logged-in-top .banner-picture-103 {
  background-image: url("/assets/user/pictures/banner-picture_03-6d2c4598.jpg");
}
.nn-no-logged-in-top .banner-picture-104 {
  background-image: url("/assets/user/pictures/banner-picture_04-8ecb2b1f.jpg");
}
.nn-no-logged-in-top .parallax-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.nn-no-logged-in-top .parallax-container.layer-1 {
  z-index: -1;
  opacity: 1;
}
.nn-no-logged-in-top .parallax-container.layer-2 {
  z-index: -2;
  opacity: 1;
}
.nn-no-logged-in-top .parallax-container.layer-3 {
  z-index: -3;
  opacity: 0.8;
}
.nn-no-logged-in-top .picture {
  position: absolute;
  top: 0;
  left: 50%;
  width: 240px;
  height: 240px;
  background: no-repeat center;
  background-size: contain;
  z-index: -1;
}
.nn-no-logged-in-top #no-sample-because-all-free {
  position: relative;
  z-index: 3;
}
.nn-no-logged-in-top #quality {
  position: relative;
  z-index: 2;
  height: 750px;
  padding-top: 40px;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #quality {
    height: 540px;
    padding-top: 0;
  }
}
.nn-no-logged-in-top #quality .picture-11 {
  transform: translate(-580px, -120px) rotate(-5deg) scale(1.6);
  background-image: url("/assets/user/pictures/purity/375_urumi_01-004-45730c66.jpg");
}
.nn-no-logged-in-top #quality .picture-12 {
  transform: translate(-580px, 160px) rotate(4deg) scale(0.9);
  background-image: url("/assets/user/pictures/purity/372_yurina_05-027-4c4ccd83.jpg");
}
.nn-no-logged-in-top #quality .picture-13 {
  transform: translate(-450px, 440px) rotate(3deg) scale(1.1);
  background-image: url("/assets/user/pictures/purity/409_yukine_01-012-c2adf492.jpg");
}
.nn-no-logged-in-top #quality .picture-14 {
  transform: translate(20px, 510px) rotate(1deg) scale(0.9);
  background-image: url("/assets/user/pictures/purity/413_beni_01-001-ee7cf565.jpg");
}
.nn-no-logged-in-top #quality .picture-15 {
  transform: translate(240px, 260px) rotate(2deg) scale(1.2);
  background-image: url("/assets/user/pictures/purity/434_mio_01-005-227dd4ef.jpg");
}
.nn-no-logged-in-top #quality .picture-21 {
  transform: translate(-400px, 265px) rotate(-3deg) scale(0.9);
  background-image: url("/assets/user/pictures/sexy/406_ayane_01-013-68de9935.jpg");
}
.nn-no-logged-in-top #quality .picture-22 {
  transform: translate(-100px, 365px) rotate(3deg) scale(1.1);
  background-image: url("/assets/user/pictures/sexy/356_hikaru_05-013-e57dbe93.jpg");
}
.nn-no-logged-in-top #quality .picture-23 {
  transform: translate(260px, 580px) rotate(-3deg) scale(1.1);
  background-image: url("/assets/user/pictures/sexy/370_aoi_03-010-49bf5dba.jpg");
}
.nn-no-logged-in-top #quality .picture-31 {
  transform: translate(-220px, 560px) rotate(-3deg) scale(1);
  background-image: url("/assets/user/pictures/hard/406_ayane_01-026-85828672.jpg");
}
.nn-no-logged-in-top #quality .picture-32 {
  transform: translate(200px, 450px) rotate(3deg) scale(0.8);
  background-image: url("/assets/user/pictures/hard/406_ayane_01-047-db177842.jpg");
}
.nn-no-logged-in-top #quality .picture-33 {
  transform: translate(360px, 960px) rotate(-3deg) scale(1.2);
  background-image: url("/assets/user/pictures/hard/370_aoi_01-035-77cc5223.jpg");
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #quality .picture-11 {
    display: none;
  }
  .nn-no-logged-in-top #quality .picture-12 {
    transform: translate(-580px, 120px) rotate(4deg) scale(0.9);
  }
  .nn-no-logged-in-top #quality .picture-13 {
    transform: translate(-360px, 360px) rotate(3deg) scale(1.2);
  }
  .nn-no-logged-in-top #quality .picture-14 {
    transform: translate(20px, 440px) rotate(1deg) scale(0.9);
  }
  .nn-no-logged-in-top #quality .picture-15 {
    transform: translate(240px, 220px) rotate(2deg) scale(1.2);
  }
  .nn-no-logged-in-top #quality .picture-21 {
    transform: translate(-400px, 200px) rotate(-3deg) scale(0.9);
  }
  .nn-no-logged-in-top #quality .picture-22 {
    transform: translate(-60px, 300px) rotate(3deg) scale(1.1);
  }
  .nn-no-logged-in-top #quality .picture-23 {
    transform: translate(260px, 540px) rotate(-3deg) scale(1.2);
  }
  .nn-no-logged-in-top #quality .picture-31 {
    transform: translate(-220px, 520px) rotate(-3deg) scale(1);
  }
  .nn-no-logged-in-top #quality .picture-32 {
    transform: translate(200px, 410px) rotate(3deg) scale(0.8);
  }
  .nn-no-logged-in-top #quality .picture-33 {
    transform: translate(360px, 860px) rotate(-3deg) scale(1.2);
  }
}
.nn-no-logged-in-top #trial {
  position: relative;
  z-index: 1;
  background: #E1EDE7;
  padding: 3.5em 0 2em;
}
.nn-no-logged-in-top #trial .section-head span {
  position: relative;
}
.nn-no-logged-in-top #trial .section-head .imanara {
  position: absolute;
  left: 10px;
  top: 0;
  transform: translate(0, -95%);
  width: 70px;
  height: 35px;
}
.nn-no-logged-in-top #trial .section-head .price {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 110%);
  font-size: 12px;
}
.nn-no-logged-in-top #trial #trial-notearea {
  padding: 1em;
  position: relative;
  max-width: 720px;
}
.nn-no-logged-in-top #plan_and_coin {
  position: relative;
  z-index: 1;
}
.nn-no-logged-in-top #plan_and_coin .picture-41 {
  transform: translate(-500px, -120px) rotate(-5deg) scale(1.1);
  background-image: url("/assets/user/pictures/purity/364_aoi_01-002-7a7c30d3.jpg");
}
.nn-no-logged-in-top #plan_and_coin .picture-42 {
  transform: translate(260px, -120px) rotate(4deg) scale(1.1);
  background-image: url("/assets/user/pictures/hard/407_mikoto_01-068-7f956aca.jpg");
}
.nn-no-logged-in-top #coin-detail {
  position: relative;
  z-index: 1;
}
.nn-no-logged-in-top #coin-detail .picture-51 {
  transform: translate(-620px, 0px) rotate(-5deg) scale(1.2);
  background-image: url("/assets/user/pictures/purity/356_hikaru_01-005-51cacb2b.jpg");
}
.nn-no-logged-in-top #coin-detail .picture-52 {
  transform: translate(380px, 0px) rotate(-4deg) scale(1.12);
  background-image: url("/assets/user/pictures/sexy/409_yukine_01-009-9dbeff7d.jpg");
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #coin-detail .picture-51 {
    transform: translate(-480px, 0px) rotate(-5deg) scale(1.2);
  }
  .nn-no-logged-in-top #coin-detail .picture-52 {
    transform: translate(240px, 0px) rotate(-4deg) scale(1.12);
  }
}
.nn-no-logged-in-top #faq {
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 840px) {
  .nn-no-logged-in-top #footer-policy {
    margin-bottom: 3em;
  }
}

.nn-guide-terms h2 {
  font-size: 1.3em;
  margin-bottom: 15px;
}
.nn-guide-terms h3 {
  font-size: 1em;
  font-weight: 600;
}
.nn-guide-terms p, .nn-guide-terms li {
  line-height: 1.5;
}
.nn-guide-terms p {
  margin-bottom: 15px;
}
.nn-guide-terms section {
  margin-bottom: 20px;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-language-panel {
  font-size: 12px;
  padding: 0.5em 1em;
  border-top: 1px solid #dddddd;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

#footer-policy {
  font-size: 0.75em;
  color: #737373;
  line-height: 1.2;
  margin: 3em auto 0 auto;
  border-top: 1px solid #dddddd;
}
@media screen and (max-width: 840px) {
  #footer-policy {
    padding-top: 2em;
    margin-top: 2em;
  }
}
#footer-policy .hide-narrow .link-line {
  display: inline-block;
  margin: 1em 0;
}
#footer-policy .hide-narrow .link-line a::before {
  content: "";
}
#footer-policy .visible-narrow p {
  margin-bottom: 1.8em;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-alert.nn-alert-danger {
  background-color: #e5361f;
  color: #ffffff;
}
.nn-alert.nn-alert-success {
  background-color: #84bd00;
  color: #ffffff;
  font-size: 1.2em;
  padding: 1em;
  text-align: center;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.nn-author {
  height: 30px;
  min-height: 30px;
  padding-left: 35px;
}
.nn-author .nn-card-inner {
  padding: 0;
  min-height: auto;
  position: initial;
}
.nn-author .thumbnail-wrapper {
  position: absolute;
  left: 0px;
  top: 0px;
}
.nn-author .thumbnail {
  width: 30px;
  height: 30px;
  margin: 0;
  background-color: #ebebeb;
  background-size: cover;
  padding-bottom: 0;
}
.nn-author .name {
  line-height: 30px;
  text-align: left;
  margin-top: 0;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.content-list .nn-page-main-header {
  border-bottom: 1px solid #dddddd;
}
.content-list .nn-page-main-header .subject {
  font-size: 1.43em;
}
.content-list .nn-page-main-header .caption {
  font-size: 1em;
  line-height: 1.4;
  color: #737373;
}
.content-list .nn-page-main-header .publish-at {
  font-size: 0.86em;
  color: #737373;
}
.content-list .nn-page-main-header .author-wrapper {
  position: relative;
  height: 30px;
}
.content-list .nn-page-main-header .author-wrapper .nn-author {
  position: absolute;
  top: 0px;
  right: 0px;
}

.nn-ctrl-disabled .nn-ctrl-label::after {
  font-family: "Material Icons";
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.video-overview .expire-date {
  color: #94403e;
}

.anim-slide-updown-enter {
  transition: 400ms ease-in;
  transform: scaleY(0.1);
}

.anim-slide-updown-enter.anim-slide-updown-enter-active {
  transform: scaleY(1);
}

.anim-slide-updown-leave {
  transition: 400ms ease-out;
  transform: scaleY(1);
}

.anim-slide-updown-leave.anim-slide-updown-leave-active {
  transform: scaleY(0.1);
}

@keyframes blink {
  80% {
    opacity: 0;
  }
}
.anim-blink {
  animation: blink 2s step-end infinite;
}

@keyframes nanairo {
  0% {
    background-color: rgba(62, 165, 200, 0.5);
  }
  14% {
    background-color: rgba(45, 115, 166, 0.5);
  }
  29% {
    background-color: rgba(85, 154, 83, 0.5);
  }
  43% {
    background-color: rgba(150, 188, 83, 0.5);
  }
  57% {
    background-color: rgba(248, 198, 65, 0.5);
  }
  71% {
    background-color: rgba(233, 145, 49, 0.5);
  }
  86% {
    background-color: rgba(221, 71, 35, 0.5);
  }
  100% {
    background-color: rgba(62, 165, 200, 0.5);
  }
}
@media screen and (min-width: 1025px) {
  .content-auction .auction-trade {
    width: 70%;
  }
  .content-auction .auction-trade .nn-button {
    width: 82%;
  }
}
@media screen and (min-width: 841px) and (max-width: 1024px) {
  .content-auction .auction-trade .nn-button {
    width: 70%;
  }
}
@media screen and (max-width: 840px) {
  .content-auction .auction-trade .nn-button {
    width: 64%;
  }
}
@media screen and (max-width: 414px) {
  .content-auction .auction-trade .nn-button {
    width: 100%;
  }
}
@media screen and (max-width: 375px) {
  .content-auction .carousel-padding {
    padding: 0 !important;
  }
}
.content-auction .carousel {
  width: 100%;
  margin: 25px auto;
}
@media screen and (min-width: 1441px) {
  .content-auction .carousel {
    max-height: 765px;
  }
}
.content-auction .carousel img {
  max-width: 100%;
  border-left: 1px solid white;
}
.content-auction .auction-trade .auction_shipping_info-form .row {
  margin-bottom: 10px;
}
.content-auction .auction-trade .auction_shipping_info-form .row label {
  display: block;
}
.content-auction .auction-trade .auction_shipping_info-form .row input[type=text],
.content-auction .auction-trade .auction_shipping_info-form .row input[type=tel],
.content-auction .auction-trade .auction_shipping_info-form .row textarea {
  width: 82%;
  border: 1px solid #000;
  padding: 2px 3px;
}

#bids_info .bids-history {
  overflow: auto;
  height: 160px;
}
#bids_info .bids-history .tbl-datasheet {
  table-layout: fixed;
  width: 100%;
}
#bids_info .bids-history .tbl-datasheet .bade-at {
  width: 24%;
}
#bids_info .bids-history .tbl-datasheet .price {
  width: 22%;
}
#bids_info .bids-history .tbl-datasheet .buyer-name {
  width: 29%;
}
#bids_info .bids-history .tbl-datasheet .auto {
  width: 25%;
}
#bids_info .header {
  color: #ffffff;
}
#bids_info .header .nn-card-inner {
  background-color: #7d7d7d;
}
#bids_info .header .header-text {
  vertical-align: middle;
  display: table-cell;
}
#bids_info .header .header-text-right {
  vertical-align: middle;
  display: table-cell;
  width: 100%;
  text-align: right;
}
#bids_info .bid-form {
  background-color: #f2f8ea;
  text-align: center;
  padding: 3em;
}
#bids_info .bid-form input.auction_bid_max_price {
  color: #84bd00;
  font-size: 1.6em;
  font-weight: 500;
  text-align: right;
  padding-right: 1em;
}
#bids_info .bid-form .nn-button {
  font-size: 1.6em;
  padding: 0.45em 1em;
}
#bids_info .bid-form .nn-button.as-rounded {
  border-radius: 2em;
}

#auctions-messages-new .message {
  margin-bottom: 1em;
  min-height: 100px;
}
#auctions-messages-new .message .sender {
  border-radius: 1em 1em 0 0;
  padding: 1em 1em 0.5em;
}
#auctions-messages-new .message .body {
  padding: 1em 1em 2em;
}
#auctions-messages-new .message .date {
  border-radius: 0 0 1em 1em;
  padding: 0 1em 1em;
  margin-bottom: 1em;
  text-align: right;
}
#auctions-messages-new .message .buyer-background-color {
  background-color: #E9EAFE;
}
#auctions-messages-new .message .seller-background-color {
  background-color: #FFFFCF;
}
@media screen and (min-width: 415px) {
  #auctions-messages-new .message {
    display: grid;
    grid-template-rows: 40% 1fr;
    grid-template-columns: 25% 1fr;
    text-align: center;
  }
  #auctions-messages-new .message .sender {
    border-radius: 1em 0 0 0;
    grid-column: 1;
    grid-row: 1;
  }
  #auctions-messages-new .message .body {
    border-radius: 0 1em 1em 0;
    grid-column: 2;
    grid-row: 1/3;
    margin-left: 0.5em;
  }
  #auctions-messages-new .message .date {
    border-radius: 0 0 0 1em;
    grid-column: 1;
    grid-row: 2;
    margin-bottom: 0;
    text-align: center;
  }
}

.content-auction-bids h2 {
  margin-top: 1em;
  font-size: 1.25em;
}
.content-auction-bids form {
  margin-top: 2em;
}
.content-auction-bids .tbl-datasheet {
  table-layout: fixed;
  width: 100%;
}
.content-auction-bids .tbl-datasheet tr.even {
  background-color: #fff;
}
.content-auction-bids .tbl-datasheet tr.odd {
  background-color: #ebebeb;
}
.content-auction-bids .tbl-datasheet tr:last-child {
  border-bottom: 1px solid #ebebeb;
}
.content-auction-bids .tbl-datasheet.auction-bid-confirm tr {
  border: 1px solid #dddddd;
}
.content-auction-bids .tbl-datasheet.auction-bid-confirm tr th {
  width: 25%;
  padding: 6px;
  background-color: #ebebeb;
}
.content-auction-bids .tbl-datasheet.auction-bid-confirm tr td {
  padding: 6px;
}

hr {
  border: 1px solid #DDDDDD;
}

.chat-container {
  background-color: #e2dede;
  flex-grow: 1;
  overflow: auto;
}

.live-chat {
  display: flex;
  flex-direction: column;
  overflow: auto;
  order: 4;
  background-color: #ddd;
}

@media screen and (max-width: 768px) {
  .live-chat .chat-comment-form {
    padding: 10px 14px;
  }
  .live-chat .chat-comment-form .field {
    padding: 5px 0 10px;
  }
  .live-chat .chat-comment-form .submit {
    top: -22px;
    width: 44px;
    height: 44px;
  }
  .live-chat .chat-comment-form .submit i {
    font-size: 20px;
  }
  .live-chat .chat-comments {
    overflow: auto;
    max-height: 100%;
  }
  .live-chat .chat-comments .live-auction-popup-body {
    display: flex !important;
  }
  .live-chat .chat-comments .auction-link {
    margin: 2em 0;
    text-align: center;
  }
  .live-chat .chat-comments .auction-link .bid-btn {
    background-color: #84BD00;
    border-radius: 10px;
    color: white;
    padding: 1em;
  }
}
@media screen and (min-width: 769px) {
  .live-chat {
    order: unset;
  }
  #primary-content .live-chat {
    background-color: white;
    min-height: 25%;
    max-height: 25%;
    height: 25%;
  }
  #primary-content .live-chat .chat-comments {
    flex-grow: 1;
  }
  #primary-content .live-chat .chat-comment-form {
    flex-shrink: 0;
  }
  #primary-content .live-chat .private-chat-name, #primary-content .live-chat .private-chat-message {
    font-size: 16px;
  }
  #primary-content .live-chat .private-chat-name {
    margin-right: 1em;
  }
  #primary-content .live-chat .private-chat-name.Actor {
    color: red;
  }
  #primary-content .live-chat .private-chat-name.Staff {
    color: green;
  }
  #primary-content .live-chat #live-auction-popup .live-auction-popup-body {
    background-color: white;
  }
  #secondary-content .live-chat {
    flex-grow: 1;
    position: relative;
  }
  #secondary-content .live-chat:before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0));
  }
  #secondary-content .live-chat #live-auction-popup .live-auction-popup-body {
    background-color: white;
  }
  #secondary-content .live-chat .auction-link {
    margin: 2em 0;
    text-align: center;
  }
  #secondary-content .live-chat .auction-link .bid-btn {
    background-color: #84BD00;
    border-radius: 10px;
    color: white;
    padding: 1em;
  }
}
#live-chat-exit {
  padding: 20px 0 24px;
  border-top: 1px solid #ddd;
  text-align: center;
}

.chat-comment-counter {
  color: gray;
  font-size: 10px;
}

.chat-comments {
  flex-grow: 1;
  padding: 15px;
  overflow-y: auto;
  overflow-x: hidden;
}
.chat-comments .system-message {
  margin: 15px 0;
  text-align: center;
}
.chat-comments .system-message .rounded-label {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 15px;
  font-size: 12px;
}
.chat-comments .system-message--log .rounded-label {
  border: 1px solid #737373;
  color: #737373;
}
.chat-comments .system-message--tip .rounded-label {
  color: #000;
}
.chat-comments .system-message--timekeeper .rounded-label {
  border: 1px solid #737373;
  background-color: #737373;
  color: #fff;
}
.chat-comments .user-comment {
  display: flex;
  margin-bottom: 10px;
}
.chat-comments .user-comment .comment-list {
  flex: 1 0 0%;
  margin: 5px 0;
}
.chat-comments .user-comment .comment-list .comment {
  display: flex;
  margin-bottom: 10px;
  padding-left: 7px;
}
.chat-comments .user-comment .comment-list .comment:last-child {
  margin-bottom: 0;
}
.chat-comments .user-comment .comment-list .comment .balloon {
  font-size: 16px;
  position: relative;
  display: inline-block;
  padding: 9px 12px;
  border-radius: 8px;
  background-color: #fff;
  color: #000000;
  overflow-wrap: anywhere;
}
.chat-comments .user-comment .comment-list .comment .balloon:before {
  content: "";
  position: absolute;
  top: 0;
  left: -7px;
  border-left: 7px solid transparent;
  border-top: 7px solid #fff;
  width: 14px;
}
.chat-comments .user-comment .comment-list .comment .meta {
  color: #737373;
  font-size: 14px;
  margin-left: 8px;
  align-self: flex-end;
}
.chat-comments .user-comment.user-comment__muted {
  display: none;
}
.chat-comments .user-comment.user-comment__ordinary .comment-list .comment {
  line-height: 14px;
}
.chat-comments .user-comment.user-comment__ordinary .comment-list .comment .balloon {
  font-size: 14px;
  padding: 6px 12px;
  color: #333333;
}
.chat-comments .user-comment.user-comment__ordinary .comment-list .comment .meta {
  font-size: 12px;
}

.chat-comment-form {
  position: relative;
  padding: 30px 80px 30px 30px;
  background-color: #fff;
}
.chat-comment-form .submit {
  top: -30px;
  position: absolute;
  right: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  cursor: pointer;
  background-color: #84bd00;
  color: #fff;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
}
.chat-comment-form .blocked {
  background-color: red;
}

.preferred-seat .chat-comment-form .submit {
  background-color: #EB0000;
}

#chat-comments-form-public .field {
  font-size: 16px;
}

#chat-comments-form-private {
  padding: 10px 60px 0px 30px;
}
#chat-comments-form-private .field {
  font-size: 16px;
}
#chat-comments-form-private .material-icons {
  font-size: 12px;
}
#chat-comments-form-private .submit {
  top: 4px;
  height: 30px;
  width: 30px;
}

.live-chat .thumbnail {
  max-width: 360px;
}
.live-chat .message-container {
  display: flex;
  margin: 1em 0;
}
.live-chat .message-block {
  margin-left: 1em;
  padding-top: 0.5em;
}
.live-chat .message {
  background-color: white;
  border-radius: 15px;
  float: left;
  font-size: 1.25em;
  padding: 0.5em 1em;
  position: relative;
}
.live-chat .message:after {
  content: "";
  position: absolute;
  left: 2px;
  top: 50%;
  width: 0;
  height: 0;
  border: 12px solid transparent;
  border-right-color: white;
  border-left: 0;
  border-top: 0;
  margin-top: -6px;
  margin-left: -12px;
}
.live-chat .messages {
  padding: 2em 0 2em 1em;
}
.live-chat .message-block.Actor .message {
  color: rgb(146, 1, 247);
  font-size: 1.2em;
}
.live-chat .message-block.Staff .message {
  color: rgb(12, 210, 55);
  font-size: 1.2em;
}
.live-chat .ng {
  color: red;
}
.live-chat .name {
  color: gray;
  font-size: 0.9em;
  padding-left: 1em;
}
.live-chat .avatar {
  max-width: 56px;
  min-width: 56px;
  display: flex;
  margin-left: 1em;
}
.live-chat .avatar img {
  border-radius: 50px;
  display: inline;
  max-height: 48px;
  max-width: 48px;
  -o-object-fit: contain;
  object-fit: contain;
}
.live-chat .time {
  display: flex;
  float: left;
  font-size: 0.9em;
  padding: 1.4em 0 0 0.5em;
}
.live-chat .notification, .live-chat .leave, .live-chat .enter {
  border: 1px solid gray;
  border-radius: 20px;
  color: red;
  display: table;
  margin: 1em auto;
  padding: 0.6em;
}
.live-chat .enter {
  color: black;
}
.live-chat .leave {
  background-color: gray;
  color: white;
}
.live-chat .chat-input {
  background: transparent;
  border: 0;
  flex-grow: 1;
  outline: 0;
}
.live-chat .delete {
  color: red;
  cursor: pointer;
}

body[data-controller="user/live_streams"] .nn-page-main-header.with-cover-image {
  padding: 0;
}
body[data-controller="user/live_streams"] .nn-page-main-header .cover-image-spacer {
  width: 100%;
  height: 0;
  padding: 0 0 50%;
}

.page-main .special-offer {
  color: #856404;
  background-color: #fff3cd;
  border-color: #ffeeba;
  position: relative;
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
}
.page-main .special-offer .nn-button {
  background-color: rgb(133, 100, 4);
  color: white;
  margin: 2px 0px;
  border-radius: 2px;
}
.page-main .special-offer .nn-button:hover {
  cursor: pointer;
  background-color: rgba(133, 100, 4, 0.7);
}
@media screen and (max-width: 768px) {
  .page-main .special-offer .nn-button {
    width: 100%;
  }
}
.page-main .special-offer .big {
  font-size: 1.3em;
}