/* CSS Document ----------
Site:    ^^
Author:  ^^
Version: 2018.12
---------------------- */
@charset "UTF-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, button, dl, dt, dd, ol, ul, li, fieldset, form, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin:0;padding:0;}
ol, ul, li{list-style:none;}
img, fieldset{border:none;vertical-align:middle;}
table{width:100%;border-collapse:collapse;border-spacing: 0;}
/* html, body{background:url(../images/bg.gif); font-size:12px; font-family:Malgun gothic, Dotum, Arial, sans-serif; color:#3d3d3d; line-height:150%;} */
html, body{/*background-color :#f0f3f2;*/ font-size:12px; font-family:Malgun gothic, Dotum, Arial, sans-serif; color:#3d3d3d; line-height:150%; height: 100%;}
td, dt, dd, li{word-break:break-all; word-wrap:break-wrap;}

:root {
  --default-grey: #656565;
  --light-grey: #d4d4d4;
  --teal-blue: #0092b9;
  --petrol: #005e77;
  --dark-petrol: #005267;
  --error-color: #FF000099;
  --dark-blue: #344767;
}

.fL {float:left}
.fR {float:right}
.mR8 {margin-right:8px!important;}
.mR10 {margin-right:10px!important;}
.mR15 {margin-right:15px!important;}
.mR20 {margin-right:20px!important;}
.mR24 {margin-right:24px!important;}
.mR30 {margin-right:30px!important;}
.mR40 {margin-right:40px!important;}
.mR50 {margin-right:50px!important;}
.mL3 {margin-left:3px!important;}
.mL5 {margin-left:5px!important;}
.mL10 {margin-left:10px!important;}
.mL15 {margin-left:15px!important;}
.mL20 {margin-left:20px!important;}
.mL30 {margin-left:30px!important;}
.mL50 {margin-left:50px!important;}
.mT3 {margin-top:3px!important;}
.mT5 {margin-top:5px!important;}
.mT8 {margin-top:8px!important;}
.mT10 {margin-top:10px!important;}
.mT15 {margin-top:15px!important;}
.mT20 {margin-top:20px!important;}
.mT24 {margin-top:24px!important;}
.mT30 {margin-top:30px!important;}
.mT32 {margin-top:32px!important;}
.mT40 {margin-top:40px!important;}
.mT96 {margin-top:96px!important;}
.mB5 {margin-bottom:5px!important;}
.mB8 {margin-bottom:8px!important;}
.mB10 {margin-bottom:10px!important;}
.mB15 {margin-bottom:15px!important;}
.mB16 {margin-bottom:16px!important;}
.mB20 {margin-bottom:20px!important;}
.mB24 {margin-bottom:24px!important;}
.mB30 {margin-bottom:30px!important;}
.mB40 {margin-bottom:40px!important;}
.mB42 {margin-bottom:42px!important;}
.mB56 {margin-bottom:56px!important;}
.mB80 {margin-bottom:80px!important;}

.pT5  {padding-top: 5px!important;}
.pT10 {padding-top:10px!important;}
.pT15 {padding-top:15px!important;}
.pT50 {padding-top:50px!important;}
.pT100 {padding-top:100px!important;}
.pB5  {padding-bottom: 5px!important;}
.pB10 {padding-bottom:10px!important;}
.pB15 {padding-bottom:15px!important;}
.pL5  {padding-left: 5px!important;}
.pL10 {padding-left:10px!important;}
.pL15 {padding-left:15px!important;}
.pR5  {padding-right: 5px!important;}
.pR10 {padding-right:10px!important;}
.pR15 {padding-right:15px!important;}

.taC{text-align: center!important;}
.taL{text-align: left!important;}
.taR{text-align: right!important;}
.vaT {vertical-align: top;}
.cPointer{cursor: pointer;}

.txtGray {color:#8B8B8B;}
.txtRed {color:#EA3534;}
.txtBig {font-size:16px!important;}
.tCenter {text-align:center;}
.tNormal {font-weight:normal;}
.lineH {border-left:1px solid #B8B8B8; width:1px; height:260px;}
.lineH2 {border-left:1px solid #B8B8B8; width:1px; height:530px;}
.btnBoxshadow {box-shadow: 2px 2px 2px 1px rgba(163, 174, 184, 0.7);}

.t16pt {font-size:16px;}
.t14pt {font-size:14px;}
.outWrap {position:relative;width:1250px;margin:0 auto;}
.rectGroup {margin:0; width:1250px; min-width:960px;}
.rectSubject {padding:20px 0 0 20px; font-size:14px; letter-spacing:-0.02em; color: #666666; font-weight: bold;}
.rectSubject2 {padding:20px 0 0 20px; font-size:18px; letter-spacing:-0.02em; font-weight: bold; color: #333333 ; vertical-align: middle; margin-left: 270px;}
.rectSubject3 {font-size:15px; letter-spacing:-0.02em; vertical-align: middle; margin-right: 10px;}
.rectSubject4 {padding:20px 0 0 20px; font-size:12px; letter-spacing:-0.02em; vertical-align: middle; color: #ffffff}
.roundKeyIssue {display:inline-block; background:#F2F2F2;  width:324px; height:30px; text-align:left; color:#5B5D64; font-size:14px; font-weight:bold; padding:10px 0 0 15px; box-shadow:2px 2px 4px 0px #D9D9D9;}

.warning{width:auto; float:left; display:block;}
.warning li{margin:0 11px 2px 7px; display:block; float:left; color:#343942; letter-spacing:-0.02em; font-family:Malgun gothic, Dotum, Arial, sans-serif;}
.warning li.type_header{padding-top:14px; display:inline-block; background:#ffffff;  width:1238px; height:50px; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_a{padding-top:18px; display:inline-block; background:#fff;  width:1238px; height:auto; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_b{padding-top:18px; display:inline-block; background:#fff;  width:750px; height:auto; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_c{padding-top:18px; display:inline-block; background:#fff;  width:750px; height:auto; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_d{padding-top:18px; display:inline-block; background:#fff;  width:610px; height:auto; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_e{padding-top:18px; display:inline-block; background:#fff;  width:619px; height:auto; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_admin_top{padding-top:14px; display:inline-block; background:#fff;  width:1238px; height:70px; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_admin{padding-top:14px; display:inline-block; background:#fff;  width:1238px; height:auto; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}
.warning li.type_footer{padding-top:14px; display:inline-block; background:#333333;  width:1238px; height:50px; text-align:left; font-weight:bold; box-shadow:2px 2px 4px 0px #484E58;}

.min-height-300 { min-height: 300px !important; }
.min-height-400 { min-height: 400px !important; }
.min-height-500 { min-height: 500px !important; }
.min-height-600 { min-height: 600px !important; }
.min-height-700 { min-height: 700px !important; }
.min-height-800 { min-height: 800px !important; }
.min-height-900 { min-height: 900px !important; }
.min-height-1000 { min-height: 1000px !important; }
.min-height-50 { min-height: 50px !important; }
.min-height-100 { min-height: 100px !important; }
.min-height-200 { min-height: 200px !important; }

.nemo {border:1px solid #CBCBCB;}
/* table type1 */
.table_form{padding:15px 20px 10px 20px; clear:both;}
.tblType1{border-top:1px solid #CDCDCD;border-bottom:1px solid #CDCDCD;table-layout:fixed;}
.tblType1 th{height:30px;text-align:center;padding:0 6px 0 6px;background:#365EB4;color:#fff;font-size:12px;border-top:1px solid #dbdbdb;border-left:1px solid #dbdbdb; color: #333333; font-weight: bold;}
.tblType1 td{min-height:20px;padding:6px 10px 4px 10px;border-top:1px solid #dbdbdb;border-left:1px solid #dbdbdb; color: #333333;}
.tblType1 .center{text-align:center}
.tblType1 .scroll{text-align:left; max-height:90px; overflow:auto;}
.tblType1 .right{text-align:right}
.tblType1 th:first-child{border-left:none;}
.tblType1 td:first-child{border-left:none;}
.tblType1 tr:nth-child(odd) td{background:#F5F5F5;}
/* table type1 end */

/* table type2 */
.table_form2{padding:7px 20px 10px 20px; clear:both;}
.tblType2{border-top:1px solid #CDCDCD;border-bottom:1px solid #CDCDCD;table-layout:fixed;}
.tblType2 th{height:24px;text-align:center;padding:0 6px 0 6px;background:#F2F2F2;font-size:12px;border-top:1px solid #dbdbdb;border-left:1px solid #dbdbdb;}
.tblType2 td{min-height:18px;padding:3px 4px 1px 4px;border-top:1px solid #dbdbdb;border-left:1px solid #dbdbdb;border-right:1px solid #dbdbdb;}
.tblType2 .center{text-align:center}
.tblType2 .right{text-align:right}
.tblType2 .red{background-color:#F95150; height:15px; text-align:left; color:#fff; font-size:11px; font-weight:bold;}
.tblType2 .green{background-color:#78C440; height:15px; text-align:left; color:#fff; font-size:11px; font-weight:bold;}
.tblType2 .sky{background-color:#C6E4FD; height:15px; text-align:left; color:#fff; font-size:11px; font-weight:bold;}
.tblType2 .blue{background-color:#4d89f9; height:15px; text-align:left; color:#fff; font-size:11px; font-weight:bold;}
.tblType2 .topNone{border-top:0px;}
/* table type2 end */

.weeklyImage{width:270px; height : 175px!important; text-align: left;}

/* font */
.fontTypeK { font-family: Noto Sans KR, Malgun Gothic, 돋움, 굴림, Open Sans; }

/** Form **/
.s25 {height: 25px;}
select {font-size:12px; color:#7a7a7a; font-family: Dotum, arial; margin:0 0 2 0; background: url(/cloud/assets/common/images/selectbox_arrow2.png) 95.5% center no-repeat white;}
input.btn { vertical-align: middle; margin-left: 5px;}
input.btn_b { vertical-align: middle; margin: 0 0 0 3px;}
textarea.txt{ border:#cecece 1px solid; padding:5px; color:#676767; }

.input_main { background-color:transparent; border:solid 0px #CBCBCB; font-size:12px; color:#A7A7A7; width:184px; height:16px; vertical-align:middle; padding-left:0px; line-height:16px;}
select.cheak {vertical-align:middle; }

.input { background-color:#ffffff; border:solid 1px #CBCBCB; font-family:Dotum; font-size:12px;  color:#626262; height:20px; vertical-align:middle; padding-left:0px;}
select.cheak {vertical-align:middle; }

.input_top { background-color:#ffffff; border:solid 1px #CBCBCB; font-family:Dotum; font-size:12px;  color:#626262; height:20px; vertical-align:top; padding-bottom:0px;}
select.cheak {vertical-align:top; }

.input_bot { background-color:#ffffff; border:solid 1px #CBCBCB; font-family:Dotum; font-size:12px;  color:#626262; height:20px; vertical-align:bottom; padding-bottom:0px;}
select.cheak {vertical-align:bottom; }

.input02 { background-color:#eeeeee; border:solid 1px #cccccc; font-family:Dotum; font-size:12px;  color:#333333; width:100%; vertical-align:middle; padding-top:5px; padding-left:5px;}
select.cheak {vertical-align:middle; }
/** Form end **/

    .zt-skill-bar {
        color: #fff;
        font-size: 11px;
        line-height: 25px;
        height: 25px;
        margin-bottom: 5px;

        background-color: rgba(0,0,0,0.1);

        -webkit-border-radius: 2px;
           -moz-border-radius: 2px;
            -ms-border-radius: 2px;
                border-radius: 2px;

    }

    .zt-skill-bar * {
        webkit-transition: all 0.5s ease;
          -moz-transition: all 0.5s ease;
           -ms-transition: all 0.5s ease;
            -o-transition: all 0.5s ease;
               transition: all 0.5s ease;
    }

    .zt-skill-bar div {
        background-color: #ffc600;
        position: relative;
        padding-left: 25px;
        width: 0;

        -webkit-border-radius: 2px;
           -moz-border-radius: 2px;
           -ms- border-radius: 2px;
                border-radius: 2px;
    }

    .zt-skill-bar span {
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        padding: 0 5px 0 10px;
        background-color: #1a1a1a;

        -webkit-border-radius: 0 2px 2px 0;
           -moz-border-radius: 0 2px 2px 0;
            -ms-border-radius: 0 2px 2px 0;
                border-radius: 0 2px 2px 0;
    }

    .zt-skill-bar span:before {
        content: "";
        position: absolute;
        width: 6px;
        height: 6px;
        top: 50%;
        left: -3px;
        margin-top: -3px;
        background-color: #1a1a1a;

        -webkit-transform: rotate(45deg);
           -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
                transform: rotate(45deg);
    }
    
/* marquee */
.marquee {
  width: 100%;

  position: absolute;
  overflow: hidden;

  animation: marquee 5s linear infinite;
  float: left;
}

@keyframes marquee {
  0% { left: 0; }
  100% { left: -100%; }
}
    
/**  kcim logo  **/
.logo {
	display: block;
    margin: 0 auto;
    /*height: 60px;*/
    min-height: 30px;
    width: 270px;
}

/* btn */
.btnDirection {
	font-style: normal;
    font-family: 'FontAwesome';
    font-size: 40px;
    cursor: pointer;
    color: #5AA6ED;
}
.btnDirection:hover {
	color: #5AA6EDbf;
}	

.button_base {
	font-weight:bold;
	border-radius: 2px;
	padding:0px 5px;
	vertical-align: middle;
}

.button_base:hover {
    cursor: pointer;
}

.button_type1 {
	padding:5px 15px;
	font-weight:bold;
	border-radius:2px;
	font-size:13px;	
}

.button_type2 {
	padding: 3px 10px; 
	font-weight:bold; 
	border-radius:2px;
}
.button_r {
	float:right;
	padding-bottom: 0px;
}
.button_l {
	float:left;
}


.b01 {
    color: #ffffff;
    border: #5AA6ED solid 1px;
    background-color: #5AA6ED;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
    border-radius: 4px;
    border: 0;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    font-size: 15px;
    height: 3.5rem;
    line-height: 2.95rem;
    padding: 0 5rem;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    text-transform: uppercase;
}

.b01:hover {
    color: #ffffff;
    border-color: #5AA6EDbf;
    background-color: #5AA6EDbf;
}


.b02 {
    color: #ffffff;
    border: #5AA6ED solid 2px;
    background-color: #5AA6ED;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
    border: 0;
    cursor: pointer;
    display: inline-block;  
    /*font-weight: bold;*/
    font-size: 12px;
    width: 80px; 
    height: 30px;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    text-transform: uppercase;
}

.b02:hover {
    color: #ffffff;
    border-color: #5AA6EDbf;
    background-color: #5AA6EDbf;
}

/*	search input	*/
 #uSearch, #lSearch, #pSearch {  
   	/*width: 30%;
   	margin-bottom:10px;*/
}


@media screen and (max-width: 736px) {
	.b02{
		width: 65px !important;
	}
	.button_l {
		float:none;
	}
	.button_r {
		float:none;
		padding-bottom: 10px;
	}
	#uSearch, #lSearch, #pSearch {
    	width: -webkit-calc(80% - 75px);
   		width: -moz-calc(80% - 75px);
   		width: calc(80% - 75px);
	}
}


	.textType2{
		font-family: 'Noto Sans KR';
		font-style: normal;
		font-weight: 700;
		font-size: 24px;
		line-height: 35px;
		align-items: center;
		text-align: center;
		color: #1D3A54;
	}
	.textType3{
		font-family: 'Noto Sans KR';
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 26px;
		align-items: center;
		color: #1D3A54;
	}
	.textType4{
		font-family: 'Noto Sans KR';
		font-style: normal;
		font-weight: 700;
		font-size: 17px;
		line-height: 25px;
		align-items: center;
		text-align: center;
		color: #000000;
	}


/*summernote*/
.note-editable {
    /* font-family: 'Poppins' !important;  */
    font-size: 15px !important; 
    text-align: left !important; 
}

.b_eidt {
	position: absolute;
	transform: translate(-50%, -50%);
    min-width: 50px;
    height: 24px;
	color: #777;
    border-color: #55a0ff;
    background-color: #fff;
    border: 1px solid #d5d5d5;
}

.b_eidt:focus {
	outline: #5aa6ed;
}

.b_eidt:hover {
	color: #55a0ff;
	border: 1px solid #5aa6ed;
}

.b_save {
	color: #ffffff;
    border: #5AA6ED solid 1px;
    background-color: #5AA6ED;
    width: 50px;
    height: 30px;
}

.b_save:hover {
    color: #ffffff;
    border-color: #5AA6EDbf;
    background-color: #5AA6EDbf;  
}

.b_del{
    color: #ffffff;
    border: #e86652 solid 1px;
    background-color: #e86652;
}

.b_del:hover {
    color: #ffffff;
    border-color: #e67f6f;
    background-color: #e67f6f;
}

.b_cancel{
    color: #ffffff;
    border: #8c8c8c solid 1px;
    background-color: #8c8c8c;
    width: 50px;
    height: 30px;
}

.b_cancel:hover {
    color: #ffffff;
    border-color: #e4e4e4;
    background-color: #e4e4e4;
}

.b_Add{
    color: #ffffff;
    border: #309bd4 solid 1px;
    background-color: #309bd4;
}

.b_Add:hover {
    color: #ffffff;
    border-color: #309bd4bf;
    background-color: #309bd4bf;
}

.menu_btn {
	border:none; 
	background-color:transparent; 
	float:right; 
	margin-right:20px;
}

.menu_btn:hover {
	opacity:.7;
}

.img_c:hover{
	opacity:.7;
}

.t_title24_2{
	font-family: NotoSansKR;
	font-size: 24px;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.46;
	letter-spacing: normal;
	text-align: center;
	color: var(--default-grey);
}

.t_title24{
	color: var(--unnamed-color-656565);
	text-align: left;
	font: normal normal bold 24px/26px Noto Sans KR;
	letter-spacing: 0px;
	color: #656565;
	opacity: 1;	
}

.t_title35{
	color: var(--unnamed-color-656565);
	text-align: left;
	font: normal normal bold 24px/35px Noto Sans KR;
	letter-spacing: 0px;
	color: #656565;
	opacity: 1;
}

.t_content16{
	color: var(--unnamed-color-0092b9);
	text-align: left;
	font: normal normal normal 16px/24px Noto Sans KR;
	letter-spacing: 0px;
	color: #0092B9;
	opacity: 1;
}

.t_content16_2{
	color: var(--unnamed-color-656565);
	text-align: left;
	font: normal normal normal 16px/24px Noto Sans KR;
	letter-spacing: 0px;
	color: #656565;
	opacity: 1;
}

.t_content14{
	color: var(--unnamed-color-656565);
	text-align: left;
	font: normal normal normal 14px/20px Noto Sans KR;
	letter-spacing: 0px;
	color: #656565;
	opacity: 1;
}

.t_content12{
	color: var(--unnamed-color-656565);
	text-align: left;
	font: normal normal normal 12px/17px Noto Sans KR;
	letter-spacing: 0px;
	color: #656565;
	opacity: 1;
}

.t_content12:hover {color:#0092B9}
.t_content12:active {color:#005267}

.imtext {
	position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    z-index:1;
    text-align: center;
	font: normal normal bold 54px/79px Noto Sans KR;
	letter-spacing: 0px;
	color: #FFFFFF;
	opacity: 1;
}