html, body {margin:0;height:100%;}
html { font-size: 15px }
body.waitMe_container {position: fixed; top: 0; left: 0;}

@media screen and (max-width: 400px) {
  html { font-size: 15px }
}

@media screen and (max-width: 375px) {
  html { font-size: 14px }
}

@media screen and (max-width: 370px) {
  html { font-size: 13.5px }
}

@media screen and (max-width: 340px) {
  html { font-size: 12px }
}

@media screen and (max-width: 300px) {
  html { font-size: 10.5px }
}

@media screen and (max-width: 261px) {
  html { font-size: 10px }
}


/*
@media screen and (max-width: 400px) {
  html { font-size: 15px }
}

@media screen and (max-width: 370px) {
  html { font-size: 13.5px }
}

@media screen and (max-width: 360px) {
  html { font-size: 12px }
}
*/

a, a:hover, a:visited {text-decoration:none; color: inherit;}
p {margin: 0;}
div.wrapper {position:relative;}
.container {margin:0 auto; max-width:400px;}
.content-body {position: relative; font-size: 0;}
.button {-webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; background-color: transparent; cursor: pointer;}
.button.disabled {cursor: not-allowed;}
.clearboth:after {content: ''; display: block; clear: both;}
.overflow-ellipsis {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.multiline-ellipsis-2 {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
ul {list-style: none; padding: 0; margin: 0;}
img {max-width: 100%;}
.text-danger {color: #ff0000;}
.row {display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
.col {position: relative; width: 100%; box-sizing: border-box;}
.d-inline-block {display: inline-block !important;}
input:focus, textarea:focus {outline: none;}
input[type="checkbox"] {margin-top: 0; margin-bottom: 0;}
input[type="number"], input[type="text"], input[type="password"], input[type="tel"], textarea {border: none; padding: 1rem 0.8rem;}
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none; margin: 0; border-radius: 0;
}
li.empty_list {text-align: center; padding: 5rem 0;}
.datepicker {position: absolute; left: 0; top: 0; background-color: #fff; border: 1px solid #b9c3c8;}
select {-webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent;}
@supports (-webkit-touch-callout: none) {
    select {text-align: center; text-indent: 15%;}
}
button {background: none; border: none; padding: 0; margin: 0; font: inherit; color: inherit; outline: inherit; cursor: pointer; font-size: 0;}
button.hidden {display: none; width: 0;}
.pb-0 {padding-bottom: 0 !important;} .pb-05 {padding-bottom: 0.5rem !important;} .pb-1 {padding-bottom: 1rem !important;} 
.mb-0 {margin-bottom: 0 !important;} .mb-05 {margin-bottom: 0.5rem !important;} .mb-1 {margin-bottom: 1rem !important;} 
.mt-0 {margin-top: 0 !important;} .mt-05 {margin-top: 0.5rem !important;} .mt-1 {margin-top: 1rem !important;} 
.my-2 {margin: 2rem 0 !important;}
.text-left {text-align: left !important;} .text-right {text-align: right !important;}
.font-weight-200 {font-weight: 200 !important;}
.font-weight-300 {font-weight: 300 !important;}
.font-weight-400 {font-weight: 400 !important;}
.font-weight-500 {font-weight: 500 !important;}
.font-weight-600 {font-weight: 600 !important;}
.font-weight-700 {font-weight: 700 !important;}
.font-weight-800 {font-weight: 800 !important;}
.font-weight-900 {font-weight: 900 !important;}


/* 모달(default) */
.modal-open {overflow: hidden;}
.modal-backdrop.show {opacity: .5; position: fixed; top: 0; left: 0; z-index: 999; width: 100vw; height: 100vh; background-color: #000;}
.modal {position: fixed; top:0; left: 0; z-index: 1000; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0;}
.modal .modal-dialog {position: absolute; width: 95%; max-width: 380px; max-height: 90vh; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; overflow: auto;}
.modal .modal-dialog .modal-header p {margin: 0; float: left;}
.modal .modal-dialog .modal-header button.close {padding: 0; float: right;}
.modal .modal-dialog .modal-header button.close span {display:block; font-size: 2rem; line-height: 2rem; width: 2rem; height: 2rem;}
.modal .modal-dialog .modal-body .header span.header_title {color: #3547ff;font-weight: bold;font-size: 1.2rem;}
.modal .modal-dialog .modal-body .header span.header_subtitle {color: #0bc0cf;font-size: 1rem;margin-left: 0.3rem;}
.modal .modal-dialog .modal-body {position: relative; font-size: 0;}
.modal .modal-dialog .modal-body button.close {position: absolute; right: 2%; top: 2%; font-size: 2rem;}

/* alert 모달 */
#alert-modal .modal-body {display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 3rem 0; min-height: 100px;}
#alert-modal .modal-body #alert-message {font-size: 1.2rem; line-height: 2rem; text-align: center;}

/* agree 모달 */
#agree-modal .agree_box {display: flex;flex-wrap: wrap;justify-content: flex-end;margin-top: 1rem;font-size: 1rem;position: absolute;width: calc(100% - 2rem);padding: 0 1rem;}
#agree-modal .agree_box .agree_radio_box {display: flex;width: 100%;justify-content: flex-end;padding-right: 1rem;}
#agree-modal .agree_box .agree_radio_box .radio {flex: 0 0 29%;display: flex;align-items: center;justify-content: flex-end;}
#agree-modal .agree_box .agree_radio_box .radio input[type="radio"] { margin-right: .5rem; }
#agree-modal .agree_box.agree1 {top: 42%;}
#agree-modal .agree_box.agree1 button {height: 2rem;width: 100%;margin-bottom: 1.5rem;}
#agree-modal .agree_box.agree2 {bottom: 18%;}
#agree-modal .agree_box.agree2 button {height: 2rem;width: 100%;margin-bottom: 1.5rem;}
#agree-modal .btn_close {position: absolute;bottom: 2.9%;height: 8.5%;width: 35%;left: 5%;}
#agree-modal .btn_confirm {position: absolute;bottom: 2.9%;height: 8.5%;width: 51.5%;right: 5%;}
#agree-modal .popup_button {margin-top: 2rem; width: 50%;}

.agree_content .btn_agree_confirm {height: 8.5%;width: 70%;position: absolute;bottom: 3%;left: 15%;}

.agree_content .btn_agree_confirm {height: 8.5%;width: 70%;position: absolute;bottom: 3%;left: 15%;}

/* index */
.index-container .btn-box {position: absolute; width: 100%; top: 53.5%; padding: 0 8%; box-sizing: border-box;}
.index-container .btn-box button {width: 100%; padding-bottom: 19.8%; border-radius: 50px;}

.index-container .media-box {position: absolute; width: 100%; bottom: 5%; padding: 0 5%; box-sizing: border-box;}
.index-container .media-box .media {position: relative; width: 100%; height: 0; padding-bottom: 56.25%;}
.index-container .media-box .media iframe, .index-container .media-box .media video {position: absolute; top: 0; left:0; width: 100%; height: 100%;}

/* application */
.application-container .application-box {position: absolute; width: 100%; top: 25%; padding: 5%; box-sizing: border-box;}
.application-container .application-box .input-row {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; height: 3rem; margin-bottom: 1rem; }
.application-container .application-box .input-row .input-title {flex: 0 0 25%; display: flex; align-items: center; justify-content: center; background: #003cdb; color: #fff; height: 100%; border-radius: 5px;}
.application-container .application-box .input-row .input-title span {font-size: 1.2rem;}
.application-container .application-box .input-row .input-value {flex: 0 0 72%; height: 100%; font-weight: 500;}
.application-container .application-box .input-row .input-value input {padding: 0; width: 100%; height: 100%; border-radius: 5px; text-align: center; font-size: 1.2rem;}

.application-container .application-box .input-row.mobile .mobile-box {display: flex; justify-content: space-between; align-items: center; height: 100%;}
.application-container .application-box .input-row.mobile .mobile-box .mobile {flex: 0 0 32%; height: 100%; border-radius: 5px;}
.application-container .application-box .input-row.mobile .mobile-box .mobile select {border: none; width: 100%; height: 100%; border-radius: 5px; text-align: center; font-size: 1.2rem; color: #000;}

.application-container .application-box .input-row.gender .radio-box {display: flex; justify-content: space-between; align-items: center; height: 100%;}
.application-container .application-box .input-row.gender .radio-box .gender {flex: 0 0 49%; height: 100%; border-radius: 5px;}
.application-container .application-box .input-row.gender .radio-box .gender input {visibility: hidden; height: 0; margin: 0; width: 0;}
.application-container .application-box .input-row.gender .radio-box .gender label {font-size: 1.2rem; text-align: center; width: 100%; border-radius: 5px; background: #fff; height: 100%;  display: flex; align-items: center; justify-content: center; color: #969696; border: 2px solid #fff; box-sizing: border-box;}
.application-container .application-box .input-row.gender .radio-box .gender input:checked + label {border-color: #003cdb; color: #003cdb;}

.application-container .application-box .input-row.year .birth-box {display: flex; justify-content: space-between; align-items: center; height: 100%;}
.application-container .application-box .input-row.year .birth-box .select-box {flex: 0 0 49%; height: 100%; border-radius: 5px;}
.application-container .application-box .input-row.year .birth-box .select-box select {border: none; width: 100%; height: 100%; border-radius: 5px; text-align: center; font-size: 1.2rem; color: #969696;}
.application-container .application-box .input-row.year .birth-box .select-box select.selected,
.application-container .application-box .input-row.year .birth-box .select-box select option {color: #000;}

.application-container .application-box .input-row.region .region-box {display: flex; justify-content: space-between; align-items: center; height: 100%;}
.application-container .application-box .input-row.region .region-box .select-box {flex: 0 0 49%; height: 100%; border-radius: 5px;}
.application-container .application-box .input-row.region .region-box .select-box select {border: none; width: 100%; height: 100%; border-radius: 5px; text-align: center; font-size: 1.2rem; color: #969696;}
.application-container .application-box .input-row.region .region-box .select-box select.selected,
.application-container .application-box .input-row.region .region-box .select-box select option {color: #000;}

.application-container .btn-box {position: absolute; width: 100%; bottom: 5%; padding: 0 5%; box-sizing: border-box;}
.application-container .btn-box button {}


/* closed */
.closed-container .content-body {font-size: 1.4rem; font-weight: 600; margin: 3rem 0; text-align: center; display: flex; align-items: center; justify-content: center; height: 80vh;}


/* 2026TC */
.index-container.e_2606TC .btn-box {top: 57.5%;}
.index-container.e_2606TC .btn-box button {padding-bottom: 17.8%;}
.index-container.e_2606TC .media-box {bottom: 3%;}

.application-container.e_2606TC .application-box {top: 30%;}