@charset "utf-8";

*{margin:0; padding:0;box-sizing: border-box;min-width: 0;font-size: 12px;color: #000;font-family: '맑은고딕',Malgun Gothic;letter-spacing: -.5px;border:0;vertical-align:base-line;background:transparent;}

:root{
	--main-color-bg:#1d48a0; /* 파랑 */
	--cont-bg:#f8f8fa; /* 회색 */
	--cont-secbg:#62759f; /* 메뉴선택시 회색 */
	--cont-line:#dadbdc; /* 회색선 */
	--bor-line:#ced4da; /* 보더컬러(aeb4c3) */
	--black:#000;
	--menu-font:#515557; /* 중메뉴글씨 */
}

/* base.css */

html,body{width:100%;height:100%;/* overflow:auto; */}
body{background:#fff;}
fieldset,img{border:0 none;vertical-align:top}
nav ul,dl,ul,ol,menu,li{list-style:none}
button{overflow:visible;border:0 none;background-color:transparent;cursor:pointer}
button::-moz-focus-inner{padding:0;border:0}
img,input,button {vertical-align:middle;}
address,caption,em{font-style:normal}
a{color:#454545;text-decoration:none;cursor:pointer}
a:focus,a:active,a:hover{color:#222;text-decoration:none}
a:link {color:#555;text-decoration:none}
a:visited {color:#555;text-decoration:none}
a:hover {color:#333; cursor:pointer}
a:active {color:#555;text-decoration:underline}
table{/*border-collapse:collapse;*/border-spacing:0}
table td,table th{vertical-align:middle !important;}
hr{display:none;}

input[type=tel][readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=email][readonly],
input[type=search][readonly],
input[type=tel][disabled],
input[type=text][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=email][disabled]{background:#eaeaea; border-color:#ced4da; color:#a6a6a6; -webkit-appearance:none;}


input[type=radio]{border:0 !important;display:none;}
input[type="radio"] + label span {
    display: inline-block;
    width: 17px;
    height: 19px;
    vertical-align:middle;
    background:url(../img/sub/radio_off.png) no-repeat center -1px;
    cursor: pointer;
    background-size: cover;
    margin-right:2px;
}
input[type="radio"]:checked + label span {
    background:url(../img/sub/radio_on.png) no-repeat center -1px;
    background-size: cover;
    margin-right:2px;
}
/* input box color 자동완성 파란색 수정 */
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px #fff inset ; -webkit-text-fill-color: #666; }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { transition: background-color 5000s ease-in-out 0s; }


.form-check {
    display: block;
    min-height: 1.7rem;
    margin-bottom: .125rem;
}
label {
    display: inline-block;
	padding:0 3px;
	font-weight:bold;
	/* color:#53596e; */
	vertical-align:middle;
}
.form-check-input {
    width: 1em;
    height: 1em;
    margin-top: .25em;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid rgba(0,0,0,.25);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}


.form-check-input:checked[type=radio] {
    background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
}
.form-check-input:checked {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.form-check-input[type=radio] {
    border-radius: 50%;
}
.form-check .form-check-input {
    float: left;
}

.bold{font-weight:bold;}


/* common */
.blind,legend,caption{overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0px;white-space:nowrap}
#skip{height:0}
#skip a{display:block;position:absolute;left:0;top:-100px;width:100%;height:1px;text-align:center}
#skip a:focus,#skip a:active{position:absolute;top:0;z-index:200;height:40px;background:rgba(255,255,255,0.7);font-weight:bold;color:#333;font-size:14px;text-decoration:none;display:block;width:100%;border-bottom:1px solid #fff;}


.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}

/*전체 드래그 허용*/
/*  * {
        user-select: text;
        -webkit-user-select: text;
        -moz-user-select: text;
        -ms-user-select: text;
    } */

/* 초기화
   ========================================================================== */

html {
  line-height: 1.5; /* 1. 모든 브라우저에서 줄 높이를 수정합니다. */
  -webkit-text-size-adjust: 100%; /*2. iOS에서 방향 변경 후 글꼴 크기 조정을 방지합니다. 리베하얀 -webkit-text-size-adjust:none; */
  -webkit-touch-callout:none;
  -webkit-user-select:text; /*text 드래그 허용*/
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  word-break: keep-all;
  font-size:16px;
    /*text-rendering: optimizeLegibility;*/
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }
body {
  min-width:320px;
  margin: 0; /* 모든 브라우저 여백 제거 */
}
article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section,main {
  display: block; /* IE에서 일관되게 렌더링 */
}
h1 {
  font-size: 2em; /* h1요소 글꼴 크기 및 여백 수정 -크롬,파이어폭스,사파리 */
  margin: 0.67em 0;
}

/* 컨텐츠 그룹화
   ========================================================================== */

pre {
  font-family: monospace, monospace; /* 모든 브라우저에서 글꼴 크기의 상속 및 배율 조정, 모든 브라우저에서 이상한 em 글꼴크기 수정 */
  font-size: 1em; /* 2 */
  /* line-height:1; */
}

/* 텍스트 수준 의미론
   ========================================================================== */

a {
  background-color: transparent; /* IE10에서 활성 링크 회색 배경 제거*/
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    display: block;
	text-decoration:none;
}
abbr[title] {
  border-bottom: none; /* 크롬57에서 하단 테두리 제거 */
  text-decoration: underline; /* 크롬, 엣지, IE, 오페라, 사파리에서 올바른 텍스트 */
  text-decoration: underline dotted; /* 크롬, 엣지, IE, 오페라, 사파리에서 올바른 텍스트 */
}
b,
strong {
  font-weight: bolder; /* 크롬, 엣지, 사파리에서 올바른 글꼴 두께 */
  vertical-align:baseline;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 모든 브라우저에서 글꼴 크기 상속 및 배율 조정 */
  font-size: 1em; /* 모든 브라우저에서 이상한 em 글꼴크기 수정 */
}
small {
  font-size: 95%; /* 모든 브라우저 글꼴 크기 추가 */
}
sub,sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; /* 모든 브라우저상 요소가 줄 높이 영향 주지 않도록 */
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}
del{text-decoration: line-through;}
/* Embedded content
   ========================================================================== */

img {
  border-style: none; /* IE10 링크 내부 이미지 테두리 제거 */
}

/* Forms
   ========================================================================== */

input,
button,
optgroup,
select,
textarea {
  font-family: inherit; /* 모든 브라우저에서 글꼴 스타일을 변경 */
  padding:0.25em 0.375em;
  margin: 0; /* Firefox 및 Safari에서 여백을 제거 */
  min-height:27px;
  /* border-radius:5px; */
}
button,
optgroup,
select,
textarea{
  line-height: 1.15; /* 모든 브라우저에서 글꼴 스타일을 변경 */
}

button,
input { /* IE에서 오버플로를 표시 */
  overflow: visible;
}

button,
select { /* Edge, Firefox 및 IE에서 텍스트 변환의 상속을 제거 */
  text-transform: none;
}

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  background: no-repeat right center / 1em;
  padding-right: 1em;
}

/* 키보드로 버튼에 포커스 시 */
button:focus-visible {outline:#000 solid 2px;}


/* 마우스, 터치로 버튼에 포커스 시 box-shadow: 1px 1px 5px rgba(1, 1, 0, .7);  */
button:focus:not(:focus-visible) { outline: none; }


/**
 * Change the inconsistent appearance in all browsers (opinionated).
 */

select:not([multiple]):not([size]) {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='4'%3E%3Cpath d='M4 0h6L7 4'/%3E%3C/svg%3E");
  background-color:#fff;
  background-size:auto;
  padding-right:21px;
}


[type="color"],
[type="range"] {
  border-width: 0;
  padding: 0;
}

/**
 * Change the inconsistent appearance in IE (opinionated).
 */

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

/**
 * Correct the inconsistent appearance in IE (opinionated).
 */

:-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.54);
}



button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* iOS 및 Safari에서 클릭 가능한 유형의 스타일을 지정할 수없는 문제를 수정 */
  cursor: pointer;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner { /* Firefox에서 내부 테두리와 패딩을 제거 */
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring { /* 이전 규칙에서 설정하지 않은 초점 스타일을 복원 */
  outline: 1px dotted ButtonText;
}
fieldset { /* Firefox에서 패딩을 수정 */
  padding: 0.35em 0.75em 0.625em;
}
input, select { vertical-align:middle; border:1px solid #ced4da;padding-left:10px;background-color:#fff;}

legend {
  box-sizing: border-box; /*  Edge 및 IE의 텍스트 줄 바꿈을 수정 */
  color: inherit; /* IE의`fieldset` 요소에서 색상 상속을 수정 */
  display: table; /*  Edge 및 IE의 텍스트 줄 바꿈을 수정 */
  max-width: 100%; /*  Edge 및 IE의 텍스트 줄 바꿈을 수정 */
  padding: 0; /* 개발자가 제로 아웃 할 때 걸리지 않도록 패딩을 제거 */
  white-space: normal; /*  Edge 및 IE의 텍스트 줄 바꿈을 수정 */
}

progress { /* Chrome, Firefox 및 Opera에서 올바른 수직 정렬 */
  vertical-align: baseline;
}
textarea {
  overflow: auto; /* IE 10+에서 기본 세로 스크롤바 제거 */
  padding:5px;
  line-height:1.4;
  resize: vertical;
  font-size:13px;
  border:0;
}

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* IE 10에서 올바른 상자 크기를 추가 */
  padding: 0; /* IE 10에서 패딩을 제거 */
}


[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button { /* Chrome에서 증가 및 감소 버튼의 커서 스타일을 수정 */
  height: auto;
}
[type="search"] {
  -webkit-appearance: textfield; /* Chrome 및 Safari에서 이상한 모양을 수정 */
  outline-offset: -2px; /* Safari에서 윤곽선 스타일을 수정 */
}
[type="search"]::-webkit-search-decoration { /*macOS의 Chrome 및 Safari에서 내부 패딩을 제거*/
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button; /* iOS 및 Safari에서 클릭 가능한 유형의 스타일을 지정할 수없는 문제를 수정 */
  font: inherit; /* Safari에서 글꼴 속성을 '상속'으로 변경 */
}

/* Interactive
   ========================================================================== */

details {
  display: block; /* Edge, IE 10+ 및 Firefox에서 올바른 디스플레이를 추가 */
}
summary { /* 모든 브라우저에 올바른 디스플레이를 추가 */
  display: list-item;
}
template { /* IE 10+에서 올바른 디스플레이를 추가 */
  display: none;
}
[hidden] { /* IE 10에서 올바른 디스플레이를 추가 */
  display: none;
}
.clear {clear:both;}
.clear::after { content:""; display:block; clear:both;}
.f20{font-size:20px;}

/* 레이아웃 구조
   ========================================================================== */

.row-12{display: flex;flex-wrap: wrap;}
.row-12 > * {flex-shrink:0;width:100%;max-width:100%;}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
    float: left;
  }
  .col-12 {
    width: 100%;
  }
  .col-11 {
    width: 91.66666667%;
  }
  .col-10 {
    width: 83.33333333%;
  }
  .col-9 {
    width: 75%;
  }
  .col-8 {
    width: 66.66666667%;
  }
  .col-7 {
    width: 58.33333333%;
  }
  .col-6 {
    width: 50%;
  }
  .col-5 {
    width: 41.66666667%;
  }
  .col-4 {
    width: 33.33333333%;
  }
  .col-3 {
    width: 25%;
  }
  .col-2 {
    width: 16.66666667%;
  }
  .col-1 {
    width: 8.33333333%;
  }
  .col-pdt{padding-top:10px;}
  .col-pdr{padding-right:5px;}
  .col-pdl{padding-left:5px;}
  .col-pd5{padding:5px;}
  .col-pd10{padding:10px;}
  .col-pdrl{padding:auto 5px;}
  .col-pdlr{padding:auto 5px;}
  .col-pdtb{padding:5px auto;}
  .col-pdbt{padding:5px auto;}
  .bdb0{border-bottom:0 !important;}
  .hide,caption,legend{line-height:0;font-size:0px;overflow:hidden;text-indent:-99999;}




  .hrow-12 {
    height: 100vh;
  }
  .hrow-11 {
    height: 91.66666667vh;
  }
  .hrow-10 {
    height: 83.33333333vh;
  }
  .hrow-9 {
    height: 75vh;
  }
  .hrow-8 {
    height: 66.66666667vh;
  }
  .hrow-7 {
    height: 58.33333333vh;
  }
  .hrow-6 {
    height: 50vh;
  }
  .hrow-5 {
    height: 41.66666667vh;
  }
  .hrow-4 {
    height: 33.33333333vh;
  }
  .hrow-3 {
    height: 25vh;
  }
  .hrow-2 {
    height: 16.66666667vh;
  }
  .hrow-1 {
    height: 8.33333333vh;
  }

  .hrow-12 {
    height: 100%;
  }
  .hrow-11 {
    height: 91.66666667%;
  }
  .hrow-10 {
    height: 83.33333333%;
  }
  .hrow-9 {
    height: 75%;
  }
  .hrow-8 {
    height: 66.66666667%;
  }
  .hrow-7 {
    height: 58.33333333%;
  }
  .hrow-6 {
    height: 50%;
  }
  .hrow-5 {
    height: 41.66666667%;
  }
  .hrow-4 {
    height: 33.33333333%;
  }
  .hrow-3 {
    height: 25%;
  }
  .hrow-2 {
    height: 16.66666667%;
  }
  .hrow-1 {
    height: 8.33333333%;
  }

/* 정렬 */
.vt {vertical-align:top !important}
.vb {vertical-align:bottom !important}
.vm {vertical-align:middle !important}
.ac {text-align:center !important;}
.ar {text-align:right !important}
.al {text-align:left !important}
.auto {margin:0 auto}



/* 여백 */
.mt0{margin-top:0 !important}
.mt2{margin-top:2px !important}
.mt4{margin-top:4px !important}
.mt5{margin-top:5px !important}
.mt7{margin-top:7px !important}
.mt10{margin-top:10px !important}
.mt15{margin-top:15px !important}
.mt20{margin-top:20px !important}
.mt25{margin-top:25px}
.mt30{margin-top:30px !important}
.mt35{margin-top:35px}
.mt40{margin-top:40px !important}
.mt45{margin-top: 45px !important;}

.mla{margin-left:auto !important}
.mra{margin-right:auto !important}
.ml0{margin-left:0 !important}
.ml3{margin-left:5px !important}
.ml5{margin-left:5px !important}
.ml7{margin-left:7px !important}
.ml8{margin-left:7px !important}
.ml10{margin-left:10px}
.ml20{margin-left:20px}

.mr5{margin-right:5px !important}
.mr10{margin-right:10px !important}
.mr15{margin-right:15px !important}
.mr20{margin-right:20px !important}


.mb0{margin-bottom:0px !important}
.mb5{margin-bottom:5px !important}
.mb6{margin-bottom:6px !important}
.mb7{margin-bottom:7px !important}
.mb10{margin-bottom:10px !important}
.mb15{margin-bottom:15px}
.mb20{margin-bottom:20px}
.mb30{margin-bottom:30px}
.mb40{margin-bottom:40px}
.mb50{margin-bottom:50px}
.mb60{margin-bottom:60px}
.mb70{margin-bottom:70px}
.mb80{margin-bottom:80px}
.mb90{margin-bottom:90px}
.mb100{margin-bottom:100px}

.p0{padding:0 !important}
.p5{padding:5px !important}
.p10{padding:10px !important}
.p7_bb{padding:7px !important;box-sizing:border-box !important;}

.pt0{padding-top:0 !important}
.pt5{padding-top:5px !important}
.pt10{padding-top:10px !important}
.pt15{padding-top:15px}
.pt20{padding-top:20px}
.pt25{padding-top:25px}
.pt30{padding-top:30px}

.pl4{padding-left:4px}
.pl5{padding-left:5px !important;}
.pl7{padding-left:7px !important;}
.pl8{padding-left:8px !important;}
.pl10{padding-left:10px}
.pl15{padding-left:15px}
.pl20{padding-left:20px}

.pr5{padding-right:5px !important;}
.pr10{padding-right:10px !important;}
.pr20{padding-right:20px !important}

.pb5{padding-bottom:5px}
.pb7{padding-bottom:7px}
.pb10{padding-bottom:10px}
.pb15{padding-bottom:15px}
.pb20{padding-bottom:20px}


/* width 값 */
.w10 {width:10px}
.w20 {width:20px}
.w30 {width:30px}
.w40 {width:40px}
.w45 {width:45px}
.w50 {width:50px}
.w55 {width:55px}
.w60 {width:60px}
.w65 {width:65px}
.w70 {width:70px}
.w75 {width:75px}
.w80 {width:80px}
.w85 {width:85px}
.w90 {width:90px}
.w95 {width:95px}
.w100 {width:100px}
.w110 {width:110px}
.w120 {width:120px}
.w130 {width:130px}
.w140 {width:140px}
.w150 {width:150px}
.w160 {width:160px}
.w170 {width:170px}
.w180 {width:180px}
.w190 {width:190px}
.w200 {width:200px}
.w210 {width:210px}
.w220 {width:220px}
.w230 {width:230px}
.w240 {width:240px}
.w250 {width:250px}
.w260 {width:260px}
.w270 {width:270px}
.w280 {width:280px}
.w300 {width:300px}
.w400 {width:400px}

.w100p {width:100%}
.w98p {width:98%}
.w97p {width:97%}
.w96p {width:96%}
.w95p {width:95%}
.w94p {width:94%}
.w93p {width:93%}
.w92p {width:92%}
.w91p {width:91%}
.w90p {width:90%}
.w85p {width:85%}
.w80p {width:80%}
.w75p {width:75%}
.w70p {width:70%}
.w65p {width:65%}
.w60p {width:60%}
.w55p {width:55%}
.w50p {width:50%}
.w40p {width:40%}
.w30p {width:30%}
.w20p {width:20%}
.w10p {width:10%}

.bt0{border-top:0 !important;}

/* ▼ */
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

/* 프로그래스바 */
::-webkit-progress-bar {
  background-color: #eaecf4;
}

::-webkit-progress-value {
  background-color: #4f78d1;
}




/********** body **********/

.fb {font-weight:bold;}
.normal {font-weight:normal;}
.f15 {font-size:15px !important;}
.f12 {font-size:12px !important;;}
.f11 {font-size:11px;}
.bgW {background:#fff}

.fl {float:left;}
.fr {float:right;}
.cl {clear:both !important;}
.cl:after {display: block;content:'';clear:both;}

.show, .block{display:block !important;}
.inblock {display:inline-block;}
.none{display:none !important;}
 .visible{visibility: visible;}
.vt {vertical-align:top;}
.vb {vertical-align:bottom;}
.vm {vertical-align:middle ;}

.wbbw{word-break:break-word;}

.bdT0 {border-top:0 !important}
.bdT2 {border-top:2px solid #bbb !important}
.bdT3 {border-top:1px solid #bbb !important}
.bdr1 {border-right:1px solid #ddd !important}
.bdr2 {border-right:1px solid #bbb !important}
.db_dot {border-top:1px dotted #bbb;height:1px;}
.bdb0 {border-bottom:0 !important}
.bdb1 {border-bottom:1px solid #ddd}
/* table 상단 보더값 */
.bdT1 tr {border-top:1px solid #bbb !important}
.bdT1 {border-top:1px solid #bbb !important}

.body{background:#fff;height:100%;}

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

.text-primary {
  color: #4e73df !important;
}

a.text-primary:hover, a.text-primary:focus {
  color: #224abe !important;
}

.text-secondary {
  color: #53596e !important;
}

a.text-secondary:hover, a.text-secondary:focus {
  color: #53596e !important;
}

.text-success {
  color: #1cc88a !important;
}

a.text-success:hover, a.text-success:focus {
  color: #13855c !important;
}
.text-warning {
  color: #f6c23e !important;
}

a.text-warning:hover, a.text-warning:focus {
  color: #dda20a !important;
}

.text-danger {
  color: #cd247a !important;
}

a.text-danger:hover, a.text-danger:focus {
  color: #cd247a !important;
}


.d-flex{display:flex;}
.flex-none{flex:none;}
.flex-max{flex:1;}
.flex-right{margin-left:auto !important;}

.flex-row {
    flex-direction: row !important
}

.flex-column {
    flex-direction: column !important
}

.flex-row-reverse {
    flex-direction: row-reverse !important
}

.flex-column-reverse {
    flex-direction: column-reverse !important
}

.flex-wrap {
    flex-wrap: wrap !important
}

.flex-nowrap {
    flex-wrap: nowrap !important
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse !important
}

.flex-fill {
    flex: 1 1 auto !important
}

.flex-grow-0 {
    flex-grow: 0 !important
}

.flex-grow-1 {
    flex-grow: 1 !important
}

.flex-shrink-0 {
    flex-shrink: 0 !important
}

.flex-shrink-1 {
    flex-shrink: 1 !important
}

.justify-content-start {
    justify-content: flex-start !important
}

.justify-content-end {
    justify-content: flex-end !important
}

.justify-content-center {
    justify-content: center !important
}

.justify-content-between {
    justify-content: space-between !important
}

.justify-content-around {
    justify-content: space-around !important
}

.align-items-start {
    align-items: flex-start !important
}

.align-items-end {
    align-items: flex-end !important
}

.align-items-center {
    align-items: center !important
}

.align-items-baseline {
    align-items: baseline !important
}

.align-items-stretch {
    align-items: stretch !important
}

.align-content-start {
    align-content: flex-start !important
}

.align-content-end {
    align-content: flex-end !important
}

.align-content-center {
    align-content: center !important
}

.align-content-between {
    align-content: space-between !important
}

.align-content-around {
    align-content: space-around !important
}

.align-content-stretch {
    align-content: stretch !important
}

.align-self-auto {
    align-self: auto !important
}

.align-self-start {
    align-self: flex-start !important
}

.align-self-end {
    align-self: flex-end !important
}

.align-self-center {
    align-self: center !important
}

.align-self-baseline {
    align-self: baseline !important
}

.align-self-stretch {
    align-self: stretch !important
}

.border-bottom{border-bottom:1px solid #e3e6f0;}


/* Customize the label (the container) */
.container {
  display: block;
  position: relative;
  padding-left: 22px;
  cursor: pointer;
  font-size: 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 14px;
  width: 14px;
  margin-top:3px;
  border:1px solid rgb(216, 216, 216);
  background:#fff;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
  top: 3px;
  left: 3px;
  width: 6px;
  height: 6px;
  background: white;
}

    #modal2 .modal_body{display: flex;flex-direction: column;padding:15px;}
    #modal2 div.viewerpop.modal_body{padding:0;}



	.wrap_box {margin:18px 11px 18px auto;}
	.wrap_box input{position:absolute; left:-1000%;}
	.wrap_box label {position:relative; display:block; width:50px; height:24px; background:#ccc; border-radius:30px;transition: background 0.4s;}
	.wrap_box label:after{content:""; position:absolute; left:5.5px; top:50%; width:18px; height:18px; border-radius:100%; background:#fff; transform:translateY(-50%); box-shadow: 1px 3px 4px rgba(0,0,0,0.2);}
	.wrap_box input:checked + label {background:#4f78d1; transition: all 0.4s;}
	/* input:checked + label:after {left:inherit; right:7.5px; } */
	.wrap_box input:checked + label:after {left:calc(100% - 23.5px); }
	.wrap_box label span {display:none;}
    .newch_add{font-weight:bold;}
    .newch_add ul li{display:flex;flex-direction:column;margin-bottom:12px;flex-wrap:wrap;}


.btn.style2{background-color:#4f78d1;color:#fff;}
#modal h2,#modal2 h2{
	margin:0;
	font-size:16px;
	color:#000;
}

#menuTabbars,#menuTabbars_btn{z-index:0;}




	 .modal_pop{
		display:none;
		width:100%;
		height:100%;
		z-index:888;
	}
	.modal_pop h2{
		margin:0;
		font-size:16px;
		color:#000;
	}
	.modal_pop button{
		display:inline-block;
	}


	.modal_pop .modal_layer{
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background:rgba(0,0,0,0.5);
		z-index:888;
	}

	.modal_pop .modal_content{
		width:auto;
		margin:0 auto;
		background:#fff;
		position:fixed;
		top:50%;
		left:50%;
		transform:translate(-50%,-50%);
		display:flex;
		flex-direction:column;
		pointer-events:auto;
		border:1px solid #dadbdc;
		border-top:2px solid #1d48a0;
		z-index:999;
	}
	.modal_pop .modal_header{
		display:flex;
		justify-content:space-between;
		background:#f8f8fa;
	    padding: 5px 15px;
	    border-bottom:1px solid #dadbdc;
	    align-items:center;
	}
	.modal_pop .modal_body{
		flex:1 1 auto;
		position:relative;
		padding:10px 15px;
	}
	.modal_pop .modal_body .list{
	padding: 5px 0;
    border-bottom: 1px solid #e9eaed;
    }
	.modal_pop .modal_footer{
		display:flex;
		flex-wrap:wrap;
		flex-shrink:0;
		justify-content:flex-end;
		border-top:1px solid #dadbdc;
	}


	.workreport_title{font-weight:bold;font-size:13px;margin-left:10px;}
	.work_applier{font-weight:bold;color:#666;margin-left:5px;}
	.work_applier:before{content:'';display:inline-block; width:1px;height:10px; border-left:1px solid #888; margin-right:5px;}

	.modal_body label{padding:3px;}

	.dhtmlxcalendar_material div.dhtmlxcalendar_dates_cont ul.dhtmlxcalendar_line li.dhtmlxcalendar_cell_month_date{background:#1d48a0;}
	.dhtmlxcalendar_cell.dhtmlxcalendar_cell_month_date .dhtmlxcalendar_label,.dhtmlxcalendar_cell.dhtmlxcalendar_cell_month_date_hover .dhtmlxcalendar_label{color:#fff !important;}




.cmt_inputdiv textarea{
	min-height: 28px;
    margin-bottom: -4px !important;
    border-radius:0;
    resize:none;
}

#reportCn textarea{
	border:1px solid #000;
}
#modal_close_btn3{margin-left:auto;}
#reportCn{border:1px solid #000;}





/* 캘린더 input */
.input_calen {width:90px;padding:0 6px;margin-right:3px;border:solid 1px #ced4da;background:#fff url(../img/sub/icon_calen.png) no-repeat 70px center !important; border-color:#ced4da; display:inline-block;transition : border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;}
.input_calen::-ms-clear {display:none}
.input_calen:hover {cursor:pointer;}
.input_calen:focus {background:#fff url(../img/sub/icon_calen_focus.png) no-repeat 70px center !important;}



.glyphicon.glyphicon-calendar {
    right:2.1rem;
    top: 0.18rem;
    color: #555555;
    font-size: .9rem;
    cursor: pointer;
    padding: .4rem;
    border-left: 1px solid #dedede;
}
.glyphicon.glyphicon-calendar:hover {
    transition: all 0.3s;
    background: #094f79;
    color: #FFFFFF;
    text-decoration: none;
    border-radius: 0 .2rem .2rem 0;
    font-weight: normal;
    cursor:pointer;
}



/* 파일 찾기 */
.file_input label {position:relative; cursor:pointer; display:inline-block; vertical-align:middle; overflow:hidden; width:80px; height:20px; background:#fff; color:#212529; text-align:center; line-height:22px;  border:0; border:1px solid #dedede;}
.file_input label input {position:absolute; width:0; height:0; overflow:hidden; display:none; }
.file_input input[type=text] {vertical-align:middle; display:inline-block; line-height:22px; font-size:11px; padding:1px 3px; border:0; border:1px solid #dedede;}



/* 문자 줄바꿈, 단어 줄바꿈, 공백 있는 그대로 */
.word_break {word-wrap: break-word;word-break:normal;white-space: pre-wrap;white-space: -moz-pre-wrap;white-space: -pre-wrap;white-space: -o-pre-wrap;}





/* 알림창 */
#wrap_notice {
  min-width: 400px;
  max-width: 600px;
  max-height: 500px;
  position: fixed;
  background: #fff;
  border: 1px solid #9CA3AF;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2000;
  -webkit-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.2);
  border-radius: 6px;
}

#wrap_notice hr {
  margin: 0;
}

#header_notice {
 padding: 12px 16px 0;

}

#header_notice + hr{
	display: none;
}

#header_notice h2 {
  font-size: 14px;
  color: var(--gray-900);
  font-weight: 600;
  padding-bottom: 8px;
  }

#content_notice {
  font-size: 14px;
  color: var(--gray-900);
 padding: 0 8px 12px 16px;

}

#content_notice div{
	max-height: 300px;
	overflow-y: auto;
	border-top: 1px solid var(--gray-400);
	padding: 12px 16px 0 0;
}

.btn_confirm {
  background: #2C5282;
  color: #fff;
  padding: 0 8px;
  height: 32px;
  border-radius: 4px;
  font-weight: 400;
  font-size: 13px;
  white-space: nowrap;
  min-width: 60px;

}

#btnNoConfirm{
	background: #fff;
	border: 1px solid #2C5282;
	color: #2C5282;
}


.btn_confirm .glyphicon-ok{
	display: none;
}

/* error */

div.error {
    position: absolute;
    z-index: 5;
    bottom: -25px;
    left: 0;
    width: 85px;
    background-color: orange;
    padding: 2px 8px;
    color: white;
    text-align: center;
    font-size:0.7rem;
    letter-spacing:-.5px;
    border-radius:4px;
    border:1px solid orange;
    opacity: 1;
    transition: opacity 1s;
    }


div.error:after, div.error:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

div.error:after {
    border-color: transparent;
    border-bottom-color: orange;
    border-width: 5px;
    margin-left: -5px;
}
div.error:before {
    border-color: transparent;
    border-bottom-color: orange;
    border-width: 5px;
    margin-left: -5px;
}
/* 라디오버튼  및 다중버튼 스위치 설정 */
.switch-field {
    overflow: hidden;
    display:inline-block;
    margin-top:-1px;
    vertical-align:middle
}
.switch-title {
    margin-bottom: .38rem;
}
.switch-field input {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden;
}
.switch-field label {
    float: left;
    line-height: 1.6rem;
}
.switch-field label {
    display: inline-block;
    width: auto;
    background-color: #e9f0ff;
    color: #333333;
    font-size: 0.75rem;
    line-height:24px;
    height:1.5rem;
    font-weight: normal;
    text-align: center;
    text-shadow: none;
    padding-right: .8rem;
    padding-left: .8rem;
    border: 1px solid #dfe3ea;
    border-right:none;
    -webkit-box-shadow: inset 0 .03rem 0.1rem rgba(0, 0, 0, 0.1), 0 .03rem rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 .03rem 0.1rem rgba(0, 0, 0, 0.1), 0 .03rem rgba(255, 255, 255, 0.1);
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
.switch-field label:last-child {border-right: 1px solid rgba(0, 0, 0, 0.15);}

.switch-field label:hover {
    cursor: pointer;
    transition: all 0.3s;
}
.switch-field input:checked + label {
    background-color: #6596fc;
    -webkit-box-shadow: inset none 0px;
    box-shadow: inset none 0px;
    font-weight: 600;
    color: #FFFFFF;
    cursor: default;
}
.switch-field label:first-of-type {
    border-radius: .2rem 0 0 .2rem;
}
.switch-field label:last-of-type {
    border-radius: 0 .2rem .2rem 0;
}


.login_box li {position: relative;}
.login_box li .error {left: 55px;}

/* 스크롤바 */

::-webkit-scrollbar {
    width: 16px;
    height: 16px;
}

::-webkit-scrollbar-corner,
::-webkit-scrollbar-track {
    background-color: #ebebeb;
}

::-webkit-scrollbar-thumb {
    background-color: #fff;
    background-clip: padding-box;
    border: 4px solid transparent;
    border-radius:26px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #808080;
    cursor:default;
}

::-webkit-scrollbar-thumb:active {
    background-color: #808080;
    cursor:default;
}

/* Buttons */
::-webkit-scrollbar-button:single-button {
    background-color: #ebebeb;
    display: block;
    background-size: 10px;
    background-repeat: no-repeat;
}

/* Up */
::-webkit-scrollbar-button:single-button:vertical:decrement {
    height: 12px;
    width: 16px;
    background-position: center 4px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(96, 96, 96)'><polygon points='50,00 0,50 100,50'/></svg>");
}

::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='50,00 0,50 100,50'/></svg>");
}

::-webkit-scrollbar-button:single-button:vertical:decrement:active {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='50,00 0,50 100,50'/></svg>");
}

/* Down */
::-webkit-scrollbar-button:single-button:vertical:increment {
    height: 12px;
    width: 16px;
    background-position: center 2px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(96, 96, 96)'><polygon points='0,0 100,0 50,50'/></svg>");
}

::-webkit-scrollbar-button:single-button:vertical:increment:hover {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='0,0 100,0 50,50'/></svg>");
}

::-webkit-scrollbar-button:single-button:vertical:increment:active {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='0,0 100,0 50,50'/></svg>");
}

/* Left */
::-webkit-scrollbar-button:single-button:horizontal:decrement {
    height: 12px;
    width: 12px;
    background-position: 3px 3px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(96, 96, 96)'><polygon points='0,50 50,100 50,0'/></svg>");

}

::-webkit-scrollbar-button:single-button:horizontal:decrement:hover {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='0,50 50,100 50,0'/></svg>");
}

::-webkit-scrollbar-button:single-button:horizontal:decrement:active {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='0,50 50,100 50,0'/></svg>");
}

/* Right */
::-webkit-scrollbar-button:single-button:horizontal:increment {
    height: 12px;
    width: 12px;
    background-position: 3px 3px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(96, 96, 96)'><polygon points='0,0 0,100 50,50'/></svg>");
}

::-webkit-scrollbar-button:single-button:horizontal:increment:hover {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='0,0 0,100 50,50'/></svg>");
}

::-webkit-scrollbar-button:single-button:horizontal:increment:active {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='0,0 0,100 50,50'/></svg>");
}
.red {color:#ff784d;    display: inline-block;margin-right: 3px;vertical-align: middle;}


/*********************************************************/
/* 2025. 10. 30 이후 서은영 작업 */


.consearchinput_list.chart{
	display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding: 4px;
}
.consearchinput_list.chart li input[type="text"],
.consearchinput_list.chart select{
	width: 100px !important;
	padding: 0.25em 0.375em;
}

.consearchinput_list.chart .input_calen{
	    background-position: center 78px !important;
}

.consearchinput_list.chart li{
	margin-right: 0;
	padding: 0;
}
.consearchinput_list.chart .span{
	border-left: none;
	width: 120px;
	margin-left: 0;
	margin-right: 0;
}

/* 피벗 테이블 analPivotTab.jsp */
.contents_wrap.pivot{
	background: none;
}

.contents_wrap.pivot .container{
	padding: 20px 10px 10px 10px;
	cursor: default;
}

.contents_wrap.pivot h1{
	color: #111;
	font-size: 18px;
	text-align: left;
	height: initial;
	margin-top: 0;
	margin-bottom: 10px;
}
.contents_wrap.pivot  .pivot-controls {
	display: flex;
	justify-content: space-between;
    margin-bottom: 30px;
    padding: 10px 16px;
    background-color: #f8f8fa;
    border: 1px solid #dfdfdf;

}
.contents_wrap.pivot  .pivot-controls>div{
	display: flex;
	gap: 30px;
}

.contents_wrap.pivot .control-group {
	display: flex;
	align-items: center;
}

.contents_wrap.pivot .control-group label {
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    height: 33px;
    font-weight: bold;
    line-height: 33px;
    color: #000;
    width: 65px;
}

.contents_wrap.pivot .control-group select,
.contents_wrap.pivot .control-group input {
    font-size: 12px;
    width: 150px !important;
    padding: 0.25em 0.375em;
    height: 27px;
    line-height: 1.15;
    vertical-align: middle;
    border: 1px solid #ced4da;
}

.contents_wrap.pivot .control-group select {
    background-color: white;
}

.contents_wrap.pivot .control-group button {
	width: 80px;
	border-radius: 2px;
    background-color: #1e5ca0;
    color: white;
    cursor: pointer;
    font-weight: bold;
    transition: background-color 0.2s;
}

/* filters-container */

.filters-container {
    margin-bottom: 30px;
    padding: 10px 16px;
    background-color: #f9f9f9;
    border-radius: 6px;
}

.filters-container .filter-group {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.filters-container .filter-group label{
	line-height: 27px;
	padding: 0;
	margin-right: 10px;
	width: 50px;
}
.filters-container .filter-controls {
    display: flex;
    gap: 10px;
    margin-top: 5px;
    align-items: center;
}

.filters-container select, .filters-container input[type="text"]{
	width: 120px;
}
.filters-container input[type="text"]{
	background: #fff;
	opacity: initial;
	position: initial;
}

.filters-container button.remove-filter{
	width: 60px;
	height: 27px;
	border: 1px solid #ff784d;
	color: #ff784d;
	background: #fff;
	text-align: center;
	border-radius: 2px;
}


.filters-container .add-filter {
	width: 80px;
	height: 27px;
    background-color: #1e5ca0;
    border-radius: 2px;
    color: #fff;
}

.contents_wrap.pivot  .pivot-table-container {
    overflow-x: auto;
    margin-top: 20px;
}

.contents_wrap.pivot  .pivot-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 600px;
}

.contents_wrap.pivot  .pivot-table th, .pivot-table td {
    border: 1px solid #ddd;
    padding: 12px;
    text-align: right;
}

.contents_wrap.pivot  .pivot-table th {
    background-color: #e9f0f8;
    position: sticky;
    top: 0;
}

.contents_wrap.pivot  .row-header {
    text-align: left !important;
    font-weight: bold;
    background-color: #f3f3f3;
}

.contents_wrap.pivot .pivot-table tr:hover {
    background-color: #f5f9ff;
}

.contents_wrap.pivot .total-column, .total-row {
    background-color: #e1f0ff;
    font-weight: bold;
}

.contents_wrap.pivot .total-cell {
    background-color: #d0e8ff;
    font-weight: bold;
}

.contents_wrap.pivot .export-options {
    margin: 20px 0;
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    padding-right: 10px;

}

.contents_wrap.pivot .export-options button{
	border-radius: 2px;
	color: #fff;
	padding: 0 10px;
}
.contents_wrap.pivot .export-excel {
    background-color: #217346;
}

.contents_wrap.pivot .export-excel:hover{
	background-color: #1a5c36;
}
.contents_wrap.pivot .export-pdf {
    background-color: #d04423;
}

.contents_wrap.pivot .export-pdf:hover {
    background-color: #b33b1e;
}

.contents_wrap.pivot .loading {
    text-align: center;
    padding: 30px;
    font-size: 15px;
    color: #666;
}

.contents_wrap.pivot .visualization-container {
    margin: 0 12px;
    padding: 10px 20px;
    background-color: #fff;
    border-radius: 6px;
}

.visualization-container label{
	width: 60px;
}

.contents_wrap.pivot .chart-options {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.contents_wrap.pivot .chart-options select{
	width: 90px;
}

.contents_wrap.pivot .chart-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}


.contents_wrap.pivot .chart-type-btn {
    width: 90px;
    height: 27px;
    background-color: #f0f0f0;
    color: #333;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
}

.contents_wrap.pivot  .chart-type-btn.active {
    background-color: #0078D4;
    color: white;
    border-color: #0078D4;
}

.contents_wrap.pivot .chart-container {
    height: 400px;
    margin: 0 auto;
    border: 1px solid #eee;
}

.contents_wrap.pivot  .tabs {
    display: flex;
    border-bottom: 1px solid #ddd;
   margin: 0 12px 20px;
}

.contents_wrap.pivot  .tab-button {
    padding: 10px 20px;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    font-weight: bold;
    color: #666;
}

.contents_wrap.pivot .tab-button.active {
    border-bottom-color: #1e5ca0;
    color: #1e5ca0;
}

.contents_wrap.pivot .tab-content {
	width: 100%;
    display: none;
}

.contents_wrap.pivot  .tab-content.active {
	width: calc(100% - 20px);
    display: block;
    margin: 0 auto;
}

/* 반응형 스타일 */
@media (max-width: 768px) {
    .contents_wrap.pivot  .pivot-controls {
        grid-template-columns: 1fr;
    }

    .contents_wrap.pivot  .filter-controls {
        flex-direction: column;
    }

    .contents_wrap.pivot  .chart-container {
        height: 300px;
    }
}


.contents_wrap.aaa .outer_line_form{
	height: calc(100vh - 55px) !important;

}


.canEdit{
	display: flex;
	align-items: center;
    justify-content: center;
}
.canEdit span{
  color:#fff;
}

.canEditimg{
	width: 16px;
	height: 16px;
	display: inline-block;
	background: url("../img/Column-edit.svg") no-repeat 0px 2px;
	margin-right: 2px;
}