.list-item {padding: 2.2rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;}

.btn {padding: 0.8rem 1.2rem;border-radius: 0.4rem;font-size: 1.4rem;line-height: 14px;
      /*background-color: #3036D3*/;color: #fff;text-transform: capitalize;cursor: pointer;}
.btn.disable {background-color: #CDCDD2;cursor: unset;}
.btn.empty {border: 1px solid #3036D3;justify-content: center;align-items: center;background-color: rgba(0, 0, 0, 0);color: #3036D3;}
.btn-wrap {position: relative;display: flex;margin-top: 10px;}
.btn-wrap .btn {font-weight: 400;}
.btn-wrap .btn:not(:last-child) {margin-right: 0.8rem;}

.btn-wrap .select-menu {position: absolute;display: none;top: 4.0rem;width: max-content;padding: 0.8rem 0;font-size: 1.4rem;font-weight: 400;line-height: 2.0rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgb(0 0 0 / 15%);border-radius: 0.8rem;z-index: 10;}
.btn-wrap .select-menu li {padding: 0.8rem 1.6rem;text-transform: capitalize;cursor: pointer;}
.btn-wrap .select-menu li:hover {background-color: rgba(48, 54, 211, 0.15);}
.btn-wrap .select-item.active + .select-menu {display: block;}
.btn-wrap .btn.select-item {width: 11.5rem;background: #3036D3 url(../images/icon/icon-menu-white.png) 90% no-repeat;}

.btn img {width: 2.0rem;height: 2.0rem;vertical-align: bottom;}

.copyBtn {position: relative;cursor: pointer;}
.icon-copy-check{display: none;background: url(/resources/images/icon/icon-copy-check.png) no-repeat;background-size: 2.0rem;width: 2.0rem;height: 2.0rem;vertical-align: bottom;margin-left: 0.8rem;}
.icon-copy-check.active {display: inline-block;position: absolute;top: 0.5rem;left: 55%;transform: translateX(-50%);}

.header-tit-btn {display: flex;justify-content: space-between;align-items: center;}
.header-tit-btn .title {font-size: 2.4rem;font-weight: 700;line-height: 3.2rem;text-transform: capitalize;}
.header-tit-btn .btn {border: 1px solid #3036D3;justify-content: center;align-items: center;background-color: rgba(0, 0, 0, 0);color: #3036D3;}

.noticeboard {margin-top: 10px;}

.border-radius-line {position: relative;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgb(0 0 0 / 15%);border-radius: 0.8rem;}
.border-radius-line div {position: absolute;top: 50%;left: 50%;transform: translateX(-50%);font-size: 2.0rem;}

select {/*background: url(../images/icon/icon-menu-gray.png) no-repeat 95% 50%;*/-webkit-appearance: none;-moz-appearance: none;appearance: none;}
select::-ms-expand {display: none;}
select option {font-size: 1.4rem;line-height: 2.0rem;color: #49494D;padding: 0.8rem 1.6rem;}

.nice-select:after {margin-top: 0.5rem;}
.nice-select {width: 100%;/*box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15);*/border-radius: 0.8rem;}
.nice-select .list {width: 100%;margin-top: 2.4rem;padding: 0.8rem 0;overflow: hidden;max-height: 210px;overflow-y: auto;-ms-overflow-style: none;scrollbar-width: none;}
.nice-select .list::-webkit-scrollbar {display: none;}
.nice-select .list li {padding: 0.8rem 1.6rem;min-height: fit-content;line-height: unset;}
.nice-select .list li:hover {background-color: rgba(48, 54, 211, 0.15);}
.nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus {background-color: rgba(48, 54, 211, 0.2);}
.modal .nice-select:after {margin-top: -0.4rem;}
.modal .nice-select .list {margin-top: 0.8rem;}
.modal .nice-select .option {line-height: 2.0rem;}
.modal .nice-select .option, .modal .nice-select .current {display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;padding-right: 1rem;}

.inventory .search-box {display: flex;width: 100%;margin-top: 3.6rem;padding: 1.2rem 1.6rem 1.2rem 0;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.7rem;}
.inventory .search-box .select-item {position: relative;width: 24%;padding-left: 4.0rem;padding-right: 4.5rem;}
.inventory .search-box .select-item .select2-container {width: 100% !important; }
.inventory .search-box .select-item .select2-selection {border: none !important; }
.inventory .search-box .select-item + .select-item  {border-left: 1px solid #CDCDD2;}
.inventory .search-box .select-item * {display: block;font-size: 1.4rem;line-height: 2.0rem;color: #1D1D1F;}
.inventory .search-box .select-item label {font-weight: 700;padding-bottom: 0.8rem;text-transform: capitalize;}
.inventory .search-box .select-item input {width: 100% !important;}
.inventory .search-box .select-item.inputs input {display: inline-block;width: 49%;}
.inventory .search-box .select-item.inputs input + input {padding-left: 1.6rem;border-left: 1px solid #CDCDD2;}
.inventory .search-box .icon-search {background: url('../images/icon/icon-search.png') right no-repeat;background-size: 4.8rem;width: 4.8rem;height: 4.8rem;margin-left: auto;cursor: pointer;}

.card-list-wrap .active-list, .card-list-wrap .inactive-list {display: flex;margin-right: -2.4rem;flex: 0 0 auto;flex-wrap: wrap;flex-direction: row;}
.card-list-wrap .card {flex: 1 1 20%;max-width: calc((100% - 10.0rem) / 4);margin-top: 2.4rem;margin-right: 2.4rem;padding: 2.4rem;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;}
.card-list-wrap .card .card-top {display: flex;width: 100%;flex: 0 0 auto;justify-content: space-between;align-items: flex-start;}
.card-list-wrap.warehouse .card .card-top {align-items: center;}
.card-list-wrap .card .card-top .title {display: inline-block;font-size: 2.0rem;font-weight: 700;line-height: 2.4rem;color: #1D1D1F;}
.card-list-wrap .card .card-top .logoImg {display: inline-block;width: 9.6rem;height: 9.6rem;}
.card-list-wrap .card .card-top .logoImg img {width: 9.6rem;height: auto;}
.card-list-wrap .card .card-top .contents {margin-left: 1.6rem;width: 18.6rem;}
.card-list-wrap .card .card-top .contents .title {display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;line-height: 2.8rem;color: #3036D3;}
.card-list-wrap .card .card-top .contents .subtitle {display: -webkit-box;white-space: normal;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin-top: 0.4rem;font-size: 1.6rem;font-weight: 400;line-height: 2.4rem;color: #49494D;}
.card-list-wrap .card .card-content {margin-top: 3.2rem;font-size: 1.4rem;font-weight: 500;line-height: 2.0rem;}
.card-list-wrap .card .card-content .card-item {display: flex;}
.card-list-wrap .card .card-content .card-item + .card-item {margin-top: 1.6rem;}
.card-list-wrap .card .card-content .card-key {min-width: 5.6rem;margin-right:1.6rem;font-weight: 400;color: #7C7C80;}
.card-list-wrap .card .card-content .card-value {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.card-list-wrap .card .card-content .address .card-value {display: -webkit-box;white-space: normal;-webkit-line-clamp: 2;-webkit-box-orient: vertical;height: 4.0rem;}
.card-list-wrap .subTitle {display: block;width: 100%;margin-top: 3.0rem;font-size: 2.0rem;font-weight: 700;line-height: 2.8rem;color: #1D1D1F;}
.card-list-wrap .subTitle div {display: inline-block;}
.card-list-wrap .active-list .subTitle {margin-top: 2.8rem;}
.card-list-wrap .inactive-list .card .card-top .logoImg, .card-list-wrap .inactive-list .card .card-top .contents, 
.card-list-wrap .inactive-list .card .card-top .title, .card-list-wrap .inactive-list .card .card-content  {opacity: 0.5;}
.card .tooltip {position: absolute;top: 3rem;right: 0;display: block;background-color: #fff;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 0.8rem;z-index: 10;}
.card .tooltip ul {padding: 0.8rem 0;}
.card .tooltip li {padding: 0.8rem 1.6rem;}
.card .tooltip li:hover {background-color: rgba(48, 54, 211, 0.15);}

.modal {position: absolute;top: 0;left: 0;width: 100vw;height: 100vh;display: none;background-color: rgba(0, 0, 0, 0.4);z-index: 10;}
.modal.active {display: block;}
.modal-body {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 80.0rem;padding: 2.4rem;box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.15);border-radius: 1.6rem;background-color: #fff;}
.modal-header {padding-bottom: 2.0rem;border-bottom: 1px solid #CDCDD2;text-transform: capitalize;}
    .modal-header .flex-wrap {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 3.2rem;
        color: #1D1D1F;
        padding-bottom: 10px;
    }
.modal-header .flex-wrap > * {display: flex;}
.modal-header span {padding-right: 0.5rem;}
.modal-header .icon-excel {width: 3.2rem;height: 3.2rem;background-size: 3.2rem;}
.modal-header .icon-close {background: url(../images/icon/icon-close.png) right no-repeat;background-size: 2.4rem;margin-left: 2.0rem;width: 2.4rem;height: 2.4rem;cursor: pointer;}
.modal-header .input-step {position: relative;display: block;width: 100%;margin-top: 0.8rem;font-size: 1.2rem;font-weight: 400;line-height: 1.6rem;color: #CDCDD2;align-content: center;}
    .modal-header .input-step .step {
        position: relative;
        display: inline-block;
        padding-left: 2.4rem;
        padding-right: 1.6rem;
        font-size: 15px;
        padding-bottom: 10px;
    }
.modal-header .input-step .step::before {position: absolute;left: 0;content: '';background: url(../images/icon/icon-check-false.png) left no-repeat;background-size: 1.6rem;width: 1.6rem;height: 1.6rem;}
.modal-header .input-step .step.active {color: #1D1D1F;}
.modal-header .input-step .step.active::before {background: url(../images/icon/icon-check-true.png) left no-repeat;background-size: 1.6rem;}
.modal-header .input-step .icon-right-arrow + .step {margin-left: 1.6rem;}
.modal .modal-body.step2 {display: none;}
.modal-contents {/*margin-top: 0.8rem;*/margin-left: -2.4rem;display: flex;/*max-height: calc(100vh - 35.0rem);overflow-x: hidden;overflow-y: auto;*/justify-content: space-between;align-items: flex-start;flex: 0 0 auto;flex-wrap: wrap;flex-direction: row;}
.modal-contents::-webkit-scrollbar {width: 0.75rem;}
.modal-contents::-webkit-scrollbar-thumb {background-color: rgba(48, 54, 211, 0.5);border-radius: 0.4rem;background-clip: padding-box;border: 0.1rem solid transparent;}
.modal-contents::-webkit-scrollbar-track {background-color: rgba(48, 54, 211, 0.15);border-radius: 0.4rem;}
.modal-contents > [class*="input--"] {margin-top: 1.2rem;/*flex: 1 1 40%;*/width: 46%;margin-left: 25px;}
.modal-contents [class*="input--"] label {
        display: block;
        font-size: 13px;
        line-height: 2.0rem;
        color: #1D1D1F;
        text-transform: capitalize;
        font-weight: 600;
}
.modal-contents [class*="input--"] label.error {text-transform: unset;font-size: 1.2rem;line-height: 1.8rem;}
.modal-contents [class*="input--"] label span {display: inline-block;width: 100%;height: auto;}
.modal-contents .input--text input:disabled {background-color: rgb(0 0 0 / 5%);}
.modal-contents .input--text input:not(.k-input), .modal-contents .input--text .nice-select, .modal-contents .input--text textarea {display: block;width: 100%;height: auto;margin-top: 2px;padding: 0.6rem 1.0rem;border: 1px solid #CDCDD2;border-radius: 0.4rem;background-color: #fff;font-size: 12px;line-height: 2.0rem;}
.modal-contents .input--text .select2-container {width:100% !important;}
.modal-contents .input--text select option {font-size: 1.6rem;line-height: 2.0rem;}
.modal-contents .input--text [class*="row"] {display: flex;}
.modal-contents .input--text [class*="row"] > div:not(:last-child) {margin-right: 0.8rem;}
.modal-contents .input--text .row2 > div {display: inline-block;width: calc(100% / 2);}
.modal-contents .input--text .row3 > div {display: inline-block;width: calc(100% / 3);}
.modal-contents .input--radio .radio-box {width: 100%;margin-top: 0.8rem;}
.modal-contents .input--radio .radio-box input {display: none;}
.modal-contents .input--radio .radio-box input + label {position: relative;display: inline-block;}
.modal-contents .input--radio .radio-box input + label i {display: inline-block;width: 1.6rem;height: 1.6rem;border: 1px solid #CDCDD2;background-color: #fff;border-radius: 50%;margin-right: 1.2rem;vertical-align: middle;}
.modal-contents .input--radio .radio-box input:checked + label i {border: 1px solid #3036D3;background: #3036D3;box-shadow: inset 0 0 0 3px #fff;} 
.modal-contents .input--radio .radio-box label {margin-right: 2.0rem;font-size: 1.6rem;line-height: 2.4rem;color: #49494D;vertical-align: middle;text-transform: capitalize;}
.modal-contents .brand-list {display: flex;flex: 0 0 auto;flex-wrap: wrap;flex-direction: row;width: 100%;margin-top: 1.6rem;margin-left: 0.8rem;}
.modal-contents .brand-item {margin-top: 1.6rem;margin-left: 1.6rem;padding: 1.6rem;width: 13.4rem;background-color: #fff;border: 1px solid #CDCDD2;border-radius: 0.8rem;text-align: center;cursor: pointer;}
.modal-contents .brand-item.active {border: 1px solid #3036D3;}
.modal-contents .brand-item .item-img {width: 9.6rem;height: 9.6rem;margin: 0 auto;}
.modal-contents .brand-item .item-img img {width: 9.6rem;height: auto;}
.modal-contents .brand-item .item-name {font-size: 1.4rem;font-weight: 400;line-height: 2.0rem;color: #49494D;text-transform: capitalize;}
.modal-contents .content-top {width: 100%;display: flex;}
.modal-contents .content-top .select-img {flex: 1;width: 100%;margin-top: 3.2rem;}
.modal-contents .content-top .select-img .brand-item {margin: 0 auto;}
.modal-contents .content-top .description-img {flex: 3;width: 100%;height: 15.0rem;margin-top: 3.2rem;margin-left: 2.4rem;border: 1px solid #CDCDD2;text-align: center;vertical-align: middle;}
.modal-contents .support-link {width: 100%;margin-top: 0.8rem;margin-left: 2.4rem;font-size: 1.2rem;line-height: 1.6rem;}
.modal-contents .support-link a {margin-left: 0.8rem;color: #3036D3;text-decoration: underline;}
.modal-footer {margin-top: 2.0rem;text-align: right;}
.modal-footer * {display: inline-block;padding:1.0rem 1.6rem;border: 1px solid #3036D3;border-radius: 0.4rem;font-size: 1.4rem;line-height: 2.0rem;background-color: rgba(0, 0, 0, 0);color: #3036D3;text-transform: capitalize;cursor: pointer;}
.modal-footer .btn.active {color: #fff;background-color: #3036D3;}
.modal-footer .btn.delete {background-color: #EF5050;color: #fff;border: 1px solid #EF5050;float: left;}
.modal-footer .btn + .btn {margin-left: 0.8rem;}


/* modal (with company) */
.img-content-top {display: flex;/*justify-content: space-between;*/align-items: flex-start;flex: 0 0 auto;flex-wrap: wrap;flex-direction: row;gap: 2.0rem;}
.modal .img-content-top > * {margin-top: 1.2rem;width: 45%;margin-left: 2.4rem;}
.img-content-top .input-top-wrap [class*="input--"]:not(:first-child) {margin-top: 1.2rem;}
.img-content-top .img-top-wrap [class*="input--"]:not(:first-child) {margin-top: 1.2rem;}
.img-content-top .select-file {position: relative;width: 100%;height: 18.0rem;margin-top: 0.8rem;text-align: center;border: 1px solid #CDCDD2;border-radius: 0.4rem;background-color: #fff;}
.img-content-top .select-file .btn {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.img-content-top .select-file .btn.img-load {top: unset;left: unset;transform: unset;bottom: 0%;right: 0%;}
.img-content-top .select-file img {width: -webkit-fill-available;height: -webkit-fill-available;object-fit: contain;}


/* input.error {border: 1px solid #EF5050!important;}
input + .valid {display: none;font-size: 1.2rem;color: #EF5050;}
input.valid + .valid {display: block;}
input.error + .valid {display: block;} */