@charset "UTF-8";
/************************************************************************************/
/************************************* Colors *************************************/
/************************************************************************************/
:root {
  --white:#fff;
  --black:#000;
  --border-color:#cccccc;
  --bg-color:#fafbfd;
  --point-color:#3853c9;
  --point-over-color: #010A65;
  --point-sub-color:#01a8ae;
  --point-color-bg: #f0f1fa;
  --point-sub-color-bg: #fff5ef;
  --text-color:#566685;
  --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-d8:#d8d8d8;
  --gray-e5:#e5e5e5;
  --gray-e2:#e2e2e2;
  --gray-fa:#fafafa;
  --gray-f8:#f8f8f8;
  --gray-cc:#ccc;
  --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;
}

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

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

h1, h2, h3, h4, h5, h6 {
  line-height: 1.4;
}

a, input, button, select {
  outline-offset: 2px;
  outline-color: #000000;
}

input,
select {
  width: 100%;
  padding: 0.8em 1.2em;
  border: 1px solid #d6d6d6;
  border-radius: 8px;
}

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

/* wrap */
.wrap {
  max-width: 1400px;
  margin: 0 auto;
}
@media (max-width: 1460px) {
  .wrap {
    max-width: 96%;
  }
}
@media (max-width: 768px) {
  .wrap {
    max-width: 94%;
  }
}
@media (max-width: 480px) {
  .wrap {
    max-width: 92%;
  }
}

.wrap-sub {
  max-width: 1400px;
  padding: 0 10px;
  margin: 0 auto;
}
@media (max-width: 1460px) {
  .wrap-sub {
    max-width: 96%;
    padding: 0;
  }
}
@media (max-width: 768px) {
  .wrap-sub {
    max-width: 94%;
  }
}
@media (max-width: 480px) {
  .wrap-sub {
    max-width: 92%;
  }
}

.wrap-form {
  max-width: 800px;
  padding: 0 10px;
  margin: 0 auto;
}
@media (max-width: 1460px) {
  .wrap-form {
    padding: 0;
  }
}

.c-white {
  color: #ffffff;
}

.center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

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

/* margin-common */
.mr-60 {
  margin-right: 60px;
}
@media (max-width: 1416px) {
  .mr-60 {
    margin-right: 40px;
  }
}
@media (max-width: 768px) {
  .mr-60 {
    margin-right: 24px;
  }
}

.pr-60 {
  padding-right: 60px;
}
@media (max-width: 1416px) {
  .pr-60 {
    padding-right: 40px;
  }
}
@media (max-width: 768px) {
  .pr-60 {
    padding-right: 24px;
  }
}

.sub-cont-bottom {
  margin-bottom: 6em;
}
@media (max-width: 1024px) {
  .sub-cont-bottom {
    margin-bottom: 4.8em;
  }
}
@media (max-width: 768px) {
  .sub-cont-bottom {
    margin-bottom: 3.6em;
  }
}

.withdrawal {
  margin: 4em;
}
@media (max-width: 768px) {
  .withdrawal {
    margin: 4em 2em;
  }
}

