@charset "UTF-8";
@font-face { font-family: 'epot'; font-style: normal; font-weight: 300; src: url("/font/NotoSansKR-Light.eot"); src: url("/font/NotoSansKR-Light.eot?#iefix") format("embedded-opentype"), url("/font/NotoSansKR-Light.woff2") format("woff2"), url("/font/NotoSansKR-Light.woff") format("woff"); }

@font-face { font-family: 'epot'; font-style: normal; font-weight: 400; src: url("/font/NotoSansKR-Regular.eot"); src: url("/font/NotoSansKR-Regular.eot?#iefix") format("embedded-opentype"), url("/font/NotoSansKR-Regular.woff2") format("woff2"), url("/font/NotoSansKR-Regular.woff") format("woff"); }

@font-face { font-family: 'epot'; font-style: normal; font-weight: 500; src: url("/font/NotoSansKR-Medium.eot"); src: url("/font/NotoSansKR-Medium.eot?#iefix") format("embedded-opentype"), url("/font/NotoSansKR-Medium.woff2") format("woff2"), url("/font/NotoSansKR-Medium.woff") format("woff"); }

@font-face { font-family: 'epot'; font-style: normal; font-weight: 700; src: url("/font/NotoSansKR-Bold.eot"); src: url("/font/NotoSansKR-Bold.eot?#iefix") format("embedded-opentype"), url("/font/NotoSansKR-Bold.woff2") format("woff2"), url("/font/NotoSansKR-Bold.woff") format("woff"); }

@font-face { font-family: 'epot'; font-style: normal; font-weight: 300; /* src: url('/font/Scandia-Light.eot'); src: url('/font/Scandia-Light.eot?#iefix') format('embedded-opentype'),  url('/font/Scandia-Light.woff2') format('woff2'), url('/font/Scandia-Light.woff') format('woff'); */ src: url("/font/Scandia.eot"); src: url("/font/Scandia.eot?#iefix") format("embedded-opentype"), url("/font/Scandia.woff2") format("woff2"), url("/font/Scandia.woff") format("woff"); }

@font-face { font-family: 'epot'; font-style: normal; font-weight: 400; src: url("/font/Scandia.eot"); src: url("/font/Scandia.eot?#iefix") format("embedded-opentype"), url("/font/Scandia.woff2") format("woff2"), url("/font/Scandia.woff") format("woff"); }

@font-face { font-family: 'epot'; font-style: normal; font-weight: 500; src: url("/font/Scandia-Medium.eot"); src: url("/font/Scandia-Medium.eot?#iefix") format("embedded-opentype"), url("/font/Scandia-Medium.woff2") format("woff2"), url("/font/Scandia-Medium.woff") format("woff"); }

@font-face { font-family: 'epot'; font-style: normal; font-weight: 700; src: url("/font/Scandia-Bold.eot"); src: url("/font/Scandia-Bold.eot?#iefix") format("embedded-opentype"), url("/font/Scandia-Bold.woff2") format("woff2"), url("/font/Scandia-Bold.woff") format("woff"); /* src: url('/font/Scandia-Bold.eot'); src: url('/font/Scandia-Bold.eot?#iefix') format('embedded-opentype'),  url('/font/Scandia-Bold.woff2') format('woff2'), url('/font/Scandia-Bold.woff') format('woff'); */ }

/* reset */
html, body, form, div, p, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, ol, li, fieldset, th, td, button { margin: 0; padding: 0; border: 0; font: inherit; }

html, body { height: 100%; font-size: 12px; }

body { -webkit-text-size-adjust: none; font-family: 'epot',Sans-serif; font-weight: 400; color: #323232; word-break: keep-all; }

svg { font-family: 'epot', '맑은고딕', 'Malgun Gothic', '돋움', Dotum, 'Apple Gothic', sans-serif !important; }

input, textarea, select, button { font: inherit; vertical-align: middle; padding: 0; margin: 0; color: #222; font-family: 'epot',Sans-serif; }

input[type="button"], input[type="text"], input[type="image"], input[type="submit"], input[type="password"], textarea { outline: none; -webkit-appearance: none; }

input[type="button"]:hover, input[type="submit"]:hover { cursor: pointer; }

button:focus, a:focus { outline: none; }

textarea { resize: none; }

table { width: 100%; border-collapse: collapse; border-spacing: 0; }

ul, ol, li { list-style-type: none; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; }

img, fieldset, iframe { border: none; }

address, cite, code, dfn, em, var, th, strong { font-style: normal; font-weight: 400; }

a, a:active, a:hover { text-decoration: none; color: inherit; font-weight: 400; }

a:hover { cursor: pointer !important; }

article, aside, dialog, figure, footer, header, hgroup, nav, section { display: block; }

caption, legend { height: 0; width: 0; line-height: 0; font-size: 0; overflow: hidden; visibility: hidden; display: none; -webkit-padding-start: 0; -webkit-padding-end: 0; }

button { background: transparent; cursor: pointer; }

iframe { border: 0; }

input::-ms-clear { display: none; }

::-webkit-input-placeholder { color: #999; opacity: 1; font-weight: 300; }

::-moz-placeholder { color: #999; opacity: 1; font-weight: 300; }

:-ms-input-placeholder { color: #999; opacity: 1; font-weight: 300; }

::-ms-input-placeholder { color: #999; opacity: 1; font-weight: 300; }

::placeholder { color: #999; opacity: 1; font-weight: 300; }

img { border: none; }

select { background: transparent; }

@-moz-document url-prefix() {
  select { text-indent: -2px; }
}

.ellipsis { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.blind { position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px; }

/* MARGIN, PADDING */
.pt10 { padding-top: 10px !important; }

.pt12 { padding-top: 12px !important; }

.pb0 { padding-bottom: 0 !important; }

.pb4 { padding-bottom: 4px !important; }

.mt70 { margin-top: 70px !important; }

.ml2 { margin-left: 2px !important; }

.ml5 { margin-left: 5px !important; }

.ml10 { margin-left: 10px !important; }

.ml26 { margin-left: 26px !important; }

.mt12 { margin-top: 12px !important; }

.mb2 { margin-bottom: 2px !important; }

.mb4 { margin-bottom: 4px !important; }

.mb8 { margin-bottom: 8px !important; }

.mb10 { margin-bottom: 10px !important; }

.mb12 { margin-bottom: 12px !important; }

.mb16 { margin-bottom: 16px !important; }

.mb17 { margin-bottom: 17px !important; }

.mb20 { margin-bottom: 20px !important; }

.mb21 { margin-bottom: 21px !important; }

.mb22 { margin-bottom: 22px !important; }

.mb24 { margin-bottom: 24px !important; }

.mb36 { margin-bottom: 36px !important; }

.mb57 { margin-bottom: 57px !important; }

.mb60 { margin-bottom: 60px !important; }

/* UI 가이드 */
.rb-guide { margin: 0 16px; }

.rb-guide .rb-section h1.rb-title { padding: 5px; margin: 15px 0 5px; background: #ffeded; margin-top: 15px; font-size: 20px; font-weight: bold; color: #ff1f5a; text-align: center; }

.rb-guide .rb-section h2.rb-title { padding: 5px; margin: 5px 0; margin-top: 15px; font-size: 14px; font-weight: bold; background: gray; }

.rb-guide .rb-section h3.rb-title { padding: 3px; font-size: 14px; font-weight: bold; background: yellow; text-align: center; }

.rb-guide .rb-section .rb-option { font-size: 12px; }

.rb-guide .rb-section .rb-option [type=radio] { display: inline-block; vertical-align: middle; }

.rb-guide .rb-section .rb-option label { display: inline-block; vertical-align: middle; padding: 5px; }

.rb-guide .rb-section .rb-display { margin: 20px 0; padding: 16px; background: #fff; border: 1px solid #000; }

.rb-guide .rb-section .rb-code { margin: 20px 0; padding: 16px; font-size: 12px; background: #000; color: yellow; }

.rb-guide .rb-section .rb-clipboard { position: absolute; left: -9999px; width: 1px; height: 1px; margin: 0; padding: 0; border: 0; }

/* 버튼 */
[class^=ui-btn-] { position: relative; box-sizing: border-box; display: inline-block; vertical-align: middle; height: 36px; line-height: 37px; font-size: 14px; }

[class^=ui-btn-] > span { white-space: nowrap; letter-spacing: -0.1px; }

[class^=ui-btn-] > span.f15 { font-size: 15px; letter-spacing: -0.11px; font-weight: 500; }

[class^=ui-btn-] > span.icon { margin: 0 3px 0 0; display: inline-block; vertical-align: middle; position: relative; }

[class^=ui-btn-] > span.icon.excel { top: -3px; }

[class^=ui-btn-] > span.icon.excel img { width: 14px; height: 18px; }

[class^=ui-btn-] > span.icon.top { top: -3px; }

[class^=ui-btn-] > span.icon.top img { width: 12px; height: 18px; }

[class^=ui-btn-] > span.icon.add { top: -3px; }

[class^=ui-btn-] > span.icon.add img { width: 10px; height: 10px; }

[class^=ui-btn-] > span.icon.add2 { top: -2px; }

[class^=ui-btn-] > span.icon.add2 img { width: 10px; height: 10px; }

[class^=ui-btn-] > span.icon.edit { top: -3px; margin: 0; }

[class^=ui-btn-] > span.icon.alarm { top: -1px; margin: 0; }

[class^=ui-btn-] > span.icon.download { top: -3px; margin: 0 3px 0 0; }

[class^=ui-btn-] > span.icon.unregistered { top: -3px; margin: 0 4px 0 0; }

[class^=ui-btn-] > span.icon.search { top: -3px; }

[class^=ui-btn-] > span.icon.search img { width: 10px; height: 10px; }

[class^=ui-btn-] > span.icon [class^=ui-svg] { vertical-align: middle; }

[class^=ui-btn-] > span.icon img { vertical-align: middle; }

[class^=ui-btn-][class*=fw300] { font-weight: 300; }

[class^=ui-btn-][class*=fw500] { font-weight: 500; }

[class^=ui-btn-][class*=fw700] { font-weight: 700; }

[class^=ui-btn-][class*=-xs] { font-size: 12px; height: 26px; line-height: 26px; }

[class^=ui-btn-][class*=-sm] { font-size: 14px; height: 32px; line-height: 32px; }

[class^=ui-btn-][class*=-lg] { font-size: 16px; height: 48px; line-height: 49px; }

[class^=ui-btn-][class*=-xl] { font-size: 18px; height: 60px; line-height: 60px; }

[class^=ui-btn-][class*=-wp0] { padding: 0 0; }

[class^=ui-btn-][class*=-wp10] { padding: 0 10px; }

[class^=ui-btn-][class*=-wp12] { padding: 0 12px; }

[class^=ui-btn-][class*=-wp20] { padding: 0 20px; }

[class^=ui-btn-][class*=-wp24] { padding: 0 24px; }

[class^=ui-btn-][class*=-wp100] { width: 100%; padding: 0; text-align: center; }

[class^=ui-btn-][class*=-line] { border: 1px solid rgba(0, 0, 0, 0.1); }

[class^=ui-btn-][class*=-complex] { border: 1px solid rgba(0, 0, 0, 0.1); }

[class^=ui-btn-][class*=-underline] { text-decoration: underline; }

[class^=ui-btn-][class*=-radius] { border-radius: 4px; }

[class^=ui-btn-][class*=-radius][class*=-xs] { border-radius: 2px; }

[class^=ui-btn-][class*=-radius][class*=-sm] { border-radius: 3px; }

[class^=ui-btn-][class*=-radius][class*=-lg] { border-radius: 5px; }

[class^=ui-btn-][class*=-gray][class*=-surface] { background: #b6bdc7; color: #fff; }

[class^=ui-btn-][class*=-gray][class*=-line] { border-color: #cbcbcb; }

[class^=ui-btn-][class*=-gray][class*=-underline] { color: #999; }

[class^=ui-btn-][class*=-lightgray][class*=-surface] { background: #f5f5f5; color: #fff; }

[class^=ui-btn-][class*=-lightgray][class*=-complex] { border-color: #cbcbcb; background-color: #f5f5f5; color: #999; }

[class^=ui-btn-][class*=-lightgray][class*=-underline] { color: #ddd; }

[class^=ui-btn-][class*=-pink][class*=-surface] { background: #ff1f5a; color: #fff; }

[class^=ui-btn-][class*=-pink][class*=-line] { border-color: #ff1f5a; color: #ff1f5a; }

[class^=ui-btn-][class*=-deepblue][class*=-surface] { background: #2233b6; color: #fff; }

[class^=ui-btn-][class*=-deepblue][class*=-line] { border-color: #2233b6; color: #2233b6; }

[class^=ui-btn-][class*=-deepblue][class*=-underline] { color: #2233b6; }

[class^=ui-btn-][class*=-disabled], [class^=ui-btn-]:disabled { opacity: .3; }

/* 버튼 시스템 */
[class^=ui-wrap] { text-align: center; }

[class^=ui-wrap][class*=-margin] .col { box-sizing: border-box; padding: 0 4px; }

[class^=ui-wrap][class*=-margin] .col:first-of-type { padding-left: 0; }

[class^=ui-wrap][class*=-margin] .col:last-of-type { padding-right: 0; }

[class^=ui-wrap][class*=-close] .col { text-align: center; }

[class^=ui-wrap][class*=-close] .col:first-of-type { text-align: right; }

[class^=ui-wrap][class*=-close] .col:last-of-type { text-align: left; }

[class^=ui-wrap][class*=-col] .col { float: left; }

[class^=ui-wrap][class*=-col]::after { content: ''; display: table; clear: both; }

[class^=ui-wrap][class*=-col2] .col { width: 50%; }

[class^=ui-wrap][class*=-col3] .col { width: 33.33%; }

[class^=ui-wrap][class*=-col3] .col:nth-last-of-type(3) { width: 33.34%; }

[class^=ui-wrap][class*=-col4] .col { width: 25%; }

/* 아이콘 */
[class^=ui-icon] { display: inline-block; background-size: 100% 100% !important; }

[class^=ui-icon][class*=-registered] { width: 12px; height: 12px; background: url(/webImages/icon-registered.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-unregistered] { width: 12px; height: 12px; background: url(/webImages/icon-unregistered.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-questionmark] { width: 12px; height: 12px; background: url(/webImages/icon-question-mark-s.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-denial] { width: 18px; height: 18px; background: url(/webImages/icon-nodata.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-denial2] { width: 24px; height: 24px; background: url(/webImages/icon-nodata-1.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-tit-alram] { width: 24px; height: 24px; background: url(/webImages/icon-alram.svg) no-repeat 0 0; -o-object-fit: contain; object-fit: contain; }

[class^=ui-icon][class*=-tit-building] { width: 24px; height: 24px; background: url(/webImages/icon-building.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-tit-member] { width: 24px; height: 24px; background: url(/webImages/icon-member.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-tit-paper] { width: 24px; height: 24px; background: url(/webImages/icon-paper.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-tit-system] { width: 24px; height: 24px; background: url(/webImages/icon-system.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-tit-upload] { width: 24px; height: 24px; background: url(/webImages/icon-upload.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-tit-upload-data] { width: 24px; height: 24px; background: url(/webImages/icon-upload-data.svg) no-repeat 0 0; }

[class^=ui-icon][class*=-tit-upload-energy] { width: 24px; height: 24px; background: url(/webImages/icon-upload-energy.svg) no-repeat 0 0; }

[class^=ui-icon][class*=big-infomation] { width: 80px; height: 80px; background: url(/webImages/big-information@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-infomation-check] { width: 80px; height: 80px; background: url(/webImages/big-information-check@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-member-check] { width: 80px; height: 80px; background: url(/webImages/big-member-check@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-finish] { width: 80px; height: 80px; background: url(/webImages/glyphs-icon-big-finish@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-finish2] { width: 80px; height: 80px; background: url(/webImages/glyphs-icon-big-finish@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-login-lock] { width: 80px; height: 80px; background: url(/webImages/big-login-lock@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-login-lock-check] { width: 80px; height: 80px; background: url(/webImages/big-login-lock-check@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-login-lock-serch] { width: 80px; height: 80px; background: url(/webImages/big-login-lock-serch@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-login-member] { width: 80px; height: 80px; background: url(/webImages/big-login-member@3x.png) no-repeat 0 0; }

[class^=ui-icon][class*=big-login-member-check] { width: 80px; height: 80px; background: url(/webImages/big-login-member-check@3x.png) no-repeat 0 0; }

/* 
SVG 아이콘

ex) ui-svg-size10x10-icon-btn-open
ui-svg : 공통
-size10x10 : 가로 세로
-icon-btn-open : 파일명
*/
[class^=ui-svg] { display: inline-block; background-size: 100% 100%; }

[class^=ui-svg][class*=-size2x2] { width: 2px; height: 2px; }

[class^=ui-svg][class*=-size4x4] { width: 4px; height: 4px; }

[class^=ui-svg][class*=-size5x5] { width: 5px; height: 5px; }

[class^=ui-svg][class*=-size5x9] { width: 5px; height: 9px; }

[class^=ui-svg][class*=-size7x11] { width: 7px; height: 11px; }

[class^=ui-svg][class*=-size8x8] { width: 8px; height: 8px; }

[class^=ui-svg][class*=-size8x13] { width: 8px; height: 13px; }

[class^=ui-svg][class*=-size8x14] { width: 8px; height: 14px; }

[class^=ui-svg][class*=-size8x15] { width: 8px; height: 15px; }

[class^=ui-svg][class*=-size9x9] { width: 9px; height: 9px; }

[class^=ui-svg][class*=-size9x15] { width: 9px; height: 15px; }

[class^=ui-svg][class*=-size10x6] { width: 10px; height: 6px; }

[class^=ui-svg][class*=-size10x10] { width: 10px; height: 10px; }

[class^=ui-svg][class*=-size10x13] { width: 10px; height: 13px; }

[class^=ui-svg][class*=-size12x12] { width: 12px; height: 12px; }

[class^=ui-svg][class*=-size12x16] { width: 12px; height: 16px; }

[class^=ui-svg][class*=-size13x8] { width: 13px; height: 8px; }

[class^=ui-svg][class*=-size13x11] { width: 13px; height: 11px; }

[class^=ui-svg][class*=-size13x13] { width: 13px; height: 13px; }

[class^=ui-svg][class*=-size14x8] { width: 14px; height: 8px; }

[class^=ui-svg][class*=-size14x14] { width: 14px; height: 14px; }

[class^=ui-svg][class*=-size14x17] { width: 14px; height: 17px; }

[class^=ui-svg][class*=-size14x18] { width: 14px; height: 18px; }

[class^=ui-svg][class*=-size16x16] { width: 16px; height: 16px; }

[class^=ui-svg][class*=-size16x17] { width: 16px; height: 17px; }

[class^=ui-svg][class*=-size16x18] { width: 16px; height: 18px; }

[class^=ui-svg][class*=-size18x18] { width: 18px; height: 18px; }

[class^=ui-svg][class*=-size20x20] { width: 20px; height: 20px; }

[class^=ui-svg][class*=-size22x22] { width: 22px; height: 22px; }

[class^=ui-svg][class*=-size24x24] { width: 24px; height: 24px; }

[class^=ui-svg][class*=-size30x30] { width: 30px; height: 30px; }

[class^=ui-svg][class*=-size36x36] { width: 36px; height: 36px; }

[class^=ui-svg][class*=-size40x40] { width: 40px; height: 40px; }

[class^=ui-svg][class*=-size40x24] { width: 40px; height: 24px; }

[class^=ui-svg][class*=-size52x55] { width: 52px; height: 55px; }

[class^=ui-svg][class*=-size80x80] { width: 80px; height: 80px; }

[class^=ui-svg][class*=-size300x300] { width: 300px; height: 300px; }

[class^=ui-svg][class*=-size310x305] { width: 310px; height: 305px; }

[class^=ui-svg][class*=-size510x450] { width: 510px; height: 450px; }

[class^=ui-svg][class$=-icon-logo] { background-image: url(/webImages/icon-logo.svg); }

[class^=ui-svg][class$=-icon-btn-open] { background-image: url(/webImages/icon-btn-open.svg); }

[class^=ui-svg][class$=-icon-btn-group-add] { background-image: url(/webImages/icon-btn-group-add.svg); }

[class^=ui-svg][class$=-lnb-check] { background-image: url(/webImages/lnb-check.svg); }

[class^=ui-svg][class$=-lnb-nol-2] { background-image: url(/webImages/lnb-nol-2.svg); }

[class^=ui-svg][class$=-lnb-nol-3] { background-image: url(/webImages/lnb-nol-3.svg); }

[class^=ui-svg][class$=-lnb-nol-4] { background-image: url(/webImages/lnb-nol-4.svg); }

[class^=ui-svg][class$=-lnb-sel-1] { background-image: url(/webImages/lnb-sel-1.svg); }

[class^=ui-svg][class$=-lnb-sel-2] { background-image: url(/webImages/lnb-sel-2.svg); }

[class^=ui-svg][class$=-lnb-sel-3] { background-image: url(/webImages/lnb-sel-3.svg); }

[class^=ui-svg][class$=-lnb-sel-4] { background-image: url(/webImages/lnb-sel-4.svg); }

[class^=ui-svg][class$=-list-num-1] { background-image: url(/webImages/list-num-1.svg); }

[class^=ui-svg][class$=-list-num-2] { background-image: url(/webImages/list-num-2.svg); }

[class^=ui-svg][class$=-list-num-3] { background-image: url(/webImages/list-num-3.svg); }

[class^=ui-svg][class$=-icon-btn-edit] { background-image: url(/webImages/icon-btn-edit.svg); }

[class^=ui-svg][class$=-icon-question-mark-s] { background-image: url(/webImages/icon-question-mark-s.svg); }

[class^=ui-svg][class$=-icon-membership] { background-image: url(/webImages/icon-membership.svg); }

[class^=ui-svg][class$=-icon-e] { background-image: url(/webImages/icon-e.svg); }

[class^=ui-svg][class$=-icon-member] { background-image: url(/webImages/icon-member.svg); }

[class^=ui-svg][class$=-icon-lock] { background-image: url(/webImages/icon-lock.svg); }

[class^=ui-svg][class$=-icon-paper] { background-image: url(/webImages/icon-paper.svg); }

[class^=ui-svg][class$=-icon-building] { background-image: url(/webImages/icon-building.svg); }

[class^=ui-svg][class$=-icon-building-02] { background-image: url(/webImages/icon-building-02.svg); }

[class^=ui-svg][class$=-icon-system] { background-image: url(/webImages/icon-system.svg); }

[class^=ui-svg][class$=-icon-alram] { background-image: url(/webImages/icon-alram.svg); }

[class^=ui-svg][class$=-icon-upload] { background-image: url(/webImages/icon-upload.svg); }

[class^=ui-svg][class$=-icon-upload-energy] { background-image: url(/webImages/icon-upload-energy.svg); }

[class^=ui-svg][class$=-icon-upload-data] { background-image: url(/webImages/icon-upload-data.svg); }

[class^=ui-svg][class$=-icon-lock-20-x-20] { background-image: url(/webImages/icon-lock-20-x-20.svg); }

[class^=ui-svg][class$=-icon-lock-check-20-x-20] { background-image: url(/webImages/icon-lock-check-20-x-20.svg); }

[class^=ui-svg][class$=-icon-lock-20-x-20-red] { background-image: url(/webImages/icon-lock-20-x-20-red.svg); }

[class^=ui-svg][class$=-icon-lock-20-x-20-blue] { background-image: url(/webImages/icon-lock-20-x-20-blue.svg); }

[class^=ui-svg][class$=-icon-lock-check-20-x-20-blue] { background-image: url(/webImages/icon-lock-check-20-x-20-blue.svg); }

[class^=ui-svg][class$=-icon-title-electricity] { background-image: url(/webImages/icon-title-electricity.svg); }

[class^=ui-svg][class$=-icon-title-usage] { background-image: url(/webImages/icon-title-usage.svg); }

[class^=ui-svg][class$=-icon-appraisal-usage] { background-image: url(/webImages/icon-appraisal-usage.svg); }

[class^=ui-svg][class$=-icon-time] { background-image: url(/webImages/icon-time.svg); }

[class^=ui-svg][class$=-icon-building] { background-image: url(/webImages/icon-building.svg); }

[class^=ui-svg][class$=-icon-ranking] { background-image: url(/webImages/icon-ranking.svg); }

[class^=ui-svg][class$=-icon-notice] { background-image: url(/webImages/icon-notice.svg); }

[class^=ui-svg][class$=-icon-nodata] { background-image: url(/webImages/icon-nodata.svg); }

[class^=ui-svg][class$=-icon-excel] { background-image: url(/webImages/icon-excel.svg); }

[class^=ui-svg][class$=-icon-setting] { background-image: url(/webImages/icon-setting.svg); }

[class^=ui-svg][class$=-icon-map] { background-image: url(/webImages/icon-map.svg); }

[class^=ui-svg][class$=-icon-rise] { background-image: url(/webImages/icon-rise.svg); }

[class^=ui-svg][class$=-icon-decline] { background-image: url(/webImages/icon-decline.svg); }

[class^=ui-svg][class$=-icon-same] { background-image: url(/webImages/icon-same.svg); }

[class^=ui-svg][class$=-icon-big-rise] { background-image: url(/webImages/icon-big-rise.svg); }

[class^=ui-svg][class$=-icon-big-decline] { background-image: url(/webImages/icon-big-decline.svg); }

[class^=ui-svg][class$=-icon-big-same] { background-image: url(/webImages/icon-big-same.svg); }

[class^=ui-svg][class$=-icon-notice-mark] { background-image: url(/webImages/icon-notice-mark.svg); }

[class^=ui-svg][class$=-icon-map-s] { background-image: url(/webImages/icon-map-s.svg); }

[class^=ui-svg][class$=-icon-nodata-1] { background-image: url(/webImages/icon-nodata-1.svg); }

[class^=ui-svg][class$=-icon-step-arrow] { background-image: url(/webImages/icon-step-arrow.svg); }

[class^=ui-svg][class$=-icon-map-pin] { background-image: url(/webImages/icon-map-pin.svg); }

[class^=ui-svg][class$=-icon-btn-top] { background-image: url(/webImages/icon-btn-top.svg); }

[class^=ui-svg][class$=-icon-point-mark-s] { background-image: url(/webImages/icon-point-mark-s.svg); }

[class^=ui-svg][class$=-icon-lnb-home] { background-image: url(/webImages/icon-lnb-home.svg); }

[class^=ui-svg][class$=-icon-point-mark-big] { background-image: url(/webImages/icon-point-mark-big.svg); }

[class^=ui-svg][class$=-icon-building-info-1] { background-image: url(/webImages/icon-building-info-1.svg); }

[class^=ui-svg][class$=-icon-building-info-2] { background-image: url(/webImages/icon-building-info-2.svg); }

[class^=ui-svg][class$=-icon-building-info-3] { background-image: url(/webImages/icon-building-info-3.svg); }

[class^=ui-svg][class$=-icon-building-info-4] { background-image: url(/webImages/icon-building-info-4.svg); }

[class^=ui-svg][class$=-icon-building-info-5] { background-image: url(/webImages/icon-building-info-5.svg); }

[class^=ui-svg][class$=-icon-building-info-6] { background-image: url(/webImages/icon-building-info-6.svg); }

[class^=ui-svg][class$=-icon-building-info-7] { background-image: url(/webImages/icon-building-info-7.svg); }

[class^=ui-svg][class$=-icon-building-info-8] { background-image: url(/webImages/icon-building-info-8.svg); }

[class^=ui-svg][class$=-icon-building-info-9] { background-image: url(/webImages/icon-building-info-9.svg); }

[class^=ui-svg][class$=-icon-btn-notice-s] { background-image: url(/webImages/icon-btn-notice-s.svg); }

[class^=ui-svg][class$=-btn-table-list-arrow-1] { background-image: url(/webImages/btn-table-list-arrow-1.svg); }

[class^=ui-svg][class$=-icon-necessary] { background-image: url(/webImages/icon-necessary.svg); }

[class^=ui-svg][class$=-icon-group-arrow] { background-image: url(/webImages/icon-group-arrow.svg); }

[class^=ui-svg][class$=-icon-lnb-arrow] { background-image: url(/webImages/icon-lnb-arrow.svg); }

[class^=ui-svg][class$=-icon-small-dot] { background-image: url(/webImages/icon-small-dot.svg); }

[class^=ui-svg][class$=-icon-layer-pop] { background-image: url(/webImages/icon-layer-pop.svg); }

[class^=ui-svg][class$=-btn-table-close] { background-image: url(/webImages/btn-table-close.svg); }

[class^=ui-svg][class$=-icon-download] { background-image: url(/webImages/icon-download.svg); }

[class^=ui-svg][class$=-icon-calendar] { background-image: url(/webImages/icon-calendar.svg); }

[class^=ui-svg][class$=-icon-data-search] { background-image: url(/webImages/icon-data-search.svg); }

[class^=ui-svg][class$=-icon-layer-pop-02] { background-image: url(/webImages/icon-layer-pop-02.svg); }

[class^=ui-svg][class$=-icon-member] { background-image: url(/webImages/icon-member.svg); }

[class^=ui-svg][class$=-btn-search] { background-image: url(/webImages/btn-search.svg); }

[class^=ui-svg][class$=-btn-dropdwoun-arrow] { background-image: url(/webImages/btn-dropdwoun-arrow.svg); }

[class^=ui-svg][class$=-btn-table-list-arrow] { background-image: url(/webImages/btn-table-list-arrow.svg); }

[class^=ui-svg][class$=-btn-dropdwoun-arrow-nor] { background-image: url(/webImages/btn-dropdwoun-arrow-nor.svg); }

[class^=ui-svg][class$=-btn-dropdwoun-arrow-sel] { background-image: url(/webImages/btn-dropdwoun-arrow-sel.svg); }

[class^=ui-svg][class$=-btn-dropdwoun-arrow-nor-dim] { background-image: url(/webImages/btn-dropdwoun-arrow-nor-dim.svg); }

[class^=ui-svg][class$=-btn-dropdwoun-arrow-sel-dim] { background-image: url(/webImages/btn-dropdwoun-arrow-sel-dim.svg); }

[class^=ui-svg][class$=-btn-table-list-map] { background-image: url(/webImages/btn-table-list-map.svg); }

[class^=ui-svg][class$=-btn-search-close] { background-image: url(/webImages/btn-search-close.svg); }

[class^=ui-svg][class$=-btn-title-arrow-big] { background-image: url(/webImages/btn-title-arrow-big.svg); }

[class^=ui-svg][class$=-btn-page-arrow-left] { background-image: url(/webImages/btn-page-arrow-left.svg); }

[class^=ui-svg][class$=-btn-page-arrow-right] { background-image: url(/webImages/btn-page-arrow-right.svg); }

[class^=ui-svg][class$=-btn-page-arrow-left] { background-image: url(/webImages/btn-page-arrow-left.svg); }

[class^=ui-svg][class$=-btn-page-arrow-right] { background-image: url(/webImages/btn-page-arrow-right.svg); }

[class^=ui-svg][class$=-btn-page-arrow-left-dim] { background-image: url(/webImages/btn-page-arrow-left-dim.svg); }

[class^=ui-svg][class$=-btn-page-arrow-right-dim] { background-image: url(/webImages/btn-page-arrow-right-dim.svg); }

[class^=ui-svg][class$=-btn-radio-nor] { background-image: url(/webImages/btn-radio-nor.svg); }

[class^=ui-svg][class$=-btn-radio-sel] { background-image: url(/webImages/btn-radio-sel.svg); }

[class^=ui-svg][class$=-btn-radio-nol-dim] { background-image: url(/webImages/btn-radio-nol-dim.svg); }

[class^=ui-svg][class$=-btn-radio-sel-dim] { background-image: url(/webImages/btn-radio-sel-dim.svg); }

[class^=ui-svg][class$=-check-box-off] { background-image: url(/webImages/check-box-off.svg); }

[class^=ui-svg][class$=-check-box-on] { background-image: url(/webImages/check-box-on.svg); }

[class^=ui-svg][class$=-check-box-off-dim] { background-image: url(/webImages/check-box-off-dim.svg); }

[class^=ui-svg][class$=-check-box-on-dim] { background-image: url(/webImages/check-box-on-dim.svg); }

[class^=ui-svg][class$=-check-box-off-big] { background-image: url(/webImages/check-box-off-big.svg); }

[class^=ui-svg][class$=-check-box-on-big] { background-image: url(/webImages/check-box-on-big.svg); }

[class^=ui-svg][class$=-check-box-off-big-dim] { background-image: url(/webImages/check-box-off-big-dim.svg); }

[class^=ui-svg][class$=-check-box-on-big-dim] { background-image: url(/webImages/check-box-on-big-dim.svg); }

[class^=ui-svg][class$=-icon-member-profile] { background-image: url(/webImages/icon-member-profile.svg); }

[class^=ui-svg][class$=-icon-logout-w] { background-image: url(/webImages/icon-logout-w.svg); }

[class^=ui-svg][class$=-btn-arrow-white] { background-image: url(/webImages/btn-arrow-white.svg); }

[class^=ui-svg][class$=-btn-close-w] { background-image: url(/webImages/btn-close-w.svg); }

[class^=ui-svg][class$=-btn-close-small] { background-image: url(/webImages/btn-close-small.svg); }

[class^=ui-svg][class$=-btn-title-arrow-open] { background-image: url(/webImages/btn-title-arrow-open.svg); }

[class^=ui-svg][class$=-btn-title-arrow-close] { background-image: url(/webImages/btn-title-arrow-close.svg); }

[class^=ui-svg][class$=-btn-title-arrow-open-dim] { background-image: url(/webImages/btn-title-arrow-open-dim.svg); }

[class^=ui-svg][class$=-icon-time-big] { background-image: url(/webImages/icon-time-big.svg); }

[class^=ui-svg][class$=-icon-temperature] { background-image: url(/webImages/icon-temperature.svg); }

[class^=ui-svg][class$=-btn-box-delete] { background-image: url(/webImages/btn-box-delete.svg); }

[class^=ui-svg][class$=-btn-toggle-off] { background-image: url(/webImages/btn-toggle-off.svg); }

[class^=ui-svg][class$=-btn-toggle-on] { background-image: url(/webImages/btn-toggle-on.svg); }

[class^=ui-svg][class$=-icon-registered] { background-image: url(/webImages/icon-registered.svg); }

[class^=ui-svg][class$=-icon-unregistered] { background-image: url(/webImages/icon-unregistered.svg); }

[class^=ui-svg][class$=-img-group-making] { background-image: url(/webImages/img-group-making.svg); }

[class^=ui-svg][class$=-big-404-error] { background-image: url(/webImages/big-404-error.svg); }

[class^=ui-svg][class$=-big-500-error] { background-image: url(/webImages/big-500-error.svg); }

[class^=ui-svg][class$=-big-service-check] { background-image: url(/webImages/big-service-check.svg); }

[class^=ui-svg][class$=-illust-main] { background-image: url(/webImages/illust-main.svg); }

[class^=ui-svg][class$=-big-member-check] { background-image: url(/webImages/big-member-check.svg); }

[class^=ui-svg][class$=-big-finish] { background-image: url(/webImages/big-finish.svg); }

[class^=ui-svg][class$=-big-information] { background-image: url(/webImages/big-information.svg); }

[class^=ui-svg][class$=-big-information-check] { background-image: url(/webImages/big-information-check.svg); }

[class^=ui-svg][class$=-big-add] { background-image: url(/webImages/big-add.svg); }

[class^=ui-svg][class$=-big-q] { background-image: url(/webImages/big-q.svg); }

[class^=ui-svg][class$=-big-agree] { background-image: url(/webImages/big-agree.svg); }

[class^=ui-svg][class$=-big-login-lock] { background-image: url(/webImages/big-login-lock.svg); }

[class^=ui-svg][class$=-big-login-member] { background-image: url(/webImages/big-login-member.svg); }

[class^=ui-svg][class$=-big-login-member-check] { background-image: url(/webImages/big-login-member-check.svg); }

[class^=ui-svg][class$=-big-login-lock-serch] { background-image: url(/webImages/big-login-lock-serch.svg); }

[class^=ui-svg][class$=-big-login-lock-check] { background-image: url(/webImages/big-login-lock-check.svg); }

[class^=ui-svg][class$=-img-group-main] { background-image: url(/webImages/img-group-main.svg); }

[class^=ui-svg][class$=-img-group-sub] { background-image: url(/webImages/img-group-sub.svg); }

[class^=ui-svg][class$=-icon-weather-01] { background-image: url(/webImages/icon-weather-01.svg); }

[class^=ui-svg][class$=-icon-weather-02] { background-image: url(/webImages/icon-weather-02.svg); }

[class^=ui-svg][class$=-icon-weather-03] { background-image: url(/webImages/icon-weather-03.svg); }

[class^=ui-svg][class$=-icon-weather-04] { background-image: url(/webImages/icon-weather-04.svg); }

[class^=ui-svg][class$=-icon-weather-05] { background-image: url(/webImages/icon-weather-05.svg); }

[class^=ui-svg][class$=-icon-weather-06] { background-image: url(/webImages/icon-weather-06.svg); }

[class^=ui-svg][class$=-icon-weather-01-black] { background-image: url(/webImages/icon-weather-01-black.svg); }

[class^=ui-svg][class$=-icon-weather-02-black] { background-image: url(/webImages/icon-weather-02-black.svg); }

[class^=ui-svg][class$=-icon-weather-03-black] { background-image: url(/webImages/icon-weather-03-black.svg); }

[class^=ui-svg][class$=-icon-weather-04-black] { background-image: url(/webImages/icon-weather-04-black.svg); }

[class^=ui-svg][class$=-icon-weather-05-black] { background-image: url(/webImages/icon-weather-05-black.svg); }

[class^=ui-svg][class$=-icon-weather-06-black] { background-image: url(/webImages/icon-weather-06-black.svg); }

[class^=ui-svg][class$=-icon-weather-big-01] { background-image: url(/webImages/icon-weather-big-01.svg); }

[class^=ui-svg][class$=-icon-weather-big-02] { background-image: url(/webImages/icon-weather-big-02.svg); }

[class^=ui-svg][class$=-icon-weather-big-03] { background-image: url(/webImages/icon-weather-big-03.svg); }

[class^=ui-svg][class$=-icon-weather-big-04] { background-image: url(/webImages/icon-weather-big-04.svg); }

[class^=ui-svg][class$=-icon-weather-big-05] { background-image: url(/webImages/icon-weather-big-05.svg); }

[class^=ui-svg][class$=-icon-weather-big-06] { background-image: url(/webImages/icon-weather-big-06.svg); }

[class^=ui-svg][class$=-icon-title-electricity-w] { background-image: url(/webImages/icon-title-electricity-w.svg); }

[class^=ui-svg][class$=-icon-analystics-w] { background-image: url(/webImages/icon-analystics-w.svg); }

[class^=ui-svg][class$=-icon-analystics] { background-image: url(/webImages/icon-analystics.svg); }

[class^=ui-svg][class$=-icon-forecast-w] { background-image: url(/webImages/icon-forecast-w.svg); }

[class^=ui-svg][class$=-icon-forecast-b] { background-image: url(/webImages/icon-forecast-b.svg); }

[class^=ui-svg][class$=-icon-rotation] { background-image: url(/webImages/icon-rotation.svg); }

[class^=ui-svg][class$=-pattern-white] { background-image: url(/webImages/pattern-white.svg); }

[class^=ui-svg][class$=-pattern-green] { background-image: url(/webImages/pattern-green.svg); }

[class^=ui-svg][class$=-pattern-deepkoamaru] { background-image: url(/webImages/pattern-deepkoamaru.svg); }

[class^=ui-svg][class$=-pattern-deepkoamaru-30] { background-image: url(/webImages/pattern-deepkoamaru-30.svg); }

[class^=ui-svg][class$=-chart-table-list-circle] { background-image: url(/webImages/chart-table-list-circle.svg); }

[class^=ui-svg][class$=-chart-year-circle] { background-image: url(/webImages/chart-year-circle.svg); }

[class^=ui-svg][class$=-chart-lastyear-circle] { background-image: url(/webImages/chart-lastyear-circle.svg); }

[class^=ui-svg][class$=-chart-black-circle] { background-image: url(/webImages/chart-black-circle.svg); }

[class^=ui-svg][class$=-chart-red-circle] { background-image: url(/webImages/chart-red-circle.svg); }

[class^=ui-svg][class$=-chart-blue-01-circle] { background-image: url(/webImages/chart-blue-01-circle.svg); }

[class^=ui-svg][class$=-chart-gray-circle] { background-image: url(/webImages/chart-gray-circle.svg); }

[class^=ui-svg][class$=-btn-menu-nor] { background-image: url(/webImages/btn-menu-nor.svg); }

[class^=ui-svg][class$=-btn-dasboard-nor] { background-image: url(/webImages/btn-dasboard-nor.svg); }

[class^=ui-svg][class$=-btn-dasboard-sel] { background-image: url(/webImages/btn-dasboard-sel.svg); }

[class^=ui-svg][class$=-btn-analysis-nor] { background-image: url(/webImages/btn-analysis-nor.svg); }

[class^=ui-svg][class$=-btn-analysis-sel] { background-image: url(/webImages/btn-analysis-sel.svg); }

[class^=ui-svg][class$=-btn-report-nor] { background-image: url(/webImages/btn-report-nor.svg); }

[class^=ui-svg][class$=-btn-report-sel] { background-image: url(/webImages/btn-report-sel.svg); }

[class^=ui-svg][class$=-btn-back] { background-image: url(/webImages/btn-back.svg); }

[class^=ui-svg][class$=-btn-close] { background-image: url(/webImages/btn-close.svg); }

[class^=ui-svg][class$=-btn-groupmanage-nor] { background-image: url(/webImages/btn-groupmanage-nor.svg); }

[class^=ui-svg][class$=-btn-groupmanage-sel] { background-image: url(/webImages/btn-groupmanage-sel.svg); }

[class^=ui-svg][class$=-btn-customermanage-nor] { background-image: url(/webImages/btn-customermanage-nor.svg); }

[class^=ui-svg][class$=-btn-customermanage-sel] { background-image: url(/webImages/btn-customermanage-sel.svg); }

[class^=ui-svg][class$=-btn-card-extension] { background-image: url(/webImages/btn-card-extension.svg); }

[class^=ui-svg][class$=-btn-card-reduce] { background-image: url(/webImages/btn-card-reduce.svg); }

[class^=ui-svg][class$=-btn-table-sorting-sel] { background-image: url(/webImages/btn-table-sorting-sel.svg); }

[class^=ui-svg][class$=-btn-table-sorting-ascending-sel] { background-image: url(/webImages/btn-table-sorting-ascending-sel.svg); }

[class^=ui-svg][class$=-btn-table-sorting-descending-sel] { background-image: url(/webImages/btn-table-sorting-descending-sel.svg); }

[class^=ui-svg][class$=-btn-table-sorting-nor] { background-image: url(/webImages/btn-table-sorting-nor.svg); }

[class^=ui-svg][class$=-btn-table-sorting-ascending-nor] { background-image: url(/webImages/btn-table-sorting-ascending-nor.svg); }

[class^=ui-svg][class$=-btn-table-sorting-descending-nor] { background-image: url(/webImages/btn-table-sorting-descending-nor.svg); }

[class^=ui-svg][class$=-icon-membership] { background-image: url(/webImages/icon-membership.svg); }

[class^=ui-svg][class$=-icon-message] { background-image: url(/webImages/icon-message.svg); }

/* 폼 */
.form-wrap .tit-wrap { margin: 0 0 8px 0; }

.form-wrap .tit-wrap .text01 { display: inline-block; vertical-align: middle; font-size: 12px; font-weight: 500; letter-spacing: -0.06px; color: #666; }

.form-wrap .tit-wrap .text02 { display: inline-block; vertical-align: middle; font-size: 12px; font-weight: 500; letter-spacing: -0.06px; color: #222; }

.form-wrap .tit-wrap .text03 { margin-bottom: 7px; display: inline-block; vertical-align: middle; font-size: 14px; font-weight: 700; color: #858585; }

.form-wrap .tit-wrap .text03 + .mandatory { margin-bottom: 6px; }

.form-wrap .tit-wrap .text04 { margin-bottom: 4px; display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 700; letter-spacing: -0.08px; color: #222; }

.form-wrap .tit-wrap .text04 + .mandatory { margin-bottom: 3px; }

.form-wrap .tit-wrap .mandatory { display: inline-block; vertical-align: middle; margin-left: 6px; width: 4px; height: 4px; background: #2233b6; border-radius: 4px; }

.form-wrap .error-wrap .text01 { margin-top: 4px; display: block; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #ff3e47; }

.form-wrap .table-search { position: relative; height: 40px; padding-right: 40px; border: 1px solid #c0c0c0; box-sizing: border-box; border-radius: 4px; overflow: visible; }

.form-wrap .table-search [type=text] { width: 100%; margin-top: 2px; height: 36px; background: transparent; border: 0; text-indent: 16px; font-size: 14px; letter-spacing: -1px; color: #222; }

.form-wrap .table-search .btn-del { position: absolute; right: 48px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); width: 13px; height: 13px; background: url(/webImages/btn-search-close.svg) no-repeat 0 0; background-size: 13px 13px; }

.form-wrap .table-search .btn-search { position: absolute; right: 0; top: 0; width: 38px; height: 38px; border: 0; background: #b6bdc7 url(/webImages/btn-search.svg) no-repeat center center; background-size: 20px 20px; border-radius: 4px 0 0 4px; }

.form-wrap .table-search.small { height: 36px; padding-right: 36px; border-color: #dadadb; }

.form-wrap .table-search.small [type=text] { margin-top: 0; height: 34px; }

.form-wrap .table-search.small .btn-del { right: 44px; }

.form-wrap .table-search.small .btn-search { width: 34px; height: 34px; }

.form-wrap .table-search.focusin { border-color: #2233b6; }

.form-wrap .table-search.focusin .btn-search { background-color: #2233b6; }

.form-wrap .input-wrap { position: relative; }

.form-wrap .input-wrap .layer { position: absolute; left: 0; top: 100%; display: none; margin: 4px 0 0 0; width: 100%; max-height: 300px; padding: 8px 6px; box-sizing: border-box; border: 1px solid #2233b6; border-radius: 4px; background: #fff; overflow-x: hidden; overflow-y: auto; z-index: 9999; }

.form-wrap .input-wrap .layer button, .form-wrap .input-wrap .layer a { display: block; width: 100%; height: 30px; line-height: 30px; text-indent: 6px; text-align: left; font-size: 12px; color: #222; }

.form-wrap .input-wrap .layer button:hover, .form-wrap .input-wrap .layer button:focus, .form-wrap .input-wrap .layer a:hover, .form-wrap .input-wrap .layer a:focus { color: #2233b6; background: #e9f5ff; font-weight: 700; }

.form-wrap .input-wrap .layer.up { top: auto; bottom: 100%; margin: 0 0 4px 0; }

.form-wrap .input-wrap .outline { box-sizing: border-box; border: 1px solid #dadadb; border-radius: 4px; }

.form-wrap .input-wrap .outline input { border: 0; background: transparent; text-indent: 16px; font-size: 14px; }

.form-wrap .input-wrap .outline input.w100 { width: 100%; }

.form-wrap .input-wrap .outline input.t-r { text-align: right; }

.form-wrap .input-wrap .outline input.t-c { text-align: center; }

.form-wrap .input-wrap .outline input.f12 { font-size: 12px; }

.form-wrap .input-wrap .outline input.f16 { font-size: 16px; }

.form-wrap .input-wrap .outline textarea { width: 100%; height: 284px; border: 0; font-size: 14px; }

.form-wrap .input-wrap .outline .icon.type01 { display: block; width: 20px; height: 20px; position: absolute; right: 12px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); background: url(/webImages/icon-lock-check-20-x-20.svg) no-repeat 0 0; background-size: 20px 20px; }

.form-wrap .input-wrap .outline .icon.type02 { display: block; width: 20px; height: 20px; position: absolute; right: 12px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); background: url(/webImages/icon-lock-20-x-20.svg) no-repeat 0 0; background-size: 20px 20px; }

.form-wrap .input-wrap .outline .icon.type03 { display: block; width: 24px; height: 24px; position: absolute; left: 20px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); background: url(/webImages/icon-member.svg) no-repeat 0 0; background-size: 24px 24px; }

.form-wrap .input-wrap .outline .icon.type04 { display: block; width: 24px; height: 24px; position: absolute; left: 20px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); background: url(/webImages/icon-lock.svg) no-repeat 0 0; background-size: 24px 24px; }

.form-wrap .input-wrap .outline .icon.type05 { display: block; width: 20px; height: 20px; position: absolute; right: 12px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); background: url(/webImages/icon-lock-20-x-20-red.svg) no-repeat 0 0; background-size: 20PX 20px; }

.form-wrap .input-wrap .outline .icon.type05 span { position: absolute; right: 100%; padding-right: 2px; top: 1px; font-size: 12px; letter-spacing: -0.86px; color: #ff3e47; }

.form-wrap .input-wrap .outline .icon.type06 { display: block; width: 20px; height: 20px; position: absolute; right: 12px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); background: url(/webImages/icon-lock-20-x-20-blue.svg) no-repeat 0 0; background-size: 20PX 20px; }

.form-wrap .input-wrap .outline .icon.type06 span { position: absolute; right: 100%; padding-right: 2px; top: 1px; font-size: 12px; letter-spacing: -0.86px; color: #2233b6; }

.form-wrap .input-wrap .outline .icon.type07 { display: block; width: 20px; height: 20px; position: absolute; right: 12px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); background: url(/webImages/icon-lock-check-20-x-20-blue.svg) no-repeat 0 0; background-size: 20PX 20px; }

.form-wrap .input-wrap .outline .icon.type07 span { position: absolute; right: 100%; padding-right: 2px; top: 1px; font-size: 12px; letter-spacing: -0.86px; color: #2233b6; }

.form-wrap .input-wrap .outline .text { position: absolute; right: 16px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); font-size: 14px; letter-spacing: -0.07px; color: #222; }

.form-wrap .input-wrap .outline .text sup { font-size: 8px; letter-spacing: -0.04px; color: #222; }

.form-wrap .input-wrap .outline .right { position: absolute; right: 0; top: 0; }

.form-wrap .input-wrap .outline.single { height: 36px; }

.form-wrap .input-wrap .outline.single input { height: 34px; line-height: 35px; }

.form-wrap .input-wrap .outline.double { height: 48px; }

.form-wrap .input-wrap .outline.double input { height: 46px; line-height: 47px; }

.form-wrap .input-wrap .outline.textarea { padding: 8px 16px; }

.form-wrap .input-wrap .outline.disabled { background: #f5f5f5; }

.form-wrap .input-wrap .outline.disabled input { color: #999; }

.form-wrap .input-wrap .outline.file { background: #f5f5f5; }

.form-wrap .input-wrap .outline.file input { color: #999; height: 34px; line-height: 35px; }

.form-wrap .input-wrap .outline.file .fake { color: #999; height: 34px; line-height: 35px; text-indent: 16px; font-size: 14px; font-weight: 300; }

.form-wrap .input-wrap .outline.file [type=file] { position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px; }

.form-wrap .input-wrap .outline.file .right { cursor: pointer; }

.form-wrap .input-wrap .outline.file-add { border: 0; background: transparent; }

.form-wrap .input-wrap .outline.file-add .unit { position: relative; border: 1px solid #dadadb; border-radius: 4px; margin: 0 0 8px 0; }

.form-wrap .input-wrap .outline.file-add .unit .btn-del { position: absolute; right: 16px; top: 14px; width: 9px; height: 9px; background: url(/webImages/btn-box-delete.svg) no-repeat 0 0; }

.form-wrap .input-wrap .outline.file-add .unit:nth-last-of-type(2) { margin-bottom: 0; }

.form-wrap .input-wrap .outline.l-44 { position: relative; padding-left: 44px; }

.form-wrap .input-wrap .outline.r-34 { position: relative; padding-right: 34px; }

.form-wrap .input-wrap .outline.r-38 { position: relative; padding-right: 38px; }

.form-wrap .input-wrap .outline.r-44 { position: relative; padding-right: 44px; }

.form-wrap .input-wrap .outline.r-70 { position: relative; padding-right: 70px; }

.form-wrap .input-wrap .outline.r-90 { position: relative; padding-right: 90px; }

.form-wrap .input-wrap .outline.mr-36 { margin-right: 36px; }

.form-wrap .input-wrap .outline.mr-36 .right [class^=ui-btn-] { width: 36px; text-align: center; padding: 0; }

.form-wrap .input-wrap .outline.mr-112 { margin-right: 112px; }

.form-wrap .input-wrap .outline.mr-112 .right [class^=ui-btn-] { width: 104px; text-align: center; padding: 0; }

.form-wrap .input-wrap .outline.mr-164 { margin-right: 164px; }

.form-wrap .input-wrap .outline.mr-164 .right [class^=ui-btn-] { width: 158px; text-align: center; padding: 0; }

.form-wrap .input-wrap .outline.bg-white { background: #fff; }

.form-wrap .input-wrap .outline.unique1 > div { float: left; box-sizing: border-box; }

.form-wrap .input-wrap .outline.unique1 > div:nth-of-type(1) { position: relative; width: 26%; padding-right: 6px; }

.form-wrap .input-wrap .outline.unique1 > div:nth-of-type(1)::before { content: ''; width: 6px; height: 1px; background: #999; position: absolute; right: 0; top: 17px; }

.form-wrap .input-wrap .outline.unique1 > div:nth-of-type(2) { position: relative; width: 24%; padding-right: 6px; }

.form-wrap .input-wrap .outline.unique1 > div:nth-of-type(2)::before { content: ''; width: 6px; height: 1px; background: #999; position: absolute; right: 0; top: 17px; }

.form-wrap .input-wrap .outline.unique1 > div:nth-of-type(3) { width: 50%; }

.form-wrap .input-wrap .outline.unique2 > div { float: left; box-sizing: border-box; }

.form-wrap .input-wrap .outline.unique2 > div:nth-of-type(1) { position: relative; width: 40%; padding-right: 6px; }

.form-wrap .input-wrap .outline.unique2 > div:nth-of-type(1)::before { content: ''; width: 6px; height: 1px; background: #999; position: absolute; right: 0; top: 17px; }

.form-wrap .input-wrap .outline.unique2 > div:nth-of-type(2) { width: 60%; }

.form-wrap .input-wrap.focusin .outline { border-color: #2233b6; }

.form-wrap .check-wrap { position: relative; }

.form-wrap .check-wrap [type=checkbox] { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }

.form-wrap .check-wrap .ico { display: inline-block; }

.form-wrap .check-wrap .medium { display: inline-block; vertical-align: middle; height: 18px; }

.form-wrap .check-wrap .medium .ico { margin: 0 6px 0 0; width: 16px; height: 16px; }

.form-wrap .check-wrap .medium [type=checkbox] + .ico { background: url(/webImages/check-box-off.svg) no-repeat 0 0; background-size: 16px 16px; }

.form-wrap .check-wrap .medium [type=checkbox]:checked + .ico { background-image: url(/webImages/check-box-on.svg); }

.form-wrap .check-wrap .medium [type=checkbox]:disabled + .ico { background-image: url(/webImages/check-box-off-dim.svg); }

.form-wrap .check-wrap .medium [type=checkbox]:disabled:checked + .ico { background-image: url(/webImages/check-box-on-dim.svg); }

.form-wrap .check-wrap .medium + label.base { position: relative; vertical-align: middle; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #222; }

.form-wrap .check-wrap .big { display: inline-block; vertical-align: middle; height: 20px; }

.form-wrap .check-wrap .big .ico { margin: 0 6px 0 0; width: 20px; height: 20px; }

.form-wrap .check-wrap .big [type=checkbox] + .ico { background: url(/webImages/check-box-off-big.svg) no-repeat 0 0; background-size: 20px 20px; }

.form-wrap .check-wrap .big [type=checkbox]:checked + .ico { background-image: url(/webImages/check-box-on-big.svg); }

.form-wrap .check-wrap .big [type=checkbox]:disabled + .ico { background-image: url(/webImages/check-box-off-big-dim.svg); }

.form-wrap .check-wrap .big [type=checkbox]:disabled:checked + .ico { background-image: url(/webImages/check-box-on-big-dim.svg); }

.form-wrap .check-wrap .big + label.base { position: relative; top: 1px; vertical-align: middle; font-size: 14px; line-height: 1.29; letter-spacing: -0.12px; color: #222; }

.form-wrap .check-wrap .slide { display: inline-block; vertical-align: middle; height: 24px; }

.form-wrap .check-wrap .slide .ico { margin: 0 6px 0 0; width: 40px; height: 24px; -webkit-transition-duration: 0.1s; transition-duration: 0.1s; }

.form-wrap .check-wrap .slide [type=checkbox] + .ico { background: url(/webImages/btn-toggle-off.svg) no-repeat 0 0; background-size: 40px 24px; }

.form-wrap .check-wrap .slide [type=checkbox]:checked + .ico { background-image: url(/webImages/btn-toggle-on.svg); }

.form-wrap .radio-wrap { position: relative; }

.form-wrap .radio-wrap [type=radio] { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }

.form-wrap .radio-wrap .ico { display: inline-block; }

.form-wrap .radio-wrap .medium { display: inline-block; vertical-align: middle; height: 18px; }

.form-wrap .radio-wrap .medium .ico { margin: 0 6px 0 0; width: 16px; height: 16px; }

.form-wrap .radio-wrap .medium [type=radio] + .ico { background: url(/webImages/btn-radio-nor.svg) no-repeat 0 0; background-size: 16px 16px; }

.form-wrap .radio-wrap .medium [type=radio]:checked + .ico { background-image: url(/webImages/btn-radio-sel.svg); }

.form-wrap .radio-wrap .medium [type=radio]:disabled + .ico { background-image: url(/webImages/btn-radio-nol-dim.svg); }

.form-wrap .radio-wrap .medium [type=radio]:disabled:checked + .ico { background-image: url(/webImages/btn-radio-sel-dim.svg); }

.form-wrap .radio-wrap .medium + label.base { position: relative; vertical-align: middle; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #222; }

.form-wrap .daterangepicker-wrap .outline { position: relative; width: 172px; height: 30px; box-sizing: border-box; border: 1px solid #cdcdcd; border-radius: 4px; }

.form-wrap .daterangepicker-wrap .outline input { width: 100%; height: 28px; line-height: 29px; border: 0; font-size: 12px; color: #222; padding: 0 12px 0 32px; border-radius: 4px; background: url(/webImages/icon-calendar.svg) no-repeat 12px 50% transparent; box-sizing: border-box; }

.form-wrap .daterangepicker-wrap .outline input[disabled] { background-color: #efefef; color: #999; }

/* 미니레이어 팝업 */
.question-wrap { position: relative; margin: 0 0 0 4px; }

.question-wrap [class^=ui-svg] { display: inline-block; position: relative; top: 1px; cursor: pointer; }

.question-wrap .layer-mini { display: none; position: absolute; width: 258px; left: -129px; /* width의 1/2값 */ margin-left: 6px; top: 100%; margin-top: 10px; box-sizing: border-box; padding: 18px 14px 18px 14px; border-radius: 4px; box-shadow: 0 4px 4px 0 rgba(0, 115, 255, 0.16); border: solid 1px #2233b6; background-color: #ffffff; z-index: 9999; }

.question-wrap .layer-mini .block01 { margin: 0 0 12px 0; display: block; font-size: 12px; color: #222; font-weight: 400; }

.question-wrap .layer-mini .block01:last-of-type { margin: 0; }

.question-wrap .layer-mini.w190 { width: 190px; left: -95px; }

.question-wrap .layer-mini.t-l { text-align: left; }

.question-wrap .layer-mini::before { content: ''; position: absolute; top: -8px; left: 50%; margin-left: -7px; display: block; width: 14px; height: 8px; background: url(/webImages/icon-layer-pop.svg) no-repeat 0 0; background-size: 14px 8px; }

/* 테이블 */
[class^=ui-table] .w56 { width: 56px; }

[class^=ui-table] .w65 { width: 65px; }

[class^=ui-table] .w66 { width: 66px; }

[class^=ui-table] .w78 { width: 78px; }

[class^=ui-table] .w80 { width: 80px; }

[class^=ui-table] .w85 { width: 85px; }

[class^=ui-table] .w94 { width: 94px; }

[class^=ui-table] .w97 { width: 97px; }

[class^=ui-table] .w110 { width: 110px; }

[class^=ui-table] .w113 { width: 113px; }

[class^=ui-table] .w116 { width: 116px; }

[class^=ui-table] .w120 { width: 120px; }

[class^=ui-table] .w137 { width: 137px; }

[class^=ui-table] .w150 { width: 150px; }

[class^=ui-table] .w153 { width: 153px; }

[class^=ui-table] .w160 { width: 160px; }

[class^=ui-table] .w177 { width: 177px; }

[class^=ui-table] .w180 { width: 180px; }

[class^=ui-table] .w181 { width: 181px; }

[class^=ui-table] .w184 { width: 184px; }

[class^=ui-table] .w188 { width: 188px; }

[class^=ui-table] .w195 { width: 195px; }

[class^=ui-table] .w204 { width: 204px; }

[class^=ui-table] .w208 { width: 208px; }

[class^=ui-table] .w217 { width: 217px; }

[class^=ui-table] .w225 { width: 225px; }

[class^=ui-table] .w240 { width: 240px; }

[class^=ui-table] .w245 { width: 245px; }

[class^=ui-table] .w250 { width: 250px; }

[class^=ui-table] .w258 { width: 258px; }

[class^=ui-table] .w268 { width: 268px; }

[class^=ui-table] .w270 { width: 270px; }

[class^=ui-table] .w280 { width: 280px; }

[class^=ui-table] .w285 { width: 285px; }

[class^=ui-table] .w289 { width: 289px; }

[class^=ui-table] .w292 { width: 292px; }

[class^=ui-table] .w294 { width: 294px; }

[class^=ui-table] .w300 { width: 300px; }

[class^=ui-table] .w355 { width: 355px; }

[class^=ui-table] .w370 { width: 370px; }

[class^=ui-table] .w436 { width: 436px; }

[class^=ui-table] .pl10 { padding-left: 10px; }

[class^=ui-table] .pl15 { padding-left: 15px; }

[class^=ui-table] .pl17 { padding-left: 17px; }

[class^=ui-table] .pl25 { padding-left: 25px; }

[class^=ui-table] .pl60 { padding-left: 60px; }

[class^=ui-table] .pl29 { padding-left: 29px; }

[class^=ui-table] .pl80 { padding-left: 80px; }

[class^=ui-table] .pl100 { padding-left: 100px; }

[class^=ui-table] .pl20 { padding-left: 20px; }

[class^=ui-table] .pl160 { padding-left: 160px; }

[class^=ui-table] .pl274 { padding-left: 274px; }

[class^=ui-table] .pr20 { padding-right: 20px; }

[class^=ui-table] .pr40 { padding-right: 40px; }

[class^=ui-table] .btn-sort { height: 20px; font-size: 14px; line-height: 20px; color: #858585; font-weight: 700; }

[class^=ui-table] .btn-sort::after { content: ''; margin: 0 0 0 4px; position: relative; top: -1px; vertical-align: middle; display: inline-block; width: 20px; height: 20px; background: url(/webImages/btn-table-sorting-nor.svg) no-repeat right 0; background-size: 20px 20px; }

[class^=ui-table] .btn-sort.ascending { position: relative; top: 1px; font-size: 16px; color: #2233b6; }

[class^=ui-table] .btn-sort.ascending::after { top: -2px; background-image: url(/webImages/btn-table-sorting-ascending-nor.svg); }

[class^=ui-table] .btn-sort.descending { position: relative; top: 1px; font-size: 16px; color: #2233b6; }

[class^=ui-table] .btn-sort.descending::after { top: -2px; background-image: url(/webImages/btn-table-sorting-descending-nor.svg); }

[class^=ui-table].fixed { table-layout: fixed; }

[class^=ui-table][class*=-type01] th { text-align: left; padding-top: 16px; padding-bottom: 16px; border-top: 1px solid #555; border-bottom: 1px solid #555; font-weight: 700; }

[class^=ui-table][class*=-type01] th > span { font-weight: 700; }

[class^=ui-table][class*=-type01] td { text-align: left; padding-top: 18px; padding-bottom: 15px; border-bottom: 1px solid #efefef; }

[class^=ui-table][class*=-type01] tr.read .text02 { color: #999; }

[class^=ui-table][class*=-type01] a:hover, [class^=ui-table][class*=-type01] a:focus { text-decoration: underline; }

[class^=ui-table][class*=-type01] .p0 { padding: 0; }

[class^=ui-table][class*=-type01] .t-c { text-align: center; }

[class^=ui-table][class*=-type01] .text01 { font-size: 14px; font-weight: 700; color: #858585; }

[class^=ui-table][class*=-type01] .text01 sub { position: relative; font-size: 10px; top: -2px; }

[class^=ui-table][class*=-type01] .text02 { font-size: 14px; font-weight: 300; color: #222; letter-spacing: -1px; }

[class^=ui-table][class*=-type01] .text03 { font-size: 14px; color: #222; }

[class^=ui-table][class*=-type01] .text04 { font-size: 16px; font-weight: 500; letter-spacing: -0.11px; color: #555; }

[class^=ui-table][class*=-type01] .text05 { font-size: 12px; letter-spacing: -0.09px; color: #555; }

[class^=ui-table][class*=-type01] .text05 sub { position: relative; font-size: 10px; top: -2px; }

[class^=ui-table][class*=-type01] .text06 { font-size: 14px; letter-spacing: -0.1px; color: #999; }

[class^=ui-table][class*=-type01] .text07 { font-size: 16px; font-weight: 500; letter-spacing: -0.11px; color: #2c9dff; }

[class^=ui-table][class*=-type01] .text08 { font-size: 12px; letter-spacing: -0.09px; color: #2c9dff; }

[class^=ui-table][class*=-type01] .text09 { font-size: 16px; font-weight: 500; letter-spacing: -0.11px; color: #fa4443; }

[class^=ui-table][class*=-type01] .text10 { font-size: 12px; letter-spacing: -0.09px; color: #fa4443; }

[class^=ui-table][class*=-type01] .text11 { font-size: 16px; letter-spacing: -0.11px; color: #555; font-weight: 500; }

[class^=ui-table][class*=-type01] .text12 { font-size: 14px; font-weight: 500; color: #858585; letter-spacing: -0.11px; }

[class^=ui-table][class*=-type01] .text12 sub { position: relative; font-size: 10px; top: -2px; }

[class^=ui-table][class*=-type01] .text13 { font-size: 14px; font-weight: 400; color: #858585; }

[class^=ui-table][class*=-type01] .icon { position: relative; }

[class^=ui-table][class*=-type01] .icon [class^=ui-svg] { vertical-align: top; }

[class^=ui-table][class*=-type01] .icon [class=ui-svg-size14x14-icon-download] { vertical-align: middle; }

[class^=ui-table][class*=-type01] .icon [class=ui-svg-size12x12-icon-unregistered] { vertical-align: middle; }

[class^=ui-table][class*=-type01] .state-wrap [class^=ui-svg] { display: inilne-block; position: relative; top: 1px; margin: 0 4px 0 0; cursor: pointer; }

[class^=ui-table][class*=-type01] .nodata { padding: 60px 0; }

[class^=ui-table][class*=-type01] .nodata .icon01 { margin: 0 0 4px 0; }

[class^=ui-table][class*=-type01] .nodata .icon01 [class^=ui-svg] { vertical-align: top; }

[class^=ui-table][class*=-type01] .nodata .text01 { font-size: 14px; letter-spacing: -0.07px; font-weight: 400; color: #999; }

[class^=ui-table][class*=-type01] .box-empty { padding: 42px 0 45px; }

[class^=ui-table][class*=-type01] .box-empty .text01 { font-weight: 400; color: #999990; }

[class^=ui-table][class*=-type01] .fix-t1 { position: relative; top: 1px; }

[class^=ui-table][class*=-type02] .unique1 input { text-indent: 0; }

[class^=ui-table][class*=-type02] thead tr th { text-align: left; border-top: 1px solid #555; padding-top: 16px; }

[class^=ui-table][class*=-type02] thead tr th span { font-size: 14px; font-weight: 700; color: #858585; }

[class^=ui-table][class*=-type02] thead tr th .necessary { padding-right: 10px; background: url(/webImages/icon-necessary.svg) no-repeat right 6px; }

[class^=ui-table][class*=-type02] tbody tr td { padding-top: 15px; padding-bottom: 15px; border-bottom: 1px solid #efefef; vertical-align: top; }

[class^=ui-table][class*=-type02] tbody tr td .full-wrap { position: relative; }

[class^=ui-table][class*=-type02] tbody tr td .full-wrap .right { position: absolute; right: 20px; top: 11px; }

[class^=ui-table][class*=-type02] tbody tr td .full-wrap .right [class^=ui-svg] { vertical-align: top; }

/* 검색결과 없을때 */
.box-empty { text-align: center; }

.box-empty .icon01 { margin: 0 0 6px 0; }

.box-empty .icon01 img { vertical-align: top; width: 24px; height: 24px; }

.box-empty .text01 { font-size: 14px; letter-spacing: -0.07px; color: #999990; }

/* 컨텐츠 공통 박스 */
.container { padding-top: 200px; }

.content { position: relative; margin: 0 36px 80px 96px; }

.content > .content-box,
.layer-inner-contents > .content-box { width: 100%; margin-top: -73px; border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); min-height: 700px; background: #fff; padding: 25px 24px 0 24px; box-sizing: border-box; }
.layer-inner-contents > .content-box { margin-top: 0; }

.content > .content-box::after,
.layer-inner-contents > .content-box::after { content: ''; display: table; clear: both; }

/* 좌측 네비게이션 확장 */
.nav-panel { position: fixed; left: -325px; top: 51px; width: 320px; height: calc(100% - 51px); margin-bottom: -51px; background: #fff; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); z-index: 400; -webkit-transition: left 0.5s; transition: left 0.5s; }

.nav-panel .user { position: relative; padding: 32px 20px 25px 64px; background: #33353c; }

.nav-panel .user .profile-icon { position: absolute; top: 25px; left: 20px; }

.nav-panel .user .user-name a { font-size: 14px; font-weight: 500; display: inline-block; padding-right: 15px; background: url(/webImages/btn-arrow-white.svg) no-repeat right center; color: #fff; }

.nav-panel .user .user-type { margin: 0 0 8px 0; font-size: 12px; letter-spacing: -0.1px; color: #fff; opacity: .5; }

.nav-panel .user .user-account { font-size: 14px; font-weight: 500; color: #fff; }

.nav-panel .user .user-mail { font-size: 14px; font-weight: 500; color: #fff; }

.nav-panel .user .dash { margin: 12px 0; width: 100%; height: 1px; background: #d3d9f0; opacity: .1; }

.nav-panel .user .expiration-date { margin: 0 0 2px 0; }

.nav-panel .user .expiration-date .tit { opacity: .6; font-size: 12px; letter-spacing: -0.1px; color: #fff; }

.nav-panel .user .expiration-date .date { margin: 0 0 0 6px; font-size: 12px; letter-spacing: -0.1px; color: #fff; }

.nav-panel .user .question { opacity: .6; font-size: 12px; letter-spacing: -0.1px; color: #fff; font-weight: 300; }

.nav-panel .user .logout { margin: 16px 0 0 0; }

.nav-panel .user .logout a, .nav-panel .user .logout button { display: inline-block; padding: 0 0 0 16px; font-size: 12px; letter-spacing: -0.1px; color: #d6d6d8; background: url(/webImages/icon-logout-w.svg) no-repeat 0 center; }

.nav-panel .user .nav-close { position: absolute; top: 24px; right: 20px; }

.nav-panel .menu > ul { margin: 12px 0 0 0; }

.nav-panel .menu > ul > li { margin: 15px 0 20px 0; padding: 0 22px 0 11px; }

.nav-panel .menu > ul > li > a { position: relative; display: block; box-sizing: border-box; }

.nav-panel .menu > ul > li > a .name { position: relative; top: 8px; margin: 0 0 0 8px; font-size: 14px; font-weight: 500; letter-spacing: -0.1px; color: #222; }

.nav-panel .menu > ul > li > a.expend::after { content: ''; position: absolute; right: 0; top: 16px; width: 13px; height: 8px; background-image: url(/webImages/btn-title-arrow-open.svg); }

.nav-panel .menu > ul > li > a::before { content: ''; display: inline-block; width: 40px; height: 40px; border-radius: 4px; vertical-align: top; background-repeat: no-repeat; background-position: center center; }

.nav-panel .menu > ul > li > ul { display: none; padding: 0 0 0 40px; }

.nav-panel .menu > ul > li > ul > li a { display: block; height: 36px; }

.nav-panel .menu > ul > li > ul > li a [class^=ui-svg] { vertical-align: middle; margin: 0 8px 0 0; }

.nav-panel .menu > ul > li > ul > li a .name { font-size: 14px; letter-spacing: -0.1px; line-height: 36px; color: #222; vertical-align: middle; }

.nav-panel .menu > ul > li > ul > li a:hover .name { font-weight: 500; color: #2628b9; }

.nav-panel .menu > ul > li > ul > li.current .name { font-weight: 500; color: #2628b9; }

.nav-panel .menu > ul > li.current > a .name { color: #2628b9; }

.nav-panel .menu > ul > li.current > a::before { background-color: #2628b9; }

.nav-panel .menu > ul > li.current > a.expend::after { background-image: url(/webImages/btn-title-arrow-close.svg); }

.nav-panel .menu > ul > li.current > ul { display: block; }

.nav-panel .menu > ul > li.dasboard > a::before { background-image: url(/webImages/btn-dasboard-nor.svg); }

.nav-panel .menu > ul > li.dasboard.current > a::before { background-image: url(/webImages/btn-dasboard-sel.svg); }

.nav-panel .menu > ul > li.analysis > a::before { background-image: url(/webImages/btn-analysis-nor.svg); }

.nav-panel .menu > ul > li.analysis.current > a::before { background-image: url(/webImages/btn-analysis-sel.svg); }

.nav-panel .menu > ul > li.report > a::before { background-image: url(/webImages/btn-report-nor.svg); }

.nav-panel .menu > ul > li.report.current > a::before { background-image: url(/webImages/btn-report-sel.svg); }

.nav-panel .menu > ul > li.groupmanage > a::before { background-image: url(/webImages/btn-groupmanage-nor.svg); }

.nav-panel .menu > ul > li.groupmanage.current > a::before { background-image: url(/webImages/btn-groupmanage-sel.svg); }

.nav-panel .menu > ul > li.customermanage > a::before { background-image: url(/webImages/btn-customermanage-nor.svg); }

.nav-panel .menu > ul > li.customermanage.current > a::before { background-image: url(/webImages/btn-customermanage-sel.svg); }

.nav-panel.open { left: 0; }

/* foot */
.foot { background: #dee1eb; padding: 24px 0 24px 96px; }

.foot .link li { display: inline-block; }

.foot .link li a { position: relative; font-size: 14px; letter-spacing: -0.12px; color: #222; padding-left: 18px; }

.foot .link li a::before { content: ''; display: block; width: 2px; height: 2px; background: #222; position: absolute; left: 8px; top: 7px; }

.foot .link li a strong { font-weight: 700; }

.foot .link li:first-of-type a { padding-left: 0; }

.foot .link li:first-of-type a::before { display: none; }

.foot .info { margin: 9px 0 0 0; }

.foot .info li { position: relative; display: inline-block; font-size: 14px; letter-spacing: -0.12px; color: #666; padding-left: 17px; }

.foot .info li::before { content: ''; display: block; width: 0; height: 8px; border-left: 1px solid #bcbcbc; position: absolute; left: 6px; top: 7px; }

.foot .info li:first-of-type { padding-left: 0; }

.foot .info li:first-of-type::before { display: none; }

.foot .info li a { font-size: 12px; letter-spacing: -0.09px; color: #666; text-decoration: underline; }

.foot .copyright { margin: 2px 0 0 0; font-size: 14px; letter-spacing: -0.12px; color: #666; }

/* 페이징 */
.page-nate { text-align: center; }

.page-nate li { display: inline-block; margin: 0 1px 0 0; }

.page-nate li .number { display: inline-block; line-height: 22px; height: 22px; padding: 0 4px; font-size: 14px; font-weight: 500; letter-spacing: -0.1px; box-sizing: border-box; min-width: 22px; color: #555; text-align: center; }

.page-nate li.previous { margin: 0 24px 0 0; }

.page-nate li.previous a { font-size: 14px; font-weight: 500; letter-spacing: -0.1px; color: #555; }

.page-nate li.previous a [class^=ui-svg] { position: relative; top: 1px; margin: 0 3px 0 0; }

.page-nate li.previous a.dim { color: #ccc; }

.page-nate li.next { margin: 0 0 0 23px; }

.page-nate li.next a { font-size: 14px; font-weight: 500; letter-spacing: -0.1px; color: #555; }

.page-nate li.next a [class^=ui-svg] { position: relative; top: 1px; margin: 0 0 0 4px; }

.page-nate li.next a.dim { color: #ccc; }

.page-nate li.current .number { background: #2628b9; border-radius: 4px; color: #fff; }

/* 로더 : 전체화면 */
.loader-wrap-full { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 9999; }

.loader-wrap-full .loader { position: absolute; width: 75px; height: 100px; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.loader-wrap-full .loader__bar { position: absolute; bottom: 0; width: 10px; height: 50%; background: #fff; -webkit-transform-origin: center bottom; transform-origin: center bottom; box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); }

.loader-wrap-full .loader__bar:nth-child(1) { left: 0px; -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); -webkit-animation: barUp1 4s infinite; animation: barUp1 4s infinite; }

.loader-wrap-full .loader__bar:nth-child(2) { left: 15px; -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); -webkit-animation: barUp2 4s infinite; animation: barUp2 4s infinite; }

.loader-wrap-full .loader__bar:nth-child(3) { left: 30px; -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); -webkit-animation: barUp3 4s infinite; animation: barUp3 4s infinite; }

.loader-wrap-full .loader__bar:nth-child(4) { left: 45px; -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); -webkit-animation: barUp4 4s infinite; animation: barUp4 4s infinite; }

.loader-wrap-full .loader__bar:nth-child(5) { left: 60px; -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-animation: barUp5 4s infinite; animation: barUp5 4s infinite; }

.loader-wrap-full .loader__ball { position: absolute; bottom: 10px; left: 0; width: 10px; height: 10px; background: #fff; border-radius: 50%; -webkit-animation: ball 4s infinite; animation: ball 4s infinite; }

@-webkit-keyframes ball { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 5% { -webkit-transform: translate(8px, -14px); transform: translate(8px, -14px); } 10% { -webkit-transform: translate(15px, -10px); transform: translate(15px, -10px); } 17% { -webkit-transform: translate(23px, -24px); transform: translate(23px, -24px); } 20% { -webkit-transform: translate(30px, -20px); transform: translate(30px, -20px); } 27% { -webkit-transform: translate(38px, -34px); transform: translate(38px, -34px); } 30% { -webkit-transform: translate(45px, -30px); transform: translate(45px, -30px); } 37% { -webkit-transform: translate(53px, -44px); transform: translate(53px, -44px); } 40% { -webkit-transform: translate(60px, -40px); transform: translate(60px, -40px); } 50% { -webkit-transform: translate(60px, 0); transform: translate(60px, 0); } 57% { -webkit-transform: translate(53px, -14px); transform: translate(53px, -14px); } 60% { -webkit-transform: translate(45px, -10px); transform: translate(45px, -10px); } 67% { -webkit-transform: translate(37px, -24px); transform: translate(37px, -24px); } 70% { -webkit-transform: translate(30px, -20px); transform: translate(30px, -20px); } 77% { -webkit-transform: translate(22px, -34px); transform: translate(22px, -34px); } 80% { -webkit-transform: translate(15px, -30px); transform: translate(15px, -30px); } 87% { -webkit-transform: translate(7px, -44px); transform: translate(7px, -44px); } 90% { -webkit-transform: translate(0, -40px); transform: translate(0, -40px); } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } }

@keyframes ball { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 5% { -webkit-transform: translate(8px, -14px); transform: translate(8px, -14px); } 10% { -webkit-transform: translate(15px, -10px); transform: translate(15px, -10px); } 17% { -webkit-transform: translate(23px, -24px); transform: translate(23px, -24px); } 20% { -webkit-transform: translate(30px, -20px); transform: translate(30px, -20px); } 27% { -webkit-transform: translate(38px, -34px); transform: translate(38px, -34px); } 30% { -webkit-transform: translate(45px, -30px); transform: translate(45px, -30px); } 37% { -webkit-transform: translate(53px, -44px); transform: translate(53px, -44px); } 40% { -webkit-transform: translate(60px, -40px); transform: translate(60px, -40px); } 50% { -webkit-transform: translate(60px, 0); transform: translate(60px, 0); } 57% { -webkit-transform: translate(53px, -14px); transform: translate(53px, -14px); } 60% { -webkit-transform: translate(45px, -10px); transform: translate(45px, -10px); } 67% { -webkit-transform: translate(37px, -24px); transform: translate(37px, -24px); } 70% { -webkit-transform: translate(30px, -20px); transform: translate(30px, -20px); } 77% { -webkit-transform: translate(22px, -34px); transform: translate(22px, -34px); } 80% { -webkit-transform: translate(15px, -30px); transform: translate(15px, -30px); } 87% { -webkit-transform: translate(7px, -44px); transform: translate(7px, -44px); } 90% { -webkit-transform: translate(0, -40px); transform: translate(0, -40px); } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } }

@-webkit-keyframes barUp1 { 0% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 40% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 50% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 90% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 100% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } }

@keyframes barUp1 { 0% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 40% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 50% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 90% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 100% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } }

@-webkit-keyframes barUp2 { 0% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 40% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 50% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 90% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 100% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } }

@keyframes barUp2 { 0% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 40% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 50% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 90% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 100% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } }

@-webkit-keyframes barUp3 { 0% { -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); } 100% { -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); } }

@keyframes barUp3 { 0% { -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); } 100% { -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); } }

@-webkit-keyframes barUp4 { 0% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 40% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 50% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 90% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 100% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } }

@keyframes barUp4 { 0% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 40% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 50% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 90% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 100% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } }

@-webkit-keyframes barUp5 { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 40% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 50% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 90% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 100% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } }

@keyframes barUp5 { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 40% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 50% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 90% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 100% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } }

.loader-wrap-full::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: .5; }

/* 로더 : 팝업 */
.loader-wrap-popup { padding: 100px 0; text-align: center; }

.loader-wrap-popup .loader { position: relative; display: inline-block; width: 75px; height: 100px; }

.loader-wrap-popup .loader__bar { position: absolute; bottom: 0; width: 10px; height: 50%; background: #2628B9; -webkit-transform-origin: center bottom; transform-origin: center bottom; box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); }

.loader-wrap-popup .loader__bar:nth-child(1) { left: 0px; -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); -webkit-animation: barUp1 4s infinite; animation: barUp1 4s infinite; }

.loader-wrap-popup .loader__bar:nth-child(2) { left: 15px; -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); -webkit-animation: barUp2 4s infinite; animation: barUp2 4s infinite; }

.loader-wrap-popup .loader__bar:nth-child(3) { left: 30px; -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); -webkit-animation: barUp3 4s infinite; animation: barUp3 4s infinite; }

.loader-wrap-popup .loader__bar:nth-child(4) { left: 45px; -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); -webkit-animation: barUp4 4s infinite; animation: barUp4 4s infinite; }

.loader-wrap-popup .loader__bar:nth-child(5) { left: 60px; -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-animation: barUp5 4s infinite; animation: barUp5 4s infinite; }

.loader-wrap-popup .loader__ball { position: absolute; bottom: 10px; left: 0; width: 10px; height: 10px; background: #2628B9; border-radius: 50%; -webkit-animation: ball 4s infinite; animation: ball 4s infinite; }

@keyframes ball { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 5% { -webkit-transform: translate(8px, -14px); transform: translate(8px, -14px); } 10% { -webkit-transform: translate(15px, -10px); transform: translate(15px, -10px); } 17% { -webkit-transform: translate(23px, -24px); transform: translate(23px, -24px); } 20% { -webkit-transform: translate(30px, -20px); transform: translate(30px, -20px); } 27% { -webkit-transform: translate(38px, -34px); transform: translate(38px, -34px); } 30% { -webkit-transform: translate(45px, -30px); transform: translate(45px, -30px); } 37% { -webkit-transform: translate(53px, -44px); transform: translate(53px, -44px); } 40% { -webkit-transform: translate(60px, -40px); transform: translate(60px, -40px); } 50% { -webkit-transform: translate(60px, 0); transform: translate(60px, 0); } 57% { -webkit-transform: translate(53px, -14px); transform: translate(53px, -14px); } 60% { -webkit-transform: translate(45px, -10px); transform: translate(45px, -10px); } 67% { -webkit-transform: translate(37px, -24px); transform: translate(37px, -24px); } 70% { -webkit-transform: translate(30px, -20px); transform: translate(30px, -20px); } 77% { -webkit-transform: translate(22px, -34px); transform: translate(22px, -34px); } 80% { -webkit-transform: translate(15px, -30px); transform: translate(15px, -30px); } 87% { -webkit-transform: translate(7px, -44px); transform: translate(7px, -44px); } 90% { -webkit-transform: translate(0, -40px); transform: translate(0, -40px); } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } }

@keyframes barUp1 { 0% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 40% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 50% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 90% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 100% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } }

@keyframes barUp2 { 0% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 40% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 50% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 90% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 100% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } }

@keyframes barUp3 { 0% { -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); } 100% { -webkit-transform: scale(1, 0.6); transform: scale(1, 0.6); } }

@keyframes barUp4 { 0% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 40% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } 50% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 90% { -webkit-transform: scale(1, 0.4); transform: scale(1, 0.4); } 100% { -webkit-transform: scale(1, 0.8); transform: scale(1, 0.8); } }

@keyframes barUp5 { 0% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 40% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } 50% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 90% { -webkit-transform: scale(1, 0.2); transform: scale(1, 0.2); } 100% { -webkit-transform: scale(1, 1); transform: scale(1, 1); } }

/*! jQuery UI - v1.12.1 - 2016-09-14 http://jqueryui.com Includes: core.css, accordion.css, autocomplete.css, menu.css, button.css, controlgroup.css, checkboxradio.css, datepicker.css, dialog.css, draggable.css, resizable.css, progressbar.css, selectable.css, selectmenu.css, slider.css, sortable.css, spinner.css, tabs.css, tooltip.css, theme.css To view and modify this theme, visit http://jqueryui.com/themeroller/?bgShadowXPos=&bgOverlayXPos=&bgErrorXPos=&bgHighlightXPos=&bgContentXPos=&bgHeaderXPos=&bgActiveXPos=&bgHoverXPos=&bgDefaultXPos=&bgShadowYPos=&bgOverlayYPos=&bgErrorYPos=&bgHighlightYPos=&bgContentYPos=&bgHeaderYPos=&bgActiveYPos=&bgHoverYPos=&bgDefaultYPos=&bgShadowRepeat=&bgOverlayRepeat=&bgErrorRepeat=&bgHighlightRepeat=&bgContentRepeat=&bgHeaderRepeat=&bgActiveRepeat=&bgHoverRepeat=&bgDefaultRepeat=&iconsHover=url(%22images%2Fui-icons_555555_256x240.png%22)&iconsHighlight=url(%22images%2Fui-icons_777620_256x240.png%22)&iconsHeader=url(%22images%2Fui-icons_444444_256x240.png%22)&iconsError=url(%22images%2Fui-icons_cc0000_256x240.png%22)&iconsDefault=url(%22images%2Fui-icons_777777_256x240.png%22)&iconsContent=url(%22images%2Fui-icons_444444_256x240.png%22)&iconsActive=url(%22images%2Fui-icons_ffffff_256x240.png%22)&bgImgUrlShadow=&bgImgUrlOverlay=&bgImgUrlHover=&bgImgUrlHighlight=&bgImgUrlHeader=&bgImgUrlError=&bgImgUrlDefault=&bgImgUrlContent=&bgImgUrlActive=&opacityFilterShadow=Alpha(Opacity%3D30)&opacityFilterOverlay=Alpha(Opacity%3D30)&opacityShadowPerc=30&opacityOverlayPerc=30&iconColorHover=%23555555&iconColorHighlight=%23777620&iconColorHeader=%23444444&iconColorError=%23cc0000&iconColorDefault=%23777777&iconColorContent=%23444444&iconColorActive=%23ffffff&bgImgOpacityShadow=0&bgImgOpacityOverlay=0&bgImgOpacityError=95&bgImgOpacityHighlight=55&bgImgOpacityContent=75&bgImgOpacityHeader=75&bgImgOpacityActive=65&bgImgOpacityHover=75&bgImgOpacityDefault=75&bgTextureShadow=flat&bgTextureOverlay=flat&bgTextureError=flat&bgTextureHighlight=flat&bgTextureContent=flat&bgTextureHeader=flat&bgTextureActive=flat&bgTextureHover=flat&bgTextureDefault=flat&cornerRadius=3px&fwDefault=normal&ffDefault=Arial%2CHelvetica%2Csans-serif&fsDefault=1em&cornerRadiusShadow=8px&thicknessShadow=5px&offsetLeftShadow=0px&offsetTopShadow=0px&opacityShadow=.3&bgColorShadow=%23666666&opacityOverlay=.3&bgColorOverlay=%23aaaaaa&fcError=%235f3f3f&borderColorError=%23f1a899&bgColorError=%23fddfdf&fcHighlight=%23777620&borderColorHighlight=%23dad55e&bgColorHighlight=%23fffa90&fcContent=%23333333&borderColorContent=%23dddddd&bgColorContent=%23ffffff&fcHeader=%23333333&borderColorHeader=%23dddddd&bgColorHeader=%23e9e9e9&fcActive=%23ffffff&borderColorActive=%23003eff&bgColorActive=%23007fff&fcHover=%232b2b2b&borderColorHover=%23cccccc&bgColorHover=%23ededed&fcDefault=%23454545&borderColorDefault=%23c5c5c5&bgColorDefault=%23f6f6f6 Copyright jQuery Foundation and other contributors; Licensed MIT */
/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }

.ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }

.ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; border-collapse: collapse; }

.ui-helper-clearfix:after { clear: both; }

.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter: Alpha(Opacity=0); /* support: IE8 */ }

.ui-front { z-index: 100; }

/* Interaction Cues
----------------------------------*/
.ui-state-disabled { cursor: default !important; pointer-events: none; }

/* Icons
----------------------------------*/
.ui-icon { display: inline-block; vertical-align: middle; margin-top: -.25em; position: relative; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }

.ui-widget-icon-block { left: 50%; margin-left: -8px; display: block; }

/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; }

.ui-accordion .ui-accordion-header { display: block; cursor: pointer; position: relative; margin: 2px 0 0 0; padding: .5em .5em .5em .7em; font-size: 100%; }

.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto; }

.ui-autocomplete { position: absolute; top: 0; left: 0; cursor: default; }

.ui-menu { list-style: none; padding: 0; margin: 0; display: block; outline: 0; }

.ui-menu .ui-menu { position: absolute; }

.ui-menu .ui-menu-item { margin: 0; cursor: pointer; /* support: IE10, see #8844 */ list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"); }

.ui-menu .ui-menu-item-wrapper { position: relative; padding: 3px 1em 3px .4em; }

.ui-menu .ui-menu-divider { margin: 5px 0; height: 0; font-size: 0; line-height: 0; border-width: 1px 0 0 0; }

.ui-menu .ui-state-focus, .ui-menu .ui-state-active { margin: -1px; }

/* icon support */
.ui-menu-icons { position: relative; }

.ui-menu-icons .ui-menu-item-wrapper { padding-left: 2em; }

/* left-aligned */
.ui-menu .ui-icon { position: absolute; top: 0; bottom: 0; left: .2em; margin: auto 0; }

/* right-aligned */
.ui-menu .ui-menu-icon { left: auto; right: 0; }

.ui-button { padding: .4em 1em; display: inline-block; position: relative; line-height: normal; margin-right: .1em; cursor: pointer; vertical-align: middle; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* Support: IE <= 11 */ overflow: visible; }

.ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active { text-decoration: none; }

/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only { width: 2em; box-sizing: border-box; text-indent: -9999px; white-space: nowrap; }

/* no icon support for input elements */
input.ui-button.ui-button-icon-only { text-indent: 0; }

/* button icon element(s) */
.ui-button-icon-only .ui-icon { position: absolute; top: 50%; left: 50%; margin-top: -8px; margin-left: -8px; }

.ui-button.ui-icon-notext .ui-icon { padding: 0; width: 2.1em; height: 2.1em; text-indent: -9999px; white-space: nowrap; }

input.ui-button.ui-icon-notext .ui-icon { width: auto; height: auto; text-indent: 0; white-space: normal; padding: .4em 1em; }

/* workarounds */
/* Support: Firefox 5 - 40 */
input.ui-button::-moz-focus-inner, button.ui-button::-moz-focus-inner { border: 0; padding: 0; }

.ui-controlgroup { vertical-align: middle; display: inline-block; }

.ui-controlgroup > .ui-controlgroup-item { float: left; margin-left: 0; margin-right: 0; }

.ui-controlgroup > .ui-controlgroup-item:focus, .ui-controlgroup > .ui-controlgroup-item.ui-visual-focus { z-index: 9999; }

.ui-controlgroup-vertical > .ui-controlgroup-item { display: block; float: none; width: 100%; margin-top: 0; margin-bottom: 0; text-align: left; }

.ui-controlgroup-vertical .ui-controlgroup-item { box-sizing: border-box; }

.ui-controlgroup .ui-controlgroup-label { padding: .4em 1em; }

.ui-controlgroup .ui-controlgroup-label span { font-size: 80%; }

.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item { border-left: none; }

.ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item { border-top: none; }

.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content { border-right: none; }

.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content { border-bottom: none; }

/* Spinner specific style fixes */
.ui-controlgroup-vertical .ui-spinner-input { /* Support: IE8 only, Android < 4.4 only */ width: 75%; width: calc( 100% - 2.4em); }

.ui-controlgroup-vertical .ui-spinner .ui-spinner-up { border-top-style: solid; }

.ui-checkboxradio-label .ui-icon-background { box-shadow: inset 1px 1px 1px #ccc; border-radius: .12em; border: none; }

.ui-checkboxradio-radio-label .ui-icon-background { width: 16px; height: 16px; border-radius: 1em; overflow: visible; border: none; }

.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon, .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon { background-image: none; width: 8px; height: 8px; border-width: 4px; border-style: solid; }

.ui-checkboxradio-disabled { pointer-events: none; }

.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; }

.ui-datepicker .ui-datepicker-header { position: relative; padding: .2em 0; }

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 2px; width: 1.8em; height: 1.8em; }

.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }

.ui-datepicker .ui-datepicker-prev { left: 2px; }

.ui-datepicker .ui-datepicker-next { right: 2px; }

.ui-datepicker .ui-datepicker-prev-hover { left: 1px; }

.ui-datepicker .ui-datepicker-next-hover { right: 1px; }

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }

.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }

.ui-datepicker .ui-datepicker-title select { font-size: 1em; margin: 1px 0; }

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 45%; }

.ui-datepicker table { width: 100%; font-size: .9em; border-collapse: collapse; margin: 0 0 .4em; }

.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; }

.ui-datepicker td { border: 0; padding: 1px; }

.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }

.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding: 0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }

.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width: auto; overflow: visible; }

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; }

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi { width: auto; }

.ui-datepicker-multi .ui-datepicker-group { float: left; }

.ui-datepicker-multi .ui-datepicker-group table { width: 95%; margin: 0 auto .4em; }

.ui-datepicker-multi-2 .ui-datepicker-group { width: 50%; }

.ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%; }

.ui-datepicker-multi-4 .ui-datepicker-group { width: 25%; }

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width: 0; }

.ui-datepicker-multi .ui-datepicker-buttonpane { clear: left; }

.ui-datepicker-row-break { clear: both; width: 100%; font-size: 0; }

/* RTL support */
.ui-datepicker-rtl { direction: rtl; }

.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }

.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }

.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }

.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }

.ui-datepicker-rtl .ui-datepicker-buttonpane { clear: right; }

.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }

.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker-rtl .ui-datepicker-group { float: right; }

.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width: 0; border-left-width: 1px; }

/* Icons */
.ui-datepicker .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; left: .5em; top: .3em; }

.ui-dialog { position: absolute; top: 0; left: 0; padding: .2em; outline: 0; }

.ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; }

.ui-dialog .ui-dialog-title { float: left; margin: .1em 0; white-space: nowrap; width: 90%; overflow: hidden; text-overflow: ellipsis; }

.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 20px; margin: -10px 0 0 0; padding: 1px; height: 20px; }

.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; }

.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin-top: .5em; padding: .3em 1em .5em .4em; }

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; }

.ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; }

.ui-dialog .ui-resizable-n { height: 2px; top: 0; }

.ui-dialog .ui-resizable-e { width: 2px; right: 0; }

.ui-dialog .ui-resizable-s { height: 2px; bottom: 0; }

.ui-dialog .ui-resizable-w { width: 2px; left: 0; }

.ui-dialog .ui-resizable-se, .ui-dialog .ui-resizable-sw, .ui-dialog .ui-resizable-ne, .ui-dialog .ui-resizable-nw { width: 7px; height: 7px; }

.ui-dialog .ui-resizable-se { right: 0; bottom: 0; }

.ui-dialog .ui-resizable-sw { left: 0; bottom: 0; }

.ui-dialog .ui-resizable-ne { right: 0; top: 0; }

.ui-dialog .ui-resizable-nw { left: 0; top: 0; }

.ui-draggable .ui-dialog-titlebar { cursor: move; }

.ui-draggable-handle { touch-action: none; }

.ui-resizable { position: relative; }

.ui-resizable-handle { position: absolute; font-size: 0.1px; display: block; touch-action: none; }

.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }

.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; }

.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; }

.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; }

.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; }

.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; }

.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; }

.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; }

.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px; }

.ui-progressbar { height: 2em; text-align: left; overflow: hidden; }

.ui-progressbar .ui-progressbar-value { margin: -1px; height: 100%; }

.ui-progressbar .ui-progressbar-overlay { background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw=="); height: 100%; filter: alpha(opacity=25); /* support: IE8 */ opacity: 0.25; }

.ui-progressbar-indeterminate .ui-progressbar-value { background-image: none; }

.ui-selectable { touch-action: none; }

.ui-selectable-helper { position: absolute; z-index: 100; border: 1px dotted black; }

.ui-selectmenu-menu { padding: 0; margin: 0; position: absolute; top: 0; left: 0; display: none; }

.ui-selectmenu-menu .ui-menu { overflow: auto; overflow-x: hidden; padding-bottom: 1px; }

.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup { font-size: 1em; font-weight: bold; line-height: 1.5; padding: 2px 0.4em; margin: 0.5em 0 0 0; height: auto; border: 0; }

.ui-selectmenu-open { display: block; }

.ui-selectmenu-text { display: block; margin-right: 20px; overflow: hidden; text-overflow: ellipsis; }

.ui-selectmenu-button.ui-button { text-align: left; white-space: nowrap; width: 14em; }

.ui-selectmenu-icon.ui-icon { float: right; margin-top: 0; }

.ui-slider { position: relative; text-align: left; }

.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; touch-action: none; }

.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }

/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { -webkit-filter: inherit; filter: inherit; }

.ui-slider-horizontal { height: .8em; }

.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }

.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }

.ui-slider-horizontal .ui-slider-range-min { left: 0; }

.ui-slider-horizontal .ui-slider-range-max { right: 0; }

.ui-slider-vertical { width: .8em; height: 100px; }

.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }

.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }

.ui-slider-vertical .ui-slider-range-min { bottom: 0; }

.ui-slider-vertical .ui-slider-range-max { top: 0; }

.ui-sortable-handle { touch-action: none; }

.ui-spinner { position: relative; display: inline-block; overflow: hidden; padding: 0; vertical-align: middle; }

.ui-spinner-input { border: none; background: none; color: inherit; padding: .222em 0; margin: .2em 0; vertical-align: middle; margin-left: .4em; margin-right: 2em; }

.ui-spinner-button { width: 1.6em; height: 50%; font-size: .5em; padding: 0; margin: 0; text-align: center; position: absolute; cursor: default; display: block; overflow: hidden; right: 0; }

/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button { border-top-style: none; border-bottom-style: none; border-right-style: none; }

.ui-spinner-up { top: 0; }

.ui-spinner-down { bottom: 0; }

.ui-tabs { position: relative; /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ padding: .2em; }

.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; }

.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 0; margin: 1px .2em 0 0; border-bottom-width: 0; padding: 0; white-space: nowrap; }

.ui-tabs .ui-tabs-nav .ui-tabs-anchor { float: left; padding: .5em 1em; text-decoration: none; }

.ui-tabs .ui-tabs-nav li.ui-tabs-active { margin-bottom: -1px; padding-bottom: 1px; }

.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor { cursor: text; }

.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor { cursor: pointer; }

.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; }

.ui-tooltip { padding: 8px; position: absolute; z-index: 9999; max-width: 300px; }

body .ui-tooltip { border-width: 2px; }

/* Component containers
----------------------------------*/
.ui-widget { font-family: Arial,Helvetica,sans-serif; font-size: 1em; }

.ui-widget .ui-widget { font-size: 1em; }

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Arial,Helvetica,sans-serif; font-size: 1em; }

.ui-widget.ui-widget-content { border: 1px solid #c5c5c5; }

.ui-widget-content { border: 1px solid #dddddd; background: #ffffff; color: #333333; }

.ui-widget-content a { color: #333333; }

.ui-widget-header { border: 1px solid #dddddd; background: #e9e9e9; color: #333333; font-weight: bold; }

.ui-widget-header a { color: #333333; }

/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: 1px solid #c5c5c5; background: #f6f6f6; font-weight: normal; color: #454545; }

.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button { color: #454545; text-decoration: none; }

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { border: 1px solid #cccccc; background: #ededed; font-weight: normal; color: #2b2b2b; }

.ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited, a.ui-button:hover, a.ui-button:focus { color: #2b2b2b; text-decoration: none; }

.ui-visual-focus { box-shadow: 0 0 3px 1px #5e9ed6; }

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { border: 1px solid #003eff; background: #007fff; font-weight: normal; color: #ffffff; }

.ui-icon-background, .ui-state-active .ui-icon-background { border: #003eff; background-color: #ffffff; }

.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #ffffff; text-decoration: none; }

/* Interaction Cues
----------------------------------*/
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #dad55e; background: #fffa90; color: #777620; }

.ui-state-checked { border: 1px solid #dad55e; background: #fffa90; }

.ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { color: #777620; }

.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #f1a899; background: #fddfdf; color: #5f3f3f; }

.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #5f3f3f; }

.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #5f3f3f; }

.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; }

.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter: Alpha(Opacity=70); /* support: IE8 */ font-weight: normal; }

.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter: Alpha(Opacity=35); /* support: IE8 */ background-image: none; }

.ui-state-disabled .ui-icon { filter: Alpha(Opacity=35); /* support: IE8 - See #6059 */ }

/* Icons
----------------------------------*/
/* states and images */
.ui-icon { width: 16px; height: 16px; }

.ui-icon, .ui-widget-content .ui-icon { background-image: url("images/ui-icons_444444_256x240.png"); }

.ui-widget-header .ui-icon { background-image: url("images/ui-icons_444444_256x240.png"); }

.ui-state-hover .ui-icon, .ui-state-focus .ui-icon, .ui-button:hover .ui-icon, .ui-button:focus .ui-icon { background-image: url("images/ui-icons_555555_256x240.png"); }

.ui-state-active .ui-icon, .ui-button:active .ui-icon { background-image: url("images/ui-icons_ffffff_256x240.png"); }

.ui-state-highlight .ui-icon, .ui-button .ui-state-highlight.ui-icon { background-image: url("images/ui-icons_777620_256x240.png"); }

.ui-state-error .ui-icon, .ui-state-error-text .ui-icon { background-image: url("images/ui-icons_cc0000_256x240.png"); }

.ui-button .ui-icon { background-image: url("images/ui-icons_777777_256x240.png"); }

/* positioning */
.ui-icon-blank { background-position: 16px 16px; }

.ui-icon-caret-1-n { background-position: 0 0; }

.ui-icon-caret-1-ne { background-position: -16px 0; }

.ui-icon-caret-1-e { background-position: -32px 0; }

.ui-icon-caret-1-se { background-position: -48px 0; }

.ui-icon-caret-1-s { background-position: -65px 0; }

.ui-icon-caret-1-sw { background-position: -80px 0; }

.ui-icon-caret-1-w { background-position: -96px 0; }

.ui-icon-caret-1-nw { background-position: -112px 0; }

.ui-icon-caret-2-n-s { background-position: -128px 0; }

.ui-icon-caret-2-e-w { background-position: -144px 0; }

.ui-icon-triangle-1-n { background-position: 0 -16px; }

.ui-icon-triangle-1-ne { background-position: -16px -16px; }

.ui-icon-triangle-1-e { background-position: -32px -16px; }

.ui-icon-triangle-1-se { background-position: -48px -16px; }

.ui-icon-triangle-1-s { background-position: -65px -16px; }

.ui-icon-triangle-1-sw { background-position: -80px -16px; }

.ui-icon-triangle-1-w { background-position: -96px -16px; }

.ui-icon-triangle-1-nw { background-position: -112px -16px; }

.ui-icon-triangle-2-n-s { background-position: -128px -16px; }

.ui-icon-triangle-2-e-w { background-position: -144px -16px; }

.ui-icon-arrow-1-n { background-position: 0 -32px; }

.ui-icon-arrow-1-ne { background-position: -16px -32px; }

.ui-icon-arrow-1-e { background-position: -32px -32px; }

.ui-icon-arrow-1-se { background-position: -48px -32px; }

.ui-icon-arrow-1-s { background-position: -65px -32px; }

.ui-icon-arrow-1-sw { background-position: -80px -32px; }

.ui-icon-arrow-1-w { background-position: -96px -32px; }

.ui-icon-arrow-1-nw { background-position: -112px -32px; }

.ui-icon-arrow-2-n-s { background-position: -128px -32px; }

.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }

.ui-icon-arrow-2-e-w { background-position: -160px -32px; }

.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }

.ui-icon-arrowstop-1-n { background-position: -192px -32px; }

.ui-icon-arrowstop-1-e { background-position: -208px -32px; }

.ui-icon-arrowstop-1-s { background-position: -224px -32px; }

.ui-icon-arrowstop-1-w { background-position: -240px -32px; }

.ui-icon-arrowthick-1-n { background-position: 1px -48px; }

.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }

.ui-icon-arrowthick-1-e { background-position: -32px -48px; }

.ui-icon-arrowthick-1-se { background-position: -48px -48px; }

.ui-icon-arrowthick-1-s { background-position: -64px -48px; }

.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }

.ui-icon-arrowthick-1-w { background-position: -96px -48px; }

.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }

.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }

.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }

.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }

.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }

.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }

.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }

.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }

.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }

.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }

.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }

.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }

.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }

.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }

.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }

.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }

.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }

.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }

.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }

.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }

.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }

.ui-icon-arrow-4 { background-position: 0 -80px; }

.ui-icon-arrow-4-diag { background-position: -16px -80px; }

.ui-icon-extlink { background-position: -32px -80px; }

.ui-icon-newwin { background-position: -48px -80px; }

.ui-icon-refresh { background-position: -64px -80px; }

.ui-icon-shuffle { background-position: -80px -80px; }

.ui-icon-transfer-e-w { background-position: -96px -80px; }

.ui-icon-transferthick-e-w { background-position: -112px -80px; }

.ui-icon-folder-collapsed { background-position: 0 -96px; }

.ui-icon-folder-open { background-position: -16px -96px; }

.ui-icon-document { background-position: -32px -96px; }

.ui-icon-document-b { background-position: -48px -96px; }

.ui-icon-note { background-position: -64px -96px; }

.ui-icon-mail-closed { background-position: -80px -96px; }

.ui-icon-mail-open { background-position: -96px -96px; }

.ui-icon-suitcase { background-position: -112px -96px; }

.ui-icon-comment { background-position: -128px -96px; }

.ui-icon-person { background-position: -144px -96px; }

.ui-icon-print { background-position: -160px -96px; }

.ui-icon-trash { background-position: -176px -96px; }

.ui-icon-locked { background-position: -192px -96px; }

.ui-icon-unlocked { background-position: -208px -96px; }

.ui-icon-bookmark { background-position: -224px -96px; }

.ui-icon-tag { background-position: -240px -96px; }

.ui-icon-home { background-position: 0 -112px; }

.ui-icon-flag { background-position: -16px -112px; }

.ui-icon-calendar { background-position: -32px -112px; }

.ui-icon-cart { background-position: -48px -112px; }

.ui-icon-pencil { background-position: -64px -112px; }

.ui-icon-clock { background-position: -80px -112px; }

.ui-icon-disk { background-position: -96px -112px; }

.ui-icon-calculator { background-position: -112px -112px; }

.ui-icon-zoomin { background-position: -128px -112px; }

.ui-icon-zoomout { background-position: -144px -112px; }

.ui-icon-search { background-position: -160px -112px; }

.ui-icon-wrench { background-position: -176px -112px; }

.ui-icon-gear { background-position: -192px -112px; }

.ui-icon-heart { background-position: -208px -112px; }

.ui-icon-star { background-position: -224px -112px; }

.ui-icon-link { background-position: -240px -112px; }

.ui-icon-cancel { background-position: 0 -128px; }

.ui-icon-plus { background-position: -16px -128px; }

.ui-icon-plusthick { background-position: -32px -128px; }

.ui-icon-minus { background-position: -48px -128px; }

.ui-icon-minusthick { background-position: -64px -128px; }

.ui-icon-close { background-position: -80px -128px; }

.ui-icon-closethick { background-position: -96px -128px; }

.ui-icon-key { background-position: -112px -128px; }

.ui-icon-lightbulb { background-position: -128px -128px; }

.ui-icon-scissors { background-position: -144px -128px; }

.ui-icon-clipboard { background-position: -160px -128px; }

.ui-icon-copy { background-position: -176px -128px; }

.ui-icon-contact { background-position: -192px -128px; }

.ui-icon-image { background-position: -208px -128px; }

.ui-icon-video { background-position: -224px -128px; }

.ui-icon-script { background-position: -240px -128px; }

.ui-icon-alert { background-position: 0 -144px; }

.ui-icon-info { background-position: -16px -144px; }

.ui-icon-notice { background-position: -32px -144px; }

.ui-icon-help { background-position: -48px -144px; }

.ui-icon-check { background-position: -64px -144px; }

.ui-icon-bullet { background-position: -80px -144px; }

.ui-icon-radio-on { background-position: -96px -144px; }

.ui-icon-radio-off { background-position: -112px -144px; }

.ui-icon-pin-w { background-position: -128px -144px; }

.ui-icon-pin-s { background-position: -144px -144px; }

.ui-icon-play { background-position: 0 -160px; }

.ui-icon-pause { background-position: -16px -160px; }

.ui-icon-seek-next { background-position: -32px -160px; }

.ui-icon-seek-prev { background-position: -48px -160px; }

.ui-icon-seek-end { background-position: -64px -160px; }

.ui-icon-seek-start { background-position: -80px -160px; }

/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; }

.ui-icon-stop { background-position: -96px -160px; }

.ui-icon-eject { background-position: -112px -160px; }

.ui-icon-volume-off { background-position: -128px -160px; }

.ui-icon-volume-on { background-position: -144px -160px; }

.ui-icon-power { background-position: 0 -176px; }

.ui-icon-signal-diag { background-position: -16px -176px; }

.ui-icon-signal { background-position: -32px -176px; }

.ui-icon-battery-0 { background-position: -48px -176px; }

.ui-icon-battery-1 { background-position: -64px -176px; }

.ui-icon-battery-2 { background-position: -80px -176px; }

.ui-icon-battery-3 { background-position: -96px -176px; }

.ui-icon-circle-plus { background-position: 0 -192px; }

.ui-icon-circle-minus { background-position: -16px -192px; }

.ui-icon-circle-close { background-position: -32px -192px; }

.ui-icon-circle-triangle-e { background-position: -48px -192px; }

.ui-icon-circle-triangle-s { background-position: -64px -192px; }

.ui-icon-circle-triangle-w { background-position: -80px -192px; }

.ui-icon-circle-triangle-n { background-position: -96px -192px; }

.ui-icon-circle-arrow-e { background-position: -112px -192px; }

.ui-icon-circle-arrow-s { background-position: -128px -192px; }

.ui-icon-circle-arrow-w { background-position: -144px -192px; }

.ui-icon-circle-arrow-n { background-position: -160px -192px; }

.ui-icon-circle-zoomin { background-position: -176px -192px; }

.ui-icon-circle-zoomout { background-position: -192px -192px; }

.ui-icon-circle-check { background-position: -208px -192px; }

.ui-icon-circlesmall-plus { background-position: 0 -208px; }

.ui-icon-circlesmall-minus { background-position: -16px -208px; }

.ui-icon-circlesmall-close { background-position: -32px -208px; }

.ui-icon-squaresmall-plus { background-position: -48px -208px; }

.ui-icon-squaresmall-minus { background-position: -64px -208px; }

.ui-icon-squaresmall-close { background-position: -80px -208px; }

.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }

.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }

.ui-icon-grip-solid-vertical { background-position: -32px -224px; }

.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }

.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }

.ui-icon-grip-diagonal-se { background-position: -80px -224px; }

/* Misc visuals
----------------------------------*/
/* Corner radius */
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 3px; }

.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 3px; }

.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 3px; }

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 3px; }

/* Overlays */
.ui-widget-overlay { background: #aaaaaa; opacity: .003; filter: Alpha(Opacity=0.3); /* support: IE8 */ }

.ui-widget-shadow { box-shadow: 0px 0px 5px #666666; }

.daterangepicker { position: absolute; color: inherit; background-color: #fff; border-radius: 4px; border: 1px solid #ddd; width: 278px; max-width: none; padding: 0; margin-top: 7px; top: 100px; left: 20px; z-index: 3001; display: none; font-size: 15px; line-height: 1em; }

.daterangepicker:before, .daterangepicker:after { position: absolute; display: inline-block; border-bottom-color: rgba(0, 0, 0, 0.2); content: ''; }

.daterangepicker:before { top: -7px; border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #ccc; }

.daterangepicker:after { top: -6px; border-right: 6px solid transparent; border-bottom: 6px solid #fff; border-left: 6px solid transparent; }

.daterangepicker.opensleft:before { right: 9px; }

.daterangepicker.opensleft:after { right: 10px; }

.daterangepicker.openscenter:before { left: 0; right: 0; width: 0; margin-left: auto; margin-right: auto; }

.daterangepicker.openscenter:after { left: 0; right: 0; width: 0; margin-left: auto; margin-right: auto; }

.daterangepicker.opensright:before { left: 9px; }

.daterangepicker.opensright:after { left: 10px; }

.daterangepicker.drop-up { margin-top: -7px; }

.daterangepicker.drop-up:before { top: initial; bottom: -7px; border-bottom: initial; border-top: 7px solid #ccc; }

.daterangepicker.drop-up:after { top: initial; bottom: -6px; border-bottom: initial; border-top: 6px solid #fff; }

.daterangepicker.single .daterangepicker .ranges, .daterangepicker.single .drp-calendar { float: none; }

.daterangepicker.single .drp-selected { display: none; }

.daterangepicker.show-calendar .drp-calendar { display: block; }

.daterangepicker.show-calendar .drp-buttons { display: block; }

.daterangepicker.auto-apply .drp-buttons { display: none; }

.daterangepicker .drp-calendar { display: none; max-width: 270px; }

.daterangepicker .drp-calendar.left { padding: 8px 0 8px 8px; }

.daterangepicker .drp-calendar.right { padding: 8px; }

.daterangepicker .drp-calendar.single .calendar-table { border: none; }

.daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span { color: #fff; border: solid black; border-width: 0 2px 2px 0; border-radius: 0; display: inline-block; padding: 3px; }

.daterangepicker .calendar-table .next span { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }

.daterangepicker .calendar-table .prev span { transform: rotate(135deg); -webkit-transform: rotate(135deg); }

.daterangepicker .calendar-table th, .daterangepicker .calendar-table td { white-space: nowrap; text-align: center; vertical-align: middle; min-width: 32px; width: 32px; height: 24px; line-height: 24px; font-size: 12px; border-radius: 4px; border: 1px solid transparent; white-space: nowrap; cursor: pointer; }

.daterangepicker .calendar-table { border: 1px solid #fff; border-radius: 4px; background-color: #fff; }

.daterangepicker .calendar-table table { width: 100%; margin: 0; border-spacing: 0; border-collapse: collapse; }

.daterangepicker td.available:hover, .daterangepicker th.available:hover { background-color: #eee; border-color: transparent; color: inherit; }

.daterangepicker td.week, .daterangepicker th.week { font-size: 80%; color: #ccc; }

.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date { background-color: #fff; border-color: transparent; color: #999; }

.daterangepicker td.in-range { background-color: #EFF1F4; border-color: transparent; color: #000; border-radius: 0; }

.daterangepicker td.start-date { border-radius: 4px 0 0 4px; }

.daterangepicker td.end-date { border-radius: 0 4px 4px 0; }

.daterangepicker td.start-date.end-date { border-radius: 4px; }

.daterangepicker td.active, .daterangepicker td.active:hover { background-color: #2628B9; border-color: transparent; color: #fff; }

.daterangepicker th.month { width: auto; }

.daterangepicker td.disabled, .daterangepicker option.disabled { color: #999; cursor: not-allowed; color: #CBCBCB; }

.daterangepicker select.monthselect, .daterangepicker select.yearselect { font-size: 12px; padding: 1px; height: auto; margin: 0; cursor: default; }

.daterangepicker select.monthselect { margin-right: 2%; width: 56%; }

.daterangepicker select.yearselect { width: 40%; }

.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect { width: 50px; margin: 0 auto; background: #eee; border: 1px solid #eee; padding: 2px; outline: 0; font-size: 12px; }

.daterangepicker .calendar-time { text-align: center; margin: 4px auto 0 auto; line-height: 30px; position: relative; }

.daterangepicker .calendar-time select.disabled { color: #ccc; cursor: not-allowed; }

.daterangepicker .drp-buttons { clear: both; text-align: right; padding: 8px; border-top: 1px solid #ddd; display: none; line-height: 12px; vertical-align: middle; }

.daterangepicker .drp-selected { display: inline-block; font-size: 12px; padding-right: 8px; color: #999; }

.daterangepicker .drp-buttons .btn { margin-left: 8px; font-size: 12px; font-weight: bold; padding: 4px 8px; }

.daterangepicker .drp-buttons .btn.applyBtn { color: #2628B9; }

.daterangepicker.show-ranges.single.rtl .drp-calendar.left { border-right: 1px solid #ddd; }

.daterangepicker.show-ranges.single.ltr .drp-calendar.left { border-left: 1px solid #ddd; }

.daterangepicker.show-ranges.rtl .drp-calendar.right { border-right: 1px solid #ddd; }

.daterangepicker.show-ranges.ltr .drp-calendar.left { border-left: 1px solid #ddd; }

.daterangepicker .ranges { float: none; text-align: left; margin: 0; }

.daterangepicker.show-calendar .ranges { margin-top: 8px; }

.daterangepicker .ranges ul { list-style: none; margin: 0 auto; padding: 0; width: 100%; }

.daterangepicker .ranges li { font-size: 12px; padding: 8px 12px; cursor: pointer; }

.daterangepicker .ranges li:hover { background-color: #eee; }

.daterangepicker .ranges li.active { background-color: #2628B9; color: #fff; }

/*  Larger Screen Styling */
@media (min-width: 564px) { .daterangepicker { width: auto; } .daterangepicker .ranges ul { width: 140px; } .daterangepicker.single .ranges ul { width: 100%; } .daterangepicker.single .drp-calendar.left { clear: none; } .daterangepicker.single .ranges, .daterangepicker.single .drp-calendar { float: left; } .daterangepicker { direction: ltr; text-align: left; } .daterangepicker .drp-calendar.left { clear: left; margin-right: 0; } .daterangepicker .drp-calendar.left .calendar-table { border-right: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } .daterangepicker .drp-calendar.right { margin-left: 0; } .daterangepicker .drp-calendar.right .calendar-table { border-left: none; border-top-left-radius: 0; border-bottom-left-radius: 0; } .daterangepicker .drp-calendar.left .calendar-table { padding-right: 8px; } .daterangepicker .ranges, .daterangepicker .drp-calendar { float: left; } }

@media (min-width: 730px) { .daterangepicker .ranges { width: auto; } .daterangepicker .ranges { float: left; } .daterangepicker.rtl .ranges { float: right; } .daterangepicker .drp-calendar.left { clear: none !important; } }

/*************** SCROLLBAR BASE CSS ***************/
.scroll-wrapper { overflow: hidden !important; padding: 0 !important; position: relative; }

.scroll-wrapper > .scroll-content { border: none !important; box-sizing: content-box !important; height: auto; left: 0; margin: 0; max-height: none; max-width: none !important; overflow: scroll !important; padding: 0; position: relative !important; top: 0; width: auto !important; }

.scroll-wrapper > .scroll-content::-webkit-scrollbar { height: 0; width: 0; }

.scroll-element { display: none; }

.scroll-element, .scroll-element div { box-sizing: content-box; }

.scroll-element.scroll-x.scroll-scrollx_visible, .scroll-element.scroll-y.scroll-scrolly_visible { display: block; }

.scroll-element .scroll-bar, .scroll-element .scroll-arrow { cursor: default; }

.scroll-textarea { border: 1px solid #cccccc; border-top-color: #999999; }

.scroll-textarea > .scroll-content { overflow: hidden !important; }

.scroll-textarea > .scroll-content > textarea { border: none !important; box-sizing: border-box; height: 100% !important; margin: 0; max-height: none !important; max-width: none !important; overflow: scroll !important; outline: none; padding: 2px; position: relative !important; top: 0; width: 100% !important; }

.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar { height: 0; width: 0; }

/*************** SIMPLE INNER SCROLLBAR ***************/
.scrollbar-inner > .scroll-element, .scrollbar-inner > .scroll-element div { border: none; margin: 0; padding: 0; position: absolute; z-index: 10; }

.scrollbar-inner > .scroll-element div { display: block; height: 100%; left: 0; top: 0; width: 100%; }

.scrollbar-inner > .scroll-element.scroll-x { bottom: 2px; height: 8px; left: 0; width: 100%; }

.scrollbar-inner > .scroll-element.scroll-y { height: 100%; right: 2px; top: 0; width: 6px; }

.scrollbar-inner > .scroll-element .scroll-element_outer { overflow: hidden; }

.scrollbar-inner > .scroll-element .scroll-element_outer, .scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar { /* -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; */ }

.scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar { /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); opacity: 0.4; */ }

.scrollbar-inner > .scroll-element .scroll-element_track { background-color: #fafafa; }

.scrollbar-inner > .scroll-element .scroll-bar { background-color: #2233b6; }

.scrollbar-inner > .scroll-element:hover .scroll-bar { background-color: #2233b6; }

.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar { background-color: #2233b6; }

/* update scrollbar offset if both scrolls are visible */
.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -12px; }

.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -12px; }

.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -12px; }

.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -12px; }

/*====================================== Selectric v1.11.0 ======================================*/
.selectric-wrapper { position: relative; cursor: pointer; }

.selectric-responsive { width: 100%; }

.selectric { border: 1px solid #dadadb; background: #fff; position: relative; border-radius: 4px; }

.selectric .label { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 42px 0 16px; font-size: 14px; font-weight: 300; line-height: 38px; color: #222; height: 34px; letter-spacing: -0.1px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.selectric .button { display: block; position: absolute; right: 0; top: 0; width: 42px; height: 34px; color: #BBB; text-align: center; font: 0/0 a; *font: 20px/38px Lucida Sans Unicode, Arial Unicode MS, Arial; }

.selectric .button:after { content: " "; position: absolute; top: 15px; right: 0; left: 0; margin: auto; width: 10px; height: 6px; background: url(/webImages/btn-dropdwoun-arrow-nor.svg) no-repeat 0 0; background-size: 10px 6px; }

.selectric-focus .selectric { border-color: #aaaaaa; }

.selectric-hover .selectric { border-color: #c4c4c4; }

.selectric-hover .selectric .button { color: #a2a2a2; }

.selectric-hover .selectric .button:after { border-top-color: #a2a2a2; }

.selectric-open { z-index: 9999; }

.selectric-open .selectric { border-color: #c4c4c4; }

.selectric-open .selectric-items { display: block; }

.selectric-open .button:after { background: url(/webImages/btn-dropdwoun-arrow-sel.svg) no-repeat 0 0; background-size: 10px 6px; }

.selectric-open .selectric { border-color: #2233b6; }

.selectric-disabled { cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.selectric-disabled .selectric { background-color: #f5f5f5; }

.selectric-disabled .label { background-color: transparent; color: #999; }

.selectric-disabled .button { background-color: transparent; }

.selectric-disabled .button:after { background: url(/webImages/btn-dropdwoun-arrow-nor-dim.svg) no-repeat 0 0; background-size: 10px 6px; }

.selectric-hide-select { position: relative; overflow: hidden; width: 0; height: 0; }

.selectric-hide-select select { position: absolute; left: -100%; }

.selectric-hide-select.selectric-is-native { position: absolute; width: 100%; height: 100%; z-index: 10; }

.selectric-hide-select.selectric-is-native select { position: absolute; top: 0; left: 0; right: 0; height: 100%; width: 100%; border: none; z-index: 1; box-sizing: border-box; opacity: 0; }

.selectric-input { position: absolute !important; top: 0 !important; left: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; margin: 0 !important; padding: 0 !important; width: 1px !important; height: 1px !important; outline: none !important; border: none !important; *font: 0/0 a !important; background: none !important; }

.selectric-temp-show { position: absolute !important; visibility: hidden !important; display: block !important; }

/* Items box */
.selectric-items { display: none; position: absolute; top: 100%; margin-top: 4px; left: 0; background: #fff; border: 1px solid #2233b6; border-radius: 4px; z-index: -1; }

.selectric-items .selectric-scroll { height: 100%; overflow: auto; }

.selectric-above .selectric-items { top: auto; bottom: 100%; margin-bottom: 4px; }

.selectric-items ul { list-style: none; padding: 8px 6px; margin: 0; }

.selectric-items ul, .selectric-items li { list-style: none; font-size: 12px; line-height: 30px; min-height: 30px; }

.selectric-items li { display: block; padding: 0; text-indent: 6px; color: #666; cursor: pointer; }

.selectric-items li.selected { background: #E0E0E0; color: #222; letter-spacing: -0.1px; }

.selectric-items li.highlighted { background: #e9f5ff; color: #2233b6; font-weight: 700; }

.selectric-items li:hover { background: #e9f5ff; color: #2233b6; font-weight: 700; }

.selectric-items .disabled { filter: alpha(opacity=50); opacity: 0.5; cursor: default !important; background: none !important; color: #666 !important; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.selectric-items .selectric-group .selectric-group-label { font-weight: bold; padding-left: 10px; cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background: none; color: #444; }

.selectric-items .selectric-group.disabled li { filter: alpha(opacity=100); opacity: 1; }

.selectric-items .selectric-group li { padding-left: 25px; }

/* Popup */
.popup-area { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 401; }

.popup-area.not-dimmed { height: 0; }

.popup-area .dimmed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: .5; filter: alpha(opacity=60); }

.popup-area .pop-layer { display: block; }

.pop-layer { display: none; position: fixed; top: 42px; left: 42px; width: calc(100% - 84px); height: auto; background-color: #fff; z-index: 400; border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); }

.pop-layer.type-minimap { overflow: hidden; border-radius: 4px; box-shadow: 0 10px 20px 0 rgba(34, 51, 182, 0.23); background-color: #ffffff; }

.pop-layer.type-alarm { overflow: hidden; height: 400px; top: 50px; left: auto; right: 14px; width: 312px; padding: 30px 24px 40px; border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25); background-color: #ffffff; }

.pop-layer.type-alarm .alarm-box .title { padding-bottom: 35px; }

.pop-layer.type-alarm .alarm-box .title a { display: inline-block; padding-left: 18px; line-height: 24px; font-weight: 500; color: #2233b6; text-decoration: underline; background: url(/webImages/icon-btn-notice-s.svg) 0 50% no-repeat; background-size: 16px 16px; }

.pop-layer.type-alarm .alarm-box .notics { height: 370px; }

.pop-layer.type-alarm .alarm-box .notics li { padding: 19px 0 16px; font-size: 14px; line-height: 20px; letter-spacing: -0.01em; border-bottom: 1px solid #efefef; }

.pop-layer.type-alarm .alarm-box .notics li .ttl { position: relative; margin-bottom: 6px; }

.pop-layer.type-alarm .alarm-box .notics li .ttl strong { font-weight: 500; }

.pop-layer.type-alarm .alarm-box .notics li .ttl .date-time { color: #666; }

.pop-layer.type-alarm .alarm-box .notics li .ttl.single .date-time { font-weight: 500; color: #222; }

.pop-layer.type-alarm .alarm-box .notics li .ttl.dual .date-time { position: absolute; right: 0; top: 0; }

.pop-layer.type-alarm .alarm-box .notics li.old > * { opacity: .5; }

.pop-layer.type-alarm .alarm-box .notics li .txt { color: #666; }

.pop-layer.type-alarm .alarm-box .notics li .txt a { display: block; overflow: hidden; white-space: normal; line-height: 17px; max-height: 34px; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.pop-layer.type-alarm .alarm-box .notics li .txt a:hover { text-decoration: underline; }

.pop-layer.type-alarm .alarm-box .notics li:first-child { padding-top: 0; }

.pop-layer.type-alarm .none-alarm { display: block; padding-top: 22px; margin: 60px 0; font-size: 14px; color: #999990; text-align: center; background: url(/webImages/icon-nodata.svg) 50% 0 no-repeat; background-size: 18px 18px; }

.pop-layer.type-alarm a.btn-popclose { top: 30px; }

.pop-layer.type-alarm.none { height: 165px; }

.pop-layer.type-group { width: 600px; height: 516px; padding: 30px 24px 40px; box-sizing: border-box; left: 50%; top: 80px; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); background-color: #ffffff; }

.pop-layer.type-group .title { position: relative; }

.pop-layer.type-group .title .inn p { margin: 0 0 2px 0; font-size: 20px; font-weight: 500; letter-spacing: -0.1px; color: #222; }

.pop-layer.type-group .title .inn span { display: block; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; }

.pop-layer.type-group .title .inn .group-set { position: absolute; right: 40px; top: 6px; font-size: 12px; font-weight: 500; letter-spacing: -0.09px; color: #2233b6; text-decoration: underline; }

.pop-layer.type-group .title .inn .group-set [class^=ui-svg] { display: inline-block; position: relative; top: 1px; margin: 0 4px 0 0; width: 12px; height: 12px; }

.pop-layer.type-group .title .inn .group-set img { position: relative; top: 1px; margin: 0 4px 0 0; width: 12px; height: 12px; }

.pop-layer.type-group .inner { position: relative; box-sizing: border-box; height: 234px; margin: 36px 0 0 0; }

.pop-layer.type-group .inner .btn-arrow { position: absolute; left: 266px; top: 117px; }

.pop-layer.type-group .inner .btn-arrow img { width: 20px; height: 20px; }

.pop-layer.type-group .inner .group-box { width: 260px; }

.pop-layer.type-group .inner .group-box .ttl { margin: 0 0 6px 0; font-size: 14px; font-weight: 700; letter-spacing: -0.07px; color: #222; }

.pop-layer.type-group .inner .group-box .set-list { border-radius: 4px; border: solid 1px #e5e5e5; padding: 10px; box-sizing: border-box; height: 212px; }

.pop-layer.type-group .inner .group-box .set-list .scroll-wrap { height: 190px; overflow: auto; }

.pop-layer.type-group .inner .group-box .set-list button { display: block; width: 100%; height: 32px; text-align: left; border-radius: 4px; text-indent: 10px; font-size: 14px; letter-spacing: -0.1px; color: #222; }

.pop-layer.type-group .inner .group-box .set-list button.current { font-weight: 700; color: #2233b6; background-color: #e9f5ff; }

.pop-layer.type-group .inner .group-box .set-list .none-data { padding: 72px 0 0 0; text-align: center; font-size: 14px; letter-spacing: -0.07px; color: #999990; }

.pop-layer.type-group .inner .group-box .set-list .none-data img { width: 18px; height: 18px; }

.pop-layer.type-group .inner .group-box.right { position: absolute; right: 0; top: 0; }

.pop-layer.type-group .now { height: 52px; padding: 14px 0 0 0; box-sizing: border-box; }

.pop-layer.type-group .now .text01 { margin: 0 10px 0 0; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; }

.pop-layer.type-group .now .text02 span { font-size: 12px; font-weight: 500; line-height: 1.5; letter-spacing: -0.1px; color: #666; }

.pop-layer.type-group .now .text02 span::before { content: ''; position: relative; top: 1px; margin: 0 7px; display: inline-block; width: 7px; height: 11px; background: url(/webImages/btn-table-list-arrow-1.svg) no-repeat 0 0; background-size: 7px 11px; }

.pop-layer.type-group .now .text02 span:first-of-type::before { display: none; }

.pop-layer.type-group .btn-area { border-top: 1px solid #efefef; padding: 16px 0 0 0; text-align: center; }

.pop-layer.type-alert { width: 600px; padding: 30px 24px 40px; box-sizing: border-box; left: 50%; top: 80px; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); background-color: #ffffff; }

.pop-layer.type-alert .title { position: relative; }

.pop-layer.type-alert .title .inn p { margin: 0 0 2px 0; font-size: 20px; font-weight: 500; letter-spacing: -0.1px; color: #222; }

.pop-layer.type-alert .title .inn span { display: block; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; }

.pop-layer.type-alert .title .inn .group-set { position: absolute; right: 40px; top: 6px; font-size: 12px; font-weight: 500; letter-spacing: -0.09px; color: #2233b6; text-decoration: underline; }

.pop-layer.type-alert .title .inn .group-set img { position: relative; top: 1px; margin: 0 4px 0 0; width: 12px; height: 12px; }

.pop-layer.type-alert .inner { position: relative; box-sizing: border-box; margin: 38px 0 0 0; }

.pop-layer.type-alert .inner .gray-text { font-size: 12px; line-height: 18px; color: #999; margin: 10px 0; font-weight: 400; }

.pop-layer.type-alert .inner .link-wrap { margin: 10px 0; }

.pop-layer.type-alert .inner .message .text01 { font-size: 16px; letter-spacing: -0.13px; color: #222; }

.pop-layer.type-alert .inner .message .text02 { font-size: 12px; font-weight: 500; letter-spacing: -0.1px; color: #222; }

.pop-layer.type-alert .inner .message .text02 [class^=ui-btn] { height: auto; line-height: 1.2; }

.pop-layer.type-alert .inner .message ul.text03 li { position: relative; padding-left: 8px; font-size: 14px; line-height: 1.29; color: #666; margin-bottom: 4px; }

.pop-layer.type-alert .inner .message ul.text03 li::before { content: ''; position: absolute; left: 0; top: 7px; display: block; width: 2px; height: 2px; background: url(/webImages/icon-small-dot.svg) no-repeat 0 0; background-size: 2px 2px; }

.pop-layer.type-alert .inner .message ul.text03 li:last-of-type { margin-bottom: 0; }

.pop-layer.type-alert .inner .group-path { margin: 36px 0 0 0; }

.pop-layer.type-alert .inner .group-path .tit { margin: 0 0 12px 0; font-size: 16px; font-weight: 700; letter-spacing: -0.08px; color: #222; }

.pop-layer.type-alert .inner .group-path .group-input > div { float: left; }

.pop-layer.type-alert .inner .group-path .group-input .next { width: 23px; height: 36px; background: url(/webImages/icon-group-arrow.svg) no-repeat center center; }

.pop-layer.type-alert .inner .group-path .group-input .w250 { width: 250px; }

.pop-layer.type-alert .inner .group-path .group-input::after { content: ''; display: table; clear: both; }

.pop-layer.type-alert .inner .dot-list li { position: relative; padding-left: 8px; font-size: 12px; line-height: 1.5; color: #999; margin-bottom: 4px; }

.pop-layer.type-alert .inner .dot-list li::before { content: ''; position: absolute; left: 0; top: 7px; display: block; width: 2px; height: 2px; background: url(/webImages/icon-small-dot.svg) no-repeat 0 0; background-size: 2px 2px; }

.pop-layer.type-alert .inner .dot-list li:last-of-type { margin-bottom: 0; }

.pop-layer.type-alert .inner .number-list { margin-bottom: 20px; }

.pop-layer.type-alert .inner .number-list li { margin-bottom: 4px; font-size: 12px; font-weight: 500; letter-spacing: -0.1px; color: #222; }

.pop-layer.type-alert .inner .number-list li:last-of-type { margin-bottom: 0; }

.pop-layer.type-alert .inner .link-wrap a, .pop-layer.type-alert .inner .link-wrap button { margin-right: 8px; }

.pop-layer.type-alert .inner .group-detail-path { margin: 0 0 36px 0; }

.pop-layer.type-alert .inner .group-detail-path .text01 { display: inline-block; font-size: 16px; letter-spacing: -0.08px; color: #222; font-weight: 700; line-height: 24px; }

.pop-layer.type-alert .inner .group-detail-path .text02 { position: relative; display: inline-block; padding: 0 0 0 23px; font-size: 16px; letter-spacing: -0.08px; color: #222; font-weight: 700; line-height: 24px; }

.pop-layer.type-alert .inner .group-detail-path .text02::before { content: ''; position: absolute; left: 8px; top: 5px; display: inline-block; width: 7px; height: 11px; background: url(/webImages/icon-group-arrow.svg) no-repeat 0 0; }

.pop-layer.type-alert .inner .group-detail-header { position: relative; padding: 0 0 12px 0; }

.pop-layer.type-alert .inner .group-detail-header .text01 { font-size: 16px; font-weight: 700; letter-spacing: -0.08px; color: #222222; }

.pop-layer.type-alert .inner .group-detail-header .right { position: absolute; right: 0; top: 0; }

.pop-layer.type-alert .inner .table-filter { position: relative; margin: 0 0 12px 0; }

.pop-layer.type-alert .inner .table-filter .select-keyword .select { float: left; width: 132px; margin: 0 10px 0 0; }

.pop-layer.type-alert .inner .table-filter .select-keyword .keyword { float: left; width: 357px; }

.pop-layer.type-alert .inner .table-filter .right { position: absolute; right: 0; top: 0; }

.pop-layer.type-alert .inner .table-filter .counter { padding: 16px 0 0 0; }

.pop-layer.type-alert .inner .table-filter .counter .text01 { font-size: 14px; font-weight: 300; color: #222; }

.pop-layer.type-alert .inner .table-filter .counter .text02 { padding: 0 0 0 4px; font-size: 14px; font-weight: 500; color: #222; }

.pop-layer.type-alert .inner .table-filter::after { content: ''; display: table; clear: both; }

.pop-layer.type-alert .inner .insert-date { margin: 11px 0 0 0; }

.pop-layer.type-alert .inner .insert-date .text01 { margin: 0 10px 0 0; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; }

.pop-layer.type-alert .inner .insert-date .text02 { margin: 0 20px 0 0; font-size: 12px; font-weight: 500; line-height: 1.5; color: #666; }

.pop-layer.type-alert .inner .scroll-wrap250 { max-height: 250px; overflow-y: auto; }

.pop-layer.type-alert .inner .scroll-wrap250 .scroll-element.scroll-y { right: 0; }

.pop-layer.type-alert .inner .scroll-wrap372 { max-height: 372px; overflow-y: auto; }

.pop-layer.type-alert .inner .scroll-wrap372 .scroll-element.scroll-y { right: 0; }

.pop-layer.type-alert .inner .l-terms .tit { margin: 0 0 18px 0; font-size: 14px; font-weight: 700; line-height: 1.57; letter-spacing: 0.01px; color: #222; }

.pop-layer.type-alert .inner .l-terms .list li { margin-bottom: 8px; font-size: 12px; line-height: 1.67; letter-spacing: 0.01px; color: #666; }

.pop-layer.type-alert .inner .l-terms .list li:last-of-type { margin: 0; }

.pop-layer.type-alert .inner .l-terms .list + .tit { margin-top: 40px; }

.pop-layer.type-alert .inner .sns-alarm { margin: 18px 0 0 0; }

.pop-layer.type-alert .inner .make-group { margin: 0 0 36px 0; }

.pop-layer.type-alert .inner .make-group .tit { margin: 0 0 12px 0; font-size: 16px; font-weight: 700; letter-spacing: -0.08px; color: #222; }

.pop-layer.type-alert .inner .make-group .group-input > div { display: inline-block; vertical-align: top; }

.pop-layer.type-alert .inner .make-group .group-input .name { position: relative; top: 5px; font-size: 16px; letter-spacing: -0.08px; color: #222; font-weight: 700; }

.pop-layer.type-alert .inner .make-group .group-input .name [class^=ui-btn-] { position: relative; top: 0; }

.pop-layer.type-alert .inner .make-group .necessary { padding: 0 10px 0 0; background: url(/webImages/icon-necessary.svg) no-repeat right 15px; }

.pop-layer.type-alert .inner .make-group .next { width: 15px; height: 34px; margin: 0 8px 0 0; background: url(/webImages/icon-group-arrow.svg) no-repeat right 13px; }

.pop-layer.type-alert .inner .make-group .w250 { width: 250px; }

.pop-layer.type-alert .inner .make-admin { margin: 36px 0 18px 0; }

.pop-layer.type-alert .inner .make-admin .tit { margin: 0 0 12px 0; font-size: 16px; font-weight: 700; letter-spacing: -0.08px; color: #222; }

.pop-layer.type-alert .inner .make-admin .tit .gray { margin: 0 0 0 8px; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; font-weight: 400; }

.pop-layer.type-alert .inner .table-layout .w116 { width: 116px; }

.pop-layer.type-alert .inner .table-layout .weird { padding-top: 8px; padding-bottom: 12px; }

.pop-layer.type-alert .inner .table-layout th { vertical-align: middle; text-align: left; font-size: 14px; font-weight: 700; letter-spacing: -0.07px; color: #222; }

.pop-layer.type-alert .inner .table-layout td { vertical-align: middle; }

.pop-layer.type-alert .inner .table-layout td .t1 { font-size: 16px; letter-spacing: -0.11px; color: #555; font-weight: 500; }

.pop-layer.type-alert .inner .table-layout td .t2 { font-size: 12px; letter-spacing: -0.09px; color: #555; }

.pop-layer.type-alert .inner .table-layout td .t3 { margin-left: 10px; font-size: 14px; letter-spacing: -0.1px; color: #999; }

.pop-layer.type-alert .inner .management-standard { position: relative; width: 240px; height: 36px; border: 1px solid #dadadb; border-radius: 4px; padding-left: 6px; box-sizing: border-box; }

.pop-layer.type-alert .inner .management-standard .i { border: 0; font-size: 14px; font-weight: 300; letter-spacing: -1px; color: #222; text-indent: 10px; height: 34px; line-height: 36px; width: 180px; }

.pop-layer.type-alert .inner .management-standard .u { position: absolute; right: 16px; top: 9px; font-size: 14px; letter-spacing: -0.07px; color: #222; }

.pop-layer.type-alert .inner.mt20 { margin-top: 20px; }

.pop-layer.type-alert .layer-btn-wrap { position: relative; min-height: 36px; margin: 36px 0 0 0; text-align: center; }

.pop-layer.type-alert .layer-btn-wrap [class^=ui-btn-] { margin: 0 5px; }

.pop-layer.type-alert .layer-btn-wrap.mt16 { margin-top: 16px; }

.pop-layer.type-alert .layer-btn-wrap.mt29 { margin-top: 29px; }

.pop-layer.type-alert .layer-btn-wrap .left { position: absolute; left: 0; top: 0; }

.pop-layer.type-alert .layer-btn-wrap .left [class^=ui-btn-] { margin: 0 10px 0 0; }

.pop-layer.type-alert .layer-btn-wrap .right { position: absolute; right: 0; top: 0; }

.pop-layer.type-alert .layer-btn-wrap .right [class^=ui-btn-] { margin: 0 0 10px 0; }

.pop-layer.type-alert .date-wrap { position: relative; height: 42px; }

.pop-layer.type-alert .date-wrap .right { position: absolute; right: 0; top: 0; }

.pop-layer.type-alert .page-nate-wrap { position: relative; margin-top: 12px; padding-top: 12px; }

.pop-layer.type-alert .page-nate-wrap .right { position: absolute; right: 0; top: 0; }

.pop-layer.type-alert.w900 { width: 900px; }

.pop-layer.type-alert.w1356 { width: 1356px; }

.pop-layer.type-data-download { width: 600px; padding: 30px 24px 36px; box-sizing: border-box; left: 50%; top: 80px; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); background-color: #ffffff; }

.pop-layer.type-data-download .title { position: relative; }

.pop-layer.type-data-download .title .inn p { margin: 0 0 2px 0; font-size: 20px; font-weight: 500; letter-spacing: -0.1px; color: #222; }

.pop-layer.type-data-download .title .inn span { display: block; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; }

.pop-layer.type-data-download .inner { margin: 38px 0; }

.pop-layer.type-data-download .cycle-tab-button { width: 92px; }

.pop-layer.type-data-download .form-wrap .outline { width: auto; height: auto; }

.pop-layer.type-data-download .form-wrap .outline:before { top: 8px; }

.pop-layer.type-data-download .form-wrap input { padding-top: 4px; padding-bottom: 4px; height: 34px; box-sizing: border-box; }

.pop-layer.type-data-download .btn-area { text-align: center; }

.popup-area .pop-inner { position: relative; }

.popup-area a.btn-popclose { position: absolute; top: 33px; right: 24px; width: 24px; height: 24px; font-size: 1px; color: transparent; background: url(/webImages/btn-close.svg) 0 0 no-repeat; background-size: 24px 24px; }

/* popup Type01 */
.popup-area .title-area { position: relative; padding: 30px 24px; z-index: 410; }

.popup-area .title-area .inn { letter-spacing: -0.01em; }

.popup-area .title-area .inn p { font-size: 20px; line-height: 29px; color: #222; font-weight: 700; }

.popup-area .title-area .inn span { font-size: 12px; color: #999; line-height: 18px; }

.popup-area .pop-inner iframe { min-height: 640px; width: 100%; }

.group-area { position: relative; width: 416px; margin-top: 36px; }

.group-area .choice-area { overflow: hidden; height: 36px; border: 1px solid #dbdbdb; border-radius: 4px; cursor: pointer; }

.group-area .choice-area.on { border-color: #2233b6; }

.group-area .choice-area .sel-box { float: left; width: calc(50% - 25px); padding: 10px 0 8px 12px; margin-right: 12px; line-height: 18px; vertical-align: bottom; color: #999; border-left: 1px solid #d8d8d8; background: url(/webImages/btn-dropdwoun-arrow-nor-dim.svg) 100% 50% no-repeat; background-size: 10px 6px; }

.group-area .choice-area .sel-box:first-child { width: calc(50% - 24px); font-weight: 500; color: #222; border-left: 0; background: url(/webImages/btn-dropdwoun-arrow-nor.svg) 100% 50% no-repeat; background-size: 10px 6px; }

.group-area .choice-area.on .sel-box { background: url(/webImages/btn-dropdwoun-arrow-sel-dim.svg) 100% 50% no-repeat; background-size: 10px 6px; }

.group-area .choice-area.on .sel-box:first-child { background: url(/webImages/btn-dropdwoun-arrow-sel.svg) 100% 50% no-repeat; background-size: 10px 6px; }

.group-area .choice-area.check .sel-box:last-child { color: #222; font-weight: 500; background: url(/webImages/btn-dropdwoun-arrow-nor.svg) 100% 50% no-repeat; background-size: 10px 6px; }

.group-area .choice-area.check.all .sel-box:last-child { color: #222; font-weight: 500; background: url(/webImages/btn-dropdwoun-arrow-nor-dim.svg) 100% 50% no-repeat; background-size: 10px 6px; }

.group-area .show-layer { display: none; overflow: hidden; width: clac(402px); padding: 8px 6px; margin-top: 4px; background: #fff; border: 1px solid #2233b6; border-radius: 4px; box-shadow: 0 10px 20px 0 rgba(34, 51, 182, 0.23); }

.group-area .opt-box { float: left; width: 50%; }

.group-area .opt-box button { display: block; height: 30px; width: calc(100% - 12px); padding: 0 6px; text-align: left; }

.group-area .opt-box button.on, .group-area .opt-box button:hover { font-weight: 700; color: #2233b6; background: #e9f5ff; }

.pop-inner { position: relative; }

.pop-inner .group-data { position: absolute; bottom: 25px; left: 24px; width: 252px; height: 300px; padding: 24px 24px 30px; background: #fff; border-radius: 4px; box-shadow: 0 10px 20px 0 rgba(34, 51, 182, 0.23); }

.pop-inner .group-data .total { position: relative; }

.pop-inner .group-data .total strong { font-size: 14px; color: #222; line-height: 20px; font-weight: 700; }

.pop-inner .group-data .total span { position: relative; top: 1px; display: inline-block; padding-left: 13px; color: #999; line-height: 20px; }

.pop-inner .group-data .total span::before { content: ''; position: absolute; left: 6px; top: 4px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.pop-inner .group-data .list-amount li { padding: 20px 0 4px; border-bottom: 1px solid #efefef; }

.pop-inner .group-data .list-amount li .ttl { padding-left: 24px; font-size: 14px; line-height: 20px; }

.pop-inner .group-data .list-amount li .ttl.type01 { background: url(/webImages/icon-title-electricity.svg) 0 0 no-repeat; background-size: 18px 18px; }

.pop-inner .group-data .list-amount li .ttl.type02 { background: url(/webImages/icon-title-usage.svg) 0 0 no-repeat; background-size: 18px 18px; }

.pop-inner .group-data .list-amount li .ttl.type03 { background: url(/webImages/icon-appraisal-usage.svg) 0 0 no-repeat; background-size: 18px 18px; }

.pop-inner .group-data .list-amount li .data-numb .count-box { position: relative; }

.pop-inner .group-data .list-amount li .data-numb .count-box span { color: #2233b6; }

.pop-inner .group-data .list-amount li .data-numb .count-box span.count { display: block; overflow: hidden; margin-right: 37px; font-size: 36px; font-weight: 500; text-align: right; line-height: 43px; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 0s; animation-delay: 0s; }

.pop-inner .group-data .list-amount li .data-numb .count-box span.unit { display: block; position: absolute; right: 0; bottom: 8px; width: 34px; margin-left: 3px; text-align: left; font-weight: 700; }

.map-position { position: absolute; width: 393px; height: 168px; padding: 24px; border-radius: 4px; box-shadow: 0 10px 20px 0 rgba(34, 51, 182, 0.23); border: solid 2px #2233b6; background-color: #ffffff; }

.map-position .title { position: relative; margin: 0 0 10px 0; }

.map-position .title a { display: inline-block; padding-right: 12px; font-size: 14px; font-weight: 700; line-height: 20px; background: url(/webImages/btn-table-list-arrow-1.svg) 100% 3px no-repeat; background-size: 7px 11px; }

.map-position .title span { position: absolute; display: inline-block; padding-left: 13px; color: #999; line-height: 20px; }

.map-position .title span::before { content: ''; position: absolute; left: 6px; top: 5px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.map-position .inner .list-tower li { overflow: hidden; padding: 13px 0; letter-spacing: -0.01em; border-bottom: 1px solid #efefef; }

.map-position .inner .list-tower li .ttl { float: left; width: 180px; padding-left: 24px; font-size: 14px; line-height: 20px; }

.map-position .inner .list-tower li .ttl.type01 { background: url(/webImages/icon-title-electricity.svg) 0 0 no-repeat; background-size: 18px 18px; }

.map-position .inner .list-tower li .ttl.type02 { background: url(/webImages/icon-title-usage.svg) 0 0 no-repeat; background-size: 18px 18px; }

.map-position .inner .list-tower li .ttl.type03 { background: url(/webImages/icon-appraisal-usage.svg) 0 0 no-repeat; background-size: 18px 18px; }

.map-position .inner .list-tower li .data-numb { float: left; line-height: 19px; }

.map-position .inner .list-tower li .data-numb .count-box { display: inline-block; }

.map-position .inner .list-tower li .data-numb .count-box span.num { font-size: 16px; font-weight: 500; }

.map-position .inner .list-tower li .data-numb .count-box span.unit { margin-left: 2px; }

.map-position .inner .list-tower li .data-numb .percent { display: inline-block; margin-left: 8px; padding-right: 10px; }

.map-position .inner .list-tower li .data-numb .percent.up { color: #fa4443; background: url(/webImages/icon-rise.svg) 100% 0 no-repeat; background-size: 8px 15px; }

.map-position .inner .list-tower li .data-numb .percent.dn { color: #2c9dff; background: url(/webImages/icon-decline.svg) 100% 0 no-repeat; background-size: 8px 15px; }

.map-position .inner .list-tower li .data-numb .percent strong { font-size: 16px; font-weight: 500; }

.map-position .inner .list-tower li:last-child { border-bottom: 0; }

.map-area { float: left; width: calc(100% - 536px); height: 270px; }

.mini-map { float: left; width: 472px; padding: 30px 24px 0 40px; }

.mini-map .title { position: relative; padding-bottom: 19px; }

.mini-map .title a { display: inline-block; padding-right: 12px; font-size: 20px; font-weight: 500; line-height: 29px; background: url(/webImages/btn-title-arrow-big.svg) 100% 6px no-repeat; background-size: 8px 13px; }

.mini-map .title span { display: block; color: #999; line-height: 18px; }

.mini-map .inner .list-tower li { overflow: hidden; padding: 11px 0; letter-spacing: -0.01em; border-bottom: 1px solid #efefef; }

.mini-map .inner .list-tower li .ttl { float: left; width: 180px; padding-left: 24px; font-size: 14px; line-height: 20px; }

.mini-map .inner .list-tower li .ttl.type01 { background: url(/webImages/icon-title-electricity.svg) 0 0 no-repeat; background-size: 18px 18px; }

.mini-map .inner .list-tower li .ttl.type02 { background: url(/webImages/icon-title-usage.svg) 0 0 no-repeat; background-size: 18px 18px; }

.mini-map .inner .list-tower li .ttl.type03 { background: url(/webImages/icon-appraisal-usage.svg) 0 0 no-repeat; background-size: 18px 18px; }

.mini-map .inner .list-tower li .data-numb { float: left; line-height: 19px; }

.mini-map .inner .list-tower li .data-numb .count-box { display: inline-block; }

.mini-map .inner .list-tower li .data-numb .count-box span.num { font-size: 16px; font-weight: 500; }

.mini-map .inner .list-tower li .data-numb .count-box span.unit { margin-left: 2px; }

.mini-map .inner .list-tower li .data-numb .percent { display: inline-block; margin-left: 8px; padding-right: 10px; }

.mini-map .inner .list-tower li .data-numb .percent.up { color: #fa4443; background: url(/webImages/icon-rise.svg) 100% 0 no-repeat; background-size: 8px 15px; }

.mini-map .inner .list-tower li .data-numb .percent.dn { color: #2c9dff; background: url(/webImages/icon-decline.svg) 100% 0 no-repeat; background-size: 8px 15px; }

.mini-map .inner .list-tower li .data-numb .percent strong { font-size: 16px; font-weight: 500; }

.mini-map .inner .list-tower li:last-child { border-bottom: 0; }

/* #####################LOGIN##################### */
/* Login MemberShip */
.login-area { min-width: 1440px; display: -webkit-box; display: flex; background-color: #eff1f7; text-align: center; }

.login-area > .half { width: 560px; margin: 0 auto; /* main login */ }

.login-area > .half .pos-l { display: block; }

.login-area > .half .pos-l .logo a img { width: 23px; height: 21px; }

.login-area > .half .text { display: block; clear: both; width: 100%; font-size: 24px; line-height: 34px; letter-spacing: -0.015em; font-weight: 300; }

.login-area > .half .text strong { font-weight: 500; }

.login-area > .half > img { display: block; width: 560px; height: 588px; }

.login-area > .half.main-left { position: fixed; top: 0; right: 50%; bottom: 0; left: 0; width: 50%; background: #fff; }

.login-area > .half.main-left .inner { position: absolute; width: 510px; right: 130px; }

.login-area > .half.main-left .inner .login-box { margin: 58px auto 0; }

.login-area > .half.main-left .inner .login-box .logo { text-align: left; }

.login-area > .half.main-left .inner .text { margin: 23px auto 0; text-align: left; font-size: 24px; line-height: 34px; letter-spacing: -0.02em; font-weight: 300; }

.login-area > .half.main-left .inner .text strong { font-weight: 500; }

.login-area > .half.main-right { margin: 320px 0 0 50%; }

.login-area > .half.main-right .login-box { overflow: hidden; width: 480px; margin: 0 120px; }

.login-area > .half.main-right .login-box .inner { position: relative; }

.login-area > .half.main-right .login-box .inner .title { padding-bottom: 5px; text-align: left; font-size: 36px; font-weight: 500; letter-spacing: -0.02em; line-height: 43px; }

.login-area > .half.main-right .login-box .inner .save-id { position: absolute; top: 25px; right: 0; }

.login-area > .half.main-right .login-box .inner .input-boxs .form-wrap { margin-top: 10px; }

.login-area > .half.main-right .login-box .inner .input-boxs .form-wrap .input-wrap .outline { border-radius: 0; }

.login-area > .half.main-right .btn-area .find-join { position: relative; margin-top: 48px; text-align: left; font-size: 14px; }

.login-area > .half.main-right .btn-area .find-join .find { color: #999; }

.login-area > .half.main-right .btn-area .find-join .find a::before { content: ' '; display: inline-block; width: 1px; height: 8px; margin-left: 8px; padding-left: 8px; border-left: 1px solid #dcdcdc; }

.login-area > .half.main-right .btn-area .find-join .find a:first-child::before { display: none; }

.login-area > .half.main-right .btn-area .find-join .join { position: absolute; top: 7px; right: 0; }

.login-area > .half.main-right .btn-area .find-join .join span { margin-right: 2px; vertical-align: middle; }

.login-area .full-back { width: 480px; margin: 120px auto 0; letter-spacing: -0.01em; }

.login-area .full-back h2 { padding: 10px 0 10px; }

.login-area .full-back h3 { margin: 80px 0 18px; font-size: 20px; line-height: 22px; font-weight: 700; }

.login-area .full-back.error { position: fixed; width: 620px; height: 100%; left: 50%; top: 0; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); margin: 0; box-sizing: border-box; padding-top: 16vh; }

.login-area .full-back.error .text { margin-bottom: 18px; color: #222; }

.login-area .full-back.error .text.add { letter-spacing: 0; color: #666; }

.login-area .full-back.error .text.add strong { margin-left: 5px; font-weight: 500; }

.login-area .full-back .copy { position: absolute; width: 100%; bottom: 55px; text-align: center; /* margin:213px 0 55px; font-size:14px; line-height:17px; text-align:center; color:#999; */ }

.login-area h2 { padding: 10px 0 4px; font-size: 30px; font-weight: 700; }

.login-area p.text { margin-bottom: 36px; font-size: 14px; line-height: 22px; letter-spacing: -0.05em; color: #666; }

.login-area .find-id .form-wrap { margin-top: 8px; }

.login-area .find-id .form-wrap .input-wrap .outline.single { width: 356px; height: 48px; background: #fff; border-radius: 0; }

.login-area .find-id .form-wrap .input-wrap .outline.single input { height: 48px; font-size: 16px; }

.login-area .find-id .form-wrap .input-wrap .outline.single .right [class^=ui-btn-] { width: 116px; text-align: center; padding: 0; }

.login-area .find-id .form-wrap lebel.none { display: none; }

.login-area .btn-area { margin-top: 16px; }

.login-area .btn-area.half { display: -webkit-box; display: flex; margin-top: 32px; text-align: center; }

.login-area .btn-area.half a { width: calc(50% - 5px); }

.login-area .btn-area.half a:last-child { margin-left: 10px; }

.login-area .btn-area.line { text-align: center; border-top: 1px solid #efefef; }

.login-area .result-box { padding: 34px; margin-top: 36px; border: 1px solid #2233b6; border-radius: 4px; line-height: 22px; }

.login-area .result-box span { display: block; font-size: 16px; }

.login-area .result-box strong { display: block; margin-top: 8px; font-size: 22px; font-weight: 500; }

.login-area .other-box { margin-top: 12px; text-align: center; }

.login-area .other-box span { font-size: 14px; line-height: 18px; vertical-align: middle; color: #666; }

.login-area .other-box span.join { color: #666; }

.login-area .other-box a::before { content: ' '; display: inline-block; width: 1px; height: 8px; margin-left: 8px; padding-left: 8px; border-left: 1px solid #dcdcdc; }

.login-area .other-box a.ui-btn-gray { font-size: 14px; color: #999; }

.login-area .other-box a.ui-btn-gray:first-child::before { content: ' '; width: 0; height: 0; margin-left: 0; padding-left: 0; border-left: none; }

.login-area .other-box .ui-svg-size18x18-icon-membership { margin: -4px 2px 0 0; }

.login-area .other-box .ui-svg-size18x18-icon-membership span { padding-left: 20px; color: #666; }

.login-area .other-box .ui-svg-size18x18-icon-e { margin: -4px 2px 0 0; }

/* Join-Us Containe */
.caution { line-height: 18px; color: #999; }

.caution .ui-svg-size4x4-icon-necessary { margin-right: 4px; vertical-align: middle; }

.container { /* Setting */ }

.container.join-us { padding-top: 0; }

.container.join-us .header { height: 320px; }

.container.join-us .header .logo { position: absolute; top: 13px; left: 18px; width: 24px; height: 24px; }

.container.join-us .header .logo img { width: 24px; height: 24px; }

.container.join-us .content { margin: 48px 96px 48px 96px; z-index: 301; }

.container .step-box { max-width: 1440px; margin: 0 auto; }

.container .step-box .step-area { position: relative; min-width: 1168px; max-width: 1440px; height: 28px; padding: 26px 40px; color: #fff; border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.12); background-color: #4b5057; }

.container .step-box .step-area h2 { font-size: 20px; letter-spacing: -0.02em; }

.container .step-box .step-area .list-step { position: absolute; top: 31px; right: 40px; }

.container .step-box .step-area .list-step li:nth-child(1) { padding-left: 28px; margin-left: 40px; float: left; font-size: 14px; line-height: 20px; font-weight: 500; /*background: url(/webImages/lnb-nol-1.svg) 0 0 no-repeat;*/ background-size: 20px 20px; }

.container .step-box .step-area .list-step li:nth-child(1).on { background: url(/webImages/lnb-sel-1.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .step-area .list-step li:nth-child(2) { padding-left: 28px; margin-left: 40px; float: left; font-size: 14px; line-height: 20px; font-weight: 500; background: url(/webImages/lnb-nol-2.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .step-area .list-step li:nth-child(2).on { background: url(/webImages/lnb-sel-2.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .step-area .list-step li:nth-child(3) { padding-left: 28px; margin-left: 40px; float: left; font-size: 14px; line-height: 20px; font-weight: 500; background: url(/webImages/lnb-nol-3.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .step-area .list-step li:nth-child(3).on { background: url(/webImages/lnb-sel-3.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .step-area .list-step li:nth-child(4) { padding-left: 28px; margin-left: 40px; float: left; font-size: 14px; line-height: 20px; font-weight: 500; background: url(/webImages/lnb-nol-4.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .step-area .list-step li:nth-child(4).on { background: url(/webImages/lnb-sel-4.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .step-area .list-step li.checked { background: url(/webImages/lnb-check.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .inner-area { min-width: 1168px; min-height: 610px; margin-top: 24px; padding: 40px 38px 40px 40px; border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); background-color: #fff; }

.container .step-box .inner-area h3 { margin: 48px 0 16px; font-size: 20px; font-weight: 700; line-height: 26px; letter-spacing: -0.01em; }

.container .step-box .inner-area h3 span { font-weight: 400; }

.container .step-box .inner-area .inn-box { padding-bottom: 36px; text-align: center; border-bottom: 1px solid #efefef; }

.container .step-box .inner-area .inn-box.none { border-bottom: 0; }

.container .step-box .inner-area .inn-box .min-box { width: 492px; margin: 0 auto; }

.container .step-box .inner-area .inn-box .min-box .ttl { margin-top: 24px; margin-bottom: 2px; text-align: left; letter-spacing: -0.06em; font-weight: 500; line-height: 18px; }

.container .step-box .inner-area .inn-box .min-box .ttl.is-required:after { content: ''; display: inline-block; vertical-align: top; margin: 7px 0 7px 6px; width: 4px; height: 4px; border-radius: 100%; background: #2233b6; }

.container .step-box .inner-area .inn-box .min-box > .ui-btn-underline-deepblue-xs-fw500-wp0 { margin-top: 20px; }

.container .step-box .inner-area .inn-box .min-box .text { font-size: 14px; line-height: 22px; margin-left: -10px; margin-right: -10px; }

.container .step-box .inner-area .inn-box > .ui-icon-big-member-check { margin-top: 8px; }

.container .step-box .inner-area .inn-box > .text { padding-bottom: 24px; font-size: 14px; line-height: 22px; letter-spacing: -0.01em; }

.container .step-box .inner-area .inn-box > .btn-area { margin-top: 16px; }

.container .step-box .inner-area .inn-box.update h3 { line-height: 28px; }

.container .step-box .inner-area.finished h4 { font-size: 16px; line-height: 24px; font-weight: 700; }

.container .step-box .inner-area.finished h4 span { margin-right: 4px; vertical-align: middle; position: relative; top: -3px; }

.container .step-box .inner-area.finished .upload { width: 910px; margin: 39px auto 0; }

.container .step-box .inner-area.finished .upload .upload-title { font-size: 20px; line-height: 22px; font-weight: 700; margin: 0 0 40px; }

.container .step-box .inner-area.finished .upload ol { overflow: hidden; }

.container .step-box .inner-area.finished .upload ol li { margin-top: 12px; font-size: 14px; color: #666; line-height: 22px; padding-left: 32px; }

.container .step-box .inner-area.finished .upload ol li:nth-child(1) { background: url(/webImages/list-num-1.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .inner-area.finished .upload ol li:nth-child(2) { background: url(/webImages/list-num-2.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .inner-area.finished .upload ol li:nth-child(3) { background: url(/webImages/list-num-3.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .inner-area.finished .upload ol li:nth-child(4) { background: url(/webImages/list-num-4.svg) 0 0 no-repeat; background-size: 20px 20px; }

.container .step-box .inner-area.finished .list-files { overflow: hidden; padding: 40px 0 60px; margin: 0 auto; width: 910px; }

.container .step-box .inner-area.finished .list-files li { float: left; width: calc(50% - 22px); margin-right: 44px; }

.container .step-box .inner-area.finished .list-files li h4 { padding-bottom: 7px; }

.container .step-box .inner-area.finished .list-files li:last-child { margin-right: 0; }

.container .step-box .inner-area.finished .list-files .dont-up { padding-top: 8px; font-size: 14px; color: #999; line-height: 20px; font-weight: 300; letter-spacing: -0.01em; }

.container .step-box .inner-area.finished .list-files .dont-up span { margin: -4px 12px 0 0; vertical-align: middle; }

.container .step-box .inner-area.finished .list-files + .btn-area { padding-top: 24px; border-top: 1px solid #efefef; }

.container .step-box .inner-area.finished .table-contents { margin-bottom: 40px; padding-bottom: 30px; border-bottom: 1px solid #efefef; }

.container .step-box .inner-area.finished .table-contents-inner { width: 910px; margin: 0 auto; }

.container .step-box .inner-area.finished .table-contents .table-tit { margin-bottom: 8px; }

.container .step-box .inner-area.finished .table-contents .table-tit .t1 { display: inline-block; vertical-align: top; padding-top: 4px; font-size: 12px; line-height: 18px; }

.container .step-box .inner-area.finished .table-contents .table-tit .t2 { display: inline-block; vertical-align: top; font-size: 20px; line-height: 22px; font-weight: 700; }

.container .step-box .inner-area.finished .inn-box { padding-bottom: 32px; border-bottom: none; margin-bottom: 0; }

.container .step-box .inner-area.user-data .inn-box { position: relative; padding-bottom: 60px; text-align: left; }

.container .step-box .inner-area.user-data .inn-box .title-box { position: absolute; top: 0; left: 0; }

.container .step-box .inner-area.user-data .inn-box .title-box h3 { margin: 0 0 5px 0; }

.container .step-box .inner-area.user-data .inn-box.last { margin: 60px 0 24px; padding-bottom: 0; }

.container .step-box .inner-area.user-data .inn-box.last .data-box { padding-bottom: 60px; }

.container .step-box .inner-area.user-data .inn-box.last.report { padding-bottom: 0; }

.container .step-box .inner-area.user-data .inn-box.single { margin-bottom: 24px; }

.container .step-box .btn-area { text-align: center; }

.container .step-box .btn-area a { margin: 0 5px; }

.container .step-box .agree-box h4 { margin: 0 0 10px 0; font-size: 16px; line-height: 22px; font-weight: 700; }

.container .step-box .agree-box .prov-box { overflow-y: auto; height: 76px; padding: 8px 16px; border-radius: 4px; border: solid 1px #dadadb; background-color: #ffffff; }

.container .step-box .agree-box .form-wrap { padding: 10px 0 40px; }

.container .step-box .agree-all { padding: 12px 0 60px; border-top: 1px solid #efefef; }

.container .data-box { margin-left: 260px; clear: both; }

.container .data-box h4 { font-size: 16px; line-height: 24px; font-weight: 700; }

.container .data-box h4 span { margin-right: 4px; vertical-align: middle; background-position: 0 -2px; }

.container .data-box h4 .edit { margin-left: 8px; font-size: 12px; line-height: 16px; color: #2233b6; text-decoration: underline; vertical-align: middle; }

.container .data-box h4 .edit span { margin-right: 0; }

.container .data-box h4 .ui-svg-size16x16-icon-btn-edit { margin-top: -2px; }

.container .data-box .form-wrap { max-width: 520px; padding-top: 24px; }

.container .data-box .form-wrap .input-wrap { margin-bottom: 8px; }

.container .data-box .form-wrap.dual { overflow: hidden; width: 520px; }

.container .data-box .form-wrap.dual .input-wrap { float: left; width: 240px; margin-right: 6px; }

.container .data-box .form-wrap.dual .input-wrap:last-child { margin-right: 0; }

.container .data-box .form-wrap.dual .input-wrap input { font-size: 12px; }

.container .data-box .form-wrap.dual .input-wrap:nth-child(even) { width: 254px; }

.container .data-box .form-wrap.trisect { min-height: 62px; max-width: 100%; clear: both; }

.container .data-box .form-wrap.trisect .input-wrap { float: left; width: 240px; margin-right: 20px; }

.container .data-box .form-wrap.trisect .input-wrap:last-child { margin-right: 0; }

.container .data-box .form-wrap.trisect .input-wrap.min { width: 130px; }

.container .data-box .form-wrap .warning { padding: 0 0 12px; color: #ff3e47; line-height: 14px; }

.container .data-box .infom { line-height: 18px; color: #999; }

.container .data-box .infom.solo { position: relative; max-width: 640px; }

.container .data-box .infom.solo .form-wrap { position: absolute; top: -25px; right: 0; padding-top: 0; }

.container .data-box .infom.solo .form-wrap.add label { position: absolute; top: 6px; right: 48px; width: 50px; }

.container .data-box .infom.solo .slide { height: 32px; }

.container .data-box .infom.solo .slide .ico { margin: 0 0 0 0; width: 44px; height: 32px; }

.container .data-box .infom.solo .slide [type=checkbox] + .ico { background: url(/webImages/btn-toggle-off.svg) no-repeat 0 0; background-size: 44px 32px; }

.container .data-box .infom.solo .slide [type=checkbox]:checked + .ico { background-image: url(/webImages/btn-toggle-on.svg); }

.container .user-simple { height: 49px; vertical-align: middle; }

.container .user-simple .ui-svg-size24x24-icon-member { vertical-align: bottom; }

.container .user-simple strong { font-size: 14px; letter-spacing: -0.01em; line-height: 20px; font-weight: 700; }

.container .user-simple span { display: inline-block; }

.container .user-simple span.type { margin-left: 8px; color: #999; }

.container .user-simple span.type::before { content: ' '; display: inline-block; margin-right: 8px; width: 1px; height: 8px; background: #dcdcdc; }

.container .lnb-area { position: relative; padding-bottom: 40px; margin-bottom: 60px; }

.container .lnb-area .lnb-box { position: absolute; top: 0; left: 0; width: 224px; }

.container .lnb-area .lnb-box ul li { margin-right: 24px; }

.container .lnb-area .lnb-box ul li a { display: block; height: 36px; padding: 0 20px; font-size: 14px; line-height: 36px; color: #222; }

.container .lnb-area .lnb-box ul li a:hover, .container .lnb-area .lnb-box ul li a.on { font-weight: 700; color: #2233b6; border-radius: 4px; background: #e9f5ff url(/webImages/icon-setting-arrow.svg) 90% 50% no-repeat; }

.container .lnb-area .inner-cont { position: relative; min-height: 570px; margin-left: 224px; padding-left: 36px; border-left: 6px solid #fafafa; }

.container .lnb-area .inner-cont .title { margin-bottom: 36px; }

.container .lnb-area .inner-cont .title h3 { margin-bottom: 8px; font-size: 20px; line-height: 22px; letter-spacing: -0.01em; font-weight: 700; }

.container .lnb-area .inner-cont .title h3 span { vertical-align: middle; }

.container .lnb-area .inner-cont .title h3 .edit { margin-left: 18px; font-size: 12px; line-height: 16px; color: #2233b6; text-decoration: underline; vertical-align: middle; }

.container .lnb-area .inner-cont .title h3 .ui-svg-size16x16-icon-btn-edit { margin-top: -7px; }

.container .lnb-area .inner-cont .data-box { margin-left: 0; margin-top: 60px; }

.container .lnb-area .inner-cont .data-box .form-wrap { max-width: 500px; }

.container .lnb-area .inner-cont .data-box .form-wrap.trisect { min-height: 62px; max-width: 100%; }

.container .lnb-area .inner-cont .data-box.first { margin-top: 36px; }

.container .lnb-area .inner-cont .data-box .result-wrap { overflow: hidden; margin-top: 24px; }

.container .lnb-area .inner-cont .data-box .result-wrap dl { float: left; width: 140px; padding-right: 20px; }

.container .lnb-area .inner-cont .data-box .result-wrap dl dt { margin-bottom: 4px; line-height: 18px; color: #666; }

.container .lnb-area .inner-cont .data-box .result-wrap dl dd { font-size: 14px; line-height: 17px; }

.container .lnb-area .inner-cont .data-box .result-wrap dl dd strong { font-weight: 500; }

.container .lnb-area .inner-cont .data-box .result-wrap dl dd sup { font-size: 8px; }

.container .lnb-area .btn-area { margin-top: 60px; }

.container .lnb-area .btn-area.line { padding-top: 24px; text-align: center; border-top: 1px solid #efefef; }

.container .lnb-area .btn-area a { margin: 0 5px; }

.container .lnb-area .btn-area.alarm { max-width: 680px; margin-top: 24px; text-align: center; }

.container .alarm-area { max-width: 608px; padding: 24px 36px; margin-top: 16px; border-radius: 4px; }

.container .alarm-area.line { border: 1px solid #e5e5e5; }

.container .alarm-area .binary { position: relative; padding-bottom: 20px; margin-top: 20px; border-bottom: 1px solid #efefef; }

.container .alarm-area .binary .inn { margin-right: 50px; }

.container .alarm-area .binary .inn h5 { margin-bottom: 2px; font-size: 14px; font-weight: 500; line-height: 20px; letter-spacing: -0.15px; }

.container .alarm-area .binary .inn .inform { color: #666; line-height: 18px; }

.container .alarm-area .binary .inn .inform .sub { color: #999; }

.container .alarm-area .binary .inn .inform .max-set { overflow: hidden; margin-top: 8px; }

.container .alarm-area .binary .inn .inform .max-set b { font-weight: 400; color: #666; }

.container .alarm-area .binary .inn .inform .max-set strong { margin-left: 6px; margin-right: 8px; font-size: 14px; color: #666; font-weight: 500; vertical-align: middle; }

.container .alarm-area .binary .inn .inform .max-set strong em { font-weight: 400; }

.container .alarm-area .binary .inn .inform .max-set .left { float: left; }

.container .alarm-area .binary .inn .inform .max-set .left .form-wrap { display: inline-block; width: 90px; margin: 0 8px 0 12px; }

.container .alarm-area .binary .inn .inform .max-set .left .form-wrap .input-wrap .outline { height: 26px; padding-right: 40px; }

.container .alarm-area .binary .inn .inform .max-set .left .form-wrap .input-wrap .outline input { height: 26px; line-height: 26px; }

.container .alarm-area .binary .inn .inform .max-set .right { float: left; margin-left: 60px; line-height: 26px; }

.container .alarm-area .binary .inn .inform .max-set .right span { color: #666; vertical-align: middle; }

.container .alarm-area .binary .inn .inform .max-set .right span.date { color: #999; }

.container .alarm-area .binary .inn .inform .max-set .right span.date::before { content: ' '; display: inline-block; margin-right: 8px; width: 1px; height: 8px; background-color: #dcdcdc; }

.container .alarm-area .binary .inn .inform .max-set .form-wrap { padding-top: 0; }

.container .alarm-area .binary .inn > .form-wrap { position: absolute; top: 10px; right: 0; width: 50px; padding-top: 0; }

.container .alarm-area .binary .inn > .form-wrap .slide { height: 32px; }

.container .alarm-area .binary .inn > .form-wrap .slide .ico { margin: 0 0 0 0; width: 44px; height: 32px; }

.container .alarm-area .binary .inn > .form-wrap .slide [type=checkbox] + .ico { background: url(/webImages/btn-toggle-off.svg) no-repeat 0 0; background-size: 44px 32px; }

.container .alarm-area .binary .inn > .form-wrap .slide [type=checkbox]:checked + .ico { background-image: url(/webImages/btn-toggle-on.svg); }

.container .alarm-area .binary:first-child { margin-top: 0; }

.container .alarm-area .binary:last-child { border-bottom: 0; padding-bottom: 0; }

.container .alarm-area .binary .form-wrap.dual { width: 100%; max-width: 100%; padding-top: 0; overflow: hidden; }

.container .alarm-area .binary .form-wrap.dual .input-wrap { float: left; width: 240px; margin-right: 6px; }

.container .alarm-area .binary .form-wrap.dual .input-wrap:last-child { margin-right: 0; }

.container .alarm-area .binary .form-wrap.dual .input-wrap input { font-size: 12px; }

.container .alarm-area .binary .form-wrap.dual .input-wrap:nth-child(even) { width: 360px; margin-right: 0; }

.container .alarm-area .binary .alaram-list { overflow: hidden; }

.container .alarm-area .binary .alaram-list li { float: left; width: 33.3%; margin-top: 16px; }

.container .alarm-area .binary .alaram-list li span { margin-right: 16px; font-size: 14px; font-weight: 500; color: #666; }

.container .alarm-area .binary .alaram-list li:nth-child(1) { margin-top: 0; }

.container .alarm-area .binary .alaram-list li:nth-child(2) { margin-top: 0; }

.container .alarm-area .binary .alaram-list li:nth-child(3) { margin-top: 0; }

@media screen and (max-width: 1440px) { .login-area > .half.main-left { position: absolute; width: 720px; } }

body { background: #eff1f7; }

body.f .header { height: 127px; z-index: 300; }

body.f .header .quick { top: 157px; }

.wrap { min-width: 1440px; }

.header { position: fixed; left: 0; top: 0; width: 100%; min-width: 1440px; height: 200px; background: #3e4248; }

.header .state { height: 50px; border-bottom: 1px solid #36393e; }

.header .state .pos-l { position: absolute; left: 0; top: 0; }

.header .state .pos-r { position: absolute; right: 0; top: 0; }

.header .state .logo a, .header .state .logo button { display: inline-block; padding: 13px 18px 9px 18px; }

.header .state .logo a img, .header .state .logo button img { width: 24px; height: 24px; }

.header .state .date-time { padding: 15px 30px 0 0; vertical-align: top; display: inline-block; color: #a7afb9; }

.header .state .date-time img, .header .state .date-time span { display: inline-block; vertical-align: middle; }

.header .state .date-time img { width: 18px; height: 18px; margin-right: 2px; }

.header .state .date-time [class^=ui-svg] { margin-right: 2px; }

.header .state .date-time .dash { position: relative; top: -1px; margin: 0 2px; display: inline-block; width: 1px; height: 8px; opacity: .5; background-color: #a7afb9; }

.header .state .temperature { padding: 15px 40px 0 0; vertical-align: top; display: inline-block; color: #a7afb9; }

.header .state .temperature img, .header .state .temperature span { display: inline-block; vertical-align: middle; }

.header .state .temperature img { width: 18px; height: 18px; margin-right: 2px; }

.header .state .notice { position: relative; vertical-align: top; display: inline-block; width: 50px; height: 50px; border-left: 1px solid #36393e; }

.header .state .notice .icon { position: absolute; left: 14px; top: 16px; }

.header .state .notice .icon img { width: 22px; height: 22px; }

.header .state .notice .icon.alarm::after { content: ''; position: absolute; right: 0; top: -1px; width: 5px; height: 5px; background: url(/webImages/icon-notice-mark.svg) no-repeat 0 0; background-size: 5px 5px; }

.header .state .group { display: inline-block; padding-right: 40px; height: 18px; margin-top: 16px; }

.header .state .group ul { position: relative; }

.header .state .group .status-date { display: inline-block; font-size: 12px; color: #a7afb9; height: 18px; vertical-align: middle; }

.header .state .group .status-date .day { font-weight: 300; }

.header .state .group .status-date [class^=ui-svg] { position: relative; top: -1px; margin: 0 2px 0 0; vertical-align: middle; }

.header .state .group .status-rolling { display: inline-block; font-size: 12px; font-weight: 300; color: #a7afb9; height: 18px; overflow: hidden; vertical-align: middle; }

.header .state .group .status-rolling li { height: 18px; }

.header .state .group .status-rolling .city { display: inline-block; width: 99px; }

.header .state .group .status-rolling .city::before { content: ''; display: inline-block; margin: 0 4px; width: 0; height: 8px; border-left: 1px solid #a7afb9; opacity: .5; }

.header .state .group .status-rolling .address { display: inline-block; margin-right: 30px; vertical-align: top; }

.header .state .group .status-rolling .t { display: inline-block; text-align: right; width: 32px; }

.header .state .group .status-rolling .h { display: inline-block; text-align: right; width: 26px; }

.header .state .group .status-rolling [class^=ui-svg] { position: relative; top: -1px; margin: 0 2px 0 0; vertical-align: middle; }

.header .page-info { height: 76px; position: relative; }

.header .page-info .nav > a { display: inline-block; padding: 24px 18px; }

.header .page-info .nav > a img { width: 24px; height: 24px; }

.header .page-info .breadcrumbs { position: absolute; left: 96px; top: 0; padding: 17px 0 0 0; }

.header .page-info .breadcrumbs .btn-back { display: inline-block; vertical-align: middle; }

.header .page-info .breadcrumbs .btn-back a, .header .page-info .breadcrumbs .btn-back button { display: inline-block; height: 38px; box-sizing: border-box; padding: 7px 24px 7px 0; }

.header .page-info .breadcrumbs .btn-back img { width: 24px; height: 24px; }

.header .page-info .breadcrumbs .tit { display: inline-block; vertical-align: middle; padding-top: 4px; font-size: 26px; line-height: 34px; letter-spacing: -.46px; color: #fff; }

.header .page-info .breadcrumbs .selector { padding: 0 20px 0 30px; display: inline-block; height: 38px; vertical-align: middle; }

.header .page-info .breadcrumbs .selector a, .header .page-info .breadcrumbs .selector button { position: relative; display: inline-block; background: #303337; height: 38px; line-height: 40px; color: #fff; border-radius: 4px; width: 210px; text-indent: 12px; overflow: hidden; font-size: 14px; }

.header .page-info .breadcrumbs .selector a::after, .header .page-info .breadcrumbs .selector button::after { content: ''; position: absolute; right: 9px; top: 17px; display: block; width: 10px; height: 6px; background: url(/webImages/btn-dropdwoun-arrow.svg) no-repeat 0 0; background-size: 10px 6px; }

.header .page-info .breadcrumbs .selector select { height: 38px; line-height: 38px; color: #fff; background: #303337; border-color: #303337; border-radius: 4px; padding: 0 0 0 12px; }

.header .page-info .breadcrumbs .status { display: inline-block; height: 34px; vertical-align: middle; line-height: 34px; font-size: 14px; color: #fff; font-weight: 300; padding: 4px 0 0 19px; position: relative; }

.header .page-info .breadcrumbs .status:before { content: ''; display: block; position: absolute; top: 18px; left: 9px; height: 10px; border-left: 1px solid #737577; }

.header .page-info .breadcrumbs .status span { vertical-align: middle; }

.header .page-info .breadcrumbs .status .icon { margin: 0 5px 0 0; }

.header .page-info .breadcrumbs .status .icon img { vertical-align: middle; width: 18px; height: 18px; }

.header .page-info .breadcrumbs .status .text01 { opacity: .7; }

.header .page-info .breadcrumbs .status .count { font-weight: 500; }

.header .page-info .breadcrumbs .status.under { position: relative; top: 4px; height: 18px; line-height: 18px; }

.header .page-info .breadcrumbs .status.under::before { content: ''; margin: 0 10px 0 10px; display: inline-block; width: 0px; height: 10px; border-right: 1px solid #979797; opacity: .6; vertical-align: middle; }

.header .page-info .breadcrumbs .tab { margin: 0 0 0 30px; display: inline-block; vertical-align: middle; border-radius: 4px; overflow: hidden; }

.header .page-info .breadcrumbs .tab a { float: left; line-height: 36px; width: 100px; text-align: center; height: 36px; font-size: 14px; font-weight: 300; letter-spacing: -0.1px; color: #98999c; background: #323439; }

.header .page-info .breadcrumbs .tab a.current { font-weight: 700; color: #fff; background: #4b5057; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.17); }

.header .page-info .breadcrumbs .tab a.w150 { width: 150px; }

.header .page-info .breadcrumbs .tab.is-dashboard a.current { color: #222; background-color: #fff; }

.header .page-info .path { position: absolute; right: 36px; top: 30px; }

.header .page-info .path a { font-size: 14px; font-weight: 300; letter-spacing: -0.1px; color: #fff; opacity: .7; vertical-align: middle; }

.header .page-info .path a::before { content: ''; margin: 0 4px 0 6px; display: inline-block; width: 5px; height: 9px; background: url(/webImages/icon-lnb-arrow.svg) no-repeat 0 0; background-size: 5px 9px; }

.header .page-info .path a.home [class^=ui-svg] { position: relative; top: 1px; width: 12px; }

.header .page-info .path a.home img { position: relative; top: 1px; width: 12px; }

.header .page-info .path a.home::before { display: none; }

.header .page-info .map { padding: 20px 32px 0 0; }

.header .page-info .map a, .header .page-info .map button { display: inline-block; height: 36px; line-height: 36px; padding: 0 12px; background: #303337; border-radius: 4px; font-weight: 300; letter-spacing: -1px; color: #fff; font-size: 14px; }

.header .page-info .map a [class^=ui-svg], .header .page-info .map button [class^=ui-svg] { margin: -2px 4px 0 0; vertical-align: middle; width: 10px; height: 13px; }

.header .page-info .map a img, .header .page-info .map button img { margin: -2px 4px 0 0; vertical-align: middle; width: 10px; height: 13px; }

.header .page-info .info-weather { width: 320px; padding: 15px 36px 0 0; }

.header .page-info .info-weather .group01 { display: inline-block; margin: 0 20px 0 0; }

.header .page-info .info-weather .group01 .icon { margin: 0 6px 0 0; }

.header .page-info .info-weather .group01 .icon [class^=ui-svg] { width: 40px; height: 40px; vertical-align: top; }

.header .page-info .info-weather .group01 .icon img { width: 40px; height: 40px; vertical-align: top; }

.header .page-info .info-weather .group01 .text01 { font-size: 36px; font-weight: 500; color: #fff; }

.header .page-info .info-weather .group01 .text02 { font-size: 14px; font-weight: 500; color: #fff; }

.header .page-info .info-weather .group02 { display: inline-block; }

.header .page-info .info-weather .group02 .block { display: block; }

.header .page-info .info-weather .group02 .text01 { font-size: 12px; font-weight: 300; color: #fff; }

.header .page-info .info-weather .group02 .text02 { font-size: 12px; font-weight: 500; color: #fff; }

.header .page-info .info-weather .group02 .dash { margin: 0 5px; display: inline-block; width: 0px; height: 8px; border-right: 1px solid #fff; opacity: 0.3; -webkit-transform: rotate(15deg); transform: rotate(15deg); }

.header .page-info .pos-r { position: absolute; right: 0; top: 0; }

.header .page-info .pos-r:after { content: ''; display: table; clear: both; }

.header .page-info .pos-r .breadcrumbs { position: relative; left: auto; top: auto; float: left; }

.header .page-info .pos-r .breadcrumbs + .map { float: left; margin-left: 20px; }

.page-info-left { right: 145px; }
.page-info-flex { display: table; width: 100%; max-width: 100%; }
.page-info-right-cell { display: table-cell; width: 1px; white-space: nowrap; box-sizing: content-box; vertical-align: top; }
.page-info-right-cell:before { content: ''; display: table; }
.page-info-right-cell.is-flexible { width: auto; }
.page-info-right-cell .notice-text-wrap { margin: 3px 25px 0; }
.page-info-right-cell .weather-block { margin-top: 3px; }

.notice-text-wrap { position: relative; height: 36px; }
.notice-text { position: absolute; top: 0; left: 0; width: 100%; overflow: hidden; border-radius: 4px; background: rgba(48, 51, 55, 0.5); font-size: 0; line-height: 0; white-space: nowrap; text-align: center; }
.notice-text-inner { position: relative; display: inline-block; vertical-align: top; padding: 8px 16px; font-size: 14px; line-height: 20px; color: #fff; font-weight: 700; opacity: 0; }

.weather-block { font-size: 0; line-height: 0; white-space: nowrap; }
.weather-block-celsius,
.weather-block-right { display: inline-block; vertical-align: top; }
.weather-block-celsius + .weather-block-right { margin-left: 20px; }
.weather-block-celsius { font-size: 14px; line-height: 20px;  color: #fff; font-weight: 500; padding: 13px 0 3px 46px; background: no-repeat 0 50%; }
.weather-block-celsius em { display: inline-block; vertical-align: top; font-style: normal; font-size: 36px; line-height: 43px; font-weight: 500; margin: -15px 2px -8px 0; }
.weather-block-celsius.type-01 { background-image: url('/webImages/icon-weather-big-01.svg'); }
.weather-block-celsius.type-02 { background-image: url('/webImages/icon-weather-big-02.svg'); }
.weather-block-celsius.type-03 { background-image: url('/webImages/icon-weather-big-03.svg'); }
.weather-block-celsius.type-04 { background-image: url('/webImages/icon-weather-big-04.svg'); }
.weather-block-celsius.type-05 { background-image: url('/webImages/icon-weather-big-05.svg'); }
.weather-block-celsius.type-06 { background-image: url('/webImages/icon-weather-big-06.svg'); }
.weather-block-right { font-size: 12px; line-height: 18px; font-weight: 300; color: #fff; }
.weather-block-min-max-celsius em { display: inline-block; vertical-align: top; font-style: normal; font-weight: 500; }

.header .quick { position: absolute; left: 0; top: 230px; width: 60px; padding: 0 10px; box-sizing: border-box; }

.header .quick a { display: block; width: 40px; height: 40px; padding: 9px; box-sizing: border-box; margin: 0 auto 20px auto; }

.header .quick a.dasboard { background: url(/webImages/btn-dasboard-nor.svg) no-repeat center center; }

.header .quick a.dasboard.current { background-image: url(/webImages/btn-dasboard-sel.svg); }

.header .quick a.analysis { background: url(/webImages/btn-analysis-nor.svg) no-repeat center center; }

.header .quick a.analysis.current { background-image: url(/webImages/btn-analysis-sel.svg); }

.header .quick a.report { background: url(/webImages/btn-report-nor.svg) no-repeat center center; }

.header .quick a.report.current { background-image: url(/webImages/btn-report-sel.svg); }

.header .quick a.groupmanage { background: url(/webImages/btn-groupmanage-nor.svg) no-repeat center center; }

.header .quick a.groupmanage.current { background-image: url(/webImages/btn-groupmanage-sel.svg); }

.header .quick a.customermanage { background: url(/webImages/btn-customermanage-nor.svg) no-repeat center center; }

.header .quick a.customermanage.current { background-image: url(/webImages/btn-customermanage-sel.svg); }

.header .quick a.current { background-color: #2628b9; border-radius: 4px; }

.header .quick a:last-of-type { margin-bottom: 0; }

.qube { position: relative; min-width: 1308px; height: 280px; margin-top: -73px; margin-bottom: 50px; z-index: 20; -webkit-transition: height .5s, left .5s; transition: height .5s, left .5s; }

.qube [class^=block] { position: relative; border-radius: 4px; background: #fff; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); overflow: hidden; -webkit-transition: .5s; transition: .5s; }

.qube [class^=block] .title { position: absolute; top: 25px; left: 24px; }

.qube [class^=block] .title span { display: inline-block; }

.qube [class^=block] .title .icon { margin: 0 8px 0 0; vertical-align: middle; }

.qube [class^=block] .title .icon [class^=ui-svg] { vertical-align: top; width: 18px; height: 18px; }

.qube [class^=block] .title .icon img { vertical-align: top; width: 18px; height: 18px; }

.qube [class^=block] .title .text { vertical-align: middle; font-size: 14px; letter-spacing: -0.12px; color: #222; font-weight: 700; }

.qube [class^=block] .title .date { position: relative; padding-left: 13px; vertical-align: bottom; font-size: 12px; letter-spacing: -0.1px; color: #999; }

.qube [class^=block] .title .date::before { content: ''; position: absolute; left: 6px; top: 5px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.qube [class^=block] .figure { position: absolute; top: 74px; left: 24px; }

.qube [class^=block] .figure > div:nth-of-type(2) { margin-top: -5px; }

.qube [class^=block] .figure .text01 { margin: 0 2px 0 0; font-size: 50px; font-weight: 500; color: #222; }

.qube [class^=block] .figure .text02 { font-size: 12px; font-weight: 500; color: #222; }

.qube [class^=block] .figure .text03 { font-size: 12px; font-weight: 700; color: #222; }

.qube [class^=block] .figure .text04 { font-size: 18px; color: #666; }

.qube [class^=block] .figure .text04 + .text05 { margin-left: 2px; }

.qube [class^=block] .figure .text04 + .text06 { margin-left: 2px; }

.qube [class^=block] .figure .text05 { font-size: 12px; letter-spacing: -0.1px; color: #666; }

.qube [class^=block] .figure .text06 { font-size: 12px; color: #666; }

.qube [class^=block] .figure .dash { padding: 0 8px; font-size: 14px; opacity: .3; color: #aaa; }

.qube [class^=block] .btn-toggle { position: absolute; top: 23px; right: 20px; }

.qube [class^=block] .btn-toggle a, .qube [class^=block] .btn-toggle button { display: block; width: 24px; height: 24px; background: url(/webImages/btn-card-extension.svg) no-repeat 0 0; background-size: 24px 24px; }

.qube [class^=block] .chart { position: absolute; left: 0; bottom: 0; width: 100%; height: 100px; padding-right: 0; }

.qube [class^=block] .chart .draw { width: 100%; height: 100%; }

.qube [class^=block] .chart .draw .highcharts-series-0 { stroke-dasharray: 2, 5; }

.qube [class^=block] .chart .result { opacity: .0; visibility: hidden; position: absolute; right: 0px; bottom: 12px; color: #2233b6; -webkit-transition: opacity .5s; transition: opacity .5s; }

.qube [class^=block] .chart .result .text01 { display: inline-block; font-size: 50px; font-weight: 500; }

.qube [class^=block] .chart .result .text02 { font-size: 13px; }

.qube [class^=block] .chart .result .belt { display: inline-block; text-align: center; }

.qube [class^=block] .chart .result .belt span { display: block; }

.qube [class^=block] .chart .result .belt span img { width: 14px; height: 17px; }

.qube [class^=block] .chart .result .belt span[class^=ui-svg] { display: inline-block; }

.qube [class^=block] .chart .result.up { color: #ff3e47; }

.qube [class^=block] .chart .result.down { color: #2c9dff; }

.qube [class^=block] .detail { position: absolute; right: 0; top: 0; width: 0px; height: 410px; background: #fafafa; overflow: hidden; -webkit-transition: width .5s; transition: width .5s; }

.qube [class^=block] .detail .title { position: absolute; top: 30px; left: 24px; font-size: 14px; letter-spacing: -0.12px; color: #222; font-weight: 700; }

.qube [class^=block] .detail .title2 { position: absolute; top: 25px; left: 24px; }

.qube [class^=block] .detail .title2 .text01 { font-size: 14px; font-weight: 700; letter-spacing: -0.12px; color: #222; }

.qube [class^=block] .detail .title2 .text02 { position: relative; font-size: 12px; letter-spacing: -0.1px; color: #999; padding: 0 0 0 13px; }

.qube [class^=block] .detail .title2 .text02::before { content: ''; position: absolute; left: 6px; top: 3px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.qube [class^=block] .detail .total { position: absolute; top: 64px; left: 30px; }

.qube [class^=block] .detail .total .text01 { font-size: 60px; font-weight: 500; color: #222; }

.qube [class^=block] .detail .total .text02 { font-size: 12px; font-weight: 700; color: #222; }

.qube [class^=block].extension { height: 410px; }

.qube [class^=block].extension .btn-toggle a, .qube [class^=block].extension .btn-toggle button { background: url(/webImages/btn-card-reduce.svg) no-repeat 0 0; background-size: 24px 24px; }

.qube [class^=block].extension .detail { -webkit-transition-delay: .5s; transition-delay: .5s; }

.qube .block1 { position: absolute; left: 0; top: 0; width: 420px; height: 280px; }

.qube .block2 { position: absolute; left: 444px; top: 0; width: 420px; height: 280px; }

.qube .block3 { position: absolute; left: 888px; top: 0; width: 420px; height: 280px; }

.qube .block3 .chart .draw { width: 270px; }

.qube .block3 .chart .result { right: 24px; opacity: 1; visibility: visible; }

.qube .highcharts-legend { opacity: 0 !important; -webkit-transition: opacity .5s; transition: opacity .5s; -webkit-transition-delay: .5s; transition-delay: .5s; }

.qube.extension { height: 410px; }

.qube.extension .chart { box-sizing: border-box; height: 60px; }

.qube.extension.type1 .block1 .chart { height: 220px; padding-right: 400px; }

.qube.extension.type1 .block1 .chart .result { -webkit-transition-delay: 1s; transition-delay: 1s; visibility: visible; opacity: 1; right: 424px; }

.qube.extension.type1 .block1 .highcharts-legend { opacity: 1 !important; }

.qube.extension.type1 .block1 .detail { width: 400px; }

.qube.extension.type1 .block1 .figure .text01 { font-size: 60px; }

.qube.extension.type1 .block2 .figure { top: 64px; }

.qube.extension.type1 .block2 .figure .text01 { font-size: 30px; }

.qube.extension.type1 .block2 .figure .text04 { font-size: 18px; }

.qube.extension.type1 .block2 .figure > div:nth-of-type(2) { margin-top: -1px; }

.qube.extension.type1 .block3 .figure { top: 64px; }

.qube.extension.type1 .block3 .figure .text01 { font-size: 30px; }

.qube.extension.type1 .block3 .figure .text04 { font-size: 18px; }

.qube.extension.type1 .block3 .figure > div:nth-of-type(2) { margin-top: -1px; }

.qube.extension.type1 .block3 .chart .draw { width: 0; }

.qube.extension.type2 .block1 .figure { top: 64px; }

.qube.extension.type2 .block1 .figure .text01 { font-size: 30px; }

.qube.extension.type2 .block1 .figure .text04 { font-size: 18px; }

.qube.extension.type2 .block1 .figure > div:nth-of-type(2) { margin-top: -1px; }

.qube.extension.type2 .block2 .chart { height: 220px; padding-right: 400px; }

.qube.extension.type2 .block2 .chart .result { -webkit-transition-delay: 1s; transition-delay: 1s; visibility: visible; opacity: 1; right: 424px; }

.qube.extension.type2 .block2 .highcharts-legend { opacity: 1 !important; }

.qube.extension.type2 .block2 .detail { width: 400px; }

.qube.extension.type2 .block2 .figure .text01 { font-size: 60px; }

.qube.extension.type2 .block3 .figure { top: 64px; }

.qube.extension.type2 .block3 .figure .text01 { font-size: 30px; }

.qube.extension.type2 .block3 .figure .text04 { font-size: 18px; }

.qube.extension.type2 .block3 .figure > div:nth-of-type(2) { margin-top: -1px; }

.qube.extension.type2 .block3 .chart .draw { width: 0; }

.qube.extension.type3 .block1 .figure { top: 64px; }

.qube.extension.type3 .block1 .figure .text01 { font-size: 30px; }

.qube.extension.type3 .block1 .figure .text04 { font-size: 18px; }

.qube.extension.type3 .block1 .figure > div:nth-of-type(2) { margin-top: -1px; }

.qube.extension.type3 .block2 .figure { top: 64px; }

.qube.extension.type3 .block2 .figure .text01 { font-size: 30px; }

.qube.extension.type3 .block2 .figure .text04 { font-size: 18px; }

.qube.extension.type3 .block2 .figure > div:nth-of-type(2) { margin-top: -1px; }

.qube.extension.type3 .block3 .chart { height: 220px; padding-right: 400px; }

.qube.extension.type3 .block3 .chart .draw { width: 100%; }

.qube.extension.type3 .block3 .chart .result { -webkit-transition-delay: 1s; transition-delay: 1s; visibility: visible; opacity: 1; right: 424px; }

.qube.extension.type3 .block3 .highcharts-legend { opacity: 1 !important; }

.qube.extension.type3 .block3 .detail { width: 400px; }

.qube.extension.type3 .block3 .figure .text01 { font-size: 60px; }

.qube.sub { margin-top: 0; }

.qube.sub [class^=block] .chart { height: 158px; }

.qube.sub .block1 { height: 330px; }

.qube.sub .block1 .chart .result { right: 24px; opacity: 1; visibility: visible; }

.qube.sub .block1 .chart .highcharts-legend { opacity: 1 !important; }

.qube.sub .block2 { height: 330px; }

.qube.sub .block2 .chart .result { right: 24px; opacity: 1; visibility: visible; }

.qube.sub .block2 .chart .highcharts-legend { opacity: 1 !important; }

.qube.sub .block3 { height: 330px; }

.qube.sub .block3 .chart .draw { width: 100%; }

.qube.sub .block3 .chart .result { right: 24px; opacity: 1; visibility: visible; }

.qube.sub .block3 .chart .highcharts-legend { opacity: 1 !important; }

.status-board { position: relative; height: 600px; padding: 0 374px 0 0; margin: -73px 0 24px 0; }

.status-board .block { position: relative; height: 600px; border-radius: 4px; background: #fff; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); }

.status-board .block .title { position: absolute; top: 25px; left: 24px; }

.status-board .block .title .icon { margin: 0 8px 0 0; }

.status-board .block .title .icon img { vertical-align: top; width: 18px; height: 18px; }

.status-board .block .title .text01 { font-size: 14px; font-weight: 700; letter-spacing: -0.12px; color: #222; }

.status-board .block .title .text02 { position: relative; padding-left: 13px; vertical-align: bottom; font-size: 12px; letter-spacing: -0.1px; color: #999; }

.status-board .block .title .text02::before { content: ''; position: absolute; left: 6px; top: 3px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.status-board .block .title .text03 { vertical-align: bottom; margin: 0 0 0 10px; font-size: 13px; color: #999; }

.status-board .block .title .text04 { vertical-align: bottom; margin: 0 0 0 2px; font-size: 12px; letter-spacing: -0.1px; color: #999; }

.status-board .block .tab { position: absolute; right: 24px; top: 16px; width: 180px; }

.status-board .block .tab a, .status-board .block .tab button { float: left; width: 90px; height: 36px; border: 1px solid #d8dbe0; box-sizing: border-box; text-align: center; line-height: 36px; font-size: 13px; font-weight: 500; letter-spacing: -0.09px; color: #a6a9b3; background: #f5f7fb; }

.status-board .block .tab a.current, .status-board .block .tab button.current { background: #fff; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.08); color: #222; }

.status-board .block .tab a:nth-of-type(1), .status-board .block .tab button:nth-of-type(1) { border-radius: 4px 0 0 4px; }

.status-board .block .tab a:nth-of-type(2), .status-board .block .tab button:nth-of-type(2) { margin-left: -1px; border-radius: 0 4px 4px 0; }

.status-board .block .tab-cont { position: absolute; left: 0; bottom: 0; width: 100%; height: 525px; }

.status-board .block .tab-cont .panel { position: relative; width: 100%; height: 100%; display: none; }

.status-board .block .tab-cont .panel.current { display: block; }

.status-board .block .tab-cont .panel:nth-of-type(1) .highcharts-series-1 { stroke-dasharray: 2, 5; }

.status-board .block .tab-cont .panel:nth-of-type(2) .highcharts-series-2 { stroke-dasharray: 2, 5; }

.status-board .block .tab-cont .panel .draw { width: 100%; height: 100%; }

.status-board .block .tab-cont .panel .draw .highcharts-axis-title { font-size: 12px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; }

.status-board .block .tab-cont .panel .draw .highcharts-axis-labels span { font-size: 12px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; }

.status-board .block .tab-cont .panel .peek { position: absolute; right: 25px; bottom: 23px; }

.status-board-message { position: absolute; top: 0; left: 0; width: 100%; z-index: 10; }
.status-board-message-box { margin: 0 auto; width: 500px; padding: 20px; border-radius: 4px; background: rgba(38, 40, 185, 0.8); font-size: 16px; line-height: 24px; color: #fff; text-align: center; }

.status-board .right { position: absolute; right: 0; top: 0; width: 350px; height: 600px; box-sizing: border-box; padding: 24px 24px 0 24px; border-radius: 4px; background: #fff; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); }

.status-board .right .title { padding-bottom: 10px; border-bottom: 1px solid #e8e8e8; margin: 0 0 20px 0; font-size: 0; line-height: 0; }
.status-board .right .title .text { display: inline-block; vertical-align: top; font-size: 14px; line-height: normal; font-weight: 700; letter-spacing: -0.12px; color: #222; }

.status-board .right .title .date { display: inline-block; vertical-align: top; font-size: 26px; line-height: 31px; font-weight: 500; }
.status-board .right .title .sub-text { display: inline-block; vertical-align: top; font-size: 14px; line-height: 20px; font-weight: 400; color: #666; padding: 7px 0 4px 10px; }

.status-board .right .info { margin: 0 0 28px 0; }

.status-board .right .info .table { display: table; width: 100%; }

.status-board .right .info .tr { display: table-row; }

.status-board .right .info .td { display: table-cell; padding: 7px 0; }

.status-board .right .info .td:nth-of-type(1) { width: 145px; font-size: 16px; font-weight: 300; line-height: 24px; letter-spacing: -0.1px; color: #222; }

.status-board .right .info .td:nth-of-type(2) { font-size: 16px; font-weight: 500; line-height: 24px; letter-spacing: -0.1px; color: #222; }

.status-board .right .info .td .s { font-size: 12px; font-weight: 400; letter-spacing: -0.08px; }

.status-board .right .info .td .icon { display: inline-block; vertical-align: middle; margin: 0 10px 0 0; }

.status-board .right .info .td .icon img { width: 16px; height: 18px; }

.status-board .right .gray-box { position: absolute; bottom: 24px; left: 24px; right: 24px; box-sizing: border-box; padding: 20px 16px 10px; background: #f6f7f8; }

.status-board .right .gray-box .table { display: table; width: 100%; }

.status-board .right .gray-box .tr { display: table-row; }

.status-board .right .gray-box .td { display: table-cell; padding: 6px 0; }

.status-board .right .gray-box .td:nth-of-type(1) { width: 126px; font-size: 14px; letter-spacing: -0.1px; color: #666; }

.status-board .right .gray-box .td:nth-of-type(2) { font-size: 14px; font-weight: 500; color: #222; }

.status-board-bottom { position: absolute; left: 0; right: 0; bottom: 0; margin: 24px; }
.status-board-diff { margin: 0; padding: 20px 16px; background: #eff1f4; }
.status-board-diff + .status-board-diff { margin-top: 10px; }
.status-board-diff:after { content: ''; display: table; clear: both; }
.status-board-diff-key { margin: 0; padding: 0; float: left; font-size: 14px; line-height: 20px; font-weight: 700; }
.status-board-diff-val { margin: 0; padding: 0; float: right; font-size: 12px; line-height: 20px; width: 175px; }
.status-board-diff-val:after { content: ''; display: table; clear: both; }
.status-board-diff-val-cell { float: left; }
.status-board-diff-val-cell:last-child { float: right; }
.status-board-diff-num { vertical-align: top; font-size: 18px; font-weight: 500; }
.status-board-diff-sub { color: #666; }
.status-board-diff-val .fluctuation-text { margin: -5px 12px -5px 0; }
.status-board-diff-val > .status-board-diff { padding: 0; background: none; }
.status-board-diff-val > .status-board-diff + .status-board-diff { margin-top: 6px; }
.status-board-diff-val > .status-board-diff > .status-board-diff-key { font-weight: 400; }
.status-board-diff.is-vertical { padding-top: 10px; padding-bottom: 10px; }
.status-board-diff.is-vertical > .status-board-diff-key { float: none; margin-bottom: 6px; }
.status-board-diff.is-vertical > .status-board-diff-val { float: none; width: auto; }

/* 하이차트 */
.chart-ui > * { font-family: 'epot',Sans-serif !important; }

.chart-ui .tooltip .base-date { display: block; margin: 0 0 9px 0; font-size: 12px; color: #222; }

.chart-ui .tooltip .b { display: block; position: relative; margin-top: 2px; }

.chart-ui .tooltip .b > span { font-size: 10px !important; }

.chart-ui .tooltip .b > span.t1 { font-weight: 400 !important; }

.chart-ui .tooltip .b > span.t4 { font-weight: 400 !important; }

.chart-ui .tooltip .c { display: block; margin-top: 9px; }

.chart-ui .tooltip .t1 { vertical-align: middle; font-size: 10px; font-weight: 700; color: #222; }

.chart-ui .tooltip .t2 { vertical-align: middle; margin: 0 0 0 4px; font-size: 16px; font-weight: 500; }

.chart-ui .tooltip .t3 { vertical-align: middle; font-size: 16px; }

.chart-ui .tooltip .t3 sub { font-size: 10px; position: relative; top: -2px; }

.chart-ui .tooltip .t4 { vertical-align: bottom; font-size: 10px; color: #999; position: relative; top: -2px; margin-left: 4px; }

.chart-ui .tooltip .t5 { vertical-align: middle; font-size: 10px; font-weight: 200; color: #222; }

.chart-ui .tooltip .t6 { vertical-align: middle; font-size: 10px; font-weight: 500; color: #222; }

.chart-ui .tooltip .t7 { vertical-align: middle; font-size: 10px; color: #999; }

.chart-ui .tooltip .date { font-size: 12px; color: #222; font-weight: 400; }

.chart-ui .tooltip .before { display: block; color: #65be67; }

.chart-ui .tooltip .now { display: block; color: #2233b6; }

.chart-ui .tooltip .text01 { margin-left: 14px; font-size: 14px; font-weight: 500; }

.chart-ui .tooltip .text02 { margin-left: 4px; font-size: 14px; font-weight: 400; }

.chart-ui .tooltip .sparkline { font-size: 14px !important; color: #fff !important; }

.chart-ui .tooltip .sparkline .t { margin-left: 2px; font-size: 14px !important; font-weight: 400 !important; }

.chart-ui .tooltip .sparkline .value { font-weight: 500 !important; }

.chart-ui .tooltip .table { display: table; }

.chart-ui .tooltip .tr { display: table-row; }

.chart-ui .tooltip .td { display: table-cell; padding: 0; }

.chart-ui .tooltip .left { text-align: left; }

.chart-ui .tooltip .right { text-align: right; }

.chart-ui .tooltip .status .s-tit { margin: 0 0 2px 0; display: block; font-size: 10px; font-weight: 700; color: #333; }

.chart-ui .tooltip .status .s-date { margin: 0 0 8px 0; display: block; font-size: 12px; color: #222; }

.chart-ui .tooltip .status .s-value { font-size: 16px; font-weight: 500; }

.chart-ui .tooltip .status .s-value .normal { font-weight: 400; }

.chart-ui .tooltip .status .s-value.green { color: #65be67; }

.chart-ui .tooltip .status .s-value.blue { color: #2233b6; }

.chart-ui .tooltip .status .s-value.red { color: #ff3e47; }

.chart-ui .tooltip .status .s-value.gray { color: #999; }

.chart-ui .tooltip .status .s-value.black { color: #222; }

.chart-ui .tooltip .status .s-value.sky { color: #6bb2ff; }

.chart-ui .tooltip .m { position: relative; display: inline-block; margin: 1px; padding: 6px 11px 4px 7px; font-family: 'epot',Sans-serif !important; z-index: 999; background: #fff; font-size: 14px; line-height: 17px; }

.chart-ui .tooltip .m .t { margin-right: 8px; font-size: 10px; line-height: 15px; font-weight: 700; color: #222; text-align: right; }

.chart-ui .tooltip .m .v,
.chart-ui .tooltip .m .u { line-height: 17px; }

.chart-ui .tooltip .m .t,
.chart-ui .tooltip .m .v,
.chart-ui .tooltip .m .u { display: inline-block; vertical-align: middle; }

.chart-ui .tooltip .m .date { font-size: 14px; line-height: 17px; color: #222; }

.chart-ui .tooltip .m .block { display: block; }

.chart-ui .tooltip .m .actual .v { font-size: 14px; color: #2233b6; font-weight: 500; }

.chart-ui .tooltip .m .actual .u { margin-left: 2px; font-size: 10px; color: #2233b6; font-weight: 400; }

.chart-ui .tooltip .m .prediction .v { font-size: 14px; color: #6bb2ff; font-weight: 500; }

.chart-ui .tooltip .m .prediction .u { margin-left: 2px; font-size: 10px; color: #6bb2ff; font-weight: 400; }

.chart-ui .tooltip .m .temperature .v { font-size: 14px; color: #222; font-weight: 500; }

.chart-ui .tooltip .m .temperature .u { margin-left: 2px; font-size: 10px; color: #222; font-weight: 400; }

.chart-ui .tooltip .m .pattern .v { font-size: 14px; color: #65be67; font-weight: 500; }

.chart-ui .tooltip .m .pattern .u { margin-left: 2px; font-size: 10px; color: #65be67; font-weight: 400; }

.chart-ui .tooltip .m .black .v { font-size: 14px; color: #222; font-weight: 500; }

.chart-ui .tooltip .m .black .u { margin-left: 2px; font-size: 10px; color: #222; font-weight: 400; }

.chart-ui .tooltip .m .gray .v { font-size: 14px; color: #999; font-weight: 500; }

.chart-ui .tooltip .m .gray .u { margin-left: 2px; font-size: 10px; color: #999; font-weight: 400; }

.chart-ui .tooltip .m .red .v { font-size: 14px; color: #ff3e47; font-weight: 500; }

.chart-ui .tooltip .m .red .u { margin-left: 2px; font-size: 10px; color: #ff3e47; font-weight: 400; }

.chart-ui .legend .symbol { vertical-align: middle; display: inline-block; }

.chart-ui .legend .symbol.type1 { width: 21px; height: 4px; background: url(/webImages/bg-symbol-type1.gif) repeat 0 0; }

.chart-ui .legend .symbol.type2 { width: 21px; height: 8px; box-sizing: border-box; border-top: 1px solid #2233b6; background: rgba(44, 157, 255, 0.34); }

.chart-ui .legend .symbol.type3 { width: 21px; height: 12px; border: 1px solid #2233b6; box-sizing: border-box; }

.chart-ui .legend .symbol.type4 { width: 21px; height: 12px; border: 1px solid #2233b6; background: url(/webImages/pattern-deepkoamaru-30.svg) repeat 0 0; background-size: 5px 8px; box-sizing: border-box; }

.chart-ui .legend .symbol.type5 { width: 21px; height: 3px; background: #c6e0fc; }

.chart-ui .legend .symbol.type6 { width: 21px; height: 3px; background: #2233b6; }

.chart-ui .legend .symbol.type7 { width: 21px; height: 3px; background: #ff3e47; }

.chart-ui .legend .symbol.type8 { width: 21px; height: 3px; background: #000; }

.chart-ui .legend .symbol.type9 { width: 21px; height: 6px; background: #FF3E47; /* position:relative; width:21px; height:6px; background:#e9e9e9; &::after{ content:''; position:absolute; left:8px; top:-5px; display: inline-block; width: 4px; height: 4px; border-radius: 100%; background: #ff3e47; } */ }

.chart-ui .legend .symbol.type10 { width: 21px; height: 6px; background: #e9e9e9; }

.chart-ui .legend .symbol.type11 { width: 21px; height: 3px; background: #84cf85; }

.chart-ui .legend .symbol.type12 { width: 21px; height: 3px; background: #2233b6; }

.chart-ui .legend .symbol.type13 { width: 21px; height: 3px; background: #2c9dff; }

.chart-ui .legend .symbol.type14 { width: 21px; height: 3px; background: #ff3e47; }

.chart-ui .legend .symbol.type15 { width: 21px; height: 3px; background: #000; }

.chart-ui .legend .symbol.type16 { width: 21px; height: 3px; background: #84cf85; }

.chart-ui .legend .symbol.type17 { width: 6px; height: 6px; background: #2233b6; }

.chart-ui .legend .symbol.type18 { width: 21px; height: 10px; background: #eff1f7; }

.chart-ui .legend .symbol.type19 { width: 21px; height: 10px; background: #2233b6; }

.chart-ui .legend .symbol.type20 { width: 21px; height: 3px; background: #ff3e47; }

.chart-ui .legend .symbol.type21 { width: 21px; height: 3px; background: #000; }

.chart-ui .legend .symbol.type22 { width: 21px; height: 3px; background: #2233b6; }

.chart-ui .legend .symbol.type23 { width: 20px; height: 3px; background: #84cf85; }

.chart-ui .legend .symbol.type24 { width: 21px; height: 6px; background: #e9e9e9; }

.chart-ui .legend .symbol.type25 { position: relative; width: 21px; height: 6px; background: #e9e9e9; }

.chart-ui .legend .symbol.type25::after { content: ''; position: absolute; left: 8px; top: -5px; display: inline-block; width: 4px; height: 4px; border-radius: 100%; background: #ff3e47; }

.chart-ui .legend .symbol.type26 { display: inline-block; width: 21px; height: 10px; background-color: #ebf4fe; }

.chart-ui .legend .symbol.type27 { width: 6px; height: 6px; background: #84cf85; }

.chart-ui .legend .symbol.add { margin-left: 40px; }

.chart-ui .legend .name { vertical-align: middle; display: inline-block; margin-left: 8px; font-size: 13px; color: #222; opacity: .8; font-weight: 400; }

.chart-ui .legend .name.f12 { font-size: 12px; }

.chart-ui .legend .name.f14 { font-size: 14px; }

.chart-ui .legend .peak { margin-left: 25px; }

.chart-ui .legend .peak [class^=ui-svg] { vertical-align: middle; margin-right: 4px; }

.chart-ui .legend .peak .t1 { vertical-align: middle; margin-right: 1.6px; font-size: 12px; letter-spacing: -0.09px; color: #222; font-weight: 400; }

.chart-ui .legend .peak .t2 { vertical-align: middle; margin-right: 9.8px; font-size: 12px; letter-spacing: -0.09px; color: #999; font-weight: 400; }

.chart-ui .legend .peak .t3 { vertical-align: middle; font-size: 12px; letter-spacing: -0.09px; color: #ff3e47; font-weight: 500; }

.chart-ui .legend .peak .t4 { vertical-align: middle; font-size: 12px; letter-spacing: -0.09px; color: #ff3e47; font-weight: 400; }

.chart-ui .datalabels .symbol.max { position: relative; top: 10px; display: inline-block; width: 12px; height: 12px; background: url(/webImages/icon-unregistered.svg) no-repeat 0 0; background-size: 12px 12px; padding: 0; }

.chart-ui .datalabels .symbol.reddot { display: inline-block; width: 6px; height: 6px; border-radius: 100%; background: #ff3e47; }

.chart-ui .renderer-txt.max { display: block; text-align: right; box-sizing: border-box; font-family: 'epot',Sans-serif !important; }

.chart-ui .renderer-txt.max span { display: inline-block; vertical-align: middle; }

.chart-ui .renderer-txt.max .icon { margin: 0 4px 0 0; }

.chart-ui .renderer-txt.max .icon img { width: 16px; height: 16px; vertical-align: top; }

.chart-ui .renderer-txt.max .text01 { margin: 0 3px 0 0; font-size: 12px; letter-spacing: -0.09px; color: #222; font-family: 'epot',Sans-serif; }

.chart-ui .renderer-txt.max .text02 { margin: 0 10px 0 0; font-size: 12px; letter-spacing: -0.09px; color: #999; font-family: 'epot',Sans-serif; }

.chart-ui .renderer-txt.max .text03 { font-size: 12px; letter-spacing: -0.09px; color: #ff3e47; font-family: 'epot',Sans-serif; font-weight: 500; }

.chart-ui .renderer-txt.max .text04 { font-size: 12px; letter-spacing: -0.09px; color: #ff3e47; font-family: 'epot',Sans-serif; }

/* html 차트 */
.html-chart .bar { position: absolute; left: 0; bottom: 0; width: 400px; height: 237px; }

.html-chart .bar .series { margin: 0 40px 27px 50px; height: 75px; }

.html-chart .bar .series .categories { margin: 0 0 6px 0; }

.html-chart .bar .series .categories .text01 { margin: 0 7px 0 0; font-size: 14px; font-weight: 500; color: #222; }

.html-chart .bar .series .categories .text02 { font-size: 14px; letter-spacing: -0.1px; color: #555; }

.html-chart .bar .series .point-wrap { position: relative; height: 48px; }

.html-chart .bar .series .point-wrap .tick { float: left; height: 48px; text-align: left; text-indent: 20px; background: #85da86; }

.html-chart .bar .series .point-wrap .tick .text01 { margin: 0 2px 0 0; font-size: 18px; font-weight: 500; color: #fff; line-height: 48px; }

.html-chart .bar .series .point-wrap .tick .text02 { font-size: 12px; font-weight: 500; color: #fff; line-height: 48px; }

.html-chart .bar .series .point-wrap .tick:nth-of-type(2) { background: #4bcc84 url(/webImages/pattern-green.svg) repeat 0 0; background-size: 8px 14px; }

.html-chart .bar .series .sub-point { position: absolute; left: 0; bottom: 0; }

.html-chart .bar .series .sub-point::after { content: ''; display: block; width: 0; height: 101px; border-right: 2px dotted #222; position: absolute; right: 0; top: 0; z-index: 2; }

.html-chart .bar .series:nth-of-type(2) { margin-bottom: 16px; }

.html-chart .bar .series:nth-of-type(2) .point-wrap .tick { background: #0073ff; }

.html-chart .bar .series:nth-of-type(2) .point-wrap .tick:nth-of-type(2) { background: #2233b6 url(/webImages/pattern-deepkoamaru.svg) repeat 0 0; background-size: 8px 14px; }

.html-chart .bar .series:nth-of-type(2) .sub-point::after { top: auto; bottom: 48px; }

.html-chart .bar .legend-wrap { margin: 0 0 0 50px; }

.html-chart .bar .legend-wrap .chart-ui { margin: 0 30px 0 0; }

.html-chart .bar2 { position: absolute; left: 0; bottom: 0; width: 400px; height: 313px; }

.html-chart .bar2 .series { position: relative; height: 28px; margin: 0 39px 32px 39px; }

.html-chart .bar2 .series .categories .left .text01 { font-size: 14px; letter-spacing: -0.35px; color: #222; }

.html-chart .bar2 .series .categories .left .text02 { position: relative; display: inline-block; height: 19px; margin: 0 2px 0 0; padding: 0 0 0 17px; font-size: 16px; font-weight: 500; color: #222; }

.html-chart .bar2 .series .categories .left .text02::before { content: ''; position: absolute; left: 8px; top: 3px; width: 0; height: 10px; border-left: 1px solid #dcdcdc; }

.html-chart .bar2 .series .categories .left .text03 { font-size: 12px; letter-spacing: -0.08px; color: #222; }

.html-chart .bar2 .series .categories .left .text04 { font-size: 13px; color: #222; }

.html-chart .bar2 .series .categories .left .dash { margin: 0 3px; display: inline-block; width: 1px; height: 7px; background: #d8d8d8; -webkit-transform: rotate(15deg); transform: rotate(15deg); }

.html-chart .bar2 .series .categories .right { position: absolute; right: 0; top: 0; color: #2233b6; }

.html-chart .bar2 .series .categories .right .text01 { font-size: 18px; letter-spacing: -0.13px; font-weight: 500; }

.html-chart .bar2 .series .categories .right .text02 { margin: 0 3px 0 0; font-size: 12px; letter-spacing: -0.09px; }

.html-chart .bar2 .series .categories .right.up { color: #f14443; }

.html-chart .bar2 .series .categories .right.down { color: #2c9dff; }

.html-chart .bar2 .series .categories .right .icon img { width: 8px; height: 15px; }

.html-chart .bar2 .series .point-wrap { position: absolute; left: 0; bottom: 0; height: 4px; width: 100%; }

.html-chart .bar2 .series .point-wrap .belt { width: 240px; }

.html-chart .bar2 .series .point-wrap .belt .tick { height: 4px; background-color: #2233b6; box-shadow: 0 2px 2px 0 rgba(0, 115, 255, 0.21); }

.html-chart .bar2 .series .point-wrap::after { content: ''; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 0; border-bottom: 1px solid #cbcbcb; }

.html-chart .column { position: absolute; left: 0; bottom: 0; width: 400px; height: 315px; }

.html-chart .column .series { position: absolute; left: 60px; bottom: 0; width: 140px; }

.html-chart .column .series .point-wrap { position: relative; width: 60px; height: 200px; margin: 0 auto; }

.html-chart .column .series .point { position: absolute; bottom: 0; width: 60px; background: #85da86; }

.html-chart .column .series .sub-point { position: absolute; top: 0; width: 60px; background: #85da86 url(/webImages/pattern-white.svg) repeat 0 0; background-size: 8px 14px; }

.html-chart .column .series .sub-point::after { content: ''; display: block; width: 140px; height: 0; border-bottom: 2px dotted #222; position: absolute; left: 0; bottom: -2px; }

.html-chart .column .series .text-wrap { position: absolute; bottom: 100%; left: -40px; width: 140px; padding: 0 0 10px 0; white-space: nowrap; }

.html-chart .column .series .text-wrap .text01 { font-size: 30px; font-weight: 500; color: #333; }

.html-chart .column .series .text-wrap .text02 { font-size: 12px; font-weight: 500; color: #222; }

.html-chart .column .series .text-wrap .text03 { font-size: 18px; color: #222; }

.html-chart .column .series .text-wrap .text04 { font-size: 12px; color: #222; }

.html-chart .column .series .categories { margin: 10px 0 22px; text-align: center; font-size: 14px; color: #222; }

.html-chart .column .series:nth-of-type(2) { left: 200px; }

.html-chart .column .series:nth-of-type(2) .point { background: #2233b6; }

.html-chart .column .series:nth-of-type(2) .text-wrap .text01 { color: #2233b6; }

.html-chart .column .series:nth-of-type(2) .text-wrap .text02 { color: #2233b6; }

.html-chart .column .series:nth-of-type(2) .sub-point { position: absolute; top: 0; width: 60px; background: #2233b6 url(/webImages/pattern-white.svg) repeat 0 0; background-size: 8px 14px; }

.html-chart .column .series:nth-of-type(2) .sub-point::after { content: ''; display: block; width: 140px; height: 0; border-bottom: 2px dotted #222; position: absolute; left: auto; right: 0; bottom: -2px; }

.title-filter { position: relative; height: 40px; margin: 0 0 10px 0; }

.title-filter .left .icon { display: inline-block; vertical-align: middle; margin: 0 6px 0 0; }

.title-filter .left .icon img { width: 20px; height: 20px; }

.title-filter .left .text01,
.title-filter .left .text02 { display: inline-block; font-size: 14px; font-weight: 700; color: #222; vertical-align: middle; line-height: 40px; }

.title-filter .left .text02 { font-weight: 400; color: #b4b6ba; }

.title-filter .left .select-block { display: inline-block; vertical-align: middle; width: 135px; margin-right: 10px; }

.title-filter .left .ui-btn-line-radius-gray-md-wp12 { margin-left: 10px; }

.title-filter .right { position: absolute; right: 0; top: 0; }

.title-filter .right .form-wrap { width: 357px; }

.data-table.is-layout-fixed table { table-layout: fixed; }

.data-table .js-tr-hover .graph { display: none; }

.data-table .js-tr-hover .graph-support { display: none; }

.data-table .js-tr-hover.s2 tbody tr > td:nth-of-type(3) .graph { display: inline-block; }

.data-table .js-tr-hover.s2 tbody tr > td:nth-of-type(3) .graph-support { display: inline-block; }

.data-table .js-tr-hover.s3 tbody tr > td:nth-of-type(4) .graph { display: inline-block; }

.data-table .js-tr-hover.s3 tbody tr > td:nth-of-type(4) .graph-support { display: inline-block; }

.data-table .js-tr-hover.s4 tbody tr > td:nth-of-type(5) .graph { display: inline-block; }

.data-table .js-tr-hover.s4 tbody tr > td:nth-of-type(5) .graph-support { display: inline-block; }

.data-table .js-tr-hover.s5 tbody tr > td:nth-of-type(6) .graph { display: inline-block; }

.data-table .js-tr-hover.s5 tbody tr > td:nth-of-type(6) .graph-support { display: inline-block; }

.data-table .col1 { width: 72px; }

.data-table .col7 { width: 72px; }

.data-table .btn-sort { height: 20px; font-size: 14px; line-height: 20px; color: #858585; font-weight: 700; }

.data-table .btn-sort::after { content: ''; margin: 0 0 0 4px; position: relative; top: -1px; vertical-align: middle; display: inline-block; width: 20px; height: 20px; background: url(/webImages/btn-table-sorting-nor.svg) no-repeat right 0; background-size: 20px 20px; }

.data-table .btn-sort.ascending { position: relative; top: 1px; font-size: 16px; color: #2233b6; }

.data-table .btn-sort.ascending::after { top: -2px; background-image: url(/webImages/btn-table-sorting-ascending-sel.svg); }

.data-table .btn-sort.descending { position: relative; top: 1px; font-size: 16px; color: #2233b6; }

.data-table .btn-sort.descending::after { top: -2px; background-image: url(/webImages/btn-table-sorting-descending-sel.svg); }

.data-table .btn-single { display: inline-block; padding-right: 15px; background: url(/webImages/btn-table-list-arrow.svg) no-repeat right 23px; background-size: 7px 11px; font-size: 14px; letter-spacing: -0.1px; color: #555; font-weight: 700; line-height: 60px; vertical-align: middle; }

.data-table thead th, .data-table tbody td { vertical-align: top; }

.data-table thead th > div, .data-table thead td > div { height: 66px; background: #fff; border-bottom: 1px solid #dadde3; margin-bottom: 4px; }

.data-table thead th[rowspan="2"] > div { padding-top: 12px; padding-bottom: 11px; }

.data-table thead th[colspan] > div { margin-bottom: 0; height: 44px; }

.data-table thead th[colspan] > div .text01 { line-height: 44px; }

.data-table thead tr + tr th > div { height: 44px; }

.data-table thead tr + tr th > div .text01 { line-height: 44px; }

.data-table thead tr + tr th > div .btn-sort { margin-top: 12px; }

.data-table thead th > div .text01, .data-table thead td > div .text01 { font-size: 14px; font-weight: 700; color: #858585; line-height: 67px; }

.data-table thead th > div .btn-sort, .data-table thead td > div .btn-sort { margin-top: 25px; }

.data-table thead th.l, .data-table thead td.l { text-align: left; }

.data-table thead th.c, .data-table thead td.c { text-align: center; }

.data-table tbody th, .data-table tbody td { border-top: 2px solid #fff; }

.data-table tbody th > div, .data-table tbody td > div { height: 60px; background: #fff; border-bottom: 1px solid #dadde3; margin-bottom: 4px; }

.data-table tbody th > div .num, .data-table tbody td > div .num { font-size: 16px; font-weight: 500; color: #555; line-height: 60px; }

.data-table tbody th > div .group01, .data-table tbody td > div .group01 { display: inline-block; line-height: 60px; white-space: nowrap; vertical-align: middle; cursor: pointer; }

.data-table tbody th > div .group01 .text01, .data-table tbody td > div .group01 .text01 { font-size: 16px; letter-spacing: -0.11px; color: #555; font-weight: 500; }

.data-table tbody th > div .group01 .text02, .data-table tbody td > div .group01 .text02 { font-size: 12px; letter-spacing: -0.09px; color: #555; }

.data-table tbody th > div .group01 .text03, .data-table tbody td > div .group01 .text03 { margin: 0 0 0 6px; font-size: 16px; letter-spacing: -0.11px; color: #2233b6; font-weight: 500; }

.data-table tbody th > div .group01 .text03.up, .data-table tbody td > div .group01 .text03.up { color: #fa4443; }

.data-table tbody th > div .group01 .text03.down, .data-table tbody td > div .group01 .text03.down { color: #2c9dff; }

.data-table tbody th > div .group01 .text04, .data-table tbody td > div .group01 .text04 { margin: 0 0 0 -3px; font-size: 12px; letter-spacing: -0.09px; color: #2233b6; }

.data-table tbody th > div .group01 .text04.up, .data-table tbody td > div .group01 .text04.up { color: #fa4443; }

.data-table tbody th > div .group01 .text04.down, .data-table tbody td > div .group01 .text04.down { color: #2c9dff; }

.data-table tbody th > div .group01 .text05, .data-table tbody td > div .group01 .text05 { margin: 0 0 0 10px; font-size: 14px; letter-spacing: -0.1px; color: #999; }

.data-table tbody th > div .group01 .icon img, .data-table tbody td > div .group01 .icon img { width: 8px; height: 15px; }

.data-table tbody th > div .group01 .dash, .data-table tbody td > div .group01 .dash { margin: 0 4px; display: inline-block; width: 1px; height: 12px; -webkit-transform: rotate(15deg); transform: rotate(15deg); background: #d8d8d8; }

.data-table tbody th > div .group01.expansion + .graph, .data-table tbody td > div .group01.expansion + .graph { display: inline-block; }

.data-table tbody th > div .group01.expansion + .graph + .graph-support, .data-table tbody td > div .group01.expansion + .graph + .graph-support { display: inline-block; }

.data-table tbody th > div .graph, .data-table tbody td > div .graph { margin: 0 0 0 20px; display: inline-block; width: 90px; height: 26px; vertical-align: middle; overflow: visible !important; }

.data-table tbody th > div .graph-support, .data-table tbody td > div .graph-support { position: relative; top: -6px; display: inline-block; vertical-align: middle; font-size: 12px; letter-spacing: -0.09px; color: #ff3e47; }

.data-table tbody th > div .graph-support .text01, .data-table tbody td > div .graph-support .text01 { font-weight: 500; }

.data-table tbody th > div .btn-map, .data-table tbody td > div .btn-map { display: inline-block; height: 60px; line-height: 60px; }

.data-table tbody th > div .btn-map [class^=ui-svg], .data-table tbody td > div .btn-map [class^=ui-svg] { vertical-align: middle; width: 14px; height: 18px; }

.data-table tbody th > div .btn-map img, .data-table tbody td > div .btn-map img { vertical-align: middle; width: 14px; height: 18px; }

.data-table tbody th.l, .data-table tbody td.l { text-align: left; }

.data-table tbody th.c, .data-table tbody td.c { text-align: center; }

.data-table tbody th.r, .data-table tbody td.r { text-align: right; }

.data-table tbody tr:last-of-type th > div, .data-table tbody tr:last-of-type td > div { margin-bottom: 0; }

.data-table tbody tr.hover > *:first-of-type > div::after { content: ''; position: absolute; left: 0; top: 0; width: 0; height: 100%; border-left: 2px solid #2233b6; }

.data-table tbody tr.hover > *:last-of-type > div::after { content: ''; position: absolute; right: 0; top: 0; width: 0; height: 100%; border-right: 2px solid #2233b6; }

.data-table tbody tr.hover th, .data-table tbody tr.hover td { border-top-color: #2233b6; }

.data-table tbody tr.hover th > div, .data-table tbody tr.hover td > div { position: relative; }

.data-table tbody tr.hover th > div::before, .data-table tbody tr.hover td > div::before { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; border-top: 2px solid #2233b6; }

.data-table tbody tr.empty th, .data-table tbody tr.empty td { height: 280px; }

.data-table tbody tr.empty th > div, .data-table tbody tr.empty td > div { height: 280px; text-align: center; box-sizing: border-box; padding: 90px 0 0 0; }

.data-table-content:before,
.data-table-content:after { content: ''; display: table; }

.data-table tbody tr.is-opened + .data-table-chart-row { display: table-row; }
.data-table-chart-row { display: none; }
.data-table-chart-wrap { margin-top: -6px; height: auto; padding: 26px 24px; }
.data-table tbody td > .data-table-chart-wrap { height: auto; }
.data-table-chart { width: 100%; height: 340px; }

.btn-wrap { position: relative; margin: 26px 0 40px 0; text-align: center; }

.btn-wrap .right { position: absolute; right: 0; top: 0; }

.btn-wrap .left { position: absolute; left: 0; bottom: 0; }

.btn-wrap.h37 { min-height: 37px; }

.btn-wrap.mb0 { margin-bottom: 0; }

.today .chart .draw { width: 914px; height: 362px; }

.highcharts-tooltip-container { z-index: 9999 !important; }

/* 최근 일주일간 사이트 별 랭킹 */
.popup-area .type-anking { /* &::before{ content:''; position:fixed; width:200%; height:200%; left:-50%; top:-50%; background:#000; opacity:.6; } */ }

.popup-area .type-anking .inner-wrap { padding: 30px 24px 40px 24px; box-sizing: border-box; border-radius: 4px; background: #fff; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); }

.popup-area .type-anking .inner-wrap .tit { margin: 0 0 36px 0; font-size: 20px; font-weight: 500; letter-spacing: -0.1px; color: #222; }

.popup-area .type-anking .inner-wrap .search-wrap { width: 100%; overflow: hidden; margin: 0 0 10px 0; }

.popup-area .type-anking .inner-wrap .search-wrap .form-wrap { width: 357px; float: right; }

.popup-area .type-anking .inner-wrap .search-wrap .form-wrap .table-search { border-color: #dadadb; }

.popup-area .type-anking .inner-wrap .table-wrap { position: relative; max-height: 520px; overflow: auto; }

.popup-area .type-anking .inner-wrap .table-wrap .data-table { width: 100%; }

.popup-area .type-anking .inner-wrap .table-wrap .data-table thead th > div, .popup-area .type-anking .inner-wrap .table-wrap .data-table thead td > div { margin-bottom: 0; border-top: 1px solid #2233b6; border-bottom: 1px solid #2233b6; }

.popup-area .type-anking .inner-wrap .table-wrap .data-table tbody th, .popup-area .type-anking .inner-wrap .table-wrap .data-table tbody td { border-top: 0; }

.popup-area .type-anking .inner-wrap .table-wrap .data-table tbody th > div, .popup-area .type-anking .inner-wrap .table-wrap .data-table tbody td > div { margin-bottom: 0; }

.popup-area .type-anking .inner-wrap .table-wrap .data-table tbody th > div::before, .popup-area .type-anking .inner-wrap .table-wrap .data-table tbody td > div::before { display: none; }

.popup-area .type-anking .inner-wrap .table-wrap .data-table tbody th > div::after, .popup-area .type-anking .inner-wrap .table-wrap .data-table tbody td > div::after { display: none; }

/* 그룹관리 */
.group-management .create-group { padding: 5px 0 0 0; text-align: center; }

.group-management .create-group .img-section { margin: 0 0 30px 0; }

.group-management .create-group .img-section img { width: 310px; }

.group-management .create-group .txt-section { margin: 0 0 36px 0; }

.group-management .create-group .txt-section .text01 { margin: 0 0 12px 0; font-size: 20px; font-weight: 700; letter-spacing: 0.01px; color: #222; }

.group-management .create-group .txt-section .text02 { font-size: 14px; line-height: 1.57; letter-spacing: 0.01px; color: #222; }

.group-management .create-group .btn-section { padding: 0 0 146px 0; text-align: center; }

.group-management .top-section { position: relative; min-height: 37px; margin: 0 0 36px 0; }

.group-management .top-section .right { position: absolute; right: 0; top: 0; }

.group-management .top-section .right a, .group-management .top-section .right button { margin-left: 10px; }

.group-management .group-list-wrap { padding: 0 0 48px 0; }

.group-management .group-list-wrap .table { display: table; width: 100%; }

.group-management .group-list-wrap .tr { display: table-row; }

.group-management .group-list-wrap .td { display: table-cell; vertical-align: top; padding-right: 76px; }

.group-management .group-list-wrap .td .scroll-wrap { box-sizing: border-box; padding-left: 88px; }

.group-management .group-list-wrap .td.first { width: 586px; padding-right: 0; }

.group-management .group-list-wrap .td.first .parent-group { cursor: move; }

.group-management .group-list-wrap .td.first .scroll-wrap { padding-left: 76px; }

.group-management .group-list-wrap .message { padding: 170px 100px 0 0; text-align: center; }

.group-management .group-list-wrap .message .image01 { margin: 0 0 14px 0; }

.group-management .group-list-wrap .message .image01 [class^=ui-svg] { vertical-align: top; }

.group-management .group-list-wrap .message .image01 img { width: 80px; height: 80px; }

.group-management .group-list-wrap .message .text01 { font-size: 16px; font-weight: 500; line-height: 1.38; letter-spacing: 0.01px; color: #222; }

.group-management .group-list-wrap .scroll-wrap { position: relative; width: 100%; height: 545px; overflow: auto; overflow-x: visible; }

.group-management .group-list-wrap .scroll-wrap::before { content: ''; width: 6px; height: 100%; position: absolute; right: 0; top: 0; background: #fafafa; }

.group-management .group-list-wrap .ui-sortable-placeholder { display: block; width: 480px; height: 90px; margin: 0 0 16px 0; border-radius: 4px; border: 1px solid #e5e5e5; box-sizing: border-box; background: #2233b6; opacity: .1; }

.group-management .group-list-wrap .group-wrap { width: 480px; margin: 0 0 18px 0; }

.group-management .group-list-wrap .group-wrap .parent-group { margin: 0 0 0 0; }

.group-management .group-list-wrap .parent-group { width: 480px; height: 90px; margin: 0 0 16px 0; border-radius: 4px; border: 1px solid #e5e5e5; box-sizing: border-box; background: #fff; cursor: pointer; }

.group-management .group-list-wrap .parent-group .section01 { display: block; padding: 20px 0 5px 24px; }

.group-management .group-list-wrap .parent-group .section01 a, .group-management .group-list-wrap .parent-group .section01 button { display: inline-block; height: 19px; padding-right: 10px; font-size: 16px; font-weight: 700; letter-spacing: -0.1px; color: #222; background: url(/webImages/icon-group-arrow.svg) no-repeat right 9px; background-size: 7px 10px; cursor: move; }

.group-management .group-list-wrap .parent-group .section02 { display: block; padding: 0 0 0 24px; }

.group-management .group-list-wrap .parent-group .section02 .text01 { display: inline-block; margin: 0 4px 0 0; font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; }

.group-management .group-list-wrap .parent-group .section02 .text02 { display: inline-block; font-size: 13px; font-weight: 500; line-height: 1.38; letter-spacing: -0.11px; color: #666; }

.group-management .group-list-wrap .parent-group .section02 .text03 { display: inline-block; font-size: 12px; font-weight: 500; line-height: 1.5; letter-spacing: -0.1px; color: #666; }

.group-management .group-list-wrap .parent-group .section02 .dash { display: inline-block; margin: 0 8px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.group-management .group-list-wrap .parent-group .section03 { display: none; padding: 17px 0 0 24px; }

.group-management .group-list-wrap .parent-group.selected { height: 121px; border: 3px solid #2233b6; }

.group-management .group-list-wrap .parent-group.selected .section01 { padding: 20px 0 5px 24px; }

.group-management .group-list-wrap .parent-group.selected .section03 { display: block; }

.group-management .group-list-wrap .sub-group { position: relative; margin: 6px 0 6px 24px; border: 1px solid #e5e5e5; height: 64px; box-sizing: border-box; border-radius: 4px; cursor: pointer; }

.group-management .group-list-wrap .sub-group .text01 { padding: 0 0 0 24px; font-size: 16px; font-weight: 700; letter-spacing: -0.1px; color: #222; line-height: 64px; }

.group-management .group-list-wrap .sub-group .condition { position: absolute; right: 12px; top: 50%; display: block; width: 12px; height: 12px; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); }

.group-management .group-list-wrap .sub-group:last-of-type { margin-bottom: 2px; }

.group-management .group-list-wrap .sub-wrap .group-wrap .sub-group { display: none; }

.group-management .group-list-wrap .sub-wrap .group-wrap.selected .sub-group { display: block; }

/* 이용약관 : CM_01_01, CM_01_02 */
.terms { padding: 0 0 88px 0; }

.terms .top { position: relative; padding: 0 0 16px; margin: 0 0 23px 0; border-bottom: 1px solid #efefef; }

.terms .top .text01 { font-size: 16px; font-weight: 700; line-height: 1.38; letter-spacing: 0.01px; color: #222; }

.terms .top .text02 { position: relative; top: 1px; font-size: 12px; letter-spacing: -0.1px; color: #999; }

.terms .top .text02::before { content: ''; display: inline-block; margin: 0 6px 0 8px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.terms .top .text03 { position: relative; top: 1px; margin: 0 0 0 7px; font-size: 13px; color: #999; }

.terms .top .right { position: absolute; right: 0; top: 0; }

.terms .bottom .tit { margin: 0 0 16px 0; font-size: 14px; font-weight: 700; line-height: 1.57; letter-spacing: 0.01px; color: #222; }

.terms .bottom .list li { font-size: 14px; line-height: 1.57; letter-spacing: 0.01px; color: #666; margin: 0 0 8px 0; }

.terms .bottom .list li:last-of-type { margin: 0; }

.terms .bottom .list + .tit { margin-top: 40px; }

/* 알림 : CM_03 */
.notice-list .top { position: relative; padding: 0 0 12px; }

.notice-list .top .dash { margin: 0 8px; display: inline-block; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.notice-list .top .right { position: absolute; right: 0; top: 0; }

.notice-list .scroll-wrap500 { max-height: 500px; overflow-y: auto; }

.notice-list .scroll-wrap500 .scroll-element.scroll-y { right: 0; }

.notice-list .btn-wrap { margin: 12px 0 0 0; padding: 0 0 40px 0; }

/* 자주 찾는 질문 : CM_04_01 */
.faq { padding: 0 0 40px 0; }

.faq .btn-wrap { margin-bottom: 0; }

.faq .top { position: relative; height: 40px; }

.faq .top .tit { padding: 8px 0 0 0; font-size: 16px; letter-spacing: -0.13px; color: #333; font-weight: 700; }

.faq .top .right { position: absolute; right: 0; top: 0; }

.faq .top .right .form-wrap { width: 420px; }

.faq .middle { padding: 28px 0 12px; }

.faq .middle a, .faq .middle button { margin: 0 8px 0 0; display: inline-block; padding: 0 20px; height: 30px; line-height: 30px; box-sizing: border-box; border-radius: 4px; border: 1px solid #d8dbe0; font-size: 12px; font-weight: 500; letter-spacing: -0.09px; color: #a6a9b3; }

.faq .middle a.current, .faq .middle button.current { font-weight: 700; color: #2233b6; border-color: #2233b6; }

.faq .bottom .qna-list > li { border-bottom: 1px solid #efefef; }

.faq .bottom .qna-list > li.open .q .category { color: #222; font-weight: 700; }

.faq .bottom .qna-list > li.open .q .title a { color: #222; font-weight: 700; background: url(/webImages/btn-title-arrow-close.svg) no-repeat right 27px; }

.faq .bottom .qna-list > li.open .a { display: block; }

.faq .bottom .qna-list .q { height: 60px; }

.faq .bottom .qna-list .q .number { float: left; width: 66px; height: 60px; float: left; font-size: 14px; color: #222; text-align: center; line-height: 60px; }

.faq .bottom .qna-list .q .category { float: left; width: 292px; padding: 0 0 0 100px; box-sizing: border-box; font-size: 14px; color: #222; line-height: 60px; }

.faq .bottom .qna-list .q .title { float: left; width: calc(100% - 358px); }

.faq .bottom .qna-list .q .title a { display: block; margin: 0 21px 0 0; font-size: 14px; letter-spacing: -1px; color: #222; line-height: 60px; background: url(/webImages/btn-title-arrow-open.svg) no-repeat right 27px; }

.faq .bottom .qna-list .a { display: none; padding: 36px 24px 20px 24px; background: #f7f8fc; }

.faq .bottom .qna-list .a .img { margin: 0 0 16px 0; }

.faq .bottom .qna-list .a .text { font-size: 14px; line-height: 1.57; letter-spacing: -1px; color: #666; margin: 0 0 16px 0; }

.faq .bottom .qna-list .a .link { margin: 0 0 16px 0; }

.faq .bottom .qna-list .box-empty { padding: 60px 0; }

/* 1:1문의 : CM_04_02 */
.contact-center { text-align: center; padding: 23px 0 40px 0; }

.contact-center .something { margin: 45px 0 0 0; font-size: 20px; line-height: 1.4; letter-spacing: 0.01px; color: #222; }

.contact-center .something .spot { font-weight: 700; }

.contact-center .form-group { width: 500px; margin: 77px auto 0 auto; text-align: left; }

.contact-center .dash { margin: 60px 0 24px; border-top: 1px solid #eff1f7; height: 0; }

.contact-center .btn-wrap { margin-bottom: 0; }

.contact-center .btn-wrap [class^=ui-btn] { margin: 0 5px; }

/* 고객 관리 : AGRP */
.agrp .inner-area { min-height: 610px; margin-top: 24px; padding: 40px 38px 40px 40px; border-radius: 4px; background-color: #fff; }

.agrp .inner-area h3 { margin: 48px 0 16px; font-size: 20px; font-weight: 700; line-height: 26px; letter-spacing: -0.01em; }

.agrp .inner-area h3 span { font-weight: 400; }

.agrp .inner-area .inn-box { padding-bottom: 36px; text-align: center; border-bottom: 1px solid #efefef; }

.agrp .inner-area .inn-box.none { border-bottom: 0; }

.agrp .inner-area .inn-box .min-box { width: 492px; margin: 0 auto; }

.agrp .inner-area .inn-box .min-box .ttl { margin-top: 24px; margin-bottom: 2px; text-align: left; letter-spacing: -0.06em; font-weight: 500; line-height: 18px; }

.agrp .inner-area .inn-box .min-box > .ui-btn-underline-deepblue-xs-fw500-wp0 { margin-top: 20px; }

.agrp .inner-area .inn-box > .ui-icon-big-member-check { margin-top: 8px; }

.agrp .inner-area .inn-box > .text { padding-bottom: 24px; font-size: 14px; line-height: 22px; letter-spacing: -0.01em; }

.agrp .inner-area .inn-box.update h3 { line-height: 28px; }

.agrp .inner-area .terms-link-box { width: 480px; margin: 0 auto; border: 1px solid #dadadb; border-radius: 4px; text-align: center; padding: 34px 0; }

.agrp .inner-area .terms-link-box .text01 { margin: 0 0 12px 0; font-size: 16px; line-height: 1.38; letter-spacing: 0.01px; color: #222; }

.agrp .inner-area .terms-link-box .link a { margin: 0 5px; }

.agrp .inner-area .terms-check-box { margin-bottom: 24px; padding: 24px 0 60px 0; border-bottom: 1px solid #eff1f7; }

.agrp .inner-area .terms-check-box .w480 { width: 480px; padding-left: 142px; box-sizing: border-box; margin: 0 auto; }

.agrp .inner-area .terms-check-box .form-wrap { margin-bottom: 13px; }

.agrp .inner-area .terms-check-box .form-wrap:last-of-type { margin-bottom: 0; }

.agrp .inner-area.finished h4 { font-size: 16px; line-height: 24px; font-weight: 700; }

.agrp .inner-area.finished h4 span { margin-right: 4px; vertical-align: middle; position: relative; top: -3px; }

.agrp .inner-area.finished .upload { margin-top: 39px; }

.agrp .inner-area.finished .upload ol { overflow: hidden; }

.agrp .inner-area.finished .upload ol li { margin-top: 12px; font-size: 14px; color: #666; line-height: 22px; padding-left: 32px; float: left; }

.agrp .inner-area.finished .upload ol li:nth-child(1) { background: url(/webImages/list-num-1.svg) 0 0 no-repeat; background-size: 20px 20px; }

.agrp .inner-area.finished .upload ol li:nth-child(2) { background: url(/webImages/list-num-2.svg) 0 0 no-repeat; background-size: 20px 20px; }

.agrp .inner-area.finished .upload ol li:nth-child(3) { background: url(/webImages/list-num-3.svg) 0 0 no-repeat; background-size: 20px 20px; }

.agrp .inner-area.finished .list-files { overflow: hidden; padding: 40px 0 60px; margin-bottom: 24px; border-bottom: 1px solid #efefef; }

.agrp .inner-area.finished .list-files li { float: left; width: calc(50% - 22px); margin-right: 44px; }

.agrp .inner-area.finished .list-files li h4 { padding-bottom: 7px; }

.agrp .inner-area.finished .list-files li:last-child { margin-right: 0; }

.agrp .inner-area.finished .list-files .dont-up { padding-top: 8px; font-size: 14px; color: #999; line-height: 20px; font-weight: 300; letter-spacing: -0.01em; }

.agrp .inner-area.finished .list-files .dont-up span { margin: -4px 12px 0 0; vertical-align: middle; }

.agrp .inner-area.finished .inn-box { padding-bottom: 12px; }

.agrp .btn-area { text-align: center; }

.agrp .btn-area a { margin: 0 5px; }

.agrp .agree-box h4 { margin: 0 0 10px 0; font-size: 16px; line-height: 22px; font-weight: 700; }

.agrp .agree-box .prov-box { overflow-y: auto; height: 76px; padding: 8px 16px; border-radius: 4px; border: solid 1px #dadadb; background-color: #ffffff; }

.agrp .agree-box .form-wrap { padding: 10px 0 40px; }

.agrp .agree-all { padding: 12px 0 60px; border-top: 1px solid #efefef; }

.agrp .table-filter { position: relative; margin: 35px 0 12px 0; min-height: 36px; }

.agrp .table-filter .title { display: inline-block; vertical-align: middle; font-size: 12px; line-height: 30px; letter-spacing: -0.09px; color: #222; font-weight: 700; margin: 0 14px 0 0; }

.agrp .table-filter .toggle { display: inline-block; vertical-align: middle; }

.agrp .table-filter .toggle a, .agrp .table-filter .toggle button { margin: 0 7px 0 0; display: inline-block; height: 30px; line-height: 34px; padding: 0 20px; font-size: 12px; font-weight: 500; letter-spacing: -0.09px; color: #a6a9b3; background: #f1f3f8; border-radius: 4px; }

.agrp .table-filter .toggle a.current, .agrp .table-filter .toggle button.current { background: #dcefff; color: #2628b9; font-weight: 700; }

.agrp .table-filter .left { padding: 6px 0; }

.agrp .table-filter .right { position: absolute; right: 0; top: 0; }
.agrp .table-filter .right:after { content: '';display: table; clear: both; }

.agrp .table-filter .right .w132 { width: 132px; display: inline-block; vertical-align: top; margin: 0 7px 0 0; }

.agrp .table-filter .right .w357 { width: 357px; display: inline-block; vertical-align: top; }

.table-filter-item { float: left; }
.table-filter-item:after { content: '';display: table; clear: both; }
.table-filter-item + .table-filter-item { margin-left: 20px; }
.agrp .table-filter-item .title { line-height: 36px; }
.table-filter-item .title,
.table-filter-item .table-filter-select { display: block; float: left; }
.table-filter-select { width: 211px; }

.agrp .data-register { padding: 0 0 40px 0; }

.agrp .data-register .w500 { width: 500px; margin: 0 auto; padding: 0 0 60px 0; }

.agrp .data-register .btn-area { padding: 24px 0 0 0; border-top: 1px solid #efefef; }

.agrp .data-register .sub-tit { margin: 0 0 4px 0; }

.agrp .data-register .sub-tit [class^=ui-svg] { position: relative; top: -2px; margin: 0 4px 0 0; display: inline-block; vertical-align: middle; }

.agrp .data-register .sub-tit .text01 { display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 700; line-height: 1.38; letter-spacing: 0.01px; color: #222; }

.agrp .data-register .sub-tit .mandatory { display: inline-block; vertical-align: middle; margin-left: 6px; width: 4px; height: 4px; background: #2233b6; border-radius: 4px; }

.agrp .data-register .gray { font-size: 12px; font-weight: 500; letter-spacing: -0.06px; color: #999; }

.agrp .data-register .gray.fw400 { font-weight: 400; }

.agrp [class^='ui-btn'] { width: 130px; text-align: center; margin: -6px 0 -4px; }
.agrp .ui-table-type01 th { padding-top: 5px; padding-bottom: 5px; }

/* 고객관리 타이틀 : AGRP */
.page-top { position: relative; height: 36px; }

.page-top .page-tit { display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 700; letter-spacing: 0.01px; color: #222; }

.page-top .required { display: inline-block; vertical-align: middle; position: relative; top: 1px; height: 15px; position: relative; padding: 0 0 0 25px; font-size: 12px; letter-spacing: -0.1px; color: #a3a3a3; background: url(/webImages/icon-necessary.svg) no-repeat 17px 8px; }

.page-top .required::before { content: ''; position: absolute; left: 8px; top: 6px; display: inline-block; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.page-top .managing { display: inline-block; vertical-align: middle; position: relative; top: 1px; height: 15px; position: relative; padding: 0 0 0 17px; font-size: 12px; letter-spacing: -0.1px; color: #a3a3a3; }

.page-top .managing .count { font-weight: 500; }

.page-top .managing::before { content: ''; position: absolute; left: 8px; top: 6px; display: inline-block; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.page-top .right { position: absolute; right: 0; top: 0; }

/* 보고서 */
.surp .table-filter { position: relative; margin: 35px 0 12px 0; }

.surp .table-filter .left .w132 { width: 132px; display: inline-block; vertical-align: top; margin: 0 7px 0 0; }

.surp .table-filter .left .w357 { width: 357px; display: inline-block; vertical-align: top; }

.surp .table-filter .right { position: absolute; right: 0; top: 16px; }

.surp .table-filter .search-result { font-size: 14px; font-weight: 300; color: #222; }

.surp .table-filter .search-result .count { font-weight: 500; }

/* 데이터 조회 */
.data-lookup .filter { float: left; width: 301px; padding: 0 41px 0 0; box-sizing: border-box; }

.data-lookup .filter .tab { margin: 0 0 16px 0; }

.data-lookup .filter .tab a,
.data-lookup .filter .tab .tab-btn { float: left; width: 50%; height: 36px; line-height: 38px; text-align: center; font-size: 13px; font-weight: 500; color: #999; letter-spacing: -0.09px; background-color: #f4f5fb; border-radius: 4px 0 0 4px; }

.data-lookup .filter .tab a:nth-of-type(2),
.data-lookup .filter .tab .tab-btn:nth-of-type(2) { border-radius: 0 4px 4px 0; }

.data-lookup .filter .tab a:only-child,
.data-lookup .filter .tab .tab-btn:only-child { width: 100%; border-radius: 4px; }

.data-lookup .filter .tab a.current,
.data-lookup .filter .tab .tab-btn.current { font-weight: 700; color: #fff; letter-spacing: 0; box-shadow: 0 2px 4px 0 rgba(38, 40, 185, 0.2); background-color: #2233b6; }

.data-lookup .filter .tab::after { content: ''; display: table; clear: both; }

.data-lookup .filter .toggle-cont > .pannel { position: relative; width: 290px; max-height: 690px; }

.data-lookup .filter .toggle-cont > .pannel .scrollbar-inner > .scroll-element.scroll-y { right: 0; }

.data-lookup .filter .toggle-cont .site .form-wrap .check-wrap { padding: 15px 0; }

.data-lookup .filter .toggle-cont .site .form-wrap .check-wrap label.base { font-size: 14px; }

.data-lookup .filter .toggle-cont .site .form-wrap .check-wrap.checked label.base { color: #2628b9; font-weight: 700; }

.data-lookup .filter .toggle-cont .site .all { padding-left: 12px; border-bottom: 1px solid #efefef; }

.data-lookup .filter .toggle-cont .site .list > li { position: relative; border-bottom: 1px solid #efefef; padding: 0 0 0 12px; }

.data-lookup .filter .toggle-cont .site .list > li > .btn-toggle { position: absolute; right: 0; top: 0; display: block; width: 13px; height: 8px; padding: 19px 14px; background: url(/webImages/btn-title-arrow-open.svg) no-repeat center center; background-size: 13px 8px; }

.data-lookup .filter .toggle-cont .site .list > li ul { display: none; margin-left: -12px; padding: 16px 0 16px 36px; background-color: rgba(247, 248, 252, 0.56); }

.data-lookup .filter .toggle-cont .site .list > li ul .check-wrap { padding: 8px 0; }

.data-lookup .filter .toggle-cont .site .list > li ul.single { background: transparent; padding: 0 0 16px 12px; }

.data-lookup .filter .toggle-cont .site .list > li.open ul { display: block; }

.data-lookup .filter .toggle-cont .site .list > li.open > .btn-toggle { background-image: url(/webImages/btn-title-arrow-close.svg); }

.data-lookup .filter .toggle-cont .site .list > li.open > .form-wrap label.base { font-weight: 700; }

.data-lookup .filter .toggle-cont .group .list > li { border-bottom: 1px solid #efefef; }

.data-lookup .filter .toggle-cont .group .list > li > a { position: relative; height: 48px; line-height: 50px; display: block; text-indent: 12px; font-size: 14px; letter-spacing: -0.1px; color: #222; }

.data-lookup .filter .toggle-cont .group .list > li > a::after { content: ''; position: absolute; right: 0; top: 0; display: block; width: 13px; height: 8px; padding: 19px 14px; background: url(/webImages/btn-title-arrow-open.svg) no-repeat center center; background-size: 13px 8px; }

.data-lookup .filter .toggle-cont .group .list > li > a.gary { color: #999; }

.data-lookup .filter .toggle-cont .group .list > li > span, .data-lookup .filter .toggle-cont .group .list > li > .disabled { position: relative; height: 48px; line-height: 50px; display: block; text-indent: 12px; font-size: 14px; letter-spacing: -0.1px; color: #ccc; }

.data-lookup .filter .toggle-cont .group .list > li > span::after, .data-lookup .filter .toggle-cont .group .list > li > .disabled::after { content: ''; position: absolute; right: 0; top: 0; display: block; width: 13px; height: 8px; padding: 19px 14px; background: url(/webImages/btn-title-arrow-open-dim.svg) no-repeat center center; background-size: 13px 8px; }

.data-lookup .filter .toggle-cont .group .list > li > ul { display: none; background-color: rgba(247, 248, 252, 0.56); padding: 8px 12px 16px 12px; }

.data-lookup .filter .toggle-cont .group .list > li > ul a { display: block; height: 36px; line-height: 38px; font-size: 14px; letter-spacing: -0.1px; color: #222; text-indent: 12px; }

.data-lookup .filter .toggle-cont .group .list > li > ul a.checked, .data-lookup .filter .toggle-cont .group .list > li > ul a:hover, .data-lookup .filter .toggle-cont .group .list > li > ul a:focus { background: #e9f5ff; font-weight: 700; color: #2628b9; }

.data-lookup .filter .toggle-cont .group .list > li.open > a::after { background-image: url(/webImages/btn-title-arrow-close.svg); }

.data-lookup .filter .toggle-cont .group .list > li.open > ul { display: block; }

.data-lookup .filter .toggle-cont .card-wrap { padding-right: 30px; margin-top: 24px; }

.data-lookup .filter .toggle-cont .card-wrap .card { position: relative; padding: 16px 22px 16px 12px; margin-bottom: 12px; border: 2px solid #2628b9; border-radius: 4px; }

.data-lookup .filter .toggle-cont .card-wrap .card .c-tit { font-size: 14px; font-weight: 700; letter-spacing: -0.09px; color: #222; }

.data-lookup .filter .toggle-cont .card-wrap .card .count { margin: 5px 0 0 0; }

.data-lookup .filter .toggle-cont .card-wrap .card .count .t1 { font-size: 12px; line-height: 1.5; letter-spacing: -0.1px; color: #999; }

.data-lookup .filter .toggle-cont .card-wrap .card .count .t2 { margin: 0 0 0 4px; font-size: 13px; font-weight: 500; line-height: 1.38; letter-spacing: -0.11px; color: #666; }

.data-lookup .filter .toggle-cont .card-wrap .card .count .t3 { font-size: 12px; font-weight: 500; line-height: 1.5; letter-spacing: -0.1px; color: #666; }

.data-lookup .filter .toggle-cont .card-wrap .card .count .dash { display: inline-block; width: 0; height: 8px; border-left: 1px solid #dcdcdc; margin: 0 4px; }

.data-lookup .filter .toggle-cont .card-wrap .card .btn-remove { position: absolute; right: 11px; top: 21px; }

.data-lookup .filter .toggle-cont .card-wrap .card .btn-remove [class^=ui-svg] { vertical-align: top; }

.data-lookup .filter .toggle-cont .card-wrap .card.sub { border: 2px solid #2c9dff; }

.data-lookup .filter .toggle-cont .site-wrap { padding-right: 30px; }

.data-lookup .data-cont { float: left; width: calc(100% - 301px); }

.data-lookup .data-cont .cycle { padding: 0 0 16px 0; border-bottom: solid 1px #efefef; }

.cycle-tab { font-size: 0; line-height: 0; word-break: normal; }

.cycle-tab-item { display: inline-block; vertical-align: top; }

.data-lookup .data-cont .cycle a,
.cycle-tab-button { display: block; float: left; width: 64px; height: 36px; line-height: 38px; text-align: center; box-sizing: border-box; font-size: 13px; font-weight: 500; letter-spacing: -0.09px; color: #a6a9b3; background-color: #f5f7fb; border: solid 1px #d8dbe0; margin-left: -1px; }

.cycle-tab-button { float: none; }

.data-lookup .data-cont .cycle a.current,
.cycle-tab-button.is-active,
.cycle-tab-item :checked + .cycle-tab-button { font-weight: 700; color: #222; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.08); border: solid 1px #d8dbe0; background-color: #ffffff; }

.data-lookup .data-cont .cycle a:first-of-type,
.cycle-tab-item:first-of-type .cycle-tab-button { border-radius: 4px 0 0 4px; }

.data-lookup .data-cont .cycle a:last-of-type,
.cycle-tab-item:last-of-type .cycle-tab-button { border-radius: 0 4px 4px 0; }

.data-lookup .data-cont .cycle::after { content: ''; display: table; clear: both; }

.data-lookup .data-cont .graph-data { margin: 16px 0 42px 0; position: relative; }

.data-lookup .data-cont .graph-data .type a { float: left; margin-right: 10px; font-size: 12px; font-weight: 500; letter-spacing: -0.09px; color: #a6a9b3; border-radius: 4px; border: 1px solid #d8dbe0; box-sizing: border-box; height: 30px; line-height: 32px; padding: 0 20px; }

.data-lookup .data-cont .graph-data .type a sub { position: relative; top: -2px; }

.data-lookup .data-cont .graph-data .type a.current { color: #2233b6; font-weight: 700; letter-spacing: -0.09px; border: 1px solid #2233b6; }

.data-lookup .data-cont .graph-data .date { position: absolute; right: 0; top: 0; }

.data-lookup .data-cont .graph-data::after { content: ''; display: table; clear: both; }

.data-lookup .data-cont .table-tit { position: relative; margin: 0 0 12px 0; }

.data-lookup .data-cont .table-tit .t1 { font-size: 14px; line-height: 1.57; letter-spacing: 0.01px; color: #222; font-weight: 700; }

.data-lookup .data-cont .table-tit .t2 { font-size: 12px; letter-spacing: -0.1px; color: #999; }

.data-lookup .data-cont .table-tit .t2::before { content: ''; display: inline-block; margin: 0 8px; width: 0; height: 8px; border-left: 1px solid #dcdcdc; }

.data-lookup .data-cont .table-tit .right { position: absolute; right: 0; top: 0; }

.data-lookup .data-cont .table-tit .right .form-wrap { margin-top: -6px; }

.data-lookup .data-cont .table-tit .right .form-flex { margin-top: -6px; }

.data-lookup .data-cont .table-tit .right .form-flex .form-wrap { margin-top: 0; }

.data-lookup .data-cont .table-tit .right .form-flex .cycle { padding: 0; font-size: 0; line-height: 0; white-space: nowrap; border: none; }

.data-lookup .data-cont .table-tit .right .form-flex .cycle:after { display: none; }

.data-lookup .data-cont .table-tit .right .form-flex .cycle a { display: inline-block; vertical-align: top; float: none; height: auto; line-height: 28px; }

.data-lookup .data-cont .half .h-tit { height: 32px; font-size: 14px; font-weight: 700; color: #858585; }

.data-lookup .data-cont .half .h-tit sub { font-size: 10px; position: relative; top: -2px; }

.data-lookup .data-cont .half .col { width: 50%; float: left; box-sizing: border-box; }

.data-lookup .data-cont .half .col:nth-of-type(1) { padding-right: 30px; }

.data-lookup .data-cont .half .col:nth-of-type(2) { padding-left: 30px; }

.data-lookup .data-cont .half::after { content: ''; display: table; clear: both; }

.data-lookup .data-cont .layer-chart-message { width: 500px; padding: 40px 0; text-align: center; border-radius: 4px; background-color: rgba(38, 40, 185, 0.8); font-size: 16px; letter-spacing: -0.13px; color: #fff; }

.data-lookup .data-cont .chart-wrap { position: relative; height: 400px; margin: 0 0 60px 0; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-range-selector-group { -webkit-transform: translate(-46px, -10px); transform: translate(-46px, -10px); }

.data-lookup .data-cont .chart-wrap .draw .highcharts-button-box { fill: transparent !important; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-button { fill: transparent !important; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-button text { font-family: 'epot',Sans-serif !important; font-weight: 700 !important; fill: #a6a9b3 !important; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-button-hover { fill: transparent !important; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-button-pressed { fill: transparent !important; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-button-pressed text { font-weight: 700 !important; fill: #222 !important; text-decoration: underline !important; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-axis-labels span { font-size: 12px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; }

.data-lookup .data-cont .chart-wrap .draw .highcharts-axis-title { font-size: 12px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; }

.data-lookup .data-cont .chart-wrap .layer-chart-message { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin-top: -100px; }

.data-lookup .data-cont.full { width: 100%; }

.data-lookup .data-cont.full .chart-wrap { height: 484px; }

.data-lookup::after { content: ''; display: table; clear: both; }

.data-lookup + .btn-wrap { margin-top: 12px; }

.mobile { min-height: 100%; box-sizing: border-box; padding: 0 0 70px 0; background: #fff; }

html.is-pc .mobile { max-width: 480px; margin-left: auto; margin-right: auto; }

.mobile .m-header { position: relative; padding: 44px 0 12px 16px; background: #3e4248; }

.mobile .m-header .btn-logo { position: absolute; top: 12px; left: 16px; }

.mobile .m-header .btn-rotation { position: absolute; top: 8px; right: 12px; }

.mobile .m-header .m-tit [class^=ui-svg] { position: relative; top: -2px; margin-right: 6px; }

.mobile .m-header .m-tit span { vertical-align: middle; font-size: 16px; font-weight: 700; color: #fff; }

.mobile .m-header .due { margin-top: 2px; font-size: 12px; color: #a7afb9; }

.mobile .m-header .right { position: absolute; right: 16px; bottom: 13px; text-align: right; }

.mobile .m-header .right .date { font-size: 12px; letter-spacing: -0.1px; color: #a7afb9; }

.mobile .m-header .right .date .demi { font-weight: 300; }

.mobile .m-header .right .date [class^=ui-svg] { vertical-align: middle; position: relative; top: -1px; margin-right: 2px; }

.mobile .m-header .right .weather { font-size: 12px; letter-spacing: -0.1px; color: #a7afb9; }

.mobile .m-header .right .weather [class^=ui-svg] { vertical-align: middle; position: relative; top: -1px; margin-right: 2px; }

.mobile .m-chart { position: relative; margin: 21px 18px 0 16px; }

.mobile .m-chart .m-draw.h184 { height: 184px; padding-right: 70px; position: relative; }

.mobile .m-chart .m-draw.h244 { height: 244px; margin-top: -20px; }

.mobile .m-chart .m-draw.h268 { height: 268px; }

.mobile .m-chart .m-draw .chart-ui .legend .name { font-size: 12px; letter-spacing: -0.9px; color: #666; }

.mobile .m-chart .m-draw .highcharts-axis-title { font-size: 11px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; white-space: nowrap !important; }

.mobile .m-chart .m-draw .highcharts-axis-labels span { font-size: 12px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; }

.mobile .m-chart .m-draw .chart-ui .datalabels .symbol.max { position: relative; top: 5px; }

.mobile .m-chart .m-draw .highcharts-tooltip { z-index: 2; }

.mobile .m-chart .m-draw .highcharts-tooltip .highcharts-tooltip-box .m { background: #fff; }

.mobile .m-chart .m-draw .chart-ui .datalabels .symbol.max { position: relative; top: -5px; }

.mobile .m-chart .right-info { position: absolute; right: 0; top: 0; width: 70px; height: 192px; background: #eff1f7; z-index: 2; }

.mobile .m-chart .right-info > span { position: absolute; left: 0; top: 0; margin-top: 12px; font-size: 12px; font-weight: 500; padding-left: 4px; }

.mobile .m-chart .right-info > span:nth-of-type(1) { color: #2233b6; }

.mobile .m-chart .right-info > span:nth-of-type(2) { color: #ff3e47; }

.mobile .m-chart .right-info > span:nth-of-type(3) { color: #000; }

.mobile .m-chart .right-info .dash { position: absolute; left: 0; top: 0; border-left: 1px solid #2233b6; width: 0; height: 100%; }

.mobile .m-chart .right-info .dash::before { content: ''; position: absolute; left: -2px; top: -4px; display: block; width: 3px; height: 3px; background: url(/webImages/icon-necessary.svg) no-repeat 0 0; background-size: 3px 3px; border-radius: 100%; }

.mobile .m-chart .right-info .dash::after { content: ''; position: absolute; left: -2px; bottom: -4px; display: block; width: 3px; height: 3px; background: url(/webImages/icon-necessary.svg) no-repeat 0 0; background-size: 3px 3px; border-radius: 100%; }

.mobile .m-chart .right-info .info { position: absolute; left: 4px; bottom: 6px; }

.mobile .m-chart .right-info .info a, .mobile .m-chart .right-info .info button { font-size: 13px; font-weight: 500; color: #222; height: 24px; line-height: 24px; box-sizing: border-box; border: 1px solid #cdcdcd; border-radius: 4px; padding: 0 13px 0 14px; }

.mobile .m-chart .right-info .info .layer { display: none; position: absolute; right: 56px; top: 50%; padding: 10px 16px 16px 16px; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); border: 1px solid #2233b6; background: #fff; box-shadow: 0 4px 4px 0 rgba(0, 115, 255, 0.16); border-radius: 4px; }

.mobile .m-chart .right-info .info .layer [class^=ui-svg] { position: absolute; right: -9px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); }

.mobile .m-chart .right-info .info .layer div { margin-top: 6px; white-space: nowrap; }

.mobile .m-chart .right-info .info .layer div span { vertical-align: middle; }

.mobile .m-chart .right-info .info .layer div .r1 { display: inline-block; width: 21px; height: 10px; background-color: #ebf4fe; }

.mobile .m-chart .right-info .info .layer div .r2 { display: inline-block; width: 21px; height: 3px; background-color: #2233b6; }

.mobile .m-chart .right-info .info .layer div .r3 { display: inline-block; width: 21px; height: 3px; background-color: #000; }

.mobile .m-chart .right-info .info .layer div .r4 { display: inline-block; width: 21px; height: 3px; background-color: #ff3e47; }

.mobile .m-chart .right-info .info .layer div .r5 { display: inline-block; width: 21px; height: 3px; background-color: #2233b6; }

.mobile .m-chart .right-info .info .layer div .r6 { display: inline-block; width: 21px; height: 3px; background-color: #84cf85; }

.mobile .m-chart .right-info .info .layer div .r7 { display: inline-block; width: 21px; height: 6px; background-color: #e9e9e9; }

.mobile .m-chart .right-info .info .layer div .r8 { position: relative; display: inline-block; width: 21px; height: 6px; background-color: #e9e9e9; }

.mobile .m-chart .right-info .info .layer div .r8::after { content: ''; position: absolute; left: 8px; top: -5px; display: inline-block; width: 4px; height: 4px; border-radius: 100%; background: #ff3e47; }

.mobile .m-chart .right-info .info .layer div .t1 { margin-left: 8px; font-size: 12px; letter-spacing: 0.09px; color: #666; }

.mobile .m-chart .right-info .info .layer div .t2 { margin-left: 4px; font-size: 12px; color: #666; }

.mobile .m-chart .right-info .info .layer div .t2.c { letter-spacing: 0.09px; }

.mobile .m-chart .right-info.type2 { height: 107px; }

.mobile .week { margin: 0 16px 22px 46px; }

.mobile .week table { width: 100%; table-layout: fixed; }

.mobile .week table td { width: 14.28571%; border-top: 1px solid rgba(232, 232, 232, 0.5); border-bottom: 1px solid rgba(232, 232, 232, 0.5); }

.mobile .week table td .d { display: block; text-align: center; font-size: 12px; color: #999; padding-top: 7.3px; }

.mobile .week table td .w { display: block; text-align: center; padding-top: 7.7px; }

.mobile .week table td .t { display: block; text-align: center; padding: 7px 0 5px; font-size: 12px; color: #666; }

.mobile .week table td.today { background: #f1faff; }

.mobile .week table td.today .d { font-weight: 700; color: #2628b9; }

.mobile .gray-box { margin: 0 16px; border-radius: 4px; background-color: #eff1f7; padding: 16px 17px; }

.mobile .gray-box .t { font-size: 12px; font-weight: 700; letter-spacing: -0.1px; color: #222; font-weight: 700; }

.mobile .gray-box ul { margin-top: 7px; }

.mobile .gray-box li { margin-top: 3px; padding-left: 6px; }

.mobile .gray-box li span { display: inline-block; vertical-align: middle; color: #666; }

.mobile .gray-box li::before { content: ''; display: inline-block; vertical-align: middle; margin: 0 4px 0 0; position: relative; top: -1px; width: 2px; height: 2px; background: #666; }

.mobile .gray-box2 { margin: 0 16px; border-radius: 4px; background-color: #eff1f7; padding: 16px 17px; }

.mobile .gray-box2 .t { font-size: 12px; font-weight: 700; letter-spacing: -0.1px; color: #222; font-weight: 700; }

.mobile .gray-box2 .t + ul { margin-top: 7px; }

.mobile .gray-box2 ul { position: relative; }

.mobile .gray-box2 li { position: relative; margin-top: 3px; padding-left: 6px; font-size: 12px; line-height: 18px; }

.mobile .gray-box2 li span { display: inline-block; vertical-align: top; color: #666; }

.mobile .gray-box2 li span.spot { font-weight: 500; display: inline-block; vertical-align: top; }

.mobile .gray-box2 li::before { content: ''; display: block; position: absolute; top: 8px; left: 0; width: 2px; height: 2px; background: #666; }

.mobile .gray-box2 li.r { position: absolute; right: 0; bottom: -2px; }

.mobile .gray-box2 li.r .t1 { font-size: 18px; line-height: 21px; font-weight: 500; color: #222; }

.mobile .gray-box2 li.r .t2 { margin-left: 2px; font-size: 12px; line-height: 21px; font-weight: 500; color: #222; }

.mobile .gray-box2 li.r::before { display: none; }

.mobile-notice-text { font-size: 12px; line-height: 18px; color: #666; }
.mobile .gray-box2 ul + .mobile-notice-text { margin-top: 7px; }

.mobile .gray-box2 table { width: 100%; }

.mobile .gray-box2 table td { width: 50%; }

.mobile .gray-box2 table td span { vertical-align: middle; }

.mobile .gray-box2 table td span[class^=ui-svg] { position: relative; top: -1px; margin-right: 2px; }

.mobile .gray-box2 table td .b1 { font-size: 18px; font-weight: 500; color: #222; }

.mobile .gray-box2 table td .b2 { margin-left: 2px; position: relative; top: 3px; font-size: 12px; font-weight: 500; color: #222; }

.mobile .m-tab { position: fixed; left: 0; bottom: 0; width: 100%; height: 48px; background-color: #2628b9; border-radius: 4px 4px 0 0; }

.mobile .m-tab a { float: left; width: 33%; line-height: 48px; text-align: center; color: #fff; font-size: 14px; letter-spacing: -0.12px; opacity: .5; }

.mobile .m-tab a.current { opacity: 1; font-weight: 700; }

.mobile .m-tab a.last { width: 34%; }

.mobile .layer-landscape { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #fff; }

.mobile .layer-landscape .l-header { padding: 21px 40px 0 24px; }

.mobile .layer-landscape .l-header .l-tit { display: inline-block; font-size: 14px; font-weight: 700; letter-spacing: -0.12px; color: #222; margin-right: 1px; }

.mobile .layer-landscape .l-header .l-tit [class^=ui-svg] { vertical-align: middle; position: relative; top: -2px; margin-right: 8px; }

.mobile .layer-landscape .l-header .due { display: inline-block; font-size: 13px; color: #999; position: relative; top: 1px; }

.mobile .layer-landscape .l-header .due .f12 { font-size: 12px; letter-spacing: -0.1px; }

.mobile .layer-landscape .l-header .due .dash { display: inline-block; width: 0; height: 8px; border-left: 1px solid #dcdcdc; margin: 0 6px 0 8px; }

.mobile .layer-landscape .btn-close { position: absolute; top: 16px; right: 16px; }

.mobile .layer-landscape .l-chart.type1 { margin: 0 25px; height: calc(100% - 100px); }

.mobile .layer-landscape .l-chart.type2 { margin: 0 25px; height: calc(100% - 75px); }

.mobile .layer-landscape .l-chart.type3 { height: calc(100% - 154px); }

.mobile .layer-landscape .l-chart .l-draw { height: 100%; }

.mobile .layer-landscape .l-chart .chart-ui .legend .name { font-size: 12px; letter-spacing: -0.9px; color: #666; }

.mobile .layer-landscape .l-chart .highcharts-axis-title { font-size: 12px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; }

.mobile .layer-landscape .l-chart .highcharts-axis-labels span { font-size: 12px !important; font-family: 'epot',Sans-serif !important; color: #999 !important; }

.mobile .layer-landscape .l-chart .chart-ui .datalabels .symbol.max { position: relative; top: 5px; }

.mobile .layer-landscape .maxdata { padding: 16px 0 0 25px; }

.mobile .layer-landscape .maxdata [class^=ui-svg] { vertical-align: middle; position: relative; top: -1px; margin-right: 8px; }

.mobile .layer-landscape .maxdata .t1 { margin-right: 2px; font-size: 12px; letter-spacing: -0.09px; color: #222; }

.mobile .layer-landscape .maxdata .t2 { margin-right: 9.8px; font-size: 12px; letter-spacing: -0.09px; color: #999; }

.mobile .layer-landscape .maxdata .t3 { font-size: 12px; letter-spacing: -0.09px; color: #ff3e47; font-weight: 500; }

.mobile .layer-landscape .maxdata .t4 { font-size: 12px; letter-spacing: -0.09px; color: #ff3e47; }

.mobile .layer-landscape .week { position: absolute; left: 0; bottom: 0; margin: 0 24px 18px 70px; }

body.msie .data-table .btn-single { background-position-y: 26px; }

body.msie .html-chart .bar2 .series .categories .left .text02::before { top: 7px; }

body.msie .qube [class^=block] .detail .title2 .text02::before { top: 5px; }

body.msie .status-board .block .title .text02::before { top: 6px; }

body.msie .status-board .block .title .text03 { position: relative; top: 2px; }

body.msie .header .page-info .breadcrumbs .status.under { top: -2px; }

body.msie .header .page-info .info-weather .group01 .icon { position: relative; top: 5px; }

body.msie .group-management .group-list-wrap .parent-group .section01 a, body.msie .group-management .group-list-wrap .parent-group .section01 button { background-position-y: 7px; }

body.msie .form-wrap .input-wrap .outline .icon.type05 span { top: 2px; }

body.msie .form-wrap .input-wrap .outline .icon.type06 span { top: 2px; }

body.msie .form-wrap .input-wrap .outline .icon.type07 span { top: 2px; }

body.msie .pop-layer.type-alert .inner .group-detail-path .text02::before { top: 6px; }

body.msie .pop-layer.type-alert .inner .make-group .group-input .name [class^=ui-btn-] { top: -2px; }

body.msie .foot .link li a::before { top: 9px; }


/* card style */
.card-style { display: block; border-radius: 4px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.05); background: #fff; }

/* dashboard */
.dashboard-wrap { margin-top: -73px; }
.dashboard-all-usage:after,
.dashboard-top-diff:after,
.dashboard-top-diff-item-inner:after,
.dashboard-top-diff-fluctuation:after,
.dashboard-middle:after,
.dashboard-middle-section-head:after,
.site-fluctuation-head:after,
.site-fluctuation-diff:after,
.site-fluctuation-diff-item:after,
.dashboard-monthly-all-list-inner:after,
.dashboard-monthly-all-list-item:after,
.dashboard-monthly-middle-head:after,
.dashboard-monthly-middle-list-inner:after,
.dashboard-monthly-middle-diff:after,
.dashboard-monthly-middle-legend:after,
.dashboard-top-diff-section-head:after,
.dashboard-top-diff-section-fluctuation:after,
.dashboard-top-diff-section-chart-current:after { content: ''; display: table; clear: both; }
.dashboard-top-section { margin-bottom: 50px; padding: 40px 24px; }
.dashboard-all-usage { margin: 0 0 32px -40px; }
.dashboard-all-usage-item,
.dashboard-top-diff-item,
.dashboard-top-diff-section { float: left; width: 50%; box-sizing: border-box; padding-left: 40px; }
.dashboard-all-usage-date { font-size: 18px; line-height: 21px; margin-bottom: 3px; color: #999; }
.dashboard-all-usage-text { font-size: 26px; line-height: 38px; font-weight: 500; }
.dashboard-all-usage-value { display: inline-block; vertical-align: top; font-size: 12px; line-height: 15px; padding: 16px 0 7px; }
.dashboard-all-usage-value-num { display: inline-block; vertical-align: top; font-size: 50px; line-height: 60px; margin: -30px 0 -15px; }
.dashboard-top-section-chart-area { margin-bottom: 24px; padding: 27px 24px; border-radius: 4px; background: rgba(212, 212, 212, 0.1); }
.dashboard-top-section-chart { height: 385px; }
.dashboard-top-diff { margin-left: -24px; }
.dashboard-top-diff-item { padding-left: 24px; }
.dashboard-top-diff-item-inner { padding: 24px 24px 44px; border-radius: 4px; background: rgba(212, 212, 212, 0.1); }
.dashboard-top-diff-section { padding-left: 0; padding-right: 20px; }
.dashboard-top-diff-section + .dashboard-top-diff-section { padding-left: 20px; }
.dashboard-top-diff-title { font-size: 14px; line-height: 20px; font-weight: 700; margin-bottom: 32px; }
.dashboard-top-diff-fluctuation-inner { position: relative; float: left; font-size: 14px; line-height: 20px; font-weight: 500; padding: 23px 0 8px; }
.dashboard-top-diff-fluctuation-num { display: inline-block; vertical-align: top; font-size: 42px; line-height: 51px; margin: -23px 0 -8px; }
.dashboard-top-diff-fluctuation-inner:before,
.dashboard-top-diff-fluctuation-inner:after { content: ''; display: block; position: absolute; left: 100%; }
.dashboard-top-diff-fluctuation-inner:before { border: 0 solid transparent; border-width: 12px 10px; margin-left: 2px; }
.dashboard-top-diff-fluctuation-inner:after { width: 6px; height: 13px; margin-left: 9px; }
.dashboard-top-diff-fluctuation.is-up { color: #ff3e47; }
.dashboard-top-diff-fluctuation.is-up .dashboard-top-diff-fluctuation-inner:before { border-bottom-color: #ff3e47; top: 0; }
.dashboard-top-diff-fluctuation.is-up .dashboard-top-diff-fluctuation-inner:after { top: 24px; background-color: #ff3e47; }
.dashboard-top-diff-fluctuation.is-down { color: #2c9dff; }
.dashboard-top-diff-fluctuation.is-down .dashboard-top-diff-fluctuation-inner:before { border-top-color: #2c9dff; top: 24px; }
.dashboard-top-diff-fluctuation.is-down .dashboard-top-diff-fluctuation-inner:after { top: 11px; background-color: #2c9dff; }
.dashboard-top-diff-fluctuation-text { font-size: 18px; line-height: 21px; color: #666; }
.dashboard-top-diff-fluctuation-text .fluctuation-text { display: inline-block; vertical-align: top; margin: -5px 0 -4px 5px; }
.dashboard-top-diff-fluctuation-text .fluctuation-text.is-up,
.dashboard-top-diff-fluctuation-text .fluctuation-text.is-down { margin-right: 10px; }
.dashboard-top-diff-chart { margin-top: 60px; height: 240px; }
.dashboard-middle { margin-bottom: 50px; }
.dashboard-middle-section { float: left; width: 50%; box-sizing: border-box; padding: 24px; }
.dashboard-middle-section:only-child { float: none; width: auto; }
.dashboard-middle-section + .dashboard-middle-section { border-radius: 0 4px 4px 0; background: rgba(212, 212, 212, 0.1); }
.dashboard-middle-section-head { margin-bottom: 20px; }
.dashboard-middle-section-title { float: left; font-size: 14px; line-height: 20px; font-weight: 700; }
.dashboard-middle-section-head-text { float: right; font-size: 12px; line-height: 18px; color: #999; padding: 2px 0 0 13px; position: relative; }
.dashboard-middle-section-chart { height: 370px; }
.dashboard-middle-section .dashboard-top-diff-item-inner { padding: 0; background: none; }
.dashboard-middle-section .dashboard-top-diff-title { margin-bottom: 18px; }
.dashboard-middle-section .dashboard-top-diff-chart { margin-top: 14px; height: 179px; }
.dashboard-middle-section .qube.sub { margin: -24px; min-width: 0; height: auto; }
.dashboard-middle-section .qube.sub .block { position: relative; width: 100% !important; height: 330px; box-shadow: none; left: 0 !important; }
.dashboard-middle-section .qube.sub .block2,
.dashboard-middle-section .qube.sub .block3 { height: 370px; }
.dashboard-middle-section-notice-text { font-size: 14px; line-height: 20px; color: #666; margin: 20px 0 0; padding-left: 8px; position: relative; }
.dashboard-middle-section-notice-text:before { content: ''; display: block; position: absolute; top: 9px; left: 0; width: 2px; height: 2px; background: #b0b0b0; }
.status-board ~ .dashboard-middle {margin-top: 24px; margin-bottom: 0;}
.site-fluctuation-item { background: #fff; padding: 10px 20px; }
.site-fluctuation-item + .site-fluctuation-item { margin-top: 4px; }
.site-fluctuation-head { position: relative; padding: 0 80px 5px 10px; border-bottom: 1px solid #cbcbcb; }
.site-fluctuation-name { display: block; float: left; box-sizing: border-box; max-width: 100%; padding-right: 10px; position: relative; font-size: 14px; line-height: 20px; font-weight: 700; color: #555; text-overflow: ellipsis; overflow: hidden; }
.site-fluctuation-name:hover { font-weight: 700; color: #555; }
.site-fluctuation-name:before { content: ''; width: 5px; height: 5px; border: 0 solid #555; border-width: 2px 2px 0 0; position: absolute; top: 50%; right: 2px; margin-top: -4px; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.site-fluctuation-point { position: absolute; top: 0; right: 10px; font-size: 12px; line-height: 18px; font-weight: 500; padding-top: 3px; }
.site-fluctuation-point-num { display: inline-block; vertical-align: top; font-size: 18px; line-height: 21px; margin-top: -3px; }
.site-fluctuation-point:before,
.site-fluctuation-point:after { content: ''; display: block; position: absolute; left: 100%; }
.site-fluctuation-point:before { border: 0 solid transparent; border-width: 5px 4px; margin-left: 2px; }
.site-fluctuation-point:after { width: 2px; height: 5px; margin-left: 5px; }
.site-fluctuation-point.is-up { color: #ff3e47; }
.site-fluctuation-point.is-up:before { border-bottom-color: #ff3e47; top: -5px; }
.site-fluctuation-point.is-up:after { top: 5px; background-color: #ff3e47; }
.site-fluctuation-point.is-down { color: #2c9dff; }
.site-fluctuation-point.is-down:before { border-top-color: #2c9dff; top: 5px; }
.site-fluctuation-point.is-down:after { top: 0; background-color: #2c9dff; }
.site-fluctuation-diff { padding: 5px 10px 0; }
.site-fluctuation-diff-item { float: left; position: relative; font-size: 14px; line-height: 20px; }
.site-fluctuation-diff-item > div { float: left; }
.site-fluctuation-diff-item > div + div { position: relative; padding-left: 13px; }
.site-fluctuation-diff-item > div + div:before { content: ''; display: block; position: absolute; top: 5px; left: 6px; height: 10px; border-left: 1px solid #dcdcdc; }
.site-fluctuation-diff-item + .site-fluctuation-diff-item { padding-left: 60px; }
.site-fluctuation-diff-item + .site-fluctuation-diff-item:before { content: ''; display: block; position: absolute; top: 0; left: 20px; width: 20px; height: 20px; background: url('/webImages/icon-step-arrow.svg') no-repeat 50% 50%; }
.site-fluctuation-diff-val { font-size: 13px; }
.site-fluctuation-diff-val-num { font-weight: 500; font-size: 16px; vertical-align: top; }
.site-fluctuation-diff-percent { font-size: 12px; }
.dashboard-monthly-all { margin-bottom: 24px; }
.dashboard-monthly-all-head { position: relative; margin: 0 20px 10px; }
.dashboard-monthly-all-title { font-size: 26px; line-height: 31px; font-weight: 500; }
.dashboard-monthly-all-right { position: absolute; top: 4px; right: 0; font-size: 14px; line-height: 17px; padding: 9px 0 1px; color: #999; }
.dashboard-monthly-all-count { display: inline-block; vertical-align: top; font-size: 18px; line-height: 27px; font-weight: 500; margin: -8px 5px -2px; color: #222; }
.dashboard-monthly-all-slash { display: inline-block; vertical-align: top; line-height: 27px; margin: -8px 0 -2px; }
.dashboard-monthly-all-list { padding: 20px 24px; border-radius: 4px; background: rgba(212, 212, 212, 0.1); }
.dashboard-monthly-all-list:before { content: ''; display: table; }
.dashboard-monthly-all-list-inner { margin: -20px 0 0 -85px; }
.dashboard-monthly-all-list-item { float: left; padding: 20px 0 0 85px; }
.dashboard-monthly-all-list-key { float: left; font-size: 14px; line-height: 20px; font-weight: 700; padding: 6px 0 5px; margin-right: 10px; }
.dashboard-monthly-all-list-val { float: left; font-size: 12px; line-height: 18px; font-weight: 500; padding: 8px 0 5px; }
.dashboard-monthly-all-list-num { display: inline-block; vertical-align: top; font-size: 26px; line-height: 31px; margin: -8px 0 -5px; }
.dashboard-monthly-middle { margin-bottom: 50px; padding: 24px 24px 44px; }
.dashboard-monthly-middle-head { margin-bottom: 32px; }
.dashboard-monthly-middle-title { float: left; font-size: 18px; line-height: 27px; }
.dashboard-monthly-middle-title strong { font-weight: 700; }
.dashboard-monthly-middle-legend { float: left; margin: 3px 0 4px 20px; }
.dashboard-monthly-middle-legend-item { float: left; font-size: 14px; line-height: 20px; }
.dashboard-monthly-middle-legend-symbol { display: inline-block; vertical-align: top; width: 21px; height: 12px; background: #e9e9e9; margin: 4px 3px 4px 0 }
.dashboard-monthly-middle-list {margin: 0 36px;}
.dashboard-monthly-middle-list:before { content: ''; display: table; }
.dashboard-monthly-middle-list-inner {margin: 0 0 0 -102px;}
.dashboard-monthly-middle-list-item { float: left; box-sizing: border-box; width: 25%; padding-left: 102px; }
.dashboard-monthly-middle-list-title { font-size: 14px; line-height: 20px; text-align: center; font-weight: 700; margin-bottom: 5px; }
.dashboard-monthly-middle-fluctuation { text-align: center; font-size: 14px; line-height: 20px; font-weight: 500; padding: 23px 0 8px; margin-bottom: 10px; }
.dashboard-monthly-middle-fluctuation-num { display: inline-block; vertical-align: top; font-size: 42px; line-height: 51px; margin: -23px 0 -8px; }
.dashboard-monthly-middle-fluctuation-arrow { position: relative; display: inline-block; vertical-align: top; height: 51px; width: 20px; margin: -23px 0 -8px; }
.dashboard-monthly-middle-fluctuation-arrow:before,
.dashboard-monthly-middle-fluctuation-arrow:after { content: ''; display: block; position: absolute; left: 0; }
.dashboard-monthly-middle-fluctuation-arrow:before { border: 0 solid transparent; border-width: 12px 10px; }
.dashboard-monthly-middle-fluctuation-arrow:after { width: 6px; height: 13px; margin-left: 7px; }
.dashboard-monthly-middle-fluctuation.is-up { color: #ff3e47; }
.dashboard-monthly-middle-fluctuation.is-up .dashboard-monthly-middle-fluctuation-arrow:before { border-bottom-color: #ff3e47; top: 1px; }
.dashboard-monthly-middle-fluctuation.is-up .dashboard-monthly-middle-fluctuation-arrow:after { top: 25px; background-color: #ff3e47; }
.dashboard-monthly-middle-fluctuation.is-down { color: #2c9dff; }
.dashboard-monthly-middle-fluctuation.is-down .dashboard-monthly-middle-fluctuation-arrow:before { border-top-color: #2c9dff; top: 25px; }
.dashboard-monthly-middle-fluctuation.is-down .dashboard-monthly-middle-fluctuation-arrow:after { top: 12px; background-color: #2c9dff; }
.dashboard-monthly-middle-chart { width: 220px; margin: 0 auto; height: 180px; }
.dashboard-monthly-middle-chart-02 { width: 220px; margin: 0 auto; height: 280px; }
.dashboard-monthly-middle-diff-wrap { margin: 0 -40px; font-size: 0; line-height: 0; text-align: center; }
.dashboard-monthly-middle-diff-inner { display: inline-block; vertical-align: top; min-width: 220px; text-align: left; }
.dashboard-monthly-middle-diff { margin: 10px 0 0; padding-left: 90px; }
.dashboard-monthly-middle-diff-key { float: left; width: 90px; margin-left: -90px; font-size: 14px; line-height: 20px; color: #666; padding: 7px 0 4px; }
.dashboard-monthly-middle-diff-val { font-size: 12px; line-height: 18px; font-weight: 500; text-align: right; padding: 8px 0 5px; white-space: nowrap; }
.dashboard-monthly-middle-diff-num { display: inline-block; vertical-align: top; font-size: 26px; line-height: 31px; margin: -8px 0 -5px; }

.dashboard-top-diff-guide { font-size: 14px; line-height: 20px; }
.dashboard-top-diff-guide:before { content: ''; display: inline-block; vertical-align: top; margin: 4px 6px 4px 0; width: 21px; height: 12px; background: #e9e9e9; }
.dashboard-top-diff-section.type-group-dashboard { padding: 0; width: 100%; }
.dashboard-top-diff-section-head { margin-bottom: 30px; }
.dashboard-top-diff-section-head .dashboard-top-diff-title { float: left; margin-bottom: 0; }
.dashboard-top-diff-section-head .dashboard-top-diff-guide { float: left; margin-left: 20px; }
.dashboard-top-diff-section-fluctuation .dashboard-top-diff-fluctuation { float: left; }
.dashboard-top-diff-section-fluctuation .dashboard-top-diff-fluctuation-text { float: left; margin: 20px 0 0 33px; }
.dashboard-top-diff-section-fluctuation + .dashboard-top-diff-fluctuation-text { margin-top: 10px; }
.dashboard-top-diff-section-chart { margin-top: 60px; position: relative; padding-right: 235px; }
.dashboard-top-diff-section-chart-left { margin-right: 30px; }
.dashboard-top-diff-section-chart-right { position: absolute; top: 0; right: 0; width: 235px; }
.dashboard-top-diff-section-chart .dashboard-top-diff-chart { margin: 0; }
.dashboard-top-diff-section-chart-item + .dashboard-top-diff-section-chart-item { margin-top: 70px; }
.dashboard-top-diff-section-chart-prev { margin: 10px 0 0; font-size: 12px; line-height: 20px; color: #666; }
.dashboard-top-diff-section-chart-prev em { font-weight: 500; color: #222; }
.dashboard-top-diff-section-chart-current { padding: 14px 0 8px; }
.dashboard-top-diff-section-chart-data { display: block; float: left; font-size: 12px; line-height: 18px; font-weight: 500; }
.dashboard-top-diff-section-chart-data em { display: inline-block; vertical-align: top; font-size: 26px; line-height: 31px; font-weight: 500; margin: -8px 0 -5px; }
.dashboard-top-diff-section-chart-count { display: block; float: left; margin-left: 10px; font-size: 12px; line-height: 18px; color: #666; }


/* status-label */
.status-label { width: 100px; border-radius: 4px; background: #e9e9e9; text-align: center; font-size: 12px; line-height: 18px; padding: 7px 0 5px; }
.status-label-num { display: inline-block; vertical-align: top; font-size: 16px; line-height: 24px; font-weight: 500; margin: -4px 0 -2px; }

.status-label.is-red { color: #fa4443; background-color: #fedad9; }
.status-label.is-yellow { color: #ffb01a; background-color: #ffefd1; }
.status-label.is-green { color: #22b5a5; background-color: #d3f0ed; }

.data-table .status-label { margin: 15px auto; }

/* opener-button */
.opener-button { display: inline-block; vertical-align: top; position: relative; padding-right: 22px; font-size: 14px; line-height: 30px; font-weight: 700; color: #555; }
.opener-button:before { content: ''; display: block; position: absolute; top: 50%; right: 2px; margin-top: -6px; width: 6px; height: 6px; border: 0 solid #222; border-width:  0 2px 2px 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.opener-button .close-text {display: none;}

.data-table tbody tr.is-opened .opener-button:before { margin-top: -3px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); }
.data-table tbody tr.is-opened .opener-button .open-text {display: none;}
.data-table tbody tr.is-opened .opener-button .close-text {display: inline;}

.data-table .opener-button { padding-top: 15px; padding-bottom: 15px; }

/* form_flex */
.form-flex { display: table; }
.form-flex-cell { display: table-cell; vertical-align: top; width: 1px; white-space: nowrap; box-sizing: border-box; }
.form-flex-cell + .form-flex-cell { padding-left: 10px; }

.form-flex-full-width { width: 100%; }
.form-flex-cell.is-flexible{ width: auto; white-space: normal; }

/* ui-input */
.ui-input { border-radius: 4px; margin: 0; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; box-sizing: border-box; background: transparent; border: 1px solid #c0c0c0; width: 100%; height: 40px; font-size: 14px; line-height: 20px; padding: 9px 15px 9px; }
.ui-input:focus { border-color: #2233b6; }
textarea.ui-input { height: 390px; overflow: hidden; overflow-y: auto; resize: none; }
.ui-input[type='number']::-webkit-outer-spin-button,
.ui-input[type='date']::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; }
.ui-input[type='number'],
.ui-input[type='date'] { -moz-appearance: textfield; }
.ui-input::-ms-clear,
.ui-input::-ms-reveal { display: none; }
.ui-input::-webkit-search-decoration,
.ui-input::-webkit-search-cancel-button,
.ui-input::-webkit-search-results-button,
.ui-input::-webkit-search-results-decoration { display: none; }
.ui-input::-webkit-input-placeholder { opacity: 1; color: #999; }
.ui-input::-moz-placeholder { opacity: 1; color: #999; }
.ui-input:-ms-input-placeholder { opacity: 1; color: #999; }
.ui-input:-moz-placeholder { opacity: 1; color: #999; }
.ui-input[readonly] { color: #c5c5c5; background-color: #eee; }
.ui-input--disabled,
.ui-input[disabled] { opacity: 0.3; }

/* input-block-date */
.input-block-date .ui-input { padding-left: 38px; background-image: url('/webImages/icon-calendar.svg'); background-repeat: no-repeat; background-position: 15px 50%; }

/* ui-select */
.selectric-ui-select .selectric { position: relative; z-index: 0; border-radius: 4px; }
.selectric-ui-select .selectric:before { content: ''; display: block; position: absolute; top: 50%; right: 18px; z-index: 0; margin-top: -6px; width: 6px; height: 6px; border: 0 solid #222; border-width:  0 2px 2px 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.selectric-ui-select.selectric-open .selectric:before { margin-top: -3px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); }
.selectric-ui-select .selectric { position: relative; z-index: 10; border-radius: 4px; margin: 0; display: block; box-sizing: border-box; background: transparent; border: 1px solid #c0c0c0; width: 100%; height: 40px; padding: 9px 40px 9px 15px; }
.selectric-ui-select .selectric .label { display: block; margin: 0; height: auto; font-size: 14px; line-height: 20px; overflow: hidden; }
.selectric-ui-select .selectric .button { display: none; }
.selectric-ui-select.selectric-focus .selectric { border-color: #2233b6; }

/* select-block-date */
.select-block-date .selectric-ui-select .selectric { padding-left: 38px; background-image: url('/webImages/icon-calendar.svg'); background-repeat: no-repeat; background-position: 15px 50%; }

/* search-form */
.search-form .input-block-date { width: 125px; }

/* fluctuation-text */
.fluctuation-text { position: relative; padding-right: 10px; display: inline-block; vertical-align: top; font-size: 12px; line-height: 18px; padding: 7px 0 5px; }
.fluctuation-text-num { display: inline-block; vertical-align: top; font-size: 16px; line-height: 24px; font-weight: 500; margin: -4px 0 -2px; }
.fluctuation-text:before,
.fluctuation-text:after { content: ''; display: block; position: absolute; left: 100%; }
.fluctuation-text:before { border: 0 solid transparent; border-width: 5px 4px; margin-left: 2px; }
.fluctuation-text:after { width: 2px; height: 5px; margin-left: 5px; }
.fluctuation-text.is-up { color: #ff3e47; }
.fluctuation-text.is-up:before { border-bottom-color: #ff3e47; top: 3px; }
.fluctuation-text.is-up:after { top: 13px; background-color: #ff3e47; }
.fluctuation-text.is-down { color: #2c9dff; }
.fluctuation-text.is-down:before { border-top-color: #2c9dff; top: 13px; }
.fluctuation-text.is-down:after { top: 8px; background-color: #2c9dff; }

.data-table .fluctuation-text { margin: 15px auto; }

/* data-con-head */
.data-con-head { position: relative; }
.data-con-head-right { position: absolute; top: 0; right: 0; }

/* ui-radio-block */
.ui-radio-block { position: relative; z-index: 0; }
.ui-radio { position: absolute; z-index: -1; opacity: 0; width: 1px; height: 1px; margin: 0; padding: 0; }

/* form-table */
.form-table > table { table-layout: fixed; width: 100%; }
.form-table > table > tbody > tr > th { font-size: 14px; line-height: 20px; font-weight: 700; text-align: left; vertical-align: middle; padding: 8px 10px 8px 0; width: 78px; box-sizing: border-box; }

/* outline-corporate-registration-number */
.outline-corporate-registration-number { display: table; width: 100%; table-layout: fixed; }
.outline-corporate-registration-number-cell { display: table-cell; box-sizing: content-box; }
.outline-corporate-registration-number-cell + .outline-corporate-registration-number-cell { padding-left: 8px; }
.outline-corporate-registration-number-cell + .outline-corporate-registration-number-cell:before { content: ''; display: block; position: absolute; width: 8px; height: 2px; background: #979797; margin: 17px 0 0 -8px; }
.outline-corporate-registration-number-cell input,
.form-wrap .input-wrap .outline .outline-corporate-registration-number-cell input { display: block; box-sizing: border-box; width: 100%; padding: 0 10px; text-indent: 0; }
.outline-corporate-registration-number-cell:first-child input,
.form-wrap .input-wrap .outline .outline-corporate-registration-number-cell:first-child input { padding-left: 16px; }
.outline-corporate-registration-number-cell:last-child input,
.form-wrap .input-wrap .outline .outline-corporate-registration-number-cell:last-child input { padding-right: 16px; }
.outline-corporate-registration-number-cell:nth-child(1) { width: 70px; }
.outline-corporate-registration-number-cell:nth-child(2) { width: 50px; }

/* radio-list */
.radio-list-wrap:before { content: ''; display: table; }
.radio-list { margin: -10px 0 0 -15px; font-size: 0; line-height: 0; }
.radio-list-item { padding: 10px 0 0 15px; display: inline-block; vertical-align: top; width: 180px; box-sizing: content-box; }
.radio-list-item .form-wrap,
.container .data-box .radio-list-item .form-wrap { padding: 0; }

/* qube-block-summary */
.qube-block-summary { position: absolute; top: 24px; right: 24px; padding: 9px 19px; border-radius: 4px; border: 1px solid #d8dbe0; background: #f5f7fb; text-align: right; }
.qube-block-summary-title { font-size: 13px; line-height: 19px; font-weight: 500; }
.qube-block-summary-date { color: #a6a9b3; }
.qube-block-summary-content { font-size: 18px; line-height: 21px; font-weight: 500; margin-top: 3px; }
.qube-block-summary-content .small { font-size: 12px; line-height: 18px; font-weight: 400; display: inline-block; vertical-align: top; padding: 3px 0 0; }

/* mobile-header */
.mobile-header { position: relative; padding: 14px 16px 12px; background: #3e4248; color: #fff; }
.mobile-header-logo a { display: block; width: 110px; height: 20px; background: url('/webImages/footer-logo.svg') no-repeat 0 0; background-size: auto 100%; }
.mobile-header-right-top { position: absolute; top: 8px; right: 12px; }
.mobile-header-rotation { display: block; width: 30px; height: 30px; background: url('/webImages/icon-rotation.svg') no-repeat 50% 50%; }
.mobile-header-title { margin: 8px 0 2px; font-size: 16px; line-height: 20px; padding-top: 4px; font-weight: 700; }
.mobile-header-title.type-icon { padding-left: 24px; background: no-repeat 0 50%; }
.mobile-header-title.type-electricity { background-image: url('/webImages/icon-title-electricity-w.svg'); }
.mobile-header-title.type-analystics { background-image: url('/webImages/icon-analystics-w.svg'); }
.mobile-header-title.type-forecast { background-image: url('/webImages/icon-forecast-w.svg'); }
.mobile-header-row + .mobile-header-row { margin-top: 2px; }
.mobile-header-row:after { content: ''; display: table; clear: both; }
.mobile-header-row-left { float: left; }
.mobile-header-row-right { float: right; }
.mobile-header-row-text { font-size: 12px; line-height: 16px; padding-top: 2px; color: #a7afb9; }
.mobile-header-row-text.type-time { padding-left: 20px; background: url('/webImages/icon-time.svg') no-repeat 0 50%; }
.mobile-header-row-text.type-weather { padding-left: 20px; background: no-repeat 0 50%; }
.mobile-header-row-text.type-weather-01 { background-image: url('/webImages/icon-weather-01.svg'); }
.mobile-header-row-text.type-weather-02 { background-image: url('/webImages/icon-weather-02.svg'); }
.mobile-header-row-text.type-weather-03 { background-image: url('/webImages/icon-weather-03.svg'); }
.mobile-header-row-text.type-weather-04 { background-image: url('/webImages/icon-weather-04.svg'); }
.mobile-header-row-text.type-weather-05 { background-image: url('/webImages/icon-weather-05.svg'); }
.mobile-header-row-text.type-weather-06 { background-image: url('/webImages/icon-weather-06.svg'); }

/* week-weather */
.week-weather { margin: 7px 16px 22px 46px; border: 0 solid #e8e8e8; border-width: 1px 0; font-size: 0; line-height: 0; text-align: center; }
.week-weather__item { display: inline-block; vertical-align: top; width: 14.285714%; padding: 4px 0; }
.week-weather__day,
.week-weather__celsius { font-size: 12px; line-height: 18px; }
.week-weather__day { color: #999; }
.week-weather__celsius { color: #666; }
.week-weather__icon { margin: 5px 0 2px; height: 24px; background: no-repeat 50% 50%; }
.week-weather__icon.type-01 { background-image: url('/webImages/icon-weather-01-black.svg'); }
.week-weather__icon.type-02 { background-image: url('/webImages/icon-weather-02-black.svg'); }
.week-weather__icon.type-03 { background-image: url('/webImages/icon-weather-03-black.svg'); }
.week-weather__icon.type-04 { background-image: url('/webImages/icon-weather-04-black.svg'); }
.week-weather__icon.type-05 { background-image: url('/webImages/icon-weather-05-black.svg'); }
.week-weather__icon.type-06 { background-image: url('/webImages/icon-weather-06-black.svg'); }
.week-weather__item.is-active { position: relative; }
.week-weather__item.is-active { background-color: #f1faff; }
.week-weather__item.is-active:before { content: ''; display: block; position: absolute; top: -1px; left: -1px; right: -1px; bottom: -1px; border: 2px solid #2233b6; }
.week-weather__item.is-active .week-weather__day { font-weight: 500; color: #2628b9; }

/* info-tooltip */
.info-tooltip { position: relative; display: inline-block; vertical-align: top; width: 20px; height: 20px; background: url('/webImages/icon-nodata.svg') no-repeat 50% 50%; }
.info-tooltip-layer { position: absolute; top: 100%; left: -50px; display: none; }
.info-tooltip:hover { z-index: 1000; }
.info-tooltip:hover .info-tooltip-layer { display: block; }
.info-tooltip-contents { position: relative; margin-top: 12px; box-shadow: 0 4px 4px rgba(0, 115, 255, 0.16); border: 1px solid #2233b6; border-radius: 5px; padding: 12px 14px; background: #fff; font-size: 12px; line-height: 18px; white-space: nowrap; font-weight: 400; }
.info-tooltip-contents:before { content: ''; position: absolute; top: -6px; left: 54px; display: block; width: 9px; height: 9px; border: 0 solid #2233b6; border-width: 1px 0 0 1px; background: #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/* layer-inner-contents */
.layer-inner-contents-wrap { max-height: 710px; overflow: auto; border-radius: 0 0 4px 4px; }
.layer-inner-contents { padding: 22px; background: #eff1f7; }
.layer-inner-contents .status-board { margin-top: 0; }
.pop-layer.type-wide { width: 1356px; left: 0; right: 0; margin-left: auto; margin-right: auto; }
.pop-layer.type-alert .layer-inner-contents-wrap { margin-left: -24px; margin-right: -24px; }
.layer-inner-contents-title { font-size: 16px; line-height: 22px; font-weight: 700; margin-bottom: 12px; }

.layer-inner-contents-wrap.type-report .layer-inner-contents,
.layer-inner-contents-wrap.type-none-bg .layer-inner-contents { padding-top: 8px; padding-bottom: 0; background: none; }
.layer-inner-contents-wrap.type-report .table-filter { margin-top: 0; }
.layer-inner-contents-wrap.type-report [class^="ui-table"][class*="-type01"] td { padding-top: 12px; padding-bottom: 12px; }

.layer-inner-contents .step-box .inner-area { padding: 0; box-shadow: none; background: none; margin: 0; border-radius: 0; min-height: 0; }
.layer-inner-contents .step-box .inner-area.finished .upload { margin-top: 0; width: auto; }
.layer-inner-contents .step-box .inner-area.finished .list-files { width: auto; }
.layer-inner-contents .step-box .inner-area.finished .list-files + .btn-area { border-top: none; padding: 0 0 40px; margin-top: -24px; }

.layer-alert-contents .data-box { margin-left: 0; }
.layer-alert-contents .data-box .form-wrap { max-width: none; }
.layer-alert-contents .form-wrap:first-child { padding-top: 0; }

/* dashboard-partner */
.dashboard-partner { padding: 25px 24px 40px; }
.dashboard-partner .ui-table-type01 th,
.dashboard-partner .ui-table-type01 td { line-height: 20px; }
.dashboard-partner .ui-table-type01 th:not(.t-c),
.dashboard-partner .ui-table-type01 td:not(.t-c) { padding-left: 20px; }
.dashboard-partner .fluctuation-text.is-up,
.dashboard-partner .fluctuation-text.is-down { margin-right: 10px; }
.dashboard-partner .ui-btn-surface-radius-deepblue-md-wp24 { margin-top: -10px; margin-bottom: -7px; }

/* customer-management-status */
.customer-management-status { margin-top: -73px; padding-left: 360px; }
.customer-management-status:after,
.customer-management-status-left:after,
.customer-management-status-right-inner:after { content: ''; display: table; clear: both; }
.customer-management-status-left { float: left; margin-left: -360px; width: 360px; box-sizing: border-box; padding: 54px 24px 48px; }
.customer-management-status-left-key { float: left; font-size: 26px; line-height: 38px; font-weight: 500; }
.customer-management-status-left-val { float: left; padding: 14px 0 6px; margin-left: 13px; font-size: 12px; line-height: 18px; font-weight: 500; }
.customer-management-status-left-val em { display: inline-block; vertical-align: top; font-size: 50px; line-height: 60px; font-weight: 500; margin: -28px 0 -14px; }
.customer-management-status-right { background: #fafafa; border-radius: 0 4px 4px 0; padding: 49px 24px 50px; overflow: hidden; }
.customer-management-status-right-inner { margin-left: -60px; }
.customer-management-status-item { float: left; box-sizing: border-box; padding-left: 60px; width: 33.333333%; }
.customer-management-status-item-key { font-size: 14px; font-weight: 500; margin-bottom: 5px; }
.customer-management-status-item-val { position: relative; padding-right: 80px; }
.customer-management-status-item-count { position: absolute; right: 0; bottom: 0; font-size: 12px; line-height: 18px; font-weight: 500; }
.customer-management-status-item-count em { display: inline-block; vertical-align: top; font-size: 16px; line-height: 22px; font-weight: 500; margin: -3px 0 -1px; }
.customer-management-status-item-bar { height: 18px; background: rgba(133, 218, 134, 0.2); }
.customer-management-status-item-bar-active { height: 100%; background: #85da86; }
.customer-management-status-item-bar.is-blue { background-color: rgba(34, 51, 182, 0.2); }
.customer-management-status-item-bar.is-blue .customer-management-status-item-bar-active { background-color: #2233b6; }
.customer-management-status-item-bar.is-red { background-color: rgba(255, 62, 71, 0.2); }
.customer-management-status-item-bar.is-red .customer-management-status-item-bar-active { background-color: #ff3e47; }

.customer-management-status + .content-box { margin-top: 50px; }

/* switch */
.ui-switch-block { position: relative; z-index: 0; }
.ui-switch-block .ui-checkbox { position: absolute; left: 0; z-index: -1; opacity: 0; }
.ui-switch-object { position: relative; display: block; width: 40px; height: 20px; border-radius: 10px; background: #6d7278; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; }
.ui-switch-object-handle { display: block; position: absolute; top: -2px; left: 0; width: 24px; height: 24px; border-radius: 100%; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.24); background: #fff; box-sizing: border-box; -webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; }
.ui-switch-object-handle:before { content: ''; display: block; position: absolute; top: 50%; left: 50%; margin: -5px 0 0 -4px; width: 8px; height: 10px; box-sizing: border-box; background: #fff; border-radius: 4px; border: 2px solid #6d7278; }
.ui-switch-block .ui-checkbox:checked + .ui-label .ui-switch-object { background-color: #2233b6; }
.ui-switch-block .ui-checkbox:checked + .ui-label .ui-switch-object-handle { -webkit-transform: translateX(16px); transform: translateX(16px); }
.ui-switch-block .ui-checkbox:checked + .ui-label .ui-switch-object-handle:before { margin-left: -1px; width: 2px; background-color: #2233b6; border-radius: 1px; border: none; }

/* inner-area-bottom */
.inner-area-bottom { margin-top: 144px; border-top: 1px solid #efefef; padding-top: 38px; }
.inner-area-bottom-item:after { content: ''; display: table; clear: both; }
.inner-area-bottom-item-key { float: left; font-size: 12px; line-height: 18px; font-weight: 400; color: #666; padding: 1px 0; margin-right: 4px; }
.inner-area-bottom-item-val { float: left; }

.inner-area.user-data .btn-area { position: relative; }
.inner-area.user-data .btn-area .inner-area-bottom-item { position: absolute; top: 14px; left: 0; }

/* data-box type-report */
.data-box.type-report .form-wrap { padding-top: 0; }

/* upload-hr */
.upload-hr { border-top: 1px solid #efefef; margin: -20px 0 0; }

/* popup-form-section */
.popup-form-section + .popup-form-section { margin-top: 60px; }
.popup-form-section-head { padding-bottom: 12px; border-bottom: 1px solid #555; margin-bottom: 25px; }
.popup-form-section-head:after { content: ''; display: table; clear: both; }
.popup-form-section-title { float: left; font-size: 16px; line-height: 24px; font-weight: 700; }
.popup-form-section-sub-title { margin-left: 8px; padding: 4px 0 2px; float: left; font-size: 12px; line-height: 18px; color: #999; }
.popup-form-section .data-box { margin-left: 20px; }
.popup-form-section .data-box + .data-box { margin-top: 60px; }
.popup-form-section-head + .data-box { margin-top: 44px; }
.popup-form-section-layout { margin-left: 20px; }
.popup-form-section-layout:after { content: ''; display: table; clear: both; }
.popup-form-section-layout-cell { float: left; width: 492px; }
.popup-form-section-layout-cell + .popup-form-section-layout-cell { margin-left: 140px; }
.popup-form-section-layout-cell .form-wrap + .form-wrap { margin-top: 24px; }
.popup-form-section-layout-cell .input-wrap { margin-bottom: 8px; }

/* btn-area type-popup-form */
.btn-area.type-popup-form { padding: 30px 0 40px; font-size: 0; line-height: 0; text-align: center; }
.btn-area.type-popup-form [class^="ui-btn"] { vertical-align: top; }
.btn-area.type-popup-form [class^="ui-btn"] + [class^="ui-btn"] { margin-left: 10px; }

/* join-end-text */
.join-end-text { font-size: 20px; line-height: 22px; font-weight: 700; text-align: center; padding: 0 0 60px; border-bottom: 1px solid #efefef; margin-bottom: 25px; }

.chart-ui .legend .symbol.type28 { width: 6px; height: 6px; background: #222; }