@charset "shift_jis";
/* CSS Document */


.ct_box .ct_inbox .btn_ct_inbox_back {
display: block;
position: absolute;
top:0;
left:1;
width: 41px;
height: 42px;

z-index: 10010;
}



.ct_box .ct_inbox {
background: url(../images/bg.jpg) no-repeat;
}


.ct_box .q_img_box {
display: block;
position: absolute;
top:68px;
left:46px;
width: 322px;
height: 145px;

z-index: 101;
}
.ct_box .input_box {
display: block;
position: absolute;
top:133px;
left:216px;
width: 180px;
height: 27px;

z-index: 110;
}
.ct_box .input_box input {
width: 180px;
height: 27px;
text-align: center;
font-size: 16px;
border: none;
font-weight: bold;
color:#3B34FE;
letter-spacing: 2px;
}

.ct_box .btn_inputdone {
display: block;
position: absolute;
top:179px;
left:240px;
width: 84px;
height: 29px;
cursor: pointer;

z-index: 150;
}
.ct_box .btn_inputdone:hover {
opacity: 0.7;
}

.ct_box .btn_next {
display: none;
position: absolute;
top:179px;
left:240px;
width: 84px;
height: 29px;
cursor: pointer;

z-index: 150;
}
.ct_box .btn_next:hover {
opacity: 0.7;
}

.ct_box .btn_again {
display: none;
position: absolute;
top:179px;
left:240px;
width: 84px;
height: 29px;
cursor: pointer;

z-index: 150;
}
.ct_box .btn_again:hover {
opacity: 0.7;
}



.ct_box .result_box {
display: none;
position: absolute;
top:118px;
left:280px;
width: 57px;
height: 57px;

z-index: 120;
}


.ct_box .result_box .result_correct {
display: block;
position: absolute;
top:-20px;
left:-20px;
width: 97px;
height: 97px;

opacity: 0;
}

.ct_box .result_box .result_correct.showCorrect {
animation: showCorrect 0.25s linear;
animation-fill-mode: forwards;
}
@keyframes showCorrect {
  0% {
    top:-20px;
    left:-20px;
    width: 97px;
    height: 97px;
    opacity: 0;
  }
  100% {
    top:0px;
    left:0px;
    width: 57px;
    height: 57px;
    opacity: 1;
  }
}


.ct_box .result_box .result_wrong {
display: block;
position: absolute;
top:-20px;
left:-20px;
width: 97px;
height: 97px;

opacity: 0;
}

.ct_box .result_box .result_wrong.showWrong {
animation: showWrong 0.25s linear;
animation-fill-mode: forwards;
}
@keyframes showWrong {
  0% {
    top:-20px;
    left:-20px;
    width: 97px;
    height: 97px;
    opacity: 0;
  }
  100% {
    top:0px;
    left:0px;
    width: 57px;
    height: 57px;
    opacity: 1;
  }
}




.ct_box .ct_inbox .txtimg_box {
display: block;
position: absolute;
width: 257px;
height: 105px;
right:-260px;
top:103px;
z-index: 1000;
text-align: center;
}