@charset "utf-8";

@media only screen and (max-width: 767px) {

}

@media only screen and (min-width: 768px) {

}

html {
width: 92vw;
height: 90vh;
}

body {
touch-action: manipulation;
width: 92vw;
height: 90vh;
//position: absolute;
text-align: center;
margin: 0;
background: green;
color: #fff;
font-size: 5vh;
font-weight: bold;
-webkit-touch-callout: none;
}

button {
width: 40.5vh;
font-size: 4.5vh;
font-weight: bold;
margin-top: 1vh;
}

a {
color: #333;
background-color: #fff;
text-decoration: none
}
a:hover {color:#fff; background:#00c;
}
a:active {
color:#00c;
}

main {
left: auto;
//background-color: pink;
}

ul {
margin: 0;
padding: 0;
list-style-type: none;
}

input {
transform:scale(1.5);
}

#suteetasu {
z-index: 0;
display: none;
text-align: left;
position: absolute;
top: 0vh;
left: 0vh;
width: 7em;
margin: 0;
font-size: 3.5vh;
}

#yame {
display: none;
position: absolute;
top: 1vh;
right: 0.5vh;
width: auto;
}

#setu {
margin-bottom: 1vh;
}

.firudo {
position: absolute;
top: 46vh;
left: 50vw;
transform: translate(-50%, -50%);
//    -webkit-transform: translate(-50%, -50%);
//    -ms-transform: translate(-50%, -50%);
width: 45vh;
height: 90vh;
background: green;
}


#nabi {
z-index: 3;
width: 45vh;
position: absolute;
top: 30vh;
left: 22.5vh;
transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
background-color: #333;
}

#yamegamen {
display: none;
z-index: 3;
width: 45vh;
position: absolute;
top: 40vh;
left: 22.5vh;
transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
background-color: #333;
}

#tama {
position: absolute;
width: 4vh;
height: 4vh;
top: 75vh;
left: 23vh;
transform: translate(-50%, -50%);
//    -webkit-transform: translate(-50%, -50%);
//    -ms-transform: translate(-50%, -50%);
}

#batto {
z-index: 1;
width: 2.5vh;
height: auto;
position: absolute;
top: 63vh;
left: 16vh;
transform: rotate( -15deg );
}

#hito {
z-index: 0;
width: 12vh;
height: 16vh;
position: absolute;
top: 65vh;
left: 7vh;
}

#gtt {
display: none;
width: auto;
}

#rr {
margin-bottom: 1vh;
}

#text {
position: absolute;
top: 35vh;
left: 22vh;
width: 40vh;
transform: translate(-50%, -50%);
//    -webkit-transform: translate(-50%, -50%);
//    -ms-transform: translate(-50%, -50%);
margin: 0;
}

#byoutext {
position: absolute;
top: 42vh;
left: 22vh;
width: 40vh;
transform: translate(-50%, -50%);
//    -webkit-transform: translate(-50%, -50%);
//    -ms-transform: translate(-50%, -50%);
margin: 0;
}