Rinjae
194 lines
18 KiB
CSS
194 lines
18 KiB
CSS
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;} |