@charset "UTF-8";
.ir { overflow: hidden; position: absolute; width: 0; height: 0; line-height: 0; text-indent: -999rem; }

.unitIcon > img { opacity: 0; }

.unitIcon > span { overflow: hidden; position: absolute; width: 0; height: 0; line-height: 0; text-indent: -999rem; }

.skipMenu { position: fixed; top: -6rem; left: 0; width: 100%; height: 6rem; z-index: 99; }

.skipMenu a { position: absolute; top: 0; left: 0; width: 100%; padding: 1rem; display: block; background-color: #0060af !important; color: #fff; text-align: center; }

.skipMenu a:focus { top: 6rem; }

.ell { overflow: hidden; display: inline-block; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; }

.ellMulti { display: -webkit-box; word-break: keep-all; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; line-height: 1.4; max-height: 5rem; }

.trans { transition: all 0.2s ease 0.05s; }

.vMid { position: absolute; top: 50%; transform: translateY(-50%); }

.clearfix:after { content: ''; display: block; clear: both; }

.hidden { overflow: hidden; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; clip: rect(0, 0, 0, 0); border: 0; color: transparent; }

.flexArea { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; }

.flexArea.fix { width: 100%; }

.fontRoboto { font-family: "Roboto"; }

.fontPoppins { font-family: "Poppins"; }

.formText { position: relative; }

.formText label { font-size: 2rem; font-weight: 500; color: #1a1a1a; display: block; margin-bottom: 1.5rem; }

.formText .inpZone { position: relative; }

.formText .inpZone.typeFlex { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 2.4rem; }

.formText .inpZone.typeFlex * { -ms-flex: 1; flex: 1; position: relative; }

.formText .inpZone.typeFlex .innerBtn { max-width: 8rem; -ms-flex: auto; flex: auto; background-color: #1a1a1a; height: 5.3rem; border-radius: 1.6rem; color: #fff; }

.formText .inpZone input { height: 3rem; background-color: #fff; border: 1px solid #ccc; padding: 0 1rem 0 1rem; width: 100%; font-size: 1.3rem; border-radius: .3rem; }

.formText .inpZone input:-ms-input-placeholder { color: #888; }

.formText .inpZone input::placeholder { color: #888; }

.formText .inpZone input:focus + .btn-clear { opacity: 1; }

.formText .inpZone input:disabled { color: #ccc; background-color: #f1f1f1; }

.formText .inpZone input[type=number]::-webkit-outer-spin-button, .formText .inpZone input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.formText .inpZone textarea { padding: 1rem 1rem; background-color: #fff; border: 1px solid #ccc; width: 100%; border-radius: .3rem; }

.formText .inpZone textarea:-ms-input-placeholder { color: #888; }

.formText .inpZone textarea::placeholder { color: #888; }

.formText .inpZone .btn-clear { position: absolute; position: absolute; top: 50%; transform: translateY(-50%); right: .5rem; opacity: 0; padding: 1rem; }

.formText .inpZone .btn-clear:focus { opacity: 1; }

.formText .inpZone .btn-passView { position: absolute; position: absolute; top: 50%; transform: translateY(-50%); right: .5rem; padding: 1rem; }

.formText .inpZone .btn-passView.isHidden { opacity: .5; width: 1px; height: 1px; overflow: hidden; right: -1rem; padding: 0; }

.formText .inpZone .btn-passViewDis { position: absolute; position: absolute; top: 50%; transform: translateY(-50%); right: .5rem; padding: 1rem; }

.formText .inpZone .btn-passViewDis.isHidden { opacity: .5; width: 1px; height: 1px; overflow: hidden; right: -1rem; padding: 0; }

.formText .inpZone .ui-datepicker-trigger { position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 100%; height: 100%; padding: 1rem; -ms-flex-pack: end; justify-content: flex-end; }

.formText.fix { width: 100%; max-width: 100% !important; }

.formText .validation { display: none; margin-top: .5rem; font-size: 1.4rem; }

.formText[data-status=error] .validation { display: block; color: #ee495d; }

.formText[data-status=success] .validation { display: block; color: #0060af; }

.formText + .formText { margin-top: 4rem; }

.formCheckbox { display: block; position: relative; }

.formCheckbox + .formCheckbox { margin-top: 1rem; }

.formCheckbox input { overflow: hidden; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; clip: rect(0, 0, 0, 0); border: 0; color: transparent; }

.formCheckbox label { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; color: #1a1a1a; padding-left: 3.5rem; cursor: pointer; }

.formCheckbox label:before { content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 2.4rem; height: 2.4rem; border-radius: .4rem; border: 1px solid #ccc; background: #fff; transition: all 0.2s ease 0.05s; background-position: center center; background-size: 1.6rem 1.6rem; }

.formCheckbox label:hover:before { border-color: #4c84ca; }

.formCheckbox input:checked + label:before { border-color: #4c84ca; background: #4c84ca url(../img/common/chk.png) center center no-repeat; background-size: 1.6rem 1.6rem; }

.formCheckbox input:disabled + label:before { background-color: #f3f6fb; border-color: #f3f6fb; }

.formCheckbox input:checked:disabled + label:before { background: #f3f6fb url(../img/common/chk_checked_dis.png) center center no-repeat; background-size: 1.6rem 1.6rem; }

.formCheckbox input:disabled + label { opacity: 1; }

.formCheckbox input:focus + label:before { outline: 2px solid #a0d2f1; }

.formCheckbox.switch label { padding: 0; }

.formCheckbox.switch label em:before { content: '아니오'; position: absolute; top: 50%; transform: translateY(-50%); color: #666; right: 1.2rem; transition: all 0.2s ease 0.05s; font-size: 1.6rem; }

.formCheckbox.switch label:before { content: ''; left: auto; right: 0; background-image: none; background-color: #f1f1f1; border-color: #f1f1f1; width: 9rem; height: 3rem; border-radius: 5rem; transition: all 0.2s ease 0.05s; }

.formCheckbox.switch label:after { content: ''; width: 2rem; height: 2rem; border-radius: 50%; background-color: #fff; border: 1px solid transparent; position: absolute; top: 0rem; right: 6.2rem; box-shadow: 0 0 1rem rgba(0, 0, 0, 0.1); transition: all 0.2s ease 0.05s; }

.formCheckbox.switch label:hover:before { border-color: #4c84ca; }

.formCheckbox.switch input:checked + label em:before { content: '예'; right: 4.5rem; color: #fff; }

.formCheckbox.switch input:checked + label:before { background-color: #4c84ca; background-image: none; }

.formCheckbox.switch input:checked + label:after { right: .4rem; border-color: #4c84ca; }

.formCheckbox.switch.type2 label em { display: none; }

.formCheckbox.switch.type2 label:before { width: 6rem; }

.formCheckbox.switch.type2 label:after { right: 3.3rem; }

.formCheckbox.switch.type2 input:checked + label:after { right: .4rem; }

.formRadio { display: block; position: relative; }

.formRadio + .formRadio { margin-top: 1rem; }

.formRadio input { overflow: hidden; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; clip: rect(0, 0, 0, 0); border: 0; color: transparent; }

.formRadio label { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; color: #1a1a1a; padding-left: 3.5rem; cursor: pointer; }

.formRadio label:before { content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 1px solid #ccc; background: #fff; transition: all 0.2s ease 0.05s; background-position: center center; background-size: 1.6rem 1.6rem; }

.formRadio label:hover:before { border-color: #4c84ca; }

.formRadio input:checked + label:before { border-color: #4c84ca; background: #4c84ca url(../img/common/rad.png) center center no-repeat; background-size: 1.6rem 1.6rem; }

.formRadio input:disabled + label:before { background-color: #f3f6fb; border-color: #f3f6fb; }

.formRadio input:checked:disabled + label:before { background: #f3f6fb url(../img/common/rad_checked_dis.png) center center no-repeat; background-size: 1.6rem 1.6rem; }

.formRadio input:disabled + label { opacity: 1; }

.formRadio input:focus + label:before { outline: 2px solid #a0d2f1; }

.formRadio.switch label { padding: 0; }

.formRadio.switch label em:before { content: '아니오'; position: absolute; top: 50%; transform: translateY(-50%); color: #666; right: 1.2rem; transition: all 0.2s ease 0.05s; font-size: 1.6rem; }

.formRadio.switch label:before { content: ''; left: auto; right: 0; background-image: none; background-color: #f1f1f1; border-color: #f1f1f1; width: 9rem; height: 3rem; border-radius: 5rem; transition: all 0.2s ease 0.05s; }

.formRadio.switch label:after { content: ''; width: 2rem; height: 2rem; border-radius: 50%; background-color: #fff; border: 1px solid transparent; position: absolute; top: 0; right: 6.2rem; box-shadow: 0 0 1rem rgba(0, 0, 0, 0.1); transition: all 0.2s ease 0.05s; }

.formRadio.switch label:hover:before { border-color: #4c84ca; }

.formRadio.switch input:checked + label em:before { content: '예'; right: 4.5rem; color: #fff; }

.formRadio.switch input:checked + label:before { background-color: #4c84ca; background-image: none; }

.formRadio.switch input:checked + label:after { right: .4rem; border-color: #4c84ca; }

.formRadio.switch.type2 label em { display: none; }

.formRadio.switch.type2 label:before { width: 6rem; }

.formRadio.switch.type2 label:after { right: 3.3rem; }

.formRadio.switch.type2 input:checked + label:after { right: .4rem; }

.formSelect { position: relative; }

.formSelect label, .formSelect .label { font-size: 2rem; font-weight: 500; color: #1a1a1a; display: block; margin-bottom: 1.5rem; }

.formSelect select, .formSelect .selectBtn { border: none; /*color: #888;*/ padding: 0 3.5rem 0 1rem; -ms-flex-pack: start; justify-content: flex-start; height: 3rem; width: 100%; border: 1px solid #ccc; background: #fff url(../img/common/sel_arrow.png) no-repeat center right 0.5rem; background-size: auto 2.4rem; border-radius: .3rem; }

.formSelect select.isActive, .formSelect .selectBtn.isActive { color: #1a1a1a; }

.formSelect .validation { display: none; margin-top: .5rem; font-size: 1.4rem; }

.formSelect[data-status=error] .validation { display: block; color: #ee495d; }

.formSelect[data-status=success] .validation { display: block; color: #0060af; }

.formSelect .select { display: none; position: absolute; min-width: 100%; max-height: 20rem; left: 0; top: auto; margin-top: -.8rem; max-width: 100%; width: 100%; border-radius: 0 0 1.6rem 1.6rem; border: 1px solid #ccc; border-top: none; background: #fff; color: inherit; list-style-type: none; padding: 0; overflow-y: auto; white-space: nowrap; z-index: 9999; transition: all 0.2s ease 0.05s; }

.formSelect .select .option a { display: block; text-align: left; padding: .8rem 1.6rem; color: #1a1a1a; white-space: nowrap; width: 100%; }

.formSelect .select .option a:hover { background-color: #f3fbf6; }

.formSelect.active .select { display: block; }

.unitBtn { position: relative; }

.unitBtn button { font-size: 2.2rem; font-weight: 700; text-align: center; color: #fff; background-color: #0060af; padding: 1.8rem 13rem; border: 1px solid transparent; transition: all 0.2s ease 0.05s; }

.unitBtn button.fix { width: 36rem; }

.unitBtn button.dis, .unitBtn button:disabled { background-color: #e1e6ec; color: #666; cursor: default; }

.unitBtn button.dis:focus, .unitBtn button:disabled:focus { outline: none !important; }

.unitBtn button.line { background-color: #fff; color: #0060af; border: 1px solid #0060af; }

.unitBtn button.line.dis, .unitBtn button.line:disabled { background-color: #fff; color: #85cdf2; border-color: #85cdf2; }

.unitBtn .flexArea { gap: 2rem; }

.unitBtn .flexArea > button { -ms-flex: 1; flex: 1; }

.btnTxt { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; font-size: 1.6rem; padding: 0 1.6rem; height: 4rem; background-color: #fff; border: 1px solid #666; color: #21272a; transition: all 0.2s ease 0.05s; }

.btnTxt.fix { width: 8.5rem; }

.btnTxt.dis, .btnTxt:disabled { color: #bfbfbf; border-color: #bfbfbf; cursor: default; }

.btnTxt.dis:focus, .btnTxt:disabled:focus { outline: none !important; }

.btnTxt.blk { background-color: #565c63; color: #fff; }

.btnTxt + .btnTxt { margin-left: .8rem; }

.unitTab { margin-top: 3.8rem; }

.unitTab > ul { position: relative; color: #666; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.4rem; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; }

.unitTab > ul > li { display: block; }

.unitTab > ul > li .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; height: 3.5rem; padding: 0 2.4rem; border: 1px solid #ccc; font-size: 1.5rem; width: 100%; transition: all 0.2s ease 0.05s; position: relative; }

.unitTab > ul > li .menu:before { content: ''; position: absolute; width: .1rem; height: .1rem; border-radius: 50%; background-color: #fff; left: 50%; top: -1.6rem; transform: translateX(-50%); transition: all 0.2s ease 0.05s; }

.unitTab > ul > li .menu.isActive { color: #fff; border-color: #336bbc; background-color: #336bbc; position: relative; }

.unitTab > ul > li .menu.isActive + .contents { display: block; }

.unitTab .contents { display: none; width: 100%; left: 0; margin-top: 2rem; }

.unitTab .contents.isActive { display: block; }

.unitTabSub { margin-top: 3.8rem; }

.unitTabSub > ul { position: relative; color: #666; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.4rem; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; }

.unitTabSub > ul > li { display: block; }

.unitTabSub > ul > li .menu { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; height: 3.5rem; padding: 0 2.4rem; border: 1px solid #ccc; font-size: 1.5rem; width: 100%; transition: all 0.2s ease 0.05s; position: relative; }

.unitTabSub > ul > li .menu:before { content: ''; position: absolute; width: .1rem; height: .1rem; border-radius: 50%; background-color: #fff; left: 50%; top: -1.6rem; transform: translateX(-50%); transition: all 0.2s ease 0.05s; }

.unitTabSub > ul > li .menu.isActive { color: #fff; border-color: #336bbc; background-color: #336bbc; position: relative; }

.unitTabSub > ul > li .menu.isActive + .contents { display: block; }

.unitTabSub .contents { display: none; width: 100%; left: 0; margin-top: 2rem; }

.unitTabSub .contents.isActive { display: block; }

.unitAcc { position: relative; }

.unitAcc > .tit { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: justify; justify-content: space-between; width: 100%; }

.unitAcc > .tit > button { font-size: 1.9rem; font-weight: 700; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: justify; justify-content: space-between; gap: 1rem; padding: 0 4rem; width: 100%; height: 8rem; border-bottom: 1px solid #ccc; }

.unitAcc > .tit > button > .arrow { width: 1.5rem; height: 1.5rem; position: relative; }

.unitAcc > .tit > button > .arrow:before { content: ''; position: absolute; width: 0.2rem; height: 100%; background-color: #1a1a1a; left: 50%; transform: translateX(-50%); top: 0; opacity: 1; transition: all 0.2s ease 0.05s; }

.unitAcc > .tit > button > .arrow:after { content: ''; position: absolute; width: 100%; height: 0.2rem; background-color: #1a1a1a; top: 50%; transform: translateY(-50%); left: 0; opacity: 1; transition: all 0.2s ease 0.05s; }

.unitAcc > .cont { height: 1px; overflow: hidden; background-color: #f5f6f7; }

.unitAcc > .cont > * { opacity: 0; }

.unitAcc.isActive > .tit > button > .arrow:before { opacity: 0; }

.unitAcc.isActive .cont { height: auto; overflow: visible; padding: 4rem; margin-top: -1px; border-bottom: 1px solid #ccc; }

.unitAcc.isActive .cont > * { opacity: 1; }

.unitTable { border-top: 0.2rem solid #043991; }

.unitTable table thead tr { border-bottom: 1px solid #ccc; }

.unitTable table thead tr th { padding: 1rem; color: #1a1a1a; background: #fafafa; vertical-align: middle; font-weight: 500; height: 4.2rem; }

.unitTable table thead tr em { color: #4c84ca; }

.unitTable table thead tr.typeBg { background-color: #fafafa; }

.unitTable table thead tr.center { text-align: center !important; }

.unitTable table tbody tr { border-bottom: 1px solid #ccc; }

.unitTable table tbody tr:nth-child(even) { background-color: rgba(0, 0, 0, 0.01); }

.unitTable table tbody tr:hover { background-color: rgba(239, 250, 255, 0.5); }

.unitTable table tbody tr th { padding: 1rem; color: #1a1a1a; background: #fff; vertical-align: middle; height: 4.2rem; }

.unitTable table tbody tr th em { color: #4c84ca; }

.unitTable table tbody tr th.typeBg { background-color: #fafafa; }

.unitTable table tbody tr th.center { text-align: center !important; }

.unitTable table tbody tr td { padding: 1rem; vertical-align: middle; height: 4.2rem; text-align: center; }

.unitTable table tbody tr td.center { text-align: center !important; }

.unitTable table tbody tr td.right { text-align: right !important; }

.unitTable table tbody tr td.left { text-align: left !important; }

.unitTable table tbody tr td.noData { text-align: center !important; background-color: #fff; }

.unitTable table tbody tr.bgGray { background-color: #f1f1f1; }

.unitTable table tfoot tr { border-bottom: 1px solid #ccc; }

.unitTable table tfoot tr td { padding: 1rem; color: #1a1a1a; background: #f1f1f1; vertical-align: middle; font-weight: 500; height: 4.2rem; }

.unitTable.typeRow table tbody tr th { text-align: left; padding: 1rem; background-color: #fafafa; }

.unitTable.typeRow table tbody tr td { vertical-align: middle; background-color: #fff; text-align: left; padding: 5px;}

.unitTable.typeRow table tbody tr td.vTop { vertical-align: top; }

.unitList > li { position: relative; padding-left: 1rem; line-height: 1.4; }

.unitList > li:before { content: ''; position: absolute; left: 0; top: 1rem; width: .5rem; height: 1px; background-color: #666; }

.unitList > li + li { margin-top: .5rem; }

.unitList.num { counter-reset: list-number; }

.unitList.num > li { counter-increment: list-number; padding-left: 2.5rem; }

.unitList.num > li:before { content: counter(list-number); font-size: 1.1rem; top: 0; width: 2rem; height: 2rem; border-radius: 50%; background-color: transparent; border: 1px solid #444; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; }

.unitList.dot > li { padding-left: 1rem; }

.unitList.dot > li:before { content: ''; position: absolute; width: .2rem; height: .2rem; background-color: #1a1a1a; left: 0; top: 1rem; }

.unitList.ref > li { padding-left: 2rem; }

.unitList.ref > li:before { content: '※'; position: absolute; left: 0; top: 0; background-color: transparent; }

.unitList.star > li { padding-left: 1.2rem; }

.unitList.star > li:before { content: '*'; position: absolute; left: 0; top: 0; background-color: transparent; }

.unitList.blk > li:before { background-color: #1a1a1a; }

.unitModal { position: fixed; width: 100%; height: 100%; background: radial-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.1), transparent); z-index: 11; top: 0; left: 0; display: none; }

.unitModal > .wrapper { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100rem; max-width: calc(100% - 6rem); border-radius: .5rem; max-height: calc(100% - 6rem); overflow-y: auto; background: #fff; word-break: keep-all; box-shadow: 0 0 5rem rgba(0, 0, 0, 0.3); }

.unitModal > .wrapper .closeModal { position: absolute; right: 4rem; top: 2.5rem; }

.unitModal > .wrapper .closeModal > i > img { width: 8rem !important; }

.unitModal > .wrapper > .tit { font-size: 1.9rem; font-weight: 700; border-bottom: 1px solid #ccc; padding: 2rem 4rem; background-color: #fafafa; }

.unitModal > .wrapper > .contArea { padding: 3rem 3rem; }

.unitModal > .wrapper > .contArea > .msg { font-size: 1.6rem; color: #21272a; text-align: center; padding: 0 2rem; line-height: 1.5; }

.unitModal > .wrapper > .contArea .solidBtn.top { right: 8rem; top: 2rem; }

.unitModal > .wrapper .unitBtn { margin: 0; }

.unitModal > .wrapper .unitBtn .flexArea { gap: 0; overflow: hidden; }

.unitModal > .wrapper .unitBtn .flexArea button { font-size: 1.6rem; padding: 1.2rem; border-radius: 0; }

.unitModal.modalOpen { display: block; }

.unitModal.type2 > .wrapper > .tit { text-align: left; }

.unitModal.type2 > .wrapper > .msg { text-align: left; padding: 0; font-size: 1.3rem; }

.unitModal.type2 > .wrapper > .msg + .msg { margin-top: 3rem; }

.unitModal[data-type=alert] > .wrapper { width: 40rem; }

.unitModal[data-type=alert] > .wrapper .closeModal { position: absolute; right: 1.6rem; top: 1.2rem; }

.unitModal[data-type=alert] > .wrapper .closeModal > i > img { width: 3.2rem !important; }

.unitModal[data-type=alert] > .wrapper > .tit { font-size: 1.8rem; padding: 1.2rem 1.6rem; }

.unitModal[data-type=tooltip] > .wrapper { width: 40rem; }

.unitModal[data-type=tooltip] > .wrapper .closeModal { position: absolute; right: 1rem; top: 1rem; }

.unitModal[data-type=tooltip] > .wrapper .closeModal > i > img { width: 3.2rem !important; }

.unitModal[data-type=tooltip] > .wrapper > .tit { font-size: 1.6rem; padding: 1.2rem 5rem 1.2rem 1.6rem; background-color: #fafafa; }

.unitModal[data-type=tooltip] > .wrapper .contArea { padding: 2rem; font-size: 1.6rem; color: #666; }

.unitModal[data-type=tooltip] > .wrapper .contArea .unitList > li { margin-top: .5rem; }

.unitModal[data-type=sml] > .wrapper { width: 40rem; }

.unitToast { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; width: calc(100% - 6rem); padding: 1rem; height: 5rem; position: fixed; left: 3rem; bottom: -4rem; opacity: 0; background-color: rgba(0, 0, 0, 0.6); border-radius: 10rem; -ms-flex-pack: center; justify-content: center; transition: all 0.2s ease 0.05s; z-index: 1; }

.unitToast.isActive { bottom: 3rem; opacity: 1; }

.unitToast > .tit { font-size: 1.5rem; color: #fff; font-weight: 350; }

.unitSwiper { position: relative; }

.unitSwiper .swiperCont { overflow: hidden; }

.unitSwiper .swiper-button-prev { width: auto; height: auto; top: 50%; transform: translateY(-50%); margin: auto; z-index: 2; }

.unitSwiper .swiper-button-prev:after { display: none; }

.unitSwiper .swiper-button-prev.swiper-button-disabled { display: none; }

.unitSwiper .swiper-button-next { width: auto; height: auto; top: 50%; transform: translateY(-50%); margin: auto; z-index: 2; }

.unitSwiper .swiper-button-next:after { display: none; }

.unitSwiper .swiper-button-next.swiper-button-disabled { display: none; }

.unitSwiper .controller { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 2rem; -ms-flex-pack: center; justify-content: center; position: absolute; bottom: 2rem; width: 100%; }

.unitSwiper .controller .swiper-pagination { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.7rem; -ms-flex-pack: center; justify-content: center; position: relative; z-index: 1; }

.unitSwiper .controller .swiper-pagination > * { width: .8rem; height: .8rem; border-radius: 10rem; }

.unitSwiper .controller .swiper-pagination > *.swiper-pagination-bullet-active { width: 2rem; background-color: #4c84ca; }

.unitSwiper .controller .swiper-pagination.swiper-pagination-lock { display: none; }

.unitSwiper .controller .btnCont { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; position: relative; z-index: 1; }

.unitSwiper .controller .btnCont > button { display: none; }

.unitSwiper .controller .btnCont > button.isActive { display: block; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; box-sizing: border-box; }

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

fieldset, img { border: 0 none; box-sizing: border-box; }

input, select, textarea, button { vertical-align: middle; margin: 0; padding: 0; font-family: inherit; box-sizing: border-box; }

button { border: 0 none; background-color: transparent; cursor: pointer; box-sizing: border-box; line-height: 1; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; }

address, caption, cite, code, dfn, em, var { font-style: normal; box-sizing: border-box; }

::before, ::after, :before, :after { box-sizing: border-box; }

input, textarea, img { max-width: 100%; }

a, a:hover, a:visited, a:active { text-decoration: none; color: inherit; }

sup { font-size: small; vertical-align: text-top; }

sub { font-size: small; vertical-align: text-bottom; }

button, select { -webkit-appearance: none; appearance: none; }

select { background-color: #fff; }

select::-ms-expand { display: none; }

/* Hide Native Arrow IE 10, 11 */
table { width: 100%; table-layout: fixed; border-collapse: collapse; border-spacing: 0; }

table caption { overflow: hidden; position: absolute; width: 1px; height: 1px; clip: rect(1px, 1px, 1px, 1px); }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/* HTML5 for older browsers */
section, main { display: block; }

img { vertical-align: top; }

strong { font-weight: 700; }

button { color: inherit; }

em { font-style: normal; }

input:read-only, input:disabled, button:disabled { cursor: default; }

@font-face { font-family: 'NotoSansKr'; font-style: normal; font-weight: 100; src: url("../common/fonts/NotoSansKR-Thin.woff2") format("woff2"), url("../common/fonts/NotoSansKR-Thin.woff") format("woff"), url("../common/fonts/NotoSansKR-Thin.otf") format("opentype"); }

@font-face { font-family: 'NotoSansKr'; font-style: normal; font-weight: 300; src: url("../common/fonts/NotoSansKR-Light.woff2") format("woff2"), url("../common/fonts/NotoSansKR-Light.woff") format("woff"), url("../common/fonts/NotoSansKR-Light.otf") format("opentype"); }

@font-face { font-family: 'NotoSansKr'; font-style: normal; font-weight: 350; src: url("../common/fonts/NotoSansKR-DemiLight.woff2") format("woff2"), url("../common/fonts/NotoSansKR-DemiLight.woff") format("woff"), url("../common/fonts/NotoSansKR-DemiLight.otf") format("opentype"); }

@font-face { font-family: 'NotoSansKr'; font-style: normal; font-weight: 400; src: url("../common/fonts/NotoSansKR-Regular.woff2") format("woff2"), url("../common/fonts/NotoSansKR-Regular.woff") format("woff"), url("../common/fonts/NotoSansKR-Regular.otf") format("opentype"); }

@font-face { font-family: 'NotoSansKr'; font-style: normal; font-weight: 500; src: url("../common/fonts/NotoSansKR-Medium.woff2") format("woff2"), url("../common/fonts/NotoSansKR-Medium.woff") format("woff"), url("../common/fonts/NotoSansKR-Medium.otf") format("opentype"); }

@font-face { font-family: 'NotoSansKr'; font-style: normal; font-weight: 700; src: url("../common/fonts/NotoSansKR-Bold.woff2") format("woff2"), url("../common/fonts/NotoSansKR-Bold.woff") format("woff"), url("../common/fonts/NotoSansKR-Bold.otf") format("opentype"); }

@font-face { font-family: 'NotoSansKr'; font-style: normal; font-weight: 900; src: url("../common/fonts/NotoSansKR-Black.woff2") format("woff2"), url("../common/fonts/NotoSansKR-Black.woff") format("woff"), url("../common/fonts/NotoSansKR-Black.otf") format("opentype"); }

@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 100; src: url("../common/fonts/Roboto-Thin.woff2") format("woff2"), url("../common/fonts/Roboto-Thin.woff") format("woff"), url("../common/fonts/Roboto-Thin.otf") format("opentype"); }

@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 300; src: url("../common/fonts/Roboto-Light.woff2") format("woff2"), url("../common/fonts/Roboto-Light.woff") format("woff"), url("../common/fonts/Roboto-Light.otf") format("opentype"); }

@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; src: url("../common/fonts/Roboto-Regular.woff2") format("woff2"), url("../common/fonts/Roboto-Regular.woff") format("woff"), url("../common/fonts/Roboto-Regular.otf") format("opentype"); }

@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 500; src: url("../common/fonts/Roboto-Medium.woff2") format("woff2"), url("../common/fonts/Roboto-Medium.woff") format("woff"), url("../common/fonts/Roboto-Medium.otf") format("opentype"); }

@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; src: url("../common/fonts/Roboto-Bold.woff2") format("woff2"), url("../common/fonts/Roboto-Bold.woff") format("woff"), url("../common/fonts/Roboto-Bold.otf") format("opentype"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 100; src: url("../common/fonts/Poppins-Thin.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 200; src: url("../common/fonts/Poppins-ExtraLight.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; src: url("../common/fonts/Poppins-Light.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; src: url("../common/fonts/Poppins-Regular.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; src: url("../common/fonts/Poppins-Medium.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; src: url("../common/fonts/Poppins-SemiBold.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; src: url("../common/fonts/Poppins-Bold.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 800; src: url("../common/fonts/Poppins-ExtraBold.woff") format("woff"); }

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 900; src: url("../common/fonts/Poppins-Black.woff") format("woff"); }

:root, html { font-size: 10px; }

html, body { height: 100%; }

body { font-family: 'NotoSansKr'; font-size: 1.3rem; font-weight: 350; line-height: 1.6; /*color: #666;*/ letter-spacing: -0.01em; word-break: keep-all; word-wrap: break-word; overflow-x: hidden; overflow-y: auto; }

@media (max-width: 1000px) { body { font-size: 1.2rem; } }

:focus { outline: 2px solid transparent !important; }

.dim { position: fixed; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.6); z-index: 999; }

i[class*='icon-'] { overflow: hidden; display: inline-block; white-space: nowrap; color: transparent; text-indent: 300%; box-sizing: content-box; }

body.isFixed { overflow: hidden; }

.co-primary { color: #4c84ca !important; }

.co-secondary { color: #336bbc !important; }

.co-black { color: #1a1a1a !important; }

.co-white { color: #fff !important; }

.co-bagie { color: #e9e3d9 !important; }

.co-gray { color: #666 !important; }

.co-darkGray { color: #21272a !important; }

.co-lightGray { color: #bfbfbf !important; }

.co-yellow { color: #fff27d !important; }

.co-lightYellow { color: #ffe477 !important; }

.co-red { color: #ee495d !important; }

.co-redLight { color: #fa9da8 !important; }

.co-blue { color: #0060af !important; }

.co-secondary { color: #336bbc !important; }

.co-lightBlue { color: #85cdf2 !important; }

.co-darkBlue { color: #043991 !important; }

.co-green { color: #25613d !important; }

.co-greenLight { color: #7fb152 !important; }

.mt-10 { margin-top: -1rem !important; }

.mt0 { margin-top: 0 !important; }

.mt5 { margin-top: .5rem !important; }

.mt10 { margin-top: 1rem !important; }

.mt15 { margin-top: 1.5rem !important; }

.mt20 { margin-top: 2rem !important; }

.mt25 { margin-top: 2.5rem !important; }

.mt30 { margin-top: 3rem !important; }

.mt35 { margin-top: 3.5rem !important; }

.mt40 { margin-top: 4rem !important; }

.mt45 { margin-top: 4.5rem !important; }

.mt50 { margin-top: 5rem !important; }

.mt55 { margin-top: 5.5rem !important; }

.mt60 { margin-top: 6rem !important; }

.ta_r { text-align: right; }

.ui-datepicker { display: none; background-color: #fff; border-radius: .4rem; margin-top: 1rem; margin-left: 0; margin-right: 0; padding: 2rem 2rem 1rem; width: 25rem; box-shadow: 1rem 1rem 4rem rgba(0, 0, 0, 0.1); border: 1px solid #eee; }

.ui-datepicker .ui-datepicker-header { position: relative; padding: 1rem 0; border: none; background: #fff; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-title { margin: -.5rem auto 1rem; line-height: 1.4; text-align: center; font-size: inherit; padding: 0; font-weight: bold; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year { font-weight: 500; border-radius: 0.5rem; font-size: 1.6rem; padding: 0 3rem 0 1.2rem; width: auto; border: none; background: #fff url(../img/common/sel_arrow.png) no-repeat center right; background-size: auto 2rem; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month { margin-left: 1rem; font-weight: 500; border-radius: 0.5rem; font-size: 1.6rem; padding: 0 3rem 0 1.2rem; width: auto; border: none; background: #fff url(../img/common/sel_arrow.png) no-repeat center right; background-size: auto 2rem; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-prev { cursor: pointer; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-prev:hover { border: none; background-color: #fff; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-prev span { background: url("../img/common/cal_arrow_left.png") no-repeat center left; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-next { cursor: pointer; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-next:hover { border: none; background-color: #fff; }

.ui-datepicker .ui-datepicker-header .ui-datepicker-next span { background: url("../img/common/cal_arrow_right.png") no-repeat center right; }

.ui-datepicker .ui-datepicker-calendar { width: 100%; }

.ui-datepicker .ui-datepicker-calendar > thead > tr > th { font-size: inherit !important; padding: .5rem; font-size: inherit; font-weight: normal; }

.ui-datepicker .ui-datepicker-calendar > thead > tr > th:first-child a { color: #ee495d; }

.ui-datepicker .ui-datepicker-calendar > thead > tr > th:last-child a { color: #0060af; }

.ui-datepicker .ui-datepicker-calendar tbody tr td { border-radius: 100%; width: 4.4rem; height: 3rem; cursor: pointer; padding: .5rem; text-align: center; font-size: inherit; }

.ui-datepicker .ui-datepicker-calendar tbody tr td:hover { background-color: transparent; opacity: .6; }

.ui-datepicker .ui-datepicker-calendar tbody tr td:first-child a { color: #ee495d; }

.ui-datepicker .ui-datepicker-calendar tbody tr td:last-child a { color: #0060af; }

.ui-datepicker .ui-datepicker-calendar tbody tr td:last-child a:hover { /* cursor: auto; background-color: #fff;  */}

.ui-datepicker .ui-datepicker-calendar tbody tr td a { color: #000; font-size: inherit !important; font-weight: normal !important; text-decoration: none; border: none; background-color: #fff; width: 2.5rem; height: 2.5rem; border-radius: 50%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; }

.ui-datepicker .ui-datepicker-calendar tbody tr td a:hover { border: none; background-color: transparent; font-weight: normal; color: #1a1a1a; }

.ui-datepicker .ui-datepicker-calendar tbody tr td a:focus { border: none; background-color: transparent; font-weight: normal; color: #1a1a1a; }

.ui-datepicker .ui-datepicker-calendar tbody tr td a.ui-state-disabled { cursor: auto; color: #cccccc; }

.ui-datepicker .ui-datepicker-calendar tbody tr td a.ui-state-highlight { background: #f1f1f1 !important; color: #1a1a1a !important; }

.ui-datepicker .ui-datepicker-calendar tbody tr td a.ui-state-active { background: #4c84ca !important; color: #fff !important; }

.ui-datepicker .ui-datepicker-calendar tbody tr td a.ui-priority-secondary { opacity: .5; }

.ui-datepicker .ui-datepicker-calendar tbody tr td.isClosed { opacity: 1; }

.ui-datepicker .ui-datepicker-calendar tbody tr td.isClosed span, .ui-datepicker .ui-datepicker-calendar tbody tr td.isClosed a { background-color: #bd59e4; color: #fff; border-radius: 50%; width: 2.5rem; height: 2.5rem; text-align: center; border: none; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; }

.ui-datepicker .ui-datepicker-calendar tbody tr td.isSelected { opacity: 1; }

.ui-datepicker .ui-datepicker-calendar tbody tr td.isSelected span, .ui-datepicker .ui-datepicker-calendar tbody tr td.isSelected a { background-color: #e4596a; color: #fff; border-radius: 50%; width: 2.5rem; height: 2.5rem; text-align: center; opacity: 1; border: none; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; }

.ui-datepicker .ui-datepicker-calendar tbody tr td.isHoliday { opacity: 1; }

.ui-datepicker .ui-datepicker-calendar tbody tr td.isHoliday span, .ui-datepicker .ui-datepicker-calendar tbody tr td.isHoliday a { background-color: #62a97f; color: #fff; border-radius: 50%; width: 2.5rem; height: 2.5rem; text-align: center; opacity: 1; border: none; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; }

.ui-datepicker .ui-datepicker-buttonpane { width: 100%; padding: 1rem 0 0; margin: 0; }

.ui-datepicker .ui-datepicker-buttonpane > button { margin: 0; opacity: 1; }

.ui-datepicker .ui-datepicker-buttonpane > button[data-handler=today] { width: 100%; border: none; background-color: #4c84ca; color: #fff; padding: 1rem; }

hr.line { margin: 1rem auto; padding: 0; height: 1px; background-color: #ccc; border: none; }

button.under { position: relative; color: #1a1a1a; }

button.under:before { content: ''; position: absolute; width: 100%; height: 1px; background-color: #1a1a1a; bottom: -.5rem; }

button.left { -ms-flex-align: start; align-items: flex-start; text-align: left; line-height: 1.4; }

button.sendBtn { min-height: 3rem; border: none; background-color: #336bbc; color: #fff; position: absolute; left: 45.5rem; margin-top: -1.5rem; border-radius: .3rem; padding: 0 1rem; }

#content { position: relative; }

#content.login { width: 100%; padding: 0; background-color: #35304e; background-image: none; background-color: #0056a8; min-height: 100vh; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; }

#content .secAdmin { position: relative; width: auto; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; text-align: center; padding: 5rem 10rem; box-shadow: 0 0 4rem rgba(0, 0, 0, 0.05); border-radius: 1rem; background-color: #fff; color: #111; }

#content .secAdmin .topArea { width: auto; height: auto; overflow: hidden; border-radius: 0; margin-bottom: 2rem; }

#content .secAdmin .formArea { margin: 0 auto; width: 30rem; }

#content .secAdmin .formArea h2 { display: block; text-align: left; font-size: 1.4rem; font-weight: normal; margin-bottom: 4rem; text-align: center; }

#content .secAdmin .formArea h2 span { font-size: 1.2rem; color: #999; }

#content .secAdmin .formArea h2 span:before { content: '|'; margin: 0 1.5rem; }

#content .secAdmin .formArea .formText { width: 100%; margin: auto; }

#content .secAdmin .formArea .formText + .formText { margin-top: 2rem; }

#content .secAdmin .formArea .formText input { background-color: transparent; border: none; border: 1px solid #ccc; padding: 1.5rem; color: #111; border-radius: .4rem; transition: all 0.2s ease 0.05s; text-align: center; width: 100%; font-size: 1.6rem; }

#content .secAdmin .formArea .formText input:-ms-input-placeholder { color: #999; }

#content .secAdmin .formArea .formText input::placeholder { color: #999; }

#content .secAdmin .formArea .formText input:focus { border: 1px solid #111; }

#content .secAdmin .formArea .setUnit { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; margin-top: 4rem; -ms-flex-pack: center; justify-content: center; font-size: 1.6rem; }

#content .secAdmin .formArea .setUnit .formCheckbox { margin: 0 1rem; }

#content .secAdmin .formArea .setUnit .formCheckbox label { padding-left: 5rem; white-space: nowrap; color: #666; }

#content .secAdmin .formArea .setUnit .formCheckbox label:before { left: 0; right: auto; width: 4.5rem; }

#content .secAdmin .formArea .setUnit .formCheckbox label:after { left: .3rem; top: .3rem; }

#content .secAdmin .formArea .setUnit .formCheckbox input:checked + label:after { left: 2.2rem; }

#content .secAdmin .formArea .setUnit .btnTxt { border: none; padding: 0 0 0 2; border-radius: 0; color: #666; position: relative; }

#content .secAdmin .formArea .setUnit .btnTxt:before { content: '|'; left: 0; color: #ccc; position: absolute; top: 50%; transform: translateY(-50%); }

#content .secAdmin .formArea .btnUnit.login { margin-top: 1rem; }

#content .secAdmin .formArea .btnUnit.login button { width: calc(100% - 6rem); background: #336bbc; border-radius: 1rem; padding: 2rem; margin-top: 2rem; font-size: 1.5rem; color: #fff; box-shadow: 1rem 1rem 1rem rgba(0, 0, 0, 0); transition: all 0.2s ease 0.05s; }

#content .secAdmin .formArea .btnUnit.login button:hover { box-shadow: 1rem 1rem 1rem rgba(0, 0, 0, 0.2); }

#content .secAdmin .bottomArea { margin: 4rem auto 0; font-size: 1.1rem; color: #666; }

#content .secAdmin .bottomArea em { color: #ee495d; }

#content .secAdmin .bottomArea strong { color: #336bbc; }

#content > .container { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-align: stretch; align-items: stretch; min-height: 100vh; font-size: 1.4rem; }

#content > .container > .left { width: 10rem; min-width: 20rem; height: 100vh; overflow-y: auto; background-color: #4c84ca; color: #fff; }

#content > .container > .left > .topArea h1 > button { padding: 2rem 4rem; text-align: center; width: 100%; }

#content > .container > .left > .topArea h1 > button > img { max-height: 10rem; }

#content > .container > .left .menuArea { padding: 0 1rem; }

#content > .container > .left .menuArea > li .dep01 { width: 100%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-pack: start; justify-content: flex-start; font-size: 1.4rem; padding: 1rem 3rem 1rem 1rem; line-height: 1.4; text-align: left; background-color: rgba(255, 255, 255, 0); transition: all 0.2s ease 0.05s; color: rgba(255, 255, 255, 0.7); }

#content > .container > .left .menuArea > li .dep01.hasSub { background-size: auto 1.2rem; background-position: center right 1rem; background-repeat: no-repeat; background-image: url(../img/common/menu_arrow.png); transition: all 0.2s ease 0.05s; }

#content > .container > .left .menuArea > li .dep01:hover { background-color: #336bbc; color: white; }

#content > .container > .left .menuArea > li .dep01.isActive { background-color: #336bbc; color: white; }

#content > .container > .left .menuArea > li .dep01.isActive.hasSub { background-size: auto .8rem; background-image: url(../img/common/menu_arrow2.png); }

#content > .container > .left .menuArea > li .dep01 > i { width: 2.5rem; min-width: 2.5rem; }

#content > .container > .left .menuArea > li .dep02 { display: none; padding: .5rem; background-color: #336bbc; }

#content > .container > .left .menuArea > li .dep02 > li { border-top: 1px dotted rgba(255, 255, 255, 0.2); }

#content > .container > .left .menuArea > li .dep02 > li > button { width: 100%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-pack: start; justify-content: flex-start; font-size: 1.4rem; line-height: 1.4; text-align: left; padding: 1rem 2rem 1rem 4rem; background-color: rgba(255, 255, 255, 0); transition: all 0.2s ease 0.05s; color: rgba(255, 255, 255, 0.7); }

#content > .container > .left .menuArea > li .dep02 > li > button.hasSub { background-size: auto .8rem; background-position: center left 1.8rem; background-repeat: no-repeat; background-image: url(../img/common/menu_arrow.png); transition: all 0.2s ease 0.05s; }

#content > .container > .left .menuArea > li .dep02 > li > button:hover { text-decoration: underline; color: #fff; }

#content > .container > .left .menuArea > li .dep02 > li > button.isActive { background-color: #336bbc; color: white; }

#content > .container > .left .menuArea > li .dep02 > li > button.isActive.hasSub { background-size: auto .5rem; background-position: center left 1.5rem; background-image: url(../img/common/menu_arrow2.png); }

#content > .container > .left .menuArea > li .dep02 > li .dep03 { display: none; padding: 0 1rem; background-color: #336bbc; }

#content > .container > .left .menuArea > li .dep02 > li .dep03 > li > button { width: 100%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-pack: start; justify-content: flex-start; font-size: 1.3rem; line-height: 1.4; text-align: left; padding: .5rem 1rem .5rem 3rem; background-color: rgba(255, 255, 255, 0); transition: all 0.2s ease 0.05s; color: rgba(255, 255, 255, 0.7); position: relative; }

#content > .container > .left .menuArea > li .dep02 > li .dep03 > li > button:before { content: ''; position: absolute; top: 1.2rem; width: .3rem; height: .3rem; background-color: rgba(255, 255, 255, 0.5); left: 1.5rem; }

#content > .container > .left .menuArea > li .dep02 > li .dep03 > li > button:hover { text-decoration: underline; color: #fff; }

#content > .container > .right { -ms-flex: 1; flex: 1; height: 100vh; overflow-y: auto; }

#content > .container > .right > .topArea { border-bottom: 1px solid rgba(0, 0, 0, 0.2); padding: 0 2rem; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: justify; justify-content: space-between; height: 5rem; }

#content > .container > .right > .topArea > .left { color: #666; }

#content > .container > .right > .topArea > .left > .tit > strong { color: #1a1a1a; color: #4c84ca; }

#content > .container > .right > .topArea > .right { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 3rem; }

#content > .container > .right > .topArea > .right > button { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; color: #666; }

#content > .container > .right > .topArea > .right > button > img { height: 2rem; }

#content > .container > .right > .topTabArea { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; padding: 1rem 2rem; position: relative; overflow-x: auto; width: 100%; height: 6rem; }

#content > .container > .right > .topTabArea:before { content: ''; width: calc(100% - 4rem); height: 1px; background-color: #1a1a1a; position: absolute; bottom: .9rem; }

#content > .container > .right > .topTabArea > li { -ms-flex: 1; flex: 1; border: 1px solid #ccc; border-bottom-color: transparent; position: relative; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; border-radius: .5rem .5rem 0 0; max-width: 20rem; background-color: rgba(0, 0, 0, 0.05); height: 4rem; }

#content > .container > .right > .topTabArea > li > .menuBtn { position: absolute; top: 50%; transform: translateY(-50%); width: calc(100% - 3rem); white-space: nowrap; -ms-flex-pack: start; justify-content: flex-start; height: 4rem; padding: 0 0; font-size: 1.5rem; overflow: hidden; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; color: #999; }

#content > .container > .right > .topTabArea > li > .menuBtn:after { content: ''; width: 2rem; height: calc(100% - .4rem); position: absolute; top: 50%; transform: translateY(-50%); right: 0; background: linear-gradient(90deg, transparent, #f2f2f2); }

#content > .container > .right > .topTabArea > li > .menuBtn > .tit { padding: 1rem; }

#content > .container > .right > .topTabArea > li > .menuClose { width: 3rem; min-width: 3rem; padding: 1rem; position: absolute; top: 50%; transform: translateY(-50%); right: 0; }

#content > .container > .right > .topTabArea > li.isActive { background-color: #fff; position: relative; border-color: #1a1a1a; border-bottom-color: transparent; }

#content > .container > .right > .topTabArea > li.isActive:after { content: ''; width: 100%; height: 1px; background-color: #fff; position: absolute; bottom: -.2rem; }

#content > .container > .right > .topTabArea > li.isActive > .menuBtn { color: #1a1a1a; font-weight: 500; }

#content > .container > .right > .topTabArea > li.isActive > .menuBtn:after { background: linear-gradient(90deg, transparent, #fff); }

#content > .container > .right > .iframeArea { padding: 0 2rem; margin-top: 1rem; }

#content > .container > .right > .iframeArea > iframe { height: calc(100vh - 12rem); width: 100%; display: none; }

#content > .container > .right > .iframeArea > iframe.isActive { display: block; }

#content .pageTit { font-size: 2rem; color: #1a1a1a; font-weight: 700; margin-bottom: 1rem; }

.innerCont { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 2rem; -ms-flex-align: stretch; align-items: stretch; padding-bottom: 2rem; }

.innerCont > section { -ms-flex: 1; flex: 1; max-width: 100%; }

.innerCont > section.addOn { -ms-flex: auto; flex: auto; width: 25rem; min-width: 25rem; max-width: 25rem; }

.innerCont > section.addOn .calendarCont { height: 100%; border: 1px solid #c5c5c5; position: relative; border-radius: .5rem; }

.innerCont > section.addOn + section { max-width: calc(100% - 27rem); }

.innerCont > section.addOn.type2 { width: 35rem; min-width: 35rem; max-width: 35rem; }

.innerCont > section .splitCont { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 2rem; -ms-flex-align: start; align-items: flex-start; margin-top: 2rem !important; }

.innerCont > section .splitCont > .left { -ms-flex: auto; flex: auto; width: 50rem; min-width: 50rem; max-width: 50rem; }

.innerCont > section .splitCont > .left .unitTab { margin-top: 0; }

.innerCont > section .splitCont > .left .unitTab > ul { overflow-x: auto; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; gap: 1rem .4rem; }

.innerCont > section .splitCont > .left .unitTab > ul > li { width: calc(25% - .3rem); }

.innerCont > section .splitCont > .left .unitTab > ul > li .menu { height: 100%; max-height: 4.5rem; line-height: 1.2; padding: 1rem .4rem; }

.innerCont > section .splitCont > .right { -ms-flex: 1; flex: 1; }

.innerCont > section .midTit { font-size: 1.5rem; font-weight: 500; margin-bottom: 1rem; height: 2.1rem; display: block; color: #1a1a1a; }

.innerCont > section .midTit.center { text-align: center; }

.innerCont > section .schArea { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 2rem 3rem; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; background-color: #f1f1f1; padding: 2rem; border-radius: .5rem; width: 100%; }

.innerCont > section .schArea + * { margin-top: 1rem; }

.innerCont > section .schArea + .schArea { margin-top: -2rem; }

.innerCont > section .boxArea { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; border: 1px solid #ccc; background-color: #fff; padding: 2rem; border-radius: .5rem; width: 100%; }

.innerCont > section .boxArea .tblArea { margin-top: 0; width: 100%; }

.innerCont > section .boxArea .btnArea { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; margin-top: 1rem; }

.innerCont > section .tblArea { margin-top: 2rem; }

.innerCont > section .tblArea .tblTop { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 1rem; }

.innerCont > section .tblArea .tblTop > * { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; }

.innerCont > section .tblArea .tblBottom .btnList { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; }

.innerCont > section .tblArea .tblTop .btnList { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; }

.innerCont > section .tblArea .unitTable.typeRow tr td .formText { max-width: 30rem; }

.innerCont > section .tblArea .unitTable.typeRow tr td .formText .right { text-align: right; }

.innerCont > section .tblArea .unitTable.typeRow tr td .formText.fix { max-width: 100%; }

.innerCont > section .tblArea .unitTable.typeRow tr td .formSelect { max-width: 30rem; }

.innerCont > section .tblArea.scroll .unitTable { overflow-x: auto; }

.innerCont > section .tblArea.scroll .unitTable::-webkit-scrollbar { width: .5rem; }

.innerCont > section .tblArea.scroll .unitTable::-webkit-scrollbar-track { box-shadow: inset 0 0 0.2rem rgba(0, 0, 0, 0); border-radius: 3rem; }

.innerCont > section .tblArea.scroll .unitTable::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.2); border-radius: 3rem; border: 0.5rem solid #fff; }

.innerCont > section .tblArea.scroll .scrollBtn { margin-top: 1rem; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: justify; justify-content: space-between; }

.innerCont > section .cardCont { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1.5rem; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; padding: 2rem; background-color: #fafafa; border-radius: .4rem; }

.innerCont > section .cardCont > li { width: calc(33.333% - 1rem); }

.innerCont > section .cardCont > li > button { border: 1px solid #ccc; padding: 1rem 2rem; border-radius: .4rem; -ms-flex-direction: column; flex-direction: column; width: 100%; -ms-flex-align: start; align-items: flex-start; position: relative; gap: .5rem; height: 100%; box-shadow: 0 0 1rem rgba(0, 0, 0, 0); background-color: #fff; transition: all 0.2s ease 0.05s; }

.innerCont > section .cardCont > li > button.isActive { border-color: #1a1a1a !important; box-shadow: 0 0 1rem rgba(0, 0, 0, 0.3); }

.innerCont > section .cardCont > li > button:hover { box-shadow: 0 0 1rem rgba(0, 0, 0, 0.3); }

.innerCont > section .cardCont > li > button > .tit { font-size: 1.5rem; color: #1a1a1a; font-weight: 500; width: 100%; text-align: left; padding-right: 1rem; line-height: 1.4; }

.innerCont > section .cardCont > li > button > .sex { position: absolute; top: 0; right: 0; width: 2.5rem; height: 2.5rem; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; display: none; color: #fff; border-radius: 0 0 0 .4rem; }

.innerCont > section .cardCont > li > button > .time { font-size: 1.3rem; color: #999; }

.innerCont > section .cardCont > li > button > .pay { font-size: 2rem; color: #1a1a1a; }

.innerCont > section .cardCont > li > button > .pay:after { content: ' 원'; font-weight: 400; font-size: 1.4rem; }

.innerCont > section .cardCont > li > button.male { border: 1px solid #85cdf2; }

.innerCont > section .cardCont > li > button.male > .sex { display: -ms-flexbox; display: flex; background-color: #85cdf2; }

.innerCont > section .cardCont > li > button.female { border: 1px solid #fa9da8; }

.innerCont > section .cardCont > li > button.female > .sex { display: -ms-flexbox; display: flex; background-color: #fa9da8; }

.innerCont > section .btnTrDel { width: 2.5rem; border: 1px solid #ccc; padding: .7rem; border-radius: 5rem; background-color: #fff; }

.innerCont > section .unitCount { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; -ms-flex-pack: center; justify-content: center; }

.innerCont > section .unitCount > button { width: 2.2rem; min-width: 2.2rem; height: 2.2rem; border-radius: 50%; background-color: #0060af; color: #fff; -ms-flex-pack: center; justify-content: center; font-size: 1.5rem; }

.innerCont > section .unitCount > .formText { width: 5rem; min-width: 5rem; max-width: 5rem; }

.innerCont > section .unitCount > .formText input { text-align: center; }

.innerCont > section .totalPay { text-align: right !important; }

.innerCont > section .totalPay strong { font-size: 3rem; color: #ee495d; }

.innerCont .tblSch { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; }

.innerCont .tblSch .btnArea > button { background-color: #4c84ca; height: 3rem; padding: 0 1rem; border-radius: .3rem; }

.innerCont .lineBtn { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; min-height: 3rem; border: 1px solid #ccc; border-radius: .3rem; padding: 0 1rem; font-size: 1.3rem; margin: 0 auto; }

.innerCont .lineBtn.blue { background-color: #4c84ca; color: #fff; border-color: #4c84ca; }

.innerCont .lineBtn.imp { background-color: #336bbc; color: #fff; border-color: #336bbc; }

.innerCont .lineBtn.red { background-color: #ee495d; color: #fff; border-color: #ee495d; }

.innerCont .lineBtn.wide { padding: 0 4rem; }

.innerCont .photoCont { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-direction: column; flex-direction: column; }

.innerCont .photoCont > .img { height: 13rem; width: 13rem; position: relative; overflow: hidden; border: 1px solid #ccc; border-radius: .5rem; }

.innerCont .photoCont > .img > img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }

.innerCont .photoCont > .btn { margin-top: .5rem; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-pack: center; justify-content: center; }

.innerCont .inpComNum { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; }

.innerCont .inpComNum .formText + .formText { margin-top: 0; }

.innerCont .inpComNum .formText:nth-last-of-type(2) { width: 5rem; }

.innerCont .inpAddr { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: start; align-items: flex-start; }

.innerCont .inpAddr > .line:not(:first-child) { min-width: 50rem; }

.innerCont .inpAddr > .line:not(:first-child) .flexArea { width: 100%; }

.innerCont .inpAddr > .line:not(:first-child) .flexArea .formText { max-width: 100% !important; width: 100%; }

.innerCont .pickerWrap .ui-datepicker { box-shadow: none; margin-top: 0; border: none; background-color: transparent; }

.innerCont .calendarLegend { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; margin-top: 1rem; padding: 0 2rem; }

.innerCont .calendarLegend > li { width: calc(50% - 1rem); display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; -ms-flex-direction: column; flex-direction: column; font-size: 1.2rem; }

.innerCont .calendarLegend > li > span { width: 2rem; height: 2rem; border-radius: 50%; background-color: #1a1a1a; }

.innerCont .calendarLegend > li.close > span { background-color: #bd59e4; }

.innerCont .calendarLegend > li.select > span { background-color: #e4596a; }

.innerCont .calendarLegend > li.holiday > span { background-color: #62a97f; }

.innerCont .calendarLegend > li.current > span { background-color: #4c84ca; }

.innerCont .pagination { margin-top: 2rem; }

.innerCont .pagination ul { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.2rem; -ms-flex-pack: center; justify-content: center; }

.innerCont .pagination ul > li button { width: 3rem; height: 3rem; border-radius: 50%; font-size: 1.2rem; color: #666; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: center; justify-content: center; background-color: #fff; transition: all 0.2s ease 0.05s; }

.innerCont .pagination ul > li button.isActive { background-color: #336bbc; color: #fff; }

.innerCont .pagination ul > li button.isActive:hover, .innerCont .pagination ul > li button.isActive:focus { color: #fff; }

.innerCont .pagination ul > li button:hover, .innerCont .pagination ul > li button:focus { font-weight: 700; color: #1a1a1a; text-decoration: underline; }

.innerCont .flexArea { -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 2rem; }

.innerCont .flex2 { -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.2rem; justify-content: center; }

.innerCont .flexArea [class^=form] + [class^=form] { margin-top: 0; /*margin-left:2rem;*/ }

.innerCont .flexArea.btn { gap: 1rem; -ms-flex-align: stretch; align-items: stretch; }

.innerCont .flexArea.btn .formText { -ms-flex: 1; flex: 1; }

.innerCont .flexArea.gap { gap: 1rem; -ms-flex-pack: start; justify-content: flex-start; }

.innerCont .flexArea.gap .lineBtn { margin: 0; }

.innerCont .flexChart { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-pack: justify; justify-content: space-between; padding: 0 0 0 2rem; margin-right: -1rem; }

.innerCont .flexChart > div { text-align: left; }

.innerCont .flexChart .barChart { width: calc(100% - 20rem); display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; -ms-flex-pack: end; justify-content: flex-end; }

.innerCont .flexChart .barChart > span { background-color: #ee495d; height: 1.5rem; display: block; border-radius: 5rem 0 0 5rem; }

.innerCont .moveTr { width: 3rem; height: 3rem; border: 1px solid #ccc; border-radius: .3rem; font-size: .8rem; background-color: #fff; }

aside label.tit { font-size: 1.3rem; font-weight: 400; margin-bottom: .5rem; height: 2.1rem; display: block; }

aside .formText.schTxt { width: 25rem; }

aside .formText.schTxt.wide { width: 50rem; }

aside .formText.schTxt.wide2 { width: 35rem; }

aside .btnArea > button { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; height: 3rem; background-color: #4c84ca; color: #fff; padding: 0 2rem; }

aside .radioCheckUnit { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0.5rem; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: start; align-items: flex-start; }

aside .radioCheckUnit > .tit { font-size: 1.3rem; font-weight: 400; margin-bottom: .5rem; height: 2.1rem; display: block; }

aside .radioCheckUnit > .tit.trans { color: transparent; }

aside.flexUnit { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; }

aside.dateUnit { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; }

aside.dateUnit .formText { width: 15rem; }

aside.dateUnit .formText + .formText { margin-top: 0; }

aside.solidBtn { margin-top: 5rem; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-pack: center; justify-content: center; width: 100%; }

aside.solidBtn > button { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; height: 5rem; background-color: #336bbc; color: #fff; font-weight: 500; padding: 0 3rem; width: auto; border-radius: .5rem; font-size: 1.5rem; }

aside.solidBtn > button.dis { background-color: #999; width: auto; }

aside.solidBtn > button.dark { background-color: #666; width: auto; }

aside.solidBtn > button.red { background-color: #ee495d; width: auto; }

aside.solidBtn > button.imp { background-color: #043991; width: auto; }

aside.solidBtn.top { position: absolute; top: 0rem; margin-top: 0; -ms-flex-pack: end; justify-content: flex-end; gap: .5rem; }

aside.solidBtn.top > button { height: 3rem; font-size: 1.3rem; width: auto; }

aside.solidBtn > .chkArea .formCheckbox label { padding-left: 2.5rem; }

aside.solidBtn > .chkArea .formCheckbox label:before { width: 1.8rem; height: 1.8rem; }

aside.solidBtn > .chkArea .formCheckbox + .formCheckbox { margin-top: .5rem; }

aside.phoneMsg { position: relative; }

aside.phoneMsg > .top { min-height: 26rem; background-image: url(../img/common/phone_msg.png); background-repeat: no-repeat; background-size: auto; background-position: top center; position: relative; padding: 13.6rem 0 2rem 7.6rem; }

aside.phoneMsg > .top > .msg { background-color: #fff; border-radius: 0 0 1rem 1rem; max-width: 20rem; padding: 1rem; font-size: 1.3rem; margin-bottom: 2rem; min-height: 4rem; }

aside.phoneMsg.type2 > .top { background-image: url(../img/common/phone_msg2.png); padding: 13rem 0 2rem 5rem; }

aside.phoneMsg.type2 > .top > .tit { display: block; margin-bottom: .2rem; color: #1a1a1a; font-weight: 500; }

aside.phoneMsg.type2 > .top > .tit > .formText { width: 25rem; }

aside.phoneMsg.type2 > .top .msg { max-width: 25rem; background-color: transparent; padding: 0; margin: 2rem 0; }

aside.phoneMsg.type2 > .top .msg > .tit { display: block; margin-bottom: .2rem; color: #1a1a1a; font-weight: 500; }

aside.phoneMsg.type2 > .top .msg > .tit > em { color: #ee495d; }

aside.phoneMsg.type2 > .top .msg .formText { padding: 1rem; border-radius: .3rem; border: 1px solid #ccc; }

aside.phoneMsg.type2 > .top .msg .formText textarea { padding: 0; border-radius: 0; border: none; }

aside.phoneMsg.type2 > .top .msg > .max { text-align: right; font-size: 1.2rem; margin-top: .5rem; }

aside.phoneMsg.type2 > .top .msg > .max > strong { color: #1a1a1a; }

aside.phoneMsg.type2 > .top > .from > .tit { display: block; margin-bottom: .2rem; color: #1a1a1a; font-weight: 500; }

aside.phoneMsg.type2 > .top > .from > .tit > em { color: #ee495d; }

aside.phoneMsg.type2 > .top > .from > .formText { width: 25rem; }

aside .SumoSelect { width: 15rem; }

aside .SumoSelect > .CaptionCont { height: 3rem; border-color: #ccc; padding: 0 3.5rem 0 1rem; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; }

aside .SumoSelect > .CaptionCont > span { font-size: 1.3333rem; line-height: 1.4; padding-right: 0; }

aside .SumoSelect > .CaptionCont > span.placeholder { color: #666; font-style: normal; }

aside .SumoSelect > .CaptionCont > label { top: 50%; transform: translateY(-50%); }

aside .SumoSelect > .CaptionCont > label > i { width: 1.5rem; height: 1.5rem; background: #fff url(../img/common/select_arrow2.png) no-repeat center center; background-size: contain; opacity: .7; }

aside .SumoSelect > .optWrapper > .options li.opt { padding: .8rem 1.6rem .8rem 3.5rem; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; }

aside .SumoSelect > .optWrapper > .options li.opt:hover { background-color: #f3fbf6; }

aside .SumoSelect > .optWrapper > .options li.opt span i { left: auto !important; }

aside .SumoSelect > .optWrapper > .options li.opt.selected span i { background-color: #4c84ca !important; }

aside .SumoSelect > .optWrapper > .options li label { margin-bottom: 0; font-size: 1.3rem; color: #666; font-weight: 400; }

aside .SumoSelect .select-all { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; border: none; padding: .8rem 1.6rem .8rem 3.5rem; height: 3.7rem; }

aside .SumoSelect .select-all span i { left: auto !important; }

aside .SumoSelect .select-all:hover { background-color: #f3fbf6; }

aside .SumoSelect .select-all.selected span i { background-color: #4c84ca !important; }

aside .SumoSelect .select-all label { margin-bottom: 0; font-size: 1.3rem; color: #666; font-weight: 400; }

aside .SumoSelect.open .optWrapper { box-shadow: none; border: 1px solid #ccc; border-radius: 0 0 1.6rem 1.6rem; top: 3rem; }

aside .signArea { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 0; width: 100%; background-color: #fafafa; -ms-flex-pack: center; justify-content: center; height: 22rem; }

aside .creditCardList { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 1rem; -ms-flex-wrap: wrap; flex-wrap: wrap; }

aside .creditCardList > li { width: calc(12.5% - .9rem); }

aside .creditCardList > li > button { height: 4.5rem; border: 1px solid #ccc; border-radius: .4rem; width: 100%; background-color: #fff; transition: all 0.2s ease 0.05s; }

aside .creditCardList > li > button.isActive { background-color: #0060af; color: #fff; }

/*
Icon classes can be used entirely standalone. They are named after their original file names.

Example usage in HTML:

`display: block` sprite:
<div class="icon-home"></div>

To change `display` (e.g. `display: inline-block;`), we suggest using a common CSS class:

// CSS
.icon {
  display: inline-block;
}

// HTML
<i class="icon icon-home"></i>
*/
.icon-acc_arrow { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -21.1rem; width: 2.8rem; height: 1.7rem; }

.icon-arrow_down { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -27rem; width: 1.3rem; height: 0.8rem; }

.icon-arrow_down_mo { background-image: url(../img/sprite/sprite.png); background-position: -25.2rem -22.3rem; width: 2.5rem; height: 1.5rem; }

.icon-arrow_right { background-image: url(../img/sprite/sprite.png); background-position: -35.3rem 0px; width: 1.2rem; height: 2.1rem; }

.icon-arrow_up { background-image: url(../img/sprite/sprite.png); background-position: -12.4rem -30.7rem; width: 1.4rem; height: 0.9rem; }

.icon-arrow_up_mo { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -28.8rem; width: 2.6rem; height: 1.5rem; }

.icon-btn_arrow { background-image: url(../img/sprite/sprite.png); background-position: -20rem -18rem; width: 2rem; height: 1.4rem; }

.icon-btn_arrow_blue { background-image: url(../img/sprite/sprite.png); background-position: -22.4rem -18rem; width: 2rem; height: 1.4rem; }

.icon-btn_arrow_blue_mo { background-image: url(../img/sprite/sprite.png); background-position: -15.6rem -20rem; width: 4rem; height: 2.8rem; }

.icon-btn_arrow_mo { background-image: url(../img/sprite/sprite.png); background-position: -20rem -20rem; width: 4rem; height: 2.8rem; }

.icon-btn_exclam { background-image: url(../img/sprite/sprite.png); background-position: -6.8rem -6.8rem; width: 6rem; height: 6rem; }

.icon-btn_exclam_mo { background-image: url(../img/sprite/sprite.png); background-position: -13.6rem 0px; width: 6rem; height: 6rem; }

.icon-btn_tra { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -13.9rem; width: 2.4rem; height: 2.4rem; }

.icon-cal { background-image: url(../img/sprite/sprite.png); background-position: -20rem -13.6rem; width: 4rem; height: 4rem; }

.icon-cal_mo { background-image: url(../img/sprite/sprite.png); background-position: -7.4rem -20rem; width: 4rem; height: 4rem; }

.icon-camera { background-image: url(../img/sprite/sprite.png); background-position: -8.9rem -28.2rem; width: 2rem; height: 2rem; }

.icon-chk_check_checked_dis { background-image: url(../img/sprite/sprite.png); background-position: -13.6rem -6.4rem; width: 6rem; height: 6rem; }

.icon-close { background-image: url(../img/sprite/sprite.png); background-position: 0px -24.6rem; width: 3.2rem; height: 3.2rem; }

.icon-close_big { background-image: url(../img/sprite/sprite.png); background-position: -20.7rem -28.2rem; width: 1.7rem; height: 1.7rem; }

.icon-close_big2 { background-image: url(../img/sprite/sprite.png); background-position: 0px 0px; width: 6.4rem; height: 6.4rem; }

.icon-close_big_2_mo { background-image: url(../img/sprite/sprite.png); background-position: -6.8rem 0px; width: 6.4rem; height: 6.4rem; }

.icon-close_big_mo { background-image: url(../img/sprite/sprite.png); background-position: -11.8rem -20rem; width: 3.4rem; height: 3.4rem; }

.icon-close_mo { background-image: url(../img/sprite/sprite.png); background-position: 0px -6.8rem; width: 6.4rem; height: 6.4rem; }

.icon-down { background-image: url(../img/sprite/sprite.png); background-position: -22.8rem -28.2rem; width: 1.6rem; height: 1.6rem; }

.icon-down_mo { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -11rem; width: 2.5rem; height: 2.5rem; }

.icon-file_exel { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -26.4rem; width: 2.1rem; height: 2rem; }

.icon-file_han { background-image: url(../img/sprite/sprite.png); background-position: -25.2rem -17.5rem; width: 2.1rem; height: 2rem; }

.icon-file_pdf { background-image: url(../img/sprite/sprite.png); background-position: -25.2rem -19.9rem; width: 2.1rem; height: 2rem; }

.icon-file_ppt { background-image: url(../img/sprite/sprite.png); background-position: -3.9rem -28.2rem; width: 2.1rem; height: 2rem; }

.icon-file_word { background-image: url(../img/sprite/sprite.png); background-position: -6.4rem -28.2rem; width: 2.1rem; height: 2rem; }

.icon-folder { background-image: url(../img/sprite/sprite.png); background-position: -11.3rem -28.2rem; width: 2rem; height: 2rem; }

.icon-ham { background-image: url(../img/sprite/sprite.png); background-position: 0px -28.2rem; width: 3.5rem; height: 2.1rem; }

.icon-ham_mo { background-image: url(../img/sprite/sprite.png); background-position: 0px -20rem; width: 7rem; height: 4.2rem; }

.icon-home { background-image: url(../img/sprite/sprite.png); background-position: -1.9rem -30.7rem; width: 1.6rem; height: 1.8rem; }

.icon-home_mo { background-image: url(../img/sprite/sprite.png); background-position: -3.9rem -30.7rem; width: 1.6rem; height: 1.8rem; }

.icon-icon_arrow { background-image: url(../img/sprite/sprite.png); background-position: -7.2rem -24.6rem; width: 3.4rem; height: 3rem; }

.icon-icon_arrow_mo { background-image: url(../img/sprite/sprite.png); background-position: -12.8rem -13.6rem; width: 6.4rem; height: 5.6rem; }

.icon-icon_list { background-image: url(../img/sprite/sprite.png); background-position: -11rem -24.6rem; width: 3rem; height: 3rem; }

.icon-icon_list_mo { background-image: url(../img/sprite/sprite.png); background-position: -14.4rem -24.6rem; width: 3rem; height: 3rem; }

.icon-icon_mail { background-image: url(../img/sprite/sprite.png); background-position: -17.8rem -24.6rem; width: 3rem; height: 3rem; }

.icon-icon_mail_mo { background-image: url(../img/sprite/sprite.png); background-position: -21.2rem -24.6rem; width: 3rem; height: 3rem; }

.icon-icon_page { background-image: url(../img/sprite/sprite.png); background-position: -24.6rem -24.6rem; width: 3rem; height: 3rem; }

.icon-icon_page_mo { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem 0px; width: 3rem; height: 3rem; }

.icon-inp_clear { background-image: url(../img/sprite/sprite.png); background-position: -16.1rem -28.2rem; width: 1.9rem; height: 2rem; }

.icon-inp_clear_w { background-image: url(../img/sprite/sprite.png); background-position: -18.4rem -28.2rem; width: 1.9rem; height: 2rem; }

.icon-inp_view { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -16.7rem; width: 3rem; height: 1.8rem; }

.icon-inp_view_dis { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem 0px; width: 3rem; height: 2.2rem; }

.icon-inp_view_dis_w { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -2.6rem; width: 3rem; height: 2.2rem; }

.icon-inp_view_w { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -18.9rem; width: 3rem; height: 1.8rem; }

.icon-moveTop { background-image: url(../img/sprite/sprite.png); background-position: -20rem 0px; width: 4.8rem; height: 6.4rem; }

.icon-moveTop_mo { background-image: url(../img/sprite/sprite.png); background-position: -20rem -6.8rem; width: 4.8rem; height: 6.4rem; }

.icon-pagin_end { background-image: url(../img/sprite/sprite.png); background-position: -1.8rem -33.8rem; width: 1.4rem; height: 1.3rem; }

.icon-pagin_end_mo { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -5.2rem; width: 2.6rem; height: 2.5rem; }

.icon-pagin_first { background-image: url(../img/sprite/sprite.png); background-position: -3.6rem -33.8rem; width: 1.4rem; height: 1.3rem; }

.icon-pagin_first_mo { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -8.1rem; width: 2.6rem; height: 2.5rem; }

.icon-pagin_next { background-image: url(../img/sprite/sprite.png); background-position: -5.4rem -33.8rem; width: 1.4rem; height: 1.3rem; }

.icon-pagin_next_mo { background-image: url(../img/sprite/sprite.png); background-position: -25.2rem -11.5rem; width: 2.6rem; height: 2.6rem; }

.icon-pagin_prev { background-image: url(../img/sprite/sprite.png); background-position: -7.2rem -33.8rem; width: 1.4rem; height: 1.3rem; }

.icon-pagin_prev_mo { background-image: url(../img/sprite/sprite.png); background-position: -25.2rem -14.5rem; width: 2.6rem; height: 2.6rem; }

.icon-plus { background-image: url(../img/sprite/sprite.png); background-position: 0px -33.8rem; width: 1.4rem; height: 1.4rem; }

.icon-plus_mo { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -23.8rem; width: 2.8rem; height: 2.8rem; }

.icon-plus_w { background-image: url(../img/sprite/sprite.png); background-position: -35.3rem -2.5rem; width: 1.2rem; height: 1.2rem; }

.icon-sel_arrow { background-image: url(../img/sprite/sprite.png); background-position: -7.8rem -30.7rem; width: 1.9rem; height: 1.1rem; }

.icon-sel_arrow_w { background-image: url(../img/sprite/sprite.png); background-position: -10.1rem -30.7rem; width: 1.9rem; height: 1.1rem; }

.icon-swiper_next { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -3.4rem; width: 3rem; height: 3rem; }

.icon-swiper_next2 { background-image: url(../img/sprite/sprite.png); background-position: 0px -30.7rem; width: 1.5rem; height: 2.7rem; }

.icon-swiper_next2_mo { background-image: url(../img/sprite/sprite.png); background-position: -25.2rem -5.8rem; width: 2.9rem; height: 5.3rem; }

.icon-swiper_next_mo { background-image: url(../img/sprite/sprite.png); background-position: 0px -13.6rem; width: 6rem; height: 6rem; }

.icon-swiper_pause { background-image: url(../img/sprite/sprite.png); background-position: -24.8rem -28.2rem; width: 1.6rem; height: 1.6rem; }

.icon-swiper_pause_mo { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -6.8rem; width: 3rem; height: 3rem; }

.icon-swiper_play { background-image: url(../img/sprite/sprite.png); background-position: -26.8rem -28.2rem; width: 1.6rem; height: 1.6rem; }

.icon-swiper_play_mo { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -10.2rem; width: 3rem; height: 3rem; }

.icon-swiper_prev { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -13.6rem; width: 3rem; height: 3rem; }

.icon-swiper_prev2 { background-image: url(../img/sprite/sprite.png); background-position: -31.9rem -23.2rem; width: 1.5rem; height: 2.8rem; }

.icon-swiper_prev2_mo { background-image: url(../img/sprite/sprite.png); background-position: -25.2rem 0px; width: 2.9rem; height: 5.4rem; }

.icon-swiper_prev_mo { background-image: url(../img/sprite/sprite.png); background-position: -6.4rem -13.6rem; width: 6rem; height: 6rem; }

.icon-tooltip { background-image: url(../img/sprite/sprite.png); background-position: -28.8rem -28.2rem; width: 1.6rem; height: 1.6rem; }

.icon-tooltip_mo { background-image: url(../img/sprite/sprite.png); background-position: -3.6rem -24.6rem; width: 3.2rem; height: 3.2rem; }

.icon-waste { background-image: url(../img/sprite/sprite.png); background-position: -13.7rem -28.2rem; width: 2rem; height: 2rem; }

.icon-zoom { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -17rem; width: 3rem; height: 3rem; }

.icon-zoom_mo { background-image: url(../img/sprite/sprite.png); background-position: -28.5rem -20.4rem; width: 3rem; height: 3rem; }

.icon-zoom_w { background-image: url(../img/sprite/sprite.png); background-position: -5.9rem -30.7rem; width: 1.5rem; height: 1.5rem; }

.nWrap { }
.nWrap .conWrap { display:flex; margin:40px 0 0; gap:40px; }
.nWrap .conWrap .boxArea { width:50%; }
.nWrap .conWrap .scroll { margin:15px 0 0; }
.nWrap .conWrap .left { display:flex; align-items:center; }
.nWrap .conWrap .left .control { margin-left:auto; display:flex; align-items:center; }
.nWrap .conWrap .left .control strong { margin-left:10px; }
.nWrap .lineBtn1 { margin-left:10px; padding:0 20px; }
.nWrap .btnWrap { margin:40px 0; text-align:center; border-top:1px solid #ddd; padding:30px 0; }
.nWrap .fc_red { color:red; margin-left:10px; font-size:11px; }
.ui-sortable { cursor: pointer;}
.unitTable table tbody tr td { padding: 0px; }
