@charset "utf-8";
@import "component.css";
@import "space.css";

/*
 * Project		:	eAccounting Master
 * File			:	common.css
 * Author		:	YoungJae Lee
 * Date			:	July. 2021
 * Description	:	문서 초기화,웹폰트,글로벌 클래스 네임,플러그인스타일
 */
 
 
 
/* --
	web reset
---------------------------------------------------------- */

html, body {height:100%; overflow:hidden;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0; padding:0;}
fieldset,img {border:none; vertical-align: middle;}
dl,ul,ol,menu,li {list-style:none;}
blockquote,q {quotes: none;}
blockquote:before,blockquote:after,q:before,q:after {content:''; content:none;}
input,select,textarea,button {vertical-align:middle;}
button {border:0 none; background-color:transparent; cursor:pointer;}
body,th,td,input,select,textarea,button {font-size: 13px; overflow-x: hidden; color: var(--he-gray-dark); font-weight: 500;
font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-feature-settings: "tnum","cv13";}
a {color:inherit; text-decoration:none; cursor:pointer;}
a:active,a:hover {text-decoration:none;} 
address,caption,cite,code,dfn,em,var {font-style:normal; font-weight:normal;}
iframe {border:none; width:100%; height:100%;}
table {border-spacing:0; border-collapse:collapse;}
caption {overflow:hidden; position:absolute; width:0; height:0; line-height:0; text-indent:-9999px;}

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

/* --
	font style
---------------------------------------------------------- */

/* :: 프리텐다드 */
@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url('/font/pretendard/woff2/Pretendard-Black.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-Black.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url('/font/pretendard/woff2/Pretendard-ExtraBold.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-ExtraBold.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url('/font/pretendard/woff2/Pretendard-Bold.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-Bold.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url('/font/pretendard/woff2/Pretendard-SemiBold.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-SemiBold.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url('/font/pretendard/woff2/Pretendard-Medium.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-Medium.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url('/font/pretendard/woff2/Pretendard-Regular.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-Regular.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url('/font/pretendard/woff2/Pretendard-Light.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-Light.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url('/font/pretendard/woff2/Pretendard-ExtraLight.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-ExtraLight.woff') format('woff');
}
@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url('/font/pretendard/woff2/Pretendard-Thin.woff2') format('woff2'), url('/font/pretendard/woff/Pretendard-Thin.woff') format('woff');
}


/* :: 본고딕 */
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 100;
	src: url('/font/notokr/notokr-light.eot');
	src: url('/font/notokr/notokr-light.eot?#iefix') format('embedded-opentype'),
		 url('/font/notokr/notokr-light.woff2') format('woff2'),
		 url('/font/notokr/notokr-light.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 300;
	src: url('/font/notokr/notokr-regular.eot');
	src: url('/font/notokr/notokr-regular.eot?#iefix') format('embedded-opentype'),
		 url('/font/notokr/notokr-regular.woff2') format('woff2'),
		 url('/font/notokr/notokr-regular.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 500;
	src: url('/font/notokr/notokr-medium.eot');
	src: url('/font/notokr/notokr-medium.eot?#iefix') format('embedded-opentype'),
		 url('/font/notokr/notokr-medium.woff2') format('woff2'),
		 url('/font/notokr/notokr-medium.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 700;
	src: url('/font/notokr/notokr-bold.eot');
	src: url('/font/notokr/notokr-bold.eot?#iefix') format('embedded-opentype'),
		 url('/font/notokr/notokr-bold.woff2') format('woff2'),
		 url('/font/notokr/notokr-bold.woff') format('woff');
}

/* :: 나눔고딕 */
@font-face {
	font-family: 'Nanum Gothic';
	font-style: normal;
	font-weight: 400;
	src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot);
	src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff2) format('woff2'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype');
}
@font-face {
	font-family: 'Nanum Gothic';
	font-style: normal;
	font-weight: 700;
	src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot);
	src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff2) format('woff2'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
	font-family: 'Nanum Gothic';
	font-style: normal;
	font-weight: 800;
	src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot);
	src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff2) format('woff2'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff) format('woff'),
	url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.ttf) format('truetype');
}

