Commit @4ea5deccf6c2a0fa47497a1abb8365fed415681b

최정임 2023-03-03

230303 최정임 에이젼시 반응형 수정

@4ea5deccf6c2a0fa47497a1abb8365fed415681b

5d858df

4ea5dec

client/resources/css/common.css

--- client/resources/css/common.css

+++ client/resources/css/common.css


 .flex100 {
   flex: 0 0 100%;
 }
-
 /* width 공통 */
 .width100 {
   width: 100%;

5d858df

4ea5dec

client/resources/css/layout.css

--- client/resources/css/layout.css

+++ client/resources/css/layout.css


   grid-template-columns: 315px 1fr;
   grid-template-rows: 0.1fr 2.9fr;
 }
-#layout.expander{
-  grid-template-columns: 50px 1fr;
-}
 header {
   padding: 1rem 3rem;
   background-color: white;

   width: 100%;
 }
 
-.page-title span {
-  font-size: 1.8rem;
+.page-title-span {
+  font-size: 2.5rem;
   font-weight: bold;
-  margin-left: 1rem;
 }
 
 nav{
   height: 100%;
+  width: 310px;
   background-color: #f2f0eb;
   grid-area: nav;
-  position: relative;
+  position: fixed;
+  z-index: 10;
   background: #ffffff;
   box-shadow: 1px 0px 6px 2px rgb(0 0 0 / 20%); 
 }

 .logout{background: #f26e50;}
 #pages {
   max-width: 100%;
-  height: 100%;
+  height: fit-content;
   padding: 3rem;
   background-color: #f4f4f2;
   grid-area: main;

 
 main {
   max-width: 100%;
+  height: 100%;
 }
 
 .content-wrap {

 .userlist{
   box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%);
   width: 100%;
-  height: 51rem;
   padding: 4.5rem 2rem;
 }
 

 }
 .hierarchy-menu ul a {
   display: block;
-  padding: 6px 5rem;
+  padding: 6px 0 0 5rem;
   height: 44px;
   position: relative;
   color: #333333;

5d858df

4ea5dec

client/resources/css/main.css

--- client/resources/css/main.css

+++ client/resources/css/main.css


 /* 공통 */
-.logo {
-  font-size: 2.4rem;
-  font-family: 'AuctionGothic_Medium';
-}
-
 header>div {
   height: 100%;
 }

 .menuicon {
   display: none;
   cursor: pointer;
-  height: 9.4rem;
-  left: 2.5rem;
+  left: 1.5rem;
   top: 2.6rem;
   position: absolute;
 }
 
 /* 시행기관 장비관리 리스트 */
-
+.react-calendar__month-view__days__day--neighboringMonth{display: none;}
 .visitlist {
   height: 55vh;
 }

 }
 
 .question-select label {
-  width: 10%;
+  margin-right: 1rem;
 }
 
 .question-select select {
   width: 16%;
   height: 3.7rem;
+  margin-right: 1rem;
 }
 
 .qna-insert select {

 
 
 /* -----------------------------------------------지자체 */
-
+.statistics-agency #RowChart>div{height: 36rem;}
 
 .map {
   width: 100%;

 .detail-search table td {
   border-top: none;
 }
-
-.detail-search tbody tr:nth-of-type(2) select {
-  width: 24.4%;
-}
-
 .detail-search tbody select {
   height: 3.7rem;
 }

 }
 
 /* 사용자 관리 */
+.userauthoriylist .left{width: 27%;}
+ .userauthoriylist .right{width: 70%; }
+.bSXvtB{display: none;}
 .tab-menu .tab-menu-agency {
   display: flex;
 }

 
 .search-management select {
   width: 15%;
-  height: 3rem;
+  height: 3.6rem;
+  margin-right: 1rem;
 }
 
 .search-management input {
   width: 20%;
-  height: 3.7rem;
+  height: 3.6rem;
   margin-right: 1rem;
 }
 

5d858df

4ea5dec

client/resources/css/reset.css

--- client/resources/css/reset.css

+++ client/resources/css/reset.css


 select{
   width: 32%;
   border-radius: 0.5rem;
-  margin-right: 1rem;
   border: 1px solid #d8d3c7;
 }
 

5d858df

4ea5dec

client/resources/css/responsive.css

--- client/resources/css/responsive.css

+++ client/resources/css/responsive.css


   .usericon {
     display: none;
   }
-
+  .ittLqr{font-size: 1.3rem !important;}
   /* 공통 */
   #layout{display: block;}
-  #pages{padding: 1rem;}
+  #pages{padding: 1rem; }
   header {
     padding: 1rem;
     position: fixed;
   }
   nav {
     position: fixed;
-    left: -310px;
-    top: 86px;
-    z-index: 10;
+    left: -320px;
+    top: 87px;
+    z-index: 12;
     transition: 0.5s;
     box-shadow:12px -6px 10px -10px rgb(0 0 0 / 20%);
     height:91vh;

     transition: 0.5s;
   }
   .bottom-section{padding: 0.9rem ; bottom: 6rem;}
-  .content-wrap{padding: 1rem;}
+  .content-wrap{padding: 3rem 1rem 0 1rem; }
   th,td,tr{display: block;}
+  .header-info-id,#fullDate, #temp,.cCoJhO{display: none;}
+  /* 에이젼시 메인 */
+  .main-grid-agency{display: block;}
+  .main-grid-agency .agency-visitlist{margin-top: 16rem;}
+  .agency-calendar .react-calendar__month-view__weekdays{display: flex !important;}
+  .agency-calendar .react-calendar__month-view__days__day{flex: 0 0 12.5% !important;}
+  .agency-calendar .react-calendar__month-view__days{flex-wrap: wrap !important;}
+  .tab-menu-agency li{padding: 1rem;}
+  .statistics-agency{margin-bottom: 1rem;}
+  /* 지자체 메인 */
+  .main-grid-government{display: block;}
+  .main-grid-government .content-box:nth-child(8), .main-grid-government .content-box:nth-child(6){height: 30rem;}
+  #RowChart>div{height: 36rem;}  
+  .main-grid-government .content-box{margin-bottom: 1rem;}
+  .statistics-govern{margin-bottom: 1rem;}
+  /* Q&A */
+  .question-select select{width: 22%;}
   /* 권한관리 */
   .authority-table-pc {
     display: none;

   }
 
   /* 사용자관리 */
-  .tab-menu-mobile {
-    display: block;
-    padding: 1rem;
-    background-color: #ffffff;
-  }
-
-  .tab-menu {
-    display: none;
-  }
-
+  .searchselect label{margin-right: 2rem;}
+  .protector-user{margin-top: 2rem;}
+  .userauthoriylist{display: block;}
+  .userauthoriylist .left, .userauthoriylist .right {
+    width: 100% ;
+}
+.userauthoriylist .right{margin-top: 2rem;}
+.tab-menu li{width: 100%;}
   .search-management {
     justify-content: space-between;
   }
 
   .search-management select {
     width: 22%;
+    margin: 0;
   }
 
   .search-management input {
-    width: 30%;
-    margin-right: 1rem;
+    width: 52%;margin: 0;
   }
 
-  .search-management button {
-    width: 20%;
-  }
-
-  /* 공통 */
-
-  .header-flex {
-    display: flex;
-    justify-content: flex-start;
-  }
-
-  /* 보호자 메인 그리드 */
-  .pc {
-    display: none;
-  }
-
-  .mobile {
-    display: block;
-  }
-
-  .mobile .main-grid-guardian {
-    gap: 0.5rem;
-  }
-
-  .mobile .main-grid-guardian .content-box {
-    padding: 0.5rem;
-  }
-
-  .mobile .main-grid-guardian .content-box:nth-child(2)>div p {
-    font-size: 1.8rem;
-  }
-
-  .mobile .main-grid-guardian .content-box:nth-child(7)>div {
-    justify-content: flex-start;
-  }
-
-  .mobile .main-grid-guardian {
-    grid-template-columns: 1fr;
-    grid-template-rows: none;
-  }
-
-  .mobile .main-grid-guardian .combine-right-government,
-  .mobile .main-grid-guardian .combine-left {
-    grid-column: 1;
-  }
-
-  .mobile .main-grid-guardian .combine-bottom-government {
-    grid-column: 0;
-  }
+ .searchselect-wrap{display: block;}
+ .searchselect{width: max-content;}
+ .page-title-span{display: block;
+  margin-left: 5rem;}
 
   /* button */
 
   .btn-large {
     font-size: 1.4rem;
-    width: 20%;
   }
 
   /* 로그인 */

     width: 30%;
   }
 
-  /* 메인 */
-  .temp p {
-    font-size: 2rem;
-  }
-
-  .main-battery-title {
-    font-size: 1.4rem;
-    justify-content: flex-start;
-    padding-right: 1rem;
-  }
-
-  .battery::after {
-    content: " 남았습니다.";
-    font-size: 1.4rem;
-    margin-left: 0;
-  }
-
-  .battery p {
-    font-size: 2rem;
-    padding-left: 0;
-    padding-right: 1rem;
-  }
-
-  #chartdiv1 {
-    height: 25vh;
-  }
-
-  .statistics li p:nth-of-type(1),
-  .statistics li p:nth-of-type(2) {
-    font-size: 1.4rem;
-  }
-
-  .weather-info {
-    width: 70%;
-  }
-
-  .recent-visit {
-    border: 0;
-  }
-
-  .recent-visit td {
-    padding-left: 12rem;
-  }
-
-  .recent-visit td:nth-of-type(1) {
-    font-weight: bold;
-    padding: 0.5rem;
-  }
-
-  .recent-visit td:nth-of-type(1)::before {
-    content: "";
-  }
-
-  .recent-visit td:nth-of-type(2):before {
-    content: "방문목적";
-  }
-
-  .recent-visit td:nth-of-type(3):before {
-    content: "방문 상세 이유";
-  }
-
 
   /* 검색창 */