/*----------------------------- header ------------------------------*/
/* header */
#top-header {
  width: 100%;
  height: 100px;
  padding: 0 48px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#top-header .logo {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  gap: 20px;
}
#top-header .logo a {
  display: block;
  width: 100%;
  height: 100%;
}
#top-header .logo .logo-t {
  width: 192px;
  height: 25px;
  background: url("/images/eum/common/logo_t.svg") no-repeat center/100%;
}
#top-header .logo .logo-s {
  width: 164px;
  height: 25px;
  background: url("/images/eum/common/logo.svg") no-repeat center/100%;
}
#top-header .logo .logo-new {
  width: 429px;
  height: 20px;
  background: url("/images/eum/common/logo_new.svg") no-repeat center/100%;
}
#top-header .nav {
  margin-left: auto;
  margin-right: 0;
}
#top-header .nav nav .btn-nav-close {
  display: none;
}
#top-header .nav nav .dep1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#top-header .nav nav .dep1 > li {
  position: relative;
}
#top-header .nav nav .dep1 > li > a {
  font-size: 2rem;
  font-weight: 500;
  color: #000000;
  text-decoration: none;
  display: block;
  padding: 10px 48px;
  -webkit-transition: ease-in 0.2s;
  transition: ease-in 0.2s;
}
@media (max-width: 1024px) {
  #top-header .nav nav .dep1 > li > a {
    font-size: 1.8rem;
  }
}
@media (max-width: 768px) {
  #top-header .nav nav .dep1 > li > a {
    font-size: 1.7rem;
  }
}
#top-header .nav nav .dep1 > li.active::before, #top-header .nav nav .dep1 > li.active::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  position: absolute;
  top: 0;
  border-radius: 50%;
}
#top-header .nav nav .dep1 > li.active::before {
  left: 50%;
  margin-left: -6px;
  background-color: #3853c9;
}
#top-header .nav nav .dep1 > li.active::after {
  right: 50%;
  margin-right: -6px;
  background-color: #01a8ae;
}
#top-header .nav nav .dep2 {
  display: none;
  position: absolute;
  top: 89px;
  width: 100%;
  height: 380px;
  padding: 1.8em 1.5em 0;
  border-left: 1px solid #d6d6d6;
}
#top-header .nav nav .dep2 li a {
  display: inline-block;
  font-size: 1.6rem;
  color: #5c5c5c;
  padding: 5px 0;
}
#top-header .nav nav .dep2 li a::after {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  margin-top: -3px;
  background-color: #000000;
  -webkit-transition: ease 0.2s;
  transition: ease 0.2s;
}
#top-header .nav nav .dep2 li a:hover {
  color: #000000;
}
#top-header .nav nav .dep2 li a:hover::after {
  width: 100%;
}
#top-header .nav nav .dep1 li:first-child .dep2 {
  border-left: 0;
}
#top-header .util {
  margin-left: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#top-header .util .header-menu-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#top-header .util .header-menu-list .header-item {
  height: 32px;
  position: relative;
  width: 32px;
}
#top-header .util .header-menu-list .header-mypage a {
  display: inline-block;
  background: url("/images/eum/common/mypage.svg") no-repeat center/24px 24px;
  width: 32px;
  height: 32px;
}
#top-header .util .header-menu-list .header-login {
  height: auto;
  width: auto;
}
#top-header .util .header-menu-list .header-login .header-btn-login {
  font-size: 13px;
  font-weight: 700;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#top-header .util .header-menu-list .header-login .header-btn-login span {
  padding: 0 4px;
}
#top-header .util-burger {
  display: none;
}
#top-header .util-burger .burger {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  min-height: 4.6rem;
  z-index: 2;
}
#top-header .util-burger .burger .nav-hamburger {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.7rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 4rem;
  height: 3.6rem;
}
#top-header .util-burger .burger .nav-hamburger .hamburger-line {
  position: relative;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: 50%;
  height: 0.3rem;
  background-color: #fff;
  z-index: 2;
}
#top-header .util-burger .burger .nav-hamburger .hamburger-base {
  position: absolute;
  inset: 0%;
  background-color: var(--point-color);
  z-index: 1;
}
#top-header .util-burger .burger .close .hamburger-line:first-child {
  -webkit-transform: translate(0px, 5px) rotate(45deg);
          transform: translate(0px, 5px) rotate(45deg);
}
#top-header .util-burger .burger .close .hamburger-line:nth-child(2) {
  -webkit-transform: translate(0px, -5px) rotate(-45deg);
          transform: translate(0px, -5px) rotate(-45deg);
}
#top-header .nav-bg {
  display: none;
  position: absolute;
  top: 130px;
  left: 0;
  width: 100%;
  height: 380px;
  background-color: #fff;
  z-index: 80;
  -webkit-box-shadow: 0 30px 30px -30px rgba(0, 0, 0, 0.2);
          box-shadow: 0 30px 30px -30px rgba(0, 0, 0, 0.2);
}
@media (max-width: 1480px) {
  #top-header {
    padding: 0 2%;
  }
}
@media (max-width: 1440px) {
  #top-header .nav nav .dep1 > li > a {
    padding: 10px 44px;
  }
}
@media (max-width: 1280px) {
  #top-header {
    height: 100px;
  }
  #top-header .util-burger {
    margin-left: 2%;
  }
  #top-header .nav {
    display: none;
    width: 100%;
    height: 100vh;
    position: absolute;
    right: 0;
    top: 60px;
    background: #ffffff;
  }
  #top-header .nav nav {
    width: 100%;
    height: 100vh;
    padding-top: 120px;
    overflow: auto;
  }
  #top-header .nav nav .dep1 {
    display: block;
  }
  #top-header .nav nav .dep1 > li {
    padding: 0 40px 1em;
    margin-bottom: 1em;
    border-bottom: 1px solid #d6d6d6;
  }
  #top-header .nav nav .dep1 > li:last-child {
    border-bottom: 0;
  }
  #top-header .nav nav .dep1 > li > a {
    padding: 12px;
    font-size: 2.4rem;
    font-weight: 700;
  }
  #top-header .nav nav .dep1 > li .ele-br {
    display: block;
    line-height: 0;
  }
  #top-header .nav nav .dep1 > li.active::before, #top-header .nav nav .dep1 > li.active::after {
    display: none;
  }
  #top-header .nav nav .dep2 {
    position: static;
    height: auto;
    top: 0;
    border-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding: 0;
  }
  #top-header .nav nav .dep2 li a {
    padding: 12px;
  }
  #top-header .util-burger {
    display: block;
  }
  #top-header .nav-bg {
    display: none;
  }
}
@media (max-width: 768px) {
  #top-header {
    padding: 0 3%;
    height: 60px;
  }
  #top-header .logo {
    width: 70%;
  }
  #top-header .util-member {
    width: 40px;
    height: 40px;
    background-size: 21px 20px;
  }
  #top-header .nav .btn-nav-close {
    top: 10px;
    right: 12px;
  }
  #top-header .nav .btn-nav-close a {
    width: 40px;
    height: 40px;
  }
  #top-header .nav nav {
    padding-top: 40px;
  }
  #top-header .nav nav .dep1 > li {
    padding: 0 5% 1em;
  }
  #top-header .nav nav .dep1 > li > a {
    font-size: 2rem;
  }
  #top-header .nav nav .dep2 li a {
    padding: 8px 12px;
    font-size: 1.4rem;
  }
}
@media (max-width: 480px) {
  #top-header .logo {
    width: 60%;
  }
}

