body {
text-align: center;
margin: 0 auto 0 auto;
font-family: "Yu Gothic", "Meiryo" , sans-serif;
color: #555;
width: fit-content;
}
p {
font-size: clamp(8pt, 1.5vw, 24pt);
}
.itemimage{
display: block;
margin-left: auto;
margin-right: auto;
height: 100%;
}
.question {
color: inherit;
padding: 1.5rem;
font-size: clamp(12pt, 2.5vw, 32pt);
}
.area {
display: flex;
}
.btn{
font-family: "Yu Gothic", "Meiryo" , sans-serif;
position: relative;
cursor: pointer;
display: inline-block;
color: inherit;
padding: 1vw;
border: none;
font-size: 2.5vw;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.6);
border-radius: 10px;
background: rgba(155, 100, 100, 0.3);
margin: 1vw;
width: 30vw;
text-align: center;
height:fit-content;
text-decoration: none;
}
.next {
margin: 0 30px 0 auto;
}
.next a{
display: inline-block;
border-radius:20px;
background-color: #d8edf2;
color: inherit;
font-size: clamp(8pt, 1.5vw, 24pt);
padding: 1vw;
text-decoration: none;
height: fit-content;
width: fit-content;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.6);
}
.next1 {
margin: 0 0 0 auto;
}
.next1 a{
display: inline-block;
font-size: clamp(8pt, 1.5vw, 24pt);
height: fit-content;
width: fit-content;
}
.oshii{
position: absolute;
font-size: clamp(11pt, 3vw, 48pt);
color:  #7d7d7d;
background-color: transparent;
width: 32vw;
text-align: center;
}
.zannnen{
position: absolute;
font-size: clamp(11pt, 3vw, 48pt);
color: #7d7d7d;
background-color: transparent;
width: 32vw;
text-align: center;
}
.seikai{
position: absolute;
font-size: clamp(11pt, 3vw, 48pt);
color: rgba(175, 120, 120, 0.8);
background-color: transparent;
width: 32vw;
text-align: center;
}
.tooltip{
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.return{
display: flex;
flex-wrap: wrap;
color: inherit;
font-size: clamp(8pt, 1.5vw, 24pt);
}