-
-  .mobile-area-wrap {
-    display: block;
-    margin-top: 1rem;
-  }
-
-  .mobile-area-wrap div {
-    width: 100%;
-    margin-top: 1rem;
-  }
-
-  .mobile-area-wrap div label {
-    width: 30%;
-    font-size: 1.6rem;
-  }
-
-  .mobile-area-wrap div select {
-    width: 70%;
-  }
 
   .area-wrap {
     display: none;

   }
 
   /* 장비조회 */
-
+  .equip-tab{display: block;}
   /* 장비 상세 조회 */
   /* 장비등록창 */
   .equipment-modal tbody td {

5d858df

4ea5dec

client/views/component/AgencySearch.jsx

--- client/views/component/AgencySearch.jsx

+++ client/views/component/AgencySearch.jsx


 
   return (
     <div className="search-group">
-      <div className="search-area flex" style={{ width:"50%"}}>
-        <div className="detail-search" style={{ width:"85%"}}>
+      <div className="search-area flex-start" >
+        <div className="detail-search" >
           <table>
             <tbody>
               <tr>

5d858df

4ea5dec

client/views/component/DetailTitle.jsx

--- client/views/component/DetailTitle.jsx

+++ client/views/component/DetailTitle.jsx


   &::before {
     content: "";
     position: absolute;
-    z-index: 10;
+    z-index: 5;
     left: 0;
     bottom: -15px;
     height: 8px;

5d858df

4ea5dec

client/views/layout/Header.jsx

--- client/views/layout/Header.jsx

+++ client/views/layout/Header.jsx


   return (
     <header>
       <div className="header-flex flex flex-align">
+        <span className="page-title-span">{title}</span>
         <div className="page-title flex flex-align">
           {/* <MenuIcon /> */}
           <div className="info-wrap flex">
             <div className="usericon"><PersonIcon sx={{ width:48, height:48,}} /></div>
-            <p className="header-info-id">admin1</p>
-            
+            <p className="header-info-id">admin1</p>            
           </div>
-          {/* <span>{title}</span> */}
-        </div>
         <Weather />
+        </div>
       </div>
     </header>
   );

5d858df

4ea5dec

client/views/pages/callcenter/QandASelect.jsx

--- client/views/pages/callcenter/QandASelect.jsx

+++ client/views/pages/callcenter/QandASelect.jsx


 import Button from "../../component/Button.jsx";
 import Table from "../../component/Table.jsx";
 import Modal from "../../component/Modal.jsx";
+import DetailTitle from "../../component/DetailTitle.jsx";
 import { useNavigate } from "react-router";
 import ContentTitle from "../../component/ContentTitle.jsx";
 import RestoreFromTrashIcon from '@mui/icons-material/RestoreFromTrash';

   return (
     <main>
       <div className="content-wrap">
-        <ContentTitle contentTitle={"장비 문의 요청"} />
-        <div className="board-wrap">
+      <DetailTitle contentTitle={"장비 문의 요청"} />
+        <div className="board-wrap" style={{ marginTop: "3rem" }} >
           <div className="btn-wrap flex-end margin-bottom">
             
             <Button

5d858df

4ea5dec

client/views/pages/callcenter/QuestionSelect.jsx

--- client/views/pages/callcenter/QuestionSelect.jsx

+++ client/views/pages/callcenter/QuestionSelect.jsx


         header="기관 등록"
       ></QnAModal>
       <div className="content-wrap">
-        <ContentTitle contentTitle={"Q&A"} />
         <div className="board-wrap">
           <div className="btn-wrap flex-end margin-bottom question-select">
             <input type="checkbox" />

5d858df

4ea5dec

client/views/pages/equipment/EquipmentManagementSelect.jsx

--- client/views/pages/equipment/EquipmentManagementSelect.jsx

+++ client/views/pages/equipment/EquipmentManagementSelect.jsx


 			title: "전체 장비" + "(" + equipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 						<div className="btn-wrap flex-end margin-bottom ">
 							<Button

 			title: "전체 장비(시행기관)" + "(" + agencyEquipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 						<div className="btn-wrap flex-end margin-bottom ">
 							<Button

 			title: "대상자 장비(시행기관)" + "(" + agencySeniorEquipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 					</div>
 					<table class="caregiver-user">

 			title: "재고 장비(시행기관)" + "(" + agencyStockEquipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 					</div>
 					<table class="caregiver-user">

 					))}
 				</ul>
 				<div className="content-wrap">
-					<div className="search-management flex-end margin-bottom2">
-						<select name="management-agency">
-							<option value="기관전체">기관전체</option>
-							<option value="대구보훈병원">복지재단1</option>
-							<option value="군위군청">복지재단2</option>
-							<option value="군위군청">복지재단3</option>
-						</select>
+					<div className="search-management flex-end margin-bottom2">						
 						<select>
-							<option value="이름">이름</option>
-							<option value="아이디">아이디</option>
+							<option value="기관명">기관명</option>
+							<option value="시리얼넘버">시리얼넘버</option>
 						</select>
 						<input type="text" />
 						<Button

5d858df

4ea5dec

client/views/pages/healthcare/Medicalcare.jsx

--- client/views/pages/healthcare/Medicalcare.jsx

+++ client/views/pages/healthcare/Medicalcare.jsx


 
     return (
         <main>
-
-            <ContentTitle contentTitle={"진료 관리"} explanation={"대상자의 문진표/심전도/혈압 관리를 할 수 있습니다."} />
             <div className="content-wrap">
                 <Modal_Questionnaire open={modalOpen} close={closeModal} />
                 <Modal_MedicalHistory open={modalOpen2} close={closeModal2} />

                                     ))}
                                 </ul>
                                 <div className="content-wrap userlist">
