@charset "UTF-8";

/* #############################################################################
 * アップローダーへのリンク
 * #############################################################################
 */
.uploader-link {
  margin-bottom: 18px;
}

.uploader-link__frame,
.uploader-link__frame--active {
  /* ---------------------------------------------------------------------------
   * 外枠
   * ---------------------------------------------------------------------------
   */
  /* height: 120px; */
  width: 120px;
  border-radius: 4px;
  position: relative;
  padding: 2px;
  margin-bottom: 18px;
  margin-left: 8px;
  background-color: #ffffff;
  border: 1px solid #591400;
  box-shadow: 0 4px 0 #591400;
  -webkit-transition: all 100ms 0s linear;
  transition: all 100ms 0s linear;
  color: #591400;
  font-weight: 900;
}

.uploader-link__frame:hover,
.uploader-link__frame--active:hover {
  /* -webkit-box-shadow: 0px 0px 20px 3px #591400cc; */
  /* box-shadow: 0px 0px 20px 3px #591400cc; */
}

.uploader-link__frame--active {
  /* 現在開かれている */
  /* -webkit-box-shadow: 0px 0px 8px 6px #fff19dba; */
  /* box-shadow: 0px 0px 8px 6px #fff19dba; */
  background-color: #ff6016;
  color: #ffffff;
}

.uploader-link__acce,
.uploader-link__acce--top,
.uploader-link__acce--bottom {
  /* ---------------------------------------------------------------------------
   * 外枠の装飾
   * ---------------------------------------------------------------------------
   */
  position: absolute;
}

.uploader-link__acce--top {
  /* 上部 */
  width: 111%;
  left: -7px;
  top: -13px;
  z-index: 20;
  display: none;
}

.uploader-link__acce--bottom {
  /* 下部 */
  width: 104%;
  left: -3px;
  top: 108px;
  z-index: 5;
  display: none;
}

.uploader-link__bg,
.uploader-link__bg--chara,
.uploader-link__bg--ss,
.uploader-link__bg--scene {
  /* ---------------------------------------------------------------------------
   * 背景
   * ---------------------------------------------------------------------------
   */
  height: 64px;
  width: 116px;
  z-index: 10;
  /* border-radius: 25px; */
}

.uploader-link__bg::before,
.uploader-link__bg--chara::before,
.uploader-link__bg--ss::before,
.uploader-link__bg--scene::before {
  /* 背景の端を暗く見せる影 */
  /* background: radial-gradient(transparent, rgba(0, 0, 0, 0.3)); */
  /* position: absolute; */
  /* top: 0; */
  /* right: 0; */
  /* bottom: 0; */
  /* left: 0; */
  /* content: ""; */
}

.uploader-link__bg--chara {
  /* キャラ */
  /* background: #961a52 url(../img/common/chara.jpg); */
  /* background-size: cover; */
  /* background-blend-mode: soft-light; */
}

.uploader-link__bg--chara:hover {
  /* キャラ */
  /* background: radial-gradient(#ff0073, rgba(255, 0, 115, 0.6), rgba(255, 0, 115, 0.2)), url(../img/common/chara.jpg); */
  /* background-size: cover; */
  /* background-blend-mode: screen; */
}

.uploader-link__bg--ss {
  /* SS */
  /* background: #013858 url(../img/common/ss.jpg); */
  /* background-size: cover; */
  /* background-blend-mode: soft-light; */
}

.uploader-link__bg--ss:hover {
  /* SS */
  /* background: radial-gradient(#00a1ff, rgba(0, 161, 255, 0.6), rgba(0, 161, 255, 0.2)), url(../img/common/ss.jpg); */
  /* background-size: cover; */
  /* background-blend-mode: screen; */
}

.uploader-link__bg--scene {
  /* シーン */
  /* background: #0c4827 url(../img/common/scene.jpg); */
  /* background-size: cover; */
  /* background-blend-mode: soft-light; */
}

.uploader-link__bg--scene:hover {
  /* シーン */
  /* background: radial-gradient(#00ff73, rgba(0, 255, 115, 0.6), rgba(0, 255, 115, 0.2)), url(../img/common/scene.jpg); */
  /* background-size: cover; */
  /* background-blend-mode: screen; */
}

.uploader-link__click {
  /* ---------------------------------------------------------------------------
   * クリックできるリンク本体
   * ---------------------------------------------------------------------------
   */
  position: absolute;
  height: 100%;
  width: 100%;
  border-radius: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 2rem;
  text-align: center;
  /* -webkit-box-shadow: 0 0 3px 2px #ffffff75 inset; */
  /* box-shadow: 0 0 3px 2px #ffffff75 inset; */
}

/*# sourceMappingURL=uploader-link.css.map */