/*----------------------------- footer ------------------------------*/
.site-footer {
  padding: clamp(36px, 4vw, 80px) 0;
  color: #111;
  border-top: 1px solid var(--gray-cc);
  /* 상단 링크 */
  /* 회사 정보 줄 */
  /* 카피라이트 */
}
.site-footer .footer-container {
  max-width: 1400px;
  margin: 0 auto;
  padding-inline: clamp(16px, 4vw, 32px);
}
.site-footer .footer-links {
  /* 구분 점(•) */
}
.site-footer .footer-links ul {
  margin-bottom: clamp(24px, 4vw, 64px);
  padding-bottom: clamp(20px, 3.5vw, 64px);
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(10px, 2.2vw, 18px);
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  font-size: clamp(14px, 1.2vw, 15px);
  border-bottom: 1px solid #d6d6d6;
}
.site-footer .footer-links a {
  text-decoration: none;
  color: #222;
  -webkit-transition: color 0.15s;
  transition: color 0.15s;
}
.site-footer .footer-links a:hover {
  color: #3b82f6;
}
.site-footer .footer-links a.is-active {
  color: #3b82f6;
}
.site-footer .footer-links li + li {
  position: relative;
  padding-left: 18px;
}
.site-footer .footer-links li + li::before {
  content: " ";
  position: absolute;
  left: -2px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background: #c7cdd6;
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.site-footer .footer-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: clamp(12px, 6vw, 65px);
  padding: 0;
  margin: 0 0 10px;
  list-style: none;
  font-size: 15px;
  color: #111;
}
@media (min-width: 780px) {
  .site-footer .footer-info {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.site-footer .footer-info .info-item {
  white-space: nowrap;
  max-width: 100%;
}
.site-footer .footer-copy {
  margin: 6px 0 0;
  font-size: 1.4rem;
  color: #98a1ad;
}
@media (max-width: 1024px) {
  .site-footer .footer-copy {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .site-footer .footer-copy {
    font-size: 1.2rem;
  }
}

/* 메인 비주얼 */
.main-visual {
  position: relative;
  background: url("/images/eum/main/mV01.jpg") repeat center/cover;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 70vh;
  /* ===== 위치 지정 ===== */
  /* ===== 애니메이션 ===== */
  /* 딜레이 */
}
@media (max-width: 1024px) {
  .main-visual {
    min-height: 30vh;
  }
}
@media (max-width: 768px) {
  .main-visual {
    min-height: 30vh;
    background: url("/images/eum/main/mV01_m.jpg") repeat center/cover;
    overflow: hidden;
  }
  .main-visual::before {
    content: "";
    display: block;
    position: absolute;
    background: url("/images/eum/main/main_m_bg.svg") no-repeat center/374px 300px;
    right: 0;
    bottom: -20px;
    width: 437px;
    height: 300px;
  }
}
.main-visual .visual-container {
  max-width: 1920px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (min-width: 1024px) {
  .main-visual .visual-container {
    height: 720px;
    min-height: auto;
    padding: 0;
  }
}
@media (max-width: 1024px) {
  .main-visual .visual-container {
    height: 520px;
  }
}
@media (max-width: 768px) {
  .main-visual .visual-container {
    height: 800px;
    grid-template-columns: 1fr;
    text-align: center;
  }
}
.main-visual .visual-text {
  text-align: center;
  margin-top: 65px;
}
@media (max-width: 768px) {
  .main-visual .visual-text {
    margin-top: 0;
  }
}
.main-visual .visual-text h2 {
  font-size: 5.2rem;
  font-weight: 600;
  line-height: 1.3;
  color: #111;
}
@media (max-width: 1024px) {
  .main-visual .visual-text h2 {
    font-size: 4.2rem;
  }
}
@media (max-width: 768px) {
  .main-visual .visual-text h2 {
    font-size: 2.8rem;
  }
}
.main-visual .visual-text h2 strong {
  font-size: 8rem;
  font-weight: 700;
}
@media (max-width: 1024px) {
  .main-visual .visual-text h2 strong {
    font-size: 6.5rem;
  }
}
@media (max-width: 768px) {
  .main-visual .visual-text h2 strong {
    font-size: 4.4rem;
  }
}
.main-visual .visual-text p {
  margin-top: 12px;
  font-size: 3.6rem;
  color: #333;
}
@media (max-width: 1024px) {
  .main-visual .visual-text p {
    font-size: 2.8rem;
  }
}
@media (max-width: 768px) {
  .main-visual .visual-text p {
    font-size: 2.4rem;
  }
}
.main-visual .visual-deco {
  position: absolute;
  inset: 0; /* 섹션 전체를 덮는 레이어 */
  pointer-events: none; /* 클릭 방해 X */
}
.main-visual .deco-item {
  position: absolute;
  width: clamp(30px, 2.2vw, 56px);
  height: auto;
  -webkit-filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.08));
          filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.08));
  opacity: 0.95;
}
.main-visual .deco-scissors {
  left: 7%;
  top: 38%;
  rotate: -12deg;
}
.main-visual .deco-yarn {
  left: 24%;
  top: 20%;
}
.main-visual .deco-yarn2 {
  left: 43%;
  top: 22%;
}
.main-visual .deco-yarn3 {
  left: 62%;
  top: 30%;
}
.main-visual .deco-pincushion {
  left: 32%;
  top: 33%;
}
.main-visual .deco-button {
  right: 16%;
  top: 23%;
}
.main-visual .deco-bobbin {
  right: 20%;
  top: 36%;
  rotate: 18deg;
}
@-webkit-keyframes floatY {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes floatY {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes floatX {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes floatX {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(20px);
            transform: translateX(20px);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
.main-visual .float-y {
  -webkit-animation: floatY 3.6s ease-in-out infinite;
          animation: floatY 3.6s ease-in-out infinite;
}
.main-visual .float-y-slow {
  -webkit-animation: floatY 5.2s ease-in-out infinite;
          animation: floatY 5.2s ease-in-out infinite;
}
.main-visual .float-x {
  -webkit-animation: floatX 4.2s ease-in-out infinite;
          animation: floatX 4.2s ease-in-out infinite;
}
.main-visual .deco-scissors {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.main-visual .deco-yarn {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.main-visual .deco-pincushion {
  -webkit-animation-delay: 1.1s;
          animation-delay: 1.1s;
}
.main-visual .deco-button {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
.main-visual .deco-bobbin {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

@media (max-width: 768px) {
  .main-visual .deco-scissors {
    left: 10%;
    top: 82%;
  }
  .main-visual .deco-yarn {
    left: 14%;
    top: 12%;
  }
  .main-visual .deco-yarn2 {
    left: 40%;
    top: 20%;
  }
  .main-visual .deco-yarn3 {
    left: 62%;
    top: 30%;
  }
  .main-visual .deco-pincushion {
    left: 17%;
    top: 53%;
  }
  .main-visual .deco-button {
    right: 12%;
    top: 13%;
  }
  .main-visual .deco-bobbin {
    right: 10%;
    top: 52%;
  }
}
.factory-finder {
  padding: 135px 0 0;
}
.factory-finder .section-title {
  text-align: center;
  margin-bottom: clamp(24px, 4vw, 40px);
}
.factory-finder .section-title .title {
  margin: 0 0 10px;
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 300;
  letter-spacing: -0.02em;
  color: #111;
}
.factory-finder .section-title .title strong {
  font-weight: 800;
}
.factory-finder .section-title .desc {
  margin: 0;
  font-size: clamp(14px, 2vw, 18px);
  color: #444;
}
@media (max-width: 1024px) {
  .factory-finder {
    padding: 6% 0 0;
  }
}

.register {
  max-width: 1400px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}
.register .register-link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  padding: 15px 50px;
  background: #6f7a8a;
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  text-decoration: none;
  border-radius: 40px 40px 0 0;
}
.register .register-link .ico {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 20px;
  height: 20px;
  border: 2px solid #fff;
  border-radius: 50%;
  font-size: 14px;
  line-height: 1;
}
.register .register-link em {
  font-style: normal;
  font-weight: 400;
  opacity: 0.85;
  font-size: 14px;
}
.register .register-link:hover {
  background: #5c6573;
}

.finder-band {
  position: relative;
  background: #edf1fd;
  border-radius: 0 200px 0 200px;
  --curve-h: clamp(120px, 18vw, 200px);
  /* 지도 */
  /* 패널 */
}
@media (max-width: 1400px) {
  .finder-band {
    border-radius: 0 100px 0 100px;
  }
}
@media (max-width: 768px) {
  .finder-band {
    border-radius: 0 30px 0 30px;
  }
}
.finder-band::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 0;
  bottom: -200px;
  height: var(--curve-h);
  background: #fff;
  /* 큰 반원 형태로 위쪽만 둥글게 */
  border-top-left-radius: 0;
  border-top-right-radius: 9999px;
  z-index: 0;
}
.finder-band .band-container,
.finder-band .band-illust,
.finder-band .band-bgtext {
  position: relative;
  z-index: 1;
}
.finder-band .band-container {
  max-width: 1400px;
  margin: 0 auto;
  padding: 5rem 0;
  position: relative;
}
@media (max-width: 1400px) {
  .finder-band .band-container {
    padding: 5rem 3rem;
  }
}
.finder-band .finder-header {
  margin-bottom: 12px;
  text-align: left;
}
.finder-band .finder-title {
  margin: 0;
  font-size: clamp(20px, 2.6vw, 40px);
  font-weight: 800;
  color: #1a2a57;
}
.finder-band .finder-title strong {
  color: #0b3a9e;
}
.finder-band .finder-surface {
  border-radius: 42px;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(14px, 2.4vw, 28px);
}
@media (min-width: 1024px) {
  .finder-band .finder-surface {
    grid-template-columns: 1.1fr 0.9fr; /* 지도 : 패널 */
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.finder-band .finder-map {
  position: relative;
}
.finder-band .finder-map img {
  display: block;
}
@media (max-width: 1024px) {
  .finder-band .finder-map img {
    margin: 0 auto;
  }
}
.finder-band .finder-map .map-next {
  position: absolute;
  inset: 0;
  opacity: 0;
  -webkit-transform: translateY(10px);
          transform: translateY(10px);
  -webkit-transition: opacity 0.35s ease, -webkit-transform 0.35s ease;
  transition: opacity 0.35s ease, -webkit-transform 0.35s ease;
  transition: opacity 0.35s ease, transform 0.35s ease;
  transition: opacity 0.35s ease, transform 0.35s ease, -webkit-transform 0.35s ease;
  will-change: transform, opacity;
  border-radius: inherit;
}
.finder-band .finder-map .is-in {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .finder-band .finder-map .map-next {
    -webkit-transition: none;
    transition: none;
    -webkit-transform: none;
            transform: none;
  }
}
.finder-band .finder-panel {
  padding: clamp(12px, 2vw, 18px);
}
.finder-band .finder-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}
@media (min-width: 520px) {
  .finder-band .finder-list {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1120px) {
  .finder-band .finder-list {
    grid-template-columns: repeat(3, 1fr);
  }
}
.finder-band .finder-item {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 100%;
  border: 2px solid transparent;
  background: #ffffff;
  border-radius: 999px;
  padding: 10px 14px;
  display: grid;
  grid-template-columns: 1fr auto auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  cursor: pointer;
  -webkit-box-shadow: 0 2px 0 rgba(16, 30, 68, 0.03);
          box-shadow: 0 2px 0 rgba(16, 30, 68, 0.03);
  -webkit-transition: border-color 0.15s, background 0.15s, color 0.15s, -webkit-box-shadow 0.15s;
  transition: border-color 0.15s, background 0.15s, color 0.15s, -webkit-box-shadow 0.15s;
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s, color 0.15s;
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s, color 0.15s, -webkit-box-shadow 0.15s;
}
.finder-band .finder-item .label {
  font-weight: 700;
  color: #2a3242;
}
.finder-band .finder-item .count {
  min-width: 34px;
  height: 30px;
  border-radius: 8px;
  background: #eef0f4;
  color: #485162;
  font-weight: 800;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 13px;
}
.finder-band .finder-item .arrow {
  color: #9aa4b4;
  font-size: 18px;
  padding-right: 2px;
}
.finder-band .finder-item:hover, .finder-band .finder-item:focus-visible {
  border-color: #0b3a9e;
  -webkit-box-shadow: 0 6px 16px rgba(29, 61, 146, 0.08);
          box-shadow: 0 6px 16px rgba(29, 61, 146, 0.08);
  outline: none;
}
.finder-band .finder-item:hover .label, .finder-band .finder-item:hover .arrow, .finder-band .finder-item:focus-visible .label, .finder-band .finder-item:focus-visible .arrow {
  color: #0b3a9e;
}
.finder-band .finder-item:hover .count, .finder-band .finder-item:focus-visible .count {
  background: #0b3a9e;
  color: #fff;
}
.finder-band .finder-item.is-active {
  border-color: #0b3a9e;
}
.finder-band .finder-item.is-active .label {
  color: #0b3a9e;
}
.finder-band .finder-item.is-active .count {
  background: #0b3a9e;
  color: #fff;
}
.finder-band .finder-item.is-active .arrow {
  color: #0b3a9e;
}
.finder-band .band-illust {
  position: absolute;
  right: max(24px, 50% - 700px); /* 1400px 컨테이너 기준 밖으로 안나가게 */
  bottom: 0;
  width: clamp(180px, 20vw, 280px);
  height: auto;
  pointer-events: none;
  z-index: 2; /* 곡면보다 위 */
}
.finder-band .band-bgimg {
  position: absolute;
  bottom: -15px;
  width: 180px;
  right: 50px;
  z-index: 9;
}
@media (max-width: 1700px) {
  .finder-band .band-bgimg {
    bottom: -15%;
  }
}
@media (max-width: 1400px) {
  .finder-band .band-bgimg {
    width: 120px;
  }
}
@media (max-width: 1024px) {
  .finder-band .band-bgimg {
    bottom: -5%;
    width: 100px;
  }
}
@media (max-width: 480px) {
  .finder-band .band-bgimg {
    bottom: -1%;
    width: 80px;
  }
}
.finder-band .band-bgtext {
  position: absolute;
  left: 50%;
  bottom: -15px;
  -webkit-transform: translateX(-20%);
          transform: translateX(-20%);
  font-weight: 800;
  color: rgba(255, 255, 255, 0.7);
  font-size: 10rem;
  z-index: 1;
  line-height: 1;
}
@media (max-width: 1024px) {
  .finder-band .band-bgtext {
    display: none;
  }
}

.finder-wrap {
  margin-top: 4rem;
}
.finder-wrap a {
  font-weight: 600;
  display: inline-block;
  border-bottom: 2px solid #000;
}
.finder-wrap a span {
  color: var(--point-color);
}

/* 섹션 */
.vendor {
  padding: 140px 0 100px;
}
@media (max-width: 1400px) {
  .vendor {
    padding: 10rem 3rem;
  }
}
@media (max-width: 768px) {
  .vendor {
    padding: 6rem 3rem;
  }
}
.vendor .vendor-container {
  max-width: 1380px;
  margin: 0 auto;
}
.vendor .vendor-header {
  text-align: center;
  margin-bottom: clamp(24px, 3vw, 40px);
}
.vendor .vendor-title {
  margin: 0 0 10px;
  font-weight: 800;
  font-size: clamp(28px, 3.2vw, 40px);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #111;
}
.vendor .vendor-desc {
  margin: 0;
  color: #4b4b4b;
  font-size: clamp(14px, 1.7vw, 16px);
}
.vendor .vendor-grid {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
}
@media (min-width: 680px) {
  .vendor .vendor-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .vendor .vendor-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 34px;
  }
}

/* 카드(배경/그림자 없음, 이미지에만 라운딩) */
.vendor-card {
  background: transparent; /* 카드 바탕 제거 */
  -webkit-box-shadow: none;
          box-shadow: none; /* 카드 그림자 제거 */
  border-radius: 0; /* 카드 라운딩 제거 */
  overflow: visible; /* 이미지 밖 텍스트 영역 분리 */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.vendor-card figure {
  border-radius: 30px;
  overflow: hidden;
}
.vendor-card .vendor-media {
  margin: 0 0 14px;
  line-height: 0;
  overflow: hidden; /* 이미지 라운딩 적용을 위해 감싸는 요소에 숨김 */
  border-radius: 22px; /* 이미지만 둥글게 */
}
.vendor-card .vendor-media img {
  display: block;
  width: 100%;
  height: clamp(180px, 24vw, 240px);
  -o-object-fit: cover;
     object-fit: cover;
}
.vendor-card .vendor-body {
  padding: 30px 0 0;
}
.vendor-card .vendor-pill {
  display: inline-block;
  padding: 8px 25px;
  border-radius: 999px;
  font-weight: 600;
  line-height: 1;
  color: #fff;
  margin-bottom: 15px;
}
.vendor-card .vendor-pill-green {
  background: #00a03f;
}
.vendor-card .vendor-pill-pink {
  background: #ff88bd;
}
.vendor-card .vendor-pill-teal {
  background: #0ba4ce;
}
.vendor-card .vendor-pill-1 {
  background: #00a03f;
}
.vendor-card .vendor-pill-2 {
  background: #ff88bd;
}
.vendor-card .vendor-pill-3 {
  background: #0ba4ce;
}
.vendor-card .vendor-pill-4 {
  background: #f97700;
}
.vendor-card .vendor-pill-5 {
  background: #c638c8;
}
.vendor-card .vendor-pill-6 {
  background: #3853c9;
}
.vendor-card .vendor-pill-99 {
  background: #d40c48;
}
.vendor-card .vendor-name {
  margin: 0 0 6px;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: #111;
}
.vendor-card .vendor-meta {
  margin: 0 0 14px;
  color: #8e8e8e;
  font-size: 14px;
}
.vendor-card .vendor-meta span {
  margin: 0 8px;
  color: #e9ebef;
}
.vendor-card .vendor-chips {
  list-style: none;
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 10px;
}
.vendor-card .vendor-chips .chip {
  background: #f5f7fb;
  border: 1px solid #e9ebef;
  color: #4b4b4b;
  font-size: 1.4rem;
  padding: 8px 12px;
  border-radius: 12px;
  white-space: nowrap;
}
@media (max-width: 1024px) {
  .vendor-card .vendor-chips .chip {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .vendor-card .vendor-chips .chip {
    font-size: 1.2rem;
  }
}

/* 데스크톱에서만 줄바꿈 유지 */
.only-desktop {
  display: none;
}

@media (min-width: 1024px) {
  .only-desktop {
    display: inline;
  }
}
/* 섹션 레이아웃 */
.workmatch {
  padding: 14rem 0;
  background: #efefef;
  /* 카드 그리드 */
}
@media (max-width: 1400px) {
  .workmatch {
    padding: 10rem 3rem;
  }
}
@media (max-width: 768px) {
  .workmatch {
    padding: 6rem 3rem;
  }
}
.workmatch .workmatch-container {
  max-width: 1400px;
  margin: 0 auto;
}
.workmatch .workmatch-header {
  position: relative;
  margin-bottom: 18px;
}
.workmatch .workmatch-tit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 20px;
}
.workmatch .workmatch-tit .workmatch-title {
  margin: 0;
  font-weight: 800;
  font-size: 4.8rem;
}
@media (max-width: 1280px) {
  .workmatch .workmatch-tit .workmatch-title {
    font-size: 4rem;
  }
}
@media (max-width: 1024px) {
  .workmatch .workmatch-tit .workmatch-title {
    font-size: 3.4rem;
  }
}
@media (max-width: 768px) {
  .workmatch .workmatch-tit .workmatch-title {
    font-size: 3rem;
  }
}
.workmatch .workmatch-tit .workmatch-more {
  padding: 10px 30px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 1.4rem;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #000;
}
@media (max-width: 1024px) {
  .workmatch .workmatch-tit .workmatch-more {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .workmatch .workmatch-tit .workmatch-more {
    font-size: 1.2rem;
  }
}
.workmatch .workmatch-desc {
  margin: 12px 0 24px;
  color: #5b636e;
  font-size: 1.8rem;
}
@media (max-width: 1024px) {
  .workmatch .workmatch-desc {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .workmatch .workmatch-desc {
    font-size: 1.5rem;
  }
}
.workmatch .workmatch-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 30px;
  grid-template-columns: 1fr;
}
@media (min-width: 740px) {
  .workmatch .workmatch-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1060px) {
  .workmatch .workmatch-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* 카드 */
.wm-card {
  background: #fff;
  border-radius: 14px;
  -webkit-box-shadow: 0 10px 28px rgba(16, 30, 68, 0.08);
          box-shadow: 0 10px 28px rgba(16, 30, 68, 0.08);
  padding: 30px;
  min-height: 190px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 10px;
  /* 메타 정보 */
  /* 카테고리 pill */
  /* D-day 뱃지 */
  /* 마감완료 표기 */
  /* 호버 */
}
.wm-card .wm-card-head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.wm-card .wm-title {
  margin: 2px 0 8px;
  font-size: 1.8rem;
  font-weight: 800;
  color: #1d2430;
}
@media (max-width: 1024px) {
  .wm-card .wm-title {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .wm-card .wm-title {
    font-size: 1.5rem;
  }
}
.wm-card .wm-meta {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.wm-card .wm-row {
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 10px;
  font-size: 1.6rem;
}
@media (max-width: 1024px) {
  .wm-card .wm-row {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .wm-card .wm-row {
    font-size: 1.4rem;
  }
}
.wm-card .wm-row dd {
  margin: 0;
  color: #2b3240;
}
.wm-card .wm-row a {
  color: #6c757d;
  text-decoration: none;
  font-weight: 700;
}
.wm-card .wm-pill {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 28px;
  padding: 0 30px;
  border-radius: 999px;
  font-size: 1.4rem;
  font-weight: 800;
  color: #fff;
  /* 생산 */
  /* 기능 */
  /* 가공 */
  /* 포장 */
  /* 검품 */
  /* 사무 */
}
@media (max-width: 1024px) {
  .wm-card .wm-pill {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .wm-card .wm-pill {
    font-size: 1.2rem;
  }
}
.wm-card .wm-pill-green {
  background: #00a03f;
}
.wm-card .wm-pill-teal {
  background: #0ba4ce;
}
.wm-card .wm-pill-pink {
  background: #ff88bd;
}
.wm-card .wm-pill-orange {
  background: #f97700;
}
.wm-card .wm-pill-purple {
  background: #c638c8;
}
.wm-card .wm-pill-blue {
  background: #3853c9;
}
.wm-card .wm-pill-1 {
  background: #00a03f;
}
.wm-card .wm-pill-2 {
  background: #0ba4ce;
}
.wm-card .wm-pill-3 {
  background: #ff88bd;
}
.wm-card .wm-pill-4 {
  background: #f97700;
}
.wm-card .wm-pill-9 {
  background: #3853c9;
}
.wm-card .wm-dday {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eef0f4;
  color: #485162;
  font-weight: 800;
  font-size: 1.4rem;
}
@media (max-width: 1024px) {
  .wm-card .wm-dday {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .wm-card .wm-dday {
    font-size: 1.2rem;
  }
}
.wm-card .wm-badge-done {
  font-style: normal;
  margin-left: 8px;
  font-size: 1.6rem;
  font-weight: 700;
  color: #ffffff;
  background: transparent; /* 닫힘 카드에서 반전되어 보임 */
}
@media (max-width: 1024px) {
  .wm-card .wm-badge-done {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .wm-card .wm-badge-done {
    font-size: 1.4rem;
  }
}
.wm-card:hover {
  -webkit-box-shadow: 0 14px 34px rgba(16, 30, 68, 0.12);
          box-shadow: 0 14px 34px rgba(16, 30, 68, 0.12);
}

/* 닫힘(회색) 상태 */
.wm-card.is-closed {
  background: rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: none;
          box-shadow: none;
}
.wm-card.is-closed .wm-pill {
  background: #4b4b4b !important;
}
.wm-card.is-closed .wm-dday {
  opacity: 0.6;
}

/* 조밀한 레이아웃 보정(아주 작은 모바일) */
@media (max-width: 360px) {
  .wm-card {
    padding: 16px;
  }
  .wm-row {
    grid-template-columns: 42px 1fr;
  }
}