@font-face {
  font-family: "Original Yu Gothic";
  src: local("Yu Gothic");
  font-weight: 300;
}
@font-face {
  font-family: "Original Yu Gothic";
  src: local("Yu Gothic");
  font-weight: 500;
}
@font-face {
  font-family: "Original Yu Gothic";
  src: local("Yu Gothic");
  font-weight: bold;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}

/* @see http://qiita.com/RinoTsuka/items/4181efd43d072e246519 */
@define-mixin font-gothic {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;

  @media all and (-ms-high-contrast: none) {
    font-family: Verdana, Meiryo, sans-serif;
  }
  @media all and (-ms-high-contrast: active) {
    font-family: Verdana, Meiryo, sans-serif;
  }
}

@define-mixin font-numeric {
  font-family: arial, sans-serif;
}

@define-mixin font-common-header {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

@define-mixin font-button {
  @mixin font-gothic;
  letter-spacing: .1em;
}

@define-mixin font-question-description {
  @mixin font-gothic;
  letter-spacing: .05em;
}

@define-mixin animation-hover {
  transition: all .2s;

  /**
   * これをいれないとSafariでサイズや色が一瞬ちらつく
   * see: http://www.skyguild.jp/2017/10/safari-transition.html
   */
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}

@keyframes _0d2e3411d80d071341a6c6de82b46030 {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }

  10% {
    transform: perspective(400px) rotate3d(1, 0, 0, 50deg);
    opacity: 0.5;
  }

  to {
    transform: perspective(400px);
  }
}

@define-mixin ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}



:root {
  --main-color: #000000;
  --accent-color: #e4eb12;
  --accent-color-hover: #cdd310;
  --accent-color-disabled: #909327;
  --modal-overlay-black: rgba(0, 0, 0, .7);
  --slide-menu-overlay-black: rgba(0, 0, 0, .5);
  --watch-modal-header-white-disabled: #6C6C6C;

  --white: #ffffff;
  --white-disabled: #9D9D9D;
  --black: #000000;
  --black-hover: #4D4D4D;
  --black-disabled: #3D3E2E;
  --black-hover: #4D4D4D;
  --play-black: #272727;
  --gray: #484848;
  --light-gray: #ebebeb;
  --red: #f6001d;
  --light-red: #feebed;
  --light-yellow: #fcfde7;

  --twitter: #0694E3;
  --twitter-hover: #65BDF0;
  --twitter-disabled: #265E7E;
  --facebook: #3B579D;
  --facebook-hover: #6B80B7;
  --facebook-disabled: #3D4C6C;
  --line: #00BB00;
  --line-hover: #61D860;
  --line-disabled: #236E23;

  --logo-white: #fff;
  --logo-gray: #b2b2b2;
  --logo-dark-gray: #515151;

  --optional-label-gray: #afafaf;
  --placeholder-gray: #b2b2b2;

  --validation-error-red: #FF4F5E;
}

:root {
  /* 参考: 共通ヘッダz-index: 100000〜102000辺り */

  --modal-layer: 115000;
  --modal-layer-px: 115000px;

  /* TODO: 旧ヘッダなので消す */
  --common-header-layer: 14000;
  --common-header-layer-px: 14000px;

  --slide-menu-layer: 15000;
  --hint-tooltip-layer: 100;
  --operator-comment-layer: 13700;

  --watch-modal-layer: 13500;
  --watch-player-layer: 13550;
  --watch-modal-close-button-layer: 13600;
  /* ランドスケープ時は共通ヘッダより上に表示する */
  --watch-modal-landscape-layer: 114500;
  --watch-player-landscape-layer: 113550;
  --watch-modal-landscape-close-button-layer: 114600;

  --sp-reward-message-panel-layer: 13560;

  --play-background-cover-layer: 1;
  --play-end-message-layer: 2;
}

:root {
  --common-header-height: 36px;
  --header-width: 1160px;
  --header-height: 72px;
  --footer-height: 110px;
  --sp-footer-height: 81px;

  --sp-common-header-height: 44px;
}



body {
  @mixin font-gothic;
  margin: 0;
}

/* bodyへの指定だけではuser agent stylesheetに詳細度で負けるため明示的に指定する */
button,
textarea,
select,
input {
  @mixin font-gothic;
}

._8f31a53b8c83bad4b80e8d9b90c1ec61 {
  @mixin animation-hover;
  display: inline-block;
  width: 262px;
  height: 52px;
  padding: 0;
  background-color: var(--black);
  box-sizing: border-box;
  outline: none;
  border: none;
  border-radius: 0;
  cursor: pointer;
  overflow: visible;

  & .cc669960933efcf76886a96cda2c8055 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;

    & ._74f77be0b4ea77044473f41ff41e2157 {
      margin-right: 12px;
      width: 20px;
      height: 20px;
      background: url(/assets_pack/icon_add_white-0c3829b7cee09a50a323d13588af374d.svg) no-repeat center;
      background-size: contain;
    }

    & .d175965229dcff49a8c0e9356671d0ce {
      color: var(--white);
      font-size: 18px;
      padding-right: 32px; /* icon: 20px + margin: 12px */
      letter-spacing: .24em;
    }
  }

  &:hover {
    background-color: var(--gray);
  }
}

._10919588a7dc2a9e56c85dba356f8988 {
  @mixin animation-hover;
  display: inline-block;
  width: 430px;
  height: 74px;
  padding: 0;
  background-color: var(--accent-color);
  box-sizing: border-box;
  outline: none;
  border: none;
  border-radius: 0;
  cursor: pointer;
  overflow: visible;

  & ._0c5d438bedbf7f45438e9cd2cead89e7 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;

    & ._2c38cbf2d0f06acbcef5d1bf3415df05 {
      position: absolute;
      bottom: 18px;
      left: 34px;
      width: 66px;
      height: 81px;
      background: url(/assets_pack/icon_create-190367b0a66f09a9f0dba23bb19f7832.svg) no-repeat center;
      background-size: contain;
    }

    & .f7095c78a7f63c7d06578ced0194930c {
      width: 100%;
      height: 23px;
      background: no-repeat center center;
      background-size: contain;

      &._0cc5158a4785ddbed1cf2e4d083aef26 {
        background-image: url(/assets_pack/txt_create_black-67478b9e6cf622365f3791cb5c7eb286.svg);
      }

      &.ff6860fb45b389768ccc50aa989e6df0 {
        background-image: url(/assets_pack/txt_create_liveq_black-445e177e0f302b8778f8c771c86576a2.svg);
      }
    }
  }

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

._10919588a7dc2a9e56c85dba356f8988._4b830fe69fec261e15d9b6b2768f9336 {
  width: 295px;
  height: 59px;

  & ._0c5d438bedbf7f45438e9cd2cead89e7 {
    & ._2c38cbf2d0f06acbcef5d1bf3415df05 {
      left: 52px;
      bottom: 12px;
      width: 28px;
      height: 35px;
    }

    & .f7095c78a7f63c7d06578ced0194930c {
      width: 100px;
      height: 17px;
    }
  }
}

._10919588a7dc2a9e56c85dba356f8988._3f1f5b11611ae9aee4f76a1045a0d03a {
  background-color: var(--light-gray);
  opacity: .5;
}

._24de06afb06afb829867428db038cae8 {
  padding: 0;
  outline: none;
  border: none;
  background-color: transparent;
  cursor: pointer;

  & ._6a3078b3b91054fc3e91a1722a400c4b {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer;

    & .c1d9a6dfce6ed0d0e11198afedfa4cad {
      margin-right: 8px;
      width: 16px;
      height: 16px;
      background: url(/assets_pack/icon_cross_black-7a49bc9a1cf5e31615069cda3fd04daa.svg) no-repeat 0 0;
      background-size: contain;
    }

    & ._02ebd094e06632ed0b9f53cec3e3665f {
      font-size: 14px;
      font-weight: bold;
      line-height: 1.4;
    }
  }
}

._24de06afb06afb829867428db038cae8._4b1931bb18e403e2a0ac5aa40942f8b4 {
  & ._6a3078b3b91054fc3e91a1722a400c4b {
    & .c1d9a6dfce6ed0d0e11198afedfa4cad {
      margin-right: 4px;
      width: 11px;
      height: 10px;
    }

    & ._02ebd094e06632ed0b9f53cec3e3665f {
      width: 32px;
      font-size: 11px;
      line-height: 1;
    }
  }
}

._98b5c51ce9192f671bc74300b48fe08b {
  @mixin animation-hover;
  display: inline-block;
  width: 198px;
  height: 48px;
  padding: 0;
  background-color: var(--accent-color);
  box-sizing: border-box;
  outline: none;
  border: none;
  border-radius: 0;
  cursor: pointer;
  overflow: visible;

  & ._1feab8cc2cb4d753f7ebaac367de0bd3 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;

    & ._01c39cdcd1d0aab4fec826dd2b1d17be {
      position: absolute;
      top: 11px;
      left: 16px;
      width: 21px;
      height: 26px;
      background: url(/assets_pack/icon_create-190367b0a66f09a9f0dba23bb19f7832.svg) no-repeat center;
      background-size: contain;
    }

    & .c6d507333d408a956676bd6fc29529f7 {
      width: 100%;
      height: 23px;
      font-size: 15px;
      font-weight: bold;
      letter-spacing: .1em;
    }
  }

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

._9cac5ac81ab34fa7cabd350427e7679b {
  @mixin font-button;
  @mixin animation-hover;
  display: inline-block;
  position: relative;
  width: 216px;
  height: 48px;
  line-height: 48px;
  background-color: var(--accent-color);
  border: 0;
  border-radius: 0;
  color: var(--black);
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  outline: 0;

  &:hover {
    background-color: var(--accent-color-hover);
  }

  &[disabled] {
    background-color: var(--light-gray);
    color: #aaa;
    cursor: not-allowed;
  }
}

._9cac5ac81ab34fa7cabd350427e7679b.db5633f7c13f5e21e9f60785399b2c7f {
  color: var(--black-disabled);
  background-color: var(--accent-color-disabled);
}

._1e13b7bd36b6bf9afe9ee368d6080048 {
  @mixin font-button;
  @mixin animation-hover;
  position: relative;
  width: 216px;
  height: 48px;
  background-color: var(--accent-color);
  border: 0;
  border-radius: 0;
  color: var(--black);
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  outline: 0;

  &:hover {
    background-color: var(--accent-color-hover);
  }

  &[disabled] {
    background-color: var(--light-gray);
    color: #aaa;
    cursor: not-allowed;

    & ._18cc520c197d022ac56d906f28f2862a {
      opacity: .4;
    }
  }

  & ._86e08a54d100c5a072887908338aae7a {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -20px;
    margin-top: -20px;
  }
}

._1e13b7bd36b6bf9afe9ee368d6080048._48d5a1a375955049d60924bbd92ff3b8 {
  color: var(--black-disabled);
  background-color: var(--accent-color-disabled);
}

._1e13b7bd36b6bf9afe9ee368d6080048._3b482c3baf1c0b65d4cf0cfe01aee5f0 {
  color: var(--black);
  background-color: var(--light-gray);
}

