@import url("https://fonts.cdnfonts.com/css/times-new-roman");
@font-face {
    font-family: "JalnanGothic";
    src: url("https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/JalnanGothic.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

* {
    font-family: "Pretendard", sans-serif !important;
    box-sizing: border-box;
    letter-spacing: -0.3px;
}

body,
html {
    height: 100%;
    background: #000;
}

#root {
    position: relative;
    padding-top: 45px;
    padding-bottom: 60px;
    background-color: #07070B;
    width: 100%;
    height: auto;
    background: url("/images/mainbg.png");
    background-size: auto;
    background-repeat: no-repeat;
    background-position: top;
}

@keyframes logo-scale {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.03);
    }
    100% {
        transform: scale(1);
    }
}

.mainbiglogo {
    position: absolute;
    top: 10%;
    z-index: 1;
    left: 50%;
    transform: translateX(-36%);
}

.mainbiglogo img {
    animation: logo-scale 2s infinite ease-in-out;
}

.bg {
    background-size: cover !important;
    background-repeat: no-repeat;
    background-position: center;
}

.blankdiv {
    visibility: hidden;
}

.disnone {
    display: none !important;
}

.w100 {
    width: 100%;
}

.flexalign,
.topmenu li button,
.topmenu,
.pc-header .loginafter-top .logoutbutDiv button,
.pc-header .loginafter-top .logoutbutDiv,
.pc-header .loginbefore-top .lognonebutDiv button,
.pc-header .loginbefore-top .lognonebutDiv,
.pc-header .infolist .messageli button,
.pc-header .infolist .bellli button,
.pc-header .infolist .chargeli button,
.pc-header .infolist li,
.pc-header .infolist,
.pc-header .flexdiv,
.goldborderdiv .blackdiv {
    display: flex;
    align-items: center;
}

.max1380 {
    max-width: 1380px;
    margin: 0 auto;
}

.contentWrap {
    width: 100%;
    margin: 0 auto;
    min-height: calc(-60px + 100vh);
    margin-left: auto;
}

.contentWrap .heightbox {
    min-height: 418px;
}

.primaryinfobox,
.form-select,
.form-control,
.primary-textarea,
.datepicker {
    background-color: rgba(0, 0, 0, 0.8) !important;
    border: 1px solid #404040;
    width: 100% !important;
    height: 50px;
    border-radius: 5px;
    font-size: 14px;
    color: #f0f0f0 !important;
    font-weight: 300;
}

.datepickerDiv {
    position: relative;
    width: 140px !important;
    height: 40px;
}

.datepicker {
    padding: 0 10px;
    height: 40px;
    cursor: pointer;
}

.datepickericon {
    position: absolute;
    right: 10px;
    top: 8px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("/images/ico_21.png?2");
}

.goldborderdiv {
    width: auto;
    height: 36px;
    padding: 1px;
    background: linear-gradient(180deg, #FFBC3F -9.97%, #783315 91.85%);
}

.goldborderdiv .blackdiv {
    background-color: #000000;
    width: 100%;
    height: 100%;
    padding: 0 10px;
    justify-content: space-between;
}

.goldborderdiv .blackdiv span {
    font-size: 14px;
    font-weight: 300;
    color: #fff;
}

.goldborderdiv .blackdiv span:nth-child(1) {
    color: #FFC13C;
    margin-right: 30px;
}

.primary-textarea {
    height: 226px;
    line-height: 26px;
    padding: 20px;
    margin-top: 10px;
}

input::-moz-placeholder {
    color: #999999 !important;
    font-weight: 300;
}

input::placeholder {
    color: #999999 !important;
    font-weight: 300;
}

.input-flexDiv {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 15px;
}

.input-flexDiv .input-flexDiv-bottom {
    width: 100%;
    display: flex;
    margin-top: 10px;
}

.input-flexDiv .input-group,
.input-flexDiv .form-control {
    margin-top: 0 !important;
}

.input-flexDiv .input-buttonbox {
    display: flex;
    align-items: center;
}

.input-flexDiv .input-buttonbox button {
    margin-left: 10px;
}

.nameformbox .input-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 15px;
}