/* :: 한나체 - 도장 사용 */
@font-face {
  font-family: 'Hanna';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/hanna/v3/BM-HANNA.eot);
  src: url(//fonts.gstatic.com/ea/hanna/v3/BM-HANNA.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/hanna/v3/BM-HANNA.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/hanna/v3/BM-HANNA.woff) format('woff'),
       url(//fonts.gstatic.com/ea/hanna/v3/BM-HANNA.ttf) format('truetype');
}
/* 출처 – 이사만루 공폰트*/
@font-face {
    font-family: 'esamanru_Light';
    src: url('/font/esamanru/esamanru_Light.woff2') format('woff2');
}
.esamanru-light {font-family: 'esamanru_Light', sans-serif;}

@font-face {
    font-family: 'esamanru_Medium';
    src: url('/font/esamanru/esamanru_Medium.woff2') format('woff2');
}
.esamanru-medium {font-family: 'esamanru_Medium', sans-serif;}

@font-face {
    font-family: 'esamanru_Bold';
    src: url('/font/esamanru/esamanru_Bold.woff2') format('woff2');
}
.esamanru-bold {font-family: 'esamanru_Bold', sans-serif;}

/* --
	Global Classname
---------------------------------------------------------- */

/*  :: chrome input set */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s !important; font-size: inherit !important;}

::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
:-moz-placeholder {color: var(--he-gray-600); font-size:12px;}

/* :: 텍스트 제공 타입 */
.ir-pm {display: block; overflow: hidden; font-size: 0px; line-height: 0; text-indent: -9999px;} /* 사용된 이미지내 의미있는 텍스트의 대체텍스트를 제공할때 */
.ir-wa {display: block; overflow: hidden; position: relative; z-index: -10; width: 100%; height: 100%;} /* 중요한 이미지 대체텍스트로 이미지off시에도 대체 텍스트를 보여주고자 할때 */
.screen-out {overflow: hidden; position: absolute; width: 0; height: 0; line-height: 0; text-indent: -9999px;} /* 대체텍스트가 아닌 접근성을 위한 숨김텍스트를 제공할때 */
.cancel {text-decoration: line-through; color: var(--he-gray-500);}
.bold {font-weight: bold;}
.preLine {white-space: pre-line;}

/* :: useful */
.skip {width: 1px; height: 1px; font-size: 0; line-height: 0; position: absolute; left: -999px; overflow: hidden; visibility: hidden;}
.dimm {position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 95; background: rgba(0,0,0,.5);}
.cl-b {clear: both;}
.show {display: block;}
.hide {display: none;}
.clear-g {display: block; overflow: visible; width: auto; clear: both; *zoom: 1;}
.clear-g:after {display: block; visibility: hidden; height: 0; font-size: 0; clear: both; content: '';}
.t-l {text-align: left !important;}
.t-r {text-align: right !important;}
.t-c {text-align: center !important;}
.overflow {overflow: hidden !important;}
.overVisible {overflow: visible !important;}
.dis-inline {display: inline-block;}
.basic-height {line-height: 32px; display: inline-block;}
.scl {overflow-y:auto !important;}
.scl-x {overflow-x:auto !important;}

/* :: 위치 속성 공통 클래스 */
.f-l,
.fl-box {float: left;}
.f-r {float: right;}
.rel {position: relative;}
.ab {position: absolute; z-index: 1;}
.ab-l {position: absolute; top: 0; left: 0;}
.ab-r {position: absolute; top: 0; right: 0;}
.static {position: static !important;}
.btn-r {position: absolute; top: 0px; right: 1px;}
.ab-n {position: inherit;}
.flex {display: -webkit-box; display: -ms-flexbox; display: flex;}
.flex.verLayout {flex-direction: column;}
.flex.ver-cen {align-items:center;}
.flex.spaceBet {justify-content: space-between;}
.flex > .fixCol {flex-shrink: 0; width: auto;}
.flex > .flexCol {flex-grow: 1;}

/* :: loading bar */
#displayLoadingImgBox {display: none;}