-                                    <DetailTitle contentTitle={`${tapName}`} />
+                                    <DetailTitle contentTitle={"대상자의 문진표 / 심전도 / 혈압 관리를 할 수 있습니다."} />
                                     <div className="search-management flex-start margin-bottom2">
                                         <DetailSearch />
                                     </div>

5d858df

4ea5dec

client/views/pages/main/Main_government.jsx

--- client/views/pages/main/Main_government.jsx

+++ client/views/pages/main/Main_government.jsx


             <p>400</p>
           </li>
         </ul>
-        <div className="content-box combine-all-government combine-bottom-government2">
-        <div className="flex">
-            <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
-          </div>
-          <RowChart_govern />
-        </div>
         <div className="content-box combine-left-government combine-bottom-government2 main-main">
           <div className="flex">
             <Title title={"지역별 케어 대상자 분포 현황"} explanation={"지역 선택 시 해당 지역의 대상자리스트가 보여집니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Map setCityName={setCityName} />
         </div>
+        <div className="content-box combine-all-government combine-bottom-government2">
+        <div className="flex">
+            <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
+          </div>
+          <RowChart_govern />
+        </div>        
         <div className="content-box combine-left-government2">
           <div className="flex">
             <Title title={`${cityName} 복용률 평균`} explanation={"해당 지역의 대상자 복용률이 그래프로 보여집니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Chart2_govern />
         </div>
         <div className="content-box combine-right-government2">
         <div className="flex">
             <Title title={`기관별 대상자 등록 현황`} explanation={"약상자 사용자의 데이터 차트가 보여집니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Chart5 />         
         </div>
         <div className="content-box combine-right-government">
           <div className="flex">
             <Title title={`기관별 약상자 사용 현황`} explanation={""} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Donut1_govern />
         </div>        

5d858df

4ea5dec

client/views/pages/user_management/UserAuthoriySelect.jsx

--- client/views/pages/user_management/UserAuthoriySelect.jsx

+++ client/views/pages/user_management/UserAuthoriySelect.jsx


       <div className="content-wrap">
         
         <div
-          className="flex-align-start"
+          className="flex-align-start userauthoriylist"
           style={{ height: "calc(100% - 61px)" }}
         >
-          <div className="left" style={{ height: "100%", width:"27%" }}>
+          <div className="left" style={{ height: "100%", }}>
             <div style={{ height: "100%" }}>
               <SubTitle
                 subtitle={"관리기관 리스트"}

                 <Category />
             </div>
           </div>
-          <div className="right" style={{ height: "100%", width:"70%" }}>
+          <div className="right" style={{ height: "100%", }}>
             <div style={{ height: "100%" }}>
               <SubTitle
                 subtitle={`${agencyName} 사용자 리스트`}

                 className="margin-bottom"
               />
               <div className="tab-container">
-                <ul className="tab-menu-mobile">
-                  <div>
-                    <SubTitle
-                      className="margin-bottom"
-                      subtitle={"사용자 선택"}
-                      explanation={"사용자 별로 선택 후 관리할 수 있습니다. "}
-                    />
-                  </div>
-                  <select name="" id="" style={{ width: "100%" }}>
-                    <option value="사용자선택">보호자</option>
-                    <option value="사용자선택">보호사</option>
-                    <option value="사용자선택">병원</option>
-                    <option value="사용자선택">지자체</option>
-                    <option value="사용자선택">관리자</option>
-                  </select>
-                </ul>
                 <ul className="tab-menu flex-end">
                   {data.map((item) => (
                     <li

Add a comment

Open 0
Closed 0

List

...	...	@@ -227,7 +227,6 @@
227	227	.flex100 {
228	228	flex: 0 0 100%;
229	229	}
230		-
231	230	/* width 공통 */
232	231	.width100 {
233	232	width: 100%;

...	...	@@ -16,9 +16,6 @@
16	16	grid-template-columns: 315px 1fr;
17	17	grid-template-rows: 0.1fr 2.9fr;
18	18	}
19		-#layout.expander{
20		- grid-template-columns: 50px 1fr;
21		-}
22	19	header {
23	20	padding: 1rem 3rem;
24	21	background-color: white;
...	...	@@ -28,17 +25,18 @@
28	25	width: 100%;
29	26	}
30	27
31		-.page-title span {
32		- font-size: 1.8rem;
	28	+.page-title-span {
	29	+ font-size: 2.5rem;
33	30	font-weight: bold;
34		- margin-left: 1rem;
35	31	}
36	32
37	33	nav{
38	34	height: 100%;
	35	+ width: 310px;
39	36	background-color: #f2f0eb;
40	37	grid-area: nav;
41		- position: relative;
	38	+ position: fixed;
	39	+ z-index: 10;
42	40	background: #ffffff;
43	41	box-shadow: 1px 0px 6px 2px rgb(0 0 0 / 20%);
44	42	}
...	...	@@ -131,7 +129,7 @@
131	129	.logout{background: #f26e50;}
132	130	#pages {
133	131	max-width: 100%;
134		- height: 100%;
	132	+ height: fit-content;
135	133	padding: 3rem;
136	134	background-color: #f4f4f2;
137	135	grid-area: main;
...	...	@@ -141,6 +139,7 @@
141	139
142	140	main {
143	141	max-width: 100%;
	142	+ height: 100%;
144	143	}
145	144
146	145	.content-wrap {
...	...	@@ -151,7 +150,6 @@
151	150	.userlist{
152	151	box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%);
153	152	width: 100%;
154		- height: 51rem;
155	153	padding: 4.5rem 2rem;
156	154	}
157	155
...	...	@@ -237,7 +235,7 @@
237	235	}
238	236	.hierarchy-menu ul a {
239	237	display: block;
240		- padding: 6px 5rem;
	238	+ padding: 6px 0 0 5rem;
241	239	height: 44px;
242	240	position: relative;
243	241	color: #333333;

...	...	@@ -1,9 +1,4 @@
1	1	/* 공통 */
2		-.logo {
3		- font-size: 2.4rem;
4		- font-family: 'AuctionGothic_Medium';
5		-}
6		-
7	2	header>div {
8	3	height: 100%;
9	4	}
...	...	@@ -20,14 +15,13 @@
20	15	.menuicon {
21	16	display: none;
22	17	cursor: pointer;
23		- height: 9.4rem;
24		- left: 2.5rem;
	18	+ left: 1.5rem;
25	19	top: 2.6rem;
26	20	position: absolute;
27	21	}
28	22
29	23	/* 시행기관 장비관리 리스트 */
30		-
	24	+.react-calendar__month-view__days__day--neighboringMonth{display: none;}
31	25	.visitlist {
32	26	height: 55vh;
33	27	}
...	...	@@ -66,12 +60,13 @@
66	60	}
67	61
68	62	.question-select label {
69		- width: 10%;
	63	+ margin-right: 1rem;
70	64	}
71	65
72	66	.question-select select {
73	67	width: 16%;
74	68	height: 3.7rem;
	69	+ margin-right: 1rem;
75	70	}
76	71
77	72	.qna-insert select {
...	...	@@ -139,7 +134,7 @@
139	134
140	135
141	136	/* -----------------------------------------------지자체 */
142		-
	137	+.statistics-agency #RowChart>div{height: 36rem;}
143	138
144	139	.map {
145	140	width: 100%;
...	...	@@ -779,11 +774,6 @@
779	774	.detail-search table td {
780	775	border-top: none;
781	776	}
782		-
783		-.detail-search tbody tr:nth-of-type(2) select {
784		- width: 24.4%;
785		-}
786		-
787	777	.detail-search tbody select {
788	778	height: 3.7rem;
789	779	}
...	...	@@ -1137,6 +1127,9 @@
1137	1127	}
1138	1128
1139	1129	/* 사용자 관리 */
	1130	+.userauthoriylist .left{width: 27%;}
	1131	+ .userauthoriylist .right{width: 70%; }
	1132	+.bSXvtB{display: none;}
1140	1133	.tab-menu .tab-menu-agency {
1141	1134	display: flex;
1142	1135	}
...	...	@@ -1174,12 +1167,13 @@
1174	1167
1175	1168	.search-management select {
1176	1169	width: 15%;
1177		- height: 3rem;
	1170	+ height: 3.6rem;
	1171	+ margin-right: 1rem;
1178	1172	}
1179	1173
1180	1174	.search-management input {
1181	1175	width: 20%;
1182		- height: 3.7rem;
	1176	+ height: 3.6rem;
1183	1177	margin-right: 1rem;
1184	1178	}
1185	1179

...	...	@@ -94,7 +94,6 @@
94	94	select{
95	95	width: 32%;
96	96	border-radius: 0.5rem;
97		- margin-right: 1rem;
98	97	border: 1px solid #d8d3c7;
99	98	}
100	99

...	...	@@ -190,8 +190,8 @@
190	190
191	191	return (
192	192	<div className="search-group">
193		- <div className="search-area flex" style={{ width:"50%"}}>
194		- <div className="detail-search" style={{ width:"85%"}}>
	193	+ <div className="search-area flex-start" >
	194	+ <div className="detail-search" >
195	195	<table>
196	196	<tbody>
197	197	<tr>

...	...	@@ -573,19 +573,19 @@
573	573	.usericon {
574	574	display: none;
575	575	}
576		-
	576	+ .ittLqr{font-size: 1.3rem !important;}
577	577	/* 공통 */
578	578	#layout{display: block;}
579		- #pages{padding: 1rem;}
	579	+ #pages{padding: 1rem; }
580	580	header {
581	581	padding: 1rem;
582	582	position: fixed;
583	583	}
584	584	nav {
585	585	position: fixed;
586		- left: -310px;
587		- top: 86px;
588		- z-index: 10;
	586	+ left: -320px;
	587	+ top: 87px;
	588	+ z-index: 12;
589	589	transition: 0.5s;
590	590	box-shadow:12px -6px 10px -10px rgb(0 0 0 / 20%);
591	591	height:91vh;
...	...	@@ -596,8 +596,25 @@
596	596	transition: 0.5s;
597	597	}
598	598	.bottom-section{padding: 0.9rem ; bottom: 6rem;}
599		- .content-wrap{padding: 1rem;}
	599	+ .content-wrap{padding: 3rem 1rem 0 1rem; }
600	600	th,td,tr{display: block;}
	601	+ .header-info-id,#fullDate, #temp,.cCoJhO{display: none;}
	602	+ /* 에이젼시 메인 */
	603	+ .main-grid-agency{display: block;}
	604	+ .main-grid-agency .agency-visitlist{margin-top: 16rem;}
	605	+ .agency-calendar .react-calendar__month-view__weekdays{display: flex !important;}
	606	+ .agency-calendar .react-calendar__month-view__days__day{flex: 0 0 12.5% !important;}
	607	+ .agency-calendar .react-calendar__month-view__days{flex-wrap: wrap !important;}
	608	+ .tab-menu-agency li{padding: 1rem;}
	609	+ .statistics-agency{margin-bottom: 1rem;}
	610	+ /* 지자체 메인 */
	611	+ .main-grid-government{display: block;}
	612	+ .main-grid-government .content-box:nth-child(8), .main-grid-government .content-box:nth-child(6){height: 30rem;}
	613	+ #RowChart>div{height: 36rem;}
	614	+ .main-grid-government .content-box{margin-bottom: 1rem;}
	615	+ .statistics-govern{margin-bottom: 1rem;}
	616	+ /* Q&A */
	617	+ .question-select select{width: 22%;}
601	618	/* 권한관리 */
602	619	.authority-table-pc {
603	620	display: none;
...	...	@@ -654,84 +671,36 @@
654	671	}
655	672
656	673	/* 사용자관리 */
657		- .tab-menu-mobile {
658		- display: block;
659		- padding: 1rem;
660		- background-color: #ffffff;
661		- }
662		-
663		- .tab-menu {
664		- display: none;
665		- }
666		-
	674	+ .searchselect label{margin-right: 2rem;}
	675	+ .protector-user{margin-top: 2rem;}
	676	+ .userauthoriylist{display: block;}
	677	+ .userauthoriylist .left, .userauthoriylist .right {
	678	+ width: 100% ;
	679	+}
	680	+.userauthoriylist .right{margin-top: 2rem;}
	681	+.tab-menu li{width: 100%;}
667	682	.search-management {
668	683	justify-content: space-between;
669	684	}
670	685
671	686	.search-management select {
672	687	width: 22%;
	688	+ margin: 0;
673	689	}
674	690
675	691	.search-management input {
676		- width: 30%;
677		- margin-right: 1rem;
	692	+ width: 52%;margin: 0;
678	693	}
679	694
680		- .search-management button {
681		- width: 20%;
682		- }
683		-
684		- /* 공통 */
685		-
686		- .header-flex {
687		- display: flex;
688		- justify-content: flex-start;
689		- }
690		-
691		- /* 보호자 메인 그리드 */
692		- .pc {
693		- display: none;
694		- }
695		-
696		- .mobile {
697		- display: block;
698		- }
699		-
700		- .mobile .main-grid-guardian {
701		- gap: 0.5rem;
702		- }
703		-
704		- .mobile .main-grid-guardian .content-box {
705		- padding: 0.5rem;
706		- }
707		-
708		- .mobile .main-grid-guardian .content-box:nth-child(2)>div p {
709		- font-size: 1.8rem;
710		- }
711		-
712		- .mobile .main-grid-guardian .content-box:nth-child(7)>div {
713		- justify-content: flex-start;
714		- }
715		-
716		- .mobile .main-grid-guardian {
717		- grid-template-columns: 1fr;
718		- grid-template-rows: none;
719		- }
720		-
721		- .mobile .main-grid-guardian .combine-right-government,
722		- .mobile .main-grid-guardian .combine-left {
723		- grid-column: 1;
724		- }
725		-
726		- .mobile .main-grid-guardian .combine-bottom-government {
727		- grid-column: 0;
728		- }
	695	+ .searchselect-wrap{display: block;}
	696	+ .searchselect{width: max-content;}
	697	+ .page-title-span{display: block;
	698	+ margin-left: 5rem;}
729	699
730	700	/* button */
731	701
732	702	.btn-large {
733	703	font-size: 1.4rem;
734		- width: 20%;
735	704	}
736	705
737	706	/* 로그인 */
...	...	@@ -765,88 +734,8 @@
765	734	width: 30%;
766	735	}
767	736
768		- /* 메인 */
769		- .temp p {
770		- font-size: 2rem;
771		- }
772		-
773		- .main-battery-title {
774		- font-size: 1.4rem;
775		- justify-content: flex-start;
776		- padding-right: 1rem;
777		- }
778		-
779		- .battery::after {
780		- content: " 남았습니다.";
781		- font-size: 1.4rem;
782		- margin-left: 0;
783		- }
784		-
785		- .battery p {
786		- font-size: 2rem;
787		- padding-left: 0;
788		- padding-right: 1rem;
789		- }
790		-
791		- #chartdiv1 {
792		- height: 25vh;
793		- }
794		-
795		- .statistics li p:nth-of-type(1),
796		- .statistics li p:nth-of-type(2) {
797		- font-size: 1.4rem;
798		- }
799		-
800		- .weather-info {
801		- width: 70%;
802		- }
803		-
804		- .recent-visit {
805		- border: 0;
806		- }
807		-
808		- .recent-visit td {
809		- padding-left: 12rem;
810		- }
811		-
812		- .recent-visit td:nth-of-type(1) {
813		- font-weight: bold;
814		- padding: 0.5rem;
815		- }
816		-
817		- .recent-visit td:nth-of-type(1)::before {
818		- content: "";
819		- }
820		-
821		- .recent-visit td:nth-of-type(2):before {
822		- content: "방문목적";
823		- }
824		-
825		- .recent-visit td:nth-of-type(3):before {
826		- content: "방문 상세 이유";
827		- }
828		-
829	737
830	738	/* 검색창 */
831		-
832		- .mobile-area-wrap {
833		- display: block;
834		- margin-top: 1rem;
835		- }
836		-
837		- .mobile-area-wrap div {
838		- width: 100%;
839		- margin-top: 1rem;
840		- }
841		-
842		- .mobile-area-wrap div label {
843		- width: 30%;
844		- font-size: 1.6rem;
845		- }
846		-
847		- .mobile-area-wrap div select {
848		- width: 70%;
849		- }
850	739
851	740	.area-wrap {
852	741	display: none;
...	...	@@ -1072,7 +961,7 @@
1072	961	}
1073	962
1074	963	/* 장비조회 */
1075		-
	964	+ .equip-tab{display: block;}
1076	965	/* 장비 상세 조회 */
1077	966	/* 장비등록창 */
1078	967	.equipment-modal tbody td {

...	...	@@ -28,7 +28,7 @@
28	28	&::before {
29	29	content: "";
30	30	position: absolute;
31		- z-index: 10;
	31	+ z-index: 5;
32	32	left: 0;
33	33	bottom: -15px;
34	34	height: 8px;

...	...	@@ -2,6 +2,7 @@
2	2	import Button from "../../component/Button.jsx";
3	3	import Table from "../../component/Table.jsx";
4	4	import Modal from "../../component/Modal.jsx";
	5	+import DetailTitle from "../../component/DetailTitle.jsx";
5	6	import { useNavigate } from "react-router";
6	7	import ContentTitle from "../../component/ContentTitle.jsx";
7	8	import RestoreFromTrashIcon from '@mui/icons-material/RestoreFromTrash';
...	...	@@ -62,8 +63,8 @@
62	63	return (
63	64	<main>
64	65	<div className="content-wrap">
65		- <ContentTitle contentTitle={"장비 문의 요청"} />
66		- <div className="board-wrap">
	66	+ <DetailTitle contentTitle={"장비 문의 요청"} />
	67	+ <div className="board-wrap" style={{ marginTop: "3rem" }} >
67	68	<div className="btn-wrap flex-end margin-bottom">
68	69
69	70	<Button

...	...	@@ -95,7 +95,6 @@
95	95	header="기관 등록"
96	96	></QnAModal>
97	97	<div className="content-wrap">
98		- <ContentTitle contentTitle={"Q&A"} />
99	98	<div className="board-wrap">
100	99	<div className="btn-wrap flex-end margin-bottom question-select">
101	100	<input type="checkbox" />

...	...	@@ -846,7 +846,7 @@
846	846	title: "전체 장비" + "(" + equipmentList.length + ")",
847	847	description: (
848	848	<div>
849		- <div className="flex">
	849	+ <div className="flex equip-tab">
850	850	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
851	851	<div className="btn-wrap flex-end margin-bottom ">
852	852	<Button
...	...	@@ -951,7 +951,7 @@
951	951	title: "전체 장비(시행기관)" + "(" + agencyEquipmentList.length + ")",
952	952	description: (
953	953	<div>
954		- <div className="flex">
	954	+ <div className="flex equip-tab">
955	955	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
956	956	<div className="btn-wrap flex-end margin-bottom ">
957	957	<Button
...	...	@@ -1024,7 +1024,7 @@
1024	1024	title: "대상자 장비(시행기관)" + "(" + agencySeniorEquipmentList.length + ")",
1025	1025	description: (
1026	1026	<div>
1027		- <div className="flex">
	1027	+ <div className="flex equip-tab">
1028	1028	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
1029	1029	</div>
1030	1030	<table class="caregiver-user">
...	...	@@ -1068,7 +1068,7 @@
1068	1068	title: "재고 장비(시행기관)" + "(" + agencyStockEquipmentList.length + ")",
1069	1069	description: (
1070	1070	<div>
1071		- <div className="flex">
	1071	+ <div className="flex equip-tab">
1072	1072	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
1073	1073	</div>
1074	1074	<table class="caregiver-user">
...	...	@@ -1342,16 +1342,10 @@
1342	1342	))}
1343	1343	</ul>
1344	1344	<div className="content-wrap">
1345		- <div className="search-management flex-end margin-bottom2">
1346		- <select name="management-agency">
1347		- <option value="기관전체">기관전체</option>
1348		- <option value="대구보훈병원">복지재단1</option>
1349		- <option value="군위군청">복지재단2</option>
1350		- <option value="군위군청">복지재단3</option>
1351		- </select>
	1345	+ <div className="search-management flex-end margin-bottom2">
1352	1346	<select>
1353		- <option value="이름">이름</option>
1354		- <option value="아이디">아이디</option>
	1347	+ <option value="기관명">기관명</option>
	1348	+ <option value="시리얼넘버">시리얼넘버</option>
1355	1349	</select>
1356	1350	<input type="text" />
1357	1351	<Button

...	...	@@ -168,8 +168,6 @@
168	168
169	169	return (
170	170	<main>
171		-
172		- <ContentTitle contentTitle={"진료 관리"} explanation={"대상자의 문진표/심전도/혈압 관리를 할 수 있습니다."} />
173	171	<div className="content-wrap">
174	172	<Modal_Questionnaire open={modalOpen} close={closeModal} />
175	173	<Modal_MedicalHistory open={modalOpen2} close={closeModal2} />
...	...	@@ -193,7 +191,7 @@
193	191	))}
194	192	</ul>
195	193	<div className="content-wrap userlist">
196		- <DetailTitle contentTitle={`${tapName}`} />
	194	+ <DetailTitle contentTitle={"대상자의 문진표 / 심전도 / 혈압 관리를 할 수 있습니다."} />
197	195	<div className="search-management flex-start margin-bottom2">
198	196	<DetailSearch />
199	197	</div>

...	...	@@ -114,38 +114,33 @@
114	114	<p>400</p>
115	115	</li>
116	116	</ul>
117		- <div className="content-box combine-all-government combine-bottom-government2">
118		- <div className="flex">
119		- <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
120		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
121		- </div>
122		- <RowChart_govern />
123		- </div>
124	117	<div className="content-box combine-left-government combine-bottom-government2 main-main">
125	118	<div className="flex">
126	119	<Title title={"지역별 케어 대상자 분포 현황"} explanation={"지역 선택 시 해당 지역의 대상자리스트가 보여집니다."} />
127		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
128	120	</div>
129	121	<Map setCityName={setCityName} />
130	122	</div>
	123	+ <div className="content-box combine-all-government combine-bottom-government2">
	124	+ <div className="flex">
	125	+ <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
	126	+ </div>
	127	+ <RowChart_govern />
	128	+ </div>
131	129	<div className="content-box combine-left-government2">
132	130	<div className="flex">
133	131	<Title title={`${cityName} 복용률 평균`} explanation={"해당 지역의 대상자 복용률이 그래프로 보여집니다."} />
134		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
135	132	</div>
136	133	<Chart2_govern />
137	134	</div>
138	135	<div className="content-box combine-right-government2">
139	136	<div className="flex">
140	137	<Title title={`기관별 대상자 등록 현황`} explanation={"약상자 사용자의 데이터 차트가 보여집니다."} />
141		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
142	138	</div>
143	139	<Chart5 />
144	140	</div>
145	141	<div className="content-box combine-right-government">
146	142	<div className="flex">
147	143	<Title title={`기관별 약상자 사용 현황`} explanation={""} />
148		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
149	144	</div>
150	145	<Donut1_govern />
151	146	</div>

...	...	@@ -304,10 +304,10 @@
304	304	<div className="content-wrap">
305	305
306	306	<div
307		- className="flex-align-start"
	307	+ className="flex-align-start userauthoriylist"
308	308	style={{ height: "calc(100% - 61px)" }}
309	309	>
310		- <div className="left" style={{ height: "100%", width:"27%" }}>
	310	+ <div className="left" style={{ height: "100%", }}>
311	311	<div style={{ height: "100%" }}>
312	312	<SubTitle
313	313	subtitle={"관리기관 리스트"}
...	...	@@ -317,7 +317,7 @@
317	317	<Category />
318	318	</div>
319	319	</div>
320		- <div className="right" style={{ height: "100%", width:"70%" }}>
	320	+ <div className="right" style={{ height: "100%", }}>
321	321	<div style={{ height: "100%" }}>
322	322	<SubTitle
323	323	subtitle={`${agencyName} 사용자 리스트`}
...	...	@@ -325,22 +325,6 @@
325	325	className="margin-bottom"
326	326	/>
327	327	<div className="tab-container">
328		- <ul className="tab-menu-mobile">
329		- <div>
330		- <SubTitle
331		- className="margin-bottom"
332		- subtitle={"사용자 선택"}
333		- explanation={"사용자 별로 선택 후 관리할 수 있습니다. "}
334		- />
335		- </div>
336		- <select name="" id="" style={{ width: "100%" }}>
337		- <option value="사용자선택">보호자</option>
338		- <option value="사용자선택">보호사</option>
339		- <option value="사용자선택">병원</option>
340		- <option value="사용자선택">지자체</option>
341		- <option value="사용자선택">관리자</option>
342		- </select>
343		- </ul>
344	328	<ul className="tab-menu flex-end">
345	329	{data.map((item) => (
346	330	<li

Delete comment