@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: 1000;
}

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


/* .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 .ct_inbox .txtimg_box {
display: block;
position: absolute;
width: 257px;
height: 105px;
right:-260px;
top:103px;
z-index: 1000;
text-align: center;
}



/*----------------*/



.ct_box .ct_inbox .start_bg {
display: block;
position: absolute;
z-index: 100;
top:0;
left:0;
}


.ct_box .ct_inbox .start_btn {
display: block;
position: absolute;
z-index: 110;
top:110px;
left:55px;
}
.ct_box .ct_inbox .start_btn a {
display: block;
margin-bottom: 28px;
}



/*----------------*/

.ct_box .ct_inbox .q_box{
position: absolute;
top:0;
right:0px;
width: 434px;
z-index: 100;
}
.ct_box .ct_inbox .q_box .q_box_img{
position: absolute;
top:0;
left:0;
}


.ct_box .ct_inbox .qimg_box{
margin-top: 67px;
}

.ct_box .ct_inbox .input_box{
position: absolute;
bottom:0;
right:103px;
width: 142px;
height: 57px;
z-index: 110;

background: url(../images/input_box.png) no-repeat center center ;
}

.ct_box .input_box input {
width: 50px;
height: 22px;
text-align: center;
font-size: 18px;
border: none;
font-weight: bold;
color:#3B34FE;
letter-spacing: 2px;
margin: 20px 0 0 30px;
}







.ct_box .result_box {
position: absolute;
top:0;
left:26px;
width: 57px;
height: 57px;

z-index: 120;
}
.ct_box .result_box.disnone {
display: none;
}



.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 .input_done_box{
position: absolute;
bottom:7px;
right:9px;
width: 84px;
height: 43px;
z-index: 110;
}

.ct_box .ct_inbox .input_done_box>img {
display: block;
cursor: pointer;
}
.ct_box .ct_inbox .input_done_box>img:hover {
opacity: 0.7;
}
.ct_box .ct_inbox .input_done_box .btn_inputdone{
margin-top: 14px;
}


.ct_box .ct_inbox .input_done_box>img.disnone{
display: none;
}