/* reset */ @charset "utf-8"; @font-face { font-family: "aTitleGothic"; font-style: normal; font-weight: 400; src:url('/font/AsiaTITGD1R.eot'); src:url('/font/AsiaTITGD1R.eot?#iefix') format('embedded-opentype'), url('/font/AsiaTITGD1R.woff') format('woff'), url('/font/AsiaTITGD1R.ttf') format('truetype'); } @font-face { font-family: "aTitleGothic"; font-style: normal; font-weight: 500; src:url('/font/AsiaTITGD2R.eot'); src:url('/font/AsiaTITGD2R.eot?#iefix') format('embedded-opentype'), url('/font/AsiaTITGD2R.woff') format('woff'), url('/font/AsiaTITGD2R.ttf') format('truetype'); } @font-face { font-family: "aTitleGothic"; font-style: normal; font-weight: 600; src:url('/font/AsiaTITGD3R.eot'); src:url('/font/AsiaTITGD3R.eot?#iefix') format('embedded-opentype'), url('/font/AsiaTITGD3R.woff') format('woff'), url('/font/AsiaTITGD3R.ttf') format('truetype'); } @font-face { font-family: "aTitleGothic"; font-style: normal; font-weight: 700; src:url('/font/AsiaTITGD4R.eot'); src:url('/font/AsiaTITGD4R.eot?#iefix') format('embedded-opentype'), url('/font/AsiaTITGD4R.woff') format('woff'), url('/font/AsiaTITGD4R.ttf') format('truetype'); } @font-face { font-family: "aTitleGothic"; font-style: normal; font-weight: 800; src:url('/font/AsiaTITGD5R.eot'); src:url('/font/AsiaTITGD5R.eot?#iefix') format('embedded-opentype'), url('/font/AsiaTITGD5R.woff') format('woff'), url('/font/AsiaTITGD5R.ttf') format('truetype'); } :root { --dn-table-color1: #bbb; --dn-table-line-color: #e4e4e4; --dn-point-active-color: linear-gradient(90deg, #4a3aff, #6c55ff); } .width-auto{ width:auto !important; } .m-0 { margin: 0px !important; }.m-1 { margin: 1px !important; }.m-2 { margin: 2px !important; }.m-3 { margin: 3px !important; }.m-4 { margin: 4px !important; }.m-5 { margin: 5px !important; }.m-6 { margin: 6px !important; }.m-7 { margin: 7px !important; }.m-8 { margin: 8px !important; }.m-9 { margin: 9px !important; }.m-10 { margin: 10px !important; }.m-11 { margin: 11px !important; }.m-12 { margin: 12px !important; }.m-13 { margin: 13px !important; }.m-14 { margin: 14px !important; }.m-15 { margin: 15px !important; }.m-20 { margin: 20px !important; }.m-21 { margin: 21px !important; }.m-22 { margin: 22px !important; }.m-23 { margin: 23px !important; }.m-24 { margin: 24px !important; }.m-25 { margin: 25px !important; }.m-30 { margin: 30px !important; }.m-35 { margin: 35px !important; }.m-40 { margin: 40px !important; } .m-t-0 { margin-top: 0px !important; }.m-t-1 { margin-top: 1px !important; }.m-t-2 { margin-top: 2px !important; }.m-t-3 { margin-top: 3px !important; }.m-t-4 { margin-top: 4px !important; }.m-t-5 { margin-top: 5px !important; }.m-t-6 { margin-top: 6px !important; }.m-t-7 { margin-top: 7px !important; }.m-t-8 { margin-top: 8px !important; }.m-t-9 { margin-top: 9px !important; }.m-t-10 { margin-top: 10px !important; }.m-t-11 { margin-top: 11px !important; }.m-t-12 { margin-top: 12px !important; }.m-t-13 { margin-top: 13px !important; }.m-t-14 { margin-top: 14px !important; }.m-t-15 { margin-top: 15px !important; }.m-t-16 { margin-top: 16px !important; }.m-t-17 { margin-top: 17px !important; }.m-t-18 { margin-top: 18px !important; }.m-t-19 { margin-top: 19px !important; }.m-t-20 { margin-top: 20px !important; }.m-t-21 { margin-top: 21px !important; }.m-t-22 { margin-top: 22px !important; }.m-t-25 { margin-top: 25px !important; }.m-t-30 { margin-top: 30px !important; }.m-t-31 { margin-top: 31px !important; }.m-t-32 { margin-top: 32px !important; }.m-t-33 { margin-top: 33px !important; }.m-t-34 { margin-top: 34px !important; }.m-t-35 { margin-top: 35px !important; }.m-t-36 { margin-top: 36px !important; }.m-t-37 { margin-top: 37px !important; }.m-t-38 { margin-top: 38px !important; }.m-t-39 { margin-top: 39px !important; }.m-t-40 { margin-top: 40px !important; }.m-t-41 { margin-top: 41px !important; }.m-t-42 { margin-top: 42px !important; }.m-t-43 { margin-top: 43px !important; }.m-t-44 { margin-top: 44px !important; }.m-t-45 { margin-top: 45px !important; }.m-t-46 { margin-top: 46px !important; }.m-t-47 { margin-top: 47px !important; }.m-t-48 { margin-top: 48px !important; }.m-t-49 { margin-top: 49px !important; }.m-t-50 { margin-top: 50px !important; }.m-t-60 { margin-top: 60px !important; }.m-t-70 { margin-top: 70px !important; }.m-t-80 { margin-top: 80px !important; }.m-t-90 { margin-top: 90px !important; }.m-t-100 { margin-top: 100px !important; }.m-t-150 { margin-top: 150px !important; }.m-t-160 { margin-top: 160px !important; }.m-t-170 { margin-top: 170px !important; }.m-t-180 { margin-top: 180px !important; }.m-t-190 { margin-top: 190px !important; }.m-t-200 { margin-top: 200px !important; } .m-r-0 { margin-right: 0px !important; }.m-r-1 { margin-right: 1px !important; }.m-r-2 { margin-right: 2px !important; }.m-r-3 { margin-right: 3px !important; }.m-r-4 { margin-right: 4px !important; }.m-r-5 { margin-right: 5px !important; }.m-r-6 { margin-right: 6px !important; }.m-r-7 { margin-right: 7px !important; }.m-r-8 { margin-right: 8px !important; }.m-r-9 { margin-right: 9px !important; }.m-r-10 { margin-right: 10px !important; }.m-r-15 { margin-right: 15px !important; }.m-r-20 { margin-right: 20px !important; }.m-r-25 { margin-right: 25px !important; }.m-r-30 { margin-right: 30px !important; }.m-r-35 { margin-right: 35px !important; }.m-r-40 { margin-right: 40px !important; }.m-r-280 { margin-right: 280px !important; } .m-b-0 { margin-bottom: 0px !important; }.m-b-1 { margin-bottom: 1px !important; }.m-b-2 { margin-bottom: 2px !important; }.m-b-3 { margin-bottom: 3px !important; }.m-b-4 { margin-bottom: 4px !important; }.m-b-5 { margin-bottom: 5px !important; }.m-b-6 { margin-bottom: 6px !important; }.m-b-7 { margin-bottom: 7px !important; }.m-b-8 { margin-bottom: 8px !important; }.m-b-9 { margin-bottom: 9px !important; }.m-b-10 { margin-bottom: 10px !important; }.m-b-11 { margin-bottom: 11px !important; }.m-b-12 { margin-bottom: 12px !important; }.m-b-13 { margin-bottom: 13px !important; }.m-b-14 { margin-bottom: 14px !important; }.m-b-15 { margin-bottom: 15px !important; }.m-b-20 { margin-bottom: 20px !important; }.m-b-25 { margin-bottom: 25px !important; }.m-b-30 { margin-bottom: 30px !important; }.m-b-35 { margin-bottom: 35px !important; }.m-b-40 { margin-bottom: 40px !important; }.m-b-50 { margin-bottom: 50px !important; }.m-b-100 { margin-bottom: 100px !important; }.m-b-110 { margin-bottom: 110px !important; }.m-b-120 { margin-bottom: 120px !important; }.m-b-130 { margin-bottom: 130px !important; }.m-b-150 { margin-bottom: 150px !important; }.m-b-200 { margin-bottom: 200px !important; } .m-l-0 { margin-left: 0px !important; }.m-l-1 { margin-left: 1px !important; }.m-l-2 { margin-left: 2px !important; }.m-l-3 { margin-left: 3px !important; }.m-l-4 { margin-left: 4px !important; }.m-l-5 { margin-left: 5px !important; }.m-l-6 { margin-left: 6px !important; }.m-l-7 { margin-left: 7px !important; }.m-l-8 { margin-left: 8px !important; }.m-l-9 { margin-left: 9px !important; }.m-l-10 { margin-left: 10px !important; }.m-l-15 { margin-left: 15px !important; }.m-l-20 { margin-left: 20px !important; }.m-l-25 { margin-left: 25px !important; }.m-l-30 { margin-left: 30px !important; }.m-l-35 { margin-left: 35px !important; }.m-l-40 { margin-left: 40px !important; }.m-l-50 { margin-left: 50px !important; }.m-l-60 { margin-left: 60px !important; }.m-l-70 { margin-left: 70px !important; }.m-l-80 { margin-left: 80px !important; }.m-l-90 { margin-left: 90px !important; }.m-l-100 { margin-left: 100px !important; }.m-l-70 { margin-left: 70px !important; }.m-l-280 { margin-left: 280px !important; }.m-l-95 { margin-left: 95px !important; }.m-l-447 { margin-left: 447px !important; } .p-0 { padding: 0px !important; }.p-1 { padding: 1px !important; }.p-2 { padding: 2px !important; }.p-3 { padding: 3px !important; }.p-4 { padding: 4px !important; }.p-5 { padding: 5px !important; }.p-6 { padding: 6px !important; }.p-7 { padding: 7px !important; }.p-8 { padding: 8px !important; }.p-9 { padding: 9px !important; }.p-10 { padding: 10px !important; } .p-15 { padding: 15px !important; }.p-16 { padding: 16px !important; }.p-17 { padding: 17px !important; }.p-18 { padding: 18px !important; }.p-19 { padding: 19px !important; }.p-20 { padding: 20px !important; }.p-25 { padding: 25px !important; }.p-30 { padding: 30px !important; }.p-35 { padding: 35px !important; }.p-40 { padding: 40px !important; } .p-t-0 { padding-top: 0px !important; }.p-t-1 { padding-top: 1px !important; }.p-t-2 { padding-top: 2px !important; }.p-t-3 { padding-top: 3px !important; }.p-t-4 { padding-top: 4px !important; }.p-t-5 { padding-top: 5px !important; }.p-t-6 { padding-top: 6px !important; }.p-t-7 { padding-top: 7px !important; }.p-t-8 { padding-top: 8px !important; }.p-t-9 { padding-top: 9px !important; }.p-t-10 { padding-top: 10px !important; }.p-t-11 { padding-top: 11px !important; }.p-t-12 { padding-top: 12px !important; }.p-t-13 { padding-top: 13px !important; }.p-t-14 { padding-top: 14px !important; }.p-t-15 { padding-top: 15px !important; }.p-t-16 { padding-top: 16px !important; }.p-t-17 { padding-top: 17px !important; }.p-t-20 { padding-top: 20px !important; }.p-t-25 { padding-top: 25px !important; }.p-t-30 { padding-top: 30px !important; }.p-t-35 { padding-top: 35px !important; }.p-t-40 { padding-top: 40px !important; }.p-t-50 { padding-top: 50px !important; }.p-t-60 { padding-top: 60px !important; }.p-t-70 { padding-top: 70px !important; } .p-r-0 { padding-right: 0px !important; }.p-r-1 { padding-right: 1px !important; }.p-r-2 { padding-right: 2px !important; }.p-r-3 { padding-right: 3px !important; }.p-r-4 { padding-right: 4px !important; }.p-r-5 { padding-right: 5px !important; }.p-r-6 { padding-right: 6px !important; }.p-r-7 { padding-right: 7px !important; }.p-r-8 { padding-right: 8px !important; }.p-r-9 { padding-right: 9px !important; }.p-r-10 { padding-right: 10px !important; }.p-r-15 { padding-right: 15px !important; }.p-r-16 { padding-right: 16px !important; }.p-r-17 { padding-right: 17px !important; }.p-r-18 { padding-right: 18px !important; }.p-r-19 { padding-right: 19px !important; }.p-r-20 { padding-right: 20px !important; }.p-r-25 { padding-right: 25px !important; }.p-r-30 { padding-right: 30px !important; }.p-r-35 { padding-right: 35px !important; }.p-r-40 { padding-right: 40px !important; }.p-r-50 { padding-right: 50px !important; } .p-r-170 { padding-right: 170px !important; } .p-b-0 { padding-bottom: 0px !important; }.p-b-1 { padding-bottom: 1px !important; }.p-b-2 { padding-bottom: 2px !important; }.p-b-3 { padding-bottom: 3px !important; }.p-b-4 { padding-bottom: 4px !important; }.p-b-5 { padding-bottom: 5px !important; }.p-b-6 { padding-bottom: 6px !important; }.p-b-7 { padding-bottom: 7px !important; }.p-b-8 { padding-bottom: 8px !important; }.p-b-9 { padding-bottom: 9px !important; }.p-b-10 { padding-bottom: 10px !important; }.p-b-12 { padding-bottom: 12px !important; }.p-b-15 { padding-bottom: 15px !important; }.p-b-20 { padding-bottom: 20px !important; }.p-b-25 { padding-bottom: 25px !important; }.p-b-30 { padding-bottom: 30px !important; }.p-b-35 { padding-bottom: 35px !important; }.p-b-40 { padding-bottom: 40px !important; }.p-b-50 { padding-bottom: 50px !important; }.p-b-60 { padding-bottom: 60px !important; }.p-b-70 { padding-bottom: 70px !important; } .p-l-0 { padding-left: 0px !important; }.p-l-1 { padding-left: 1px !important; }.p-l-2 { padding-left: 2px !important; }.p-l-3 { padding-left: 3px !important; }.p-l-4 { padding-left: 4px !important; }.p-l-5 { padding-left: 5px !important; }.p-l-6 { padding-left: 6px !important; }.p-l-7 { padding-left: 7px !important; }.p-l-8 { padding-left: 8px !important; }.p-l-9 { padding-left: 9px !important; }.p-l-10 { padding-left: 10px !important; }.p-l-11 { padding-left: 11px !important; }.p-l-12 { padding-left: 12px !important; }.p-l-13 { padding-left: 13px !important; }.p-l-14 { padding-left: 14px !important; }.p-l-15 { padding-left: 15px !important; }.p-l-16 { padding-left: 16px !important; }.p-l-17 { padding-left: 17px !important; }.p-l-18 { padding-left: 18px !important; }.p-l-19 { padding-left: 19px !important; }.p-l-20 { padding-left: 20px !important; }.p-l-25 { padding-left: 25px !important; }.p-l-30 { padding-left: 30px !important; }.p-l-35 { padding-left: 35px !important; }.p-l-40 { padding-left: 40px !important; }.p-l-50 { padding-left: 50px !important; } .p-t-b-7 { padding-top: 7px !important; padding-bottom: 7px !important; }.p-t-b-9 { padding-top: 9px !important; padding-bottom: 9px !important; } .text-left{ text-align:left !important; } .text-center{ text-align:center !important; } .text-right{ text-align:right !important; } .txt-not { color: #777; display: block; padding-left: 27px; font-size: 12px; font-weight: 500; line-height: 1.4; min-height: 22px; background: url("/img/icons/dn_icon/icon_error.svg") 0 1px / 20px no-repeat; word-break: keep-all; } .txt-not.sm { padding-left: 22px; font-size: 12px; font-weight: 400; line-height: 18px; min-height: 22px; background: url("/img/icons/dn_icon/icon_error.svg") 0 1px / 18px no-repeat; } /* Button */ .db-btn{ height: 32px; line-height: 30px; text-align: center; border-radius: 5px; vertical-align: middle; margin:0; padding:0 15px; font-size: 13px; font-weight: 500; } .db-btn-main{ color:#fff; background-image: linear-gradient(#5c47e0, #2a18eb); border:1px solid #4e40f0; } .db-btn-red{ color:#fff; background-image: linear-gradient(#ee5f5b, #bd362f); border:1px solid #a8221b; } .db-btn-gray { color: #000; background-image: linear-gradient(#f0f0f0, #d3d3d3); border: 1px solid #d3d3d3; } .db-btn-darkgray{ color:#fff; background-image: linear-gradient(#5a5a5a, #333333); border:1px solid #444444; } .db-btn-excel{ color:#fff; background-image: linear-gradient(#4CAF50, #2E7D32); border:1px solid #388E3C; } .db-btn-orange{ color:#fff; background-image: linear-gradient(#ff9800, #f57c00); border:1px solid #e65100; } .db-btn-pink{ color:#fff; background-image: linear-gradient(#ff4081, #e91e63); border:1px solid #c2185b; } .db-btn-skyblue {color: #fff; background-image: linear-gradient(#5bc0de, #31b0d5); border: 1px solid #269abc; } .db-btn-complete {color: #fff;background-image: linear-gradient(#28a745, #218838); border: 1px solid #1e7e34; } .db-btn-complete:hover { background-image: linear-gradient(#218838, #1c7430); border-color: #1c7430; } .db-btn-sm{ height: 26px !important; line-height: 24px !important; font-size: 11px !important; } .db-btn-xs{ height: 22px !important; line-height: 20px !important; font-size: 11px !important; padding:0 7px; } /* 3.14 Component - Button */ /* 기본 버튼 */ .btnstyle1 { display: inline-block; padding: 4px 12px; margin-bottom: 0; font-size: 13px; line-height: 18px; text-align: center; vertical-align: middle; cursor: pointer; color: #333; background: linear-gradient(to bottom, #ffffff, #e6e6e6); border: 1px solid #ccc; border-bottom-color: #b3b3b3; border-radius: 4px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05); transition: background-color 0.15s ease, box-shadow 0.15s ease; outline: none; } /* 아이콘 정렬 */ .btnstyle1 i { vertical-align: middle; margin: 0 !important; padding: 0 !important; } /* Hover / Focus */ .btnstyle1:hover, .btnstyle1:focus { background-color: #e0e0e0; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); color: #333; text-decoration: none; } /* Active 상태 */ .btnstyle1:active, .btnstyle1.active { background-color: #ccc; box-shadow: inset 0 2px 4px rgba(0,0,0,0.15), 0 1px 2px rgba(0,0,0,0.05); } /* Disabled 상태 */ .btnstyle1.disabled, .btnstyle1[disabled] { cursor: default; background-color: #f5f5f5; opacity: 0.65; box-shadow: none; } /* 사이즈 - Large */ .btnstyle1-lg { padding: 9px 19px !important; font-size: 16px; border-radius: 6px; } /* 사이즈 - Small */ .btnstyle1-sm { padding: 2px 10px; font-size: 12px; border-radius: 3px; } /* 사이즈 - XSmall */ .btnstyle1-xs { padding: 0 6px; font-size: 11px; border-radius: 3px; } /* Block 버튼 */ .btnstyle1-block { display: block; width: 100%; padding-left: 0; padding-right: 0; box-sizing: border-box; } .btnstyle1-block + .btnstyle1-block { margin-top: 5px; } /* 스타일 - Danger (빨간 버튼) */ .btnstyle1-danger { color: #fff; background: linear-gradient(to bottom, #ee5f5b, #bd362f); border-color: #bd362f; text-shadow: 0 -1px 0 rgba(0,0,0,0.25); } .btnstyle1-danger:hover, .btnstyle1-danger:focus, .btnstyle1-danger:active, .btnstyle1-danger.active { background-color: #bd362f; color: #fff; } .btnstyle1-danger:active, .btnstyle1-danger.active { background-color: #942a25; } /* 스타일 - Inverse (다크 버튼) */ .btnstyle1-inverse { color: #fff; background: linear-gradient(to bottom, #3d4650, #111); border-color: #111; text-shadow: 0 -1px 0 rgba(0,0,0,0.25); } .btnstyle1-inverse:hover, .btnstyle1-inverse:focus, .btnstyle1-inverse:active, .btnstyle1-inverse.active { background-color: #111; color: #fff; } /* 스타일 - PurpleBlue (보라-파랑 버튼) */ .btnstyle1-purpleblue { color: #fff; background: linear-gradient(to bottom, #7b5cff, #1e3aff); border: 1px solid #1e3aff; border-bottom-color: #172ed6; border-radius: 4px; /* 기존 btnstyle1과 일치 */ text-shadow: none; box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05); transition: background-color 0.15s ease, box-shadow 0.15s ease; outline: none; } /* Hover / Focus */ .btnstyle1-purpleblue:hover, .btnstyle1-purpleblue:focus { background-color: #4059f7; /* 단색으로 살짝 진해짐 */ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); color: #fff; text-decoration: none; } /* Active 상태 */ .btnstyle1-purpleblue:active, .btnstyle1-purpleblue.active { background-color: #3046d6; box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); } /* Disabled 상태 */ .btnstyle1-purpleblue.disabled, .btnstyle1-purpleblue[disabled] { cursor: default; background-color: #7b5cff; opacity: 0.65; box-shadow: none; } .loader-wrap{ position:absolute; top:0; left:0; right:0; bottom:0; z-index:99999; display:none; &.on{ display:flex; flex-direction: column; align-items: center; justify-content: center; gap:10px; background:rgba(255,255,255,.5); .loader-text{ font-size:13px; color:#fff; } } &.style2{ background:rgba(0,0,0,.5); } } .loader { width: 50px; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(farthest-side,#2413e6 94%,#0000) top/8px 8px no-repeat, conic-gradient(#0000 30%,#2413e6); -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0); animation: l13 1s infinite linear; } @keyframes l13{ 100%{transform: rotate(1turn)} } /* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ html{ width:100%; height:100%; margin:0; padding:0; background: #111c2d; } body{ width:100%; height:100%; margin:0; padding:0; color:#111; font-size:12px; font-weight:500; font-family: "aTitleGothic",sans-serif; line-height:120%; min-height: 100vh; background: linear-gradient(to top, #111c2d 20%, #222f41 100%); } body.popup-body{ width:100%; height:100%; margin:0; padding:0; color:#111; font-size:12px; font-weight:500; font-family: "aTitleGothic",sans-serif; line-height:120%; background:#fff; } h1, .h1, h2, .h2, h3, .h3, h4, .h4 { letter-spacing: 0; } /* 템플릿 Reset */ .sidenav { &::-webkit-scrollbar { width: 8px; } &::-webkit-scrollbar-track { background-color: #2b3145; } &::-webkit-scrollbar-thumb { background-color: #5c637a; border-radius: 8px; } &::-webkit-scrollbar-thumb:hover { background-color: #7b83a1; } scrollbar-color: #5c637a #2b3145; scrollbar-width: thin; } .navbar-nav { gap:3px; } .navbar-nav .nav-item{ margin: 0; } .navbar-nav .nav-item .nav-link{ padding: 6px 15px 6px 6px; } .navbar-nav .nav-item .nav-link .icon{ width:33px; height:35px; } .navbar-nav .nav-item .nav-link .icon i{ color: #777; font-size: 13px; } .navbar-nav .nav-item .nav-link.active .icon i{ color: #fff !important; } .navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item .nav-link, .navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item .nav-link { margin-left: 53px; padding:8px 0 3px 0; font-size: 0.8rem; } .card .card-body { font-family: "aTitleGothic",sans-serif; padding:0 50px; } .dn.row{ --bs-gutter-x: 1rem; } .toast { background-color: rgba(74, 58, 255, 0.7); color: #fff; } .toast-header { padding: 0.5rem 0.5rem; background-color: rgba(74, 58, 255, 0.7); .me-auto { color: #fff; } .time { color: #ddd; } } .toast-body { color: #fff; } .toast-container > :not(:last-child) { margin-bottom:6px; } /* select2 Reset */ /* 선택박스 테두리 지우기 */ .select2-container--default .select2-selection--single { border: none; } .sale-info{ .select2-container--default .select2-selection--single { border: 1px solid #ccc; } } .dn-select2-wrap{ .select2-container--default .select2-selection--single { height: 34px; padding: 0 8px; border: 1px solid #d6dae1; } } .sales-register-search{ .select2-container--default .select2-selection--single { border: 1px solid #ccc !important; } } /* 선택박스 검색 박스 패딩 지우기 */ .select2-search--dropdown { padding: 0; } /* 드롭다운 스크롤바 디자인 */ .select2-container--default .select2-results>.select2-results__options { &::-webkit-scrollbar{ width:6px; height:6px; border-left:solid 1px rgba(255,255,255,.1)} &::-webkit-scrollbar-thumb{ background:#aaa; } } .normal-select2{ } .c-top-select2{ .select2-search--dropdown { padding: 5px; .select2-search__field{ outline: none; } } } /* datepicker - thead > tr > th / sticky / z-index:200 */ .ui-datepicker{ z-index: 2001 !important; } /* nice-select */ .nice-select { } .nice-select.dn-select { display: inline-block; float:none; font-size:13px; color:#222; font-weight:500; font-family: "aTitleGothic",sans-serif; height:34px; line-height: 32px; } select.top-category{ height:42px; } .nice-select.top-category { display: inline-block; float:none; font-size:13px; color:#222; font-weight:500; font-family: "aTitleGothic",sans-serif; border: solid 1px #d83c19; } /* tabulator */ .tabulator{ & *{ font-size:12px; } .tabulator-header { color: #000; font-weight: 600; letter-spacing: -0.5px; } .tabulator-tableholder { .tabulator-table { border-bottom: 1px solid #e4e4e4; .tabulator-row { transition: background-color 150ms ease-out; /* &.tabulator-selectable{ &:hover { background-color: #ddd; } } */ &.tabulator-selected{ .tabulator-cell { border-right: 1px solid #6291cf; } } .tabulator-cell { border-right: 1px solid #e4e4e4; height:30px; line-height:22px; /* font-family: Malgun Gothic, "맑은 고딕", AppleGothic, Dotum, "돋움", "Helvetica Neue", Helvetica, Arial, sans-serif; */ } } } &::-webkit-scrollbar{ width:8px; height:8px; background:#f7f7f7; border-left:solid 1px rgba(255,255,255,.1)} &::-webkit-scrollbar-thumb{ background:#aaa; } } .tabulator-footer { position: sticky; bottom: 0; .tabulator-calcs-holder { .tabulator-row { .tabulator-cell { background: #ffc !important; } } } } } .tabulator-row.tabulator-row-even.tabulator-selected { background-color: #79a3da; } .tabulator-row.tabulator-row-even .tabulator-cell.tabulator-range-selected:not(.tabulator-range-only-cell-selected):not(.tabulator-range-row-header) { background-color: #79a3da; } .tabulator-row .tabulator-cell.tabulator-editing { border: 2px solid #1d68cd !important; outline: none; padding: 0; background-color: #f0f8ff; } .tabulator-row .tabulator-cell.tabulator-row-handle { border-right: 1px solid #ccc !important; } .tabulator-row .tabulator-cell.tabulator-row-handle .tabulator-row-handle-box { width: 60%; } .tabulator-row .tabulator-cell.tabulator-row-handle .tabulator-row-handle-box .tabulator-row-handle-bar { background: #999; height: 2px; margin-top: 2px; width: 100%; } /* sort 화살표 */ .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { border-bottom: 6px solid #bbb; border-left: 3px solid transparent; border-right: 3px solid transparent; height: 0; width: 0; } /* 헤더 항목명 */ .tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title { padding-right: 15px; } .tabulator-tooltip { background-color: #fffab1; z-index: 9999 !important; font-size: 13px; line-height: 1.5; max-width: 300px; white-space: pre-line; } /* form */ .radio-form-group{ display:flex; flex-wrap: nowrap; align-items: center; gap:10px; } .radio-form-group input[type=radio]{ appearance: none; width: 1.15rem; height: 1.15rem; border:1px solid #ccc; background-color: #ddd; border-radius: 50%; } .radio-form-group input[type=radio]:checked { background-image: linear-gradient(310deg, #fb6340 0%, #f56036 100%); border:1px solid #b83b1f; } /* table */ .table.sm > :not(:last-child) > :last-child > * { border-bottom-color: var(--dn-table-color1); } /* table.sm * { font-size:12px; } */ table.sm{ border-collapse: collapse; width:auto; table-layout:fixed; border-spacing:0; border-collapse:separate; margin-bottom: 0; border-bottom: 1px solid #e4e4e4; &.Independent{ thead > tr > th { border-top: 1px solid #aaa !important; &:first-child { border-left: 1px solid #aaa !important; } } tbody > tr > td { &:first-child { border-left: 1px solid #e4e4e4 !important; } } tfoot > tr > th { &:first-child { border-left: 1px solid #bbb !important; } } } thead th.right-double-line{ border-right: 2px solid #bbb !important; } tbody td.right-double-line{ border-right: 2px solid #ccc !important; } tfoot th.right-double-line{ border-right: 2px solid #bbb !important; } thead th.right-dark-line{ border-right: 1px solid #999 !important; } tbody td.right-dark-line{ border-right: 1px solid #999 !important; } tfoot th.right-dark-line{ border-right: 1px solid #999 !important; } thead > tr > th { position: sticky; top: 0; /* 첫 번째 줄 고정 */ background-color: #e6e6e6; z-index: 201; /* 중첩 문제 방지 */ border-right: 1px solid #aaa !important; color:#333 !important; } thead > tr:nth-child(2) > th { position: sticky; top: 28px; background-color: #e6e6e6; z-index: 200; /* 첫 번째 줄보다 아래 */ } thead { tr { th { &.sticky-col { position: sticky; left: 0; z-index: 202; } } } } tfoot > tr > th { position:sticky; bottom:0; background:#ffc; z-index: 201; } tfoot > tr:nth-child(2) > th { position: sticky; bottom: 30px; /* 두 번째 줄 고정 */ background:#ffc; z-index: 200; /* 첫 번째 줄보다 아래 */ } tfoot { tr { th { &.sticky-col { position: sticky; left: 0; z-index: 202; } } } } tbody tr { transition: background-color 150ms ease-out; &:nth-of-type(odd) > * { color: #000; } /* &:hover { background-color: #ddd; } */ &.selected { background-color: #cdeecd; } } th,td{ padding:4px 2px; white-space:normal; text-align: center; vertical-align: middle; white-space: nowrap; } th{ height:28px; } td{ height:28px; color:#555; font-size:12px; color:#000; &.input-cell{ padding:0 !important; input{ width:100%; height:100%; border:0 !important; text-align: center; padding:0; &:focus{ outline:0; border:0; background-color: #f5ffcb; } &[readonly]:focus { outline:0; border:0; background-color: transparent; } } } &.date-input{ min-width:82px; } &.point-td{ p{ font-weight: 700; } } } input{ vertical-align: middle; } select, input[type=text], input[type=number]{ width: 100%; height: 28px; font-weight: 500; color:#000; padding: 0 0 0 8px; border: 1px solid #d2d6da; border-radius: 4px; box-sizing: border-box; line-height: 32px; outline: 0 none; background-color: transparent; } select:focus, input[type=text]:focus, input[type=number]:focus { color: #111; background-color: #fff; border-color: #fb6340; outline: 0; box-shadow: 0 3px 9px rgba(50, 50, 9, 0), 3px 4px 8px rgba(94, 114, 228, 0.1); } p{ margin:0; padding:0; font-size:12px; font-weight:500; &.minus{ color:#f00; } } &.line { th,td{ padding:0 7px; } thead{ th{ border-bottom: 1px solid var(--dn-table-color1); border-right: 1px solid var(--dn-table-line-color); } } tbody{ tr{ td{ border-right: 1px solid #e4e4e4; &.sticky-col{ position: sticky; left: 0; z-index: 100; } } &.odd{ td{ background-color: #fff; } } &.even{ td{ background-color: #f5f7fa; /* background-color: #f0f8ff; */ /* background-color: var(--bs-table-striped-bg); */ } } &.selected { td{ background-color: #cdeecd; border-right: 1px solid #afc7af; font-weight: 600; } } } &.sum-row{ th{ border-top: 1px solid #dbaaaa; border-right: 1px solid #dbaaaa; background-color: #fbe1f0; } } } tfoot > tr{ th{ border-top: 1px solid #b4b4b4; border-right: 1px solid var(--dn-table-color1); color:#000; } } } &.non-font{ tbody tr { td{ font-family: Malgun Gothic, "맑은 고딕", AppleGothic, Dotum, "돋움", "Helvetica Neue", Helvetica, Arial, sans-serif; } } } } /* 2줄마다 그룹화 */ /* table.sm.striped-rowspan2 > tbody > tr:nth-of-type(4n-3), table.sm.striped-rowspan2 > tbody > tr:nth-of-type(4n-2) { background-color: var(--bs-table-striped-bg); } table.sm.striped-rowspan2 > tbody > tr:nth-of-type(4n-1), table.sm.striped-rowspan2 > tbody > tr:nth-of-type(4n) { background-color: white; } */ /* 그룹 1: 첫 번째, 두 번째, 세 번째 줄 */ table.sm.striped-rowspan2 > tbody > tr:nth-of-type(6n-5), table.sm.striped-rowspan2 > tbody > tr:nth-of-type(6n-4), table.sm.striped-rowspan2 > tbody > tr:nth-of-type(6n-3) { background-color: var(--bs-table-striped-bg); /* 그룹 1 */ } /* 그룹 2: 네 번째, 다섯 번째, 여섯 번째 줄 */ table.sm.striped-rowspan2 > tbody > tr:nth-of-type(6n-2), table.sm.striped-rowspan2 > tbody > tr:nth-of-type(6n-1), table.sm.striped-rowspan2 > tbody > tr:nth-of-type(6n) { background-color: white; /* 그룹 2 */ } table.sm.striped-rowspan2{ tbody{ tr{ cursor:pointer; &.sum-line{ td{ font-weight: 600; color:#000; } } &.selected { td{ background-color: #f0f8ff; /* 선택된 행의 배경색 */ } } } } } /* table.sm.striped-rowspan2 > tbody > tr:nth-of-type(2n) > * { background-color: var(--bs-table-striped-bg); color: var(--bs-table-striped-color); } table.sm.striped-rowspan2 > tbody > tr:nth-of-type(2n-1) > * { background-color: white; } table.sm.striped-rowspan2 > tbody > tr > td[rowspan] { background-color: lightgray; /* rowspan에만 적용 } */ /* table.sm select2 */ table.sm .select2.select2-container{ width: 100%; } table.sm .select2-container--default .select2-selection--single{ border: 1px solid #d2d6da; background-color: transparent; } table.sm .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, table.sm .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { color: #111; background-color: #fff; border-color: #fb6340; outline: 0; box-shadow: 0 3px 9px rgba(50, 50, 9, 0), 3px 4px 8px rgba(94, 114, 228, 0.1); } table.table-st1 { width: 100%; table-layout: fixed; border: 0; border-spacing: 0; border-collapse: collapse; background:#fff; border-top: 1px solid #ddd; th,td{ padding:8px; border-bottom: 1px solid #ddd; height:51px; } th{ padding-left:15px; color:#111; font-weight:500; background:#f8f9fa; } td{ padding:8px 14px; } select, input[type=number], input[type=text], input[type=password]{ width: 100%; height: 34px; font-weight: 500; color:#000; padding: 0 8px; border: 1px solid #d6dae1; border-radius: 3px; box-sizing: border-box; line-height: 32px; outline: 0 none; vertical-align: middle; } input.price{ width: 150px; } input.headcount{ width:50px; } textarea{ width: 100%; height: 100px; font-weight: 500; color:#000; padding: 8px; border: 1px solid #d6dae1; border-radius: 3px; box-sizing: border-box; } } table.table-st2 { border: 0; border-spacing: 0; border-collapse: collapse; background:#fff; border-top: 1px solid #ddd; th,td{ padding:6px; border: 1px solid #ddd; } th{ height: 34px; color:#111; font-weight:500; background:#f8f9fa; text-align: center; } td{ } select, input[type=number], input[type=text], input[type=password]{ width: 100%; height: 34px; font-weight: 500; color:#000; padding: 0 8px; border: 1px solid #d6dae1; border-radius: 3px; box-sizing: border-box; line-height: 32px; outline: 0 none; vertical-align: middle; } input.price{ width: 150px; } input.headcount{ width:50px; } input[type=checkbox]{ vertical-align: middle; } .checkbox-label-wrap{ display: flex; align-items: center; gap: 6px; label{ display: flex; gap: 3px; } } } .no-padding-td { padding:0 !important; } .d-none { display: none; } .pd-list-table{} .pd-list-table > thead{ } .pd-list-table > thead > tr{} .pd-list-table > thead > tr > th{ position:sticky; top:0; background:#ffff; z-index: 100; } .pd-list-table > thead > tr > th, .pd-list-table > tbody > tr > td{ text-align: center; vertical-align: middle; } .c-top-tab{ position: relative; display: flex; gap:5px; a{ display: flex; align-items: center; justify-content: center; padding: 0 15px; height: 30px; line-height: 1; text-align: center; color:#d5e1f3 !important; font-size: 14px; font-weight: 500; background-color: #425166; box-sizing: border-box; border-radius: 4px; &.active{ background-color: #fff; color:#4635ff !important; font-weight: 600; } } } .c-top{ min-height:38px; position: relative; display: flex; align-items: center; gap:6px; color:#fff; ul{ margin:0; padding:0; } ul.right{ margin-left: auto; } button{ height:30px; } .db-btn { height: 30px; border-radius: 3px; padding: 0 12px; font-weight: 600; } .pagination-summary{ padding-left:10px; font-size:12px; font-family: Arial, Helvetica, sans-serif; color:#aaa; b{ color:#fff; font-weight: 500; } } .top-agencys{ width:100px; } .top-guides{ width:100px; } .top-ments{ width:100px; } .icon{ width: 22px; height: 22px; } h3{ font-size: 18px; font-weight: 600; color:#fff; margin:0; padding:0; } } .dn-form{ input[type=text], label.date, label.date-month, select { background-color: #fff; border: solid 1px rgba(0, 0, 0, 0.7); /* border: solid 1px #aaa; */ border-radius: 4px; outline: none; height:30px; margin:0; } label.date{ display: inline-block; padding:0 5px; overflow: hidden; vertical-align: middle; position: relative; input[type=text] { width:80px; text-align: center; height:100%; border: none; } } label.date.double{ input[type=text] { text-align: center; } } label.date-month{ display: inline-block; padding:0 5px; overflow: hidden; vertical-align: middle; position: relative; input[type=month] { text-align: center; height:100%; border: none; } } select{ } &.bgGray{ input[type=text], label.date, select { background-color: #f7f7f7; } } &.dn-form-sm{ input[type=text], label.date, select { height:28px; font-size: 12px; } label.date{ color: #aaa; padding: 0 6px; input[type=text] { width: 82px; font-size: 12px; font-weight: 500; } } select{ padding-left:5px; } .db-btn { height: 28px; line-height: 1; border-radius: 5px; padding: 0 12px; } } &.dn-form-md{ label.date{ padding: 0 0 0 6px; height:32px; input[type=text] { width: 90px; font-size: 13px; font-weight: 500; } } label.date.double{ padding:0 5px; input[type=text] { text-align: center; } } select{ height:32px; padding-left:5px; } /* select2 */ .select2-container--default .select2-selection--single { height:32px; border: solid 1px #d83c19; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 32px; } } } /* .c-top button.submit-btn{ margin-left: auto; } */ .card-dn { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; background-color: #fff; background-clip: border-box; border: 1px solid rgba(0, 0, 0, 0.11); border-top-left-radius:10px; box-shadow: 0 0 2rem 0 rgba(136, 152, 170, 0.2); overflow: auto; height: calc(100vh - 170px); -webkit-overflow-scrolling: touch; &.no-pagination{ height: calc(100vh - 150px); } &::-webkit-scrollbar{ width:8px; height:10px; border-left:solid 1px rgba(255,255,255,.1)} &::-webkit-scrollbar-thumb{ background:#aaa; } &.square{ border-radius:0; } &.visit-list-wrap{ height: calc(100vh - 200px); border:solid 1px rgba(0, 0, 0, 0.6); } &.visit-list-left{ height: calc(100vh - 200px); } &.visit-bundle-register-left, &.visit-bundle-register-wrap{ height: calc(100vh - 200px); } } /* 설정창 */ .config-wrap{ display: table; width:100%; border-spacing:collapse; } .config-wrap > ul{ display: table-cell; padding:3px 0; margin:0; } .config-wrap > ul.menu-wrap{ width:300px; border-right:1px solid #ddd; } .config-wrap > ul.b{ padding:20px; } .config-wrap > ul.b .nav-wrapper{ width:500px; } .multiCode-info-wrap{ border: 1px solid #ddd; border-radius: 0.75rem; padding:20px 30px; margin-top:15px; display:none; } .multiCode-info-wrap.active{ display:block; } .settlement-scope-list-top > ul{ padding:0; } /* 상품 */ /* 상품 - 리스트 */ .list-top-category{ width:100%; position: relative; display: flex; padding:0 30px 0 0; justify-content: flex-start; align-items: center; gap:3px; z-index:101; } .list-top-category > ul{ padding:0; margin-bottom: 0; } .list-top-category > ul.right{ margin-left: auto; } .list-top-category > ul .btn{ margin-bottom: 0; } .list-top-category > ul.date{ margin-left:40px; } .list-top-category > ul.date label{ background-color: #fff; border: solid 1px rgba(0, 0, 0, 0.7); border-radius: 5px; box-sizing: border-box; height: 42px; line-height: 40px; outline: none; margin:0; padding:0 10px; vertical-align: middle; overflow: hidden; } .list-top-category > ul.date label input[type=text]{ width:90px; border: none; outline: none; font-size:13px; font-weight: 600; text-align: center; } .list-top-category > ul.search{ margin-left:40px; } .list-top-category > ul.search label{ background-color: #fff; border: solid 1px #d83c19; border-radius: 5px; box-sizing: border-box; height: 42px; line-height: 40px; outline: none; margin:0; padding:0; vertical-align: middle; overflow: hidden; } .list-top-category > ul.search label input[type=text]{ width:250px; border: none; outline: none; font-size:14px; padding-left: 10px; } .list-top-category > ul.search label button{ outline: none; background-color: #fff; border: none; width:50px; } .list-top-category > ul.search label button i { font-size:17px; vertical-align: middle; } .list-top-count{ position: relative; height:25px; padding:0 10px; margin:10px 0 5px; display: flex; gap:10px; align-items: center; color:#fff; } .list-top-count >ul{ padding:0; margin-bottom: 0; display:table-cell; vertical-align: middle; } .content-dn-st1{ display:flex; min-height:500px; padding:1.5rem; gap:30px; aside{ width:250px; border-radius: 0.8rem; border:1px solid #ddd; box-shadow: 0 0 10px rgba(0, 0, 0, .1); .subnav{ ul { margin:0; padding:1rem; a { font-size: 14px; display: block; padding: 0.8rem 1rem; border-radius: 0.4rem; &.selected{ background-image: linear-gradient(90deg, #4a3aff, #6c55ff); color:#fff; font-weight: 600; } } } } } main.base-code-main2{ flex: 1; section{ div.title{ display:flex; align-items: center; gap:5px; padding:0; margin: 0 0 0 0; h3{ font-size: 20px; font-weight: 600; padding:0; margin:0; } .right{ margin-left: auto; } > ul{ padding:0; margin:0; &.desc{ font-size: 13px; padding-left: 10px; } } } } } main.base-code-main{ flex: 1; overflow: auto; padding-right: 2rem; section{ h3{ font-size: 1.5rem; font-weight: 600; } } } } .dn-site-tab{ width:auto; background: #e9ecef; padding:5px; border-radius: 0.6rem; ul{ display:flex; margin:0; padding:0; li{ font-size: 14px; list-style: none; padding: 0.8rem 2rem; border-radius: 0.4rem; &[aria-selected="true"] { background-image:var(--dn-point-active-color); a { color:#fff; font-weight: 600; line-height: 1; } } } } &.sm{ ul{ li{ font-size: 13px; padding: 10px 20px; } } } } .section-title{ height:44px; padding:0 0 0 30px; position: relative; border:1px solid #ddd; border-top-left-radius:10px; border-top-right-radius:10px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; cursor:pointer; background: #f5f5f5; margin-bottom:10px; box-shadow: 0 0 10px rgba(0, 0, 0, .1); } .section-title h2{ line-height: 44px; font-size:18px; font-weight:600; } .section-title:after { position: absolute; top:13px; right:20px; display: block; font-size:22px; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: "Font Awesome 5 Free"; font-weight: 700; content: "\f107"; margin-left: auto; color: rgba(33, 37, 41, 0.5); transition: all 0.2s ease-in-out; } .section-title.active{ background: #fff; margin-bottom:0; border-bottom-left-radius:0; border-bottom-right-radius:0; } .section-title.active:after { position: absolute; top:13px; right:20px; display: block; font-size:22px; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: "Font Awesome 5 Free"; font-weight: 700; content: "\f107"; margin-left: auto; color: rgba(33, 37, 41, 0.5); transition: all 0.2s ease-in-out; transform: rotate(180deg); } .section-body{ height:0; transition: all 0.2s ease-in-out; display: none; } .section-title.active + .section-body{ background:#fff; border:1px solid #ddd; border-top:none; display: block; padding:20px 30px 30px; height:auto; margin-bottom:20px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; box-shadow: 0 0 10px rgba(0, 0, 0, .1); } .section-body label{ font-size: 13px; font-weight: 500; margin-bottom: 0; color: #222; margin-left: 0; } .section-body table.table-st1.box-st{ } .section-body table.table-st1.box-st tr{ } .section-body table.table-st1.box-st th, .section-body table.table-st1.box-st td{ padding:8px; border: 1px solid #ddd; } .section-body table.table-st1.box-st th { text-align: center; } .ductible-list-top{ display: flex; align-items: center; gap:15px; } .ductible-list-top > ul{ padding:3px 0; margin:0; } .ductible-total{ font-size: 15px; font-weight:600; color:#111; } .append-line{ display: flex; align-items: center; gap:5px; } .append-line > ul{ padding:3px 0; margin:0; } /* 페이지 */ /* 판매관리 > 판매내역 */ .sale-info-top{ background-color: #111720; border-radius: 6px; padding: 0 20px; height: 36px; display: flex; align-items: center; gap:10px; ul{ color:#b1b1b1; font-weight: 400; span{ color:#fff; font-weight: 600; } } } .auto-deductible-icon { display: inline-block; line-height: 18px; padding: 2px 10px; font-size: 12px; margin:0; font-weight: 500; color: #fff; background-color: #4e73df; border-radius: 4px; cursor: default; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } /* 페이징 */ .pagination { display: flex; justify-content: center; margin: 0 0 0; padding: 0; list-style: none; gap: 6px; } /* 기본 버튼 스타일 */ .pagination li { display: inline-block; } .pagination a, .pagination span { display: inline-block; padding: 8px 14px; font-size: 14px; color: #fff; background-color: #2e2e40; border-radius: 4px; text-decoration: none; transition: all 0.2s ease; } /* 호버 효과 */ .pagination a:hover { background-color: #3f3f5e; } /* 활성 페이지 */ .pagination .active span, .pagination .active a { background-color: #7367f0; /* 포인트 컬러 */ color: #fff; font-weight: bold; } /* 비활성 (이전/다음이 없는 경우) */ .pagination .disabled span { background-color: #1e1e2d; color: #555; cursor: not-allowed; } .selected-cell { background-color: #ffffff !important; outline: 2px solid #3399ff; outline-offset: -2px; box-sizing: border-box; } .selected-cell-contextmenu { background-color: #ffffff !important; outline: 2px solid #d33429; outline-offset: -2px; box-sizing: border-box; } .selected-row td{ background-color: #d7d9ff !important; } .selected-row td.selected-cell{ background-color: #eaebff !important; } /* 예외 처리: merge-line 클래스가 있을 경우 hover 무효화 */ /* .table.sm.line.merge-line tbody tr.odd:hover td{ background-color: #fff !important; } .table.sm.line.merge-line tbody tr.even:hover td { background-color: #f5f7fa !important; } .table.sm tbody tr.odd:hover td { background-color: #f0f0f0 !important; } .table.sm tbody tr.even:hover td { background-color: #e8e8e8 !important; } */ .sale-list-type-label{ margin:0; font-weight: 600; } .sale-list-type-label.고객반품, .sale-list-type-label.수정반품{ color: #e90000; } .sale-list-type-label.원가판매, .sale-list-type-label.회사공제, .sale-list-type-label.판공처리, .sale-list-type-label.AS교환{ color: #a400e5; } .sale-list-type-label.매출수정, .sale-list-type-label.추가판매{ color: #0079c4; } .sale-list-type-label.추가DC, .sale-list-type-label.환율DC, .sale-list-type-label.관세DC, .sale-list-type-label.악성처리{ color: #00a65a; } .sale-list-type-label.외상입금{ color: #FF8C00; } .site-label{ color: #fff; background-color: #4c4c4c; border-radius: 4px; padding: 3px 6px; font-size: 11px; font-weight: 500; margin:0; } .site-label.site-label-xs{ padding: 2px 4px; font-size: 10px; font-family: Arial, Helvetica, sans-serif; line-height: 1; font-weight: 500; margin:0; } .site-label.GML{ background-color: #4064e5; } .site-label.BRD{ background-color: #1aa634; } .site-label.RAT{ background-color: #dfb52d; } .sale-list-parents-date{ display: block; font-size: 12px; color: #aaa; } .exchange-info-wrap{ display: flex; align-items: center; gap: 10px; background-color: #110f24; padding: 5px 15px; border-radius: 4px; ul{ display: flex; align-items: center; gap: 10px; padding:0; margin:0; li{ list-style: none; color: #ccc; img.currency-icon{ width: 23px; height: 23px; margin-right: 4px; } .exchange-rate{ font-size: 13px; font-weight: 600; color: #d1b3ff; } } } } .tour-type-label{ display: inline-block; box-sizing: border-box; font-size:10px; font-family: Arial, Helvetica, sans-serif; font-weight:500; line-height: 1; margin:0; padding:2px 4px !important; border-radius:4px; } .tour-type-label.H{ background-color:#f24398; color:#fff; } .tour-type-label.P{ background-color:#2bbacd; color:#fff; } .summary-info-wrap{ height:32px; display: flex; align-items: center; gap: 10px; background-color: #110f24; padding: 5px 15px; border-radius: 4px; ul{ display: flex; align-items: center; gap: 2px; li{ display: flex; align-items: center; list-style: none; color: #ccc; gap: 5px; font-size: 12px; img.icon{ width: 22px; height: 22px; } .value{ font-size: 12px; color: #c8c8c8; font-weight: 400; b{ font-size: 13px; font-weight: 600; margin:0 0 0 2px; padding:0; color: #ffffff; } } .exchange-rate{ font-size: 13px; font-weight: 600; color: #d1b3ff; } } } .tour-type-label.H{ background-color:#49355b; color:#fff; } .tour-type-label.P{ background-color:#49355b; color:#fff; } } .top-profile-wrap{ .affiliation-site{ margin-right:4px; } .member-group{ color: #fff; margin-right:10px; } } .nice-table { width: 100%; border-collapse: collapse; background: #2c3548; /* 다크톤 배경 */ color: #f0f0f0; /* 밝은 글씨 */ } /* 기준행 강조 스타일 */ .target-row-highlight { background-color: #d7d9ff !important; position: relative; } .target-row-highlight td { border: 1px solid rgba(203, 170, 255, 0.5) !important; } .nice-table thead th { background: #171d27; color: #ffffff; text-align: center; padding: 5px; position: sticky; top: 0; z-index: 2; font-size: 12px !important; font-weight: 600; border: 1px solid #242935; border-bottom: 2px solid #000000; } .nice-table tfoot th{ background: #202734; color:#cbaaff; text-align: right; padding: 10px; position: sticky; top: 0; z-index: 2; font-size: 12px !important; font-weight: 600; border: 1px solid #000; } .nice-table tr.sum-row th { background: #202734; color:#cbaaff; text-align: right; padding: 10px; position: sticky; top: 0; z-index: 2; font-size: 12px !important; font-weight: 600; border: 1px solid #000; } .nice-table th.text-left { text-align: left; } .nice-table th.text-center { text-align: center; } .nice-table tbody tr:nth-child(even) { background: #313b50; } .nice-table tbody .sum-converted { color:#cbaaff; } .nice-table tbody .currency-type { font-size: 11px !important; } .nice-table tbody tr:hover { background: rgba(255, 255, 255, 0.05); } .nice-table td, .nice-table th { border: 1px solid #111; } .nice-table td { height:32px; padding: 8px; text-align: right; color: #e0e6ed; font-size: 12px !important; } .nice-table td.text-left { text-align: left; } .nice-table td.input-td { padding:0; } .nice-table td.input-td input { width: 100%; height:32px; padding: 8px; text-align: right; border: none; background: transparent; color: #e0e6ed; margin:0; box-sizing: border-box; } .system-bank-code{ font-size: 10px; line-height: 1; color: #fff; background-color: #000; margin: 0 0 0 3px; padding: 2px 5px; border-radius: 3px; font-weight: 400; } .pagination-wrap{ display: flex; align-items: baseline; gap:50px; margin: 15px 0 0 0; .pagination-summary{ padding-left:10px; font-size:12px; font-family: Arial, Helvetica, sans-serif; color:#aaa; b{ color:#fff; font-weight: 500; } } } /* Context Menu Icon Styles */ .context-menu-icon { opacity: 0; transition: opacity 0.2s ease; margin-left: 5px; } .contextmenu:hover .context-menu-icon { opacity: 1; } .context-menu-icon:hover { color: #007bff !important; opacity: 1 !important; }