@charset "utf-8";
/* CSS Document */

body  {
    background-color: rgba(192,162,100,1.00);
    cursor: default;
    height: 100%;
}




/*@keyframes rotate-anime {
		
		0%{transform:rotate(0);}
		100%{transform:rotate(360deg);}}*/
.hole .mons {
    position: absolute;
    margin-left: 10%;
    margin-top: 31%;
    width: 28%;
}
.m1 {
	transform: rotateZ(45deg);
}

.hole .midohole {
    width: 100%;
    transform: translate(-50%, -50%);
    margin-left: auto;
    margin-top: auto;
    margin-right: auto;
    margin-bottom: auto;
    top: 50%;
    position: absolute;
    left: 50%;
    z-index: -6;
    /* [disabled]background-color: rgba(187,148,149,1.00); */
    height: auto;
    
}
.mtet_hani {
    background-color: rgba(203,69,71,0.34);
}
.mhtxt {
   
}

.mtxt {
     position: absolute;
    font-size: 15px;
    margin-right: 0%;
    margin-left: 0%;
    left: 50%;
    right: 0px;
    top: 50%;
    margin-bottom: 0%;
    transform: translate(-50%, -50%);
    bottom: 0px;
    text-align: center;
    margin-top: 4%;
    width: 100%;
    z-index: 0;
    color: rgba(18,14,15,1.00);
}
.mtxt2 {
    position: absolute;
    font-size: 15px;
    text-align: center;
    width: 66%;
    z-index: 788;
    color: rgba(18, 14, 15, 1.00);
    line-height: 1.5;
    background-color: rgba(225,224,220,1.00);
    top: 16%;
    transform: translateX(25%);
    border-radius: 6px;
    border: 2px outset rgba(90,90,90,1.00);
}

.htxt {
    /*    点滅カーソル消し*/
    　user-select: none;
    position: absolute;
    font-size: 50%;
    margin-right: 0%;
    margin-left: 0%;
    left: 50%;
    right: 0px;
    top: 50%;
    margin-bottom: 0%;
    margin-top: 21%;
    transform: translate(-50%, -50%);
    bottom: 0px;
    text-align: center;
    /* [disabled]background-color: #A74A4C; */
    z-index: 200;
}


.hole {
    /*background-color: rgba(241,137,139,0.60);*/
    position: absolute;
    z-index: -7;
    top: 50%;
    left: 50%;
    min-width: 98px;
    transform: translate(-50%, -50%);
    /*	animation: rotate-anime 3s linear infinite;
	*/
    padding-bottom: 82%;
    width: 75%;
}
.black {
    top: 32%;
    position: absolute;
    left: 25%;
    /* [disabled]background-color: rgba(179,69,71,1.00); */
    /* [disabled]width: 0px; */
    /* [disabled]height: auto; */
}
.sbl  {
    width: 88%;
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    right: 0px;
    margin-top: auto;
    margin-bottom: auto;
    top: 0px;
    bottom: 0px;
    transform: translate(-50%, -50%);
    font-size: medium;
}
.blue {
    top: 19%;
    position: absolute;
    left: 73%;
    /* [disabled]background-color: rgba(179,69,71,1.00); */
    /* [disabled]width: 142px; */
    /* [disabled]height: auto; */
}
.sao  {
    /* [disabled]width: 98%; */
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    right: 0px;
    margin-top: auto;
    margin-bottom: auto;
    top: 0px;
    bottom: 0px;
    transform: translate(-50%, -50%);
    font-size: medium;
}
.red {
    top: 49%;
    position: absolute;
    left: 85%;
    /* [disabled]background-color: rgba(179,69,71,1.00); */
    /* [disabled]height: auto; */
}
.sre  {
    /* [disabled]width: 88%; */
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    right: 0px;
    margin-top: auto;
    margin-bottom: auto;
    top: 0px;
    bottom: 0px;
    transform: translate(-50%, -50%);
    font-size: medium;
}.yellow {
    top: 82%;
    position: absolute;
    left: 70%;
    /* [disabled]background-color: rgba(179,69,71,1.00); */
    /* [disabled]width: 190px; */
    /* [disabled]height: auto; */
}
.sye  {
    /* [disabled]width: 88%; */
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    right: 0px;
    margin-top: auto;
    margin-bottom: auto;
    top: 0px;
    bottom: 0px;
    transform: translate(-50%, -50%);
    font-size: medium;
}.white {
    top: 69%;
    position: absolute;
    left: 28%;
    /* [disabled]background-color: rgba(179,69,71,1.00); */
    /* [disabled]width: 142px; */
    /* [disabled]height: auto; */
}
.swh  {
    /* [disabled]width: 88%; */
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    right: 0px;
    margin-top: auto;
    margin-bottom: auto;
    top: 0px;
    bottom: 0px;
    transform: translate(-50%, -50%);
    font-size: medium;
}
.en {
    /* [disabled]width: 13%; */
    /* [disabled]min-width: 153px; */
    height: 0px;
    z-index: 44;
    min-height: 0px;
}

