/* 공통 */ .dashboard .box_title{width:100%;font-size:20px;font-weight:700;} .dashboard .box_wrap{display:flex;flex-wrap:wrap;justify-content:flex-start;padding:40px;box-sizing:border-box;gap:30px;} .dashboard .box{width:calc((100%/3) - 20px);height:auto;border-radius:5px;border:5px solid #EFF2F9;background:#fff;} .dashboard .box_tit{display:flex;height:60px;align-items:center;justify-content:space-between;padding:0 25px;border-bottom:1px solid #E6E8EB;box-sizing: border-box;} .dashboard .box_tit p{font-size:20px;font-weight:bold;letter-spacing:-0.5px;color:#333;} .dashboard .box_tit .btn_plus{display:flex;font-size:16px;font-weight:300;color:#aaa;letter-spacing:-0.5px;align-items:center;gap:8px;} .dashboard .box_tit .btn_plus i{display:inline-block;width:14px;height:14px;background:url(/publish/adm/images/component/icon_plus.png) no-repeat center center;margin:-2px 0 0 0;transition:all .5s;} .dashboard .box_tit .btn_plus:hover{color:#666;font-weight:400;} .dashboard .box_tit .btn_plus:hover i{transform:rotate(90deg);} .dashboard .box_cont{position:relative;height:calc(100% - 60px);padding:20px 25px;box-sizing:border-box;} /* //공통 */ /* 오늘 사용자 현황 */ .today_box{display: flex; justify-content: space-between; align-items: center;} .today_box .today_status{text-align: center; width: calc((100% - 80px)/3);} .today_box p{font-size: 16px; font-weight: 300; margin-top: 12px;} .today_box .today_status i{display: block; width: 84px; height: 84px; background-color: #E8ECF4; border-radius: 100%; margin: 23px auto; background-repeat: no-repeat; background-position: center;} /* .today_box .status01 i{background-image: url(/publish/adm/images/dashboard/icon_today01.png);} .today_box .status02 i{background-image: url(/publish/adm/images/dashboard/icon_today02.png);} .today_box .status03 i{background-image: url(/publish/adm/images/dashboard/icon_today03.png);} */ .today_box span{font-size: 24px; font-weight: bold;} /* .today_box .status_pcs{width: 24px; height: 9px; background-image: url(/publish/adm/images/dashboard/icon_today_pcs.png);} */ /* //오늘 사용자 현황 */ /* 시스템관리 */ .system_box{display: flex; flex-wrap: wrap; justify-content: space-between;} .system_box a{position: relative; display: flex; flex-flow: column; width: calc((100% - 10px)/2); height: 90px; justify-content: center; align-items: flex-start; border-radius: 10px; background-color: #666; margin: 5px 0; padding: 0 20px; box-sizing: border-box; background-repeat: no-repeat; background-position: calc(100% - 20px) center; box-shadow: 0 0 5px rgba(0,0,0,0.3); transition: background-color 0.2s ease-in-out;} .system_box a:hover{transition: background-color 0.2s ease-in-out;} .system_box .system01{background-color: #7991C3;/* background-image: url(/publish/adm/images/dashboard/icon_system01.png); */} .system_box .system01:hover{background-color: #6281c4;} .system_box .system02{background-color: #2C3B5B;/* background-image: url(/publish/adm/images/dashboard/icon_system02.png); */} .system_box .system02:hover{background-color: #1F2D4A;} .system_box .system03{background-color: #2557B4;/* background-image: url(/publish/adm/images/dashboard/icon_system03.png); */} .system_box .system03:hover{background-color: #18418D;} .system_box .system04{background-color: #F86A3C;/* background-image: url(/publish/adm/images/dashboard/icon_system04.png); */} .system_box .system04:hover{background-color: rgb(241, 85, 33);} .system_box a::before{position: absolute; content: ""; width: 58px; height: 58px; background-color: rgba(255,255,255,0.3); border-radius: 100%; right: -5px; bottom: -5px;} .system_box p{font-size: 18px; font-weight: 400; color: #fff; letter-spacing: -0.5px; width: calc(100% - 40px); line-height: 1.3;} .system_box span{display: block; font-size: 15px; font-weight: 300; color: #fff; padding-top: 10px;} /* //시스템관리 */ /* 2021 신청 처리현황 */ .dashboard .box_cont.ds_box{padding-top:27px;} .ds_box .chartType01 li{display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px;} .ds_box .chartType01 li:last-child{margin-bottom: 0;} .ds_box .chartType01 p{font-size: 15px; font-weight: 400; width: auto; min-width:30px; text-align: right;} .ds_box .chartType01 p:first-child{margin:0 10px 0 0;} .ds_box .chartType01 .chart_wrap{width: calc(100% - 100px); height: 15px; background-color: #f1eeed; border-radius: 10px; box-shadow: inset 3px 2px 3px rgba(0,0,0,0.15); overflow: hidden;} .ds_box .chartType01 .chart_wrap div{width: 50%; height: 100%; background-color: #3A3C41; border-radius: 10px; box-shadow: inset 3px 2px 3px rgba(0,0,0,0.15);} .ds_box .chartType01 li:first-child .chart_wrap div{background-color: #428ef6;} .ds_box .chartType01 li:nth-child(2) .chart_wrap div{background-color: #fc6d38;} .ds_box .chartType01 li:nth-child(3) .chart_wrap div{background-color: #f7be0f;} .ds_box .chartType01 li:nth-child(4) .chart_wrap div{background-color: #ad65eb;} .ds_box .chartType01 li:last-child .chart_wrap div{background-color: #41b691;} .ds_box .case_number{color:#3A3C41; white-space:nowrap;} .ds_box .case_number span{font-weight:600;} .ds_box .chart_num{display: flex; width: calc(100% - 100px); justify-content: space-between; margin-left: auto; margin:15px auto 0 auto; color:#666;} /* //2021 신청 처리현황 */ /* 대시보드 리스트 */ .dashboard_list li{display:flex;font-weight:300;letter-spacing:-0.5px;border-bottom:1px solid #e5e5e5;padding:0 0 8px 0;margin:0 0 12px 0;justify-content:space-between;} .dashboard_list li:last-child{border-bottom:0;margin:0;padding:0;} .dashboard_list li p,.notice_box li a{padding:0 5px;box-sizing:border-box;} .dashboard_list li:hover p,.dashboard_list li:hover a{color:#222;font-weight:400;} .dashboard_list li a{width:98%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-size:17px;color:#222;} .dashboard_list .list_tit{display:inline-block;width:calc(100% - 170px);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;} .dashboard_list .list_tit img{display:inline-block;vertical-align:text-top;} .dashboard_list .list_writer,.dashboard_list .list_date{font-size:16px;color:#777777;} .dashboard_list .list_writer{width:60px;max-width:60px;text-align: right;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;} .dashboard_list .list_date{width: 100px; text-align: right;} .dashboard_list.status{display:flex;flex-wrap:wrap;} .dashboard_list.status li{width:100%;align-items:center;gap:8px;} .dashboard_list .status{display:flex;min-width:75px;min-height:27px;height: 27px;font-size: 14px;font-weight:500;padding:0 12px;border-radius:28px;justify-content:center;align-items:center;transition: all 0.3s;} .dashboard_list .line.gray{border:1px solid #c1c5ce;color:#616576;} .dashboard_list .line.blue{border:1px solid #2557B4;color:#2557B4;} .dashboard_list .line.orange{border:1px solid #F86A3C;color:#F86A3C;} .dashboard_list .fill.gray{background:#e4e7ee;color:#616576;} .dashboard_list .fill.green{background:#d9f0e9;color:#289c77;} .dashboard_list .fill.purple{background:#f3e8fc;color:#ad65eb;} .dashboard_list li:hover .line.gray{border:1px solid #c1c5ce;background:#F5F6F7;color:#616576;} .dashboard_list li:hover .line.blue{border:1px solid #2557B4;background:#F4F7FB;color:#2557B4;} .dashboard_list li:hover .line.orange{border:1px solid #F86A3C;background:#FEF0EC;color:#F86A3C;} .dashboard_list li:hover .fill.gray{background:#d2d6df;color:#494c59;} .dashboard_list li:hover .fill.green{background:#C1E8DC;color:#177C5C;} .dashboard_list li:hover .fill.purple{background:#EDD8FE;color:#9747DD;} /* //대시보드 리스트 */ /* 차트 */ .chart_box{text-align: center;} .chart_box img{box-sizing: border-box; width: 100%; height: 100%;}/* 나중에 차트 추가하고 지울 것 */ /* //차트 */ @media all and (max-width:1600px){ /* 공통 */ .dashboard .box{width: calc((100% - 30px)/2);} /* //공통 */ } @media all and (max-width:1300px){ /* 시스템관리 */ .system_box a{background-size: 35px;} .system_box .system01{background-size: 33px;} .system_box .system04{background-size: 30px;} /* //시스템관리 */ }