@charset "UTF-8";
@font-face { font-family: '62570체'; src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.3/62570체.woff") format("woff"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'Binggrae'; src: url("https://d29dbfyawlamz6.cloudfront.net/font/Binggrae/Binggrae_opt.woff") format("woff"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'Binggrae'; src: url("https://d29dbfyawlamz6.cloudfront.net/font/Binggrae/Binggrae-Bold_opt.woff") format("woff"); font-weight: bold; font-style: normal; }

.p-side { padding-left: 20px; padding-right: 20px; }

.m-side { margin-left: 20px; margin-right: 20px; }

.m-full { margin-left: -20px; margin-right: -20px; }

body, button { font-family: 'Binggrae', sans-serif; font-weight: normal; background-color: #ececec; user-select: none; }

.btn-lg, .btn-group-lg > .btn { padding: 5px 16px; font-size: 24px; line-height: 1.7; border-radius: 10px; }

.ls-lg { letter-spacing: 3px; }

.bg-point { background-color: #F4E4E6; }

.btn-point { color: #fff !important; background-color: #044e59; border-color: #044e59; }

.btn-point:hover { color: #fff !important; background-color: #044e59; border-color: #044e59; }

.btn-point-secondary { color: #fff !important; background-color: #2f8b99; border-color: #2f8b99; }

.text_wrapper { position: relative; display: block; overflow: hidden; padding-top: 0.2em; }

.letter { display: inline-block; }

.button_inner { display: flex; align-items: center; height: 100%; justify-content: center; }

.sponsor_zone { display: flex; align-items: center; height: 100%; background-color: #0f9db3; color: white; border-radius: 16px; padding: 0 10px; user-select: none; font-size: 12px; font-weight: bold; }

.nav_row { background-color: #044e59; padding: 12px 20px; }

.nav_row .logo_zone { display: flex; align-items: center; font-family: '62570체', sans-serif; font-size: 17px; color: white; user-select: none; height: 100%; }

.nav_row .logo_zone img { width: 30px; height: auto; border-radius: 15px; margin-right: 5px; }

.nav_row .sponsor_zone { height: 30px; }

#logo_inner { display: none; }

#start_inner { background-color: white; }

#start_inner .sponsor_col { margin-left: auto; margin-right: auto; }

#start_inner .sponsor_col .sponsor_zone { padding: 5px 8px; border-radius: 999px; display: inline-block; border: solid 2px #0f666d; }

#start_inner .title_image_row { position: relative; }

#start_inner .title_image_row #title_flag { width: 100%; height: auto; }

#start_inner .title_image_row .back_col { position: absolute; z-index: -1; width: 100%; }

#start_inner #main_image { width: 100%; margin-left: auto; margin-right: auto; height: auto; }

#start_inner .title_row h2 { color: #36717b; font-weight: 700; line-height: 24px; font-size: 24px; user-select: none; }

#start_inner .title_row h1 { line-height: 32px; font-size: 32px; width: 100%; color: #333333; font-weight: bold; user-select: none; }

#start_inner .test_image_row { margin-top: -10%; margin-bottom: -10%; z-index: 0; }

#start_inner .test_image_row #back_light { position: absolute; z-index: -1; opacity: 0; bottom: 10%; left: 5%; width: 90%; height: 80%; background: radial-gradient(closest-side, #0f8bc1, rgba(15, 139, 193, 0.8), rgba(15, 139, 193, 0)); }

#start_inner #test_start { border: #009da5; background-color: #009da5; }

#start_inner #test_share_button { width: 42px; height: 42px; border-radius: 5px; }

.question_inner { display: none; background-color: white; }

.question_inner .title_row .question_number { font-family: '62570체', sans-serif; color: #044e59; font-weight: normal; line-height: 25px; font-size: 25px; user-select: none; text-align: center; }

.question_inner .title_row .question_content { color: #044e59; font-weight: bold; line-height: 1.4; font-size: 20px; user-select: none; text-align: center; word-break: keep-all; }

.question_inner .answer_button { padding-top: 20px; padding-bottom: 20px; font-size: 20px; font-weight: bold; border-radius: 15px; word-break: keep-all; }

.question_inner .badge-order { font-size: 12px; font-weight: bold; text-align: center; color: #ffffff; background-color: #2f8b99; border-radius: 100px; padding: 8px 12px; }

#loading_inner { background-color: #f3f3f3; display: none; font-size: 24px; font-weight: bold; line-height: normal; letter-spacing: normal; color: #044e59; }

#loading_inner .loading_image { width: 280px; height: auto; margin-left: auto; margin-right: auto; margin-bottom: -10%; }

#loading_inner .fade_anime { opacity: 0; }

#result_container { position: relative; background-color: #f3f3f3; padding-bottom: 73px; }

#result_container .title_row { background-color: white; position: relative; margin-bottom: -74px; }

#result_container .title_row .title_inner { width: calc(100% - 56px); background-color: #044e59; border: 2px solid #033135; margin-left: auto; margin-right: auto; padding: 7px 0 7px 0; z-index: 1; height: 82px; }

#result_container .title_row .flag { z-index: 0; position: absolute; width: 57px; height: 86px; top: 32px; }

#result_container .title_row .flag.left { left: 15px; }

#result_container .title_row .flag.right { -webkit-transform: scaleX(-1); transform: scaleX(-1); right: 15px; }

#result_container .title_row h2 { color: #97c1c8; user-select: none; font-size: 16px; font-weight: bold; line-height: normal; letter-spacing: normal; }

#result_container .title_row h1 { font-family: '62570체', sans-serif; line-height: 32px; font-size: 28px; user-select: none; color: white; }

#result_container .image_row { background-color: white; padding-bottom: 55px; margin-bottom: -55px; }

#result_container .image_row img { width: 100%; height: auto; margin-left: auto; margin-right: auto; }

#result_container .result_row .result_col { position: relative; background-color: #097080; padding: 16px 16px 16px 16px; border-radius: 5px; }

#result_container .result_row .result_col .summary_col .summary { display: inline-block; border-radius: 900px; background-color: white; padding: 3px 16px; font-size: 16px; font-weight: bold; line-height: 1.69; letter-spacing: normal; color: #097080; margin-bottom: 6px; margin-right: 6px; }

#result_container .result_row .result_col .summary_col .summary:last-child { margin-bottom: 0; margin-right: 0; }

#result_container .result_row .result_col .divider { margin-top: 13px; border-top: 2px solid #aeced7; height: 6px; border-bottom: 2px solid #aeced7; margin-bottom: 10px; }

#result_container .result_row .result_col .result { position: relative; user-select: none; font-size: 15px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.6; letter-spacing: normal; color: #ffffff; }

#result_container .result_row .result_col .result_show { position: absolute; bottom: -14px; left: calc( 50% - 43px); background-color: white; border-radius: 100px; box-shadow: 3px 3px 4px 0 #bfd4d7; padding: 4px 12px; width: 86px; height: 28px; font-size: 12px; font-weight: bold; color: #00424c; }

#result_container .result_row .result_col .result_show i { font-size: 8px; }

#result_container .result_row .message_col { position: relative; margin-bottom: 13px; }

#result_container .result_row .message_col .message { user-select: none; border-radius: 18px; padding: 8px 16px; font-size: 14px; font-weight: normal; line-height: 1.41; letter-spacing: -0.6px; max-width: 80%; word-break: keep-all; display: inline-block; }

#result_container .result_row .message_col .message.R { box-shadow: 3px 3px 8px 3px #dde5e6; color: #555555; border-bottom-right-radius: 0; background-color: white; float: right; }

#result_container .result_row .message_col .message.L { box-shadow: 3px 4px 5px 0 #bfcfd2; color: white; border-bottom-left-radius: 0; background-color: #0f9db3; float: left; }

#result_container .result_row .message_col .message.link { max-width: 60%; text-decoration: underline; color: #0000ee; }

#result_container .result_row .message_col .message.link img { margin-top: 6px; width: 100%; height: auto; }

#result_container .result_row .message_col .date { text-align: center; font-size: 12px; color: #888888; margin-top: 8px; margin-bottom: 8px; }

#result_container .result_row .message_col:last-child { margin-bottom: 0; }

#result_container .event_row { color: #555555; word-break: keep-all; border-radius: 16px; border-bottom-right-radius: 0; margin-bottom: -1px; box-shadow: 0 0 8px 3px rgba(0, 0, 0, 0.1); }

#result_container .event_row h2 { color: #0193A4; font-weight: bold; font-size: 20px; }

#result_container .event_row h3 { font-weight: bold; font-size: 16px; margin-bottom: 8px; border-radius: 900px; padding: 5px 16px; display: inline-block; color: white; background-color: #0193A4; }

#result_container .event_row .text-secondary { color: #aaaaaa; }

#result_container .event_row .detail_button { cursor: pointer; }

#result_container .event_row .fa-chevron-up { display: none; }

#result_container .event_row #event_benefit { display: none; }

#result_container .event_row #event_benefit .text-secondary { margin-top: -4px; }

#result_container .floating_wrapper { width: 100%; position: fixed; bottom: 0; background-color: #044e59; }

#result_container .floating_wrapper .retry_button { border-radius: 5px; box-shadow: inset 0 0 7px 1px rgba(255, 255, 255, 0.5); border: solid 1.5px #ffffff; font-size: 20px; }

#result_container .floating_wrapper #result_share_button { width: 46px; height: 46px; border-radius: 5px; box-shadow: inset 0 0 7px 1px rgba(255, 255, 255, 0.5); border: solid 1.5px #ffffff; background-color: #177482; }

@media (min-width: 500px) { #result_container .floating_wrapper { border-top-left-radius: 5px; border-top-right-radius: 5px; } }

#result_container .floating_wrapper .row { padding: 13px; }

.share_modal { padding: 15px; }

.share_modal .title_row h3 { color: #36717b; }

#result_share_button, #test_share_button { height: 100%; }

.ad_row h6 { color: #aaaaaa; font-size: 16px; }

.ad_row img { width: 100%; height: auto; }

.ad_row .video_col video { width: 100%; height: auto; display: block; }