@charset "UTF-8";

/* ------------------------------------------------------------------------------------------------------ */
/* ----------------------------------------------- Var Thema ----------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */
:root {
    --basic-color: #5a7eff;
    --basic-red : #b01f1f;
    --basic-dkBlue: #2a2d3e;
    --basic-purple: #263688;
}

/* ------------------------------------------------------------------------------------------------------ */
/* ----------------------------------------------- Common ----------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */

/*20230202 공통추가*/
/* -----------------------------------------------외부여백------------------------------------------------ */
/*상단여백*/
.mTzero {margin-top:0px !important;} /*20230214 각위치별 여백 무효화 css 추가*/
.mT5 {margin-top:5px;}
.mT10 {margin-top:10px;}
.mT15 {margin-top:15px;}
.mT20 {margin-top:20px;}
.mT25 {margin-top:25px;}
.mT30 {margin-top:30px;}
.mT35 {margin-top:35px;}
.mT40 {margin-top:40px;}
.mT45 {margin-top:45px;}
.mT50 {margin-top:50px;}
.mT60 {margin-top:60px;}

/*하단여백*/
.mBzero {margin-bottom:0px !important;} /*20230214 각위치별 여백 무효화 css 추가*/
.mB5 {margin-bottom:5px;}
.mB10 {margin-bottom:10px;}
.mB15 {margin-bottom:15px;}
.mB20 {margin-bottom:20px;}
.mB25 {margin-bottom:25px;}
.mB30 {margin-bottom:30px;}
.mB35 {margin-bottom:35px;}
.mB40 {margin-bottom:40px;}
.mB45 {margin-bottom:45px;}
.mB50 {margin-bottom:50px;}
.mB60 {margin-bottom:60px;}

/*좌측여백*/
.mLzero {margin-left:0px !important;} /*20230214 각위치별 여백 무효화 css 추가*/
.mL5 {margin-left:5px;}
.mL10 {margin-left:10px;}
.mL15 {margin-left:15px;}
.mL20 {margin-left:20px;}
.mL25 {margin-left:25px;}
.mL30 {margin-left:30px;}
.mL35 {margin-left:35px;}
.mL40 {margin-left:40px;}
.mL45 {margin-left:45px;}
.mL50 {margin-left:50px;}
.mL60 {margin-left:60px;}

/*우측여백*/
.mRzero {margin-right:0px !important;} /*20230214 각위치별 여백 무효화 css 추가*/
.mR5 {margin-right:5px;}
.mR10 {margin-right:10px;}
.mR15 {margin-right:15px;}
.mR20 {margin-right:20px;}
.mR25 {margin-right:25px;}
.mR30 {margin-right:30px;}
.mR35 {margin-right:35px;}
.mR40 {margin-right:40px;}
.mR45 {margin-right:45px;}
.mR50 {margin-right:50px;}
.mR60 {margin-right:60px;}
/* ----------------------------------------------- // 외부여백------------------------------------------------ */

/* -----------------------------------------------내부여백------------------------------------------------ */
/*상단여백*/
.pT5 {padding-top:5px;}
.pT10 {padding-top:10px;}
.pT15 {padding-top:15px;}
.pT20 {padding-top:20px;}
.pT25 {padding-top:25px;}
.pT30 {padding-top:30px;}
.pT35 {padding-top:35px;}
.pT40 {padding-top:40px;}
.pT45 {padding-top:45px;}
.pT50 {padding-top:50px;}
.pT60 {padding-top:60px;}

/*하단여백*/
.pB5 {padding-bottom:5px;}
.pB10 {padding-bottom:10px;}
.pB15 {padding-bottom:15px;}
.pB20 {padding-bottom:20px;}
.pB25 {padding-bottom:25px;}
.pB30 {padding-bottom:30px;}
.pB35 {padding-bottom:35px;}
.pB40 {padding-bottom:40px;}
.pB45 {padding-bottom:45px;}
.pB50 {padding-bottom:50px;}
.pB60 {padding-bottom:60px;}

/*좌측여백*/
.pL5 {padding-left:5px;}
.pL10 {padding-left:10px;}
.pL15 {padding-left:15px;}
.pL20 {padding-left:20px;}
.pL25 {padding-left:25px;}
.pL30 {padding-left:30px;}
.pL35 {padding-left:35px;}
.pL40 {padding-left:40px;}
.pL45 {padding-left:45px;}
.pL50 {padding-left:50px;}
.pL60 {padding-left:60px;}

/*우측여백*/
.pR5 {padding-right:5px;}
.pR10 {padding-right:10px;}
.pR15 {padding-right:15px;}
.pR20 {padding-right:20px;}
.pR25 {padding-right:25px;}
.pR30 {padding-right:30px;}
.pR35 {padding-right:35px;}
.pR40 {padding-right:40px;}
.pR45 {padding-right:45px;}
.pR50 {padding-right:50px;}
.pR60 {padding-right:60px;}
/* ----------------------------------------------- // 내부여백------------------------------------------------ */

.linkBox {font-weight:500; cursor:pointer;}
/*label 텍스트 무효화 처리 시*/
.ftZero {font-size:0 !important;}

