@charset "utf-8";
@import url("font.css");
@import url("swiper.css");
@import url("common.css");
@import url("AB.css");
@import url("AP.css");
@import url("BS.css");
@import url("CM.css");
@import url("LB.css");
@import url("MB.css");
@import url("NB.css");
@import url("PB.css");
@import url("PT.css");
@import url("RD.css");
@import url("SB.css");
@import url("KW.css");
@import url("EB.css");
@import url("tomato.css"); 

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, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, article, aside, hgroup, header, footer, figure, figcaption, nav, section  { margin:0; padding:0; list-style:none; /* color:#333; */}
.cl-control { color:#333 }

/* ====== common ====== */
.cl-embeddedpage.full { right:0; width:auto !important;}

.curP { cursor:pointer !important;}

.layoutContent { min-width:1280px;}

.bodyContentWrap { background:#f5f6f8;} 
.bodyContentWrap > .cl-scrollbar:before { content:''; display:block; position:absolute; top:0; left:0; right:0; height:260px; background:#3d5199;}
.bodyContentWrap.mainBg > .cl-scrollbar:before {height:310px;}


.contentWrap { overflow:inherit !important;; width:1280px !important; padding:0 40px 50px; margin:0 auto;}
.contentWrap > .cl-scrollbar { overflow:inherit !important;}

.contentBox {padding:30px 40px 40px; margin-bottom:28px; border-radius:5px; box-shadow:0 0 8px rgba(0,0,0,0.3) !important;}
.contentBox > .cl-scrollbar { overflow:visible !important;}


.contentTitle {}
.contentTitle .contentTitleBox { display:table-cell; height:170px; vertical-align:middle;}
.contentTitle h1 { font-size:35px; color:#fff; font-weight:normal;}
.contentTitle h1 strong { font-weight:800; font-size:35px; color:#fff;}
.contentTitle h1 + p { margin-top:15px; font-size:17px; color:#fff;}
.contentTitle .stepText { margin-top:90px; font-size:15px; font-weight:800; color:#fff; text-align:right;}
.contentTitle .stepText .num { display:inline-block; margin-left:10px; font-size:35px; font-weight:normal; letter-spacing: 8px; color:#fff;}
.contentTitle .stepText .num strong { font-size:35px; font-weight:800; color:#fff;}

.flexCenter { justify-content:center;}

/* 메인박스 영역 */
.mainContentWrap { overflow:inherit !important; min-width:1050px; max-width:1690px; margin: 0 auto;}
.mainContentWrap > .cl-scrollbar { overflow:inherit !important;}

.mainContentWrap .contentBox { min-height:560px; padding:30px 40px; margin-bottom:100px;}
.mainContentWrap .contentBox.minHeightNone { min-height:inherit;}

.mainContentWrap .contentTitle .contentTitleBox { height:auto; min-height:104px; padding:38px 0 28px;}
.mainContentWrap .contentTitle h1 { color:#333;}
.mainContentWrap .contentTitle h1 strong { color:#333;}
.mainContentWrap .contentTitle h1 + p { color:#666;}

.mainContentWrap .stepText { margin-top:75px; font-size:15px; font-weight:800; color:#0c91e5; text-align:right;}
.mainContentWrap .stepText .num { display:inline-block; margin-left:10px; font-size:35px; font-weight:normal; letter-spacing: 8px; color:#888;}
.mainContentWrap .stepText .num strong { font-size:35px; font-weight:800; color:#0c91e5;}

.boxWrap { max-width:1200px; margin:0 auto;}

/* 네비게이션바 - 근데 위치가 맨아래에 나온다?? */
.cl-navigationbar-list { border-top:0; background:#292b30;}
.cl-navigationbar-list * { font-size:17px;}
.cl-navigationbar-list .cl-navigationbar-listitem { padding:15px 30px 15px 25px; color:#888888;}
.cl-navigationbar-list .cl-navigationbar-listitem:not(.cl-disabled):not(.cl-selected):hover,
.cl-navigationbar-list .cl-navigationbar-listitem:not(.cl-disabled).cl-hover,
.cl-navigationbar-list .cl-navigationbar-listitem.cl-hover { color:#fff; background:none;}
.cl-navigationbar-list .cl-navigationbar-listitem.cl-selected {} 

/* footer */
.layoutFooterWrap { border-top:1px solid #dbdbdb;}
.layoutFooterWrap.mainSub{background:#f5f6f8;}
.layoutFooterWrap .footerText { margin-top:38px;}
.layoutFooterWrap .footerText ul { overflow:hidden;}
.layoutFooterWrap .footerText ul li { float:left; margin-right:27px;}
.layoutFooterWrap .footerText ul li a { text-decoration:none; /*font-weight:bold;*/ font-size:15px; color:#333;}
.layoutFooterWrap .footerText .tel { margin-top:20px; font-size:13px; color:#888;}
.layoutFooterWrap .footerText .tel strong { display:inline-block; margin-right:10px; padding-right:10px; border-right:1px solid #adadad; color:#888; font-size:13px; font-weight:normal;}
.layoutFooterWrap .footerText .tel span { color:#888; font-size:13px;}
.layoutFooterWrap .footerText .copy { margin-top:17px; color:#888; font-size:13px;}
.layoutFooterWrap .cl-combobox { border:2px solid #dbdbdb;}
.layoutFooterWrap .cl-combobox.cl-focus { border:2px solid #31a6dd; color:#333;}
/* 이윤경 */
.layoutFooterWrap .cl-container {width:1200px !important;}
.layoutFooterWrap .cl-layout.cl-scrollbar {overflow-x:hidden !important;}
.layoutFooterWrap .footerText .info { margin-top:5px; }
.layoutFooterWrap .footerText .info b, .layoutFooterWrap .footerText .info span { color:#333; font-size:13px;}
.layoutFooterWrap .footerText .info b { margin-left:22px;}
.layoutFooterWrap .footerText .info b:first-child { margin-left:0;}


/* ====== 폰트 ====== */

/* 박스타이틀 */
.boxTitle1 .cl-text{font-size:24px;color:#333;font-weight:800;}

/* 페이지 타이틀 */
.pageTitle1,
.pageTitle1 .cl-text{font-size:30px !important;color:#333;font-weight:bold;}

/* 컨텐츠 타이틀 */
.title1 { margin-bottom:30px;}
.title1.mb { margin-bottom:0;}
.title1.mt { margin-top:70px;}
.title1, .title1 .cl-text{font-size:28px;color:#333;font-weight:bold;}
.title2, .title2 .cl-text{font-size:20px;color:#333;font-weight:bold;}
.title3, .title3 .cl-text{font-size:17px;color:#333;font-weight:800;}

/* 폼박스 타이틀*/
.title4,
.title4 .cl-text,
.title4 .cl-htmlsnippet *{font-size:17px;color:#666;font-weight:bold;}

/* 글자 작은 사이즈 */
.smallText1, .smallText1 .cl-text { font-size:15px !important; color:#666;}
.smallText2,  .smallText2 .cl-text { font-size:13px !important; color:#666;}

/* 글자 줄바꿈  */
.txtWS {white-space:pre-wrap;}

/* 글자 색상 */
.txtRed1,
.txtRed1 .cl-text { color:#f4516c !important;}
.txtRed2,
.txtRed2 .cl-text { color:#fd2d2d !important;}
.txtRed3,
.txtRed3 .cl-text { color:#fc9b3d !important;}
.txtBlue1,
.txtBlue1 .cl-text { color:#0c91e5 !important;}
.txtBlue2,
.txtBlue2 .cl-text { color:#2382d3 !important;}
.txtBlue3,
.txtBlue3 .cl-text { color:#28aedb !important;}
.txtBlue4,
.txtBlue4 .cl-text { color:#85c8f2 !important;}
.txtBlue5,
.txtBlue5 .cl-text { color:#3d5199 !important;}
.txtGreen1,
.txtGreen1 .cl-text { color:#06a2b4 !important;}
.txtBlack1,
.txtBlack1 .cl-text { color:#333333 !important;}
.txtBlack2,
.txtBlack2 .cl-text { color:#666 !important;}
.txtBlack3,
.txtBlack3 .cl-text { color:#888 !important;}
.txtBlack4,
.txtBlack4 .cl-text { color:#9ea3aa !important;}
.txtGray1,
.txtGray1 .cl-text { color:#f5f6f8 !important;}
.txtGray2,
.txtGray2 .cl-text { color:#cccccc !important;}
.txtGray3,
.txtGray3 .cl-text { color:#dbdbdb !important;}
.txtWhite,
.txtWhite .cl-text { color:#fff !important;}

/* 폰트크기 */
.f11,
.f11 .cl-text{font-size:11px !important}
.f13,
.f13 .cl-text{font-size:13px !important}
.f15,
.f15 .cl-text {font-size:15px !important}
.f20,
.f20 .cl-text {font-size:20px !important}
.f25,
.f25 .cl-text {font-size:25px !important}
.f30,
.f30 .cl-text {font-size:30px !important}
/* 정렬 */
.txtCenter, .txtCenter .cl-text { text-align:center !important;}
.txtRight, .txtRight .cl-text { text-align:right !important;}
.txtLeft, .txtLeft .cl-text { text-align:left !important;}

/* 정렬 - 플로우 레이아웃일때 */
.txtCenter .cl-layout > .cl-layout-content { text-align:center !important;}
.txtRight .cl-layout > .cl-layout-content { text-align:right !important;}

.txtNormal,
.txtNormal .cl-text { font-weight:normal !important;}
.txtBold,
.txtBold .cl-text { font-weight:bold !important;}
.txtExBold,
.txtExBold .cl-text {  font-weight:800 !important;}


/* 테이블 용을 바꾸기 */
.disTb { display:table !important;}
.disTbC { display:table-cell !important;}


/* 글자 자르기 */
.txtCut > div { display:block !important;}
.txtCut .cl-text { overflow:hidden; display:block !important; white-space: nowrap;text-overflow: ellipsis;}

/* 혹시 몰라 넣어놓는 간격들 */
.mt-5 { margin-top:-5px !important;}
.mt0 { margin-top:0px !important;}
.mt5 { margin-top:5px !important;}
.mt10 { margin-top:10px !important;}
.mt15 { margin-top:15px !important;}
.mt20 { margin-top:20px !important;}
.mt25 { margin-top:25px !important;}
.mt30 { margin-top:30px !important;}
.mt35 { margin-top:35px !important;}
.mt40 { margin-top:40px !important;}
.mt45 { margin-top:45px !important;}
.mt50 { margin-top:50px !important;}
.mt55 { margin-top:55px !important;}
.mt60 { margin-top:60px !important;}
.mt80 { margin-top:80px !important;}
.mb0 { margin-bottom:0px !important;}
.mb5 { margin-bottom:5px !important;}
.mb10 { margin-bottom:10px !important;}
.mb15 { margin-bottom:15px !important;}
.mb20 { margin-bottom:20px !important;}
.mb25 { margin-bottom:25px !important;}
.mb30 { margin-bottom:30px !important;}
.mb35 { margin-bottom:35px !important;}
.mb40 { margin-bottom:40px !important;}
.mb45 { margin-bottom:45px !important;}
.mb50 { margin-bottom:50px !important;}
.mb55 { margin-bottom:55px !important;}
.mb60 { margin-bottom:60px !important;}
.mb65 { margin-bottom:65px !important;}
.mb70 { margin-bottom:70px !important;}
.ml20 { margin-left:20px !important;}
.p0 {padding:0 !important}
.pt0 { padding-top:0px !important;}
.pt5 { padding-top:5px !important;}
.pt10 { padding-top:10px !important;}
.pt15 { padding-top:15px !important;}
.pt20 { padding-top:20px !important;}
.pt25 { padding-top:25px !important;}
.pt30 { padding-top:30px !important;}
.pt35 { padding-top:35px !important;}
.pt40 { padding-top:40px !important;}
.pt45 { padding-top:45px !important;}
.pt50 { padding-top:50px !important;}
.pt55 { padding-top:55px !important;}
.pt60 { padding-top:60px !important;}
.pt80 { padding-top:80px !important;}
.pb0 { padding-bottom:0px !important;}
.pb5 { padding-bottom:5px !important;}
.pb10 { padding-bottom:10px !important;}
.pb15 { padding-bottom:15px !important;}
.pb20 { padding-bottom:20px !important;}
.pb25 { padding-bottom:25px !important;}
.pb30 { padding-bottom:30px !important;}
.pb35 { padding-bottom:35px !important;}
.pb40 { padding-bottom:40px !important;}
.pb45 { padding-bottom:45px !important;}
.pb50 { padding-bottom:50px !important;}
.pb55 { padding-bottom:55px !important;}
.pb60 { padding-bottom:60px !important;}
.pr20 { padding-right:20px !important;}
.pl30 { padding-left:30px !important;}


.ml20 { margin-left:20px !important}

/* ====== placeholder ====== */
.cl-inputbox ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}
.cl-inputbox ::-moz-placeholder { /* Firefox 19+ */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}
.cl-inputbox :-ms-input-placeholder { /* IE 10+ */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: rgba(255,0,0,0.8); */
}
.cl-inputbox :-moz-placeholder { /* Firefox 18- */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}

.cl-numbereditor {background:#fff !important}
/* ====== placeholder ====== */
.cl-numbereditor ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}
.cl-numbereditor ::-moz-placeholder { /* Firefox 19+ */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}
.cl-numbereditor :-ms-input-placeholder { /* IE 10+ */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: rgba(255,0,0,0.8); */
}
.cl-numbereditor :-moz-placeholder { /* Firefox 18- */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}

/* ====== form ====== */
/* checkbox */
.cl-checkbox { overflow:initial !important; padding-left:5px;}
.cl-checkbox:not(.cl-disabled) * { cursor:auto;}
.cl-checkbox .cl-checkbox-icon { position:relative; width:30px; height:30px; border:0; background: url('../images/common/icon_checkbox.png') no-repeat; }
.cl-checkbox.cl-disabled:hover .cl-checkbox-icon, .cl-checkbox.cl-disabled.cl-hover .cl-checkbox-icon { background : url('../images/common/icon_checkbox.png') no-repeat;}
.cl-checkbox.cl-partialchecked .cl-checkbox-icon {background: url(../images/common/icon_checkbox.png) no-repeat;}
.cl-checkbox.cl-checked .cl-checkbox-icon { border:0; background:url('../images/common/icon_checkbox_on.png') no-repeat;}
.cl-checkbox .cl-text { padding-top:2px; padding-left:15px; font-size:15px;}
.cl-checkbox > div > div > div * { cursor: pointer !important;}

.cl-checkbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked):hover .cl-checkbox-icon { background:url('../images/common/icon_checkbox.png') no-repeat;}
.cl-checkbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked):hover .cl-checkbox-icon,
.cl-checkbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked).cl-hover .cl-checkbox-icon {
   border-radius:50%; background:url('../images/common/icon_checkbox_press.png') no-repeat;  background-size:cover;
}
.cl-checkbox .cl-checkbox-icon:before,
.cl-checkbox .cl-checkbox-icon:before {
	content:''; display:block; position:absolute; top:0px; left:0px; right:0px; bottom:0px; border:0; transition:all .1s ease;
	 border-radius:50%;
}
.cl-checkbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked):hover .cl-checkbox-icon:before,
.cl-checkbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked).cl-hover .cl-checkbox-icon:before {
	top:-5px; left:-5px; right:-5px; bottom:-5px; border:5px solid #bae1f3;
}

.cl-checkbox.cl-readonly { opacity:0.4;}

.cl-checkbox.smallCheckbox .cl-checkbox-icon { position:relative; width:22px; height:22px; border:0; background:url('../images/common/icon_checkbox_s.png') no-repeat;}
.cl-checkbox.smallCheckbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked):hover .cl-checkbox-icon { background:url('../images/common/icon_checkbox_s.png') no-repeat;}
.cl-checkbox.smallCheckbox .cl-text { padding-left:10px;}
.cl-checkbox.smallCheckbox.cl-checked .cl-checkbox-icon {background:url('../images/common/icon_checkbox_s_on.png') no-repeat;}

/* 테이블 안쪽 체크박스 */
.cl-grid-cell .cl-checkbox .cl-checkbox-icon { position:absolute; top:50%; left:50%; width:22px !important; height:22px !important; margin:-11px 0 0 -11px; background-size:cover;}
.cl-grid-cell .cl-checkbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked):hover .cl-checkbox-icon { background-size:cover;}

/* radio */
.cl-radiobutton .cl-radiobutton-item { padding:0 5px;}
.cl-radiobutton.cl-disabled .cl-radiobutton-item:hover .cl-radiobutton-icon,
.cl-radiobutton.cl-disabled .cl-radiobutton-item.cl-hover .cl-radiobutton-icon,
.cl-radiobutton .cl-radiobutton-item .cl-radiobutton-icon { position:relative; width:18px; height:18px; padding:3px; margin-top:-1px; border-radius:50%; border:1px solid transparent; background:#cccccc; background-clip: content-box;}
.cl-radiobutton .cl-radiobutton-item .cl-text { padding-left:5px; vertical-align:middle; font-size:15px;}
.cl-radiobutton:not(.cl-disabled) .cl-radiobutton-item, .cl-radiobutton:not(.cl-disabled) .cl-radiobutton-item * { vertical-align:middle;}
.cl-radiobutton:not(.cl-disabled) .cl-radiobutton-item:not(.cl-selected):not(.cl-disabled):hover .cl-radiobutton-icon {
  border:1px solid #209dd8; background:#cccccc; background-clip: content-box;
}

.cl-radiobutton .cl-radiobutton-item .cl-radiobutton-icon:before {
  content:''; display:block; position:absolute; top:-1px; left:-1px; right:-1px; bottom:-1px; border:0; border-radius:50%; transition:all .1s ease;
}

.cl-radiobutton:not(.cl-disabled) .cl-radiobutton-item:not(.cl-selected):not(.cl-disabled):hover .cl-radiobutton-icon:before {
  top:-6px; left:-6px; right:-6px; bottom:-6px; border:5px solid #b6def7;
}

.cl-radiobutton .cl-radiobutton-item.cl-selected .cl-radiobutton-icon,
.cl-radiobutton .cl-radiobutton-item.cl-selected:hover .cl-radiobutton-icon { border:0; background:url('../images/common/icon_radio_on.png') no-repeat;}


/* toggle */
.toggleInput { padding:0px;}
.toggleInput > div { display:block !important; position:relative; padding:0 5px;}
.toggleInput > div > div {/*  display:none !important; */}
.toggleInput > div > div .cl-checkbox-icon { opacity:0;}
.toggleInput > div .cl-unselectable { z-index:1; display:block !important; position:absolute; top:0; left:0; right:0; bottom:0; opacity:0;}
.toggleInput > div:before { content:''; display:block; position:absolute; top:50%; left:5px; right:5px; height:12px; margin-top:-6px; border-radius:15px; background:#cccccc;}
.toggleInput > div:after { content:''; display:block; position:absolute; top:50%; left:10px; width:16px; height:16px; margin-top:-8px; box-shadow:0px 0px 4px rgba(0,0,0,0.3); border-radius:50%; background:#fff; transform:translateX(-50%); transition:all .3s ease;}
.toggleInput.cl-checked > div:before { background:#b6def7;}
.toggleInput.cl-checked > div:after { left:100%; margin-left:-10px; background:#0c91e5;}

.toggleInput.toggleText > div .cl-unselectable { opacity:1; top:10px; left:9px; right:9px; padding-left:0; text-align:right; color:#fff; font-size:0; }
.toggleInput.toggleText > div:before { height:20px; margin-top:-10px;}
.toggleInput.toggleText > div:after { margin-top:-8px; margin-left:5px;}
.toggleInput.toggleText.cl-checked > div:after { margin-left:-16px;}
.toggleInput.toggleText.cl-checked > div .cl-unselectable { text-align:left;}

.cl-grid .toggleInput > div:after { transition:initial;}

/* select */
.cl-linkedcombobox .cl-linkedcombobox-combo { width:200px; border:1px solid #dbdbdb; border-radius:4px; color:#333; background:#fff; transition:all .3s ease;}
.cl-linkedcombobox.full > div { width:100%;}
.cl-linkedcombobox.full .cl-linkedcombobox-combo { width:auto;}
.cl-linkedcombobox .cl-linkedcombobox-combo .cl-text { padding-left:5px; font-size:17px; font-weight:bold;}
.cl-linkedcombobox .cl-linkedcombobox-combo .cl-linkedcombobox-button { width:30px; background:url('../images/common/icon_select_arrow.png') no-repeat center center;}
.cl-linkedcombobox.cl-focus .cl-linkedcombobox-combo { border:1px solid #dbdbdb;}
.cl-linkedcombobox .cl-linkedcombobox-combo.cl-focus { border:1px solid #31a6dd;}

.cl-linkedcombobox-list { margin-top:-5px; border:0; background:#fff;}
.cl-linkedcombobox-list.cl-popup { border:1px solid #31a6dd;  border-radius:0 0 3px 3px; box-shadow:0 0 0 ;}
.cl-linkedcombobox-list .cl-linkedcombobox-item { padding:10px; color:#000;}
.cl-linkedcombobox-list .cl-linkedcombobox-item.cl-disabled.cl-selected { color: #fff; background-color: #1c9bd7;}

.cl-combobox { border:1px solid #dbdbdb; border-radius:4px; background:#fff; transition:all .3s ease;} 
.cl-combobox .cl-text { padding-left:15px; font-size:17px;}
.cl-combobox .cl-combobox-button { width:40px;height:100% !important;background:url('../images/common/icon_select_arrow.png') no-repeat center center;}
.cl-combobox.cl-focus { border:1px solid #31a6dd; color:#333;}
.cl-combobox.cl-focus .cl-text { font-size:17px;}


/* input */
.cl-inputbox{ position:relative; border:0; border-radius:4px; font-size:17px; background:#fff;/*  background:#ccefff; */}
.cl-inputbox:before{ content:''; display:block; position:absolute; top:0px; left:0px; right:0px; bottom:0px; border-radius:3px; border:1px solid #dbdbdb; transition:all .3s ease;}
/* */ 
.cl-inputbox .cl-text { position:relative; z-index:1; padding:0 15px; border-radius:4px; box-sizing:border-box;}
.cl-inputbox .cl-text[type=password] { font-size:20px; font-family:'dotum', sans-serif !important;}

/* 2019-05-25 나눔스퀘어 글자 들썩거림 문제로 다른방법으로 해결
.cl-inputbox { height:100%;}
.cl-inputbox .cl-text { position:relative; top:50%; left:0; z-index:1; height:40px; padding:0 15px; border-radius:4px; line-height:40px; box-sizing:border-box; transform:translateY(-50%)}
.cl-inputbox .cl-text[type=password] { font-size:20px; font-family:'dotum', sans-serif !important;}
*/

.cl-inputbox.cl-focus:before { z-index:1; border-width:1px; border-color:#31a6dd;}

.cl-inputbox.error:before {border:1px solid #ff0000;}
.cl-inputbox.error .cl-text { color:#ff0000;}
.cl-inputbox.error:after { content:''; display:block; position:absolute; top:50%; right:10px; width:24px; height:24px; margin-top:-12px; background:url('../images/common/icon_error.png') no-repeat;}

.cl-inputbox.cl-readonly{ background:#f2f2f2;}
.cl-inputbox.cl-readonly .cl-text { color:#666666;}
.cl-inputbox.cl-readonly.cl-focus:before { border:1px solid #dbdbdb;}

/* html스니펫 안에 있는 input */
.commonInput input { min-height:50px;width:100%; padding:0 15px; border-radius:3px; border:1px solid #dbdbdb; background:#fff; /* background:#ccefff; */ transition:border .3s ease;}
.commonInput input:focus { border-color:#31a6dd;}

.commonInput input[disabled=true] { border:1px solid #dbdbdb; color:#666666; background:#f2f2f2;}

.commonInput input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}
.commonInput input::-moz-placeholder { /* Firefox 19+ */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}
.commonInput input:-ms-input-placeholder { /* IE 10+ */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: rgba(255,0,0,0.8); */
}
.commonInput input:-moz-placeholder { /* Firefox 18- */
	font-size: 17px !important;
	font-family: "NanumSquare", sans-serif !important;
  /* color: red; */
}

/* input password */
.cl-inputbox .cl-text[type=password],
.commonInput input[type=password] {font-size:18px; font-family:Verdana, sans-serif !important;}
/* chrome */
@media screen and (-webkit-min-device-pixel-ratio:0){
	.cl-inputbox .cl-text[type=password],
	.commonInput input[type=password] {font-size:20px; font-family:Verdana, sans-serif !important;}
}
/* edge */
@supports (-ms-ime-align:auto) {
	.cl-inputbox .cl-text[type=password],
	.commonInput input[type=password] {font-size:17px; font-family:'NanumSquare', sans-serif !important;}
}


/* placeholder */
.error ::-webkit-input-placeholder { color:#ff0000;}
.error ::-moz-placeholder { color:#ff0000;}
.error :-ms-input-placeholder {color:rgba(255,0,0,0);}
.error :-moz-placeholder { color:#ff0000;}


/* 글자 폰트 관련 - 입력 태그 수정  2019-02-25 */
/* 2019-05-15 폰트 변경으로 해당 기능 삭제 
input.cl-text,
textarea.cl-text { font-family: "맑은 고딕", "Malgun Gothic", sans-serif !important;}
*/
.cl-linkedcombobox-combo input.cl-text,
.cl-combobox input.cl-text { font-family: NanumSquare, sans-serif !important;}

/* textarea */
.cl-textarea {border: 1px solid #e0e0e0; transition:all .3s ease; background:none;}
.cl-textarea.cl-focus { border-color:#31a6dd !important;}
.cl-textarea.error{border-color:#ff0000 !important;}
.cl-textarea .cl-text { font-size:17px; line-height:1.5;}

.msg .cl-textarea { border:0;}

.textareaNone { background:none;}

/* ====== calendar ====== */
/* 스니펫 달력 */
.snippetDateWrap {height:40px !important;}
.snippetDateWrap .dateBtn{border:0;position:relative;width:40px;height:40px;background: url(../images/common/icon_calendar.png) no-repeat center center;}
.snippetDateWrap .dateBtn.cl-focus { border:0;}
.snippetDateWrap .dateBtn.cl-focus:before { border-color:#1c9bd7;}
.snippetDateWrap .dateBtn.cl-focus,
.snippetDateWrap .dateBtn:hover{background:url('../images/common/icon_calendar_on.png') no-repeat center center !important;}
.snippetDateWrap .dayInfoTxt{height:40px;line-height:40px;color:#333;font-size:24px;}
.snippetDateWrap .dayInfoTxt span{font-size:24px;font-weight:800;}


.dateTermChk { position:relative; width:100%; max-width:365px; border-radius:4px; border:1px solid #dbdbdb;}
.dateTermChk.cl-disabled > .cl-scrollbar{background-color:#F2F2F2;}
.full .dateTermChk { max-width:100%;}

.cl-dateinput { position:relative; border:0;}
.cl-dateinput .cl-text { position:relative; z-index:1; padding:0 10px; border-radius:3px; box-sizing:border-box;text-align:center;color:#888}
.cl-dateinput .cl-dateinput-button { position: relative; width:42px; height:100%; background:url('../images/common/icon_calendar.png') no-repeat center center;}
.cl-dateinput.cl-disabled .cl-dateinput-button{background:url('../images/common/icon_calendar.png') no-repeat center center;}
.cl-dateinput:before { content:''; display:block; position:absolute; top:0px; left:0px; right:0px; bottom:0px;  border-radius:3px; border:1px solid transparent;}
.cl-dateinput.cl-focus { border:0;}
.cl-dateinput.cl-focus:before { border-color:#1c9bd7;}
.cl-dateinput.cl-focus .cl-dateinput-button {background:url('../images/common/icon_calendar_on.png') no-repeat center center;}

.dateSingle .cl-dateinput:before { border:1px solid #dbdbdb; transition:all .3s ease;}
.dateSingle .cl-dateinput.cl-focus:before { border-color:#1c9bd7;}

/* 달련 내부 */
.cl-calendar { width:266px !important; border:1px solid #2382d3;}
.cl-calendar .cl-calendar-header { padding:16px; background:#2382d3;}
.cl-calendar .cl-calendar-header .cl-calendar-header-text { color:#fff !important; font-size:15px;}
.cl-calendar .cl-calendar-field .cl-calendar-content-wrapper { padding:10px 10px 5px 10px;}
.cl-calendar .cl-calendar-content th { background:#fff;}
.cl-calendar .cl-calendar-field .cl-calendar-footer-wrapper { display:none;}
.cl-calendar .cl-calendar-content td.cl-calendar-content-day.cl-selected, .cl-calendar .cl-calendar-content td.cl-calendar-content-month.cl-selected, .cl-calendar .cl-calendar-content td.cl-calendar-content-year.cl-selected { box-shadow: none; background:#4f6a8f;}
.cl-calendar .cl-calendar-content td.cl-calendar-content-day.cl-calendar-defaultdate, .cl-calendar .cl-calendar-content td.cl-calendar-content-month.cl-calendar-defaultdate, .cl-calendar .cl-calendar-content td.cl-calendar-content-year.cl-calendar-defaultdate { color:#333}
.cl-calendar .cl-calendar-content-sun { color:#f86464;}
.cl-calendar .cl-calendar-content-sat { color:#0c91e5;}
.cl-calendar .cl-calendar-header .cl-calendar-header-before,
.cl-calendar .cl-calendar-header .cl-calendar-header-before:hover { background:url('../images/common/icon_calendar_arrow.png') no-repeat;}
.cl-calendar .cl-calendar-header .cl-calendar-header-prev,
.cl-calendar .cl-calendar-header .cl-calendar-header-prev:hover { background:url('../images/common/icon_calendar_arrow.png') no-repeat -30px 0;}
.cl-calendar .cl-calendar-header .cl-calendar-header-next,
.cl-calendar .cl-calendar-header .cl-calendar-header-next:hover { background:url('../images/common/icon_calendar_arrow.png') no-repeat -60px 0;}
.cl-calendar .cl-calendar-header .cl-calendar-header-after,
.cl-calendar .cl-calendar-header .cl-calendar-header-after:hover { background:url('../images/common/icon_calendar_arrow.png') no-repeat -90px 0;}
/* 오늘 날짜 */
.cl-calendar .cl-calendar-content .cl-calendar-content-day.cl-calendar-defaultdate { color:#fff; background:#4f6a8f;}

/* ====== pageindexer ====== */
.cl-pageindexer .cl-pageindexer-first, .cl-pageindexer .cl-pageindexer-last, .cl-pageindexer .cl-pageindexer-prev, .cl-pageindexer .cl-pageindexer-next, .cl-pageindexer .cl-pageindexer-index { border:0;}
.cl-pageindexer .cl-pageindexer-first { background:url('../images/common/icon_pageindexer.png') no-repeat;}
.cl-pageindexer .cl-pageindexer-prev { background:url('../images/common/icon_pageindexer.png') no-repeat -30px 0;}
.cl-pageindexer .cl-pageindexer-next { background:url('../images/common/icon_pageindexer.png') no-repeat -60px 0;}
.cl-pageindexer .cl-pageindexer-last { background:url('../images/common/icon_pageindexer.png') no-repeat -90px 0;}
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-first:not(.cl-selected):active { background:url('../images/common/icon_pageindexer.png') no-repeat;}
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-prev:not(.cl-selected):active { background:url('../images/common/icon_pageindexer.png') no-repeat -30px 0;}
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-next:not(.cl-selected):active { background:url('../images/common/icon_pageindexer.png') no-repeat -60px 0;}
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-last:not(.cl-selected):active{ background:url('../images/common/icon_pageindexer.png') no-repeat -90px 0;}

.cl-pageindexer .cl-pageindexer-index.cl-selected { border-color:#5e6671; background:#5e6671;}
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-first:not(.cl-selected).cl-hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-last:not(.cl-selected).cl-hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-prev:not(.cl-selected).cl-hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-next:not(.cl-selected).cl-hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-index:not(.cl-selected).cl-hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-first:not(.cl-selected):hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-last:not(.cl-selected):hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-prev:not(.cl-selected):hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-next:not(.cl-selected):hover,
.cl-pageindexer:not(.cl-disabled) .cl-pageindexer-index:not(.cl-selected):hover {
	color:#fff;
	background-color: #aaaaaa;
}


/* ====== button ====== */
/* 버튼 설정 초기화 */
.cl-button.btnReset{width:auto;background:none;border:0;border-radius:0;}
.cl-button.btnReset:not(.cl-disabled):hover{background:none;color:#666;}
.cl-button.btnReset:not(.cl-disabled).cl-active, .cl-button.btnReset:not(.cl-disabled):active{opacity:1;}

.cl-button.btnRadius { border-radius:25px !important;}
.cl-button.pointBg { position:relative;}

/* 버튼 타입 2버전만 사용*/
.cl-button.button1,
.cl-button.button2,
.cl-button.button5 { position:relative; transition:all .3s ease; font-weight:bold;}
.cl-button.button1:before,
.cl-button.button2:before,
.cl-button.button5:before { content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0); transition:all .3s ease;}
.cl-button.button1 .cl-text,
.cl-button.button2 .cl-text,
.cl-button.button5 .cl-text { position:relative; font-weight:bold;}
.cl-button.button1:hover,
.cl-button.button2:hover,
.cl-button.button5:hover { color:#fff;}
.cl-button.button1:hover:before,
.cl-button.button2:hover:before,
.cl-button.button5:hover:before { background:rgba(0,0,0,0.4);}
.cl-button[class*=button][class*=lineBg] { border:1px solid #cccccc; color:#666666; background:#fff;}
.cl-button[class*=button][class*=lineBg]:hover:before { display:none;}
.cl-button[class*=button].lineBg2 { border:2px solid #1c9bd7; color:#1c9bd7;}
.cl-button[class*=button].lineBg3 { border:2px solid #6f7689; color:#6f7689;}
.cl-button.button1.cl-disabled,
.cl-button.button2.cl-disabled,
.cl-button.button5.cl-disabled { background:#cccccc !important;}
.cl-button.cl-disabled:before { display:none !important;}


/* 버튼/라벨 색상  - bg */
.cl-button[class*=button].bg1 { background:#1c9bd7;}
.cl-button[class*=button].bg2 { background:#f4516c;}
.cl-button[class*=button].bg3 { background:#888888;}
.cl-button[class*=button].bg4 { background:#00becf;}
.cl-button[class*=button].bg5 { background:#49515c;}
.cl-button[class*=button].bg6 { background:#6f7689;}

/* 버튼 라인 색상  - lineBg */
.cl-button.lineBg1:hover{border-color:#0c91e5 !important; color:#0c91e5 !important;}
.cl-button.lineBg1 .cl-text{color:#333 !important;}

/* 버튼 아이콘 별 정리 */
.cl-button[class*=button].iconHome { background:#49515c;}
.cl-button[class*=button].iconHome button:before { content:''; display:inline-block; width:25px; height:21px; margin-top:-2px; margin-right:10px; vertical-align:middle; background:url('../images/common/icon_home.png') no-repeat;}

/* 버튼 정의 */
.cl-button.button1 { height:50px !important; border-radius:50px; text-shadow:none; border:0; color:#fff; font-size:17px; background:#788391;}

.cl-button.button2 { height:60px !important; border-radius:50px; text-shadow:none; border:0; color:#fff; font-size:20px; background:#788391;}

.cl-button.button3 { height:30px !important; border-radius:3px; text-shadow:none; border:1px solid #cccccc; color:#555555; font-size:13px; background:#fff !important;}
.cl-button.button3.btnColor1 { color:#fff; background:#45566c !important;}

.cl-button.button4 { height:25px !important; border-radius:15px; text-shadow:none; border:0; color:#fff; font-size:13px; font-weight:bold; background:#9098a2;}
.cl-button.button4:hover { color:#fff; background:#536070}
.cl-button.button4.padding { padding-left:10px; padding-right:10px;}

.cl-button.button5 { border-radius:5px; text-shadow:none; border:0; color:#fff; font-size:15px; font-weight:bold; background:#788391;}

.buttonRadio { border:1px solid #dbdbdb; border-radius:4px;}
.buttonRadio > div {height:100% !important;}
.buttonRadio > div > div > div:not(.cl-radiobutton-item) { display:none !important;}
.buttonRadio .cl-radiobutton-item { position:relative; height:48px; border:0; padding-top:3px; color:#888888; text-align:center; background:#fff;}
.buttonRadio .cl-radiobutton-item:before { content:''; display:block; position:absolute; top:0; bottom:0; left:0px; width:1px; height:48px; background:#e0e0e0;}
.buttonRadio .cl-radiobutton-item.cl-selected .cl-text { color:#1c9bd7; font-weight:bold;}
.buttonRadio .cl-radiobutton-item.cl-selected:after { content:''; display:block; position:absolute; top:0; left:0; right:0; z-index:1; height:44px; border-radius:4px; border:2px solid #1c9bd7;}
.buttonRadio .cl-radiobutton-item:first-child:before, 
.buttonRadio .cl-radiobutton-item.cl-selected:before{ display:none;} 
.buttonRadio .cl-radiobutton-item label {padding-top:3px;}
.buttonRadio.cl-radiobutton .cl-radiobutton-item .cl-text { padding-top:0; padding-left:1px; padding-bottom:2px;}
.cl-radiobutton.buttonRadio .cl-radiobutton-item > div > div { position: absolute; opacity: 0;}

/* .buttonRadio.cl-focus .cl-selected > div { outline:1px dotted #333;} */
.buttonRadio.cl-focus .cl-selected > div:before { content:''; display:block; position:absolute; top:2px; left:2px; right:2px; bottom:2px; height:42px; border:1px dotted #333;}

.buttonRadio.type2 { max-width:200px;}
.buttonRadio.type3 { max-width:300px;}
.buttonRadio.type4 { max-width:400px;}
.buttonRadio.type5 { max-width:500px;}


.buttonRadio.smallType1 { max-width:120px;}
.buttonRadio.smallType1 .cl-radiobutton-item { height:40px;}
.buttonRadio.smallType1 .cl-radiobutton-item:before { height:40px;}
.buttonRadio.smallType1 .cl-radiobutton-item.cl-selected:after { height:34px;}


.btnSearch .cl-text:before {content:''; display:inline-block; width:16px; height:16px; margin-right:5px; margin-left:-5px; vertical-align:middle; background:url('../images/common/btn_icon_search.png') no-repeat;}
.btnSearch:hover .cl-text:before { background-position:0 -16px;}

/* .btnReset .cl-text:before {content:''; display:inline-block; width:16px; height:16px; margin-right:5px; margin-left:-5px; vertical-align:middle; background:url('../images/common/btn_icon_reset.png') no-repeat;}
.btnReset:hover .cl-text:before { background-position:0 -16px;} */

.searchInputBox { height:50px !important; border:1px solid #dbdbdb; border-radius:3px;}
.searchInputBox .cl-inputbox:before { display:none;}
.searchInputBox .cl-button.btnSearch2,
.searchInputBox .cl-button.btnSearch2:hover { border:0; font-size:0; background:url(../images/MB/main_search_btn.png) center no-repeat !important}

[class*=button][class*=btnIcon] .cl-text:before {content:''; display:inline-block; width:16px; height:16px; margin-right:5px; vertical-align:middle; background:url('../images/common/icon_button1.png') no-repeat;}
[class*=button].btnIcon1:not([class*=textLink]) .cl-text:before { background-position:0 0;}
[class*=button].btnIcon2:not([class*=textLink]) .cl-text:before { background-position:-16px 0;}
[class*=button].btnIcon3:not([class*=textLink]) .cl-text:before { background-position:-32px 0;}
[class*=button].btnIcon4:not([class*=textLink]) .cl-text:before { background-position:-48px 0;}
[class*=button].btnIcon5:not([class*=textLink]) .cl-text:before { background-position:-64px 0;}
[class*=button].btnIcon6:not([class*=textLink]) .cl-text:before { width:15px; height:15px; background-position:-79px 0;}
[class*=button].btnIcon7:not([class*=textLink]) .cl-text:before { background-position:-110px 0;}
[class*=button].btnIcon8:not([class*=textLink]) .cl-text:before { background-position:-125px 0;}
[class*=button].btnIcon9:not([class*=textLink]) .cl-text:before { background-position:-94px 0;}
[class*=button].btnIcon10:not([class*=textLink]) .cl-text:before { background-position:-140px 0;}
[class*=button].btnIcon11:not([class*=textLink]) .cl-text:before { background-position:-156px 0;}
[class*=button].btnIcon12:not([class*=textLink]) .cl-text:before { background-position:-172px 0;}
[class*=button].btnIcon13:not([class*=textLink]) .cl-text:before { background-position:-187px 0;}
[class*=button].btnIcon14:not([class*=textLink]) .cl-text:before { background-position:-203px 0;}
[class*=button].btnIcon15:not([class*=textLink]) .cl-text:before { background-position:-220px 0;}

/* 텍스트 링크 - 아웃풋 하나만 사용하는 경우 */
.textLink1 { height:20px !important; border:0; text-align:left; font-size:13px; color:#666; background:none; }
.textLink1 .cl-text { font-size:13px; color:#666; cursor:pointer;}
.textLink1 .cl-text:after { content:''; display:inline-block; width:6px; height:10px; margin-left:5px; margin-top:-1px; vertical-align:middle; background:url('../images/common/icon_textLink.png') no-repeat;}
.textLink1 .cl-text:hover { text-decoration:underline; color:#0c91e5;}
.textLink1 .cl-text:hover:after { background-position:0 -10px;}
.cl-button.textLink1:hover { background:none;}
.cl-button.textLink1:focus,
.cl-button.textLink1.cl-focus {border:0 !important;outline: none;}
.textLink2 { height:20px !important; border:0; text-align:left; font-size:13px; color:#fff; background:none;}
.textLink2 .cl-text { font-size:13px; color:#666; cursor:pointer;  text-decoration:underline;}
.textLink2 .cl-text:after {content:''; display:inline-block; width:6px; height:10px; margin-left:5px; margin-top:-1px; vertical-align:middle; background:url('../images/common/icon_small_button.png') no-repeat;}
.textLink2 .cl-text:hover {color:#fff;}
.textLink2.cl-button:not(.cl-disabled):hover {color:#fff;}
.textLink2.cl-button:not(.cl-disabled).cl-activated, .cl-button:not(.cl-disabled):active {background-image:none;}
.textLink2.cl-button:focus, .textLink2.cl-button.cl-focus {border:none;}
.textLink2.blueTxt .cl-text {color:#0c91e5;text-decoration:none;border-bottom:1px solid #0c91e5}
.textLink2.blueTxt .cl-text:after {display:none !important}

.borderLine { display:inline-block !important; width:auto !important; height:auto !important; border:1px solid #dbdbdb; border-radius:50px; padding:5px 10px;}

.cl-button.smallBtn { height:30px !important; padding:0 8px; border:0; border-radius:4px; font-size:13px; color:#fff !important; text-shadow:none; background:#3f4a59;}
.cl-button.smallBtn .cl-text { font-size:12px; color:#fff; cursor:pointer; text-align:center;}
.smallBtn.btnBlack.cl-button:not(.cl-disabled).cl-activated,
.smallBtn.btnBlack.cl-button:not(.cl-disabled).cl-active {background: #3f4a59;} /* 2019-01-25 영훈 변경 필요시 연락! */

[class*=smallBtn][class*=btnIcon] .cl-text:before { display:none;}
[class*=smallBtn][class*=btnIcon] .cl-text:after {content:''; display:inline-block; margin-left:8px; vertical-align:middle; background:url('../images/common/icon_small_button.png') no-repeat;}
[class*=smallBtn][class*=btnIconGray] .cl-text:after {background:url('../images/common/icon_small_button_gray.png') no-repeat;}
[class*=smallBtn].btnIcon1 .cl-text:after, [class*=smallBtn].btnIconGray1 .cl-text:after { width:7px; height:10px; background-position:0 0px;}
[class*=smallBtn].btnIcon2 .cl-text:after, [class*=smallBtn].btnIconGray2 .cl-text:after { width:8px; height:10px; background-position:-7px 0px;}
[class*=smallBtn].btnIcon3 .cl-text:after, [class*=smallBtn].btnIconGray3 .cl-text:after { width:8px; height:10px; background-position:-15px 0px;}
.cl-button[class*=smallBtn][class*=btnIcon1]:not(.cl-disabled).cl-activated,
.cl-button[class*=smallBtn][class*=btnIcon1]:not(.cl-disabled):active,
.cl-button[class*=smallBtn][class*=btnIcon2]:not(.cl-disabled).cl-activated,
.cl-button[class*=smallBtn][class*=btnIcon2]:not(.cl-disabled):active,
.cl-button[class*=smallBtn][class*=btnIcon3]:not(.cl-disabled).cl-activated,
.cl-button[class*=smallBtn][class*=btnIcon3]:not(.cl-disabled):active {
  background:#3f4a59;
}

/* 다음 이전 버튼 */
.cl-button.btnNext { display:inline-block; width:auto !important; margin-right:50px; position:relative; overflow:visible; color:#1c9bd7 !important; font-weight:800; font-size:22px; transition:all .3s ease;}
.cl-button.btnNext .cl-text { position:relative;}
.cl-button.btnNext .cl-text:after { content:''; display:block; position:absolute; bottom:0; left:0; width:100%; height:2px; background:#1c9bd7; transition:all .3s ease;}
.cl-button.btnNext:after {content:''; position:absolute; right:-40px; top:7px; width:30px; height:10px; background:url('../images/common/icon_arrow_next.png') no-repeat 0 -15px;}
.cl-button.btnNext.cl-disabled { color:#333 !important;}
.cl-button.btnNext.cl-disabled .cl-text:after { width:0;background:#333;}
.cl-button.btnNext.cl-disabled:after {background-position:0 0;}

.cl-button.btnPrev { display:inline-block; width:auto !important; margin-left:50px; position:relative; overflow:visible; color:#333333; font-weight:800; font-size:22px; transition:all .3s ease;}
.cl-button.btnPrev .cl-text { position:relative;}
.cl-button.btnPrev .cl-text:after { content:''; display:block; position:absolute; bottom:0; left:0; width:0%; height:2px; background:#333333; transition:all .3s ease;}
.cl-button.btnPrev:before {content:''; position:absolute; left:-40px; top:7px; width:30px; height:10px; background:url('../images/common/icon_arrow_prev.png') no-repeat;}
.cl-button.btnPrev:not(.cl-disabled):hover { color:#1c9bd7;}
.cl-button.btnPrev:not(.cl-disabled):hover:before { background-position:0 -15px;}
.cl-button.btnPrev:not(.cl-disabled):hover .cl-text:after { width:100%; background:#1c9bd7;}


.cl-htmlsnippet button { cursor:pointer;}

/* ====== popup ====== */
.cl-dialog { border:1px solid #cccccc;}
.cl-dialog .cl-dialog-header { padding:15px 20px 15px 30px; border-bottom:0; background:#f1f3f4;}
.whiteHeader.cl-dialog .cl-dialog-header { background:#fff !important;}
.cl-dialog .cl-dialog-header .cl-text { color:#333333; font-size:20px; line-height:1.5; font-weight:bold;}
.cl-dialog .cl-dialog-header .cl-dialog-close { width:22px; height:22px; background:url('../images/common/btn_pop_close.png') no-repeat center center;}
.cl-dialog .cl-dialog-wrapper .cl-dialog-body-wrapper > .cl-dialog-body > .cl-container {/*  padding:30px; */ box-sizing:border-box;}
.cl-dialog .cl-dialog-header .cl-dialog-close:active { background:url('../images/common/btn_pop_close.png') no-repeat center center;}

/* 팝업 인풋 */
.cl-dialog .cl-inputbox { font-size:15px;}
.cl-dialog .cl-combobox .cl-text { font-size:15px;}
.cl-dialog .cl-textarea .cl-text { font-size:15px;}
.cl-dialog .cl-inputbox ::-webkit-input-placeholder { font-size: 15px !important;}
.cl-dialog .cl-inputbox ::-moz-placeholder { font-size: 17px !important;}
.cl-dialog .cl-inputbox :-ms-input-placeholder {font-size: 17px !important;}
.cl-dialog .cl-inputbox :-moz-placeholder {font-size: 17px !important;}

/* ====== table ====== */
[class*=tableType] .cl-checkbox { padding-left:0;}
[class*=tableType] .cl-checkbox.cl-disabled:hover .cl-checkbox-icon,
[class*=tableType] .cl-checkbox .cl-checkbox-icon {/* position:relative; */ width:22px; height:22px; border:0; background:url('../images/common/icon_checkbox_s.png') no-repeat;}
[class*=tableType] .cl-checkbox:not(.cl-disabled):not(.cl-checked):not(.cl-partialchecked):hover .cl-checkbox-icon { background:url('../images/common/icon_checkbox_s.png') no-repeat;}
[class*=tableType] .cl-checkbox .cl-text { padding-left:10px;}
[class*=tableType] .cl-checkbox.cl-checked .cl-checkbox-icon {background:url('../images/common/icon_checkbox_s_on.png') no-repeat;} 
.tableType1 { border:0;}
.tableType1 .cl-grid-header .cl-grid-cell-inherit { background:#f5f6f8;}
.tableType1 .cl-grid-header .cl-grid-cell-inherit .cl-grid-cell { border-top:2px solid #dbdbdb; border-bottom:2px solid #dbdbdb; font-weight:bold; font-size:15px;}
.tableType1 .cl-grid-cell { border:0; font-size:15px; color:#666666;}
.tableType1 .cl-grid-row.cl-viewing { border-bottom:1px solid #eaeaea;}
.cl-grid .cl-grid-header .cl-sort.cl-sortable,
.cl-grid .cl-grid-header .cl-sort.cl-sort-asc,
.cl-grid .cl-grid-header .cl-sort.cl-sort-desc {display:none}
.cl-grid .cl-grid-header .cl-sortable-cell .cl-sort .cl-sort-icon{height:100% !important}
.cl-grid .cl-grid-header .cl-sortable-cell .cl-sort .cl-sort-icon:before{z-index:1;content:"" !important;width:12px;height:7px;display:block;position:absolute;top:50%;right:20px;margin-top: -3.5px;background: url(../images/common/sort_icon.png) top center no-repeat;}
.cl-grid .cl-grid-header .cl-sortable-cell.cl-sort-asc .cl-sort-icon:before{content:"" !important;background: url(../images/common/sort_icon02.png) top center no-repeat;}
.cl-grid .cl-grid-header .cl-sortable-cell.cl-sort-desc .cl-sort-icon:before{content:"" !important;background: url(../images/common/sort_icon03.png) top center no-repeat;}
.cl-grid .cl-grid-header .cl-sortable-cell .cl-sort .cl-sort-seq {display:none}

/* 폼 레이아웃 */
.tableType1 * { text-align:center;}
.tableType1 > .cl-layout { border-top:2px solid #dbdbdb;}
.tableType1 > .cl-layout > .cl-control { border-bottom:1px solid #dbdbdb; padding:15px 10px;}
.tableType1 > .cl-layout > .cl-control .cl-text{font-size:15px;color:#666;}
.tableType1 > .cl-layout > .cl-control.categoryWrap .cl-text,
.tableType1 > .cl-layout > .cl-control .categoryWrap .cl-text { color:#fff;}
.tableType1 > .cl-layout > .cl-control.cl-first-row { border-bottom:2px solid #dbdbdb; font-weight:bold; font-size:15px; background:#f5f6f8;}
.tableType1 > .cl-layout > .cl-control.cl-first-row .cl-text{font-weight:bold; font-size:15px;color:#333;}
.tableType1 > .cl-layout > .cl-control.thRowScope{padding:15px 18px;background:#f5f6f8;}
.tableType1 > .cl-layout > .cl-control.thRowScope .cl-text{font-size:15px;font-weight:bold;color:#333;text-align:left;}
.tableType1 .txtEnd { text-decoration:line-through;}

.tableType1Cont > .cl-layout { border-top:0px solid #dbdbdb;}
.tableType1Cont > .cl-layout > .cl-control.cl-first-row { border-bottom:1px solid #dbdbdb; font-weight:normal; background:none;}
.tableType1Cont > .cl-layout > .cl-control.cl-first-row .cl-text{font-weight:normal; font-size:15px;color:#66;}

.tableNone { padding:70px 0 !important;}
.tableNone.type2 { padding:20px 0 !important;}
.tableNone.type3 { padding:40px 0 !important;}
.tableNone img { width:50px !important; height:50px !important; margin:0 auto;}
.tableNone .cl-text { padding-top:7px; font-size:17px !important; color:#666 !important; text-align:center; line-height:1.6}
.tableNone * { border:0 !important;}
.tableNone.linkType { background:#f5f6f8;}
.tableNone.linkType .cl-text { font-size:20px !important; font-weight:bold; color:#333 !important;}
.tableNone.linkType .smallBtn,
.tableNone.linkType .smallBtn .cl-text { font-size:15px !important; color:#fff !important;}

.htmlCenter { padding-top:0 !important; padding-bottom:0 !important;}
.htmlCenter > .cl-layout {display:table; table-layout:fixed;}
.htmlCenter > .cl-layout > .cl-layout-content { display:table-cell; vertical-align: middle;}

.flowCenter > .cl-layout  > .cl-layout-content > .cl-layout-wrap { vertical-align:  middle !important;}

.cl-embeddedapp.htmlCenter > .cl-container > .cl-layout { display:table !important; table-layout:fixed;}
.cl-embeddedapp.htmlCenter > .cl-container > .cl-layout > .cl-layout-content { display:table-cell; vertical-align: middle !important;}

.htmlCenter2 > .cl-layout {display:table;}
.htmlCenter2 > .cl-layout > .cl-layout-content { display:table-cell; vertical-align: middle;}

.tableType2 { border:0; border-top:2px solid #dbdbdb; border-bottom:1px solid #dbdbdb;}
/* .tableType2 .cl-inputbox:before { display:none;} */
.tableType2 .cl-formlayout-column-shade { background:#f5f6f8;}
.tableType2 .cl-formlayout-vertical-separator { display:none;}

.tableType2 .cl-text,
.tableType2 .cl-htmlsnippet,
.tableType2 .cl-htmlsnippet *{font-size:15px;font-weight:bold; }
.tableType2 > .cl-layout > .cl-control { border-top:1px solid #dbdbdb; padding:16px 20px 15px 20px;}
.tableType2 > .cl-layout > .cl-control.cl-first-row { border-top:0;}
.tableType2 > .cl-layout > .cl-control.title { font-weight:bold; background:#f5f6f8;}
.tableType2 .title .cl-text{font-size:15px;color:#333;}
.tableType2 .cl-text{color:#666666;}

.tableType2.bg2 > .cl-layout > .cl-control.title { background:#f2f5ff;}

.tableGray { border:0;background:#f5f6f8;border-radius:3px}
.tableGray .line:before{content:'';width:1px;background:#dbdbdb;position: absolute;top:15px;bottom:15px;left:50%;margin-left:-0.5px}
.tableGray .title .cl-text {color:#888;font-size:17px;}
.tableGray .detail .cl-text {color:#333;font-size:17px;font-weight:bold}


.tableType3 { border:0;}
.tableType3 .cl-grid-header-band { border-bottom:1px solid #dbdbdb;}
.tableType3 .cl-grid-header .cl-grid-cell-inherit { background:#f5f6f8;}
.tableType3 .cl-grid-header .cl-grid-cell-inherit .cl-grid-cell { border-top:2px solid #dbdbdb; font-weight:bold; font-size:15px;}
.tableType3 .cl-grid-header .cl-blank { border-top:2px solid #dbdbdb;background: #f5f6f8;}
.tableType3 .cl-grid-cell { border:0; font-size:15px; color:#666666;}
.tableType3 .cl-grid-row.cl-viewing { border-bottom:1px solid #eaeaea;}
.tableType3 .cl-grid-cell + .cl-grid-cell { border-left:1px solid #eaeaea;}
.tableType3 .cl-grid-detail-band { border-top:1px solid #dbdbdb; /* border-bottom:1px solid #dbdbdb; */}
/* .tableType3 .cl-grid-detail-band> div, */
.tableType3 .cl-grid-cell-inherit,
.tableType3 .cl-inputbox { overflow:visible !important;}
.tableType3 .cl-inputbox:before { top:-1px; left:-1px; right:-1px; bottom:-1px; border-radius:0; border-color:#eaeaea;}
.tableType3 .cl-editing .cl-inputbox:before { bottom:0px;}
.tableType3 .cl-inputbox.cl-focus { background:#f5f6f8 !important;}
.tableType3.cl-grid .cl-grid-row.cl-editing { background:#f1faff;}
/* tableType3 + 헤더라인 없는 버전 */
.tableType3 .cl-grid-header .cl-grid-cell + .cl-grid-cell{border-left:0;}

.tableFooter1 { height:60px; padding:0 20px; border:1px solid #cccccc; border-width:1px 0; vertical-align:middle; font-size:20px; line-height:60px; color:#555555; background:#fff;}
.tableFooter1 strong { font-size:20px; font-weight:800;}

.tableFooter2 { overflow:hidden; height:60px; padding:0 20px; border:1px solid #cccccc; border-width:0 0 1px; vertical-align:middle; line-height:60px; background:#f5f6f8;}
.tableFooter2 .left { float:left;}
.tableFooter2 .left p { display:inline-block; margin-right:10px; font-size:20px;}
.tableFooter2 .left p strong { font-size:20px; font-weight:800;}
.tableFooter2 .right { float:right; font-size:20px;}
.tableFooter2 .right strong { font-size:20px;}

.tableSearch { padding:20px 20px; border-top:2px solid #9ea3aa; border-bottom:2px solid #eaeaea;}

/* ====== img ====== */
/* .cl-image img { height:auto !important;} */


/* ====== dotList ====== */
/* 아웃풋에 사용할때 */
.dotList1 .cl-text { position:relative; padding-left:14px; font-size:15px;}
.dotList1 .cl-text:before { content:''; position:absolute; top:7px; left:0; width:4px; height:4px; background:#0c91e5;}

.dotList2 .cl-text { position:relative; padding-left:28px; font-size:13px;}
.dotList2 .cl-text:before { content:''; position:absolute; top:9px; left:14px; width:4px; height:4px; background:#9ea3aa;}

.dotList3 .cl-text { position:relative; padding-left:42px; font-size:13px; color:#666666;}
.dotList3 .cl-text:before { content:''; position:absolute; top:10px; left:28px; width:6px; height:2px; background:#9ea3aa;}

/* html 마크업으로 */
.dotList1 li { position:relative; padding-left:14px; margin-bottom:10px; font-size:15px; line-height:20px;}
.dotList1 li:before { content:''; position:absolute; top:7px; left:0; width:4px; height:4px; background:#0c91e5;}

.dotList2 li { position:relative; padding-left:28px; margin-bottom:10px; font-size:13px;}
.dotList2 li:before { content:''; position:absolute; top:5px; left:14px; width:4px; height:4px; background:#9ea3aa;}

.dotList3 li { position:relative; padding-left:42px; margin-bottom:10px; font-size:13px;}
.dotList3 li:before { content:''; position:absolute; top:6px; left:28px; width:6px; height:2px; background:#9ea3aa;}

[class*=dotList] [class*=dotList] { margin:10px 0;}
[class*=dotList] [class*=dotList] li { padding-left:14px;}
[class*=dotList] [class*=dotList] li:before { left:0;}


/* ====== formFomatType1 ====== */
.formFomatType1 { max-width:900px; margin:0 auto 45px;}
.formFomatType1.full { max-width:1050px;}
.formFomatType1 [class*=txtBlue].txtRight .cl-text,
.formFomatType1 [class*=txtRed].txtRight .cl-text { height:30px !important; font-size:13px;}

.formFomatType2 { max-width:1050px; margin:0 auto 45px;}
.formFomatType2 .formFomatType1 { margin:0;}
.formFomatType2 [class*=txtBlue].txtRight .cl-text,
.formFomatType2 [class*=txtRed].txtRight .cl-text { height:30px !important; font-size:13px;}


/* ====== boxContent ====== */
.box { border:1px solid #eaeaea;}

/* ====== tab ====== */
.cl-tabfolder .cl-tabfolder-header .cl-tabfolder-item:focus { text-decoration:none;}
.cl-tabfolder.tabType1 {}
.cl-tabfolder.tabType1 .cl-tabfolder-header { z-index:1;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-header-viewport { width:100%; text-align:center; table-layout:fixed;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-item { position:relative; padding:10px 10px; border:0; font-size:15px; color:#888; font-weight:bold;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-item:before { content:''; display:block; position:absolute; bottom:0; left:0%; width:100%; height:1px; background:#eaeaea;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-item:after { content:''; display:block; position:absolute; bottom:0; left:50%; width:0%; height:2px; background:#eaeaea; transition:all .3s ease;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-item:not(.cl-selected):hover { background:none;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-item:not(.cl-selected):hover:after {left:0%; width:100%; height:2px; background:#0c91e5;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-item.cl-selected { color:#0c91e5; background:#fff;}
.cl-tabfolder.tabType1 .cl-tabfolder-header .cl-tabfolder-item.cl-selected:after {left:0%; width:100%; height:2px; background:#0c91e5;}
.cl-tabfolder.tabType1 .cl-tabfolder-body { border:0;}

.cl-tabfolder.tabType1.full {}
.cl-tabfolder.tabType1.full .cl-tabfolder-header .cl-tabfolder-item { display:table-cell; float:none; width:auto;}

.cl-tabfolder.tabType2 { margin-top:40px;}
.cl-tabfolder.tabType2 .cl-tabfolder-header { z-index:1;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-header-viewport { width:100%; border-bottom:1px solid #ededed; text-align:center; table-layout:fixed;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-item { position:relative; width:auto; height:40px; padding:0 20px 0; border:0; font-size:15px; color:#888; font-weight:bold; line-height:40px;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-item:before { content:''; display:block; position:absolute; top:50%; left:-1px; width:1px; height:14px; margin-top:-7px; background:#ededed;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-item:after { content:''; display:block; position:absolute; bottom:0; left:50%; width:0%; height:4px; background:#0c91e5;  transition:all .3s ease;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-item:not(.cl-selected):hover { background:none;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-item:not(.cl-selected):hover:after {left:0%; width:100%; height:4px; background:#0c91e5;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-item.cl-selected { color:#0c91e5; background:#fff;}
.cl-tabfolder.tabType2 .cl-tabfolder-header .cl-tabfolder-item.cl-selected:after { left:0; width:100%;}
.cl-tabfolder.tabType2 .cl-tabfolder-body { border:0; margin-top:25px;}
.cl-tabfolder.tabType2.lineNone .cl-tabfolder-header .cl-tabfolder-item:before { display:none;}

.cl-tabfolder.tabStyle1 {}
.cl-tabfolder.tabStyle1 .cl-tabfolder-header { text-align:center; z-index:1;}
.cl-tabfolder.tabStyle1 .cl-tabfolder-header .cl-tabfolder-header-viewport { display:inline-block !important; padding:5px; border:1px solid #dbdbdb; border-radius:40px;}
.cl-tabfolder.tabStyle1 .cl-tabfolder-header .cl-tabfolder-item { display:inline-block; float:none; position:relative; width:auto; height:auto; padding:11px 35px 9px; border:0; border-radius:40px; font-size:17px; /* color:#333; */ color:#666; font-weight:bold;}
.cl-tabfolder.tabStyle1 .cl-tabfolder-header .cl-tabfolder-item.cl-selected:hover,
.cl-tabfolder.tabStyle1 .cl-tabfolder-header .cl-tabfolder-item.cl-selected { color:#fff; text-decoration:none; background:#f9515e;}
.cl-tabfolder.tabStyle1 .cl-tabfolder-header .cl-tabfolder-item.cl-selected * { color:#fff;}
.cl-tabfolder.tabStyle1 .cl-tabfolder-header .cl-tabfolder-item:hover { background:none;}
.cl-tabfolder.tabStyle1 .cl-tabfolder-body { padding-top:40px; border:0;}
.cl-tabfolder.tabStyle1.bg1 .cl-tabfolder-header .cl-tabfolder-item.cl-selected { background:#1c9bd7;}


/* 데이터 없습니다 */
.cl-nodatamsg label { font-size:15px; color:#666666; vertical-align:middle !important;}
.cl-nodatamsg label:before { content:''; display:block; width:40px; height:40px; margin:0 auto 10px; background:url('../images/common/icon_table_none.png') no-repeat;}

/* 아이콘 모음 */
.iconType1 {background-position: 0 0;}
.iconType2 {background-position: -24px 0;}
.iconType3 {background-position: -48px 0;}
.iconType4 {background-position: -72px 0;}
.iconType5 {background-position: -96px 0;}
.iconType6 {background-position: -120px 0;}
.iconType7 {background-position: -144px 0;}
.iconType8 {background-position: -168px 0;}
.iconType9 {background-position: -192px 0;}
.iconType10 {background-position: -216px 0;}
.iconType11 {background-position: -240px 0;}
.iconType12 {background-position: -264px 0;}

.iconType1.on {background-position: 0 -24px;}
.iconType2.on {background-position: -24px -24px;}
.iconType3.on {background-position: -48px -24px;}
.iconType4.on {background-position: -72px -24px;}
.iconType5.on {background-position: -96px -24px;}
.iconType6.on {background-position: -120px -24px;}
.iconType7.on {background-position: -144px -24px;}
.iconType8.on {background-position: -168px -24px;}
.iconType9.on {background-position: -192px -24px;}
.iconType10.on {background-position: -216px -24px;}
.iconType11.on {background-position: -240px -24px;}
.iconType12.on {background-position: -264px -24px;}

.iconBoxType1 {background-position: 0 0;}
.iconBoxType2 {background-position: -24px 0;}
.iconBoxType3 {background-position: -48px 0;}
.iconBoxType4 {background-position: -72px 0;}
.iconBoxType5 {background-position: -96px 0;}
.iconBoxType6 {background-position: -120px 0;}
.iconBoxType7 {background-position: -144px 0;}
.iconBoxType8 {background-position: -168px 0;}

.iconBoxType1.on {background-position: 0 -24px;}
.iconBoxType2.on {background-position: -24px -24px;}
.iconBoxType3.on {background-position: -48px -24px;}
.iconBoxType4.on {background-position: -72px -24px;}
.iconBoxType5.on {background-position: -96px -24px;}
.iconBoxType6.on {background-position: -120px -24px;}
.iconBoxType7.on {background-position: -144px -24px;}
.iconBoxType8.on {background-position: -168px -24px;}

.iconLineType1 {background-position: 0 0;}
.iconLineType2 {background-position: -44px 0;}
.iconLineType3 {background-position: -88px 0;}
.iconLineType4 {background-position: -132px 0;}
.iconLineType5 {background-position: -176px 0;}
.iconLineType6 {background-position: -220px 0;}
.iconLineType7 {background-position: -264px 0;}
.iconLineType8 {background-position: -308px 0;}

.iconNotiType1 {background-position: 0 0;}
.iconNotiType2 {background-position: -80px 0;}
.iconNotiType3 {background-position: -160px 0;}

.iconBoxInfo1 {background-position: 0 0;}
.iconBoxInfo2 {background-position: -80px 0;}
.iconBoxInfo3 {background-position: -160px 0;}

/* 라벨(카테고리) - 버튼과 디자인은 같으나 다른 형태 - 아래 게시판과 색상 동일하게 사용 */
.categoryWrap > div > div > div[id], .categoryWrap > div > div > div[id] > .cl-output > div{width:auto !important;}
.categoryWrap > .cl-layout > .cl-layout-content > .cl-layout-wrap + .cl-layout-wrap {margin-left:5px !important;}
.categoryWrap.ml0 > .cl-layout > .cl-layout-content > .cl-layout-wrap + .cl-layout-wrap { margin-left:0 !important;}
.categoryWrap .cl-text{padding:0 10px;background:#888;border-radius:13px;font-size:13px;color:#fff;}

/* 게시판 */
.boardType1.cl-grid {border: 0 none; border-top: solid 2px #5e6671; border-bottom: solid 2px #ccc;}
.boardType1.cl-grid * {font-size:15px;}
.boardType1 .cl-grid-header {background: #f5f6f8; font-weight: bold;}
.boardType1 .cl-grid-cell {border-right: 0 none; border-bottom: solid 1px #eaeaea; font-color: #666; }
.boardType1.cl-grid .cl-grid-row.cl-selected {background-color: #f1faff; color: #333; font-weight: bold;}

.boardCardType1 { border-top:2px solid #dbdbdb; border-bottom:1px solid #dbdbdb;}
.borderListBox { padding:30px 20px; border-bottom:1px solid #dbdbdb; cursor:pointer;}
.borderListBox .title2 { margin:0px 0 10px; font-size:20px; color:#333; font-weight:bold;}
.borderListBox .cl-htmlsnippet [class*=spanText]{display:inline-block;width:44px;height:25px;margin-left:8px;line-height:26px;font-size:13px;}
.borderListBox .cl-htmlsnippet [class*=spanText] + [class*=spanText] { margin-left:5px;}
.borderListBox .cl-htmlsnippet [class*=spanAt]{width:auto !important;padding:0 10px;}
.borderListBox [class*=spanText] { border-radius:15px; color:#fff; font-size:13px; text-align:center; vertical-align: middle; background:#888888;}
.borderListBox [class*=spanText] .cl-text { color:#fff; font-size:13px;}
.borderListBox .spanText1, .categoryWrap .label1 .cl-text{background:#f4516c;}
.borderListBox .spanText2, .categoryWrap .label2 .cl-text{background:#00becf;}
.borderListBox .spanText3, .categoryWrap .label3 .cl-text{background:#1c9bd7;}
.borderListBox .spanText4, .categoryWrap .label4 .cl-text{background:#fc9b3d;}
.borderListBox .spanText5, .categoryWrap .label5 .cl-text{background:#7663a6;}
.borderListBox .spanText6, .categoryWrap .label6 .cl-text{background:#06a2b4;}
.borderListBox .listInfoText {}
.borderListBox .listInfoText span { display:inline-block; font-size:15px; color:#666666;}
.borderListBox .listInfoText span + span:before { content:''; display:inline-block; width:3px; height:3px; margin:0 8px; border-radius:50%; vertical-align:middle; background:#cccccc;}
.borderListBox .iconFile { background:url('../images/common/icon_file.png') no-repeat right center;}
/* 마지막 라인 삭제 */
.boardCardType1 > .cl-layout > .cl-layout-content > .cl-last-row  .borderListBox { border-bottom:0; }


.borderSearchWrap { margin-bottom:15px;}
.borderSearchWrap .cl-text { font-size:15px;}
.borderSearchWrap .searchNumber { padding-top:22px}
.borderSearchWrap .searchNumber * { font-size:15px;}
.borderSearchWrap .searchNumber span{font-weight:800;}
.boardSearchBtn.cl-button {background: #6f7689; border: 0 none;  color: #fff; text-shadow: none; font-size:15px;}
.boardSearchBtn.cl-button:hover {color: #fff; background:#1c9bd7; }
.boardSearchBtn.cl-button:active {background:#6f7689; }

.nodataType1 {border-top: solid 2px #85c8f2; border-bottom: solid 2px #ccc;}
.boardView {border: 0 none; border-top: solid 2px #5e6671; border-bottom: solid 2px #ccc;}
.boardView .head {background: #f5f6f8;}
.boardView .head .tit {font-weight: bold;}
.boardView .cl-button[class*=button] {border: 0 none;}
.boardView .cl-button[class*=button].cl-activated, .boardView .cl-button[class*=button] button:active {background: #fff !important;}

.boardCardView { border-top:2px solid #dbdbdb;}
.boardCardView > .cl-layout > .cl-control { padding-left:30px; padding-right:30px; }
.boardCardView .btnCardFileWrap { margin:30px 0 25px;}
.boardCardView .btnCardFileWrap > .cl-layout > .cl-layout-content > .cl-layout-wrap { width:auto !important; }
.boardCardView .btnCardFile { margin-right:40px; font-size:15px; color:#1c9bd7; text-decoration:underline;}
.boardCardView .btnCardFile button:before { content:''; display:inline-block; width:16px; height:20px; margin-right:10px; vertical-align:middle; background:url('../images/common/icon_file02.png') no-repeat; background-size:100%;}

.boardCardView > .cl-layout > .borderViewContWrap { padding-bottom:30px; border-bottom:1px solid #dbdbdb;}
.boardCardView > .cl-layout > .borderViewContWrap .borderViewCont{border-bottom:0;}
.boardCardView .borderViewCont{border-bottom:1px solid #dbdbdb;}

.boardCardView .btnBorderList { font-size:0; background:url('../images/common/btn_border_all.png') no-repeat center bottom;}
.boardCardView .btnBorderList:not(.cl-disabled):hover { background:url('../images/common/btn_border_all.png') no-repeat center bottom;}
.boardCardView [class*=btnCardView] { padding:0 !important;}
.boardCardView [class*=btnCardView] button { display:inline-block;; position:relative; margin:35px 0px 0; border:0; text-align:left; cursor:pointer; background:0;}
.boardCardView [class*=btnCardView] button:before{content:''; display:block; position:absolute; top:50%; left:0; width:30px; height:10px; margin:-5px 20px 0 0; background:url('../images/common/icon_arrow_prev.png') no-repeat;}
.boardCardView [class*=btnCardView] button:after {content:''; display:block; position:absolute; top:50%; right:0; width:30px; height:10px; margin:-5px 0 0  20px; background:url('../images/common/icon_arrow_next.png') no-repeat;}
.boardCardView [class*=btnCardView] .title { display:block; font-weight:bold; font-size:15px; color:#333333; margin-bottom:5px;}
.boardCardView [class*=btnCardView] .text { margin-top:5px; font-size:15px; color:#666666;}
.boardCardView [class*=btnCardView] button:hover .title{ color:#1c9bd7;}
.boardCardView [class*=btnCardView] button:hover:after,
.boardCardView [class*=btnCardView] button:hover:before { background-position:0 -15px;}
.boardCardView .btnCardViewPrev button { padding-left:50px;}
.boardCardView .btnCardViewPrev button:after {display:none;}
.boardCardView .btnCardViewNext * { text-align:right;}
.boardCardView .btnCardViewNext button { padding-right:50px; text-align:right; }
.boardCardView .btnCardViewNext button:before {display:none;}
.boardCardView .btnCardViewNext *,
.boardCardView .btnCardViewPrev * { overflow:initial !important;font-family:"NanumSquare"}

/*  slider */
.slideWrap{}
.slideWrap .slideBox > .cl-layout { overflow:hidden !important; width:5000px; }
.slideWrap .slideBox > .cl-layout > .cl-layout-content { display:inline-block; position:static !important; margin:0 10px;}


/* accodion */
.accordionBox {}
.accordionCont { display:none !important;}
.accordionCont.show { display:block !important;}


/* btnGroup */
.btnGroup > .cl-scrollbar { justify-content:center;}

/* searchHeader */
.searchHeader .searchInfo { margin-top:12px;}

/* 회원가입 폼타입 1 */

.formType1 { position:relative;}
.formType1 .errorText {}


/* content 타입정리 */
/* 상단 안내 문구 */
.topInfoText { position:relative; padding-left:30px; padding-bottom:15px; margin-bottom:55px; border-bottom:1px solid #cccccc;}
.topInfoText:after { content:''; display:block; position:absolute; top:4px; left:0; width:20px; height:20px; background:url('../images/common/icon_topInfoText.png') no-repeat;}
	
/* 하단 안내 문구 */
.footerInfomation { margin:80px 0 0px; padding:25px 0; border:1px solid #dbdbdb;}
.footerInfomation .imgText .cl-text:before {content:''; display:block; width:50px; height:50px; margin:0px auto 5px; background:url('../images/common/img_footerInfomation.png') no-repeat ;}
.footerInfomation .textCenter { padding:40px 0 0;}
.footerInfomation .dotList1 .cl-text:before { background:#5e6671;}
.footerInfomation .dotList1 li:before { top:10px; background:#5e6671;}

.maxWidth { max-width:780px}

/* 팝업영역 */
/* .popupCont { padding:30px; background:#fff;} */
.popupCont > .cl-scrollbar { padding:30px; background:#fff;}

.popupCont .errorTextType1 { overflow: auto !important; display:flex !important; display:-ms-flex !important; align-items: center; max-height: 140px; min-height: 80px;}

/* 서브페이지 상단 텍스트 박스 */
.infoWrap *{text-align:center;}
.infoWrap{padding:0 0 36px;}
.infoWrap .iconBoxInfo1{width:80px !important;margin:0 auto; background:url('../images/common/icon_boxinfo_type.png') no-repeat;}
.infoWrap .iconBoxInfo2{width:80px !important;margin:0 auto; background:url('../images/common/icon_boxinfo_type.png') no-repeat; background-position:-80px 0;}
.infoWrap .iconBoxInfo3{width:80px !important;margin:0 auto; background:url('../images/common/icon_boxinfo_type.png') no-repeat; background-position:-160px 0;}
.infoWrap .title1{margin-top:40px; margin-bottom:0;}
.infoWrap .subTxt{margin-top:11px;}


/* 버튼 그룹 */
.btnGroup { margin-top:40px;}
.btnGroup.mb { margin-bottom:40px;}
.btnGroup > .cl-layout > .cl-layout-content { text-align:center !important; }
.btnGroup > .cl-layout > .cl-layout-content > .cl-layout-wrap { margin:0 5px !important; }


/* 파일 첨부*/
.fileBoxWrap {}
.fileBoxWrap .title { font-size:15px; color:#333333;}
.fileBoxWrap .title span { color:#2382d3; font-size:15px;}
.fileBoxWrap .fileBox { border:2px solid #dbdbdb; border-radius:4px;}
.fileBoxWrap .button3 { margin-top:10px;}
.fileBoxWrap .fileSubText { margin-left:10px; font-size:13px; color:#888888;}
.fileBoxWrap .cl-embeddedapp .cl-button { border:0; font-size:0; background:url('../images/common/btn_file_close.png') no-repeat center center;}
.fileBoxWrap .cl-embeddedapp .cl-button button { border:0; width:20px !important; height:20px !important;}

/* 툴팁 박스 */
.tipTextBox {}
.tipTextBox .cl-htmlsnippet { line-height:30px; font-weight:bold; margin-right:8px;}
.tooltiptext { z-index:1;}
.tooltiptext .btnTipClose { position:absolute !important; top:0; right:0; z-index:1; width:14px !important; height:14px !important;}
.tooltiptext .btnTipClose * { padding:0 !important; margin:0 !important;}
.tooltiptext .btnTipClose .cl-button { border:0; font-size:0; line-height:0;}
.tooltiptext .btnTipClose button { width:14px !important; height:14px !important; font-size:0 !important; background:url('../images/common/btn_tip_close.png') no-repeat !important;}
.tooltiptext-content {}
.tooltiptext-content .title { margin-bottom:10px; font-size:15px; font-weight:bold;}
.tooltiptext-content .text { font-size:13px; color:#888; line-height:1.5;}

.tooltipStyle1 {}
.tooltipStyle1 .tipTextBox > .cl-layout > .cl-layout-content > .cl-layout-wrap:last-child { width:30px !important; height:30px !important;}
.tooltipStyle1 .cl-image { background:red;}
.tooltipStyle1 .cl-image img { opacity:0;}

.tooltipStyle2 {}
.tooltipStyle2 .tipTextBox > .cl-layout > .cl-layout-content > .cl-layout-wrap:last-child { width:30px !important; height:30px !important;}
.tooltipStyle2 .cl-image { background:blue;}
.tooltipStyle2 .cl-image img { opacity:0;}


/* overflow */
.overflowN,
.overflowN > .cl-scrollbar,
.overflowN > .cl-layout { overflow:visible !important;}
.wrap-for-overflowN,
.wrap-for-overflowN > .cl-scrollbar,
.wrap-for-overflowN > .cl-layout { overflow:visible !important;}
.overflowH,
.overflowH > .cl-scrollbar,
.overflowH > .cl-layout { overflow:hidden !important;}

/* position */
.positionN > .cl-layout > .cl-layout-content > .cl-last-row { position:static !important;}

/* 검색영역  */
.searchBoxWrap { margin-bottom:30px; padding:20px; box-shadow: 0 0 8px rgba(0,0,0,0.3); background:#fff;}
.searchBoxWrap .title3 { text-align:center;}
.searchBoxWrap .searchBox { max-width:1070px; margin:0 auto;}
.searchBoxWrap .dateTermChk { max-width:initial;}


/* 해시 태그 */
.hashTagsBox {}
.hashTagsBox > .cl-layout > .cl-layout-content > .cl-layout-wrap { margin:0 10px 10px 0 !important; }
.hashTagsBox .tagItem { border:2px solid #1c9bd7; border-radius:30px; padding:10px 20px;}
.hashTagsBox .tagItem .cl-text { font-size:18px; color:#666666;}
.hashTagsBox .tagItem.cl-button { box-sizing:content; background:none;}
.hashtagEdite { border:1px solid #e0e0e0; border-radius:3px;}
.hashtagEdite .hashTagsBox {}
.hashtagEdite .hashTagsBox > .cl-scrollbar { padding:20px;}
.hashtagEdite .hashTagsBox > .cl-layout > .cl-layout-content > .cl-layout-wrap { width:auto !important;}
.hashtagEdite .hashTagsBox button:after { content:'삭제'; display:inline-block; width:24px; height:24px; margin-left:10px; font-size:0; vertical-align:middle; background:url('../images/common/btn_tag_close.png') no-repeat;}
.hashtagEdite .editeText { padding-left:20px; font-size:17px; color:#888888;}
.hashtagEdite .input { border:0; margin:10px 20px 20px; background:none;}
.hashtagEdite .input:before { position:absolute; bottom:0; left:0; right:0; top:inherit; height:2px; border:0; background:#dbdbdb;}
.hashTagsBox.hashButton {}
.hashTagsBox.hashButton .tagItem { border:2px solid #1c9bd7; border-radius:30px; padding:8px 16px;}
.hashTagsBox.hashButton > .cl-scrollbar { padding:20px;}
.hashTagsBox.hashButton > .cl-layout > .cl-layout-content > .cl-layout-wrap { width:auto !important;}
.hashTagsBox.hashButton button:after { content:''; display:inline-block; width:24px; height:24px; margin-left:10px; vertical-align:middle; background:url('../images/common/btn_tag_close.png') no-repeat;}

.hashTagsBox .editeText { position:absolute;}


/* 트리박스 */
.treeBox.cl-tree .cl-tree-item { padding:10px 0 11px;}
.treeBox.cl-tree .cl-tree-item.cl-selected.cl-folder.cl-expanded > .cl-tree-treeicon,
.treeBox.cl-tree .cl-tree-item.cl-folder.cl-expanded > .cl-tree-treeicon,
.treeBox.cl-tree .cl-tree-item .cl-tree-treeicon { width:17px; height:17px; margin-top:0; margin-right:5px; background-image: url(../images/common/ico_tree_controls.png); background-position:0px -17px; background-size:100%;}
.treeBox.cl-tree .cl-tree-item.cl-folder.cl-collapsed > .cl-tree-treeicon {background-image: url(../images/common/ico_tree_controls.png); background-position: 0 0; background-size:100%;}
.treeBox.cl-tree .cl-tree-item .cl-text { font-size:17px; color:#333; font-weight:bold;}

.treeBox.cl-tree .sub-items .cl-tree-item { position:relative; padding:5px 0 6px;}
.treeBox.cl-tree .sub-items .cl-tree-item:after { content:''; display:block; position:absolute; top:0; left:39px; bottom:0%; width:1px; background:#ccc;}
.treeBox.cl-tree .sub-items .-cl-tree-item-wrap:last-child .cl-tree-item:after { bottom:50%;}
.treeBox.cl-tree .sub-items .cl-tree-item .cl-tree-treeicon { position:absolute; top:50%; width:10px; height:1px; margin-top:-1px; background:#cccccc;}
.treeBox.cl-tree .sub-items .cl-tree-item .cl-text { padding-left:20px; font-size:15px; color:#666666; font-weight:normal;}
.treeBox.cl-tree .sub-items .cl-tree-item.cl-selected { background:none;}
.treeBox.cl-tree .sub-items .cl-tree-item.cl-selected:before { content:''; position:absolute; top:0; left:54px; right:36px; bottom:0; border-radius:3px; box-shadow:2px 3px 3px rgba(0,0,0,0.2); background:skyblue;}
.treeBox.cl-tree .sub-items .cl-tree-item.cl-selected .cl-text { margin-left:5px; color:#fff;}


/* alert */
.msg.cl-container { top:50% !important; left:50% !important;; min-width:300px; /* width:300px !important; */ height:auto !important; border-radius:5px; transform:translate(-50%, -50%);}
.msg.cl-container .cl-textarea .cl-text { /* height:108px !important; */ overflow:visible; padding:30px 30px 30px; text-align:center; box-sizing:border-box;}
.msg.cl-container .btn { border:0; border-radius:0; font-size:15px; color:#fff; background:#0c91e5; }
.msg.cl-container .btn.fake { background:#788391;}


/* customtree */
.customtree.cl-tree {}
.customtree.cl-tree .sub-items {}
.customtree.cl-tree .cl-tree-list { padding:0 20px;}
.customtree.cl-tree .cl-tree-item { height:30px;}
.customtree.cl-tree .cl-tree-item .cl-tree-treeicon { background:none;}
.customtree.cl-tree .cl-tree-item .cl-tree-treeicon { width:17px;}
.customtree.cl-tree .cl-tree-item .cl-tree-itemicon { width:0; background:none;}
.customtree.cl-tree .cl-tree-item.cl-folder .cl-tree-itemicon { width:0; background:none;}
.customtree.cl-tree .cl-tree-item.cl-folder.cl-expanded .cl-tree-treeicon,
.customtree.cl-tree .cl-tree-item.cl-folder.cl-collapsed > .cl-tree-treeicon { width:17px; height:17px; margin:0; background: url(../images/common/treeStyle_P.png) no-repeat 0 0; transform:translateX(0)}
.customtree.cl-tree .cl-tree-item.cl-folder.cl-expanded > .cl-tree-treeicon { width:17px; height:17px; margin:0; background: url(../images/common/treeStyle_M.png) no-repeat 0 0; transform:translateX(0)}
.customtree.cl-tree .cl-tree-item .cl-text { margin-left:5px; font-size:15px; color:#666666;}
.customtree.cl-tree .cl-tree-item.cl-expanded .cl-text { font-size:17px; color:#333333; font-weight:bold;}
.customtree.cl-tree .sub-items .cl-tree-item.cl-expanded .cl-text { font-size:15px; color:#333333; font-weight:bold;}
.customtree.cl-tree.customtree .cl-badge.has-badge { border:0; background:none; font-size:15px; color:#666666;}
.customtree.cl-tree .cl-tree-item .cl-tree-checkbox { width:15px; height:15px; margin-left:5px; background:url('../images/common/customtree_checkbox.png') no-repeat;}
/* .customtree.cl-tree .cl-tree-item .cl-tree-itemicon + .cl-text { margin-left:-15px;} */

.customtree.cl-tree .cl-tree-item.cl-checked .cl-tree-checkbox { background:url('../images/common/customtree_checkbox_on.png') no-repeat;}

.customtree.cl-tree > .cl-viewport .sub-items { position:relative;}
/*
.customtree.cl-tree > .cl-viewport .sub-items:before { content:''; display:block; position:absolute; top:-7px; left:8px; bottom:14px; z-index:1; width:1px; background:#cccccc;}
*/
.customtree.cl-tree > .cl-viewport .sub-items .sub-items:before { content:''; display:block; position:absolute; top:-7px; left:28px; bottom:14px; z-index:1; width:1px; background:#cccccc;}
.customtree.cl-tree > .cl-viewport .sub-items > .-cl-tree-item-wrap { position:relative;}
/*
.customtree.cl-tree > .cl-viewport .sub-items > .-cl-tree-item-wrap:before { content:''; display:block; position:absolute; top:15px; left:9px; width:10px; height:1px; background:#cccccc;}
*/
.customtree.cl-tree > .cl-viewport .sub-items .sub-items > .-cl-tree-item-wrap:before { content:''; display:block; position:absolute; top:15px; left:29px; width:10px; height:1px; background:#cccccc;}
/* .customtree.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-selected { background:none;} */
.customtree.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded { position:relative; background:none}
.customtree.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded:before { content:''; display:block; position:absolute; top:0; left:40px; right:0; bottom:0; background:#6ac5ff;}
.customtree.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded * { position:relative;}
.customtree.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded .cl-text { color:#fff;}
.customtree.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded .cl-badge { color:#fff;}
.customtree.cl-tree > .cl-viewport .sub-items .sub-items .cl-selected .cl-text { color:#0c91e5; font-weight:bold;}

/* customtree type2 */
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded { position:relative; background:none}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded:before { display:none;}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded * { position:relative;}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded .cl-text { color:#666;}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-expanded .cl-badge { color:#666;}

.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-selected { position:relative; background:none}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-selected:before { content:''; display:block; position:absolute; top:0; left:40px; right:0; bottom:0; background:none;}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-selected * { position:relative;}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-selected .cl-text { color:#0c91e5;}
.customtree.type2.cl-tree > .cl-viewport > .cl-tree-list > .-cl-tree-item-wrap > .sub-items .cl-tree-item.cl-selected .cl-badge { color:#0c91e5;}
.customtree.type2.cl-tree > .cl-viewport .sub-items .sub-items .cl-selected .cl-text { color:#0c91e5; font-weight:bold;}

.customtree.type2.cl-tree .cl-selected { position:relative; background:none}
.customtree.type2.cl-tree .cl-selected:before { content:''; display:block; position:absolute; top:0; left:20px; right:0; bottom:0; background:none;}
.customtree.type2.cl-tree .cl-selected * { position:relative;}
.customtree.type2.cl-tree .cl-selected .cl-text { color:#0c91e5;}
.customtree.type2.cl-tree .cl-selected .cl-badge { color:#0c91e5;}

.autoHeight .boxBg.box1 > .cl-layout > .cl-layout-content > .cl-last-row { height:auto !important}
.popWrap.KW1101-7 .borderBox.singleItemBox { height:266px !important; border:0; width:auto !important; border-radius:0; margin-left:-20px;}
.popWrap.KW1101-7 .borderBox.singleItemBox .-cl-listwrap > .cl-listbox-list > .cl-listbox-item { padding:10px 20px !important; font-size:15px;}
.popWrap.KW1101-7 .borderBox.singleItemBox .cl-listbox-list .cl-listbox-item.cl-selected {}


/* 컬러 색상 */
.customtree.cl-tree .cl-tree-item.colorCycle .cl-tree-itemicon { display:block; width:7px; height:7px; border-radius:50%; margin:0 0 0 5px; background:none;}
.customtree.cl-tree .cl-tree-item.colorCycle.type1 .cl-tree-itemicon { background:#ecb84a;}
.customtree.cl-tree .cl-tree-item.colorCycle.type2 .cl-tree-itemicon { background:#0c91e5;}
.customtree.cl-tree .cl-tree-item.colorCycle.type3 .cl-tree-itemicon { background:#716aca;}
.customtree.cl-tree .cl-tree-item.colorCycle.type4 .cl-tree-itemicon { background:#06a2b4;}
.customtree.cl-tree .cl-tree-item.colorCycle.type5 .cl-tree-itemicon { background:#f9515e;}
.customtree.cl-tree .cl-tree-item.colorCycle.type6 .cl-tree-itemicon { background:#f99451;}
.customtree.cl-tree .cl-tree-item.colorCycle.type7 .cl-tree-itemicon { background:#0ea69a;}
.customtree.cl-tree .cl-tree-item.colorCycle.type8 .cl-tree-itemicon { background:#add14c;}
.customtree.cl-tree .cl-tree-item.colorCycle.type9 .cl-tree-itemicon { background:#0643b4;}

.customtree.cl-tree .cl-tree-item.colorCycle2 .cl-tree-itemicon { display:block; width:7px; height:7px; border-radius:50%; margin:0 0 0 5px; background:none;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type1 .cl-tree-itemicon {  background:#62cc2e;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type2 .cl-tree-itemicon { background:#0c91e5;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type3 .cl-tree-itemicon { background:#2d50c1;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type4 .cl-tree-itemicon { background:#6b2edb;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type5 .cl-tree-itemicon { background:#eb46be;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type6 .cl-tree-itemicon { background:#ef8a07;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type7 .cl-tree-itemicon { background:#0ea69a;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type8 .cl-tree-itemicon { background:#ebed30;}
.customtree.cl-tree .cl-tree-item.colorCycle2.type9 .cl-tree-itemicon { background:#ff6666;}


/* 토마토 측 overlay 
.cl-overlay {z-index:1;}
*/


/* 로딩바 */
.loadingWrap { overflow:hidden; width:345px !important; height:230px !important; margin:0 auto; border-radius:5px; background:#fff;}
.loadingWrap .title {}
.loadingWrap .title .cl-text { font-size:20px; color:#333333; font-weight:bold;}
.loadingWrap .subText { margin-top:10px;}
.loadingWrap .subText .cl-text { font-size:15px; color:#666666;}

.loadingWrap .loadingMotion {}
.loadingWrap .loadingMotion > .cl-layout > .cl-layout-content > .cl-layout-wrap { position:static !important; width:0 !important; height:0 !important;}
.loadingWrap .loadingMotion.type0 .img {
	position:absolute; top:0; left:0; width:100px !important; height:100px !important;
}
.loadingWrap .loadingMotion.type1 { transform:rotate(90deg)}
.loadingWrap .loadingMotion.type1 .img { 
	position:absolute; top:100%; right:0; width:48px !important; height:92px !important;
	animation:loadingType1 2s ease-in-out infinite;
}
.loadingWrap .loadingMotion.type1 .img2 { 
	position:absolute; top:-100%; left:0; width:48px !important; height:92px !important; transform:rotate(-180deg);
	animation:loadingType1_1 2s ease-in-out infinite;

}
.loadingWrap .loadingMotion.type2 .img { 
	position:absolute; bottom:24px; left:-100%; z-index:1; width:66px !important; height:46px !important; opacity:0;
	animation:loadingType2 2s ease-in-out infinite;
}
.loadingWrap .loadingMotion.type2 .img2 { 
	position:absolute; bottom:6px; left:0%; width:100px !important; height:20px !important; background-image:url('../images/common/loading_2_1.png'); background-size:100%;
	animation:loadingType2_1 .3s ease-in infinite;
}

.loadingWrap .loadingMotion.type3 .img { 
	position:absolute; top:0%; left:50%; width:68px !important; height:80px !important; opacity:0; transform:translateX(-50%);
	animation:loadingType3 3s ease-in-out infinite;
}
.loadingWrap .loadingMotion.type3 .img:after {
	content:''; display:block; position:absolute; top:22px; left:14px; width:0px; height:40px; background:url('../images/common/loading_3_1.png') no-repeat; background-size:40px;
	animation:loadingType3_1 3s ease-in-out infinite;
}

.loadingWrap .loadingMotion.type3 .img:before {
	content:''; display:block; position:absolute; top:22px; left:17px; width:0px; height:40px; background:url('../images/common/loading_3_2.png') no-repeat; background-size:40px;
	animation:loadingType3_2 3s ease-in-out infinite;
}

.loadingWrap .loadingMotion.type4 .img { 
	position:absolute; top:-100%; left:50%; width:60px !important; height:60px !important; transform:translateX(-50%);
	animation:loadingType4 1.5s ease-in-out infinite;
}
.loadingWrap .loadingMotion.type4:after {
	content:''; display:block; position:absolute; bottom:0; left:0; right:0; height:6px; border-radius:10px; background:#3d5199;
}

@keyframes loadingType1 {
	0% {
		top:100%;
	}
	
	50% {
		top:-100%;
	}
	50.1%{
		top:100%;
	}
}

@keyframes loadingType1_1 {
	50% {
		top:-100%;
	}
	100% {
		top:100%;
	}
}

@keyframes loadingType2 {
	0% {
		opacity:0;
		left:-100%;
	}
	50% {
		opacity:1;
	}
	
	60% {
		opacity:1;
	}
	100% {
		opacity:0;
		left:100%;
	}
}

@keyframes loadingType2_1 {
	0% {
		background-image:url('../images/common/loading_2_1.png')
	}
	100% {
		background-image:url('../images/common/loading_2_2.png')
	}
}

@keyframes loadingType3 {
	0% {
		opacity:0;
		left:-100%;
	}
	
	30% {
		opacity:1;
		left:50%;
	}
	
	70% {
		opacity:1;
		left:50%;
	}
	
	100% {
		opacity:0;
		left:100%
	}
}
@keyframes loadingType3_1 {
	0% {
		width:0;
	}
	
	30% {
		width:0;
	}
	
	50% {
		width:40px;
	}
	
	100% {
		width:40px;
	}
}
@keyframes loadingType3_2 {
	0% {
		width:0;
	}
	
	35% {
		width:0;
	}
	
	55% {
		width:40px;
	}
	
	100% {
		width:40px;
	}
}

@keyframes loadingType4 {
	10% {
		top:-60px;
		transform:translateX(-50%) rotate(0deg);
	}
	
	90% {
		top:160px;
		transform:translateX(-50%) rotate(180deg);
	}
	
	90.1% {
		top:-60px;
		transform:translateX(-50%) rotate(0deg);
	}
	
}


.cl-vscrollbar { width:10px; opacity: 1; background:#e9ebef;}
.cl-vscrollbar .cl-thumb { background:#bfc5cc;}
.cl-customscrollbar.cl-with-hscrollbar { height:100%;}
.cl-hscrollbar { height:10px; opacity: 1; background:#e9ebef;}
.cl-hscrollbar .cl-thumb { background:#bfc5cc;}

/* 토마토에서 제작한 스와이프 */
.slideTabStyle01 > .cl-layout  > .cl-control  > .cl-layout > .cl-layout-content {overflow:visible !important;height:50px !important;}
.slideTabStyle01 > .cl-layout{overflow:visible !important}
.slideTabStyle01 .cl-button.nav-button{border-radius:0 !important;border:0 !important;}
.slideTabStyle01 .cl-button.nav-button .cl-text{font-size:0 !important}
.slideTabStyle01 .cl-button.nav-button.slide-prev-button{border-bottom:1px solid #eaeaea !important;left:0 !important;width:40px !important;height:50px !important;background: url(../images/MB/slider_tab_prev.png) center no-repeat !important;}
.slideTabStyle01 .cl-button.nav-button.slide-next-button{border-bottom:1px solid #eaeaea !important;left:inherit !important;right:0 !important;width:40px !important;height:50px !important;background: url(../images/MB/slider_tab_next.png) center no-repeat !important;}
.slideTabStyle01 .sliderTabItemWrap .cl-button{border-radius:0;background:none;position:relative; padding:10px 10px; border:0; font-size:15px; color:#888; font-weight:bold;}
.slideTabStyle01 .sliderTabItemWrap .cl-button:before { content:''; display:block; position:absolute; bottom:0; left:0%; width:100%; height:1px; background:#eaeaea;}
.slideTabStyle01 .sliderTabItemWrap .cl-button:after { content:''; display:block; position:absolute; bottom:0; left:50%; width:0%; height:2px; background:#eaeaea; transition:all .3s ease;}
.slideTabStyle01 .sliderTabItemWrap .cl-button:not(.selected):hover { background:none;}
.slideTabStyle01 .sliderTabItemWrap .cl-button:not(.selected):hover:after {left:0%; width:100%; height:2px; background:#0c91e5;}
.slideTabStyle01 .sliderTabItemWrap .cl-button.on { color:#0c91e5; background:#fff;}
.slideTabStyle01 .sliderTabItemWrap .cl-button.on:after {left:0%; width:100%; height:2px; background:#0c91e5;}

.slideTabStyle02 > .cl-layout  > .cl-control  > .cl-layout > .cl-layout-content {overflow:visible !important;height:30px !important;}
.slideTabStyle02 > .cl-layout{overflow:visible !important}
.slideTabStyle02 .cl-button.nav-button{border-radius:0 !important;border:0 !important;}
.slideTabStyle02 .cl-button.nav-button .cl-text{font-size:0 !important}

.slideTabStyle02 .cl-button.nav-button.slide-prev-button{left:0 !important;height:30px !important;background:url(../images/CM/btn_arrow_left.png) no-repeat 15px center; background-size:10px;}
.slideTabStyle02 .cl-button.nav-button.slide-next-button{left:inherit !important;right:0 !important;width:40px !important;height:30px !important; background:url(../images/CM/btn_arrow_right.png) no-repeat 5px center; background-size:10px;}

.slideTabStyle02 .sliderTabItemWrap .cl-button{border-radius:0;background:none;position:relative; border:0; font-size:13px; color:#888; font-weight:bold;}
.slideTabStyle02 .sliderTabItemWrap .cl-button:before { content:''; display:block; position:absolute; bottom:0; left:0%; width:100%; height:1px; background:#eaeaea;}
.slideTabStyle02 .sliderTabItemWrap .cl-button:after { content:''; display:block; position:absolute; bottom:0; left:50%; width:0%; height:2px; background:#eaeaea; transition:all .3s ease;}
.slideTabStyle02 .sliderTabItemWrap .cl-button:not(.selected):hover { background:none;}
.slideTabStyle02 .sliderTabItemWrap .cl-button:not(.selected):hover:after {left:0%; width:100%; height:2px; background:#0c91e5;}
.slideTabStyle02 .sliderTabItemWrap .cl-button.on { color:#0c91e5; background:#fff;}
.slideTabStyle02 .sliderTabItemWrap .cl-button.on:after {left:0%; width:100%; height:2px; background:#0c91e5;}

/* 타블렛 변환 시점 = 768 ~ 1279 */
@media screen and (max-width:1350px){
	
}



