.quiz_area > img {
    position: absolute;
}
.quiz_area  .content_top_area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height:120px;
}

.quiz_area .content_top_area .content_tab {
    width: 78px;
    height: 78px;
}

.quiz_area .content_top_area .content_tab > img{
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.quiz_area .content_top_area .content_tab.lv1 {position: absolute;top: 26px;left: 60px;}
.quiz_area .content_top_area .content_tab.lv2 {position: absolute;top: 26px;left: 164px;}
.quiz_area .content_top_area .content_tab.lv3 {position: absolute;top: 26px;left: 268px;}

.quiz_area .content_top_area .content_tab >img:last-child {opacity: 1}

.quiz_area.lv1 .content_top_area .content_tab.lv1 > img:first-child{opacity: 1}
.quiz_area.lv1 .content_top_area .content_tab.lv1 > img:last-child{ opacity: 0}

.quiz_area.lv2 .content_top_area .content_tab.lv2 > img:first-child{opacity: 1}
.quiz_area.lv2 .content_top_area .content_tab.lv2 > img:last-child{ opacity: 0}

.quiz_area.lv3 .content_top_area .content_tab.lv3 > img:first-child{opacity: 1}
.quiz_area.lv3 .content_top_area .content_tab.lv3 > img:last-child{ opacity: 0}


.content_top_area .progressTimer{
    width: 598px;
    height: 62px;
    position: absolute;
    top: 36px;
    left: 658px;
    background-image: url('../image/bg_progressbar.png');
    background-position: center;
    background-size: contain;
    display: flex;
    justify-content: center;
}

.progressTimer .timer_icn{
    display: flex;
    width: 75px;
    height: 75px;
    padding: 4px 4px 2px 4px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    position: absolute;
    top: -13px;
    left: -55px;
    background-image: url('../image/img_timer.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 3;
}

.progressTimer .progressTimer_fill{
    width: 580px;
    height: 42px;
    position: absolute;
    top: 8px;
    left: 7px;
    border: 2px solid #FFFCB0;
    background: #FFE914;
}

.progressTimer .progressTimer_fill.timeover{
    border:none;
}

.progressTimer .progressTimer_text{
    color: #ffffff;
    text-align: center;
    font-family: Jalnan;
    font-size: 44px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index:1;
    margin-top:2px;
}
#quizContainer .progressTimer #pTimer_text{
    z-index:2;
    margin-top:6px;
}
#quizContainer .progressTimer #pTimer_text_ver2{
    position:absolute;
    -webkit-text-stroke-width: 8px;
    -webkit-text-stroke-color: #335E4D;
}

.content_top_area .content_close{
    width:40px;
    height:40px;
    position:absolute;
    right:60px;
    top:48px;
    background-image:url('../image/btn_close.png');
    background-position:center;
    background-size:contain;
    cursor:pointer;
}

.quiz_area .content_quiz_title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.quiz_area .content_quiz_title .quiz_title {
    display: none;
}

.quiz_area .content_quiz_title .quiz_title > img {
    position: absolute;
}

.quiz_area.lv1 .content_quiz_title .quiz_title.lv1 {display: block}
.quiz_area.lv2 .content_quiz_title .quiz_title.lv2 {display: block}
.quiz_area.lv3 .content_quiz_title .quiz_title.lv3 {display: block}

.quiz_area .content_quiz_title .quiz_title.lv1 {
    position: absolute;
    top: 151px;
    left: 348px;
    width: 1223px;
    height: 161px;
}

.quiz_area .content_quiz_title .quiz_title.lv2 {
    position: absolute;
    top: 145px;
    left: 288px;
    width: 1087px;
    height: 120px;
}

.quiz_area .content_quiz_title .quiz_title.lv3 {
    position: absolute;
    top: 145px;
    left: 26px;
    width: 1618px;
    height: 120px;
}

.quiz_area .content_quiz_answer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.quiz_area .content_quiz_answer .quiz_answer {
    display: none;
}

.quiz_area.lv1 .content_quiz_answer .quiz_answer.lv1 {display: block}
.quiz_area.lv2 .content_quiz_answer .quiz_answer.lv2 {display: block}
.quiz_area.lv3 .content_quiz_answer .quiz_answer.lv3 {display: block}

.quiz_area.lv1 .content_quiz_answer .quiz_answer.lv1 .ox_area > img {
    position: absolute;
}

.quiz_area.lv1 .content_quiz_answer .quiz_answer.lv1 .ox_area > img:first-child {
    display: none;
}

.quiz_area.lv1 .content_quiz_answer .quiz_answer.lv1.answer .ox_area > img:first-child {
    display: block;
}
.quiz_area.lv1 .content_quiz_answer .quiz_answer.lv1.answer .ox_area > img:last-child {
    display: none;
}

.quiz_area.lv1 .content_quiz_answer .quiz_answer.lv1 .o_area {
    position: absolute;
    top: 344px;
    left: 330px;
    width: 566px;
    height: 549px;
}

.quiz_area.lv1 .content_quiz_answer .quiz_answer.lv1 .x_area {
    position: absolute;
    top: 344px;
    left: 1023px;
    width: 566px;
    height: 549px;
}


.quiz_area .quiz_answer.lv2 .select_area > img {
    position: absolute;
    display: none;
}
.quiz_area .quiz_answer.lv2 .select_area > img:nth-child(1) { display: block}
.quiz_area .quiz_answer.lv2 .select_area:hover > img:nth-child(1) { display: none}
.quiz_area .quiz_answer.lv2 .select_area:hover > img:nth-child(2) { display: block; top: 1px}

