ul, li{margin: 0; padding: 0; list-style: none;} html, body, *{margin:0; padding:0; font-family:"맑은고딕", Malgun Gothic, "돋움", dotum, sans-serif;} body {background-color:#2d3742;} /* 상단 슬라이드 GNB */ /* GNB 메뉴바 내려옴 */ #gnb_effect {width:706px; height:104px; position:fixed; left:600px; top:-92px; z-index:99999; transition:0.5s;-webkit-transition:0.5s; -moz-transition:0.5s; background:url(../images/dashboard2/gnb.png)no-repeat;} #gnb_effect.down {top:0; transition:0.5s;-webkit-transition:0.5s; -moz-transition:0.5s;} #gnb_content{width:500px; margin:0 auto; } #gnb_button{float:none; position:relative; width:122px; height:15px; top:24px; margin:0 auto; tranform:rotate(90deg) 0.01s; text-indent:-99999px; background:url(../images/dashboard2/btn_gnb_open.png); cursor:pointer;} .down #gnb_button {width:122px; height:15px; top:9px; background:url(../images/dashboard2/btn_gnb_close.png); } /* GNB 서브메뉴*/ #gnb_container {width:500px; margin-top:18px;} #gnb_container > .gnb_menu > li > a {font-size:17px; color:#fff; font-weight:bold; text-decoration:none;} #gnb_container > .gnb_menu > li > ul > li > a {font-size:13px; color:#fff; font-weight:bold; text-decoration:none;} #gnb_container > ul.gnb_menu > li > ul.gnb_sub {position:relative; width:480px; height:25px; top:13px; border-radius:5px;background-color:#10649a; } #gnb_container > ul.gnb_menu > li:nth-child(1) > ul.gnb_sub {left:16px;} #gnb_container > ul.gnb_menu > li:nth-child(2) > ul.gnb_sub {left:-150px;} #gnb_container > ul.gnb_menu > li:nth-child(3) > ul.gnb_sub {left:-317px;} #gnb_container > ul.gnb_menu > li > ul.gnb_sub > li {display:block; float:left; width:80px; height:25px; line-height:2; text-align:center; } #gnb_container > ul.gnb_menu > li > ul.gnb_sub > li a {display:block; width:100%; height:100%; } .gnb_menu > li {display:block; float:left; width:33.33333%; height:50px; position:relative; } .gnb_menu > li > a {display:block; height:15px; line-height:1; text-align:center;} ul.gnb_menu li a:hover {background:url();} .gnb_menu > li:nth-child(2) > a {border-left:1px solid #86b5d8; border-right:1px solid #86b5d8;} ul.gnb_sub{display:none;} *+html ul.gnb_menu li {display:inline-block; zoom:1;} *+html ul.gnb_menu li {display:inline; zoom:1;} *html ul.gnb_sub {zoom:1; position:relative;} *+html ul.gnb_sub {zoom:1; position:relative;} ul.gnb_sub li {float:none;} ul.gnb_menu:after {height:0; visibility:hidden; content:"."; display:block; clear:both;} /* 페이지 본문 */ section {display:block; position: relative; margin-left:30px; width:1848px; clear:both;} header{position:relaitve; display: block; width: 1846px; height: 70px; margin-left:30px;} header .logo {display: block; float:left; position:relative; margin:24px 0 0 2px; width: 300px;} header .logo li{display: inline-block;} header .logo li:first-child {width: 47px; text-indent:-999999999px; background:url(../images/dashboard2/logo-eactive.png)no-repeat;} header .logo li:last-child {color:#fff; font-weight:bold; font-size: 22px; } header .time {display: block; float:left; position:relative; padding:3px 0px 3px 10px; left:1180px; margin-top:24px; font-size:18px; color:#fff; text-align:center;} header .quickLink {display: block; float:left; position:relative; height:24px; padding:3px 13px 3px 13px; margin-top:25px; right:-1080px; font-size:12px; background-color:#9199a2; border-radius:3px;} header .quickLink span {color:#000; margin-right:5px;} header .quickLink select {width:70px; padding-left:7px; border:1px solid #9199a2;} header .topMenu{display: block; float:left; position:relative; left:1196px; margin-top:25px;} header .topMenu li{position:relaitve; float:left; width:30px; height:30px; margin-left:7px; border-radius:3px; text-indent:-99999px;} .reLoad {float:left; width:30px; height:30px; background:url(../images/dashboard2/icon_reload.png)no-repeat 6px 6px; background-color:#626971; cursor: pointer;} header .topMenu li.soundOff {float:left; width:30px; height:30px; background:url(../images/dashboard2/icon_soundoff.png)no-repeat 6px 6px; background-color:#626971; cursor: pointer;} header .topMenu li.soundOn {float:left; width:30px; height:30px; background:url(../images/dashboard2/icon_soundon.png)no-repeat 6px 6px; background-color:#626971; cursor: pointer;} header .topMenu li.popOff {float:left; width:30px; height:30px; background:url(../images/dashboard2/icon_popoff.png)no-repeat 6px 4px; background-color:#626971; cursor: pointer;} header .topMenu li.popMin {float:left; width:30px; height:30px; background:url(../images/dashboard2/icon_popmin.png)no-repeat 6px 4px; background-color:#626971; cursor: pointer;} header .topMenu li.popMax {float:left; width:30px; height:30px; background:url(../images/dashboard2/icon_popmax.png)no-repeat 6px 4px; background-color:#626971; cursor: pointer;} .moniwrap{display:block; position:relative; float:left; width:1846px; margin:0 0 20px 30px;} .moniwrap > div{display:block; position:relative; float:left; width:600px; border:1px solid #53677c; background-color:#000;} div .moniNSG{padding-left:14px; border-right:none; border-bottom:none;} div .moniDSG{padding-left:14px; border-right:none; border-bottom:none;} div .moniGSG{padding-left:14px; border-bottom:none;} div .moniZSG{padding-left:14px; border-right:none;} div .moniISG{padding-left:14px; border-right:none;} div .moniASG{padding-left:14px;} .titMoni{display:block; width:272px; height:22px; margin:0 auto; margin-bottom:8px; font-size:14px; color:#000; text-align:center; background:url(../images/dashboard2/tit_monitor.png)no-repeat;} div .monitorOn {position:relative; display:block; float:left; width:290px; height:95px; margin:0 8px 8px 0; background-color:#0d5c8a; border-radius:10px;} div .monitorOn h2 {display:inline-block; float:left; width:23px; margin:9px 10px 9px 0; font-size:20px; text-align:right; font-weight:bold; line-height:1; color:#edf1f4;} div .monitorOn button {position:absolute; left:33px; display:inline-block; float:left; width:70px; height:18px; padding:0 10px 3px 10px; margin-top:12px; background-color:#0d5c8a; border:1px solid #a8c4d5; border-radius:10px; font-size:11px; color:#fff; cursor:pointer;} div .monitorOff {position:relative; display:block; float:left; width:290px; height:95px; margin:0 8px 8px 0; background-color:#36444e; border-radius:10px;} /* 추가 버튼 */ div .monitorOn button.butRed {position:absolute; left:33px; display:inline-block; float:left; width:70px; height:18px; padding:0 10px 3px 10px; margin-top:12px; background-color:#ff3c00; border:none; border-radius:10px; font-size:11px; color:#fff; cursor:pointer;} div .monitorOn button.butGreen {position:absolute; left:33px; display:inline-block; float:left; width:70px; height:18px; padding:0 10px 3px 10px; margin-top:12px; background-color:#0cac1e; border:none; border-radius:10px; font-size:11px; color:#fff; cursor:pointer;} div .monitorOn button.butYellow {position:absolute; left:33px; display:inline-block; float:left; width:70px; height:18px; padding:0 10px 3px 10px; margin-top:12px; background-color:#ead700; border:none; border-radius:10px; font-size:11px; color:#544d00; cursor:pointer;} /* //추가 버튼 */ div .monitorOff h2 {display:inline-block; float:left; width:23px; margin:9px 10px 9px 0; font-size:20px; text-align:right; font-weight:bold; line-height:1; color:#737c83;} div .monitorOff button {position:absolute; left:33px; display:inline-block; float:left; width:70px; height:18px; padding:0 10px 3px 10px; margin-top:12px; background-color:#36444e; border:1px solid #737c83; border-radius:10px; font-size:11px; color:#737c83; cursor:pointer;} div .monitorOn button span, div .monitorOn buttoff span,div .monitorOff button span, div .monitorOff buttoff span {position:relative; font-size:8px; margin-left:2px; top:-1px;} .monitorOn .cpuMonitor {display:inline-block; float:right; margin:10px 10px 4px 0; } .monitorOn .cpuMonitor li{display:inline-block; width:50px; height:23px; border-right:1px solid #5996c3; line-height:1;} .monitorOn .cpuMonitor li:last-child{border-right:none;} .monitorOn .cpuMonitor li p{float:left; padding-left:10px; font-size:10px; color:#dee5eb;} .monitorOn .cpuMonitor li span{float:left; display:block; padding-left:10px; font-size:13px;font-weight:bold; color:#fff;} .monitorOff .cpuMonitor {display:inline-block; float:right; margin:10px 10px 4px 0; } .monitorOff .cpuMonitor li{display:inline-block; width:50px; height:23px; border-right:1px solid #616c74; line-height:1;} .monitorOff .cpuMonitor li:last-child{border-right:none;} .monitorOff .cpuMonitor li p{float:left; padding-left:10px; font-size:10px; color:#616c74;} .monitorOff .cpuMonitor li span{float:left; display:block; padding-left:10px; font-size:13px;font-weight:bold; color:#616c74;} /* .monitorNumWrap{display:inline-block; float:left; width:107px; height:46px; margin:0 6px 0 6px; padding-top:5px; background:url(../images/dashboard2/back_num.png)no-repeat;} */ .monitorNumWrap{display:inline-block; float:left; width:107px; height:46px; margin:0 6px 0 6px; padding-top:5px;} .monitorNumWrap li:nth-child(1), .monitorNumWrap li:nth-child(6) {margin-left:7px;} .monitorNumBlue {display:inline-block; float:left; width:16px; height:16px; margin:0 3px 3px 0; border-radius:3px; font-size:11px; text-align:center; color:#fff; font-weight:bold; background-color:#00a2ff;} .monitorNumRed {display:inline-block; float:left; width:16px; height:16px; margin:0 3px 3px 0; border-radius:3px; font-size:11px; text-align:center; color:#fff; font-weight:bold; background-color:#f5304a;} .monitorNumGrey {display:inline-block; float:left; width:16px; height:16px; margin:0 3px 3px 0; border-radius:3px; font-size:11px; text-align:center; color:#fff; font-weight:bold; background-color:#a0aabf;} /*.monitorNumRed{display:inline-block; float:left; width:107px; height:46px; margin:0 6px 0 6px; padding-top:5px; background:url(/EMSWeb/WebContent/images/dashboard2/back_num.png)no-repeat;} .monitorNumRed li {display:inline-block; float:left; width:16px; height:16px; margin:0 3px 3px 0; border-radius:3px; font-size:11px; text-align:center; color:#fff; font-weight:bold; background-color:#f5304a;} .monitorNumRed li:nth-child(1), .monitorNumRed li:nth-child(6) {margin-left:7px;}*/ .monitorTotal {position:relative; display:inline-block; float:right; right:7px; width:154px; height:40px; padding:4px 10px 0 0; margin-top:1px; background:url(../images/dashboard2/back_total.png)no-repeat; font-size:25px; color:#fff; font-weight:bold; text-align:right;} .monitorNone {position:relative; display:inline-block; float:right; right:7px; width:154px; height:40px; padding:10px 10px 0 0; margin-top:1px; background:url(../images/dashboard2/back_total.png)no-repeat; font-size:19px; color:#737c83; font-weight:bold; text-align:right;} .monitorDown {position:relative; display:inline-block; float:right; right:7px; width:154px; height:40px; padding:10px 10px 0 0; margin-top:1px; background:url(../images/dashboard2/back_total.png)no-repeat; font-size:19px; color:red; font-weight:bold; text-align:right;} /* 거래처리 집계현황 */ .tradeTable {display:block; position:relative; float:left; width:1832px; margin:0 0 20px 30px; background-color:#000; border:1px solid #4e555f;word-break:break-all;} .titTable{display:block; width:272px; height:22px; margin:0 auto; margin-bottom:8px; font-size:14px; color:#fff; text-align:center; background:url(../images/dashboard2/tit_board.png)no-repeat;} .tradeTable {padding-left:14px; } .tradeTable .tradeGroup {float:left; width:905px; margin-bottom:5px; border-collapse:collapse; border-spacing:0;} .tradeTable .tradeGroup thead tr th:first-child {width:100px;} .tradeTable .tradeGroup thead tr th {height:25px; width:131px; font-size:14px; border-right:1px solid #000; background-color:#bac2ca;} .tradeTable .tradeGroup tbody tr {border:1px solid #bac2ca;} .tradeTable .tradeGroup thead tr th:last-child {border-right:1px solid #bac2ca;} .tradeTable .tradeGroup tbody tr th {height:25px; font-size:14px; color:#fff; border-right:1px solid #bac2ca; background-color:#014a7e;} .tradeTable .tradeGroup tbody tr td {padding-right:10px; font-size:14px; color:#fff; text-align:right; border:1px solid #bac2ca; background-color:#001128;} .tradeTable .allTrans {float:left; width:905px; height:25px; margin:0px 0 10px 0; border-collapse:collapse; border-spacing:0; font-size:14px; color:#fff; background-color:#474e58;} .tradeTable .allTrans tr th {width:100px; background-color:#014a7e;} .tradeTable .allTrans tr th, .tradeTable .allTrans tr td {height:25px; border:1px solid #bac2ca;} .tradeTable .allTrans tr td p, .tradeTable .allTrans tr td span{display:inline-block;} .tradeTable .allTrans tr td p {float:left; padding-left:10px;} .tradeTable .allTrans tr td span {float:right; padding-right:10px;} .tradeTable .tradeGroup tbody .total th, .tradeTable .tradeGroup tbody .total td {color:#ffd118;background-color:#01304d;} .tradeTable .tradeGroup tbody .total td {font-weight:bold; font-size:16px;} /* 거래처리 집계현황 Big */ .tradeTableBig {display:block; position:relative; float:left; width:1832px; margin:0 0 5px 30px; background-color:#000; border:1px solid #4e555f;} .titTableBig{display:block; width:505px; height:48px; margin:0 auto; margin-bottom:1px; font-size:24px; line-height:1.6; color:#fff; text-align:center; background:url(../images/dashboard2/tit_board_mid.png)no-repeat;} .tradeTableBig {padding-left:14px; } .tradeTableBig .tradeGroupBig {width:1820px; margin-bottom:5px; border-collapse:collapse; border-spacing:0;} .tradeTableBig .tradeGroupBig thead tr th:first-child {width:200px; height:43px; font-size:27px;} .tradeTableBig .tradeGroupBig thead tr th {width:267px; font-size:27px; border-right:1px solid #000; background-color:#bac2ca;} .tradeTableBig .tradeGroupBig tbody tr {border:1px solid #bac2ca;} .tradeTableBig .tradeGroupBig thead tr th:last-child {border-right:1px solid #bac2ca;} .tradeTableBig .tradeGroupBig tbody tr th {height:43px; font-size:27px; color:#fff; border-right:1px solid #bac2ca; background-color:#014a7e;} .tradeTableBig .tradeGroupBig tbody tr td {padding-right:10px; font-size:27px; color:#fff; text-align:right; border:1px solid #bac2ca; background-color:#001128;} .tradeTableBig .allTransBig {width:1820px; height:43px; margin:10px 0 10px 0; border-collapse:collapse; border-spacing:0; font-size:27px; color:#fff; background-color:#474e58;} .tradeTableBig .allTransBig tr th {width:200px; background-color:#014a7e;} .tradeTableBig .allTransBig tr th, .tradeTableBig .allTransBig tr td {height:43px; border:1px solid #bac2ca;} .tradeTableBig .allTransBig tr td p, .tradeTableBig .allTransBig tr td span{display:inline-block;} .tradeTableBig .allTransBig tr td p {float:left; padding-left:10px;} .tradeTableBig .allTransBig tr td span {float:right; padding-right:10px;} .tradeTableBig .tradeGroupBig tbody .total th, .tradeTableBig .tradeGroupBig tbody .total td {color:#ffd118;background-color:#01304d;} .tradeTableBig .tradeGroupBig tbody .total td {font-weight:bold;color:#ffd118;} /* 장애통보현황 */ .smsTable {display:block; position:relative; float:left; width:1220px; padding-left:14px; margin:0 0 10px 0; background-color:#000; border:1px solid #4e555f;} .smsTable .tradeGroup {float:left; width:1206px; margin-bottom:10px; border-collapse:collapse; border-spacing:0;} .smsTable .tradeGroup thead tr th:first-child {width:100px;} .smsTable .tradeGroup thead tr th {height:25px; font-size:14px; border-right:1px solid #000; background-color:#bac2ca;} .smsTable .tradeGroup tbody tr {border:1px solid #bac2ca;} .smsTable .tradeGroup thead tr th:last-child {border-right:1px solid #bac2ca;} .smsTable .tradeGroup tbody tr th {height:25px; font-size:14px; color:#fff; border-right:1px solid #bac2ca; background-color:#014a7e;} .smsTable .tradeGroup tbody tr td {font-size:14px; color:#fff; text-align:center; border:1px solid #bac2ca; background-color:#001128;} .smsTable .tradeGroup tbody tr td:last-child {text-align:left; padding-left:10px;} /* Peak Day */ .peakTable {display:block; position:relative; float:left; width:576px; padding-left:14px; margin:0 0 20px 20px; background-color:#000; border:1px solid #4e555f;} .peakTable .tradeGroup {float:left; width:562px; margin-bottom:10px; border-collapse:collapse; border-spacing:0;} .peakTable .tradeGroup thead tr th:first-child {width:100px;} .peakTable .tradeGroup thead tr th {height:25px; font-size:14px; border-right:1px solid #000; background-color:#bac2ca;} .peakTable .tradeGroup tbody tr {border:1px solid #bac2ca;} .peakTable .tradeGroup thead tr th:last-child {border-right:1px solid #bac2ca;} .peakTable .tradeGroup tbody tr th {height:25px; font-size:14px; color:#fff; border-right:1px solid #bac2ca; background-color:#014a7e;} .peakTable .tradeGroup tbody tr td {font-size:14px; color:#fff; border:1px solid #bac2ca; background-color:#001128;} .peakTable .allTrans {float:left; width:562px; height:25px; margin:0px 0 10px 0; border-collapse:collapse; border-spacing:0; font-size:14px; text-align:center; color:#fff; background-color:#474e58;} .peakTable .allTrans tr th:first-child {width:100px;} .peakTable .allTrans tr th, .peakTable .allTrans tr td {height:25px; border:1px solid #bac2ca;} /* 팝업 */ #pop {position:absolute; width:140px;color:#fff;border-radius:8px; top:0px; left:0px; text-align:center; background-color:#ee3300; box-shadow: 1px 3px 7px 3px rgba(0,0,0,0.4);} #pop ul {display:block; height:20px; font-size:13px; line-height:1.7; text-align:center;} #pop ul li {display:inline-block; line-height:2; font-weight:bold;} #pop ul #close {position:relative; float:right; margin-right:8px; top:5px; width:16px; height:16px; text-indent:-99999px; cursor:pointer; background:url(../images/dashboard2/close.png)no-repeat;} #pop ol {display:block; width:calc(100% - 10px); height:auto; margin:5px; padding:3px; font-size:12px; background:linear-gradient(to top, #1b1f2b, #3e4353); border:1px solid #202121; box-sizing:border-box; } #pop ol li {height:17px; text-align:left;}