/*팝업 또는 알럿창에 강조하는 타이틀이 컨텐츠로 추가될 경우*/
.popMsg {font-size:14px; color:#000; font-weight:400;}
.popMsg.center {text-align:center;}

/*처방전 가이드 이미지 팝업 공통*/
.popGuideImg img {width:380px; height:250px;}


/* ---------------------------------------------- 타이틀 ---------------------------------------------- */
/* Headline2 */
.comH2Group {width:100%; height:44px; margin-bottom:20px; position:relative;}
.comH2Group .alignL {}
.comH2Group .alignR {position:absolute; bottom:0px; right:0;}
.comH2Group .unit {display:inline-block;}
.comH2Group h2 {font-size:30px; font-weight:500; color:#000; line-height:44px;}
.comH2Group .locaGroup {display:flex;}
.comH2Group .locaGroup > .item {padding-left:16px; font-size:13px; color:#757575; line-height:19px; background:url(/common/images/component/icon/icon_loca.svg) 2px center no-repeat;}
.comH2Group .locaGroup > .item:first-child {padding-left:0; background:none;}
.comH2Group .locaGroup > .item:last-child {color:#000;}

/* Headline3 */
.comH3Group {width:100%; margin-top:20px; margin-bottom:20px; position:relative;}
.comH3Group .alignR {position:absolute; bottom:0px; right:0;}
.comH3Group .unit {display:inline-block;}
.comH3Group h3 {/*font-size:28px; font-weight:500; line-height:1; color:#000;*/}

/* 작은 타이틀 (대부분 팝업용) */
.comSmTit {width:100%; margin-top:40px; margin-bottom:12px; display:flex; justify-content:space-between;}
.comSmTit:first-child {margin-top:0;}
.comSmTit .alignL {display:flex; align-items:end;}
.comSmTit .alignR {display:flex; align-items:end;}
.comSmTit .title {font-size:18px; font-weight:500; color:#000; line-height:26px;}
.comSmTit .titText {padding-left:13px; font-size:12px; font-weight:400; color:#333; line-height:17px; display:inline-block; position:relative;}
.comSmTit .titText:first-child {padding-left:0;}
.comSmTit .titText:before {content:""; width:3px; height:3px; border-radius:50%; background:#dedede; display:block; position:absolute; left:4px; bottom:8px;}
.comSmTit .titText:first-child:before {display:none;}
.comSmTit .pText {font-size:14px; font-weight:400; color:#000; line-height:20px; display:inline-block; position:relative;}
.comSmTit .unit {margin-left:5px; display:inline-block;}
.comSmTit .unit span {color:#757575;}
.comSmTit .unit span b {color:#000; font-weight:400;}
.comSmTit span.dateData span.dateArea {color:#5a7eff;}

/*작은타이틀 타입 구분*/
.modPopup .comSmTit.type02 {border-bottom:2px solid #5a7eff; margin-bottom:20px; padding-bottom:4px; box-sizing:border-box; align-items:baseline;}
.modPopup .comSmTit.type02 .alignL .title {font-weight:bold;}
.modPopup .comSmTit.type02 span.subTitle {font-size:14px; color:#000; margin-left:5px; display:inline-block;}
.modPopup .comSmTit.type02 .alignR button {margin-top:-9px;}

.modPopup .comSmTit.type03 {margin-bottom:8px;}
.modPopup .comSmTit.type03 .title {font-size:14px; font-weight:bold !important;}

.modPopup .comSmTit.type04 .title {font-size:16px;}
.modPopup .comSmTit .sqDot {display:inline-block; vertical-align:middle; background:var(--basic-purple); width:5px; height:5px; margin-right:5px;}

.modPopup .comSmTit.type05 .title {font-size:16px;}
.modPopup .comSmTit.type05 {margin-top:10px;}

/* ---------------------------------------------- 타이틀 사이드 ---------------------------------------------- */
.comSideOpt {margin-left:5px;}
.comSideOpt:first-child {margin-left:0px;}
.comSideOpt .opList {display:flex;}
.comSideOpt .opList > .item {margin-left:5px;;}
.comSideOpt .opList > .item:first-child {margin-left:0;}
/* 사이드 폼 */
.comSideOpt input[type=text] {width:100px; height:30px; padding-left:8px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px; background:#fff;}
.comSideOpt input[type=password] {width:100px; height:30px; padding-left:8px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px;}
.comSideOpt input[type=checkbox] {}
.comSideOpt input[type=radio] {}
.comSideOpt select {width:100px; height:30px; padding-left:8px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px; background:#fff url(/common/images/icon/icon_slt.svg) right center no-repeat;}
.comSideOpt button.viewBtn {min-width:50px; height:30px; padding:0 7px; font-size:14px; color:#000; border:1px solid #9fa0a0; border-radius:15px; background:#fff;}
.comSideOpt button.viewBtn.on {color:#fff; border:1px solid var(--basic-color); background:var(--basic-color);}

/* 그리드 내부 폼 */
/* 추가조작 */

/* ---------------------------------------------- 페이징 ---------------------------------------------- */
.comPaging {width:100%; margin-top:20px; font-size:0; text-align:center;}
.comPaging .start {width:20px; height:26px; font-size:0; vertical-align:top; background:url(/common/images/icon/ic_paging_start.svg) center no-repeat; display:inline-block;}
.comPaging .prev {width:20px; height:26px; font-size:0; vertical-align:top; background:url(/common/images/icon/ic_paging_prev.svg) center no-repeat; display:inline-block;}
.comPaging .next {width:20px; height:26px; margin-left:5px; font-size:0; vertical-align:top; background:url(/common/images/icon/ic_paging_next.svg) center no-repeat; display:inline-block;}
.comPaging .end {width:20px; height:26px; font-size:0; vertical-align:top; background:url(/common/images/icon/ic_paging_end.svg) center no-repeat; display:inline-block;}
.comPaging .numList {vertical-align:top; display:inline-block;}
.comPaging .numList > li {width:26px; height:26px; margin-left:5px; font-size:0; display:inline-block;}
.comPaging .numList > li a {width:100%; height:100%; font-size:14px; border-radius:50%; color:#757575; line-height:26px; display:block;}
.comPaging .numList > li.on a {color:#fff; background:var(--basic-color);}

/* ------------------------------------------------------------------------------------------------------ */
/* ---------------------------------------------- Component --------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */

/* ---------------------------------------------- 검색 조건 영역 ---------------------------------------------- */
.cptSearchArea {width:100%; margin-top:20px; padding:20px 0; border:1px solid #e1e5ef; border-radius:10px; background:#fff;}
.cptSearchArea table {width:100%;}
.cptSearchArea table th {height:48px; padding:10px 0 10px 40px; font-size:14px; font-weight:700; color:#000; text-align:left; position:relative;}
.cptSearchArea table th:after {content:""; width:1px; height:34px; background:rgba(132,132,132,0.2); display:block; position:absolute; left:0; top:10px;}
.cptSearchArea table th:first-child:after {display:none;}
.cptSearchArea table td {height:48px; padding:10px 40px 10px 0; font-size:14px; font-weight:400; color:#000; text-align:left; position:relative;}
.cptSearchArea table tr:last-child th {padding:10px 0 10px 40px;}
.cptSearchArea table tr:last-child td {padding:10px 40px 10px 0;}
.cptSearchArea .btnReset{width:100px; height:34px; margin-left:2px; font-size:14px; font-weight:400; color:#757575; border:1px solid #9fa0a0; border-radius:4px; background:#fff;}
.cptSearchArea .btnSearch {width:100px; height:34px; margin-left:2px; font-size:14px; font-weight:400; color:#fff; border:1px solid #2a2d3e; border-radius:4px; background:#2a2d3e;}
.cptSearchArea .btnDetail {width:38px; height:34px; margin-left:2px; font-size:0; border:1px solid #2a2d3e; border-radius:4px; background:#2a2d3e url(/common/images/icon/ic_srh_detail.svg) center no-repeat;}
.modPopup .cptSearchArea {background:#f5f6fa;}
/* 추가조작 */
.cptSearchArea table tr .left {text-align:left;}
.cptSearchArea table tr .center {text-align:center;}
.cptSearchArea table tr .right {text-align:right;}
.cptSearchArea table tr .top {vertical-align:top;}
.cptSearchArea table tr .middle {vertical-align:middle;}
.cptSearchArea table tr .bottom {vertical-align:bottom;}
.cptSearchArea table tr .fMid {font-weight:500;}
.cptSearchArea table tr .bold {font-weight:bold;}
.cptSearchArea .btnAdd {width:100px; height:34px; margin-left:2px; font-size:14px; font-weight:400; color:#fff; border:1px solid #596edb; border-radius:4px; background:#596edb;}
.cptSearchArea .gridBtn { padding:0 10px; height: 30px; margin-left:2px; font-size: 14px; font-weight: 400; white-space: nowrap; line-height:28px; border-radius: 4px; background: var(--basic-dkBlue); display:inline-block;}
.cptSearchArea .gridBtn.dkbLine {color: var(--basic-dkBlue); background:#fff; border:1px solid var(--basic-dkBlue);}
/* ---------------------------------------------- 테이블, 그리드 등 그룹상단 ---------------------------------------------- */
.cptGroupTop {width:100%; margin-top:40px; margin-bottom:13px; position:relative;}
.cptGroupTop .alignL {display:flex; justify-content:start; align-items:baseline;}
.cptGroupTop .alignR {position:absolute; bottom:0; right:0;}
.cptGroupTop .groupTitle {font-size:24px; line-height:30px; font-weight:500; display:inline-block;}
.cptGroupTop .title {font-size:18px; font-weight:500; color:#000; line-height:26px; margin-right:5px;}
.cptGroupTop .unit {margin-left:5px; display:inline-block;}
.cptGroupTop .unit:first-child {margin-left:0;}
.cptGroupTop .text {font-size:14px; line-height:1; vertical-align:bottom; color:#333;}
.cptGroupTop .total {font-size:14px; font-size:400; color:var(--basic-color);}
.cptGroupTop.soloBtn .inner {display:flex; justify-content: end;}
.cptGroupTop.soloBtn .inner .blue {padding: 5px 10px; height:auto;}

/* ---------------------------------------------- 테이블, 그리드 등 그룹하단 버튼영역 ---------------------------------------------- */
.cptGroupBtnCov {display:flex;}
.cptGroupBtm {width:100%; margin-top:12px; display:flex; position:relative;}
.cptGroupBtm.alignLR {justify-content:space-between;}
.cptGroupBtm.alignR {justify-content:end;}
.cptGroupBtm.alignC {display:block;}
.cptGroupBtm.alignC .comSideOpt {display:flex; justify-content:center; gap:2.5px}
.cptGroupBtm.alignC .comSideOpt button {width:100%;}

/* ---------------------------- 그리드 :: basic ---------------------------- */
.cptGrid {width:100%; margin-bottom:10px; border:1px solid #e1e5ef; border-radius:10px; overflow:hidden;}
.cptGrid .gridTb {width:100%; border-collapse:collapse; border-spacing:0;}
.cptGrid .gridTb thead th {padding:5px 5px; height:44px; font-size:14px; font-weight:400; color:#fff; text-align:center; line-height:1.6; background:#2a2d3e;}
.cptGrid .gridTb thead th:first-child {padding-left:20px;}
.cptGrid .gridTb thead th:last-child {padding-right:20px;}
.cptGrid .gridTb tbody td {padding:5px 5px; height:48px; font-size:14px; font-weight:400; color:#333; text-align:center; line-height:1.6; border-bottom:1px solid #ddd; background:#fff; position:relative;}
.cptGrid .gridTb tbody td:first-child {padding-left:20px;}
.cptGrid .gridTb tbody td:first-child::after {content:""; width:20px; height:1px; background:#fff; display:block; position:absolute; left:0; bottom:-1px;}
.cptGrid .gridTb tbody td:last-child {padding-right:20px;}
.cptGrid .gridTb tbody td:last-child::after {content:""; width:20px; height:1px; background:#fff; display:block; position:absolute; right:0; bottom:-1px;}
.cptGrid .gridTb tbody tr:last-child td {border-bottom:0;}
.cptGrid .gridTb tr span.txtBlue {color:var(--basic-color);}
.cptGrid .gridTb tr span.txtRed {color:var(--basic-red);}
.txtBlue {color:var(--basic-color);}
.txtRed {color:var(--basic-red);}
/* 그리드 내부 폼 */
.cptGrid .frmChoBox.only {width:20px; height:20px; margin:0 auto; display:block; position:relative;}
.cptGrid .frmChoBox.only .iptChk + .iptLbl {height: 20px; margin: 0; padding-left: 20px;}
.cptGrid .listTit {max-width:calc(100% - 30px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block; vertical-align:middle;}


/* 추가조작 */
.cptGrid .gridTb tr .left {text-align:left;}
.cptGrid .gridTb tr .center {text-align:center;}
.cptGrid .gridTb tr .right {text-align:right;}
.cptGrid .gridTb tr .top {vertical-align:top;}
.cptGrid .gridTb tr .middle {vertical-align:middle;}
.cptGrid .gridTb tr .bottom {vertical-align:bottom;}
.cptGrid .gridTb tr .fMid {font-weight:500;}
.cptGrid .gridTb tr .bold {font-weight:bold;}
.cptGrid td span.newBtn {display:inline-block; vertical-align:middle; margin:6px 0 0 5px;}

/* ---------------------------------------------- 상세 상단 정보 영역 ---------------------------------------------- */
.cptViewTopArea {width:100%; padding:30px 0; background:#f5f5f5;}
.cptViewTopArea table {width:100%;}
.cptViewTopArea table th {height:34px; padding:10px 0 0 70px; font-size:16px; font-weight:700; color:#000; text-align:left; line-height:24px; position:relative;}
.cptViewTopArea table th:after {content:""; width:1px; height:34px; background:rgba(132,132,132,0.2); display:block; position:absolute; left:0; top:0;}
.cptViewTopArea table th:first-child {padding-left:60px;}
.cptViewTopArea table th:first-child:after {display:none;}
.cptViewTopArea table td {height:34px; padding:10px 70px 0 0; font-size:16px; font-weight:400; color:#000; text-align:right; position:relative;}
.cptViewTopArea table td:last-child {padding-right:60px;}
.cptViewTopArea table tr:first-child th {height:24px; padding-top:0;}
.cptViewTopArea table tr:first-child th:after {height:24px;}
.cptViewTopArea table tr:first-child td {height:24px; padding-top:0;}


.cptViewTopArea .btnReset{width:100px; height:34px; margin-left:2px; font-size:14px; font-weight:400; color:#757575; border:1px solid #9fa0a0; border-radius:4px; background:#fff;}
.cptViewTopArea .btnSearch {width:100px; height:34px; margin-left:2px; font-size:14px; font-weight:400; color:#fff; border:1px solid #2a2d3e; border-radius:4px; background:#2a2d3e;}
.cptViewTopArea .btnDetail {width:38px; height:34px; margin-left:2px; font-size:0; border:1px solid #2a2d3e; border-radius:4px; background:#2a2d3e url(/common/images/icon/ic_srh_detail.svg) center no-repeat;}
/* 그리드 내부 폼 */
/* 추가조작 */
.cptViewTopArea table tr .left {text-align:left;}
.cptViewTopArea table tr .center {text-align:center;}
.cptViewTopArea table tr .right {text-align:right;}
.cptViewTopArea table tr .top {vertical-align:top;}
.cptViewTopArea table tr .middle {vertical-align:middle;}
.cptViewTopArea table tr .bottom {vertical-align:bottom;}
.cptViewTopArea table tr .bold {font-weight:bold;}


/* ---------------------------- table :: basic ---------------------------- */
.cptTable {width:100%; border-top:1px solid #000;}
.cptTable .tbWrite {width:100%;}
.cptTable .tbWrite thead th {height:42px; font-size:14px; font-weight:500; color:#000; background:#f5f5f5;}
.cptTable .tbWrite tbody th {height:42px; padding:10px 10px; font-size:14px; font-weight:500; color:#000; vertical-align:top; border-bottom:1px solid rgba(132, 132, 132, 0.2);}
.cptTable .tbWrite td {height:42px; padding:6px 10px; font-size:14px; font-weight:500; color:#000; border-bottom:1px solid rgba(132, 132, 132, 0.2);}

.cptTable .tbView {width:100%;}
.cptTable .tbView thead th {height:42px; font-size:14px; font-weight:500; color:#000; border-left:1px solid rgba(132, 132, 132, 0.2); border-bottom:1px solid rgba(132, 132, 132, 0.2); background:#f5f5f5;}
.cptTable .tbView thead th:first-child {border-left:0;}
.cptTable .tbView tbody th {height:42px; padding:10px 10px; font-size:14px; font-weight:500; color:#000; border-left:1px solid rgba(132, 132, 132, 0.2); line-height:20px; border-bottom:1px solid rgba(132, 132, 132, 0.2); background:#f5f5f5;}
.cptTable .tbView tbody th:first-child {border-left:0;}
.cptTable .tbView td {height:42px; padding:6px 10px; font-size:14px; font-weight:400; color:#000; border-left:1px solid rgba(132, 132, 132, 0.2); border-bottom:1px solid rgba(132, 132, 132, 0.2);}
.cptTable .tbView td:first-child {border-left:0;}
.cptTable .tbView td.noList {border-bottom:0; height:60px;}

.cptTable .required {margin-left:2px; color:var(--basic-color);}
.cptTable .clar {margin-top:2px; font-size:12px; line-height:17px; color:#757575;}

/* 추가조작 */
.cptTable table tr .left {text-align:left;}
.cptTable table tr .center {text-align:center;}
.cptTable table tr .right {text-align:right;}
.cptTable table tr .top {vertical-align:top;}
.cptTable table tr .middle {vertical-align:middle;}
.cptTable table tr .bottom {vertical-align:bottom;}
.cptTable table tr .fMid {font-weight:bold;}
.cptTable table tr .bold {font-weight:bold;}
.cptTable table tr span.txtBlue {color:var(--basic-color);}
.cptTable table tr span.txtRed {color:var(--basic-red);}
.cptTable table tr .bdl {border-left:1px solid rgba(132, 132, 132, 0.2) !important; }
.cptTable table tr td .fitPercent {color:var(--basic-color);}
.cptTable table tr td input:disabled {background:#f5f5f5; border:1px solid #eaeaea;}
.cptTable table tr td .gradeTxt {color:var(--basic-color)}
.cptTable.ovfType01 {height:435px; overflow-y:scroll; margin-bottom:12px;}
.cptTable .tbView td.exceptLine {border-left:1px solid rgba(132,132,132,0.2);}
.cptTable span.optTxt {font-size:11px;}
.cptTable tr.diffCell td {background:#f9f9f9;}
.cptTable.forOut td {background:#fff;}
.cptTable.forOut .frmGroup {justify-content:center;}
/* ------------------------------------------------ 데이터이력 ------------------------------------------------ */
.cptDataHistory {}
.cptDataHistory .historyList {margin-top:8px;}
.cptDataHistory .historyList:first-child {margin-top:0px;}
.cptDataHistory .historyList dt {font-size:14px; font-weight:400; color:#000; line-height:20px; margin-bottom:4px;}
.cptDataHistory .historyList dd {width:100%; min-height:80px; padding:20px; font-size:14px; font-weight:400; color:#000; line-height:20px; background:#f5f5f5;}


/* ------------------------------------------------------------------------------------------------------ */
/* ----------------------------------------------- module ----------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */

/* ------------------------------------------------ 분할 ------------------------------------------------ */
/* 기본 (1:1) */
.modDivision {width:100%; margin-top:40px; display:flex; gap:60px;}
.modDivision:first-child {margin-top:0;}
.modDivision .dvsItem {width:100%;}
.modDivision .dvsItem:first-child {width:830px; min-width:830px;}
.modDivision.half .dvsItem {width:50%;}
.modDivision.half .dvsItem:first-child {width:50%; min-width:50%;}


/* --------------------------------------------- tab in/out --------------------------------------------- */
.modTab {}
.modTab .tabMenu {width:100%; height:60px; display:flex;}
.modTab .tabMenu > .item {width:100%; height:100%; display:flex;}
.modTab .tabMenu > .item a {width:100%; height:100%; font-size:16px; font-weight:500; color:rgba(0,0,0,0.3); border-bottom:1px solid rgba(112,112,112,0.3); display:flex; justify-content:center; align-items:center; position:relative;}
.modTab .tabMenu > .item.on a {color:rgba(0,0,0,1);}
.modTab .tabMenu > .item.on a:after {content:""; width:100%; height:6px; background:#5a7eff; display:block; position:absolute; left:0; bottom:-1px;}
.modTab .tabContGroup {}
.modTab .tabContGroup .tabCont {display:none;}
.modTab .tabContGroup .tabCont.on {display:block;}


/* --------------------------------------------- popup --------------------------------------------- */
/*팝업 가운데 정렬 고정 값 추가 20230118*/
.modPopup {width:100%; height:100%; display:none; justify-content:center; align-items:center; position:fixed; left:50%; top:50%; z-index:1000; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%);}
.modPopup.on {display:flex; }
.modPopup *::-webkit-scrollbar {width:4px; background:rgba(132, 132, 132, 0.2);}
.modPopup *::-webkit-scrollbar-thumb {background:#9fa0a0;}

@media screen and (min-width:100px) and (max-width:1600px) {
    .modPopup {width:1600px; overflow:auto;}
}

.modPopup .popupDim {width:100%; height:100%; font-size:0; background:rgba(0,0,0,0.4); position:fixed; left:0; top:0;}
.modPopup.on .popupDim {opacity:0; animation: popOpenDimd 0.2s linear forwards;}
@keyframes popOpenDimd { 0% {opacity:0;} 100% {opacity:1;} }

.modPopup .popupArea {width:100%; max-width:1500px; height:auto; max-height: calc(100% - 60px);}
.modPopup.sm .popupArea {max-width:580px;}
.modPopup.md .popupArea {max-width:910px;}
.modPopup.lg .popupArea {max-width:1500px;}
/*팝업 사이즈 추가 20230208*/
.modPopup.tini .popupArea {max-width:400px;}

.modPopup .popupInMotion {width:100%; height:100%; background:#fff;}
/* .modPopup.on .popupInMotion {opacity:1; transform:scale(0.7); animation: popOpenScale 0.3s linear forwards;} */
/* @keyframes popOpenScale { 0% {opacity:0; transform:scale(0.7);} 100% {opacity:1; transform:scale(1);} } */

.modPopup .btnPopClose {width:40px; height:40px; font-size:0; border:0; background:url(/common/images/icon/btn_pop_close.svg) center no-repeat; position:absolute; right:20px; top:10px; z-index:10;}
.modPopup .popupContainer {width:100%; height:100%; max-height: calc(100vh - 60px); overflow:hidden;}
.modPopup .popupContArea {width:100%; height:100%; padding-bottom:30px; position:relative; background:#fff;}
.modPopup .popTitle {width:100%; min-height:60px; padding:14px 120px 9px 20px; font-size:26px; font-weight:500; color:#000; line-height:37px; border-bottom:1px solid rgba(132,132,132,0.2); position:relative; word-break:keep-all;}
.modPopup .popTitle.shadow {box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1);}
.modPopup .popCont {width:100%; max-height:calc(100vh - 214px); padding:20px 40px 0; overflow:auto;}
.modPopup .popBtm {padding:20px 40px 0; display:flex; justify-content:flex-end;}
.modPopup .popBtm.division {justify-content:space-between;}
.modPopup .popBtm .align {}

.modPopup.sm .popTitle {padding:18px 120px 13px 20px; font-size:20px; font-weight:500; color:#000; line-height:29px;}
.modPopup.sm .popupContArea {padding-bottom:20px;}
.modPopup.sm .popupArea .popCont {padding:20px 20px 0 20px;}
.modPopup.sm .popBtm {padding:20px 20px 0 20px;}

/*가이드이미지 전용 팝업 추가조작*/
.modPopup .popCont.thumbType {padding:10px;}
.modPopup .popupContArea.thumbType {padding-bottom:0;}

/* ------------------------------------------------ Alert ----------------------------------------------- */
.modAlert {width:100%; height:100%; background:rgba(0,0,0,0.4); display:none; justify-content:center; align-items:center; position:fixed; left:0; top:0; z-index:1100;}
.modAlert.on {display:flex;}
.modAlert .alertArea {width:400px; padding:30px 20px; background:#fff;}
.modAlert .alertArea .alertTit {width:100%; margin-bottom:10px; font-size:16px; font-weight:500; color:#000; line-height:24px; text-align:center;}
.modAlert .alertArea .alertCont {width:100%; min-height:80px; padding:20px; font-size:14px; font-weight:400; color:#000; line-height:20px; background:#f5f5f5;}
.modAlert .alertArea .alertMsg {width:100%; font-size:16px; font-weight:400; color:#000; line-height:24px; text-align:center;}
.modAlert .alertArea .alertBtm {width:100%; margin-top:20px; display:flex; justify-content:center;}

/*ALERT 추가 조작*/
.modAlert .alertArea .alertTit {width:100%; display:flex; flex-flow:column wrap; justify-content: center; align-items: center;}
.modAlert .alertArea .alertTit img {margin-bottom:10px; width:24px; height:24px;}
.modAlert .alertArea .alertTit span {font-size:16px; color:#000; font-weight:500; line-height:1;}
.modAlert .alertArea .alertMsg.lgAlertTy {font-size:14px; color:#757575;}
.modAlert .alertArea .alertMsg.lgAlertTy span {color:#ff4848;}

/* ------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------ global ----------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */
/* 말풍선 */
.glbTooltip *::-webkit-scrollbar {width:3px; background:rgba(132, 132, 132, 0.2);}
.glbTooltip *::-webkit-scrollbar-thumb {background:#9fa0a0;}
.glbTooltip {margin-left:5px; display:inline-block; position:relative;}
.glbTooltip .icon {width:20px; height:20px; font-size:0; border:0; background:url(/common/images/icon/ic_history.svg) center no-repeat;}
.glbTooltip .icon.icType02 {background:url(/common/images/common/qmk_icon.png) center no-repeat;}
.glbTooltip .tooltipCont {padding:15px; box-shadow: 3px 4px 12px 0 rgba(0, 0, 0, 0.2); border: solid 1px var(--basic-color); border-radius:4px; background-color: #f1f7fa; display:none; 
            position:absolute; left:33px; top:-4px; /*2022.01.11 z-index 추가*/ z-index:9;}
.glbTooltip .tooltipCont.on {display:inline-block;}
.glbTooltip .tooltipCont:after {content:""; border-right:7px solid #f1f7fa; border-top:5px solid transparent; border-bottom:5px solid transparent; position:absolute; top:9px; left:-6.5px;}
.glbTooltip .tooltipCont:before {content:""; border-right:7px solid var(--basic-color); border-top:5px solid transparent; border-bottom:5px solid transparent; position:absolute; top:9px; left:-8px;}
.glbTooltip.scaleS .tooltipCont {width:290px;}
.glbTooltip .tooltipCont .close {width:20px; height:20px; font-size:0; border:0; background:url(/common/images/icon/btn_tooltip_close.svg) center no-repeat; position:absolute; right:15px; top:15px;}
.glbTooltip .tooltipTit {width:calc(100% - 30px); margin-bottom:8px; font-size:14px; font-weight:700; color:#000; line-height:20px; display:inline-block;}
.glbTooltip .tooltipList {width:100%; max-height:68px; overflow:auto;}
.glbTooltip .tooltipList .item {padding-left:10px; margin-bottom:4px; font-size:14px; line-height:20px; position:relative;}
.glbTooltip .tooltipList .item:after {content:""; width:4px; height:4px; border-radius:50%; background:var(--basic-color); display:inline-block; position:absolute; left:0; top:8px;}

/*말풍선 추가사항*/
.glbTooltip.scaleMini .tooltipCont {width:200px; top:31px; left:0;}
.glbTooltip.scaleMini .tooltipCont:after {content:""; border-right:5px solid transparent; border-top:0px solid transparent; border-bottom:7px solid #f1f7fa; border-left:5px solid transparent; position:absolute; top:-7px; left:12px;}
.glbTooltip.scaleMini .tooltipCont:before {content:""; border-right:7px solid transparent; border-top:0px solid transparent; border-bottom:8px solid var(--basic-color); border-left:7px solid transparent; position:absolute; top:-8px; left:10px;}

/* ------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------ Form ----------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */
input[type=text] {width:100%; height:34px; padding-left:12px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px; background:#fff;}
input[type=password] {width:100%; height:34px; padding-left:12px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px;}
input[type=checkbox] {}
input[type=radio] {}
input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}
select {width:100%; height:34px; padding-left:12px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px; background:#fff url(/common/images/icon/icon_slt.svg) calc(100% - 10px) center no-repeat;}
textArea {width:100%; height:150px; font-size:14px; font-weight:400; color:#000;}
input:focus {outline:none;}

/* 기본 */
input.iptText {}
input.iptText:first-child {margin-left:0;}
input.iptChk {width:1px; height:1px; position:absolute; left:0; top:0; opacity:0.01;}
input.iptRdo {width:1px; height:1px; position:absolute; left:0; top:0; opacity:0.01;}
label.iptLbl {display:inline-block;}
select.iptSlt {font-size:14px;}
.textBox {margin-left:5px; height:34px; line-height:37px; display:inline-block;}
.textBoxFnt {margin-right:5px; height:34px; line-height:37px; display:inline-block; min-width:40px;}
.textBox.deco {width:15px; min-width:15px; margin-left:2px; text-align:center;}
.textBox.clar {font-size:12px; line-height:17px; margin-top:2px;}
.textBox.noM {margin:0; height:15px;}
.iptDate {width:100%; margin-left:5px; position:relative;}
.iptDate:first-child {margin-left:0;}
/*20230113 달력 버튼 제거 및 배경이미지화 처리*/
.iptDate input {background:#fff url(/common/images/icon/ic_textfield_calendar.svg) right 10px center no-repeat !important;}
.iptDate button {display:none;}
/* .iptDate .dateBtn {width:38px; height:34px; font-size:0; border:0; background:url(/common/images/icon/ic_textfield_calendar.svg) center no-repeat; position:absolute; top:0; right:0;} */
/* // 20230113 달력 버튼 제거 및 배경이미지화 처리*/
.iptDate + .frmChoBox {margin-left:30px;}
.fileBox {position:relative;}
.fileBox .fileName {width:auto; height:30px; line-height:29px; font-size:14px; color:#000; border:0;}
.fileBox .fileDel {width:20px; height:20px; margin-left:5px; font-size:0; border:0; background:url(/common/images/icon/btn_del.svg) center no-repeat;}
.fileBox .fileDel2 {width:20px; height:20px; margin-left:5px; font-size:0; border:0; background:url(/common/images/icon/btn_del.svg) center no-repeat;} /*20230404 추가*/
.fileBox .fileAfter {align-items: center; display:none;}
.fileBox .fileAfter .limit200 {width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.fileBox.on .fileBefore {display:none;}
.fileBox.on .fileAfter {display:flex;}

/*파일박스 추가조작*/
.excInfo {display:flex; justify-content:start; align-items:center; margin-top:5px;}
.excInfo .textBox {height:auto; line-height:1; }
.sampleDl > a {display:inline-block; font-size:12px; color:#2a3d3e; font-weight:bold; margin-left:5px; background:url('/common/images/common/btn_download.png')right 0px no-repeat; padding-right:18px; box-sizing:border-box;}

input.iptText, select.iptSlt {margin-left:2px;}
input.iptText:first-child, select.iptSlt:first-child, .textBox:first-child {margin-left:0;}

/* 크기 */
html .frmTini {width:60px; min-width:60px;}
html .frmXs {width:100px; min-width:100px;}
html .frmSm {width:130px; min-width:130px;}
html .frmMd {width:170px; min-width:170px;}
html .frmLg {width:200px; min-width:200px;}
html .frmHalf {width:calc(50% - 3px); min-width:calc(50% - 3px);}
html .frmThrd {width:calc(70% - 3px); min-width:calc(70% - 3px);}
html .frmFrth {width:calc(90% - 3px); min-width:calc(90% - 3px);}
textArea.areaMd {height:150px;}

/* ------------------------------------------------ 라디오/체크박스 ------------------------------------------------ */
/* 일반 체크박스/라디오 박스 */
.frmChoBox {margin-right:30px; display:inline-block; position:relative;}
.frmChoBox .iptLbl {margin-right:10px; padding-top:5px; padding-bottom:5px; word-break:keep-all;}
.frmChoBox .iptLbl:last-child {margin-right:0;}
.frmChoBox .iptChk + .iptLbl {padding-left:24px; font-size:14px; line-height:20px; color:#000; background:url(/common/images/icon/ic_chk_off.svg) left center no-repeat;}
.frmChoBox .iptChk:checked + .iptLbl {background:url(/common/images/icon/ic_chk_on.svg) left center no-repeat;}
.frmChoBox .iptRdo + .iptLbl {padding-left:24px; font-size:14px; line-height:20px; color:#000; background:url(/common/images/icon/ic_slt_off.svg) left center no-repeat;}
.frmChoBox .iptRdo:checked + .iptLbl {background:url(/common/images/icon/ic_slt_on.svg) left center no-repeat;}
.frmChoBox:last-child {margin-right:0;}
/* 체크박스/라디오 리스트 */
.frmChoList {width:100%; display:flex; flex-wrap:wrap;}
.frmChoList .frmChoBox {width:200px; margin-right:0;}
.frmChoList.w100 .frmChoBox {width:100px;}
.frmChoList.w150 .frmChoBox {width:150px;}
.frmChoList.w200 .frmChoBox {width:200px;}
.frmChoList.w250 .frmChoBox {width:250px;}
.frmChoList.w300 .frmChoBox {width:300px;}
.frmChoList.col6 .frmChoBox {width:50%;}
.frmChoList.col4 .frmChoBox {width:33.333%;}
.frmChoList.col3 .frmChoBox {width:25%;}
.frmChoList.col2 .frmChoBox {width:18.888%;}
.frmChoList.vertical {padding-top:5px;}
.frmChoList.vertical .frmChoBox {width:100%;}
/* 텍스트 없는 체크박스/라디오 */
.frmChoBox.only .iptChk + .iptLbl {height:30px; margin:0; padding-left:20px;}
.frmChoBox.only .iptRdo + .iptLbl {height:30px; margin:0; padding-left:20px;}

/*일반 체크 및 라디오 박스 여백 좁힘*/
.frmChoBox.type02 {margin-right:10px;}

/*일반 체크 및 라디오 박스 가로 퍼센트 비율*/
.frmChoBox.type03 {margin:0; width:13.9%;}

/* 버튼식 체크박스/라디오 박스 */
.frmChoBtn {display:flex;} 
.frmChoBtn .iptChk + .iptLbl {width:100px; height:30px; font-size:14px; text-align:center; color:#fff; line-height:26px; border-radius:3px; border:1px solid #444; background:#666;}
.frmChoBtn .iptChk:checked + .iptLbl {border:1px solid #2784ff; background:#319af6;}
.frmChoBtn .iptRdo + .iptLbl {width:100px; height:30px; font-size:14px; text-align:center; color:#fff; line-height:26px; border-radius:3px; border:1px solid #444; background:#666;}
.frmChoBtn .iptRdo:checked + .iptLbl {border:1px solid #2784ff; background:#319af6;}


/* ------------------------------ 한줄 안에 여러폼을 넣어야 할 경우 ------------------------------ */
.frmGroup {display:flex; align-items:center;}
.frmGroup .iptText, .frmGroup .iptSlt, .frmGroup .textBox {margin-left:5px;}
.frmGroup .textBox.clar {margin-top:0; margin-left:5px;}


/* ----------------------------------------- 검색영역 Form ----------------------------------------- */
.cptSearchArea input[type=text] {height: 34px; padding-left: 12px; font-size: 14px; border: 1px solid #bbbbbb; border-radius: 4px; background: #fff;}
.cptSearchArea input[type=password] {height:34px; padding-left:12px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px;}
.cptSearchArea input[type=checkbox] {}
.cptSearchArea input[type=radio] {}
.cptSearchArea select {height:34px; margin-left:5px; padding-left:12px; font-size:14px; border:1px solid #bbbbbb; border-radius:4px; background:#fff url(/common/images/icon/icon_slt.svg) calc(100% - 10px) center no-repeat;}
.cptSearchArea select:first-child {margin-left:0px;}

.cptSearchArea .iptDate {height:34px;}
.cptSearchArea .iptDate .dateBtn {width:38px; height:34px;}
.cptSearchArea .textBox {height:34px; line-height:37px; display:inline-block;}
.cptSearchArea .required {margin-left:2px; color:var(--basic-color);}

/* ----------------------------------------- 그리드영역 Form ----------------------------------------- */



/* ----------------------------------------- 테이블영역 Form ----------------------------------------- */
.cptTable input.iptText {height:30px;}
.cptTable select.iptSlt {height:30px;}
.cptTable .textBox {height:30px; line-height:29px;}

.cptTable .iptDate {height:30px;}
.cptTable .iptDate .dateBtn {width:30px; height:30px;}

/* ------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------ Button ----------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */
.btn {min-width:120px; padding:0 10px; height: 44px; margin-left:5px; font-size: 16px; font-weight: 500; white-space: nowrap; border-radius: 4px; background: var(--basic-dkBlue);}
.btn.blue {color: #fff; background: var(--basic-color); border:1px solid var(--basic-color);}
.btn.red {color: #fff; background: var(--basic-red); border:1px solid var(--basic-red);}
.btn.purple {color: #fff; background: var(--basic-purple); border:1px solid var(--basic-purple);}
.btn.dkBlue {color: #fff; background: var(--basic-dkBlue); border:1px solid var(--basic-dkBlue);}
.btn.gLine {color:#757575; background:#fff; border:1px solid #9fa0a0;}
.btn.dkbLine {color: var(--basic-dkBlue); background:#fff; border:1px solid var(--basic-dkBlue);}


/* ----------------------------------------- 팝업 하단 button ----------------------------------------- */
.modPopup .btn {min-width:100px; padding:0 10px; height: 34px; margin-left:5px; font-size: 14px; font-weight: 400; white-space: nowrap; border-radius: 4px;}

/* ----------------------------------------- 알럿 하단 button ----------------------------------------- */
.modAlert .btn {min-width:100px; padding:0 10px; height: 34px; margin-left:5px; font-size: 14px; font-weight: 400; white-space: nowrap; border-radius: 4px;}

/* ----------------------------------------- 검색영역 button ----------------------------------------- */
.cptSearchArea .srhBtn { padding:0 10px; height: 34px; margin-left:5px; font-size: 14px; font-weight: 400; white-space: nowrap; border-radius: 4px; background: var(--basic-dkBlue);}
.cptSearchArea .srhBtn.blue {color: #fff; background: var(--basic-color); border:1px solid var(--basic-color);}
.cptSearchArea .srhBtn.dkBlue {color: #fff; background: var(--basic-dkBlue); border:1px solid var(--basic-dkBlue);}
.cptSearchArea .srhBtn.gLine {color:#2a2d3e; background:#fff; border:1px solid #9fa0a0;}
.cptSearchArea .srhBtn.dkbLine {color: var(--basic-dkBlue); background:#fff; border:1px solid var(--basic-dkBlue);}
.cptSearchArea .srhBtn.purple {color: #fff; background: var(--basic-purple); border:1px solid var(--basic-purple);}
.cptSearchArea .srhBtn.disabled {color: rgba(0, 0, 0, 0.3); border:1px solid rgba(132, 132, 132, 0.2); background:#f7f7f7; cursor:default;}
/*20230113 예약일자 이전버튼 여백 제거*/
.cptSearchArea .srhBtn.prev {margin-left:0;}
.cptSearchArea .srhBtn.prev,
.cptSearchArea .srhBtn.next {border:1px solid #2a2d3e;}

/* ----------------------------------------- 사이드 Button ----------------------------------------- */
.comSideOpt .srhBtn {padding:0 10px; height: 30px; margin-left:2px; font-size: 14px; font-weight: 400; white-space: nowrap; border-radius: 4px; background: var(--basic-dkBlue);}
.comSideOpt .srhBtn:first-child {margin-left:0;}
.comSideOpt .srhBtn.blue {color: #fff; background: var(--basic-color); border:1px solid var(--basic-color);}
.comSideOpt .srhBtn.red {color: #fff; background: var(--basic-red); border:1px solid var(--basic-red);}
.comSideOpt .srhBtn.dkBlue {color: #fff; background: var(--basic-dkBlue); border:1px solid var(--basic-dkBlue);}
.comSideOpt .srhBtn.gLine {color:#757575; background:#fff; border:1px solid #9fa0a0;}
.comSideOpt .srhBtn.blLine {color:#2a2d3e; background:#fff; border:1px solid #2a2d3e;}
.comSideOpt .srhBtn.dkbLine {color: var(--basic-dkBlue); background:#fff; border:1px solid var(--basic-dkBlue);}
.comSideOpt .srhBtn.bLine {color: var(--basic-color); background:#fff; border:1px solid var(--basic-color);}
.comSideOpt .srhBtn.purple {color: #fff; background: var(--basic-purple); border:1px solid var(--basic-purple);}
.comSideOpt .srhBtn.up01 {width:20px; height:20px; background:url('/common/images/common/up01.png')center center no-repeat; border-radius:50%; padding:0; border:1px solid #2a2d3e;}
.comSideOpt .srhBtn.down01 {width:20px; height:20px; background:url('/common/images/common/down01.png')center center no-repeat; border-radius:50%; padding:0; border:1px solid #2a2d3e;}
.comSideOpt .srhBtn.upTop {width:20px; height:20px; background:url('/common/images/common/upTop.png')center center no-repeat; border-radius:50%; padding:0; border:1px solid #2a2d3e;}
.comSideOpt .srhBtn.downBottom {width:20px; height:20px; background:url('/common/images/common/downBottom.png')center center no-repeat; border-radius:50%; padding:0; border:1px solid #2a2d3e;}
.comSideOpt .srhBtn.disabled {color: rgba(0, 0, 0, 0.3); border:1px solid rgba(132, 132, 132, 0.2); background:#f7f7f7; cursor:default;}

/* ----------------------------------------- 그리드 내부 button ----------------------------------------- */
.cptGrid .gridBtn { padding:0 10px; height: 30px; margin-left:2px; font-size: 14px; font-weight: 400; white-space: nowrap; border-radius: 4px; background: var(--basic-dkBlue);}
.cptGrid .gridBtn.blue {color: #fff; background: var(--basic-color); border:1px solid var(--basic-color);}
.cptGrid .gridBtn.red {color: #fff; background: var(--basic-red); border:1px solid var(--basic-red);}
.cptGrid .gridBtn.purple {color: #fff; border:1px solid var(--basic-purple); background: var(--basic-purple);}
.cptGrid .gridBtn.dkBlue {color: #fff; border:1px solid var(--basic-dkBlue); background: var(--basic-dkBlue);}
.cptGrid .gridBtn.gLine {color:#2a2d3e; background:#fff; border:1px solid #9fa0a0;}
.cptGrid .gridBtn.blLine {color:#2a2d3e; background:#fff; border:1px solid #2a2d3e;}
.cptGrid .gridBtn.dkbLine {color: var(--basic-dkBlue); background:#fff; border:1px solid var(--basic-dkBlue);}
.cptGrid .gridBtn.disabled {color: rgba(0, 0, 0, 0.3); border:1px solid rgba(132, 132, 132, 0.2); background:#f7f7f7; cursor:default;}
.cptGrid .frmGroup .gridBtn {margin-left:5px;}

/* ----------------------------------------- 테이블영역 button ----------------------------------------- */
.cptTable .gridBtn { padding:0 10px; height: 30px; margin-left:2px; font-size: 14px; font-weight: 400; white-space: nowrap; line-height:28px; border-radius: 4px; background: var(--basic-dkBlue); display:inline-block;}
.cptTable .gridBtn.blue {color: #fff; background: var(--basic-color); border:1px solid var(--basic-color);}
.cptTable .gridBtn.red {color: #fff; background: var(--basic-red); border:1px solid var(--basic-red);}
.cptTable .gridBtn.purple {color: #fff; border:1px solid var(--basic-purple); background: var(--basic-purple);}
.cptTable .gridBtn.dkBlue {color: #fff; border:1px solid var(--basic-dkBlue); background: var(--basic-dkBlue);}
.cptTable .gridBtn.gLine {color:#2a2d3e; background:#fff; border:1px solid #9fa0a0;}
.cptTable .gridBtn.blLine {color:#2a2d3e; background:#fff; border:1px solid #2a2d3e;}
.cptTable .gridBtn.dkbLine {color: var(--basic-dkBlue); background:#fff; border:1px solid var(--basic-dkBlue);}
.cptTable .frmGroup .gridBtn {margin-left:5px;}
.cptTable.complexView .tbView td:first-child {border-left:1px solid rgba(132, 132, 132, 0.2)}

/* ------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------ cpt margin ----------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------ */
.cptGroupBtm + .cptGrid {margin-top:30px;}

/* .modPopup .modDivision {margin-top:30px;} */
.modPopup .comSmTit {margin-top:20px; margin-bottom:8px;}
.modPopup .comSmTit:first-child {margin-top:0;}
.modPopup .cptSearchArea {margin-top:0;}
.modPopup .cptGrid {margin-bottom:8px;}
.modPopup .cptGroupBtm {margin-top:8px;}

/* ----------------------------------------- 체력측정내역조회 예약표 ----------------------------------------- */
.cptResvTb {width:100%; position:relative; display:flex; gap:10px 10px; font-size:14px;}
.cptResvTb .items {width:100%; border-radius:20px; box-sizing:border-box; overflow:hidden; border:1px solid #e1e5ef;}
.cptResvTb .items .resvListHead {background:#2a2d3e; padding:0 20px; box-sizing:border-box;}
.cptResvTb .items .resvListHead > p.resvHeadTime {font-size:14px; color:#fff; font-weight:400; text-align:center; padding:12px 0; box-sizing:border-box; border-bottom:1px solid #fff;}
.cptResvTb .items .resvListHead > .resvHeadCate {display:flex; flex-flow:row nowrap; padding:12px 0 ; box-sizing:border-box;}
.cptResvTb .items .resvListHead > .resvHeadCate > p {font-size:14px; color:#fff; font-weight:400; text-align:center;}
.cptResvTb .items .resvListHead > .resvHeadCate > p:first-of-type {width:60%;}
.cptResvTb .items .resvListHead > .resvHeadCate > p:last-of-type {width:40%;}

.cptResvTb .resvList {width:100%; }
.cptResvTb .resvList ul {width:100%;}
.cptResvTb .resvList ul li {background:#fff; padding: 0 20px; box-sizing:border-box; }
.cptResvTb .resvList ul li.resvAvail {background:#f1f7fa;}
.cptResvTb .resvList ul li.resvAvail a {display:block; width:100%; height:100%; }
.cptResvTb .resvList ul li .infoBox {border-bottom:1px solid rgba(132,132,132,0.2); display:flex; flex-flow:row nowrap; padding:14px 0; box-sizing:border-box; text-align:center; color:#000;}
.cptResvTb .resvList ul li .infoBox > div.timeBox {width:60%;}
.cptResvTb .resvList ul li .infoBox > div.popCnt {width:40%; }
.cptResvTb .resvList ul li:last-of-type .infoBox {border-bottom:0;}

/* ----------------------------------------- 체력측정 예약등록 팝업 추가 css ----------------------------------------- */                            
.srchBox {margin-top:8px;}
.cptNoResult {width:100%; position:relative; border-top:1px solid #000;}
.cptNoResult .txtArea {padding: 20px 0 ;box-sizing:border-box;}
.cptNoResult .txtArea > p {font-size:14px; color:#000; font-weight:500; text-align:center;}
.cptNoResult .txtArea > p:last-of-type {color:#757575;}
.cptNoResult .txtArea > p:last-of-type b {color:#000;}
.cptNoResult .btnArea { width:100%; text-align:center;}
.chkArea {display:flex; flex-flow:column nowrap;}

/* ----------------------------------------- 측정결과 상세내역 데이터수정이력 입력영역 css ----------------------------------------- */                            
.cptDataInsert {width:100%; margin-bottom:10px;}
.cptDataInsert p.dataDtLog {font-size:14px; color:#000; font-weight:400; line-height:1; margin-bottom:5px;}
.cptDataInsert textarea {width:100%; height:150px; overflow-y:scroll;}
/*20230411 온라인, 정부24 운동상담 내용 클래스 추가 (송호연) */
.cptDataInsert.counselArea textarea {width:100%; height:300px !important; overflow-y:scroll;}
.cptDataInsert .dataBtn {text-align:right; margin-top:8px;}
.cptDataInsert.dataExp {margin-bottom:0;}

/* ----------------------------------------- 추천운동처방전 조회 운동처방 프로그램 ----------------------------------------- */  
.cptPrescriptArea {width:100%; position:relative;}
.cptPrescriptArea .programArea {display:flex; gap:20px; margin-bottom:20px; flex-flow:row wrap;} /*20230214 수정*/
.cptPrescriptArea .programArea .items {width:403px; border:1px solid rgba(132, 132, 132, 0.2); } /*20230214 수정*/
.cptPrescriptArea .programArea .items .progTit {font-size:16px; color:#fff; text-align:center; padding: 6px 0; box-sizing:border-box; background:#2a2d3e;}
.cptPrescriptArea .programArea .items .progImg {padding:10px; box-sizing:border-box;}
.cptPrescriptArea .programArea .items .progImg .progImgInner {width:100%; height:250px; background:rgba(132, 132, 132, 0.2); display:flex; justify-content: center; align-items: center;;}
.cptPrescriptArea .programArea .items .progImg .progImgInner img {width:380px; height:250px;} /*20230214 이미지 사이즈 고정*/
.cptPrescriptArea .programArea .items .progBtn {padding:0 10px 10px 10px; box-sizing:border-box;}
.cptPrescriptArea .programArea .items .progBtn > div {margin:0;}

.cptTxtAreaBox {background:#f5f5f5; color:#000; padding: 20px; box-sizing:border-box; height:100px; overflow-y:scroll; font-size:14px;}

/* ----------------------------------------- 목록형식 및 달력형식 ----------------------------------------- */  
.cptGrid.listTypeCal tr.sat td {background:#f1f7fa;}
.cptGrid.listTypeCal tr.sun td {background:#fceeee;}
.cptGrid .gridTb tbody tr.sat td:first-child::after {background:#f1f7fa;}
.cptGrid .gridTb tbody tr.sat td:last-child::after {background:#f1f7fa;}
.cptGrid .gridTb tbody tr.sun td:first-child::after {background:#fceeee;}
.cptGrid .gridTb tbody tr.sun td:last-child::after {background:#fceeee;}

.cptCalendarOpt {width:100%; position:relative; padding:38px 0 12px;}
.cptCalendarOpt > .chkAllArea {position:absolute; top:40px; left:0;}
.cptCalendarOpt > .yymmArea {font-size:0; text-align:center;}
.cptCalendarOpt > .yymmArea > * {display:inline-block; vertical-align:middle;}
.cptCalendarOpt > .yymmArea > div {margin:0 20px;}
.cptCalendarOpt > .yymmArea > div span {font-size:24px; color:#000; font-weight:500; display:inline-block; vertical-align:middle;}
.cptCalendarOpt > .yymmArea > div span:nth-of-type(2) {margin-right:10px;}
.cptCalendarOpt > .btnArea {position:absolute; top:40px; right:0;}
.cptCalendarOpt > .btnArea button {padding:5px 10px; box-sizing:border-box; height:auto; font-size:14px; font-weight:400;min-width:auto;}

.cptCalView {width:100%; position:relative;}
.cptCalView .calCover {width:100%; border:1px solid #e1e5ef; border-radius:10px; box-sizing:border-box; overflow:hidden;}
.cptCalView .calCover .calTxt {width:100%; font-size:14px; }
.cptCalView .calCover .calTxt ul {display:flex; justify-content: start;}
.cptCalView .calCover .calTxt ul li {width:14.28%; min-width:180px; height:44px; line-height:44px; text-align:center; background:#f5f5f5; color:#000; border-right: 1px solid rgba(132, 132, 132, 0.2); border-bottom: 1px solid rgba(132, 132, 132, 0.2);}
.cptCalView .calCover .calTxt ul li.sat {background:#f1f7fa; color:#2784ff; border-right:0;}
.cptCalView .calCover .calTxt ul li.sun {background:#fceeee; color:#ff4848;}

.cptCalView .calCover .calBox {width:100%; font-size:14px;}
.cptCalView .calCover .calBox ul {display:flex; justify-content: start; flex-flow:row wrap;}
.cptCalView .calCover .calBox ul li {width:14.28%; min-width:180px; height:130px; background:#fff; border-right:1px solid rgba(132,132,132,0.2); border-bottom:1px solid rgba(132,132,132,0.2); padding:10px; box-sizing:border-box;}
.cptCalView .calCover .calBox ul li.sat {border-right:0;}
.cptCalView .calCover .calBox ul li.sat {border-right:0;}
.cptCalView .calCover .calBox ul li span.dtTxt {font-size:14px; font-weight:bold; display:block;}
.cptCalView .calCover .calBox ul li.sat span.dtTxt {color:#2784ff;}
.cptCalView .calCover .calBox ul li.sun span.dtTxt {color:#ff4848;}
.cptCalView .calCover .calBox ul li span.resvT {background:#596edb; color:#fff; border-radius:25px; box-sizing:border-box; padding:0 10px; box-sizing:border-box;}
.cptCalView .calCover .calBox ul li span.resvF {background:#f5f5f5; color:#757575; border:1px solid #9fa0a0; border-radius:25px; box-sizing:border-box; padding:0 10px; box-sizing:border-box;}
.cptCalView .calCover .calBox ul li span.dayOff {border:1px solid #ff4848; color:#ff4848; border-radius:25px; box-sizing:border-box; padding:0 10px; box-sizing:border-box;}
.cptCalView .calCover .calBox ul li div.outInfo {margin-top:10px;}
.cptCalView .calCover .calBox ul li div.outInfo > p {color:#000; width:100%; overflow:hidden; text-overflow: ellipsis; white-space:nowrap;}
.cptCalView .calCover .calBox ul li.noL {border-bottom:0;}

/* ----------------------------------------- 출석현황 달력 ----------------------------------------- */  
.cptAttCalCov {width:100%; border:1px solid rgba(132, 132, 132, 0.2); padding:20px 40px; box-sizing:border-box;}
.cptAttCalCov .attCal {width:100%; position:relative;}
.cptAttCalCov .attCal .attCalOpt {width:100%; display:flex; flex-flow:row nowrap; justify-content: center; align-items: center; gap:20px;}
.cptAttCalCov .attCal .attCalOpt > p {font-size:24px; color:#000; font-weight:500; line-height:1;}
.cptAttCalCov .attCal .weekBar {width:100%; margin:25px 0 30px;}
.cptAttCalCov .attCal .weekBar ul {display:flex; flex-flow: row nowrap; justify-content: space-between; align-items: center;}
.cptAttCalCov .attCal .weekBar ul li {width:40px; height:25px; text-align:center; font-size:16px; color:#000; font-weight:500;}
.cptAttCalCov .attCal .weekBar ul li.sun {color:#ff4848;}
.cptAttCalCov .attCal .weekBar ul li.sat {color:#2784ff;}
.cptAttCalCov .attCal .dateBox {width:100%;}
.cptAttCalCov .attCal .dateBox ul {display:flex; flex-flow: row wrap; justify-content: space-between; align-items: center;}
.cptAttCalCov .attCal .dateBox ul li {width:40px; height:40px; margin-right:20px; margin-bottom:40px;}
.cptAttCalCov .attCal .dateBox ul li:nth-of-type(7n) {margin-right:0;}
.cptAttCalCov .attCal .dateBox ul li.noMb {margin-bottom:0;}
.cptAttCalCov .attCal .dateBox ul li a {display:block; width:100%; height:100%; border-radius:50%; text-align:center; line-height:40px; font-size:16px; color:#000; font-weight:400; transition:all 0.2s; }
.cptAttCalCov .attCal .dateBox ul li a.dtSel {background:#5a7eff; color:#fff;}
.cptAttCalCov .attCal .dateBox ul li a.today {background:#faebe0; }
.cptAttCalCov .attCal .dateBox ul li a.disabled {color:rgba(132, 132, 132, 0.2); cursor:default;}
.cptAttCalCov .attCal .dateBox ul li a:hover {background:#ececf1;}
.cptAttCalCov .attCal .dateBox ul li a.disabled:hover {background:#fff;}
.cptAttCalCov .attCal .dateBox ul li.notThisMon a {cursor:default; color:#757575; opacity:0.3; transition:0;}
.cptAttCalCov .attCal .dateBox ul li.notThisMon a:hover {background:#fff;}

/* ----------------------------------------- 시스템 관리 ----------------------------------------- */
/* ----------------------------------------- 공단사용자 등록 거점 관리 권역 표 ----------------------------------------- */
.cptChkLoc {width:100%; border-top:1px solid #000; border-bottom:1px solid rgba(132,132,132,0.2);}
.cptChkLoc ul {display:flex; justify-content:start; align-items:center; flex-flow:row wrap;}
.cptChkLoc ul li {width:20%; border-bottom:1px solid rgba(132,132,132,0.2); padding:5px 10px; box-sizing:border-box;}
.cptChkLoc ul li.noBb {border-bottom:0;}

/* ----------------------------------------- 체력인증기준조회 표 신규 구성 ----------------------------------------- */
.cptVertScr {width:100%; border:1px solid #e1e5ef; border-radius:10px; overflow:hidden; }
.cptVertScr table {width:100%; border-collapse:collapse; border-spacing:0;}
.cptVertScr table tr {background:#fff;}
.cptVertScr table th {padding:5px 5px; height:44px; font-size:14px; font-weight:400; color:#fff; text-align:center; line-height:1.6; background:#2a2d3e;}
.cptVertScr table td {padding:5px 5px; height:48px; font-size:14px; font-weight:400; color:#333; text-align:center; line-height:1.6; border-bottom:1px solid #ddd; position:relative;}
.cptVertScr .lftHead table td:first-child,
.cptVertScr .lftHead table th:first-child  {padding-left:20px; box-sizing:border-box;}
.cptVertScr .lftHead table th:first-child::after,
.cptVertScr .lftHead table td:first-child::after {content:''; width:20px; height:1px; background:#fff; display:block; position:absolute; left:0; bottom:-1px;}
.cptVertScr .rytBody table td:last-child,
.cptVertScr .rytBody table th:last-child {padding-right:20px; box-sizing:border-box;}
.cptVertScr .rytBody table th:last-child::after,
.cptVertScr .rytBody table td:last-child::after {content:''; width:20px; height:1px; background:#fff; display:block; position:absolute; right:0; bottom:-1px;}
.cptVertScr > div {float:left;}
.cptVertScr .lftHead {width:50%;}
.cptVertScr .rytBody {width:50%; overflow-x:scroll;}
.cptVertScr .rytBody table {width:1200px;}
.cptVertScr .rytBody::-webkit-scrollbar {height:8px; background:rgba(132, 132, 132, 0.2);}
.cptVertScr .rytBody::-webkit-scrollbar-thumb {background:#9fa0a0;}
.cptVertScr .lftHead table td.mEnt,
.cptVertScr .rytBody table td.mEnt {background:#f1f7fa; color:#000 !important;}

.cptVertScr.type02 .lftHead {width:35%;}
.cptVertScr.type02 .lftHead thead tr th {height:121.17px;}
.cptVertScr.type02 .rytBody {width:65%; overflow-x:scroll;}
.cptVertScr.type02 .rytBody table {width:2000px;}

/* ----------------------------------------- 기한 연장 신규 구성 ----------------------------------------- */
.cptDelayBox {width:100%; border-top:1px solid #000; margin-top:20px; text-align:center; padding:20px 0 ;box-sizing:border-box;}
.cptDelayBox .cdbCnt {color:#5a7eff; font-weight:bold;}
.cptDelayBox p, .cptDelayBox span {font-size:14px; color:#000; font-weight:400;}
.cptDelayBox > div {display:flex; justify-content: center; flex-flow:row wrap; align-items:center; margin-top:5px;}
.cptDelayBox > div > div {margin: 0 5px;}

/* ----------------------------------------- 로그인페이지 ----------------------------------------- */
.lytLogin {background:#f5f6fa; position:relative; width:100%; height:100%;}
.lytLogin .cptLogin {position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); width:1000px; border-radius:30px; box-sizing:border-box; overflow:hidden; height:500px; box-shadow:5px 5px 68px 0 rgba(129,129,129,0.3);}
.lytLogin .cptLogin .lgInner {display:flex; flex-flow:row nowrap; justify-content: center; align-items: center;}
.lytLogin .cptLogin .lgInner > div.titBox {width:400px; height:500px; background:#2a2d3e; padding: 60px 50px; box-sizing:border-box;}
.lytLogin .cptLogin .lgInner > div.titBox .mainTit {margin-top:20px; font-size:43px; color:#fff; font-weight:500; letter-spacing:-0.1em; line-height:58px;}
.lytLogin .cptLogin .lgInner > div.titBox .btTit {margin-top:160px; font-size:18px; color:#f1f7fa; font-weight:300; letter-spacing:-0.05em; line-height:normal;}
.lytLogin .cptLogin .lgInner > div.titBox .btTit span {font-weight:bold; color:#5a7eff; vertical-align: top;}
.lytLogin .cptLogin .lgInner > div.fnBox {width:600px; height:500px; background:#fff; padding: 60px 100px; box-sizing:border-box;}
.lytLogin .cptLogin .lgInner > div.fnBox > p {font-size:40px; color:#000; font-weight:bold; letter-spacing:normal; margin-bottom:20px;}
.lytLogin .cptLogin .lgInner > div.fnBox > .iptBox {width:100%; margin-bottom:10px;}
.lytLogin .cptLogin .lgInner > div.fnBox > .iptBox input {border:1px solid #bbb; border-radius:5px; height:60px; line-height:60px; font-size: 16px; color:#000; font-weight:500;}
.lytLogin .cptLogin .lgInner > div.fnBox > .iptBox input::-webkit-input-placeholder {color:#ccc; font-weight:400;}
.lytLogin .cptLogin .lgInner > div.fnBox > .lgBtn {width:100%; margin-top:10px;}
.lytLogin .cptLogin .lgInner > div.fnBox > .lgBtn a {display:block; width:100%; height:66px; background:#596edb; font-size:18px; color:#fff; font-weight:500; text-align:center; line-height:66px; border-radius:5px;}
.lytLogin .cptLogin .lgInner > div.fnBox > .lgFunc {width:100%; display:flex; flex-flow:row nowrap; justify-content: space-between; align-items: center; margin:12px 0 33px 0;}
.lytLogin .cptLogin .lgInner > div.fnBox > .lgFunc > div a {font-size:14px; color:#000; font-weight:500; letter-spacing:-0.28px;}
/*20230216 문구수정으로인한 css 수정*/
.lytLogin .cptLogin .lgInner > div.fnBox > .lgWarn {border-top:1px solid rgba(132, 132, 132, 0.2); padding: 10px 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; justify-content:start; align-items: top;}
.lytLogin .cptLogin .lgInner > div.fnBox > .lgWarn img {height:19px; margin-right:5px;}
.lytLogin .cptLogin .lgInner > div.fnBox > .lgWarn span {font-size:13px; color:#757575;}

/*아이디조회 css*/
.idenResult {width:100%; height:75px; background:#f1f7fa; padding:12px 0; box-sizing:border-box;}
.idenResult p.scTit {font-size:14px; color:#000; font-weight:500; text-align:center;}
.idenResult span.scInfo {display:block; font-size:16px; color:#000; font-weight:bold; text-align:center; margin-top:10px;}
.idenResult p.flTit {font-size:14px; color:#000; font-weight:500; text-align:center; line-height:53px;}

/*신규 관리자 등록 */
.admJoin {width:100%; height:80px; overflow-y:scroll; background:#f5f5f5; padding:20px; box-sizing:border-box; font-size:14px; color:#000; font-weight:500;}


/* ----------------------------------------- 에러페이지 ----------------------------------------- */
.lytError {}
.lytError .errorArea {max-width: 1440px; margin: 0 auto; padding: 100px 20px 0;}
.lytError .errorTop {margin-bottom: 60px; padding-bottom: 20px; border-bottom: 2px solid #000;}
.lytError .errorTop h1 {}
.lytError .errorTop h1 img {width: 177px; vertical-align: top;}
.lytError .errorCont {padding-top: 162px; background: url('/common/images/icon/error_icon01.svg') center 0 no-repeat; text-align: center;}
.lytError .errorCont .mainTxt {display: block; color: #000; font-size: 32px;}
.lytError .errorCont .subTxt {margin-top: 16px; color: #757575; font-size: 20px; line-height: 1.6;}
.lytError .errorBottom {margin-top: 90px; padding-top: 26px; border-top: 1px solid #c2c2c2;}
.lytError .errorBottom .copyright {color: #000; font-size: 13px; font-weight: 500; text-align: center; opacity: 0.5;}

/* 버튼그룹 */
.lytError .comBtnGroup {margin: 40px 0;}
.lytError .comBtnGroup .btnArea {text-align: center; display: flex; align-items: center; justify-content: center;}

/* 버튼 */
.lytError .btn {display: inline-block; text-align: center; margin-right: 7px; vertical-align: middle;}
.lytError .btn:last-child {margin-right: 0;}

/* 버튼 - 칼라 */
.lytError .btn.blue {background: #0082cd; border: 1px solid #0082cd; color: #fff;}
.lytError .btn.navy {background: #191c38; border: 1px solid #191c38; color: #fff;}
.lytError .btn.navy:focus-visible {outline: 2px solid #00a2ff; outline-offset: -1px;}

/* 버튼 용도 */
.lytError .btn.step {width: 100%; max-width: 245px;height: 60px; border-radius: 4px; line-height: 59px; font-size: 18px; font-weight: 500; flex-basis: 50%; flex-grow: 1;}


@media screen and (min-width: 100px) and (max-width: 767px) {
    .lytError .errorArea {padding: 40px 20px 0;}
    .lytError .errorTop {margin-bottom: 30px; text-align: center;}
    .lytError .errorCont {padding-top: 120px; background-size: 100px;}
    .lytError .errorCont .mainTxt {font-size: 28px;}
    .lytError .errorCont .subTxt {margin-top: 40px; font-size: 16px;}   
    .lytError .errorBottom {margin-top: 45px; padding-top: 15px;}
    .lytError .errorBottom .copyright {font-size: 12px;}
    
    .lytError .comBtnGroup {margin: 20px 0;}
    .lytError .btn.step {max-width:none; border-radius: 5px; font-size: 17px;}
}


/* ----------------------------------------- Compnent Name ----------------------------------------- */
/* ----------------------------------------- Common Name ----------------------------------------- */


/* Component Type */
/* Common Type */
/* Form Name or Form Type */

/*
input {width:100%; height:30px; padding:8px; font-size:14px; color:#333; border:1px solid #dbdbdb;}
input.datepick {padding-left:45px; background:url(/common/images/icon/icon_calander.png) 15px center no-repeat;}
select {width:100%; height:30px; padding-left:25px; font-size:14px; color:#333; border:1px solid #dbdbdb; background:#fff url(/common/images/icon/icon_select.png) calc(100% - 20px) center no-repeat;}

.btn {color:#fff; text-align: center; border:1px solid #000;}
.btn.topSearch {width:160px; height:40px; margin-top:40px; font-size:17px; line-height:40px; border-radius:3px; border:0; background:#0357be;}
*/

/*datepicker customize 20230113*/
/*달력커버*/
.ui-datepicker {display:none; background:#ffffff; width:200px; padding:15px 10px; box-sizing:border-box; border:1px solid #bbb; border-radius:4px; margin-top:8px; margin-left:8px;}

/*달력상단*/
.ui-datepicker .ui-datepicker-header {display:flex; flex-flow:row nowrap; justify-content: space-between; align-items:center; gap:30px}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next {order:2;}
.ui-datepicker .ui-datepicker-title{font-size:14px; color:#000; font-weight:500; text-align:center;}
.ui-datepicker .ui-datepicker-prev {background:url('/common/images/common/dtp_prev.png')center center no-repeat; width:20px; height:20px; display:block;  cursor:pointer;}
.ui-datepicker .ui-datepicker-prev span {font-size:0;}
.ui-datepicker .ui-datepicker-next {background:url('/common/images/common/dtp_next.png')center center no-repeat; width:20px; height:20px; display:block;  cursor:pointer;}
.ui-datepicker .ui-datepicker-next span {font-size:0;}

/*달력본문*/
.ui-datepicker table {width: 100%; margin-top:20px;}
.ui-datepicker table thead th {font-size:12px; color:#000; font-weight:400; margin-right:9px; padding:0;}
.ui-datepicker table thead th:last-of-type {margin-right:0;}
.ui-datepicker table tbody tr td {height:0; line-height:1; font-size:12px; color:#757575; text-align:center; width:24px; height:24px; box-sizing:border-box; padding:5px 0;}
.ui-datepicker table tbody tr td a {display:flex; justify-content:center; align-items:center; width:24px; height:24px;}
.ui-datepicker table tbody tr td a:hover {display:flex; justify-content:center; align-items:center; width:24px; height:24px; background:#ececf1; border-radius:50%; color:#757575;}
.ui-datepicker table tbody tr td.ui-datepicker-unselectable {color:rgba(117,117,117,0.2);}
.ui-datepicker table tbody tr td.ui-datepicker-today a /*오늘*/ {color:#5a7eff;}
.ui-datepicker table tbody tr td.ui-datepicker-current-day a /*선택*/ {display:flex; justify-content:center; align-items:center; width:24px; height:24px; background:#5a7eff; border-radius:50%; color:#fff;}

/*마일리지 현황조회 타입 추가*/
.dataBox {padding:30px 0; box-sizing:border-box;}
.textBox.dl {color:#757575;}
.textBox.data {font-size:16px;}
.textBox.data span {font-weight:500;}
.textBox.desc {font-size:14px; color:#000; margin:11px 0; display:block; line-height:21px; height:auto;}

/*마일리지 테이블 별도 css*/
.cptGrid.mileageGrid .gridTb tbody td {border-right:1px solid rgba(132,132,132,0.2)}
.cptGrid.mileageGrid .gridTb tbody td.milescndGrid::after {display:none;}
.cptGrid.mileageGrid table tbody tr td.right input[type="text"] {text-align:right; padding-right:12px;}
.cptGrid.mileageGrid table thead tr th {border-right:1px solid rgba(132,132,132,0.2)}
.cptGrid.mileageGrid table tbody tr th:last-of-type {border-right:0; }
.cptGrid.mileageGrid table tbody tr td.mileFrstGrid {border-right:1px solid rgba(132,132,132,0.2)}
.cptGrid.mileageGrid table tbody tr:nth-of-type(6) td.mileFrstGrid {border-bottom:0;}
.cptGrid.mileageGrid table tbody tr td.milescndGrid {padding-left:20px; box-sizing:border-box;}
.cptGrid.mileageGrid table tbody tr td .frmGroup {justify-content:center;}
.cptGrid.mileageGrid.type02 table tbody tr td .frmGroup {justify-content:start;}

/*20230203 수신자 목록*/
.cptMsgList {width:100%; border:1px solid rgba(132,132,132,0.2); height:372px; overflow-y:scroll;}
.cptMsgList ul {width:100%;}
.cptMsgList ul li {position:relative; width:100%;}
.cptMsgList ul li a {display:block; width:100%; height:35px; line-height:35px; font-size:14px; color:#000; padding: 0 10px; box-sizing:border-box;}
.cptMsgList ul li a:hover {background:#f6f6f8}
.cptMsgList ul li a.selected {color:#5a7eff; background:url('/common/images/common/msgSelected.png')right 10px center no-repeat;}
.cptMsgList ul li a.selected:hover {background:#f6f6f8 url('/common/images/common/msgSelected.png')right 10px center no-repeat;}

/* ----------------------------------------- 댓글기능 관련 css  ----------------------------------------- */                            
.cptDataSelect {width:100%; margin-bottom:10px; position:relative; margin-top:10px;}
.cptDataSelect p.dataLog {font-size:14px; color:#000; font-weight:400; line-height:1; margin-bottom:10px; display:inline-block;} /*20230405 수정*/
.cptDataSelect p.dataLog span.dataCenter {font-size:12px;}
.cptDataSelect div.descBox {width:100%; max-height:500px; overflow-y:scroll; background:#f5f5f5; padding:20px; box-sizing:border-box; margin-top:5px; font-size:14px;} /*20230403 수정 폰트사이즈 추가*/
/* .cptDataSelect a.delComment {position:absolute; top:0; right:0; color:#ff4848; font-weight:500; font-size:14px;} */ /*20230405 주석*/
.cptDataSelect a.delComment {display:inline-block; line-height:1; margin-left:5px; vertical-align: middle;} /*20230405 추가*/

/*20230206 체력측정 참가신청서 및 참가동의서 신규 제작*/

/*202302026 참가신청서 별도 css*/
.appFrmTit {font-size:26px; color:#000; font-weight:bold; text-align:center; line-height:1; margin:10px 0 30px 0;}
.appFrmInfo {font-size:16px; color:#000; font-weight:500; line-height:1; text-align:center; margin:30px 0 60px 0;}
.cptSigMkArea {width:100%; position:relative; padding-bottom:20px; border-bottom:5px solid rgba(0,0,0,0.05); margin-bottom:10px;}
.cptSigMkArea .sigDt {font-size:16px; color:#000; font-weight:400; text-align:right;}
.cptSigMkArea .sigMk {margin-top:10px; display:flex; flex-flow:row nowrap; justify-content: end; gap:10px; align-items:center;}
.cptSigMkArea .sigMk .mnTxt {font-size:16px; color:#000; font-weight:400;}
.cptSigMkArea .sigMk .mxTxt {font-size:20px; color:#000; font-weight:400;}
.cptSigMkArea .sigMk .sigPsArea {width:120px; height:50px; position:relative;}
.cptSigMkArea .sigMk .sigPsArea .tempTxt { display:block; background:#ff4848; opacity:0.1; height:50px; font-size:16px; color:#000; text-align:center; padding-top:12px;}
.cptSigMkArea .sigMk .sigPsArea .sigObj {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); width:120px; text-align:center;}
.cptSigMkArea .sigMk .sigPsArea .sigObj img {display:inline-block; width:85%;}
.appFrmEnd {font-size:18px; color:#000; font-weight:500; line-height:1; text-align:center;}

/*202302026 참가동의서 별도 css*/
.appFrmDesc {width:100%;}
.appFrmDesc p:first-of-type {font-size:18px; color:#000; font-weight:500; margin-bottom:10px;}
.appFrmDesc p:nth-of-type(2) {font-size:12px; color:#000;}
.appFrmDesc p:last-of-type {font-size:12px; color:#757575;}
.appFrmAgmtDesc {width:100%; height:270px; overflow-y:auto; background:#f5f5f5; padding:20px; box-sizing:border-box;}
.appFrmAgmtDesc.ty02 {height:260px;}
.appFrmAgmtDesc.ty03 {height:165px;}
.appFrmAgmtDesc .desc {display:flex; flex-flow:row nowrap; justify-content: start; gap:10px;}
.appFrmAgmtDesc .desc > * {font-size:14px; color:#757575; font-weight:400; line-height:24px; word-break:keep-all; width:auto;}
.appFrmAgmtDesc .desc .impact01 {color:#000;}
.appFrmAgmtDesc .desc .impact02 {color:#ff4848}
.appFrmAgmtDesc .desc span.expl {font-size:12px; color:#ff4848;}
.appFrmAgmtDesc .desc ul {padding-left:5px;}
.appFrmAgmtDesc .desc ul li {display:flex; flex-flow:row nowrap; justify-content: start; gap:10px; color:#000 !important;}
.appFrmAgmtDesc .info {font-size:14px; color:#000; margin-top:20px; word-break:keep-all;}
.appFrmAgmt {margin-top:5px;}
.appFrmAgmt .alignR {display:flex; flex-flow:row nowrap; justify-content:end; align-items:center;}
.appFrmAgmt .alignR p {font-size:14px; color:#000; font-weight:500; margin-right:10px;}
.appFrmEnd.ty02 {font-size:14px; color:#5a7eff; font-weight:400; line-height:27px; text-align:left;}

/*20230206 로딩바 추가*/
.modLoading {width: 100%; height: 100vh; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 99999;}
.modLoading .dim {width: 100%; height: 100vh; background: rgba(0,0,0,0.6); font-size: 0;}
.modLoading .loadingArea {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.modLoading .loadingGroup {text-align: center; transform: translateY(-40px);}
.modLoading .loadingGroup::after {display: block; content: ""; clear: both;}
.modLoading .loadingGroup .unit {width: 30px; height: 30px; margin-right: 15px; border-radius: 50%; font-size: 0; background-color: #bebebe; transform: translateY(0); display: inline-block; animation: loadingAni 3.5s infinite cubic-bezier(.62, .28, .23, .99);}
.modLoading .loadingGroup .unit:nth-child(2) {animation-delay: 0.15s;}
.modLoading .loadingGroup .unit:nth-child(3) {animation-delay: 0.3s;}
.modLoading .loadingGroup .unit:last-child {margin-right: 0;}
.modLoading .loadingTxt {text-align: center; font-size: 18px; color: #fff;}
.modLoading .loadingTxt .bold {margin-top: 70px; font-size: 29px; font-weight: 500; margin-bottom: 5px; display: block;}

@keyframes loadingAni {
    0% {background-color: #2a2d3e;transform: translateY(0);}
    17% {background-color: #2a2d3e;transform: translateY(80px);}
    33% {background-color: #5a7eff;transform: translateY(0);}
    50% {background-color: #5a7eff;transform: translateY(80px);}
    67% {background-color: #aae3ff;transform: translateY(0);}
    83% {background-color: #aae3ff;transform: translateY(80px);}
    100% {background-color: #2a2d3e;transform: translateY(0);}
}
/*=======================================================================대시보드 css=======================================================================*/
/*=======================================================================대시보드 css=======================================================================*/
/*=======================================================================대시보드 css=======================================================================*/
/*대시보드 화면에서는 좌측 메뉴 영역이 없어져야함*/
.lytLayout .layoutContainer .layoutNav {display:none;}

/*대시보드 css*/
.lytDashBoard {width:100%; min-width:1600px;}

/*정보영역*/
.infoStaticCov {width:100%; padding: 30px 40px; box-sizing:border-box; background:#1a1d2d; }
.infoArea {width:100%;}
.infoArea .pInfo {width:100%; display:flex; flex-flow:row nowrap; justify-content: start; align-items: baseline; padding-bottom:20px; box-sizing:border-box; border-bottom:1px solid rgba(255,255,255,0.1); position:relative;}
.infoArea .pInfo p:first-of-type {font-size:26px; color:#fff; font-weight:300; }
.infoArea .pInfo p:first-of-type span {font-size:32px;}
.infoArea .pInfo p:nth-of-type(2) {font-size:16px; color:#fff; font-weight:300;  margin:0 20px; position:relative; padding-left:30px;}
.infoArea .pInfo p:nth-of-type(2)::before {content:""; background:url('/common/images/common/icon_group.png')center left no-repeat; position:absolute; top:0; left:0; width:24px; height:24px;}
.infoArea .pInfo p:nth-of-type(2) span {font-weight:500; letter-spacing: 0.5px;}
.infoArea .pInfo p:last-of-type {font-size:16px; color:#fff; font-weight:300;  position:relative; padding-left:30px;}
.infoArea .pInfo p:last-of-type::before {content:""; background:url('/common/images/common/icon_logindate.png')center left no-repeat; position:absolute; top:0; left:0; width:24px; height:24px;}
.infoArea .pInfo p:last-of-type span {font-weight:500;  letter-spacing: 0.5px;}
.infoArea .pInfo div.accOpt {position:absolute; top:4px; right:0;}
.infoArea .pInfo div.accOpt a {display:inline-block; vertical-align:top; width:40px; height:40px; margin-right:5px; font-size:0;}
.infoArea .pInfo div.accOpt a.setting {background:url('/common/images/common/icon_setting.png')center center no-repeat;}
.infoArea .pInfo div.accOpt a.logout {background:url('/common/images/common/icon_logout.png')center center no-repeat;}
.infoArea .pInfo div.accOpt a:last-of-type{margin-right:0;}
/*업무현황 영역*/
.taskCov {width:100%; margin-top:20px;}
.taskCov > p.staticTit {font-size:20px; color:#fff; font-weight:500; line-height:1; margin-bottom:15px;} 
.staticArea {width:100%; display:flex; flex-flow:row nowrap; justify-content: flex-start; align-items: center;}
.staticArea > div {background:#fff; border:1px solid #fff; border-radius:10px; box-sizing:border-box; padding:15px 0; margin-right:20px; box-shadow:5px 10px 25px 0 rgba(0,0,0,0.5);}
.staticArea > div.grp01 {width:24.2%;}
.staticArea > div.grp02 {width:16.1%;}
.staticArea > div.grp03 {width:24.2%;}
.staticArea > div.grp04 {width:32.3%;}
.staticArea > div:last-of-type {margin-right:0;}
.staticArea > div > ul { display:flex; flex-flow:row nowrap; justify-content: flex-start; align-items: center;}
.staticArea > div > ul li {width:100%; border-right:1px solid rgba(132, 132, 132, 0.2);}
.staticArea > div > ul li:last-of-type {border-right:0;}
.staticArea > div > ul li p.minTit {font-size:12px; color:#333; text-align:center; line-height:21px; letter-spacing:-0.24px; font-weight:500;}
.staticArea > div > ul li p.bigTit {font-size:16px; color:#5a7eff; text-align:center; line-height:21px; letter-spacing:-0.32px; font-weight:500;}
.staticArea > div > ul li a {font-size:30px; color:#000; font-weight:500; text-align:center; display:block;}

/*센터담당자 css*/
.taskCov {width:100%; margin-top:20px;}
.taskCov > p.staticTit {font-size:20px; color:#fff; font-weight:500; line-height:1; margin-bottom:15px;} 
.staticArea.cntUserCov {width:100%; display:flex; flex-flow:row nowrap; justify-content: flex-start; align-items: center;}
.staticArea.cntUserCov > div {background:#fff; border:1px solid #fff; border-radius:10px; box-sizing:border-box; padding:15px 0; margin-right:20px; box-shadow:5px 10px 25px 0 rgba(0,0,0,0.5);}
.staticArea.cntUserCov > div.grp01 {width:22.08%;}
.staticArea.cntUserCov > div.grp02 {width:22.08%;}
.staticArea.cntUserCov > div.grp03 {width:32.61%;}
.staticArea.cntUserCov > div.grp04 {width:22.08%;}
.staticArea.cntUserCov > div:last-of-type {margin-right:0;}
.staticArea.cntUserCov > div > ul { display:flex; flex-flow:row nowrap; justify-content: flex-start; align-items: center;}
.staticArea.cntUserCov > div > ul li {width:100%; border-right:1px solid rgba(132, 132, 132, 0.2);}
.staticArea.cntUserCov > div > ul li:last-of-type {border-right:0;}
.staticArea.cntUserCov > div > ul li p.minTit {font-size:12ㅇpx; color:#333; text-align:center; line-height:21px; letter-spacing:-0.24px; font-weight:500;}
.staticArea.cntUserCov > div > ul li p.bigTit {font-size:16px; color:#5a7eff; text-align:center; line-height:21px; letter-spacing:-0.32px; font-weight:500;}
.staticArea.cntUserCov > div > ul li a {font-size:30px; color:#000; font-weight:500; text-align:center; display:block;}

/*대시보드컨텐츠 영역*/
.contArea {width:100%; padding: 40px; box-sizing:border-box; background:#f5f6fa; }

/*게시판 영역*/
.contCov {width:100%; position:relative; display:flex; flex-flow: row nowrap; justify-content: flex-start;}
.contCov .leftCont {width:65.21%; margin-right:30px;}
.contCov .leftCont .boardBox {background:#fff; padding:30px; box-sizing:border-box; border:1px solid #fff; border-radius:20px; display:flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; margin-bottom:30px; box-shadow:0 5px 30px 0 rgba(0,0,0,0.07);}
.contCov .leftCont .boardBox > div {width:50%; padding-right:30px; border-right:1px solid rgba(132, 132, 132, 0.2); }
.contCov .leftCont .boardBox > div:last-of-type {border-right:0; padding-left:30px; padding-right:0;}
.contCov .leftCont .boardBox > div .bTit {width:100%; position:relative; padding-bottom:10px; border-bottom:1px solid #000;}
.contCov .leftCont .boardBox > div .bTit p {font-size:20px; color:#000; font-weight:500; letter-spacing: -0.4px; line-height:1;}
.contCov .leftCont .boardBox > div .bTit a {position:absolute; top:0; right:0; font-size:14px; color:#000; font-weight:500; letter-spacing: -0.28px; background:url('/common/images/common/moreBtn.png')right center no-repeat; padding-right:15px; box-sizing:border-box;}
.contCov .leftCont .boardBox > div .bList {width:100%;}
.contCov .leftCont .boardBox > div .bList ul li {width:100%; position:relative; display:flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; border-bottom:1px solid rgba(132, 132, 132, 0.2);}
.contCov .leftCont .boardBox > div .bList ul li div {width:calc(100% - 90px); display:flex; flex-flow: row nowrap; justify-content: start; align-items: center;}
.contCov .leftCont .boardBox > div .bList ul li div a.bListTit {display:inline-block; font-size:16px; color:#000; font-weight:400; letter-spacing: -0.32px; line-height:50px; width:auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.contCov .leftCont .boardBox > div .bList ul li div span {display:inline-block; vertical-align:middle; line-height:1; margin-left:5px;}
.contCov .leftCont .boardBox > div .bList ul li p.bListDt {font-size:16px; color:#757575; line-height:50px; letter-spacing: -0.32px;}

/*퀵메뉴 영역*/
.contCov .leftCont .quickBox {background:#fff; padding:30px 55px; box-sizing:border-box; border:1px solid #fff; border-radius:20px; box-shadow:0 5px 30px 0 rgba(0,0,0,0.07);}
.contCov .leftCont .quickBox ul {display:flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center;}
.contCov .leftCont .quickBox ul li {width:100%; padding:0 15px; box-sizing:border-box; border-right:1px solid rgba(132, 132, 132, 0.2); text-align: center;}
.contCov .leftCont .quickBox ul li:last-of-type {border-right:0;}
.contCov .leftCont .quickBox ul li a {display:block; width:100%; height:100%; background:#fff; border-radius:20px; box-sizing:border-box; transition:all 0.4s; padding:15px; font-size:15px; line-height:20px; letter-spacing: -0.3px;}
.contCov .leftCont .quickBox ul li a span.iconBx {display:inline-block; width:50px; height:50px;}
.contCov .leftCont .quickBox ul li a:hover {background:#5a7eff; color:#fff;}

/*시스템관리자, 홈페이지 관리자 퀵 메뉴*/
/*off*/
.contCov .leftCont .quickBox ul li a.qk01 span.iconBx {background:url('/common/images/common/icon_qk01_off.png')center center no-repeat; }
.contCov .leftCont .quickBox ul li a.qk02 span.iconBx {background:url('/common/images/common/icon_qk02_off.png')center center no-repeat; }
.contCov .leftCont .quickBox ul li a.qk03 span.iconBx {background:url('/common/images/common/icon_qk03_off.png')center center no-repeat; }
.contCov .leftCont .quickBox ul li a.qk04 span.iconBx {background:url('/common/images/common/icon_qk04_off.png')center center no-repeat; }
.contCov .leftCont .quickBox ul li a.qk05 span.iconBx {background:url('/common/images/common/icon_qk05_off.png')center center no-repeat; }
.contCov .leftCont .quickBox ul li a.qk06 span.iconBx {background:url('/common/images/common/icon_qk06_off.png')center center no-repeat; }
/*on*/
.contCov .leftCont .quickBox ul li a.qk01:hover span.iconBx {background:url('/common/images/common/icon_qk01_on.png')center center no-repeat;}
.contCov .leftCont .quickBox ul li a.qk02:hover span.iconBx {background:url('/common/images/common/icon_qk02_on.png')center center no-repeat;}
.contCov .leftCont .quickBox ul li a.qk03:hover span.iconBx {background:url('/common/images/common/icon_qk03_on.png')center center no-repeat;}
.contCov .leftCont .quickBox ul li a.qk04:hover span.iconBx {background:url('/common/images/common/icon_qk04_on.png')center center no-repeat;}
.contCov .leftCont .quickBox ul li a.qk05:hover span.iconBx {background:url('/common/images/common/icon_qk05_on.png')center center no-repeat;}
.contCov .leftCont .quickBox ul li a.qk06:hover span.iconBx {background:url('/common/images/common/icon_qk06_on.png')center center no-repeat;}

/*거점관리자 퀵 메뉴*/
/*off*/
.contCov .leftCont .quickBox.type02 ul li a.qk01 span.iconBx {background:url('/common/images/common/icon_qk01-1_off.png')center center no-repeat; }
.contCov .leftCont .quickBox.type02 ul li a.qk02 span.iconBx {background:url('/common/images/common/icon_qk02-1_off.png')center center no-repeat; }
.contCov .leftCont .quickBox.type02 ul li a.qk03 span.iconBx {background:url('/common/images/common/icon_qk03-1_off.png')center center no-repeat; }
.contCov .leftCont .quickBox.type02 ul li a.qk04 span.iconBx {background:url('/common/images/common/icon_qk04-1_off.png')center center no-repeat; }
.contCov .leftCont .quickBox.type02 ul li a.qk05 span.iconBx {background:url('/common/images/common/icon_qk05-1_off.png')center center no-repeat; }
.contCov .leftCont .quickBox.type02 ul li a.qk06 span.iconBx {background:url('/common/images/common/icon_qk06-1_off.png')center center no-repeat; }
/*on*/
.contCov .leftCont .quickBox.type02 ul li a.qk01:hover span.iconBx {background:url('/common/images/common/icon_qk01-1_on.png')center center no-repeat;}
.contCov .leftCont .quickBox.type02 ul li a.qk02:hover span.iconBx {background:url('/common/images/common/icon_qk02-1_on.png')center center no-repeat;}
.contCov .leftCont .quickBox.type02 ul li a.qk03:hover span.iconBx {background:url('/common/images/common/icon_qk03-1_on.png')center center no-repeat;}
.contCov .leftCont .quickBox.type02 ul li a.qk04:hover span.iconBx {background:url('/common/images/common/icon_qk04-1_on.png')center center no-repeat;}
.contCov .leftCont .quickBox.type02 ul li a.qk05:hover span.iconBx {background:url('/common/images/common/icon_qk05-1_on.png')center center no-repeat;}
.contCov .leftCont .quickBox.type02 ul li a.qk06:hover span.iconBx {background:url('/common/images/common/icon_qk06-1_on.png')center center no-repeat;}

/*그래프 영역 가로 그래프*/
.contCov .rightCont {width:37.5%;}
.contCov .rightCont .staticGrph01 { background:#fff; border-radius:20px; padding:30px; box-sizing:border-box; box-shadow:0 5px 30px 0 rgba(0,0,0,0.07);}
.contCov .rightCont .staticGrph01 p.stgrphTit {font-size:20px; color:#000; font-weight:500; letter-spacing: -0.4px; line-height:1; margin-bottom:25px;}
.contCov .rightCont .staticGrph01 .hGrph {width:100%;}
.contCov .rightCont .staticGrph01 .hGrph ul li {display:flex; flex-flow:row nowrap; justify-content: start; align-items: center; height:24px; margin-bottom:17px;}
.contCov .rightCont .staticGrph01 .hGrph ul li:last-of-type {margin-bottom:0;}
.contCov .rightCont .staticGrph01 .hGrph ul li p.grphCat {width:94px; font-size:16px; color:#000; letter-spacing: -0.32px; line-height:1; font-weight:500; transition:all 0.4s}
.contCov .rightCont .staticGrph01 .hGrph ul li p.grphCat em {font-size:12px;}
.contCov .rightCont .staticGrph01 .hGrph ul li .grphCov {width:calc(100% - 174px); position:relative; height:10px; margin-right:10px;}
.contCov .rightCont .staticGrph01 .hGrph ul li .grphCov .grphBar {position:absolute; top:50%; left:0; border-radius:5px; box-sizing:border-box; height:100%; transition:all 0.3s; transform:translate(0,-50%); -webkit-transform:translate(0,-50%); -ms-transform:translate(0,-50%); -moz-transform:translate(0,-50%); -o-transform:translate(0,-50%);} /*10,000건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph01 .hGrph ul li.grphList01 .grphCov .grphBar {animation-name: hBar01; animation-duration:0.6s; width:69.5%; background:#5a7eff;} /*10,000건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph01 .hGrph ul li.grphList02 .grphCov .grphBar {animation-name: hBar02; animation-duration:0.9s; width:30%; background:#2a2d3e;} /*10,000건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph01 .hGrph ul li.grphList03 .grphCov .grphBar {animation-name: hBar03; animation-duration:1.2s; width:46.87%; background:#69bdfd;} /*10,000건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph01 .hGrph ul li p.grphCntCov {width:80px; font-size:15px;color:#000; letter-spacing: -0.32px; line-height:1;transition:all 0.4s;}
.contCov .rightCont .staticGrph01 .hGrph ul li p.grphCntCov span {font-size:20px; font-weight:500; transition:all 0.4s;}

@keyframes hBar01 {from{width:0;}}
@keyframes hBar02 {from{width:0;}}
@keyframes hBar03 {from{width:0;}}

/*그래프 영역 세로 그래프*/
.contCov .rightCont .staticGrph02 { background:#fff; border-radius:20px; padding:30px; box-sizing:border-box; margin-top:30px; min-height:324px; box-shadow:0 5px 30px 0 rgba(0,0,0,0.07);}
.contCov .rightCont .staticGrph02 p.stgrphTit {font-size:20px; color:#000; font-weight:500; letter-spacing: -0.4px; line-height:1; margin-bottom:25px;}
.contCov .rightCont .staticGrph02 .vGrphCov {width:100%; position:relative; height:219px;}
.contCov .rightCont .staticGrph02 .vGrph {width:100%; position:absolute; bottom:0; left:0;}
.contCov .rightCont .staticGrph02 .vGrph ul {display:flex; flex-flow:row nowrap; justify-content: start; align-items:end; }
.contCov .rightCont .staticGrph02 .vGrph ul li {width:calc(100% / 4); text-align:center;}
.contCov .rightCont .staticGrph02 .vGrph ul li:last-of-type {margin-bottom:0;}
.contCov .rightCont .staticGrph02 .vGrph ul li p.grphCat {font-size:16px; color:#000; letter-spacing: -0.32px; line-height:1; font-weight:500;}
.contCov .rightCont .staticGrph02 .vGrph ul li .grphCov { position:relative; width:15px;  margin:10px auto;}
.contCov .rightCont .staticGrph02 .vGrph ul li .grphCov .grphBar {border-radius:8px; box-sizing:border-box; width:100%;} /*최대 높이 170px 이며, 300건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph02 .vGrph ul li.grphList01 .grphCov .grphBar {animation-name: vBar01; animation-duration:1s; height:141px; background:#5a7eff;} /*최대 높이 170px 이며, 300건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph02 .vGrph ul li.grphList02 .grphCov .grphBar {animation-name: vBar02; animation-duration:1.3s; height:113px; background:#2a2d3e;} /*최대 높이 170px 이며, 300건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph02 .vGrph ul li.grphList03 .grphCov .grphBar {animation-name: vBar03; animation-duration:1.6s; height:170px; background:#69bdfd;} /*최대 높이 170px 이며, 300건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph02 .vGrph ul li.grphList04 .grphCov .grphBar {animation-name: vBar04; animation-duration:1.9s; height:56.66px; background:#6969fd;} /*최대 높이 170px 이며, 300건이 100%임을 기준으로 함*/
.contCov .rightCont .staticGrph02 .vGrph ul li p.grphCntCov {font-size:15px;color:#000; letter-spacing: -0.32px; line-height:1;}
.contCov .rightCont .staticGrph02 .vGrph ul li p.grphCntCov span {font-size:20px; font-weight:500;}

@keyframes vBar01 {from{height:0;}}
@keyframes vBar02 {from{height:0;}}
@keyframes vBar03 {from{height:0;}}
@keyframes vBar04 {from{height:0;}}

.weeklyCal {width:100%; background:#fff; padding: 30px; box-sizing:border-box; border-radius:20px;}
.weeklyCal .calTit {width:100%; position:relative; display:flex; flex-flow:row nowrap; justify-content:space-between; align-items: center;}
.weeklyCal .calTit .lftCov {display: flex; flex-flow:row nowrap; justify-content: start; align-items: baseline;}
.weeklyCal .calTit p {font-size:20px; color:#000; font-weight:500; line-height:1; letter-spacing:-0.4px;}
.weeklyCal .calTit span {display:inline-block; margin-left:10px; font-size:16px; color:#000; font-weight:500; letter-spacing:-0.32px; line-height:1;}
.weeklyCal .calTit a {font-size:14px; color:#000; font-weight:500; letter-spacing: -0.28px; background:url('/common/images/common/moreBtn.png')right center no-repeat; padding-right:15px; box-sizing:border-box;}

.wkCalList {width:100%; margin-top:15px;}
.wkCalList ul {display:flex; flex-flow:row nowrap; justify-content: start; align-items:top; gap:5px;}
.wkCalList ul li {width:13.90%; text-align:center; position:relative; padding:20px; box-sizing:border-box; border:1px solid #e1e5ef; border-radius:20px;}
.wkCalList ul li > p.wkDt {font-size:13px; letter-spacing: -0.26px; line-height:1; margin-bottom:10px;}
.wkCalList ul li > p.wkNdt {font-size:20px; letter-spacing: -.0.4px; line-height:1; margin-bottom:7px;}
.wkCalList ul li > div.wkPlc {border-top:1px solid rgba(132, 132, 132, 0.2); padding-top:7px; box-sizing:border-box;}
.wkCalList ul li > div.wkPlc .glbTooltip {margin:0;}
.wkCalList ul li > div.wkPlc .glbTooltip .place {font-size:16px; font-weight:500; position:relative;}
.wkCalList ul li > div.wkPlc .glbTooltip .place.toolOn {color:#5a7eff; cursor:default;}
.wkCalList ul li > div.wkPlc .glbTooltip .place.toolOn span.placeDot {position:absolute; top:3px; right:-5px; width:4px; height:4px; background:#5a7eff; border-radius:50%;}
.wkCalList ul li > div.wkPlc .glbTooltip .place.dOff {color:#ff4848;}
.wkCalList ul li.today {background:#2a2d3e; color:#fff;}
.wkCalList ul li > div.wkPlc .glbTooltip .tooltipCont {text-align:left !important; color:#000 !important;}
.wkCalList ul li > div.wkPlc .glbTooltip .tooltipCont span {font-size:14px;}

.resvStat {width:100%; padding:30px; background:#fff; box-sizing:border-box; border-radius:20px; box-sizing:border-box;}
.resvStat .resvTitCov {width:100%; position:relative; display:flex; flex-flow: row nowrap; justify-content: space-between; align-items: center;}
.resvStat .resvTitCov .lftCov {display:flex; flex-flow:row nowrap; justify-content: start; align-items: baseline;}
.resvStat .resvTitCov p {font-size:20px; color:#000; font-weight:500; letter-spacing: -0.4px; line-height:1;}
.resvStat .resvTitCov span {font-size:16px; color:#000; font-weight:500; letter-spacing: -0.32px; line-height:1; margin-left:10px;}
.resvStat .resvTitCov a {font-size:14px; color:#000; font-weight:500; letter-spacing: -0.28px; background:url('/common/images/common/moreBtn.png')right center no-repeat; padding-right:15px; box-sizing:border-box;}

.resvStat .statCov {width:100%; margin-top:12px; margin-bottom:10px;}
.resvStat .statCov ul {width:100%; display: flex; flex-flow: row nowrap; justify-content: start; align-items: center; gap:27px;}
.resvStat .statCov ul li {width:15.98%;}
.resvStat .statCov ul li span {display:block; width:100%; font-size:14px; color:#fff; font-weight:400; text-align:center; line-height:28px; letter-spacing: -0.28px; background:#2a2d3e; border-radius:25px; box-sizing:border-box; margin-bottom:8px;}
.resvStat .statCov ul li p {font-size:22px; color:#000 ;letter-spacing: -0.44px; line-height:1; text-align:center; font-weight:500;}
.resvStat .tdayWork {width:100%; background:#f5f5f5; padding:13px 15px; box-sizing:border-box;}
.resvStat .tdayWork > p {font-size:14px; color:#000; font-weight:400; line-height:30px; letter-spacing: -0.28px;}
.resvStat .tdayWork > p span {font-weight:500;}
.resvStat .tdayWork > p span:first-of-type {margin-left:10px;}
    
.rytQk {background:#fff; padding:30px; box-sizing:border-box; border:1px solid #fff; border-radius:20px; box-shadow:0 5px 30px 0 rgba(0,0,0,0.07); margin-top:30px;}
.rytQk ul {width:100%; overflow:hidden;}
.rytQk ul li {float:left; width:33.3333%; padding:0 15px; box-sizing:border-box; text-align: center; margin-bottom:10px;}
.rytQk ul li:nth-child(n+4):nth-child(-n+6) {margin-bottom:0;}
.rytQk ul li a {display:block; width:100%; height:100%; background:#fff; border-radius:20px; box-sizing:border-box; transition:all 0.4s; padding:15px; font-size:15px; line-height:20px; letter-spacing: -0.3px;}
.rytQk ul li a span.iconBx {display:inline-block; width:50px; height:50px;}
.rytQk ul li a:hover {background:#5a7eff; color:#fff;}

/*센터담당자 퀵 메뉴*/
/*off*/
.rytQk ul li a.ryQk01 span.iconBx {background:url('/common/images/common/icon_qk01-2_off.png')center center no-repeat; }
.rytQk ul li a.ryQk02 span.iconBx {background:url('/common/images/common/icon_qk02-2_off.png')center center no-repeat; }
.rytQk ul li a.ryQk03 span.iconBx {background:url('/common/images/common/icon_qk03-2_off.png')center center no-repeat; }
.rytQk ul li a.ryQk04 span.iconBx {background:url('/common/images/common/icon_qk04-2_off.png')center center no-repeat; }
.rytQk ul li a.ryQk05 span.iconBx {background:url('/common/images/common/icon_qk05-2_off.png')center center no-repeat; }
.rytQk ul li a.ryQk06 span.iconBx {background:url('/common/images/common/icon_qk06-2_off.png')center center no-repeat; }
/*on*/
.rytQk ul li a.ryQk01:hover span.iconBx {background:url('/common/images/common/icon_qk01-2_on.png')center center no-repeat;}
.rytQk ul li a.ryQk02:hover span.iconBx {background:url('/common/images/common/icon_qk02-2_on.png')center center no-repeat;}
.rytQk ul li a.ryQk03:hover span.iconBx {background:url('/common/images/common/icon_qk03-2_on.png')center center no-repeat;}
.rytQk ul li a.ryQk04:hover span.iconBx {background:url('/common/images/common/icon_qk04-2_on.png')center center no-repeat;}
.rytQk ul li a.ryQk05:hover span.iconBx {background:url('/common/images/common/icon_qk05-2_on.png')center center no-repeat;}
.rytQk ul li a.ryQk06:hover span.iconBx {background:url('/common/images/common/icon_qk06-2_on.png')center center no-repeat;}

/*홈페이지 관리 팝업관리 미리보기 관련 css*/
/* 메인페이지 공지팝업 */
.modMainPopup {max-width: 80vw;position: absolute; z-index: 998; display: none; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%);}
.modMainPopup .popArea { max-height: 80vh; overflow-y: auto; line-height: 1;}
.modMainPopup .popArea::-webkit-scrollbar {width: 5px;}
.modMainPopup .popArea::-webkit-scrollbar-thumb { background: #2785e5;}
.modMainPopup .popArea::-webkit-scrollbar-track {background: #eee;}
.modMainPopup .popArea img {max-width: 100%;}
.modMainPopup .popArea .txtArea {padding: 20px; background: url(/common/images/common/popup_basic_bg.jpg) center no-repeat;}
.modMainPopup .popArea .txtArea .txtBallon {width: 360px; height: 360px; padding: 40px 20px; border-radius: 30px 30px 0 30px; background: #fff; overflow-y: auto;}
.modMainPopup .popArea .txtArea .txtBallon::-webkit-scrollbar {width: 5px;}
.modMainPopup .popArea .txtArea .txtBallon::-webkit-scrollbar-thumb { background: #274483;}
.modMainPopup .popArea .txtArea .txtBallon::-webkit-scrollbar-track {background: #eee;}
.modMainPopup .popArea .txtArea .txtBallon .tit {width: 100%; margin-bottom: 25px; font-size: 24px; color: #000; font-weight: 700;text-align: center; line-height: 1.4; display: block;}
.modMainPopup .popArea .txtArea .txtBallon .cont {font-size: 16px; line-height: 1.875;}

.modMainPopup .popBtnArea {width: 100%; height: 36px; margin-top: -1px; padding: 0 20px; background: #222; display: flex; align-items: center;}
.modMainPopup .popBtnArea input[type=checkbox] + label {padding-left: 20px; font-size: 14px; color: #b0b0b0; background-size: 14px;}
.modMainPopup .popBtnArea .txtBtn {margin-left: auto; font-size: 14px; color: #fff; background:transparent; border:none;}
.modMainPopup .txtPopBtn {display:block; width:110px; font-size:14px; font-weight:500; text-align:center; line-height:35px; border:1px solid #2785e5; background:#2785e5; color:#fff; border-radius:15px; box-sizing:border-box; margin:20px auto 0;}

.modMainPopup.on {display: block;}

@media screen and (min-width: 100px) and (max-width: 1199px) {
    .modMainPopup {max-width: 93.75%; width: max-content !important; height: auto !important; top: 100px !important; left: 50% !important; transform: translateX(-50%);}
    .modMainPopup .popArea .txtArea .txtBallon {max-width: 360px; max-height: 360px; width: 100%;}
    .modMainPopup .popArea .txtArea .txtBallon .tit {font-size: 18px;}
    .modMainPopup .popArea .txtArea .txtBallon .cont {font-size: 14px;}
}