.bltxt  {color: rgba(192,192,192,1.00);
    font-size: 89%;
    /* [disabled]background-color: rgba(111,17,19,1.00); */
    width: 71%;
    height: 65%;
}
.aotxt  {
    color: rgba(192,192,192,1.00);
    font-size: 89%;
    /* [disabled]background-color: rgba(111,17,19,1.00); */
    width: 71%;
    height: 65%;
}
.retxt  {color: rgba(192,192,192,1.00);
    font-size: 89%;
    /* [disabled]background-color: rgba(111,17,19,1.00); */
    width: 71%;
    height: 65%;
}
.yetxt  {
    color: rgba(192,192,192,1.00);
    font-size: 89%;
    /* [disabled]background-color: rgba(111,17,19,1.00); */
    width: 66%;
    height: 65%;
}

.whtxt {
    color: rgba(192,192,192,1.00);
    font-size: 89%;
    /* [disabled]background-color: rgba(111,17,19,1.00); */
    width: 71%;
    height: 65%;
}
.en img {
    width: 100%;
    height: auto;
    left: 0px;
    right: 0px;
    margin-left: auto;
    margin-right: auto;
}


.modoru {
    width: 6%;
    height: auto;
    min-width: 91px;
    position: absolute;
    left: 6%;
    top: 83%;
}
.modoru img {
    width: 100%;
    height: auto;
    min-width: 37px;
}
.en_im_f {
    /*background-color: rgba(203,98,100,0.60);*/
    z-index: 1000;
    position: absolute;
    /* [disabled]top: 66%; */
    top: 64%;
    left: 50%;
    transform: translate(-50%, -5%);
    width: 72%;
    height: 8%;
}
.dynamic-element {
  width: 100%;
  height: auto;
  max-width: 500px; /* 必要に応じて変更してください */
  margin: 0 auto;
}
.hole img {
    width: 20%;
    height: auto;
    transform: translate(-50%, -50%);
    top: 55%;
    position: absolute;
    left: 50%;
}
.hole_gazo {


}

.uwa {
    position: fixed;
    z-index: 49;
   pointer-events: none;

}
.uwa.blao {
    left: 46%;
    top: 7%;

}
.uwa.aord {
    left: 78%;
    top: 32%;
}
.uwa.rdye {
    top: 64%;
    left: 78%;
}
.uwa.yewh {
    top: 78%;
    left: 47%;
}

.uwa.whbl {
    top: 51%;
    left: 25%;
}
.haiti0 {
}
.haiti1 {
}
.haiti2 {
}
.haiti3 {
}
.haiti4 {
}

/* AIに作ってもらったダメージアニメCSS */
@keyframes blinkAnimation {
  0%, 100% {
    opacity: 1; /* 0% と 100% の時点で不透明 */
  }
  50% {
    opacity: 0; /* 50% の時点で透明 */
  }
}

/* アニメーションを適用するクラス */
.im_m_blink {
  animation: blinkAnimation 0.1s 3; /* 1.5秒かけて3回繰り返す */
	
}
.kyokuin_ims {
    z-index: 101;
    position: absolute;
    margin-top: 20%;
    /* [disabled]background-color: #72AD90; */
}


.hole_yokohaba {
    width: 48%;
    position: absolute;
    transform: translate(-50%, -50%);
    /*background-color: rgba(241,137,10,0.60);*/
    top: 50%;
    left: 50%;
}
.item_box {
    position: fixed;
    bottom: 10px;
    right: 10px;
    /* [disabled]background-color: rgba(204,204,204,0.28); */
    padding: 10px;
    /* [disabled]border: 1px solid #000; */
}

.item {
    width: 50px;
    height: 50px;
    /* [disabled]background-color: rgba(255,0,0,0.52); */
    margin-right: 5px;
    display: inline-block;
    position: relative;
}