sfdoc-style.css 52 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545
  1. /* ui-form
  2. -----------------------------------------------------------------------------*/
  3. .input-group, .input-group *, .input-group-checkbox, .input-group-radio, .input-group-checkbox *, .input-group-radio * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
  4. .input-group { border-collapse: separate; display: table; position: relative; }
  5. .input-group label { display: block; }
  6. .input-group-addon { background-color: #fff; border: 1px solid #e1e1e1; border-radius: 4px; border-bottom-right-radius: 0; border-top-right-radius: 0; color: #333; font-size: 14px; font-weight: 400; line-height: 1; padding: 10px; text-align: center; display: table-cell; vertical-align: middle; white-space: nowrap; width: 1%; }
  7. .input-group-addon:first-child { border-right: 0; }
  8. .input-group-addon .iconfont { color: #b4b4b4; font-size: 18px; }
  9. .input-group-addon.focus .iconfont { color: #37a6ed; }
  10. .input-group-btn { position: absolute; right: 5px; top: 7px; }
  11. .input-group-btn .c-btn { padding: 5px; border: #ddd 1px solid; }
  12. .input-group .form-control, .input-group .form-select, .input-group .form-textarea { -webkit-appearance: none; appearance: none; background-color: #fff; background-image: none; border: 1px solid #e1e1e1; border-radius: 5px; color: #333; display: block; font-size: 14px; height: 45px; line-height: 1.42857; padding: 6px 12px; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s; outline: 0; }
  13. .input-group .form-select-arrow { display: block; width: 10px; height: 10px; border: solid #ccc; border-width: 2px 2px 0 0; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); position: absolute; top: 15px; right: 15px; }
  14. .input-group .form-control {padding-right:30px;}
  15. .input-group.input-border .form-control, .input-group.input-border .form-select, .input-group.input-border .form-textarea { border-radius: 0px; border-right: 0; font-size: 15px; height: 45px; line-height: 1.52857; }
  16. .input-group .form-control:focus, .input-group .form-select:focus, .input-group .form-textarea:focus { color: #333; }
  17. .input-group .form-control::-webkit-input-placeholder, .input-group .form-textarea::-webkit-input-placeholder {
  18. color: #bfbfbf;
  19. }
  20. .input-group .form-control:-moz-placeholder, .input-group .form-textarea:-moz-placeholder {
  21. color: #bfbfbf;
  22. }
  23. .input-group .form-control::-moz-placeholder, .input-group .form-textarea::-moz-placeholder {
  24. color: #bfbfbf;
  25. }
  26. .input-group .form-control:-ms-input-placeholder, .input-group .form-textarea:-ms-input-placeholder {
  27. color: #bfbfbf;
  28. }
  29. .input-group .form-textarea { height: auto; resize: none; margin: 0; }
  30. .input-group .form-control:nth-child(2), .input-group .form-textarea:nth-child(2) { border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 0; padding-left: 0; }
  31. .input-group .form-control, .input-group label .form-control, .input-group label .form-select, .input-group label .form-textarea { border-radius: 4px; padding-left: 12px; border-left: 1px #e1e1e1 solid; }
  32. .input-group .input-group-addon + .form-control, .input-group .input-group-addon + .form-select { border-top-left-radius: 0px; border-bottom-left-radius: 0px; padding-left: 0px; border-left: 0px; }
  33. .input-group-text { font-size: 14px; color: #555; }
  34. .input-merge .input-group .input-group-addon, .input-group.input-border .input-group-addon { border-bottom-left-radius: 0; border-top-left-radius: 0; }
  35. .input-group.input-border .input-group-addon { border-left: 0; font-size: 15px; color: #333; padding: 10px 20px; }
  36. .input-merge .input-group .form-control, .input-merge .input-group .form-select, .input-merge .input-group .form-textarea { border-bottom-right-radius: 0; border-top-right-radius: 0; }
  37. .input-merge .input-group:first-child .input-group-addon { border-top-left-radius: 4px; }
  38. .input-merge .input-group:first-child .form-control, .input-merge .input-group:first-child .form-select, .input-merge .input-group:first-child .form-textarea { border-top-right-radius: 4px; }
  39. .input-merge .input-group:last-child .form-control, .input-merge .input-group:last-child .form-select, .input-merge .input-group:last-child .form-textarea { border-bottom-right-radius: 4px; }
  40. .input-merge .input-group:last-child .input-group-addon { border-bottom-left-radius: 4px; }
  41. .input-merge .input-group.input-border .input-group-addon, .input-merge .input-group.input-border .form-control, .input-merge .input-group.input-border .form-select, .input-merge .input-group.input-border .form-textarea, .input-merge .input-group.input-border .form-control, .input-merge .input-group.input-border .form-select, .input-merge .input-group.input-border .form-textarea, .input-merge .input-group.input-border .input-group-addon { border-radius: 0px; }
  42. .input-merge .input-group.input-border { padding-left: 20px; }
  43. .input-merge .input-group.input-border .input-group-addon { padding-left: 0 }
  44. .input-merge .input-group .input-group-addon, .input-merge .input-group .form-control, .input-merge .input-group .form-select, .input-merge .input-group .form-textarea { border-bottom: 0; }
  45. .input-merge .input-group:last-child .input-group-addon, .input-merge .input-group:last-child .form-control, .input-merge .input-group:last-child .form-select, .input-merge .input-group:last-child .form-textarea { border-bottom: 1px solid #e1e1e1; }
  46. .input-merge.input-merge-border .input-group:first-child .input-group-addon, .input-merge.input-merge-border .input-group:first-child .form-control, .input-merge.input-merge-border .input-group:first-child .form-select, .input-merge.input-merge-border .input-group:first-child .form-textarea { border-top: 0; }
  47. .input-merge.input-merge-border .input-group:last-child .input-group-addon, .input-merge.input-merge-border .input-group:last-child .form-control, .input-merge.input-merge-border .input-group:last-child .form-select, .input-merge.input-merge-border .input-group:last-child .form-textarea { border-bottom: 0; }
  48. .input-merge.input-merge-border { border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; background: #fff; }
  49. .input-group-addon-disabled, .form-control[disabled], .form-control:disabled, .form-textarea[disabled], .form-textarea:disabled, .form-textarea[disabled], .form-textarea:disabled, .form-select[disabled], .form-select:disabled { background-color: #f9f9f9; }
  50. .input-group .form-input { height: 45px; border-top: 1px solid #e1e1e1; position: relative; padding: 7px 0; }
  51. .input-group .form-input-text { color: #909090; font-size: 15px; }
  52. .input-group .form-select-box { display: inline-block; position: relative; margin-right: 10px; }
  53. .input-group .form-select-box .form-select { width: 100%; }
  54. .input-group .form-select-box .form-select-arrow { top: 7px; right: 12px }
  55. .input-group.input-border .form-input .form-control, .input-group.input-border .form-input .form-select { height: 31px; border: #e1e1e1 1px solid !important; border-radius: 2px; display: inline-block; vertical-align: baseline; line-height: 1.2; }
  56. .input-group .input-clear { position: absolute; right: 8px; top: 8px; background: #ccc; border-radius: 50%; width: 26px; height: 26px; text-align: center; }
  57. .input-group .input-clear .close { position: relative; display: inline-block; width: 15px; height: 15px; overflow: hidden; top: 6px; }
  58. .input-group .input-clear .close::before, .input-group .input-clear .close::after { content: ''; position: absolute; height: 2px; width: 100%; top: 50%; left: 0px; margin-top: -1px; background: #fff; border-radius: 6px; }
  59. .input-group .input-clear .close::before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
  60. .input-group .input-clear .close::after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
  61. .input-group-checkbox, .input-group-radio { display: inline-block; position: relative; font-size: 14px; color: #909090; }
  62. .input-group-checkbox label { display: block; cursor: pointer; }
  63. .input-group-checkbox label input[type="checkbox"], .input-group-radio label input[type="radio"] { position: absolute; opacity: 0; width: 1px; height: 1px; }
  64. .input-group-checkbox .input-group-pack, .input-group-radio .input-group-pack { width: 20px; height: 20px; background-color: #ffffff; border: 1px #d3d3d3 solid; padding: 0; margin: 0 5px 0 0; position: relative; display: inline-block; vertical-align: middle; border-radius: 5px; overflow: hidden; top: -2px; }
  65. .input-group-radio .input-group-pack { border-radius: 50%; }
  66. .input-group-checkbox .input-group-pack.input-group-pack-disabled, .input-group-radio .input-group-pack.input-group-pack-disabled { background-color: #f0f0f0; }
  67. .input-group-checkbox .input-group-pack .tick { display: block; width: 12px; height: 2px; background: #4dcd70; margin: 8px 0 0 6px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); position: relative; top: 50px; }
  68. .input-group-checkbox .input-group-pack .tick:after { content: ''; width: 8px; height: 2px; background: #4dcd70; position: absolute; top: -3px; left: -5px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }
  69. .input-group-radio .input-group-pack .disc { display: block; content: "" !important; width: 0px; height: 0px; border-radius: 50%; background-color: #4dcd70; margin: 4px; }
  70. .input-group-checkbox input[type="checkbox"]:checked ~ .tick, .input-group-checkbox .input-group-pack.checked .tick { top: 0px; }
  71. .input-group-radio input[type="radio"]:checked ~ .disc, .input-group-radio .input-group-pack.checked .disc { width: 10px; height: 10px; }
  72. .input-group-switch { position: relative; font-size: 16px; width: 52px; height: 32px; line-height: 1em; }
  73. .input-group-switch input { width: 52px; height: 32px; position: absolute; z-index: 10; border: none; background: none; -webkit-appearance: none; outline: none; }
  74. .input-group-switch input:before { content: ''; width: 50px; height: 30px; border: 1px solid #e5e5e5; background-color: #fff; border-radius: 20px; cursor: pointer; display: inline-block; position: relative; vertical-align: middle; -webkit-user-select: none; user-select: none; -webkit-box-sizing: content-box; box-sizing: content-box; border-color: #dfdfdf; -webkit-box-shadow: #dfdfdf 0px 0px 0px 0px inset; box-shadow: #dfdfdf 0px 0px 0px 0px inset; -webkit-transition: border 0.4s, -webkit-box-shadow 0.4s; transition: border 0.4s, box-shadow 0.4s; -webkit-background-clip: content-box; background-clip: content-box; }
  75. .input-group-switch input:checked:before { border-color: #4cd964; -webkit-box-shadow: #4cd964 0px 0px 0px 16px inset; box-shadow: #4cd964 0px 0px 0px 16px inset; background-color: #4cd964; transition: border 0.4s, box-shadow 0.4s, background-color 1.2s; -webkit-transition: border 0.4s, -webkit-box-shadow 0.4s, background-color 1.2s; background-color: #4cd964; }
  76. .input-group-switch input:checked:after { left: 21px; }
  77. .input-group-switch input:after { content: ''; width: 30px; height: 30px; position: absolute; top: 1px; left: 0; border-radius: 100%; background-color: #fff; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); -webkit-transition: left 0.2s; transition: left 0.2s; }
  78. .input-group-switch input.thread:before { content: ''; width: 50px; height: 3px; border: 1px solid #e5e5e5; background-color: #e5e7ea; border-radius: 20px; cursor: pointer; display: inline-block; position: relative; vertical-align: middle; -webkit-user-select: none; user-select: none; -webkit-box-sizing: content-box; box-sizing: content-box; border-color: #dfdfdf; -webkit-box-shadow: #dfdfdf 0px 0px 0px 0px inset; box-shadow: #dfdfdf 0px 0px 0px 0px inset; -webkit-transition: border 0.4s, -webkit-box-shadow 0.4s; transition: border 0.4s, box-shadow 0.4s; -webkit-background-clip: content-box; background-clip: content-box; }
  79. .input-group-switch input.thread:checked:before { border-color: #4cd964; -webkit-box-shadow: #4cd964 0px 0px 0px 16px inset; box-shadow: #4cd964 0px 0px 0px 16px inset; background-color: #4cd964; transition: border 0.4s, box-shadow 0.4s, background-color 1.2s; -webkit-transition: border 0.4s, -webkit-box-shadow 0.4s, background-color 1.2s; background-color: #4cd964; }
  80. .input-group-switch input.thread:checked:after { left: 33px; }
  81. .input-group-switch input.thread:after { content: ''; width: 20px; height: 20px; position: absolute; top: 3px; left: 0; border-radius: 100%; background-color: #fff; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); -webkit-transition: left 0.2s; transition: left 0.2s; }
  82. /* css c-list
  83. -----------------------------------------------------------------------------*/
  84. .list-icon { height: 8px; width: 8px; position: relative; display: inline-block; }
  85. .arrow-right { display: block; width: 8px; height: 8px; border: solid #cdcdcd; border-width: 2px 2px 0 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
  86. .c-list-group { }
  87. .c-list-group h3 { padding: 6px 15px; background-color: #f9f9f9; font-size: 13px; color: #5b5b5b; margin: 0; vertical-align: middle; }
  88. .c-list { background-color: #fff; }
  89. .c-list > li, .c-list > .c-list-div { font-size: 14px; color: #333; position: relative; display: -webkit-box; display: box; margin-left: 10px; border-top: 1px solid #f1f1f1; }
  90. .c-list > .c-list-text { line-height: 20px; padding: 12px 10px 12px 0; }
  91. .c-list > .c-list-function { border-top: none; }
  92. .c-list > .c-list-function .c-list-info { border-top: 1px solid #f1f1f1; }
  93. .c-list > li:first-child, .c-list > .c-border-t:first-child, .c-list >li:first-child .c-border-t, .c-list > .c-list-function:first-child, .c-list > .c-list-function:first-child .c-list-info, .c-list > div:first-child .c-border-t, .c-list > div:first-child { border: 0; background-image: none }
  94. .c-list > .c-list-cover { padding-left: 15px !important; margin-left: 0 !important; }
  95. .c-list .c-list-info { -webkit-box-flex: 1; box-flex: 1; padding-right: 15px; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; }
  96. .c-list h4 { color: #333 !important; }
  97. .c-list .c-list-info > h4 { font-size: 15px; line-height: 20px }
  98. .c-list .c-list-info > p { font-size: 13px; line-height: 20px; color: #909090; }
  99. .c-list .c-list-label { font-size: 13px !important; color: #909090 !important; padding: 10px 15px 10px 0!important; border-top: 1px dashed #e1e1e1 !important; }
  100. .c-list .c-list-key { margin-right: 15px; }
  101. .c-list .c-list-img { width: 100px; height: 68px; margin: 10px 10px 10px 0; position: relative }
  102. .c-list .c-list-img img { width: auto; height: 68px; }
  103. .c-list > .c-list-link:active { background-color: #e5e6e7; padding-left: 10px; margin-left: 0 }
  104. .c-list-link:active, .c-list-link.c-border-t:active, .c-list-link:active + .c-border-t, .c-list-link:active + .c-border-t { background-image: none; border-top-color: #e5e6e7 }
  105. .c-list .c-list-value { color: #909090; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; }
  106. .c-list .c-list-title { }
  107. .c-list .c-list-link .c-list-value, .c-list .c-list-link .c-list-title { padding-right: 20px; }
  108. .c-list .c-list-badge, .c-list .c-list-action { font-size: 13px; color: #909090; position: absolute; height: 100%; right: 15px; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; top: 0; }
  109. .c-list-link .c-list-badge, .c-list-link .c-list-action { right: 25px }
  110. .c-list-link .list-icon { position: absolute; right: 12px; top: 50%; margin-top: -10px; }
  111. .c-list .c-avatar-s, .c-list .c-avatar-m, .c-list .c-avatar-l { margin: 12px 10px 12px 0; overflow: hidden; display: -webkit-box; -webkit-box-pack: center; -webkit-box-align: center; }
  112. .c-list-indent-s { padding-right: 70px !important; }
  113. .c-list-indent-m { padding-right: 110px !important; }
  114. .c-list-action .input-group-checkbox .input-group-pack, .c-list-action .input-group-radio .input-group-pack { margin: 0 0 0 5px; }
  115. .c-avatar-s { width: 26px; height: 26px; }
  116. .c-avatar-m { width: 40px; height: 40px; }
  117. .c-avatar-l { width: 54px; height: 54px; }
  118. .c-avatar-s img, .c-avatar-m img, .c-avatar-l img { width: 100%; height: 100%; }
  119. .c-list-text .c-t-right { color: #909090 !important; }
  120. .c-list-text .c-t-right { padding-right: 0px; color: #909090; }
  121. .c-list-link .c-t-right { padding-right: 20px !important; }
  122. /* css c-lab1
  123. -----------------------------------------------------------------------------*/
  124. .c-lab-les { display: -webkit-box; display: box; border: 1px solid #37a6eb; overflow: hidden; }
  125. .c-lab-les li { -webkit-box-flex: 1; box-flex: 1; height: 30px; line-height: 30px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; text-align: center; border-left: 1px solid #37a6eb; }
  126. .c-lab-les li:first-child { border-left: none; }
  127. .c-lab-les li a { display: block; width: 100%; height: 30px; color: #37a6eb; }
  128. .c-lab-les li.hit { background-color: #37a6eb; }
  129. .c-lab-les li.hit a { color: #fff; }
  130. /* css search
  131. -----------------------------------------------------------------------------*/
  132. .c-ser-hold { width: 100%; height: 43px; background-color: #fff; padding: 8px 10px 0 10px; }
  133. .c-ser-into { background: #f2f2f2; height: 28px; line-height: 28px; border-radius: 5px; color: #ccc; padding:0 8px;}
  134. .c-serdet { display: -webkit-box; display: box; padding: 7px 10px 0 10px; }
  135. .ser-icon { position: relative; display: inline-block; width: 13px; height: 13px; font-size: 1px; background: none; top:1px;}
  136. .ser-icon:before, .ser-icon:after { content: ""; position: absolute; left: 0; background: transparent; font-size: 1px; }
  137. .ser-icon-search:before { left: 1px; top: 1px; width: 9px; height: 9px; border: 1px solid #8e8e93; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; }
  138. .ser-icon-search:after { left: 9px; top: 11px; width: 5px; height: 1px; background: #8e8e93; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); }
  139. .c-ser-back { width: 20px; -webkit-box-flex: 0; box-flex: 0; overflow: hidden; }
  140. .c-ser-back .si-right { display: block; width: 12px; height: 12px; border: solid #a3a3a7; border-width: 0 0 2px 2px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); margin: 8px 0 0 2px; float: left; }
  141. .c-ser-main { -webkit-box-flex: 1; box-flex: 1; background: #f2f2f2; height: 28px; line-height: 28px; border-radius: 5px; font-size: 15px; color: #8e8e93; position: relative; padding-left: 25px; overflow: hidden; }
  142. .c-ser-main i { position: absolute; left: 7px; top: 1px; }
  143. .c-ser-input { width: 100%; background: #f2f2f2; height: 22px; line-height: 22px; border: none; color: #333; border-radius: 5px; padding: 3px 0; }
  144. .c-ser-btn { margin-left: 10px; -webkit-box-flex: 0; box-flex: 0; }
  145. .c-ser-btn a { display: block; height: 30px; line-height: 30px; padding: 0 10px; background: #3aa7ed; color: #fff; font-size: 14px; border-radius: 4px; }
  146. .c-ser-canc { margin-left: 10px; -webkit-box-flex: 0; box-flex: 0; }
  147. .c-ser-canc a { display: block; height: 30px; line-height: 30px; padding: 0 5px; }
  148. .c-ser-main .input-clear { position: absolute; right: 6px; top: 6px; background: #7e7e7e; border-radius: 50%; width: 16px; height: 16px; text-align: center; }
  149. .c-ser-main .input-clear .close { position: relative; display: inline-block; width: 10px; height: 10px; overflow: hidden; top: -7px; }
  150. .c-ser-main .input-clear .close::before, .c-ser-main .input-clear .close::after { content: ''; position: absolute; height: 2px; width: 100%; top: 50%; left: 0px; margin-top: -1px; background: #fff; border-radius: 6px; }
  151. .c-ser-main .input-clear .close::before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
  152. .c-ser-main .input-clear .close::after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
  153. /* css c-lab2
  154. -----------------------------------------------------------------------------*/
  155. .c-lab-mor { display: -webkit-box; display: box; overflow: hidden; background: #fff; }
  156. .c-lab-mor li { -webkit-box-flex: 1; box-flex: 1; height: 40px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; text-align: center; padding-top: 6px; border-bottom: 1px solid #e1e1e1; }
  157. .c-lab-mor li:first-child { border-left: none; }
  158. .c-lab-mor li a { display: block; width: 100%; height: 28px; line-height: 28px; color: #333; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; border-left: 1px solid #f2f2f2; }
  159. .c-lab-mor li:first-child a { border-left: none; }
  160. .c-lab-mor li.curr { border-bottom: 3px solid #17b3ec; }
  161. .c-lab-mor li.curr a { color: #17b3ec;}
  162. /* buttons color
  163. -----------------------------------------------------------------------------*/
  164. .c-btn-4dcd70 { background-color: #4dcd70; }
  165. .c-btn-4dcd70:hover { background-color: #45b865; }
  166. .c-btn-ff3 { background-color: #ffffff; color: #ff3b2d; border: #e1e1e1 1px solid; }
  167. .c-btn-ff3:hover { background-color: #e5e5e5; }
  168. .c-btn-37a6ec { background-color: #37a6ec; }
  169. .c-btn-37a6ec:hover { background-color: #3195d4; }
  170. /* css getmore
  171. -----------------------------------------------------------------------------*/
  172. .c-get-more { width: 100%; }
  173. .c-get-more a { display: block; text-align: center; line-height: 40px; font-size: 14px; color: #909090; }
  174. .c-get-more a.blue { color: #007cd9; }
  175. /* css c-lab2
  176. -----------------------------------------------------------------------------*/
  177. .c-lab-mor { display: -webkit-box; display: box; overflow: hidden; background: #fff; }
  178. .c-lab-mor li { -webkit-box-flex: 1; box-flex: 1; height: 40px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; text-align: center; padding-top: 6px; border-bottom: 1px solid #e1e1e1; }
  179. .c-lab-mor li:first-child { border-left: none; }
  180. .c-lab-mor li a { display: block; width: 100%; height: 28px; line-height: 28px; color: #333; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; border-left: 1px solid #ddd; }
  181. .c-lab-mor li:first-child a { border-left: none; }
  182. .c-lab-mor li.hit { border-bottom: 3px solid #37a6eb; }
  183. .c-lab-mor li.hit a { color: #37a6eb; }
  184. /* css3-Grid
  185. -----------------------------------------------------------------------------*/
  186. .ui-grid { display: -webkit-box; display: box; }
  187. .ui-grid-middle { -webkit-box-pack: center; -webkit-box-align: center; box-pack: center; box-align: center; }
  188. .ui-grid-vertical { -webkit-box-orient: vertical; box-orient: vertical; }
  189. .ui-grid-label { -webkit-box-flex: 0; box-flex: 0; width: 100px; font-weight: 600; }
  190. .ui-col-0 { -webkit-box-flex: 0; box-flex: 0; }
  191. .ui-col-1 { -webkit-box-flex: 1; box-flex: 1; }
  192. .ui-col-2 { -webkit-box-flex: 2; box-flex: 2; }
  193. .ui-col-3 { -webkit-box-flex: 3; box-flex: 3; }
  194. .ui-col-4 { -webkit-box-flex: 4; box-flex: 3; }
  195. .ui-col-5 { -webkit-box-flex: 5; box-flex: 5; }
  196. .ui-col-6 { -webkit-box-flex: 6; box-flex: 6; }
  197. body{ background-color:#f3f3f3; color:#333; font-size:14px;}
  198. .m10 { margin: 10px;}
  199. .c-f11 { font-size: 11px;}
  200. .bor-t-f2{ border-top:1px solid #f2f2f2;}
  201. .bor-b-f2{ border-bottom:1px solid #f2f2f2;}
  202. .bor-tb-f2{ border-top:1px solid #f2f2f2; border-bottom:1px solid #f2f2f2;}
  203. .lih25{ line-height:25px;}
  204. .lih32{ line-height:32px;}
  205. .lih35{ line-height:35px;}
  206. .h40{ height:40px;}
  207. .h43{ height:43px;}
  208. .h50{ height:50px;}
  209. .h55{ height:55px;}
  210. .mb2{ margin-bottom:2px;}
  211. .mb30 { margin-bottom: 30px;}
  212. .ml35 { margin-left: 35px;}
  213. .c-17b3ec{ color:#17b3ec;}
  214. .c-ccc{ color:#ccc;}
  215. .c-06f { color: #06f;}
  216. .c-f10{ font-size:10px;}
  217. .c-ff8100 { color: #ff8100;}
  218. .c-0066ff { color: #0066ff;}
  219. .c-5FA413 { color: #5FA413;}
  220. .c-case-btn { height: 40px; line-height: 40px; text-align: center; border-radius: 5px; display: block;}
  221. /* 病程 */
  222. .case-top{ position:relative; padding:12px 0;}
  223. .case-top .cimg{ position:absolute; left:10px; top:50%; margin-top:-20px;}
  224. .case-top .cimg img{ width:40px; height:40px;}
  225. .case-top .cmess{ padding-left:60px; padding-right:45px; min-height:40px; display:box; display:-webkit-box; -webkit-box-orient:vertical; -webkit-box-pack:center; line-height:1.4;}
  226. .case-top .zdgz{ right:-76px; top:-1px; height:20px; line-height:20px; background-color:#ccc; border-radius:3px; font-size:12px; color:#fff; padding:0 3px;}
  227. .case-top .zdgz .icon-yonghu{ font-size:14px; margin-right:3px;}
  228. .case-top .cmess .checked{ background-color:#ff8100;}
  229. .case-top .icon-dianhua{ position:absolute; right:15px; top:50%; margin-top:-25px; font-size:34px; color:#17b3ec;}
  230. .case-list{ display:block;}
  231. .case-list li{ padding:8px 10px 10px 30px; line-height:20px; position:relative;}
  232. .case-list-img img{ width:79px; height:79px; margin:10px 10px 0 0;}
  233. .case-bar{ position:absolute; left:17px; top:0; width:2px; height:100%; background:#d7e0df;}
  234. .case-bar:before{ content:''; display:block; width:13px; height:13px; background:#fff; border:2px solid #d7e0df; position:absolute; left:-8px; top:9px; border-radius:50%;}
  235. .case-bar:after{ content:''; display:block; width:7px; height:7px; background:#d7e0df; position:absolute; left:-3px; top:14px; border-radius:50%;}
  236. .case-bar.no-line { height: 66%;}
  237. /* 病历 */
  238. .case-lab{ width:100%; height:40px; background-color:#fff;}
  239. .case-lab li{ position:relative;}
  240. .case-lab .hasmess{ display:block; width:10px; height:10px; background-color:#f30; border-radius:50%; position:absolute; left:50%; margin-left:17px; top:8px;}
  241. .labfixed{ position:fixed; left:0; top:0; z-index:600;}
  242. .case-more{ display:block; text-align:center; line-height:35px; background-color:#fff;}
  243. .case-chief{ background:#fff;}
  244. .chief-tit{ line-height:30px; padding-top:6px; padding-right:10px;}
  245. .chief-texa{ position:relative; padding-bottom:20px; background-color:#f2f2f2; border-radius:3px; margin-right:10px;}
  246. .chief-texa textarea{ width:100%; height:110px; border:none; background-color:#f2f2f2; border-radius:3px; padding:5px 10px;}
  247. .chief-texa-num{ position:absolute; right:17px; bottom:7px; font-size:13px; color:#909090;}
  248. .case-edit{ background:#fff; text-align:center; padding:7px 10px;}
  249. .case-edit a{ display:block; width:100%; height:40px; line-height:40px; color:#fff; background-color:#17b3ec; border:1px solid #17b3ec; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; border-radius:4px;}
  250. .editin a{ width:48%; float:right; border-left:1px solid #f2f2f2;}
  251. .editin a:first-child{ border-left:none; background-color:#fff; border:1px solid #f2f2f2; color:#333; float:left;}
  252. .cor-black{ color:#333 !important;}
  253. .case-complaint > li{ border-top:none;}
  254. /* 患者管理 */
  255. .case-top .icon-more{ position:absolute; right:10px; top:50%; margin-top:-15px; font-size:20px; color:#17b3ec;}
  256. .case-top .icon { position:absolute; right:10px; top:50%; margin-top:-15px; font-size:20px;}
  257. .more-detail{ width:110px; background:#fff; position:absolute; right:10px; top:50%; margin-top:20px; z-index:700; padding:5px 0; border-radius:5px; display:none;}
  258. .more-detail li{ display:block; width:100%; line-height:30px;}
  259. .more-detail li a{ display:block; width:100%; height:100%; color:#333;}
  260. .more-detail li i{ display:inline-block; vertical-align:middle; margin:0px 10px 3px 10px;}
  261. .more-detail .morejt{ display:inline-block; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 7px; border-bottom-color: #fff; border-bottom-style: solid; position:absolute; right:6px; top:-13px;}
  262. .moremb{ width:100%; height:100%; position:fixed; left:0; top:0; z-index:650; background:rgba(0,0,0,.1); display:none;}
  263. .mang-logs{ padding-left:45px; line-height:30px; position:relative;}
  264. .mang-logs a{ color:#007cd9;}
  265. .mang-logs .tb-secretary{ display:block; position:absolute; width:27px; height:30px; background:url(../images/secretary.png) no-repeat; background-size:100% 100%; left:10px; bottom:0px;}
  266. .c-ser-hold .icon-search{ font-size:14px;}
  267. .mang-member .zdgz{ display:inline-block; width:18px; height:18px; line-height:18px; background-color:#ff8100; border-radius:4px; text-align:center;}
  268. .mang-member .zdgz i{ font-size:14px;}
  269. .mang-member .c-t-right{ padding-right:0px !important;}
  270. .mang-member .c-list-info{ padding-right:110px;}
  271. .member-list .c-t-right{ padding-right:0px !important;}
  272. .member-sel{ background-color:#fff; line-height:40px;}
  273. .member-sel:before { content:''; width:3px; height: 41px; background: #17b3ec; position: absolute; left: 0;}
  274. .member-sel .arrow-top{ margin-top:12px; transition:all .3s ease; -webkit-transition:all .3s ease;}
  275. .member-sel .ahide{ -webkit-transform: rotate(175deg); -moz-transform: rotate(175deg); -ms-transform: rotate(175deg); -o-transform: rotate(175deg); transform: rotate(175deg); margin-top:18px;}
  276. .mang-bot{ width:100%; height:50px; background-color:#fff;}
  277. .mang-bot > div{ display:block; width:50%; line-height:50px; float:left; text-align:center; position:relative; z-index:600;}
  278. .mang-bot li.curr{ color:#17b3ec;}
  279. .arrow-top{ display:inline-block; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 5px; border-bottom-color: #ccc; border-bottom-style: solid; vertical-align:middle; margin:0 0 8px 5px;}
  280. .arrow-down { display:inline-block; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 5px; border-bottom-color: #ccc; border-bottom-style: solid; vertical-align:middle; -webkit-transform: rotate(175deg); -ms-transform: rotate(175deg); transform: rotate(175deg);}
  281. .arrow-d { display: block; width: 8px; height: 8px; border: solid #cdcdcd; border-width: 2px 2px 0 0; -webkit-transform: rotate(4135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); }
  282. .mang-bot li.curr .arrow-top{ border-bottom-color: #17b3ec;}
  283. /* 搜索 */
  284. .h43 .c-ser-hold{ position:fixed; left:0; top:0; z-index:600;}
  285. .result-his{ display:block;}
  286. .result-his li{ line-height:45px; background:#fff; border-top:1px solid #f2f2f2; padding-left:10px;}
  287. .result-his li:first-child{ border-top:none;}
  288. .hisdel{ display:block; width:35px; height:45px; text-align:right; padding-right:10px;}
  289. .delall{ display:block; text-align:center; line-height:30px; padding:5px 0;}
  290. .ser-nomess{ text-align:center; padding-top:50px;}
  291. .ser-nomess .icon-lishisousuo{ font-size:50px;}
  292. .botpop{ position:fixed; left:0; bottom:0; width:100%; z-index:700; -webkit-animation:choopop .2s ease; animation:choopop .2s ease; display:none;}
  293. @-webkit-keyframes choopop{
  294. 0%{ bottom:-200px;}
  295. 100%{ bottom:0px;}
  296. }
  297. @keyframes choopop{
  298. 0%{ bottom:-200px;}
  299. 100%{ bottom:0px;}
  300. }
  301. .botpop li{ line-height:50px; background:#fff; border-top:1px solid #f2f2f2; padding:0 15px;}
  302. .botpop li.curr{ color:#17b3ec;}
  303. .botpopmb{ width:100%; height:100%; background:rgba(0,0,0,.4); position:fixed; left:0; top:0; z-index:650; display:none;}
  304. /* 我的粉丝 */
  305. .my-fans > li{ display:block; margin-left:0;}
  306. .my-fans > .c-list-link:active { background-color: #fff; padding-left: 0; margin-left: 0;}
  307. .my-fans .c-avatar-m{ padding-left:10px;}
  308. .my-fans .arrow-right{ -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); transition:all .3s ease; -webkit-transition:all .3s ease; margin-top:-8px;}
  309. .my-fans .ashow{ -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); margin-top:-3px;}
  310. .my-fans .c-list-info{ padding-right:10px;}
  311. .fans-mess{ display:box; display:-webkit-box; position:relative;}
  312. .fans-form{ background:#f2f2f2; line-height:22px; padding:10px 0; text-align:center; display:none;}
  313. .fans-form .icon-dizhi{ font-size:18px;}
  314. .nomess{ text-align:center; padding-bottom:20px;}
  315. .icon-nomess{ display:inline-block; width:123px; height:123px; background:url(../images/nomess.png) no-repeat; background-size:100% 100%; margin-bottom:5px;}
  316. .matter-list .hasmess{ display:block; width:10px; height:10px; background-color:#f30; border-radius:50%; position:absolute; right:0px; top:0px;}
  317. .matter-list .c-avatar-m{ position:relative;}
  318. .matter-list .c-list-info{ padding-right:80px;}
  319. .pt100{ padding-top:100px;}
  320. /* 小秘书 */
  321. .secr-top{ position:relative; padding:0 10px 0 60px; min-height:40px;}
  322. .secr-top .leftpart{ position:absolute; left:10px; top:0;}
  323. .secr-top .rightpart{ position:relative; background-color:#bfeeff; border:1px solid #b0dbeb; line-height:19px; padding:5px 8px; border-radius:4px; word-break:break-all;}
  324. .secr-top .rightjt,.secr-top .rightjt s{ position:absolute; display: block; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 7px; left:-5px; top:10px;}
  325. .secr-top .jt-left,.secr-top .jt-left s{ border-right-color: #bfeeff; border-right-style: solid;}
  326. .secr-top .rightjt{left:-14px; border-right-color: #b0dbeb;}
  327. .secr-top .rightjt s{ left:-6px; top:-7px;}
  328. /* 患者沟通 */
  329. .bgc-f7f5f2{ background-color:#f7f5f2;}
  330. .talk-left{ position:relative; min-height:40px; padding:10px 40px 10px 68px; margin-top:15px;}
  331. .talk-left .leftpart{ position:absolute; left:15px; top:10px;}
  332. .talk-left .leftpart img{ width:40px; height:40px; border-radius:50%;}
  333. .talk-left .rightpart{ background-color:#fff; border:1px solid #ebeaea; border-radius:4px; padding:8px 10px; line-height:20px; position:relative; word-break:break-all; min-width:30px; float:left;}
  334. .talk-left .talktime{ position:absolute; left:0; top:-20px; font-size:12px; color:#ccc;}
  335. .talk-left .rightpart:before{ content:''; display: block; position:absolute; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 7px; left:-14px; top:10px; border-right-color: #ebeaea; border-right-style: solid;}
  336. .talk-left .rightpart:after{ content:''; position:absolute; display: block; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 7px; left:-13px; top:10px; border-right-color: #fff; border-right-style: solid;}
  337. .talk-left .rightjt{}
  338. .talk-left .rightjt s{}
  339. .talk-right{ position:relative; min-height:40px; padding:10px 68px 10px 40px; margin-top:15px;}
  340. .talk-right .leftpart{ position:absolute; right:15px; top:10px;}
  341. .talk-right .leftpart img{ width:40px; height:40px; border-radius:50%;}
  342. .talk-right .rightpart{ background-color:#bfeeff; border:1px solid #b9e2f1; border-radius:4px; padding:8px 10px; line-height:20px; position:relative; word-break:break-all; min-width:30px; float:right;}
  343. .talk-right .talktime{ position:absolute; right:0; top:-20px; font-size:12px; color:#ccc;}
  344. .talk-right .rightpart:before{ content:''; display: block; position:absolute; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 7px; right:-15px; top:10px; border-left-color: #b9e2f1; border-right-style: solid;}
  345. .talk-right .rightpart:after{ content:''; position:absolute; display: block; font-size: 0; line-height: 0; width: 0; height: 0; border-color: transparent; border-style: dashed; border-width: 7px; right:-14px; top:10px; border-left-color: #bfeeff; border-right-style: solid;}
  346. .talk-time{ width:190px; line-height:26px; margin-left:auto; margin-right:auto; font-size:12px; color:#ccc; text-align:center; position:relative;}
  347. .talk-time:before{ content:''; display:block; width:50px; height:13px; border-bottom:1px solid #e6e4e1; position:absolute; left:0; top:0;}
  348. .talk-time:after{ content:''; display:block; width:50px; height:13px; border-bottom:1px solid #e6e4e1; position:absolute; right:0; top:0;}
  349. .talk-bot{ width:100%; height:55px; background:#fafafa; display:box; display:-webkit-box; padding:12px 10px 0 10px; position:relative; z-index:600;}
  350. .talk-input{ box-flex:1; -webkit-box-flex:1; -moz-box-flex:1;}
  351. .talk-input input{ display:block; width:100%; height:30px; border:1px solid #d1d1d1; border-radius:4px; background:#fff; padding:0 10px; appearance:none; -webkit-appearance:none;}
  352. .talk-send{ box-flex:0; -webkit-box-flex:0; -moz-box-flex:0; width:58px; text-align:right;}
  353. .talk-send a{ display:inline-block; width:45px; height:30px; text-align:center; line-height:30px; background-color:#17b3ec; font-size:15px; color:#fff; border-radius:4px;}
  354. .talk-send a.disab{ background-color:#ccc;}
  355. .talk-home{ position:absolute; right:10px; bottom:125px; z-index:700; width:40px; height:40px; background:rgba(0,0,0,.4); text-align:center; line-height:40px; border-radius:50%; z-index:600;}
  356. .talk-refresh{ position:absolute; right:10px; bottom:65px; z-index:700; width:40px; height:40px; background:rgba(0,0,0,.4); text-align:center; line-height:40px; border-radius:50%;}
  357. .talk-refresh i,.talk-home i{ font-size:26px; color:#fff;}
  358. .homefixed{ position:fixed;}
  359. .bot10{ bottom:10px !important;}
  360. .bot60{ bottom:60px !important;}
  361. /*弹框样式*/
  362. .imgzoom-pack { width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: rgba(0, 0, 0, .7); display: none; z-index: 3000;}
  363. .imgzoom-pack:after { content: ""; position: absolute; height: 50px; line-height: 50px; width: 100%; bottom: 0; left: 0; background: rgba(0, 0, 0, .5); z-index: 5;}
  364. .imgzoom-pack .imgzoom-x { color: #fff; height: 50px; width: 60px; line-height: 50px; text-align: center; font-size: 17px; position: absolute; left: 50%; margin-left:-35px; bottom: 0; z-index: 10; cursor: pointer;}
  365. .imgzoom-del { color: #fff; height: 50px; width: 60px; line-height: 50px; vertical-align: middle; text-align: center; position: absolute; right:0; bottom: 0; z-index: 10; cursor: pointer;}
  366. .imgzoom-del .iconfont { font-size: 24px; color: #fff;}
  367. .imgzoom-pack .imgzoom-img { width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden;}
  368. .imgzoom-pack .imgzoom-img img { width: 100%; position: absolute; top: 50%;}
  369. .ax-popup.dr-jj .ui-dialog-body{ padding-top:0;}
  370. .c-main .c-btn{ padding-top:10px; padding-bottom:10px;}
  371. .talk-view{ text-align: right; padding-top: 5px; border-top:1px dotted #eaeaea; margin-top: 10px; color:#0066ff; font-size:13px;}
  372. .talk-right .talk-view{ border-top:1px dotted #0066ff; }
  373. .talk-view a, .talk-view a:link{ color:#0066ff; display: block;}
  374. .talk-view .iconfont{ font-size: 14px;}
  375. /* error */
  376. .error-box{ width:100%; height:100%; position:fixed; z-index:500; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center;}
  377. .error-tb{ display:inline-block; width:111px; height:90px; background:url(../images/error-page.png) no-repeat; background-size:100% 100%; -webkit-background-size:100% 100%; -moz-background-size:100% 100%; -ms-background-size:100% 100%;}
  378. .pt84{padding-top:84px;}
  379. .page-slwrong{background:url(../images/wrong-bgc.png) no-repeat center center;width:45%;padding-bottom:45%;margin:0 auto;background-size:cover;}
  380. .member-list li a.conhold,.resultlist li a.conhold,.matter-list li a.conhold{ display: -webkit-box; display: box; -webkit-box-align: center; -ms-box-align: center; box-align: center;}
  381. .member-list > li,.resultlist > li,.matter-list > li{ display:inherit !important;}
  382. .result-his li a{ line-height:45px; color:#333;}
  383. .talk-home a{ display:block; width:100%; height:100%;}
  384. /*患者管理病例*/
  385. .add-sf .add-sf-img img { width:125px; height: 125px;}
  386. /*创建随访计划*/
  387. .case-edit.bg-none { background: none; padding: 10px;}
  388. /*文本域*/
  389. .r-textarea { border: 0; width: 100%; resize: none;}
  390. /*添加图片*/
  391. .icon-del { display: block; width: 20px; height: 20px; background-color: #fe3a30; border-radius: 50%; text-align: center; color: #fff;}
  392. .icon-delete { display: block; width: 20px; height: 20px; border: 1px solid #f75a53; border-radius: 50%; position: relative;}
  393. .icon-delete:after { content: ''; position: absolute; left: 50%; top: 50%; margin-left: -7px; margin-top: -1px; width: 14px; height: 2px; background-color: #f75a53;}
  394. .list-img { display: -webkit-box; display: box;}
  395. .list-img li { margin-right: 10px; width: 70px; height: 70px; position: relative;}
  396. .list-img li img { width: 100%; height: 100%;}
  397. .list-img .icon-del { position: absolute; top: -5px; right: -5px;}
  398. .add-img { border: 1px dashed #e5e5e5; width: 70px; height: 70px; position: relative; }
  399. .add-img i { width: 2px; height: 28px; background-color: #e5e5e5; display:block; position: absolute; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); top: 50%; left: 50%;}
  400. .add-img i:after { width: 28px; height: 2px; background-color: #e5e5e5; content:''; display: block; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); top: 50%; left: 50%; position: absolute;}
  401. /*选择随访模板*/
  402. .icon-rec { background: #ff8100; position: relative; color: #fff; font-size: 10px; padding: 1px 2px;}
  403. .icon-rec:before { content:''; position: absolute; width: 0; height: 0; border-top: 8px solid #ff8100; border-left: 5px solid transparent; left: -5px; top: 0;}
  404. .icon-rec:after { content:''; position: absolute; width: 0; height: 0; border-bottom: 8px solid #ff8100; border-left: 5px solid transparent; left: -5px; bottom: 0;}
  405. /*生成随访计划*/
  406. .mod-add-plan .c-list .c-list-key { width: 85px;}
  407. .mod-edit-plan.c-list .c-list-key { width: 108px; display: -webkit-box; display: -ms-box; display: box;}
  408. .h55 { height: 55px;}
  409. .h122 { height: 122px;}
  410. .btn-fix > div { position: fixed; bottom: 0; width: 100%; box-sizing: border-box;}
  411. /*搜索*/
  412. .icon-clear { background: #909090; border-radius: 50%; width: 16px; height: 16px; text-align: center; line-height: 15px;}
  413. .icon-clear .close { position: relative; display: inline-block; width: 10px; height: 10px; overflow: hidden;}
  414. .icon-clear .close:before ,.icon-clear .close:after{ content: ''; position: absolute; height: 2px; width: 100%; top: 50%; left: 0px; margin-top: -1px; background: #fff; border-radius: 6px;}
  415. .icon-clear .close:before{ -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
  416. .icon-clear .close:after{ -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);}
  417. /*随访执行情况*/
  418. .icon-circle { width: 8px; height: 8px; border-radius: 50%; display: inline-block;border: 2px solid #ccc; float: left; margin-top: 4px;}
  419. /*我的意见*/
  420. .list-img.dialog-list-img { margin: 10px 0 0 0;}
  421. .list-img.dialog-list-img li { width: 35px;height: 35px; margin: 0 10px 10px 0;}
  422. /*患者自评*/
  423. .select-list .input-group-checkbox .input-group-pack, .input-group-radio .input-group-pack { top:0;}
  424. .c-list > .c-cover-10 { padding-left: 10px !important; margin-left: 0 !important;}
  425. /*血常规检查*/
  426. .table-blood tr th { text-align: center; background-color: #7ecef4; color: #fff; padding: 5px 0; border: 1px solid #e1e1e1;}
  427. .table-blood tr td { border-bottom: 1px solid #e1e1e1; border-right:1px solid #e1e1e1;padding: 5px 0; text-align: center; color: #909090;}
  428. .table-blood tr td:last-child,.table-blood tr th:last-child { border-right: 0;}
  429. /*关于患者管理*/
  430. .about-manage-img { width:100%; padding-top: 50%; padding:0 10px; box-sizing: border-box;}
  431. .about-manage-img img { width: 100%; height: 100%;}
  432. /*调查问卷*/
  433. .tag-score { position: relative; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #ff8100; display: inline-block; color: #fff; padding: 2px 5px; height: 20px; line-height: 20px; font-size: 12px;}
  434. .tag-score:before { content:''; width: 0; height: 0; border-style: solid; border-width: 12px 8px 12px 0; border-color: transparent #ff8100 transparent transparent; position: absolute; left: -8px; top:0;}
  435. .case-top .icon-xiaoxi { font-size: 24px;}
  436. /*患者用药*/
  437. .yy-detail-box{background: #c8eafa; margin:0 15px;}
  438. .yy-date{ position:relative; height:30px; }
  439. .yy-date:after{ width:60%; height:1px; content:""; position:absolute; top:50%; left:50%; margin-left:-30%; background:#ccc; z-index:1;}
  440. .yy-date span{ width:80px; left:50%; margin-left:-40px; text-align:center; position:absolute; display:inline-block; height:30px; line-height:30px; font-size: 11px; color:#909090; background:#f3f3f3; z-index:10;}
  441. .yy-detail-list { background: none; }
  442. .yy-detail-list li{ border:none; font-size: 13px; padding-top:5px; padding-bottom:5px;}
  443. .new-mess{ display: block; position: absolute; right:12px; top:50%; -webkit-transform: translateY(-50%);transform: translateY(-50%);}
  444. .new-mess .iconfont{ font-size: 24px; color:#17b3ec; line-height: 1em;}
  445. .new-mess .red-point{ position: absolute; top:0; right:-2px; background: #ed0000; width:6px;height:6px; border-radius: 50%;}
  446. .ls-date{ position:relative; height:30px; }
  447. .ls-date:after{ width:60%; height:1px; content:""; position:absolute; top:50%; left:50%; margin-left:-30%; background:#e1e1e1; z-index:1;}
  448. .ls-date span{ width:70px; left:50%; margin-left:-35px; text-align:center; position:absolute; display:inline-block; height:30px; line-height:30px; font-size: 11px; color:#5b5b5b; background:#f3f3f3; z-index:10;}
  449. .ls-sf-list{margin-top: 10px;}
  450. .ls-box .ls-sf-list:first-child{margin-top:0;}
  451. .ls-sf-list li{ display:none; padding-top: 12px; padding-bottom: 12px;}
  452. .ls-sf-list li .list-icon { position: absolute; right: 12px; top: 50%; margin-top: -5px; }
  453. .ls-sf-list li.ls-sf-title{ display: -webkit-box; display: box;}
  454. .ls-sf-list li .c-list-value,.ls-sf-list li.c-list-link .c-list-value{ padding-right:25px;}
  455. .ls-sf-list.open li{display: -webkit-box; display: box;}
  456. .ls-sf-list li .list-icon { margin-top: -6px; }
  457. .ls-sf-title{position: relative;}
  458. .ls-sf-title:after{ position: absolute; content: ""; right:10px; top:50%; margin-top: -3px; width: 0;height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #ccc; -webkit-transition: all ease 0.5s;transition: all ease 0.5s;}
  459. .ls-sf-list.open .ls-sf-title:after{ -webkit-transform: rotate(-180deg);transform: rotate(-180deg);}
  460. .ls-sf-title .iconfont.on{color:#4fb947; vertical-align: middle;}
  461. .ls-sf-title .iconfont.off{color:#ccc ; vertical-align: middle;}
  462. .ls-step-box{ width:60px; text-align: center;}
  463. .ls-step-box p{ font-size: 10px; line-height: 1em;}
  464. .ls-step-bar{ position: relative;width:60px; height:13px; margin-top:2px; }
  465. .ls-step-bar:after{ position: absolute; content: ""; width:60px; height:7px; bottom:2px; left:0; z-index: 2;background: #5bbc54; }
  466. .ls-step-fe{ position: absolute; width:60px; height:13px; background: url(../images/ls-step.png) no-repeat 0 0; background-size:100% 100%; top:0; left:0; z-index: 10;}
  467. .ls-step{ position: absolute; width:0; height:7px; bottom:2px; left:0; z-index: 5; background: #17b3ec; -webkit-transition: all ease 0.5s;transition: all ease 0.5s;}
  468. /*发作详情*/
  469. .bt-list-qa .num { display: inline-block; width: 20px;}
  470. .y-y-d{ position:relative; height:30px; }
  471. .y-y-d:after{ width:76%; height:1px; content:""; position:absolute; top:50%; left:50%; margin-left:-38%; background:#e1e1e1; z-index:1;}
  472. .y-y-d span{ width:120px; left:50%; margin-left:-60px; text-align:center; position:absolute; display:inline-block; height:30px; line-height:30px; font-size: 11px; color:#909090; background:#f3f3f3; z-index:10;}
  473. /*随访执行情况*/
  474. .c-list.bt-list-situ > .c-list-text{ padding: 12px 10px 12px 0;}
  475. .c-list.bt-list-situ .c-list-info > h4 { font-size: 13px;}
  476. /*问卷调查*/
  477. .y-d{ position: relative; height: 30px;}
  478. .y-d:after{ width:60%; height: 1px; content:""; position: absolute; top: 50%; left: 50%; margin-left: -30%; background: #ccc; z-index: 1;}
  479. .y-d span{ width: 80px; left: 50%; margin-left: -40px; text-align: center; position: absolute; display: inline-block; height: 30px; line-height: 30px; font-size: 11px; color: #909090; background: #f3f3f3; z-index: 10;}
  480. .add-news .content { color: #909090; border-top: 1px solid #f2f2f2; box-sizing: border-box; padding: 10px;}
  481. /*分组管理*/
  482. .tag-blue { color: #17b3ec; border: 1px solid #17b3ec; font-size: 12px; border-radius: 5px; padding: 4px 7px;}
  483. /*患者用药*/
  484. .tag-orange { background: #ffe6cc; border-radius: 5px; padding: 3px 8px; font-size: 11px;}
  485. /*疾病症状表现*/
  486. .case-top .icon-xiaoxi { font-size: 24px;}
  487. /*调查问卷*/
  488. .tag-green { position: relative; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #4fb947; display: inline-block; color: #fff; padding: 2px 5px; height: 20px; line-height: 20px; font-size: 12px;}
  489. .tag-green:before { content:''; width: 0; height: 0; border-style: solid; border-width: 12px 8px 12px 0; border-color: transparent #4fb947 transparent transparent; position: absolute; left: -8px; top:0;}
  490. .tag-gray { position: relative; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #ddd; display: inline-block; color: #fff; padding: 2px 5px; height: 20px; line-height: 20px; font-size: 12px;width:24px; text-align: center;}
  491. .tag-gray:before { content:''; width: 0; height: 0; border-style: solid; border-width: 12px 8px 12px 0; border-color: transparent #ddd transparent transparent; position: absolute; left: -8px; top:0;}
  492. .r-input { border:1px solid #e1e1e1; padding: 3px 0 3px 15px;}
  493. .gap { height: 10px;width: 100%; background:#f3f3f3;}
  494. /*疾病发病前兆问卷调查*/
  495. .bt-list-index { margin-right: -10px;}
  496. .bt-list-index.c-list > li { border-top:0;border-bottom: 1px dashed #e5e5e5;}
  497. .bt-list-index.c-list > li { margin-left: 0;}
  498. .bt-list-index.c-list > li .c-list-key{ color: #909090;}
  499. .bt-list-index .c-list-link .list-icon { margin-top: -6px;}
  500. /*日常生活反馈*/
  501. .icon-19 { font-size: 20px; vertical-align: middle;}
  502. /*弹出框*/
  503. .ui-dialog-content { width: 100%; padding: 0 15px; box-sizing: border-box;}
  504. .box-clocked .suo { margin-top: -15px; display: block; width: 55px; height: 55px ; border: 2px solid #ff8100; border-radius: 50%; text-align: center; line-height: 55px; margin: 0 auto 10px;}
  505. .icon-suo { font-size:38px; display: inline-block; margin-left: -2px;}
  506. .drug-error .ui-popup li { margin: 0!important;}
  507. /*搜索框*/
  508. .mtb2 { margin-top: 2px; margin-bottom: 2px;}
  509. .bt-search.c-ser-hold { background: #f3f3f3;}
  510. .bt-search .c-ser-into { background: #fff;}
  511. /*选择患者*/
  512. .bt-choose-patient .member-list { padding-left: 25px;}
  513. /*血压测量的弹出框*/
  514. .pressure-check input { border: 1px solid #e1e1e1;}
  515. /*头部*/
  516. .h45{ height:45px;}
  517. .demo-comtop{ width:100%; height:45px; line-height:44px; background:#fff; color:#333; text-align:center; font-size:16px; padding-left:45px; padding-right:45px; position:fixed; z-index:9999; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; border-bottom:1px solid #e1e1e1;}
  518. .demo-comtop .mui-action-back{ display: block; width:45px; height:45px; position:absolute; left:0; top:0;}
  519. .demo-comtop .mui-action-back:before{ content:''; display: block; width: 12px; height: 12px; border: solid #17b3ec; border-width: 1px 1px 0 0; transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -ms-transform: rotate(-135deg); position:absolute; left:18px; top:16px;}
  520. .demo-comtop h1{ max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color: #17b3ec; position: relative;}
  521. /*填写随访提醒*/
  522. .mod-edit-textarea {background: #fff;}
  523. .mod-edit-textarea textarea { width: 100%; padding: 15px; box-sizing: border-box; border: 0; resize: none;}
  524. /*选择片段弹窗*/
  525. .ax-popup .ui-dialog-content { width: 100%;}
  526. #add-part-item .c-list > .c-list-text { -webkit-box-pack: center; -ms-box-pack: center; box-pack: center;}
  527. /*时间轴*/
  528. .process-detail{ display:block; background:#fff; padding-left:40px; font-size:14px;}
  529. .process-detail li{ line-height:45px; position:relative; border-top:1px solid #f2f2f2; padding-right:15px; color:#909090;}
  530. .process-detail li:first-child{ border-top:none;}
  531. .process-detail li.nojt{ padding-right:15px;}
  532. .process-detail li .arrow-right{ position:absolute; right:15px; top:50%; margin-top:-5px;}
  533. .process-state{ position:absolute; width:15px; height:15px; background:#ccc; border-radius:50%; text-align:center; line-height:15px; color:#fff; font-size:12px; left:-25px; top:16px;}
  534. .process-state:before{ content:''; display:block; width:1px; height:32px; background:#ccc; position:absolute; left:7px; top:15px;}
  535. .process-detail li:last-child .process-state:before{ display:none;}
  536. .process-state.curr{ background:#2eba52;}
  537. .process-state.curr:before{ background:#2eba52;}
  538. /*阶段列表*/
  539. .bt-list-stage.c-list > .c-list-text { padding-right: 0;}
  540. .bt-list-stage li .arrow-right { right: 0;}
  541. .bt-list-stage li.title { border-left:3px solid #17b3ec; padding-left: 10px;}
  542. /*随访总结*/
  543. .bgc-17b3ec { background: #17b3ec;}
  544. .pianduan-sel{ appearance:none; -webkit-appearance:none; border:none; padding-right:10px; padding-left:30px;}