/*폰트불러오기*/
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'Pretendard';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'ONE-Mobile-Title';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-Title.woff') format('woff');
  font-weight: 600;
  font-style: normal;
}

/* 초기화 */
html {
  font-size: 10px;
}
body {
  margin: 0 auto;
  padding: 0;
  font-family: 'Pretendard', sans-serif;
  color: #3a3939;
  font-weight: 400;
  font-size: 1.4rem;
}
html,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
img {
  margin: 0;
  padding: 0;
  border: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

ul,
dl,
dt,
dd {
  margin: 0;
  padding: 0;
  list-style: none;
}
legend {
  position: absolute;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  text-indent: -9999em;
  overflow: hidden;
}
label,
input,
button,
select,
img {
  vertical-align: middle;
}
input,
button {
  margin: 0;
  padding: 0;
  font-family: 'Pretendard', sans-serif;
}
input {
  background-color: #fff !important;
}
input[type='submit'] {
  cursor: pointer;
}
button {
  cursor: pointer;
}
textarea,
select {
  font-family: 'Pretendard', sans-serif;
}
select {
  margin: 0;
}
p {
  margin: 0;
  padding: 0;
  word-break: keep-all;
}
hr {
  display: none;
}
a {
  color: #3b4047;
  text-decoration: none;
}
.status_a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 80%;
  max-width: 200px;
  display: inline-block;
}
a:hover {
  color: #3b4047;
  text-decoration: none;
}
.un_reboot_a {
  color: var(--main);
  text-decoration: underline;
}
*,
:after,
:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  word-break: keep-all;
}

figure {
  margin: 0;
}

img {
  max-width: 100%;
  display: block;
  height: auto;
}

.imgsize_fit img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  margin: auto;
}

:root {
  --main: #0ab28e;
  --main-hover: #09a886;
  --second: #fff;
  --second-hover: #fff;
  --second-in: #fff;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --breakpoint-xxl: 1400px;
  --max-width-sm: 540px;
  --max-width-md: 720px;
  --max-width-lg: 960px;
  --max-width-xl: 1140px;
  --max-width-xxl: 1320px;
}

.line_h1 {
  line-height: 1rem;
}
.line_h1_1 {
  line-height: 1.1em;
}
.line_h1_2 {
  line-height: 1.2em;
}
.line_h1_3 {
  line-height: 1.3em;
}
.line_h1_4 {
  line-height: 1.4em;
}
.line_h1_5 {
  line-height: 1.5em;
}
.line_h1_6 {
  line-height: 1.6em;
}
.line_h1_7 {
  line-height: 1.7em;
}
.line_h1_8 {
  line-height: 1.8em;
}
.line_h1_9 {
  line-height: 1.9em;
}
.line_h2 {
  line-height: 2em;
}

.ff_tit {
  font-family: 'ONE-Mobile-Title';
}

