@charset "UTF-8";
/************************************************************************************/
/*************************************** Form ***************************************/
/************************************************************************************/
/* absolute-center */
/* transition */
/* font-size */
:root {
  --border-radius: 20px;
  --border-radius-s: 10px;
  --gap: 32px;
}
@media (max-width: 1280px) {
  :root {
    --border-radius: 12px;
    --border-radius-s: 8px;
    --gap: 24px;
  }
}
@media (max-width: 767px) {
  :root {
    --border-radius: 8px;
    --border-radius-s: 6px;
    --gap: 16px;
  }
}

/* disabled */
*:disabled {
  opacity: 1;
  cursor: default;
  background-color: var(--gray-100);
}

div:has(> input:disabled) label,
div:has(> select:disabled) label,
div:has(> testarea:disabled) label {
  opacity: 1;
  cursor: default;
}

/* 주소입력창 */
.adderss-wrap > input {
  border-radius: 10px 0 0 10px;
}
.adderss-wrap > button {
  color: var(--white);
  border-radius: 0 10px 10px 0;
  background: var(--point-color);
  padding: 0 2rem;
}

input,
textarea,
select {
  width: 100%;
  border: 1px solid var(--border-color);
  padding: var(--input-padding-height) var(--input-padding-width);
}

select {
  background: #fff url(/images/common/arw_select.svg) no-repeat center right 1.1em/24px 24px;
}

textarea {
  padding: 1em;
  border-radius: var(--border-radius-s);
}
textarea.no-resize {
  resize: none;
}

.select-wrap {
  position: relative;
}
.select-wrap input {
  background: url("/images/management/common/arrow_down.png") no-repeat 1em center;
  cursor: pointer;
}
.select-wrap .select-option {
  width: 100%;
  background: var(--white);
  position: absolute;
  z-index: 50;
  display: none;
}
.select-wrap .select-option a {
  display: block;
}

input::placeholder,
select::placeholder,
textarea::placeholder {
  color: var(--gray-500);
}
input.error,
select.error,
textarea.error {
  border-color: var(--bs-danger) !important;
}
input.valid,
select.valid,
textarea.valid {
  border-color: var(--bs-success) !important;
}
input.error ~ label.error,
select.error ~ label.error,
textarea.error ~ label.error {
  position: absolute;
  width: auto;
  top: 100%;
  z-index: 5;
  display: block !important;
  max-width: 100%;
  padding: 0.25rem 0.5rem;
  margin-top: 0.1rem;
  font-size: 1.4rem !important;
  color: #fff;
  background-color: var(--bs-danger);
  border-radius: var(--bs-border-radius);
}

