@charset "utf-8";

/*------------------------------------------------------------------------
[common_reset.css]
> 폰트 설정 - 스타일 초기화

> (!중요) 클래스 분기 구조
	> 언어 클래스 분기
		1. html에 lang 속성 활용 
			> 한국어(기본) : lang="ko"
			> 영어 : lang="en"
			> 일본어 : lang="ja"
		2. body에 클래스 추가
			> 한국어(기본) : .lang-ko
			> 영어 : .lang-en
			> 일본어 : .lang-ja
	> 플랫폼 클래스 분기
	> 서비스 클래스 분기
------------------------------------------------------------------------*/


/*------------------------------------------------------------
# 폰트 설정
------------------------------------------------------------*/


/*----------------------------------------
Web font : lang="ko"
----------------------------------------*/

@font-face {
	font-family: 'NanumBarunGothic';
	src: local('NanumBarunGothic');
	src: url('/res/font/NanumBarunGothic.eot');
	src: url('/res/font/NanumBarunGothic.eot?#iefix') format('embedded-opentype'), url('/res/font/NanumBarunGothic.woff') format('woff'), url('/res/font/NanumBarunGothic.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'NanumBarunGothic';
	src: local('NanumBarunGothicBold');
	src: url('/res/font/NanumBarunGothicBold.eot');
	src: url('/res/font/NanumBarunGothicBold.eot?#iefix') format('embedded-opentype'), url('/res/font/NanumBarunGothicBold.woff') format('woff'), url('/res/font/NanumBarunGothicBold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}


/*----------------------------------------
Web font : lang="en"
----------------------------------------*/

@font-face {
	font-family: 'notosansweb';
	src: local('NotoSans-Regular');
	src: url('/res/font/NotoSans-Regular.eot');
	src: url('/res/font/NotoSans-Regular.eot?#iefix') format('embedded-opentype'), url('/res/font/NotoSans-Regular.woff') format('woff'), url('/res/font/NotoSans-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'notosansweb';
	src: local('NotoSans-Bold');
	src: url('/res/font/NotoSans-Bold.eot');
	src: url('/res/font/NotoSans-Bold.eot?#iefix') format('embedded-opentype'), url('/res/font/NotoSans-Bold.woff') format('woff'), url('/res/font/NotoSans-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}


/*----------------------------------------
Web font : lang="jp"
----------------------------------------*/

@font-face {
	font-family: 'notosansweb-jp';
	font-style: normal;
	font-weight: normal;
	src: url('/res/font/NotoSansJP-Regular.woff2') format('woff2'), url('/res/font/NotoSansJP-Regular.woff') format('woff'), url('/res/font/NotoSansJP-Regular.otf') format('opentype');
}

@font-face {
	font-family: 'notosansweb-jp';
	font-style: normal;
	font-weight: bold;
	src: url('/res/font/NotoSansJP-Bold.woff2') format('woff2'), url('/res/font/NotoSansJP-Bold.woff') format('woff'), url('/res/font/NotoSansJP-Bold.otf') format('opentype');
}

html, body {
	font-family: NanumBarunGothic, '나눔바른고딕', 'Malgun Gothic', '맑은 고딕', helvetica, sans-serif;
	color: #505050;
	font-size: 13px;
	line-height: 1em;
}

body.lang-ja {
	font-family: notosansweb-jp, "Yu Gothic", meiryo, "メイリオ", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", arial, helvetica, sans-serif;
}

body.lang-en {
	font-family: notosansweb, arial, helvetica, sans-serif;
}


/*----------------------------------------
Web font : 폰트아이콘 (OWUI-fontIco)
----------------------------------------*/

@font-face {
	font-family: 'OWUI-fontIco';
	src: url('/res/font/icon/OWUI-fontIco.eot?tx0hg6');
	src: url('/res/font/icon/OWUI-fontIco.eot?tx0hg6#iefix') format('embedded-opentype'), url('/res/font/icon/OWUI-fontIco.ttf?tx0hg6') format('truetype'), url('/res/font/icon/OWUI-fontIco.woff?tx0hg6') format('woff'), url('/res/font/icon/OWUI-fontIco.svg?tx0hg6#OWUI-fontIco') format('svg');
	font-weight: normal;
	font-style: normal;
}
  
[class^="owui-fontIco-"], [class*=" owui-fontIco-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'OWUI-fontIco' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	/* Better Font Rendering */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}


/*------------------------------------------------------------------
Reset - General
------------------------------------------------------------------*/

html {
	-ms-text-size-adjust: 100%;
	/* -webkit-text-size-adjust: 100%; */
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, img, fieldset, legend, p, button, input, table, th, tr, td, thead, tbody, tfoot, a, textarea, label, del, dfn, em, ins, kbd,
q, s, samp, select, small, strike, strong, sub, sup, tt, var, acronym, form, blockquote, abbr, pre, address, big, cite, code {	margin: 0;	padding: 0; }

li { list-style: none; }

em { font-style: normal; }


/*----------------------------------------
Reset - Link
----------------------------------------*/

a {	background-color: transparent; cursor: pointer !important; }

a:link, a:visited { color: #505050; text-decoration: none; outline: 0; }

a:active, a:hover {	color: #222; text-decoration: none; outline: 0; }


/*----------------------------------------
Reset - Text-level semantics
----------------------------------------*/

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

dfn { font-style: italic; }

address {
	font-style: normal;
	color: #999;
	font-size: 12px;
	line-height: 12px;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	line-height: 0;
}

input[type=text], input[type=password] {
	width: 100%;
	height: 23px;
	font-size: 1em;
	line-height: 1em;
	border: 1px solid #bbb;
	padding: 3px 5px;
	color: #666;
	font-weight: normal;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-appearance: none;
	-moz-appearance: none;
}

textarea {
	font-size: 1em;
	line-height: 1em;
	border: 1px solid #bbb;
	padding: 3px 5px;
	color: #666;
	overflow: auto;
	resize: none;
	font-weight: normal;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

input[type=submit] {
	font-weight: normal;
}

button, select {
	font-weight: normal;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}


/*----------------------------------------
Reset - Embedded content
----------------------------------------*/

img, fieldset, iframe {
	border: 0;
	border-style: none;
}

svg:not(:root) {
	overflow: hidden;
}

audio, canvas, progress, video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}


/*----------------------------------------
Reset - Grouping Content
----------------------------------------*/

figure {
	margin: 1em 40px;
}

hr {
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	height: 0;
}


/*----------------------------------------
Reset - Selection
----------------------------------------*/

::-webkit-selection {
	background: #c6c6c6;
	color: #fff;
	text-shadow: none;
}

::-moz-selection {
	background: #c6c6c6;
	color: #fff;
	text-shadow: none;
}

::selection {
	background: #c6c6c6;
	color: #fff;
	text-shadow: none;
}


/*----------------------------------------
Reset - Contain overflow, em-unit font size
----------------------------------------*/

pre {
	overflow: auto;
}

code, kbd, pre, samp {
	font-family: monospace, monospace;
	font-size: 1em;
}


/*----------------------------------------
Reset - Forms
----------------------------------------*/

button {
	padding: 0;
	margin: 0;
	background: transparent;
	*overflow: visible;
	overflow: visible;
	cursor: pointer;
	border: 0 none;
	white-space: nowrap;
	color: inherit;
	font: inherit;
	text-transform: none;
}

button, input, optgroup, select, textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

select {
	text-transform: none;
}

button, html input[type=button], input[type=reset], input[type=submit] {
	-webkit-appearance: button;
	cursor: pointer;
}

input[type=image] {
	cursor: pointer;
}

button[disabled], html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner, input::-moz-focus-inner {
	border: 0;
	padding: 0;
}


/*----------------------------------------
Reset - Blind
----------------------------------------*/

.blind, #skipnavi {
	position: absolute;
	top: 0;
	left: 0;
	width: 1px;
	height: 1px;
	overflow: hidden;
	visibility: hidden;
	font-size: 0;
	line-height: 0;
}

caption, legend {
	visibility: hidden;
	height: 0;
	font-size: 0;
	line-height: 0;
	width: 0;
	overflow: hidden;
	text-align: left;
	border: 0;
}


/*----------------------------------------
Reset - Input
----------------------------------------*/

input {
	line-height: normal;
}

input[type=checkbox], input[type=radio] {
	box-sizing: border-box;
	vertical-align: middle;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

optgroup {
	font-weight: bold;
}


/*----------------------------------------
Reset - Tables
----------------------------------------*/

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td, th {
	padding: 0;
}


/*----------------------------------------
Reset - Float clear
----------------------------------------*/

.clear_f:after {
	content: "";
	display: block;
	clear: both;
}

.clear_f {
	*zoom: 1;
}


/*----------------------------------------
Reset - Placeholder
----------------------------------------*/

::-webkit-input-placeholder {
	color: #ccc;
}

:-moz-placeholder {
	color: #999;
}

::-moz-placeholder {
	color: #999;
}

:-ms-input-placeholder {
	color: #ccc;
}/*------------------------------------------------------------------------
[common_global.css]
> 공통 글로벌 스타일
------------------------------------------------------------------------*/


/*----------------------------------------
# Color
----------------------------------------*/

.color_blue01,
.color_officeBlue,
.color-officeBlue {
	color: #0059a6;
}

.color_green01 {
	color: #1f8c13;
}

.color_skyblue01 {
	color: #3c9df0;
}

.color_yellowgreen01 {
	color: #93c911;
}

.color_yellow01 {
	color: #ffba00;
}

.color_yellow02,
.color_warningYellow {
	color: #f3a600;
}

.color_orange01 {
	color: #ff6600;
}

.color_orange01-1{
	color:#ff6600;
}

.color_officeGray {
	color: #505050;
}

.color_gray01 {
	color: #767676;
}

.color_gray02,
.color_999 {
	color: #999999;
}

.color_gray03 {
	color: #aaaaaa;
}

.color_gray04 {
	color: #bbbbbb;
}

.color_gray05 {
	color: #c0c0c0;
}


/*----------------------------------------
# Typography 
----------------------------------------*/


/*--------------------
Font - Size
--------------------*/

[class*="Text-11"] {
	font-size: 11px;
}

[class*="Text-12"] {
	font-size: 12px;
}

[class*="Text-13"] {
	font-size: 13px;
}

[class*="Text-14"] {
	font-size: 14px;
}

[class*="Text-15"] {
	font-size: 15px;
}

[class*="Text-16"] {
	font-size: 16px;
} 

[class*="Text-18"] {
	font-size: 18px;
} 

[class*="Text-20"] {
	font-size: 20px;
} 

[class*="Text-24"] {
	font-size: 24px;
}

.headText,
.bodyText,
.labelText,
.subText,
[class*="headText"],
[class*="bodyText"],
[class*="labelText"],
[class*="subText"] {
	line-height: 1.4;
}


/*--------------------
headText
--------------------*/

[class*="headText"] {
	font-weight: bold;
}


/*--------------------
labelText
--------------------*/

[class*="labelText"] {
	font-weight: bold;
}

.headText.color_officeBlue {
	color: #0059a6;
}


/*--------------------
subText
--------------------*/

.subText {
	font-size: 12px;
	color: #aaa;
}


/*--------------------
Typography - Box Model
--------------------*/

.headText + .dualNumberCounter {
	margin-top: 10px;
}

.headText + table.policyTable,
.headText + .radioBtnGroupVertical {
	margin-top: 8px;
}

.bodyText>.elBadge {
	margin-left: 4px;
	position: relative;
	top: 1px;
}


/*----------------------------------------
# Float
----------------------------------------*/

.float_left,
.float-left {
	float: left;
}

.float_right,
.float-right {
	float: right;
}


/*----------------------------------------
# Dispaly
----------------------------------------*/

.dispTblCell {
	display: table-cell;
	vertical-align: middle;
}


/*----------------------------------------
# Vertical-align
----------------------------------------*/

.vertAlignTop {
	vertical-align: top !important;
}


/*----------------------------------------
# white-space
----------------------------------------*/

.wtspace_pre_line {
	white-space: pre-line;
}


/*------------------------------
# text-align
------------------------------*/

.text_align_center,
.text-align-center {
	text-align: center;
}

.text_align_right,
.text-align-right {
	text-align: right;
}

.text_align_left,
.text-align-left {
	text-align: left;
}


/*------------------------------
# font
------------------------------*/

.font_bold, .font-bold {
	font-weight: bold;
}

.font_reg, .font-reg {
	font-weight: normal;
}


/*------------------------------
# line-height
------------------------------*/

.line_height_1point5 {
	line-height: 1.5;
}


/*------------------------------
# scroll text box
------------------------------*/

.wrap_text_scroll_gray textarea {
	width: 100%;
	border: 1px solid #ddd;
	background: #f4f4f4;
	overflow-y: scroll;
	overflow-x: none;
}


/*------------------------------
# width
------------------------------*/

.width100 {
	width: 100px !important;
}

.width120 {
	width: 120px !important;
}

.width200 {
	width: 200px !important;
}

.width400 {
	width: 300px !important;
}


/*------------------------------
# display
------------------------------*/

.disp_none {
	display: none;
}

.disp_block {
	display: block;
}

.disp_in_blockm,
.disp-inBlock,
.disInBlock {
	display: inline-block;
}


/*------------------------------
# visibilty
------------------------------*/

.vis_hidden {
	visibility: hidden;
}

.vis_visible {
	visibility: visible;
}


/*----------------------------------------
# z-index
----------------------------------------*/

.z100 {
	z-index: 100;
}

.z110 {
	z-index: 110;
}

.z120 {
	z-index: 120;
}

.z130 {
	z-index: 130;
}

.z140 {
	z-index: 140;
}

.z150 {
	z-index: 150;
}


/*----------------------------------------
# Margin
----------------------------------------*/

.margin_top_2 {
	margin-top: 2px;
}

.margin_top_30 {
	margin-top: 30px;
}

.margin_top_40 {
	margin-top: 40px;
}

.margin_top_18 {
	margin-top: 18px;
}

.margin_top_8 {
	margin-top: 8px;
}

.margin_right_8,
.marginRight8 {
	margin-right: 8px;
}

.margin_right_6,
.marginRight6 {
	margin-right: 6px !important;
}

.margin-_right_2 {
	margin-right: 2px;
}

.margin_right_4,
.marginRight4 {
	margin-right: 4px;
}

.margin_right_18 {
	margin-right: 18px !important;
}

.margin_bottom_2 {
	margin-bottom: 2px;
}

.margin_bottom_20 {
	margin-bottom: 20px;
}

.margin_bottom_4 {
	margin-bottom: 4px;
}

.margin_left_4 {
	margin-left: 4px;
}

.margin_left_2 {
	margin-left: 2px;
}
 

/*----------------------------------------
# padding
----------------------------------------*/

.noPadUp {
	padding-top: 0 !important;
}

[class*="-padUp6"],
.row[class*="-padUp6"],
.col[class*="-padUp6"] {
    padding-top: 6px;
} 

[class*="-padUp12"],
.row[class*="-padUp12"],
.col[class*="-padUp12"] {
    padding-top: 12px;
}

[class*="-padDown2"],
.row[class*="-padDown2"],
.col[class*="-padDown2"] {
    padding-bottom: 2px;
}

[class*="-padDown6"],
.row[class*="-padDown6"],
.col[class*="-padDown6"] {
    padding-bottom: 6px;
}

[class*="-padDown12"],
.row[class*="-padDown12"],
.col[class*="-padDown12"] {
    padding-bottom: 12px;
}

[class*="-padDown20"],
.row[class*="-padDown20"],
.col[class*="-padDown20"] {
    padding-bottom: 20px;
}


/*----------------------------------------
IE - placeholder - hacked code
----------------------------------------*/

:-ms-input-placeholder {
	/* IE 10+ */
	color: #bbb !important;
}/*--------------------------------------------------------------------------------
[language.css]
> 다국어 대응
--------------------------------------------------------------------------------*/

html[lang='en'] .wrap_menu_login .menu03 span.text{
	width:100px;
}

html[lang='en'] .contents_login_userform label[for='user_info09']{
	word-wrap:	break-word;
}

.list_pagenavi{
	display: none;
}

.layout_card .area_content .multi_contents>li .vert_section.type01 {
    /* width: 112px; */
    /* max-width: 215px; */
    margin-right: 25px;
    word-wrap: break-word;
}

/* html[lang='ja'] */


.header_topbar .area_topbar ul.list_topbar > li.list05-global > a{
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list05.png);*/
	background-image:url(/res/images/common/img_launcher_backup_ok_small.png);
	background-repeat: no-repeat;
	background-size: 22px;
}
.header_topbar .area_topbar ul.list_topbar > li.list05-global > a >  span.text::after {
	display: none;
}

.set_layer_popup.size_1300>ul.content_wrapper>li {
	width: 1300px;
}


.footer_logoCopyrightWrapper{
	float:	right;
}/*--------------------------------------------------------------------------------
[layout_frame.css]
> layout - frame - common 
--------------------------------------------------------------------------------*/

/*------------------------------------------------------------
Layout - Common
------------------------------------------------------------*/

html, body {
	height: 100%;
	color: #505050;
	/* height: auto; */
}

* {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.wrapper {
	width: 100%;
	height: auto;
}

.container {
	width: 1240px;
	margin: 0 auto;
	min-height: 100%;
	background-color: #f3f3f3;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	background-image: url('/res/images/common_sideBar_gnb/bgImg_sideBarBg_ow.svg');	
	background-repeat: repeat-y;
	background-position: 0 0;
	/* background:url(../images/common/bg_wrapper_v2.png) repeat-y; */
}

.wrap_footer {
	clear: both;
	padding-top: 14px;
}

.footer {
	height: 50px;
	/* border-top: 1px dashed #ccc; */
}

.footer .copyrights {
	font-size: 11px;
	line-height: 11px;
	color: #999;
	text-align: center;
	padding-top: 3px;
}


/*----------------------------------------
Layout - Common - Exosphere
----------------------------------------*/

.Exosphere .header {
	position: fixed;
}

.Exosphere .header .wrap_header_topbar {
	height: 72px;
	border-color: #0059a6;
	box-shadow: 0 2px 6px rgba(100, 100, 100, .25);
	-webkit-box-shadow: 0 2px 6px rgba(100, 100, 100, .25);
	-moz-box-shadow: 0 2px 6px rgba(100, 100, 100, .25);
}

.Exosphere .header .wrap_header_topbar:before {
	content: "";
	display: block;
	width: 100%;
	height: 6px;
	background: #0059a6; /* Old browsers */
	background: -moz-linear-gradient(left, #0059a6 0%, #62b1f5 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #0059a6 0%,#62b1f5 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #0059a6 0%,#62b1f5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0059a6', endColorstr='#62b1f5',GradientType=1 ); /* IE6-9 */
}

.Exosphere .wrapper .container {
	padding-top: 72px;
	/* border-left: 0; */
	position: relative;
}


/*------------------------------------------------------------
Contents - 실제 컨텐츠 표시 컨테이너
------------------------------------------------------------*/

.contents { 
	/*
	- 1. OK용 기본 형태
	- 2. 서브사이드 메뉴 존재 시 형태
	- (주의) 주요 컨텐츠에 대한 랩퍼로, 가급적 수정하지 않도록 함
	- (주의) z-index 이슈로 position: relative 할당 금지
	*/
	float:right;
	width: 1028px;
	background: #f3f3f3;
	padding: 0 20px;
	min-height: calc(100vh - 72px);
}


/*----------------------------------------
Contents - Exosphere - Layout
----------------------------------------*/

.Exosphere .contents {
	/*
	- 1. EXSP용 기본 형태
	- 2. 확장된 컨텐츠(contents) 형태
	*/
	width: 1185px;
	min-height: calc(100vh - 72px);
	padding: 0 98.5px;
	position: relative;
	z-index: 81;
}

.Exosphere .wrap_gnb_sub+.contents,
.Exosphere .wrap_gnb_sub+script+.contents {
	width: 1028px;
	padding: 0 20px;
	box-shadow: inset 2px 0 5px rgba(0,0,0,0.13);
}


/*------------------------------------------------------------
Contents - 실제 컨텐츠 표시 컨테이너
------------------------------------------------------------*/

/*----------------------------------------
Contents - .area_pagenavi (페이지타이틀)
----------------------------------------*/

.contents .area_pagenavi {
	height: 56px;
}

.Exosphere .contents .area_pagenavi {
	/* Exosphere */
	height: auto;
}

.contents .area_pagenavi h3 {
	float: left;
}

.contents .area_pagenavi h3 a {
	display: block;
	overflow: hidden;
}

.contents .area_pagenavi h3 a.title_page {
	float: left;
	font-size: 26px;
	line-height: 1;
	font-weight: bold;
	color: #0059a6;
	margin-top: 24px;
	overflow: visible;
	cursor: text !important;
}

.Exosphere .contents .area_pagenavi h3 a.title_page {
	/* Exosphere */
	margin-top: 8px;
	font-size: 32px;
	margin-bottom: 10px;
	letter-spacing: -1px;
} 

.contents .area_pagenavi h3 a.btn_pagetip {
	float: left;
	width: 20px;
	height: 20px;
	text-indent: -9999px;
	background: url(/res/images/common/btn_pagenavi_tip.png) no-repeat;
	margin: 26px 0 0 10px;
}


/*----------------------------------------
Breadcrumb (브레드크럼 - 네비게이션 - list_pagenavi)
----------------------------------------*/

.contents .area_pagenavi ul.list_pagenavi {
	float: left;
	height: 20px;
	margin: 31px 0 0 11px;
}

.lang-ja .contents .area_pagenavi ul.list_pagenavi {
	display: none;
}

.lang-en .contents .area_pagenavi ul.list_pagenavi {
	display: none;
}

.contents .area_pagenavi ul.list_pagenavi li:last-child:after {
	content: "";
	display: inline-block;
	background: url(/res/images/common/icon_pagenavi_slash.png) no-repeat;
	width: 5px;
	height: 19px;
	position: relative;
	float: right;
	left: 7px;
}

.contents .area_pagenavi ul.list_pagenavi li {
	float: left;
	background: url(/res/images/common/icon_pagenavi_slash.png) no-repeat;
	padding: 0 8px 0 10px;
}

.contents .area_pagenavi ul.list_pagenavi li a {
	display: inline-block;
	height: 20px;
	color: #90a5c1;
	cursor: default !important;
}

.contents .area_pagenavi ul.list_pagenavi li.list_home a {
	background: url(/res/images/common/icon_pagenavi_home.png) no-repeat;
	padding-left: 16px;
	cursor: default;
}


/*----------------------------------------
Breadcrumb (브레드크럼 - 네비게이션 - list_pagenavi) - Exosphere
----------------------------------------*/

.Exosphere .list_pagenavi_type02 {
	display: block;
	margin-top: 28px;
}

.Exosphere .list_pagenavi_type02 .list_menu {
	display: inline-block;
	color: #888;
	font-size: 12px;
}

.Exosphere .list_pagenavi_type02 .list_menu:after {
	content: ">";
	display: inline-block;
	margin: 0 4px;
}

.Exosphere .list_pagenavi_type02 .list_menu:last-child:after {
	display: none;
}


/*----------------------------------------
Contents - Button - GoPage (관련 메뉴 바로가기)
----------------------------------------*/

.contents .area_pagenavi .btn_gopage {
	float: right;
	/*margin-top:17px;*/
	margin-top: 22px;
}

.contents .area_pagenavi .btn_gopage a.btn_middle.btncolor_gray_no_sdw {
	background: #fff;
}

.contents .area_pagenavi .btn_gopage a.btn_middle.btncolor_gray_no_sdw:hover {
	background: #f0f0f0;
}


/*------------------------------------------------------------
Contents - .areaPageTab (페이지 탭)
------------------------------------------------------------*/

.area_pagetab {
	padding: 10px 0 7px;
}

.area_pagetab ul {
	width: 100%;
	height: 45px;
	border-bottom: 2px solid #0059a6;
}

.area_pagetab ul li {
	float: left;
	padding-right: 2px;
}

.area_pagetab ul li a {
	display: block;
	overflow: hidden;
	font-size: 13px;
	line-height: 13px;
	height: 45px;
	min-width: 163px;
	border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-bottom: 2px solid #0059a6;
	font-weight: bold;
}

.area_pagetab ul li a span.text {
	display: block;
	padding: 16px 14px 0;
	text-align: center;
	position: relative;
	bottom: 1px;
}

.area_pagetab ul li.on a {
	background: #fff;
	color: #0059a6;
	border-left: 1px solid #0059a6;
	border-top: 1px solid #0059a6;
	border-right: 1px solid #0059a6;
}

.area_pagetab ul li.on a {
	background: #fff;
	color: #0059a6;
}

.area_pagetab ul li.off a {
	color: #999999;
	background: #fff;
	font-weight: normal;
	border-left: 1px solid #bbb;
	border-top: 1px solid #bbb;
	border-right: 1px solid #bbb;
	height: 43px;
	margin-top: 2px;
	-webkit-transition: margin-top  0.1s ease-in-out 0s,  height 0.1s ease-in-out 0s;
	-moz-transition: margin-top 0.1s ease-in-out 0s,  height 0.1s ease-in-out 0s;
	transition: margin-top 0.1s ease-in-out 0s, height 0.1s ease-in-out 0s;
}

.area_pagetab ul li.off a:hover {
	color: #767676;
	border-top: 1px solid #999;
	border-right: 1px solid #999;
	border-left: 1px solid #999;
	margin-top: 0;
	height: 45px;	
}


/*------------------------------------------------------------
Contents - menuHub (메뉴허브)
------------------------------------------------------------*/

.area_menuHub .layout_card .row-inCard-default {
	padding: 28px 26px 0;
}

.area_menuHub .layout_card .row-inCard-default:last-of-type {
	padding-bottom: 24px;
}


.area_menuHub .menuHub-title a {
	color: #0059a6;
	font-weight: bold;
	font-size: 16px;
}

.area_menuHub .menuHub-title a:hover {
	text-decoration: underline;
}

.area_menuHub .menuHub-content>.row a div.col {
	padding-top: 4px; 
	padding-bottom: 4px;
}

.area_menuHub .menuHub-content>.row:first-child a div.col {
	padding-top: 0;
}

.area_menuHub .menuHub-content a:hover span {
	color: #0059a6;
	text-decoration: underline;
}

.area_menuHub .menuHub-content a:hover i {
	opacity: 0.7;
}

.area_menuHub .menuHub-content .horzDivider {
	margin: 8px auto 8px
}


/*------------------------------------------------
메뉴 별 높이 조정 
> 향후 자동화 필요
------------------------------------------------*/

/*----------------------
메뉴 별 높이 조정 - EXSP - 로그
----------------------*/

.area_menuHub div[class*="menuHub-logs-"] .area_content {
	height: 320px;
}


/*----------------------
메뉴 별 높이 조정 - EXSP - 정책 설정
----------------------*/

.area_menuHub div[class*="menuHub-policySetup-"] .area_content {
	height: 358px;
}


/*----------------------
메뉴 별 높이 조정 - EXSP - 시스템 설정
----------------------*/

.area_menuHub div[class*="menuHub-settings-"] .area_content {
	height: 282px;
}


/*------------------------------------------------------------------------------------------------
[layout_frame_topbar.css]
> Layout - Topbar
------------------------------------------------------------------------------------------------*/


/*------------------------------------------------------------------------
Header
------------------------------------------------------------------------*/

.header {
	width: 100%;
	position: relative;
	z-index: 100;
	min-width: 1240px;
}

.wrap_header_servicebar {
	width: 100%;
	height: 31px;
	background: #012a48;
}


/*------------------------------------------------
Header - 에스원
------------------------------------------------*/

.skin_s1ps_left {
	display: block;
	width: 100%;
	height: 65px;
	background: url(/res/images/ps/bg_topbar_left.png) no-repeat left 0;
}

.skin_s1ps_right {
	display: block;
	width: 100%;
	height: 65px;
	background: url(/res/images/ps/bg_topbar_right.png) no-repeat right 0;
}

@media(max-width:1400px) {
	.skin_s1ps_left {
		background: none;
	}
	.skin_s1ps_right {
		background: none;
	}
}


/*------------------------------------------------------------------------------------
# 헤더탑바 : 서비스탑바(서비스모아보기)
------------------------------------------------------------------------------------*/

/* header  - 상단 서비스 선택 메뉴 */

.header_servicebar {
	width: 1240px;
	margin: 0 auto;
	height: 31px;
}

.header_servicebar a.btn_global {
	float: left;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 42px;
	height: 31px;
	cursor: pointer;
	background-image: url(/res/images/common/btn_servicebar_serviceglobal_big.png);
	background-position: center;
	background-repeat: no-repeat;
	border-right: 1px solid #3b5e77;
	border-left: 1px solid #3b5e77;
	/*background:url(/res/images/common/btn_servicebar_serviceglobal.png) no-repeat 50% 50%;*/
	/*border-left:1px solid #00406f;border-right:1px solid #00406f;*/
	/* border-left: 1px solid #004a81; // 17.08.21까지 사용된 색 */
	/* border-right: 1px solid #004a81; // 17.08.21까지 사용된 색 */
	/* border-left: 1px solid #014f8a; */
	/* border-right: 1px solid #014f8a; */
	/* border-right: 1px solid #00599c; */
	/* border-left: 1px solid #00599c; */
}

.header_servicebar a.btn_global:hover {
	background-color: #043960;
	background-image: url(/res/images/common/btn_servicebar_serviceglobal_big.png);
}

.header_servicebar ul.list_service {
	float: left;
	height: 31px;
}

.header_servicebar ul.list_service li {
	float: left;
}

.header_servicebar ul.list_service li a {
	display: block;
	overflow: hidden;
	padding: 0 16px;
	height: 31px;
	border-right: 1px solid #3b5e77;	
	text-align: center;
	/*border-right:1px solid #00406f;*/
	/*border-right:1px solid #216ba2;*/
	/* border-right: 1px solid #004a81; */
	/* border-right: 1px solid #014f8a; */
}

.header_servicebar ul.list_service li a:hover {
	background: #043960;
}

.header_servicebar ul.list_service li a:hover span.text {
	color: #fff;
}

.header_servicebar ul.list_service li a.on {
	background: #0059a6;
}

.header_servicebar ul.list_service li a.on span.text {
	color: #fff;
}

.header_servicebar ul.list_service li a.on:hover {
	background: #0059a6;
}

.header_servicebar ul.list_service li a span.text {
	display: inline-block;
	padding: 8px 0;
	font-size: 12px;
	line-height: 15px;
	color: #a1b4c1;
}

.header_servicebar ul.list_service li.list_off a span.text {
	color: #708798;
}

.header_servicebar ul.list_service li.list_off a:hover {
	background: #012a48;
}


/*============================================
# 헤더탑바 : 로고표시영역
=============================================*/

/* header  - 상단 로고 및 서브메뉴 */

.wrap_header_topbar {
	position: relative;
	width: 100%;
	height: 66px;
	box-shadow: 0 2px 5px rgba(100, 100, 100, .25);
	-webkit-box-shadow: 0 2px 5px rgba(100, 100, 100, .25);
	-moz-box-shadow: 0 2px 5px rgba(100, 100, 100, .25);
	border-bottom: 1px solid #bbb;
	background-color: #fff;
	/* height: 67px */
}

.wrap_header_topbar .header_topbar {
	width: 1240px;
	margin: 0 auto;
	height: 66px;
}


/*============================================
# 헤더탑바 : 공통메뉴영역
=============================================*/
.header_topbar .area_topbar {
	float: right;
	z-index: 110;
}

.header_topbar .area_topbar a.btn_alert_msg {
	float: left;
	display: block;
	width: 30px;
	height: 30px;
	background: url(/res/images/common/icon_topbar_alert.png) no-repeat;
	margin: 17px 20px 0 0;
	z-index: 120;
}

.header_topbar .area_topbar a.btn_alert_msg span.text_new {
	position: relative;
	display: inline-block;
	min-width: 18px;
	height: 18px;
	border-radius: 16px;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	background: #ff6600;
	color: #fff;
	padding: 5px;
	font-size: 11px;
	line-height: 10px;
	margin-left: 18px;
	text-align: center;
	z-index: 121;
	bottom: 4px;
}

.header_topbar .area_topbar ul.list_topbar {
	float: left;
	height: 66px;
}

div.area_topbar ul.list_topbar {
	border-left: 1px solid #bbb;
}

.header_topbar .area_topbar ul.list_topbar>li {
	position: relative;
	float: left;
}

.header_topbar .area_topbar ul.list_topbar>li>a {
	display: block;
	overflow: hidden;
	width: 80px;
	/*height:65px;*/
	height: 66px;
	border-right: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
	font-weight: bold;
	color: #0059a6;
	background-color: #fff;
	background-position: 50% 10px;
}

.header_topbar .area_topbar ul.list_topbar > li > a:hover {
	opacity: 0.7;
}

.header_topbar .area_topbar ul.list_topbar > li > a > span.text {
	/* 공통메뉴 - 텍스트 */
	display:block;
	text-align:center;
	padding-top:35px;
	font-size:12px;
	line-height:12px;
}

.lang-en .header_topbar .area_topbar ul.list_topbar > li > a > span.text {
	/* 영문 - 공통메뉴 - 텍스트 - 너비 조정 */
	letter-spacing: -1px;
}
.lang-ja .header_topbar .area_topbar ul.list_topbar > li > a > span.text {
	/* 공통메뉴 - 텍스트 - 일본어 조정 */
	font-size: 11px;
}

.lang-ja .header_topbar .area_topbar ul.list_topbar > li.list06 > a > span.text {
	/* 공통메뉴 - 텍스트 - 일본어 조정 - 기술지원센터 */ 
	letter-spacing: -1px;
}

.header_topbar .area_topbar ul.list_topbar > li > a > span.text::after {
	content: "";
	display: block;
	width: 7px;
	height: 4px;
	background: url('/res/images/common/icn_commonMenu_arrowDown.png') no-repeat;
	margin: 5px auto 0;
}

.header_topbar .area_topbar ul.list_topbar>li.list01>a {
	/*border-left:1px solid #bbb; list01이 없을 수 있는 경우가 있어서 해당 경계선은 다른 css로 옮김 (dev_css)*/
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list01.png);*/
	background-image: url(/res/images/common/icon_topbar_rightmenu_list01_small.png);
	background-repeat: no-repeat;
}

.header_topbar .area_topbar ul.list_topbar>li.list02>a {
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list02.png) ;*/
	background-image: url(/res/images/common/icon_topbar_rightmenu_list02_small.png);
	background-repeat: no-repeat;
	/*background-position: 50% 1px;*/
}

.header_topbar .area_topbar ul.list_topbar>li.list03>a {
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list03.png) ;*/
	background-image: url(/res/images/common/icon_topbar_rightmenu_list03_small.png);
	background-repeat: no-repeat;
}

.header_topbar .area_topbar ul.list_topbar>li.list04>a {
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list04.png) ;*/
	background-image: url(/res/images/common/icon_topbar_rightmenu_list04_small.png);
	background-repeat: no-repeat;
}

.header_topbar .area_topbar ul.list_topbar>li.list05>a {
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list05.png);*/
	background-image: url(/res/images/common/icon_topbar_rightmenu_list05_small.png);
	background-repeat: no-repeat;
}

.header_topbar .area_topbar ul.list_topbar>li.list05>a>span.text::after {
	display: none;
}

.header_topbar .area_topbar ul.list_topbar>li.list06>a {
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list06.png);*/
	background-image: url(/res/images/common/icon_topbar_rightmenu_list06_small.png);
	background-repeat: no-repeat;
}

.header_topbar .area_topbar ul.list_topbar>li.list07>a {
	/*background-image:url(/res/images/common/icon_topbar_rightmenu_list07.png);*/
	background-image: url(/res/images/common/icon_topbar_rightmenu_list07_small.png);
	background-repeat: no-repeat;
}

.header_topbar .area_topbar .sub_menu_list {
	position: absolute;
	top: 66px;
	left: -1px;
	min-width: 200px;
	box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	-webkit-box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	-moz-box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	z-index: 112;
}

.header_topbar .area_topbar .sub_menu_list span.bar_top {
	display: block;
	background: #0059a6;
	border-left: 1px solid #004170;
	border-right: 1px solid #004170;
	height: 6px;
}

.header_topbar .area_topbar .sub_menu_list ul {
	background: #fff;
	border-left: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
	border-right: 1px solid #bbb;
	padding: 6px 13px;
}

.header_topbar .area_topbar .sub_menu_list ul li {
	border-bottom: 1px solid #ddd;
}

.header_topbar .area_topbar .sub_menu_list ul li>a {
	display: block;
	overflow: hidden;
	padding: 12px 4px;
	line-height: 1.3;
}

.header_topbar .area_topbar .sub_menu_list ul li>a:hover {
	color: #0c51a1;
}

.header_topbar .area_topbar .sub_menu_list ul li:last-child {
	border-bottom: none;
}


/*------------------------------------------------------------------ 
헤더탑바 - 현황위젯
------------------------------------------------------------------*/

.area_statusWidget {
    border: 1px solid #bbb;
    padding: 7px 25px 6px;
    border-radius: 3px;
    float: left;
    position: relative;
    top: 9px;
    margin-right: 10px;
    cursor: pointer;
	/* float: left;	
	position: relative;
	top: 17px;
	margin-right: 10px;
	cursor: pointer; */
}

.area_statusWidget:hover {
	opacity: 0.7;
}

.area_statusWidget .agentInstallStatus {
	display: block;
	text-align: center;
	margin-bottom: 2px;
	margin-top: 2px;
	position: relative;
	bottom: 1px;
}

.area_statusWidget .agentInstallStatus>li {
	display: inline-block;
}

.area_statusWidget .agentInstallStatus>li>i {
	background-image: url(/res/images/common_icn/icn_statusWidget_agentInstall.svg);
	background-repeat: no-repeat; 
	background-size: 18px 36px;
	width: 18px;
	height: 12px;
	display: inline-block;
}

.area_statusWidget .agentInstallStatus>li.installed>i {
	background-position: 0 0;
}

.area_statusWidget .agentInstallStatus>li.notInstalled>i {
	background-position: 0 -12px;
}

.area_statusWidget .agentInstallStatus>li.notDefined>i {
	background-position: 0 -24px;
}

.area_statusWidget .agentInstallStatus>li>span {
	color: #0059a6;
	display: inline-block;
	font-size: 12px;
	margin-left: 2px;
	margin-right: 8px;
	position: relative;
	bottom: 2px;
}

.area_statusWidget .agentInstallStatus>li:last-child>span {
	margin-right: 0
}

.area_statusWidget .agentInstallStatus>li.notDefined>span {
	color: #ff6600;
}

.area_statusWidget .licenseExpDate {
	display: block;
	text-align: center;
	position: relative;
	bottom: 1px;
}

.area_statusWidget .licenseExpDate>span {
	display: inline-block;
	color: #888;
	font-size: 11px;
}

.area_statusWidget~.vertDivider {
	height: 26px;
    top: 19px;
}


/*--------------------
툴팁
--------------------*/

.area_statusWidget_tooltip {
	width: 178px;
	margin-top: 60px;
}

.area_statusWidget_tooltip .row>.col:first-child {
    font-weight: bold;
    color: #0059a6;
}

.area_statusWidget_tooltip .row:nth-child(3)>.col:first-child {
    color: #ff6600;
}


/*------------------------------------------------------------------ 
헤더탑바 - 관리자 정보
------------------------------------------------------------------*/

.header_topbar .area_topbar .area_admin_info {
	float: left;
	height: 66px;
}

.header_topbar .area_topbar .area_admin_info ul.list_info {
	float: left;
	padding: 13px 19px 0 12px;
	font-size: 12px;
	line-height: 12px;
	color: #505050;
}

.header_topbar .area_topbar .area_admin_info ul.list_info li {
	padding: 3px 0 6px 24px;
	max-width: 150px;
	min-width: 76px;
	;
}

.header_topbar .area_topbar .area_admin_info ul.list_info li.name_office {
	background: url(/res/images/common/icon_topbar_info01.png) no-repeat;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	background-position: 0 1px;
	float: left;
}

.header_topbar .area_topbar .area_admin_info ul.list_info li.name_admin {
	background: url(/res/images/common/icon_topbar_info02.png) no-repeat;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	background-position: 0 2px;
	float: left;
	clear: both;
	min-width: 0;
}

.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg {
	position: relative;
	display: inline-block;
	overflow: hidden;
	width: 65px;
	height: 43px;
	margin-top: 11px;
}

.Exosphere .header_topbar .area_topbar .area_admin_info a.btn_select_officeimg {
	width: 54px;
}
	
.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg:hover .select_img {
	opacity: .7;
}

.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg .select_img {
	overflow: hidden;
	width: 43px;
	height: 43px;
	background: #ddd;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border: 1px solid #0059a6;
}

.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg .select_img div.logo_img {
	width: 40px;
	height: 40px;
}

.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg .select_img div.logo_img.default {
	background: url(/res/images/common/logo_img_default.png) no-repeat;
	background-size: 100%;
}

.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg span.icon_arrow{
	position: absolute;
	top: 16px;
	right: 6px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 11px;
	height: 12px;
	background: url(/res/images/common/btn_foldarrow_down_skyblue.png) no-repeat;
}

.Exosphere .header_topbar .area_topbar .area_admin_info a.btn_select_officeimg span.icon_arrow {
	display: none;
}

.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg span.icon_arrow_on{
	position: absolute;
	top: 16px;
	right: 6px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 11px;
	height: 12px;
	background: url(/res/images/common/btn_foldarrow_up_skyblue.png) no-repeat;
}

.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg:hover span.icon_arrow,
.header_topbar .area_topbar .area_admin_info a.btn_select_officeimg:hover span {
	opacity: 0.7;
}


/* 상단 사용자 메뉴 */

.header_topbar .area_topbar .area_admin_info .menu_list {
	position: relative;
}

.header_topbar .area_topbar .area_admin_info .menu_list ul {
	position: absolute;
	top: 11px;
	right: 0;
	box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	-webkit-box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	-moz-box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	background: #fff;
	z-index: 111;
	border: 1px solid #bbb;
}

.header_topbar .area_topbar .area_admin_info .menu_list ul li a {
	display: block;
	overflow: hidden;
	padding: 12px 13px;
	font-size: 12px;
	line-height: 1.2;
}

.header_topbar .area_topbar .area_admin_info .menu_list ul li a:hover {
	background: #f5f5f5;
}

.header_topbar .area_topbar .area_admin_info .menu_list ul div.adminMenuHead {
	margin: 0 12px 2px;
	border-bottom: 1px solid #0059a6;
	color: #0059a6;
	padding: 13px 0 10px;
	font-size: 12px;
}/*--------------------------------------------------------------------------------
[layout_frame_topbar_productAndService.css]
> Topbar - Product and Service Name 

# 제품 이름 & 아이콘
# 서비스 이름 & 아이콘
--------------------------------------------------------------------------------*/


/*------------------------------------------------------------
# 제품 이름 & 아이콘
------------------------------------------------------------*/

.header_topbar h1 {
	height: 66px;
}

.header_topbar h1.logo_s1ps {
	float: left;
	padding-left: 14px;
}

.header_topbar>h1 a {
	opacity: 1;
	transition: opacity 0.25s ease-in-out;
}

.header_topbar>h1 a:hover {
	opacity: 0.85;
	transition: opacity 0.25s ease-in-out;
}


/*----------------------------------------
S1PS
----------------------------------------*/

html[lang='ko'] .header_topbar h1.logo_s1ps a {
	float: left;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 93px;
	height: 22px;
	margin-top: 21px;
}

html[lang='ko'] .header_topbar h1.logo_s1ps a {	
	/* S1PS - logo - lang-ko */
	background: url(/res/textimages/kopsh1_logo.png) no-repeat;
}

html[lang='en'] .header_topbar h1.logo_s1ps a {
	/* S1PS - logo - lang-en */
	background: url(/res/textimages/enpsh1_logo.png) no-repeat;
}

html[lang='ja'] .header_topbar h1.logo_s1ps a {
	/* S1PS - logo - lang-ja */
	background: url(/res/textimages/japsh1_logo.png) no-repeat;
}

.header_topbar h1.logo_ok {
	float: left;
	padding-left: 14px;
}


/*----------------------------------------
OK
----------------------------------------*/

.header_topbar h1.logo_ok a {
	float: left;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 174px;
	height: 32px;
	margin-top: 16px;
	background: url(/res/images/js/h1_logo_ok_emboss.png) no-repeat;
}

.schb .header_topbar h1.logo_ok a {
	/* SecuHub Logo */
	width: 128px;
	background: url(/res/images/common_topBar_logo/h1_logo_schb.png) no-repeat;
}

.header_topbar h1.logo_ks {
	/* 카이츠키퍼 */
	float: left;
	padding-left: 14px;
}

.header_topbar h1.logo_ks a {
	/* 카이츠키퍼 */
	width: 174px;
	height: 32px;
	margin-top: 17px;
	background: url(/res/images/ks/h1_logo_ks.png) no-repeat;
}


/*----------------------------------------
EXSP
----------------------------------------*/

.Exosphere .header_topbar h1.logo_ok a {
	/* Exosphere Logo */
	width: 340px;
	height: 38px;
    background-image: url(/res/images/common_topBar_logo/h1_logo_exspep.svg);
	background-size: 332px;
	background-repeat: no-repeat;
	background-position: 0;
    position: relative;
    bottom: 5px;
    right: 6px;
}


/*----------------------------------------
오피스메신저
----------------------------------------*/

.OfficeMessenger .header_topbar h1.logo_ok a,
.js.Messenger .header_topbar h1.logo_ok a {
	width: 213px;
	background: url(/res/images/js/h1_logo_omsg.png);
}


/*------------------------------------------------------------
# 서비스 이름 & 아이콘
------------------------------------------------------------*/

.header_topbar .text_servicename {
	float: left;
	display: block;
	margin: 1px 0 0 14px;
	/* padding-left: 10px; */
	/* background: url(/res/images/common/img_topbar_serviceicon_bar.png) no-repeat 0 25px; */
}

.header_topbar .text_servicename:before {
	/* 디바이더 */
	content: "";
    display: block;
    float: left;
    width: 1px;
    height: 18px;
    background: #bbb;
	margin-top: 24px;
	margin-right: 10px;
}

.header_topbar .text_servicename span.text {
	float: left;
	font-size: 17px;
	line-height: 17px;
	color: #0059a6;
	margin: 24px 0 0 6px;
	font-weight: bold;
}

.lang-en .header_topbar .text_servicename span.text {
	/* 영문 - 서비스명 - 텍스트- 너비 조정 */
	letter-spacing: -1px;
}

.header_topbar h1 .text_servicename span.image01 {
	float: left;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 30px;
	height: 30px;
}

.header_topbar h1.logo_s1ps .text_servicename span.image01 {
	/* S1 PS */
	margin: 16px 0 0 4px;
	background: url(/res/images/ps/img_topbar_serviceicon01_s1.png) no-repeat;
}

.header_topbar h1.logo_ok .text_servicename span.image01 {
	/* OK */
	margin: 16px 0 0 3px;
	background: url(/res/images/js/img_topbar_serviceicon01_ok.png) no-repeat;
}


/*----------------------------------------
오피스키퍼 서비스
----------------------------------------*/

.NAC .header_topbar h1.logo_ok .text_servicename span.image01 {
	/* 부가서비스 - 설치유도서버 */
	display: block;
	width: 33px;
	height: 30px;
	margin: 18px 0 0 5px;
	background: url(/res/images/common_topBar_svcLogo/img_launcher_NAC.png) no-repeat;
}

.svc-printerManage .header_topbar h1.logo_ok .text_servicename span.image01 {
	/* 부가서비스 - 복합기 관리 */
	display: block;
	width: 33px;
	height: 30px;
	margin: 18px 0 0 5px;
	background: url(/res/images/common_topBar_svcLogo/img_launcher_printerManage.png) no-repeat;
}

.OfficeKeeper.ETC .header_topbar h1.logo_ok .text_servicename div.bg_img {
	/* 부가서비스 - 기타관리 */
	display: none;
	float: left;
	width: 33px;
	height: 30px;
	margin: 20px 0 0 5px;
	background: url(/res/images/custom/img_launcher_ok_etc.png) no-repeat;
	background-size: 100%;
}

.OfficeKeeper.NAC .header_topbar h1.logo_ok .text_servicename div.bg_img {
	/* 부가서비스 - 설치유도서버 */
	display: none;	
	float: left;
	width: 33px;
	height: 30px;
	margin: 19px 0 0 5px;
	background: url(/res/images/custom/img_launcher_ok_nac.png) no-repeat;
	background-size: 100%;
}

.OfficeKeeper.NAC.lang-en .header_topbar h1.logo_ok .text_servicename span.text {
	font-size: 14px;
}

.OfficeKeeper.FileBackup .header_topbar h1.logo_ok .text_servicename div.bg_img {
	/* 부가서비스 - 백업 */
	display: none;
	
	float: left;
    width: 25px;
    height: 30px;
    margin: 19px 0 0 5px;
    background: url(/res/images/custom/img_launcher_backup_ok.png) no-repeat;
    background-size: 100%;
}

.OfficeKeeper.MPI .header_topbar h1.logo_ok .text_servicename div.bg_img {
	/* 부가서비스 - PC취약점점검 */
	display: none;
	
	float: left;
    width: 31px;
    height: 30px;
    margin: 20px 0 0 5px;
    background: url(/res/images/custom/img_launcher_pcmanage.png) no-repeat;
    background-size: 100%;
}

.OfficeKeeper.SecuPrint .header_topbar h1.logo_ok .text_servicename div.bg_img {
	/* 부가서비스 - 출력물보안 */
	display: none;
	
	float: left;
    width: 32px;
    height: 30px;
    margin: 19px 0 0 5px;
    background: url(/res/images/custom/img_launcher_ok_printSecu.png) no-repeat;
    background-size: 100%;
}

.OfficeKeeper.DLP .header_topbar h1.logo_ok .text_servicename div.bg_img {
	/* 부가서비스 - 정보유출방지 */
	display: none;
	
	float: left;
    width: 31px;
    height: 30px;
    margin: 21px 0 0 5px;
    background: url(/res/images/custom/img_launcher_ok_dlp.png) no-repeat;
    background-size: 100%;
}

.OfficeMessenger.Messenger .header_topbar h1.logo_ok .text_servicename div.bg_img {
	/* 메신저*/
	display: none;
}


/*------------------------------------------------
에스원 - 서비스 아이콘
> 개발팀 추가 내용 - 개발팀 추가 (지연) 160607  - layout.css 에 추가되어야함.
------------------------------------------------*/

.header_topbar h1.logo_s1ps .text_servicename span {
	float: left;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 30px;
	height: 30px;
	margin: 16px 0 0 3px;
}

.header_topbar h1.logo_s1ps .text_servicename span.image_SERVICE_1 {
	background: url(/res/images/ps/img_topbar_serviceicon01_s1.png) no-repeat;
}

.header_topbar h1.logo_s1ps .text_servicename span.image_SERVICE_2 {
	background: url(/res/images/ps/img_topbar_serviceicon02_s1.png) no-repeat;
}

.header_topbar h1.logo_s1ps .text_servicename span.image_SERVICE_3 {
	background: url(/res/images/ps/img_topbar_serviceicon03_s1.png) no-repeat;
}

.header_topbar h1.logo_s1ps .text_servicename span.image_SERVICE_4 {
	background: url(/res/images/ps/img_topbar_serviceicon04_s1.png) no-repeat;
}

.header_topbar h1.logo_s1ps .text_servicename span.image_SERVICE_5 {
	background: url(/res/images/ps/img_topbar_serviceicon05_s1.png) no-repeat;
}

.header_topbar h1.logo_s1ps .text_servicename span.image_SERVICE_6 {
	background: url(/res/images/ps/img_topbar_serviceicon06_s1.png) no-repeat;
}

.header_topbar h1.logo_s1ps .text_servicename span.image_SERVICE_7 {
	background: url(/res/images/ps/img_topbar_serviceicon07_s1.png) no-repeat;
}
/*--------------------------------------------------------------------------------
[layout_frame_sidebar.css]
> SideBar

# GNB - SideBar (메뉴) - Exosphere
# GNB - SideBar - Sub Sidebar (서브메뉴) - Exosphere 
--------------------------------------------------------------------------------*/


/*------------------------------------------------------------
GNB - SideBar
 ------------------------------------------------------------*/

.wrap_gnb {
    float: left;
    width: 209px;
    overflow-x: hidden;
    overflow-y: hidden;
    z-index: 91;
    background-color: #fff;
}

.wrap_gnb .sidebar_sec_wrapper {
    position: relative;
    z-index: 91;
}

.wrap_gnb:after {
    content: "";
    position: absolute;;
    display: block;
    width: 210px;
    height: 100%;
    top: 0;
    background: #fff;
    z-index: 90;
    border-right: 1px solid #bbb;
    box-sizing: border-box;
}

.gnb {
    padding: 14px 13px 13px;
}

.gnb a {
    display: block;
    overflow: hidden;
}


/*------------------------------------------------------------
SideBar - Depth 01
------------------------------------------------------------*/

.gnb>ul.menu_depth01 {
    padding-top: 2px;
}

.gnb>ul.menu_depth01>li.on {
    /* 파랑 화살표 업 */
    background: url(/res/images/common/btn_foldarrow_up_blue.png) no-repeat 170px 15px;
}

.gnb>ul.menu_depth01>li.off {
    /* 파랑 화살표 다운 */
    background: url(/res/images/common/btn_foldarrow_down_blue.png) no-repeat 170px 15px;
}

.gnb>ul.menu_depth01>li a:hover {
    text-decoration: underline;
    color: #1b4b89;
}

.gnb>ul.menu_depth01>li:first-child>a {
    border-top: 1px solid #ddd;
}


/*----------------------------------------
SideBar - Depth 01 - Icon
----------------------------------------*/

.gnb>ul.menu_depth01>li>a {
    font-size: 15px;
    line-height: 1.2;
    padding: 10px 14px 11px 25px;
    color: #0059a6;
    min-height: 42px;
    height: auto;
    border-bottom: 1px solid #ddd;
    font-weight: normal;
    background-color: transparent;
    background-position: 0 8px;
    background-repeat: no-repeat;
}

.gnb>ul.menu_depth01>li>a.on {
    font-weight: bold;
}

.gnb>ul.menu_depth01>li.menu01>a {
    /* 대시보드 아이콘 */
    background-image: url(/res/images/common/icon_gnb_treetitle01.png);
}

.lang-en .gnb>ul.menu_depth01>li.menu01>a,
.lang-ja .gnb>ul.menu_depth01>li.menu01>a {
    /* 대시보드 아이콘 - 위치조정 - 영어 & 일문 */
    background-position: 0 9px;
}

.gnb>ul.menu_depth01>li.menu02>a {
    /* 로그 아이콘 */
    background-image: url(/res/images/common/icon_gnb_treetitle02.png);
}

.lang-en .gnb>ul.menu_depth01>li.menu02>a,
.lang-ja .gnb>ul.menu_depth01>li.menu02>a {
    /* 로그 아이콘 - 위치조정 - 영어 & 일문 */
    background-position: 1px 10px;
}

.gnb>ul.menu_depth01>li.menu03>a {
    /* 정책 아이콘 */
    background-image: url(/res/images/common/icon_gnb_treetitle03.png);
}

.lang-en .gnb>ul.menu_depth01>li.menu03>a,
.lang-ja .gnb>ul.menu_depth01>li.menu03>a {
    /* 정책 아이콘 - 위치조정 - 영어 & 일문 */
    background-position: 0 10px;
}

.gnb>ul.menu_depth01>li.menu04>a {
    /* 리포트 아이콘 */
    background-image: url(/res/images/common/icon_gnb_treetitle04.png);
}

.lang-en .gnb>ul.menu_depth01>li.menu04>a,
.lang-ja .gnb>ul.menu_depth01>li.menu04>a {
    /* 리포트 아이콘 - 위치조정 - 영어 & 일문 */
    background-position: 0 9px;
}

.gnb>ul.menu_depth01>li.menu05>a {
    /* NAC 아이콘 */
    background-image: url(/res/images/common/icon_gnb_treetitle05.png);
}

.lang-en .gnb>ul.menu_depth01>li.menu05>a,
.lang-ja .gnb>ul.menu_depth01>li.menu05>a {
    /* NAC 아이콘 - 위치조정 - 영어 & 일문 */
    background-position: 0 10px;
}

.menu_navi.menu_group>a {
    background-image: url(/res/images/common/icon_gnb_treetitle05.png);
    background-size: 10%;
    background-position: 3px 11px !important;
}

.gnb>ul.menu_depth01>li.menuPrintManage>a {
    /* 기기(프린터) 관리 아이콘 */
    background-image: url(/res/images/common/icon_gnb_treetitle_printManage.png);
    background-position: 0 9px;
}


/*------------------------------------------------------------
Depth 02
------------------------------------------------------------*/

.gnb>ul.menu_depth01>li>ul.menu_depth02 {
    padding: 6px 0 6px;
    border-bottom: 1px solid #ddd;
    font-size: 13px;
    line-height: 16px;
    margin-top: -11px;
    position: relative;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02:before {
    /* 경계선 감추기 */
    content: "";
    width: 100%;
    height: 2px;
    background-color: #fff;
    position: absolute;
    top: 9px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.on {
    background: url(/res/images/common/btn_foldarrow_up_gray.png) no-repeat 170px 9px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.off {
    background: url(/res/images/common/btn_foldarrow_down_gray.png) no-repeat 170px 9px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li>a {
    /* 뎁스2 - 버튼 */
    padding: 7px 18px 7px 25px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li>a:hover {
    /* 뎁스2 - 버튼 */
    color: #222;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.on>a {
    background: url(/res/images/common_sideBar_gnb/icon_gnb_treelist_on_2lines.png) no-repeat 7px 9px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.off>a {
    background: url(/res/images/common_sideBar_gnb/icon_gnb_treelist_off.png) no-repeat 7px 9px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.solo>a {
    background: url(/res/images/common_sideBar_gnb/icon_gnb_treelist_round.png) no-repeat 10px 11px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.solo>a:hover {
    color: #222;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.solo>a.on {
    color: #0059a6;
    font-weight: bold;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.solo>a.on:hover {
    color: #1b4b89;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.on>ul.menu_depth03 li a {
    padding: 5px 0 5px 38px;
    background: url(/res/images/common_sideBar_gnb/icon_gnb_treelist_listfront_3lines.png) no-repeat 7px -3px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.on>ul.menu_depth03 li:last-child a {
    padding: 6px 0 6px 38px;
    background: url(/res/images/common_sideBar_gnb/icon_gnb_treelist_listend.png) no-repeat 7px -3px;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.on>ul.menu_depth03 li a.on {
    color: #0059a6;
    font-weight: bold;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.on>ul.menu_depth03 li a:hover {
    color: #222;
}

.gnb>ul.menu_depth01>li>ul.menu_depth02>li.on>ul.menu_depth03 li a.on:hover {
    color: #1b4b89
}


/* ------------------------------------------------------------
사이드인포 영역 스타일 정의(옛날버전)
------------------------------------------------------------*/

.side_infoarea_item {
    margin: 15px auto 0;
    border: 1px solid #ddd;
    font-size: 12px;
}

.side_infoarea_item .infoarea_item_head,
.side_infoarea_item .infoarea_item_body {
    padding: 12px 10px;
}

.side_infoarea_item .infoarea_item_head {
    border-bottom: 1px solid rgb(221, 221, 221);
    background: #fff;
}

.side_infoarea_item .infoarea_item_head h5 {
    line-height: 1;
    font-size: 12px;
}

.side_infoarea_item .infoarea_item_body a {
    color: inherit;
}

.side_infoarea_item .infoarea_item_body a:hover {
    text-decoration: underline;
}

.side_infoarea_item .infoarea_item_body ul li {
    margin-bottom: 10px;
}

.side_infoarea_item .infoarea_item_body ul li:last-child {
    margin-bottom: 0px;
}

.side_infoarea_item .infoarea_item_body ul li.divider_top {
    border-top: 1px dashed #ddd;
    padding-top: 11px;
}

.side_infoarea_item .infoarea_item_body ul li div.infoarea_item_value span a {
    min-height: 14px;
}

.side_infoarea_item .infoarea_item_body ul li div.infoarea_item_value span {
    position: relative;
    top: 1px;
}


/*------------------------------------------------------------
사이드바 영역 래퍼
------------------------------------------------------------*/

.sidebar_sec_wrapper {
    padding: 13px;
}

.sidebar_sec_wrapper.sidebar_sec_wrapper_first {
    margin-top: 12px;
}

.sidebar_sec_wrapper.sidebar_sec_wrapper_last {
    margin-bottom: 80px;
}


/*----------------------------------------
사이드바 영역 타이틀
----------------------------------------*/

.sidebar_sec_header {
    margin-bottom: 6px;
}

.sidebar_sec_header.sidebar_sec_header_custom_margin_bottom_9 {
    margin-bottom: 9px;
}

.sidebar_sec_header h6 {
    line-height: 1;
    font-size: 12px;
}


/*------------------------------------------------------------
사이드바 - 바로가기
------------------------------------------------------------*/

.sidebar_sec_shortcut {
    color: #767676;
    font-size: 12px;
}

.sidebar_sec_shortcut a {
    color: inherit;
}

.sidebar_sec_shortcut ul {
    border: 1px solid #bbb;
    border-radius: 3px;
}

.sidebar_sec_shortcut ul li {
    border-bottom: 1px solid #bbb;
    padding: 10px 12px 9px;
    position: relative;
}

.sidebar_sec_shortcut ul a:last-child li {
    border-bottom: 0;
}

.sidebar_sec_shortcut ul a:hover li {
    background: #F0F0F0;
}

span.icn_sidebar_shortcut {
    float: right;
    width: 6px;
    height: 9px;
    background: url(/res/images/common/icn_sidebar_shortcut.png) no-repeat;
    background-size: 100%;
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    line-height: 1;
    margin-top: -4.5px;
}


/*------------------------------------------------------------
사이드바 위젯
------------------------------------------------------------*/

.sidebar_sec_widget {
    color: #767676;
    font-size: 12px;
}

.sidebar_sec_widget a {
    letter-spacing: -1px;
    position: relative;
    top: 1px;
}

.sidebar_sec_widget a.color_blue01 {
    color: #0059a6;
}

.sidebar_sec_widget a.color_orange01 {
    color: #ff6600;
}

.sidebar_sec_widget a:hover {
    text-decoration: underline;
}

.sidebar_sec_widget a.mouse_tooltip_trigger .mouse_tooltip {
    display: none;
}

.sidebar_sec_widget a.mouse_tooltip_trigger:hover .mouse_tooltip {
    display: block;
}

.sidebar_sec_widget .text_divider {
    color: #d6d6d6;
    padding: 0 0 0 1px;
}

.sidebar_sec_widget .text_divider.text_divider_custom_padding {
    padding: 0 2px;
}


/*----------------------------------------
사이드바 위젯 헤더
----------------------------------------*/

.sidebar_sec_widget_header {
    padding: 10px 12px 9px;
    border-width: 1px 1px 0 1px;
    border-style: solid;
    border-color: #bbb;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background: #f0f0f0;
}


/*----------------------------------------
사이드바 위젯 바디
----------------------------------------*/

.sidebar_sec_widget_body {
    padding: 12px;
    border-width: 1px 1px 1px 1px;
    border-style: solid;
    border-color: #bbb;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top: 1px dashed #bbb;
}

.sidebar_sec_widget_body ul li {
    padding: 6px 0;
}

.sidebar_sec_widget_body ul:first-child li {
    padding: 2px 0 6px 0;
}

.sidebar_sec_widget_body ul:last-child li {
    padding: 6px 0 0 0;
}


/*----------------------------------------
사이드바 위젯 구분선
----------------------------------------*/

.sidebar_sec_widget_divider {
    background: #e6e6e6;
    display: block;
    height: 1px;
    margin: 2px 0 4px 0;
}


/*----------------------------------------
서비스 정보 - 영문/일문 레이아웃 조정
----------------------------------------*/

.lang-en .sidebar_sec_widget_cont li>div,
.lang-ja .sidebar_sec_widget_cont li>div {
    float: left;
    width: 100%;
}

.lang-ja .sidebar_sec_widget_cont li>div:nth-child(1) {
    letter-spacing: -1px;
}

.lang-en .sidebar_sec_widget_cont li>div:nth-child(2),
.lang-ja .sidebar_sec_widget_cont li>div:nth-child(2) {
    margin-top: 4px;
}


/*------------------------------------------------------------
# GNB - SideBar (메뉴) - Exosphere
------------------------------------------------------------*/

.Exosphere .wrap_gnb {
    /* EXSP - 사이드바 */
    float: left;
    width: 53px;
    overflow-x: hidden;
    overflow-y: hidden;
    position: fixed;
    height: 100%;
    border-left: 0;
    border-right: 1px solid #bbb;
    box-shadow: 2px 0 5px rgba(0,0,0,0.10);
    background: #fff;
    z-index: 91;
}

.Exosphere .wrap_gnb:after {
    display: none;
}

.Exosphere .wrap_gnb .gnb-btnGroup {
    position: fixed;
    z-index: 91;
}

.Exosphere .wrap_gnb .gnb-btnGroup.gnb-btnGroup-upper {
    top: 72px;
}

.Exosphere .wrap_gnb .gnb-btnGroup.gnb-btnGroup-lower {
    bottom: 0;
}

.Exosphere .wrap_gnb .gnb-btn {
    text-align: center;
    display: block;
    width: 52px;
    height: 53px;
    border-bottom: 1px solid #bbb;
    padding-top: 13px;
    background-color: #fff;
    transition: background-color 0.25s ease-in-out;
    position: relative;
}

.Exosphere .wrap_gnb .gnb-btn.active {
    background-color: #ebf6ff;
    transition: background-color 0.25s ease-in-out;
}

.Exosphere .wrap_gnb .gnb-btn:before {
    content: "";
    top: -1px;
    left: -1px;
    width: 54px;
    height: 54px;
    /* visibility: hidden; */
    display: block;
    border: 1px solid #0059a6;
    background: transparent;
    position: absolute;
    box-sizing: border-box;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.25s ease-in-out;
}

.Exosphere .wrap_gnb .gnb-btn:hover:before,
.Exosphere .wrap_gnb .gnb-btn.active:before {
    content: "";
    /* visibility: visible; */
    opacity: 1;
    transition: opacity 0.25s ease-in-out;
}

.Exosphere .wrap_gnb .gnb-btn.active:hover {
    background-color: #ebf6ff;
    transition: background-color 0.25s ease-in-out;
}

.Exosphere .wrap_gnb .gnb-btn:hover {
    /* background-color: #eef8ff; */
    background-color: #ebf6ff;
    transition: background-color 0.25s ease-in-out;
}

.Exosphere .wrap_gnb .gnb-btnGroup-lower .gnb-btn:first-child {
    border-top: 1px solid #bbb;
    height: 54px;
}

.Exosphere .wrap_gnb .gnb-btnGroup-lower .gnb-btn:last-child {
    border-bottom: 0;
    height: 52px;
}

.Exosphere .wrap_gnb .gnb-btn:after {
    /* 사이드바 - 툴팁 */
    content: attr(data-menuName);
    opacity: 0;
    background: #333333;
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    transform: translate(0, -50%);
    text-align: left;
    line-height: 1.4;
    width: auto;
    top: 50%;
    height: auto;
    position: absolute;
    left: 56px;
    padding: 6px 10px;
    border-radius: 3px;
    box-shadow: 0 1px 8px rgba(0,0,0,0.4);
    visibility: hidden;
    white-space: nowrap;
    transition: opacity 0.1s ease-in-out, margin-top 0.1s ease-in-out, left 0.1s ease-in-out, visibility 0.1s ease-in-out;
}

.Exosphere .wrap_gnb .gnb-btn:hover:after {
    /* 사이드바 - 툴팁 - 마우스오버 */
    opacity: 1;
    left: 60px;
    visibility: visible;
    transition: opacity 0.1s ease-in-out, margin-top 0.1s ease-in-out, left 0.1s ease-in-out, visibility 0.1s ease-in-out;
}


/*--------------------------------------------
사이드바 아이콘
--------------------------------------------*/

.Exosphere .wrap_gnb .gnb-btn>i {
    font-size: 24px;
    color: #0059a6;
    position: relative;
}

.Exosphere .wrap_gnb .gnb-btn>i.owui-fontIco-icnBtn-sideBar-dashboard {
    font-size: 25px;
    bottom: 1px;
}

.Exosphere .wrap_gnb .gnb-btn>i.owui-fontIco-icnBtn-sideBar-approval {
    font-size: 26px;
    bottom: 1px;
}

.Exosphere .wrap_gnb .gnb-btn>i.owui-fontIco-icnBtn-sideBar-settings {
    /* 설정 - 아이콘 - 조정 */
    font-size: 26px;
    bottom: 1px;
}

.Exosphere .wrap_gnb .gnb-btn>i.owui-fontIco-icnBtn-sideBaru-users {
    /* 사용자 설정 - 아이콘 - 조정 */
    font-size: 29px;
    bottom: 4px;
}

.Exosphere .wrap_gnb .gnb-btn>i.owui-fontIco-icnBtn-sideBar-support {
    font-size: 27px;
}


/*----------------------------------------
# GNB - SideBar - Sub Sidebar (서브메뉴) - Exosphere 
----------------------------------------*/

 .Exosphere .wrap_gnb_sub {
    /* EXSP - 서브사이드바 */
    width: 156px;
    float: left;
    background-color: #fff;
    margin-left: 53px;
    border-right: 0;
    height: auto;
    position: static;
    margin-top: 0;
    padding: 20px 18px 20px;
    position: relative;
    z-index: 90;
}

.Exosphere .wrap_gnb_sub a:hover {
    text-decoration: underline;
}

.Exosphere .wrap_gnb_sub .menuTitle {
    display: block;
    font-size: 18px;
    font-weight: bold;
    color: #0059a6;
    margin-top: 1px;
    margin-bottom: 18.5px;
    position: relative;
    z-index: 90;
}

.Exosphere .wrap_gnb_sub .menuDivider {
    /* 디바이더 - 타이틀 & 서브메뉴 구분 */
    width: 100%;
    height: 1px;
    background-color: #0059a6;
    margin-bottom: 14px;
    position: relative;
    z-index: 90;
}

.Exosphere .wrap_gnb_sub .menuDivider.subMenuDivider {
    /* 디바이더 - 서브메뉴 그룹 구분 */
    background-color: #ddd;
    margin-top: 16px;
}

.Exosphere .wrap_gnb_sub .subMenu {
    position: relative;
    z-index: 90;
}

.Exosphere .wrap_gnb_sub .subMenu .subMenuTitle {
    font-weight: bold;
    color: #0059a6;
    margin-bottom: 10px;
    font-size: 14px;
    display: block;
    line-height: 1.2;
}



.Exosphere .wrap_gnb_sub .subMenu .subMenuBtn {
    font-size: 13px;
    color: #505050;
    font-weight: normal;
    display: block;
    margin-bottom: 10px;
    line-height: 1.3;
}

.Exosphere .wrap_gnb_sub .subMenu .subMenuBtn.active {
    color: #0059a6;
    text-decoration: underline;
}

.Exosphere .wrap_gnb_sub:after {
    content: "";
    position: absolute;
    display: block;
    width: 157px;
    height: 100%;
    margin-left: -18px;
    top: 0;
    background: #fff;
    z-index: 89;
    border-right: 1px solid #bbb;
    box-sizing: border-box;
    /* box-shadow: 2px 0 5px rgba(0,0,0,0.13); */
}


/*----------------------
최소 세로 고정폭 규정 - 미디어 쿼리
----------------------*/

@media only screen and (max-height: 443px) {
.Exosphere .wrap_gnb .gnb-btnGroup.gnb-btnGroup-upper,
    .Exosphere .wrap_gnb .gnb-btnGroup.gnb-btnGroup-lower {
        position: static;
    }
    .Exosphere .wrap_gnb .gnb-btnGroup.gnb-btnGroup-upper .gnb-btn:last-child {
        border-bottom: 0;
    }
}/*----------------------------------------------------------------------------------------
[layout_grid.css]
> Content Layout - Grid

# 공통설정
# 행 (row)
# 열 (col)
----------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------
# 공통설정 
------------------------------------------------------------------*/

.col>div.row {
    display: block;
}


/*------------------------------------------------------------------
[LEGACY] 자식 가운데정렬 및 인라인 배치 - '-inBlock'
> 더 이상 적용 금지 => .row-childinBlock 사용
------------------------------------------------------------------*/

div[class*="-inBlock"]:before {
    content: ""; display: inline-block; height: 100%; font-size: 0; line-height: 1; vertical-align: middle;
}

.col-inBlock {
    height: 100%; font-size: 0;
}

.col-inBlock>* {
     display: inline-block; vertical-align: middle; font-size: 1rem;
}


/*------------------------------------------------------------------
[LEGACY] 행 그룹 (rowGroup)
> 여러 row의 콘테이너 - 다중 row 대상 랩퍼/컨테이너 역할
> 더 이상 적용 금지 => rowGroup 대신 row로 랩핑/컨테이닝
------------------------------------------------------------------*/

.rowGroup {
    display: block; width: 100%; padding: 0; margin: 0;
}

.rowGroup:after {
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; content: ""; display: table; clear: both; zoom: 1;
}

.rowGroup.rowGroup-inCard {
    padding: 0 14px;
}

.rowGroup.rowGroup-inCard.rowGroup-inCard-padUpDown,
.rowGroup-padUpDown {
    padding-top: 20px;
}

.rowGroup.rowGroup-inCard.rowGroup-inCard-padUpDown:last-of-type,
.rowGroup-padUpDown:last-of-type {
    padding-bottom: 24px;    
}


/*------------------------------------------------------------------
# 행 (row)
------------------------------------------------------------------*/

.row {
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    line-height: 1;
}

.row:before {
    /*row 줄바꿈 (clear)*/
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.row:after {
    /*row 줄바꿈 (clear)*/
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    content: "";
    display: table;
    clear: both;
    zoom: 1;
}


/*--------------------------------------------
행 (row) - 패딩 & 마진
--------------------------------------------*/

.row.row-inCard-default {
    /* 카드 내 행 - 패딩 디폴트 */
    padding: 20px 14px 0;
}

.row.row-inCard-padLeftRight,
.row.row-padLeftRight,
.row.row-inCard {
    /* 카드 내 행- 좌우 패딩 */
    padding: 0 14px;
}

.row.row-inCard-padUpDown,
.row-padUpDown {
    /* 카드 내 행 상하 패딩  */
    padding-top: 20px;
}

.row.row-inCard-default:last-of-type, 
.row.row-inCard-padUpDown:last-of-type,
.row-padUpDown:last-of-type {
    padding-bottom: 24px;    
}

.rowGroup>.row {
    /*
    > 디폴트 마진
    > 여러 row가 연속적으로 나오는 상황일 때 사용
    */
    margin: 0 0 6px 0;
}

.rowGroup>.row:last-of-type,
.rowGroup>.row.row-last {
    /*
    > 마지막 행 여백 처리
    > 필요 시 row-last 수동 추가
    */
    margin: 0;
}

.rowGroup>.row.row-hdline {
    /* 헤드라인용 row */
    margin: 0 0 10px 0;
}


/*--------------------------------------------
행 (row) - 스크롤 오토
--------------------------------------------*/

.row.row-scrollAuto {
    overflow: auto;
}


/*----------------------------------------
행 (row) - 자식 가운데정렬 및 인라인 배치 - childInBlock
----------------------------------------*/

.row.row-childInBlock {
    font-size: 0;
}

.row.row-childInBlock>.col {
    font-size: 1rem;
    float: none;
    display: inline-block;
    vertical-align: middle;
}

.row.row-childInBlock.row-childInBlockMargin>.col {
    margin: 0 18px 0 0;
}

.row.row-childInBlock.row-childInBlockMargin>.col:last-child {
    margin: 0;
}


/*----------------------------------------
행 (row) - 디바이더
----------------------------------------*/

.row.row-dividerBottom {
    /* 행 (row) - 경계선 */
    /* [주의] col자식/컨텐츠 없이 단독으로 사용 */
    height: 1px;
    padding-top: 20px;
    border-bottom: 1px solid #bbb;
}


/*------------------------------------------------------------------
# 열 (col)
------------------------------------------------------------------*/

.row div[class*="col-"].col {
    padding-right: 20px;
    margin: 0; 
}

.row div[class*="col-"].col:last-of-type {
    padding-right: 0 !important;
}

.row .col.col-1-1,
.row div[class*="col-1-1"].col {
    /* 1열 */
    width: 100%;
    padding-right: 0;
}

.row div[class*="col-1-1"].col {
    /* 셀이 col-1-1로만 구성된 경우 자동 높이 조정 */
    margin-bottom: 6px;
}

.row div[class*="col-1-1"].col:last-child {
    margin-bottom: 0;
}


.row .col {
    /* 자동폭(디폴트) */
    float: left;
    width: auto;
}

.row .col.col-1-2 { width: 50%; }

.row .col.col-1-3 { width: 33.33%; }

.row .col.col-2-3 { width: 66.66%; }

.row .col.col-1-4 { width: 25%; }

.row .col.col-2-4 { width: 50%; }

.row .col.col-3-4 { width: 75%; }

.row .col.col-1-5 { width: 20%; }

.row .col.col-2-5 { width: 40%; }

.row .col.col-3-5 {  width: 60%; }

.row .col.col-4-5 { width: 80%; }

.row .col.col-1-6 { width: 16.66%; }

.row .col.col-2-6 { width: 33.32%; }

.row .col.col-3-6 {  width: 49.98%; }

.row .col.col-4-6 {  width: 66.64%; }

.row .col.col-5-6 {  width: 83.33%; }

.row .col.col-1-7 {  width: 14.285%; }

.row .col.col-2-7 {  width: 28.57%; }

.row .col.col-3-7 {  width: 42.855%; }

.row .col.col-4-7 {  width: 57.14%; }

.row .col.col-5-7 {  width: 71.425%; }

.row .col.col-6-7 {  width: 85.71%; }

.row .col.col-1-8 {  width: 12.5%; }

.row .col.col-2-8 {  width: 25%; }

.row .col.col-3-8 {  width: 37.5%; }

.row .col.col-4-8 {  width: 50%; }

.row .col.col-5-8 {  width: 62.5%; }

.row .col.col-6-8 {  width: 75%; }

.row .col.col-7-8 {  width: 87.5%; }

.row .col.col-1-9 {  width: 11.11%; }

.row .col.col-2-9 {  width: 22.22%; }

.row .col.col-3-9 {  width: 33.33%; }

.row .col.col-4-9 {  width: 44.44%; }

.row .col.col-5-9 {  width: 55.55%; }

.row .col.col-6-9 {  width: 66.66%; }

.row .col.col-7-9 {  width: 77.77%; }

.row .col.col-8-9 {  width: 88.88%; }

.row .col.col-1-10 {  width: 10% }

.row .col.col-2-10 {  width: 20%; }

.row .col.col-3-10 {  width: 30%; }

.row .col.col-4-10 {  width: 40%; }

.row .col.col-5-10 {  width: 50%; }

.row .col.col-6-10 {  width: 60%; }

.row .col.col-7-10 {  width: 70%; }

.row .col.col-8-10 {  width: 80%; }

.row .col.col-9-10 {  width: 90%; }


/*--------------------------------------------
열 (col) - 플로트 (col-float)
--------------------------------------------*/

.row .col.col-floatLeft {
    /* 디폴트 */
    float: left;
}

.row .col.col-floatRight {
    float: right;
}


/*--------------------------------------------
열 (col) - 옵션
--------------------------------------------*/

/*----------------------
[LEGACY] 열 (col) - 자식 가운데정렬 및 인라인 배치 - ofInline
> 더 이상 적용 금지 => .row-childinBlock 사용
----------------------*/

.row.col-ofInline>.col {
    margin: 0 18px 0 0; display: inline-block; float: none; vertical-align: middle;
}

.row.col-ofInline>.col:last-child {
    margin: 0;
}


/*----------------------
열 (col) - 텍스트 정렬 (col-align)
----------------------*/

.row .col.col-alignLeft {
    /* 디폴트 */
    text-align: left;
}

.row .col.col-alignRight {
    text-align: right;
}

.row .col.col-alignCenter {
    text-align: center;
}


/*----------------------
열 (col) - 패딩 (오프셋)
----------------------*/

.row .col.col-noPad {
    /*칼럼 사이 여백 강제 제거 옵션 (col-noPad)*/
    padding: 0 !important;
}

.row .col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    padding-left: 20px;
    padding-right: 20px;
}

.row .col-padUpDown {
    padding-top: 20px;    
    padding-bottom: 20px;
}

.row .col-padUpDown:first-child {
    padding-top: 0;
    padding-bottom: 0;
}

.row .col-padUpDown:last-child {
    padding-bottom: 0;
}


/*----------------------
열 (col) - 그리드 사이즈(간격) 조절 (col-size)
----------------------*/

.row.col-size-zero div[class*="col-"] {
    /*그리드 간격 : 0*/
    padding-right: 0;
}

.row.col-size-zero.col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    /*그리드 간격 : 0 (col-zero)*/
    padding-left: 0;
    padding-right: 0;
}

.row.col-size-xxs div[class*="col-"] {
    /*그리드 간격 : XXS (4px)*/
    padding-right: 4px;
}

.row.col-size-xxs.col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    /*그리드 간격 : XXS(4px)*/
    padding-left: 4px;
    padding-right: 4px;
}

.row.col-size-xs div[class*="col-"] {
    /*그리드 간격 : XS (10px)*/
    padding-right: 10px;
}

.row.col-size-xs.col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    /*그리드 간격 : XS (10px)*/
    padding-left: 10px;
    padding-right: 10px;
}

.row.col-size-sm div[class*="col-"] {
    /*그리드 간격 : SM (16px)*/
    padding-right: 16px;
}

.row.col-size-sm.col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    /*그리드 간격 : SM (16px)*/
    padding-left: 16px;
    padding-right: 16px;
}

.row.col-size-md div[class*="col-"] {
    /*그리드 간격 : MD (20px, DEFAULT)*/
    padding-right: 20px;
}

.row.col-size-md.col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    /*그리드 간격 : MD (20px)*/
    padding-left: 20px;
    padding-right: 20px;
}

.row.col-size-lg div[class*="col-"] {
    /*그리드 간격 : LG (30px)*/
    padding-right: 30px;
}

.row.col-size-lg.col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    /*그리드 간격 : LG (30px)*/
    padding-left: 30px;
    padding-right: 30px;
}

.row.col-size-xl div[class*="col-"] {
    /*그리드 간격 : XL*/
    padding-right: 40px;
}

.row.col-size-xl.col-outPad {
    /*바깥 여백 추가 옵션 (col-outPad)*/
    /*그리드 간격 : XL (40px)*/
    padding-left: 40px;
    padding-right: 40px;
}
/*------------------------------------------------------------------------
[layout_card.css]
> 카드 레이아웃
------------------------------------------------------------------------*/

/*------------------------------------------------------
Contents - 카드 - 레이아웃
------------------------------------------------------*/

.layout_card {
	margin: 8px 0;
	position: relative;
	width: 100%;
	float: left;
}

.Exosphere .layout_card {
	box-shadow: 0 0 3px rgba(0,0,0,0.15);
	border-radius: 5px;
}


/*----------------------------------------
카드 - 대시보드
----------------------------------------*/

.layout_card_1solo {
	/* 대시보드 - 1개일 때 */
	width: 100%;
	float: left;
}

.layout_card_2left {
	/* 대시보드 - 2개일 때 왼쪽 */
	width: 486px;
	float: left;
	/* width: 484px; */
}

.layout_card_2right {
	/* 대시보드 - 2개일 때 오른쪽 */
	width: 486px;
	float: right;
	/* float: left; */
	/* width: 484px; */
}

.layout_card_3left {
	/* 대시보드 - 3개일 때 왼쪽 */
	width: 318.333px;
	float: left;
	/* width:316px; */
}

.layout_card_3center {
	/* 대시보드 - 3개일 때 중간 */
	width: 318.333px;
	float: left;
	margin-left: 16px;
	/* width:316px; */
	/* margin-left:20px; */
}

.layout_card_3right {
	/* 대시보드 - 3개일 때 오른쪽 */
	width: 318.333px;
	float: right;
	/* width:316px; */
}


/*----------------------------------------
카드 - 기본 스타일 - 헤드
----------------------------------------*/

.layout_card .area_head {
	height: 40px;
	border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
}

.layout_card .area_head_none {
	height: 5px;
	border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
}

.layout_card .area_head h4 {
	float: left;
	display: inline-block;
	margin: 12px 16px;
}

.layout_card .area_head h4 .text_title {
	float: left;
	display: inline-block;
	color: #fff;
	font-size: 15px;
	line-height: 15px;
	font-weight: bold;
}

.layout_card .area_head h4 .text_small_title {
	float: left;
	display: inline-block;
	color: #6fbcff;
	font-size: 12px;
	line-height: 12px;
	padding: 2px 0 0 8px;
}

.layout_card .btn_detail {
	float: right;
	display: inline-block;
}

.layout_card .btn_detail a {
	display: inline-block;
	margin: 7px 16px 7px 0;
}

.layout_card .headcolor_blue {
	background: #0059a6;
	border-left: 1px solid #004170;
	border-right: 1px solid #004170;
	border-top: 1px solid #004170;
}

.layout_card .headcolor_white {
	background: #fff;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-top: 1px solid #bbb;
}


/*------------------------------------------------------------------
카드 타이틀 없는 경우 - card_noTitle
------------------------------------------------------------------*/

.layout_card.card_noTitle .area_content {
	border-top: 1px solid #bbb;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}


/*----------------------------------------
카드 - 기본 스타일 - 콘텐츠AREA (area_content)
----------------------------------------*/

.layout_card .area_content {
	background: #fff;
	border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-bottom: 2px solid #bbb;
}


/*------------------------------------------------------------------
contents - layout_card - 라디오버튼/검색/테이블 영역
------------------------------------------------------------------*/

.layout_card .area_content .con_table {
	padding: 15px 0 20px 0;
}

.layout_card .area_content .con_table_notitle {
	padding: 0 0 20px 0;
}

.layout_card .area_content .con_table_notitle .table_content_circle {
	margin: 0 auto;
	width: 100%;
	padding: 0 0 20px 0;
	text-align: center;
}

.layout_card .area_content .con_table .board_search_area {
	padding: 0 15px 0 10px;
	height: 30px;
}

.layout_card .area_content .con_table .board_search_area ul li {
	float: left;
	padding-left: 5px;
}


/*----------------------------------------
카드 - 라디오 버튼 영역
----------------------------------------*/

.layout_card .area_content .con_table .board_search_area .radio_area {
	float: left;
	padding-top: 8px;
	display: inline-block;
	vertical-align: middle;
}

.layout_card .area_content .con_table .board_search_area .check_set_area {
	float: left;
	padding-top: 8px;
	display: inline-block;
	vertical-align: middle;
}

.layout_card .area_content .con_table .board_search_area .radio_area li {
	float: left;
	padding-right: 15px;
}

.layout_card .area_content .con_table .board_search_area .radio_area li.mid_text {
	color: #ddd;
}

.layout_card .area_content .con_table .board_search_area .radio_area>ul>li:nth-child(n+4) {
	/* 5번째 항목부터 margin-bottom 지님 : 검색창과 충돌 시 자연스러운 줄바꿈 위함 */
	margin-bottom: 10px;
}

.layout_card .area_content .con_table .board_search_area .search_area {
	display: inline-block;
	vertical-align: middle;
	padding-top: 4px;
	margin-bottom: 14px;
}

.layout_card .area_content .con_table .board_search_area .search_area input.text_box_gray {
	height: 25px;
	font-size: 13px;
	color: #333;
	/* *height: 20px; */
	/* *line-height: 20px; */
	/* *zoom: 1; */
}

.NAC .layout_card .area_content .con_table .board_search_area .search_area input.text_box_gray {
	/* NAC - 검색 텍스트 상자 크기조정 */
	width: 260px !important;
}

.FileBackup .layout_card[name="content2"] .area_content .con_table .board_search_area .search_area input.text_box_gray {
	/* BKUP - 검색 텍스트 상자 크기조정 */
	width: 120px !important;
}

.layout_card .area_content .con_table .board_search_area input[type=radio] {
	float: left;
	vertical-align: middle;
}

.layout_card .area_content .con_table .board_search_area input[type=text] {
	float: left;
	vertical-align: middle;
}


/*------------------------------------------------------------------
카드 area_content col-noPad
------------------------------------------------------------------*/

.layout_card .area_content>.row>.col-noPad {
	border-right: 1px solid #bbb;
	padding: 26px 14px !important;
}

.layout_card .area_content>.row>.col-noPad:nth-child(3) {
	border-right: 0;
}


/*------------------------------------------------------------------
카드 area_content cardTop 영역
------------------------------------------------------------------*/

.layout_card .area_content [class*="cardTop-"] {
	height: 50px;
	border-bottom: 1px solid #bbb;
}


/*------------------------------------------------------------------
카드탑 - 카드설명
------------------------------------------------------------------*/

.layout_card .area_content .cardTop-cardDesc {
	padding-top: 14px;
	padding-bottom: 14px;
	height: auto;
}

.cardTop-cardDesc .bodyText {
	text-indent: -14px;
	font-size: 13px;
	margin-left: 14px;
	color: #505050;
}

.layout_card .row.cardTop-cardDesc>.col {
	margin-bottom: 10px;
}

.layout_card .row.cardTop-cardDesc>.col:last-of-type {
	margin-bottom: 0;
}


/*----------------------------------------
카드 - 싱글 컨트롤
----------------------------------------*/

.layout_card.layout_card_single_control div.vert_divider {
	width: 1px;
	height: 23px;
	margin: 0 10px;
	background: #ddd;
	position: relative;
	top: 5px;
	float: left;
}

.layout_card.layout_card_single_control div.input_area {
	float: left;
	position: relative;
	top: 5px;
}

.layout_card.layout_card_single_control .area_content .con_table .board_search_area .span_area {
	height: 23px;
	line-height: 23px;
	float: left;
	padding-right: 15px;
	position: relative;
	top: 5px;
}

.layout_card.layout_card_single_control .area_content .con_table .board_search_area .span_area_custom01 {
	/* 싱글 컨트롤 카드 : span_area 커스텀 01 */
	margin-right: 6px;
}

.layout_card.layout_card_single_control.layout_card_single_control_custom01 .area_content .con_table .board_search_area input[type="text"] {
	/* 싱글 컨트롤 카드 : 카드 전체 커스텀 01 */
	text-align: center;
	margin: 0 8px 0 8px;
}


/*--------------------------------------------------------------
레이아웃카드 : 탭
> 설정레이어팝업에서 필요할 경우 설정레이어팝업에 layout_card 속성을 추가하여 활용
--------------------------------------------------------------*/

.layout_card .tabContainer {
	padding-top: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	padding-bottom: 0 !important;
	border-bottom: 0 !important;
	min-height: 0 !important;
}

.layout_card .tabContainer .layout_card_tab {
	width: 100%;
	font-size: 0;
}

.layout_card .tabContainer .layout_card_tab>li>a {
	width: 100%;
	height: 100%;
	display: block;
	color: #767676;
	padding: 14px !important;
}

.layout_card .tabContainer .layout_card_tab>li.active>a {
	color: #0059a6;
	font-weight: bold;
}

.layout_card .tabContainer .layout_card_tab>li.active>a:hover {
	color: #0059a6;
}

.layout_card .tabContainer .layout_card_tab>li>a:hover {
	color: #999;
}

.layout_card .tabContainer .layout_card_tab>li {
	display: inline-block;
	font-size: 13px;
	vertical-align: top;
	text-align: center;
	border-bottom: 1px solid #bbb;
	border-right: 1px solid #bbb;
	background: #ececec;
}

.layout_card .tabContainer .layout_card_tab>li:last-child {
	border-right: 0;
	margin-top: 0 !important;
}

.layout_card .tabContainer .layout_card_tab>li.active {
	background: #fff;
	border-bottom: 0;
}


/*--------------------------------------------
탭 개수에 따른 li 값 조정
--------------------------------------------*/

.layout_card .tabContainer .layout_card_tab.tabsCountTwo>li {
	width: 50%;
}

.layout_card .tabContainer .layout_card_tab.tabsCountEight>li {
	width: 12.5%;
}


/*------------------------------------------------------------------
[LEGACY] 일반 카드 컨텐츠
> 일반 카드 컨텐츠는 legacy 코드로 분류
> 현재(17-11 기준)에는 'content latout - grid'를 사용하여 컨텐츠 구성
------------------------------------------------------------------*/

/*------------------------------------
일반 카드 컨텐츠 - 전체 레이아웃
------------------------------------*/

.layout_card .area_content .common_content {
	padding: 24px 0;
}

.layout_card .area_content .common_content .cont_sec {
	padding: 0 24px;
}

.layout_card .area_content .common_content .cont_sec>* {
	line-height: 1;
}


/*----------------------------------------
컨텐츠 레이아웃 크기 변경
----------------------------------------*/

.layout_card .area_content .common_content .cont_sec03_w660 {
	width: 660px;
	margin: 0 auto;
}


/*----------------------------------------
일반 카드 컨텐츠 - 헤더
----------------------------------------*/

.layout_card .area_content .common_content .cont_sec .cont_sec_header {
	margin-bottom: 16px;
	display: block;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_header h4 {
	font-size: 15px;
	line-height: 1;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_header h4 span {
	font-size: 12px;
	color: #767676;
	padding-left: 4px;
	font-weight: normal;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_header button {
	position: relative;
	bottom: 4px;
}


/*----------------------------------------
일반 카드 컨텐츠 - 푸터
----------------------------------------*/

.layout_card .area_content .common_content .cont_sec .cont_sec_footer {
	margin-top: 10px;
	margin-bottom: 10px;
	display: block;
}


/*----------------------------------------
일반 카드 컨텐츠 - 공통 스타일 원칙
> 여러 줄로 컨텐츠로 표시될 때 wrapper 활용
> 28px 높이에서 텍스트, 컨트롤의 중앙정렬
----------------------------------------*/

.layout_card .area_content .common_content .cont_sec .cont_wrapper {
	display: block;
}

.layout_card .area_content .common_content .cont_sec .cont_wrapper:after {
	content: "";
	display: block;
	clear: both;
}

.layout_card .area_content .common_content .cont_sec .cont_wrapper {
	*zoom: 1;
}

.layout_card .area_content .common_content .cont_sec .cont_wrapper.type01 {
	margin-bottom: 16px;
}

.layout_card .area_content .common_content .cont_sec .cont_wrapper.type02 {
	margin-bottom: 16px;
	border: 1px solid #d6d6d6;
	border-radius: 6px;
}

.layout_card .area_content .common_content .cont_sec .cont_wrapper.type03 {
	padding: 20px 20px 8px;
	border-bottom: 1px solid #d6d6d6;
}

.layout_card .area_content .common_content .cont_sec .pos_mid_in_28px_box {
	position: relative;
	top: 6px !important;
}

.layout_card .area_content .common_content .cont_sec p,
.layout_card .area_content .common_content .cont_sec h1,
.layout_card .area_content .common_content .cont_sec h2,
.layout_card .area_content .common_content .cont_sec h3,
.layout_card .area_content .common_content .cont_sec h4,
.layout_card .area_content .common_content .cont_sec h5,
.layout_card .area_content .common_content .cont_sec h6 {
	line-height: 1.3;
}

.layout_card .area_content .common_content .cont_sec h3 {
	font-weight: bold;
}


/*----------------------------------------
일반 카드 컨텐츠 - 다중 칼럼 컨텐츠 레이아웃
----------------------------------------*/

/*--------------------
공통 스타일링
--------------------*/

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_one,
.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_two,
.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_three,
.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_four {
	min-height: 28px;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_one {
	/* 한 줄 - col_one */
	float: left;
	width: 100%;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_two {
	/* 두 줄 - col_two */
	float: left;
	width: 49%;
	margin-right: 2%;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_two:nth-child(2n) {
	/* 두 줄 - col_two */
	margin-right: 0;
	border-right: 0;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_three {
	/* 세 줄 - col_three */
	float: left;
	width: 32%;
	margin-right: 2%;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_three:nth-child(3n) {
	/* 세 줄 - col_three */
	margin-right: 0;
	border-right: 0;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_four {
	/* 네 줄 - col_four */
	float: left;
	width: 24%;
	margin-right: 1.33%;
}

.layout_card .area_content .common_content .cont_sec .cont_sec_body .col_four:nth-child(4n) {
	/* 네 줄 - col_four */
	margin-right: 0;
	border-right: 0;
}


/*--------------------------------------------
일반 카드 컨텐츠 - 컨텐츠 내 줄바꿈 디바이더
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec_divider01 {
	margin: 28px 0;
	padding: 0;
	height: 0;
	border-top: 1px solid #ccc;
	border-right: 0;
	border-bottom: 0;
	border-left: 0;
}

.layout_card .area_content .common_content .cont_sec_divider02 {
	margin: 6px 0;
	padding: 0;
	height: 0;
	border: 0;
	float: left;
	width: 100%;
}


/*--------------------------------------------
일반 카드 컨텐츠 - 컨트롤(컨텐츠) 좌측 레이블 스타일
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec span.ctrl_label {
	position: relative;
	margin-right: 16px;
	line-height: 1.3;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w40 {
	width: 40px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w80 {
	width: 80px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w120 {
	width: 120px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w140 {
	width: 140px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w170 {
	width: 170px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w200 {
	width: 200px
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w220 {
	width: 220px
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w260 {
	width: 260px
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_w280 {
	width: 280px
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type01_wauto {
	width: auto;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w40 {
	top: 5px;
	width: 40px;
}

.lang-en.SecuPrint .layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w40 {
	/* 영어 - 출력물 보안 - 레이블 */
	width: auto;
}

.lang-ja.SecuPrint .layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w40 {
	/* 일본어 - 출력물 보안 - 레이블 */
	width: auto;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w52 {
	top: 5px;
	width: 52px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w80 {
	top: 5px;
	width: 80px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w120 {
	top: 5px;
	width: 120px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w170 {
	top: 5px;
	width: 170px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type02_w220 {
	top: 5px;
	width: 220px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type03_w40 {
	top: 3px;
	width: 40px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type03_w220 {
	top: 3px;
	width: 220px;
}

.layout_card .area_content .common_content .cont_sec span.ctrl_label.type03_wauto {
	top: 3px;
	width: auto;
}


/*--------------------------------------------
일반 카드 컨텐츠 - 컨트롤(컨텐츠) 좌측 이미지로 표시되는 레이블
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .label_img.label_img_type01 {
	top: 0px;
	width: 80px;
	height: 66px;
}


/*--------------------------------------------
일반 카드 컨텐츠 - 컨트롤 스타일 조정 : 체크박스
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec input[type="checkbox"]+label {
	position: relative;
	top: 2px;
}


/*--------------------------------------------
일반 카드 컨텐츠 - 컨트롤 스타일 조정 : 라디오
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .radio_area {
	position: relative;
}

.layout_card .area_content .common_content .cont_sec .radio_area.type01 {
	top: 5px;
}


/*--------------------------------------------
일반 카드 컨텐츠 - 컨트롤 스타일 조정 : 시간선택 모듈
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .module_time {
	margin-right: 12px;
}


/*--------------------------------------------
일반 카드 컨텐츠 - 컨트롤 스타일 조정 : 텍스트 입력창
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec textarea.long_textarea {
	height: 200px;
	overflow-y: scroll;
}


/*--------------------------------------------
일반 카드 컨텐츠 - [커스텀] 출력물용 커스텀 레이아웃 01
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_print_module01 li {
	width: 24%;
	display: inline-block;
	padding: 10px;
	margin-right: 1.33%;
	margin-bottom: 12px;
	border: 1px solid rgb(187, 187, 187);
	border-radius: 4px;
	text-align: left;
	cursor: pointer;
}

.layout_card .area_content .common_content .cont_sec .custom_print_module01 li:hover {
	background: #f6f6f6;
}


/*--------------------------------------------
일반 카드 컨텐츠 - [커스텀] 출력물용 커스텀 레이아웃 02
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_print_module02 li {
	width: 24%;
	display: inline-block;
	padding: 6px 4px;
	margin-right: 1.33%;
	margin-bottom: 12px;
	border: 1px solid rgb(187, 187, 187);
	border-radius: 4px;
	text-align: left;
}

.layout_card .area_content .common_content .cont_sec .custom_print_module02 li input[type="text"] {
	position: relative;
	bottom: 3px;
	left: 6px;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-bottom: 1px solid #bbb;
	background: transparent;
}

.layout_card .area_content .common_content .cont_sec .custom_print_module02 .type_add_circle_gray {
	width: 16px;
	height: 16px;
	display: inline-block;
	position: relative;
	bottom: 2px;
	background: transparent url("/res/images/common/icn_remove_circle_lightgray.png") no-repeat scroll 0% 0%;
	margin-left: 12px !important;
	cursor: pointer;
}

.layout_card .area_content .common_content .cont_sec .custom_print_module02 .type_add_circle_gray:hover {
	background: transparent url("/res/images/common/icn_remove_circle_gray.png") no-repeat scroll 0% 0% !important;
}

.layout_card .area_content .common_content .cont_sec .custom_print_module02 .type_add_circle_gray[disabled="disabled"] {
	background: #ececec url("/res/images/common/icn_remove_circle_lightgray.png") no-repeat scroll 0% 0% !important;
	border-radius: 50%;
	cursor: default !important;
}

.layout_card .area_content .common_content .cont_sec .custom_print_module02 .type_add_circle_gray[disabled="disabled"]:hover {
	background: #ececec url("/res/images/common/icn_remove_circle_lightgray.png") no-repeat scroll 0% 0% !important;
	border-radius: 50%;
	cursor: default !important;
}


/*--------------------------------------------
일반 카드 컨텐츠 - [커스텀] 출력물용 커스텀 레이아웃 03 : 워터마크(이미지)
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_print_module03 {
	width: 320px;
	height: 280px;
	background: transparent;
	margin: 20px 0px 0px;
	display: block;
	border: 1px solid #bbb;
}


/*--------------------------------------------
일반 카드 컨텐츠 - [커스텀] 출력물용 커스텀 레이아웃 04 : 워터마크(텍스트)
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_print_module04 {
	width: 100px;
	float: left;
	position: relative;
	top: 6px;
}

.layout_card .area_content .common_content .cont_sec .custom_print_module04 li {
	display: inline-block;
	margin: 0px 4px 4px 0px;
}


/*--------------------------------------------
일반 카드 컨텐츠 - [커스텀] 출력물용 커스텀 공통 레이아웃
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_print_module01 li:nth-child(4n),
.layout_card .area_content .common_content .cont_sec .custom_print_module02 li:nth-child(4n) {
	margin-right: 0 !important;
}


/*--------------------------------------------
일반 카드 컨텐츠 - [커스텀] 기술지원센터 안내 커스텀 레이아웃 01
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_tech_info_module01 p {
	margin-bottom: 10px;
}


/*/*--------------------------------------------
일반 카드 컨텐츠 - [커스텀] 원격지원 서비스 안내 커스텀 레이아웃 02
--------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_tech_info_module02 p {
	margin-bottom: 10px;
}

.layout_card .area_content .common_content .cont_sec .custom_tech_info_remote {
	min-height: 330px;
	padding: 30px;
	width: 100%;
	border-radius: 6px;
	border: 1px solid #bbb;
	text-align: center;
}


/*------------------------------------------------------------------
멀티컨텐츠 레이아웃
> [2016] multi_contents - 카드 내 복합 컨텐츠 레이아웃
> [2017.09.08] 멀티칼럼 콘텐츠 구현 목적이었음
> [2017.09.08] 관리자 메뉴, 계약관리 페이지에서만 사용되고 있음
> [2017.09.08] 개행형태로 구조 변경
------------------------------------------------------------------*/

.layout_card .area_content .multi_contents>li {
	margin-bottom: 10px;
}

.layout_card .area_content .multi_contents>li:last-child {
	margin-bottom: 0px;
}

.layout_card .area_content .multi_contents>li .vert_section {
	display: block;
	margin-right: 10px;
	white-space: normal;
	word-break: break-all;
	line-height: 1.5;
	padding-bottom: 8px;
}

.layout_card .area_content .multi_contents>li .vert_section:last-child {
	margin-right: 0;
}

.layout_card .area_content .multi_contents>li .vert_section.type01 {
	/* <본래 값> width: 100px; */
	/* type01은 본래 목적은 여러 크기에 대응하기 위함이었으나, '레이블 표시 요소'임을 나타내는 것으로 사용 */
	padding-bottom: 0;
}

.layout_card .area_content .multi_contents>li .vert_section.multi_contents>li,
.layout_card .area_content .multi_contents>li .vert_section.multi_contents>div {
	margin-bottom: 10px;
}

.layout_card .area_content .multi_contents>li .vert_section.multi_contents>li>div,
.layout_card .area_content .multi_contents>li .vert_section.multi_contents>div>div {
	margin-right: 4px;
	display: inline-block;
}

.layout_card .area_content .multi_contents>li .vert_section.multi_contents>li:last-child,
.layout_card .area_content .multi_contents>li .vert_section.multi_contents>div:last-child {
	margin-bottom: 0px;
}

.layout_card .area_content .multi_contents>li .vert_section.multi_contents>li>div:last-child,
.layout_card .area_content .multi_contents>li .vert_section.multi_contents>div>div:last-child {
	margin-right: 0;
}

.layout_card .area_content .multi_contents>li>hr {
	margin: 6px 0px 3px;
	border-width: 0px 0px 1px;
	border-color: #ccc;
	border-style: dashed;
}

.layout_card .area_content .multi_contents.keep_in span {
	color: #505050;
	line-height: 1.3;
}

.layout_card .area_content .multi_contents>li p {
	font-size: 12px;
	color: #505050;
}

.layout_card .area_content .multi_contents>li p.color_orange01 {
	color: #ff6600;
}

.layout_card .area_content .multi_contents h3 {
	line-height: 1.5;
	color: #505050;
	font-size: 17px;
	margin-bottom: 6px;
}

.layout_card .area_content .multi_contents>li>ul.button_group>li:first-child {
	margin-right: 0;
}

.layout_card .area_content .multi_contents>li>ul.button_group>li {
	margin-right: 6px;
}


/*--------------------------------------------
multi_contents - 세부 스타일 정의 - 조직 대표 이미지 변경
--------------------------------------------*/

.layout_card .area_content .multi_contents a.btn_select_officeimg {
	position: relative;
	display: inline-block;
	overflow: hidden;
}

.layout_card .area_content .multi_contents a.btn_select_officeimg .select_img {
	overflow: hidden;
	width: 60px;
	height: 60px;
	margin-right: 4px;
	background: #ddd;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border: 1px solid #bbb;
}

.layout_card .area_content .multi_contents a.btn_select_officeimg .select_img div.logo_img.default {
	/* 관리자 메뉴 */
	width: 40px;
	height: 40px;
	background: url('/res/images/common/logo_img_default.png') no-repeat;
	background-size: 100%;
}


/*----------------------------------------------------------------------
도움말 아이콘 (helpIcon)
----------------------------------------------------------------------*/

a.helpIcon-circleLine:hover>i.imgShow-icn-helpIcon-circleLine,
a.helpIcon-circleLine-small:hover>i.imgShow-icn-helpIcon-circleLine {
	opacity: 1;
	transition: opacity 0.2s ease-in-out;
}


/*------------------------------------------------------------------
레이아웃카드 : 데이터피커
> 설정레이어팝업에서 필요할 경우 설정레이어팝업에 layout_card 속성을 추가하여 활용
------------------------------------------------------------------*/

.layout_card .datePickerContainer {
	padding: 5px 0 6px;
	border-bottom: 1px solid #bbb;
}

.datePickerContainer .selectlist {
	display: table;
}

.datePickerContainer .selectlist h4 {
	display: table-cell;
	min-width: 100px;
	vertical-align: top;
	padding: 10px 0 0 12px;
}

.datePickerContainer .selectlist h4.title_selectlist_date span.icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(/res/images/common/icon_selectbar_head.png) no-repeat 0 -20px;
	vertical-align: middle;
}

.datePickerContainer .selectlist h4 span.text {
	display: inline-block;
	vertical-align: middle;
	font-size: 13px;
	line-height: 14px;
	margin-left: 2px;
	margin-right: 4px;
}

.datePickerContainer .selectlist .selectlist_group {
	display: table-cell;
}

.datePickerContainer .selectlist .selectlist_group .list_select {
	margin: 5px;
}

.datePickerContainer .selectlist .select_date {
	border: 1px solid #bbb;
}

.area_content .datePickerContainer .selectlist {
	padding-left: 4px !important;
}


/*------------------------------------------------------------------
[커스텀레이아웃] 카드 - 커스텀 레이아웃 02
> 과거 이름 : 외부연동서비스용 커스텀 레이아웃 02
> 라이선스 키 입력 모듈
> 에스원NS 연동 설정
> 설치유도서버 - 통합설정 - 서버설정
------------------------------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_link_module02 {
	float: left;
    width: 100%;
    margin-top: 14px;
}

.NAC .layout_card .area_content .common_content .cont_sec .custom_link_module02 {
	/* NAC - 라이선스 키 - 양쪽 정렬 */
	float: right;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module02 li {
	width: 100%;
	display: inline-block;
	padding: 6px 4px;
	margin-bottom: 10px;
	text-align: center;
	border: 1px solid rgb(187, 187, 187);
	border-radius: 4px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module02 li input[type="text"] {
	position: relative;
	bottom: 3px;
	left: 6px;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-bottom: 1px solid #bbb;
	background: transparent;
}/*--------------------------------------------------------------------------------
[ui_common.css]
> UI - Common - Elements

# [LEGACY] Content Layout - 알아두세요 레이아웃
--------------------------------------------------------------------------------*/


/*--------------------------------------------------------------
Bg - Shadow
--------------------------------------------------------------*/

.bg_shadow {
 	width: 100%;
 	background: rgb(51, 51, 51) none repeat scroll 0% 0%;
 	height: 100%;
 	position: fixed;
 	z-index: 130;
 	opacity: 0.5;
 }

 
/*--------------------------------------------------------------
Headline
--------------------------------------------------------------*/

div.hdline {
	color: #0059a6;
	font-weight: bold;
	font-size: 15px;
	line-height: 1;
}

.col-group>div.hdline {
	/*.col-group 자식 헤드라인*/
	margin-bottom: 4px;
}


/*--------------------------------------------------------------
Label 
--------------------------------------------------------------*/

div.elLabel {
	font-weight: bold;
}

/* 뱃지 */
.elBadge-line {
	color: #0059a6;
	border: 1px solid #0059a6;
	padding: 4px 6px 2px;
	border-radius: 3px;
	font-weight: bold;
}

/* 레이블불렛 */
.labelBullet {
	width: 11px;
	height: 11px;
	display: inline-block;
	background-color: #ddd;
	border-radius: 3px;
	position: relative;
	top: 1px;
	margin-right: 8px;
}

.labelBullet.labelBullet-blueRect {
	/* Bullet - Blue Rectangle */
	width: 4px;
    height: 12px;
    display: inline-block;
    background-color: #0059a6;
    border-radius: 0;
    position: relative;
    top: 2px;
    margin-right: 8px;
}


/*------------------------------------------------------------------
# Up & Down Dual List (twoRowListSet)
------------------------------------------------------------------*/

.twoRowListSet_container {
	width: 100%;
	min-height: 60px;
	border: 1px solid #bbb;
	border-radius: 3px;
	margin-bottom: 10px;
}

.twoRowListSet_container.common_item_list_container {
	height: 150px;
}

.twoRowListSet_container.typeSelectedItemInfo {
	padding: 22px 20px;
	width: 100%;
}

.twoRowListSet_container.typeSelectedItemInfo ul li {
	margin-top: 12px;
}

.twoRowListSet_container.typeSelectedItemInfo ul li .headline {
	width: 20%;
}

.twoRowListSet_container.typeSelectedItemInfo ul li:first-child {
	margin-top: 0;
}


/*------------------------------------------------------------------
# Item List
> Display Item List Vertically
> SCHB
------------------------------------------------------------------*/

.common_item_list_container {
	overflow-y: auto;
	padding: 0 4px;
}

.twoRowListSet_container.emptyContent span.emptyContentText {
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
	margin: 18px 0 0 !important;
	color: #999;
}

.common_item_list .item {
	color: #505050;
	padding: 12px;
	border-bottom: 1px dashed #ccc;
}

.common_item_list .item:last-child {
	border-bottom: 0;
}

.common_item_list .item .itemLeftSection {
	display: inline-block;
}

.common_item_list .item .itemLeftSection>label {
	display: inline-block;
	max-width: 400px;
}

.common_item_list .item div.subItem {
	display: inline-block;
	margin-left: 20px;
}

.common_item_list .item div.subItem:first-child {
	margin-left: 0;
}

.common_item_list .item div.subItem .headline {
	margin-right: 16px !important;
}

.common_item_list .item .itemRightSection {
	float: right;
}

.common_item_list .item .itemRightSection button {
	position: relative;
	bottom: 4px;
}


/*------------------------------------------------------------
# Disable Screen 
------------------------------------------------------------*/

/* 사이즈, 위치는 인라인설정 */

.screen_inactive {
	position: absolute;
	background: #666 none repeat scroll 0% 0%;
	opacity: 0.6;
	display: table;
	padding: 20px;
}

.screen_inactive>p,
.screen_inactive>div {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	line-height: 1.2;
	color: #fff;
}


/*------------------------------------------------------------
# 관리자 권한 표시
------------------------------------------------------------*/

.hasAdminInfo {
	content: "";
	width: 13px;
	height: 13px;
	display: block;
	background: url('/res/images/common_topBar/icn_profile_tooltipTrigger.png') no-repeat;
	float: left;
	cursor: pointer;
	margin: 3px 0 0 5px;
	bottom: 1px;
}

.hasAdminInfo:hover {
	opacity: .7;
}

.common_item_list .hasAdminInfo {
	/*공통아이템표시리스트 > hasAdminInfo*/
	display: inline-block;
	float: right;
}


/*------------------------------------------------------------
듀얼 넘버 카운터 모듈 (시큐허브)
------------------------------------------------------------*/

.dualNumberCounter {
	margin-top: 18px;
	margin-bottom: 16px;
}

.dualNumberCounter>.col {
	text-align: center;
}

.dualNumberCounter .text-number {
	font-size: 38px;
	display: block;
	font-weight: bold;
}

.dualNumberCounter .text-number>span {
	color: #505050;
	font-size: 15px;
	font-weight: normal;
	display: inline-block;
	margin-left: 6px;
	position: relative;
	bottom: 6px;
}

.dualNumberCounter .text-status {
	display: block;
	margin-top: 16px;
	font-weight: bold;
}

.dualNumberCounter>.col:first-of-type {
	position: relative;
}

.dualNumberCounter>.col:first-of-type:after {
	content: "";
	display: block;
	position: absolute;
	width: 1px;
	height: 46px;
	right: 0;
	top: 10px;
	background-color: #d6d6d6;
}

.dualNumberCounter>.col.col-1-1:first-of-type:after {
	display: none;
}

.dualNumberCounter+.row .bodyText {
	padding-top: 5px;
}

.dualNumberCounter>.col.col-1-1 .imgShow {
	height: 56px;
	width: 65px;
}

.dualNumberCounter>.col.col-1-1 .text-status {
	margin-top: 2px;
}

.dualNumberCounter>.col.col-1-1 .text-status:after {
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	width: 36px;
	height: 1px;
	background-color: #d6d6d6;
	margin-left: -18px;
	margin-top: 10px;
}


/*------------------------------------------------------------------
[LEGACY] Card - Content Layout - Legacy - Card - Multi Column Layout
> Card - Legacy Content Layout
> Legacy 코드로 현재에는 'content layout - grid'를 사용하여 구성
------------------------------------------------------------------*/

.multi_col {
	display: inline-block;
	background: transparent;
	padding: 12px 0;
}

.multi_col>div {
	padding: 5px 16px 16px;
}

.multi_col.two_col {
	width: 50%;
}

.multi_col.two_col.border_right {
	border-right: 1px solid #bbb;
}

.multi_col .text_value,
.multi_col .text_title {
	font-size: 12px;
}

.layout_card .area_content .multi_col>div.graph_cont_type01 {
	/* layout_card - 다중칼럼레이아웃 - 콘텐츠영역 너비 커스텀 - 160516 신형섭 */
	padding: 5px 16px 1px 16px
}


/*------------------------------------------------------------------
[LEGACY] Content Layout - Legacy - contVert & contRow 
------------------------------------------------------------------*/

.contVert {
	width: 100%;
}

.contRow {
	width: 100%;
	font-size: 0;
	line-height: 0;
	position: relative;
	text-align: left;
}


/*--------------------------------------------
[LEGACY] Content Layout - Legacy - 행 강제 줄바꿈
--------------------------------------------*/

.clear_contRow::after {
	content: "";
	display: inline-block;
	font-size: 0;
	line-height: 0;
	width: 100%;
	height: 0;
}


/*--------------------------------------------
[LEGACY] Content Layout - Legacy - (직하위)구성콘텐츠 기본속성
--------------------------------------------*/

.contRow>* {
	display: inline-block;
	vertical-align: middle;
	font-size: 13px;
	line-height: 1;
}

.contRow.tableContainer>* {
	display: table;
}


/*--------------------------------------------
[LEGACY] Content Layout - Legacy - 구성콘텐츠 정렬법
--------------------------------------------*/

.contRow.horzAlignLeft {
	text-align: left;
}

.contRow.horzAlignCenter {
	text-align: center;
}

.contRow.horzAlignRight {
	text-align: right;
}

.contRow.horzAlignJustify {
	text-align: justify;
}

.contRow.vertAlignTop>* {
	vertical-align: top;
}

.contRow.vertAlignMiddle>* {
	vertical-align: middle;
}

.contRow.vertAlignBottom>* {
	vertical-align: bottom;
}


/*--------------------------------------------
[LEGACY] Content Layout - Legacy - 구성콘텐츠 폭
--------------------------------------------*/

.contRow>.w10pct {
	width: 10%;
}

.contRow>.w20pct {
	width: 20%;
}

.contRow>.w30pct {
	width: 30%;
}

.contRow>.w40pct {
	width: 40%;
}

.contRow>.w50pct {
	width: 50%;
}

.contRow>.w60pct {
	width: 60%;
}

.contRow>.w70pct {
	width: 70%;
}

.contRow>.w80pct {
	width: 80%;
}

.contRow>.w90pct {
	width: 90%;
}

.contRow>.w100pct {
	width: 100%;
}

.contRow>.stickToRight {
	position: absolute;
	right: 0;
	top: 0;
}


/*--------------------------------------------
[LEGACY] Content Layout - Legacy - 경계선
--------------------------------------------*/

.contRow div.divider {
	width: 100%;
	height: 1px;
	background: #bbb;
}


/*------------------------------------------------------------------
# [LEGACY] Content Layout - 알아두세요 레이아웃
------------------------------------------------------------------*/

.con_table_keep {
	/* contents - layout_card - 알아두세요/테이블 영역*/
	padding: 10px 0 15px 0;
}

.keep_title {
	font-weight: bold;
	font-size: 15px;
	color: #0059a6;
	text-align: center;
	line-height: 15px;
	padding: 11px 0 11px 0;
	border-bottom: 1px solid #bbb !important;
}

.keep_in {
	padding: 5px 20px 5px 20px;
}

.keep_in span {
	font-size: 13px;
	line-height: 23px;
	color: #727272;
}

.keep_in .pa {
	font-weight: bold;
	padding-left: 6px;
	color: #0059a6;
	padding-right: 6px;
}

.keep_in .icon {
	background: url(/res/images/common/blue_dot.png) left no-repeat;
	vertical-align: middle;
	width: 2px;
	height: 2px;
	padding: 0 2px 0 2px !important;
}

.keep_in .in2 {
	font-weight: bold;
	font-size: 13px;
	line-height: 20px;
	color: #0059a6;
}

.keep_in>em {
	/* 임시 비밀번호 > 알아두세요 */
	display: block;
}/*------------------------------------------------------------------------
[ui_serviceOverview.css]
- 내용 : 서비스 모아보기 팝업 UI모듈 스타일 정의

[문서목차]
- # 서비스 모아보기 - 예전 스타일 (16년)
- # 서비스 모아보기 - 새로운 스타일 (17년 - OW)
------------------------------------------------------------------------*/


/*-----------------------------------------------
# 서비스 모아보기 - 예전 스타일 (16년)
-----------------------------------------------*/

.alert_popup.custom_service_overview ul.content_wrapper li.alert_top {
	height: 80px;
	padding-top: 17px;
}

.alert_popup.custom_service_overview.custom_service_overview_ok ul.content_wrapper li.alert_top {
	padding-top: 11px;
}

.alert_popup.custom_service_overview ul.content_wrapper li.alert_top>h4 {
	font-size: 13px;
	line-height: 1;
	color: #0059a6;
	text-align: center;
	margin-top: 7px;
}

html[lang='ko'] .alert_popup.custom_service_overview ul.content_wrapper li.alert_top .custom_service_overview_logo {
	display: block;
	width: 100px;
	margin: 0 auto;
	height: 24px;
	background: url(/res/textimages/kopsh1_logo.png) no-repeat;
}
html[lang='en'] .alert_popup.custom_service_overview ul.content_wrapper li.alert_top .custom_service_overview_logo {
	display: block;
	width: 100px;
	margin: 0 auto;
	height: 24px;
	background: url(/res/textimages/enpsh1_logo.png) no-repeat;
}
html[lang='ja'] .alert_popup.custom_service_overview ul.content_wrapper li.alert_top .custom_service_overview_logo {
	display: block;
	width: 100px;
	margin: 0 auto;
	height: 24px;
	background: url(/res/textimages/japsh1_logo.png) no-repeat;
}

.alert_popup.custom_service_overview ul.content_wrapper li.alert_top .custom_service_overview_logo_ok {
	display: block;
	width: 174px;
	margin: 0 auto;
	height: 32px;
	background: url(/res/images/js/h1_logo_ok.png) no-repeat;
}

.alert_popup.custom_service_overview ul.content_wrapper li.alert_top .custom_service_overview_logo_ks {
	display: block;
	width: 174px;
	margin: 0 auto;
	height: 32px;
	background: url(/res/images/ks/h1_logo_ks.png) no-repeat;
}

.alert_popup.custom_service_overview ul.content_wrapper li.alert_middle {
	padding: 24px 50px 16px 50px;
}

.alert_popup.custom_service_overview ul.content_wrapper li.alert_middle .s_main_headline {
	margin-bottom: 2px;
}

.alert_popup.custom_service_overview ul.content_wrapper li.alert_middle .s_main_headline>h3 {
	color: #767676;
}

.alert_popup.custom_service_overview .s_main_text>ul {
	text-align: center;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item {
	text-align: center;
	width: 14%;
	margin-right: 0;
	display: inline-block;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item:nth-child(5n) {
	margin-right: 0;
}


/*--------------------------------------------
서비스별 영역/로고이미지 정의(PS)
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item div.service_item_img {
	width: 80px;
	height: 80px;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-position: center;
}


/*--------------------------------------------
통합 PC보안  :service_pc_sec
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_pc_sec div.service_item_img {
	background: url('/res/images/custom/img_launcher_pc.png') no-repeat;
	background-position: 4px 11px !important;
	background-size: 90% !important;
}


/*--------------------------------------------
출력물보안 : service_print
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_print div.service_item_img {
	background: url('/res/images/custom/img_launcher_print.png') no-repeat;
	background-position: 2px 3px !important;
	background-size: 97% !important;
}


/*--------------------------------------------
PC 보안점검 : service_pcmanage
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_pcmanage div.service_item_img {
	background: url('/res/images/custom/img_launcher_pcmanage_ps.png') no-repeat;
	background-position: 8px 15px !important;
	background-size: 84% !important;
}


/*--------------------------------------------
문서보안 : service_drm
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_drm div.service_item_img {
	background: url('/res/images/custom/img_launcher_drm.png') no-repeat;
	background-position: 0 9px !important;
	background-size: 95% !important;
}


/*--------------------------------------------
업무용메신저 : service_messenger
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_messenger div.service_item_img {
	background: url('/res/images/custom/img_launcher_messenger.png') no-repeat;
	background-position: 0px 9px !important;
	background-size: 90% !important;
}


/*--------------------------------------------
안티바이러스 : service_vac
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_vac div.service_item_img {
	background: url('/res/images/custom/img_launcher_vac.png') no-repeat;
	background-position: 4px -3px !important;
	background-size: 79% !important;
}


/*--------------------------------------------
PS백신 : service_filebackup
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_filebackup div.service_item_img {
	background: url('/res/images/custom/img_launcher_backup.png') no-repeat;
	background-position: 17px 19px !important;
	background-size: 57% !important;
}


/*--------------------------------------------
서비스별 영역/로고이미지 정의 : 비활성화;
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled.service_pc_sec div.service_item_img {
	background: url('/res/images/custom/img_launcher_pc_disabled.png') no-repeat;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled.service_print div.service_item_img {
	background: url('/res/images/custom/img_launcher_print_disabled.png') no-repeat;
}


/*--------------------------------------------
PC 보안점검 : service_pcmanage 
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled.service_pcmanage div.service_item_img {
	background: url('/res/images/custom/img_launcher_pcmanage_disabled_ps.png') no-repeat;
	background-position: 8px 15px !important;
	background-size: 84% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled.service_drm div.service_item_img {
	background: url('/res/images/custom/img_launcher_drm_disabled.png') no-repeat;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled.service_messenger div.service_item_img {
	background: url('/res/images/custom/img_launcher_messenger_disabled.png') no-repeat;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled.service_vac div.service_item_img {
	background: url('/res/images/custom/img_launcher_vac_disabled.png') no-repeat;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled.service_filebackup div.service_item_img {
	background: url('/res/images/custom/img_launcher_backup_disabeld.png') no-repeat;
}


/*------------------------------------------------------------------
서비스별 소개 텍스트(PS)
------------------------------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item>span {
	display: block;
	font-size: 14px;
	color: #0059a6;
	margin-bottom: 5px;
}


/*--------------------------------------------
서비스별 소개 텍스트 : 비활성화
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled>span {
	color: #c0c0c0;
}


/*--------------------------------------------
서비스별 소개 텍스트 : 바로가기 버튼
--------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item>button {
	display: block;
	margin: 0 auto;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled>button {
	background: #ececec;
	color: #777;
	border: 1px solid #c0c0c0;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled>button>span {
	opacity: .6;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_item_disabled>button:hover {
	background: #ececec;
	color: #777;
	border: 1px solid #c0c0c0;
}


/*--------------------------------------------
서비스별 영역/로고이미지 정의(OK)
--------------------------------------------*/

.alert_popup.custom_service_overview.custom_service_overview_ok .s_main_text>ul>li.service_item {
	text-align: center;
	width: 16%;
	margin-right: 0;
	display: inline-block;
}

.alert_popup.custom_service_overview.custom_service_overview_ok .s_main_text>ul>li.service_item div.service_item_img {
	width: 80px;
	height: 80px;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-position: center;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_pc_sec_ok div.service_item_img {
	/* 통합 PC보안  :service_pc_sec*/
	background: url('/res/images/custom/img_launcher_ok_pc.png') no-repeat;
	background-position: 7px 13px !important;
	background-size: 84% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_print_ok div.service_item_img {
	/* 출력물보안 : service_print */
	background: url('/res/images/custom/img_launcher_ok_print.png') no-repeat;
	background-position: 2px 2px !important;
	background-size: 97% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_pcmanage_ok div.service_item_img {
	/* PC 보안점검 : service_pcmanage */
	background: url('/res/images/custom/img_launcher_pcmanage.png') no-repeat;
	background-position: 8px 15px !important;
	background-size: 84% !important;
}


.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_omsg_ok div.service_item_img {
	/* 업무용메신저 : service_omsg */
	background: url('/res/images/custom/img_launcher_omsg.png') no-repeat;
	background-position: 13px 14px !important;
	background-size: 60% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_nac_ok div.service_item_img {
	/* NAC : service_NAC_ok */
	background: url('/res/images/custom/img_launcher_ok_nac.png') no-repeat;
	background-position: 17px 16px !important;
	background-size: 63% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_filebackup_ok div.service_item_img {
	/* 백업 : service_filebackup_ok */
	background: url('/res/images/custom/img_launcher_backup_ok.png') no-repeat;
	background-position: 17px 16px !important;
	background-size: 63% !important;
}


/*------------------------------------------------------------
서비스별 영역/로고이미지 정의 : 비활성화;
------------------------------------------------------------*/

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_pc_sec_ok.service_item_disabled div.service_item_img {
	/* 통합PC보안 : service_pc_sec_ok */
	background: url('/res/images/custom/img_launcher_ok_pc_disabled.png') no-repeat;
	background-position: 7px 13px !important;
	background-size: 84% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_print_ok.service_item_disabled div.service_item_img {
	/* 출력물보안 : service_print_ok */
	background: url('/res/images/custom/img_launcher_ok_print_disabled.png') no-repeat;
	background-position: 2px 2px !important;
	background-size: 97% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_pcmanage_ok.service_item_disabled div.service_item_img {
	/* PC 보안점검 : service_pcmanage */
	background: url('/res/images/custom/img_launcher_pcmanage_disabled.png') no-repeat;
	background-position: 8px 15px !important;
	background-size: 84% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_omsg_ok.service_item_disabled div.service_item_img {
	/* 업무용메신저 : service_omsg */

	background: url('/res/images/custom/img_launcher_omsg_disabled.png') no-repeat;
	background-position: 13px 14px !important;
	background-size: 60% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_nac_ok.service_item_disabled div.service_item_img {
	/* NAC : service_NAC_ok */
	background: url('/res/images/custom/img_launcher_ok_nac_disabled.png') no-repeat;
	background-position: 17px 16px !important;
	background-size: 63% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_filebackup_ok.service_item_disabled div.service_item_img {
	/* 백업 : service_filebackup_ok */
	background: url('/res/images/custom/img_launcher_backup_ok_disabled.png') no-repeat;
	background-position: 17px 16px !important;
	background-size: 63% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_nac_ok div.service_item_img {
	/* NAC : service_nac */
	background: url('/res/images/custom/img_launcher_ok_nac.png') no-repeat;
	background-position: 7px 15px !important;
	background-size: 84% !important;
}

.alert_popup.custom_service_overview .s_main_text>ul>li.service_item.service_nac_ok.service_item_disabled div.service_item_img {
	/* NAC : service_nac */
	background: url('/res/images/custom/img_launcher_ok_nac_disabled.png') no-repeat;
	background-position: 6px 14px !important;
	background-size: 84% !important;
}

.alert_popup.custom_service_overview.custom_service_overview_ok .s_main_text>ul>li.service_item {
	/* 서비스별 영역/로고이미지 정의(OK) */
	width: 16%;
}


/*--------------------------------------------------------
# 서비스 모아보기 - 새로운 스타일 (17년 - OW)
--------------------------------------------------------*/


/*----------------------------------------
# 기본 스타일
----------------------------------------*/

.container_globalService {
	display: none;
	position: absolute;
	z-index: 151;
	background: #fff;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
	cursor: auto;
}

.container_globalService .titleSection>div {
	display: inline-block;
	/*background-size: 11px 11px;*/
	background-position: 15px 9px;
	background-image: url(/res/images/common/btn_servicebar_serviceglobal_blue_big.png);
	background-repeat: no-repeat;
	width: 42px;
	height: 30px;
	cursor: pointer;
}

.container_globalService .titleSection>span {
	/* 텍스트 - 서비스 모아보기 */
	font-weight: bold;
	display: inline-block;
	/*display: none;*/
	position: relative;
	bottom: 10px;
	right: 8px;
	font-size: 12px;
}

.container_globalService>li {
	padding: 28px 24px 28px 30px;
	border-bottom: 1px solid #bbb;
}

.container_globalService>li:last-child {
	border-bottom: 0;
}

.container_globalService .main {
	min-width: 180px;
	width: 216px;
}

.container_globalService .sub li {
	float: left;
	width: 110px;
	text-align: center;
	margin-right: 10px;
}

.container_globalService .sub:last-child li {
	margin-right: 0;
}

.container_globalService .main img,
.container_globalService .main a,
.container_globalService .main span,
.container_globalService .sub li img,
.container_globalService .sub li a,
.container_globalService .sub li span {
	display: block;
}

.container_globalService .main span {
	margin-top: 8px;
	margin-bottom: 12px;
	font-size: 12px;
}

.container_globalService .main a {
	font-weight: bold;
	/* width: 82px; */
	background: #fff;
	color: #666;
	width: auto;
	/* display: inline-block; */
	border-color: #bbb;
	/* border-bottom: 2px solid #999; */
	display: none;
}

.container_globalService .main a:hover {
	background: #F0F0F0;
	color: #666;
	border: 1px solid #bbb;
	border-bottom: 2px solid #bbb;
}

.container_globalService .main a.active {
	background: #338b00 !important;
	border: 1px solid #338b00 !important;
	width: 121px !important;
	cursor: default !important;
}

.container_globalService .sub li img {
	margin: 0 auto;
	width: 70%
}

.container_globalService .sub li span {
	font-weight: bold;
	color: #0059a6;
	margin-top: 0;
	margin-bottom: 6px;
	font-size: 12px;
	height: 34px;
	line-height: 1.2;
}

.lang-ja .container_globalService .sub li span {
	font-size: 11px;
}

.container_globalService .sub li a>span {
	height: auto;
}

.container_globalService .sub li a {
	width: 70px;
	margin: 0 auto;
	font-weight: bold;
}


/*----------------------------------------
런치 버튼 액티브 스타일
----------------------------------------*/

.container_globalService .sub li a.active {
	/* border-color: #338b00 !important; */
	/* background: #338b00 !important; */
	background: #0059a6;
	border-color: #0059a6;
	color: #ffffff !important;
}

.container_globalService .globalService_divider {
	background: url('/res/images/common_divider/bg_dashed.jpg') repeat;
	margin: 0 18px 0 30px;
	width: 1px;
	height: 120px;
}

.container_globalService .bg_img.launcher {
	width: 70px;
	height: 60px;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-size: 100%;
}


/*----------------------------------------
서비스 로고
----------------------------------------*/

.container_globalService .titleSection .logoSection {
	/* 플랫폼 로고 삽입 영역 */
	/* display: none; */
	display: block;
	background-image: none;
	width: auto;
	cursor: default;
	padding: 12px 30px 20px;
	margin-bottom: 0;
	border-bottom: 1px solid #bbb;
	line-height: 1;
	height: auto;
}

.container_globalService .titleSection .logoSection .imgSection {
	/* 오피스웨어 플랫폼 */
	width: 266px;
	height: 30px;
	background-image: url('/res/images/js/h1_logo_ow_admin.png');
	background-repeat: no-repeat;
}

.schb .container_globalService .titleSection .logoSection .imgSection {
	width: 224px;
	height: 36px;
	background-image: url('/res/images/js/h1_logo_schb_topbar.png');
	background-repeat: no-repeat;
}

.container_globalService .titleSection .logoSubTitle {
	font-size: 13px;
	display: block;
	color: #0059a6;
	margin-top: 6px;
	font-weight: bold;
	margin-left: 2px;
}


/*------------------------------------------------------------
# 서비스 별 아이콘 
------------------------------------------------------------*/


/*----------------------------------------
오피스키퍼
----------------------------------------*/

.container_globalService .bg_img.launcher.PCSecurity {
	/* 정보유출방지 */
	background-image: url("/res/images/custom/img_launcher_ok_dlp.png");
	position: relative;
	left: 1px;
	top: 1px;
	background-size: 87%;
	background-position: 6px 0px;
}

.container_globalService .bg_img.launcher.DLP {
	/* 정보유출방지 */
	background-image: url("/res/images/custom/img_launcher_ok_dlp.png");
	position: relative;
	left: 1px;
	top: 1px;
	background-size: 87%;
	background-position: 6px 0px;
}

.container_globalService .bg_img.launcher.SecuPrint {
	/* 출력물 보안 */
	background-image: url("/res/images/custom/img_launcher_ok_printSecu.png");
	background-size: 100%;
	position: relative;
	bottom: 2px;
	left: 2px;
	background-size: 87%;
	background-position: 4px 2px;
}

.container_globalService .bg_img.launcher.MPI {
	/* PC보안점검 */
	background-image: url("/res/images/custom/img_launcher_pcmanage.png");
	background-size: 87%;
	background-position: 4px 1px;
}

.container_globalService .bg_img.launcher.FileBackup {
	/* 백업 */
	background-image: url("/res/images/custom/img_launcher_oshd_bkup.png");
	position: relative;
	top: 0px;
	left: 1px;
	background-size: 65%;
	background-position: 11px 1px;
}

.container_globalService .bg_img.launcher.ETC {
	/* 기타관리 */
	background-size: 92%;
	background-image: url("/res/images/custom/img_launcher_ok_etc.png") !important;
	position: relative;
	top: 1px;
	left: 4px;
}

.container_globalService .bg_img.launcher.ITAsset {
	background-size: 83%;
	background-image: url("/res/images/custom/img_launcher_itasset_ok.png");
	background-position: 8px;
	position: relative;
	bottom: 2px;
}

.container_globalService .bg_img.launcher.NAC {
	/* 설치유도서버 */
	background-image: url("/res/images/custom/img_launcher_ok_nac.png");
	background-size: 87%;
	position: relative;
	top: 0px;
	right: -2px;
}

.lang-ja .container_globalService .bg_img.launcher.NAC+span {
	/* 일문 - NAC - 텍스트 줄바꿈 조정 */
	width: 90px;
	margin: 0 auto;
}

.container_globalService .bg_img.launcher.DRM {
	background-size: 106%;
	background-image: url("/res/images/custom/img_launcher_drm.png");
	position: relative;
	top: -5px;
	right: 4px;
}

.container_globalService .bg_img.launcher.DRM_SoftCamp {
	background-size: 106%;
	background-image: url("/res/images/custom/img_launcher_drm.png");
	position: relative;
	top: -5px;
	right: 4px;
}

.container_globalService .bg_img.launcher.Vaccine {
	background-image: url(/res/images/custom/img_launcher_dataSecu.png);
	background-size: 87%;
	background-position: 3px 4px;
	position: relative;
	bottom: 3px;
	left: 4px;
}

.container_globalService .bg_img.launcher.dataFirewall {
	background-image: url("/res/images/custom/img_launcher_oshd_firewall.png");
	background-size: 100%;
	background-position: 0;
	position: relative;
	bottom: 2px;
}


/*----------------------------------------
오피스메신저
----------------------------------------*/

.container_globalService .bg_img.launcher.Messenger {
	position: relative;
	top: 0px;
	right: -9px;
	background-size: 62%;
	background-position: 6px 4px;
	background-image: url(/res/images/custom/img_launcher_omsg.png);
}


/*----------------------------------------
에스원PS
----------------------------------------*/

.S1PS .container_globalService .bg_img.launcher.PCSecurity {
	/* DLP */
	background-image: url(/res/images/custom/img_launcher_pc.png);
	background-size: 86%;
	background-position: center;
}
.S1PS .container_globalService .bg_img.launcher.DLP {
	/* DLP */
	background-image: url(/res/images/custom/img_launcher_pc.png);
	background-size: 86%;
	background-position: center;
}

.S1PS .container_globalService .bg_img.launcher.SecuPrint {
	/* 출력물보안 */
	background-image: url(/res/images/custom/img_launcher_print.png);
	background-size: 94%;
	background-position: 0 -1px;
}

.S1PS .container_globalService .bg_img.launcher.MPI {
	/* PC보안점검 */
	background-image: url(/res/images/custom/img_launcher_pcmanage_ps.png);
	background-size: 84%;
	background-position: 6px 6px;
}

.S1PS .container_globalService .bg_img.launcher.FileBackup {
	/* 백업 */
	background-image: url(/res/images/custom/img_launcher_backup.png);
	background-size: 64%;
	background-position: 14px 5px;
}

.S1PS .container_globalService .bg_img.launcher.Vaccine {
	/* 안티바이러스 */
	background-image: url(/res/images/custom/img_launcher_vac.png);
	background-size: 78%;
	background-position: 0 -6px;
}

.S1PS .container_globalService .bg_img.launcher.DRM {
	/* 문서보안 */
	background-image: url(/res/images/custom/img_launcher_drm.png);
	background-size: 94%;
	background-position: 5px 5px;
}

.S1PS .container_globalService .bg_img.launcher.DRM_SoftCamp {
	/* 문서보안 */
	background-image: url(/res/images/custom/img_launcher_drm.png);
	background-size: 94%;
	background-position: 5px 5px;
}

.S1PS .container_globalService .bg_img.launcher.Messenger {
	/* 메신저 */
	background-image: url(/res/images/custom/img_launcher_messenger.png);
	background-size: 85%;
	background-position: 0 2px;
}

.S1PS .container_globalService .bg_img.launcher.AppCheck {
	/* 메신저 */
	background-image: url(/res/images/custom/img_launcher_ransom_ps.png);
	background-size: 85%;
	background-position: 0 2px;
}


/*----------------------------------------
SecuHub 복합기 관리
----------------------------------------*/

.schb .container_globalService .bg_img.launcher.DLP 
{
	/*서비스 모아보기 : 정보유출방지 서비스 아이콘 수정*/
	background-image: url(/res/images/custom/img_launcher_ok_dlp.png);
	position: relative;
	left: 1px;
	bottom: 0px;
}

.schb .container_globalService .bg_img.launcher.FileBackup {
	/*서비스 모아보기 :오피스키퍼 백업 서비스 아이콘 정의*/
	background-image: url("/res/images/custom/img_launcher_backup_ok.png");
	background-size: 66%;
	background-position: 8px 2px;
	position: relative;
	top: 3px;
	left: 6px;
}

.schb .container_globalService .bg_img.launcher.SecuPrint {
	/*서비스 모아보기 : 출력물보안 서비스 아이콘 수정*/
	background-image: url("/res/images/custom/img_launcher_printingSecu.png");
	position: relative;
	bottom: 2px;
	left: 2px;
	background-size: 82%;
}

.schb .container_globalService .bg_img.launcher.MPS {
	/*서비스 모아보기 : 복합기보안 서비스 아이콘 수정*/
	background-image: url("/res/images/custom/img_launcher_xeroxSecu.png");
	position: relative;
	bottom: 2px;
	left: 2px;
}

/*----------------------------
애니메이티드 클로즈 버튼 : 커스텀
----------------------------*/

.wrap_header_servicebar .cssCloseButtonOuter {
	display: inline-block;
	position: absolute;
	right: 0;
	top: 0;
	margin-right: 13px;
	margin-top: 7px;
	cursor: pointer !important;
	background-image: none !important;
	width: 20px !important;
	height: 20px !important;
}

.wrap_header_servicebar .cssCloseButtonInner label {
	color: #767676;
	line-height: 20px;
	position: absolute;
	left: 0;
	margin-left: -5px;
	margin-top: -1px;
}

.lang-ko .wrap_header_servicebar .cssCloseButtonInner label {
	margin-top: 0;
}

.wrap_header_servicebar .cssCloseButtonInner:before,
.wrap_header_servicebar .cssCloseButtonInner:after {
	background: #0059a6;
}
/*---------------------------------------------------------------------------------------------------
[ui_image.css]
> imgShow - background
---------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------
폰트아이콘 - OWUI-fontIco
> EXSP
------------------------------------------------------------------*/

.owui-fontIco-icnBtn-sideBar-approval:before { content: "\e900"; }

.owui-fontIco-icnBtn-sideBar-dashboard:before {	content: "\e901" ; }

.owui-fontIco-icnBtn-sideBar-logs:before { content: "\e902"; }

.owui-fontIco-icnBtn-sideBar-policy:before { content: "\e903"; }

.owui-fontIco-icnBtn-sideBar-settings:before { content: "\e904"; }

.owui-fontIco-icnBtn-sideBar-support:before { content: "\e905"; }

.owui-fontIco-icnBtn-sideBaru-users:before { content: "\e906"; }


/*-----------------------------------------------------------------------------
'imgShow-' 이미지 표시 클래스
-----------------------------------------------------------------------------*/

[class*="imgShow-"] {
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: top;
}

.imgShow-gifImgScanning {
    background-image: url('/res/images/dashboard/icnMotion-pcScan-circle.gif');
    width: 116px;
    height: 116px;
}

.imgShow-gifImgScanning-disabled {
    background-image: url('/res/images/dashboard/icnMotion-pcScan-circle-disabled.png');
    width: 116px;
    height: 116px;
}

.imgShow-policy {
    background-image: url('/res/images/common/icn_policy_small.png');
}

.imgShow-basicPolicy-unlimited {
    /* SecuHub - Basic Policy - Unlimited */
	background-image: url('/res/images/dashboard_printerManage/icn_printerManage_basicPolicy_unlimited.png');
}

.imgShow-basicPolicy-blackOnly {
    /* SecuHub - Basic Policy - Black Only */
	background-image: url('/res/images/dashboard_printerManage/icn_printerManage_basicPolicy_blackOnly.png');
}

.imgShow-basicPolicy-usageLimit {
    /* SecuHub - Basic Policy - Usage Limit */
	background-image: url('/res/images/dashboard_printerManage/icn_printerManage_basicPolicy_usageLimit.png');
}

.imgShow-basicPolicy-featureLimit {
    /* SecuHub - Basic Policy - Feature Limit */
	background-image: url('/res/images/dashboard_printerManage/icn_printerManage_basicPolicy_featureLimit.png');
}

.imgShow-jiransoftLogo-gray {
    /* Jiransoft Logo Gray */
    background-image: url('/res/images/login/img_loginfooter_jiransoft_gray_en.png');
    width: 106px;
}

.imgShow-arrowLineRightBlue {
    /* Arrow - Line - Right - Blue */
    background-image: url('/res/images/common_icn/icn-arrowLineRightBlue.svg');
    width: 14px;
    height: 10px;
    top: 1px;
    background-position: left;
    background-size: 14px 10px;
}


/*----------------------------------------
icons - menuHub
----------------------------------------*/

/*----------------------
icons - menuHub - settings - EXSP
----------------------*/

.imgShow-menuHub-settings {
    background-image: url('/res/images/common_icn_menuHub/icn-menuHub-settings.svg');
    background-position: 0 0;
    width: 90px;
    height: 90px;
    top: 12px;
}

.menuHub-settings-contract .imgShow-menuHub-settings {
    background-position: 0 0;
}

.menuHub-settings-agent .imgShow-menuHub-settings {
    background-position: -90px 0;
    top: 13px;
}

.menuHub-settings-alert .imgShow-menuHub-settings {
    background-position: -180px 0;
    top: 13px;
}

.menuHub-settings-security .imgShow-menuHub-settings {
    background-position: -270px 0;
    top: 13px;
}


/*----------------------
icons - menuHub - logs - EXSP
----------------------*/

.imgShow-menuHub-logs {
    background-image: url('/res/images/common_icn_menuHub/icn-menuHub-logs.svg');
    background-position: 0 0;
    background-size: 540px 90px;
    width: 90px;
    height: 90px;
    top: 10px;
}

.menuHub-logs-dlp .imgShow-menuHub-logs {
    background-position: 0 0;
}

.menuHub-logs-encryption .imgShow-menuHub-logs {
    background-position: -90px 0;
    top: 9px;
}

.menuHub-logs-appManage .imgShow-menuHub-logs {
    background-position: -180px 0;
    top: 8px;
}

.menuHub-logs-webManage .imgShow-menuHub-logs {
    background-position: -270px 0;
    top: 10px;
}

.menuHub-logs-pcHealthcheck .imgShow-menuHub-logs {
    background-position: -360px 0;
    top: 7px;
}

.menuHub-logs-printSecu .imgShow-menuHub-logs {
    background-position: -450px 0;
    top: 6px;
}


/*----------------------
icons - menuHub - policySetup - EXSP
----------------------*/

.imgShow-menuHub-policySetup {
    background-image: url('/res/images/common_icn_menuHub/icn-menuHub-policySetup.svg');
    background-position: 0 0;
    background-size: 540px 90px;
    width: 90px;
    height: 90px;
    top: 10px;
}

.menuHub-policySetup-dlp .imgShow-menuHub-policySetup {
    background-position: 0 0;
}

.menuHub-policySetup-encryption .imgShow-menuHub-policySetup {
    background-position: -90px 0;
    top: 9px;
}

.menuHub-policySetup-appManage .imgShow-menuHub-policySetup {
    background-position: -180px 0;
    top: 8px;
}

.menuHub-policySetup-webManage .imgShow-menuHub-policySetup {
    background-position: -270px 0;
    top: 10px;
}

.menuHub-policySetup-pcHealthcheck .imgShow-menuHub-policySetup {
    background-position: -360px 0;
    top: 7px;
}

.menuHub-policySetup-printSecu .imgShow-menuHub-policySetup {
    background-position: -450px 0;
    top: 6px;
}


/*---------------------------------------- 
imgShow - toastPopup
----------------------------------------*/

.imgShow-icn-toastPopup-status,
.toastPopup.status-success .imgShow-icn-toastPopup-status {
    /* toastPopup - Success */
    background-image: url('/res/images/common_icn/icn_toastPopup_status.svg');
    background-position: 0 0;
    background-size: 30px 60px;
    width: 30px;
    height: 30px;;
}

.toastPopup.status-error .imgShow-icn-toastPopup-status {
    /* toastPopup - Error */
    background-position: 0 -30px;
}


/*---------------------------------------- 
imgShow - helpIcon - circleLine
----------------------------------------*/

.imgShow-icn-helpIcon-circleLine,
.helpIcon-circleLine.helpIcon-notice .imgShow-icn-helpIcon-circleLine {
    /*  helpIcon - circleLine - notice */
    background-image: url('/res/images/common_icn/icn_helpIcons_circleLine.svg');
    background-position: 0 0;
    background-size: 19px 57px;
    width: 19px;
    height: 19px;;
    opacity: 0.5;
    bottom: 2px;
    transition: opacity 0.2s ease-in-out;
}

.helpIcon-circleLine.helpIcon-warning .imgShow-icn-helpIcon-circleLine {
    /*  helpIcon - circleLine - warning */
    background-position: 0 -19px;
    opacity: 0.8;
}

.helpIcon-circleLine.helpIcon-question .imgShow-icn-helpIcon-circleLine {
    /*  helpIcon - circleLine - question */
    background-position: 0 -38px;
}

.helpIcon-circleLine-small .imgShow-icn-helpIcon-circleLine,
.helpIcon-circleLine-small.helpIcon-notice .imgShow-icn-helpIcon-circleLine {
    /*  helpIcon - circleLine - small - notice  */
    background-image: url('/res/images/common_icn/icn_helpIcons_circleLine_small.svg');
    background-position: 0 0;
    background-size: 16px 48px;
    width: 16px;
    height: 16px;
    opacity: 0.5;
    bottom: 1px;
    left: 1px;
}

.helpIcon-circleLine-small.helpIcon-warning .imgShow-icn-helpIcon-circleLine {
    /* helpIcon - circleLine - small - warning */
    background-position: 0 -16px;
    opacity: 0.7;
}

.helpIcon-circleLine-small.helpIcon-question .imgShow-icn-helpIcon-circleLine {
    /* helpIcon - circleLine - small - question */
    background-position: 0 -32px;
    opacity: 0.5;
}/*---------------------------------------------------------------------------------------------------
[ui_button.css]
> Buttons 
# Button - Basic Button
---------------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------
Button - Cursor Generator
-----------------------------------------------------------------------------*/

.buttoncursor {
	cursor: pointer;
}


/*-----------------------------------------------------------------------------
Button - Image
-----------------------------------------------------------------------------*/

.img_icon:hover {
	opacity: 0.7;
}


/*-----------------------------------------------------------------------------
Button - Disabled (common)
-----------------------------------------------------------------------------*/

button[disabled="disabled"],
.search_area button[disabled="disabled"],
.button[disabled="true"],
button[disabled="true"],
.search_area button[disabled="true"],
.button[disabled="true"] {
	cursor: default !important;
	background: #ececec !important;
	color: #aaa !important;
	border-color: #bbb !important;
}

button[disabled="disabled"] span,
.search_area button[disabled="disabled"] span,
.button[disabled="true"] span,
button[disabled="true"] span,
.button[disabled="true"] span {
	color: #aaa !important;
}

button[disabled="disabled"]:hover,
.search_area button[disabled="disabled"] span,
.button[disabled="true"]:hover,
button[disabled="true"]:hover,
.button[disabled="true"]:hover {
	background: #ececec !important;
	color: #b6b6b6 !important;
	border-color: #bbb !important;
}


/*-----------------------------------------------------------------------------
# Button - Basic Button
-----------------------------------------------------------------------------*/


/*----------------------------------------------------
Button - Size
----------------------------------------------------*/

.btn_large {
	display: inline-block;
	padding: 10px 18px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	font-size: 15px;
	line-height: 15px;
	font-weight: bold;
}

.btn_middle {
	display: inline-block;
	padding: 7px 15px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	font-size: 13px;
	line-height: 16px;
}

.btn_s_middle {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	font-size: 13px;
	line-height: 14px;
}

.btn_small {
	display: inline-block;
	padding: 5px 9px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	font-size: 12px;
	line-height: 12px;
}


/*----------------------------------------------------
# Button - Color
----------------------------------------------------*/


/*--------------------------
Button - White
--------------------------*/

.btncolor_white,
a.btncolor_white {
	background: #fff;
	color: #666;
	border: 1px solid #bbb;
}

.btncolor_white:hover,
a.btncolor_white:hover {
	background: #F0F0F0;
	color: #666;
}


/*--------------------------
Button - White - withSHD
--------------------------*/

.btncolor_white_withSdw,
a.btncolor_white_withSdw {
	background: #fff;
	color: #666;
	border: 1px solid #bbb;
	border-bottom: 2px solid #bbb;
}

.btncolor_white_withSdw:hover,
a.btncolor_white_withSdw:hover {
	background: #f0f0f0;
}


/*--------------------------
Button - White - customType
--------------------------*/

.btncolor_white_m,
a.btncolor_white_m {
	background: #fff;
	color: #0059a6;
	border: 1px solid #bbb;
}

.btncolor_white_m:hover,
a.btncolor_white_m:hover {
	background: #F0F0F0;
	color: #0059a6;
}


/*--------------------------
Button - Gray
--------------------------*/

.btncolor_gray_no_sdw,a.btncolor_gray_no_sdw{
	background:#fafafa;
	color:#666;border:1px solid #bbb;
}
.btncolor_gray_no_sdw:hover,a.btncolor_gray_no_sdw:hover{
	background:#f5f5f5;
}


/*--------------------------
Button - Gray - withSHDW
--------------------------*/

.btncolor_gray,
a.btncolor_gray {
	background: #fff;
	color: #666;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-top: 1px solid #bbb;
	border-bottom: 2px solid #bbb;
}

.btncolor_gray:hover,
a.btncolor_gray:hover {
	background: #f3f3f3;
}


/*--------------------------
Button - Blue
--------------------------*/

.btncolor_blue_no_sdw,
a.btncolor_blue_no_sdw {
	background: #0c51a1;
	color: #fff;
	border: 1px solid #1c416d;
}

.btncolor_blue_no_sdw:hover,
a.btncolor_blue_no_sdw:hover {
	background: #064690;
}


/*--------------------------
Button - Blue - withSHDW
--------------------------*/

.btncolor_blue,
a.btncolor_blue {
	background: #0c51a1;
	color: #fff;
	border-left: 1px solid #1c416d;
	border-right: 1px solid #1c416d;
	border-top: 1px solid #1c416d;
	border-bottom: 2px solid #1c416d;
}

.btncolor_blue:hover,
a.btncolor_blue:hover {
	background: #064690;
}


/*--------------------------
Button - Blue - withSHDW - customBomi
--------------------------*/

.btncolor_blue_bomi,
a.btncolor_blue_bomi {
	background: #0750a2;
	color: #fff;
}

.btncolor_blue_bomi:hover,
a.btncolor_blue_bomi:hover {
	background: #156dbc;
	color: #fff;
}


/*--------------------------
Button - Dark Blue
--------------------------*/

.btncolor_darkblue_no_sdw,
a.btncolor_darkblue_no_sdw {
	background: #012a48;
	color: #fff;
	border: 1px solid #001d33;
}

.btncolor_darkblue_no_sdw:hover,
a.btncolor_darkblue_no_sdw:hover {
	background: #014272;
}


/*--------------------------
Button - Sky Blue
--------------------------*/

.btncolor_skyblue_line,
a.btncolor_skyblue_line {
	border: 1px solid #6fbcff;
	color: #6fbcff;
}

.btncolor_skyblue_line:hover,
a.btncolor_skyblue_line:hover {
	border: 1px solid #85c6ff;
	color: #85c6ff;
}


/*-----------------------------------------------------------------------------
# Button - Search Button
-----------------------------------------------------------------------------*/

.search_area button {
	margin-left: -4px;
}

.search_area button.btn_blue01_s {
	display: inline-block;
	background: #015ba6;
	padding: 6px 15px 6px 15px;
	font-size: 13px;
	line-height: 13px;
	color: #fff;
}

.search_area button.btn_blue01_s:hover {
	background: #156dbc;
	color: #fff;
}

.search_area button.btn_gray01_s {
	display: inline-block;
	background: #ececec;
	padding: 5px 14px 5px 14px;
	font-size: 13px;
	line-height: 13px;
	color: #666;
	border-width: 1px 1px 1px;
	border-style: solid;
	border-color: #bbb;
}

.search_area button.btn_gray01_s:hover {
	background: #e8e8e8;
	color: #666;
}

.search_area button.btn_w01_s {
	display: inline-block;
	background: #fff;
	padding: 4px 13px 4px 13px;
	font-size: 12px;
	line-height: 13px;
	color: #666;
	border-width: 1px 1px 1px;
	border-style: solid;
	border-color: #bbb;
}

.search_area button.btn_w01_s:hover {
	background: #f2f2f2;
	color: #666
}


/*--------------------------------------------------------------------------------
버튼-아이콘정의
--------------------------------------------------------------------------------*/

/*------------------------------------------------------------
large
------------------------------------------------------------*/

a span.type_go_arrow {
	display: block;
	padding-right: 20px;
	background: url(/res/images/common/icon_btn_small_arrowright_gray.png) no-repeat right 2px;
}


/*------------------------------------------------------------
버튼-설정버튼(비활성화) 추가 수정 
------------------------------------------------------------*/

.img_icon[name="config"][disabled="disabled"] {
	cursor: default;
}


/*------------------------------------------------------------
small
------------------------------------------------------------*/

button span.type_check {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_btn_large_checkgray.png) no-repeat;
}

button span.type_excel {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_excel_blue.png) no-repeat;
}

button span.type_del {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_del_cancel_blue.png) no-repeat;
}

button span.type_excel_in {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_excel_gray.png) no-repeat;
}

button span.type_del_in {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_del_gray.png) no-repeat;
}

button span.type_useradd {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_hadd_blue.png) no-repeat;
}

button span.type_useradd2 {
	display: block;
	padding-left: 24px;
	background: url(/res/images/common/icn_hadd_blue2.png) no-repeat;
}

button span.type_add {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_add_blue.png) no-repeat;
}

button span.type_del_x {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_del_blue.png) no-repeat;
}

button span.type_add_gray {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_add_gray.png) no-repeat;
}

button.btn_small span.type_add_gray {
	display: block;
	padding-left: 20px;
	background-image: url(/res/images/common/icon_add_gray.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: -1px -1px;
}

button span.type_minus_gray {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_minus_gray.png) no-repeat;
}

button.btn_small span.type_minus_gray {
	display: block;
	padding-left: 20px;
	background-image: url(/res/images/common/icon_minus_gray.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: -1px -1px;
}
		
button span.type_gr_add {
	display: block;
	padding-left: 20px;
}

button span.type_gr_add {
	color: #0059a6;
	opacity: 1;
	background: url(/res/images/common/icon_group_add_blue.png) no-repeat;
}

button[disabled="disabled"] span.type_gr_add {
	background: url(/res/images/common/icon_group_add_gray_disabled.png) no-repeat;
}

button span.type_gr_del {
	display: block;
	padding-left: 20px;
}

button span.type_gr_del {
	color: #0059a6;
	opacity: 1;
	background: url(/res/images/common/icon_group_del_blue.png) no-repeat;
}

button[disabled="disabled"] span.type_gr_del {
	background: url(/res/images/common/icon_group_del_gray_disabled.png) no-repeat;
}

button span.type_excel_up {
	display: block;
	padding-left: 24px;
	background: url(/res/images/common/icon_excel_up_gray.png) no-repeat;
}

button span.type_excel_down {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_excel_down_gray.png) no-repeat;
}

button span.type_view {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_view_gray.png) no-repeat;
}

button.btncolor_white_m span.type_view {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icon_view_blue.png) no-repeat;
}

button span.type_add_circle_gray {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_add_circle_gray_13x13.png) no-repeat;
	min-height: 13px;
}

button span.type_approve_circle_gray {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_approve_gray_13x13.png) no-repeat;
	min-height: 13px;
}

button span.type_approve_circle_blue {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_approve_blue.png) no-repeat;
	min-height: 13px;
}

button span.type_approval {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_approve_blue.png) no-repeat;
	min-height: 13px;
}

button span.type_remove_blue {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_remove_circle_blue.png) no-repeat;
	min-height: 13px;
}

button span.type_reject {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_remove_circle_blue.png) no-repeat;
	min-height: 13px;
}

button span.type_refresh_blue {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_btn_refresh.png) no-repeat;
	min-height: 13px;
}

button span.type_connect_blue {
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_btn_connect.png) no-repeat;
	min-height: 13px;
}

button span.type_star_blue {
	display: block;
	padding-left: 21px;
	background: url(/res/images/common/icn_btn_star.png) no-repeat;
	min-height: 13px;
}

button span.type_link_blue {
	display: block;
	padding-left: 21px;
	background: url(/res/images/common/icn_link_blue.png) no-repeat;
	min-height: 13px;
}

button span.type_auto_add_blue {
	display: block;
	padding-left: 21px;
	background: url(/res/images/common/icn_auto_add_blue.png) no-repeat;
	min-height: 13px;
}

button span.teyp_mail {
	display: block;
	padding-left: 21px;
	background: url(/res/images/common/icn_mail_blue.png) no-repeat;
	min-height: 13px;
}

button span.type_link_gray {
	display: block;
	padding-left: 21px;
	background: url(/res/images/common/icn_link_gray.png) no-repeat;
	min-height: 13px;
}

button span.type_auto_add_gray {
	display: block;
	padding-left: 21px;
	background: url(/res/images/common/icn_auto_add_gray.png) no-repeat;
	min-height: 13px;
}

button span.type_mail_gray {
	display: block;
	padding-left: 21px;
	background: url(/res/images/common/icn_mail_gray.png) no-repeat;
	min-height: 13px;
}

button span.type_prev {
	display: block;
	padding-left: 12px;
	background: url(/res/images/common/icon_prev_gray.png) no-repeat 0 1px;
}

button span.type_next {
	display: block;
	padding-left: 12px;
	background: url(/res/images/common/icon_next_gray.png) no-repeat 0 1px;
}

span[style="background:url('/res/images/common/icn_remove_circle_lightgray.png') no-repeat; margin-left:8px;"]:hover {
	background: url('/res/images/common/icn_remove_circle_gray.png') no-repeat;
	margin-left: 8px;
}

label.btn_small,
div.btn_small,
a.btn_small {
	cursor: pointer;
}

label.btn_small[disabled="disabled"],
div.btn_small[disabled="disabled"],
a.btn_small[disabled="disabled"] {
	cursor: default !important;
	background: #ececec !important;
	color: #aaa !important;
	border-color: #bbb !important;
}

label.btn_small[disabled="disabled"]:hover,
div.btn_small[disabled="disabled"]:hover,
a.btn_small[disabled="disabled"]:hover {
	cursor: default !important;
	background: #ececec !important;
	color: #aaa !important;
	border-color: #bbb !important;
}


/*------------------------------------------------------------
# 커스텀 : 더하기/빼기 버튼 수정
------------------------------------------------------------*/
.btn_small.btncolor_white.plus {
	background-image: url(/res/images/common/icon_add_blue.png);
	background-size: 50%;
	background-repeat: no-repeat;
	background-position: center;
	text-indent: -999px;
}
.btn_small.btncolor_white.minus {
	background-image: url(/res/images/common/icon_minus_gray.png);
	background-size: 50%;
	background-repeat: no-repeat;
	background-position: center;
	text-indent: -999px;
}


/*------------------------------------------------------------
# 커스텀 : 백업 > 유출파일 백업정책 > 확장자 추가 팝업
# 모든 버튼에 적용으로 수정
------------------------------------------------------------*/
.btn_small.btncolor_white.minus,
.btn_small.btncolor_white.plus {
	position: relative;
	width: 27px !important;
	height: 27px !important;
}


/*------------------------------------------------------------
# 커스텀 - 애니메이티드 클로즈 버튼 (.cssCloseButtonOuter)
------------------------------------------------------------*/

.cssCloseButtonOuter {
  position: relative;
  margin: auto;
  width: 70px;
  margin-top: 200px;
  cursor: pointer;
}

.cssCloseButtonInner {
  width: inherit;
  text-align: center;
}

.cssCloseButtonInner label { 
  font-size: .8em; 
  line-height: 4em;
  color: #fff;
  transition: all .3s ease-in;
  opacity: 0;
  cursor: pointer;
}

.cssCloseButtonInner:before, .cssCloseButtonInner:after {
  position: absolute;
  content: '';
  height: 1px;
  width: inherit;
  background: #FFC107;
  left: 0;
  transition: all .3s ease-in;
}

.cssCloseButtonInner:before {
  top: 50%; 
  transform: rotate(45deg);  
}

.cssCloseButtonInner:after {  
  bottom: 50%;
	transform: translate(0,1px) rotate(-45deg);
}

.cssCloseButtonOuter:hover label {
  opacity: 1;
}

.cssCloseButtonOuter:hover .cssCloseButtonInner:before,
.cssCloseButtonOuter:hover .cssCloseButtonInner:after {
  transform: rotate(0);
}

.cssCloseButtonOuter:hover .cssCloseButtonInner:before {
  top: 0;
}

.cssCloseButtonOuter:hover .cssCloseButtonInner:after {
  bottom: 0;
}


/*------------------------------------------------------------
상세검색
------------------------------------------------------------*/

.search_area .btn_advSearch>button {
	padding-right: 22px;
}

.search_area .btn_advSearch>button:after {
	content: "";
	display: inline-block;
	position: absolute;
	width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
	border-top: 4px solid #767676;
	margin-left: 6px;
	margin-top: 4px;
}

.search_area .btn_advSearch.active>button {
	/* 활성화 */
	background: #0059a6;
	border-color: #004170;
	color: #fff;	
}

.search_area .btn_advSearch.active>button:after {
	border-top-color: #fff;
}


/*----------------------------------------
상세검색 : 커스텀
----------------------------------------*/

.board_search_area .btn_gray01_s+.btn_advSearch {
	margin-left: 8px;
}/*------------------------------------------------------------------------
[ui_setBox.css]
- 내용 : 설정박스(셀렉트바) UI모듈 스타일 정의
------------------------------------------------------------------------*/


/*------------------------------------------------------------
contents - select area - 상단 선택 영역
------------------------------------------------------------*/

.area_selectbar {
    border: 1px solid #bbb;
    background: #fff;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    box-shadow: 0 1px 0 #bbb;
    -webkit-box-shadow: 0 1px 0 #bbb;
    -moz-box-shadow: 0 1px 0 #bbb;
    /* margin:5px 0; */
    margin: 8px 0 9px;
}


/*----------------------------------------
셀렉트에리어 최하단 영역 모서리 둥글게
----------------------------------------*/

.area_selectbar>fieldset>div:last-child {
    border-bottom: none;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.form_select {
    width: 100%;
    padding: 7px;
    min-height: 51px;
}

.form_select .selectlist {
    display: table;
}

.form_select .selectlist h4 {
    display: table-cell;
    min-width: 100px;
    vertical-align: top;
    padding: 10px 0 0 12px;
}

.lang-en .contents .form_select .selectlist h4 {
    /* 설정박스 - 레이블 - 영문 - 고정폭 */
    width: 170px;
}

.Exosphere.lang-en .contents .form_select .selectlist h4 {
    width: 140px;
}

.area_selectbar .form_select .selectlist h4 span.text {
    display: inline-block;
    vertical-align: middle;
    font-size: 13px;
    line-height: 14px;
    margin-left: 2px;
    font-weight: bold;
}

.Exosphere .area_selectbar .form_select .selectlist h4 span.text {
    position: relative;
    bottom: 1px;
}


/*------------------------------------------------------------
설정박스 셀렉트리스트 스타일 정의 (일반 : 207px, 싱글박스 : 좌우자동)
------------------------------------------------------------*/

.area_selectbar .form_select .selectlist .list_select a {
    width: 100%;
    /* padding: 6px 40px 6px 9px !important; */
}

.area_selectbar .form_select .selectlist .list_select>a {
    min-width: 207px;
    padding: 6px 40px 6px 9px !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden;
    overflow-y: hidden;
}

.area_selectbar .form_select .selectlist .list_select>a:hover {
    background: url(/res/images/common/btn_select_arrow_hover.png) no-repeat right 0;
}


/*------------------------------------------------------------
설정박스 : 싱글박스
- 싱글박스는 대시보드 등과 같이 하나의 박스로만 리스트를 표현할 때 사용됩니다.
- 싱글박스는 리스트의 폭에 따라 자동적으로 넓이가 조정됩니다.
------------------------------------------------------------*/

.contents .area_selectbar .form_select .selectlist.selectlist_singlebox .list_select a {
    width: auto !important;
    max-width: 856px;
    overflow-y: hidden;
    float: left;
}

.contents .area_selectbar .form_select .selectlist.selectlist_singlebox .list_select ul {
    width: auto !important;
    max-width: 856px;
    min-width: 207px;
    white-space: nowrap;
}

.contents .area_selectbar .form_select .selectlist.selectlist_singlebox .list_select ul li.select {
    zoom: 1;
}

.contents .area_selectbar .form_select .selectlist.selectlist_singlebox .list_select ul li.select:after {
    clear: both;
    display: block;
    content: "";
}

.contents .form_select .selectlist .selectlist_group {
    display: table-cell;
}

.contents .form_select .selectlist .selectlist_button {
    /* 설정박스 버튼그룹 */
    margin: 4px 0 4px 5px;
    font-size: 0;
}

.contents .form_select .selectlist .selectlist_button > button,
.contents .form_select .selectlist .selectlist_button > a,
.contents .form_select .selectlist .selectlist_button > div {
    margin-right: 5px;
    font-size: 1rem;
}

.contents .form_select .selectlist .selectlist_button .text_info {
    display: inline-block;
    font-size: 12px;
    line-height: 12px;
    color: #767676;
    padding: 6px 0 0 6px;
}

.contents .form_select .selectlist .selectlist_group .list_select {
    margin: 5px;
}

.contents .form_select .selectlist .selectlist_group .list_select .select_no {
    display: inline-block;
    font-size: 14px;
    line-height: 15px;
    vertical-align: middle;
    color: #767676;
    padding: 8px 0 4px;
}

.contents .form_select .selectlist .selectlist_group .list_btnarea {
    float: left;
    padding-top: 5px;
}

.contents .form_select .selectlist .selectlist_group .list_btnarea button {
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist h4.title_selectlist_group span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head.png) no-repeat;
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist h4.title_selectlist_date span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head.png) no-repeat 0 -20px;
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist h4.title_selectlist_function span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head.png) no-repeat 0 -40px;
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist h4.title_selectlist_function span.icon.icnViewWay {
    /* 조회방식 아이콘 */
    background: url(/res/images/common_icn/icon_selectbar_head_viewWay.png) no-repeat;
}

.contents .area_selectbar .form_select .selectlist h4.title_selectlist_function span.icon.icnFilter {
    /* 필터 아이콘 */
    background: url(/res/images/common_icn/icn_btn_filter_on.png) no-repeat;
    background-position: 2px 3px;
}

.contents .form_select .selectlist .list_select {
    margin: 5px;
}

.contents .area_selectbar .form_select .selectlist .list_on>a {
    color: #0059a6 !important;
    font-weight: bold;
}

.contents .form_select_gray {
    width: 100%;
    padding: 7px;
    background: #f5f5f5;
}

.contents .form_select_gray .selectlist .title_area_set {
    display: inline-block;
    float: left;
    font-size: 12px;
    line-height: 13px;
    color: #666;
    padding: 6px 10px;
}

.lang-en .contents .form_select_gray .selectlist .title_area_set {
    /* 영문 - 설정박스 - 위치 및 크기 조정 */
    padding: 0 12px 6px 10px;
    float: right;
    display: block;
    width: 100%;
    text-align: right;
}

.contents .form_select_gray .selectlist .btn_area_set {
    display: inline-block;
    float: right;
    padding: 0 9px;
}

.contents .form_select_gray .selectlist .btn_area_set button {
    margin: 0 1px;
}

.contents .form_button {
    float: right;
    margin: 9px 15px 0 0;
}

.contents .border_b {
    border-bottom: 1px solid #ddd;
}


/*------------------------------------------------------------
contents - select area - 상단 선택 영역
------------------------------------------------------------*/

.contents .form_select .selectlist_disable {
    display: table;
}

.contents .form_select .selectlist_disable h4 {
    display: table-cell;
    width: 100px;
    vertical-align: top;
    padding: 10px 0 0 12px;
}

.contents .area_selectbar .form_select .selectlist_disable h4 span.text {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    line-height: 14px;
    margin-left: 2px;
    color: #bbb;
}

.contents .area_selectbar .form_select .selectlist_disable .selectlist_group {
    display: table-cell;
}

.contents .area_selectbar .form_select .selectlist_disable .selectlist_button {
    margin: 4px 0 4px 5px;
}

.contents .area_selectbar .form_select .selectlist_disable h4.title_selectlist_group span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head_disable.png) no-repeat;
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist_disable h4.title_selectlist_date span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head_disable.png) no-repeat 0 -20px;
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist_disable h4.title_selectlist_function span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head_disable.png) no-repeat 0 -40px;
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist_disable .list_select {
    margin: 5px;
}

.contents .area_selectbar .form_select .selectlist_disable .list_select a {
    color: #bbb !important;
    border: 1px solid #ddd !important;
    background: url(/res/images/common/btn_select_arrow_disable.png) no-repeat right 0;
    cursor: default !important;
}

.contents .area_selectbar .form_button {
    float: right;
    margin: 9px 15px 0 0;
}

.contents .area_selectbar .border_b {
    border-bottom: 1px solid #ddd;
}


/*------------------------------------------------------------
셀렉트리스트 - 기간 선택
------------------------------------------------------------*/

.contents .area_selectbar .list_select .select_date {
    border: 1px solid #bbb;
}

.contents .area_selectbar .list_select .select_date input[type=text] {
    cursor: pointer;
    border-radius: 4px;
}

.contents .area_selectbar .list_select .select_date input[type="text"]:hover {
    /* background: #f0f0f0; */
    color: #333;
    box-shadow: 0 0 3px rgba(0, 126, 255, 0.5);
}

.selectlist_option {
    margin-left: 100px;
    padding: 5px;
    font-size: 12px;
}

/*------------------------------------------------------------
셀렉트리스트 - 버튼 옆 도움말 문구
------------------------------------------------------------*/

.selectlist_button.selectlist_button_help:after {
	content: "";
	display: inline-block;
	font-size: 12px;
	margin-left: 6px;
	color: #767676;
}

.selectlist_button.selectlist_button_help.selectlist_button_help_cnt01:after {
	content: attr(data-value);
}

.lang-ja .selectlist_button.selectlist_button_help.selectlist_button_help_cnt01:after,
.lang-en .selectlist_button.selectlist_button_help.selectlist_button_help_cnt01:after {
    /* 일/영문 - 설정박스 - 도움말 텍스트 위치 조정 */
    display: block;
    margin-top: 6px;
}


/*------------------------------------------------------------------------------------------
개발팀 추가 (지연) 160920  - ui_form.css 에 추가되어야함
--------------------------------------------------------------------------------*/

.contents .area_selectbar .form_select .selectlist h4.title_selectlist_member span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head_p2.png) no-repeat;
    background-position: 4px 2px;
    vertical-align: middle;
}

.contents .area_selectbar .form_select .selectlist h4.title_selectlist_product span.icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(/res/images/common/icon_selectbar_head_p3.png) no-repeat;
    vertical-align: middle;
}

.contents .form_select .selectlist .selectlist_group .radio_area {
    float: left;
    padding: 11px 0px 11px 0px;
    display: inline-block;
    vertical-align: middle;
}

.contents .form_select .selectlist .selectlist_group .radio_area li {
    float: left;
    padding-right: 15px;
}

.contents .form_select .selectlist .selectlist_group .radio_area label {
    padding-left: 24px;
}

/*------------------------------------------------------------------------
[ui_alertPopup.css]
- 내용 : 알림메시지팝업 UI모듈 스타일 정의
------------------------------------------------------------------------*/


/*----------------------------------------
공통 스타일 정의
----------------------------------------*/

.alert_popup {
	position: absolute;
	z-index: 131;
	border: 1px solid #bbb;
	background: #fff;
	border-radius: 6px;
	box-shadow: 0 6px 16px rgba(0, 0, 0, .5);
}

.alert_popup ul.content_wrapper>li {
	width: 444px;
}

.alert_popup ul.content_wrapper li.alert_top {
	height: 48px;
	border-bottom: 1px solid #bbb;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	background: #f4f4f4;
}

.alert_popup ul.content_wrapper li.alert_middle {
	min-height: 86px;
	padding: 20px 50px 24px 50px;
}

.alert_popup ul.content_wrapper li.alert_bottom {
	background: #f4f4f4;
	height: 48px;
	border-top: 1px solid #bbb;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	text-align: center;
}

.alert_popup ul.content_wrapper li.alert_top>h3 {
	font-size: 15px;
	line-height: 1;
	color: #0059a6;
	text-align: center;
	position: relative;
	top: 14px;
}

.alert_popup ul.content_wrapper li.alert_middle .s_main_headline {
	margin-bottom: 10px;
}

.alert_popup ul.content_wrapper li.alert_middle .s_main_headline h3 {
	line-height: 1;
}

.alert_popup ul.content_wrapper li.alert_middle .s_icn {
	text-align: center;
}

.alert_popup ul.content_wrapper li.alert_middle .s_main_text {
	padding: 8px 0px;
	line-height: 1.4;
}

.alert_popup ul.content_wrapper li.alert_middle .s_add_text h4 {
	line-height: 1;
	color: #ff6600;
	padding: 10px 0 2px;
}

.alert_popup ul.content_wrapper li.alert_bottom .btn_wrapper {
	position: relative;
	top: 11px;
}


/*----------------------------------------
리스트 
----------------------------------------*/

.alert_popup ul.content_wrapper li.alert_middle .s_main_text ul {
	padding: 4px 0;
	font-size: 12px;
}


/*----------------------------------------
너비 조정 (alert_w###)
----------------------------------------*/

.alert_w500 ul.content_wrapper>li {
	width: 500px;
}

.alert_w580 ul.content_wrapper>li {
	width: 580px;
}

.alert_w720 ul.content_wrapper>li {
	width: 720px;
}

.alert_w725 ul.content_wrapper>li {
	width: 725px;
}

.alert_w770 ul.content_wrapper>li {
	width: 770px;
}

.alert_w820 ul.content_wrapper>li {
	width: 820px;
}


/*----------------------------------------
높이 조정 (alert_h###, alert_mh###)
----------------------------------------*/

.alert_mh500 ul.content_wrapper li.alert_middle {
	max-height: 500px;
}


/*----------------------------------------
스크롤 삽입 (alert_scroll_yes)
----------------------------------------*/ 

.alert_scroll_yes ul.content_wrapper li.alert_middle {
	overflow-y: auto;
}


/*----------------------------------------
텍스트 가운데 정렬 (alert_text_align_center)
----------------------------------------*/

.alert_text_align_center ul.content_wrapper li.alert_middle {
	text-align: center;
}


/*----------------------------------------
알림메시지 중간 영역 내 버튼 (커스텀)
----------------------------------------*/

.alert_popup ul.content_wrapper li.alert_middle button.alert_button_custom_type01 {
	margin: 10px auto 0; display: block;
}


/*----------------------------------------
IE 8 BELOW STYLE FIX
----------------------------------------*/

.alert_ie8_below_fix.alert_popup .wtspace_pre_line {
	white-space: normal;
}

.alert_ie8_below_fix.alert_popup UL.content_wrapper LI.alert_middle p {
	margin-bottom: 20px;
}

.alert_ie8_below_fix.alert_popup UL.content_wrapper LI.alert_top {
	width: 500px;
}

.alert_ie8_below_fix.alert_popup UL.content_wrapper LI.alert_middle {
	height: 450px;
	width: 400px;
	box-sizing: content-box;
}

.alert_ie8_below_fix_wrapper {
	width: 100%;
	display: block;
	margin-bottom: 10px;
}


/*----------------------------------------
알림레이어팝업 - 알아두세요 용
----------------------------------------*/

.alert_popup.alert_noticeForCard ul.content_wrapper li.alert_middle {
	padding-left: 0;
	padding-right: 0;
}

.alert_popup.alert_noticeForCard ul.content_wrapper>li  {
	width: 986px;
}/*---------------------------------------------------------------------------------------------------
 [ui_setLayerPopup.css]
- 내용 : 공통 설정레이어팝업 UI모듈 스타일 정의
---------------------------------------------------------------------------------------------------*/


/*--------------------------------------------------------------------------------
설정레이어팝업 팝업창 기본 설정 (스타일 + 위치)
--------------------------------------------------------------------------------*/

.set_layer_popup {
	position: absolute;
	z-index: 129;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
	border-radius: 4px;
	background: #fff;
}

.set_layer_popup.modal {
	z-index: 131;
	left: 50%;
}

.set_layer_popup.size_sm.modal {
	margin-left: -211px;
}

.set_layer_popup.size_md.modal {
	margin-left: -296px;
}

.set_layer_popup.size_lg.modal {
	margin-left: -479px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 팝업창의 스크롤 미포함 시 (class="scroll_no" / .comp_reg_set에 적용) (높이 자동 확장)
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set.scroll_no {
	max-height: none;
	overflow-y: visible;
}

.set_layer_popup.scroll_no>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set {
	max-height: none;
	overflow-y: visible;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 팝업창 사이즈
--------------------------------------------------------------------------------*/

.set_layer_popup.size_auto>ul.content_wrapper>li {
	min-width: 422px;
	width: auto;
}

.set_layer_popup.size_sm,
.set_layer_popup.size_sm>ul.content_wrapper>li {
	width: 422px;
}

.set_layer_popup.size_md,
.set_layer_popup.size_md>ul.content_wrapper>li {
	width: 592px;
}

.set_layer_popup.size_lg,
.set_layer_popup.size_lg>ul.content_wrapper>li {
	width: 958px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 팝업창 탑 영역 스타일 정의
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_top {
	background: #012a48;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-top: 1px solid #001d33;
	border-left: 1px solid #001d33;
	border-right: 1px solid #001d33;
	border-bottom: 1px solid #001d33;
	height: 40px;
	color: #fff;
	padding: 0 20px;
}

.layout_card .area_content .con_table .board_search_area
.set_layer_popup>ul.content_wrapper>li.set_layer_popup_top {
	padding: 0 20px;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_top h5 {
	line-height: 1;
	font-size: 13px;
	position: relative;
	top: 12px;
	text-overflow: ellipsis;

}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_top h5 .text_small_title {
	display: inline-block;
	color: #5891bc;
	font-size: 12px;
	line-height: 12px;
	padding: 2px 0 0 5px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 팝업창 미들 영역 스타일 정의
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle {
	min-height: 62px;
	border-radius: 0;
	border-top: 0;
	border-bottom: 1px solid #bbb;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	padding: 18px 20px 20px;
}

.layout_card .area_content .con_table .board_search_area
.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle {
	padding: 18px 20px 20px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 내 설정UI 컴포넌트
--------------------------------------------------------------------------------*/


/*------------------------------------------------------------
기본 랩퍼
------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set:last-child {
	margin-bottom: 0 !important;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set {
	max-height: 200px;
	overflow-y: auto;
	margin-bottom: 8px;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li {
	padding: 6px 0;
}

.DLP .set_layer_popup[name="popup_fileinfo"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li {
	/* 파일별 요청 승인 관리 - 설정 - 팝업 - 강제 개행 */
	clear: both;
}


/*------------------------------------------------------------
일반 텍스트 (공통 스타일)
------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li>div.p_wrapper {
	display: table-row;
	vertical-align: middle;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li>div.p_wrapper>p {
	line-height: 1.4;
	display: table-cell;
	vertical-align: middle;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li>div.p_wrapper>img {
	display: inline-block;
	vertical-align: middle;
	margin-right: 8px;
}


/*------------------------------------------------------------
컨텐츠가 여러 줄일 경우의 콘텐츠 (컨텐츠가 여러줄일 경우 li 항목에 multi_row_cont 클래스를 추가해 주세요) 
------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li.multi_row_cont {
	display: table;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li.multi_row_cont>span {
	display: table-cell;
	vertical-align: top;
	position: relative;
	/* top: 8px; */
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li.multi_row_cont>div {
	display: table-cell;
	padding: 0 7px;
}


/*------------------------------------------------------------
셀렉트박스(설정레이어팝업)
------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li div.form_select,
.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li div.selectlist,
.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li div.selectlist_group,
.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li div.list_select {
	float: none;
	display: inline-block;
	margin: 0 6px 0 0;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li div.selectlist_group:last-child {
	/* 드롭다운 외 요소가 더 없을 경우 */
	margin: 0;
}


/*------------------------------------------------------------
컨텐츠가 여러 줄일 경우의 콘텐츠 (셀렉트박스)
------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li.multi_row_cont div.list_select {
	margin-bottom: 8px;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li.multi_row_cont div.list_select:last-child {
	margin-bottom: 0;
}


/*--------------------------------------------------------------------------------
라디오버튼(설정레이어팝업)
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li>.radio_area {
	float: none;
	display: inline-block;
	margin-right: 6px;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li>.radio_area>li {
	display: inline-block;
	margin-right: 6px;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li>.radio_area>li:last-child {
	margin-right: 0;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li input[type="radio"]+label {
	padding-left: 26px;
}


/*--------------------------------------------------------------------------------
단문텍스트(스팬,스판)
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span {
	display: inline-block;
	margin-right: 6px;
	padding-right: 6px;
}

.lang-ja .set_layer_popup[name="add_department"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span,
.lang-en .set_layer_popup[name="add_department"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span {
	/* 영문 & 일문 - 조직도 설정 - 하위 부서 추가 - 텍스트 조정 */
	display: block;
	margin-bottom: 6px;
	width: auto !important;
}

.lang-ja .set_layer_popup[name="add_department"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span + input,
.lang-en .set_layer_popup[name="add_department"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span + input {
	/* 영문 & 일문 - 조직도 설정 - 하위 부서 추가 - 텍스트 필드 배치 조정 */
	width: 100% !important;
}

.lang-en .set_layer_popup[name="excel_upload"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li .jfilestyle>span:first-child,
.lang-ja .set_layer_popup[name="excel_upload"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li .jfilestyle>span:first-child {
	/* 영문 & 일문 - 조직도 설정 - 엑셀 업로드 - 설정레이어팝업 조정 */
	width: 100% !important;;
	margin-bottom: 8px;
}

.lang-en .set_layer_popup[name="excel_upload"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li input[type=text],
.lang-ja .set_layer_popup[name="excel_upload"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li input[type=text] {
	width: 440px !important;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span:last-child {
	margin-right: 0;
}


/*--------------------------------------------------------------------------------
단문텍스트(스팬,스판) - 왼쪽 정렬
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span.left_aligned {
	width: 25%;
	min-width: 68px;
	margin-right: 20px;
}


/*--------------------------------------------------------------------------------
경계선
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li>hr {
	margin: 6px 0px 3px;
	border-width: 0px 0px 1px;
	border-color: #ccc;
	border-style: dashed;
}


/*--------------------------------------------------------------------------------
여백 스타일링
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li:last-child {
	margin-top: 2px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 팝업창 바텀 영역 스타일 정의
--------------------------------------------------------------------------------*/

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_bottom {
	height: 42px;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	background: #f5f5f5;
	padding: 0 20px;
	text-align: center;
}

.set_layer_popup>ul.content_wrapper>li.set_layer_popup_bottom>.btn_wrapper {
	position: relative;
	top: 8px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 최우측 버튼
--------------------------------------------------------------------------------*/

div[name="groupview"] .set_layer_popup_middle .comp_reg_set>ul>li>button.float_right {
	position: relative;
	bottom: 5px;
	margin-right: 6px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 도움말상자
--------------------------------------------------------------------------------*/

.setLayerPopup_helpBox {
	border: 1px solid #bbb;
	border-radius: 3px;
	background: #f5f5f5;
	padding: 10px;
	color: #767676;
}

.setLayerPopup_helpBox .setLayerPopup_helpBoxAccent {
	background: #fff;
	padding: 4px;
	border: 1px solid #bbb;
	border-radius: 3px;
	margin-top: 6px;
}

.setLayerPopup_helpBox .setLayerPopup_helpBoxAccent>li {
	display: inline-block
}

.setLayerPopup_helpBox .setLayerPopup_helpBoxAccent>li span.headline {
	margin-right: 8px;
}

.setLayerPopup_helpBox .setLayerPopup_helpBoxAccent>.helpBoxAccent_divider {
	width: 1px;
	height: 10px;
	position: relative;
	top: 1px;
	display: inline-block;
	margin: 0 10px;
	background: #ccc;
}

.setLayerPopup_helpBox .setLayerPopup_helpBoxAccent>.iconAdminInfo {
	width: 13px;
	height: 13px;
	display: inline-block;
	background: url('/res/images/common_topBar/icn_profile_tooltipTrigger.png') no-repeat;
	margin-left: 6px;
	position: relative;
	top: 2px;
	margin-right: 4px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 커스텀 레이아웃
--------------------------------------------------------------------------------*/


.set_layer_popup.custom_agent_notice .layout_card .area_content {
	border: 0;
}

.targetSelect>li>span.headText {
	font-size: 15px;
	position: relative;
	top: 1px;
	margin-right: 4px;
}

.targetSelect>li div.bodyText-12 {
	position: relative;
	top: 9px;
	color: #767676;
}

.set_layer_popup_middle .headText-15>.bodyText-12 {
	position: relative;
	top: 1px;
}


/*------------------------------------------------------------
설정레이어팝업용 임시 - 가로 배열 그리드
------------------------------------------------------------*/

.set_layer_popup .horz_items.three_items>li {
	float: left;
	width: 33.33%;
}


/*------------------------------------------------------------
설정레이어팝업용 임시 - 워터마크 페이지
------------------------------------------------------------*/

.set_layer_popup.cont_watermark_angle .set_layer_popup_middle .comp_reg_set {
	max-height: none !important;
}

.set_layer_popup.cont_watermark_angle .horz_items.three_items {
	margin-top: 10px;
}

.set_layer_popup.cont_watermark_angle .horz_items.three_items>li {
	padding: 0 20px 16px;
}

.set_layer_popup.cont_watermark_angle .horz_items.three_items>li>input+label {
	margin-bottom: 6px;
	float: left;
}

.set_layer_popup.cont_watermark_angle .horz_items.three_items>li>input[type="text"] {
	float: left;
	position: relative;
	bottom: 2px;
}


/*--------------------------------------------------------------------------------
설정레이어팝업 - 설명
--------------------------------------------------------------------------------*/

.set_layer_popup [class*="cardTop-"] {
	height: 50px;
	border-bottom: 1px solid #bbb;
}

.set_layer_popup .cardTop-cardDesc {
	padding-top: 14px;
	padding-bottom: 14px;
	height: auto;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
}

.set_layer_popup .cardTop-cardDesc .bodyText {
	text-indent: -14px;
	/* font-size: 12px; */
	margin-left: 14px;
	color: #505050;
}

.set_layer_popup .row.cardTop-cardDesc>.col {
	margin-bottom: 10px;
}

.set_layer_popup .row.cardTop-cardDesc>.col:last-of-type {
	margin-bottom: 0;
}


/*--------------------------------------------------------------------------------
커스텀 - 확장자 추가 설정레이어팝업 - 레이블 위치 조정
--------------------------------------------------------------------------------*/

.set_layer_popup[name="add_extension"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set .item_list .item>div:first-child {
	display: block !important;
	float: none !important;
    margin-bottom: 10px;
}

.set_layer_popup[name="add_extension"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set .item_list .item>div.list_select>a {
	width: 130px !important;
}


/*--------------------------------------------------------------------------------
개발팀 추가 (지연) 161212 - ui_common.css 에 추가되어야함
--------------------------------------------------------------------------------*/

.set_layer_popup.size_1200.modal {
	margin-left: -600px;
}

.set_layer_popup.size_1200>ul.content_wrapper>li {
	width: 1200px;
}

.set_layer_popup.size_730.modal {
	margin-left: -365px;
}

.set_layer_popup.size_730>ul.content_wrapper>li {
	width: 730px;
}

.set_layer_popup.size_1100.modal {
	margin-left: -365px;
}

.set_layer_popup.size_1100>ul.content_wrapper>li {
	width: 1100px;
}


/*--------------------------------------------
설정레이어팝업 - 아이템리스트 - 여백 조정
--------------------------------------------*/

/*----------------------
PC취약점 점검 - 커스텀 - 필드 세 개 연속 배치 레이아웃
- 실시간 검사 및 제어 설정 > 공유 폴더 설정
- 실시간 검사 및 제어 설정 > USB 보안 점검
----------------------*/

.set_layer_popup.size_lg[name="control_3"] .item_list .item,
.set_layer_popup.size_lg[name="control_4"] .item_list .item {
	margin-bottom: 10px;
}

.set_layer_popup.size_lg[name="control_3"] .item_list .item:last-child,
.set_layer_popup.size_lg[name="control_4"] .item_list .item:last-child {
	margin-bottom: 0;
}

.set_layer_popup.size_lg[name="control_3"] .item_list .item>div>span.font_bold,
.set_layer_popup.size_lg[name="control_4"] .item_list .item>div>span.font_bold {
	position: relative;
	top: 6px;
}

.lang-ja .set_layer_popup.size_lg[name="control_4"] .item_list .item>div>span.font_bold {
	/* 텍스트 폭 크기 조정 */
	letter-spacing: -1px;
}


/*----------------------
PC취약점 점검 - 커스텀
- 실시간 검사 및 제어 설정 > 기타점검 - 레지스트리 키
----------------------*/

.set_layer_popup.size_lg[name="inspection_17"] .item_list .item>p>span.font_bold {
	position: relative;
	top: 6px;
}


/*----------------------------------------
설정레이어 팝업
> 기본 폭 : 986~1300px
----------------------------------------*/

.alert_popup.alert_noticeForCard ul.content_wrapper>li  {

}/*--------------------------------------------------------------------------------
[ui_popup_toastPopup.css]
> 정책 설정 피드백 등을 위한 토스트팝업
--------------------------------------------------------------------------------*/

/*------------------------------------------------------------
토스트팝업 - .toastPopup
------------------------------------------------------------*/

.toastPopup-space {
    position: fixed;
    top: 74px;
    margin-left: 838px;
    width: 400px;
    height: auto;
    z-index: 301;
}

.toastPopup,
.toastPopup.status-success {
    display: block;
    padding: 8px 18px;
    background-color: #222;
    font-size: 12px;
    color: #fff;
    opacity: 0.8;
    margin: 10px 10px;
    border-radius: 4px;
    text-align: left;
    box-shadow: 0 3px 12px rgba(0,0,0,0.5);
    transition: opacity 0.5s ease-in-out;
}

.toastPopup,
.toastPopup.status-error {
    background-color: #000;
}

.toastPopup:hover {
    opacity: 0.9;
    transition: opacity 0.5s ease-in-out;
}

.toastPopup-wrap {
    position: relative;
}

.toastPopup i,
.toastPopup span,
.toastPopup a.closeBtn {
    display: inline-block;
    vertical-align: middle;
}

.toastPopup span {
    margin: 0 0 0 2px;
    padding: 4px 30px 4px 0;
    width: 280px;
    line-height: 1.5;
}

.toastPopup a.closeBtn {
    position: absolute;
    width: 16px;
    height: 16px;
    right: 0;
    opacity: 0.5;
    top: 50%;
    transform: translate(0, -50%);
    transition: opacity 0.3s ease-in-out;
}

.toastPopup a.closeBtn:hover {
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}

.toastPopup a.closeBtn:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 7px;
    left: 0;
    width: 16px;
    height: 1px;
    background-color: #fff;
    transform: rotate(45deg);
}

.toastPopup a.closeBtn:before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 7px;
    left: 0;
    width: 16px;
    height: 1px;
    background-color: #fff;
    transform: rotate(135deg);
}/*------------------------------------------------------------------------
[ui_form.css]
- 내용 : 공통 & 미분류 폼 UI모듈 스타일 정의
------------------------------------------------------------------------*/

/*------------------------------------------------------------------
텍스트 박스
------------------------------------------------------------------*/

/*------------------------------------------------------------
input - 텍스트 박스
------------------------------------------------------------*/

input.input_textbox_loginpage {
	border: 1px solid #bbb;
	height: 40px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	font-size: 16px;
	line-height: 18px;
}


/*------------------------------------------------------------
input.black_placeholder - 텍스트 박스 (플레이스홀더 검은색 버전)
------------------------------------------------------------*/

input.black_placeholder::-webkit-input-placeholder {
	/* WebKit browsers */
	color: #505050;
	opacity: 1;
}

input.black_placeholder::-moz-placeholder {
	/* Mozilla Firefox 4 to 18 */
	color: #505050;
	opacity: 1;
}

input.black_placeholder::-moz-placeholder {
	/* Mozilla Firefox 19+ */
	color: #505050;
	opacity: 1;
}

input.black_placeholder::-ms-input-placeholder {
	/* Internet Explorer 10+ */
	color: #505050;
	opacity: 1;
}


/*--------------------------------------------
날짜 선택
--------------------------------------------*/

.ui-datepicker.ui-widget {
	font-weight: normal;
	box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
}

.ui-datepicker.ui-widget .ui-widget-header {
	background: #f2f2f2;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
	background: #fff;
	border: 1px solid #fff;
	text-align: center;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
	color: rgb(0, 89, 166);
	border: 1px solid #0059a6;
	border-radius: 5px;
	background: rgb(245, 250, 255) none repeat scroll 0% 0%;
}

.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 {
	background: #f2f2f2;
	border: 1px solid #bbb;
	border-radius: 3px;
}/*----------------------------------------------------------------------------------------
[ui_checkBox_radioBtn.css]
> Check Box & Radio Button
# Check Box
# Radio Button
----------------------------------------------------------------------------------------*/


/*------------------------------------------------------------------
# Check Box
------------------------------------------------------------------*/

input[type="checkbox"] {
    display: none;
}

input[type="checkbox"]+label {
    cursor: pointer;
    line-height: 16px;
    display: inline-block;
    padding-left: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background: url(/res/images/common/checkbox.png) no-repeat;
}

input[type="checkbox"]+label:hover {
    opacity: 0.75;
}

input[type="checkbox"]+label span {
    display: inline-block;
    padding-left: 7px;
}

input[type="checkbox"]:checked+label {
    background-position: 0 -16px;
}


/*---------------------------------------- 
비활성화 정의
----------------------------------------*/


/*--------------------
클래스 기반
--------------------*/

input[type="checkbox"].disabled+label {
    background-position: 0 -32px;
    color: #aaa;
    cursor: default;
}

input[type="checkbox"].select_disabled+label {
    background-position: 0 -48px;
    color: #aaa;
    cursor: default;
}


/*--------------------
속성 기반
--------------------*/

input[type="checkbox"][disabled="disabled"]+label {
    background-position: 0 -32px;
    color: #aaa;
    cursor: default;
}

input[type="checkbox"][disabled="disabled"]:checked+label {
    background-position: 0 -48px;
    color: #aaa;
    cursor: default;
}

input[type="checkbox"][disabled="true"]+label {
    background-position: 0 -32px;
    color: #aaa;
    cursor: default;
}

input[type="checkbox"][disabled="true"]:checked+label {
    background-position: 0 -48px;
    color: #aaa;
    cursor: default;
}


/*------------------------------------------------------------------
# Radio Button - Basic
------------------------------------------------------------------*/

input[type="radio"] {
    display: none;
}

input[type="radio"]+label {
    cursor: pointer;
    background-repeat: no-repeat;
    background-image: url("/res/images/common/radio.png");
    display: inline-block;
    padding-left: 26px;
    height: 18px;
    line-height: 20px;
}

input[type="radio"]+label:hover {
    opacity: 0.75;
}

input[type="radio"]+label span {
    padding-left: 0px;
    position: relative;
    top: 1px;
}

.lang-en input[type="radio"]+label {
    /* lang-en */
    line-height: 18px;
}

.con_table input[type="radio"]+label {
    /* in table */
    padding-left: 24px;
}



/*----------------------------------------
Radio Button - Status
----------------------------------------*/

input[type="radio"]:checked+label {
    background-position: 0 -18px;
}

input[type="radio"][disabled="disabled"]+label {
    background-position: 0 -36px;
    color: #aaa;
    cursor: default;
}

input[type="radio"][disabled="disabled"]:checked+label {
    background-position: 0 -54px;
    color: #aaa;
    cursor: default;
}

input[type="radio"][disabled="true"]+label {
    background-position: 0 -36px;
    color: #aaa;
    cursor: default;
}

input[type="radio"][disabled="true"]:checked+label {
    background-position: 0 -54px;
    color: #aaa;
    cursor: default;
}

.radioBtn>input[type="radio"]+label {
    padding-left: 24px;
}



input[type="radio"].disabled+label {
    background-position: 0 -36px;
    color: #aaa;
    cursor: default;
}

input[type="radio"].select_disabled+label {
    background-position: 0 -54px;
    color: #aaa;
    cursor: default;
}


/*----------------------------------------
Radio Button - Wrapper
- SCHB
----------------------------------------*/

.radioBtn {
    margin-right: 12px;
}

.radioBtn:last-of-type {
    margin-right: 0;
}




/*-----------------------------------------------------------------------------
# Radio Button - Toggle Button
-----------------------------------------------------------------------------*/

.btn_toggle_centerWrapper {
    /* Toggle Button - Wrapper - Center */
    display: inline-block;
    margin: 0 auto;    
}

.btn_toggle_on {
    display: block;
    overflow: hidden;
    width: 52px;
    height: 24px;
    border: 1px solid #aaa;
    border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    background: #e9eff7 url(/res/images/common/btn_switch_on.png) no-repeat 0 -1px;
}

.btn_toggle_off {
    display: block;
    overflow: hidden;
    width: 52px;
    height: 24px;
    border: 1px solid #aaa;
    border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    background: #e3e3e3 url(/res/images/common/btn_switch_off.png) no-repeat 0 -1px;
}

.btn_toggle_on span {
    display: block;
    overflow: hidden;
    text-indent: -9999px;
}

.btn_toggle_off span {
    display: block;
    overflow: hidden;
    text-indent: -9999px;
}

.toggle.btn_toggle_on:hover {
    background-color: #f3f9ff;
}

.toggle.btn_toggle_off:hover {
    background-color: #efefef;
}

.toggle[disabled="disabled"] {
    cursor: not-allowed !important;
    background-color: #e3e3e3;
}

.btn_toggle_on.toggle[disabled="disabled"] {
    background: #d9e2ec url(/res/images/common/btn_switch_on_none_i.png) no-repeat 0 -1px;
}

.btn_toggle_off.toggle[disabled="disabled"] {
    background: #e3e3e3 url(/res/images/common/btn_switch_off_none_i.png) no-repeat 0 -1px;
}


/*-----------------------------------------------------------------------------
# Radio Button - Button Group - Button Filter
> OSHD Web - Dashboard (2016)
-----------------------------------------------------------------------------*/

.btnGroupFilter {
	font-size: 0;
	margin-top: -8px;
}

.btnGroupFilter li {
	float: left;
	font-size: 11px;
	border-top: 1px solid #71abe0;
	border-right: 1px solid #71abe0;
	border-bottom: 1px solid #71abe0;
	padding: 3px 8px;
	color: #659fd4;
	cursor: pointer;
	text-align: center;
}

.btnGroupFilter li.active:hover span {
	opacity: 1;
}

.btnGroupFilter li:hover span {
	opacity: 0.7;
}

.btnGroupFilter li span {
	position: relative;
	bottom: 1px;
	margin-right: 0 !important;
}

.btnGroupFilter li:first-child {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	border-left: 1px solid #71abe0;
}

.btnGroupFilter li:last-child {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

.btnGroupFilter li.active {
	background-color: #0059a6;
	color: #fff;
    border: 1px solid #0059a6;
}


/*--------------------------------------------
Custom - Type01
--------------------------------------------*/

.btnGroupFilter.customType01 li {
	padding: 6px 24px;
	font-size: 12px;
}

.btnGroupFilter.customType01 li.active {
	font-weight: bold;
}


/*--------------------------------------------
Set Box - Design Edit
--------------------------------------------*/

.area_selectbar .btnGroupFilter.customType01 {
	margin-top: 5px;
	margin-left: 5px;
}

.area_selectbar .btnGroupFilter.customType01 li {
	width: 120px;
}


/*--------------------------------------------
Set Box - Design Edit - OS Selector
> OSHD Web (2016)
--------------------------------------------*/

.area_selectbar h4.title_selectlist_os+.btnGroupFilter.customType01 {
	margin-top: 6px;
	margin-left: 5px;
	position: relative;
	bottom: 3px;
}


/*--------------------------------------------
Custom - Type02
--------------------------------------------*/

.btnGroupFilter.customType02 li {
	padding: 5px 24px 3px;
	font-size: 12px;
	border-color: #8ebae0;
	color: #8ebae0;
}

.btnGroupFilter.customType02 li.active {
	background-color: #337ab8;
	color: #fff;
}

.layout_card .area_head .btnGroupFilter.customType02 {
    /* in Card  */
	margin: 7px 14px 3px 0px;
}


/*-----------------------------------------------------------------------------
# Radio Button - Radio Button Group
-----------------------------------------------------------------------------*/

.radioBtnGroup>a {
    min-width: 102px;
    height: 24px;
    padding: 6px 14px;
    border-color: #bbb;
    border-width: 1px 1px 1px 0;
    border-style: solid;
    float: left;
    font-size: 12px;
    text-align: center;
}

.radioBtnGroup>a:first-of-type {
    border-width: 1px 1px 1px 1px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.radioBtnGroup>a:last-of-type {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.radioBtnGroup>a:hover {
    background-color: #f3f3f3;
}

.radioBtnGroup>a.active {
    background-color: #0059a6;
    border-color: #075083;
    color: #fff;
    font-weight: bold;
}

.radioBtnGroup>a.active:hover {
    background-color: #0059a6;
}


/* 옵션 */

.radioBtnGroup + .bodyText {
    /* 바디텍스트 위치 */
    margin-left: 12px;
}


/* 라디오버튼 그룹 세로형 */
.radioBtnGroupVertical>.listItem {
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-color: #bbb;
    padding: 12px 12px;
}

.radioBtnGroupVertical>.listItem:hover {
    background-color: #f8fbff;
}

.radioBtnGroupVertical>.listItem:first-of-type {
    border-top: 1px solid #bbb;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.radioBtnGroupVertical>.listItem:last-of-type {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.radioBtnGroupVertical>.listItem input[type="radio"] + label {
    padding-left: 24px;
    font-weight: bold;
}

.rowGroup.radioBtnGroupVertical>.row.listItem {
    margin: 0;
}

.radioBtnGroupVertical .select_date,
.radioBtnGroupVertical .select_date input {
    margin-right: 10px;
    cursor: pointer;
}

.radioBtnGroupVertical .select_date input {
    border-radius: 3px;
    padding: 2px 8px;
}

.radioBtnGroupVertical .listItem-custom {
    height: 49px;
}

.radioBtnGroupVertical .listItem-custom .radioBtnWrapper {
    position: relative;
    top: 1px;
}/*------------------------------------------------------------------------
[ui_listSelect.css]
- 내용 : 리스트셀렉트(드롭다운) UI모듈 스타일 정의
------------------------------------------------------------------------*/


/*------------------------------------------------------------------
공통
------------------------------------------------------------------*/

.layout_card .area_content .con_table .board_search_area .check_set_area .list_select {
	margin-top: -7px;
	display: inline-block;
	vertical-align: middle;
}

.lang-en.ETC .layout_card[name="content1"] .area_content .con_table .board_search_area .check_set_area .list_select.durationtime>a {
    /* 기타관리 - 리스트셀렉트 크기 조정 */
    width: 130px !important;
}

.layout_card .area_content .con_table .board_search_area .check_set_area .list_select li {
	width: 100%;
	display: inline-block;
	vertical-align: middle;
}


/*------------------------------------------------------------------
드롭다운(리스트셀렉트)
------------------------------------------------------------------*/

.list_select {
    position: relative;
    float: left;
    vertical-align: middle;
    background: #fff;
}

.list_select.float-right {
    float: right;
}

.list_select>a {
    text-align: left;
    display: inline-block;
    font-size: 13px;
    line-height: 15px;
    vertical-align: middle;
    color: #767676;
    border: 1px solid #bbb;
    padding: 6px 9px;
    max-height: 27px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    background: url(/res/images/common/btn_select_arrow.png) no-repeat right 0;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-right: 38px;
    
}

.list_select>a:hover {
    color: #333;
    background: url(/res/images/common/btn_select_arrow_hover.png) no-repeat right 0;
    box-shadow: 0 0 3px rgba(0, 126, 255, 0.5);
}

.list_select>a.on {
    background-position: 0 -24px;
}

.list_select ul {
    /* width: 100%; */
    width: auto;
    min-width: 100%;
    position: absolute;
    top: 29px;
    left: 0;
    padding: 2px 0px;
    border: 1px solid #bbb;
    background: #fff;
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 101;
    border-radius: 4px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}

.list_select ul li {
    padding: 2px 8px;
    line-height: 1.2;
}


/*----------------------------------------
셀렉트 리스트 비활성화
----------------------------------------*/

.list_select ul li[disabled="disabled"] {
    color: #d0d0d0;
    cursor: default !important;
}

.list_select ul li[disabled="disabled"]:hover,
.list_select ul li[disabled="disabled"] a:hover {
    color: #d0d0d0;
    cursor: default !important;
}

ul.select_falllist01 {
    z-index: 200;
}

ul.select_falllist02 {
    z-index: 110;
}

.list_select ul li a {
    display: block;
    padding: 5px 0;
}


/*----------------------------------------
List_Select_S
----------------------------------------*/

.list_select_s {
    float: left;
    display: inline-block;
    vertical-align: middle;
    background: #fff;
    border-radius: 4px;
}

.list_select_s>a {
    display: inline-block;
    font-size: 12px;
    line-height: 12px;
    vertical-align: middle;
    color: #767676;
    border: 1px solid #bbb;
    padding: 6px 9px;
    max-height: 25px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    background: url(/res/images/common/btn_select_arrow.png) no-repeat right -1px;
}

.list_select_s>a:hover {
    color: #333;
    background: url(/res/images/common/btn_select_arrow_hover.png) no-repeat right -1px;
}

.list_select_s>a.on {
    background-position: 0 -24px;
}

.list_select_s ul {
    top: 26px;
    position: absolute;
    width: 99px;
    padding: 5px 10px;
    border: 1px solid #ddd;
    background: #fff;
    max-height: 94px;
    overflow-y: auto;
    overflow-x: hidden;
}

.list_select_s ul li {
    padding: 0;
    font-size: 12px;
}

.list_select_s ul li a {
    display: block;
    padding: 5px 0;
}


/*--------------------
List_Select_S 클래스 구체화
--------------------*/

.con_table .list_select_s.list_select {
    float: left;
    display: inline-block;
    vertical-align: middle;
    background: #fff;
    border-radius: 4px;
}

.con_table .list_select_s.list_select {
    float: left;
    display: inline-block;
    vertical-align: middle;
    background: #fff;
    border-radius: 4px;
}

.con_table .list_select_s.list_select>a {
    display: inline-block;
    font-size: 12px;
    line-height: 12px;
    vertical-align: middle;
    color: #767676;
    border: 1px solid #bbb;
    padding: 6px 9px;
    max-height: 25px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    background: url(/res/images/common/btn_select_arrow.png) no-repeat right -1px;
}

.con_table .list_select_s.list_select>a:hover {
    color: #333;
    background: url(/res/images/common/btn_select_arrow_hover.png) no-repeat right -1px;
}

.con_table .list_select_s.list_select>a.on {
    background-position: 0 -24px;
}

.con_table .list_select_s.list_select ul {
    top: 26px;
    position: absolute;
    width: 99px;
    padding: 5px 10px;
    border: 1px solid #ddd;
    background: #fff;
    max-height: 94px;
    overflow-y: auto;
    overflow-x: hidden;
}

.con_table .list_select_s.list_select ul li {
    padding: 0;
    font-size: 12px;
}

.con_table .list_select_s.list_select ul li a {
    display: block;
    padding: 5px 0;
}


/*----------------------------------------
하단 코드 추가 (디스에이블일 경우) - 160503
----------------------------------------*/

.list_select.list_select_disabled a {
    color: #bbb !important;
    border: 1px solid #ddd !important;
    background: url(/res/images/common/btn_select_arrow_disable.png) no-repeat right 0;
    cursor: default !important;
    cursor: default !important;
}

.list_select[disabled="disabled"] a {
    color: #bbb !important;
    border: 1px solid #ddd !important;
    background: url(/res/images/common/btn_select_arrow_disable.png) no-repeat right 0;
    cursor: default !important;
    cursor: default !important;
}


/*--------------------------------------------
리스트셀렉트 - 날짜선택UI
- select style - input 04/18 맹 추가 start
--------------------------------------------*/

.list_select .select_date {
    float: left;
    border: 1px solid #bbb;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

.list_select .middle_element {
    float: left;
    padding: 6px 5px 0;
}

.list_select .select_date input[type=text] {
    display: block;
    width: 130px;
    font-size: 13px;
    line-height: 13px;
    vertical-align: middle;
    text-align: center;
    color: #767676;
    padding: 6px 9px;
    /* max-height:25px;*/
    height: 26px;
    border: none;
    background: transparent;
}

.list_select .select_date input[type=text]:hover {
    box-shadow: 0 0 3px rgba(0, 126, 255, 0.5);
}


/*--------------------------------------------
버튼 옆 셀렉트리스트
--------------------------------------------*/

.btn_middle.btn_nextToListSelect {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    height: 32px;
}

.btn_middle.btn_nextToListSelect+.list_select_nextToBtn>a {
    padding: 8px 28px 22px 13px;
    height: 32px;
}

.list_select.list_select_nextToBtn {
    float: none;
    display: inline-block;
    margin-left: -4px;
    background: transparent;
    vertical-align: top;
}

.list_select.list_select_nextToBtn>a {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    background: transparent;
    font-size: 12px;
    background: #fff;
}

.list_select.list_select_nextToBtn>a:after {
    /*드롭다운 화살표*/
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #bbb;
    margin-left: 6px;
    margin-top: 5px;
}

.list_select.list_select_nextToBtn:hover>a:after {
    /*드롭다운 화살표 : 마우스오버*/
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #aaa;
}

.list_select.list_select_nextToBtn>a+ul {
    margin-top: 4px;
}

.list_select.list_select_nextToBtn>a+ul>li {
    font-size: 12px;
}


/*--------------------------------------------
셀렉트 박스(테이블영역) 부분 수정
--------------------------------------------*/

.con_table .list_select ul {   
    width: auto;
    min-width: 100%;
    font-size: 1rem;
}

.con_table .list_select ul li {
    padding: 2px 8px;
}


/*------------------------------------------------------------------
메뉴리스트
------------------------------------------------------------------*/

.common_menu_list {
	position: relative;
	font-weight: normal;
}

.common_menu_list ul {
	position: absolute;
	box-shadow: 0 2px 4px rgba(100, 100, 100, .3);
	-webkit-box-shadow: 0 2px 4px rgba(100, 100, 100, .3);
	-moz-box-shadow: 0 2px 4px rgba(100, 100, 100, .3);
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	background: #fff;
	z-index: 500;
	border: 1px solid #bbb;
	white-space: nowrap;
	margin-top: 3px;
}

.common_menu_list ul li {
	text-align: center;
}

.common_menu_list ul li a {
	display: block;
	overflow: hidden;
	padding: 12px 13px;
	line-height: 1.2;
	word-break: break-word;
    white-space: normal;
}

.common_menu_list ul li a:hover {
	background: #f5f5f5;
	color: #0059a6;
	text-decoration: underline;
}

.common_menu_list ul li:first-child a:hover {
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}

.common_menu_list ul li.end_list a:hover {
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
}


/*----------------------------------------
공통메뉴리스트 폰트사이즈/최소크기 설정
----------------------------------------*/

.common_menu_list.font_size_12 ul li a {
	font-size: 12px
}

.common_menu_list.font_size_12 ul {
	min-width: 130px;
}

.common_menu_list.font_size_13 ul li a {
	font-size: 13px;
}

.common_menu_list.font_size_13 ul {
	min-width: 140px;
}


/*----------------------------------------
메뉴리스트 비활성화
----------------------------------------*/

.menu_list>ul>li[disabled="disabled"],
.menu_list>ul>li[disabled="disabled"]>a {
	color: #d0d0d0;
}

.menu_list>ul>li[disabled="disabled"]:hover,
.menu_list>ul>li[disabled="disabled"]>a:hover {
	background: transparent;
	cursor: normal;
}

.menu_list>ul>li.disabled,
.menu_list>ul>li.disabled>a {
	color: #d0d0d0;
}

.header_topbar .area_topbar .area_admin_info .menu_list ul li.disabled a:hover {
	background: transparent;
	cursor: normal;
}

.btn_gopage.common_menu_list ul li a {
	/* 관련메뉴 바로가기 - 메뉴리스트 */
	white-space: nowrap;
}
﻿﻿/*------------------------------------------------------------------------
[ui_table.css]
- 내용 : 공통 + 미분류 테이블 UI모듈 스타일 정의
------------------------------------------------------------------------*/


th {
	font-weight: normal;
}

.mid_text {
	vertical-align: middle;
	padding-top: 3px;
	color: #878787;
	font-size: 15px;
}


/*------------------------------------------------------------------------------------------
contents - layout_card 일반테이블 영역
------------------------------------------------------------------------------------------*/

.layout_card .area_content .table_content {
	margin: 0 auto;
	width: 100%;
	padding: 20px 0 20px 0;
	text-align: center;
}


/*--------------------
체크박스 포함 테이블 헤더
--------------------*/

.layout_card .area_content .table_content .ch_left {
	margin: 0 auto;
	width: 100%;
	padding: 20px 15px 20px 15px;
	text-align: left !important;
}

.layout_card .area_content .ch_left th {
	/* 체크박스 포함 테이블 헤더 */
	background-color: #e9eff7;
	color: #252b31;
	padding: 15px;
	font-weight: bold;
	text-align: left !important;
}

.lang-en .layout_card .area_content .ch_left th,
.lang-ja .layout_card .area_content .ch_left th {
	/* 체크박스 포함 테이블 헤더 - 영/일문 여백 조정 */
	padding: 15px;
}

.layout_card .area_content .table_content>table {
	border-collapse: separate;
}

.layout_card .area_content table {
	table-layout: fixed;
}

.layout_card .area_content table th {
	/* 로그테이블 헤더 기본 설정 */
	font-size: 13px;
	background-color: #e9eff7;
	color: #252b31;
	padding: 15px 0 15px 0;
	font-weight: normal;
	font-weight: bold;
	/* text-transform: capitalize;  */
}

.lang-ja .layout_card .area_content table th,
.lang-en .layout_card .area_content table th {
	/* 로그테이블 헤더 기본 설정 - 일본어 폰트 조정 */
	/* 로그테이블 헤더 기본 설정 - 영문 폰트 조정 */
	font-size: 12px;
	padding-left: 4px;
    font-size: 12px;
    padding-right: 4px;
    word-wrap: break-word !important;
}

.lang-ja .layout_card .area_content table.detaile th,
.lang-en .layout_card .area_content table.detaile th {
	/* 상세테이블 - 헤더 - 줄바꿈 */
	white-space: normal;
}

.layout_card .area_content table th .filter_sub {
	/* 필터 적용 - 서브 텍스트 */
	/* display: block; */
	word-wrap: break-word;
    text-overflow: unset;
}

.layout_card .area_content .con_table>.table_content>table>tbody>tr>td {
	text-align: center;
	height: 39px;
}

.layout_card .area_content .con_table>.table_content>table>tbody>tr.row-selectAll>td {
	/* 테이블 전체선택 UI 커스텀 */
	border-bottom: 0;
}

.layout_card .area_content table td {
	padding: 8px 15px 8px 15px;
	font-size: 12px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	border-bottom: solid 1px #dedede;
}

.layout_card .area_content table .groub_left {
	text-align: left !important;
}

.layout_card .area_content table .all {
	height: 38px;
	font-size: 13px;
}


/*------------------------------------------------------------
contents - layout_card 테이블 상단아이콘부분
------------------------------------------------------------*/

.img_icon{vertical-align:middle; padding-left:2px;}


/* ------------------------------------------------------------
테이블 헤더 분리 (.tit_add)
------------------------------------------------------------*/

.layout_card .area_content .tit_add {
	/* .tit_add는 테이블임 */
	width: 100%;
}

.layout_card .area_content .tit_add td {
	border-bottom: solid 0px #dedede;
	padding-top: 10px;
	padding-bottom: 0px;
	overflow: hidden;
	white-space: normal;
	text-overflow: clip;
}

.layout_card .area_content .tit_add .line {
	padding-top: 0px;
	padding-bottom: 10px;
	/* border-bottom: solid 1px #dedede; */
	border-bottom: solid 1px #c8d0dc;
}

.ip_area {
	padding: 8px 0 8px 0 !important;
}

.layout_card .area_content .table_content .selectlist_group {
	display: table;
	margin: 0 auto;
	text-align: left;
}

.layout_card .area_content .table_content .selectlist_group .list_select {
	margin: 0 auto;
}


/*------------------------------------------------------------
contents - layout_card 상세보기부분 
------------------------------------------------------------*/

.table_detail {
	background: #f5f5f5 url(/res/images/common/bg_topbar_shadow2.png) repeat-x 0 top;
}

.table_detail table {
	margin: 0 auto;
	text-align: left;
	width: 90%;
	color: #6F6F6F;
	font-size: 12px;
}

.layout_card .area_content .con_table>.table_content>table>tbody>tr>td.table_detail {
	height: auto;
	overflow: visible;
}

.layout_card .area_content .con_table>.table_content>table>tbody>tr>td.table_detail div.view_data {
	width: 100%;
}

.table_detail table .d_all {
	height: 30px;
	text-align: center !important;
}

.table_detail .view_data {
	padding: 20px 0 20px 0;
}


.table_detail .view_data .all_view tr td {
	/* word-break: break-all; */
	word-break: unset;
	white-space: pre-line !important;
	border-bottom: dashed 1px #dedede;
	line-height: 1.4;
	/* text-transform: capitalize; */
}
.table_detail .view_data .all_view tr:last-child td {
	border-bottom: 0;
}
.table_detail .view_data .detaile {
	text-align: center;
}
.table_detail .view_data .detaile .left {
	text-align: left !important;
	word-break: break-all;
	white-space: pre-line !important;
}
.table_detail .view_data .detaile th {
	padding: 8px 0 8px 0 !important;
	border-bottom: 1px solid #c5c9d1;
	font-weight: normal;
	position: relative;
	color: #6f6f6f;
}
.table_detail .view_data .detaile td {
	text-align: center;
}
.table_detail .view_data .search_area {
	padding: 0 5% 15px 0;
}
.table_detail .ina_area {
	float: left;
	width: 100%;
	padding-bottom: 10px;
}
.table_detail .selectlist {
	text-align: left !important;
	padding-left: 50px !important;
}
.table_detail .table_pagelist {
	padding-left: 5px;
}
.table_detail .table_pagelist ul li {
	float: left;
	padding-left: 5px;
	display: inline-block;
}
.table_detail .table_pagelist ul li.pagelist_text {
	padding-top: 6px !important;
	font-size: 12px;
}
.table_detail .excel_down {
	padding-right: 48px !important;
}
.table_detail .btn_area {
	display: block;
	padding: 10px 15px 10px 0;
}
.table_detail .btn_close {
	width: 100%;
	height: 30px;
	background-color: #D3D3D3;
}
.table_detail .close_area {
	width: 100%;
	text-align: right;
	padding-right: 50px;
	padding-bottom: 10px;
}

/*------------------------------------------------------------------------------------------
로그테이블 - 상세테이블 - 추가상세테이블
------------------------------------------------------------------------------------------*/
.table_detail .view_data .detaile .custom_detail>td>div>table tr:last-of-type td {
	border-bottom: 0;
}

/*------------------------------------------------------------
테이블안 그래프추가
------------------------------------------------------------*/
.com_graph_type01 {
	width: 552px;
	margin: 0 auto;
}

.com_graph_type01 ul li {
	display: inline-block;
	width: 180px;
	text-align: center;
	padding: 20px 0 20px 0;
}

.com_graph_type01 ul li span.color_blue01 {
	float: none;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #0059a6;
}

.com_graph_type01 ul li span.color_green01 {
	float: none;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #1f8c13;
}

.com_graph_type01 ul li span.color_skyblue01 {
	float: none;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #3c9df0;
}

.com_graph_type01 ul li span.color_yellowgreen01 {
	float: none;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #93c911;
}

.com_graph_type01 ul li span.text_title {
	display: inline-block;
	vertical-align: middle;
	margin-left: 4px;
}

.graph_btm_text {
	border-top: 1px solid #bbb;
}

.graph_btm_text .btm_info {
	padding: 0 15px;
}

.graph_btm_text .btm_info li {
	display: inline-block;
	float: left;
	width: 25%;
	padding: 15px 0 10px 0;
	text-align: center;
}

.graph_btm_text .btm_info .text_title {
	padding-left: 15px;
	font-weight: bold;
}

.graph_btm_text .btm_info .text_value {
	padding-left: 10px;
}


/*------------------------------------------------------------
contents - layout_card -끝이둥근테이블 영역
------------------------------------------------------------*/

.layout_card .area_content .table_content_circle table {
	table-layout: fixed;
}

.table_content_circle>table>thead:first-child>tr:first-child>th:first-child {
	-moz-border-radius: 5px 0 0 0;
	-webkit-border-radius: 5px 0 0 0;
	border-radius: 5px 0 0 0;
}

.table_content_circle>table>thead:first-child>tr:first-child>th:last-child {
	-moz-border-radius: 0 5px 0 0;
	-webkit-border-radius: 0 5px 0 0;
	border-radius: 0 5px 0 0;
}

.table_content_circle>table>tbody>tr>td:first-child,
.table_content_circle>table>tbody>tr>th:first-child,
.table_content_circle>table>thead>tr>td:first-child,
.dl.table_content_circle>table>thead>tr>th:first-child {
	border-left: 0px solid #d6d6d6;
}

.layout_card .area_content .selectlist {
	padding-left: 15px;
}

.layout_card .area_content .table_pagelist {
	float: left;
	padding-left: 5px;
}

.layout_card .area_content .table_pagelist ul li {
	float: left;
	padding-left: 5px;
	display: inline-block;
}


/*------------------------------------------------------------
테이블 페이지리스트 버튼 스타일 재조정
------------------------------------------------------------*/

.layout_card .area_content .table_pagelist ul li>a {
	height: 28px;
	float: left;
	background: #fff url(/res/images/common/btn_tablelist_arrow.png) 28px -1px;
}

.layout_card .area_content .table_pagelist ul li>a:hover {
	background: #fff url(/res/images/common/btn_tablelist_arrow_hover.png) 28px -1px;
}

.layout_card .area_content .table_pagelist ul li:first-child>a {
	background: #fff url(/res/images/common/btn_tablelist_arrow.png) 0px -1px;
}

.layout_card .area_content .table_pagelist ul li:first-child>a:hover {
	background: #fff url(/res/images/common/btn_tablelist_arrow_hover.png) 0px -1px;
}


/*------------------------------------------------------------
상세테이블용 페이지리스트 버튼 스타일 재조정
------------------------------------------------------------*/

.layout_card .area_content .table_detail .table_pagelist ul li>a {
	height: 24px;
	background-size: 50px auto;
	background-position: 25px -1px;
}

.layout_card .area_content .table_detail .table_pagelist ul li>a:hover {
	background-size: 50px auto;
	background-position: 25px -1px;
}

.layout_card .area_content .table_detail .table_pagelist ul li:first-child>a {
	background-size: 50px auto;
	background-position: 0px -1px;
}

.layout_card .area_content .table_detail .table_pagelist ul li:first-child>a:hover {
	background-size: 50px auto;
	background-position: 0px -1px;
}


/*------------------------------------------------------------
테이블 페이지리스트 텍스트
------------------------------------------------------------*/

.layout_card .area_content .table_pagelist ul li.pagelist_text {
	color: #767676;
	padding-top: 9px;
	padding-left: 8px;
	font-size: 12px;
}

.layout_card .area_content .table_detail .table_pagelist ul li.pagelist_text {
	font-size: 11px;
}

.layout_card .area_content .excel_down {
	padding-right: 15px;
}

.layout_card .area_content .top_btn_area {
	display: inline-block;
	padding-left: 10px;
}

.layout_card .area_content .excel_down li {
	display: inline-block;
	float: left;
	padding-left: 8px;
}

.DLP .layout_card .area_content .keep_in em {
	/* 정보유출방지 - 로그 - 알아두세요 - 설명 부분*/
	display: inline;
}

.layout_card .area_content .keep_in em {
	/* 알아두세요 - 설명 부분 */
	clear: both;
	padding-left: 15px;
	font-size: 12px;
	color: #727272;
	/* line-height: 23px; */
	line-height: 1.3;
	/*display: block; */
}

.layout_card .area_content .keep_in .notitle {
	/* 알아두세요 - 설명 부분 - 타이틀 없을 경우 */
	clear: both;
	padding-left: 6px;
	font-size: 13px;
	color: #727272;
	/* line-height: 20px; */
	line-height: 1.3;
	display: inline;
	margin-right: 4px;
}

.layout_card .area_content .keep_in .notitle_pa {
	clear: both;
	font-size: 13px;
	color: #727272;
	line-height: 20px;
}


/*------------------------------------------------------------
contents - layout_card - 테이블차단영역
------------------------------------------------------------*/

.layout_card .area_content .etc {
	padding-left: 20px;
	font-size: 13px;
	line-height: 20px;
}

.layout_card .area_content .etc li {
	padding: 5px 0 5px 0;
}

.layout_card .area_content .etc .icon {
	background: url(/res/images/common/blue_dot.png) left no-repeat;
	vertical-align: middle;
	width: 2px;
	height: 2px;
	padding: 0 2px 0 2px !important;
}

.layout_card .area_content .etc .notitle {
	clear: both;
	padding-left: 6px;
	font-size: 13px;
	color: #727272;
	line-height: 20px;
}

.layout_card .area_content .etc em {
	clear: both;
	padding-left: 25px;
	font-size: 12px;
	color: #727272;
	line-height: 15px;
}

.layout_card .area_content .etc .blocking {
	font-size: 15px;
	line-height: 25px;
	color: #0059a6;
	font-weight: bold;
}

.layout_card .area_content .con_table .board_search_area .email_area {
	display: inline-block;
	vertical-align: middle;
	padding: 5px 10px 0 20px;
}

.layout_card .area_content .con_table .board_search_area .email_area input.text_box_gray {
	height: 24px;
	*height: 24px;
	font-size: 13px;
	color: #333;
	*line-height: 20px;
}

.layout_card .area_content .con_table .board_search_area .ip_area {
	display: inline-block;
}

.layout_card .area_content .con_table .board_search_area .ip_area .tit {
	padding: 0 7px 0 10px;
	font-weight: bold;
	line-height: 24px;
}

.layout_card .area_content .con_table .board_search_area .ip_area .tit_b {
	padding: 0 7px 0 20px;
	font-weight: bold;
	line-height: 24px;
}

.layout_card .area_content .con_table .board_search_area .ip_area .middle_element {
	line-height: 24px;
}

.layout_card .area_content .con_table .board_search_area .ip_area input.text_box_gray {
	height: 24px;
	*height: 24px;
	font-size: 13px;
	color: #333;
	*line-height: 20px;
}


/*------------------------------------------------------------
 contents - layout_card - 테이블 정책설정_예외설정영역
 ------------------------------------------------------------*/

.check_area{margin:0 auto;width:52px;height:24px;}

.table_content th .menu_list {
	position: relative;
	font-weight: normal;
}


/*------------------------------------------------------------
서브테이블에들어가는 메뉴리스트(레이어팝업) 커스텀 스타일 정의
------------------------------------------------------------*/

.table_content .table_detail .detaile.table th .menu_list {
	position: absolute;
}


/*------------------------------------------------------------
인재관리 > 문서활용 내역의 서브테이블
------------------------------------------------------------*/

.table_content .table_detail .detaile.table th .menu_list.sub_table_menu_list_type01 {
	min-width: 100px;
	left: 34px;
}

.table_content th .menu_list ul {
	position: absolute;
	top: 11px;
	right: 0;
	box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	-webkit-box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	-moz-box-shadow: 0 2px 3px 2px rgba(100, 100, 100, .2);
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	background: #fff;
	z-index: 500;
	border: 1px solid #bbb;
	min-width: 100%;
	width: auto;
	max-height: 300px;
    overflow: auto;
}

.table_content th .menu_list ul li.active a {
	text-decoration: underline;
	font-weight: bold;
}

.table_content th .menu_list ul li a {
	display: block;
	overflow: hidden;
	padding: 12px 13px;
	font-size: 12px;
	line-height: 1.2;
}

.table_content th .menu_list ul li a:hover {
	background: #f5f5f5;
}

.table_detail .view_data h4 { 
	line-height: 1.2;
	font-size: 13px;
	text-align: left;
	font-weight: bold;
	width: 90%;
	margin: 0px auto 10px;
}


/*------------------------------------------------------------
테이블 헤더 줄바꿈 높이 조정
------------------------------------------------------------*/
.table_content th { line-height: 1.2;}


/*------------------------------------------------------------
테이블 내용 생략 해제 클래스 추가 (no_ellipsis)
------------------------------------------------------------*/

.layout_card .area_content table td.no_ellipsis {
	text-overflow: unset;  line-height: 1.3; 
	white-space: pre-wrap; word-break: break-all; 
}


/*------------------------------------------------------------
테이블 관련 일반 스트링 디스플레이 영역 임시 코드
------------------------------------------------------------*/

.con_table .stringDisplay .contWrapper {
	padding: 16px 6px 0px;
}


/*------------------------------------------------------------
테이블 전체 행에 대한 색상 추가 코드
------------------------------------------------------------*/

tbody tr.trGreen td {
	background: #f6fff6;
}

tbody tr.trTextGreen td {
	color: #348c00;
}

tbody tr.trRed td {
	background: #fffaf4;
}

tbody tr.trTextRed td {
	color: #f56400;
}


/*--------------------------------------------------------------------------------
임시 - 백업확장자설정
--------------------------------------------------------------------------------*/

.table_content_bkupExtentionSet table thead th {
	border-right: 1px solid #bdd9e6 !important;
}

.table_content_bkupExtentionSet table thead th:last-of-type {
	border-right: 0;
} 

.table_content_bkupExtentionSet table tbody td {
	border-right: 1px solid #ddd !important;
}

.table_content_bkupExtentionSet table tbody td > label {
	position: relative;
	top: 4px;
}

.table_content_bkupExtentionSet table tbody td .btn-toggle-wrapper {
	/*position: relative;*/
	position: relative;
	left: 3px;
}

.table_content_bkupExtentionSet table tbody td:last-of-type {
	border-right: 0;
}

.table_content_bkupExtentionSet table tbody tr.row-selectAll>td {
	background: #e9eff7;
	font-weight: bold;
	text-align: left !important;
}

.table_content_bkupExtentionSet table tbody tr.row-selectAll>td label {
	top: 0;
	font-size: 13px;
}


/*--------------------------------------------------------------------------------
테이블 셀 강조
--------------------------------------------------------------------------------*/

th.cellAccent,
.layout_card .area_content table th.cellAccent {
	background-color: #d2e5ff;
}

.layout_card .area_content table th.cellAccent .tit_add .line {
	border-color: #bfd5f3;
}

td.cellAccent,
.layout_card .area_content table td.cellAccent {
	background-color: #f5f5f5;
}
/*------------------------------------------------------------------------
[ui_table_simple.css]
- 내용 : 심플테이블 UI모듈 스타일 정의
------------------------------------------------------------------------*/


/*--------------------------------------------------------------------------------
# 심플테이블 
--------------------------------------------------------------------------------*/

.simple_table {
    width: 100%;
    font-size: 13px;
}

.simple_table thead th {
    padding: 10px 8px;
    border-width: 1px 1px 1px 0;
    border-color: #bbb;
    border-style: solid;
    background: #ececec;
    font-weight: bold;
    ;
}

.simple_table thead th:last-child {
    border-width: 1px 0px 1px 0px;
}

.simple_table tbody td {
    padding: 10px 8px;
    border-width: 1px 1px 1px 0;
    border-color: #bbb;
    border-style: solid;
    font-size: 12px;
}

.simple_table tbody td:last-child {
    border-width: 1px 0px 1px 0px;
}
/*--------------------------------------------------------------------------------
[ui_table_policy.css]
- 내용 : 정책(정책설정)테이블 UI모듈 스타일 정의
--------------------------------------------------------------------------------*/


/*------------------------------------------------------------
정책설정카드 - 테이블응용형태
- .con_table_no 클래스 사용
------------------------------------------------------------*/

.layout_card .area_content .con_table_no {
	padding: 0 0 20px 0;
}

.layout_card .area_content .con_table_no .table_content {
	margin: 0 auto;
	width: 100%;
	padding: 0 0 20px 0;
	text-align: center;
}

.layout_card .area_content .con_table_no .board_search_area {
	display: none
}

.layout_card .area_content .con_table_no .table_content table td {
	overflow: visible;
	white-space: normal;
	word-break: break-all;
	line-height: 1.3 !important;
}

.layout_card .area_content .con_table_no .table_content table td>font {
	display: block;
	margin-top: 2px;
}


/*--------------------------------------------------------------------------------
정책테이블
--------------------------------------------------------------------------------*/

table.policyTable {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
}

table.policyTable tr th,
table.policyTable tr td {
	text-align: center;
	line-height: 1.4;
}

.layout_card .area_content table.policyTable tr td {
	font-size: 13px;
	white-space: normal;
}

table.policyTable.verticalTop tr td {
	/* 테이블 내용 상단 정렬 */
	vertical-align: top;
    padding-top: 20px;
    padding-bottom: 20px;
}

.table.policyTable tr th .list_select,
table.policyTable tr td .list_select {
	text-align: left;
}

table.policyTable tr th {
	border-style: solid;
	border-width: 1px 1px 1px 0;
	border-color: #bbb;
	font-size: 13px;
	background-color: #e9eff7;
	color: #252b31;
	padding: 15px 0 15px 0;
	font-weight: normal;
	font-weight: bold;
}

table.policyTable tr td {
    padding: 8px 15px 8px 15px;
    font-size: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    border-bottom: solid 1px #dedede;
}

table.policyTable tr th:first-of-type {
	border-top-left-radius: 5px; 
	border-left: 1px solid #bbb;
}

table.policyTable tr th:last-of-type {
	border-top-right-radius: 5px;
}

table.policyTable tr.thExtend td {
	font-weight: bold;
	background-color: #f8fbff;
}

table.policyTable tr td.thExtendCell {
	background-color: #f8fbff;
}

table.policyTable tr td,
.layout_card .area_content table.policyTable td {
	border-style: solid;
	border-width: 0 1px 1px 0;
	border-color: #bbb;
}

table.policyTable tr td.text-align-left,
.layout_card .area_content table.policyTable td.text-align-left,
table.policyTable tr td.text_align_left,
.layout_card .area_content table.policyTable td.text_align_left {
	text-align: left;
}

table.policyTable td:first-of-type,
.layout_card .area_content table.policyTable td:first-of-type {
	border-left: 1px solid #bbb;
}

table.policyTable td.noFirst:first-of-type,
.layout_card .area_content table.policyTable td.noFirst:first-of-type {
	border-left: 0;
}

table.policyTable tr:last-of-type td:first-of-type,
.layout_card .area_content table.policyTable tr:last-of-type td:first-of-type {
	border-left: 1px solid #bbb;
	border-bottom-left-radius: 5px;
}

table.policyTable tr:last-of-type td:last-of-type,
.layout_card .area_content table.policyTable tr:last-of-type td:last-of-type {
	border-right: 1px solid #bbb;
	border-bottom-right-radius: 5px;
}

table.policyTable tr.tdDefaultPolicy>td {
	background-color: #efefef;
	color: #aaa;
}﻿/*--------------------------------------------------------------------------------
[ui_tooltip.css]
> Tooltip

# OK - mouse_tooltip - 사이드바 위젯 툴팁
# 툴팁타입01 - 테이블 - 오버플로우항목 - 상세보기
# 툴팁타입02 - 구 오피스실드 - 프로세스 설정
# 툴팁타입03 - 글로벌일반형툴팁
# 툴팁 - tooltip1, tooltip2 - 툴팁 관련 추가개발 코드
--------------------------------------------------------------------------------*/

/*------------------------------------------------------------
# OK - mouse_tooltip - 사이드바 위젯 툴팁
------------------------------------------------------------*/

.mouse_tooltip {
	max-width: 100%;
	position: absolute;
	background: rgb(255, 255, 255) none repeat scroll 0% 0%;
	line-height: 1.2;
	opacity: 0.9;
	padding: 12px 14px;
	border: 1px solid rgb(187, 187, 187);
	border-radius: 3px;
	font-size: 12px;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
}

.mouse_tooltip>span {
	display: block;
	margin-bottom: 2px;
}

.sidebar_sec_widget .mouse_tooltip {
	background: rgb(255, 255, 255) none repeat scroll 0% 0%;
	opacity: 0.9;
	padding: 12px 14px;
	border: 1px solid rgb(187, 187, 187);
	border-radius: 3px;
	font-size: 12px;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
    max-width: none;
    position: absolute;
    color: #505050;
    line-height: 1.4;
    width: 175px;
    right: -10px;
    z-index: 112;
    margin-top: 2px;
}

.lang-en .sidebar_sec_widget .mouse_tooltip,
.lang-ja .sidebar_sec_widget .mouse_tooltip {
    left: -25px;;
}


/*------------------------------------------------------------
# 툴팁타입01 - 테이블 - 오버플로우항목 - 상세보기
------------------------------------------------------------*/

.tooltip_type01:hover:before {
    content: ""attr(tooltip_text)"";
    position: absolute;
    background: rgb(255, 255, 255) none repeat scroll 0% 0%;
    line-height: 1.2;
    opacity: 1;
    border: 1px solid rgb(187, 187, 187);
    border-radius: 3px;
    font-size: 12px;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
    color: #505050;
    text-align: left;
    word-break: break-all;
    white-space: pre-wrap;
    cursor: text;
    max-width: 80%;
    padding: 8px 12px;
    margin-top: 14px;
    margin-left: -12px;
    z-index: 999;
}


/*------------------------------------------------------------
# 툴팁타입02 - 구 오피스실드 - 프로세스 설정
------------------------------------------------------------*/

img.imgProcessSetting {
    position: relative;
}

img.imgProcessSetting:hover {
    opacity: 0.8;
}

td img.imgProcessSetting+.tooltip_type02_processSetting {
    position: absolute;
    left: 50%;
}

img.imgProcessSetting+.tooltip_type02_processSetting {
    width: 200px;
    background: rgba(255, 255, 255, 0.9);
    text-align: left;
    white-space: normal;
    border: 1px solid #bbb;
    border-radius: 4px;
    padding: 12px;
    margin: 4px 0 0 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
    z-index: 51;
}

img.imgProcessSetting+.tooltip_type02_processSetting {
    display: none;
}

img.imgProcessSetting+.tooltip_type02_processSetting span.settingTitle {
    display: block;
    font-weight: bold;
}

img.imgProcessSettingBL+.tooltip_type02_processSetting span.settingTitle {
    color: #0059a6;
}

img.imgProcessSettingWL+.tooltip_type02_processSetting span.settingTitle {
    color: #338b00;
}

img.imgProcessSettingMW+.tooltip_type02_processSetting span.settingTitle {
    color: #ff6600;
}

img.imgProcessSettingUK+.tooltip_type02_processSetting span.settingTitle {
    color: #999999;
}

img.imgProcessSetting+.tooltip_type02_processSetting p.settingDescription {
    display: block;
    font-size: 11px;
    margin-top: 4px;
}


/*----------------------------------------------------------------------
# 툴팁타입03 - 글로벌일반형툴팁
> 글로벌일반형툴팁은 어떤 엘레멘트에도 적용 가능 (<img/>와 같은 void element 제외)
> 글로벌일반형툴팁은 어떤 엘레멘트도 포함 가능
> 글로벌일반형툴팁 옵션 클래스
    > 폭 조정 : size_auto(default), size_sm, size_md, size_lg
    > 높이 조정 : 높이 비고정형 - no_scroll
    > 부모개체의 상대좌표화 제거 - no_relative
----------------------------------------------------------------------*/

/*------------------------------------------------
글로벌일반형툴팁 트리거 및 옵션값
------------------------------------------------*/

.tooltip_type03_globalCommon_trigger {
    position: relative;
    z-index: 2;
}

.tooltip_type03_globalCommon_trigger.no_relative {
    position: inherit;
}

.tooltip_type03_globalCommon_trigger.no_relative .tooltip_type03_globalCommon,
.tooltip_type03_globalCommon_trigger.no_relative+.tooltip_type03_globalCommon {
    top: inherit;
}

.tooltip_type03_globalCommon_trigger.size_auto .tooltip_type03_globalCommon,
.tooltip_type03_globalCommon_trigger.size_auto+.tooltip_type03_globalCommon {
    width: auto !important;
}

.tooltip_type03_globalCommon_trigger.size_w200 .tooltip_type03_globalCommon,
.tooltip_type03_globalCommon_trigger.size_w200+.tooltip_type03_globalCommon {
    min-width: 200px;
    width: 200px;
}

.tooltip_type03_globalCommon_trigger.size_w300 .tooltip_type03_globalCommon,
.tooltip_type03_globalCommon_trigger.size_w300+.tooltip_type03_globalCommon {
    min-width: 300px;
    width: 300px;
}

.tooltip_type03_globalCommon_trigger.size_w400 .tooltip_type03_globalCommon,
.tooltip_type03_globalCommon_trigger.size_w400+.tooltip_type03_globalCommon {
    min-width: 400px;
    width: 400px;
}

.tooltip_type03_globalCommon_trigger.size_w500 .tooltip_type03_globalCommon,
.tooltip_type03_globalCommon_trigger.size_w500+.tooltip_type03_globalCommon {
    min-width: 500px;
    width: 500px;
}

.tooltip_type03_globalCommon_trigger.size_w600 .tooltip_type03_globalCommon,
.tooltip_type03_globalCommon_trigger.size_w600+.tooltip_type03_globalCommon {
    min-width: 600px;
    width: 600px;
}

.tooltip_type03_globalCommon_trigger.size_w300.posCenter .tooltip_type03_globalCommon {
    margin-left: -150px !important;
    left: 50% !important;
    margin-top: 4px;
}

.tooltip_type03_globalCommon_trigger.posCenter+.tooltip_type03_globalCommon {
    /* 툴팁 가운데 정렬 */
    transform: translate(-50%, 0)
}


/*------------------------------------------------
글로벌일반형툴팁 기본 설정
------------------------------------------------*/

.tooltip_type03_globalCommon_trigger+.tooltip_type03_globalCommon {
    top: auto;
}

.tooltip_type03_globalCommon {
    display: none;
    position: absolute;
    top: 100%;
    width: auto;
    height: auto;
    background: rgba(255, 255, 255, 0.9);
    text-align: left;
    white-space: normal;
    border: 1px solid #bbb;
    border-radius: 4px;
    padding: 12px;
    margin: 0 0 0 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
    z-index: 101;
    line-height: 1.3;
    color: #767676;
    cursor: auto;
}

.tooltip_type03_globalCommon>* {
    padding: 6px;
    display: block;
    width: 100%;
}

.tooltip_type03_globalCommon span.tooltip_title {
    /* 글로벌일반형툴팁 제목 */
    font-weight: bold;
    font-size: 13px;
}

.tooltip_type03_globalCommon span.tooltip_text,
.tooltip_type03_globalCommon p.tooltip_text {
    /* 글로벌일반형툴팁 텍스트(p, span)*/
    font-size: 12px;
}

.tooltip_type03_globalCommon div.tooltip_contRow {
    /* 글로벌일반형툴팁 복합콘텐츠행(Row)*/
    font-size: 0;
}

.tooltip_type03_globalCommon div.tooltip_contRow>* {
    display: inline-block;
    height: auto;
    font-size: 12px;
    vertical-align: top;
    word-break: break-word;
}

.tooltip_type03_globalCommon div.tooltip_contRow>.headline {
    width: 35%;
    font-weight: bold;
    padding-right: 5%;
}

.tooltip_type03_globalCommon div.tooltip_contRow>.body {
    width: 65%;
}

.tooltip_type03_globalCommon div.tooltip_contRow>.divider {
    width: 100%;
    display: block;
    height: 0;
    border-bottom: 1px dashed #ccc;
}

.set_layer_popup>ul.content_wrapper .tooltip_type03_globalCommon span {
    /* 설정레이어팝업 내 위치 시 줄바꿈 생성 방지용 코드 */
    margin-right: 0 !important;
}


/*----------------------------------------------------------------------
# 툴팁 - tooltip1, tooltip2 - 툴팁 관련 추가개발 코드
----------------------------------------------------------------------*/

.tooltip1 {
    position: relative;
}

.tooltip1:hover:after {
    background: #333;
    background: rgba(0, 0, 0, .8);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
    content: attr(data-content);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 500px;
    white-space: pre-wrap;
    word-break: break-all;
    text-align: left;
}

.tooltip1:hover:before {
    border: solid;
    border-color: #333 transparent;
    border-width: 6px 6px 0 6px;
    bottom: 20px;
    content: "";
    left: 50%;
    position: absolute;
    z-index: 99;
}

.tooltip2 {
    position: relative;
}

.tooltip2:hover:after {
    background: #333;
    background: rgba(0, 0, 0, .8);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
    content: attr(data-value) '\A' attr(data-value2);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 100%;
    white-space: pre;
    word-wrap: break-word;
}

.tooltip2:hover:before {
    border: solid;
    border-color: #333 transparent;
    border-width: 6px 6px 0 6px;
    bottom: 20px;
    content: "";
    left: 50%;
    position: absolute;
    z-index: 99;
}

.hide {
    display: none;
}


/*----------------------------------------------------------------------
# 툴팁 기본형
> layout_grid 모델 활용이 가능한 기본형 툴팁으로 향후 사용 (17-12)
----------------------------------------------------------------------*/

.tooltipBasic {
    float: left;
    padding: 14px;
    background: white;
    position: absolute;
    border: 1px solid #bbb;
    border-radius: 3px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
    z-index: 98;
    font-size: 12px;
}

.tooltipBasic .rowGroup>.row {
    margin-bottom: 12px;
}

.tooltipBasic .rowGroup>.row:last-child {
    margin-bottom: 0;
}
/*------------------------------------------------------------------------
[ui_pagination.css]
> 페이지네이션 - 숫자 열거 타입
------------------------------------------------------------------------*/

.pagination ul {
	/*inline-block 레이아웃 모델 사용*/
	font-size: 0;
}

.pagination ul li {
	font-size: 12px;
	display: inline-block;
	vertical-align: middle;
}


/*----------------------
arrowBtn
----------------------*/

.pagination ul li.arrowBtn {
	width: 28px;
	height: 28px;
	border: 1px solid #bbb;
	border-radius: 3px;
	background-color: #fff;
	transition: border-color 0.2s ease-in-out;
}

.pagination ul li.arrowBtn>a {
	display: inline-block;
	width: 100%;
	height: 100%;
	background-color: transparent;
	background-position: center;
	background-repeat: no-repeat;
}

.pagination ul li.arrowBtn:hover {
	border-color: #0059a6;
	transition: border-color 0.2s ease-in-out;
}

.pagination ul li.arrowBtn:hover>a:after {
	border-color: #0059a6;
	transition: border-color 0.2s ease-in-out;
}

.pagination ul li.arrowBtn.disabled,
.pagination ul li.arrowBtn[disabled="disabled"] {
	background-color: #efefef;
	border-color: #bbb;
}

.pagination ul li.arrowBtn.disabled:hover,
.pagination ul li.arrowBtn[disabled="disabled"]:hover {
	opacity: 1;
}

.pagination ul li.arrowBtn.disabled>a,
.pagination ul li.arrowBtn[disabled="disabled"]>a {
	opacity: 0.5;
}

.pagination ul li.arrowBtn.disabled>a:after,
.pagination ul li.arrowBtn[disabled="disabled"]>a:after {
	border-color: #888;
}

.pagination ul li.arrowBtn.prevBtn {
	margin-right: 7px;
}

.pagination ul li.arrowBtn.nextBtn {
	margin-left: 7px;
}

.pagination ul li.arrowBtn>a:after {
	content: "";
    width: 7px;
    height: 7px;
    display: block;
    position: relative;
    top: 9px;
	border-color: #aaa;
	border-style: solid;
	transform: rotate(45deg);
	transition: border-color 0.2s ease-in-out;
}

.pagination ul li.arrowBtn.prevBtn>a:after {
	left: 11px;
	border-width: 0 0 1px 1px;	
}

.pagination ul li.arrowBtn.nextBtn>a:after {
	left: 7px;
	border-width: 1px 1px 0 0;	
}


/*----------------------
페이지네이션 숫자버튼 (numberBtns)
----------------------*/

.pagination ul li.numberBtns li a {
	padding: 3px 8px 3px;
	color: #767676;
}

.pagination ul li.numberBtns li {
	margin-right: 1px;
}

.pagination ul li.numberBtns li:last-of-type {
	margin-right: 0;
}

.pagination ul li.numberBtns li.active a {
	background: #0059a6;
	border-radius: 3px;
	color: #fff;
	/* background: #505050; */
}

.pagination ul li.numberBtns li.active a:hover {
	color: #fff;
}

.pagination ul li.numberBtns li a:hover {
	color: #0059a6;
	text-decoration: underline;
}

.lang-ja .pagination ul li.numberBtns li a {
	/*일본어 버전 디테일링*/
	position: relative;
	bottom: 2px;
}


/*----------------------
페이지 정보 + 페이지 검색
----------------------*/

.pagination ul li.pageInfo {
	margin-left: 10px;
	font-size: 11px;
}

.pagination ul li.pageInfo .pages {
	color: #767676;
	cursor: pointer;
	margin-bottom: 2px;
}

.pagination ul li.pageInfo .pages:hover {
	color: #0059a6;
}

.pagination ul li.pageInfo .items {
	color: #999;
	text-align: left;
}


/*----------------------
페이지네이션 위치
----------------------*/

.con_table .pagination {
	float: left;
	margin-left: 16px;
}


/*----------------------
페이지네이션 검색바
----------------------*/

.pagination .searchBar {
	background: #fff;
	padding: 10px;
	position: absolute;
	margin-top: 6px;
	border: 1px solid #bbb;
	border-radius: 3px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
	z-index: 51;
}

.pagination .searchBar .headline {
	margin-bottom: 8px;
}


/*--------------------
페이지네이션 점프투페이지 삼각형 버튼
--------------------*/

.pagination li.pageInfo .pages.addArrowDownBtn:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #999;
    background: transparent;
    display: inline-block;
    margin-left: 6px;
    position: relative;
    bottom: 2px;
}

.pagination li.pageInfo .pages.addArrowDownBtn:hover:after {
	border-top-color: #0059a6;
}


/*----------------------
[옵션클래스] 크기 조절 (pagination-sm)
----------------------*/

.pagination.pagination-sm ul li {
	font-size: 11px;
}

.pagination.pagination-sm ul li.arrowBtn {
	width: 20px;
	height: 20px;
}

.pagination.pagination-sm ul li.numberBtns {
	position: relative;
	bottom: 1px;
}

.pagination.pagination-sm ul li.numberBtns li a {
	padding: 1px 3px;
}

.pagination.pagination-sm ul li.numberBtns li {
	margin-right: 4px;
}

.pagination.pagination-sm ul li.numberBtns li:last-of-type {
	margin-right: 0;
}

.pagination.pagination-sm li.pageInfo {
	font-size: 10px;
	line-height: 1;
}

.pagination.pagination-sm .searchBar {
	font-size: 10px;
	text-align: left;
}

.pagination.pagination-sm .searchBar button {
	font-size: 10px;
}

.pagination.pagination-sm ul li>a:after {
	top: 6px;
	width: 5px;
	height: 5px;
}

.pagination.pagination-sm ul li.prevBtn>a:after {
	left: 8px;
	border-width: 0 0 1px 1px;
}

.pagination.pagination-sm ul li.nextBtn>a:after {
	left: 5px;
	border-width: 1px 1px 0 0;	
}

.pagination.pagination-sm li.pageInfo .pages.addArrowDownBtn:after {
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
	margin-left: 5px;
}


/*--------------------
상세테이블 내 위치
--------------------*/

.rowDetailpagination {
	/*위치 및 박스모델*/
	padding-top: 12px;
	padding-bottom: 18px;
} 

.rowDetailpagination .pagination.pagination-sm ul li.numberBtns li a {
	color: #767676;
	padding: 1px 7px 2px;
	position: relative;
	top: 0px;
}

.rowDetailpagination .pagination.pagination-sm ul li.numberBtns li a:hover {
	color: #0059a6;
}

.rowDetailpagination .pagination.pagination-sm ul li.numberBtns li.active a {
	color: #fff;
}

/*----------------------------------------------------------------------------------------
[ui_divider.css]
> Divider
----------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------
디바이더(가로) - horzDivider
------------------------------------------------------------------*/

div.horzDivider {
	display: block;
	height: 1px;
	width: 100%;
	background-color: #ddd;
	margin: 18px auto 20px;
}

div.horzDivider.horzDivider-trans {
	/* 투명 디바이더 */
	background-color: transparent;
}


/*------------------------------------------------------------------
디바이더(세로) - vertDivider
------------------------------------------------------------------*/

div.vertDivider {
	float: left;
	width: 1px;
	height: 100%;
	background-color: #ddd;
	margin: 0 8px;
	position: relative;
}

div.vertDivider-custom01 {
	height: 160px ;
    right: 18px;
    top: 6px;
}

.vertDivider {
	/* 매체별 차단설정 임시 */
	height: 200px;
}


/*------------------------------------------------------------------
디바이더(세로) - 타입02 - verticalDivider
------------------------------------------------------------------*/

.verticalDivider {
    display: inline-block;
    width: 1px;
    border-width: 0 0 0 1px;
    border-style: solid;
    border-color: #bbb;
    margin-right: 20px;
}

.verticalDivider-dashed {
    border-style: dashed;
}

.verticalDivider-50 {
	height: 50px;
}/*------------------------------------------------------------------------
[ui_orgChart.css]
- 내용 : 조직도 UI모듈 스타일 정의
------------------------------------------------------------------------*/

/*------------------------------------------------------------
조직도 설정 페이지 공통 요소
------------------------------------------------------------*/

.table_content.org_chart_table .text_left {
    text-align: left;
}

.table_content.org_chart_table .padding_side_zero {
    padding-left: 0;
    padding-right: 0;
}

.table_content.org_chart_table .padding_verti_zero {
    padding-top: 0;
    padding-bottom: 0;
}

.table_content.org_chart_table .float_left {
    float: left;
}


/*------------------------------------------------------------
 텍스트 부분
 ------------------------------------------------------------*/

.table_content.org_chart_table .org_chart_main_section .text_wrap {
    position: relative;
    top: 12px;
}


/*------------------------------------------------------------
아이콘 영역
------------------------------------------------------------*/

.table_content.org_chart_table .org_chart_main_section .text_wrap .icn_text_head {
    width: 16px;
    height: 16px;
    margin-right: 4px;
}


/*------------------------------------------------------------
부서 이름 / 사용자 이름 부분
------------------------------------------------------------*/


/*----------------------------------------
+, - 버튼
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section .treechart_right {
    display: block;
    width: 9px;
    height: 38px;
    margin-right: 8px;
}


/*----------------------------------------
+, - 버튼 바로 왼쪽
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section .treechart_left {
    display: block;
    width: 21px;
    height: 38px;
    ;
}


/*----------------------------------------
가로선
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section .treechart_hori {
    display: block;
    width: 21px;
    height: 38px;
}


/*----------------------------------------
세로선
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section .treechart_vert {
    display: block;
    width: 21px;
    height: 38px;
}


/*----------------------------------------
여백
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section .treechart_margin {
    display: block;
    width: 21px;
    height: 38px;
}


/*------------------------------------------------------------
레벨 종류에 따른 스타일 변경 (클래스명 : level_group, level_company, level_user)
------------------------------------------------------------*/


/*----------------------------------------
항목이 회사 레벨일 때
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section.level_company .text_wrap .icn_text_head {
    background: url('/res/images/org_chart/icn_orgchart_company.png') no-repeat;
}

.table_content.org_chart_table .org_chart_main_section.level_company .text_wrap span {
    color: #0059a6;
    font-weight: bold;
}


/*----------------------------------------
항목이 부서 레벨일 때
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section.level_group .text_wrap .icn_text_head {
    background: url('/res/images/org_chart/icn_orgchart_group.png') no-repeat;
}

.table_content.org_chart_table .org_chart_main_section.level_group .text_wrap span {
    color: #0059a6;
    font-weight: bold;
}


/*----------------------------------------
항목이 사용자 레벨일 때
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section.level_user .text_wrap .icn_text_head {
    background: url('/res/images/org_chart/icn_orgchart_user.png') no-repeat;
}

.table_content.org_chart_table .org_chart_main_section.level_user .text_wrap span {
    color: #505050;
    font-weight: normal;
}

.table_content.org_chart_table .org_chart_main_section.level_user .treechart_right {
    background: url('/res/images/org_chart/icn_orgchart_tree_right_user.png') 0 1px no-repeat !important;
}


/*----------------------------------------
예외 상황 : 하위 항목이 더 없는 부서일 때 (status_empty)
----------------------------------------*/

.table_content.org_chart_table .org_chart_main_section.status_empty .treechart_right {
    background: url('/res/images/org_chart/icn_orgchart_tree_right_empty.png') 0 1px no-repeat !important;
}


/*------------------------------------------------------------
레벨 단계에 따른 스타일 변경
------------------------------------------------------------*/

.table_content.org_chart_table .org_chart_main_section.status_off .treechart_right {
    background: url('/res/images/org_chart/icn_orgchart_tree_right_off.png') 0 1px no-repeat;
}

.table_content.org_chart_table .org_chart_main_section.status_on .treechart_right {
    background: url('/res/images/org_chart/icn_orgchart_tree_right_on.png') 0 1px no-repeat;
}

.table_content.org_chart_table .org_chart_main_section.pos_last .treechart_left {
    background: url('/res/images/org_chart/icn_orgchart_tree_line_last.png') repeat;
}

.table_content.org_chart_table .org_chart_main_section.pos_middle .treechart_left {
    background: url('/res/images/org_chart/icn_orgchart_tree_line_inter.png') no-repeat;
}

.table_content.org_chart_table .org_chart_main_section.pos_last .treechart_vert {
    background: url('/res/images/org_chart/icn_orgchart_tree_line_vert_middle.png') no-repeat;
}

.table_content.org_chart_table .org_chart_main_section.pos_middle .treechart_vert {
    background: url('/res/images/org_chart/icn_orgchart_tree_line_vert_middle.png') no-repeat;
}


/*------------------------------------------------------------
조직도 테이블 부분 경계선 색상 조정
------------------------------------------------------------*/

.layout_card[name="organization"] .area_content .org_chart_table>table>tbody>tr>td {
    border-bottom: 1px solid #efefef;
}/*------------------------------------------------------------------------
[ui_textEditor.css]
> UI Style for Text Editor
------------------------------------------------------------------------*/


/*------------------------------------------------------------
Text Editor - Margin
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 {
	padding: 0 18px 0 18px;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .common_content {
	margin-bottom: 0;
	padding-bottom: 0;
	padding-top: 0;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .cont_sec_body .col_one.type01 .cont_wrapper.type01 {
	margin-bottom: 0;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle {
	padding-bottom: 4px !important;
	border-bottom: 1px solid #bbb !important;
}


/*------------------------------------------------------------
Text Editor - Name
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .cont_sec_body:first-child .col_one.type01 .ctrl_label {
	top: 4px;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .cont_sec_body:first-child .col_one.type01 {
	margin-bottom: 14px;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .cont_sec_body:first-child .col_one.type01 .cont_wrapper.type01 {
	width: 800px;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .cont_sec_body:first-child .col_one.type01 .cont_wrapper.type01 input {
	border-radius: 4px;
	outline: 0;
	height: 28px;
	padding: 0px 10px 0px 10px;
}


/*------------------------------------------------------------
Text Editor - Time Picker
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .cont_sec_body .col_one.type01 .module_time>input {
	cursor: pointer;
	border-radius: 4px;
	width: auto !important;
	padding-left: 10px;
	padding-right: 10px;
	outline: 0;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .cont_sec_body .col_one.type01 .module_time>input:hover {
	color: #333;
}


/*------------------------------------------------------------
Text Editor - Button
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .col_one.type01 button {
	padding: 4px;
	border: 1px solid #bbb;
	border-radius: 3px;
	min-width: 24px;
}

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .col_one.type01 button:hover {
	opacity: 0.8;
}


/*------------------------------------------------------------
Text Editor - Dropdown
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor .set_layer_popup_middle .layout_card .area_content .common_content .cont_sec01 .list_select.WYSIWYG_SIZE {
	top: -2px !important;
	left: 0 !important;
	margin-right: 25px;
	margin-bottom: 14px;
}


/*------------------------------------------------------------
Text Editor - Justify Button - Hide
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor #justifyFull {
	display: none;
}

.set_layer_popup.ow_wysiwygEditor #wysiwyg {
	border: 1px solid #bbb;
	height: 320px !important;
	border-radius: 4px;
}


/*------------------------------------------------------------
Button - Style - Fix
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor>ul.content_wrapper>li.set_layer_popup_bottom {
	border: 0;
}


/*------------------------------------------------------------
Text Editor - Image - Upload
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor #image_list {
	left: 220px !important;
	border-radius: 4px;
	border-color: #bbb !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
	font-size: 13px;
	overflow: hidden;
}

.set_layer_popup.ow_wysiwygEditor #image_list>div:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border-bottom: 1px solid #bbb;
	padding: 7px 7px 8px !important;
}

.set_layer_popup.ow_wysiwygEditor #image_list button {
	padding: 7px 12px !important;
	border: 1px solid #bbb;
	background: #fff !important;
	border-radius: 4px;
	border-bottom-width: 2px;
}

.set_layer_popup.ow_wysiwygEditor #image_list button:hover {
	opacity: 0.8;
}

.set_layer_popup.ow_wysiwygEditor #image_list button>i {
	font-size: 12px !important;
	position: relative;
	bottom: 1px;
}

.set_layer_popup.ow_wysiwygEditor #image_list button>i:before {
	font-size: 15px !important;
	margin-right: 6px;
	position: relative;
	top: 1px;
}


/*------------------------------------------------------------
Text Editor - Image - Upload - Link
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor #image_list div.url {
	padding: 10px;
}

.set_layer_popup.ow_wysiwygEditor #image_list div.url input {
	height: 30px;
	margin-right: 8px;
	border-radius: 4px;
	font-size: 12px;
	padding-left: 10px;
	padding-right: 10px;
}


/*------------------------------------------------------------
Text Editor - Image - Upload - Upload
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor #image_list div.upload {
	padding: 10px;
}

.set_layer_popup.ow_wysiwygEditor #image_list div.upload input+label {
	padding: 10px 14px;
}


/*------------------------------------------------------------
Text Editor - Image - Find
------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor #image_list div.browser {
	padding-top: 10px !important;
}

.set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images img:hover {
	opacity: 0.8;
}

.set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i {
	cursor: pointer;
	margin-top: 8px;
	margin-right: 10px;
	width: 20px;
	height: 20px;
	font-size: 10px;
	background: #0059a6;
	padding: 5px 4px 4px 5px;
	color: #fff;
	border-radius: 3px;
	font-weight: normal;
}

.set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i:hover:before {
	opacity: 0.8;
}


/*--------------------------------------------------
Image - File Attachment - Tooltip
--------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i:hover:after {
	content: "";
	display: block;
	position: absolute;
	width: 48px;
	padding: 6px 4px;
	margin-top: 10px;
	background: #000;
	color: #fff;
	left: -19px;
	border-radius: 4px;
	text-align: center;
	line-height: 1.3;
	opacity: 0.75;
}

.set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i.fa-plus:hover:after {
	content: "바로 넣기";
}

.lang-en .set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i.fa-plus:hover:after {
	content: "Insert";
}

.lang-ja .set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i.fa-plus:hover:after {
	content: "付け";
}

.set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i.fa-minus:hover:after {
	content: "서버에서 제거하기";
}

.lang-en .set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i.fa-minus:hover:after {
	content: "Remove from Server";
}

.lang-ja .set_layer_popup.ow_wysiwygEditor #image_list div.browser div.browser_images i.fa-minus:hover:after {
	content: "サーバーから削除";
}


/*------------------------------------------------------------------------
Text Editor - English - Size Fix
------------------------------------------------------------------------*/

.set_layer_popup.ow_wysiwygEditor .list_select.module_time>a {
	width: 130px !important;
}

.set_layer_popup.ow_wysiwygEditor .area_content .common_content .cont_sec .col-7-10 {
	padding-right: 0;
}

.set_layer_popup.ow_wysiwygEditor .area_content .common_content .cont_sec .col-7-10 span.ctrl_label {
	margin-right: 0;
}

.set_layer_popup.ow_wysiwygEditor .layout_card .area_content .common_content .cont_sec .col_one.type01>span.ctrl_label,
.set_layer_popup.ow_wysiwygEditor .area_content .common_content .cont_sec span.ctrl_label.type02_w80 {
	width: 70px !important;
}

.set_layer_popup.ow_wysiwygEditor .area_content .common_content .cont_sec .row .col.col-2-10 {
	margin-right: 0 !important;
}

.set_layer_popup.ow_wysiwygEditor .area_content .common_content .cont_sec .row .col.col-2-10 .list_select,
.set_layer_popup.ow_wysiwygEditor .area_content .common_content .cont_sec .row .col.col-2-10 .list_select>a {
	width: 100% !important;
}


/*------------------------------------------------------------------
# WYSIWYG
------------------------------------------------------------------*/

#wysiwyg {
	overflow-x: hidden;
	overflow-y: scroll;
	font-size: 13px;
	letter-spacing: 1.5px;
	white-space: normal;
	word-break: break-all;
	float: left;
}

#wysiwyg ol {
	list-style-type: decimal;
	padding-left: 30px;
}

#wysiwyg ul {
	list-style-type: initial;
	padding-left: 30px;
}

#wysiwyg li {
	list-style: inherit;
}

#wysiwyg blockquote {
	margin-left: 30px;
}

#imgController {
	display: none;
	padding: 2px 2px 2px 2px;
	background-color: #f5f5f5;
	position: absolute;
	z-index: 4000
}

#image_list {
	z-index: 4000;
	position: absolute;
	width: 500px;
	height: auto;
	background-color: white;
	top: 115px;
	display: none;
	border: 1px solid;
}

#tint_list {
	z-index: 4000;
	position: absolute;
	background-color: gray;
	top: 115px;
	display: none;
	border: 1px solid;
	min-width: 50px;
	line-height: 15px;
}

#fontSize_list {
	z-index: 4000;
	position: absolute;
	background-color: #f5f5f5;
	top: 115px;
	display: none;
	border: 1px solid #dddddd;
	min-width: 50px;
	line-height: 15px;
}
/*--------------------------------------------------------------------------------
[page_login.css]
> 로그인 및 무료체험 페이지
> wrapper_login_ok, wrapper_login_ks, wrapper_login_ps
> wrapper_login_ok를 기본 클래스로 활용한다.
> PS 페이지에만 wrapper_login_ps를 제한적으로 사용한다.
--------------------------------------------------------------------------------*/

/*------------------------------------------------------------
header_topbar
------------------------------------------------------------*/

.wrapper_login_ok .header_topbar,
.wrapper_login_s1ps .header_topbar {
	width: 920px;
}

.wrapper_login_ok .header_topbar h1.logo_s1ps,
.wrapper_login_s1ps .header_topbar h1.logo_s1ps {
	padding-left: 0;
}

.wrapper_login_ok .header_topbar h1.logo_ok,
.wrapper_login_s1ps .header_topbar h1.logo_ok {
	padding-left: 4px;
	position: relative;
	bottom: 2px;
}

.wrapper_login_ok .header_topbar h1.logo_ok a {
	/* OfficeKeeper Logo */
	background: url(/res/images/js/h1_logo_ok_withSubtitle_emboss.png) no-repeat;
	width: 324px;
}

.schb .wrapper_login_ok .header_topbar h1.logo_ok a {
	/* SecuHub Logo */
	background: url(/res/images/common_topBar_logo/h1_logo_schb.png) no-repeat;
	width: 224px;
}

.Exosphere .wrapper_login_ok .header_topbar h1.logo_ok a {
	/* Exosphere Logo */
	background: url(/res/images/common_topBar_logo/h1_logo_exspep.png) no-repeat;
	width: 336px;
	top: 3px;
}

.wrapper_login_ok .header,
.wrapper_login_s1ps .header {
	/* Login Page - Fixed Width Problem - Fix */
	min-width: 0;
}


/*------------------------------------------------------------
menu_login
------------------------------------------------------------*/

.wrap_menu_login {
	width: 100%;
	height: 106px;
	border-bottom: 1px solid #ddd;
}

.menu_login {
	width: 920px;
	margin: 0 auto;
	height: 106px;
}

.menu_login ul.area_leftmenu {
	float: left;
	padding-top: 16px;
}

.menu_login ul.area_leftmenu li {
	float: left;
	display: table;
	padding-right: 42px;
}

.menu_login ul.area_leftmenu li a {
	display: table-cell;
	overflow: hidden;
	margin-right: 42px;
	text-align: center;
}

.menu_login ul.area_leftmenu li a:hover span.text {
	text-decoration: underline;
}

.menu_login ul.area_leftmenu li a span.text {
	display: block;
	font-size: 16px;
	line-height: 16px;
	color: #767676;
	padding: 4px 0 3px;
}

.menu_login ul.area_leftmenu li a.on span.text {
	font-weight: bold;
	color: #0c51a1;
}


/*------------------------------------------------------------
KaitsKeeper
------------------------------------------------------------*/

.wrapper_login_ks .menu_login ul.area_leftmenu li a span.icon {
	display: block;
	overflow: hidden;
	width: 52px;
	height: 50px;
	margin: 0 auto;
	background: url(/res/images/login/icon_loginmenu_ks.png) no-repeat;
}

.wrapper_login_ks .menu_login ul.area_leftmenu li.menu01 a span.icon {
	background-position: 0 0;
}

.wrapper_login_ks .menu_login ul.area_leftmenu li.menu02 a span.icon {
	background-position: 0 -50px;
}

.menu_login ul.area_rightmenu {
	float: right;
	height: 78px;
}

.menu_login ul.area_rightmenu li {
	float: left;
	padding: 13px 0 0 8px;
}

.menu_login ul.area_rightmenu li a {
	position: relative;
	display: inline-block;
	width: 180px;
	height: 78px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-top: 1px solid #bbb;
	border-bottom: 2px solid #bbb;
	background: url(/res/images/common/icon_btn_medium_arrowright_gray.png) no-repeat 155px 39px;
}

.menu_login ul.area_rightmenu li a:hover {
	background-color: #f6f6f6;
}

.menu_login ul.area_rightmenu li a span.text_top {
	font-size: 15px;
	line-height: 15px;
	color: #333;
	position: absolute;
	top: 18px;
	left: 12px;
}

.menu_login ul.area_rightmenu li a span.text_menutitle {
	display: block;
	font-size: 19px;
	line-height: 19px;
	color: #0c51a1;
	position: absolute;
	top: 39px;
	left: 12px;
	font-weight: bold;
}


/*------------------------------------------------------------
container_login
------------------------------------------------------------*/

.container_login {
	width: 100%;
	background: #ececec;
	padding-bottom: 80px;
}

.contents_login {
	width: 920px;
	min-height: 550px;
	margin: 0 auto;
}

.contents_login .area_title_login {
	float: left;
	margin-top: 72px;
}

.contents_login .area_title_login span.title_sub {
	display: block;
	font-size: 20px;
	line-height: 28px;
	color: #444;
	padding-top: 40px;
	max-width: 430px;
}



/*------------------------------------------------------------
container_login_s1ps
> 로그인창 입력창 옆 타이틀표시영역
------------------------------------------------------------*/

html[lang='ko'] .wrapper_login_s1ps .contents_login .area_title_login .title_page {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	margin-top: 18px;
	width: 283px;
	height: 116px;
	background: url(/res/textimages/kopstitle_login_s1ps.png) no-repeat;
}

html[lang='en'] .wrapper_login_s1ps .contents_login .area_title_login .title_page {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	margin-top: 18px;
	width: 283px;
	height: 116px;
	background: url(/res/textimages/enpstitle_login_s1ps.png) no-repeat;
}

html[lang='ja'] .wrapper_login_s1ps .contents_login .area_title_login .title_page {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	margin-top: 18px;
	width: 283px;
	height: 116px;
	background: url(/res/textimages/japstitle_login_s1ps.png) no-repeat;
}

.contents_login .area_title_login .title_prods {
	/* 제품 표시 영역 */
	display: none;
}


/*------------------------------------------------------------------
container_login_officekeeper
> 로그인창 입력창 옆 타이틀표시영역 (오피스키퍼)
------------------------------------------------------------------*/

.wrapper_login_ok .contents_login .area_title_login {
	margin-left: 20px;
}

.wrapper_login_ok .contents_login .area_title_login span.title_sub {
	padding-top: 14px;
	margin-left: 6px;
	visibility: hidden;
	height: 42px;
	overflow: hidden;
}

.wrapper_login_ok .contents_login .area_title_login .title_page {
	display: block;
	margin-top: 88px;
	width: 340px;
	font-size: 54px;
	line-height: 1.2;
	color: #0059a6;
}

.wrapper_login_ok .contents_login .area_title_login .title_prods {
	/* 제품 표시 영역 */
	display: block;
	background: url("/res/images/login/imgLogo-owLogin-sprite.png") no-repeat;
	width: 100%;
	height: 100px;
	margin-top: 6px;
	margin-left: -6px;
}

.wrapper_login_ok .contents_login .area_title_login .title_page>span {
	font-weight: bold;
	display: block;
}


/*------------------------------------------------------------------
container_login_kaitskeeper
------------------------------------------------------------------*/

html[lang='ko'] .wrapper_login_ks .contents_login .area_title_login .title_page {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	margin-top: 18px;
	width: 283px;
	height: 116px;
	background: url(/res/textimages/kopstitle_login_ks.png) no-repeat;
}

html[lang='en'] .wrapper_login_ks .contents_login .area_title_login .title_page {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	margin-top: 18px;
	width: 283px;
	height: 116px;
	background: url(/res/textimages/enpstitle_login_ks.png) no-repeat;
}

html[lang='ja'] .wrapper_login_ks .contents_login .area_title_login .title_page {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	margin-top: 18px;
	width: 283px;
	height: 116px;
	background: url(/res/textimages/japstitle_login_ks.png) no-repeat;
}

.contents_login .area_form_login {
	float: right;
	margin-top: 72px;
	width: 462px;
	height: 335px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-top: 1px solid #bbb;
	border-bottom: 2px solid #bbb;
	background: #fff;
	/* height: 315px; */
}


/*------------------------------------------------------------
S1 Skin
------------------------------------------------------------*/

.wrapper_login_s1ps .menu_login ul.area_leftmenu li a span.icon {
	display: block;
	overflow: hidden;
	width: 52px;
	height: 50px;
	margin: 0 auto;
	background: url(/res/images/login/icon_loginmenu_s1ps.png) no-repeat;
}

.wrapper_login_s1ps .menu_login ul.area_leftmenu li.menu01 a span.icon {
	background-position: 0 0;
}

.wrapper_login_s1ps .menu_login ul.area_leftmenu li.menu02 a span.icon {
	background-position: 0 -50px;
}

.wrapper_login_s1ps .menu_login ul.area_leftmenu li.menu03 a span.icon {
	background-position: 0 -100px;
}

.wrapper_login_ok .menu_login ul.area_leftmenu li a span.icon {
	display: block;
	overflow: hidden;
	width: 52px;
	height: 50px;
	margin: 0 auto;
	background: url(/res/images/login/icon_loginmenu_ok.png) no-repeat;
}

.wrapper_login_ok .menu_login ul.area_leftmenu li.menu01 a span.icon {
	background-position: 0 0;
}

.wrapper_login_ok .menu_login ul.area_leftmenu li.menu02 a span.icon {
	background-position: 0 -50px;
}

.contents_login .skin_s1ps_login {
	background-image: url(/res/images/ps/bg_loginform_skin.png);
	background-position: right bottom;
	background-repeat: no-repeat;
}

.contents_login .input_user {
	width: 322px;
	margin: 48px auto 0;
}

.contents_login .input_user .textbox_id {
	padding-bottom: 4px;
}

.contents_login .btn_login {
	width: 322px;
	margin: 12px auto 0;
}

.contents_login .btn_login button {
	width: 100%;
}

.btn_login_textBtn {
	font-size: 0;
	margin: 8px auto 0;
	text-align: center;
}

.btn_login_textBtn div {
	display: inline-block;
	font-size: 12px;
	color: #999;
}

.btn_login_textBtn .divider {
	width: 1px;
	height: 12px;
	background: #ccc;
	margin: 0 10px;
	position: relative;
	top: 2px;
}

.area_text_caution {
	width: 322px;
	margin: 32px auto 0;
}

.area_text_caution span.text_caution {
	display: block;
	padding-left: 20px;
	font-size: 13px;
	line-height: 18px;
	color: #666;
	background: url(/res/images/common/icon_textarea_alert_lightGray.png) no-repeat 0 2px;
}


/*------------------------------------------------------------
.area_text_caution
------------------------------------------------------------*/

.area_text_caution {
	width: 390px;
	margin: 2px auto 0;
}

.area_text_caution.itemFirst {
	margin-top: 18px;
}

.area_text_caution span.text_caution {
	font-size: 12px;
	color: #999;
}

.area_customer_info {
	clear: both;
	padding-top: 50px;
}

.area_customer_info ul {
	height: 74px;
}

.area_customer_info ul li {
	width: 456px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	background: #fff;
	height: 74px;
	text-align: center;
}

.area_customer_info ul li .text_title {
	text-align: center;
	padding-top: 18px;
	font-size: 18px;
	line-height: 18px;
}

.area_customer_info ul li span.text_subinfo {
	display: inline-block;
	padding-top: 5px;
	font-size: 13px;
	line-height: 13px;
}

.contents_login_userform {
	width: 920px;
	min-height: 600px;
	margin: 0 auto;
	padding-top: 40px;
}

.contents_login_userform .text_pageinfo {
	font-size: 15px;
	line-height: 15px;
}

.contents_login_userform {
	width: 920px;
	min-height: 600px;
	margin: 0 auto;
	padding-top: 40px;
	padding-bottom: 40px;
}


/*------------------------------------------------------------
관리자 최초등록
------------------------------------------------------------*/

.area_registration .area_content .area_text_terms {
	padding: 20px 20px 0 20px;
}

.area_registration .area_content .area_text_terms h5 {
	font-size: 14px;
	line-height: 14px;

	font-weight: normal;
}

.area_registration .area_content .area_text_terms .wrap_text_scroll_gray {
	margin: 8px 0 0 0;
}

.area_registration .area_content .area_text_terms .wrap_text_scroll_gray .text_terms_w130 {
	height: 130px;
	padding: 10px;
	font-size: 12px;
	line-height: 17px;
	color: #666;
}

.area_registration .area_content .area_text_terms .wrap_text_scroll_gray .text_terms_w80 {
	height: 80px;
	padding: 10px;
	font-size: 12px;
	line-height: 17px;
	color: #666;
}

.area_registration .area_content .area_text_terms .chk_area {
	float: right;
	padding-top: 10px;
	font-size: 12px;
	line-height: 12px;
}

.area_registration .area_content .area_userform_type01 {
	padding: 30px 20px 0 20px;
}

.area_registration .area_content .area_userform_type01 ul {
	width: 700px;
	margin: 0 auto;
}

.area_registration .area_content .area_userform_type01 ul li {
	float: left;
	width: 50%;
	padding: 4px 0;
	height: 50px;
}

.area_registration .area_content .area_userform_type01 ul li label {
	vertical-align: top;
	display: inline-block;
	font-size: 14px;
	line-height: 14px;
	color: #222;
	width: 100px;
	position: relative;
	top: 4px;
}

.area_registration .area_content .area_userform_type01 ul li input[type=text],
.area_registration .area_content .area_userform_type01 ul li input[type=password] {
	width: 200px;
	vertical-align: top;
}

.area_registration .area_content .area_userform_type01 .btn_area {
	text-align: center;
	padding-top: 12px;
	border-top: 1px solid #ddd;
}

.area_registration .area_content .area_userform_type01 .btn_area button.btn_registration {
	width: 200px;
}

.area_registration .area_content .area_userform_type02 {
	padding: 30px 20px 0 20px;
}

.area_registration .area_content .area_userform_type02 ul {
	width: 740px;
	margin: 0 auto;
	padding-bottom: 12px;
}

.area_registration .area_content .area_userform_type02 ul li {
	float: left;
	width: 50%;
	padding: 4px 0;
}

.area_registration .area_content .area_userform_type02 ul li.list_solo {
	width: 100% !important;
}

.area_registration .area_content .area_userform_type02 ul li label {
	display: inline-block;
	font-size: 14px;
	line-height: 14px;
	color: #222;
	width: 157px;
	/* width: 120px; */
}

.area_registration .area_content .area_userform_type02 ul li input[type=text],
.area_registration .area_content .area_userform_type02 ul li input[type=password] {
	width: 200px;
}

.area_registration .area_content .area_userform_type02 ul li.list_solo input[type=text],
.area_registration .area_content .area_userform_type02 ul li.list_solo input[type=password] {
	width: 570px;
}

.area_registration .area_content .wrap_area_userform_scroll {
	position: relative;
	padding-top: 20px;
}

.area_registration .area_content .area_userform_type03 {
	padding: 0 0 0 190px;
	overflow-y: auto;
	overflow-x: hidden;
	max-height: 280px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list {
	width: 600px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li {
	margin: 10px 0;
	height: 25px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li h4 {
	float: left;
	display: inline-block;
	padding-top: 2px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li h4 span.icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(/res/images/common/icon_title_head_user.png) no-repeat;
	vertical-align: middle;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li h4 span.text {
	display: inline-block;
	vertical-align: middle;
	font-size: 15px;
	line-height: 15px;
	margin-left: 2px;
	color: #0059a6;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li .form_info_name {
	float: left;
	display: inline-block;
	padding-left: 15px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li .form_info_name input[type=text] {
	width: 140px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li .form_info_email {
	float: left;
	display: inline-block;
	padding-left: 15px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li .form_info_email input[type=text] {
	width: 200px;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li .form_delete {
	float: left;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li .form_delete a {
	display: inline-block;
	padding: 3px 6px;
	font-size: 16px;
	line-height: 16px;
	color: #505050;
}

.area_registration .area_content .area_userform_type03 ul.user_add_list li .form_delete a:hover {
	color: #505050;
}

.area_registration .area_content .area_userform_type03 .user_form {
	float: left;
	width: 50%;
	padding: 4px 0;
}

.area_registration .area_content .area_userform_type03 ul li.list_solo {
	width: 100% !important;
}

.area_registration .area_content .area_userform_type03 ul li label {
	display: inline-block;
	font-size: 14px;
	line-height: 14px;
	color: #222;
	padding-right: 5px;
}

.area_registration .area_content .area_userform_type04 {
	padding: 30px 20px 0 20px;
}

.area_registration .area_content .area_userform_type04 ul {
	width: 740px;
	margin: 0 auto;
	padding-bottom: 12px;
}

.area_registration .area_content .area_userform_type04 ul li {
	padding: 4px 0;
}

.area_registration .area_content .area_userform_type04 ul li label {
	display: inline-block;
	font-size: 14px;
	line-height: 14px;
	color: #222;
	width: 120px;
}

.area_registration .area_content .area_userform_type04 ul li input[type=text],
.area_registration .area_content .area_userform_type04 ul li input[type=password] {
	width: 200px;
}

.area_registration .area_content .btn_area_addlist {
	height: 48px;
	margin-right: 211px;
	padding: 8px 0;
}

.area_registration .area_content .btn_area_addlist .btn_adduser {
	float: right;
}

.area_registration .area_content .addlist_chk_area {
	padding: 10px;
	margin-right: 200px;
	text-align: right;
}

.area_registration .area_content .addlist_chk_area .chk_area {
	font-size: 12px;
	line-height: 12px;
}

.area_registration .btn_area {
	text-align: center;
	padding-top: 12px;
	border-top: 1px solid #ddd;
	margin-top: 12px;
}

.area_registration .btn_area button.btn_registration {
	width: 200px;
	margin: 0 3px;
}

.area_registration .btn_area_noinfo {
	text-align: center;
	padding: 12px 0 40px;
	border-top: 1px solid #ddd;
	margin-top: 12px;
}


.area_registration .btn_area_noinfo button.btn_registration {
	width: 200px;
	margin: 0 3px;
}

.area_registration .area_content .area_term_info {
	padding-left: 60px;
	background: url(/res/images/login/icon_logininfo_customer.png) no-repeat;
	height: auto;
	margin: 20px 20px 20px 40px;
}

.area_registration .area_content .area_term_info span.text {
	display: block;
	font-size: 13px;
	line-height: 18px;
	padding-top: 5px;
}

.area_registration .area_content .area_term_info span.text span.smalltext {
	width: 5px;
	height: 10px;
	margin: 0 4px;
	display: inline-block;
	background: url(/res/images/common/icon_btn_small_arrowright_blue.png) no-repeat;
	vertical-align: middle;
}

.area_registration .area_content .area_userform_type01 ul {
	width: 880px;
	margin: 0 auto;
}

.area_registration .area_content .area_term_info.custom01 {
	height: auto;
}

.area_registration .area_content .area_term_info.custom01 span.text {
	white-space: pre-line;
	padding-top: 0;
	padding-left: 6px;
}


.area_registration .area_content .area_term_info.custom01 {
	height: auto;
}

.area_registration .area_content .area_term_info.custom01 span.text {
	white-space: pre-line;
	padding-top: 0;
	padding-left: 6px;
} 

.force_wtspace_pre_line {
	white-space: pre-line;
}


/*----------------------------------------
.contents_login_userform
----------------------------------------*/

.contents_login_userform .title_change_pw {
	padding: 35px 0 38px;
	font-size: 36px;
	line-height: 42px;
	color: #0059a6;
	text-align: center;
}

.contents_login_userform ul.list_login_info {
	font-size: 14px;
	line-height: 18px;
	padding-bottom: 38px;
}

.contents_login_userform ul.list_login_info li {
	padding: 0 0 6px 8px;
	background: url(/res/images/common/icon_bullet_blue_3x3.png) no-repeat 0 6px;
}


/*------------------------------------------------------------
footer
------------------------------------------------------------*/

.wrap_footer_login_s1ps {
	width: 100%;
	border-top: 1px solid #ddd;
	height: 165px;
}

.wrap_footer_login_ok {
	width: 100%;
	border-top: 1px solid #ddd;
	height: 140px;
}

.footer_login .area_btn_term_s1ps {
	float: left;
	margin-top: 14px;
}

.wrap_footer_login_s1ps .footer_login {
	width: 920px;
	margin: 0 auto;
	height: 120px;
	padding-top: 25px;
}

.wrap_footer_login_s1ps .footer_login .footer_logo {
	float: left;
	width: 255px;
	height: 21px;
}

body.lang-ko .wrap_footer_login_s1ps .footer_login .footer_logo_s1 {
	overflow: hidden;
	text-indent: -9999px;
	float: left;
	background: url(/res/textimages/kopsimg_loginfooter_s1ps_gray.png) no-repeat;
	width: 82px;
	height: 19px;
}

body.lang-en .wrap_footer_login_s1ps .footer_login .footer_logo_s1 {
	overflow: hidden;
	text-indent: -9999px;
	float: left;
	background: url(/res/textimages/enpsimg_loginfooter_s1ps_gray.png) no-repeat;
	width: 82px;
	height: 19px;
}

body.lang-ja .wrap_footer_login_s1ps .footer_login .footer_logo_s1 {
	overflow: hidden;
	text-indent: -9999px;
	float: left;
	background: url(/res/textimages/japsimg_loginfooter_s1ps_gray.png) no-repeat;
	width: 82px;
	height: 19px;
}

body.lang-ko .wrap_footer_login_s1ps .footer_login .footer_logo_jiran {
	overflow: hidden;
	text-indent: -9999px;
	float: right;
	background: url(/res/textimages/kopsimg_loginfooter_jiransoft_gray.png) no-repeat;
	width: 151px;
	height: 21px;
}

body.lang-en .wrap_footer_login_s1ps .footer_login .footer_logo_jiran {
	overflow: hidden;
	text-indent: -9999px;
	float: right;
	background: url(/res/textimages/enpsimg_loginfooter_jiransoft_gray.png) no-repeat;
	width: 151px;
	height: 21px;
}

body.lang-ja .wrap_footer_login_s1ps .footer_login .footer_logo_jiran {
	overflow: hidden;
	text-indent: -9999px;
	float: right;
	background: url(/res/textimages/japsimg_loginfooter_jiransoft_gray.png) no-repeat;
	width: 151px;
	height: 21px;
}

.wrap_footer_login_s1ps .footer_login .slogan_area {
	float: right;
}

.wrap_footer_login_s1ps .footer_login address {
	clear: both;
	*zoom: 1;
	*line-height: 16px;
}

.wrap_footer_login_s1ps .footer_login address .addrtext_01 {
	font-size: 12px;
	line-height: 16px;
}

.wrap_footer_login_s1ps .footer_login address .text_copyright {
	font-size: 11px;
	line-height: 11px;
	padding-top: 10px;
}


/*----------------------------------------
footer_ok
----------------------------------------*/

.wrap_footer_login_ok .footer_login {
	position: relative;
	width: 920px;
	margin: 0 auto;
	height: 185px;
	padding-top: 30px;
}

.wrap_footer_login_ok .footer_login .footer_logo {
	float: left;
	width: 151px;
	height: 21px;
}

body.lang-ko .wrap_footer_login_ok .footer_login .footer_logo_jiran {
	overflow: hidden;
	text-indent: -9999px;
	float: right;
	background: url(/res/textimages/kojsimg_loginfooter_jiransoft_gray.png) no-repeat;
	width: 151px;
	height: 21px;
}

body.lang-en .wrap_footer_login_ok .footer_login .footer_logo_jiran {
	overflow: hidden;
	text-indent: -9999px;
	float: right;
	background: url(/res/textimages/enjsimg_loginfooter_jiransoft_gray.png) no-repeat;
	width: 151px;
	height: 21px;
}

body.lang-ja .wrap_footer_login_ok .footer_login .footer_logo_jiran {
	overflow: hidden;
	text-indent: -9999px;
	float: right;
	background: url(/res/textimages/jajsimg_loginfooter_jiransoft_gray.png) no-repeat;
	width: 151px;
	height: 21px;
}

.wrap_footer_login_ok .footer_login .footer_logo_kaits {
	overflow: hidden;
	text-indent: -9999px;
	float: right;
	background: url(/res/images/login/img_loginfooter_kaits_gray.jpg) no-repeat;
	width: 151px;
	height: 35px;
}

.wrap_footer_login_ok .footer_login address {
	float: left;
	padding-left: 20px;
}

.wrap_footer_login_ok .footer_login address .addrtext_01 {
	font-size: 12px;
	line-height: 16px;
}

.wrap_footer_login_ok .footer_login address .text_copyright {
	font-size: 11px;
	line-height: 11px;
	padding-top: 10px;
}

.wrap_footer_login_ok .footer_login .footer_award {
	position: absolute;
	top: 70px;
	right: 0;
}

.wrap_footer_login_ok .footer_login .footer_award ul {
	height: 45px;
}

.wrap_footer_login_ok .footer_login .footer_award ul li {
	float: left;
	padding-left: 14px;
}

.wrap_footer_login_ok .footer_login .footer_award ul li span {
	display: inline-block;
	vertical-align: middle;
}

.wrap_footer_login_ok .footer_login .footer_award ul li span.image {
	overflow: hidden;
	text-indent: -9999px;
	width: 46px;
	height: 45px;
}

.wrap_footer_login_ok .footer_login .footer_award ul li.list01 span.image {
	background: url(/res/images/login/img_footerok_mark01.png) no-repeat;
}

.wrap_footer_login_ok .footer_login .footer_award ul li.list02 span.image {
	background: url(/res/images/login/img_footerok_mark02.png) no-repeat;
}

.wrap_footer_login_ok .footer_login .footer_award ul li.list03 span.image {
	background: url(/res/images/login/img_footerok_mark03.png) no-repeat;
}

.wrap_footer_login_ok .footer_login .footer_award ul li span.text {
	font-size: 12px;
	line-height: 16px;
	color: #767676;
	margin-left: 4px;
}


/*------------------------------------------------------------
새윈도우팝업 스타일 정의
------------------------------------------------------------*/

.common_new_window_popup h1,
.common_new_window_popup h2,
.common_new_window_popup h3,
.common_new_window_popup h4,
.common_new_window_popup h5,
.common_new_window_popup h6 {
	line-height: 1;
}

.common_new_window_popup p {
	line-height: 1.5;
}

.common_new_window_popup {
	width: 600px;
	height: 650px;
}

.common_new_window_popup .popup_wrapper .popup_top {
	padding: 34px;
}

.common_new_window_popup .popup_wrapper .popup_top {
	width: 100%;
	height: 80px;
	background: #0059a6;
}

.common_new_window_popup .popup_wrapper .popup_top>h3 {
	font-size: 22px;
	color: #fff;
}

.common_new_window_popup .popup_wrapper .popup_middle {
	padding: 34px;
	overflow-x: hidden;
	overflow-y: auto;
	max-height: 570px;
}

.common_new_window_popup .popup_wrapper .popup_middle>h3 {
	font-size: 22px;
	margin-bottom: 26px;
}


/*----------------------------------------
새윈도우팝업 주요 콘텐츠
----------------------------------------*/

.common_new_window_popup .popup_wrapper .popup_middle .popup_main_cont {
	margin-bottom: 20px;
}

.common_new_window_popup .popup_wrapper .popup_middle .popup_main_cont>p {
	font-size: 14px;
	white-space: pre-line;
	word-break: break-all;
}


/*----------------------------------------
새윈도우팝업 경고 콘텐츠
----------------------------------------*/

.common_new_window_popup .popup_wrapper .popup_middle .popup_caution_cont {
	margin-bottom: 20px;
}

.common_new_window_popup .popup_wrapper .popup_middle .popup_caution_cont>h4 {
	margin-bottom: 8px;
}

.common_new_window_popup .popup_wrapper .popup_middle .popup_caution_cont>p {
	font-size: 14px;
	white-space: pre-line;
	word-break: break-all;
	border: 3px solid #ff6600;
	padding: 20px;
}


/*----------------------------------------
새윈도우팝업 중간경계선
----------------------------------------*/

.common_new_window_popup .popup_wrapper .popup_middle hr {
	padding: 0px;
	margin: 0px 0px 20px;
	height: 1px;
	border-width: 1px 0px 0px;
	border-style: solid none none;
	border-color: rgb(187, 187, 187);
	border-image: none;
}


/*----------------------------------------
새윈도우팝업 버튼 영역
----------------------------------------*/

.common_new_window_popup .popup_wrapper .popup_middle .popup_btn_area {
	margin-bottom: 26px;
}

.common_new_window_popup .popup_wrapper .popup_dont_show_text_btn {
	text-align: right;
}

.common_new_window_popup .popup_wrapper .popup_dont_show_text_btn label {
	font-size: 14px;
	margin-bottom: 26px;
}


/*------------------------------------------------------------
언어 선택 영역
------------------------------------------------------------*/

.s-langSelect {
	margin-top: 16px;
}

.s-langSelect>span {
	float: left;
	margin-right: 10px;
	margin-top: 6px;
}


/*------------------------------------------------------------
Exosphere Skin
------------------------------------------------------------*/

.Exosphere .wrapper_login_ok {
	height: 100%;
	background: #ececec;
}

.Exosphere .wrapper_login_ok .header {
	position: static;
}

.Exosphere .wrapper_login_ok .header .wrap_header_topbar {
	background: #fff;
	box-shadow: none;
	border-color: #bbb;
}

.Exosphere .wrapper_login_ok .wrap_menu_login {
	background: #fff;
	position: relative;
	box-shadow: 0 2px 5px rgba(100, 100, 100, .2);
	border-bottom: 1px solid #bbb;
}

.Exosphere .wrapper_login_ok .contents_login {
	padding-top: 72px;
	min-height: 0;
}

.Exosphere .wrapper_login_ok .contents_login .area_form_login {
	float: none;
	display: block;
	margin: 0 auto 0;
}

.Exosphere .wrapper_login_ok .contents_loginFooter {
	text-align: center;
	margin-top: 16px;
}

.Exosphere .wrapper_login_ok .contents_loginFooter .imgShow-jiransoftLogo-gray {
	display: none;
}

.Exosphere .wrapper_login_ok .contents_loginFooter .cpright {
	font-size: 12px;
	color: #999;
	display: inline-block;
	margin-left: 6px;
	padding-top: 2px;
}

.Exosphere .wrapper_login_ok .contents_login .area_title_login {
	display: none;
}

.Exosphere .wrapper_login_ok .wrap_footer_login_ok {
	display: none;
}

.Exosphere .wrapper_login_ok .contents_login .area_form_login {
	height: auto;
	padding-bottom: 40px;
}

.Exosphere .wrapper_login_ok .area_form_login .pageTitle {
	text-align: center;
	margin: 38px 0 20px;
}

.Exosphere .wrapper_login_ok .area_form_login .pageTitle>div {
	font-weight: bold;
	font-size: 18px;
	display: inline-block;
	color: #0059a6;
}

.Exosphere .wrapper_login_ok .contents_login .input_user {
	margin-top: 0;
}

.Exosphere .wrapper_login_ok .header .wrap_header_topbar:before {
	display: none;
}

.Exosphere .wrapper_login_ok .s-langSelect {
	margin-top: 20px;
}


/*------------------------------------------------------------
무료체험 신청 가이드
------------------------------------------------------------*/

.login_pagination {
	line-height: 1;
	margin-bottom: 24px;
}

.login_pagination .pagination_container {
	width: 100%;
}

.login_pagination .pagination_container>li {
	float: left;
	width: 23.5%;
	margin: 0 0 0 0;
}

.login_pagination .pagination_container>li:last-child {
	margin: 0 0 0 0;
}

.login_pagination .pagination_container>li>a>div.menu {
	padding: 24px 14px;
	text-align: center;
	border-radius: 4px;
	border: 2px solid #bbb;
	color: #767676;
	background: #fff;
}

.login_pagination .pagination_container>li>a:hover>div.menu {
	border: 2px solid #999;
	color: #505050;
}

.login_pagination .pagination_container>li.on>a>div.menu {
	background: rgb(255, 255, 255) none repeat scroll 0% 0%;
	border: 2px solid rgb(0, 89, 166);
	color: #0059a6;
}

.login_pagination .pagination_container>li.on>a:hover>div.menu {
	border: 2px solid #0c51a1;
}

.login_pagination .pagination_container>li>a>div.menu h3 {
	line-height: 1;
}

.login_pagination .pagination_container div.arrow {
	float: left;
	width: 2%;
	display: block;
	text-align: center;
	font-size: 18px;
	position: relative;
	top: 24px;
	text-indent: 2px;
	color: #bbb;
}

.login_pagination {
	line-height: 1;
	margin-bottom: 24px;
}

.login_pagination .pagination_container {
	width: 100%;
}

.login_pagination .pagination_container>li {
	float: left;
	width: 23.5%;
	margin: 0 0 0 0;
}

.login_pagination .pagination_container>li:last-child {
	margin: 0 0 0 0;
}

.login_pagination .pagination_container>li>a>div.menu {
	padding: 24px 14px;
	text-align: center;
	border-radius: 4px;
	border: 2px solid #bbb;
	color: #767676;
	background: #fff;
}

.login_pagination .pagination_container>li>a:hover>div.menu {
	border: 2px solid #999;
	color: #505050;
}

.login_pagination .pagination_container>li.on>a>div.menu {
	background: rgb(255, 255, 255) none repeat scroll 0% 0%;
	border: 2px solid rgb(0, 89, 166);
	color: #0059a6;
}

.login_pagination .pagination_container>li.on>a:hover>div.menu {
	border: 2px solid #0c51a1;
}

.login_pagination .pagination_container>li>a>div.menu h3 {
	line-height: 1;
	font-size: 16px;
	position: relative;
	bottom: 2px;
}

.login_pagination .pagination_container>li>a>div.menu h3 span {
	font-size: 22px;
	position: relative;
	top: 2px;
	margin-right: 6px;
}

.login_pagination .pagination_container div.arrow {
	float: left;
	width: 2%;
	display: block;
	text-align: center;
	font-size: 18px;
	position: relative;
	top: 24px;
	text-indent: 2px;
	color: #bbb;
}

.wrapper_login_ok .menu_login ul.area_leftmenu li.menu_trial_apply_01 a span.icon {
	display: block;
	overflow: hidden;
	width: 52px;
	height: 50px;
	margin: 0 auto;
	background: url(/res/images/login/icn_login_trial_apply_01.png) no-repeat;
	background-position: 0 -4px;
}

.wrapper_login_ok .menu_login ul.area_leftmenu li.menu_trial_apply_02 a span.icon {
	display: block;
	overflow: hidden;
	width: 52px;
	height: 50px;
	margin: 0 auto;
	background: url(/res/images/login/icn_login_trial_apply_02.png) no-repeat;
	background-position: 0 -2px;
}

.wrapper_login_ok .menu_login ul.area_leftmenu li.menu_trial_apply_01 a span.icon {
	display: block;
	overflow: hidden;
	width: 52px;
	height: 50px;
	margin: 0 auto;
	background: url(/res/images/login/icn_login_trial_apply_01.png) no-repeat;
	background-position: 0 -4px;
}

.wrapper_login_ok .menu_login ul.area_leftmenu li.menu_trial_apply_02 a span.icon {
	display: block;
	overflow: hidden;
	width: 52px;
	height: 50px;
	margin: 0 auto;
	background: url(/res/images/login/icn_login_trial_apply_02.png) no-repeat;
	background-position: 0 -2px;
}

.wrapper_login_ok .area_content .head {
	padding: 30px 30px 20px;
}

.wrapper_login_ok .area_content .head h4 {
	line-height: 1;
	font-size: 18px;
	margin-bottom: 12px;
	position: relative;
	bottom: 2px;
}

.wrapper_login_ok .area_content .head h4 span {
	margin-right: 9px;
	font-size: 22px;
	position: relative;
	top: 2px;
}

.wrapper_login_ok .area_content .head p {
	font-size: 14px;
}

.wrapper_login_ok .area_content .body_content {
	padding: 0 30px 14px;
	width: 100%;
	position: relative;
}

.wrapper_login_ok .area_content .body_content .body_content_container {
	width: 100%;
	min-height: 500px;
}

body.lang-ko .wrapper_login_ok .area_content .body_content .body_content_container.type01 {
	background: url('/res/textimages/kojsimg_freetrial_intro01.png') no-repeat;
	background-position: 5px -8px;
	height: 640px;
}

body.lang-en .wrapper_login_ok .area_content .body_content .body_content_container.type01 {
	background: url('/res/textimages/enjsimg_freetrial_intro01.png') no-repeat;
	background-position: 5px -8px;
	height: 640px;
}

body.lang-ja .wrapper_login_ok .area_content .body_content .body_content_container.type01 {
	background: url('/res/textimages/jajsimg_freetrial_intro01.png') no-repeat;
	background-position: 5px -8px;
	height: 640px;
}

body.lang-ko .wrapper_login_ok .area_content .body_content .body_content_container.type02 {
	background: url('/res/textimages/kojsimg_freetrial_intro02.png') no-repeat;
	background-position: 5px -8px;
	height: 640px;
}

body.lang-en .wrapper_login_ok .area_content .body_content .body_content_container.type02 {
	background: url('/res/textimages/enjsimg_freetrial_intro02.png') no-repeat;
	background-position: 5px -8px;
	height: 640px;
}

body.lang-ja .wrapper_login_ok .area_content .body_content .body_content_container.type02 {
	background: url('/res/textimages/jajsimg_freetrial_intro02.png') no-repeat;
	background-position: 5px -8px;
	height: 640px;
}

body.lang-ko .wrapper_login_ok .area_content .body_content .body_content_container.type03 {
	background: url('/res/textimages/kojsimg_freetrial_intro03.png') no-repeat;
	background-position: 4px -8px;
	height: 640px;
}

body.lang-en .wrapper_login_ok .area_content .body_content .body_content_container.type03 {
	background: url('/res/textimages/enjsimg_freetrial_intro03.png') no-repeat;
	background-position: 4px -8px;
	height: 640px;
}

body.lang-ja .wrapper_login_ok .area_content .body_content .body_content_container.type03 {
	background: url('/res/textimages/jajsimg_freetrial_intro03.png') no-repeat;
	background-position: 4px -8px;
	height: 640px;
}

body.lang-ko .wrapper_login_ok .area_content .body_content .body_content_container.type04 {
	background: url('/res/textimages/kojsimg_freetrial_intro04.png') no-repeat;
	background-position: 2px -8px;
	height: 640px;
}

body.lang-en .wrapper_login_ok .area_content .body_content .body_content_container.type04 {
	background: url('/res/textimages/enjsimg_freetrial_intro04.png') no-repeat;
	background-position: 2px -8px;
	height: 640px;
}

body.lang-ja .wrapper_login_ok .area_content .body_content .body_content_container.type04 {
	background: url('/res/textimages/jajsimg_freetrial_intro04.png') no-repeat;
	background-position: 2px -8px;
	height: 640px;
}

.wrapper_login_ok .area_intro .area_content .btn_area {
	padding-bottom: 28px;
	padding-top: 18px;
	margin-top: 12px;
	text-align: center;
	border-top: 1px solid #ddd;
}

.wrapper_login_ok .area_intro .area_content .btn_area a {
	padding: 10px 18px;
}


/*--------------------------------------------
무료 체험 신청 가이드 - 텍스트가이드
--------------------------------------------*/

.freeTrialGuide-textGuide {
	position: absolute;
	top: 0;
	right: 0;
	margin-right: 40px;
}

.Exosphere .freeTrialGuide-textGuide {
	/* 엑소스피어 예외 */
	display: none;
}

.freeTrialGuide-textGuide .step {
	line-height: 1.4;
	padding: 20px 26px 20px 40px;
	border: 1px solid #bbb;
	border-radius: 4px;
	border-bottom: 2px solid #bbb;
	position: relative;
	background: #fff;
	display: block;
	margin-bottom: 10px;
	width: 218px;
}

.freeTrialGuide-textGuide .step:last-child {
	margin-bottom: 0;
}

.freeTrialGuide-textGuide .step span {
	font-weight: bold;
	background: #0059a6;
	color: #fff;
	padding: 6px 10px 4px;
	display: inline-block;
	border-radius: 4px;
	font-size: 16px;
	position: absolute;
	left: 0;
	top: 0;
	margin-left: -8px;
	margin-top: 12px;
}

.freeTrialGuide-textGuide .step h3 {
	font-size: 15px;
	font-weight: bold;
	color: #0059a6;
	display: inline-block;
	line-height: 1.3;
}

.freeTrialGuide-textGuide .step p {
	line-height: 1.4;
	margin-top: 6px;
}



/*------------------------------------------------------------
다국어 대응 - Website Intro - EN & JA
------------------------------------------------------------*/

.lang-en .menu_login ul.area_rightmenu li a,
.lang-ja .menu_login ul.area_rightmenu li a {
	/* 이미지 제거 */
	background-image: none;
}

.lang-ja .menu_login ul.area_rightmenu li a span.text_top {
	/* 일본어 */
	font-size: 13px;
	width: 210px;
}

.lang-ja .menu_login ul.area_rightmenu li.menu03 a {
	/* 일본어 */
	width: 210px;
}

.lang-en .wrapper_login_s1ps .menu_login ul.area_rightmenu li.menu01 a,
.lang-en .wrapper_login_s1ps .menu_login ul.area_rightmenu li.menu02 a,
.lang-ja .wrapper_login_s1ps .menu_login ul.area_rightmenu li.menu02 a {
	/* 영문 & 일문 - S1 */
	width: 210px;
}

.lang-en .wrapper_login_s1ps .menu_login ul.area_rightmenu li a span.text_top {
	/* 영문 - S1 */
	letter-spacing: -1px;
	font-size: 14px;
}/*------------------------------------------------------------------------
[page_commonMenus.css]
- 공통 메뉴 페이지 전용 스타일 정의
------------------------------------------------------------------------*/


/*----------------------------------------
[커스텀]기술지원센터 페이지
----------------------------------------*/

.custom_tech_info_module01>div>div.col_one>div {
	position: relative;
	top: 14px;
}

.custom_tech_info_module01>div.cont_wrapper {
	position: relative;
	bottom: 12px;
}

.layout_card .area_content .common_content .cont_sec .label_img.label_img_call {
	background: url(/res/images/custom/img_tech_info_call.png) center no-repeat;
	background-position: 7px 3px;
	top: 0;
}

.layout_card .area_content .common_content .cont_sec .label_img.label_img_mail {
	background: url(/res/images/custom/img_tech_info_mail.png) center no-repeat;
	background-position: 5px 3px;
	top: 0;
}

.layout_card .area_content .common_content .cont_sec .label_img.label_img_remote {
	background: url(/res/images/custom/img_tech_info_remote.png) center no-repeat;
	background-position: 0px 3px;
	top: 0;
}

.layout_card .area_content .common_content .cont_sec02_w500 {
	/* 기술지원 페이지에서만 쓰임 */
	width: 500px;
	margin: 0 auto;
}

.lang-en .layout_card .area_content .common_content .cont_sec02_w500,
.lang-ja .layout_card .area_content .common_content .cont_sec02_w500 {
	width: 640px;
}


/*----------------------------------------
[커스텀] 원격지원 서비스 페이지 스타일 커스텀 정의
----------------------------------------*/

.custom_tech_info_remote_headtext {
	font-size: 24px;
	position: absolute;
	bottom: 6px;
}

.custom_tech_info_remote_headtext span {
	font-size: 15px;
}

.custom_tech_info_remote_top_bg {
	background: url(/res/images/custom/img_remote_topbg.png) no-repeat;
	background-position: 100% 0;
	height: 80px;
	position: relative;
}


/*----------------------------------------
[커스텀][테이블] 공지사항 설정
----------------------------------------*/

.table_detail_custom_agentnotice .detail_table_subtitle {
	width: 100%;
	color: #6F6F6F;
}

.table_detail_custom_agentnotice .detail_table_subtitle .cont_wrapper {
	width: 90%;
	margin: 0 auto;
	text-align: left;
}

.table_detail_custom_agentnotice .detail_table_subtitle .cont_wrapper h4 {
	font-size: 14px;
	line-height: 1;
}

.table_detail.table_detail_custom_agentnotice .view_data .detaile th {
	text-align: center !important;
}

.table_detail.table_detail_custom_agentnotice .view_data .board_search_area {
	width: 90%;
	margin: 0 auto;
	padding: 0;
}

.table_detail.table_detail_custom_agentnotice .view_data .board_search_area>div {
	position: relative;
	bottom: 2px;
}


/*----------------------------------------
에이전트 배포 관련 스타일 
----------------------------------------*/

.area_content.top_agent_agentdistribute .board_search_area>div {
	position: relative;
	top: 6px;
	left: 6px;
}

.area_content.top_agent_agentdistribute .board_search_area>div button {
	position: relative;
	left: 6px;
}


/*----------------------------------------
[커스텀] 임시 빔리번호 발급 관련 스타일
----------------------------------------*/

.area_content.top_agent_temppassword .board_search_area>div:first-child {
	position: relative;
	top: 6px;
	left: 6px;
}

.area_content.top_agent_temppassword .board_search_area>div:last-child {
	position: relative;
	top: 1px;
	left: 6px;
}


/*----------------------------------------
[커스텀] 알림 메시지 
----------------------------------------*/

.alert_popup.custom_notice_preview .area_notice_preview {
	width: 400px;
	height: auto;
	margin: 0 auto;
	border: 1px solid #bbb;
}

.alert_popup.custom_notice_preview .area_notice_preview .header,
.alert_popup.custom_notice_preview .area_notice_preview .content {
	padding: 12px;
}

.alert_popup.custom_notice_preview .area_notice_preview .header {
	background: #0059a6;
	height: 40px;
}

.alert_popup.custom_notice_preview .area_notice_preview .header h3 {
	line-height: 1;
	color: #fff;
}

.alert_popup.custom_notice_preview .area_notice_preview .content {
	min-height: 400px;
}

.alert_popup.custom_notice_preview ul.content_wrapper li.alert_middle .area_notice_preview .s_main_text {
	padding: 12px;
	min-height: 300px;
}


/*------------------------------------------------------------
[커스텀] 공통메뉴 : 외부연동서비스용 커스텀 레이아웃 01
- 관련 메뉴 : 세콤 동기화
- 관련 View : table22.php
------------------------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_link_module01 {
	border: 1px solid rgb(187, 187, 187);
	padding: 8px 10px;
	border-radius: 4px;
	margin-bottom: 10px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01:last-child {
	margin-bottom: 0;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01>ul {
	width: 96%;
	position: relative;
	top: 2px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01>div {
	/* 제거 버튼 */
	width: 4%;
	position: relative;
	top: 20px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 li {
	width: 31%;
	display: inline-block;
	padding: 6px 4px;
	margin-right: 2%;
	text-align: left;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 li:nth-child(3n) {
	margin-right: 0;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 li input[type="text"] {
	position: relative;
	bottom: 3px;
	left: 6px;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-bottom: 1px solid #bbb;
	background: transparent;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 li input[type="text"]:disabled {
	color: #aaa;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 li>span.ctrl_label.type01_wauto {
	display: inline-block;
	width: 100%;
	margin-bottom: 4px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 li>input[type="text"] {
	display: inline-block;
	left: 0;
}


.layout_card .area_content .common_content .cont_sec .custom_link_module01 li button {
	position: relative;
	left: 8px;
	bottom: 12px;
}


/*------------------------------------------------------------
[커스텀] 공통메뉴 : 외부연동서비스용 커스텀 레이아웃 03
------------------------------------------------------------*/

.layout_card .area_content .common_content .cont_sec .custom_link_module03 {
	border: 1px solid rgb(187, 187, 187);
	padding: 4px 10px;
	border-radius: 5px;
	margin-bottom: 10px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03:last-child {
	margin-bottom: 0;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03>ul {
	width: 96%;
	position: relative;
	top: 0px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03>div {
	width: 4%;
	position: relative;
	top: 7px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03 li {
	width: 100%;
	display: inline-block;
	padding: 2px 4px;
	margin-right: 2%;
	text-align: left;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03 li span {
	font-weight: bold;
	position: relative;
	top: 7px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03 li:nth-child(3n) {
	margin-right: 0;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03 li input[type="text"] {
	top: 0px;
	height: 28px;
	position: relative;
	border-bottom: 1px solid #bbb;
	background: transparent;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03 li input[type="text"].hasDatepicker {
	border-radius: 5px;
	cursor: pointer;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module03 li button {
	position: relative;
	left: 8px;
	bottom: 3px;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 .type_add_circle_gray,
.layout_card .area_content .common_content .cont_sec .custom_link_module02 .type_add_circle_gray,
.layout_card .area_content .common_content .cont_sec .custom_link_module03 .type_add_circle_gray {
	width: 16px;
	height: 16px;
	display: inline-block;
	background: transparent url("/res/images/common/icn_remove_circle_lightgray.png") no-repeat scroll 0% 0%;
	margin-left: 12px !important;
	cursor: pointer;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 .type_add_circle_gray:hover,
.layout_card .area_content .common_content .cont_sec .custom_link_module02 .type_add_circle_gray:hover,
.layout_card .area_content .common_content .cont_sec .custom_link_module03 .type_add_circle_gray:hover {
	background: transparent url("/res/images/common/icn_remove_circle_gray.png") no-repeat scroll 0% 0% !important;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 .type_add_circle_gray[disabled="disabled"],
.layout_card .area_content .common_content .cont_sec .custom_link_module02 .type_add_circle_gray[disabled="disabled"],
.layout_card .area_content .common_content .cont_sec .custom_link_module03 .type_add_circle_gray[disabled="disabled"] {
	background: #ececec url("/res/images/common/icn_remove_circle_lightgray.png") no-repeat scroll 0% 0% !important;
	margin-left: 12px !important;
	cursor: pointer;
	border-radius: 50%;
	cursor: default !important;
}

.layout_card .area_content .common_content .cont_sec .custom_link_module01 .type_add_circle_gray[disabled="disabled"]:hover,
.layout_card .area_content .common_content .cont_sec .custom_link_module02 .type_add_circle_gray[disabled="disabled"]:hover,
.layout_card .area_content .common_content .cont_sec .custom_link_module03 .type_add_circle_gray[disabled="disabled"]:hover {
	background: #ececec url("/res/images/common/icn_remove_circle_lightgray.png") no-repeat scroll 0% 0% !important;
	margin-left: 12px !important;
	cursor: pointer;
	border-radius: 50%;
	cursor: default !important;
}


/*------------------------------------------------------------
[커스텀] 공통메뉴 : 시스템환경설정
------------------------------------------------------------*/

.lang-ja div.layout_card[name="content2"] div[ow_parat="part_1"] div.divide_2[name="use_auth"],
.lang-en div.layout_card[name="content2"] div[ow_parat="part_1"] div.divide_2[name="use_auth"]  {
	/* 일문 + 영문 - 시스템환경설정 */
	width: 50%;
}	

.lang-ja div.layout_card[name="content2"] div[ow_parat="part_2"] .con_table ul.pd_10x0x0x25x+ul div.divide_1,
.lang-en div.layout_card[name="content2"] div[ow_parat="part_2"] .con_table ul.pd_10x0x0x25x+ul div.divide_1 {
	/* 일문 + 영문 - 시스템환경설정 */
	width: 50%;
}/*--------------------------------------------------------------------------------
[page_dashboard.css]
> Dashboard Page - Common
> (!중요) 대시보드 컨텐츠 컨테이너 이름은 반드시 '#grapharea'

# Dashboard - Flexible Layout
# Bar Graph
# Donut Graph
--------------------------------------------------------------------------------*/


/*------------------------------------------------------------
Dashboard - Basic Setting - .con_graph
------------------------------------------------------------*/

.layout_card[name="cfm"] .area_content .con_graph,
.layout_card[name="printout"] .area_content .con_graph {
	padding: 22px 0 0px;
}

.layout_card .area_content .con_graph {
	padding: 22px 0 13px;
}

.layout_card .area_content .con_graph .view_graph {
	padding: 0 16px;
}

.layout_card .area_content .con_graph .view_graph .graph_inner01 {
	padding: 16px 0;
}


/*------------------------------------------------------------
# Dashboard - Flexible Layout
------------------------------------------------------------*/

div[id="#grapharea"] {
	/* 대시보드에는 반드시 '#grapharea' id값 삽입 */
	/* 대시보드의 경우 여백 값을 변경하여 유동적 카드 배치 구성 */
	width: 1004px;
}

div[id="#grapharea"] div[class*="layout_card_2"] {
	float: left;
	margin-right: 16px;
}

div[id="#grapharea"] .layout_card_1solo {
	/* if 1 */
	/* width: 100%; */
	width: 988px;
	float: left;
}

div[id="#grapharea"] div[class*="layout_card_3"] {
	/* if 3 */
	/*width:316px;*/
	width: 318.333px;
	float: left;
	margin-right: 16px;
	margin-left: 0;
}

div[id="#grapharea"] .layout_card .area_head h4 span.text_small_title {
	/* Period - Removal */
	display: none;
}


/*------------------------------------------------------------
# Bar Graph
------------------------------------------------------------*/

.con_graph .view_graph_bar {
	padding: 5px 16px 16px;
}

.con_graph .view_graph_bar .area_title {
	height: 16px;
	margin: 14px 0 1px;
}

.con_graph .view_graph_bar .area_title_notop_margin {
	height: 16px;
	margin: 0 0 1px;
}

.con_graph .view_graph_bar span.text_title {
	float: left;
	display: inline-block;
	margin-bottom: 10px;
	font-size: 12px;
	line-height: 12px;
	font-weight: bold;
}

.con_graph .view_graph_bar span.text_value {
	float: right;
	display: inline-block;
	font-size: 12px;
	line-height: 12px;
}

.graph_type_bar .bg_graph span.graph_g {
	display: block;
	width: 100%;
	height: 12px;
	background: #ddd;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

.graph_type_bar .bg_graph span.bar_g {
	display: block;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

.graph_type_bar .bg_graph span.graph_y {
	display: block;
	width: 100%;
	height: 12px;
	background: #ffba00;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

.graph_type_bar .bg_graph span.bar_y {
	display: block;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

.graph_type_bar .bg_graph span.graph_yg {
	display: block;
	width: 100%;
	height: 12px;
	background: #93c911;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

.graph_type_bar .bg_graph span.bar_yg {
	display: block;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}


/*----------------------------------------
Bar Graph - 2 Columns
----------------------------------------*/

div.layout_card[name="software"] .area_content div.con_graph .info_graph_type01 ul {
	padding-top: 0px;
	padding-bottom: 12px;
}

div.layout_card[name="site"] .area_content div.con_graph .info_graph_type01 ul {
	padding-top: 0px;
	padding-bottom: 12px;
}


/*------------------------------------------------------------
# Progress Bar
------------------------------------------------------------*/

.graph_type_bar .color_blue01 {
	background: #0059a6;
}

.graph_type_bar .color_green01 {
	background: #1f8c13;
}

.graph_type_bar .color_skyblue01 {
	background: #3c9df0;
}

.graph_type_bar .color_yellowgreen01 {
	background: #93c911;
}

.graph_type_bar .color_yellow01 {
	background: #ffba00;
}

.graph_type_bar .color_orange01 {
	background: #ff6600;
}


/*------------------------------------------------------------
# Donut Graph
------------------------------------------------------------*/

.layout_card .area_content .con_graph .view_graph_donut {
	position: relative;
	padding: 0 16px;
}

.con_graph .view_graph_donut .chart_donut {
	width: 150px;
	margin: 0 auto;
}

.con_graph .view_graph_donut .text_chart {
	position: absolute;
	top: 47px;
	left: 132px;
}

.con_graph .view_graph_donut .text_chart .text_value {
	display: block;
	width: 50px;
	font-size: 20px;
	line-height: 20px;
	text-align: center;
	padding: 6px 0;
	border-bottom: 1px solid #bbb;
	font-weight: bold;
}

.con_graph .view_graph_donut .text_chart .text_allvalue {
	display: block;
	width: 50px;
	font-size: 12px;
	line-height: 12px;
	text-align: center;
	padding: 8px 0;
	font-weight: bold;
}


/*----------------------------------------
Donut Graph - People Count 
> No label text for counting people
----------------------------------------*/

.lang-en .layout_card[name="human_websearch"] .con_graph .view_graph_donut .text_chart,
.lang-en .layout_card[name="human_document"] .con_graph .view_graph_donut .text_chart,
.lang-en .layout_card[name="human_jobsite"] .con_graph .view_graph_donut .text_chart {
	top: 42px;
	left: 50%;
    margin-left: -75px;
}

.lang-en .layout_card[name="human_websearch"] .con_graph .view_graph_donut .text_chart .text_value,
.lang-en .layout_card[name="human_document"] .con_graph .view_graph_donut .text_chart .text_value,
.lang-en .layout_card[name="human_jobsite"] .con_graph .view_graph_donut .text_chart .text_value {
	width: 150px;
	border-bottom: 0;
	text-align: center;
}

.lang-en .layout_card[name="human_websearch"] .con_graph .view_graph_donut .text_chart .text_value:before,
.lang-en .layout_card[name="human_document"] .con_graph .view_graph_donut .text_chart .text_value:before,
.lang-en .layout_card[name="human_jobsite"] .con_graph .view_graph_donut .text_chart .text_value:before {	content: "";
	display: inline-block;
    width: 15px;
    height: 15px;
	background: transparent url(/res/images/common_icn/icn_user_orange.png) no-repeat;
	position: relative;
    top: 1px;
    right: 3px;
}	

.lang-en .layout_card[name="human_websearch"] .chart_donut.graph:after,
.lang-en .layout_card[name="human_document"] .chart_donut.graph:after,
.lang-en .layout_card[name="human_jobsite"] .chart_donut.graph:after {
	content: "";
    display: block;
    width: 50px;
    height: 1px;
    background: #ccc;
    position: absolute;
	left: 50%;
	top: 74px;
    margin-left: -25px;
}

.lang-en .layout_card[name="human_websearch"] .con_graph .view_graph_donut .text_chart .text_allvalue,
.lang-en .layout_card[name="human_document"] .con_graph .view_graph_donut .text_chart .text_allvalue,
.lang-en .layout_card[name="human_jobsite"] .con_graph .view_graph_donut .text_chart .text_allvalue {
	width: 150px;
	text-align: center;
}

.lang-en .layout_card[name="human_websearch"] .con_graph .view_graph_donut .text_chart .text_allvalue:before,
.lang-en .layout_card[name="human_document"] .con_graph .view_graph_donut .text_chart .text_allvalue:before,
.lang-en .layout_card[name="human_jobsite"] .con_graph .view_graph_donut .text_chart .text_allvalue:before {
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	background: transparent url(/res/images/common_icn/icn_user_small_gray.png) no-repeat;
	position: relative;
	top: 4px;
	right: 2px;
}


/*----------------------------------------
Donut Graph - Custom - Hardware Asster Management
----------------------------------------*/

.dummy_donut_graph {
	width: 112px;
	height: 112px;
	background: blue;
	border-radius: 90%;
	margin: 12px auto 0;
}

.graph_icn_display {
	width: 64px;
	height: 64px;
	border-radius: 90%;
	position: relative;
	margin: 0 auto;
	top: 24px;
}

.graph_icn_display.icn_pc {
	background: white url(/res/images/common/icn_report_pc.png) center no-repeat;
}

.graph_icn_display.icn_monitor {
	background: white url(/res/images/common/icn_report_monitor.png) center no-repeat;
}


/*--------------------------------------------
Donut Graph - elDonutGraph
--------------------------------------------*/

.elDonutGraph {
	margin-top: 18px;
	margin-bottom: 16px;
}

.elDonutGraph>.col:nth-child(1) {
	margin-left: 18px;
}

.elDonutGraph>.col:nth-child(2) {
	margin-left: 20px;
}

.elDonutGraph .values {
	padding-top: 8px;
}

.elDonutGraph .values>ul>li {
	margin-bottom: 6px;
}

.elDonutGraph .values>ul>li:nth-child(1)>.labelBullet {
	background-color: #0059a6
}

.elDonutGraph .values>ul>li:nth-child(2)>.labelBullet {
	background-color: #3c9df0
}

.elDonutGraph .values>ul>li:nth-child(3)>.labelBullet {
	background-color: #8ec9fc
}

.elDonutGraph .values>ul>li:nth-child(4)>.labelBullet {
	background-color: #c8dc1d
}

.elDonutGraph .values>ul>li:nth-child(5)>.labelBullet {
	background-color: #93c911
}

.elDonutGraph .graphArea-label {
    margin: 0 auto;
    display: block;
    text-align: center;
    color: #0059a6;
    font-weight: bold;
    font-size: 24px;
    position: absolute;
	width: 134px;
	height: 134px;
    overflow: hidden;
    margin-top: 56px;
}

.elDonutGraph .graphArea {
	background-image: url('/res/images/dashboard_printerManage/elDunutGraph_dummy.png');
	background-repeat: no-repeat;
}


/*------------------------------------------------------------
Card - Graph - Single Card (Solo)
------------------------------------------------------------*/

div.layout_card.layout_card_1solo .con_graph .info_graph_type01 ul li {
	/* Single Card */
	width: 50%;
}

div.layout_card.layout_card_1solo .con_graph .info_graph_type01 ul li:nth-child(odd) {
	/* Single Card */
	margin-left: 0;
	margin-right: 0;
	padding-right: 30px;
}

div.layout_card.layout_card_1solo .con_graph .info_graph_type01 ul li:nth-child(even) {
	/* Single Card */
	margin-right: 0; 
	margin-left:0;
	padding-left: 31px;
}


/*------------------------------------------------------------
.info_graph_type01
------------------------------------------------------------*/

.info_graph_type01 ul li.float_left {
	float: left;
}

.info_graph_type01 ul li.float_right {
	float: right;
}

.info_graph_type01 ul li.float_straight {
	float: left;
	margin: 0 19px;
}

.info_graph_type01 ul li span.color_blue01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #0059a6;
}

.info_graph_type01 ul li span.color_green01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #1f8c13;
}

.info_graph_type01 ul li span.color_skyblue01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #3c9df0;
}

.info_graph_type01 ul li span.color_yellowgreen01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #93c911;
}

.info_graph_type01 ul li span.text_title {
	float: left;
	display: inline-block;
	vertical-align: middle;
	margin-left: 4px;
}

.info_graph_type01 ul li span.text_value {
	float: right;
	display: inline-block;
	vertical-align: middle;
}

.info_graph_type01 .area_end {
	padding-top: 26px;
}

.info_graph_type01 .area_end .end_info {
	padding: 0 16px;
	border-top: 1px solid #bbb;
    height: 28px;
    position: absolute;
    width: 100%;
    right: 0;
    bottom: 13px;
}

.info_graph_type01 .area_end .end_info span {
	display: inline-block;
}

.info_graph_type01 .area_end .end_info span.text_title {
	padding-left: 15px;
	margin: 13px 5px 0 0;
	background: url(/res/images/common/icon_contents_allvalue.png) no-repeat 0 3px;
	font-weight: bold;
}

.info_graph_type01 .area_end .end_info span.text_value {
	margin-top: 13px;
	font-weight: bold;
}


/*----------------------------------------
.info_graph_type01 - Style Modification
----------------------------------------*/

.info_graph_type01 ul li span.color_orange00 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #de5900;
}

.info_graph_type01 ul li span.color_orange01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ff6600;
}

.info_graph_type01 ul li span.color_orange02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ff8d41;
}

.info_graph_type01 ul li span.color_orange03 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ffb17d;
}

.info_graph_type01 ul li span.color_orange04 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ffe08c;
}

.info_graph_type01 ul li span.color_orange05 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ffd668;
}

.info_graph_type01 ul li span.color_orange06 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ffba00;
}

.info_graph_type01 ul li span.color_orange07 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ef9d00;
}

.info_graph_type01 ul li span.color_orange07 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ef9d00;
}

.info_graph_type01 ul li span.color_yellow01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ffba00;
}

.info_graph_type01 ul li span.color_yellowgreen02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #93c911;
}

.info_graph_type01 ul li span.color_blue00 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #0a375f;
}

.info_graph_type01 ul li span.color_blue01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #0059a6;
}

.info_graph_type01 ul li span.color_blue02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #3c9df0;
}

.info_graph_type01 ul li span.color_blue03 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #8ec9fc;
}

.info_graph_type01 ul li span.color_yellowgreen00 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #c8dc1d;
}

.info_graph_type01 ul li span.color_yellowgreen01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #93c911;
}

.info_graph_type01 ul li span.color_yellowgreen02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #1f8c13;
}

.info_graph_type01 ul li span.color_yellowgreen03 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #0e620a;
}

.info_graph_type01 ul {
	padding: 16px 22px 16px;
}

.info_graph_type01 ul li {
	padding: 2px 0;
	color: #505050;
	height: 20px;
	width: 100%;
	font-size: 12px;
	line-height: 14px;
}


/*------------------------------------------------------------
.info_graph_type02
------------------------------------------------------------*/

.info_graph_type02 ul {
	padding: 14px 16px 16px;
}

.info_graph_type02 ul.list_no_margin {
	padding: 0;
}

.info_graph_type02 ul li {
	padding: 2px 0;
	color: #505050;
	height: 20px;
	font-size: 12px;
	line-height: 14px;
}

.info_graph_type02 ul li.float_left {
	float: left;
}

.info_graph_type02 ul li.float_right {
	float: right;
}

.info_graph_type02 ul li.float_straight_m25 {
	float: left;
	margin-right: 25px;
}

.info_graph_type02 ul li.float_straight_m10 {
	float: left;
	margin-right: 10px;
}

.info_graph_type02 ul li span.color_blue01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #0059a6;
}

.info_graph_type02 ul li span.color_green01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #1f8c13;
}

.info_graph_type02 ul li span.color_skyblue01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #3c9df0;
}

.info_graph_type02 ul li span.color_yellowgreen01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #93c911;
}

.info_graph_type02 ul li span.color_yellow01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ffba00;
}

.info_graph_type02 ul li span.color_gray01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ddd;
}

.info_graph_type02 ul li span.color_blue02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #5d71ec;
}

.info_graph_type02 ul li span.color_green02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #3aa92e;
}

.info_graph_type02 ul li span.color_orange01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ff6600;
}

.info_graph_type02 ul li span.color_skyblue02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #71d9ff;
}

.info_graph_type02 ul li span.color_yellowgreen02 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ceef15;
}

.info_graph_type02 ul li span.text_title {
	float: left;
	display: inline-block;
	vertical-align: middle;
	margin-left: 4px;
}

.info_graph_type02 ul li span.text_value {
	float: right;
	display: inline-block;
	vertical-align: middle;
}

.info_graph_type02 .area_end {
	border-top: 1px solid #bbb;
}

.info_graph_type02 .area_end .end_info {
	padding: 0 16px;
}

.info_graph_type02 .area_end .width_month01 {
	height: 105px;
}

.info_graph_type02 .area_end .end_info .info_2section {
	width: 50%;
}

.info_graph_type02 .area_end .end_info span {
	display: inline-block;
}

.info_graph_type02 .area_end .end_info span.value_space {
	max-width: 38px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	vertical-align: middle;
}

.info_graph_type02 .area_end .end_info span.text_title {
	margin-top: 13px;
	font-weight: bold;
	padding-right: 5px;
}

.info_graph_type02 .area_end .end_info span.icon_item {
	padding-left: 15px;
	background: url(/res/images/common/icon_contents_allvalue.png) no-repeat 0 3px;
}

.info_graph_type02 .area_end .end_info span.text_minute {
	margin: 13px 20px 0 0;
}


/*------------------------------------------------------------
.info_graph_type03
------------------------------------------------------------*/

.info_graph_type03 ul {
	padding: 14px 0 0;
}

.info_graph_type03 ul.list_no_margin {
	padding: 0;
}

.info_graph_type03 ul li {
	padding: 2px 0;
	color: #505050;
	height: 20px;
	font-size: 12px;
	line-height: 14px;
}

.info_graph_type03 ul li.float_straight_m25 {
	float: left;
	margin-left: 25px;
}

.info_graph_type03 ul li span.text_title {
	margin-left: 4px;
}

.info_graph_type03 ul li span.color_yellowgreen01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #93c911;
}

.info_graph_type03 ul li span.color_yellow01 {
	float: left;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-indent: -9999px;
	width: 12px;
	height: 12px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background: #ffba00;
}

.layout_card .area_content .con_data_list {
	border-bottom: 1px solid #ddd;
}

.con_data_list .wrap_list_data {
	padding: 18px 16px 0 16px;
	min-width: 400px;
}

.con_data_list .wrap_list_data .list_data_title {
	font-size: 13px;
	line-height: 13px;
	margin-left: 6px;
	font-weight: bold;
	color: #0059a6;
}

.con_data_list .wrap_list_data .list_data_contents {
	height: 60px;
}

.con_data_list .wrap_list_data .list_data_contents_notitle {
	height: 60px;
	padding-top: 13px;
}

.con_data_list .wrap_list_data .list_image {
	float: left;
	display: block;
	width: 34px;
	height: 34px;
	text-indent: -9999px;
	overflow: hidden;
	margin: 18px 0 0 20px;
}

.con_data_list .adminsecurity_data01 .list_image {
	background: url(/res/images/dashboard/icon_report_titleicon07.png) no-repeat;
}

.con_data_list .adminsecurity_data02 .list_image {
	background: url(/res/images/dashboard/icon_report_titleicon08.png) no-repeat;
}

.con_data_list .wrap_list_data ul {
	float: left;
}

.con_data_list .wrap_list_data ul.list_data_type01 li {
	float: left;
	padding: 20px 14px;
	min-width: 130px;
	background: url(/res/images/dashboard/bg_bar_listdata.png) no-repeat right 50%;
}

.con_data_list .wrap_list_data ul.list_data_type01 li div.title {
	font-size: 14px;
	line-height: 17px;
	text-align: center;
	color: #222;
}

.con_data_list .wrap_list_data.month_data01 ul.list_data_type01 li div.title {
	/* Monthly Report - Text Modification */
	text-overflow: unset;
	max-width: 210px;
}

.con_data_list .wrap_list_data ul.list_data_type01 li div.text_value {
	padding-top: 6px;
	text-align: center;
}

.con_data_list .wrap_list_data ul.list_data_type01 li div.text_value .value_text {
	display: inline-block;
	font-size: 19px;
	line-height: 21px;
	max-width: 120px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-weight: bold;
	vertical-align: middle;
}

.con_data_list .wrap_list_data ul.list_data_type01 li div.text_value .small_text {
	display: inline-block;
	font-size: 14px;
	line-height: 14px;
	padding-left: 2px;
	vertical-align: middle;
}

.con_data_list .wrap_list_data ul.list_data_type01 li:last-child {
	background: none;
}

.con_data_list .wrap_list_data ul.list_data_type02 {
	padding: 8px 0 20px;
}

.con_data_list .wrap_list_data ul.list_data_type02 li {
	padding: 12px 14px;
}

.con_data_list .wrap_list_data ul.list_data_type02 li div.title {
	float: left;
	font-size: 14px;
	line-height: 17px;
	color: #222;
	vertical-align: middle;
}

.con_data_list .wrap_list_data ul.list_data_type02 li div.text_value {
	float: left;
	font-size: 14px;
	line-height: 17px;
	padding-left: 10px;
	vertical-align: middle;
	font-weight: bold;
}

.con_data_list .wrap_list_data ul.list_data_type02 li:last-child {
	background: none;
}


/*-----------------------------------------------------------------------------
Card - Graph - Security Report
-----------------------------------------------------------------------------*/

.area_double_dashboard{height:865px;}
.area_double_dashboard .con_dashboard_list{padding:20px 0 10px;border-top:1px solid #ddd;}
.area_double_dashboard .con_dashboard_list .view_graph{padding:0 16px;}
.area_double_dashboard .con_dashboard_list .view_graph .main_graph{text-align:center;padding:10px 0;}
.area_double_dashboard .con_dashboard_list .view_graph .list_data_title {
	padding-top: 5px;
	font-size: 13px;
	line-height: 13px;
	margin-left: 6px;
	font-weight: bold;
	color: #0059a6;
}



/*------------------------------------------------------------
Dashboard - Style - Modification - Overriding
------------------------------------------------------------*/


/*----------------------------------------
Icon and Text
----------------------------------------*/

.graph_info_text {
	padding: 0 22px;
	margin-bottom: 6px;
	height: 17px;
	position: relative;
	z-index: 1;
}

.graph_info_text .info_text {
	display: inline;
	color: #aaa;
	font-size: 12px;
	padding-top: 0;
	padding-left: 0;
	position: relative;
    text-indent: unset;
	left: 8px;
	top: 2px;
}

.icn_graph_info {
	float: left;
	background: url(/res/images/common/icn_graph_info.png) no-repeat;
	width: 17px;
	height: 17px;
}


/*----------------------------------------
Style Modification - Dashboard Cards
----------------------------------------*/

.layout_card[name="dataloss"] .area_content .con_graph,
.layout_card[name="dataloss_block"] .area_content .con_graph {
	/* 정보유출방지 & 정보유출 현황 */
	height: 376px;
}

.layout_card[name="site"] .area_content .con_graph {
	/* 웹사이트 접속현황 */
	height: 415px;
	padding: 10px 0 13px;
}

.layout_card[name="software"] .area_content .con_graph {
	padding: 10px 0 13px;
}

.layout_card[name="site_block"] .area_content .con_graph {
	/* 웹사이트 접속 차단현황 */
	height: 384px;
}


.layout_card[name="software"] .area_content .con_graph .info_graph_type01 .info00 {
	/* 차트 일부 항목 숨김 - 소프트웨어 실행현황 */
	display: none;
}

.layout_card.card-dash-statusShow .col.col-2-3 {
	/* 대시보드 카드 : card-dash-statusShow */
	margin-left: -12px;
}

.layout_card.card-dash-prograssBar .area_content>.row {
	/* 대시보드 카드 : card-dash-progressBar */
	height: 176px
}

.layout_card.card-dash-logTable .cardTop-period .labelText-12 {
	/* 대시보드 카드 : card-dash-logTable */
	position: absolute;
    right: 0;
    margin-right: 16px;
	margin-top: 16px;
}

/*------------------------------------------------------------------------
[page_dashboard_bkup.css]
- 내용 : 백업 대시보드 페이지 전용 스타일 정의
------------------------------------------------------------------------*/

.FileBackup .layout_card[name="approval"] .area_content .con_graph,
.FileBackup .layout_card[name="important"] .area_content .con_graph {
     /* 중요파일 백업 현황 */
     height: 376px;
}

/* .FileBackup .layout_card[name="cfm"] .area_content .con_graph {
    민감정보 백업 현황
    height: 389px;
} *//*------------------------------------------------------------------------
[page_dashboard_etcManage.css]
- 기타관리 대시보드 페이지 전용 스타일 정의
------------------------------------------------------------------------*/


.lang-en div[id="#grapharea"] .layout_card[name="human_jobsite"] .area_head h4 .text_title {
    letter-spacing: -1px;
}

.lang-en div[id="#grapharea"] .layout_card[name="human_websearch"] .area_head h4 .text_title {
    letter-spacing: -1px;
}   

.lang-en div[id="#grapharea"] .layout_card[name="human_document"] .area_head h4 .text_title {
    letter-spacing: -1px;
}

.lang-ja.ETC .layout_card[name="human_document"] .area_head h4 .text_title {
    letter-spacing: -1px;
}



/*------------------------------------------------------------------------
[page_monthReport.css]
- 내용 : 월간보고서 페이지 전용 스타일 정의

# 월간 보고서용 아이콘 배치
# 월간 보고서용 스타일 커스텀 - 여러 줄의 통계 표시용
------------------------------------------------------------------------*/


/*--------------------------------------------
# 월간 보고서용 아이콘 배치
--------------------------------------------*/

.con_data_list .month_data01 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon01.png) no-repeat;
}

.con_data_list .month_data02 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon02.png) no-repeat;
}

.con_data_list .month_data03 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon03.png) no-repeat;
}

.con_data_list .month_data04 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon04.png) no-repeat;
}

.con_data_list .month_data05 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon05.png) no-repeat;
}

.con_data_list .month_data06 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon06.png) no-repeat;
}

.con_data_list .month_data07 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon07.png) no-repeat;
}

.con_data_list .month_data08 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon08.png) no-repeat;
}

.con_data_list .month_data09 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon09.png) no-repeat;
}

.con_data_list .month_data10 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon10.png) no-repeat;
}

.con_data_list .month_data11 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon11.png) no-repeat;
}

.con_data_list .month_data12 .list_image {
    background: url(/res/images/dashboard/icon_report_titleicon12.png) no-repeat;
}


/*--------------------------------------------
# 월간 보고서용 스타일 커스텀 - 여러 줄의 통계 표시용
--------------------------------------------*/

.con_data_list.month_data_multirow {
    border-bottom: 0;
}

.con_data_list.month_data_multirow_second .list_image {
    background: transparent;
}

.con_data_list .wrap_list_data ul.list_data_type01.custom01 li:nth-child(4n) {
    background: transparent;
}

.con_data_list .wrap_list_data ul.list_data_type01.custom01 li:nth-child(5n) {
    clear: both;
}

.month_stats .text_sub_title {
    font-size: 12px;
    position: relative;
    bottom: 0px;
    padding-left: 3px;
    color: #aaa;
}
/*------------------------------------------------------------------------
[page_svcIntro.css]
- 서비스 안내 페이지 전용 스타일 정의
------------------------------------------------------------------------*/


/*------------------------------------
style.css에 추가되어야 할 코드
------------------------------------*/

button span.type_moveto {
    display: block;
    padding-left: 20px;
    background: url(/res/images/dlrm/icn_page_moveto.png) no-repeat;
}


/*------------------------------------
문서보안 서비스 안내 페이지 스타일 정의
------------------------------------*/

.area_intro_dlrm .area_head {
    border-bottom: 1px solid #bbb;
    height: auto;
    padding: 24px 0;
    background: url(/res/images/dlrm/bg_dlrm_intro_psdeco.png) center no-repeat;
    background-size: 100%;
}

.OfficeKeeper .area_intro_dlrm .area_head {
    /* 오피스키퍼 - 헤더 - 스타일 제거 */
    background: #e9eff7;
}

.area_intro_dlrm .area_head>h3 {
    line-height: 1.4;
    text-align: center;
    font-size: 16px;
}

.area_intro_dlrm .area_content>.wrapper_content>li {
    width: 50%;
    margin: 0 auto;
}

.area_intro_dlrm .area_content>.wrapper_content li {
    vertical-align: middle;
}

.area_intro_dlrm .area_content>.wrapper_content .s_content {
    display: inline-block;
}

.area_intro_dlrm .area_content>.wrapper_content .section_01 {
    padding: 50px 0 0;
}

.area_intro_dlrm .area_content>.wrapper_content .section_02 {
    padding: 50px 0 50px;
}

.lang-ja .area_intro_dlrm .area_content>.wrapper_content .section_01,
.lang-en .area_intro_dlrm .area_content>.wrapper_content .section_01,
.lang-ja .area_intro_dlrm .area_content>.wrapper_content .section_02,
.lang-en .area_intro_dlrm .area_content>.wrapper_content .section_02 {
    width: 100% !important;
}

.area_intro_dlrm .area_content>.wrapper_content .section_01 .s_content .icn_dlrim_admin {
    width: 42px;
    height: 42px;
    background: url(/res/images/dlrm/icn_dlrm_admin.png) center no-repeat;
    margin-bottom: 4px;
}

.area_intro_dlrm .area_content>.wrapper_content .section_02 .s_content .icn_dlrim_user {
    width: 42px;
    height: 42px;
    background: url(/res/images/dlrm/icn_dlrm_user.png) center no-repeat;
    margin-bottom: 4px;
}

.area_intro_dlrm .area_content>.wrapper_content .s_content.s_left_icn {
    padding: 0 20px 0 40px;
}

.area_intro_dlrm .area_content>.wrapper_content .s_content.s_right_list {
    text-align: left;
    padding-left: 20px;
    border-left: 3px solid rgb(221, 221, 221);
}

.area_intro_dlrm .area_content>.wrapper_content .s_content.s_right_list li {
    margin-bottom: 10px;
}

.area_intro_dlrm .area_content>.wrapper_content .s_content.s_right_list li:last-child {
    margin-bottom: 0;
}

.area_intro_dlrm .area_content>.btn_wrapper {
    text-align: center;
    margin-bottom: 50px;
}/*------------------------------------------------------------------------
[page_svc_print.css]
- 내용 : 출력물 보안 관련 페이지 전용 스타일 정의
------------------------------------------------------------------------*/


.wrapper_print {
    width: 100%;
}

.wrapper_print .container_print {
    width: 700px;
    margin: 50px auto 40px;
}

.wrapper_print .container_print .top_logo {
    padding-bottom: 16px;
}

.contents_print {
    padding: 25px;
    border: 1px solid #ccc;
    background: #fff;
}

.contents_print .top_title {
    text-align: center;
    padding: 35px 0;
}

.table_style_printinfo table {
    width: 100%;
    border: 1px solid #ddd;
    font-size: 15px;
    line-height: 19px;
    border-collapse: collapse;
}

.table_style_printinfo table th {
    padding: 13px;
    text-align: center;
    color: #0059a6;
    font-weight: normal;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.table_style_printinfo table td {
    padding: 13px;
    border-bottom: 1px solid #ddd;
}

.info_print .info_title {
    padding: 25px 0 8px;
}

.info_print .info_list {
    background: #eee;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 14px;
}

.info_print .info_list ul li {
    font-size: 12px;
    line-height: 16px;
    padding: 5px 0 5px 10px;
    background: url(/res/images/print/icon_dot_gray_3x3.png) no-repeat 0 10px;
}

.wrapper_print .container_print .bottom_logo {
    text-align: center;
    padding: 20px 0 15px 20px;
}


/*------------------------------------
콘텐츠 최하단
------------------------------------*/

.wrapper_print .content_print_bottom {
    width: 700px;
    text-align: center;
}

.wrapper_print .content_print_bottom>button {
    margin: 20px auto 0;
}


/*------------------------------------------------------------------------
[page_svc_printerManage.css]
- 내용 : 복합기 관리 페이지 전용 스타일 정의
------------------------------------------------------------------------*/


/*------------------------------------------------------
카드 - 복합기 관리 기본정책 설정
------------------------------------------------------*/

.row.row_printerBasePolicy>.col .headText {
	color: #0059a6;
	margin-bottom: 4px;
}

.row.row_printerBasePolicy>.col {
	border-right: 1px solid #bbb;
	padding: 18px 14px 14px 14px;
}

.row.row_printerBasePolicy>.col:last-of-type {
	border-right: 0;
}

.row_printerBasePolicy>.col .imgShow {
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    bottom: 8px;
    left: 2px;
    width: 56px;
    background-size: 36px;
    height: 56px;
    margin-right: 4px;
}

.row_printerBasePolicy_setUp>.col {
    padding: 10px;
    border-top: 1px solid #bbb;
}

.row_printerBasePolicy_setUp>.col .labelText {
    margin-right: 12px;
    position: relative;
    top: 2px;
}
.row_printerBasePolicy_setUp>.col .labelText .imgShow {
    bottom: 2px;
    width: 20px;
    height: 20px;
    margin-right:2px;
}

.row_printerBasePolicy_setUp>.col .list_select a {
    text-align: left;
    color: #0059a6;
    font-weight: bold;
}

.row_printerBasePolicy_setUp>.col .list_select a .imgShow {
    background-size: 18px;
    top: -2px;
    margin-right: 2px;
    width: 18px;
    height: 18px;
}

.row_printerBasePolicy_setUp>.col .list_select .select_falllist02 a .imgShow {
    margin-right: 4px;
}

.row_printerBasePolicy_setUp>.col .list_select .select_falllist02 li:hover {
    background-color: #f5f5f5;
}


/* 사용량 제한 정책 */

.row-printerManagePolicy-usageLimit table.policyTable td:nth-child(2n+1),
.row-printerManagePolicy-usageLimit .area_content table.policyTable td:nth-child(2n+1) {
    border-right: 0;
}

.row-printerManagePolicy-usageLimit table.policyTable tbody tr:nth-child(2) td,
.row-printerManagePolicy-usageLimit .area_content table.policyTable tbody tr:nth-child(2) td {
    color: #505050;
}

.row-printerManagePolicy-usageLimit table.policyTable tbody tr:nth-child(2) td:nth-child(2n),
.row-printerManagePolicy-usageLimit .area_content table.policyTable tbody tr:nth-child(2) td:nth-child(2n) {
    color: #ff6600;
}



/*------------------------------------
복합기 소모품 정보
------------------------------------*/

.printerItem {
    border-width: 1px 0 1px 1px; 
    border-style: solid;
    border-color: #bbb;
    border-radius: 5px;
    margin-top: 14px;
}

.printerItem>.col {
    border-right: 1px solid #bbb;
    padding: 14px;
}

.printerItem>.leftColumn .bodyText-15 {
    margin-top: 2px;
}

.printerItem>.leftColumn .rowGroup {
    margin-top: 10px;
}

.printerItem>.leftColumn .row {
    margin-top: 10px;
}

.printerItem.status-normal>.leftColumn>.headText-24,
.printerItem.status-normal>.leftColumn>.bodyText-15,
.printerItem.status-normal>.leftColumn .rowGroup .row:first-of-type .bodyText-13  {
    /* 상태 분기 - 상태 정상 */
    color: #0059a6;
    font-weight: bold;
}

.printerItem.status-error>.leftColumn>.headText-24,
.printerItem.status-error>.leftColumn>.bodyText-15,
.printerItem.status-error>.leftColumn .rowGroup .row:first-of-type .bodyText-13  {
    /* 상태 분기 - 상태 비정상 */
    color: #ff6600;
    font-weight: bold;
}

.printerItem.status-error>.leftColumn>.headText-24:after {
    content: "";
    display: inline-block;
    margin-left: 10px;
    position: relative;
    top: 2px;
    width: 19px;
    height: 19px;
    background-image: url('/res/images/common/icn_warning_circle.png');
    left:0;
}

.printerItem>.rightColumn {
    padding: 0;
}

.printerItem>.rightColumn>.row>.col {
    padding: 14px;
}

.printerItem>.rightColumn .col-1-2 {
    border-right: 1px solid #bbb;
    padding: 0;
    height: 100%;
}

.printerItem>.rightColumn .col-1-2:last-of-type {
    border-right: 0;
}

.printerItem>.rightColumn .headText-15 {
    margin-bottom: 8px;
}

.printerItem .row.printerItem-barGraph>.col {
    margin-bottom: 15px;
}


.printerItem .printerItem-barGraph>.col>div:first-of-type {
    font-weight: bold;
    margin-right: 2px;
    width: 22px;
}

.printerItem .printerItem-barGraph>.col>div:nth-child(2) {
    width: 22px;
}

.printerItem .row.printerItem-barGraph>.col:last-of-type {
    margin-bottom: 0;
}


.printerItem .printerItem-barGraph>.col>.bar {
    margin-left: 13px;
    width: 150px;
    height: 14px;
    background-color: red;    
    border-radius: 5px;
    position: relative;
}

.printerItem .printerItem-barGraph>.col:nth-child(1)>.bar {
    background-color: #bce8ff;
}

.printerItem .printerItem-barGraph>.col:nth-child(2)>.bar {
    background-color: #ffdff0;
}

.printerItem .printerItem-barGraph>.col:nth-child(3)>.bar {
    background-color: #fff8b3;
}

.printerItem .printerItem-barGraph>.col:nth-child(4)>.bar {
    background-color: #eaeaea;
}

.printerItem .printerItem-barGraph>.col:nth-child(5)>.bar {
    background-color: #eaeaea;
}

.printerItem .printerItem-barGraph>.col>.bar .bar-value {
    height: 14px;
    border-radius: 5px;
}

.printerItem .printerItem-barGraph>.col:nth-child(1)>.bar .bar-value {
    background-color: #009eef;
}

.printerItem .printerItem-barGraph>.col:nth-child(2)>.bar .bar-value {
    background-color: #e61484;
}

.printerItem .printerItem-barGraph>.col:nth-child(3)>.bar .bar-value {
    background-color: #f6df00;
}

.printerItem .printerItem-barGraph>.col:nth-child(4)>.bar .bar-value {
    background-color: #000000;
}

.printerItem .printerItem-barGraph>.col:nth-child(5)>.bar .bar-value {
    background-color: #000000;
}
/*--------------------------------------------------------------------------------------------
[page_svc_bkup.css]
> 백업 관련 페이지 전용 스타일 정의
--------------------------------------------------------------------------------------------*/


/*----------------------------------------------------------------------
출력물 백업기능 세부 설정 - 레이블 배치 조정
----------------------------------------------------------------------*/
.FileBackup div.divide_2[name="all_print"],
.FileBackup div.divide_2[name="all_watermark"],
.FileBackup div.divide_2[name="privacy_print"],
.FileBackup div.divide_2[name="privacy_watermark"] {
    width: 40%;
}

.FileBackup div.divide_2[name="all_print"]>span:last-child,
.FileBackup div.divide_2[name="all_watermark"]>span:last-child,
.FileBackup div.divide_2[name="privacy_print"]>span:last-child,
.FileBackup div.divide_2[name="privacy_watermark"]>span:last-child {
    margin: 0;
    line-height: 1.3;
}

.FileBackup div.divide_2[name="all_print"]>span:first-child,
.FileBackup div.divide_2[name="all_watermark"]>span:first-child,
.FileBackup div.divide_2[name="privacy_print"]>span:first-child,
.FileBackup div.divide_2[name="privacy_watermark"]>span:first-child {
    width: 60%;
    word-break: unset;
    white-space: pre-line;
    display: inline-block;
    line-height: 1.3;
    margin: 0;
    padding: 0;
}


/*----------------------------------------------------------------------
백업 > 로그조회 > 일괄 다운로드 내역 > 상세 > 다운로드 파일 정보
----------------------------------------------------------------------*/

.set_layer_popup[name="filedownloadbundle"]>ul.content_wrapper>li.set_layer_popup_middle {
	padding-bottom: 0 !important;
}

.set_layer_popup[name="filedownloadbundle"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li span:nth-child(2) {
	font-weight: normal;
}

.set_layer_popup[name="filedownloadbundle"]>ul.content_wrapper>li.set_layer_popup_middle .comp_reg_set>ul>li:last-child>span {
	font-weight: normal;
	font-size: 12px;
}/*--------------------------------------------------------------------------------
[design_team_add.css]
> 디자인팀 CSS 오버라이딩 문서
> 급하게 코드 작성이 필요한 경우 활용
> 작성 후 위치를 정의하여 타 파일에 CSS 배치
--------------------------------------------------------------------------------*/

.view_graph .dummyGraph {
    position: relative;
    left: -16px;
    top: -22px;
}/*------------------------------------------------------------------------
[dev_team_add.css]
> 내용 : 개발팀 전용 '우선순위 최상' 스타일 정의 문서
> 안내 : overriding이 필요할 때 이용
------------------------------------------------------------------------*/

/* 개발팀 추가 (지연) 160611  - ui_common.css 에 추가되어야함 */
.list_select > ul > li.disabled, .list_select > ul > li.disabled > a { color: #d0d0d0; } 
		
/* 개발팀 추가 (지연) 160605  - 파일 업로드 버튼 커스텀 */
span.focus-jfilestyle label {cursor:pointer;}
span.focus-jfilestyle {display:inline-block;padding:5px 9px;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;font-size:12px;line-height:12px; cursor:pointer;}

.alert_popup{ position:absolute; z-index:131; border:1px solid #bbb ; background:#fff; border-radius: 6px; box-shadow: 0 6px 16px rgba(0,0,0,.5);}

.layout_card .area_content table td {overflow-x: hidden; overflow-y: visible;}

/*
.alert_popup{ position:absolute; z-index:131; border:1px solid #bbb ; background:#fff; border-radius: 6px; box-shadow: 0 6px 16px rgba(0,0,0,.5); left: 50%; margin-left: -222px; }
*/

/*마이너스 플러스 버튼*/
.btn_small.btncolor_white.minus{
	width:28px; height:28px;
}
.btn_small.btncolor_white.plus{
	width:28px; height:28px;
}

.content_extra{
	line-height: normal;
}

.content_extra ol {
	list-style-type: decimal;
	padding-left: 30px;
}

.content_extra ul {
	list-style-type: initial;
	padding-left: 30px;
}

.content_extra li {
	list-style: inherit;
}

.content_extra blockquote{
	margin-left: 30px;
}


div.wEditor {
    padding:5px;height:300px;width:841px;margin:10px auto;
    overflow-y:scroll;border:1px solid #DBDBDB;
    font:12px/1.5 gulim;
}
div.wEditor p {margin:0;padding:0;}

#fontSize_list button{
	padding: 2px;
	width: 50px;
	height: 25px;
}

#tint_list button{
	padding: 2px;
	width: 30px;
	height: 30px;
}
#tint_list button:hover {
	opacity: 0.8;
}

.browser_images{
	height: auto; position: relative; margin-bottom: 10px;
}

.browser_images .fa-plus{
	position: absolute; color: #012a48; right: 25px; top: 0px; width: 25px; height: 25px;
	display: none;
}

.browser_images .fa-minus{
	position: absolute; color: #012a48; right: 0px; top: 0px; width: 25px; height: 25px;
	display: none;
}

.browser_images:hover .fa-plus{
	display: block;
}

.browser_images:hover .fa-minus{
	display: block;
}

.browser_rack_0{
	float: left; width: 30%; margin-left: 2%; margin-right:3%; background-color:white;
}

.browser_rack_1{
	float: left; width: 30%; margin-right:3%; background-color:white;
}

.browser_rack_2{
	float: left; width: 30%; margin-right:2%; background-color:white;
}

.detail[ow_detail='FAQ'] .html{
	line-height: 1.7 !important;	
}

/*
	Content CSS
*/
.divide_1
{
	padding: 25px 34px 0px 25px;
	float: left;
	width: 38%;
	height: 50px;
}

.divide_2
{
	padding: 25px 34px 0px 25px;
	float: left;
	width: 38%;
	height: 50px;
	margin-right: 60px;
}

.divide_3
{
	padding: 25px 34px 0px 25px;
	float: left;
	width: 33%;
	height: 50px;
}

.pd_10x0x0x25x
{
	padding: 10px 0px 0px 25px;
}

.pd_15px
{
	padding: 15px;
}

.pd_r16px
{
	padding-right: 16px;
}

.pd_r85px
{
	padding-right: 85px;	
}

.pd_r87px
{
	padding-right: 87px;	
}

.pd_r62px
{
	padding-right: 62px;
}

.pd_r50px
{
	padding-right: 50px;
}

.mg_r_0x30x0x0x
{
	margin: 0px 62px 0px 0px;
	float: right;
}

.fts_15
{
	font-size: 15px;
}

.lh_30
{
	line-height: 30px;
	/* text-transform: capitalize; */
}

.lh_16
{
	line-height: 16px;
	/* text-transform: capitalize; */
}

.right
{
	float: right;
}

.left
{
	float: left;
}

.mg_0x0x0x15x{
	margin-left: 15px;
}

.hr_divider 
{
	margin: 0px 0; padding: 0; height: 0; border-top: 1px solid #ccc;
	border-right: 0; border-bottom: 0; border-left: 0;
}

.bottom_input
{
	border-top: 0 !important;;
	border-left: 0 !important;; 
	border-right: 0 !important;;
	border-bottom: 1px solid #bbb !important;
	width: 80% !important;
	margin-left: 5%!important;
}

.bottom_input+.delete
{
	background: url("/res/images/common/icn_remove_circle_lightgray.png") transparent no-repeat;
	width: 16px;
	height: 16px;
	display: block;
}

.btncolor_white .apply
{
	display: block;
	padding-left: 20px;
	background: url(/res/images/common/icn_approve_gray_13x13.png) no-repeat;
	min-height: 13px;
}

.font_blue {
	font-size: 13px !important;
	color: #0059a6 !important;
	font-weight: bold !important;
}

.font_underline {
	text-decoration: underline;
}

.cursor_pointer {
	cursor: pointer;
}

	
.s_main_table table {
	width: 100%;
	font-size: 13px;
	text-align: center;
}

.s_main_table table thead td {
	padding: 10px 8px;
	border-width: 1px 1px 1px 0;
	border-color: #bbb;
	border-style: solid;
	background: #ececec;
	font-weight: bold;
}

.s_main_table table thead td:last-child {
	border-width: 1px 0px 1px 0px;
}

.s_main_table table tbody td {
	padding: 10px 8px;
	border-width: 1px 1px 1px 0;
	border-color: #bbb;
	border-style: solid;
	font-size: 12px;
}

.s_main_table table tbody td:last-child {
	border-width: 1px 0px 1px 0px;
}


/*
=======================================================================================================================================================
공용 CSS

셀렉트박스는 .list_select를 기준으로 사용한다.

*/

/*공용 font*/
.font_redstar{
	color: rgb(226, 80, 65);
	font-size: 22px;
	top: 4px;
	position: relative;
	line-height: 0px;
}

.font_red{
	color: rgb(226, 80, 65);
}

/*버튼 비활성화*/
button[ow_disabled='ow_disabled']{
	background: #ececec !important;
	color: #b6b6b6 !important;
	border-color: #bbb !important;
}

button[ow_disabled='ow_disabled'] span.type_reject{
	background: url(/res/images/common/icn_remove_circle_gray.png) no-repeat;
}

button[ow_disabled='ow_disabled'] span.type_approval{
	background: url(/res/images/common/icn_approve_gray.png) no-repeat;
}


/* 셀렉트 박스에 우측 화살표 아이콘만큼 패딩값을 준다. */
.list_select.arrow1 a.select{
	/*
		arrow1은 현재( 현재라고하면 나중에 헷갈리겠지만 '/res/images/common/btn_select_arrow_hover.png')쓰이고 있는 기본 화살표 이다.
	*/
	padding-right: 30px;
}
/* 셀렉트 박스에 text_overflow_hidden클래스를 주면 넘치는 글자는 숨김처리 한다. */
.list_select a.select.text_overflow_hidden{
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

button[ow_disabled='ow_disabled']{
	cursor: default !important;
	background: #ececec !important;
	color: #aaa !important;
	border-color: #bbb !important;
}






/*
=======================================================================================================================================================
예외처리 CSS

inline으로 처리할려고한 것들, 규칙이라고는 없는것 들
*/
.config_popup[name='add_manager'] label[for^='type_add_manager_permission'], .config_popup[name='modify_manager'] label[for^='type_modify_manager_permission']{
	padding-right: 10px;
}

/* 일괄 다운로드 정책 다운로드 추가 팝업 > 대상자의 백업 다운로드 정보 > 좌측 item들의 width*/
.config_popup[name='add'] .info_download li .info_download_title{
	width: 150px;
}

table tfoot tr.row-selectAll>td {
	background: #e9eff7;
	font-weight: bold;
	text-align: left !important;
}





/*
QC #7276 공통-7
테이블의 라디오 영역에 각각의 라디오 width 지정
*/
/* 
- 번역 변경으로 QC항목 대응 (신형섭, 170925)
- 검색창과 충돌 시 자연스럽게 넘어가는 UI개선 작업 추가 진행 (신형섭, 170925)
.layout_card .radio_area.radio li{max-width: 170px; min-width: 65px;}
*/
.alert_popup.custom_service_overview .s_main_text > ul > li.service_item {text-align: center;width: 12%;margin-right: 0;display: inline-block;}
.alert_w1080 ul.content_wrapper > li { width: 1080px; }
.alert_popup.custom_service_overview .s_main_text > ul > li.service_item.service_appcheck div.service_item_img {
	margin-left: 29px;
	background: url('/res/images/custom/img_launcher_ransom_ps.png') no-repeat;
	background-position: 0 9px !important; background-size: 76% !important;
}
.alert_popup.custom_service_overview .s_main_text > ul > li.service_item.service_item_disabled.service_appcheck div.service_item_img {
	background: url('/res/images/custom/img_launcher_ransom_ps_disabled.png') no-repeat;
}

#logo_login{
	margin-top: 17px;
	height: 32px;
	float: left;
	cursor: pointer;
}

#logo_login:hover{
	opacity: 0.7;
}


.print_btn {
	margin: 4px 0px 4px 0px;
	padding: 5px 15px 5px 15px;
	font-size: 13px;
}

.print_init {
	display: none;
}

@media print {
	.contents { -webkit-print-color-adjust: exact; }
	#header { display: none; }
	#gnb { display: none; }
	.print_no { display: none !important;}
	.contents { border-right: none};
	.container { background: #FFFFFF; }
	.container { background: #efefef; }
	.con_graph { background: #FFFFFF; }
	.contents { float: none; }
	.page-break  { display: block; page-break-before: always; }
}

.layout_card[name="comoputer_out"] .con_graph .view_graph_bar {
	padding: 20px 16px 28px;
}/*stable;*/