/*폰트커스텀 기본사이즈 10px*/
.fs_8 {
  font-size: 0.8rem;
}
.fs_9 {
  font-size: 0.9rem;
}
.fs_10 {
  font-size: 1rem;
}
.fs_11 {
  font-size: 1.1rem;
}
.fs_12 {
  font-size: 1.2rem;
}
.fs_13 {
  font-size: 1.3rem;
}
.fs_14 {
  font-size: 1.4rem;
}
.fs_15 {
  font-size: 1.5rem;
}
.fs_16 {
  font-size: 1.6rem;
}
.fs_17 {
  font-size: 1.7rem;
}
.fs_18 {
  font-size: 1.8rem !important;
}
.fs_19 {
  font-size: 1.9rem;
}
.fs_20 {
  font-size: 2rem;
}
.fs_21 {
  font-size: 2.1rem;
}
.fs_22 {
  font-size: 2.2rem;
}
.fs_23 {
  font-size: 2.3rem;
}
.fs_24 {
  font-size: 2.4rem;
}
.fs_25 {
  font-size: 2.5rem;
}
.fs_26 {
  font-size: 2.6rem;
}
.fs_27 {
  font-size: 2.7rem;
}
.fs_28 {
  font-size: 2.8rem;
}
.fs_29 {
  font-size: 2.9rem;
}
.fs_30 {
  font-size: 3rem;
}
.fs_31 {
  font-size: 3.1rem;
}
.fs_32 {
  font-size: 3.2rem;
}
.fs_33 {
  font-size: 3.3rem;
}
.fs_34 {
  font-size: 3.4rem;
}
.fs_35 {
  font-size: 3.5rem;
}
.fs_36 {
  font-size: 3.6rem;
}
.fs_37 {
  font-size: 3.7rem;
}
.fs_38 {
  font-size: 3.8rem;
}
.fs_39 {
  font-size: 3.9rem;
}
.fs_40 {
  font-size: 4rem;
}
.fs_41 {
  font-size: 4.1rem;
}
.fs_42 {
  font-size: 4.2rem;
}
.fs_43 {
  font-size: 4.3rem;
}
.fs_44 {
  font-size: 4.4rem;
}
.fs_45 {
  font-size: 4.5rem;
}
.fs_46 {
  font-size: 4.6rem;
}
.fs_47 {
  font-size: 4.7rem;
}
.fs_48 {
  font-size: 4.8rem;
}
.fs_49 {
  font-size: 4.9rem;
}
.fs_50 {
  font-size: 5rem;
}
.fs_51 {
  font-size: 5.1rem;
}
.fs_52 {
  font-size: 5.2rem;
}

.fw_100 {
  font-weight: 100;
}
.fw_200 {
  font-weight: 200;
}
.fw_300 {
  font-weight: 300;
}
.fw_400 {
  font-weight: 400;
}
.fw_500 {
  font-weight: 500;
}
.fw_600 {
  font-weight: 600;
}
.fw_700 {
  font-weight: 700 !important;
}
.fw_800 {
  font-weight: 800;
}
.fw_900 {
  font-weight: 900;
}

.fc_wh {
  color: #fff !important;
}
.fc_primary {
  color: var(--main);
}
.fc_secondary {
  color: #98a19f;
}
.fc_gr1 {
  color: #ecefee;
}
.fc_gr2 {
  color: #aebab7;
}
.fc_gr3 {
  color: #3c4a47;
}

.fc_bk {
  color: #3a3939;
}
.fc_red {
  color: #ff3e3e;
}

.bg-primary {
  background-color: var(--main) !important;
}
.bg-secondary {
  background: #98a19f;
}
.bg-transparent {
  background: transparent;
}
.bg_gr1 {
  background: #ecefee;
}
.bg_gr2 {
  background: #aebab7;
}
.bg_gr3 {
  background: #3c4a47;
}

/*border 선 커스텀*/
.border,
.border-top,
.border-bottom,
.border-left,
.border-right {
  border-color: #ecefee !important;
  border-width: 1px;
}

.border_title {
  border: 1px solid #111;
}
.border_content {
  border: 1px solid #ecefee;
}
.border_cut {
  border-bottom: 8px solid #ecefee;
}

.border-primary {
  border-color: var(--main) !important;
}

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

.cont_wr {
  max-width: 1230px;
  margin: 0 auto;
  padding: 0 15px;
  position: relative;
}
.cont_wr:after {
  content: '';
  display: block;
  clear: both;
}

.wh_pre {
  white-space: pre-line;
}
.required {
  color: var(--main) !important;
  font-size: 1.3rem;
  margin-left: 0.5rem;
  position: relative;
  top: -0.4rem;
}

.sq_guide {
  display: flex;
  flex-wrap: wrap;
}
.sq_guide li {
  width: 90px;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  margin: 0.5rem;
}

/*드롭다운버튼*/
/* .dropdown-menu{font-size:1.7rem;font-family: 'NanumSquareRound',sans-serif;} */

/*버튼커스텀*/