._49550f65a8bc66fc033a8c21a0d57441 {
  @mixin animation-hover;
  width: 156px;
  height: 43px;
  color: var(--black);
  background-color: var(--accent-color);
  box-sizing: border-box;
  cursor: pointer;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

._49550f65a8bc66fc033a8c21a0d57441._5187cff250baa015444baf7814528e6b {
  width: 104px;
  height: 30px;
  padding: 0;
  color: var(--white);
  background-color: var(--play-black);
  border-radius: 15px;
  border: 1px solid var(--white);
  font-size: 10px;
  letter-spacing: 0;
  line-height: 2.8; /* 3.0 - 2px */

  &:hover {
    background-color: var(--black-hover);
  }
}

._493c8dfce200a7c49ab0f5df1b361845 {
  width: 156px;
  height: 43px;
  border-radius: 0;
  cursor: pointer;
  box-sizing: border-box;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
}

.e1bfb1e2844983c93046a24bc07d8788 {
  @mixin animation-hover;
}

._9476c682c04736e52c461f88ba1b5f14 {
  @mixin animation-hover;
  color: var(--accent-color);
  background-color: var(--black);
  border: 1px solid var(--accent-color);

  &:hover {
    background-color: var(--gray);
  }
}

._9476c682c04736e52c461f88ba1b5f14.e511baeb015b42c11c27183699087d5a {
  color: var(--accent-color-disabled);
  background-color: var(--black-disabled);
  border: 1px solid var(--accent-color-disabled);

  &:hover {
    background-color: var(--black-disabled);
  }
}

._493c8dfce200a7c49ab0f5df1b361845.b794d678a80854b1b8fcd0fff5a8e00c {
  padding: 0;
  width: 104px;
  height: 30px;
  padding: 0;
  border-radius: 15px;
  box-sizing: border-box;
  font-size: 10px;
  letter-spacing: 0;
  line-height: 2.8; /* 3.0 - 2px */
}

.e1bfb1e2844983c93046a24bc07d8788.b794d678a80854b1b8fcd0fff5a8e00c {
  color: var(--white);
  background-color: var(--play-black);
  border: 1px solid var(--white);
}

._9476c682c04736e52c461f88ba1b5f14.b794d678a80854b1b8fcd0fff5a8e00c {
  color: var(--white);
  background-color: #505050;
  border: 1px solid #505050;
}

.b8f234b54fd33230e045fc7869359e05 {
  padding: 0;
  outline: none;
  border: none;
  background-color: transparent;
  cursor: pointer;

  & ._94181909dd83fa8fdaf830910b39cc15 {
    display: flex;
    justify-content: flex-start;
    align-items: center;

    & .ae94293334447d71cb96c2713ed7876e {
      display: block;
      margin: 0 4px 0 0;
      width: 12px;
      height: 12px;

      background-position: center center;
      background-size: contain;
    }

    & ._3ae6878c96a15f0511fa72aeb24e715e {
      font-size: 11px;
      line-height: 1;
    }
  }
}

.b8f234b54fd33230e045fc7869359e05._9763f4bece35dbdd08b8e2503081a8c9 {
  & ._94181909dd83fa8fdaf830910b39cc15 {
    & .ae94293334447d71cb96c2713ed7876e {
      background: url(/assets_pack/icon_add_black-2866dfedc89feaf38af071d20a1d9b22.svg) no-repeat 0 0;
    }
  }
}

.b8f234b54fd33230e045fc7869359e05.ac3a04a4c2823319689804eee5ef969a {
  & ._94181909dd83fa8fdaf830910b39cc15 {
    & .ae94293334447d71cb96c2713ed7876e {
      background: url(/assets_pack/icon_check-c33bb82e24b0afa94cff1ee5ae4a393c.svg) no-repeat 0 0;
    }
  }
}

.d80094872c62b68bf519514aa07c3a90 {
  @mixin animation-hover;
  display: inline-block;
  width: 100%;
  height: 48px;
  background-color: var(--accent-color);
  box-sizing: border-box;
  outline: none;
  border: none;
  border-radius: 0;
  cursor: pointer;
  overflow: visible;

  & .d7bfa9566d3fed9c34b8eeba64e3bd8d {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;

    & .a41c00313040ad537e73bc94d1095bae {
      position: absolute;
      bottom: -3px;
      left: 34px;
      width: 50px;
      height: 62px;
      background: url(/assets_pack/icon_create-190367b0a66f09a9f0dba23bb19f7832.svg) no-repeat center;
      background-size: contain;
    }

    & ._535feeb7a6c3490535c9e01572078e6f {
      font-size: 16px;
      font-weight: bold;
      line-height: 1.6;
    }
  }

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

.d03b05ed0b4328d0a0d11891a04fc246 {
  width: 112px;
  height: 32px;
  border-radius: 18px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  box-sizing: border-box;

  & ._5ca85a9274de30d6842913f81fc7bbbb {
    display: inline-block;
    margin: 0 5px 0 10px;
    vertical-align: middle;

    background-position: center center;
    background-size: contain;
  }
}

._7de58028f9a2854cc995dbc7cc16764e {
  @mixin animation-hover;
  color: var(--black);
  background-color: var(--accent-color);

  & ._5ca85a9274de30d6842913f81fc7bbbb {
    background: url(/assets_pack/icon_add_black-2866dfedc89feaf38af071d20a1d9b22.svg) no-repeat;
    width: 14px;
    height: 14px;
  }

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

._44f9f5e9a7e0032f005bdae2fe14b7e9 {
  @mixin animation-hover;
  color: var(--white);
  background-color: var(--black);

  & ._5ca85a9274de30d6842913f81fc7bbbb {
    background: url(/assets_pack/icon_check_white-47d7b151ce55a9b362ac562247fbb7e3.svg) no-repeat;
    width: 12px;
    height: 12px;
  }

  &:hover {
    background-color: var(--gray);
  }
}

.d03b05ed0b4328d0a0d11891a04fc246._2700a51c9a01edb2e8206bb64c509f72 {
  width: 80px;
  height: 22px;
  font-size: 10px;
  font-weight: normal;

  & ._5ca85a9274de30d6842913f81fc7bbbb {
    margin: 0 3px 0 8px;
  }
}

._7de58028f9a2854cc995dbc7cc16764e._2700a51c9a01edb2e8206bb64c509f72 {
  & ._5ca85a9274de30d6842913f81fc7bbbb {
    width: 12px;
    height: 12px;
  }
}

._44f9f5e9a7e0032f005bdae2fe14b7e9._2700a51c9a01edb2e8206bb64c509f72 {
  & ._5ca85a9274de30d6842913f81fc7bbbb {
    width: 10px;
    height: 10px;
  }
}

._5039e48c901a6b2ead0b217a7fd0a54f {
  @mixin animation-hover;

  color: var(--black);
  background-color: var(--accent-color);
  width: 112px;
  height: 32px;
  border-radius: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;

  & .fac101e3404ff18d6429d47f06ffcb61 {
    display: inline-block;
    margin: 0 10px 0 0;
    width: 10px;
    height: 10px;
    vertical-align: middle;

    background: url(/assets_pack/icon_cross_black-7a49bc9a1cf5e31615069cda3fd04daa.svg) no-repeat;
    background-position: center center;
    background-size: contain;
  }

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

._5039e48c901a6b2ead0b217a7fd0a54f._1d3e8acdd99c4db28a8412680fc4f01d {
  width: 80px;
  height: 22px;
  font-size: 10px;
  font-weight: normal;

  & .fac101e3404ff18d6429d47f06ffcb61 {
    margin: 0 5px 0 0;
    width: 8px;
    height: 8px;
  }
}

._903ed06cf364d11d5918605b0a4aea15 {
  @mixin animation-hover;
  width: 156px;
  height: 32px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  color: var(--black);
  background-color: var(--accent-color);

  & ._878f86afaf8aa4dbf7deba065fc423ab {
    display: inline-block;
    margin: 0 6px 0 0;
    width: 10px;
    height: 10px;
    vertical-align: middle;

    background: url(/assets_pack/icon_cross_black-7a49bc9a1cf5e31615069cda3fd04daa.svg) no-repeat;
    background-position: center center;
    background-size: contain;
  }

  &:hover {
    background-color: var(--accent-color-hover) ;
  }
}

._2265a5171894b67b6d22e1fda0993f3a {
  @mixin animation-hover;

  width: 78px;
  height: 25px;
  border-radius: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  cursor: pointer;
  box-sizing: border-box;

  background-color: var(--accent-color);

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

._2265a5171894b67b6d22e1fda0993f3a._953b6c39e6f42a5efe86762ccad2bd0e {
  width: 80px;
  height: 22px;
  font-size: 10px;
  font-weight: normal;
}

.c74b58be49cf72137751a538bf54fc5d {
  @mixin animation-hover;

  width: 78px;
  height: 25px;
  border-radius: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  cursor: pointer;
  box-sizing: border-box;

  background-color: var(--black);
  color: var(--white);

  &:hover {
    background-color: var(--gray);
  }
}

.c74b58be49cf72137751a538bf54fc5d.f2b027140ae20c3e7f64caeeb8a8fbb3 {
  background-color: var(--black-disabled);

  &:hover {
    background-color: var(--black-disabled);
  }
}

.c74b58be49cf72137751a538bf54fc5d._256aa59ff9bbe42f02ada449a620cb70 {
  width: 80px;
  height: 22px;
  font-size: 10px;
  font-weight: normal;
}

.bc9e93680dc17a7ac599b2b4c53711a6 {
  @mixin animation-hover;

  width: 78px;
  height: 25px;
  border-radius: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  cursor: pointer;
  box-sizing: border-box;

  border-width: 1px;
  border-color: var(--black);
  border-style: solid;

  &:hover {
    background-color: #f0f0f0;
  }
}

.bc9e93680dc17a7ac599b2b4c53711a6._7c4a44e6c324a959c4aba6b10784a835 {
  width: 80px;
  height: 22px;
  font-size: 10px;
  font-weight: normal;
}

._131dbf0bb53bb0f7e376b5217edd0c87 {
  position: relative;
  display: inline-block;
  text-decoration: none;
  box-sizing: border-box;
  cursor: pointer;
  overflow: hidden;

  & img {
    margin: 0 25px 0 15px;
    width: 20px;
  }

  & ._7c00f1d894b848c788cd63eec82dc86c {
    @mixin animation-hover;
    float: left;
    display: block;
    background: no-repeat center center;
    background-size: contain;
  }

  & .a28547eda736c4b7705e4c358dcc59b9 {
    display: block;
    vertical-align: middle;
  }
}

._977d14f5b774967fad47619e6d47b70e {
  width: 85px;
  height: 20px;
  border-radius: 0;
  font-size: 11px;

  & ._7c00f1d894b848c788cd63eec82dc86c {
    margin: 2px;
    width: 16px;
    height: 16px;
  }

  & .a28547eda736c4b7705e4c358dcc59b9 {
    margin-left: 20px;
    margin-right: 2px;
    line-height: 20px;
    text-align: center;
  }
}

.db4e2477273ea5a93685208a16aa52e4 {
  position: relative;
  width: 240px;
  height: 72px;
  border-radius: 0;
  font-size: 16px;

  & ._7c00f1d894b848c788cd63eec82dc86c {
    margin: 0;
    height: 100%;
  }

  & .a28547eda736c4b7705e4c358dcc59b9 {
    position: absolute;
    top: 0;
    left: 0;
    float: none;
    width: 100%;
    text-align: center;
    line-height: 72px;
  }
}

.db4e2477273ea5a93685208a16aa52e4._00186f1ea61b6dddf01ce0c484478485 {
  width: 100%;
  height: 60px;

  & .a28547eda736c4b7705e4c358dcc59b9 {
    height: 60px;
    line-height: 60px;
  }
}

.afd527878be5e99e0a415bbb8648b7af {
  @mixin animation-hover;
  background-color: var(--twitter);
  color: var(--white);

  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_twitter-d0695296c1a6130c91f00bdfa75dde96.svg);
  }

  &:hover {
    background-color: var(--twitter-hover);
  }
}

._9fa8ae70055a51430aaf9db6628e04a2 {
  @mixin animation-hover;
  background-color: var(--facebook);
  color: var(--white);

  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_facebook-a6fc3463d072f0816230e12f0dd789a9.svg);
  }

  &:hover {
    background-color: var(--facebook-hover);
  }
}

.bcc6813d5c19c53d260153d6a96552f1 {
  @mixin animation-hover;
  background-color: var(--line);
  color: var(--white);

  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_line-305cfef718109ceeeb9037f1c5e2e9f5.svg);
  }

  &:hover {
    background-color: var(--line-hover);
  }
}

.db4e2477273ea5a93685208a16aa52e4.afd527878be5e99e0a415bbb8648b7af {
  & i {
    margin-left: 14px;
    width: 26px;
  }
}

.db4e2477273ea5a93685208a16aa52e4._9fa8ae70055a51430aaf9db6628e04a2 {
  & i {
    margin-left: 24px;
    width: 14px;
  }
}

.db4e2477273ea5a93685208a16aa52e4.bcc6813d5c19c53d260153d6a96552f1 {
  & i {
    margin-left: 16px;
    width: 30px;
  }

  & span {
    letter-spacing: 3px;
  }
}

.afd527878be5e99e0a415bbb8648b7af.d45d9b8e8ec70b0d9318c3f567dd2e56 {
  color: var(--white-disabled);
  background-color: var(--twitter-disabled);

  &:hover {
    color: var(--white-disabled);
    background-color: var(--twitter-disabled);
  }

  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_twitter_disabled-e60510e20e20c18d4d7d9ff1dc23a775.svg);
  }
}

._9fa8ae70055a51430aaf9db6628e04a2.d45d9b8e8ec70b0d9318c3f567dd2e56 {
  color: var(--white-disabled);
  background-color: var(--facebook-disabled);

  &:hover {
    color: var(--white-disabled);
    background-color: var(--facebook-disabled);
  }

  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_facebook_disabled-b9fbebccee94c0cb187000e47df6ca84.svg);
  }
}

.bcc6813d5c19c53d260153d6a96552f1.d45d9b8e8ec70b0d9318c3f567dd2e56 {
  color: var(--white-disabled);
  background-color: var(--line-disabled);

  &:hover {
    color: var(--white-disabled);
    background-color: var(--line-disabled);
  }

  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_line_disabled-281419fc1cdb53ba8d6f850db9d0c38a.svg);
  }
}

._606d65d8fd56de3eea66e611c1d6ec87.d45d9b8e8ec70b0d9318c3f567dd2e56 {
  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_facebook_disabled-b9fbebccee94c0cb187000e47df6ca84.svg);
  }
}

._27aa80b1e58a5227b26dfb39f821ea59.d45d9b8e8ec70b0d9318c3f567dd2e56 {
  & ._7c00f1d894b848c788cd63eec82dc86c {
    background-image: url(/assets_pack/icon_line_disabled-281419fc1cdb53ba8d6f850db9d0c38a.svg);
  }
}

@define-mixin button {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  flex-shrink: 0;
}

._6ba045694d5fc03f6c646929d7d67d8b {
  @mixin button;
  width: 48px;
  height: 48px;
}

._6ba045694d5fc03f6c646929d7d67d8b.e685f01c92801e76e6c5a874ab0bf5a0 {
  & i {
    margin: 0;
    width: 26px;
    height: 22px;
  }
}

._6ba045694d5fc03f6c646929d7d67d8b.d51afca611b134ee90c107d6ec73e278 {
  & i {
    margin: 0 3px 0 0;
    width: 27px;
    height: 27px;
  }
}

._6ba045694d5fc03f6c646929d7d67d8b._80c97fb5a0eccd2342637d90f1309410 {
  & i {
    margin: 0;
    width: 28px;
    height: 28px;
  }
}

._6ba045694d5fc03f6c646929d7d67d8b._0427d579a63a45ae7de90540f7102819 {
  @mixin button;
  width: 36px;
  height: 36px;
}

._6ba045694d5fc03f6c646929d7d67d8b._0427d579a63a45ae7de90540f7102819.e685f01c92801e76e6c5a874ab0bf5a0 {
  & i {
    margin: 0;
    width: 21px;
    height: 20px;
  }
}

._6ba045694d5fc03f6c646929d7d67d8b._0427d579a63a45ae7de90540f7102819.d51afca611b134ee90c107d6ec73e278 {
  & i {
    margin: 0 1px 0 0;
    width: 12px;
    height: 21px;
  }
}

._6ba045694d5fc03f6c646929d7d67d8b._0427d579a63a45ae7de90540f7102819._80c97fb5a0eccd2342637d90f1309410 {
  & i {
    margin: 0;
    width: 22px;
    height: 22px;
  }
}