.loading-wrap {position: absolute; top: 50%; left: 50%; margin-top: -4px; margin-left: -4px;}
.loading-wrap .loader {position: relative; width: 8px; height: 8px; background-color: var(--he-main1); box-shadow: -14px 0px 0px rgba(var(--he-main1-rgb), 0.5); border-radius: 50%;
    -webkit-animation: circle_classic 1s ease-in-out infinite alternate;
       -moz-animation: circle_classic 1s ease-in-out infinite alternate;
            animation: circle_classic 1s ease-in-out infinite alternate;}
@-webkit-keyframes circle_classic{
    0%{ opacity: 0.1; -webkit-transform: rotate(0deg) scale(0.5);}
   100%{opacity: 1; -webkit-transform: rotate(360deg) scale(1.2);}   
}
@-moz-keyframes circle_classic{
    0%{ opacity: 0.1; -moz-transform: rotate(0deg) scale(0.5);}
   100%{opacity: 1; -moz-transform: rotate(360deg) scale(1.2);}   
}
@keyframes circle_classic{
    0%{ opacity: 0.1; transform: rotate(0deg) scale(0.5);}
   100%{opacity: 1; transform: rotate(360deg) scale(1.2);}   
}

/* --
	jquery plugin style
---------------------------------------------------------- */

/* :: calendar */
.yearText:after {content: '년';}
.gldp-flatwhite {position: fixed; padding: 2px 3px 5px; background-color: var(--he-base); font-size: 12px; margin: 0 0 0 6px; min-width: 232px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -o-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);}