.btn {
  border-radius: 1.5rem;
  font-size: 1.4rem;
  padding: 1rem 1.4rem;
  font-weight: 400;
}
.btn-xs {
  font-size: 1.4rem;
  height: 3.2rem;
  line-height: 1.4rem;
  padding: 0.5rem 1.4rem;
  font-weight: 300;
}
.btn-sm {
  font-size: 1.4rem;
  height: 3.6rem;
  line-height: 1.4rem;
  padding: 1rem 2rem;
  font-weight: 300;
}
.btn-md {
  font-size: 1.4rem;
  height: 4.2rem !important;
  line-height: 1.4rem;
}
.btn-lg {
  font-size: 1.6rem;
  border-radius: 1.5rem;
  height: 5rem;
  padding: 1.35rem 1rem;
}
.btn-xl {
  font-size: 1.6rem;
  border-radius: 1.5rem;
  height: 6rem;
  padding: 1.35rem 1rem;
}
.btn-half {
  width: calc(50% - 5px);
}
.btn-rounded {
  border-radius: 3em !important;
}

.btn.focus,
.btn:focus {
  box-shadow: none !important;
}

.btn-primary {
  color: #fff !important;
  background-color: var(--main);
  border-color: var(--main);
  border-radius: 1rem;
}

.btn-primary:hover {
  color: #fff;
  background-color: var(--main-hover);
  border-color: var(--main-hover);
  outline: none;
}

.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: var(--main-hover) !important;
  border-color: var(--main-hover) !important;
  outline: none;
  /* box-shadow: 0 0 0 0.1rem var(--main-hover); */
}

.btn-primary.disabled,
.btn-primary:disabled {
  color: #e3e3e3 !important;
  background-color: #3c4a47;
  border-color: #3c4a47;
  opacity: 1;
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff !important;
  background-color: var(--main-hover) !important;
  border-color: var(--main-hover) !important;
}

a.bg-primary:focus,
a.bg-primary:hover,
button.bg-primary:focus,
button.bg-primary:hover {
  background: #129b70 !important;
}

.btn-secondary {
  color: #fff !important;
  background-color: #aebab7;
  border-color: #aebab7;
  border-radius: 1rem;
}

.btn-secondary:hover {
  color: #fff;
  background-color: #98a19f;
  border-color: #98a19f;
  outline: none;
}

.btn-secondary:focus,
.btn-secondary.focus {
  color: #fff;
  background-color: #aebab7 !important;
  border-color: #aebab7 !important;
  outline: none;
  /* box-shadow: 0 0 0 0.1rem #AEBAB7; */
}

.btn-secondary.disabled,
.btn-secondary:disabled {
  color: #e3e3e3 !important;
  background-color: #3c4a47;
  border-color: #3c4a47;
  opacity: 1;
}

.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  color: #fff !important;
  background-color: #aebab7 !important;
  border-color: #aebab7 !important;
}

.btn-outline-primary {
  color: var(--main) !important;
  background-color: #fff !important;
  border: 1px solid var(--main) !important;
  border-radius: 1.5rem;
}

.btn-outline-primary:hover {
  color: var(--main-hover) !important;
  background-color: #fff;
  border-color: var(--main-hover) !important;
}
.btn-outline-primary:focus {
  color: var(--main-hover) !important;
  background-color: #fff !important;
  border-color: var(--main-hover) !important;
}
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
  color: var(--main-hover) !important;
  background-color: #fff !important;
  border-color: var(--main-hover) !important;
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
  color: #e3e3e3 !important;
  background-color: #a2a2a2 !important;
  border-color: #a2a2a2 !important;
  opacity: 1;
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
  color: #fff !important;
  background-color: var(--main-hover) !important;
  border-color: var(--main-hover) !important;
}

.btn-outline-bk {
  color: #fff !important;
  background-color: var(--main) !important;
  border: 1px solid #fff !important;
}

.btn-outline-bk:hover {
  color: #fff !important;
  background-color: var(--main) !important;
  border: 1px solid #fff !important;
}
.btn-outline-bk:focus {
  color: #fff !important;
  background-color: var(--main) !important;
  border: 1px solid #fff !important;
}
.btn-outline-bk:not(:disabled):not(.disabled):active,
.btn-outline-bk:not(:disabled):not(.disabled).active,
.show > .btn-outline-bk.dropdown-toggle {
  color: #fff !important;
  background-color: var(--main) !important;
  border: 1px solid #fff !important;
}

