/* CSS Document */
@charset utf-8;
@import url('webfont.css');
* { padding: 0; margin: 0; }
a:hover, a:active, a:visited { text-decoration: none !important; }
form, fieldset, legend, label, ul, li, dl, dt, dl { marig: 0; padding: 0; border: none !important; }
legend, label { position: absolute; text-indent: -9999px; }
body { background-color: #646473 !important; }
#dashboard { width: 1240px; margin: 0 auto; background: #F6F6F6; background: url(/images/spotadmin/bg-dashboard.png) repeat-y; }
/* Header */
header { width: 1238px; margin: 0 auto; height: 90px; background: url(/images/spotadmin/bg-header.png) repeat-x; }
.portal { background: url(/images/spotadmin/id-portal.png) no-repeat 98% 50%; text-indent: -99999px; height: 39px; }
.title h1 { float: right; display: inline-block; width: 250px; background: url(/images/spotadmin/title.png) no-repeat; text-indent: -99999px; height: 51px; margin: 0; padding: 0; margin-right: -1px; }
.title h2 { float: left; display: inline-block; font-family: NanumBarunGothic; font-weight: bold; font-size: 25px; color: #00a3bd; line-height: 55px; margin: 0; height: 51px; background: url(/images/spotadmin/icon-title-graph.png) no-repeat 30px 50%; padding-left: 65px; width: 989px; }
.title h2 span { float: right; display: inline-block; font-family: EurostileBold; font-size: 20px; color: #858596; line-height: 50px; margin: 0; padding: 5px 20px 0 0; }
/* Right Navigation */
nav { float: right; display: inline-block; width: 250px; }
.region { padding: 20px 20px 10px 20px; border-bottom: 1px solid #313140; }
.region ul { list-style: none; }
.region ul > li { list-style: none; margin-bottom: 10px; }
.region .btn { display: block; font-family: NanumBarunGothic; font-weight: bold; padding: 6px 12px; margin-bottom: 0; font-size: 18px; font-weight: normal; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; color: #FFF; background-color: #008CA1; }
.region .btn:hover { background-color: #00A5BF }
nav > ul { list-style: none; }
nav > ul > li { background: url(/images/spotadmin/bg-nav.png) no-repeat 0 -60px; height: 61px; }
nav > ul > li.active, nav > ul > li:hover { background: url(/images/spotadmin/bg-nav.png) no-repeat 0 0; }
nav > ul > li a { color: #FFF; padding-left: 42px; border-bottom: 1px solid #313140; font-family: NanumBarunGothic; font-weight: bold; font-size: 18px; height: 60px; display: block; line-height: 60px; -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; }
nav > ul > li a:hover, nav > ul > li.active a { color: #00a3bd; font-weight: bold; background: url(/images/spotadmin/nav-active.png) no-repeat 0 50%; -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; }
.select-container.w210 .selecter, .select-container.w210 .selecter .selecter-selected, .select-container.w210 .selecter .selecter-options { width: 210px; }
/* Chart */
section { float: left; display: inline-block; width: 990px; background: url(/images/spotadmin/bg-body-shadow.png) repeat-x; padding: 30px; }
section .col-3{margin-bottom:30px;height:120px;}
section .col-3 .stat{float:left;display: inline-block; width:290px;margin-right:30px;border-top:2px solid #B9B9C8;background:#FFF;}
.stat > .data{width:290px;height:90px;font-size:55px;font-family: EurostileBold; padding-left:20px;line-height:100px;color:#009eb6;}
.stat > .data span{font-family: NanumBarunGothic; font-weight: bold; font-size: 15px; color:#858596;}
.stat > .data i{font-size: 30px; font-style:normal;}
.stat > .title{background:#00a3bc;width:290px;height:30px;position:absolute;margin-top:90px;font-family: NanumBarunGothic; font-weight: bold; font-size: 15px; color:#FFF;line-height:30px;padding-left:20px;}
section .col-3 .stat:last-child{margin-right:0;}
.grade-container{float:left;display: inline-block; width:290px;}
.grade-container ul{list-style:none;}
.grade-container li{display:block; margin:10px 0;}
.grade-container li:first-child{margin-top:0;}
.grade-container li:last-child{margin-bottom:0;}
.grade{display:block;height:30px;background:#00a3bc;color:#FFF;width:290px;font-family: NanumBarunGothic; font-weight: bold; font-size: 15px;line-height:30px;}
.grade:hover{color:#FFF;}
.grade.self{height:60px;font-size: 20px;line-height:60px;}
.grade .num{display:inline-block;font-size:20px;font-family: EurostileBold; width:75px;text-align:center;vertical-align:middle;}
.grade.self .num{font-size:25px;}
.ellipsis{height:50px;width:290px; background:url(/images/spotadmin/ellipsis.png) no-repeat 50% 0;text-indent:-99999px;}
.ellipsis2{height:30px;width:290px; background:url(/images/spotadmin/ellipsis.png) no-repeat 50% 0;text-indent:-99999px;}
.graph-container{float:right;display: inline-block; width:610px;}
.graph:nth-child(1){margin-bottom:60px;}
.graph > .chart{border-top:2px solid #B9B9C8;background:#FFF;height:245px;} 
.graph > .title{background:#868695;width:610px;height:30px;position:absolute;margin-top:245px;font-family: NanumBarunGothic; font-weight: bold; font-size: 15px; color:#FFF;line-height:30px;text-align:center}
.graph #selcet{float:right;margin:5px;}
header:after, header .title:after, article:after, section .col-3:after,.graph-container:after,.grade-container ul:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; }
/* Footer */
footer { width: 1240px; margin: 0 auto; background: url(/images/spotadmin/bg-shadow.png) repeat-x; padding: 19px 0; text-align: right; color: #B8B8C7; font-family: Tahoma; font-size: 11px; }

/* Icon */
.icon-grade{background:url(/images/spotadmin/icon-grade.png) no-repeat 97% 10px;}
.icon-flash{background:url(/images/spotadmin/icon-flash.png) no-repeat 97% 10px;}
.icon-man{background:url(/images/spotadmin/icon-man.png) no-repeat 97% 10px;}
.icon-company{background:url(/images/spotadmin/icon-company.png) no-repeat 97% 10px;}
.icon-view{background:url(/images/spotadmin/icon-view.gif) no-repeat 97% 10px;}
/*grade color*/
.g1{color:#0059B2 !important;}
.g2{color:#006DD9 !important;}
.g3{color:#0080FF !important;}
.g4{color:#2693FF !important;}
.g5{color:#4697e8 !important;}
.g6{color:#e87400 !important;}
.g7{color:#FF4000 !important;}
.g8{color:#FF0000 !important;}
.g9{color:#D90000 !important;}
.g10{color:#B20000 !important;}
.gblue{color:#1990FF !important;}
.gred{color:#FF0000 !important;}
/*grade bg color*/
.bg1{background:#0059B2 !important;}
.bg2{background:#006DD9 !important;}
.bg3{background:#0080FF !important;}
.bg4{background:#2693FF !important;}
.bg5{background:#4DA6FF !important;}
.bg6{background:#FF8000 !important;}
.bg7{background:#FF4000 !important;}
.bg8{background:#FF0000 !important;}
.bg9{background:#D90000 !important;}
.bg10{background:#B20000 !important;}
.bgblue{background:#1990FF !important;}
.bgred{background:#FF0000 !important;}