.col-ect {
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
}
.col-ect .col-cont {
  width: calc(50% - 0.5em);
}
.col-ect .col-cont .cont {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.col-ect .col-cont .cont input {
  max-width: 318px;
}
.col-ect.col-add, .col-ect.col-cal {
  flex-wrap: nowrap;
}
.col-ect.col-add .col-cont, .col-ect.col-cal .col-cont {
  width: auto;
}
.col-ect.col-add .col-cont .cont, .col-ect.col-cal .col-cont .cont {
  flex-wrap: nowrap;
}
@media (max-width: 480px) {
  .col-ect .col-cont {
    flex: 1;
  }
  .col-ect.col-add, .col-ect.col-cal {
    flex-wrap: wrap;
  }
  .col-ect.col-add .col-cont, .col-ect.col-cal .col-cont {
    width: auto;
  }
  .col-ect.col-add .col-cont .cont, .col-ect.col-cal .col-cont .cont {
    flex-wrap: wrap;
  }
}

.col-radio {
  margin-block: 0.8em 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1em 0;
}

.col-wrap .col-ect,
.col-wrap .col {
  margin-bottom: 2em;
}

/* common */
html {
  font-size: 62.5%;
}

body {
  font-family: "Pretendard", sans-serif;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.025em;
  word-break: keep-all;
  color: var(--text-color);
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  body {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  body {
    font-size: 1.4rem;
  }
}
body a {
  color: var(--black);
  text-decoration: none;
}
body a:hover {
  text-decoration: none;
}
body a.default {
  color: #0e6ffc;
  text-decoration: underline;
}
body a.default:hover {
  text-decoration: none;
}
body:has(#modal.show) {
  overflow: hidden;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.4;
  color: var(--black);
}

a, input, button, select {
  outline-offset: 2px;
  outline-color: var(--black);
}

input,
select,
.input-group > .form-control {
  min-width: 120px;
  min-height: 40px;
  padding: 0.6em 1em;
  border: 1px solid var(--brd-c1);
  border-radius: var(--border-radius-s);
}
@media (max-width: 1280px) {
  input,
  select,
  .input-group > .form-control {
    min-height: 48px;
  }
}
@media (max-width: 767px) {
  input,
  select,
  .input-group > .form-control {
    padding-block: 0.6em;
    min-height: 42px;
  }
}

button {
  padding: 0.6em 1.25em;
  border-radius: var(--border-radius-s);
}
select {
  background: var(--white) url(/images/beis/common/arw_select.svg) no-repeat center right 1.25em/12px 8px;
}

/* table */
table {
  width: 100%;
}

/* loading */
.loading {
  width: 100%;
  height: 100%;
  font-size: 0.85em;
  text-align: center;
  background: rgba(255, 255, 255, 0.7);
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  display: none;
}
.loading.show {
  display: flex !important;
}

/* ----------------------------------------
* common
* ----------------------------------------*/
/* tab */
.tab-com {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 3.75em;
}
.tab-com li a {
  min-width: 180px;
  min-height: 52px;
  padding: 0.8em 1.25em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius-s);
  background-color: var(--gray-200);
  font-size: 1.7rem;
}
@media (max-width: 1280px) {
  .tab-com li a {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .tab-com li a {
    font-size: 1.4rem;
  }
}
.tab-com li.active a {
  background-color: var(--secondary1);
  color: var(--white);
}
@media (max-width: 1280px) {
  .tab-com {
    gap: 8px;
  }
  .tab-com li a {
    min-width: 128px;
    min-height: 48px;
  }
}
@media (max-width: 767px) {
  .tab-com {
    gap: 6px;
  }
  .tab-com li a {
    min-width: 100px;
    min-height: 42px;
  }
}

/* margin-bottom-common */
.mb-20 {
  margin-bottom: 1.25em !important; /* 40px */
}
@media (max-width: 767px) {
  .mb-20 {
    margin-bottom: 1em !important;
  }
}

.mb-40 {
  margin-bottom: 2.5em !important; /* 40px */
}
@media (max-width: 767px) {
  .mb-40 {
    margin-bottom: 2em !important;
  }
}

.mb-60 {
  margin-bottom: 3.875em !important; /* 60px */
}
@media (max-width: 767px) {
  .mb-60 {
    margin-bottom: 2.4em !important;
  }
}

.mb-80 {
  margin-bottom: 5em !important; /* 80px */
}
@media (max-width: 767px) {
  .mb-80 {
    margin-bottom: 3em !important;
  }
}

/* common */
.h-sty01 {
  margin-bottom: 0.6em;
  font-weight: 500;
  font-size: 2.6rem;
}
@media (max-width: 1280px) {
  .h-sty01 {
    font-size: 2.2rem;
  }
}
@media (max-width: 768px) {
  .h-sty01 {
    font-size: 2rem;
  }
}

.h-sty02 {
  margin-bottom: 0.6em;
  font-weight: 500;
  font-size: 1.1em;
}

.h-sty02-1 {
  margin-bottom: 0.6em;
  font-weight: 500;
  font-size: 1.3em;
}

.h-sty03 {
  margin-bottom: 0.6em;
  font-weight: 500;
  font-size: 1.8rem;
}
@media (max-width: 1280px) {
  .h-sty03 {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .h-sty03 {
    font-size: 1.5rem;
  }
}

.h-sty-line {
  text-decoration: underline;
  text-underline-offset: 6px;
}

.h-sty-required {
  display: flex;
  align-items: flex-end;
}
.h-sty-required .required {
  color: var(--gray-500);
}
.h-sty-required span {
  margin-left: 0.5em;
  margin-bottom: 3px;
  font-weight: 400;
  font-size: 1.4rem;
}
@media (max-width: 1280px) {
  .h-sty-required span {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .h-sty-required span {
    font-size: 1.2rem;
  }
}

.h-sty-label {
  display: block;
  margin-bottom: 0.5em;
  font-weight: 500;
  font-size: 1.8rem;
}
@media (max-width: 1280px) {
  .h-sty-label {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .h-sty-label {
    font-size: 1.5rem;
  }
}

.h-sty-member {
  margin-bottom: 0.2em;
}

.box-cont {
  padding: 1.25em;
  background-color: var(--gray-100);
  border-radius: 10px;
}
@media (max-width: 767px) {
  .box-cont {
    padding: 1.6em 2em;
  }
}

.box-cont-large {
  line-height: 1.6;
  padding: 1.5em 2em;
  background-color: var(--gray-100);
  border-radius: 10px;
}
@media (max-width: 480px) {
  .box-cont-large {
    padding: 1.2em 1.4em;
  }
}

/* text */
.ta-left {
  text-align: left;
}

.ta-center {
  text-align: center;
}

.t-pri {
  color: var(--primary);
}

.t-secon1 {
  color: var(--secondary1);
}

.t-secon2 {
  color: var(--secondary2);
}

.t-gray {
  color: var(--gray-500);
}

.t-red {
  color: var(--c-red);
}

.fs-16 {
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  .fs-16 {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .fs-16 {
    font-size: 1.4rem;
  }
}

.fs-18 {
  font-size: 1.8rem;
}
@media (max-width: 1280px) {
  .fs-18 {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .fs-18 {
    font-size: 1.5rem;
  }
}

.fw-400 {
  font-weight: 400;
}

.fw-401 {
  font-weight: 401;
}

.fw-402 {
  font-weight: 402;
}

.fw-403 {
  font-weight: 403;
}

.fw-404 {
  font-weight: 404;
}

.fw-405 {
  font-weight: 405;
}

.fw-406 {
  font-weight: 406;
}

.fw-407 {
  font-weight: 407;
}

.fw-408 {
  font-weight: 408;
}

.fw-409 {
  font-weight: 409;
}

.fw-410 {
  font-weight: 410;
}

.fw-411 {
  font-weight: 411;
}

.fw-412 {
  font-weight: 412;
}

.fw-413 {
  font-weight: 413;
}

.fw-414 {
  font-weight: 414;
}

.fw-415 {
  font-weight: 415;
}

.fw-416 {
  font-weight: 416;
}

.fw-417 {
  font-weight: 417;
}

.fw-418 {
  font-weight: 418;
}

.fw-419 {
  font-weight: 419;
}

.fw-420 {
  font-weight: 420;
}

.fw-421 {
  font-weight: 421;
}

.fw-422 {
  font-weight: 422;
}

.fw-423 {
  font-weight: 423;
}

.fw-424 {
  font-weight: 424;
}

.fw-425 {
  font-weight: 425;
}

.fw-426 {
  font-weight: 426;
}

.fw-427 {
  font-weight: 427;
}

.fw-428 {
  font-weight: 428;
}

.fw-429 {
  font-weight: 429;
}

.fw-430 {
  font-weight: 430;
}

.fw-431 {
  font-weight: 431;
}

.fw-432 {
  font-weight: 432;
}

.fw-433 {
  font-weight: 433;
}

.fw-434 {
  font-weight: 434;
}

.fw-435 {
  font-weight: 435;
}

.fw-436 {
  font-weight: 436;
}

.fw-437 {
  font-weight: 437;
}

.fw-438 {
  font-weight: 438;
}

.fw-439 {
  font-weight: 439;
}

.fw-440 {
  font-weight: 440;
}

.fw-441 {
  font-weight: 441;
}

.fw-442 {
  font-weight: 442;
}

.fw-443 {
  font-weight: 443;
}

.fw-444 {
  font-weight: 444;
}

.fw-445 {
  font-weight: 445;
}

.fw-446 {
  font-weight: 446;
}

.fw-447 {
  font-weight: 447;
}

.fw-448 {
  font-weight: 448;
}

.fw-449 {
  font-weight: 449;
}

.fw-450 {
  font-weight: 450;
}

.fw-451 {
  font-weight: 451;
}

.fw-452 {
  font-weight: 452;
}

.fw-453 {
  font-weight: 453;
}

.fw-454 {
  font-weight: 454;
}

.fw-455 {
  font-weight: 455;
}

.fw-456 {
  font-weight: 456;
}

.fw-457 {
  font-weight: 457;
}

.fw-458 {
  font-weight: 458;
}

.fw-459 {
  font-weight: 459;
}

.fw-460 {
  font-weight: 460;
}

.fw-461 {
  font-weight: 461;
}

.fw-462 {
  font-weight: 462;
}

.fw-463 {
  font-weight: 463;
}

.fw-464 {
  font-weight: 464;
}

.fw-465 {
  font-weight: 465;
}

.fw-466 {
  font-weight: 466;
}

.fw-467 {
  font-weight: 467;
}

.fw-468 {
  font-weight: 468;
}

.fw-469 {
  font-weight: 469;
}

.fw-470 {
  font-weight: 470;
}

.fw-471 {
  font-weight: 471;
}

.fw-472 {
  font-weight: 472;
}

.fw-473 {
  font-weight: 473;
}

.fw-474 {
  font-weight: 474;
}

.fw-475 {
  font-weight: 475;
}

.fw-476 {
  font-weight: 476;
}

.fw-477 {
  font-weight: 477;
}

.fw-478 {
  font-weight: 478;
}

.fw-479 {
  font-weight: 479;
}

.fw-480 {
  font-weight: 480;
}

.fw-481 {
  font-weight: 481;
}

.fw-482 {
  font-weight: 482;
}

.fw-483 {
  font-weight: 483;
}

.fw-484 {
  font-weight: 484;
}

.fw-485 {
  font-weight: 485;
}

.fw-486 {
  font-weight: 486;
}

.fw-487 {
  font-weight: 487;
}

.fw-488 {
  font-weight: 488;
}

.fw-489 {
  font-weight: 489;
}

.fw-490 {
  font-weight: 490;
}

.fw-491 {
  font-weight: 491;
}

.fw-492 {
  font-weight: 492;
}

.fw-493 {
  font-weight: 493;
}

.fw-494 {
  font-weight: 494;
}

.fw-495 {
  font-weight: 495;
}

.fw-496 {
  font-weight: 496;
}

.fw-497 {
  font-weight: 497;
}

.fw-498 {
  font-weight: 498;
}

.fw-499 {
  font-weight: 499;
}

.fw-500 {
  font-weight: 500;
}

.fw-501 {
  font-weight: 501;
}

.fw-502 {
  font-weight: 502;
}

.fw-503 {
  font-weight: 503;
}

.fw-504 {
  font-weight: 504;
}

.fw-505 {
  font-weight: 505;
}

.fw-506 {
  font-weight: 506;
}

.fw-507 {
  font-weight: 507;
}

.fw-508 {
  font-weight: 508;
}

.fw-509 {
  font-weight: 509;
}

.fw-510 {
  font-weight: 510;
}

.fw-511 {
  font-weight: 511;
}

.fw-512 {
  font-weight: 512;
}

.fw-513 {
  font-weight: 513;
}

.fw-514 {
  font-weight: 514;
}

.fw-515 {
  font-weight: 515;
}

.fw-516 {
  font-weight: 516;
}

.fw-517 {
  font-weight: 517;
}

.fw-518 {
  font-weight: 518;
}

.fw-519 {
  font-weight: 519;
}

.fw-520 {
  font-weight: 520;
}

.fw-521 {
  font-weight: 521;
}

.fw-522 {
  font-weight: 522;
}

.fw-523 {
  font-weight: 523;
}

.fw-524 {
  font-weight: 524;
}

.fw-525 {
  font-weight: 525;
}

.fw-526 {
  font-weight: 526;
}

.fw-527 {
  font-weight: 527;
}

.fw-528 {
  font-weight: 528;
}

.fw-529 {
  font-weight: 529;
}

.fw-530 {
  font-weight: 530;
}

.fw-531 {
  font-weight: 531;
}

.fw-532 {
  font-weight: 532;
}

.fw-533 {
  font-weight: 533;
}

.fw-534 {
  font-weight: 534;
}

.fw-535 {
  font-weight: 535;
}

.fw-536 {
  font-weight: 536;
}

.fw-537 {
  font-weight: 537;
}

.fw-538 {
  font-weight: 538;
}

.fw-539 {
  font-weight: 539;
}

.fw-540 {
  font-weight: 540;
}

.fw-541 {
  font-weight: 541;
}

.fw-542 {
  font-weight: 542;
}

.fw-543 {
  font-weight: 543;
}

.fw-544 {
  font-weight: 544;
}

.fw-545 {
  font-weight: 545;
}

.fw-546 {
  font-weight: 546;
}

.fw-547 {
  font-weight: 547;
}

.fw-548 {
  font-weight: 548;
}

.fw-549 {
  font-weight: 549;
}

.fw-550 {
  font-weight: 550;
}

.fw-551 {
  font-weight: 551;
}

.fw-552 {
  font-weight: 552;
}

.fw-553 {
  font-weight: 553;
}

.fw-554 {
  font-weight: 554;
}

.fw-555 {
  font-weight: 555;
}

.fw-556 {
  font-weight: 556;
}

.fw-557 {
  font-weight: 557;
}

.fw-558 {
  font-weight: 558;
}

.fw-559 {
  font-weight: 559;
}

.fw-560 {
  font-weight: 560;
}

.fw-561 {
  font-weight: 561;
}

.fw-562 {
  font-weight: 562;
}

.fw-563 {
  font-weight: 563;
}

.fw-564 {
  font-weight: 564;
}

.fw-565 {
  font-weight: 565;
}

.fw-566 {
  font-weight: 566;
}

.fw-567 {
  font-weight: 567;
}

.fw-568 {
  font-weight: 568;
}

.fw-569 {
  font-weight: 569;
}

.fw-570 {
  font-weight: 570;
}

.fw-571 {
  font-weight: 571;
}

.fw-572 {
  font-weight: 572;
}

.fw-573 {
  font-weight: 573;
}

.fw-574 {
  font-weight: 574;
}

.fw-575 {
  font-weight: 575;
}

.fw-576 {
  font-weight: 576;
}

.fw-577 {
  font-weight: 577;
}

.fw-578 {
  font-weight: 578;
}

.fw-579 {
  font-weight: 579;
}

.fw-580 {
  font-weight: 580;
}

.fw-581 {
  font-weight: 581;
}

.fw-582 {
  font-weight: 582;
}

.fw-583 {
  font-weight: 583;
}

.fw-584 {
  font-weight: 584;
}

.fw-585 {
  font-weight: 585;
}

.fw-586 {
  font-weight: 586;
}

.fw-587 {
  font-weight: 587;
}

.fw-588 {
  font-weight: 588;
}

.fw-589 {
  font-weight: 589;
}

.fw-590 {
  font-weight: 590;
}

.fw-591 {
  font-weight: 591;
}

.fw-592 {
  font-weight: 592;
}

.fw-593 {
  font-weight: 593;
}

.fw-594 {
  font-weight: 594;
}

.fw-595 {
  font-weight: 595;
}

.fw-596 {
  font-weight: 596;
}

.fw-597 {
  font-weight: 597;
}

.fw-598 {
  font-weight: 598;
}

.fw-599 {
  font-weight: 599;
}

.fw-600 {
  font-weight: 600;
}

.fw-601 {
  font-weight: 601;
}

.fw-602 {
  font-weight: 602;
}

.fw-603 {
  font-weight: 603;
}

.fw-604 {
  font-weight: 604;
}

.fw-605 {
  font-weight: 605;
}

.fw-606 {
  font-weight: 606;
}

.fw-607 {
  font-weight: 607;
}

.fw-608 {
  font-weight: 608;
}

.fw-609 {
  font-weight: 609;
}

.fw-610 {
  font-weight: 610;
}

.fw-611 {
  font-weight: 611;
}

.fw-612 {
  font-weight: 612;
}

.fw-613 {
  font-weight: 613;
}

.fw-614 {
  font-weight: 614;
}

.fw-615 {
  font-weight: 615;
}

.fw-616 {
  font-weight: 616;
}

.fw-617 {
  font-weight: 617;
}

.fw-618 {
  font-weight: 618;
}

.fw-619 {
  font-weight: 619;
}

.fw-620 {
  font-weight: 620;
}

.fw-621 {
  font-weight: 621;
}

.fw-622 {
  font-weight: 622;
}

.fw-623 {
  font-weight: 623;
}

.fw-624 {
  font-weight: 624;
}

.fw-625 {
  font-weight: 625;
}

.fw-626 {
  font-weight: 626;
}

.fw-627 {
  font-weight: 627;
}

.fw-628 {
  font-weight: 628;
}

.fw-629 {
  font-weight: 629;
}

.fw-630 {
  font-weight: 630;
}

.fw-631 {
  font-weight: 631;
}

.fw-632 {
  font-weight: 632;
}

.fw-633 {
  font-weight: 633;
}

.fw-634 {
  font-weight: 634;
}

.fw-635 {
  font-weight: 635;
}

.fw-636 {
  font-weight: 636;
}

.fw-637 {
  font-weight: 637;
}

.fw-638 {
  font-weight: 638;
}

.fw-639 {
  font-weight: 639;
}

.fw-640 {
  font-weight: 640;
}

.fw-641 {
  font-weight: 641;
}

.fw-642 {
  font-weight: 642;
}

.fw-643 {
  font-weight: 643;
}

.fw-644 {
  font-weight: 644;
}

.fw-645 {
  font-weight: 645;
}

.fw-646 {
  font-weight: 646;
}

.fw-647 {
  font-weight: 647;
}

.fw-648 {
  font-weight: 648;
}

.fw-649 {
  font-weight: 649;
}

.fw-650 {
  font-weight: 650;
}

.fw-651 {
  font-weight: 651;
}

.fw-652 {
  font-weight: 652;
}

.fw-653 {
  font-weight: 653;
}

.fw-654 {
  font-weight: 654;
}

.fw-655 {
  font-weight: 655;
}

.fw-656 {
  font-weight: 656;
}

.fw-657 {
  font-weight: 657;
}

.fw-658 {
  font-weight: 658;
}

.fw-659 {
  font-weight: 659;
}

.fw-660 {
  font-weight: 660;
}

.fw-661 {
  font-weight: 661;
}

.fw-662 {
  font-weight: 662;
}

.fw-663 {
  font-weight: 663;
}

.fw-664 {
  font-weight: 664;
}

.fw-665 {
  font-weight: 665;
}

.fw-666 {
  font-weight: 666;
}

.fw-667 {
  font-weight: 667;
}

.fw-668 {
  font-weight: 668;
}

.fw-669 {
  font-weight: 669;
}

.fw-670 {
  font-weight: 670;
}

.fw-671 {
  font-weight: 671;
}

.fw-672 {
  font-weight: 672;
}

.fw-673 {
  font-weight: 673;
}

.fw-674 {
  font-weight: 674;
}

.fw-675 {
  font-weight: 675;
}

.fw-676 {
  font-weight: 676;
}

.fw-677 {
  font-weight: 677;
}

.fw-678 {
  font-weight: 678;
}

.fw-679 {
  font-weight: 679;
}

.fw-680 {
  font-weight: 680;
}

.fw-681 {
  font-weight: 681;
}

.fw-682 {
  font-weight: 682;
}

.fw-683 {
  font-weight: 683;
}

.fw-684 {
  font-weight: 684;
}

.fw-685 {
  font-weight: 685;
}

.fw-686 {
  font-weight: 686;
}

.fw-687 {
  font-weight: 687;
}

.fw-688 {
  font-weight: 688;
}

.fw-689 {
  font-weight: 689;
}

.fw-690 {
  font-weight: 690;
}

.fw-691 {
  font-weight: 691;
}

.fw-692 {
  font-weight: 692;
}

.fw-693 {
  font-weight: 693;
}

.fw-694 {
  font-weight: 694;
}

.fw-695 {
  font-weight: 695;
}

.fw-696 {
  font-weight: 696;
}

.fw-697 {
  font-weight: 697;
}

.fw-698 {
  font-weight: 698;
}

.fw-699 {
  font-weight: 699;
}

.fw-700 {
  font-weight: 700;
}

.line {
  height: 1px;
  padding-top: 2em;
  border-bottom: 1px solid var(--brd-c1);
}

/* ----------------------------------------
* li-sty
* ----------------------------------------*/
.li-sty-dot {
  display: flex;
  flex-direction: column;
  gap: 0.62em;
}
.li-sty-dot > li {
  position: relative;
  padding-left: 0.6em;
}
.li-sty-dot > li::before {
  content: "";
  display: block;
  position: absolute;
  top: 0.6em;
  left: 0;
  width: 4px;
  height: 4px;
  background-color: var(--black);
}

.li-sty-line {
  display: flex;
  flex-direction: column;
  gap: 0.6em;
}
.li-sty-line li {
  position: relative;
  padding-left: 1em;
}
.li-sty-line li::before {
  content: "";
  display: block;
  position: absolute;
  top: 0.6em;
  left: 0;
  width: 8px;
  height: 2px;
  background-color: var(--gray-500);
}
.li-sty-line.li-sty-line-in {
  margin-top: 0.7em;
}

/* ----------------------------------------
* btn
* ----------------------------------------*/
.btn-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.btn-sty {
  min-height: 64px;
  padding: 0.6em 1.25em;
  min-width: 160px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius-s);
}
.btn-sty.btn-pri {
  background-color: var(--primary);
  color: var(--white);
}
.btn-sty.btn-secon1 {
  background-color: var(--secondary1);
  color: var(--white);
}
.btn-sty.btn-secon2 {
  background-color: var(--secondary2);
  color: var(--white);
}
.btn-sty.btn-gray {
  background-color: var(--gray-500);
  color: var(--white);
}
.btn-sty.btn-black {
  background-color: var(--black);
  color: var(--white);
}
.btn-sty.btn-line-pri {
  border: 1px solid var(--primary);
  color: var(--primary);
}
.btn-sty.btn-line-secon1 {
  border: 1px solid var(--secondary1);
  color: var(--secondary1);
}
.btn-sty.btn-line-black {
  border: 1px solid var(--black);
}
.btn-sty.btn-line-gray {
  border: 1px solid var(--gray-400);
  color: var(--black);
}
.btn-sty.btn-line-gray2 {
  background-color: var(--gray-100);
  border: 1px solid var(--gray-400);
  color: var(--black);
}
.btn-sty.btn-down {
  display: flex;
  align-items: center;
  border: 1px solid var(--brd-c1);
  background-color: var(--gray-100);
}
.btn-sty.btn-down::after {
  content: "";
  display: block;
  width: 18px;
  height: 16px;
  margin-left: 0.63em;
  background: url(/images/common/i_down.svg) no-repeat center/100% 100%;
}
.btn-sty.btn-sty-s {
  min-width: 128px;
  min-height: 48px;
}
.btn-sty.btn-sty-ws {
  min-width: 100px;
  min-height: 42px;
}
@media (max-width: 1280px) {
  .btn-sty {
    min-width: 128px;
    min-height: 48px;
  }
  .btn-sty.btn-sty-s {
    min-width: 100px;
    min-height: 42px;
  }
}
@media (max-width: 767px) {
  .btn-sty {
    min-width: 100px;
    min-height: 42px;
  }
}
.btn-sty:disabled {
  cursor: not-allowed;
  color: var(--gray-500);
  background-color: var(--gray-400);
}

.flex-start {
  justify-content: flex-start;
}

.flex-center {
  justify-content: flex-end;
}

.flex-end {
  justify-content: flex-end;
}

.flex-a-start {
  align-items: flex-start;
}

.flex-a-center {
  align-items: flex-end;
}

.flex-a-end {
  align-items: flex-end;
}

/* ----------------------------------------
* table
* ----------------------------------------*/
.tbl-com {
  width: 100%;
  border-top: 2px solid var(--black);
}
.tbl-com td,
.tbl-com th {
  padding: 0.9em 1.25em;
  border-right: 1px solid var(--brd-c1);
  border-bottom: 1px solid var(--brd-c1);
  vertical-align: middle;
}
.tbl-com td:last-child,
.tbl-com th:last-child {
  border-right: 0;
}
.tbl-com thead th {
  font-weight: 500;
  background-color: var(--primary-100);
}
.tbl-com tbody th {
  font-weight: 500;
  background-color: var(--gray-100);
}

/* tbl-scroll */
.tbl-scl-info {
  padding: 0.5em 1em;
  margin-bottom: 0.5em;
  border-radius: var(--border-radius);
  background-color: var(--gray-100);
  text-align: center;
  display: none;
  font-size: 1.4rem;
}
@media (max-width: 1280px) {
  .tbl-scl-info {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .tbl-scl-info {
    font-size: 1.2rem;
  }
}
@media (max-width: 767px) {
  .tbl-scl-info {
    display: block;
  }
}

@media (max-width: 767px) {
  .tbl-scl-wrap {
    overflow-x: auto;
  }
  .tbl-scl-wrap .tbl-w767 {
    min-width: 767px;
  }
  .tbl-scl-wrap .tbl-com {
    margin-bottom: 1em;
  }
}

/* ----------------------------------------
* input
* ----------------------------------------*/
.info-notice {
  margin-top: 0.8em;
  color: #202AEA;
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  .info-notice {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .info-notice {
    font-size: 1.4rem;
  }
}

.col-ect {
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
}
.col-ect .col-cont {
  width: calc(50% - 0.5em);
}
.col-ect .col-cont .cont {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.col-ect .col-cont .cont input {
  max-width: 318px;
}
.col-ect.col-full, .col-ect.col-full-wrap {
  flex-wrap: nowrap;
}
.col-ect.col-full .col-cont, .col-ect.col-full-wrap .col-cont {
  width: 100%;
}
.col-ect.col-full .col-cont .cont, .col-ect.col-full-wrap .col-cont .cont {
  flex-wrap: nowrap;
}
.col-ect.col-full-wrap .col-cont .cont input {
  max-width: calc(50% - 0.5em);
}
.col-ect.col-sample .col-cont .cont input:nth-child(2) {
  margin-right: 1.5em;
}
.col-ect.col-sample .col-cont .cont input:nth-child(4) {
  max-width: 120px;
}
@media (max-width: 560px) {
  .col-ect .col-cont {
    flex: 1;
  }
  .col-ect.col-full {
    flex-wrap: wrap;
  }
  .col-ect.col-full .col-cont {
    width: 100%;
  }
  .col-ect.col-full .col-cont .cont {
    flex-wrap: wrap;
  }
  .col-ect.col-full-wrap .col-cont .cont input {
    max-width: 100%;
  }
  .col-ect.col-sample .col-cont .cont input:nth-child(2) {
    max-width: calc(100% - 50px);
    margin-right: 0;
  }
}
@media (max-width: 340px) {
  .col-ect .col-cont {
    flex: 0 0 auto;
    width: 100%;
  }
  .col-ect.col-full-wrap {
    flex-wrap: wrap;
  }
  .col-ect.col-full-wrap .col-cont {
    width: 100%;
  }
  .col-ect.col-full-wrap .col-cont .cont {
    flex-wrap: wrap;
  }
}

/* ----------------------------------------
* finish-cont
* ----------------------------------------*/
.finish-wrap {
  max-width: 540px;
  margin: 0 auto;
}
.finish-wrap .finish-head {
  text-align: center;
}
.finish-wrap .finish-head .img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  margin: 0 auto 1.75em;
  aspect-ratio: 1;
}
.finish-wrap .finish-head .img img {
  width: 92%;
}
.finish-wrap .finish-cont {
  padding: 2.5em;
  background-color: var(--gray-100);
  border-radius: var(--border-radius-s);
}
.finish-wrap .finish-cont .cont1 {
  padding-bottom: 2em;
  margin-bottom: 2em;
  border-bottom: 1px solid var(--brd-c1);
}
.finish-wrap .finish-cont .cont1 .tbl-fin th {
  width: 140px;
}
.finish-wrap .finish-cont .cont2 .tbl-fin th {
  width: 100px;
}
.finish-wrap .finish-cont.member-fin {
  text-align: center;
  word-break: break-all;
}
@media (max-width: 767px) {
  .finish-wrap .finish-head .img {
    width: 48px;
    margin-bottom: 1em;
  }
  .finish-wrap .finish-cont {
    padding: 2em;
  }
  .finish-wrap .finish-cont .cont1 .tbl-fin th {
    width: 120px;
  }
  .finish-wrap .finish-cont .cont2 .tbl-fin th {
    width: 80px;
  }
}

.tbl-fin td, .tbl-fin th {
  padding: 0.4em;
  text-align: left;
}
.tbl-fin th {
  font-weight: 500;
}
@media (max-width: 320px) {
  .tbl-fin tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
  }
  .tbl-fin tr:last-child {
    margin-bottom: 0;
  }
  .tbl-fin td, .tbl-fin th {
    padding: 0.2em;
    word-break: break-all;
    vertical-align: top;
  }
}

/* ----------------------------------------
* 서브 검색
* ----------------------------------------*/
/* ----------------------------------------
* 페이징
* ----------------------------------------*/
.pagination-wrap {
  margin-top: 5em;
}
.pagination-wrap .page-item .page-link,
.pagination-wrap .pagination-item .page-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  aspect-ratio: 1;
  border: 0;
  background-color: var(--white);
  color: var(--black);
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  .pagination-wrap .page-item .page-link,
  .pagination-wrap .pagination-item .page-link {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .pagination-wrap .page-item .page-link,
  .pagination-wrap .pagination-item .page-link {
    font-size: 1.4rem;
  }
}
.pagination-wrap .page-item .page-link::after,
.pagination-wrap .pagination-item .page-link::after {
  content: "";
  display: block;
  width: 28px;
  height: 2px;
  position: absolute;
  bottom: 6px;
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--white);
}
.pagination-wrap .page-item.active .page-link::after {
  background-color: var(--black);
}
.pagination-wrap .page-item.prev-block .page-link {
  background: url(/images/common/arw_page_first.svg) no-repeat center/12px 12px;
}
.pagination-wrap .page-item.prev-page .page-link {
  background: url(/images/common/arw_page_prev.svg) no-repeat center/8px 12px;
}
.pagination-wrap .page-item.next-block .page-link {
  background: url(/images/common/arw_page_last.svg) no-repeat center/12px 12px;
}
.pagination-wrap .page-item.next-page .page-link {
  background: url(/images/common/arw_page_next.svg) no-repeat center/8px 12px;
}
.pagination-wrap .pagination-item {
  width: 30px;
}
@media (max-width: 768px) {
  .pagination-wrap .pagination {
    flex-wrap: wrap;
  }
  .pagination-wrap .pagination .page-item .page-link,
  .pagination-wrap .pagination .pagination-item .page-link {
    width: 32px;
  }
  .pagination-wrap .pagination .page-item .page-link::after,
  .pagination-wrap .pagination .pagination-item .page-link::after {
    bottom: 2px;
  }
}

/* 페이지 준비중입니다. */
.soon {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.soon > div {
  width: 60%;
  max-width: 500px;
}
.soon h2 {
  margin-top: 2em;
  font-weight: 500;
  font-size: 3.2rem;
}
@media (max-width: 1280px) {
  .soon h2 {
    font-size: 2.6rem;
  }
}
@media (max-width: 768px) {
  .soon h2 {
    font-size: 2.2rem;
  }
}
.soon h2 span {
  color: #ff9318;
}

/************************************************************************************/
/*************************************** Form ***************************************/
/************************************************************************************/
/* disabled */
*:disabled {
  opacity: 0.5;
  cursor: default;
  background-color: var(--gray-100);
}

div:has(> input:disabled) label,
div:has(> select:disabled) label,
div:has(> testarea:disabled) label {
  opacity: 0.5;
  cursor: default;
}

input,
textarea,
select {
  width: 100%;
  border: 0px;
  border-radius: 8px;
  background-color: #fff;
  padding: 1em;
  min-height: 3.56em;
  border: 1px solid var(--brd-c1);
}
input::placeholder,
textarea::placeholder,
select::placeholder {
  color: var(--gray-500);
}
input.error,
textarea.error,
select.error {
  border-color: var(--bs-danger) !important;
}
input.valid,
textarea.valid,
select.valid {
  border-color: var(--bs-success) !important;
  background-color: #f3f3f3;
}
input.error ~ label.error,
textarea.error ~ label.error,
select.error ~ label.error {
  position: absolute;
  width: auto;
  top: 100%;
  z-index: 5;
  display: block !important;
  max-width: 100%;
  padding: 0.25rem 0.5rem;
  margin-top: 0.1rem;
  font-size: 1.4rem !important;
  color: #fff;
  background-color: var(--bs-danger);
  border-radius: var(--bs-border-radius);
}
input[readonly],
textarea[readonly],
select[readonly] {
  background-color: var(--gray-100);
  color: var(--gray-500);
}

select {
  background: url(/images/tfsp/common/arw_select.svg) no-repeat center right 1.1em/24px 24px;
}

select option {
  background: #f3f3f3;
}

textarea {
  padding: 1em;
  border-radius: var(--border-radius-s);
}
textarea.no-resize {
  resize: none;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
  outline-offset: 2px;
  outline-color: var(--black);
}

/* common */
.form-wrap {
  display: flex;
  flex-direction: column;
  gap: 1.78em 20px;
}

/* 주소입력창 */
.adderss-wrap {
  display: flex;
}
.adderss-wrap > input {
  border-radius: 8px 0 0 8px;
}
.adderss-wrap > button {
  color: var(--white);
  border-radius: 0 8px 8px 0;
  background: var(--text-color);
  padding: 0 2rem;
}

.block-address {
  width: 60%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
@media (max-width: 767px) {
  .block-address {
    width: 100%;
  }
}

/* form layout */
.form-cont {
  display: flex;
  gap: 1em 20px;
}
.form-cont .block {
  width: calc((100% - 20px) / 2);
}
.form-cont .block-full {
  width: 100%;
}
.form-cont .block-3 {
  width: 33.33%;
}
.form-cont .block-4 {
  width: 25%;
}
.form-cont.company-block .block:nth-child(1) {
  max-width: 460px;
}
.form-cont.company-block .block:nth-child(2) {
  max-width: 340px;
}
@media (max-width: 1280px) {
  .form-cont {
    gap: 1em 16px;
  }
  .form-cont.file-cont .block {
    width: 60%;
  }
}
@media (max-width: 767px) {
  .form-cont {
    gap: 1em 8px;
    flex-wrap: wrap;
  }
  .form-cont .block,
  .form-cont .block-3,
  .form-cont .block-4 {
    width: calc((100% - 8px) / 2);
  }
  .form-cont.file-cont .block {
    width: 100%;
  }
}
@media (max-width: 480px) {
  .form-cont .block,
  .form-cont .block-3,
  .form-cont .block-4 {
    width: 100%;
  }
}

/* 신청 품목 수정 행 간격 */
.item-detail > .form-cont + .form-cont {
  margin-top: 1.67em;
}
.item-detail .form-tab2 {
  margin-bottom: 0;
}

/* label */
.info-notice {
  margin-top: 0.5em;
  color: #202AEA;
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  .info-notice {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .info-notice {
    font-size: 1.4rem;
  }
}

.info-notice-red {
  margin-top: 0.5em;
  color: #ED0000;
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  .info-notice-red {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .info-notice-red {
    font-size: 1.4rem;
  }
}

/* label */
.label-h {
  display: block;
  font-weight: 500;
  margin-bottom: 8px;
  font-size: 2rem;
}
@media (max-width: 1280px) {
  .label-h {
    font-size: 1.8rem;
  }
}
@media (max-width: 768px) {
  .label-h {
    font-size: 1.7rem;
  }
}

.label-h-ti {
  display: block;
  font-weight: 500;
  margin-top: 1.1em;
  margin-bottom: 1.1em;
  font-size: 2rem;
}
@media (max-width: 1280px) {
  .label-h-ti {
    font-size: 1.8rem;
  }
}
@media (max-width: 768px) {
  .label-h-ti {
    font-size: 1.7rem;
  }
}

.label-h-s {
  display: block;
  font-weight: 400;
  margin-bottom: 8px;
  font-size: 1.8rem;
}
@media (max-width: 1280px) {
  .label-h-s {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .label-h-s {
    font-size: 1.5rem;
  }
}

.label-hidden {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  font-size: 1px;
  line-height: 0;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  margin: -1px;
  padding: 0;
  border: 0;
}

.form-tab {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 1.1em;
}

.form-tab2 {
  display: flex;
  flex-wrap: wrap;
  gap: 1.67em;
  margin-bottom: 1.1em;
}

.input-add-txt {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.input-add-txt2 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.input-add-txt2 label {
  white-space: nowrap;
}

/* checkbox */
.checkbox-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 2.65em;
}

.label-checkbox {
  display: inline-flex;
  cursor: pointer;
}
.label-checkbox input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.label-checkbox input:focus + span::before, .label-checkbox input:focus-visible + span::before {
  outline: 2px solid var(--black);
  outline-offset: 2px;
}
.label-checkbox span {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding-left: 28px;
}
.label-checkbox span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 20px;
  height: 20px;
  border: 1px solid #d2d2d2;
  background: #fff url("/images/tfsp/common/icon_check.svg") no-repeat center/100% auto;
  transform: translateY(-50%);
  transition: all 0.2s ease;
  box-sizing: border-box;
}
.label-checkbox span::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 50%;
  width: 6px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: translateY(-65%) rotate(45deg) scale(0);
  transform-origin: center;
  transition: transform 0.2s ease;
}
.label-checkbox input:checked + span::before {
  background: var(--text-color) url("/images/tfsp/common/icon_checked.svg") no-repeat center/100% auto;
  border-color: var(--text-color);
}
.label-checkbox input:checked + span::after {
  transform: translateY(-65%) rotate(45deg) scale(1);
}
.label-checkbox input:disabled + span {
  color: #999;
  cursor: not-allowed;
}
.label-checkbox input:disabled + span::before {
  background: #f5f5f5;
  border-color: #e5e5e5;
}
.label-checkbox input:disabled:checked + span::before {
  background: #ccc;
  border-color: #ccc;
}

/* radio */
.label-radio input[type=radio] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.label-radio input[type=radio]:focus + span, .label-radio input[type=radio]:focus-visible + span {
  outline: 2px solid var(--black);
  outline-offset: 2px;
}
.label-radio span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 100px;
  height: 48px;
  padding-inline: 1em 1.2em;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  color: var(--text-color);
  cursor: pointer;
  transition: all 0.2s ease;
}
.label-radio span::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  margin-right: 6px;
  background: url("/images/tfsp/common/icon_check.svg") no-repeat center/100% auto;
}
.label-radio input[type=radio]:checked + span {
  background: var(--text-color);
  border-color: var(--text-color);
  color: var(--white);
}
.label-radio input[type=radio]:checked + span::before {
  background-image: url("/images/tfsp/common/icon_checked.svg");
}
.label-radio input[type=radio]:focus-visible + span {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.label-radio-circle {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}
.label-radio-circle input[type=radio] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.label-radio-circle input[type=radio]:focus + span::before, .label-radio-circle input[type=radio]:focus-visible + span::before {
  outline: 2px solid var(--black);
  outline-offset: 2px;
}
.label-radio-circle span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.label-radio-circle span::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  border: 1px solid var(--brd-c1);
  border-radius: 50%;
  background: var(--white);
  transition: all 0.2s ease;
}
.label-radio-circle span::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  left: 6px;
  border-radius: 50%;
  background: #fff;
  transform: translateY(-50%);
  transition: transform 0.2s ease;
}
.label-radio-circle input[type=radio]:checked + span::after {
  background: var(--text-color);
}
.label-radio-circle input[type=radio]:focus-visible + span::before {
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1);
}
.label-radio-circle input[type=radio]:disabled + span {
  color: #999;
  cursor: not-allowed;
}
.label-radio-circle input[type=radio]:disabled + span::before {
  border-color: #ddd;
  background: #f5f5f5;
}
.label-radio-circle input[type=radio]:disabled:checked + span::after {
  background: #999;
}

input[type=file] {
  width: 100%;
  color: var(--text-color);
  padding: 4px 1em 4px 4px;
}
input[type=file]::file-selector-button {
  margin-right: 12px;
  padding: 4px 0.87em;
  min-height: 3.22em;
  border: 1px solid var(--brd-c1);
  border-radius: 8px;
  background: #f3f3f3;
  color: var(--text-color);
  cursor: pointer;
  transition: all 0.2s ease;
}

.select-wrap {
  position: relative;
}
.select-wrap input {
  background: url("/images/management/common/arrow_down.png") no-repeat 1em center;
  cursor: pointer;
}
.select-wrap .select-option {
  width: 100%;
  background: var(--white);
  position: absolute;
  z-index: 50;
  display: none;
}
.select-wrap .select-option a {
  display: block;
}

/* common */
body {
  font-family: "Pretendard", sans-serif;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.025em;
  word-break: keep-all;
  color: var(--text-color);
  font-size: 1.8rem;
}
@media (max-width: 1280px) {
  body {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  body {
    font-size: 1.5rem;
  }
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.5;
  color: var(--text-color);
}

.wrap-in {
  max-width: 1420px;
  margin: 0 auto;
}
@media (max-width: 1440px) {
  .wrap-in {
    max-width: 96%;
  }
}
@media (max-width: 767px) {
  .wrap-in {
    max-width: 94%;
  }
}
@media (max-width: 480px) {
  .wrap-in {
    max-width: 92%;
  }
}

/*----------------------------- header ------------------------------*/
:root {
  --header-height: 100px;
  --header-padding: 32px;
  --border-radius: 20px;
  --border-radius-s: 10px;
  --gap: 32px;
}
@media (max-width: 1460px) {
  :root {
    --header-padding: 2%;
  }
}
@media (max-width: 1280px) {
  :root {
    --border-radius: 12px;
    --border-radius-s: 8px;
    --gap: 24px;
  }
}
@media (max-width: 1024px) {
  :root {
    --header-height: 80px;
    --breadcrumb-height: 56px;
  }
}
@media (max-width: 767px) {
  :root {
    --header-height: 68px;
    --header-padding: 3%;
    --breadcrumb-height: 48px;
    --border-radius: 8px;
    --border-radius-s: 6px;
    --gap: 16px;
  }
}
@media (max-width: 480px) {
  :root {
    --header-padding: 4%;
  }
}

/* header */
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding-inline: 32px;
  height: var(--header-height);
  background-color: var(--white);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.06);
  z-index: 100;
  /* nav */
  /* util */
}
header .logo {
  flex: 1;
}
header .logo a {
  display: block;
  width: 268px;
  height: 52px;
  background: url(/images/tfsp/common/logo.svg) no-repeat center/100% 100%;
}
header .gnb-bg {
  display: none;
  position: absolute;
  top: var(--header-height);
  left: 0;
  width: 100%;
  height: 224px;
  background-color: var(--white);
  border-top: 1px solid var(--brd-c3);
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.03);
}
header .header-gnb {
  flex: 1;
  height: 100%;
}
header .header-gnb .gnb {
  min-width: 800px;
  height: 100%;
  display: flex;
  transition: 0.4s;
}
header .header-gnb .gnb .gnb-dep1 {
  width: 25%;
  position: relative;
}
header .header-gnb .gnb .gnb-dep1 > a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
  height: 100%;
  font-weight: 500;
  transition: all 0.4s ease;
  font-size: 2rem;
}
@media (max-width: 1280px) {
  header .header-gnb .gnb .gnb-dep1 > a {
    font-size: 1.8rem;
  }
}
@media (max-width: 768px) {
  header .header-gnb .gnb .gnb-dep1 > a {
    font-size: 1.7rem;
  }
}
header .header-gnb .gnb .gnb-dep1 > a::after {
  content: "";
  border-top: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 6px solid transparent;
  display: block;
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.4s ease;
}
header .header-gnb .gnb .gnb-dep1:hover > a, header .header-gnb .gnb .gnb-dep1.active > a {
  color: var(--primary);
}
header .header-gnb .gnb .gnb-dep1:hover > a::after, header .header-gnb .gnb .gnb-dep1.active > a::after {
  border-top: 6px solid var(--primary);
  border-right: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 6px solid transparent;
}
header .header-gnb .gnb .gnb-dep1.active > a::after {
  animation-name: moves-arrow;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}
header .header-gnb .gnb .gnb-dep1.--nav-open .gnb-dep2 {
  display: block !important;
}
header .header-gnb .gnb .gnb-dep2 {
  display: none;
  width: 100%;
  position: absolute;
  top: var(--header-height);
  padding-top: 1.6em;
}
header .header-gnb .gnb .gnb-dep2 li a {
  width: 100%;
  text-align: center;
  display: block;
  padding: 0.4em;
  font-weight: 400;
  transition: all 0.4s ease;
}
header .header-gnb .gnb .gnb-dep2 li a span {
  display: inline-block;
  position: relative;
}
header .header-gnb .gnb .gnb-dep2 li a span::after {
  content: "";
  width: 0;
  height: 1px;
  border-bottom: 1.5px solid var(--primary);
  display: block;
  position: absolute;
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.4s ease;
}
header .header-gnb .gnb .gnb-dep2 li a:hover {
  color: var(--primary);
}
header .header-gnb .gnb .gnb-dep2 li a:hover span::after {
  width: 100%;
}
header .header-gnb .gnb .gnb-dep2 li.active a {
  color: var(--primary);
}
header .header-gnb .gnb .gnb-dep2 li.active a span::after {
  width: 100%;
}
header .util {
  position: relative;
  flex: 1;
  justify-content: flex-end;
  display: flex;
  align-items: center;
  gap: 40px;
}
header .util .icon-layout a {
  display: flex;
  align-items: center;
  gap: 8px;
}
header .util .icon-layout a::before {
  content: "";
  display: block;
  width: 40px;
  aspect-ratio: 1;
  background-color: var(--black);
}
header .util .icon-layout.login a::before {
  background: url(/images/common/icon/user.svg) no-repeat center/65% 65%;
}
header .util .burger-menu a {
  width: var(--header-height);
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--primary);
}
header .util .burger-menu .burger-in {
  position: relative;
  width: 32%;
  height: 22px;
}
header .util .burger-menu .burger-in span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--white);
  transition: 0.3s ease-in-out;
}
header .util .burger-menu .burger-in span:nth-child(2) {
  top: 10px;
}
header .util .burger-menu .burger-in span:nth-child(3) {
  top: auto;
  bottom: 0;
}
header .util .burger-menu.--burger-open .burger-in span:nth-child(1) {
  transform: rotate(45deg);
  top: 10px;
}
header .util .burger-menu.--burger-open .burger-in span:nth-child(2) {
  transform: rotate(-45deg);
  top: 10px;
}
header .util .burger-menu.--burger-open .burger-in span:nth-child(3) {
  opacity: 0;
}
@media (max-width: 1460px) {
  header {
    /* nav */
    /* util */
  }
  header .header-gnb .gnb {
    min-width: 680px;
  }
  header .util {
    gap: 16px;
  }
  header .util .burger-menu {
    padding-left: 10px;
  }
}
@media (max-width: 1280px) {
  header {
    /* nav */
  }
  header .logo a {
    width: 214px;
    height: 42px;
  }
  header .gnb-bg {
    display: none;
    height: calc(100vh - var(--header-height));
    background-color: var(--black);
    border-top: 0;
    box-shadow: none;
    opacity: 0.5;
  }
  header .header-gnb {
    display: none;
    flex: 0;
    width: 70%;
    height: calc(100vh - var(--header-height));
    top: var(--header-height);
    right: 0;
    position: absolute;
    background-color: var(--white);
    z-index: 90;
  }
  header .header-gnb .gnb {
    min-width: 100%;
    width: 100%;
    height: 100%;
    display: block;
  }
  header .header-gnb .gnb .gnb-dep1 {
    width: 100%;
  }
  header .header-gnb .gnb .gnb-dep1 > a {
    position: relative;
    display: block;
    padding: 1em 2em;
    text-align: left;
    font-size: 2.4rem;
  }
}
@media (max-width: 1280px) and (max-width: 1280px) {
  header .header-gnb .gnb .gnb-dep1 > a {
    font-size: 2rem;
  }
}
@media (max-width: 1280px) and (max-width: 768px) {
  header .header-gnb .gnb .gnb-dep1 > a {
    font-size: 1.8rem;
  }
}
@media (max-width: 1280px) {
  header .header-gnb .gnb .gnb-dep1 > a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    transition: 0.3s ease-in-out;
    right: 2em;
    width: 19px;
    height: 7px;
  }
  header .header-gnb .gnb .gnb-dep1.--nav-open .gnb-dep2 {
    display: block !important;
  }
  header .header-gnb .gnb .gnb-dep2 {
    position: static;
    background-color: var(--brd-c3);
    padding: 1.6em 3em;
  }
  header .header-gnb .gnb .gnb-dep2 li a {
    text-align: left;
  }
}
@media (max-width: 1024px) {
  header {
    /* util */
  }
  header .logo a {
    width: 187px;
    height: 36px;
  }
  header .util .burger-menu .burger-in {
    width: 36%;
    height: 18px;
  }
  header .util .burger-menu .burger-in span:nth-child(2) {
    top: 8px;
  }
}
@media (max-width: 767px) {
  header {
    padding-inline: 24px 16px;
    /* nav */
    /* util */
  }
  header .logo a {
    width: 160px;
    height: 31px;
  }
  header .gnb-bg {
    display: none;
  }
  header .header-gnb {
    width: 100%;
    border-top: 1px solid var(--brd-c3);
  }
  header .util {
    gap: 4px;
  }
  header .util .icon-layout a {
    gap: 0;
  }
  header .util .burger-menu {
    padding-left: 0;
  }
  header .util .burger-menu a {
    width: 48px;
    background-color: transparent;
  }
  header .util .burger-menu .burger-in {
    width: 60%;
    height: 22px;
  }
  header .util .burger-menu .burger-in span {
    background-color: var(--primary);
    border-radius: 4px;
  }
  header .util .burger-menu .burger-in span:nth-child(2) {
    top: 10px;
  }
}
@media (max-width: 480px) {
  header {
    padding-inline: 20px 10px;
    /* util */
  }
  header .util .icon-layout a::before {
    width: 32px;
  }
  header .util .burger-menu a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
  }
  header .util .burger-menu .burger-in {
    height: 18px;
  }
  header .util .burger-menu .burger-in span:nth-child(2) {
    top: 8px;
  }
}
@media (max-width: 320px) {
  header {
    /* util */
  }
  header .logo {
    flex: 0 1 auto;
  }
  header .logo a {
    width: clamp(1px, 50vw, 160px);
    height: clamp(1px, 10vw, 31px);
  }
  header .util {
    flex: 0 1 auto;
  }
}
@media (max-width: 220px) {
  header {
    flex-wrap: wrap;
  }
}

