@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Noto+Sans:ital,wght@0,100;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;1,100;1,200&display=swap');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

* {outline:0 !important; }
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,
dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0;}
html, body{width:100%;}
html{-webkit-touch-callout:none; }
body{width:100%; background:#fff; -webkit-text-size-adjust:none;word-wrap:break-word;word-break:break-all;}

table{width:100%;border-spacing:0;border-collapse:collapse;}
img,fieldset{border:0;}
address,cite,code{font-style:normal;font-weight:normal;}
label,img,input,select,textarea,button{vertical-align:middle;}
.hide,caption,legend{line-height:0;font-size:1px;overflow:hidden;}
hr{display:none;}
main,header,section,nav,footer,aside,article,figure{display:block;}
a{color:#000;text-decoration:none;}


.ql-editor {
    font-family: 'Pretendard', sans-serif;
    width:100%; background:#fff; -webkit-text-size-adjust:none;word-wrap:break-word;word-break:break-all;
}


:root {
    --animate-duration: .3s !important;
    --animate-delay: .3s !important;

}
.noselect {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* Internet Explorer/Edge */
    user-select: none;         /* 표준 문법 */
}

.main-container {
    container-name: main-container;
    container-type: inline-size;
}

@container main-container (min-width: 728px) {
    .isMobile {
        display: none;
    }
    .isPc {
        display: block;
    }
    .px-auto {
        padding-left: 2rem;
        padding-right: 2rem;
    }
}

@container main-container (max-width: 728px) {
    .isMobile {
        display: block;
    }
    .isPc {
        display: none;
    }
    .px-auto {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}
*{
    letter-spacing: -1px;
}
body {
    font-family: 'Pretendard', sans-serif;

}
summary {
    list-style: none; /* 또는 list-style-type: none; */
}
summary::-webkit-details-marker {
    display: none;
}

.tra100{
    transition: all 0.1s ease;
}

.tra200{
    transition: all 0.2s ease;
}
.tra300{
    transition: all 0.3s ease;
}

p{
    font-size:16px;
}


.h0{
    height: 0;
    overflow: hidden;
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
}



.table {
    width: 100%;
    border: 1px solid #e9ecef;
    color: #212529;
}

.table th,
.table td {
    padding: 1rem;
    vertical-align: top;
    border-top: 1px solid #e9ecef;
}

.table thead th {
    vertical-align: middle;
    border-bottom: 1px solid #e9ecef;
}

.table tbody + tbody {
    border-top: 1px solid #e9ecef;
}

.table-sm th,
.table-sm td {
    padding: 1rem 0.2rem;

    text-align:left;
}

.table-bordered {
    border: 1px solid #e9ecef;
}

.table-bordered th,
.table-bordered td {
    border: 1px solid #e9ecef;
}

.table-bordered thead th,
.table-bordered thead td {
    border-bottom-width: 1px;
}

.table-borderless th,
.table-borderless td,
.table-borderless thead th,
.table-borderless tbody + tbody {
    border: 0;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.05);
}

.table-hover tbody tr:hover {
    color: #212529;
    background-color: #f8f9fa;
}

.table-primary,
.table-primary > th,
.table-primary > td {
    background-color: #feeae4;
}

.table-primary th,
.table-primary td,
.table-primary thead th,
.table-primary tbody + tbody {
    border-color: #fdc8b9;
}

.table-hover .table-primary:hover {
    background-color: #fdd7cb;
}

.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
    background-color: #fdd7cb;
}

.table-secondary,
.table-secondary > th,
.table-secondary > td {
    background-color: #fefefe;
}

.table-secondary th,
.table-secondary td,
.table-secondary thead th,
.table-secondary tbody + tbody {
    border-color: #fbfcfc;
}

.table-hover .table-secondary:hover {
    background-color: #f1f1f1;
}

.table-hover .table-secondary:hover > td,
.table-hover .table-secondary:hover > th {
    background-color: #f1f1f1;
}

.table-success,
.table-success > th,
.table-success > td {
    background-color: #ccf3e9;
}

.table-success th,
.table-success td,
.table-success thead th,
.table-success tbody + tbody {
    border-color: #7adfc6;
}

.table-hover .table-success:hover {
    background-color: #b7eee0;
}

.table-hover .table-success:hover > td,
.table-hover .table-success:hover > th {
    background-color: #b7eee0;
}

.table-info,
.table-info > th,
.table-info > td {
    background-color: #cdeefd;
}

.table-info th,
.table-info td,
.table-info thead th,
.table-info tbody + tbody {
    border-color: #7cd2f9;
}

.table-hover .table-info:hover {
    background-color: #b4e6fc;
}

.table-hover .table-info:hover > td,
.table-hover .table-info:hover > th {
    background-color: #b4e6fc;
}

.table-warning,
.table-warning > th,
.table-warning > td {
    background-color: #fff3cd;
}

.table-warning th,
.table-warning td,
.table-warning thead th,
.table-warning tbody + tbody {
    border-color: #fedf7e;
}

.table-hover .table-warning:hover {
    background-color: #ffedb4;
}

.table-hover .table-warning:hover > td,
.table-hover .table-warning:hover > th {
    background-color: #ffedb4;
}

.table-danger,
.table-danger > th,
.table-danger > td {
    background-color: #fae1e4;
}

.table-danger th,
.table-danger td,
.table-danger thead th,
.table-danger tbody + tbody {
    border-color: #f1b2b8;
}

.table-hover .table-danger:hover {
    background-color: #f6cbd0;
}

.table-hover .table-danger:hover > td,
.table-hover .table-danger:hover > th {
    background-color: #f6cbd0;
}

.table-light,
.table-light > th,
.table-light > td {
    background-color: #fefefe;
}

.table-light th,
.table-light td,
.table-light thead th,
.table-light tbody + tbody {
    border-color: #fbfcfc;
}

.table-hover .table-light:hover {
    background-color: #f1f1f1;
}

.table-hover .table-light:hover > td,
.table-hover .table-light:hover > th {
    background-color: #f1f1f1;
}

.table-dark,
.table-dark > th,
.table-dark > td {
    background-color: #d6d8d9;
}

.table-dark th,
.table-dark td,
.table-dark thead th,
.table-dark tbody + tbody {
    border-color: #95999c;
}

.table-hover .table-dark:hover {
    background-color: #c9cbcd;
}

.table-hover .table-dark:hover > td,
.table-hover .table-dark:hover > th {
    background-color: #c9cbcd;
}

.table-cyan,
.table-cyan > th,
.table-cyan > td {
    background-color: #ccf2f4;
}

.table-cyan th,
.table-cyan td,
.table-cyan thead th,
.table-cyan tbody + tbody {
    border-color: #7bdee2;
}

.table-hover .table-cyan:hover {
    background-color: #b7edef;
}

.table-hover .table-cyan:hover > td,
.table-hover .table-cyan:hover > th {
    background-color: #b7edef;
}

.table-purple,
.table-purple > th,
.table-purple > td {
    background-color: #eee8fa;
}

.table-purple th,
.table-purple td,
.table-purple thead th,
.table-purple tbody + tbody {
    border-color: #d3c3f1;
}

.table-hover .table-purple:hover {
    background-color: #dfd3f5;
}

.table-hover .table-purple:hover > td,
.table-hover .table-purple:hover > th {
    background-color: #dfd3f5;
}

.table-active,
.table-active > th,
.table-active > td {
    background-color: #f8f9fa;
}

.table-hover .table-active:hover {
    background-color: #e9ecef;
}

.table-hover .table-active:hover > td,
.table-hover .table-active:hover > th {
    background-color: #e9ecef;
}

.table .thead-dark th {
    color: #fff;
    background-color: #343a40;
    border-color: #454d55;
}

.table .thead-light th {
    color: #4F5467;
    background-color: #e9ecef;
    border-color: #e9ecef;
}

.table-dark {
    color: #fff;
    background-color: #343a40;
}

.table-dark th,
.table-dark td,
.table-dark thead th {
    border-color: #454d55;
}

.table-dark.table-bordered {
    border: 0;
}

.table-dark.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.table-dark.table-hover tbody tr:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.075);
}

