@charset "UTF-8";
/*-------------------------------------------------
title       : 초기화
Author      : 한결정보기술(주)
Amender     : 한결정보기술(주) 기술연구소
Create date : 2023-08-24
-------------------------------------------------*/
*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 400;
    src: local('Noto Sans Regular'), local('NotoSans-Regular'),
    url('../css/font/NotoSansKR-Regular-Hestia.eot'),
    url('../css/font/NotoSansKR-Regular-Hestia.eot?#iefix') format('embedded-opentype'),
    url('../css/font/NotoSansKR-Regular-Hestia.woff') format('woff'),
    url('../css/font/NotoSansKR-Regular-Hestia.otf') format('opentype');
}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 500;
    src: local('Noto Sans Medium'), local('NotoSans-Medium'),
    url('../css/font/NotoSansKR-Medium-Hestia.eot'),
    url('../css/font/NotoSansKR-Medium-Hestia.eot?#iefix') format('embedded-opentype'),
    url('../css/font/NotoSansKR-Medium-Hestia.woff') format('woff'),
    url('../css/font/NotoSansKR-Medium-Hestia.otf') format('opentype');
}

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 700;
    src: local('Noto Sans Bold'), local('NotoSans-Bold'),
    url('../css/font/NotoSansKR-Bold-Hestia.eot'),
    url('../css/font/NotoSansKR-Bold-Hestia.eot?#iefix') format('embedded-opentype'),
    url('../css/font/NotoSansKR-Bold-Hestia.woff') format('woff'),
    url('../css/font/NotoSansKR-Bold-Hestia.otf') format('opentype');
}
@font-face {
    font-family: 'GmarketSans';
    font-weight: 300;
    font-style: normal;
    src: url('../css/font/GmarketSansLight.eot');
    src: url('../css/font/GmarketSansLight.eot?#iefix') format('embedded-opentype'),
    url('../css/font/GmarketSansLight.woff2') format('woff2'),
    url('../css/font/GmarketSansLight.woff') format('woff'),
    url('../css/font/GmarketSansLight.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'GmarketSans';
    font-weight: 500;
    font-style: normal;
    src: url('../css/font/GmarketSansMedium.eot');
    src: url('../css/font/GmarketSansMedium.eot?#iefix') format('embedded-opentype'),
    url('../css/font/GmarketSansMedium.woff2') format('woff2'),
    url('../css/font/GmarketSansMedium.woff') format('woff'),
    url('../css/font/GmarketSansMedium.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'GmarketSans';
    font-weight: 700;
    font-style: normal;
    src: url('../css/font/GmarketSansBold.eot');
    src: url('../css/font/GmarketSansBold.eot?#iefix') format('embedded-opentype'),
    url('../css/font/GmarketSansBold.woff2') format('woff2'),
    url('../css/font/GmarketSansBold.woff') format('woff'),
    url('../css/font/GmarketSansBold.ttf') format("truetype");
    font-display: swap;
}
html {
  overflow: hidden;
  overflow-y: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 10px;
}

body {
  color: #484e66;
  font-family: 'Noto Sans KR', 'Malgun Gothic', 'Dotum', sans-serif;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 1.35;
  margin: 0;
  padding: 0;
  letter-spacing: -0.02em;
  word-break: keep-all;
}

header,
footer,
main,
section,
article,
nav,
aside {
  display: block;
}

ul,
ol,
li,
dl,
dt,
dd {
  margin: 0;
  padding: 0;
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
form,
figure,
figcaption {
  margin: 0;
  padding: 0;
}

fieldset,
hr {
  display: block;
  margin: 0;
  padding: 0;
  border: 0 none;
}

input,
select {
  max-width: 100%;
  vertical-align: middle;
}

input,
select,
button,
textarea,
optgroup {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  outline: none !important
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

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

address,
em,
i {
  font-style: normal;
}

strong {
  font-weight: 600;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  padding: 0;
  border: 0 none;
  background: none;
  cursor: pointer;
}

input[type="submit"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

img {
  max-width: 100%;
  /*max-height: 160px;*/
  border: 0 none;
  font-size: 0;
  vertical-align: middle;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th {
  font-weight: 600;
}

caption,
legend,
.sr-only,
.blind,
.IR {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0 none;
  clip: rect(0, 0, 0, 0);
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #929292;
  font-style: normal !important;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #929292;
  font-style: normal !important;
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: #929292;
  font-style: normal !important;
}

input::placeholder,
textarea::placeholder {
  color: #929292;
  font-style: normal !important;
}

input {;
}

.bx-wrapper .bx-loading {
  display: none;
}

.bx-wrapper .bx-viewport {
  -webkit-box-shadow: 0 0 0 transparent;
  box-shadow: 0 0 0 transparent;
}

#skip_nav {
  position: absolute;
  left: 0;
  top: -1000px;
  width: 100%;
  height: 0px;
  z-index: 1000;
  line-height: 0px;
  font-size: 0px;
}

#skip_nav a {
  display: block;
  text-align: center;
  width: 100%;
  line-height: 0px;
  font-size: 0px;
}

#skip_nav a:focus,
#skip_nav a:hover,
#skip_nav a:active {
  position: absolute;
  left: 0px;
  top: 1000px;
  padding: 0.8rem 0;
  display: block;
  height: 4.5rem;
  background: #20262c;
  font-size: 2rem;
  font-weight: bold;
  line-height: 3rem;
  color: #fff;
}

.txt_left {
  text-align: left !important;
}

.txt_center {
  text-align: center !important;
}

.txt_right {
  text-align: right !important;
}

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

.checks {
    display: flex;
    flex-wrap: wrap;
}

.checks-column {
    flex-direction: column;
}

.checks .checkbox,
.checks .radio {
    margin-right: 2.4rem;
    margin-top: 0 !important;
    padding: .5rem 0;
}

.checkbox {
  display: inline-flex;
  position: relative;
  align-items: center;
  text-align: left;
}

.checkbox.relative {
    display: block;
}

.checkbox.relative label {
    padding-left: 0;
}

.checkbox.relative label::before{
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        margin: 0 auto;
}

.checkbox.relative label::after {
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}

* + .checkbox {
    margin-top: 2.5rem;
}

.checkbox input[type='checkbox'] {
  position: absolute;
  width: auto !important;
  height: auto !important;
  left: 0;
  top: 0;
  opacity: 0;
  outline: none;
  visibility: hidden;
}

.checkbox input:checked + label::after {
    opacity: 1;
    visibility: visible;
    margin-top: -2px;
}

.checkbox label::before, .checkbox label::after {
  position: absolute;
  top: 0.4rem;
  left: 0;
  display: block;
  content: "";
  outline: none;
  border-radius: .3rem;
  width: 2rem;
  height: 2rem;
}

.checkbox label {
  position: relative;
  display: block;
  padding-left: 2.6rem;
  cursor: pointer;
}

.checkbox label::before {
    border: 1px solid #a3a6b2;
    background: #fff;
    z-index: 0;
    margin-top: -2px;
}

.checkbox label::after {
  z-index: 1;
  background: #3E3E3E;
  opacity: 0;
  visibility: hidden;
  font-family: 'remixicon';
  color: #fff;
  font-size: 1.6rem;
  content: "\eb7b";
  text-align: center;
}

.checkbox label span {
  display: block;
}

.checkbox .input {
    margin-left: 2.4rem;
    max-width: 20rem;
}

* + .radio {
    margin-top: 2.5rem;
}

.radio {
    display: inline-flex;
    position: relative;
    align-items: center;
    text-align: left;
  }

.radio input[type='radio'] {
    position: absolute;
    width: auto !important;
    height: auto !important;
    left: 0;
    top: 0;
    opacity: 0;
    outline: none;
    visibility: hidden;
}

.radio input:checked + label::after {
    opacity: 1;
    visibility: visible;
  }

.radio label::before, .radio label::after {
    position: absolute;
    top: .2rem;
    left: 0;
    display: block;
    content: "";
    outline: none;
    border-radius: 50%;
  }

.radio label {
    position: relative;
    display: block;
    padding-left: 2.6rem;
    cursor: pointer;
}

.radio label::before {
    width: 2rem;
    height: 2rem;
    border: 1px solid #DDD;
    z-index: 0;
    background: #fff;
  }

.radio label::after {
    width: .8rem;
    height: .8rem;
    position: absolute;
    top: .8rem;
    left: .6rem;
    z-index: 1;
    background: #3E3E3E;
    opacity: 0;
    visibility: hidden;
  }

.radio label span {
    display: block;
    font-size: 1.8rem;
}

.radio .input {
    margin-left: 2.4rem;
    max-width: 19.5rem !important;
}

.select {
  position: relative;
  width: 26.8rem;
}

.select select {
  background-color: transparent;
  -webkit-appearance: none;
  position: relative;
  z-index: 1;
  font-size: 1.6rem;
  font-weight: 300;
  border: 1px solid #a3a6b2;
  padding: 0 1rem;
  width: 100%;
  height: 4.6rem;
  color: #484e66;
}

.select::after {
  content: url("../images/contents/select-arrow.svg");
  position: absolute;
  right: 1rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 1.8rem;
}

.filebox {
  display: flex;
  align-items: center;
  height: 3.8rem;
}

.filebox > * + * {
    margin-left: .4rem;
}

.filebox .input {
  height: 100% !important;
  margin-right: 0 !important;
}

.filebox .upload-name {
  height: 100%;
  color: #999;
}

.filebox label {
  height: 100% !important;
  padding: 0 1.5rem;
  font-size: 1.5rem;
  line-height: calc(3.8rem - 2px);
  color: #fff;
  cursor: pointer;
  height: 100%;
  background: #6E7385;
  flex-shrink: 0;
  border-radius: .3rem;
  display: flex;
  align-items: center;
}

.filebox label i  {
    margin-left: .5rem;
}

.filebox input[type="file"] {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  visibility: hidden;
  border: 0;
  opacity: 0;
}

html .ui-widget {
    font-size: inherit;
}
/*
html .ui-datepicker .ui-datepicker-prev,
html .ui-datepicker .ui-datepicker-next {
    width: 2.2em;
    height: 2.2em;
    top: 0;
}

html .ui-datepicker .ui-datepicker-prev::after,
html .ui-datepicker .ui-datepicker-next::after {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-family: 'remixicon';
}

html .ui-datepicker .ui-datepicker-prev::after {
    content: "\ea64";
}

html .ui-datepicker .ui-datepicker-next::after {
    content: "\ea6e";
} */


.plani-modal {
    border: 5.6rem solid #fff;
    position: fixed !important;
    top: 50% !important;
    transform: translateY(-50%);
  }
  .plani-modal .modal-title {
    color: #333;
    font-size: 2.5rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    height: auto;
    border-bottom: none;
    padding: 0;
  }
  .plani-modal .modal-title::before {
    display: block;
    font-family: "remixicon";
    content: "\ec7f";
    color: #333;
    font-size: 2.4rem;
    font-weight: 400;
    display: inline-block;
    margin-right: 0.8rem;
  }
  .plani-modal .modal-layer {
    padding-left: 0;
    padding-right: 0;
  }
  .plani-modal .modal-panel-close {
    top: -5.6rem;
    right: -5.6rem;
}
.plani-modal .modal-panel-close .close-button {
      border-top-right-radius: 5px;
    width: 5.6rem;
    height: 5.6rem;
    background: #262A37;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .plani-modal .modal-panel-close .close-button i.bg-radius {
    border-radius: 0;
    background: transparent;
    width: auto;
    height: auto;
  }

  .plani-modal .modal-panel-close .close-button i.bg-radius::before {
    display: none;
  }

  .plani-modal .modal-panel-close .close-button i.bg-radius::after {
    display: block;
    content: "\eb98";
    font-family: 'remixicon';
    color: #fff;
    font-size: 2.4rem;
  }

  .modal-layer {
    padding-left: 0;
    padding-right: 0;
    overflow: visible;
  }
  .modal-layer .textarea {
    padding-bottom: 3.2rem;
    height: 20rem;
    position: relative;
    border: 1px solid #ddd;
  }
  .modal-layer .textarea textarea {
    width: 100%;
    height: 100%;
    border: none;
    resize: none;
    padding: 15px;
    font-size: 16px;
  }
  .modal-layer .textarea-count {
    position: absolute;
    right: 2rem;
    bottom: 1.1rem;
    color: #aaa;
    letter-spacing: -0.03em;
    font-weight: 300;
  }
  .modal-layer .textarea-count strong {
    color: #555;
    font-weight: 400;
  }
  .modal-layer .label-button button {
    height: 5.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.25;
    border-radius: .5rem;
    margin-left: auto;
  }
  .modal-layer .label-button button span {
    padding-left: 0;
    font-size: 1.6rem;
    font-weight: 500;
    color: #fff;
  }
  .modal-layer .label-button button span::after {
    display: none;
  }
  .modal-layer .label-button button.blue {
    background: #203A91;
    border: none;
    min-width: 7.6rem;
  }

@media print {
    .scroll-area {
        max-height: none !important;
    }
}
.flex-wrap-w {
    flex-wrap: wrap !important;
}
.justify-content-c {
    justify-content : center !important
}

[role=button], [role=tab] {
    cursor: pointer;
}

.ml5 { margin-left:5px }
.ml10 { margin-left:10px }
.ml25 { margin-left:25px }
.ml35 { margin-left:35px }
.mt0 {margin-top: 0 !important}
.mt5 { margin-top:5px }
.mt10 { margin-top:10px }
.mt20 { margin-top:20px }
.mt30 { margin-top:30px }
.mt40 { margin-top:40px; }
.mb10 { margin-bottom:10px }
.mb30 { margin-bottom:30px }
.mr5 { margin-right:5px; }
.mr10 { margin-right:10px; }
.mr15 { margin-right:15px; }
.mr20 { margin-right:20px; }
.mr25 { margin-right:25px; }

.pl30 { padding-left:30px}
.pl50 { padding-left:50px}
.pr30 { padding-right:30px}
.pr50 { padding-right:50px}
.pt10 { padding-top:10px}
.pt50 { padding-top:50px }
.pt100 { padding-top:100px }
.pb100 { padding-bottom:100px; }


.ellipsis01 { overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1;  -webkit-box-orient: vertical;  word-break: break-all;}
.ellipsis02 {overflow: hidden;white-space: normal;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;
    word-break: break-all;}

/* slick slder */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;   -webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.slick-list {position: relative; display: block;overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus{  outline: none;}
.slick-list.dragging{ cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
.slick-track { position: relative; top: 0;  left: 0; display: block; margin-left: auto; margin-right: auto; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after {  clear: both; }
.slick-loading .slick-track{visibility: hidden;}
.slick-slide{ display: none;float: left;/* height: 100%;*/ min-height: 1px;}
[dir='rtl'] .slick-slide {  float: right;}
.slick-slide img {
    display: inline-block;
    margin: 0 auto;
}
.slick-slide.slick-loading img{ display: none;}
.slick-slide.dragging img{ pointer-events: none;}
.slick-initialized .slick-slide { display: block;}
.slick-loading .slick-slide{ visibility: hidden;}
.slick-vertical .slick-slide{ display: block;height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden {  display: none;}