@charset "utf-8";

@import url("/resources/inc/css/default.css");
@import url("/resources/inc/css/header.css");
@import url("/resources/inc/css/footer.css");
@import url("/resources/inc/css/layout.css");
/* @import url("/resources/component/sview/sview.css"); */

/************************************************!
 * 화면 레이아웃 설정
 ************************************************/
body {
	height: 100%;
	width: 100%;
	background-color: #585858;
}


.mainWrap {
    width: 100%;
/*     min-width: 1152px; */
    margin: 0 auto;
    margin-top: 0;
/*     margin-bottom: 20px; */
    padding: 0;
    border: 0;
    background: #ffffff;
}

body.mobile .mainWrap {
    margin-bottom: 0px;
}

/************************************************!
 * 헤더
 ***********************************************/
/*.header {
	position: relative;*/
/* 	background: url(/resources/img/styleType2/header_bg02.png) no-repeat 0 0; */
/*     background: #465561; */
/*     height: 163px;	 */
/*}*/
/*.header .logo {
    padding: 9px 20px 5px;
    color: rgb(100, 189, 4);*/
/*     font-size: 12px; */
/*
}
*/

/* .header .logo .smali { */
/* 	color: rgb(100, 189, 4); */
/* 	font-size: 14px; */
/* } */

/*.header .info {
	position: absolute;
	top: 8px;
	right: 0;
}*/

/*body.mobile .header .info{
    position: inherit;
    top: inherit;
    right: inherit;
    
    background: url(/resources/img/styleType2/header_bg02.jpg) no-repeat 0 0;
    padding: 0 5px 5px 0px;	
}*/

/*.header .info li {
	float: left;
	margin-left: 8px;
}*/

/*
body.mobile .header .info li {
	float: none;
	margin-left: inherit;
	
	display: inline-block;
}
*/


/*.header .info .radiusDiv {
    width: 86px;
    height: 24px;
    background: rgba(0, 0, 0, 0.6);
    text-align: center;
    vertical-align: middle;
    border-radius: 15px;
    line-height: 2;
}*/

/*
body.mobile .header .info .radiusDiv {
	width: 75px;
}
*/

/*
.header .info .user {
	margin-left: 10px;
}
*/

body.mobile .header .info .user {
	margin-left: 0px;
}


/*.header #div_headerLogo{
	background: url(/resources/img/styleType2/header_bg02.jpg) no-repeat 0 0;
}*/
    

/************************************************!
 * 네비게이션
 ***********************************************/
.navi{width:100%;}
/*
.navi #ui_adminMenu span.link {
    display: inline-table;
    margin: 24px 30px 0px 40px;
    font-size: 15px;
    font-weight: bold;    
}

body.mobile .navi #ui_adminMenu span.link {
    display: inline-table;
    margin: 24px 30px 0px 30px;
    font-size: 15px;
    font-weight: bold;    
}
*/

/*.navi .div_sviewMenu{
	background: linear-gradient( to left, #608DB5, #255596 );
    padding-bottom: 16px;
}*/
/*
.navi #ui_adminMenu span.link span {
	position: relative;
	display: block;
	height: 40px;
	color: #fff;
	text-align: center;
	font-size: 16px;
	background: #BBCFF4;
	cursor: pointer;
	overflow: hidden;
}

.navi #ui_adminMenu span.link.select span {
	background: #108D12;
}
*/

/* .navi #ui_adminMenu span label.small { */
/* 	font-size: 14px; */
/* } */
/*

.navi #ui_adminMenu span.link.select span{
	color: #00d4ff 
}

.navi #ui_adminMenu span.link.grid span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_01.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.grid.select span{
    background: url(/resources/img/styleType2/navi_01_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}

.navi #ui_adminMenu span.link.editor span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_02.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.editor.select span{
    background: url(/resources/img/styleType2/navi_02_hi.png) no-repeat 0 0;
    background-position: 50% 0px;    
}


.navi #ui_adminMenu span.link.thumbnail span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_03.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.thumbnail.select span{
    background: url(/resources/img/styleType2/navi_03_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}


.navi #ui_adminMenu span.link.tree span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_04.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.tree.select span{
    background: url(/resources/img/styleType2/navi_04_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}

.navi #ui_adminMenu span.link.portlet span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_05.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.portlet.select span{
    background: url(/resources/img/styleType2/navi_05_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}

.navi #ui_adminMenu span.link.layers span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_06.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.layers.select span{
    background: url(/resources/img/styleType2/navi_06_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}

.navi #ui_adminMenu span.link.sample span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_07.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.sample.select span{
    background: url(/resources/img/styleType2/navi_07_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}


.navi #ui_adminMenu span.link.board span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_08.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.board.select span{
    background: url(/resources/img/styleType2/navi_08_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}


.navi #ui_adminMenu span.link.menuInfo span{
    height: 50px;
    background: url(/resources/img/styleType2/navi_09.png) no-repeat 0 0;
    background-position: 50% 0px;
    line-height: 5;
}

.navi #ui_adminMenu span.link.menuInfo.select span{
    background: url(/resources/img/styleType2/navi_09_hi.png) no-repeat 0 0;
    background-position: 50% 0px;
}
*/

/*_________________서브________________________________________________________________________________*/

/* #div_sviewSubMenu{ */
/*     clear: both; */
/*     height: 26px; */
/*     vertical-align: bottom; */
/*     line-height: 3; */
/*     padding-top: 26px;	 */
/*     padding-left: 50px; */
/* } */
/*
.navi #div_sviewSubMenu{
	min-height: 34px;
	background: #F3F3F3;
}
*/
.navi_sub {
    /* position: absolute; */
    /* top: 137px; */
    /* left: 40px; */
    /* height: 32px; */
	/* padding-left: 40px; */
    /* vertical-align: middle; */
}

.navi_sub span {
    list-style: none;
    display: inline-flex;
    font-family: NanumGothic;
    font-size: 12px;
    background: url(/resources/img/s_bi.png) no-repeat 0 5px;
    background-position: 0px 50%;
    padding-left: 10px;
    padding-right: 15px;
    height: 100%;
}

.navi_sub span a{color:#323754;}
.navi_sub span a:hover{ font-weight:bold; color:#323754;}

.navi_sub span .highlight{
	line-height: 2.9;
}

.navi_sub span.select .highlight{
	background: #C7C7C7;
}

.j_hom_navi{ font-family:NanumGothic; font-size:12px; position:absolute; top:137px; right:42px;}
.j_hom_navi02{ font-family:NanumGothic; font-size:12px; position:absolute; top:50px; right:42px;}
.j_hom_n a{ color:#000; font-weight:bold}


#div_sviewSubMenu .navi_group .lastNode{
	color: #000;
    font-weight: bold;	
}


#div_sviewSubMenu .navi_group{
	display: inline-block;
    width: 100%;
    text-align: right;
    height: 100%;
    line-height: 2.7;
}

#div_sviewSubMenu .navi_group2{
    margin-right: 10px;
}


#div_unit_common_btn_area {
/* 	width: 100%; */
	padding-top: 20px;
	padding-left: 40px;
	background: #ffffff;
}

body.mobile #div_unit_common_btn_area {
	padding-left: 0px;
}


/***********************************************
section
************************************************/
/*
.section {
 	clear: both; 
	padding: 30px 40px 40px 40px;
}
*/

/* body.mobile .section { */
/* 	padding: 30px 0 40px 0; */
/* } */


