/*
**
** 크기 : xs-sm-md-lg-xl-2xl-3xl
** 색상 : white-light-gray-darkgray-dark-deepdark
*/
:root {
  --font-size: 16px;
  --font-color: #1a1b1c;

  --size-body: 480px;

  --background-color: #ffffff;

  --font-size--13: 13px;
  --font-size--14: 14px;
  --font-size--15: 15px;
  --font-size--16: 16px;
  --font-size--17: 17px;
  --font-size--18: 18px;
  --font-size--19: 19px;
  --font-size--20: 20px;
  --font-size--21: 21px;
  --font-size--22: 22px;
  --font-size--23: 23px;
  --font-size--26: 26px;
  --font-size--27: 27px;
  --font-size--34: 34px;
  --font-size--35: 35px;
  --font-size--37: 37px;

  --color-light-black: #1a1b1c;
  --color-light2-black: #515357;
  --color-dark-black: #383a3d;
  --color-dark-grey: #9a9ea7;
  --color-dark2-grey: #66676a;
  --color-dark3-grey: #838588;
  --color-dark4-grey: #979797;
  --color-light-grey: #caccd3;
  --color-light2-grey: #d3d3d3;
  --color-light3-grey: #d3d5db;
  --color-light4-grey: #7e8187;
  --color-light5-grey: #f8f8f8;
  --color-light6-grey: #70737a;
  --color-dark-red: #b30002;
  --color-light-red: #dc3545;
  --color-light2-red: #fa2020;
  --color-light3-red: #dc3646;
  --color-dark-navy: #091f60;
  --color-light-blue: #1285ea;
  --color-light2-blue: #0ab2ff;
  --color-light3-blue: #d2b8ff;
  --color-dark-blue: #714bb4;
  --color-yellow: #ffd557;
  --color-input-border: #b5b5b5;
  --color-input-focus: #091f5f;

  --input-height: 52px;
  --input-md-height: 48px;
  --input-sm-height: 42px;

  --input-border-radius: 6px;

  --input-pd: 12px 16px;
  --input-md-pd: 7px 14px;
  --input-sm-pd: 4px 14px;

  --input-select-md-pd: 7px 30px 7px 14px;

  --btn-height: 50px;

  --table-pd: 10px 12px;

  --color-table-line: #dbdcdc;
  --color-table-bg: #f5f6f8;
  --color-table-bg2: #ebecee;
  --color-table-bg3: #dadce2;
  --color-cover: #21212d;

  --line-height-d: 1;
  --line-height-m: 1.45;
  --line-height-l: 1.77;
  --line-height-xl: 1.87;

  --home-header-height: 123px;
}
/* 스크롤바 */
/* Firefox */
* {
  scrollbar-width: 5px;
  scrollbar-color: rgba(0,0,0,0.35) transparent;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar { width: 5px; }

*::-webkit-scrollbar-track { background: transparent; }

*::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,0.2); border-radius: 50rem; }
/* noto-sans-kr-regular - latin_korean */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/noto-sans-kr-v27-latin_korean-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
  url('./fonts/noto-sans-kr-v27-latin_korean-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('./fonts/noto-sans-kr-v27-latin_korean-regular.woff2') format('woff2'), /* Super Modern Browsers */
  url('./fonts/noto-sans-kr-v27-latin_korean-regular.woff') format('woff'), /* Modern Browsers */
  url('./fonts/noto-sans-kr-v27-latin_korean-regular.ttf') format('truetype'), /* Safari, Android, iOS */
  url('./fonts/noto-sans-kr-v27-latin_korean-regular.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* font-size */
[text-size="xs"] {
  font-size: var(--font-size--13);
}
[text-size="ms"] {
  font-size: var(--font-size--14);
}
[text-size="s"] {
  font-size: var(--font-size--15);
}
[text-size="r"] {
  font-size: var(--font-size--16) !important;
}
[text-size="ls"] {
  font-size: var(--font-size--17);
}
[text-size="x-ls"] {
  font-size: var(--font-size--18);
}
[text-size="m"] {
  font-size: var(--font-size--19) !important;
}
[text-size="lm"] {
  font-size: var(--font-size--20);
}
[text-size="lg"] {
  font-size: var(--font-size--22);
}
[text-size="m-lg"] {
  font-size: var(--font-size--23);
}
[text-size="x-lg"] {
  font-size: var(--font-size--27);
}
[text-size="xx-lg"] {
  font-size: var(--font-size--34);
}
[text-size="xxm-lg"] {
  font-size: var(--font-size--37);
}
/* font-color */
[text-color="light-black"] {
  color: var(--color-light-black) !important;
}
[text-color="light2-black"] {
  color: var(--color-light2-black) !important;
}
[text-color="dark-black"] {
  color: var(--color-dark-black) !important;
}
[text-color="dark-grey"] {
  color: var(--color-dark-grey) !important;
}
[text-color="dark2-grey"] {
  color: var(--color-dark2-grey) !important;
}
[text-color="dark3-grey"] {
  color: var(--color-dark3-grey) !important;
}
[text-color="dark4-grey"] {
  color: var(--color-dark4-grey) !important;
}
[text-color="light-grey"] {
  color: var(--color-light-grey) !important;
}
[text-color="light2-grey"] {
  color: var(--color-light2-grey) !important;
}
[text-color="light2-grey"] {
  color: var(--color-light2-grey) !important;
}
[text-color="light3-grey"] {
  color: var(--color-light3-grey) !important;
}
[text-color="light4-grey"] {
  color: var(--color-light4-grey) !important;
}
[text-color="light5-grey"] {
  color: var(--color-light5-grey) !important;
}
[text-color="light6-grey"] {
  color: var(--color-light6-grey) !important;
}
[text-color="dark-red"] {
  color: var(--color-dark-red) !important;
}
[text-color="light-red"] {
  color: var(--color-light-red) !important;
}
[text-color="light2-red"] {
  color: var(--color-light2-red) !important;
}
[text-color="light3-red"] {
  color: var(--color-light3-red) !important;
}
[text-color="dark-navy"] {
  color: var(--color-dark-navy) !important;
}
[text-color="light-blue"] {
  color: var(--color-light-blue) !important;
}
[text-color="light2-blue"] {
  color: var(--color-light2-blue) !important;
}
[text-color="light3-blue"] {
  color: var(--color-light3-blue) !important;
}
[text-color="dark-blue"] {
  color: var(--color-dark-blue) !important;
}
[text-color="yellow"] {
  color: var(--color-yellow) !important;
}
[text-line="d"] { line-height: var(--line-height-d); }
[text-line="m"] { line-height: var(--line-height-m); }
[text-line="l"] { line-height: var(--line-height-l); }
[text-line="xl"] { line-height: var(--line-height-xl); }
[text="pre-line"] { white-space: pre-line; }
[text-border="bottom"] {
  border-bottom: 1px solid #d3d3d3;
}
a[icon="reload"] {
  display: flex;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
}
a[icon="reload"]:before {
  content: url("../img/ic-reset.png");
  width: 20px;
  height: 20px;
  margin-right: 5px;
}
[cursor] {
  cursor: pointer;
  user-select: none;
}
[bg-c="light5-grey"] {
  background-color: var(--color-light5-grey);
}
[align="right"] { text-align: right; }
[align="center"] { text-align: center; }
/* flex 관련 */
.flex { display: flex; }
[fl="half"] { flex: 0.5; }
[fl="1"] { flex: 1; }
[fl="142"] { flex-basis: 28.4vw; }
[fl-btn="xxs"] { flex-basis: 78px; }
[fl-btn="xs"] { flex-basis: 90px; }
[fl-btn="93"] { flex-basis: 93px; }
[fl-btn="100"] { flex-basis: 100px; }
[fl-btn="s"] { flex-basis: 116px; }
[fl-btn="ms"] { flex-basis: 136px; }
[fl-btn="xm"] { flex-basis: 160px; }
[fl-btn="m"] { flex-basis: 218px; }
[fl-grid="2"] { flex-basis: calc(50% - 1rem); }
/*[fl-gap="xs"] { gap: 5px; }*/
[fl-gap="xs"] > button:not(:last-child),
[fl-gap="xs"] > div:not(:last-child) { margin-right: 5px; }
/*[fl-gap="s"] { gap: 9px; }*/
[fl-gap="s"] > button:not(:last-child),
[fl-gap="s"] > div:not(:last-child) { margin-right: 9px; }
/*[fl-gap="ms"] { gap: 12px; }*/
[fl-gap="ms"] > button:not(:last-child),
[fl-gap="ms"] > div:not(:last-child) { margin-right: 12px; }
/*[fl-gap="mm"] { gap: 14px; }*/
[fl-gap="mm"] > div:not(:last-child),
[fl-gap="mm"] > button:not(:last-child) { margin-right: 14px; }
/*[fl-gap="m"] { gap: 22px; }*/
[fl-gap="m"] > div:not(:last-child),
[fl-gap="m"] > button:not(:last-child) { margin-right: 22px; }
/*[fl-gap="lm"] { gap: 24px; }*/
[fl-gap="lm"] > div:not(:last-child),
[fl-gap="lm"] > button:not(:last-child) { margin-right: 24px; }
/*[fl-gap="43"] { gap: 43px; }*/
[fl-gap="43"] > div:not(:last-child),
[fl-gap="43"] > button:not(:last-child) { margin-right: 43px; }
[fl-algin="center"] {
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  align-items: center;
}
[fl-algin="end"] {
  -webkit-box-align: end;
  -moz-box-align: end;
  box-align: end;
  align-items: end;
}

[fl-self="center"] {
	align-self:center;
	
}
[fl-justify="center"] {
  justify-content: center;
  -webkit-justify-content: center;
}
[fl-justify="end"] {
  justify-content: flex-end;
  -webkit-justify-content: flex-end;
}
[fl-justify="between"] {
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
[fl-dir="column"] { flex-direction: column; }
[gap="range"] > div {
  position: relative;
}
[gap="range"] > div:first-child:after {
  content: '~';
  position: absolute;
  right: -17px;
  bottom: 24px;
}
/* input 관련 */
[type="form-label"] {
  font-size: var(--font-size--16);
  line-height: 2;
  color: var(--color-dark2-grey);
  margin-bottom: 4px;
}
@media (max-width: 375px) {
  [type="form-label"] {
    font-size: var(--font-size--14);
  }
}
/* 높이 관련 */
[min-h="m"] {
  min-height: 588px;
}

[scroll="xh"] {
  overflow-x: hidden;
}
/* padding-(size * 5) */
[pd="xs"] {
  padding: 17px 10px;
}
[pd="m"] {
  padding: 33px 40px;
}
[img="full"] {
  width: 100%;
}
[w="half"] {
  width: 50%;
}
.ph-m { padding: 27px 34px !important; }
.pv-s { padding: 0 8px; }
.pv-3 { padding: 0 15px !important; }
.pv-3-half { padding: 0 18px !important; }
.pv-4 { padding: 0 20px; }
.pv-5 { padding: 0 25px; }
.pv-5-half { padding: 0 28px; }
.pv-6 { padding: 0 30px; }
.pv-9 { padding: 0 45px; }
.ph-4 { padding: 20px 0; }
.pt-2 { padding-top: 10px; }
.pt-5 { padding-top: 25px; }
.pt-9 { padding-top: 45px; }
.pb-2 { padding-bottom: 10px; }
.pb-3 { padding-bottom: 15px; }
.pb-4 { padding-bottom: 20px; }
.pb-5 { padding-bottom: 25px; }
.pb-6 { padding-bottom: 30px; }
.pb-7 { padding-bottom: 35px; }
.pb-7-half { padding-bottom: 38px; }
.pb-8 { padding-bottom: 40px; }
.pb-8-half { padding-bottom: 43px; }
.pb-10 { padding-bottom: 50px; }
.pb-11 { padding-bottom: 55px; }
.pb-11-half { padding-bottom: 58px !important; }
.pb-12 { padding-bottom: 60px; }
.pb-13 { padding-bottom: 65px; }
.pb-14 { padding-bottom: 70px; }
.pb-15 { padding-bottom: 75px; }
.pb-17 { padding-bottom: 85px; }
.pb-19 { padding-bottom: 95px; }
.pb-20 { padding-bottom: 100px; }
.pb-21 { padding-bottom: 105px; }
.pb-22 { padding-bottom: 110px; }
.pb-23 { padding-bottom: 115px; }
.pb-25 { padding-bottom: 125px; }
.pb-29 { padding-bottom: 145px; }
.pb-30 { padding-bottom: 150px; }
.pb-35 { padding-bottom: 175px; }
.pb-41 { padding-bottom: 205px; }
.pb-60 { padding-bottom: 300px; }
.pl-2 { padding-left: 10px; }
.pl-3 { padding-left: 15px !important; }
.pl-4 { padding-left: 20px !important; }
.pl-6 { padding-left: 30px !important; }
.pr-3 { padding-right: 15px; }
.pr-4 { padding-right: 20px; }
.pr-5 { padding-right: 25px; }
.pr-6 { padding-right: 30px; }
.pr-7 { padding-right: 35px; }
.pr-8 { padding-right: 40px; }

/* margin-(size * 5) */
.mt-1 { margin-top: 5px; }
.mt-2-half { margin-top: 8px; }
.mt-2 { margin-top: 10px; }
.mt-3 { margin-top: 15px; }
.mt-3-half { margin-top: 17px; }
.mt-4 { margin-top: 20px; }
.mt-4-half { margin-top: 23.5px; }
.mt-5 { margin-top: 25px; }
.mt-5-half { margin-top: 27px; }
.mt-6 { margin-top: 30px; }
.mt-6-half { margin-top: 32px; }
.mt-7 { margin-top: 35px; }
.mt-7-half { margin-top: 38px; }
.mt-8 { margin-top: 40px; }
.mt-8-half { margin-top: 43px; }
.mt-9 { margin-top: 45px; }
.mt-9-half { margin-top: 48px; }
.mt-10 { margin-top: 50px; }
.mt-11 { margin-top: 55px; }
.mt-12 { margin-top: 60px; }
.mt-13 { margin-top: 65px; }
.mt-14 { margin-top: 70px; }
.mt-14-half { margin-top: 73px; }
.mt-15 { margin-top: 75px; }
.mt-16 { margin-top: 80px; }
.mt-20 { margin-top: 100px; }

.ml-2 { margin-left: 10px; }
.ml-3 { margin-left: 15px; }
.ml-3-half { margin-left: 17px; }
.ml-4 { margin-left: 20px; }
.ml-5 { margin-left: 25px; }
.ml-6 { margin-left: 30px; }

.mr-2 { margin-right: 10px; }
.mr-5 { margin-right: 15px; }
.mr-5-half { margin-right: 17px; }

.mb-1 { margin-bottom: 7px; }
.mb-2 { margin-bottom: 12px; }
.mb-3 { margin-bottom: 15px; }
.mb-3-half { margin-bottom: 18px !important; }
.mb-4 { margin-bottom: 20px !important; }
.mb-5 { margin-bottom: 25px; }
.mb-6 { margin-bottom: 30px; }
.mb-6-half { margin-bottom: 33px; }
.mb-7 { margin-bottom: 35px; }
.mb-7-half { margin-bottom: 38px; }
.mb-8 { margin-bottom: 40px; }
.mb-8-half { margin-bottom: 43px; }
.mb-9 { margin-bottom: 45px; }
.mb-10 { margin-bottom: 50px; }
.mb-11 { margin-bottom: 55px; }
.mb-12 { margin-bottom: 60px; }
.mb-13 { margin-bottom: 65px; }
.mb-13-half { margin-bottom: 68px; }
.mb-14 { margin-bottom: 70px; }
.mb-14-half { margin-bottom: 73px; }
.mb-15 { margin-bottom: 75px; }
.mb-16 { margin-bottom: 80px; }
.mb-17 { margin-bottom: 85px; }
.mb-18 { margin-bottom: 90px; }
.mb-19 { margin-bottom: 95px; }
.mb-20 { margin-bottom: 100px; }
.mb-21 { margin-bottom: 105px; }
.mb-22 { margin-bottom: 110px; }
.mb-22-half { margin-bottom: 113px; }
.mb-23 { margin-bottom: 115px; }
.mb-24 { margin-bottom: 120px; }
.mb-26 { margin-bottom: 130px; }
.mb-28 { margin-bottom: 140px; }
.mb-30 { margin-bottom: 150px; }
.mb-31 { margin-bottom: 155px; }
.mb-31-half { margin-bottom: 157px; }
.mb-32 { margin-bottom: 160px; }
.mb-33 { margin-bottom: 165px; }
.mb-34 { margin-bottom: 170px; }
.mb-35 { margin-bottom: 175px; }
.mb-40 { margin-bottom: 180px; }
.mb-41 { margin-bottom: 185px; }
.mb-44 { margin-bottom: 220px; }
.mb-45 { margin-bottom: 225px; }
.mb-50 { margin-bottom: 230px; }
.mb-55 { margin-bottom: 275px; }

.mv-4 { margin: 0 20px; }

.t-9 { top: 45px; }
.t-15 { top: 75px; }

html {
  scroll-behavior: smooth;
}
/* table 높이값   */
.scroll_h {
	height:200px;
	overflow-y:scroll;
}
.scroll_930h {
	height:600px;
	overflow-y:scroll;
}
.scroll_990h {
	height:630px;
	overflow-y:scroll;
}
.scroll_780h {
	height:450px;
	overflow-y:scroll;
}

/* html 공통 */
html, body {
  font-size: var(--font-size);
}
body {
  color: var(--font-color);
  background-color: var(--background-color);
  font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, 'Malgun Gothic', helvetica, 'Apple SD Gothic Neo', sans-serif;
  margin: 0;
}
section, div { box-sizing: border-box; }
ul { margin: 0; padding: 0; }

ul li { list-style: none; }

h2 { margin: 0; letter-spacing: -0.8px; }
h5 { margin: 0; font-weight: normal; letter-spacing: -0.8px; }
p { margin: 0; letter-spacing: -0.8px }
span { letter-spacing: -0.8px; }
a { letter-spacing: -0.8px; text-decoration: none; cursor: pointer; }
label { letter-spacing: -0.8px; color: var(--font-color) }
.underline-link { text-decoration: underline; color: var(--color-light-blue); display: block; }
button { cursor: pointer; }
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: '';
  outline: none;
  position: relative;
  display: inline-block;
}
label.kc-form-label {
  display: inline-block;
  position: relative;
}
label.kc-form-label:after {
  content: url("../img/ic-arrow-dropdown.png");
  width: 17px;
  height: 17px;
  position: absolute;
  right: 8px;
  top: 15px;
}
.dark-area label.kc-form-label:after {
  right: 14px;
}
.container {
  max-width: var(--size-body);
  margin: 0 auto;
  box-sizing: border-box;
  height: 100vh;
  position: relative;
}
.back-area.right {
  text-align: right;
}
.tab {
  margin-top: 14px;
  display: flex;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  padding: 0 12px;
  gap: 23px;
}
.tab li {
  list-style: none;
  height: 32px;
  text-align: left;
  padding: 0 2px;
}
.tab li a {
  font-size: var(--font-size--17);
  letter-spacing: -0.8px;
  color: #515357;
  line-height: 1.77;
}
.tab li.active {
  border-bottom: 2px solid var(--color-dark-navy);
}
.tab li.active a {
  color: var(--color-dark-navy) !important;
  font-weight: bold;
}
.text-ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.text-center {
  text-align: center;
}
.text-bold {
  font-weight: bold;
}

hr[bg='light'] {
  border: 1px solid var(--color-light2-grey);
}
.dp-none {
  display: none;
}
.dp-ib {
  display: inline-block !important;
}
.divider {
  width: 100%;
  height: 2px;
  background: rgba(160, 160, 160, 0.5);
}
.divider.thin {
  width: 100%;
  height: 0.5px;
  background: #d3d3d3;
}
.pd-gutter {
  padding: 0 !important;
}
.mg-gutter {
  margin: 0 !important;
}
.pr {
  position: relative;
}
[position="r"] {
  position: relative;
}
[position="ar"] {
  position: absolute;
  right: 0;
}
[position="art"] {
  position: absolute;
  right: 0;
  top: 0;
}