._82dc9d0cc1b69f7f50e136c4c7aa152a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border: 1px solid var(--accent-color);
  border-radius: 0;
  font-size: 12px;
  transition: all .2s;

  & div {
    flex: 1;
    flex-wrap: nowrap;
    width: 50%;
    padding: 4px 2px;
    color: #999;
    background-color: var(--white);
    white-space: nowrap;
    text-align: center;
  }

  & div._0000cb7f2f2fff9d453b9760ef0cbb5e {
    color: var(--black);
    background-color: var(--accent-color);
    transition: all .2s;
  }
}

._0af549d72fc2cd1ddc9a9acede785d7e {
  @mixin font-button;
  @mixin animation-hover;
  margin: 0 auto;
  background: var(--accent-color);
  cursor: pointer;
  color: var(--black);
  font-size: 18px;
  border-radius: 0;
  border: none;
  border-radius: 0;

  &:hover {
    background: var(--accent-color-hover);
  }

  &:active {
    outline: 0;
  }

  &[disabled] {
    background-color: var(--light-gray);
    color: #aaa;
    cursor: not-allowed;
  }

  &:focus {
    outline: 0;
  }
}

.fb2196f2d8f3739b016bcade74e0f30b {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  cursor: pointer;
  background: transparent;
  border: 0;

  &:focus {
    outline: 0;
  }
}

[data-whatinput="keyboard"] {
  & .fb2196f2d8f3739b016bcade74e0f30b {
    &:focus {
      outline: 1px dotted var(--gray);
    }
  }
}

._29f9d905c4d77117fc5a896899de6e3e {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
  width: 18px;
  height: 18px;
  border: 2px solid var(--black);
  border-radius: 11px;
  box-sizing: border-box;
}

.cce8b0933c2bafa139444332eb8b7b2c {
  & ._29f9d905c4d77117fc5a896899de6e3e {
    & span {
      width: 10px;
      height: 10px;
      border-radius: 6px;
      background-color: var(--accent-color-hover);
    }
  }
}

.f183768683e3652dac845b63a8872af5 {
  font-size: 16px;
  color: var(--black);
  user-select: none;
}

._48109e15bb27940a71780cf199d5a88f:not(.cce8b0933c2bafa139444332eb8b7b2c) {
  & .f183768683e3652dac845b63a8872af5 {
    opacity: 0.4
  }
}

.a0304e5fd6884f31b2e6db6067d6d582 {
  position: fixed;
  right: 46px;
  bottom: 62px;
  color: var(--black);
  background-color: var(--accent-color);
  width: 46px;
  height: 46px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;

  & .b851bfbbc494eb37ce89019a171f2884 {
    display: inline-block;
    width: 18px;
    height: 10px;
    text-align: center;
    vertical-align: middle;

    background: url(/assets_pack/icon_gotop-22e43fcb9a78a11b634c5185cd23b19c.svg) no-repeat;
    background-position: center center;
    background-size: contain;
  }

  &:hover {
    background-color: var(--accent-color-hover);
  }
}

._66b272417b66d1c32596c50c5fcf2db1 {
  width: 262px;
  height: 52px;

  & ._468a9d30852e38243e7aed98b9cc1fb1 {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    letter-spacing: 1px;

    & .a867e34aafb1abc9a5a94a46ce528ba1 {
      margin-right: 8px;
      width: 23px;
      height: 23px;
      background: url(/assets_pack/icon_replay_black-8ff0de6b6a0e56d2d731976b10259385.svg) no-repeat 0 0;
      background-size: contain;
    }
  }
}

._66b272417b66d1c32596c50c5fcf2db1.e437eeeb22f9b7e4dcf1a68bed95404a {
  width: 221px;
  height: 42px;

  & ._468a9d30852e38243e7aed98b9cc1fb1 {
    margin-right: 6px;
    font-size: 14px;
    line-height: 1;
    letter-spacing: 0;
  }
}

._66b272417b66d1c32596c50c5fcf2db1.b6d440e2c58b0a28276aeab802817eec {
  & ._468a9d30852e38243e7aed98b9cc1fb1 {
    & .a867e34aafb1abc9a5a94a46ce528ba1 {
      background-image: url(/assets_pack/icon_replay_disabled-a830ae369be578721b83c239392541df.svg);
    }
  }
}

._2ba934965c71803d1d14f468fa6856c5 {
  padding: 0;
  width: 48px;
  height: 48px;
  border-radius: 100%;
  background-color: var(--white);

  &:hover {
    background-color: #d2d2d2;
  }

  & .d4bbcfb051dc97734948b62d13f60f8c {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;

    & .f04f046ad4e536f123d1d2a96aa3d51b {
      width: 22px;
      height: 14px;
      background: url(/assets_pack/icon_share-e33b10c1fa74621d311295f37296388b.svg) no-repeat 0 0;
      background-size: 22px 14px;
    }
  }
}

._2ba934965c71803d1d14f468fa6856c5._403dc064765b8f59ae6d222c68826c4f {
  background-color: var(--white-disabled);

  &:hover {
    background-color: var(--white-disabled);
  }
}

._2ba934965c71803d1d14f468fa6856c5.bce3cfab15fe466c018b6cff5e2a6b93 {
  width: 36px;
  height: 36px;

  & .d4bbcfb051dc97734948b62d13f60f8c {
    & .f04f046ad4e536f123d1d2a96aa3d51b {
      width: 16px;
      height: 11px;

      background-size: 16px 11px;
    }
  }
}

._9ab29d02ad195e037bdeed755fd97120 {
  & ._5afd18d9b4a04418cb565db3b8d8d28b {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
  }

  & ._00d756ecdb4155367fb90ae7f1c6caf9 {
    display: none;
  }
}

._9ab29d02ad195e037bdeed755fd97120._608c51250bc662d2d315154d2984512c {
  & ._5afd18d9b4a04418cb565db3b8d8d28b {
    cursor: pointer;
  }
}

.e507ff5a4a87025a34a11e249505b7a9 {
  width: 36px;
  height: 36px;

  & ._77ea9a66b042f22051ed17884b4135aa {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: var(--black);
    border-radius: 50%;

    &:hover {
      background-color: var(--gray);

      & ._837f4f090ff0fd97c36423c5d030f983 {
        opacity: 1;
        visibility: visible;
      }
    }

    & .dc200466dce83f186d7b87c8a2940aaf {
      width: 18px;
      height: 18px;
      background: url(/assets_pack/pc_icon_image_white-256ec4b80c77369bef1cb72472cbb7d2.svg) no-repeat 0 0;
      background-size: 18px 18px;
    }

    & ._837f4f090ff0fd97c36423c5d030f983 {
      position: absolute;
      bottom: calc(100% + 8px);
      left: 50%;
      padding: 4px 8px;
      font-size: 10px;
      line-height: 1.6;
      color: var(--white);
      background-color: #616161;
      border-radius: 2px;
      transform: translate(-50%, 0);
      word-break: keep-all;
      opacity: 0;
      visibility: hidden;
      transition: all .2s ease-in-out;
    }
  }
}

.a727ceaacfbd4f29ab4daa66c29c930c {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;

  & ._6c53038a41ca3c378f24f22805e6b401 {
    display: flex;
    flex-direction: column;
    align-items: center;

    & p {
      margin: 0 0 80px;
      font-size: 28px;
      text-align: center;
      line-height: 2;
      letter-spacing: 4px;
      color: var(--white);
    }
  }

  & ._83a48f1e1875c06c5ed2ad2e2f054e5b {
    margin-top: 50px;
    margin-bottom: 80px;
    font-size: 28px;
  }

  & ._95b89f79a55f5ccb986cdbdf322c8d08 {
    width: 390px;
    height: 65px;
    font-size: 20px;
  }
}


.a727ceaacfbd4f29ab4daa66c29c930c._6c70aac1b0daabb3e01e4c5a6b6425b1 {
  width: 100%;
  height: 100%;
  min-height: 360px;
  margin: auto;

  & ._6c53038a41ca3c378f24f22805e6b401 {
    width: 230px;

    & p {
      margin-bottom: 40px;
      font-size: 16px;
      font-weight: bold;
      line-height: 1.7;
      letter-spacing: 0;
      color: var(--white);
    }
  }

  & ._95b89f79a55f5ccb986cdbdf322c8d08 {
    width: 230px;
    height: 44px;
    font-size: 16px;
  }
}

.de9d705175cbe6fbad5e47be80620b8c {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;

  & .eb8297daa2d9758adb277b52ab27d555 {
    display: flex;
    flex-direction: column;
    align-items: center;

    & p {
      margin: 0 0 80px;
      font-size: 28px;
      text-align: center;
      line-height: 2;
      letter-spacing: 4px;
      color: var(--white);
    }
  }

  & ._2f7adf55497cfc82c2b30cc6d61da021 {
    margin-top: 50px;
    margin-bottom: 80px;
    font-size: 28px;
  }

  & .eff9be971aff3634f3e3d8fc22e98da9 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 390px;
    height: 65px;
    font-size: 20px;
    color: var(--black);
    background-color: var(--accent-color);
    text-decoration: none;
  }
}


.de9d705175cbe6fbad5e47be80620b8c._1fbaa5e2221fc03464b828000bbe71a0 {
  width: 100%;
  height: 100%;
  min-height: 360px;
  margin: auto;

  & .eb8297daa2d9758adb277b52ab27d555 {
    width: 230px;

    & p {
      margin-bottom: 40px;
      font-size: 16px;
      font-weight: bold;
      line-height: 1.7;
      letter-spacing: 0;
      color: var(--white);
    }
  }

  & .eff9be971aff3634f3e3d8fc22e98da9 {
    width: 230px;
    height: 44px;
    font-size: 16px;
  }
}

@define-mixin logo {
  width: 342px;
  height: 140px;
}

@define-mixin sp-logo {
  width: 165px;
  height: 64px;
}

._01aece18dc10b9e064b61f42fbd9f715 {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 100px 0;

  & ._71aefb990a815d267650fb75ca64a0f1 {
    display: flex;
    flex-direction: column;
    align-items: center;

    & ._0edbda283b009b183614b3fee153ebf8 {
      @mixin logo;
    }

    & ._773601cdbaaf5ce28288336ed04a5e7b {
      @mixin logo;
    }

    & .b0352473dca8441756346b23a2cd71d1 {
      @mixin logo;
    }

    & ._13b39906c75ada8b7c80a294cf3722c8 {
      @mixin logo;
    }

    & ._42d305c364698bfadfd0c737834ae300 {
      width: 253px;
      height: 70px;
      background-size: auto
    }

    & .ad3583e288dd77bb8ece7ff52bff0eb8 {
      margin-top: 50px;
      font-size: 28px;
    }

    & ._1066a54577d5881d1f853302371a9e44 {
      margin-top: 28px;
      font-size: 16px;
    }
  }

  & .f395ccae6e9d62f10959ca5fd217550f,
  & ._9ef828c405c947585c66a2a833bf9756 {
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--black);
    background-color: var(--accent-color);
    text-decoration: none;
  }

  & .f395ccae6e9d62f10959ca5fd217550f {
    margin-top: 80px;
    width: 390px;
    height: 65px;
    font-size: 20px;
  }

  & ._9ef828c405c947585c66a2a833bf9756 {
    margin-top: 40px;
    width: 216px;
    height: 48px;
    font-size: 16px;
  }
}

._01aece18dc10b9e064b61f42fbd9f715.fdbcfd45dc394602f71f86eab2376013 {
  display: block;
  width: 230px;
  height: 100%;
  min-height: 360px;
  padding: 50px 0 0;
  margin: auto;

  & ._71aefb990a815d267650fb75ca64a0f1 {
    & ._0edbda283b009b183614b3fee153ebf8 {
      @mixin sp-logo;
    }

    & ._773601cdbaaf5ce28288336ed04a5e7b {
      @mixin sp-logo;
    }

    & .b0352473dca8441756346b23a2cd71d1 {
      @mixin sp-logo;
    }

    & ._13b39906c75ada8b7c80a294cf3722c8 {
      @mixin sp-logo;
    }

    & ._42d305c364698bfadfd0c737834ae300 {
      width: 174px;
      height: 48px;
      background-size: contain;
    }

    & .ad3583e288dd77bb8ece7ff52bff0eb8 {
      margin-top: 40px;
      font-size: 16px;
      font-weight: bold;
    }

    & ._1066a54577d5881d1f853302371a9e44 {
      margin-top: 16px;
      font-size: 16px;
    }
  }

  & .f395ccae6e9d62f10959ca5fd217550f,
  & ._9ef828c405c947585c66a2a833bf9756 {
    margin-top: 40px;
    width: 230px;
    height: 44px;
    font-size: 16px;
  }
}

._01aece18dc10b9e064b61f42fbd9f715._17e791a8ed6ded38c5beaa6de50842fc {
  & ._0edbda283b009b183614b3fee153ebf8 {
    background: url(/assets_pack/ttl_403-faafd6fca7ee6d56ba755c10aec255e1.svg) no-repeat;
  }

  & ._773601cdbaaf5ce28288336ed04a5e7b {
    background: url(/assets_pack/ttl_404-05378bb53793c21eb2e9a9965f656063.svg) no-repeat;
  }

  & .b0352473dca8441756346b23a2cd71d1 {
    background: url(/assets_pack/ttl_500-1dcab480d9abb06d172349ceceafb9ef.svg) no-repeat;
  }

  & ._13b39906c75ada8b7c80a294cf3722c8 {
    background: url(/assets_pack/ttl_503-1f40858e1be05dae9fbf5ddae22f5a67.svg) no-repeat;
  }

  & ._42d305c364698bfadfd0c737834ae300 {
    background: url(/assets_pack/ttl_ERROR-cafea7b4b995b5aaa9ffad785d7734e2.svg) no-repeat;
  }

  & .ad3583e288dd77bb8ece7ff52bff0eb8 {
    color: var(--black);
  }
}

