@charset "UTF-8";

.component_test{position:fixed;left:0;top:0;width:100%;height:100%;background-color:#fafafa;}
.component_test .test_page{position:absolute;display:none;width:100%;height:100%;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100% - 30px);height:calc(100% - 30px);}
.component_test .test_page.active{display:block;}
.component_test .test_page.test_page_design_common{border-radius:40px;border-bottom:1px solid #e2e2e2;box-shadow:0 0 10px rgba(0,0,0,0.1);background-color:#ffffff;background-image:url(../img/component/content_bg.png);background-size:500px;background-position:right bottom;background-repeat:no-repeat;overflow:hidden;}


.component_test .test_page .test_page_header{position:absolute;left:0;top:0;z-index:15;z-index:10;width:100%;height:80px;border-radius:40px;background-color:#ffffff;border-bottom:1px solid #e2e2e2;box-shadow:0 0 10px rgba(0,0,0,0.1);box-sizing:border-box;}
.component_test .test_page .test_page_header .info{position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:20px;}
.component_test .test_page .test_page_header .info .subtitle{position:relative;font-size:16px;font-weight:500;color:#000000;line-height:1.3;}
.component_test .test_page .test_page_header .info .title{position:relative;display:inline-block;font-size:18px;font-weight:700;color:#000000;line-height:1.3;white-space:nowrap;}
.component_test .test_page .test_page_header .info .title.arrow{padding-right:20px;cursor:pointer;}
.component_test .test_page .test_page_header .info .title.arrow:after{content:"\ea4d";position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:"remixicon";font-weight:500;}
.component_test .test_page .test_page_header .info .title.arrow.active:after{transform:translateY(-50%) rotate(180deg);}
.component_test .test_page .test_page_header .info .subtitle + .title{margin-top:5px;}
.component_test .test_page .test_page_header .timer{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:150px;height:100%;font-size:20px;text-align:center;box-sizing:border-box;}
.component_test .test_page .test_page_header .timer:before{content:"";display:block;position:absolute;z-index:0;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%);background-color:#e6f0fb;}
.component_test .test_page .test_page_header .timer .center{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;}
.component_test .test_page .test_page_header .timer .time{position:relative;font-size:20px;font-weight:700;color:#000000;line-height:1.3;}
.component_test .test_page .test_page_header .timer .button{position:relative;display:block;margin:0 auto;padding:0 10px;border:1px solid #0070f0;border-radius:5px;line-height:20px;-webkit-appearance:none;font-family:inherit;font-size:14px;font-weight:500;color:#0070f0;text-align:center;background-color:#ffffff;margin-top:5px;white-space:nowrap;cursor:pointer;}
.component_test .test_page .test_page_header .timer.active .time{color:#aaaaaa;font-size:0;}
.component_test .test_page .test_page_header .timer.active .time:before{content:"\f20f";font-family:"remixicon";font-size:20px;}
.component_test .test_page .test_page_header .timer.active .button{background-color:#0167dc;color:#ffffff;}
.component_test .test_page .test_page_header .function{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:20px;}
.component_test .test_page .test_page_header .function:after{content:"";display:block;clear:both;}
.component_test .test_page .test_page_header .function .button{position:relative;float:left;display:block;margin:0;padding:0 10px;min-width:120px;height:50px;line-height:calc(50px - 2px);border-radius:25px;text-align:center;font-family:inherit;font-size:18px;font-weight:700;color:#ffffff;border:1px solid #222222;background-color:#222222;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_header .function .button:hover{background-color:#333333;border-color:#333333;}
.component_test .test_page .test_page_header .function .button:before,
.component_test .test_page .test_page_header .function .button:after{content:"";font-family:"remixicon";font-size:24px;display:inline-block;vertical-align:middle;margin-top:-2px;font-weight:500;}
.component_test .test_page .test_page_header .function .button:before{margin-right:5px;}
.component_test .test_page .test_page_header .function .button:after{margin-left:5px;}
.component_test .test_page .test_page_header .function .button + .button{margin-left:15px;}
.component_test .test_page .test_page_header .function .button.button_annotation:before{content:"\f19b";}
.component_test .test_page .test_page_header .function .button.button_calculator:before{content:"\eb1f";}
.component_test .test_page .test_page_header .function .button.button_reference:before{content:"\f1c1";}
.component_test .test_page .test_page_directions{position:absolute;left:0;top:90px;z-index:30;width:100%;height:calc(100% - 90px);background-color:rgba(0,0,0,0.3);border-radius:40px;display:none;}
.component_test .test_page .test_page_directions.active{display:block;}
.component_test .test_page .test_page_directions .window{position:absolute;left:15px;top:15px;max-width:850px;width:calc(100% - 30px);max-height:600px;height:calc(100% - 30px);background-color:#ffffff;box-shadow:0 0 10px rgba(0,0,0,0.1);border-radius:20px;box-sizing:border-box;}
.component_test .test_page .test_page_directions .window:before{content:"";display:block;position:absolute;left:30px;top:0;width:30px;height:30px;transform:rotate(-45deg);transform-origin:left top;background-color:#ffffff;box-shadow:0 0 10px rgba(0,0,0,0.1);}
.component_test .test_page .test_page_directions .window .directions{position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;background-color:#ffffff;border-radius:20px;display:none;}
.component_test .test_page .test_page_directions .window .directions.active{display:block;}
.component_test .test_page .test_page_directions .window .directions .content{position:absolute;left:10px;top:10px;width:calc(100% - 20px);height:calc(100% - 10px - 50px - 20px);padding:20px;border-radius:15px;background-color:#fafafa;border:1px solid #e2e2e2;font-size:15px;font-weight:400;color:#000000;line-height:1.4;word-break:keep-all;overflow:auto;box-sizing:border-box;overflow:auto;}
.component_test .test_page .test_page_directions .window .directions .content b{font-weight:700;}
.component_test .test_page .test_page_directions .window .directions .content p{margin:0;padding:0;}
.component_test .test_page .test_page_directions .window .directions .content ul{margin:0;}
.component_test .test_page .test_page_directions .window .directions .content * + p,
.component_test .test_page .test_page_directions .window .directions .content * + ul{margin-top:0.4em;}
.component_test .test_page .test_page_directions .window .directions .content .data{position:relative;margin-top:2em;}
.component_test .test_page .test_page_directions .window .directions .content .data .title{position:relative;margin:0;padding:0;text-align:center;}
.component_test .test_page .test_page_directions .window .directions .content .data .table{position:relative;margin:0 auto;max-width:380px;margin-top:5px;}
.component_test .test_page .test_page_directions .window .directions .content .data .table table{position:relative;margin:0;padding:0;border:1px solid #000000;border-collapse:collapse;border-spacing:0;width:100%;font-family:inherit;font-size:1em;}
.component_test .test_page .test_page_directions .window .directions .content .data .table table tr > *{border:1px solid #000000;padding:5px;text-align:center;font-weight:400;line-height:1.4;word-break:keep-all;}
.component_test .test_page .test_page_directions .window .directions .content .data .table table tr > td{font-size:0.9em;padding:10px 5px;}
.component_test .test_page .test_page_directions .window .directions .content .data .table table tr > td span{background-color:#f5f5f5;}
.component_test .test_page .test_page_directions .window .directions .function{position:absolute;right:15px;bottom:10px;}
.component_test .test_page .test_page_directions .window .directions .function:after{content:"";display:block;clear:both;}
.component_test .test_page .test_page_directions .window .directions .function .button{position:relative;float:right;display:block;margin:0;padding:0 15px;min-width:120px;height:50px;line-height:calc(50px - 2px);border-radius:25px;text-align:center;font-family:inherit;font-size:18px;font-weight:700;color:#ffffff;border:1px solid #0070f0;background-color:#0070f0;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_directions .window .directions .function .button:hover{background-color:#0167dc;border-color:#0167dc;}
.component_test .test_page .test_page_content{position:absolute;left:0;top:90px;z-index:10;width:100%;height:calc(100% - 90px - 90px);background-color:#ffffff;border-radius:40px;border:1px solid #e2e2e2;box-shadow:0 0 10px rgba(0,0,0,0.1);box-sizing:border-box;font-family:"Noto Serif KR",serif;}
.component_test .test_page .test_page_content input,
.component_test .test_page .test_page_content textarea{font-family:inherit !important;}
.component_test .test_page .test_page_content .content_full{position:absolute;left:0;top:0;width:100%;height:100%;padding:50px;overflow:auto;box-sizing:border-box;}
.component_test .test_page .test_page_content .content_left{position:absolute;left:0;top:0;width:50%;height:100%;padding:50px;overflow:auto;box-sizing:border-box;}
.component_test .test_page .test_page_content .content_left.inactive{display:none;}
.component_test .test_page .test_page_content .content_right{position:absolute;right:0;top:0;width:50%;height:100%;padding:50px;overflow:auto;box-sizing:border-box;border-left:1px solid #e2e2e2;}
.component_test .test_page .test_page_content .content_right.inactive{display:none;}
.component_test .test_page .test_page_content .content_left.inactive + .content_right{width:100%;border-left-width:0}
.component_test .test_page .test_page_content .passage_area{position:relative;max-width:800px;margin:0 auto;font-size:15px;font-weight:400;color:#000000;line-height:1.6;word-break:keep-all;}
.component_test .test_page .test_page_content .passage_area .passage{position:relative;}
.component_test .test_page .test_page_content .passage_area .passage b,
.component_test .test_page .test_page_content .passage_area .passage strong{font-weight:700;}
.component_test .test_page .test_page_content .passage_area .passage p{margin:0;padding:0;}
.component_test .test_page .test_page_content .passage_area .passage .passage_figure{display:block;margin:0 auto;max-width:300px;}
.component_test .test_page .test_page_content .passage_area .passage .passage_figure.top{margin-bottom:20px;}
.component_test .test_page .test_page_content .passage_area .passage .passage_figure.bottom{margin-top:20px;}
.component_test .test_page .test_page_content .question_area{position:relative;max-width:800px;margin:0 auto;font-size:15px;}
.component_test .test_page .test_page_content .question_area .question_header{position:relative;background-color:#e6f0fb;height:50px;border-radius:25px;font-size:20px;}
.component_test .test_page .test_page_content .question_area .question_header .number{position:absolute;left:20px;top:50%;transform:translateY(-50%);padding:0;width:50px;height:30px;line-height:30px;border-radius:15px;text-align:left;font-size:18px;font-weight:500;color:#000000;background-color:#e6f0fb;box-sizing:border-box;white-space:nowrap;}
.component_test .test_page .test_page_content .question_area .question_header .function{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:20px;}
.component_test .test_page .test_page_content .question_area .question_header .function .button{position:relative;float:left;display:block;margin:0;padding:0;width:40px;height:40px;line-height:calc(40px - 2px);border-radius:20px;text-align:center;font-size:18px;font-weight:700;color:#000000;border:1px solid #e2e2e2;background-color:#ffffff;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .question_header .function .button:hover{background-color:#fafafa;}
.component_test .test_page .test_page_content .question_area .question_header .function .button:before,
.component_test .test_page .test_page_content .question_area .question_header .function .button:after{content:"";font-family:"remixicon";font-size:20px;display:inline-block;vertical-align:middle;margin-top:-2px;}
.component_test .test_page .test_page_content .question_area .question_header .function .button.active{background-color:#0070f0;border-color:#0070f0;color:#ffffff;}
.component_test .test_page .test_page_content .question_area .question_header .function .button .title{display:none;}
.component_test .test_page .test_page_content .question_area .question_header .function .button + .button{margin-left:10px;}
.component_test .test_page .test_page_content .question_area .question_header .function .button.button_mark:before{content:"\ed39";}
.component_test .test_page .test_page_content .question_area .question_header .function .button.button_eliminate:before{content:"\f1ab";}
.component_test .test_page .test_page_content .question_area .question{position:relative;margin:0;padding:0;font-size:15px;font-weight:400;color:#000000;line-height:1.6;word-break:keep-all;margin-top:20px;}
.component_test .test_page .test_page_content .question_area .question p{margin:0;padding:0;}
.component_test .test_page .test_page_content .question_area .question .question_figure{display:block;margin:0 auto;max-width:300px;}
.component_test .test_page .test_page_content .question_area .question .question_figure.top{margin-bottom:20px;}
.component_test .test_page .test_page_content .question_area .question .question_figure.bottom{margin-top:20px;}
.component_test .test_page .test_page_content .question_area .answers{position:relative;margin-top:20px;}
.component_test .test_page .test_page_content .question_area .answers .answer_item{position:relative;}
.component_test .test_page .test_page_content .question_area .answers .answer_item + .answer_item{margin-top:15px;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input{display:none;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label{position:relative;display:block;margin:0;padding:8px 10px 8px 55px;border:1px solid #e2e2e2;min-height:50px;border-radius:25px;font-size:15px;line-height:1.5;cursor:pointer;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .number{position:absolute;display:block;left:5px;top:50%;transform:translateY(-50%);padding:0;width:40px;height:40px;line-height:40px;border-radius:20px;text-align:center;font-size:16px;font-weight:500;color:#000000;background-color:#e6f0fb;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .text{position:relative;margin-top:4px;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .text p{margin:0;padding:0;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .text b,
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .text strong{font-weight:500;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .text .answer_figure{display:block;margin:0;max-width:300px;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .eliminate{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100% - 10px);height:2px;background-color:#e67b8c;display:none;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .correct{position:absolute;display:block;right:5px;top:50%;transform:translateY(-50%);padding:0;width:100px;height:40px;line-height:40px;border-radius:20px;text-align:center;font-size:16px;font-weight:500;color:#ffffff;background-color:#0070f0;box-sizing:border-box;white-space:nowrap;overflow:hidden;display:none;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input + label .correct:before{content:"";font-family:"remixicon";font-weight:500;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input:checked + label{font-weight:500;border-color:#0167dc;}
.component_test .test_page .test_page_content .question_area .answers .answer_item input:checked + label .number{background-color:#0167dc;color:#ffffff;}
.component_test .test_page .test_page_content .question_area .answers .answer_item .function{position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:20px;display:none;}
.component_test .test_page .test_page_content .question_area .answers .answer_item .function .button{position:relative;float:left;display:block;margin:0;padding:0;width:40px;height:40px;line-height:calc(40px - 2px);border-radius:20px;text-align:center;font-family:inherit;font-size:18px;font-weight:700;color:#000000;border:1px solid #e2e2e2;background-color:#ffffff;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .answers .answer_item .function .button:hover{background-color:#fafafa;}
.component_test .test_page .test_page_content .question_area .answers .answer_item .function .button.active{background-color:#0070f0;border-color:#0070f0;color:#ffffff;}
.component_test .test_page .test_page_content .question_area .answers .answer_item .function .button + .button{margin-left:10px;}
.component_test .test_page .test_page_content .question_area .answers .answer_item .function .button .title{display:none;}
.component_test .test_page .test_page_content .question_area .answers.show_eliminate .answer_item input + label{width:calc(100% - 50px);}
.component_test .test_page .test_page_content .question_area .answers.show_eliminate .answer_item .function{display:block;}
.component_test .test_page .test_page_content .question_area .answers.show_eliminate .answer_item.is_eliminate input + label .eliminate{display:block;}
.component_test .test_page .test_page_content .question_area .answers .answer_item.is_correct  input + label{padding-right:110px;}
.component_test .test_page .test_page_content .question_area .answers .answer_item.is_correct  input + label .correct{display:block;}
.component_test .test_page .test_page_content .question_area .answers_subjective{position:relative;margin-top:20px;}
.component_test .test_page .test_page_content .question_area .answers_subjective .description{position:relative;font-weight:700;color:#000000;line-height:1.3;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer{position:relative;margin-top:10px;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer input{position:relative;display:block;margin:0;padding:0 15px;width:100%;border:1px solid #e2e2e2;height:50px;border-radius:25px;font-size:15px;font-weight:400;color:#000000;line-height:1.5;padding-left:120px;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer .number{position:absolute;display:block;left:5px;top:50%;transform:translateY(-50%);padding:0;width:100px;height:40px;line-height:40px;border-radius:20px;text-align:center;font-size:16px;font-weight:500;color:#000000;background-color:#e6f0fb;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer input:focus{border-color:#0167dc;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer input:focus + .number{background-color:#0167dc;color:#ffffff;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer_correct{position:relative;margin-top:10px;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer_correct .number{position:absolute;display:block;left:5px;top:50%;transform:translateY(-50%);padding:0;width:100px;height:40px;line-height:40px;border-radius:20px;text-align:center;font-size:18px;font-weight:500;color:#ffffff;background-color:#0070f0;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .answers_subjective .answer_correct .text{position:relative;display:block;margin:0;padding:0 15px;width:100%;border:1px solid #e2e2e2;height:50px;border-radius:25px;font-size:15px;font-weight:400;color:#000000;line-height:50px;padding-left:120px;-webkit-appearance:none;box-sizing:border-box;}

.component_test .test_page .test_page_content .question_area .answers_editor{position:relative;margin-top:20px;}
.component_test .test_page .test_page_content .question_area .answers_editor .description{position:relative;font-size:16px;font-weight:500;color:#777777;line-height:1.3;text-align:right;}
.component_test .test_page .test_page_content .question_area .answers_editor .answer{position:relative;margin-top:10px;}
.component_test .test_page .test_page_content .question_area .answers_editor .answer textarea{position:relative;display:block;margin:0;padding:15px;width:100%;border:1px solid #e2e2e2;height:200px;border-radius:0;font-size:18px;font-weight:400;color:#000000;line-height:1.5;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_content .question_area .answers_editor .answer textarea:focus{border-color:#0167dc;}

.component_test .test_page .test_page_footer{position:absolute;left:0;bottom:0;z-index:15;width:100%;height:80px;border-radius:40px;background-color:#ffffff;border-top:1px solid #e2e2e2;box-shadow:0 0 10px rgba(0,0,0,0.1);box-sizing:border-box;}
.component_test .test_page .test_page_footer .info{position:absolute;left:15px;top:50%;transform:translateY(-50%);}
.component_test .test_page .test_page_footer .info .subtitle{position:relative;font-size:16px;font-weight:500;color:#000000;line-height:1.3;}
.component_test .test_page .test_page_footer .info .title{position:relative;display:inline-block;font-size:18px;font-weight:700;color:#000000;line-height:1.3;white-space:nowrap;}
.component_test .test_page .test_page_footer .info .title.arrow{padding-right:20px;cursor:pointer;}
.component_test .test_page .test_page_footer .info .title.arrow:after{content:"\ea4d";position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:"remixicon";font-weight:500;}
.component_test .test_page .test_page_footer .info .subtitle + .title{margin-top:5px;}
.component_test .test_page .test_page_footer .pagination{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:20px;}
.component_test .test_page .test_page_footer .pagination:after{content:"";display:block;clear:both;}
.component_test .test_page .test_page_footer .pagination .button{position:relative;display:block;margin:0;padding:0 15px;padding-right:40px;min-width:200px;height:50px;line-height:calc(50px - 2px);border-radius:25px;white-space:nowrap;text-align:center;font-family:inherit;font-size:18px;font-weight:500;color:#000000;border:0;background-color:#e6f0fb;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_footer .pagination .button:after{content:"\ea77";position:absolute;right:15px;top:50%;transform:translateY(-50%);font-family:"remixicon";font-weight:500;}
.component_test .test_page .test_page_footer .pagination .button.active:after{transform:translateY(-50%) rotate(180deg);}
.component_test .test_page .test_page_footer .function{position:absolute;right:15px;top:50%;transform:translateY(-50%);}
.component_test .test_page .test_page_footer .function:after{content:"";display:block;clear:both;}
.component_test .test_page .test_page_footer .function .button{position:relative;float:left;display:block;margin:0;padding:0 15px;min-width:120px;height:50px;line-height:calc(50px - 2px);border-radius:25px;text-align:center;font-family:inherit;font-size:18px;font-weight:700;color:#ffffff;border:1px solid #0070f0;background-color:#0070f0;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_footer .function .button:hover{background-color:#0167dc;border-color:#0167dc;}
.component_test .test_page .test_page_footer .function .button:before,
.component_test .test_page .test_page_footer .function .button:after{content:"";font-family:"remixicon";font-size:24px;display:inline-block;vertical-align:middle;margin-top:-2px;font-weight:500;}
.component_test .test_page .test_page_footer .function .button:before{margin-right:5px;}
.component_test .test_page .test_page_footer .function .button:after{margin-left:5px;}
.component_test .test_page .test_page_footer .function .button + .button{margin-left:15px;}
.component_test .test_page .test_page_footer .function .button.button_prev:before{content:"\ea64";}
.component_test .test_page .test_page_footer .function .button.button_next:after{content:"\ea6e";}
.component_test .test_page .test_page_footer .function .button.button_print:before{content:"\f029";}
.component_test .test_page .test_page_result{position:absolute;left:0;bottom:80px;width:100%;border-top:1px solid #e2e2e2;height:200px;box-sizing:border-box;background-color:#eef4fb;padding:20px 50px;}
.component_test .test_page .test_page_result.padding_none{padding:0;}


.component_test .test_page .test_page_window{position:absolute;z-index:40;display:none;border-radius:15px;background-color:#ffffff;border:1px solid #e2e2e2;box-shadow:0 0 10px rgba(0,0,0,0.1);overflow:hidden;}
.component_test .test_page .test_page_window.active{display:block;}
.component_test .test_page .test_page_window .window_title{position:relative;height:40px;background-color:#e6f0fb;box-sizing:border-box;}
.component_test .test_page .test_page_window .window_title .title{position:absolute;left:0;top:50%;z-index:0;transform:translateY(-50%);width:100%;padding:0 40px;text-align:center;font-size:18px;line-height:1.3;font-weight:500;color:#000000;box-sizing:border-box;}
.component_test .test_page .test_page_window .window_title .expand{position:absolute;right:50px;top:50%;z-index:1;transform:translateY(-50%);height:40px;border:0;margin:0;padding:0;padding-left:30px;border-radius:0;font-family:inherit;font-size:16px;font-weight:500;color:#000000;-webkit-appearance:none;background-color:transparent;cursor:pointer;}
.component_test .test_page .test_page_window .window_title .expand:before{content:"\f323";font-family:"remixicon";position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:25px;}
.component_test .test_page .test_page_window .window_title .close{position:absolute;right:0;top:50%;z-index:1;transform:translateY(-50%);width:40px;height:40px;border:0;margin:0;padding:0;border-radius:0;font-family:inherit;font-size:16px;font-weight:500;color:#000000;-webkit-appearance:none;background-color:transparent;cursor:pointer;}
.component_test .test_page .test_page_window .window_title .close:before{content:"\eb99";font-family:"remixicon";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:25px;}
.component_test .test_page .test_page_window .window_content{position:relative;padding:20px 10px;}
.component_test .test_page .test_page_window .window_content .content_title{position:relative;margin:0;padding:0;font-size:16px;font-weight:500;color:#000000;line-height:1.3;text-align:center;}
.component_test .test_page .test_page_window .window_content .content_title + *{margin-top:20px;}
.component_test .test_page .test_page_window.is_expand .window_title .expand:before{content:"\f2ff";}
.component_test .test_page .test_page_window.is_draggable .window_title{cursor:move;}
.component_test .test_page .test_page_window.is_window .window_title .title{text-align:left;padding-left:10px;}
.component_test .test_page .test_page_window.is_window .window_content{position:absolute;left:0;bottom:0;width:100%;padding:0;height:calc(100% - 40px);box-sizing:border-box;}


.component_test .test_page .window_review{z-index:20;left:50%;bottom:70px;transform:translateX(-50%);width:100%;max-width:400px;}
.component_test .test_page .window_review .review{position:relative;}
.component_test .test_page .window_review .review .guide{position:relative;font-size:14px;font-weight:400;color:#000000;line-height:1.3;text-align:center;background-color:#fafafa;border:1px solid #e2e2e2;padding:10px;border-radius:5px;box-sizing:border-box;}
.component_test .test_page .window_review .review .guide .item{position:relative;display:inline-block;vertical-align:middle;}
.component_test .test_page .window_review .review .guide .item + .item{margin-left:15px;}
.component_test .test_page .window_review .review .guide .item .icon{position:relative;font-family:"remixicon";display:inline-block;vertical-align:middle;width:1.43em;height:1.43em;margin-right:0.57em;}
.component_test .test_page .window_review .review .guide .item .icon:before{content:"";display:block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.component_test .test_page .window_review .review .guide .item .icon.icon_current:before{content:"\efe0";font-size:1em;font-weight:500;color:#e67b8c;border:1px solid #e67b8c;background-color:#fcefef;width:1.43em;height:1.43em;text-align:center;line-height:calc(1.43em - 2px);border-radius:0.71em;box-sizing:border-box;}
.component_test .test_page .window_review .review .guide .item .icon.icon_unanswered:before{width:1.43em;height:1.43em;border:1px dashed #bbbbbb;border-radius:0.14em;box-sizing:border-box;}
.component_test .test_page .window_review .review .guide .item .icon.icon_mark:before{content:"\ed38";color:#0070f0;font-size:1.15em;}
.component_test .test_page .window_review .review .list{position:relative;margin-top:20px;font-size:14px;}
.component_test .test_page .window_review .review .list:after{content:"";display:block;clear:both;}
.component_test .test_page .window_review .review .list .item{position:relative;float:left;width:calc(12.5% - 8.8px);margin-right:10px;background-color:#fafafa;border:1px dashed #cccccc;border-radius:5px;box-sizing:border-box;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;}
.component_test .test_page .window_review .review .list .item:before{content:"";display:block;padding-bottom:100%;}
.component_test .test_page .window_review .review .list .item:after{content:"\efe0";display:none;position:absolute;z-index:1;left:50%;top:0;transform:translate(-50%,-50%);font-family:"remixicon";font-size:1em;font-weight:500;color:#e67b8c;border:1px solid #e67b8c;background-color:#fcefef;width:1.43em;height:1.43em;text-align:center;line-height:calc(1.43em - 2px);border-radius:0.71em;box-sizing:border-box;}
.component_test .test_page .window_review .review .list .item:nth-child(8n){margin-right:0;}
.component_test .test_page .window_review .review .list .item:nth-child(n+9){margin-top:15px;}
.component_test .test_page .window_review .review .list .item .number{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;font-size:1em;font-weight:500;color:#000000;line-height:1.3;}
.component_test .test_page .window_review .review .list .item .mark{position:absolute;z-index:0;right:0;bottom:0;display:none;}
.component_test .test_page .window_review .review .list .item .mark:before{content:"\ed38";font-family:"remixicon";font-size:0.86em;color:#0070f0;}
.component_test .test_page .window_review .review .list .item:hover{background-color:#e6f0fb;border-color:#0070f0;}
.component_test .test_page .window_review .review .list .item.is_solve{background-color:#e6f0fb;border-color:#e6f0fb;border-style:solid;}
.component_test .test_page .window_review .review .list .item.is_solve .number{color:#0070f0;}
.component_test .test_page .window_review .review .list .item.is_mark .mark{display:block;}
.component_test .test_page .window_review .review .list .item.active:after{display:block;}
.component_test .test_page .window_review .review .button{position:relative;display:block;margin:0 auto;margin-top:20px;padding:0 15px;min-width:120px;height:30px;line-height:calc(30px - 4px);border-radius:15px;text-align:center;font-family:inherit;font-size:14px;font-weight:500;color:#ffffff;border:2px solid #0070f0;background-color:#0070f0;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .window_review .review .button:hover{background-color:#0167dc;border-color:#0167dc;}


.component_test .test_page .window_calculator{left:50px;top:140px;width:100%;max-width:400px;height:100%;max-height:600px;}
.component_test .test_page .window_calculator .calculator{position:relative;height:100%;}
.component_test .test_page .window_calculator.is_expand{max-width:800px;max-height:700px;}


.component_test .test_page .window_reference{right:0;top:90px;width:100%;max-width:650px;height:calc(100% - 90px - 90px);}
.component_test .test_page .window_reference .list{position:relative;margin-top:-30px;} 
.component_test .test_page .window_reference .list:after{content:"";display:block;clear:both;}
.component_test .test_page .window_reference .list .item{position:relative;float:left;width:50%;margin-top:30px;font-size:14px;padding-bottom:1em;}
.component_test .test_page .window_reference .list .item .images{position:relative;}
.component_test .test_page .window_reference .list .item .images:after{content:"";display:block;clear:both;}
.component_test .test_page .window_reference .list .item .images .img_area{position:relative;float:left;width:50%;}
.component_test .test_page .window_reference .list .item .images .img_area .img{position:relative;max-width:90px;margin:0 auto;}
.component_test .test_page .window_reference .list .item .images .img_area .img:before{content:"";display:block;padding-bottom:120%;}
.component_test .test_page .window_reference .list .item .images .img_area img{position:absolute;display:block;left:50%;top:50%;transform:translate(-50%,-50%);max-width:100%;}
.component_test .test_page .window_reference .list .item .title{position:absolute;left:0;bottom:0;width:100%;font-size:1em;font-weight:500;color:#000000;line-height:1.3;word-break:keep-all;min-height:1.3em;text-align:center;}
.component_test .test_page .window_reference .reference{position:relative;height:100%;overflow:auto;padding:30px;box-sizing:border-box;}
.component_test .test_page .window_reference .reference .description{position:relative;font-size:15px;font-weight:400;color:#000000;line-height:1.4;word-break:keep-all;margin-top:2em;}
.component_test .test_page .window_reference .reference .description b{font-weight:700;}
.component_test .test_page .window_reference .reference .description p{margin:0;padding:0;}
.component_test .test_page .window_reference .reference .description ul{margin:0;}
.component_test .test_page .window_reference .reference .description * + p,
.component_test .test_page .window_reference .reference .description * + ul{margin-top:0.4em;}
.component_test .test_page .window_reference.is_expand{max-width:1000px;}
.component_test .test_page .window_reference.is_expand .list .item{width:33.33%;}


.component_test .test_page .page_review{position:relative;margin:0 auto;max-width:800px;}
.component_test .test_page .page_review .header{position:relative;text-align:center;font-size:16px;font-weight:400;color:#000000;text-align:center;}
.component_test .test_page .page_review .header .title{position:relative;margin:0;padding:0;font-size:2em;font-weight:700;line-height:1.3;}
.component_test .test_page .page_review .header .description{position:relative;margin:0;padding:0;font-size:1em;font-weight:400;margin-top:1.5em;line-height:1.5;}
.component_test .test_page .page_review .content{position:relative;margin-top:50px;}
.component_test .test_page .page_review .review{position:relative;}
.component_test .test_page .page_review .review .title{position:relative;margin:0;padding:0;font-size:20px;font-weight:700;line-height:1.3;text-align:center;}
.component_test .test_page .page_review .review .guide{position:relative;font-size:16px;font-weight:400;color:#000000;line-height:1.3;text-align:center;background-color:#fafafa;border:1px solid #e2e2e2;padding:10px;border-radius:5px;box-sizing:border-box;margin-top:40px;}
.component_test .test_page .page_review .review .guide .item{position:relative;display:inline-block;vertical-align:middle;}
.component_test .test_page .page_review .review .guide .item + .item{margin-left:15px;}
.component_test .test_page .page_review .review .guide .item .icon{position:relative;font-family:"remixicon";display:inline-block;vertical-align:middle;width:1.43em;height:1.43em;margin-right:0.57em;}
.component_test .test_page .page_review .review .guide .item .icon:before{content:"";display:block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.component_test .test_page .page_review .review .guide .item .icon.icon_current:before{content:"\efe0";font-size:1em;font-weight:500;color:#e67b8c;border:1px solid #e67b8c;background-color:#fcefef;width:1.43em;height:1.43em;text-align:center;line-height:calc(1.43em - 2px);border-radius:0.71em;box-sizing:border-box;}
.component_test .test_page .page_review .review .guide .item .icon.icon_unanswered:before{width:1.43em;height:1.43em;border:1px dashed #bbbbbb;border-radius:0.14em;box-sizing:border-box;}
.component_test .test_page .page_review .review .guide .item .icon.icon_mark:before{content:"\ed38";color:#0070f0;font-size:1.15em;}
.component_test .test_page .page_review .review .list{position:relative;margin-top:40px;font-size:18px;}
.component_test .test_page .page_review .review .list:after{content:"";display:block;clear:both;}
.component_test .test_page .page_review .review .list .item{position:relative;float:left;width:calc(10% - 9px);margin-right:10px;background-color:#fafafa;border:1px dashed #cccccc;border-radius:5px;box-sizing:border-box;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;}
.component_test .test_page .page_review .review .list .item:before{content:"";display:block;padding-bottom:100%;}
.component_test .test_page .page_review .review .list .item:after{content:"\efe0";display:none;position:absolute;z-index:1;left:50%;top:0;transform:translate(-50%,-50%);font-family:"remixicon";font-size:1em;font-weight:500;color:#e67b8c;border:1px solid #e67b8c;background-color:#fcefef;width:1.43em;height:1.43em;text-align:center;line-height:calc(1.43em - 2px);border-radius:0.71em;box-sizing:border-box;}
.component_test .test_page .page_review .review .list .item:nth-child(10n){margin-right:0;}
.component_test .test_page .page_review .review .list .item:nth-child(n+11){margin-top:10px;}
.component_test .test_page .page_review .review .list .item .number{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;font-size:1em;font-weight:500;color:#000000;line-height:1.3;}
.component_test .test_page .page_review .review .list .item .mark{position:absolute;z-index:0;right:0;bottom:0;display:none;}
.component_test .test_page .page_review .review .list .item .mark:before{content:"\ed38";font-family:"remixicon";font-size:0.86em;color:#0070f0;}
.component_test .test_page .page_review .review .list .item:hover{background-color:#e6f0fb;border-color:#0070f0;}
.component_test .test_page .page_review .review .list .item.is_solve{background-color:#e6f0fb;border-color:#e6f0fb;border-style:solid;}
.component_test .test_page .page_review .review .list .item.is_solve .number{color:#0070f0;}
.component_test .test_page .page_review .review .list .item.is_mark .mark{display:block;}


.component_test .test_page .test_page_common_area{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100% - 30px);box-sizing:border-box;}
.component_test .test_page .test_page_common_area .logo{position:relative;text-align:center;}
.component_test .test_page .test_page_common_area .logo img{position:relative;display:block;margin:0 auto;max-height:80px;max-width:500px;}
.component_test .test_page .test_page_common_area .title{position:relative;margin:0;padding:0;font-size:50px;font-weight:700;color:#000000;text-align:center;line-height:1.3;margin-top:30px;}
.component_test .test_page .test_page_common_area .timer{position:relative;text-align:center;box-sizing:border-box;margin-top:20px;}
.component_test .test_page .test_page_common_area .timer .time{position:relative;font-size:70px;font-weight:700;color:#000000;line-height:1.3;}
.component_test .test_page .test_page_common_area .subtitle{position:relative;margin:0;padding:0;font-size:30px;font-weight:500;color:#000000;text-align:center;line-height:1.3;margin-top:10px;}
.component_test .test_page .test_page_common_area .message_box{position:relative;margin:0 auto;margin-top:50px;}
.component_test .test_page .test_page_common_area .message_box .text{position:relative;margin:0;padding:0;font-size:30px;font-weight:500;color:#000000;text-align:center;line-height:1.3;}
.component_test .test_page .test_page_common_area .message_box .button_area{position:relative;margin-top:50px;}
.component_test .test_page .test_page_common_area .message_box .button_area .button{position:relative;display:block;margin:0 auto;padding:0 30px;min-width:300px;height:60px;line-height:calc(60px - 2px);border-radius:30px;text-align:center;font-family:inherit;font-size:22px;font-weight:700;color:#ffffff;border:1px solid #0070f0;background-color:#0070f0;text-decoration:none;-webkit-appearance:none;cursor:pointer;transition:border-color ease 0.3s,background-color ease 0.3s;box-sizing:border-box;}
.component_test .test_page .test_page_common_area .message_box .button_area .button:hover{background-color:#0167dc;border-color:#0167dc;}
.component_test .test_page .test_page_common_area .message_box .button_area .button:after{content:"";font-family:"remixicon";font-size:24px;font-weight:500;position:absolute;right:15px;top:50%;transform:translateY(-50%);}
.component_test .test_page .test_page_common_area .message_box .button_area .button:after{margin-left:10px;}
.component_test .test_page .test_page_common_area .message_box .button_area .button.button_start:after{content:"\f00a";}


.component_test .test_page .review_result{position:relative;}
.component_test .test_page .review_result .item{position:relative;padding:10px;border:1px solid #e2e2e2;border-radius:5px;background-color:#ffffff;font-size:16px;font-weight:400;color:#000000;line-height:1.3;box-sizing:border-box;}
.component_test .test_page .review_result .item:after{content:"";display:block;clear:both;}
.component_test .test_page .review_result .item + .item{margin-top:10px;}
.component_test .test_page .review_result .item .title{position:relative;float:left;width:150px;font-weight:500;}
.component_test .test_page .review_result .item .text{position:relative;float:right;width:calc(100% - 150px - 10px);box-sizing:border-box;}
.component_test .test_page .review_result .item .text[data-is_correct="Y"]{color:#6588f7;}
.component_test .test_page .review_result .item .text[data-is_correct="N"]{color:#dd0000;}


.component_test .test_page .review_explaination{position:relative;height:100%;display:flex;flex-wrap:nowrap;flex-direction:column;}
.component_test .test_page .review_explaination .tabs{position:relative;height:35px;flex-shrink:0;display:flex;flex-wrap:nowrap;flex-direction:row;border-bottom:1px solid #e2e2e2;}
.component_test .test_page .review_explaination .tabs .tab{position:relative;margin:0;padding:0 15px;min-width:100px;height:calc(100% + 1px);-webkit-appearance:none;border-radius:0;border:0;font-size:14px;font-weight:700;color:#000000;background-color:transparent;cursor:pointer;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;border-right:1px solid #e2e2e2;transition:background-color ease 0.3s;}
.component_test .test_page .review_explaination .tabs .tab:hover{background-color:rgba(0,0,0,0.05);}
.component_test .test_page .review_explaination .tabs .tab:active{background-color:rgba(0,0,0,0.1);}
.component_test .test_page .review_explaination .tabs .tab.active{background-color:#ffffff;}
.component_test .test_page .review_explaination .tab_pages{position:relative;flex-grow:1;background-color:#ffffff;}
.component_test .test_page .review_explaination .tab_pages .tab_page{position:relative;height:100%;padding:15px;overflow:auto;box-sizing:border-box;font-size:14px;font-weight:400;color:#000000;line-height:1.4;display:none;}
.component_test .test_page .review_explaination .tab_pages .tab_page.active{display:block;}
.component_test .test_page .review_explaination .tab_pages .tab_page p{margin:0;}


.component_test .test_page.test_page_design_review{background-image:none;}
.component_test .test_page.test_page_design_review .test_page_header{border-radius:0;box-shadow:none;}
.component_test .test_page.test_page_design_review .test_page_header .timer{display:none;}
.component_test .test_page.test_page_design_review .test_page_header .function .button.button_annotation{display:none;}
.component_test .test_page.test_page_design_review .test_page_content{border-radius:0;box-shadow:none;border:0;top:80px;height:calc(100% - 80px - 80px - 200px);}
.component_test .test_page.test_page_design_review .test_page_content .question_area .answers .answer_item input + label{cursor:default;}
.component_test .test_page.test_page_design_review .test_page_content .question_area .answers_subjective .answer input{cursor:default;}
.component_test .test_page.test_page_design_review .test_page_footer{border-radius:0;box-shadow:none;}
.component_test .test_page.test_page_design_review .test_page_footer .pagination .button{padding:0 15px;cursor:default;}
.component_test .test_page.test_page_design_review .test_page_footer .pagination .button:after{display:none;}


.component_test .test_page .test_page_sidebar{position:absolute;left:0;top:0;width:140px;height:100%;background-color:#fafafa;box-sizing:border-box;border-right:1px solid #e2e2e2;}
.component_test .test_page .test_page_sidebar .header{position:absolute;left:0;top:0;width:100%;height:80px;box-sizing:border-box;border-bottom:1px solid #e2e2e2;}
.component_test .test_page .test_page_sidebar .header .logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100% - 20px);width:calc(100% - 20px);}
.component_test .test_page .test_page_sidebar .header .logo img{position:relative;display:block;margin:0 auto;max-height:50px;max-width:100%;}
.component_test .test_page .test_page_sidebar .content{position:absolute;left:0;top:80px;width:100%;height:calc(100% - 80px);box-sizing:border-box;padding:10px;overflow:auto;}
.component_test .test_page .test_page_sidebar .content .menu{position:relative;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider{position:relative;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider + .menu_divider{margin-top:15px;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .menu_title{position:relative;margin:0;padding:0;border:0;border-radius:5px;display:block;-webkit-appearance:none;width:100%;height:35px;font-family:inherit;font-size:12px;font-weight:500;color:#000000;letter-spacing:-0.025em;background-color:#e6f0fb;box-sizing:border-box;transition:border-color ease 0.3s,background-color ease 0.3s;cursor:pointer;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list{position:relative;margin-top:10px;border:1px solid #e2e2e2;border-radius:5px;overflow:hidden;background-color:#ffffff;display:flex;flex-wrap:wrap;flex-direction:row;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item{position:relative;margin:0;padding:0;border:0;border-radius:0;border-right:1px solid #e2e2e2;border-bottom:1px solid #e2e2e2;display:block;-webkit-appearance:none;width:25%;height:35px;font-family:inherit;font-size:13px;font-weight:500;color:#000000;background-color:#ffffff;box-sizing:border-box;transition:border-color ease 0.3s,background-color ease 0.3s;cursor:pointer;flex-basis:33%;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item:hover{background-color:#f5f5f5;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item:nth-child(3n){border-right-width:0;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item.active{background-color:#e6f0fb;color:#0070f0;font-weight:700;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item .number{position:relative;z-index:1;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item .correct{position:absolute;z-index:0;right:0;bottom:0;border-top-left-radius:5px;width:12px;height:12px;line-height:1;font-size:9px;font-weight:500;text-align:center;background-color:#efefef;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item[data-is_correct="Y"] .correct{background-color:#e6f0fb;color:#0070f0;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item[data-is_correct="N"] .correct{background-color:#fcefef;color:#e67b8c;}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item[data-is_correct="Y"] .correct:before{content:"O";}
.component_test .test_page .test_page_sidebar .content .menu .menu_divider .list .item[data-is_correct="N"] .correct:before{content:"X";}
.component_test .test_page .test_page_sidebar_content{position:absolute;right:0;top:0;width:calc(100% - 140px);height:100%;box-sizing:border-box;}