.section .sectionTit{margin-bottom:18px;font-size:25px;font-weight:bold;color:#111111;}
.section .gridInfo{margin-bottom:10px;font-size:20px;font-weight:bold;color:#111111;}

/***********************************************
footer
************************************************/

/* .footer { */
/*     padding: 6px 0 6px 0; */
/*     color: #95928d; */
/*     text-align: center; */
/* /*     background: linear-gradient( to left, #DDE9FF, #D2F7D8 ); */ */
/* 	border-top: 1px solid #d5d5d5; */
/* /* 	overflow: hidden; */ */
/* } */


/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/
/***********************************************
메인 프레임 관련
************************************************/


body.mainFrame, html.mainFrame{
	height: 100%;
	overflow-y: hidden;
}

.wrap_mainFrame {
/* 	padding: 10px; */
	background: #ffffff;
	height: 100%;
}

.header_mainFrame {
	background: url(/resources/img/styleType2/header_bg02.jpg) no-repeat 0 0;
}

/* .header_mainFrame .logo { */
/* 	padding: 0 0 0 20px; */
/* 	color: #64BD04; */
/* 	font-size: 30px; */
/* } */

/*#div_headerLogo .logo{
	line-height: 0;
	padding: 7px 10px 7px 10px;
}*/



#div_headerLogo .logo img{
	vertical-align: baseline;
}

/* .header_mainFrame .logo .smali { */
/* 	color: #64BD04; */
/* 	font-size: 14px; */
/* } */

.header_mainFrame .info li {
	float: left;
	margin-left: 10px;
}

.header_mainFrame .info .user {
	margin-left: 30px;
}

.section_mainFrame {
 	height : 70%;	
	height : -webkit-calc(100% - 170px);
	height : -moz-calc(100% - 170px);
	height : calc(100% - 170px);
	margin : 0 10px 0 10px;
}

body.mobile .section_mainFrame {
 	height : 70%;	
	height : -webkit-calc(100% - 183px);
	height : -moz-calc(100% - 183px);
	height : calc(100% - 183px);
	margin : 0;
}

div.sviewMainFrameType1{
 	height : 70%;	
	height : -webkit-calc(100% - 95px);
	height : -moz-calc(100% - 95px);
	height : calc(100% - 95px);
}

div.sviewMainFrameType2{
 	height : 70%;	
	height : -webkit-calc(100% - 35px);
	height : -moz-calc(100% - 35px);
	height : calc(100% - 35px);
}


button.leftFrameHideHandler{
	display: inline-block;
	width: 10px;
	height: 50px;
	cursor: pointer;
	background: url(/resources/img/btn_mainFrame_handle.png) no-repeat 0 0;	
}

button.leftFrameHideHandler2{
	display: inline-block;
	width: 30px;
	height: 30px;
	background: url(/resources/img/styleType2/btn_frame_icon.png) no-repeat 0 0;
	background-size: 90px auto;
	background-position: -60px -60px;
    position: absolute;
    left: 0px;	
}

#div_work_tab_wrap {
    width: 100%;
    overflow: hidden;
    margin-top: 10px;
    background: url(/resources/img/styleType2/tab_bg.png) repeat-x;
    position: relative;
	height: 24px;
}



#div_work_tab_navi{
    position: absolute;
/*     right: 0px;	 */
/*     z-index: 1; */
}

#div_work_tab_navi .scrollLeft{
    width: 30px;
    height: 30px;
    background-position: 0px -30px;
    background-image: url(/resources/img/styleType2/btn_direction_icon.png);
    background-repeat: no-repeat;
    background-size: 90px auto;
    opacity: 0.5;
}

#div_work_tab_navi .scrollRight{
    width: 30px;
    height: 30px;
    background-position: 0px 0px;    
    background-image: url(/resources/img/styleType2/btn_direction_icon.png);
    background-repeat: no-repeat;
    background-size: 90px auto;
    opacity: 0.5;
}

#div_work_tab{
	overflow: hidden;
/*     border-top: 1px solid #3572A1; */
/*     margin-top: 10px; */
/*     padding: 3px; */
    height: 24px;
/*     background: #F5F4F4; */
	width: 500px; 
	position: absolute;
/* 	z-index: 1; */
	left: 0px;
	top: 0px;
}

#div_work_tab button.textType07.on {
    border: 1px solid #B2B2B2;
    color: #777777;
    background: linear-gradient( to top, #F2F2F2, #FFFFFF);
    
}

#div_work_tab button.textType07 {

    border-radius: 1px;
    background: transparent;
    border-right: none;
	margin: 0 2px 0 0;
    padding: 0 5px;
    font-weight: bold;

	border: 1px solid #3572A1;
    color: #FFFFFF;
    background: linear-gradient( to top, #4292DB, #459ADA);

}

#footerGap{
/* 	margin-top: 20px; */
}

body.mobile #footerGap{
/* 	display: none; */
}

/************************************************!
 * 컨텐츠 스타일 설정
 ***********************************************/
 
