@charset "euc-kr";

/* ==============================
   preorder Àü¿ë css
============================== */

/* --- ½ÅûÇϱâ --- */
.mexx-preorder-form {max-width: 840px;margin: 0 auto;padding-top: 50px;}
.mexx-preorder-form__notice {text-align: right; color: var(--mexx-color-bluegray2); font-size: 14px; line-height: 1.428; margin-bottom: 10px;}
.mexx-preorder-form__certify {padding: 40px 40px; border: 1px solid var(--mexx-color-bluegray4);}
.mexx-certify__row {display: flex; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--mexx-color-bluegray4);}
.mexx-certify__row:first-child {padding-top: 0;}
.mexx-certify__row:last-child {padding-bottom: 0; border-bottom: 0;}
.mexx-certify__label {flex: 0 0 120px; width: 120px; padding-right: 20px;}
.mexx-certify__label label,
.mexx-certify__label p {display: inline-flex; align-items: center; gap: 2px; font-size: 16px; line-height: 1; color: var(--mexx-color-bluegray0); font-weight: 500;}
.mexx-certify__required {color: var(--mexx-color-orange);}
.mexx-certify__content {flex: 1; min-width: 0;}
.mexx-certify__field {position: relative;}
.mexx-certify__field-name {max-width: 276px;}
.mexx-certify__field-code {max-width: 430px;}
.mexx-certify__field-code .mexx-form-control {padding-right: 72px;}
.mexx-certify__radio-group {display: flex; align-items: center; gap: 28px;}
.mexx-certify__phone {display: flex; align-items: center; gap: 12px;}
.mexx-certify__field-phone {flex: 1; min-width: 0; max-width: 276px;}
.mexx-certify__send {flex: 0 0 126px; width: 126px; height: 40px; border: 0; border-radius: 5px; background: var(--mexx-color-bluegray1); color: var(--mexx-color-white); font-size: 14px; font-weight: 400; line-height: 1;}
.mexx-certify__time {position: absolute; top: 50%; right: 16px; transform: translateY(-50%); color: var(--mexx-color-orange2); font-size: 14px; line-height: 1;}
.mexx-preorder-form__btn {display: flex; justify-content: center; gap: 14px; padding-top: 30px;}
.mexx-certify__btn {display: inline-flex; align-items: center; justify-content: center; min-width: 136px; height: 58px; padding: 0 24px; border-radius: 9999px; font-size: 16px; font-weight: 500; line-height: 1; text-align: center;}
.mexx-preorder-form__btn .confirm {background: var(--mexx-color-navy); color: var(--mexx-color-white); border: 1px solid var(--mexx-color-navy);}
.mexx-preorder-form__warn {max-width: 840px; margin: 0 auto; margin-top: 100px; background: var(--mexx-color-bluegray6); padding: 30px 30px; color: var(--mexx-color-bluegray0);}
.mexx-preorder-form__warn p {font-size: 14px; line-height: 1.5; font-weight: 500;}
.mexx-preorder-form__warn ul {margin-top: 14px; padding-left: 5px;}
.mexx-preorder-form__warn ul li {position: relative; padding-left: 10px; font-size: 14px; line-height: 1.5;}
.mexx-preorder-form__warn ul li + li {margin-top: 2px;}
.mexx-preorder-form__warn ul li::before {content: "¡¤"; position: absolute; left: 0; top: 0;}