.btn-outline-bk.disabled,
.btn-outline-bk:disabled {
  color: #e3e3e3 !important;
  background-color: #a2a2a2 !important;
  border-color: #a2a2a2 !important;
  opacity: 1;
}

.btn-outline-bk:not(:disabled):not(.disabled):active,
.btn-outline-bk:not(:disabled):not(.disabled).active,
.show > .btn-outline-bk.dropdown-toggle {
  color: #fff !important;
  background-color: var(--main-hover) !important;
  border-color: #fff !important;
}

.close {
  opacity: 1 !important;
}

.btn-text {
  padding: 0;
  color: #b5b5b5;
  text-decoration: underline;
  font-weight: 300;
}
.btn-text:hover {
  text-decoration: underline;
}

.a11y-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: polygon(0 0, 0 0, 0 0);
}

/*뱃지*/
.badge {
  font-size: 1.4rem;
  padding: 0.429em 0.5em;
  border-radius: 0;
  font-weight: 500;
}
.badge-primary {
  color: #7db249;
  background-color: #e6f2ff;
}

/* //////아코디언 커스텀/// */
.qna_acc {
  border-top: 1px solid #98a19f;
}
.qna_acc .card .card-header {
  margin-bottom: 0;
  background-color: #fff;
  border-bottom: 1px solid #e9e9e9;
}
.qna_acc .card-link {
  display: flex;
  align-items: center;
  font-size: 1.6rem;
}

.qna_acc .card > * {
  padding: 2rem 3rem;
  background-color: #ecefee;
}
.qna_acc .card-body {
  display: flex;
}