.dataGrid_body .teamSelc{position:relative;}
.dataGrid_body .teamSelc .btn{position:absolute;top:50%;right:20px;width:23px;height:23px;margin-top:-11px;background:url(/images/admin/btn_team_selc.png) no-repeat 0 0;}
.dataGrid_body .input{display:block;padding:2px;border:1px solid #cccccc;}
.dataGrid_body .input.cal{display:inline-block;width:140px;}
.dataGrid_body .btnCal{display:inline-block;width:16px;height:16px;cursor:pointer;vertical-align:middle;background:url(/images/admin/btn_calender.png) no-repeat 0 0;}
.dataGrid_body input[type='text'], select, input, textarea {
	width: 100%;
	border: none;
	background: transparent;
}

.dataGrid_body *:focus { outline: none }

/* .dataGrid_body input:focus {  */
/*     background-color: beige; */
/* } */

/* .dataGrid_body select:focus {  */
/*     background-color: beige; */
/* } */

/* .dataGrid_body input[type=checkbox]:focus {  */
/*     border: 2px solid #bcbcbc; */
/* } */

border: 2px solid #bcbcbc;


.grid_sub_style{
/* 	border: 1px solid #e0e0e0; */
	margin: 0 100px 10px 0;
	padding: 0 20px 26px 20px;
/* 	border: 1px solid #e0e0e0; */
}


.dataGrid_row.select{
	background: #FFF5BB;
}


.dataGrid_set {
/* 	border-top:1px solid #265696; */
}

.dataGrid_set th {
/* 	background: #eef3fa; */
	background-color: #f3f3f3;
}

/* .dataGridType01{border-top:1px solid #265696;} */
.dataGridType01 table{width:100%;}
.dataGridType01 th, .dataGridType01 td {
	padding: 5px;
	text-align: center;
	color: #484848;
	font-size: 12px;
/* 	border: 1px solid #cccccc; */
}

.dataGridType01 td input, .dataGridType01 td select{
	font-size: 12px;
}

.dataGridType01 th {
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
    font-weight: 800;
}

/* .dataGridType01 tr th:first-child, .dataGridType01 tr td:first-child { */
/* 	border-left: none; */
/* } */

/* .dataGridType01 tr th:last-child, .dataGridType01 tr td:last-child { */
/* 	border-right: none; */
/* } */

/* .dataGridType02{border-top:1px solid #777777;} */
.dataGridType02 table {
	width: 100%;
}

.dataGridType02 th, .dataGridType02 td {
	padding: 0px 5px;
	text-align: center;
	color: #484848;
	font-size: 14px;
/* 	border: 1px solid #cccccc; */
}

.dataGridType02 th {
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;	
}

/* .dataGridType02 tr th:first-child, .dataGridType02 tr td:first-child { */
/* 	border-left: none; */
/* } */

/* .dataGridType02 tr th:last-child, .dataGridType02 tr td:last-child { */
/* 	border-right: none; */
/* } */

/* .dataGridType03{border-top:1px solid #777777;} */
.dataGridType03 table {
	width: 100%;
}

.dataGridType03 th, .dataGridType03 td {
	padding: 0px 5px;
	text-align: center;
	color: #484848;
	font-size: 14px;
/* 	border: 1px solid #cccccc; */
}

.dataGridType03 th {
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;	
}

/* .dataGridType03 tr th:first-child, .dataGridType01 tr td:first-child { */
/* 	border-left: none; */
/* } */

/* .dataGridType03 tr th:last-child, .dataGridType01 tr td:last-child { */
/* 	border-right: none; */
/* } */

/* .dataGridType04 table{width:100%;} */
.dataGridType04 th, .dataGridType04 td {
	padding: 0px 5px;
	text-align: center;
	color: #484848;
	font-size: 14px;
/* 	border: 1px solid #cccccc; */
}

.dataGridType04 th {
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;	
}

/* .dataGridType04 tr th:first-child, .dataGridType04 tr td:first-child { */
/* 	border-left: none; */
/* } */

/* .dataGridType04 tr th:last-child, .dataGridType04 tr td:last-child { */
/* 	border-right: none; */
/* } */

/************************************************!
 * NOTICE
 ***********************************************/
.notice-wrap{float:right;width:30%;}
.notice-wrap .notice-box{margin-left:10px;}
.notice{position:relative;padding:12px 15px;margin-top:12px;border:1px solid #cccccc;background:#f6f6f6;}
.notice:first-child{margin-top:0px;}
.notice h2{padding-top:5px;padding-bottom:6px;font-size:14px;color:#333333;}
.notice .pasing-num{position:absolute;top:17px;right:78px;}
.notice .pasing-num .on{color:#000000;font-weight:bold;}
.notice .pasing-btn{position:absolute;top:17px;right:35px;width:33px;height:16px;border:1px solid #dadada;cursor:pointer;background:#ffffff url(/resources/img/btn_slide.png) no-repeat 0 0;}
.notice .more span{display:block;position:absolute;top:17px;right:15px;width:16px;height:16px;border:1px solid #dadada;cursor:pointer;background:#ffffff url(/resources/img/btn_notice_more.png) no-repeat 0 0;}
.notice .slide-wrap{border:1px solid #e0e0e0;background:#ffffff;}
.notice .slide-wrap .slide{overflow:hidden;height:187px;}
.notice .slide-wrap .slide:after{ content:"";display:block;clear:both;height:0;visibility:hidden; }
.notice .slick-prev{position:absolute;top:17px;right:52px;width:18px;height:18px;text-indent:-9999px;border:1px solid #dadada;cursor:pointer;background:#ffffff url(/resources/img/btn_slide.png) no-repeat 0 0;}
.notice .slick-next{position:absolute;top:17px;right:35px;width:18px;height:18px;text-indent:-9999px;border:1px solid #dadada;cursor:pointer;background:#ffffff url(/resources/img/btn_slide.png) no-repeat 100% 0;}
.notice .slick-dots{position:absolute;top:-9999%;left:-9999%;}

.notice .notice-list li{margin:0 10px;padding:8px 0;border-top:1px solid #e8e8e8;cursor:pointer;}
.notice .notice-list li:first-child{border-top:none;}
.notice .notice-list li .tit{display:block;color:#262626;}
.notice .notice-list li .charge{display:block;margin-top:3px;color:#3076c4;}
.notice .notice-list li .txt{display:block;overflow:hidden;margin-top:7px;height:33px;}


/************************************************!
 * 캘린더
 ***********************************************/
 .dataType03{margin: 5px 20px 5px 20px;}
.dataType03 table{width:100%;}
.dataType03 th{padding:5px;text-align:center;color:#484848;font-size:14px;border:1px solid #cccccc;}
.dataType03 td{height:60px; text-align:left; vertical-align:top; color:#484848;font-size:14px;border:1px solid #cccccc;}
.dataType03 th{background:#f9f9f9;}
.dataType03 tr th:first-child, .dataType03 tr td:first-child{border-left:none;}
.dataType03 tr th:last-child, .dataType03 tr td:last-child{border-right:none;}
.dataType03 .dateTitle{
	font-size: 1.4em;		
}

.dataType03 .sunday {
	color: red;
}

.dataType03 .saturday {
	color: blue;
}

.dataType03 .holidays {
	color: red;
}

.dataType03 .today {
	background:#F3F3F3
}

.dataType03 .label {
	display: inline-block;
	width: 100%;
	font-weight: bold;
	text-align: center;
	color: #ffffff;
}
/*.label-mCountReg {
	background: #A958BF
} */
.label-mCountUpd {
	background: #5784C7
}

.sviewCalenderWrap .btn{
	position: absolute;
	top: -10px;
}

body.mobile .sviewCalenderWrap .btn{
	position: inherit;
	top: inherit;
}

body.mobile .calenderTop{
	height: 26px;
}

/************************************************!
 * 버튼
 ***********************************************/
div.btm{
/* 	padding-bottom: 20px; */
}

button {
	border: none;
	background-color: transparent;
	font-family: malgun gothic, malgun gothic, dotum, sans-serif;	
}
/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/
/* 버튼 : 아이콘 타입*/


button.icon.gridTop{
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(/resources/img/styleType2/btn_icons_grid_top_s.png) no-repeat 0 0;
    background-size: 120px auto;
    opacity : 0.3;
}

button.icon.gridTop.on{
	opacity : 1;
}


/*모바일 기기는 해당도가 좋아서 아이콘 이미지를 큰걸 사용한다.*/
body.mobile button.icon.gridTop{
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(/resources/img/styleType2/btn_icons_grid_top.png) no-repeat 0 0;
    background-size: 120px auto;
    opacity : 0.3;
}

body.mobile button.icon.gridTop.on{
	opacity : 1;
}

button.icon.gridTop.type19 {
	background-position: 0 0;
} 
button.icon.gridTop.dataGrid_btnSand  {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(/resources/img/styleType2/btn_icons_grid_top.png) no-repeat 0 0;
    background-size: 120px auto;	
    background-position: 0 -30px;	
}
button.icon.gridTop.type20 {
    background-position: -60px 0;
}
button.icon.gridTop.type20.rotate {
    background-position: -30px 0;
}
button.icon.gridTop.dataGrid_btnChart  {
    background-position: -30px -30px;
}
button.icon.gridTop.dataGrid_btnFullScreen  {
    background-position: -60px -60px;
}
button.icon.gridTop.btn-excelIn  {
    background-position: 0 -60px;
}
button.icon.gridTop.btn-excelOut  {
    background-position: -30px -60px;
}
button.icon.gridTop.icon10  {
	background-position: 0px -90px;
}


body.mobile button.icon.gridTop.type19 {
	background-position: 0 0;
} 
body.mobile button.icon.gridTop.dataGrid_btnSand  {
    background-position: 0 -30px;	
}
body.mobile button.icon.gridTop.dataGrid_btnChart  {
    background-position: -30px -30px;
}
body.mobile button.icon.gridTop.dataGrid_btnFullScreen  {
    background-position: -60px -60px;
}

body.mobile button.icon.gridTop.btn-excelIn  {
    background-position: 0 -60px;
}

body.mobile button.icon.gridTop.btn-excelOut  {
    background-position: -30px -60px;
}
body.mobile button.icon.gridTop.icon10  {
	background-position: 0px -90px;
}

body.mobile button.icon.gridTop.icon10 {
	display: none;
}


button.icon.edit{
    background: url(/resources/img/styleType2/img_demo_site_group1.png) no-repeat;
    /* position: absolute; */
    /* top: 0; */
    /* left: 0; */
    height: 24px;
    width: 24px;
	/* display: inline-block; */
	background-position: -128px -176px;
	/* cursor: pointer; */
    /* padding-left: 33px; */
    /* font-size: 13px; */
    /* color: #333; */
    line-height: 24px;
    opacity : 0.3; 
}

button.icon.edit.on{
	opacity : 1;
}


button.icon.exe{
    background: url(/resources/img/styleType2/img_demo_site_group1.png) no-repeat;
    /* position: absolute; */
    /* top: 0; */
    /* left: 0; */
    height: 24px;
    width: 24px;
	/* display: inline-block; */
	background-position: -153px -176px;
	/* cursor: pointer; */
    /* padding-left: 33px; */
    /* font-size: 13px; */
    /* color: #333; */
    line-height: 24px;
    opacity : 0.3; 
}

button.icon.exe.on{
	opacity : 1;
}

button.icon.thumbnail{
    background: url(/resources/img/styleType2/img_demo_site_group1.png) no-repeat;
    /* position: absolute; */
    /* top: 0; */
    /* left: 0; */
    height: 24px;
    width: 24px;
	/* display: inline-block; */
	background-position: -177px -176px;
	/* cursor: pointer; */
    /* padding-left: 33px; */
    /* font-size: 13px; */
    /* color: #333; */
    line-height: 24px;
    opacity : 0.3; 
}

button.icon.thumbnail.on{
	opacity : 1;
}



button.icon.sviewLayer{
/*     cursor: pointer; */
    width: 20px;
    height: 20px;
/* 	background: url(/resources/img/styleType2/img_demo_site_group1.png) no-repeat; */
/*     background-position: -81px -176px; */
/*     line-height: 24px; */
    opacity: 0.3;
    max-width: 30px;
	position: absolute;
	right: 5px;
	top: 8px;
	background: url(/resources/img/styleType2/icon_set.png) no-repeat;
	background-position: 0 -2px;
}
.dataGrid_body button.icon.sviewLayer{
	position: static;
	right: inherit;
	top : inherit;
	line-height: 24px;
}
button.icon.sviewLayer.on{
	opacity : 1;
}





button._SW_calender_btn{
/*     background: url(/resources/img/styleType2/img_demo_site_group1.png) no-repeat; */
    height: 20px;
    width: 20px;
/* 	background-position: -106px -176px; */
 line-height: 20px;
    opacity : 0.3; 
    max-width: 20px;
/* 	float: right; */
/* 	position: absolute; */
/* 	right: 2px; */
/* 	top: 2px; */
/* 	background : url("/resources/img/month/schedule_icon.png") no-repeat; */
	background: url(/resources/img/styleType2/icon_set.png) no-repeat;
	background-position: 1px -61px;
/* 	background-size: 20px; */
}

button._SW_calender_btn.on{
	opacity : 1;
}

input[type='text']._calender_val{
	width: calc(100% - 24px);
}

/* button._calender_btn { */
/*     max-width: 24px; */
/*     width: 100%; */
/* } */

/*.dataGrid_body input[type='text']._calender_val { */
/* 	width: calc(100% - 24px); */
/* } */


/* .dataGrid_body button._calender_btn{ */
/* 	float: right; */
/* 	position: static; */
/* 	right: inherit; */
/* 	top: inherit; */
/* } */



button._calender_birth_btn{
    height: 20px;
    width: 20px;
/*  line-height: 24px; */
    opacity : 0.3; 
    max-width: 24px;
	position: absolute;
	right: 5px;
	top: 8px;
	background: url(/resources/img/styleType2/icon_set.png) no-repeat;
	background-position: 1px -61px;
}

button._calender_birth_btn.on{
	opacity : 1;
}

input[type='text']._calender_birth_val{
	width: calc(100% - 24px);
}



button.btn_detail_copy{
	background: url(/resources/img/styleType2/icon_set.png) no-repeat;	
    width: 24px;
    background-position: 0 -32px;
}



/*_________________________________________________________________________________________________*/


button.icon  {
    display: inline-block;
    width: 23px;
    height: 23px;
    background: url(/resources/img/styleType2/btn_icons_grid.png) no-repeat 0 0;
    background-size: 47px auto;
}
/*추가*/
button.icon.type01 {
	background-position: 0 0;
} 
/*삭제*/
button.icon.type02.on {
	opacity: 1;
}

button.icon.type02 {
	background-position: -24px 0;
	opacity: 0.3;
}

/*_________________________________________________________________________________________________*/


button.btn_exp.icon.gridTop.type20{
/*     display: inline-block; */
    width: 23px;
    height: 23px;
    background: url(/resources/img/styleType2/icon_set.png) no-repeat 0 0;
	background-position: -28px -29px;
    opacity: 0.3;
}

/* button.btn_exp.icon.gridTop.type20.rotate{     */
/*     background-position: 0 -24px; */
/* } */

button.btn_exp.icon.gridTop.type20.on{
	opacity: 1;
}

/*_________________________________________________________________________________________________*/




button.icon.group02{
    display: inline-block;
    width: 20px;
    height: 20px;
	background: url(/resources/img/styleType2/btn_icons2.png) no-repeat 0 0;
/*     background-size: 50px auto; */
    background-position: 0px -21px;
    cursor: pointer;	
}

button.icon.group02.icon14  {
    background-position: 0px -21px;
    opacity : 0.3;
}

button.icon.group02.icon14.on {
	opacity : 1;	
}

button.icon.group02.dataGrid_btnSand  {
	background-position: -21px 0px;
}

button.icon.group02.icon11  {
    background-position: -21px -21px;
}

button.icon.group02.icon15  {
    background-position: 0px 0px;
}

button.icon.group02.icon19  {
    background-position: -42px -21px;
}


/*_________________________________________________________________________________________________*/


button.icon.gridTop.icon12  {
	background-position: -90px -30px; 
	cursor: pointer;
}
button.icon.gridTop.icon12.on {
	background-position: -90px 0px;
}
button.icon.gridTop.icon13  {
	background-position: -90px -60px;
}
button.icon.gridTop.icon5  {
	background-position: -60px -30px;
}

button.icon.gridTop.icon5.type2  {
	background-position: -60px -30px;
}
button.icon.gridTop.icon09.type2  {
    background-position: -60px -60px;    
}



body.mobile button.icon.gridTop.icon12  {
	background-position: -90px -30px; 
	cursor: pointer;
}
body.mobile button.icon.gridTop.icon12.on {
	background-position: -90px 0px;
}
body.mobile button.icon.gridTop.icon13  {
	background-position: -90px -60px;
}
body.mobile button.icon.gridTop.icon5  {
	background-position: -60px -30px;
}

body.mobile button.icon.gridTop.icon5.type2  {
	background-position: -60px -30px;
}
body.mobile button.icon.gridTop.icon09.type2  {
    background-position: -60px -60px;    
}




/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/
button.icon4  {
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(/resources/img/btn_icons.png) no-repeat 0 0;
	background-size: 60px auto;
}
button.icon4.type03 {background-position:-20px 0;} /*삭제*/
/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/


button.icon8  {
	display: inline-block;
	width: 30px;
	height: 30px;
	background: url(/resources/img/btn_icons.png) no-repeat 0 0;
	background-size: 90px auto;
	background-position:-60px 0;
}





button.icon14.on {
	opacity : 1;	
}


/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/

/*button.icon20  {
	display: inline-block;
	width: 24px;
	height: 24px;
	background: url(/resources/img/styleType2/btn_portlet.png) no-repeat 0 0;
	background-size: 24px auto;
	background-position:0 0;
}*/

body.mobile button.icon20{
	display: none;
}


button.icon6  {
	display: inline-block;
	width: 24px;
	height: 24px;
	background: url(/resources/img/styleType2/btn_frame_icon.png) no-repeat 0 0;
	background-size: 72px auto;
	background-position:0 0;
}

button.icon7  {
	display: inline-block;
	width: 24px;
	height: 24px;
	background: url(/resources/img/styleType2/btn_frame_icon.png) no-repeat 0 0;
	background-size: 72px auto;
	background-position:-24px 0;
}
button.icon16  {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(/resources/img/styleType2/btn_frame_icon.png) no-repeat 0 0;
    background-size: 72px auto;
    background-position: 0px -24px;
}

body.mobile button.icon16{
	display: none;
}


button.icon17  {
	display: inline-block;
	width: 24px;
	height: 24px;
	background: url(/resources/img/styleType2/btn_frame_icon.png) no-repeat 0 0;
	background-size: 72px auto;
	background-position:-48px -24px;
}
/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/



button.icon18  {
	display: inline-block;
	width: 25px;
	height: 25px;
	background: url(/resources/img/styleType2/btn_frame_icon.png) no-repeat 0 0;
	background-size: 75px auto;
	background-position:0 -50px;
}



/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/



/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/


/* 버튼 : 텍스트 타입 : 공통*/
.btn{
	clear: both;
}
.btn.btm{padding-top:15px;}
.btn.paging {
	padding-top: 50px;
}

.btn.ct{text-align:center;}
.btn.rt {
	text-align: right;
}

body.mobile .btn.rt .sviewTextBtn {
	margin-right: 2px;
}

body.mobile .condi .btn.rt .sviewTextBtn {
	margin-right: 0px;
}


.btn.relative{
position: relative;

}
.btn.relative.rt{
	float: right;
}

.on{
	cursor: pointer;
}


/*.lang.select{
	font-weight: bold;
}*/

button.sviewTextBtn{
/* 	display: inline-block; */
	font-family: NanumGothic;
	background:#e2e2e2;
	text-align: center;
	color: #ffffff;
}

.btn .com01 {
	height: 30px;
	line-height: 30px;
	font-size: 12px;
/* 	border-radius: 5px;	 */
}

.btn .com02 {
	height: 36px;
	line-height: 36px;
	font-size: 16px;
	opacity : 0.4;
}

.btn .com03 {
	height: 20px;
	line-height: 20px;
	font-size: 12px;
	opacity : 0.5;
}
.btn .com04 {
	height: 30px;
	line-height: 30px;
	font-size: 12px;
	opacity : 0.5;
}
.btn .com05 {
	height: 24px;
	line-height: 24px;
	font-size: 11px;
}

.btn .com06 {
    font-size: 12px;
    border-radius: 5px;
    height: 24px;
    line-height: 24px;
}

.btn button.com06 {
    line-height: normal;
}


.btn .com07 {
	height: 52px;
	line-height: 24px;
	color: #C7C7C7;
	font-size: 16px;
	border-radius: 5px;	
}

.btn .com08 {
	font-family: NanumGothic;
	background:#e2e2e2;
/* 	text-align: center; */
	color: #ffffff;	
	height: 60px;
/* 	line-height: 24px; */
	font-size: 20px;
	width: 100%;	
}

/************************************************!
 * 공통 넓이 마진 등등
 ***********************************************/

.btn button.width50{
	width: 50px;
}

.btn button.width100{
	width: 100px;
}

.btn button.width200{
	width: 200px;
}

.btn button.width300{
	width: 300px;
}

.btn button.width400{
	width: 400px;
}

div.margin_bottom5{
	margin-bottom: 5px;
}

div.margin_bottom10{
	margin-bottom: 10px;
}

div.margin_bottom20{
	margin-bottom: 20px;
}

body.mobile .btn button.mobileHalf{
	width: 49%;
}

body.mobile .sviewCalenderWrap .btn button.mobileHalf{
	width: 33%;
}

/************************************************!
 * 스타일 인풋박스
 ***********************************************/
 
div.inputBox {
	padding: 5px;
	border: 1px solid #cccccc;
	margin-bottom: 10px;
}

/************************************************!
 * 스타일 체크박스
 ***********************************************/
 
div.styleCheckBox {
	position: relative;
	height: 26px;
/* 	margin-bottom: 10px; */
}

input.styleCheckBox {
/* 	position: absolute; */
/* 	top: 1px; */
/* 	left: 1px; */
/* 	width: 25px; */
/* 	height: 25px; */
/* 	cursor: pointer; */
/* 	clip: rect(0,0,0,0); */
/* 	cursor: pointer; */
	display: none;
}


span.styleCheckBox {
    background: url(/resources/img/styleType2/img_demo_site_group1.png) no-repeat;
    /* position: absolute; */
    /* top: 0; */
    /* left: 0; */
    height: 26px;
    width: 26px;
    display: inline-block;
    background-position: -1px -30px;
    cursor: pointer;
    /* padding-left: 33px; */
    /* font-size: 13px; */
    /* color: #333; */
    line-height: 26px;
}

span.styleCheckBox.on{
	background-position: -1px -60px;
}

label.styleCheckBox {
    /* position: absolute; */
    /* top: 0px; */
    /* left: 33px; */
    height: 26px;
    color: #333;
    line-height: 26px;
    border: 1px solid #f5f6f7\9;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 26px;
    display: inline-block;
    vertical-align: top;
}



/************************************************!
 * 조회조건 박스
 ***********************************************/
/* .condi { */
/* 	padding: 10px; */
/* 	background: #ECECEC; */
/* } */

.condi .row{
/* 	line-height: 35px; */
/* 	height: 35px; */
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 300%;
	font-size: 12px;
	border-bottom: 1px solid #dadada;
}



.condi div.row:FIRST-CHILD {
  border-top: 1px solid #253c5b;
}

.condi div.row:LAST-CHILD {
  border-bottom: 1px solid #253c5b;
}



.condi .col_h {
/* 	float: left; */
/* 	background: #608EB5; */
/* 	color: #ffffff; */
/* 	display: inline-block; */
/* 	height: 100%; */
  text-align: center;
  background-color: #f3f3f3;
  font-weight: bold;
  color: #292929;
}
.condi input{
	font-size: 12px;
	width: calc(100% - 6px);
/* 	line-height: 300%;	 */
/* 	color: #aaaaaa; */
}


.condi > div.row > div {
  height: 35px;
  float: left;
  position: relative;
}

.condi .col_f {
	text-align: center;
}





body.mobile .condi .col_h {
	width : 40%;
}

body.mobile .condi .col_h.mobileHidden {
	display: none;
}


body.mobile .condi .col_f {
	width: 60%;
}

body.mobile .condi .col_f.mobileHidden {
	display: none;
}

body.mobile .condi .col_f.term {
	width: 30%;
}

body.mobile .condi .col_f.termBtn {
	width: 100%;
}

.condi .mplsDate {
	width: 35px;
	height: 21px;
	line-height : 21px;
	margin-left: 5px;
	background : #dcdcdc;
	font-size: 12px;
	cursor: pointer;
}

.condi .mplsDate.on {
	color : #FFFFFF;
	background: #193152;

}

@media screen and (min-width: 400px) {
	body.mobile .condi .col_h {
		width : 20%;
	}
	body.mobile .condi .col_f {
		width: 30%;
	}
	body.mobile .condi .col_f.term {
		width: 15%;
	}
}


/************************************************!
 * 상세 박스
 ***********************************************/



.detail .row{
/* 	line-height: 35px; */
/* 	height: 35px; */
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 300%;
	font-size: 12px;
	border-bottom: 1px solid #f3f3f3;
}



.detail div.row:FIRST-CHILD {
  border-top: 1px solid #333750;
}

.detail div.row:LAST-CHILD {
/*   border-bottom: 1px solid #333750; */
}



.detail .col_h {
	text-align: center;
	background-color: #f3f3f3;
	color: #292929;
	text-overflow: ellipsis;
	overflow: hidden;
	word-break: break-all;
	white-space: nowrap;
}

.detail input{
	width : calc(100% - 6px);
	font-size: 12px;
}

.detail .col_f{
	text-align: center;
}

.detail > div.row > div {
  height: 35px;
  float: left;
  position: relative;
}

.detail .col_h {
	background: #f3f3f3;
}

.detail .col_h.notBg{
	background: #f3f3f3;
}

.detail .row.notBg{
/* 	border-top: 1px solid #ECECEC; */
}


body.mobile .detail .col_h {
	width : 40%;
}
body.mobile .detail .col_h.mobile50p {
	width : 50%;
}
body.mobile .detail .col_h.mobile100p {
	width : 100%;
}
body.mobile .detail .col_h.mobileNot {
	height : 0px;
}
body.mobile .detail .col_h.mobileHalf {
	width : 30%;
}


body.mobile .detail .col_f {
	width: 60%;
}
body.mobile .detail .col_f.mobile40p {
	width: 40%;
}
body.mobile .detail .col_f.mobile50p {
	width: 50%;
}
body.mobile .detail .col_f.mobileHalf{
	width: 30%;
}
body.mobile .detail .col_f.mobileNot {
	height : 0px;
}

@media screen and (min-width: 400px) {
	body.mobile .detail .col_h:not(.notMobileGaro) {
		width : 20%;
	}
	body.mobile .detail .col_f:not(.notMobileGaro) {
		width: 30%;
	}
	body.mobile .detail .col_f.mobileHalf:not(.notMobileGaro){
		width: 15%;
	}
}


/************************************************!
 * div 레이아웃 
 ***********************************************/
 div.layoutCenter{
 	margin: auto;
 	margin-bottom: 20px;
 	width: 50%;
 }
 
 body.mobile div.layoutCenter{
	width: calc(100% - 10px);
}

/************************************************!
 * 나의정보
 ***********************************************/

div.infoBox{
	border-top: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	font-size: 20px;
}



.infoBox .row{
	line-height: 60px;
	height: 60px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.infoBox .col_h {
	float: left;
/* 	background: #608EB5; */
/* 	color: #ffffff; */
	display: inline-block;
	height: 100%;
	width: 30%;
}

body.mobile .infoBox .col_h {
	width : 30%;
	margin-bottom: 2px;
}

/* .infoBox span { */
/* 	height: 100%; */
/* 	display: inline-block; */
/* 	width: 100%; */
/* } */

.infoBox .col_h span {
/* 	display: inline-block; */
	padding-left: 5px;
/* width: 100%; */
/* 	height: 20px; */
	/*  	 border-top: 1px solid #108D12; */
	/* 	 border-right:  1px solid #108D12; */
	/* 	 border-bottom: 1px solid #108D12;   */
/* 	line-height: 1.7; */
}

.infoBox .col_f {
	float: left;
/* 	color: #ffffff; */
	display: inline-block;
	height: 100%;
	width: 70%;
}

body.mobile .infoBox .col_f {
	width: 70%;
	margin-bottom: 2px;
}

.infoBox .col_f span {
/* 	display: inline-block; */
	width: 100%;
	/*   	padding-left: 5px; */
/* 	height: 20px; */
	/*  	 border-top: 1px solid #ffffff; */
	/* 	 border-right:  1px solid #ffffff; */
	/* 	 border-bottom: 1px solid #ffffff; */
	background: #ffffff;
}

/************************************************!
 * 라인
 ***********************************************/
.outline{
	border: 1px solid #cccccc	
}




/************************************************!
 * 회원가입 UI
 ***********************************************/
 
.div_wrap input.userid{
	width: calc(100% - 117px);
	height: 20px;
}
 
 .div_wrap label.userid{
    display: inline-block;
    /* width: 88px; */
    height: 20px;
    line-height: 25px;
    text-align: right;
    float: right;
    padding-right: 5px;
}
 
.div_wrap span.userid {
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(/resources/img/styleType2/img_demo_site_group2.png) no-repeat;
	background-position: 0px -274px;
/* 	line-height: -1px; */
	float: right;
}

.div_wrap span.userid.fail {
	background: url(/resources/img/styleType2/img_demo_site_group2.png) no-repeat;
	background-position: 0px -253px;
/* 	color: red; */
}

.div_wrap label.userid.fail {
	color: red;
	font-weight: bold;
}
 
/* .div_wrap label.userid{ */
/* 	color: red; */
/* 	margin-top: 5px; */
/* 	height : 20px; */
/* 	width : 100%; */
/* 	display: inline-block; */
/* } */
 
.div_wrap input.password{
	width: calc(100% - 117px);
	height: 20px;
}

.div_wrap label.password{
    display: inline-block;
    /* width: 88px; */
    height: 20px;
    line-height: 25px;
    text-align: right;
    float: right;
    padding-right: 5px;
}
 
.div_wrap span.password {
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(/resources/img/styleType2/img_demo_site_group2.png) no-repeat;
	background-position: 0px -106px;
	float: right;
}


.div_wrap span.password.lv1 {
	background-position: 0px -1px;
}

.div_wrap span.password.lv2 {
	background-position: 0px -22px;
}
.div_wrap span.password.lv3 {
	background-position: 0px -43px;
}
.div_wrap span.password.lv4 {
	background-position: 0px -64px;
}


.div_wrap label.password.lv1 {
	color: red;
	font-weight: bold;
}

.div_wrap label.password.lv2 {
	color: #f88619;
	font-weight: bold;
}
.div_wrap label.password.lv3 {
	color: #fece0f;
	font-weight: bold;
}
.div_wrap label.password.lv4 {
	color: #10c40f;
	font-weight: bold;
}


/* ____ */

.div_wrap input.password_check{
	width: calc(100% - 117px);
}

.div_wrap label.password_check{
    display: inline-block;
    /* width: 88px; */
    height: 20px;
    line-height: 25px;
    text-align: right;
    float: right;
    padding-right: 5px;
}
 
.div_wrap span.password_check {
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(/resources/img/styleType2/img_demo_site_group2.png) no-repeat;
	background-position: 0px -127px;
	float: right;
}

.div_wrap span.password_check.ok {
	background-position: 0px -85px;
}

span.dg_styleRadioBox.radio {
	width: 150px
}

body.mobile span.dg_styleRadioBox.radio {
	width: 40%;
}

/************************************************!
 * 로그인 on / off
 ***********************************************/
/*.loginOnOff{
 	width: 24px;
	height: 24px;
	background: url(/resources/img/styleType2/img_demo_site_group1.png) no-repeat;
 	background-position: -129px -151px;
 }*/

 .loginOnOff.loginSuccess{
 	background-position: -154px -151px;
 }

button.emailAuthenticationNum{
	width: 112px;
    height: 24px;
    background: #e2e2e2;
    color: #ffffff;
}

button.emailAuthenticationNum.on{
    background: darkslateblue;
}


button.emailChange{
	width: 112px;
    height: 24px;
    background: #e2e2e2;
}

button.emailChange.on{
    background: darkslateblue;
}


/* 아이디 변경페이지 전용 */
button.member_emailAuthenticationNum{
	width: 112px;
    height: 24px;
    background: #e2e2e2;
}

button.member_emailAuthenticationNum.on{
    background: darkslateblue;
}
    

/*---------------------------------------------------------------------------------------------------------------*/

/* 텍스트 타입 버튼의 경우 모바일일때 넓이 100% 처리 */
body.mobile button.sviewTextBtn {
	width: 99%;
	width : -webkit-calc(100% - 4px);
	width : -moz-calc(100% - 4px);
	width : calc(100% - 4px);
	margin-bottom: 2px;
}

/* 텍스트 타입 버튼의 경우 모바일일때 넓이 100% 처리 */
body.mobile .condi button.sviewTextBtn {
	width: 100%;
}

/* 버튼 : 텍스트 타입 : 타입별 정의 */
button.textType01 {
	background: #e2e2e2;
	width: 190px;
    line-height: 30px;
    border-radius: 5px;	
}

/*---------------------------------------------------------------------------------------------------------------*/

button.textType01.on {
	background: linear-gradient(to top, #67C2E5, #84D3F1);
	opacity : 1;
}

button.textType02 {
	background: #F7F7F7;
	width: 400px;
	border: 1px solid #B2B2B2;
}

button.textType02.on {
	/* 	background: #F7F7F7; */
	color: #333333;
	/*     padding-top: 14px; */
}

span.span_next_search_count {
	font-size: 14px;
	color: #2b61b2;
	padding-left: 5px;
	font-weight: bold;
}

button.textType03 {
	width: 160px;
}

button.textType03.on {
	background: #387628
}

button.textType04 {
	background: #e2e2e2;
	width: 100px;
}

button.textType04.on {
	background: #005a85;
}

button.textType05 {
	width: 60px;
}

button.textType05.on {
	background: #000000
}

button.textType06 {
	width: 34px;
}

button.textType06.on {
	background: #000000
}

button.textType07 {
	background: #64BD04;
	border-right: 2px solid #ffffff;
}

button.textType07.on {
	border-right: 2px solid #ffffff;
}

button.textType08 {
	background: #e2e2e2;
	width: 120px;
	border: 1px solid #e2e2e2;
}

button.textType08.on {
	background: linear-gradient(to top, #318DFD, #59A4FF);
	/*     border: 1px solid #B2B2B2; */
}

/*button.textType09 {
	background: #e2e2e2;
	width: 120px;
	 	border: 1px solid #e2e2e2; 
}*/

/*button.textType09.on {
	background: linear-gradient(to top, #fd317e, #b759ff);
	     border: 1px solid #B2B2B2; 
}*/

button.textType10 {
	width: 400px;
}

button.textType10.on {
	background: #64BD04
}

button.vedio.on{
	background:#e06248;
}

/*---------------------------------------------------------------------------------------------------------------*/

button.save.on{
	background: linear-gradient(to top, #67C2E5, #84D3F1);	
}

button.saveAll.on{
	background: linear-gradient(to top, #6796E5, #84ADF1);	
}

button.execution.on {
	background: linear-gradient(to top, #FD3131, #962121);
}


button.sviewApi_info{
    background-color: #4d38af;
    width: 64px;
    height: 64px;
    border-radius: 32px;
    color: #ffffff;	
}

button.user_info_video{
    width: 64px;
    height: 64px;
    background: url(/resources/img/user_info_video.png) no-repeat 0 0;
/*     background-size: 80px auto; */
}

button.comSelectBoxClearBtn{
/* 	    display: block; */
    line-height: 30px;
    width : 80px;
    color: #ffffff;
    text-align: center;
    font-weight: bold;
    font-size: 13px;
    cursor: pointer;
    background: #5F5F5F;
    background: linear-gradient( to top, #5F5F5F, #8A8A8A );
    border-radius: 5px;
}

/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/

/***********************************************
div를 테이블처럼 사용가능한 스타일
************************************************/
.table { display:table; width:100%; }
.table .colgroup { display: table-column-group; }
.table .col {display: table-column; }
.table .thead { display:table-row; height:30px; background:#424242; color:#FFF; font-weight:bold; text-align:center; vertical-align:middle}
/* .table .thead .tr { display : table-header-group;  } */
.table .thead .th { border-bottom:none}
.table .thead .th { display:table-cell; height:28px; border-bottom:1px solid #e0e0e0; text-align:center; vertical-align:middle }

.table .tbody{ display: table-row-group;}
.table .tbody .tr { display:table-row;  }

.table .td { display:table-cell; height:28px; border-bottom:1px solid #e0e0e0; text-align:center; vertical-align:middle }
.table .td .left {display:block; width:180px;  text-align:left; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}

.table .select { background:#efefef; font-weight:bold}
/* .table .select:hover { background:#efefef; cursor:default } */


/*커스텀 스타일 때문에 dataGrid 스타일 안먹혀서 먹히도록 추가해줌*/
.table .tbody .tr._data_row_temp{
	display: none;
}
.table .tbody .tr._data_row_rowType_D{
	display: none;
}

/* .table .tr:hover { background:#f4f4f4; cursor:pointer } */
/* table tr:hover { background:#f4f4f4; cursor:pointer } */
/* .dataGrid_row._dg_col_rowDnd:hover { background: #f4f4f4; cursor: pointer } */



/*
	예제 HTML
	<div class="table">
		<div class="colgroup">
			<div class="col" style="width: 90px;"></div>
			<div class="col" style="width: 200px;"></div>
			<div class="col"></div>
			<div class="col" style="width: 200px;"></div>
			<div class="col" style="width: 150px;"></div>
			<div class="col" style="width: 60px;"></div>
			<div class="col" style="width: 90px;"></div>
			<div class="col" style="width: 100px;"></div>
			<div class="col" style="width: 140px;"></div>
		</div>
		<div class="thead">
			<div class="th">최초발생일</div>
			<div class="th">생성부서</div>
			<div class="th">내용</div>
			<div class="th">진행업무</div>
			<div class="th">진행부서</div>
			<div class="th">담당자</div>
			<div class="th">최종작업일</div>
			<div class="th">소요일/기준일</div>
			<div class="th">진행률</div>
		</div>
		<div class="tbody">
			<div class="tr">
				<div class="td">내용....</div>
				<div class="td">내용....</div>
				<div class="td">내용....</div>
				<div class="td">내용....</div>
				<div class="td">내용....</div>
				<div class="td">내용....</div>
				<div class="td">내용....</div>
				<div class="td">내용....</div>
				<div class="td">내용....</div>
			</div>
		</div>
	</div>
*/


/*_________________________________________________________________________________________________*/
/*_________________________________________________________________________________________________*/


/************************************************!
 * 커스텀 스타일 설정
 ***********************************************/
/* .dataGridType01 td span.btn_delete{ */
/* display: inline-block; */
/* width: 25px; */
/* height: 25px; */
/* cursor: pointer; */
/* background: url(/resources/img/btn_delete.png) no-repeat 0 0; */
/* } */


/************************************************!
 * 커스텀 스타일 설정
 ***********************************************/
 
/* inpu text에 아이콘 집어 넣을때 */
#input_text{width: 200px;margin-left: 5px; margin-top: 0px}
#input_text{
	position: relative;
}

/* 아이콘 버튼 */
.icon01{
	display:inline-block;background:url(/images/ic_nodata.gif) no-repeat; 
	position: absolute;
	top: 50%;
	right: 0px;
	width: 18px;
	height: 18px;
	background-size: 18px 18px;
	margin-top: -7px;
}
.icon01.on{cursor: pointer;}


/* 캘린더 버튼 */
/*  ._calender_btn { */
/* 	margin: 0px 5px 0px 5px; */
/* 	vertical-align: text-bottom; */
/* } */

/* .dataGrid_body ._calender_btn { */
/* 	margin: 0px 5px 0px 5px; */
/* 	vertical-align: text-bottom; */
/* 	position: relative; */
/* 	top: -17px; */
/* 	float: right; */
/*     max-width: 15px; */
/*     width: 100%; */
/* } */

/* .dataGrid_body td ._calender_btn { */
/* 	margin: 0px 5px 0px 5px; */
/* 	vertical-align: text-bottom; */
/* 	position: relative; */
/* 	top: 0px; */
/* 	float: right; */
/* } */



/* input[type='text']._calender_val { */
/* 	width: 70% */
/* } */

.wrapDiv.fullScreen{
	position:fixed;
/* 	background:rgba(0, 0, 0, 0.8); */
	width:100%;
	height:100%;
	top:0px;
	left:0px;
    background: rgba(0, 0, 0, 0.8);
    background-image: url(/resources/img/close_full_screen.png);
    background-repeat: no-repeat;
    background-position: right top;		
}

.wrapSub.fullScreen{
	background : #ffffff;
	margin : 40px 20px 20px 20px;
	padding : 10px;
 	height : 90%;	
	height : -webkit-calc(100% - 80px);
	height : -moz-calc(100% - 80px);
	height : calc(100% - 80px);

}

body.mobile .wrapSub.fullScreen{
	background : #ffffff;
	margin : 40px 0px 20px 0px;
	padding : 0px;
 	height : 90%;	
	height : -webkit-calc(100% - 40px);
	height : -moz-calc(100% - 40px);
	height : calc(100% - 40px);

}



.treeGroup.fullScreen{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: rgba(0, 0, 0, 0.8);
    background-image: url(/resources/img/close_full_screen.png);
    background-repeat: no-repeat;
    background-position: right center;
    z-index: 3;
}

.treeGroupWrap.fullScreen{
    background: #ffffff;
    margin: 40px 0px 0px 0px;
    padding: 0px;
    /* height: 90%; */
    /* height: -webkit-calc(100% - 40px); */
    height: -moz-calc(100% - 40px);
    /* height: calc(100% - 40px); */
    width: 70%;
}

body.mobile .treeGroupWrap.fullScreen{
    background: #ffffff;
    margin: 40px 0px 0px 0px;
    padding: 0px;
    /* height: 90%; */
    /* height: -webkit-calc(100% - 40px); */
    height: -moz-calc(100% - 40px);
    /* height: calc(100% - 40px); */
    width: 80%;

}





/* th div { */
/* 	position: absolute; */
/* 	background: transparent; */
/* 	color: #000000; */
/* 	padding: 9px 25px; */
/* 	top: expression(document.getElementById("div_02").scrollTop); */
/* 	margin-left: -25px; */
/* 	line-height: normal; */
/* 	border-left: 1px solid #000000; */
/* } */


.colHandler{
	width: 3px;
	background: #000000;
	position: absolute;
	cursor: move; 
}



/* 센터정렬 페이지 */
/*div.alignCenter{ 
	width: 70%;
	margin: auto;
}*/
body.mobile div.alignCenter{ 
	width: 100%;
}

/************************************************!
 * 그리드 관련
 ***********************************************/

div.left_right_line{
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}


/************************************************!
 * 포틀릿
 ***********************************************/
div.portletRatioCntHearder{
	background: #242a30;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	padding: 10px 10px 5px 10px;
	text-align: right;
/* 	position: absolute; */
/* 	width: 90%; */
/* 	width: -webkit-calc(100% - 20px); */
/* 	width: -moz-calc(100% - 20px); */
/* 	width: calc(100% - 20px);	 */
}
/* 가로버젼 */
/* div.portlet.exp div.portletRatioCntHearder{ */
/* 	writing-mode: vertical-rl; */
/* 	-webkit-writing-mode: vertical-rl; */
/* 	-moz-writing-mode: vertical-rl; */
/* 	-o-writing-mode: tb-rl; */
/* 	-ms-writing-mode: tb-rl; */
/* 	-epub-writing-mode: vertical-rl; */
	
/* } */


div.portletRatioCntHearder span.portletRatioCntTitle{
	display: inline-block;
	color : #ffffff;
	float: left;	
}



div.portletRatioCntHearder button{
	display: inline-block;
    width: 20px;
    height: 20px;
	background: url(/resources/img/styleType2/btn_icons.png) no-repeat 0 0;
	background-size: 100px auto;
	cursor: pointer;
}


div.portletRatioCntHearder button.portletRatioCntClose{
	background-position: 0px 0;
}


div.portletRatioCntHearder button.portletRatioCntRefresh{
    background-position: -20px 0;
}


div.portletRatioCntHearder button.portletRatioCntFullScreen{
	background-position: -40px -20px;
}
div.portletRatioCntHearder button.portletRatioCntFullScreen.on{
	background-position: -40px 0px;
}


div.portletRatioCntHearder button.portletRatioCntExp{
    background-position: -60px -20px;
}
div.portletRatioCntHearder button.portletRatioCntExp.on{
	background-position: -60px 0px;
}



div.portletRatioCntHearder button.portletRatioCntLink{
	background-position: -80px 0px;
}


span button.portletRatioCntClose{
	display: inline-block;
	width: 15px;
	height: 15px;
	background: url(/resources/img/btn_icons.png) no-repeat 0 0;
	background-size: 45px auto;
	background-position:-30px -15px
}


div.portletInfo{
	text-align: center;
	width: 100%;
	height: 60px
}
div.portletInfo1{
	width: 100%;
	height: 60px;
	float: left;
}
div.portletInfo1 div{
	height: 30px;
	position: relative;
	text-align: right;
}

div.portletInfo1 span{
/* 	width: 28%; */
/* 	text-align: right; */
/* 	display: inline-block; */
/* 	margin-right: 10px; */
/* 	position: absolute; */
	vertical-align: top;
/* 	font: bold; */
	color: #ffffff;
/* 	-webkit-border-radius: 30px; */
/* 	-moz-border-radius: 30px; */
	background: #68ACFF;
	padding: 5px;
}

div.portletInfo1 input{
 	width : 80%;	
	width : -webkit-calc(100% - 30px);
	width : -moz-calc(100% - 30px);
	width : calc(100% - 30px);
	
	border: 1px solid;
	
}


div.portletInfo2{
	text-align: center;
	width: 40%;
	height: 100px;
	float: left;
}	


/************************************************!
 * 스크립트 에디터
 ***********************************************/
 div.div_scriptEditWrap {
	border: 1px solid #cccccc;
	height: 100%;
	padding: 10px;
	height: 90%;
	height: -webkit-calc(100% - 20px);
	height: -moz-calc(100% - 20px);
	height: calc(100% - 20px);
}

body.mobile  div.div_scriptEditWrap {
	border: none;
/* 	padding: 0 10px 0 10px; */
	padding: 0;
}

textarea.textareaHtml {
	height: 100px;
	resize: none;
	font-family: tahoma;
	color: #BB0000;
	margin-bottom: 10px;
	overflow-y: scroll;
	background: khaki;
}

body.mobile textarea.textareaHtml {
	margin-bottom: 0px;
	margin-bottom: 0px;
}

textarea.textareaScript{
	height: 70%;
	height: -webkit-calc(100% - 148px);
	height: -moz-calc(100% - 148px);
	height: calc(100% - 148px);
	resize: none;
	font-family: tahoma;
	color: #430A9C;
	margin-bottom: 10px;
}

body.mobile textarea.textareaScript{

}

/* END */


/************************************************!
 * 프로젝트별 스타일
 ***********************************************/
 
 .dataGrid_row.highlight_type1:not(._dataGrid_is_currRowSelect):not(._data_row_disabled) {
 	background-color: #e6ffbd;
 } 
 
 .dataGrid_totalCount{
 	height: 30px;
 	width: 200px;
 	display: inline-block;
 	margin-top: 10px;
 	font-weight: bold;
 	line-height: 30px;
    background: #F7F7F7;
    border: 1px solid #B2B2B2; 	
    border-radius: 5px;
 }
 
.detail .col_h.readonly span.label{
	background-color: #f3f3f3;
	color :#afafaf;
}
.detail .col_h.readonly{
 	background-color: #f3f3f3;
}
.detail .col_h.notNull span.label{
	background-color: #f3f3f3;
	font-weight: bold;
}


.rowHeight35{
	height: 35px;
}
#div_booking_frist_grid{
	width: 75%; display: inline-block; vertical-align: top;
}
#div_booking_second_grid{
	width: calc(25% - 10px); display: inline-block; vertical-align: top;
}

body.mobile #div_booking_frist_grid{
	width: 100%; display: inline-block; vertical-align: top;
}
body.mobile #div_booking_second_grid{
	margin-top : 10px;
	width: 100%; display: inline-block; vertical-align: top;
}

/* 캘린더 커스텀 */

table.sviewCalenderDgGroup thead tr{
	height: 35px;
	border-top: 1px solid #253c5b;
}
table.sviewCalenderDgGroup tbody tr{
/* 	height: 100px; */
}
table.sviewCalenderDgGroup tbody tr td{
/* 	height: 130px; */
}

table.sviewCalenderDgGroup tbody tr td .monthChoicd {
	text-overflow: ellipsis;
	overflow: hidden;
	word-break: break-all;
	width: 100%;
	display: inline-block;
}

.sviewCalenderWrap .dateTitle {
	font-size: 1.4em;
	font-weight: bold;
}

.sviewCalenderWrap button.sviewCalenderPrev {
    width: 150px;
    height: 30px;
    background-color: #005a85;
    text-align: right;
    padding: 0 20px;
    background-image: url(/resources/img/biz/month_direct_pre.png);
    background-size: 16%;
    background-repeat: no-repeat;
    color: #fff;
    background-position: 10% center;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
    white-space: nowrap;	    
}

.sviewCalenderWrap button.sviewCalenderNext{
/*     display: inline-block; */
    width: 150px;
    height: 30px;
    background-color: #005a85;
    text-align: left;
    padding: 0 20px;
    background-image: url(/resources/img/biz/month_direct_next.png);
    background-size: 16%;
    background-repeat: no-repeat;
    color: #fff;
    background-position: 90% center;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
    white-space: nowrap;	    
} 
body.mobile .sviewCalenderWrap .sviewCalenderPrev{
	margin-right : 0px;
}

.areaRatioCenter{
	width: 80%; 
	margin: auto;
}

body.mobile .areaRatioCenter{
	width: 100%; 
	margin: auto;
}