@font-face {
  font-family: 'SUIT-Regular';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_suit@1.0/SUIT-Regular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SUIT-Medium';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_suit@1.0/SUIT-Medium.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SUIT-SemiBold';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_suit@1.0/SUIT-SemiBold.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SUIT-ExtraBold';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_suit@1.0/SUIT-ExtraBold.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

.selfTestWrapper {font-family:'SUIT-ExtraBold';width:100%;padding-bottom:200px;margin:100px 0 0 0;}
.selfTestWrapper .innerContent{width:960px;margin:0 auto;}
.selfTestWrapper .innerContent .head_box{width:100%;height:230px;border:10px solid #e5f0fa;border-radius:20px;box-sizing:border-box;padding:0 30px;display:flex;flex-direction:column;align-items:center;justify-content: center;}
.selfTestWrapper .innerContent .head_box .title{font-size:var(--fs28);color:#0067d0;border-bottom:1px solid #dddddd;width:100%;text-align:center;padding:0 0 25px 0;}
.selfTestWrapper .innerContent .head_box .exp{font-size:var(--fs17);color:#444444;font-family:'SUIT-Medium';padding:30px 0 0 0;line-height:1.5;letter-spacing: -1px;}

.selfTestWrapper .innerContent .quest_wrapper{font-size:var(--fs16);color:#444444;font-family:'SUIT-Medium';margin:60px 0 0 0;}
.selfTestWrapper .innerContent .quest_wrapper .quest{line-height:1.5;}
.selfTestWrapper .innerContent .quest_wrapper .quest .qst{font-size:var(--fs20);font-family:'SUIT-SemiBold';margin-bottom:25px;}

.selfTestWrapper .innerContent .quest_wrapper .answer_wrap{display:flex;flex-direction:column;gap:7px 0;margin-bottom:60px;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer{position:relative;width:100%;height:40px;border:1px solid #dddddd;border-radius:5px;display:flex;align-items:center;padding:0 22px;box-sizing: border-box;font-size:var(--fs16);cursor:pointer;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer.on{font-family:'SUIT-Bold';background:#e5f0fa;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer:hover{font-family:'SUIT-Bold';background:#e5f0fa;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer.num1::before{content:'①';padding-right:5px;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer.num2::before{content:'②';padding-right:5px;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer.num3::before{content:'③';padding-right:5px;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer.num4::before{content:'④';padding-right:5px;}


.selfTestWrapper .innerContent .result_wrapper{width:100%;}
.selfTestWrapper .innerContent .result_wrapper .result{}
.selfTestWrapper .innerContent .result_wrapper .rhead{display:flex;flex-direction:column;align-items:center;gap:15px 0;margin-bottom:45px;}
.selfTestWrapper .innerContent .result_wrapper .rhead .txt{font-family:'SUIT-ExtraBold';font-size:var(--fs28);color:#b40101}
.selfTestWrapper .innerContent .result_wrapper .rhead .txt.right{color:#1e820a}
.selfTestWrapper .innerContent .result_wrapper .rhead .txt.good{color:#002882}

.selfTestWrapper .innerContent .result_box{width:100%;padding:0 30px;box-sizing: border-box;color:#444444;margin:40px 0;}
.selfTestWrapper .innerContent .result_box .title{font-family:'SUIT-SemiBold';font-size:var(--fs20);}
.selfTestWrapper .innerContent .result_box .result_txt{font-family:'SUIT-Medium';font-size:var(--fs16);letter-spacing: -1px;line-height:1.7;margin:25px 0 0 0;}

.selfTestWrapper .innerContent .solution_box{width:100%;padding:40px 30px;box-sizing: border-box;color:#444444;margin:40px 0;background:#e5f0fa;}
.selfTestWrapper .innerContent .solution_box .title{font-family:'SUIT-SemiBold';font-size:var(--fs20);color:#0067d0;}
.selfTestWrapper .innerContent .solution_box .result_txt{font-family:'SUIT-ExtraBold';font-size:var(--fs16);letter-spacing: -1px;line-height:2;margin:25px 0 0 0;}
.spacer{padding:0 8px;}

@media (max-width: 640px) {
  .selfTestWrapper .innerContent{width:100%;margin:0 auto;padding:0 10px;box-sizing: border-box;}
  .selfTestWrapper .innerContent .quest_wrapper .answer_wrap .answer{padding:20px 22px;}
}