/* ----------------------------------------
* footer
* ----------------------------------------*/
/* wrap */
.wrap-in {
  max-width: 1408px;
  margin-inline: auto;
}
@media (max-width: 1460px) {
  .wrap-in {
    max-width: 96%;
  }
}
@media (max-width: 767px) {
  .wrap-in {
    max-width: 94%;
  }
}
@media (max-width: 480px) {
  .wrap-in {
    max-width: 92%;
  }
}

footer {
  padding-block: 4em;
  background-color: #f6f8fb;
}
footer .f-top {
  padding-inline: 1.25em;
  padding-bottom: 3em;
  margin-bottom: 3em;
  display: flex;
  align-items: flex-end;
  border-bottom: 1px solid var(--brd-c2);
}
footer .f-top .logo {
  width: 268px;
  height: 52px;
  background: url(/images/tfsp/common/logo_f.svg) no-repeat center/100% 100%;
}
footer .f-top .f-nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4em;
  font-weight: 600;
}
footer .f-cont {
  padding-inline: 1.25em;
  display: flex;
}
footer .f-cont .address dl {
  display: flex;
  margin-bottom: 0.5em;
  gap: 1.25em;
}
footer .f-cont .address dl dt {
  margin-bottom: 0;
  color: var(--primary);
  font-weight: 600;
}
footer .f-cont .address dl dd {
  margin-bottom: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.8em;
}
footer .f-cont .copyright {
  margin-left: auto;
  color: var(--gray-500);
  text-align: right;
}
@media (max-width: 1280px) {
  footer .f-top {
    display: block;
  }
  footer .f-top .logo {
    width: 214px;
    height: 42px;
  }
  footer .f-top .f-nav {
    margin-top: 2em;
    margin-left: 0;
  }
  footer .f-cont {
    display: block;
  }
  footer .f-cont .copyright {
    margin-top: 2em;
    margin-left: 0;
    text-align: left;
  }
}
@media (max-width: 1024px) {
  footer .f-top {
    display: block;
  }
  footer .f-top .logo {
    width: 187px;
    height: 36px;
  }
}
@media (max-width: 767px) {
  footer {
    padding-block: 3.2em;
  }
  footer .f-top {
    padding-inline: 0.5em;
    padding-bottom: 2em;
    margin-bottom: 2em;
  }
  footer .f-top .logo {
    width: 160px;
    height: 31px;
    margin: 0 auto;
  }
  footer .f-top .f-nav {
    flex-wrap: wrap;
    gap: 0.5em;
  }
  footer .f-top .f-nav li {
    width: calc((100% - 0.5em) / 2);
    text-align: center;
    background-color: var(--white);
    border-radius: 20px;
  }
  footer .f-top .f-nav li a {
    display: block;
    padding: 0.8em 1em;
  }
  footer .f-cont {
    padding-inline: 0.5em;
  }
  footer .f-cont .address dl {
    display: block;
    text-align: center;
  }
  footer .f-cont .address dl dd {
    justify-content: center;
  }
  footer .f-cont .copyright {
    text-align: center;
  }
}
@media (max-width: 320px) {
  footer .f-top .logo {
    width: clamp(1px, 50vw, 160px);
    height: clamp(1px, 10vw, 31px);
  }
  footer .f-top .f-nav {
    flex-direction: column;
  }
  footer .f-top .f-nav li {
    width: 100%;
  }
  footer .f-top .f-nav li a {
    padding: 0.5em 1em;
  }
}

