*, *::before, *::after { box-sizing: border-box; }

html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); height: -webkit-fill-available; }

header ul ul { list-style-type: none !important; }

header ul { padding-inline-start: 0px; }

body { margin: 0; font-family: 'Noto Sans KR', sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; text-align: left; background-color: #fff; min-height: 100vh; min-height: -webkit-fill-available; display: flex; flex-direction: column; }

input, select, textarea, button { font-family: inherit; }

h1, h2, h3, h4, h5, h6, p { margin: 0; }

img { max-width: 100%; display: block; }

a:-webkit-any-link { text-decoration: none; color: inherit; }

a { text-decoration: none; color: inherit; }

.text_center { text-align: center; }

.mw-500 { max-width: 500px; margin-left: auto; margin-right: auto; }

#full_cover { width: 100%; max-width: 500px; margin-left: auto; margin-right: auto; flex: 1; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; flex-direction: column; overflow: hidden; }

.full_inner { display: flex; flex-direction: column; }

.full_inner.fit { flex: 1 1 auto; justify-content: center; }

.container { width: 100%; margin-right: auto; margin-left: auto; }

.row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto { position: relative; width: 100%; }

.col { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; }

.col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%; }

.col-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%; }

.col-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%; }

.col-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }

.col-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; }

.col-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%; }

.col-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }

.col-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%; }

.col-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%; }

.col-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; }

.col-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%; }

.col-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667%; }

.col-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }

.p-15 { padding-left: 15px; padding-right: 15px; }

.m-15 { margin-left: 15px; margin-right: 15px; }

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

.mt-auto { margin-top: auto; }

.mb-auto { margin-bottom: auto; }

.m-0 { margin: 0 !important; }

.mt-0, .my-0 { margin-top: 0 !important; }

.mr-0, .mx-0 { margin-right: 0 !important; }

.mb-0, .my-0 { margin-bottom: 0 !important; }

.ml-0, .mx-0 { margin-left: 0 !important; }

.m-1 { margin: 0.25rem !important; }

.mt-1, .my-1 { margin-top: 0.25rem !important; }

.mr-1, .mx-1 { margin-right: 0.25rem !important; }

.mb-1, .my-1 { margin-bottom: 0.25rem !important; }

.ml-1, .mx-1 { margin-left: 0.25rem !important; }

.m-2 { margin: 0.5rem !important; }

.mt-2, .my-2 { margin-top: 0.5rem !important; }

.mr-2, .mx-2 { margin-right: 0.5rem !important; }

.mb-2, .my-2 { margin-bottom: 0.5rem !important; }

.ml-2, .mx-2 { margin-left: 0.5rem !important; }

.m-3 { margin: 1rem !important; }

.mt-3, .my-3 { margin-top: 1rem !important; }

.mr-3, .mx-3 { margin-right: 1rem !important; }

.mb-3, .my-3 { margin-bottom: 1rem !important; }

.ml-3, .mx-3 { margin-left: 1rem !important; }

.m-4 { margin: 1.5rem !important; }

.mt-4, .my-4 { margin-top: 1.5rem !important; }

.mr-4, .mx-4 { margin-right: 1.5rem !important; }

.mb-4, .my-4 { margin-bottom: 1.5rem !important; }

.ml-4, .mx-4 { margin-left: 1.5rem !important; }

.m-5 { margin: 3rem !important; }

.mt-5, .my-5 { margin-top: 3rem !important; }

.mr-5, .mx-5 { margin-right: 3rem !important; }

.mb-5, .my-5 { margin-bottom: 3rem !important; }

.ml-5, .mx-5 { margin-left: 3rem !important; }

.p-0 { padding: 0 !important; }

.pt-0, .py-0 { padding-top: 0 !important; }

.pr-0, .px-0 { padding-right: 0 !important; }

.pb-0, .py-0 { padding-bottom: 0 !important; }

.pl-0, .px-0 { padding-left: 0 !important; }

.p-1 { padding: 0.25rem !important; }

.pt-1, .py-1 { padding-top: 0.25rem !important; }

.pr-1, .px-1 { padding-right: 0.25rem !important; }

.pb-1, .py-1 { padding-bottom: 0.25rem !important; }

.pl-1, .px-1 { padding-left: 0.25rem !important; }

.p-2 { padding: 0.5rem !important; }

.pt-2, .py-2 { padding-top: 0.5rem !important; }

.pr-2, .px-2 { padding-right: 0.5rem !important; }

.pb-2, .py-2 { padding-bottom: 0.5rem !important; }

.pl-2, .px-2 { padding-left: 0.5rem !important; }

.p-3 { padding: 1rem !important; }

.pt-3, .py-3 { padding-top: 1rem !important; }

.pr-3, .px-3 { padding-right: 1rem !important; }

.pb-3, .py-3 { padding-bottom: 1rem !important; }

.pl-3, .px-3 { padding-left: 1rem !important; }

.p-4 { padding: 1.5rem !important; }

.pt-4, .py-4 { padding-top: 1.5rem !important; }

.pr-4, .px-4 { padding-right: 1.5rem !important; }

.pb-4, .py-4 { padding-bottom: 1.5rem !important; }

.pl-4, .px-4 { padding-left: 1.5rem !important; }

.p-5 { padding: 3rem !important; }

.pt-5, .py-5 { padding-top: 3rem !important; }

.pr-5, .px-5 { padding-right: 3rem !important; }

.pb-5, .py-5 { padding-bottom: 3rem !important; }

.pl-5, .px-5 { padding-left: 3rem !important; }