/* --- ¸®½ºÆ® --- */
.mexx-preorder-banner {padding: 50px 46px; background: var(--mexx-color-navy) url(https://russeldata.megastudy.net/campus/images/russel/mexx/preorder/banner_pattern.png) no-repeat center center / auto 170%; display: flex; justify-content: space-between; align-items: center;}
.mexx-preorder-banner__title {display: flex; align-items: center;}
.mexx-preorder-banner__title h4 {font-size: 28px; line-height: 1.4286; color: var(--mexx-color-white); font-weight: 500; display: flex; align-items: center;}
.mexx-preorder-banner__title h4:after {content: ''; display: block; width: 1px; height: 14px; background: var(--mexx-color-white); margin: 0 30px;}
.mexx-preorder-banner__title p {font-size: 18px; line-height: 1.5; color: var(--mexx-color-white); font-weight: 100;}
.mexx-preorder-banner__btn {display: flex; gap: 10px;}
.mexx-preorder-banner__btn button {display: flex; align-items: center; justify-content: center; height: 42px; padding: 0 26px; background: var(--mexx-color-white); color: var(--mexx-color-navy); font-size: 14px; line-height: 1.4286; border-radius: 5px; font-weight: 400;}

.mexx-preorder-list__table {width: 100%; border-collapse: collapse; table-layout: auto;}
.mexx-preorder-list__head {border-bottom: 1px solid var(--mexx-color-gray2);}
.mexx-preorder-list__head th {padding: 20px; font-size: 16px; line-height: 1.5; font-weight: 400; color: var(--mexx-color-bluegray0); text-align: center;}
.mexx-preorder-list__head th.field1,
.mexx-preorder-list__head th.field2,
.mexx-preorder-list__head th.field5 {width: 1%; white-space: nowrap;}
.mexx-preorder-list__head th.field4 {width: 320px;}
.mexx-preorder-list__head th:first-child,
.mexx-preorder-list__item td:first-child {padding-left: 30px;}
.mexx-preorder-list__item {border-bottom: 1px solid var(--mexx-color-border);}
.mexx-preorder-list__item td {vertical-align: middle;}
.mexx-preorder-list__field {padding: 16px 20px; font-size: 16px; line-height: 1.5; color: var(--mexx-color-navy); text-align: center; font-weight: 300;}
.mexx-preorder-list__field--title {text-align: left; color: var(--mexx-color-bluegray0); padding-left: 40px;}
.mexx-preorder-list__field--title strong {font-weight: 400;}
.mexx-preorder-list__field--title span {display: inline-flex; align-items: center; justify-content: center; margin-left: 4px; padding: 0 6px; height: 22px; font-size: 12px; line-height: 1; color: var(--mexx-color-orange); border: 1px solid var(--mexx-color-orange); border-radius: 4px; background: var(--mexx-color-orange4); font-weight: 500;}
.mexx-preorder-list__field--apply {display: flex; align-items: center; justify-content: center;}
.mexx-preorder-list__state {display: inline-flex; align-items: center; justify-content: center; width: 74px; height: 30px; padding: 0; font-size: 12px; line-height: 1; color: var(--mexx-color-white); border: 1px solid var(--mexx-color-orange); border-radius: 6px; background: var(--mexx-color-orange); font-weight: 400;}
.mexx-preorder-list__state--open {color: var(--mexx-color-orange);}
.mexx-preorder-list__field--category {white-space: nowrap;}
.mexx-preorder-list__field--teacher {white-space: nowrap;}
.mexx-preorder-list__field--date {color: var(--mexx-color-bluegray0);}
.mexx-preorder-list__field--apply {white-space: nowrap;}
.mexx-preorder-list__btn {display: inline-flex; align-items: center; justify-content: center; width: 84px; height: 30px; padding: 0; font-size: 12px; line-height: 1; color: var(--mexx-color-white); border: 1px solid var(--mexx-color-navy); border-radius: 6px; background: var(--mexx-color-navy); font-weight: 400;}
.mexx-preorder-list__btn--disabled {color: var(--mexx-color-gray4); border-color: var(--mexx-color-gray6); background: var(--mexx-color-gray6);}
.mexx-preorder-list__btn--success {color: var(--mexx-color-orange1); border-color: var(--mexx-color-orange4); background: var(--mexx-color-orange4);}
.mexx-preorder-list__btn:disabled {cursor: default;}
.mexx-preorder-list__btn.line {background: var(--mexx-color-white); border-color: var(--mexx-color-navy); color: var(--mexx-color-navy);}

.mexx-preorder-list__notice {margin-top: 40px; margin-bottom: 30px; padding: 30px 30px; border: 1px solid var(--mexx-color-bluegray4); color: var(--mexx-color-bluegray2);}
.mexx-preorder-list__notice-title {font-size: 16px; line-height: 1.5; font-weight: 500;}
.mexx-preorder-list__notice-list {margin-top: 14px; padding-left: 5px;}
.mexx-preorder-list__notice-list li {position: relative; padding-left: 10px; font-size: 14px; line-height: 1.5;}
.mexx-preorder-list__notice-list li + li {margin-top: 2px;}
.mexx-preorder-list__notice-list li::before {content: "¡¤"; position: absolute; left: 0; top: 0;}

/* --- Modal --- */
html.mexx-modal-open,
body.mexx-modal-open {overflow: hidden; height: 100%;}
.mexx-preorder-modal {display: none; position: fixed; inset: 0; z-index: 1200; align-items: center; justify-content: center;}
.mexx-preorder-modal--open {display: flex;}
.mexx-preorder-modal__overlay {position: absolute; inset: 0; background: var(--mexx-color-dim);}
.mexx-preorder-modal__content {position: relative;z-index: 1;display: flex;flex-direction: column;width: 90%;max-width: 864px;max-height: 84vh;background: var(--mexx-color-white);padding: 40px 40px;/* overflow: hidden; */}
.mexx-preorder-modal__head {flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; position: relative;}
.mexx-preorder-modal__title {font-size: 20px; font-weight: 500; color: var(--mexx-color-navy);}
.mexx-preorder-modal__close {width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: absolute; top: -5px; right: -5px;}

/* Çì´õ ¾Æ·¡ º»¹®¸¸ ½ºÅ©·Ñ */
.mexx-preorder-modal__body {display: none;flex: 1 1 auto;min-height: 0;overflow-y: auto;margin-right: -10px;padding-right: 10px;}
.mexx-preorder-modal__body.is-active {display: block;}

.mexx-preorder-modal__lectinfo {background: var(--mexx-color-bluegray6); margin-bottom: 30px;}
.mexx-preorder-modal__lectinfo dl {padding: 20px;}
.mexx-preorder-modal__lectinfo dl dt {color: var(--mexx-color-navy); font-size: 18px; font-weight: 500;}
.mexx-preorder-modal__lectinfo dl dd {color: var(--mexx-color-bluegray1); font-size: 16px; font-weight: 300;}
.mexx-preorder-modal__priva p {color: var(--mexx-color-bluegray1); font-size: 16px; margin-bottom: 12px; font-weight: 500;}
.mexx-preorder-modal__priva-info {white-space: pre-line;border: 1px solid var(--mexx-color-bluegray4);padding: 20px;color: var(--mexx-color-bluegray2);font-size: 14px;/* max-height: 252px; *//* overflow: auto; */}
.mexx-preorder-modal__btn {display: flex; justify-content: center; margin-top: 30px;}
.mexx-preorder-modal__btn .mexx-btn--lg {min-width: 120px;}

/* Á¶È¸ ¸®½ºÆ® */
.mexx-preorder-list--modal .mexx-preorder-list__head th.field1 {width: 1%; white-space: nowrap;}
.mexx-preorder-list--modal .mexx-preorder-list__head th.field2 {width: 1%; white-space: nowrap;}
.mexx-preorder-list--modal .mexx-preorder-list__head th.field4 {width: 1%; white-space: nowrap;}
.mexx-preorder-list--modal .mexx-preorder-list__item-empty {font-size: 16px; color: var(--mexx-color-bluegray2); font-weight: 300; text-align: center; padding: 20px 0; line-height: 1.5; border-bottom: 1px solid var(--mexx-color-border);}
.mexx-preorder-list--modal .mexx-preorder-list__scroll {max-height: 342px; overflow-y: auto; margin-right: -12px; padding-right: 7px;}
.mexx-preorder-list--modal .mexx-preorder-list__field--title strong {display: block; font-weight: 500;}
.mexx-preorder-list--modal .mexx-preorder-list__field--title span {display: block; margin-left: 0; padding: 0; height: auto; font-size: 16px; line-height: 1.5; color: var(--mexx-color-bluegray0); border: none; background: none; font-weight: 300;}
.mexx-preorder-list--modal .mexx-preorder-list__state {display: inline; width: auto; height: auto; font-size: 16px; line-height: 1.5; color: var(--mexx-color-orange); border: none; background: none; font-weight: 300;}
.mexx-preorder-list--modal .mexx-preorder-list__state.mexx-preorder-list__state--gray {color: var(--mexx-color-gray2);}

/* üũ¿ë ¸®½ºÆ®´Â ¹öÆ° Ä­ ¾øÀ½ */
.mexx-preorder-modal .mexx-preorder-list__item .mexx-preorder-list__field--apply {display: none;}
.mexx-preorder-modal__notice {margin-top: 30px; padding: 20px; background: var(--mexx-color-bluegray6); color: var(--mexx-color-bluegray2);}
.mexx-preorder-modal__notice li {position: relative; padding-left: 10px; font-size: 14px; line-height: 1.5;}
.mexx-preorder-modal__notice li + li {margin-top: 2px;}
.mexx-preorder-modal__notice li::before {content: "¡¤"; position: absolute; left: 0; top: 0;}

/* ½ºÅ©·Ñ Chrome, Edge, Safari */
.mexx-preorder-modal__body::-webkit-scrollbar {width: 5px;}
.mexx-preorder-modal__body::-webkit-scrollbar-track {background: var(--mexx-color-bluegray6); border-radius: 9999px;}
.mexx-preorder-modal__body::-webkit-scrollbar-thumb {background: var(--mexx-color-bluegray3); border-radius: 9999px;}
.mexx-preorder-modal__body::-webkit-scrollbar-thumb:hover {background: var(--mexx-color-bluegray3)}
.mexx-preorder-modal__body::-webkit-scrollbar-button {display: none; width: 0; height: 0;}



@media (max-width: 1199px) {
	/* --- ½ÅûÇϱâ --- */
	.mexx-preorder-form {padding-top: 0}
	.mexx-preorder-form__certify {padding: 28px 18px;}
	.mexx-certify__row {padding: 20px 0;}
	.mexx-certify__label {flex: 0 0 108px; width: 108px; padding-right: 16px;}
	.mexx-certify__label label,
	.mexx-certify__label p {font-size: 14px;}
	.mexx-certify__field-name {max-width: 254px;}
	.mexx-certify__field-phone {max-width: none;}
	.mexx-certify__field-code {max-width: none;}
	.mexx-certify__phone {gap: 10px;}
	.mexx-certify__send {flex: 0 0 148px; width: 148px;}
	.mexx-preorder-form__btn {padding-top: 20px;}
	.mexx-preorder-form__warn {margin-top: 0; margin-bottom: 20px; padding: 20px;}
	.mexx-preorder-form__warn p {font-size: 12px;}
	.mexx-preorder-form__warn ul {margin-top: 10px;}
	.mexx-preorder-form__warn ul li {font-size: 12px;}
	.mexx-preorder-form__notice {font-size: 12px;}

	/* --- ¸®½ºÆ® --- */
	.mexx-preorder-banner {flex-direction: column; align-items: center; gap: 16px; padding: 40px 20px;}
	.mexx-preorder-banner__title {display: block; text-align: center;}
	.mexx-preorder-banner__title h4 {font-size: 20px; line-height: 1.4444; display: block;}
	.mexx-preorder-banner__title h4:after {display: none;}
	.mexx-preorder-banner__title p {font-size: 12px; line-height: 1.5; margin-top: 4px;}
	.mexx-preorder-banner__btn button {height: 30px; padding: 0 16px; font-size: 12px; line-height: 1.3333;}

	.mexx-preorder-list {border-top: 1px solid var(--mexx-color-bluegray1);}
	.mexx-preorder-list__table,
	.mexx-preorder-list__body {display: block;}
	.mexx-preorder-list__head {display: none;}
	.mexx-preorder-list__head th:first-child,
	.mexx-preorder-list__item td:first-child {padding-left: 0;}
	.mexx-preorder-list__item {position: relative; display: block; padding: 20px 10px; border-bottom: 1px solid var(--mexx-color-border);}
	.mexx-preorder-list__field {display: block; padding: 0; text-align: left;}
	.mexx-preorder-list__field--category,
	.mexx-preorder-list__field--teacher {display: inline-block; font-size: 14px; line-height: 1.4286; font-weight: 500;}
	.mexx-preorder-list__field--teacher {margin-left: 6px;}	
	.mexx-preorder-list__field--title {margin-top: 6px; padding-right: 104px; font-size: 14px;}
	.mexx-preorder-list__field--title strong {font-weight: 500;}
	.mexx-preorder-list__field--apply {position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}
	.mexx-preorder-list__field--date {margin-top: 2px; font-size: 14px;}
	.mexx-preorder-list__btn {min-width: 70px;}

	.mexx-preorder-list__notice {margin-top: 30px; padding: 20px 18px;}
	.mexx-preorder-list__notice-title {font-size: 16px; line-height: 1.5;}
	.mexx-preorder-list__notice-list {margin-top: 12px;}
	.mexx-preorder-list__notice-list li {font-size: 13px; line-height: 1.5385;}

	/* --- Modal --- */
	.mexx-preorder-modal__content {padding: 30px 20px;}
	.mexx-preorder-modal__head {margin-bottom: 24px;}
	.mexx-preorder-modal__title {font-size: 18px;}
	.mexx-preorder-modal__lectinfo {margin-bottom: 24px;}
	.mexx-preorder-modal__lectinfo dl dt {font-size: 12px;}
	.mexx-preorder-modal__lectinfo dl dd {font-size: 12px;}
	.mexx-preorder-modal__priva p {font-size: 12px;}
	.mexx-preorder-modal__priva-info {font-size: 12px; padding: 10px;}
	.mexx-preorder-list--modal .mexx-preorder-list__scroll {max-height: 353px;}
	.mexx-preorder-modal__notice {padding: 20px 10px; margin-top: 24px;}
	.mexx-preorder-modal__notice li {font-size: 12px;}
	.mexx-preorder-modal .mexx-preorder-list__field--title {padding-right: 70px;}
	.mexx-preorder-list--modal .mexx-preorder-list__item-empty {display: block; padding: 0; font-size: 14px; border-bottom: none;}
	.mexx-preorder-list--modal .mexx-preorder-list__field--title span {font-size: 14px;}
	.mexx-preorder-list--modal .mexx-preorder-list__state  {position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 14px;}
}

@media (max-width: 767px) {
	/* --- ½ÅûÇϱâ --- */
	.mexx-preorder-form__certify {padding: 20px 14px;}
	.mexx-certify__row {display: block; padding: 18px 0;}
	.mexx-certify__row.only_line {display: flex; gap: 20px;}
	.mexx-certify__label {width: auto; padding-right: 0; margin-bottom: 12px;}
	.mexx-certify__row.only_line .mexx-certify__label {margin-bottom: 0; width: 100px; flex: 0 0 100px;}
	.mexx-certify__label label,
	.mexx-certify__label p {font-size: 14px;}
	.mexx-certify__field-name,
	.mexx-certify__field-phone,
	.mexx-certify__field-code {max-width: none;}
	.mexx-certify__radio-group {gap: 26px;}
	.mexx-form-radio__label {font-size: 14px;}
	.mexx-certify__phone {display: block;}
	.mexx-certify__send {width: 100%; margin-top: 10px;}

	/* --- ¸®½ºÆ® --- */
	.mexx-preorder-list__item {padding: 15px 10px 18px;}
	.mexx-preorder-list__field--category,
	.mexx-preorder-list__field--teacher {line-height: 1.3846;}
	.mexx-preorder-list__field--teacher {margin-left: 10px;}
	.mexx-preorder-list__field--title {margin-top: 6px;}
	.mexx-preorder-list__field--apply {bottom: 18px;}
	.mexx-preorder-list__notice {padding: 18px 14px;}
	.mexx-preorder-list__notice-title {font-size: 14px; line-height: 1.5;}
	.mexx-preorder-list__notice-list li {font-size: 12px; line-height: 1.5;}
	.mexx-preorder-list--modal .mexx-preorder-list__scroll {max-height: 319px;}

}