@media only screen and (max-width: 700px) {
  :root {
    --fs-h1: 32px;
    --fs-h2: 28px;
    --fs-h3: 20px;
    --fs-h4: 19px;
    --fs-h5: 18px;
    --fs-h6: 17px;
    --fs-h7: 16px;
    --fs-h8: 15px;
    --fs-h9: 13px;
    --fs-h10: 12px;
    --fs-title: 36px;
    --header-height: 60px;
  }
  .nl-container {
    padding: 0 20px;
  }
  .nl-header .nl-nav {
    justify-content: space-between;
    height: 100%;
  }
  .nl-header .nl-nav .nl-logo {
    width: 164px;
    display: flex;
    align-items: center;
  }
  .nl-header .nl-nav .nl-menu {
    display: none;
  }
  .nl-header .nl-nav .nl-right-side {
    gap: 20px;
  }
  .nl-header .nl-nav .nl-right-side .nl-btn {
    height: 40px;
    font-size: var(--fs-h9);
    padding: 0 14px;
  }
  .nl-header .nl-nav .nl-right-side .nl-btn-menu {
    padding: 0;
  }
  .nl-header .nl-nav .nl-right-side .nl-btn-menu img {
    width: 24px;
  }
  .nl-container-w {
    padding-left: 20px;
    padding-right: 20px;
  }
  .nl-footer {
    width: 100%;
    flex-wrap: wrap;
    padding-top: 30px;
  }
  .nl-footer .nl-footer-info {
    flex-wrap: wrap;
    width: 100%;
  }
  .nl-footer .nl-footer-info .nl-col-info {
    flex: unset;
    width: 100%;
    text-align: left;
    flex-wrap: wrap;
  }
  .nl-footer .nl-footer-info .nl-col-info.--right {
    justify-content: flex-start;
    margin-top: 20px;
  }
  .nl-footer .nl-footer-info .nl-col-info .nl-line-info, .nl-footer .nl-footer-info .nl-col-info .nl-info {
    width: 100%;
    flex-wrap: wrap;
    font-size: var(--fs-h10);
  }
  /* .nl-banner-text {
    left: 30px;
    right: 30px;
  } */
   .nl-banner-text h1,
   .nl-banner-text p {
    max-width: 220px;
   }
  .nl-main-banner .nl-slide-action {
    left: 30px;
    width: 200px;
  }
  .nl-main-banner .nl-slide-action .swiper-pagination-bullet {
    width: 30px;
    height: 4px;
  }
  .nl-guide-scroll {
    right: 70px !important;
  }
   .nl-guide-scroll svg {
    width: 20px;
    height: auto;
   }

  .nl-main .nl-sect-sub-title,
  .sec-our-partner .nl-sect-sub-title {
    font-size: var(--fs-h5);
  }
  .nl-bussiness-area .nl-card-list {
    display: block;
    border-bottom: 0 !important;
    margin-top: 30px;
    padding-top: 0;
    padding-bottom: 10px;
  }
  .nl-bussiness-area .nl-card-list .nl-card-item {
    transform: none !important;
    margin-bottom: 30px;
    padding: 26px;
    height: 190px;
    background-position: calc(100% - 30px) calc(100% - 30px);
    background-size: 50px auto;
  }
  .nl-bussiness-area .nl-card-list .nl-card-item .nl-detail {
    font-size: var(--fs-h6);
  }
  .nl-bussiness-area .nl-card-list .nl-card-item::after {
    display: none;
  }
  .nl-main .sec-about-feature {
      padding: 0;
  }
  .nl-main .sec-about-feature .nl-about-us {
    padding-bottom: 30px;
  }
   .nl-about-us .nl-right-side {
    margin-top: 20px;
  }
  .nl-about-us .nl-left-side img {
    width: 100%;
    height: auto;
    max-width: 440px;
    margin: 0 auto;
  }
  .nl-about-us .nl-right-side .nl-view-more {
    font-size: var(--fs-h6);
  }
  .nl-about-us .nl-right-side .nl-view-more svg {
    height: 16px;
  }
  .nl-about-us .nl-right-side .nl-view-more::after {
    position: absolute;
    content: "";
    height: 40px;
    width: 40px;
    border-radius: 100%;
    left: -1px;
    top: -3px;
    background-color: #E9E9E9;
    z-index: -1;
  }

  .nl-main .sec-about-feature .nl-feature {
    background-size: auto 32px;
    background-position: 22px 28px;
    padding-top: 0;
    padding-bottom: 10px;
  }
   .nl-feature .nl-btn-goto {
    margin-top: 20px;
    font-size: var(--fs-h6);
  }
   .nl-feature .nl-list {
   flex-direction: column;
   margin-top: 28px;
   }
   .nl-feature .nl-list .nl-item .nl-content {
    padding: 16px 26px;
    font-size: var(--fs-h5);

  }
   .nl-feature .nl-list .nl-item .nl-content svg {
    right: 10px;
  }
  .nl-main .sec-bussiness-area-our-solution {
    padding: 30px 40px;
  }

  .nl-main .sec-bussiness-area-our-solution .nl-our-solution {
    display: block;
    margin-top: 0;
  }

  .nl-our-solution .nl-right-side {
    flex-wrap: wrap;
    margin-top: 30px;
  }
  .nl-our-solution .nl-right-side .nl-step {
    /* min-height: 400px; */
    padding: 20px;
    width: 100%;
    display: flex;
    gap: 10px;
    align-items: center;

  }
  .nl-our-solution .nl-right-side .nl-step .nl-preview,
  .nl-our-solution .nl-right-side .nl-step .nl-content .nl-head {
    display: flex;
    gap: 10px;
    align-items: center;
  }
   .nl-our-solution .nl-right-side .nl-step.active {
    flex: unset;
   }
   .nl-our-solution .nl-right-side .nl-step .nl-content .nl-detail {
    height: unset;
    padding-top: 10px;
    padding-bottom: 10px;
   }
  .nl-our-solution .nl-right-side .nl-step .nl-mark-num {
    width: 40px;
    height: 40px;
  }
  .nl-our-solution .nl-right-side .nl-step.active .nl-text {
    line-height: 1.2;
    margin-top: 6px;

  }
  .nl-our-solution .nl-right-side .nl-step:not(.active) .nl-text {
    transform: rotate(0) translateX(0);
  }
  .nl-our-solution .nl-right-side .nl-step img {
    height: 140px;
  }
  .nl-main .sec-support {
    margin-top: 40px;
    margin-bottom: 10px;
  }
  .nl-main .nl-sec .nl-sec-title {
    margin-bottom: 18px;
  }
  .nl-logo-partner {
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: 30px;
  }
  .nl-scroll-top {
    width: 40px;
    height: 40px;
    right: 10px;
  }
  .nl-scroll-top svg {
    height: 12px;
    width: auto;
  }
  .nl-text-on-video h1 {
    font-size: 36px;
    margin-bottom: 10px;
  }
  .nl-text-on-video p {
    font-size: 24px;
  }

  .nl-btn-skip svg {
      width: 16px;
      height: auto;
  }
  .nl-page-banner .banner {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
  }
  .nl-banner-content {
    bottom: 60px;
    margin-bottom: 10px;
  }
  .nl-navigation-menu .nav-icon {
    height: 40px;
    width: 40px;
  }
  .nl-nav-options .nl-option {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .nl-footer-options {
    left: 0;
    right: auto;
  }
  .nl-header .nl-nav .nl-btn-menu {
    display: block;
  }
  .nl-nav-select {
    height: 40px;
    min-width: 180px;
  }
  .nl-about-us .nl-right-side .nl-sect-sub-title {
    padding-left: 0;
  }
  .nl-popup-policy .mini-popup-content {
    max-height: calc(90vh - 140px);
    scrollbar-width: none;
  }
  .nl-popup-policy .nl-policy .nl-title {
    line-height: 28px;
  }
   .nl-popup-policy .nl-policy .nl-content {
    margin-bottom: 26px;
  }
  .nl-notice-detail-bottom {
    margin-top: 20px;
    padding-bottom: 50px;
  }
  .nl-notice-detail .board-wrapper {
    margin-top: 20px;
  }
  .nl-policy .board-wrapper {
    padding-bottom: 0;
  }
  .company-intro .intro-text p {
    margin-bottom: 16px;
  }
  .file-name {
    width: 220px;
  }
  .nl-table-empty {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .nl-table-empty img {
    width: 30px;
    height: auto;
  }
  .nl-partner .swiper-button-prev {
   left: 10px;
  }
  .nl-partner .swiper-button-next {
    right: 10px;
  }
  .nl-partner .swiper-button-prev, .nl-partner .swiper-button-next {
    width: 34px;
    height: 34px;
    margin-top: 20px;
  }
  .nl-partner .swiper-button-prev::after, .nl-partner .swiper-button-next::after {
    font-size: 15px;
  }
  .nl-partner .outstanding-content {
    padding-bottom: 30px;
  }
}
@media only screen and (min-width: 701px) and (max-width: 1280px) {
  :root {
    --fs-h1: 50px;
    --fs-h2: 38px;
    --fs-h3: 26px;
    --fs-h4: 24px;
    --fs-h5: 22px;
    --fs-h6: 20px;
    --fs-h7: 18px;
    --fs-h8: 16px;
    --fs-h9: 14px;
    --fs-h10: 10px;
    --fs-title: 36px;
    --header-height: 90px;
  }
  body {
    font-size: 14px;
  }
  .nl-text-on-video h1 {
    font-size: 40px;
    margin-bottom: 10px;
  }
  .nl-text-on-video p {
    font-size: 28px;
  }

  .nl-btn-skip svg {
      width: 16px;
      height: auto;
  }
  .nl-header .nl-nav .nl-btn-menu {
    display: block;
  }
  .nl-main .nl-container {
    padding: 0;
  }
  .nl-main .nl-sec {
    margin-top: 40px;
  }
  .nl-main .sec-bussiness-area-our-solution {
    padding: 40px 32px;
  }
   .nl-bussiness-area .nl-card-list {
    gap: 10px;
    margin-top: 30px;
    padding-bottom: 30px;
    margin-left: -20px;
    margin-right: -20px;
  }
   .nl-bussiness-area .nl-card-list .nl-card-item {
    padding: 20px;
    background-position: calc(100% - 30px) calc(100% - 30px);
  }
   .nl-bussiness-area .nl-card-list .nl-card-item .nl-name {
    padding-left: 10px;
    font-size: var(--fs-h5);
  }
  .nl-bussiness-area .nl-card-list .nl-card-item .nl-detail {
    font-size: var(--fs-h6);
  }
   .nl-bussiness-area .nl-card-list .nl-card-item.active::after {
    bottom: -73px;
  }
   .nl-our-solution .nl-right-side .nl-step {
    padding: 24px 14px;
    width: 60px;
    gap: 10px !important;
  }
   .nl-our-solution .nl-right-side .nl-step .nl-text {
    font-size: var(--fs-h6) !important;
    line-height: 30px !important;
  }
   .nl-our-solution .nl-right-side .nl-step .nl-mark-num {
    font-size: var(--fs-h8) !important;
    width: 30px;
    height: 30px;
  }
  .nl-our-solution .nl-right-side .nl-step img {
    height: 230px;
  }
  .nl-main .sec-about-feature {
    padding: 0 32px;
  }
  .nl-main .sec-about-feature .nl-about-us .nl-left-side {
    width: 46%;
  }
  .nl-main .sec-about-feature .nl-feature .nl-list {
    gap: 15px;
  }
  .nl-main .sec-about-feature .nl-feature .nl-list .nl-content {
    padding: 20px;
  }
  .nl-main .sec-support {
    height: 380px;
    margin-bottom: 50px;
    border-radius: 0 !important;
  }
  .nl-header .nl-nav .nl-menu {
    display: none !important;
  }
  .nl-header .nl-nav .nl-right-side {
    margin-left: auto;
  }
  .nl-footer .nl-container-w {
    display: block !important;
    padding: 0 32px;
  }
  .nl-footer .nl-footer-info {
    flex-wrap: wrap;
  }
  .nl-footer .nl-footer-info .nl-col-info {
    flex: unset;
    width: 100%;
  }
  .nl-footer .nl-footer-info .nl-col-info.--right {
    justify-content: flex-start;
    margin-top: 20px;
  }
  .nl-page-banner .banner {
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 1;
  }
  .nl-banner-content {
    bottom: 110px;
    margin-bottom: 10px;
  }
  .nl-navigation-menu .nav-icon {
    height: 50px;
    width: 50px;
  }
  .nl-nav-options .nl-option {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .nl-nav-select {
    height: 50px;
  }
  .nl-notice-detail-bottom {
    margin-top: 40px;
    padding-bottom: 100px;
  }
  .nl-notice-detail .board-wrapper {
    margin-top: 30px;
  }
  .nl-policy .board-wrapper {
    padding-bottom: 0;
  }
  .company-intro .intro-text p {
    margin-bottom: 16px;
  }
  .file-name {
    width: 260px;
  }
  .nl-table-empty {
    padding-top: 100px;
    padding-bottom: 100px;
  }
    .nl-partner .swiper-button-prev {
   left: 10px;
  }
  .nl-partner .swiper-button-next {
    right: 10px;
  }
  .nl-partner .swiper-button-prev, .nl-partner .swiper-button-next {
    width: 34px;
    height: 34px;
    z-index: 199;
    margin-top: 30px;
  }
  .nl-partner .swiper-button-prev::after, .nl-partner .swiper-button-next::after {
    font-size: 15px;
  }
  .nl-partner .outstanding-content {
    padding-bottom: 30px;
  }
}/*# sourceMappingURL=responsive.css.map */
