@charset "utf-8";
/* CSS Document */
@font-face {
    font-family             : NanumGothic;
    src:local(NanumGothic),
        url("/PSetUp/Fonts/NanumGothic.eot?#iefix") format("embedded-opentype"),
        url("/PSetUp/Fonts/NanumGothic.woff") format("woff"),
        url("/PSetUp/Fonts/NanumGothic.ttf") format("truetype");
    font-style              : normal;
    font-weight             : normal;
    unicode-range           : U+0-10FFFF;
}
@font-face {
    font-family             : MalgunGothic;
    src:local(MalgunGothic),
        url("/PSetUp/Fonts/MalgunGothic.eot?#iefix") format("embedded-opentype"),
        url("/PSetUp/Fonts/MalgunGothic.woff") format("woff"),
        url("/PSetUp/Fonts/MalgunGothic.ttf") format("truetype");
    font-style              : normal;
    font-weight             : normal;
    unicode-range           : U+0-10FFFF;
}

/*웹폰트*/
/*
@font-face {
    font-family:'NanumBarunGothic';
    src: url('NanumBarunGothic.eot');
    src: url('NanumBarunGothic.eot?#iefix') format('embedded-opentype'),
         url('NanumBarunGothic.woff') format('woff'),
         url('NanumBarunGothic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal; }
*/
* {
    box-sizing              : border-box; 
    -moz-box-sizing         : border-box;
    -webkit-box-sizing      : border-box;
	margin                  : 0; 
    -webkit-margin-before   : 0; 
    -webkit-margin-end      : 0; 
    -webkit-margin-after    : 0; 
    -webkit-margin-start    : 0;
	padding                 : 0; 
    -webkit-padding-before  : 0; 
    -webkit-padding-end     : 0; 
    -webkit-padding-after   : 0; 
    -webkit-padding-start   : 0;
}

body {
    font-size               : 12px;
    font-family             : Dotum, "돋움", 'NanumGothic', "나눔고딕", Helvetica, AppleGothic, Sans-serif;
    color                   : #444; 
    height                  : 100%; 
    line-height             : 1.5em; 
    box-sizing              : border-box; 
    -moz-box-sizing         : border-box;
    -webkit-box-sizing      : border-box;
	margin                  : 0; 
    -webkit-margin-before   : 0; 
    -webkit-margin-end      : 0; 
    -webkit-margin-after    : 0; 
    -webkit-margin-start    : 0;
	padding                 : 0; 
    -webkit-padding-before  : 0; 
    -webkit-padding-end     : 0; 
    -webkit-padding-after   : 0; 
    -webkit-padding-start   : 0;
}

div, ul, li, ol, span, table, tr, td, th {
    box-sizing              : border-box; 
    -moz-box-sizing         : border-box;
    -webkit-box-sizing      : border-box;
}

/*	table {border-collapse:collapse;}	*/
img {
    border                  : 0;
    vertical-align          : top;
}

h1,h2,h3,h4,h5,h6 {
    font-size               : 100%;
}

ul,ol,li {
    list-style-type         : none;
}

fieldset {
    border                  : 0;
}

select, textarea {
    font-size               : 12px;
    font-family             : Dotum, "돋움", 'NanumGothic', "나눔고딕", Helvetica, AppleGothic, Sans-serif;
    color                   : #444 !important; 
}

select {
    height                  : 22px !important;
}

textarea {
    padding                 : 5px; 
    -webkit-padding-before  : 5px; 
    -webkit-padding-end     : 5px; 
    -webkit-padding-after   : 5px; 
    -webkit-padding-start   : 5px;
}

legend {
    display                 : none;
}

table {
    font-size               : 12px; 
    border-collapse         : collapse; 
    table-layout            : fixed;
}

label {
    vertical-align          : middle;
}

input[type="radio"] { 
    display                 : inline-block; 
    border                  : none !important; 
    vertical-align          : middle; 
    margin-bottom           : 3px; 
    -webkit-margin-after    : 3px; 
}

input[type="checkbox"] { 
    display                 : inline-block; 
    border                  : none !important; 
    vertical-align          : middle; 
    margin-bottom           : 3px; 
    -webkit-margin-after    : 3px; 
}

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

input[type="text"], input[type="password"], .inputbox {
    height                  : 20px !important; 
    border-top              : 1px solid #9a9a9a; 
    border-right            : 1px solid #d8d8d8; 
    border-bottom           : 1px solid #d8d8d8; 
    border-left             : 1px solid #9a9a9a; 
    font-size               : 12px; 
    color                   : #444; 
    box-sizing              : border-box; 
    -moz-box-sizing         : border-box;
    -webkit-box-sizing      : border-box;
	padding                 : 3px 2px 1px 2px; 
    -webkit-padding-before  : 3px; 
    -webkit-padding-end     : 2px; 
    -webkit-padding-after   : 1px; 
    -webkit-padding-start   : 2px; 
}

