mcare.admin.css 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449
  1. @charset "UTF-8";
  2. html, body {
  3. width: 100%;
  4. height: 100%;
  5. }
  6. body {
  7. font-family: 'KoPub Dotum';
  8. font-size: 12px !important;
  9. font-weight: 400;
  10. margin: 0;
  11. padding: 0;
  12. }
  13. .wrap-loading{
  14. z-index: 9999;
  15. position: fixed;
  16. padding: auto;
  17. width: 100%;
  18. height: 100%;
  19. background-color: rgba(0,0,0,0.1);
  20. bottom: 0;
  21. }
  22. .loader {
  23. position: absolute;
  24. top: 50%;
  25. left: 55%;
  26. margin-top: -50px;
  27. margin-left: -50px;
  28. border: 10px solid #f3f3f3;
  29. border-radius: 50%;
  30. border-top: 10px solid #3498db;
  31. width: 50px;
  32. height: 50px;
  33. -webkit-animation: spin 2s linear infinite;
  34. animation: spin 2s linear infinite;
  35. }
  36. @-webkit-keyframes spin {
  37. 0% { -webkit-transform: rotate(0deg); }
  38. 100% { -webkit-transform: rotate(360deg); }
  39. }
  40. @keyframes spin {
  41. 0% { transform: rotate(0deg); }
  42. 100% { transform: rotate(360deg); }
  43. }
  44. div.main-wrapper {
  45. min-width: 960px !important;
  46. margin: 0 auto !important;
  47. padding: 20px;
  48. box-sizing: border-box;
  49. }
  50. input[type="date"]::-webkit-clear-button {
  51. -webkit-appearance: none;
  52. display: none;
  53. }
  54. .input-group .input-group-no-style{
  55. border: none !important;
  56. background-color: transparent !important;
  57. }
  58. div#header table, div.main-wrapper {
  59. min-width: 960px !important;
  60. margin: 0 auto !important;
  61. }
  62. div.main-wrapper #wrapper{
  63. height: 640px;
  64. }
  65. .width100 {
  66. width: 100%;
  67. }
  68. .text-center{
  69. text-align: center !important;
  70. }
  71. .pd0{
  72. padding: 0px !important;
  73. }
  74. .pd5{
  75. padding: 5px !important;
  76. }
  77. .pdr0{
  78. padding-right: 0px !important;
  79. }
  80. .pdl0{
  81. padding-left: 0px !important;
  82. }
  83. .mg0{
  84. margin: 0px !important;
  85. }
  86. .mgb5{
  87. margin-bottom: 5px !important;
  88. }
  89. .mgb10{
  90. margin-bottom: 10px !important;
  91. }
  92. .mgt5{
  93. margin-top: 5px !important;
  94. }
  95. .mgt10{
  96. margin-top: 10px !important;
  97. }
  98. /*----------------------------------------------------------------------------*/
  99. /* header */
  100. /*----------------------------------------------------------------------------*/
  101. div.top {
  102. text-align: center;
  103. margin: 15px auto;
  104. }
  105. .navbar-header-container{
  106. background-color: #f8f8f8;
  107. }
  108. .navbar-header-container .navbar{
  109. margin-bottom: 0px;
  110. border: none !important;
  111. }
  112. .nav > li > a{
  113. color: #767676;
  114. }
  115. .navbar{
  116. margin-bottom: 0px;
  117. }
  118. .title-bar{
  119. padding: 10px 15px;
  120. }
  121. .category {
  122. float: right;
  123. color: #999;
  124. }
  125. .title {
  126. color: #767676;
  127. font-size: 18px;
  128. font-weight: 700
  129. }
  130. /*로그인페이지*/
  131. #loginForm {
  132. width: 100%;
  133. height: 100%;
  134. background-image: url('./../image/admin/admin-background-img.png');
  135. }
  136. #loginForm .form-container {
  137. width: 90%;
  138. height: 280px;
  139. text-align: center;
  140. background-color: #fff;
  141. box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
  142. padding: 2em 0.75em 1.5em 0.75em;
  143. border-radius: 5px;
  144. vertical-align: middle;
  145. position: absolute;
  146. top: 0;
  147. bottom: 0;
  148. left: 0;
  149. right: 0;
  150. /* margin: auto; */
  151. margin-top: 80px;
  152. margin-left: auto;
  153. margin-right: auto;
  154. border: 2px solid #5f8237;
  155. border-radius: 20px;
  156. }
  157. #loginForm .form-container2 {
  158. width: 90%;
  159. height: 140px;
  160. text-align: center;
  161. background-color: #38bbaa;
  162. box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
  163. padding: 1.5em 0.75em 1.5em 0.75em;
  164. border-radius: 5px;
  165. vertical-align: middle;
  166. position: absolute;
  167. top: 0;
  168. bottom: 0;
  169. left: 0;
  170. right: 0;
  171. /* margin: auto; */
  172. margin-top: 370px;
  173. margin-left: auto;
  174. margin-right: auto;
  175. border: 2px solid #5f8237;
  176. border-radius: 20px;
  177. font-weight: bold;
  178. }
  179. #loginForm .line-container {
  180. padding: 1em;
  181. position: relative;
  182. }
  183. #loginForm .line-container .material-icons {
  184. position: absolute;
  185. margin-top: 5px;
  186. left: 0.8em;
  187. font-size: 30px;
  188. color: #444;
  189. }
  190. #loginForm .line-container input[type=text],
  191. #loginForm .line-container input[type=password] {
  192. height: 30px;
  193. width: 77%;
  194. padding-left: 3px;
  195. border: none;
  196. border-bottom: 1px solid #9e9e9e;
  197. border-radius: 0;
  198. outline: none;
  199. font-size: 1.2em;
  200. color: #222;
  201. margin: 0 0 0 1.8em;
  202. box-shadow: none;
  203. -webkit-box-sizing: content-box;
  204. -moz-box-sizing: content-box;
  205. box-sizing: content-box;
  206. }
  207. #loginForm #login_btn{
  208. width: 230px !important;
  209. }
  210. #loginForm #login_btn:focus,
  211. #loginForm #login_btn:active{
  212. border-color: #ccc !important;
  213. }
  214. /*
  215. #loginForm #login_btn {
  216. background-color: #ff8f00;
  217. color: #fff;
  218. border: 0;
  219. width: 230px !important;
  220. height: 40px;
  221. line-height: 40px;
  222. font-size: 18px;
  223. margin: 0 auto !important;
  224. box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0
  225. rgba(0, 0, 0, 0.12);
  226. background-image: url('textures/highlight.png');
  227. background-image: none,
  228. -webkit-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  229. background-image: none,
  230. -moz-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  231. background-image: none, -o-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  232. background-image: none,
  233. linear-gradient(to bottom, #ff8f00 0, #fe761b 100%);
  234. background-position: 50% 50%;
  235. }
  236. #loginForm #login_btn:hover {
  237. box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0
  238. rgba(0, 0, 0, 0.12), 0 2px 30px 0 rgba(0, 0, 0, 0.12);
  239. background-image: url('textures/highlight.png');
  240. background-image: none,
  241. -webkit-linear-gradient(top, #fe761b 0, #e15613 100%);
  242. background-image: none,
  243. -moz-linear-gradient(top, #fe761b 0, #e15613 100%);
  244. background-image: none, -o-linear-gradient(top, #fe761b 0, #e15613 100%);
  245. background-image: none,
  246. linear-gradient(to bottom, #fe761b 0, #e15613 100%);
  247. } */
  248. /* 페이지 레이아웃 */
  249. .main-wrapper .left-content{
  250. height: 640px;
  251. overflow: auto;
  252. padding: 10px;
  253. }
  254. .main-wrapper .left-content-xs{
  255. height: 400px;
  256. overflow: auto;
  257. padding: 10px;
  258. }
  259. .main-wrapper .right-content-xs{
  260. padding: 10px;
  261. border-left: 1px solid lightgrey;
  262. min-height: 400px;
  263. }
  264. .main-wrapper .right-content{
  265. padding: 10px;
  266. border-left: 1px solid lightgrey;
  267. min-height: 640px;
  268. }
  269. .pagination-sm > li > a, .pagination-sm > li > span{
  270. padding: 5px !important;
  271. }
  272. .panel .panel-body{
  273. padding: 10px 10px 0px 10px;
  274. }
  275. .panel-default > .panel-heading a{
  276. color: inherit;
  277. }
  278. .panel .panel-body table{
  279. margin-top: 5px;
  280. }
  281. .radio-padding-box{
  282. padding: 0px 10px !important;
  283. }
  284. .content-title{
  285. padding: 7px 0px 0px 0px !important;
  286. }
  287. .panel .content-box-title{
  288. border-bottom: 1px solid #ddd;
  289. padding: 0px 10px !important;
  290. }
  291. .detail-content-title{
  292. padding: 3px 0px 0px 0px !important;
  293. }
  294. .btn-detail-content{
  295. padding: 0px 0px 4px 0px !important;
  296. }
  297. .table-wrapper-lg{
  298. height: 580px;
  299. overflow: auto;
  300. }
  301. .table-wrapper-md{
  302. height: 530px;
  303. overflow: auto;
  304. }
  305. .table-wrapper-sm{
  306. height: 500px;
  307. overflow: auto;
  308. }
  309. .table-wrapper-xs{
  310. height: 350px;
  311. overflow: auto;
  312. }
  313. .main-wrapper .right-content .row,
  314. .modal .panel .row{
  315. margin-bottom: 10px;
  316. }
  317. .modal-header{
  318. font-size: 15px;
  319. background-color: rgba(229, 229, 229, 0.24);
  320. font-weight: bold;
  321. }
  322. .modal-header .btn-test{
  323. position: absolute;
  324. top: 11px;
  325. }
  326. table{
  327. margin-bottom: 0px !important;
  328. }
  329. table .table-header{
  330. background-color: #eee;
  331. font-weight: 700;
  332. }
  333. .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{
  334. word-break: break-word;
  335. }
  336. .max-width-xs{
  337. width: 80px;
  338. }
  339. .max-width-sm{
  340. width: 120px;
  341. }
  342. .max-width-md{
  343. width: 500px;
  344. }
  345. .radio-inline{
  346. margin-top: 7px !important;
  347. }
  348. input[type="radio"], input[type="checkbox"]{
  349. margin-top: 0px !important;
  350. }
  351. .modal-dialog,
  352. .modal-dialog,
  353. .modal-dialog{
  354. width: 700px;
  355. }
  356. .modal-body .content-table,
  357. .modal-body .content-table,
  358. .modal-body .content-table{
  359. border-right: 1px solid lightgrey;
  360. height: 400px;
  361. overflow: auto;
  362. }
  363. .nav-pagination{
  364. background-color: #eee;
  365. }
  366. .nav-pagination ul{
  367. margin: 5px 0px 0px 0px;
  368. }
  369. #divUserAttr .panel{
  370. padding: 10px 0px 0px 0px !important;
  371. margin: 2px 0px;
  372. }
  373. #divUserAttr .use-attr-order .panel{
  374. background-color: #ffffd9;
  375. border: solid 2px red;
  376. margin: 0px !important;
  377. }
  378. #divUserAttr .panel .user-attr-remove{
  379. border: none;
  380. background-color: transparent;
  381. position: absolute;
  382. right: 15px;
  383. top: 8px;
  384. }
  385. /* 트리 속성 */
  386. ul.fancytree-container, ul.fancytree-container:focus {
  387. border: none !important;
  388. outline: none !important;
  389. }
  390. ul.fancytree-container{
  391. font-size: 12px !important;
  392. }
  393. ul.fancytree-container li{
  394. padding: 3px 0 0 !important;
  395. }
  396. #addItemModal .modal-dialog{
  397. margin-top: 0;
  398. margin-bottom: 0;
  399. height: 90vh;
  400. display: -webkit-box;
  401. display: -webkit-flex;
  402. display: -ms-flexbox;
  403. display: flex;
  404. -webkit-box-orient: vertical;
  405. -webkit-box-direction: normal;
  406. -webkit-flex-direction: column;
  407. -ms-flex-direction: column;
  408. flex-direction: column;
  409. -webkit-box-pack: center;
  410. -webkit-justify-content: center;
  411. -ms-flex-pack: center;
  412. justify-content: center;
  413. }