._01aece18dc10b9e064b61f42fbd9f715.f8b63083f4de406732b5c8466fb5214f {
  & ._0edbda283b009b183614b3fee153ebf8 {
    background: url(/assets_pack/ttl_403_white-5cc5469557bd8302c6e7220a3b6ae5d5.svg) no-repeat;
  }

  & ._773601cdbaaf5ce28288336ed04a5e7b {
    background: url(/assets_pack/ttl_404_white-cc84f3cdf4eea74501762df82e24aa50.svg) no-repeat;
  }

  & .b0352473dca8441756346b23a2cd71d1 {
    background: url(/assets_pack/ttl_500_white-4231b8abed68b4f7b660bdf1c10b8ccc.svg) no-repeat;
  }

  & ._13b39906c75ada8b7c80a294cf3722c8 {
    background: url(/assets_pack/ttl_503_white-e6f854a0013dceef0a0230ac02925d2f.svg) no-repeat;
  }

  & ._42d305c364698bfadfd0c737834ae300 {
    background: url(/assets_pack/ttl_ERROR_white-b30759f5fedf88479c14fc87d1b5eec4.svg) no-repeat;
  }

  & .ad3583e288dd77bb8ece7ff52bff0eb8 {
    color: var(--white);
  }

  & ._1066a54577d5881d1f853302371a9e44 {
    color: var(--white);
  }
}

._628744d29d7eda76adc701d4a8b3b0c6 {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-top: 56px;

  & ._7ba1a37d8d9664b27e0f92cc47377498 {
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 12px;

    & p {
      margin: 0px;
    }
  }

  & ._8dd6af6266c840fd0f1e66b33932a926 {
    font-size: 12px;
    margin-bottom: 28px;

    & p {
      margin: 0px;
    }
  }

  & ._01ef64a46d150fd13ea7d06f0f7e7d10 {
    width: 216px;
    height: 48px;
    font-size: 15px;
  }
}


._628744d29d7eda76adc701d4a8b3b0c6._639bf4c86fb538a317db97cac6c07abb {
  width: 100%;
  margin: auto;
  padding-top: 48px;
  padding-bottom: 48px;

  & ._01ef64a46d150fd13ea7d06f0f7e7d10 {
    width: 124px;
    height: 44px;
    font-size: 16px;
  }
}

._4e1ab6babee4d815afbc8555f879b46c {
  width: 100%;
  min-height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-color: var(--white);
  color: var(--black);

  & ._671869a2a6445b5aa9c739eb7c8e2a46 {
    width: 162px;
    height: 140px;
    background-image: url(/assets_pack/icon_alert-127e248dd682ade021f8a972d3ecd843.svg);
    margin-bottom: 50px;
  }

  & .bf47358af5472bdc5254d64785d0a1cb {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 80px;

    & p {
      font-size: 28px;
      text-align: center;
      font-weight: bold;
      margin: 0px;
    }
  }

  & .dcafaaf16f8ce8751ec1689dc5bbc6ae {
    margin-top: 11px;
    margin-bottom: 80px;
    & p {
      font-size: 16px;
      text-align: center;
      line-height: 2;
    }
  }

  & ._942b7b9d95f1b733ef6db280264994b1 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 390px;
    height: 65px;
    font-size: 20px;
    color: var(--black);
    background-color: var(--accent-color);
    text-decoration: none;
  }
}

._4e1ab6babee4d815afbc8555f879b46c._2db829dfffe1e633eb21b3fef557127c {
  background-color: var(--play-black);
  color: var(--white);
  & ._671869a2a6445b5aa9c739eb7c8e2a46 {
    background-image: url(/assets_pack/icon_alert_white-89058ba6b9e821d5ec2a1792355a1859.svg);
  }
}

._4e1ab6babee4d815afbc8555f879b46c._8e4f96c2e76b918e8ec61c64b360ed92 {
  width: 100%;
  height: 100%;
  min-height: 360px;
  margin: auto;

  & ._671869a2a6445b5aa9c739eb7c8e2a46 {
    margin-bottom: 24px;
  }

  & .bf47358af5472bdc5254d64785d0a1cb {
    width: 144px;
    margin-bottom: 4px;

    & p {
      font-size: 16px;
      font-weight: bold;
    }
  }

  & .dcafaaf16f8ce8751ec1689dc5bbc6ae {
    margin-top: 4px;
    margin-bottom: 40px;
    width: 319px;
    & p {
      font-size: 12px;
    }
  }

  & ._942b7b9d95f1b733ef6db280264994b1 {
    width: 230px;
    height: 44px;
    font-size: 16px;
  }
}

._475c2b3e00eb933e455046803fc36b44 {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
  width: 100%;

  /*
   * IE11で flex 内で min-height を使うためにコンテナを包むラッパーを用意する
   * [参考] 下記ページの Demos 3.2b
   * https://github.com/philipwalton/flexbugs/blob/master/README.md#3-min-height-on-a-flex-container-wont-apply-to-its-flex-items
   */
  & .f50f10ea078949998db0775f472cf6e4 {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    width: 100%;
    min-height: 100vh;

    & .c0d05dfe7152f14251579a5b65241786 {
      width: 100%;
    }

    & .b1dfbe937405b2c127d0b85dc5470906 {
      width: 100%;
      min-width: 1024px;
      margin: 0 auto;
      margin-bottom: auto;
    }

    & ._10259ead9e1fdd4f58747a5fddfdabc5 {
      width: 100%;
    }
  }
}

._475c2b3e00eb933e455046803fc36b44._04426bb48ec0d3e958e250b8dcfb97be {
  & .c0d05dfe7152f14251579a5b65241786 {
    display: none;
  }

  & .b1dfbe937405b2c127d0b85dc5470906 {
    min-width: initial;
    overflow-x: auto;
  }
}

._475c2b3e00eb933e455046803fc36b44.faa0e8f501d1e58d4d6d69694e07c57d {
  background-color: var(--white);
}

._475c2b3e00eb933e455046803fc36b44.a114008e29642e5e430523163adb73a2 {
  background-color: var(--play-black);
}

._475c2b3e00eb933e455046803fc36b44._04426bb48ec0d3e958e250b8dcfb97be._321099be4d0adbc35840a76b637972ee {
  & .b1dfbe937405b2c127d0b85dc5470906,
  & ._10259ead9e1fdd4f58747a5fddfdabc5 {
    opacity: 0;
    height: 0;
    overflow: hidden;
  }
}

._656a1eb9aa8406a09a332cec5af5b6cb {
  position: absolute;
  top: 0;
  left: 21px;
  width: 832px;
  height: 100%;
  z-index: var(--modal-layer);

  & ._31fae98b31778a5e2512f0d1ff303639 {
    position: relative;
    width: 100%;
    height: 100%;
    padding-top: 170px;
    background-color: var(--white);
    box-sizing: border-box;

    & .ddfd4f007dfd53b13351d7429887d8d2 {
      @mixin animation-hover;
      position: absolute;
      top: 32px;
      right: 32px;
      width: 32px;
      height: 32px;
      cursor: pointer;
      background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;

      &:hover {
        background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
      }
    }

    & ._23cef7705b5d61d7485ef9912e182296 {
      margin: 0;
      text-align: center;
      font-size: 20px;
      font-weight: bold;
      color: var(--black);
    }

    & .db91da5b38f211f7539dac7b5d595016 {
      margin-top: 60px;

      & ._87b4191a6975c673fb705948c0697264,
      & ._47a40d720d99e456bfd9ba3a0039dcf7 {
        width: 216px !important;
        height: 48px !important;
        font-size: 15px !important;
      }

      & ._87b4191a6975c673fb705948c0697264 {
        margin-right: 48px;
      }
    }
  }
}

.e17a0fe4e0fc87b8378cf8ec3bfb57f1 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--modal-overlay-black);
  z-index: var(--modal-layer);
  overflow: auto;
  /*
   * safariにおいて、z-index指定だけだとBooksGridなどrotate3dを使っているような要素の一部が上に表示されてしまう
   * 参考: http://www.zhangxinxu.com/wordpress/2016/08/safari-3d-transform-z-index/
   */
  transform: translateZ(var(--modal-layer-px));
}

._61309e93fba27d1b5cfa83f55a534d23 {
  position: absolute;
  z-index: var(--modal-layer);
  outline: none;
  margin-bottom: 60px;
}

._61309e93fba27d1b5cfa83f55a534d23._4b17a0e6a834ce78da662656e683bfeb {
  margin-bottom: 0;
}

._22e2c3d55d92fd88682ebfe9dbd44af3 {
  position: relative;
}

._323eabf040624657c38e2f5c6132d182 {
  position: relative;
  width: 630px;
  padding: 60px 90px;
  background: var(--white);
  text-align: center;
  box-sizing: border-box;

  & ._95dfabe21d3aff85c823d220e4a0b23c {
    position: absolute;
    top: -64px;
    right: -64px;
    width: 48px;
    height: 48px;
    cursor: pointer;
    background: url(/assets_pack/icon_close_white-50a5e31c61a2c0809d539b21237b89af.svg) no-repeat;
    &:hover {
      background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
    }
  }

  & .cfce9d6e755e246c10c5f3356ba14950 {
    margin: 0 0 46px;
  }

  & ._76cb8a4c38e3afbb3596e67651ae2292 {
    margin-top: 40px;

    &:first-child {
      margin-top: 0;
    }

    & p {
      font-size: 16px;
      margin: 0 0 15px;
      text-align: center;
    }
  }

  & ._36a679099b8777f843e6ed7905388a13 {
    width: 100%;
    height: 74px;
  }
}

._323eabf040624657c38e2f5c6132d182._14fa4b50822a90ca2aabfbc9c786dbc6 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  padding: 40px 0;
  box-sizing: border-box;

  & .cfce9d6e755e246c10c5f3356ba14950 {
    font-size: 16px;
    line-height: 1.7;
    margin: 0;
  }

  & ._76cb8a4c38e3afbb3596e67651ae2292 {
    margin-top: 30px;

    & p {
      margin-bottom: 10px;
      font-size: 13px;
      line-height: 1;
      text-align: center;
    }
  }

  & ._95dfabe21d3aff85c823d220e4a0b23c {
    top: 20px;
    right: 16px;
    width: 18px;
    height: 18px;
    background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;
  }

  & ._36a679099b8777f843e6ed7905388a13 {
    width: 230px;
    height: 44px;
    font-size: 15px !important;
    font-weight: bold !important;
  }
}

._65b408fc4549decfe225c83e7abbc559 {
  font-size: 20px;
  margin: 0 0 46px;
}

._4991775eea355a03d2e36b7432cfeb53 {
  width: 100vw;
  min-height: 100vh;
  padding: 60px 12px 40px;
  box-sizing: border-box;
  background: #fff;

  & ._82b9a5c4c7cf265431dc307e04739398 {
    background-color: var(--play-black);
    background: url(/assets_pack/play_sample-9a8378ab408e667f7edceb554b271faa.png) no-repeat center;
    background-size: contain;
    margin: 0 auto;
    width: 280px;
    height: 230px;
  }

  & ._5353e48a8ed5546c0fa464b4a851718e {
    margin: 28px auto 0;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.7;
    letter-spacing: 0.5px;
    text-align: center;
  }

  & ._049430822815c39325c8e1a1c7e39c00 {
    margin: 18px 0 0;
    padding: 0 12px;
    text-align: left;
    font-size: 15px;
    line-height: 26px;
  }

  & .c7282d0b83745188d5d24ecc144b62eb {
    margin: 40px 0 0;
    padding: 0 40px;
    width: 100%;
    box-sizing: border-box;

    & ._9c7495cadc1986b0237871b9b23a5307 {
      padding: 0;
      width: 100%;
      height: 60px;
      font-size: 16px;
      letter-spacing: 0.47px;
      box-sizing: border-box;
    }
  }

  & ._454eb2664671d41acf123948be7af408 {
    font-size: 13px;
  }

  & .cba30aeb821e29d4a327e65fa853d60f {
    margin: 40px 0 0;
    padding: 20px 28px 24px;
    width: 100%;
    box-sizing: border-box;
    background-color: #f5f5f5;

    & .f0f42b18d4ed645c9b39d6d41de6e376 {
      text-align: center;
      font-size: 14px;
      line-height: 24px;
      font-weight: bold;
      margin: 0px;
    }

    & ._088a5bf45dd2175a2ba9796eec7485f3 {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      flex-direction: column;
      margin-top: 20px;

      & ._08d0bcd8dc860f7f50ea4570e94d6452,
      & .cc6eed50cdfe5e177683a95f233c80b0,
      & ._9756116f4a2686b0f11293430d6aea23,
      & .a6e497e3a46f3b342cea6b8c809e49cc {
        width: 100%;
        height: 60px;
        font-size: 16px;
        padding: 0;
        letter-spacing: 0.47px;
        box-sizing: border-box;
      }

      & ._08d0bcd8dc860f7f50ea4570e94d6452 {
        margin-bottom: 20px;
      }
    }
  }
}

._817802b6ddc6db910017f9a6203ac629 {
  position: absolute;
  width: 18px;
  height: 18px;
  top: 20px;
  right: 16px;
  background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;
  &:hover {
    background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
  }
}

._1beb902ad939f992ae1b4d0a4d2c623a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
  text-align: center;
  width: 100vw;
  min-height: 100vh;
  padding: 110px 24px 40px;
  box-sizing: border-box;
  background: #fff;

  & .ca38178b92055a6bd3ba9384478c0e33 {
    width: 100%;
    max-width: 280px;
    height: 184px;
    background: url(/assets_pack/nicolive_use_q_sp-804108ed1bf56796036753477b44f6d2.png) no-repeat center;
    background-size: contain;
  }

  & .ab9b4e11e672aa2ede1a0c38ee945217 {
    margin-top: 30px;
    width: 100%;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.7;
    letter-spacing: 0.56px;
  }

  & .bff3eef492ec0c402d438217903a8837 {
    margin-top: 24px;

    & p {
      text-align: left;
      font-size: 15px;
      line-height: 26px;
      margin: 0px;
    }
  }
}