.sub-container {
  margin-top: var(--header-height);
  padding-bottom: 8em;
}
@media screen and (max-width: 500px) {
  .sub-container {
    padding-bottom: 5em;
  }
}

/*----------------------------- common ------------------------------*/
.h-sty01 {
  margin-bottom: 1.14em;
  font-weight: 600;
  font-size: 2.8rem;
}
@media (max-width: 1280px) {
  .h-sty01 {
    font-size: 2.2rem;
  }
}
@media (max-width: 768px) {
  .h-sty01 {
    font-size: 2rem;
  }
}

.h-sty-item {
  margin-bottom: 1em;
}
.h-sty-item span {
  padding: 4px 0.89em;
  display: inline-block;
  border: 1px solid var(--text-color);
}

.h-info {
  color: #ed0000;
  font-weight: 400;
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  .h-info {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .h-info {
    font-size: 1.4rem;
  }
}

.txt-red {
  color: #ed0000;
}

.txt-medium {
  font-weight: 500;
}

.txt-bold {
  font-weight: 600;
}

/* ----------------------------------------
* btn
* ----------------------------------------*/
.btn-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.btn-sty {
  min-height: 64px;
  padding: 0.6em 1.25em;
  min-width: 160px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius-s);
}
.btn-sty.btn-pri {
  background-color: var(--primary);
  color: var(--white);
}
.btn-sty.btn-secon1 {
  background-color: var(--secondary1);
  color: var(--white);
}
.btn-sty.btn-secon2 {
  background-color: var(--secondary2);
  color: var(--white);
}
.btn-sty.btn-gray {
  background-color: var(--gray-500);
  color: var(--white);
}
.btn-sty.btn-black {
  background-color: var(--black);
  color: var(--white);
}
.btn-sty.btn-line-pri {
  border: 1px solid var(--primary);
  color: var(--primary);
}
.btn-sty.btn-line-secon1 {
  border: 1px solid var(--secondary1);
  color: var(--secondary1);
}
.btn-sty.btn-line-black {
  border: 1px solid var(--black);
}
.btn-sty.btn-line-gray {
  border: 1px solid var(--gray-400);
  color: var(--black);
}
.btn-sty.btn-line-gray2 {
  background-color: var(--gray-100);
  border: 1px solid var(--gray-400);
  color: var(--black);
}
.btn-sty.btn-down {
  display: flex;
  align-items: center;
  border: 1px solid var(--brd-c1);
  background-color: var(--gray-100);
}
.btn-sty.btn-down::after {
  content: "";
  display: block;
  width: 18px;
  height: 16px;
  margin-left: 0.63em;
  background: url(/images/common/i_down.svg) no-repeat center/100% 100%;
}
.btn-sty.btn-sty-s {
  min-width: 128px;
  min-height: 48px;
}
.btn-sty.btn-sty-ws {
  min-width: 100px;
  min-height: 42px;
}
@media (max-width: 1280px) {
  .btn-sty {
    min-width: 128px;
    min-height: 48px;
  }
  .btn-sty.btn-sty-s {
    min-width: 100px;
    min-height: 42px;
  }
}
@media (max-width: 767px) {
  .btn-sty {
    min-width: 100px;
    min-height: 42px;
  }
}
.btn-sty:disabled {
  cursor: not-allowed;
  color: var(--gray-500);
  background-color: var(--gray-400);
}