.inputbox_focus {
    height                  : 20px !important; 
    padding                 : 2px 1px 0 1px; 
    -webkit-padding-before  : 2px; 
    -webkit-padding-end     : 1px; 
    -webkit-padding-after   : 0; 
    -webkit-padding-start   : 1px; 
    border                  : 2px solid #2d85f2;
}

a {
    color                   : #444;
    text-decoration         : none;
}

a:hover {
    text-decoration         : none;
}

h4{
    clear                   : both;
    background              : url("/Images/icon/blt.gif") no-repeat; 
    background-size         : 10px 10px;
    background-position     : left center;
    font-size               : 14px;
    height                  : 24px; 
    text-align              : left; 
    font-weight             : bold; 
    font-size               : 14px; 
    color                   : #666;
	padding                 : 5px 15px; 
    -webkit-padding-before  : 5px; 
    -webkit-padding-end     : 15px; 
    -webkit-padding-after   : 5px; 
    -webkit-padding-start   : 15px;
}

.fLeft {
    float                   : left;
}
.fRight {
    float                   : right;
}
.clear {
    clear                   : both;
}

.selectbox {
	position                : relative;
	width                   : 550px;
	height                  : 30px;
	line-height             : 30px;
	background              : url("/Images/common/select_arrow.png") no-repeat 98% 50%;
	border                  : 1px solid #999999;
	z-index                 : 1;
}

.selectbox label {
	position                : absolute;
	top                     : 0px;
	left                    : 8px;
	height                  : 30px;
	line-height             : 30px;
	font-family             : "NanumGothic", "나눔고딕", "MalgunGothic", "맑은고딕";
	font-weight             : bold;
	font-size               : 11pt;
	color                   : #333333;
	z-index                 : -1;
}

.selectbox select {
	width                   : 100%;
	height                  : 30px !important;
	line-height             : 30px !important;
	font-family             : "Dotum", "돋움";
	font-size               : 11pt;
	/* font-family: inherit; */
	border                  : 0;
	opacity                 : 0;
	filter                  : alpha(opacity=0);
	-webkit-appearance      : none; /* 네이티브 외형 감추기 */
	-moz-appearance         : none;
	appearance              : none;
}

.selectbox_focus {
	border-top-width        : 2px; \0/IE10;
	border-top-style        : solid; \0/IE10;
	border-top-color        : #2d85f2; \0/IE10;
	
	border-right-width      : 2px; \0/IE10;
	border-right-style      : solid; \0/IE10;
	border-right-color      : #2d85f2; \0/IE10;
	
	border-bottom-width     : 2px; \0/IE10;
	border-bottom-style     : solid; \0/IE10;
	border-bottom-color     : #2d85f2; \0/IE10;
	
	border-left-width       : 2px; \0/IE10;
	border-left-style       : solid; \0/IE10;
	border-left-color       : #2d85f2; \0/IE10;
}

select, .selectbox {
	border-top-width        : 1px; \0/IE10;
	border-top-style        : solid; \0/IE10;
	border-top-color        : #9a9a9a; \0/IE10;
	
	border-right-width      : 1px; \0/IE10;
	border-right-style      : solid; \0/IE10;
	border-right-color      : #d8d8d8; \0/IE10;
	
	border-bottom-width     : 1px; \0/IE10;
	border-bottom-style     : solid; \0/IE10;
	border-bottom-color     : #d8d8d8; \0/IE10;
	
	border-left-width       : 1px; \0/IE10;
	border-left-style       : solid; \0/IE10;
	border-left-color       : #9a9a9a; \0/IE10;
	
	min-height              : 20px; \0/IE10;
	/*	line-height:20px; \0/IE10;	*/

	color                   : #666666;
	/*	-webkit-appearance: none;	*/ /* 네이티브 외형 감추기 */
	appearance              : none; 
	-moz-appearance         : none;
}

.loading {
    background              : url("/Images/icon/icon_fading_64x64.gif") 50% 50% no-repeat;
}

.Ellips	{
    white-space             : nowrap;
    overflow                : hidden;
    text-overflow           : ellipsis;
    text-align              : left;
    margin                  : 0;
    -webkit-margin-before   : 0;
    -webkit-margin-end      : 0;
    -webkit-margin-after    : 0;
    -webkit-margin-start    : 0;
}

.no_list {
    text-align              : center;
    font-size               : 11pt !important;
    padding                 : 50px 0 !important;
}

.UI-Contents-HList-Table {
    width                   : 100%;
    table-layout            : fixed;
}