._5cb8e7f694729622e44ba5f9913762ca {
  position: absolute;
  bottom: 16px;
  right: 16px;
  font-size: 12px;
  color: #999;

  &:hover {
    color: #ccc;
  }
}

._8762b8f17962ee191a08d682e8cfeae0 {
  position: absolute;
  width: 18px;
  height: 18px;
  top: 20px;
  right: 16px;
  background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;
  &:hover {
    background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
  }
}

._082dbe9cb9bb777fbc863989072fa64c {
  position: relative;
  padding: 70px 0 0;
  width: 832px;
  height: 438px;
  background: var(--white);
  box-sizing: border-box;
  opacity: 0;

  & .e8435561a90b8245288efc77b8ced7d7 {
    @mixin animation-hover;
    position: absolute;
    top: 32px;
    right: 32px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;

    &:hover {
      background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
    }
  }

  & .ad3d0661520d5319d4b99fd3c0f56323 {
    margin: 0 auto;
    width: 380px;
    height: 50px;
    background: url(/assets_pack/ttl_posted-adc21f847df8f219a79eb9363865d221.svg) no-repeat;
    background-size: cover;
  }

  & .ec4842d817d78330179daf4c9a5e272e {
    margin: 42px auto 0;
    font-size: 26px;
    font-weight: bold;
    color: var(--black);
    text-align: center;
    letter-spacing: 0.57px;
  }

  & ._7b0bc1d9672e56986006899dee482f44 {
    margin: 40px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 740px;
  }

  & ._2b1df6d3d3c80618a9bfc52c1f1377c6 {
    @mixin animation-hover;
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 90px;
    color: var(--black);
    background: var(--light-gray);
    text-decoration: none;
    font-size: 18px;
    box-sizing: border-box;

    &:hover {
      background: #d7d7d7;
      text-decoration: none;
    }
  }
}

._082dbe9cb9bb777fbc863989072fa64c._9597cd10df304b0d2fcfe1e5c5ef4c50 {
  height: 330px;
}

._082dbe9cb9bb777fbc863989072fa64c._30499fd2eae8ecfce70826bd9d251651 {
  opacity: 1;
}

._082dbe9cb9bb777fbc863989072fa64c._50bdca2a5c9ce3ae26f56d52e11174bc {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  padding: 20px 0;
  width: 100vw;
  height: 100vh;
  overflow-y: auto;

  & .e8435561a90b8245288efc77b8ced7d7 {
    top: 20px;
    right: 20px;
    width: 18px;
    height: 18px;
  }

  & .ad3d0661520d5319d4b99fd3c0f56323 {
    width: 230px;
    height: 30px;
    flex-shrink: 0;
  }

  & .ec4842d817d78330179daf4c9a5e272e {
    margin-top: 24px;
    font-size: 16px;
  }

  & ._7b0bc1d9672e56986006899dee482f44 {
    flex-direction: column;
    width: 280px;
    height: 228px;
    flex-shrink: 0;
  }

  & ._2b1df6d3d3c80618a9bfc52c1f1377c6 {
    margin: 40px auto 0;
    position: relative;
    bottom: auto;
    left: auto;
    font-size: 14px;
    color: var(--black);
    background: transparent;
    width: auto;
    height: auto;
    flex-shrink: 0;

    &:hover {
      text-decoration: underline;
    }
  }

  /* 高さが400px以下のときはスクロール用のスタイルに変更 */
  @media screen and (max-height: 400px) {
    justify-content: flex-start;
  }
}

._85ed02b738c4734cd8f8b3999326801b {
  @mixin font-button;

  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  background: var(--accent-color);
  cursor: pointer;
  color: var(--black);
  font-weight: bold;
  font-size: 20px;
  border-radius: 8px;
  text-decoration: none;

  &:hover {
    background: var(--accent-color-hover);
  }
}

._2cef8fa65043c302332a614c8840af67 {
  outline: none;
}

.a8d588da0cd5427483bd891bb827c114 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 24px 25px;
  width: 100%;
  background-color: #fbfce3;
  border: 4px solid var(--black);
  box-sizing: border-box;

  & ._1da7cdd9c328dbb5f1d1e4fcef2e7fe5 {
    margin: 0 auto;
    width: 100%;
    color: var(--black);
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0;
    text-align: justify;
  }

  & ._15046b843f94a1a1b4a93a674b503643 {
    @mixin animation-hover;

    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 24px auto 0;
    padding: 0 20px;
    width: 238px;
    height: 54px;
    color: var(--white);
    background: var(--black);
    font-size: 15px;
    text-align: center;
    text-decoration: none;
    line-height: 54px;
    box-sizing: border-box;

    &:hover {
      background: var(--gray);
    }

    & ._6b808ae79dd26d7357e37e589cc650c2 {
      margin: 0 0 2px 24px;
      width: 16px;
      height: 16px;
      background-image: url(/assets_pack/icon_shape-5b73011d1fb32ab7aada97fe2e9189b1.svg);
      background-repeat: no-repeat;
      background-size: contain;
    }
  }
}

.a8d588da0cd5427483bd891bb827c114.b4855c7dd584f8647c38f8fe86498b6f {
  & ._1da7cdd9c328dbb5f1d1e4fcef2e7fe5 {
    font-size: 14px;
  }

  & ._15046b843f94a1a1b4a93a674b503643 {
    width: 221px;
    height: 44px;
    font-size: 14px;
  }
}

._35cdf5c2de7d8099de3b07313427f15c {
  opacity: 0;
}

._35cdf5c2de7d8099de3b07313427f15c.c1883b980e9f5e56638a2378238a68ab {
  opacity: 1;
}

.f8b22e4fd309979e7fcce695ae9674e3 {
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: var(--white);

  & ._646430c15319ce1d38f6ccdc4c8095fc {
    margin: 0 auto;
    width: 100%;
    max-height: 260px;
    box-sizing: border-box;
    line-height: 1.5;
  }

  & ._3c4ceef4ae267837dfdb63e26fe36a69 {
    color: #a0a0a0;
  }

  & ._1780c590cae1e76cea7df645a88a33f7 {
    font-size: 14px;
    text-align: right;
    display: inline-block;
    position: absolute;
    right: 8px;
    bottom: 8px;
    color: var(--placeholder-gray);
  }
}

.f8b22e4fd309979e7fcce695ae9674e3._691aa0ec1a80cece0e23195c1d0f2172 {
  & ._1780c590cae1e76cea7df645a88a33f7 {
    font-size: 11px;
    bottom: 6px;
  }
}

.f8b22e4fd309979e7fcce695ae9674e3.ba49037bd4c2cc29ed04edcfc3ff0d17 {
  & textarea {
    color: var(--validation-error-red);
    border-color: var(--validation-error-red);
  }

  & ._3c4ceef4ae267837dfdb63e26fe36a69 {
    color: var(--validation-error-red);
  }

  & ._1780c590cae1e76cea7df645a88a33f7 {
    color: var(--validation-error-red);
  }
}

._13401ca429e1f512b053ea81bf722ec8 {
  width: 570px;
  padding: 70px;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  & ._1ed9df8776c917b1a8fd5ba56b8efac9 {
    font-size: 20px;
    font-weight: bold;
  }

  & ._7dbc6b98c554e476af4ea2779cd5f416 {
    margin-top: 30px;
    margin-bottom: 50px;
    font-size: 16px;
  }

  & ._7b65993f1caeb5ff6ad92a9f77d8336d {
    display: flex;
    width: calc(100% - 20px);
    min-height: 50px;
    justify-content: space-between;

    & ._4cc01234d39f3cfd85cb8d29984a7daf,
    & ._71d1ddb2c52d48ccb02ccb9ad226cbfb {
      height: 54px;
      width: calc(50% - 20px);
    }

    & ._4cc01234d39f3cfd85cb8d29984a7daf {
      color: var(--white);
      background-color: var(--black);

      &:hover {
        background: var(--gray);
      }

      &[disabled],
      &[disabled]:hover {
        background-color: var(--light-gray);
        color: #aaa;
      }
    }
  }

  & ._55cc9029fd4b8fe156b5c6b14f34e9ff {
    position: absolute;
    width: 48px;
    height: 48px;
    top: -64px;
    right: -64px;
    background: url(/assets_pack/icon_close_white-50a5e31c61a2c0809d539b21237b89af.svg) no-repeat;
    &:hover {
      background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
    }
  }
}

._13401ca429e1f512b053ea81bf722ec8.c3261e4681fb94bbf0a9f146632a1231 {
  width: 100vw;
  height: 100vh;
  padding: 40px 0;
  box-sizing: border-box;

  & ._1ed9df8776c917b1a8fd5ba56b8efac9 {
    font-size: 16px;
    line-height: 1.7;
  }

  & ._7dbc6b98c554e476af4ea2779cd5f416 {
    width: 240px;
    margin-bottom: 30px;
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
  }

  & ._7b65993f1caeb5ff6ad92a9f77d8336d {
    display: flex;
    flex-direction: column-reverse;
    width: 230px;
    margin: 0 auto;

    & ._4cc01234d39f3cfd85cb8d29984a7daf,
    & ._71d1ddb2c52d48ccb02ccb9ad226cbfb {
      height: 44px;
      width: 230px;
      font-size: 16px;
      font-weight: bold;
    }

    & ._71d1ddb2c52d48ccb02ccb9ad226cbfb {
      margin-bottom: 10px;
    }

    & ._4cc01234d39f3cfd85cb8d29984a7daf {
      color: var(--black);
      background-color: var(--white);
      border: 2px solid var(--black);

      &[disabled],
      &[disabled]:hover {
        background-color: var(--light-gray);
        color: #aaa;
        border-color: var(--light-gray);
      }
    }
  }

  & ._55cc9029fd4b8fe156b5c6b14f34e9ff {
    top: 20px;
    right: 16px;
    width: 18px;
    height: 18px;
    background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;
  }
}

.cc441d4cc264780a0f51a43d476cfd6d {
  position: relative;
  width: 720px;
  padding: 60px 48px;
  background: var(--white);
  text-align: center;
  box-sizing: border-box;

  & .ed14bd4b22f0d7791b57ff34833a8702 {
    display: block;
    margin: 20px auto;
    width: 620px;
    height: 126px;
    font-size: 14px !important;
    line-height: 1.8 !important;
    background-color: var(--light-yellow);
  }

  & .ce22d119262f8dedfedb5c09c35ff400 {
    width: 262px;
    height: 52px;
    font-weight: bold;

    &:focus {
      outline: 0;
    }
  }
}

._719df4a6c10d852d8a9850e1c3b7782b {
  position: absolute;
  top: -64px;
  right: -64px;
  width: 48px;
  height: 48px;
  cursor: pointer;
  background: url(/assets_pack/icon_close_white-50a5e31c61a2c0809d539b21237b89af.svg) no-repeat;

  &:hover {
    background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
  }
}

._719df4a6c10d852d8a9850e1c3b7782b._983427038f44370a931c1c1b50fbdb26 {
  top: -60px;
  right: 0;
  width: 44px;
  height: 44px;
}

.cc441d4cc264780a0f51a43d476cfd6d._983427038f44370a931c1c1b50fbdb26 {
  width: 300px;
  padding: 40px 0;

  & .ed14bd4b22f0d7791b57ff34833a8702 {
    margin: 15px auto 20px;
    padding: 10px;
    width: 230px;
    border-width: 2px;
    font-size: 13px;
    line-height: 1.7;
  }

  & .ce22d119262f8dedfedb5c09c35ff400 {
    width: 230px;
    height: 44px;
    font-weight: bold;
    border-radius: 4px;
  }
}

.de0d0d25f1696f4ed37c164ecd0340ce {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  background-color: rgba(100, 100, 100, .95);
  z-index: var(--operator-comment-layer);
  overflow: hidden;

  & p,
  & a {
    margin: 0;
    color: var(--white);
    font-size: 24px;
    font-weight: normal;
    opacity: 0;
    white-space: nowrap;
  }
}

.de0d0d25f1696f4ed37c164ecd0340ce._5e68b53e6a1e3468ee1c4d08e0a44809 {
  & p,
  & a {
    font-size: 18px;
  }

  @media screen and (max-width: 500px) {
    & p,
    & a {
      font-size: 12px;
    }
  }
}

.de0d0d25f1696f4ed37c164ecd0340ce._7e2c6a879de0681caf8f4f55c8dc5519 {
  & p,
  & a {
    margin: 0 auto;
    text-align: center;
    opacity: 1;
  }
}

.de0d0d25f1696f4ed37c164ecd0340ce.dbfde7673a5da004581458afb959e3da {
  & p,
  & a {
    text-align: left;
    animation-name: e83d2795d8ff2506e49e1b7f1003faf6;
    animation-duration: 8s;
    animation-timing-function: linear;
    opacity: 1;

    /* 最後は見えなくなって欲しい */
    transform: translateX(-100%);
  }
}

@keyframes e83d2795d8ff2506e49e1b7f1003faf6 {
  from {
    transform: translateX(100%);
  }

  to {
    transform: translateX(-100%);
  }
}

._425019e256d31caa519caa1c3b91cc08 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 24px;
  color: var(--white);
  background-color: var(--optional-label-gray);
  font-size: 14px;
}

.d9de5e43c895a503ff0a9bfa9aac213b {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 24px;
  color: var(--white);
  background-color: var(--red);
  font-size: 14px;
}

