.modalBattle {
  touch-action: none;  /* タッチ操作のズームを完全に無効化 */
  overscroll-behavior: none; /* スクロールのバウンド効果も無効化 */
  touch-action: manipulation;
  /* position: fixed; */
  bottom: 30%;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999; /* 最前面に表示 */
  display: none;  /* 最初は非表示 */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* 真ん中に調整 */
}

.modalBattle-img {
  touch-action: none;  /* タッチ操作のズームを完全に無効化 */
  overscroll-behavior: none; /* スクロールのバウンド効果も無効化 */
  touch-action: manipulation;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0.9;

  position: absolute;
  top: 39%;
  left: 50%;
  transform: translate(-50%, -50%); /* 真ん中に調整 */
}


.modal_attack-damage {
  position: absolute;
  top: 39%;
  left: 50%;
  transform: translate(-50%, -50%); /* 真ん中に調整 */
  /* font-size: 9rem; */
  font-size: 5rem;
  z-index: 1000000;
  font-weight: bold;
  color: white;

  /* 白い縁取り（実線にするため多重text-shadow） */
  text-shadow:
    -3px -3px 0 #fff,  
    3px -3px 0 #fff,  
    -3px 3px 0 #fff,  
    3px 3px 0 #fff,
    -3px 0 0 #fff,
    3px 0 0 #fff,
    0 -3px 0 #fff,
    0 3px 0 #fff;

  padding: 30px;
  border-radius: 50%;
}




.modal_attack-damage_party {
  position: absolute;
  top: 39%;
  left: 50%;
  transform: translate(-50%, -50%); /* 真ん中に調整 */
  font-size: 3.9rem;
  z-index: 1000000;
  font-weight: bold;
  color: white;

  /* 黒い縁取り（実線にするため多重text-shadow） */
  text-shadow:
    -3px -3px 0 #000,  
    3px -3px 0 #000,  
    -3px 3px 0 #000,  
    3px 3px 0 #000,
    -3px 0 0 #000,
    3px 0 0 #000,
    0 -3px 0 #000,
    0 3px 0 #000;

  /* padding: 30px; */
  padding: 50px;
  border-radius: 50%;
}






/*===============================
パソコン画面用
=================================*/
@media print, screen and (min-width: 820px) {
  /* .modalBattle-img { */
    /* top: 39%; */
  /* } */
  /* .modalBattle {
    top: 10%;
    left: 10%;
  } */
  .modalBattle-img {
    width: 200%;
    height: 200%;

    top: 25%;
    left: 110%;
  }

  .modal_attack-damage {
    /* font-size: 10rem; */
    font-size: 7.9rem;
    top: 25%;
    left: 110%;
  }


  .modal_attack-damage_party {
    /* font-size: 10rem; */
    font-size: 7rem;
    top: 25%;
    left: 110%;
  }


}