/************************************************************************************/
/************************************* Colors *************************************/
/************************************************************************************/
:root {
  --white:#fff;
  --black:#000;
  --border-color:#cccccc;
  --bg-color:#fafbfd;
  --point-color:#3853c9;
  --point-over-color: #010A65;
  --point-sub-color:#ec5300;
  --point-color-bg: #f0f1fa;
  --point-sub-color-bg: #fff5ef;
  --bg-color:#fafbfd;
  --table-header:#f2f2f2;
  --top-navigation-bg-color:#2d3134;
  --left-menu-bg-color:#f0f3f8;
  --prev-menu-bg-color:#72809d;
  --depth1-bg-color:#d7e1ea;
  --percent-color: #77ea3b;
  --gray-e5:#e5e5e5;
  --gray-fa:#fafafa;
  --gray-f8:#f8f8f8;
  --gray-7c:#7c7c7c;
  --gray-d5:#d5d5d5;
  /* btn color */
  --btn-white-over-color: #f1edef;
  --btn-secondary-color:#673fe9;
  --btn-secondary-over-color: #3d278d;
  --btn-third-color:#75777e;
  --btn-third-over-color: #5d5e64;
  /* color */
  --text-color:#1f1f1f;
  --primary: #143358;
  --primary-400: #678cc2;
  --primary-300: #99b3d6;
  --primary-200: #ccd9eb;
  --primary-100: #e5ecf5;
  --primary-000: #f2f5fa;
  --secondary1: #1d8583;
  --secondary2: #01a8ae;
  --gray-100: #f3f4f7;
  --gray-200: #ebedf0;
  --gray-300: #dfe2e6;
  --gray-400: #bfc5cd;
  --gray-500: #767676;
  --brd-c1: #bcbcbc;
  --brd-c2: #dfe2e6;
  --brd-c3: #f3f4f7;
  --brd-c4: #d4dfed;
  --c-red: #ec0000;
  --hover: var(--white);
}

