.font_color_coral { color: #F16671; }

.font_color_light-brown { color: #D1A986; }

.font_color_light-blue { color: #4BB0D9; }

.bg_color_white { background: white; }

.bg_color_black { background: black; }

.bg_color_yellow { background: #FEFBDD; }

.bg_color_grey { background: #C0C0C0; }

.bg_color_gr-sky { background: linear-gradient(180deg, #E8F8FF 0%, #C3E0EC 100%); }

.bg_color_sky { background: #E8F8FF; }

.bg_color_coral { background: #F16671; }

.bg_color_green { background: #72C6A5; }

.line-height1 { line-height: 1; }

.line-height1_2 { line-height: 1.2; }

.line-height2 { line-height: 2; }

@font-face { font-family: 'Y_Spotlight'; src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts-20-12@1.0/Y_Spotlight.woff") format("woff"); font-weight: normal; font-style: normal; }

.Y-Spotlight_r { font-family: 'Y_Spotlight'; }

.full-image { width: 100%; height: auto; }

body, button { word-break: keep-all; user-select: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

a { cursor: pointer; }

#start_inner { position: relative; }

#start_inner .hidden-title { opacity: 0; position: absolute; }

#start_inner .start-background { max-height: 884px; height: 177vw; background-image: url("../img/start_bg.67a854eb29e5.png"); background-size: cover; background-repeat: no-repeat; position: relative; }

#start_inner .start-button__button { padding: 0.8rem 0 0.75rem 0; border-radius: 0px; }

#start_inner .start-button__button .start-text { letter-spacing: 5px; }

#start_inner .sponsor { align-items: center; justify-content: center; max-width: 400px; }

#start_inner .sponsor__item { display: block; user-select: none; }

#start_inner .sponsor__poomang-icon { width: 35%; }

#start_inner .sponsor__collabo-icon { width: 5%; }

#start_inner .sponsor__sponsor-icon { width: 22%; }

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

#intro_inner { display: none; font-size: 22px; cursor: pointer; position: relative; }

#intro_inner #blink { animation: 0.75s blink linear alternate infinite; }

@keyframes blink { 0% { opacity: 1; }
  100% { opacity: 0; } }

#progress_inner { display: none; color: white; position: relative; }

#progress_inner .progress #progress_count { display: none; }

#progress_inner .progress .progress__inner { border-radius: 999px; }

#progress_inner .progress .progress__inner .bar__inner { position: relative; height: 4px; z-index: 10; }

#progress_inner .progress .progress__inner .bar__inner .bar__gauge { width: 0%; height: auto; height: inherit; }

#progress_inner .progress .progress__inner .bar__inner .bar__icon { position: absolute; left: 0%; margin-top: -14px; margin-left: -20px; width: 25px; height: auto; z-index: 11; }

.question_inner { position: relative; display: none; }

.question_inner .question-image { width: 100%; height: auto; }

.question_inner .question-contents .question-contents__text { font-weight: normal; }

.question_inner .answer__button { min-height: 80px; border-radius: 0px; border: 2px solid #000000; }

.question_inner .answer__color1 { background: #72C6A5; }

.question_inner .answer__color2 { background: #F16671; }

#loading_inner { position: relative; display: none; }

#loading_inner .loading-image__wrapper img { width: 80px; height: auto; }

#loading_inner .loading__text { color: white; font-size: 18px; }

#loading_inner .loading .fade_anime { opacity: 0; }

#loading_inner .loading .dot1 { margin-left: -3px; animation: popDot1 1.5s step-end infinite; }

@keyframes popDot1 { 0% { opacity: 0; }
  0% { opacity: 1; }
  75% { opacity: 0; } }

#loading_inner .loading .dot2 { margin-left: -3px; animation: popDot2 1.5s step-end infinite; }

@keyframes popDot2 { 0% { opacity: 0; }
  25% { opacity: 1; }
  75% { opacity: 0; } }

#loading_inner .loading .dot3 { margin-left: -3px; animation: popDot3 1.5s step-end infinite; }

@keyframes popDot3 { 0% { opacity: 0; }
  50% { opacity: 1; }
  75% { opacity: 0; } }

#result_container { border: none; }

#result_container .save-text { border-top: 2px solid black; }

#result_container .contents-wrapper { background: #FFFFFF; border: 2px solid #000000; }

#result_container .dot-line-decoration { height: 5px; background-image: url("../img/results/line_decoration.112e11974a66.png"); background-size: cover; background-position: center; background-repeat: no-repeat; }

#result_container .banner-title { display: flex; justify-content: center; align-items: center; }

#result_container .banner-title img { width: 25px; height: auto; }

#result_container .result-button__button { border-radius: 0px; display: block; border: 2px solid #000000; }

#result_container .share_row { letter-spacing: 1px; }

#result_container .share_row .share_col .btn.share { padding: 0; margin: 0 1px; cursor: pointer; }

#result_container .share_row .share_col .btn.share img { width: 53px; height: 53px; }

#result_container .share_row a, #result_container .share_row a:visited { text-decoration: underline; }

#result_container .floating_wrapper { width: 100%; position: fixed; bottom: 0; background-color: black; z-index: 1; }

#result_container .floating_wrapper .row { padding: 10px 15px; }

#result_container .floating_wrapper a, #result_container .floating_wrapper button { display: flex; justify-content: center; align-items: center; height: 50px; letter-spacing: 2px; padding: 0.25rem 0 0.25rem 0; border: 2px solid white; border-radius: 999px; color: white; }

#result_container .floating_wrapper .retry_btn { width: 50px; height: 50px; align-items: center; position: relative; }

#result_container .floating_wrapper .retry_btn img { position: absolute; top: 11px; left: 7px; }

.jquery-modal { padding-top: 0; }

.decoration-icon { width: 30px; height: auto; }

.modal { background-color: transparent; width: 100%; border-radius: 0 !important; position: relative; color: white; }

.modal .item-inner { border-top: 2px solid black; border-bottom: 2px solid black; }

.modal #modal_lower_btn { position: fixed; bottom: 0; align-self: center; border-radius: 0; background-color: black; color: white; font-size: 24px; letter-spacing: 2px; }

@media (max-width: 540px) { .modal #modal_lower_btn { width: calc(100% - 40px); } }

@media (min-width: 541px) { .modal #modal_lower_btn { width: 500px; } }

#type_modal { height: calc(100vh - 20px); overflow-y: scroll; }

#type_modal .close-modal { display: none !important; }

.modal::-webkit-scrollbar { display: none; }
