@charset "utf-8";
/*****************
	common.css
	2025.04.10
******************/


/* 공통 color */
.fc-white{color: #ffffff !important;}
.fc-black{color:#000 !important;}
.fc-red{color: #EC372C !important;}
.fc-point{color:#2F58A4 !important;}
.fc-point2{color:#2F58A4 !important;}
.fc-lgray{color:#999 !important;}
.fc-blue{color:#0053f4 !important;}

/* font-size */
.font11{font-size:11px !important;}
.font12{font-size:12px !important;}
.font13{font-size:13px !important;}
.font14{font-size:14px !important;}
.font15{font-size:15px !important;}
.font16{font-size:16px !important;}
.font17{font-size:17px !important;}
.font18{font-size:18px !important;}
.font22{font-size:22px !important;}

/* 폰트weight*/
.fw-normal{font-weight:normal;}
.fw-400{font-weight:400;}
.bold{font-weight:700;}

/* 폰트간격*/
.ls-sp-minus5{letter-spacing:-0.05em;}

/* 정렬관련 */
.fl {float:left;}
.fr {float:right;}

.al{text-align:left !important;}
.ac{text-align:center !important;}
.ar{text-align:right !important;}

.vt {vertical-align:top !important;}
.vm {vertical-align:middle !important;}
.vb {vertical-align:bottom !important;}


/* 마진 패딩 */
.mg-0auto{margin:0 auto !important;}
.mt-minus2{margin-top:-2px !important;}
.mt-minus4{margin-top:-4px !important;} 
.mt0{margin-top:0 !important;}


/* 마진 패딩*/
.mt0{margin-top:0 !important;}
.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt40{margin-top:40px !important;}
.mt50{margin-top:50px !important;}

.ml0{margin-left:0px !important;}
.ml5{margin-left:5px !important;}
.ml0{margin-left:10px !important;}

.mr0{margin-right:0px !important;}
.mr4{margin-right:4px !important;}
.mr10{margin-right:10px !important;}

.mb0{margin-bottom:0 !important;} 
.mb5{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb20{margin-bottom:20px !important;}
.mb30{margin-bottom:30px !important;}

/* width/height */
.h36px {height:36px !important;}

.pd-top-none{padding-top:0 !important;}
.pd-bottom-none{padding-bottom:0 !important;}
.pd-right-none{padding-right:0 !important;}
.pd-left-none{padding-left:0 !important;}

/* block */
.block {display:block !important;}
.in-block {display:inline-block;}

/* 아이콘사이즈 */
.icon24{width:24px; height:24px;}
.icon16{width:16px; height:16px;}


/* width 값 추가 - input 영역에 주로 쓰임 */
.min-w75px{min-width:75px;}

.w70px{width:70px;}
.w80px{width:100px;}
.w100px{width:100px;}
.w115px{width:115px;}
.w118px{width:118px;}
.w150px{width:150px;}
.w155px{width:155px;}
.w180px{width:180px;}
.w200px{width:200px;}
.w210px{width:210px;}
.w240px{width:240px;}
.w245px{width:245px;}
.w329px{width:329px;}
.w350px{width:350px;}
.w365px{width:365px;}
.w385px{width:385px;}
.w455px{width:455px;}

.w425px{width:425px;}
.w495px{width:495px;}



/********** 체크박스 공통 스타일***********/
.cm-checkbox {display:inline-block; vertical-align:middle;}
.cm-checkbox *{line-height:1;}
.cm-checkbox input[type="checkbox"] {
  width:16px;
  height:16px;
  margin:0 0 0 0;
  border:1px solid #aaa;
  background:#fff;
  border-radius:2px;
  box-sizing:border-box;
  -webkit-appearance:none;
  -moz-appearance: none;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  }
.cm-checkbox input[type="checkbox"]:hover{border-color:#333; }
.cm-checkbox input[type="checkbox"]:checked:before{content:"\e929"; font-family:xeicon; font-size:18px; position:absolute; top:-3px; left:-2px; width:16px; height:16px;}
.cm-checkbox input[type="checkbox"]:checked { position:relative;color:#fff; border-color:#2F58A4; background:#2F58A4; 
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.cm-checkbox input[type="checkbox"]:checked:hover,
.cm-checkbox input[type="checkbox"]:checked:focus {color:#fff; background:#2F58A4;}
.cm-checkbox input[type="checkbox"]:disabled  { border-color:#d8d8d8; background:#eee; border-radius:2px; box-sizing:border-box;}
.cm-checkbox input[type="checkbox"]:checked:disabled {color:#e9e9e9 !important; border-color:#d0d0d0 !important; background:#d0d0d0 !important; border-radius:2px; box-sizing:border-box;}

.cm-checkbox input[type="checkbox"]:checked + label {color:#2F58A4;}
.cm-checkbox input[type="checkbox"]:disabled + label {color:#b3b3b3;}
.cm-checkbox label{color:#222;font-size: 13px;vertical-align:middle;}
/* checkbox label 간격 */
.cm-checkbox input[type="checkbox"] + label{margin-left: 4px;}
.cm-checkbox label + input[type="checkbox"]{margin-left:2px;}
.cm-checkbox .checkbox-item input[type="checkbox"] + label{margin-right:8px;}
/* 1개이상일때 마진20 */
.cm-checkbox.lavel-mr20 label{margin-right:20px;}
.cm-checkbox.lavel-mr10 label{margin-right:10px;}
.cm-checkbox.mr20 label{margin-right:20px;}
.cm-checkbox.w-fixed25{width: calc(25% - 16px);}

.cm-checkbox label{margin-right:8px;}
.cm-checkbox label:last-child{margin-right:0;}


/********** 라디오박스 공통 스타일**********/
.cm-radiobox{display:inline-block; vertical-align:middle;}
.cm-radiobox:after{content:""; clear:both; display:block;}
.cm-radiobox *{line-height:1;}
.cm-radiobox:last-child{margin-left:0;}
.cm-radiobox input[type="radio"]{display:none;}
.cm-radiobox label{float:left;display:inline-block;height:16px;line-height:16px;position:relative;padding-left:20px;color:#222;font-size: 13px;}
.cm-radiobox label::before{content:"\e9c6"; font-family:xeicon;  font-size:20px; position:absolute; top:0px; left:-1px; width:16px; height:16px; color:#666; 
  -moz-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  -webkit-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;}
.cm-radiobox input[type="radio"]:hover + label::before,
.cm-radiobox input[type="radio"]:focus + label::before{color:#333;}
.cm-radiobox input[type="radio"]:checked + label::before{content:"\e9c7"; color: #2F58A4;
  -moz-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  -webkit-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;}
.cm-radiobox input[type="radio"]:checked + label::after{display:block;}
.cm-radiobox input[type="radio"]:disabled + label{color: #b7b7b7;}
.cm-radiobox input[type="radio"]:disabled + label::before{color: #ccc;}
.cm-radiobox input[type="radio"]:checked:disabled + label{color: #b7b7b7;}
.cm-radiobox input[type="radio"]:checked:disabled + label::before{color: #b7b7b7;}
.cm-radiobox input[type="radio"]:checked + label {color:#2F58A4;}
.cm-radiobox input[type="radio"]:disabled + label {color:#b3b3b3;}
/* 단독사용 :: 테이블 td에 사용될 경우 우측 패딩값 마진값 조절*/
.label-none input[type="radio"] + label{padding-left: 16px !important; margin-right: 0 !important;}

.cm-radiobox.mr20 label{margin-right:20px;}
.cm-radiobox label{margin-right:8px;}
.cm-radiobox label:last-child{margin-right:0;}


/******** button style*********/
button{position: relative; display:inline-block; text-align:center; font-weight:500; vertical-align:middle; border-radius:5px; box-sizing:border-box; transition: all 0.3s ease;}
button:hover{-webkit-box-shadow: 0px 1px 8px 1px rgba(0, 0, 0, 0.082); box-shadow: 0px 1px 8px 1px rgba(0, 0, 0, 0.08);}

.btn-fill01{background: #2F58A4; border:1px solid #2F58A4; color: #fff;}
.btn-fill01:hover,
.btn-fill01:focus{background: #254F9C; border:1px solid #254F9C;}

.btn-fill02{background: #a7acb0; border:1px solid #a7acb0; color: #fff;}
.btn-fill02:hover,
.btn-fill02:focus{background: #99a2ab; border:1px solid #99a2ab;}

.btn-fill03{background: #DFECF9; border:1px solid #DFECF9; color: #2F58A4;}
.btn-fill03:hover,
.btn-fill03:focus{background: #D7E8F8; border:1px solid #D7E8F8; color:#254F9C;}

.btn-outline01{background: #fff; border:1px solid #B9BCBE; color: #333;}
.btn-outline01:hover,
.btn-outline01:focus{border:1px solid #2F58A4; color: #2F58A4;}

.btn-outline02{background: #fff; border:1px solid #2F58A4; color: #2F58A4;}
.btn-outline02:hover,
.btn-outline02:focus{border:1px solid #254F9C; color: #254F9C;}

.btn-outline03{background: #fff; border:1px solid #ccc; color: #555;}
.btn-outline03:hover,
.btn-outline03:focus{border:1px solid #aaa; color: #333;}

.btn-outline04{background: #fff; border:1px solid #EC372C; color: #EC372C;}
.btn-outline04:hover,
.btn-outline04:focus{background: #EC372C;color: #fff;}

button.btn-disabled{background: #f1f1f1; border:1px solid #f1f1f1 ; color: #ccc; }
button:disabled{/*opacity:0.9;*/ cursor: default; color: #ccc !important; background: #f1f1f1 !important; border:1px solid #f1f1f1 !important; pointer-events: none;}
button:disabled i{color:#cfcfcf !important;}

.btn-l i,
.btn-m i{font-size:16px; vertical-align:middle; margin-top:-3px !important; margin-right:2px; margin-left:-2px !important; line-height:1;}
.btn-s i,
.btn-xs i{font-size:14px; vertical-align:middle; margin-top:-3px !important; margin-right:2px; margin-left:-2px !important; line-height:1;}

/* 버튼 사이즈 */
.btn-xl{height:40px; font-size:14px !important; padding:0 12px !important;}
.btn-l{height:32px; font-size:14px !important; padding:0 12px !important;}
.btn-m{height:28px; font-size:14px !important; padding:0 8px !important;}
.btn-s{height:24px; font-size:13px !important; padding:0 8px !important;}
.btn-xs{height:20px; font-size:12px !important; padding:0 8px !important; border-radius:3px !important;}
.btn-mini{height:20px; font-size:12px !important; padding:0 8px !important; border-radius:3px !important;}

/* 버튼+아이콘 설정*/
.btn-xl > i{font-family: xeicon; font-size:16px; vertical-align:middle; margin-top:-2.2px; margin-right:4px;}
.btn-l > i{font-family: xeicon; font-size:16px; vertical-align:middle; margin-top:-2.2px; margin-right:4px;}
.btn-m > i{font-family: xeicon; font-size:16px; vertical-align:middle; margin-top:-1.6px; margin-right:3px;}
.btn-s > i{font-family: xeicon; font-size:14px; vertical-align:middle; margin-top:-2px; margin-right:3px;}
.btn-xs > i,
.btn-mini > i{font-family: xeicon; font-size:14px; vertical-align:middle; margin-top:-1px; margin-right:2px;}

/* 버튼 underline */
.btn-uline{text-decoration: underline !important; cursor:pointer;}
.btn-uline:link{text-decoration: underline !important;}
.btn-uline:visited{text-decoration: underline !important;}
.btn-uline:hover{text-decoration: underline !important;}
.btn-uline:active{text-decoration: underline !important;}
.btn-uline:focus{text-decoration: underline !important;}


/* **********************
	* 페이징
********************** */
/* 좌우버튼+페이징*/
.paging-wrap{position:relative;}
.paging-wrap .paging{width:70%;}
.paging-wrap .left-btn-wrap{position:absolute; left:0; top:0; width:20%; text-align:left;}
.paging-wrap .right-btn-wrap{position:absolute; right:0; top:0; width:20%; text-align:right;}

.paging-wrap .left-btn-wrap button,
.paging-wrap .right-btn-wrap button{min-width:70px;}

/* 페이징*/
.paging {text-align:center;margin:12px auto;}
.paging a.first,
.paging a.prev,
.paging a.next,
.paging a.last { overflow:hidden; text-indent:-3000px;}
.paging a.first:hover,
.paging a.prev:hover,
.paging a.next:hover,
.paging a.last:hover {background-color: #f7f7f7;}
.paging a.first {background:url(../img/btn-arrow-first.svg) center no-repeat; background-size:24px 24px;}
.paging a.prev {background:url(../img/btn-arrow-prev.svg) center no-repeat; background-size:24px 24px;}
.paging a.next {background:url(../img/btn-arrow-next.svg) center no-repeat;background-size:24px 24px;}
.paging a.last {background:url(../img/btn-arrow-last.svg) center no-repeat; background-size:24px 24px;}
.paging a{ display:inline-block; margin:0 1px; min-width:24px; height:24px; padding:2px 5px; text-align:center; color:#666; font-size:13px; line-height:1.4; font-weight:400; vertical-align:middle; border-radius:5px;box-sizing:border-box;}
.paging a:visited{color:#666;}
.paging a:hover{background-color: #f7f7f7; color:#2F58A4;}
.paging a.on {border:1px solid #EFF6FB; background-color:#EFF6FB; color:#2F58A4; font-weight:bold;}

.paging .paging-txt{display:inline-block; margin:0 10px;}
.paging .paging-txt .num{width:40px; text-align:center;}
.paging .paging-txt em{margin:0 4px;}
.paging .paging-txt input.num::placeholder{color: rgba(0,0,0,1);}
.paging select{margin-left:12px;}



/*******************  modal 팝업 *******************/
.modal-popup-area{display:none; overflow-y:auto; overflow-x:auto; position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:10000; background:#000; background:rgba(0,0,0,0.55);}
.modal-popup-area .modal-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.modal-popup-area .modal-pop-inner .modal-inner-box{position:relative;display:table-cell;vertical-align:middle; padding:24px;}
.modal-popup-area .modal-pop-inner .modal-inner-box .modal-conts{width:100%; min-width: 640px; max-width:640px; min-height:190px; margin:0 auto; padding:10px 0; background:#fff; border-radius:10px; box-shadow: 0px 2px 10px 1px rgba(0,0,0,0.35); box-sizing:border-box; }
.modal-popup-area .modal-pop-inner .modal-inner-box .modal_jqgrid{width:100%; min-width: 960px; max-width:960px; min-height:190px; margin:0 auto; padding:10px 0; background:#fff; border-radius:10px; box-shadow: 0px 2px 10px 1px rgba(0,0,0,0.35); box-sizing:border-box; }

/* popup header */
.modal-popup-area .popup-header {position:relative; width:100%; padding:0 24px 0 24px; text-align:center; box-sizing:border-box;}
.modal-popup-area .popup-header .layer-close-btn:before{content:"\e921"; font-family: xeicon !important; font-size:18px; line-height:18px; vertical-align:top;}
.modal-popup-area .popup-header .layer-close-btn{position: absolute; right:16px; top:10px; width:24px; height:24px; cursor:pointer; z-index:99;}
.modal-popup-area .popup-header .poptitle{position:relative; margin:0; padding:12px 0; min-height:39px; text-align:left; color: #111; box-sizing:border-box;}
.modal-popup-area .popup-header .poptitle span{font-size:24px; font-weight:700; }
/* 250410 알림타이틀 */
.modal-popup-area .popup-header .poptitle-alert{position:relative; margin:0; padding:12px 0; min-height:39px;text-align:center; color: #111; border-bottom: 1px solid #eef2f5; box-sizing:border-box;}
.modal-popup-area .popup-header .poptitle-alert span{font-size:18px; font-weight:700; }
/* popup con */
.modal-popup-area .popup-conts{position:relative; margin:0 auto; font-size:14px; padding:12px 24px 16px; text-align:left; box-sizing:border-box;}
.modal-popup-area .popup-footer{position:relative; width:100%; padding:0 24px 0 24px; text-align:center; box-sizing:border-box;}
/* 팝업 사이즈 */
.modal-conts.w1360px{ min-width: 1360px !important; max-width:1360px !important;}
.modal-conts.w1120px{ min-width: 1120px !important; max-width:1120px !important;}
.modal-conts.w540px{ min-width: 540px !important; max-width:540px !important;}
.modal-conts.w400px{ min-width: 400px !important; max-width:400px !important;}


/* 250410 팝업 메세지 */
.pop-message-box{margin:32px 0 20px;text-align:center;}
.pop-message-box p{padding:12px 0; font-size:16px; color:#222; font-weight:400; line-height:1.4}

/* 250410 알림 타이틀 있는 경우 간격 조정*/
.popup-header + .popup-conts > .pop-message-box{margin:16px 0;}