.gldp-flatwhite .prev-arrow {font-size: 16px;}
.gldp-flatwhite .core {float: left; position: relative; background-color: var(--he-base); text-align: center;
    box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

.gldp-flatwhite .monyear,
.gldp-flatwhite .monyear select {margin-top: 0px; background-color: var(--he-base); color: var(--he-gray-dark);}

.gldp-flatwhite .monyear span {margin: 0 5px;}
.gldp-flatwhite .prev-arrow,
.gldp-flatwhite .next-arrow {text-shadow: none; font-size: 18px; width: 20px; height: 20px;}
.gldp-flatwhite .prev-arrow,
.gldp-flatwhite .next-arrow {display: block; overflow: hidden; font-size: 0px; line-height: 0; text-indent: -9999px;}
.gldp-flatwhite .prev-arrow {background: url("/images/com/web/cal-prev.gif") no-repeat; background-size: 8px auto; background-position: top 10px right;}
.gldp-flatwhite .next-arrow {background: url("/images/com/web/cal-next.gif") no-repeat; background-size: 8px auto; background-position: top 10px right;}
.gldp-flatwhite .prev-arrow:hover,
.gldp-flatwhite .prev-arrow:focus,
.gldp-flatwhite .prev-arrow:active,
.gldp-flatwhite .next-arrow:hover,
.gldp-flatwhite .next-arrow:focus,
.gldp-flatwhite .next-arrow:active {color: var(--he-base);}
.gldp-flatwhite .prev-arrow-off,
.gldp-flatwhite .next-arrow-off {color: var(--he-gray-400);}
.gldp-flatwhite .dow {background-color: var(--he-gray-100); cursor: default; font-weight: bold;}
.gldp-flatwhite .sat {color: var(--he-blue);}
.gldp-flatwhite .sun {color: var(--he-red);}
.gldp-flatwhite .outday {color: var(--he-gray-400)!important;}
.gldp-flatwhite .mon,
.gldp-flatwhite .tue,
.gldp-flatwhite .wed,
.gldp-flatwhite .thu,
.gldp-flatwhite .fri,
.gldp-flatwhite .sat,
.gldp-flatwhite .sun,
.gldp-flatwhite .selected {border: 2px solid var(--he-base);}

.gldp-flatwhite .mon:hover,
.gldp-flatwhite .tue:hover,
.gldp-flatwhite .wed:hover,
.gldp-flatwhite .thu:hover,
.gldp-flatwhite .fri:hover,
.gldp-flatwhite .sat:hover,
.gldp-flatwhite .sun:hover {background-color: var(--he-gray-200);}
.gldp-flatwhite .noday {color: var(--he-gray-100); cursor: wait !important}

.gldp-flatwhite .selected,
.gldp-flatwhite .selected:hover {font-weight: bold; color: var(--he-base); background-color: var(--he-main1);}

.gldp-flatwhite .today {box-shadow: inset 0 -2px 0px var(--he-main1); color: var(--he-main1); font-weight: bold;}

/* :: monthly picker */
.ui-datepicker .ui-datepicker-header {color: var(--he-base); padding: 0 !important; border: none; background-color: var(--he-main1);}

.ui-datepicker table {width: 96% !important; margin: 5px auto !important;}
.ui-datepicker table td {color: var(--he-gray-dark) !important; font-weight: 500 !important;}
.ui-datepicker table td:hover {cursor: pointer !important; background-color: var(--he-gray-100); transition: all 0.4s;}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {font-weight: bold; background: var(--he-gray-200) !important; color: var(--he-main1) !important; border: none !important; text-align: left;}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {text-align: center;}

select.mtz-monthpicker-year {display: block; width: 94%; border: none; background: none; outline: none; padding: 8px 0; color: var(--he-base); font-weight: bold; margin: 0 auto;}
select.mtz-monthpicker-year option {color: var(--he-gray-dark)}


/* --
	ck editor
---------------------------------------------------------- */
.cke_chrome {visibility: inherit !important;}


/* :: 프린트설정 */
@media print {
    * {
        -webkit-print-color-adjust: exact;
        color-adjust: exact !important;
    }
}

/* :: window popup */
.pop-wrapper {width: 100%; height: 100%; overflow: hidden; position: relative; display: flex; flex-direction: column;}
.pop-header {flex-shrink: 0; background: var(--he-base) !important; padding: 0 15px; border-bottom: 1px solid rgba(var(--he-gray-400-rgb), .6); height: 50px; line-height: 50px; display: flex; align-items: center; justify-content: space-between;}
.pop-header h3 {font-size: 13px; font-weight: bold;}
.pop-body {flex-grow: 1; overflow-y: auto;}
.pop-bodyIn {padding:15px;}
.pop-bottom {flex-shrink: 0; background: var(--he-gray-100); text-align: center; border-top: 1px solid rgba(var(--he-gray-400-rgb),.6); min-height: 47px; display: flex; align-items: center; justify-content: center;}
.pop-wrapper .MultiFile-label {background: var(--he-gray-100); border: 1px solid rgba(var(--he-gray-400-rgb),.6); padding: 10px; cursor: pointer;}
.pop-wrapper .MultiFile-label .MultiFile-remove {width: 20px; height: 20px; display: inline-block; background: var(--he-red); text-align: center; margin: 0; float: none;}
.pop-wrapper .MultiFile-label .MultiFile-remove .icn_fileDel {display: inline-block; background: none; padding: 0;}
.pop-wrapper .MultiFile-label .MultiFile-title {padding-left: 5px !important;}
.pop-wrapper .btnFileDwn {background-color: var(--he-base); border: 1px solid rgba(var(--he-gray-400-rgb), .6); padding: 2px;}





/* :: document loading process bar */
.preloader {position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 999; background: rgba(0,0,0,.6)}
.preloader-bar {display: block; position: relative; left: 50%; top: 50%; width: 150px; height: 150px; margin: -75px 0 0 -75px; border-radius: 50%; border: 3px solid transparent;    
						-webkit-animation: preloader-bar 2s linear infinite; animation: preloader-bar 2s linear infinite; border-top-color: var(--he-main1);}
.preloader-bar:before {content: ""; position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border-radius: 50%; border: 3px solid transparent;
                       -webkit-animation: preloader-bar 3s linear infinite; animation: preloader-bar 3s linear infinite; border-top-color: var(--he-gray-100);}
.preloader-bar:after {content: ""; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; border-radius: 50%; border: 3px solid transparent;
                       -webkit-animation: preloader-bar 1.5s linear infinite; animation: preloader-bar 1.5s linear infinite; border-top-color: var(--he-main2);}
@-webkit-keyframes preloader-bar {
    0%   {-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg);}
}
@keyframes preloader-bar {
    0%   {-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg);}
}