._628baab6c507911df87c97729c9291e4 {
  display: inline-block;
  justify-content: flex-start;

  & ._1976460bcc4932590003014d6179848c {
    background-size: contain;
    margin-top: 2px;
    margin-right: 4px
  }

  & ._54852c68b7540b5e1dd81a600184397b {
    background-image: url(/assets_pack/icon_lock-9728146f2e32183506c4512b47f72280.svg);
  }
}

._628baab6c507911df87c97729c9291e4.aa489c224218b73999c9dc6ac75ae32e {
  color: var(--white);

  & ._54852c68b7540b5e1dd81a600184397b {
    background-image: url(/assets_pack/icon_lock_white-97f3f94adbec23a3140e4bc1e38324b8.svg);
  }
}

._672b91e12b810795bf565e6abe683b1f {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin: 0 0 20px;
  padding: 0 21px;

  & ._4102b8c73ad2a3025173c52b0e5e01b8 {
    width: 455px;

    & ._3f1c9b639339b47aaedc8accd396e1d4 {
      color: var(--white);
      background-color: transparent;
      border-color: var(--white);
    }

    & ._0023be748eee22b5adcc139aa82003be {
      margin-top: 2px;
      margin-left: 20px;
    }

    & .ae68c758bb1c39d059920e5d49f6e977 {
      margin: 12px 0 0;
      color: var(--white);
      font-size: 16px;
      font-weight: bold;
      letter-spacing: .6;
      line-height: 24px;
      word-break: break-all;
      overflow: hidden;
    }
  }

  & .e59d7360e4e3e2c2c20f491a8276bbd2 {
    margin-left: auto;
  }
}

._672b91e12b810795bf565e6abe683b1f.e947c52368069eaeac3b40594d1d1eac {
  & ._4102b8c73ad2a3025173c52b0e5e01b8 {
    & ._3f1c9b639339b47aaedc8accd396e1d4 {
      color: var(--watch-modal-header-white-disabled);
      border-color: var(--watch-modal-header-white-disabled);
    }

    & .ae68c758bb1c39d059920e5d49f6e977 {
      color: var(--watch-modal-header-white-disabled);
    }
  }
}

._35397a2e2f994b1cc73c2a39024a0758 {
  display: flex;
  justify-content: flex-end;
  align-items: center;

  & > *:first-child {
    margin-right: 8px;
  }
}

._4354ca5d8c2ced550d0ff18a909be34d {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
  height: 264px;
}

._664007d20988a359395c75e65915a9fb {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin: 20px 0 0;
  width: 853px;
  box-sizing: border-box;
  flex-wrap: nowrap;

  & ._4757f22fb775d3a826795fab25c05744 {
    width: calc(100% - 74px - 42px);

    & .cb83ea2250d152c288a8a8ddb852495a {
      margin-top: 8px;
      padding-left: 13px;
    }
  }

  & .c858f7f27f653be397b29ef97cf9b2a5 {
    flex-shrink: 0;
    margin-left: auto;
  }
}

._664007d20988a359395c75e65915a9fb._7588ecb67590c14f1f72938cac608e68 {
  & ._4757f22fb775d3a826795fab25c05744 {
    & .cb83ea2250d152c288a8a8ddb852495a {
      & ._500d7a1d51187fd2af4ab50d0aa11560 {
        color: var(--watch-modal-header-white-disabled);
      }

      & .c553c04c14feeae032bf763a05026a27 {
        color: var(--watch-modal-header-white-disabled);
      }
    }
  }
}

._29ba166f4ad93845a0e8b74f3f0594a3 {
  list-style: none;
  margin: 0;
  padding: 0 21px;
  flex: 1;
  font-size: 12px;

  & li {
    display: inline-block;
    margin-right: 20px;
    color: var(--white);

    &:first-child {
      margin-right: 40px;
    }

    &:last-child {
      margin-right: 0;
    }

    & ._1aef2d122bfceb5b6491a1846f83ae74 {
      margin: 0;
      line-height: 1.6;

      & a {
        display: inline-block;
        color: var(--white);
        text-decoration: none;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        vertical-align: top;
        max-width: 16em;

        &:hover {
          text-decoration: underline;
        }
      }
    }
  }
}

._29ba166f4ad93845a0e8b74f3f0594a3._5e527a6ebbb186b4b8d0a9579687fc48 {
  & li {
    color: #6C6C6C;

    & ._1aef2d122bfceb5b6491a1846f83ae74 {
      & a {
        color: var(--watch-modal-header-white-disabled);
      }
    }
  }
}

._5a70bc57f1edb2f9840e74850b481444 {
  position: absolute;
  top: 0;
  left: 21px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 832px;
  height: 100%;
  z-index: var(--modal-layer);
  background-color: var(--white);

  & .b9d4a2bd3241084e52df7ab44a5d77f2 {
    margin: 0 19px 0 52px;
    width: 340px;
    height: 340px;
    background: url(/assets_pack/nicolive_use_q_pc-14acb8b7774be621f390ac6d01c16b7a.png) no-repeat center center / contain;
  }

  & ._8e103c16b75bb845648a519e62b6d3b9 {
    width: 382px;
    box-sizing: border-box;

    & ._2e1b7f9873fb097db07a9b7fc96d1580 {
      color: var(--black);
      font-size: 20px;
      font-weight: bold;
      line-height: 1.4;
      text-align: center;
    }

    & ._4382a350efd97f0518289c5529895f41 {
      margin-top: 1em;
      color: var(--black);
      font-size: 15px;
      line-height: 1.7;
    }
  }
}

._87e741f09b86250cc33a80c2514f3add {
  position: absolute;
  bottom: 16px;
  right: 16px;
  font-size: 12px;
  color: #999;

  &:hover {
    color: #ccc;
  }
}

._98f9281a7dfb1b0b0955b184345816d1 {
  @mixin animation-hover;
  position: absolute;
  top: 32px;
  right: 32px;
  width: 32px;
  height: 32px;
  cursor: pointer;
  background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;

  &:hover {
    background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
  }
}

._2ca50db3c2d6b21211de366f005b065c {
  position: absolute;
  top: 0;
  left: 21px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 832px;
  height: 100%;
  background-color: var(--white);
  z-index: var(--modal-layer);

  & ._706fc37dd780e74efd26d3827204d165 {
    @mixin animation-hover;
    position: absolute;
    top: 32px;
    right: 32px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;

    &:hover {
      background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
    }
  }

  & ._519032ef549881482ea01ab54ac86297 {
    background-image: url(/assets_pack/play_sample-9a8378ab408e667f7edceb554b271faa.png);
    background-size: contain;
    margin: 0 40px;
    width: 330px;
    height: 270px;
  }

  & ._2a6d3a386f17cd7e070d3d6c5c7d51ed {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    align-content: flex-start;
    padding: 60px 0 40px;
    width: 382px;
    height: 100%;
    box-sizing: border-box;

    & ._14bd9aa5fbcc689b9585cc53d30c3fe7 {
      color: var(--black);
      font-size: 20px;
      font-weight: bold;
      line-height: 30px;
      text-align: center;
      letter-spacing: 0.62px;
    }

    & ._642a98b500d68a59e961dd4467b391e9 {
      margin-top: 20px;
      color: var(--black);

      & p {
        font-size: 15px;
        line-height: 28px;
        margin: 0px;
        text-align: left;
      }
    }

    & ._472a865e3561fe762a45fa78841119a0 {
      margin-top: 40px;
      width: 246px;
      height: 58px;
      font-size: 16px;
    }

    & .ed426aaa5e2c7a9f112507ba4e6d2b8d {
      font-size: 13px;
    }

    & ._159219693b5d9712baa08ae62cad5e5c {
      margin-top: auto;
      padding: 20px;
      width: 100%;
      box-sizing: border-box;
      background-color: #f5f5f5;

      & ._642a98b500d68a59e961dd4467b391e9 {
        margin-top: 0px;

        & p {
          margin: 0px;
          font-size: 15px;
          line-height: 24.2px;
          font-weight: bold;
          letter-spacing: 0;
          text-align: center;
        }
      }

      & ._436c59133c79e13c8fede76bb5fef2ff {
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;

        & ._5fae8b5992c5f873de4d51cfac52ce35,
        & ._56ce22728970dd7e0eeab05249e082c8,
        & .b778cdf359eb96827b629e93537ab319,
        & ._92fb292fe8ea0e9f9681d15b7ae370f6 {
          padding: 0;
          height: 58px;
          font-size: 16px;
          letter-spacing: 0;
        }

        & ._56ce22728970dd7e0eeab05249e082c8,
        & .b778cdf359eb96827b629e93537ab319,
        & ._92fb292fe8ea0e9f9681d15b7ae370f6 {
          width: 246px;
          height: 58px;
        }

        & ._5fae8b5992c5f873de4d51cfac52ce35 {
          width: 166px;
          margin-right: 10px;
        }

        & ._5fae8b5992c5f873de4d51cfac52ce35 + ._56ce22728970dd7e0eeab05249e082c8 {
          width: 166px;
        }
      }
    }
  }

  & ._2a6d3a386f17cd7e070d3d6c5c7d51ed._369c66b45f1a540b9de111055cb83f57 {
    padding-top: 94px;
  }
}

.bc6f6e2165abab7bd2fe20e5f5a7e21d {
  padding: 9px 12px 14px;
  max-width: 351px;
  min-width: 294px;
  width: 100%;
  border-radius: 6px;
  box-sizing: border-box;

  & .a1a59f13d6228a33cffd554ec9dd1498 {
    display: flex;
    justify-content: flex-start;
    align-items: center;

    & .a4dc940e7345a01e3277a1e7d30bd0ae {
      margin-left: auto;

      & div {
        width: 75px;
        height: 18px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
      }
    }
  }

  & ._56d298c8dfe7cd52b39227ad997f7468 {
    position: relative;
    margin: 6px 0 0;

    &:before {
      content: '';
      display: block;
      padding-top: 56.25%; /* 16:9に固定 */
    }

    & .b6488ddf773c30d404bdb46f14f1cdc4 {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
    }
  }

  & ._56d298c8dfe7cd52b39227ad997f7468._25214111c085f2b06226dca540cadd76 {
    &:before {
      padding-top: 0;
    }
  }

  & ._6a31e5092df56c0ec1cfea4c8782e9a7 {
    margin: 18px 0;
    background-color: var(--white);

    & .ba302d56e3666b6128d6a12f97618495 {
      margin: 0;
      font-size: 18px;
      line-height: 1.8;
      font-weight: bold;

      &::before,
      &::after {
        background-color: var(--white);
      }
    }
  }

  & .f09980ae8b938a0350bb55ab48e2e50b {
    display: block;
    margin: 0 auto;
    width: 150px;
    height: 40px;
    font-size: 14px;
  }

  & ._5592ed74a2bded8eb2bf49c0a85705ff {
    display: flex;
    justify-content: center;
    align-items: center;

    margin: 18px 0 0;
  }
}

.bc6f6e2165abab7bd2fe20e5f5a7e21d._220218dbb064b896e016bdf8bab35f96 {
  background-color: var(--white);
  border: 1px solid #c8c8c8;

  & .a1a59f13d6228a33cffd554ec9dd1498 {
    & .a4dc940e7345a01e3277a1e7d30bd0ae {
      & div {
        background-image: url(/assets_pack/logo-d05e4aa253a5772becafe536d41095b4.svg);
      }
    }
  }

  & .ba302d56e3666b6128d6a12f97618495 {
    color: var(--black);
  }
}

.bc6f6e2165abab7bd2fe20e5f5a7e21d.d53a85b2df8384fe6f1fa8ea9e39bd7e {
  background-color: var(--black);
  border: 1px solid var(--black);

  & .a1a59f13d6228a33cffd554ec9dd1498 {
    & .a555cc4886f9bcf9468c031863b1b4e0 {
      color: var(--white);
      border-color: var(--white);
      background-color: var(--black);
    }

    & .a4dc940e7345a01e3277a1e7d30bd0ae {
      & div {
        background-image: url(/assets_pack/logo_white-dc0c1b51b24dd6e1a0ea43649d8bfdb3.svg);
      }
    }
  }

  & ._6a31e5092df56c0ec1cfea4c8782e9a7 {
    background-color: var(--black);

    & .ba302d56e3666b6128d6a12f97618495 {
      color: var(--white);

      &::before,
      &::after {
        background-color: var(--black);
      }
    }
  }
}

.bc6f6e2165abab7bd2fe20e5f5a7e21d._2c5506e0e2f991d1137adc86c7757e40 {
  & .ba302d56e3666b6128d6a12f97618495 {
    text-align: center;
  }
}

.bc6f6e2165abab7bd2fe20e5f5a7e21d._6caa2825facfd081affc91799c60f41f {
  & ._6a31e5092df56c0ec1cfea4c8782e9a7 {
    width: 100%;
    overflow: hidden;

    & .ba302d56e3666b6128d6a12f97618495 {
      position: relative;
      height: calc(18px * 1.8 * 2); /* font-size * line-height * 行数 */

      &::before {
        position: absolute;
        content: '...';
        top: calc(18px * 1.8 * 1);
        right: 0;
      }

      &::after {
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
      }
    }
  }

  & .f09980ae8b938a0350bb55ab48e2e50b {
    color: #B6BC0E;
    background-color: var(--accent-color);

    &:hover {
      color: #B6BC0E;
      background-color: var(--accent-color);
    }
  }
}