.UI-Contents-HList-Table th, .UI-Contents-HList-Table td {
    padding                 : 3px 0;
    -webkit-padding-before  : 3px;
    -webkit-padding-end     : 0;
    -webkit-padding-after   : 3px;
    -webkit-padding-start   : 0;
}

.UI-Contents-HList-Table td {
    font-family             : Arial, Sans-serif, Helvetica, AppleGothic, "Dotum", "돋움", "NanumGothic", "나눔고딕";
    font-size               : 10pt;
}

.UI-Contents-HList-Table th span, .UI-Contents-HList-Table th div {
    display                 : inline-block;
    width                   : 70px;
    height                  : 25px;
    line-height             : 25px;
    border                  : 1px solid #e1e1e1;
    font-weight             : bold;
    text-align              : center;
    font-size               : 9pt;
    letter-spacing          : -1px;
}

.UI-Contents-Tab {
    display                 : inline-block;
    width                   : 100%;
    border-bottom           : 2px solid #444444;
}

.UI-Contents-Tab ul li {
    display                 : inline-block;
    float                   : left;
}

.UI-Contents-Tab ul li a {
    display                 : inline-block;
    min-width               : 80px;
    text-align              : center;
    font-size               : 11pt;
    font-family             : "MalgunGothic";
    border-top              : 1px solid #cccccc;
    border-right            : 1px solid #cccccc;
    border-bottom           : none;
    border-left             : none;
    padding                 : 8px 25px;
    webkit-padding-before   : 8px;
    webkit-padding-end      : 25px;
    webkit-padding-after    : 8px;
    webkit-padding-start    : 25px;
}

.UI-Contents-Tab ul li:first-child a {
    border-left             : 1px solid #cccccc;
}

.UI-Contents-Tab ul li a:hover, .UI-Contents-Tab ul li a.act {
    background              : #cb1515;
    color                   : #ffffff;
    font-weight             : bold;
}

/* 버튼 스타일 시작 */
.UI-Button-AType {
    display                 : inline-block;
    border                  : 1px solid #cccccc;
    height                  : 20px;
    letter-spacing          : -1px;
    font-size               : 9pt;
    text-align              : center;
    vertical-align          : middle; 
    cursor                  : pointer;
    padding                 : 1px 5px;
    -webkit-padding-before  : 1px;
    -webkit-padding-end     : 5px;
    -webkit-padding-after   : 1px;
    -webkit-padding-start   : 5px;
}

    /* 과정 샘플보기 버튼 */
.UI-Contents-Sample-Button {
    display                 : inline-block;
    font-family             : "MalgunGothic", "NanumGothic", "나눔고딕", "Dotum", "돋움";
    font-weight             : bold;
    font-size               : 11pt;
    color                   : #444444;
    background              : #f3f3f3;
    text-align              : center;
    vertical-align          : middle; 
    cursor                  : pointer;
    border-top              : 1px solid #cccccc;
    border-right            : 1px solid #cccccc;
    border-bottom           : 1px solid #cccccc;
    border-left             : 1px solid #cccccc;
    border-radius           : 3px;
    padding                 : 8px 15px;
    -webkit-padding-before  : 8px;
    -webkit-padding-end     : 15px;
    -webkit-padding-after   : 8px;
    -webkit-padding-start   : 15px;
}

    /* 과정구성보기 버튼 */
.UI-Contents-Structure-Button {
    display                 : inline-block;
    font-family             : "MalgunGothic", "NanumGothic", "나눔고딕", "Dotum", "돋움";
    font-weight             : bold;
    font-size               : 11pt;
    color                   : #ffffff;
    background              : #666666;
    text-align              : center;
    vertical-align          : middle; 
    cursor                  : pointer;
    border-top              : 1px solid #cccccc;
    border-right            : 1px solid #333333;
    border-bottom           : 1px solid #333333;
    border-left             : 1px solid #cccccc;
    border-radius           : 3px;
    padding                 : 8px 15px;
    -webkit-padding-before  : 8px;
    -webkit-padding-end     : 15px;
    -webkit-padding-after   : 8px;
    -webkit-padding-start   : 15px;
}

    /* 수강신청하기 버튼 */
.UI-Contents-Apply-Button {
    display                 : inline-block;
    font-family             : "MalgunGothic", "NanumGothic", "나눔고딕", "Dotum", "돋움";
    font-weight             : bold;
    font-size               : 11pt;
    color                   : #ffffff;
    background              : #cc0000;
    text-align              : center;
    vertical-align          : middle; 
    cursor                  : pointer;
    border-top              : 1px solid #ff6666;
    border-right            : 1px solid #660000;
    border-bottom           : 1px solid #660000;
    border-left             : 1px solid #ff6666;
    border-radius           : 3px;
    padding                 : 8px 15px;
    -webkit-padding-before  : 8px;
    -webkit-padding-end     : 15px;
    -webkit-padding-after   : 8px;
    -webkit-padding-start   : 15px;
}
/* 버튼 스타일 끝 */

