mcare.admin.css 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625
  1. @charset "UTF-8";
  2. @font-face {
  3. font-family: ngttf;
  4. src: url(font/NanumGothic.ttf);
  5. }
  6. @font-face {
  7. font-family: ngeot;
  8. src: url(font/NanumGothic.eot);
  9. }
  10. @font-face {
  11. font-family: 'KoPub Dotum';
  12. font-style: normal;
  13. font-weight: 300;
  14. src: url('font/KoPubDotumLight-compact.eot');
  15. src: url('font/KoPubDotumLight-compact.eot?#iefix') format('embedded-opentype'),
  16. url('font/KoPubDotumLight-compact.woff') format('woff'),
  17. url('font/KoPubDotumLight-compact.ttf') format('truetype');
  18. }
  19. @font-face {
  20. font-family: 'KoPub Dotum';
  21. font-style: normal;
  22. font-weight: 400;
  23. src: url('font/KoPubDotumMedium-compact.eot');
  24. src: url('font/KoPubDotumMedium-compact.eot?#iefix') format('embedded-opentype'),
  25. url('font/KoPubDotumMedium-compact.woff') format('woff'),
  26. url('font/KoPubDotumMedium-compact.ttf') format('truetype');
  27. }
  28. @font-face {
  29. font-family: 'KoPub Dotum';
  30. font-style: normal;
  31. font-weight: 700;
  32. src: url('font/KoPubDotumBold-compact.eot');
  33. src: url('font/KoPubDotumBold-compact.eot?#iefix') format('embedded-opentype'),
  34. url('font/KoPubDotumBold-compact.woff') format('woff'),
  35. url('font/KoPubDotumBold-compact.ttf') format('truetype');
  36. }
  37. html,body{width: 100%;height: 100%;}
  38. body {
  39. font-family: 'KoPub Dotum';
  40. font-size:14px;
  41. font-weight: 400;
  42. margin: 0;
  43. padding: 0;
  44. }
  45. /*모든 요소 배경 제거*/
  46. .k-header, .k-grid-header{}
  47. div#page {position: relative;
  48. width: 100%;
  49. min-width:960px;
  50. margin: 0 auto;}
  51. div#page .k-header{border: none;
  52. background-image: none;
  53. background-color:transparent;}
  54. div#page .k-header .top{width:100%;
  55. height:60px;
  56. background-color: #f1f1f1}
  57. div#center{}
  58. div#page .menu-wrapper{position: relative;background-color: #fff;
  59. box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}
  60. .menu-wrapper>ul,div.main-wrapper{min-width:960px !important;
  61. margin: 0 auto !important;}
  62. div#header table,.menu-wrapper>ul,div.main-wrapper{min-width:960px !important;
  63. margin: 0 auto !important;}
  64. div.main-wrapper{padding:20px;
  65. box-sizing:border-box}
  66. div.main-wrapper #wrapper{height:640px;}
  67. .right-pane.k-pane.k-scrollable{padding-bottom: 20px;
  68. box-sizing:border-box}
  69. .left-pane.k-pane.k-scrollable>div{padding:15px 10px 0 !important;
  70. box-sizing:border-box}
  71. .right-pane.k-pane.k-scrollable>div,.k-pane.k-scrollable>div{padding:15px 10px 0 !important;
  72. box-sizing:border-box}
  73. .width100{width:100%;}
  74. /*----------------------------------------------------------------------------*/
  75. /* kendo-loading */
  76. /*----------------------------------------------------------------------------*/
  77. .k-loading-color {
  78. background-color: #EAEAEA !important;
  79. }
  80. /*----------------------------------------------------------------------------*/
  81. /* kendo-panelbar */
  82. /*----------------------------------------------------------------------------*/
  83. .k-panelbar>li>.k-link {
  84. font-weight: bold;
  85. }
  86. /*----------------------------------------------------------------------------*/
  87. /* kendo header */
  88. /*----------------------------------------------------------------------------*/
  89. div#page .k-header.title-bar {
  90. border-style: solid;
  91. border-width: 1px;
  92. padding: 10px;
  93. margin-bottom: 15px;
  94. background-image:none;
  95. background-color:#ffecb3 ;
  96. color: #fff;
  97. font-weight: 700;
  98. background-image:none;
  99. }
  100. .k-header span.title {
  101. vertical-align: middle;
  102. }
  103. .k-header .title {
  104. /* padding-left: 2px; */
  105. }
  106. .k-header .category {
  107. float: right;
  108. color: #999;
  109. }
  110. /*----------------------------------------------------------------------------*/
  111. /* kendo treeview */
  112. /*----------------------------------------------------------------------------*/
  113. .k-treeview span.k-in {
  114. cursor: pointer;
  115. }
  116. /*----------------------------------------------------------------------------*/
  117. /* kendo grid */
  118. /*----------------------------------------------------------------------------*/
  119. .k-grid {
  120. /* -moz-border-radius: 10px;
  121. -webkit-border-radius: 10px;
  122. border-radius: 10px;
  123. overflow: hidden; */
  124. }
  125. /*div#grid {
  126. width: 1068px;
  127. white-space: nowrap;
  128. word-wrap: break-word;
  129. margin-bottom: 5px;
  130. }*/
  131. /* div[data-role='grid'].k-grid{margin-bottom:50px;} */
  132. div#grid th.k-header {
  133. text-align: center;
  134. }
  135. /*----------------------------------------------------------------------------*/
  136. /* kendo table */
  137. /*----------------------------------------------------------------------------*/
  138. th.k-header {
  139. /* height: 30px; */
  140. width: 100px;
  141. padding: 3px 0;
  142. text-align: center;
  143. font-weight: normal;
  144. border-width: 1px;
  145. border-style: solid;
  146. }
  147. .k-grid-header .k-header {
  148. text-align: center;
  149. }
  150. .k-tabstrip td.k-content {
  151. height: 30px;
  152. padding: 2px 5px 2px 5px;
  153. border-width: 1px;
  154. border-style: solid;
  155. }
  156. td.k-content {
  157. padding: 2px 5px 2px 5px;
  158. border-width: 1px;
  159. border-style: solid;
  160. }
  161. span.a-tree {
  162. text-decoration: none;
  163. color: inherit;
  164. cursor: pointer;
  165. }
  166. /*----------------------------------------------------------------------------*/
  167. /* kendo button */
  168. /*----------------------------------------------------------------------------*/
  169. .k-button.wid80 {
  170. width: 75px;
  171. }
  172. .k-button.wid100 {
  173. width: 100px;
  174. }
  175. .k-button.crud {
  176. width: 64px;
  177. }
  178. /*----------------------------------------------------------------------------*/
  179. /* kendo textbox */
  180. /*----------------------------------------------------------------------------*/
  181. .k-textbox.wid100 {
  182. width: 100%;
  183. }
  184. /*----------------------------------------------------------------------------*/
  185. /* kendo icon */
  186. /*----------------------------------------------------------------------------*/
  187. .k-sprite {
  188. position: relative;top: 5px;
  189. background-image: url("images/admin/coloricons-sprite.png");
  190. }
  191. .k-sprite.root-folder {
  192. margin-right: 6px;
  193. background-position: 0 0;
  194. }
  195. .k-in .k-sprite.folder {
  196. margin-right: 6px;
  197. background-position: 0 -16px;
  198. }
  199. .k-in .k-sprite.html {
  200. margin-right: 6px;
  201. background-position: 0 -48px;
  202. position: relative;top:2px;
  203. }
  204. .k-in .invisible {
  205. color: #999;
  206. }
  207. .k-sprite.pdf {
  208. margin-right: 6px;
  209. background-position: 0 -32px;
  210. }
  211. .k-sprite.image {
  212. margin-right: 6px;
  213. background-position: 0 -64px;
  214. }
  215. .k-icon.k-i-group {
  216. margin-right: 3px;
  217. }
  218. .k-icon k-i-custom {
  219. margin-right: 6px;
  220. background-position: 0 -48px;
  221. }
  222. .k-treeview .k-plus, .k-treeview .k-plus-disabled{
  223. background-position: -32px -208px;
  224. margin-top: 7px;
  225. }
  226. .k-treeview .k-minus, .k-treeview .k-minus-disabled{
  227. background-position: -32px -225px;
  228. margin-top: 7px;
  229. }
  230. /*----------------------------------------------------------------------------*/
  231. /* chart */
  232. /*----------------------------------------------------------------------------*/
  233. .chart{padding: 20px 0;}
  234. /*----------------------------------------------------------------------------*/
  235. /* chart legend */
  236. /*----------------------------------------------------------------------------*/
  237. .chart_legend{}
  238. .chart_legend ul{
  239. display: inline-block;
  240. padding: 7px 0;
  241. }
  242. .chart_legend li{display: inline-block;
  243. padding-left: 10px;
  244. font-size: 16px;
  245. color: #317eac;
  246. font-weight: 700;
  247. margin-right: 15px;}
  248. .chart_legend li span{
  249. display: inline-block;
  250. width: 12px;
  251. height: 12px;
  252. margin-right:8px;
  253. background-color:#7e7570 !important;
  254. }
  255. /*2016년 8월22일 관리자 화면 스타일 수정 시작*/
  256. .k-webkit.k-webkit52 .k-header{border-color:transparent ;}
  257. .k-menu .k-item, .k-widget.k-menu-horizontal>.k-item{border:none;}
  258. .menu-wrapper,.menu.k-widget.k-reset.k-header.k-menu.k-menu-horizontal{
  259. background-image: -webkit-linear-gradient(#54b4eb, #2fa4e7 60%, #1d9ce5);
  260. background-image: -o-linear-gradient(#54b4eb, #2fa4e7 60%, #1d9ce5);
  261. background-image: -webkit-gradient(linear, left top, left bottom, from(#54b4eb), color-stop(60%, #2fa4e7), to(#1d9ce5));
  262. background-image: linear-gradient(#54b4eb, #2fa4e7 60%, #1d9ce5);
  263. background-repeat: no-repeat;
  264. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff54b4eb', endColorstr='#ff1d9ce5', GradientType=0);
  265. border-bottom: 1px solid #178acc;
  266. -webkit-filter: none;
  267. filter: none;
  268. }
  269. .k-menu .k-item>.k-link{padding:15px;
  270. color: #fff;
  271. text-shadow:0 1px 0 rgba(0, 0, 0, 0.1)}
  272. .k-menu .k-state-hover>.k-state-active{background-color: #178acc;}
  273. .k-state-active,.k-state-active:hover,.k-active-filter {background-color: #178acc;}
  274. .k-menu .k-state-hover>.k-state-active{background-color: #178acc;}
  275. .k-group.k-popup.k-reset{
  276. min-width:160px;
  277. padding: 5px 0;
  278. margin: 2px 0 0;
  279. list-style: none;
  280. font-size: 14px;
  281. text-align: left;
  282. background-color: #ffffff;
  283. border: 1px solid #cccccc;
  284. border: 1px solid rgba(0, 0, 0, 0.15);
  285. border-radius: 4px;
  286. -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  287. box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  288. -webkit-background-clip: padding-box;
  289. background-clip: padding-box;}
  290. .k-filter-help-text, .k-filter-menu .k-widget {margin:0.5em 0;}
  291. .k-group.k-popup.k-reset li a{color: #222 !important;}
  292. .k-menu ul.k-group .k-item{height:auto;margin: 0;}
  293. .k-menu ul.k-group li > a:hover,
  294. .k-menu ul.k-group li >a:focus {
  295. text-decoration: none;
  296. color: #ffffff !important;
  297. background-color: #2fa4e7;
  298. }
  299. .k-header .title{font-weight: 500;
  300. color: #317eac;
  301. margin: 0 0 20px;
  302. padding:6px;
  303. font-size: 18px;
  304. font-weight:700}
  305. .k-header .k-button{ background-image: -webkit-linear-gradient(#54b4eb, #2fa4e7 60%, #1d9ce5);
  306. background-image: -o-linear-gradient(#54b4eb, #2fa4e7 60%, #1d9ce5);
  307. background-image: -webkit-gradient(linear, left top, left bottom, from(#54b4eb), color-stop(60%, #2fa4e7), to(#1d9ce5));
  308. background-image: linear-gradient(#54b4eb, #2fa4e7 60%, #1d9ce5);
  309. background-repeat: no-repeat;
  310. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff54b4eb', endColorstr='#ff1d9ce5', GradientType=0);
  311. -webkit-filter: none;
  312. filter: none;
  313. border: 0;
  314. border-bottom: 1px solid #178acc;
  315. color: #fff;}
  316. .k-button{
  317. background-image: -webkit-linear-gradient(#ffffff, #ffffff 60%, #f5f5f5);
  318. background-image: -o-linear-gradient(#ffffff, #ffffff 60%, #f5f5f5);
  319. background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), color-stop(60%, #ffffff), to(#f5f5f5));
  320. background-image: linear-gradient(#ffffff, #ffffff 60%, #f5f5f5);
  321. background-repeat: no-repeat;
  322. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff5f5f5', GradientType=0);
  323. -webkit-filter: none;
  324. filter: none;
  325. border: 1px solid #e6e6e6;
  326. color: #222;}
  327. .k-treeview .k-in {line-height: 24px;
  328. text-decoration: none;}
  329. .k-treeview .k-in:hover{color: #fff;
  330. background-color: #f0713a;
  331. border-color: #f0713a;}
  332. /* 테이블 스타일 */
  333. .gridContainer *{border-color:transparent !important;}
  334. div#grid .k-grid-header{border-top: 2px solid #ddd !important;}
  335. div#grid th.k-header{padding:10px;
  336. background-color:#eee !important;
  337. color: #222;font-weight: 700;
  338. background-image:none;}
  339. div#grid td.table-cell{padding: 8px;
  340. border-top: 1px solid #ddd !important}
  341. div#grid .k-alt, div#grid .k-separator{background-color: #f9f9f9;}
  342. div#grid .k-grid-content tr:hover{background-color: #c4e2ff;}
  343. .k-grid-header .k-header .k-link{font-weight: bold;}
  344. div#query-row .k-header{background-color: #f5f5f5;
  345. border: none;
  346. background-image: none;}
  347. .edit-view{padding: 0 15px 20px 15px;}
  348. .edit-view>table, .k-content>table{width: 100% !important;margin: 0 auto;}
  349. .edit-view>table th.k-header{height: 30px;}
  350. .notice,h3{color: #b94a48;}
  351. .notice{margin-top: 15px;
  352. line-height: 1.6em;}
  353. .select-bar{margin-bottom:15px;}
  354. .btnWrap{margin-bottom: 15px;}
  355. .inputArea{margin-top: 15px;}
  356. .select-bar select{padding: 4px 0 4px 0;
  357. -webkit-border-radius: 3px;
  358. -moz-border-radius:3px ;
  359. border-radius:3px ;}
  360. .k-toolbar.k-grid-toolbar{background-color: transparent;
  361. background-image:none;}
  362. div#page #tree-data .k-header{background-color: #eee;
  363. background-image:none;
  364. font-weight:700;}
  365. div#page .edit-view .k-header{background-color: #eee;
  366. background-image:none;
  367. font-weight:700;}
  368. /*상단 네비*/
  369. #logBtn{padding:7px 15px 0 15px;border:0;
  370. background-image: url('textures/highlight.png');
  371. background-image: none, -webkit-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  372. background-image: none, -moz-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  373. background-image: none, -o-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  374. background-image: none, linear-gradient(to bottom, #ff8f00 0, #fe761b 100%);
  375. background-position: 50% 50%;
  376. }
  377. #logBtn span{position: relative;
  378. top: -8px;}
  379. #logBtn:hover{padding:7px 15px 0 15px;
  380. box-shadow: 0 2px 10px 0 rgba(0,0,0,0.22);
  381. background-image: url('textures/highlight.png');
  382. background-image: none, -webkit-linear-gradient(top, #fe761b 0, #e15613 100%);
  383. background-image: none, -moz-linear-gradient(top, #fe761b 0, #e15613 100%);
  384. background-image: none, -o-linear-gradient(top, #fe761b 0, #e15613 100%);
  385. background-image: none, linear-gradient(to bottom, #fe761b 0, #e15613 100%);}
  386. .k-menu .k-item, .k-widget.k-menu-horizontal>.k-item{position: relative;
  387. color: #03a9f4 !important;
  388. text-align: center;
  389. border: 0;}
  390. .k-menu .k-item, .k-widget.k-menu-horizontal>.k-item:hover ul.k-group{display: block;}
  391. .k-menu .k-item>.k-link{padding: 0 30px;
  392. height:30px;
  393. padding-top:35px;}
  394. .k-state-hover:hover {background-color: rgba(0,0,0,0.1);
  395. background-image: none;}
  396. .k-state-hover>.k-link{font-weight: 700;}
  397. .k-link .material-icons{display: inline-block;
  398. position: absolute;
  399. width:100%;
  400. top:10px;
  401. left:0}
  402. .k-link span.txt{padding-top: 10px;}
  403. span.txt+span{display: none;}
  404. .k-menu ul.k-group{border: 0;
  405. background-color: #fff;
  406. margin: 0;
  407. max-height: 650px;
  408. overflow-y: auto;
  409. position: absolute;
  410. z-index: 999;
  411. padding:5px 0;
  412. }
  413. .k-menu .k-group .k-item{padding:0 !important;margin: 0 !important;}
  414. .k-menu .k-group .k-link{
  415. min-width: 120px;
  416. text-align: left;
  417. font-size:1em;
  418. font-weight: 400;
  419. height: 22px;
  420. line-height: 22px;
  421. color: #01579b !important;
  422. margin: 0 !important;
  423. }
  424. .k-window-titlebar.k-header{background-color: #00b0ff;}
  425. .k-window-titlebar.k-header .k-window-title{color: #fff;
  426. font-weight: 700;}
  427. .k-button:hover{border: 1px solid #e15613;
  428. color: #fff !important;
  429. background-image: url('textures/highlight.png');
  430. background-image: none, -webkit-linear-gradient(top, #fe761b 0, #e15613 100%);
  431. background-image: none, -moz-linear-gradient(top, #fe761b 0, #e15613 100%);
  432. background-image: none, -o-linear-gradient(top, #fe761b 0, #e15613 100%);
  433. background-image: none, linear-gradient(to bottom, #fe761b 0, #e15613 100%);
  434. background-position: 50% 50%;}
  435. .k-button:hover span{color: #fff !important;}
  436. .inputbox{margin-top:15px;}
  437. /*로그인페이지*/
  438. #loginForm{width: 100%;height: 100%;background-color: #54b4eb;}
  439. #loginForm .formContainer{position: absolute;
  440. left: 50%;
  441. top: 50%;
  442. margin-left: -140px;
  443. margin-top: -200px;
  444. width: 280px;
  445. height:280px;
  446. text-align:center;
  447. background-color: #fff;
  448. box-shadow: 0 16px 28px 0 rgba(0,0,0,0.22),0 25px 55px 0 rgba(0,0,0,0.21);
  449. padding: 2em 0.75em 1.5em 0.75em;}
  450. #loginForm .lineContainer{padding:1em;
  451. position: relative;}
  452. #loginForm .lineContainer .material-icons{position: absolute;
  453. margin-top: 5px;
  454. left:0.8em;
  455. font-size: 30px;
  456. color: #444;}
  457. #loginForm .lineContainer input{
  458. height:30px;
  459. width:77%;
  460. padding-left: 3px;
  461. border: none;
  462. border-bottom: 1px solid #9e9e9e;
  463. border-radius: 0;
  464. outline: none;
  465. font-size: 1.2em;
  466. color: #222;
  467. margin: 0 0 0 1.8em;
  468. box-shadow: none;
  469. -webkit-box-sizing: content-box;
  470. -moz-box-sizing: content-box;
  471. box-sizing: content-box;
  472. }
  473. #loginForm #login_btn{background-color:#ff8f00;
  474. color: #fff;
  475. border: 0;
  476. width: 230px !important;
  477. height: 40px;
  478. line-height: 40px;
  479. font-size: 18px;
  480. margin: 0 auto !important;
  481. box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
  482. background-image: url('textures/highlight.png');
  483. background-image: none, -webkit-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  484. background-image: none, -moz-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  485. background-image: none, -o-linear-gradient(top, #ff8f00 0, #fe761b 100%);
  486. background-image: none, linear-gradient(to bottom, #ff8f00 0, #fe761b 100%);
  487. background-position: 50% 50%;}
  488. #loginForm #login_btn:hover{box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12),0 2px 30px 0 rgba(0,0,0,0.12);
  489. background-image: url('textures/highlight.png');
  490. background-image: none, -webkit-linear-gradient(top, #fe761b 0, #e15613 100%);
  491. background-image: none, -moz-linear-gradient(top, #fe761b 0, #e15613 100%);
  492. background-image: none, -o-linear-gradient(top, #fe761b 0, #e15613 100%);
  493. background-image: none, linear-gradient(to bottom, #fe761b 0, #e15613 100%);}
  494. /* 사용자속성관리, 추가속성관리 팝업 내 dropdown 사이즈 따로 지정 */
  495. #pop-select-hospital-list,
  496. #pop-select-duty-list,
  497. #pop-select-work-list,
  498. #pop-select-user-list
  499. {
  500. min-width: 100px;
  501. }
  502. .pop-select-bar .k-header{
  503. background-color: #fff;
  504. }