._9d838c917d54dfbd7345b937755e5c69 {
  position: absolute;
  top: 0;
  left: 21px;
  width: 832px;
  height: 100%;
  z-index: var(--modal-layer);

  & ._9e82061037c5cc7d5ddd97508be63863 {
    position: relative;
    padding: 0 40px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background-color: var(--white);
    box-sizing: border-box;

    & ._13663aee7b8e3a2a10d087f77c50fcfb {
      @mixin animation-hover;
      position: absolute;
      top: 32px;
      right: 32px;
      width: 32px;
      height: 32px;
      cursor: pointer;
      background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;

      &:hover {
        background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
      }
    }

    & .bdaa6039189800bd6384655883db116c {
      margin-left: 40px;
      width: 361px;

      & .bea0024c4ccc174df9c173413e0fc5b3 {
        margin: 0;
        padding: 24px 0;
        font-size: 20px;
        font-weight: bold;
        letter-spacing: 0.62px;
        text-align: center;
        color: var(--black);
        border-bottom: 1px solid var(--black);
      }

      & ._87949e12d237e97ee9df43216830eb95 {
        margin: 26px 0 0;

        & .fb51e31b512e79c40952e298eb8ebe7f {
          margin: 0;
          font-size: 14px;
          color: var(--black);
          text-align: left;
        }

        & ._3d82ba48ec16e77c9b324ce7c087f66c {
          display: flex;
          justify-content: flex-start;
          align-items: center;
          margin-top: 16px;

          & ._9f5c18fd1b3da27b5652f1e8437209f8 {
            flex-wrap: nowrap;
          }

          & > ._9f5c18fd1b3da27b5652f1e8437209f8:first-child {
            margin-right: 16px;
          }

          & .a5cf07f1b48f07b26884fa3c0892c039 {
            font-size: 15px;
          }
        }
      }

      & .a7d470183f49411f4c8382ea7c845a1f {
        margin-top: 24px;
        width: 100%;
        height: 110px;
        font-size: 12px;
        color: var(--black);
        line-height: 19px;
      }

      & ._50585d125fcdca54540c7fc8f5d529de {
        margin-top: 20px;
        display: flex;
        justify-content: flex-end;
        align-items: flex-start;

        & ._1ae2d4e9c68d7fe8aaf8c99c8ed1dd8a {
          margin: 0;
          width: 83px;
          height: 30px;
          font-size: 14px;
          font-weight: normal;
          color: var(--black);
        }
      }
    }
  }
}

.c0a39618584202956479a6f09eb8fe8f {
  position: absolute;
  top: 0;
  left: 21px;
  width: 832px;
  height: 100%;
  z-index: var(--modal-layer);

  & ._57f0c97d16bca21996146d61393bdd62 {
    position: relative;
    padding: 48px 16px 16px;
    width: 100%;
    height: 100%;
    max-height: 100%;
    background-color: var(--white);
    box-sizing: border-box;
    word-break: break-all;
    overflow: auto;

    & .c727657ead79349afd9af269e461425c {
      @mixin animation-hover;
      position: absolute;
      top: 32px;
      right: 32px;
      width: 32px;
      height: 32px;
      cursor: pointer;
      background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;

      &:hover {
        background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
      }
    }

    & .c0418869455dfccadc93c812b47cdcd6 {
      margin: 0 auto;
      width: 96px;
      height: 94px;
      background-image: url(/assets_pack/icon_cracker_black-52d0b4fcb4e20e6bddc3001a829becb8.svg);
      background-position: center;
      background-size: contain;
      background-repeat: no-repeat;
    }

    & ._2479df16988fab9e093d62cb68bc9018 {
      margin: 32px 0 0;
      font-size: 22px;
      font-weight: bold;
      letter-spacing: 0;
      text-align: center;
    }

    & ._1457ed420f97d16d82492fe2ee3e15dc {
      margin: 42px 0 0;
      color: var(--black);
      font-size: 18px;
      text-align: center;
      line-height: 2;
    }

    & .cf0f301ab5162a0e07bf9cca917bf037 {
      margin: 24px 0 0;
      font-size: 18px;
      font-weight: bold;
      text-align: center;
    }
  }
}

._06f688ad79a1e0973a2999b9c0170179 {
  position: relative;
  padding-bottom: 32px;
  z-index: var(--watch-modal-layer);
  opacity: 0;

  & ._8f22dea40a24816345df527836199891 {
    position: relative;
    width: 874px;
    text-align: center;
    box-sizing: border-box;

    & ._0c32fa7800c6a1a46647afd5e9a79014 {
      position: absolute;
      top: 0;
      right: -57px;
    }
  }

  & ._85a69d47b3db752fd8324c3463345000 {
    margin: 0 21px;
    height: 0;
    overflow: hidden;
  }

  & .ae42330e063047626684ff04350cf1e4 {
    position: relative;
    top: -126px;
    opacity: 0;
  }

  & .f376dbf1ef6153f19bed73dee62298f0 {
    position: relative;
    top: -264px;
    opacity: 0;
  }

  & ._90b636597da572454e6a5d124a7ddfdf {
    position: relative;
    display: block;
    margin: 40px auto 0;
    opacity: 0;
    visibility: hidden;
    transform: translate(0, -50%);
  }
}

._06f688ad79a1e0973a2999b9c0170179.da58757ec21c94f6e3e2e905aaf5bba3 {
  & .e73d87f7321205de504f779bd7c4cb3b,
  & .d8ec64ffb16d397bbb53456a7afe73d6 {
    position: relative;

    &::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }
  }

  & ._8f22dea40a24816345df527836199891 {
    & ._0ff23ef673b8d29361882c47be480c5e {
      opacity: 0;
    }

    & ._0c32fa7800c6a1a46647afd5e9a79014 {
      &::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
    }
  }
}

._06f688ad79a1e0973a2999b9c0170179.c6facba573a1d6d330b151e196d817f8 {
  opacity: 1;
}

._06f688ad79a1e0973a2999b9c0170179._3ff9be7f127aeba51200e4e2d7fe3c79 {
  & ._85a69d47b3db752fd8324c3463345000 {
    transition: height .6s ease-out;
  }

  & .ae42330e063047626684ff04350cf1e4 {
    border-top: 1px solid #393939;
    top: 0;
    opacity: 1;
    transition: all .6s ease-out;
  }

  & .f376dbf1ef6153f19bed73dee62298f0 {
    border-top: 1px solid #393939;
    top: 0;
    opacity: 1;
    transition: all .75s ease-out;
  }

  & ._90b636597da572454e6a5d124a7ddfdf {
    animation-name: _9776e38cdd56301cb4f52799da2a8c93;
    animation-duration: .5s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
    visibility: visible;
  }
}

@keyframes _9776e38cdd56301cb4f52799da2a8c93 {
  0% {
    transform: translate(0, -50%);
    opacity: 0;
  }

  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}
._70fbee865eb5504bb5687dc3b0a55b2d {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 874px;
  min-height: 628px;
}

.a9fc787634784f6ef6ace6245424cae7 {
  @mixin animation-hover;
  position: absolute;
  top: 0;
  right: -57px;
  width: 48px;
  height: 48px;
  cursor: pointer;
  background: url(/assets_pack/icon_close_white-50a5e31c61a2c0809d539b21237b89af.svg) no-repeat;
  z-index: var(--watch-modal-close-button-layer);

  &:hover {
    background: url(/assets_pack/icon_close_hover-9cf773ef26699132fd30878735431a3c.svg) no-repeat;
  }
}

.a9fc787634784f6ef6ace6245424cae7._5f60cbfc0adeda3b1753b120a8a77d95 {
  display: none;
}

._01056c3d993112c5694244cd460d9bb2 {
  position: relative;

  & .e75fd69104e79a03c23ae06b868bcc81 {
    position: sticky;
    top: var(--sp-common-header-height);
    left: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 0 12px;
    width: 100%;
    box-sizing: border-box;
    height: 48px;
    background-color: var(--play-black);
    z-index: 1;

    & ._888236188beea2d8574b978f63665f99 {
      margin-right: 8px;
    }
  }

  & .e59aa0421a1135f695a0a7c2465bfff4 {
    position: sticky;
    top: calc(var(--sp-common-header-height) + 48px);
    left: 0;
    z-index: 1;
  }

  & ._858a9898ef9d33bbeb93fef36d703774 {
    display: block;
    margin: 32px auto;
  }

  & .a59b7a68034e6003573ef709ae901178 {
    margin: 12px 0 0;
    padding: 0 12px;
  }

  & ._644d3638f14ca60b7bc2698185063b44 {
    margin: 12px 0 0;
  }

  & .b15a1df9be673e6cb5687e874f2784f4 {
    border-top: 1px solid #393939;
  }

  & ._3fccad66bc6af9f8468be7d84fa2c2a3 {
    border-top: 1px solid #393939;
  }

  & .a1380c54aea201d8dde2d379b63702bb {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 24px;
    padding-bottom: 24px;
  }
}

._01056c3d993112c5694244cd460d9bb2.f402f2edbcb2899879e3739548b2b1cd {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 0;

  & .e75fd69104e79a03c23ae06b868bcc81,
  & ._858a9898ef9d33bbeb93fef36d703774,
  & .a59b7a68034e6003573ef709ae901178,
  & ._644d3638f14ca60b7bc2698185063b44,
  & .a1380c54aea201d8dde2d379b63702bb,
  & ._7852d7771c2bf8573d6bb92885c35a7a {
    display: none;
  }

  & .e59aa0421a1135f695a0a7c2465bfff4 {
    position: relative;
    top: 0;
    left: 0;
  }
}

.b4e093d0c497300c74b342440ef4afc1 {
  & ._9a74e256326dd73e87e6b8151b1e85e4 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 36px;

    & ._8a5234a3f14173ad254e225bfa876f7c {
      color: var(--white);
      background-color: transparent;
      border-color: var(--white);
    }

    & .c4d819e7511ea2d6f32462d08fa2c866 {
      margin-left: auto;
    }
  }

  & .f1b26bd1006003585588b9e81845860b {
    margin-top: 12px;
  }

  & .adc8d5a410cdf7959f45fe19213d96da {
    margin: 12px 0 0;
    font-size: 14px;
    font-weight: bold;
    color: var(--white);
    line-height: 1.8;
    letter-spacing: 0.52px;
    word-break: break-all;
    overflow: hidden;
  }

  & .e6e60e8b54ef3493abcc852561fa6532 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin: 12px 0 0;

    & .aadc96eb0e78fc126204bd753a72c455 {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-wrap: nowrap;
      margin: 0 16px 0 0;
      color: var(--white);
      font-size: 12px;
      line-height: 2;

      & a {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        margin-right: 4px;
        max-width: 16em;
        color: var(--white);
        text-decoration: none;
        -webkit-line-clamp: 1;
        overflow: hidden;
        line-height: 1.6;
      }

      & span {
        flex-shrink: 0;
      }
    }

    & ._73d81d8f347c57eec0c08791da6178e8 {
      margin: 0;
      color: var(--white);
      font-size: 12px;
      line-height: 2;
    }
  }

  & .a8a43a5ce1b2f86b4a065f6cd7428b50 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin: 0;

    & .e05112721e8f7c6ab92778c6804a49ec,
    & .f8c4ece57001ff0c813275019899ed37 {
      margin: 0;
      color: var(--white);
      font-size: 12px;
      line-height: 2;
    }

    & .e05112721e8f7c6ab92778c6804a49ec {
      margin: 0 16px 0 0;
    }
  }

  & .b3666a37f3dede21ed382ca26021643f {
    margin: 8px 0 0;
  }
}

._584771aa771ba67d2ddcb827c4839da1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 180px;
}

.f6e71b428bc87ce69e1a1cadf898a4a1 {
  width: 100%;
}

:root {
  --sp-watch-header-height: 66px;
}

._98693e9978e2b73e4e8a1fe553676e86 {
  padding: 0;
  width: 100%;
  min-height: 100vh;
  background-color: var(--play-black);
  box-sizing: border-box;
  z-index: var(--watch-modal-layer);

  &::after {
    content: '';
    position: fixed;
    top: var(--sp-common-header-height);
    left: 0;
    width: 100%;
    height: 1px;
    background: #121212;
  }

  & ._78a02d5bd4347e5a37550b8f7da728a2 {
    position: sticky;
    top: var(--sp-common-header-height);
    height: 0;
    z-index: var(--watch-modal-close-button-layer);
  }

  & ._8ae8a355dfe970a52f419b5268e846c5 {
    @mixin animation-hover;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 18px;
    height: 18px;
    margin-left: auto;
    cursor: pointer;
    background: url(/assets_pack/icon_close_white-50a5e31c61a2c0809d539b21237b89af.svg) no-repeat;
    background-size: cover;
  }

  & ._12862671ee98d9c79caa227cd0ec1f2f {
    position: absolute;
    top: var(--sp-common-header-height);
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: calc(100vh - var(--sp-common-header-height));
  }
}

._98693e9978e2b73e4e8a1fe553676e86._341f7a819d443518de92032605ae5a88 {
  z-index: var(--watch-modal-landscape-layer);
  padding: 0;
  border-top: none;

  &::after {
    display: none;
  }

  & ._8ae8a355dfe970a52f419b5268e846c5 {
    position: fixed;
    top: 24px;
    right: 24px;
    width: 24px;
    height: 24px;
    z-index: var(--watch-modal-landscape-close-button-layer);
  }

  & ._380f0221fb6afb046ebb4997cd2e26f2 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--black);
  }

  & ._12862671ee98d9c79caa227cd0ec1f2f {
    position: fixed;
    top: 0;
    left: 0;
    min-height: 100vh;
  }
}

._98693e9978e2b73e4e8a1fe553676e86._920746acc001a70c4a8f8d3e34fad88f {
  z-index: var(--watch-modal-layer);

  & ._380f0221fb6afb046ebb4997cd2e26f2 {
    display: none;
  }
}