/* CSS 도형 */
.css-cancel {
    display                 : inline-block;
    position                : relative;
    margin                  : 0 20px 0 7px;
    padding                 : 0;
    width                   : 4px;
    height                  : 20px;
    background              : #000;
    transform               : rotate(45deg);
}
.css-cancel:before {
    display                 : block;
    content                 : "";
    position                : absolute;
    top                     : 50%;
    left                    : -8px;
    width                   : 20px;
    height                  : 4px;
    margin-top              : -2px;
    background              : #000;
}

.css-cancel-white {
    background              : #fff;
}
.css-cancel-white:before {
    background              : #fff;
}

/* 
    Layer Dialog CSS 
*/
#layer_dialog_titlebar .layer_popup_tit {position:relative;padding:10px 0 !important;display:inline-block;width:100%;height:40px;}
#layer_dialog_titlebar .layer_popup_tit h2{font-size:18px !important; font-weight:700; color:#fff !important; background:#d72041; padding:0 30px;}
#layer_dialog_titlebar .layer_popup_tit .layer_popup_close{display:block; width:60px; height:60px; position:absolute; top:0; right:0; color:#fff; text-align:center; line-height:60px;}
#layer_dialog_titlebar .layer_popup_tit .layer_popup_close span {font-size:30px; color:#fff; line-height:60px; font-family: 'NanumGothic', sans-serif; font-weight: lighter}


.layer_dialog_title_name {
    display                 : inline-block;
    font-size               : 14pt;
    font-weight             : bold;
    color                   : #ffffff;
    padding                 : 10px 0;
}

.layer_dialog_con { 
    min-height              : 400px;
    position                : relative;
    padding                 : 30px 0 30px 0; 
    overflow-y              : auto;
}

.layer_dialog_con .sec_desc { 
    font-size               : 10pt;
    font-weight             : normal;
    color                   : #ff3366;
    margin-top              : 5px;
}

.layer_dialog_close_icon {
    float                   : right;
    display                 : inline-block;
    position                : relative;
    margin                  : 10px 5px 0 0;
    padding                 : 0 0 0 0;
    width                   : 4px;
    height                  : 20px;
    background              : #fff;
    transform               : rotate(45deg);
    cursor                  : pointer;
    z-index                 : 999999;
}
.layer_dialog_close_icon:before {
    display                 : block;
    content                 : "";
    position                : absolute;
    top                     : 50%;
    left                    : -8px;
    width                   : 20px;
    height                  : 4px;
    margin-top              : -2px;
    background              : #fff;
}

.layer_dialog_table_view {width:100%; border:1px solid #ddd; border-top:2px solid #333; table-layout:fixed;}
.layer_dialog_table_view caption{display:none;}
.layer_dialog_table_view thead th{line-height: 48px; text-align:center; font-weight:700; color:#333; border:1px solid #ddd; background:#f9f9f9; vertical-align:middle; word-break:keep-all;}
.layer_dialog_table_view tbody td{padding:10px 10px 9px 10px; text-align:center; border:1px solid #ddd; word-break:keep-all;}
.layer_dialog_table_view tbody td strong{font-weight:700; color:#d72041;}
.layer_dialog_table_view + .require{text-align:right; margin:16px 0 0;}

.layer_dialog_table_write {width:100%; border-top:2px solid #000;}
.layer_dialog_table_write caption{display:none;}
.layer_dialog_table_write th{border-bottom:1px solid #ddd; background-color:#ffffff; padding:8px 10px 8px 18px; font-size:14px; font-weight:700; color:#333; text-align:left; vertical-align:middle;}
.layer_dialog_table_write td{border-bottom:1px solid #ddd; padding:8px 10px ; vertical-align:middle;}
.layer_dialog_table_write td span{font-size:14px;display:inline-block; *zoom:1; *display:inline; line-height:30px;}
.layer_dialog_table_write td .form_btn{margin:0 0 0 0; border-radius:3px;color:#fff;background:#666;font-weight:bold;}
.layer_dialog_table_write td .form_btn .gray{background-color: #666}
.layer_dialog_table_write td span.desc{margin:0 0 0 25px; color:#d72041;}
.layer_dialog_table_write td p.agree_desc{margin:12px 0 0;}
.layer_dialog_table_write td p.agree_desc span{color:#34a1fd;}
.layer_dialog_table_write td.address ul li{margin:10px 0 0;}
.layer_dialog_table_write td.address ul li:first-child{margin:0;}
.layer_dialog_table_write + .require{text-align:right; margin:16px 0 0;}
.require{text-align:right;margin-left:-13px;}