.main-header {
  margin-block: 0 4.4em;
  padding-block: 5.56em 2.67em;
  border-bottom: 1px solid var(--text-color);
  background: url(/images/tfsp/main/header_img.svg) no-repeat bottom right 2.5em/280px auto;
}
.main-header h1 {
  font-size: 4rem;
}
@media (max-width: 1280px) {
  .main-header h1 {
    font-size: 3rem;
  }
}
@media (max-width: 768px) {
  .main-header h1 {
    font-size: 2.6rem;
  }
}
.main-header h1 strong {
  font-weight: 600;
}
.main-header h1 span {
  display: block;
}
@media (max-width: 767px) {
  .main-header {
    background-size: 40%;
    background-position: bottom right;
  }
}
@media (max-width: 460px) {
  .main-header {
    background-size: 140px;
    padding-right: 4em;
    padding-bottom: 4em;
  }
  .main-header h1 {
    font-size: 3.2rem;
  }
}
@media (max-width: 460px) and (max-width: 1280px) {
  .main-header h1 {
    font-size: 2.6rem;
  }
}
@media (max-width: 460px) and (max-width: 768px) {
  .main-header h1 {
    font-size: 2.2rem;
  }
}
@media (max-width: 460px) {
  .main-header h1 span {
    display: inline;
  }
}

