body {background: #fbfafa} .box.box_white {border: 1px solid #cacaca; box-shadow: 0px 0px 10px #eee} .box.box_gray2 input {background: #fff} .box.box_gray2 .btn_search {background: #fff} /* body:has(.patient_dashboard) {background: #f4f4f4}*/ :hover {transition: all 0.2s ease} /**/ /**/ * { -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none } .draggable { -webkit-user-select:all; -moz-user-select:all; -ms-user-select:all; user-select:all } header {width: 100%; height: fit-content; position: fixed; top: 0; left: 0; background: #fff; border-bottom: 1px solid #dbdbdb; z-index: 9999; transition: all 0.3s ease} header.collapsed {top:-90px} header .trapezoid { padding: 0 20px;cursor: pointer; width: 60px; height: 20px; background-color: #77a601; clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%); position: absolute; bottom:0px; right: 10px;} header .trapezoid:after {font-family: "Font Awesome 6 Pro"; content: '\f0d8'; position: absolute; color: #fff; font-weight: 800; top: 50%; left: 50%; transform: translate(-50%, -50%)} header.collapsed .trapezoid {clip-path: polygon(0% 0%, 100% 0%, 80% 100%, 20% 100%); bottom:-20px; } header.collapsed .trapezoid:after {font-family: "Font Awesome 6 Pro"; content: '\f0d7'; position: absolute; color: #fff; font-weight: 800; top: 50%; left: 50%; transform: translate(-50%, -50%)} header > div {padding: 5px 20px;transition: all 0.3s ease;max-width: 1740px; ; gap: 20px;display: flex; width: 100%; height: fit-content; justify-content: space-between; align-items: center; margin: 0 auto } header > div.top-line {border-bottom: 1px solid #00000005; max-width: unset; justify-content: flex-end; background: linear-gradient(to right, #eaf2de, #f2fcf7);position: relative} header > div.top-line .btn:not(.btn_gray) {background: #fff0} header > div.top-line .btn.btn_color2 {background: #fff} header .logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)} header img {max-height: 40px; max-width: 110px; position: relative; top: -1px} header nav section ul{transition: all 0.3s ease;display: flex; height: fit-content;justify-content: center; align-items: center; gap: 20px} header nav section ul.active{display: flex!important;} header nav section ul li.disabled a{cursor: not-allowed!important; opacity: 0.3} header nav ul li a {display: flex; align-items: center; text-align: center; font-size: 0.95em; font-weight: 600; color: #939393 !important; gap: 5px; justify-content: center; position: relative} header nav ul li a {line-height: 1em; } header nav ul li a p{font-size: 1.1em} header nav ul li a i{font-size: 1em;position: relative; top: 1px} header nav ul li.line span {display: block; width: 2px; height: 20px; border-right: 1px solid #eee} header nav ul li.active {position: relative} header nav ul li.active:after {position: absolute;bottom: -15px;left: 50%;transform: translateX(-50%);content: '';display: block; width: 100%; height: 3px; background: #000} header nav ul li.active > a {color: #000000 !important; font-weight: 700; position: relative} header nav ul li > a i {font-weight: 300!important;} header nav ul li.active > a i {font-weight: 800!important;} header nav ul li > a + ul {display: none; position: absolute; flex-direction: column; top: 9px;left: 50%;transform: translateX(-50%);padding-top: 20px;width: 100%; } header nav ul li > a + ul li { background: #fff; border-radius: 0px; border-bottom: 1px solid #eee;width: 100%;box-shadow: 0 0 10px #00000015} header nav ul li > a + ul li a {padding: 10px;display: block} header nav ul li > a + ul li:hover {font-weight: 800; border-bottom-color: #000;} header nav ul li > a + ul li:hover a {font-weight: 800; color: #000!important;} header nav ul li:has(ul) {position: relative} header nav ul li:has(ul):hover > a + ul {display: block} header a.account { font-weight: 500; color: #717171; white-space: nowrap; letter-spacing: -1px} header a.account i {font-size: 0.8em;margin-right: 5px} header a.logout { color: #77a601; } header nav {display: flex;width: 100%;height: fit-content;justify-content: flex-start; gap:20px;align-items: center;} header .header-tabs {margin-bottom: 0;border-bottom: 0;gap: 5px;border-radius: 20px; background: #f3f3f3; overflow: hidden; padding: 10px; gap: 5px;display: flex} header .last-time {line-height: 1;display: inline-block;font-size: 13px;color: gray;text-align: right;white-space: nowrap; width: fit-content} header .fa-solid.fa-bell.active {color: #77a601;animation: blink 1s infinite;} header .sign-bell {position: relative;} header .sign-bell[data-count]:after {content: attr(data-count);position: absolute;top: -6px;right: -4px;min-width: 18px;height: 18px;padding: 0 5px;background: #000000;color: #fff;font-size: 11px;font-weight: 700;display: flex;align-items: center;justify-content: center;border-radius: 50%;line-height: 1;} header .sign-bell[data-count="0"]:after {display: none;} @keyframes blink { 0% { filter: brightness(50%); } 50% { filter: brightness(150%); } 100% { filter: brightness(50%); } } #hq {max-width: 1700px; margin: 90px auto 0; padding: 20px 0; transition: all 0.3s ease} #hq.active {margin: 0px auto 0;} nav.panel {margin-bottom: 0; padding: 0 10px} nav.panel a {font-size: 1.25em; color: #a4a4a4; display: inline-block; padding: 0 0 10px} nav.panel .active{ color: #77a601; font-weight: 800; padding-bottom: 0} nav.panel .active:after {position: relative;left: 50%;transform: translateX(-50%);content: "";display: block;width: 100%;border-radius: 10px;background-color: #77a601;transition: all 0.3s;height: 2.5px;margin-top: 10px;} @media screen and (max-width: 1740px) { header > div {padding: 0 60px;} } @media screen and (max-width: 1700px) { header nav section ul {gap: 20px;} } @media screen and (max-width: 1500px) { header nav section ul {gap: 12px;} } @media screen and (max-width: 1440px) and (min-width: 1200px) { header #tab-contents {max-width: 50vw;overflow-y: auto;} header nav section ul {gap: 10px; width: fit-content} } @media screen and (max-width: 1200px) { header > div.top-line {display: flex; padding: 10px 20px} header > div.top-line .hidden-xs {display:none} header > div {display: block} header > div {padding: 0 20px;} header nav {padding-top: 25px; flex-direction: column;} header nav section {width: 100%} header nav section ul {width: 100%;flex-wrap: wrap; gap: 0px; row-gap: 10px; justify-content: space-between} header nav section ul li {width: 49.5%; border-bottom: 1px solid #eee; padding: 0 10px 10px} header nav ul li a {align-items: center;display: flex; height: fit-content;justify-content: space-between; width: 100%; flex-direction: unset} header nav ul li a i {width: 20px; font-size: 1em; text-align: center;margin-bottom: 0} header nav ul li.line {display:none} header nav + span {padding: 10px 05px;font-size: 0.7em; } header {max-height: 53.5px;overflow: hidden; transition: max-height 0.4s ease-in-out} header.open {max-height: unset; } header nav ul li > a + ul {position: unset; transform: unset; padding-top: 5px;} header nav ul li > a + ul li a {padding: 5px 10px;} #hq {width: 100%; overflow-x: auto;} #hq > * {min-width: 1600px; } header .trapezoid {display: none} } @media screen and (max-width: 768px) { header nav ul li {width: 100%} header > div.top-line .flex {gap: 0} header .mobile-menu { display: none; } header .name { display: none; } } .signup {position: relative; max-width: 1024px; margin: 0px auto 40px; padding:75px 25px 75px; background: #fff; } .signup > img {height: 50px; margin-bottom: 20px} .signup > hr {width: 20px; margin: 30px 0; border-top: 1px solid #77a601; display: block} .signup > h1 {font-size:1.5em; color:#727272;margin-bottom: 10px} .signup .tab-pane > h2 {font-size:1.5em; color: #727272;margin-bottom: 50px} .signup #nextBtn { max-width: 1024px; position: fixed;bottom: 0; left: 50%; transform: translateX(-50%);} .signup .tab-pane p:not(:first-child) {;margin-top: 15px} .signup .tab-pane > div > label {;margin-top: 15px; margin-bottom: 5px} .signup .tab-pane dl > label {;margin-top: 15px; margin-bottom: 5px} .signup form p {text-align: left;margin-bottom: 5px; font-weight: 600; color: #414141} .signup form button {margin-top: 15px} .signup form input:not([type='checkbox']) {border-bottom: 2px solid #a9a9a9} .signup form input:not([type='checkbox']):active {border-bottom: 2px solid #77a601} .signup form input:not([type='checkbox']):focus {border-bottom: 2px solid #77a601} .signup .error-message {color: #ff0000;transition: all 0.2s ease} #complete {position: relative; width: 100%; height: 100vh} #complete > div {width: 100%; position: absolute; gap: 15px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;max-width: 380px; aspect-ratio: 1/1; padding: 75px; margin: 0px auto 0px; background: #fff; transform: translate(-50%, -50%); top: 50%; left: 50% } #complete > div:hover {box-shadow: 0 0 35px #63636333} #complete img {width: 180px; margin-bottom: 25px} #complete h5 {font-weight: 700; color: #77a601; font-size: 2em; line-height: 1.25em} #complete p span {border-bottom: 1px solid #77a601; } /**/ #login {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 95%; max-width: 500px; } #login > div {height: fit-content; padding: 20px 0; margin: 0 auto; display: flex; flex-direction: column; row-gap: 20px; text-align: center; align-items: center} #login > div img {width: 200px} #login > div form {width: 100%} #login > div form button {margin-top: 15px} #login p {text-align: left;margin-top: 15px} /**/ #hq > section.grid > section > div.box {height: 100%} #hq > section.grid > section > div.box25 {height: 100%} #accountModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #index > div {position: fixed; top: 45%; left: 50%; transform: translate(-50%, -50%); width: 95%; max-width: 700px; text-align: center } #index > div img {width: 200px; margin-bottom: 25px; mix-blend-mode: multiply} #index .nav { display: flex; flex-wrap: wrap; gap: 40px; justify-content: center } #index .nav li i { transition: all 0.2s ease; width: 75px; aspect-ratio: 1/1; border-radius: 100px; background: #fff; display: flex; justify-content: center; align-items: center; font-size: 2em; margin-bottom: 10px} #index .nav>li>a {padding:0} #index .nav li a { padding-bottom: 10px;font-weight: 600} #index .nav li a:hover { border-radius: 50px;} #index .nav li.plus i { background: #d0d2d5; } #index .nav li.star {position: relative} #index .nav li.star .delete { padding: 0;width: 20px; aspect-ratio: 1/1; border-radius: 100px; background: #707070; color: #fff;position: absolute; top: 0px; left: 0px; display: flex; justify-content: center; align-items: center; } #index .nav li:hover i { background: #fff;color: #77a601; box-shadow: 0 5px 15px #0000001a;transition: all 0.2s ease } #index .nav:before { display: none } #index .nav:after { display: none } #index span.flex {; margin-bottom: 25px; justify-content: center} #index a.account {font-size: 1.5em; font-weight: 600; color: #717171} #index a.logout {font-size: 1.5em; color: #77a601; } #index h3 {margin-bottom: 20px} #iconAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} /**//**/ .board_form strong.w50px {display: inline-block} .board_view .reply {font-size: 1.2em;margin-top: 10px; font-weight: 400; line-height: 1.5em; } .board_view .reply.no {font-size: 1em;margin-top: 0px;} .board_view .answerForm {padding-top: 10px } .board_view .answerForm .flex label { font-size: 1.3em; margin-right: 12px; line-height: 40px} .board_view .answerForm .flex { margin-bottom: 10px} .board_view .answer { border-radius: 0px; background: #ffffff; padding: 15px!important;} .board_view .answer:not(:last-child) { margin-bottom: 15px;} .board_view .answer textarea { border: 1px solid #E8E8E8} .board_view .cont { min-height: 200px; margin-top: 10px; padding-bottom: 20px !important; font-family: 'SUIT', sans-serif !important;} .board_view .title { font-weight: 800; font-size: 1.2em; margin: 12px 0; display: flex; align-items: center} .board_view .title span { font-weight: 600; font-size:0.7em; padding: 5px; border-radius: 3px; background: #fff; margin-right: 5px } .board_view .download { font-weight: 800; text-decoration: underline; padding-top:10px ;margin-bottom: 0px} /**/ .chart_number {width: 100%; display: flex; gap: 10px; margin: 5px 0 10px; align-items: center; flex-wrap: wrap; row-gap: 5px} .chart_number h6 {font-size: 13px} .chart_number a {display: flex; gap: 5px; align-items: center; justify-content: space-between; font-size: 1em; padding: 3px 5px; border-radius: 5px; background: #f3f3f3}/* .chart_number a b {border-left: 3px solid #eee; padding-left: 5px}*/ .counsel_chart > .count > div{display: flex; align-items: center; justify-content: space-between; font-size: 1.1em; margin-bottom: 0px} .counsel_chart > div:not(:first-of-type) > a {display: flex; align-items: center; justify-content: space-between; font-size: 1.3em; margin-bottom: 10px} .counsel_chart > div:not(:first-of-type) > a.btn_middle {justify-content: center} .counsel_chart > div > a b {font-size: 11px; } .counsel_chart > div:not(:first-of-type) {margin-top: 20px} .counsel_chart div.count {display: grid;grid-template-columns: repeat(3, 1fr);} .counsel_chart div.count > * {width: 100%; cursor: pointer} .counsel_chart div.count > .active {border: 3px solid #76a501; box-shadow: 0 0 8px rgba(118, 165, 1, 0.16);} .counsel_chart hr {display: block; margin: 10px 0} .counsel_chart .chart_box > div {border-radius: 5px;overflow: hidden;} /**/ br.view {display: none} .counsel br.view {display: block} .counsel td p { cursor: pointer;} .counsel_main .panel{margin: 10px 0 0!important;} .counsel_main .box_gray3 .btn_search {background: #515151;color: #fff;} .counsel_main .box_gray3 select{background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .counsel_main .box_gray3 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff} .counsel_main .box_gray3 .btn{padding: 4px 5px; font-size: 14px; height: 30px} .counsel_main td {vertical-align: top; padding: 7.5px} .counsel_main tr th .tooltip {bottom: -200%} .counsel_main tr th .tooltip::after {top: -10px;transform: rotate(180deg);} .counsel_main tr td {background: #fff!important;} .counsel_main tr td a {display: inline-block;} .counsel_main tr.recent td {background: #dcdfdd61!important;} .counsel_main tr.detail td {border-top: 1px solid #eee;border-bottom: 1px solid #eee} .counsel_main tr.detail td {border-top: 1px solid #eee;border-bottom: 1px solid #eee} .counsel_main tr td {border-bottom: 1px solid #eee;} .counsel ul.flex.count {display: flex; align-items: center; gap: 5px} .counsel .tagbox {overflow: hidden;max-height: 0;opacity: 0;transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out; padding-top: 0px} .counsel .tagbox.open {max-height: 300px;opacity: 1; padding-top: 10px} .counsel_choose .panel {margin-bottom: 0; display: flex; gap: 5px; align-items: center; position: relative} .counsel_choose #patientWrap {position: relative} .counsel_choose #patientFix {position: absolute; top: 50px; left: 0; max-height: 100px; overflow-y: auto; box-shadow: 0 0 15px #00000010; width: 560px;z-index: 3} .counsel_choose #patientFix li {display: flex; align-items: center; justify-content: space-between; padding-top: 10px} .counsel_choose #patientFix li:not(:last-of-type) {padding-bottom: 10px; border-bottom: 1px dotted #eee; padding-top: 0px} .table.v2 table{border: 0} .table.v2 table th {padding: 5px 7.5px; border-bottom: 0;} .table.v2 table td {padding: 0px 7.5px; } .table.v2 table input:not([type="checkbox"]) { background: #fff!important; padding: 10px 0; border-bottom: 1px solid #fff0} .table.v2 table input:hover { border-bottom: 1px solid #fff0!important;} .table.v2 td:hover {border-bottom: 2px solid #77a601;} /**/ .p_info u {text-decoration: unset; opacity: 0.3; margin: 0 3px} .p_info > b {min-width: 50px; display: inline-block} .p_info > .icon_gray {min-width: 58px; display: inline-block; text-align: center; margin-right: 5px} .p_info > .p_gen {min-width: 85px; display: inline-block} /**/ #tempFormModal tr:hover td {background: #77a60150;} .draft-banner {padding: 10px; border-radius:5px; display: flex; align-items: center; background: #FFEFEF 0% 0% no-repeat padding-box;border: 1px solid #FF816D; gap: 5px; font-weight: 600; color: #ff2d0d;margin-bottom: 10px} .draft-banner button {margin-left: auto} .counsel_form input[name="ptAge"] {width: 60px} .counsel_form .btn_box {height: 40px; border-radius: 5px} .counsel_form #guardianList td {align-content: baseline;} .counsel_form span.info > span{ display: flex; align-items: center;} .counsel_form span.info {font-size: 18px; display: flex; align-items: center;} .counsel_form span.info > *:after{content: '|'; color: #000; margin: 0 10px; font-weight: 400; opacity: 0.3} .counsel_form span.info > *:last-child:before{content: '|'; color: #000; margin: 0 10px; font-weight: 400; opacity: 0.3} .counsel_form #toggleAdd ~ #counAdd {display: none} .counsel_form #toggleAdd:checked ~ #counAdd {display: block; margin-top: 10px} .counsel_form .box_gray.mt10 ul {border-radius: 5px} .counsel_form .box_gray.mt10 ul li {display: flex; align-items: center;gap: 5px} .counsel_form .box_gray.mt10 textarea {min-height: 150px} .counsel_form .box_color.mt10 ul {border-radius: 5px} .counsel_form .box_color.mt10 ul li {display: flex; align-items: center;gap: 5px} .counsel_form .box_color.mt10 textarea {min-height: 150px} .counsel_form .box_colorline .txt_color {white-space: nowrap} .counsel_form .highlight { background-color: yellow; border-radius: 5px;} .counsel_form .able { white-space: nowrap; cursor: pointer;} .counsel_form .able + div { display: flex; align-items: center; gap: 5px} .counsel_form .disabled-input { pointer-events: none; opacity: 0.5;} .counsel_form div.box_colorline {padding: 10px; gap: 10px;border-radius: 5px; align-items: center} .counsel_form div.box_white {padding: 10px; gap: 10px;border-radius: 5px; align-items: center} .counsel_form div.box_white:not(:last-of-type) {border-bottom: 1px solid #eee} .counsel_form div.box_white .flex { gap: 10px; align-items: center; position: relative} .counsel_form div.box_white .w60px + .flex {width: calc( 100% - 70px )} .counsel_form div.box_gray {margin: 10px 0} .counsel_form ul.box_white {padding: 10px} .counsel_form input + label {cursor: pointer} .counsel_list .nav-tabs {margin-bottom: 0; gap: 0} .counsel_list .nav-tabs>li>a {padding: 10px;} #autoSaveNotification {position: fixed;bottom: 20px;left: 50%;transform: translateX(-50%);background: #4CAF50;color: white;padding: 12px 30px;border-radius: 4px;box-shadow: 0 2px 8px rgba(0,0,0,0.2);display: none;align-items: center;gap: 10px;z-index: 9999;font-size: 14px;min-width: 300px;justify-content: center;} #autoSaveNotification i {font-size: 16px;} /**/ .counsel_view .highlight { background-color: yellow; border-radius: 5px;} .counsel_view .able { cursor: pointer;} .counsel_view .disabled-input { pointer-events: none; opacity: 0.5;} .counsel_view div.box_colorline {padding: 10px; gap: 10px;border-radius: 5px; align-items: center} .counsel_view div.box_white {padding: 10px; gap: 10px;border-radius: 5px; align-items: center} .counsel_view div.box_white:not(:last-of-type) {border-bottom: 1px solid #eee} .counsel_view div.box_white span:has(input) {display: none} .counsel_view div.box_white span:has(input:checked) {display: block} .counsel_view div.box_white .flex { gap: 10px; align-items: center} .counsel_view ul.box_white {padding: 10px} .counsel_view input + label {cursor: pointer} .counsel_view input:read-only {background: #fff; color: #000} .counsel_view textarea:read-only {background: #fff; color: #000} .counsel_view .box_gray.mt10 ul {border-radius: 5px} .counsel_view .box_gray.mt10 ul li {display: flex; align-items: center;gap: 5px} .counsel_view .box_gray.mt10 textarea {min-height: 150px} .counsel_view .box_color.mt10 ul {border-radius: 5px} .counsel_view .box_color.mt10 ul li {display: flex; align-items: center;gap: 5px} .counsel_view .box_color.mt10 textarea {min-height: 150px} /**/ .counsel_graph .box > .box_gray.flex > b {font-size: 1.25em} .counsel_graph .box > .box_gray.flex > b:not(:first-of-type):before {margin-right: 10px; content: '|'; color: #b0b0b0; display: inline-block; font-weight: 400; opacity: 0.3}/* .counsel_chart div.count .box:nth-of-type(1) b {color: #9367bc;} .counsel_chart div.count .box:nth-of-type(2) b {color: #2798d5;} .counsel_chart div.count .box:nth-of-type(3) b {color: #2c9f2c;} .counsel_chart div.count .box:nth-of-type(4) b {color: #f376b5;} .counsel_chart div.count .box:nth-of-type(5) b {color: #f38d26;} .counsel_chart div.count .box:nth-of-type(6) b {color: #f32626;} .counsel_chart div.count .box:nth-of-type(7) b {color: #314b7a;} .counsel_chart div.count .box:nth-of-type(8) b {color: #2f7238;} .counsel_chart div.count .box:nth-of-type(9) b {color: #452f72;} .counsel_chart div.count .box:nth-of-type(10) b {color: #72492f;}*/ .counsel_chart a b{gap:2.5px; display: inline-flex;align-items: center;} .counsel_chart .no1 b{color: #9367bc;border-color: #9367bc!important;} .counsel_chart .no2 b{color: #2798d5;border-color: #2798d5!important;} .counsel_chart .no3 b{color: #2c9f2c;border-color: #2c9f2c!important;} .counsel_chart .no4 b{color: #f376b5;border-color: #f376b5!important;} .counsel_chart .no5 b{color: #f38d26;border-color: #f38d26!important;} .counsel_chart .no6 b{color: #f32626;border-color: #f32626!important;} .counsel_chart .no7 b{color: #314b7a;border-color: #314b7a!important;} .counsel_chart .no8 b{color: #2f7238;border-color: #2f7238!important;} .counsel_chart .no9 b{color: #452f72;border-color: #452f72!important;} .counsel_chart .no10 b{color: #72492f;border-color: #72492f!important;} .counsel_chart a b:before {display: inline-flex;background: #7e7e7e;font-size: 8.5px;padding: 0 2px;border-radius: 50px;color: #fff;height: 15px;align-items: center;} .counsel_chart .no1 b:before {content: '1';background: #9367bc;color: #fff;} .counsel_chart .no2 b:before {content: '2';background: #2798d5;color: #fff;} .counsel_chart .no3 b:before {content: '3';background: #2c9f2c;color: #fff;} .counsel_chart .no4 b:before {content: '4';background: #f376b5;color: #fff;} .counsel_chart .no5 b:before {content: '5';background: #f38d26;color: #fff;} .counsel_chart .no6 b:before {content: '6';background: #f32626;color: #fff;} .counsel_chart .no7 b:before {content: '7';background: #314b7a;color: #fff;} .counsel_chart .no8 b:before {content: '8';background: #2f7238;color: #fff;} .counsel_chart .no9 b:before {content: '9';background: #452f72;color: #fff;} .counsel_chart .no10 b:before {content: '10';background: #72492f;color: #fff;} .bb-target-no1 rect {fill: #9367bc!important;} .bb-target-no2 rect {fill: #2798d5!important;} .bb-target-no3 rect {fill: #2c9f2c!important;} .bb-target-no4 rect {fill: #f376b5!important;} .bb-target-no5 rect {fill: #f38d26!important;} .bb-target-no6 rect {fill: #f32626!important;} .bb-target-no7 rect {fill: #314b7a!important;} .bb-target-no8 rect {fill: #2f7238!important;} .bb-target-no9 rect {fill: #452f72!important;} .bb-target-no10 rect {fill: #72492f!important;} .counsel_graph .counsel_chart > div {margin-top: 20px} .counsel_graph .counsel_chart > div > b {font-size: 18px; color: #77a601;} .counsel_graph .counsel_chart ul li {display: flex; align-items: center; padding: 10px; border: 1px solid #eee; padding: 15px;margin-top: 10px; gap: 10px; font-size: 1.2em; border-radius: 3px} .counsel_graph .counsel_chart ul li b {margin-right: auto;} #counSetModal .modal-body > label:not(:first-of-type) {margin-top: 10px} /**/ .patient_form #guardianList td {align-content: baseline;} .patient_form input[name="ptAge"] {width: 60px} .patient_form span.info > span{ display: flex; align-items: center;} .patient_form span.info {font-size: 18px; color: #77a601; display: flex; align-items: center;} .patient_form span.info > b:first-child:after{content: '|'; color: #000; margin-left: 5px; font-weight: 400; opacity: 0.3} .patient_form span.info > b:last-of-type:before{content: '|'; color: #000; margin-left: 5px; font-weight: 400; opacity: 0.3} .patient_form .table {margin-bottom: 10px; border: 0} .patient_form .box_white form[name="patForm"] .textarea {margin-bottom: 25px; padding-bottom: 25px; border-bottom: 2px dotted #eee} .patient_form .box_white form[name="patForm"] input[type="date"] {width: 130px!important; letter-spacing: -1px} .patient_form .box_white form[name="patForm"] .profile .table table {border: 0} .patient_form .box_white form[name="patForm"] .profile .table tr td {background: #fff; padding: 0} .patient_form .box_white form[name="patForm"] .profile .table tr td:hover {border-bottom: 2px solid #77a601;} .patient_form .box_white form[name="patForm"] .profile .table tr td input {background: #fff; padding: 18px 5px; height: fit-content; border: 0!important;} .patient_form .box_white form[name="patForm"] .profile .table tr td select {padding: 0px; height: fit-content;} .patient_form .box_white form[name="patForm"] .profile {margin-bottom: 25px; padding-bottom: 25px; border-bottom: 2px dotted #eee} .patient_form .box_white form[name="patForm"] .profile input[type="number"]{padding-right: 0;} .patient_form .box_white form[name="patForm"] > .table table{border: 0} .patient_form .box_white form[name="patForm"] > .table table th {padding: 5px 7.5px; border-bottom: 0;} .patient_form .box_white form[name="patForm"] > .table table td {padding: 0px 7.5px; } .patient_form .box_white form[name="patForm"] > .table table input { background: #fff!important; padding: 10px 0; border-bottom: 1px solid #fff0} .patient_form .box_white form[name="patForm"] > .table table input:hover { border-bottom: 1px solid #fff0!important;} .patient_form .box_white form[name="patForm"] > .table td:hover {border-bottom: 2px solid #77a601;} .patient_form .profile.flex > span:nth-of-type(2){width: calc( 100% - 130px )} .patient_form .tab-contents { padding: 15px; background-color: #f4f4f4; border-color: #f4f4f4;} .patient_form .tab-contents > div > .box { border-radius: 3px;} .patient_table .table tr{transition: all 0.2s ease;} .patient_table .table tr:hover td{background: #77a60120!important; transition: all 0.2s ease;cursor: pointer} .profile_thumb { width: 120px; min-width: 120px; height: 158px;aspect-ratio: 3/4!important; border-radius: 3px; border: 1px solid #eee; position: relative } .profile_thumb.v2 { width: auto; min-width: 106.5px; height: 142px;} .profile_thumb label{ position: absolute; bottom: 10px; right: 10px } .profile_thumb img {width: 100%; height: 100%; object-fit: cover } .patient_type {padding: 25px} .patient_type > h1 {font-weight: 700; font-size: 1.45em; display: inline-block; padding: 0 0 15px;} .patient_list {padding: 25px} .patient_list > h1 {font-weight: 700; font-size: 1.45em; display: inline-block; padding: 0 0 15px;} .patient_list .table {max-height: 450px; overflow-y: auto} #togglePatient { display: none;} #toggleDiv { display: none; } label:has(#togglePatient) {position: relative;cursor: pointer;} label:has(#togglePatient:checked) { color: #77a601;} label:has(#togglePatient:checked) #toggleDiv { color: #000!important;background: #fff; z-index: 1; display: block; position: absolute; top: 40px; left: 50%; transform: translateX(-50%); width: 120px; padding: 10px; border: 1px solid #eee; border-radius: 3px} label:has(#togglePatient:checked) #toggleDiv ul{padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px solid #eee} .patient_table .panel {margin: 0} .patient_table .tagbox ul {display: flex; align-items: center; gap: 5px} .patient_info div.guard {border-radius: 3px; padding: 15px; background-color: #fff; display: flex; border-color: #fff;align-items: center; gap:10px} .patient_info div.guard button{margin-left: auto} #patientInfoModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #patientInfoAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #entryPrintModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #patientAgreeModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #patientAgreeModal .modal-body li {padding: 5px 0; display: flex; align-items: center; justify-content: space-between} #patientMediModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #patientMediModal .modal-body li {padding: 5px 0; display: flex; align-items: center; justify-content: space-between} #patientCostModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #patientCostModal .modal-body li {padding: 5px 0; display: flex; align-items: center; justify-content: space-between} #patientTest1Modal .modal-body > label:not(:first-of-type) {margin-top: 10px} #patientTest1Modal .highlight { background-color: #d9ead3;} #patientTest1Modal tr td:not(:first-of-type) {cursor: pointer} #patientTest1Modal .modal-body li {padding: 5px 0; display: flex; align-items: center; justify-content: space-between} /**/ /* body:has(.patient_dashboard) {background: #e6eaea} body:has(.patient_dashboard) header {background: #EDEFF0; border-color: #fff}*/ .patient_dashboard .box_gray3 select{background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .patient_dashboard .box_gray3 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff} .patient_dashboard .box_gray3 .btn{padding: 4px 5px; font-size: 14px; height: 30px} .patient_dashboard .box_gray3 .btn_search{background: #515151;color: #fff;} .patient_dashboard .box_gray3 .tagbox.v2 {margin-bottom:10px} .patient_dashboard .box_gray3 .tagbox {gap: 5px} .patient_dashboard div.profile {position: relative} .patient_dashboard .btn_mini.btn_search {height: 30px!important;} .patient_dashboard .box_line {background: #fff; padding: 5px; } .patient_dashboard .bg0 .box_line, .patient_dashboard .bg1 .box_line, .patient_dashboard .bg2 .box_line, .patient_dashboard .bg4 .box_line, .patient_dashboard .bg3 .box_line {background: #fff0; padding: 5px; border: 0; border-radius: 0} .patient_dashboard .bg0 {background: #e0f1b6; border-radius: 5px; /*border: 1px solid #00000020;*/} .patient_dashboard .bg1 {background: #e1e8cf; border-radius: 5px; /*border: 1px solid #00000020;*/} .patient_dashboard .bg2 {background: #d8eae4; border-radius: 5px; /*border: 1px solid #00000020;*/} .patient_dashboard .bg3 {background: #dae5d4; border-radius: 5px; /*border: 1px solid #00000020;*/} .patient_dashboard .bg4 {background: rgba(201, 222, 218, 0.58); border-radius: 5px; /*border: 1px solid #00000020;*/} .patient_dashboard .expand {grid-column: 1 / 3;} .patient_dashboard .bg2 p.mb5 {color: #506d31;} .patient_dashboard .bg3 p.mb5 {color: #5e6d31;} .patient_dashboard .btn_mini {margin: 0;padding: 4px !important;} .patient_dashboard div.pagination {margin-top: 0px; margin-bottom: 0} .patient_dashboard .box_line table td.txt_gray {font-size:0.8em; text-align: center} .patient_dashboard .left input[type="number"]::-webkit-outer-spin-button {-moz-appearance: textfield;-webkit-appearance: none;appearance: none!important;opacity: 0;;} .patient_dashboard .left input[type="text"], .patient_dashboard .left input[type="date"], .patient_dashboard .left input[type="number"], .patient_dashboard .left input[type="time"] {background: #fff0; padding: 0; height: fit-content;border-radius: 0; border: 0} .patient_dashboard .left select {background-color: #fff0; padding: 0; height: fit-content;border-radius: 0;border: 0} .patient_dashboard #attach + .box_line div:has(.fa-folder-arrow-down):hover > *{color:#77a601; cursor: pointer} .patient_dashboard textarea {background: #fff0; padding: 0; max-height: 30px;border-radius: 0; min-width: unset; border: 0} .patient_dashboard .profile_thumb {width: 95px; min-width: 95px; height: auto} .patient_dashboard .profile_thumb ~ * .info {display: flex} .patient_dashboard .patient_search .panel {margin-bottom: 0;display: flex;gap: 5px;align-items: center;position: relative;} .patient_dashboard #patientWrap {position: relative} .patient_dashboard #patientFix {position: absolute; top: 70px; max-height: 200px; overflow-y: auto; box-shadow: 0 0 15px #00000020; width:350px;z-index: 3; padding: 5px 10px} .patient_dashboard #patientFix li {display: flex; align-items: center; justify-content: space-between; padding-top: 7px} .patient_dashboard #patientFix li:not(:last-of-type) {padding-bottom: 7px; border-bottom: 1px dotted #eee; } .patient_dashboard #patientFix li:first-of-type{padding-top: 0px } .patient_dashboard .table {width: 100%} .patient_dashboard .table td .flex .icon {height: fit-content;} .patient_dashboard .table td .fa-chevron-down {font-size: 0.5em} .patient_dashboard .table table{border: 0} .patient_dashboard form > .box_line .table table th { background: #f3f3f3;} .patient_dashboard .table table th {padding: 0px 5px 0; border-bottom: 0; border-top: 1px solid #00000030; background: #fff0; font-size: 0.8em; } .patient_dashboard .table table td {padding: 3px 5px; background: #fff0;border-color: #00000030;max-width: 150px; overflow: hidden; /text-overflow: ellipsis;white-space: nowrap; } .patient_dashboard .table table input {border-bottom: 1px solid #fff0} .patient_dashboard .table table input:hover { border-bottom: 1px solid #fff0!important;} .patient_dashboard .table td:hover {border-bottom: 2px solid #77a601;} .patient_dashboard .table tr.double td > *:not(:last-child) {padding-bottom:5px;margin-bottom:5px;border-bottom: 1px solid #eee} .patient_dashboard .tagbox ul {display: flex; align-items: center; gap: 5px} .patient_dashboard h6.txt_bold2 {display: flex; align-items: center; gap: 5px; font-size: 16px; color: #000} .patient_dashboard h6.txt_bold2 a {font-size: 0.7em; opacity: 0.3; margin-top: 0px} .patient_dashboard h6.txt_bold2 a.btn {font-size: 9px; opacity: 1; margin-top: 0px; margin: 2px;} .patient_dashboard h6.txt_bold2 a:hover { opacity: 0.7;} .patient_dashboard p.mb5 {display: flex; align-items: center; gap: 5px; font-weight: 600; margin-bottom: 0!important; color: #5c6d31; padding: 2px 10px;} .patient_dashboard p.mb5 a {color: #000; mix-blend-mode: darken;opacity: 0.5;} .patient_dashboard p.mb5 a:hover { opacity: 1;} .patient_dashboard p.mb5 i {font-size: 0.8em;; margin-top: 3px} .active .patient_dashboard .left_side {position: fixed; top: 40px; left: 0px} .patient_dashboard .grid.grid2 { align-items: stretch;gap: 15px} .patient_dashboard .left_side {box-shadow: 0px 0px 10px #00000000, 0px 0px 10px #00000010;position: fixed; top:88px; left: 0px; transition: all .3s ease} .patient_dashboard .left_side li a {display: flex; align-items: center; gap: 0px; font-weight: 600; flex-direction: column; font-size: 12px; padding: 14px 5px 6px; background: #fff;} .patient_dashboard .left_side li:not(:last-child) a {border-bottom: 1px solid #f9f8f8} .patient_dashboard .left_side li:hover a {background: #77a60120; color: #77a601} .patient_dashboard .left_side li h6 {font-size: 12px; background: #77a60120; color: #77a601; text-align: center} .patient_dashboard .memo_list {display: flex;flex-direction: column;padding: 5px;border:1px solid #dbdbdb;border-radius: 5px;background: #fdfdfd;; margin-bottom: 15px} .patient_dashboard .memo_list .box:not(:last-of-type){margin-bottom: 5px} .patient_dashboard .memo_list textarea {max-height: 50px; border-bottom: 1px solid #eee} .patient_dashboard .date_list ul li a { border: 1px solid #959595;letter-spacing: -.5px;border-left: 2px solid #959595; display: flex; align-items: center; gap: 5px;font-size: 13px;padding: 5px 10px; border-radius: 3px; background: #fff;color: #494949} .patient_dashboard .date_list ul li:not(:last-child) a{margin-bottom: 5px} .patient_dashboard .date_list ul li:hover a {background: #77a60120; color: #77a601} .patient_dashboard .date_list ul li a i {font-size: 0.8em; opacity: 0.3; margin-top: 1px} .patient_dashboard .date_list ul li a:has(strong) {border-left: 4px solid #77a601} .patient_dashboard .date_list ul li a b {margin-left: auto} .patient_dashboard .date_list {display: flex;flex-direction: column;padding: 5px;border:1px solid #dbdbdb;border-radius: 5px;background: #fdfdfd; margin-bottom: 15px} .patient_dashboard .equip_list ul li a { border: 1px solid #959595;letter-spacing: -.5px;border-left: 2px solid #959595; display: flex; align-items: center; gap: 5px;font-size: 13px; padding: 5px 10px; border-radius: 3px; background: #fff;color: #494949} .patient_dashboard .equip_list ul li:not(:last-child) a{margin-bottom: 5px} .patient_dashboard .equip_list ul li:hover a {background: #77a60120; color: #77a601} .patient_dashboard .equip_list ul li a i {font-size: 0.8em; opacity: 0.3; margin-top: 1px} .patient_dashboard .equip_list ul li a:has(strong) {border-left: 2px solid #77a601} .patient_dashboard .equip_list ul li a b {margin-left: auto} .patient_dashboard .equip_list {display: flex;flex-direction: column;padding: 5px;border:1px solid #dbdbdb;border-radius: 5px;background: #fdfdfd; margin-bottom: 15px} .patient_dashboard .log_list ul li a { border: 1px solid #959595;letter-spacing: -.5px;border-left: 2px solid #959595; display: flex; align-items: center; gap: 5px;font-size: 13px;padding: 5px 10px;; border-radius: 3px; background: #fff;color: #494949} .patient_dashboard .log_list ul li:not(:last-child) a{margin-bottom: 5px} .patient_dashboard .log_list ul li:hover a {background: #77a60120; color: #77a601} .patient_dashboard .log_list ul li a i {font-size: 0.8em; opacity: 0.3; margin-top: 1px} .patient_dashboard .log_list ul li .icon {font-size: 10px;} .patient_dashboard .log_list ul li a:has(strong) {border-left: 2px solid #77a601} .patient_dashboard .log_list ul li a b {margin-left: auto; max-width: 100px; width: fit-content} .patient_dashboard .log_list {display: flex;flex-direction: column;padding: 5px;border:1px solid #dbdbdb;border-radius: 5px;background: #fdfdfd; margin-bottom: 0px} .patient_dashboard .box_color { display: flex; align-items: center; gap: 5px; color: #494949FF } .patient_dashboard .box_color div { font-size: 12px;margin-left: auto} .patient_dashboard .box_white { display: flex; align-items: flex-start; gap: 5px; color: #494949FF } .patient_dashboard .box_white div { font-size: 12px;margin-left: auto}/* .patient_dashboard img:not(#imagePreview) {filter: hue-rotate(215deg) brightness(0.8) contrast(2);}*/ @media screen and (max-width: 1800px) { .patient_dashboard .grid_v2 { margin-left: 50px; padding: 0 40px 0 20px; } } div.pagination {display: flex;justify-content: center;margin: 0 0 10px;margin-top: auto;gap: 4px;} div.pagination a {color: #b7b7b7;padding: 2px 2px;text-decoration: none;font-size: 12px;height: fit-content;line-height: 10px;border-radius: 2px;} div.pagination a.active {color: #77a601;font-weight: 800;} div.pagination a:hover:not(.active) {background-color: #ddd;} #patStatusModal .modal-body > label {margin-top: 10px} #todayModal .modal-body{ font-size: 16px;} #todayModal .box_colorline { font-size: 20px; border-radius: 5px; color: #77a601 } #payModal .modal-body{ font-size: 16px;} #payModal .modal-body span.icon {width: 100px} #countModal .modal-body{ font-size: 16px;} #countModal .modal-body span.icon {width: 80px} #countModal .modal-body .grid {row-gap: 10px} .memo_popup {padding: 20px} .memo_popup .box.box_white {margin-bottom: 10px} /**/ .program_upload {padding: 25px} .program_upload > h1 {font-weight: 700; font-size: 1.45em; display: inline-block; padding: 0 0 15px;} .program_upload .nav-tabs li {width: 100%} .program_upload p {margin: 15px 0 10px; font-weight: 600; } .program_upload div.box_white > div:first-of-type {margin: 00px 0 10px; padding-bottom: 15px; border-bottom: 1px solid #eee} .program_upload div.box_white > div:first-of-type p {margin: 00px 0 10px} .program_month .sunday p{color: #ff1010;} .program_month .saturday p{color: #1078ff;} .program_month .today{background-color: #77a60120!important; border-top: 3px solid #77a601;} .program_month .table.month table td {height: 160px; vertical-align: baseline; padding: 5px 0; position: relative;background: #eeeeee75; border-radius: 15px; border: 2px solid #fff} .program_month .table.month table td.next {opacity: 0.1;} .program_month .table.month table td.prev {opacity: 0.1;} .program_month .table.month table td.today > *:not(p) {background: #fff!important; } .program_month .table.month table td > p {font-weight: 800; font-size: 18px; padding: 0 10px 5px} .program_month .table.month table td > *:not(p) {cursor: pointer; color: #000!important; font-size: 14px; line-height: 18px} .program_month .table.month table td > * a {color: #000!important; font-weight: 500} .program_month .table.month table td > .spec a {color: #77a601!important;} .program_month .table.month table td > .spec a span{color: #77a601!important;} .program_month .table.month table td > * a.modify {color: #000!important;margin-left: auto; opacity: 0.4; font-size: 12px} .program_month .table.month table td > * a.modify i {position: relative; bottom: 1px} .program_month .table.month table td > * + *{margin-top: 5px} .program_month .table.month table td .icon_big {padding: 5px; border-radius: 0; align-items: end; background: #ffffff70 !important; border-left: 2px solid #000} .program_month .table.month table td .spec.icon_big { border-left:2px solid #77a601} .program_month .table.month table td:not(.today) .spec.icon_big { border-left: 2px solid #77a60150} .program_month .table.month table td:not(.today) .icon_big { border-left: 2px solid #00000020} #programScdModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #programScdModal .modal-body li {padding: 5px 0; display: flex; align-items: center; justify-content: space-between} #programScdModal .modal-body .flex {flex-wrap: wrap} #programScdModal .modal-body .flex > input {width: 50%} #programScdModal .modal-body .flex > button {width: 50px} #programScdModal .modal-body .flex > input:nth-of-type(3) {width: calc( 100% - 50px )} #programScdModal .modal-body .flex:not(:first-of-type) {margin-top: 10px} #programAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #programAddModal .modal-body li {padding: 5px 0; display: flex; align-items: center; justify-content: space-between} .program_view .box_gray {position: relative} .program_view #patientWrap {position: relative} .program_view #patientFix {position: absolute; top: 50px; right: 0; max-height: 100px; overflow-y: auto; box-shadow: 0 0 15px #00000010; width: 400px;z-index: 3} .program_view #patientFix li {display: flex; align-items: center; justify-content: space-between; padding-top: 10px} .program_view #patientFix li:not(:last-of-type) {padding-bottom: 10px; border-bottom: 1px dotted #eee; padding-top: 0px} #dateToggle + label {position: relative} #dateToggle + label + #dateDiv {display: none} #dateToggle:checked + label { color: #77a601;} #dateToggle:checked + label + #dateDiv { color: #000!important;background: #fff; z-index: 1; display: block; position: absolute; top: 50px; right: 10px; width: 210px; padding: 10px; border: 1px solid #eee; border-radius: 3px} #dateToggle:checked + label + #dateDiv > ul li{padding: 5px 0; border-bottom: 1px solid #eee} #dateToggle:checked + label + #dateDiv > ul li a {display: block; letter-spacing: -.5px} #dateToggle:checked + label + #dateDiv > ul li:hover a {font-weight: 700} #dateToggle:checked + label + #dateDiv > ul li:last-of-type{padding: 5px 0 0; border-bottom: 0} #dateToggle:checked + label + #dateDiv > ul li:first-of-type{padding: 0 0 5px; } .program_view .box.box_gray table td {align-content: baseline;} .program_view div.box_colorline {padding: 10px; gap: 10px;border-radius: 5px; align-items: center} .program_view div.box_white {padding: 10px; gap: 10px;border-radius: 5px; align-items: center; margin-bottom: 50px} .program_view div.box_white:not(:last-of-type) {border-bottom: 1px solid #eee} .program_view div.box_white .flex { gap: 10px; align-items: center; position: relative} .program_view div.box_white .w60px + .flex {width: calc( 100% - 70px )} .program_view .box_white ul {border-radius: 5px;padding: 10px;margin-bottom: 0!important;} .program_view .box_white ul li {display: flex; align-items: center;gap: 5px} .program_view .box_white ul.sign li {position: relative} .program_view .box_white ul.sign li div {position: absolute;top: 50px;right: 0;} .program_view hr {display: block} .program_view .photo-upload {display: flex;flex-wrap: wrap;align-items: center;gap: 10px;} .program_view .preview-list {display: flex;flex-wrap: wrap;gap: 10px;} .program_view .preview-item {position: relative;width: 120px;height: 120px;overflow: hidden;border-radius: 6px;} .program_view .preview-item img {width: 100%;height: 100%;object-fit: cover;border: 1px solid #ddd;border-radius: 6px;} .program_view .preview-item button {line-height: 22px;position: absolute;top: 4px;right: 4px;background: rgba(0,0,0,0.6);color: #fff;border: none;border-radius: 50%;width: 22px;height: 22px;cursor: pointer;} .program_view .upload-btn {display: flex;align-items: center;justify-content: center;width: 120px;height: 120px;background: #555;color: #fff;border-radius: 6px;cursor: pointer;font-size: 14px;} .program_photo {padding: 25px} .program_photo > h1 {font-weight: 700; font-size: 1.45em; display: inline-block; padding: 0 0 15px;} .program_photo .thumb-swiper {margin-bottom: 5px} .program_photo .thumb-swiper .swiper-slide img {width: 100%; aspect-ratio: 1/1; object-fit: cover; cursor: pointer; border-radius: 5px} .program_photo .swiper-slide img {width: 100%} .program_print h6 {padding-left: 15px; border-left: 3px solid #666666; margin-top: 25px} .program_print .title {display: flex; flex-direction: column; gap: 10px; margin: 15px 0 25px} .program_print .table .select {display: flex; gap: 10px; margin: 15px 0 25px; align-items: center} .program_print .table .select b {width: 100px} .program_print table td div > div > b {word-break: break-all;} .program_print .img-select {display: flex; gap: 10px; margin: 15px 0 25px} .program_print .img-select input {display: none} .program_print .img-select label {border: 1px solid #949494; width: 150px; aspect-ratio: 21/29.7; opacity: 0.3; cursor: pointer} .program_print .img-select label:has(:checked) {border: 1px solid #77a601; opacity: 1} .program_print .img-select label img {width: 100%; height: 100%; object-fit: cover } .program_print .table tr:nth-of-type(even) td {background: #ffffffe8;} .program_print table.day5 tr > td {width: calc( 100% / 5 ) !important} .program_print table.day5 tr > *:first-of-type {display: none} .program_print table.day5 tr > *:last-of-type {display: none} .program_print table.day7 tr > td {width: calc( 100% / 7 ) !important} .program_print table.day7 tr > *:first-of-type {display: table-cell} .program_print table.day7 tr > *:last-of-type {display: table-cell} .program_print table td {height: 160px; vertical-align: baseline} .program_print table td.prev > * {display: none!important;} .program_print table td.next > * {display: none!important;} .program_print table td div > div {text-align: center!important; padding: 0!important; margin-top: 5px} .program_print table td div > div.sub {text-align: center!important; padding: 0!important; margin-top: 0px} .program_print table td div > div > b {font-weight: 800; font-size: 1.6em} .program_print table td div > div.program1 > b {color: #000} .program_print table td div > div.program2 > b {color: #2961d0!important;} .program_print table td div > div.program3 > b {color: #e10266!important;} .program_print table td div > div.program4 > b {color: #178000!important;} .program_print table td div > div.program5 > b {color: #a60af6!important;} .program_print table td div > div.program6 > b {color: #f6880a !important;} .program_print table td div > div.program7 > b {color: #14a4a4 !important;} .program_print table.skin1 th {font-size: 1.75em; text-align: center; font-weight: 800; background: #000; color: #fff; padding: 20px 0; border-bottom: 2px solid #000;} .program_print table.skin1 td p {display: inline-block; padding: 5px 10px; border-radius: 50px; font-weight: 800; background: #000; color: #fff} .program_print table.skin2 th {font-size: 1.75em; text-align: center; font-weight: 800; background: #fff; color: #2961d0; padding: 20px 0; border-bottom: 2px solid #2961d0;} .program_print table.skin2 td p {display: inline-block; padding: 5px 10px; border-radius: 50px; font-weight: 800; background: #2961d0; color: #fff} .program_print table.skin3 th {font-size: 1.75em; text-align: center; font-weight: 800; background: #ffcce2; color: #e10266; padding: 20px 0; border-bottom: 2px solid #e10266;} .program_print table.skin3 td p {display: inline-block; padding: 5px 10px; border-radius: 50px; font-weight: 800; background: #e10266; color: #fff} .program_print table.skin4 th {font-size: 1.75em; text-align: center; font-weight: 800; background: #ffd01f; color: #000; padding: 20px 0; border-bottom: 2px solid #000;} .program_print table.skin4 td p {display: inline-block; padding: 5px 10px; border-radius: 50px; font-weight: 800; background: #ffd01f; color: #000} .program_print table.skin5 th {font-size: 1.75em; text-align: center; font-weight: 800; background: #77a601; color: #fff; padding: 20px 0; border-bottom: 2px solid #e0ff96;} .program_print table.skin5 td p {display: inline-block; padding: 5px 10px; border-radius: 50px; font-weight: 800; background: #77a601; color: #fff} /**/ .box_today {padding: 0 10px;align-items: center;margin-bottom: 10px;display: flex; gap: 5px ; background: linear-gradient(to right, #eaf2de, #f2fcf7);color: #77a601;} .box_today a { font-weight: 700; color: #000} .overnight_main .fa-user-nurse {font-size: 0.7em; margin-top: 2px} .overnight_main .fa-user-doctor {font-size: 0.7em; margin-top: 2px} .overnight_list td i {font-size: 0.6em; opacity: 0.3;margin-right: 5px;margin-bottom: 0px;position: relative;top: -1px;} .overnight_summary .grid3 ul {min-height: 169px;max-height: 200px;overflow: auto;position: relative;} .overnight_summary .grid3 ul li {display: flex; align-items: center; padding: 5px 5px 5px 10px; border: 1px solid #eee; margin-top: 5px; gap: 5px; border-radius: 3px } .overnight_summary .grid3 ul li.top {margin-top: 0px; margin-bottom: 13px; background: #f9f9f9!important; font-weight: 600; font-size: 1.15em; cursor: pointer;position: sticky;z-index: 1;top: 0px; } .overnight_summary .grid3 ul li b {color: #77a601} .overnight_summary .grid3 ul:nth-child(1) li b {width: 40px } .overnight_summary .grid3 ul:nth-child(2) li b {width: 60px } .overnight_summary .grid3 ul:nth-child(3) li b {width: 60px } .overnight_summary .grid3 ul li button.btn_color {margin-left: auto} .overnight_summary .grid3 ul li a {margin-left: auto} .overnight_summary .grid3 ul.new li {background: #FBFFF2} .overnight_summary .grid2 ul {min-height: 169px;} .overnight_summary .grid3 ul li a.btn { margin-left: auto;} .overnight_summary .grid3 ul li span:not(.icon) {background: #f3f3f3; padding: 0px 3px; font-size: 11px; font-weight: 600} .overnight_summary .grid2 ul li {display: flex; align-items: center; padding: 5px 5px 5px 10px; border: 1px solid #eee; margin-top: 5px; gap: 5px; border-radius: 3px } .overnight_summary .grid2 ul li.top {margin-top: 0px; margin-bottom: 13px; background: #f9f9f9!important; font-weight: 600; font-size: 1.15em; cursor: pointer } .overnight_summary .grid2 ul li.top i { font-size: 0.85em } .overnight_summary .grid2 ul li b {color: #77a601} .overnight_summary .grid2 ul li button {margin-left: auto} .overnight_summary .grid2 ul.new li {background: #FBFFF2} .overnight_summary .grid2 ul li a.btn {margin:0} .overnight_summary .grid2 ul li a.btn_gray {margin-left: auto} .overnight_summary .grid2 ul li a.btn_color {margin-left: auto} .overnight_summary .grid2 ul li span {background: #f3f3f3; padding: 0px 3px; font-size: 11px; font-weight: 600} .overnight_summary .empty i {font-size: 5em; margin-bottom: 15px} .overnight_setting .profile button {padding: 5px} .overnight_setting .box_color2 {display: flex; align-items: center; gap: 10px} .overnight_setting .box_color2 p:first-of-type {margin-right: auto} .overnight_setting .box_color2 p {color: #fff; font-size: 1.35em} .overnight_setting .box_color2 p a {color: #EAFFBB;text-decoration: underline;} .overnight_setting .mb15 .flex > button {width: 100%; height: fit-content;font-size: 1.05em} .overnight_setting .mb15 .flex > button i {margin-right: 10px} .overnight_setting .table {letter-spacing: -1px} .overnight_setting .table tr{transition: all 0.2s ease;} .overnight_setting .table tr:hover td{background: #77a60120!important; cursor: pointer;transition: all 0.2s ease;} .overnight_setting .patient_search .panel {margin-bottom: 0;display: flex;gap: 5px;align-items: center;position: relative;} .overnight_setting #patientWrap {position: relative} .overnight_setting #patientFix {position: absolute; top: 50px; left: -10px; max-height: 200px; overflow-y: auto; box-shadow: 0 0 15px #00000020; width: calc( 100% + 20px );z-index: 3} .overnight_setting #patientFix li {display: flex; align-items: center; justify-content: space-between; padding-top: 10px} .overnight_setting #patientFix li:not(:last-of-type) {padding-bottom: 10px; border-bottom: 1px dotted #eee; } .overnight_setting #patientFix li:first-of-type{padding-top: 0px } .overnight_setting .box_gray3 select{background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .overnight_setting .box_gray3 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff} .overnight_setting .box_gray3 .btn{padding: 4px 5px; font-size: 14px; height: 30px} .overnight_setting .box_gray3 .btn_search{background: #515151;color: #fff;} .overnight_setting .box_gray3 .tagbox.v2 {margin-bottom:10px} .overnight_setting .box_gray3 .tagbox {gap: 5px} .overnight_setting .tagbox ul {display: flex; align-items: center; gap: 5px} .overnight_month .sunday p{color: #ff1010;} .overnight_month .saturday p{color: #1078ff;} .overnight_month .today{background-color: #77a60120!important; border-top: 3px solid #77a601;} .overnight_month .holiday{background-color: #ff101020!important;} .overnight_month .table.month table th {text-align: center;} .overnight_month .table.month table td {height: 80px; vertical-align: baseline;padding: 5px 0; position: relative;background: #eeeeee75; border-radius: 15px; border: 2px solid #fff} .overnight_month .table.month table td > p {font-weight: 800; font-size: 18px; padding: 0 10px 5px} .overnight_month .table.month table td.sunday {position: relative;z-index: 2;} .overnight_month .table.month table td.sunday {position: relative;z-index: 2;} .overnight_month .table.month table td button.toggle-btn {position: absolute; top: 0; right: 0} .overnight_month .table.month table td button.toggle-btn:not(.open) {left: 10px; top: unset; right: unset; bottom: 10px; width: calc( 700% - 10px )} .overnight_month .table.month table td > div {cursor: pointer; width: 100%; gap: 5px; align-items: center; flex-wrap: wrap; padding: 5px; display: inline-grid;grid-template-columns: 1fr;} .overnight_month .table.month table td > div ul{grid-column: 1 / 3;display: flex; flex-direction: column;align-items: start;; justify-content: flex-start; gap: 2.5px; flex-wrap: wrap;} .overnight_month .table.month table td > div ul li{font-weight: 500; font-size: 13px; color: #2A2A2A;display: flex;; gap: 2.5px } .overnight_month .table.month table td > div.icon_gray2 ul li{color: #f2f2f2 } .overnight_month .table.month table td > div ul li span{color: #7c7c7c} .overnight_month .table.month table td > div.icon_gray2 ul li span{color: #fff} /*.overnight_month .table.month table td > div ul li:not(:last-of-type):after{ color: #b2b2b2; display: block; content: '|'}*/ .overnight_month .table.month table td div.icon{border-right:0!important; border-bottom:0!important;border-top:0!important; border-radius: 0!important; border-left-width: 2px!important;} .overnight_month .table.month table td div.icon.icon_line{background: #d9d9d920 !important;} .overnight_month .table.month table td > div + div{margin-top: 5px} .overnight_month .table.month table td > div .icon{width: fit-content} .overnight_month .table.month table td.next {opacity: 0.1;} .overnight_month .table.month table td.prev {opacity: 0.1;} .overnight_month .table.month tr:has(.today) td {background: #ececec;} .overnight_month .table.month table td div.icon.icon_greenline {background: #d9d9d930 !important; color: #444444 !important;} .overnight_month .table.month table td.today div.icon.icon_greenline {background: #fff !important;border-left-width: 2px!important; border-color: #74A300 !important;} .overnight_month .table.month table td div.icon.icon_blackline {background: #d9d9d930 !important; color: #444444 !important;} .overnight_month .table.month table td.today div.icon.icon_blackline {background: #fff !important;border-left-width: 2px!important; border-color: #000000 !important;} .overnight_month .table.month table td div.icon.icon_gray2 {background: #888 !important; color: #fff !important;} .overnight_month .table.month table td.today div.icon.icon_gray2 {background: #222 !important;border-left-width: 2px!important; border-color: #000000 !important;} .overnight_view .box_white > h6 {margin: 25px 0 15px; color: #717171; font-weight: 900} .overnight_view .box_gray > label {margin: 20px 0 10px; } .overnight_view .box_white ul.sign {display: flex; align-items: flex-start; border-radius: 5px;gap: 10px} .overnight_view .box_white ul.sign li {width: 100%;} .overnight_view .box_white ul.sign li div{ background-position: center center !important;padding: 0px; position: relative; background-color: #fff; width: 100%; height: 250px; border: 1px solid #74A300; background-size: cover!important; border-radius: 5px} .overnight_view .box_white ul.sign li.done div{background-color: #e0e0e0 !important; border: 1px solid #fff0; } .overnight_view .box_white ul.sign li:not(.done) div > span {color: #74A300;} .overnight_view .box_white ul.sign li div > span {width: 100%; ;position: relative; display: flex; align-items: center; gap: 10px} .overnight_view .box_white ul.sign li div > button{position: absolute; bottom: 0; right: 0} .overnight_view .box_white ul.sign li div > a{position: absolute; left: 50%; top: 50%; width: 100%; height: 50%; transform: translate(-50%, -50%)} .overnight_view .box_white ul.info {display: flex; align-items: center; padding: 10px; border-radius: 5px; background: #fff; gap: 10px} .overnight_view .box_white ul.info li {display: flex; align-items: center;gap: 5px } .overnight_view .box_white ul.info li label {color: #74A300; font-size: 1.1em; font-weight: 800 } .overnight_view .box_white ul.info li input{width: fit-content } .overnight_view .box_white ul.info li select{width: fit-content } .overnight_view .box_white ul.info li:last-of-type {margin-left: auto } .overnight_sign {max-width: 1250px; margin: 50px auto} .overnight_sign .box_white ul.info {display: flex; align-items: center; padding: 10px; border-radius: 5px; background: #fff; gap: 10px} .overnight_sign .box_white ul.info li {display: flex; align-items: center;gap: 5px } .overnight_sign .box_white ul.info li label {color: #74A300; font-size: 1.1em; font-weight: 800 } .overnight_sign .box_white ul.info li input{width: fit-content } .overnight_sign .box_white ul.info li select{width: fit-content } .overnight_sign .box_white ul.info li:last-of-type {margin-left: auto } .overnight_sign .box_white > h6 {margin: 25px 0 15px; color: #717171; font-weight: 900} .overnight_sign .box_gray > label {margin: 20px 0 10px; } .overnight_sign #signature {max-width: unset; margin-top: 25px} .overnight_sign #signature:after {font-size: 2.5em;} .overnight_sign #signature canvas {border-color: #74A300; border-radius: 10px} .overnight_setup .box_gray > label:not(:first-of-type) {margin-top: 10px} .overnight_setup .box_gray > .gap5 {margin-top: 10px} #overnightSignModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #overnightSetModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #overnightAddModal .modal-body > label {margin-top: 10px} #overnightAddModal .modal-body > div > label {margin-top: 10px} .search_ul {display: grid;grid-template-columns: repeat(2, 1fr); gap: 5px} .search_ul li {display: flex;align-items: center;justify-content: space-between} .profile.sm .table table{border: 0} .profile.sm .table table th:first-child {padding: 0px 5px 0 0; } .profile.sm .table table td:first-child {padding: 3px 5px 3px 0 } .profile.sm .table table th {padding: 0px 5px 0; border-bottom: 0; border-top: 1px solid #E6E6E6; background: #fff; font-size: 0.8em} .profile.sm .table table td {padding: 3px 5px} .profile.sm .profile_thumb.v2 {width: auto;min-width: 80px;height: 105px;} .profile.sm .profile_thumb.v3 {width: auto;min-width: 40px;height: 65px;} /**/ .visit_summary .grid3 ul {min-height: 169px;max-height: 200px;overflow: auto;position: relative;} .visit_summary .grid3 ul li {display: flex; align-items: center; padding: 5px 5px 5px 10px; border: 1px solid #eee; margin-top: 5px; gap: 5px; border-radius: 3px; letter-spacing: -0.75px } .visit_summary .grid3 ul li.top {cursor: pointer;margin-top: 0px; margin-bottom: 13px; background: #f9f9f9!important; font-weight: 600; font-size: 1.15em; letter-spacing: -0px;position: sticky;z-index: 1;top: 0px; } .visit_summary .grid3 ul li.top a {margin-left: auto} .visit_summary .grid3 ul li b {color: #77a601; } .visit_summary .grid3 ul:nth-child(1) li b {width: 40px } .visit_summary .grid3 ul:nth-child(2) li b {width: 60px } .visit_summary .grid3 ul:nth-child(3) li b {width: 60px } .visit_summary .grid3 ul li button.btn {margin:0; padding: 4px!important;} .visit_summary .grid3 ul li button.btn_color {margin-left: auto} .visit_summary .grid3 ul li a.btn {margin:0} .visit_summary .grid3 ul li a.btn_gray {margin-left: auto} .visit_summary .grid3 ul li a.btn_color {margin-left: auto} .visit_summary .grid3 ul li span:not(.icon) {background: #f3f3f3; padding: 0px 3px; font-size: 11px; font-weight: 600} .visit_summary .grid3 ul.new li {background: #FBFFF2} .visit_summary .grid2 ul {min-height: 169px;} .visit_summary .grid2 ul li {display: flex; align-items: center; padding: 5px 10px; border: 1px solid #eee; margin-top: 5px; gap: 10px; border-radius: 3px } .visit_summary .grid2 ul li.top {margin-top: 0px; margin-bottom: 13px; background: #f9f9f9!important; font-weight: 600; font-size: 1.15em } .visit_summary .grid2 ul li.top i { font-size: 0.85em } .visit_summary .grid2 ul li b {color: #77a601} .visit_summary .grid2 ul li button {margin-left: auto} .visit_summary .grid2 ul li a {margin-left: auto} .visit_summary .grid2 ul.new li {background: #FBFFF2} .visit_summary .empty i {font-size: 5em; margin-bottom: 15px} .visit_setting .box_color2 {display: flex; align-items: center; gap: 10px} .visit_setting .box_color2 p:first-of-type {margin-right: auto} .visit_setting .box_color2 p {color: #fff; font-size: 1.35em} .visit_setting .box_color2 p a {color: #EAFFBB;text-decoration: underline;} .visit_setting .mb15 .flex > button {width: 100%; height: fit-content;font-size: 1.05em} .visit_setting .mb15 .flex > button i {margin-right: 10px} .visit_setting .table tr{transition: all 0.2s ease;} .visit_setting .table tr:hover td{background: #77a60120!important; cursor: pointer;transition: all 0.2s ease;} .visit_list .table tr:nth-of-type(even) td {background: #fff;} .visit_list .table tr.today td {background: rgba(200, 206, 177, 0.13);} .visit_list .table tr.today + tr.today td {border-top: 1px solid #eee} .visit_list .table tr:not(.today) + tr:not(.today) td {border-top: 1px solid #eee} .visit_month .sunday p > a{color: #ff1010;} .visit_month .saturday p > a{color: #1078ff;} .visit_month .today{background-color: #77a60120!important; border-top: 3px solid #77a601;} .visit_month .holiday{background-color: #ff101020!important;} .visit_month .table.month table th {text-align: center;}/* .visit_month .table.month tr:nth-of-type(even) td {background: #fff;}*/ .visit_month .table.month tr:has(.today) td{background:#ececec;} .visit_list .table.month tr:nth-of-type(even) td {background: #fff;} .visit_list .table.month tr:has(.today) td{background:#ececec;} .visit_month .table.month table td {height: 80px; vertical-align: baseline; padding: 5px 0; position: relative; background: #eeeeee75; border-radius: 15px; border: 2px solid #fff} .visit_month .table.month table td.sunday {position: relative;z-index: 2;} .visit_month .table.month table td button.toggle-btn {position: absolute; top: 0; right: 0} .visit_month .table.month table td button.toggle-btn:not(.open) {left: 10px; top: unset; right: unset; bottom: 10px; width: calc( 700% - 10px )} .visit_month .table.month table td > p {font-weight: 800; font-size: 18px; padding: 0 10px 5px} .visit_month .table.month table td > div {cursor: pointer; width: 100%; gap: 5px; align-items: center; flex-wrap: wrap; padding: 5px} .visit_month .table.month table td > div + div{margin-top: 5px} .visit_month .table.month table td > div ul{display: flex; align-items: center; justify-content: flex-start; gap: 2.5px; flex-wrap: wrap;} .visit_month .table.month table td > div ul li{font-weight: 500; font-size: 13px; color: #2A2A2A;display: flex;; gap: 2.5px } .visit_month .table.month table td > div.icon_gray2 ul li{color: #f2f2f2 } .visit_month .table.month table td > div.icon_green ul li{color: #f2f2f2 } .visit_month .table.month table td div.icon{border-right:0!important; border-bottom:0!important;border-top:0!important; border-radius: 0!important; border-left-width: 2px!important;} .visit_month .table.month table td div.icon p {font-size: 15px; margin-bottom: 4px} .visit_month .table.month table td div.icon ul li {padding: 1px 0} .visit_month .table.month table td:not(.today) div.icon ul li {opacity: 0.8} .visit_month .table.month table td div.icon ul li {color: #24242499} .visit_month .table.month table td div.icon ul li b {display: inline-block; width: 45px; color: #242424;overflow: hidden;text-overflow: ellipsis;vertical-align:middle;word-break: break-all;white-space: nowrap;} .visit_month .table.month table td div.icon.icon_line{background: #d9d9d930 !important; border-color: #70707070 !important;} .visit_month .table.month table td.today div.icon.icon_line{background: #fff !important;border-left-width: 2px!important; border-color: #000000 !important;} .visit_month .table.month table td.today div.icon.icon_line p{color: #74A300!important;} .visit_month .table.month table td.next {opacity: 0.1;} .visit_month .table.month table td.prev {opacity: 0.1;} .visit_view .box_white > h6 {margin: 25px 0 15px; color: #717171; font-weight: 900} .visit_view .box_white > h6 em {font-size: 0.7em; font-weight: 600; font-style: normal} .visit_view .box_gray > label {margin: 20px 0 10px; } .visit_view .box_white ul.info {display: flex; align-items: center; padding: 10px; border-radius: 5px; background: #fff; gap: 10px} .visit_view .box_white ul.info li {display: flex; align-items: center;gap: 5px } .visit_view .box_white ul.info li label {color: #74A300; font-size: 1.1em; font-weight: 800 } .visit_view .box_white ul.info li input{width: fit-content } .visit_view .box_white ul.info li select{width: fit-content } .visit_view .box_white ul.info li:last-of-type {margin-left: auto } .visit_add .week td:has(input[type="radio"][disabled]), .visit_add div.time:has(input[type="radio"][disabled]) { background-color: #f0f0f0; opacity: 0.6; } .visit_add {padding: 20px} .visit_add > h1 {font-size: 20px; margin-bottom: 20px} .visit_add .week td {text-align: center} .visit_add .week td label {width: 100%; text-align: center} .visit_add .time_box > label {margin-top: 10px} .visit_add label {margin: 10px 0 5px} .visit_setup .box_gray > div:not(.select) > label {margin-top: 10px} .visit_setup .day_select .select input[type=checkbox]:disabled+label {opacity: 0.1} .visit_setup:not(.test) .select input[type=checkbox]+label {height: auto;padding: 5px 5px;line-height: normal;} .visit_setup .icon_big {gap: 10px; align-items: center} .visit_setup td {vertical-align: top} .visit_setup .tooltip {margin-left: -10px} .visit_setup .tooltip::after {left: 20px;} #visitSetModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #visitAddModal .modal-body > label {margin-top: 10px} #visitAddModal .modal-body > div > label {margin-top: 10px} #visitTimeModal .modal-body {background: #fff} #visitTimeModal .operation-mode {margin-bottom: 15px;display: flex; align-items: center; gap: 15px} #visitTimeModal .time-unit {margin-bottom: 15px; display: flex; align-items: center; gap: 15px} #visitTimeModal .grid.grid2 {padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #eee;} #visitTimeModal .time-range{display: flex; background: #f4f4f4; height: fit-content; align-items: center} #visitTimeModal .time-range > *{margin: 0} #visitTimeModal .day-time {margin: 15px 0 ;padding: 15px 0; } #visitTimeModal .day-time-settings { display: grid; grid-template-columns: 1fr 250px 200px; gap: 10px; row-gap: 0px} #visitTimeModal .day-time-settings button {width: 100%;text-align: right; } #visitTimeModal .info-message {font-size: 0.8em} #visitTimeListModal .time-slot {padding:10px; display: flex; gap: 10px; align-items: center; justify-content: space-between; border: 1px dotted #f4f4f4; } #visitTimeExcepModal .modal-body {background: #fff} #visitTimeExcepModal .day-time {} #visitTimeExcepModal .day-time-settings { display: grid; grid-template-columns: 1fr 250px 0200px; gap: 10px; row-gap: 0px} #visitTimeExcepModal .day-time-settings button {width: 100%;text-align: right; } #visitTimeExcepModal .time-range{display: flex; background: #f4f4f4; height: fit-content; align-items: center} #visitTimeExcepModal .time-range > *{margin: 0} #visitTimeExcepModal .grid.grid3 {padding: 15px 0; margin: 15px 0; border-bottom: 1px solid #eee;; border-top: 1px solid #eee; grid-template-columns: 1fr 2fr 1fr;} .visit_setup.test .ward-tabs {display: flex;justify-content: flex-start;margin-bottom: 20px; gap: 10px} .visit_setup.test .day-tabs {display: flex;justify-content: space-between;margin-bottom: 0px;padding-left: 80px; ; padding-top: 20px; border-top: 1px solid #eee} .visit_setup.test .day-tabs div {flex: 1;padding: 5px 10px;border: none;background-color: #f0f0f0;} .visit_setup.test .schedule-container {display: flex;position: relative; padding-bottom: 20px; border-bottom: 1px solid #eee} .visit_setup.test .time-slots {display: flex;flex-direction: column;width: 80px;position: absolute;left: 0;top: 0;} .visit_setup.test .time-slots .time {padding: 0px;border-bottom: 1px solid #eeeeee;text-align: center;height: 25px; font-size: 0.8em; color: #2A2A2A} .visit_setup.test .schedule-grid {display: grid;grid-template-columns: repeat(7, 1fr);flex: 1;margin-left: 80px; background-image: repeating-linear-gradient(to bottom, #f8f8f8 0px, #ddd 1px, transparent 1px, transparent 25px);} .visit_setup.test .schedule-column {display: grid;border-right: 1px dotted #f8f8f8;} .visit_setup.test .schedule-column:last-child {border-right: none;} .visit_setup.test .schedule-block {display: flex;justify-content: center;align-items: center;gap: 5px;flex-direction: column;border-bottom: 1px solid #ddd;} .visit_setup.test .schedule-block.available {background-color: #e0f7e0;} .visit_setup.test .schedule-block.unavailable {background-color: #f0f0f0;} .visit_setup.test .available-time {text-align: center;padding: 20px;background-color: #f9f9f9;border-radius: 5px;margin: 20px 0} .visit_setup.test .entry-list {;padding: 20px;background-color: #f9f9f9;border-radius: 5px;margin: 20px 0} .visit_setup.test .setup-info {;padding: 15px;padding-bottom:5px; background-color: #f8f9f9;border-radius: 5px;margin: 0 0 10px 0} .visit_setup.test .available-time h6 {text-align: left;} .visit_setup.test .entry-item {text-align: left;display: grid;grid-template-columns: 80px 100px 120px 200px 200px auto auto;align-items: center;padding: 10px;border-bottom: 1px solid #ddd;;gap: 10px;} .visit_setup.test .entry-item .excep + *{margin-left: auto;} .visit_setup.test .box_line2 {border-radius: 5px} #visitHolidayModal .flatpickr-calendar {width: 150px;} /**/ .charge_receipt {max-width: 1250px; margin: 50px auto} .charge_receipt .box_white ul.info {display: flex; align-items: center; padding: 10px; border-radius: 5px; background: #fff; gap: 10px} .charge_receipt .box_white ul.info li {display: flex; align-items: center;gap: 5px } .charge_receipt .box_white ul.info li label {color: #74A300; font-size: 1.1em; font-weight: 800 } .charge_receipt .box_white ul.info li input{width: fit-content } .charge_receipt .box_white ul.info li select{width: fit-content } .charge_receipt .box_white ul.info li:last-of-type {margin-left: auto } .charge_receipt .box_white > h6 {margin: 25px 0 15px; color: #717171; font-weight: 900} .charge_receipt .box_gray > label {margin: 20px 0 10px; } .charge_receipt .table.info {border: 2px solid #717171; padding: 15px; aspect-ratio: 210/297; } .charge_receipt .table.info table{height: 100%;} .charge_receipt .table.info th:last-child, .charge_receipt .table.info td:last-child { border-right: 1px solid #E6E6E6;!important;} .charge_receipt .table.info td { background: #fff!important; text-align: center} .charge_receipt .table.info td li { text-align: left} .charge_receipt .table.info td.text_left {text-align: left; vertical-align: text-top} .charge_lawsuit {max-width: 1250px; margin: 50px auto} .charge_lawsuit th .tooltip {bottom: 0;left: 50%;margin-left: 0;} .charge_lawsuit th .tooltip.tooltip::after {top: 30%;left: -10px;margin-left: 0px;border-width: 5px;border-style: solid;border-color: transparent #555 transparent transparent;} .charge_lawsuit input {height: fit-content;padding: 0; background: #fff; border: 0; border-radius: 0;border-bottom: 1px solid #eee} .charge_lawsuit .box_white ul.info {display: flex; align-items: center; padding: 10px; border-radius: 5px; background: #fff; gap: 10px} .charge_lawsuit .box_white ul.info li {display: flex; align-items: center;gap: 5px } .charge_lawsuit .box_white ul.info li label {color: #74A300; font-size: 1.1em; font-weight: 800 } .charge_lawsuit .box_white ul.info li input{width: fit-content } .charge_lawsuit .box_white ul.info li select{width: fit-content } .charge_lawsuit .box_white ul.info li:last-of-type {margin-left: auto } .charge_lawsuit .box_white > h6 {margin: 25px 0 15px; color: #717171; font-weight: 900} .charge_lawsuit .box_gray > label {margin: 20px 0 10px; } .charge_lawsuit .info {border: 2px solid #717171; padding: 40mm 20mm; } .charge_lawsuit .info h1 {margin-bottom: 30px; border-bottom: 1px solid #000; padding-bottom: 30px} .charge_lawsuit .info h6 {margin-bottom: 20px;} .charge_lawsuit .info h5 {margin-bottom: 30px; border-bottom: 1px solid #000; border-top: 1px solid #000; padding: 30px 0} .charge_lawsuit .info p {white-space: pre-line; font-size: 24px; line-height: 30px; position: relative} .charge_lawsuit .info p img {top:20px; width: 100px;position: absolute; mix-blend-mode: darken; z-index: 1; right: 20px} .charge_lawsuit select {background: unset!important;; height: fit-content; border-radius: 0; border: 0;border-bottom: 1px solid #eee; padding: 0!important; text-align: right} .charge_trial {max-width: 1250px; margin: 50px auto} .charge_trial input {height: fit-content;padding: 0; background: #fff; border: 0; border-radius: 0;border-bottom: 1px solid #eee} .charge_trial .box_white ul.info {display: flex; align-items: center; padding: 10px; border-radius: 5px; background: #fff; gap: 10px} .charge_trial .box_white ul.info li {display: flex; align-items: center;gap: 5px } .charge_trial .box_white ul.info li label {color: #74A300; font-size: 1.1em; font-weight: 800 } .charge_trial .box_white ul.info li input{width: fit-content } .charge_trial .box_white ul.info li select{width: fit-content } .charge_trial .box_white ul.info li:last-of-type {margin-left: auto } .charge_trial .box_white > h6 {margin: 25px 0 15px; color: #717171; font-weight: 900} .charge_trial .box_gray > label {margin: 20px 0 10px; } .charge_trial .info {border: 2px solid #717171; padding: 40mm 20mm;; } .charge_trial .info h1 {margin-bottom: 30px; border-bottom: 1px solid #000; padding-bottom: 30px} .charge_trial .info h6 {margin-bottom: 5px;} .charge_trial .info h5 {margin-bottom: 10px; border-bottom: 1px solid #000; padding: 30px 0 20px} .charge_trial .info p {white-space: pre-line; font-size: 24px; position: relative} .charge_trial .info p img {top:-10px; width: 100px;position: absolute; mix-blend-mode: darken; z-index: 1; right: 20px} .charge_trial .mt25 input[type=date] {margin: 0 auto} .charge_trial .editable input[type="date"] {display: inline;vertical-align: middle;} .charge_inquiry_list .mb25 button i {margin-bottom: 10px} .charge_inquiry_list .table tr{transition: all 0.2s ease;} .charge_inquiry_list .table tr:hover td{background: #77a60120!important; cursor: pointer;transition: all 0.2s ease;} .charge_inquiry .box .table > label {margin-bottom: 5px;} .charge_inquiry ul.grid5 li { border: 1px solid #fff0; letter-spacing: -.5px;display: flex; justify-content: space-between; align-items: center; padding: 10px; border-radius: 5px; color: #000; background: #f6f6f6} .charge_inquiry ul.grid5 li.red {color: #fff; background: #ff4c4c; cursor: pointer} .charge_inquiry ul.grid5 li.red2 {color: #c01515; background: #fff4f4; cursor: pointer} .charge_inquiry ul.grid5 li.black {color: #fff; background: #232323; cursor: pointer} .charge_inquiry ul.grid5 li.gray {color: #000; background: #fff; cursor: pointer; border: 1px solid #eee} .charge_inquiry ul.grid5 li b {font-size: 1.1em} .charge_inquiry .tagbox ul {display: flex; align-items: center; gap: 5px} .charge_inquiry .box_gray2 select {background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_inquiry .box_gray2 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_inquiry .box_gray2 .btn{padding: 4px 5px; font-size: 14px; height: 30px} .charge_inquiry hr {display: block} .charge_inquiry th .tooltip {bottom: -200%;width: 280px;} .charge_inquiry th .tooltip::after {top: -23%;border-color: transparent transparent #555 transparent;left: 35.6%;} .charge_copay th[data-target] {cursor: pointer} .charge_copay th[data-target]:hover {color: #39ab2b;} .charge_copay .table {max-height: 57vh;overflow-x: hidden} .charge_copay .table.opened {max-height: 75vh;} .charge_copay .table > table > tbody > tr > td > a:hover {font-weight: 600;} .charge_copay .table > table table:hover {font-weight: 400;} .charge_copay .table > table table td:hover {font-weight: 400;} .charge_copay .table .tooltip {bottom: -100%;right: 0;left: unset;width: fit-content;min-width: 100px;z-index: 3;white-space: nowrap;} .charge_copay .table .tooltip:after {display: none;} .charge_copay td a {display: inline-block;} .charge_copay td span.icon {cursor: pointer} .charge_copay td.red {color: #ff4c4c; background: #ff4c4c20} .charge_copay td.red > a {color: #ff4c4c; } .charge_copay td.red2 {color: #fff; background: #ff4c4c} .charge_copay td.red2 > a {color: #fff; } .charge_copay td a.text_right {width: 100%} .charge_copay td a.text_right {width: 100%} .charge_copay th.active {color: #39ab2b;} .charge_copay table table th {padding: 5px 7.5px;} .charge_copay .table tr:nth-of-type(even) td {background: #fff;} .charge_copay table .bg2 table td {padding: 5px 7.5px;background: #fff!important;} .charge_copay .table table > tbody > tr > td { border-bottom: 1px dashed #cecece;} .charge_copay .table .bg2 > td { border-bottom: 2px solid #9b9b9b;} .charge_copay table .bg2 table .bg3 td {background: #efffce !important;} .charge_copay table .bg4 table td {padding: 5px 7.5px;background: #fff!important;} .charge_copay .tagbox ul {display: flex; align-items: center; gap: 5px} .charge_copay .box_gray2 select{background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_copay .box_gray2 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_copay .box_gray2 .btn{padding: 4px 5px; font-size: 14px; height: 30px} .charge_copay .grid .tagbox {overflow: hidden} .charge_copay .charge_table > .table {border-top:1px solid #cecece;;} .charge_copay .charge_table > .table > table > thead tr:first-child th {backdrop-filter: blur(10px);position: sticky;z-index: 99;top: 0;} .copay_view .content-box {display: none; padding: 25px} .copay_view .content-box td {border-bottom: 1px solid #eee} .copay_view .content-box .btn_red {white-space: nowrap} .copay_view .content-box > h1 {font-weight: 700; font-size: 1.45em; display: inline-block; padding: 0 0 15px;} .copay_view #content-pay .box_line table td {vertical-align: top!important;} .copay_view #content-payment .flatpickr-wrapper {width: 50%} .copay_view #content-prepay .registeredCard {display: flex; flex-direction: column; gap: 0px; margin-top: 10px} .copay_view #content-prepay .registeredCard li {width: 100%; border-bottom: 0!important; padding-bottom: 0} .copay_view #content-prepay .registeredCard li label {color: #00000030;display: flex; align-items: center;gap: 5px; width: 100%; padding: 10px; border-radius: 5px; background: #fff; border: 1px solid #eee} .copay_view #content-prepay .registeredCard li label:has(:checked) {color: #a8bb80;background: #f0fdd7; border-color: #f0fdd7} .copay_view #content-prepay .registeredCard li b {color: #000;margin-left: auto} .copay_view #content-payment .registeredCard {display: flex; flex-direction: column; gap: 0px; margin-top: 10px} .copay_view #content-payment .registeredCard li {width: 100%; border-bottom: 0!important; padding-bottom: 0} .copay_view #content-payment .registeredCard li label {color: #00000030;display: flex; align-items: center;gap: 5px; width: 100%; padding: 10px; border-radius: 5px; background: #fff; border: 1px solid #eee} .copay_view #content-payment .registeredCard li label:has(:checked) {color: #a8bb80;background: #f0fdd7; border-color: #f0fdd7} .copay_view #content-payment .registeredCard li b {color: #000;margin-left: auto} .copay_view #content-card .box_gray label + * {margin-bottom: 5px} .swal2-popup:has(#careUploadSwal) .swal2-styled.swal2-deny {background: #00a28c!important;} #itemOnOffModal .item-box {display: flex;align-items: center;justify-content: space-between;padding: 14px 18px;background: #f8f9fb;border-radius: 10px;border: 1px solid #e5e5e5;} #itemOnOffModal .item-name {font-size: 16px;font-weight: 600;} #itemOnOffModal .switch input + .slider {background: #b2b2b2} #itemOnOffModal .switch input:checked + .slider {background: #0baa70} .charge_set #set1 table tr > * {vertical-align: top} .charge_set #set2 table tr > * {vertical-align: top} .charge_set #set2 .table-bed {width: calc( 100% / 15 )} .charge_set #set3 .box_color {color: #000} .charge_set .box_color [x-data="patientFilters"] {color: #000} .charge_set .tagbox ul {display: flex; align-items: center; gap: 5px} .charge_set .box_gray3 select{background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_set .box_gray3 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_set .box_gray3 .btn{padding: 4px 5px; font-size: 14px; height: 30px} .charge_set hr {display: block} .charge_set h5 {padding: 10px; border-bottom: 1px solid #eee; margin-bottom: 10px} .charge_copay .panel {position: relative; z-index: 999;} .charge_copay .set-menu {position: relative; margin-left: auto} .charge_copay .set-menu ul { position: absolute; flex-direction: column; top: 30px;left: 50%;transform: translateX(-50%);padding-top: 10px} .charge_copay .set-menu ul li {font-weight: 600; background: #fff; border-bottom: 1px solid #eee; text-align: center; box-shadow: 0 0 5px #00000015; white-space: nowrap} .charge_copay .set-menu ul li:hover { border-bottom: 1px solid #000;} .charge_copay .set-menu ul li a {padding: 7.5px 10px;display: block; opacity: 0.8} .charge_copay .set-menu ul li:hover a {font-weight: 800; opacity:1} .charge_cash .tagbox ul {display: flex; align-items: center; gap: 5px} .charge_cash .box_gray3 select{background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_cash .box_gray3 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .charge_cash .box_gray3 .btn{padding: 4px 5px; font-size: 14px; height: 30px} #equipReqModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #equipReqModal .modal-body > label {margin-top: 10px} #chargePayModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #chargePayModal .modal-body > label {margin-top: 10px} #prepayAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #prepayAddModal .modal-body > label {margin-top: 10px} #newCardModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #newCardModal .modal-body > label {margin-top: 0px; display: block} #refundModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #refundModal .modal-body > label {margin-top: 0px; display: block} #content-prepay .nav-tabs a {width: 100%} #content-prepay ul:not(.nav-tabs) li {display: flex; align-items: center; gap: 5px} #content-prepay ul:not(.nav-tabs) li b {margin-left: auto} #content-prepay ul:not(.nav-tabs) li:not(:last-of-type) {margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px dashed #eee} #content-prepay .tab-contents .box > label:not(:first-of-type) {margin-top: 10px} #content-prepay .tab-contents .box > label {margin-top: 0px} #content-payment .box_gray > label:not(:first-of-type) {margin-top: 10px} #content-payment .box_gray > label {margin-top: 0px} #content-payment ul:not(.nav-tabs) li {display: flex; align-items: center; gap: 5px; } #content-payment ul.pay-list li {display: grid; align-items: center; gap: 5px; grid-template-columns: 1fr 130px 130px 50px} #content-payment ul:not(.nav-tabs) li.title {font-size: 0.8em; font-weight: 500} #content-payment ul:not(.nav-tabs) li > span:not(:first-of-type) {text-align: right} #content-payment ul:not(.nav-tabs) li b {margin-left: auto} #content-payment ul:not(.nav-tabs) li:not(:last-of-type) {margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px dashed #eee} #content-payment .tooltip {width: 100px; left: 0;margin-left: -45px;} /**/ .send_form textarea {min-height: 30vh} .send_form .flex {padding: 10px 0;} .send_form .thumbnail { width: 100px; overflow: hidden; border: 2px solid #ddd; cursor: pointer; background: #fff} .send_form .thumbnail img { height: 100px!important; width: 100%; height: 100%; object-fit: cover;} .message_send .grid2 {grid-template-columns: calc(40% - 15px* 0.40) calc(60% - 15px* 0.60);; gap: 15px} .message_send .grid2 .box_gray {min-height: 65vh} .message_send .info {line-height: 1.35em; font-size: 13px} .message_send .send_list li {gap: 5px;display: flex; padding: 8px 10px; background: #fff; border: 1px solid #74A30050; align-items: center; margin-top: 10px; border-radius: 5px} .message_send .send_list li button {} .message_send .send_list li input {background: #fff; padding: 2px 5px; border: 1px solid #c5c5c5; height: fit-content;margin-left: auto} .message_send .send_list li select {padding: 2px 5px;; height: fit-content;} .message_send .send_list li:has(.none) .p_info {width: 242px} .message_send .box_grayline {border-bottom: 0} .message_send .send_list li:has(.empty) {justify-content: center} .send_choose .nav-tabs {margin-bottom: 0; gap: 0} .send_choose .nav-tabs>li>a {padding: 10px;} .send_history img {aspect-ratio: 1/1; object-fit: cover; border: 1px solid #eee} .message_board img {aspect-ratio: 1/1; object-fit: cover; border: 1px solid #eee;} .message_staff img {aspect-ratio: 1/1; object-fit: cover; border: 1px solid #eee;} #sendListModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #sendListModal .modal-body > label {margin-top: 10px} #patientGroupModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #patientGroupModal .modal-body > label {margin-top: 10px} .message_write #thumbnails-container { display: flex; flex-wrap: wrap; gap: 10px;} .message_write .thumbnail { position: relative; width: 100px; height: 100px; border: 1px solid #ddd; display: flex; justify-content: center; align-items: center; overflow: hidden; cursor: pointer;} .message_write .thumbnail img { max-width: 100%; max-height: 100%; object-fit: cover;} .message_write .delete-button { position: absolute; top: 5px; right: 5px; background-color: #525252; color: white; border: none; border-radius: 50%; width: 20px; height: 20px; display: flex; justify-content: center; align-items: center; cursor: pointer;} .message_write #file-container { display: flex; flex-direction: column; gap: 10px; margin-bottom: 10px;} .message_write .file-wrapper { display: flex; align-items: center; gap: 10px;} .message_view .file_list li a { display: flex; align-items: center; justify-content: space-between; padding: 10px; margin-top: 10px; background: #f9f9f9; border-radius: 5px} .message_view .file_list li a:hover {background: #E8E8E8} .message_sample {padding: 20px} .message_sample pre {font-family: 'Pretendard', 'Noto Sans KR', sans-serif; word-break: break-all;white-space: break-spaces; box-sizing: border-box} .message_sample td {vertical-align: text-top;} #accountGrantModal .grid > li {padding: 15px; background: #fff;} #accountGrantModal .grid > li p {font-weight: 800; border-bottom: 1px solid #eee; margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; padding-bottom: 5px} #accountGrantModal .grid > li span {display: block;margin-top: 7.5px;width: 100%} #accountGrantModal .grid > li span label {font-weight: 400; cursor: pointer} #accountGrantModal .grid > li span input:checked + label {font-weight: 700} #groupList .sub-table {border: 0} #groupList .sub-row td {padding: 2px;} #groupList .sub-row table td {padding: 3px; border-bottom: 0} .message_auto .box_red2 {border-radius: 5px;padding: 10px 25px } .message_auto .box_red2 i { font-size: 2.7em; color: #fff; margin-left: auto;} .message_auto .box_red2 > b { display: block; padding-right: 20px; border-right: 1px solid #eee; } .message_auto .panel h4 {line-height: 1.35em} .message_auto .panel li{padding:12px;cursor:pointer;border-bottom:1px solid #eee} .message_auto .panel li{padding:12px;cursor:pointer;border-bottom:1px solid #eee} .message_auto .panel li.active{background:#eef5dd;color:#77a601;font-weight:700} .message_auto .auto-sections{padding-left:20px;width:100%} .message_auto .template-left{min-height:600px;max-height:800px;overflow-y:auto} .message_auto .template-right{min-height:600px} .message_auto .message-box{height:260px;width:100%;padding:10px} .message_auto .thumbnail img{width:120px;height:auto;border:1px solid #ddd} .message_auto .toggle-switch{position:relative;display:inline-block;width:50px;min-width:50px;height:30px} .message_auto .toggle-switch input{opacity:0;width:0;height:0} .message_auto .toggle-slider{position:absolute;cursor:pointer;inset:0;background:#ccc;border-radius:34px;transition:.3s} .message_auto .toggle-slider:before{position:absolute;content:"";height:21px;width:21px;left:4px;bottom:5px;background:#fff;border-radius:50%;transition:.3s} .message_auto input:checked+.toggle-slider{background:#77a601} .message_auto input:checked+.toggle-slider:before{transform:translateX(19px)} .message_auto .auto-box{animation:fade .2s} .message_auto .template-left ul{margin:0;padding:0;list-style:none;border-top:1px solid #e6e6e6; margin-top: 15px} .message_auto .template-left ul li{padding:18px 18px;border-bottom:1px solid #e6e6e6;background:#fafafa;cursor:pointer;transition:background .15s,border-color .15s} .message_auto .template-left ul li:hover{background:#f3f7e8} .message_auto .template-left ul li.active{background:#eef5dd;border-left:4px solid #77a601;padding-left:14px} .message_auto .template-left .item-title{font-size:15px;font-weight:700;color:#333;margin-bottom:6px} .message_auto .template-left .item-sub{font-size:13px;color:#666;line-height:1.4} .message_auto .block {display: block} .message_auto .editable{width:100%;min-height:180px;border:1px solid #ddd;padding:10px;border-radius:5px;outline:none;white-space:pre-wrap;background: #fff} .message_auto .editable:empty:before{content:attr(placeholder);color:#aaa;} @keyframes fade{from{opacity:0}to{opacity:1}} /**/ .equip_list td a {display: inline-block} .equip_request td a {display: inline-block} .equip_setting .box_color2 {display: flex; align-items: center; gap: 10px} .equip_setting .box_color2 p:first-of-type {margin-right: auto} .equip_setting .box_color2 p {color: #fff; font-size: 1.35em} .equip_setting .box_color2 p a {color: #EAFFBB;text-decoration: underline;} .equip_setting .box20.box_white {display: flex; align-items: center; gap: 10px} .equip_setting .box20.box_white p:first-of-type {margin-right: auto} .equip_setting .box20.box_white p {; font-size: 1.35em} .equip_setting .box20.box_white p a {text-decoration: underline;} .equip_setting .mb25 button i {margin-bottom: 10px} .equip_setting .box ul li {display: flex; align-items: center; padding: 5px 10px; border: 1px solid #74A300; margin-top: 5px; gap: 10px; border-radius: 3px; background: #FBFFF2} .equip_setting .box ul li.top {margin-top: 0px; margin-bottom: 13px; background: #f9f9f9!important; font-weight: 600; font-size: 1.15em; border-color: #C1C1C1 } .equip_setting .box ul li b {color: #77a601} .equip_setting .box ul li button {margin-left: auto} .equip_setting .box ul li a {margin-left: auto} #equipAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #equipAddModal .modal-body > label {margin-top: 10px} #equipChangeModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #equipChangeModal .modal-body > label {margin-top: 10px} #equipOutModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #equipOutModal .modal-body > label {margin-top: 10px} #equipQtyModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #equipQtyModal .modal-body > label {margin-top: 10px} /**/ #pharmacyView ul.list li {margin-top: 5px; border-radius: 5px; background: #f3f3f3; padding: 2px 5px;} /**/ .manage_docu .table td > a { display: inline-block;} .manage_set .box_gray .grid:not(:first-child) {padding-bottom: 5px; border-bottom: 1px solid #eee; margin: 10px 0} .manage_set .box_gray .grid dl {display: flex; align-items: center; gap: 10px} .manage_set .box_gray .grid dl input { background: white} .manage_set .box_gray .grid dl dt { min-width: 100px} .manage_set .thumbnail { width: 100px; overflow: hidden; border: 2px solid #ddd; cursor: pointer; background: #fff} .manage_set .thumbnail img { height: 100px!important; width: 100%; height: 100%; object-fit: cover;} .manage_room th .features_wrap{width: fit-content!important; display: flex; gap: 5px; align-items: center} .manage_room td .gap5{gap: 2px} .manage_room td .features_wrap{width: fit-content!important; display: flex; gap: 5px; align-items: center} .manage_room td .box_line2 { border-width: 1px; border-color: #00000025; box-shadow: 0 0 5px #00000015} .manage_room .features_wrap span {white-space: nowrap} .manage_room .features_wrap .select input[type=checkbox]+label {background: #fff0; border: 0; border-radius: 0; height: fit-content; padding: 0; line-height: unset; filter: grayscale(1) contrast(0.2)} .manage_room .features_wrap .select input[type=checkbox]:checked+label {filter:grayscale(0) contrast(1)!important} .manage_room .features_wrap > div:has(input) {display: flex; gap: 2px} .manage_room .features_wrap > div:has(input[type=text]) .text {border: 1px solid #77a601;background: #fff;border-radius: 3px; padding: 2px 5px} .manage_room .w100 input.features {background: #fff; padding: 0px 5px; font-size: 12px!important; border-radius: 3px; width: 80px; height: 24px!important; border: 0!important; border-bottom: 0!important;} .manage_room .w100 input.features + button{height: 24px!important;} .manage_room .icon_green{height: 30px!important;} .manage_room .icon_white2{height: 30px!important;display: inline-flex; gap: 5px} .manage_room .feature-options{width: fit-content!important;} .manage_room td input.features {width: 100%} .manage_room .table {margin: 0; min-width: 500px;} .manage_room .table table {width: 100%; height: 100%;} .manage_room .table table thead th{text-align: center} .manage_room .table table thead tr:first-child th:first-child {background: linear-gradient(to right, #d5dfc5, #c6d5cd); padding: 10px; border-radius: 5px!important; border-top: 0} .manage_room .table table thead tr:first-child th:first-child input.line{background: #FFF} .manage_room .table table thead:nth-of-type(2) th{border-bottom: 0; border-top: 2px solid #77a601; }/* .manage_room .table table tbody td{background: #f3f3f3;background: #f2fcf7;}*/ .manage_room .table table tbody td {vertical-align: top} .manage_room .table table tbody td.line{text-align: center; color: #77a601;min-width: 70px; max-height: 60px } .manage_room .table table tbody tr:nth-of-type(even) td.line {background: #dcdfdd61;} .manage_room .table table tbody td.line input.line{font-weight: 800; background: linear-gradient(to right, #eaf2de, #f2fcf7);} .manage_room .table table tbody td:not(.line) select{ -webkit-appearance:none; /* for chrome */-moz-appearance:none; /*for firefox*/appearance:none;} .manage_room .table table tbody td.line span{font-weight: 400;text-align: center;display: block; color: #2A2A2A; font-size: 0.9em } .manage_room .table table tbody td.line span.icon_white2{display: inline-flex } .manage_room .table table tbody td.line span.icon_white2 span{display: inline-block ; color: #77a601 } .manage_room .table table tbody td span.icon_line{display: inline-flex; background: #fff; gap: 5px} .manage_room .table table tbody td span.icon_line span{display: inline-block ; color: #77a601 } .manage_room .table table tbody td.empty { opacity: 0.3 ;background-image: linear-gradient(to left bottom, transparent calc(50% - 1px), #adadad, transparent calc(50% + 1px)); background-size: 120% 120%; background-position: center; } .manage_room .table table tbody td {/*min-width: 110px; */max-height: 110px; text-align: center; padding: 10px} .manage_room .table table tbody td [type="checkbox"]{background: #fff!important;border: 1px solid #77a601;min-width: 30px; border-radius: 3px!important;} .manage_room .table table tbody td [type="checkbox"]::after {all:unset; content: '예약'; color: #77a601; font-size: 9px; font-weight: 800; display: flex; align-items: center; width: 100%; justify-content: center} .manage_room .table table tbody td [type="checkbox"]:checked{background: #77a601!important;border: 1px solid #fff;} .manage_room .table table tbody td [type="checkbox"]:checked::after { content: '예약됨'; color: #fff} .manage_room .table table tbody td .take {background: #f3f3f3; border-radius: 5px; overflow: hidden;} .manage_room .table table tbody td .take [type="checkbox"]{ background: #fff0!important; border: 1px solid #f8f8f8; display: none} .manage_room .table table tbody td .take [type="checkbox"]::after { content: '입실'; color: #eee} .manage_room .table table tbody td .info:not(.take) {background: #676767; border-radius: 5px; overflow: hidden; color: #fff} .manage_room .table table tbody td .info:not(.take) [type="text"] {border-color: #676767; color: #fff} .manage_room .table table tbody td .box_line2:has(.info:not(.take)) {background: #676767;} .manage_room .table table tbody td .box_line2:has(.info:not(.take)).reserve {background: #fff; border-color: #77a601;} .manage_room .table table tbody td .box_line2:has(.info:not(.take)) .btn_red2{display: none;} .manage_room .table table tbody td .info:not(.take):has(:checked) {background: #77a601;} .manage_room .table table tbody td .info:not(.take):has(:checked) [type="text"] {border-color: #77a601;; color: #fff} .manage_room .table table tbody td b {font-size: 10px; color: #b7b7b7} .manage_room .table table tbody td .fa-user-doctor {font-size: 12px;} .manage_room .w100 #room-wrap {display: flex; gap: 10px} .manage_room .w100 #room-wrap > div.flex {flex-direction: column; gap: 20px; width: 100%} .manage_room .w100 #room-wrap .left {padding: 0px; min-width: 200px; position: relative} .manage_room .w100 #room-wrap .left ul {max-height: 80vh;overflow-x: auto;} .manage_room .w100 #room-wrap .left li {} .manage_room .w100 #room-wrap .left li a {padding: 10px ;border-bottom: 1px solid #eee; display: flex; gap: 5px; align-items: center} .manage_room .w100 #room-wrap .left li a .icon_color{margin-left: auto} .manage_room .w100 #room-wrap .left .sticky {top: 100px;background: linear-gradient(45deg, #eaf2de, #f2fcf7);height: 100%;max-height: 100vh;border-radius: 5px} .manage_room .w100 #room-wrap .left .sticky ul {padding: 10px;} .manage_room .w100 #room-wrap .left .sticky .search_wrap {width: 200px; background: #f3f3f3;} .manage_room .w100 #room-wrap .left .sticky .btn_wrap {position: fixed; bottom: 0px; width: 200px; background: #fff;padding: 10px;} .manage_room .w100 #room-wrap .left li.active {background: #fff} .manage_room .w100 #room-wrap .left li.active a {color: #77a601; font-weight: 700; background: #fff; border-bottom: 0; border-radius: 5px} .manage_room .w100 th .flex {width: 100%; align-items: center;} .manage_room .w100 th .flex button:first-of-type {margin-left: auto;} .manage_room .w100 td:not(.line) input {padding: 5px; height: 35px; background: #fff0; border: 0; border-bottom: 1px solid #00000030; border-radius: 0;} .manage_room .w100 td:not(.line) input[type="date"] {font-size: 0.9em; letter-spacing: -1px} .manage_room .w100 td:not(.line) select{padding: 5px 0px; height: 35px;; background-color: #fff0; border: 0; border-bottom: 1px solid #eee; border-radius: 0;} .manage_room .w100 td:not(.line) select:hover {border:1px solid #77a601!important} .manage_room .w100 td.line > * {margin-bottom: 3px} .manage_room .table tbody tr td.emptyRoom {background: #e7efd9;} .manage_room .table tbody tr td.room_grid {padding: 0; vertical-align: top} .manage_room .table tbody tr td.room_grid .grid{padding: 10px;} .manage_room .table tbody tr td.room_grid > div.flex{padding: 10px;background: #fff; border-bottom: 1px solid #eee} .manage_room .table tbody tr:nth-of-type(even) td.room_grid > div.flex{background: #fff0} .manage_room .table tbody td {vertical-align: baseline} .manage_room .table tbody td > input:not(:last-of-type), .manage_room .table tbody td > .flex:not(:last-of-type) {margin-bottom: 5px} .manage_room .table tbody tr:last-child td { border-bottom: 1px solid #666;} .manage_room .table tbody td:not(.line) .btn_mini:not(.btn_gray) {background: #fff0; margin: 0; padding: 2px} .manage_room .empty { padding: 150px 0} .manage_room .w110px {width: 110px} .manage_room .line {width: 110px} .manage_room .name {width: 70px} .manage_room .search-highlight {background-color: #ffeb3b !important;border: 2px solid #ff5722 !important;box-shadow: 0 0 10px rgba(255, 87, 34, 0.7) !important;animation: search-pulse 2s ease-in-out;} .manage_room #isSearching {width: 100%; background: #fff;padding: 10px;text-align: center;} @keyframes search-pulse { 0% { box-shadow: 0 0 5px rgba(255, 87, 34, 0.5); } 50% { box-shadow: 0 0 20px rgba(255, 87, 34, 1); } 100% { box-shadow: 0 0 10px rgba(255, 87, 34, 0.7); } } .room_image {min-width: unset!important; text-align: center} .room_image .img {width: fit-content; margin: 0 auto; padding: 20px; background: #fff; border-radius: 5px; border: 1px solid #eee} .room_image img { border: 1px solid #eee; border-radius: 7.5px; max-width: 100%} #roomSetModal .modal-body > label {margin-top: 10px} #bedBookModal .modal-body > label {margin-top: 10px} #wardAddModal .modal-body > label {margin-top: 10px} #wardAddModal .modal-body ul {background: #fff; padding: 5px; margin-bottom: 10px} #wardAddModal .modal-body ul li {display: flex; align-items: center; justify-content: space-between} #wardAddModal .modal-body ul li label{cursor: pointer} #wardAddModal .modal-body ul li:not(:last-child) {margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid #eee} #roomEditModal .modal-body > label {margin-top: 10px} #roomEditModal .modal-body ul {background: #fff; padding: 5px; margin-bottom: 10px} #roomEditModal .modal-body ul li {display: flex; align-items: center; justify-content: space-between} #roomEditModal .modal-body ul li label{cursor: pointer} #roomEditModal .modal-body ul li:not(:last-child) {margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid #eee;} #wardSetupModal .flex.ai-c.gap5:not(:last-of-type){margin-bottom: 5px} /**/ .account_upload {padding: 25px} .account_upload h1{padding-bottom: 25px; font-size: 20px; font-weight: 700} .account_upload div:not(.box_red) {padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px solid #fff} .account_upload div.flex.box_line{ border: 1px solid #c4c4c4;padding: 10px; margin-bottom: 20px; flex-wrap: wrap} .account_upload div.flex{ border: 0; margin: 0px 0 0 ;padding: 0px; width: 100%} .account_upload div.select{ border: 0; margin: 0px 0 0 ;padding: 0px;} .account_upload hr{ display: block; border-bottom: 1px solid #fff} .account_upload div p{font-weight: 800; color: #77a601} .account_upload div h6{margin-bottom: 25px; } .account_upload div.box_red {font-size: 1.5em; padding: 20px; margin-bottom: 0px; text-align: center } /**/ /**/ #accountGroupModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #accountGroupModal .modal-body > label {margin-top: 10px} #accountAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #accountAddModal .modal-body > label {margin-top: 10px} #rightsAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #rightsAddModal .modal-body > label {margin-top: 10px} #rightsGrantModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #rightsGrantModal .modal-body > label {margin-top: 10px} /*ward*/ .profile_thumb { width: 120px; min-width: 120px; height: 158px;aspect-ratio: 3/4!important; border-radius: 3px; border: 1px solid #eee; position: relative } .profile_thumb.v2 { width: auto; min-width: 106.5px; height: 142px;} .profile_thumb label{ position: absolute; bottom: 10px; right: 10px } .profile_thumb img {width: 100%; height: 100%; object-fit: cover } .patient_type {padding: 25px} .patient_type > h1 {font-weight: 700; font-size: 1.45em; display: inline-block; padding: 0 0 15px;} .patient_equip .profile .profile_thumb {width: 100px; min-width: 100px; height: auto} .patient_equip .profile > span:nth-of-type(2) {width: 100%} .patient_equip .profile > span:nth-of-type(2) > div.flex{margin-top: 10px} .patient_equip .empty i {font-size: 5em; margin-bottom: 15px} body > .equip_use {padding: 20px} body > .equip_use ul.list li {background: #fff} body > .equip_use ul.list li input { border: 1px solid rgba(182, 182, 182, 0.5);} body > .equip_use .search > * {background: #fff!important;} .equip_use label + * {margin: 10px 0 20px} .equip_use > label {font-size: 1.1em; font-weight: 500; color: #313131; padding-left: 10px; border-left: 1px solid #77a502; border-radius: 0} .equip_use .tag {display: flex; gap: 5px; align-items: center; margin-bottom: 10px} .equip_use .tag b {font-weight: 400} .equip_use .tag a {font-weight: 600; display: inline-block; border-radius: 5px; background: #f3f3f3; padding: 5px 10px;} .equip_use ul.list li {display: flex; padding: 5px; padding-left: 10px; border-radius: 5px; background: #f3f3f3; align-items: center; gap: 5px; font-weight: 700} .equip_use ul.list li label {width: 100%;padding: 5px; cursor: pointer} .equip_use .grid div > label {font-size: 1.1em; font-weight: 500; color: #313131; padding-left: 10px; border-left: 1px solid #77a502; border-radius: 0} .equip_use ul.list li :checked + label { color: #77a502;} .equip_use ul.list li:has(:checked) { background: #77a50220;} .equip_use ul.list li:has(:checked) input { border: 1px solid #77a50280;} .equip_use ul.list li input[type="checkbox"] {width: 20px!important;min-width: 20px!important; height: 20px; display: none} .equip_use ul.list li input[type="text"] {max-width: 75px; margin: 0; margin-left: auto; background: #fff; text-align: right} body > .pharmacy_use {padding: 20px} body > .pharmacy_use .search > * {background: #fff!important;} body > .pharmacy_use ul.list li input { border: 1px solid rgba(182, 182, 182, 0.5);} body > .pharmacy_use ul.list li {background: #fff} .pharmacy_use label + * {margin: 10px 0 20px} .pharmacy_use > label {font-size: 1.1em; font-weight: 500; color: #313131; padding-left: 10px; border-left: 1px solid #77a502; border-radius: 0} .pharmacy_use .grid div > label {font-size: 1.1em; font-weight: 500; color: #313131; padding-left: 10px; border-left: 1px solid #77a502; border-radius: 0} .pharmacy_use .tag {display: flex; gap: 5px; align-items: center; margin-bottom: 10px} .pharmacy_use .tag b {font-weight: 400} .pharmacy_use .tag a {font-weight: 600; display: inline-block; border-radius: 5px; background: #f3f3f3; padding: 5px 10px;} .pharmacy_use ul.list li {display: flex; padding: 5px; padding-left: 10px;margin-bottom: 0px; border-radius: 5px; background: #f3f3f3; border: 1px solid #dbdcd9; align-items: center; gap: 5px; font-weight: 700} .pharmacy_use ul.list li label {width: 100%;;padding: 5px; cursor: pointer} .pharmacy_use ul.list li :checked + label {font-weight: 800; color:#4a9900;} .pharmacy_use ul.list li:has(:checked) { background: #77a50220; border: 1px solid #a2c5a2;} .pharmacy_use ul.list li:has(:checked) input { border: 1px solid #77a50280;} .pharmacy_use ul.list li input[type="checkbox"] {width: 20px!important;min-width: 20px!important; height: 20px; display: none} .pharmacy_use ul.list li input[type="number"] {max-width: 90px; margin: 0; margin-left: auto; background: #fff; text-align: right} .pharmacy_form .panel {margin: 0} .pharmacy_form .tagbox ul {display: flex; align-items: center; gap: 5px}/* .pharmacy_form .table{max-height: 50vh; overflow: auto}*/ .pharmacy_form .table table thead tr th {position: sticky;z-index: 99;top: 0;} .pharmacy_form .table table tr{ transition: all 0.2s ease;} .pharmacy_form .table table tr:hover td{background: rgba(201, 201, 201, 0.3) !important; transition: all 0.2s ease;} .pharmacy_form .table #gobtn {position: sticky;bottom: 10px;right: 10px;z-index: 100;width: fit-content;float: right; display: none} /**/ #pharmacyView ul.list li {margin-top: 5px; border-radius: 5px; background: #f3f3f3; padding: 2px 5px;} /**/ .equip_form .panel {margin: 0} .equip_form .tagbox ul {display: flex; align-items: center; gap: 5px}/* .equip_form .table{max-height: 50vh; overflow: auto}*/ .equip_form .table table:has(td:nth-child(18)) {min-width: 120%} .equip_form .table table:has(td:nth-child(22)) {min-width: 150%} .equip_form .table table:has(td:nth-child(25)) {min-width: 200%} .equip_form .table table:has(td:nth-child(28)) {min-width: 300%} .equip_form .table table:has(td:nth-child(32)) {min-width: 350%} .equip_form .table table:has(td:nth-child(35)) {min-width: 400%} .equip_form .table th.bg2 {position: sticky;z-index: 1;color: #2A2A2A!important;} .equip_form .table td.bg2 {position: sticky;z-index: 1;background: #f8f8f8; font-weight: 700} .equip_form .table td input {text-align: right; border: 1px solid #d5d5d5} .equip_form .table tr {white-space: nowrap} .equip_form .table tr {white-space: nowrap} .equip_form .table tr:nth-child(even) td.bg2 {background: #f1f1f1; font-weight: 700} .equip_form thead th.bg2:nth-child(1), .equip_form tbody td.bg2:nth-child(1) {left: 0;} .equip_form thead th.bg2:nth-child(2), .equip_form tbody td.bg2:nth-child(2) {left: 140px; } .equip_form thead th.bg2:nth-child(3), .equip_form tbody td.bg2:nth-child(3) {left: 220px;} .equip_form thead th.bg2:nth-child(4), .equip_form tbody td.bg2:nth-child(4) {left: 270px;} .equip_form .table + label {font-size: 1.1em;font-weight: 500;color: #313131;padding-left: 10px;border-left: 1px solid #77a502;border-radius: 0; margin: 10px 0} .equip_setting .box_wcolor2 {display: flex; align-items: center; gap: 10px} .equip_setting .box_wcolor2 p:first-of-type {margin-right: auto} .equip_setting .box_wcolor2 p {color: #fff; font-size: 1.35em} .equip_setting .box_wcolor2 p a {color: #bbffe5;text-decoration: underline;} .equip_setting .box20.box_white {display: flex; align-items: center; gap: 10px} .equip_setting .box20.box_white p:first-of-type {margin-right: auto} .equip_setting .box20.box_white p {; font-size: 1.35em} .equip_setting .box20.box_white p a {text-decoration: underline;} .equip_setting .mb25 button i {margin-bottom: 10px} /* .equip_setting .box25 ul li {display: flex; align-items: center; padding: 5px 10px; border: 1px solid #77a502; margin-top: 5px; gap: 10px; border-radius: 3px; background: #f2fffa} .equip_setting .box25 ul li.top {margin-top: 0px; margin-bottom: 13px; background: #f9f9f9!important; font-weight: 600; font-size: 1.15em; border-color: #C1C1C1 } .equip_setting .box25 ul li b {color: #77a502} .equip_setting .box25 ul li button {margin-left: auto} .equip_setting .box25 ul li a {margin-left: auto}*/ #equipQtyModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #equipQtyModal .modal-body > label {margin-top: 10px} .equip_list td a {display: inline-block} .equip_request td a {display: inline-block} /**/ /**/ .welfare_page .patient_table .table tr:hover td{cursor: unset} .welfare_list br.view {display: block} .welfare_list td p { cursor: pointer;} .welfare_list ul.flex.count {display: flex; align-items: center; gap: 5px}/* .welfare_list .tagbox {overflow: hidden;max-height: 0;opacity: 0;transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out; padding-top: 0px} .welfare_list .tagbox.open {max-height: 300px;opacity: 1; padding-top: 10px}*/ .welfare_choose .panel {margin-bottom: 0; display: flex; gap: 5px; align-items: center; position: relative} .welfare_choose #patientWrap {position: relative} .welfare_choose #patientFix {position: absolute; top: 50px; left: 0; max-height: 100px; overflow-y: auto; box-shadow: 0 0 15px #00000010; width: 560px;z-index: 3} .welfare_choose #patientFix li {display: flex; align-items: center; justify-content: space-between; padding-top: 10px} .welfare_choose #patientFix li:not(:last-of-type) {padding-bottom: 10px; border-bottom: 1px dotted #eee; padding-top: 0px} .welfare_form select.noline.v2 {background-color: #fff0!important;} .welfare_form .table.v2 input {border: 0} .welfare_form .box_white ul {border-radius: 5px} .welfare_form .box_white ul li {display: flex; align-items: center;gap: 5px} .welfare_form .box_white ul.sign li {position: relative} .welfare_form .box_white ul.sign li div {position: absolute;top: 50px;right: 0;} .welfare_form .box_gray ul {border-radius: 5px} .welfare_form .box_gray ul li {display: flex; align-items: center;gap: 5px} .welfare_form .box_gray textarea {min-height: 150px} .welfare_form .box_color ul {border-radius: 5px} .welfare_form .box_color ul li {display: flex; align-items: center;gap: 5px} .welfare_form .box_color textarea {min-height: 150px} .welfare_form .highlight { background-color: yellow; border-radius: 5px;} .welfare_form .able { white-space: nowrap; cursor: pointer;} .welfare_form .disabled-input { pointer-events: none; opacity: 0.5;} .welfare_form div.box_colorline {padding: 10px; gap: 10px;border-radius: 5px; align-items: center} .welfare_form div.box_white.male-auto {padding: 10px; gap: 10px;border-radius: 5px; align-items: center; margin-bottom: 0px} .welfare_form div.box_white:not(.male-auto) {padding: 10px; gap: 10px;border-radius: 5px; align-items: center; margin-bottom: 50px} .welfare_form div.box_white:not(:last-of-type) {border-bottom: 1px solid #eee} .welfare_form div.box_white .flex { gap: 10px; align-items: center; position: relative} .welfare_form div.box_white .w60px + .flex {width: calc( 100% - 70px )} .welfare_form ul.box_white {padding: 10px} .welfare_form span.info > span{ display: flex; align-items: center;} .welfare_form span.info {font-size: 18px; color: #77a601; display: flex; align-items: center;} .welfare_form span.info > *:first-child:after{content: '|'; color: #000; margin-left: 5px; font-weight: 400; opacity: 0.3} .welfare_form span.info > *:last-child:before{content: '|'; color: #000; margin-right: 5px; font-weight: 400; opacity: 0.3} /**/ .nutrient_week .calendar-container { position: relative; width: 100%; overflow: hidden; background: white; border-radius: 5px; padding: 10px; } .nutrient_week .calendar { display: flex; gap: 10px; transition: transform 0.3s ease-out; } .nutrient_week .day, .nutrient_week .month-divider { flex: 0 0 50px; height: 80px; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 5px; font-size: 14px; cursor: pointer; border: 1px solid #eee} .nutrient_week .day { background: #fff; } .nutrient_week .day:hover { background: #f3f3f3; } .nutrient_week .day.active { background: #74a201; color: white; font-weight: bold; } .nutrient_week .day.active > * { color: #fff } .nutrient_week .day small { font-size: 12px; color: gray; } .nutrient_week .dots { display: flex; gap: 2px; margin-top: 3px; } .nutrient_week .dot { width: 5px; height: 5px; background-color: gray; border-radius: 50%; } .nutrient_week .dot.active { background-color: #74a201; } .nutrient_week .day.active .dot { background: #fff } .nutrient_week .month-divider { flex: 0 0 80px; background: #74a20120; font-size: 16px; font-weight: bold; color: #74a201; } .nutrient_week .controls { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; } .nutrient_week .current-month { font-size: 16px; font-weight: bold; } .nutrient_week .month-picker { font-size: 16px!important; font-weight: bold; border: 0; padding: 0; border-radius: 0; text-align: center } .nutrient_week .accordion-container { width: 100%; margin: 0px auto; } .nutrient_week .accordion-header { margin-top: 10px;background: #74a20120; color: #74a201; padding: 10px; cursor: pointer; border: none; text-align: left; width: 100%; font-size: 16px; transition: background 0.3s ease; font-weight: 600; display: flex; justify-content: space-between; align-items: center; gap: 10px} .nutrient_week .accordion-header:hover { background: #74a20140; } .nutrient_week .accordion-content { border: 1px solid #eee; max-height: 0; overflow: hidden; padding: 0 10px; transition: max-height 0.3s ease-out, padding 0.3s ease-out; } .nutrient_week .accordion.active .accordion-content { max-height: 200px; padding: 10px; } .nutrient_week .accordion li {display: flex; align-items: center;gap: 5px} .nutrient_week .accordion textarea {height: 50px; resize: unset} #nutriAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} #nutriAddModal .modal-body > label {margin-top: 10px} /**/ .data_board ul.grid li {text-align: center; padding: 10px; border-radius: 5px; background: #f7f8f8; display: flex; flex-direction: column; gap: 5px;justify-content: center; align-items: center;} .data_board ul.grid li h6 {display:inline-block;width:100%;overflow: hidden;text-overflow: ellipsis;vertical-align:middle;word-break: break-all;white-space: nowrap;} .data_board ul.grid li button {margin: 0 auto;} .data_board ul.grid li div {width: 100%;} /**/ .right_patient .mb10 > .box_line {border-bottom: 0} .right_patient .box_color2 {display: flex; align-items: center; gap: 10px} .right_patient .box_color2 p:first-of-type {margin-right: auto} .right_patient .box_color2 p {color: #fff; font-size: 1.35em} .right_patient .box_color2 p a {color: #EAFFBB;text-decoration: underline;} .right_patient .mb15 .flex > button {width: 100%; height: fit-content;font-size: 1.05em} .right_patient .mb15 .flex > button i {margin-right: 10px} .right_patient .table {letter-spacing: -1px} .right_patient .table::-webkit-scrollbar{height:10px;} .right_patient .table::-webkit-scrollbar-thumb{background: #1e1e1f;border-radius:3px;} .right_patient .table tr{transition: all 0.2s ease;} .right_patient .table tr:hover td{background: #77a60120!important; cursor: pointer;transition: all 0.2s ease;} .right_patient .patient_search .panel {margin-bottom: 0;display: flex;gap: 5px;align-items: center;position: relative;} .right_patient #patientWrap {position: relative} .right_patient #patientFix {position: absolute; top: 50px; left: 10px; max-height: 200px; overflow-y: auto; box-shadow: 0 0 15px #00000020; width: calc( 100% - 20px );z-index: 3} .right_patient #patientFix li {display: flex; align-items: center; justify-content: space-between; padding-top: 10px} .right_patient #patientFix li:not(:last-of-type) {padding-bottom: 10px; border-bottom: 1px dotted #eee; } .right_patient #patientFix li:first-of-type{padding-top: 0px } .right_patient .box_gray3 select{background-position: right 0px center;padding: 4px 15px 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .right_patient .box_gray3 input{padding: 4px 5px; font-size: 14px; height: 30px;background-color: #fff; border: 1px solid #c4c4c4} .right_patient .box_gray3 .btn{padding: 4px 5px; font-size: 14px; height: 30px} .right_patient .box_gray3 .btn_search{background: #515151;color: #fff;} .right_patient .box_gray3 .tagbox.v2 {margin-bottom:10px; } .right_patient .box_gray3 .tagbox.v2 .date input {/*min-width:95px;*/ padding: 4px 2px; padding-left: 4px; border: 1px solid #c4c4c4} .right_patient .box_gray3 .tagbox {gap: 7.5px;align-items: center} .right_patient .box_gray3 .tagbox:not(:first-child) > div:nth-child(odd) {width: 30px} .right_patient .box_gray3 .tagbox:not(:first-child) > *:nth-child(even) {width: calc( 100% - 37.5px ); color: #000 } .right_patient .box_gray3 .tagbox.v2 > div:nth-child(odd) {width: 30px;} .right_patient .box_gray3 .tagbox.v2 > div:nth-child(2) {width: fit-content!important} .right_patient .box_gray3 .tagbox.v2 > div:nth-child(even) {width: calc( 50% - 37.5px ) } .right_patient .box_gray3 .tagbox .select {display: flex;flex-wrap: wrap} .right_patient .tagbox ul {display: flex; align-items: center; gap: 5px} .right_patient .panel {margin: 0} .right_patient input[type="date"]::-webkit-calendar-picker-indicator {display: none;} .right_patient .box_line {position: relative} .right_patient .box_line b.txt_color {white-space: nowrap} /**/ input[type="number"] { padding-right: 0px; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { margin-left: 10px; opacity: 1; } @supports (-moz-appearance: none) { input[type="number"] { padding-right: 10px; } } /**/ select[name="selectCode"] {background-color: #f3f3f3} section.complete .box.box_white {min-height: 100vh; display: flex; justify-content: center; align-items: center;flex-direction: column; gap: 25px} section.complete h5 i {display: block; font-size: 3em; margin-bottom: 15px} section.complete .box a i {font-size: 2em; margin-bottom: 0px} section.complete .box a {border-radius: 500px; padding: 15px; margin-bottom: 5px} .flatpickr-calendar {width: 180px;} .flatpickr-calendar .flatpickr-current-month {display: flex; flex-direction: row-reverse; justify-content: center; align-items: center} .flatpickr-calendar .flatpickr-current-month select {padding: 0!important;border: 0!important; height: 30px!important; font-size: 13px!important;font-weight: bold;} .flatpickr-calendar .flatpickr-current-month input {width: 50px!important;padding: 0!important;border: 0!important;min-width: unset!important; height: 25px!important; font-size: 13px!important;font-weight: bold;} .flatpickr-calendar .flatpickr-rContainer {width: 100%!important;min-width: unset!important;} .flatpickr-calendar .flatpickr-days {width: 100%!important;min-width: unset!important;} .flatpickr-calendar .dayContainer {width: 100%!important;min-width: unset!important;} .flatpickr-current-month .numInputWrapper:hover {background: rgba(0, 0, 0, 0.00)!important;} .flatpickr-current-month .numInputWrapper {width: fit-content!important;} /**/ .sms_callback {max-width: 600px; margin: 50px auto; padding: 0 20px} .sms_callback h1 {font-size: 25px; margin-bottom: 30px; line-height: 40px} .sms_callback .box_white {margin-bottom: 30px;display: flex; flex-direction: column; gap: 10px} .sms_callback .box_white p {color: #76a501;font-weight: 500} /**/ .alert-summary{display:flex;gap:6px;margin-bottom:10px} .sum-item{flex:1;padding:8px;color:#fff;border-radius:6px;font-size:12px} .sum-item span{display:block;font-size:18px;font-weight:bold;margin-top:4px} .sum-item.red{background:#c94d3d10;border:1px solid #c94d3d; color: #fd361c} .sum-item.blue{background: linear-gradient(to right, #76a501, #38a501);color: #fff} .sum-item.green{background:#76a50150;border:1px solid #76a501; color: #000} .sum-item.gray{background:#fff0;border:1px solid #999; color: #999} .alert-page .box20 {border-radius: 5px} .alert-alert{font-weight:bold;background: #f7ffe8;padding:8px;border-radius:4px;margin-bottom:10px;font-size:13px;border: 1px solid #76a501; color: #38a501} .alert-date-line{font-size:12px;color:#555;margin:8px 0} .alert-item{;background: #fff;display:grid;grid-template-columns: 120px 1fr auto;border: 0;border-left: 5px solid #eee; gap: 10px;align-items:center;padding:10px;border-radius:4px;margin-bottom:15px;} .alert-item div.flex br.view{display: block} .alert-item .alert-left + .flex{cursor: pointer;background: #f8f8f8;display:flex;gap: 20px;align-items:center;padding:10px;border:1px solid #ddd;border-radius:4px;margin-right: auto;} .alert-item .flex.ai-c {gap: 10px} .unread.alert-item{box-shadow: 0 5px 10px #00000010;border-left: 5px solid #38a501} .agree.alert-item{box-shadow: 0 5px 10px #00000010;border-left: 5px solid #38a501} .not.alert-item{box-shadow: 0 5px 10px #00000010;border-left: 5px solid #c94d3d} .alert-left{display:flex;flex-direction:column;width: 110px} .alert-sign{cursor: pointer;border: 1px solid #666;font-weight:bold;font-size: 20px; background: #fff; color: #666; border: 1px solid #666; height: 69px;width: 69px; border-radius: 500px; display: flex; align-items: center; justify-content: center} .alert-detail {width: 100%; grid-column: 1 / 4} .unread .alert-sign{background: #38a501; color: #fff;border: 1px solid #38a501} .agree .alert-sign{background: #38a501; color: #fff;border: 1px solid #38a501} .not .alert-sign{background: #c94d3d; color: #fff;border: 1px solid #c94d3d} .receive .unread .alert-sign:hover{background: #267200;} .receive .agree .alert-sign:hover{background: #267200; } .receive .not .alert-sign:hover{background: #852d22;} .sign-date {color: #666; text-align: right} .alert-title{cursor: pointer;font-weight:bold;margin-bottom:4px; font-size: 20px} .unread .alert-title{color: #38a501} .agree .alert-title{color: #38a501} .not .alert-title{color: #c94d3d} .alert-date{color:#888;font-size:12px} .alert-user{color:#333;font-size:12px} .resources_form .tabs{display:flex;gap:15px;margin-bottom:15px} .resources_form .tab{font-weight:bold;font-size: 20px;opacity: 0.3;cursor: pointer} .resources_form .tab.active{opacity: 1} .resources_form .tab-content{display:none} .resources_form .tab-content.active{display:block} .resources_form .profile-row{display:flex;gap:10px} .resources_form .fields{display:grid;grid-template-columns:repeat(2,1fr);gap:10px; width: 100%; border-radius: 5px} .resources_form .field{display:flex;flex-direction:column} .resources_form .field:has(textarea){grid-column: 1 / 3} .resources_form .field label{font-size:12px;color:#666;margin-bottom:3px} .resources_form .field input{padding:8px;border:1px solid #ccc;border-radius:4px;font-size:14px} .resources_form hr{display:block} .resources_form .table.account tr{transition: all 0.2s ease;} .resources_form .table.account tr:hover td{background: #77a60120!important; cursor: pointer;transition: all 0.2s ease;} /**/ .commute_list .attendance-table { width:100%; border-collapse:collapse; font-family:sans-serif; font-size:12px; position:relative; table-layout:fixed; } .commute_list .attendance-table th, .commute_list .attendance-table td { background: #fff;border:1px solid #ddd; text-align:center; padding:4px; height:40px; } .commute_list .time-header { background:#f5f5f5; font-weight:bold; } .commute_list .name-col { width:50px; font-weight:bold; background:#f9f9f9!important; } .commute_list .bar {background: #e7e7e7; color:#000; display: flex;flex-direction: column; gap: 0;justify-content:center;align-items: center;position:absolute; height:34px; padding:2px 6px; font-size:11px; line-height: 13px; border-radius:4px; white-space:nowrap; overflow:hidden; top:3px; } .commute_list .bar b{ font-size:13px; } .commute_list .vac {background:#5bc0de;color:#fff} .commute_list .leave {background:#f0ad4e;color:#fff} .commute_list .late {background:#d9534f;color:#fff} .commute_list .chart-wrap { position:relative; height:40px; } .commute_list .tabs{display:flex;gap:15px;margin-bottom:15px} .commute_list .tab{font-weight:bold;font-size: 20px;opacity: 0.3;cursor: pointer} .commute_list .tab.active{opacity: 1} .commute_list .tab-content{display:none} .commute_list .tab-content.active{display:block} .monthly-table{border-collapse:collapse;width:100%;font-family:sans-serif;font-size:12px;table-layout:fixed} .monthly-table th,.monthly-table td{ height: 40px;border:1px solid #ddd;text-align:center;padding:4px;position: relative;background: #fff} .monthly-table thead{background:#f5f5f5} .monthly-table td{line-height: 1.3em; font-weight: 600; padding: 10px 4px} .monthly-table tr td:nth-of-type(1){font-weight: 400; } .monthly-table tr td:nth-of-type(2){font-weight:bold; background:#f9f9f9!important; } .monthly-table .normal{background:#fff} .monthly-table .late{background:#d9534f;color:#fff} .monthly-table .leave{background:#f0ad4e;color:#fff} .monthly-table .vac{background:#5bc0de;color:#fff} .monthly-table .gray{background: #f8f8f8;color: #d3d3d3} .monthly-table td[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.8);color:#fff;padding:4px 6px;border-radius:4px;font-size:11px;white-space:nowrap;pointer-events:none;z-index:10} .monthly-table td[data-tip]:hover::before{content:"";position:absolute;bottom:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:rgba(0,0,0,0.8);margin-bottom:-1px} .commute_form .btn_back {font-size: 18px; font-weight: 800; opacity: 0.7; margin-bottom: 20px; display: block} #commuteModal .modal-body > label:not(:first-of-type) {margin-top: 10px} /**/ .offday_list .tabs{display:flex;gap:15px;margin-bottom:15px} .offday_list .tab{font-weight:bold;font-size: 20px;opacity: 0.3;cursor: pointer} .offday_list .tab.active{opacity: 1} .offday_list .tab-content{display:none} .offday_list .tab-content.active{display:block} .offday_list .tag{padding:2px 6px;border-radius:4px;color:#fff;font-size:12px; font-weight: 800; mix-blend-mode: multiply} .offday_list .tag.leave{color:#f0ad4e;background:#f0ad4e25} .offday_list .tag.late{color:#d9534f;background:#d9534f25;} .offday_list .tag.vac{color:#5bc0de;background:#5bc0de25;} .offday_list #daily tr td:nth-of-type(2){font-weight:bold; background:#f9f9f9!important; } .offday_list #daily tr td:nth-of-type(6){font-weight:bold; background:#f9f9f9!important; } .offday_list #daily tr td:not(:last-child) {border-right: 1px dotted #cecece90;} .offday_list .table tr:nth-of-type(even) td {background: #fff;} .offday_list #weekly .table {margin-bottom: 0} .offday_list #weekly table{border-collapse:collapse;width:100%;table-layout:fixed} .offday_list #weekly th, .offday_list #weekly td{border:1px solid #ddd;padding:4px;text-align:center;vertical-align:top} .offday_list #weekly th{background:#fafafa;font-weight:normal} .offday_list #weekly td{height: 50vh} .offday_list .day-num{font-weight:bold;color:#666;margin-bottom:4px} .offday_list .event{width: 100%;display:inline-block;margin-top:2px;padding:10px 4px;border:1px solid #f0ad4e;background:#fff7e6;color:#d77f00;font-size:15px;font-weight: 800;border-radius:4px} .offday_list .event.vac{border-color:#5bc0de;color:#0d6efd;background:#e6f4ff} .offday_list .event.late{border-color: #ff8d8a;color:#d9534f;background: #ffeaea} #offdayAddModal .modal-body > label:not(:first-of-type) {margin-top: 10px} /**/ body:has(.collabo-page) {background: #fff;} .collabo-page {max-width: 1740px;margin: 65px auto ;padding: 20px;transition: all 0.3s ease;} .collabo {width: 100%;border: 0;border-spacing: 0 10px;border-collapse: separate} .collabo table {width: 100%;border: 0;border-spacing: 0 10px;border-collapse: separate} .collabo tr>td:first-child {border-top-left-radius: 10px!important} .collabo tr>td:last-child {border-top-right-radius: 10px!important} .collabo tr>td:first-child {border-bottom-left-radius: 10px!important} .collabo tr>td:last-child {border-bottom-right-radius: 10px!important} .collabo th {background-color: #fff0;border-bottom: 0;border-top: 0;color: #000;text-align: center;font-weight: 700;padding: 0} .collabo tr th:first-of-type {border-left: 1px solid #E6E6E6} .collabo tr th:last-of-type {border-right: 1px solid #E6E6E6} .collabo tr td:first-of-type {border-left: 1px solid #E6E6E6} .collabo tr td:last-of-type {border-right: 1px solid #E6E6E6} .collabo td {border: 1px solid #E6E6E6;border-left: 1px dotted #77777730;border-right: 0;font-weight: 500;background: #fff; padding: 5px 10px} .collabo td.bg2 {background-color: #fff; background-image: linear-gradient(45deg, #f8f8f8 25%, transparent 25%, transparent 75%, #f8f8f8 75%, #f8f8f8), linear-gradient(-45deg, #f8f8f8 25%, transparent 25%, transparent 75%, #f8f8f8 75%, #f8f8f8); background-size: 20px 20px;} .collabo table tbody tr:last-child td {border-bottom: 1px solid #E6E6E6} body:has(.collabo-page article) {background: #c8d0d020;} .collabo-page article {max-width: 900px; margin: 30px auto 30px; background: #fff; border: 1px solid #eee; padding: 35px 20px; border-radius: 10px} .collabo-page article p {margin-top: 5px} .collabo-page article p span.txt_gray {display: inline-block;width: 100px;} .collabo-page article div.sign {padding: 0px; border-top: 4px double #eee;border-bottom: 4px double #eee; margin: 20px 0; display: flex; align-items: center; justify-content: end; border-radius: 3px} .collabo-page article div.sign ul{display: flex; gap: 5px} .collabo-page article div.sign ul li{ border-radius: 3px;background: #fff;aspect-ratio: 1/1; width: 80px; height: 80px; display: flex; gap: 5px;align-items: center; justify-content: center;flex-direction: column} .collabo-page article div.sign ul li select { text-align: center;margin: 0; height: auto;-webkit-appearance: none; /* Chrome, Safari */-moz-appearance: none; /* Firefox */appearance: none; /* 표준 속성 */} .collabo-page article div.sign ul li:first-of-type{border-left: 1px solid #eee;} .collabo-page article div.sign ul li:not(:last-of-type){border-right: 1px solid #eee;} .collabo-page article div.sign ul li > select {padding: 0} .collabo-page article div.sign ul li div.state select {border: 0; padding: 5px; border-radius: 5px; height: auto; font-size: 1.2em;} .collabo-page article div.sign ul li a {font-weight: 800; font-size: 1.2em; opacity: 0.4} .collabo-page article span.icon {border-radius: 3px} .collabo-page article div.cont {border: 1px solid #d6d9db; border-radius: 3px; padding: 15px} .collabo-page article ul.grid5{border-radius: 10px;} .collabo-page article ul.comment{gap: 10px; display: flex; flex-direction: column; margin-bottom: 10px} .collabo-page article .comment li {width: 100%; } .collabo-page article .comment li.box {border-radius: 3px; } .collabo-page article a.file {display: flex; gap: 5px; align-items: center; width: 100%} .collabo-page article a.file p {margin: 0%} .collabo-page article.form textarea {min-height: 300px } @media screen and (max-width: 1199px) { .collabo-page {margin: 20px auto ;} .collabo-page .panel {flex-wrap: wrap;} .collabo-page .collabo table thead {display: none;} .collabo-page .collabo table colgroup {display: none;} .collabo-page .collabo table tbody tr {display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid #eee; margin-bottom: 10px; overflow: hidden; border-radius: 10px} .collabo tr>td:first-child { border-bottom-left-radius: 0px !important; } .collabo tr>td:last-child { border-bottom-left-radius: 0px !important; border-top-left-radius: 10px !important; } .collabo-page .collabo table tbody tr td {border: none} .collabo-page .collabo table tbody tr td:nth-of-type(1) {border-bottom: 1px dashed #eee;} .collabo-page .collabo table tbody tr td:nth-of-type(2) {border-bottom: 1px dashed #eee;font-weight: 800;color: #76a501;text-align: right!important;border-top-right-radius: 10px !important;} .collabo-page .collabo table tbody tr td:nth-of-type(3) {grid-column: 1 / 3} .collabo-page .collabo table tbody tr td:nth-of-type(4) {grid-column: 1 / 3; text-align: center} .collabo-page .collabo table tbody tr td:nth-of-type(4) a {width: 100%} .collabo-page .collabo table tbody tr td:nth-of-type(1):before {content: 'No.'; display: inline-block; opacity: 0.3; margin-right: 5px} .collabo-page .collabo table tbody tr td:nth-of-type(5):before {content: '참석인원'; display: inline-block; opacity: 0.3; margin-right: 5px} .collabo-page .collabo table tbody tr td:nth-of-type(6):before {content: '작성자 '; display: inline-block; opacity: 0.3; margin-right: 5px} .collabo-page .collabo table tbody tr td:nth-of-type(5) {text-align: left!important;} .collabo-page .collabo table tbody tr td:nth-of-type(6) {text-align: left!important;} .collabo-page .collabo table tbody tr td:nth-of-type(7) {text-align: left!important;} .collabo-page .collabo table tbody tr td:nth-of-type(8) {text-align: right;} .collabo-page .collabo table tbody tr td.bg2 {grid-column: 1 / 3; display: flex; align-items: center} .collabo-page .collabo table tbody tr td.bg2 .visible-md {margin-right: auto; display: block!important;} } .admission_list .box.box_white {height: fit-content;margin-bottom: 15px} .admission_list .box.box_white.sticky {border-top: 2px solid #000000;} .admission_list .box.box_white.sticky th { border-bottom-color:#00000030; } .admission_list .box.box_white.green {border-top: 2px solid #77a502;} .admission_list .box.box_white.green h5 {color: #77a502;} .admission_list .box.box_white.green th {background: #77a50230; border-bottom-color:#77a502; } .admission_list .box.box_white.yellow {border-top: 2px solid #e19a00;} .admission_list .box.box_white.yellow h5 {color: #e19a00;} .admission_list .box.box_white.yellow th {background: #ffaf0330; border-bottom-color:#e19a00; } .admission_list .box.box_white.orange {border-top: 2px solid #c96100;} .admission_list .box.box_white.orange h5 {color: #c96100;} .admission_list .box.box_white.orange th {background: #c9610030; border-bottom-color:#c96100; } .admission_list .box.box_white.blue {border-top: 2px solid #0267a5;} .admission_list .box.box_white.blue h5 {color: #0267a5;} .admission_list .box.box_white.blue th {background: #0267a530; border-bottom-color:#0267a5; } .admission_list .box.box_white hr {display: block; margin: 5px 0} .admission_list .box.box_white th {text-align: center} .admission_list .box.box_white td {text-align: center} .admission_list .box.box_white td a {display: inline-flex;} .admission_list .nav-tabs {max-width: 200px; margin: 0 auto; display: flex; justify-content: center; border: 0} .admission_list .nav-tabs>li.active>a {background: #fff0; border: 0} #setCateModal ul {border-top: 1px solid #00000030; padding-top: 10px} #setCateModal li {display: flex; justify-content: space-between; align-items: center; font-weight: 800; border-bottom: 1px solid #00000030; padding-bottom: 10px} .toggle-col {display: none;} .blue-wave-bg {width: 100%;aspect-ratio: 1/1;overflow: hidden;border-radius: 5px;background: linear-gradient(135deg, #1c77ff, #00b0da, #013efa, #0f9cdc);background-size: 400% 400%;animation: waveFlow 3s ease-in-out infinite;} .blue-wave-bg img {width: 100%; cursor: pointer} @keyframes waveFlow { 0% {background-position: 0% 50%;} 25% {background-position: 50% 30%;} 50% {background-position: 100% 70%;} 75% {background-position: 50% 100%;} 100% {background-position: 0% 50%;} } form[name="searchFrm"] input { background: #fff} .pip-hide.box {width: 100%; background: #ff0000; font-weight: 800; color: #fff; border-radius: 0; text-align: center; max-width: 300px} #pip {width: 100%; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center} #pip .pip-widget {width: 100%; height: 100%; background: #fff;border-radius: 0px;box-shadow: 0 4px 10px rgba(0,0,0,0.1);overflow: hidden;} #pip .pip-swiper {width: 100%;height: 100%;} #pip .section {padding: 20px;} #pip .section h3 {font-size: 16px;font-weight: 700;color: #77a601;border-bottom: 2px solid #77a601;padding-bottom: 6px;margin-bottom: 10px;} #pip .section ul.list {max-height: 80vh; overflow-y: auto; padding-right: 3px; margin-right: -3px} #pip .section ul#patientFix { max-height: 70vh; overflow-y: auto; padding-right: 3px; margin-right: -3px} #pip .section ul.list.v2 { max-height: 65vh; } #pip .section ul.list.v2.open {max-height: 42vh; margin-top: 10px } #pip .section li {justify-content: space-between;align-items: center;padding: 8px 0;border-bottom: 1px solid #eee;font-size: 13px; letter-spacing: -.5px} #pip .section.memo li {display: flex;justify-content: space-between;align-items: center;} #pip .section.visit li {display: grid;grid-template-columns: 34px 1fr 70px 45px 120px; gap: 5px} #pip .section.outside li {display: grid;grid-template-columns: 32px 34px 1fr 70px 120px; gap: 5px} #pip .section .tag {background: #77a601;color: #fff;padding: 2px 8px;border-radius: 4px;font-size: 10px;} #pip .section .tag.v2 {background: #77a60120;color: #77a601;} #pip .section .tag.v3 {background: #333;color: #fff;} #pip .section .time { color: #555;width: 34px;} #pip .section .name { font-weight: 600; color: #333; } #pip .section .room { color: #666; letter-spacing: -1px} #pip .section .dest, .section .place, .section .relation { color: #999; } #pip .memo {margin-top: 5px;font-size: 13px;line-height: 1.4;color: #444; width: 100%} #pip .memo .meta {font-size: 12px;color: #aaa;} #pip .btn_black{max-width: 300px} #pip .section .dest u {max-width: 120px;} #pip .section .relation u {max-width:120px;} #pip .section .dest {line-height: 0.9em;position: relative} #pip .section .dest u {text-decoration: unset;display: inline-block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;/position: relative} #pip .section .dest[title]:hover::after {content: attr(title);position: absolute;background-color: #333;color: #fff;padding: 5px;border-radius: 4px;font-size: 12px;z-index: 10;white-space: normal; /* 툴팁 내용이 길어지면 줄 바꿈 */top: -2px;right: 0;} #pip .section .relation {line-height: 0.9em;position: relative} #pip .section .relation u {text-decoration: unset;display: inline-block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;position: relative} #pip .section .relation[title]:hover::after {content: attr(title);position: absolute;background-color: #333;color: #fff;padding: 5px;border-radius: 4px;font-size: 12px;z-index: 10;white-space: normal; /* 툴팁 내용이 길어지면 줄 바꿈 */top: -2px;right: 0;} #pip #pipBtn {display: none} #pipBtn {box-shadow: 10px 10px 10px #00000010, 0px 0px 10px #00000010; border: 0; background: #444444; color: #fff; display: flex; flex-direction: column; align-items: center; ;justify-content: center; width: 70px; height: 70px; border-radius: 500px; aspect-ratio: 1/1; position: fixed; right: 20px; bottom: 20px} #pipBtn i {font-size: 20px; padding-top: 10px} #pipBtn b {font-size: 10px} @media (max-width: 400px) { #pip .section.visit li {display: grid;grid-template-columns: 34px 1fr 70px 45px 50px; gap: 2px} #pip .section.outside li {display: grid;grid-template-columns: 32px 34px 1fr 70px 60px; gap: 2px} #pip .section .dest u {max-width: 60px;} #pip .section .relation u {max-width:50px;} } @media (max-height: 420px) { #pip .section ul.list {max-height: 72vh;} #pip .section ul#patientFix { max-height: 60vh;} #pip .section ul.list.v2 { max-height: 50vh; } #pip .section ul.list.v2.open {max-height: 20vh; } } @font-face { font-family: 'OneStoreMobileGothicTitleFont'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-Title.woff') format('woff'); font-weight: normal; font-display: swap; } div.ad {background: #fff} .ad > section {font-family: 'OneStoreMobileGothicTitleFont';display:flex!important;flex-direction:column;justify-content:center;align-items:center;text-align:center;min-height:70vh;position:relative;} /* 애니메이션 */ .ad .fade-in {opacity:0;transform:translateY(40px);transition:opacity 1s ease, transform 1s ease;} .ad .fade-in.show {opacity:1;transform:translateY(0);} /* 1. 헤더 섹션 */ .ad .sec1 {position: relative;background:#1a1a1c;color:#fff; border-radius: 50px; overflow: hidden; padding: 100px 0} .ad .sec1::before {content: "";position: absolute;inset: 0;background: #212121;clip-path: polygon(35% 0, 65% 0, 100% 100%, 0 100%);opacity: 0.9;} .ad .sec1 *{position:relative;z-index:1;} .ad .sec1 h1{font-size:2.8em;margin-bottom:15px; line-height: 1.2em} .ad .sec1 h1 span {font-size:0.5em; border-radius: 50px;background: #5eabfd; padding:10px 25px; font-weight: bold} .ad .sec1 p{font-size:1.2em;opacity:0.9;margin-bottom:35px;} .ad .sec1 img {width: 70%} /* 2. 후킹 멘트 */ .ad .sec2{background:#fff; padding: 100px 0} .ad .sec2 h2{font-size:2.2em;color:#1b3b78;margin-bottom:20px;line-height: 1.2em} .ad .sec2 h2 span{font-family: 'OneStoreMobileGothicTitleFont';position: relative;z-index: 1;} .ad .sec2 h2 span:before{ content: "";position: absolute;left: 0;bottom: 0.15em;width: 0;height: 50%;background: #5eabfd80;z-index: -1;border-radius: 4px;animation: highlightPen 1.2s ease infinite; } .ad .sec2 p{font-size:1.1em;color:#555;max-width:700px;} .ad .sec2 img {width: 70%;margin-bottom:35px;} @keyframes highlightPen { 0% {width: 0;} 100% {width: 100%;} } /* 3. 최저가 강조 */ .ad .sec3{background:linear-gradient(to top,#eaf1ff,#f4f9ff); border-radius: 500px; padding: 100px 0} .ad .sec3 h2{font-size:2.8em;color:#1b3b78;margin-bottom:15px;line-height: 1.2em} .ad .sec3 h3{font-size:2.2em;color:#1b3b78;margin-bottom:15px;line-height: 1.2em} .ad .sec3 h3 span {font-size:0.5em; border-radius: 50px;background: #5eabfd; padding:10px 25px; font-weight: bold; color: #fff} .ad .sec3 p{font-size:1.1em;color:#444;} .ad .sec3 img {width: 50%;margin:35px 0; } /* 5. 슬라이스 탭 (의료비 섹션) */ .ad .sec5{background:url('https://images.unsplash.com/photo-1629909613654-26d118b4e6c1?auto=format&fit=crop&w=1400&q=80') center/cover no-repeat;padding: 100px 0} .ad .sec5::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.85);z-index:0;} .ad .sec5 *{position:relative;z-index:1;} .ad .sec5 img {width: 50%;margin-bottom:15px; } .ad .sec5 .tabs {display: flex!important;gap: 15px;justify-content: center;flex-wrap: wrap;flex-direction: row!important;padding: 15px 25px;margin-bottom: 30px;} .ad .sec5 .tab {padding: 10px 20px;border-radius: 6px;background: #f8f8f8;color: #333;font-weight: 500;cursor: pointer;transition: 0.3s;} .ad .sec5 .tab.active {background: #1b3b78;color: #fff;} .ad .sec5 .tab:hover { background: #1b3b7820; } .ad .sec5 .tab-content {max-width: 900px;width: 80%;border-radius: 20px;overflow:hidden;box-shadow: 0 4px 15px rgba(0,0,0,0.05);} .ad .sec5 .table-wrapper { display: none; animation: fadeIn 0.5s ease forwards; } .ad .sec5 .table-wrapper.active { display: flex; justify-content: center; align-items: center; flex-direction: column } .ad .sec5 .table-wrapper table {width: 100%;border-collapse: collapse;} .ad .sec5 .table-wrapper th,.table-wrapper td {border-bottom: 1px solid #eee;text-align: center;} .ad .sec5 .table-wrapper th {background: #f0f4ff;color: #1b3b78;font-weight: 600;} .ad .sec5 .table-wrapper td {font-family: 'OneStoreMobileGothicTitleFont';;background: #fff;padding: 15px; font-size: 1.2em} /* 6. 공급 섹션 */ .ad .sec6{background:#f0f4ff;padding: 100px 0} .ad .sec6 h2{font-size:2.1em;color:#1b3b78;margin-bottom:20px;line-height: 1.2em} .ad .sec6 p{max-width:650px;font-size:1.1em;color:#444;} .ad .sec6 img {width: 70%;margin-bottom:25px; } /* 7. CTA 섹션 */ .ad .sec7{background:linear-gradient(135deg,#1b3b78,#3459b0);color:#fff;} .ad .sec7 h2{font-size:2.2em;margin-bottom:25px;line-height: 1.2em} .ad .cta-btn{font-weight: 800;width: 70%;border: 0;display:inline-block;background: #009dff;color:#fff;padding:18px 50px;border-radius:50px;font-size:1.2em;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,0.2);transition:0.3s;} .ad .cta-btn:not(:last-child) {margin-bottom: 15px} .ad .cta-btn:hover{background: #008cff;} .ad .cta-btn:nth-child(2) {background: #1b3b78} .ad .cta-btn.cs {background: #fff;color:#009dff} /* 8. 푸터 */ .ad .sec8{background: #ededed;padding:40px 15px;} .ad .sec8 img {width: 40%; margin: 0 auto } .ad .sec9{background: #e5e5e4;color: #727375;text-align:center;padding:40px 15px;} .ad .sec9 p{margin:4px 0;font-size:0.95em;} .ad .sec9 a{color: #727375;text-decoration:underline;} .ad_fixed {position: fixed; bottom: 50px; right: 15%;display: flex; justify-content: center; align-items: start; flex-direction: column } .ad_fixed h2{transition: color 0.2s linear;font-family: 'OneStoreMobileGothicTitleFont';font-size:2.1em;color:#1b3b78;margin-bottom:20px;line-height: 1.2em} .ad_fixed button{border: 0;display:inline-block;background:#1b3b78;color:#fff;padding:18px 50px;border-radius:50px;font-size:1.2em;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,0.2);transition:0.3s;} .ad_fixed button:hover{background: #071a3d;} .ad_scroll {position: fixed;bottom: 50px;left: 30%;display: flex;justify-content: center;align-items: start;flex-direction: column;z-index: 9999;} .scroll-btn {cursor: pointer;width: 60px;height: 60px;border-radius: 50%;background: #ffffff;display: flex;justify-content: center;align-items: center;box-shadow: 0 4px 10px rgba(0,0,0,0.2);transition: all 0.4s ease;overflow: hidden;} .ad_scroll .mouse {width: 22px;height: 36px;border: 2px solid rgba(0, 0, 0, 0.2);border-radius: 16px;position: relative;animation: fadeIn 0.5s ease;} .ad_scroll .mouse .wheel {width: 4px;height: 6px;background: rgba(0, 0, 0, 0.2);border-radius: 2px;position: absolute;top: 6px;left: 50%;transform: translateX(-50%);animation: wheelMove 1.4s infinite ease-in-out;} .scroll-btn i {color: rgba(0, 0, 0, 0.2);font-size: 22px;display: none;} @keyframes wheelMove { 0% { opacity: 0; transform: translate(-50%, 0); } 40% { opacity: 1; transform: translate(-50%, 8px); } 100% { opacity: 0; transform: translate(-50%, 16px); } } @keyframes fadeIn { from { opacity: 0; transform: scale(0.8); } to { opacity: 1; transform: scale(1); } } .scroll-btn.up .mouse {display: none;} .scroll-btn.up i {display: block;} @media (max-width: 1800px) { .ad_fixed { right: 10%; } .ad_scroll {left: 25%;} } @media (max-width: 1400px) { .ad_fixed { right: 4%; } .ad_scroll {left: 20%;} } @media (max-width: 1300px) { .ad_fixed { right: 0%; } .ad_scroll {left: 20%;} } body:has(div.ad) {transition: background-color 0.2s linear;} body:has(div.ad) #pipBtn {display: none} body:has(div.ad) #hq {max-width: 500px !important;margin: 150px auto !important;border-radius: 50px;padding: 0;overflow: hidden; box-shadow: 0 0 155px #00000020;} body:has(#hq.active div.ad) #hq {margin: 50px auto !important;;}