common-원본.css 61 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062
  1. @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
  2. html * {
  3. box-sizing: border-box;
  4. /*font-family: 'Noto Sans KR', sans-serif;*/
  5. /*font-family: Helvetica, Arial, sans-serif !important;
  6. color: #333;*/
  7. }
  8. html {
  9. }
  10. html,
  11. body {
  12. margin: 0;
  13. padding: 0;
  14. }
  15. body {
  16. background: #fff;
  17. font-size:.875rem;
  18. }
  19. pre {
  20. padding: 0.75rem;
  21. border: 1px solid #e7eaf3;
  22. background-color: #f8f9fa;
  23. border-radius: 0.35rem;
  24. margin-bottom: 0.5rem;
  25. resize: both;
  26. overflow: auto;
  27. }
  28. .content-inner {
  29. flex-grow: 1;
  30. }
  31. ol, ul, li, dl, dt, dd {margin: 0; padding: 0; list-style: none;}
  32. #code-editor-div .CodeMirror {
  33. height: 500px;
  34. }
  35. #create-editor-div .CodeMirror,
  36. #abi-editor-div .CodeMirror {
  37. height: 200px;
  38. }
  39. .mgl_0 {margin-left:0!important;}
  40. .mb_30 {margin-bottom:30px;}
  41. .txt_align_c {text-align:center;}
  42. .wbreak_bw {word-break:break-word;}
  43. .spinner {
  44. margin-right: 5px;
  45. display: none;
  46. }
  47. .content-wrapper {
  48. display: flex;
  49. flex-direction: column;
  50. flex: 1;
  51. position: relative;
  52. min-width: 0;
  53. overflow: visible !important;
  54. }
  55. .typeahead.tt-input {
  56. width: 100% !important;
  57. }
  58. .media-chat .CodeMirror {
  59. border: 1px solid #eee;
  60. height: auto !important;
  61. max-height:400px;
  62. }
  63. .media-chat .CodeMirror-scroll {
  64. height: auto !important;
  65. max-height:400px;
  66. }
  67. .wordwrap {
  68. white-space: pre-wrap;
  69. word-wrap: break-word;
  70. font-size: 87.5%;
  71. }
  72. .card-header-title {
  73. color: #4a4f55;
  74. font-size: 1.875rem;
  75. font-weight: 500;
  76. margin-bottom: 0;
  77. }
  78. /*공통*/
  79. .border-light {border-color: #f0f2f5!important;}
  80. /*테이블*/
  81. .tb_wrap.card {box-shadow:none;}
  82. .table_upper {margin-bottom:10px;}
  83. .table-responsive.card {border:none; box-shadow:none;}
  84. .datatable-scroll-wrap {overflow-x:inherit;}
  85. .sorting_disabled {width:auto!important;}
  86. .table th {padding-top: 15px; padding-bottom: 15px;background:#f8f8f8;}
  87. /*필요없음 지움 .table td {padding-top:15px; padding-bottom:15px;}*/
  88. .table tr:last-of-type td, .table tr:last-of-type th {border-bottom:1px solid #ddd;}
  89. .table td .txt_box {display:inline-block; padding:5px 10px; border:1px solid #ddd; border-radius:3px;}
  90. .dataTables_length {display:none;}
  91. .table-responsive {padding-left: 1px; padding-right: 1px; padding-bottom: 1px;}
  92. .table-row {border-style: hidden; box-shadow: 0 0 0 1px #ddd; border-radius: 0.25rem;}
  93. .table-row th, .table-row td {height:35px; /*height: 3.6em;*/ box-sizing:border-box; vertical-align:middle; white-space: nowrap; text-align: center; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word;-webkit-line-clamp: 2; -webkit-box-orient: vertical; vertical-align: middle;}
  94. .table-row th {padding: 8px 15px; background-color: #5c6bc0; color: #FFF; border-right: 1px #ccc solid; font-weight: 400;}
  95. .table-row td {padding: 1px 5px; border-bottom: 1px #ddd solid; border-right: 1px #ddd solid;}
  96. thead {
  97. position: sticky;
  98. top: 0;
  99. z-index: 1;
  100. }
  101. .table-col, .table-row {width: 100%;}
  102. .table-col {table-layout: fixed;}
  103. .table-col th {width: 150px; background-color:#f5f5f5; padding: 8px 15px; vertical-align: middle !important;}
  104. .tb_wrap.card {margin-top:30px; border:none;}
  105. .dataTables_info {font-size:1.4rem; color:#878787;}
  106. .dataTables_length > label > span:first-child {font-size:1.4rem; color:#666;}
  107. .dataTables_length select {height:35px; font-size:1.4rem;}
  108. .dataTable thead .sorting:before, .dataTable thead .sorting:after, .dataTable thead .sorting_asc:after, .dataTable thead .sorting_desc:after, .dataTable thead .sorting_asc_disabled:after, .dataTable thead .sorting_desc_disabled:after{display:none; font-size:1.6rem;}
  109. .datatable-footer {padding: 30px 1.25rem 0 1.25rem;}
  110. .dtr-inline.collapsed tbody tr td:first-child:before, .dtr-inline.collapsed tbody tr th:first-child:before, .dtr-column tbody tr td.control:before, .dtr-column tbody tr th.control:before {font-size:1.6rem; margin-right:15px;}
  111. .datatable-footer {display:none;}
  112. .table_btm {padding:20px 0;}
  113. .table_btm .dataTables_paginate {margin:0; margin-left:auto;}
  114. /*페이지네이션*/
  115. .pagination {display: flex; margin-left: auto; margin-bottom: 0; padding-left: 0; list-style: none; border-radius: 0.25rem;}
  116. .page-link {position: relative; display: block; border: 1px solid #cad1dc; text-align: center;transition: all ease-in-out .15s;}
  117. .page-item:first-child .page-link {margin-left: 0;}
  118. .pagination-sm .page-link {min-width: 2.12507rem; padding: 0.3125rem 0.75rem; font-size: .8125rem; line-height: 1.6924;}
  119. .pagination-sm .page-item:first-child .page-link {border-top-left-radius: 0.1875rem; border-bottom-left-radius: 0.1875rem;}
  120. .page-item.disabled .page-link {color: #ccc; pointer-events: none; cursor: auto; background-color: #f0f2f5; border-color: #cad1dc;}
  121. .page-item.active .page-link {z-index: 3; color: #fff; background-color: #5c6bc0; border-color: #5c6bc0;}
  122. .pg {display:flex; justify-content:flex-end;}
  123. .pg > div {display:flex; align-items:center;}
  124. .pg > div a {display:flex; align-items: center; justify-content: center; }
  125. .pg > div a i {font-size:2.3rem; color:#878787;}
  126. .pg > div a.active i {color:#000;}
  127. .pg > div a.box {width:30px; height:30px; margin:0 5px; border-radius:5px; font-size:1.6rem; color:#666; line-height:1.6;}
  128. .pg > div a.box.active {background:#d35b2f; color:#fff;}
  129. /*사이드바관련*/
  130. .sidebar-main, .sidebar-main .sidebar-content, .sidebar-secondary, .sidebar-secondary .sidebar-content {left:-40rem;}
  131. .sidebar {
  132. display: -ms-flexbox;
  133. display: flex;
  134. -ms-flex-direction: column;
  135. flex-direction: column;
  136. -ms-flex-negative: 0;
  137. flex-shrink: 0;
  138. width: 18.75rem;
  139. position: fixed;
  140. top: 0;
  141. bottom: 0;
  142. box-sizing: content-box
  143. }
  144. .sidebar-main, .sidebar-secondary {
  145. /*left: -20.625rem;*/
  146. left: -40rem
  147. box-shadow:.25rem 0 1rem rgba(0,0,0,.35)
  148. }
  149. .sidebar-right {
  150. right: -20.625rem;
  151. box-shadow:-.25rem 0 1rem rgba(0,0,0,.35)
  152. }
  153. .sidebar-content {
  154. position: relative;
  155. height: 100%;
  156. display: -ms-flexbox;
  157. display: flex;
  158. -ms-flex-direction: column;
  159. flex-direction: column;
  160. -ms-flex: 1;
  161. flex: 1;
  162. overflow-y: auto;
  163. -webkit-overflow-scrolling: touch
  164. }
  165. .sidebar-section {
  166. position: relative;
  167. -ms-flex-negative: 0;
  168. flex-shrink: 0;
  169. border-top: 1px solid rgba(255, 255, 255, 0.1);
  170. }
  171. .sidebar-section .form-group:last-child {
  172. margin-bottom: 0
  173. }
  174. .sidebar-section-header {
  175. display: -ms-flexbox;
  176. display: flex;
  177. -ms-flex-align: center;
  178. align-items: center;
  179. padding:.75rem 1.25rem
  180. }
  181. .sidebar-section-body {
  182. position: relative;
  183. padding: 1.25rem 1.25rem
  184. }
  185. .sidebar-resize-show {
  186. display: none
  187. }
  188. .btn-sidebar-expand {
  189. display: none;
  190. border-width: 0;
  191. border-radius: 0;
  192. padding:.3125rem
  193. }
  194. .sidebar-mobile-expanded.sidebar-main, .sidebar-mobile-expanded.sidebar-secondary {
  195. left: 0
  196. }
  197. .sidebar-mobile-expanded.sidebar-right {
  198. right: 0
  199. }
  200. .sidebar-mobile-expanded.sidebar-component {
  201. display: block
  202. }
  203. .sidebar-user img {
  204. height: 2.375rem;
  205. width: 2.375rem;
  206. margin-top:.1875rem;
  207. margin-bottom:.1875rem
  208. }
  209. .nav-sidebar {
  210. -ms-flex-direction: column;
  211. flex-direction: column
  212. }
  213. .nav-sidebar .nav-item:not(.nav-item-header):first-child {
  214. padding-top:.5rem
  215. }
  216. .nav-sidebar .nav-item:not(.nav-item-header):last-child {
  217. padding-bottom:.5rem
  218. }
  219. .nav-sidebar .nav-item:not(.nav-item-divider) {
  220. margin-bottom: 1px
  221. }
  222. .nav-sidebar .nav-item:not(.nav-item-divider):last-child {
  223. margin-bottom: 0
  224. }
  225. .nav-sidebar>.nav-item>.nav-link {
  226. font-weight: 400
  227. }
  228. .nav-sidebar .nav-link {
  229. position: relative;
  230. display: -ms-flexbox;
  231. display: flex;
  232. -ms-flex-align: start;
  233. align-items: flex-start;
  234. padding:.75rem 1.25rem;
  235. transition: background-color ease-in-out .15s, color ease-in-out .15s
  236. }
  237. @media (prefers-reduced-motion:reduce) {
  238. .nav-sidebar .nav-link {
  239. transition: none
  240. }
  241. }
  242. .nav-sidebar .nav-link i {
  243. margin-right: 1.25rem;
  244. margin-top:.1875rem;
  245. margin-bottom:.1875rem;
  246. top: 0
  247. }
  248. .nav-sidebar .nav-link .badge {
  249. transition: background-color ease-in-out .15s, border-color ease-in-out .15s
  250. }
  251. @media (prefers-reduced-motion:reduce) {
  252. .nav-sidebar .nav-link .badge {
  253. transition: none
  254. }
  255. }
  256. .nav-sidebar .nav-link.disabled, .nav-sidebar .nav-link.disabled:focus, .nav-sidebar .nav-link.disabled:hover {
  257. background-color: transparent;
  258. opacity: .5
  259. }
  260. .nav-sidebar .nav-item-header {
  261. padding:.75rem 1.25rem
  262. }
  263. .nav-sidebar .nav-item-header>i {
  264. display: none
  265. }
  266. .nav-sidebar .nav-item-divider {
  267. margin:.5rem 0;
  268. height: 1px
  269. }
  270. .nav-item-submenu>.nav-link {
  271. padding-right: 2.75rem
  272. }
  273. .nav-item-submenu>.nav-link:after {
  274. content: "";
  275. font-family: icomoon;
  276. display: inline-block;
  277. font-size: 1rem;
  278. vertical-align: middle;
  279. line-height: 1;
  280. position: absolute;
  281. top:.75rem;
  282. margin-top:.1875rem;
  283. right: 1.25rem;
  284. transition: -webkit-transform .25s ease-in-out;
  285. transition: transform .25s ease-in-out;
  286. transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out;
  287. -webkit-font-smoothing: antialiased;
  288. -moz-osx-font-smoothing: grayscale
  289. }
  290. @media (prefers-reduced-motion:reduce) {
  291. .nav-item-submenu>.nav-link:after {
  292. transition: none
  293. }
  294. }
  295. [dir=rtl] .nav-item-submenu>.nav-link:after {
  296. content: ""
  297. }
  298. .nav-item-submenu.nav-item-open>.nav-link:after {
  299. -webkit-transform: rotate(90deg);
  300. transform: rotate(90deg)
  301. }
  302. .nav-group-sub {
  303. display: block
  304. }
  305. .nav-item:not(.nav-item-expanded)>.nav-group-sub {
  306. display: none
  307. }
  308. .nav-group-sub .nav-link {
  309. padding:.625rem 1.25rem .625rem 3.5rem!important;
  310. }
  311. .nav-group-sub .nav-group-sub .nav-link {
  312. padding-left: 4.75rem
  313. }
  314. .nav-group-sub .nav-group-sub .nav-group-sub .nav-link {
  315. padding-left: 6rem
  316. }
  317. .nav-group-sub .nav-item-submenu>.nav-link:after {
  318. top:.625rem
  319. }
  320. .nav-scrollspy .nav-item-open .nav-link:not(.active)+.nav, .nav-scrollspy .nav-link.active+.nav {
  321. display: block
  322. }
  323. .nav-scrollspy .nav-link.active:after {
  324. -webkit-transform: rotate(90deg);
  325. transform: rotate(90deg)
  326. }
  327. .nav-sidebar-icons-reverse .nav-link {
  328. padding-right: 3.5rem
  329. }
  330. .nav-sidebar-icons-reverse .nav-link i {
  331. position: absolute;
  332. top:.75rem;
  333. right: 1.25rem;
  334. margin-right: 0
  335. }
  336. .nav-sidebar-icons-reverse .nav-item-submenu .nav-link {
  337. padding-right: 4.5rem
  338. }
  339. .nav-sidebar-icons-reverse .nav-item-submenu .nav-link:after {
  340. right: 3.25rem
  341. }
  342. .nav-sidebar-icons-reverse .nav-group-sub .nav-link {
  343. padding-left: 2.5rem
  344. }
  345. .nav-sidebar-icons-reverse .nav-group-sub .nav-link i {
  346. top:.625rem
  347. }
  348. .nav-sidebar-icons-reverse .nav-group-sub .nav-group-sub .nav-link {
  349. padding-left: 3.75rem
  350. }
  351. .nav-sidebar-icons-reverse .nav-group-sub .nav-group-sub .nav-group-sub .nav-link {
  352. padding-left: 5rem
  353. }
  354. .nav-sidebar-bordered>.nav-item:not(.nav-item-divider) {
  355. margin-bottom: 0
  356. }
  357. .sidebar-dark .nav-sidebar-bordered>.nav-item {
  358. border-top: 1px solid rgba(255,255,255,.1)
  359. }
  360. .sidebar-dark .nav-sidebar-bordered>.nav-item-header {
  361. background-color: rgba(0,0,0,.1);
  362. border-top: 1px solid rgba(255,255,255,.1);
  363. margin: 0
  364. }
  365. .sidebar-light .nav-sidebar-bordered>.nav-item {
  366. border-top: 1px solid #eee
  367. }
  368. .sidebar-light .nav-sidebar-bordered>.nav-item-header {
  369. background-color: #fafafa;
  370. border-top: 1px solid #eee;
  371. margin: 0
  372. }
  373. .sidebar-dark {
  374. background-color: #1a2738;
  375. color: #fff
  376. }
  377. .sidebar-dark .nav-sidebar .nav-link {
  378. color: rgba(255,255,255,.9)
  379. }
  380. .sidebar-dark .nav-sidebar .nav-link:not(.disabled):hover {
  381. color: #fff;
  382. background-color: rgba(255,255,255,.1)
  383. }
  384. .sidebar-dark .nav-sidebar .nav-item>.nav-link.active {
  385. background-color: #28313d !important;
  386. color: #fff
  387. }
  388. .sidebar-dark .nav-sidebar .nav-item-open>.nav-link:not(.disabled), .sidebar-dark .nav-sidebar>.nav-item-expanded:not(.nav-item-open)>.nav-link {
  389. background-color:#34663f;
  390. color: #fff
  391. }
  392. .sidebar-dark .nav-sidebar>.nav-item>.nav-link.active {
  393. background-color: #596782;
  394. color: #fff
  395. }
  396. .sidebar-dark .nav-sidebar .nav-item-header {
  397. color: rgba(255,255,255,.5)
  398. }
  399. .sidebar-dark .nav-sidebar .nav-item-divider {
  400. background-color: rgba(255,255,255,.1)
  401. }
  402. .sidebar-dark .nav-sidebar>.nav-item-submenu>.nav-group-sub {
  403. background-color: rgba(0,0,0,.25)
  404. }
  405. .sidebar-dark .sidebar-section-header {
  406. border-bottom: 1px solid rgba(255,255,255,.1)
  407. }
  408. .sidebar-dark .btn-sidebar-expand {
  409. background-color: #252b36;
  410. border-color: rgba(255,255,255,.1);
  411. color: #fff
  412. }
  413. .sidebar-dark .btn-sidebar-expand:focus, .sidebar-dark .btn-sidebar-expand:hover {
  414. background-color: #2f3745
  415. }
  416. .sidebar-dark .btn-sidebar-expand:not([disabled]):not(.disabled):active {
  417. background-color: #353d4d
  418. }
  419. .sidebar-light {
  420. background-color: #fff;
  421. color: #333;
  422. border-right: 1px solid rgba(0,0,0,.125)
  423. }
  424. .sidebar-light.sidebar-right {
  425. border-right: 0;
  426. border-left: 1px solid rgba(0,0,0,.125)
  427. }
  428. .sidebar-light .nav-sidebar .nav-link {
  429. color: #333
  430. }
  431. .sidebar-light .nav-sidebar .nav-link:not(.disabled):hover {
  432. color: #333;
  433. background-color: #eee
  434. }
  435. .sidebar-light .nav-sidebar .nav-item>.nav-link.active {
  436. background-color: #e9f5fe;
  437. color: #2196f3
  438. }
  439. .sidebar-light .nav-sidebar .nav-item-open>.nav-link:not(.disabled), .sidebar-light .nav-sidebar>.nav-item-expanded>.nav-link {
  440. background-color: #eee;
  441. color: #333
  442. }
  443. .sidebar-light .nav-sidebar>.nav-item>.nav-link.active {
  444. background-color: #eee;
  445. color: #333
  446. }
  447. .sidebar-light .nav-sidebar .nav-item-header {
  448. color: rgba(51,51,51,.5)
  449. }
  450. .sidebar-light .nav-sidebar .nav-item-divider {
  451. background-color: rgba(0,0,0,.125)
  452. }
  453. .sidebar-light .nav-sidebar>.nav-item-submenu>.nav-group-sub {
  454. background-color: transparent
  455. }
  456. .sidebar-light .sidebar-section-header {
  457. border-bottom: 1px solid rgba(0,0,0,.125)
  458. }
  459. .sidebar-light .btn-sidebar-expand {
  460. background-color: #fff;
  461. border-color: rgba(0,0,0,.125);
  462. color: #333
  463. }
  464. .sidebar-light .btn-sidebar-expand:focus, .sidebar-light .btn-sidebar-expand:hover {
  465. background-color: #f2f2f2
  466. }
  467. .sidebar-light .btn-sidebar-expand:not([disabled]):not(.disabled):active {
  468. background-color: #ececec
  469. }
  470. .sidebar-component {
  471. display: none;
  472. position: static;
  473. width: 100%;
  474. border: 1px solid transparent;
  475. margin-bottom: 1.25rem;
  476. border-radius:.25rem;
  477. box-shadow: 0 1px 2px rgba(0,0,0,.05)
  478. }
  479. .sidebar-component.sidebar-dark {
  480. border-color: rgba(255,255,255,.1)
  481. }
  482. .sidebar-component.sidebar-light {
  483. border-color: rgba(0,0,0,.125)
  484. }
  485. .sidebar-sections {
  486. background-color: transparent;
  487. border: 0;
  488. margin: 0;
  489. box-shadow: none;
  490. border-radius: 0
  491. }
  492. @media (min-width:576px) {
  493. .sidebar-expand-sm {
  494. position: static
  495. }
  496. .sidebar-expand-sm.sidebar-collapsed {
  497. width: auto
  498. }
  499. .sidebar-expand-sm.sidebar-collapsed .btn-sidebar-expand {
  500. display: -ms-flexbox;
  501. display: flex;
  502. -ms-flex-align: center;
  503. align-items: center;
  504. height: 100%
  505. }
  506. .sidebar-expand-sm.sidebar-collapsed>:not(.btn-sidebar-expand) {
  507. display: none!important
  508. }
  509. .sidebar-expand-sm.sidebar-main {
  510. z-index: 99;
  511. box-shadow: none
  512. }
  513. .sidebar-expand-sm.sidebar-main-resized {
  514. position: absolute;
  515. left: 0;
  516. transition: none
  517. }
  518. .sidebar-expand-sm.sidebar-main-resized+* {
  519. margin-left: 3.5rem
  520. }
  521. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) {
  522. width: 3.5rem;
  523. overflow: hidden
  524. }
  525. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-group-sub, .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>div, .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link>span, .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-title {
  526. display: none!important
  527. }
  528. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-section-body {
  529. padding-left: 0;
  530. padding-right: 0
  531. }
  532. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media {
  533. -ms-flex-pack: center;
  534. justify-content: center
  535. }
  536. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:not(:first-child) {
  537. display: none!important
  538. }
  539. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:first-child {
  540. margin-right: 0!important
  541. }
  542. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-hide {
  543. display: none
  544. }
  545. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-show {
  546. display: block
  547. }
  548. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header, .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link, .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header {
  549. padding-left: 0;
  550. padding-right: 0;
  551. -ms-flex-pack: center;
  552. justify-content: center
  553. }
  554. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header>* {
  555. margin: 0!important
  556. }
  557. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header i, .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  558. position: static;
  559. display: block
  560. }
  561. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link:after {
  562. content: none
  563. }
  564. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  565. margin-left: 0;
  566. margin-right: 0
  567. }
  568. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header {
  569. display: -ms-flexbox;
  570. display: flex
  571. }
  572. .sidebar-expand-sm.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>i {
  573. margin-top:.1875rem;
  574. margin-bottom:.1875rem
  575. }
  576. .sidebar-expand-sm.sidebar-main-resized.sidebar-main-unfold {
  577. width: 18.75rem;
  578. z-index: 1022;
  579. box-shadow:.25rem 0 1rem rgba(0,0,0,.35)
  580. }
  581. .sidebar-expand-sm.sidebar-secondary {
  582. z-index: 98;
  583. box-shadow: none
  584. }
  585. .sidebar-expand-sm.sidebar-right {
  586. z-index: 97;
  587. box-shadow: none
  588. }
  589. .sidebar-expand-sm.sidebar-component {
  590. display: -ms-flexbox;
  591. display: flex;
  592. width: 18.75rem;
  593. z-index: 96
  594. }
  595. .sidebar-expand-sm.sidebar-component-left {
  596. margin-right: 1.25rem
  597. }
  598. .sidebar-expand-sm.sidebar-component-right {
  599. margin-left: 1.25rem
  600. }
  601. .sidebar-expand-sm.sidebar-dark:not(.sidebar-component)+.sidebar-dark:not(.sidebar-component) {
  602. box-shadow: 1px 0 0 rgba(255,255,255,.1) inset
  603. }
  604. @supports ((position:-webkit-sticky) or (position:sticky)) {
  605. .sidebar-expand-sm.sidebar-sticky {
  606. position:-webkit-sticky;
  607. position:sticky;
  608. top:1.25rem;
  609. z-index:1020
  610. }
  611. }
  612. }
  613. @media (max-width:575.98px) {
  614. .sidebar-expand-sm {
  615. z-index: 1040;
  616. transition: left ease-in-out .15s, right ease-in-out .15s
  617. }
  618. }
  619. @media (max-width:575.98px) and (prefers-reduced-motion:reduce) {
  620. .sidebar-expand-sm {
  621. transition: none
  622. }
  623. }
  624. @media (max-width:575.98px) {
  625. .sidebar-expand-sm:not(.sidebar-component) {
  626. border: 0
  627. }
  628. }
  629. @media (min-width:769px) {
  630. .sidebar-expand-md {
  631. position: static
  632. }
  633. .sidebar-expand-md.sidebar-collapsed {
  634. width: auto
  635. }
  636. .sidebar-expand-md.sidebar-collapsed .btn-sidebar-expand {
  637. display: -ms-flexbox;
  638. display: flex;
  639. -ms-flex-align: center;
  640. align-items: center;
  641. height: 100%
  642. }
  643. .sidebar-expand-md.sidebar-collapsed>:not(.btn-sidebar-expand) {
  644. display: none!important
  645. }
  646. .sidebar-expand-md.sidebar-main {
  647. z-index: 99;
  648. box-shadow: none
  649. }
  650. .sidebar-expand-md.sidebar-main-resized {
  651. position: absolute;
  652. left: 0;
  653. transition: none
  654. }
  655. .sidebar-expand-md.sidebar-main-resized+* {
  656. margin-left: 3.5rem
  657. }
  658. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) {
  659. width: 3.5rem;
  660. overflow: hidden
  661. }
  662. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-group-sub, .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>div, .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link>span, .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-title {
  663. display: none!important
  664. }
  665. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-section-body {
  666. padding-left: 0;
  667. padding-right: 0
  668. }
  669. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media {
  670. -ms-flex-pack: center;
  671. justify-content: center
  672. }
  673. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:not(:first-child) {
  674. display: none!important
  675. }
  676. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:first-child {
  677. margin-right: 0!important
  678. }
  679. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-hide {
  680. display: none
  681. }
  682. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-show {
  683. display: block
  684. }
  685. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header, .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link, .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header {
  686. padding-left: 0;
  687. padding-right: 0;
  688. -ms-flex-pack: center;
  689. justify-content: center
  690. }
  691. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header>* {
  692. margin: 0!important
  693. }
  694. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header i, .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  695. position: static;
  696. display: block
  697. }
  698. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link:after {
  699. content: none
  700. }
  701. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  702. margin-left: 0;
  703. margin-right: 0
  704. }
  705. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header {
  706. display: -ms-flexbox;
  707. display: flex
  708. }
  709. .sidebar-expand-md.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>i {
  710. margin-top:.1875rem;
  711. margin-bottom:.1875rem
  712. }
  713. .sidebar-expand-md.sidebar-main-resized.sidebar-main-unfold {
  714. width: 18.75rem;
  715. z-index: 1022;
  716. box-shadow:.25rem 0 1rem rgba(0,0,0,.35)
  717. }
  718. .sidebar-expand-md.sidebar-secondary {
  719. z-index: 98;
  720. box-shadow: none
  721. }
  722. .sidebar-expand-md.sidebar-right {
  723. z-index: 97;
  724. box-shadow: none
  725. }
  726. .sidebar-expand-md.sidebar-component {
  727. display: -ms-flexbox;
  728. display: flex;
  729. width: 18.75rem;
  730. z-index: 96
  731. }
  732. .sidebar-expand-md.sidebar-component-left {
  733. margin-right: 1.25rem
  734. }
  735. .sidebar-expand-md.sidebar-component-right {
  736. margin-left: 1.25rem
  737. }
  738. .sidebar-expand-md.sidebar-dark:not(.sidebar-component)+.sidebar-dark:not(.sidebar-component) {
  739. box-shadow: 1px 0 0 rgba(255,255,255,.1) inset
  740. }
  741. @supports ((position:-webkit-sticky) or (position:sticky)) {
  742. .sidebar-expand-md.sidebar-sticky {
  743. position:-webkit-sticky;
  744. position:sticky;
  745. top:1.25rem;
  746. z-index:1020
  747. }
  748. }
  749. }
  750. @media (max-width:768.98px) {
  751. .sidebar-expand-md {
  752. z-index: 1040;
  753. transition: left ease-in-out .15s, right ease-in-out .15s
  754. }
  755. }
  756. @media (max-width:768.98px) and (prefers-reduced-motion:reduce) {
  757. .sidebar-expand-md {
  758. transition: none
  759. }
  760. }
  761. @media (max-width:768.98px) {
  762. .sidebar-expand-md:not(.sidebar-component) {
  763. border: 0
  764. }
  765. }
  766. @media (min-width:992px) {
  767. .sidebar-expand-lg {
  768. position: static
  769. }
  770. .sidebar-expand-lg.sidebar-collapsed {
  771. width: auto
  772. }
  773. .sidebar-expand-lg.sidebar-collapsed .btn-sidebar-expand {
  774. display: -ms-flexbox;
  775. display: flex;
  776. -ms-flex-align: center;
  777. align-items: center;
  778. height: 100%
  779. }
  780. .sidebar-expand-lg.sidebar-collapsed>:not(.btn-sidebar-expand) {
  781. display: none!important
  782. }
  783. .sidebar-expand-lg.sidebar-main {
  784. z-index: 99;
  785. box-shadow: none
  786. }
  787. .sidebar-expand-lg.sidebar-main-resized {
  788. position: absolute;
  789. left: 0;
  790. transition: none
  791. }
  792. .sidebar-expand-lg.sidebar-main-resized+* {
  793. margin-left: 3.5rem
  794. }
  795. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) {
  796. width: 3.5rem;
  797. overflow: hidden
  798. }
  799. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-group-sub, .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>div, .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link>span, .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-title {
  800. display: none!important
  801. }
  802. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-section-body {
  803. padding-left: 0;
  804. padding-right: 0
  805. }
  806. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media {
  807. -ms-flex-pack: center;
  808. justify-content: center
  809. }
  810. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:not(:first-child) {
  811. display: none!important
  812. }
  813. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:first-child {
  814. margin-right: 0!important
  815. }
  816. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-hide {
  817. display: none
  818. }
  819. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-show {
  820. display: block
  821. }
  822. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header, .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link, .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header {
  823. padding-left: 0;
  824. padding-right: 0;
  825. -ms-flex-pack: center;
  826. justify-content: center
  827. }
  828. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header>* {
  829. margin: 0!important
  830. }
  831. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header i, .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  832. position: static;
  833. display: block
  834. }
  835. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link:after {
  836. content: none
  837. }
  838. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  839. margin-left: 0;
  840. margin-right: 0
  841. }
  842. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header {
  843. display: -ms-flexbox;
  844. display: flex
  845. }
  846. .sidebar-expand-lg.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>i {
  847. margin-top:.1875rem;
  848. margin-bottom:.1875rem
  849. }
  850. .sidebar-expand-lg.sidebar-main-resized.sidebar-main-unfold {
  851. width: 18.75rem;
  852. z-index: 1022;
  853. box-shadow:.25rem 0 1rem rgba(0,0,0,.35)
  854. }
  855. .sidebar-expand-lg.sidebar-secondary {
  856. z-index: 98;
  857. box-shadow: none
  858. }
  859. .sidebar-expand-lg.sidebar-right {
  860. z-index: 97;
  861. box-shadow: none
  862. }
  863. .sidebar-expand-lg.sidebar-component {
  864. display: -ms-flexbox;
  865. display: flex;
  866. width: 18.75rem;
  867. z-index: 96
  868. }
  869. .sidebar-expand-lg.sidebar-component-left {
  870. margin-right: 1.25rem
  871. }
  872. .sidebar-expand-lg.sidebar-component-right {
  873. margin-left: 1.25rem
  874. }
  875. .sidebar-expand-lg.sidebar-dark:not(.sidebar-component)+.sidebar-dark:not(.sidebar-component) {
  876. box-shadow: 1px 0 0 rgba(255,255,255,.1) inset
  877. }
  878. @supports ((position:-webkit-sticky) or (position:sticky)) {
  879. .sidebar-expand-lg.sidebar-sticky {
  880. position:-webkit-sticky;
  881. position:sticky;
  882. top:1.25rem;
  883. z-index:1020
  884. }
  885. }
  886. }
  887. @media (max-width:991.98px) {
  888. .sidebar-expand-lg {
  889. z-index: 1040;
  890. transition: left ease-in-out .15s, right ease-in-out .15s
  891. }
  892. }
  893. @media (max-width:991.98px) and (prefers-reduced-motion:reduce) {
  894. .sidebar-expand-lg {
  895. transition: none
  896. }
  897. }
  898. @media (max-width:991.98px) {
  899. .sidebar-expand-lg:not(.sidebar-component) {
  900. border: 0
  901. }
  902. }
  903. @media (min-width:1200px) {
  904. .sidebar-expand-xl {
  905. position: static
  906. }
  907. .sidebar-expand-xl.sidebar-collapsed {
  908. width: auto
  909. }
  910. .sidebar-expand-xl.sidebar-collapsed .btn-sidebar-expand {
  911. display: -ms-flexbox;
  912. display: flex;
  913. -ms-flex-align: center;
  914. align-items: center;
  915. height: 100%
  916. }
  917. .sidebar-expand-xl.sidebar-collapsed>:not(.btn-sidebar-expand) {
  918. display: none!important
  919. }
  920. .sidebar-expand-xl.sidebar-main {
  921. z-index: 99;
  922. box-shadow: none
  923. }
  924. .sidebar-expand-xl.sidebar-main-resized {
  925. position: absolute;
  926. left: 0;
  927. transition: none
  928. }
  929. .sidebar-expand-xl.sidebar-main-resized+* {
  930. margin-left: 3.5rem
  931. }
  932. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) {
  933. width: 3.5rem;
  934. overflow: hidden
  935. }
  936. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-group-sub, .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>div, .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link>span, .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-title {
  937. display: none!important
  938. }
  939. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-section-body {
  940. padding-left: 0;
  941. padding-right: 0
  942. }
  943. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media {
  944. -ms-flex-pack: center;
  945. justify-content: center
  946. }
  947. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:not(:first-child) {
  948. display: none!important
  949. }
  950. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:first-child {
  951. margin-right: 0!important
  952. }
  953. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-hide {
  954. display: none
  955. }
  956. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-show {
  957. display: block
  958. }
  959. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header, .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link, .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header {
  960. padding-left: 0;
  961. padding-right: 0;
  962. -ms-flex-pack: center;
  963. justify-content: center
  964. }
  965. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header>* {
  966. margin: 0!important
  967. }
  968. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header i, .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  969. position: static;
  970. display: block
  971. }
  972. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link:after {
  973. content: none
  974. }
  975. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  976. margin-left: 0;
  977. margin-right: 0
  978. }
  979. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header {
  980. display: -ms-flexbox;
  981. display: flex
  982. }
  983. .sidebar-expand-xl.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>i {
  984. margin-top:.1875rem;
  985. margin-bottom:.1875rem
  986. }
  987. .sidebar-expand-xl.sidebar-main-resized.sidebar-main-unfold {
  988. width: 18.75rem;
  989. z-index: 1022;
  990. box-shadow:.25rem 0 1rem rgba(0,0,0,.35)
  991. }
  992. .sidebar-expand-xl.sidebar-secondary {
  993. z-index: 98;
  994. box-shadow: none
  995. }
  996. .sidebar-expand-xl.sidebar-right {
  997. z-index: 97;
  998. box-shadow: none;
  999. display:block;
  1000. }
  1001. .sidebar-expand-xl.sidebar-component {
  1002. display: -ms-flexbox;
  1003. display: flex;
  1004. width: 18.75rem;
  1005. z-index: 96
  1006. }
  1007. .sidebar-expand-xl.sidebar-component-left {
  1008. margin-right: 1.25rem
  1009. }
  1010. .sidebar-expand-xl.sidebar-component-right {
  1011. margin-left: 1.25rem
  1012. }
  1013. .sidebar-expand-xl.sidebar-dark:not(.sidebar-component)+.sidebar-dark:not(.sidebar-component) {
  1014. box-shadow: 1px 0 0 rgba(255,255,255,.1) inset
  1015. }
  1016. @supports ((position:-webkit-sticky) or (position:sticky)) {
  1017. .sidebar-expand-xl.sidebar-sticky {
  1018. position:-webkit-sticky;
  1019. position:sticky;
  1020. top:1.25rem;
  1021. z-index:1020
  1022. }
  1023. }
  1024. }
  1025. @media (max-width:1199.98px) {
  1026. .sidebar-expand-xl {
  1027. z-index: 1040;
  1028. transition: left ease-in-out .15s, right ease-in-out .15s
  1029. }
  1030. }
  1031. @media (max-width:1199.98px) and (prefers-reduced-motion:reduce) {
  1032. .sidebar-expand-xl {
  1033. transition: none
  1034. }
  1035. }
  1036. @media (max-width:1199.98px) {
  1037. .sidebar-expand-xl:not(.sidebar-component) {
  1038. border: 0
  1039. }
  1040. }
  1041. .sidebar-expand {
  1042. position: static;
  1043. z-index: 1040;
  1044. transition: left ease-in-out .15s, right ease-in-out .15s
  1045. }
  1046. .sidebar-expand.sidebar-collapsed {
  1047. width: auto
  1048. }
  1049. .sidebar-expand.sidebar-collapsed .btn-sidebar-expand {
  1050. display: -ms-flexbox;
  1051. display: flex;
  1052. -ms-flex-align: center;
  1053. align-items: center;
  1054. height: 100%
  1055. }
  1056. .sidebar-expand.sidebar-collapsed>:not(.btn-sidebar-expand) {
  1057. display: none!important
  1058. }
  1059. .sidebar-expand.sidebar-main {
  1060. z-index: 99;
  1061. box-shadow: none
  1062. }
  1063. .sidebar-expand.sidebar-main-resized {
  1064. position: absolute;
  1065. left: 0;
  1066. transition: none
  1067. }
  1068. .sidebar-expand.sidebar-main-resized+* {
  1069. margin-left: 3.5rem
  1070. }
  1071. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) {
  1072. width: 3.5rem;
  1073. overflow: hidden
  1074. }
  1075. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-group-sub, .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>div, .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link>span, .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-title {
  1076. display: none!important
  1077. }
  1078. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-section-body {
  1079. padding-left: 0;
  1080. padding-right: 0
  1081. }
  1082. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media {
  1083. -ms-flex-pack: center;
  1084. justify-content: center
  1085. }
  1086. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:not(:first-child) {
  1087. display: none!important
  1088. }
  1089. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-user .media>:first-child {
  1090. margin-right: 0!important
  1091. }
  1092. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-hide {
  1093. display: none
  1094. }
  1095. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-resize-show {
  1096. display: block
  1097. }
  1098. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header, .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link, .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header {
  1099. padding-left: 0;
  1100. padding-right: 0;
  1101. -ms-flex-pack: center;
  1102. justify-content: center
  1103. }
  1104. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .sidebar-main-header>* {
  1105. margin: 0!important
  1106. }
  1107. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header i, .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  1108. position: static;
  1109. display: block
  1110. }
  1111. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link:after {
  1112. content: none
  1113. }
  1114. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-link i {
  1115. margin-left: 0;
  1116. margin-right: 0
  1117. }
  1118. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header {
  1119. display: -ms-flexbox;
  1120. display: flex
  1121. }
  1122. .sidebar-expand.sidebar-main-resized:not(.sidebar-main-unfold) .nav-sidebar .nav-item-header>i {
  1123. margin-top:.1875rem;
  1124. margin-bottom:.1875rem
  1125. }
  1126. .sidebar-expand.sidebar-main-resized.sidebar-main-unfold {
  1127. width: 18.75rem;
  1128. z-index: 1022;
  1129. box-shadow:.25rem 0 1rem rgba(0,0,0,.35)
  1130. }
  1131. .sidebar-expand.sidebar-secondary {
  1132. z-index: 98;
  1133. box-shadow: none;
  1134. }
  1135. .sidebar-expand.sidebar-right {
  1136. z-index: 97;
  1137. box-shadow: none;
  1138. }
  1139. .sidebar-expand.sidebar-component {
  1140. display: -ms-flexbox;
  1141. display: flex;
  1142. width: 18.75rem;
  1143. z-index: 96
  1144. }
  1145. .sidebar-expand.sidebar-component-left {
  1146. margin-right: 1.25rem
  1147. }
  1148. .sidebar-expand.sidebar-component-right {
  1149. margin-left: 1.25rem
  1150. }
  1151. .sidebar-expand.sidebar-dark:not(.sidebar-component)+.sidebar-dark:not(.sidebar-component) {
  1152. box-shadow: 1px 0 0 rgba(255,255,255,.1) inset
  1153. }
  1154. @supports ((position:-webkit-sticky) or (position:sticky)) {
  1155. .sidebar-expand.sidebar-sticky {
  1156. position:-webkit-sticky;
  1157. position:sticky;
  1158. top:1.25rem;
  1159. z-index:1020
  1160. }
  1161. }
  1162. @media (prefers-reduced-motion:reduce) {
  1163. .sidebar-expand {
  1164. transition: none
  1165. }
  1166. }
  1167. .sidebar-expand:not(.sidebar-component) {
  1168. border: 0
  1169. }
  1170. .sidebar-dark .nav-tabs .nav-item.show .nav-link:not(.active) {
  1171. color: #fff
  1172. }
  1173. .sidebar-light .nav-tabs:not(.nav-tabs-bottom) .nav-link.active {
  1174. background-color: #fff
  1175. }
  1176. .ft_wrap {
  1177. margin-top: 120px;
  1178. padding: 30px 0;
  1179. background: #292929;
  1180. }
  1181. .ft_wrap .container {
  1182. display: flex;
  1183. justify-content: space-between;
  1184. }
  1185. .ft_left {
  1186. color: #ccc;
  1187. font-size: 1.4rem;
  1188. }
  1189. .ft_left ul {
  1190. display: flex;
  1191. margin: 20px 0;
  1192. }
  1193. .ft_left li {
  1194. margin-right: 15px;
  1195. }
  1196. .ft_left a {
  1197. color: #ccc;
  1198. ;
  1199. }
  1200. .ft_left div {
  1201. color: #ccc;
  1202. }
  1203. .ft_right {
  1204. /*display: flex;*/
  1205. margin-top: 20px;
  1206. }
  1207. .ft_right dl {
  1208. margin-left: 58px;
  1209. }
  1210. .ft_right dt {
  1211. margin-bottom: 20px;
  1212. color: #c3613f;
  1213. }
  1214. .ft_right dd a {
  1215. color: #ccc;
  1216. }
  1217. /*서브공통*/
  1218. .top_wrap {
  1219. padding: 40px 0;
  1220. background: #ea5520 url(/themes/pro/ssohost/resources/images/top_bg.png);
  1221. text-align: center;
  1222. }
  1223. .top_wrap .search_box {
  1224. display: flex;
  1225. width: 100%;
  1226. height: 50px;
  1227. border: 1px solid #cf592f;
  1228. border-radius: 10px;
  1229. /*overflow: hidden;*/
  1230. background:#fff;
  1231. }
  1232. .top_wrap .search_box label {
  1233. display: flex;
  1234. justify-content: center;
  1235. align-items: center;
  1236. width: 150px;
  1237. height: 100%;
  1238. background: #382d2a;
  1239. color: #fff;
  1240. letter-spacing: normal;
  1241. }
  1242. .top_wrap .search_box input {
  1243. flex: 1;
  1244. border:none!important;
  1245. height: 48px;
  1246. /*width:auto!important;*/
  1247. border-radius:0!important;
  1248. }
  1249. .top_wrap .search_box button {
  1250. display: flex;
  1251. justify-content: center;
  1252. align-items: center;
  1253. width: 90px;
  1254. border: none;
  1255. background: #fff;
  1256. }
  1257. .top_wrap .search_box button i {
  1258. font-size: 28px;
  1259. color: #000;
  1260. }
  1261. .no_left .content {flex-flow: wrap; width:100%;}
  1262. .no_left .content > div {margin-bottom:1.5rem; padding:2rem;}
  1263. .card_1 {width:100%;}
  1264. .card_2 {flex:1; width:49%; margin-left:15px;}
  1265. .card_2:first-child,
  1266. .card_3:first-child {margin-left:0;}
  1267. .card_3 {flex:1; width:33.33%; margin-left:2%;}
  1268. .card_wrap {display:flex; justify-content:space-between; border:none!important; box-shadow:none!important;}
  1269. .card_left, .card_right {padding:20px; border: 1px solid #e7eaf3; border-radius:10px; box-shadow: 0 0.5rem 1.2rem rgb(189 197 209 / 20%);}
  1270. .card_tit {font-size: 1.8rem; color: #000; font-weight: 700;}
  1271. .content {display:flex; padding-top:30px; font-size:0.8125rem;}
  1272. .content > div {background:#fff; border: 1px solid #e7eaf3; border-radius:10px; box-shadow: 0 0.5rem 1.2rem rgb(189 197 209 / 20%);}
  1273. .content .left {width:18.24%; min-width:187px; margin-right:2.2%; padding:0; border:none; box-shadow:none; border-radius:0;}
  1274. .content .right { padding:20px 30px; width: 100%;}
  1275. .my_page .right { overflow: hidden; }
  1276. /* .content .right {width:79.56%; padding:20px 30px;} */
  1277. .content .left .navbar-collapse {align-items:flex-start; padding:0; margin:0; width:100%; background:#fff; border: 1px solid #e7eaf3; border-radius:10px; box-shadow: 0 0.5rem 1.2rem rgb(189 197 209 / 20%);}
  1278. .content .left .navbar-nav {display:flex; flex-flow: column wrap; width:100%; margin-top:10px;}
  1279. .content .left .nav-link {display:flex; align-items:center; padding: 13px 20px;}
  1280. .content .left .nav-link.active {background:#fdede7; color: #ea5520; border-left: 3px solid #ea5520;}
  1281. .content .left .nav-link.active span,
  1282. .content .left .nav-link.active i {color:inherit;}
  1283. .content .left .nav-link i {margin-right:8px; font-size:2rem;}
  1284. .content .left .navbar-toggler i {font-size:1.8rem;}
  1285. .content h2 {margin-bottom:30px; font-size:2.4rem; font-weight:700; color: #000;}
  1286. input[type="text"],
  1287. input[type="password"],
  1288. input[type="email"] {
  1289. height: 45px;
  1290. font-size:inherit;
  1291. border:1px solid #ddd;
  1292. }
  1293. input[type="number"] {height:45px; font-size:inherit; border:1px solid #ddd;line-height:45px}
  1294. textarea {font-size:inherit;}
  1295. .form-control-feedback {display: flex; align-items: center; height:45px;}
  1296. .form-control-feedback i {font-size: 1.6rem}
  1297. .form-group-feedback input[type="text"],
  1298. .form-group-feedback input[type="email"],
  1299. .form-group-feedback input[type="password"] {padding-left: 40px;}
  1300. /*버튼*/
  1301. button i, button span {color:inherit;}
  1302. .btn {position:relative; display: flex; justify-content: center; align-items: center; height:36px; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  1303. }
  1304. .btn-primary {background-color: #5c6bc0; border-color: #5c6bc0;}
  1305. .btn-primary:hover {background-color: #4a5bb9; border-color: #4a5bb9;}
  1306. .btn-sec {
  1307. background: #ddd;
  1308. font-size: 1.6rem;
  1309. letter-spacing: 0;
  1310. height:45px;
  1311. }
  1312. .btn-sec:hover{ background:#b7b7b7;}
  1313. .btn_orange {
  1314. background: #d57755;
  1315. font-size: 1.6rem;
  1316. border-radius: 5px;
  1317. color: #fff;
  1318. }
  1319. .btn_orange:hover {
  1320. background: #cf5c33;
  1321. color: #fff;
  1322. }
  1323. .btn_gray_b {background: #f6f6f6; border: 1px solid #ddd; color:#666;}
  1324. .btn_gray_b:hover {background:#eee; color:#666;}
  1325. .btn_wh {border:1px solid #ddd; color: #666;}
  1326. .btn_wh:hover {background:#f6f6f6;}
  1327. .btn_orange_b {border: 1px solid #db7c5b; color: #d15a30;}
  1328. .btn_orange_b:hover {background:#db7c5b; color:#fff;}
  1329. .btn_big {
  1330. width: 100%;
  1331. height: 50px;
  1332. }
  1333. .btn_mid {width:100px; height:35px;}
  1334. .btn:not(:disabled):not(.disabled) {cursor: pointer;}
  1335. .btn-icon {display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; padding: 0; width: calc(2.25rem + 2px); height: calc(2.25rem + 2px);}
  1336. .btn-icon.btn-sm {width: calc(2rem + 2px); height: calc(2rem + 2px);}
  1337. .btn-group-sm>.btn, .btn-sm {min-width: 3.25rem; padding: 0.3125rem 0.75rem; font-size: .8125rem; line-height: 1.6924; border-radius: 0.1875rem;}
  1338. .btn-outline-light-100:hover {background-color: rgba(255,255,255,.1);}
  1339. .custom-pagination {display:flex; justify-content: center; margin-left: auto; }
  1340. .custom-pagination .page-item {display:flex !important; align-items:center !important; }
  1341. .custom-pagination .page-item .page-link {display:flex !important; align-items: center !important; justify-content: center !important; }
  1342. .custom-pagination .page-item .page-link i {font-size:2.3rem !important; color:#878787 !important;}
  1343. .custom-pagination .page-item.active .page-link i {color:#000 !important;}
  1344. .custom-pagination .page-item.active .page-link {border-color: #d35b2f;}
  1345. /*.custom-pagination .page-item .page-link {border: 0; margin:0 5px !important; border-radius:5px !important; padding: 4px 10px; font-size:1.2rem !important; color:#666 !important; line-height:1.6 !important;}*/
  1346. .custom-pagination .page-item.active .page-link {background:#d35b2f !important; color:#fff !important;}
  1347. /*sso-app-list*/
  1348. .tab-close {
  1349. display: flex;
  1350. flex-flow: row wrap;
  1351. justify-content: center;
  1352. align-items: center;
  1353. padding: 0;
  1354. margin: 0;
  1355. background: rgb(255 255 255 / 90%);
  1356. color: #f33030!important;
  1357. border-radius: 50%;
  1358. width: 20px;
  1359. height: 20px;
  1360. font-size: 16px;
  1361. }
  1362. .tab-close i {color:inherit!important;}
  1363. .select2-search--hide + .select2-results > .select2-results__options {padding-top:0;}
  1364. .select2-results__option {padding: 0.5rem 0.5rem;}
  1365. .select2-selection--single:not([class*=bg-]):not([class*=border-]) {width:100%;}
  1366. .select2-dropdown {margin-left:3px;}
  1367. .dropdown-item {padding: 0.5rem 0.6rem;}
  1368. .dropdown-menu {min-width:auto; margin-top:-1px; padding: 0;}
  1369. .dropdown-divider {margin:0;}
  1370. .my-app {margin-bottom:-120px;}
  1371. .my-app .content {max-width:none; padding:0;}
  1372. .my-app .content * {box-sizing:border-box;}
  1373. #member-menu .navbar-collapse {background:#f6f6f6; border:none; border-right:1px solid #e7eaf3; border-radius:0; box-shadow:none;}
  1374. .my-app .sidebar-main {width:300px; margin-right:0; background:#1a2738; border:none; border-radius:0; box-shadow:none; color:#fff;}
  1375. .my-app .sidebar-main .card {border-top:1px solid rgba(255, 255, 255, 0.1);}
  1376. .my-app .sidebar-main.sidebar-collapsed {width:0;}
  1377. .my-app .sidebar-user {border:none;}
  1378. .my-app .sidebar-user i {color:#fff;}
  1379. .my-app .sidebar-user .font-size-xs {font-size:.8125rem; line-height: 1.6924;}
  1380. .my-app .nav-sidebar > .nav-item-open > a,
  1381. .my-app .nav-sidebar > .nav-item > a:hover,
  1382. .my-app .nav-sidebar > .nav-item > a.active {background:#34663f;}
  1383. .my-app .nav-sidebar .nav-item:not(.nav-item-header):last-child {padding-bottom:0;}
  1384. .my-app .nav-sidebar .nav-link:not(.disabled):hover,
  1385. .my-app .nav-sidebar .nav-link.active {color: #fff; background-color: rgba(255,255,255,.1);}
  1386. .my-app .nav-sidebar .nav-item-open>.nav-link:not(.disabled), .my-app .nav-sidebar>.nav-item-expanded:not(.nav-item-open)>.nav-link {background-color: #34663f; color: #fff;}
  1387. .nav-item-submenu>.nav-link:after {content: "\e9c7"; font-family: icomoon; display: inline-block; font-size: 1rem; vertical-align: middle; line-height: 1; position: absolute; top: 0.75rem; margin-top: 0.1875rem; right: 1.25rem; transition: -webkit-transform .25s ease-in-out; transition: transform .25s ease-in-out; transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale}
  1388. .my-app .right_warp {display:flex; flex:1; width:auto; border:none; border-radius:0; box-shadow:none; overflow:hidden;}
  1389. .my-app .right {display:flex; width:100%; padding:0; background:#f5f5f5; border:none; border-radius:0; box-shadow:none;}
  1390. /* .my-app .right {display:flex; width:100%; padding:0; font-size:1.4rem; border:none; border-radius:0; box-shadow:none;} */
  1391. .my-app .content .right .header-element-inline {display:flex; align-items:center; width:100%; height:60px; margin:0; padding:10px; background:#fff; border:none; border-bottom:1px solid #ddd!important; border-radius:0; box-sizing:none;}
  1392. .my-app .right .header-element-inline .navbar-nav li {padding:0 3px;}
  1393. .my-app .right .header-element-inline .navbar-nav li .txt_blue {color:#2196f3;}
  1394. .my-app .right .header-element-inline .navbar-nav li a,
  1395. .my-app .right .header-element-inline .navbar-nav li button,
  1396. .my-app .right .header-element-inline .navbar-nav li .select2-selection__rendered {font-size:14px;}
  1397. .my-app .right .header-element-inline .navbar-nav .w-100, .select2-selection--single {display:inline-block; max-width:120px; margin:0 3px; }
  1398. .my-app .right .header-element-inline .btn-light {}
  1399. .my-app .right .header-element-inline .w-md-auto {width:100px!important;}
  1400. .my-app .right .header-element-inline ul {width:100%;}
  1401. .my-app .right .card-body {flex-flow:column wrap; margin-top:10px;}
  1402. .my-app .right .card-body > .card > .card-header {padding: 0.625rem 1.25rem!important; margin-bottom: 0; border-bottom: 1px solid #dfdfdf;}
  1403. /* 필요없음 지움 .my-app .right .card-body {display:flex; flex-flow:column wrap; margin-top:10px;}
  1404. .my-app .right .card-body > .card {padding:1.25rem;}*/
  1405. .my-app .right .card-body .card_top {align-items:flex-end; margin-bottom:10px;}
  1406. .my-app .control_left {margin-right:auto;}
  1407. .my-app .control_right ul {display:flex; aling-items:center; }
  1408. .my-app .control_right .btn {padding:0.56rem 0.75rem /*0.4375rem 0.875rem;*/;}
  1409. .my-app .right i {font-size:1rem;}
  1410. .my-app .right .btn_wrap {margin-right:auto;}
  1411. /* .my-app .right .card-body button {min-width:100px; margin:0 2px; font-size:1.4rem;}
  1412. .my-app .right .btn-primary {height:35px; border-radius:5px;} */
  1413. .my-app .right .card-body .dropdown-toggle::after {margin-left:10px;}
  1414. .my-app .input_box label {display:block;}
  1415. .my-app .input_box input,
  1416. .my-app .input_box select {height:30px;}
  1417. /*필요없음 지움.my-app .table th, .my-app .table td {height:30px!important; padding-top:10px; padding-bottom:10px;}*/
  1418. .my-app .sidebar-right {width:18.75rem;}
  1419. .my-app .sidebar-right.sidebar-collapsed {width:0;}
  1420. .my-app .sidebar-right .sidebar-user {height:auto;padding: 0.3125rem!important; padding-top: 5px}
  1421. .my-app .sidebar-right i {color:#fff;}
  1422. .my-app .sidebar-right .btn-light {background-color: #5c6bc0; border-color: #5c6bc0; color:#fff;}
  1423. .my-app .sidebar-right .btn-light:hover {background-color: #4a5bb9; border-color: #4a5bb9;}
  1424. .my-app .collapse:not(.show) {display:flex;}
  1425. .my-app .sidebar-right .nav-item a {color:#FF9800;}
  1426. .my-app .sidebar-right .nav-item a:hover,
  1427. .my-app .sidebar-right .nav-item a.active {background:rgba(255,255,255,.1); color:#FF9800;}
  1428. .my-app .sidebar-right .nav-item i {color:inherit;}
  1429. .swal2-popup {
  1430. border: 1px solid black;
  1431. }
  1432. /* for block of numbers */
  1433. .hljs-ln-code {
  1434. padding-left: 10px !important;
  1435. }
  1436. .hljs-ln-numbers {
  1437. -webkit-touch-callout: none;
  1438. -webkit-user-select: none;
  1439. -khtml-user-select: none;
  1440. -moz-user-select: none;
  1441. -ms-user-select: none;
  1442. user-select: none;
  1443. text-align: center;
  1444. color: #ccc;
  1445. border-right: 1px solid #CCC;
  1446. vertical-align: top;
  1447. padding-right: 10px !important;
  1448. /* your custom style here */
  1449. }
  1450. code {
  1451. padding-top: 0 !important;
  1452. padding-bottom: 0 !important;
  1453. }
  1454. pre {
  1455. padding: 0;
  1456. }
  1457. /* for block of code */
  1458. .hljs-ln-code {
  1459. padding-left: 10px;
  1460. }
  1461. .my-app input[type=tel], .my-app input[type=time], .my-app input[type=text], .my-app input[type=password], .my-app input[type=search], .my-app input[type=email], .my-app input[type=file], .my-app input[type=url], .my-app input[type=number], .my-app input[type=date] {
  1462. width: 250px;
  1463. height: 28px;
  1464. color: #373737;
  1465. border: 1px solid #ccc;
  1466. background: #fff;
  1467. text-indent: 2px;
  1468. transition: all 0.5s;
  1469. vertical-align: middle;
  1470. box-sizing: border-box;
  1471. }
  1472. /* swal2 */
  1473. .swal2-cancel {
  1474. height: 35px;
  1475. }
  1476. .swal2-confirm {
  1477. height: 35px;
  1478. }
  1479. .none{display:none}
  1480. #ticker{float:left;width:100px;}
  1481. .block {padding:0 10px; height:40px; width: 300px; overflow:hidden; background:#fff; float:left;}
  1482. .menu_btm .block li {
  1483. line-height: 40px;
  1484. border: none;
  1485. font-size: 14px;
  1486. font-weight: 400;
  1487. color: rgb(153, 153, 153);
  1488. }
  1489. .menu_btm .block li a {
  1490. white-space: nowrap;
  1491. }
  1492. .btn-to-top {
  1493. position: absolute;
  1494. bottom: 1.25rem;
  1495. right: 1.25rem;
  1496. -ms-flex-item-align: end;
  1497. align-self: flex-end;
  1498. opacity: 0;
  1499. visibility: hidden;
  1500. z-index: 999;
  1501. transition: all .15s ease-in-out
  1502. }
  1503. .btn-to-top-visible {
  1504. visibility: visible;
  1505. opacity: 1
  1506. }
  1507. .rounded {
  1508. border-radius: 0.25rem !important;
  1509. }
  1510. /* select */
  1511. select {
  1512. height: 28px;
  1513. padding: 0 2px !important;
  1514. color: #373737 !important;
  1515. border: 1px solid #ccc;
  1516. background: #fff;
  1517. box-sizing: border-box;
  1518. }
  1519. .btn-group {
  1520. z-index: 2;
  1521. }
  1522. .btn-group button:first-child {
  1523. letter-spacing: 0;
  1524. padding: 0 18px;
  1525. }
  1526. .btn-group button:last-child {
  1527. padding: 0 14px;
  1528. }
  1529. /* tooltip */
  1530. .tooltip-inner {
  1531. padding: 5px 5px !important;
  1532. width:100%;
  1533. left:0 !important;
  1534. right:0 !important;
  1535. }
  1536. /* Modal-Form */
  1537. .modal-body input {height:28px; color:#373737; border:1px solid #ccc; background:#fff; transition: all 0.5s; vertical-align:middle; box-sizing: border-box; text-indent: 2px;}
  1538. .modal-body textarea {width:100%; height:150px; font-size:12px; color:#373737; padding: 10px; border:1px solid #ccc; background:#fff; transition: all 0.5s; vertical-align:middle; box-sizing: border-box}
  1539. .modal-body input[readonly],
  1540. .modal-body input[disabled]{background:#eaeaea; border-color:#c0c0c0; color:#666; -webkit-appearance:none;}
  1541. .modal-body textarea[readonly],
  1542. .modal-body textarea[disabled]{padding:11px; font-size:16px; color:#666; font-weight:normal; line-height:140%; height:78px; background:#eaeaea;border:1px solid #c0c0c0;}
  1543. select:focus,
  1544. textarea:focus,
  1545. input:focus { border: 1px solid #727272; outline: none;}
  1546. input[type=file] {
  1547. text-indent: 0px !important;
  1548. }
  1549. .modal-header .close {
  1550. display: flex;
  1551. flex-flow: row wrap;
  1552. justify-content: center;
  1553. align-items: center;
  1554. padding: 0;
  1555. margin: 0;
  1556. background: rgb(255 255 255 / 90%);
  1557. color: #f33030!important;
  1558. border-radius: 50%;
  1559. width: 30px;
  1560. height: 30px;
  1561. font-size: 16px;
  1562. }
  1563. /* btn-copy*/
  1564. .btn-copy {
  1565. font-weight : 1400;
  1566. font-family: "Font Awesome 5 Free";
  1567. background-color : transparent;
  1568. border : none;
  1569. cursor : pointer;
  1570. position : absolute;
  1571. right : 5px;
  1572. top : 50%;
  1573. transform : translatey(-50%);
  1574. }
  1575. .btn-copy::before{
  1576. font-size: 15px;
  1577. content : "\f0c5";
  1578. }
  1579. #client-apps-form #generate-key-btn,
  1580. #client-apps-form #create-before-base64-key-btn {
  1581. background-color: #f44336 !important;
  1582. border-color: #f44336 !important;
  1583. }
  1584. /* card-header */
  1585. .card-danger:not(.card-outline) > .card-header {
  1586. background-color: #dc3545;
  1587. }
  1588. .card-danger:not(.card-outline) > .card-header {
  1589. background-color: #dc3545;
  1590. }
  1591. .card-danger:not(.card-outline) > .card-header,
  1592. .card-danger:not(.card-outline) > .card-header p {
  1593. color: #fff;
  1594. }
  1595. .card-primary:not(.card-outline) > .card-header {
  1596. background-color: #007bff;
  1597. }
  1598. .card-primary:not(.card-outline) > .card-header,
  1599. .card-primary:not(.card-outline) > .card-header p {
  1600. color: #fff;
  1601. }
  1602. .card-info:not(.card-outline) > .card-header {
  1603. background-color: #17a2b8;
  1604. }
  1605. .card-info:not(.card-outline) > .card-header,
  1606. .card-info:not(.card-outline) > .card-header p {
  1607. color: #fff;
  1608. }
  1609. .card-success:not(.card-outline) > .card-header {
  1610. background-color: #28a745;
  1611. }
  1612. .card-success:not(.card-outline) > .card-header,
  1613. .card-success:not(.card-outline) > .card-header p {
  1614. color: #fff;
  1615. }
  1616. @media screen and (max-width: 1200px) {
  1617. body {
  1618. background: #fff;
  1619. font-size: 1.4rem;
  1620. }
  1621. .menu_btm {
  1622. margin-top: 0;
  1623. border-top: none;
  1624. }
  1625. .menu_btm .container {
  1626. padding-right: 0;
  1627. padding-left: 0;
  1628. }
  1629. .menu_btm .navbar-brand img {
  1630. margin-right: 40px;
  1631. }
  1632. .menu_btm .notice_box {
  1633. width: 100%;
  1634. margin-bottom: 25px;
  1635. }
  1636. .menu_top {
  1637. position: relative;
  1638. top: auto;
  1639. right: auto;
  1640. }
  1641. .menu_top>div {
  1642. border: none;
  1643. }
  1644. .menu_top select {
  1645. display: flex;
  1646. align-items: center;
  1647. justify-content: center;
  1648. height: 30px;
  1649. padding: 0px 15px;
  1650. margin-right: 10px;
  1651. color: #666;
  1652. font-size: 1.3rem;
  1653. border-radius: 50px;
  1654. border: 1px solid #ddd;
  1655. }
  1656. .mrow2 .container>div,
  1657. .mrow3 .container>div {
  1658. width: 100%;
  1659. }
  1660. .mrow2 .container>div:last-child {
  1661. margin-top: 10px;
  1662. }
  1663. .ft_wrap {padding:30px 1.25rem!important;}
  1664. .nav-tabs .nav-item.show .nav-link.active:after, .nav-tabs .nav-link.active:after { bottom:-2px;}
  1665. .ft_wrap .ft_right dl {
  1666. margin-left: 15px;
  1667. }
  1668. .ft_wrap .ft_right dl:first-of-type {
  1669. margin-left: 0;
  1670. }
  1671. .collapse:not(.show) {
  1672. display: none
  1673. }
  1674. .no_left .content {flex-flow:column wrap;}
  1675. .card_2, .card_3 {width:100%; margin-left:0;}
  1676. .card_2 {width:100%; margin-left:0;}
  1677. .content {flex-direction:column;}
  1678. .content .left, .my-app .content .left {width:100%; margin-bottom:20px; justify-content:flex-end;}
  1679. .content .right {width:100%; padding:20px 0; padding-top:0; border:none; box-shadow:none;}
  1680. .content .left .navbar-collapse {margin-top:10px; border: 1px solid #f1b39d;}
  1681. .content .left .navbar-nav {display:flex; flex-flow: row wrap; justify-content:flex-start; padding:5px;}
  1682. .content .left .navbar-nav li {width:25%; text-align:center;}
  1683. .content .left .nav-link {flex-direction:column; padding:6px 10px;}
  1684. .content .left .nav-link.active {border-left:none; background:none;}
  1685. .token_setting .content {
  1686. overflow-x: hidden;
  1687. }
  1688. .account_setting .inner > div {width:48%;}
  1689. .trans_list .content {flex-direction:column;}
  1690. .trans_list .content .card_2 {width:100%; margin-left:0;}
  1691. .notice_list .card_2.card_left {width:100%;}
  1692. .notice_list .card_right {display:none;}
  1693. .list_box .nav-tabs {display: flex; border-bottom: none; flex-flow: row wrap; margin-left:-5px; margin-top:-5px;}
  1694. .list_box .nav-tabs .nav-item {width:48%; margin:1%;}
  1695. .list_box .nav-link {border:1px solid #ddd; border-radius:5px;}
  1696. .list_box .nav-link.active,
  1697. .list_box .nav-tabs .nav-link:focus,
  1698. .list_box .nav-tabs .nav-link:hover { border-color: #ed9b7e #ed9b7e #ed9b7e;}
  1699. .list_box .sub_tabs {display:flex; margin-left:0; margin-right:0;}
  1700. .list_box .sub_tabs .nav-item {display:flex; flex:1; margin:0; margin-bottom:-1px;}
  1701. .list_box .sub_tabs .nav-link { border-bottom-left-radius:0; border-bottom-right-radius:0;}
  1702. .list_box .sub_tabs .nav-link:active,
  1703. .list_box .sub_tabs .nav-link:focus,
  1704. .list_box .sub_tabs .nav-link:hover {margin-bottom:-1px; border:1px solid #efd8d0; border-bottom:none;}
  1705. .list_box .tab-pane .tab-content {padding:20px 10px; border-radius:0;}
  1706. .contract_detail .info_box ul,
  1707. .contract_detail .src_box dd {padding:10px;}
  1708. .contract_detail .src_box dt {flex-direction:column; align-items:flex-start; justify-content:space-between;}
  1709. .contract_detail .src_box dt button {margin-top:5px; padding:3px 5px; font-size:1.2rem;}
  1710. .cart .content > div {display:block;}
  1711. .cart .card_left {margin-right:0;}
  1712. .cart .card_left .table .info {}
  1713. .cart .card_left .table .info img {width:30px; height:30px; margin-right:5px;}
  1714. .cart .card_left .button_wrap {margin-bottom:40px;}
  1715. .checkout .content > div,
  1716. .order_received .content > div {display:block;}
  1717. .checkout .card_left,
  1718. .order_received .card_left {margin-right:0;}
  1719. .member_credit .balance > div {display: block;}
  1720. .member_credit .balance .info_box > div:first-of-type {margin-bottom:20px;}
  1721. .table-col th{width: auto;}
  1722. .item_detail .card_wrap {flex-flow: column-reverse;}
  1723. .item_detail .card_left, .item_detail .card_right {width:100%;}
  1724. .item_detail .card_right {margin-bottom:20px;}
  1725. .my-app .content {width: 100%; padding-top:30px; padding-left: 15px; padding-right: 15px;}
  1726. /* .my-app .btn-group:last-child {display:none;} */
  1727. .my-app .d-xl-none {border:none; border-radius:0; box-shadow:none;}
  1728. .my-app .navbar-nav {flex-flow:column wrap;}
  1729. .my-app .content > .d-md-none {border: none; box-shadow: none; border-radius: 0; display: flex; justify-content: flex-start;}
  1730. .my-app .content > .d-md-none i {font-size:1rem;}
  1731. .my-app .sidebar-main > .d-xl-none i {margin:10px 20px; transform:rotate(0.5turn); font-size:1.3rem;}
  1732. .my-app .nav-sidebar .nav-link:not(.disabled):hover
  1733. .my-app .content .right .card-header, navbar-collapse {height:auto; padding:0;}
  1734. .my-app .right .card-header .navbar-collapse {margin:0; padding:0;}
  1735. .my-app .control_left {margin-left:0; display:none;}
  1736. .my-app .right .card-header .navbar-nav {margin-bottom:5px;}
  1737. .my-app .right .card-header .navbar-nav li {width:100%; padding:0; margin:2px 0px;}
  1738. .my-app .right .card-header .navbar-nav button,
  1739. .my-app .right .card-header .navbar-nav .btn {display:flex; align-items:center; justify-content:center; height:35px;}
  1740. .my-app .right .card-header .navbar-nav .selection,
  1741. .my-app .right .card-header .navbar-nav .select2-results__option {}
  1742. /* .my-app .right .card-header .w-100 {width:auto!important;}
  1743. .my-app .right .card-body {padding:0;} */
  1744. /* .my-app .right .card-body > .card {width:100%;padding:0; border:none; border-radius:0; box-shadow:none;} */
  1745. .my-app .right .card-body .card_top {flex-flow:column wrap; align-items: flex-start;}
  1746. .my-app .right .card-body .input_box {width: 100%; padding:10px 3px;}
  1747. .my-app .right .card-body .input_box > div {display:flex;}
  1748. .my-app .right .card-body .input_box > div input {flex:1; width:100%;margin-left:5px;}
  1749. .my-app .right .btn_wrap {flex-flow:row wrap!important; justify-content:space-between!important;}
  1750. .my-app .card_cont .btn_wrap > div, .my-app .card_cont .btn_wrap select {width:48%; margin-bottom:20px;}
  1751. .my-app .right .card-body button {margin: 0 2px 2px 2px; font-size:1.3rem;}
  1752. .sidebar-right {right:-25rem;}
  1753. .my-app .sidebar-right.sidebar-collapsed {width:18.75rem;}
  1754. .my-app .right .card-header .dropdown-user i {line-height:35px;}
  1755. .select2-selection--single:not([class*=bg-]):not([class*=border-]) {height: 35px; display: flex; align-items: center;}
  1756. .my-app .content .right .header-element-inline {height:auto;}
  1757. .my-app .right .header-element-inline .navbar-nav .w-100, .select2-selection--single {max-width:none; margin:5px 0;}
  1758. .my-app .collapse:not(.show) {display:none;}
  1759. /*.custom-pagination {justify-content: center; width: 100%;}*/
  1760. /*.my-app .table {min-width:1130px;}*/
  1761. }
  1762. @media screen and (min-width:768px) {
  1763. .font-weight-md-normal {
  1764. font-weight: 400!important;
  1765. }
  1766. }
  1767. @media screen and (min-width:1200px) {
  1768. .my-app .sidebar-main.collapse {display:block;}
  1769. }
  1770. @media screen and (max-width:768px) {
  1771. .navbar {
  1772. position: relative;
  1773. display: -ms-flexbox;
  1774. display: flex;
  1775. -ms-flex-wrap: wrap;
  1776. flex-wrap: wrap;
  1777. -ms-flex-align: center;
  1778. align-items: center;
  1779. -ms-flex-pack: justify;
  1780. justify-content: space-between;
  1781. padding: 0 1.25rem
  1782. }
  1783. .navbar>.container,
  1784. .navbar>.container-fluid {
  1785. display: -ms-flexbox;
  1786. display: flex;
  1787. -ms-flex-wrap: wrap;
  1788. flex-wrap: wrap;
  1789. -ms-flex-align: center;
  1790. align-items: center;
  1791. -ms-flex-pack: justify;
  1792. justify-content: space-between
  1793. }
  1794. .navbar-brand {
  1795. display: inline-block;
  1796. padding-top: 1.00002rem;
  1797. padding-bottom: 1.00002rem;
  1798. margin-right: 1.25rem;
  1799. font-size: 0;
  1800. line-height: inherit;
  1801. white-space: nowrap
  1802. }
  1803. .navbar-brand:focus,
  1804. .navbar-brand:hover {
  1805. text-decoration: none
  1806. }
  1807. .navbar-nav {
  1808. display: -ms-flexbox;
  1809. display: flex;
  1810. -ms-flex-direction: column;
  1811. flex-direction: column;
  1812. padding-left: 0;
  1813. margin-bottom: 0;
  1814. list-style: none
  1815. }
  1816. .navbar-nav .nav-link {
  1817. padding-right: 0;
  1818. padding-left: 0
  1819. }
  1820. .navbar-nav .dropdown-menu {
  1821. position: static;
  1822. float: none
  1823. }
  1824. .navbar-text {
  1825. display: inline-block;
  1826. padding-top: .625rem;
  1827. padding-bottom: .625rem
  1828. }
  1829. .navbar-collapse {
  1830. -ms-flex-preferred-size: 100%;
  1831. flex-basis: 100%;
  1832. -ms-flex-positive: 1;
  1833. flex-grow: 1;
  1834. -ms-flex-align: center;
  1835. align-items: center
  1836. }
  1837. .navbar-toggler {
  1838. padding: .875rem 0;
  1839. font-size: .8125rem;
  1840. line-height: 1;
  1841. background-color: transparent;
  1842. border: 1px solid transparent;
  1843. border-radius: 0
  1844. }
  1845. .navbar-toggler:focus,
  1846. .navbar-toggler:hover {
  1847. text-decoration: none
  1848. }
  1849. .navbar-toggler-icon {
  1850. display: inline-block;
  1851. width: 1.5em;
  1852. height: 1.5em;
  1853. vertical-align: middle;
  1854. content: "";
  1855. background: no-repeat center center;
  1856. background-size: 100% 100%
  1857. }
  1858. .my-app .right .card-body > .card > .card-header {
  1859. padding:0.625rem 0.65rem!important
  1860. }
  1861. }
  1862. @media screen and (max-width:767px) {
  1863. }
  1864. @media screen and (max-width:320px) {
  1865. }