.btn { display: inline-block; font-weight: 400; color: #212529; text-align: center; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: transparent; border: 1px solid transparent; padding: 0.375rem 0.75rem; font-size: 1rem; line-height: 1.5; border-radius: 0.25rem; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }

@media (prefers-reduced-motion: reduce) { .btn { transition: none; } }

.btn:hover { color: #212529; text-decoration: none; }

.btn:focus, .btn.focus { outline: 0; }

.btn.disabled, .btn:disabled { opacity: 0.65; }

a.btn.disabled, fieldset:disabled a.btn { pointer-events: none; }

a.btn { box-sizing: border-box; }

.btn-lg, .btn-group-lg > .btn { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.3rem; }

.btn-sm, .btn-group-sm > .btn { padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 0.2rem; }

.btn-block { display: block; width: 100%; }

.btn-block + .btn-block { margin-top: 0.5rem; }

input.btn-block[type="submit"], input.btn-block[type="reset"], input.btn-block[type="button"] { width: 100%; }

.btn-secondary { color: #888888 !important; background-color: #ececec; border-color: #ececec; }

.font-weight-light { font-weight: 300 !important; }

.font-weight-lighter { font-weight: lighter !important; }

.font-weight-normal { font-weight: 400 !important; }

.font-weight-bold { font-weight: 700 !important; }

.font-weight-bolder { font-weight: bolder !important; }

.font-italic { font-style: italic !important; }

.text-white { color: #fff !important; }

.badge { display: inline-block; padding: 0.25em 0.4em; font-size: 75%; font-weight: 700; line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 0.25rem; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }

.bg-white { background-color: white; }

.form-control { display: block; width: 100%; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }

@media (prefers-reduced-motion: reduce) { .form-control { transition: none; } }

.form-control::-ms-expand { background-color: transparent; border: 0; }

.form-control:-moz-focusring { color: transparent; text-shadow: 0 0 0 #495057; }

.form-control:focus { color: #495057; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }

.form-control::-webkit-input-placeholder { color: #6c757d; opacity: 1; }

.form-control::-moz-placeholder { color: #6c757d; opacity: 1; }

.form-control:-ms-input-placeholder { color: #6c757d; opacity: 1; }

.form-control::-ms-input-placeholder { color: #6c757d; opacity: 1; }

.form-control::placeholder { color: #6c757d; opacity: 1; }

.form-control:disabled, .form-control[readonly] { background-color: #e9ecef; opacity: 1; }

select.form-control:focus::-ms-value { color: #495057; background-color: #fff; }

.form-control-file, .form-control-range { display: block; width: 100%; }

.col-form-label { padding-top: calc(0.375rem + 1px); padding-bottom: calc(0.375rem + 1px); margin-bottom: 0; font-size: inherit; line-height: 1.5; }

.col-form-label-lg { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); font-size: 1.25rem; line-height: 1.5; }

.col-form-label-sm { padding-top: calc(0.25rem + 1px); padding-bottom: calc(0.25rem + 1px); font-size: 0.875rem; line-height: 1.5; }

.form-control-plaintext { display: block; width: 100%; padding: 0.375rem 0; margin-bottom: 0; font-size: 1rem; line-height: 1.5; color: #212529; background-color: transparent; border: solid transparent; border-width: 1px 0; }

.form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg { padding-right: 0; padding-left: 0; }

.form-control-sm { height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 0.2rem; }

.form-control-lg { height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.3rem; }

select.form-control[size], select.form-control[multiple] { height: auto; }

textarea.form-control { height: auto; }

.form-group { margin-bottom: 1rem; }

.form-text { display: block; margin-top: 0.25rem; }

.form-row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -5px; margin-left: -5px; }

.form-row > .col, .form-row > [class*="col-"] { padding-right: 5px; padding-left: 5px; }

.form-check { position: relative; display: block; padding-left: 1.25rem; }

.form-check-input { position: absolute; margin-top: 0.3rem; margin-left: -1.25rem; }

.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label { color: #6c757d; }

.form-check-label { margin-bottom: 0; }

.form-check-inline { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; align-items: center; padding-left: 0; margin-right: 0.75rem; }

.form-check-inline .form-check-input { position: static; margin-top: 0; margin-right: 0.3125rem; margin-left: 0; }

.input-group { position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; width: 100%; }

.input-group > .form-control, .input-group > .form-control-plaintext, .input-group > .custom-select, .input-group > .custom-file { position: relative; -ms-flex: 1 1 0%; flex: 1 1 0%; min-width: 0; margin-bottom: 0; }

.input-group > .form-control + .form-control, .input-group > .form-control + .custom-select, .input-group > .form-control + .custom-file, .input-group > .form-control-plaintext + .form-control, .input-group > .form-control-plaintext + .custom-select, .input-group > .form-control-plaintext + .custom-file, .input-group > .custom-select + .form-control, .input-group > .custom-select + .custom-select, .input-group > .custom-select + .custom-file, .input-group > .custom-file + .form-control, .input-group > .custom-file + .custom-select, .input-group > .custom-file + .custom-file { margin-left: -1px; }

.input-group > .form-control:focus, .input-group > .custom-select:focus, .input-group > .custom-file .custom-file-input:focus ~ .custom-file-label { z-index: 3; }

.input-group > .custom-file .custom-file-input:focus { z-index: 4; }

.input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }

.input-group > .form-control:not(:first-child), .input-group > .custom-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }

.input-group > .custom-file { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; }

.input-group > .custom-file:not(:last-child) .custom-file-label, .input-group > .custom-file:not(:last-child) .custom-file-label::after { border-top-right-radius: 0; border-bottom-right-radius: 0; }

.input-group > .custom-file:not(:first-child) .custom-file-label { border-top-left-radius: 0; border-bottom-left-radius: 0; }

.input-group-prepend, .input-group-append { display: -ms-flexbox; display: flex; }

.input-group-prepend .btn, .input-group-append .btn { position: relative; z-index: 2; }

.input-group-prepend .btn:focus, .input-group-append .btn:focus { z-index: 3; }

.input-group-prepend .btn + .btn, .input-group-prepend .btn + .input-group-text, .input-group-prepend .input-group-text + .input-group-text, .input-group-prepend .input-group-text + .btn, .input-group-append .btn + .btn, .input-group-append .btn + .input-group-text, .input-group-append .input-group-text + .input-group-text, .input-group-append .input-group-text + .btn { margin-left: -1px; }

.input-group-prepend { margin-right: -1px; }

.input-group-append { margin-left: -1px; }

.input-group-text { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; padding: 0.375rem 0.75rem; margin-bottom: 0; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; text-align: center; white-space: nowrap; background-color: #e9ecef; border: 1px solid #ced4da; border-radius: 0.25rem; }

.input-group-text input[type="radio"], .input-group-text input[type="checkbox"] { margin-top: 0; }

.input-group-lg > .form-control:not(textarea), .input-group-lg > .custom-select { height: calc(1.5em + 1rem + 2px); }

.input-group-lg > .form-control, .input-group-lg > .custom-select, .input-group-lg > .input-group-prepend > .input-group-text, .input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-prepend > .btn, .input-group-lg > .input-group-append > .btn { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.3rem; }

.input-group-sm > .form-control:not(textarea), .input-group-sm > .custom-select { height: calc(1.5em + 0.5rem + 2px); }

.input-group-sm > .form-control, .input-group-sm > .custom-select, .input-group-sm > .input-group-prepend > .input-group-text, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, .input-group-sm > .input-group-append > .btn { padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 0.2rem; }

.input-group-lg > .custom-select, .input-group-sm > .custom-select { padding-right: 1.75rem; }

.input-group > .input-group-prepend > .btn, .input-group > .input-group-prepend > .input-group-text, .input-group > .input-group-append:not(:last-child) > .btn, .input-group > .input-group-append:not(:last-child) > .input-group-text, .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group > .input-group-append:last-child > .input-group-text:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }

.input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, .input-group > .input-group-prepend:not(:first-child) > .btn, .input-group > .input-group-prepend:not(:first-child) > .input-group-text, .input-group > .input-group-prepend:first-child > .btn:not(:first-child), .input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }

.custom-control { position: relative; display: block; min-height: 1.5rem; padding-left: 1.5rem; }

.custom-control-inline { display: -ms-inline-flexbox; display: inline-flex; margin-right: 1rem; }

.custom-control-input { position: absolute; left: 0; z-index: -1; width: 1rem; height: 1.25rem; opacity: 0; }

.custom-control-input:checked ~ .custom-control-label::before { color: #fff; border-color: #007bff; background-color: #007bff; }

.custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }

.custom-control-input:focus:not(:checked) ~ .custom-control-label::before { border-color: #80bdff; }

.custom-control-input:not(:disabled):active ~ .custom-control-label::before { color: #fff; background-color: #b3d7ff; border-color: #b3d7ff; }

.custom-control-input[disabled] ~ .custom-control-label, .custom-control-input:disabled ~ .custom-control-label { color: #6c757d; }

.custom-control-input[disabled] ~ .custom-control-label::before, .custom-control-input:disabled ~ .custom-control-label::before { background-color: #e9ecef; }

.custom-control-label { position: relative; margin-bottom: 0; vertical-align: top; }

.custom-control-label::before { position: absolute; top: 0.25rem; left: -1.5rem; display: block; width: 1rem; height: 1rem; pointer-events: none; content: ""; background-color: #fff; border: #adb5bd solid 1px; }

.custom-control-label::after { position: absolute; top: 0.25rem; left: -1.5rem; display: block; width: 1rem; height: 1rem; content: ""; background: no-repeat 50% / 50% 50%; }

.custom-checkbox .custom-control-label::before { border-radius: 0.25rem; }

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e"); }

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before { border-color: #007bff; background-color: #007bff; }

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e"); }

.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before { background-color: rgba(0, 123, 255, 0.5); }

.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before { background-color: rgba(0, 123, 255, 0.5); }

.custom-radio .custom-control-label::before { border-radius: 50%; }

.custom-radio .custom-control-input:checked ~ .custom-control-label::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e"); }

.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before { background-color: rgba(0, 123, 255, 0.5); }

.custom-switch { padding-left: 2.25rem; }

.custom-switch .custom-control-label::before { left: -2.25rem; width: 1.75rem; pointer-events: all; border-radius: 0.5rem; }

.custom-switch .custom-control-label::after { top: calc(0.25rem + 2px); left: calc(-2.25rem + 2px); width: calc(1rem - 4px); height: calc(1rem - 4px); background-color: #adb5bd; border-radius: 0.5rem; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out; transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out; }

@media (prefers-reduced-motion: reduce) { .custom-switch .custom-control-label::after { transition: none; } }

.custom-switch .custom-control-input:checked ~ .custom-control-label::after { background-color: #fff; -webkit-transform: translateX(0.75rem); transform: translateX(0.75rem); }

.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before { background-color: rgba(0, 123, 255, 0.5); }

.custom-select { display: inline-block; width: 100%; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 1.75rem 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; vertical-align: middle; background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px; border: 1px solid #ced4da; border-radius: 0.25rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.custom-select:focus { border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }

.custom-select:focus::-ms-value { color: #495057; background-color: #fff; }

.custom-select[multiple], .custom-select[size]:not([size="1"]) { height: auto; padding-right: 0.75rem; background-image: none; }

.custom-select:disabled { color: #6c757d; background-color: #e9ecef; }

.custom-select::-ms-expand { display: none; }

.custom-select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #495057; }

.custom-select-sm { height: calc(1.5em + 0.5rem + 2px); padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.5rem; font-size: 0.875rem; }

.custom-select-lg { height: calc(1.5em + 1rem + 2px); padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 1rem; font-size: 1.25rem; }

.custom-file { position: relative; display: inline-block; width: 100%; height: calc(1.5em + 0.75rem + 2px); margin-bottom: 0; }

.custom-file-input { position: relative; z-index: 2; width: 100%; height: calc(1.5em + 0.75rem + 2px); margin: 0; opacity: 0; }

.custom-file-input:focus ~ .custom-file-label { border-color: #80bdff; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }

.custom-file-input[disabled] ~ .custom-file-label, .custom-file-input:disabled ~ .custom-file-label { background-color: #e9ecef; }

.custom-file-input:lang(en) ~ .custom-file-label::after { content: "Browse"; }

.custom-file-input ~ .custom-file-label[data-browse]::after { content: attr(data-browse); }

.custom-file-label { position: absolute; top: 0; right: 0; left: 0; z-index: 1; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; border: 1px solid #ced4da; border-radius: 0.25rem; }

.custom-file-label::after { position: absolute; top: 0; right: 0; bottom: 0; z-index: 3; display: block; height: calc(1.5em + 0.75rem); padding: 0.375rem 0.75rem; line-height: 1.5; color: #495057; content: "Browse"; background-color: #e9ecef; border-left: inherit; border-radius: 0 0.25rem 0.25rem 0; }

.custom-range { width: 100%; height: 1.4rem; padding: 0; background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.custom-range:focus { outline: none; }

.custom-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }

.custom-range:focus::-moz-range-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }

.custom-range:focus::-ms-thumb { box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }

.custom-range::-moz-focus-outer { border: 0; }

.custom-range::-webkit-slider-thumb { width: 1rem; height: 1rem; margin-top: -0.25rem; background-color: #007bff; border: 0; border-radius: 1rem; -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -webkit-appearance: none; appearance: none; }

@media (prefers-reduced-motion: reduce) { .custom-range::-webkit-slider-thumb { -webkit-transition: none; transition: none; } }

.custom-range::-webkit-slider-thumb:active { background-color: #b3d7ff; }

.custom-range::-webkit-slider-runnable-track { width: 100%; height: 0.5rem; color: transparent; cursor: pointer; background-color: #dee2e6; border-color: transparent; border-radius: 1rem; }

.custom-range::-moz-range-thumb { width: 1rem; height: 1rem; background-color: #007bff; border: 0; border-radius: 1rem; -moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -moz-appearance: none; appearance: none; }

@media (prefers-reduced-motion: reduce) { .custom-range::-moz-range-thumb { -moz-transition: none; transition: none; } }

.custom-range::-moz-range-thumb:active { background-color: #b3d7ff; }

.custom-range::-moz-range-track { width: 100%; height: 0.5rem; color: transparent; cursor: pointer; background-color: #dee2e6; border-color: transparent; border-radius: 1rem; }

.custom-range::-ms-thumb { width: 1rem; height: 1rem; margin-top: 0; margin-right: 0.2rem; margin-left: 0.2rem; background-color: #007bff; border: 0; border-radius: 1rem; -ms-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; appearance: none; }

@media (prefers-reduced-motion: reduce) { .custom-range::-ms-thumb { -ms-transition: none; transition: none; } }

.custom-range::-ms-thumb:active { background-color: #b3d7ff; }

.custom-range::-ms-track { width: 100%; height: 0.5rem; color: transparent; cursor: pointer; background-color: transparent; border-color: transparent; border-width: 0.5rem; }

.custom-range::-ms-fill-lower { background-color: #dee2e6; border-radius: 1rem; }

.custom-range::-ms-fill-upper { margin-right: 15px; background-color: #dee2e6; border-radius: 1rem; }

.custom-range:disabled::-webkit-slider-thumb { background-color: #adb5bd; }

.custom-range:disabled::-webkit-slider-runnable-track { cursor: default; }

.custom-range:disabled::-moz-range-thumb { background-color: #adb5bd; }

.custom-range:disabled::-moz-range-track { cursor: default; }

.custom-range:disabled::-ms-thumb { background-color: #adb5bd; }

.custom-control-label::before, .custom-file-label, .custom-select { transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }

@media (prefers-reduced-motion: reduce) { .custom-control-label::before, .custom-file-label, .custom-select { transition: none; } }

.nav { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; list-style: none; }

.ml-auto { margin-left: auto; }

.mr-auto { margin-right: auto; }

.font_size_64 { font-size: 64px; }

.font_size_50 { font-size: 50px; }

.font_size_45 { font-size: 45px; }

.font_size_40 { font-size: 40px; }

.font_size_38 { font-size: 38px; }

.font_size_36 { font-size: 36px; }

.font_size_32 { font-size: 32px; }

.font_size_30 { font-size: 30px; }

.font_size_28 { font-size: 28px; }

.font_size_26 { font-size: 26px; }

.font_size_25 { font-size: 25px; }

.font_size_24 { font-size: 24px; }

.font_size_23 { font-size: 23px; }

.font_size_22 { font-size: 22px; }

.font_size_21 { font-size: 21px; }

.font_size_20 { font-size: 20px; }

.font_size_18 { font-size: 18px; }

.font_size_17 { font-size: 17px; }

.font_size_16 { font-size: 16px; }

.font_size_15 { font-size: 15px; }

.font_size_14 { font-size: 14px; }

.font_size_13 { font-size: 13px; }

.font_size_12 { font-size: 12px; }

.font_size_9 { font-size: 9px; }

.font_color_black { color: black !important; }

.font_color_white { color: white !important; }

@font-face { font-family: 'Pretendard-100'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Thin.woff") format("woff"); font-weight: 100; font-style: normal; }

.Pretendard_100 { font-family: 'Pretendard-100'; }

@font-face { font-family: 'Pretendard-200'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraLight.woff") format("woff"); font-weight: 200; font-style: normal; }

.Pretendard_200 { font-family: 'Pretendard-200'; }

@font-face { font-family: 'Pretendard-300'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff") format("woff"); font-weight: 300; font-style: normal; }

.Pretendard_300 { font-family: 'Pretendard-300'; }

@font-face { font-family: 'Pretendard-400'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff") format("woff"); font-weight: 400; font-style: normal; }

.Pretendard_400 { font-family: 'Pretendard-400'; }

@font-face { font-family: 'Pretendard-500'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff") format("woff"); font-weight: 500; font-style: normal; }

.Pretendard_500 { font-family: 'Pretendard-500'; }

@font-face { font-family: 'Pretendard-600'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff") format("woff"); font-weight: 600; font-style: normal; }

.Pretendard_600 { font-family: 'Pretendard-600'; }

@font-face { font-family: 'Pretendard-700'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff") format("woff"); font-weight: 700; font-style: normal; }

.Pretendard_700 { font-family: 'Pretendard-700'; }

@font-face { font-family: 'Pretendard-800'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff") format("woff"); font-weight: 800; font-style: normal; }

.Pretendard_800 { font-family: 'Pretendard-800'; }

@font-face { font-family: 'Pretendard-900'; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Black.woff") format("woff"); font-weight: 900; font-style: normal; }

.Pretendard_900 { font-family: 'Pretendard-900'; }

@font-face { font-family: 'GmarketSansMedium'; src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff") format("woff"); font-weight: normal; font-style: normal; }

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

header { z-index: 1; }

body, button { font-weight: normal; 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; }

body { background-image: linear-gradient(180deg, #17093F 39.06%, #352A86 100%); background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed; }

#full_cover { position: relative; flex-wrap: nowrap; }

#full_cover #sound_inner { display: none; z-index: 1; position: absolute; top: 5px; right: 0; }

#full_cover #sound_inner img { width: 45px; height: auto; }

a { cursor: pointer; }

.font-18 { font-size: 18px; line-height: 25px; }

.btn-point, .btn-point:hover { display: inline-block; justify-content: center; text-align: center; margin-top: 10px; padding-top: 10px; padding-bottom: 10px; min-height: 64px; color: #FFFFFF; background: linear-gradient(180deg, #9577C8 0%, #31165E 100%); border: 1px solid #FFFFFF; border-radius: 10px; font-family: 'Pretendard-400'; font-size: 18px; line-height: 20px; transition: 0.25s; }

.btn-point.clicked, .btn-point.clicked:hover { color: #180A3F; background: #FFFFFF; }

@keyframes fadeIn { from { opacity: 0; }
  to { opacity: 1; } }

@keyframes hoverAnimate { 0% { transform: translateY(0); }
  100% { transform: translateY(5px); } }

.bg_intro1 { background: url("../img/intro/bg_intro1.34361d847727.png"); background-size: cover; background-position: center; }

.bg_intro2 { background: url("../img/intro/bg_intro2.f3eb9a3e994d.png"); background-size: cover; background-position: center; }

.bg_intro3 { background: url("../img/intro/bg_intro3.1878e1ba8085.png"); background-size: cover; background-position: center; }

.bg_intro4 { background: url("../img/intro/bg_intro4.136ee2a396be.png"); background-size: cover; background-position: center; }

#start_inner { position: relative; font-family: "GmarketSansMedium"; color: #FFFFFF; }

#start_inner .hidden_title { opacity: 0; position: absolute; }

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

#start_inner .notice { font-family: 'Pretendard-400'; font-size: 12px; line-height: 15px; text-shadow: 0px 0px 4px #000000; }

#start_inner #test_start { align-items: center; text-align: center; width: 100%; border: 2px solid #FFFFFF; background: #5B51A9; filter: drop-shadow(0px 0px 4px rgba(255, 255, 255, 0.44)); }

#start_inner #test_start .start { font-family: "Pretendard-800"; font-size: 30px; line-height: 36px; }

#start_inner #test_start .play_cnt { font-family: 'Pretendard-400'; font-size: 14px; line-height: 18px; }

#start_inner .sponsor_row { margin-top: 13px; align-items: center; }

#start_inner .sponsor_row .sponsor_zone { display: block; margin-left: auto; margin-right: auto; background-color: transparent; user-select: none; }

#start_inner .sponsor_row .sponsor_zone img { width: 80px; height: auto; }

.intro_inner { position: relative; display: none; cursor: pointer; }

.intro_inner .content_col p { font-family: "KyoboHand"; font-size: 18px; line-height: 27px; color: #FFFFFF; }

.intro_inner .audio_notification { padding: 15px 30px; font-family: "Pretendard-400"; font-size: 14px; line-height: 18px; color: white; animation: 4s blink linear forwards; background-color: rgba(0, 0, 0, 0.44); border-radius: 5px; }

.intro_inner .play_icon { width: 20px; height: auto; animation: 0.75s fadeIn alternate infinite; }

@keyframes blink { 0% { opacity: 0; }
  12.5% { opacity: 1; }
  37.5% { opacity: 1; }
  50% { opacity: 0; }
  62.5% { opacity: 1; }
  87.5% { opacity: 1; }
  100% { opacity: 0; } }

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

.question_inner .chapter_col { display: flex; }

.question_inner .chapter_col .chapter_box { padding: 5px 12px; font-family: "Pretendard-600"; font-size: 16px; line-height: 24px; color: #6B64A3; border: 1px solid #6B64A3; border-radius: 99px; }

.question_inner .chapter_col .chapter_title { font-family: "Pretendard-400"; font-size: 16px; line-height: 24px; color: #6B64A3; }

.question_inner .chapter_col .chapter_title[current] { opacity: 1; font-family: "Pretendard-600"; font-size: 22px; line-height: 33px; }

@media (max-width: 500px) { .question_inner .question_row { margin-top: 15vw; } }

@media (min-width: 501px) { .question_inner .question_row { margin-top: 75px; } }

.question_inner h1 { color: #FFFFFF; font-family: "Pretendard-600"; font-size: 18px; line-height: 27px; }

.question_inner .button_row { position: relative; z-index: 1; }

@media (max-width: 500px) { .question_inner .button_row { margin-top: 15vw; } }

@media (min-width: 501px) { .question_inner .button_row { margin-top: 75px; } }

.question_inner .button_row .button_col { padding: 0 7.5px; }

.question_inner .button_row .button_col:nth-child(2n+1) { text-align: right; }

.question_inner .button_row .answer__button { margin: 0; max-width: 200px; max-height: 200px; width: 40vw; height: 40vw; font-family: "Pretendard-600"; font-size: 18px; line-height: 27px; border-radius: 999px; }

.waves_box { display: none; z-index: 0; position: absolute; bottom: 0; left: 0; /* Animation */ }

.waves_box .waves { position: relative; width: 240%; height: 36vh; margin-bottom: -8px; /*Fix for safari gap*/ min-height: 240px; max-height: 360px; }

.waves_box .parallax > use { animation: move-forever 50s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; }

.waves_box .parallax > use:nth-child(1) { animation-delay: -4s; animation-duration: 14s; }

.waves_box .parallax > use:nth-child(2) { animation-delay: -6s; animation-duration: 20s; }

.waves_box .parallax > use:nth-child(3) { animation-delay: -8s; animation-duration: 26s; }

.waves_box .parallax > use:nth-child(4) { animation-delay: -10s; animation-duration: 40s; }

@keyframes move-forever { 0% { transform: translate3d(-90px, 0, 0); }
  100% { transform: translate3d(85px, 0, 0); } }

#loading_inner { position: relative; display: none; background-image: url("../img/summary/bg_summary.54b5c62223f1.png"); background-size: cover; background-repeat: no-repeat; background-position: center; }

#loading_inner .loading_row { margin-top: auto; margin-bottom: 90px; }

#loading_inner p { font-family: "Pretendard-400"; font-size: 18px; line-height: 23px; color: #FFFFFF; }

#loading_inner .dot1 { opacity: 0; animation: 2s fadeIn1 infinite; }

@keyframes fadeIn1 { 0% { opacity: 0; }
  0% { opacity: 0; }
  25% { opacity: 1; }
  100% { opacity: 1; } }

#loading_inner .dot2 { opacity: 0; animation: 2s fadeIn2 infinite; }

@keyframes fadeIn2 { 0% { opacity: 0; }
  25% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 1; } }

#loading_inner .dot3 { opacity: 0; animation: 2s fadeIn3 infinite; }

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

#result_bg__layer { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }

#result_container { position: relative; overflow: hidden; }

#result_container .text-align-right { text-align: right; }

#result_container .result_top { margin-bottom: 15px; font-family: "KyoboHand"; font-size: 18px; line-height: 27px; }

#result_container .img_row { position: relative; }

#result_container .img_row img { width: 100%; height: auto; }

#result_container .img_row .title_box { position: absolute; top: 50%; left: 50%; transform: translate(-50%, calc(-50% + 15px)); color: #FFFFFF; text-shadow: 0px 0px 4px #FFFFFF; }

#result_container .img_row .title_box #result_subtitle { font-family: "Pretendard-200"; font-size: 22px; line-height: 33px; }

#result_container .img_row .title_box #result_title { font-family: "Pretendard-700"; font-size: 26px; line-height: 39px; }

#result_container .content_row { margin-left: 20px; margin-right: 20px; color: #FFFFFF; font-size: 16px; line-height: 21px; }

#result_container .content_row .content_title { padding: 5px; font-family: "Pretendard-700"; font-size: 20px; line-height: 30px; color: #FFFFFF; text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.56); }

#result_container .content_row .content_title span { color: #FDFFAB; }

#result_container .content_row .title_decoration { margin-bottom: 16px; width: 100%; height: 1px; background-color: #FFFFFF; box-shadow: 0px 0px 4px rgba(255, 255, 255, 0.56); }

#result_container .content_row #view_all_btn { padding: 0; color: #FFFFFF; font-family: "Pretendard-700"; font-size: 18px; line-height: 23px; background: transparent; border: none; }

#result_container .content_row #view_all_btn span { border-bottom: 2px solid #FFFFFF; }

#result_container .content_row .hidden_content { display: none; }

#result_container .content_row .content_col { text-align: start; }

#result_container .content_row .result_content { font-family: "Pretendard-400"; }

#result_container .content_row .result_content[count="1"] { color: #FDFFAB; }

#result_container .content_row .result_content_decoration_img { max-width: 125px; width: 25vw; height: auto; }

#result_container .content_row .result_summary { color: #FFFFFF; font-family: "KyoboHand"; font-size: 18px; line-height: 23px; }

#result_container .content_row #mypage_btn { display: inline-block; padding: 20px; width: 100%; text-align: center; font-family: "GmarketSansMedium"; font-size: 18px; line-height: 23px; color: #000000; background: #FDFFAB; border: none; border-radius: 999px; }

#result_container .content_row .info { color: white; font-family: "Pretendard-Regular"; font-size: 12px; line-height: 15px; }

#result_container .type_modal_button { color: #FFFFFF; background-color: #5B51A9; background-image: none; font-family: "Pretendard-400"; font-size: 20px; line-height: 26px; }

#result_container .opinion_row { color: #FFFFFF; }

#result_container .test_explanation { font-family: "Pretendard-400"; font-size: 11px; line-height: 15px; color: #C5C8CB; }

#result_container .alarm_col { display: flex; background: rgba(255, 255, 255, 0.8); border: 2px solid #FDFFAB; border-radius: 10px; }

#result_container .alarm_col p { text-align: start; align-self: center; font-family: "KyoboHand"; }

#result_container .alarm_col .alarm_btn { margin: 2px 2px 2px auto; padding: 16px; font-family: "Pretendard-700"; color: #000000; background-color: #FDFFAB; border-radius: 10px; }

@media (max-width: 400px) { #result_container .alarm_col p { font-size: 3.5vw; line-height: 4.5vw; } #result_container .alarm_col .alarm_btn { font-size: 4vw; line-height: 5.5vw; } }

@media (min-width: 401px) { #result_container .alarm_col p { font-size: 14px; line-height: 18px; } #result_container .alarm_col .alarm_btn { font-size: 16px; line-height: 22px; } }

#result_container .social_link_row { padding: 0 20px; }

#result_container .social_link_row .social_link_col { position: relative; }

#result_container .social_link_row .social_link_col #social_link { position: absolute; bottom: 5%; width: 100%; height: 15%; }

#result_container .social_link_row .social_link_col img { width: 100%; height: auto; }

#result_container .share_row { color: #FFFFFF; }

#result_container .promo_link_row { margin-bottom: 150px; }

#result_container .promo_link_row a { font-family: "Pretendard-400"; font-size: 15px; line-height: 16px; color: #FFFFFF; border-bottom: 1px solid #FFFFFF; }

#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 { font-size: 24px; 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; }

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

.modal .modal_inner { background: linear-gradient(180deg, #17093F 39.06%, #352A86 100%); }

.modal .img_row { margin-top: 20px; }

.modal .img_row img { width: 100%; height: auto; }

.modal .img_row p { font-family: "Pretendard-200"; font-size: 22px; line-height: 33px; color: #FFFFFF; text-shadow: 0px 0px 4px #FFFFFF; }

.modal #modal_lower_btn { position: fixed; top: calc(100vh - 70px); 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; }

#login_modal { position: relative; border-radius: 10px; overflow: hidden; box-shadow: none; }

#login_modal .modal_inner { border-radius: 10px; overflow: hidden; background: linear-gradient(180deg, #1A164B 0%, #0E2D69 100%); }

#login_modal .notice_inner { margin-bottom: 100px; }

#login_modal .notice_inner img { padding-top: 50px; width: 70%; height: auto; }

#login_modal .notice_inner p { color: #FFFFFF; font-family: "KyoboHand"; font-size: 18px; line-height: 22px; }

#login_modal .button_wrapper { display: inline-block; width: 100%; }

#login_modal .button_wrapper #login_btn { display: inline-block; padding: 18px 10px; width: 100%; color: #FFFFFF; background: rgba(255, 255, 255, 0.27); border: 2px solid #FFFFFF; border-radius: 999px; font-family: "Pretendard-400"; font-size: 25px; line-height: 31px; }

#login_modal .close-modal { position: absolute; top: 15px; right: 15px; width: 15px; height: 15px; background-image: url("../../common/img/x_white.2518b1d871ef.svg"); background-size: cover; background-repeat: no-repeat; }

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

.bridge_inner { position: relative; display: none; cursor: pointer; }

.bridge_inner .chapter_box { margin-top: 10px; padding: 5px 12px; font-family: "Pretendard-600"; font-size: 16px; line-height: 24px; color: #746C8C; border: 1px solid #746C8C; border-radius: 99px; }

.bridge_inner .chapter_box[current] { color: #180A3F; background-color: #FFFFFF; }

.bridge_inner .chapter_title { margin-top: 10px; padding-left: 5px; font-family: "Pretendard-400"; font-size: 16px; line-height: 24px; color: #746C8C; }

.bridge_inner .chapter_title[current] { opacity: 1; font-family: "Pretendard-600"; font-size: 22px; line-height: 33px; color: #FFFFFF; }

.bridge_inner .decoration_col { padding: 10px 5px; }

.bridge_inner .decoration_col .decoration { margin-top: 6px; width: 2px; height: 2px; background-color: #746C8C; border-radius: 99px; }

.bridge_inner .decoration_col .decoration[current] { background-color: #FFFFFF; }

.bridge_inner .content_col p { font-family: "KyoboHand"; font-size: 18px; line-height: 27px; color: #FFFFFF; }

.bridge_inner .play_icon { width: 20px; height: auto; animation: 0.75s fadeIn alternate infinite; }

.bg_chapter { background: url("../img/intro/bg_chapter.72d8db7629cc.png"); background-size: cover; background-position: center; }

.summary_inner { display: none; background-image: url("../img/summary/bg_summary.54b5c62223f1.png"); background-size: cover; background-repeat: no-repeat; background-position: center; }

.summary_inner .summary_text { opacity: 0; font-family: "KyoboHand"; font-size: 18px; line-height: 25px; color: #FFFFFF; }

.summary_inner .summary_text.current { animation: 0.5s FadeIn forwards; }

.summary_inner .summary_text.shown { opacity: 1; }

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

.summary_inner .summary_img { max-width: 200px; width: 40vw; height: auto; animation: 0.75s hover alternate infinite linear; }

.summary_inner .content_wrapper { position: relative; padding: 8px 13px; width: fit-content; background: #EAF5F5; border: 2px solid #A0CCCE; box-sizing: border-box; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25); border-radius: 99px; }

.summary_inner .content_wrapper .guide { position: absolute; top: -40px; left: 50%; transform: translateX(-50%); animation: 0.75s guideHover alternate infinite linear; }

.summary_inner .content_wrapper .guide .click_text { font-family: "Pretendard-700"; color: #FFFFFF; text-shadow: none; font-size: 14px; line-height: 20px; }

.summary_inner .content_wrapper .text { font-family: "Pretendard-600"; color: #648C8E; text-shadow: none; font-size: 16px; line-height: 24px; }

@keyframes guideHover { 0% { transform: translate(-50%, 0); }
  100% { transform: translate(-50%, 5px); } }

.summary_inner .play_icon { width: 20px; height: auto; animation: 0.75s fadeIn alternate infinite; }

@keyframes hover { 0% { transform: translateY(0); }
  100% { transform: translateY(5px); } }

#login_inner { display: none; background: #1A164B; font-family: "Pretendard-400"; }

#login_inner img { max-width: 400px; width: 80vw; height: auto; }

#login_inner .notice { font-size: 18px; line-height: 27px; color: #FFFFFF; }

#login_inner .notice span { font-family: "Pretendard-700" !important; }

#login_inner #login_button { display: flex; justify-content: center; align-self: center; box-sizing: border-box; padding: 10px 16px; width: 100%; min-height: 60px; font-size: 25px; line-height: 35px; color: #FFFFFF; background: rgba(255, 255, 255, 0.27); border: 2px solid #FFFFFF; border-radius: 10px; backdrop-filter: blur(2px); }

#login_inner .skip_button_row { display: flex; }

#login_inner .skip_button_row #skip_login_button { padding: 0; font-size: 16px; line-height: 22px; color: #FFFFFF; background: transparent; border: none; }

#progress_inner { display: none; position: absolute; padding: 30px 60px; width: 100%; z-index: 1; }

#progress_inner .progress_content_box { display: flex; }

#progress_inner .progress_content_box .dot { margin: 0 auto; width: 10px; height: 10px; background-color: #EDF0F3; border-radius: 99px; }

#progress_inner .progress_content_box .dot.marked { background-color: #648C8E; }

#stars-group-1 { width: 4px; height: 4px; border-radius: 50%; opacity: 0; box-shadow: 1584px 772px #fff, 383px 677px #fff, 1356px 759px #fff, 262px 1502px #fff, 367px 788px #fff, 762px 448px #fff, 1784px 1262px #fff, 1311px 427px #fff, 1119px 502px #fff, 942px 1473px #fff, 1588px 411px #fff, 210px 758px #fff, 110px 229px #fff, 291px 450px #fff, 876px 124px #fff, 835px 438px #fff, 1048px 616px #fff, 1479px 1481px #fff, 438px 1115px #fff, 983px 549px #fff, 1235px 676px #fff, 580px 135px #fff, 1740px 471px #fff, 397px 846px #fff, 665px 76px #fff, 1155px 1382px #fff, 466px 1308px #fff, 182px 1017px #fff, 309px 338px #fff, 1245px 852px #fff, 816px 1425px #fff, 1708px 916px #fff, 1034px 317px #fff, 573px 216px #fff, 201px 1375px #fff, 1034px 235px #fff, 1510px 88px #fff, 1028px 1059px #fff, 1234px 843px #fff, 337px 1135px #fff, 1212px 183px #fff, 985px 672px #fff, 1487px 1744px #fff, 571px 421px #fff, 81px 784px #fff, 12px 1623px #fff, 697px 1232px #fff, 120px 87px #fff, 1343px 1610px #fff, 927px 4px #fff; animation-name: glowing-stars; animation-duration: 2s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; animation-delay: 0s; position: absolute; top: 0; left: -50%; margin-left: 50%; }

#stars-group-2 { width: 4px; height: 4px; border-radius: 50%; opacity: 0; box-shadow: 1429px 729px #fff, 1207px 742px #fff, 571px 285px #fff, 544px 1003px #fff, 1654px 776px #fff, 488px 1478px #fff, 833px 312px #fff, 1171px 1065px #fff, 1071px 1169px #fff, 1079px 1044px #fff, 325px 348px #fff, 432px 563px #fff, 1680px 974px #fff, 865px 5px #fff, 1544px 128px #fff, 64px 1142px #fff, 37px 909px #fff, 826px 768px #fff, 261px 39px #fff, 1651px 403px #fff, 377px 491px #fff, 1493px 1135px #fff, 1766px 31px #fff, 755px 868px #fff, 785px 1381px #fff, 696px 1800px #fff, 518px 781px #fff, 1739px 941px #fff, 127px 269px #fff, 202px 1569px #fff, 975px 580px #fff, 1613px 1192px #fff, 1597px 681px #fff, 351px 135px #fff, 1405px 606px #fff, 30px 376px #fff, 1731px 1287px #fff, 368px 489px #fff, 688px 1375px #fff, 55px 624px #fff, 278px 1737px #fff, 1054px 103px #fff, 690px 1295px #fff, 1507px 528px #fff, 609px 354px #fff, 912px 1795px #fff, 634px 177px #fff, 1518px 300px #fff, 1751px 548px #fff, 1672px 910px #fff; animation-name: glowing-stars; animation-duration: 1s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; animation-delay: 0.1s; position: absolute; top: 0; left: -50%; margin-left: 50%; }

#stars-group-3 { width: 4px; height: 4px; border-radius: 50%; opacity: 0; box-shadow: 636px 160px #fff, 916px 517px #fff, 1412px 1346px #fff, 1112px 93px #fff, 737px 1285px #fff, 411px 1633px #fff, 1143px 667px #fff, 674px 1139px #fff, 1013px 1526px #fff, 4px 1380px #fff, 916px 1538px #fff, 187px 12px #fff, 1264px 1191px #fff, 506px 1782px #fff, 1043px 1094px #fff, 232px 162px #fff, 1104px 892px #fff, 772px 1301px #fff, 126px 245px #fff, 1149px 151px #fff, 326px 731px #fff, 804px 1127px #fff, 1464px 1192px #fff, 1358px 1622px #fff, 690px 1311px #fff, 1353px 617px #fff, 200px 1566px #fff, 430px 473px #fff, 647px 332px #fff, 1185px 1380px #fff, 750px 582px #fff, 1363px 1433px #fff, 932px 1482px #fff, 899px 916px #fff, 1023px 659px #fff, 1043px 1071px #fff, 216px 912px #fff, 452px 1012px #fff, 68px 386px #fff, 1200px 1707px #fff, 865px 173px #fff, 1550px 848px #fff, 127px 1432px #fff, 1428px 610px #fff, 1248px 1655px #fff, 653px 1223px #fff, 1170px 386px #fff, 585px 198px #fff, 1616px 742px #fff, 267px 959px #fff; animation-name: glowing-stars; animation-duration: 2s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; animation-delay: 0.4s; position: absolute; top: 0; left: -50%; margin-left: 50%; }

#stars-group-4 { width: 4px; height: 4px; border-radius: 50%; opacity: 0; box-shadow: 1182px 273px #fff, 230px 126px #fff, 1510px 66px #fff, 703px 6px #fff, 1361px 722px #fff, 509px 1550px #fff, 15px 250px #fff, 939px 1079px #fff, 458px 1197px #fff, 763px 1306px #fff, 1088px 1247px #fff, 1268px 1543px #fff, 1085px 74px #fff, 1279px 1740px #fff, 1148px 369px #fff, 1612px 1196px #fff, 160px 856px #fff, 1315px 1023px #fff, 995px 1548px #fff, 1235px 644px #fff, 1577px 1730px #fff, 1714px 496px #fff, 283px 378px #fff, 6px 837px #fff, 325px 1452px #fff, 822px 730px #fff, 1539px 21px #fff, 299px 1493px #fff, 996px 1392px #fff, 627px 1434px #fff, 1151px 406px #fff, 549px 1454px #fff, 1425px 927px #fff, 1495px 104px #fff, 1388px 517px #fff, 438px 672px #fff, 129px 498px #fff, 1568px 395px #fff, 312px 38px #fff, 134px 459px #fff, 728px 234px #fff, 1545px 1418px #fff, 869px 677px #fff, 1427px 1114px #fff, 179px 650px #fff, 1664px 1379px #fff, 1623px 379px #fff, 796px 935px #fff, 1247px 1529px #fff, 1773px 389px #fff; animation-name: glowing-stars; animation-duration: 1s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; animation-delay: 0.3s; position: absolute; top: 0; left: -50%; margin-left: 50%; }

#stars-group-5 { width: 4px; height: 4px; border-radius: 50%; opacity: 0; box-shadow: 524px 1583px #fff, 1307px 1683px #fff, 1585px 1744px #fff, 475px 679px #fff, 428px 1015px #fff, 521px 794px #fff, 1393px 28px #fff, 1466px 324px #fff, 1255px 149px #fff, 1645px 1760px #fff, 193px 740px #fff, 453px 1093px #fff, 1686px 1756px #fff, 1340px 1795px #fff, 211px 1433px #fff, 490px 805px #fff, 371px 1264px #fff, 1311px 844px #fff, 636px 1251px #fff, 926px 295px #fff, 1724px 1373px #fff, 1000px 191px #fff, 1693px 931px #fff, 435px 589px #fff, 337px 336px #fff, 1493px 1294px #fff, 145px 995px #fff, 1112px 837px #fff, 166px 1373px #fff, 1170px 260px #fff, 285px 41px #fff, 392px 1032px #fff, 1567px 555px #fff, 1142px 73px #fff, 115px 602px #fff, 257px 1278px #fff, 869px 888px #fff, 1523px 1312px #fff, 1292px 337px #fff, 817px 1201px #fff, 1078px 332px #fff, 1212px 145px #fff, 96px 1345px #fff, 1466px 724px #fff, 988px 272px #fff, 877px 1700px #fff, 1004px 494px #fff, 1615px 214px #fff, 235px 1299px #fff, 350px 319px #fff; animation-name: glowing-stars; animation-duration: 2s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; animation-delay: 0.8s; position: absolute; top: 0; left: -50%; margin-left: 50%; }

#stars-group-6 { width: 4px; height: 4px; border-radius: 50%; opacity: 0; box-shadow: 1105px 759px #fff, 1660px 740px #fff, 257px 1175px #fff, 223px 1525px #fff, 545px 1456px #fff, 1540px 1191px #fff, 190px 633px #fff, 672px 1693px #fff, 320px 461px #fff, 1178px 1634px #fff, 1433px 450px #fff, 757px 1612px #fff, 1229px 380px #fff, 781px 510px #fff, 165px 1752px #fff, 13px 335px #fff, 1405px 1027px #fff, 799px 79px #fff, 508px 547px #fff, 819px 194px #fff, 1101px 38px #fff, 1161px 571px #fff, 1532px 759px #fff, 782px 734px #fff, 1255px 1335px #fff, 1095px 872px #fff, 520px 636px #fff, 218px 184px #fff, 730px 1072px #fff, 1150px 1398px #fff, 1094px 113px #fff, 1128px 1774px #fff, 752px 1546px #fff, 1619px 523px #fff, 1087px 1764px #fff, 1320px 1388px #fff, 1232px 109px #fff, 1306px 1111px #fff, 1083px 1756px #fff, 1225px 1697px #fff, 342px 1084px #fff, 74px 394px #fff, 188px 1693px #fff, 1028px 1005px #fff, 1059px 1291px #fff, 1525px 1266px #fff, 957px 1766px #fff, 395px 1385px #fff, 223px 1728px #fff, 1500px 1311px #fff; animation-name: glowing-stars; animation-duration: 1s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; animation-delay: 0.5s; position: absolute; top: 0; left: -50%; margin-left: 50%; }

.stars-group { display: none; }

@keyframes glowing-stars { 0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; } }