
/* login */
.login-wrap {display: flex;justify-content: center;align-items: center;width: 100vw;height: 100vh;background: linear-gradient(180deg, #575EFF 0%, #878CFF 100%);}
.login-wrap .login-box {display: block;width: 43.8rem;max-width: fit-content;padding: 4.8rem 3.2rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;}
.login-box .login-header {text-transform: uppercase;}
.login-box .login-header * {display: block;font-size: 2.4rem;font-weight: 700;line-height: 3.2rem;}
.login-box .login-header i {display: inline-block;vertical-align: middle;} 
.login-box .login-header .txt-blue {text-align: center;}
.login-box .login-body {margin-top: 2.4rem;height: 25.0rem;}
.login-box .login-body  [class*="input--"] label {display: block;font-size: 1.6rem;line-height: 2.4rem;color: #7C7C80;text-transform: capitalize;}
.login-box .login-body .input--text input, .login-box .login-body .input--text .nice-select {display: block;width: 37.4rem;margin-top: 0.8rem;padding: 0.8rem 1.6rem;border: 1px solid #CDCDD2;border-radius: 0.4rem;background-color: #fff;}
.login-box .login-body  .input--text + .input--text {margin-top: 1.6rem;}
.login-box .login-body .nice-select {width: 100%;font-size: 1.4rem;padding: 0 1.6rem!important;}
.login-box .login-body .nice-select .list {max-height: max-content;}
.login-box .login-body .nice-select .list li {line-height: 2.75rem;}
.login-box .login-body .nice-select:after {margin-top: -4px;}
.login-box .login-footer, .login-box .login-footer .btn {margin-top: 2.4rem;}
.login-box .login-footer input {display: none;}
.login-box .login-footer input + label {position: relative;padding-left: 2.4rem;}
.login-box .login-footer input + label::before {position: absolute;top: 0.2rem;left: 0;content: '';display: inline-block;width: 2.0rem;height: 2.0rem;background: url(../images/icon/icon-checkbox-false.png) left no-repeat;background-size: 2.0rem;}
.login-box .login-footer input:checked + label::before {background: url(../images/icon/icon-checkbox-true.png) left no-repeat;background-size: 2.0rem;}
.login-box .login-footer .btn {padding: 1.45rem 1.6rem;font-size: 1.4rem;line-height: 2.0rem;color: #fff;border-radius: 10.0rem;text-align: center;cursor: pointer;}


/* navbar */
.navbar {position: relative;width: 25.0rem;position: fixed;top: 0;bottom: 0;list-style: none;box-shadow: 1px 0px 4px rgba(0, 0, 0, 0.1);background-color: #fff;}
.navbar.inactive, .navbar.inactive .nav-list .nav-item:last-child {width: 7.2rem;}
.navbar .nav-list .nav-item {display: flex;padding: 1.0rem 2.4rem;}
.navbar .nav-list .nav-item, .navbar .nav-list .nav-dropdown {background-color: #fff;font-size: 1.3rem;line-height: 2.4rem;color: #49494D;text-transform: capitalize;cursor: pointer;}
.navbar.inactive .nav-list .nav-item {width: 7.2rem;}
.navbar .nav-list .nav-item:last-child {position: fixed;bottom: 0;width: 25.0rem;}
.navbar .nav-list .nav-item.brand-name {padding: 2.6rem 2.4rem;font-size: 1.8rem;font-weight: 700;line-height: 2.8rem;color: #3036D3;text-transform: uppercase;}
.navbar .nav-list .nav-item.active {background-color: #3036D3;color: #fff;}
.navbar .nav-list .nav-item.active + .nav-dropdown a:first-child {padding-top: 0.4rem!important;}
.navbar .nav-list .nav-item img {width: 2.4rem;height: 2.4rem;margin-right: 1.6rem;}
.navbar.inactive .nav-list .nav-item img {margin-right: 0;}
.navbar .nav-list .nav-item:last-child img:last-child {margin-left: auto;margin-right: 0;}
.navbar .nav-list .nav-item .nav-name {display: inline-block;}
.navbar.inactive .nav-list .nav-item .nav-name {display: none;}
.navbar.inactive .nav-list .nav-dropdown.active, .navbar .nav-list .nav-dropdown {flex: 0;display: none;}
.navbar .nav-list .nav-dropdown.active {display: block;padding-bottom: 1.6rem;}
.navbar .nav-list .nav-dropdown a {display: block;padding: 0.4rem 2.4rem 0.4rem 6.4rem;}
.navbar .nav-list .nav-dropdown a.active {color: #3036D3;font-weight: 700;}
.navbar .nav-list .nav-dropdown a:first-child {padding-top: 0;}
.navbar .navbar-toggle {position: absolute;bottom: 1.25rem;right: -3.0rem;width: 4.0rem;height: 3.6rem;border-radius: 0.4rem;background-color: #fff;box-shadow: 1px 0px 4px rgba(0, 0, 0, 0.1);z-index: -1;cursor: pointer;}
.navbar .navbar-toggle > i{position: absolute;top: 19%;left: 27%}
.navbar .navbar-toggle.active > i.rotaZ-minus-90 {transform: rotate(90deg);}


/* dashboard */
.dashboard .header .tile-list {display: flex;width: 100%;flex: 0 0 auto;}
.dashboard .header .list-item {width: 25%;margin-right: 2.4rem;color: #fff;}
.dashboard .header .list-item:last-child {margin-right: 0;}
.dashboard .header .list-item .item-value {display: block;padding-top: 0.8rem;font-size: 3.2rem;font-weight: 700;line-height: 3.6rem;}

.dashboard .contents {margin-top: 3.2rem;width: 100%;}

.dashboard .daily-order {display: inline;width: 100%;flex: 0 0 auto;}
.dashboard .daily-order .daily-graph, .dashboard .daily-order .brand-order {width: 100%;}
.dashboard .daily-order .daily-graph {margin-right: 2.4rem;}

.dashboard .daily-graph strong {font-size: 2.0rem;line-height: 2.8rem;}

.dashboard .brand-order .list {display: flex;}

.dashboard .brand-order .brand {flex-wrap: wrap;flex-direction: row;margin-right: -1.6rem;}
.dashboard .brand-order .brand .list-item {display: flex;width: calc(94% / 2);margin-bottom: 1.6rem;margin-right: 1.6rem;align-items: center;}
.dashboard .brand-order .brand .list-item.item-md {height: 11.0rem;}
.dashboard .brand-order .brand .list-item.item-sm {padding: 1.4rem;height: 5.5rem;}
.dashboard .brand-order .brand .list-item .item-content {width: 100%;padding-left: 2.4rem;overflow: hidden;}
.dashboard .brand-order .brand .list-item.item-sm .item-content * {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.dashboard .brand-order .brand .list-item.item-md .item-img, .dashboard .brand-order .brand .list-item.item-md .item-img img {width: 8.0rem;}
.dashboard .brand-order .brand .list-item.item-sm .item-img, .dashboard .brand-order .brand .list-item.item-sm .item-img img {width: 5.0rem;height: 5.0rem;}
    .dashboard .brand-order .brand .list-item .name {
        color: #7C7C80;
        
        /* white-space: nowrap; */
        /* text-overflow: ellipsis; */
        /* overflow: hidden; */
        font-size: 15px;
    }
.dashboard .brand-order .brand .list-item.item-sm .name {display: inline-block;width: 50%;vertical-align: middle;}
.dashboard .brand-order .brand .list-item .item-value {font-weight: 700;color: #3036D3;}
.dashboard .brand-order .brand .list-item.item-md .item-value {margin-top: 0.8rem;line-height: 4.8rem;font-size: 3.2rem;}
.dashboard .brand-order .brand .list-item.item-sm .item-value {display: inline-block;width: 46%;padding-left: 1.2rem;vertical-align: middle;font-size: 2.4rem;}

.dashboard .station {margin-top: 3.2rem;width: 100%;}
.dashboard .station .stat-list {display: flex;}
.dashboard .station .stat-list .list-item {width: calc(100% / 8);margin-right: 1.6rem;align-items: center;}
.dashboard .station .stat-list .list-item:last-child {margin-right: 0;}
.dashboard .station .stat-list .list-item .item-title {position: relative;padding-right:1.6rem;font-size: 2.0rem;font-weight: 700;line-height: 2.8rem;color: #1D1D1F;text-align: center;}
.dashboard .station .stat-list .list-item .item-content {margin-top: 1.6rem;border-top: 1px solid #CDCDD2;}
.dashboard .station .stat-list .list-item .item-content > div {position: relative;padding-top: 1.6rem;padding-left: 3.2rem;}
.dashboard .station .stat-list .list-item .item-content div::before{content: '';position: absolute;left: 0;display: inline-block;width: 2.4rem;height: 2.4rem;}
.dashboard .station .stat-list .list-item .item-content .time::before {background: url('/resources/images/icon/icon-time.png') left no-repeat;background-size: 2.4rem;}
.dashboard .station .stat-list .list-item .item-content .container::before {background: url('/resources/images/icon/icon-container.png') no-repeat;background-size: 2.4rem}
.dashboard .station .stat-list .list-item .item-content .timely::before {background: url('/resources/images/icon/icon-timely.png') no-repeat;background-size: 2.4rem}

.dashboard .input--radio::after {content: '';position: absolute;top: 0;right: 0.8rem;width: 0.8rem;height: 0.8rem;background-color: #DDDDE1;border-radius: 50%;}
.dashboard .input--radio.select--input::after {background-color: #3036D3;}

.dashboard .brand-order .border-radius-line {width: calc(100% - 1.6rem);height: 50.8rem;}

/* dashboard graph */
.charts-figure {min-width: 31.0rem;max-width: 80.0rem;}
#chart-container {height: 44.0rem;}
/* dashboard graph background */
rect {fill: none!important;}



/* order */
#grid-order .k-grid-content {height: calc(100vh - 44.0rem)!important;}
#grid-order .k-grid-content tr div {font-size: 12px;}
#grid-product .k-grid-content {
    height: calc(100vh - 40.8rem) !important;
}

#grid-user .k-grid-content {
    height: calc(100vh - 40.8rem) !important;
}

#grid-code-master .k-grid-content {
    height: calc(100vh - 40.8rem) !important;
}

.modal.order_sub.detail .modal-header .btn-wrap {
    margin-top: 0;
}
.modal.order_sub.detail .modal-body {width: 50%;max-width: unset;height: 100vh;padding: 1.6rem;border-radius:0;top: 0;transform: none;}
.modal.receive_sub.detail .modal-body {width: 50%;max-width: unset;height: 100vh;padding: 1.6rem;border-radius:0;top: 0;transform: none;}
.modal .modal-header .order-no {font-size: 2.0rem;line-height: 2.8rem;color: #3036D3;}
.modal .modal-header .order-no img {width: auto;height: 2.8rem;}
.modal .modal-header .order-no span {margin-left: 1.6rem;padding-left: 1.6rem;border-left: 1px solid #7C7C80;}
.modal.order_sub.detail .modal-header .select-menu {left: 0;}
.modal.order_sub.detail .modal-header .icon-close {height: 3.8rem;}
.modal.order_sub.detail .modal-contents {margin-top: 2.4rem;margin-left: 0;max-height: calc(100vh - 11.5rem);display: block;justify-content: unset;align-items: unset;flex: unset;flex-wrap: unset;flex-direction: unset;overflow-y: auto;}
.modal.order_sub.detail .modal-contents > *:not(:first-child) {margin-top: 2.4rem;}
.modal.order_sub.detail .modal-contents [class*="order-"] > .title {width: fit-content;font-size: 20px;font-weight: 700;line-height: 2.4rem;color: #1D1D1F;text-transform: capitalize;cursor: pointer;}
.modal.order_sub.detail .modal-contents .order-info .info {width: 100%;display: none;}
.modal.order_sub.detail .modal-contents .order-info .info.active {display: block;animation: fade-in 1s;animation-fill-mode: forwards;}

.modal.cs .modal-header .btn-wrap {
    margin-top: 0;
}
.modal.cs .modal-body {width: 50%;max-width: unset;height: 100vh;padding: 1.6rem;border-radius:0;top: 0;transform: none;}
.modal .modal-header .shipping-no {font-size: 2.0rem;line-height: 2.8rem;color: #3036D3;}
.modal .modal-header .shipping-no img {width: auto;height: 2.8rem;}
.modal .modal-header .shipping-no span {margin-left: 1.6rem;padding-left: 1.6rem;}
.modal.cs .modal-header .select-menu {left: 0;}
.modal.cs .modal-header .icon-close {height: 3.8rem;}
.modal.cs .modal-contents {margin-top: 2.4rem;margin-left: 0;max-height: calc(100vh - 11.5rem);display: block;justify-content: unset;align-items: unset;flex: unset;flex-wrap: unset;flex-direction: unset;overflow-y: auto;}
.modal.cs .modal-contents > *:not(:first-child) {margin-top: 2.4rem;}
.modal.cs .modal-contents [class*="order-"] > .title {width: fit-content;font-size: 20px;font-weight: 700;line-height: 2.4rem;color: #1D1D1F;text-transform: capitalize;cursor: pointer;}
.modal.cs .modal-contents .cs-info .cs {width: 100%;display: none;}
.modal.cs .modal-contents .cs-info .cs.active {display: block;animation: fade-in 1s;animation-fill-mode: forwards;}

.modal.receive_sub.detail .modal-contents {
    margin-top: 2.4rem;
    margin-left: 0;
    max-height: calc(100vh - 11.5rem);
    display: block;
    justify-content: unset;
    align-items: unset;
    flex: unset;
    flex-wrap: unset;
    flex-direction: unset;
    overflow-y: auto;
}

    .modal.receive_sub.detail .modal-contents > *:not(:first-child) {
        margin-top: 2.4rem;
    }

    .modal.receive_sub.detail .modal-contents [class*="order-"] > .title {
        width: fit-content;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 2.4rem;
        color: #1D1D1F;
        text-transform: capitalize;
        cursor: pointer;
    }

    .modal.receive_sub.detail .modal-contents .order-info .info {
        width: 100%;
        display: none;
    }

        .modal.receive_sub.detail .modal-contents .order-info .info.active {
            display: block;
            animation: fade-in 1s;
            animation-fill-mode: forwards;
        }
.order-info .info .info-item {display: inline-block;margin-top: 8px;width: 49%;padding-left:18px;}
.order-info .info .info-item * {display: inline-block;vertical-align: middle;font-size: 1.4rem;line-height: 2.0rem;}
.order-info .info .info-item .item-key {width: 15.0rem;margin-right:2.4rem;font-weight: 400;color: #000;text-transform: capitalize;}
.order-info .info .info-item .item-key span {vertical-align: baseline;}
.order-info .info .info-item .item-value {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;width: 55%;}
.order-info .info .info-item.w-100 .item-value {width: calc(100% - 18.2rem);}
.order-info .info #orderError {padding: 0.5rem;border-radius: 0.5rem;color: #FF6060;background-color: rgba(255, 96, 96, 0.2);}
.order-info .info #orderError .item-key {margin-right: 1.9rem;}
.order-info .info-table {width: 100%;margin-top: 1.6rem;padding-right: 0.5rem;}
.order-info .info-table table {width: 100%;text-align: center;border-top: 1px solid #9F9FA4;border-bottom: 1px solid #9F9FA4;outline: 0;border-collapse: collapse;border-spacing: 0;}
.order-info .info-table table thead {text-transform: capitalize;}
    .order-info .info-table td {
        padding: 0.6rem 1rem;
        font-size: 1.0rem;
        line-height: 1.6rem;
    }   
.order-info .info-table thead td {font-weight: 700;color: #49494D;border-bottom: 1px solid #9F9FA4;}
.order-info .info-table tbody td {border-bottom: 1px solid #DDDDE1;}
.order-info .info-table tbody tr:last-child {background-color: #F7F7FF;}

.cs-info .info .info-item {display: inline-block;margin-top: 8px;width: 49%;padding-left:18px;}
.cs-info .info .info-item * {display: inline-block;vertical-align: middle;font-size: 1.4rem;line-height: 2.0rem;}
.cs-info .info .info-item .item-key {width: 15.0rem;margin-right:2.4rem;font-weight: 400;color: #000;text-transform: capitalize;}
.cs-info .info .info-item .item-key span {vertical-align: baseline;}
.cs-info .info .info-item .item-value {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;width: 55%;}
.cs-info .info .info-item.w-100 .item-value {width: calc(100% - 18.2rem);}
.cs-info .cs-table {width: 100%;margin-top: 1.6rem;padding-right: 0.5rem;}
.cs-info .cs-table table {width: 100%;text-align: center;border-top: 1px solid #9F9FA4;border-bottom: 1px solid #9F9FA4;outline: 0;border-collapse: collapse;border-spacing: 0;}
.cs-info .cs-table table thead {text-transform: capitalize;}
    .cs-info .info-table td {
        padding: 0.6rem 1rem;
        font-size: 1.0rem;
        line-height: 1.6rem;
    }   
.cs-info .cs-table thead td {font-weight: 700;color: #49494D;border-bottom: 1px solid #9F9FA4;}
.cs-info .cs-table tbody td {border-bottom: 1px solid #DDDDE1;}
.cs-info .cs-table tbody tr:last-child {background-color: #F7F7FF;}
@keyframes fade-in {from{opacity: 0;}to{opacity: 1;}}

.modal.order_sub.view_video .modal-body {max-width: max-content;}
.modal.order_sub.view_video .video-player {/*margin-top: 3.2rem;*/max-width: 75.0rem;max-height: 35.0rem;}
.modal.order_sub.view_video .video-player video {width: 65.0rem;height: auto;height: 30.0rem;}
.modal.order_sub.view_video .video-list {margin-top: 2.4rem;}
.modal.order_sub.view_video .video-list .title {font-size: 2.0rem;font-weight: 700;line-height: 2.4rem;color: #1D1D1F;text-transform: capitalize;}
.modal.order_sub.view_video .video-list .scroll-custom {max-height: 21.0rem;margin-top: 1.2rem;overflow-y: auto;padding-right: 0.4rem;}
.modal.order_sub.view_video .video-list table {width: 100%;border-top: 1px solid #9F9FA4;border-bottom: 1px solid #9F9FA4;}
.modal.order_sub.view_video .video-list thead td {padding-left: 0.4rem;border-bottom: 1px solid #9F9FA4;text-align: left;font-weight: 700;text-transform: capitalize;}
.modal.order_sub.view_video .video-list tbody tr {width: 100%;cursor: pointer;}
.modal.order_sub.view_video .video-list tbody tr:hover {background-color: rgba(48, 54, 211, 0.1);}
.modal.order_sub.view_video .video-list tr td {padding: 0.4rem 0;padding-left: 0.4rem;font-size: 1.6rem;line-height: 2.4rem;text-align: left;}
.modal.order_sub.view_video .video-list tr td:first-child {width: 75%;}
.modal.order_sub.view_video .video-list tbody tr + tr td {border-top: 1px solid #DDDDE1;}

.modal.create_label .modal-body {width: 45vw;}

.modal.excel_import .modal-header {padding-bottom: 0;border-bottom: none;}
.modal.excel_import .modal-contents {margin-top: 0; margin-left: 0;}
.modal.excel_import .excel_import_box {margin-top: 2.0rem;padding: 7.2rem 0;width:43.2rem;border: 1px dashed #9F9FA4;font-size: 1.4rem;font-weight: 400;line-height: 2.0rem;color: #1D1D1F;align-content: center;text-align: center;}
.modal.excel_import .excel_import_box .inactive {display: none!important;}
.modal.trackingnumberinfo_import .excel_import_box {
    margin-top: 2.0rem;
    padding: 7.2rem 0;
    width: 43.2rem;
    border: 1px dashed #9F9FA4;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.0rem;
    color: #1D1D1F;
    align-content: center;
    text-align: center;
}

    .modal.trackingnumberinfo_import .excel_import_box .inactive {
        display: none !important;
    }
.excel_import_box div.btn {width: max-content;margin: 2.0rem auto 0;}
.excel_import_box .import-file {margin-top: 1.2rem;}
.excel_import_box .import-file span {text-transform: unset;display: inline-block;max-width: 20.0rem;white-space: nowrap;text-overflow: ellipsis;vertical-align: top;overflow: hidden;}
.excel_import_box .description {margin-top: 0.8rem;}
.excel_import_box .description span {display: block;margin: 0 auto;}
.excel_import_box .description span + span {margin-top: 0.8rem;}
.excel_import_box .description span.remove {color: #3036D3;cursor: pointer;}
.excel_import_box .sample {margin-top: 0.8rem;color: #3036D3;text-decoration: underline;cursor: pointer;}


/* product */
.modal.product.detail .modal-header .paging * {cursor: pointer;}
.modal.product_sub.detail .modal-header .btn-wrap {margin-top: 0;}
.modal.product_sub.detail .modal-body {width: 50%;max-width: unset;height: 100vh;padding: 1.6rem;border-radius:0;top: 0;transform: none;}
.modal.product_sub.detail .modal-header .select-menu {left: 0;}
.modal.product_sub.detail .modal-header .icon-close {height: 3.8rem;}
.modal.product_sub.detail .modal-contents {margin-top: 2.4rem;margin-left: 0;display: block;justify-content: unset;align-items: unset;flex: unset;flex-wrap: unset;flex-direction: unset;overflow-y: auto;max-height: calc(100vh - 11.5rem);overflow-x: hidden;}
.modal.product_sub.detail .modal-contents .product-info .title {font-size: 2.0rem;font-weight: 700;line-height: 2.4rem;}
.modal.product_sub.detail .modal-contents .product-info .info {margin-top: 2.4rem;}
.product-info .info.flex > div {width: 50%;}
.product-info .info.flex .info-img {padding-right: 2.4rem;height: 24.5rem;object-fit: contain;}
.product-info .info.flex .info-img img {width: -webkit-fill-available;height: -webkit-fill-available;object-fit: contain;padding: 1.6rem;box-shadow: 0 0.1rem 0.4rem rgb(0 0 0 / 15%);border-radius: 0.4rem;}
.product-info .info + .info, .product-info .info .info-list .info-item + .info-item {margin-top: 1.25rem!important;}
.product-info .info .info-item {display: flex;font-size: 1.6rem;line-height: 2.4rem;}
.product-info .info .info-item .item-key {width: 12.0rem;margin-right: 2.4rem;color: #9F9FA4;}
.product-info .info .info-item .item-value {width: calc(100% - 12.0rem - 2.4rem);}
.product-info .info.w-100 .info-item .item-value {display: -webkit-box;overflow: auto;word-break: break-all;}
.product-info .info.flex .info-item .item-value {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
#product_form .modal-contents {max-height: 74.0rem;overflow-y: auto;}

/* container */
#container_form .modal-contents [class*="input--"] label span {display: inline;}

/* mypage */
.myInfo-warp {/*display: flex;flex-wrap: wrap;flex-direction: row;*/width: 100%;margin-top: 3.6rem;padding: 3.2rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;}
.myInfo-warp .info-item:not(:nth-last-child(-n+2)) {position: relative;display: block;flex: 1 1 40%;font-size: 1.6rem;font-weight: 500;line-height: 2.4rem;color: #49494D;}
.myInfo-warp .info-item:not(:first-child) {margin-top: 1.2rem;}
.myInfo-warp .info-item:nth-last-child(2) {border-top: 1px solid rgb(0 0 0 / 15%);padding-top: 1.2rem;}
.myInfo-warp .item-key {display: inline-block;width: 20.0rem;font-weight: 400;color: #7C7C80;text-transform: capitalize;}
.myInfo-warp .item-value {display: inline-block;width: calc(100% - 27.0rem);margin-left: 4.8rem;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.myInfo-warp .info-item:nth-last-child(-n+2) .item-key {cursor: pointer;}
.myInfo-warp .myInfo-invoice, .myInfo-warp .myInfo-paymemntcard {display: none;width: 100%;}
.myInfo-warp .myInfo-invoice.active, .myInfo-warp .myInfo-paymemntcard.active {display: block;}
.myInfo-warp .item-key > i.active  {transform: rotate(180deg);}
.myInfo-warp .invoice-wrap, .myInfo-warp .paymemntcard-wrap {margin-top: 0.8rem;}
.paymemntcard-wrap {position: relative;display: inline-flex;flex-wrap: wrap;gap: 1.6rem;width: 100%;}
.paymemntcard-wrap .item {position: relative;flex: 1 1 40%;max-width: 32.0rem;height: 18.0rem;padding: 1.2rem;box-shadow: 0 0.1rem 0.4rem rgb(0 0 0 / 15%);border-radius: 0.4rem;}
.paymemntcard-wrap .item.active {border: 2px solid #878CFF;}
.paymemntcard-wrap .item.add {position: relative;background-color: rgb(0 0 0 / 15%);cursor: pointer;}
.paymemntcard-wrap .item.add > div {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center;}
.paymemntcard-wrap .item.add > div i {display: block;font-size: 2.4rem;margin-bottom: 0.8rem;}
.paymemntcard-wrap .item .card-info > * {display: inline-block;}
.paymemntcard-wrap .item .card-info img {margin-right: 0.4rem;width: 2.4rem;vertical-align: bottom;}
.paymemntcard-wrap .item .card-info .card-message {margin-left: 0.4rem;color: #3036D3;}
.paymemntcard-wrap .item .card-info .card-message.error {color: #FF6060;}
.paymemntcard-wrap .item .card-bottom {position: absolute;bottom: 1.2rem;right: 1.2rem;}
.paymemntcard-wrap .item .card-bottom div {display: inline-block;font-weight: 500;cursor: pointer;}
.paymemntcard-wrap .item .card-bottom div + div {margin-left: 0.6rem;padding-left: 0.6rem;border-left: 1px solid #CDCDD2;}
#grid-mypage .k-grid-content {height: calc(100vh - 70.0rem) !important;}
#grid-mypage .k-pager-wrap {background-color: #fff !important;}
.modal.changePW .modal-body {max-width: 45.0rem;}

/* company > info */
.companyInfo-warp {display: flex;flex-wrap: wrap;flex-direction: row;width: 100%;margin-top: 3.6rem;padding: 3.2rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;}
.companyInfo-warp * {position: relative;display: block;/*flex: 1 1 40%;*/font-size: 1.6rem;font-weight: 500;line-height: 2.4rem;color: #49494D;}
.companyInfo-warp .info-item:nth-child(n+2) {margin-top: 1.2rem;}
.companyInfo-warp .item-key {display: inline-block;width: 20.0rem;font-weight: 400;color: #7C7C80;text-transform: capitalize;}
.companyInfo-warp .item-value {display: inline-block;width: calc(100% - 27.0rem);margin-left: 4.8rem;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;vertical-align: text-top;}
.companyInfo-warp .info-img {height: 25.0rem;padding-right: 2.4rem;}
.companyInfo-warp .info-img img{width: 100%;height: -webkit-fill-available;object-fit: contain;box-shadow: 0 0.1rem 0.4rem rgb(0 0 0 / 15%);border-radius: 0.4rem;}
.companyInfo-warp div .img-top-wrap {width: 60%;}
/* company > plan */
.companyPlan-warp {width: 100%;margin-top: 3.6rem;padding: 2.0rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;}
.companyPlan-warp .plan-items {display: flex;flex-wrap: wrap;flex-direction: row;}
.companyPlan-warp .plan-items .item {position: relative;width: calc(100% / 6);}
.companyPlan-warp .plan-items .item:not(:first-child) {padding-left: 5.0rem;}
.companyPlan-warp .plan-items .item .txt {margin-top: 2.0rem;font-size: 1.6rem;font-weight: 400;}
.companyPlan-warp .plan-items .item.col-title .txt:first-child {margin-top: 12.8rem;}
.companyPlan-warp .plan-items .item .txt img {width: 1.8rem;height: 1.8rem;}
.companyPlan-warp .plan-items .item .select-item {position: absolute;top: -1.5rem;left: 2rem;width: 90%;height: 109.5%;background-color: rgba(255,255,255,0.5);cursor: pointer;}
.companyPlan-warp .plan-items .item .select-item.active {border: 2px solid #3036D3;border-radius: 0.8rem;background-color: unset;}
.companyPlan-warp .plan-items .item .select-item:hover {background-color: unset;}
.plan-items .item .plan-title div:not(:first-child) {margin-top: 0.8rem;}
.plan-items .item .plan-name {font-size: 2.0rem;font-weight: 700;line-height: 2.8rem;}
.plan-items .item .plan-name .txt-xs {display: none;}
.plan-items .item.selected .plan-name .txt-xs {display: inline-block;}
.plan-items .item .plan-price-gray {font-size: 1.6rem;line-height: 2.4rem;color: #7C7C80;text-decoration-line: line-through;}
.plan-items .item .plan-price {font-size: 2.4rem;font-weight: 700;line-height: 3.2rem;color: #3036D3;}
.plan-items .item .plan-price .txt-gray {margin-left: 0.8rem;font-size: 1.6rem;font-weight: 400;}
.plan-items .item .plan-usage-amount {font-size: 1.4rem;line-height: 2.0rem;color: #7C7C80;}
.companyPlan-warp .option {display: block;width: calc(25% - 1.8rem);height: 100%;height: 20.0rem;padding: 1.6rem;border-radius: 8px;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.3);}
.companyPlan-warp .option .title {font-weight: 700;}
.companyPlan-warp .option .input-checkbox {margin-top: 0.8rem;margin-left: 0.8rem;}
.companyPlan-warp .option .input-checkbox input {vertical-align: middle;margin-right: 0.4rem;}
.companyPlan-warp .option .input-checkbox input[type ^= 'number'] {width: 10.0rem;margin-left: 0.4rem;padding: 0.2rem 0.8rem;border: 1px solid #CDCDD2;border-radius: 0.4rem;}
.companyPlan-warp .option .input-checkbox .check-item {margin-left: 0.8rem;}
.companyPlan-btn-wrap {text-align: center;}
.companyPlan-btn-wrap .save-plan-btn {margin: 2.4rem auto 0;padding: 1.2rem;width: 20.0rem;font-size: 1.6rem;font-weight: 700;line-height: 2.4rem;border-radius: 3.0rem;}
.modal-change-plan .modal-contents {display: block;margin-left: unset;}
.modal-change-plan .modal-contents .change-plan .plan {width: 56.0rem;margin-top: 1.6rem;padding: 1.2rem;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.3);border-radius: 0.8rem;}
.modal-change-plan .modal-contents .change-plan .plan.current {opacity: 0.5;}
.modal-change-plan .modal-contents .change-option-txt:not(:last-child):after {content: "\0020\007C\0020";}
.modal-change-plan .change-plan-date {margin-top: 1.2rem;}
/* company > plugin */
.companyPlugin-warp {position: relative;width: 100%;margin-top: 3.6rem;padding: 3.2rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;}
.companyPlugin-warp #companyPlan {position: absolute;top: -1.5rem;left: 1.5rem;padding: 0.4rem 3.2rem;border-radius: 3.0rem;color: #fff;background-color: #3036D3;text-transform: uppercase;}
.companyPlugin-warp .current .flex .title {margin-right: 2.4rem;font-size: 1.6rem;font-weight: 700;line-height: 2.4rem;white-space: nowrap;}
.companyPlugin-warp .current .plugin-items {display: inline-flex;flex-wrap: wrap;gap: 0.8rem 2.4rem;}
.companyPlugin-warp .current .plugin-items .item, .companyPlugin-warp .current .plugin-items .item * {display: inline-block;}
.companyPlugin-warp .current .plugin-items .item div + div::before {content: "\0020\007C\0020";font-size: 1.6rem;color: #1D1D1F;}
.companyPlugin-warp .current .plugin-items .item .dueto {font-size: 1.4rem;color: #575EFF;}
.companyPlugin-warp.add-plugin {width: 66.66%;padding: 3.2rem 0.8rem 3.2rem 3.2rem;}
.companyPlugin-warp.add-plugin .flex {flex-wrap: wrap;gap: 2.4rem;}
.companyPlugin-warp.add-plugin > .title, .companyPlugin-warp.result-plugin > .title {font-size: 2.0rem;font-weight: 700;margin-bottom: 2.0rem;}
.companyPlugin-warp.add-plugin .add-item {position: relative;display: flex;width: 100%;padding: 2.0rem;align-items: center;justify-content: center;text-align: center;border: 1px solid #3036D3;border-radius: 0.8rem;flex-basis:23%;cursor: pointer;}
.companyPlugin-warp.add-plugin .add-item.active {background-color: rgb(135 140 255 / 10%);}
.companyPlugin-warp.add-plugin .add-item .title span {font-size: 2.4rem;font-weight: 700;}
.companyPlugin-warp.add-plugin .add-item .per-price {margin-top: 0.8rem;}
.companyPlugin-warp.result-plugin {width: 33.33%;margin-left: 3.6rem;}
.companyPlugin-warp.result-plugin .receipt {margin-top: 2.0rem;}
.companyPlugin-warp.result-plugin .receipt .total {margin-top: 0.8rem;padding-top: 1.2rem;border-top: 1px solid #3036D3;font-weight: 700;}
.companyPlugin-warp.result-plugin .receipt .item div {display: inline-block;width: calc((100% - 1.0rem) / 2);vertical-align: middle}
.companyPlugin-warp.result-plugin .receipt .new .item:not(:first-child) {margin-top: 0.8rem;}
.companyPlugin-warp.result-plugin .receipt .new .item div {width: calc((100% - 3.5rem) / 2);}
.companyPlugin-warp.result-plugin .receipt .item .price {text-align: right;}
.companyPlugin-warp.result-plugin .receipt .new .item .name {position: relative;margin-left: 2.4rem;}
.companyPlugin-warp.result-plugin .receipt .new .item .name::before {position: absolute;content: "\2514";left: -2.4rem;color: #9F9FA4;}
.companyPlugin-warp .pluginPayBtn {margin: 1.2rem auto 0;width: 20.0rem;border-radius: 3.0rem;font-size: 1.6rem;text-align: center;}

@media screen and (max-width: 1400px) {
    .nice-select .list {margin-top: 0.2rem;}
    .login-box .login-body .nice-select {height: 4.0rem;}
    .login-box .login-body .nice-select .current {position: absolute;margin-top: -7px;}
    .dashboard .brand-order .brand .list-item {width: calc(93% / 3);}
    #grid-order .k-grid-content {height: calc(100vh - 42.8rem)!important;}
    #grid-receiving .k-grid-content {
        height: calc(100vh - 42.8rem) !important;
    }
}

@media screen and (max-width: 560px) {
    #grid-order .k-grid-content {height: calc(100vh - 44.8rem)!important;}
    #grid-receiving .k-grid-content {
        height: calc(100vh - 44.8rem) !important;
    }
    .card-list-wrap .card {max-width: unset;}
}
.info.info-table table thead td {
    font-size: 14px;
}
tbody#infoTbody td {
    font-size: 13px;
}