.cont-mb {
  margin-bottom: 3.56em;
}

.cont-mb-m {
  margin-bottom: 2.22em;
}

/* form */
.budget-box {
  display: flex;
  flex-wrap: wrap;
  margin-top: 1.25em;
  padding: 0.89em 1.25em;
  border: 1px solid var(--brd-c1);
  color: #767676;
  background-color: #fbfbfb;
  gap: 10px;
  font-size: 1.6rem;
}
@media (max-width: 1280px) {
  .budget-box {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .budget-box {
    font-size: 1.4rem;
  }
}
.budget-box span {
  color: var(--text-color);
}
.budget-box strong {
  color: #202AEA;
}

.txt-agreement {
  height: 198px;
  padding: 1.78em 2.22em;
  margin-bottom: 1.1em;
  overflow-y: scroll;
  border: 1px solid var(--brd-c1);
  border-radius: 8px;
  font-weight: 400;
}
.txt-agreement h3,
.txt-agreement h4 {
  font-weight: 500;
  font-size: 1.8rem;
}
@media (max-width: 1280px) {
  .txt-agreement h3,
  .txt-agreement h4 {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .txt-agreement h3,
  .txt-agreement h4 {
    font-size: 1.5rem;
  }
}

.cont-last {
  padding-block: 2.22em;
  border-bottom: 1px solid var(--text-color);
}