@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;padding:0 40px;box-sizing: border-box;}
.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:5px;}
.selfTestWrapper .innerContent .quest_wrapper .quest .qst span{font-size:var(--fs16);font-family:'SUIT-Regular';margin-left:10px;}
.selfTestWrapper .innerContent .quest_wrapper .quest .exp{font-size:var(--fs16);font-family:'SUIT-Regular';}


.selfTestWrapper .innerContent .quest_wrapper .answer_wrap{position:relative;display:flex;flex-direction:column;gap:7px 0;margin-bottom:60px;margin-top:22px;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap input[type=number]{position:relative;width:220px;height:40px;border:1px solid #dddddd;padding:0 20px;box-sizing: border-box;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .unit{position:absolute;left:200px;top:7px;color:#444444;font-size:var(--fs16);font-family:'SUIT-Medium';}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .rdo_wrap{display:flex;align-items:center;gap:0 5px;padding:0 0 0 20px;box-sizing: border-box;flex-wrap: wrap;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .rdo_wrap .rdo{display:flex;justify-content:center;align-items: center;color:#444444;font-size:var(--fs16);font-family:'SUIT-Medium';width:115px;height:40px;border:1px solid #dddddd;border-radius:5px;cursor:pointer;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .rdo_wrap .rdo.on{font-family:'SUIT-Bold';background:#e5f0fa;}
.selfTestWrapper .innerContent .quest_wrapper .answer_wrap .rdo_wrap .rdo:hover{font-family:'SUIT-Bold';background:#e5f0fa;}
.selfTestWrapper .innerContent .quest_wrapper .btns {display:flex;justify-content: center;}
.selfTestWrapper .innerContent .quest_wrapper .btns .btn_ok{width:200px;height:40px;background:#0067d0;color:#FFFFFF;font-size:var(--fs20);font-family:'SUIT-Bold';display:flex;justify-content: center;align-items: center;border-radius:20px;cursor:pointer;}


input{font-size:var(--fs16);}
input:focus{outline:none;}



.selfTestWrapper .innerContent .result_price .rhead{font-size:var(--fs28);color:#0067d0;width:100%;text-align:center;}
.selfTestWrapper .innerContent .head_r_box{width:100%;height:230px;border:10px solid #e5f0fa;border-radius:20px;box-sizing:border-box;padding:0 30px;display:flex;align-items:center;justify-content: start;}
.selfTestWrapper .innerContent .head_r_box .icon{width:220px;}
.selfTestWrapper .innerContent .head_r_box .txt_wrap{color:#444444;}
.selfTestWrapper .innerContent .head_r_box .txt_wrap .txt{font-size:var(--fs20);font-family:'SUIT-ExtraBold';line-height:1.5;letter-spacing: -1px;}
.selfTestWrapper .innerContent .head_r_box .txt_wrap .exp{font-size:var(--fs17);font-family:'SUIT-Medium';padding:25px 0 0 0;line-height:1.5;letter-spacing: -1px;}

.selfTestWrapper .innerContent .result_wrapper{width:100%;margin-top:100px;}
.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{padding:0 20px;}
  .selfTestWrapper .innerContent .quest_wrapper .answer_wrap .rdo_wrap{padding:0 0 0 0;gap:5px 5px;}
  .selfTestWrapper .innerContent .quest_wrapper .answer_wrap .rdo_wrap .rdo{width:100px;}

  .selfTestWrapper .innerContent .head_r_box{}
  .selfTestWrapper .innerContent .head_r_box{padding:20px 10px;flex-direction:column;height:auto;}
  .selfTestWrapper .innerContent .head_r_box .icon{width:100%;text-align:center;height:70px;padding:0 0 10px 0;}
  .selfTestWrapper .innerContent .head_r_box .icon img{height:100%;}
  .selfTestWrapper .innerContent .head_r_box .txt_wrap{color:#444444;}
  .selfTestWrapper .innerContent .head_r_box .txt_wrap .txt{text-align:center;}
  .selfTestWrapper .innerContent .head_r_box .txt_wrap .exp{text-align:center;font-size:var(--fs18);}

}