/*글자자르기*/
.a11y-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: polygon(0 0, 0 0, 0 0);
}
.line_text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.line2_text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; /* 여러 줄 자르기 추가 스타일 */
  white-space: normal;
  line-height: 1.4em;
  height: 2.8em;
  text-align: left;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.line3_text {
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis; /* 여러 줄 자르기 추가 스타일 */
  line-height: 1.4em;
  height: 4.2em;
  text-align: left;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.lst_st01 {
  list-style-image: url(../img/lst_st01.png);
  padding-left: 1.2rem;
}
.lst_st01 li {
  word-break: keep-all;
}

/*이미지 사이즈 조정*/

.rect {
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
}
.rect::after {
  content: '';
  display: block;
  padding-bottom: 100%;
}
.rect > img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*입력 인풋 input*/
input::placeholder {
  font-size: 1.5rem;
  color: #b5b5b5 !important;
  font-weight: 300 !important;
}
textarea::placeholder {
  font-size: 1.5rem;
  color: #b5b5b5 !important;
  font-weight: 300 !important;
  line-height: 1.4;
}

.form-control {
  padding: 1.4rem 1.5rem;
  font-size: 1.4rem;
  font-weight: 300;
  height: 5rem;
  border-color: transparent;
  color: #aebab7;
  background-color: #ecefee;
  border-radius: 1rem;
  border: 1px solid #ecefee;
}

.form-control:focus {
  border-color: #b5b5b5;
  box-shadow: none !important;
}
.form-control:disabled,
.form-control[readonly] {
  background: #fff !important;
  color: #111 !important;
  padding: 0;
  height: 1.2em;
}
.form-control:disabled,
.form-control[readonly]::placeholder {
  color: #111 !important;
}

.form-control2 {
  border: 1px solid #ecefee !important;
  background-color: #fff !important;
}

.form-read:disabled,
.form-read[readonly] {
  color: #b5b5b5 !important;
  background-color: #e6e8e8 !important;
  padding: 0;
  height: 1.2em;
  padding: 1.4rem 1.4rem;
  height: 5rem;
}

.valid-feedback {
  margin-top: 0.7rem;
  font-size: 1.4rem;
  color: #ff3e3e;
}
.invalid-feedback {
  margin-top: 0.7rem;
  font-size: 1.4rem;
  color: #ff3e3e;
}
.ip_confirm {
  background: url(../img/xi-confirm.svg) no-repeat left 2px / 15px 15px;
}
.ip_error {
  background: none no-repeat left 2px / 15px 15px;
}
.form-control.is-valid,
.was-validated .form-control:valid {
  border-color: #ecefee !important;
  background-image: none;
  box-shadow: none !important;
}
.form-control.is-invalid,
.was-validated .form-control:invalid {
  border-color: #ecefee !important;
  background-image: none;
  box-shadow: none !important;
}
.form-text {
  margin-top: 0.7rem;
  font-size: 1.4rem;
}

.form-row > .col,
.form-row > [class*='col-'] {
  padding-right: 4px;
  padding-left: 4px;
}

.input-group > .custom-select:not(:first-child),
.input-group > .form-control:not(:first-child) {
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}
.input-group:not(.has-validation) > .form-control:not(:last-child) {
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
  margin-right: 0.8rem;
  resize: none;
}
.input-group > .form-control:focus {
  box-shadow: none;
}
.input-group > .input-group-append > .btn {
  border-radius: 1rem;
  width: 9rem;
  padding-right: 0.2rem;
  padding-left: 0.2rem;
  height: 5rem;
  border: none;
}

.ip_wr {
  margin-bottom: 2rem;
}
.ip_wr:last-child {
  margin-bottom: 0;
}
.ip_wr .ip_tit {
  margin-bottom: 1rem;
}
.ip_wr .ip_tit h5 {
  font-size: 1.4rem;
  font-weight: 500;
  display: inline-block;
}
.ip_wr .ip_tit2 h5 {
  font-size: 1.6rem;
}
.ip_wr .custom-select_wr {
  width: calc(100% - 120px);
}
.ip_wr .custom-select {
  padding: 0.4rem 1.5rem;
  font-size: 1.4rem;
  height: 5rem;
  border-radius: 1rem;
  border: 1px solid #ecefee !important;
  color: #aebab7;
  background: url(../img/ico_select.svg) no-repeat center right 1.8rem;
  line-height: 1.4rem;
  background-color: #fff;
  background-size: 1.6rem !important;
}
.custom-select:focus {
  border-color: #98a19f !important;
  box-shadow: none;
}
.ip_wr textarea.form-control {
  font-size: 1.6rem;
  min-height: 78px;
  width: 100%;
}
.input_in_btn .input-group > div {
  width: 100%;
  justify-content: space-between;
  align-items: center;
}
.input_in_btn .input-group > div {
  width: 100%;
}
.input_in_btn .form-control {
  width: calc(100% - 150px);
}
.input_in_btn .btn_wr {
  width: auto;
}
.input-group-append,
.input-group-prepend {
  flex-wrap: inherit;
}

/*버튼추가*/
.btn-outline-primary.fc_bk {
  color: #3b4047 !important;
}
.btn-outline-primary.fc_bk:hover {
  background-color: #fff;
}
.calendar_input {
  position: relative !important;
}
.calendar_input::after {
  content: '';
  width: 24px;
  height: 24px;
  background: url('../img/ico_calendar.svg') no-repeat center;
  position: absolute;
  top: 5px;
  right: 8px;
  cursor: pointer;
  background-size: cover;
  z-index: 5;
}
.search_input {
  position: relative !important;
}
/* .search_input::before{content: ''; width: 10px; height: 10px; border-radius: 50%; border: 2px solid #F9A05C; margin-right: 0.8rem;position: relative; top: 50%; transform: translateY(-50%);} */
.search_input::after {
  content: '';
  width: 24px;
  height: 24px;
  background: url('../img/ico_sch.svg') no-repeat center;
  position: absolute;
  top: 9px;
  right: 15px;
  cursor: pointer;
  background-size: cover;
  z-index: 5;
}
input::-ms-clear,
input::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button,
input::-webkit-search-results-button,
input::-webkit-search-results-decoration {
  display: none;
}
.btn-myinfo {
  border: 1px solid #e3e3e3;
}

input.form-control[type='date'] {
  background: url(../img/ico_calendar.svg) no-repeat right 1.4rem center;
  background-size: 2.4rem auto;
}
input.form-control[type='date']::before {
  content: attr(data-placeholder);
  width: 100%;
  color: #a2a2a2;
  line-height: 2rem;
}
input.form-control[type='date']:focus:before,
input[type='date']:valid:before {
  display: none;
}
input.form-control[type='date']::-webkit-calendar-picker-indicator {
  opacity: 0;
  z-index: 1;
  cursor: pointer;
}

.search_input .btnClear {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin-right: 1rem;
  right: 40px;
  width: 19px;
  height: 19px;
  background: url(../img/ico_search_close.svg) center center no-repeat;
  background-size: contain;
  opacity: 1;
  border: none;
  outline: none;
  cursor: pointer;
}

.form-control_date {
  padding: 0;
  font-size: 1.7rem;
  width: 110px;
  margin: 0 auto;
  height: auto;
}
input.form-control_date[type='date'] {
  background: url(../img/select_date.svg) no-repeat right 0.5rem center !important;
  background-size: 1.8rem auto;
}

/*추천순 선택 select*/
.drop_opt .custom-select {
  padding: 1.4rem 3.5rem 1.4rem 0;
  font-size: 1.6rem;
  height: calc(1.706em + 2.5rem + 2px);
  border-radius: 0;
  border: 0;
  color: #333;
  background: url(../img/drop_opt.png) no-repeat center right 1.2rem;
}

.switch {
  position: relative;
  display: inline-block;
  width: 55px;
  height: 29px;
  vertical-align: middle;
}

/* Hide default HTML checkbox */
.switch input {
  display: none;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #f5f5f5;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: '';
  height: 21px;
  width: 21px;
  left: 4px;
  bottom: 4px;
  background-color: #cbcbcb;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

input:checked + .slider {
  background-color: #111;
}

input:checked + .slider:before {
  background-color: #fff;
}

input:focus + .slider {
  box-shadow: transparent;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

p {
  margin: 0px;
  display: block;
  font-size: 1.4rem;
  font-weight: 400;
}

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

/*페이저*/
.pagination {
  align-items: center;
}
.page-link {
  border: none;
}
.page-link:focus {
  box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 0%);
}
.page-item {
  margin: 0;
  cursor: pointer;
}
.pagination .page-link {
  padding: 0.5rem 1.1rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3a3939;
  font-size: 1.6rem;
}
.page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background-color: #0ab28e;
  border-color: #0ab28e;
  border-radius: 0.8rem;
  box-shadow: 0 3px 6px rgb(18 155 112 / 16%);
}
.page-item.arrow .page-link,
.page-item.arrow .page-link {
  border: 1px solid #e9e9e9;
  border-radius: 1rem;
}
.page-item .page-link:hover {
  background-color: transparent;
}

/*아코디언*/
.custom_acc .btn-link {
  width: 23px;
  height: 23px;
  background: url(../img/select_arrow.png) no-repeat center;
  padding: 0;
  transform: rotate(0deg);
}
.custom_acc .btn-link[aria-expanded='false'] {
  transform: rotate(0deg);
  transition: all 0.2s ease;
}
.custom_acc .btn-link[aria-expanded='true'] {
  transform: rotate(180deg);
  transition: all 0.2s ease;
}

/*체크박스*/
.checks {
  position: relative;
}
.checks input[type='checkbox'] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.checks input[type='checkbox'] + label {
  display: inline-block;
  position: relative;
  padding-left: 34px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  color: #37383a;
  margin: 0;
  color: #3b4047;
  font-weight: 400;
}
.checks input[type='checkbox'] + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: -2px;
  width: 24px;
  height: 24px;
  text-align: center;
  background: url(./../img/check_off.svg) no-repeat center;
  background-size: cover;
}
.checks input[type='checkbox'] + label:active:before,
.checks input[type='checkbox']:checked + label:active:before {
  color: #3b4047;
}
.checks input[type='checkbox']:checked + label:before {
}
.checks input[type='checkbox']:checked + label:after {
  content: '';
  position: absolute;
  left: 0;
  top: -2px;
  width: 24px;
  height: 24px;
  background: url(./../img/check_on.svg) no-repeat center;
  background-size: cover;
}