.quiz_area .quiz_answer.lv2.answer .select_area > img:nth-child(1) { display: none}
.quiz_area .quiz_answer.lv2.answer .select_area > img:nth-child(2) { display: none}
.quiz_area .quiz_answer.lv2.answer .select_area > img:nth-child(3) { display: block}

.quiz_area .quiz_answer.lv2 .select_area.index1 {
    position: absolute;
    top: 370px;
    left: 314px;
    width: 570px;
    height: 295px;
    flex-shrink: 0;
}

.quiz_area .quiz_answer.lv2 .select_area.index2 {
    position: absolute;
    top: 370px;
    right: 395px;
    width: 570px;
    height: 295px;
    flex-shrink: 0;
}

.quiz_area .quiz_answer.lv2.answer .select_area.index2 {
    position: absolute;
    top: 348px;
    right: 395px;
    width: 597px;
    height: 317px;
    flex-shrink: 0;
}


.quiz_area .quiz_answer.lv2 .character_area {
    position: absolute;
    top: 531px;
    left: 206px;
    width: 1547px;
    height: 362px;
}











.quiz_area .quiz_answer.lv3 .select_area > img {
    position: absolute;
    display: none;
}
.quiz_area .quiz_answer.lv3 .select_area > img:nth-child(1) { display: block}
.quiz_area .quiz_answer.lv3 .select_area:hover > img:nth-child(1) { display: none}
.quiz_area .quiz_answer.lv3 .select_area:hover > img:nth-child(2) { display: block}

.quiz_area .quiz_answer.lv3.answer .select_area > img:nth-child(1) { display: none}
.quiz_area .quiz_answer.lv3.answer .select_area > img:nth-child(2) { display: none}
.quiz_area .quiz_answer.lv3.answer .select_area > img:nth-child(3) { display: block}

.quiz_area .quiz_answer.lv3 .select_area.index1 {
    position: absolute;
    top: 360px;
    left: 396px;
    width: 1113px;
    height: 134px;
    flex-shrink: 0;
}

.quiz_area .quiz_answer.lv3 .select_area.index2 {
    position: absolute;
    top: 534px;
    left: 396px;
    width: 1113px;
    height: 134px;
    flex-shrink: 0;
}

.quiz_area .quiz_answer.lv3 .select_area.index3 {
    position: absolute;
    top: 708px;
    left: 396px;
    width: 1113px;
    height: 134px;
    flex-shrink: 0;
}








.quiz_area .content_btn_area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.quiz_area .content_btn_area > div {
    display: none;
}

.quiz_area .content_btn_area > div > img {
    position: absolute;
}

.quiz_area .content_btn_area .btn_hint {
    position: absolute;
    top: 909px;
    left: 1368px;
    width: 212px;
    height: 80px;
}

.quiz_area .content_btn_area .btn_answer {
    position: absolute;
    top: 909px;
    left: 1618px;
    width: 212px;
    height: 80px;
}

.quiz_area .content_btn_area .btn_retry {
    position: absolute;
    top: 909px;
    left: 1218px;
    width: 283px;
    height: 80px;
}

.quiz_area .content_btn_area .btn_next {
    position: absolute;
    top: 909px;
    left: 1539px;
    width: 283px;
    height: 80px;
}

.quiz_area .content_btn_area .btn_finish {
    position: absolute;
    top: 909px;
    left: 1539px;
    width: 283px;
    height: 80px;
}


.quiz_area .content_btn_area .btn_hint,
.quiz_area .content_btn_area .btn_answer {
    display: block;
}

.quiz_area .content_btn_area.answer .btn_hint,
.quiz_area .content_btn_area.answer .btn_answer {
    display: none;
}

.quiz_area.lv1 .content_btn_area.answer .btn_retry,
.quiz_area.lv2 .content_btn_area.answer .btn_retry {
    display: block;
}
.quiz_area.lv1 .content_btn_area.answer .btn_next,
.quiz_area.lv2 .content_btn_area.answer .btn_next {
    display: block;
}

.quiz_area.lv3 .content_btn_area.answer .btn_retry,
.quiz_area.lv3 .content_btn_area.answer .btn_finish {
    display: block;
}


.hint_area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*z-index: 3;*/
}

.hint_area .hint_content {
    display: none;
}

.hint_area .hint_content {
    position: absolute;
    top: 205px;
    left: 117px;
    width: 1685px;
    height: 610px;
}

.quiz_area.lv1 .hint_area .hint_content.lv1 {
    display: block;
}

.quiz_area.lv2 .hint_area .hint_content.lv2 {
    display: block;
}

.quiz_area.lv3 .hint_area .hint_content.lv3 {
    display: block;
}

.hint_area .hint_close {
    position: absolute;
    bottom: 282px;
    right: 631px;
    width: 304px;
    height: 108px;
    flex-shrink: 0;
}

.quiz_area.lv1 .hint_area .hint_close {
    bottom: 323px;
}

.timeover_area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
}

.timeover_area .timeover_content {
    position: absolute;
    top: 205px;
    left: 118px;
    width: 1685px;
    height: 610px;
}

.timeover_area .timeover_retry {
    position: absolute;
    top: 525px;
    left: 821px;
    width: 283px;
    height: 80px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}

.timeover_area .timeover_next {
    position: absolute;
    top: 525px;
    left: 1140px;
    width: 283px;
    height: 80px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    display: none;
}

.timeover_area .timeover_finish {
    position: absolute;
    top: 525px;
    left: 1140px;
    width: 283px;
    height: 80px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    display: none;
}

.quiz_area.lv1 .timeover_area .timeover_next,
.quiz_area.lv2 .timeover_area .timeover_next {
    display: block;
}

.quiz_area.lv3 .timeover_area .timeover_finish {
    display: block;
}