.nameformbox .form-control,
.nameformbox .form-select {
    margin-top: 10px;
}

.nameformbox .input-name {
    width: 100%;
    font-size: 14px;
    color: #fff;
    font-weight: 200 !important;
}

.boardtopline {
    width: 100%;
    height: 7px;
    background-image: url("/images/line.png?2");
}

.tableContent .tableContent-div .tableContent-div-header {
    width: 100%;
    background: transparent linear-gradient(180deg, #262626 0%, #111111 69%, #111111 100%) 0% 0%;
    height: 56px;
    display: flex;
    align-items: center;
}

.tableContent .tableContent-div .tableContent-div-header>div {
    display: flex;
    align-items: center;
    justify-content: center;
}

.tableContent .tableContent-div .tableContent-div-header>div p {
    font-size: 14px;
    color: #fff;
    font-weight: 300;
}

.tableContent .tableContent-four .tableContent-div-header-01,
.tableContent .tableContent-four .accordion-button-01 {
    width: 15%;
}

.tableContent .tableContent-four .tableContent-div-header-02,
.tableContent .tableContent-four .accordion-button-02 {
    width: 55%;
}

.tableContent .tableContent-four .tableContent-div-header-03,
.tableContent .tableContent-four .accordion-button-03 {
    width: 10%;
}

.tableContent .tableContent-four .tableContent-div-header-04,
.tableContent .tableContent-four .accordion-button-04 {
    width: 10%;
}

.tableContent .tableContent-four .tableContent-div-header-04,
.tableContent .tableContent-four .accordion-button-04 {
    width: 10%;
}

.tableContent .tableContent-seven .tableContent-div-body ul li {
    width: 100%;
    display: flex;
    align-items: center;
    height: 48px;
    background-color: #202020;
}

.tableContent .tableContent-seven .tableContent-div-body ul li>div p {
    text-align: center;
    color: #fff;
    font-size: 14px;
    font-weight: 200;
}

.tableContent .tableContent-seven .tableContent-div-body ul li:nth-child(even) {
    background-color: #191919;
}

.tableContent .tableContent-seven .tableContent-div-header-01,
.tableContent .tableContent-seven .tableContent-div-body-01 {
    width: 10%;
}

.tableContent .tableContent-seven .tableContent-div-header-02,
.tableContent .tableContent-seven .tableContent-div-body-02 {
    width: 15%;
}

.tableContent .tableContent-seven .tableContent-div-header-03,
.tableContent .tableContent-seven .tableContent-div-body-03 {
    width: 15%;
}

.tableContent .tableContent-seven .tableContent-div-header-04,
.tableContent .tableContent-seven .tableContent-div-body-04 {
    width: 15%;
}

.tableContent .tableContent-seven .tableContent-div-header-05,
.tableContent .tableContent-seven .tableContent-div-body-05 {
    width: 15%;
}

.tableContent .tableContent-seven .tableContent-div-header-06,
.tableContent .tableContent-seven .tableContent-div-body-06 {
    width: 15%;
}

.tableContent .tableContent-seven .tableContent-div-header-07,
.tableContent .tableContent-seven .tableContent-div-body-07 {
    width: 15%;
}

.tableContent .tableContent-seven .tableContent-div-body ul {
    width: 100%;
}

.tableContent .tableContent-two .tableContent-div-header-01,
.tableContent .tableContent-two .accordion-button-01 {
    width: 15% !important;
}

.tableContent .tableContent-two .tableContent-div-header-02,
.tableContent .tableContent-two .accordion-button-02 {
    width: 75% !important;
}

.graycolor {
    font-size: 13px !important;
    color: #767676 !important;
}

.yellowcolor {
    color: #FEE98E !important;
}

.redbold,
.bluebold {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 20px;
    font-size: 12px !important;
    font-weight: 200 !important;
    color: #FF6060 !important;
    background-color: #101010;
    border: 1px solid #FF6060;
    border-radius: 5px;
    margin: 0 auto;
}

.redcolor {
    color: #FF6060 !important;
}

.bluebold {
    color: #609FFF !important;
    border: 1px solid #609FFF !important;
}

.bluecolor {
    color: #609FFF !important;
}

.accordion ul li:nth-child(even) .accordion-button {
    background-color: #191919 !important;
}

.accordion .accordion-button:not(.collapsed) {
    box-shadow: none;
}

.accordion .accordion-item {
    border: none;
}

.accordion .accordion-button {
    cursor: pointer;
    padding: 0;
    height: 48px;
    background-color: #202020;
    border-radius: 0 !important;
}

.accordion .accordion-button>div {
    height: 100%;
}

.accordion .accordion-button>div p {
    font-size: 14px;
    color: #fff;
    font-weight: 200;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.accordion .accordion-button>div p.titleleft {
    justify-content: left;
}

.accordion .accordion-button::after,
.accordion .accordion-button:not(.collapsed)::after {
    display: none;
}

.accordion .replebody {
    background-color: #101010;
    padding: 20px;
    font-size: 14px;
    line-height: 26px;
    word-break: keep-all;
    font-weight: 300;
    color: #fff;
}

.input-group> :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    border-radius: 5px !important;
}

.primary-button {
    width: 155px;
    height: 50px;
    border-radius: 5px !important;
    font-size: 16px;
    color: #fff;
    background: linear-gradient(180deg, #FDC536 0%, #FF6500 100%);
}

.black-button {
    background: transparent linear-gradient(180deg, #404040 0%, #000000 100%) 0% 0% no-repeat padding-box;
}

.primary-button:hover {
    background: transparent linear-gradient(180deg, #000000 0%, #000000 100%) 0% 0% no-repeat padding-box;
    border: 1px solid #FF9318;
    color: #FF9318;
}

.blackbtn {
    background: transparent linear-gradient(180deg, #000000 0%, #000000 100%) 0% 0% no-repeat padding-box !important;
    border: 1px solid #FF9318 !important;
    color: #FF9318 !important;
}

.numnav {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
}

.numnav li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-size: 14px;
    color: #fff;
    font-weight: 300;
}

.numnav li a img {
    height: 14px;
}

.numnav li a.active {
    background-color: #101010;
    border: 1px solid #FF9318;
    color: #FF9318;
}

.pc-header {
    position: fixed;
    top: 24px;
    left: 0;
    z-index: 30;
    width: 100%;
    transition: all 0.2s;
}

.pc-header .top-left {
    display: flex;
    align-items: center;
}

.pc-header .top-left .hammenu {
    color: #fff !important;
    padding: 0;
    --bs-btn-line-height: none;
    --bs-btn-border-width: none;
    border: none !important;
    margin-top: -6px;
    margin-right: 10px;
}

.pc-header .flexdiv {
    max-width: 1380px;
    margin: 0 auto;
    width: 100%;
    height: 42px;
    justify-content: space-between;
}

.pc-header .logo {
    height: 60px;
}

.pc-header .infolist {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.pc-header .infolist .mbspan {
    margin-bottom: -2px;
}

.pc-header .infolist .coinicon,
.pc-header .infolist .staricon {
    height: 28px;
}

.pc-header .infolist .bellicon {
    height: 25px;
}

.pc-header .infolist .messageicon {
    height: 18px;
}

.pc-header .infolist li {
    width: auto;
    height: 40px;
    padding: 6px;
    margin-right: 15px;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.93) -3.55%, rgba(48, 48, 48, 0.7905) 60.55%, rgba(0, 0, 0, 0) 110.91%);
    border-radius: 50px;
}

.pc-header .infolist li>span {
    line-height: normal;
    margin-left: 6px;
    font-family: "JalnanGothic" !important;
    color: #fff;
}

.pc-header .infolist .chargeli {
    margin-right: 8px !important;
}

.pc-header .infolist .chargeli button {
    justify-content: center;
    width: 52px;
    height: 52px;
    background-image: url("/images/plusbuttonbg.png");
    background-size: contain;
    background-repeat: no-repeat;
    color: #fff;
    font-size: 22px;
}

.pc-header .infolist .chargeli button span {
    font-family: "Pretendard", sans-serif !important;
    margin-top: -3px;
}

.pc-header .infolist .bellli {
    padding-left: 15px;
}

.pc-header .infolist .bellli button span {
    font-family: "Pretendard", sans-serif !important;
    line-height: normal;
    margin-left: 6px;
    font-family: "JalnanGothic" !important;
    color: #fff;
}

.pc-header .infolist .messageli {
    padding-left: 15px;
}

.pc-header .infolist .messageli button span {
    font-family: "Pretendard", sans-serif !important;
    line-height: normal;
    margin-left: 6px;
    font-family: "JalnanGothic" !important;
    color: #fff;
}

.pc-header .infolist li:last-child {
    margin-right: 0;
}

.pc-header .loginbefore-top .lognonebutDiv button {
    justify-content: center;
    font-size: 18px;
    transition: all 0.2s;
}

.pc-header .loginbefore-top .lognonebutDiv button span {
    color: #fff;
}

.pc-header .loginbefore-top .lognonebutDiv .signbut {
    width: 136px;
    height: 62px;
    background: url("/images/signbut.png");
    margin-right: 10px;
}

.pc-header .loginbefore-top .lognonebutDiv .loginbut {
    width: 136px;
    height: 62px;
    background: url("/images/loginbut.png");
}

.pc-header .loginbefore-top .lognonebutDiv button:hover {
    transform: scale(1.03);
}

.pc-header .loginafter-top .logoutbutDiv button {
    justify-content: center;
}

.pc-header .loginafter-top .logoutbutDiv button span {
    color: #fff;
}

.pc-header .loginafter-top .logoutbutDiv .signbut {
    padding: 0 15px;
    width: auto;
    height: 46px;
    background: linear-gradient(140.25deg, #ffae00 5%, #ff5c11 86.2%);
    box-shadow: inset 0px -2px 4.5px rgba(0, 0, 0, 0.41);
    border-radius: 50px;
}

.pc-header .login-top .loginicon,
.pc-header .login-top .signicon {
    height: 20px;
}

.pc-header.ontop {
    top: 0;
    padding: 22px 0;
    background: rgba(2, 2, 2, 0.83);
    border-bottom: 1px solid #ffae00;
}

.closeicon {
    color: #fff;
}

.offcanvas.offcanvas-start {
    width: 300px;
}

.offcanvas {
    width: 300px;
    background-color: rgba(0, 0, 0, 0.85);
}

.offcanvas .offcanvas-header {
    padding-top: 25px;
}

.offcanvas .logoimg {
    height: 60px;
}

.offcanvas .btn-close {
    position: absolute;
    top: 24px;
    right: 20px;
    opacity: 1;
}

.offcanvas ul li {
    display: flex;
    align-self: center;
    margin-right: 30px;
    height: 50px;
    border-bottom: 1px solid #262626;
}

.offcanvas ul li button {
    width: 100%;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 15px;
    font-weight: 300;
}

.offcanvas ul li button .menuicon {
    width: 19px;
    height: 19px;
}

.offcanvas ul li button span {
    display: inline-block;
    margin-left: 5px;
}

.offcanvas ul li button:hover span {
    font-weight: 800;
    background: linear-gradient(180deg, rgba(255, 236, 159, 0.93) 51.5%, rgba(255, 133, 12, 0.93) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}

.offcanvas ul li .chargeicon {
    width: 21px;
    height: 24px;
    background-image: url("/images/icon/chargeicon.png");
}

.offcanvas ul li .refundicon {
    width: 21px;
    height: 24px;
    background-image: url("/images/icon/refundicon.png");
}

.offcanvas ul li .pointicon {
    width: 19px;
    height: 24px;
    background-image: url("/images/icon/pointicon.png");
}

.offcanvas ul li .beticon {
    width: 22px;
    height: 24px;
    background-image: url("/images/icon/beticon.png");
}

.offcanvas ul li .attendicon {
    width: 24px;
    height: 24px;
    background-image: url("/images/icon/attendicon.png");
}

.offcanvas ul li .alarmicon {
    width: 21px;
    height: 24px;
    background-image: url("/images/icon/alarmicon.png");
}

.offcanvas ul li .customericon {
    width: 24px;
    height: 24px;
    background-image: url("/images/icon/customericon.png");
}

.offcanvas ul li .chargeicon-button:hover .chargeicon {
    background-image: url("/images/icon/chargeicon-hover.png");
}

.offcanvas ul li .refundicon-button:hover .refundicon {
    background-image: url("/images/icon/refundicon-hover.png");
}

.offcanvas ul li .pointicon-button:hover .pointicon {
    background-image: url("/images/icon/pointicon-hover.png");
}

.offcanvas ul li .beticon-button:hover .beticon {
    background-image: url("/images/icon/beticon-hover.png");
}

.offcanvas ul li .attendicon-button:hover .attendicon {
    background-image: url("/images/icon/attendicon-hover.png");
}

.offcanvas ul li .alarmicon-button:hover .alarmicon {
    background-image: url("/images/icon/alarmicon-hover.png");
}

.offcanvas ul li .customericon-button:hover .customericon {
    background-image: url("/images/icon/customericon-hover.png");
}

.topmenu {
    position: relative;
    justify-content: center;
    padding-top: 64px;
    z-index: 2;
}

.topmenu li {
    margin-right: 62px;
}

.topmenu li button span {
    font-size: 17px;
    color: #fff;
    font-weight: 600;
    margin-left: 10px;
}

.topmenu li button:hover span {
    font-weight: 800;
    background: linear-gradient(180deg, rgba(255, 236, 159, 0.93) 51.5%, rgba(255, 133, 12, 0.93) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}

.topmenu li:last-child {
    margin-right: 0;
}

.topmenu .chargeicon {
    width: 21px;
    height: 24px;
    background-image: url("/images/icon/chargeicon.png");
}

.topmenu .refundicon {
    width: 21px;
    height: 24px;
    background-image: url("/images/icon/refundicon.png");
}

.topmenu .pointicon {
    width: 19px;
    height: 24px;
    background-image: url("/images/icon/pointicon.png");
}

.topmenu .beticon {
    width: 22px;
    height: 24px;
    background-image: url("/images/icon/beticon.png");
}

.topmenu .alarmicon {
    width: 21px;
    height: 24px;
    background-image: url("/images/icon/alarmicon.png");
}

.topmenu .customericon {
    width: 24px;
    height: 24px;
    background-image: url("/images/icon/customericon.png");
}

.topmenu .chargeicon-button:hover .chargeicon {
    background-image: url("/images/icon/chargeicon-hover.png");
}

.topmenu .refundicon-button:hover .refundicon {
    background-image: url("/images/icon/refundicon-hover.png");
}

.topmenu .pointicon-button:hover .pointicon {
    background-image: url("/images/icon/pointicon-hover.png");
}

.topmenu .beticon-button:hover .beticon {
    background-image: url("/images/icon/beticon-hover.png");
}

.topmenu .attendicon-button:hover .attendicon {
    background-image: url("/images/icon/attendicon-hover.png");
}

.topmenu .alarmicon-button:hover .alarmicon {
    background-image: url("/images/icon/alarmicon-hover.png");
}

.topmenu .customericon-button:hover .customericon {
    background-image: url("/images/icon/customericon-hover.png");
}

#footarea {
    padding-top: 60px;
}

/*# sourceMappingURL=style.css.map */

/* 경고창 */

.alert-modal .modal-content {
    background-color: #121212;
    border: 10px solid #242424;
}

.alert-modal .modal-header {
    border: none;
    padding-bottom: 0;
}

.alert-modal .modal-body {
    padding-top: 0;
    text-align: center;
}

.alert-modal .modal-body p {
    color: #fff;
    font-size: 1rem;
    background-color: #232122;
    border: 1px solid #818181;
    color: #bbb;
    border-radius: 4px;
    padding: 20px 5px;
}

.partner_btn {
    color: #fff;
    font-size: 0.8rem;
    font-weight: 300;
    margin-right: 10px;
    border: 1px solid #fff;
    padding: 5px;
}