:root {
      --yjb-black: #222;
      --yjb-gray: #555;
      --yjb-light: #f7f7f7;
      --yjb-line: #ddd;
      --yjb-inner: 1440px;
      --yjb-side: clamp(20px, 12.5vw, 240px);
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      color: var(--yjb-black);
      background: #fff;
      font-family: Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    .yjb-main-wrap,
    .yjb-main-wrap button {
      font: inherit;
    }

    .yjb-main-wrap {
      width: 100%;
      min-width: 280px;
      overflow: hidden;
    }

    .yjb-main-wrap img {
      display: block;
      width: 100%;
    }

    .yjb-main-wrap a {
      text-decoration: none;
    }

    .yjb-inner {
      width: 100%;
      max-width: var(--yjb-inner);
      margin: 0 auto;
    }

    .yjb-section-title {
      margin: 0;
      font-size: 32px;
      font-weight: 700;
      line-height: 1.4;
      letter-spacing: -0.01em;
    }

    .yjb-more-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      width: 100%;
      min-height: 50px;
      padding: 12px 22px;
      border-radius: 999px;
      background: #f1f1f1;
      color: var(--yjb-gray);
      font-size: 16px;
      font-weight: 500;
      line-height: 1.35;
      transition: color .2s ease, background .2s ease, transform .2s ease;
    }

    .yjb-more-btn img {
      width: 20px;
      height: 20px;
    }

    .yjb-more-btn:hover,
    .yjb-more-btn:focus-visible {
      color: #fff;
      background: #222;
      transform: translateY(-2px);
    }

    .yjb-main-wrap a:focus-visible,
    .yjb-main-wrap button:focus-visible {
      outline: 3px solid #7d4dff;
      outline-offset: 3px;
    }

    /* main-banner */
    .yjb-main-banner {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 360px;
      padding: 150px 20px 42px;
      color: #fff;
      text-align: center;
      background: #45403e url("/layouts/xedition/main_2026_assets/optimized/hero.jpg") center / cover no-repeat;
    }

    .yjb-main-banner::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, rgba(0, 0, 0, .4), rgba(0, 0, 0, .4));
    }

    .yjb-main-banner-line {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 24px;
    }

    .yjb-main-banner-label {
      margin: 0;
      padding: 3px 8px;
      background: rgba(255, 255, 255, .8);
      box-shadow: 0 0 40px rgba(0, 0, 0, .3);
      color: rgba(34, 34, 34, .8);
      font-size: 18px;
      font-weight: 600;
      line-height: 1.5;
      letter-spacing: -0.01em;
    }

    .yjb-main-banner-title {
      margin: 0;
      font-size: 52px;
      font-weight: 600;
      line-height: 1.35;
      letter-spacing: -0.01em;
      text-shadow: 0 0 40px rgba(0, 0, 0, .3);
    }

    .yjb-main-banner-desc {
      margin: 0;
      color: rgba(255, 255, 255, .8);
      font-size: 20px;
      font-weight: 500;
      line-height: 1.7;
      letter-spacing: -0.01em;
      text-shadow: 0 0 40px rgba(0, 0, 0, .3);
    }

    /* main-sec02 */
    .yjb-main-sec02 {
      padding: 60px var(--yjb-side);
    }

    .yjb-main-sec02-line {
      display: flex;
      align-items: stretch;
      gap: 46px;
    }

    .yjb-news-panel,
    .yjb-sns-panel {
      display: flex;
      flex: 1 1 0;
      min-width: 0;
      flex-direction: column;
      gap: 24px;
    }

    .yjb-news-panel {
      justify-content: flex-start;
      gap: 0;
    }

    .yjb-news-swiper {
      width: 100%;
      min-width: 0;
      padding: 2px 2px 0;
      margin-top: 24px;
      margin-bottom: 0;
    }

    .yjb-news-card {
      display: block;
      overflow: hidden;
      height: 100%;
      border-radius: 16px;
      background: #fff;
    }

    .yjb-news-image {
      overflow: hidden;
      aspect-ratio: 16 / 11;
      background: #eee;
    }

    .yjb-news-image img {
      height: 100%;
      object-fit: cover;
      transition: transform .35s ease;
    }

    .yjb-news-card:hover .yjb-news-image img {
      transform: scale(1.035);
    }

    .yjb-news-text {
      display: flex;
      min-height: 120px;
      flex-direction: column;
      justify-content: space-between;
      gap: 16px;
      padding: 20px;
      background: #f1f1f1;
    }

    .yjb-news-subject {
      margin: 0;
      font-size: 18px;
      font-weight: 600;
      line-height: 1.4;
      letter-spacing: -0.01em;
      display: -webkit-box;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .yjb-news-date {
      color: #999;
      font-size: 14px;
      line-height: 1.4;
    }

    .yjb-news-card:hover .yjb-news-subject {
      text-decoration: underline;
      text-underline-offset: 4px;
    }

    .yjb-slider-pagination {
      bottom: 8px !important;
    }

    .yjb-main-wrap .yjb-news-pagination {
      position: static !important;
      top: auto !important;
      right: auto !important;
      bottom: auto !important;
      left: auto !important;
      display: block;
      width: 100% !important;
      margin: 10px 0 17px;
      text-align: center;
      transform: none !important;
    }

    .yjb-slider-pagination .swiper-pagination-bullet-active {
      background: #7d4dff;
    }

    .yjb-sns-swiper {
      width: 100%;
      min-width: 0;
      overflow: hidden;
    }

    .yjb-sns-swiper .swiper-slide {
      width: calc((100% - 24px) / 3);
    }

    .yjb-sns-card {
      position: relative;
      display: block;
      width: 100%;
      overflow: hidden;
      aspect-ratio: 252 / 316;
      border-radius: 16px;
      background: #eee;
    }

    .yjb-sns-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform .35s ease;
    }

    .yjb-sns-card:hover img {
      transform: scale(1.035);
    }

    .yjb-social-links {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .yjb-social-link {
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 72px;
      padding: 20px 28px;
      border-radius: 12px;
      background: #fff;
      box-shadow: 4px 4px 12px rgba(0, 0, 0, .1);
      font-size: 18px;
      font-weight: 500;
    }

    .yjb-kakao-link {
      background: #fee500;
      color: #1f1f1f;
      font-weight: 700;
      box-shadow: 4px 4px 14px rgba(254, 229, 0, .28);
    }

    .yjb-main-wrap .yjb-kakao-link {
      color: #1f1f1f;
      font-weight: 700;
    }

    .yjb-main-wrap .yjb-kakao-link .yjb-social-name {
      font-weight: 700;
    }

    .yjb-kakao-link:hover,
    .yjb-kakao-link:focus-visible {
      background: #ffd900;
      color: #111;
    }

    .yjb-social-name {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .yjb-social-name img,
    .yjb-social-link > img {
      width: 24px;
      height: 24px;
      object-fit: contain;
    }

    /* common horizontal showcase */
    .yjb-showcase {
      position: relative;
      padding: 80px 0 80px var(--yjb-side);
    }

    .yjb-showcase-line {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: stretch;
      gap: 120px;
      width: 100%;
      min-width: 0;
    }

    .yjb-showcase-head {
      position: relative;
      z-index: 3;
      display: flex;
      flex: 0 0 400px;
      flex-direction: column;
      justify-content: space-between;
      padding: 40px 0 60px;
    }

    .yjb-showcase-action {
      display: flex;
      flex-direction: column;
      gap: 24px;
      margin-top: auto;
    }

    .yjb-showcase-title {
      margin: 0;
      font-size: 44px;
      font-weight: 700;
      line-height: 1.35;
      letter-spacing: -0.01em;
      word-break: keep-all;
      overflow-wrap: normal;
    }

    .yjb-showcase-desc {
      margin: 14px 0 0;
      color: rgba(34, 34, 34, .72);
      font-size: 18px;
      font-weight: 500;
      line-height: 1.55;
      letter-spacing: -0.01em;
      word-break: keep-all;
    }

    .yjb-main-sec04 .yjb-showcase-desc {
      color: rgba(255, 255, 255, .78);
    }

    .yjb-showcase-link {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      width: 100%;
      padding: 24px 28px;
      border-radius: 12px;
      background: #fff;
      box-shadow: 4px 4px 12px rgba(0, 0, 0, .1);
      font-size: 18px;
      font-weight: 600;
      transition: transform .2s ease;
    }

    .yjb-main-wrap .yjb-showcase-link {
      color: #222;
      font-size: 18px;
      font-weight: 600;
      line-height: 1.4;
      text-decoration: none;
    }

    .yjb-showcase-link:hover {
      transform: translateY(-3px);
    }

    .yjb-showcase-link img {
      width: 24px;
      height: 24px;
    }

    .yjb-showcase-swiper {
      position: relative;
      z-index: 1;
      flex: 1 1 auto;
      width: 100%;
      min-width: 0;
      padding: 4px 2px 52px;
    }

    .yjb-showcase-card {
      display: block;
      width: 100%;
    }

    .yjb-showcase-image {
      overflow: hidden;
      width: 300px;
      height: 427px;
      border-radius: 24px;
      background: #ddd;
    }

    .yjb-showcase-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform .4s ease;
    }

    .yjb-showcase-card:hover .yjb-showcase-image img {
      transform: scale(1.04);
    }

    .yjb-slider-controls {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-top: 0;
    }

    .yjb-slider-prev,
    .yjb-slider-next {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 46px;
      height: 46px;
      padding: 0;
      border: 1px solid rgba(34, 34, 34, .25);
      border-radius: 50%;
      background: rgba(255, 255, 255, .75);
      color: #222;
      cursor: pointer;
    }

    .yjb-main-sec04 .yjb-slider-prev,
    .yjb-main-sec04 .yjb-slider-next {
      border-color: rgba(255, 255, 255, .5);
      background: rgba(255, 255, 255, .14);
      color: #fff;
    }

    .yjb-showcase-caption {
      overflow: hidden;
      margin: 22px 0 0;
      font-size: 18px;
      font-weight: 600;
      line-height: 1.35;
      text-align: center;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    /* main-sec03 */
    .yjb-main-sec03 {
      background: rgba(252, 249, 252, .8) url("/layouts/xedition/main_2026_assets/optimized/career-bg.jpg") center / cover no-repeat;
    }

    /* main-sec04 */
    .yjb-main-sec04 {
      color: #fff;
      background: #000 url("/layouts/xedition/main_2026_assets/optimized/gallery-bg.jpg") left center / 70% auto no-repeat;
    }

    .yjb-main-sec04::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, .7);
    }

    .yjb-main-sec04 .yjb-showcase-caption {
      color: #fff;
    }

    .yjb-main-sec04 .yjb-showcase-link {
      color: #fff;
      background: rgba(255, 255, 255, .15);
      box-shadow: 4px 4px 24px rgba(0, 0, 0, .1);
      backdrop-filter: blur(16px);
    }

    .yjb-main-wrap .yjb-main-sec04 .yjb-showcase-link {
      color: #fff;
    }

    /* main-sec05 */
    .yjb-main-sec05 {
      padding: 60px var(--yjb-side);
    }

    .yjb-main-sec05-line {
      display: flex;
      align-items: stretch;
      gap: 46px;
    }

    .yjb-interview-panel,
    .yjb-facility-panel {
      display: flex;
      flex: 1 1 0;
      min-width: 0;
      flex-direction: column;
      gap: 24px;
    }

    .yjb-interview-list {
      display: flex;
      flex: 1 1 auto;
      flex-direction: column;
      gap: 18px;
    }

    .yjb-interview-card {
      display: flex;
      flex: 1 1 0;
      align-items: center;
      gap: 24px;
      min-height: 156px;
      padding: 20px;
      border-radius: 12px;
      background: var(--yjb-light);
      transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
    }

    .yjb-interview-card:hover,
    .yjb-interview-card:focus-visible {
      background: #fff;
      box-shadow: 4px 4px 18px rgba(0, 0, 0, .12);
      transform: translateY(-3px);
    }

    .yjb-interview-card:hover .yjb-interview-title,
    .yjb-interview-card:focus-visible .yjb-interview-title {
      text-decoration: underline;
      text-underline-offset: 4px;
    }

    .yjb-interview-image {
      flex: 0 0 169px;
      width: 169px;
      height: 116px;
      overflow: hidden;
      border-radius: 12px;
    }

    .yjb-interview-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .yjb-interview-info {
      display: flex;
      align-self: stretch;
      flex: 1 1 auto;
      min-width: 0;
      flex-direction: column;
      justify-content: space-between;
      padding: 16px 0;
    }

    .yjb-interview-title {
      display: -webkit-box;
      overflow: hidden;
      margin: 0;
      font-size: 20px;
      font-weight: 600;
      line-height: 1.4;
      letter-spacing: -0.01em;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .yjb-interview-job {
      display: flex;
      gap: 4px;
      margin: 12px 0 0;
      color: #555;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.4;
    }

    .yjb-interview-job span:first-child {
      color: rgba(85, 85, 85, .7);
    }

    .yjb-facility-gallery {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .yjb-facility-main {
      overflow: hidden;
      width: 100%;
      aspect-ratio: 850 / 580;
      border-radius: 16px;
    }

    .yjb-facility-main img,
    .yjb-facility-thumb img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .yjb-facility-main img {
      object-position: center 55%;
    }

    .yjb-facility-thumbs {
      display: flex;
      gap: 14px;
    }

    .yjb-facility-thumb {
      position: relative;
      flex: 1 1 0;
      min-width: 0;
      aspect-ratio: 850 / 580;
      margin: 0;
      padding: 0;
      overflow: hidden;
      border: 0;
      border-radius: 12px;
      background: #ddd;
      cursor: pointer;
    }

    .yjb-facility-thumb::after {
      content: "";
      position: absolute;
      inset: 0;
      border: 3px solid transparent;
      border-radius: 12px;
      transition: border-color .2s ease;
    }

    .yjb-facility-thumb.yjb-is-active::after {
      border-color: #7d4dff;
    }

    .yjb-facility-thumb::before {
      content: "";
      position: absolute;
      z-index: 1;
      inset: 0;
      background: rgba(0, 0, 0, .4);
      opacity: 0;
      transition: opacity .2s ease;
    }

    .yjb-facility-plus {
      position: absolute;
      z-index: 2;
      top: 50%;
      left: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 48px;
      height: 48px;
      border: 2px solid #fff;
      border-radius: 50%;
      color: #fff;
      font-size: 34px;
      font-weight: 300;
      line-height: 1;
      opacity: 0;
      transform: translate(-50%, -50%);
      transition: opacity .2s ease;
    }

    .yjb-facility-thumb:hover::before,
    .yjb-facility-thumb:focus-visible::before,
    .yjb-facility-thumb:hover .yjb-facility-plus,
    .yjb-facility-thumb:focus-visible .yjb-facility-plus {
      opacity: 1;
    }

    .yjb-showcase-swiper {
      overflow: visible;
      clip-path: inset(-80px -100vw -110px 0);
    }

    .yjb-showcase-swiper .swiper-slide {
      width: 300px !important;
    }

/* kakao open chat floating */
.yjb-kakao-floating {
  position: fixed;
  right: 28px;
  bottom: 28px;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.yjb-kakao-floating:hover,
.yjb-kakao-floating:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
}

.yjb-kakao-floating img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 767px) {
  .yjb-kakao-floating {
    right: 16px;
    bottom: 16px;
    width: 64px;
    height: 64px;
  }
}