._79507d9937e39dce858c787678eee7d8 {
  margin: 56px 0 22px;
  width: 100%;
  height: 100%;
  box-sizing: border-box;

  & .eebb8b69e1a8d10dca8cd348fee36dd6 {
    margin-bottom: 40px;
    padding: 0 24px;

    & .f3d254636a14dc48e61609b03982d049 {
      margin: 0;
      padding: 0 0 24px;
      font-size: 18px;
      font-weight: bold;
      letter-spacing: 0.56px;
      text-align: center;
      color: var(--black);
      border-bottom: 1px solid var(--black);
    }

    & ._2704d97d8914128d833864c6f49c9011 {
      margin: 26px 0 0;

      & ._5f4fa65977c07c21f11b124d50dd9729 {
        margin: 0;
        font-size: 15px;
        color: var(--black);
        text-align: left;
      }

      & .ca91aa462a614181706683af59dd5747 {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-top: 16px;

        & ._15c66568f708ed45cdb07cf21291dd08 {
          flex-wrap: nowrap;
        }

        & > ._15c66568f708ed45cdb07cf21291dd08:first-child {
          margin-right: 16px;
        }

        & .dd1f6f6ce91d73c6b51d34f72c224a0d {
          font-size: 15px;
        }
      }
    }

    & ._3182cf0748afcc018fba9b5885b4e560 {
      margin-top: 24px;
      width: 100%;
      height: 110px;
      font-size: 12px;
      color: var(--black);
      line-height: 19px;
    }

    & ._657729abc3bd182ef5e24f20a7fea26d {
      margin-top: 20px;
      display: flex;
      justify-content: center;
      align-items: flex-start;

      & ._7bf330a874b382d902c8f0f129deb673 {
        margin: 0;
        width: 124px;
        height: 44px;
        font-size: 16px;
        font-weight: bold;
        letter-spacing: 0;
        color: var(--black);
      }
    }
  }

  & ._53df8646f1d1a545674a98334018a5b3 {
    padding: 0 12px;

    & ._4a355fc56192ca4caf38b7847fcf1cbf {
      margin: 0 auto;
    }
  }
}

._30e5a2246b18d9226f26b7601491ba29 {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  box-sizing: border-box;
  background-color: var(--white);

  & ._54bce1a3a4884b6583a15873a3d5d7e7 {
    position: absolute;
    top: 20px;
    right: 16px;
    width: 18px;
    height: 18px;
    background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;
  }
}

.ac8110937a31cf857e01acf1793d8a6b {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  min-height: 100vh;
  box-sizing: border-box;
  background-color: var(--white);

  & .a9c80fd46bc5bb9b86b1c1c89d320f9e {
    position: absolute;
    top: 20px;
    right: 16px;
    width: 18px;
    height: 18px;
    background: url(/assets_pack/icon_close-d4db3a5abfb18b3ba3d79f0c04a17e05.svg) no-repeat;
  }

  & ._588937316bc29a08bfc3acadb361e960 {
    padding: 32px 8px;
    word-break: break-all;

    & ._648c3287efd793d3d2afd6bde504ec4b {
      margin: 0 auto;
      width: 84px;
      height: 80px;
      background-image: url(/assets_pack/icon_cracker_black-52d0b4fcb4e20e6bddc3001a829becb8.svg);
      background-position: center;
      background-size: contain;
      background-repeat: no-repeat;
    }

    & .ea5cee2c32d66f29fe07a80f50fbba12 {
      margin: 24px 0 0;
      font-size: 18px;
      font-weight: bold;
      letter-spacing: 0;
      text-align: center;
    }

    & .a1bf1b78bef39b6852cfda6de37eda94 {
      margin: 28px 0 0;
      color: var(--black);
      font-size: 15px;
      text-align: center;
      line-height: 2;
    }

    & ._2102d3a39fa8863477fa86d9e28b377d {
      margin: 20px 0 0;
      font-size: 15px;
      font-weight: bold;
      text-align: center;
    }
  }

  @media screen and (max-width: 350px) {
    & ._588937316bc29a08bfc3acadb361e960 {
      & .ea5cee2c32d66f29fe07a80f50fbba12 {
        font-size: 14px;
      }

      & .a1bf1b78bef39b6852cfda6de37eda94 {
        font-size: 12px;
      }

      & ._2102d3a39fa8863477fa86d9e28b377d {
        font-size: 12px;
      }
    }
  }
}

._9a0598a5a457f84e93d2bde15d4806ea {
  display: block;
  height: var(--header-height);
  background: url(/assets_pack/logo_experiment-b826580c655fa1338b5b1781d8fa148c.svg) no-repeat 50% 50%;
  background-size: contain;
}

._59d8ab09f90a44ba0ae0ecc777b4d033 {
  background-image: url(/assets_pack/logo_experiment_white-0b15d37d60b9221f0c311b944b0511f8.svg);
}

._85b232a4bfc7769fd92c74e42ce47e31 {
  background-image: url(/assets_pack/logo_experiment_gray-0a216e93601a298cb33090e540e6943e.svg);
}

._43c3ea405d601e214d6e96173da54566 {
  background-image: url(/assets_pack/logo_experiment_dark_gray-2bcea03ba9e5af5c18d3de23b87a3de0.svg);
}

.c30fcd99be22f7dc23ecd964df6e62b2 {
  transition: all .15s ease-out;
  position: absolute;
  z-index: 100;
  width: 100%;
  margin: 0 -10px -10px;
  padding: 0 10px;
  opacity: 0;

  &._09705bad47144820d1cfdaac0447efbc {
    opacity: 1;
    padding-bottom: 10px;
  }
}

._755ec6142c4e70f85c8a925456d1167b {
  cursor: pointer;
  position: relative;
  user-select: none;

  & ._5d12cf5f8949ef2ca51dd1842837ff59,
  & .e97bac559e4005af842770d58fadbba2 {
    @mixin animation-hover;
    display: flex;
    align-items: flex-start;
    border: none;
    padding: 12px;
    box-sizing: border-box;
  }

  & ._5d12cf5f8949ef2ca51dd1842837ff59 {
    display: flex;
    flex-direction: column;
    justify-content: center;

    background-color: var(--accent-color);
    background-image: url(/assets_pack/icon_pulldown-f1d30cb9858c5d6a136048b17974e8d1.svg);
    background-repeat: no-repeat;
    background-size: 10px 10px;
    background-position: 95% 50%;
    position: relative;
    overflow: hidden;
    border-radius: 0;
    font-size: 14px;
    font-weight: bold;
    outline: none;

    & span {
      line-height: 1;
    }

    &:hover {
      background-color: var(--accent-color-hover);
    }
  }

  & ._756ee3e60fe59b570f25082e58d0f40b {
    transition: all .15s ease-in-out;
    transform: translateY(-20px);

    width: 100%;
    background-color: var(--white);
    box-shadow: 0 0 4px rgba(0, 0, 0, .3);
    margin-top: 3px;
    padding: 8px 0;

    & .f47a8ea46a0bbcf688ee26122a8082b9 {
      background-color: var(--accent-color);
    }

    & .e97bac559e4005af842770d58fadbba2 {
      width: 100%;

      & .e206cf2c808e741c1d2a0dde54487688 {
        width: 22px; /* 14px + 8px */
        height: 22px;
      }

      & ._8851626ffa00fafb60ef5187be7f03fc {
        margin-top: 4px;
        width: 14px;
        height: 14px;
        background-size: contain;
      }

      & .d181950e9ca3407ce62e645139bcb04b {
        background-image: url(/assets_pack/icon_earth-e3d86b2085e64706557303b3669fc2be.svg);
      }

      & ._0dced1674f4f4b1e70649d7c5114c059 {
        background-image: url(/assets_pack/icon_lock-9728146f2e32183506c4512b47f72280.svg);
      }

      & .b381e4e1a8498274312c1b204d67eaac {
        display: block;
        font-size: 14px;
        flex: 1;

        & ._2bb28a1fe3b19f4f797bddce53a92da5 {
          height: 22px;
          line-height: 22px;
        }

        & ._5c10e0d87cb3a4f365c2169dc19ba52e {
          font-size: 11px;
          line-height: 1.4;
        }
      }

      &:hover {
        background-color: var(--accent-color-hover);
      }
    }
  }
}

._09705bad47144820d1cfdaac0447efbc {
  & ._756ee3e60fe59b570f25082e58d0f40b {
    transform: translateY(0);
  }
}

._55e9fbc767a5d1cf90fca495a683a6cc {
  display: flex;
  align-items: center;
  background: var(--white);
  border-radius: 0;
  width: 330px;
  height: 34px;
}

._7841fe0baad9157b7dd671d7a8c322dc {
  width: 92px;
  height: 34px;
  margin-right: 15px;

  & .fe2eb5e1829984dafbf6be16f05ea0cd {
    width: 92px;
    height: 34px;
    padding: 0 6px;
    line-height: 26px;
    font-weight: bold;
    font-size: 13px;
    box-sizing: border-box;

    & span {
      font-size: 13px;
    }
  }

  & .edbfc0b90257ccc155d88b1cc74d3552 {
    width: 132px;
  }

  & ._0ab604769904f9e68571971a1f940caa {
    width: 132px;
    padding: 6px 0;
    border: none;

    & > div {
      padding: 6px 12px;
    }
  }
}

._3e3efdbfe7a710854563f5c8e42fe63f {
  margin-right: 5px;

  & input {
    font-size: 14px;
    height: 28px;
    width: 178px;
    border: none;
    outline: 0;

    &::placeholder {
      color: #b3b3b3;
    }
  }
}

._9a58e16dfd9d8f87cf8ac6e6364e137e {
  width: 18px;
  height: 18px;
  margin-left: auto;
  margin-right: 10px;
  cursor: pointer;
  background: url(/assets_pack/icon_search-89537a4fc40b03523d9d2328955ac946.svg) no-repeat;
}

._7e9cf1c6451a2a10d3fb3761a1621cc0 {
  position: relative;
  z-index: 1;
  background: #252525;
  height: var(--header-height);

  display: flex;
  align-items: center;

  & ._67a4b823407b007c460a98765178f1eb {
    display: flex;
    align-items: center;
    width: var(--header-width);
    margin: 0 auto;
  }
}

.afd3f4cdb0627b025e0c9e545322da49 {
  display: block;
  width: 325px;
  height: var(--header-height);

  & ._8522f3fb9b6b643fda8f90ac0e740a04 {
    display: block;
  }
}

.e5ccac53197d706da4a175c2163e784b {
  display: flex;
  align-items: center;
  font-size: 16px;
  margin-left: auto;

  & a {
    cursor: pointer;
    color: var(--white);
    font-weight: bold;
    text-decoration: none;
    padding: 10px;

    &:hover {
      color: #ccc;
    }
  }

  & .e45c257bdc08d72bc4d5075555f69622 {
    background: var(--white);
    width: 1px;
    height: 16px;
    margin-left: 10px;
    margin-right: 10px;
  }
}

.e36bc9e670b690a6ad35dfcfcb1fb9f6 {
  margin-left: 26px;
}

._753666eb1da48719aa317343957d6044 {
  width: 100%;
  height: var(--footer-height);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  flex-shrink: 0;

  & ._06579d9e0c7adf3999328969cd73d564 {
    margin-bottom: 16px;
    width: 220px;
    height: 45px !important;
  }

  & ._2a03ffed17d8c0b163eaaefe6d3b7970 {
    font-size: 10px;
    line-height: 1;
  }
}

._753666eb1da48719aa317343957d6044._3cc4658d960233038100bf9ffe0bc996 {
  height: var(--sp-footer-height);

  & ._06579d9e0c7adf3999328969cd73d564 {
    margin-bottom: 8px;
    width: 180px;
    height: 41px !important;
  }

  & ._2a03ffed17d8c0b163eaaefe6d3b7970 {
    transform: scale(0.8);
    line-height: 0.6;
  }
}

._753666eb1da48719aa317343957d6044._0ae03b7006c8b05c3eef841f6fc14010 {
  background-color: var(--white);

  & ._2a03ffed17d8c0b163eaaefe6d3b7970 {
    color: var(--logo-gray);
  }
}

._753666eb1da48719aa317343957d6044._7c513999bc0d147989fe5d8554d339f6 {
  background-color: var(--play-black);

  & ._2a03ffed17d8c0b163eaaefe6d3b7970 {
    color: var(--logo-dark-gray);
  }
}

.acd9416b560e7eb5bb6d389ca73922bb {
  width: 100%;
  background-color: var(--play-black);

  /*
   * IE11で flex 内で min-height を使うためにコンテナを包むラッパーを用意する
   * [参考] 下記ページの Demos 3.2b
   * https://github.com/philipwalton/flexbugs/blob/master/README.md#3-min-height-on-a-flex-container-wont-apply-to-its-flex-items
   */
  & .ea9f5ef33426e644c54311ed206e6d2f {
    display: flex;
    flex-direction: column;
  }

  & ._29a50b4d599d2a51d81b7e60af0905ed {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    margin: 0 auto;
    min-height: calc(100vh - var(--footer-height));
  }
}

.acd9416b560e7eb5bb6d389ca73922bb._5030efa9e54ebcbe269b88bcbaf351be {
  position: relative;
  height: 100%;

  & .ea9f5ef33426e644c54311ed206e6d2f {
    & ._29a50b4d599d2a51d81b7e60af0905ed {
      justify-content: flex-start;
      width: 100%;
      min-height: calc(100vh - var(--sp-footer-height));
      margin-bottom: auto;
    }
  }
}

html {
  background: transparent;
}

body {
  background: transparent;
}

#root {
  width: 100%;
  height: 100%;
}

._20005791bbf6e58aaac8f9b601e8c28c {
  position: relative;
  width: 100%;
  height: 100%;
}

.b7216d439d2d23b2df298605a3e319f9 {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100%;
}

.e4f34bdf61e3ad6fbd9732fafd193d46 {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-width: 1024px;
  margin: 0 auto;
  padding: 110px 0;
}

.d6a7574e820f4f36c292b1dbd32a709b {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin: 0;
  padding: 64px 0;
  width: 100%;
}

._6a84b8f0073aac17ca023e7ab521fb86 {
  height: 100%;
  min-width: 1160px;
}

._6a84b8f0073aac17ca023e7ab521fb86._9ffe1f61582cce3d0cf7d09defa3356f {
  min-width: initial;
}