/*-------------------------------------如月れん*/
#kisaragi {
  background: #400000;
  background-image:
  repeating-linear-gradient(120deg, rgba(255,255,255,.1), rgba(255,255,255,.1) 1px, transparent 1px, transparent 60px),
  repeating-linear-gradient(60deg, rgba(255,255,255,.1), rgba(255,255,255,.1) 1px, transparent 1px, transparent 60px),
  linear-gradient(60deg, rgba(0,0,0,.4) 25%, transparent 25%, transparent 75%, rgba(0,0,0,.4) 75%, rgba(0,0,0,.4)),
  linear-gradient(120deg, rgba(0,0,0,.4) 25%, transparent 25%, transparent 75%, rgba(0,0,0,.4) 75%, rgba(0,0,0,.4));
  background-size: 210px 360px;
  -webkit-backface-visibility: hidden; /* ちらつき防止 */
  backface-visibility: hidden;
  -webkit-transform: translate3d(0,0,0);
}

.kisaragi-top-text,
.kisaragi-profile,
.kisaragi-tag,
.kisaragi-movie {
  /* ベースカラー：ショッキングレッド */
  background-color: #ff1a1a;
  background-image:
    /* 光沢の反射（上部にツヤ帯） */
    linear-gradient(
      135deg,
      rgba(255,255,255,0.9) 0%,
      rgba(255,255,255,0.5) 10%,
      rgba(255,255,255,0.15) 20%,
      rgba(255,0,0,0) 30%
    ),
    /* 中央部のグラデーション（深みを出す） */
    linear-gradient(
      to bottom,
      rgba(0,0,0,0.25) 60%,
      rgba(0,0,0,0.4) 100%
    ),
    /* 縦ライン（椅子の背もたれ風） */
    repeating-linear-gradient(
      to right,
      rgba(255,255,255,0.15) 0px,
      rgba(255,255,255,0.15) 3px,
      rgba(0,0,0,0.2) 3px,
      rgba(0,0,0,0.2) 8px
    );

  /* 立体感と反射を強調 */
  background-blend-mode: screen, multiply, overlay;

  border: 3px solid #a30000;
  border-radius: 12px;
  box-shadow:
    inset 2px 2px 5px rgba(255,255,255,0.6),
    inset -4px -4px 10px rgba(0,0,0,0.8),
    0 8px 18px rgba(0,0,0,0.6);

    
  color: #fff;
}

.kisaragi-top-text {
  width: 100%;
}

.kisaragi-text-wrapper,
.kisaragi-text-wrapper2,
.kisaragi-text-wrapper-long {
  width: 30vw;
  position: relative;
  display: inline-block;
  padding: 10px;
  border-radius: 22px;
  background: linear-gradient(145deg,
    #f2f2f2 0%,
    #cfcfcf 25%,
    #9c9c9c 50%,
    #dcdcdc 75%,
    #ffffff 100%
  );
  box-shadow:
    inset 2px 2px 4px rgba(0,0,0,0.35),
    inset -2px -2px 4px rgba(255,255,255,0.9),
    0 3px 10px rgba(0,0,0,0.5);
}

.kisaragi-top-text h1 {
  text-decoration: underline;
  text-decoration-style: solid;
  text-underline-offset: 15px;
}

.kisaragi-movie {
  width: calc(90vw - 20px);
}

.kisaragi-text-wrapper-long {
  width: 90vw;
  left: 5vw;
}

#kisaragi .top-text,
#kisaragi .basic-profile,
#kisaragi .basic-tag,
#kisaragi .basic-movie {
  animation: none;
  opacity: 1;
}

.kisaragi-text-wrapper2 {
  opacity: 0;
}

.kisaragi-text-wrapper,
.kisaragi-text-wrapper2.animation-start.is-animated,
.kisaragi-text-wrapper-long.animation-start.is-animated {
  animation: appearance 2s ease 0s 1 forwards;
}

.kisaragi-top-text,
.kisaragi-profile,
.kisaragi-tag,
.kisaragi-movie,
.kisaragi-text-wrapper,
.kisaragi-text-wrapper2,
.kisaragi-text-wrapper-long {
  -webkit-border-radius: 12px;
  border-radius: 12px;
}

@media screen and (max-width: 1025px) {
  .kisaragi-text-wrapper {
    width: 40%;
  }
}

@media screen and (max-width: 769px) {
  .kisaragi-text-wrapper {
    width: 50%;
  }

  .kisaragi-text-wrapper2 {
    width: 40%;
  }
}

@media screen and (max-width: 426px) {
  .kisaragi-text-wrapper {
    width: 90%;
  }

  .kisaragi-text-wrapper2 {
    width: 90%;
  }
}