@charset "utf-8";

/* Intro Hero */
.intro-hero {position: relative; margin: 110px 30px 0; width: calc(100% - 60px); height: 450px; border-radius: 20px; overflow: hidden;}
.intro-hero .intro-hero-bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1;}
.intro-hero .intro-hero-content {display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px; width: 100%; height: 100%; text-align: center;}
.intro-hero .intro-hero-title {font-size: 72px; font-weight: 500; color: #fff; font-family: var(--ff-secondary);}
.intro-hero .intro-hero-desc {font-size: 18px; font-weight: 400; color: #fff; line-height: 1.5; opacity: 0.8;}

@media screen and (max-width: 1399px) {
  .intro-hero {margin: 70px 15px 0; width: calc(100% - 30px); height: 360px; border-radius: 16px;}
  .intro-hero .intro-hero-content {gap: 14px; padding-inline: 24px;}
  .intro-hero .intro-hero-title {font-size: 48px; line-height: 1.15;}
  .intro-hero .intro-hero-desc {font-size: 17px;}
}

@media screen and (max-width: 767px) {
  .intro-hero {margin: 60px 15px 0; width: calc(100% - 30px); height: 260px; border-radius: 12px;}
  .intro-hero .intro-hero-content {gap: 10px; padding-inline: 16px;}
  .intro-hero .intro-hero-title {font-size: 32px; line-height: 1.2;}
  .intro-hero .intro-hero-desc {font-size: 15px;}
}

/* Base */
.sp-content {padding-block: 160px 180px; position: relative;}
.sp-content:last-child {padding-bottom: 220px;}
.bg-dark {background: #F6F6F6;}

.sp-head {text-align: center; margin-bottom: 85px;}
.sp-head .sp-tit-tag {display: inline-block; margin-bottom: 15px; font-size: 25px; font-weight: 700; font-family: var(--ff-secondary); color: var(--primary);}
.sp-head .sp-tit {font-size: 50px; font-weight: 400; line-height: 1.5; text-transform: uppercase;}
.sp-head .sp-desc {margin-top: 35px; font-size: 18px; font-weight: 400; line-height: 1.5;}

@media screen and (max-width: 1399px) {
  .sp-content {padding-block: 100px 120px;}
  .sp-content:last-child {padding-bottom: 140px;}
  .sp-head .sp-tit-tag {font-size: 24px; margin-bottom: 12px;}
  .sp-head .sp-tit {font-size: 36px;}
  .sp-head .sp-desc {margin-top: 32px; font-size: 17px;}

  .subpage-wrapper .banner {height: auto; min-height: 340px;}
  .subpage-wrapper .banner .container {display: flex; justify-content: space-between; align-items: center; padding-block: 50px;}
  .subpage-wrapper .banner .txt-box h2 {font-size: 30px;}
}

@media screen and (max-width: 767px) {
  .sp-content {padding-block: 100px 120px;}
  .sp-content:last-child {padding-bottom: 140px;}
  .sp-head .sp-tit-tag {font-size: 18px; margin-bottom: 10px;}
  .sp-head .sp-tit {font-size: 28px;}
  .sp-head .sp-desc {margin-top: 24px; font-size: 15px;}

  .subpage-wrapper .banner {height: auto; min-height: 320px;}
  .subpage-wrapper .banner .container {display: flex; justify-content: space-between; flex-direction: column; align-items: flex-start; gap: 30px; padding-block: 60px;}
  .subpage-wrapper .banner .txt-box h2 {font-size: 28px;}

  .mo-overflow {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
  .mo-overflow img {
    display: block;
    width: 1000px;
    max-width: none;
    height: auto;
  }
}

/* Company - Overview */
.company-overview {
  .overview-mvc {display: grid; grid-template-columns: minmax(0, 1fr) 750px; gap: 20px; align-items: center;}
  .overview-mvc-tabs {display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 50px;}
  .overview-mvc-tab {display: inline-flex; align-items: center; justify-content: center; width: fit-content; height: 32px; padding-inline: 12px; border: 1px solid var(--primary); border-radius: 999px; background: #fff; color: var(--primary); font-size: 16px; font-weight: 400; font-family: var(--ff-secondary); transition: background-color .35s ease, color .35s ease;}
  .overview-mvc-tab.active {background: var(--primary); color: #fff; font-weight: 700;}
  .overview-mvc-panels {position: relative; height: 360px;}
  .overview-mvc-panel {display: flex; flex-direction: column; justify-content: space-between; position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s ease;}
  .overview-mvc-panel.active {opacity: 1; visibility: visible;}
  .overview-mvc-tag {display: inline-block; margin-bottom: 10px; font-size: 20px; font-weight: 700; font-family: var(--ff-secondary); color: var(--primary);}
  .overview-mvc-tit {margin-bottom: 20px; font-size: 30px; font-weight: 700; letter-spacing: -0.02em;}
  .overview-mvc-desc {font-size: 16px; font-weight: 400; line-height: 1.5;}
  .overview-mvc-hashtags {display: flex; flex-wrap: wrap; gap: 10px 15px;}
  .overview-mvc-hashtag {font-size: 16px; font-weight: 700; color: var(--primary);}
  .overview-mvc-slider {width: 750px; max-width: 100%; overflow: hidden;}
  .overview-mvc-gallery {display: flex; gap: 20px; width: 750px; max-width: 100%;}
  .overview-mvc-slide {width: 140px; height: 440px; flex-shrink: 0; transition: width .6s ease; cursor: pointer;}
  .overview-mvc-slide.is-active {width: 430px;}
  .overview-mvc-slide-img {width: 100%; height: 100%; border-radius: 20px; overflow: hidden;}
  .overview-mvc-slide-img img {width: 100%; height: 100%; object-fit: cover;}

  .about-us {
    --el-height: 460px;
    --el-txt-height: 190px;
    --about-us-bg: #F6F6F6;

    .sp-head {text-align: left;}
  }

  .about-us-card-list {display: flex; flex-wrap: wrap; width: 100%; margin: -10px;}
  .about-us-card-list > li {width: calc(25% - 20px); height: var(--el-height); margin: 10px; isolation: isolate;}
  .about-us-card {display: flex; flex-direction: column; justify-content: flex-end; position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: 15px;}
  .about-us-card__thumb {overflow: hidden; position: absolute; top: 0; left: 0; right: 0; bottom: var(--el-txt-height); border-radius: 15px 15px 0 0;}
  .about-us-card__thumb::before {content: ''; display: block; position: absolute; inset: 0; z-index: 1; background: rgba(0, 0, 0, 0.03);}
  .about-us-card__thumb img {width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .3s ease;}
  .about-us-card__num {display: flex; align-items: center; justify-content: center; position: absolute; top: 0; right: 0; z-index: 2; min-width: 60px; height: 35px; padding: 0 14px; border-radius: 0 0 0 15px; background: var(--about-us-bg); color: var(--primary); font-size: 18px; font-weight: 700; font-family: var(--ff-secondary);}
  .about-us-card__num::before {content: ''; position: absolute; left: -20px; top: 0; z-index: -1; width: 20px; height: 20px; border-radius: 0 15px 0 0; box-shadow: 15px -15px 0 15px var(--about-us-bg);}
  .about-us-card__num::after {content: ''; position: absolute; right: 0; bottom: -20px; z-index: -1; width: 20px; height: 20px; border-radius: 0 15px 0 0; box-shadow: 15px -15px 0 15px var(--about-us-bg);}
  .about-us-card__body {position: relative; z-index: 1; width: 100%; height: var(--el-txt-height); padding: 20px 15px; border: 1px solid #eee; border-top: 0; border-radius: 0 0 15px 15px; background: #fff; text-align: left;}
  .about-us-card__tit {font-size: 18px; font-weight: 700; line-height: 1.45; color: #000; word-break: keep-all;}
  .about-us-card__desc {margin-top: 10px; font-size: 15px; font-weight: 400; line-height: 1.5; word-break: keep-all;}

  .history .sp-head {text-align: left;}
  .history-list {display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;}
  .history-item {--history-theme: var(--primary); position: relative;}
  .history-item.theme--beginning {--history-theme: #A0C1FF;}
  .history-item.theme--growth {--history-theme: #5993FF;}
  .history-item.theme--innovation {--history-theme: var(--primary);}
  .history-item.theme--beginning::before {content: ''; position: absolute; top: 59px; right: calc(100% + 10px); width: 100vw; height: 60.5px; background: #F3F3F3;}
  .history-item.theme--innovation::before {content: ''; position: absolute; top: 59px; left: 100%; width: 100vw; height: 60.5px; background: var(--history-theme);}
  .history-item__label {display: block; font-size: 36px; font-weight: 400; font-family: var(--ff-secondary); color: var(--history-theme);}
  .history-item__period {margin-top: 5px; padding: 10px 20px; background: var(--history-theme); color: #fff; font-size: 27px; font-weight: 600; font-family: var(--ff-secondary);}
  .history-item__details {margin-top: 24px; padding-inline: 20px;}
  .history-item__details > li {position: relative; padding-left: 14px; font-size: 18px; font-weight: 400; line-height: 1.5; color: #333; word-break: keep-all;}
  .history-item__details > li::before {content: ''; position: absolute; top: 0.7em; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #62697A;}
  .history-item__details > li + li {margin-top: 18px;}
}

@media (hover: hover) {
  .company-overview {
    .overview-mvc-tab:not(.active):hover {background: rgba(26, 106, 255, 0.08);}

    .about-us-card:hover .about-us-card__thumb img {transform: scale(1.05);}
  }
}

@media screen and (max-width: 1399px) {
  .company-overview {
    .overview-mvc {grid-template-columns: 1fr; gap: 50px; min-width: 0;}
    .overview-mvc-slider {width: 100%; max-width: 100%; min-width: 0; margin-inline: auto; overflow: hidden;}
    .overview-mvc-gallery {width: 100%; gap: 16px;}
    .overview-mvc-slide {
      width: calc((100% - 32px) * 140 / 710);
      height: 380px;
      flex-shrink: 0;
    }
    .overview-mvc-slide.is-active {width: calc((100% - 32px) * 430 / 710);}
    .overview-mvc-panels {height: 260px;}

    .about-us-card-list > li {width: calc(50% - 20px);}
    .about-us .sp-head,
    .history .sp-head {margin-bottom: 50px;}
    .history-item::before {display: none;}
    .history-list {grid-template-columns: 1fr; gap: 40px;}
    .history-item__label {font-size: 30px;}
    .history-item__period {font-size: 22px; padding: 8px 16px;}
    .history-item__details {margin-top: 20px; padding-inline: 16px;}
    .history-item__details > li {font-size: 16px;}
    .history-item__details > li + li {margin-top: 14px;}
  }
}

@media screen and (max-width: 767px) {
  .company-overview {
    .overview-mvc {
      display: flex;
      flex-direction: column;
      gap: 28px;
      min-width: 0;
    }
    .overview-mvc-content {display: contents;}
    .overview-mvc-tabs {order: 1; margin-bottom: 0;}
    .overview-mvc-slider {order: 2; width: 100%; max-width: 100%; overflow: hidden;}
    .overview-mvc-panels {
      order: 3;
      display: grid;
      position: relative;
      height: auto;
      min-height: 0;
    }
    .overview-mvc-panel {
      grid-area: 1 / 1;
      position: absolute;
      inset: auto;
      width: 100%;
      height: auto;
      justify-content: flex-start;
      gap: 24px;
    }
    .overview-mvc-panel.active {position: relative; opacity: 1; visibility: visible;}
    .overview-mvc-tab {min-width: 0; height: 42px; padding-inline: 20px; font-size: 16px;}
    .overview-mvc-tit {font-size: 26px; margin-bottom: 20px;}
    .overview-mvc-desc {font-size: 15px;}
    .overview-mvc-hashtags {margin-top: 0;}
    .overview-mvc-gallery {
      display: block;
      position: relative;
      width: 100%;
      height: 280px;
      gap: 0;
    }
    .overview-mvc-slide {
      position: absolute;
      inset: 0;
      width: 100%;
      max-width: 100%;
      height: 100%;
      flex-shrink: 1;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity .45s ease, visibility .45s ease;
    }
    .overview-mvc-slide.is-active {
      width: 100%;
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      z-index: 1;
    }
    .overview-mvc-slide-img {width: 100%; height: 100%;}

    .about-us {--el-height: 420px; --el-txt-height: 155px;}
    .about-us-card-list {margin: 0;}
    .about-us-card-list > li {width: 100%; margin: 0;}
    .about-us-card-list > li + li {margin-top: 20px;}

    .history .sp-head .sp-tit {font-size: 28px;}
    .history .sp-head .sp-desc {font-size: 15px;}
    .history-list {gap: 40px;}
    .history-item__label {font-size: 26px;}
    .history-item__period {font-size: 18px; padding: 8px 14px;}
    .history-item__details {margin-top: 16px; padding-inline: 12px;}
    .history-item__details > li {font-size: 15px;}
    .history-item__details > li + li {margin-top: 12px;}
  }
}

/* Project */
.project-overview {

  .project-card-list {display: flex; flex-wrap: wrap; width: 100%; margin: -10px;}
  .project-card-list > li {width: calc(50% - 20px); margin: 10px;}
  .project-card {display: flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 270px; border-radius: 15px; overflow: hidden;}
  .project-card__bg {position: absolute; inset: 0; z-index: 0;}
  .project-card__bg::after {content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.08); transition: background .35s ease;}
  .project-card__bg img {width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease;}
  .project-card__more {display: flex; align-items: center; justify-content: center; position: absolute; top: 0; right: 0; z-index: 2; min-width: 110px; height: 35px; padding: 0 16px; border-radius: 0 0 0 15px; background: #fff; color: var(--primary); font-size: 16px; font-weight: 700; font-family: var(--ff-secondary);}
  .project-card__more::before {content: ''; position: absolute; left: -20px; top: 0; z-index: -1; width: 20px; height: 20px; border-radius: 0 15px 0 0; box-shadow: 15px -15px 0 15px #fff;}
  .project-card__more::after {content: ''; position: absolute; right: 0; bottom: -20px; z-index: -1; width: 20px; height: 20px; border-radius: 0 15px 0 0; box-shadow: 15px -15px 0 15px #fff;}
  .project-card__content {position: relative; z-index: 1; padding: 20px; color: #fff; text-align: center;}
  .project-card__tit {font-size: 30px; font-weight: 700; line-height: 1.2;}
  .project-card__desc {margin-top: 10px; font-size: 16px; font-weight: 400; line-height: 1.5;}

  .others .sp-head {text-align: left;}
  .other-project-list {display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 30px;}
  .other-project-card {height: 100%; padding: 28px 24px; border-radius: 15px; background: #fff; transition: box-shadow .35s ease, transform .35s ease;}
  .other-project-card__num {display: block; margin-bottom: 10px; font-size: 22px; font-weight: 700; font-family: var(--ff-secondary); color: var(--primary); line-height: 1;}
  .other-project-card__desc {font-size: 18px; font-weight: 400; line-height: 1.5; word-break: keep-all;}

  .banner {height: 380px; position: relative;}
  .banner .container {display: flex; justify-content: space-between; align-items: center; height: 100%;}
  .banner .txt-box h2 {font-size: 35px; font-weight: 400; color: #fff; line-height: 1.5;}
  .banner .link-more {background-color: #fff; color: var(--primary);}
  .banner .link-more svg {fill: var(--primary);}
}

@media (hover: hover) {
  .project-overview .project-card:hover .project-card__bg img {transform: scale(1.05);}
  .project-overview .project-card:hover .project-card__bg::after {background: rgba(0, 0, 0, 0.18);}
  .project-overview .other-project-card:hover {box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08); transform: translateY(-4px);}

  .banner .link-more:hover {background-color: #222; color: #fff;}
  .banner .link-more:hover svg {fill: #fff;}
}

@media screen and (max-width: 1399px) {
  .project-overview {
    .project-card-list > li {width: 100%;}
    .project-card {height: 380px;}
    .project-card__tit {font-size: 40px;}
    .other-project-list {grid-template-columns: 1fr; gap: 16px;}
    .other-project-card {padding: 24px 20px;}
    .other-project-card__desc {font-size: 17px;}
    .banner {height: auto; min-height: 340px;}
    .banner .container {
      height: auto;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 30px;
      padding-block: 50px;
      text-align: center;
    }
    .banner .txt-box {width: 100%;}
    .banner .txt-box h2 {font-size: 30px; text-align: center;}
    .banner .link-more {margin-inline: auto;}
  }
}

@media screen and (max-width: 767px) {
  .project-overview {
    .project-card {height: 320px;}
    .project-card__tit {font-size: 32px;}
    .project-card__desc {font-size: 16px;}
    .other-project-card__num {font-size: 20px;}
    .other-project-card__desc {font-size: 16px;}
    .banner {height: auto; min-height: 320px;}
    .banner .container {
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 40px;
      padding-block: 60px;
      text-align: center;
    }
    .banner .txt-box h2 {font-size: 24px; text-align: center;}
    .banner .link-more {margin-inline: auto;}
  }
}

.project-kiin {
  .key-summary-list {display: flex; flex-direction: column; gap: 90px;}
  .key-summary-item {display: flex; gap: 40px;}
  .key-summary-item.is-reverse {flex-direction: row-reverse;}
  .key-summary-item__content {flex: 1; min-width: 0;}
  .key-summary-item__tag {display: block; margin-bottom: 12px; font-size: 20px; font-weight: 700; font-family: var(--ff-secondary); color: var(--primary);}
  .key-summary-item__tit {margin-bottom: 30px; font-size: 30px; font-weight: 700; line-height: 1.5; word-break: keep-all;}
  .key-summary-item__details > li {position: relative; padding-left: 14px; font-size: 16px; font-weight: 400; line-height: 1.5; word-break: keep-all;}
  .key-summary-item__details > li::before {content: ''; position: absolute; top: 0.5em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--primary);}
  .key-summary-item__details > li + li {margin-top: 15px;}
  .key-summary-item__img {flex-shrink: 0; width: 580px; max-width: 100%; height: 300px; border-radius: 15px; overflow: hidden;}
  .key-summary-item__img img {width: 100%; height: 100%; object-fit: cover;}

  .global {
    --global-circle: 240px;
    --global-line: 310px;
    --global-lead-gap: 28px;
    --global-overlap: 33px;
    --global-plus: 22px;
    position: relative;
    overflow: hidden;
    min-height: 620px;
    padding-block: 120px 140px;
    color: #fff;
  }
  .global .container {position: relative; z-index: 1;}
  .global .bg {z-index: 0;}
  .global .sp-head {text-align: left; margin-bottom: 110px;}
  .global .sp-head .sp-tit {font-size: 52px; font-weight: 400; line-height: 1.35; color: #fff; text-transform: none;}
  .global .sp-head .sp-tit strong {font-weight: 700;}
  .global .sp-body {padding-top: 0;}
  .global-result {display: flex; align-items: center; justify-content: space-between; width: 100%;}
  .global-result__lead {display: flex; align-items: center; flex-shrink: 0;}
  .global-result__line {display: block; flex-shrink: 0; width: var(--global-line); height: 0; border-top: 2px dashed #fff;}
  .global-result-cards {position: relative; width: fit-content;}
  .global-result-list,
  .global-result-rings {display: flex; align-items: center; gap: 0; margin: 0; padding: 0; list-style: none;}
  .global-result-list {position: relative; z-index: 1;}
  .global-result-rings {position: absolute; inset: 0; z-index: 2; pointer-events: none;}
  .global-result-list > .global-circle--glass ~ .global-circle--glass,
  .global-result-rings > .global-circle-ring ~ .global-circle-ring {margin-left: calc(var(--global-overlap) * -1);}
  .global-result-list > .global-circle--glass:nth-child(1) {z-index: 1;}
  .global-result-list > .global-circle--glass:nth-child(2) {z-index: 2;}
  .global-result-list > .global-circle--glass:nth-child(3) {z-index: 3;}
  .global-result-plus {position: absolute; top: 50%; z-index: 3; display: flex; align-items: center; justify-content: center; width: var(--global-plus); font-size: 38px; font-weight: 300; line-height: 1; color: #fff; transform: translate(-50%, -50%);}
  .global-result-plus:nth-of-type(1) {left: calc(var(--global-circle) - var(--global-overlap) / 2);}
  .global-result-plus:nth-of-type(2) {left: calc(var(--global-circle) * 2 - var(--global-overlap) * 1.5);}
  .global-circle {position: relative; display: flex; align-items: center; justify-content: center; width: var(--global-circle); height: var(--global-circle); border-radius: 50%; text-align: center; flex-shrink: 0;}
  .global-circle--result {background: var(--primary); border: 1px solid rgba(255, 255, 255, 0.85);}
  .global-circle--glass {border: none; background: rgba(255, 255, 255, 0.14); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);}
  .global-circle-ring {width: var(--global-circle); height: var(--global-circle); border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.55); flex-shrink: 0;}
  .global-circle__label {font-size: 30px; font-weight: 700; color: #fff; line-height: 1;}
  .global-circle__desc {position: relative; z-index: 1; padding-inline: 18px; font-size: 18px; font-weight: 400; line-height: 1.55; color: #fff; word-break: keep-all;}
}

@media screen and (max-width: 1399px) {
  .project-kiin {
    .key-summary-item,
    .key-summary-item.is-reverse {flex-direction: column; align-items: stretch; gap: 30px;}
    .key-summary-item__img {width: 100%; height: auto; aspect-ratio: 580 / 300;}

    .global {
      --global-line: 48px;
      --global-lead-gap: 20px;
      min-height: 0;
      padding-block: 100px 120px;
    }
    .global .sp-head {margin-bottom: 50px; text-align: center;}
    .global-result {flex-direction: column; align-items: center; gap: 0;}
    .global-result__lead {
      width: 100%;
      flex-direction: column;
      align-items: center;
    }
    .global-result__line {
      flex: none;
      width: 0;
      height: var(--global-line);
      margin: 0;
      border-top: 0;
      border-left: 2px dashed #fff;
    }
    .global-result-cards {width: fit-content; max-width: 100%; margin-inline: auto;}
    .global-result-list,
    .global-result-rings {justify-content: center;}
    .global-result-list > .global-circle--glass ~ .global-circle--glass,
    .global-result-rings > .global-circle-ring ~ .global-circle-ring {margin-left: calc(var(--global-overlap) * -0.65);}
    .global-result-plus:nth-of-type(1) {left: calc(var(--global-circle) - var(--global-overlap) * 0.325);}
    .global-result-plus:nth-of-type(2) {left: calc(var(--global-circle) * 2 - var(--global-overlap) * 0.975);}
  }
}

@media screen and (max-width: 767px) {
  .project-kiin {
    .key-summary-list {gap: 100px;}
    .key-summary-item__tit {font-size: 24px;}
    .key-summary-item__details > li {font-size: 15px;}

    .global {padding-block: 80px 100px; --global-overlap: 36px;}
    .global .sp-head {margin-bottom: 40px; text-align: center;}
    .global .sp-head .sp-tit {font-size: 32px;}
    .global-result {align-items: center; gap: 0;}
    .global-result__lead {
      width: 100%;
      flex-direction: column;
      align-items: center;
    }
    .global-result__line {
      display: block;
      flex: none;
      width: 0;
      height: 40px;
      margin: 0;
      border-top: 0;
      border-left: 2px dashed #fff;
    }
    .global-result-cards {
      position: relative;
      width: var(--global-circle);
      max-width: 100%;
      min-height: calc(var(--global-circle) * 3 - var(--global-overlap) * 2);
      margin-inline: auto;
    }
    .global-result-list {
      position: relative;
      z-index: 1;
      flex-direction: column;
      align-items: center;
      width: 100%;
    }
    .global-result-rings {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 2;
      flex-direction: column;
      align-items: center;
      width: 100%;
      margin: 0;
      padding: 0;
      pointer-events: none;
    }
    .global-result-list > .global-circle--glass ~ .global-circle--glass,
    .global-result-rings > .global-circle-ring ~ .global-circle-ring {margin-top: calc(var(--global-overlap) * -1); margin-left: 0;}
    .global-result-cards > .global-result-plus {
      position: absolute;
      left: 50%;
      z-index: 10;
      display: flex;
      align-items: center;
      justify-content: center;
      width: var(--global-plus);
      margin: 0;
      font-size: 28px;
      font-weight: 300;
      line-height: 1;
      color: #fff;
      transform: translate(-50%, -50%);
      pointer-events: none;
    }
    .global-result-cards > .global-result-plus:nth-child(3) {top: calc((var(--global-circle) - var(--global-overlap)) + var(--global-overlap) / 2);}
    .global-result-cards > .global-result-plus:nth-child(4) {top: calc((var(--global-circle) - var(--global-overlap)) * 2 + var(--global-overlap) / 2);}
    .global-circle__desc {font-size: 16px; padding-inline: 16px;}
  }
}

.project-monitor-wizdom {
  --wizdom-gap: 24px;
  --wizdom-col: calc((100% - 3 * var(--wizdom-gap)) / 4);
  --wizdom-drop: 24px;
  --wizdom-u: 56px;
  --wizdom-stem: 96px;

  .wizdom-flow {position: relative;}
  .wizdom-flow-list {display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--wizdom-gap); margin: 0; padding: 0; list-style: none;}
  .wizdom-flow-item {display: flex; flex-direction: column; align-items: center;}
  .wizdom-card {position: relative; display: flex; flex-direction: column; align-items: center; width: 100%; padding: 30px 15px 40px; border-radius: 15px; text-align: center;}
  .wizdom-card.is-blue {background: #F0F7FF;}
  .wizdom-card.is-purple {background: #F7F0FF;}
  .wizdom-card__tit {margin-bottom: 20px; font-size: 20px; font-weight: 700; line-height: 1.4; word-break: keep-all;}
  .wizdom-card.is-blue .wizdom-card__tit {color: var(--primary);}
  .wizdom-card.is-purple .wizdom-card__tit {color: var(--secondary);}
  .wizdom-card__icon {display: flex; align-items: center; justify-content: center; width: 100%; height: 120px; margin-bottom: 20px;}
  .wizdom-card__icon img {max-width: 100%; max-height: 100%; object-fit: contain;}
  .wizdom-card__desc {font-size: 16px; font-weight: 400; line-height: 1.5; word-break: keep-all;}
  .wizdom-card__dot {position: absolute; left: 50%; bottom: 0; z-index: 3; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; transform: translate(-50%, 50%);}
  .wizdom-card__dot-inner {width: 12px; height: 12px; border-radius: 50%;}
  .wizdom-card.is-blue .wizdom-card__dot {background: rgba(26, 106, 255, 0.15);}
  .wizdom-card.is-blue .wizdom-card__dot-inner {background: var(--primary);}
  .wizdom-card.is-purple .wizdom-card__dot {background: rgba(148, 3, 233, 0.15);}
  .wizdom-card.is-purple .wizdom-card__dot-inner {background: var(--secondary);}
  .wizdom-flow__bridge {position: relative; margin-top: 0; height: calc(var(--wizdom-drop) + var(--wizdom-u) + var(--wizdom-stem));}
  .wizdom-flow__drops {display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--wizdom-gap); height: calc(var(--wizdom-drop) + var(--wizdom-u)); margin: 0; padding: 0; list-style: none;}
  .wizdom-flow__drops > li:nth-child(2)::before,
  .wizdom-flow__drops > li:nth-child(3)::before {content: ''; display: block; width: 1.5px; height: 100%; margin: 0 auto; background: #6B6B6B;}
  .wizdom-flow__u {position: absolute; top: 0; left: calc(var(--wizdom-col) / 2); width: calc(var(--wizdom-col) * 3 + var(--wizdom-gap) * 3); height: calc(var(--wizdom-drop) + var(--wizdom-u)); border: 1.5px solid #6B6B6B; border-top: 0; border-radius: 0 0 24px 24px; box-sizing: border-box;}
  .wizdom-flow__stem {position: absolute; top: calc(var(--wizdom-drop) + var(--wizdom-u)); z-index: 1; left: calc(var(--wizdom-col) * 2 + var(--wizdom-gap) * 1.5); width: 1.5px; height: var(--wizdom-stem); background: #6B6B6B; transform: translate(-50%, -1.5px);}
  .wizdom-banner {position: relative; margin-top: 0; padding: 70px 40px; border-radius: 15px; overflow: hidden; text-align: center; color: #fff;}
  .wizdom-banner .bg {z-index: 0;}
  .wizdom-banner__tit {position: relative; z-index: 1; font-size: 30px; font-weight: 700; line-height: 1.5; word-break: keep-all;}
  .wizdom-banner__desc {position: relative; z-index: 1; margin-top: 20px; font-size: 16px; font-weight: 400; line-height: 1.6; opacity: 0.92; word-break: keep-all;}

  .wizdom-features .sp-head .sp-tit {font-weight: 700;}
  .wizdom-key-features {margin-top: 10px;}
  .wizdom-key-features__main {display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 100px; align-items: center;}
  .wizdom-key-features__visual {width: 400px; max-width: 100%;}
  .wizdom-key-features__frame {width: 100%; padding: 10px; border-radius: 18px; background: #111; box-sizing: border-box;}
  .wizdom-key-features__viewport {overflow: hidden; border-radius: 10px; background: #fff;}
  .wizdom-key-features__img-swiper {width: 100%; height: auto !important; overflow: hidden;}
  .wizdom-key-features__img-swiper .swiper-wrapper {height: auto !important; align-items: flex-start;}
  .wizdom-key-features__img-swiper .swiper-slide {height: auto !important; width: 100% !important;}
  .wizdom-key-features__img-swiper img {display: block; width: 100%; height: auto; object-fit: contain; object-position: top center;}
  .wizdom-key-features__toolbar {display: flex; align-items: flex-start; justify-content: space-between; gap: 20px;}
  .wizdom-key-features__titles {position: relative; flex: 1;}
  .wizdom-key-features__title-panel {display: flex; align-items: center; gap: 10px; position: absolute; inset: 0 auto auto 0; width: 100%; opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s ease;}
  .wizdom-key-features__title-panel.is-active {opacity: 1; visibility: visible;}
  .wizdom-key-features__num {font-size: 30px; font-weight: 700; color: var(--primary); line-height: 1;}
  .wizdom-key-features__slide-tit {font-size: 30px; font-weight: 700; line-height: 1; letter-spacing: -0.02em;}
  .wizdom-key-features__nav {display: flex; align-items: center; gap: 10px; flex-shrink: 0;}
  .wizdom-key-features__nav-btn {display: inline-flex; align-items: center; justify-content: center; width: 35px; height: 35px; border: 1px solid #D9D9D9; border-radius: 50%; background: #fff; color: #BDBDBD; font-size: 14px; transition: background-color .3s ease, border-color .3s ease, color .3s ease, opacity .3s ease;}
  .wizdom-key-features__nav-btn:not(:disabled) {border-color: var(--primary); background: var(--primary); color: #fff;}
  .wizdom-key-features__nav-btn:disabled {cursor: not-allowed;}
  .wizdom-key-features__content-line {width: 100%; height: 1px; margin: 30px 0; background: #D9D9D9;}
  .wizdom-key-features__descs {position: relative; min-height: 200px;}
  .wizdom-key-features__desc-panel {position: absolute; inset: 0 auto auto 0; width: 100%; margin: 0; font-size: 16px; font-weight: 400; line-height: 1.75; opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility .45s ease;}
  .wizdom-key-features__desc-panel.is-active {opacity: 1; visibility: visible;}
  .wizdom-key-features__tabs {position: relative; margin-top: 56px;}
  .wizdom-key-features__tabs-line {position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: #D9D9D9;}
  .wizdom-key-features__tabs-indicator {position: absolute; top: 0; left: 0; height: 3px; background: var(--primary); transition: transform .45s ease, width .45s ease;}
  .wizdom-key-features__tabs-list {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 18px 0 0; list-style: none;}
  .wizdom-key-features__tab {width: 100%; padding: 0; border: 0; background: none; font-size: 18px; font-weight: 500; line-height: 1.4; color: #999; text-align: center; cursor: pointer; transition: color .3s ease;}
  .wizdom-key-features__tab.is-active {color: var(--primary); font-weight: 700;}
}

@media screen and (max-width: 1399px) {
  .project-monitor-wizdom {
    .wizdom-flow-list {grid-template-columns: repeat(2, 1fr);}
    .wizdom-flow__bridge {display: none;}
    .wizdom-card__dot {display: none;}
    .wizdom-banner {margin-top: 50px; padding: 56px 28px;}

    .wizdom-features .sp-head {text-align: center;}
    .wizdom-key-features__main {grid-template-columns: 1fr; gap: 32px; align-items: stretch;}
    .wizdom-key-features__visual {width: min(400px, 100%); margin-inline: auto; order: -1;}
    .wizdom-key-features__content {width: 100%; min-width: 0;}
    .wizdom-key-features__toolbar {align-items: center;}
    .wizdom-key-features__titles {display: grid; position: relative; min-height: 48px;}
    .wizdom-key-features__title-panel {grid-area: 1 / 1; position: absolute; inset: auto; width: 100%; align-items: flex-start;}
    .wizdom-key-features__title-panel.is-active {position: relative;}
    .wizdom-key-features__slide-tit {line-height: 1.3; word-break: keep-all;}
    .wizdom-key-features__descs {display: grid; position: relative; min-height: 0;}
    .wizdom-key-features__desc-panel {grid-area: 1 / 1; position: absolute; inset: auto; width: 100%;}
    .wizdom-key-features__desc-panel.is-active {position: relative;}
    .wizdom-key-features__tabs {margin-top: 40px;}
    .wizdom-key-features__tabs-indicator {display: none;}
    .wizdom-key-features__tabs-list {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 0;}
    .wizdom-key-features__tabs-line {display: none;}
    .wizdom-key-features__tab {text-align: center; padding-block: 12px; border: 1px solid #D9D9D9; border-radius: 8px;}
    .wizdom-key-features__tab.is-active {border-color: var(--primary); background: #fff;}
  }
}

@media screen and (max-width: 767px) {
  .project-monitor-wizdom {
    --wizdom-gap: 16px;
    .wizdom-flow-list {grid-template-columns: 1fr;}
    .wizdom-card {padding: 24px 18px 20px;}
    .wizdom-card__tit {font-size: 18px; margin-bottom: 16px;}
    .wizdom-card__icon {height: 100px; margin-bottom: 16px;}
    .wizdom-card__desc {font-size: 14px;}
    .wizdom-banner {margin-top: 40px; padding: 48px 20px 56px;}
    .wizdom-banner__tit {font-size: 24px;}
    .wizdom-banner__desc {margin-top: 16px; font-size: 15px;}

    .wizdom-features .sp-head {text-align: center;}
    .wizdom-features .sp-head .sp-tit {font-size: 28px;}
    .wizdom-key-features__main {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    .wizdom-key-features__content {display: contents;}
    .wizdom-key-features__toolbar {display: contents;}
    .wizdom-key-features__titles {
      order: 1;
      display: grid;
      position: relative;
      min-height: 0;
      width: 100%;
    }
    .wizdom-key-features__title-panel {
      grid-area: 1 / 1;
      position: absolute;
      inset: auto;
      width: 100%;
      justify-content: center;
      flex-wrap: wrap;
      align-items: flex-start;
      text-align: center;
    }
    .wizdom-key-features__title-panel.is-active {position: relative;}
    .wizdom-key-features__num,
    .wizdom-key-features__slide-tit {font-size: 22px; line-height: 1.3;}
    .wizdom-key-features__visual {order: 2; width: 100%; margin-inline: auto;}
    .wizdom-key-features__nav {
      order: 3;
      align-self: center;
      justify-content: center;
      gap: 12px;
      flex-shrink: 0;
    }
    .wizdom-key-features__content-line {display: none;}
    .wizdom-key-features__descs {
      order: 4;
      display: grid;
      position: relative;
      min-height: 0;
      width: 100%;
    }
    .wizdom-key-features__desc-panel {grid-area: 1 / 1; position: absolute; inset: auto; width: 100%; font-size: 15px; line-height: 1.65; text-align: center;}
    .wizdom-key-features__desc-panel.is-active {position: relative;}
    .wizdom-key-features__tabs {display: none;}
  }
}

.solution-dasoni {
  --dasoni-gap: 15px;
  --dasoni-col: 390px;
  --dasoni-u: 80px;
  --dasoni-stem: 88px;

  .dasoni-cards-wrap {position: relative; width: calc(var(--dasoni-col) * 3 + var(--dasoni-gap) * 2); max-width: 100%; margin: 10px auto 0; overflow: visible;}
  .dasoni-cards {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--dasoni-gap); position: relative; z-index: 2;}
  .dasoni-card {position: relative; display: flex; flex-direction: column; align-items: flex-start; width: 100%; padding: 0 20px 35px; border-radius: 10px;}
  .dasoni-card__float {position: absolute; top: -34px; right: 25px; width: auto; height: 95px; pointer-events: none;}
  .dasoni-card__float img {width: 100%; height: 100%; object-fit: contain;}
  .dasoni-card__badge {display: inline-flex; align-items: center; justify-content: center; min-width: 130px; padding: 10px 15px; border-radius: 0 0 8px 8px; font-size: 16px; font-weight: 700; color: #fff;}
  .dasoni-card__desc {width: 100%; margin-top: 25px; font-size: 16px; font-weight: 400; line-height: 1.5; word-break: keep-all;}
  .dasoni-card__dot {position: absolute; left: 50%; bottom: 0; z-index: 3; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; transform: translate(-50%, 50%);}
  .dasoni-card__dot-inner {width: 12px; height: 12px; border-radius: 50%;}
  .dasoni-card--blue {background: #F3F8FF;}
  .dasoni-card--blue .dasoni-card__badge {background: var(--primary);}
  .dasoni-card--blue .dasoni-card__dot {background: rgba(26, 106, 255, 0.15);}
  .dasoni-card--blue .dasoni-card__dot-inner {background: var(--primary);}
  .dasoni-card--purple {background: #FAF5FF;}
  .dasoni-card--purple .dasoni-card__badge {background: var(--secondary);}
  .dasoni-card--purple .dasoni-card__dot {background: rgba(148, 3, 233, 0.15);}
  .dasoni-card--purple .dasoni-card__dot-inner {background: var(--secondary);}
  .dasoni-card--orange {background: #FFF7F0;}
  .dasoni-card--orange .dasoni-card__badge {background: var(--third);}
  .dasoni-card--orange .dasoni-card__dot {background: rgba(255, 134, 0, 0.15);}
  .dasoni-card--orange .dasoni-card__dot-inner {background: var(--third);}
  .dasoni-flow {position: relative; height: calc(var(--dasoni-u) + var(--dasoni-stem));}
  .dasoni-flow__border {position: absolute; top: 0; left: calc(var(--dasoni-col) / 2); width: calc(var(--dasoni-col) * 2 + var(--dasoni-gap) * 2); height: var(--dasoni-u); border: 1.5px solid #6B6B6B; border-top: 0; border-radius: 0 0 24px 24px; box-sizing: border-box; overflow: visible;}
  .dasoni-flow__center {display: block; width: 1.5px; height: calc(var(--dasoni-u) + var(--dasoni-stem)); margin: 0 auto; background: #6B6B6B;}
  .dasoni-logo {margin-top: 60px; text-align: center;}
  .dasoni-logo img {display: inline-block; width: 520px; max-width: 100%; height: auto;}

  .dasoni-concept-list {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin: 0; padding: 0; list-style: none;}
  .dasoni-concept-card {display: flex; flex-direction: column; height: 100%; overflow: hidden; border-radius: 20px; background: #fff;}
  .dasoni-concept-card__thumb {position: relative; overflow: hidden; height: 385px; border-radius: 20px 20px 0 0;}
  .dasoni-concept-card__thumb img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
  .dasoni-concept-card__num {display: flex; align-items: center; justify-content: center; position: absolute; top: 0; right: 0; z-index: 2; min-width: 60px; height: 35px; padding: 0 14px; border-radius: 0 0 0 15px; background: #f6f6f6; color: var(--primary); font-size: 18px; font-weight: 700; font-family: var(--ff-secondary);}
  .dasoni-concept-card__num::before {content: ''; position: absolute; left: -20px; top: 0; z-index: -1; width: 20px; height: 20px; border-radius: 0 15px 0 0; box-shadow: 15px -15px 0 15px #f6f6f6;}
  .dasoni-concept-card__num::after {content: ''; position: absolute; right: 0; bottom: -20px; z-index: -1; width: 20px; height: 20px; border-radius: 0 15px 0 0; box-shadow: 15px -15px 0 15px #f6f6f6;}
  .dasoni-concept-card__body {padding: 24px 20px 28px; text-align: left;}
  .dasoni-concept-card__tit {font-size: 20px; font-weight: 700; line-height: 1.5; word-break: keep-all;}
  .dasoni-concept-card__desc {margin-top: 15px; font-size: 16px; font-weight: 400; line-height: 1.5; word-break: keep-all;}

  .dasoni-persona-visual {max-width: 1200px; margin: 0 auto; text-align: center;}
  .dasoni-persona-visual img {display: inline-block; max-width: 100%; height: auto;}
  .dasoni-persona-visual .mo-img {display: none;}

  .technology .sp-head {text-align: left;}
  .technology .step-ls {display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px;}
  .technology .step-ls .item {width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; background-color: #fff; border-radius: 15px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);}
  .technology .step-ls .item .title {width: 100%; height: 190px; position: relative;}
  .technology .step-ls .item .title img {position: absolute; top: 0; left: 0; max-width: none; height: 100%; object-fit: contain;}
  .technology .step-ls .item:nth-child(1) .title img {z-index: 5;}
  .technology .step-ls .item:nth-child(2) .title img {z-index: 4;}
  .technology .step-ls .item:nth-child(3) .title img {z-index: 3;}
  .technology .step-ls .item:nth-child(4) .title img {z-index: 2;}
  .technology .step-ls .item:last-child .title img {width: 100%; height: 190px; object-fit: initial;}
  .technology .step-ls .item .title .txt-box {position: relative; z-index: 10; padding: 20px; width: 100%; height: 190px; color: #fff;}
  .technology .step-ls .item .title .step {display: block; width: 100%; font-size: 18px; font-weight: 700; padding-bottom: 5px; margin-bottom: 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.5);}
  .technology .step-ls .item .title .tit {font-size: 30px; font-weight: 700; font-family: var(--ff-secondary); line-height: 1.25; word-break: keep-all;}
  .technology .step-ls .item .desc-box {padding: 25px 15px 30px; text-align: center; z-index: 1;}
  .technology .step-ls .item .desc-box .desc {font-size: 16px; font-weight: 400; line-height: 1.5; word-break: keep-all;}

  .ai-tech {margin-top: 120px;}
  .ai-tech__tit {font-size: 36px; font-weight: 400; line-height: 1.5; word-break: keep-all;}
  .ai-tech-list {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin: 40px 0 0; padding: 0; list-style: none;}
  .ai-tech-card {display: flex; align-items: center; gap: 30px; height: 100%; padding: 15px 20px; border-radius: 15px; background: #fff; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);}
  .ai-tech-card__icon {flex-shrink: 0; width: 120px; height: 120px;}
  .ai-tech-card__icon img {width: 100%; height: 100%; object-fit: contain;}
  .ai-tech-card__body {flex: 1; min-width: 0; text-align: left;}
  .ai-tech-card__tit {font-size: 24px; font-weight: 700; line-height: 1.5; color: var(--primary); word-break: keep-all;}
  .ai-tech-card__desc {margin-top: 12px; font-size: 16px; font-weight: 400; line-height: 1.5; word-break: keep-all;}

  .safe-trusted .sp-head .sp-tit {text-transform: none; font-weight: 700;}
  .dasoni-cards-wrap--safe {margin-top: 0; width: 100%; max-width: 100%; padding-top: 34px;}
  .dasoni-cards-wrap--safe .dasoni-card {padding-bottom: 20px;}

  .banner {height: 380px; position: relative;}
  .banner .container {display: flex; justify-content: space-between; align-items: center; height: 100%; position: relative; z-index: 1;}
  .banner .txt-box h2 {font-size: 35px; font-weight: 400; color: #fff; line-height: 1.5; word-break: keep-all;}
  .banner .link-more {background-color: #fff; color: var(--primary);}
  .banner .link-more svg {fill: var(--primary);}
}

@media (hover: hover) {
  .solution-dasoni {
    .banner .link-more:hover {background-color: #222; color: #fff;}
    .banner .link-more:hover svg {fill: #fff;}
  }
}

@media screen and (max-width: 1399px) {
  .solution-dasoni {
    .dasoni-flow {display: none;}
    .dasoni-card__dot {display: none;}
    .overview .dasoni-cards-wrap {width: 100%; padding-top: 34px;}
    .overview .dasoni-cards {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 48px;
    }
    .overview .dasoni-card {width: 100%; max-width: 390px; min-height: 200px;}
    .dasoni-logo {margin-top: 50px;}
    .dasoni-concept-list {grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px;}
    .dasoni-concept-card__thumb {height: 260px;}
    .dasoni-concept-card__body {padding: 20px 14px 22px;}
    .dasoni-concept-card__tit {font-size: 18px;}
    .dasoni-concept-card__desc {margin-top: 12px; font-size: 15px;}
    .technology .sp-body {margin-inline: 0; padding-inline: 0;}
    .technology .step-ls {
      display: flex;
      flex-direction: column;
      gap: 40px;
      overflow: visible;
      width: 100%;
      max-width: 100%;
      padding-bottom: 0;
    }
    .technology .step-ls .item {
      flex: none;
      flex-direction: row;
      align-items: flex-start;
      width: 100%;
      min-width: 0;
      height: 146px;
      overflow: visible;
      position: relative;
    }
    .technology .step-ls .item:nth-child(1) {z-index: 5;}
    .technology .step-ls .item:nth-child(2) {z-index: 4;}
    .technology .step-ls .item:nth-child(3) {z-index: 3;}
    .technology .step-ls .item:nth-child(4) {z-index: 2;}
    .technology .step-ls .item:nth-child(5) {z-index: 1;}
    .technology .step-ls .item .title {
      flex: 0 0 168px;
      width: 168px;
      height: 146px;
      position: relative;
      overflow: visible;
      flex-shrink: 0;
    }
    /* 1~4 말풍선: 가로(height) 넓게, 세로(width)는 본문+꼬리 */
    .technology .step-ls .item .title img {
      position: absolute;
      top: 0;
      left: 100%;
      z-index: 1;
      width: 164px;
      height: 168px;
      max-width: none;
      object-fit: fill;
      transform: rotate(90deg);
      transform-origin: top left;
    }
    .technology .step-ls .item:nth-child(1) .title img,
    .technology .step-ls .item:nth-child(2) .title img,
    .technology .step-ls .item:nth-child(3) .title img,
    .technology .step-ls .item:nth-child(4) .title img {
      width: 164px;
      height: 168px;
      object-fit: fill;
    }
    /* 5번 네모: item 높이에 딱 맞춤 (꼬리 없음) */
    .technology .step-ls .item:last-child .title img {
      width: 146px;
      height: 168px;
      object-fit: fill;
    }
    .technology .step-ls .item .title .txt-box {
      position: relative;
      z-index: 10;
      width: 100%;
      height: 100%;
      padding: 14px 14px;
      transform: none;
      box-sizing: border-box;
    }
    .technology .step-ls .item .title .step {font-size: 13px; margin-bottom: 6px;}
    .technology .step-ls .item .title .tit {font-size: 16px;}
    .technology .step-ls .item .desc-box {
      flex: 1;
      min-width: 0;
      min-height: 0;
      height: 146px;
      display: flex;
      align-items: center;
      padding: 14px 16px;
      text-align: left;
    }
    .banner {height: auto; min-height: 340px;}
    .banner .container {
      height: auto;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 30px;
      padding-block: 50px;
      text-align: center;
    }
    .banner .txt-box {width: 100%;}
    .banner .txt-box h2 {font-size: 30px; text-align: center;}
    .banner .link-more {margin-inline: auto;}
    .ai-tech {margin-top: 100px;}
    .ai-tech__tit {font-size: 30px;}
    .ai-tech-list {grid-template-columns: 1fr;}
    .dasoni-cards-wrap--safe .dasoni-cards {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 48px;
    }
    .dasoni-cards-wrap--safe .dasoni-card {width: 100%; max-width: 390px; min-height: 200px;}
  }
}

@media screen and (max-width: 767px) {
  .solution-dasoni {
    .overview .sp-head {margin-bottom: 50px;}
    .overview .sp-head .sp-tit {font-size: 32px;}
    .overview .sp-head .sp-desc {font-size: 16px;}
    .dasoni-cards-wrap {width: 100%;}
    .dasoni-card__float {right: 0;}
    .overview .dasoni-cards-wrap {padding-top: 34px;}
    .overview .dasoni-cards {display: flex; flex-direction: column; align-items: center; gap: 48px;}
    .overview .dasoni-card {width: 100%; max-width: none; min-height: 0; padding: 0 18px 35px;}
    .overview .dasoni-card__desc {font-size: 15px;}
    .dasoni-logo {margin-top: 40px;}
    .concept .sp-head .sp-tit {font-size: 32px;}
    .dasoni-concept-list {grid-template-columns: 1fr; gap: 24px;}
    .dasoni-concept-card__thumb {height: 300px;}
    .ai-persona .sp-head {margin-bottom: 60px;}
    .dasoni-persona-visual img:not(.mo-img) {display: none;}
    .dasoni-persona-visual .mo-img {display: inline-block; width: 100%; max-width: 100%;}
    .safe-trusted .sp-head .sp-tit {font-size: 32px;}
    .dasoni-cards-wrap--safe .dasoni-cards {gap: 48px;}
    .dasoni-cards-wrap--safe .dasoni-card {width: 100%; max-width: none; min-height: 0; padding: 0 18px 35px;}
    .dasoni-cards-wrap--safe .dasoni-card__desc {font-size: 15px;}
    .ai-tech__tit {font-size: 24px;}
    .ai-tech-card {flex-direction: column; align-items: flex-start; gap: 16px; padding: 20px 18px;}
    .ai-tech-card__icon {width: 80px; height: 80px;}
    .ai-tech-card__tit {font-size: 20px;}
    .ai-tech-card__desc {font-size: 15px; margin-top: 8px;}
    .technology .step-ls {gap: 28px;}
    .technology .step-ls .item {height: 120px;}
    .technology .step-ls .item .title {flex: 0 0 148px; width: 148px; height: 120px;}
    .technology .step-ls .item .title img,
    .technology .step-ls .item:nth-child(1) .title img,
    .technology .step-ls .item:nth-child(2) .title img,
    .technology .step-ls .item:nth-child(3) .title img,
    .technology .step-ls .item:nth-child(4) .title img {
      width: 142px;
      height: 148px;
    }
    .technology .step-ls .item:last-child .title img {
      width: 120px;
      height: 148px;
    }
    .technology .step-ls .item .title .txt-box {padding: 10px 12px;}
    .technology .step-ls .item .title .step {font-size: 11px; margin-bottom: 4px;}
    .technology .step-ls .item .title .tit {font-size: 13px;}
    .technology .step-ls .item .desc-box {height: 120px; padding: 10px 12px;}
    .technology .step-ls .item .desc-box .desc {font-size: 13px;}
    .safe-trusted .sp-head {margin-bottom: 60px;}
    .banner {height: auto; min-height: 320px;}
    .banner .container {
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 50px;
      padding-block: 60px;
      text-align: center;
    }
    .banner .txt-box h2 {font-size: 24px; text-align: center;}
    .banner .link-more {margin-inline: auto;}
  }
}

.insight-news {
  --insight-notice: #DB1AFF;

  .sp-head-section .sp-head {text-align: center; margin-bottom: 0;}
  .tab {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 13px; margin: 0; padding: 0; list-style: none;}
  .tab li {width: 185px; height: 50px; border-radius: 25px; border: 1px solid #919191; background-color: #fff;}
  .tab li a {display: block; width: 100%; height: 100%; font-size: 18px; font-weight: 400; color: #919191; line-height: 50px; text-align: center; border-radius: 25px;}
  .tab li.active a {font-weight: 700; color: #fff;}
  .tab li.tab--all.active a {border-color: #848484; background-color: #848484;}
  .tab li.tab--press.active a {border-color: var(--primary); background-color: var(--primary);}
  .tab li.tab--newsletter.active a {border-color: var(--secondary); background-color: var(--secondary);}
  .tab li.tab--notice.active a {border-color: var(--insight-notice); background-color: var(--insight-notice);}
  .total-count {font-size: 16px; font-weight: 700; margin-bottom: 22px;}
  .total-count .count {color: var(--primary);}
  .gall-ls--h {display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 20px; margin: 0; padding: 0; list-style: none;}
  .gall-ls--h > li {border-bottom: 0;}
  .gall-ls--h > li > a {display: block; padding-block: 0; gap: 0; align-items: stretch;}
  .gall-ls--h > li > a .thumb {position: relative; width: 100%; flex-shrink: 0; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; border: 1px solid #C2C2C2; background-color: #fff; margin-bottom: 30px;}
  .gall-ls--h > li > a .thumb img {display: block; width: 100%; height: 100%; object-fit: cover;}
  .gall-ls--h > li > a .content {display: block; width: 100%; gap: 0;}
  .gall-ls--h > li > a .content .wrap .tag {display: block; font-size: 18px; font-weight: 700; line-height: 1.4; margin-bottom: 12px;}
  .gall-ls--h > li > a .content .wrap .tag.press {color: var(--primary);}
  .gall-ls--h > li > a .content .wrap .tag.newsletter {color: var(--secondary);}
  .gall-ls--h > li > a .content .wrap .tag.notice {color: var(--insight-notice);}
  .gall-ls--h > li > a .content .wrap .tag span {color: #B1B1B1; font-weight: 400;}
  .gall-ls--h > li > a .content .wrap .title {display: block; font-size: 24px; font-weight: 700; line-height: 1.4; margin-bottom: 16px; color: #000;}
  .gall-ls--h > li > a .content .wrap .date {display: block; font-size: 18px; font-weight: 400; color: #B1B1B1;}
  .paging {padding-top: 80px;}
  .paging__btn {font-size: 18px; border-radius: 50%; background-color: #F3F3F3; color: #6A6A6A;}
  .paging__controller.disabled {opacity: .3;}
  .paging__num {background: #fff; color: #6A6A6A; border-radius: 50%; border: 0;}
  .paging__num.active {color: #fff !important; border: 0; background-color: var(--primary);}
}

@media (hover: hover) {
  .insight-news {
    .tab li.tab--all a:hover {font-weight: 700; color: #fff; border-color: #848484; background-color: #848484;}
    .tab li.tab--press a:hover {font-weight: 700; color: #fff; border-color: var(--primary); background-color: var(--primary);}
    .tab li.tab--newsletter a:hover {font-weight: 700; color: #fff; border-color: var(--secondary); background-color: var(--secondary);}
    .tab li.tab--notice a:hover {font-weight: 700; color: #fff; border-color: var(--insight-notice); background-color: var(--insight-notice);}
  }
}

@media screen and (max-width: 1399px) {
  .insight-news {
    .sp-head {margin-bottom: 40px;}
    .tab {gap: 10px;}
    .tab li {width: auto; min-width: 150px; height: 46px;}
    .tab li a {font-size: 17px; line-height: 46px;}
    .gall-ls--h {grid-template-columns: repeat(2, 1fr); gap: 40px 16px;}
    .gall-ls--h > li > a .thumb {width: 100%; margin-bottom: 24px;}
    .gall-ls--h > li > a .content .wrap .tag {font-size: 16px;}
    .gall-ls--h > li > a .content .wrap .title {font-size: 20px;}
    .gall-ls--h > li > a .content .wrap .date {font-size: 14px;}
    .paging {padding-top: 60px;}
  }
}

@media screen and (max-width: 767px) {
  .insight-news {
    .tab li {width: calc(50% - 7px); min-width: 140px; height: 42px;}
    .tab li a {font-size: 15px; line-height: 42px;}
    .total-count {font-size: 15px; margin-bottom: 18px;}
    .gall-ls--h {grid-template-columns: 1fr; gap: 40px;}
    .gall-ls--h > li > a .thumb {width: 100%; margin-bottom: 20px;}
    .gall-ls--h > li > a .content .wrap .title {font-size: 18px;}
    .paging {padding-top: 48px;}
  }
}

/* Contact - Online Inquiry */
.contact-inquiry {
  --inq-inp-bg: #F2F2F2;
  --inq-divider: #E5E5E5;
  --inq-inp-height: 52px;

  .sp-content {padding-block: 100px 160px;}
  .inq-form {--inp-height: var(--inq-inp-height); max-width: 1000px; margin-inline: auto; font-size: 16px;}

  .inq-form-notice {padding-bottom: 20px; margin-bottom: 0; border-bottom: 1px solid var(--inq-divider); font-size: 15px; font-weight: 400; color: #333; line-height: 1.5;}
  .inq-form-notice .req {color: var(--primary); font-weight: 700;}

  .inq-form-table {border-top: 0; font-size: 16px;}
  .inq-form-table colgroup .col--th {width: 160px;}
  .inq-form-table colgroup .col--td {width: calc(100% - 160px);}
  .inq-form-table tbody tr :where(th, td) {padding-block: 14px; vertical-align: top;}
  .inq-form-table tbody tr th .label {display: flex; align-items: flex-start; min-height: 0; padding-top: 14px; font-size: 18px; font-weight: 700; color: #222; line-height: 1.4;}
  .inq-form-table tbody tr th span.req {color: var(--primary); font-weight: 700;}

  .inq-form .dd-inp .inp-box {height: var(--inq-inp-height); border: 0; background: var(--inq-inp-bg); border-radius: 999px;}
  .inq-form .dd-inp .inp-box:has(textarea) {height: 200px; border-radius: 16px;}
  .inq-form .dd-inp .inp-box textarea,
  .inq-form .dd-inp .inp-box .inp {font-size: 16px; font-weight: 400; color: #222; line-height: 1.5;}
  .inq-form .dd-inp input::placeholder,
  .inq-form .dd-inp textarea::placeholder {color: #999; opacity: 1;}
  .inq-form .dd-inp .inp-box textarea {padding-block: 16px;}
  .inq-form .dd-inp .inp-error {font-size: 13px; padding-top: 8px;}

  .inq-form .dd-file .file-box {height: var(--inq-inp-height);}
  .inq-form .dd-file .file-box label .label {border: 0; background: var(--inq-inp-bg); border-radius: 999px; font-size: 16px; color: #999;}
  .inq-form .dd-file .file-box label .btn-find {width: 100px; border: 0; border-radius: 999px; background: #333; color: #fff; font-size: 14px; font-weight: 500;}
  .inq-form .dd-file .file-box .btn-cancel {border: 0; border-radius: 50%; background: #ADADAD; color: #fff;}
  .inq-form .dd-file .inp-notice {margin-top: 8px; font-size: 13px; color: #999; text-align: left; line-height: 1.5;}

  .dd-form-indiv-policy {margin-top: 110px; padding-top: 0;}
  .dd-form-indiv-policy .title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 28px 15px;
    margin-bottom: 0;
    border-top: 1px solid #7B7B7B;
    border-bottom: 1px solid #D2D2D2;
    font-size: inherit;
    color: inherit;
    font-weight: inherit;
  }
  .dd-form-indiv-policy .title .checkbox {flex: 1;}
  .dd-form-indiv-policy .title .checkbox label {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    cursor: pointer;
  }
  .dd-form-indiv-policy .title .checkbox label input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
  }
  .dd-form-indiv-policy .title .checkbox label .chck {
    display: inline-block;
    width: 28px;
    height: 28px;
    background-image: url(../images/subpage/contact/checkbox-unchecked.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
  }
  .dd-form-indiv-policy .title .checkbox label input[type="checkbox"]:checked ~ .chck {
    background-image: url(../images/subpage/contact/checkbox-checked.svg);
  }
  .dd-form-indiv-policy .title .label {
    font-size: 26px;
    font-weight: 700;
    color: #000;
    line-height: 1.4;
  }
  .dd-form-indiv-policy .title .label .req {color: var(--primary); font-weight: 700;}
  .dd-form-indiv-policy .title .inp-error {
    display: block;
    flex-basis: 100%;
    padding-left: 38px;
    font-size: 16px;
    font-weight: 400;
    color: var(--invalid1, #df1717);
  }
  .dd-form-indiv-policy .title .inp-error:empty {display: none;}
  .dd-form-indiv-policy .title .policy-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    padding: 0;
    border: 0;
    background: none;
    font-size: 16px;
    font-weight: 500;
    color: #848484;
    cursor: pointer;
    transition: color 0.3s;
  }
  .dd-form-indiv-policy .title .policy-toggle .icon {
    font-size: 14px;
    transition: transform 0.3s ease;
  }
  .dd-form-indiv-policy .title .policy-toggle[aria-expanded="false"] .icon {transform: rotate(180deg);}
  .dd-form-indiv-policy .content-wrapper {
    overflow: hidden;
    max-height: 3000px;
    transition: max-height 0.3s ease, opacity 0.3s ease;
  }
  .dd-form-indiv-policy .content-wrapper.closed {max-height: 0;}
  .dd-form-indiv-policy .content {
    height: auto;
    padding: 30px 15px;
    border: 0;
    border-bottom: 1px solid #D2D2D2;
    background-color: #fff;
    overflow: visible;
    transition: opacity 0.3s ease;
  }
  .dd-form-indiv-policy .content-wrapper.closed .content {opacity: 0;}
  .dd-form-indiv-policy .indiv-doc > span.p2 {
    display: block;
    font-size: 18px;
    font-weight: 700;
    color: #000;
    line-height: 1.6;
    word-break: keep-all;
  }
  .dd-form-indiv-policy .indiv-doc > p.p2 {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    color: #707070;
    word-break: keep-all;
  }
  .dd-form-indiv-policy .indiv-doc dl.p3 {margin-top: 0;}
  .dd-form-indiv-policy .indiv-doc dl.p3 dt {
    font-size: 18px;
    font-weight: 700;
    color: #000;
    padding-left: 17px;
    position: relative;
    line-height: 1.6;
    word-break: keep-all;
  }
  .dd-form-indiv-policy .indiv-doc dl.p3 dt::before {
    content: '';
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #000;
    position: absolute;
    top: 0.75em;
    left: 0;
    transform: translateY(-50%);
  }
  .dd-form-indiv-policy .indiv-doc dl.p3 dd,
  .dd-form-indiv-policy .indiv-doc dl.p3 li {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    color: #707070;
    padding-left: 17px;
    word-break: keep-all;
  }
  .dd-form-indiv-policy.dd-inp--invalid .title .label {color: var(--invalid1, #df1717);}

  .inq-form-foot {display: flex; justify-content: center; padding-top: 50px;}
  .inq-form-foot .inq-submit {min-width: 300px; height: var(--inq-inp-height); padding: 0 40px; border: 0; border-radius: 999px; background: #222; font-size: 17px; font-weight: 700; color: #fff; transition: background-color .3s ease;}
}

@media (hover: hover) {
  .contact-inquiry {
    .inq-form-foot .inq-submit:hover {background: #000;}
    .inq-form .dd-file .file-box label .btn-find:hover {background: #111; color: #fff;}
    .dd-form-indiv-policy .title .policy-toggle:hover {color: var(--navy, #003471);}
  }
}

@media screen and (max-width: 1399px) {
  .contact-inquiry {
    .sp-content {padding-block: 80px 120px;}
    .inq-form-table colgroup .col--th {width: 140px;}
    .inq-form-table colgroup .col--td {width: calc(100% - 140px);}
    .inq-form-table tbody tr th .label {font-size: 17px;}
    .dd-form-indiv-policy {margin-top: 80px;}
    .inq-form-foot .inq-submit {width: auto;}
  }
}

@media screen and (max-width: 767px) {
  .contact-inquiry {
    .sp-content {padding-block: 60px 100px;}

    .inq-form-notice {font-size: 14px; padding-bottom: 16px;}

    .inq-form-table {display: block;}
    .inq-form-table colgroup {display: none;}
    .inq-form-table :where(tbody, tr, th, td) {display: block;}
    .inq-form-table tbody tr {padding-block: 10px;}
    .inq-form-table tbody tr :where(th, td) {padding-block: 10px;}
    .inq-form-table tbody tr th {padding: 0 0 8px;}
    .inq-form-table tbody tr th .label {min-height: 0; font-size: 15px; padding-top: 0;}
    .inq-form-table tbody tr td {padding-top: 0;}

    .inq-form .dd-inp .inp-box {height: 48px;}
    .inq-form .dd-inp .inp-box:has(textarea) {height: 160px;}
    .inq-form .dd-inp .inp-box textarea,
    .inq-form .dd-inp .inp-box .inp {font-size: 15px;}

    .dd-form-indiv-policy {margin-top: 60px;}
    .dd-form-indiv-policy .title {padding: 20px 0; gap: 12px;}
    .dd-form-indiv-policy .title .label {font-size: 20px;}
    .dd-form-indiv-policy .title .policy-toggle {font-size: 14px;}
    .dd-form-indiv-policy .content {padding: 24px 0;}
    .dd-form-indiv-policy .indiv-doc > span.p2,
    .dd-form-indiv-policy .indiv-doc > p.p2,
    .dd-form-indiv-policy .indiv-doc dl.p3 dt,
    .dd-form-indiv-policy .indiv-doc dl.p3 dd,
    .dd-form-indiv-policy .indiv-doc dl.p3 li {font-size: 16px;}

    .inq-form-foot .inq-submit {width: 100%; min-width: 0; font-size: 16px;}
  }
}

/* Insight - News View */
@media screen and (max-width: 1399px) {
  .subpage-wrapper .board-view {padding-top: 0; border-top-width: 1px;}
  .subpage-wrapper .board-view-aside aside {position: static; top: auto;}
  .subpage-wrapper .board-view-body {padding-block: 36px;}
}

@media screen and (max-width: 767px) {
  .subpage-wrapper .board-view-head {gap: 20px;}
  .subpage-wrapper .board-view-head .title {font-size: 20px;}
  .subpage-wrapper .board-view-body {padding-block: 28px;}
  .subpage-wrapper .board-view .btn-list {width: 100%; max-width: none;}
}