@media (max-width: 575.98px) {
    .table-responsive-sm {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive-sm > .table-bordered {
        border: 0;
    }
}

@media (max-width: 767.98px) {
    .table-responsive-md {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive-md > .table-bordered {
        border: 0;
    }
}

@media (max-width: 991.98px) {
    .table-responsive-lg {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive-lg > .table-bordered {
        border: 0;
    }
}

@media (max-width: 1199.98px) {
    .table-responsive-xl {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive-xl > .table-bordered {
        border: 0;
    }
}

.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-responsive > .table-bordered {
    border: 0;
}


.simpleTable{
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border-bottom: 0px solid #e9ecef;
    border-top: 1px solid #e9ecef;

    font-size:14px;
    margin-top:1.5em;
    margin-bottom:1.5em;
}

.simpleTable thead th{
    padding: 15px 15px;
    border-bottom: 1px solid #e9ecef;
    border-top: 1px solid #e9ecef;
    font-size:14px;
    color: #7f8991;
    text-align: left;
}

.simpleTable  .hoverPr .hover{
    display: none;
}
.simpleTable  .hoverPr:hover .hover{
    display: block;
}

.simpleTable tbody td{
    padding: 10px 15px;
    border-bottom: 1px solid #e9ecef;
    font-size:14px;
    color: #363c41;
    text-align: left;
}



.simpleTable{
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    /*border-bottom: 1px solid #e9ecef;*/
    border-top: 1px solid #e9ecef;

    font-size:14px;
    margin-top:1.5em;
    margin-bottom:1.5em;
}

.simpleTable.sm{
    margin:0;
    border-top: 0;
}

.simpleTable thead th{
    padding: 15px 15px;
    border-bottom: 1px solid #e9ecef;
    border-top: 1px solid #e9ecef;
    font-size:14px;
    color: #7f8991;
    text-align: left;
}

.simpleTable  .hoverPr .hover{
    display: none;
}
.simpleTable  .hoverPr:hover .hover{
    display: block;
}



.simpleTable tbody td{
    padding: 10px 15px;
    border-bottom: 1px solid #e9ecef;
    font-size:14px;
    color: #363c41;
    text-align: left;
}


.simpleTable.xs td , .simpleTable.xs th{
    padding: 5px 15px;
    font-size:13px;
}

.simpleTable.noBorder{
    border: 0;
}
.simpleTable.noBorder th{
    border-top: 0;
}
.simpleTable.noBorder tbody tr:last-child td {
    border-bottom: 0 !important;
}



.scrollbar-hidden {
    /* 스크롤은 작동하지만, 스크롤바는 보이지 않음 */
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;     /* Firefox */
}

.scrollbar-hidden::-webkit-scrollbar {
    display: none;             /* Chrome, Safari, Opera */
}



@container main-container (min-width: 728px) {
    .zoomAuto {
        zoom:1;
    }

    .isAdmAreaBase{
        box-sizing: border-box;
        border:4px solid rgba(0, 0, 0, 0);

    }
    .isAdmArea{
        box-sizing: border-box;
        border:4px solid rgba(0, 0, 0, 0);

    }
    .isAdmArea:hover{
        border:4px dashed rgba(152, 253, 149, 1);
        cursor: pointer;
        /*background-color: rgba(205, 205, 205, 0.13);*/
    }
    .isAdminActive{
        border:4px solid #7fe47d !important;
        background-color:transparent !important;

    }

}

@container main-container (max-width: 728px) {
    .zoomAuto {
        zoom:0.8;
    }

    .isAdmAreaBase{
        box-sizing: border-box;
        border:2px solid rgba(0, 0, 0, 0);

    }
    .isAdmArea{
        box-sizing: border-box;
        border:2px solid rgba(0, 0, 0, 0);

    }
    .isAdmArea:hover{
        border:2px dashed rgba(152, 253, 149, 1);
        cursor: pointer;
        /*background-color: rgba(205, 205, 205, 0.13);*/
    }
    .isAdminActive{
        border:2px solid #7fe47d !important;
        background-color:transparent !important;

    }

}

.p24PointText {
    background: linear-gradient(90.91deg, #2CD200 2.75%, #16D887 22.22%, #0084EE 39.13%);

}

table.nform {
    border-top: 2px solid #717171;

}

table.nform th {
    padding: 0.8rem 1.2rem;
    border-bottom: 1px solid #e6e6e6;
    font-size: 0.9rem;
    font-weight: 500;
    background-color: #f5f5f5;
    color: #7e7e7e;
    width: 160px;
    vertical-align: top;
    text-align: left;
}
table.nform td {
    padding: 0.8rem 1.2rem;
    border-bottom: 1px solid #e6e6e6;
    font-size: 0.9rem;
    font-weight: 500;
    color: #515151;
    vertical-align: top;
}

table.nform.sm th , table.nform.sm td {
    padding: 0.8rem 1.2rem;
    width:auto;

}


.slide-left-enter-active, .slide-left-leave-active,
.slide-right-enter-active, .slide-right-leave-active {
    transition: transform 0.5s ease, opacity 0.5s ease;
    position: absolute;
    opacity: 1;
}
.slide-left-enter-from, .slide-right-enter-from {
    opacity: 0;
}
.slide-left-leave-to, .slide-right-leave-to {
    opacity: 0;
}
.slide-left-enter-from {
    transform: translateX(100%);
}
.slide-left-leave-to {
    transform: translateX(-100%);
}
.slide-right-enter-from {
    transform: translateX(-100%);
}
.slide-right-leave-to {
    transform: translateX(100%);
}


.button-basic-wrapper.color-type {
    position: relative;
    background-image: linear-gradient(98deg, #00e25d, #00d1c8);
}
.button-basic-wrapper.color-type:after {
    border-color: transparent;
}
.button-basic-wrapper.color-type:hover .button-icon-wrap ,.button-basic-wrapper.color-type:hover .button-contents {
    background-color: rgba(0, 0, 0, 0.15);
}
.button-basic-wrapper.color-type .button-icon-wrap {
    position: relative;
    background-color: transparent;
    border-color: rgba(0, 0, 0, 0.15);
}
.button-basic-wrapper.color-type .button-contents {
    position: relative;
    color: #fff;
}
.button-basic-wrapper.color-type .buttoniconimage {
    background: url(/images/icon-ncloud-symbol-color.png) no-repeat;
    background-size: 28px 14px;
}

.grayscale {
    filter: grayscale(100%);
}


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

.show-1s {
    opacity: 0;
    animation: fadeInts 1s ease-in .3s forwards;
}