@charset "UTF-8";
abbr, address, article, aside, audio, b, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, mark, menu, nav, object, pre, q, samp, section, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block; }

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden],
template {
  display: none; }

a {
  background-color: transparent;
  text-decoration: none;
  cursor: pointer; }

a:active,
a:hover {
  outline: 0; }

abbr[title] {
  border-bottom: 1px dotted; }

b,
strong {
  font-weight: 700; }

dfn {
  font-style: italic; }

mark {
  background: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 1em 40px; }

hr {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

pre {
  overflow: auto; }

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0; }

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none; }

button {
  overflow: visible;
  outline: none;
  border: 0; }

button,
select {
  text-transform: none; }

button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer; }

input[type=text],
input[type=email],
input[type=password] {
  font-size: 16px; }

button[disabled],
html input[disabled] {
  cursor: default; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

input {
  line-height: normal;
  font-size: 1em; }

input[type=checkbox],
input[type=radio] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0; }

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  height: auto; }

input[type=search] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box; }

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none; }

legend {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto; }

optgroup {
  font-weight: 700; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

button:not(.search-tab):focus {
  outline: 0; }

@font-face {
  font-family: 'animax';
  src: url("fonts/animax.eot?xwiw1x");
  src: url("fonts/animax.eot?xwiw1x#iefix") format("embedded-opentype"), url("fonts/animax.ttf?xwiw1x") format("truetype"), url("fonts/animax.woff?xwiw1x") format("woff"), url("fonts/animax.svg?xwiw1x#animax") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block; }
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'animax' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-x:before {
  content: "\e910"; }

.icon-premium:before {
  content: "\e919"; }

.icon-reaction:before {
  content: "\e918"; }

.icon-send:before {
  content: "\e917"; }

.icon-tag:before {
  content: "\e916"; }

.icon-ticket:before {
  content: "\e915"; }

.icon-facebook:before {
  content: "\e90e"; }

.icon-instagram:before {
  content: "\e90f"; }

.icon-line:before {
  content: "\e911"; }

.icon-browser:before {
  content: "\e914"; }

.icon-circle-yen:before {
  content: "\e913"; }

.icon-yen:before {
  content: "\e912"; }

.icon-bs-animax:before {
  content: "\e903"; }

.icon-heart:before {
  content: "\e90d"; }

.icon-checked-large:before {
  content: "\e90c"; }

.icon-delete:before {
  content: "\e90b"; }

.icon-question:before {
  content: "\e909"; }

.icon-checked:before {
  content: "\e90a"; }

.icon-share:before {
  content: "\e907"; }

.icon-favorite:before {
  content: "\e908"; }

.icon-arrow-bottom:before {
  content: "\e906"; }

.icon-info:before {
  content: "\e905"; }

.icon-triangle:before {
  content: "\e904"; }

.icon-play:before {
  content: "\e902"; }

.icon-arrow-right:before {
  content: "\e900"; }

.icon-arrow-left:before {
  content: "\e901"; }

/* BASE COLOR */
/* LOGO */
/* BASE SIZE */
/* BREAK POINT */
/* BASE MARGIN */
/* BASE PARTS */
/* GRADIENT */
/* BASE THUMBNAIL IMAGE */
/* hover */
/* mixin */
body,
html {
  -webkit-font-smoothing: subpixel-antialiased;
  font-family: avenir,"Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", "MS PGothic", Helvetica, sans-serif;
  line-height: 1.5;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
  width: 100%;
  position: relative;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

html {
  font-size: 10px; }

body {
  color: #555555;
  background-color: #ffffff;
  margin: 0;
  font-size: 1.2rem; }
  @media (min-width: 768px) {
    body {
      font-size: 1.4rem; } }

img {
  pointer-events: none; }

a {
  color: #555555; }
  a.under-line {
    text-decoration: underline; }
    a.under-line:hover {
      opacity: .8; }
  a.white-color {
    color: #fff; }

a:not(.card):not(.hover-play-text):not(.btn):not(.tag):hover {
  text-decoration: underline; }

a:not(.card):not(.hover-play-text):not(.btn):focus {
  text-decoration: underline;
  outline: transparent; }

p {
  margin: 0; }
  p + p {
    margin-top: 1rem; }

.hr {
  height: 0;
  margin: 2rem auto;
  width: 70%;
  border-top: 1px #0076f8 dashed; }
  @media (min-width: 897px) {
    .hr {
      margin: 1.5rem 0; } }

.opacity-transparent {
  opacity: 0 !important; }

.display-none {
  display: none !important; }

.lockup {
  position: relative; }

.clearfix {
  display: inline-block; }
  .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden; }

* html .clearfix {
  height: 1%; }

.clearfix {
  display: block; }

.stamp {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 20px; }

ul {
  padding: 0;
  margin: 0; }
  ul li {
    padding: 0;
    list-style: none; }

i.font-icon {
  margin-right: 1.4rem; }

.fL {
  float: left; }

.fR {
  float: right; }

.mainView {
  position: relative; }
  @media (min-width: 768px) {
    .mainView {
      min-height: 500px; } }

header + .mainView .contentTitle {
  padding-top: 5rem; }
  @media (min-width: 768px) {
    header + .mainView .contentTitle {
      padding-top: 6rem; } }

.blurBg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden; }
  .blurBg > div:not(.swiper-wrapper) {
    -webkit-filter: blur(12px);
    -moz-filter: blur(12px);
    -o-filter: blur(12px);
    -ms-filter: blur(12px);
    filter: blur(12px);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%; }
  .blurBg .swiper-wrapper {
    z-index: 0; }
    .blurBg .swiper-wrapper .swiper-slide {
      -webkit-filter: blur(12px);
      -moz-filter: blur(12px);
      -o-filter: blur(12px);
      -ms-filter: blur(12px);
      filter: blur(12px);
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      width: 100%;
      height: 100%;
      display: none; }
      .blurBg .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
        display: block; }
  .blurBg::before, .blurBg::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1; }
  .blurBg::before {
    background: -webkit-gradient(linear, left top, left bottom, from(#0076f8), to(#00d2f8));
    background: -moz-linear-gradient(to bottom, #0076f8, #00d2f8);
    background: linear-gradient(to bottom, #0076f8, #00d2f8);
    opacity: 0.8; }
  .blurBg::after {
    background: url("../images/line.png") 100% top no-repeat;
    opacity: 0.2; }
  .blurBg.dark {
    background-color: #000; }
    .blurBg.dark::before {
      background: -webkit-gradient(linear, left top, left bottom, from(#00165f), to(#000));
      background: -moz-linear-gradient(to bottom, #00165f, #000);
      background: linear-gradient(to bottom, #00165f, #000);
      height: 50%; }
    .blurBg.dark::after {
      display: none; }

.contentTitle {
  background-color: #b1b1b1;
  color: #ffffff;
  position: relative;
  overflow: hidden; }
  .contentTitle > *:not(.blurBg) {
    z-index: 1;
    position: relative; }
  .contentTitle h2.page-title {
    margin-bottom: 2.4rem;
    margin-top: 2.4rem;
    text-shadow: 1px 1px 0 rgba(5, 45, 90, 0.5);
    font-size: 1.8rem;
    font-weight: normal; }
    @media (max-width: 767px) {
      .contentTitle h2.page-title {
        padding-right: 1.4rem;
        padding-left: 1.4rem; } }
    @media (min-width: 768px) {
      .contentTitle h2.page-title {
        padding-right: 5.4%;
        padding-left: 5.4%; } }
    @media (min-width: 897px) and (max-width: 1440px) {
      .contentTitle h2.page-title {
        padding-right: 7.4%;
        padding-left: 7.4%; } }
    @media (min-width: 1441px) {
      .contentTitle h2.page-title {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto; } }
    @media (min-width: 897px) {
      .contentTitle h2.page-title {
        font-size: 2rem; } }
    @media (min-width: 1024px) {
      .contentTitle h2.page-title {
        font-size: 2.6rem; } }
    @media (min-width: 768px) {
      .contentTitle h2.page-title {
        margin-top: 4rem;
        margin-bottom: 4rem; } }
    .contentTitle h2.page-title .date {
      font-size: 1.2rem;
      display: block; }

.bd {
  z-index: 0;
  overflow-x: hidden; }

.cf:before,
.cf:after {
  content: " ";
  display: table; }

.cf:after {
  clear: both; }

.cf {
  *zoom: 1; }

.ellipsized {
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden; }

.text-center {
  text-align: center; }

.text-bold {
  font-weight: bold; }

.icon-button {
  display: inline-block;
  color: #fff;
  position: relative; }

.pos-abs {
  position: absolute; }

.pos-rel {
  position: relative; }

.overflow-hidden {
  overflow: hidden; }

.d-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }

.jc-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

.ac-center {
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center; }

.ai-center {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center; }

.flx-dir-col {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column; }

.w-100 {
  width: 100%; }

.h-100 {
  height: 100%; }

.right-0 {
  right: 0; }

.left-0 {
  left: 0; }

.top-0 {
  top: 0; }

.bottom-0 {
  bottom: 0; }

.opacity-0 {
  opacity: 0; }

.opacity-1 {
  opacity: 1; }

.h-9-em {
  height: 9em; }

.h-10-em {
  height: 10em; }

.h-11-em {
  height: 11em; }

.h-12-em {
  height: 12em; }

.h-13-em {
  height: 13em; }

.min-h-5-rem {
  min-height: 5rem; }

.min-h-6-rem {
  min-height: 6rem; }

.min-h-7-rem {
  min-height: 7rem; }

.no-margin {
  margin: 0 !important; }

.error-message {
  color: #f02d2d;
  margin: 10px 0 0; }
  .error-message > i {
    color: #f02d2d;
    margin-right: .5em; }

.danger-text {
  color: #f02d2d !important; }

.pink-text {
  color: #f2106f; }

.bold-text {
  font-weight: bold; }

.big-text {
  font-size: 1.4rem; }
  @media (min-width: 897px) {
    .big-text {
      font-size: 1.6rem; } }

.thumbnail {
  padding-top: 56.25%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: relative; }

.alt-text {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  padding: 0 1.5em;
  margin-top: -.5em;
  color: #8c9395;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 1rem;
  box-sizing: border-box;
  text-align: center; }

/* button */
.btn {
  padding: 1.5rem 2rem;
  min-width: 10rem;
  text-align: center;
  box-sizing: border-box;
  line-height: 1.2;
  position: relative;
  display: inline-block;
  font-size: 1.4rem;
  border-radius: 4px;
  transition: all 0.3s ease;
  cursor: pointer; }
  @media (min-width: 768px) {
    .btn {
      padding: 2rem; } }
  .btn + .btn {
    margin-left: 1rem; }
  .btn > div,
  .btn > span {
    position: relative; }
    .btn > div:not(.hover-icon) > i,
    .btn > span:not(.hover-icon) > i {
      margin-left: .5rem; }
      .btn > div:not(.hover-icon) > i.left,
      .btn > span:not(.hover-icon) > i.left {
        margin-right: .5rem;
        margin-left: 0; }
    .btn > div.hover-icon,
    .btn > span.hover-icon {
      padding-right: 2.5rem;
      display: inline-block; }
      .btn > div.hover-icon i,
      .btn > span.hover-icon i {
        transition: right 0.3s ease;
        position: absolute;
        right: .5rem;
        top: 50%;
        margin-top: -1rem; }
  .btn:hover > span.hover-icon i {
    right: 0; }
  .btn > span {
    display: block; }
    .btn > span.price-text {
      font-size: 1.4rem; }
      @media (min-width: 897px) {
        .btn > span.price-text {
          font-size: 1.6rem; } }
    .btn > span.price {
      margin-top: .5rem; }
      .btn > span.price > span {
        font-size: 1.8rem; }
        @media (min-width: 897px) {
          .btn > span.price > span {
            font-size: 2rem; } }
  .btn.browser {
    padding-right: 5rem !important; }
    .btn.browser::after {
      content: "\e914";
      font-family: "animax" !important;
      position: absolute;
      right: 2rem;
      top: 0;
      bottom: 0;
      margin: auto;
      height: 1.3rem; }
    .btn.browser.btn-small {
      padding-right: 2rem !important; }
      .btn.browser.btn-small::after {
        right: 1rem; }
        @media (max-width: 767px) {
          .btn.browser.btn-small::after {
            height: 1rem;
            font-size: 1rem; } }
  .btn.btn-fill {
    color: #fff; }
    .btn.btn-fill.accent-color {
      background: -webkit-gradient(linear, left top, right bottom, from(#00d2f8), to(#0076f8));
      background: -moz-linear-gradient(to left, #00d2f8, #0076f8);
      background: linear-gradient(to left, #00d2f8, #0076f8);
      box-shadow: 0 8px 22px rgba(0, 210, 255, 0.2); }
      .btn.btn-fill.accent-color:focus, .btn.btn-fill.accent-color:hover {
        box-shadow: 0 0 5px rgba(195, 229, 235, 0.6); }
    .btn.btn-fill.secondary-color {
      background: -webkit-gradient(linear, left top, right bottom, from(#ffc284), to(#f2106f));
      background: -moz-linear-gradient(to left, #ffc284, #f2106f);
      background: linear-gradient(to left, #ffc284, #f2106f);
      box-shadow: 0 4px 10px rgba(242, 16, 59, 0.2); }
      .btn.btn-fill.secondary-color:focus, .btn.btn-fill.secondary-color:hover {
        box-shadow: none; }
    .btn.btn-fill.gray-color {
      background-color: #8c9395; }
      .btn.btn-fill.gray-color:focus, .btn.btn-fill.gray-color:hover {
        background-color: #0076f8; }
    .btn.btn-fill.blue-color {
      background-color: #0076f8; }
    .btn.btn-fill.danger-color {
      background-color: #f02d2d;
      border: 1px transparent solid; }
      .btn.btn-fill.danger-color:focus, .btn.btn-fill.danger-color:hover {
        background-color: #fff;
        color: #f02d2d;
        border-color: #f02d2d; }
    .btn.btn-fill.x-color {
      background-color: #fff;
      color: #000; }
      .btn.btn-fill.x-color:focus, .btn.btn-fill.x-color:hover {
        background-color: #fff;
        color: #0076f8; }
    .btn.btn-fill.white-color {
      background-color: #fff;
      color: #0076f8; }
      .btn.btn-fill.white-color:hover {
        background-color: #0076f8;
        color: #fff; }
      .btn.btn-fill.white-color.pink-text {
        color: #f2106f; }
        .btn.btn-fill.white-color.pink-text:focus, .btn.btn-fill.white-color.pink-text:hover {
          background-color: #f2106f;
          color: #fff; }
    .btn.btn-fill.tvod-color {
      background-color: #f2106f;
      color: #ffffff; }
      .btn.btn-fill.tvod-color > i.icon-yen {
        font-size: 1.4rem;
        vertical-align: -.2rem; }
        @media (min-width: 897px) {
          .btn.btn-fill.tvod-color > i.icon-yen {
            font-size: 1.8rem;
            vertical-align: -.3rem; } }
  .btn.btn-line {
    border: 1px transparent solid; }
    .btn.btn-line.accent-color {
      border-right-color: #00d2f8;
      border-left-color: #0076f8;
      position: relative;
      background: -webkit-gradient(linear, left top, right bottom, from(#00d2f8), to(#0076f8));
      background: -moz-linear-gradient(to left, #00d2f8, #0076f8);
      background: linear-gradient(to left, #00d2f8, #0076f8);
      box-shadow: 0 6px 18px -3px rgba(0, 175, 208, 0.2);
      color: #0076f8; }
      @media (min-width: 768px) {
        .btn.btn-line.accent-color {
          box-shadow: 0 12px 33px -10px rgba(0, 175, 208, 0.3); } }
      .btn.btn-line.accent-color::before {
        content: "";
        position: absolute;
        width: 100%;
        right: 0;
        left: 0;
        bottom: 0;
        top: 0;
        background: #fff;
        border-radius: 3px; }
      .btn.btn-line.accent-color:focus, .btn.btn-line.accent-color:hover {
        box-shadow: 0 0 5px rgba(195, 229, 235, 0.6); }
    .btn.btn-line.secondary-color {
      border-right-color: #ffc284;
      border-left-color: #f2106f;
      position: relative;
      background: -webkit-gradient(linear, left top, right bottom, from(#ffc284), to(#f2106f));
      background: -moz-linear-gradient(to left, #ffc284, #f2106f);
      background: linear-gradient(to left, #ffc284, #f2106f);
      box-shadow: 0 6px 13px rgba(242, 16, 59, 0.16);
      color: #f2106f; }
      @media (min-width: 768px) {
        .btn.btn-line.secondary-color {
          box-shadow: 0 4px 16px rgba(242, 16, 59, 0.16); } }
      .btn.btn-line.secondary-color::before {
        content: "";
        position: absolute;
        width: 100%;
        right: 0;
        left: 0;
        bottom: 0;
        top: 0;
        background: #fff;
        border-radius: 3px; }
      .btn.btn-line.secondary-color:focus, .btn.btn-line.secondary-color:hover {
        box-shadow: 0 0 5px rgba(242, 16, 59, 0.16); }
    .btn.btn-line.gray-color {
      border-color: #8c9395;
      color: #8c9395; }
      .btn.btn-line.gray-color:focus, .btn.btn-line.gray-color:hover {
        border-color: #8c9395;
        background-color: #8c9395;
        color: #fff; }
    .btn.btn-line.blue-color {
      border-color: #0076f8;
      color: #0076f8;
      box-shadow: 0 5px 17px rgba(195, 229, 235, 0.6); }
      .btn.btn-line.blue-color:focus, .btn.btn-line.blue-color:hover {
        box-shadow: none; }
    .btn.btn-line.white-color {
      border-color: #ffffff;
      color: #ffffff; }
      .btn.btn-line.white-color:focus, .btn.btn-line.white-color:hover {
        border-color: #ffffff;
        background-color: #ffffff;
        color: #0076f8;
        text-shadow: none; }
      .btn.btn-line.white-color.pink-text {
        color: #fdf0d3; }
        .btn.btn-line.white-color.pink-text:focus, .btn.btn-line.white-color.pink-text:hover {
          background-color: #fdf0d3;
          color: #fff; }
  .btn.btn-small {
    padding: 1rem 2.4rem;
    font-size: 1.2rem; }
  .btn.btn-wide {
    width: 100%; }
  .btn.btn-radius {
    border-radius: 4px; }
  .btn.disabled, .btn [disabled] {
    opacity: .5;
    pointer-events: none; }
  .btn > i {
    margin-right: 0.7rem; }
  .btn .bold-text {
    font-size: 1.4rem;
    font-weight: bold; }
    @media (min-width: 897px) {
      .btn .bold-text {
        font-size: 1.6rem; } }

.favorite-btn.add {
  background-color: #0076f8 !important;
  border-color: #0076f8 !important;
  color: #fff; }
  .favorite-btn.add:focus, .favorite-btn.add:hover {
    border-color: #fff !important;
    background-color: #fff !important; }

.thumbnail {
  padding-top: 56.25%;
  height: 0;
  width: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; }

@media (max-width: 767px) {
  .content-alignment {
    padding-right: 1.4rem;
    padding-left: 1.4rem; } }
@media (min-width: 768px) {
  .content-alignment {
    padding-right: 5.4%;
    padding-left: 5.4%; } }
@media (min-width: 897px) and (max-width: 1440px) {
  .content-alignment {
    padding-right: 7.4%;
    padding-left: 7.4%; } }
@media (min-width: 1441px) {
  .content-alignment {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto; } }

@media (max-width: 767px) {
  .content-alignment-margin {
    margin-right: 1.4rem;
    margin-left: 1.4rem; } }
@media (min-width: 768px) {
  .content-alignment-margin {
    margin-right: 5.4%;
    margin-left: 5.4%; } }
@media (min-width: 897px) and (max-width: 1440px) {
  .content-alignment-margin {
    margin-right: 7.4%;
    margin-left: 7.4%; } }
@media (min-width: 1441px) {
  .content-alignment-margin {
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto; } }

.panel {
  max-width: 80rem;
  margin: auto; }

.bg-block {
  background-color: #151515;
  padding: 2.8rem; }
  @media screen and (max-width: 767px) {
    .bg-block {
      padding-top: 2.4rem;
      padding-bottom: 2.4rem; } }
  .bg-block + .bg-block {
    margin-top: 1rem; }
  .bg-block .bg-block-header {
    margin-bottom: 1rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    -moz-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    font-size: 1.4rem; }

.form-box {
  margin-top: 2rem; }
  @media (min-width: 897px) {
    .form-box {
      margin-top: 3rem; } }
  .form-box .label {
    margin-bottom: 1rem;
    display: block;
    font-weight: bold; }
  .form-box + .form-box {
    padding-top: 2rem;
    border-top: 1px #d4d7d9 solid; }
    @media (min-width: 897px) {
      .form-box + .form-box {
        padding-top: 3rem; } }

.input-wrapper > input {
  width: 100%;
  height: auto;
  border: 1px solid #d4d7d9;
  background-color: #f9f9f9;
  padding: 1rem;
  box-sizing: border-box;
  border-radius: 4px; }
.input-wrapper .note {
  font-size: 1.2rem;
  color: #8c9395;
  margin-top: .5rem; }
.input-wrapper .error-wrapper {
  margin-top: 1rem; }
  .input-wrapper .error-wrapper > p {
    margin: .5rem 0 0;
    color: #f2106f;
    font-weight: bold; }

#coupon-box {
  display: none;
  pointer-events: none; }
  #coupon-box.open {
    display: block;
    pointer-events: all; }

.dropdown {
  position: relative; }
  .dropdown .dropdown-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer; }
    .dropdown .dropdown-link:hover .icon-triangle {
      margin-top: .7rem; }
    .dropdown .dropdown-link > * {
      pointer-events: none; }
    .dropdown .dropdown-link .icon-triangle {
      margin-left: .5rem;
      font-size: 1rem;
      margin-top: .2rem;
      transition: margin-top 0.3s ease, transform 0.3s ease; }
  .dropdown.open-dropdown .dropdown-link .icon-triangle {
    transform: rotate(-180deg); }
  .dropdown .dropdown-menu {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    background-color: #ffffff;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    min-width: 20rem;
    border: 1px #d4d7d9 solid;
    font-size: 1.4rem;
    color: #555555;
    margin-top: 1rem;
    padding: 2rem;
    box-sizing: border-box;
    -webkit-transition: opacity 3s ease;
    -moz-transition: opacity 3s ease;
    -o-transition: opacity 3s ease;
    transition: opacity 0.3s ease;
    z-index: 3; }
    .dropdown .dropdown-menu.open {
      opacity: 1;
      pointer-events: auto; }
    .dropdown .dropdown-menu.right {
      right: 0; }
    .dropdown .dropdown-menu.left {
      left: 0; }
    .dropdown .dropdown-menu ul + ul {
      margin-top: 2rem; }
    .dropdown .dropdown-menu ul.menu li:first-child {
      border-top: 1px #d4d7d9 solid; }
    .dropdown .dropdown-menu ul.menu li:last-child {
      border-bottom: 1px #d4d7d9 solid; }
    .dropdown .dropdown-menu ul.menu li + li {
      border-top: 1px #d4d7d9 solid; }
    .dropdown .dropdown-menu ul li div, .dropdown .dropdown-menu ul li a:not(.btn) {
      display: block;
      cursor: pointer;
      transition: background-color 0.3s ease;
      padding: 1.2rem .5rem; }
      .dropdown .dropdown-menu ul li div:hover, .dropdown .dropdown-menu ul li a:not(.btn):hover {
        background-color: #f6f7f9;
        text-decoration: none !important; }
    .dropdown .dropdown-menu ul li .btn {
      width: 100%; }
  .dropdown.box-dropdown {
    min-width: 15rem;
    display: inline-block; }
    .dropdown.box-dropdown .dropdown-link {
      border: 1px #eee solid;
      padding: 1rem; }
      .dropdown.box-dropdown .dropdown-link .icon-triangle {
        margin-left: auto; }
    .dropdown.box-dropdown .dropdown-menu {
      padding: 0; }
      .dropdown.box-dropdown .dropdown-menu:before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 2rem;
        background: -webkit-gradient(linear, right bottom, right top, from(#fff), to(rgba(255, 255, 255, 0)));
        background: -moz-linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
        background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0)); }
    .dropdown.box-dropdown .dropdown-inner {
      max-height: 44vh;
      min-height: 30rem;
      overflow-y: scroll;
      overflow-x: hidden;
      padding: 1rem 2rem; }

body.is-modal-opened {
  overflow: hidden; }

.modal-wrapper {
  background-color: rgba(0, 0, 0, 0.9);
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  display: none;
  z-index: 1000;
  max-width: initial !important;
  padding-top: 2rem;
  padding-bottom: 2rem;
  box-sizing: border-box;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow-y: auto; }
  @media (max-width: 767px) {
    .modal-wrapper {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (min-width: 768px) {
    .modal-wrapper {
      padding-right: 5.4%;
      padding-left: 5.4%; } }
  @media (min-width: 897px) and (max-width: 1440px) {
    .modal-wrapper {
      padding-right: 7.4%;
      padding-left: 7.4%; } }
  @media (min-width: 1441px) {
    .modal-wrapper {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; } }
  .modal-wrapper .modal-table {
    max-width: 80rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    margin: auto; }
    .modal-wrapper .modal-table .modal-video {
      padding-top: 56.25%;
      position: relative;
      background: #000;
      width: 100%;
      height: 0; }
      .modal-wrapper .modal-table .modal-video > * {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important; }
    .modal-wrapper .modal-table > .btn {
      margin: 2rem auto 0; }
    .modal-wrapper .modal-table > img {
      width: 100%;
      height: auto; }
      .modal-wrapper .modal-table > img.xs-hidden {
        display: none; }
        @media (min-width: 768px) {
          .modal-wrapper .modal-table > img.xs-hidden {
            display: block; } }
      .modal-wrapper .modal-table > img.xs-visible {
        display: block;
        max-width: 75vw;
        margin: auto;
        min-width: 28rem; }
        @media (min-width: 321px) {
          .modal-wrapper .modal-table > img.xs-visible {
            min-width: 32rem; } }
        @media (min-width: 768px) {
          .modal-wrapper .modal-table > img.xs-visible {
            display: none; } }
    .modal-wrapper .modal-table .share-wrapper {
      width: 100%;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      @media (max-width: 767px) {
        .modal-wrapper .modal-table .share-wrapper {
          -webkit-box-pack: center;
          -webkit-justify-content: center;
          -moz-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center; } }
      .modal-wrapper .modal-table .share-wrapper .share {
        display: block;
        color: #fff;
        font-size: 1.4rem;
        padding: 1.5rem;
        width: 33.3333333333%;
        margin: 0.5rem;
        min-width: 5rem; }
        .modal-wrapper .modal-table .share-wrapper .share:hover {
          opacity: .8; }
        .modal-wrapper .modal-table .share-wrapper .share > i {
          font-size: 2.5rem;
          display: block;
          margin: 0 auto 1rem; }
          @media (min-width: 768px) {
            .modal-wrapper .modal-table .share-wrapper .share > i {
              font-size: 3rem; } }
        .modal-wrapper .modal-table .share-wrapper .share.x {
          background-color: #fff;
          color: #000; }
          .modal-wrapper .modal-table .share-wrapper .share.x > i {
            line-height: 2.5rem;
            font-size: 2rem; }
            @media (min-width: 768px) {
              .modal-wrapper .modal-table .share-wrapper .share.x > i {
                font-size: 2.5rem;
                line-height: 3rem; } }
        .modal-wrapper .modal-table .share-wrapper .share.facebook {
          background-color: #1877f2; }
        .modal-wrapper .modal-table .share-wrapper .share.instagram {
          background-color: #D93177; }
        .modal-wrapper .modal-table .share-wrapper .share.line {
          background-color: #00b900; }
        @media (min-width: 768px) {
          .modal-wrapper .modal-table .share-wrapper .share + .share {
            margin: 0 0 0 1rem; } }
    .modal-wrapper .modal-table .title-wrapper {
      text-align: center;
      font-size: 2.5rem;
      color: #fff;
      margin-bottom: 4rem; }
    .modal-wrapper .modal-table .text-wrapper {
      width: 100%; }
      .modal-wrapper .modal-table .text-wrapper > p {
        color: #fff; }
    .modal-wrapper .modal-table .btn-wrapper {
      margin-top: 4rem;
      text-align: center; }
      @media (max-width: 767px) {
        .modal-wrapper .modal-table .btn-wrapper > .btn {
          display: block;
          margin: auto; }
          .modal-wrapper .modal-table .btn-wrapper > .btn + .btn {
            margin-top: 1rem; } }
      @media (min-width: 481px) and (max-width: 767px) {
        .modal-wrapper .modal-table .btn-wrapper > .btn {
          width: 80%;
          min-width: 28rem; } }
  .modal-wrapper.white {
    background-color: #fff; }
    .modal-wrapper.white .modal-table .title-wrapper {
      color: #0076f8; }
    .modal-wrapper.white .modal-table .text-wrapper {
      width: 100%; }
      .modal-wrapper.white .modal-table .text-wrapper > p {
        color: #555555; }

#shareModal .modal-table {
  max-width: 45rem; }

.more-wrapper {
  margin-top: 5rem;
  text-align: center; }
  @media (min-width: 768px) {
    .more-wrapper {
      margin-top: 9rem; } }

* + .loader-wrapper {
  margin-top: 5rem; }
  @media (min-width: 768px) {
    * + .loader-wrapper {
      margin-top: 9rem; } }

.loader {
  border: 0.4rem solid #d4d7d9;
  border-top: .4rem solid #0076F8;
  border-radius: 50%;
  width: 4rem;
  height: 4rem;
  animation: spin 1s linear infinite;
  margin: auto; }

@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
.complete-page {
  text-align: center;
  padding-top: 9.5rem;
  padding-bottom: 9.5rem; }
  @media (min-width: 768px) {
    .complete-page {
      padding-top: 13rem;
      padding-bottom: 13rem; } }
  .complete-page-title {
    border: 1px #0076f8 solid;
    border-radius: 50%;
    width: 10rem;
    height: 10rem;
    font-size: 4rem;
    margin: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #0076f8; }
    @media (min-width: 768px) {
      .complete-page-title {
        width: 15rem;
        height: 15rem;
        font-size: 6rem; } }
  .complete-page > *:not(:last-child) {
    margin-bottom: 3.4rem; }

.more-description-button {
  text-align: center;
  cursor: pointer;
  transition: margin-top 0.3s ease;
  padding: 0 2.4rem;
  position: relative;
  background-color: #ffffff;
  padding-right: 2rem; }
  .more-description-button:before {
    content: "";
    background: -webkit-gradient(linear, right bottom, right top, from(#ffffff), to(rgba(255, 255, 255, 0)));
    background: -moz-linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
    background: linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
    position: absolute;
    top: -4rem;
    left: 0;
    right: 0;
    height: 4rem; }
  .more-description-button::after {
    content: "\e906";
    font-family: 'animax' !important;
    font-size: .5rem;
    margin-left: .5rem;
    display: inline-block; }

.more-description {
  overflow: hidden; }
  .more-description.is-open {
    height: auto !important; }
    .more-description.is-open + .more-description-button {
      margin-top: 2rem; }
      .more-description.is-open + .more-description-button::before {
        display: none; }
      .more-description.is-open + .more-description-button::after {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
        vertical-align: .3rem; }

.no-card {
  text-align: center;
  width: 100%;
  color: #8c9395; }

.grid-container .no-card {
  padding: 10rem 0; }

.free-tag {
  color: #fff;
  font-weight: bold;
  font-size: 1.4rem;
  background: #0076F8;
  padding: 1rem 2rem;
  display: inline-block;
  text-align: center;
  background: linear-gradient(to left, #00d2f8, #0076f8);
  box-sizing: border-box; }
  @media (min-width: 768px) {
    .free-tag {
      width: 7rem;
      font-size: 1.4rem; } }
  @media (min-width: 897px) {
    .free-tag {
      width: 10rem;
      font-size: 1.6rem; } }

.free-text-tag,
.tvod-tag {
  color: #f2106f;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.1rem; }
  @media (min-width: 897px) {
    .free-text-tag,
    .tvod-tag {
      font-size: 1.2rem; } }
  .free-text-tag > i,
  .tvod-tag > i {
    margin-right: .3rem;
    background: #f2106f;
    color: #fff;
    padding: .4rem 0;
    box-sizing: border-box;
    border-radius: 2rem;
    width: 1.8rem;
    height: 1.8rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    @media (min-width: 897px) {
      .free-text-tag > i,
      .tvod-tag > i {
        margin-right: .2rem;
        width: 2rem;
        height: 2rem; } }
    .free-text-tag > i.icon-ticket,
    .tvod-tag > i.icon-ticket {
      font-size: 1.2rem; }
      @media (min-width: 897px) {
        .free-text-tag > i.icon-ticket,
        .tvod-tag > i.icon-ticket {
          font-size: 1.4rem; } }
    .free-text-tag > i.icon-yen,
    .tvod-tag > i.icon-yen {
      font-weight: bold;
      font-size: 1rem; }
      @media (max-width: 896px) {
        .free-text-tag > i.icon-yen,
        .tvod-tag > i.icon-yen {
          padding-top: 0.6rem; } }
      @media (min-width: 897px) {
        .free-text-tag > i.icon-yen,
        .tvod-tag > i.icon-yen {
          padding-left: .1rem; } }

.free-text-tag {
  color: #0076f8; }

.required {
  border: 1px #f2106f solid;
  padding: .2rem .5rem;
  font-size: 1rem;
  color: #fff;
  background: #f2106f;
  margin-left: .5rem; }
  @media (min-width: 897px) {
    .required {
      font-size: 1.2rem; } }

.checkbox-cont {
  position: relative;
  display: block; }
  .checkbox-cont + .checkbox-cont {
    margin-top: 1.5rem; }
  .checkbox-cont.disabled {
    opacity: 0.5; }
    .checkbox-cont.disabled label {
      cursor: default; }
  .checkbox-cont input[type=checkbox] {
    display: inline-block;
    position: absolute;
    opacity: 0;
    width: 2.4rem;
    height: 2.4rem;
    cursor: pointer;
    z-index: 1; }
    .checkbox-cont input[type=checkbox]:checked + label:before {
      border-color: #0076f8;
      background-color: #0076f8; }
  .checkbox-cont .check-box-label {
    display: block;
    padding-left: 3rem; }
    .checkbox-cont .check-box-label:before {
      content: "";
      display: inline-block;
      vertical-align: middle;
      width: 2.2rem;
      height: 2.2rem;
      border: 1px solid #d4d7d9;
      background-color: #f9f9f9;
      position: absolute;
      left: 0;
      top: 0;
      border-radius: 4px; }
    .checkbox-cont .check-box-label:after {
      content: "\e90a";
      font-family: "animax" !important;
      display: block;
      width: 2.4rem;
      height: 2.4rem;
      opacity: 0;
      top: 0;
      left: 0;
      color: #fff;
      position: absolute;
      font-size: 80%;
      line-height: 2.4rem;
      text-align: center;
      margin: auto;
      left: 0; }
  .checkbox-cont input[type=checkbox]:checked + .check-box-label:after {
    opacity: 1; }

.radiobox-item {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  width: 100%; }
  .radiobox-item:not(:last-child) {
    margin-bottom: .5rem; }
  .radiobox-item .radiobox-input {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer; }
    .radiobox-item .radiobox-input + label {
      letter-spacing: normal;
      position: relative;
      cursor: pointer;
      font-weight: bold;
      padding: 1.4rem 1rem 1rem 1.4rem;
      display: inline-block;
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      border: 1px #d4d7d9 solid;
      text-align: center;
      border-radius: 4px; }
      @media (min-width: 481px) {
        .radiobox-item .radiobox-input + label {
          padding: 2rem; } }
    .radiobox-item .radiobox-input:checked + label, .radiobox-item .radiobox-input.focus + label, .radiobox-item .radiobox-input:focus + label {
      box-shadow: 0 0 0 2px #0076f8;
      border-color: #0076f8; }
  .radiobox-item label .img-wrapper {
    margin-top: 1rem; }
    .radiobox-item label .img-wrapper > img {
      width: auto;
      height: auto;
      max-width: 18rem;
      max-height: 2rem;
      display: block;
      margin: auto; }
      @media (min-width: 481px) {
        .radiobox-item label .img-wrapper > img {
          max-width: 23rem;
          max-height: 3rem; } }
  .radiobox-item label > p {
    font-weight: normal;
    font-size: 1.2rem;
    margin-top: 1rem; }

.radiobox-item-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: -.5rem; }
  .radiobox-item-wrapper .radiobox-item {
    padding: .5rem;
    box-sizing: border-box;
    margin: 0; }
    @media (min-width: 768px) {
      .radiobox-item-wrapper .radiobox-item {
        width: calc(50% - 2px); } }

* + .price-tag-wrapper {
  margin-top: 1rem; }

.price-tag-wrapper > span {
  font-size: 1.8rem;
  font-weight: bold; }
  @media (min-width: 897px) {
    .price-tag-wrapper > span {
      font-size: 2rem; } }
.price-tag-wrapper .list-price {
  font-size: 1.4rem;
  display: block;
  text-decoration: line-through;
  margin-bottom: .5rem;
  opacity: .7;
  font-weight: normal; }
.price-tag-wrapper .price-tag {
  font-weight: bold;
  font-size: 1.2rem !important;
  padding: .5rem 1rem;
  border-radius: 28px;
  margin-right: .5rem;
  vertical-align: .3rem;
  display: inline-block; }
  .price-tag-wrapper .price-tag.bg-white {
    background: #fff;
    color: #f2106f; }
  .price-tag-wrapper .price-tag.bg-red {
    background: #f2106f;
    color: #fff; }

.notice-wrapper {
  border: 2px #f2106f solid;
  padding-top: 1rem;
  padding-bottom: 1rem;
  background-color: #fff;
  position: relative;
  z-index: 1001; }
  .notice-wrapper .notice-title {
    color: #f2106f;
    font-weight: bold;
    font-size: 1.3rem; }
    .notice-wrapper .notice-title > i {
      margin-right: .5rem; }
  .notice-wrapper .notice-text {
    font-size: 1.2rem; }
    .notice-wrapper .notice-text > a {
      color: #0076f8; }

header {
  z-index: 1000;
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  background-color: transparent;
  color: #fff;
  transition: background-color 0.3s ease; }
  header .header-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 5rem; }
    @media (max-width: 767px) {
      header .header-inner {
        padding-right: 1.4rem;
        padding-left: 1.4rem; } }
    @media (min-width: 768px) {
      header .header-inner {
        padding-right: 5.4%;
        padding-left: 5.4%; } }
    @media (min-width: 897px) and (max-width: 1440px) {
      header .header-inner {
        padding-right: 7.4%;
        padding-left: 7.4%; } }
    @media (min-width: 1441px) {
      header .header-inner {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto; } }
    @media (min-width: 768px) {
      header .header-inner {
        height: 6rem; } }
    header .header-inner .logo {
      width: 13rem; }
      @media (min-width: 768px) {
        header .header-inner .logo {
          width: 19.6rem; } }
      header .header-inner .logo > a, header .header-inner .logo > div {
        font-size: 1rem;
        font-weight: normal;
        color: #fff;
        height: 2rem;
        width: 100%;
        box-sizing: border-box;
        display: block; }
        @media (min-width: 768px) {
          header .header-inner .logo > a, header .header-inner .logo > div {
            height: 3rem; } }
        header .header-inner .logo > a > img, header .header-inner .logo > div > img {
          width: 100%;
          height: auto;
          display: block; }
          header .header-inner .logo > a > img.normal, header .header-inner .logo > div > img.normal {
            display: none; }
    header .header-inner > a {
      color: #ffffff; }
    header .header-inner .navigation {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-left: 2rem; }
      header .header-inner .navigation > a {
        display: block;
        color: #fff;
        transition: all 0.3s ease; }
        header .header-inner .navigation > a:not(:last-child) {
          margin-right: 1.5rem; }
    header .header-inner .navigation-right {
      margin-left: auto;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      header .header-inner .navigation-right > a {
        color: #fff; }
      header .header-inner .navigation-right .bs-animax {
        font-size: 1rem;
        margin-right: 1.8rem;
        transition: transform 0.2s ease; }
        header .header-inner .navigation-right .bs-animax:hover {
          text-decoration: none !important;
          transform: scale(1.05); }
        header .header-inner .navigation-right .bs-animax > img {
          display: block;
          width: auto;
          height: 26px; }
          header .header-inner .navigation-right .bs-animax > img.blue {
            display: none; }
      @media (max-width: 767px) {
        header .header-inner .navigation-right .account-btn {
          position: static; } }
      header .header-inner .navigation-right .account-btn .account-icon {
        border: 1px #fff solid;
        border-radius: 50%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        width: 3.2rem;
        height: 3.2rem;
        background-color: #d4d7d9; }
        header .header-inner .navigation-right .account-btn .account-icon.hasInfo {
          position: relative; }
          header .header-inner .navigation-right .account-btn .account-icon.hasInfo::after {
            content: "\e905";
            font-family: "animax" !important;
            background-color: #fff;
            border-radius: 50%;
            color: #f2106f;
            width: 1.3rem;
            height: 1.3rem;
            position: absolute;
            top: -.2rem;
            right: -.2rem;
            font-size: 1.4rem;
            line-height: 1; }
      header .header-inner .navigation-right .account-btn .dropdown-menu {
        position: absolute;
        min-width: 27rem; }
        @media screen and (max-width: 767px) {
          header .header-inner .navigation-right .account-btn .dropdown-menu {
            width: 100%;
            position: fixed;
            left: 0;
            right: 0;
            margin-top: .8rem; } }
        header .header-inner .navigation-right .account-btn .dropdown-menu .user-name span {
          color: #8c9395; }
        header .header-inner .navigation-right .account-btn .dropdown-menu .user-name .name {
          font-size: 1.8rem; }
        header .header-inner .navigation-right .account-btn .dropdown-menu .user-name .info-wrapper {
          margin-top: 1rem; }
          header .header-inner .navigation-right .account-btn .dropdown-menu .user-name .info-wrapper .info {
            border: 1px #f2106f solid;
            color: #f2106f;
            padding: 1rem 3rem 1rem 1rem;
            font-size: 1.2rem;
            border-radius: 4px;
            position: relative;
            font-weight: bold;
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -moz-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            line-height: 1.8; }
            header .header-inner .navigation-right .account-btn .dropdown-menu .user-name .info-wrapper .info::after {
              content: '\e900';
              font-family: "animax" !important;
              position: absolute;
              top: 50%;
              right: 1rem;
              margin-top: -1rem; }
            header .header-inner .navigation-right .account-btn .dropdown-menu .user-name .info-wrapper .info:hover {
              background-color: #f2106f;
              color: #fff; }
            header .header-inner .navigation-right .account-btn .dropdown-menu .user-name .info-wrapper .info .icon-info {
              margin-right: .5rem;
              font-size: 1.4rem; }
            header .header-inner .navigation-right .account-btn .dropdown-menu .user-name .info-wrapper .info + .info {
              margin-top: 1rem; }
  header.bg-color {
    position: fixed;
    top: 0;
    color: #555555;
    box-shadow: 0 4px 20px rgba(0, 45, 93, 0.1);
    background-color: #fff; }
    header.bg-color .logo > a > img.white {
      display: none; }
    header.bg-color .logo > a > img.normal {
      display: block; }
    header.bg-color .navigation-right a,
    header.bg-color .navigation a {
      color: #0076f8; }
    header.bg-color .header-inner .navigation-right .bs-animax > img.white {
      display: none; }
    header.bg-color .header-inner .navigation-right .bs-animax > img.blue {
      display: block; }
    header.bg-color .header-inner .navigation-right .account-btn .dropdown-link > i {
      color: #0076f8; }

@media screen and (max-height: 414px) and (max-width: 896px) {
  body.landscape .notice-wrapper.landscape-hidden,
  body.landscape header.landscape-hidden {
    display: none; }
    body.landscape .notice-wrapper.landscape-hidden + .mainView .contentTitle,
    body.landscape header.landscape-hidden + .mainView .contentTitle {
      padding-top: 0; } }
.signup-footer-nav {
  box-shadow: 0 -3px 10px rgba(0, 0, 0, 0.1);
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1rem 1.4rem;
  box-sizing: border-box;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  z-index: 1000;
  background-color: #fff; }
  @media (min-width: 897px) {
    .signup-footer-nav {
      display: none; } }
  .signup-footer-nav > .btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 50%;
    padding-left: .8rem;
    padding-right: .8rem; }

footer .footer-nav-wrapper {
  border-top: 16px #0076f8 solid;
  padding-top: 4.2rem;
  padding-bottom: 4.2rem; }
  @media (max-width: 896px) {
    footer .footer-nav-wrapper .footer-nav-inner {
      padding-left: 0;
      padding-right: 0; } }
  @media (min-width: 897px) {
    footer .footer-nav-wrapper .footer-nav-inner {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center; } }
  footer .footer-nav-wrapper .footer-nav-inner .footer-logo {
    width: 13rem;
    margin-bottom: 1rem; }
    @media (max-width: 896px) {
      footer .footer-nav-wrapper .footer-nav-inner .footer-logo {
        display: block;
        margin: auto; } }
  footer .footer-nav-wrapper .footer-nav-inner .footer-nav {
    margin-top: 2rem; }
    @media (min-width: 897px) {
      footer .footer-nav-wrapper .footer-nav-inner .footer-nav {
        margin-top: 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: -.5rem -1rem; } }
    @media (max-width: 896px) {
      footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li {
        border-bottom: 1px #d4d7d9 solid; }
        footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li:first-child {
          border-top: 1px #d4d7d9 solid; } }
    @media (min-width: 897px) {
      footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li {
        padding: .5rem 1rem;
        box-sizing: border-box; } }
    footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li a {
      display: block; }
      @media (max-width: 896px) {
        footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li a {
          padding-top: 1.2rem;
          padding-bottom: 1.2rem; } }
  @media (max-width: 896px) and (max-width: 767px) {
    footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li a {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (max-width: 896px) and (min-width: 768px) {
    footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li a {
      padding-right: 5.4%;
      padding-left: 5.4%; } }
  @media (max-width: 896px) and (min-width: 897px) and (max-width: 1440px) {
    footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li a {
      padding-right: 7.4%;
      padding-left: 7.4%; } }
  @media (max-width: 896px) and (min-width: 1441px) {
    footer .footer-nav-wrapper .footer-nav-inner .footer-nav > li a {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; } }

  footer .footer-nav-wrapper .footer-nav-inner .right-wrapper {
    margin-left: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    flex-shrink: 0; }
    @media (max-width: 896px) {
      footer .footer-nav-wrapper .footer-nav-inner .right-wrapper {
        margin-top: 2.5rem; } }
  @media (max-width: 896px) and (max-width: 767px) {
    footer .footer-nav-wrapper .footer-nav-inner .right-wrapper {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (max-width: 896px) and (min-width: 768px) {
    footer .footer-nav-wrapper .footer-nav-inner .right-wrapper {
      padding-right: 5.4%;
      padding-left: 5.4%; } }
  @media (max-width: 896px) and (min-width: 897px) and (max-width: 1440px) {
    footer .footer-nav-wrapper .footer-nav-inner .right-wrapper {
      padding-right: 7.4%;
      padding-left: 7.4%; } }
  @media (max-width: 896px) and (min-width: 1441px) {
    footer .footer-nav-wrapper .footer-nav-inner .right-wrapper {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; } }

    footer .footer-nav-wrapper .footer-nav-inner .right-wrapper > *:not(:last-child) {
      margin-right: 1rem; }
    footer .footer-nav-wrapper .footer-nav-inner .right-wrapper .btn {
      padding-left: 2rem;
      padding-right: 2rem;
      padding-top: 1.4rem;
      padding-bottom: 1.4rem; }
    footer .footer-nav-wrapper .footer-nav-inner .right-wrapper .sns-btn {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      background-color: #000;
      color: #ffffff;
      width: 4.5rem;
      height: 4.5rem;
      padding: 0;
      min-width: auto;
      flex-shrink: 0;
      text-align: center;
      font-size: 2rem; }
      footer .footer-nav-wrapper .footer-nav-inner .right-wrapper .sns-btn > i {
        margin-right: 0; }
footer .copyright {
  padding-top: 3.2rem;
  padding-bottom: 3.2rem;
  background-color: #E9F0F4; }

@media (max-width: 896px) {
  .signup-footer-nav + footer {
    padding-bottom: 6rem; } }
/* swiper上書き*/
.swiper-container-large {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1; }

.swiper-container-large,
.swiper-container {
  overflow: visible; }
  .swiper-container-large .swiper-wrapper .swiper-slide,
  .swiper-container .swiper-wrapper .swiper-slide {
    height: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 50%;
    margin-right: 9px; }
    @media (min-width: 897px) {
      .swiper-container-large .swiper-wrapper .swiper-slide,
      .swiper-container .swiper-wrapper .swiper-slide {
        width: 33.3333333333%;
        margin-right: 30px; } }
    @media (min-width: 1024px) {
      .swiper-container-large .swiper-wrapper .swiper-slide,
      .swiper-container .swiper-wrapper .swiper-slide {
        width: 25%;
        margin-right: 36px; } }

.swiper-pagination {
  position: relative;
  bottom: auto !important;
  margin-top: 1.5rem; }
  .swiper-pagination .swiper-pagination-bullet {
    border-radius: 0;
    width: 6px;
    height: 6px;
    vertical-align: middle;
    background-color: #fff;
    opacity: .5;
    transition: opacity 0.3s ease; }
    .swiper-pagination .swiper-pagination-bullet:focus, .swiper-pagination .swiper-pagination-bullet:hover {
      opacity: .3; }
    .swiper-pagination .swiper-pagination-bullet-active {
      width: 10px;
      height: 10px;
      opacity: 1; }

.swiper-container-horizontal > .swiper-scrollbar {
  height: 0; }

@media (min-width: 768px) {
  .swiper-scrollbar {
    display: none; } }

.swiper-button-next,
.swiper-button-prev {
  background-color: rgba(0, 118, 248, 0.8);
  box-shadow: 0 6px 12px rgba(0, 74, 152, 0.2);
  padding: 0 1rem;
  border-radius: 4px;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease;
  background-image: none;
  color: #0076f8; }
  .swiper-button-next:hover,
  .swiper-button-prev:hover {
    background-color: #0076f8;
    box-shadow: 0 0px 4px rgba(0, 74, 152, 0.2); }
  .swiper-button-next::after,
  .swiper-button-prev::after {
    font-family: 'animax' !important;
    font-size: 2rem;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    margin-top: -1.5rem;
    text-align: center;
    color: #ffffff; }
  .swiper-button-next.swiper-button-disabled,
  .swiper-button-prev.swiper-button-disabled {
    display: none; }

.swiper-button-next::after {
  content: "\e900"; }
@media (max-width: 767px) {
  .swiper-button-next {
    right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0; } }
@media (min-width: 768px) {
  .swiper-button-next {
    right: calc(5.4% - 57px); } }
@media (min-width: 897px) and (max-width: 1440px) {
  .swiper-button-next {
    right: calc(7.4% - 57px); } }

.swiper-button-prev::after {
  content: "\e901"; }
@media (max-width: 767px) {
  .swiper-button-prev {
    left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0; } }
@media (min-width: 768px) {
  .swiper-button-prev {
    left: calc(5.4% - 57px); } }
@media (min-width: 897px) and (max-width: 1440px) {
  .swiper-button-prev {
    left: calc(7.4% - 57px); } }

.swiper-container-initialized:hover [class*='swiper-button-'] {
  opacity: 1;
  pointer-events: auto; }

/* カルーセル */
.h3-title {
  margin-bottom: 2rem; }
  @media (min-width: 768px) {
    .h3-title {
      margin-bottom: 3.2rem; } }
  .h3-title.tab-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  .h3-title h3 {
    font-weight: normal;
    font-size: 1.8rem; }
    @media (min-width: 897px) {
      .h3-title h3 {
        font-size: 2rem; } }
    @media (min-width: 1024px) {
      .h3-title h3 {
        font-size: 2.6rem; } }
    .h3-title h3 > i {
      margin-right: .5rem; }
  .h3-title h3 + .tab-wrapper {
    margin-left: auto; }
    @media (min-width: 897px) {
      .h3-title h3 + .tab-wrapper {
        margin-left: 3rem; } }

.tab-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  white-space: nowrap;
  overflow-x: auto;
  padding-bottom: 1.2rem; }
  .tab-wrapper .tab-link {
    color: #8c9395;
    position: relative;
    cursor: pointer;
    transition: opacity 0.3s ease; }
    .tab-wrapper .tab-link:hover {
      opacity: .6; }
    .tab-wrapper .tab-link + .tab-link {
      margin-left: 1rem; }
    .tab-wrapper .tab-link > span {
      display: block;
      padding: 0 1rem .5rem; }
      .tab-wrapper .tab-link > span > i {
        margin-right: .5rem; }
    .tab-wrapper .tab-link::before {
      content: "";
      height: 1px;
      width: 100%;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      background: #8c9395; }
    .tab-wrapper .tab-link.active {
      color: #0076f8;
      box-shadow: 0 8px 9px -5px rgba(195, 229, 235, 0.6); }
      .tab-wrapper .tab-link.active::before {
        background: -webkit-gradient(linear, left top, right bottom, from(#00d2f8), to(#0076f8));
        background: -moz-linear-gradient(to left, #00d2f8, #0076f8);
        background: linear-gradient(to left, #00d2f8, #0076f8); }
      .tab-wrapper .tab-link.active > span {
        position: relative; }
        .tab-wrapper .tab-link.active > span::before, .tab-wrapper .tab-link.active > span::after {
          content: "";
          position: absolute;
          right: 0;
          left: 0;
          width: 0px;
          height: 0px;
          margin: auto;
          border-style: solid;
          border-width: 4px 3px 0 3px; }
        .tab-wrapper .tab-link.active > span::after {
          bottom: -2px;
          border-color: #fff transparent transparent transparent; }
        .tab-wrapper .tab-link.active > span::before {
          bottom: -3px;
          border-color: #0076f8 transparent transparent transparent; }

.movieGrid-row,
.info-row,
.actor-row,
.grid-row,
.feature-row,
.broadcast-row,
.carousel-row {
  padding-top: 3.4rem;
  padding-bottom: 3.4rem; }
  @media (min-width: 897px) {
    .movieGrid-row,
    .info-row,
    .actor-row,
    .grid-row,
    .feature-row,
    .broadcast-row,
    .carousel-row {
      padding-top: 4.5rem;
      padding-bottom: 4.5rem; } }
  @media (min-width: 1024px) {
    .movieGrid-row,
    .info-row,
    .actor-row,
    .grid-row,
    .feature-row,
    .broadcast-row,
    .carousel-row {
      padding-top: 8rem;
      padding-bottom: 8rem; } }
  @media (max-width: 767px) {
    .movieGrid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .info-row > *:not(.btn):not(.no-card):not(.blurBg),
    .actor-row > *:not(.btn):not(.no-card):not(.blurBg),
    .grid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .feature-row > *:not(.btn):not(.no-card):not(.blurBg),
    .broadcast-row > *:not(.btn):not(.no-card):not(.blurBg),
    .carousel-row > *:not(.btn):not(.no-card):not(.blurBg) {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (min-width: 768px) {
    .movieGrid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .info-row > *:not(.btn):not(.no-card):not(.blurBg),
    .actor-row > *:not(.btn):not(.no-card):not(.blurBg),
    .grid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .feature-row > *:not(.btn):not(.no-card):not(.blurBg),
    .broadcast-row > *:not(.btn):not(.no-card):not(.blurBg),
    .carousel-row > *:not(.btn):not(.no-card):not(.blurBg) {
      padding-right: 5.4%;
      padding-left: 5.4%; } }
  @media (min-width: 897px) and (max-width: 1440px) {
    .movieGrid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .info-row > *:not(.btn):not(.no-card):not(.blurBg),
    .actor-row > *:not(.btn):not(.no-card):not(.blurBg),
    .grid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .feature-row > *:not(.btn):not(.no-card):not(.blurBg),
    .broadcast-row > *:not(.btn):not(.no-card):not(.blurBg),
    .carousel-row > *:not(.btn):not(.no-card):not(.blurBg) {
      padding-right: 7.4%;
      padding-left: 7.4%; } }
  @media (min-width: 1441px) {
    .movieGrid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .info-row > *:not(.btn):not(.no-card):not(.blurBg),
    .actor-row > *:not(.btn):not(.no-card):not(.blurBg),
    .grid-row > *:not(.btn):not(.no-card):not(.blurBg),
    .feature-row > *:not(.btn):not(.no-card):not(.blurBg),
    .broadcast-row > *:not(.btn):not(.no-card):not(.blurBg),
    .carousel-row > *:not(.btn):not(.no-card):not(.blurBg) {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; } }
  .movieGrid-row .h3-title,
  .info-row .h3-title,
  .actor-row .h3-title,
  .grid-row .h3-title,
  .feature-row .h3-title,
  .broadcast-row .h3-title,
  .carousel-row .h3-title {
    margin-bottom: 2rem; }
    @media (min-width: 768px) {
      .movieGrid-row .h3-title,
      .info-row .h3-title,
      .actor-row .h3-title,
      .grid-row .h3-title,
      .feature-row .h3-title,
      .broadcast-row .h3-title,
      .carousel-row .h3-title {
        margin-bottom: 1.2rem; } }
  .movieGrid-row .btn-wrapper,
  .info-row .btn-wrapper,
  .actor-row .btn-wrapper,
  .grid-row .btn-wrapper,
  .feature-row .btn-wrapper,
  .broadcast-row .btn-wrapper,
  .carousel-row .btn-wrapper {
    margin-top: 2rem; }
    @media (min-width: 768px) {
      .movieGrid-row .btn-wrapper,
      .info-row .btn-wrapper,
      .actor-row .btn-wrapper,
      .grid-row .btn-wrapper,
      .feature-row .btn-wrapper,
      .broadcast-row .btn-wrapper,
      .carousel-row .btn-wrapper {
        margin-top: 3.2rem; } }
  .movieGrid-row + *,
  .info-row + *,
  .actor-row + *,
  .grid-row + *,
  .feature-row + *,
  .broadcast-row + *,
  .carousel-row + * {
    border-top: 1px #d4d7d9 solid; }

@media (max-width: 767px) {
  .broadcast-row > *:not(.btn):not(.no-card) {
    padding-right: 1.4rem;
    padding-left: 1.4rem; } }
@media (min-width: 768px) {
  .broadcast-row > *:not(.btn):not(.no-card) {
    padding-right: 5.4%;
    padding-left: 5.4%; } }
@media (min-width: 897px) and (max-width: 1440px) {
  .broadcast-row > *:not(.btn):not(.no-card) {
    padding-right: 7.4%;
    padding-left: 7.4%; } }
@media (min-width: 1441px) {
  .broadcast-row > *:not(.btn):not(.no-card) {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto; } }

script + * {
  border-top: 1px #d4d7d9 solid; }

.carousel-row + script + * {
  border-top: none; }

.actor-row,
.carousel-row,
.grid-row {
  background: -webkit-gradient(linear, right bottom, right top, from(rgba(0, 45, 93, 0.05)), to(rgba(0, 45, 93, 0)));
  background: -moz-linear-gradient(to top, rgba(0, 45, 93, 0.05), rgba(0, 45, 93, 0));
  background: linear-gradient(to top, rgba(0, 45, 93, 0.05), rgba(0, 45, 93, 0));
  background-size: 100% 30%;
  background-repeat: no-repeat;
  background-position: bottom; }
  .actor-row + *,
  .carousel-row + *,
  .grid-row + * {
    border-top: none; }

.broadcast-row {
  position: relative;
  overflow: hidden; }
  .broadcast-row::before, .broadcast-row::after {
    content: "";
    background-color: #ffffff;
    position: absolute;
    width: 120%;
    margin: 0 -10% 0;
    left: 0; }
    @media (max-width: 896px) {
      .broadcast-row::before, .broadcast-row::after {
        -webkit-transform: rotate(-8deg);
        -ms-transform: rotate(-8deg);
        transform: rotate(-8deg); } }
  .broadcast-row::before {
    height: 26%;
    top: 0;
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
    z-index: 2; }
    @media (min-width: 897px) {
      .broadcast-row::before {
        height: 4.5rem; } }
    @media (min-width: 1024px) {
      .broadcast-row::before {
        height: 8rem; } }
    @media (min-width: 1441px) {
      .broadcast-row::before {
        height: 20rem; } }
  .broadcast-row::after {
    height: 29%;
    bottom: 0;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    z-index: 1; }
    @media (min-width: 768px) {
      .broadcast-row::after {
        height: 24%; } }
    @media (min-width: 897px) {
      .broadcast-row::after {
        height: 4.5rem; } }
    @media (min-width: 1024px) {
      .broadcast-row::after {
        height: 8rem; } }
  .broadcast-row .blurBg {
    padding: 0;
    max-width: initial; }
  .broadcast-row .h3-title {
    text-shadow: 1px 1px 0 #fff;
    margin-bottom: 3rem;
    max-width: initial; }
    @media (min-width: 897px) {
      .broadcast-row .h3-title {
        padding-bottom: 5.2rem;
        margin-bottom: 0;
        background-color: #fff; } }
    @media (min-width: 1024px) {
      .broadcast-row .h3-title {
        padding-bottom: 10.2rem; } }
    .broadcast-row .h3-title h3 {
      margin-left: auto;
      margin-right: auto;
      max-width: 1200px; }
  .broadcast-row > *:not(.blurBg) {
    z-index: 2;
    position: relative; }
  @media (min-width: 897px) {
    .broadcast-row .broadcast-wrapper {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-top: -2rem; } }
  @media (min-width: 897px) and (max-width: 1440px) {
    .broadcast-row .broadcast-wrapper {
      padding-right: 0; } }
  @media (min-width: 1024px) {
    .broadcast-row .broadcast-wrapper {
      margin-top: -7rem; } }
  .broadcast-row .broadcast-wrapper .broadcast {
    position: relative;
    padding: 0;
    border-radius: 4px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    background-color: #d4d7d9;
    overflow: hidden;
    cursor: pointer; }
    @media (min-width: 897px) {
      .broadcast-row .broadcast-wrapper .broadcast {
        width: 64%;
        flex-shrink: 0;
        order: 1;
        border-radius: 0;
        border-top-left-radius: 4px;
        box-shadow: none; } }
    @media (min-width: 1441px) {
      .broadcast-row .broadcast-wrapper .broadcast {
        border-top-right-radius: 4px; } }
    .broadcast-row .broadcast-wrapper .broadcast .broadcast-thumbnail {
      padding-top: 56.25%;
      height: 0;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      transition: transform 0.3s ease;
      position: relative; }
    .broadcast-row .broadcast-wrapper .broadcast > img {
      position: absolute;
      bottom: .5rem;
      left: .5rem;
      width: 20%;
      height: auto; }
      @media (min-width: 897px) {
        .broadcast-row .broadcast-wrapper .broadcast > img {
          bottom: 1rem;
          left: 1rem;
          width: 14%; } }
    .broadcast-row .broadcast-wrapper .broadcast + .title {
      margin-top: 2rem; }
    .broadcast-row .broadcast-wrapper .broadcast:hover .broadcast-thumbnail {
      -webkit-transform: scale(1.03);
      -moz-transform: scale(1.03);
      -ms-transform: scale(1.03);
      -o-transform: scale(1.03);
      transform: scale(1.03); }
    .broadcast-row .broadcast-wrapper .broadcast .yt-box {
      padding-top: 56.25%;
      position: relative; }
      .broadcast-row .broadcast-wrapper .broadcast .yt-box iframe {
        position: absolute;
        top: 0;
        left: 0; }
  .broadcast-row .broadcast-wrapper .text-wrapper {
    z-index: 1;
    height: 100%;
    width: 100%; }
    @media (max-width: 896px) {
      .broadcast-row .broadcast-wrapper .text-wrapper {
        margin-top: 2rem;
        text-align: center; } }
    .broadcast-row .broadcast-wrapper .text-wrapper .btn {
      margin-top: 3rem; }
      @media (max-width: 896px) {
        .broadcast-row .broadcast-wrapper .text-wrapper .btn {
          margin-top: 4.2rem; } }
    .broadcast-row .broadcast-wrapper .text-wrapper .title {
      font-size: 1.8rem;
      color: #ffffff;
      text-shadow: 1px 1px 2px rgba(5, 45, 90, 0.5);
      font-weight: bold; }
      @media (min-width: 897px) {
        .broadcast-row .broadcast-wrapper .text-wrapper .title {
          font-size: 2rem; } }
      @media (min-width: 1024px) {
        .broadcast-row .broadcast-wrapper .text-wrapper .title {
          font-size: 2.6rem; } }
      @media (min-width: 897px) {
        .broadcast-row .broadcast-wrapper .text-wrapper .title {
          margin-right: 2rem; } }
      @media (min-width: 1024px) {
        .broadcast-row .broadcast-wrapper .text-wrapper .title {
          font-size: 2.4rem; } }
  .broadcast-row .btn-wrapper {
    margin-top: 2rem; }
    @media (min-width: 768px) {
      .broadcast-row .btn-wrapper {
        margin-top: 3.2rem; } }
    @media (min-width: 897px) {
      .broadcast-row .btn-wrapper {
        margin-top: 0;
        padding-top: 3.2rem;
        background: #ffffff; } }
    @media (min-width: 1441px) {
      .broadcast-row .btn-wrapper {
        max-width: none; } }

.carousel-row {
  overflow: hidden; }
  .carousel-row .swiper-container-large,
  .carousel-row .swiper-container {
    padding-bottom: 1rem;
    padding-top: 1rem; }
    @media (min-width: 768px) {
      .carousel-row .swiper-container-large,
      .carousel-row .swiper-container {
        padding-bottom: 2rem;
        padding-top: 2rem; } }

/* 特集 */
.feature-row {
  position: relative;
  overflow: hidden; }
  @media (max-width: 896px) {
    .feature-row {
      padding-bottom: 0; } }
  @media (min-width: 897px) {
    .feature-row .btn {
      min-width: 30rem; } }
  .feature-row .btn > span {
    display: block; }
    .feature-row .btn > span.price {
      margin-top: .5rem; }
      .feature-row .btn > span.price.btn-line .bg-red {
        background: #f2106f;
        color: #fff; }
  .feature-row .blurBg {
    z-index: -2;
    padding: 0;
    max-width: initial; }
  @media (max-width: 896px) {
    .feature-row > div {
      padding: 0 !important; } }
  .feature-row .feature {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media (max-width: 896px) {
      .feature-row .feature {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
    .feature-row .feature-title {
      flex-shrink: 0;
      order: 2;
      box-sizing: border-box;
      width: 100%; }
      @media (max-width: 896px) {
        .feature-row .feature-title {
          background-color: #fff;
          padding-bottom: 3.4rem;
          padding-top: 4.8rem;
          margin-top: -2.4rem; } }
      @media (min-width: 897px) {
        .feature-row .feature-title {
          width: 41%;
          order: 0; } }
      .feature-row .feature-title .free-tag {
        margin-bottom: 2rem; }
        @media (max-width: 896px) {
          .feature-row .feature-title .free-tag {
            display: none; } }
      .feature-row .feature-title h3 {
        font-size: 1.8rem;
        font-weight: normal;
        position: relative;
        display: none; }
        @media (min-width: 897px) {
          .feature-row .feature-title h3 {
            font-size: 2rem; } }
        @media (min-width: 1024px) {
          .feature-row .feature-title h3 {
            font-size: 2.6rem; } }
        @media (min-width: 897px) {
          .feature-row .feature-title h3 {
            display: block; } }
        @media (min-width: 897px) {
          .feature-row .feature-title h3 + p {
            margin-top: 2rem; } }
      .feature-row .feature-title .free-text-tag,
      .feature-row .feature-title .tvod-tag {
        font-size: 1.2rem;
        margin-bottom: 1.5rem; }
        @media (min-width: 897px) {
          .feature-row .feature-title .free-text-tag,
          .feature-row .feature-title .tvod-tag {
            font-size: 1.4rem;
            margin-top: 1.5rem; } }
        .feature-row .feature-title .free-text-tag > i,
        .feature-row .feature-title .tvod-tag > i {
          width: 2rem;
          height: 2rem;
          margin-right: .5rem; }
          @media (min-width: 897px) {
            .feature-row .feature-title .free-text-tag > i,
            .feature-row .feature-title .tvod-tag > i {
              width: 2.2rem;
              height: 2.2rem; } }
      .feature-row .feature-title .info-data-list {
        margin-top: 1rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        text-align: left;
        font-size: 1.2rem; }
        .feature-row .feature-title .info-data-list dt, .feature-row .feature-title .info-data-list dd {
          box-sizing: border-box; }
        .feature-row .feature-title .info-data-list dt {
          padding-right: 1rem;
          width: 30%;
          border-right: 1px #d4d7d9 solid;
          font-weight: bold; }
          .feature-row .feature-title .info-data-list dt:not(:nth-last-child(2)) {
            margin-bottom: .5rem; }
          @media (min-width: 481px) {
            .feature-row .feature-title .info-data-list dt {
              width: 20%; } }
          @media (min-width: 897px) {
            .feature-row .feature-title .info-data-list dt {
              width: 25%; } }
        .feature-row .feature-title .info-data-list dd {
          padding-left: 1rem;
          width: 70%; }
          @media (min-width: 481px) {
            .feature-row .feature-title .info-data-list dd {
              width: 80%; } }
          @media (min-width: 897px) {
            .feature-row .feature-title .info-data-list dd {
              width: 75%; } }
          .feature-row .feature-title .info-data-list dd:not(:last-child) {
            margin-bottom: .5rem; }
      .feature-row .feature-title .btn-wrapper {
        margin: 1.5rem -.5rem -.5rem -.5rem;
        text-align: center; }
        @media (min-width: 768px) {
          .feature-row .feature-title .btn-wrapper {
            margin-top: 3.2rem; } }
        .feature-row .feature-title .btn-wrapper .btn {
          margin: .5rem; }
    .feature-row .feature-thumbnail {
      box-sizing: border-box;
      flex-shrink: 0;
      display: block;
      box-shadow: 0 4px 20px rgba(0, 45, 93, 0.1);
      overflow: hidden;
      order: 1;
      background-color: #d4d7d9;
      width: calc(100% - 1.4rem);
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px; }
      @media (max-width: 767px) {
        .feature-row .feature-thumbnail {
          margin-right: auto; } }
      @media (min-width: 768px) and (max-width: 896px) {
        .feature-row .feature-thumbnail {
          margin-right: auto;
          width: calc(94.6%); } }
      @media (min-width: 897px) {
        .feature-row .feature-thumbnail {
          border-radius: 4px;
          width: 55%; } }
      .feature-row .feature-thumbnail .yt-box {
        padding-top: 56.25%;
        position: relative; }
        .feature-row .feature-thumbnail .yt-box > iframe {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0; }
      .feature-row .feature-thumbnail .tag {
        position: absolute;
        top: 0;
        left: 0;
        background-color: #0076f8;
        color: #fff;
        padding: 0.6rem .9rem;
        border-radius: 2rem;
        font-size: 1.4rem;
        line-height: 2rem;
        font-weight: bold;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border: 1px #fff solid;
        border-left: none; }
        @media (min-width: 897px) {
          .feature-row .feature-thumbnail .tag {
            font-size: 1.6rem;
            padding: 0.8rem 1rem; } }
        .feature-row .feature-thumbnail .tag.tvod-tag {
          background-color: #f2106f; }
          .feature-row .feature-thumbnail .tag.tvod-tag i {
            background: transparent;
            padding: 0;
            border-radius: initial;
            font-size: 1.8rem;
            height: auto;
            width: auto; }
            @media (min-width: 897px) {
              .feature-row .feature-thumbnail .tag.tvod-tag i {
                font-size: 2rem; } }
    .feature-row .feature-title-xs {
      box-sizing: border-box;
      order: 0;
      flex-shrink: 0;
      width: 100%;
      color: #ffffff;
      text-shadow: 1px 1px 2px rgba(5, 45, 90, 0.5);
      margin-bottom: 2rem; }
      @media (min-width: 897px) {
        .feature-row .feature-title-xs {
          display: none; } }
      .feature-row .feature-title-xs .free-tag {
        margin-bottom: 1rem;
        background: #fff;
        color: #0076f8;
        text-shadow: none;
        padding: .8rem 1.8rem; }
      .feature-row .feature-title-xs h3 {
        font-size: 1.8rem;
        font-weight: normal;
        position: relative; }
        @media (min-width: 897px) {
          .feature-row .feature-title-xs h3 {
            font-size: 2rem; } }
        @media (min-width: 1024px) {
          .feature-row .feature-title-xs h3 {
            font-size: 2.6rem; } }
  .feature-row .feature + .btn-wrapper {
    text-align: center;
    margin-top: 0;
    padding-top: 0; }
    @media (max-width: 767px) {
      .feature-row .feature + .btn-wrapper {
        padding-left: 1.4rem;
        padding-right: 1.4rem; } }
    @media (min-width: 768px) and (max-width: 896px) {
      .feature-row .feature + .btn-wrapper {
        padding-left: 5.4%;
        padding-right: 5.4%; } }
    @media (max-width: 896px) {
      .feature-row .feature + .btn-wrapper {
        padding-bottom: 3.4rem;
        background: #fff; } }
    @media (min-width: 897px) {
      .feature-row .feature + .btn-wrapper {
        padding-top: 3.2rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; } }
    .feature-row .feature + .btn-wrapper .btn-box {
      max-width: 44rem; }
      @media (max-width: 896px) {
        .feature-row .feature + .btn-wrapper .btn-box {
          margin: auto; } }
      @media (max-width: 896px) {
        .feature-row .feature + .btn-wrapper .btn-box + .btn-box {
          margin-top: 1.5rem; } }
      @media (min-width: 897px) {
        .feature-row .feature + .btn-wrapper .btn-box + .btn-box {
          margin-left: 2rem; } }
      .feature-row .feature + .btn-wrapper .btn-box .btn {
        width: 100%; }
        @media (min-width: 897px) {
          .feature-row .feature + .btn-wrapper .btn-box .btn {
            min-width: 27rem; } }
        .feature-row .feature + .btn-wrapper .btn-box .btn + div {
          margin-top: 1rem;
          text-shadow: 0 0 3px white; }
      .feature-row .feature + .btn-wrapper .btn-box > div {
        font-size: 1.2rem; }
  @media (max-width: 767px) {
    .feature-row:nth-of-type(odd) .feature > *:not(.feature-thumbnail) {
      padding-left: 1.4rem;
      padding-right: 1.4rem; } }
  @media (min-width: 768px) and (max-width: 896px) {
    .feature-row:nth-of-type(odd) .feature > *:not(.feature-thumbnail) {
      padding-left: 5.4%;
      padding-right: 5.4%; } }
  @media (max-width: 767px) {
    .feature-row:nth-of-type(even) .feature > *:not(.feature-thumbnail) {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (min-width: 768px) and (max-width: 896px) {
    .feature-row:nth-of-type(even) .feature > *:not(.feature-thumbnail) {
      padding-left: 5.4%;
      padding-right: 5.4%; } }
  @media (min-width: 897px) {
    .feature-row::after, .feature-row::before {
      content: "";
      position: absolute;
      z-index: -1;
      top: 0;
      height: 300%;
      width: 84%; }
    .feature-row:nth-of-type(even)::after {
      right: 0;
      background: #fff;
      -webkit-transform-origin: left center;
      -ms-transform-origin: left center;
      transform-origin: right center;
      transform: rotate(22deg); }
    .feature-row:nth-of-type(even) .feature .feature-title {
      order: 2;
      margin-left: 4%; }
    .feature-row:nth-of-type(odd)::before {
      left: 0;
      background: #fff;
      -webkit-transform-origin: left center;
      -ms-transform-origin: left center;
      transform-origin: left center;
      transform: rotate(-22deg); }
    .feature-row:nth-of-type(odd) .feature .feature-title {
      margin-right: 4%; } }

/* grid */
.grid-row {
  overflow: hidden; }
  .grid-row .h3-title {
    margin-bottom: 3rem; }
    @media (min-width: 897px) {
      .grid-row .h3-title {
        margin-bottom: 3.2rem; } }
  .grid-row .grid-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -0.45rem; }
    @media (min-width: 768px) {
      .grid-row .grid-container {
        margin: -1.5rem; } }
    @media (min-width: 1024px) {
      .grid-row .grid-container {
        margin: -1.8rem; } }
    .grid-row .grid-container .grid-item {
      width: 50%;
      padding: 0.45rem;
      box-sizing: border-box;
      position: relative; }
      @media (min-width: 768px) {
        .grid-row .grid-container .grid-item {
          width: 33.3333333333%;
          padding: 1.5rem; } }
      @media (min-width: 1024px) {
        .grid-row .grid-container .grid-item {
          width: 25%;
          padding: 1.8rem; } }
      .grid-row .grid-container .grid-item .select-card {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0.45rem;
        cursor: pointer;
        display: none;
        pointer-events: auto;
        border-radius: 4px; }
        @media (min-width: 768px) {
          .grid-row .grid-container .grid-item .select-card {
            margin: 1.5rem; } }
        @media (min-width: 1024px) {
          .grid-row .grid-container .grid-item .select-card {
            margin: 1.8rem; } }
    .grid-row .grid-container.select-mode .card {
      pointer-events: none; }
    .grid-row .grid-container.select-mode .select-card {
      display: block; }
      .grid-row .grid-container.select-mode .select-card.checked {
        background-color: rgba(255, 255, 255, 0.6);
        border: 2px #f02d2d solid; }
        .grid-row .grid-container.select-mode .select-card.checked::before {
          content: '\e90c';
          font-family: 'animax' !important;
          color: #f02d2d;
          position: absolute;
          top: 0;
          left: 0;
          bottom: 0;
          right: 0;
          width: 6rem;
          height: 6rem;
          margin: auto;
          font-size: 4rem;
          text-align: center; }
          @media (min-width: 481px) {
            .grid-row .grid-container.select-mode .select-card.checked::before {
              width: 7rem;
              height: 7rem;
              font-size: 5rem; } }

.actor-row {
  overflow: hidden; }
  .actor-row .h3-title {
    margin-bottom: 3rem; }
    @media (min-width: 897px) {
      .actor-row .h3-title {
        margin-bottom: 3.2rem; } }
  .actor-row .actor-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -0.45rem; }
    @media (min-width: 768px) {
      .actor-row .actor-container {
        margin: -0.8rem; } }
    @media (min-width: 1024px) {
      .actor-row .actor-container {
        margin: -0.8rem; } }
    .actor-row .actor-container .actor-card {
      width: 50%;
      padding: 0.45rem;
      box-sizing: border-box; }
      @media (min-width: 481px) {
        .actor-row .actor-container .actor-card {
          width: 33.3333333333%; } }
      @media (min-width: 768px) {
        .actor-row .actor-container .actor-card {
          padding: 0.9rem; } }
      @media (min-width: 897px) {
        .actor-row .actor-container .actor-card {
          width: 25%; } }
      @media (min-width: 1024px) {
        .actor-row .actor-container .actor-card {
          width: 16.6666666667%; } }
      .actor-row .actor-container .actor-card > a:hover {
        text-decoration: none !important; }
  .actor-row .btn-wrapper {
    margin-top: 4rem; }
    @media (min-width: 768px) {
      .actor-row .btn-wrapper {
        margin-top: 5.2rem; } }

.tvod-row {
  background: linear-gradient(0deg, #2caaff 0%, #1070ce 100%);
  padding-top: 3.4rem;
  padding-bottom: 3.4rem; }
  @media (min-width: 897px) {
    .tvod-row {
      padding-top: 4.5rem;
      padding-bottom: 4.5rem; } }
  @media (min-width: 1024px) {
    .tvod-row {
      padding-top: 8rem;
      padding-bottom: 8rem; } }
  .tvod-row > .h3-title {
    color: #fff;
    margin: 0;
    position: relative;
    box-sizing: border-box;
    text-align: center; }
    @media (max-width: 767px) {
      .tvod-row > .h3-title {
        padding-right: 1.4rem;
        padding-left: 1.4rem; } }
    @media (min-width: 768px) {
      .tvod-row > .h3-title {
        padding-right: 5.4%;
        padding-left: 5.4%; } }
    @media (min-width: 897px) and (max-width: 1440px) {
      .tvod-row > .h3-title {
        padding-right: 7.4%;
        padding-left: 7.4%; } }
    @media (min-width: 1441px) {
      .tvod-row > .h3-title {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto; } }
    .tvod-row > .h3-title > .tvod-icon {
      font-size: 2.5rem;
      background-color: #fff;
      color: #0076f8;
      width: 6rem;
      height: 6rem;
      border-radius: 50%;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin: 0 auto 2rem; }
    .tvod-row > .h3-title h3 {
      margin-bottom: 1.5rem; }
    .tvod-row > .h3-title > p > span {
      font-size: 1.2rem; }
  .tvod-row > .grid-container {
    box-sizing: border-box;
    background-color: #fff;
    margin-top: 1.7rem; }
    @media (max-width: 767px) {
      .tvod-row > .grid-container {
        margin-right: 1.4rem;
        margin-left: 1.4rem; } }
    @media (min-width: 768px) {
      .tvod-row > .grid-container {
        margin-right: 5.4%;
        margin-left: 5.4%; } }
    @media (min-width: 897px) and (max-width: 1440px) {
      .tvod-row > .grid-container {
        margin-right: 7.4%;
        margin-left: 7.4%; } }
    @media (min-width: 1441px) {
      .tvod-row > .grid-container {
        max-width: 1200px;
        margin-right: auto;
        margin-left: auto; } }
    @media (min-width: 897px) {
      .tvod-row > .grid-container {
        margin-top: 2.25rem; } }
    @media (min-width: 1024px) {
      .tvod-row > .grid-container {
        margin-top: 4rem; } }
    .tvod-row > .grid-container .grid-item {
      box-sizing: border-box; }
      @media (min-width: 768px) {
        .tvod-row > .grid-container .grid-item:not(:first-child) a.card .card-text {
          border-top: 1px #d4d7d9 solid; } }
      .tvod-row > .grid-container .grid-item a.card {
        box-shadow: none;
        border-radius: 0; }
        @media (min-width: 768px) {
          .tvod-row > .grid-container .grid-item a.card {
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -ms-flex-direction: row;
            flex-direction: row; } }
        .tvod-row > .grid-container .grid-item a.card:hover .card-text .tvod-wrapper .btn {
          box-shadow: 0 0 5px rgba(242, 16, 59, 0.27); }
        @media (min-width: 768px) {
          .tvod-row > .grid-container .grid-item a.card .thumbnail-wrapper {
            width: 50%; } }
        .tvod-row > .grid-container .grid-item a.card .card-text {
          padding: 2rem;
          box-sizing: border-box; }
          @media (min-width: 768px) {
            .tvod-row > .grid-container .grid-item a.card .card-text {
              width: 50%;
              display: -webkit-box;
              display: -webkit-flex;
              display: -moz-box;
              display: -ms-flexbox;
              display: flex;
              -webkit-box-pack: center;
              -webkit-justify-content: center;
              -moz-box-pack: center;
              -ms-flex-pack: center;
              justify-content: center;
              -webkit-box-orient: vertical;
              -webkit-box-direction: normal;
              -webkit-flex-direction: column;
              -moz-box-orient: vertical;
              -moz-box-direction: normal;
              -ms-flex-direction: column;
              flex-direction: column; } }
          .tvod-row > .grid-container .grid-item a.card .card-text .title {
            font-size: 1.6rem; }
            @media (min-width: 768px) {
              .tvod-row > .grid-container .grid-item a.card .card-text .title {
                white-space: nowrap;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
                overflow: hidden; } }
            @media (min-width: 897px) {
              .tvod-row > .grid-container .grid-item a.card .card-text .title {
                font-size: 1.6rem;
                white-space: initial;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
                overflow: hidden; } }
  @media all and (min-width: 897px) and (-ms-high-contrast: none) {
    .tvod-row > .grid-container .grid-item a.card .card-text .title {
      white-space: nowrap;
      -o-text-overflow: ellipsis;
      text-overflow: ellipsis;
      display: block; } }

            @media (min-width: 1024px) {
              .tvod-row > .grid-container .grid-item a.card .card-text .title {
                font-size: 1.8rem; } }
          .tvod-row > .grid-container .grid-item a.card .card-text .tvod-tag, .tvod-row > .grid-container .grid-item a.card .card-text .ticket-tag {
            margin-bottom: 1rem;
            font-size: 1.2rem; }
            @media (min-width: 897px) {
              .tvod-row > .grid-container .grid-item a.card .card-text .tvod-tag, .tvod-row > .grid-container .grid-item a.card .card-text .ticket-tag {
                font-size: 1.4rem; } }
            .tvod-row > .grid-container .grid-item a.card .card-text .tvod-tag > i, .tvod-row > .grid-container .grid-item a.card .card-text .ticket-tag > i {
              width: 2rem;
              height: 2rem;
              font-size: 1rem; }
              @media (min-width: 897px) {
                .tvod-row > .grid-container .grid-item a.card .card-text .tvod-tag > i, .tvod-row > .grid-container .grid-item a.card .card-text .ticket-tag > i {
                  font-size: 1.2rem;
                  width: 2.2rem;
                  height: 2.2rem; } }
          .tvod-row > .grid-container .grid-item a.card .card-text .tvod-wrapper > div {
            font-size: 1.4rem; }
            .tvod-row > .grid-container .grid-item a.card .card-text .tvod-wrapper > div > .price {
              font-size: 1.8rem; }
              @media (min-width: 897px) {
                .tvod-row > .grid-container .grid-item a.card .card-text .tvod-wrapper > div > .price {
                  font-size: 2rem; } }
          .tvod-row > .grid-container .grid-item a.card .card-text .tvod-wrapper .btn {
            padding: 1.5rem 3rem;
            font-size: 1.6rem;
            box-shadow: 0 8px 22px rgba(242, 16, 59, 0.27); }
            .tvod-row > .grid-container .grid-item a.card .card-text .tvod-wrapper .btn > i.icon-circle-yen {
              font-size: 2rem;
              vertical-align: -.3rem; }
          .tvod-row > .grid-container .grid-item a.card .card-text .tvod-wrapper * + .btn {
            margin-top: 2rem; }
        .tvod-row > .grid-container .grid-item a.card > *:not(.thumbnail-wrapper) {
          margin-left: 0;
          margin-right: 0; }
        .tvod-row > .grid-container .grid-item a.card > * {
          margin-bottom: 0; }
  .tvod-row .btn-wrapper {
    margin-top: 2rem; }
    @media (min-width: 768px) {
      .tvod-row .btn-wrapper {
        margin-top: 3.2rem; } }
  .tvod-row + * {
    border-top: 1px #fff solid; }

.movieGrid-row {
  background: #f3f4f7;
  border-top: 1px #e5e9ed solid; }
  .movieGrid-row .movieGrid-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    @media (min-width: 897px) {
      .movieGrid-row .movieGrid-box {
        margin: 3rem -1.5rem 0; } }
  .movieGrid-row .movie-card-item {
    padding: 1rem 0 2rem;
    width: 100%;
    box-sizing: border-box; }
    @media (min-width: 897px) {
      .movieGrid-row .movie-card-item {
        padding: 1.5rem;
        width: 50%; } }
    .movieGrid-row .movie-card-item .item {
      padding: 4.5rem 2.5rem 3rem;
      box-sizing: border-box;
      background: #FFF;
      position: relative;
      height: 100%; }
      @media (min-width: 768px) {
        .movieGrid-row .movie-card-item .item {
          padding: 5.5rem 4.5rem 4rem; } }
      @media (min-width: 897px) {
        .movieGrid-row .movie-card-item .item {
          padding: 5.5rem 3.5rem 4rem; } }
      @media (min-width: 1024px) {
        .movieGrid-row .movie-card-item .item {
          padding: 5.5rem 4.5rem 4rem; } }
    .movieGrid-row .movie-card-item .yt-box {
      padding-top: 56.25%;
      position: relative; }
      .movieGrid-row .movie-card-item .yt-box iframe {
        position: absolute;
        top: 0;
        left: 0; }
    .movieGrid-row .movie-card-item p {
      font-size: 1.4rem;
      font-weight: bold;
      margin-top: 2rem;
      position: relative; }
      @media (min-width: 768px) {
        .movieGrid-row .movie-card-item p {
          font-size: 1.6rem; } }
      @media (min-width: 897px) {
        .movieGrid-row .movie-card-item p {
          margin-top: 3rem;
          font-size: 1.4rem; } }
      @media (min-width: 1024px) {
        .movieGrid-row .movie-card-item p {
          font-size: 1.6rem; } }
    .movieGrid-row .movie-card-item .free-tag {
      position: absolute;
      top: -1rem;
      color: #fff; }
  .movieGrid-row .movie-card {
    display: block; }
    .movieGrid-row .movie-card .thumbnail-wrapper {
      position: relative;
      overflow: hidden;
      border-radius: 6px;
      box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1); }
      .movieGrid-row .movie-card .thumbnail-wrapper .thumbnail {
        transition: transform 0.3s ease; }
      .movieGrid-row .movie-card .thumbnail-wrapper .play {
        width: 20%;
        position: absolute;
        bottom: .5rem;
        left: .5rem; }
    .movieGrid-row .movie-card p {
      margin-top: 1rem;
      font-size: 1.4rem;
      font-weight: bold; }
    .movieGrid-row .movie-card:focus, .movieGrid-row .movie-card:hover {
      text-decoration: none !important; }
      .movieGrid-row .movie-card:focus .thumbnail-wrapper .thumbnail, .movieGrid-row .movie-card:hover .thumbnail-wrapper .thumbnail {
        -webkit-transform: scale(1.03);
        -moz-transform: scale(1.03);
        -ms-transform: scale(1.03);
        -o-transform: scale(1.03);
        transform: scale(1.03); }

.ticket-content {
  padding-top: 2rem; }

.rental-row {
  padding-top: 3.4rem;
  padding-bottom: 3.4rem; }
  @media (min-width: 897px) {
    .rental-row {
      padding-top: 4.5rem;
      padding-bottom: 4.5rem; } }
  @media (min-width: 1024px) {
    .rental-row {
      padding-top: 8rem;
      padding-bottom: 8rem; } }
  .rental-row .content-alignment + .carousel-row {
    padding-top: 2rem; }

#rental_area,
#premium_area {
  padding: 0; }
  #rental_area .carousel-row,
  #premium_area .carousel-row {
    padding: 2.4rem 0; }
    @media (min-width: 897px) {
      #rental_area .carousel-row,
      #premium_area .carousel-row {
        padding: 4rem 0; } }
    #rental_area .carousel-row:first-child,
    #premium_area .carousel-row:first-child {
      padding-top: 0; }
    #rental_area .carousel-row .h3-title,
    #premium_area .carousel-row .h3-title {
      margin-bottom: 0; }
      #rental_area .carousel-row .h3-title:first-child,
      #premium_area .carousel-row .h3-title:first-child {
        padding-top: 0; }

.premium-banner {
  box-sizing: border-box;
  padding-top: 3.4rem;
  padding-bottom: 3.4rem; }
  @media (max-width: 767px) {
    .premium-banner {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (min-width: 768px) {
    .premium-banner {
      padding-right: 5.4%;
      padding-left: 5.4%; } }
  @media (min-width: 897px) and (max-width: 1440px) {
    .premium-banner {
      padding-right: 7.4%;
      padding-left: 7.4%; } }
  @media (min-width: 1441px) {
    .premium-banner {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; } }
  @media (min-width: 897px) {
    .premium-banner {
      padding-top: 4.5rem;
      padding-bottom: 4.5rem; } }
  @media (min-width: 1024px) {
    .premium-banner {
      padding-top: 8rem;
      padding-bottom: 8rem; } }
  .premium-banner > a {
    display: block; }
    .premium-banner > a > img {
      display: block;
      width: 100%; }
      @media (min-width: 897px) {
        .premium-banner > a > img.mb-banner {
          display: none; } }
      @media (max-width: 896px) {
        .premium-banner > a > img.pc-banner {
          display: none; } }

.card {
  position: relative;
  background-color: #fff;
  border-radius: 4px;
  overflow: hidden;
  transition: box-shadow 0.3s ease;
  width: 100%;
  height: 100%;
  box-shadow: 0 2px 6px -1px rgba(0, 74, 152, 0.16);
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  pointer-events: auto; }
  @media (min-width: 768px) {
    .card {
      box-shadow: 0 7px 22px -3px rgba(0, 74, 152, 0.16); } }
  @media (min-width: 768px) {
    .card:focus, .card:hover {
      box-shadow: 0 0 6px -3px rgba(0, 74, 152, 0.16); }
      .card:focus .card-btn .play-text, .card:hover .card-btn .play-text {
        background-color: #0076f8;
        color: #fff;
        border-color: #0076f8; }
    .card.tvod-card:focus .card-btn .play-text, .card.tvod-card:hover .card-btn .play-text {
      background-color: #f2106f;
      color: #fff;
      border-color: #f2106f; } }
  .card:focus .thumbnail-wrapper .thumbnail, .card:hover .thumbnail-wrapper .thumbnail {
    transform: scale(1.05); }
  .card > * {
    margin-bottom: 1rem; }
    @media (min-width: 768px) {
      .card > * {
        margin-bottom: 1.5rem; } }
    @media (min-width: 1024px) {
      .card > * {
        margin-bottom: 2rem; } }
    .card > *:not(.thumbnail-wrapper) {
      margin-left: 1rem;
      margin-right: 1rem; }
      @media (min-width: 768px) {
        .card > *:not(.thumbnail-wrapper) {
          margin-left: 1.5rem;
          margin-right: 1.5rem; } }
      @media (min-width: 1024px) {
        .card > *:not(.thumbnail-wrapper) {
          margin-left: 2rem;
          margin-right: 2rem; } }
  .card .thumbnail-wrapper {
    background-color: #d4d7d9;
    pointer-events: none;
    overflow: hidden;
    position: relative; }
    .card .thumbnail-wrapper .thumbnail {
      transition: transform 0.3s ease; }
    .card .thumbnail-wrapper .tag {
      position: absolute;
      top: 0;
      left: 0;
      background-color: #0076f8;
      color: #fff;
      padding: .4rem .7rem;
      border-radius: 2rem;
      font-size: 1rem;
      line-height: 1.4;
      font-weight: bold;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border: 1px #fff solid;
      border-left: none; }
      @media (min-width: 897px) {
        .card .thumbnail-wrapper .tag {
          font-size: 1.2rem; } }
      .card .thumbnail-wrapper .tag.tvod-tag {
        background-color: #f2106f; }
        .card .thumbnail-wrapper .tag.tvod-tag i {
          background: transparent;
          padding: 0;
          border-radius: initial;
          font-size: 1.4rem;
          height: auto;
          width: auto; }
  .card .card-text {
    pointer-events: none; }
    .card .card-text .title {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden;
      font-weight: bold; }
      @media all and (-ms-high-contrast: none) {
        .card .card-text .title {
          white-space: nowrap;
          -o-text-overflow: ellipsis;
          text-overflow: ellipsis;
          display: block; } }
    .card .card-text .ticket-tag, .card .card-text .tvod-tag, .card .card-text .free-text-tag {
      margin-top: 1rem; }
    .card .card-text .gray-text {
      color: #8c9395;
      font-size: 1rem; }
      @media (min-width: 897px) {
        .card .card-text .gray-text {
          font-size: 1.2rem; } }
      .card .card-text .gray-text .small-text {
        font-size: 1rem; }
    .card .card-text .title + .tvod-wrapper {
      margin-top: .5rem; }
      @media (min-width: 897px) {
        .card .card-text .title + .tvod-wrapper {
          margin-top: 1rem; } }
  .card .tvod-wrapper {
    color: #8c9395;
    font-size: 1rem;
    margin-bottom: 1rem; }
    @media (min-width: 897px) {
      .card .tvod-wrapper {
        font-size: 1.2rem; } }
    .card .tvod-wrapper .price {
      color: #f2106f;
      font-size: 1.4rem; }
      @media (min-width: 897px) {
        .card .tvod-wrapper .price {
          font-size: 1.6rem; } }
    .card .tvod-wrapper .small-text {
      font-size: 1rem; }
  .card .card-btn {
    margin-top: auto;
    pointer-events: none; }
    .card .card-btn .play-text {
      font-size: 1rem; }
      @media (max-width: 767px) {
        .card .card-btn .play-text {
          padding: 1rem 1.5rem; } }
      @media (min-width: 768px) {
        .card .card-btn .play-text {
          font-size: 1.2rem; } }
      .card .card-btn .play-text > i {
        margin-right: .5rem; }
        .card .card-btn .play-text > i.icon-circle-yen {
          font-size: 1.6rem;
          vertical-align: -.3rem;
          margin-right: .8rem; }
          @media (min-width: 768px) {
            .card .card-btn .play-text > i.icon-circle-yen {
              font-size: 1.7rem; } }
        .card .card-btn .play-text > i.icon-ticket {
          font-size: 1.6rem;
          vertical-align: -.3rem; }
  .card.more-card {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    background-color: #d4d7d9; }
    .card.more-card .play-text {
      font-size: 1rem;
      margin: 0;
      color: #8c9395;
      transition: opacity 0.3s ease; }
      @media (min-width: 768px) {
        .card.more-card .play-text {
          font-size: 1.2rem; } }
      .card.more-card .play-text .icon-arrow-right {
        font-size: 4rem;
        text-align: center; }
        @media (min-width: 768px) {
          .card.more-card .play-text .icon-arrow-right {
            font-size: 5.5rem; } }
    .card.more-card:hover {
      background-color: #8c9395; }
      .card.more-card:hover .play-text {
        color: #fff; }

.actor-card {
  display: block;
  position: relative;
  border-radius: 4px;
  overflow: hidden; }
  .actor-card:nth-of-type(even) .actor-name {
    background-color: #f5f8fb;
    border-color: #eff2f5; }
  .actor-card > a {
    display: block; }
  .actor-card .actor-name {
    font-weight: bold;
    padding: 2rem 1rem;
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 1px #f4f4f7 solid;
    font-size: 1.2rem;
    box-shadow: 0 2px 8px -2px rgba(0, 45, 93, 0.1);
    box-sizing: border-box;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    @media (min-width: 897px) {
      .actor-card .actor-name {
        font-size: 1.4rem; } }
    .actor-card .actor-name > span {
      position: relative;
      padding-bottom: .7rem;
      display: inline-block; }
      .actor-card .actor-name > span::before {
        content: "";
        width: 30px;
        background: #dddde8;
        height: 1px;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        transition: all 0.3s ease; }
    .actor-card .actor-name:hover {
      background-color: #0076f8;
      color: #fff;
      box-shadow: 0 0 0 rgba(0, 45, 93, 0.1); }
      .actor-card .actor-name:hover span::before {
        background-color: #fff;
        width: 100%; }

.hover-play-text {
  position: relative; }
  .hover-play-text .play-text {
    display: none; }
  @media (min-width: 768px) {
    .hover-play-text::after {
      content: "";
      background: -webkit-gradient(linear, left top, right bottom, from(#00d2f8), to(#0076f8));
      background: -moz-linear-gradient(to left, #00d2f8, #0076f8);
      background: linear-gradient(to left, #00d2f8, #0076f8);
      position: absolute;
      width: 100%;
      height: 0;
      bottom: 0;
      left: 0;
      opacity: .8;
      transition: height 0.3s ease; }
    .hover-play-text .play-text {
      box-sizing: border-box;
      border: 1px #fff solid;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      height: 12%;
      width: 60%;
      min-height: 4rem;
      min-width: 10rem;
      max-width: 20rem;
      margin: auto;
      color: #fff;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      z-index: 1;
      opacity: 0;
      transition: opacity 0.5s ease;
      font-size: 1.2rem; } }
  @media (min-width: 768px) and (min-width: 897px) {
    .hover-play-text .play-text {
      min-height: 5rem; } }
  @media (min-width: 768px) {
    .hover-play-text:focus::after, .hover-play-text:hover::after {
      height: 100%; }
    .hover-play-text:focus .play-text, .hover-play-text:hover .play-text {
      opacity: 1; } }

* + .live-countdown {
  margin-top: 1.5rem; }

.live-countdown {
  text-align: center;
  color: #0076f8; }
  .live-countdown .countdown {
    font-size: 2.2rem; }
    .live-countdown .countdown > span {
      font-size: 4rem; }
  .live-countdown .delivery-date {
    font-size: 1.2rem;
    padding-top: 1rem;
    position: relative; }
    .live-countdown .delivery-date::before {
      content: "";
      background: -webkit-gradient(linear, left top, right bottom, from(#00d2f8), to(#0076f8));
      background: -moz-linear-gradient(to left, #00d2f8, #0076f8);
      background: linear-gradient(to left, #00d2f8, #0076f8);
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 1px; }

.product-item {
  position: relative;
  border: 1px #d4d7d9 solid;
  border-radius: 1.2rem;
  padding: .8rem;
  box-sizing: border-box; }
  .product-item + .product-item {
    margin-top: 1.2rem; }
    @media (min-width: 897px) {
      .product-item + .product-item {
        margin-top: 2rem; } }
  .product-item__background {
    position: absolute;
    top: .8rem;
    left: .8rem;
    bottom: .8rem;
    right: .8rem;
    overflow: hidden;
    border-radius: 1.4rem;
    z-index: -1; }
    .product-item__background > div {
      position: absolute;
      top: 0;
      bottom: 0;
      right: 0;
      left: 0;
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      -webkit-filter: blur(12px);
      -moz-filter: blur(12px);
      -o-filter: blur(12px);
      -ms-filter: blur(12px);
      filter: blur(12px); }
  .product-item__box {
    background: #ffffff;
    margin: .4rem;
    padding: 1rem;
    box-sizing: border-box;
    border-radius: 1rem; }
    @media (min-width: 897px) {
      .product-item__box {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex; } }
    .product-item__box__thumb {
      overflow: hidden; }
      @media (max-width: 896px) {
        .product-item__box__thumb {
          border-top-right-radius: .8rem;
          border-top-left-radius: .8rem; } }
      @media (min-width: 897px) {
        .product-item__box__thumb {
          border-bottom-left-radius: .8rem;
          border-top-left-radius: .8rem;
          flex-shrink: 0;
          width: 35%; } }
    .product-item__box__meta {
      padding: 1rem 0 1.5rem;
      box-sizing: border-box; }
      @media (min-width: 897px) {
        .product-item__box__meta {
          padding: 1rem 2rem;
          width: 45%; } }
      .product-item__box__meta-title {
        font-size: 1.6rem;
        font-weight: bold; }
        @media (min-width: 897px) {
          .product-item__box__meta-title {
            font-size: 2rem; } }
      .product-item__box__meta-description {
        margin-top: .5rem;
        font-size: 1.2rem; }
        @media (min-width: 897px) {
          .product-item__box__meta-description {
            margin-top: 1.2rem; } }
        .product-item__box__meta-description a {
          text-decoration: underline;
          color: #0076f8; }
    .product-item__box__price {
      padding: 1rem 0;
      box-sizing: border-box;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -webkit-flex-direction: column;
      -moz-box-orient: vertical;
      -moz-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      flex-shrink: 0; }
      @media (max-width: 896px) {
        .product-item__box__price {
          border-top: 2px #d4d7d9 dotted; } }
      @media (min-width: 897px) {
        .product-item__box__price {
          padding: 1rem 2rem;
          border-left: 2px #d4d7d9 dotted;
          width: 20%;
          min-width: 22rem; } }
      .product-item__box__price-price {
        font-weight: bold;
        border-bottom: 1px #d4d7d9 solid;
        width: 100%;
        text-align: center; }
        .product-item__box__price-price > span {
          font-size: 3rem;
          font-weight: normal;
          margin-right: .5rem; }
      .product-item__box__price-period {
        padding-top: 1rem;
        color: #8c9395;
        font-size: 1.2rem; }
        .product-item__box__price-period > span {
          display: block; }
      .product-item__box__price .btn {
        margin-top: 2rem;
        width: 100%;
        padding: 1.4rem 2rem; }
        .product-item__box__price .btn > i {
          vertical-align: -.1rem;
          font-size: 1.6rem; }

/* PAGE */
.news-wrapper {
  background-color: rgba(255, 255, 255, 0.2); }
  .news-wrapper > div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    .news-wrapper > div .label {
      background-color: #fff;
      color: #0076f8;
      padding: .5rem 1.2rem;
      box-sizing: border-box;
      font-size: 1.2rem;
      font-weight: bold; }
@keyframes ticker {
  0% {
    transform: translate(0, 0);
    visibility: visible; }
  100% {
    transform: translate(-100%, 0); } }
    .news-wrapper > div .marquee {
      overflow: hidden;
      position: relative;
      width: 100%;
      height: 2.8rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      .news-wrapper > div .marquee .marquee_item:after {
        content: "";
        white-space: nowrap;
        padding-right: 50px; }
      .news-wrapper > div .marquee .marquee_item {
        margin: 0;
        white-space: nowrap; }
        .news-wrapper > div .marquee .marquee_item > * {
          color: #ffffff; }
          .news-wrapper > div .marquee .marquee_item > *:not(:last-child) {
            margin-right: 10rem; }
          .news-wrapper > div .marquee .marquee_item > * > span {
            margin-right: 1rem; }

.mainVisual {
  margin-top: 2.4rem;
  margin-bottom: 2.4rem; }
  @media (min-width: 897px) {
    .mainVisual {
      margin-top: 4rem;
      margin-bottom: 4rem; } }
  @media screen and (max-width: 767px) and (orientation: landscape) {
    .mainVisual .swiper-wrapper .swiper-slide {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  @media (min-width: 897px) {
    .mainVisual .swiper-wrapper .swiper-slide {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  .mainVisual .swiper-wrapper .swiper-slide .meta {
    text-shadow: 1px 1px 0 rgba(5, 45, 90, 0.5); }
    @media (max-width: 896px) {
      .mainVisual .swiper-wrapper .swiper-slide .meta {
        margin-top: 1.5rem;
        text-align: center; } }
    @media screen and (max-width: 767px) and (orientation: landscape) {
      .mainVisual .swiper-wrapper .swiper-slide .meta {
        width: 40%;
        margin-right: 3.2rem; } }
    @media (min-width: 897px) {
      .mainVisual .swiper-wrapper .swiper-slide .meta {
        width: 40%;
        margin-right: 2rem; } }
    @media (min-width: 1024px) {
      .mainVisual .swiper-wrapper .swiper-slide .meta {
        margin-right: 3.2rem; } }
    .mainVisual .swiper-wrapper .swiper-slide .meta p {
      margin-top: 1rem; }
      @media (max-width: 896px) {
        .mainVisual .swiper-wrapper .swiper-slide .meta p {
          text-align: left; } }
    @media (max-width: 896px) {
      .mainVisual .swiper-wrapper .swiper-slide .meta h2 {
        text-align: left; } }
    .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list {
      margin-top: 1rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      text-align: left;
      font-size: 1.2rem; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dt, .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dd {
        box-sizing: border-box; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dt {
        padding-right: 1rem;
        width: 30%;
        border-right: 1px rgba(255, 255, 255, 0.3) solid;
        max-width: 10rem; }
        .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dt:not(:nth-last-child(2)) {
          margin-bottom: .5rem; }
        @media (min-width: 897px) {
          .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dt {
            width: 25%;
            max-width: 17rem; } }
      .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dd {
        padding-left: 1rem;
        width: 70%; }
        @media (min-width: 897px) {
          .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dd {
            width: 75%; } }
        .mainVisual .swiper-wrapper .swiper-slide .meta .info-data-list dd:not(:last-child) {
          margin-bottom: .5rem; }
    .mainVisual .swiper-wrapper .swiper-slide .meta .btn {
      margin-top: 2rem;
      padding: 1.5rem 4rem;
      background-color: #fff;
      text-shadow: none;
      color: #0076f8;
      min-width: 25rem;
      font-weight: bold;
      font-size: 1.6rem; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .btn.secondary {
        color: #f2106f; }
        .mainVisual .swiper-wrapper .swiper-slide .meta .btn.secondary:hover {
          background: #f2106f; }
          .mainVisual .swiper-wrapper .swiper-slide .meta .btn.secondary:hover .bg-red {
            background: #fff;
            color: #f2106f; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .btn i.icon-ticket,
      .mainVisual .swiper-wrapper .swiper-slide .meta .btn i.icon-circle-yen {
        font-size: 1.8rem;
        vertical-align: bottom; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .btn > span {
        display: block; }
        .mainVisual .swiper-wrapper .swiper-slide .meta .btn > span.price {
          margin-top: .5rem; }
          .mainVisual .swiper-wrapper .swiper-slide .meta .btn > span.price .list-price {
            font-size: 1.4rem;
            display: block;
            text-decoration: line-through;
            margin-top: 1rem;
            margin-bottom: .5rem;
            opacity: .7;
            font-weight: normal; }
          .mainVisual .swiper-wrapper .swiper-slide .meta .btn > span.price .bg-red {
            border: 1px #fff solid;
            background: #f2106f;
            color: #fff;
            font-size: 1.2rem;
            padding: .5rem 1rem;
            border-radius: 28px;
            margin-right: .5rem;
            vertical-align: .3rem;
            display: inline-block;
            font-weight: normal; }
          .mainVisual .swiper-wrapper .swiper-slide .meta .btn > span.price > span:not(.list-price):not(.bg-red) {
            font-size: 2rem;
            font-weight: normal; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .btn:hover {
        background-color: #0076f8;
        border-color: rgba(255, 255, 255, 0.5);
        color: #fff; }
    .mainVisual .swiper-wrapper .swiper-slide .meta .btn + .gray-text {
      margin-top: .5rem; }
    .mainVisual .swiper-wrapper .swiper-slide .meta .tvod-tag {
      color: #fff;
      margin-top: .8rem;
      font-size: 1.2rem; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .tvod-tag i {
        text-shadow: none;
        background: #fff;
        color: #0076f8;
        margin-right: .5rem; }
    .mainVisual .swiper-wrapper .swiper-slide .meta .tvod-wrapper {
      margin-top: 1rem;
      font-size: 1.2rem;
      text-align: center; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .tvod-wrapper div:first-child {
        border-bottom: 1px #fff solid;
        margin-bottom: .5rem;
        padding-bottom: .1rem; }
      .mainVisual .swiper-wrapper .swiper-slide .meta .tvod-wrapper .price {
        font-size: 2rem; }
        @media (min-width: 897px) {
          .mainVisual .swiper-wrapper .swiper-slide .meta .tvod-wrapper .price {
            font-size: 2.4rem; } }
      .mainVisual .swiper-wrapper .swiper-slide .meta .tvod-wrapper .small-text {
        font-size: 1.2rem; }
  .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper {
    border-radius: 4px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    display: block;
    background-color: #d4d7d9; }
    @media screen and (max-width: 767px) and (orientation: landscape) {
      .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper {
        width: 60%; } }
    @media (min-width: 897px) {
      .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper {
        width: 60%; } }
    .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper .tag {
      position: absolute;
      top: 0;
      left: 0;
      background-color: #0076f8;
      color: #fff;
      padding: 0.6rem .9rem;
      border-radius: 2rem;
      font-size: 1.4rem;
      line-height: 2rem;
      font-weight: bold;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border: 1px #fff solid;
      border-left: none; }
      @media (min-width: 897px) {
        .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper .tag {
          font-size: 1.6rem;
          padding: 0.8rem 1rem; } }
      .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper .tag.tvod-tag {
        background-color: #f2106f; }
        .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper .tag.tvod-tag i {
          background: transparent;
          padding: 0;
          border-radius: initial;
          font-size: 1.8rem;
          height: auto;
          width: auto; }
          @media (min-width: 897px) {
            .mainVisual .swiper-wrapper .swiper-slide .thumbnail-wrapper .tag.tvod-tag i {
              font-size: 2rem; } }
  .mainVisual .swiper-wrapper .swiper-slide .live-countdown {
    color: #fff;
    background: rgba(255, 255, 255, 0.2);
    padding: .5rem 1rem 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.3); }
    .mainVisual .swiper-wrapper .swiper-slide .live-countdown .delivery-date::before {
      background: #fff; }
  .mainVisual .swiper-wrapper .swiper-slide:not(.swiper-slide-active) {
    opacity: 0 !important; }
  .mainVisual .swiper-button-next,
  .mainVisual .swiper-button-prev {
    background-color: rgba(255, 255, 255, 0.3); }
    @media (max-width: 897px) {
      .mainVisual .swiper-button-next,
      .mainVisual .swiper-button-prev {
        width: 3.5rem;
        height: 4rem;
        margin-top: 2rem;
        padding: 0; } }
    .mainVisual .swiper-button-next::after,
    .mainVisual .swiper-button-prev::after {
      color: #ffffff; }
      @media (max-width: 897px) {
        .mainVisual .swiper-button-next::after,
        .mainVisual .swiper-button-prev::after {
          font-size: 1.6rem; } }
    @media (max-width: 897px) {
      .mainVisual .swiper-button-next,
      .mainVisual .swiper-button-prev {
        opacity: 1;
        pointer-events: auto;
        top: 0;
        margin-top: 23.125%; } }

.topics-wrapper {
  border-top: 1px rgba(255, 255, 255, 0.2) solid;
  background-color: rgba(255, 255, 255, 0.2);
  position: relative; }
  .topics-wrapper::before {
    content: "";
    background-color: #ffffff;
    position: absolute;
    top: 0;
    left: 0;
    width: 14rem;
    height: 100%;
    z-index: -1; }
    @media (min-width: 768px) {
      .topics-wrapper::before {
        width: 20rem; } }
    @media (min-width: 897px) {
      .topics-wrapper::before {
        width: 24rem; } }
    @media (min-width: 1650px) {
      .topics-wrapper::before {
        width: 28%; } }
  .topics-wrapper > div {
    padding-top: 3.4rem;
    padding-bottom: 3.4rem;
    position: relative; }
    @media (min-width: 897px) {
      .topics-wrapper > div {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem; } }
    @media (min-width: 1024px) {
      .topics-wrapper > div {
        padding-top: 6.2rem;
        padding-bottom: 6.2rem; } }
    .topics-wrapper > div::before {
      content: "";
      background-color: #ffffff;
      position: absolute;
      top: 0;
      left: 0;
      width: 14rem;
      height: 100%;
      z-index: -1; }
      @media (min-width: 768px) {
        .topics-wrapper > div::before {
          width: 20rem; } }
      @media (min-width: 897px) {
        .topics-wrapper > div::before {
          width: 24rem; } }
    .topics-wrapper > div::after {
      content: "";
      background-color: #ffffff;
      position: absolute;
      top: 0;
      left: 14rem;
      width: 220%;
      height: 50%;
      -webkit-transform-origin: left center;
      -ms-transform-origin: left center;
      transform-origin: left top;
      -webkit-transform: rotate(76deg);
      -ms-transform: rotate(76deg);
      transform: rotate(76deg);
      z-index: -1; }
      @media (min-width: 768px) {
        .topics-wrapper > div::after {
          left: 20rem;
          width: 80%;
          height: 70%; } }
      @media (min-width: 897px) {
        .topics-wrapper > div::after {
          left: 24rem; } }
  .topics-wrapper .h3-title {
    color: #555555; }
  .topics-wrapper .topics {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -.45rem; }
    @media (min-width: 768px) {
      .topics-wrapper .topics {
        margin: -1rem; } }
    @media (min-width: 897px) {
      .topics-wrapper .topics {
        margin: -1.5rem; } }
    @media (min-width: 1024px) {
      .topics-wrapper .topics {
        margin: -1.8rem; } }
    .topics-wrapper .topics-item {
      width: 100%;
      box-sizing: border-box;
      padding: .45rem;
      position: relative; }
      @media (min-width: 768px) {
        .topics-wrapper .topics-item {
          padding: 1rem; } }
      @media (min-width: 897px) {
        .topics-wrapper .topics-item {
          width: 50%;
          padding: 1.5rem; } }
      @media (min-width: 1024px) {
        .topics-wrapper .topics-item {
          padding: 1.8rem; } }
      .topics-wrapper .topics-item > a {
        display: block;
        box-shadow: 0 1px 8px rgba(0, 45, 93, 0.1);
        border-radius: 4px;
        overflow: hidden;
        background-color: #d4d7d9; }
        @media (min-width: 768px) {
          .topics-wrapper .topics-item > a {
            box-shadow: 0 4px 20px rgba(0, 45, 93, 0.1); } }
        .topics-wrapper .topics-item > a .thumbnail {
          padding-top: 34.5821325648%;
          background-size: cover;
          background-position: center;
          background-repeat: no-repeat; }

.info-row {
  padding-top: 3.4rem;
  padding-bottom: 3.4rem; }
  @media (min-width: 897px) {
    .info-row {
      padding-top: 8rem;
      padding-bottom: 8rem; } }
  .info-row .btn-wrapper {
    margin-top: 2rem; }
    @media (min-width: 768px) {
      .info-row .btn-wrapper {
        margin-top: 3.2rem; } }

.fadein.active {
  opacity: 0;
  transform: translate(0, 50px);
  transition: transform 800ms, opacity 800ms; }
  .fadein.active.scrollin {
    opacity: 1;
    transform: translate(0, 0); }

.contentTitle + .info,
.article-wrapper {
  margin-top: 2.4rem;
  margin-bottom: 5rem; }
  @media (min-width: 768px) {
    .contentTitle + .info,
    .article-wrapper {
      margin-top: 4rem;
      margin-bottom: 7rem; } }

.info-item {
  position: relative;
  padding: 1.5rem 5rem 1.5rem 0;
  border-top: 1px #d4d7d9 solid;
  transition: background-color 0.3s ease;
  display: block; }
  .info-item:hover {
    text-decoration: none !important; }
  @media (min-width: 897px) {
    .info-item {
      padding: 1.5rem 5rem 1.5rem 1.5rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex; } }
  .info-item:last-child {
    border-bottom: 1px #d4d7d9 solid; }
  .info-item:not(div):hover {
    background-color: #f6f7f9; }
  .info-item:not(div)::after {
    content: "\e900";
    font-family: "animax" !important;
    position: absolute;
    right: 0;
    top: 50%;
    height: 1.2rem;
    margin-top: -0.85rem;
    color: #0076f8; }
    @media (min-width: 897px) {
      .info-item:not(div)::after {
        right: 1.5rem; } }
.info-date {
  color: #8c9395;
  padding-right: 2rem;
  box-sizing: border-box;
  display: block; }
.info-title {
  display: block; }

.info + .loader-wrapper {
  margin: 6rem 0; }

@media (max-width: 767px) {
  .article-wrapper {
    padding-left: 0;
    padding-right: 0;
    margin-top: 0; } }
@media (min-width: 897px) {
  .article-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; } }
.article-wrapper .article {
  box-shadow: 0 4px 20px rgba(0, 45, 93, 0.1);
  padding-top: 3.2rem;
  padding-bottom: 3.2rem;
  padding-right: 1.4rem;
  padding-left: 1.4rem;
  border-radius: 4px; }
  @media (min-width: 768px) {
    .article-wrapper .article {
      padding: 3.2rem; } }
  @media (min-width: 897px) {
    .article-wrapper .article {
      width: 63%; } }
  .article-wrapper .article > * + * {
    margin-top: 2.2rem; }
    @media (min-width: 897px) {
      .article-wrapper .article > * + * {
        margin-top: 3.2rem; } }
  .article-wrapper .article img {
    width: 100%;
    max-width: 50rem;
    display: block;
    margin-left: auto;
    margin-right: auto; }
  .article-wrapper .article h4 {
    border-bottom: 1px #8c9395 solid;
    margin-bottom: 1.5rem;
    font-size: 1.8rem;
    font-weight: normal; }
    @media (min-width: 897px) {
      .article-wrapper .article h4 {
        font-size: 2rem; } }
    .article-wrapper .article h4 + * {
      margin-top: 0; }
  .article-wrapper .article > p {
    line-height: 1.8; }
  .article-wrapper .article a {
    color: #0076f8; }
    .article-wrapper .article a.button {
      margin: 2.2rem 0;
      display: block;
      padding: 1.5rem 4rem;
      text-align: center;
      box-sizing: border-box;
      border: 1px #0076f8 solid;
      transition: all 0.3s ease;
      border-radius: 4px; }
      @media (min-width: 897px) {
        .article-wrapper .article a.button {
          margin: 3.2rem 0; } }
      .article-wrapper .article a.button:hover {
        text-decoration: none !important;
        background-color: #0076f8;
        color: #fff; }
  .article-wrapper .article .small-text {
    font-size: 1.2rem; }
@media (max-width: 767px) {
  .article-wrapper .info-list {
    padding-right: 1.4rem;
    padding-left: 1.4rem; } }
@media (max-width: 896px) {
  .article-wrapper .info-list {
    margin-top: 6rem; } }
@media (min-width: 897px) {
  .article-wrapper .info-list {
    width: 37%;
    margin-left: 4.2rem; } }
.article-wrapper .info-list-title {
  font-size: 1.8rem;
  margin-bottom: 1rem; }
  @media (min-width: 1024px) {
    .article-wrapper .info-list-title {
      font-size: 2rem; } }
.article-wrapper .info-list .info-item {
  display: block; }
  .article-wrapper .info-list .info-item .fint-date,
  .article-wrapper .info-list .info-item .info-title {
    font-size: 1.2rem; }

.history {
  margin-top: 2.4rem;
  margin-bottom: 5rem; }
  @media (min-width: 768px) {
    .history {
      margin-top: 4rem;
      margin-bottom: 7rem; } }
  .history table {
    width: 100%; }
    .history table tr {
      border-bottom: 1px solid #d4d7d9; }
      @media (max-width: 896px) {
        .history table tr {
          display: block; }
          .history table tr:not(:first-child) {
            padding: 1rem 0; } }
      @media (max-width: 896px) {
        .history table tr th {
          display: none;
          padding: 0 1rem; } }
      @media (min-width: 897px) {
        .history table tr th {
          text-align: left;
          padding: 1rem; }
          .history table tr th.date {
            width: 15%; }
          .history table tr th.name {
            width: 35%; }
          .history table tr th.price {
            width: 10%; }
          .history table tr th.limit {
            width: 15%; }
          .history table tr th.btn {
            width: 15%; } }
      .history table tr td {
        padding: .25rem 1rem;
        vertical-align: middle; }
        @media (max-width: 896px) {
          .history table tr td {
            display: block; } }
        @media (min-width: 897px) {
          .history table tr td {
            padding: 1rem; } }
        @media (min-width: 897px) {
          .history table tr td:last-child {
            text-align: right; } }
        .history table tr td.name .tvod-tag {
          color: #8c9395;
          margin-bottom: .5rem; }
          .history table tr td.name .tvod-tag i {
            background: #8c9395;
            font-size: 1rem;
            width: 1.6rem;
            height: 1.6rem;
            margin-right: .5rem; }
        @media (max-width: 896px) {
          .history table tr td.name {
            font-size: 1.4rem;
            font-weight: bold; } }
        @media (min-width: 897px) {
          .history table tr td > span {
            display: none; } }

.purchase {
  margin-top: 2.4rem;
  margin-bottom: 5rem; }
  @media (min-width: 768px) {
    .purchase {
      margin-top: 4rem;
      margin-bottom: 7rem; } }
  .purchase .purchase-title {
    font-weight: bold;
    text-align: center;
    margin-bottom: 2rem; }
  .purchase > img {
    max-width: 60rem;
    display: block;
    margin: 0 auto 2rem;
    width: 100%; }
    @media (min-width: 768px) {
      .purchase > img {
        margin-bottom: 3rem; } }
  .purchase .product-detail .title {
    font-size: 1.6rem;
    font-weight: bold; }
    @media (min-width: 897px) {
      .purchase .product-detail .title {
        font-size: 1.8rem; } }
  .purchase .product-detail .title + .period-label,
  .purchase .product-detail .detail + .period-label {
    margin-top: 1.5rem; }
  .purchase .product-detail .coupon-label {
    border: 1px #d4d7d9 solid;
    padding: 1rem;
    box-sizing: border-box;
    text-align: center;
    margin: 2rem 0; }
    .purchase .product-detail .coupon-label .text {
      font-size: 2rem;
      font-weight: bold; }
  .purchase .product-detail .period-label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: .5rem;
    margin-top: .5rem; }
    .purchase .product-detail .period-label .label {
      border: 1px solid #d4d7d9;
      padding: .5rem;
      width: 8rem;
      box-sizing: border-box;
      text-align: center;
      font-size: 1.2rem;
      margin: -.5rem .5rem -.5rem -.5rem;
      flex-shrink: 0; }
  .purchase .product-detail + .form-box {
    border-top: 1px #d4d7d9 solid;
    padding-top: 2rem; }
    @media (min-width: 768px) {
      .purchase .product-detail + .form-box {
        padding-top: 3rem; } }
  .purchase .btn-wrapper {
    margin-top: 3rem;
    text-align: center; }
    .purchase .btn-wrapper .btn {
      padding-left: 3rem;
      padding-right: 3rem; }
  .purchase-term {
    background-color: #f6f7f9;
    position: relative;
    margin-top: 3rem;
    padding-bottom: 2rem; }
    .purchase-term:before {
      content: "";
      position: absolute;
      bottom: 2rem;
      left: 2rem;
      right: 2rem;
      height: 2rem;
      background: -webkit-gradient(linear, right bottom, right top, from(#f6f7f9), to(rgba(246, 247, 249, 0)));
      background: -moz-linear-gradient(to top, #f6f7f9, rgba(246, 247, 249, 0));
      background: linear-gradient(to top, #f6f7f9, rgba(246, 247, 249, 0)); }
    .purchase-term-title {
      font-weight: bold;
      padding: 2rem 2rem 1rem; }
    .purchase-term-scroll {
      overflow-y: scroll;
      overflow-x: hidden;
      height: 10rem;
      font-size: 1.2rem;
      padding-bottom: 2rem;
      box-sizing: border-box;
      padding: 1rem 2rem 2rem; }

.purchased-list-tab {
  margin: 3rem 0; }
  .purchased-list-tab .tab-link > span {
    font-size: 1.4rem; }
    @media (min-width: 897px) {
      .purchased-list-tab .tab-link > span {
        font-size: 1.8rem; } }
    .purchased-list-tab .tab-link > span i {
      margin-right: 1rem; }
  .purchased-list-tab .tab-link.active {
    color: #f2106f;
    box-shadow: 0 8px 9px -5px rgba(255, 204, 152, 0.15); }
    .purchased-list-tab .tab-link.active::before {
      background: -webkit-gradient(linear, left top, right bottom, from(#ffc284), to(#f2106f));
      background: -moz-linear-gradient(to left, #ffc284, #f2106f);
      background: linear-gradient(to left, #ffc284, #f2106f); }
    .purchased-list-tab .tab-link.active > span {
      font-weight: bold; }
      .purchased-list-tab .tab-link.active > span::before {
        border-color: #f2106f transparent transparent transparent; }

.ticket-content .ticket-item + .ticket-item {
  margin-top: 3rem; }
.ticket-content .ticket-item .thumbnail-wrapper {
  position: relative;
  overflow: hidden; }
  .ticket-content .ticket-item .thumbnail-wrapper .back-thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-filter: blur(19px);
    -moz-filter: blur(19px);
    -o-filter: blur(19px);
    -ms-filter: blur(19px);
    filter: blur(19px);
    opacity: .6; }
  .ticket-content .ticket-item .thumbnail-wrapper .thumbnail-wrapper {
    max-width: 60rem;
    margin: auto; }
.ticket-content .ticket-item .ticket-text {
  border-left: 1px solid #d4d7d9;
  border-right: 1px solid #d4d7d9;
  border-bottom: 1px solid #d4d7d9; }
  @media (min-width: 897px) {
    .ticket-content .ticket-item .ticket-text {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center; } }
  .ticket-content .ticket-item .ticket-text .text-wrapper {
    padding: 1.5rem;
    box-sizing: border-box; }
    @media (max-width: 896px) {
      .ticket-content .ticket-item .ticket-text .text-wrapper {
        border-bottom: 2px dotted #d4d7d9; } }
    @media (min-width: 897px) {
      .ticket-content .ticket-item .ticket-text .text-wrapper {
        padding: 3rem;
        border-right: 2px dotted #d4d7d9;
        width: 70%; } }
    .ticket-content .ticket-item .ticket-text .text-wrapper .title {
      font-size: 1.6rem;
      font-weight: bold; }
      @media (min-width: 897px) {
        .ticket-content .ticket-item .ticket-text .text-wrapper .title {
          font-size: 2rem; } }
    .ticket-content .ticket-item .ticket-text .text-wrapper .description {
      margin-top: .5rem; }
    .ticket-content .ticket-item .ticket-text .text-wrapper .period-label {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      padding: .5rem;
      margin-top: .5rem; }
      .ticket-content .ticket-item .ticket-text .text-wrapper .period-label .label {
        border: 1px solid #d4d7d9;
        padding: .5rem;
        width: 8rem;
        box-sizing: border-box;
        text-align: center;
        font-size: 1.2rem;
        margin: -.5rem .5rem -.5rem -.5rem;
        flex-shrink: 0; }
    .ticket-content .ticket-item .ticket-text .text-wrapper .description + .period-label {
      margin-top: 1.5rem; }
  .ticket-content .ticket-item .ticket-text .ticket-price {
    padding: 2rem;
    box-sizing: border-box;
    text-align: center;
    flex-shrink: 0; }
    @media (min-width: 897px) {
      .ticket-content .ticket-item .ticket-text .ticket-price {
        padding: 3rem;
        min-width: 30rem;
        width: 30%; } }
    .ticket-content .ticket-item .ticket-text .ticket-price .price > span {
      font-size: 3rem;
      margin-right: .5rem; }
    .ticket-content .ticket-item .ticket-text .ticket-price .text {
      background: rgba(212, 215, 217, 0.5);
      padding: 1.4rem;
      box-sizing: border-box;
      font-weight: bold; }
      .ticket-content .ticket-item .ticket-text .ticket-price .text + .btn {
        margin-top: 1.4rem; }
    .ticket-content .ticket-item .ticket-text .ticket-price .btn {
      margin-top: 1rem;
      width: 100%; }
      .ticket-content .ticket-item .ticket-text .ticket-price .btn + .btn {
        margin-left: 0;
        margin-top: 1.5rem; }

.ticket-code {
  margin-top: 2.4rem;
  margin-bottom: 2.4rem; }
  @media (min-width: 768px) {
    .ticket-code {
      margin-top: 4rem;
      margin-bottom: 4rem; } }
  @media screen and (max-width: 767px) and (orientation: landscape) {
    .ticket-code {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  @media (min-width: 897px) {
    .ticket-code {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  .ticket-code-title {
    text-shadow: 1px 1px 0 rgba(5, 45, 90, 0.5);
    box-sizing: border-box; }
    @media (max-width: 896px) {
      .ticket-code-title {
        margin-top: 2.4rem; } }
    @media screen and (max-width: 767px) and (orientation: landscape) {
      .ticket-code-title {
        padding-right: 3.6rem;
        width: 45%; } }
    @media (min-width: 897px) {
      .ticket-code-title {
        padding-right: 3.6rem;
        width: 45%;
        flex-shrink: 0; } }
    .ticket-code-title h2 {
      font-size: 1.8rem; }
      @media (min-width: 897px) {
        .ticket-code-title h2 {
          font-size: 2rem; } }
      @media (min-width: 1024px) {
        .ticket-code-title h2 {
          font-size: 2.6rem; } }
    .ticket-code-title .program-description {
      margin-top: 1.2rem; }
    .ticket-code-title .btn {
      margin-top: 2rem; }
    .ticket-code-title .copyright {
      font-size: 1rem;
      margin-top: 3rem;
      opacity: .6; }
  .ticket-code-thumbnail {
    border-radius: 4px;
    box-shadow: 0 1px 8px rgba(0, 45, 93, 0.1);
    overflow: hidden;
    position: relative;
    background-color: #d4d7d9; }
    @media screen and (max-width: 767px) and (orientation: landscape) {
      .ticket-code-thumbnail {
        flex-shrink: 0;
        width: 55%; } }
    @media (min-width: 897px) {
      .ticket-code-thumbnail {
        flex-shrink: 0;
        width: 55%; } }
  .ticket-code_code {
    margin-top: 2.4rem;
    margin-bottom: 2.4rem; }
    @media (min-width: 768px) {
      .ticket-code_code {
        margin-top: 4rem;
        margin-bottom: 4rem; } }
    .ticket-code_code-meta {
      box-sizing: border-box;
      padding-bottom: 2.4rem;
      margin-bottom: 2.4rem;
      border-bottom: 1px #d4d7d9 solid; }
      @media (min-width: 768px) {
        .ticket-code_code-meta {
          padding-bottom: 4rem;
          margin-bottom: 4rem; } }
      .ticket-code_code-meta__box .period-label {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-weight: bold; }
        .ticket-code_code-meta__box .period-label:not(:last-child) {
          margin-bottom: 1rem;
          margin-top: 1rem; }
        .ticket-code_code-meta__box .period-label .label {
          border: 1px solid #d4d7d9;
          min-width: 8rem;
          text-align: center;
          padding: .5rem;
          box-sizing: border-box;
          margin-right: .5rem; }
    .ticket-code_code #openBox .text {
      overflow: hidden; }
      .ticket-code_code #openBox .text.is-open {
        height: 100% !important; }
        .ticket-code_code #openBox .text.is-open + .more-button {
          margin-top: 2rem; }
          .ticket-code_code #openBox .text.is-open + .more-button::before {
            display: none; }
          .ticket-code_code #openBox .text.is-open + .more-button::after {
            -webkit-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            transform: rotate(180deg);
            vertical-align: .3rem; }
    .ticket-code_code #openBtn {
      text-align: center;
      cursor: pointer;
      transition: margin-top 0.3s ease;
      position: relative;
      background-color: #ffffff; }
      .ticket-code_code #openBtn:before {
        content: "";
        background: -webkit-gradient(linear, right bottom, right top, from(#ffffff), to(rgba(255, 255, 255, 0)));
        background: -moz-linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
        background: linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0));
        position: absolute;
        top: -3rem;
        left: 0;
        right: 0;
        height: 3rem; }
      .ticket-code_code #openBtn::after {
        content: "\e906";
        font-family: 'animax' !important;
        font-size: .5rem;
        margin-left: .5rem;
        display: inline-block; }
    .ticket-code_code .text {
      overflow: hidden; }
      .ticket-code_code .text.is-open {
        height: 100% !important; }
        .ticket-code_code .text.is-open + .more-button {
          margin-top: 2rem; }
          .ticket-code_code .text.is-open + .more-button::before {
            display: none; }
          .ticket-code_code .text.is-open + .more-button::after {
            -webkit-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            transform: rotate(180deg);
            vertical-align: .3rem; }
    .ticket-code_code-wrapper {
      max-width: 80rem;
      margin: auto;
      text-align: center; }
      .ticket-code_code-wrapper > span {
        box-sizing: border-box;
        background-color: rgba(212, 215, 217, 0.5);
        padding: 2rem;
        font-size: 3rem;
        display: block;
        font-weight: bold;
        -webkit-user-select: text;
        -moz-user-select: text;
        -ms-user-select: text;
        user-select: text;
        margin-top: .5rem; }
    .ticket-code_code-freetext {
      border: 6px #d4d7d9 solid;
      max-width: 80rem;
      margin: auto;
      padding: 2rem;
      box-sizing: border-box;
      text-align: center;
      font-size: 1.6rem;
      font-weight: bold; }
    .ticket-code_code #code-copy {
      margin: 2rem auto 0;
      display: block;
      font-size: 1.8rem;
      position: relative; }
      .ticket-code_code #code-copy .copytext {
        position: absolute;
        top: -3.6rem;
        left: 0;
        right: 0;
        font-size: 1.2rem;
        background: #000;
        display: none;
        width: 18rem;
        padding: 1rem;
        margin: auto; }
        .ticket-code_code #code-copy .copytext::before {
          content: "\e904";
          font-family: 'animax';
          position: absolute;
          bottom: -.8rem;
          font-size: 1rem;
          line-height: 1rem;
          color: #000;
          left: 0;
          right: 0; }
      .ticket-code_code #code-copy.copyed:hover .copytext {
        display: block; }
    .ticket-code_code-description {
      border: 1px #d4d7d9 solid;
      padding: 2rem;
      box-sizing: border-box;
      width: 100%;
      margin-top: 2.4rem; }
      @media (min-width: 768px) {
        .ticket-code_code-description {
          margin-top: 4rem; } }
      .ticket-code_code-description ul {
        padding-left: 2rem; }
        .ticket-code_code-description ul li {
          list-style-type: disc; }
    .ticket-code_code-btn {
      text-align: center;
      margin-top: 3.4rem; }
      @media (min-width: 768px) {
        .ticket-code_code-btn {
          margin-top: 5rem; } }
      @media (max-width: 896px) {
        .ticket-code_code-btn .btn {
          display: block;
          max-width: 27rem;
          margin: auto; }
          .ticket-code_code-btn .btn + .btn {
            margin-top: 1rem; } }
      .ticket-code_code-btn + .ticket-code_code-btn {
        margin-top: 3rem; }

.products-row {
  padding-top: 3.4rem;
  padding-bottom: 3.4rem; }
  @media (min-width: 897px) {
    .products-row {
      padding-top: 4.5rem;
      padding-bottom: 4.5rem; } }
  @media (min-width: 1024px) {
    .products-row {
      padding-top: 8rem;
      padding-bottom: 8rem; } }
  .products-row .content-alignment > p {
    margin-bottom: 3rem; }
  .products-row .product-program__btn {
    margin-top: 2rem;
    text-align: center; }
    @media (min-width: 897px) {
      .products-row .product-program__btn {
        margin-top: 3rem; } }
  .products-row .product-program {
    margin-top: 5rem; }
    @media (min-width: 897px) {
      .products-row .product-program {
        margin-top: 7rem; } }
    .products-row .product-program__title {
      position: relative;
      color: #8c9395;
      text-align: center; }
      .products-row .product-program__title::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        height: 1px;
        background-color: #d4d7d9;
        z-index: -1; }
      .products-row .product-program__title > span {
        background-color: #ffffff;
        padding: 0 1rem;
        box-sizing: border-box;
        font-size: 2rem; }
    .products-row .product-program__meta {
      margin-top: 2rem; }
      .products-row .product-program__meta__thumb {
        width: 40%;
        float: left; }
        @media (min-width: 897px) {
          .products-row .product-program__meta__thumb {
            width: 30%; } }
      .products-row .product-program__meta-title {
        font-weight: bold;
        font-size: 1.6rem;
        padding-left: 1.5rem;
        box-sizing: border-box;
        overflow: hidden; }
        @media (min-width: 897px) {
          .products-row .product-program__meta-title {
            padding-left: 2rem;
            font-size: 2.6rem; } }
        .products-row .product-program__meta-title > span {
          font-size: 1.2rem;
          display: block; }
          @media (min-width: 897px) {
            .products-row .product-program__meta-title > span {
              font-size: 1.4rem; } }
      .products-row .product-program__meta-description {
        margin-top: 1.5rem;
        padding-left: 2rem;
        box-sizing: border-box;
        overflow: hidden; }
        @media (max-width: 896px) {
          .products-row .product-program__meta-description {
            clear: both;
            margin-top: 0;
            padding: 1rem 0 0; } }
        .products-row .product-program__meta-description .period-label {
          display: -webkit-box;
          display: -webkit-flex;
          display: -moz-box;
          display: -ms-flexbox;
          display: flex;
          padding: .5rem;
          margin-top: 1rem; }
          @media (min-width: 897px) {
            .products-row .product-program__meta-description .period-label {
              margin-top: 2rem; } }
          .products-row .product-program__meta-description .period-label + .period-label {
            margin-top: .5rem; }
          .products-row .product-program__meta-description .period-label .label {
            border: 1px solid #d4d7d9;
            padding: .5rem;
            width: 8rem;
            box-sizing: border-box;
            text-align: center;
            font-size: 1.2rem;
            margin: -.5rem .5rem -.5rem -.5rem;
            flex-shrink: 0; }

.environment {
  margin-top: 2.4rem;
  margin-bottom: 5rem; }
  @media (min-width: 768px) {
    .environment {
      margin-top: 4rem;
      margin-bottom: 7rem; } }
  .environment .h3-title {
    margin-bottom: 1rem; }
  .environment > * + .h3-title {
    margin-top: 2.4rem; }
    @media (min-width: 768px) {
      .environment > * + .h3-title {
        margin-top: 4rem; } }
  .environment .test-video-wrapper {
    max-width: 64rem;
    margin: 2rem auto 0;
    background: #d4d7d9; }
    .environment .test-video-wrapper #test-video {
      padding-top: 56.25%;
      position: relative; }
      .environment .test-video-wrapper #test-video > * {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0; }
  .environment h4 {
    font-size: 1.6rem; }
  .environment table + h4 {
    margin-top: 3rem; }
  .environment table {
    width: 100%;
    table-layout: fixed;
    margin-top: 1rem; }
    .environment table tbody {
      border: #d4d7d9 solid 1px; }
      .environment table tbody tr + tr {
        border-top: #d4d7d9 solid 1px;
        border-bottom: #d4d7d9 solid 1px; }
      .environment table tbody tr th {
        padding: 1.5rem;
        background-color: #d4d7d9;
        vertical-align: middle; }
      .environment table tbody tr td {
        padding: 1.5rem;
        vertical-align: middle;
        word-break: break-all; }
        @media (min-width: 897px) {
          .environment table tbody tr td {
            padding: 2.5rem; } }
        .environment table tbody tr td + td {
          border-left: #d4d7d9 solid 1px; }
    @media (max-width: 896px) {
      .environment table.big tbody tr th {
        display: none; } }
    @media (min-width: 897px) {
      .environment table.big tbody tr:not(.last) th {
        border-bottom: 2px solid #fff; } }
    .environment table.big tbody tr.mb-visible th {
      display: none; }
      @media (max-width: 896px) {
        .environment table.big tbody tr.mb-visible th {
          display: table-cell; } }

.contentTitle .program {
  margin-top: 2.4rem;
  margin-bottom: 2.4rem; }
  @media (min-width: 768px) {
    .contentTitle .program {
      margin-top: 4rem;
      margin-bottom: 4rem; } }
  @media screen and (max-width: 767px) and (orientation: landscape) {
    .contentTitle .program {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  @media (min-width: 897px) {
    .contentTitle .program {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  .contentTitle .program-title {
    text-shadow: 1px 1px 0 rgba(5, 45, 90, 0.5);
    box-sizing: border-box; }
    @media (max-width: 896px) {
      .contentTitle .program-title {
        margin-top: 2.4rem; } }
    @media screen and (max-width: 767px) and (orientation: landscape) {
      .contentTitle .program-title {
        padding-right: 3.6rem;
        width: 45%; } }
    @media (min-width: 897px) {
      .contentTitle .program-title {
        padding-right: 3.6rem;
        width: 45%;
        flex-shrink: 0; } }
    .contentTitle .program-title h2 {
      font-size: 1.8rem; }
      @media (min-width: 897px) {
        .contentTitle .program-title h2 {
          font-size: 2rem; } }
      @media (min-width: 1024px) {
        .contentTitle .program-title h2 {
          font-size: 2.6rem; } }
    .contentTitle .program-title .program-description {
      margin-top: 1.2rem; }
    .contentTitle .program-title .btn {
      margin-top: 2rem; }
    .contentTitle .program-title .copyright {
      font-size: 1rem;
      margin-top: 3rem;
      opacity: .6; }
  .contentTitle .program-thumbnail {
    border-radius: 4px;
    box-shadow: 0 1px 8px rgba(0, 45, 93, 0.1);
    overflow: hidden;
    position: relative;
    background-color: #d4d7d9; }
    @media screen and (max-width: 767px) and (orientation: landscape) {
      .contentTitle .program-thumbnail {
        flex-shrink: 0;
        width: 55%; } }
    @media (min-width: 897px) {
      .contentTitle .program-thumbnail {
        flex-shrink: 0;
        width: 55%; } }

.player-wrapper > .player {
  margin: auto; }
.player-wrapper .player {
  background-color: #000;
  position: relative; }
  .player-wrapper .player .player-inner {
    padding-top: 56.25%;
    height: 0;
    width: 100%;
    position: relative; }
    .player-wrapper .player .player-inner .thumbnail {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      padding-top: 56.25%;
      background-size: contain; }
    .player-wrapper .player .player-inner .btn-wrapper {
      margin: auto;
      padding: 2rem 1.4rem;
      box-sizing: border-box;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -webkit-flex-direction: column;
      -moz-box-orient: vertical;
      -moz-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; }
      @media (min-width: 768px) {
        .player-wrapper .player .player-inner .btn-wrapper {
          padding: 2rem 5.4%; } }
      @media (min-width: 900px) {
        .player-wrapper .player .player-inner .btn-wrapper {
          padding: 2rem 8rem; } }
      .player-wrapper .player .player-inner .btn-wrapper p {
        margin-top: 1rem; }
  .player-wrapper .player .btn-wrapper, .player-wrapper .player .price-wrapper {
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    background: -webkit-gradient(linear, right bottom, right top, from(rgba(0, 0, 0, 0.9)), to(rgba(0, 0, 0, 0.5)));
    background: -moz-linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.5));
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.5)); }
  .player-wrapper .player .price-wrapper {
    margin: auto;
    padding: 2rem 1.4rem;
    box-sizing: border-box; }
    @media (min-width: 768px) {
      .player-wrapper .player .price-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 2rem 5.4%; } }
    @media (min-width: 900px) {
      .player-wrapper .player .price-wrapper {
        padding: 2rem 3rem; } }
  .player-wrapper .player .price-wrapper {
    display: none; }
    @media (min-width: 768px) {
      .player-wrapper .player .price-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex; } }
    .player-wrapper .player .price-wrapper .price-box {
      width: 100%;
      box-sizing: border-box; }
      @media (min-width: 768px) {
        .player-wrapper .player .price-wrapper .price-box {
          display: -webkit-box;
          display: -webkit-flex;
          display: -moz-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
          -webkit-align-items: center;
          -moz-box-align: center;
          -ms-flex-align: center;
          align-items: center; } }
      .player-wrapper .player .price-wrapper .price-box:not(:last-child) {
        margin-bottom: 1rem;
        padding-bottom: 1rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
      .player-wrapper .player .price-wrapper .price-box .btn {
        font-size: 1.4rem;
        font-weight: bold;
        padding: 1.5rem 2.4rem;
        min-width: 22rem;
        margin-left: auto; }
        @media (min-width: 897px) {
          .player-wrapper .player .price-wrapper .price-box .btn {
            width: 40%; } }
      .player-wrapper .player .price-wrapper .price-box .gray-text {
        font-size: 1.2rem; }
        @media (min-width: 768px) {
          .player-wrapper .player .price-wrapper .price-box .gray-text {
            padding-right: 1rem;
            box-sizing: border-box; } }
        @media (min-width: 897px) {
          .player-wrapper .player .price-wrapper .price-box .gray-text {
            width: 60%; } }
        .player-wrapper .player .price-wrapper .price-box .gray-text > span {
          display: block; }
        .player-wrapper .player .price-wrapper .price-box .gray-text .price > span {
          font-size: 2rem; }
.player-wrapper .player.live {
  width: 100%; }
  @media screen and (max-width: 767px) {
    .player-wrapper .player.live {
      position: fixed;
      top: 5rem;
      z-index: 1;
      height: auto; } }
  @media screen and (min-width: 768px) {
    .player-wrapper .player.live {
      flex-grow: 2;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: auto; } }
  .player-wrapper .player.live .player-inner .price-wrapper .btn {
    min-width: 25rem; }
.player-wrapper .live-title-sm {
  position: fixed;
  left: 0;
  right: 0;
  background-color: #1F1F23;
  cursor: pointer;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 4.2rem;
  z-index: 1;
  transition: opacity 0.3s ease; }
  .player-wrapper .live-title-sm.hidden {
    opacity: 0;
    pointer-events: none; }
  @media screen and (min-width: 768px) {
    .player-wrapper .live-title-sm {
      display: none; } }
  .player-wrapper .live-title-sm .live-title-sm_link {
    padding: 1em 1.4rem;
    width: 50%;
    text-align: center;
    position: relative;
    cursor: pointer; }
    .player-wrapper .live-title-sm .live-title-sm_link.active::after {
      content: "";
      height: 2px;
      width: 100%;
      background-color: #0076f8;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0; }

.comment-wrapper {
  background-color: #33343A; }
  @media (max-width: 767px) {
    .comment-wrapper {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      border-top: 1px #222222 solid;
      z-index: 1;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
      .comment-wrapper:not(.active) {
        display: none; } }
  .comment-wrapper .x-menu {
    padding: 1rem;
    border-bottom: #222222 solid 1px;
    display: none; }
    .comment-wrapper .x-menu.open {
      display: block; }
    .comment-wrapper .x-menu .side-list {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex; }
      .comment-wrapper .x-menu .side-list:not(:last-child) {
        margin-bottom: .3rem; }
      .comment-wrapper .x-menu .side-list .li-title {
        color: #8c9395;
        margin-right: .5rem;
        flex-shrink: 0;
        min-width: 120px; }
      .comment-wrapper .x-menu .side-list .user, .comment-wrapper .x-menu .side-list .tag {
        font-weight: bold;
        width: 70%; }
        .comment-wrapper .x-menu .side-list .user > span, .comment-wrapper .x-menu .side-list .tag > span {
          font-weight: normal;
          font-size: 1rem;
          padding-left: .5rem; }
  .comment-wrapper .btn-wrapper + .x-comment {
    border-top: #222222 solid 1px; }
  .comment-wrapper .x-comment {
    padding: 1rem;
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    flex-grow: 1; }
    .comment-wrapper .x-comment input {
      flex-grow: 10;
      background-color: rgba(255, 255, 255, 0.2);
      border: 1px rgba(255, 255, 255, 0.3) solid;
      padding: 1rem 1.5rem;
      box-sizing: border-box;
      border-radius: .4rem;
      height: 4rem;
      width: 60%; }
      .comment-wrapper .x-comment input::placeholder {
        color: #8c9395; }
      .comment-wrapper .x-comment input:focus {
        outline: 0;
        border-color: #0076f8; }
    .comment-wrapper .x-comment .btn {
      flex-grow: 1;
      margin-left: .5rem;
      height: 4rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      padding-left: 1rem;
      padding-right: 1rem;
      min-width: fit-content; }
      .comment-wrapper .x-comment .btn > i {
        font-size: 1.8rem;
        margin: 0; }
        @media (min-width: 768px) {
          .comment-wrapper .x-comment .btn > i {
            font-size: 1.6rem; } }
  .comment-wrapper .x-login-btn {
    padding: 1rem; }
    @media (max-width: 743px) {
      .comment-wrapper .x-login-btn {
        display: none; } }
    .comment-wrapper .x-login-btn .btn {
      padding: 1.4rem; }
  .comment-wrapper .btn-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; }
    @media (min-width: 768px) {
      .comment-wrapper .btn-wrapper {
        display: none; } }
    .comment-wrapper .btn-wrapper .x-btn {
      padding: 0.5rem 0 0.5rem 1.4rem; }
      .comment-wrapper .btn-wrapper .x-btn .btn {
        padding: 1.5rem;
        min-width: auto; }
    .comment-wrapper .btn-wrapper .x-user {
      position: relative;
      padding: 0.5rem 2rem 0.5rem 1.4rem;
      border-right: 1px #222222 solid;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      .comment-wrapper .btn-wrapper .x-user::after {
        content: "\e906";
        font-family: 'animax' !important;
        position: absolute;
        right: .5rem;
        top: 50%;
        font-size: 1rem;
        margin-top: -.5rem; }
      .comment-wrapper .btn-wrapper .x-user .tweet-icon {
        width: 2.8rem;
        height: 2.8rem;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 50%;
        background-color: #0076f8; }
      .comment-wrapper .btn-wrapper .x-user.open::after {
        transform: rotate(180deg);
        margin-top: -1rem; }
    .comment-wrapper .btn-wrapper .reaction {
      padding: 0.5rem 1.4rem;
      flex-grow: 1; }
      .comment-wrapper .btn-wrapper .reaction > * {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
        @media (max-width: 480px) {
          .comment-wrapper .btn-wrapper .reaction > * {
            width: 50%; } }
      .comment-wrapper .btn-wrapper .reaction .action-icon {
        margin: 0; }

.reaction {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }
  .reaction .action-wrapper {
    text-align: center;
    font-size: 1.2rem;
    padding: 1rem;
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 4rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media (max-width: 763px) {
      .reaction .action-wrapper {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -moz-box-orient: horizontal;
        -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        padding: 1.4rem .5rem; } }
    @media (min-width: 764px) {
      .reaction .action-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
    .reaction .action-wrapper + .action-wrapper {
      margin-left: 1rem; }
    .reaction .action-wrapper.cheer {
      background-color: rgba(242, 16, 111, 0.3); }
      @media (min-width: 764px) {
        .reaction .action-wrapper.cheer {
          min-height: 4rem;
          min-width: 4rem; } }
      .reaction .action-wrapper.cheer .action-icon {
        color: #f2106f; }
    .reaction .action-wrapper .action-icon {
      font-size: 2rem;
      transition: transform 0.3s ease;
      width: 2.8rem; }
    .reaction .action-wrapper:focus .action-icon, .reaction .action-wrapper:hover .action-icon {
      transform: scale(1.15); }
    .reaction .action-wrapper > span {
      display: block;
      margin-right: .5rem;
      font-size: 1.2rem; }
      @media (max-width: 320px) {
        .reaction .action-wrapper > span {
          font-size: 1rem; } }
      @media (min-width: 764px) {
        .reaction .action-wrapper > span {
          font-size: 1rem;
          margin-top: .5rem;
          margin-right: 0; } }

.action-icon {
  position: relative; }
  .action-icon > .icon-heart {
    display: block;
    z-index: 1;
    position: relative;
    pointer-events: auto; }
  .action-icon .move-heart {
    position: absolute;
    bottom: 0;
    animation: heart 2s ease-in-out both;
    display: block;
    pointer-events: none; }
    .action-icon .move-heart > div {
      display: block;
      animation: swing 1s ease-in-out infinite; }
    .action-icon .move-heart.white {
      color: #fff; }
    .action-icon .move-heart.right {
      animation: heartRight 2s ease-in-out both; }
    .action-icon .move-heart.left {
      animation: heartLeft 2s ease-in-out both; }

.reaction-btn {
  position: relative;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  .reaction-btn .reaction-img {
    cursor: pointer;
    display: block;
    z-index: 1;
    position: relative;
    pointer-events: auto;
    transition: transform 0.3s ease;
    max-width: 3rem;
    margin: 0 auto .3rem;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
    .reaction-btn .reaction-img:focus, .reaction-btn .reaction-img:hover {
      transform: scale(1.15); }
    .reaction-btn .reaction-img > img {
      width: 100%;
      height: auto;
      display: block;
      z-index: 4;
      position: relative; }
  .reaction-btn .move-reaction {
    position: absolute;
    bottom: 0;
    animation: heart 2s ease-in-out both;
    display: block;
    pointer-events: none;
    z-index: 2; }
    .reaction-btn .move-reaction > img {
      display: block;
      animation: swing 1s ease-in-out infinite;
      width: 2rem;
      height: 2rem; }
    .reaction-btn .move-reaction.white {
      color: #fff; }
    .reaction-btn .move-reaction.right {
      animation: heartRight 2s ease-in-out both; }
    .reaction-btn .move-reaction.left {
      animation: heartLeft 2s ease-in-out both; }

@keyframes heart {
  0% {
    transform: scale(1) translate(0, 0);
    opacity: 0.8; }
  100% {
    transform: scale(1.5) translate(0, -20rem);
    opacity: 0; } }
@keyframes heartRight {
  0% {
    transform: scale(1) translate(0, 0);
    opacity: 0.8; }
  100% {
    transform: scale(1.5) translate(2rem, -20rem);
    opacity: 0; } }
@keyframes heartLeft {
  0% {
    transform: scale(1) translate(0, 0);
    opacity: 0.8; }
  100% {
    transform: scale(1.5) translate(-2rem, -20rem);
    opacity: 0; } }
@keyframes swing {
  0% {
    transform: rotate(0deg); }
  25% {
    transform: rotate(15deg); }
  50% {
    transform: rotate(0deg); }
  75% {
    transform: rotate(-15deg); }
  100% {
    transform: rotate(0deg); } }
.episode-wrapper {
  margin-bottom: 2rem; }
  @media (max-width: 767px) {
    .episode-wrapper {
      margin-right: 1.4rem;
      margin-left: 1.4rem; } }
  @media (min-width: 768px) {
    .episode-wrapper {
      margin-bottom: 4rem; } }
  @media (min-width: 744px) and (max-width: 899px) {
    .episode-wrapper {
      padding-left: 1rem; } }
  .episode-wrapper > *:not(.content-alignment) {
    margin-top: 2rem; }
  .episode-wrapper .title-wrapper .episode-name h2 {
    font-size: 1.6rem;
    font-weight: normal; }
    @media (min-width: 768px) {
      .episode-wrapper .title-wrapper .episode-name h2 {
        font-size: 2rem; } }
    @media (min-width: 897px) {
      .episode-wrapper .title-wrapper .episode-name h2 {
        font-size: 2.4rem; } }
    .episode-wrapper .title-wrapper .episode-name h2 + .viewing-period,
    .episode-wrapper .title-wrapper .episode-name h2 + .delivery {
      margin-top: .5rem; }
  .episode-wrapper .title-wrapper .episode-name .viewing-period {
    margin-top: .5rem;
    color: #ffa112; }
  .episode-wrapper .title-wrapper .episode-name .viewing-period + .delivery {
    margin-top: .2rem; }
  .episode-wrapper .title-wrapper .episode-name .viewing-period,
  .episode-wrapper .title-wrapper .episode-name .delivery {
    font-size: 1.2rem; }
  .episode-wrapper .x-side {
    display: block; }
    @media screen and (min-width: 768px) {
      .episode-wrapper .x-side {
        display: none; } }
  .episode-wrapper .tag-wrapper {
    margin-left: -.3rem;
    margin-right: -.3rem; }
    .episode-wrapper .tag-wrapper .tag {
      background-color: #fff;
      color: #555555;
      border-radius: 2rem;
      padding: .5rem 1rem;
      font-size: 1rem;
      display: inline-block;
      font-weight: bold;
      margin: .3rem;
      transition: color 0.3s ease, background-color 0.3s ease; }
      @media (min-width: 897px) {
        .episode-wrapper .tag-wrapper .tag {
          font-size: 1.2rem; } }
    .episode-wrapper .tag-wrapper a.tag:hover {
      color: #fff;
      background-color: #0076f8; }
  .episode-wrapper .btn-wrapper {
    margin-left: -.5rem;
    margin-right: -.5rem; }
    .episode-wrapper .btn-wrapper > .btn {
      margin: .5rem; }
  .episode-wrapper .copyright {
    font-size: 1rem;
    color: #8c9395; }
  .episode-wrapper .price-wrapper {
    margin: auto; }
    @media (min-width: 768px) {
      .episode-wrapper .price-wrapper {
        display: none; } }
    .episode-wrapper .price-wrapper .price-box {
      width: 100%;
      box-sizing: border-box;
      margin-top: 0; }
      .episode-wrapper .price-wrapper .price-box:not(:last-child) {
        margin-bottom: 1rem;
        padding-bottom: 1rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
      .episode-wrapper .price-wrapper .price-box .btn {
        font-size: 1.4rem;
        font-weight: bold;
        padding: 1.5rem 2.4rem;
        min-width: 22rem;
        margin-left: auto;
        margin-top: 1rem;
        width: 100%; }
      .episode-wrapper .price-wrapper .price-box .gray-text {
        font-size: 1.2rem;
        margin-top: 0; }
        .episode-wrapper .price-wrapper .price-box .gray-text .price {
          display: block;
          margin: 0; }
          .episode-wrapper .price-wrapper .price-box .gray-text .price > span {
            font-size: 2rem; }

.live-side-table {
  display: none;
  pointer-events: none; }
  @media (max-width: 767px) {
    .live-side-table {
      padding-top: calc(56.25% + 4.2rem);
      padding-bottom: 116px; } }
  @media (min-width: 768px) {
    .live-side-table {
      display: block;
      pointer-events: auto;
      height: auto !important;
      width: 35%;
      box-sizing: border-box; } }
  @media (min-width: 764px) {
    .live-side-table {
      padding-left: 1.4rem; } }
  @media (min-width: 897px) {
    .live-side-table {
      width: 30%; } }
  @media (max-width: 767px) {
    .live-side-table.open {
      display: block;
      pointer-events: auto; } }
  .live-side-table.open .episode-wrapper {
    padding-top: 1.4rem; }
    .live-side-table.open .episode-wrapper h2 {
      position: relative; }
  .live-side-table .episode-wrapper {
    background-color: #000;
    color: #fff;
    padding-bottom: 2rem; }
    @media (min-width: 768px) {
      .live-side-table .episode-wrapper {
        padding-bottom: 4rem; } }

.x-side {
  margin-top: 2rem;
  display: none; }
  @media (min-width: 768px) {
    .x-side {
      display: block; } }
  @media (min-width: 744px) and (max-width: 899px) {
    .x-side {
      padding-right: 1rem; } }
  .x-side .side-list:not(:last-child) {
    margin-bottom: 2rem; }
  .x-side .side-list .li-title {
    border-bottom: 1px #222222 solid;
    margin-bottom: 1rem;
    color: #8c9395;
    font-size: 1.2rem;
    padding-bottom: 1rem; }
    .x-side .side-list .li-title > i {
      margin-right: .8rem;
      display: inline-block;
      vertical-align: middle; }
      .x-side .side-list .li-title > i:not(.account) {
        border-radius: 2rem;
        padding: 0.5rem;
        color: #fff;
        box-sizing: border-box; }
      .x-side .side-list .li-title > i.icon-tag {
        background-color: #8c9395; }
    .x-side .side-list .li-title .account {
      color: #fff;
      font-size: 1.8rem; }
  .x-side .side-list > span {
    font-size: 1.2rem;
    margin-left: .5rem;
    color: #8c9395; }
  .x-side .side-list .x-user-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media (max-width: 767px) {
      .x-side .side-list .x-user-wrapper {
        border-top: 1px rgba(0, 0, 0, 0.4) solid;
        order: 1; } }
    .x-side .side-list .x-user-wrapper .tweet-icon {
      width: 3.6rem;
      height: 3.6rem;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      border-radius: 50%;
      flex-shrink: 0;
      margin-right: 1rem;
      background-color: #0076f8; }
    .x-side .side-list .x-user-wrapper .user > span {
      display: block; }
    .x-side .side-list .x-user-wrapper .user .user-name {
      font-weight: bold; }
      .x-side .side-list .x-user-wrapper .user .user-name > span {
        font-size: 1.2rem;
        font-weight: normal; }
    .x-side .side-list .x-user-wrapper .user .account {
      font-size: 1.2rem; }
  .x-side .side-btn {
    margin-top: 2rem; }
    .x-side .side-btn > .btn {
      margin: 0; }
      .x-side .side-btn > .btn + * {
        margin-top: 1rem; }

.table-wrapper {
  background-color: #33343A;
  border-radius: 4px;
  overflow: hidden;
  margin-top: 2rem;
  transition: box-shadow 0.3s ease;
  position: relative;
  box-sizing: border-box; }
  @media (min-width: 768px) {
    .table-wrapper {
      margin-top: 3.6rem; } }
  .table-wrapper:last-child {
    margin-bottom: 5rem; }
    @media (min-width: 768px) {
      .table-wrapper:last-child {
        margin-bottom: 7rem; } }
  .table-wrapper.episode {
    padding: 1.5rem; }
    @media (min-width: 768px) {
      .table-wrapper.episode {
        padding: 2.4rem 2.4rem 2rem; } }
  .table-wrapper.program {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    cursor: pointer;
    color: #fff; }
    .table-wrapper.program:hover {
      text-decoration: none !important; }
      @media (min-width: 768px) {
        .table-wrapper.program:hover {
          box-shadow: 0 0px 4px rgba(0, 45, 93, 0.1); } }
      .table-wrapper.program:hover .thumbnail-wrapper .thumbnail {
        transform: scale(1.05); }
    .table-wrapper.program > * {
      flex-shrink: 0; }
    .table-wrapper.program .thumbnail-wrapper {
      width: 35%;
      overflow: hidden;
      position: relative;
      background-color: #d4d7d9; }
      @media (min-width: 897px) {
        .table-wrapper.program .thumbnail-wrapper {
          width: 20%; } }
      .table-wrapper.program .thumbnail-wrapper .thumbnail {
        transition: transform 0.3s ease; }
    .table-wrapper.program .text-wrapper {
      width: 65%;
      padding: 0 1rem;
      box-sizing: border-box; }
      @media (min-width: 768px) {
        .table-wrapper.program .text-wrapper {
          padding: 0 2rem; } }
      @media (min-width: 897px) {
        .table-wrapper.program .text-wrapper {
          width: 80%; } }
      .table-wrapper.program .text-wrapper .title {
        font-weight: bold;
        font-size: 1.4rem; }
        @media (min-width: 768px) {
          .table-wrapper.program .text-wrapper .title {
            font-size: 1.6rem; } }
        .table-wrapper.program .text-wrapper .title + p {
          margin-top: 0; }
          @media (min-width: 768px) {
            .table-wrapper.program .text-wrapper .title + p {
              margin-top: .5rem; } }
  .table-wrapper.more-table {
    height: auto; }
    .table-wrapper.more-table .more-button {
      text-align: center;
      cursor: pointer;
      transition: margin-top 0.3s ease;
      padding: 0 2.4rem;
      position: relative;
      background-color: #33343A;
      padding-right: 2rem; }
      .table-wrapper.more-table .more-button:before {
        content: "";
        background: -webkit-gradient(linear, right bottom, right top, from(#33343A), to(rgba(51, 52, 58, 0)));
        background: -moz-linear-gradient(to top, #33343A, rgba(51, 52, 58, 0));
        background: linear-gradient(to top, #33343A, rgba(51, 52, 58, 0));
        position: absolute;
        top: -4rem;
        left: 0;
        right: 0;
        height: 4rem; }
      .table-wrapper.more-table .more-button::after {
        content: "\e906";
        font-family: 'animax' !important;
        font-size: .5rem;
        margin-left: .5rem;
        display: inline-block; }
    .table-wrapper.more-table .text {
      overflow: hidden; }
      .table-wrapper.more-table .text.is-open {
        height: 100% !important; }
        .table-wrapper.more-table .text.is-open + .more-button {
          margin-top: 2rem; }
          .table-wrapper.more-table .text.is-open + .more-button::before {
            display: none; }
          .table-wrapper.more-table .text.is-open + .more-button::after {
            -webkit-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            transform: rotate(180deg);
            vertical-align: .3rem; }
  .table-wrapper + .grid-row {
    border-top: 1px #d4d7d9 solid;
    padding-top: 3.4rem;
    margin-top: 3.4rem; }
    @media (min-width: 768px) {
      .table-wrapper + .grid-row {
        padding-top: 7rem;
        margin-top: 7rem; } }

@media (max-width: 899px) {
  .vod-player,
  .live-player {
    padding-left: 0;
    padding-right: 0; } }
@media (min-width: 744px) and (max-width: 899px) {
  .vod-player,
  .live-player {
    margin-bottom: 4rem; } }
@media (min-width: 900px) {
  .vod-player,
  .live-player {
    margin-top: 4rem;
    margin-bottom: 4rem; } }
.vod-player .x-wrapper,
.live-player .x-wrapper {
  background-color: #000; }
  @media screen and (max-width: 767px) {
    .vod-player .x-wrapper,
    .live-player .x-wrapper {
      min-height: 30rem; } }
  @media screen and (min-width: 768px) {
    .vod-player .x-wrapper,
    .live-player .x-wrapper {
      background-color: rgba(255, 255, 255, 0.2);
      flex-grow: 1;
      overflow: hidden;
      overflow-y: scroll;
      height: 48.3rem; } }
  .vod-player .x-wrapper .x-login,
  .live-player .x-wrapper .x-login {
    box-sizing: border-box;
    text-align: center; }
    .vod-player .x-wrapper .x-login .x-login-text,
    .live-player .x-wrapper .x-login .x-login-text {
      background-color: #ffffff29;
      padding: 1rem;
      font-size: 1.2rem;
      width: 100%;
      box-sizing: border-box; }
  .vod-player .x-wrapper .x-inner,
  .live-player .x-wrapper .x-inner {
    padding: 1rem 0; }
    .vod-player .x-wrapper .x-inner > img.tl_img,
    .live-player .x-wrapper .x-inner > img.tl_img {
      width: 100%;
      display: block; }
    .vod-player .x-wrapper .x-inner .tweet-box,
    .live-player .x-wrapper .x-inner .tweet-box {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      padding: 1rem 1.4rem;
      box-sizing: border-box; }
      .vod-player .x-wrapper .x-inner .tweet-box:focus,
      .live-player .x-wrapper .x-inner .tweet-box:focus {
        background-color: rgba(255, 255, 255, 0.05); }
      @media screen and (min-width: 768px) {
        .vod-player .x-wrapper .x-inner .tweet-box,
        .live-player .x-wrapper .x-inner .tweet-box {
          padding: 1rem 2rem; } }
      .vod-player .x-wrapper .x-inner .tweet-box .tweet-icon,
      .live-player .x-wrapper .x-inner .tweet-box .tweet-icon {
        width: 2.6rem;
        height: 2.6rem;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 50%;
        flex-shrink: 0;
        margin-right: 1rem;
        background-color: #0076f8; }
      .vod-player .x-wrapper .x-inner .tweet-box .tweet-text,
      .live-player .x-wrapper .x-inner .tweet-box .tweet-text {
        width: 100%; }
        .vod-player .x-wrapper .x-inner .tweet-box .tweet-text a,
        .live-player .x-wrapper .x-inner .tweet-box .tweet-text a {
          color: #fff; }
        .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .name,
        .live-player .x-wrapper .x-inner .tweet-box .tweet-text .name {
          font-size: 1.2rem;
          margin-bottom: .5rem;
          display: -webkit-box;
          display: -webkit-flex;
          display: -moz-box;
          display: -ms-flexbox;
          display: flex; }
          @media (min-width: 768px) and (max-width: 896px) {
            .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .name,
            .live-player .x-wrapper .x-inner .tweet-box .tweet-text .name {
              display: block; } }
          .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .name .id,
          .live-player .x-wrapper .x-inner .tweet-box .tweet-text .name .id {
            font-weight: bold; }
          .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .name .time,
          .live-player .x-wrapper .x-inner .tweet-box .tweet-text .name .time {
            color: #8c9395;
            margin-left: auto;
            display: block;
            flex-shrink: 0; }
        .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .text,
        .live-player .x-wrapper .x-inner .tweet-box .tweet-text .text {
          font-size: 1.2rem; }
        .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .tag,
        .live-player .x-wrapper .x-inner .tweet-box .tweet-text .tag {
          margin-top: .5rem;
          font-size: 1.2rem;
          color: #8c9395; }
          .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .tag a,
          .live-player .x-wrapper .x-inner .tweet-box .tweet-text .tag a {
            color: #8c9395; }
          .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .tag + .tag,
          .live-player .x-wrapper .x-inner .tweet-box .tweet-text .tag + .tag {
            margin-top: 0; }
.vod-player .reaction-wrapper,
.live-player .reaction-wrapper {
  margin-right: .5rem;
  position: relative; }
  .vod-player .reaction-wrapper .reaction-slide,
  .live-player .reaction-wrapper .reaction-slide {
    background-color: #555555;
    position: absolute;
    right: 0;
    width: 100%;
    opacity: 0;
    pointer-events: none;
    border-radius: 3rem; }
  .vod-player .reaction-wrapper:not(.open) .reaction-slide .reaction-btn .reaction-img,
  .live-player .reaction-wrapper:not(.open) .reaction-slide .reaction-btn .reaction-img {
    display: none;
    pointer-events: none; }
  .vod-player .reaction-wrapper.open .reaction-slide,
  .live-player .reaction-wrapper.open .reaction-slide {
    opacity: 1;
    pointer-events: all; }
  .vod-player .reaction-wrapper.open .reaction-open,
  .live-player .reaction-wrapper.open .reaction-open {
    background-color: #0076f8;
    z-index: 1;
    position: relative; }
.vod-player .comment-wrapper .reaction-wrapper,
.live-player .comment-wrapper .reaction-wrapper {
  margin: 0;
  border-bottom: #222222 solid 1px;
  display: none; }
  .vod-player .comment-wrapper .reaction-wrapper.open,
  .live-player .comment-wrapper .reaction-wrapper.open {
    display: block; }
  .vod-player .comment-wrapper .reaction-wrapper .reaction-slide,
  .live-player .comment-wrapper .reaction-wrapper .reaction-slide {
    position: relative;
    display: block;
    border-radius: 0;
    border-radius: 0;
    background: transparent;
    padding: 0; }
    .vod-player .comment-wrapper .reaction-wrapper .reaction-slide .reaction-button-next,
    .vod-player .comment-wrapper .reaction-wrapper .reaction-slide .reaction-button-prev,
    .live-player .comment-wrapper .reaction-wrapper .reaction-slide .reaction-button-next,
    .live-player .comment-wrapper .reaction-wrapper .reaction-slide .reaction-button-prev {
      display: none; }

@media (max-width: 896px) {
  .vod-player .player-wrapper {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 2.4rem; } }
@media (min-width: 897px) {
  .vod-player .player-wrapper {
    margin-top: 4rem;
    margin-bottom: 4rem; } }
.vod-player .player-wrapper > .player {
  margin: auto; }
  @media screen and (min-width: 900px) {
    .vod-player .player-wrapper > .player {
      min-width: 748px;
      max-width: 100%;
      width: 748px;
      width: calc(((100vh - 300px) / 90) * 160); } }

@media (min-width: 768px) {
  .live-player {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; } }
@media (max-width: 896px) {
  .live-player .player-wrapper {
    padding-left: 0;
    padding-right: 0; } }
@media (min-width: 768px) {
  .live-player .player-wrapper {
    width: 65%; } }
@media (min-width: 897px) {
  .live-player .player-wrapper {
    width: 70%; } }
.live-player .player-wrapper .episode-wrapper {
  padding-top: calc(56.25% + 4.2rem); }
  @media (max-width: 767px) {
    .live-player .player-wrapper .episode-wrapper {
      display: none; }
      .live-player .player-wrapper .episode-wrapper.open {
        display: block; } }
  @media (min-width: 768px) {
    .live-player .player-wrapper .episode-wrapper {
      padding-top: 0; } }
  .live-player .player-wrapper .episode-wrapper .title-wrapper {
    position: relative; }
    @media (min-width: 768px) {
      .live-player .player-wrapper .episode-wrapper .title-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: space-between;
        -webkit-justify-content: space-between;
        -moz-box-pack: space-between;
        -ms-flex-pack: space-between;
        justify-content: space-between; } }
    .live-player .player-wrapper .episode-wrapper .title-wrapper .reaction {
      display: none;
      flex-shrink: 0; }
      @media screen and (min-width: 768px) {
        .live-player .player-wrapper .episode-wrapper .title-wrapper .reaction {
          display: -webkit-box;
          display: -webkit-flex;
          display: -moz-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: flex-start;
          -webkit-align-items: flex-start;
          -moz-box-align: flex-start;
          -ms-flex-align: flex-start;
          align-items: flex-start;
          margin-left: 1.5rem; } }
      .live-player .player-wrapper .episode-wrapper .title-wrapper .reaction .reaction-slide {
        height: 6rem; }

@media screen and (max-width: 767px) {
  body.landscape .player-wrapper .player.live {
    position: static;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: auto;
    z-index: auto; } }
@media screen and (max-width: 767px) {
  body.landscape .player-wrapper .live-title-sm {
    display: none; } }
body.landscape .player-wrapper .episode-wrapper .title-wrapper .reaction .reaction-slide {
  height: 6.7rem; }
@media screen and (max-width: 767px) {
  body.landscape .comment-wrapper {
    position: static; } }
@media (max-width: 767px) {
  body.landscape .comment-wrapper .x-login-btn {
    display: block; } }
@media screen and (max-width: 767px) {
  body.landscape .comment-wrapper .btn-wrapper {
    display: none; } }
@media screen and (max-width: 763px) {
  body.landscape .reaction .action-wrapper {
    display: block; } }
@media screen and (max-width: 763px) {
  body.landscape .reaction .action-wrapper.cheer {
    min-height: 4rem;
    min-width: 4rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center; } }
@media screen and (max-width: 763px) {
  body.landscape .reaction .action-wrapper .action-icon {
    margin: 0 auto .4rem; } }
@media screen and (max-width: 763px) {
  body.landscape .reaction .action-wrapper > span {
    font-size: 1rem;
    margin-right: 0; } }
@media screen and (max-width: 767px) {
  body.landscape .episode-wrapper {
    padding-top: 0;
    display: block; } }
@media screen and (max-width: 767px) {
  body.landscape .episode-wrapper .x-side {
    display: none; } }
@media screen and (max-width: 767px) {
  body.landscape .live-side-table {
    width: 35%;
    display: block;
    pointer-events: auto;
    height: auto !important;
    padding-top: 0; } }
@media screen and (max-width: 767px) {
  body.landscape .x-side {
    display: block;
    margin-right: 1.4rem; } }
@media screen and (max-width: 767px) {
  body.landscape .vod-player,
  body.landscape .live-player {
    margin-bottom: 5rem; } }
@media screen and (max-width: 767px) {
  body.landscape .vod-player .x-wrapper,
  body.landscape .live-player .x-wrapper {
    background-color: rgba(255, 255, 255, 0.2);
    flex-grow: 1;
    overflow: hidden;
    overflow-y: scroll;
    height: 28rem;
    margin-top: 0; } }
@media screen and (max-height: 400px) and (max-width: 896px) {
  body.landscape .vod-player .x-wrapper,
  body.landscape .live-player .x-wrapper {
    height: 32rem; } }
@media screen and (max-width: 767px) {
  body.landscape .vod-player .x-wrapper .x-inner .tweet-box .tweet-text .name,
  body.landscape .live-player .x-wrapper .x-inner .tweet-box .tweet-text .name {
    display: block; } }
@media screen and (max-width: 767px) {
  body.landscape .live-player {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; } }
@media screen and (max-width: 767px) {
  body.landscape .live-player .player-wrapper {
    width: 70%; } }
@media (max-width: 767px) {
  body.landscape .live-player .player-wrapper .episode-wrapper {
    padding-top: 0;
    display: block; } }
@media (max-width: 767px) {
  body.landscape .live-player .player-wrapper .episode-wrapper .title-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    -moz-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between; } }
@media screen and (max-width: 767px) {
  body.landscape .live-player .player-wrapper .episode-wrapper .title-wrapper .reaction {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: flex-start;
    -webkit-align-items: flex-start;
    -moz-box-align: flex-start;
    -ms-flex-align: flex-start;
    align-items: flex-start;
    margin-left: 1.5rem; } }

.mylist-tab {
  margin-bottom: 2rem; }
  @media (min-width: 768px) {
    .mylist-tab {
      margin-bottom: 3.2rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  @media (max-width: 767px) {
    .mylist-tab .delete-wrapper {
      margin-bottom: 2rem;
      text-align: right; } }
  @media (min-width: 768px) {
    .mylist-tab .delete-wrapper {
      margin-left: auto; } }
  .mylist-tab .delete-wrapper div > .btn {
    cursor: pointer; }
  .mylist-tab .delete-wrapper .select-mode,
  .mylist-tab .delete-wrapper .delete-mode {
    display: none; }
    .mylist-tab .delete-wrapper .select-mode .cancel-link,
    .mylist-tab .delete-wrapper .delete-mode .cancel-link {
      margin-right: 2rem;
      cursor: pointer; }
      .mylist-tab .delete-wrapper .select-mode .cancel-link:hover,
      .mylist-tab .delete-wrapper .delete-mode .cancel-link:hover {
        text-decoration: underline; }
  .mylist-tab .delete-wrapper.is-delete-mode .select-mode {
    display: none; }
  .mylist-tab .delete-wrapper.is-delete-mode .delete-mode {
    display: block; }
  .mylist-tab .delete-wrapper.is-select-mode .select-mode {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .mylist-tab .delete-wrapper.is-select-mode .delete-mode {
    display: none; }

.actor-list-wrapper {
  margin-top: 2.4rem;
  margin-bottom: 5rem; }
  @media (max-width: 767px) {
    .actor-list-wrapper {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (min-width: 768px) {
    .actor-list-wrapper {
      padding-right: 5.4%;
      padding-left: 5.4%; } }
  @media (min-width: 897px) and (max-width: 1440px) {
    .actor-list-wrapper {
      padding-right: 7.4%;
      padding-left: 7.4%; } }
  @media (min-width: 1441px) {
    .actor-list-wrapper {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; } }
  @media (min-width: 768px) {
    .actor-list-wrapper {
      margin-top: 4rem;
      margin-bottom: 7rem; } }
  .actor-list-wrapper .actor:nth-of-type(even) .actor-line {
    background-color: #f5f8fb; }
    .actor-list-wrapper .actor:nth-of-type(even) .actor-line:focus, .actor-list-wrapper .actor:nth-of-type(even) .actor-line:hover {
      background-color: #edf2f7; }
  .actor-list-wrapper .actor-line {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 1px #d4d7d9 solid;
    padding: 1rem;
    cursor: pointer;
    position: relative;
    transition: background-color 0.3s ease; }
    @media (min-width: 768px) {
      .actor-list-wrapper .actor-line {
        padding-right: 3.6rem; } }
    .actor-list-wrapper .actor-line::after {
      content: "\e906";
      font-family: "animax" !important;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 1rem;
      margin: auto;
      height: 1.5rem;
      font-size: 1rem;
      transition: transform 0.3s ease; }
    .actor-list-wrapper .actor-line > span {
      font-size: 2rem; }
      @media (min-width: 768px) {
        .actor-list-wrapper .actor-line > span {
          font-size: 2.6rem; } }
    .actor-list-wrapper .actor-line:focus, .actor-list-wrapper .actor-line:hover {
      background-color: #edf2f7; }
  .actor-list-wrapper .actor:not(:last-child) .actor-line {
    border-bottom: none; }
  .actor-list-wrapper .actor-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    flex-grow: 1;
    overflow: hidden;
    height: 0;
    opacity: 0;
    transition: height 0.3s ease, opacity 0.3s ease; }
    .actor-list-wrapper .actor-list .actor-card {
      box-sizing: border-box;
      padding: .45rem;
      width: 33.3333333333%; }
      @media (min-width: 897px) {
        .actor-list-wrapper .actor-list .actor-card {
          width: 25%;
          padding: .8rem; } }
      @media (min-width: 1024px) {
        .actor-list-wrapper .actor-list .actor-card {
          width: 20%; } }
      .actor-list-wrapper .actor-list .actor-card > a:hover {
        text-decoration: none !important; }
  .actor-list-wrapper .actor.open .actor-line {
    border-bottom: 1px #d4d7d9 solid; }
    .actor-list-wrapper .actor.open .actor-line::after {
      transform: rotate(-180deg); }
  .actor-list-wrapper .actor.open .actor-list {
    height: auto;
    opacity: 1;
    padding: .9rem 0 3rem;
    margin: -.45rem; }
    @media (min-width: 768px) {
      .actor-list-wrapper .actor.open .actor-list {
        padding: 1.6rem 0 5rem;
        margin: -.8rem; } }

.contentTitle .feature-page-mainVisual {
  border-bottom: 1px #d4d7d9 solid; }
  .contentTitle .feature-page-mainVisual > *:last-child:not(.feature-page-mainVisual-thumbnail) {
    padding-bottom: 2.4rem; }
    @media (min-width: 897px) {
      .contentTitle .feature-page-mainVisual > *:last-child:not(.feature-page-mainVisual-thumbnail) {
        padding-bottom: 4rem; } }
  .contentTitle .feature-page-mainVisual.has-thumbnail::before {
    content: "";
    background-color: #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    z-index: -1; }
  .contentTitle .feature-page-mainVisual .page-title {
    margin-bottom: 0; }
  .contentTitle .feature-page-mainVisual .text {
    margin-top: 2rem;
    text-shadow: 1px 1px 0 rgba(5, 45, 90, 0.5); }
  .contentTitle .feature-page-mainVisual .btn-wrapper {
    margin-top: 2rem; }
    @media (max-width: 767px) {
      .contentTitle .feature-page-mainVisual .btn-wrapper {
        margin-right: 1.4rem;
        margin-left: 1.4rem; } }
    @media (min-width: 768px) {
      .contentTitle .feature-page-mainVisual .btn-wrapper {
        margin-right: 5.4%;
        margin-left: 5.4%; } }
    @media (min-width: 897px) and (max-width: 1440px) {
      .contentTitle .feature-page-mainVisual .btn-wrapper {
        margin-right: 7.4%;
        margin-left: 7.4%; } }
    @media (min-width: 1441px) {
      .contentTitle .feature-page-mainVisual .btn-wrapper {
        max-width: 1200px;
        margin-right: auto;
        margin-left: auto; } }
  .contentTitle .feature-page-mainVisual-thumbnail {
    position: relative;
    overflow: hidden; }
    .contentTitle .feature-page-mainVisual-thumbnail > img {
      display: block;
      width: 100%;
      height: auto;
      margin: auto;
      max-width: 80rem;
      position: relative; }
    .contentTitle .feature-page-mainVisual-thumbnail > .blur {
      -webkit-filter: blur(7px);
      -moz-filter: blur(7px);
      -o-filter: blur(7px);
      -ms-filter: blur(7px);
      filter: blur(7px);
      max-width: initial;
      transform: scale(1.3);
      opacity: 0.3;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover; }
    .contentTitle .feature-page-mainVisual-thumbnail + .page-title {
      color: #555555;
      text-shadow: none; }
      .contentTitle .feature-page-mainVisual-thumbnail + .page-title + .text {
        color: #555555;
        text-shadow: none; }
  @media (max-width: 767px) {
    .contentTitle .feature-page-mainVisual > .text {
      padding-right: 1.4rem;
      padding-left: 1.4rem; } }
  @media (min-width: 768px) {
    .contentTitle .feature-page-mainVisual > .text {
      padding-right: 5.4%;
      padding-left: 5.4%; } }
  @media (min-width: 897px) and (max-width: 1440px) {
    .contentTitle .feature-page-mainVisual > .text {
      padding-right: 7.4%;
      padding-left: 7.4%; } }
  @media (min-width: 1441px) {
    .contentTitle .feature-page-mainVisual > .text {
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; } }

.feature-page-wrapper .h3-title {
  color: #0076f8; }
.feature-page-wrapper .feature-page-row + .feature-row,
.feature-page-wrapper .feature-page-row + .broadcast-row,
.feature-page-wrapper .feature-page-row + .movieGrid-row {
  border-top: 1px #d4d7d9 solid; }
.feature-page-wrapper .feature-page-row {
  padding-bottom: 4rem;
  padding-top: 4rem; }
  @media (min-width: 897px) {
    .feature-page-wrapper .feature-page-row {
      padding-bottom: 7rem;
      padding-top: 7rem; } }
  .feature-page-wrapper .feature-page-row:not(:first-child) {
    border-top: 1px #d4d7d9 solid; }
.feature-page-wrapper .feature-page-row {
  text-align: center; }
  .feature-page-wrapper .feature-page-row .feature-page-title, .feature-page-wrapper .feature-page-row .text, .feature-page-wrapper .feature-page-row .title {
    text-align: left; }
  .feature-page-wrapper .feature-page-row .feature-page-title {
    font-size: 2rem;
    font-weight: normal;
    color: #0076f8;
    margin-bottom: 1.5rem; }
    @media (min-width: 897px) {
      .feature-page-wrapper .feature-page-row .feature-page-title {
        margin-bottom: 2rem;
        font-size: 2.6rem; } }
  .feature-page-wrapper .feature-page-row .title {
    font-size: 2rem; }
  .feature-page-wrapper .feature-page-row > * + p {
    margin-top: 2rem; }
  .feature-page-wrapper .feature-page-row > div .feature-page-text {
    width: 100%; }
    @media (max-width: 896px) {
      .feature-page-wrapper .feature-page-row > div .feature-page-text {
        order: 1; } }
    .feature-page-wrapper .feature-page-row > div .feature-page-text h4 {
      font-size: 1.6rem;
      margin-bottom: 1rem;
      text-align: left; }
    .feature-page-wrapper .feature-page-row > div .feature-page-text p + h4 {
      margin-top: 3rem; }
    .feature-page-wrapper .feature-page-row > div .feature-page-text * + .button {
      margin-top: 3.2rem; }
    .feature-page-wrapper .feature-page-row > div .feature-page-text .button {
      display: inline-block;
      min-width: 10rem;
      padding: 1.5rem 4rem;
      text-align: center;
      box-sizing: border-box;
      background-color: #fff;
      border: 1px #0076f8 solid;
      color: #0076f8;
      border-radius: 4px;
      transition: all 0.3s ease;
      box-shadow: 0 5px 17px rgba(195, 229, 235, 0.6); }
      .feature-page-wrapper .feature-page-row > div .feature-page-text .button:hover {
        text-decoration: none !important;
        box-shadow: none; }
  .feature-page-wrapper .feature-page-row > div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex; }
    @media (max-width: 896px) {
      .feature-page-wrapper .feature-page-row > div {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; } }
    @media (min-width: 897px) {
      .feature-page-wrapper .feature-page-row > div .feature-page-text + .feature-page-thumbnail {
        flex-shrink: 0;
        width: 40%; } }
    @media (max-width: 896px) {
      .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail {
        margin: 0 auto 3rem; } }
    .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item {
      position: relative; }
      .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item > img {
        width: 100%;
        display: block; }
        .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item > img + img {
          margin-top: 1rem; }
      .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item .tag {
        position: absolute;
        top: 0;
        left: 0;
        background-color: #0076f8;
        color: #fff;
        padding: 0.6rem .9rem;
        border-radius: 2rem;
        font-size: 1.4rem;
        line-height: 2rem;
        font-weight: bold;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border: 1px #fff solid;
        border-left: none; }
        @media (min-width: 897px) {
          .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item .tag {
            font-size: 1.6rem;
            padding: 0.8rem 1rem; } }
        .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item .tag.tvod-tag {
          background-color: #f2106f; }
          .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item .tag.tvod-tag i {
            background: transparent;
            padding: 0;
            border-radius: initial;
            font-size: 1.8rem;
            height: auto;
            width: auto; }
            @media (min-width: 897px) {
              .feature-page-wrapper .feature-page-row > div .feature-page-thumbnail-item .tag.tvod-tag i {
                font-size: 2rem; } }
  .feature-page-wrapper .feature-page-row.movie > div .feature-page-thumbnail {
    width: 60%;
    overflow: hidden;
    border-radius: 6px; }
    .feature-page-wrapper .feature-page-row.movie > div .feature-page-thumbnail .feature-page-thumbnail-item {
      position: relative;
      transition: transform 0.3s ease;
      cursor: pointer; }
      .feature-page-wrapper .feature-page-row.movie > div .feature-page-thumbnail .feature-page-thumbnail-item:hover {
        -webkit-transform: scale(1.03);
        -moz-transform: scale(1.03);
        -ms-transform: scale(1.03);
        -o-transform: scale(1.03);
        transform: scale(1.03); }
      .feature-page-wrapper .feature-page-row.movie > div .feature-page-thumbnail .feature-page-thumbnail-item .play {
        position: absolute;
        bottom: 1rem;
        right: 1rem;
        width: 20%; }
  @media (min-width: 897px) {
    .feature-page-wrapper .feature-page-row:not(.text-base):nth-of-type(odd) > div:not(.btn-wrapper) {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -webkit-flex-direction: row-reverse;
      -moz-box-orient: horizontal;
      -moz-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }
  @media (max-width: 896px) {
    .feature-page-wrapper .feature-page-row:not(.text-base):nth-of-type(odd) .feature-page-thumbnail {
      margin: 0 auto 3rem; } }
  @media (min-width: 897px) {
    .feature-page-wrapper .feature-page-row:not(.text-base):nth-of-type(odd) .feature-page-thumbnail {
      margin-right: 3rem; } }
  .feature-page-wrapper .feature-page-row:not(.text-base):nth-of-type(even) {
    background-color: #f8f8f9; }
    @media (max-width: 896px) {
      .feature-page-wrapper .feature-page-row:not(.text-base):nth-of-type(even) .feature-page-thumbnail {
        margin-bottom: 3rem; } }
    @media (min-width: 897px) {
      .feature-page-wrapper .feature-page-row:not(.text-base):nth-of-type(even) .feature-page-thumbnail {
        margin-left: 3rem; } }
  .feature-page-wrapper .feature-page-row > .btn-wrapper {
    margin-top: 3rem;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    @media (max-width: 767px) {
      .feature-page-wrapper .feature-page-row > .btn-wrapper {
        padding-right: 1.4rem;
        padding-left: 1.4rem; } }
    @media (min-width: 768px) {
      .feature-page-wrapper .feature-page-row > .btn-wrapper {
        padding-right: 5.4%;
        padding-left: 5.4%; } }
    @media (min-width: 897px) and (max-width: 1440px) {
      .feature-page-wrapper .feature-page-row > .btn-wrapper {
        padding-right: 7.4%;
        padding-left: 7.4%; } }
    @media (min-width: 1441px) {
      .feature-page-wrapper .feature-page-row > .btn-wrapper {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto; } }
    @media (max-width: 767px) {
      .feature-page-wrapper .feature-page-row > .btn-wrapper {
        padding-left: 1.4rem;
        padding-right: 1.4rem; } }
    @media (min-width: 768px) and (max-width: 896px) {
      .feature-page-wrapper .feature-page-row > .btn-wrapper {
        padding-left: 5.4%;
        padding-right: 5.4%; } }
    .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box {
      max-width: 44rem; }
      @media (max-width: 767px) {
        .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box {
          margin: auto;
          width: 100%; } }
      @media (max-width: 767px) {
        .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box + .btn-box {
          margin-top: 1.5rem; } }
      @media (min-width: 768px) {
        .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box + .btn-box {
          margin-left: 2rem; } }
      .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn {
        width: 100%; }
        .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn > span {
          display: block; }
          .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn > span.price-text {
            font-size: 1.4rem; }
            @media (min-width: 897px) {
              .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn > span.price-text {
                font-size: 1.6rem; } }
          .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn > span.price {
            margin-top: .5rem; }
            .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn > span.price > span {
              font-size: 1.8rem; }
              @media (min-width: 897px) {
                .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn > span.price > span {
                  font-size: 2rem; } }
        .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn .bg-red {
          border: 1px #fff solid;
          background: #f2106f;
          color: #fff;
          font-size: 1.2rem !important;
          font-weight: bold;
          padding: .5rem 1rem;
          border-radius: 28px;
          margin-right: .5rem;
          vertical-align: .3rem;
          display: inline-block; }
        .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn.secondary-color .bg-red {
          background: #fff;
          color: #f2106f; }
        .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box .btn + div {
          margin-top: 1rem; }
      .feature-page-wrapper .feature-page-row > .btn-wrapper .btn-box > div {
        font-size: 1.2rem; }
.feature-page-wrapper .event-wrapper {
  padding-top: 3rem;
  padding-bottom: 3rem; }
  @media (min-width: 897px) {
    .feature-page-wrapper .event-wrapper {
      padding-top: 4rem;
      padding-bottom: 4rem; } }
  @media (max-width: 896px) {
    .feature-page-wrapper .event-wrapper .d-flex {
      display: block; } }
  @media (min-width: 897px) {
    .feature-page-wrapper .event-wrapper .d-flex {
      -webkit-box-align: baseline;
      -webkit-align-items: baseline;
      -moz-box-align: baseline;
      -ms-flex-align: baseline;
      align-items: baseline; } }
  @media (min-width: 897px) {
    .feature-page-wrapper .event-wrapper .event-detail {
      width: 65%; } }
  .feature-page-wrapper .event-wrapper .event-detail h2 {
    font-weight: normal;
    font-size: 2rem;
    margin-bottom: 1.5rem; }
    @media (min-width: 897px) {
      .feature-page-wrapper .event-wrapper .event-detail h2 {
        margin-bottom: 2rem;
        font-size: 2.6rem; } }
  .feature-page-wrapper .event-wrapper .event-detail p + p {
    margin-top: 1.5rem; }
  .feature-page-wrapper .event-wrapper .event-detail p + h3 {
    margin-top: 2rem; }
    @media (min-width: 897px) {
      .feature-page-wrapper .event-wrapper .event-detail p + h3 {
        margin-top: 3rem; } }
  .feature-page-wrapper .event-wrapper .event-detail h3 {
    font-weight: normal;
    font-size: 1.6rem;
    margin-bottom: 1rem;
    border-bottom: 1px #d4d7d9 solid; }
    @media (min-width: 897px) {
      .feature-page-wrapper .event-wrapper .event-detail h3 {
        font-size: 2rem; } }
  .feature-page-wrapper .event-wrapper .event-detail ul {
    padding-left: 2rem; }
    .feature-page-wrapper .event-wrapper .event-detail ul li {
      list-style: disc; }
      .feature-page-wrapper .event-wrapper .event-detail ul li:not(:last-child) {
        margin-bottom: .5rem; }
  .feature-page-wrapper .event-wrapper .event-price {
    padding: 1.5rem;
    border: 1px solid #d4d7d9; }
    @media (max-width: 896px) {
      .feature-page-wrapper .event-wrapper .event-price {
        margin-top: 3rem; } }
    @media (min-width: 897px) {
      .feature-page-wrapper .event-wrapper .event-price {
        padding: 2rem;
        width: 35%;
        margin-left: 3rem; } }
    .feature-page-wrapper .event-wrapper .event-price dl dt {
      font-size: 1.4rem;
      font-weight: bold;
      margin-bottom: .5rem; }
      @media (min-width: 897px) {
        .feature-page-wrapper .event-wrapper .event-price dl dt {
          font-size: 1.6rem; } }
    .feature-page-wrapper .event-wrapper .event-price dl dd {
      font-size: 1.4rem;
      padding-left: 1rem; }
      @media (min-width: 897px) {
        .feature-page-wrapper .event-wrapper .event-price dl dd {
          font-size: 1.6rem; } }
      .feature-page-wrapper .event-wrapper .event-price dl dd:not(:last-child) {
        margin-bottom: 2rem; }
      .feature-page-wrapper .event-wrapper .event-price dl dd > span {
        display: block; }
        .feature-page-wrapper .event-wrapper .event-price dl dd > span:not(:last-child) {
          margin-bottom: .3rem; }
      .feature-page-wrapper .event-wrapper .event-price dl dd .small-text {
        font-size: 1.2rem; }
      .feature-page-wrapper .event-wrapper .event-price dl dd .line-through {
        text-decoration: line-through; }
      .feature-page-wrapper .event-wrapper .event-price dl dd .red-color {
        color: #f2106f; }
      .feature-page-wrapper .event-wrapper .event-price dl dd .bg-red {
        background: #f2106f;
        color: #fff;
        padding: .2rem .5rem 0;
        font-size: 1.4rem; }
      .feature-page-wrapper .event-wrapper .event-price dl dd p {
        font-size: 1.4rem; }
  .feature-page-wrapper .event-wrapper .btn-wrapper {
    text-align: center;
    margin-top: 3rem; }
    @media (min-width: 897px) {
      .feature-page-wrapper .event-wrapper .btn-wrapper {
        margin-top: 4rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; } }
    .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box {
      max-width: 44rem; }
      @media (max-width: 896px) {
        .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box {
          margin: auto; } }
      @media (max-width: 896px) {
        .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box + .btn-box {
          margin-top: 1.5rem; } }
      @media (min-width: 897px) {
        .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box + .btn-box {
          margin-left: 2rem; } }
      .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box .btn > span {
        display: block; }
        .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box .btn > span.price-text {
          font-size: 1.6rem; }
          @media (min-width: 897px) {
            .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box .btn > span.price-text {
              font-size: 1.8rem; } }
      .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box .btn + div {
        margin-top: 1rem;
        text-shadow: 0 0 3px white; }
      .feature-page-wrapper .event-wrapper .btn-wrapper .btn-box > div {
        font-size: 1.2rem; }
  .feature-page-wrapper .event-wrapper .svod-wrapper {
    text-align: center;
    padding-top: 3.2rem;
    margin-top: 3.2rem;
    border-top: 1px #d4d7d9 solid; }
    @media (min-width: 897px) {
      .feature-page-wrapper .event-wrapper .svod-wrapper {
        padding-top: 6rem;
        margin-top: 6rem; } }
    .feature-page-wrapper .event-wrapper .svod-wrapper .title {
      font-size: 1.8rem;
      font-weight: bold; }
      @media (min-width: 897px) {
        .feature-page-wrapper .event-wrapper .svod-wrapper .title {
          font-size: 2.2rem; } }
    .feature-page-wrapper .event-wrapper .svod-wrapper .btn-box {
      margin-top: 3rem; }
      @media (min-width: 897px) {
        .feature-page-wrapper .event-wrapper .svod-wrapper .btn-box .btn {
          font-size: 1.8rem; } }

.feature-page-wrapper + .grid-row,
.feature-page-wrapper + .carousel-row {
  border-top: 1px #d4d7d9 solid; }

.faq {
  margin-top: 2.4rem;
  margin-bottom: 5rem; }
  @media (min-width: 768px) {
    .faq {
      margin-top: 4rem;
      margin-bottom: 7rem; } }
  .faq-item {
    border-bottom: 1px #d4d7d9 solid; }
    .faq-item:not(:last-child) {
      margin-bottom: 1rem; }
  .faq-title {
    position: relative;
    padding: 1.5rem 4rem;
    cursor: pointer;
    transition: background-color 0.3s ease; }
    .faq-title:focus, .faq-title:hover {
      background-color: #f6f7f9; }
    .faq-title::before {
      content: "Q.";
      position: absolute;
      top: 1.2rem;
      left: 1rem;
      font-size: 1.8rem;
      color: #0076f8; }
    .faq-title::after {
      content: "\e906";
      font-family: "animax" !important;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 1rem;
      margin: auto;
      height: 1.5rem;
      font-size: 1rem; }
  .faq-text {
    position: relative;
    padding: 0 4rem;
    transition: all 0.3s ease;
    overflow: hidden;
    height: 0;
    opacity: 0;
    background-color: #f6f7f9; }
    .faq-text::before {
      content: "A.";
      position: absolute;
      top: 1.2rem;
      left: 1rem;
      font-size: 1.8rem;
      color: #8c9395;
      opacity: 0;
      transition: opacity 0.3s ease; }
  .faq .faq-item.open .faq-text {
    height: auto;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    opacity: 1; }
    .faq .faq-item.open .faq-text::before {
      opacity: 1; }

.terms {
  margin-top: 2.4rem;
  margin-bottom: 5rem; }
  @media (min-width: 768px) {
    .terms {
      margin-top: 4rem;
      margin-bottom: 7rem; } }
  .terms .terms-wrapper {
    padding-top: 5rem; }
    @media (min-width: 768px) {
      .terms .terms-wrapper {
        padding-top: 7rem; } }
  .terms-item + .terms-item {
    margin-top: 3rem; }
  .terms-item.date {
    text-align: right;
    color: #8c9395; }
  .terms-item > * {
    line-height: 1.7; }
  .terms-item > *:not(:last-child) {
    margin-bottom: 2rem; }
  .terms-item * + p {
    margin-top: 1rem; }
  .terms-item > h3 {
    font-size: 2rem;
    font-weight: normal;
    color: #0076f8; }
  .terms-item > h4 {
    font-size: 1.8rem;
    font-weight: normal;
    border-bottom: 1px #d4d7d9 solid; }
  .terms-item .small-text {
    font-size: 1rem; }
  .terms-item ul li:not(:last-child) {
    margin-bottom: 1rem; }
  .terms-item ul.number-list {
    padding-left: 2rem; }
    .terms-item ul.number-list li {
      list-style-type: decimal; }
      .terms-item ul.number-list li ul {
        padding-left: 2rem;
        margin-top: 1rem; }
        .terms-item ul.number-list li ul li {
          list-style-type: lower-latin; }
          .terms-item ul.number-list li ul li ul li {
            list-style-type: decimal; }

.privacy-anchor {
  margin-top: 2.4rem; }
  @media (min-width: 768px) {
    .privacy-anchor {
      margin-top: 4rem; } }
  .privacy-anchor .anchor-item {
    padding: 1rem 3rem 1rem 1.5rem;
    border: 1px #d4d7d9 solid;
    cursor: pointer;
    position: relative; }
    .privacy-anchor .anchor-item:not(:last-child) {
      margin-bottom: 1rem; }
    .privacy-anchor .anchor-item:hover {
      background-color: #f6f7f9; }
    .privacy-anchor .anchor-item::after {
      content: "\e906";
      font-family: "animax" !important;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 1rem;
      margin: auto;
      height: 1.5rem;
      font-size: 1rem; }

.error {
  text-align: center;
  padding-top: 9.5rem;
  padding-bottom: 9.5rem; }
  @media (min-width: 768px) {
    .error {
      padding-top: 13rem;
      padding-bottom: 13rem; } }
  .error.devices-error {
    padding-bottom: 0; }
  .error-title .error-img {
    width: auto;
    height: 8.8rem;
    display: block;
    margin: 0 auto 2rem;
    opacity: .5; }
    @media (min-width: 768px) {
      .error-title .error-img {
        height: 15rem; } }
    .error-title .error-img.sorry {
      height: 7.4rem; }
      @media (min-width: 768px) {
        .error-title .error-img.sorry {
          height: 13rem; } }
  .error-title > p {
    font-weight: 700;
    font-size: 2rem;
    color: #666; }
    @media (min-width: 768px) {
      .error-title > p {
        font-size: 3.2rem; } }
  .error-title .sorry + p {
    font-size: 2rem; }
  .error > *:not(:last-child) {
    margin-bottom: 3.4rem; }

.devices-list {
  margin-bottom: 5rem;
  margin-top: 4.2rem; }
  @media (min-width: 768px) {
    .devices-list {
      margin-top: 7.5rem;
      margin-bottom: 7rem; } }
  .devices-list .devices-item + .devices-item {
    margin-top: 4.2rem; }
  .devices-list .devices-item .devices-title {
    font-size: 1.6rem;
    border-bottom: 1px #d4d7d9 solid;
    margin-bottom: 1rem; }
    @media (min-width: 768px) {
      .devices-list .devices-item .devices-title {
        font-size: 1.8rem; } }

.maintenanceMode {
  text-align: center;
  height: 100vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  max-width: initial;
  background-color: #fafafa;
  min-height: 37rem; }
  @media (min-width: 768px) {
    .maintenanceMode {
      min-height: 50rem; } }
  .maintenanceMode-copyright {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 1rem;
    font-size: 1.2rem;
    color: #8c9395;
    box-sizing: border-box; }
  .maintenanceMode-img {
    max-width: 39rem;
    width: 90%; }
    @media (min-width: 768px) {
      .maintenanceMode-img {
        width: 100%; } }
  .maintenanceMode-title {
    font-size: 1.8rem;
    margin: 3rem 0; }
    @media (min-width: 768px) {
      .maintenanceMode-title {
        font-size: 2rem;
        margin: 4rem 0 3rem; } }
  .maintenanceMode-text {
    line-height: 1.8;
    margin-top: 3rem; }
    @media (min-width: 768px) {
      .maintenanceMode-text {
        margin-top: 4rem; } }
  .maintenanceMode-date {
    margin: 0 auto;
    border: 1px #f2106f solid;
    max-width: 30rem;
    padding: .5rem .5rem 1rem;
    font-weight: bold;
    color: #f2106f; }
    @media (min-width: 768px) {
      .maintenanceMode-date {
        max-width: 35rem; } }
    .maintenanceMode-date > span {
      color: #fff;
      background-color: #f2106f;
      display: block;
      margin-bottom: 1rem;
      padding: .5rem;
      font-size: 1.2rem; }

/*# sourceMappingURL=application.css.map */