/*라디오*/
/*라디오*/
.checks {
  position: relative;
}
.checks input[type='radio'] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.checks input[type='radio'] + label {
  display: inline-block;
  position: relative;
  padding-left: 34px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  color: #3b4047;
  font-weight: 500;
  margin: 0;
  padding-top: 0px;
}
.checks input[type='radio'] + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: -2px;
  width: 24px;
  height: 24px;
  text-align: center;
  background: url(./../img/check_off.svg) no-repeat center;
  background-size: cover;
}
.checks input[type='radio'] + label:active:before,
.checks input[type='radio']:checked + label:active:before {
  color: #333;
}
.checks input[type='radio']:checked + label:before {
}
.checks input[type='radio']:checked + label:after {
  content: '';
  position: absolute;
  top: -2px;
  left: 0;
  width: 24px;
  height: 24px;
  background: url(./../img/check_on.svg) no-repeat center;
  background-size: cover;
}

.card {
  border: none;
}
.accordion > .card > .card-header {
  padding: 0;
  background: #fff;
  border: none;
}

.card-body {
  padding: 0;
}
.accordion .btn {
  padding: 0;
}
.accordion .collapsed .acc_arrow {
  transform: rotate(180deg);
}

.checks_flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

/*선택 라디오,체크박스*/
.select input[type='radio'] + label,
.select input[type='checkbox'] + label {
  background-color: #fff;
  border: 1px solid #e3e3e3 !important;
  padding: 1.6rem 1.5rem;
  border-radius: 0;
  width: 100%;
  color: #3b4047;
}
.select input[type='radio'] + label p,
.select input[type='checkbox'] + label p {
  font-size: 1.3rem;
  font-weight: 400;
  height: 3rem;
  line-height: 3rem;
}
.select input[type='radio']:checked + label,
.select input[type='checkbox']:checked + label {
  border: 1px solid var(--main) !important;
  background: #111 !important;
  color: #fff !important;
}
.select input[type='checkbox'],
input[type='radio'] {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.select .checks input[type='radio'] + label:before,
.select .checks input[type='checkbox'] + label:before {
  display: none;
}
.select .checks input[type='radio']:checked + label:after,
.select .checks input[type='checkbox']:checked + label:after {
  display: none;
}
.select {
  width: 100%;
  display: flex;
}
.select .checks {
  width: 86px;
  text-align: center;
}
.select input[type='radio'] + label {
  padding: 0;
  line-height: 3rem;
  box-shadow: none;
}
.select input[type='radio']:checked + label {
  z-index: 1;
}
.select .checks:not(:first-child),
.select .checks:not(:first-child) {
  margin-left: -1px;
}
.select .checks:not(:first-child) input[type='radio'] + label,
.select .checks:not(:first-child) input[type='checkbox'] + label {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.select .checks:not(:last-child) input[type='radio'] + label,
.select .checks:not(:last-child) input[type='checkbox'] + label {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.custom-select option {
  background: #111 !important;
  color: #fff;
}

.select option:hover {
  background: #000 !important;
}
.select option:active {
  background: #000 !important;
}
.select option {
  background: #000 !important;
}

option:checked:after {
  content: attr(title);
  background: #000 !important;
  color: #fff;
  position: absolute;
  width: 100%;
  left: 0;
  border: none;
}

select option:checked,
select option:hover {
  background: #111;
  color: #fff;
}
select option:checked,
select option:hover {
  box-shadow: 0 0 10px 100px #111 inset !important;
  color: #fff;
}

/*모달 팝업*/
.modal-content {
  border-radius: 3rem;
  box-shadow: 0 3px 20px rgb(0 0 0 / 16%);
  overflow: hidden;
}
.modal-header {
  display: block;
  padding: 5rem 5rem 3rem;
  border-bottom: none;
  text-align: center;
}
.modal-title {
  font-family: 'ONE-Mobile-Title';
  font-size: 2.6rem;
}
.modal-body {
  padding: 0 5rem 0;
}
.modal-dialog-scrollable .modal-body {
  max-height: 400px;
}
.modal-footer {
  padding: 3rem 5rem;
  border-top: none;
}

.modal .close {
  position: absolute;
  top: 2.5rem;
  right: 2.5rem;
  font-size: 2.6rem;
  padding: 0;
  margin: 0;
  z-index: 100;
}

/*너비 넓이*/
.w-5 {
  width: 5%;
}
.w-10 {
  width: 10%;
}
.w-15 {
  width: 15%;
}
.w-20 {
  width: 20%;
}
.w-30 {
  width: 30%;
}
.w-33 {
  width: 33%;
}
.w-35 {
  width: 35%;
}
.w-40 {
  width: 40%;
}
.w-45 {
  width: 45%;
}
.w-55 {
  width: 55%;
}
.w-60 {
  width: 60%;
}
.w-65 {
  width: 65%;
}
.w-70 {
  width: 70%;
}
.w-80 {
  width: 80%;
}
.w-85 {
  width: 85%;
}
.w-90 {
  width: 90%;
}
.w-95 {
  width: 95%;
}

.w-24 {
  width: 24px;
}

/*컨테이너,콜*/
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl {
  width: 100%;
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

.col,
.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-auto,
.col-lg,
.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-auto,
.col-md,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-auto,
.col-sm,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-auto,
.col-xl,
.col-xl-1,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: 0;
  padding-left: 0;
}

.container-pl {
  padding-left: 2rem;
}

.mb-4,
.my-4 {
  margin-bottom: 2rem !important;
}

.content_popup {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 576px;
  overflow-y: scroll;
  height: 100vh;
}

@media (min-width: 1199.98px) {
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl {
    max-width: 100%;
  }
}

/*반응형 max 1200 xl*/
@media (max-width: 1199.98px) {
}

/*반응형 max 992px lg*/
@media (max-width: 991.98px) {
  .input-group > .input-group-append > .btn {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .ip_wr .custom-select_wr {
    width: calc(100% - 120px);
  }
  .ip_wr .custom-select {
    background-size: 13px;
  }
  .m_mx_0 {
    margin-left: -15px;
    margin-right: -15px;
  }
  .m_half .btn {
    width: 49%;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
  }
}

/*반응형 max 767px md*/
@media (max-width: 767.98px) {
}

/*반응형 max 576px sm*/
@media (max-width: 575.98px) {
  .modal-body {
    padding: 0 4rem 0;
  }
  .modal-footer {
    padding: 3rem 4rem;
  }
}

/*반응형 max 380px*/
@media (max-width: 380px) {
  .container-xl {
    padding: 0 1.8rem;
  }
  input::placeholder {
    font-size: 1.4rem;
  }
  textarea::placeholder {
    font-size: 1.4rem;
    line-height: 1.3;
  }
  .input-group > .input-group-append > .btn {
    padding-left: 0.2rem;
    padding-right: 0.2rem;
  }
  .btn {
    font-size: 1.4rem;
  }
  .btn-lg {
    font-size: 1.6rem;
    height: 4.8rem;
    padding: 1.3rem 1rem;
  }
  .btn-md {
    height: 4.2rem !important;
    line-height: 2rem;
    font-size: 1.4rem;
  }
  .btn-sm {
    font-size: 1.4rem;
    height: 4rem;
    line-height: 1.5rem;
  }
  .form-control {
    height: 4.4rem;
    font-size: 1.4rem;
    padding: 1.4rem 1rem;
  }
  .form-control_date {
    height: auto;
    padding: 0;
  }

  .date_calendar .month .on_right::after {
    left: -25% !important;
  }
}
